/* ══════════════════════════════════════════════════════════
   TAPIR · style.css — KOMENK Design Language (sama dengan sim.css)
   ══════════════════════════════════════════════════════════ */

:root,[data-theme="dark"]{
  --bg:#080b10;--surface:#0f1520;--surface2:#161e2c;--border:#1e2a3a;
  --border-hi:#2a3a50;
  --accent:#00e5ff;--accent2:#ff6b35;--accent3:#a78bfa;
  --accent-glow:rgba(0,229,255,.18);--accent2-glow:rgba(255,107,53,.14);--accent3-glow:rgba(167,139,250,.14);
  --text:#f1f5f9;--muted:#4a6080;--muted-hi:#6b8099;
  --green:#22c55e;--yellow:#eab308;--red:#ef4444;--orange:#f97316;
  --green-glow:rgba(34,197,94,.14);--red-glow:rgba(239,68,68,.14);
  --shadow-float:0 8px 32px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.04);
  --shadow-panel:0 -8px 40px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.04);
  --glass:rgba(8,11,16,.88);--glass-hi:rgba(15,21,32,.94);
  --gradient-surface:linear-gradient(160deg,#0f1520,#0c1219);
  --radius:8px;--radius-sm:5px;--radius-lg:14px;
  --mono:'Space Mono',monospace;--sans:'DM Sans',sans-serif;
  --tr-fast:.12s cubic-bezier(.4,0,.2,1);
  --tr-med:.22s cubic-bezier(.4,0,.2,1);
  --tr-slow:.35s cubic-bezier(.4,0,.2,1);
}
[data-theme="bright"]{
  --bg:#f0f4f8;--surface:#fff;--surface2:#edf2f7;--border:#d1dbe8;
  --border-hi:#b8c8da;
  --accent:#0284c7;--accent2:#ea580c;--accent3:#7c3aed;
  --accent-glow:rgba(2,132,199,.12);--accent2-glow:rgba(234,88,12,.1);--accent3-glow:rgba(124,58,237,.1);
  --text:#0f172a;--muted:#64748b;--muted-hi:#475569;
  --green:#16a34a;--yellow:#ca8a04;--red:#dc2626;--orange:#ea580c;
  --green-glow:rgba(22,163,74,.1);--red-glow:rgba(220,38,38,.1);
  --shadow-float:0 4px 20px rgba(0,0,0,.12),0 1px 4px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.06);
  --shadow-panel:0 -4px 24px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.06);
  --glass:rgba(240,244,248,.92);--glass-hi:rgba(255,255,255,.96);
  --gradient-surface:linear-gradient(160deg,#fff,#f5f8fc);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;-webkit-tap-highlight-color:transparent;
  transition:background var(--tr-slow),color var(--tr-slow)}
body{font-family:var(--sans);font-size:13px;background:var(--bg);color:var(--text)}

/* ── App shell ── */
.app{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden}
#map{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;min-height:100vh;min-height:100dvh;z-index:1}

/* ── Float logo ── */
.float-logo{
  position:absolute;top:14px;left:14px;z-index:600;
  display:flex;align-items:center;gap:8px;
  background:var(--glass-hi);backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--border-hi);border-radius:var(--radius);
  padding:7px 12px;box-shadow:var(--shadow-float);
  transition:border-color var(--tr-fast);pointer-events:none;
}
.logo-mark{
  font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:3px;
  background:linear-gradient(135deg,var(--accent),#7dd3fc);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.logo-sep{width:1px;height:16px;background:var(--border-hi);flex-shrink:0}
.logo-sub{font-size:8px;color:var(--muted-hi);letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap}

/* ── Top right actions ── */
.float-actions{
  position:absolute;top:14px;right:14px;z-index:600;
  display:flex;align-items:center;gap:7px;
}
.stat-pill{
  display:flex;align-items:center;gap:6px;
  background:var(--glass-hi);backdrop-filter:blur(20px) saturate(180%);
  border:1px solid var(--border-hi);border-radius:var(--radius);
  padding:7px 11px;box-shadow:var(--shadow-float);
}
.stat-pill-total{ border-color:rgba(251,191,36,.25); }
.stat-pill-total .stat-val{ color:#fbbf24; }
.stat-pill-total .stat-lbl{ color:rgba(251,191,36,.6); }
.stat-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent-glow);flex-shrink:0}
.stat-val{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--accent)}
.stat-lbl{font-size:9px;color:var(--muted-hi);letter-spacing:.05em;text-transform:uppercase}

