/* selfhost-fonts-20260816: real Figtree/Bricolage/Martian/JetBrains/Inter load from assets/css/fonts.css */
input,button,select,textarea{font-family:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
:root{
  --bg:#060608; --bg2:#0d0f15; --panel:#0a0b11; --panel2:#0f1119; --hdr:#060608;
  --border:#23262f; --border2:#2b2f3a; --row:#1b1e27;
  --txt:#ced2d8; --txt2:#a3aab4; --txt3:#8a919b; --white:#e9ebef;
  --green:#22c07c; --green2:#00FFB2; --red:#f2606c; --red2:#f6465d;
  --accent:#00FFB2; --accentdim:#0e332a; --blue:#4a90d9; --yellow:#e6b93d; --orange:#e07b39; --purple:#8b7ae0;
  --mono:'Figtree',system-ui,sans-serif;
  --font-sans:'Figtree',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-display:'Bricolage Grotesque','Figtree',sans-serif;
  --font-mono:'Martian Mono','SF Mono','Cascadia Code',monospace;
}

/* ── Buttons ──────────────────────────────────────────────────────────────
   The browser paints <button> with white UA button chrome: light background,
   grey border, centred text, its own font. On this dark terminal that is never
   what we want, and views use buttons as clickable rows and chips, so any view
   that forgets to reset one renders it as a white block with unreadable text.
   Neutralise it once here; component styles load afterwards and override
   whatever they actually need (background, border, padding, alignment). */
button {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  line-height: inherit;
}
button:not(:disabled) { cursor: pointer; }
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--txt);font-family:'Figtree',system-ui,sans-serif;font-size:12px;
     font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;overflow:hidden}
.num{font-variant-numeric:tabular-nums}
.pos{color:var(--green)} .neg{color:var(--red)}
.up::before{content:"\25B2";font-size:7px;margin-right:3px;color:var(--green)}
.dn::before{content:"\25BC";font-size:7px;margin-right:3px;color:var(--red)}

*{scrollbar-width:none;-ms-overflow-style:none}
::-webkit-scrollbar{width:0;height:0;display:none}
::-webkit-scrollbar-thumb,::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}

.app{display:grid;grid-template-rows:46px 35px minmax(0,1fr) 24px;height:100vh;height:100dvh;max-width:100vw;overflow:hidden}

.hdr{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,560px) minmax(0,1fr);align-items:center;gap:18px;
     padding:0 16px;background:var(--hdr);border-bottom:1px solid var(--border);height:46px}
