.dashboard-layout {
  display:grid; grid-template-rows:56px 1fr;
  grid-template-columns:1fr 320px;
  grid-template-areas:"header header" "main sidebar";
  height:100dvh;
}
.header {
  grid-area:header; display:flex; align-items:center; gap:20px;
  padding:0 20px; background:var(--surface); border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:100;
}
.logo { font-size:15px; font-weight:700; color:var(--accent); letter-spacing:-0.5px; text-decoration:none; }
.price-display { display:flex; align-items:baseline; gap:8px; }
.price-current { font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; }
.price-change { font-size:13px; font-variant-numeric:tabular-nums; }
.price-change.positive { color:var(--bull); }
.price-change.negative { color:var(--bear); }
.mode-switcher { display:flex; gap:4px; background:var(--bg); padding:3px; border-radius:4px; border:1px solid var(--border); }
.mode-btn { padding:4px 12px; border-radius:3px; font-size:11px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--muted); transition:all 0.15s; }
.mode-btn.active { background:var(--accent); color:#000; }
.tf-selector { display:flex; gap:4px; }
.tf-btn { padding:4px 10px; border-radius:4px; font-size:11px; font-weight:600; color:var(--muted); border:1px solid var(--border); background:var(--surface); transition:all 0.15s; }
.tf-btn:hover { color:var(--text); }
.tf-btn.active { color:var(--accent); border-color:var(--accent); background:rgba(0,212,170,0.08); }
.session-badge { margin-left:auto; display:flex; align-items:center; gap:6px; font-size:11px; color:var(--muted); }
.session-dot { width:6px; height:6px; border-radius:50%; background:var(--accent); animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
.update-time { font-size:11px; color:var(--faint); white-space:nowrap; }
.main-area { grid-area:main; display:flex; flex-direction:column; padding:12px; gap:12px; overflow:hidden; }
#chart-container { flex:1; border-radius:var(--radius); overflow:hidden; border:1px solid var(--border); min-height:0; }
.sidebar { grid-area:sidebar; display:flex; flex-direction:column; gap:12px; padding:12px; overflow-y:auto; border-left:1px solid var(--border); }
.score-panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px; }
.score-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.score-label { font-size:11px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--muted); }
.score-number { font-size:36px; font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:-2px; line-height:1; }
.score-bar-bg { height:6px; background:var(--border); border-radius:3px; overflow:hidden; margin:10px 0; }
.score-bar-fill { height:100%; border-radius:3px; transition:width 0.6s cubic-bezier(0.16,1,0.3,1); }
.score-classification { font-size:13px; font-weight:700; margin:8px 0 4px; }
.score-narrative { font-size:12px; color:var(--muted); line-height:1.5; }
.atoms-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.atom-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:12px; transition:border-color 0.15s; }
.atom-card:hover { border-color:var(--faint); }
.atom-card.bull { border-left:3px solid var(--bull); }
.atom-card.bear { border-left:3px solid var(--bear); }
.atom-card.warn { border-left:3px solid var(--warning); }
.atom-card.neutral { border-left:3px solid var(--faint); }
.atom-name { font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted); margin-bottom:6px; }
.atom-score { font-size:18px; font-weight:800; font-variant-numeric:tabular-nums; }
.atom-max { font-size:10px; color:var(--faint); margin-left:2px; }
.atom-label { font-size:10px; font-weight:600; margin-top:4px; }
.session-panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:12px; }
.session-panel-title { font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted); margin-bottom:10px; }
.session-bar-wrap { position:relative; height:8px; background:var(--border); border-radius:4px; overflow:visible; margin-bottom:6px; }
.session-segment { position:absolute; height:100%; top:0; }
.session-now-line { position:absolute; top:-4px; width:2px; height:16px; background:var(--accent); border-radius:1px; z-index:2; }
.session-times { display:flex; justify-content:space-between; font-size:10px; color:var(--faint); }
.session-current-label { font-size:11px; font-weight:600; color:var(--accent); margin-top:8px; }
@media(max-width:900px){
  .dashboard-layout{grid-template-columns:1fr;grid-template-rows:56px auto auto;grid-template-areas:"header" "main" "sidebar";}
  .sidebar{border-left:none;border-top:1px solid var(--border);}
  #chart-container{min-height:350px;}
}