/* ── City filter select ── */
.city-select{
  width:100%;background:var(--bg-card);border:1px solid var(--border);
  border-radius:5px;color:var(--text);font-size:10px;font-family:var(--sans);
  padding:5px 8px;margin-top:4px;cursor:pointer;
  transition:border-color var(--tr-fast);
}
.city-select:focus{ outline:none;border-color:var(--accent); }

/* ── Stat row mini (dalam drawer) ── */
.stat-row-mini{
  display:flex;justify-content:space-between;align-items:center;
  font-size:10px;padding:3px 0;color:var(--muted-hi);
}
.stat-row-mini b{ color:var(--text);font-family:var(--mono); }

.btn-goto-sim{
  display:flex;align-items:center;gap:6px;
  background:var(--glass-hi);backdrop-filter:blur(20px) saturate(180%);
  border:1px solid rgba(167,139,250,.3);border-radius:var(--radius);
  padding:7px 12px;box-shadow:var(--shadow-float);
  color:var(--accent3);font-size:11px;font-weight:600;text-decoration:none;
  transition:border-color var(--tr-fast),box-shadow var(--tr-fast),background var(--tr-fast);
}
.btn-goto-sim:hover{
  border-color:var(--accent3);background:rgba(167,139,250,.08);
  box-shadow:var(--shadow-float),0 0 14px var(--accent3-glow);
}

/* ── FAB cluster (right side) ── */
.fab-cluster{
  position:absolute;right:14px;bottom:50px;z-index:600;
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.fab-btn{
  width:44px;height:44px;border-radius:var(--radius);
  background:var(--glass-hi);backdrop-filter:blur(16px) saturate(160%);
  border:1px solid var(--border-hi);box-shadow:var(--shadow-float);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--text);
  transition:background var(--tr-fast),border-color var(--tr-fast),transform var(--tr-fast);
  touch-action:manipulation;
}
.fab-btn:active{transform:scale(.9)}
.fab-menu{color:var(--accent)}
.fab-menu:hover{border-color:var(--accent);box-shadow:var(--shadow-float),0 0 14px var(--accent-glow)}
.fab-search:hover{border-color:var(--accent);box-shadow:var(--shadow-float),0 0 14px var(--accent-glow)}

/* ── Grid progress ── */
.grid-progress-wrap{
  position:absolute;bottom:80px;left:50%;transform:translateX(-50%);z-index:600;
  min-width:260px;max-width:320px;
  background:var(--glass-hi);backdrop-filter:blur(16px) saturate(180%);
  border:1px solid var(--border-hi);border-radius:var(--radius);
  padding:10px 14px;box-shadow:var(--shadow-float);
  display:flex;flex-direction:column;gap:6px;
}
.grid-progress-wrap.hidden{display:none}
.grid-progress-header{display:flex;justify-content:space-between;align-items:center;gap:8px}
.grid-progress-title{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);flex-shrink:0}
#gridMsg{font-size:10px;color:var(--muted-hi);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grid-progress-bar{height:2px;background:var(--border);border-radius:2px;overflow:hidden}
#gridBar{height:100%;background:var(--accent);border-radius:2px;width:0%;transition:width .2s}

/* ══════════════════════════════════════════════════════════
   DRAWER
   ══════════════════════════════════════════════════════════ */
.drawer-scrim{
  position:absolute;inset:0;z-index:700;
  background:rgba(0,0,0,.55);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity var(--tr-med);
}
.drawer-scrim.open{opacity:1;pointer-events:auto}

.drawer{
  position:absolute;top:0;left:0;bottom:0;z-index:800;
  width:270px;
  background:var(--gradient-surface);
  border-right:1px solid var(--border-hi);
  transform:translateX(-100%);
  transition:transform var(--tr-slow);
  display:flex;flex-direction:column;
  box-shadow:8px 0 32px rgba(0,0,0,.5);
  padding-top:env(safe-area-inset-top,0);
}
.drawer.open{transform:translateX(0)}

