/* NOUN TMA Quiz v2.0.0 — Neo-Academic Design */

/* ═══════ TOKENS ═══════ */
:root{
--bg:#FAFAF8;--bg2:#F2F1ED;--s1:#FFFFFF;--s2:#F7F6F3;
--bd:rgba(12,59,46,.06);--bd2:rgba(12,59,46,.1);
--fg:#0C1F17;--fg2:#3D5A4F;--fg3:#4A6259;
--ac:#0A5D44;--ac2:#084D38;--acb:rgba(12,107,78,.05);--acl:#E8F5EF;
--ok:#0C6B4E;--okb:rgba(12,107,78,.05);
--no:#8B2020;--nob:rgba(155,44,44,.04);
--wn:#7A5C10;--wnb:rgba(139,105,20,.04);
--gd:#8B6914;
--r:14px;--r2:20px;
--f:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;
--sh:0 1px 2px rgba(0,0,0,.04),0 2px 8px rgba(0,0,0,.03);
--sh2:0 4px 12px rgba(0,0,0,.06),0 12px 40px rgba(0,0,0,.04);
--sh3:0 8px 24px rgba(0,0,0,.08),0 24px 64px rgba(0,0,0,.06);
--fo:0 0 0 3px rgba(12,107,78,.2)
}
@media(prefers-color-scheme:dark){:root{
--bg:#0F1114;--bg2:#161921;--s1:#1A1D26;--s2:#1F2230;
--bd:rgba(255,255,255,.05);--bd2:rgba(255,255,255,.08);
--fg:#E8ECE9;--fg2:#94A39B;--fg3:#8FA69C;
--ac:#4ADE80;--ac2:#22C55E;--acb:rgba(74,222,128,.06);--acl:rgba(74,222,128,.08);
--ok:#4ADE80;--okb:rgba(74,222,128,.06);
--no:#F06060;--nob:rgba(248,113,113,.05);
--wn:#FBBF24;--wnb:rgba(251,191,36,.05);
--gd:#FBBF24;
--sh:0 1px 2px rgba(0,0,0,.2);--sh2:0 4px 12px rgba(0,0,0,.15);--sh3:0 8px 24px rgba(0,0,0,.2)
}}
[data-theme="dark"]{
--bg:#0F1114;--bg2:#161921;--s1:#1A1D26;--s2:#1F2230;
--bd:rgba(255,255,255,.05);--bd2:rgba(255,255,255,.08);
--fg:#E8ECE9;--fg2:#94A39B;--fg3:#8FA69C;
--ac:#4ADE80;--ac2:#22C55E;--acb:rgba(74,222,128,.06);--acl:rgba(74,222,128,.08);
--ok:#4ADE80;--okb:rgba(74,222,128,.06);
--no:#F06060;--nob:rgba(248,113,113,.05);
--wn:#FBBF24;--wnb:rgba(251,191,36,.05);
--gd:#FBBF24;
--sh:0 1px 2px rgba(0,0,0,.2);--sh2:0 4px 12px rgba(0,0,0,.15);--sh3:0 8px 24px rgba(0,0,0,.2)
}

/* ═══════ BASE ═══════ */
*,*::before,*::after{box-sizing:border-box}
.ntq-immersive-body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:var(--f);-webkit-font-smoothing:antialiased;min-height:100vh}
.ntq-immersive-mode{min-height:100vh;display:flex;flex-direction:column}
.ntq-app{font-family:var(--f);color:var(--fg)}
@keyframes Zin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes Zsp{to{transform:rotate(360deg)}}
@keyframes Zpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
@keyframes Zshine{0%{background-position:200% 50%}100%{background-position:-200% 50%}}

/* ═══════ LOADER ═══════ */
.Z-load{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:16px;color:var(--fg3)}
.Z-spin{width:36px;height:36px;border:3px solid var(--bd2);border-top-color:var(--ac);border-radius:50%;animation:Zsp .7s linear infinite}

/* ═══════ HEADER ═══════ */
.Z-hdr{display:flex;align-items:center;justify-content:space-between;padding:0 28px;height:60px;background:var(--s1);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:100}
.Z-brand{font-weight:900;font-size:.95rem;color:var(--ac);text-decoration:none;letter-spacing:-.01em}
.Z-brand span{color:var(--fg);font-weight:600;margin-left:2px}
.Z-steps{display:flex;gap:4px;align-items:center}
.Z-dot{width:8px;height:8px;border-radius:50%;background:var(--bd2);transition:all .35s ease}
.Z-dot.done{background:var(--ac);width:8px}
.Z-dot.now{background:var(--ac);width:28px;border-radius:4px;box-shadow:0 0 12px rgba(12,107,78,.2)}
.Z-hdr-acts{display:flex;align-items:center;gap:8px}
.Z-dm{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--bd2);background:none;color:var(--fg3);cursor:pointer;transition:all .2s}
.Z-dm:hover{background:var(--acb);color:var(--ac);border-color:var(--ac)}
.Z-exit{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--bd2);background:none;color:var(--fg3);font-size:1.15rem;cursor:pointer;text-decoration:none;transition:all .2s}
.Z-exit:hover{background:var(--nob);color:var(--no);border-color:var(--no)}
.Z-exit:focus-visible,.Z-dm:focus-visible{outline:none;box-shadow:var(--fo)}

/* ═══════ CONTAINER ═══════ */
.Z-c{max-width:980px;margin:0 auto;padding:36px 28px 56px}
.Z-title{margin-bottom:32px}
.Z-title h1{font-size:1.85rem;font-weight:900;margin:0 0 6px;letter-spacing:-.03em;line-height:1.15}
.Z-title p{color:var(--fg3);font-size:.9rem;margin:0}

/* ═══════ BACK ═══════ */
.Z-bk{display:inline-flex;align-items:center;gap:5px;padding:7px 12px;background:none;border:none;color:var(--fg3);font-size:.82rem;font-weight:600;cursor:pointer;border-radius:8px;margin-bottom:18px;transition:all .15s}
.Z-bk:hover{color:var(--fg);background:var(--s2)}.Z-bk:focus-visible{outline:none;box-shadow:var(--fo)}