.hdrleft{display:flex;align-items:center;gap:20px;min-width:0}
.hdrright{display:flex;align-items:center;gap:16px;justify-content:flex-end;min-width:0}
.brand{display:flex;align-items:center;gap:14px;min-width:200px}
.brand .blogo{font-size:25px;font-weight:800;color:#fff;line-height:1;letter-spacing:.02em}
.brand .bbar{width:2px;height:21px;background:#4fe6a6;border-radius:2px}
.brand .bword{font-size:17px;font-weight:600;letter-spacing:.34em;color:#fff}
.mktopen{display:flex;flex-direction:column;line-height:1.15}
.mktopen .s{color:var(--green);font-size:9px;letter-spacing:.14em;font-weight:700}
.mktopen .t{color:var(--txt);font-family:var(--mono);font-size:12px}
.mktopen .d{color:var(--txt3);font-size:9px}
.search{position:relative;width:100%}
.search input{width:100%;background:#0d0e15;border:1px solid var(--border2);border-radius:7px;color:var(--white);
              padding:8px 12px 8px 34px;font-size:12px;font-family:'Figtree',-apple-system,sans-serif}
.search input::placeholder{color:var(--txt2)}
.search .si{position:absolute;left:12px;top:9px;color:var(--txt3);font-size:12px}
.search .kbd{position:absolute;right:10px;top:7px;border:1px solid var(--border2);border-radius:4px;color:var(--txt3);font-size:10px;padding:1px 6px}
.hicons{display:flex;align-items:center;gap:16px;color:var(--txt2)}
.hicons i{font-size:14px;cursor:pointer}
.user{display:flex;align-items:center;gap:8px;cursor:pointer}
.ava{width:30px;height:30px;border-radius:6px;background:linear-gradient(135deg,#0b7a5c,#00FFB2);
     display:flex;align-items:center;justify-content:center;color:#04120c;font-weight:800;font-size:11px}
.user .un{line-height:1.1}
.user .un b{font-size:11px;color:var(--white);font-weight:600}
.user .un span{display:block;font-size:9px;color:var(--txt3)}

.tabbar{display:flex;align-items:flex-end;gap:2px;padding:0 8px;background:#07080c;border-bottom:1px solid var(--border);
        height:35px;overflow-x:auto;overflow-y:hidden;position:relative;z-index:3}
.tab{display:flex;align-items:center;gap:8px;height:29px;padding:0 9px 0 11px;border-radius:8px 8px 0 0;color:var(--txt2);
     font-size:11px;font-weight:500;cursor:default;position:relative;border:1px solid transparent;border-bottom:none;
     white-space:nowrap;flex:0 0 auto;user-select:none;max-width:210px;transition:background .12s,color .12s}
.tab .tl{overflow:hidden;text-overflow:ellipsis}
.tab .ti{font-size:11px;color:var(--txt3);flex:0 0 auto;transition:color .12s}
.tab .x{font-size:10px;color:var(--txt3);margin-left:2px;width:16px;height:16px;display:flex;align-items:center;
        justify-content:center;border-radius:4px;flex:0 0 auto;opacity:.5;transition:opacity .12s,background .12s,color .12s}
.tab:hover .x{opacity:.8}
.tab.on .x{opacity:.75;color:var(--txt2)}
.tab .x:hover{background:#242833;opacity:1;color:var(--white)}

.tab+.tab::before{content:"";position:absolute;left:-2px;top:9px;bottom:9px;width:1px;background:#191c24}
.tab.on::before,.tab.on+.tab::before,.tab:hover::before,.tab:hover+.tab::before{background:transparent}
.tab:hover{background:#0e1017;color:var(--txt)}

.tab.on{
  height:32px;margin-bottom:-1px;color:var(--white);font-weight:600;
  background:linear-gradient(180deg,#0f1a16 0%,#0b0f13 42%,var(--panel) 100%);
  border-color:var(--border);
  box-shadow:0 -14px 24px -16px rgba(0,255,178,.75), inset 0 1px 0 rgba(255,255,255,.03);
}
.tab.on::after{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:2px;border-radius:3px 3px 0 0;
  background:linear-gradient(90deg,#1c9c63,var(--accent) 30%,#5cf0b0 50%,var(--accent) 70%,#1c9c63);
  box-shadow:0 0 10px rgba(0,255,178,.6),0 0 22px rgba(0,255,178,.25)}
.tab.on .ti{color:var(--accent)}
.tab.drag{opacity:.4}
.newtab{width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:var(--txt3);
        border-radius:6px;cursor:pointer;flex:0 0 auto;margin:0 0 2px 4px}
.newtab:hover{background:#0e1017;color:var(--accent)}
.tabfill{flex:1;height:100%;min-width:12px}

.viewport{position:relative;min-height:0;overflow:hidden;background:var(--bg)}

.view{position:absolute;inset:0;overflow:hidden;
      visibility:hidden;opacity:0;pointer-events:none;
      contain:layout style;
      transition:opacity .11s ease}
.view.on{visibility:visible;opacity:1;pointer-events:auto}
/* ddfix-20260828: chart popovers use viewport coords; contain:layout would trap
   them (containing block). Relax it for the transcluded chart view only. */
.view:has(#chartToolbar){contain:style}
@media (prefers-reduced-motion:reduce){.view{transition:none}}
.vload{display:flex;align-items:center;justify-content:center;gap:10px;height:100%;color:var(--txt3);font-size:11px;letter-spacing:.1em}
.vload i{color:var(--accent)}
.verr{padding:30px;color:var(--red);font-size:12px;line-height:1.6}

.panel{border-right:1px solid var(--border);border-bottom:1px solid var(--border);display:flex;flex-direction:column;
       min-height:0;min-width:0;background:var(--panel)}
.no-right{border-right:none}
.no-bottom{border-bottom:none}

.sekv{display:flex;justify-content:space-between;gap:12px;font-size:10.5px;color:var(--txt2);
      padding:5px 0;border-bottom:1px solid #14161d}
.sekv:last-of-type{border-bottom:none}
.sekv span{flex:0 0 auto}
.sekv b{color:var(--white);font-weight:600;text-align:right;word-break:break-word}
.sekv b.pos{color:var(--green)} .sekv b.neg{color:var(--red)} .sekv b.warn{color:var(--yellow)}
.phead{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;flex:0 0 auto}
.phead .pt{font-size:10px;letter-spacing:.13em;color:var(--txt2);font-weight:700}
.phead .pr{display:flex;align-items:center;gap:10px;color:var(--txt3)}
.phead .pr i{cursor:pointer;font-size:11px}
.pbody{flex:1;min-height:0;overflow:auto}
.sel{background:#0f1017;border:1px solid var(--border2);border-radius:5px;color:var(--txt2);font-size:10px;
     padding:3px 7px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.sel i{font-size:8px}
.link{color:var(--accent);font-size:10px;font-weight:600;letter-spacing:.05em;text-decoration:none}
.footlink{padding:9px 12px}

.tabs{display:flex;gap:16px;padding:0 12px 8px}
.tabs button{background:none;border:none;color:var(--txt3);font-size:10px;font-weight:700;letter-spacing:.07em;
             padding:0 0 6px;cursor:pointer;border-bottom:2px solid transparent;font-family:'Figtree'}
.tabs button:hover{color:var(--txt2)}
.tabs button.on{color:var(--accent);border-bottom-color:var(--accent)}

table.t{width:100%;border-collapse:collapse}
table.t th{text-align:right;color:var(--txt3);font-size:9px;letter-spacing:.06em;font-weight:600;padding:4px 12px}
table.t th:first-child{text-align:left}
table.t td{padding:6px 12px;font-size:11px;text-align:right}
table.t td:first-child{text-align:left}
table.t tr:hover{background:var(--row)}
.msym{color:var(--white);font-weight:600}
.mnm{color:var(--txt3);font-size:9px}
.dot{width:5px;height:5px;border-radius:50%;display:inline-block;margin-right:6px}

.dd{position:relative}
.dd>.sel{white-space:nowrap}
.dd.open>.sel{border-color:#2f6f52;color:var(--txt)}
.ddmenu{position:absolute;top:calc(100% + 5px);right:0;z-index:2000;min-width:132px;max-height:min(60vh,420px);overflow:auto;padding:4px;
        background:#0d0f15;border:1px solid var(--border2);border-radius:7px;
        box-shadow:0 14px 30px -12px rgba(0,0,0,.85);display:none}
.dd.open .ddmenu,.ddmenu[style*="position: fixed"]{display:block}
.ddmenu button{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;cursor:pointer;
               font-family:'Figtree';font-size:10.5px;color:var(--txt2);padding:6px 8px;border-radius:5px;text-align:left}
.ddmenu button:hover{background:var(--row);color:var(--white)}
.ddmenu button.on{color:var(--accent)}
.ddmenu button.on::after{content:"\2713";margin-left:auto;font-size:9px}

.skel{display:inline-block;height:9px;border-radius:3px;vertical-align:middle;
      background:linear-gradient(90deg,#151922 25%,#222833 50%,#151922 75%);background-size:200% 100%;
      animation:ttskel 1.15s ease-in-out infinite}
.skel.blk{display:block}
@keyframes ttskel{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.skel{animation:none;background:#1a1f28}}

.chartskel{position:absolute;inset:auto 0 34px 0;height:38%;max-height:180px;display:flex;align-items:flex-end;gap:3px;opacity:.75;
           padding:26px 14px 14px;z-index:3;pointer-events:none}
.chartskel[hidden]{display:none}
.chartskel i{flex:1;border-radius:2px;background:linear-gradient(90deg,#12161e 25%,#1d232d 50%,#12161e 75%);
             background-size:200% 100%;animation:ttskel 1.3s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.chartskel i{animation:none}}

.donut.loading{background:conic-gradient(#171b24 0 100%)!important;animation:ttpulse 1.4s ease-in-out infinite}
@keyframes ttpulse{0%,100%{opacity:.55}50%{opacity:.9}}

.viewskel{position:absolute;inset:0;display:grid;grid-template-columns:264px minmax(0,1fr);gap:1px;
          background:var(--border);padding:0}
.viewskel .vs-side,.viewskel .vs-main{background:var(--panel);padding:12px;min-width:0;overflow:hidden}
.viewskel .vs-main{display:grid;grid-template-rows:minmax(0,1fr) 150px;gap:12px}
.viewskel .vs-chart{border-radius:6px;background:linear-gradient(90deg,#0e1219 25%,#171d26 50%,#0e1219 75%);
                    background-size:200% 100%;animation:ttskel 1.3s ease-in-out infinite}
.viewskel .vs-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.viewskel .vs-strip i,.viewskel .vs-side i{display:block;border-radius:4px;
  background:linear-gradient(90deg,#0e1219 25%,#171d26 50%,#0e1219 75%);background-size:200% 100%;
  animation:ttskel 1.3s ease-in-out infinite}
.viewskel .vs-side i{height:11px;margin-bottom:11px}

.mockchip{font-size:7.5px;letter-spacing:.12em;font-weight:800;padding:2px 5px;border-radius:3px;
          background:#241f14;color:#c79a3c;margin-left:8px}

.hl{padding:2px 0}
.hlrow{display:flex;gap:10px;padding:5px 12px;cursor:pointer;align-items:baseline}
.hlrow:hover{background:var(--row)}
.hlrow .tm{color:var(--txt3);font-family:var(--mono);font-size:10px;flex:0 0 auto}
.hlrow .tx{color:var(--txt);font-size:11px;flex:1;line-height:1.35}
.hlrow .src{color:var(--txt3);font-size:9px;flex:0 0 auto;font-style:italic}

.status{display:flex;align-items:center;gap:20px;padding:0 16px;background:var(--hdr);border-top:1px solid var(--border);
        font-size:10px;color:var(--txt3)}
.status .g{color:var(--green)}
.status .conn::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);
                      margin-right:6px;box-shadow:0 0 6px var(--green)}
.status .sp{flex:1}
.status a,.status button{color:var(--txt3);text-decoration:none;letter-spacing:.05em}
.status a:hover,.status button:hover{color:var(--txt)}
.status button{border:0;background:none;padding:0;font:inherit;cursor:pointer}

.userwrap{position:relative}
.user{user-select:none}
.ava.avaimg{object-fit:cover}
.usermenu{position:absolute;top:calc(100% + 9px);right:0;z-index:80;min-width:216px;padding:6px;
          background:#0d0f15;border:1px solid var(--border2);border-radius:9px;
          box-shadow:0 18px 40px -14px rgba(0,0,0,.9);display:none}
.userwrap.open .usermenu{display:block}
.umhead{padding:9px 10px 11px;border-bottom:1px solid var(--border);margin-bottom:6px;position:relative}
.umhead b{display:block;color:var(--white);font-size:12px;font-weight:600}
.umhead span{display:block;color:var(--txt3);font-size:10px;margin-top:3px;word-break:break-all}
.umtier{position:absolute!important;top:9px;right:0;font-size:7.5px;letter-spacing:.12em;font-weight:800;
        padding:2px 6px;border-radius:4px;background:#1b1e27;color:var(--txt2);margin:0!important}
.umtier.pro{background:#15211c;color:var(--accent)}
.usermenu a,.usermenu .umlang{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:6px;
            color:var(--txt2);font-size:11.5px;text-decoration:none}
.usermenu .umlang{width:100%;border:0;background:none;font-family:inherit;text-align:left;cursor:pointer}
.usermenu .umlang b{margin-left:auto;color:var(--txt3);font-size:9px;letter-spacing:.08em}
.usermenu a:hover,.usermenu .umlang:hover{background:var(--row);color:var(--white)}
.usermenu a i,.usermenu .umlang i{width:14px;font-size:11px;color:var(--txt3)}
.usermenu a:hover i,.usermenu .umlang:hover i{color:var(--accent)}
.usermenu a.danger:hover{color:#ff8a93}
.usermenu a.danger:hover i{color:#ff8a93}
.umsep{height:1px;background:var(--border);margin:6px 4px}
.signin{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:7px;text-decoration:none;
        font-size:10.5px;font-weight:700;letter-spacing:.1em;color:#04120c;
        background:linear-gradient(135deg,#00FFB2,#00cc8e)}
.signin:hover{filter:brightness(1.08)}
.signin i{font-size:11px}

.mobnav{display:none;position:relative;z-index:40;background:#07080c;border-top:1px solid var(--border);
        padding-bottom:env(safe-area-inset-bottom)}
.mobnav .mn{display:grid;grid-template-columns:repeat(5,1fr);height:52px}
.mobnav button{background:none;border:none;font-family:'Figtree';display:flex;flex-direction:column;align-items:center;
               justify-content:center;gap:4px;color:var(--txt3);font-size:8.5px;letter-spacing:.08em;font-weight:700;cursor:pointer}
.mobnav button i{font-size:15px}
.mobnav button.on{color:var(--accent)}
.mobnav button.on i{filter:drop-shadow(0 0 7px rgba(0,255,178,.5))}

.msearch{display:none;position:fixed;inset:0;z-index:120;background:rgba(4,5,8,.92);backdrop-filter:blur(3px);
         padding:14px;flex-direction:column;gap:10px}
.msearch.open{display:flex}
.msearch .row{display:flex;gap:10px;align-items:center}
.msearch input{flex:1;background:var(--panel);border:1px solid var(--border2);border-radius:9px;color:var(--txt);
               padding:12px 14px;font-size:14px;font-family:'Figtree'}
.msearch input:focus{outline:none;border-color:#2f6f52}
.msearch .close{background:none;border:none;color:var(--txt2);font-size:17px;padding:8px;cursor:pointer}
.msearch .hits{flex:1;overflow:auto;display:flex;flex-direction:column;gap:1px}
.msearch .hit{display:flex;align-items:baseline;gap:10px;padding:11px 12px;border-radius:8px;background:var(--panel);cursor:pointer}
.msearch .hit b{color:var(--white);font-size:13px}
.msearch .hit span{color:var(--txt3);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msearch .hit em{margin-left:auto;font-style:normal;font-size:11px}
.msearchbtn{display:none;background:none;border:none;color:var(--txt2);font-size:15px;padding:6px;cursor:pointer}

@media (max-width:1180px){
  .hdr{grid-template-columns:minmax(0,1fr) minmax(200px,380px) minmax(0,auto);gap:12px;padding:0 12px}
  .brand .bword{letter-spacing:.2em;font-size:15px}
  .mktopen{display:none}
  .hicons{gap:12px}
  .user .un{display:none}
  .status{gap:12px;font-size:9.5px}
  .status span:nth-child(n+4):not(.sp){display:none}
}

@media (max-width:760px){

  .app{grid-template-rows:48px 38px minmax(0,1fr) auto}
  .status{display:none}
  .mobnav{display:block}

  .hdr{grid-template-columns:auto 1fr auto;height:48px;gap:8px;padding:0 10px}
  .brand{min-width:0;gap:8px}
  .brand .bword{display:none}
  .brand .blogo{font-size:21px}
  .brand .bbar{height:17px}
  .search{display:none}
  .msearchbtn{display:block;justify-self:end}
  .hdrleft{gap:8px}
  .hdrright{gap:8px}
  .hicons{display:none}
  .ava{width:28px;height:28px}
  .usermenu{position:fixed;top:auto;bottom:60px;left:10px;right:10px;min-width:0}

  .tabbar{height:38px;gap:4px;padding:0 6px}
  .tab{height:32px;max-width:150px;font-size:11.5px;padding:0 8px 0 10px}
  .tab.on{height:35px}
  .tab+.tab::before{background:transparent}
  .newtab{width:32px;height:32px}

  .view{overflow:auto;-webkit-overflow-scrolling:touch}
  .panel{border-right:none}
  .panel .phead{cursor:pointer;padding:11px 12px;position:relative}
  .panel .phead::after{content:"\f078";font-family:"Font Awesome 6 Free";font-weight:900;font-size:9px;
                       color:var(--txt3);margin-left:8px;transition:transform .15s}
  .panel.collapsed .phead::after{transform:rotate(-90deg)}
  .panel.collapsed > *:not(.phead){display:none!important}
  .pbody{max-height:60vh}

  .msec{display:flex;align-items:center;gap:8px;padding:11px 12px;background:#0c0e14;border-top:1px solid var(--border);
        color:var(--txt2);font-size:10px;letter-spacing:.13em;font-weight:700;cursor:pointer}
  .msec i{margin-left:auto;color:var(--txt3);font-size:9px;transition:transform .15s}
  .msec.collapsed i{transform:rotate(-90deg)}

  .emptyp{padding:22px 12px}
  .vload,.viewskel{padding:0}
  .viewskel{grid-template-columns:1fr}
  .viewskel .vs-side{display:none}
}

@media (max-width:400px){
  .tab{max-width:118px}
  .mobnav button{font-size:8px}
}

.status .conn.g::before{background:var(--green);box-shadow:0 0 6px var(--green)}
.status .conn.y::before{background:var(--yellow);box-shadow:0 0 6px rgba(230,185,61,.6)}
.status .conn.r::before{background:var(--red);box-shadow:0 0 6px rgba(242,96,108,.6)}
.status .conn.y{color:var(--yellow)} .status .conn.r{color:var(--red)}
.status #mktstatus{display:flex;gap:20px;min-width:0;overflow:hidden}
@media (max-width:1180px){ .status #mktstatus span:nth-child(n+4){display:none} }

.pal{position:fixed;inset:0;z-index:200;display:none;background:rgba(4,5,8,.72);backdrop-filter:blur(4px);
     padding:12vh 16px 16px;justify-content:center;align-items:flex-start}
.pal.open{display:flex}
.palwrap{width:100%;max-width:680px;background:#0b0d13;border:1px solid var(--border2);border-radius:12px;
         box-shadow:0 34px 80px -24px rgba(0,0,0,.95),0 0 0 1px rgba(0,255,178,.07);overflow:hidden;
         display:flex;flex-direction:column;max-height:74vh}
.palhead{display:flex;align-items:center;gap:11px;padding:13px 15px;border-bottom:1px solid var(--border)}
.palhead > i{color:var(--txt3);font-size:13px}
.palinput{flex:1;background:none;border:none;outline:none;color:var(--white);font-size:15px;font-family:'Figtree'}
.palinput::placeholder{color:#4a505b}
.palmode{font-size:8px;font-weight:800;letter-spacing:.14em;padding:3px 7px;border-radius:4px;background:#15211c;color:var(--accent)}
.palclose{background:none;border:none;color:var(--txt3);cursor:pointer;font-size:14px;padding:2px 4px}
.palclose:hover{color:var(--white)}
.palbody{flex:1;overflow:auto;padding:6px}
.palsec{font-size:8.5px;letter-spacing:.16em;color:var(--txt3);font-weight:800;padding:9px 10px 5px}
.palrow{display:grid;grid-template-columns:20px minmax(0,auto) minmax(0,1fr) auto;gap:11px;align-items:baseline;
        padding:8px 10px;border-radius:7px;cursor:pointer}
.palrow > i{color:var(--txt3);font-size:11px;justify-self:center}
.palrow .pt2{color:var(--txt);font-size:12.5px;font-weight:600;white-space:nowrap}
.palrow .ps{color:var(--txt3);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.palrow .pm{color:#454b56;font-size:10px;white-space:nowrap;display:flex;gap:8px;align-items:baseline}
.palrow .palpx{color:var(--txt2)}
.palrow b{color:var(--accent);font-weight:700}
.palrow.on{background:linear-gradient(90deg,rgba(0,255,178,.14),rgba(0,255,178,.04));
           box-shadow:inset 2px 0 0 var(--accent)}
.palrow.on > i{color:var(--accent)}
.palrow.on .pt2{color:#fff}
.palempty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:38px 20px;color:var(--txt3);font-size:11.5px}
.palempty i{font-size:18px;color:#2a2f38}
.palempty em{font-style:normal;font-size:10px;color:#3c424c}
.palhelp{padding:12px 14px 16px;font-size:11.5px;color:var(--txt2);line-height:1.9}
.palhelp .ph{font-size:8.5px;letter-spacing:.16em;color:var(--txt3);font-weight:800;margin:10px 0 4px}
.palhelp .ph:first-child{margin-top:0}
.palfoot{display:flex;align-items:center;gap:16px;padding:8px 14px;border-top:1px solid var(--border);
         font-size:9.5px;color:var(--txt3);flex-wrap:wrap}
.palfoot .palhint{margin-left:auto;color:#3c424c}
kbd{display:inline-block;min-width:16px;text-align:center;padding:1px 5px;margin-right:3px;border-radius:4px;
    border:1px solid var(--border2);background:#12151c;color:var(--txt2);font-family:'Figtree';font-size:9.5px}
@media (max-width:760px){
  .pal{padding:0}
  .palwrap{max-width:none;max-height:100vh;max-height:100dvh;height:100%;border-radius:0;border:none}
  .palhead{padding:14px}
  .palinput{font-size:16px}
  .palfoot{display:none}
  .palrow{grid-template-columns:20px minmax(0,auto) minmax(0,1fr);padding:11px 10px}
  .palrow .pm{display:none}
}

.tfs{display:flex;gap:1px}
.tfs button{background:transparent;border:none;color:var(--txt2);font-size:10px;font-weight:600;padding:5px 9px;
            border-radius:4px;cursor:pointer;font-family:'Figtree'}
.tfs button:hover{color:var(--txt)}
.tfs button.on{background:#15211c;color:var(--accent)}
.cfoot{display:flex;align-items:center;gap:2px;padding:7px 12px;color:var(--txt3);font-size:10px;flex:0 0 auto}
.cfoot .rbtn{padding:3px 8px;border-radius:4px;cursor:pointer;font-weight:600}
.cfoot .rbtn:hover{color:var(--txt)}
.cfoot .rbtn.on{background:#15211c;color:var(--accent)}
.cfoot .clock{margin-left:auto;font-family:var(--mono);color:var(--txt2)}
.cfoot .mode{padding:3px 7px;border-radius:4px;cursor:pointer}
.cfoot .mode.on{color:var(--accent)}

.chartel{flex:1;min-height:0}
.chartmsg{position:absolute;inset:0 0 34px 0;display:flex;align-items:center;justify-content:center;gap:10px;
          text-align:center;background:rgba(10,11,17,.72);color:var(--txt2);font-size:11px;letter-spacing:.1em;
          line-height:1.7;z-index:4;pointer-events:none}
.chartmsg[hidden]{display:none}
.chartmsg i{color:var(--accent);font-size:13px}
.chartmsg b{color:var(--white)}
.chartmsg span{max-width:440px;letter-spacing:.04em}
.chg{font-weight:600}
.ohlc{color:var(--txt3);font-size:11px;display:flex;gap:12px;align-self:center}
.ohlc b{color:var(--txt);font-weight:500}
.sk{pointer-events:none}

.asof{display:inline-flex;align-items:center;gap:6px;font-size:9px;color:var(--txt3);letter-spacing:.04em}
.asofT{white-space:nowrap}
.stalechip{font-size:7.5px;font-weight:800;letter-spacing:.1em;padding:2px 5px;border-radius:3px;background:#3a2a15;color:#e0a83c}
.imp{font-size:8px;padding:1px 6px;border-radius:3px;font-weight:700}
.imp.high{background:#3a1c1f;color:#f2606c}
.imp.med{background:#3a331c;color:#e6b93d}
.imp.low{background:#1b2430;color:#7d97b5}
.sent{font-size:8px;font-weight:800;letter-spacing:.1em;padding:2px 5px;border-radius:3px}
.sent.pos{background:#12291f;color:var(--green)}
.sent.neg{background:#2d1a1e;color:var(--red)}
.sent.neu{background:#1b1e27;color:var(--txt3)}
.pri{font-size:7.5px;font-weight:800;letter-spacing:.1em;padding:1px 5px;border-radius:3px}
.pri.high{background:#2d1a1e;color:var(--red)}
.pri.medium{background:#2a2410;color:var(--yellow)}
.pri.low{background:#1b1e27;color:var(--txt3)}
.dirchip{font-size:8.5px;font-weight:800;letter-spacing:.06em;padding:2px 6px;border-radius:3px}
.dirchip.b2{background:#12291f;color:var(--green)}
.dirchip.b1{background:#101f1a;color:#4fd39a}
.dirchip.n{background:#1b1e27;color:var(--txt2)}
.dirchip.s1{background:#2a191d;color:#f08d96}
.dirchip.s2{background:#2d1a1e;color:var(--red)}
.scorebar{display:inline-flex;align-items:center;gap:7px}
.scorebar .track{width:52px;height:5px;background:#0f1118;border-radius:2px;overflow:hidden}
.scorebar .track i{display:block;height:100%;border-radius:2px}
.rgm{color:var(--txt3);font-size:9.5px;text-transform:capitalize}
.ar{font-size:7px;margin-left:4px}
.feeddot{width:6px;height:6px;border-radius:50%;background:var(--txt3);display:inline-block;
         transition:background .2s,box-shadow .2s}
.feeddot.fresh{background:var(--green);box-shadow:0 0 6px var(--green)}
.feeddot.delayed{background:var(--yellow);box-shadow:0 0 6px rgba(230,185,61,.5)}
.feeddot.err{background:var(--red);box-shadow:0 0 6px rgba(242,96,108,.5)}
.emptyp{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:18px 12px;
        color:var(--txt3);font-size:10.5px;text-align:center;line-height:1.5}
.emptyp i{font-size:14px;color:#31363f}
.emptyp em{font-style:normal;font-size:9px;color:#41464f}
.foothint{font-size:9.5px;color:var(--txt3);letter-spacing:.03em;line-height:1.5;
          margin-top:9px;padding-top:8px;border-top:1px solid #14161d}
.foothint b{font-weight:700}
.foothint em{font-style:normal;display:block;color:#41464f;font-size:9px;margin-top:3px;line-height:1.5}
.srcnote{font-size:9px;color:var(--txt3);letter-spacing:.06em;margin-left:auto}
.waitp{padding:14px 12px;color:var(--txt3);font-size:10.5px}

.ctcanvas{position:absolute;inset:0;z-index:4;pointer-events:none;touch-action:none}
.ctlegend{position:absolute;top:8px;left:10px;z-index:5;display:flex;flex-wrap:wrap;gap:5px;max-width:calc(100% - 90px)}
.ctchip{display:inline-flex;align-items:center;gap:6px;background:rgba(10,11,17,.86);border:1px solid var(--border);
        border-radius:5px;padding:2px 6px;font-size:9.5px;color:var(--txt);cursor:pointer;backdrop-filter:blur(3px)}
.ctchip.off{opacity:.42}
.ctchip i{width:7px;height:7px;border-radius:50%;display:inline-block}
.ctchip em{font-style:normal;color:var(--txt3);font-size:9px}
.ctchip b{font-weight:400;color:var(--txt3);padding:0 1px}
.ctchip b:hover{color:var(--white)}

.ctpanels{display:flex;flex-direction:column;min-height:0;max-height:52%;overflow:auto}
.ctpanel{height:104px;flex:none;border-top:1px solid var(--border);position:relative;display:flex;flex-direction:column;min-height:0}
.ctphead{position:absolute;top:3px;left:9px;z-index:3;display:flex;align-items:center;gap:7px;
         font-size:9.5px;color:var(--txt2);pointer-events:none}
.ctphead b{color:var(--white);font-weight:700}
.ctpparams{color:var(--txt3);font-size:9px}
.ctpx{pointer-events:auto;cursor:pointer;color:var(--txt3);font-size:12px;line-height:1;padding:0 3px}
.ctpx:hover{color:var(--red)}
.ctpchart{flex:1;min-height:0}

.ctrail{display:flex;flex-direction:column;gap:2px;padding:6px 4px;background:var(--panel);
        border-right:1px solid var(--border);align-items:center}
.ctrail button{width:26px;height:26px;border:none;border-radius:5px;background:transparent;color:var(--txt3);
               font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ctrail button:hover{background:var(--row);color:var(--txt)}
.ctrail button.on{background:#15211c;color:var(--accent)}
.ctrail .sep{width:16px;height:1px;background:var(--border);margin:5px 0}

.ctmenu{position:absolute;top:46px;right:14px;z-index:40;width:290px;max-height:min(70vh,460px);
        background:var(--panel2);border:1px solid var(--border2);border-radius:8px;
        box-shadow:0 18px 44px rgba(0,0,0,.62);display:flex;flex-direction:column;min-height:0}
.ctmenu[hidden]{display:none}
.ctmhead{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-bottom:1px solid var(--border);
         font-size:9.5px;letter-spacing:.14em;color:var(--txt3)}
.ctmhead b{color:var(--white);font-weight:700;letter-spacing:.14em}
.ctmhead span{cursor:pointer;font-size:15px;line-height:1;color:var(--txt3)}
.ctmhead span:hover{color:var(--white)}
.ctmbody{overflow:auto;padding:5px 0 8px}
.ctmgrp{padding:9px 12px 4px;color:var(--txt3);font-size:9px;letter-spacing:.14em;font-weight:700}
.ctmrow{display:flex;align-items:center;gap:7px;padding:5px 12px;cursor:pointer}
.ctmrow:hover{background:var(--row)}
.ctmrow i.dot{width:7px;height:7px;border-radius:50%;flex:none}
.ctmrow .nm{color:var(--txt);font-size:10.5px;flex:1;min-width:0}
.ctmrow input{width:38px;background:#0f1017;border:1px solid var(--border2);border-radius:4px;color:var(--txt);
              font-size:9.5px;padding:2px 4px;font-family:'Figtree';text-align:center}
.ctmrow input:focus{outline:none;border-color:#2f6f52}
.ctmrow .add{color:var(--accent);font-size:10px;font-weight:700}
.acbtn{background:transparent;border:1px solid var(--border2);border-radius:5px;color:var(--txt2);
       font-size:9.5px;font-weight:600;padding:4px 8px;cursor:pointer;font-family:'Figtree';letter-spacing:.04em}
.acbtn:hover{border-color:var(--accent);color:var(--accent)}
.acbtn.on{background:#15211c;border-color:#2f6f52;color:var(--accent)}

.langwrap{position:relative;display:flex}
.langtop{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--border2);
         border-radius:6px;color:var(--white);text-decoration:none;font-size:10px;font-weight:700;background:none;
         font-family:'Figtree',-apple-system,sans-serif;cursor:pointer;
         letter-spacing:.08em;line-height:1;transition:border-color .12s,color .12s}
.langtop i{font-size:12px;color:var(--txt3);transition:color .12s}
.langtop b{font-weight:700}
.langtop .langchev{font-size:7px;margin-left:1px}
.langtop:hover,.langwrap.open .langtop{border-color:#2f6f52;color:var(--accent)}
.langmenu{position:absolute;top:calc(100% + 9px);right:0;z-index:90;min-width:180px;padding:6px;
          background:#0d0f15;border:1px solid var(--border2);border-radius:9px;
          box-shadow:0 18px 40px -14px rgba(0,0,0,.9);display:none}
.langwrap.open .langmenu{display:block}
.langmenu a{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:6px;color:var(--txt2);
            text-decoration:none;font-size:11px;outline:none}
.langmenu a:hover,.langmenu a:focus{background:var(--row);color:var(--white)}
.langmenu a[aria-current="true"]{color:var(--accent)}
.langmenu a b{width:22px;color:var(--txt3);font-size:9px;letter-spacing:.08em}
.langmenu a span{flex:1}
.langmenu a > i{font-size:9px;color:var(--accent)}

.cmenu{position:relative;display:flex}
.cmbtn{position:relative;background:none;border:0;padding:4px 5px;cursor:pointer;
       color:var(--txt2);font-size:14px;line-height:1;transition:color .12s}
.cmbtn:hover,.cmenu.open .cmbtn{color:var(--accent)}

.cmdot{position:absolute;top:2px;right:2px;width:7px;height:7px;padding:0;
       border-radius:50%;background:var(--red);font-size:0;color:transparent;
       box-shadow:0 0 0 2px var(--hdr);pointer-events:none}
.cmpanel{position:absolute;top:calc(100% + 9px);right:0;z-index:80;width:320px;max-width:calc(100vw - 24px);
         background:#0d0f15;border:1px solid var(--border2);border-radius:9px;
         box-shadow:0 18px 40px -14px rgba(0,0,0,.9);display:none;overflow:hidden}
.cmenu.open .cmpanel{display:block}
.cmhead{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--border);
        color:var(--txt3);font:800 8.5px/1 var(--mono);letter-spacing:.14em}
.cmact{margin-left:auto;background:none;border:0;padding:0;cursor:pointer;text-decoration:none;
       color:var(--txt3);font:700 8px/1 var(--mono);letter-spacing:.1em;transition:color .12s}
.cmact:hover{color:var(--accent)}
.cmbody{max-height:340px;overflow-y:auto}
.cmrow{display:flex;gap:9px;padding:10px 12px;border-bottom:1px solid var(--border);position:relative}
.cmrow:last-child{border-bottom:0}
.cmrow.unread{background:rgba(0,255,178,.045)}
.cmrow.unread::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent)}
.cmico{width:24px;height:24px;flex:none;border-radius:6px;display:flex;align-items:center;justify-content:center;
       background:var(--row);color:var(--txt2);font-size:10px}
.cmico.info{color:var(--blue)} .cmico.success{color:var(--green)} .cmico.warning{color:var(--yellow)}
.cmico.error,.cmico.urgent{color:var(--red)}
.cmtxt{min-width:0;flex:1}
.cmtxt b{display:block;color:var(--white);font:600 11.5px/1.35 var(--mono)}
.cmtxt span{display:block;color:var(--txt2);font:400 10.5px/1.45 var(--mono);margin-top:2px;
            overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cmtxt em{display:block;color:var(--txt3);font:500 9px/1 var(--mono);font-style:normal;margin-top:5px}
.cmtxt a{color:var(--accent);text-decoration:none;font-weight:600}
.cmx{background:none;border:0;color:var(--txt3);cursor:pointer;font-size:12px;padding:0 2px;align-self:flex-start}
.cmx:hover{color:var(--red)}
.cmnone{padding:22px 14px;text-align:center;color:var(--txt3);font:400 10.5px/1.5 var(--mono)}
.cmkey{display:flex;align-items:center;gap:10px;padding:6px 12px;color:var(--txt2);font:400 11px/1.4 var(--mono)}
.cmkey kbd{margin-left:auto;background:var(--row);border:1px solid var(--border2);border-radius:4px;
           padding:2px 6px;color:var(--txt);font:600 9.5px/1.4 var(--mono)}
.cmlink{display:flex;align-items:center;gap:9px;padding:8px 12px;color:var(--txt2);
        text-decoration:none;font:400 11px/1 var(--mono);transition:background .12s,color .12s}
.cmlink i{width:14px;text-align:center;color:var(--txt3);font-size:11px}
.cmlink:hover{background:var(--row);color:var(--white)}
.cmlink:hover i{color:var(--accent)}
.cmfoot{padding:8px 12px;border-top:1px solid var(--border);color:var(--txt3);font:500 9px/1 var(--mono)}
@media (max-width:760px){
  .hicons{display:flex!important;gap:2px}
  .cmpanel{position:fixed;top:52px;right:8px;left:8px;width:auto}
  .cmbody{max-height:min(60vh,420px)}
}

.adminwrap{position:relative}
.adminbtn{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--border2);
          border-radius:6px;background:none;color:var(--white);font:700 10px/1 'Figtree',-apple-system,sans-serif;
          letter-spacing:.08em;cursor:pointer;transition:border-color .12s,color .12s}
.adminbtn i{font-size:12px;color:var(--txt3);transition:color .12s}
.adminbtn:hover,.adminwrap.open .adminbtn{border-color:#2f6f52;color:var(--accent)}
.adminbtn:hover i,.adminwrap.open .adminbtn i{color:var(--accent)}
.adminmenu{position:absolute;top:calc(100% + 9px);right:0;z-index:80;min-width:198px;padding:6px;
           background:#0d0f15;border:1px solid var(--border2);border-radius:9px;
           box-shadow:0 18px 40px -14px rgba(0,0,0,.9);display:none}
.adminwrap.open .adminmenu{display:block}
.amhead{padding:7px 10px 8px;margin-bottom:4px;border-bottom:1px solid var(--border);
        color:var(--txt3);font-size:8.5px;font-weight:800;letter-spacing:.14em}
.adminmenu a{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:6px;
             color:var(--txt2);text-decoration:none;font-size:11.5px;
             transition:background .12s,color .12s}
.adminmenu a i{width:14px;text-align:center;font-size:11px;color:var(--txt3);transition:color .12s}
.adminmenu a:hover{background:var(--row);color:var(--white)}
.adminmenu a:hover i{color:var(--accent)}

@media (max-width:860px){.adminbtn b{display:none}.adminbtn{padding:5px 7px}}
.langtop:hover i{color:var(--accent)}
@media (max-width:860px){ .langtop b{display:none} .langtop{padding:5px 7px} }

.upsell{position:fixed;inset:0;z-index:4000;display:none;align-items:center;justify-content:center;
        background:rgba(4,5,8,.72);backdrop-filter:blur(3px)}
.upsell.on{display:flex}
.upbox{width:min(400px,calc(100vw - 32px));background:var(--panel2);border:1px solid var(--border2);
       border-radius:12px;padding:26px 24px 20px;text-align:center;box-shadow:0 26px 70px rgba(0,0,0,.6)}
.upbox > i{font-size:20px;color:var(--yellow);margin-bottom:12px;display:block}
.upbox b{display:block;color:var(--white);font-size:16px;font-weight:700;margin-bottom:6px}
.upbox span{display:block;color:var(--txt2);font-size:11.5px;line-height:1.6}
.upacts{display:flex;gap:8px;justify-content:center;margin-top:16px;flex-wrap:wrap}
.upbtn{background:linear-gradient(135deg,#00FFB2,#00cc8e);border:none;color:#04120c;font-family:'Figtree';
       font-size:10px;font-weight:800;letter-spacing:.09em;padding:9px 16px;border-radius:7px;
       cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.upbtn.ghost{background:transparent;border:1px solid var(--border2);color:var(--txt2)}
.upbtn.ghost:hover{border-color:var(--accent);color:var(--accent)}
.upbox em{display:block;font-style:normal;color:#41464f;font-size:9.5px;margin-top:12px}

.tab.pinned{background:linear-gradient(180deg,rgba(0,255,178,.07),transparent)}
.tab.pinned .pin{font-size:8px;color:var(--txt3);transform:rotate(20deg);margin-left:2px}
.tab.pinned:hover .pin{color:var(--accent)}
.tab.pinned .tl{padding-right:2px}
.tt-data-state{min-height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;text-align:center;color:var(--txt3)}
.tt-data-state i{font-size:18px}.tt-data-state strong{font-size:11px;color:var(--txt);font-weight:650}.tt-data-state small{font-size:9px;color:var(--txt3);overflow-wrap:anywhere}
.tt-data-state[data-state="partial"],.tt-data-state[data-state="stale"]{border:1px solid rgba(225,171,57,.22);background:rgba(225,171,57,.035)}
.tt-data-state[data-state="error"]{border:1px solid rgba(225,76,76,.2);background:rgba(225,76,76,.035)}
.tt-source-meta{display:flex;flex-wrap:wrap;gap:6px 14px;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:rgba(5,7,10,.55);font-size:9px;color:var(--txt3)}
.tt-source-meta>div{display:flex;gap:5px}.tt-source-meta b{color:var(--txt2);font-weight:600}.tt-source-meta[data-freshness="stale"]{border-color:rgba(225,171,57,.32)}
.tt-source-coverage{display:flex!important;flex-wrap:wrap;gap:4px 10px}.tt-source-meta section{flex-basis:100%}.tt-source-meta ul{margin:4px 0 0 16px;padding:0}
.market-source{padding:4px 8px;min-height:0}.market-source:empty{display:none}.market-source .tt-source-meta{padding:5px 8px;border-radius:4px;background:rgba(5,7,10,.72)}

/* A view that failed offers a way out instead of a dead dark rectangle. */
.verr-retry{margin-top:14px;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;
  color:var(--accent);background:#0f1017;border:1px solid rgba(0,255,178,.35);border-radius:5px;padding:7px 12px;cursor:pointer}
.verr-retry:hover{background:rgba(0,255,178,.08)}

/* touch targets: the 16px tab-close X is below the ~44px guideline on phones */
@media (max-width:760px){.tab .x{width:26px;height:26px;font-size:12px}}

/* ── tt-skel: per-view loading skeletons (loading-skel-20260816) ──────────
   One shimmer language for every archetype: bars sweep, structures fade in
   staggered, candles grow from the baseline. Everything degrades to a calm
   static state under prefers-reduced-motion. */
.tt-skel{position:absolute;inset:0;display:flex;flex-direction:column;gap:12px;padding:14px;
         background:var(--bg);overflow:hidden;animation:tskIn .25s ease both}
.tt-skel *,.tsk-frag *{box-sizing:border-box}
.tsk-frag{position:relative;display:flex;flex-direction:column;gap:12px;padding:8px 0;overflow:hidden}
.tsk-b{display:block;height:11px;border-radius:5px;flex-shrink:0;
       background:linear-gradient(100deg,#12161f 40%,#1b2130 50%,#12161f 60%);
       background-size:200% 100%;animation:tskSweep 1.4s ease infinite}
.tsk-gap{display:block;height:7px}
@keyframes tskSweep{to{background-position:-200% 0}}
@keyframes tskIn{from{opacity:0}to{opacity:1}}
@keyframes tskRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes tskGrow{from{transform:scaleY(.1);opacity:0}to{transform:scaleY(1);opacity:1}}
@keyframes tskSpin{to{transform:rotate(360deg)}}
@keyframes tskBreathe{from{opacity:.55}to{opacity:1}}

.tsk-toolbar{display:flex;gap:8px;flex-shrink:0}
.tsk-toolbar .tsk-b{height:24px;border-radius:6px}

/* chart: candle field + price axis + timeline */
.tsk-chartwrap{display:flex;flex:1;gap:10px;min-height:0}
.tsk-chart{flex:1;display:flex;align-items:flex-end;gap:6px;padding:10px 6px 0;min-width:0;overflow:hidden;
           border:1px solid var(--border);border-radius:8px;background:#0c0f16}
.tsk-candle{position:relative;flex:0 0 7px;border-radius:2px;background:rgba(242,96,108,.16);
            transform-origin:bottom;animation:tskGrow .7s cubic-bezier(.22,1,.36,1) both,tskBreathe 1.8s ease-in-out infinite alternate}
.tsk-candle.up{background:rgba(0,255,178,.15)}
.tsk-candle::after{content:'';position:absolute;left:50%;top:-14px;bottom:-8px;width:1px;margin-left:-.5px;
                   background:rgba(255,255,255,.05)}
.tsk-axis{display:flex;flex-direction:column;justify-content:space-between;padding:12px 0;flex-shrink:0}
.tsk-axis .tsk-b{width:34px;height:8px}
.tsk-timeline{display:flex;justify-content:space-between;gap:10px;flex-shrink:0;padding:0 6px}
.tsk-timeline .tsk-b{height:8px}

/* table: header + staggered rows */
.tsk-table{flex:1;display:flex;flex-direction:column;gap:0;min-height:0;overflow:hidden;
           border:1px solid var(--border);border-radius:8px;background:var(--panel,#12151c)}
.tsk-thead{display:flex;gap:4%;padding:12px 14px;border-bottom:1px solid var(--border)}
.tsk-thead .tsk-b{height:8px;opacity:.7}
.tsk-row{display:flex;gap:4%;padding:13px 14px;border-bottom:1px solid rgba(255,255,255,.03);
         animation:tskRise .5s ease both}
.tsk-row .tsk-b{height:10px}

/* feed: thumb + two lines */
.tsk-feed{flex:1;display:flex;flex-direction:column;gap:10px;min-height:0;overflow:hidden}
.tsk-feeditem{display:flex;gap:12px;padding:12px;border:1px solid var(--border);border-radius:8px;
              background:var(--panel,#12151c);animation:tskRise .5s ease both}
.tsk-thumb{flex:0 0 44px;height:44px;border-radius:6px;
           background:linear-gradient(100deg,#12161f 40%,#1b2130 50%,#12161f 60%);
           background-size:200% 100%;animation:tskSweep 1.4s ease infinite}
.tsk-feedlines{flex:1;display:flex;flex-direction:column;gap:9px;justify-content:center;min-width:0}

/* cards: responsive grid with spark hints */
.tsk-cards{flex:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
           gap:12px;align-content:start;min-height:0;overflow:hidden}
.tsk-card{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid var(--border);
          border-radius:9px;background:var(--panel,#12151c);animation:tskRise .55s ease both}
.tsk-dot{width:26px;height:26px;border-radius:7px;background:var(--accentdim,#0e332a);opacity:.8}
.tsk-spark{display:flex;align-items:flex-end;gap:3px;height:30px;margin-top:auto;opacity:.6}
.tsk-spark i{flex:1;border-radius:1px;background:rgba(0,255,178,.14)}

/* article: reading column */
.tsk-article{flex:1;display:flex;flex-direction:column;gap:11px;max-width:680px;width:100%;
             margin:0 auto;padding-top:18px;overflow:hidden}
.tsk-article .tsk-b[data-tall]{height:26px}
.tsk-image{height:180px;border-radius:9px;flex-shrink:0;margin:6px 0;
           background:linear-gradient(100deg,#12161f 40%,#1b2130 50%,#12161f 60%);
           background-size:200% 100%;animation:tskSweep 1.4s ease infinite}

/* heatmap: mosaic */
.tsk-heatmap{flex:1;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:1fr;gap:6px;
             min-height:0;overflow:hidden}
.tsk-tile{border-radius:5px;background:rgba(242,96,108,.10);animation:tskRise .5s ease both,tskBreathe 2s ease-in-out infinite alternate}
.tsk-tile.up{background:rgba(0,255,178,.10)}

/* calendar: weekday grid */
.tsk-cal{flex:1;display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:1fr;gap:5px;min-height:0;overflow:hidden}
.tsk-calhead{grid-column:1/-1;display:grid;grid-template-columns:repeat(7,1fr);gap:5px;padding-bottom:4px}
.tsk-calhead .tsk-b{height:8px;width:60%;margin:0 auto}
.tsk-calcell{border:1px solid rgba(255,255,255,.04);border-radius:6px;background:rgba(255,255,255,.015);
             padding:6px;animation:tskRise .45s ease both}
.tsk-calcell .tsk-b{height:7px;width:70%}

/* split: settings/profile nav + content */
.tsk-split{flex:1;display:flex;gap:14px;min-height:0;overflow:hidden}
.tsk-splitnav{flex:0 0 200px;display:flex;flex-direction:column;gap:14px;padding:14px;
              border:1px solid var(--border);border-radius:9px;background:var(--panel,#12151c)}
.tsk-splitnav .tsk-b{animation:tskSweep 1.4s ease infinite,tskRise .5s ease both}
.tsk-splitmain{flex:1;display:flex;flex-direction:column;gap:12px;padding:16px;min-width:0;
               border:1px solid var(--border);border-radius:9px;background:var(--panel,#12151c)}
.tsk-splitmain .tsk-b[data-tall]{height:20px;margin-bottom:6px}

/* chat: alternating bubbles + composer */
.tsk-chat{flex:1;display:flex;flex-direction:column;gap:12px;justify-content:flex-end;min-height:0;overflow:hidden}
.tsk-msg{height:38px;border-radius:12px 12px 12px 3px;align-self:flex-start;
         background:linear-gradient(100deg,#12161f 40%,#1b2130 50%,#12161f 60%);
         background-size:200% 100%;animation:tskSweep 1.4s ease infinite,tskRise .5s ease both}
.tsk-msg.me{align-self:flex-end;border-radius:12px 12px 3px 12px;background:linear-gradient(100deg,#0e2c22 40%,#12382c 50%,#0e2c22 60%);background-size:200% 100%}
.tsk-chatbar{flex-shrink:0;height:42px;border-radius:9px;border:1px solid var(--border);background:var(--panel,#12151c)}

/* dash: KPI tiles + chart/list duo */
.tsk-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;flex-shrink:0}
.tsk-kpi{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid var(--border);
         border-radius:9px;background:var(--panel,#12151c);animation:tskRise .5s ease both}
.tsk-kpi .tsk-b:last-child{height:18px}
.tsk-duo{flex:1;display:grid;grid-template-columns:3fr 2fr;gap:12px;min-height:0;overflow:hidden}
.tsk-duo .tsk-chart{border-radius:8px}

/* caption: quiet status line */
.tsk-cap{position:absolute;left:14px;bottom:12px;display:flex;align-items:center;gap:8px;
         font:600 10px 'Figtree',system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
         color:var(--txt3,#8a919b);background:rgba(10,11,17,.72);padding:6px 10px;border-radius:6px;
         border:1px solid var(--border);backdrop-filter:blur(4px)}
.tsk-cap span{color:var(--txt2,#a3aab4)}
.tsk-spin{width:11px;height:11px;border-radius:50%;border:2px solid rgba(255,255,255,.12);
          border-top-color:var(--accent,#00FFB2);animation:tskSpin .8s linear infinite}

@media (max-width:760px){
  .tt-skel{padding:10px}
  .tsk-splitnav{flex-basis:120px}
  .tsk-tiles{grid-template-columns:repeat(2,1fr)}
  .tsk-duo{grid-template-columns:1fr}
  .tsk-heatmap{grid-template-columns:repeat(4,1fr)}
  .tsk-axis{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tt-skel,.tt-skel *,.tsk-frag,.tsk-frag *{animation:none!important}
  .tsk-b,.tsk-thumb,.tsk-image,.tsk-msg{background-position:0 0}
  .tsk-candle,.tsk-row,.tsk-feeditem,.tsk-card,.tsk-tile,.tsk-calcell,.tsk-kpi{opacity:.85}
}

/* ── tt-skel mini: in-panel loading shimmer (loading-skel2-20260816) ────── */
.tt-data-state[data-state="loading"]{gap:12px}
.tsk-mini{display:flex;align-items:center;justify-content:center}
.tsk-minibars{display:flex;flex-direction:column;gap:8px;width:min(240px,72%)}
.tsk-minibars .tsk-b{height:9px}
.tsk-srtext{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* uifix2-20260817: skeleton cover crossfade over freshly built views */
.tt-skelcover{position:absolute;inset:0;z-index:40;transition:opacity .3s ease}
.tt-skelcover.gone{opacity:0;pointer-events:none}

/* hlrowfix-20260817: a long source name must never starve the headline -
   the title owns the flexible space, the source clamps and ellipsizes */
.hlrow .tm{flex:0 0 auto}
.hlrow .tx{flex:1 1 auto;min-width:0}
.hlrow .src{flex:0 1 auto;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}


/* ── onboarding overlay v2 - blocky terminal language (onboarding-v2-20260818) ── */
.obov{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;
      background:rgba(4,6,9,.84);backdrop-filter:blur(4px);animation:obIn .25s ease both;padding:18px}
@keyframes obIn{from{opacity:0}to{opacity:1}}
.obcard{width:min(720px,100%);max-height:min(90vh,780px);overflow:auto;border:1px solid var(--border2);
        border-top:2px solid var(--accent);border-radius:6px;background:var(--panel,#12151c);
        box-shadow:0 24px 70px rgba(0,0,0,.65)}
.obtop{display:flex;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid var(--border);background:#0e1117;
       position:sticky;top:0;z-index:2}
.obtop .brand{min-width:0;gap:8px}
.obtop .brand .blogo{font-size:16px}
.obtop .brand .bbar{height:13px}
.obtop .brand .bword{font-size:10px;letter-spacing:.28em}
.obdots{display:flex;gap:4px;margin-left:4px}
.obdots i{width:18px;height:3px;background:#1c202a}
.obdots i.done{background:rgba(0,255,178,.4)}
.obdots i.on{background:var(--accent)}
.obskip{margin-left:auto;background:none;border:1px solid var(--border2);border-radius:4px;padding:5px 10px;
        color:var(--txt3);font:700 8.5px 'Martian Mono',monospace;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.obskip:hover{color:var(--txt);border-color:#3a404d}
.obstep{padding:20px 22px 22px;animation:obStep .25s ease both}
@keyframes obStep{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.obcenter{text-align:center;padding:46px 28px 36px}
.obstep h1{font:700 26px/1.2 'Figtree';color:var(--white);letter-spacing:-.02em;margin-bottom:10px}
.obstep h2{font:700 17px/1.25 'Figtree';color:var(--white);letter-spacing:-.01em;margin-bottom:5px}
.obstep p,.obsub{color:var(--txt2);font-size:12px;line-height:1.6}
.obcenter p{max-width:440px;margin:0 auto 22px}
.obsub{margin-bottom:14px}
.obchips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:4px 0 20px}
.obchip{padding:13px 10px;border:1px solid var(--border2);border-radius:4px;background:#0e1117;
        color:var(--txt);font:600 12px 'Figtree';text-align:center;cursor:pointer;transition:border-color .12s,background .12s}
.obchip:hover{border-color:#3a404d;color:var(--white)}
.obchip.on{border-color:var(--accent);background:var(--accentdim,#0e332a);color:var(--accent)}
.obtext{width:100%;min-height:86px;resize:vertical;border:1px solid var(--border2);border-radius:4px;background:#0b0e13;
        color:var(--white);font:500 13px/1.55 'Figtree';padding:11px 12px;margin-bottom:16px}
.obtext:focus{outline:none;border-color:var(--accent)}
.obnav{display:flex;justify-content:space-between;align-items:center;gap:12px}
.obcta{padding:11px 20px;border:1px solid var(--accent);border-radius:4px;background:var(--accent);
       color:#04120c;font:800 11px 'Figtree';letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:filter .12s}
.obcta:hover{filter:brightness(1.1)}
.obcta[disabled]{opacity:.35;cursor:default}
.obback{background:none;border:1px solid var(--border2);border-radius:4px;padding:9px 14px;
        color:var(--txt3);font:700 8.5px 'Martian Mono',monospace;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.obback:hover{color:var(--txt);border-color:#3a404d}
.obhint{display:block;margin-top:12px;color:var(--txt3);font-size:10px}
.obpulse{display:flex;justify-content:center;align-items:flex-end;gap:5px;height:26px;margin:6px 0 18px}
.obpulse i{width:5px;height:100%;background:var(--accent);transform-origin:bottom;animation:obEq .9s ease-in-out infinite}
.obpulse i:nth-child(2){animation-delay:.15s}
.obpulse i:nth-child(3){animation-delay:.3s}
@keyframes obEq{0%,100%{transform:scaleY(.25);opacity:.4}50%{transform:scaleY(1);opacity:1}}
.obuse{border:1px solid var(--border);border-left:2px solid var(--accent);border-radius:4px;background:#0e1117;
       padding:12px 14px;margin:2px 0 16px;color:var(--txt);font-size:12.5px;line-height:1.65}
.obviews{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:18px}
.obview{position:relative;text-align:left;padding:11px;border:1px solid var(--border);border-radius:10px;
        background:var(--panel,#12151c);cursor:pointer;display:flex;flex-direction:column;
        transition:border-color .12s,background .12s,transform .12s;animation:obStep .3s ease both}
.obview:hover{transform:translateY(-2px);border-color:#2f6f52;background:#0b0e13}
.obview:nth-child(2){animation-delay:.04s}.obview:nth-child(3){animation-delay:.08s}
.obview:nth-child(4){animation-delay:.12s}.obview:nth-child(5){animation-delay:.16s}
.obview:nth-child(6){animation-delay:.2s}.obview:nth-child(7){animation-delay:.24s}
.obprev{display:flex;gap:4px;height:72px;border-radius:7px;background:#07080d;border:1px solid #161922;
        padding:5px;overflow:hidden;pointer-events:none}
.obprev .col{display:flex;flex-direction:column;gap:4px}
.obprev .row{display:flex;gap:4px}
.obprev .wf{background:#141821;border-radius:2.5px;flex:1}
.obprev .wf.a{background:linear-gradient(180deg,#1d4636,#16332a)}
.obprev .wf.b{background:#1a1f2a}
.obprev .wf.l{height:3px;flex:0 0 auto}
.obvt{display:flex;align-items:center;gap:7px;font:600 13px 'Figtree';color:var(--white);margin-top:9px}
.obvt i{color:var(--accent);font-size:11.5px;width:14px;text-align:center}
.obvr{font-size:10.5px;color:var(--txt2);line-height:1.45;margin-top:4px;min-height:29px}
.obvdef{font:700 7.5px 'Martian Mono',monospace;letter-spacing:.14em;color:var(--txt3);margin-top:7px}
.obview.on{border-color:var(--accent);background:#0b0e13}
.obview.on .obvdef{color:var(--accent)}
.obtoast{position:fixed;right:18px;bottom:18px;z-index:890;background:var(--panel,#12151c);border:1px solid var(--border2);
         border-left:2px solid var(--accent);border-radius:4px;padding:12px 15px;color:var(--txt);font:500 12px 'Figtree';
         box-shadow:0 16px 44px rgba(0,0,0,.5);animation:obStep .25s ease both}
.obtoast b{color:var(--white);margin-right:8px}
.obtoast button{background:none;border:none;color:var(--accent);font:700 11.5px 'Figtree';cursor:pointer;text-decoration:underline}
@media (max-width:760px){
  .obcard{max-height:94vh}
  .obstep{padding:16px 14px 18px}
  .obcenter{padding:34px 16px 26px}
  .obstep h1{font-size:21px}
  .obchips{grid-template-columns:1fr 1fr}
  .obviews{grid-template-columns:1fr 1fr}
  .obview .vr{min-height:0}
}
@media (prefers-reduced-motion:reduce){
  .obov,.obstep,.obview,.obtoast{animation:none}
  .obpulse i{animation-duration:2.4s}
}

/* ── slow-load pulse (skelload-20260826): equalizer + microlabel over any view skeleton ── */
.tt-skelload{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
             gap:11px;pointer-events:none;opacity:0;animation:ttSkelLoadIn .3s ease .35s forwards;z-index:5}
.tt-skelload .bars{display:flex;align-items:flex-end;gap:5px;height:22px}
.tt-skelload .bars i{width:5px;height:100%;background:var(--accent);transform-origin:bottom;animation:ttSkelEq .9s ease-in-out infinite}
.tt-skelload .bars i:nth-child(2){animation-delay:.15s}
.tt-skelload .bars i:nth-child(3){animation-delay:.3s}
.tt-skelload .lbl{font:700 8.5px 'Martian Mono',monospace;letter-spacing:.22em;color:var(--txt3)}
@keyframes ttSkelLoadIn{to{opacity:1}}
@keyframes ttSkelEq{0%,100%{transform:scaleY(.25);opacity:.4}50%{transform:scaleY(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.tt-skelload .bars i{animation-duration:2.4s}}

/* ── top-edge load progress (smoothload-20260826) ── */
#ttprog{position:fixed;top:0;left:0;height:2px;width:0;z-index:1300;background:var(--accent);
        box-shadow:0 0 8px rgba(0,255,178,.5);opacity:0;pointer-events:none;
        transition:width .18s ease,opacity .35s ease}
@media (prefers-reduced-motion:reduce){#ttprog{box-shadow:none}}

/* obresponsive-20260826: onboarding always fits the viewport - the card is a
   fixed-height flex column, only the workspace grid scrolls, and the title +
   actions stay pinned so OPEN MY TERMINAL is never below the fold. Cards are
   compacted so the full 9 fit without scrolling on a normal laptop. */
.obcard{display:flex;flex-direction:column;max-height:min(92vh,880px);overflow:hidden}
.obtop{flex:0 0 auto}
.obstep{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden auto}
.obstep h1,.obstep h2,.obsub,.obuse,.obnav,.obhint,.obchips,.obtext,.obpulse{flex:0 0 auto}
.obuse{margin:2px 0 10px}
.obviews{flex:1 1 auto;min-height:0;overflow-y:auto;gap:8px;margin-bottom:12px;align-content:start;
         grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.obview{padding:9px}
.obprev{height:52px}
.obvt{margin-top:7px}
.obvr{margin-top:3px;min-height:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.obvdef{margin-top:5px}
.obnav{padding-top:2px}
.obhint{margin-top:8px}
@media (max-height:720px){
  .obprev{height:42px}
  .obview{padding:8px}
  .obvr{-webkit-line-clamp:1}
  .obstep{padding:14px 18px 14px}
}