.drawer-head{
  padding:16px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:flex;align-items:flex-start;justify-content:space-between;
  background:rgba(0,0,0,.12);
}
.drawer-logo{
  font-family:var(--mono);font-size:15px;font-weight:700;letter-spacing:3px;
  background:linear-gradient(135deg,var(--accent),#7dd3fc);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.drawer-sub{font-size:8px;color:var(--muted-hi);letter-spacing:1.5px;text-transform:uppercase;margin-top:3px}
.drawer-close{
  background:none;border:none;color:var(--muted-hi);cursor:pointer;
  padding:4px;border-radius:var(--radius-sm);display:flex;align-items:center;
  transition:color var(--tr-fast),background var(--tr-fast);flex-shrink:0;
}
.drawer-close:hover{color:var(--text);background:var(--border)}

.drawer-body{flex:1;overflow-y:auto;overscroll-behavior:contain}
.drawer-body::-webkit-scrollbar{display:none}

.drawer-section{padding:12px 16px;border-bottom:1px solid var(--border)}
.drawer-section:last-child{border-bottom:none}
.drawer-label{
  font-size:8px;font-family:var(--mono);letter-spacing:2px;text-transform:uppercase;
  color:var(--muted-hi);margin-bottom:8px;
}
.drawer-label-collapsible{
  display:flex;justify-content:space-between;align-items:center;cursor:pointer;
  user-select:none;padding-bottom:0;margin-bottom:0;
  transition:color var(--tr-fast);
}
.drawer-label-collapsible:hover{color:var(--text)}
.drawer-caret{font-size:14px;color:var(--muted);transition:transform var(--tr-med);display:inline-block}
.drawer-caret.open{transform:rotate(90deg)}
.drawer-collapsible{overflow:hidden;max-height:0;transition:max-height var(--tr-slow),padding var(--tr-slow);padding-top:0}
.drawer-collapsible:not(.collapsed){max-height:400px;padding-top:10px}

.drawer-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 0;border-bottom:1px solid var(--border);
  font-size:12px;color:var(--text);
}
.drawer-row:last-child{border-bottom:none}
.drawer-unit{font-size:9px;color:var(--accent);font-family:var(--mono)}
.drawer-hint{font-size:9px;color:var(--muted);line-height:1.5;margin-top:6px}

.drawer-input-sm{
  width:64px;background:var(--bg);border:1px solid var(--border);
  border-radius:var(--radius-sm);color:var(--text);font-family:var(--mono);
  font-size:12px;padding:4px 7px;outline:none;text-align:right;
  transition:border-color var(--tr-fast);
}
.drawer-input-sm:focus{border-color:var(--accent)}

.drawer-select{
  background:var(--border);border:1px solid var(--border-hi);
  border-radius:var(--radius-sm);color:var(--text);font-size:12px;
  padding:4px 8px;outline:none;cursor:pointer;font-family:var(--sans);
  transition:border-color var(--tr-fast);
}
.drawer-select:focus{border-color:var(--accent)}
.drawer-select option{background:var(--surface)}

/* Debug section fields */
.drawer-field-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.drawer-field-label{font-size:9px;color:var(--muted-hi);letter-spacing:.06em;text-transform:uppercase;width:48px;flex-shrink:0}
.drawer-input{
  flex:1;background:var(--bg);border:1px solid var(--border);
  border-radius:var(--radius-sm);color:var(--text);font-family:var(--mono);
  font-size:12px;padding:5px 8px;outline:none;
  transition:border-color var(--tr-fast),box-shadow var(--tr-fast);
}
.drawer-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}
.drawer-input::placeholder{color:var(--muted);font-size:11px}

