/* IRROOM admin 1.1.3 — same "lagoon" theme as the app: turquoise, green and yellow, solid colours, soft glow, drifting lines */
@font-face{font-family:"Vazirmatn";src:url("/fonts/Vazirmatn-wght.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{
  --teal:#2dd4bf; --saffron-c:#f5b544; --rose:#f0a48c; --sky:#60a5fa; --emerald:#34d399; --violet:#a78bfa; --steel:#94a3b8;
  --green:var(--emerald); --yellow:var(--saffron-c); --red:#f87171;
  --sec:var(--teal);
  --pink:var(--sec); --purple:var(--sec); --brown:var(--saffron-c); --amber:var(--saffron-c);
  --bg:#0c1c27; --bg2:#132a37; --text:#edf5f7; --muted:#9fb7c0; --faint:#6a8792;
  --glass:rgba(19,42,55,.86); --glass-2:rgba(255,255,255,.07); --stroke:rgba(255,255,255,.09); --stroke-2:rgba(255,255,255,.18);
  --accent:var(--sec); --accent-ink:#0b1a24; --accent-soft:color-mix(in srgb,var(--sec) 15%, transparent);
  --shadow:0 18px 50px rgba(1,8,14,.5);
  --glow-p:0 0 0 1px color-mix(in srgb,var(--sec) 40%, transparent),0 0 20px color-mix(in srgb,var(--sec) 22%, transparent);
  --font:"Vazirmatn","Segoe UI",Tahoma,system-ui,sans-serif; color-scheme:dark;
  --firuzeh:var(--emerald); --saffron:var(--saffron-c); --anar:var(--red); --ok:var(--emerald);
}
/* each part of the panel has its own colour */
html[data-sec="dash"]{--sec:var(--teal)}
html[data-sec="users"]{--sec:var(--sky)}
html[data-sec="market"]{--sec:var(--rose)}
html[data-sec="finance"]{--sec:var(--saffron-c)}
html[data-sec="content"]{--sec:var(--violet)}
html[data-sec="ai"]{--sec:var(--emerald)}
html[data-sec="system"]{--sec:var(--steel)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14.5px;line-height:1.7;overflow-x:clip}
body{background:transparent}
button,input,textarea,select{font:inherit;color:inherit}
a{color:var(--pink);text-decoration:none}
:focus-visible{outline:2px solid var(--pink);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}
::selection{background:color-mix(in srgb,var(--pink) 40%, transparent)}
select option,select optgroup{background:var(--bg2);color:var(--text)}
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--purple) 50%, transparent) transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--purple) 45%, transparent);border-radius:99px}
::-webkit-scrollbar-track{background:transparent}
.sky{position:fixed;inset:0;z-index:-1;overflow:hidden;background:var(--bg);pointer-events:none}
.sky::before{content:"";position:absolute;inset:0;background:url("/img/sky.svg?v=3.6.0") center 40%/cover no-repeat;opacity:.75}
.ic{width:18px;height:18px;flex:none;display:inline-block;vertical-align:middle}

.layout{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;padding:20px 12px;background:rgba(12,28,39,.92);border-inline-end:1px solid var(--stroke);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:850;font-size:18px;padding:0 10px 18px;letter-spacing:.4px}
.brand img{width:34px;height:34px;border-radius:10px;box-shadow:0 0 0 1px var(--stroke-2),0 0 18px color-mix(in srgb,var(--pink) 45%, transparent)}
.brand small{font-weight:500;color:var(--faint);font-size:12px}
.sidebar .grp{margin:16px 10px 4px;font-size:11.5px;color:var(--faint);letter-spacing:.5px}
.sidebar a{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;color:var(--muted);position:relative;transition:background .15s,color .15s}
.sidebar a .ic{color:var(--faint)}
.sidebar a:hover{background:var(--glass-2);color:var(--text)}
.sidebar a.on{background:var(--accent-soft);color:var(--text);font-weight:650;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--purple) 35%, transparent)}
.sidebar a.on .ic{color:var(--pink);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--pink) 70%, transparent))}
.sidebar a .n{margin-inline-start:auto;background:var(--pink);color:#fff;border-radius:99px;padding:0 7px;font-size:11px;box-shadow:0 0 10px color-mix(in srgb,var(--pink) 60%, transparent)}
.content{padding:22px 26px 60px;min-width:0}
.head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.head h1{font-size:23px;margin:0;font-weight:850;color:var(--text)}
.head h1::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal);margin-inline-end:10px;vertical-align:middle}
@media (max-width:900px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:fixed;inset-block:0;inset-inline-start:0;width:264px;z-index:60;transform:translateX(110%);transition:transform .25s;background:var(--bg)}
  [dir="ltr"] .sidebar{transform:translateX(-110%)}
  .sidebar.open{transform:none}
  .content{padding:16px}
}
.card{position:relative;background:var(--glass);border:1px solid var(--stroke);border-radius:20px;padding:16px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.card h3{margin:0 0 10px;font-size:15px}
.grid{display:grid;gap:14px}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:1100px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g4,.g3,.g2{grid-template-columns:1fr}}
/* stat tiles with a neon edge per tone */
.stat{overflow:hidden}
.stat::before{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:var(--tone,var(--purple));box-shadow:0 0 12px var(--tone,var(--purple))}
.stat .v{font-size:25px;font-weight:850;line-height:1.3}
.stat .l{color:var(--muted);font-size:12.5px}
.stat .s{color:var(--faint);font-size:12px}
.tone-teal{--tone:var(--teal)} .tone-yellow{--tone:var(--yellow)} .tone-pink{--tone:var(--pink)} .tone-purple{--tone:var(--purple)} .tone-brown{--tone:var(--brown)} .tone-green{--tone:var(--green)} .tone-amber{--tone:var(--amber)} .tone-red{--tone:var(--red)}
.num{font-variant-numeric:tabular-nums;unicode-bidi:plaintext}
.muted{color:var(--muted)} .faint{color:var(--faint)} .small{font-size:12.5px}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.grow{flex:1;min-width:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 14px;border-radius:12px;border:1px solid var(--stroke);background:var(--glass-2);cursor:pointer;font-weight:650;white-space:nowrap;transition:box-shadow .2s,border-color .2s,transform .1s}
.btn:hover{border-color:var(--stroke-2)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--teal);color:var(--accent-ink);border-color:transparent;box-shadow:0 6px 22px color-mix(in srgb,var(--pink) 30%, transparent)}
.btn.primary:hover{box-shadow:0 0 26px color-mix(in srgb,var(--pink) 50%, transparent)}
.btn.green{background:color-mix(in srgb,var(--green) 16%, transparent);color:var(--green);border-color:color-mix(in srgb,var(--green) 40%, transparent)}
.btn.warn{background:color-mix(in srgb,var(--amber) 18%, transparent);border-color:color-mix(in srgb,var(--amber) 45%, transparent)}
.btn.danger{background:color-mix(in srgb,var(--red) 16%, transparent);color:var(--red);border-color:color-mix(in srgb,var(--red) 40%, transparent)}
.btn.sm{min-height:30px;padding:0 10px;font-size:13px;border-radius:10px}
.btn[disabled]{opacity:.5;pointer-events:none}
.input,select,textarea{width:100%;min-height:40px;padding:8px 12px;border-radius:12px;border:1px solid var(--stroke);background:rgba(255,255,255,.05);outline:none;color:var(--text)}
select{appearance:none;-webkit-appearance:none;padding-inline-end:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2389a9ad' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center;background-size:12px 8px}
[dir="ltr"] select{background-position:right 12px center}
.input:focus,select:focus,textarea:focus{border-color:var(--purple);box-shadow:var(--glow-p)}
textarea{min-height:90px;resize:vertical}
label.f{display:block}
label.f>span{display:block;font-size:12.5px;color:var(--saffron-c);font-weight:650;margin:0 2px 4px}
label.f small{display:block;color:var(--faint);font-size:11.5px;margin-top:3px}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--pink)}
.tbl-wrap{overflow-x:auto;border-radius:16px;border:1px solid var(--stroke);background:var(--glass)}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th,td{padding:9px 12px;text-align:start;border-bottom:1px solid var(--stroke);white-space:nowrap}
th{font-weight:650;color:var(--muted);background:rgba(18,44,52,.92);position:sticky;top:0}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:color-mix(in srgb,var(--purple) 8%, transparent)}
tr.click{cursor:pointer}
.badge{display:inline-block;padding:1px 9px;border-radius:99px;font-size:11.5px;font-weight:700;background:var(--glass-2);color:var(--muted)}
.badge.ok{background:color-mix(in srgb,var(--green) 16%, transparent);color:var(--green)}
.badge.warn{background:color-mix(in srgb,var(--amber) 18%, transparent);color:var(--amber)}
.badge.bad{background:color-mix(in srgb,var(--red) 18%, transparent);color:var(--red)}
.badge.info{background:color-mix(in srgb,var(--pink) 16%, transparent);color:var(--pink)}
.badge.brown{background:color-mix(in srgb,var(--brown) 22%, transparent);color:var(--brown)}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.tabs button{padding:6px 14px;border-radius:99px;border:1px solid var(--stroke);background:var(--glass);cursor:pointer;color:var(--muted)}
.tabs button.on{background:var(--teal);color:var(--accent-ink);border-color:transparent;box-shadow:0 0 16px color-mix(in srgb,var(--pink) 35%, transparent)}
.pager{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:12px}
/* charts */
.chart{width:100%;height:160px;display:block;overflow:visible;direction:ltr}
.chart .bar{fill:var(--teal);opacity:.85}
.chart .bar.b2{fill:var(--green)}
.chart .bar.b3{fill:var(--brown)}
.chart .bar:hover{opacity:1;filter:drop-shadow(0 0 6px var(--pink))}
.chart .line{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.chart .grid{stroke:var(--stroke);stroke-dasharray:3 4}
.chart text{fill:var(--faint);font-size:10px;font-family:var(--font)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:5px;vertical-align:-1px}
.meter{height:10px;border-radius:99px;background:var(--glass-2);overflow:hidden;margin:8px 0 4px}
.meter i{display:block;height:100%;border-radius:99px;background:var(--teal);box-shadow:0 0 12px color-mix(in srgb,var(--pink) 40%, transparent)}
.meter.warn i{background:var(--yellow);box-shadow:0 0 10px rgba(250,204,21,.5)}
.drawer{position:fixed;inset-block:0;inset-inline-end:0;width:min(780px,100%);z-index:70;overflow-y:auto;background:color-mix(in srgb,var(--bg) 92%, transparent);border-inline-start:1px solid var(--stroke-2);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);box-shadow:var(--shadow);padding:20px;animation:slide .22s ease}
@keyframes slide{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
.shade{position:fixed;inset:0;z-index:65;background:rgba(5,2,12,.55)}
.modal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:rgba(5,2,12,.6);padding:16px;backdrop-filter:blur(6px)}
.modal>.box{width:min(540px,100%);max-height:90vh;overflow:auto;background:var(--bg2);border:1px solid var(--stroke-2);border-radius:22px;padding:20px;box-shadow:var(--shadow),var(--glow-p)}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;padding:10px 18px;border-radius:14px;background:var(--bg2);border:1px solid color-mix(in srgb,var(--green) 45%, transparent);box-shadow:var(--shadow)}
.toast.err{border-color:var(--red)}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 14px;font-size:13.5px}
.kv dt{color:var(--muted)} .kv dd{margin:0;overflow-wrap:anywhere}
.thread .m{padding:10px 12px;border-radius:14px;margin:8px 0;max-width:85%;white-space:pre-line}
.thread .m.user{background:var(--glass-2)}
.thread .m.admin{background:color-mix(in srgb,var(--purple) 18%, transparent);border:1px solid color-mix(in srgb,var(--purple) 35%, transparent);margin-inline-start:auto}
.files{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;white-space:normal}
.file{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:10px;background:var(--glass-2);border:1px solid var(--stroke);font-size:12.5px;cursor:pointer;color:var(--text)}
.file.gone{opacity:.5;text-decoration:line-through;cursor:default}
.thumb{width:120px;height:90px;object-fit:cover;border-radius:10px;border:1px solid var(--stroke);cursor:pointer;background:var(--glass)}
.logbox{direction:ltr;text-align:left;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:rgba(0,0,0,.4);border-radius:12px;padding:12px;max-height:520px;overflow:auto;white-space:pre-wrap;word-break:break-all}
.steps li{margin:4px 0}
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login .card{width:min(400px,100%);padding:28px;box-shadow:var(--glow-p)}
.login .logo{width:200px;height:200px;border-radius:22px;margin:0 auto 10px;display:block;box-shadow:0 0 40px color-mix(in srgb,var(--pink) 40%, transparent)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--faint)}
.dot.ok{background:var(--green);box-shadow:0 0 8px var(--green)} .dot.bad{background:var(--red);box-shadow:0 0 8px var(--red)} .dot.warn{background:var(--amber)}
.sec{margin-top:22px}
.sec>h2{font-size:16px;margin:0 0 10px}
.qr{background:#fff;padding:8px;border-radius:12px;width:200px}
.qr svg{width:100%;height:auto;display:block}
.btn.menu-btn{display:none}
@media (max-width:900px){.btn.menu-btn{display:inline-flex}}
.tip{padding:10px 12px;border-radius:12px;margin-top:8px;font-size:13px;background:var(--glass-2);border:1px solid var(--stroke)}
.tip.ok{border-color:color-mix(in srgb,var(--green) 40%, transparent)} .tip.warn{border-color:color-mix(in srgb,var(--amber) 50%, transparent)} .tip.bad{border-color:color-mix(in srgb,var(--red) 55%, transparent)}
.pollopt{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:13px}
.pollopt .meter{flex:1;margin:0}

/* accordion sidebar */
.nav-group{margin-top:4px}
.nav-group>button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:12px;border:0;background:none;color:var(--muted);cursor:pointer;font-weight:650;text-align:start}
.nav-group>button:hover{background:var(--glass-2);color:var(--text)}
.nav-group>button .dot{width:9px;height:9px;border-radius:50%;background:var(--gc);box-shadow:0 0 8px var(--gc);flex:none}
.nav-group>button .chev{margin-inline-start:auto;transition:transform .2s;color:var(--faint)}
.nav-group.open>button{color:var(--text)}
.nav-group.open>button .chev{transform:rotate(90deg)}
[dir="rtl"] .nav-group.open>button .chev{transform:rotate(-90deg)}
.nav-group .items{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}
.nav-group.open .items{grid-template-rows:1fr}
.nav-group .items>div{overflow:hidden;padding-inline-start:10px}
.nav-group .items a{font-size:13.5px}
.nav-group .items a.on{background:color-mix(in srgb,var(--gc) 15%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gc) 35%, transparent)}
.nav-group .items a.on .ic{color:var(--gc);filter:none}
.nav-group[data-g="dash"]{--gc:var(--teal)} .nav-group[data-g="users"]{--gc:var(--sky)} .nav-group[data-g="market"]{--gc:var(--rose)}
.nav-group[data-g="finance"]{--gc:var(--saffron-c)} .nav-group[data-g="content"]{--gc:var(--violet)} .nav-group[data-g="ai"]{--gc:var(--emerald)} .nav-group[data-g="system"]{--gc:var(--steel)}
.head h1::before{background:var(--sec);box-shadow:0 0 10px var(--sec)}
.btn.primary{background:var(--sec)!important;color:var(--accent-ink)!important}
.tabs button.on{background:var(--sec)!important;color:var(--accent-ink)!important}
.stat::before{background:var(--tone,var(--sec))}
.tone-teal{--tone:var(--sec)}
.chart .bar{fill:var(--sec)}
.brand-box{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}
.brand-box .pv{width:120px;height:120px;border-radius:18px;background:var(--glass-2);border:1px solid var(--stroke);display:grid;place-items:center;overflow:hidden}
.brand-box .pv img{width:100%;height:100%;object-fit:contain}

/* 1.2.1: glowing side strokes like the app, tinted menu groups, phone layout */
.stat{border-inline-start:3px solid var(--tone,var(--sec))!important;box-shadow:-1px 0 14px -6px var(--tone,var(--sec)),inset 0 1px 0 rgba(255,255,255,.05)}
[dir="rtl"] .stat{box-shadow:1px 0 14px -6px var(--tone,var(--sec)),inset 0 1px 0 rgba(255,255,255,.05)}
.stat::before{display:none}
.nav-group{border-radius:14px;margin-top:6px;border-inline-start:3px solid color-mix(in srgb,var(--gc) 55%, transparent);transition:background .2s}
.nav-group:hover{background:color-mix(in srgb,var(--gc) 6%, transparent)}
.nav-group.open{background:color-mix(in srgb,var(--gc) 11%, transparent);border-inline-start-color:var(--gc);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gc) 22%, transparent)}
.nav-group>button .ic,.nav-group>a .ic{color:var(--gc)}
.nav-group .dot{display:none}
.nav-group>a.on{background:transparent;box-shadow:none}
.nav-group:has(>a.on){background:color-mix(in srgb,var(--gc) 11%, transparent);border-inline-start-color:var(--gc)}
.nav-group .items a.on{background:color-mix(in srgb,var(--gc) 20%, transparent)}
@media (max-width:700px){
  .content{padding:12px 12px 40px}
  .head h1{font-size:19px}
  .g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  .g2{grid-template-columns:1fr!important}
  .stat{padding:12px}
  .stat .v{font-size:19px;overflow-wrap:anywhere}
  .stat .s{font-size:11px}
  .card{padding:13px;border-radius:16px}
  .tbl-wrap{border:0;background:none;overflow:visible}
  .tbl-wrap table,.tbl-wrap tbody,.tbl-wrap tr,.tbl-wrap td{display:block;width:100%}
  .tbl-wrap thead{display:none}
  .tbl-wrap tr{background:var(--glass);border:1px solid var(--stroke);border-radius:14px;margin-bottom:10px;padding:8px 12px}
  .tbl-wrap td{border:0;padding:4px 0;white-space:normal;display:flex;gap:10px;justify-content:space-between;align-items:center}
  .tbl-wrap td::before{content:attr(data-l);color:var(--faint);font-size:12px;flex:none}
  .tbl-wrap td[data-l=""]::before{display:none}
  .drawer{padding:14px}
  .kv{grid-template-columns:110px 1fr}
  .tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .tabs button{flex:none}
  .modal>.box{padding:16px}
  .row>select,.row>.input{min-width:0}
}

@media (max-width:900px){.sidebar.open{box-shadow:0 0 0 100vmax rgba(3,10,16,.55),var(--shadow)}}

/* ---- 1.4: listing / explore cards (same layout on desktop and phone) ---- */
.tabs button{white-space:nowrap;flex:none}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
.lcard{display:flex;gap:12px;align-items:flex-start;text-align:start;cursor:pointer;color:var(--text);font:inherit;width:100%;margin:0}
.lcard:hover{border-color:var(--sec,var(--teal))}
.lph{flex:none;width:84px;height:64px;border-radius:10px;overflow:hidden;display:grid;place-items:center;background:var(--glass-2,rgba(255,255,255,.06));color:var(--faint)}
.lph img{width:100%;height:100%;object-fit:cover}
.lbd{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.lbd b{overflow-wrap:anywhere}
@media (max-width:700px){.lgrid{grid-template-columns:1fr}.lph{width:72px;height:56px}}

/* ---- 1.5: group overview (hub) ---- */
.hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.hub-card{display:flex;gap:14px;align-items:flex-start;color:var(--text);text-decoration:none;transition:border-color .15s}
.hub-card:hover{border-color:var(--sec,var(--teal))}
.hub-ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:var(--sec,var(--teal));
  background:color-mix(in srgb,var(--sec,var(--teal)) 14%,transparent);border:1px solid color-mix(in srgb,var(--sec,var(--teal)) 35%,transparent)}
