:root{--font-sans: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.375rem;--text-2xl: 1.75rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--shadow-float: 0 2px 8px rgb(0 0 0 / .12);--shadow-sheet: 0 -4px 16px rgb(0 0 0 / .1);--bg: #ffffff;--surface: #ffffff;--border: #e5e8eb;--text: #191f28;--text-muted: #6b7684;--accent: #24478f;--accent-contrast: #ffffff;--route-safe: #24478f;--route-short: #8b95a1;--quiet: #e58a2a;--warn: #b96a16;--danger: #c2473d;--ok: #3b8b4d;--heat-1: #8f2f28;--heat-2: #d25f2a;--heat-3: #e6b24a;--heat-4: #86b85e;--heat-5: #3b8b4d;--duration: .2s;--ease: cubic-bezier(.2, 0, 0, 1)}[data-theme=night]{--font-sans: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.375rem;--text-2xl: 1.75rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--shadow-float: 0 2px 10px rgb(0 0 0 / .35);--shadow-sheet: 0 -4px 20px rgb(0 0 0 / .42);--bg: #111827;--surface: #1f2937;--border: #374151;--text: #f8fafc;--text-muted: #cbd5e1;--accent: #3d63c9;--accent-contrast: #ffffff;--route-safe: #7aa2f7;--route-short: #94a3b8;--quiet: #f6ad55;--warn: #f59e0b;--danger: #f87171;--ok: #86efac;--heat-1: #f87171;--heat-2: #fb923c;--heat-3: #facc15;--heat-4: #a3e635;--heat-5: #4ade80;--duration: .2s;--ease: cubic-bezier(.2, 0, 0, 1)}*{box-sizing:border-box}:root{color:var(--text);background:var(--bg);font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizeLegibility}body{margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.62}a{color:inherit}.app-shell{min-height:100vh;background:var(--bg)}.top-bar{align-items:center;background:var(--surface);border-bottom:1px solid var(--border);display:flex;gap:var(--space-4);justify-content:space-between;padding:var(--space-4) var(--space-5);position:sticky;top:0;z-index:10}.brand{font-size:var(--text-lg);font-weight:800;text-decoration:none}nav{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:flex-end}nav a{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:var(--text-sm);padding:var(--space-2) var(--space-3);text-decoration:none}main{min-height:calc(100vh - 68px)}h1,h2,p,dl,dd{margin:0}.eyebrow{color:var(--accent);font-size:var(--text-sm);font-weight:700}.helper-text,.status-text{color:var(--text-muted);font-size:var(--text-sm);line-height:1.55}.status-error{color:var(--danger)}.status-empty,.status-loading{color:var(--warn)}.home-screen{display:grid;min-height:calc(100vh - 68px);position:relative}.home-map-layer{min-height:60vh}.map-frame,.map-canvas{min-height:60vh;width:100%}.map-frame{background:var(--border);position:relative}.map-fallback{align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-float);display:grid;gap:var(--space-2);left:var(--space-4);max-width:320px;padding:var(--space-4);position:absolute;right:var(--space-4);top:var(--space-4)}.home-sheet{align-self:end;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:var(--shadow-sheet);display:grid;gap:var(--space-4);margin:-80px auto 0;max-width:720px;padding:var(--space-5);position:relative;width:min(100%,720px);z-index:2}.home-sheet h1,.wireframe-page h1,.placeholder-page h1{font-size:var(--text-xl);line-height:1.3}.state-list{display:flex;flex-wrap:wrap;gap:var(--space-2)}.state-list span,.card-label{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:var(--text-xs);padding:var(--space-1) var(--space-2)}.primary-action,.search-row button{background:var(--accent);border:0;border-radius:var(--radius-md);color:var(--accent-contrast);font-weight:800;padding:var(--space-3) var(--space-4)}.search-panel{display:grid;gap:var(--space-3)}.search-panel h2,.common-states h2{font-size:var(--text-lg)}.search-form{display:grid;gap:var(--space-2)}.search-form label{color:var(--text-muted);font-size:var(--text-sm);font-weight:700}.search-row{display:grid;gap:var(--space-2);grid-template-columns:1fr auto}.search-row input{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);min-width:0;padding:var(--space-3)}.place-results{display:grid;gap:var(--space-2);list-style:none;margin:0;max-height:220px;overflow:auto;padding:0}.place-results button{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);display:grid;gap:var(--space-1);padding:var(--space-3);text-align:left;width:100%}.place-results span,.destination-summary p{color:var(--text-muted);font-size:var(--text-sm)}.destination-summary{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);display:grid;gap:var(--space-1);padding:var(--space-4)}.destination-summary span{color:var(--text-muted);font-size:var(--text-xs);font-weight:700}.wireframe-page,.placeholder-page{display:grid;gap:var(--space-5);margin:0 auto;max-width:760px;padding:var(--space-6) var(--space-4) var(--space-8)}.wire-map{align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);display:grid;min-height:300px;overflow:hidden;padding:var(--space-5);position:relative}.wire-map>span{color:var(--text-muted);font-weight:800;justify-self:center}.route-line{border-radius:999px;height:6px;left:14%;position:absolute;right:16%;transform:rotate(-16deg)}.route-line-safe{background:var(--route-safe);top:42%}.route-line-short{background:var(--route-short);top:34%}.quiet-segment{border:2px dashed var(--quiet);border-radius:var(--radius-sm);color:var(--quiet);font-size:var(--text-xs);padding:var(--space-2);position:absolute;right:var(--space-5);top:var(--space-5)}.route-cards,.state-grid{display:grid;gap:var(--space-3)}.route-card,.common-states article{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);display:grid;gap:var(--space-4);padding:var(--space-4)}.route-card-safe{border-color:var(--route-safe)}.route-card-short{border-color:var(--route-short)}.route-card h2{font-size:var(--text-lg);margin-top:var(--space-2)}.route-card dl{display:grid;gap:var(--space-2)}.route-card dl div{display:flex;justify-content:space-between;gap:var(--space-4)}.route-card dt{color:var(--text-muted);font-size:var(--text-sm)}.route-card dd{font-weight:800}.common-states{display:grid;gap:var(--space-3)}.common-states p{color:var(--text-muted);font-size:var(--text-sm);line-height:1.5;margin-top:var(--space-1)}@media(min-width:760px){.home-screen{grid-template-columns:1fr minmax(360px,420px)}.home-map-layer,.map-frame,.map-canvas{min-height:calc(100vh - 68px)}.home-sheet{align-self:stretch;border-radius:0;margin:0;max-width:none;overflow:auto;width:100%}.route-cards,.state-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.route-summary{margin:1rem 0;border:1px solid var(--border-subtle);border-radius:1rem;padding:1rem;background:var(--surface-muted)}.route-summary span{display:inline-flex;margin-bottom:.35rem;font-weight:700;color:var(--color-primary)}.route-summary p{margin:0;color:var(--text-muted)}.route-screen{min-height:calc(100vh - 68px);position:relative}.route-map-layer .map-frame,.route-map-layer .map-canvas{min-height:calc(100vh - 68px)}.route-progress{background:var(--accent);height:3px;left:0;opacity:.9;position:fixed;right:0;top:68px;z-index:12}.route-sheet{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;bottom:0;box-shadow:var(--shadow-sheet);display:grid;gap:var(--space-4);left:50%;max-height:58vh;max-width:430px;overflow:auto;padding:var(--space-4);position:fixed;transform:translate(-50%);width:min(100%,430px);z-index:11}.sheet-handle{background:var(--border);border-radius:999px;height:4px;justify-self:center;width:44px}.route-sheet h1{font-size:var(--text-xl);line-height:1.25}.scenario-tabs{display:flex;gap:var(--space-2);overflow-x:auto}.scenario-tabs button{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);flex:0 0 auto;font-size:var(--text-sm);padding:var(--space-2) var(--space-3)}.scenario-tabs button.is-selected{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast);font-weight:800}.route-skeleton{display:grid;gap:var(--space-2)}.route-skeleton span{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);display:block;height:52px}.route-error,.route-notice{border-left:4px solid var(--warn);display:grid;gap:var(--space-2);padding:var(--space-3)}.route-error{background:var(--bg);border-color:var(--danger);border-radius:var(--radius-md)}.route-error p,.route-basis{color:var(--text-muted);font-size:var(--text-sm)}.route-error button{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);justify-self:start;padding:var(--space-2) var(--space-3)}.route-notice{background:var(--bg);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-sm)}.route-list{display:grid;gap:var(--space-2)}.route-row{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);display:grid;gap:var(--space-2);padding:var(--space-3);text-align:left;width:100%}.route-row.is-selected{border-color:var(--route-safe);box-shadow:inset 4px 0 0 var(--route-safe)}.route-row-shortest.is-selected{border-color:var(--route-short);box-shadow:inset 4px 0 0 var(--route-short)}.route-row-main,.route-row-meta{align-items:center;display:flex;flex-wrap:wrap;gap:var(--space-2)}.route-row-main strong{font-size:var(--text-2xl);font-variant-numeric:tabular-nums;line-height:1}.route-row-main span{font-weight:800}.route-row-main em{background:var(--accent);border-radius:var(--radius-sm);color:var(--accent-contrast);font-size:var(--text-xs);font-style:normal;font-weight:800;padding:var(--space-1) var(--space-2)}.route-row-meta{color:var(--text-muted);font-size:var(--text-sm)}.quiet-guide{align-items:center;color:var(--text-muted);display:flex;font-size:var(--text-sm);gap:var(--space-2)}.quiet-guide span{border-top:3px dashed var(--quiet);display:inline-block;width:40px}.map-legend{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-float);display:grid;gap:var(--space-1);left:var(--space-3);padding:var(--space-3);position:absolute;top:var(--space-3);z-index:2}.map-legend span,.map-legend div{align-items:center;color:var(--text-muted);display:flex;font-size:var(--text-xs);gap:var(--space-1)}.map-legend i{border-radius:var(--radius-sm);display:inline-block;height:10px;width:18px}.heat-1{background:var(--heat-1)}.heat-2{background:var(--heat-2)}.heat-5{background:var(--heat-5)}.map-quiet-label{background:var(--surface);border:1px dashed var(--quiet);border-radius:var(--radius-sm);color:var(--text);display:inline-flex;font:700 var(--text-xs) var(--font-sans);padding:var(--space-1) var(--space-2);white-space:nowrap}@media(min-width:860px){.route-sheet{bottom:var(--space-5);left:auto;right:var(--space-5);transform:none}}