.debug-btns{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.debug-btn{
  flex:1;min-width:calc(50% - 3px);padding:6px 4px;font-size:10px;
  background:var(--border);border:1px solid var(--border-hi);
  color:var(--text);border-radius:var(--radius-sm);cursor:pointer;
  font-family:var(--sans);transition:background var(--tr-fast),border-color var(--tr-fast);
  touch-action:manipulation;
}
.debug-btn:hover{background:var(--surface2);border-color:var(--accent);color:var(--accent)}
.debug-btn-danger:hover{border-color:var(--red);color:var(--red)}
.debug-output{
  margin-top:8px;padding:8px;background:var(--bg);border:1px solid var(--border);
  border-radius:var(--radius-sm);font-size:9px;font-family:var(--mono);
  color:var(--muted-hi);max-height:180px;overflow-y:auto;white-space:pre-wrap;word-break:break-all;
}
.debug-output.hidden{display:none}

.drawer-goto-sim{
  display:flex;align-items:center;gap:8px;
  padding:12px 0;color:var(--accent3);font-size:12px;font-weight:600;
  text-decoration:none;transition:color var(--tr-fast);
  border-top:1px solid var(--border);margin-top:2px;
}
.drawer-goto-sim:hover{color:var(--accent)}

/* ── Toggle switch (identik KOMENK) ── */
.tog{position:relative;width:34px;height:20px;flex-shrink:0}
.tog input{opacity:0;width:0;height:0}
.tog-s{
  position:absolute;inset:0;background:var(--border);border-radius:10px;
  cursor:pointer;border:1px solid transparent;
  transition:background var(--tr-med),border var(--tr-med);
}
.tog-s::before{
  content:'';position:absolute;width:14px;height:14px;left:3px;top:2px;
  background:var(--muted-hi);border-radius:50%;
  transition:transform var(--tr-med),background var(--tr-fast);
}
.tog input:checked+.tog-s{background:rgba(0,229,255,.2);border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}
.tog input:checked+.tog-s::before{transform:translateX(14px);background:var(--accent)}
[data-theme="bright"] .tog input:checked+.tog-s{background:rgba(2,132,199,.15)}

/* ══════════════════════════════════════════════════════════
   BOTTOM SHEETS (shared between search + detail)
   ══════════════════════════════════════════════════════════ */
.sheet-scrim{
  position:absolute;inset:0;z-index:700;
  background:rgba(0,0,0,.55);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity var(--tr-med);
}
.sheet-scrim.open{opacity:1;pointer-events:auto}

.bottom-sheet{
  position:absolute;left:0;right:0;bottom:0;z-index:800;
  background:var(--gradient-surface);
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  border-top:1px solid var(--border-hi);
  transform:translateY(100%);transition:transform var(--tr-slow);
  display:flex;flex-direction:column;
  max-height:88dvh;
  box-shadow:var(--shadow-panel);
  padding-bottom:env(safe-area-inset-bottom,0);
}
.bottom-sheet.open{transform:translateY(0)}
.detail-sheet{max-height:82dvh}

.sheet-handle-bar{
  flex-shrink:0;padding:10px 14px 0;
  border-bottom:1px solid var(--border);
}
.sheet-pill{width:36px;height:3px;border-radius:2px;background:var(--border-hi);margin:0 auto 8px}
.sheet-head-row{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px}
.sheet-title{font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted-hi)}
.sheet-close-btn{
  background:none;border:none;color:var(--muted-hi);cursor:pointer;
  padding:4px;border-radius:var(--radius-sm);display:flex;align-items:center;
  transition:color var(--tr-fast),background var(--tr-fast);
}
.sheet-close-btn:hover{color:var(--text);background:var(--border)}

/* Search input inside sheet header */
.sheet-search{
  display:flex;align-items:center;gap:6px;
  background:var(--bg);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:0 8px;margin-bottom:10px;
  transition:border-color var(--tr-fast);
}
.sheet-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}
.search-icon{color:var(--muted);flex-shrink:0}
.search-input{
  flex:1;background:none;border:none;color:var(--text);
  font-size:13px;padding:8px 0;outline:none;font-family:var(--sans);
}
.search-input::placeholder{color:var(--muted)}

.sheet-body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.sheet-body::-webkit-scrollbar{display:none}

/* ── Station list items ── */
.station-item{
  display:flex;flex-direction:column;gap:3px;
  padding:12px 14px;border-bottom:1px solid var(--border);
  cursor:pointer;transition:background var(--tr-fast);
  -webkit-tap-highlight-color:transparent;
}
.station-item:hover{background:rgba(0,229,255,.04)}
.station-item:active{background:rgba(0,229,255,.08)}
.stn-freq{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--accent)}
.stn-name{font-size:13px;font-weight:600;color:var(--text)}
.stn-client{font-size:10px;color:var(--muted)}

/* ── Station list: service badge inline ── */
.stn-svc-badge{
  display:inline-block;font-family:var(--mono);font-size:9px;font-weight:700;
  border:1px solid currentColor;border-radius:3px;padding:1px 4px;
  margin-left:5px;vertical-align:middle;opacity:.85;
}

