:root{--ink:#12172d;--muted:#62677c;--blue:#5068ff;--purple:#775bf6;--coral:#ff765f;--line:#e5e7f0;--green:#2da46f;--mono:'DM Mono',monospace;--sans:'Manrope',sans-serif}*{box-sizing:border-box}body{min-height:100vh;margin:0;background:#fff;color:var(--ink);font-family:var(--sans);line-height:1.55}.grain{position:fixed;z-index:40;inset:0;pointer-events:none;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.site-header{position:sticky;z-index:20;top:0;display:flex;align-items:center;justify-content:space-between;width:min(1160px,calc(100% - 48px));height:80px;margin:auto;background:rgba(255,255,255,.9);backdrop-filter:blur(15px)}.brand{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-size:25px;font-weight:800;letter-spacing:-1.7px;text-decoration:none}.brand-mark{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;background:var(--ink);color:#fff;font-size:18px;letter-spacing:-2px}.brand-dot{color:var(--coral)}.nav-links{display:flex;gap:28px}.nav-links a,.header-link{color:#565b70;font-size:12px;font-weight:800;text-decoration:none}.nav-links a.active,.nav-links a:hover,.header-link:hover{color:var(--blue)}.header-link{padding:10px 13px;border:1px solid var(--line);border-radius:9px}.header-link span{font-size:16px}.page{width:min(1080px,calc(100% - 48px));margin:auto;padding:62px 0 90px}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:55px;align-items:center;min-height:500px}.eyebrow{margin:0 0 13px;color:#73778b;font:500 10px var(--mono);letter-spacing:1.2px}.hero h1,.page-title{max-width:660px;margin:0;font-size:clamp(38px,5vw,59px);line-height:1.08;letter-spacing:-3px}.hero h1 em,.page-title em{color:var(--purple);font-family:Georgia,serif;font-weight:400}.intro{max-width:510px;margin:22px 0 28px;color:var(--muted);font-size:16px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:47px;padding:12px 18px;border:0;border-radius:11px;background:var(--blue);box-shadow:0 8px 20px rgba(80,104,255,.2);color:#fff;font:800 13px var(--sans);text-decoration:none;cursor:pointer;transition:.2s}.button:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(80,104,255,.27)}.button.secondary{border:1px solid #dce0ed;background:#fff;box-shadow:none;color:var(--ink)}.button.danger{background:#ef6357}.button:disabled{cursor:not-allowed;opacity:.6;transform:none}.hero-card,.card{border:1px solid #e2e5ef;border-radius:17px;background:#fff;box-shadow:0 22px 45px rgba(25,30,65,.1)}.hero-card{position:relative;overflow:hidden;padding:27px;background:#6757df;color:#fff}.hero-card:after{position:absolute;right:-76px;bottom:-92px;width:240px;height:240px;border:29px solid rgba(255,255,255,.15);border-radius:50%;content:''}.hero-card small{color:#ddd9ff;font:500 9px var(--mono);letter-spacing:1px}.hero-card h2{position:relative;z-index:1;max-width:320px;margin:18px 0 12px;font-size:30px;line-height:1.12;letter-spacing:-1.6px}.hero-card p{position:relative;z-index:1;max-width:310px;color:#e5e1ff;font-size:12px}.skill-pills{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:7px;margin-top:28px}.skill-pills span{padding:6px 8px;border-radius:6px;background:rgba(255,255,255,.14);font:500 9px var(--mono)}.info-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:36px}.info-strip div{padding:15px;border:1px solid var(--line);border-radius:11px}.info-strip b{display:block;font-size:13px}.info-strip span{color:#7b8092;font-size:10px}.form-page{display:grid;grid-template-columns:.88fr 1.12fr;gap:55px;align-items:start}.side-copy{padding-top:30px}.side-copy h1,.section-title{margin:0;font-size:37px;line-height:1.12;letter-spacing:-2px}.side-copy h1 em,.section-title em{color:var(--coral);font-family:Georgia,serif;font-weight:400}.side-copy p:not(.eyebrow){color:var(--muted);font-size:14px}.theme-list{display:grid;gap:9px;margin-top:25px}.theme-list div{display:flex;align-items:center;gap:11px;color:#666b7d;font-size:12px;font-weight:700}.theme-list b{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#efedff;color:#6954e5;font:500 9px var(--mono)}.card{padding:29px}.card h2{margin:0;font-size:24px;letter-spacing:-1px}.form-note{margin:6px 0 22px;color:#777c8e;font-size:12px}.student-form{display:grid;gap:16px}.field{display:grid;gap:7px;color:#565b6e;font-size:11px;font-weight:800}.field input,.field select,.code-input{width:100%;height:47px;padding:0 12px;border:1px solid #dce0eb;border-radius:9px;background:#fff;color:var(--ink);font:13px var(--sans);outline-color:var(--blue)}.privacy-note{margin:2px 0 0;color:#868a9a;font-size:10px;line-height:1.6}.error{margin:0;color:#bf3e37;font-size:11px;font-weight:700}.quiz-shell{max-width:800px;margin:auto}.quiz-top{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:23px}.quiz-top h1{margin:0;font-size:29px;letter-spacing:-1.5px}.progress-copy{color:#71768a;font:500 10px var(--mono)}.progress{height:7px;margin-top:10px;overflow:hidden;border-radius:999px;background:#eaebf2}.progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--purple));transition:width .2s}.quiz-card{padding:33px}.theme-badge{display:inline-block;padding:5px 8px;border-radius:6px;background:#f1efff;color:#6550dd;font:500 9px var(--mono);letter-spacing:.6px}.question{margin:18px 0 25px;font-size:24px;line-height:1.3;letter-spacing:-.9px}.answers{display:grid;gap:10px}.answer{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #e1e4ee;border-radius:10px;background:#fff;color:#4f5467;font-size:13px;font-weight:700;cursor:pointer;text-align:left}.answer:hover{border-color:#b9c0dc}.answer.selected{border-color:var(--blue);background:#f4f5ff;color:var(--ink)}.answer-key{display:grid;place-items:center;width:23px;height:23px;border:1px solid #d9dde9;border-radius:7px;color:#7c8191;font:500 10px var(--mono)}.answer.selected .answer-key{border:0;background:var(--blue);color:#fff}.quiz-actions{display:flex;justify-content:space-between;align-items:center;margin-top:25px}.quiz-actions small{color:#8a8e9d;font-size:10px}.result-hero{display:grid;grid-template-columns:.8fr 1.2fr;gap:35px;align-items:center;padding:37px;background:#f4f3ff}.result-score{display:grid;place-content:center;width:185px;height:185px;margin:auto;border:15px solid #ded9ff;border-top-color:var(--purple);border-right-color:var(--purple);border-radius:50%;text-align:center;transform:rotate(-20deg)}.result-score strong,.result-score span{transform:rotate(20deg)}.result-score strong{font-size:55px;letter-spacing:-4px}.result-score span{color:#78768c;font:500 10px var(--mono)}.result-copy h1{margin:0;font-size:34px;letter-spacing:-2px}.result-copy p{color:#6e7284;font-size:13px}.rank-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.rank-pills div{padding:11px;border:1px solid #e1def6;border-radius:9px;background:#fff;color:#727687;font-size:10px}.rank-pills b{display:block;color:var(--ink);font-size:16px}.score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:18px}.score-item{padding:15px;border:1px solid var(--line);border-radius:10px}.score-item span{display:block;color:#777c8e;font-size:10px}.score-item b{display:block;margin-top:5px;font-size:20px}.score-item i{display:block;height:5px;margin-top:8px;overflow:hidden;border-radius:5px;background:#edf0f6}.score-item i em{display:block;height:100%;border-radius:inherit;background:var(--purple)}.scoreboard-header{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:28px}.scoreboard-header p{max-width:470px;margin:9px 0 0;color:var(--muted);font-size:13px}.tabs{display:flex;gap:6px;padding:4px;border-radius:10px;background:#f1f2f7}.tabs button{padding:8px 10px;border:0;border-radius:7px;background:transparent;color:#707587;font:700 10px var(--sans);cursor:pointer}.tabs button.active{background:#fff;box-shadow:0 2px 7px rgba(30,35,65,.1);color:var(--ink)}.board-layout{display:grid;grid-template-columns:1fr .75fr;gap:18px}.board-card{padding:0;overflow:hidden}.table-head,.score-row{display:grid;grid-template-columns:72px 1fr 75px;align-items:center;gap:10px;padding:14px 18px}.table-head{background:#f7f8fc;color:#868b9d;font:500 9px var(--mono);letter-spacing:.4px}.score-row{min-height:58px;border-top:1px solid #edf0f5;color:#626779;font-size:12px}.score-row strong{color:var(--ink)}.rank{color:#6b58df;font:500 12px var(--mono)}.score-value{text-align:right;font:700 12px var(--mono);color:#474c62}.board-aside{padding:23px;background:var(--ink);color:#fff}.board-aside h2{margin:0 0 9px;font-size:20px}.board-aside p{color:#bcc1d4;font-size:11px}.board-aside div{margin-top:19px;padding:11px;border-radius:8px;background:#272e50;color:#d4d8e9;font-size:10px}.empty{padding:38px 20px;color:#858a9a;text-align:center;font-size:12px}.teacher-login{max-width:470px;margin:35px auto}.teacher-login .card{padding:32px}.teacher-login h1{margin:0;font-size:31px;letter-spacing:-1.8px}.teacher-login p{color:#73788b;font-size:12px}.teacher-login form{display:grid;gap:13px;margin-top:20px}.teacher-panel{display:grid;gap:18px}.teacher-head{display:flex;align-items:end;justify-content:space-between;gap:18px}.teacher-head h1{margin:0;font-size:34px;letter-spacing:-2px}.teacher-head p{margin:7px 0 0;color:#73788b;font-size:12px}.teacher-actions{display:flex;gap:9px}.filter-row{display:flex;gap:10px;align-items:center}.filter-row label{color:#6d7284;font-size:11px;font-weight:800}.filter-row select{height:39px;padding:0 10px;border:1px solid #dce0ea;border-radius:8px;background:#fff;font:12px var(--sans)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.metric{padding:19px;border:1px solid var(--line);border-radius:11px}.metric span{display:block;color:#808596;font-size:10px}.metric b{display:block;margin-top:4px;font-size:25px;letter-spacing:-1px}.export-note{margin:0;color:#888c9c;font-size:10px}.site-footer{display:flex;justify-content:space-between;width:min(1160px,calc(100% - 48px));margin:auto;padding:22px 0;border-top:1px solid var(--line);color:#858a9a;font-size:10px}.toast{position:fixed;z-index:50;right:22px;bottom:22px;padding:12px 16px;border-radius:9px;background:var(--ink);box-shadow:0 12px 25px rgba(20,23,45,.18);color:#fff;font-size:11px;font-weight:700;opacity:0;transform:translateY(10px);transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:none}.loading{padding:38px;color:#73788b;text-align:center;font-size:12px}@media(max-width:720px){.site-header,.page,.site-footer{width:min(100% - 32px,1080px)}.site-header{height:68px}.nav-links{gap:13px}.header-link{display:none}.hero,.form-page,.result-hero,.board-layout{grid-template-columns:1fr;gap:26px}.hero{padding-top:24px}.page{padding:35px 0 58px}.hero h1,.page-title{font-size:40px}.info-strip,.score-grid,.metrics{grid-template-columns:1fr 1fr}.info-strip div:last-child,.score-item:last-child,.metric:last-child{grid-column:span 2}.side-copy{padding:0}.card,.quiz-card{padding:20px}.question{font-size:20px}.quiz-top{align-items:start;flex-direction:column}.scoreboard-header,.teacher-head{align-items:start;flex-direction:column}.result-score{width:150px;height:150px}.site-footer{gap:9px;flex-direction:column}.board-aside{order:-1}.answer{font-size:12px}}
