:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: #0a0d12;
  --panel: rgba(16, 20, 27, 0.88);
  --border: rgba(255,255,255,.12);
  --text: #f4f6f8;
  --muted: #9ba7b4;
  --future: #42a5f5;
  --deadhead: #ffad42;
  --current: #eaff00;
  --flown: #7b8088;
}
* { box-sizing: border-box; }
html, body { width:100%; height:100%; margin:0; background:var(--bg); color:var(--text); }
body { overflow:hidden; }
#map { position:fixed; inset:0; background:#0c121a; }
.leaflet-container { background:#0c121a; }
.glass { background:var(--panel); border:1px solid var(--border); backdrop-filter: blur(14px); box-shadow: 0 12px 38px rgba(0,0,0,.28); }
.topbar { position:fixed; z-index:500; left:24px; top:24px; right:24px; min-height:74px; border-radius:18px; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.topbar nav { display:flex; gap:10px; align-items:center; }
button, .topbar a, .map-trip-link { border:1px solid var(--border); background:#202733; color:var(--text); border-radius:10px; padding:10px 13px; text-decoration:none; cursor:pointer; font:inherit; }
button:hover, .topbar a:hover, .map-trip-link:hover { background:#2a3442; }
.hidden { display:none !important; }
.eyebrow { font-size:11px; font-weight:800; color:var(--muted); letter-spacing:.14em; }
.trip-title { font-size:21px; font-weight:760; margin-top:3px; }
.status-panel { position:fixed; z-index:500; width:360px; left:24px; bottom:24px; border-radius:18px; padding:18px; }
.status-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.big-value { font-size:27px; font-weight:780; font-variant-numeric:tabular-nums; margin-top:3px; }
.flight-card { margin:18px 0; padding:15px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.status-main { font-size:20px; font-weight:760; margin:5px 0 3px; }
.muted, .hint { color:var(--muted); }
.metrics-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px 18px; }
.metrics-grid div { display:flex; flex-direction:column; gap:4px; }
.metrics-grid span { color:var(--muted); font-size:12px; }
.metrics-grid strong { font-size:15px; font-variant-numeric:tabular-nums; }
.legend { position:fixed; z-index:500; right:24px; bottom:24px; display:flex; gap:15px; flex-wrap:wrap; padding:11px 14px; border-radius:14px; font-size:12px; }
.swatch { width:20px; height:4px; display:inline-block; vertical-align:middle; margin-right:6px; border-radius:3px; }
.swatch.future { background:var(--future); opacity:.55; }.swatch.deadhead{background:var(--deadhead)}.swatch.current{background:var(--current)}.swatch.flown{background:var(--flown)}
.stop-key { color:#050505; text-shadow:0 0 2px #fff; font-size:17px; margin-right:3px; }
dialog { border:1px solid var(--border); border-radius:20px; background:#131820; color:var(--text); width:min(560px, calc(100vw - 30px)); box-shadow:0 30px 90px rgba(0,0,0,.6); }
dialog::backdrop { background:rgba(0,0,0,.65); backdrop-filter:blur(5px); }
.dialog-shell { padding:4px; }
.dialog-header { display:flex; justify-content:space-between; align-items:start; }.dialog-header h2{margin:4px 0 12px}.icon-button{font-size:22px;padding:4px 10px}
.tabs { display:flex; gap:8px; margin-bottom:14px; }.tab.active{background:#394659}.tab-panel{display:none}.tab-panel.active{display:block}
label { display:flex; flex-direction:column; gap:7px; font-size:13px; color:var(--muted); margin:12px 0; }
input, select { width:100%; border:1px solid var(--border); background:#0f141b; color:var(--text); border-radius:9px; padding:11px; font:inherit; }
input[type=file] { padding:8px; }
.check { flex-direction:row; align-items:center; }.check input{width:auto}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.hint{font-size:12px;line-height:1.45}
.history-page { overflow:auto; }.history-shell{width:min(980px, calc(100% - 32px));margin:45px auto 80px}.back-link{color:#bcd8ff;text-decoration:none}.history-card{background:#131820;border:1px solid var(--border);border-radius:16px;padding:18px;margin:18px 0}.history-card h2{margin:0 0 4px}.history-card-title{display:flex;justify-content:space-between;align-items:center;gap:16px}.map-trip-link{white-space:nowrap}table{width:100%;border-collapse:collapse;margin-top:16px}th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--border);font-size:13px}th{color:var(--muted)}
.aircraft-marker { font-size:24px; filter: drop-shadow(0 2px 5px rgba(0,0,0,.8)); }
.stop-div-icon { overflow:visible !important; }
.stop-marker { position:relative; width:190px; height:34px; display:flex; align-items:center; pointer-events:none; }
.stop-symbol { width:18px; flex:0 0 18px; color:#050505; font-size:16px; line-height:1; text-shadow:-1px -1px 0 rgba(255,255,255,.9),1px -1px 0 rgba(255,255,255,.9),-1px 1px 0 rgba(255,255,255,.9),1px 1px 0 rgba(255,255,255,.9); }
.rest-stop .stop-symbol { font-size:22px; transform:translate(-2px,-1px); }
.stop-label { margin-left:3px; padding:3px 6px; border-radius:7px; background:rgba(255,255,255,.86); color:#111; font-size:13px; font-weight:650; white-space:nowrap; box-shadow:0 2px 6px rgba(0,0,0,.25); }
.stop-label b { font-size:14px; margin-left:3px; }
.button-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.api-ok { color:#9ee6ad; }
.api-error { color:#ff9c9c; }
.map-warning { position:fixed; z-index:550; top:112px; left:50%; transform:translateX(-50%); background:#2d1d12; border:1px solid rgba(255,174,66,.45); color:#ffd8a5; padding:9px 12px; border-radius:10px; font-size:12px; max-width:min(680px, calc(100vw - 30px)); display:none; }
@media (max-width:760px){.topbar{left:10px;right:10px;top:10px}.status-panel{left:10px;right:10px;bottom:10px;width:auto}.legend{display:none}.topbar nav a{display:none}.trip-title{font-size:17px}.metrics-grid{grid-template-columns:1fr 1fr}.history-card-title{align-items:flex-start;flex-direction:column}}

/* v5 route order + live-aircraft overlays */
.route-indicator-icon,
.aircraft-div-icon { overflow: visible !important; background: transparent !important; border: 0 !important; }
.route-indicator { display:flex; align-items:center; gap:4px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.65)); }
.route-sequence { width:23px; height:23px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(11,15,20,.92); border:2px solid rgba(255,255,255,.92); color:#fff; font-size:12px; font-weight:800; line-height:1; }
.route-arrow { display:inline-block; color:#fff; font-size:18px; line-height:1; transform-origin:center; text-shadow:0 1px 3px rgba(0,0,0,.9); }
.aircraft-marker { width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(12,17,23,.88); border:2px solid var(--current); box-shadow:0 3px 10px rgba(0,0,0,.55), 0 0 12px rgba(234,255,0,.35); }
.aircraft-marker span { display:inline-block; color:var(--current); font-size:23px; line-height:1; transform-origin:center; }

/* v6 schedule comparison, editor, weather */
.wide-dialog { width:min(920px, calc(100vw - 30px)); max-height:min(88vh, 900px); overflow:auto; }
.schedule-list { display:flex; flex-direction:column; gap:10px; margin:14px 0; }
.schedule-row { border:1px solid var(--border); background:#0e131a; border-radius:13px; padding:12px; }
.schedule-row.inactive { opacity:.55; }
.schedule-row-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.schedule-row-title { font-weight:760; }
.schedule-badges { display:flex; gap:6px; flex-wrap:wrap; }
.schedule-badge { font-size:10px; padding:3px 6px; border-radius:999px; background:#273140; color:#c9d6e6; }
.schedule-badge.changed { background:#4c371a; color:#ffd99c; }
.schedule-badge.added { background:#173d2a; color:#9fe4ba; }
.schedule-fields { display:grid; grid-template-columns:1.1fr .9fr .7fr .7fr 1.15fr 1.15fr; gap:8px; }
.schedule-fields label { margin:0; font-size:11px; }
.schedule-fields input { padding:8px; }
.schedule-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:9px; }
.schedule-actions button { padding:7px 10px; font-size:12px; }
.danger-button { background:#3b1d22; border-color:#6a3038; }
.warning-button { background:#443419; border-color:#725629; }
#view-toggle.active, #weather-toggle.active { background:#41546a; border-color:#7189a5; }
.weather-credit { position:fixed; z-index:500; right:24px; bottom:72px; font-size:10px; background:rgba(10,13,18,.78); color:#d5dde6; padding:5px 8px; border-radius:7px; display:none; }
@media (max-width:900px){ .schedule-fields{grid-template-columns:1fr 1fr}.topbar nav{flex-wrap:wrap;justify-content:flex-end} }

/* v7 bilingual controls, cleaner manual times, integrated weather control */
.metric-wide { grid-column:1 / -1; padding-top:2px; border-top:1px solid rgba(255,255,255,.07); }
.language-toggle { min-width:46px; font-weight:800; }
.legend { right:78px; }
.weather-map-control { background:transparent !important; border:0 !important; box-shadow:none !important; }
.weather-map-button { width:36px !important; height:36px !important; padding:0 !important; display:flex !important; align-items:center; justify-content:center; font-size:18px !important; border-radius:9px !important; background:#202733 !important; color:var(--text) !important; border:1px solid var(--border) !important; box-shadow:0 2px 8px rgba(0,0,0,.3); }
.weather-map-button.active { background:#41546a !important; border-color:#7189a5 !important; }
.weather-credit { right:78px; bottom:70px; }
.time-entry-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }
.inline-checks { display:flex; gap:18px; flex-wrap:wrap; align-items:center; margin:5px 0 12px; }
.inline-checks .check { margin:0; }
.hhmm-input { font-variant-numeric:tabular-nums; letter-spacing:.04em; }
.schedule-toolbar { display:flex; justify-content:flex-end; margin:8px 0 4px; }
.schedule-add-panel { border:1px solid var(--border); background:#101720; border-radius:14px; padding:14px; margin-top:16px; }
.schedule-add-title { font-weight:780; font-size:16px; margin-bottom:3px; }
.schedule-add-fields { display:grid; grid-template-columns:1fr 1fr .7fr .7fr .8fr .8fr; gap:8px; margin-top:10px; }
.schedule-add-fields label { margin:0; font-size:11px; }
.schedule-add-fields input { padding:8px; }
.compact-schedule-fields { grid-template-columns:1.1fr .9fr .7fr .7fr .85fr .85fr; }
@media (max-width:900px){ .schedule-add-fields,.compact-schedule-fields{grid-template-columns:1fr 1fr} .legend{right:62px} }
.history-top-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }

/* v8: three-language UI, explicit UTC datetimes, cleaner schedule editor */
.status-next-flight { margin-top:11px; padding-top:10px; border-top:1px solid rgba(255,255,255,.08); display:flex; flex-direction:column; gap:3px; }
.status-next-flight span { color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; }
.status-next-flight strong { font-size:16px; font-variant-numeric:tabular-nums; }
.weather-map-button { width:44px !important; height:44px !important; font-size:22px !important; border-radius:11px !important; }
.tabs { flex-wrap:wrap; }
.utc-datetime-block { border:1px solid rgba(255,255,255,.08); background:#0f141b; border-radius:11px; padding:10px 11px; margin:10px 0; }
.utc-datetime-title { color:var(--muted); font-size:12px; font-weight:700; margin-bottom:7px; }
.utc-date-time { display:grid; grid-template-columns:1.35fr .75fr; gap:8px; }
.utc-date-time input { margin:0; }
.schedule-add-fields, .compact-schedule-fields { grid-template-columns:1.1fr .75fr .75fr; }
.schedule-datetime-row { display:grid; grid-template-columns:1.1fr .7fr 1.1fr .7fr; gap:8px; margin-top:8px; }
.schedule-datetime-row label { margin:0; font-size:11px; }
.schedule-datetime-row input { padding:8px; }
.language-toggle { min-width:50px; }
@media (max-width:900px){
  .schedule-datetime-row { grid-template-columns:1fr 1fr; }
  .schedule-add-fields,.compact-schedule-fields { grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){ .utc-date-time { grid-template-columns:1fr; } }

/* v9 production polish: schedule timing, durable history deletion, provider usage */
.status-main-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.status-main-row .status-main { min-width:0; }
.timing-badge { display:inline-flex; align-items:center; justify-content:center; white-space:nowrap; border-radius:999px; padding:4px 8px; font-size:11px; font-weight:800; letter-spacing:.02em; border:1px solid transparent; }
.timing-on_time { background:rgba(52,150,93,.18); border-color:rgba(90,210,130,.35); color:#a9efbf; }
.timing-delayed { background:rgba(168,68,48,.22); border-color:rgba(255,127,97,.42); color:#ffb09e; }
.timing-ahead { background:rgba(47,108,164,.22); border-color:rgba(93,169,238,.38); color:#acd7ff; }
.timing-unknown { background:#252d38; border-color:#394453; color:#aeb8c5; }
.usage-card { margin-top:8px; padding:9px 10px; border:1px solid var(--border); border-radius:10px; background:#0f141b; font-size:12px; line-height:1.45; display:none; }
.delete-history-button { padding:7px 10px; font-size:12px; }
.danger-dialog { border-color:#8b3030; box-shadow:0 0 0 2px rgba(255,55,55,.12), 0 30px 90px rgba(0,0,0,.75); animation:dangerPulse 1.15s ease-in-out infinite alternate; }
.danger-dialog::backdrop { background:rgba(55,0,0,.55); backdrop-filter:blur(6px); }
.danger-dialog-inner { padding:16px 12px; }
.danger-icon { font-size:40px; text-align:center; margin-bottom:4px; }
.danger-dialog h2 { color:#ffb1b1; text-align:center; }
.danger-warning { border:1px solid rgba(255,93,93,.35); background:rgba(100,20,20,.22); color:#ffc0c0; border-radius:10px; padding:10px; }
.danger-input-error { animation:dangerShake .2s linear 0s 3; border-color:#ff5a5a !important; box-shadow:0 0 0 2px rgba(255,90,90,.18); }
@keyframes dangerPulse { from { border-color:#6d2a2a; } to { border-color:#ff4f4f; box-shadow:0 0 25px rgba(255,50,50,.22),0 30px 90px rgba(0,0,0,.75); } }
@keyframes dangerShake { 0%{transform:translateX(0)} 33%{transform:translateX(-5px)} 66%{transform:translateX(5px)} 100%{transform:translateX(0)} }
@media (max-width:760px){ .status-main-row{align-items:flex-start;flex-direction:column}.history-card table{display:block;overflow-x:auto} }