/* ── Station list tabs FM / Non-FM ── */
.stn-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--border);
  margin:0 -1px;padding:0 14px;
}
.stn-tab{
  flex:1;padding:8px 6px;font-size:12px;font-weight:600;
  background:none;border:none;border-bottom:2px solid transparent;
  color:var(--muted);cursor:pointer;font-family:var(--sans);
  transition:color var(--tr-fast),border-color var(--tr-fast);
}
.stn-tab.active{color:var(--accent);border-bottom-color:var(--accent)}
.stn-tab:hover:not(.active){color:var(--text)}
.stn-tab-count{
  display:inline-block;font-family:var(--mono);font-size:9px;
  background:var(--border-hi);border-radius:8px;padding:1px 5px;margin-left:4px;
}
.hidden{display:none!important}

/* ── Service breakdown chips (in drawer) ── */
.svc-breakdown{
  display:flex;flex-wrap:wrap;gap:5px;padding:6px 0 2px;
}
.svc-badge{
  font-family:var(--mono);font-size:9px;font-weight:700;
  border:1px solid currentColor;border-radius:4px;padding:2px 6px;
  opacity:.85;
}

/* ── Station detail (inside detail-sheet) ── */
.detail-svc-badge{
  display:inline-block;font-size:10px;font-weight:700;
  border:1px solid;border-radius:4px;padding:2px 8px;
  margin-bottom:8px;
}
.detail-wrap{padding:12px 14px 20px}
.detail-name{font-size:15px;font-weight:700;margin-bottom:4px}
.detail-freq{font-family:var(--mono);font-size:12px;color:var(--accent);margin-bottom:12px}

/* ── Simulasi link button (non-FM detail) ── */
.btn-action.btn-sim-link{
  border-color:rgba(168,139,250,.3);color:#a78bfa;background:rgba(168,139,250,.06);
  text-decoration:none;
}
.btn-action.btn-sim-link:hover{border-color:#a78bfa;box-shadow:0 0 12px rgba(168,139,250,.3)}
.detail-table{width:100%;border-collapse:collapse;font-size:12px}
.detail-table td{padding:6px 0;border-bottom:1px solid var(--border);vertical-align:top}
.detail-table td:first-child{color:var(--muted);width:44%;padding-right:8px}
.detail-table td:last-child{font-family:var(--mono);font-size:11px;color:var(--text)}
.detail-actions{display:flex;gap:7px;margin-top:14px;flex-wrap:wrap}
.btn-action{
  flex:1;min-width:120px;display:flex;align-items:center;justify-content:center;gap:6px;
  padding:10px;border-radius:var(--radius);font-size:12px;font-weight:600;cursor:pointer;
  border:1px solid var(--border-hi);background:var(--border);color:var(--text);
  transition:background var(--tr-fast),border-color var(--tr-fast),color var(--tr-fast);
  font-family:var(--sans);touch-action:manipulation;
}
.btn-action:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,229,255,.06)}
.btn-action.btn-coverage{border-color:rgba(34,197,94,.3);color:var(--green);background:rgba(34,197,94,.06)}
.btn-action.btn-coverage:hover{border-color:var(--green);box-shadow:0 0 12px var(--green-glow)}
.btn-action.btn-grid{border-color:rgba(0,229,255,.3);color:var(--accent);background:rgba(0,229,255,.06)}
.btn-action.btn-grid:hover{border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}

/* Grid progress inline (in detail sheet) */
.detail-grid-progress{
  margin-top:10px;padding:8px 10px;
  background:rgba(0,229,255,.05);border:1px solid rgba(0,229,255,.15);
  border-radius:var(--radius-sm);display:none;
}
.detail-grid-progress.show{display:block}
.detail-grid-bar-wrap{height:2px;background:var(--border);border-radius:2px;overflow:hidden;margin-top:5px}
.detail-grid-bar{height:100%;background:var(--accent);border-radius:2px;width:0%;transition:width .2s}
.detail-grid-msg{font-size:10px;color:var(--muted-hi)}

/* ══════════════════════════════════════════════════════════
   LEAFLET OVERRIDES
   ══════════════════════════════════════════════════════════ */
.leaflet-container{background:var(--bg)!important}
.leaflet-control-zoom{border:1px solid var(--border-hi)!important;border-radius:var(--radius)!important;overflow:hidden}
.leaflet-control-zoom a{
  background:var(--glass-hi)!important;color:var(--text)!important;
  border-bottom:1px solid var(--border)!important;backdrop-filter:blur(8px);
  width:38px!important;height:38px!important;line-height:38px!important;font-size:16px!important;
}
.leaflet-control-zoom a:hover{background:var(--surface2)!important;color:var(--accent)!important}
.leaflet-control-attribution{background:rgba(8,11,16,.6)!important;color:var(--muted)!important;font-size:9px!important;backdrop-filter:blur(4px)}
.leaflet-control-attribution a{color:var(--muted-hi)!important}
.iso-tip{font-family:var(--mono);font-size:10px;background:var(--glass-hi);border:1px solid var(--border-hi);color:var(--text);border-radius:4px;padding:2px 7px}

