:root{--color-bg: #f5f6f8;--color-surface: #ffffff;--color-surface-raised: #ffffff;--color-border: #dde1e6;--color-text: #16181d;--color-text-secondary: #5b6270;--color-text-tertiary: #8a8f99;--color-accent: #1d4ed8;--color-accent-contrast: #ffffff;--color-critical: #dc2626;--color-approaching: #b45309;--color-stable: #4b5563;--color-ongoing: #9ca3af;--color-tier1: #1d4ed8;--color-tier2: #c2410c;--color-new: #15803d;--color-conditional: #6b7280;--color-danger: #dc2626;--color-success: #15803d;--shadow-card: 0 1px 2px rgba(16, 20, 30, .06), 0 1px 1px rgba(16, 20, 30, .04);--shadow-popover: 0 8px 24px rgba(16, 20, 30, .18);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--color-bg: #0f1216;--color-surface: #1a1e24;--color-surface-raised: #22262e;--color-border: #2c313a;--color-text: #e7e9ec;--color-text-secondary: #a4aab5;--color-text-tertiary: #767c87;--color-accent: #5b8cf0;--color-accent-contrast: #0b1220;--color-critical: #f87171;--color-approaching: #fbbf24;--color-stable: #9aa2b1;--color-ongoing: #6b7280;--color-tier1: #5b8cf0;--color-tier2: #fb923c;--color-new: #4ade80;--color-conditional: #9aa2b1;--color-danger: #f87171;--color-success: #4ade80;--shadow-card: 0 1px 2px rgba(0, 0, 0, .4), 0 1px 1px rgba(0, 0, 0, .3);--shadow-popover: 0 8px 24px rgba(0, 0, 0, .5);color-scheme:dark}}:root[data-theme=dark]{--color-bg: #0f1216;--color-surface: #1a1e24;--color-surface-raised: #22262e;--color-border: #2c313a;--color-text: #e7e9ec;--color-text-secondary: #a4aab5;--color-text-tertiary: #767c87;--color-accent: #5b8cf0;--color-accent-contrast: #0b1220;--color-critical: #f87171;--color-approaching: #fbbf24;--color-stable: #9aa2b1;--color-ongoing: #6b7280;--color-tier1: #5b8cf0;--color-tier2: #fb923c;--color-new: #4ade80;--color-conditional: #9aa2b1;--color-danger: #f87171;--color-success: #4ade80;--shadow-card: 0 1px 2px rgba(0, 0, 0, .4), 0 1px 1px rgba(0, 0, 0, .3);--shadow-popover: 0 8px 24px rgba(0, 0, 0, .5);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--color-bg);color:var(--color-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.4}#app{display:flex;flex-direction:column;height:100vh}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--color-accent)}.app-header{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.app-title{font-weight:600;font-size:15px;margin-right:auto}.app-nav{display:flex;gap:4px}.app-nav a{text-decoration:none;color:var(--color-text-secondary);padding:6px 10px;border-radius:var(--radius-sm);font-size:13px;font-weight:500}.app-nav a.active{background:var(--color-accent);color:var(--color-accent-contrast)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer}.icon-button:hover{background:var(--color-bg)}.icon-button svg{width:16px;height:16px}.app-main{flex:1;overflow:hidden;display:flex;flex-direction:column}.offline-banner{padding:6px 16px;font-size:12px;background:color-mix(in srgb,var(--color-approaching) 18%,var(--color-surface));color:var(--color-text);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:6px}.filter-bar{display:flex;align-items:center;gap:8px;padding:10px 16px;flex-wrap:wrap}.segmented{display:inline-flex;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}.segmented button{border:none;background:var(--color-surface);padding:5px 10px;font-size:12px;cursor:pointer;border-right:1px solid var(--color-border);color:var(--color-text-secondary)}.segmented button:last-child{border-right:none}.segmented button.active{background:var(--color-accent);color:var(--color-accent-contrast)}.search-input{flex:1;min-width:160px;max-width:320px;padding:6px 10px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}.search-input:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.spacer{flex:1}.updated-at{font-size:11px;color:var(--color-text-tertiary);white-space:nowrap}.popover-anchor{position:relative}.popover{position:absolute;top:calc(100% + 6px);right:0;z-index:20;width:260px;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-popover);padding:14px;display:flex;flex-direction:column;gap:10px}.popover label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--color-text-secondary)}.popover select{padding:5px 8px;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface)}.toggle-row{display:flex;align-items:center;justify-content:space-between;font-size:12px}.summary-strip{padding:0 16px 8px;font-size:12px;color:var(--color-text-secondary);display:flex;gap:6px}.summary-strip .critical{color:var(--color-critical)}.list-scroll{flex:1;overflow-y:auto;padding:0 16px 16px}.card-list{display:flex;flex-direction:column;gap:8px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:10px 12px;box-shadow:var(--shadow-card);cursor:pointer}.card:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.card.keyboard-focused{outline:2px solid var(--color-accent);outline-offset:2px}.card-header{display:flex;align-items:flex-start;gap:10px}.card-title-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.card-road-name{font-weight:600;font-size:14px}.card-body{flex:1;min-width:0}.card-secondary-line{font-size:12px;color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.record-toggle{border:none;background:transparent;cursor:pointer;padding:2px;display:flex;color:var(--color-text-tertiary)}.record-toggle.recorded{color:var(--color-success)}.record-toggle svg{width:18px;height:18px}.card-detail{margin-top:10px;padding-top:10px;border-top:1px solid var(--color-border);display:flex;flex-direction:column;gap:8px}.card-detail .meta{font-size:12px;color:var(--color-text-secondary)}.card-detail-actions{display:flex;gap:8px}.btn{border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-sm);padding:5px 10px;font-size:12px;cursor:pointer}.btn:hover{background:var(--color-bg)}.btn.primary{background:var(--color-accent);color:var(--color-accent-contrast);border-color:var(--color-accent)}.readline-output{width:100%;min-height:50px;resize:vertical;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:6px 8px;background:var(--color-bg);color:var(--color-text)}.badge-icon{width:14px;height:14px;display:inline-flex}.badge-icon.tier1{color:var(--color-tier1)}.badge-icon.tier2{color:var(--color-tier2)}.badge-icon.conditional{color:var(--color-text-tertiary)}.badge-icon.new{color:var(--color-new)}.urgency-dot{width:8px;height:8px;border-radius:50%;margin-top:4px;flex-shrink:0}.urgency-dot.critical{background:var(--color-critical)}.urgency-dot.approaching{background:var(--color-approaching)}.urgency-dot.stable{background:var(--color-stable)}.urgency-dot.ongoing{background:var(--color-ongoing)}.urgency-dot.pulsing{animation:urgency-pulse 1.2s ease-in-out infinite}@keyframes urgency-pulse{0%,to{opacity:1}50%{opacity:.6}}@media (prefers-reduced-motion: reduce){.urgency-dot.pulsing{animation:none}}.active-now-label{color:var(--color-success);font-weight:600}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--color-text-secondary);text-align:center;padding:24px}.empty-state svg{width:32px;height:32px;color:var(--color-text-tertiary)}.section-heading{font-size:12px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.02em;margin:16px 16px 6px}.alert-row{padding:8px 12px;border-bottom:1px solid var(--color-border)}.alert-row:last-child{border-bottom:none}.alert-road{font-size:13px;font-weight:500}.alert-reason{font-size:12px;color:var(--color-text-secondary)}.alert-section{background:var(--color-surface);margin:0 16px 16px;border-radius:var(--radius-md);border:1px solid var(--color-border);overflow:hidden}.settings-form{max-width:480px;margin:0 auto;padding:20px 16px 40px;display:flex;flex-direction:column;gap:20px}.settings-section h2{font-size:13px;font-weight:600;margin:0 0 8px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.02em}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.settings-field{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--color-text-secondary)}.settings-field input,.settings-field select{padding:6px 8px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}.road-list-editor{display:flex;flex-direction:column;gap:6px}.road-list-row{display:flex;gap:6px}.road-list-row input{flex:1;padding:5px 8px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}.road-list-row button{border:none;background:transparent;color:var(--color-danger);cursor:pointer}.toast-stack{position:fixed;bottom:16px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;z-index:100;pointer-events:none}.toast{background:var(--color-text);color:var(--color-bg);padding:8px 14px;border-radius:var(--radius-sm);font-size:12px;box-shadow:var(--shadow-popover);opacity:0;transform:translateY(4px);transition:opacity .15s ease,transform .15s ease}.toast.visible{opacity:1;transform:translateY(0)}.widget-shell .app-header,.widget-shell .filter-bar{padding-left:10px;padding-right:10px}.widget-shell .card{padding:8px 10px}@media print{.app-header,.filter-bar,.summary-strip,.offline-banner,.app-nav,.record-toggle,.card-detail-actions{display:none!important}body{background:#fff;color:#000}.print-list{display:block!important}}.print-list{display:none}