@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Barlow+Condensed:wght@300;400;600;700;800&display=swap');
:root{
  --bg:#060809;--s1:#0c1015;--s2:#111820;--s3:#171f2a;
  --border:#1c2535;--border2:#263345;
  --text:#c8d6e8;--dim:#3d5068;--dim2:#5a7090;
  --bull:#05d490;--bear:#f03e5a;--gold:#f5c842;--blue:#4d9fff;
  --fh:'Barlow Condensed',sans-serif;--fm:'DM Mono',monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:var(--fm);font-size:12px;line-height:1.5}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;background:var(--s1);border-bottom:1px solid var(--border);gap:12px;flex-wrap:wrap;position:sticky;top:0;z-index:100}
.logo{font-family:var(--fh);font-size:22px;font-weight:800;letter-spacing:1px}
.logo em{color:var(--bull);font-style:normal}
.topbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ctrl{display:flex;align-items:center;gap:5px}
.ctrl label{font-size:10px;color:var(--dim2);letter-spacing:1px}
select{background:var(--s2);border:1px solid var(--border2);color:var(--text);font-family:var(--fm);font-size:11px;padding:4px 7px;outline:none}
select:focus{border-color:var(--blue)}
.btn{background:var(--bull);color:var(--bg);border:none;font-family:var(--fh);font-weight:700;font-size:13px;letter-spacing:1px;padding:5px 16px;cursor:pointer;transition:opacity .15s}
.btn:hover{opacity:.8}
.btn:disabled{opacity:.35;cursor:default}
.btn.btn-ghost{background:transparent;color:var(--dim2);border:1px solid var(--border2)}
.btn.btn-ghost:hover{color:var(--text);opacity:1;border-color:var(--blue)}
#status{font-size:10px;color:var(--dim2);letter-spacing:1px}
#status.err{color:var(--bear)}
#clock{font-size:10px;color:var(--dim);white-space:nowrap}
.prog-bar{height:2px;background:var(--border)}
.prog-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--bull),var(--blue));transition:width .3s}
.page{padding:18px 24px;max-width:1600px;margin:0 auto}
.row{display:grid;gap:12px;margin-bottom:12px}
.col-2{grid-template-columns:1fr 1fr}
.col-7{grid-template-columns:repeat(7,1fr)}
.card{background:var(--s1);border:1px solid var(--border);overflow:hidden}
.card-head{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:4px}
.card-title{font-family:var(--fh);font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.card-tag{font-size:9px;color:var(--dim2);letter-spacing:1px}
.slabel{font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:3px;color:var(--dim2);text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:9px;margin-top:16px}
.slabel::after{content:'';flex:1;height:1px;background:var(--border)}
.dow-card{background:var(--s1);border:1px solid var(--border);padding:12px 10px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;position:relative}
.dow-card:hover{border-color:var(--border2);background:var(--s2)}
.dow-card.selected{border-color:var(--gold);background:var(--s2)}
.today-pip{position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.dow-name{font-family:var(--fh);font-size:18px;font-weight:800;letter-spacing:1px;margin-bottom:4px}
.dow-avg{font-family:var(--fh);font-size:24px;font-weight:800;line-height:1;margin-bottom:3px}
.dow-meta{font-size:9px;color:var(--dim2);letter-spacing:1px}
.dow-winbar{margin-top:6px;height:3px;background:var(--border)}
.hist-item{display:flex;align-items:center;padding:7px 14px;border-bottom:1px solid var(--border);gap:10px}
.hist-item:last-child{border-bottom:none}
.hist-date{font-size:10px;color:var(--dim2);width:80px;flex-shrink:0}
.hist-bar-wrap{flex:1;height:16px;background:var(--s3);position:relative}
.hist-bar{height:100%;position:absolute}
.hist-mid{position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--border2)}
.hist-ret{font-family:var(--fh);font-size:14px;font-weight:700;width:58px;text-align:right;flex-shrink:0}
.hist-sub{font-size:9px;color:var(--dim2);width:110px;text-align:right;flex-shrink:0}
.sess-tabs{display:flex;border-bottom:1px solid var(--border);flex-wrap:wrap}
.sess-tab{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:1px;padding:9px 16px;cursor:pointer;border-bottom:2px solid transparent;transition:all .15s;color:var(--dim2);display:flex;align-items:center;gap:6px}
.sess-tab:hover{color:var(--text)}
.sess-tab.active{color:var(--text)}
.sdot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.live-pip{font-size:8px;letter-spacing:1px;animation:blink 1.5s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}
.sess-summary{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--border)}
.ss-cell{padding:9px 12px;border-right:1px solid var(--border)}
.ss-cell:last-child{border-right:none}
.ss-lbl{font-size:9px;color:var(--dim2);letter-spacing:1px;margin-bottom:3px}
.ss-val{font-family:var(--fh);font-size:17px;font-weight:700}
.ss-sub{font-size:9px;color:var(--dim2)}
.sess-band{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;padding:8px 14px 0}
.sess-band-cell{height:4px;border-radius:1px}
.hmap{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;padding:5px 14px 7px}
.hcell{aspect-ratio:.9;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:2px;cursor:default;border:1px solid transparent}
.hcell.now{border-color:var(--gold)}
.hv{font-size:7px;font-weight:500;line-height:1}
.hl{font-size:6px;color:rgba(200,214,232,.4);margin-top:1px}
.hmap-labels{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;padding:0 14px 10px}
.hmap-labels span{font-size:7px;color:var(--dim);text-align:center}
.hour-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border)}
.hs-cell{padding:9px 12px;border-right:1px solid var(--border)}
.hs-cell:last-child{border-right:none}
.hs-lbl{font-size:9px;color:var(--dim2);letter-spacing:1px;margin-bottom:4px}
.hs-val{font-family:var(--fh);font-size:17px;font-weight:700}
.hs-sub{font-size:9px;color:var(--dim2)}
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:9px;letter-spacing:1.5px;color:var(--dim2);text-transform:uppercase;text-align:right;padding:7px 10px;border-bottom:1px solid var(--border);font-weight:400}
.tbl th:first-child{text-align:left}
.tbl td{padding:7px 10px;border-bottom:1px solid var(--border);text-align:right;font-size:11px}
.tbl td:first-child{text-align:left;font-family:var(--fh);font-size:13px;font-weight:700}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:var(--s2)}
.tbl tr.row-active td{background:rgba(245,200,66,.05)}
.tbl tr.row-active td:first-child{color:var(--gold)}
.ft-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--border)}
.ft-panel{padding:12px 14px;border-right:1px solid var(--border)}
.ft-panel:last-child{border-right:none}
.ft-title{font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:1px;color:var(--dim2);margin-bottom:10px}
.ft-row{display:flex;align-items:center;gap:10px;margin-bottom:7px}
.ft-name{font-size:10px;color:var(--dim2);width:130px;flex-shrink:0}
.ft-bw{flex:1;height:14px;background:var(--s3);position:relative}
.ft-bar{height:100%;position:absolute}
.ft-mid{position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--border2)}
.ft-pct{font-family:var(--fh);font-size:13px;font-weight:700;width:44px;text-align:right;flex-shrink:0}
.ft-n{font-size:9px;color:var(--dim2);width:32px;text-align:right;flex-shrink:0}
.cal-grid{display:grid;grid-template-columns:repeat(31,1fr);gap:2px;padding:12px 14px}
.cal-cell{aspect-ratio:.8;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:2px;cursor:default;border:1px solid transparent}
.cal-cell.tod{border-color:var(--gold)}
.cv{font-size:7px;font-weight:500;line-height:1}
.cd{font-size:6px;color:rgba(200,214,232,.4);margin-top:1px}
.cal-labels{display:grid;grid-template-columns:repeat(31,1fr);gap:2px;padding:0 14px 10px}
.cal-labels span{font-size:7px;color:var(--dim);text-align:center}
.pred-wrap{background:var(--s1);border:1px solid var(--border2);overflow:hidden;margin-bottom:12px}
.pred-top{display:grid;grid-template-columns:1fr 1fr 1fr;border-bottom:1px solid var(--border)}
.pred-block{padding:22px 24px;border-right:1px solid var(--border)}
.pred-block:last-child{border-right:none}
.pred-lbl{font-size:9px;color:var(--dim2);letter-spacing:3px;font-family:var(--fh);font-weight:700;margin-bottom:8px}
.pred-num{font-family:var(--fh);font-size:64px;font-weight:800;line-height:1}
.pred-verdict{font-family:var(--fh);font-size:16px;font-weight:700;letter-spacing:2px;margin-top:6px}
.sig-list{padding:14px 18px}
.sig-hdr{font-size:9px;color:var(--dim2);letter-spacing:3px;font-family:var(--fh);font-weight:700;margin-bottom:10px}
.sig-row{display:grid;grid-template-columns:170px 1fr 70px 80px 30px;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border)}
.sig-row:last-child{border-bottom:none}
.sig-bw{height:6px;background:var(--border);position:relative;border-radius:2px;overflow:hidden}
.sig-bar{height:100%;position:absolute}
#tip{display:none;position:fixed;background:var(--s2);border:1px solid var(--border2);padding:9px 13px;font-size:10px;font-family:var(--fm);white-space:nowrap;z-index:9999;line-height:1.9;pointer-events:none;box-shadow:0 6px 24px rgba(0,0,0,.7)}
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:14px;color:var(--dim2)}
.empty-icon{font-size:52px;opacity:.2}
.empty-title{font-family:var(--fh);font-size:18px;font-weight:700}
.empty-sub{font-size:11px}
.retry-box{padding:24px;text-align:center;color:var(--dim2)}
.retry-box .btn{margin-top:10px}

