500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root{--ink:#f7f8ff;--muted:#aab4ce;--panel:rgba(14,20,43,.78);--line:rgba(255,255,255,.12);--accent:#7c6cff;--accent2:#46d8c5;--deep:#080b18;--display:'Space Grotesk',sans-serif;--body:'DM Sans',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--deep);font-family:var(--body);min-height:100vh;overflow-x:hidden}
button,a{font:inherit}
button{color:inherit}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}
.kicker,.mission-code{margin:0 0 16px;color:#80ecda;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}

/* Course hub */
.hub-page{background:radial-gradient(circle at 85% 5%,#20265c 0,transparent 35%),radial-gradient(circle at 10% 35%,#163c4b 0,transparent 30%),#080b18}
.aurora{position:fixed;inset:0;pointer-events:none;opacity:.34;background:linear-gradient(120deg,transparent 15%,rgba(82,240,210,.08) 45%,transparent 55%),radial-gradient(circle at 75% 70%,rgba(172,69,255,.18),transparent 28%);animation:aurora 14s ease-in-out infinite alternate}
@keyframes aurora{to{transform:translate3d(-2%,2%,0) scale(1.06)}}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,76px);border-bottom:1px solid var(--line);background:rgba(8,11,24,.68);backdrop-filter:blur(16px);position:relative;z-index:5}
.wordmark{display:flex;align-items:center;gap:10px;font-family:var(--display);letter-spacing:.08em}.wordmark span{display:grid;place-items:center;width:31px;height:31px;border:1px solid rgba(128,236,218,.6);color:#80ecda;transform:rotate(45deg)}.wordmark span::first-letter{transform:rotate(-45deg)}
.hub-status{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.hub-status span{color:#fff;font-weight:700}
.hub-nav{display:flex;align-items:center;gap:18px}.admin-entry{border:1px solid var(--line);border-radius:9px;padding:8px 11px;color:#d5dced;font-size:.7rem;font-weight:700;letter-spacing:.06em}.admin-entry:hover{border-color:#70e1d0;color:#70e1d0}
.hub-shell{width:min(1220px,calc(100% - 40px));margin:auto;position:relative;z-index:1}
.hub-hero{min-height:620px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:70px;padding:80px 0 64px}
.hub-hero h1{font:700 clamp(3.6rem,7.8vw,7.2rem)/.83 var(--display);letter-spacing:-.075em;margin:0}.hub-hero h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.72);text-shadow:0 0 35px rgba(111,217,255,.18)}
.hero-copy{max-width:620px;color:#bdc6dc;font-size:1.12rem;line-height:1.75;margin:28px 0 32px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.primary-action,.game-primary{border:0;background:linear-gradient(135deg,#77ead7,#8c72ff);color:#09101d;padding:15px 20px;border-radius:12px;font-weight:800;display:inline-flex;align-items:center;gap:24px;cursor:pointer;box-shadow:0 15px 40px rgba(82,210,198,.18);transition:.25s}.primary-action:hover,.game-primary:hover{transform:translateY(-2px);box-shadow:0 18px 48px rgba(82,210,198,.28)}
.quiet-action{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:12px;padding:14px 20px;cursor:pointer}
.portal-map{height:470px;position:relative;display:grid;place-items:center;filter:drop-shadow(0 0 55px rgba(113,108,255,.25))}
.portal-core{width:170px;height:170px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 35% 30%,#a4fff0,#6f77ff 45%,#2a1b73 70%);box-shadow:inset 0 0 30px rgba(255,255,255,.35),0 0 70px rgba(92,109,255,.48);z-index:2}.portal-core span{font:700 4rem/1 var(--display)}.portal-core small{letter-spacing:.2em;font-weight:700;font-size:.64rem}
.orbit{position:absolute;border:1px solid rgba(170,211,255,.3);border-radius:50%;transform:rotate(-20deg)}.o1{width:280px;height:220px}.o2{width:390px;height:300px;transform:rotate(35deg)}.o3{width:470px;height:410px;transform:rotate(80deg);border-style:dashed}
.sat{position:absolute;width:48px;height:48px;border:1px solid rgba(255,255,255,.25);background:#11172d;border-radius:50%;display:grid;place-items:center;color:#92eadc;box-shadow:0 0 20px rgba(105,232,211,.2);animation:float 4s ease-in-out infinite}.s1{top:50px;left:22%}.s2{right:12%;top:42%}.s3{bottom:48px;left:30%;animation-delay:-2s}.s4{left:10%;top:50%;animation-delay:-1s}@keyframes float{50%{transform:translateY(-12px) rotate(8deg)}}
.course-progress{padding:28px;border:1px solid var(--line);border-radius:20px;background:rgba(14,20,43,.72);backdrop-filter:blur(14px);display:grid;grid-template-columns:230px 1fr 330px;align-items:center;gap:28px}.course-progress>div:first-child span{display:block;color:#7de4d4;font-size:.68rem;letter-spacing:.16em;font-weight:700}.course-progress strong{font:600 1.2rem var(--display)}.progress-track{height:10px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#57e2cd,#8b6dff);transition:width .6s ease}.course-progress p{margin:0;color:var(--muted);font-size:.88rem;line-height:1.5}
.worlds-section{padding:100px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:36px}.section-heading h2{font:700 clamp(2.4rem,4vw,4.3rem)/1 var(--display);margin:0;letter-spacing:-.05em}.section-heading>p{max-width:390px;color:var(--muted);line-height:1.6;margin:0}
.world-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.world-card{--c1:#7c6cff;--c2:#46d8c5;position:relative;min-height:360px;border:1px solid rgba(255,255,255,.13);border-radius:22px;padding:24px;background:linear-gradient(150deg,color-mix(in srgb,var(--c1) 26%,#11152b),#0c1020 58%);overflow:hidden;display:flex;flex-direction:column;transition:.3s;box-shadow:0 20px 45px rgba(0,0,0,.18)}.world-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--c2) 65%,white);box-shadow:0 26px 60px rgba(0,0,0,.3)}.world-card::before{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-90px;top:-90px;background:radial-gradient(circle,var(--c2),transparent 67%);opacity:.22}.world-card::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(120deg,transparent 0 22px,rgba(255,255,255,.025) 22px 23px);pointer-events:none}
.card-top,.card-actions{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.chapter-no{font:700 .7rem var(--display);letter-spacing:.14em;color:rgba(255,255,255,.68)}.world-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:rgba(255,255,255,.1);font-size:1.55rem;border:1px solid rgba(255,255,255,.16)}
.world-card h3{font:700 1.65rem/1.05 var(--display);letter-spacing:-.035em;margin:42px 0 8px;position:relative}.world-theme{margin:0;color:var(--c2);font-weight:700;font-size:.78rem;letter-spacing:.13em;text-transform:uppercase}.world-blurb{color:#bfc7da;line-height:1.56;font-size:.92rem;margin:16px 0 22px;position:relative;z-index:1}.card-actions{margin-top:auto}.play-link{display:flex;align-items:center;gap:12px;font-weight:700}.play-link span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--c2);color:#071019}.copy-link{width:38px;height:38px;border:1px solid var(--line);background:rgba(255,255,255,.05);border-radius:11px;cursor:pointer}.best-score{position:absolute;right:22px;bottom:75px;color:rgba(255,255,255,.65);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}.best-score b{color:#fff}.world-card.locked{filter:saturate(.62)}.world-card.locked .play-link{color:#98a2b8;pointer-events:none}.world-card.locked .play-link span{background:#465069;color:#c7cedd}.lock-label{display:inline-flex;align-items:center;gap:6px;margin-top:12px;color:#f1c56a;font-size:.68rem;font-weight:800;letter-spacing:.09em}
.site-footer{border-top:1px solid var(--line);padding:28px clamp(20px,5vw,76px);display:flex;justify-content:space-between;color:#7f8aa5;font-size:.68rem;letter-spacing:.12em;position:relative;z-index:1}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);padding:12px 18px;border-radius:10px;background:#f8fbff;color:#11172a;font-weight:700;opacity:0;pointer-events:none;transition:.25s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}

/* Game shell */
.game-page{--accent:#7c6cff;--accent2:#46d8c5;--deep:#0a0d1c;background:var(--deep);transition:background .35s}
.theme-backdrop{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 15% 20%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 34%),radial-gradient(circle at 85% 70%,color-mix(in srgb,var(--accent2) 24%,transparent),transparent 33%)}.theme-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:50px 50px;mask-image:linear-gradient(to bottom,black,transparent)}.theme-backdrop i{position:absolute;border:1px solid color-mix(in srgb,var(--accent2) 35%,transparent);border-radius:50%;animation:drift 12s ease-in-out infinite}.theme-backdrop i:nth-child(1){width:380px;height:380px;left:-140px;top:14%}.theme-backdrop i:nth-child(2){width:180px;height:180px;right:10%;top:10%;animation-delay:-4s}.theme-backdrop i:nth-child(3){width:540px;height:540px;right:-280px;bottom:-210px;animation-delay:-8s}@keyframes drift{50%{transform:translate(20px,-25px) scale(1.05)}}
body[data-theme="kingdom"] .theme-backdrop::after{background-image:linear-gradient(45deg,rgba(255,215,90,.05) 25%,transparent 25% 75%,rgba(255,215,90,.05) 75%)}
body[data-theme="temple"] .theme-backdrop::after{background-size:80px 80px;background-image:linear-gradient(30deg,rgba(225,160,70,.05) 12%,transparent 12% 88%,rgba(225,160,70,.05) 88%)}
body[data-theme="museum"] .theme-backdrop::after{background-size:120px 120px;background-image:radial-gradient(circle,rgba(122,213,255,.08) 2px,transparent 3px)}
body[data-theme="spy"] .theme-backdrop::after{background-size:34px 34px;background-image:linear-gradient(90deg,transparent 48%,rgba(240,75,95,.05) 50%,transparent 52%)}
body[data-theme="cyber"] .theme-backdrop::after{background-size:38px 38px;background-image:linear-gradient(rgba(34,240,207,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,54,213,.05) 1px,transparent 1px)}
body[data-theme="maze"] .theme-backdrop::after{background-size:70px 70px;background-image:linear-gradient(45deg,rgba(116,230,84,.05) 25%,transparent 25% 75%,rgba(35,164,255,.05) 75%)}
body[data-theme="forge"] .theme-backdrop::after{background-size:60px 60px;background-image:radial-gradient(circle,rgba(255,157,61,.08) 2px,transparent 3px)}
body[data-theme="orchestra"] .theme-backdrop::after{background-size:100% 36px;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px)}
body[data-theme="arctic"] .theme-backdrop::after{background-size:74px 74px;background-image:linear-gradient(60deg,rgba(132,230,255,.05) 25%,transparent 25% 75%,rgba(132,230,255,.05) 75%)}
body[data-theme="metro"] .theme-backdrop::after{background-size:160px 48px;background-image:linear-gradient(90deg,rgba(255,212,74,.05) 1px,transparent 1px),linear-gradient(rgba(255,96,84,.04) 1px,transparent 1px)}
body[data-theme="factory"] .theme-backdrop::after{background-size:90px 90px;background-image:radial-gradient(circle,transparent 42%,rgba(212,151,82,.055) 44% 46%,transparent 48%)}
body[data-theme="hero"] .theme-backdrop::after{background-size:100px 100px;background-image:linear-gradient(120deg,rgba(70,224,255,.05) 25%,transparent 25% 75%,rgba(255,79,124,.05) 75%)}
.game-hud{height:74px;display:grid;grid-template-columns:1fr minmax(260px,480px) 1fr;align-items:center;padding:0 clamp(18px,4vw,58px);border-bottom:1px solid var(--line);position:relative;z-index:10;background:color-mix(in srgb,var(--deep) 80%,transparent);backdrop-filter:blur(16px)}
.hud-home{font-size:.8rem;color:#c2cadb}.hud-home span{margin-right:8px}.hud-progress{display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center}.hud-progress>span,.hud-progress>b{font-size:.68rem;letter-spacing:.12em}.hud-progress>div{height:5px;background:rgba(255,255,255,.1);border-radius:9px;overflow:hidden}.hud-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .4s}.sound-toggle{justify-self:end;background:none;border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:.62rem;letter-spacing:.1em;cursor:pointer}
.game-shell{min-height:calc(100vh - 74px);position:relative;z-index:2}.game-screen{display:none;min-height:calc(100vh - 74px);width:min(1180px,calc(100% - 36px));margin:auto}.game-screen.active{display:grid}
.opening-screen{place-content:center;text-align:center;justify-items:center;padding:50px 0}.scene-emblem{width:158px;height:158px;border-radius:36%;display:grid;place-items:center;position:relative;margin-bottom:34px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 84%,white),color-mix(in srgb,var(--accent2) 72%,#111));box-shadow:0 0 60px color-mix(in srgb,var(--accent) 35%,transparent);transform:rotate(12deg);animation:emblem 5s ease-in-out infinite}.scene-emblem::before,.scene-emblem::after{content:"";position:absolute;inset:-16px;border:1px solid color-mix(in srgb,var(--accent2) 48%,transparent);border-radius:40%;animation:spin 11s linear infinite}.scene-emblem::after{inset:-31px;border-style:dashed;animation-direction:reverse;animation-duration:17s}.scene-emblem span{font-size:4.4rem;transform:rotate(-12deg);text-shadow:0 5px 20px rgba(0,0,0,.24)}@keyframes emblem{50%{transform:rotate(12deg) translateY(-10px)}}@keyframes spin{to{transform:rotate(360deg)}}
.opening-screen h1{font:700 clamp(3.2rem,7vw,6.8rem)/.92 var(--display);letter-spacing:-.065em;margin:0}.opening-screen h2{font:600 clamp(1rem,2vw,1.35rem) var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--accent2);margin:14px 0 22px}.opening-screen>p:not(.mission-code){max-width:720px;color:#bec7da;font-size:1.05rem;line-height:1.7;margin:0 0 24px}.mission-spec{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:0 0 30px}.mission-spec span{padding:8px 11px;border:1px solid var(--line);border-radius:99px;font-size:.62rem;letter-spacing:.12em;color:#c5cee0}.game-primary{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#07101c}
.question-screen{grid-template-columns:.82fr 1.18fr;align-items:stretch;padding:50px 0 60px;gap:24px}.story-panel,.question-panel{border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--deep) 76%,transparent);backdrop-filter:blur(18px)}.story-panel{padding:42px;display:flex;flex-direction:column;min-height:590px;background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 24%,var(--deep)),color-mix(in srgb,var(--deep) 88%,transparent))}.story-panel>p:first-child{font-size:.68rem;letter-spacing:.16em;color:var(--accent2);font-weight:700}.mini-emblem{width:112px;height:112px;border-radius:28px;display:grid;place-items:center;font-size:3.25rem;margin:70px 0 42px;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 20px 50px color-mix(in srgb,var(--accent) 25%,transparent)}.story-panel h2{font:700 2.3rem/1 var(--display);letter-spacing:-.04em;margin:0 0 14px}.story-panel>p:not(:first-child){color:#b9c2d6;line-height:1.6;margin:0}.score-chip{margin-top:auto;border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;align-items:end}.score-chip span{font-size:.62rem;letter-spacing:.15em}.score-chip strong{font:700 2.2rem var(--display)}
.question-panel{padding:42px;align-self:stretch}.question-meta{display:flex;justify-content:space-between;font-size:.66rem;letter-spacing:.12em;color:var(--accent2);font-weight:700}.question-panel h3{font:600 clamp(1.65rem,3vw,2.5rem)/1.2 var(--display);letter-spacing:-.035em;margin:34px 0}.answer-grid{display:grid;gap:11px}.answer-option{width:100%;text-align:left;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:13px;padding:15px 17px;display:flex;gap:14px;align-items:center;cursor:pointer;line-height:1.4;transition:.2s}.answer-option:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 15%,transparent);border-color:color-mix(in srgb,var(--accent) 55%,white)}.answer-option span{flex:none;width:29px;height:29px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-size:.72rem;font-weight:700}.answer-option.correct{border-color:#5ee5a1;background:rgba(46,207,129,.12)}.answer-option.wrong{border-color:#ff7180;background:rgba(255,81,103,.12)}.answer-option:disabled{cursor:default;color:#e9ebf3}.answer-feedback{display:none;margin-top:18px;border-left:3px solid var(--accent2);padding:2px 0 2px 16px;color:#c7d0e2;line-height:1.55}.answer-feedback.show{display:block}.answer-feedback strong{display:block;color:#fff;margin-bottom:3px}.next-question{margin-top:22px;margin-left:auto;border:0;border-radius:11px;padding:12px 17px;background:var(--accent2);color:#071018;font-weight:800;cursor:pointer;align-items:center;gap:20px}.next-question:not([hidden]){display:flex}
.result-screen{place-content:center;padding:55px 0}.result-card{width:min(780px,100%);text-align:center;border:1px solid var(--line);border-radius:26px;padding:48px;background:color-mix(in srgb,var(--deep) 77%,transparent);backdrop-filter:blur(18px);box-shadow:0 30px 90px rgba(0,0,0,.3)}.result-emblem{width:76px;height:76px;border-radius:22px;display:grid;place-items:center;font-size:2.3rem;margin:0 auto 20px;background:linear-gradient(135deg,var(--accent),var(--accent2))}.result-card h1{font:700 clamp(2.6rem,6vw,5rem)/1 var(--display);letter-spacing:-.06em;margin:0}.score-orb{width:160px;height:160px;border-radius:50%;display:grid;place-content:center;margin:28px auto 18px;border:8px solid color-mix(in srgb,var(--accent) 50%,#1b2234);box-shadow:0 0 40px color-mix(in srgb,var(--accent) 20%,transparent)}.score-orb strong{font:700 3.4rem/1 var(--display)}.score-orb span{color:var(--muted)}.result-card>h2{color:var(--accent2);letter-spacing:.12em;font:700 .85rem var(--display)}.result-card>p:not(.mission-code){color:#bdc6d9}.answer-review{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:26px 0}.review-dot{padding:10px 4px;border:1px solid var(--line);border-radius:10px;font-size:.66rem}.review-dot b{display:block;font-size:1.1rem;margin-bottom:3px}.review-dot.ok{background:rgba(46,207,129,.1);border-color:rgba(94,229,161,.4)}.review-dot.no{background:rgba(255,81,103,.1);border-color:rgba(255,113,128,.4)}.result-actions{display:flex;justify-content:center;gap:12px;align-items:center;flex-wrap:wrap}.secondary-link{border:1px solid var(--line);padding:14px 18px;border-radius:12px;font-weight:700}.text-link{width:100%;margin-top:8px;color:#aeb8cd;font-size:.85rem;text-decoration:underline;text-underline-offset:4px}

@media(max-width:980px){.hub-hero{grid-template-columns:1fr;min-height:auto;padding-top:70px}.portal-map{height:360px}.course-progress{grid-template-columns:1fr}.world-grid{grid-template-columns:repeat(2,1fr)}.question-screen{grid-template-columns:1fr}.story-panel{min-height:auto}.mini-emblem{margin:30px 0}.score-chip{margin-top:35px}.game-hud{grid-template-columns:1fr auto}.hud-progress{position:absolute;left:50%;transform:translateX(-50%);width:42%}.sound-toggle{display:none}}
@media(max-width:660px){.topbar{height:66px}.hub-shell{width:min(100% - 28px,1220px)}.hub-status{font-size:.62rem}.hub-hero{gap:20px;padding:56px 0 35px}.hub-hero h1{font-size:3.65rem}.portal-map{height:310px;transform:scale(.82);margin:-30px 0}.course-progress{padding:20px}.section-heading{display:block}.section-heading>p{margin-top:15px}.worlds-section{padding:70px 0}.world-grid{grid-template-columns:1fr}.world-card{min-height:330px}.site-footer{display:block;line-height:1.8}.site-footer span{display:block}.game-hud{height:66px;padding:0 16px}.hud-home{font-size:0}.hud-home span{font-size:1.1rem}.hud-progress{width:65%}.game-shell,.game-screen{min-height:calc(100vh - 66px)}.game-screen{width:calc(100% - 24px)}.opening-screen{padding:44px 0}.scene-emblem{width:120px;height:120px}.scene-emblem span{font-size:3.4rem}.opening-screen h1{font-size:3.35rem}.question-screen{padding:18px 0 35px;gap:12px}.story-panel,.question-panel{padding:23px;border-radius:18px}.story-panel{min-height:260px}.mini-emblem{width:76px;height:76px;font-size:2.2rem;margin:18px 0}.story-panel h2{font-size:1.8rem}.score-chip{margin-top:25px}.question-panel h3{font-size:1.55rem;margin:25px 0}.answer-option{padding:13px}.result-card{padding:30px 18px}.answer-review{gap:5px}.result-actions{display:grid}.game-primary,.secondary-link{justify-content:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