.hub-ic .ic{width:24px;height:24px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.kpi{display:flex;flex-direction:column;gap:4px;margin:0}.kpi b{font-size:22px}
/* ---- 1.8: compact dashboard tiles + map of every section ---- */
.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1300px){.g6{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.g6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.g6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stat.mini{padding:10px 12px}
.stat.mini .v{font-size:18px}.stat.mini .l{font-size:11.5px}.stat.mini .s{font-size:10.5px;line-height:1.6}
.menumap{display:flex;flex-direction:column;gap:18px}
.mm-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:17px}
.mm-title i{width:8px;height:8px;border-radius:50%;background:var(--sec);box-shadow:0 0 10px var(--sec)}
.mm-group .hub-ic{background:color-mix(in srgb,var(--sec) 14%,transparent);border:1px solid color-mix(in srgb,var(--sec) 35%,transparent);color:var(--sec)}
.mm-group .hub-card{padding:12px 14px}
.mm-group .hub-card:hover{border-color:var(--sec)}
@media (max-width:640px){.mm-group .hub{grid-template-columns:1fr 1fr;gap:8px}.mm-group .hub-card{flex-direction:column;gap:8px;padding:10px}.mm-group .hub-card .small{display:none}}
/* ---- 1.9: new pages + easier on phones ---- */
.tabs a{padding:6px 14px;border-radius:99px;border:1px solid var(--stroke);background:var(--glass);color:var(--muted);text-decoration:none;white-space:nowrap;flex:none}
.tabs a.on{background:var(--sec,var(--teal))!important;color:var(--accent-ink)!important;border-color:transparent}
pre.code{background:rgba(0,0,0,.35);border:1px solid var(--stroke);border-radius:12px;padding:10px 12px;font-size:12px;white-space:pre-wrap;word-break:break-all;margin:6px 0 8px}
.hb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.hb-card{margin:0}.hb-card img{width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:12px;background:var(--glass-2)}
.hb-card.off{opacity:.6}
.ba-cover{width:70px;height:100px;object-fit:cover;border-radius:4px 10px 10px 4px;flex:none;background:var(--glass-2);display:grid;place-items:center;color:var(--faint)}
.ai-note{margin:8px 0;padding:8px 10px;background:color-mix(in srgb,var(--violet) 10%,transparent);border-color:color-mix(in srgb,var(--violet) 30%,transparent)}
.ai-note .ic{width:15px;height:15px;color:var(--violet);vertical-align:-3px}
.wa-steps{display:flex;flex-direction:column;gap:10px}
.wa-step{margin:0}.wa-step summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none}
.wa-step summary::-webkit-details-marker{display:none}
.wa-step .small{line-height:2.1;margin-top:8px}.wa-step ol{padding-inline-start:20px;margin:0}
.wa-n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#04210f;font-weight:800;flex:none}
.job-steps{margin-top:10px;line-height:2}
.inv-text{min-height:360px;line-height:2;margin-top:10px}
.book-adm .row{min-width:0}.book-adm .grow{min-width:0;overflow-wrap:anywhere}
@media (max-width:700px){
  .head{gap:8px;flex-wrap:wrap}.head .row{flex-wrap:wrap}
  .btn{min-height:40px}.btn.sm{min-height:34px}
  .input,select,textarea{font-size:16px}
  .hub{grid-template-columns:1fr}
  .hb-grid{grid-template-columns:1fr}
  .row[style*="flex-wrap"] .btn{flex:1 1 auto}
  .drawer{width:100%!important;max-width:100%!important}
  .modal>.box{width:calc(100vw - 20px)!important;max-height:calc(100vh - 20px);overflow:auto}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .inv-text{min-height:300px}
  .promo-adm img,.ba-cover{width:60px;height:84px}
}
.ag-logo{width:64px;height:64px;border-radius:16px;object-fit:cover;flex:none;background:var(--glass-2);display:grid;place-items:center;color:var(--faint)}
/* 2.0: beautiful thin scrollbars, menus scroll sideways */
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--sec,var(--teal)) 45%,transparent) transparent}
::-webkit-scrollbar{width:8px;height:6px;background:transparent}
::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
::-webkit-scrollbar-thumb{border-radius:10px;border:2px solid transparent;background-clip:padding-box;background-color:color-mix(in srgb,var(--sec,var(--teal)) 45%,transparent)}
::-webkit-scrollbar-button{display:none;width:0;height:0}
.tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
.du-row{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(80px,1fr) 80px;gap:12px;align-items:center;padding:8px 0;border-top:1px solid var(--stroke)}
.du-l{display:flex;gap:10px;align-items:flex-start;cursor:pointer}.du-l small{font-size:11.5px}
.du-lock .ic{width:16px;height:16px;color:var(--faint)}
.du-bar{height:8px;border-radius:6px;background:var(--glass-2);overflow:hidden}.du-bar i{display:block;height:100%;background:var(--sec,var(--teal));border-radius:6px}
.du-n{text-align:end}
@media (max-width:700px){.du-row{grid-template-columns:1fr 70px}.du-bar{grid-column:1/-1;order:3}}
.inv-text.short{min-height:130px}
/* 2.3: everything waiting for the admin, at the top of the dashboard */
.attn{margin-bottom:16px;border:1px solid var(--stroke)}
.attn.has{border-color:color-mix(in srgb,#f59e0b 55%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,#f59e0b 14%,transparent)}
.attn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-top:12px}
.attn-it{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#f59e0b 10%,transparent);color:inherit;text-decoration:none;font-weight:650}
.attn-it:hover{background:color-mix(in srgb,#f59e0b 20%,transparent)}
.attn-it b{min-width:28px;text-align:center;padding:2px 8px;border-radius:99px;background:#f59e0b;color:#1a1300}
.online-pill{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.online-pill i{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
.tickbtn{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;border:1px solid var(--stroke);background:transparent;color:rgba(160,170,190,.45);cursor:pointer}
.tickbtn:hover{color:#1d9bf0;border-color:#1d9bf0}
.tickbtn.on{color:#1d9bf0;background:rgba(29,155,240,.12);border-color:rgba(29,155,240,.4)}
/* 2.5 librarian file */
.lib-file .lf-av{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.lib-file .lf-ph{display:grid;place-items:center;background:linear-gradient(135deg,#6366f1,#a855f7);color:#fff;font-weight:700;font-size:18px}
.lf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin:10px 0}
.lf-box{border:1px solid var(--stroke);border-radius:12px;padding:10px 12px;background:rgba(127,127,127,.04)}
.lf-box h4{margin:0 0 6px;font-size:13px;display:flex;align-items:center;gap:6px}
.pf-row{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:5px 0;border-top:1px dashed var(--stroke);font-size:13px;flex-wrap:wrap}
.pf-row:first-of-type{border-top:0}.pf-row b{margin-inline-start:auto;word-break:break-all}
.pf-row.pref{background:rgba(34,197,94,.08);border-radius:8px;padding-inline:6px}
.btn.xs{padding:2px 7px;font-size:12px;min-height:0}
.tick-b{color:#1d9bf0;display:inline-flex;vertical-align:middle}.tick-b svg{width:18px;height:18px}
.lf-books summary{cursor:pointer;margin:6px 0}
.site-link{color:var(--emerald,#10b981)!important}
/* 2.5.3 users with photos, user page */
.u-av{width:30px;height:30px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-inline-end:8px;display:inline-grid;place-items:center;flex:none}
.u-av.ph{background:linear-gradient(135deg,#6366f1,#a855f7);color:#fff;font-weight:700;font-size:13px}
.u-av.big{width:72px;height:72px;font-size:28px;margin:0}
.u-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ic.flip{transform:scaleX(-1)}
/* 2.7: everything that can be pressed moves a little under the mouse; dashboard numbers open their details */
@keyframes wiggle{0%{transform:translateY(0) rotate(0)}30%{transform:translateY(-3px) rotate(-.6deg)}60%{transform:translateY(-2px) rotate(.5deg)}100%{transform:translateY(-2px) rotate(0)}}
.card.stat.clickable,.online-pill[data-dd]{cursor:pointer}
.card.stat.clickable:hover,.hub-card:hover,.attn-it:hover,.kpi.card:hover{animation:wiggle .45s ease forwards;box-shadow:0 14px 30px -18px rgba(0,0,0,.6),0 0 0 1px color-mix(in srgb,var(--sec, #2dd4bf) 40%,transparent)}
.card.stat.clickable::after{content:"↗";position:absolute;top:8px;left:10px;font-size:12px;opacity:0;transition:opacity .2s}
.card.stat{position:relative}.card.stat.clickable:hover::after{opacity:.6}
.sidebar a,.nav-group>button{transition:transform .18s ease,background .18s}.sidebar a:hover{transform:translateX(-4px)}
.btn{transition:transform .15s ease}.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}
.online-pill[data-dd]:hover{filter:brightness(1.15)}
.dd-list{display:flex;flex-direction:column;gap:2px;max-height:60vh;overflow:auto}
.dd-u{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;text-decoration:none;color:inherit}.dd-u:hover{background:rgba(255,255,255,.05)}
.dd-u small{display:block}
.dd-bar{display:grid;grid-template-columns:60px 1fr 50px;align-items:center;gap:8px;font-size:13px;margin:4px 0}.dd-bar i{height:8px;border-radius:6px;background:linear-gradient(90deg,#2dd4bf,#60a5fa)}
@media (prefers-reduced-motion:reduce){.card.stat.clickable:hover,.hub-card:hover,.attn-it:hover,.kpi.card:hover{animation:none}}
/* ===================== 2.8: the panel rebuilt — calmer, cleaner, more professional ===================== */
:root{--bg:#0a1220;--bg2:#101b2e;--text:#eef3fb;--muted:#a3b1c8;--faint:#6f7f99;--glass:rgba(17,27,46,.78);--glass-2:rgba(255,255,255,.06);
  --stroke:rgba(255,255,255,.08);--stroke-2:rgba(255,255,255,.16);--shadow:0 18px 50px rgba(0,0,0,.45)}
html[data-sec="people"]{--sec:var(--sky)}html[data-sec="market"]{--sec:var(--rose)}html[data-sec="learn"]{--sec:#fb923c}html[data-sec="media"]{--sec:#ff3355}
html[data-sec="money"]{--sec:var(--saffron-c)}html[data-sec="content"]{--sec:var(--violet)}html[data-sec="ai"]{--sec:var(--emerald)}html[data-sec="system"]{--sec:var(--steel)}html[data-sec="dash"]{--sec:var(--teal)}
.sky::before{opacity:.35}
.sky::after{content:"";position:absolute;inset:-20%;background:radial-gradient(40% 35% at 85% 10%,color-mix(in srgb,var(--sec) 22%,transparent),transparent 70%),radial-gradient(35% 30% at 10% 90%,rgba(99,102,241,.16),transparent 70%);transition:background .6s}
.layout{grid-template-columns:262px 1fr}
.main-col{min-width:0;display:flex;flex-direction:column}
.sidebar{background:linear-gradient(180deg,rgba(13,21,37,.96),rgba(10,16,30,.96));padding:16px 10px}
.brand{padding:4px 10px 12px}.brand span{display:flex;flex-direction:column;line-height:1.1}.brand small{margin-top:2px}
.sb-search{display:flex;align-items:center;gap:8px;width:100%;margin:0 0 10px;padding:9px 12px;border-radius:12px;border:1px solid var(--stroke);background:var(--glass-2);color:var(--muted);cursor:pointer;font-size:13px}
.sb-search:hover{border-color:var(--stroke-2);color:var(--text)}.sb-search span{flex:1;text-align:start}
.sb-search kbd{font:inherit;font-size:10.5px;padding:1px 6px;border-radius:6px;background:rgba(255,255,255,.08);color:var(--faint);direction:ltr}
.nav-group>button{border-radius:12px}
.nav-group .gdot{width:26px;height:26px;border-radius:9px;display:inline-grid;place-items:center;background:color-mix(in srgb,var(--gc) 16%,transparent);color:var(--gc);flex:none}
.nav-group .gdot .ic{width:15px;height:15px;color:var(--gc)!important}
.nav-group.open>button{background:color-mix(in srgb,var(--gc) 10%,transparent);color:var(--text)}
.nav-group .items a{padding-inline-start:20px;font-size:13.5px}
.nav-group .items a.on{background:color-mix(in srgb,var(--gc) 16%,transparent);box-shadow:inset 3px 0 0 var(--gc)}
.nav-group.single a{font-weight:700}
.pulse{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 26px;background:rgba(10,18,32,.78);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--stroke)}
.pl-item{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:var(--glass-2);border:1px solid var(--stroke);font-size:12.5px;color:var(--muted);white-space:nowrap}
.pl-item b{color:var(--text);font-size:13.5px}.pl-item small{color:var(--faint);font-size:11.5px}.pl-item .ic{width:15px;height:15px;color:var(--sec)}
.pl-item.money{border-color:color-mix(in srgb,var(--saffron-c) 35%,transparent)}.pl-item.money .ic{color:var(--saffron-c)}
.pl-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:pl 2s infinite}
@keyframes pl{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.pl-search{margin-inline-start:auto;width:36px;height:36px;border-radius:12px;border:1px solid var(--stroke);background:var(--glass-2);color:var(--text);display:grid;place-items:center;cursor:pointer}
.content{padding:20px 26px 60px}
.card{border-radius:18px;background:linear-gradient(180deg,rgba(23,35,58,.82),rgba(16,26,44,.82));border:1px solid var(--stroke)}
.head h1::before{background:var(--sec);box-shadow:0 0 10px var(--sec)}
.kpi.card{position:relative;overflow:hidden}.kpi.card::after{content:"";position:absolute;inset-inline-end:-30px;top:-30px;width:90px;height:90px;border-radius:50%;background:color-mix(in srgb,var(--sec) 14%,transparent)}
/* command palette */
.cmdk{width:min(620px,92vw)}.modal .box:has(.cmdk){padding:0;overflow:hidden}
.cmdk-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--stroke)}
.cmdk-in input{flex:1;border:0;background:none;outline:none;font-size:15px}
.cmdk-res{max-height:60vh;overflow:auto;padding:6px}
.cmdk-g{font-size:11px;color:var(--faint);padding:8px 10px 4px;letter-spacing:.4px}
.cmdk-it{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;color:var(--text)}
.cmdk-it:hover,.cmdk-it:focus{background:color-mix(in srgb,var(--sec) 14%,transparent)}
.cmdk-it small{display:block;color:var(--faint);font-size:11.5px}.cmdk-none{padding:6px 10px}
/* team */
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.perm{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:12px;background:var(--glass-2);border:1px solid var(--stroke);cursor:pointer}
.perm:has(input:checked){border-color:var(--sec);background:color-mix(in srgb,var(--sec) 12%,transparent)}
.preset-row{display:flex;flex-wrap:wrap;gap:8px}
.preset{padding:8px 14px;border-radius:999px;border:1px solid var(--stroke-2);background:var(--glass-2);color:var(--text);cursor:pointer;font-size:13px}
.preset:hover{border-color:var(--sec);background:color-mix(in srgb,var(--sec) 12%,transparent)}
.gold-btn{background:linear-gradient(135deg,#fde68a,#f5b544)!important;color:#3b2a07!important;border-color:transparent!important}
.tv-quick{border-color:color-mix(in srgb,var(--sec) 40%,transparent)}
.warn-t{color:var(--saffron-c)}
@media (max-width:900px){.pulse{padding:8px 12px;gap:6px}.pl-item{font-size:11.5px;padding:4px 9px}.layout{grid-template-columns:1fr}}

/* ================================================================ 3.0 — fresher admin */
html[data-sec="edu"]{--sec:#f97316}
html[data-sec="people"]{--sec:var(--sky)}
html[data-sec="media"]{--sec:#d946ef}
html[data-sec="money"]{--sec:var(--saffron-c)}
.card{transition:border-color .2s,box-shadow .2s,transform .2s}
.card.stat:hover,.card.eng:hover{transform:translateY(-2px);box-shadow:var(--glow-p)}
.head h1{background:linear-gradient(90deg,var(--text),color-mix(in srgb,var(--sec) 70%,var(--text)));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-band{display:flex;align-items:center;gap:18px;padding:20px 22px;border-radius:20px;border:1px solid color-mix(in srgb,var(--sec) 35%,transparent);
  background:radial-gradient(120% 140% at 0% 0%,color-mix(in srgb,var(--sec) 26%,transparent),transparent 60%),linear-gradient(135deg,var(--bg2),var(--glass));box-shadow:var(--shadow);overflow:hidden}
.hero-band h2{margin:0 0 4px;font-size:19px}
.hero-band p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.9}
.hero-band .hb-ic{font-size:54px;margin-inline-start:auto;filter:drop-shadow(0 8px 18px rgba(0,0,0,.35));animation:hbf 4s ease-in-out infinite}
.hero-band.kids{background:radial-gradient(120% 140% at 0% 0%,rgba(249,115,22,.28),transparent 60%),radial-gradient(90% 120% at 100% 100%,rgba(250,204,21,.18),transparent 60%),linear-gradient(135deg,var(--bg2),var(--glass))}
@keyframes hbf{50%{transform:translateY(-6px) rotate(-4deg)}}
@media (prefers-reduced-motion:reduce){.hero-band .hb-ic{animation:none}}
.hbars{display:grid;gap:8px}
.hb{display:grid;grid-template-columns:minmax(70px,120px) 1fr auto;gap:10px;align-items:center;font-size:13px}
.hb .l{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb .t{height:10px;border-radius:99px;background:var(--glass-2);overflow:hidden}
.hb .t i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--sec),color-mix(in srgb,var(--sec) 50%,var(--yellow)))}
.tb-stage summary{cursor:pointer;display:flex;gap:10px;align-items:center;font-size:15px;list-style:none}
.tb-stage summary::-webkit-details-marker{display:none}
.tb-stage summary::before{content:"◂";transition:transform .2s;color:var(--sec)}
.tb-stage[open] summary::before{transform:rotate(-90deg)}
.tb-tree{display:grid;gap:12px}
.tb-grade{margin-top:12px;padding-top:10px;border-top:1px dashed var(--stroke)}
.tb-grade h4{margin:0 0 6px;font-size:13.5px;color:color-mix(in srgb,var(--sec) 70%,var(--text))}
.tb-book{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--glass-2);border:1px solid var(--stroke);margin:6px 0;flex-wrap:wrap}
.tb-book.off{opacity:.55}
.tb-book .tb-ic{font-size:26px}
.tb-book .grow{min-width:200px}
.tb-act{gap:6px;flex-wrap:wrap}
.up-card{border-color:color-mix(in srgb,var(--sec) 35%,transparent)}
.upbar{height:8px;border-radius:99px;background:var(--glass-2);overflow:hidden;margin-top:10px}
.upbar i{display:block;height:100%;width:0;background:var(--sec);transition:width .2s}
.eng{display:grid;gap:8px}
.eng.off{opacity:.6}
.eng .fees{display:flex;gap:8px;flex-wrap:wrap}
.eng .fees span{padding:4px 10px;border-radius:10px;background:var(--glass-2);font-size:12.5px;color:var(--muted)}
.eng .fees b{color:var(--yellow)}
.pat{white-space:pre-wrap;background:var(--bg);border:1px dashed var(--stroke-2);border-radius:12px;padding:12px 14px;font-family:var(--font);font-size:14px;line-height:2;user-select:all}
.edu-dash{margin-bottom:14px;border-color:rgba(249,115,22,.35);background:radial-gradient(100% 140% at 100% 0%,rgba(249,115,22,.14),transparent 60%),var(--glass)}
.edu-dash h3{margin-top:0}
.mini-s{display:grid;gap:2px;padding:10px 12px;border-radius:14px;background:var(--glass-2);border:1px solid var(--stroke);color:var(--text)}
.mini-s span{font-size:12px;color:var(--muted)}
.mini-s b{font-size:20px}
.mini-s:hover{border-color:#f97316}
#pk select[name=coin]{min-width:96px}
#pk input[name=credits]{min-width:104px}
.up-card input[type=file]{width:100%;max-width:100%;min-width:0;padding:10px;border:1px dashed var(--stroke-2);border-radius:12px;background:var(--glass-2);font-size:12.5px}
.up-card input[type=file]::file-selector-button{font:inherit;border:0;border-radius:9px;padding:6px 12px;background:var(--sec);color:var(--accent-ink);margin-inline-end:8px;cursor:pointer}
@media (max-width:640px){.up-card .g3{grid-template-columns:1fr}}
/* 3.1 */
.me-link{display:flex;align-items:center;gap:8px}
.me-link small{font-size:11px}
.tb-cov{position:relative;width:46px;height:62px;display:grid;place-items:center;border-radius:8px;background:var(--glass-2);overflow:hidden;cursor:pointer;flex:none;font-size:26px}
.tb-cov img{width:100%;height:100%;object-fit:cover}
.tb-cov small{position:absolute;bottom:0;left:0;right:0;font-size:9px;text-align:center;background:#0008;color:#fff;line-height:1.6}
.nq-prev{font-family:"IranNastaliq","Noto Nastaliq Urdu","Urdu Typesetting",serif;font-size:30px;text-align:center;margin:0;line-height:2;color:#f5b544}
.ch-adm p{margin:8px 0}
.tabs .btn{margin-bottom:6px}
/* ================================================================ 3.2: a calmer, cleaner panel */
.sky::before{opacity:.35}
.sidebar{background:rgba(10,22,31,.96);padding:18px 10px}
.sidebar .brand{padding-bottom:14px;margin-bottom:8px;border-bottom:1px solid var(--stroke)}
.nav-group>button{padding:8px 10px;font-weight:600;font-size:13.5px}
.nav-group .items a{font-size:13px;padding-block:6px}
.content{padding:24px 30px 70px;max-width:1360px}
.head h1{font-size:21px;font-weight:850;letter-spacing:-.2px}
.card{border-radius:18px;padding:18px;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 12px 30px -24px rgba(0,0,0,.8);backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(19,42,55,.72)}
.card h3{font-size:14.5px;font-weight:800;color:var(--text)}
.sec{margin-top:16px}
.grid{gap:14px}
.stat::before{box-shadow:none;width:3px;opacity:.85}
.stat .v{font-size:23px}
.btn{border-radius:11px;font-weight:600}
.btn.primary{box-shadow:0 8px 20px -12px var(--sec)}
.pulse{opacity:.92}
@media (max-width:820px){.content{padding:16px 14px 60px}}
/* founding reminder + the update note waiting */
.top32{display:grid;gap:10px;margin-bottom:14px}
.fnd-card{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(120deg,rgba(245,181,68,.18),rgba(167,139,250,.16)),rgba(19,42,55,.8);border-color:rgba(245,181,68,.35)}
.fnd-card b{font-size:15px}
.fnd-ic{font-size:30px;line-height:1}
.attn-card{border-color:rgba(245,181,68,.45)}
.rn-card{display:flex;align-items:center;gap:14px;color:var(--text)}
.dash-more>summary{cursor:pointer;list-style:none;padding:2px 0}
.dash-more>summary::-webkit-details-marker{display:none}
.dash-more>summary::before{content:"▸ ";color:var(--sec)}
.dash-more[open]>summary::before{content:"▾ "}
.dash-more>*+*{margin-top:14px}
/* the update note preview */
.rn-prev{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:22px 16px;border-radius:22px;background:#0f1729;border:1px solid var(--stroke);max-width:380px;margin:0 auto}
.rn-prev img{width:64px;height:64px;border-radius:18px}
.rn-prev p{white-space:pre-wrap;margin:0;color:var(--muted);line-height:2;font-size:14px;min-height:40px}
.rn-notes{white-space:pre-wrap;font-size:12px;color:var(--muted);max-height:320px;overflow:auto;background:var(--glass-2);padding:10px;border-radius:12px}
/* audio stories */
.as-adm{display:grid;gap:10px}
.as-k{font-size:26px}
.as-row audio{width:100%;max-width:520px;margin-top:8px;height:36px}
.hh-pv{background:radial-gradient(circle,#ffffff14,transparent 70%)}
.hh-pv img{object-fit:contain!important;padding:4px}
/* 3.3 */
.btn.back-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border-radius:12px;font-size:18px;font-weight:900}
.grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.grid.g3{grid-template-columns:1fr}}
.sys33{margin-bottom:16px}
.sys33 textarea{width:100%}
.apk-v{font-size:15px;margin:0 0 10px}
.coin-sec{border-radius:18px;padding:12px;margin:12px 0;border:1px solid var(--stroke)}
.coin-sec.yellow{background:linear-gradient(160deg,#facc1522,transparent 60%);border-color:#facc1555}
.coin-sec.purple{background:linear-gradient(160deg,#a855f726,transparent 60%);border-color:#a855f755}
.cs-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.cs-head b{display:block;font-size:15px}.cs-head small{color:var(--muted);font-size:12px}
.cs-coin{font-size:26px}
.coin-split{display:grid;gap:14px}
.coin-split>div{display:grid;gap:6px}
.cs-bar{height:14px;border-radius:999px;background:var(--glass-2);overflow:hidden}
.cs-bar i{display:block;height:100%;border-radius:inherit}
.cs-yel .cs-bar i{background:linear-gradient(90deg,#fde047,#f59e0b)}.cs-pur .cs-bar i{background:linear-gradient(90deg,#c084fc,#7c3aed)}
.seg3{display:flex;gap:6px;flex-wrap:wrap}
.seg3 button{flex:1;padding:9px 12px;border-radius:12px;border:1px solid var(--stroke-2);background:var(--glass-2);color:var(--text);cursor:pointer;font:inherit;font-size:13px}
.seg3 button.on{background:var(--teal,#14b8a6);color:#fff;border-color:transparent}
.perm.x{border-style:dashed}
.oc-adm{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.oc-it{display:grid;gap:6px;padding:10px}
.oc-it.off{opacity:.55}
.oc-it img,.oc-ph{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;display:grid;place-items:center;font-size:40px;background:var(--glass-2)}
.nq-pv{min-height:90px;display:grid;place-items:center;background:repeating-conic-gradient(#ffffff10 0 25%,transparent 0 50%) 0 0/16px 16px}
.nq-pv img{max-width:100%;max-height:90px;object-fit:contain}
.bg35{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.bg35-it{display:grid;gap:6px;justify-items:start}
.bg35-pv{width:100%;aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:#0001;border:1px solid #0002}
.bg35-pv img{width:100%;height:100%;object-fit:cover;display:block}
/* 3.6 coin prices */
.pk36-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:14px}
@media (max-width:520px){.pk36-grid{grid-template-columns:1fr}}
.pk36-sec.yellow{background:linear-gradient(170deg,#facc1514,transparent 40%);border-color:#facc1544}
.pk36-sec.purple{background:linear-gradient(170deg,#a855f716,transparent 40%);border-color:#a855f744}
.pk36-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}.pk36-h h3{margin:0}.pk36-h small{color:var(--muted);font-size:12px}
.coin-dot{width:30px;height:30px;border-radius:50%;flex:none;box-shadow:inset 0 -3px 0 #0003}
.coin-dot.y{background:radial-gradient(circle at 35% 30%,#fff3a8,#f5b021 60%,#b9770e)}.coin-dot.p{background:radial-gradient(circle at 35% 30%,#ecd5ff,#a855f7 60%,#6d28d9)}
.pk36-list{display:grid;gap:10px}
.pk36{border:1px solid var(--stroke);border-radius:14px;padding:10px 12px;background:var(--card,#0001)}
.pk36.off{opacity:.55}
.pk36-top{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.pk36-amt{font-size:20px;font-weight:800}.pk36-pr{flex:1;color:var(--muted);font-size:13px}
.pk36-on{display:flex;align-items:center;gap:4px;font-size:12px;cursor:pointer}
.pk36-f{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media (max-width:700px){.pk36-f{grid-template-columns:1fr 1fr}}
.pk36-f label{display:grid;gap:3px}.pk36-f label span{font-size:11px;color:var(--muted)}
.pk36-f .input{padding:6px 8px;font-size:13px}
.pk36-save{margin:12px 0;gap:12px;align-items:center}
/* 3.6 */
.tb-years{display:grid;gap:6px;margin:8px 0}.tb-y{align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--stroke);border-radius:10px}
.tb-book.arch{opacity:.6}
.upq{display:grid;gap:6px;margin:10px 0}
.upq-it{display:grid;grid-template-columns:1fr auto 110px 120px;gap:8px;align-items:center;padding:6px 8px;border:1px solid var(--stroke);border-radius:10px}
.upq-it.ok{border-color:#22c55e}.upq-it.bad{border-color:#ef4444}
.upq-bar{height:6px;border-radius:99px;background:#0002;overflow:hidden}.upq-bar i{display:block;height:100%;width:0;background:var(--teal,#14b8a6);transition:width .2s}
@media (max-width:700px){.upq-it{grid-template-columns:1fr 1fr}}
.sw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:8px 0}
.sw-grid>div{display:grid;gap:4px}.sw-grid small{color:var(--muted)}
.sw-bar{height:10px;border-radius:99px;background:#0002;overflow:hidden}.sw-bar i{display:block;height:100%;background:#22c55e}
.sw-bar.warn i{background:#f59e0b}.sw-bar.bad i{background:#ef4444}