/* ═══════ BUTTONS ═══════ */
.Z-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:15px 34px;background:var(--ac);color:#fff;font-weight:700;font-size:.95rem;border:none;border-radius:12px;cursor:pointer;transition:all .18s;text-decoration:none;box-shadow:0 2px 8px rgba(12,107,78,.15)}
.Z-btn:hover{background:var(--ac2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(12,107,78,.2)}
.Z-btn:focus-visible{outline:none;box-shadow:var(--fo)}.Z-btn:disabled{opacity:.35;cursor:not-allowed;transform:none;box-shadow:none}
.Z-btn-go{padding:17px 44px;font-size:1.05rem;border-radius:14px;animation:Zpulse 2.5s ease infinite}
.Z-btn-g{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:13px 26px;background:none;color:var(--fg2);font-weight:600;font-size:.88rem;border:1.5px solid var(--bd2);border-radius:12px;cursor:pointer;transition:all .15s;text-decoration:none}
.Z-btn-g:hover{background:var(--s1);color:var(--fg);border-color:var(--ac)}
.Z-btn-locked{opacity:.3;cursor:not-allowed;animation:none!important}

/* ═══════ DASHBOARD ═══════ */
.Z-dash{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}
.Z-dash-i{display:flex;align-items:center;gap:7px;padding:10px 16px;background:var(--s1);border-radius:12px;font-size:.8rem;box-shadow:var(--sh)}
.Z-dash-i span{font-size:1.05rem}.Z-dash-i b{font-weight:700;color:var(--fg)}
.Z-dash-i.fire{background:linear-gradient(135deg,#FFF7ED,#FED7AA);color:#9A3412}
.Z-dash-i.fire b{color:#C2410C}
[data-theme="dark"] .Z-dash-i.fire{background:linear-gradient(135deg,#431407,#7C2D12)}
.Z-dash-i.warn{background:var(--wnb)}

/* ═══════ WELCOME ═══════ */
.Z-welcome{padding:24px;background:var(--s1);border-radius:var(--r2);margin-bottom:24px;box-shadow:var(--sh)}
.Z-welcome h2{font-size:1.15rem;font-weight:900;margin:0 0 14px}
.Z-wel-stats{display:flex;gap:14px;flex-wrap:wrap}
.Z-wel-s{padding:10px 16px;background:var(--s2);border-radius:10px;font-size:.75rem;color:var(--fg3)}
.Z-wel-s b{display:block;font-size:1.15rem;font-weight:900;color:var(--fg)}
.Z-wel-s.fire b{color:var(--gd)}
.Z-wel-badges{display:flex;gap:5px;margin-top:12px;font-size:1.15rem}

/* ═══════ WEEKLY ═══════ */
.Z-weekly{display:flex;align-items:center;padding:18px 22px;background:linear-gradient(135deg,var(--s1),var(--acl));border:1px solid var(--bd);border-radius:var(--r2);margin-bottom:24px;box-shadow:var(--sh);gap:16px;flex-wrap:wrap}
.Z-weekly.done{border-color:var(--ac)}
.Z-weekly-left{flex:1;min-width:0}
.Z-weekly-badge{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--ac);display:block;margin-bottom:4px}
.Z-weekly strong{display:block;font-size:.92rem;color:var(--fg)}
.Z-weekly-fac{font-size:.72rem;color:var(--fg3)}
.Z-weekly-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}
.Z-weekly-btn{padding:9px 18px;background:var(--ac);color:#fff;border:none;border-radius:10px;font-weight:700;font-size:.8rem;cursor:pointer;transition:all .15s}
.Z-weekly-btn:hover{background:var(--ac2);transform:translateY(-1px)}
.Z-weekly-timer{font-size:.65rem;font-weight:700;color:var(--fg3)}.Z-weekly-score{font-size:.85rem;font-weight:800;color:var(--ac)}

/* ═══════ FACULTY ═══════ */
.Z-fac-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.Z-fac{display:flex;align-items:center;gap:16px;padding:22px 24px;background:var(--s1);border-radius:var(--r);cursor:pointer;transition:all .2s ease;text-align:left;box-shadow:var(--sh);border:1.5px solid transparent;animation:Zin .35s ease both}
.Z-fac:hover{box-shadow:var(--sh2);transform:translateY(-3px);border-color:var(--fc,var(--ac))}
.Z-fac:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-fac-ico{font-size:1.8rem;width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:var(--s2);border-radius:14px;flex-shrink:0}
.Z-fac:hover .Z-fac-ico{background:var(--acl)}
.Z-fac-body{flex:1;min-width:0}.Z-fac-body strong{display:block;font-size:.92rem;color:var(--fg);line-height:1.3}
.Z-fac-body span{display:block;font-size:.73rem;color:var(--fg3);margin-top:3px}
.Z-fac-ar{color:var(--fg3);flex-shrink:0;transition:all .2s;opacity:.4}
.Z-fac:hover .Z-fac-ar{opacity:1;transform:translateX(4px);color:var(--ac)}

/* ═══════ QUICK ROW ═══════ */
.Z-quick-row{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}
.Z-quick-btn{display:flex;align-items:center;gap:8px;padding:15px 22px;background:var(--s1);border:1.5px solid var(--bd);border-radius:var(--r);cursor:pointer;font-weight:700;font-size:.88rem;color:var(--fg);transition:all .18s;flex:1;justify-content:center;box-shadow:var(--sh)}
.Z-quick-btn span:first-child{font-size:1.15rem}
.Z-quick-btn:hover{border-color:var(--ac);box-shadow:var(--sh2);transform:translateY(-2px)}
.Z-quick-btn.mistakes:hover{border-color:#B45309}
.Z-quick-btn.qfire:hover{border-color:#6366F1}
.Z-quick-n{font-size:.68rem;background:var(--s2);padding:2px 8px;border-radius:8px;color:var(--fg3)}

/* ═══════ PROGRAMME ═══════ */
.Z-prog-list{display:flex;flex-direction:column;gap:6px}
.Z-prog{display:flex;align-items:center;gap:14px;padding:17px 20px;background:var(--s1);border-radius:var(--r);cursor:pointer;transition:all .18s;text-align:left;box-shadow:var(--sh);border:1.5px solid transparent;animation:Zin .25s ease both}
.Z-prog:hover{border-color:var(--ac);box-shadow:var(--sh2);transform:translateX(6px)}
.Z-prog:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-prog-n{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:var(--s2);border-radius:9px;font-weight:800;font-size:.72rem;color:var(--fg3);flex-shrink:0;transition:all .18s}
.Z-prog:hover .Z-prog-n{background:var(--ac);color:#fff}
.Z-prog-name{flex:1;font-weight:600;font-size:.9rem;color:var(--fg)}
.Z-prog-q{font-size:.72rem;font-weight:700;color:var(--ac);background:var(--acl);padding:4px 12px;border-radius:20px;flex-shrink:0}
.Z-prog svg{flex-shrink:0;color:var(--fg3);opacity:.3;transition:all .18s}.Z-prog:hover svg{opacity:1;transform:translateX(4px);color:var(--ac)}

/* ═══════ CONFIG ═══════ */
.Z-cfg{max-width:600px;margin:0 auto}
.Z-cfg-sec{margin-bottom:36px}
.Z-cfg-lbl{display:block;font-size:.7rem;font-weight:800;letter-spacing:.14em;color:var(--fg3);margin-bottom:14px;text-transform:uppercase}
.Z-lvl-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.Z-sem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.Z-lvl,.Z-sem{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 14px;background:var(--s1);border:2px solid var(--bd);border-radius:var(--r);cursor:pointer;font-weight:800;font-size:1.25rem;color:var(--fg2);transition:all .2s;gap:4px;box-shadow:var(--sh)}
.Z-lvl span{font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3)}
.Z-sem{font-size:1rem;padding:22px 18px}
.Z-lvl:hover,.Z-sem:hover{border-color:var(--ac);color:var(--fg);box-shadow:var(--sh2);transform:translateY(-2px)}
.Z-lvl.on,.Z-sem.on{background:var(--ac);color:#fff;border-color:var(--ac);box-shadow:0 4px 20px rgba(12,107,78,.2)}
.Z-lvl.on span{color:rgba(255,255,255,.7)}
.Z-cfg-go{text-align:center;margin-top:36px}

/* ═══════ COURSES ═══════ */
.Z-crs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.Z-crs{display:flex;flex-direction:column;padding:0;background:var(--s1);border-radius:var(--r);cursor:pointer;transition:all .22s;text-align:left;overflow:hidden;box-shadow:var(--sh);border:1.5px solid transparent;animation:Zin .3s ease both}
.Z-crs:hover{border-color:var(--ac);box-shadow:var(--sh2);transform:translateY(-4px)}
.Z-crs:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-crs-top{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 0;gap:8px}
.Z-crs-code{font-weight:900;font-size:1.1rem;color:var(--ac);letter-spacing:.01em}
.Z-crs-cu{font-size:.63rem;font-weight:700;color:var(--fg3);background:var(--s2);padding:3px 8px;border-radius:6px}
.Z-crs-name{display:block;padding:8px 18px 0;font-weight:600;font-size:.84rem;color:var(--fg);line-height:1.4;flex:1}
.Z-crs-q{display:block;padding:12px 18px 16px;font-size:.72rem;color:var(--fg3)}
.Z-crs-hist{font-size:.68rem;font-weight:700;color:var(--ac);background:var(--acl);padding:3px 8px;border-radius:6px}
.Z-crs-pg{display:flex;align-items:center;gap:6px;margin-top:8px}.Z-crs-ring{width:32px;height:32px;flex-shrink:0}
.Z-crs-pg span{font-size:.72rem;font-weight:800;color:var(--ac)}

/* ═══════ ALT SUGGESTIONS ═══════ */
.Z-alt{margin-top:20px;padding:18px;background:var(--s1);border-radius:var(--r);box-shadow:var(--sh)}
.Z-alt-t{font-weight:700;font-size:.84rem;margin:0 0 10px;color:var(--fg2)}
.Z-alt-chips{display:flex;gap:8px;flex-wrap:wrap}
.Z-chip{padding:8px 16px;background:var(--s2);border:1px solid var(--bd2);border-radius:24px;font-size:.78rem;font-weight:600;cursor:pointer;color:var(--fg2);transition:all .15s}
.Z-chip:hover{border-color:var(--ac);color:var(--ac);background:var(--acl)}
.Z-chip span{color:var(--fg3)}

/* ═══════ STUDY PLAN ═══════ */
.Z-plan{margin-top:20px;padding:18px;background:var(--s1);border-radius:var(--r);box-shadow:var(--sh)}
.Z-plan-t{font-weight:800;font-size:.88rem;margin:0 0 12px}
.Z-plan-row{display:flex;gap:8px;align-items:center}
.Z-plan-in{padding:10px 14px;border:1.5px solid var(--bd2);border-radius:8px;background:var(--s2);color:var(--fg);font-size:.84rem;font-family:var(--f)}
.Z-plan-in:focus{border-color:var(--ac);outline:none}
.Z-plan-btn{padding:10px 18px;background:var(--ac);color:#fff;border:none;border-radius:8px;font-weight:700;font-size:.82rem;cursor:pointer}
.Z-plan-out{margin-top:10px}.Z-plan-r{font-size:.84rem;color:var(--fg);margin:4px 0}.Z-plan-r b{color:var(--ac)}
.Z-plan-bar{height:8px;background:var(--s2);border-radius:4px;overflow:hidden;margin:6px 0}
.Z-plan-barf{height:100%;background:var(--ac);border-radius:4px}

/* ═══════ DIFFICULTY ═══════ */
.Z-dif-list{display:flex;flex-direction:column;gap:10px}
.Z-dif{display:flex;align-items:center;gap:0;padding:0;background:var(--s1);border:1.5px solid transparent;border-left:5px solid var(--dc);border-radius:var(--r);cursor:pointer;transition:all .2s;text-align:left;box-shadow:var(--sh);overflow:hidden;position:relative;animation:Zin .3s ease both}
.Z-dif:hover{border-color:var(--dc);box-shadow:var(--sh2);transform:translateX(6px)}
.Z-dif:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-dif-left{padding:20px 22px;min-width:140px;border-right:1px solid var(--bd)}
.Z-dif-left strong{display:block;font-size:1.02rem;color:var(--dc);margin-bottom:2px}
.Z-dif-tag{font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3)}
.Z-dif-mid{flex:1;padding:20px 18px}
.Z-dif-mid p{margin:0;font-size:.83rem;color:var(--fg2);line-height:1.45}
.Z-dif-unlock{display:block;margin-top:6px;font-size:.72rem;font-weight:700;color:var(--dc);padding:4px 10px;background:var(--acl);border-radius:6px;display:inline-block}
.Z-dif-right{display:flex;align-items:center;gap:14px;padding:20px 22px}
.Z-dif-bars{display:flex;gap:3px;align-items:flex-end}
.Z-dif-bar{width:5px;height:10px;background:var(--bd2);border-radius:2px;transition:all .2s}
.Z-dif-bar.on{background:var(--dc)}
.Z-dif-bar:nth-child(2){height:15px}.Z-dif-bar:nth-child(3){height:20px}.Z-dif-bar:nth-child(4){height:25px}
.Z-dif svg{flex-shrink:0;color:var(--fg3);opacity:.3;transition:all .18s}
.Z-dif:hover svg{opacity:1;transform:translateX(4px);color:var(--dc)}
.Z-dif-lock{font-size:1.15rem;flex-shrink:0}
.Z-dif-locked{opacity:.75}.Z-dif-locked:hover{opacity:1}
.Z-dif-hover{position:absolute;bottom:0;left:0;right:0;padding:11px 16px;background:var(--dc);color:#fff;font-size:.78rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;opacity:0;transform:translateY(100%);transition:all .25s}
.Z-dif-locked:hover .Z-dif-hover{opacity:1;transform:translateY(0)}
.Z-d-easy:hover{background:rgba(12,107,78,.02)}.Z-d-moderate:hover{background:rgba(139,105,20,.02)}
.Z-d-hard:hover{background:rgba(155,44,44,.02)}.Z-d-godmode:hover{background:rgba(124,58,237,.02)}

/* ═══════ PROFILE ═══════ */
.Z-profile{max-width:520px;margin:0 auto;animation:Zin .45s ease both}
.Z-prof-hero{text-align:center;margin-bottom:32px}
.Z-prof-av{font-size:3.8rem;margin-bottom:10px}
.Z-prof-hero h1{font-size:1.7rem;font-weight:900;margin:0 0 6px;letter-spacing:-.02em}
.Z-prof-hero p{color:var(--fg3);font-size:.9rem;margin:0}
.Z-prof-form{display:flex;flex-direction:column;gap:18px;margin-bottom:32px}
.Z-prof-field label{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--fg3);margin-bottom:8px}
.Z-prof-in{display:block;width:100%;padding:16px 20px;border:2px solid var(--bd2);border-radius:14px;background:var(--s1);color:var(--fg);font-size:1.05rem;font-weight:600;font-family:var(--f);transition:all .2s;box-shadow:var(--sh)}
.Z-prof-in:focus{border-color:var(--ac);outline:none;box-shadow:var(--fo)}
.Z-prof-in::placeholder{color:var(--fg3);font-weight:400}
.Z-prof-benefits{margin-bottom:28px}
.Z-prof-benefits h3{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3);margin:0 0 14px}
.Z-prof-blist{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.Z-prof-b{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:var(--s1);border-radius:12px;box-shadow:var(--sh)}
.Z-prof-b span{font-size:1.35rem;flex-shrink:0;margin-top:2px}
.Z-prof-b b{display:block;font-size:.84rem;color:var(--fg);margin-bottom:2px}
.Z-prof-b p{margin:0;font-size:.72rem;color:var(--fg3);line-height:1.35}
.Z-prof-action{text-align:center;margin-bottom:14px}
.Z-prof-note{text-align:center;font-size:.72rem;color:var(--fg3);margin:0}
@media(max-width:480px){.Z-prof-blist{grid-template-columns:1fr}}

/* ═══════ BRIEFING ═══════ */
.Z-brf{text-align:center;max-width:540px;margin:0 auto;animation:Zin .4s ease both}
.Z-brf-head{margin-bottom:28px}
.Z-brf-ico{font-size:3rem;display:block;margin-bottom:8px}
.Z-brf h1{font-size:1.85rem;font-weight:900;margin:0 0 6px;letter-spacing:-.02em}
.Z-brf-head p{color:var(--fg2);font-size:.9rem;margin:0 0 12px}
.Z-brf-tag{display:inline-block;padding:6px 18px;background:var(--acl);color:var(--ac);font-size:.8rem;font-weight:700;border-radius:24px}
.Z-brf-rules{text-align:left;margin-bottom:8px}
.Z-brf-r{display:flex;align-items:flex-start;gap:14px;padding:15px 18px;background:var(--s1);border-radius:12px;margin-bottom:8px;box-shadow:var(--sh)}
.Z-brf-r>span:first-child{font-size:1.25rem;flex-shrink:0}
.Z-brf-r b{display:block;font-size:.9rem;color:var(--fg)}
.Z-brf-r em{display:block;font-size:.74rem;color:var(--fg3);font-style:normal;margin-top:2px}
.Z-brf-player{text-align:center;font-size:.88rem;color:var(--fg2);margin-bottom:18px}.Z-brf-player b{color:var(--ac)}
.Z-brf-modes{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.Z-brf-mode{text-align:left}
.Z-toggle{display:flex;align-items:center;gap:14px;cursor:pointer;padding:16px 18px;background:var(--s1);border-radius:12px;box-shadow:var(--sh)}
.Z-toggle input{display:none}
.Z-toggle-s{width:48px;height:26px;background:var(--bd2);border-radius:13px;position:relative;transition:background .2s;flex-shrink:0}
.Z-toggle-s::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.Z-toggle input:checked+.Z-toggle-s{background:var(--ac)}
.Z-toggle input:checked+.Z-toggle-s::after{transform:translateX(22px)}
.Z-toggle-t{font-weight:700;font-size:.88rem;color:var(--fg)}
.Z-toggle-t em{display:block;font-style:normal;font-weight:400;font-size:.76rem;color:var(--fg3);margin-top:2px}
.Z-ad-slot{min-height:0;margin-bottom:16px}.Z-ad-slot:empty{display:none}

/* ═══════ EMPTY ═══════ */
.Z-empty{text-align:center;padding:56px 24px;color:var(--fg3);font-size:.88rem}
.Z-empty span{font-size:2.8rem;display:block;margin-bottom:10px}

/* ═══════ QUIZ ═══════ */
.Z-quiz{max-width:660px;margin:0 auto;padding:20px 24px;width:100%}
.Z-qh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.Z-qh-c{font-weight:800;font-size:.9rem}.Z-offline{font-size:.6rem;font-weight:700;background:var(--wnb);color:var(--wn);padding:2px 7px;border-radius:4px;margin-left:6px;vertical-align:middle}
.Z-qh-n{font-size:.8rem;color:var(--fg3);font-weight:700;font-variant-numeric:tabular-nums}
.Z-qh-x{background:none;border:1.5px solid var(--bd2);font-size:1rem;cursor:pointer;color:var(--fg3);padding:5px 12px;border-radius:8px;transition:all .15s}
.Z-qh-x:hover{background:var(--nob);color:var(--no);border-color:var(--no)}
.Z-bar{height:4px;background:var(--s2);border-radius:2px;margin-bottom:18px;overflow:hidden}
.Z-bar-f{height:100%;background:linear-gradient(90deg,var(--ac2),var(--ac));border-radius:2px;transition:width .4s}
.Z-qm{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:20px}
.Z-tmr{position:relative;width:60px;height:60px;display:flex;align-items:center;justify-content:center}.Z-tmr svg{width:60px;height:60px}
.Z-tn{position:absolute;font-size:1.15rem;font-weight:900;font-variant-numeric:tabular-nums;transition:color .2s}.Z-tn.wrn{color:var(--wn)}.Z-tn.dng{color:var(--no)}
.Z-pts{font-size:.8rem;font-weight:700;color:var(--fg2);background:var(--s1);padding:7px 16px;border-radius:24px;box-shadow:var(--sh)}
.Z-sks{display:flex;gap:3px}.Z-sk{font-size:1rem;opacity:.2;transition:opacity .2s}.Z-sk.x{opacity:1}
.Z-qt{text-align:center;margin-bottom:24px}
.Z-qn{font-size:.68rem;color:var(--fg3);font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.Z-qt h2{font-size:1.2rem;font-weight:700;margin:10px 0 0;line-height:1.55}

/* ═══════ OPTIONS ═══════ */
.Z-os{display:flex;flex-direction:column;gap:9px;margin-bottom:18px}
.Z-o{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--s1);border:1.5px solid var(--bd);border-radius:var(--r);cursor:pointer;transition:all .15s;text-align:left;font-size:.92rem;box-shadow:var(--sh);animation:Zin .22s ease both}
.Z-o:nth-child(1){animation-delay:0s}.Z-o:nth-child(2){animation-delay:.04s}.Z-o:nth-child(3){animation-delay:.08s}.Z-o:nth-child(4){animation-delay:.12s}
.Z-o:hover:not(:disabled){border-color:var(--ac);background:var(--acl);box-shadow:var(--sh2);transform:translateX(5px)}
.Z-o:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-o.ok{border-color:var(--ok);background:var(--okb)}.Z-o.no{border-color:var(--no);background:var(--nob)}.Z-o.dm{opacity:.28}
.Z-ol{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--s2);border-radius:10px;font-weight:800;font-size:.78rem;flex-shrink:0;color:var(--fg3);transition:all .15s}
.Z-o:hover:not(:disabled) .Z-ol{background:var(--acl);color:var(--ac)}
.Z-o.ok .Z-ol{background:var(--ok);color:#fff}.Z-o.no .Z-ol{background:var(--no);color:#fff}
.Z-ot{flex:1;line-height:1.5}.Z-om{margin-left:auto;font-weight:800;font-size:1.15rem;flex-shrink:0}
.Z-om.ok{color:var(--ok)}.Z-om.no{color:var(--no)}

/* ═══════ FEEDBACK ═══════ */
.Z-fb{padding:18px 20px;border-radius:var(--r);margin-bottom:16px;font-weight:700;font-size:.95rem}
.Z-fb.ok{background:var(--okb);border:1.5px solid var(--ok)}.Z-fb.no{background:var(--nob);border:1.5px solid var(--no)}
.Z-fb p{font-weight:400;font-size:.84rem;color:var(--fg2);margin:6px 0 0}.Z-fb-h{opacity:.5;font-style:italic}
.Z-nav{text-align:center;margin:16px 0 10px}.Z-over{font-size:1.1rem;font-weight:800;color:var(--no);margin-bottom:14px}
.Z-idl{text-align:center;padding:.7rem;font-size:.8rem;font-weight:700;color:var(--wn);background:var(--wnb);border-radius:10px;margin-top:10px}

/* ═══════ RESULTS HERO ═══════ */
.Z-rh{position:relative;border-radius:var(--r2);overflow:hidden;margin-bottom:28px;text-align:center;padding:40px 28px}
.Z-rh-bg{position:absolute;inset:0}
.Z-rh-ct{position:relative;z-index:1}
.Z-rh-i{font-size:3.5rem;display:block;margin-bottom:10px}
.Z-rh h2{font-size:1.7rem;font-weight:900;margin:0 0 6px;color:#fff;letter-spacing:-.02em}
.Z-rh p{font-size:.88rem;margin:0 0 12px;color:rgba(255,255,255,.7)}
.Z-rh-d{display:inline-block;padding:5px 16px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.15);border-radius:24px;font-size:.72rem;font-weight:700;color:rgba(255,255,255,.85)}
.Z-rh-gold .Z-rh-bg{background:linear-gradient(135deg,#78350F,#B45309,#D97706)}
.Z-rh-green .Z-rh-bg{background:linear-gradient(135deg,#064E3B,#047857,#059669)}
.Z-rh-amber .Z-rh-bg{background:linear-gradient(135deg,#713F12,#A16207,#CA8A04)}
.Z-rh-red .Z-rh-bg{background:linear-gradient(135deg,#7F1D1D,#991B1B,#B91C1C)}

/* ═══════ RESULTS SCORE ═══════ */
.Z-rs{display:flex;align-items:center;gap:28px;margin-bottom:24px;padding:22px;background:var(--s1);border-radius:var(--r);box-shadow:var(--sh)}
.Z-rs-ring{position:relative;width:120px;height:120px;flex-shrink:0}
.Z-rs-ring svg{width:100%;height:100%}
.Z-rs-pct{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.Z-rs-pct b{display:block;font-size:2.2rem;font-weight:900;line-height:1}
.Z-rs-pct span{font-size:.72rem;font-weight:700;color:var(--fg3)}
.Z-rs-bars{flex:1;display:flex;flex-direction:column;gap:12px}
.Z-rs-r{display:grid;grid-template-columns:90px 30px 1fr;align-items:center;gap:8px}
.Z-rs-lb{font-size:.8rem;font-weight:600;color:var(--fg2);display:flex;align-items:center;gap:7px}
.Z-rs-dt{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.Z-rs-dt.ok{background:var(--ok)}.Z-rs-dt.no{background:var(--no)}.Z-rs-dt.to{background:var(--wn)}
.Z-rs-vl{font-size:.84rem;font-weight:800;text-align:right}.Z-rs-vl.ok{color:var(--ok)}.Z-rs-vl.no{color:var(--no)}.Z-rs-vl.to{color:var(--wn)}
.Z-rs-br{height:8px;background:var(--s2);border-radius:4px;overflow:hidden}
.Z-rs-fl{height:100%;border-radius:4px;transition:width .6s}.Z-rs-fl.ok{background:var(--ok)}.Z-rs-fl.no{background:var(--no)}.Z-rs-fl.to{background:var(--wn)}

/* ═══════ RESULTS METRICS ═══════ */
.Z-rm{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:24px}
.Z-rmc{text-align:center;padding:18px 12px;background:var(--s1);border-radius:var(--r);box-shadow:var(--sh)}
.Z-rmc b{display:block;font-size:1.35rem;font-weight:900;color:var(--fg);margin-bottom:3px}
.Z-rmc span{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3)}

/* ═══════ RESULTS FEATURES ═══════ */
.Z-feat-row{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;justify-content:center}
.Z-feat-card{display:flex;align-items:center;gap:8px;padding:11px 16px;background:var(--s1);border-radius:10px;font-size:.82rem;box-shadow:var(--sh)}
.Z-feat-card span{font-size:1.1rem}.Z-feat-card b{font-weight:700;color:var(--fg)}
.Z-feat-card.fire{background:linear-gradient(135deg,#FFF7ED,#FFEDD5)}.Z-feat-card.hist{background:var(--acl)}
[data-theme="dark"] .Z-feat-card.fire{background:linear-gradient(135deg,#431407,#7C2D12)}
[data-theme="dark"] .Z-feat-card.hist{background:rgba(74,222,128,.06)}

/* Badges, Topics, Suggestion, Challenge, Notes, Share, Groups, Courseware, etc. */
.Z-new-badges{display:flex;align-items:center;gap:8px;padding:13px 16px;background:linear-gradient(135deg,#FFFBEB,#FEF3C7);border:1px solid rgba(245,158,11,.15);border-radius:12px;font-size:.85rem;font-weight:700;color:var(--fg);margin-bottom:16px;flex-wrap:wrap}
[data-theme="dark"] .Z-new-badges{background:linear-gradient(135deg,#451A03,#78350F)}
.Z-badges{text-align:center;margin-bottom:16px}
.Z-badges-t{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3);display:block;margin-bottom:8px}
.Z-badges-row{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.Z-badge{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--s1);border-radius:11px;font-size:1.3rem;box-shadow:var(--sh);transition:transform .15s}.Z-badge:hover{transform:scale(1.15)}
.Z-badge.locked{opacity:.15;filter:grayscale(1)}
.Z-badge-next{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:.75rem;color:var(--fg3);font-weight:600}
.Z-badge-prog{flex:1;height:6px;background:var(--s2);border-radius:3px;overflow:hidden}
.Z-badge-progf{height:100%;background:var(--ac);border-radius:3px}

.Z-topics{padding:16px 18px;background:var(--s1);border-radius:12px;margin-bottom:16px;box-shadow:var(--sh)}
.Z-topics-hd{font-weight:700;font-size:.84rem;margin-bottom:10px;color:var(--fg)}
.Z-topics-list{display:flex;flex-direction:column;gap:6px}
.Z-topic-row{display:grid;grid-template-columns:100px 1fr 36px;align-items:center;gap:8px}
.Z-topic-name{font-size:.8rem;font-weight:600;color:var(--fg)}
.Z-topic-bar{height:6px;background:var(--s2);border-radius:3px;overflow:hidden}
.Z-topic-fill{height:100%;background:var(--no);border-radius:3px}
.Z-topic-cnt{font-size:.7rem;font-weight:700;color:var(--no);text-align:right}

.Z-ecw{display:flex;align-items:center;gap:8px;padding:13px 16px;background:var(--acl);border-radius:12px;font-size:.84rem;color:var(--fg);margin-bottom:16px;box-shadow:var(--sh)}
.Z-suggest{display:flex;align-items:center;gap:8px;padding:13px 16px;background:var(--acl);border:1px solid var(--ac);border-radius:12px;font-size:.85rem;font-weight:600;color:var(--fg);margin-bottom:16px}
.Z-suggest.warn{background:var(--wnb);border-color:var(--wn)}
.Z-suggest-link{color:var(--ac);font-weight:700;text-decoration:none;margin-left:4px}.Z-suggest-link:hover{text-decoration:underline}

.Z-chal{margin-bottom:24px;text-align:center}
.Z-chal-t{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);margin:0 0 8px}
.Z-chal-box{display:flex;gap:0;border-radius:10px;overflow:hidden;box-shadow:var(--sh);max-width:480px;margin:0 auto}
.Z-chal-in{flex:1;padding:11px 14px;border:none;background:var(--s2);color:var(--fg);font-size:.78rem;font-family:var(--f);outline:none;min-width:0}
.Z-chal-btn{padding:11px 20px;background:var(--ac);color:#fff;border:none;font-weight:700;font-size:.8rem;cursor:pointer;transition:background .15s}

.Z-study-grp{display:flex;align-items:center;gap:8px;padding:13px 16px;background:var(--s1);border-radius:12px;font-size:.82rem;color:var(--fg2);margin-bottom:16px;flex-wrap:wrap;box-shadow:var(--sh)}
.Z-grp-btn{padding:6px 16px;border-radius:8px;font-size:.76rem;font-weight:700;text-decoration:none;color:#fff}
.Z-grp-btn.wa{background:#128C3E}.Z-grp-btn.tg{background:#229ED9}

.Z-notes{text-align:center;margin-bottom:16px}
.Z-notes-btn{padding:11px 22px;background:var(--s1);border:1.5px solid var(--bd2);border-radius:12px;font-weight:700;font-size:.84rem;color:var(--fg);cursor:pointer;transition:all .15s;box-shadow:var(--sh)}
.Z-notes-btn:hover{border-color:var(--ac);background:var(--acl)}
.Z-contrib{text-align:center;padding:13px 16px;background:linear-gradient(135deg,#FFFBEB,#FEF3C7);border-radius:12px;font-size:.84rem;font-weight:600;color:var(--fg);margin-bottom:16px;box-shadow:var(--sh)}
[data-theme="dark"] .Z-contrib{background:linear-gradient(135deg,#451A03,#78350F)}

/* Share + Actions */
.Z-rsh-w{margin-bottom:24px;text-align:center}
.Z-rsh-t{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);margin:0 0 10px}
.Z-rsh-r{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.Z-rsh{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:10px;font-size:.8rem;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .15s;color:#fff;box-shadow:var(--sh)}
.Z-rsh.wa{background:#128C3E}.Z-rsh.tw{background:#1A6DBF}.Z-rsh.cp{background:var(--s2);color:var(--fg2);border:1px solid var(--bd2)}
.Z-rsh:hover{transform:translateY(-2px);box-shadow:var(--sh2)}
.Z-ract{text-align:center;margin-bottom:28px}
.Z-ract-2{display:flex;gap:10px;justify-content:center;margin-top:12px}

/* Leaderboard */
.Z-lb{border-radius:var(--r);overflow:hidden;margin-bottom:24px;background:var(--s1);box-shadow:var(--sh)}
.Z-lb-hd{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--bd)}
.Z-lb-hd h3{font-size:.9rem;font-weight:800;margin:0;display:flex;align-items:center;gap:6px}
.Z-lb-hd span{font-size:.72rem;color:var(--fg3);font-weight:600}
.Z-lb-save{display:flex;gap:8px;padding:14px 18px;border-bottom:1px solid var(--bd);align-items:center}
.Z-lb-in{flex:1;padding:9px 14px;border:1.5px solid var(--bd2);border-radius:8px;background:var(--s2);color:var(--fg);font-size:.84rem;font-family:var(--f);outline:none}.Z-lb-in:focus{border-color:var(--ac)}
.Z-lb-table{padding:6px 0}
.Z-lb-row{display:flex;align-items:center;gap:10px;padding:11px 18px;font-size:.84rem;border-bottom:1px solid var(--bd);transition:background .1s}
.Z-lb-row:last-child{border-bottom:none}.Z-lb-row.top{font-weight:700}.Z-lb-row.you{background:var(--acl)}
.Z-lb-rank{width:28px;text-align:center;flex-shrink:0;font-size:.9rem}
.Z-lb-name{flex:1;color:var(--fg);font-weight:600}.Z-lb-pct{font-weight:800;color:var(--ac);min-width:40px;text-align:right}
.Z-lb-sc{font-size:.72rem;color:var(--fg3);min-width:50px;text-align:right}

/* Review Accordion */
.Z-rrv{border-top:1px solid var(--bd);padding-top:24px}
.Z-rrv-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.Z-rrv-hd h3{font-size:.88rem;font-weight:800;margin:0;text-transform:uppercase;letter-spacing:.04em}
.Z-rrv-hd span{font-size:.78rem;color:var(--fg3);font-weight:600}
.Z-rrv-d{border-radius:var(--r);margin-bottom:6px;overflow:hidden;background:var(--s1);box-shadow:var(--sh)}
.Z-rrv-d.rok{border-left:4px solid var(--ok)}.Z-rrv-d.rno{border-left:4px solid var(--no)}.Z-rrv-d.rto{border-left:4px solid var(--wn)}
.Z-rrv-d summary{display:flex;align-items:center;gap:10px;padding:13px 18px;cursor:pointer;list-style:none;font-size:.86rem}
.Z-rrv-d summary::-webkit-details-marker{display:none}
.Z-rrv-d summary::after{content:'+';margin-left:auto;font-size:1rem;color:var(--fg3);transition:transform .2s}
.Z-rrv-d[open] summary::after{content:'\2212'}
.Z-rrv-n{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:var(--s2);font-size:.72rem;font-weight:800;color:var(--fg3);flex-shrink:0}
.Z-rrv-q{flex:1;font-weight:600;color:var(--fg);line-height:1.35}
.Z-rrv-b{font-size:.65rem;font-weight:700;padding:3px 9px;border-radius:6px;flex-shrink:0;white-space:nowrap}
.Z-rrv-b.rok{background:var(--okb);color:var(--ok)}.Z-rrv-b.rno{background:var(--nob);color:var(--no)}.Z-rrv-b.rto{background:var(--wnb);color:var(--wn)}
.Z-rrv-bd{padding:0 18px 16px;border-top:1px solid var(--bd)}
.Z-rrv-o{display:flex;align-items:center;gap:8px;padding:9px 12px;margin-top:6px;border-radius:8px;font-size:.84rem;color:var(--fg2)}
.Z-rrv-o.correct{background:var(--okb);color:var(--fg);font-weight:600}
.Z-rrv-o.wrong{background:var(--nob);color:var(--fg)}
.Z-rrv-ol{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:var(--s2);font-size:.7rem;font-weight:800;flex-shrink:0;color:var(--fg3)}
.Z-rrv-o.correct .Z-rrv-ol{background:var(--ok);color:#fff}.Z-rrv-o.wrong .Z-rrv-ol{background:var(--no);color:#fff}
.Z-rrv-ck{color:var(--ok);font-weight:700;font-size:.78rem}.Z-rrv-x{color:var(--no);font-size:.72rem;font-weight:600}
.Z-rrv-exp{margin-top:10px;padding:12px 14px;background:var(--s2);border-radius:8px;font-size:.82rem;color:var(--fg2);line-height:1.55}
.Z-report{display:inline-flex;align-items:center;gap:4px;margin-top:10px;padding:5px 12px;background:none;border:1px solid var(--bd2);border-radius:6px;font-size:.72rem;font-weight:600;color:var(--fg3);cursor:pointer;transition:all .15s}
.Z-report:hover{border-color:var(--wn);color:var(--wn);background:var(--wnb)}

/* ═══════ MOBILE NAV ═══════ */
.Z-mob-nav{display:none}
@media(max-width:640px){
.Z-mob-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:200;background:var(--s1);border-top:1px solid var(--bd);padding:8px 12px calc(8px + env(safe-area-inset-bottom));justify-content:space-around;align-items:center;box-shadow:0 -2px 12px rgba(0,0,0,.04)}
.Z-mn-i{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.62rem;font-weight:600;color:var(--fg3);text-decoration:none;background:none;border:none;cursor:pointer;padding:5px 8px;border-radius:8px;transition:all .12s}.Z-mn-i:hover,.Z-mn-i:active{color:var(--ac);background:var(--acl)}
.Z-mn-step{color:var(--ac);font-weight:700}
.Z-c{padding-bottom:80px}
}

/* ═══════ RESPONSIVE ═══════ */
@media(max-width:640px){
.Z-c{padding:24px 18px 80px}.Z-title h1{font-size:1.4rem}
.Z-fac-grid{grid-template-columns:1fr}
.Z-lvl-grid{grid-template-columns:repeat(3,1fr)}.Z-lvl,.Z-sem{padding:20px 12px;font-size:1.05rem}
.Z-crs-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.Z-quiz{padding:14px 16px}.Z-qt h2{font-size:1.02rem}.Z-o{padding:14px 16px;gap:12px;font-size:.88rem}
.Z-hdr{padding:0 18px;height:52px}
.Z-rs{flex-direction:column;gap:18px}.Z-rs-ring{width:100px;height:100px}.Z-rs-pct b{font-size:1.7rem}
.Z-rm{grid-template-columns:repeat(2,1fr)}
.Z-rh{padding:32px 20px}.Z-rh h2{font-size:1.35rem}
}
@media(max-width:400px){.Z-lvl-grid{grid-template-columns:repeat(3,1fr)}.Z-crs-grid,.Z-sem-grid{grid-template-columns:1fr}}

/* ═══════ BRIEFING MODES ═══════ */
.Z-brf-modes{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;text-align:left}
.Z-brf-mode{text-align:left}
.Z-toggle{display:flex;align-items:center;gap:14px;cursor:pointer;padding:16px 18px;background:var(--s1);border-radius:12px;box-shadow:var(--sh)}
.Z-toggle input{display:none}
.Z-toggle-s{width:48px;height:26px;background:var(--bd2);border-radius:13px;position:relative;transition:background .2s;flex-shrink:0}
.Z-toggle-s::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.Z-toggle input:checked+.Z-toggle-s{background:var(--ac)}
.Z-toggle input:checked+.Z-toggle-s::after{transform:translateX(22px)}
.Z-toggle-t{font-weight:700;font-size:.88rem;color:var(--fg)}
.Z-toggle-t em{display:block;font-style:normal;font-weight:400;font-size:.76rem;color:var(--fg3);margin-top:2px}

/* ═══════ BEAT THE BOT ═══════ */

/* Intro Screen */
.Z-bot-intro{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70vh;text-align:center;padding:40px 20px;animation:Zin .5s ease both}
.Z-bot-intro-vs{display:flex;align-items:center;gap:24px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}
.Z-bot-you,.Z-bot-rival{padding:28px 24px;background:var(--s1);border-radius:20px;box-shadow:var(--sh2);min-width:140px;text-align:center}
.Z-bot-you span,.Z-bot-rival span{font-size:2.8rem;display:block;margin-bottom:8px}
.Z-bot-you b,.Z-bot-rival b{display:block;font-size:1rem;font-weight:800;margin-bottom:2px}
.Z-bot-you em,.Z-bot-rival em{font-style:normal;font-size:.75rem;color:var(--fg3);font-weight:600}
.Z-bot-rival{border:2px solid var(--no);background:linear-gradient(135deg,var(--s1),var(--nob))}
.Z-bot-vs{font-size:1.5rem;font-weight:900;color:var(--fg3)}
.Z-bot-intro-diff{font-size:.85rem;color:var(--fg3);margin:0 0 20px}

/* Score Bar */
.Z-sbar-wrap{margin-bottom:14px}
.Z-sbar{display:flex;justify-content:space-between;height:32px;border-radius:8px;overflow:hidden;background:var(--nob);position:relative;font-size:.7rem;font-weight:700}
.Z-sbar::before{content:'';position:absolute;top:0;left:0;bottom:0;width:var(--pp,50%);background:var(--acl);border-right:2px solid var(--ac);transition:width .5s ease}
.Z-sbar-p,.Z-sbar-b{position:relative;z-index:1;padding:0 12px;display:flex;align-items:center;color:var(--fg)}
.Z-sbar-b{color:var(--no)}

/* Bot Panel */
.Z-bot-panel{padding:12px 16px;background:var(--s1);border:1.5px solid var(--bd);border-radius:12px;margin-bottom:14px;min-height:52px;display:flex;align-items:center}
.Z-bot-waiting{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--fg3)}
.Z-bot-waiting span:first-child{font-size:1.3rem}
.Z-bot-thinking{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--fg2);animation:Zpulse 1s ease infinite}
.Z-bot-thinking .Z-bot-dots{font-size:1.3rem}
.Z-bot-answer{display:flex;align-items:center;gap:10px;font-size:.88rem;font-weight:700}
.Z-bot-ok{color:var(--ok)}.Z-bot-no{color:var(--no)}
.Z-bot-pick{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;font-weight:800;font-size:.8rem;color:#fff}
.Z-bot-ok .Z-bot-pick{background:var(--ok)}.Z-bot-no .Z-bot-pick{background:var(--no)}

/* Bot Results */
.Z-bot-result{text-align:center;padding:32px 20px;animation:Zin .5s ease both}
.Z-bot-result-hd{font-size:1.7rem;font-weight:900;margin-bottom:28px;color:var(--fg)}
.Z-bot-result-vs{display:flex;align-items:stretch;gap:0;justify-content:center;margin-bottom:24px;flex-wrap:wrap}
.Z-bot-rp{flex:1;min-width:140px;padding:28px 20px;background:var(--s1);border-radius:20px;box-shadow:var(--sh);text-align:center;transition:all .3s}
.Z-bot-rp.win{box-shadow:var(--sh3);border:2px solid var(--ac);transform:scale(1.04)}
.Z-bot-rp span{font-size:2.4rem;display:block;margin-bottom:6px}
.Z-bot-rp b{display:block;font-size:.9rem;font-weight:800;margin-bottom:8px}
.Z-bot-rpct{font-size:2.8rem;font-weight:900;line-height:1;margin-bottom:4px}
.Z-bot-rp.win .Z-bot-rpct{color:var(--ac)}
.Z-bot-rsub{font-size:.72rem;color:var(--fg3)}
.Z-bot-rmid{display:flex;align-items:center;padding:0 20px;font-weight:900;font-size:1.2rem;color:var(--fg3)}
.Z-bot-trash{font-size:.9rem;color:var(--fg2);font-style:italic;margin-bottom:24px;padding:12px 18px;background:var(--s1);border-radius:12px;box-shadow:var(--sh);display:inline-block}
@media(max-width:480px){.Z-bot-intro-vs{flex-direction:column;gap:12px}.Z-bot-result-vs{flex-direction:column;gap:14px}.Z-bot-rmid{padding:10px 0}}

/* ═══════ VISUAL EFFECTS ═══════ */

/* Emoji particle burst */
@keyframes ZvfxBurst{
0%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}
100%{opacity:0;transform:translate(var(--vx),var(--vy)) rotate(var(--rot)) scale(.4)}
}
.Z-vfx-particle{position:fixed;font-size:1.6rem;pointer-events:none;z-index:9999;animation:ZvfxBurst .9s ease-out forwards}

/* Confetti rain */
@keyframes ZvfxConfetti{
0%{opacity:1;transform:translateY(-20px) rotate(0) scale(1)}
100%{opacity:0;transform:translateY(100vh) rotate(720deg) scale(.5)}
}
.Z-vfx-confetti{position:fixed;top:-10px;width:8px;height:12px;border-radius:2px;pointer-events:none;z-index:9998;animation:ZvfxConfetti 2.5s ease-in forwards}

/* Toast popups */
@keyframes ZvfxToastIn{from{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ZvfxToastOut{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.95)}}
.Z-vfx-toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);padding:12px 24px;border-radius:14px;font-size:.88rem;font-weight:700;z-index:9997;pointer-events:none;opacity:0;white-space:nowrap;box-shadow:0 8px 32px rgba(0,0,0,.15)}
.Z-vfx-toast-show{animation:ZvfxToastIn .3s ease forwards,ZvfxToastOut .3s ease 1.6s forwards}
.Z-vfx-win{background:linear-gradient(135deg,#059669,#10B981);color:#fff}
.Z-vfx-lose{background:linear-gradient(135deg,#991B1B,#DC2626);color:#fff}
.Z-vfx-tie{background:var(--s1);color:var(--fg);border:1.5px solid var(--bd2)}

/* ═══════ SLIDE TRANSITION ═══════ */
@keyframes ZslideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

/* ═══════ MUTE BUTTON ═══════ */
.Z-mute{font-size:1rem!important;line-height:1}

/* ═══════ RESUME BANNER ═══════ */
.Z-resume{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;background:linear-gradient(135deg,var(--acl),var(--s1));border:1.5px solid var(--ac);border-radius:var(--r);margin-bottom:20px;box-shadow:var(--sh)}
.Z-resume-left{display:flex;align-items:center;gap:12px}
.Z-resume-left span{font-size:1.5rem}
.Z-resume-left b{display:block;font-size:.88rem;font-weight:800;color:var(--fg)}
.Z-resume-left p{margin:0;font-size:.78rem;color:var(--fg3)}

/* ═══════ DAILY CHALLENGE ═══════ */
.Z-daily{padding:20px;background:var(--s1);border:1.5px solid var(--bd);border-radius:var(--r);margin-bottom:20px;box-shadow:var(--sh)}
.Z-daily.done{display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:600;color:var(--fg2);padding:14px 18px}
.Z-daily.done b{color:var(--ac)}
.Z-daily-hd{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.Z-daily-hd span:first-child{font-size:1.3rem}
.Z-daily-hd b{font-size:.92rem;font-weight:800;color:var(--fg)}
.Z-daily-tag{font-size:.62rem;font-weight:700;background:var(--acl);color:var(--ac);padding:2px 8px;border-radius:6px;margin-left:auto}
.Z-daily-qt{font-weight:700;font-size:.92rem;margin:0 0 12px;color:var(--fg);line-height:1.5}
.Z-daily-opts{display:flex;flex-direction:column;gap:6px}
.Z-daily-opt{display:block;width:100%;text-align:left;padding:12px 16px;background:var(--s2);border:1.5px solid var(--bd);border-radius:10px;font-size:.86rem;font-weight:600;color:var(--fg);cursor:pointer;transition:all .15s;font-family:var(--f)}
.Z-daily-opt:hover:not(:disabled){border-color:var(--ac);background:var(--acl)}
.Z-daily-opt.Z-daily-ok{border-color:var(--ok);background:var(--okb);color:var(--ok)}
.Z-daily-opt.Z-daily-no{border-color:var(--no);background:var(--nob);opacity:.5}
.Z-daily-opt:disabled{cursor:default}

/* ═══════ PERCENTILE ═══════ */
.Z-pctile{text-align:center;padding:14px 16px;background:var(--s1);border-radius:var(--r);margin-bottom:16px;font-size:.86rem;color:var(--fg2);box-shadow:var(--sh)}
.Z-pctile b{color:var(--ac);font-weight:800}
.Z-pctile:empty{display:none}

/* ═══════ JS TOOLTIP ═══════ */
.Z-tip{position:fixed;padding:8px 14px;background:var(--fg);color:var(--bg);font-size:.72rem;font-weight:600;border-radius:8px;max-width:260px;line-height:1.4;z-index:9999;pointer-events:none;box-shadow:0 4px 16px rgba(0,0,0,.15);opacity:0;transition:opacity .15s;white-space:normal}
.Z-tip.show{opacity:1}
.Z-tip::before{content:'';position:absolute;top:-10px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-bottom-color:var(--fg)}
@media(max-width:768px){.Z-tip{display:none!important}}

/* ═══════ UNLOCK POPUP ═══════ */
.Z-unlock-popup{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9990;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .3s}
.Z-unlock-popup.show{opacity:1}
.Z-unlock-box{background:var(--s1);border-radius:20px;padding:32px 28px;max-width:380px;width:100%;text-align:center;box-shadow:var(--sh3);position:relative;transform:scale(.95);transition:transform .3s}
.Z-unlock-popup.show .Z-unlock-box{transform:scale(1)}
.Z-unlock-close{position:absolute;top:12px;right:14px;background:none;border:none;font-size:1.3rem;color:var(--fg3);cursor:pointer;padding:4px 8px;border-radius:6px}
.Z-unlock-close:hover{background:var(--nob);color:var(--no)}
.Z-unlock-icon{font-size:2.8rem;margin-bottom:10px}
.Z-unlock-box h3{font-size:1.2rem;font-weight:900;margin:0 0 8px;color:var(--fg)}
.Z-unlock-box>p{font-size:.86rem;color:var(--fg2);margin:0 0 18px;line-height:1.5}
.Z-unlock-input{display:block;width:100%;padding:14px 18px;border:2px solid var(--bd2);border-radius:12px;background:var(--s2);color:var(--fg);font-size:1rem;font-weight:600;font-family:var(--f);text-align:center;transition:border-color .2s}
.Z-unlock-input:focus{border-color:var(--ac);outline:none;box-shadow:0 0 0 4px rgba(12,107,78,.08)}
.Z-unlock-input::placeholder{font-weight:400;color:var(--fg3)}
.Z-unlock-note{font-size:.7rem;color:var(--fg3);margin:12px 0 0}

/* ═══════ DIFFICULTY PROGRESS BAR ═══════ */
.Z-dif-progress{display:flex;align-items:center;gap:8px;margin-top:8px}
.Z-dif-prog-bar{flex:1;height:6px;background:var(--s2);border-radius:3px;overflow:hidden;min-width:60px}
.Z-dif-prog-fill{height:100%;background:var(--dc);border-radius:3px;transition:width .4s}
.Z-dif-progress span{font-size:.65rem;font-weight:700;color:var(--fg3);white-space:nowrap}

/* ═══════ UNLOCK POPUP — TWO PATHS ═══════ */
.Z-unlock-paths{text-align:left}
.Z-unlock-path{padding:18px;background:var(--s2);border-radius:14px;margin-bottom:0}
.Z-unlock-path-hd{font-weight:800;font-size:.92rem;color:var(--fg);display:flex;align-items:center;gap:6px;margin-bottom:6px}
.Z-unlock-path p{font-size:.82rem;color:var(--fg2);margin:0 0 10px;line-height:1.45}
.Z-unlock-path.sub{background:linear-gradient(135deg,var(--acl),var(--s2));border:1.5px solid var(--ac)}
.Z-unlock-prog{height:8px;background:var(--bd2);border-radius:4px;overflow:hidden;margin-bottom:6px}
.Z-unlock-prog-fill{height:100%;background:var(--ac);border-radius:4px;transition:width .3s}
.Z-unlock-prog-txt{font-size:.72rem;font-weight:700;color:var(--fg3)}
.Z-unlock-divider{text-align:center;padding:12px 0;color:var(--fg3);font-size:.78rem;font-weight:800;display:flex;align-items:center;gap:12px}
.Z-unlock-divider::before,.Z-unlock-divider::after{content:'';flex:1;height:1px;background:var(--bd2)}
.Z-unlock-divider span{flex-shrink:0}

/* ═══════ EXAM SIMULATOR ═══════ */
.Z-exam-wrap{max-width:800px;margin:0 auto;padding:0 20px 60px;animation:Zin .3s ease both}

/* Header */
.Z-exam-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;background:var(--s1);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:50;gap:12px;flex-wrap:wrap}
.Z-exam-hdr-left b{display:block;font-size:.95rem;font-weight:800;color:var(--fg)}
.Z-exam-hdr-left span{font-size:.75rem;color:var(--fg3)}
.Z-exam-timer{font-size:1.6rem;font-weight:900;font-variant-numeric:tabular-nums;color:var(--fg);background:var(--s2);padding:8px 20px;border-radius:12px;letter-spacing:.02em}
.Z-exam-timer.warn{color:var(--wn);background:var(--wnb)}
.Z-exam-timer.danger{color:var(--no);background:var(--nob);animation:Zpulse 1s ease infinite}
.Z-exam-submit{padding:10px 22px;background:var(--ac);color:#fff;border:none;border-radius:10px;font-weight:700;font-size:.85rem;cursor:pointer;transition:all .15s}
.Z-exam-submit:hover{background:var(--ac2);transform:translateY(-1px)}

/* Question Grid */
.Z-exam-grid{display:flex;flex-wrap:wrap;gap:4px;padding:16px 0;justify-content:center}
.Z-exg{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1.5px solid var(--bd2);background:var(--s1);font-size:.75rem;font-weight:700;color:var(--fg3);cursor:pointer;transition:all .12s}
.Z-exg:hover{border-color:var(--ac);color:var(--ac)}
.Z-exg.current{border-color:var(--ac);background:var(--ac);color:#fff;box-shadow:0 2px 8px rgba(12,107,78,.2)}
.Z-exg.answered{background:var(--acl);border-color:var(--ac);color:var(--ac)}
.Z-exg.flagged{border-color:var(--wn);background:var(--wnb);color:var(--wn)}
.Z-exg.answered.flagged{border-color:var(--wn);background:var(--wnb)}

/* Stats */
.Z-exam-stats{display:flex;gap:14px;padding:8px 0 18px;font-size:.78rem;font-weight:600;flex-wrap:wrap}
.Z-exs-a{color:var(--ok)}.Z-exs-u{color:var(--fg3)}.Z-exs-f{color:var(--wn)}

/* Question */
.Z-exam-q{background:var(--s1);border-radius:var(--r2);padding:28px;box-shadow:var(--sh)}
.Z-exam-qn{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--fg3);margin-bottom:10px}
.Z-exam-qt{font-size:1.15rem;font-weight:700;margin:0 0 22px;line-height:1.55;color:var(--fg)}

/* Exam Options — silent selection, no green/red */
.Z-exam-opts{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.Z-exo{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--s2);border:2px solid transparent;border-radius:var(--r);cursor:pointer;text-align:left;transition:all .15s;font-family:var(--f)}
.Z-exo:hover{border-color:var(--ac);background:var(--acl)}
.Z-exo.selected{border-color:var(--ac);background:var(--acl);box-shadow:inset 0 0 0 1px var(--ac)}
.Z-exo-l{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--s1);border-radius:10px;font-weight:800;font-size:.8rem;color:var(--fg3);flex-shrink:0;transition:all .15s}
.Z-exo.selected .Z-exo-l{background:var(--ac);color:#fff}
.Z-exo-t{flex:1;font-size:.92rem;font-weight:500;color:var(--fg);line-height:1.5}
.Z-exo-ck{color:var(--ac);font-weight:800;font-size:1.1rem;flex-shrink:0}

/* Nav */
.Z-exam-nav{display:flex;align-items:center;justify-content:space-between}
.Z-exam-flag{padding:9px 16px;background:none;border:1.5px solid var(--bd2);border-radius:10px;font-size:.82rem;font-weight:600;color:var(--fg3);cursor:pointer;transition:all .15s;font-family:var(--f)}
.Z-exam-flag:hover{border-color:var(--wn);color:var(--wn);background:var(--wnb)}
.Z-exam-flag.on{border-color:var(--wn);color:var(--wn);background:var(--wnb)}
.Z-exam-nav-lr{display:flex;gap:8px}
.Z-exam-prev,.Z-exam-next{padding:10px 20px;background:var(--s2);border:1.5px solid var(--bd2);border-radius:10px;font-weight:700;font-size:.85rem;color:var(--fg);cursor:pointer;transition:all .12s;font-family:var(--f)}
.Z-exam-prev:hover,.Z-exam-next:hover{border-color:var(--ac);color:var(--ac);background:var(--acl)}

/* ═══════ EXAM RESULT SLIP ═══════ */
.Z-exam-slip{max-width:520px;margin:40px auto 0;background:var(--s1);border-radius:var(--r2);overflow:hidden;box-shadow:var(--sh2);border:1px solid var(--bd)}
.Z-slip-hdr{text-align:center;padding:28px 24px 20px;border-bottom:2px solid var(--ac);background:linear-gradient(180deg,var(--acl),transparent)}
.Z-slip-logo{font-size:2.5rem;margin-bottom:6px}
.Z-slip-hdr h2{font-size:1.25rem;font-weight:900;margin:0 0 2px;color:var(--fg)}
.Z-slip-hdr p{font-size:.78rem;color:var(--fg3);margin:0}
.Z-slip-table{width:100%;border-collapse:collapse}
.Z-slip-table td{padding:12px 20px;font-size:.88rem;border-bottom:1px solid var(--bd)}
.Z-slip-table td:first-child{color:var(--fg3);font-weight:600;width:45%}
.Z-slip-table td:last-child{color:var(--fg);font-weight:500}
.Z-slip-ok{color:var(--ok)!important;font-weight:700!important}
.Z-slip-no{color:var(--no)!important;font-weight:700!important}
.Z-slip-to{color:var(--wn)!important;font-weight:700!important}
.Z-slip-score td{font-size:1.1rem!important;background:var(--s2)}
.Z-slip-grade td{font-size:1rem!important}
.Z-slip-g{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;font-size:1.3rem;font-weight:900;color:#fff}
.Z-slip-green{background:var(--ok)}.Z-slip-amber{background:var(--wn)}.Z-slip-red{background:var(--no)}
.Z-slip-verdict{text-align:center;padding:20px;font-size:1.3rem;font-weight:900;color:var(--fg)}

/* Review */
.Z-exam-review{padding:20px 0}
.Z-exam-review h3{font-size:1rem;font-weight:800;margin:0 0 18px}
.Z-exrv-q{margin-bottom:12px;background:var(--s1);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);border-left:4px solid var(--bd)}
.Z-exrv-q.rok{border-left-color:var(--ok)}.Z-exrv-q.rno{border-left-color:var(--no)}.Z-exrv-q.rto{border-left-color:var(--wn)}
.Z-exrv-hd{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;font-size:.88rem}
.Z-exrv-hd span{width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:var(--s2);border-radius:7px;font-weight:800;font-size:.72rem;color:var(--fg3);flex-shrink:0}
.Z-exrv-hd b{font-weight:700;color:var(--fg);line-height:1.45}
.Z-exrv-o{padding:8px 16px 8px 52px;font-size:.84rem;color:var(--fg2)}
.Z-exrv-o.correct{background:var(--okb);color:var(--ok);font-weight:600}
.Z-exrv-o.wrong{background:var(--nob);color:var(--no)}
.Z-exrv-o span{font-weight:800;margin-right:6px}
.Z-exrv-exp{padding:10px 16px 12px 52px;font-size:.8rem;color:var(--fg3);border-top:1px solid var(--bd);font-style:italic}

@media(max-width:640px){
.Z-exam-hdr{padding:12px 16px}.Z-exam-timer{font-size:1.2rem;padding:6px 14px}
.Z-exg{width:30px;height:30px;font-size:.65rem}
.Z-exam-q{padding:20px 16px}.Z-exam-qt{font-size:1rem}
.Z-slip-table td{padding:10px 14px;font-size:.82rem}
}

/* ═══════ WIDER CONTAINER ═══════ */
.Z-c-wide{max-width:1100px}

/* ═══════ HERO BANNER ═══════ */
.Z-hero{display:flex;align-items:center;justify-content:space-between;padding:28px 32px;background:var(--s1);border-radius:var(--r2);margin-bottom:28px;box-shadow:var(--sh);gap:20px;flex-wrap:wrap}
.Z-hero.first{background:linear-gradient(135deg,var(--acl),var(--s1));border:1.5px solid var(--ac)}
.Z-hero-left h1{font-size:1.65rem;font-weight:900;margin:0 0 6px;letter-spacing:-.03em;line-height:1.2}
.Z-hero-left p{color:var(--fg3);font-size:.88rem;margin:0}
.Z-hero-stats{display:flex;gap:8px;flex-wrap:wrap}
.Z-hero-st{padding:10px 18px;background:var(--s2);border-radius:12px;text-align:center;min-width:70px}
.Z-hero-st b{display:block;font-size:1.2rem;font-weight:900;color:var(--fg);line-height:1.2}
.Z-hero-st span{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3)}
.Z-hero-st.fire{background:linear-gradient(135deg,#FFF7ED,#FED7AA)}
.Z-hero-st.fire b{color:#C2410C}
[data-theme="dark"] .Z-hero-st.fire{background:linear-gradient(135deg,#431407,#7C2D12)}

/* ═══════ MODE SELECTION ═══════ */
.Z-mode-title{margin-bottom:20px}
.Z-mode-title h2{font-size:1.3rem;font-weight:900;margin:0;letter-spacing:-.02em}
.Z-mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:28px}
.Z-mode-card{display:flex;flex-direction:column;padding:0;background:var(--s1);border:2px solid transparent;border-radius:var(--r2);cursor:pointer;text-align:left;transition:all .25s;overflow:hidden;box-shadow:var(--sh);animation:Zin .35s ease both}
.Z-mode-card:nth-child(2){animation-delay:.06s}.Z-mode-card:nth-child(3){animation-delay:.12s}
.Z-mode-card:hover{transform:translateY(-8px);box-shadow:var(--sh3);background:var(--s1)}
.Z-mode-card:focus-visible{outline:none;box-shadow:var(--fo)}
.Z-mode-card.practice{border-top:4px solid transparent}
.Z-mode-card.practice:hover{border-color:#059669;border-top:4px solid #059669}
.Z-mode-card.exam{border-top:4px solid transparent}
.Z-mode-card.exam:hover{border-color:#2563EB;border-top:4px solid #2563EB}
.Z-mode-card.bot{border-top:4px solid transparent}
.Z-mode-card.bot:hover{border-color:#7C3AED;border-top:4px solid #7C3AED}
.Z-mode-ico{font-size:2.5rem;padding:28px 24px 12px}
.Z-mode-card h3{font-size:1.1rem;font-weight:800;margin:0 0 6px;padding:0 24px;color:var(--fg)}
.Z-mode-card>p{font-size:.84rem;color:var(--fg2);margin:0;padding:0 24px 18px;line-height:1.5;flex:1}
.Z-mode-features{display:flex;flex-direction:column;gap:4px;padding:14px 24px 20px;background:var(--s2);border-top:1px solid var(--bd);font-size:.75rem;font-weight:600;color:var(--fg3)}
.Z-mode-features span::before{margin-right:4px}

/* Mode badge on briefing */
.Z-brf-modebadge{display:inline-block;padding:7px 18px;background:var(--s2);border:1.5px solid var(--bd2);border-radius:20px;font-size:.82rem;font-weight:700;color:var(--fg2);margin-bottom:18px}

/* ═══════ FACULTY — DASHBOARD LAYOUT ═══════ */
.Z-fac-dash{display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:start}
.Z-fac-main{}
.Z-fac-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:72px}

@media(max-width:900px){

.Z-fac-dash{grid-template-columns:1fr}
.Z-fac-side{position:static}
.Z-hero{flex-direction:column;text-align:center}
.Z-hero-stats{justify-content:center}
}


/* ═══════ SIDEBAR CARDS ═══════ */
.Z-side-card{padding:18px 20px;background:var(--s1);border-radius:var(--r);box-shadow:var(--sh)}
.Z-side-hd{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.Z-side-hd span:first-child{font-size:1.15rem}
.Z-side-hd b{font-size:.88rem;font-weight:800;color:var(--fg)}
.Z-side-tag{font-size:.6rem;font-weight:700;background:var(--acl);color:var(--ac);padding:2px 8px;border-radius:6px;margin-left:auto}
.Z-side-sub{font-size:.82rem;color:var(--fg2);margin:0 0 10px;font-weight:600}
.Z-side-done{font-size:.82rem;font-weight:700;color:var(--ac)}
.Z-side-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;background:var(--s2);border:1.5px solid var(--bd);border-radius:10px;font-size:.84rem;font-weight:700;color:var(--fg);cursor:pointer;transition:all .15s;margin-bottom:6px;text-align:left;font-family:var(--f)}
.Z-side-btn:last-child{margin-bottom:0}
.Z-side-btn span{font-size:.68rem;font-weight:600;color:var(--fg3)}
.Z-side-btn:hover{border-color:var(--ac);background:var(--acl)}
.Z-side-btn.mistakes:hover{border-color:#B45309}

/* ═══════ PREMIUM POLISH ═══════ */

/* Gradient accent line on header */
.Z-hdr::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--ac),transparent 50%)}

/* Mode icons — larger with background circles */
.Z-mode-card.practice .Z-mode-ico{background:linear-gradient(135deg,#ECFDF5,#D1FAE5);border-radius:20px;display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;margin:24px 24px 12px}
.Z-mode-card.exam .Z-mode-ico{background:linear-gradient(135deg,#EFF6FF,#DBEAFE);border-radius:20px;display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;margin:24px 24px 12px}
.Z-mode-card.bot .Z-mode-ico{background:linear-gradient(135deg,#F5F3FF,#EDE9FE);border-radius:20px;display:inline-flex;width:64px;height:64px;align-items:center;justify-content:center;margin:24px 24px 12px}
[data-theme="dark"] .Z-mode-card.practice .Z-mode-ico{background:linear-gradient(135deg,#022c22,#064e3b)}
[data-theme="dark"] .Z-mode-card.exam .Z-mode-ico{background:linear-gradient(135deg,#172554,#1e3a5f)}
[data-theme="dark"] .Z-mode-card.bot .Z-mode-ico{background:linear-gradient(135deg,#2e1065,#3b0764)}

/* Faculty icon circles — gradient backgrounds */
.Z-fac-ico{background:linear-gradient(135deg,var(--s2),var(--acl))}

/* Step dots — more refined */
.Z-dot{width:6px;height:6px;border-radius:3px}
.Z-dot.done{background:var(--ac);width:6px}
.Z-dot.now{width:24px;border-radius:3px;background:var(--ac)}

/* Programme cards — subtle left accent */
.Z-prog{border-left:3px solid transparent;transition:all .18s}
.Z-prog:hover{border-left-color:var(--ac)}

/* Course cards — top accent bar on hover */
.Z-crs::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--ac);transform:scaleX(0);transition:transform .2s;transform-origin:left}
.Z-crs{position:relative}.Z-crs:hover::before{transform:scaleX(1)}

/* Sidebar — subtle left border */
.Z-fac-side{border-left:1px solid var(--bd);padding-left:24px}
@media(max-width:900px){.Z-fac-side{border-left:none;padding-left:0;border-top:1px solid var(--bd);padding-top:20px}}

/* Back button — pill style */
.Z-bk{background:var(--s1);box-shadow:var(--sh);padding:8px 16px;border-radius:20px}

/* Briefing — more dramatic */
.Z-brf-head{padding:32px 0}
.Z-brf-ico{font-size:3.5rem}

/* Overall body gradient */
.ntq-immersive-body{background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);min-height:100vh}


/* ═══════ MOBILE — PREMIUM RESPONSIVE ═══════ */

/* Tablet */
@media(max-width:900px){
.Z-mode-grid{grid-template-columns:1fr 1fr}
.Z-mode-card:nth-child(3){grid-column:span 2}
}

/* Phone */
@media(max-width:640px){

/* Mode cards — stacked full-width cards with compact layout */
.Z-mode-grid{grid-template-columns:1fr;gap:12px}
.Z-mode-card:nth-child(3){grid-column:auto}
.Z-mode-card{display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto;overflow:hidden}
.Z-mode-ico{grid-row:1/3;display:flex;align-items:center;justify-content:center;font-size:2rem;padding:16px;margin:0;width:auto;height:auto;border-radius:0}
.Z-mode-card.practice .Z-mode-ico,.Z-mode-card.exam .Z-mode-ico,.Z-mode-card.bot .Z-mode-ico{margin:0;border-radius:0;width:auto;height:auto}
.Z-mode-card h3{font-size:.95rem;padding:14px 16px 2px 0;margin:0}
.Z-mode-card>p{font-size:.78rem;padding:0 16px 14px 0;margin:0;line-height:1.4}
.Z-mode-features{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;gap:6px;padding:10px 16px 14px;font-size:.68rem}

/* Hero — compact */
.Z-hero{padding:20px;border-radius:16px}
.Z-hero-left h1{font-size:1.2rem}
.Z-hero-stats{gap:6px}
.Z-hero-st{padding:8px 12px;min-width:60px}
.Z-hero-st b{font-size:1rem}
.Z-hero-st span{font-size:.58rem}

/* Mode title */
.Z-mode-title h2{font-size:1.1rem}

/* Difficulty cards — horizontal scroll or compact stack */
.Z-dif-list{gap:8px}
.Z-dif{flex-wrap:wrap}
.Z-dif-left{min-width:auto;padding:14px 16px;border-right:none;border-bottom:1px solid var(--bd)}
.Z-dif-mid{padding:12px 16px}
.Z-dif-right{padding:12px 16px;width:100%;justify-content:space-between;border-top:1px solid var(--bd)}
.Z-dif-progress{margin-top:4px}
.Z-dif-hover{font-size:.72rem;padding:9px 12px}

/* Level grid — 3 columns on small phones */
.Z-lvl-grid{grid-template-columns:repeat(3,1fr);gap:8px}
.Z-lvl{padding:16px 10px;font-size:1rem}
.Z-sem-grid{grid-template-columns:1fr;gap:8px}
.Z-sem{padding:16px 14px;font-size:.9rem}

/* Config — remove extra spacing */
.Z-cfg-sec{margin-bottom:24px}

/* Sidebar on mobile — horizontal scroll cards */
.Z-fac-side{flex-direction:row;overflow-x:auto;gap:10px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.Z-side-card{min-width:260px;flex-shrink:0;scroll-snap-align:start}

/* Faculty grid */
.Z-fac-grid{grid-template-columns:1fr;gap:10px}
.Z-fac{padding:16px 18px;gap:12px}
.Z-fac-ico{width:44px;height:44px;border-radius:12px;font-size:1.5rem}

/* Course grid */
.Z-crs-grid{grid-template-columns:1fr 1fr;gap:8px}
.Z-crs-name{font-size:.78rem;padding:6px 14px 0}
.Z-crs-code{font-size:.95rem}

/* Programme list */
.Z-prog{padding:14px 16px;gap:10px}
.Z-prog-name{font-size:.84rem}

/* Header compact */
.Z-hdr{height:48px;padding:0 14px}
.Z-brand{font-size:.85rem}
.Z-dm,.Z-exit,.Z-mute{width:34px;height:34px;border-radius:8px}

/* Container */
.Z-c{padding:18px 14px 80px}
.Z-c-wide{padding:18px 14px 80px}
.Z-title h1{font-size:1.25rem}

/* Profile */
.Z-prof-hero h1{font-size:1.3rem}
.Z-prof-av{font-size:2.8rem}
.Z-prof-in{padding:12px 16px;font-size:.95rem}

/* Briefing */
.Z-brf h1{font-size:1.4rem}
.Z-brf-ico{font-size:2.8rem}
.Z-brf-r{padding:12px 14px;gap:10px}
.Z-brf-modebadge{font-size:.76rem;padding:6px 14px}

/* Exam grid */
.Z-exam-grid{gap:3px}
.Z-exg{width:28px;height:28px;font-size:.62rem;border-radius:6px}
.Z-exam-hdr{padding:10px 14px}
.Z-exam-timer{font-size:1.15rem;padding:6px 12px;border-radius:8px}
.Z-exam-submit{padding:8px 14px;font-size:.78rem}
.Z-exam-q{padding:18px 14px;border-radius:16px}
.Z-exam-qt{font-size:1rem}
.Z-exo{padding:12px 14px;gap:10px}
.Z-exo-l{width:28px;height:28px;font-size:.72rem;border-radius:8px}

/* Bot intro */
.Z-bot-intro-vs{gap:16px}
.Z-bot-you,.Z-bot-rival{padding:20px 16px;min-width:120px}
.Z-bot-you span,.Z-bot-rival span{font-size:2rem}

/* Results */
.Z-rh{padding:28px 16px;border-radius:16px}
.Z-rh h2{font-size:1.2rem}
.Z-rm{grid-template-columns:repeat(2,1fr);gap:8px}
.Z-rmc{padding:14px 10px}
.Z-rmc b{font-size:1.1rem}

/* Unlock popup */
.Z-unlock-box{padding:24px 20px;border-radius:16px}
.Z-unlock-paths{gap:0}

/* Slip */
.Z-exam-slip{border-radius:16px}
.Z-slip-table td{padding:10px 14px;font-size:.82rem}
}

/* Extra small */
@media(max-width:380px){
.Z-crs-grid{grid-template-columns:1fr}
.Z-lvl-grid{grid-template-columns:repeat(3,1fr)}
.Z-hero-stats{flex-wrap:wrap;justify-content:center}
.Z-mode-card{grid-template-columns:56px 1fr}
.Z-mode-ico{font-size:1.6rem}
}

/* ═══════ FLAG + COMMENT PANEL ═══════ */
.Z-qflag-panel{margin-bottom:12px;border-radius:12px;overflow:hidden;transition:all .2s}
.Z-qflag-panel.open{background:var(--s1);border:1.5px solid var(--wn);box-shadow:var(--sh)}
.Z-qflag-btn{display:flex;align-items:center;gap:8px;padding:10px 18px;background:none;border:1.5px solid var(--bd2);border-radius:12px;font-size:.84rem;font-weight:600;color:var(--fg3);cursor:pointer;transition:all .15s;font-family:var(--f);width:100%}
.Z-qflag-btn span{font-size:1.05rem}
.Z-qflag-btn:hover{border-color:var(--wn);color:var(--wn);background:var(--wnb)}
.Z-qflag-btn.on{border-color:var(--wn);color:var(--wn);background:var(--wnb);font-weight:700;border-radius:12px 12px 0 0;border-bottom:none}
.Z-qflag-form{padding:0 16px 14px}
.Z-qflag-input{display:block;width:100%;padding:10px 14px;border:1.5px solid var(--bd2);border-radius:10px;background:var(--s2);color:var(--fg);font-size:.84rem;font-family:var(--f);resize:vertical;min-height:56px;transition:border-color .15s;line-height:1.5}
.Z-qflag-input:focus{border-color:var(--wn);outline:none}
.Z-qflag-input::placeholder{color:var(--fg3)}
.Z-qflag-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.Z-qflag-save{padding:8px 16px;background:var(--s2);border:1px solid var(--bd2);border-radius:8px;font-size:.78rem;font-weight:600;color:var(--fg2);cursor:pointer;transition:all .12s;font-family:var(--f)}
.Z-qflag-save:hover{background:var(--acl);border-color:var(--ac);color:var(--ac)}
.Z-qflag-report{padding:8px 16px;background:none;border:1px solid var(--no);border-radius:8px;font-size:.78rem;font-weight:600;color:var(--no);cursor:pointer;transition:all .12s;font-family:var(--f)}
.Z-qflag-report:hover{background:var(--nob)}
.Z-rrv-d.rflag{border-left-color:var(--wn)!important}

/* ═══════ PREMIUM RESULTS PAGE ═══════ */
.Z-res{max-width:860px;margin:0 auto;padding:0 20px 40px;animation:Zin .4s ease both}

/* Hero banner */
.Z-res-hero{position:relative;border-radius:24px;overflow:hidden;text-align:center;padding:48px 28px 40px;margin-bottom:24px}
.Z-res-hero-bg{position:absolute;inset:0;z-index:0}
.Z-res-hero-ct{position:relative;z-index:1}
.Z-res-icon{font-size:4rem;display:block;margin-bottom:12px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15))}
.Z-res-hero h1{font-size:2rem;font-weight:900;margin:0 0 6px;color:#fff;letter-spacing:-.03em;line-height:1.15}
.Z-res-hero p{font-size:.92rem;margin:0 0 16px;color:rgba(255,255,255,.75)}
.Z-res-badge{display:inline-block;padding:6px 20px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18);border-radius:24px;font-size:.76rem;font-weight:700;color:rgba(255,255,255,.9);letter-spacing:.01em}

/* Hero gradients per grade */
.Z-res-gold .Z-res-hero-bg{background:linear-gradient(135deg,#78350F 0%,#B45309 40%,#D97706 70%,#F59E0B 100%)}
.Z-res-green .Z-res-hero-bg{background:linear-gradient(135deg,#064E3B 0%,#047857 40%,#059669 70%,#10B981 100%)}
.Z-res-amber .Z-res-hero-bg{background:linear-gradient(135deg,#713F12 0%,#A16207 40%,#CA8A04 70%,#EAB308 100%)}
.Z-res-red .Z-res-hero-bg{background:linear-gradient(135deg,#7F1D1D 0%,#991B1B 40%,#B91C1C 70%,#DC2626 100%)}

/* Score grid: donut left, metrics right */
.Z-res-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px}
.Z-res-score-card{background:var(--s1);border-radius:20px;padding:28px;box-shadow:var(--sh2);display:flex;flex-direction:column;align-items:center;gap:20px}
.Z-res-donut{position:relative;width:140px;height:140px}
.Z-res-donut svg{width:100%;height:100%}
.Z-res-pct{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.Z-res-pct b{display:block;font-size:2.8rem;font-weight:900;line-height:1;color:var(--fg)}
.Z-res-pct span{font-size:.85rem;font-weight:700;color:var(--fg3)}
.Z-res-breakdown{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.Z-res-br-item{display:flex;align-items:center;gap:6px;font-size:.84rem;color:var(--fg2)}
.Z-res-br-item b{font-weight:800;font-size:1rem}
.Z-res-br-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.Z-res-br-item.ok .Z-res-br-dot{background:var(--ok)}.Z-res-br-item.ok b{color:var(--ok)}
.Z-res-br-item.no .Z-res-br-dot{background:var(--no)}.Z-res-br-item.no b{color:var(--no)}
.Z-res-br-item.to .Z-res-br-dot{background:var(--wn)}.Z-res-br-item.to b{color:var(--wn)}

.Z-res-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.Z-res-tile{background:var(--s1);border-radius:16px;padding:22px 16px;text-align:center;box-shadow:var(--sh);transition:transform .15s}
.Z-res-tile:hover{transform:translateY(-3px)}
.Z-res-tile-v{font-size:1.6rem;font-weight:900;color:var(--fg);line-height:1.2;margin-bottom:4px}
.Z-res-tile-l{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3)}

/* Override old result styles to not conflict */
.Z-rh{display:none}.Z-rs{display:none}.Z-rm{display:none}

@media(max-width:640px){
.Z-res-hero{padding:36px 20px 32px;border-radius:20px}
.Z-res-hero h1{font-size:1.5rem}
.Z-res-icon{font-size:3rem}
.Z-res-grid{grid-template-columns:1fr}
.Z-res-score-card{padding:22px}
.Z-res-donut{width:120px;height:120px}
.Z-res-pct b{font-size:2.2rem}
.Z-res-metrics{grid-template-columns:1fr 1fr}
.Z-res-tile{padding:16px 12px}
.Z-res-tile-v{font-size:1.25rem}
}

/* ═══════ RESULTS — ORGANIZED DASHBOARD ═══════ */

/* Quick Actions Bar */
.Z-res-actions{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}
.Z-res-act{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 20px;background:var(--s1);border:1.5px solid var(--bd);border-radius:14px;font-size:.72rem;font-weight:700;color:var(--fg2);cursor:pointer;transition:all .15s;text-decoration:none;min-width:72px;font-family:var(--f);box-shadow:var(--sh)}
.Z-res-act span{font-size:1.2rem}
.Z-res-act:hover{border-color:var(--ac);color:var(--ac);background:var(--acl);transform:translateY(-2px);box-shadow:var(--sh2)}

/* Two-column insights */
.Z-res-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px}

/* Panels */
.Z-res-panel{background:var(--s1);border-radius:18px;padding:22px;box-shadow:var(--sh);margin-bottom:16px}
.Z-res-panel:last-child{margin-bottom:0}
.Z-res-panel-hd{display:flex;align-items:center;gap:8px;font-size:.88rem;font-weight:800;color:var(--fg);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--bd)}
.Z-res-panel-hd span:first-child{font-size:1.15rem}
.Z-res-panel-count{font-size:.68rem;font-weight:600;color:var(--fg3);background:var(--s2);padding:2px 10px;border-radius:10px;margin-left:auto}

/* Stat rows */
.Z-res-stat{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--bd)}
.Z-res-stat:last-child{border-bottom:none}
.Z-res-stat-i{font-size:1.3rem;flex-shrink:0;width:36px;text-align:center}
.Z-res-stat div b{display:block;font-size:.88rem;font-weight:700;color:var(--fg);margin-bottom:1px}
.Z-res-stat div span{font-size:.74rem;color:var(--fg3)}

/* New badges notification */
.Z-res-new-badges{background:linear-gradient(135deg,#FFFBEB,#FEF3C7);padding:10px 14px;border-radius:10px;font-size:.82rem;font-weight:700;color:var(--fg);margin-bottom:14px}
[data-theme="dark"] .Z-res-new-badges{background:linear-gradient(135deg,#451A03,#78350F)}

/* Badges grid */
.Z-res-badges-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.Z-res-badge-item{display:flex;align-items:center;justify-content:center;aspect-ratio:1;background:var(--s2);border-radius:10px;font-size:1.2rem;transition:transform .12s}
.Z-res-badge-item:hover{transform:scale(1.15)}
.Z-res-badge-item.locked{opacity:.12;filter:grayscale(1)}
.Z-res-next-badge{display:flex;align-items:center;gap:8px;font-size:.72rem;color:var(--fg3);font-weight:600;margin-top:12px;padding-top:10px;border-top:1px solid var(--bd)}
.Z-res-next-bar{flex:1;height:5px;background:var(--s2);border-radius:3px;overflow:hidden}
.Z-res-next-bar div{height:100%;background:var(--ac);border-radius:3px}

/* Topics */
.Z-res-topics-hd{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3);margin-bottom:10px}
.Z-res-topic{display:grid;grid-template-columns:90px 1fr 30px;align-items:center;gap:8px;padding:6px 0}
.Z-res-topic span:first-child{font-size:.8rem;font-weight:600;color:var(--fg)}
.Z-res-topic span:last-child{font-size:.72rem;font-weight:700;color:var(--no);text-align:right}
.Z-res-topic-bar{height:6px;background:var(--s2);border-radius:3px;overflow:hidden}
.Z-res-topic-bar div{height:100%;background:var(--no);border-radius:3px}

/* Links */
.Z-res-link{display:flex;align-items:center;gap:8px;padding:12px 14px;background:var(--acl);border-radius:10px;font-size:.82rem;font-weight:600;color:var(--ac);text-decoration:none;margin-top:12px;transition:all .12s}
.Z-res-link:hover{background:var(--ac);color:#fff}
.Z-res-link.upgrade{background:linear-gradient(135deg,var(--acl),var(--s2));border:1px solid var(--ac)}
.Z-res-link.warn{background:var(--wnb);color:var(--wn)}

/* Community panel */
.Z-res-grp-link{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;font-size:.82rem;font-weight:600;color:#fff;text-decoration:none;margin-bottom:6px;transition:all .12s}
.Z-res-grp-link.wa{background:#128C3E}.Z-res-grp-link.tg{background:#229ED9}
.Z-res-grp-link:hover{opacity:.9;transform:translateX(4px)}

.Z-res-chal{margin-top:12px;padding-top:12px;border-top:1px solid var(--bd)}
.Z-res-chal-lbl{font-size:.76rem;font-weight:700;color:var(--fg3);display:block;margin-bottom:8px}
.Z-res-chal-row{display:flex;gap:0;border-radius:10px;overflow:hidden;box-shadow:var(--sh)}
.Z-res-chal-in{flex:1;padding:10px 12px;border:none;background:var(--s2);color:var(--fg);font-size:.76rem;font-family:var(--f);outline:none;min-width:0}
.Z-res-chal-btn{padding:10px 18px;background:var(--ac);color:#fff;border:none;font-weight:700;font-size:.78rem;cursor:pointer}

.Z-res-share{display:flex;gap:8px;margin-top:10px}
.Z-res-sh{flex:1;padding:10px;border-radius:8px;text-align:center;font-size:.76rem;font-weight:700;text-decoration:none;color:#fff;transition:opacity .12s}
.Z-res-sh.wa{background:#128C3E}.Z-res-sh.tw{background:#1A6DBF}
.Z-res-sh:hover{opacity:.85}

.Z-res-contrib{margin-top:10px;padding:10px 14px;background:linear-gradient(135deg,#FFFBEB,#FEF3C7);border-radius:10px;font-size:.82rem;font-weight:600;color:var(--fg)}
.Z-res-contrib a{color:var(--ac);text-decoration:none;font-weight:700}
[data-theme="dark"] .Z-res-contrib{background:linear-gradient(135deg,#451A03,#78350F)}

/* Leaderboard full width */
.Z-res-lb{margin-bottom:24px}
.Z-res-lb .Z-lb-save{border-bottom:1px solid var(--bd);padding-bottom:12px;margin-bottom:12px}

/* Hide old scattered classes */
.Z-feat-row,.Z-new-badges,.Z-badges,.Z-topics,.Z-ecw,.Z-suggest,.Z-chal,.Z-notes,.Z-contrib,.Z-study-grp,.Z-rsh-w,.Z-ract,.Z-pctile{display:none!important}

@media(max-width:640px){
.Z-res-cols{grid-template-columns:1fr}
.Z-res-actions{gap:6px}
.Z-res-act{padding:10px 14px;min-width:60px;font-size:.65rem}
.Z-res-act span{font-size:1rem}
.Z-res-panel{padding:18px 16px;border-radius:14px}
.Z-res-badges-grid{grid-template-columns:repeat(8,1fr);gap:4px}
.Z-res-badge-item{font-size:1rem}
}