:root{
      --bg:#0b0b10;
      --card:#141421;
      --muted:#a0a3ad;
      --text:#f3f4f8;
      --accent:#8a8fff;
      --ok:#34c759;           /* green text for OK */
      --warn:#ffcc00;         /* orange–yellow for Minor */
      --bad:#ff3b30;          /* red for Major / No Service */
      --line-Red:#ff3b30;
      --line-Gold:#ffcc00;
      --line-Green:#34c759;
      --line-Orange:#ff9500;
      --line-Blue:#007aff;
      --line-Pink:#ff2d55;
      --line-Brown:#a2845e;
      --line-Silver:#c0c0c0;
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Inter,Helvetica,Arial,sans-serif;
      background:radial-gradient(1200px 600px at 50% -200px,#151528,#0a0a12) fixed;
      color:var(--text);
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
      padding-bottom:calc(78px + env(safe-area-inset-bottom)); /* room for tab bar */
    }
    header{
      position:sticky;top:0;z-index:10;
      backdrop-filter:saturate(180%) blur(14px);
      background:rgba(10,10,18,.65);
      border-bottom:1px solid rgba(255,255,255,.08);
      padding-top:env(safe-area-inset-top);
    }
    .wrap{max-width:860px;margin:0 auto;padding:12px 16px;}
    main.wrap{padding-bottom:calc(220px + env(safe-area-inset-bottom));}
    main.wrap::after{content:'';display:block;height:72px;}
    .title{font-weight:800;letter-spacing:.2px;font-size:22px;}
    .subtle{color:var(--muted);font-size:12px;}
    .card{background:linear-gradient(180deg,rgba(255,255,255,.03),transparent),var(--card);border:5px solid rgba(255,255,255,.06);border-radius:18px;padding:14px;}
    .grid{display:grid;gap:12px;margin-top:14px;}

    /* status list rows */
    .status-list{display:grid;gap:10px;}
    .row, .srow summary{
      display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
      padding:16px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02);
      list-style:none;cursor:default;
    }
    .srow{border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.02);}
    .srow summary{cursor:pointer;}
    .srow summary::-webkit-details-marker{display:none}
    .srow[open] summary .arrow{transform:rotate(90deg)}
    .name{font-weight:600;letter-spacing:.2px}
    .dot{width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.08) inset}
    .lnicon{width:28px;height:28px;object-fit:contain;display:block}

    .pill{
      font-weight:600;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.04);
      padding:6px 10px;border-radius:999px;font-size:12px;white-space:nowrap;
    }
    .ok{color:var(--ok)}
    .warn{color:var(--warn)}
    .bad{color:var(--bad)}
    .nosvc{color:var(--bad);font-weight:800;letter-spacing:.4px;}
    .arrow{display:inline-block;transition:transform .2s ease;margin-left:6px;opacity:.8}

    .reason{padding:0 16px 12px 44px;color:#fff;line-height:1.5}

    .status-symbol{width:18px;height:18px;display:inline-block;vertical-align:middle;flex:0 0 auto}
    .hazard-symbol{filter:drop-shadow(0 0 6px rgba(255,204,0,.22))}
    .elevator-card{display:grid;gap:12px}
    .elevator-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
    .elevator-count-pill{
      min-width:54px;display:inline-flex;align-items:center;justify-content:center;gap:6px;
      border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);
      padding:6px 10px;font-weight:800;font-size:13px;
    }
    .elevator-status-list{display:grid;gap:9px}
    .elevator-section-title{
      margin-top:2px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.35px;text-transform:uppercase;
    }
    .elevator-row{
      border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(255,255,255,.025);overflow:hidden;
    }
    .elevator-row summary{
      display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;
      padding:13px 12px;list-style:none;cursor:pointer;
    }
    .elevator-row summary::-webkit-details-marker{display:none}
    .elevator-row[open]{background:rgba(255,255,255,.04)}
    .elevator-row-main{min-width:0;display:grid;gap:3px}
    .elevator-station-line{display:flex;align-items:center;gap:7px;min-width:0;flex-wrap:wrap}
    .elevator-station-line strong{font-weight:800}
    .station-badges{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap}
    .station-badges img{width:21px;height:21px;display:block;object-fit:contain}
    .elevator-hint{color:var(--muted);font-size:12px}
    .elevator-row-pill{
      display:inline-flex;align-items:center;gap:5px;min-width:44px;justify-content:center;
      padding:6px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-weight:800;
    }
    .elevator-row-pill.hazard{color:var(--warn);background:rgba(255,204,0,.09)}
    .elevator-row-pill.repaired{color:var(--ok);background:rgba(52,199,89,.09)}
    .elevator-detail-list{display:grid;gap:9px;padding:0 12px 13px}
    .elevator-detail-row{
      display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:start;
      padding:11px;border-radius:13px;background:rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.06);
    }
    .elevator-detail-icon{
      width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
      background:rgba(138,143,255,.12);color:var(--accent);
    }
    .elevator-symbol{width:24px;height:24px}
    .elevator-detail-copy{display:grid;gap:4px;color:var(--muted);font-size:12px;line-height:1.35}
    .elevator-detail-copy strong{color:var(--text);font-size:14px}
    .repair-state{display:inline-flex;align-items:center;gap:6px;font-weight:800}
    .repair-state.awaiting{color:#ffb8b3}
    .repair-state.progress{color:#ffe1a6}
    .repair-state.repaired{color:#9ff0b8}
    .repair-symbol{width:17px;height:17px}
    .elevator-empty{
      padding:14px;border:1px dashed rgba(255,255,255,.12);border-radius:14px;color:var(--muted);text-align:center;font-size:13px;
    }

    /* --- Bottom tab bar (same as other pages) --- */
    .tabbar{
      position:fixed;left:0;right:0;bottom:0;z-index:20;
      display:grid;grid-template-columns:repeat(5,1fr);align-items:end;gap:4px;
      padding:10px 10px calc(10px + env(safe-area-inset-bottom));
      border-top:1px solid rgba(255,255,255,.08);
      background:rgba(180,180,180,.20);
      backdrop-filter:saturate(180%) blur(14px);
    }
    .tabbar a{text-decoration:none;color:var(--muted);text-align:center;}
    .tabbar .item{display:grid;gap:5px;justify-items:center;font-size:11px;font-weight:650;}
    .tabbar .item img{width:25px;height:25px;display:block;opacity:.8;filter:grayscale(100%);}
    .tabbar a.active{color:var(--accent);}
    .tabbar a.active img{opacity:1;filter:brightness(0) saturate(100%) invert(61%) sepia(39%) saturate(1470%) hue-rotate(203deg) brightness(101%) contrast(101%);}
