/* ===================== SPATIAL GLASS — demo_v13 reskin ===================== */
:root{
  --bg:#10283a; --bg2:rgba(13,24,36,.55);
  --panel:rgba(13,24,36,.55); --panel2:rgba(255,255,255,.08);
  --tile:rgba(255,255,255,.08); --tile2:rgba(255,255,255,.14);
  --slab:rgba(13,24,36,.55); --field:rgba(0,10,20,.32); --hole:rgba(13,24,36,.92); --ghost:rgba(255,255,255,.07);
  --cyan:#4fc3f7; --sky:#4fc3f7; --cyan-dim:rgba(79,195,247,.45);
  --amber:#ffc94d; --amber-dim:rgba(255,201,77,.5);
  --green:#4caf7d; --red:#e57373;
  --lime:#d4e157; --lime-pill:#d4e157;
  --line:rgba(255,255,255,.15); --line-2:rgba(255,255,255,.34); --line-top:rgba(255,255,255,.34); --line-soft:rgba(255,255,255,.10);
  --txt:#fff; --text:#fff; --txt-dim:rgba(255,255,255,.62); --text-2:rgba(255,255,255,.62); --txt-mute:rgba(255,255,255,.42); --muted:rgba(255,255,255,.42); --dim:rgba(255,255,255,.62); --dim2:rgba(255,255,255,.42);
  --inbg:rgba(0,10,20,.32);
  --bright:#fff; --ink:#06121c;
  --track:rgba(255,255,255,.13);
  --glow-cyan:0 0 14px rgba(79,195,247,.28); --glow-amber:0 0 14px rgba(255,201,77,.28);
  --sans:'Manrope',system-ui,sans-serif; --mono:'Manrope',ui-monospace,monospace; --head:'Manrope',system-ui,sans-serif;
  --glass-shadow:0 40px 90px rgba(0,8,16,.55);
  --r:30px;
  --sb-w:76px; --sb-x:248px;
  --ipw:0px;
  --gap:16px;
  --maxw:2100px;
  --edge:max(var(--gap), calc((100vw - var(--maxw)) / 2));
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--txt);font-family:var(--sans);font-size:15px;overflow:hidden;position:relative;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
svg{stroke-linecap:round;stroke-linejoin:round}
::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32)}
::selection{background:rgba(79,195,247,.3)}

/* ===== room backdrop + theme overlays (demo day/night) ===== */
.bg-layer{position:fixed;inset:0;z-index:0;pointer-events:none}
.roombg{position:fixed;inset:0;z-index:0;background:url('/demo_assets/room.jpg') center/cover no-repeat #2a2620;pointer-events:none}
.room-night{position:fixed;inset:0;z-index:1;pointer-events:none;mix-blend-mode:multiply;
  background:radial-gradient(120% 90% at 50% 0%, #1d4259 0%, #122c3f 100%),linear-gradient(180deg,#16334a,#1a3d54);
  opacity:1;transition:opacity .3s}
.room-extra{position:fixed;inset:0;z-index:1;pointer-events:none;background:rgba(8,18,28,.38);opacity:1;transition:opacity .3s}
.room-day{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(110% 110% at 50% 40%, rgba(255,255,255,0) 55%, rgba(255,255,255,.28) 100%);
  opacity:0;transition:opacity .3s}
body.theme-light .room-night,body.theme-light .room-extra{opacity:0}
body.theme-light .room-day{opacity:1}
body.theme-light{background:#cfd6da}
body:not(.app) .roombg,body:not(.app) .room-night,body:not(.app) .room-extra,body:not(.app) .room-day{opacity:0}
.bg-grid,.bg-glow1,.bg-glow2{display:none}

/* ===== login / auth cosmos (UNCHANGED) ===== */
canvas#omega{position:fixed;inset:0;z-index:2;transition:opacity 1s,transform .8s cubic-bezier(.5,0,.2,1)}
canvas#corefx{position:fixed;inset:0;z-index:6;pointer-events:none;transition:opacity 1s}
body.auth canvas#corefx,body.app canvas#corefx{opacity:0}
body.app canvas#omega{opacity:0}
.grain,.vg{display:none}
.hud{position:fixed;z-index:6;color:var(--txt-dim);font-family:var(--mono);font-size:10px;letter-spacing:1.5px;opacity:.7;transition:opacity .5s}
.hud.tl{top:22px;left:26px}
body.auth .hud.tl,body.app .hud.tl{opacity:0}
@keyframes bl{50%{opacity:.3}}
@keyframes fuc{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
.telegroup{display:none}
.wordmark{position:fixed;top:0;left:0;right:0;height:58vh;z-index:5;display:flex;align-items:center;pointer-events:none;font-family:var(--head);font-size:clamp(44px,8vw,108px);font-weight:700;letter-spacing:-1px;line-height:1;transition:opacity .6s}
.wordmark .wm-l{flex:1;text-align:right;color:rgba(220,238,245,.62)}
.wordmark .wm-r{flex:1;text-align:left;color:rgba(255,201,77,.7)}
.coregap{flex:0 0 auto;width:180px}
body.auth .wordmark,body.app .wordmark{opacity:0}
body.auth #qrTrigger,body.app #qrTrigger,body.auth #pwTrigger,body.app #pwTrigger{display:none!important}

.loginForm{position:fixed;left:50%;top:50%;transform:translateX(-50%);z-index:8;width:332px;max-width:86vw;display:flex;flex-direction:column;gap:11px;transition:opacity .4s;opacity:0;pointer-events:none}
.loginForm.pwon{opacity:1;pointer-events:auto;animation:fuc .5s}
.loginForm .lbl{font-family:var(--mono);font-size:10px;letter-spacing:3px;color:var(--sky);text-align:center;margin-bottom:3px;text-shadow:var(--glow-cyan)}
.loginForm input{width:100%;background:rgba(10,18,28,.5);border:1px solid var(--line);border-top-color:var(--line-2);border-radius:14px;padding:13px 20px;color:var(--txt);font-family:var(--sans);font-size:14px;outline:none;text-align:center;transition:.2s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.loginForm input::placeholder{color:var(--txt-mute)}
.loginForm input:focus{border-color:var(--sky);box-shadow:0 0 0 3px rgba(79,195,247,.12)}
.loginbtn{width:100%;padding:13px;border:none;border-radius:14px;background:linear-gradient(135deg,var(--lime),var(--green));color:#1f2603;font-weight:800;font-size:13px;letter-spacing:2px;font-family:var(--sans);cursor:pointer;transition:.2s;margin-top:3px;box-shadow:0 8px 26px rgba(79,195,247,.3)}
.loginbtn:hover{box-shadow:0 10px 34px rgba(79,195,247,.45);transform:translateY(-1px)}
.loginForm .hint{font-family:var(--mono);font-size:9.5px;letter-spacing:1px;color:var(--txt-mute);text-align:center;margin-top:2px}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.shake{animation:shake .32s}
body.auth .loginForm,body.app .loginForm{opacity:0;transform:translate(-50%,14px);pointer-events:none}
.wsZone,.syshint,.brandchip .bm,.brandchip .bsep,.island,.subseg,.sysbar,.netbar{display:none!important}

/* ===== HEADER NAV (tabs: icon top · label below) ===== */
.brand{flex:0 0 auto;padding:0 12px 0 4px;display:flex;align-items:center;gap:11px;cursor:pointer;white-space:nowrap;border-right:1px solid var(--line);margin-right:2px}
.glyph{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:14px;background:var(--tile);border:1px solid var(--line)}
.glyph svg{width:29px;height:29px}
.glyph .orb,.glyph .orb2{transform-origin:center}
@keyframes spin{to{transform:rotate(360deg)}}
.brand-txt{display:block}
.brand-txt b{font-family:var(--head);font-weight:800;font-size:15px;letter-spacing:.4px;color:var(--bright);display:block;line-height:1.1}
.brand-txt span{font-size:9px;letter-spacing:2px;color:var(--dim);text-transform:uppercase;font-weight:700}
.nav{flex:1;min-width:0;display:flex;flex-direction:row;align-items:stretch;justify-content:safe center;gap:4px;overflow-x:auto;overflow-y:hidden;padding:0 2px;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:7px 13px 6px;border-radius:16px;cursor:pointer;color:var(--dim);position:relative;transition:.16s;border:1px solid transparent}
.nav-item .ico{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;transition:.2s;position:relative}
.nav-item .ico img{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.22));transition:transform .18s}
.nav-item .nlbl{font-family:var(--head);font-size:10.5px;font-weight:700;letter-spacing:.2px;white-space:nowrap;line-height:1}
.nav-item:hover{background:var(--ghost);color:var(--txt)}
.nav-item:hover .ico img{transform:scale(1.08)}
.nav-item.active{background:var(--tile2);color:var(--bright);box-shadow:inset 0 1px 0 var(--line-top)}
.nav-item.active .nlbl{color:var(--bright)}
.nav-item.active .ico img{transform:scale(1.12);filter:drop-shadow(0 2px 5px rgba(0,0,0,.32))}
.nav-item.active::after{content:"";position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);width:20px;height:3px;border-radius:3px;background:var(--c,var(--cyan));box-shadow:0 0 8px var(--c,var(--cyan))}
/* badge — corner pill on icon */
.nav-badge{position:absolute;top:1px;right:5px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--lime-pill);color:#1f2603;font-size:10.5px;font-weight:800;border:1.5px solid var(--hole);display:none;place-items:center;line-height:1;font-family:var(--sans);z-index:2}
.nav-badge.show{display:grid}
.nav-item:has(.nav-badge.show) .ico img{filter:drop-shadow(0 0 4px rgba(212,225,87,.9)) drop-shadow(0 2px 8px rgba(212,225,87,.5))}

.topbar{position:fixed;top:var(--gap);left:var(--edge);right:calc(var(--edge) + var(--ipw));z-index:11;display:flex;align-items:center;gap:16px;padding:0 16px 0 14px;height:76px;
  background:var(--slab);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4);
  border:1px solid var(--line);border-top-color:var(--line-top);border-radius:24px;box-shadow:var(--glass-shadow);
  opacity:0;pointer-events:none;transition:opacity .5s .4s}
body.app .topbar{opacity:1;pointer-events:auto}
.top-stat{margin-left:auto;display:flex;gap:14px;align-items:center;flex:0 0 auto}
.clock{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--dim);letter-spacing:.5px;min-width:78px;text-align:right;padding:8px 14px;border-radius:999px;background:var(--tile);border:1px solid var(--line);border-top-color:var(--line-top)}
@media(max-width:1080px){:root{--ipw:0px}}

main{position:fixed;top:var(--gap);left:var(--edge);right:var(--edge);bottom:var(--gap);z-index:7;overflow:hidden;padding:0;opacity:0;pointer-events:none;transition:opacity .5s .4s}
body.app main{opacity:1;pointer-events:auto;left:var(--edge);right:calc(var(--edge) + var(--ipw))}
main>.inner{position:absolute;inset:0;top:86px;border-radius:var(--r);
  background:var(--slab);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4);
  border:1px solid var(--line);border-top-color:var(--line-top);box-shadow:var(--glass-shadow);
  overflow:hidden;padding:0;display:flex;flex-direction:column}
