
    :root {
      --bg0:#020617;
      --bg1:#07111f;
      --bg2:#0f172a;
      --page-bg:
        radial-gradient(circle at 12% 14%, rgba(79,124,255,.24), transparent 30rem),
        radial-gradient(circle at 86% 10%, rgba(0,199,183,.20), transparent 26rem),
        radial-gradient(circle at 72% 88%, rgba(245,182,64,.14), transparent 28rem),
        linear-gradient(135deg, #07111e 0%, #0b1629 48%, #120f22 100%);
      --panel:
        radial-gradient(circle at 94% 16%, rgba(94,234,212,.12), transparent 12rem),
        linear-gradient(180deg, rgba(13,23,42,.92), rgba(10,19,36,.78));
      --panel2:
        radial-gradient(circle at 12% 80%, rgba(79,124,255,.10), transparent 12rem),
        linear-gradient(180deg, rgba(30,41,59,.82), rgba(15,23,42,.72));
      --glass:rgba(255,255,255,.07);
      --line:rgba(148,163,184,.18);
      --line2:rgba(148,163,184,.30);
      --text:#e5eefb;
      --muted:#94a3b8;
      --soft:#cbd5e1;
      --blue:#38bdf8;
      --green:#22c55e;
      --amber:#f59e0b;
      --rose:#fb7185;
      --violet:#a78bfa;
      --cyan:#22d3ee;
      --shadow:0 24px 70px rgba(0,0,0,.35);
      --radius:22px;
      --radius2:16px;
      --control-bg:rgba(4,12,29,.78);
      --control-border:rgba(148,163,184,.23);
      --toggle-bg:rgba(15,23,42,.92);
      --chip-bg:linear-gradient(180deg, rgba(15,23,42,.92), rgba(30,41,59,.84));
      --dropdown-bg:linear-gradient(180deg, rgba(15,23,42,.99), rgba(17,24,39,.97));
      --item-bg:rgba(2,6,23,.42);
      --item-hover:rgba(56,189,248,.08);
      --table-head:rgba(15,23,42,.97);
      --table-cell:#e2e8f0;
      --strong:#f8fafc;
      --overlay:rgba(2,6,23,.74);
      --map-bg:#08111f;
    }

    * { box-sizing:border-box; }
    html, body { height:100%; }
    body {
      margin:0;
      color:var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:var(--page-bg);
      background-attachment:fixed;
      overflow-x:hidden;
      color-scheme:dark;
      transition:background .2s ease, color .2s ease;
    }

    body[data-theme="light"] {
      --bg0:#eff6ff;
      --bg1:#f8fafc;
      --bg2:#e0f2fe;
      --page-bg:
        radial-gradient(circle at 12% 14%, rgba(79,124,255,.18), transparent 30rem),
        radial-gradient(circle at 86% 10%, rgba(0,199,183,.18), transparent 26rem),
        radial-gradient(circle at 72% 88%, rgba(245,182,64,.18), transparent 28rem),
        linear-gradient(135deg, #f6f9ff 0%, #eef3ff 46%, #fff7ed 100%);
      --panel:
        radial-gradient(circle at 94% 12%, rgba(94,234,212,.20), transparent 12rem),
        radial-gradient(circle at 14% 90%, rgba(79,124,255,.10), transparent 12rem),
        linear-gradient(145deg, rgba(255,255,255,.94), rgba(240,249,255,.86));
      --panel2:
        radial-gradient(circle at 92% 18%, rgba(245,182,64,.16), transparent 12rem),
        linear-gradient(145deg, rgba(255,255,255,.92), rgba(236,253,245,.82));
      --glass:rgba(15,23,42,.045);
      --line:rgba(15,23,42,.13);
      --line2:rgba(15,23,42,.20);
      --text:#0f172a;
      --muted:#475569;
      --soft:#334155;
      --shadow:0 22px 58px rgba(15,23,42,.14);
      --control-bg:linear-gradient(180deg, rgba(255,255,255,.96), rgba(239,246,255,.88));
      --control-border:rgba(37,99,235,.18);
      --toggle-bg:rgba(255,255,255,.92);
      --chip-bg:linear-gradient(180deg, rgba(255,255,255,.96), rgba(240,249,255,.90));
      --dropdown-bg:linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,250,252,.97));
      --item-bg:linear-gradient(145deg, rgba(248,250,252,.92), rgba(239,246,255,.82));
      --item-hover:rgba(14,165,233,.10);
      --table-head:rgba(241,245,249,.98);
      --table-cell:#1e293b;
      --strong:#0f172a;
      --overlay:rgba(226,232,240,.72);
      --map-bg:#e2e8f0;
      color-scheme:light;
    }

    button, input, select {
      font:inherit;
    }

    .app {
      max-width:1920px;
      margin:0 auto;
      padding:68px 18px 18px;
    }

    .theme-toggle {
      position:fixed;
      top:18px;
      right:22px;
      z-index:10000;
      min-height:38px;
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid var(--line2);
      background:var(--toggle-bg);
      color:var(--text);
      box-shadow:0 14px 32px rgba(15,23,42,.16);
      backdrop-filter:blur(14px);
      cursor:pointer;
      font-size:12px;
      font-weight:850;
    }

    .theme-toggle:hover {
      border-color:rgba(56,189,248,.55);
      transform:translateY(-1px);
    }

    .theme-dot {
      width:13px;
      height:13px;
      border-radius:999px;
      background:linear-gradient(135deg, var(--blue), var(--green));
      box-shadow:0 0 0 5px rgba(56,189,248,.12);
    }

    body[data-theme="light"] .klid-home-button {
      background:rgba(255,255,255,.88) !important;
      color:#0f172a !important;
      border-color:rgba(15,23,42,.18) !important;
      box-shadow:0 12px 28px rgba(15,23,42,.12) !important;
    }

    body[data-theme="light"] .eyebrow {
      color:#0369a1;
      background:rgba(14,165,233,.10);
      border-color:rgba(14,165,233,.22);
    }

    body[data-theme="light"] .dropzone {
      background:
        radial-gradient(circle at 92% 12%, rgba(94,234,212,.20), transparent 8rem),
        linear-gradient(135deg, rgba(224,242,254,.72), rgba(236,253,245,.58));
    }

    body[data-theme="light"] .file-line,
    body[data-theme="light"] .tab,
    body[data-theme="light"] .quality-card,
    body[data-theme="light"] .empty {
      background:rgba(248,250,252,.78);
    }

    body[data-theme="light"] .btn.secondary,
    body[data-theme="light"] .mini-btn {
      background:rgba(241,245,249,.90);
      color:#0f172a;
      border-color:rgba(15,23,42,.14);
    }

    body[data-theme="light"] .status-good { color:#15803d; }
    body[data-theme="light"] .status-bad { color:#be123c; }
    body[data-theme="light"] .status-mid { color:#b45309; }

    body[data-theme="dark"] .filter-card,
    body[data-theme="dark"] .upload-card,
    body[data-theme="dark"] .panel {
      border-color:rgba(177,197,255,.16);
    }

    body[data-theme="light"] .filter-card,
    body[data-theme="light"] .upload-card,
    body[data-theme="light"] .panel {
      border-color:rgba(37,99,235,.13);
    }

    .hero {
      display:grid;
      grid-template-columns:1.35fr .9fr;
      gap:16px;
      margin-bottom:16px;
      align-items:stretch;
    }

    .card, .panel, .stat, .filter-card, .upload-card {
      background:var(--panel);
      border:1px solid var(--line);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      backdrop-filter:blur(18px);
    }

    .card,
    .panel,
    .stat,
    .filter-card,
    .upload-card {
      position:relative;
    }

    .hero-card {
      padding:24px;
      position:relative;
      overflow:hidden;
      min-height:210px;
    }

    .hero-card:before {
      content:"";
      position:absolute;
      right:-140px;
      top:-180px;
      width:420px;
      height:420px;
      border-radius:999px;
      background:radial-gradient(circle, rgba(56,189,248,.22), transparent 60%);
      pointer-events:none;
      display:none;
    }

    .eyebrow {
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      color:#bae6fd;
      background:rgba(56,189,248,.12);
      border:1px solid rgba(56,189,248,.24);
      font-size:12px;
      letter-spacing:.045em;
      text-transform:uppercase;
      margin-bottom:12px;
    }

    .eyebrow .pulse {
      width:9px;
      height:9px;
      border-radius:999px;
      background:var(--green);
      box-shadow:0 0 0 7px rgba(34,197,94,.12);
    }

    h1 {
      margin:0;
      font-size:clamp(26px, 2.55vw, 46px);
      line-height:1.04;
      letter-spacing:-.045em;
      max-width:980px;
      color:var(--strong);
    }

    .panel-title h2 {
      color:var(--strong);
    }

    .subtitle {
      margin:13px 0 0;
      color:var(--muted);
      line-height:1.68;
      font-size:14px;
      max-width:950px;
    }

    .hero-intel {
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:10px;
      margin-top:18px;
      max-width:860px;
      position:relative;
      z-index:2;
    }

    .intel-chip {
      min-height:74px;
      padding:12px 13px;
      border:1px solid rgba(125,211,252,.22);
      border-radius:18px;
      background:
        radial-gradient(circle at 92% 18%, rgba(94,234,212,.18), transparent 6rem),
        linear-gradient(145deg, rgba(15,23,42,.56), rgba(30,41,59,.38));
      box-shadow:0 16px 34px rgba(2,6,23,.12);
      overflow:hidden;
    }

    body[data-theme="light"] .intel-chip {
      border-color:rgba(14,165,233,.22);
      background:
        radial-gradient(circle at 92% 18%, rgba(94,234,212,.22), transparent 6rem),
        linear-gradient(145deg, rgba(255,255,255,.82), rgba(224,242,254,.58));
    }

    .intel-kicker {
      display:block;
      color:var(--muted);
      font-size:10.5px;
      font-weight:850;
      letter-spacing:.04em;
      text-transform:uppercase;
      margin-bottom:7px;
    }

    .intel-chip strong {
      display:block;
      color:var(--strong);
      font-size:15px;
      line-height:1.25;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .hero-actions {
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:18px;
      position:relative;
      z-index:2;
    }

    .btn {
      border:0;
      border-radius:15px;
      padding:11px 14px;
      color:#03101f;
      background:linear-gradient(135deg, #7dd3fc, #22c55e);
      font-weight:850;
      cursor:pointer;
      box-shadow:0 16px 34px rgba(34,197,94,.14);
      transition:transform .15s ease, filter .15s ease, opacity .15s ease;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      min-height:42px;
    }

    .btn:hover { transform:translateY(-1px); filter:brightness(1.06); }
    .btn:active { transform:translateY(0); }
    .btn.secondary {
      background:rgba(148,163,184,.16);
      color:var(--text);
      border:1px solid rgba(148,163,184,.24);
      box-shadow:none;
    }
    .btn.warn {
      background:linear-gradient(135deg, #fde68a, #fb7185);
      color:#29080e;
    }
    .btn:disabled {
      opacity:.45;
      cursor:not-allowed;
      transform:none;
    }

    .upload-card {
      padding:18px;
      display:grid;
      gap:12px;
    }

    .dropzone {
      border:1.5px dashed rgba(125,211,252,.45);
      border-radius:20px;
      padding:18px;
      background:rgba(56,189,248,.08);
      display:grid;
      gap:7px;
      cursor:pointer;
      transition:.15s ease;
    }

    .dropzone:hover, .dropzone.dragover {
      background:rgba(56,189,248,.14);
      border-color:rgba(125,211,252,.85);
      transform:translateY(-1px);
    }

    .upload-icon {
      width:48px;
      height:48px;
      display:grid;
      place-items:center;
      border-radius:16px;
      color:#052e2b;
      background:linear-gradient(135deg, #7dd3fc, #22c55e);
      box-shadow:0 16px 32px rgba(34,197,94,.16);
      font-size:11px;
      font-weight:950;
      letter-spacing:.04em;
    }

    .dropzone strong {
      font-size:17px;
      line-height:1.24;
      color:var(--strong);
      text-transform:uppercase;
      overflow-wrap:anywhere;
    }

    .dropzone small {
      color:var(--muted);
      line-height:1.55;
    }

    .file-line {
      display:flex;
      gap:10px;
      align-items:center;
      justify-content:space-between;
      color:var(--soft);
      font-size:12px;
      background:rgba(255,255,255,.05);
      border:1px solid var(--line);
      padding:10px 12px;
      border-radius:15px;
      min-height:41px;
    }

    .sheet-row {
      display:grid;
      grid-template-columns:1fr auto;
      gap:10px;
      align-items:end;
    }

    label {
      display:block;
      color:var(--muted);
      font-size:11px;
      margin:0 0 6px;
    }

    select, input {
      width:100%;
      border:1px solid var(--control-border);
      color:var(--text);
      background:var(--control-bg);
      border-radius:14px;
      padding:10px 12px;
      outline:none;
      min-height:42px;
    }

    input::placeholder { color:rgba(148,163,184,.62); }
    select:focus, input:focus {
      border-color:rgba(56,189,248,.72);
      box-shadow:0 0 0 3px rgba(56,189,248,.11);
    }

    .stats {
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:12px;
      margin-bottom:16px;
    }

    .stat {
      padding:15px;
      min-height:104px;
      overflow:hidden;
    }

    .stat:after {
      content:"";
      position:absolute;
      top:-42px;
      right:-34px;
      width:118px;
      height:118px;
      border-radius:999px;
      background:rgba(255,255,255,.20);
      pointer-events:none;
    }

    .stat:nth-child(1) {
      color:#fff;
      background:linear-gradient(135deg, rgba(79,124,255,.96), rgba(0,198,255,.86));
      border-color:rgba(255,255,255,.24);
    }

    .stat:nth-child(2) {
      color:#fff;
      background:linear-gradient(135deg, rgba(20,184,166,.96), rgba(34,197,94,.82));
      border-color:rgba(255,255,255,.24);
    }

    .stat:nth-child(3) {
      color:#fff;
      background:linear-gradient(135deg, rgba(245,158,11,.96), rgba(244,63,94,.82));
      border-color:rgba(255,255,255,.24);
    }

    .stat:nth-child(4) {
      color:#fff;
      background:linear-gradient(135deg, rgba(124,58,237,.92), rgba(6,182,212,.84));
      border-color:rgba(255,255,255,.24);
    }

    .stat-label {
      color:color-mix(in srgb, currentColor 76%, transparent);
      font-size:12px;
      margin-bottom:8px;
    }

    .stat-value {
      font-size:28px;
      line-height:1;
      font-weight:900;
      letter-spacing:-.05em;
      max-width:calc(100% - 32px);
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .stat-note {
      color:color-mix(in srgb, currentColor 76%, transparent);
      font-size:11px;
      line-height:1.45;
      margin-top:8px;
    }

    .filter-grid {
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
      gap:12px;
      margin-bottom:16px;
      align-items:start;
      grid-auto-flow:row dense;
    }

    .filter-card {
      padding:10px;
      border-radius:18px;
      overflow:visible;
      min-width:0;
    }

    .filter-card.wide {
      grid-column:span 2;
    }

    .filter-actions {
      display:flex;
      gap:8px;
      align-items:end;
    }

    .multi-filter {
      position:relative;
      width:100%;
    }

    .multi-toggle {
      width:100%;
      min-height:42px;
      border:1px solid var(--control-border);
      color:var(--text);
      background:var(--control-bg);
      border-radius:14px;
      padding:9px 11px;
      outline:none;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:9px;
      cursor:pointer;
      text-align:left;
    }

    .multi-toggle:hover, .multi-filter.open .multi-toggle {
      border-color:rgba(56,189,248,.72);
      box-shadow:0 0 0 3px rgba(56,189,248,.10);
    }

    .multi-label {
      min-width:0;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      font-size:12.5px;
      color:var(--table-cell);
    }

    .multi-badge {
      flex:0 0 auto;
      font-size:10.5px;
      color:#bae6fd;
      background:rgba(56,189,248,.13);
      border:1px solid rgba(56,189,248,.22);
      border-radius:999px;
      padding:3px 7px;
      white-space:nowrap;
    }

    .multi-panel {
      position:static;
      z-index:auto;
      display:none;
      margin-top:8px;
      padding:10px;
      background:var(--dropdown-bg);
      border:1px solid rgba(148,163,184,.24);
      border-radius:18px;
      box-shadow:0 18px 40px rgba(0,0,0,.30);
      backdrop-filter:blur(18px);
      min-width:0;
      width:100%;
    }

    .multi-filter.open .multi-panel { display:block; }

    .multi-search {
      min-height:38px;
      padding:8px 10px;
      border-radius:12px;
      margin-bottom:8px;
      font-size:12px;
    }

    .multi-mini-actions {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:7px;
      margin-bottom:8px;
    }

    .mini-btn {
      min-height:32px;
      border-radius:11px;
      padding:7px 9px;
      box-shadow:none;
      font-size:11px;
      background:rgba(148,163,184,.16);
      color:var(--text);
      border:1px solid rgba(148,163,184,.22);
    }

    .multi-options {
      max-height:260px;
      overflow:auto;
      display:grid;
      gap:6px;
      padding-right:2px;
    }

    .multi-option {
      display:flex;
      align-items:flex-start;
      gap:8px;
      padding:8px 9px;
      border-radius:12px;
      background:var(--item-bg);
      border:1px solid rgba(148,163,184,.11);
      cursor:pointer;
    }

    .multi-option:hover {
      background:var(--item-hover);
      border-color:rgba(56,189,248,.18);
    }

    .multi-option input {
      width:15px;
      height:15px;
      min-height:0;
      margin:2px 0 0;
      accent-color:#38bdf8;
      flex:0 0 auto;
    }

    .multi-option-text {
      min-width:0;
      flex:1;
      font-size:12px;
      line-height:1.35;
      color:var(--table-cell);
      overflow:hidden;
      text-overflow:ellipsis;
    }

    .multi-option-count {
      flex:0 0 auto;
      color:#94a3b8;
      font-size:10.5px;
      margin-left:5px;
    }

    .multi-empty {
      padding:10px;
      color:#94a3b8;
      font-size:12px;
      text-align:center;
      border:1px dashed rgba(148,163,184,.18);
      border-radius:12px;
    }

    .main-grid {
      display:grid;
      grid-template-columns:minmax(0, 1.5fr) minmax(380px, .75fr);
      gap:16px;
      align-items:start;
    }

    .map-panel {
      padding:0;
      overflow:hidden;
      position:relative;
    }

    #map {
      width:100%;
      height:760px;
      border-radius:var(--radius);
      background:var(--map-bg);
      z-index:1;
    }

    #map canvas,
    #map svg,
    #map img {
      max-width:none !important;
      max-height:none !important;
    }

    .map-topbar {
      position:absolute;
      z-index:500;
      top:16px;
      left:92px;
      right:74px;
      pointer-events:none;
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .map-chip {
      pointer-events:auto;
      background:var(--chip-bg);
      border:1px solid rgba(148,163,184,.22);
      border-radius:16px;
      padding:10px 12px;
      color:var(--soft);
      box-shadow:0 12px 35px rgba(0,0,0,.28);
      backdrop-filter:blur(12px);
      font-size:12px;
      line-height:1.45;
      max-width:min(420px, 44%);
      overflow-wrap:anywhere;
    }

    .legend {
      position:absolute;
      z-index:500;
      bottom:20px;
      left:20px;
      background:var(--chip-bg);
      border:1px solid rgba(148,163,184,.22);
      border-radius:16px;
      padding:10px 12px;
      color:var(--soft);
      box-shadow:0 12px 35px rgba(0,0,0,.28);
      backdrop-filter:blur(12px);
      font-size:12px;
      line-height:1.65;
    }

    .legend-row {
      display:flex;
      align-items:center;
      gap:8px;
      white-space:nowrap;
    }

    .dot {
      width:10px;
      height:10px;
      border-radius:999px;
      background:var(--blue);
      display:inline-block;
    }

    .line-sample {
      width:28px;
      height:4px;
      border-radius:999px;
      background:var(--green);
      display:inline-block;
    }

    .dash-sample {
      width:28px;
      border-top:3px dashed var(--rose);
      display:inline-block;
    }

    .side {
      display:grid;
      gap:16px;
    }

    .panel {
      padding:16px;
    }

    .panel-title {
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:8px;
      margin-bottom:12px;
    }

    .panel-title h2 {
      margin:0;
      font-size:16px;
      letter-spacing:-.02em;
    }

    .pill {
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-size:11px;
      color:#bae6fd;
      border:1px solid rgba(56,189,248,.22);
      background:rgba(56,189,248,.11);
      border-radius:999px;
      padding:6px 9px;
      white-space:nowrap;
    }

    .tabs {
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      margin-bottom:12px;
    }

    .tab {
      border:1px solid var(--line);
      background:rgba(255,255,255,.05);
      color:var(--muted);
      border-radius:999px;
      padding:8px 10px;
      cursor:pointer;
      font-size:12px;
      font-weight:750;
    }

    .tab.active {
      color:#e0f2fe;
      border-color:rgba(56,189,248,.42);
      background:rgba(56,189,248,.14);
    }

    .insight-list, .branch-list {
      display:grid;
      gap:8px;
      max-height:330px;
      overflow:auto;
      padding-right:4px;
    }

    .insight-item, .branch-item {
      padding:11px;
      border:1px solid rgba(148,163,184,.14);
      border-radius:16px;
      background:var(--item-bg);
    }

    .branch-top {
      display:flex;
      justify-content:space-between;
      gap:8px;
      align-items:flex-start;
      margin-bottom:7px;
    }

    .branch-name {
      color:var(--strong);
      font-weight:850;
      font-size:13px;
      line-height:1.35;
      overflow-wrap:anywhere;
    }

    .branch-count {
      color:#bbf7d0;
      background:rgba(34,197,94,.12);
      border:1px solid rgba(34,197,94,.22);
      border-radius:999px;
      font-size:11px;
      padding:4px 7px;
      white-space:nowrap;
    }

    .branch-meta {
      color:var(--muted);
      font-size:11px;
      line-height:1.55;
      overflow-wrap:anywhere;
    }

    .bar-row {
      display:grid;
      grid-template-columns:132px minmax(80px, 1fr) 42px;
      gap:9px;
      align-items:center;
      color:var(--soft);
      font-size:12px;
      margin:8px 0;
    }

    .bar-label {
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    .bar-bg {
      height:9px;
      background:rgba(148,163,184,.14);
      border-radius:999px;
      overflow:hidden;
    }

    .bar-fill {
      height:100%;
      border-radius:999px;
      background:linear-gradient(90deg, var(--blue), var(--green));
      min-width:3px;
    }

    .quality-grid {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:8px;
    }

    .quality-card {
      border:1px solid rgba(148,163,184,.13);
      background:rgba(255,255,255,.045);
      border-radius:16px;
      padding:10px;
    }

    .quality-card strong {
      display:block;
      color:var(--strong);
      font-size:18px;
      letter-spacing:-.03em;
      margin-bottom:2px;
    }

    .quality-card span {
      color:var(--muted);
      font-size:11px;
      line-height:1.45;
    }

    .table-panel {
      margin-top:16px;
    }

    .table-tools {
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      justify-content:flex-end;
      margin-bottom:10px;
    }

    .table-wrap {
      overflow:auto;
      max-height:430px;
      border:1px solid rgba(148,163,184,.15);
      border-radius:18px;
    }

    table {
      width:100%;
      border-collapse:collapse;
      min-width:1280px;
      font-size:12px;
    }

    thead th {
      position:sticky;
      top:0;
      z-index:3;
      text-align:left;
      background:var(--table-head);
      color:var(--soft);
      border-bottom:1px solid rgba(148,163,184,.20);
      padding:10px;
      white-space:nowrap;
    }

    tbody td {
      border-bottom:1px solid rgba(148,163,184,.10);
      padding:9px 10px;
      color:var(--table-cell);
      vertical-align:top;
      max-width:260px;
      overflow-wrap:anywhere;
    }

    tbody tr:hover {
      background:rgba(56,189,248,.065);
    }

    .status-good { color:#86efac; font-weight:850; }
    .status-bad { color:#fecdd3; font-weight:850; }
    .status-mid { color:#fde68a; font-weight:850; }

    .route-arrow {
      background:transparent;
      border:0;
      color:#ffffff;
      font-size:18px;
      font-weight:950;
      text-shadow:0 2px 9px rgba(0,0,0,.9);
    }

    .route-arrow div {
      width:18px;
      height:18px;
      display:grid;
      place-items:center;
      transform-origin:center;
    }

    .leaflet-popup-content-wrapper, .leaflet-popup-tip {
      background:var(--dropdown-bg);
      color:var(--text);
      border:1px solid rgba(148,163,184,.24);
    }

    .hover-popup .leaflet-popup-content-wrapper {
      box-shadow:0 18px 40px rgba(0,0,0,.35);
    }

    .leaflet-interactive {
      cursor:pointer;
    }

    .leaflet-popup-content {
      min-width:260px;
      line-height:1.45;
    }

    .popup-title {
      font-weight:900;
      font-size:14px;
      color:var(--strong);
      margin-bottom:7px;
      overflow-wrap:anywhere;
    }

    .popup-row { margin:4px 0; color:var(--soft); }
    .popup-row b { color:var(--strong); }

    .modal {
      position:fixed;
      inset:0;
      display:none;
      place-items:center;
      background:var(--overlay);
      backdrop-filter:blur(14px);
      z-index:9999;
      padding:18px;
    }

    .modal.show { display:grid; }
    .modal-card {
      max-width:760px;
      width:min(760px, 96vw);
      background:var(--dropdown-bg);
      border:1px solid var(--line2);
      border-radius:26px;
      box-shadow:var(--shadow);
      padding:20px;
    }

    .modal-card h3 {
      margin:0 0 10px;
      font-size:20px;
      letter-spacing:-.02em;
    }

    .modal-card p {
      color:var(--muted);
      line-height:1.65;
      margin:8px 0;
      font-size:14px;
    }

    .loading {
      position:fixed;
      inset:0;
      display:none;
      place-items:center;
      background:var(--overlay);
      backdrop-filter:blur(14px);
      z-index:9998;
      padding:18px;
    }

    .loading.show { display:grid; }
    .loader-card {
      width:min(480px, 92vw);
      background:var(--dropdown-bg);
      border:1px solid var(--line2);
      border-radius:26px;
      box-shadow:var(--shadow);
      padding:24px;
      text-align:center;
    }

    .spinner {
      width:60px;
      height:60px;
      border-radius:999px;
      border:4px solid rgba(148,163,184,.18);
      border-top-color:var(--blue);
      margin:0 auto 15px;
      animation:spin 1s linear infinite;
    }

    @keyframes spin { to { transform:rotate(360deg); } }

    .hint {
      color:var(--muted);
      font-size:12px;
      line-height:1.55;
    }

    .focus-banner {
      display:none;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:12px 14px;
      margin:0 0 16px;
      border-radius:18px;
      border:1px solid rgba(56,189,248,.24);
      background:rgba(56,189,248,.10);
      color:var(--text);
      box-shadow:var(--shadow);
      backdrop-filter:blur(14px);
    }

    .focus-banner.show {
      display:flex;
    }

    .focus-banner b {
      color:var(--strong);
    }

    .focus-banner .hint {
      color:var(--soft);
      margin-top:3px;
    }

    .empty {
      color:var(--muted);
      font-size:13px;
      line-height:1.6;
      padding:12px;
      border-radius:16px;
      border:1px dashed rgba(148,163,184,.20);
      background:rgba(255,255,255,.035);
    }

    .sheet-meta {
      color:var(--muted);
      font-size:11px;
      line-height:1.5;
      margin-top:3px;
    }

    @media (max-width:1500px) {
      .filter-grid { grid-template-columns:repeat(4, minmax(190px, 1fr)); }
      .stats { grid-template-columns:repeat(4, minmax(0, 1fr)); }
    }

    @media (max-width:1180px) {
      .hero, .main-grid { grid-template-columns:1fr; }
      .filter-grid { grid-template-columns:repeat(3, minmax(190px, 1fr)); }
      #map { height:650px; }
    }

    @media (max-width:980px) {
      .filter-grid { grid-template-columns:repeat(2, minmax(190px, 1fr)); }
      .filter-card.wide { grid-column:span 2; }
      .hero-intel { grid-template-columns:1fr; }
    }

    @media (max-width:780px) {
      .app { padding:68px 12px 12px; }
      .stats { grid-template-columns:repeat(2, minmax(0, 1fr)); }
      .filter-grid { grid-template-columns:1fr; }
      .filter-card.wide { grid-column:auto; }
      .hero-actions, .sheet-row, .filter-actions { flex-direction:column; display:grid; grid-template-columns:1fr; }
      #map { height:560px; }
      .quality-grid { grid-template-columns:1fr; }
      .map-topbar { display:none; }
    }
  
