:root {
  color-scheme: light;
  --bg:#fff; --fg:#080808; --muted:#666; --card:#fff; --border:#e8e8e8;
  --soft:#f5f5f5; --accent:#d7ef3f; --accent-hover:#c8e329; --on-accent:#171a0b;
  --link:#245c42; --success:#167445; --error:#b42318; --footer:#f8f8f8;
  --radius:8px; --shadow:none;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px;
}
[data-theme=dark] {
  color-scheme:dark; --bg:#141414; --fg:#f3f3f3; --muted:#b3b3b3; --card:#1b1b1b;
  --border:#383838; --soft:#262626; --accent-hover:#e0f466; --link:#a9d6b8;
  --success:#86d5ac; --error:#ff9b93; --footer:#1b1b1b;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.75 "Pretendard Variable",Pretendard,system-ui,-apple-system,"Segoe UI","Malgun Gothic",sans-serif; word-break:keep-all; overflow-wrap:anywhere; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button,summary { cursor:pointer; }
button:disabled { cursor:default; opacity:.45; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid var(--link); outline-offset:4px; }
a:hover { color:var(--link); }
p,h1,h2,h3 { margin-top:0; }
p { margin-bottom:var(--space-4); }
h1 { font-size:30px; line-height:1.3; letter-spacing:-.035em; margin-bottom:var(--space-4); }
h2 { font-size:28px; line-height:1.4; letter-spacing:-.03em; margin-bottom:var(--space-6); }
h3 { font-size:18px; line-height:1.5; font-weight:650; margin-bottom:var(--space-2); }
.container { width:min(1280px,calc(100% - 48px)); margin-inline:auto; }
main.container { min-height:65vh; padding-block:var(--space-10) var(--space-16); }
.muted,.subtitle,.source-note { color:var(--muted); }
.subtitle { font-size:18px; }
.source-note { font-size:14px; margin-top:var(--space-4); }
.source-note a,.prose a { color:var(--link); text-decoration:underline; text-underline-offset:3px; }
.section { margin-top:var(--space-16); }
.section-head { display:flex; justify-content:space-between; align-items:baseline; gap:var(--space-4); margin-bottom:var(--space-5); }
.section-head h2 { margin:0; }
.section-head a { font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.eyebrow { font-size:12px; font-weight:650; letter-spacing:.1em; color:var(--muted); margin-bottom:var(--space-3); }
.card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:var(--space-6); box-shadow:var(--shadow); min-width:0; }
main > .card + .card,main > .card + .grid,main > .grid + .card { margin-top:var(--space-6); }
.grid { display:grid; gap:var(--space-5); grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); }
.two-columns,.feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:var(--space-2); min-height:44px; padding:var(--space-2) var(--space-5); border:1px solid var(--border); border-radius:6px; background:var(--card); color:var(--fg); font-weight:600; text-align:center; }
.btn:hover { background:var(--soft); color:var(--fg); }
.btn:active { opacity:.75; }
.btn-primary { background:var(--accent); color:var(--on-accent); border-color:transparent; }
.btn-primary:hover { background:var(--accent-hover); color:var(--on-accent); }
.btn-quiet { background:transparent; border-color:transparent; }
.chip { display:inline-flex; align-items:center; gap:6px; background:var(--soft); color:var(--fg); padding:var(--space-1) var(--space-3); border:0; border-radius:6px; font-size:14px; font-weight:500; }
button.chip { min-height:44px; }
label { display:block; font-size:14px; font-weight:600; margin-bottom:var(--space-2); }
input,select,textarea { width:100%; min-height:46px; padding:var(--space-2) var(--space-3); color:var(--fg); background:var(--card); border:1px solid var(--border); border-radius:6px; }
input[type=checkbox] { width:auto; min-height:auto; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-5); }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-5); }
.status { min-height:24px; margin-top:var(--space-3); color:var(--muted); font-size:14px; }
.error { color:var(--error); }
.big-clock { font-variant-numeric:tabular-nums; font-size:clamp(44px,11vw,132px); font-weight:800; letter-spacing:-.045em; line-height:1.15; white-space:nowrap; }
.site-header { position:relative; z-index:5; background:var(--bg); border-bottom:1px solid var(--border); }
.header-inner { display:flex; align-items:center; gap:var(--space-6); min-height:72px; }
.wordmark { font-size:22px; font-weight:750; letter-spacing:-.04em; white-space:nowrap; color:var(--fg); }
.wordmark span { font-weight:400; }
.site-nav { display:flex; flex:1; align-items:center; gap:var(--space-1); }
.site-nav > a { display:flex; align-items:center; min-height:44px; padding:var(--space-2) var(--space-3); font-size:15px; font-weight:600; white-space:nowrap; border-radius:6px; }
.site-nav a:hover,.site-nav a[aria-current=page] { background:var(--soft); color:var(--fg); }
.site-nav a[aria-current=page] { font-weight:700; }
.header-actions { display:flex; gap:var(--space-2); margin-left:auto; }
.theme-toggle { font-size:14px; padding-inline:var(--space-3); white-space:nowrap; }
.menu-toggle { display:none; }
.skip-link { position:absolute; top:-100px; left:16px; z-index:20; padding:var(--space-3); background:var(--card); }
.skip-link:focus { top:10px; }
.site-footer { border-top:1px solid var(--border); background:var(--footer); padding-block:var(--space-8) var(--space-5); }
.footer-top { display:grid; grid-template-columns:2fr 1fr 1fr; gap:var(--space-12); }
.footer-description { max-width:360px; color:var(--muted); font-size:14px; margin-top:var(--space-3); }
.footer-links { display:grid; grid-template-columns:repeat(2,max-content); column-gap:var(--space-6); font-size:14px; }
.footer-links a { display:flex; align-items:center; min-height:32px; }
.footer-title { font-size:14px; font-weight:650; margin-bottom:var(--space-3); }
.footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--space-3); font-size:14px; color:var(--muted); margin-top:var(--space-6); border-top:1px solid var(--border); padding-top:var(--space-4); }
.footer-bottom p { margin:0; }
.clock-hero { position:relative; padding-block:var(--space-12) var(--space-8); }
.clock-controls { display:flex; justify-content:end; gap:var(--space-2); }
.clock-hero .big-clock { font-size:clamp(48px,14vw,192px); font-weight:900; letter-spacing:-.06em; text-align:center; margin-block:var(--space-8) var(--space-12); }
.clock-meta { display:flex; flex-direction:column; align-items:end; gap:var(--space-2); color:var(--muted); }
.clock-date { font-size:20px; margin:0; }
.clock-meta p { margin:0; }
.clock-label { text-align:right; margin-top:var(--space-4); font-size:24px; }
.clock-hero:fullscreen { background:var(--bg); display:flex; flex-direction:column; justify-content:center; padding:var(--space-6); }
.clock-hero:fullscreen .big-clock { font-size:clamp(48px,20vw,300px); }
.timer-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:var(--space-3); }
.timer-preset { display:flex; flex-direction:column; align-items:start; justify-content:center; gap:var(--space-2); min-height:104px; padding:var(--space-4); }
.timer-preset strong { font-size:24px; line-height:1.2; }
.timer-preset small { font-size:14px; font-weight:400; color:var(--muted); }
.holiday-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.holiday-card { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:var(--space-3); align-items:center; }
.holiday-emoji { font-size:28px; line-height:1; text-align:center; }
.holiday-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; }
.holiday-mark { display:flex; justify-content:center; align-items:center; width:44px; height:44px; background:var(--soft); border-radius:6px; font-size:14px; font-weight:600; }
.holiday-card h3 { font-size:16px; margin:0 0 var(--space-1); }
.holiday-card time { color:var(--muted); font-size:14px; white-space:nowrap; }
.holiday-dday { padding:4px 10px; border-radius:100px; background:var(--accent); color:var(--on-accent); font-size:14px; font-weight:700; white-space:nowrap; }
.holiday-card .chip { font-size:12px; }
.tool-card { display:block; position:relative; }
.tool-card:hover,.holiday-card:hover { background:var(--soft); color:var(--fg); }
.tool-card .tool-mark { display:block; color:var(--muted); font-size:12px; letter-spacing:.08em; font-weight:600; margin-bottom:var(--space-4); }
.tool-card p { color:var(--muted); font-size:14px; margin-bottom:var(--space-4); }
.tool-card .tool-arrow { font-size:14px; font-weight:600; }
.feature-grid p { font-size:14px; color:var(--muted); margin:0; }
.card.prose > h2:first-child { margin-top:0; }
.prose h2 { margin-top:var(--space-10); font-size:24px; }
.prose p,.prose li { color:var(--muted); }
.prose li { margin-bottom:var(--space-2); }
.prose p:last-child { margin-bottom:0; }
.content-intro { color:var(--muted); }
.faq-list { border-top:1px solid var(--border); }
.faq-list details { border-bottom:1px solid var(--border); }
.faq-list summary { display:flex; justify-content:space-between; gap:var(--space-4); align-items:center; list-style:none; min-height:64px; padding-block:var(--space-4); font-weight:600; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; flex:none; font-weight:400; font-size:24px; }
.faq-list details[open] summary::after { content:'−'; }
.faq-list details p { padding-bottom:var(--space-4); margin:0; color:var(--muted); }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; text-align:left; font-size:14px; }
th,td { padding:var(--space-3) var(--space-4); border-bottom:1px solid var(--border); white-space:nowrap; }
thead { background:var(--soft); } th { font-weight:600; }
td a { color:var(--link); display:inline-flex; align-items:center; min-height:44px; }
#city-grid { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:var(--space-2); }
.city-link { padding:12px 14px; }
.city-link p { white-space:nowrap; }
.city-link h3 { margin:0; font-size:16px; }
.city-link p { margin:0; font-size:15px; }
:is(input,select) + :is(label,h2,.btn,button) { margin-top:var(--space-4); }
#dst-us-europe td:first-child { white-space:normal; min-width:6.5em; }
#dst-us-europe :is(th,td) { padding-inline:6px; }
.holiday-past { color:var(--muted); } .holiday-today { background:var(--soft); }
.holiday-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--space-4); margin-block:var(--space-5); }
.holiday-controls > div { display:flex; align-items:center; gap:var(--space-3); }
.holiday-controls label { margin:0; } .holiday-controls select { width:140px; }
.result-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-5); margin-top:var(--space-6); }
.result-time { font-size:clamp(28px,5vw,48px); font-weight:750; font-variant-numeric:tabular-nums; }
.page-heading { margin-bottom:var(--space-8); }
.breadcrumb { color:var(--muted); font-size:14px; margin-bottom:var(--space-5); }
.guide-meta { font-size:14px; color:var(--muted); }
.screen-reader-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:1100px) { .site-nav > a { padding-inline:var(--space-2); } .header-inner { gap:var(--space-4); } .holiday-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:960px) {
  .header-inner { flex-wrap:wrap; padding-block:var(--space-3); min-height:68px; }
  .header-actions { order:1; } .menu-toggle { display:inline-flex; }
  .site-nav { order:2; flex-basis:100%; display:none; flex-wrap:wrap; padding-block:var(--space-3); gap:var(--space-2); }
  .site-nav.is-open { display:flex; }
  .timer-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(max-width:700px) {
  #holiday-leave-plan :is(th,td) { white-space:normal; padding-inline:6px; }
  #city-grid { grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); } #city-grid .city-link { padding:12px 10px; } .city-link p:last-child { font-size:14px; }
  .footer-links { display:flex; flex-direction:column; align-items:start; } .footer-links a { min-height:44px; }
  th,td { padding:12px 8px; } th[scope=row] { white-space:normal; }
  body { font-size:17px; } .container { width:calc(100% - 32px); }
  main.container { padding-block:var(--space-8) var(--space-12); }
  h1 { font-size:28px; } h2 { font-size:24px; } .subtitle { font-size:17px; }
  .section { margin-top:var(--space-12); }
  .section-head { align-items:start; flex-wrap:wrap; }
  .section-head a,.source-note,label,.guide-meta { font-size:15px; }
  .card { padding:var(--space-5); }
  .two-columns,.feature-grid,.form-grid,.result-grid { grid-template-columns:1fr; }
  .holiday-grid { grid-template-columns:1fr; } .timer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .timer-preset { min-height:96px; }
  .clock-hero { padding-block:var(--space-4); }
  .clock-hero .big-clock { font-size:clamp(40px,13.5vw,92px); margin-block:var(--space-8); }
  .clock-date { font-size:16px; } .clock-label { font-size:20px; }
  .footer-top { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-8); }
  .footer-about { grid-column:1 / -1; }
  .footer-description,.tool-card p,.feature-grid p,.holiday-card time,.footer-links { font-size:15px; }
  .prose { width:100%; } .big-clock { font-size:clamp(36px,12vw,80px); }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }