/* ============================================================
   IDEA RADAR — HUD / cyber telemetry theme
   Pure CSS, no external fonts, no CDN.
   ============================================================ */
:root{
  --bg:#04080f;
  --bg2:#07101c;
  --panel:rgba(9,20,33,.74);
  --panel-solid:#0a1725;
  --line:rgba(34,230,255,.16);
  --line-soft:rgba(120,180,215,.09);
  --cyan:#22e6ff;
  --cyan-dim:#0e8ba6;
  --purple:#a57bff;
  --amber:#ffb547;
  --green:#3ef2a8;
  --red:#ff5f7a;
  --text:#d5e9f5;
  --muted:#718fa6;
  --muted2:#4c6a80;
  --mono:"JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono","Courier New",monospace;
  --sans:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC","Segoe UI",sans-serif;
  --topbar-h:78px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--sans);font-size:14px;line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
::selection{background:rgba(34,230,255,.28);color:#fff}
a{color:var(--cyan);text-decoration:none}
button,input,select{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}

/* ---------- scrollbar ---------- */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:#050b13}
::-webkit-scrollbar-thumb{background:rgba(34,230,255,.22);border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:rgba(34,230,255,.45)}

/* ============================================================ 背景 */
.bg-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#starfield{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.bg-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(34,230,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,230,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 25%,#000 20%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 25%,#000 20%,transparent 100%);
  animation:gridDrift 40s linear infinite;
}
@keyframes gridDrift{to{background-position:56px 56px,56px 56px}}
.bg-glow{position:absolute;border-radius:50%;filter:blur(110px);opacity:.30}
.bg-glow-a{width:660px;height:660px;top:-300px;left:-140px;background:#0b6f9e;animation:floatA 18s ease-in-out infinite}
.bg-glow-b{width:560px;height:560px;top:18%;right:-240px;background:#5a35a8;opacity:.22;animation:floatB 22s ease-in-out infinite}
@keyframes floatA{50%{transform:translate(70px,50px)}}
@keyframes floatB{50%{transform:translate(-60px,70px)}}
.scanline{
  position:absolute;left:0;right:0;height:180px;top:-200px;
  background:linear-gradient(180deg,transparent,rgba(34,230,255,.035) 60%,rgba(34,230,255,.09) 95%,transparent);
  animation:scan 9s linear infinite;
}
@keyframes scan{to{transform:translateY(calc(100vh + 400px))}}
.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,transparent 40%,rgba(2,5,10,.75) 100%)}

/* ============================================================ 顶栏 */
.topbar{
  position:sticky;top:0;z-index:30;height:var(--topbar-h);
  display:flex;align-items:center;gap:28px;padding:0 28px;
  background:linear-gradient(180deg,rgba(5,12,21,.96),rgba(5,12,21,.80));
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.45}
.brand{display:flex;align-items:center;gap:13px;min-width:340px}
.brand-mark{position:relative;filter:drop-shadow(0 0 9px rgba(34,230,255,.5));animation:spin 14s linear infinite}
.brand-mark svg{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.brand-text h1{margin:0;font:700 21px/1.1 var(--mono);letter-spacing:2.5px;color:#eafcff}
.brand-text h1 span{color:var(--cyan);text-shadow:0 0 16px rgba(34,230,255,.65)}
.brand-text h1 i{font-style:normal;color:var(--cyan);animation:blink 1.1s step-end infinite}
@keyframes blink{50%{opacity:0}}
.brand-text p{margin:4px 0 0;font-size:11px;color:var(--muted);letter-spacing:.6px}
.topbar-center{flex:1;text-align:center;border-left:1px solid var(--line-soft);border-right:1px solid var(--line-soft)}
.sys-line{display:flex;align-items:center;justify-content:center;gap:9px;font:600 11px var(--mono);letter-spacing:2.4px;color:var(--green)}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2s ease-in-out infinite;display:inline-block}
.pulse-dot.small{width:5px;height:5px}
@keyframes pulse{50%{opacity:.35;box-shadow:0 0 2px var(--green)}}
.sys-sub{margin-top:5px;font:10px var(--mono);letter-spacing:1.1px;color:var(--muted2)}
.sys-sub .sep{color:var(--cyan-dim);margin:0 6px}
.topbar-right{display:flex;align-items:center;gap:22px;min-width:230px;justify-content:flex-end}
.clock-block{text-align:right}
.clock{font:600 24px/1 var(--mono);letter-spacing:1px;color:#eafcff;text-shadow:0 0 14px rgba(34,230,255,.35)}
.clock-sub{margin-top:5px;font:10px var(--mono);color:var(--muted);letter-spacing:1.5px}
.sync-block{padding-left:20px;border-left:1px solid var(--line-soft)}
.sync-label{font:9px var(--mono);letter-spacing:1.8px;color:var(--muted2)}
.sync-value{margin-top:5px;font:11px var(--mono);color:var(--cyan);letter-spacing:.5px;white-space:nowrap}
.corner{position:fixed;width:14px;height:14px;z-index:31;border-color:var(--cyan);opacity:.6;pointer-events:none}
.corner-tl{top:var(--topbar-h);left:8px;border-left:2px solid;border-top:2px solid}

/* ============================================================ 布局 */
.layout{position:relative;z-index:2;display:grid;grid-template-columns:270px minmax(0,1fr);gap:22px;
  max-width:1720px;margin:0 auto;padding:24px 28px 40px;align-items:start}
.sidebar{position:sticky;top:calc(var(--topbar-h) + 24px);display:flex;flex-direction:column;gap:16px}
.content{min-width:0}

/* ---------- panel ---------- */
.panel{
  position:relative;background:var(--panel);border:1px solid var(--line);
  border-radius:3px;padding:15px 16px 16px;backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 30px rgba(0,0,0,.28);
}
.panel::before,.panel::after{content:"";position:absolute;width:9px;height:9px;pointer-events:none}
.panel::before{top:-1px;left:-1px;border-left:2px solid var(--cyan);border-top:2px solid var(--cyan)}
.panel::after{bottom:-1px;right:-1px;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan);opacity:.55}
.panel-head{display:flex;align-items:center;gap:9px;font:600 11px var(--mono);letter-spacing:1.8px;
  color:var(--cyan);text-transform:uppercase;padding-bottom:11px;margin-bottom:11px;border-bottom:1px solid var(--line-soft)}
.ph-icon{font-size:13px;opacity:.8}
.ph-tag{margin-left:auto;font:9px var(--mono);letter-spacing:1px;color:var(--muted);
  border:1px solid var(--line);padding:2px 7px;border-radius:2px}

/* ---------- 状态 ---------- */
.status-rows{display:flex;flex-direction:column;gap:1px}
.srow{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:11.5px;color:var(--muted)}
.srow b{font:600 10.5px var(--mono);letter-spacing:.6px;color:var(--text)}
.srow b.ok{color:var(--green)}
.signal-bars{display:flex;align-items:flex-end;gap:3px;height:24px;margin-top:13px;padding-top:10px;border-top:1px solid var(--line-soft)}
.signal-bars i{flex:1;background:linear-gradient(180deg,var(--cyan),rgba(34,230,255,.12));opacity:.55;
  animation:barPulse 1.8s ease-in-out infinite;border-radius:1px 1px 0 0}
.signal-bars i:nth-child(3n){animation-delay:.3s}
.signal-bars i:nth-child(3n+1){animation-delay:.6s}
.signal-bars i:nth-child(4n){animation-delay:.9s}
.signal-bars i:nth-child(1){height:35%}.signal-bars i:nth-child(2){height:60%}.signal-bars i:nth-child(3){height:42%}
.signal-bars i:nth-child(4){height:85%}.signal-bars i:nth-child(5){height:55%}.signal-bars i:nth-child(6){height:70%}
.signal-bars i:nth-child(7){height:40%}.signal-bars i:nth-child(8){height:95%}.signal-bars i:nth-child(9){height:62%}
.signal-bars i:nth-child(10){height:48%}.signal-bars i:nth-child(11){height:78%}.signal-bars i:nth-child(12){height:52%}
.signal-bars i:nth-child(13){height:88%}.signal-bars i:nth-child(14){height:45%}.signal-bars i:nth-child(15){height:66%}
.signal-bars i:nth-child(16){height:38%}.signal-bars i:nth-child(17){height:72%}.signal-bars i:nth-child(18){height:58%}
.signal-bars i:nth-child(19){height:92%}.signal-bars i:nth-child(20){height:50%}.signal-bars i:nth-child(21){height:68%}
@keyframes barPulse{50%{opacity:.18;transform:scaleY(.7);transform-origin:bottom}}

/* ---------- 时间轴 ---------- */
.timeline{max-height:330px;overflow-y:auto;padding-right:4px}
.tl-item{position:relative;display:flex;gap:10px;align-items:flex-start;padding:7px 8px 7px 0;
  border-left:1px solid var(--line);margin-left:6px;cursor:pointer;transition:.18s}
.tl-item:hover{background:rgba(34,230,255,.055)}
.tl-item.active{background:rgba(34,230,255,.09);border-left-color:var(--cyan)}
.tl-item::before{content:"";position:absolute;left:-4px;top:14px;width:7px;height:7px;border-radius:50%;
  background:#0a1a28;border:1px solid var(--cyan-dim);transition:.18s}
.tl-item.active::before,.tl-item:hover::before{background:var(--cyan);box-shadow:0 0 9px var(--cyan)}
.tl-item:last-child{border-left-color:transparent}
.tl-body{padding-left:12px;flex:1;min-width:0}
.tl-top{display:flex;justify-content:space-between;gap:8px;font:10.5px var(--mono);color:var(--text)}
.tl-top b{color:var(--cyan);font-weight:600}
.tl-date{font:9.5px var(--mono);color:var(--muted2);margin-top:2px}
.tl-bar{height:2px;margin-top:6px;background:rgba(34,230,255,.1);border-radius:2px;overflow:hidden}
.tl-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan-dim),var(--cyan));box-shadow:0 0 8px var(--cyan)}

/* ---------- 图例 ---------- */
.legend-scale{display:flex;align-items:center;gap:9px;font:9px var(--mono);color:var(--muted2)}
.legend-bar{flex:1;height:6px;border-radius:3px;background:linear-gradient(90deg,#0d5f7d,var(--cyan) 45%,var(--purple) 78%,var(--amber));box-shadow:0 0 12px rgba(34,230,255,.28)}
.legend-note{margin-top:11px;font-size:11px;line-height:1.7;color:var(--muted)}
.source-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.source-chips span{font:9px var(--mono);letter-spacing:.5px;color:var(--muted);border:1px solid var(--line-soft);
  background:rgba(34,230,255,.035);padding:3px 6px;border-radius:2px}

/* ============================================================ 区块标题 */
.section-title{display:flex;align-items:center;gap:12px;margin:6px 0 14px}
.section-title:not(:first-child){margin-top:30px}
.st-index{font:700 10px var(--mono);color:var(--cyan);border:1px solid var(--line);padding:3px 6px;letter-spacing:1px}
.section-title h2{margin:0;font-size:14px;font-weight:600;letter-spacing:2px;color:#e6f6ff;white-space:nowrap}
.st-line{flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
.st-meta{font:10px var(--mono);color:var(--muted2);letter-spacing:.8px;white-space:nowrap}

/* ============================================================ 统计卡 */
.stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.stat{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);padding:14px 15px 12px;
  border-radius:3px;backdrop-filter:blur(10px);transition:.22s}
.stat:hover{border-color:rgba(34,230,255,.45);transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.35)}
.stat::after{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,var(--c,var(--cyan)),transparent);opacity:.8}
.stat-label{font:9.5px var(--mono);letter-spacing:1.6px;color:var(--muted);text-transform:uppercase}
.stat-value{font:700 30px/1.2 var(--mono);letter-spacing:-1px;color:var(--c,var(--cyan));margin-top:6px;
  text-shadow:0 0 22px color-mix(in srgb,var(--c,var(--cyan)) 45%,transparent)}
.stat-unit{font-size:12px;color:var(--muted);margin-left:4px;letter-spacing:0}
.stat-foot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:7px;font:9.5px var(--mono);color:var(--muted2)}
.stat-spark{height:22px;width:78px;opacity:.85}

/* ============================================================ 图表 */
.chart-panel{padding:14px 18px 10px}
.chart-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
  font:10px var(--mono);color:var(--muted)}
.chart-key{display:flex;align-items:center;gap:7px}
.chart-key i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-left:9px}
.chart-key i:first-child{margin-left:0}
.k-cyan{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.k-purple{background:var(--purple)}
.k-amber{background:var(--amber)}
.chart-hint{color:var(--muted2);letter-spacing:1px}
.chart{position:relative;width:100%;height:170px;margin-top:6px}
.chart svg{width:100%;height:100%;overflow:visible}
.chart .grid-line{stroke:rgba(120,180,215,.10);stroke-width:1;stroke-dasharray:3 5}
.chart .axis-text{fill:var(--muted2);font:9px var(--mono)}
.chart .area{fill:url(#areaGrad)}
.chart .line{fill:none;stroke:var(--cyan);stroke-width:2;filter:drop-shadow(0 0 5px rgba(34,230,255,.7))}
.chart .line-avg{fill:none;stroke:var(--purple);stroke-width:1.4;stroke-dasharray:4 4;opacity:.75}
.chart .dot{fill:#06121e;stroke:var(--cyan);stroke-width:2;cursor:pointer;transition:.15s}
.chart .dot:hover{fill:var(--cyan);r:6}
.chart .bump-bar{fill:var(--amber);opacity:.35}
.chart-tip{position:absolute;pointer-events:none;background:rgba(6,16,27,.96);border:1px solid var(--cyan);
  padding:7px 10px;font:10px/1.7 var(--mono);color:var(--text);white-space:nowrap;border-radius:2px;
  box-shadow:0 6px 20px rgba(0,0,0,.6);opacity:0;transition:opacity .15s;z-index:5}
.chart-tip b{color:var(--cyan)}

/* ============================================================ 工具栏 */
.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.search-wrap{position:relative;flex:1;min-width:230px;display:flex;align-items:center}
.search-icon{position:absolute;left:12px;font-size:19px;color:var(--cyan-dim);line-height:1}
#search{width:100%;height:38px;padding:0 38px 0 34px;background:rgba(6,16,27,.8);
  border:1px solid var(--line);border-radius:2px;outline:none;font-size:12.5px;transition:.2s}
#search:focus{border-color:rgba(34,230,255,.6);box-shadow:0 0 0 3px rgba(34,230,255,.07)}
#search::placeholder{color:var(--muted2)}
.search-wrap kbd{position:absolute;right:11px;font:10px var(--mono);color:var(--muted2);
  border:1px solid var(--line);padding:1px 5px;border-radius:2px}
.toolbar select{height:38px;background:rgba(6,16,27,.8);border:1px solid var(--line);border-radius:2px;
  padding:0 28px 0 11px;font:11px var(--mono);outline:none;color:var(--text);cursor:pointer}
.toolbar select:focus{border-color:rgba(34,230,255,.6)}
.heat-filter{display:flex;height:38px;border:1px solid var(--line);border-radius:2px;overflow:hidden}
.heat-filter button{background:rgba(6,16,27,.8);border:0;border-right:1px solid var(--line);
  padding:0 12px;font:10.5px var(--mono);color:var(--muted);transition:.18s}
.heat-filter button:last-child{border-right:0}
.heat-filter button:hover{color:var(--text);background:rgba(34,230,255,.08)}
.heat-filter button.active{color:#04121a;background:var(--cyan);font-weight:700;box-shadow:0 0 14px rgba(34,230,255,.4)}
.icon-btn{height:38px;width:38px;background:rgba(6,16,27,.8);border:1px solid var(--line);
  border-radius:2px;color:var(--cyan);font-size:15px;transition:.18s}
.icon-btn:hover{background:rgba(34,230,255,.12)}

/* ============================================================ 创意卡片 */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:13px}
.cards.list-view{grid-template-columns:1fr}
.card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(155deg,rgba(10,22,36,.92),rgba(6,14,24,.86));
  border:1px solid var(--line);border-radius:3px;padding:15px 16px 13px;
  animation:cardIn .45s cubic-bezier(.2,.8,.2,1) both;
  transition:transform .22s,border-color .22s,box-shadow .22s;
}
@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.card:hover{transform:translateY(-3px);border-color:rgba(34,230,255,.5);
  box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 0 1px rgba(34,230,255,.08) inset}
.card::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;
  background:linear-gradient(180deg,var(--heat-color,var(--cyan)),transparent);opacity:.75}
.card::after{content:"";position:absolute;right:-40px;top:-40px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle,rgba(34,230,255,.09),transparent 70%);pointer-events:none}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-id{font:10px var(--mono);letter-spacing:1.4px;color:var(--cyan-dim)}
.card-id b{color:var(--cyan);font-weight:700}
.heat-badge{flex:none;text-align:right}
.heat-num{font:700 25px/1 var(--mono);color:var(--heat-color,var(--cyan));
  text-shadow:0 0 16px color-mix(in srgb,var(--heat-color,var(--cyan)) 45%,transparent)}
.heat-cap{font:8.5px var(--mono);letter-spacing:1.2px;color:var(--muted2);display:block;margin-top:3px}
.card h3{margin:11px 0 8px;font-size:15px;line-height:1.45;font-weight:600;color:#e9f7ff;letter-spacing:.2px}
.card-summary{font-size:11.8px;line-height:1.75;color:var(--muted);flex:1;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.heat-track{height:3px;background:rgba(120,180,215,.11);border-radius:3px;margin:13px 0 10px;overflow:hidden}
.heat-track i{display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,var(--cyan-dim),var(--heat-color,var(--cyan)));
  box-shadow:0 0 10px var(--heat-color,var(--cyan));transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.card-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:11px;min-height:19px}
.tag{font:9px var(--mono);letter-spacing:.5px;color:var(--muted);padding:2px 6px;
  border:1px solid var(--line-soft);background:rgba(34,230,255,.03);border-radius:2px}
.tag.hot{color:var(--amber);border-color:rgba(255,181,71,.3)}
.card-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding-top:10px;border-top:1px solid var(--line-soft)}
.card-date{font:9.5px var(--mono);color:var(--muted2);letter-spacing:.8px}
.card-actions{display:flex;gap:6px}
.mini-btn{background:transparent;border:1px solid var(--line);color:var(--muted);
  padding:4px 9px;border-radius:2px;font:10px var(--mono);transition:.18s}
.mini-btn:hover{color:var(--cyan);border-color:rgba(34,230,255,.55);background:rgba(34,230,255,.07)}
.mini-btn.primary{color:var(--cyan);border-color:rgba(34,230,255,.35)}
.card-detail{display:none;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);}
.card.open .card-detail{display:block;animation:cardIn .3s both}
.detail-row{display:flex;gap:9px;margin-bottom:9px;font-size:11.5px;line-height:1.7}
.detail-row .dk{flex:none;width:52px;font:10px var(--mono);color:var(--cyan);padding-top:2px;letter-spacing:.5px}
.detail-row .dv{color:var(--muted);flex:1}
.detail-row .dv strong{color:var(--text);font-weight:600}
.empty{text-align:center;padding:60px 20px;font:12px var(--mono);letter-spacing:1.5px;color:var(--muted2);
  border:1px dashed var(--line);background:rgba(6,14,24,.4)}

/* ---------- 列表视图 ---------- */
.cards.list-view .card{padding:12px 16px}
.cards.list-view .card h3{margin:6px 0;font-size:14px}
.cards.list-view .card-summary{-webkit-line-clamp:1}
.cards.list-view .heat-track{margin:8px 0}
.cards.list-view .card-tags{margin-bottom:6px}