/* ══════════════════════════════════════════════════════════
   UTILITY
   ══════════════════════════════════════════════════════════ */
.hidden{display:none!important}

/* ══════════════════════════════════════════════════════════
   POLISH DESKTOP ≥ 900px
   ══════════════════════════════════════════════════════════ */
@media(min-width:900px){
  /* Float logo permanently visible, no pointer-events needed */
  .float-logo{ pointer-events:auto; }

  /* Station count pill + sim button top right */
  .float-actions{ top:16px; right:16px; }

  /* FABs shift up — zoom control below */
  .fab-cluster{ bottom:58px; right:14px; }

  /* Wider drawer on desktop */
  .drawer{ width:300px; }

  /* Grid progress bar more centered */
  .grid-progress-wrap{ bottom:24px; }

  /* Search sheet only 70% width on desktop, centered */
  #search-sheet{ left:50%; right:auto; width:480px; transform:translateX(-50%) translateY(100%);
    border-radius:var(--radius-lg); border:1px solid var(--border-hi); }
  #search-sheet.open{ transform:translateX(-50%) translateY(0); }

  /* Detail sheet narrower on desktop */
  #detail-sheet{ left:50%; right:auto; width:480px; transform:translateX(-50%) translateY(100%);
    border-radius:var(--radius-lg); border:1px solid var(--border-hi); }
  #detail-sheet.open{ transform:translateX(-50%) translateY(0); }

  /* Scrollbar for drawer */
  .drawer-body::-webkit-scrollbar{ width:3px; }
  .drawer-body::-webkit-scrollbar-thumb{ background:var(--border); border-radius:2px; }
}

/* ══════════════════════════════════════════════════════════
   POLISH MOBILE portrait < 900px
   ══════════════════════════════════════════════════════════ */
@media(max-width:899px){
  /* Logo compact */
  .float-logo{ top:10px; left:10px; padding:6px 10px; gap:6px; }
  .logo-mark{ font-size:12px; letter-spacing:2px; }

  /* Top right compact */
  .float-actions{ top:10px; right:10px; gap:6px; }
  .stat-pill{ padding:5px 9px; gap:5px; }

  /* FAB bottom right above safe area */
  .fab-cluster{ right:10px; bottom:calc(44px + env(safe-area-inset-bottom,0)); gap:7px; }
  .fab-btn{ width:42px; height:42px; }

  /* Grid progress above FABs */
  .grid-progress-wrap{ bottom:calc(110px + env(safe-area-inset-bottom,0)); min-width:220px; }

  /* Detail sheet full width mobile */
  #detail-sheet{ max-height:90dvh; }

  /* Station list items bigger tap target */
  .station-item{ padding:13px 14px; }
  .stn-name{ font-size:14px; }

  /* Search sheet full */
  #search-sheet{ max-height:88dvh; }

  /* Drawer slightly narrower mobile */
  .drawer{ width:260px; }
}

/* ══════════════════════════════════════════════════════════
   LANDSCAPE MOBILE
   ══════════════════════════════════════════════════════════ */
@media(max-width:899px) and (orientation:landscape){
  #search-sheet,#detail-sheet{ max-height:92dvh; }
  .fab-cluster{ bottom:12px; right:10px; flex-direction:row; gap:6px; }
  .logo-sub{ display:none; }
  /* Drawer half-width landscape */
  .drawer{ width:260px; }
}

/* ══════════════════════════════════════════════════════════
   TINY ≤ 380px
   ══════════════════════════════════════════════════════════ */
@media(max-width:380px){
  .float-logo{ padding:5px 8px; gap:4px; }
  .logo-mark{ font-size:11px; letter-spacing:1.5px; }
  .logo-sub{ display:none; }
  .fab-btn{ width:38px; height:38px; }
  .btn-goto-sim{ padding:6px 9px; font-size:10px; }
  .drawer{ width:90vw; }
  .station-item{ padding:11px 12px; }
}