#pagehost{flex:1;min-height:0;display:flex;flex-direction:column;max-width:none}
.page{flex:1;min-height:0;display:flex;flex-direction:column;animation:fade .35s ease;overflow-y:auto;padding:22px 26px 30px}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ===== HEAD / titles ===== */
.head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:14px;flex-shrink:0}
.head h1{font-family:var(--head);font-size:clamp(20px,2vw,26px);font-weight:800;letter-spacing:-.01em;color:var(--bright);display:none}
.head p{color:var(--txt-mute);font-size:12.5px;margin-top:6px;font-family:var(--sans);display:none}
.section-title,.pf-sec{font-family:var(--head);font-size:13px;letter-spacing:.3px;color:var(--bright)}

/* ===== buttons (demo pills) ===== */
.btn{font-family:var(--sans);font-weight:800;font-size:12.5px;letter-spacing:.2px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--tile2);color:var(--txt);cursor:pointer;transition:.16s;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.btn:hover{background:var(--ghost)}
.btn svg{width:15px;height:15px}
.btn.pri,.btn.lime{background:var(--lime-pill);color:#1f2603;border-color:transparent;font-weight:800}
.btn.pri:hover,.btn.lime:hover{filter:brightness(1.05);color:#1f2603}
.btn.ghost{background:transparent;color:var(--dim)}
.btn.sm{font-size:11.5px;padding:6px 12px}
.btn:active{transform:scale(.97)}
.bok,.bno,.bnt{font-size:11.5px;font-weight:800;padding:7px 14px;border-radius:999px;cursor:pointer;border:1px solid;transition:.15s;display:inline-block;white-space:nowrap}
.bok{border-color:rgba(76,175,125,.45);color:var(--green);background:rgba(76,175,125,.16)}
.bok:hover{background:rgba(76,175,125,.28)}
.bno{border-color:rgba(229,115,115,.45);color:var(--red);background:rgba(229,115,115,.14)}
.bno:hover{background:rgba(229,115,115,.24)}
.bnt{background:var(--tile2);color:var(--dim);border-color:var(--line)}
.bnt:hover{background:var(--ghost);color:var(--txt);border-color:var(--line-2)}
.q{font-family:var(--sans);font-weight:700;font-size:12px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;cursor:pointer;color:var(--dim);background:var(--tile2);transition:.15s;display:inline-block;user-select:none}
.q:hover{background:var(--ghost);color:var(--txt);border-color:var(--line-2)}
.q.go{background:var(--lime-pill);color:#1f2603;border-color:transparent;font-weight:800}
.splitbtn{display:inline-flex;border-radius:999px;overflow:hidden;border:1px solid var(--line);font-size:11.5px;font-weight:800;cursor:pointer;vertical-align:middle}
.splitbtn span{padding:7px 16px;transition:flex-grow .28s cubic-bezier(.5,0,.2,1),background .2s,color .2s;flex:1 1 50%;text-align:center;white-space:nowrap}
.sb-yes{background:rgba(76,175,125,.16);color:var(--green)}
.sb-no{background:rgba(229,115,115,.16);color:var(--red);border-left:1px solid var(--line)}
.splitbtn:hover .sb-yes{flex-grow:2.4;background:rgba(76,175,125,.3);color:#dffff0}
.splitbtn:hover .sb-yes~.sb-no{flex-grow:.5}
.splitbtn:has(.sb-no:hover) .sb-no{flex-grow:2.4;background:rgba(229,115,115,.32);color:#ffe0e6}
.splitbtn:has(.sb-no:hover) .sb-yes{flex-grow:.5}

/* ===== panels / cards (demo tiles) ===== */
.card,.tablewrap{position:relative;background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:16px 18px;margin-bottom:0}
.card::before,.card::after,.tablewrap::before,.tablewrap::after{display:none}
.card .ch{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;gap:10px;flex-wrap:wrap}
.card .ch h3{font-family:var(--head);font-size:14.5px;letter-spacing:.2px;color:var(--bright);font-weight:800}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:880px){.grid2{grid-template-columns:1fr}}
.ev-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.ev-col{min-width:0}
@media(max-width:1100px){.ev-split{grid-template-columns:1fr}}

/* ===== KPI / stats tiles ===== */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}
@media(max-width:1100px){.kpis{grid-template-columns:repeat(2,1fr)}}
.kpi{position:relative;background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:16px 18px;overflow:hidden;transition:.2s}
.kpi:hover{border-color:var(--line-2);background:var(--tile2)}
.kpi::after{display:none}
.kpi .l{font-size:12px;color:var(--dim);font-weight:600}
.kpi .v{font-family:var(--head);font-size:24px;font-weight:800;color:var(--bright);margin:8px 0 4px;line-height:1}
.kpi .s{font-size:11px;color:var(--txt-mute);font-family:var(--mono)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}
@media(max-width:1100px){.stats{grid-template-columns:repeat(2,1fr)}}
.ovgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media(max-width:1100px){.ovgrid{grid-template-columns:1fr}}
.todo-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;cursor:pointer;border:1px solid transparent;transition:.15s}
.todo-row:hover{background:var(--ghost);border-color:var(--line)}
.todo-row span{font-size:13px}
.todo-row b{min-width:26px;text-align:center;padding:2px 8px;border-radius:999px;background:var(--lime-pill);border:0;color:#1f2603;font-size:12px;font-weight:800}
.st{position:relative;background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:16px 18px}
.st::after{display:none}
.st .l{font-size:12px;color:var(--dim);font-weight:600}
.st .v{font-family:var(--head);font-size:24px;font-weight:800;color:var(--bright);margin:8px 0 4px;line-height:1}
.st .t{font-size:11px;color:var(--txt-mute);font-family:var(--mono)}

/* ===== banner / overview approvals ===== */
.ovapv{display:flex;align-items:center;gap:14px;margin-bottom:14px;padding:14px 18px;border-radius:18px;background:linear-gradient(135deg,rgba(212,225,87,.22),rgba(76,175,125,.1));border:1px solid rgba(212,225,87,.4);position:relative;overflow:hidden;cursor:pointer;transition:.18s;font-size:14px;font-weight:600}
.ovapv::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--lime-pill)}
.ovapv:hover{background:linear-gradient(135deg,rgba(212,225,87,.3),rgba(76,175,125,.14))}
.ovapv svg{width:20px;height:20px;color:var(--lime-pill);flex-shrink:0}
.ovapv .n{color:var(--bright);font-weight:800;font-family:var(--head)}
.ovapv .go{margin-left:auto;color:var(--lime-pill);font-size:12.5px;font-weight:800}

/* ===== Overview (demo layout) ===== */
.ovg{display:grid;grid-template-columns:5fr 3fr 4fr;gap:14px}
.ovg+.ovg{margin-top:14px}
.ovpanel{background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:16px 18px;min-width:0}
.ovpanel .pt{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px;flex-wrap:wrap}
.ovpanel .pt h3{font-family:var(--head);font-size:14.5px;font-weight:800;color:var(--bright)}
.ovchip{font-size:11.5px;font-weight:700;color:var(--dim);background:var(--tile2);border:1px solid var(--line);border-radius:999px;padding:4px 11px;white-space:nowrap}
.ovseg{display:inline-flex;gap:3px;background:var(--tile2);border:1px solid var(--line);border-radius:999px;padding:3px}
.ovseg .q{font-size:11px;font-weight:700;color:var(--dim);border-radius:999px;padding:3px 10px;cursor:pointer;transition:.16s;white-space:nowrap}
.ovseg .q:hover{color:var(--txt)}
.ovseg .q.go{background:var(--lime-pill,var(--lime));color:#1f2603}
.evtabs{display:flex;gap:8px;overflow-x:auto;padding:0;flex:1;min-width:0;align-items:center;scrollbar-width:none}
.evtabs::-webkit-scrollbar{display:none}
.evtabs-page{flex:0 0 auto;margin:0 0 16px;padding-bottom:2px}
.evtab{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:11px 22px;border-radius:15px;background:var(--tile2);border:1px solid var(--line);cursor:pointer;transition:.16s;font-family:var(--head);font-size:14px;font-weight:800;letter-spacing:.2px;color:var(--dim);white-space:nowrap;user-select:none}
.evtab:hover{border-color:var(--line-2);color:var(--txt)}
.evtab.go{background:var(--lime-pill);border-color:transparent;box-shadow:0 3px 10px rgba(212,225,87,.18);color:var(--ink);text-shadow:none}
.evtab.add{border-style:dashed}
/* sub-header tab row (page tabs) — same chip style, left-aligned */
.subtabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.evbox{background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:14px;margin-bottom:14px;overflow:hidden}
.evbox-h{display:flex;align-items:center;gap:10px;padding:13px 16px;cursor:pointer;user-select:none}
.evbox-h:hover{background:rgba(255,255,255,.03)}
.evbox-ttl{flex:1;font-family:var(--head);font-size:13.5px;font-weight:800;color:var(--bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.evbox-c{display:none;padding:6px 16px 16px}
.evbox.open .evbox-c{display:block}
.evchev{width:17px;height:17px;color:var(--txt-mute);transition:transform .2s;flex:0 0 auto}
.evbox.open .evchev{transform:rotate(90deg)}
.ovpill{display:inline-block;font-size:11.5px;font-weight:800;border-radius:999px;padding:4px 12px;white-space:nowrap;background:var(--lime-pill);color:#1f2603}
.ovpill.done{background:var(--green);color:#06251a}
/* capsule activity bars */
.ovbars{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;height:172px;padding-top:4px}
.ovbars .col{display:flex;flex-direction:column;align-items:center;gap:7px;flex:1;height:100%}
.ovbars .pct{font-size:11.5px;font-weight:700;color:var(--dim)}
.ovbars .trk{flex:1;width:100%;max-width:28px;border-radius:999px;background:var(--track);position:relative;overflow:hidden}
.ovbars .fil{position:absolute;bottom:0;left:0;right:0;border-radius:999px;background:rgba(255,255,255,.92)}
.ovbars .col.today .fil{background:linear-gradient(180deg,var(--lime),var(--green))}
.ovbars .col.today .pct{color:var(--bright)}
.ovbars .lbl{font-size:10.5px;font-weight:700;color:var(--dim2);white-space:nowrap}
.ovbars .col.today .lbl{color:var(--bright)}
.ovbars.wide{gap:3px}
.ovbars.wide .pct{display:none}
.ovbars.wide .trk{max-width:13px}
.ovbars.wide .lbl{font-size:9px}
/* mini stat stack */
.ovstack{display:flex;flex-direction:column;gap:14px}
.ovmini{background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:15px 16px;display:flex;align-items:center;gap:13px;min-width:0}
.ovmini .ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--tile2);border:1px solid var(--line);font-size:19px;flex:0 0 auto}
.ovmini b{display:block;font-family:var(--head);font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--bright)}
.ovmini span{font-size:12px;font-weight:600;color:var(--dim)}
.ovmini i{display:block;font-style:normal;font-size:10.5px;font-weight:600;color:var(--dim2)}
/* donut */
.ovdonutwrap{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ovdonut{width:128px;height:128px;border-radius:50%;position:relative;flex:0 0 auto;display:grid;place-items:center}
.ovdonut::before{content:"";position:absolute;inset:17px;border-radius:50%;background:var(--hole)}
.ovdonut .dc{position:relative;text-align:center;z-index:1}
.ovdonut .dc b{display:block;font-family:var(--head);font-size:28px;font-weight:800;line-height:1;color:var(--bright)}
.ovdonut .dc span{font-size:11px;font-weight:700;color:var(--dim)}
.ovlegend{display:flex;flex-direction:column;gap:10px;min-width:0;flex:1}
.ovlrow{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:var(--dim)}
.ovlrow b{color:var(--bright);font-weight:800}
.ovdot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
/* tasks */
.ovtask{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1px solid var(--line);cursor:pointer}
.ovtask:last-child{border-bottom:0}
.ovtask:hover .tm b{color:var(--lime-pill)}
.ovtask .rg{flex:0 0 auto;display:grid;place-items:center}
.ovtask .tm{flex:1;min-width:0}
.ovtask .tm b{display:block;font-size:13.5px;font-weight:700;color:var(--bright);transition:.15s}
.ovtask .tm span{font-size:11.5px;font-weight:600;color:var(--dim)}
/* calendar */
.ovcal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.ovcal .cd{text-align:center;border-radius:13px;padding:8px 2px;border:1px solid transparent}
.ovcal .cd span{display:block;font-size:10px;font-weight:700;color:var(--dim2);margin-bottom:2px}
.ovcal .cd b{font-size:14px;font-weight:800;color:var(--dim)}
.ovcal .cd.today{background:linear-gradient(180deg,rgba(212,225,87,.18),rgba(76,175,125,.12));border-color:rgba(212,225,87,.4)}
.ovcal .cd.today span{color:var(--lime-pill)}
.ovcal .cd.today b{color:var(--bright)}
/* output */
.ovresult{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.ovresult .ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--tile2);border:1px solid var(--line);font-size:19px;flex:0 0 auto}
.ovresult b{display:block;font-family:var(--head);font-size:19px;font-weight:800;color:var(--bright)}
.ovresult span{font-size:11.5px;font-weight:600;color:var(--dim)}
.ovresult .ovpill{margin-left:auto}
@media(max-width:1100px){.ovg{grid-template-columns:1fr}}

/* ===== toolbar / search ===== */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;flex-wrap:wrap;flex-shrink:0}
.search{flex:1;min-width:200px;max-width:400px;display:flex;align-items:center;gap:9px;background:var(--field);border:1px solid var(--line);border-radius:14px;padding:9px 14px;transition:.2s}
.search:focus-within{border-color:var(--cyan-dim)}
.search svg{width:16px;height:16px;color:var(--txt-mute);flex-shrink:0}
.search input{flex:1;background:none;border:none;outline:none;color:var(--txt);font-family:var(--sans);font-size:14px}
.search input::placeholder{color:var(--txt-mute)}

/* ===== rows / services ===== */
.row{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px solid var(--line)}.row:last-child{border:none}
.row .ic{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:var(--tile2);color:var(--sky);flex-shrink:0}.row .ic svg{width:18px;height:18px}
.row .tx{flex:1;font-size:14px;color:var(--bright);font-weight:700}.row .tx .s{color:var(--txt-mute);font-size:11.5px;margin-top:2px;font-family:var(--mono);font-weight:400}
.av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;flex-shrink:0;font-family:var(--head);color:#0a1622;background:linear-gradient(135deg,var(--sky),var(--green))}
.live{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--green);font-family:var(--mono)}
.live .p{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}

/* ===== table (demo mtable) ===== */
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-family:var(--sans);font-weight:800;font-size:10.5px;letter-spacing:.11em;color:var(--dim2);text-transform:uppercase;padding:8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 12px;border-bottom:1px solid var(--line);color:var(--txt);vertical-align:middle;font-weight:600}
tbody tr{cursor:pointer;transition:.13s}tbody tr:hover td{background:var(--ghost)}
tbody tr:last-child td{border-bottom:0}
#memBody tr{content-visibility:auto;contain-intrinsic-size:auto 50px}
.tag{font-family:var(--sans);font-size:10.5px;letter-spacing:.3px;padding:3px 10px;border-radius:999px;font-weight:800;display:inline-flex;align-items:center;gap:6px;background:var(--tile2);color:var(--dim);border:1px solid var(--line)}
.tag.on{background:rgba(76,175,125,.2);color:var(--green);border:1px solid rgba(76,175,125,.35)}
.tag.on::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green)}
.bar{height:5px;background:var(--track);border-radius:3px;width:96px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--lime),var(--green));border-radius:3px}
.empty{padding:50px;text-align:center;color:var(--txt-mute);font-family:var(--sans);font-size:12.5px;font-weight:600}.empty svg{width:34px;height:34px;opacity:.4;margin-bottom:12px}
.muted{color:var(--txt-mute)}.tiny{font-size:11px}
.codechip{font-size:9.5px;font-weight:800;padding:3px 9px;border-radius:999px;font-family:var(--sans);white-space:nowrap;flex-shrink:0}
.codechip.done{background:rgba(76,175,125,.18);color:var(--green);border:1px solid rgba(76,175,125,.4)}
.codechip.new{background:rgba(255,201,77,.18);color:var(--amber);border:1px solid var(--amber-dim)}

/* ===== switch (demo .tg) ===== */
.sw{display:inline-block;position:relative;width:46px;height:24px;border-radius:999px;cursor:pointer;background:var(--track);border:1px solid var(--line);transition:.2s;flex-shrink:0;vertical-align:middle}
.sw .kb{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.sw.on{background:var(--green);border-color:var(--green)}
.sw.on .kb{left:24px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3)}

/* ===== charts ===== */
.rchart{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;height:208px;padding:6px 2px 0}
.rcol{flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;height:100%}
.rcol .bwrap{flex:1;width:100%;max-width:30px;border-radius:999px;background:var(--track);position:relative;overflow:hidden}
.rcol .bar{position:absolute;bottom:0;left:0;right:0;min-height:3px;border-radius:999px;background:var(--barfill,rgba(255,255,255,.92));transition:height .5s}
.rcol.today .bar{background:linear-gradient(180deg,var(--lime),var(--green))}
.rcol.today .bv{color:var(--bright)}
.rcol.today .bl{color:var(--bright)}
.rcol:hover .bar{filter:brightness(1.12)}
.rcol .bl{font-size:10.5px;color:var(--dim2);font-family:var(--sans);font-weight:700;white-space:nowrap}
.rcol .bv{font-size:11.5px;color:var(--dim);font-family:var(--sans);font-weight:700}
.rlegend{display:flex;gap:16px;font-size:11px;color:var(--txt-mute);font-family:var(--mono)}
.rlegend i{display:inline-block;width:9px;height:9px;border-radius:2px;background:var(--lime);margin-right:5px;vertical-align:middle}
.rbreak{display:flex;flex-direction:column;gap:11px;margin-top:4px}
.rbreak .row{display:flex;align-items:center;gap:11px;font-size:12px;border:none;padding:0}
.rbreak .row .nm{width:118px;color:var(--dim);flex-shrink:0;font-weight:600}
.rbreak .row .tr{flex:1;height:8px;border-radius:999px;background:var(--track);border:0;overflow:hidden}
.rbreak .row .tr i{display:block;height:100%;background:linear-gradient(90deg,var(--lime),var(--green));border-radius:999px;transition:width .5s}
.rbreak .row .vl{width:108px;text-align:right;font-family:var(--head);font-size:12px;font-weight:800;color:var(--txt);flex-shrink:0}
.rmoney{display:flex;gap:18px;flex-wrap:wrap}
.rmoney .mc{flex:1;min-width:180px;border:1px solid var(--line);border-radius:16px;padding:16px 18px;background:var(--tile);position:relative;overflow:hidden}
.rmoney .mc .l{font-size:11.5px;letter-spacing:.3px;color:var(--dim);font-weight:600}
.rmoney .mc .v{font-family:var(--head);font-size:22px;font-weight:800;margin-top:8px}
.n8nchart{display:flex;align-items:flex-end;gap:5px;height:200px;padding-top:8px}
.n8nbar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px}
.n8nbar .ntrack{flex:1;width:100%;max-width:22px;border-radius:999px;background:var(--track);position:relative;overflow:hidden}
.n8nbar i{position:absolute;bottom:0;left:0;right:0;min-height:3px;border-radius:999px;background:var(--barfill,rgba(255,255,255,.92));transition:height .45s;opacity:.82}
.n8nbar:hover i{opacity:1}
.n8nbar span{font-size:8.5px;color:var(--txt-mute);font-family:var(--mono)}

/* ===== bot control 2-col ===== */
#botCards{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
#botCards>.card{margin:0!important}
@media(max-width:1080px){#botCards{grid-template-columns:1fr}}

/* ===== event cards ===== */
.evcard{position:relative;border:1px solid var(--line);border-radius:18px;padding:16px 18px;background:var(--tile);margin-bottom:11px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;transition:.2s}
.evcard:hover{border-color:var(--line-2);background:var(--tile2)}
.evcard .ico{font-size:22px;width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;flex-shrink:0;background:var(--tile2)}
.evcard .ev-meta{flex:1;min-width:160px}
.evcard .ev-meta b{font-size:14.5px;color:var(--bright);font-weight:800}
.evcard .ev-meta .s{font-size:11px;color:var(--txt-mute);font-family:var(--mono);margin-top:3px}
.evcard .ev-clk{display:flex;align-items:center;gap:14px;flex:1;min-width:160px;cursor:pointer}
.ev-fin{width:100%;background:var(--field);border:1px solid var(--line);border-radius:14px;padding:10px 14px;color:var(--txt);font-family:var(--sans);font-size:13px;outline:none;margin-bottom:10px}
.ev-fin:focus{border-color:var(--cyan-dim)}
textarea.ev-fin{min-height:70px;resize:vertical}
.ev-tbl{max-height:300px;overflow-y:auto;margin-bottom:6px}
.ev-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.ev-row .nm{flex:1;font-size:13px}
.ev-in{width:130px;background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 12px;color:var(--txt);font-family:var(--mono);font-size:12.5px;outline:none;text-align:right}
.ev-in:focus{border-color:var(--cyan-dim)}
.bc-area{width:100%;min-height:120px;resize:vertical;background:var(--field);border:1px solid var(--line);border-radius:14px;padding:12px 16px;color:var(--txt);font-family:var(--sans);font-size:14px;line-height:1.6;outline:none}
.bc-preview{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--field);min-height:150px;display:flex;flex-direction:column;gap:8px}
.bc-area:focus{border-color:var(--cyan-dim)}

