*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#040508;--panel:#0e1117;--hdr:#090c12;--surface:#131820;
  --border:#1c2433;--border-dim:#141a24;
  --t1:#e2e6ed;--t2:#a0a8b8;--t3:#6b7588;--t4:#454d5e;
  --green:#1a8c3a;--green-dim:rgba(26,140,58,0.2);--green-bg:rgba(26,140,58,0.06);
  --amber:#e6a817;--red:#e05252;
  --mono:"SF Mono","Consolas","Menlo",monospace;
  --sans:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --row:32px;--ease:cubic-bezier(0.22,1,0.36,1);
}
html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--t1);font:400 12px/1.4 var(--mono)}
::selection{background:var(--green);color:var(--bg)}
a{color:var(--green);text-decoration:none}

#app{height:100vh;display:grid;grid-template-rows:40px 1fr 28px}
#main{display:grid;grid-template-columns:320px 1fr 300px;gap:1px;min-height:0;background:var(--border-dim)}
.panel{background:var(--panel);display:flex;flex-direction:column;min-height:0}
.panel-bar{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--border-dim);font:500 10px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--t4)}
.panel-meta{font:400 10px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--t4)}
.panel-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:4px 0}

/* ---- HEADER ---- */
#hdr{background:var(--hdr);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px}
.hdr-left,.hdr-right{display:flex;align-items:center;gap:10px}
.hdr-icon{color:var(--t2)}
.hdr-brand{font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--t1)}
.hdr-sep{color:var(--t4)}
.hdr-label{font:500 10px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--t4)}
.hdr-accent{font:500 10px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
.hdr-clock{font:400 11px/1 var(--mono);color:var(--t3);font-variant-numeric:tabular-nums}
.hdr-live{display:flex;align-items:center;gap:5px;font:500 10px/1 var(--sans);letter-spacing:.1em;color:var(--green)}
.dot-pulse{width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.3}50%{opacity:1}}
.hdr-stats{font:400 10px/1 var(--mono);color:var(--t4)}
.hdr-stats b{color:var(--t2);font-weight:500}
.hdr-demo{font:500 9px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber);border:1px solid rgba(230,168,23,0.3);padding:3px 8px;border-radius:3px}

/* ---- FEED ---- */
.feed-line{display:grid;grid-template-columns:56px 72px 26px 1fr;gap:8px;align-items:baseline;padding:5px 14px;min-height:var(--row);font-size:12px;line-height:1.5;border-left:2px solid transparent;animation:lineIn 200ms var(--ease) both}
.feed-line:hover{background:var(--surface)}
.feed-line.flash{border-left-color:var(--green);animation:lineIn 200ms var(--ease) both,flashBorder 1.5s ease-out both}
.feed-line.highlight{background:var(--green-bg);border-left-color:var(--green)}
@keyframes lineIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@keyframes flashBorder{0%{border-left-color:var(--green)}100%{border-left-color:transparent}}
.feed-ts{color:var(--t4);font-size:11px;font-variant-numeric:tabular-nums}
.feed-src{color:var(--t3);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed-type{color:var(--green);font-size:10px;font-weight:600;letter-spacing:.04em}
.feed-body{color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- GLOBE ---- */
.panel-globe-body{padding:0;position:relative}
#globe{width:100%;height:100%;display:block;cursor:grab;touch-action:none}
#globe:active{cursor:grabbing}
.panel-globe-body::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 60px rgba(0,0,0,0.5);border-radius:0}

/* ---- DETAIL ---- */
.detail-empty{padding:48px 20px;text-align:center;color:var(--t4);font:400 13px/1.8 var(--sans)}
.detail-empty .dim{font-size:11px;margin-top:4px;color:var(--t4)}
.detail-card{padding:16px}
.detail-name{font:600 16px/1.3 var(--sans);color:var(--t1);margin-bottom:2px}
.detail-sub{font:400 11px/1.3 var(--mono);color:var(--t3);margin-bottom:14px}
.detail-status{display:inline-flex;align-items:center;gap:5px;font:500 10px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:3px;margin-bottom:16px}
.detail-status.live{color:var(--green);border:1px solid var(--green-dim)}
.detail-grid{display:grid;grid-template-columns:76px 1fr;gap:4px 10px;font-size:11px;margin-bottom:20px}
.detail-grid dt{color:var(--t4)}
.detail-grid dd{color:var(--t2)}
.detail-section{font:500 10px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--t4);padding:10px 0 8px;border-top:1px solid var(--border-dim)}
.detail-extract{font-size:11px;color:var(--t2);line-height:1.55;padding:4px 0 4px 12px;border-left:2px solid var(--green-dim);margin-bottom:8px}
.detail-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.detail-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--green-dim);border-radius:3px;font:400 11px/1 var(--mono);color:var(--t2)}
.corr-chip{border-color:rgba(230,168,23,0.25);border-style:dashed}
.dot-corr{width:4px;height:4px;border-radius:50%;background:var(--amber)}
.chip-lang{color:var(--t4);font-size:10px}
.chip-topics{color:var(--amber);font-size:9px;margin-left:2px}
.feed-line.corroborated{border-left-color:var(--amber)!important;background:rgba(230,168,23,0.04)}
.detail-briefing{font:400 13px/1.65 var(--sans);color:var(--t1);margin-bottom:12px;padding:0 0 0 12px;border-left:2px solid var(--green)}
.detail-feed-title{font:500 10px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--t4);padding:10px 0 8px;border-top:1px solid var(--border-dim);margin-top:8px}
.detail-feed-line{font-size:11px;color:var(--t3);line-height:1.5;padding:3px 0;border-bottom:1px solid var(--border-dim)}
.detail-feed-line .dfb{color:var(--t2)}

/* ---- STATUS ---- */
#status{background:var(--hdr);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;font:400 10px/1 var(--mono);color:var(--t4)}
.st-demo{color:var(--amber)}
.st-ok{color:var(--green)}
.st-keys{letter-spacing:.02em}

/* ---- HELP OVERLAY ---- */
.help-overlay{position:fixed;inset:0;z-index:100;background:rgba(4,5,8,0.85);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity 200ms}
.help-overlay.visible{opacity:1;pointer-events:auto}
.help-box{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:28px 32px;max-width:380px;width:90%}
.help-box h3{font:600 16px/1.3 var(--sans);color:var(--t1);margin-bottom:16px}
.help-row{display:flex;justify-content:space-between;padding:6px 0;font-size:12px;border-bottom:1px solid var(--border-dim)}
.help-row:last-child{border:none}
.help-key{color:var(--t1);font-weight:500}
.help-desc{color:var(--t3)}

/* ---- SCROLLBAR ---- */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}

@media(max-width:900px){
  #main{grid-template-columns:1fr;grid-template-rows:180px 1fr 180px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}