/* ── Tombol kirim ke simulasi (detail sheet) ── */
.detail-sim-actions{
  display:flex;gap:6px;margin:8px 0 4px;
}
.btn-sim-wanted,.btn-sim-ifr{
  flex:1;padding:7px 6px;border-radius:6px;font-size:10px;font-weight:600;
  cursor:pointer;border:1px solid;font-family:var(--sans);
  transition:background var(--tr-fast),box-shadow var(--tr-fast);
}
.btn-sim-wanted{
  background:rgba(234,179,8,.08);border-color:rgba(234,179,8,.35);color:#eab308;
}
.btn-sim-wanted:hover{ background:rgba(234,179,8,.15);box-shadow:0 0 10px rgba(234,179,8,.2); }
.btn-sim-ifr{
  background:rgba(34,211,238,.07);border-color:rgba(34,211,238,.3);color:var(--accent);
}
.btn-sim-ifr:hover{ background:rgba(34,211,238,.13);box-shadow:0 0 10px rgba(34,211,238,.15); }

/* ── Toast notifikasi peta ── */
.tapir-toast{
  position:fixed;bottom:90px;left:50%;transform:translateX(-50%) translateY(10px);
  background:var(--bg-card);border:1px solid var(--border-hi);
  border-radius:8px;padding:9px 16px;font-size:11px;color:var(--text);
  z-index:9999;opacity:0;pointer-events:none;white-space:nowrap;
  transition:opacity .25s,transform .25s;box-shadow:var(--shadow-float);
}
.tapir-toast.show{ opacity:1;transform:translateX(-50%) translateY(0); }
.tapir-toast.toast-ok{ border-color:rgba(34,211,238,.4);color:var(--accent); }
.tapir-toast.toast-warn{ border-color:rgba(251,191,36,.4);color:#fbbf24; }

/* ── Badge queue simulasi di topbar ── */
.sim-queue-badge{
  display:inline-flex;align-items:center;justify-content:center;
  background:#eab308;color:#000;border-radius:10px;
  font-size:9px;font-weight:700;padding:1px 5px;margin-left:4px;min-width:16px;
}

/* ── Monitor ISR Expiry ── */
.expiry-summary{ display:flex;flex-wrap:wrap;gap:5px;padding:6px 0; }
.exp-chip{ font-family:var(--mono);font-size:9px;font-weight:700;border-radius:4px;padding:2px 7px; }
.exp-chip-expired { background:rgba(239,68,68,.15);color:#ef4444; }
.exp-chip-critical{ background:rgba(249,115,22,.15);color:#f97316; }
.exp-chip-warning { background:rgba(250,204,21,.12);color:#facc15; }

.expiry-legend{
  font-size:9px;color:var(--muted-hi);display:flex;align-items:center;gap:8px;
  padding:4px 0 6px;flex-wrap:wrap;
}
.exp-dot{
  display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;
}
.exp-expired { background:#ef4444; }
.exp-critical{ background:#f97316; }
.exp-warning { background:#facc15; }

.expiry-list{
  max-height:220px;overflow-y:auto;border:1px solid var(--border);
  border-radius:6px;margin-top:4px;
}
.expiry-row{
  display:flex;gap:8px;align-items:flex-start;padding:7px 10px;
  border-bottom:1px solid var(--border);cursor:pointer;
  transition:background var(--tr-fast);
}
.expiry-row:last-child{ border-bottom:none; }
.expiry-row:hover{ background:var(--bg-card); }
.exp-days{
  font-family:var(--mono);font-size:9px;font-weight:700;
  min-width:72px;padding-top:2px;flex-shrink:0;
}
.exp-info{ font-size:10px;line-height:1.5; }
.exp-info b{ font-weight:600; }
.exp-info small{ color:var(--muted-hi);font-size:9px; }

/* ── Export buttons di drawer ── */
.export-row{
  display:flex;align-items:center;gap:5px;margin-top:8px;flex-wrap:wrap;
}
.btn-export-small{
  font-family:var(--mono);font-size:9px;font-weight:600;
  background:none;border:1px solid var(--border);border-radius:4px;
  padding:3px 8px;color:var(--accent);cursor:pointer;
  transition:background var(--tr-fast),border-color var(--tr-fast);
}
.btn-export-small:hover{ background:rgba(34,211,238,.07);border-color:var(--accent); }
.btn-export-xls{ color:#4ade80;border-color:rgba(74,222,128,.3); }
.btn-export-xls:hover{ background:rgba(74,222,128,.07);border-color:#4ade80; }