/* ============================================================ 洞察 */
.insight-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:13px}
.insight-panel{padding:15px 17px}
.insight-panel h4{margin:0 0 11px;font-size:12px;font-weight:600;letter-spacing:1.2px;color:#dff4ff;
  display:flex;align-items:center;gap:8px}
.insight-panel h4 .num{font:9px var(--mono);color:var(--cyan);border:1px solid var(--line);padding:2px 5px}
.obs-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.obs-list li{position:relative;padding-left:17px;font-size:11.5px;line-height:1.7;color:var(--muted)}
.obs-list li::before{content:"▸";position:absolute;left:0;color:var(--cyan-dim)}
.obs-list li b{color:var(--text);font-weight:600}
.bump-list{display:flex;flex-direction:column;gap:0;max-height:230px;overflow-y:auto}
.bump-row{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--line-soft);font-size:11px}
.bump-row:last-child{border-bottom:0}
.bump-ref{font:9px var(--mono);color:var(--cyan-dim);width:42px;flex:none}
.bump-title{flex:1;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bump-change{font:700 10px var(--mono);color:var(--amber);white-space:nowrap}
.bump-arrow{font-size:9px;color:var(--green)}

/* ============================================================ 底栏 */
.statusbar{position:relative;z-index:3;display:flex;align-items:center;gap:22px;
  height:32px;padding:0 28px;border-top:1px solid var(--line);
  background:rgba(4,10,18,.92);font:9px var(--mono);letter-spacing:1.2px;color:var(--muted2)}
.sb-item{display:flex;align-items:center;gap:6px;white-space:nowrap}
.sb-item b{color:var(--cyan);font-weight:600}
.sb-marquee{flex:1;overflow:hidden;text-align:right;color:var(--muted2)}
.sb-marquee span{display:inline-block;white-space:nowrap;animation:marquee 26s linear infinite}
@keyframes marquee{from{transform:translateX(30%)}to{transform:translateX(-100%)}}

/* ============================================================ 抽屉 */
/* 作者样式的 display 会盖过 UA 的 [hidden]{display:none}，必须显式声明 */
.overlay[hidden],.drawer[hidden],#empty[hidden]{display:none!important}
.overlay{position:fixed;inset:0;z-index:50;background:rgba(1,5,10,.72);backdrop-filter:blur(3px);animation:fadeIn .2s both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(720px,92vw);z-index:51;
  display:flex;flex-direction:column;background:linear-gradient(160deg,#081522,#050c15);
  border-left:1px solid rgba(34,230,255,.45);box-shadow:-20px 0 60px rgba(0,0,0,.7);
  animation:slideIn .28s cubic-bezier(.2,.8,.2,1) both}
@keyframes slideIn{from{transform:translateX(100%)}to{transform:none}}
.drawer::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--purple),transparent)}
.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding:22px 26px 15px;border-bottom:1px solid var(--line)}
.drawer-kicker{font:9.5px var(--mono);letter-spacing:2px;color:var(--cyan)}
.drawer-head h3{margin:7px 0 0;font-size:17px;font-weight:600;color:#eaf9ff;line-height:1.4}
.drawer-close{background:transparent;border:1px solid var(--line);color:var(--muted);
  width:30px;height:30px;border-radius:2px;font-size:13px;flex:none;transition:.18s}
.drawer-close:hover{color:var(--red);border-color:rgba(255,95,122,.5)}
.drawer-tools{display:flex;align-items:center;gap:14px;padding:11px 26px;border-bottom:1px solid var(--line-soft);
  background:rgba(34,230,255,.025)}
.ghost-btn{font:10px var(--mono);color:var(--cyan);border:1px solid rgba(34,230,255,.35);
  padding:5px 11px;border-radius:2px;transition:.18s}
.ghost-btn:hover{background:rgba(34,230,255,.12)}
.drawer-meta{font:9.5px var(--mono);color:var(--muted2)}
.drawer-body{flex:1;overflow-y:auto;padding:22px 26px 50px}

/* ---------- 简易 markdown ---------- */
.markdown{font-size:12.5px;line-height:1.85;color:#bcd4e3}
.markdown h1{font-size:19px;color:#eafaff;margin:0 0 16px;padding-bottom:11px;border-bottom:1px solid var(--line);letter-spacing:.5px}
.markdown h2{font-size:15px;color:var(--cyan);margin:26px 0 11px;padding-left:10px;border-left:2px solid var(--cyan)}
.markdown h3{font-size:13.5px;color:#e2f4ff;margin:20px 0 9px}
.markdown h4{font-size:12.5px;color:var(--purple);margin:16px 0 7px}
.markdown p{margin:9px 0}
.markdown strong{color:#eafaff;font-weight:600}
.markdown em{color:var(--amber)}
.markdown a{color:var(--cyan);border-bottom:1px dotted rgba(34,230,255,.5)}
.markdown blockquote{margin:12px 0;padding:9px 14px;background:rgba(34,230,255,.045);
  border-left:2px solid var(--cyan-dim);color:var(--muted);font-size:11.5px}
.markdown ul,.markdown ol{margin:9px 0;padding-left:22px}
.markdown li{margin:5px 0}
.markdown hr{border:0;border-top:1px solid var(--line);margin:22px 0}
.markdown code{font:11px var(--mono);background:rgba(34,230,255,.08);color:var(--amber);padding:1px 5px;border-radius:2px}
.markdown table{width:100%;border-collapse:collapse;margin:13px 0;font-size:11px}
.markdown th{background:rgba(34,230,255,.08);color:var(--cyan);font-weight:600;text-align:left;
  padding:7px 9px;border:1px solid var(--line)}
.markdown td{padding:7px 9px;border:1px solid var(--line-soft);color:var(--muted);vertical-align:top}
.markdown tr:nth-child(even) td{background:rgba(255,255,255,.012)}

/* ============================================================ 启动屏 */
.boot{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  background:#04080f;transition:opacity .55s,visibility .55s}
.boot.done{opacity:0;visibility:hidden;pointer-events:none;display:none}
body.snapshot .boot{display:none}
body.snapshot *{animation-duration:.001s!important;transition-duration:.001s!important}
.boot-inner{text-align:center}
.boot-ring{width:74px;height:74px;margin:0 auto 24px;border:1px solid rgba(34,230,255,.2);
  border-top:2px solid var(--cyan);border-radius:50%;animation:spin 1.1s linear infinite;
  box-shadow:0 0 30px rgba(34,230,255,.18)}
.boot-text{font:12px var(--mono);letter-spacing:3px;color:var(--cyan)}
.boot-text .dots{animation:blink 1s step-end infinite}
.boot-sub{margin-top:10px;font:9.5px var(--mono);letter-spacing:1.5px;color:var(--muted2)}

/* ============================================================ 响应式 */
@media(max-width:1280px){
  .layout{grid-template-columns:230px minmax(0,1fr);padding:20px;gap:16px}
  .stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .topbar-center{display:none}
  .brand{min-width:0}
}
@media(max-width:900px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:static;flex-direction:row;flex-wrap:wrap}
  .sidebar .panel{flex:1;min-width:240px}
  .timeline{max-height:190px}
  .topbar-right .sync-block{display:none}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
}
@media(max-width:600px){
  :root{--topbar-h:66px}
  .topbar{padding:0 14px;gap:10px}
  .brand-text h1{font-size:16px}
  .brand-text p{display:none}
  .clock{font-size:17px}
  .clock-sub{display:none}
  .layout{padding:14px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .stat{padding:11px}
  .stat-value{font-size:23px}
  .cards{grid-template-columns:1fr}
  .statusbar{gap:12px;padding:0 14px}
  .sb-marquee{display:none}
  .drawer-body,.drawer-head,.drawer-tools{padding-left:16px;padding-right:16px}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.001s!important}
}
