/* Citely — Dashboard app screen (self-contained; loaded only on the dashboard template) */
:root{
  --void:#0B0A1A; --nebula:#16143A; --panel:#12102A; --panel2:#151330;
  --violet:#7C6CFF; --cyan:#4FD8FF; --green:#3ADFA5; --pink:#FF5C8A; --amber:#FFB65C; --red:#FF6B6B;
  --paper:#F2F1FA; --dim:#9C98C6; --line:rgba(255,255,255,.08);
  --sbw:250px;
}
body.citely-app{margin:0;padding:0}
.citely-app *{margin:0;padding:0;box-sizing:border-box}
.citely-app{background:var(--void);color:var(--paper);font-family:'Inter',sans-serif;font-size:14px;line-height:1.55;overflow-x:hidden}
.citely-app a{text-decoration:none;color:inherit}
.citely-app .mono{font-family:'IBM Plex Mono',monospace}
.citely-app ::-webkit-scrollbar{width:9px;height:9px}
.citely-app ::-webkit-scrollbar-track{background:transparent}
.citely-app ::-webkit-scrollbar-thumb{background:rgba(124,108,255,.25);border-radius:99px}
.citely-app ::-webkit-scrollbar-thumb:hover{background:rgba(124,108,255,.45)}

.blob{position:fixed;border-radius:50%;filter:blur(110px);opacity:.35;pointer-events:none;z-index:0;animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,-40px) scale(1.2)}}
.bl1{width:560px;height:560px;left:14%;top:-220px;background:radial-gradient(circle,#7C6CFF 0%,transparent 70%)}
.bl2{width:480px;height:480px;right:-140px;top:34%;background:radial-gradient(circle,#4FD8FF 0%,transparent 70%);opacity:.20;animation-delay:-9s}
.bl3{width:460px;height:460px;left:30%;bottom:-240px;background:radial-gradient(circle,#3ADFA5 0%,transparent 70%);opacity:.14;animation-delay:-14s}

.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sbw);z-index:50;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
  background:linear-gradient(180deg,rgba(18,16,42,.92),rgba(11,10,26,.96));backdrop-filter:blur(18px);border-right:1px solid var(--line)}
.sidebar::-webkit-scrollbar{width:7px}.sidebar::-webkit-scrollbar-thumb{background:rgba(124,108,255,.3);border-radius:99px}
.sb-logo{display:flex;align-items:center;gap:10px;font-family:'Unbounded';font-weight:600;font-size:16px;padding:22px 22px 18px}
.sb-logo .dot{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;background:linear-gradient(135deg,var(--violet),var(--cyan));box-shadow:0 0 18px rgba(124,108,255,.55)}
.store{margin:0 14px 16px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:13px;cursor:pointer;background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.2s}
.store:hover{border-color:rgba(124,108,255,.5);background:rgba(124,108,255,.08)}
.store .fav{width:32px;height:32px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;font-family:'Unbounded';font-size:13px;font-weight:700;color:#0B0A1A;background:linear-gradient(135deg,var(--green),var(--cyan));box-shadow:0 0 14px rgba(58,223,165,.4)}
.store b{display:block;font-size:12.5px;font-weight:600;line-height:1.2}
.store span{font-family:'IBM Plex Mono';font-size:9.5px;color:var(--green)}
.store .chev{margin-left:auto;color:var(--dim);font-size:11px}
.sb-lab{font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);opacity:.7;padding:10px 24px 6px}
.sb-nav{padding:0 12px;display:grid;gap:2px}
.nitem{position:relative;display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:11px;font-size:13px;font-weight:500;color:var(--dim);cursor:pointer;transition:.18s;border:1px solid transparent}
.nitem:hover{color:var(--paper);background:rgba(255,255,255,.05)}
.nitem.active{color:var(--paper);background:linear-gradient(90deg,rgba(124,108,255,.18),rgba(79,216,255,.06));border-color:rgba(124,108,255,.35);box-shadow:0 0 20px rgba(124,108,255,.12),inset 0 1px 0 rgba(255,255,255,.06)}
.nitem.active::before{content:"";position:absolute;left:-13px;top:20%;bottom:20%;width:3px;border-radius:99px;background:linear-gradient(180deg,var(--cyan),var(--violet));box-shadow:0 0 12px var(--violet)}
.nitem .ni{width:26px;height:26px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center;font-size:12px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.nitem.active .ni{background:linear-gradient(135deg,rgba(124,108,255,.35),rgba(79,216,255,.2));border-color:rgba(124,108,255,.4)}
.nitem .score{margin-left:auto;font-family:'IBM Plex Mono';font-size:10px;padding:2px 8px;border-radius:99px;border:1px solid;color:var(--dim);border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.03)}
.nitem .badge-n{margin-left:auto;min-width:18px;height:18px;border-radius:99px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#0B0A1A;background:linear-gradient(135deg,var(--cyan),var(--violet));box-shadow:0 0 10px rgba(124,108,255,.5)}
.up-card{margin:auto 14px 14px;position:relative;border-radius:16px;padding:16px 15px;overflow:hidden;background:linear-gradient(140deg,rgba(124,108,255,.16),rgba(79,216,255,.07));border:1px solid rgba(124,108,255,.4)}
.up-card::before{content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(124,108,255,.5),transparent 70%);filter:blur(20px)}
.up-card h5{font-family:'Unbounded';font-size:12px;font-weight:600;margin-bottom:5px;position:relative}
.up-card p{font-size:11px;color:var(--dim);line-height:1.5;margin-bottom:11px;position:relative}
.up-card .bar{height:5px;border-radius:99px;background:rgba(255,255,255,.1);margin-bottom:6px;overflow:hidden}
.up-card .bar i{display:block;height:100%;width:4%;border-radius:99px;background:linear-gradient(90deg,var(--cyan),var(--violet))}
.up-card .qta{font-family:'IBM Plex Mono';font-size:9.5px;color:var(--dim);margin-bottom:11px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:11px;padding:10px 18px;font-size:13px;font-weight:600;cursor:pointer;border:1px solid var(--line);color:var(--paper);background:rgba(255,255,255,.04);transition:.18s;font-family:'Inter'}
.btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}
.btn.glow{border:none;color:#0B0A1A;background:linear-gradient(100deg,var(--cyan),var(--violet) 70%);box-shadow:0 0 22px rgba(124,108,255,.4),inset 0 1px 0 rgba(255,255,255,.35);position:relative;overflow:hidden}
.btn.glow:hover{box-shadow:0 0 36px rgba(124,108,255,.65);transform:translateY(-1px)}
.btn.glow::after{content:"";position:absolute;top:0;left:-70%;width:44%;height:100%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-22deg);animation:sweep 3.6s ease-in-out infinite}
@keyframes sweep{0%,55%{left:-70%}85%,100%{left:130%}}
.btn.sm{padding:7px 13px;font-size:11.5px;border-radius:9px}
.up-card .btn{width:100%;position:relative}
.sb-user{display:flex;align-items:center;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}
.sb-user .av{width:32px;height:32px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(135deg,#FF7AA8,var(--violet))}
.sb-user b{display:block;font-size:12px;font-weight:600;line-height:1.25}
.sb-user span{font-size:10.5px;color:var(--dim)}
.sb-user .out{margin-left:auto;color:var(--dim);font-size:13px;cursor:pointer;transition:.15s}
.sb-user .out:hover{color:var(--red)}

.main{margin-left:var(--sbw);position:relative;z-index:2;min-height:100vh}
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:16px;padding:14px 30px;background:rgba(11,10,26,.72);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.crumb{font-size:12.5px;color:var(--dim)}
.crumb b{color:var(--paper);font-weight:600}
.searchbar{margin-left:auto;display:flex;align-items:center;gap:9px;width:300px;padding:9px 14px;border-radius:11px;background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.2s}
.searchbar:focus-within{border-color:rgba(124,108,255,.55);box-shadow:0 0 20px rgba(124,108,255,.15)}
.searchbar input{flex:1;background:transparent;border:none;outline:none;color:var(--paper);font-size:12.5px;font-family:'Inter'}
.searchbar input::placeholder{color:var(--dim)}
.searchbar .k{font-family:'IBM Plex Mono';font-size:9.5px;color:var(--dim);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.icobtn{position:relative;width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--dim);cursor:pointer;transition:.18s}
.icobtn:hover{color:var(--paper);border-color:rgba(124,108,255,.5);box-shadow:0 0 16px rgba(124,108,255,.2)}
.icobtn .ping{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:tw 2s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:.4}50%{opacity:1}}
.wrap{padding:28px 30px 60px;max-width:1460px}
.phead{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:20px}
.phead h1{font-family:'Unbounded';font-weight:600;font-size:clamp(20px,2.4vw,28px);line-height:1.25}
.phead h1 .grad{background:linear-gradient(95deg,var(--cyan),var(--violet) 60%,#B8A9FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.phead p{color:var(--dim);font-size:13px;margin-top:5px}
.phead p b{color:var(--paper)}
.phead .last{font-family:'IBM Plex Mono';font-size:10.5px;color:var(--dim);display:flex;align-items:center;gap:8px}
.phead .last i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 9px var(--green);animation:tw 2.4s ease-in-out infinite}
.steps{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.step{flex:1;min-width:200px;display:flex;align-items:center;gap:11px;padding:12px 15px;border-radius:14px;background:rgba(21,19,48,.55);border:1px solid var(--line);font-size:12px;color:var(--dim)}
.step .sn{width:26px;height:26px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-family:'Unbounded';font-size:11px;font-weight:600}
.step.done{border-color:rgba(58,223,165,.35)}
.step.done .sn{background:rgba(58,223,165,.14);color:var(--green);border:1px solid rgba(58,223,165,.5)}
.step.done b{color:var(--paper)}
.step.now{border-color:rgba(124,108,255,.55);background:linear-gradient(90deg,rgba(124,108,255,.14),rgba(79,216,255,.05));box-shadow:0 0 26px rgba(124,108,255,.18);animation:stepPulse 3s ease-in-out infinite}
@keyframes stepPulse{0%,100%{box-shadow:0 0 20px rgba(124,108,255,.15)}50%{box-shadow:0 0 38px rgba(124,108,255,.35)}}
.step.now .sn{background:linear-gradient(135deg,var(--cyan),var(--violet));color:#0B0A1A;box-shadow:0 0 14px rgba(124,108,255,.6)}
.step.now b{color:var(--paper)}
.step b{display:block;font-size:12.5px;font-weight:600;line-height:1.3}
.step span{font-size:10.5px}
.step .ck{margin-left:auto;color:var(--green);font-size:13px}
.scoreband{position:relative;display:grid;grid-template-columns:340px 1fr 340px;gap:0;border-radius:22px;overflow:hidden;margin-bottom:14px;background:linear-gradient(140deg,#16143A 0%,#100E28 55%,#0D0C20 100%);border:1px solid rgba(124,108,255,.3);box-shadow:0 24px 70px rgba(0,0,0,.5),0 0 60px rgba(124,108,255,.10)}
.scoreband::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background:radial-gradient(600px 300px at 12% 20%,rgba(124,108,255,.20),transparent 60%),radial-gradient(500px 260px at 88% 85%,rgba(79,216,255,.12),transparent 60%)}
@media(max-width:1200px){.scoreband{grid-template-columns:320px 1fr}.sb-right{display:none}}
@media(max-width:820px){.scoreband{grid-template-columns:1fr}}
.gcell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;border-right:1px solid var(--line)}
.gauge{position:relative;width:210px;height:210px}
.gauge svg{width:100%;height:100%;transform:rotate(-90deg)}
.gauge .track{fill:none;stroke:rgba(255,255,255,.07);stroke-width:13}
.gauge .pot{fill:none;stroke:rgba(58,223,165,.22);stroke-width:13;stroke-linecap:round;stroke-dasharray:0 565;transition:stroke-dasharray 2.2s cubic-bezier(.25,.7,.2,1);filter:drop-shadow(0 0 6px rgba(58,223,165,.35))}
.gauge .fill{fill:none;stroke:url(#ggrad);stroke-width:13;stroke-linecap:round;stroke-dasharray:0 565}
.gauge .seg{fill:none;stroke-width:14;opacity:.62;transition:opacity .25s}
.gauge:hover .seg{opacity:.9}
.glegend{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 13px;margin-top:16px;max-width:300px}
.glegend span{font-size:10.5px;color:var(--dim);display:inline-flex;align-items:center;gap:5px}
.glegend span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 6px var(--c)}
.scoremeter{width:100%;max-width:300px;margin-top:18px}
.scoremeter .sm-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}
.scoremeter .sm-top span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
.scoremeter .sm-top b{font-family:'Unbounded';font-size:16px;color:var(--paper)}
.scoremeter .sm-bar{height:9px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.scoremeter .sm-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--green),var(--violet));box-shadow:0 0 10px rgba(124,108,255,.55);transition:width 1.1s cubic-bezier(.25,.7,.2,1)}
.scoremeter .sm-note{display:block;margin-top:7px;font-size:10.5px;color:var(--dim);text-align:center}
.gauge .gtxt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.gauge .gtxt b{font-family:'Unbounded';font-weight:700;font-size:46px;line-height:1;background:linear-gradient(180deg,#fff,#B8A9FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.gauge .gtxt b em{font-style:normal;font-size:20px}
.gauge .gtxt span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-top:6px;font-weight:600}
.gauge .gtxt .delta{margin-top:8px;font-family:'IBM Plex Mono';font-size:10.5px;color:var(--green);background:rgba(58,223,165,.09);border:1px solid rgba(58,223,165,.35);border-radius:99px;padding:2.5px 11px}
.grade{margin-top:14px;font-size:12px;color:var(--dim);text-align:center;line-height:1.6}
.grade b{color:var(--green)}
.becell{padding:26px 28px;display:flex;flex-direction:column;justify-content:center;position:relative}
.becell h3{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:5px}
.becell .hint{font-size:11px;color:var(--dim);margin-bottom:14px}
.becell .hint b{color:var(--green)}
.ebar{display:grid;grid-template-columns:112px 1fr 96px;align-items:center;gap:12px;margin-bottom:11px}
.ebar .en{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600}
.ebar .en i{width:20px;height:20px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;font-family:'Unbounded';font-style:normal}
.ebar .tr{position:relative;height:7px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.ebar .tr .ghost{position:absolute;inset:0;width:0;border-radius:99px;background:repeating-linear-gradient(90deg,rgba(58,223,165,.28) 0 6px,rgba(58,223,165,.08) 6px 12px);transition:width 1.8s cubic-bezier(.25,.7,.2,1)}
.ebar .tr .now{position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:99px;background:var(--dim);opacity:.6}
.ebar .pv{font-family:'IBM Plex Mono';font-size:10px;color:var(--dim);text-align:right;white-space:nowrap}
.ebar .pv b{color:var(--green);font-weight:500}
.sb-right{padding:26px 24px;border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;gap:13px}
.sb-right h3{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.pstat{display:flex;align-items:center;gap:12px}
.pstat .pi{width:38px;height:38px;border-radius:11px;flex:none;display:flex;align-items:center;justify-content:center;font-size:15px;border:1px solid var(--line);background:rgba(255,255,255,.04)}
.pstat b{font-family:'Unbounded';font-size:17px;font-weight:600;display:block;line-height:1.15}
.pstat b.gr{color:var(--green)}
.pstat span{font-size:11px;color:var(--dim)}
.oppband{position:relative;border-radius:22px;overflow:hidden;margin-bottom:22px;padding:24px 28px;background:linear-gradient(120deg,rgba(58,223,165,.10),rgba(79,216,255,.07) 45%,rgba(124,108,255,.10));border:1px solid rgba(58,223,165,.35);box-shadow:0 0 50px rgba(58,223,165,.08)}
.oppband::before{content:"";position:absolute;top:-60px;left:20%;width:300px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(58,223,165,.30),transparent 70%);filter:blur(30px);pointer-events:none}
.opp-top{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.opp-top .tag{font-family:'IBM Plex Mono';font-size:10px;color:var(--green);border:1px solid rgba(58,223,165,.45);background:rgba(58,223,165,.09);border-radius:99px;padding:3px 12px}
.opp-top h2{font-family:'Unbounded';font-size:16.5px;font-weight:600}
.opp-top h2 em{font-style:normal;background:linear-gradient(95deg,var(--green),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.opp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:1100px){.opp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.opp-grid{grid-template-columns:1fr}}
.opp{position:relative;background:rgba(11,10,26,.45);border:1px solid rgba(255,255,255,.09);border-radius:15px;padding:15px 16px;transition:transform .25s,border-color .25s,box-shadow .25s}
.opp:hover{transform:translateY(-4px);border-color:rgba(58,223,165,.5);box-shadow:0 12px 34px rgba(0,0,0,.4),0 0 26px rgba(58,223,165,.12)}
.opp b{font-family:'Unbounded';font-weight:600;font-size:clamp(20px,2vw,26px);display:block;line-height:1.15;background:linear-gradient(95deg,#fff,#9FF0D4);-webkit-background-clip:text;background-clip:text;color:transparent}
.opp b em{font-style:normal;font-size:15px}
.opp span{font-size:11px;color:var(--dim);display:block;margin-top:4px;line-height:1.5}
.opp span i{font-style:normal;color:var(--paper);font-weight:600}
.opp .src2{font-family:'IBM Plex Mono';font-size:8.5px;color:var(--dim);opacity:.6;margin-top:7px;display:block}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
@media(max-width:1100px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.tiles{grid-template-columns:1fr}}
.tile{position:relative;background:rgba(21,19,48,.55);border:1px solid var(--line);border-radius:16px;padding:17px 18px 15px;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}
.tile:hover{transform:translateY(-4px);border-color:rgba(124,108,255,.45);box-shadow:0 14px 40px rgba(0,0,0,.45),0 0 30px rgba(124,108,255,.12)}
.tile::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--tc,#7C6CFF),transparent)}
.tile .tl{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:9px;display:block}
.tile .nowline{display:flex;align-items:baseline;gap:10px}
.tile b.v{font-family:'Unbounded';font-weight:600;font-size:26px;color:var(--dim)}
.tile .arrow{font-size:14px;color:var(--green)}
.tile b.pot{font-family:'Unbounded';font-weight:600;font-size:20px;color:transparent;background:linear-gradient(95deg,var(--green),var(--cyan));-webkit-background-clip:text;background-clip:text}
.tile .sub{font-size:10.5px;color:var(--dim);margin-top:5px;display:block;line-height:1.5}
.tile .sub i{font-style:normal;color:var(--green)}
.secline{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:26px 0 6px}
.secline h2{font-family:'Unbounded';font-size:15px;font-weight:600}
.secline .see{font-family:'IBM Plex Mono';font-size:11px;color:var(--cyan);cursor:pointer}
.secline .see:hover{text-decoration:underline}
.sechint{font-size:12px;color:var(--dim);margin-bottom:14px}
.sechint b{color:var(--paper)}
.mods{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:1250px){.mods{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.mods{grid-template-columns:1fr}}
.mod{position:relative;background:linear-gradient(150deg,rgba(22,20,50,.75),rgba(15,14,36,.85));border:1px solid var(--line);border-radius:18px;padding:18px;overflow:hidden;cursor:pointer;transition:transform .28s,border-color .28s,box-shadow .28s}
.mod::before{content:"";position:absolute;top:-70px;right:-70px;width:190px;height:190px;border-radius:50%;opacity:.14;background:radial-gradient(circle,var(--mc,#7C6CFF),transparent 70%);filter:blur(24px);transition:opacity .3s}
.mod:hover{transform:translateY(-5px);border-color:var(--mb,rgba(124,108,255,.5));box-shadow:0 18px 50px rgba(0,0,0,.5),0 0 34px var(--mg,rgba(124,108,255,.16))}
.mod:hover::before{opacity:.3}
.mod .mh{display:flex;align-items:center;gap:11px;margin-bottom:13px}
.mod .mi{width:40px;height:40px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;font-family:'Unbounded';font-size:15px;font-weight:700;color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.mod h4{font-size:14px;font-weight:600;line-height:1.2}
.mod .mh span{font-family:'IBM Plex Mono';font-size:9.5px;color:var(--dim)}
.mring{margin-left:auto;position:relative;width:52px;height:52px;flex:none}
.mring svg{width:100%;height:100%;transform:rotate(-90deg)}
.mring .t2{fill:none;stroke:rgba(255,255,255,.08);stroke-width:5}
.mring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono';font-size:12px;font-weight:500;color:var(--dim)}
.mopp{display:flex;align-items:center;gap:9px;font-size:11.5px;line-height:1.5;color:var(--paper);border-radius:11px;padding:9px 12px;margin-bottom:11px;background:rgba(58,223,165,.06);border:1px solid rgba(58,223,165,.3)}
.mopp .fl{flex:none}
.mopp b{color:var(--green)}
.mmets{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:13px}
.mmet{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:8px 10px}
.mmet b{font-family:'Unbounded';font-size:14px;font-weight:600;display:block;color:var(--dim)}
.mmet b.gr{color:var(--green)}
.mmet span{font-size:9.5px;color:var(--dim);display:block;margin-top:1px;line-height:1.3}
.mfoot{display:flex;align-items:center;justify-content:space-between}
.mstat-t{font-family:'IBM Plex Mono';font-size:9.5px;padding:3px 9px;border-radius:99px;border:1px solid;color:var(--dim);border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.03)}
.startbtn{font-size:11.5px;font-weight:700;color:#0B0A1A;background:linear-gradient(100deg,var(--cyan),var(--violet));border:none;border-radius:9px;padding:8px 15px;cursor:pointer;font-family:'Inter';box-shadow:0 0 16px rgba(124,108,255,.35);transition:.18s;display:inline-flex;align-items:center;gap:6px}
.startbtn:hover{box-shadow:0 0 28px rgba(124,108,255,.6);transform:translateY(-1px)}
.lower{display:grid;grid-template-columns:1.35fr .95fr;gap:14px;margin-top:26px}
@media(max-width:1100px){.lower{grid-template-columns:1fr}}
.panel{background:rgba(21,19,48,.55);border:1px solid var(--line);border-radius:18px;padding:18px;position:relative;overflow:hidden}
.panel h3{font-size:13px;font-weight:700;display:flex;align-items:center;gap:9px;margin-bottom:4px}
.panel h3 .lv{margin-left:auto;font-family:'IBM Plex Mono';font-size:9.5px;color:var(--green);font-weight:400}
.panel .ph{font-size:11.5px;color:var(--dim);margin-bottom:14px}
.panel .ph b{color:var(--green)}
.chart{position:relative}
.chart svg{width:100%;height:200px;display:block}
.chart .grid-l{stroke:rgba(255,255,255,.05);stroke-width:1}
.chart .lbl{font-family:'IBM Plex Mono';font-size:9px;fill:#9C98C6}
.ckey{display:flex;gap:16px;margin-top:10px;font-size:10.5px;color:var(--dim);flex-wrap:wrap}
.ckey i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.feed{display:grid;gap:9px;max-height:360px;overflow-y:auto;padding-right:4px}
.ev{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:10px 12px;transition:.18s}
.ev:hover{border-color:rgba(124,108,255,.4);background:rgba(124,108,255,.05)}
.ev .ei{width:30px;height:30px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;font-size:12px;font-family:'Unbounded';font-weight:700;color:#fff}
.ev p{font-size:12px;line-height:1.5;color:var(--dim)}
.ev p b{color:var(--paper);font-weight:600}
.ev p .hi{color:var(--green)}
.ev .tt{margin-left:auto;flex:none;font-family:'IBM Plex Mono';font-size:9px;color:var(--green);padding-top:2px;white-space:nowrap}
.winband{margin-top:26px;position:relative;border-radius:20px;overflow:hidden;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:linear-gradient(110deg,rgba(124,108,255,.16),rgba(79,216,255,.08));border:1px solid rgba(124,108,255,.4);box-shadow:0 0 50px rgba(124,108,255,.10)}
.winband::before{content:"";position:absolute;left:-40px;top:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(124,108,255,.4),transparent 70%);filter:blur(30px);pointer-events:none}
.winband h2{font-family:'Unbounded';font-size:clamp(15px,1.8vw,19px);font-weight:600;line-height:1.4;position:relative}
.winband h2 em{font-style:normal;background:linear-gradient(95deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.winband p{font-size:12.5px;color:var(--dim);margin-top:5px;position:relative}
.winband .btn{position:relative}
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .blob,.btn.glow::after,.icobtn .ping,.phead .last i,.step.now{animation:none}
  .rv{opacity:1;transform:none}
  .gauge .pot,.ebar .tr .ghost{transition:none}
}
@media(max-width:920px){
  :root{--sbw:0px}
  .sidebar{display:none}
  .main{margin-left:0}
}

/* ===== Module status chips — replace the bare "0" score with a clear state ===== */
.nitem .mstat{margin-left:auto;font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:2px 8px;border-radius:99px;border:1px solid transparent;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.nitem .mstat.live{color:#7FE8C9;border-color:rgba(127,232,201,.32);background:rgba(127,232,201,.07)}
.nitem .mstat.live::before{content:"";width:5px;height:5px;border-radius:99px;background:#7FE8C9;box-shadow:0 0 7px #7FE8C9;animation:mstatpulse 2.4s ease-in-out infinite}
.nitem.active .mstat.live{color:#8CF0D6;border-color:rgba(127,232,201,.45)}
.nitem .mstat.soon{color:var(--dim);border-color:var(--line);background:rgba(255,255,255,.02);letter-spacing:.06em}
.nitem.soon{opacity:.5;cursor:default}
.nitem.soon:hover{background:transparent;color:var(--dim)}
@keyframes mstatpulse{0%,100%{opacity:1}50%{opacity:.35}}

/* Locked sidebar items — visible, explained, not clickable (gate state). */
.nitem.locked{opacity:.45;cursor:not-allowed}
.nitem.locked:hover{background:none;color:var(--dim)}
.mstat.lock{margin-left:auto;font-size:10px;opacity:.8}

.bx{color:var(--cyan);font-weight:800;font-style:normal}