.level-toggles{display:flex;gap:14px;flex-wrap:wrap;padding:9px 14px;border-bottom:1px solid var(--border);background:var(--s2)}
.level-toggles label{display:flex;align-items:center;gap:5px;cursor:pointer;font-size:10px;color:var(--dim2);letter-spacing:.5px}
.level-toggles input{accent-color:var(--bull);cursor:pointer}
.npoc-warning{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid rgba(245,200,66,.35);background:rgba(245,200,66,.08);font-size:10px;color:#f5c842;letter-spacing:.3px;line-height:1.5}

@media (max-width:640px){
  #price-chart{height:320px !important}
  .level-toggles{gap:10px 14px;padding:8px 10px}
  .level-toggles label{font-size:9px}
  .card-head .ctrl{margin-left:auto}
}

@media (max-width:900px){
  .page{padding:14px}
  .col-2{grid-template-columns:1fr}
  .col-7{grid-template-columns:repeat(4,1fr)}
  .sess-summary{grid-template-columns:repeat(2,1fr)}
  .ss-cell:nth-child(2n){border-right:none}
  .hour-strip{grid-template-columns:repeat(2,1fr)}
  .hs-cell:nth-child(2n){border-right:none}
  .ft-grid{grid-template-columns:1fr}
  .ft-panel{border-right:none;border-bottom:1px solid var(--border)}
  .pred-top{grid-template-columns:1fr}
  .pred-block{border-right:none;border-bottom:1px solid var(--border)}
  .sig-row{grid-template-columns:1fr;text-align:left;gap:4px}
  .hmap,.hmap-labels{grid-template-columns:repeat(12,1fr);row-gap:6px}
  .cal-grid,.cal-labels{grid-template-columns:repeat(10,1fr);row-gap:6px}
}
@media (max-width:520px){
  .col-7{grid-template-columns:repeat(2,1fr)}
  .topbar{padding:10px 14px}
  .logo{font-size:18px}
}