/* ===== INBOX DOCK (hidden — merged into Workspace) ===== */
.inboxdock{position:fixed;top:0;right:0;bottom:0;width:var(--ipw);z-index:12;display:none}
.idock-live{display:flex;align-items:center;gap:6px;font-size:10px;letter-spacing:1.5px;color:var(--green);font-family:var(--mono)}
.idock-live .p{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 7px var(--green)}
.idock-top{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid var(--line);flex-shrink:0}
.idock-top b{font-family:var(--head);font-size:12px;letter-spacing:.5px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--bright)}
.idock-main{flex:1;display:flex;overflow:hidden;min-height:0}
.idock-list{width:34%;min-width:130px;overflow-y:auto;border-right:1px solid var(--line)}
.idock-thread{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.idock-thread .cbody{padding:16px}

/* ===== WORKSPACE (merged console) 3-col glass — demo .ws ===== */
.cons-grid{display:grid;grid-template-columns:300px minmax(0,1fr) 360px;gap:14px;flex:1;min-height:0}
.cons-list{min-width:0;display:flex;flex-direction:column;min-height:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--tile)}
.cons-mid{display:flex;border:1px solid var(--line);border-radius:20px;overflow:hidden;min-width:0;min-height:0;background:var(--tile)}
.cons-mid .idock-thread{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.cons-right{min-width:0;display:flex;flex-direction:column;gap:14px;min-height:0;overflow-y:auto;padding-right:2px}
.cons-right .apvbox{border:1px solid var(--line);border-radius:20px;background:var(--tile);overflow:hidden;display:flex;flex-direction:column}
.cons-right .apvbox-hd{padding:12px 16px;font-family:var(--head);font-weight:800;font-size:14px;color:var(--bright);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;flex-shrink:0}
.cons-right .apvbox-hd svg{width:18px;height:18px;flex:0 0 18px}
.cons-right #custAcc{position:static;flex:none}
.cons-right .nmbox{flex:1;min-height:220px}
.cons-right .nmbox .nm-window{flex:1;overflow-y:auto}
.cw-toggle{display:flex;gap:5px;padding:12px 12px 10px;flex-shrink:0;background:var(--field);margin:10px 10px 8px;border-radius:14px;border:1px solid var(--line)}
.cw-toggle span{flex:1;text-align:center;font-size:12.5px;font-weight:800;padding:8px 0;border:0;border-radius:10px;cursor:pointer;color:var(--dim);background:transparent;transition:.15s;user-select:none}
.cw-toggle span:hover{color:var(--txt)}
.cw-toggle span.go{background:var(--tile2);color:var(--txt);box-shadow:inset 0 1px 0 var(--line-top)}
.cw-toggle span.alert:not(.go){color:var(--txt);box-shadow:inset 0 0 0 1.5px var(--lime-pill)}
.cwct{display:none;margin-left:6px;min-width:17px;height:16px;padding:0 6px;border-radius:999px;background:var(--lime-pill);color:#1f2603;font-size:10.5px;font-weight:800;line-height:16px;vertical-align:middle}
.cwct.show{display:inline-block}
.cons-chatpane{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.cons-reviewpane{display:none;flex:1;min-height:0;overflow-y:auto;padding:10px}
.cons-list.review .cons-chatpane{display:none}
.cons-list.review .cons-reviewpane{display:block}
.cons-list .idock-list{width:auto;flex:1;border-right:none;min-height:0}
/* Review master–detail (giống demo): trái = danh sách hàng đợi, giữa = bảng */
.qrow{display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid var(--line);border-radius:14px;cursor:pointer;transition:background .2s,border-color .2s;margin-bottom:9px}
.qrow:hover{background:rgba(255,255,255,.06)}
.qrow.on{background:var(--tile2,rgba(255,255,255,.14));border-color:var(--line-top,rgba(255,255,255,.34))}
.qrow .qic{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-size:16px;background:var(--tile2,rgba(255,255,255,.14));border:1px solid var(--line);flex:0 0 auto}
.qrow b{flex:1;min-width:0;font-size:13px;font-weight:800;color:var(--bright)}
.qrow .qct{flex:0 0 auto;min-width:22px;height:21px;padding:0 7px;border-radius:999px;background:var(--lime,#d4e157);color:#1f2603;font-size:11px;font-weight:800;display:grid;place-items:center}
.rvdetail{display:none;flex:1;min-height:0;flex-direction:column;overflow:hidden;padding:16px}
.cons-grid.rev .cons-mid .idock-thread{display:none}
.cons-grid.rev .cons-mid .rvdetail{display:flex}
.cons-grid.rev{grid-template-columns:300px minmax(0,1fr)}
.cons-grid.rev .cons-right{display:none}
.rvdetail .ptitle{display:flex;align-items:center;gap:11px;margin-bottom:14px;flex-shrink:0}
.rvdetail .ptitle h2{font-size:18px;font-weight:800;color:var(--bright)}
.rvdetail .chip{font-size:11px;font-weight:700;padding:3px 11px;border-radius:999px;background:var(--tile2,rgba(255,255,255,.14));border:1px solid var(--line);color:var(--txt-dim)}
.rvbody{flex:1;overflow-y:auto;min-height:0}
.rvbody .rvempty{padding:16px;opacity:.5}
.rvbody .note{color:var(--txt-dim);font-size:13.5px;line-height:1.7;padding:30px 20px;text-align:center}
.rvbody .nm-window{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start;padding:2px}
@media(max-width:980px){.rvbody .nm-window{grid-template-columns:1fr}}
.rvbody .nm-window .empty{grid-column:1/-1}
@media(max-width:1280px){.cons-grid{grid-template-columns:260px minmax(0,1fr)}.cons-right{grid-column:1/-1}}
@media(max-width:1080px){.cons-grid{display:flex;flex-direction:column;flex:none}.cons-list,.cons-right,.cons-mid{width:auto;min-width:0}.cons-mid{height:520px}.cons-list{max-height:420px}}
.cfoot .aibtn{color:var(--amber)}.cfoot .aibtn:hover{background:rgba(255,201,77,.18)}
.inboxview{flex:1;min-height:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--tile);display:flex}
.inboxview .idock-list{width:300px;flex-shrink:0}
.ibar{display:flex;gap:7px;align-items:center;padding:9px 14px;border-bottom:1px solid var(--line);flex-shrink:0;flex-wrap:wrap}
.ibar input{flex:1;min-width:120px;background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 12px;color:var(--txt);font-family:var(--mono);font-size:12px;outline:none}
.ibar input:focus{border-color:var(--cyan-dim)}
.copybtn{display:inline-grid;place-items:center;width:18px;height:18px;margin-left:6px;border:1px solid var(--line);border-radius:6px;font-size:10px;color:var(--dim);cursor:pointer;vertical-align:middle}
.copybtn:hover{background:var(--sky);color:#0a1622;border-color:var(--sky)}

/* ===== CUSTOMER WORKSPACE (members inbox 3-col) ===== */
.cwwrap{display:grid;grid-template-columns:310px 1fr 370px;flex:1;min-height:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--tile)}
.cwcol{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;border-right:1px solid var(--line)}
.cwcol:last-child{border-right:none}
.cw-lhead{padding:12px 14px;border-bottom:1px solid var(--line);flex-shrink:0}
.cw-lhead .search{max-width:none;width:100%}
.cwcol .idock-list{width:auto;flex:1;border-right:none}
#idockThread{height:100%;min-height:0}
.ci.cust{align-items:center;gap:11px;padding:11px 14px}
.ci.cust .av{width:38px;height:38px;border-radius:50%;font-size:14px;background:linear-gradient(135deg,var(--sky),var(--green));color:#0a1622}
.ci.cust .av .dot{position:absolute;top:-2px;right:-2px;width:9px;height:9px;border-radius:50%;background:var(--lime-pill);border:2px solid var(--hole)}
.ci.cust .meta .nm{font-size:13px}
.ci.cust .meta .sub{font-size:11.5px;color:var(--txt-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.ci.cust .meta .acc{font-family:var(--mono);font-size:10.5px;color:var(--amber);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw-quick{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 8px}
.cw-quick span{font-size:11.5px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;color:var(--dim);cursor:pointer;transition:.15s;white-space:nowrap;background:var(--tile2)}
.cw-quick span:hover{border-color:var(--line-2);color:var(--txt);background:var(--ghost)}
#custAcc{flex:1;overflow-y:auto;padding:18px}
.ca-hint{height:100%;min-height:160px;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--txt-mute);font-size:12.5px;font-weight:600;letter-spacing:.2px}
#custAcc .id{display:flex;align-items:center;gap:13px;margin-bottom:6px}
#custAcc .id .av{width:54px;height:54px;border-radius:50%;font-size:21px;background:linear-gradient(135deg,var(--sky),var(--green));color:#0a1622}
#custAcc .id .nm{font-size:17px;font-weight:800;font-family:var(--head);color:var(--bright)}
#custAcc .id .csub{font-size:11.5px;color:var(--txt-mute);font-family:var(--mono);margin-top:3px}
#custAcc .lvl{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;padding:3px 11px 3px 4px;border-radius:999px;background:rgba(255,201,77,.18);border:1px solid var(--amber-dim);color:var(--amber);margin-top:8px;cursor:pointer}
#custAcc .lvl b{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--amber);color:#241800;font-family:var(--mono);font-size:10px}
#custAcc .sec{font-size:10px;letter-spacing:1px;color:var(--txt-mute);font-family:var(--mono);text-transform:uppercase;margin:18px 0 9px;display:flex;align-items:center;gap:9px}
#custAcc .sec::after{content:'';flex:1;height:1px;background:var(--line)}
#custAcc .bigv{font-size:30px;font-family:var(--head);font-weight:800;letter-spacing:-1px;color:var(--lime-pill)}
#custAcc .qbtns{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px;align-items:center}
#custAcc .qbtns input{width:96px;background:var(--field);border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--txt);font-family:var(--mono);font-size:12px;outline:none}
#custAcc .qbtns input:focus{border-color:var(--cyan-dim)}
#custAcc .kv{display:flex;justify-content:space-between;font-size:12.5px;padding:7px 0;border-bottom:1px solid var(--line);font-weight:600}
#custAcc .kv .k{color:var(--dim)}#custAcc .kv .v{font-family:var(--mono);font-weight:800}
#custAcc .pend{border:1px solid var(--amber-dim);background:rgba(255,201,77,.12);border-radius:16px;padding:11px 13px;margin-bottom:9px}
#custAcc .pend .t{font-size:12.5px;font-weight:800;color:var(--amber)}
#custAcc .pend .r{margin-top:9px}
#custAcc .lvlsel{display:flex;gap:7px;margin-top:11px;align-items:center}
#custAcc select.lvldd{flex:1;background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 10px;color:var(--txt);font-family:var(--sans);font-size:12.5px;outline:none}
@media(max-width:1180px){.cwwrap{grid-template-columns:280px 1fr 330px}}

/* ===== chat list / thread ===== */
.ci{display:flex;gap:10px;padding:11px 12px;cursor:pointer;transition:.15s;align-items:center;border-radius:14px;margin:2px 6px;content-visibility:auto;contain-intrinsic-size:auto 58px}
.ci:hover{background:var(--ghost)}.ci.on{background:var(--tile2)}
.ci .av{width:36px;height:36px;font-size:14px;position:relative;border-radius:50%}
.ci .ch{position:absolute;bottom:-2px;right:-2px;width:13px;height:13px;border-radius:50%;display:grid;place-items:center;font-size:7px;font-weight:700;border:2px solid var(--hole)}
.ci .ch.tg{background:var(--sky);color:#0a1622}.ci .ch.fb{background:#2b3b50;color:#fff}
.ci .meta{flex:1;min-width:0}
.ci .meta .nm{font-size:12.5px;font-weight:800;color:var(--bright);display:flex;justify-content:space-between;gap:6px;align-items:center}
.ci .meta .nm .tm{font-size:10.5px;color:var(--dim2);font-family:var(--sans);font-weight:700;flex-shrink:0}
.ci .meta .pv,.ci .meta .sub{font-size:11.5px;color:var(--dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.ci .unread{min-width:8px;width:8px;height:8px;border-radius:50%;background:var(--lime-pill);font-size:0;color:transparent;flex-shrink:0;align-self:center}
.cthead{padding:13px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;flex-shrink:0}
.cthead .meta{flex:1;min-width:0;display:flex;align-items:baseline;gap:9px;overflow:hidden}.cthead .meta b{font-size:16px;color:var(--bright);font-weight:800;white-space:nowrap;flex-shrink:0}.cthead .meta .s{font-size:12px;color:var(--dim);font-family:var(--sans);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cthead .lvchip{font-size:11px;font-weight:800;font-family:var(--sans);padding:3px 10px;border:1px solid;border-radius:999px;white-space:nowrap;flex-shrink:0;opacity:.92}
.cbody{flex:1;overflow-y:auto;min-height:0;padding:18px;display:flex;flex-direction:column;gap:9px}
.bub{max-width:80%;padding:9px 13px;border-radius:16px;font-size:13px;font-weight:600;line-height:1.45;position:relative}
.bub.them{align-self:flex-start;background:var(--tile2);border:1px solid var(--line);border-bottom-left-radius:5px;color:var(--txt)}
.bub.me{align-self:flex-end;background:var(--lime-pill);border:0;border-bottom-right-radius:5px;color:#1f2603}
.bub.botmsg{align-self:flex-end;background:var(--lime-pill);border:0;color:#1f2603;opacity:.92}
.bub.bot{align-self:flex-end;background:var(--lime-pill);border:0;color:#1f2603}
.bub .autolbl,.bub .lbl{font-size:10px;letter-spacing:.5px;color:rgba(31,38,3,.6);font-family:var(--sans);font-weight:800;margin-bottom:3px;display:flex;align-items:center;gap:5px}
.bub .lbl svg{width:12px;height:12px}
.bub.them .autolbl{color:var(--dim)}
.bub .tm{font-size:9.5px;opacity:.55;margin-top:5px;font-family:var(--mono);text-align:right}
.bub.del{opacity:.5;font-style:italic;font-size:11.5px;color:var(--txt-mute)!important;background:transparent!important;border:1px dashed var(--line)!important}
.bub .bdel{position:absolute;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(229,115,115,.92);color:#fff;font-size:11px;opacity:0;cursor:pointer;transition:.15s;z-index:2}
.bub.me .bdel,.bub.bot .bdel,.bub.botmsg .bdel{left:-30px}.bub.them .bdel{right:-30px}
.bub:hover .bdel{opacity:.8}.bub .bdel:hover{opacity:1}
.tdiv{text-align:center;font-size:10.5px;color:var(--dim2);font-family:var(--sans);font-weight:700;margin:6px 0 2px;letter-spacing:.3px}
.cfoot{padding:12px 14px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center;flex-shrink:0;width:100%;min-width:0}
.cfoot .ai{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;cursor:pointer;color:var(--dim);transition:.2s;flex-shrink:0;background:var(--tile2)}
.cfoot .ai:hover{background:var(--ghost);color:var(--sky);border-color:var(--cyan-dim)}.cfoot .ai svg{width:16px;height:16px}
.cfoot input{flex:1;min-width:0;background:var(--field);border:1px solid var(--line);border-radius:999px;padding:11px 16px;color:var(--txt);font-family:var(--sans);font-size:13px;outline:none;transition:.2s}
.cfoot input:focus{border-color:var(--cyan-dim)}
.cfoot .send{width:40px;height:40px;border-radius:50%;background:var(--lime-pill);color:#1f2603;border:none;display:grid;place-items:center;cursor:pointer;transition:.2s;flex-shrink:0}
.cfoot .send:hover{filter:brightness(1.06)}.cfoot .send svg{width:18px;height:18px}

/* ===== MODAL / PROFILE ===== */
.modal{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:20px;background:rgba(4,10,18,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .3s}
.modal.show{opacity:1;pointer-events:auto}
.profile{width:560px;max-width:95vw;max-height:90vh;overflow-y:auto;border:1px solid var(--line-2);border-radius:24px;background:var(--slab);-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);box-shadow:var(--glass-shadow);transform:translateY(18px) scale(.97);transition:transform .38s cubic-bezier(.34,1.2,.5,1)}
.modal.show .profile{transform:none}
.pf-hero{position:relative;padding:26px 24px 20px;border-bottom:1px solid var(--line);overflow:hidden;background:linear-gradient(180deg,var(--tile),transparent)}
.pf-hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan-dim),transparent)}
.pf-x{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--txt);border:1px solid var(--line);background:var(--tile2);z-index:2;font-size:18px;line-height:1;transition:.2s}
.pf-x:hover{background:var(--ghost)}
.pf-id{display:flex;align-items:center;gap:16px;position:relative;z-index:1}
.pf-av{position:relative;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:800;font-family:var(--head);background:linear-gradient(135deg,var(--sky),var(--green));color:#0a1622;flex-shrink:0}
.pf-av svg{width:26px;height:26px;color:#0a1622}
.pf-id .nm{font-family:var(--head);font-size:20px;font-weight:800;color:var(--bright);line-height:1.15}
.pf-id .sub{font-size:11.5px;color:var(--txt-mute);font-family:var(--mono);margin-top:4px}
.pf-tier{display:flex;gap:7px;margin-top:11px;align-items:center}
.pf-lvl{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;padding:4px 12px 4px 5px;border-radius:999px;cursor:pointer;color:var(--sky);background:rgba(79,195,247,.16);border:1px solid var(--line);transition:.15s}
.pf-lvl:hover{border-color:var(--cyan-dim)}
.pf-lvl .lvn{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:var(--sky);color:#0a1622;font-family:var(--mono);font-size:10px;font-weight:700}
.pf-lvl svg{width:12px;height:12px;opacity:.55}
.pf-body{padding:20px 24px 24px}
.pf-sec{font-size:9.5px;letter-spacing:1px;color:var(--dim);text-transform:uppercase;margin:18px 0 11px;font-family:var(--mono);display:flex;align-items:center;gap:10px;font-weight:800}
.pf-sec::after{content:'';flex:1;height:1px;background:var(--line)}
.pf-line{display:flex;justify-content:space-between;font-size:12.5px;padding:8px 0;border-bottom:1px solid var(--line);gap:10px;font-weight:600}
.pf-line .k{color:var(--dim)}.pf-line .v{font-family:var(--mono);color:var(--txt);font-weight:700}
.pf-hist{margin-top:6px}.pf-hist .h{display:flex;align-items:center;gap:9px;font-size:12px;padding:7px 0;border-bottom:1px solid var(--line)}
.pf-hist .h:last-child{border-bottom:none}
.pf-hist .h .d{width:7px;height:7px;border-radius:50%;background:var(--sky);flex-shrink:0;box-shadow:0 0 6px rgba(79,195,247,.5)}
.pf-hist .h .dt{margin-left:auto;font-size:10.5px;color:var(--txt-mute);font-family:var(--mono)}
.pf-actions{display:flex;gap:9px;margin:20px 0 4px}.pf-actions .btn{flex:1;justify-content:center}
.pf-chat{margin-top:14px;display:none}.pf-chat.show{display:block;animation:fade .3s}
.pf-chat textarea{width:100%;min-height:74px;resize:vertical;background:var(--field);border:1px solid var(--line);border-radius:14px;padding:12px 15px;color:var(--txt);font-family:var(--sans);font-size:13px;outline:none}
.pf-chat textarea:focus{border-color:var(--cyan-dim)}
.pf-chat .send-row{display:flex;justify-content:space-between;align-items:center;margin-top:9px}
.pf-chat .send-row .hint{font-size:10.5px;color:var(--txt-mute);font-family:var(--mono)}
.pf-xp{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.pf-cards2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.pf-card{position:relative;border:1px solid var(--line);border-radius:16px;padding:16px 17px;background:var(--tile);transition:.18s;overflow:hidden}
.pf-card.click{cursor:pointer}.pf-card.click:hover{border-color:var(--line-2);background:var(--tile2)}
.pf-card .l{font-size:9.5px;letter-spacing:.6px;color:var(--txt-mute);text-transform:uppercase;display:flex;align-items:center;justify-content:space-between;font-weight:700}
.pf-card .l svg{width:12px;height:12px;opacity:.5}
.pf-card .v{font-family:var(--head);font-size:24px;font-weight:800;margin-top:8px;color:var(--bright)}
.pf-cards3{display:grid;grid-template-columns:1fr 1fr 1fr;margin:14px 0 6px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--tile)}
.pf-card.sm{padding:14px 10px;border:none;border-radius:0;background:transparent;text-align:center;border-right:1px solid var(--line)}
.pf-card.sm:last-child{border-right:none}
.pf-card.sm .l{font-size:8.5px;letter-spacing:.5px;justify-content:center}
.pf-card.sm .v{font-size:15px;margin-top:7px;color:var(--green)}
.pf-card .sub2{font-size:10.5px;color:var(--txt-mute);font-family:var(--mono);margin-top:9px;display:flex;align-items:center;gap:5px}
.pf-card .sub2 svg{width:11px;height:11px;opacity:.55}
.pf-edit{display:none;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 12px;padding:13px;border:1px dashed var(--line);border-radius:14px;background:var(--tile);animation:fade .25s}
.pf-edit.show{display:flex}
.pf-edit input,.pf-edit select{background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 12px;color:var(--txt);font-family:var(--mono);font-size:12.5px;outline:none}
.pf-edit input[type=number]{width:86px;text-align:center}
.pf-edit input:not([type=number]){width:100%}
.pf-edit input:focus,.pf-edit select:focus{border-color:var(--cyan-dim)}
input,textarea,select{font-family:var(--sans)}
html[data-theme] select option,body select option{background:#13202e;color:#fff}
body.theme-light select option{background:#fff;color:#16222e}
.cfmbox{width:340px;max-width:92vw;background:var(--slab);-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);border:1px solid var(--line-2);border-radius:20px;padding:24px;box-shadow:var(--glass-shadow);transform:translateY(14px) scale(.97);transition:transform .3s cubic-bezier(.34,1.2,.5,1)}
.modal.show .cfmbox{transform:none}
.cfmmsg{font-size:14.5px;line-height:1.5;margin-bottom:18px;text-align:center}
.cfmrow{display:flex;gap:10px}.cfmrow .btn{flex:1;justify-content:center}
.toolbar .tiny.muted{font-family:var(--mono)}
.apv-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:1180px){.apv-grid{grid-template-columns:1fr}}
.apv-sec{margin-bottom:0;border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:var(--tile)}
/* ===== Anti-spam (Combot-style) ===== */
.as-card{padding:16px 16px 14px}
.as-hd{display:flex;align-items:center;gap:12px;margin-bottom:2px}
.as-hd .ic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:18px;background:linear-gradient(150deg,rgba(79,195,247,.22),rgba(79,195,247,.06));border:1px solid var(--line);flex-shrink:0}
.as-hd .ti{flex:1;min-width:0}
.as-hd .ti h3{font-family:var(--head);font-size:14.5px;font-weight:800;color:var(--bright);letter-spacing:.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.as-hd .ti .cid{font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.as-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0 6px}
.as-stat .t{background:var(--field);border:1px solid var(--line-soft);border-radius:14px;padding:10px 8px;text-align:center}
.as-stat .t b{display:block;font-family:var(--mono);font-size:20px;font-weight:800;color:var(--txt);line-height:1.1}
.as-stat .t b.ok{color:var(--green)}.as-stat .t b.hot{color:var(--red)}
.as-stat .t span{font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.as-sec{font-family:var(--mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--dim);font-weight:800;margin:18px 0 10px;display:flex;align-items:center;gap:9px}
.as-sec::after{content:'';flex:1;height:1px;background:var(--line)}
.as-row{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:13px;background:var(--tile);border:1px solid var(--line-soft);margin-bottom:8px;transition:.15s}
.as-row:hover{border-color:var(--line)}
.as-row .ri{font-size:15px;width:20px;text-align:center;flex-shrink:0}
.as-row .rt{flex:1;min-width:0}
.as-row .rt b{display:block;font-size:12.5px;font-weight:700;color:var(--txt)}
.as-row .rt span{font-size:10.5px;color:var(--muted);line-height:1.3}
.as-row .rx{flex-shrink:0;display:flex;align-items:center;gap:7px}
.as-mini{width:50px;background:var(--field);border:1px solid var(--line);border-radius:9px;padding:5px 7px;color:var(--txt);font-family:var(--mono);font-size:12px;text-align:center;outline:none}
.as-mini:focus{border-color:var(--cyan-dim)}
.as-grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.as-grid2 .as-row{margin-bottom:0}
@media(max-width:560px){.as-grid2{grid-template-columns:1fr}}
/* iOS switch */
.asw{position:relative;display:inline-block;width:40px;height:23px;flex-shrink:0}
.asw input{opacity:0;width:0;height:0;position:absolute}
.asw .sl{position:absolute;inset:0;background:var(--track);border:1px solid var(--line);border-radius:999px;transition:.18s;cursor:pointer}
.asw .sl::before{content:'';position:absolute;height:17px;width:17px;left:3px;top:2px;background:#fff;border-radius:50%;transition:.2s cubic-bezier(.34,1.4,.5,1);box-shadow:0 1px 4px rgba(0,0,0,.45)}
.asw input:checked+.sl{background:var(--lime-pill);border-color:transparent}
.asw input:checked+.sl::before{transform:translateX(17px);background:#1f2603}
.asw.big{width:46px;height:26px}.asw.big .sl::before{height:20px;width:20px}.asw.big input:checked+.sl::before{transform:translateX(20px)}
.as-body{transition:opacity .2s}
.as-body.off{opacity:.4;pointer-events:none;filter:saturate(.4)}
/* chips */
.as-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:9px}
.as-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 7px 5px 11px;border-radius:999px;background:var(--tile2);border:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--txt)}
.as-chip.block{border-color:rgba(229,115,115,.4);background:rgba(229,115,115,.12)}
.as-chip.allow{border-color:rgba(76,175,125,.4);background:rgba(76,175,125,.14)}
.as-chip .x{cursor:pointer;color:var(--muted);font-weight:800;font-size:13px;line-height:1;width:16px;height:16px;display:grid;place-items:center;border-radius:50%;transition:.15s}
.as-chip .x:hover{background:rgba(229,115,115,.25);color:var(--red)}
.as-chip.empty{opacity:.5;font-family:var(--sans);border-style:dashed}
.as-add{display:flex;gap:7px;align-items:center}
.as-add input{flex:1;min-width:0;background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 11px;color:var(--txt);font-size:12.5px;outline:none}
.as-add input:focus{border-color:var(--cyan-dim)}
.as-add select{background:var(--field);border:1px solid var(--line);border-radius:11px;padding:7px 9px;color:var(--txt);font-size:12px;outline:none}
.as-add .rxlab{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted);white-space:nowrap}
.as-warn{margin-bottom:10px}
.as-warn label{display:block;font-size:10.5px;color:var(--muted);margin-bottom:4px;font-weight:600}
.as-warn input{width:100%;background:var(--field);border:1px solid var(--line);border-radius:11px;padding:8px 12px;color:var(--txt);font-size:12.5px;outline:none}
.as-warn input:focus{border-color:var(--cyan-dim)}
.as-log{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.as-log:last-child{border-bottom:none}
.as-log .lt{flex:1;min-width:0}
.as-log .lt b{font-size:12px;font-weight:700;color:var(--txt)}
.as-log .lt .meta{font-size:10px;color:var(--muted);font-family:var(--mono)}
.as-log .lt .cnt{font-size:10.5px;color:var(--txt-mute);font-family:var(--mono);display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.as-log .la{display:flex;gap:6px;flex-shrink:0}
.as-save{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:13px;border-top:1px solid var(--line)}
.as-save .q.go{padding:9px 18px;font-size:13px}
/* ===== Approvals split ===== */
.appr-split{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:1180px){.appr-split{grid-template-columns:1fr}}
.appr-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.nm-count{font-family:var(--sans);font-size:11.5px;background:var(--lime-pill);color:#1f2603;border-radius:999px;padding:1px 9px;font-weight:800}
.nm-count:empty{display:none}
.nm-window{display:flex;flex-direction:column;gap:10px}
.nm-window .empty{padding:18px}
.nm-card{background:var(--tile);border:1px solid var(--line);border-radius:16px;padding:14px 16px;position:relative}
.nm-card::before{display:none}
.nm-card .nm-hd{display:flex;align-items:center;gap:10px;margin-bottom:11px}
.nm-card .nm-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-family:var(--head);color:#0a1622;flex-shrink:0;background:linear-gradient(135deg,#e57373,var(--amber))}
.nm-card .nm-meta{flex:1;min-width:0;display:flex;align-items:baseline;gap:8px}
.nm-card .nm-nm{font-weight:800;font-size:15.5px;line-height:1.2;color:var(--bright);white-space:nowrap;flex-shrink:0}
.nm-card .nm-tg{font-size:12px;color:var(--dim);font-family:var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.nm-card .nm-when{font-size:10.5px;color:var(--txt-mute);font-family:var(--mono);white-space:nowrap;flex-shrink:0}
.nm-card .nm-ai{display:flex;gap:6px;align-items:flex-start;margin:0 0 9px;padding:7px 10px;border-left:2px solid var(--cyan-dim);background:rgba(79,195,247,.1);border-radius:10px;font-size:11.5px;line-height:1.35;color:var(--dim)}
.nm-card .nm-ai b{color:var(--sky);font-weight:800;flex-shrink:0}
.nm-card .nm-ip{margin:0 0 9px;padding:6px 10px;border-radius:10px;background:var(--field);border:1px solid var(--line);font-size:12px;font-family:var(--mono);color:var(--dim)}
.nm-card .nm-ip.dim{opacity:.65;font-family:inherit}
.nm-card .nm-risk{display:flex;flex-direction:column;gap:4px;margin:0 0 11px;padding:11px 13px;border-radius:16px;font-size:12px;line-height:1.4;border:1px solid}
.nm-card .nm-risk b{font-size:13px}
.nm-card .nm-risk span{color:var(--dim)}
.nm-card .nm-risk.lo{background:rgba(76,175,125,.16);border-color:rgba(76,175,125,.4)}
.nm-card .nm-risk.lo b{color:var(--green)}
.nm-card .nm-risk.mid{background:rgba(255,201,77,.16);border-color:var(--amber-dim)}
.nm-card .nm-risk.mid b{color:var(--amber)}
.nm-card .nm-risk.hi{background:rgba(229,80,80,.16);border-color:rgba(229,80,80,.4)}
.nm-card .nm-risk.hi b{color:var(--red)}
.nm-card .nm-risk.hi span{color:var(--red)}
.nm-uname{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 11px;font-size:12.5px;color:var(--dim)}
.nm-uname .acct{font-family:var(--mono);font-weight:800;color:var(--amber)}
.nm-badbtn{border:1px solid var(--line);background:var(--tile2);color:var(--dim);border-radius:999px;padding:3px 10px;font-size:11px;cursor:pointer;font-weight:700;transition:.15s}
.nm-badbtn:hover{border-color:var(--cyan-dim);color:var(--txt)}
.nm-badbtn.on{background:rgba(229,115,115,.16);color:var(--red);border-color:rgba(229,115,115,.4)}
.nm-verify{font-size:12px;color:var(--txt-mute);margin-bottom:11px;font-family:var(--mono)}
.nm-verify b{color:var(--green)}.nm-verify .bad{color:var(--red)}
.nm-acts{display:flex;flex-wrap:wrap;gap:7px}
.nm-acts .btn{flex:0 1 auto;padding:7px 12px;border-radius:999px;font-size:12px}
.nm-state{font-size:12px;color:var(--dim);background:var(--field);border:1px solid var(--line);border-radius:12px;padding:9px 12px;font-family:var(--mono)}
.nm-qrimg{width:100%;max-width:240px;border-radius:13px;border:1px solid var(--line);margin:4px 0 10px;display:block}
.acc{font-family:var(--mono);font-size:12.5px;color:var(--amber);letter-spacing:.3px}
.pill{font-family:var(--sans);font-size:10.5px;letter-spacing:.3px;padding:4px 11px;border-radius:999px;font-weight:800;display:inline-flex;align-items:center;gap:6px;background:var(--lime-pill);color:#1f2603}
.pill-run{background:rgba(76,175,125,.16);color:var(--green);border:1px solid rgba(76,175,125,.4)}
.pill-run i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green)}

/* ===== Theme toggle (topbar) ===== */
.themesw{position:relative;width:58px;height:28px;border-radius:999px;cursor:pointer;background:var(--tile);border:1px solid var(--line);flex-shrink:0}
.themesw .tk{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber);transition:left .26s cubic-bezier(.5,0,.2,1);z-index:1}
.themesw.on .tk{left:32px;background:var(--sky);box-shadow:0 0 8px var(--sky)}
.themesw .ti{position:absolute;top:7px;width:13px;height:13px;z-index:2;color:var(--txt-mute);transition:color .2s}
.themesw .ti svg{width:13px;height:13px;display:block}
.themesw .ti.sun{left:8px}.themesw .ti.moon{right:8px}
.themesw:not(.on) .ti.sun{color:#0a1622}
.themesw.on .ti.moon{color:#0a1622}
/* ===== Inbox segmented (Mới/Cũ) ===== */
.cw-seg{display:flex;gap:5px;margin-bottom:9px;background:var(--field);border:1px solid var(--line);border-radius:14px;padding:4px}
.cw-seg span{flex:1;text-align:center;font-size:12px;font-weight:800;padding:7px 0;border:0;border-radius:10px;cursor:pointer;color:var(--dim);background:transparent;transition:.15s;user-select:none}
.cw-seg span:hover{color:var(--txt)}
.cw-seg span.go{background:var(--tile2);color:var(--txt);box-shadow:inset 0 1px 0 var(--line-top)}
.cw-seg .segc{display:none;margin-left:6px;min-width:17px;padding:0 5px;height:16px;line-height:16px;border-radius:999px;background:var(--lime-pill);color:#1f2603;font-size:10px;font-weight:800;font-family:var(--sans);vertical-align:middle}
.cw-seg .segc.show{display:inline-block}
.cw-seg span.alert{color:var(--amber)}
.ci.esc{box-shadow:inset 4px 0 0 #ff5a5a;background:rgba(255,90,90,.09)}
.ci.esc:hover{background:rgba(255,90,90,.15)}
.ci.botl{box-shadow:inset 4px 0 0 #e0a23c;background:rgba(224,162,60,.09)}
.ci.botl:hover{background:rgba(224,162,60,.15)}
.todo-total{padding:14px 18px;font-size:15px;color:var(--txt-mute)}
.todo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;padding:6px 18px 24px}
.kb-trow{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:11px;cursor:pointer;border:1px solid transparent;transition:.12s}
.kb-trow:hover{background:var(--ghost)}
.kb-trow.on{background:var(--tile2);border-color:var(--line)}
.kb-flag{font-size:14px;opacity:.28;cursor:pointer;padding:2px;border-radius:6px;filter:grayscale(1)}
.kb-flag.on{opacity:1;filter:none;background:var(--field)}
.kb-ic{font-size:12px;color:var(--txt-mute);cursor:pointer;padding:2px 5px;border-radius:6px}
.kb-ic:hover{color:var(--txt);background:var(--ghost)}
.todo-card{position:relative;cursor:pointer;border-radius:18px;padding:18px;background:var(--tile,rgba(255,255,255,.05));border:1px solid var(--line-top,rgba(255,255,255,.08));transition:transform .12s,background .12s}
.todo-card:hover{transform:translateY(-2px);background:rgba(255,255,255,.09)}
.todo-ic{font-size:26px;line-height:1}
.todo-n{font-size:34px;font-weight:800;color:var(--bright);margin:6px 0 2px}
.todo-lb{font-size:13px;color:var(--txt-mute)}
.todo-go{position:absolute;top:16px;right:16px;font-size:12px;color:var(--green,#34C759);font-weight:700}

/* ===== MOBILE: header nav scrolls horizontally ===== */
@media(max-width:860px){
  .topbar{top:8px;left:8px;right:8px;height:64px;padding:0 8px;border-radius:18px;gap:6px}
  .brand{padding:0 6px 0 2px;margin-right:0;border-right:none}
  .brand-txt{display:none}
  .nav{justify-content:flex-start;gap:2px}
  .nav-item{padding:6px 9px}
  .nav-item .ico,.nav-item .ico img{width:28px;height:28px;flex:0 0 28px}
  .nav-item .nlbl{font-size:9.5px}
  main,body.app main{top:80px!important;left:8px!important;right:8px!important;bottom:8px!important}
  main>.inner{top:0;border-radius:22px;padding:0}
  .page{padding:16px 14px 24px}
  .cons-grid{display:flex;flex-direction:column}
  .clock{display:none}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
}
