/* =============================================
   KOL vs 散户 情绪博弈 - Clean Styles
   ============================================= */

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#f0f2f5;--card:#fff;--text:#1a1a2e;--sub:#8896a4;
  --primary:#6366f1;--primary-bg:#eef2ff;
  --up:#e74040;--up-bg:#fef2f2;
  --down:#22a065;--down-bg:#ecfdf5;
  --border:#e8ecf1;--radius:14px;
  --warn:#f59e0b;--warn-bg:#fef3c7;
  --hot:#ef4444;--cold:#3b82f6;
  --shadow:0 1px 4px rgba(0,0,0,.04);
}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro","PingFang SC","Helvetica Neue",sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;max-width:560px;margin:0 auto;min-height:100vh;padding-bottom:80px}

/* ===== Page Header (slim) ===== */
.page-header{background:linear-gradient(135deg,#1e1b4b,#312e81,#4338ca);color:#fff;padding:10px 14px;position:sticky;top:0;z-index:100}
.ph-row{display:flex;align-items:center;gap:8px}
.ph-back{font-size:12px;opacity:.7;text-decoration:none;color:inherit;flex-shrink:0}
.ph-back:hover{opacity:1}
.ph-title{font-size:15px;font-weight:800;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-status{font-size:11px;opacity:.8;display:flex;align-items:center;gap:4px;flex-shrink:0}
.ph-dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.ph-dot.live{background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.6);animation:pulse 2s infinite}
.ph-dot.off{background:#64748b}
.ph-time{font-size:10px;opacity:.5;margin-top:2px}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}

/* ===== Loading Overlay ===== */
.loading-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#1e1b4b,#312e81);z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;transition:opacity .5s}
.loading-overlay.hide{opacity:0;pointer-events:none}
.loading-icon{font-size:48px;margin-bottom:12px;animation:bounce 1.4s infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.loading-title{font-size:16px;font-weight:700;margin-bottom:6px}
.loading-sub{font-size:11px;opacity:.6;margin-bottom:16px;text-align:center;max-width:280px;line-height:1.5}
.loading-bar{width:220px;height:4px;background:rgba(255,255,255,.15);border-radius:3px;overflow:hidden}
.loading-fill{height:100%;background:linear-gradient(90deg,#818cf8,#c084fc);border-radius:3px;transition:width .3s}
.loading-status{font-size:10px;opacity:.5;margin-top:8px}
.loading-sources{display:flex;flex-wrap:wrap;gap:5px;margin-top:14px;max-width:280px;justify-content:center}
.loading-src{font-size:10px;padding:3px 8px;border-radius:6px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.7)}
.loading-src.done{background:rgba(34,197,94,.2);color:#86efac}
.loading-src.active{background:rgba(251,191,36,.2);color:#fde68a;animation:srcPulse 1s infinite}
@keyframes srcPulse{0%,100%{opacity:1}50%{opacity:.5}}

/* ===== Summary Card ===== */
.summary-card{margin:10px 12px 0;background:var(--card);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.summary-signal{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.signal-icon{font-size:28px;flex-shrink:0}
.signal-text{font-size:15px;font-weight:800;color:var(--text);line-height:1.3}
.summary-meta{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.meta-temp{font-size:11px;font-weight:700;padding:3px 10px;border-radius:8px;background:#f1f5f9;color:#64748b;flex-shrink:0}
.meta-temp.hot{background:#fef3c7;color:#d97706}
.meta-temp.warm{background:#fef9c3;color:#a16207}
.meta-temp.neutral{background:#f1f5f9;color:#64748b}
.meta-temp.cold{background:#eff6ff;color:#2563eb}
.meta-temp.overheated{background:#fef2f2;color:#dc2626}
.meta-radar{font-size:11px;color:#374151;line-height:1.5;flex:1;min-width:0}
.summary-assets{display:flex;flex-wrap:wrap;gap:5px}
.asset-pill{font-size:10px;padding:3px 8px;border-radius:12px;font-weight:600;background:#fef2f2;color:#dc2626;border:1px solid #fecaca}

/* ===== Source Pills ===== */
.src-bar{margin:8px 12px 0;background:var(--card);border-radius:10px;padding:8px 12px;box-shadow:var(--shadow);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.src-pills{display:flex;flex-wrap:wrap;gap:4px;flex:1}
.src-pill{font-size:10px;color:var(--sub);padding:2px 7px;border-radius:6px;background:var(--bg);white-space:nowrap}
.src-pill b{font-weight:800;color:var(--text);margin-left:2px}
.src-total{font-size:10px;font-weight:700;color:var(--primary);flex-shrink:0}

/* ===== Action Bar ===== */
.action-bar{display:flex;gap:6px;margin:8px 12px 0}
.btn-action{flex:1;padding:9px;border:none;border-radius:10px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px}
.btn-action:active{transform:scale(.97)}
.btn-action.primary{background:linear-gradient(135deg,#4338ca,#6366f1);color:white;box-shadow:0 2px 8px rgba(99,102,241,.3)}
.btn-action.primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn-action.secondary{background:var(--bg);color:var(--text);border:1px solid var(--border)}
.btn-action .spinner-sm{width:14px;height:14px;border:2px solid rgba(255,255,255,.2);border-top-color:white;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.progress-text{font-size:10px;color:var(--sub);text-align:center;padding:4px 12px;min-height:16px}

/* ===== Section ===== */
.section{margin:8px 12px;background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.sec-header{padding:12px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.sec-header:active{background:var(--bg)}
.sec-icon{font-size:16px}
.sec-title{font-size:13px;font-weight:700;flex:1}
.sec-badge{font-size:9px;background:var(--primary-bg);color:var(--primary);padding:2px 7px;border-radius:6px;font-weight:600}
.sec-toggle{font-size:12px;color:var(--sub);flex-shrink:0;width:16px;text-align:center}
.sec-body{padding:12px 14px}
.sec-body.collapsed{display:none}
.placeholder{font-size:11px;color:var(--sub)}

/* ===== US Market Grid ===== */
.us-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.us-card{background:var(--bg);border-radius:8px;padding:8px 10px;text-align:center;border:1px solid var(--border)}
.us-card.up{border-color:#fecaca;background:linear-gradient(135deg,#fef2f2,#fff)}
.us-card.down{border-color:#bbf7d0;background:linear-gradient(135deg,#ecfdf5,#fff)}
.us-card .us-name{font-size:10px;font-weight:700;color:var(--text);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.us-card .us-sym{font-size:8px;color:var(--sub);margin-bottom:4px}
.us-card .us-price{font-size:13px;font-weight:800;margin-bottom:2px}
.us-card .us-change{font-size:11px;font-weight:700;border-radius:4px;padding:1px 5px;display:inline-block}
.us-card.up .us-price{color:var(--up)}
.us-card.up .us-change{background:var(--up-bg);color:var(--up)}
.us-card.down .us-price{color:var(--down)}
.us-card.down .us-change{background:var(--down-bg);color:var(--down)}
.us-card .us-amp{font-size:8px;color:var(--sub);margin-top:3px}

/* ===== Hotspot Cards ===== */
.hotspot-card{background:var(--bg);border-radius:10px;padding:12px;margin-bottom:8px;border-left:4px solid var(--primary)}
.hotspot-card:last-child{margin-bottom:0}
.hotspot-card.fomo{border-left-color:#ef4444}
.hotspot-card.panic{border-left-color:#22c55e}
.hotspot-card.neutral{border-left-color:#94a3b8}
.hs-title{font-size:13px;font-weight:700;margin-bottom:6px}
.hs-row{display:flex;align-items:flex-start;gap:5px;margin-bottom:6px;font-size:11px;line-height:1.7}
.hs-icon{flex-shrink:0;width:18px;text-align:center;margin-top:2px}
.hs-label{font-weight:600;color:var(--sub);min-width:60px;flex-shrink:0;margin-top:2px}
.hs-text{color:#374151;flex:1}
.hs-text .hs-para{margin:0}
.hs-text .hs-list{margin:0;padding-left:16px;list-style:disc}
.hs-text .hs-list li{margin-bottom:4px}
.hs-text .hs-list li:last-child{margin-bottom:0}
.hs-text .hs-cite{color:#4338ca;font-weight:600}
.hs-text .hs-stat{color:#0d9488;font-weight:600;font-size:10px}
.hs-conclusion .hs-text{font-weight:700;color:#1e1b4b}

/* ===== Action Cards ===== */
.action-card{border-radius:10px;padding:12px;margin-bottom:8px}
.action-card:last-child{margin-bottom:0}
.action-card.bullish{background:linear-gradient(135deg,#fef2f2,#fff);border:1px solid #fecaca}
.action-card.bearish{background:linear-gradient(135deg,#ecfdf5,#fff);border:1px solid #bbf7d0}
.action-card.tactical{background:linear-gradient(135deg,#eff6ff,#fff);border:1px solid #bfdbfe}
.ac-title{font-size:12px;font-weight:700;margin-bottom:4px}
.ac-body{font-size:11px;color:#374151;line-height:1.7}

/* Holdings action grid */
.holding-actions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:10px}
.holding-action-card{border-radius:10px;padding:10px 12px;border:1px solid #e5e7eb;background:linear-gradient(135deg,#f9fafb,#fff)}
.holding-action-card.bullish{border-color:#fecaca;background:linear-gradient(135deg,#fef2f2,#fff)}
.holding-action-card.bearish{border-color:#bbf7d0;background:linear-gradient(135deg,#ecfdf5,#fff)}
.holding-action-card.neutral{border-color:#e5e7eb;background:linear-gradient(135deg,#f9fafb,#fff)}
.ha-label{font-size:11px;font-weight:700;margin-bottom:3px;color:#1e1b4b}
.ha-advice{font-size:10px;color:#374151;line-height:1.6}

/* ===== Heatbar ===== */
.heatbar{display:flex;flex-direction:column;gap:4px}
.heatbar-row{display:flex;align-items:center;gap:6px}
.heatbar-label{width:60px;font-size:10px;font-weight:600;text-align:right;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.heatbar-track{flex:1;height:16px;background:var(--bg);border-radius:4px;overflow:hidden}
.heatbar-fill{height:100%;border-radius:4px;display:flex;align-items:center;padding-left:5px;transition:width .6s ease}
.heatbar-fill span{font-size:8px;color:#fff;font-weight:600;white-space:nowrap}
.heatbar-val{width:28px;font-size:9px;font-weight:600;text-align:right;flex-shrink:0}

/* ===== Video Table ===== */
.video-table{width:100%;border-collapse:collapse;font-size:11px}
.video-table th{background:var(--bg);padding:7px 5px;font-weight:600;color:var(--sub);text-align:left;font-size:9px;text-transform:uppercase;letter-spacing:.5px}
.video-table td{padding:7px 5px;border-top:1px solid var(--border);vertical-align:top}
.video-table tr:hover{background:var(--bg)}
.vt-title{font-weight:600;color:var(--text);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-likes{font-variant-numeric:tabular-nums;color:var(--hot);font-weight:600}
.vt-sentiment{font-size:9px;padding:2px 5px;border-radius:4px;font-weight:600;white-space:nowrap}
.vt-sentiment.pos{background:var(--up-bg);color:var(--up)}
.vt-sentiment.neg{background:var(--down-bg);color:var(--down)}
.vt-sentiment.neu{background:#f1f5f9;color:var(--sub)}
.vt-noise{text-decoration:line-through;opacity:.5}
.vt-noise-tag{font-size:8px;background:#fef2f2;color:#dc2626;padding:1px 3px;border-radius:3px;margin-left:3px}

/* ===== Markdown Render ===== */
.md-render{font-size:12px;color:#1e293b;line-height:1.8}
.md-render h3{font-size:13px;font-weight:700;margin:14px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--border)}
.md-render h3:first-child{margin-top:0}
.md-render ul{padding-left:14px;margin:4px 0}
.md-render li{margin-bottom:3px}
.md-render strong{color:#1e1b4b}
.md-render code{background:var(--bg);padding:1px 4px;border-radius:3px;font-size:10px;font-family:'SF Mono','Menlo',monospace}
.md-render pre{background:#1e293b;color:#e2e8f0;padding:10px;border-radius:8px;overflow-x:auto;margin:8px 0}
.md-render pre code{background:none;padding:0;color:inherit}

/* ===== FAB ===== */
.fab{position:fixed;bottom:20px;right:20px;z-index:200;width:42px;height:42px;border-radius:50%;border:none;background:linear-gradient(135deg,#4338ca,#6366f1);color:white;font-size:17px;cursor:pointer;box-shadow:0 4px 12px rgba(99,102,241,.4);display:flex;align-items:center;justify-content:center}

/* ===== Settings Modal ===== */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:400;align-items:center;justify-content:center}
.modal-overlay.show{display:flex}
.modal{background:var(--card);border-radius:18px;margin:16px;padding:20px;max-width:360px;width:100%;max-height:80vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.15)}
.modal h3{font-size:15px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center}
.modal h3 button{background:none;border:none;font-size:16px;cursor:pointer;color:var(--sub);width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}
.modal h3 button:hover{background:var(--bg)}
.form-row{margin-bottom:12px}
.form-row label{display:block;font-size:10px;font-weight:600;color:var(--sub);margin-bottom:4px;letter-spacing:.3px}
.form-row input,.form-row select{width:100%;padding:9px 11px;border:1px solid var(--border);border-radius:8px;font-size:12px;outline:none;background:var(--bg)}
.form-row input:focus,.form-row select:focus{border-color:var(--primary);background:#fff}
.form-btn{width:100%;padding:10px;border:none;border-radius:10px;background:linear-gradient(135deg,#4338ca,#6366f1);color:white;font-size:13px;font-weight:600;cursor:pointer}

/* ===== Footer ===== */
.page-footer{text-align:center;padding:16px 12px 32px;font-size:9px;color:var(--sub);line-height:1.6}
.page-footer a{color:var(--primary);text-decoration:none}

/* ===== Animate ===== */
.fade-in{animation:fadeIn .4s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}