/* TheLiveMap Cyber Board (Nov 12 2026). 24/CTU look from the approved concept v2; gauge names are the approved five. */
:root{--bg:#050708;--panel:#0a1012;--line:#1d2a2e;--txt:#cfe3e6;--dim:#6f8a8f;--amber:#ffb000;--gray:#9aa3a8;--green:#29ff7a;--yellow:#ffd21f;--red:#ff2b2b;--cyan:#3fe0ff;--orange:#ff8a1a;
  --mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000;color:var(--txt);font-family:var(--mono)}
body{background:radial-gradient(ellipse at 50% 30%,#0b1518 0%,#050708 55%,#000 100%) fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.35;z-index:0;
  background-image:linear-gradient(rgba(63,224,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(63,224,255,.04) 1px,transparent 1px);background-size:80px 80px}
a{color:var(--cyan)}
.dim{color:var(--dim)}
.wrap{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}
#topbar{height:48px;display:flex;align-items:center;gap:14px;padding:0 20px;border-bottom:1px solid #ffb00033;flex:none}
.brand{font-weight:800;font-size:17px;color:#fff;display:flex;align-items:center;gap:8px;text-decoration:none}
.brand .name{letter-spacing:.18em;margin-right:-0.18em}
.brand .tld{color:var(--amber);letter-spacing:.18em}
.brand .dot{width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);flex:none}
.back{border:1px solid var(--amber);color:var(--amber);text-decoration:none;font-size:11px;letter-spacing:.14em;padding:5px 10px;background:#0a1012}
.back:hover{background:#ffb00018}
.here{font-size:11px;letter-spacing:.2em;color:var(--cyan);font-weight:800}
.clocks{margin-left:auto;display:flex;gap:18px}
.clock{display:flex;flex-direction:column;align-items:flex-end}
.clock label{font-size:9px;color:var(--dim);letter-spacing:.2em}
.clock span{font-size:20px;font-weight:600;color:var(--amber);text-shadow:0 0 10px #ffb00088;font-variant-numeric:tabular-nums}
.gauge-bar{flex:none;display:flex;flex-direction:column;gap:4px;padding:7px 20px 8px;border-bottom:1px solid #3fe0ff55;background:#041016;box-shadow:0 0 18px #3fe0ff18}
.cg-kicker{display:flex;align-items:baseline;gap:10px;letter-spacing:.16em;font-size:10px;color:var(--cyan);flex-wrap:wrap}
.cg-kicker b{font-weight:800;color:#fff}
.cg-kicker i{font-style:normal;color:var(--dim);letter-spacing:.12em;font-size:8.5px}
.cg-track{display:flex;gap:3px}
.cg-cell{flex:1;text-align:center;font-size:11px;letter-spacing:.14em;font-weight:700;padding:5px 4px;border:1px solid #1d2a2e;color:#5d6e72;background:#0a1012}
.cg-cell.g{--c:#29ff7a}.cg-cell.b{--c:#3fe0ff}.cg-cell.y{--c:#ff8a1a}.cg-cell.o{--c:#ff2b2b}.cg-cell.r{--c:#ff7ad9}
.cg-cell.on{color:#000;background:var(--c);border-color:var(--c);box-shadow:0 0 14px var(--c)}
.cg-reason{font-size:10.5px;color:#b8cacd;line-height:1.4}
.cg-reason b{color:var(--lc,#3fe0ff)}
.cg-reason a{margin-left:6px;font-size:10px}
.explain{font-size:10.5px}
.explain summary{cursor:pointer;color:var(--cyan);letter-spacing:.12em;font-size:10px;text-transform:uppercase;width:max-content}
.explain .ex-body{margin-top:6px;border:1px solid #1d3a42;background:#07141a;padding:9px 12px;line-height:1.5;color:#9bb4b8;max-width:1100px}
.explain ul{margin:6px 0;padding:0;list-style:none}
.explain li{margin:4px 0}
.explain li b{color:#fff;letter-spacing:.12em;margin-right:8px}
.explain .sw{display:inline-block;width:9px;height:9px;margin-right:8px;vertical-align:0}
.sw.g{background:#29ff7a}.sw.b{background:#3fe0ff}.sw.y{background:#ff8a1a}.sw.o{background:#ff2b2b}.sw.r{background:#ff7ad9}
.ex-note{margin:0}.ex-note b{color:#fff}
main{flex:1;display:grid;grid-template-columns:1fr 400px;min-height:0}
.left{display:flex;flex-direction:column;border-right:1px solid var(--line);min-width:0;min-height:0}
.head{padding:8px 22px;border-bottom:1px solid var(--line)}
.head h1{margin:0 0 4px;font-size:15px;letter-spacing:.22em;color:var(--cyan);font-weight:800}
.head p{margin:0;font-size:11.5px;line-height:1.5;color:#9bb4b8}
.stats{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.stat{border:1px solid var(--line);background:#080c0e;padding:5px 12px;min-width:110px}
.stat .n{font-size:20px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.stat .n.y{color:var(--yellow)}.stat .n.g{color:var(--gray)}.stat .n.c{color:var(--cyan)}
.stat .l{font-size:9px;letter-spacing:.14em;color:var(--dim);margin-top:2px}
.filters{display:flex;gap:6px;padding:6px 22px;border-bottom:1px solid var(--line);align-items:center;flex-wrap:wrap}
.filters span{font-size:9px;letter-spacing:.16em;color:var(--dim);margin-right:6px}
.chip{border:1px solid var(--line);background:transparent;color:var(--txt);font-family:inherit;font-size:10.5px;letter-spacing:.08em;padding:5px 10px;cursor:pointer}
.chip.on{border-color:var(--cyan);color:var(--cyan);background:#3fe0ff14}
.list{flex:1;min-height:0;overflow:auto;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;table-layout:fixed}
col.c-pip{width:24px}col.c-src{width:104px}col.c-when{width:96px}col.c-st{width:96px}
thead{position:sticky;top:0;z-index:3;background:#080c0e;box-shadow:0 -20px 0 0 #080c0e}thead th{text-align:left;font-weight:600;font-size:9px;letter-spacing:.16em;color:var(--dim);padding:7px 10px;border-bottom:1px solid var(--line);background:#080c0e;box-shadow:0 -20px 0 0 #080c0e}
tbody tr{border-bottom:1px solid #121b1e;cursor:pointer}
tbody tr:hover{background:#3fe0ff0a}
tbody tr.sel{background:#3fe0ff14}
tbody td{padding:6px 10px;vertical-align:top;line-height:1.3;border-bottom:1px solid #121b1e}
td.empty{color:var(--dim);cursor:default;padding:18px 10px}
.pip{width:9px;height:9px;border-radius:50%;display:inline-block;margin-top:4px;box-shadow:0 0 6px currentColor}
.pip.yellow{background:var(--yellow);color:var(--yellow)}.pip.green{background:var(--green);color:var(--green)}.pip.gray{background:var(--gray);color:var(--gray)}.pip.red{background:var(--red);color:var(--red)}
.title{color:#fff;font-weight:600;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal;overflow-wrap:break-word}
.sub{color:var(--dim);font-size:10.5px;margin-top:2px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal;overflow-wrap:break-word}
.badge{font-size:8.5px;letter-spacing:.1em;padding:1px 5px;border:1px solid;white-space:nowrap}
.badge.v{color:var(--green);border-color:#29ff7a66}.badge.u{color:var(--gray);border-color:#9aa3a866}
.badge.k{color:var(--cyan);border-color:#3fe0ff66}
.time{color:var(--dim);font-size:10.5px;font-variant-numeric:tabular-nums;white-space:normal;overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.src{color:#cfe3e6;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.right{background:var(--panel);display:flex;flex-direction:column;min-width:0}
.rh{padding:12px 18px;font-size:11px;letter-spacing:.2em;color:var(--amber);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.rh i{font-style:normal;color:var(--dim);letter-spacing:.08em;font-size:10px}
.detail{padding:14px 18px 6px}
.detail h2{margin:0 0 8px;font-size:15px;color:#fff;font-weight:800;line-height:1.3}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;align-items:center}
.dsum{font-size:12px;line-height:1.5;margin:0 0 12px}
.kv{display:grid;grid-template-columns:90px 1fr;gap:4px 10px;font-size:11px;margin:0}
.kv dt{color:var(--dim)}.kv dd{margin:0;color:#fff;overflow-wrap:anywhere}
.open-map{display:inline-block;margin-top:12px;border:1px solid var(--cyan);color:var(--cyan);text-decoration:none;padding:6px 10px;font-size:11px;letter-spacing:.12em}
.open-map:hover{background:#3fe0ff14}
.note{margin:10px 18px;padding:9px 11px;border:1px solid #1d3a42;background:#07141a;font-size:10.5px;line-height:1.5;color:#9bb4b8}
.kev{margin-top:auto;border-top:1px solid var(--line);padding:10px 18px 12px}
.kev h3{margin:0 0 5px;font-size:10px;letter-spacing:.18em;color:var(--cyan)}
.kev p{margin:0 0 6px;font-size:10.5px;line-height:1.45;color:#9bb4b8}
.kev ul{margin:0;padding:0;list-style:none}
.kev li{font-size:10.5px;color:#fff;padding:3px 0;border-bottom:1px solid #121b1e;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.kev li.dim{color:var(--dim);display:block}
.kev li span{color:var(--dim);font-size:10px;white-space:nowrap}
.foot{min-height:32px;border-top:1px solid var(--line);display:flex;align-items:center;padding:6px 20px;font-size:9.5px;color:var(--dim);line-height:1.4;flex-wrap:wrap}
.foot b{color:var(--amber);font-weight:600}
@media (min-width:901px){html,body{height:100%;height:100dvh;overflow:hidden}.wrap{height:100vh;height:100dvh}main{overflow:hidden}.left{min-height:0;overflow:hidden}.right{overflow:auto}}
@media (max-width:900px){
  #topbar{padding:0 10px;gap:8px;height:auto;min-height:48px;flex-wrap:wrap}
  .brand{font-size:13px}.brand .name,.brand .tld{letter-spacing:.12em}
  .here{display:none}
  .clocks{gap:10px}.clock span{font-size:14px}
  .gauge-bar{padding:7px 10px}
  .cg-cell{font-size:8.5px;letter-spacing:.04em;padding:6px 1px}
  main{display:block}
  .left{border-right:0}
  .head,.filters{padding-left:12px;padding-right:12px}
  .stat{min-width:0;flex:1;padding:5px 8px}
  table,thead,tbody,tr,td{display:block;width:100%}
  thead,colgroup{display:none}
  tbody tr{display:grid;grid-template-columns:18px 1fr auto;grid-template-areas:"pip title st" "pip src when";gap:2px 8px;padding:8px 12px}
  tbody td{padding:0}
  tbody td:nth-child(1){grid-area:pip}tbody td:nth-child(2){grid-area:title;min-width:0}tbody td:nth-child(3){grid-area:src;min-width:0}tbody td:nth-child(4){grid-area:when;text-align:right}tbody td:nth-child(5){grid-area:st;text-align:right}
  .title,.sub{white-space:normal;display:block;-webkit-line-clamp:unset;line-clamp:unset;-webkit-box-orient:unset;overflow:visible}
  .time{white-space:nowrap;display:inline;-webkit-line-clamp:unset;line-clamp:unset;overflow:visible}
  td.empty{grid-column:1/-1}
  .right{border-top:1px solid var(--line)}
}

/* v2 Nov 12 2026: provider outages + human-set note */
.outages{border-bottom:1px solid var(--line);padding:10px 18px 10px;background:#0a1114}
.outages h2{margin:0 0 4px;font-size:11px;letter-spacing:.18em;color:var(--yellow,#ffd21f)}
.outages h2 i{font-style:normal;color:var(--dim);margin-left:8px;font-size:10px;letter-spacing:.12em}
.po-note{margin:0 0 6px;font-size:10px;line-height:1.45;color:#9bb4b8}
#po-list{margin:0;padding:0;list-style:none;max-height:260px;overflow:auto}
#po-list li{padding:6px 0 7px;border-top:1px solid #121b1e;font-size:10.5px;line-height:1.4}
#po-list li.dim{color:var(--dim)}
#po-list li.open{border-left:2px solid #ffd21f;padding-left:8px}
#po-list li.res{border-left:2px solid #2a3b40;padding-left:8px;opacity:.85}
.po-top b{color:#fff;letter-spacing:.06em}
.po-svc{color:#cfe3e6}
.po-q{color:#9bb4b8;margin:2px 0}
.po-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:9.5px}
.po-st.a{color:#ffd21f;letter-spacing:.1em}.po-st.r{color:#29ff7a}
.po-src a{margin-right:10px;font-size:10px}
.po-src .open-map{display:inline-block;margin-top:2px}
@media (max-width:900px){#po-list{max-height:none}.outages{padding:10px 12px}}


/* v4 Nov 12 2026: on short desktop/iPad-landscape viewports, cap the already-scrollable provider-outages list so the incident list has leftover room down to the footer. Outages copy, data, and colors are unchanged. */
@media (min-width:901px) and (max-height:850px){#po-list{max-height:120px}}

/* v4 Nov 12 2026: incident list is its own scroll area; filter row and column header stay visible above it. Right-side INCIDENT panel unchanged. */
/* v6 Nov 12 2026: Incident column takes leftover width; Source/When/Status compact; headline line-clamp 2, dek line-clamp 2 (phone card layout still unclamped). */
/* v7 Nov 12 2026: opaque sticky thead + upward shadow so taller 2-line rows do not peek above the pinned header. */
@media (max-width:900px){.list{flex:none;height:60vh;max-height:60vh;height:60dvh;max-height:60dvh;min-height:12rem}}