:root{--neon-cyan:#39f7e2;--neon-blue:#4e7cff;--neon-violet:#8b5dff;--neon-pink:#ff4fce;--space:#050710;--panel:#0b1020}
.grade-portal{position:relative;z-index:50;min-height:100svh;overflow:hidden;background:radial-gradient(circle at 50% 35%,#121b3d 0,#070a16 38%,#03050b 75%);color:#f7f9ff;padding:0 5vw 28px;display:flex;flex-direction:column;isolation:isolate}.grade-portal.is-hidden{display:none}#spaceCanvas,.portal-grid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.portal-grid{z-index:-1;background-image:linear-gradient(#40b7ff0c 1px,transparent 1px),linear-gradient(90deg,#40b7ff0c 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,transparent 0,#000 25%,#000 80%,transparent 100%);transform:perspective(700px) rotateX(58deg) scale(1.5) translateY(32%);transform-origin:bottom}.portal-nav{height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid #ffffff18;position:relative;z-index:2}.portal-brand{color:white;font:600 15px 'DM Mono';letter-spacing:.07em}.portal-brand .brand-mark{background:linear-gradient(135deg,var(--neon-cyan),var(--neon-violet));color:#07101d;box-shadow:0 0 25px #39f7e266}.portal-brand b{color:var(--neon-cyan)}.system-status{font:10px 'DM Mono';letter-spacing:.18em;color:#91aaa8;padding:8px 14px;border:1px solid #ffffff18;background:#ffffff05;backdrop-filter:blur(10px)}.system-status i{width:7px;height:7px;display:inline-block;border-radius:50%;background:var(--neon-cyan);box-shadow:0 0 12px var(--neon-cyan);margin-right:8px;animation:pulse 1.8s ease-in-out infinite}.portal-code{justify-self:end;font:10px 'DM Mono';letter-spacing:.15em;color:#687692}@keyframes pulse{50%{opacity:.35}}.portal-content{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:.86fr .55fr 1.15fr;gap:3vw;align-items:center;max-width:1500px;width:100%;margin:auto}.portal-heading .eyebrow{color:#91a4bd;font-size:10px}.portal-heading .eyebrow span{background:var(--neon-cyan);box-shadow:0 0 10px var(--neon-cyan)}.portal-heading h1{font-size:clamp(48px,6.2vw,96px);line-height:.92;letter-spacing:-.06em;margin:25px 0}.portal-heading h1 em{font-style:normal;color:transparent;background:linear-gradient(90deg,var(--neon-cyan),#7ca5ff,var(--neon-pink));-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 22px #617fff55)}.portal-heading p{max-width:500px;color:#93a0b5;line-height:1.9;font-size:14px}.atom-core{height:min(42vw,510px);min-height:350px;position:relative;transform-style:preserve-3d;perspective:850px;transition:transform .2s ease-out}.nucleus{position:absolute;left:50%;top:44%;width:100px;height:100px;transform:translate(-50%,-50%) translateZ(60px);border-radius:50%;background:radial-gradient(circle at 32% 28%,#fff 0 2%,#7dfcf0 6%,#3569ff 36%,#38136d 68%,#080b22 100%);box-shadow:0 0 25px #45d9ff,0 0 80px #4f4aff88,0 0 145px #913dff44;animation:nucleus 3s ease-in-out infinite}.nucleus:before,.nucleus:after,.nucleus span{content:'';position:absolute;border-radius:50%;background:linear-gradient(145deg,#ff55cb,#5a58ff);box-shadow:inset -8px -8px 15px #220a5f88,0 0 14px #b147ff}.nucleus:before{width:42px;height:42px;left:8px;top:21px}.nucleus:after{width:48px;height:48px;right:7px;bottom:12px}.nucleus span{width:32px;height:32px;right:15px;top:4px}@keyframes nucleus{50%{transform:translate(-50%,-50%) translateZ(80px) scale(1.07);filter:hue-rotate(25deg)}}.orbit{position:absolute;left:50%;top:44%;width:270px;height:270px;margin:-135px;border:1px solid #6a88ff77;border-radius:50%;transform-style:preserve-3d;box-shadow:inset 0 0 22px #4d67ff13,0 0 18px #4d67ff16}.orbit-a{transform:rotateX(70deg) rotateZ(10deg);animation:orbitA 7s linear infinite}.orbit-b{transform:rotateY(68deg) rotateZ(55deg);animation:orbitB 9s linear infinite reverse}.orbit-c{transform:rotateX(55deg) rotateY(55deg) rotateZ(-35deg);animation:orbitC 11s linear infinite}.electron{position:absolute;left:50%;top:-7px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff,0 0 20px var(--neon-cyan),0 0 40px var(--neon-blue)}@keyframes orbitA{to{transform:rotateX(70deg) rotateZ(370deg)}}@keyframes orbitB{to{transform:rotateY(68deg) rotateZ(415deg)}}@keyframes orbitC{to{transform:rotateX(55deg) rotateY(55deg) rotateZ(325deg)}}.core-label{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);text-align:center;font-family:'DM Mono';text-shadow:0 0 16px #67f5ff}.core-label small{display:block;color:#62718e;font-size:8px;letter-spacing:.3em}.core-label strong{display:block;font-size:42px;line-height:1.15;color:var(--neon-cyan)}.core-label span{font-size:9px;letter-spacing:.14em;color:#7d91af}.grade-deck{display:grid;gap:12px;perspective:1100px}.grade-panel{--accent:var(--neon-cyan);position:relative;overflow:hidden;min-height:165px;border:1px solid color-mix(in srgb,var(--accent) 44%,transparent);background:linear-gradient(115deg,color-mix(in srgb,var(--accent) 10%,#090d19),#090d17cc 70%);color:white;text-align:left;padding:21px 24px 19px 28px;clip-path:polygon(0 0,96% 0,100% 18%,100% 100%,4% 100%,0 82%);transform-style:preserve-3d;transition:transform .18s ease-out,border-color .25s,box-shadow .25s;backdrop-filter:blur(14px);box-shadow:inset 0 0 30px #ffffff03}.grade-panel:before{content:'';position:absolute;left:0;top:18%;bottom:18%;width:2px;background:var(--accent);box-shadow:0 0 15px var(--accent)}.grade-panel.violet{--accent:var(--neon-violet)}.grade-panel.magenta{--accent:var(--neon-pink)}.grade-panel:hover{border-color:var(--accent);box-shadow:0 0 35px color-mix(in srgb,var(--accent) 22%,transparent),inset 0 0 40px color-mix(in srgb,var(--accent) 8%,transparent)}.panel-index,.panel-level{position:absolute;top:18px;font:9px 'DM Mono';letter-spacing:.13em;color:#75829a}.panel-index{right:20px}.panel-level{left:95px;color:var(--accent)}.grade-panel>strong{font:500 46px 'DM Mono';color:var(--accent);text-shadow:0 0 20px color-mix(in srgb,var(--accent) 55%,transparent);float:left;margin-right:20px;line-height:1}.grade-panel h2{font-size:19px;margin:24px 0 5px}.grade-panel p{font-size:11px;color:#8997ac;margin:0;white-space:nowrap}.panel-action{position:absolute;bottom:16px;left:28px;right:24px;border-top:1px solid #ffffff16;padding-top:10px;font:9px 'DM Mono';letter-spacing:.14em;color:#6f7c90;display:flex;justify-content:space-between}.panel-action b{color:var(--accent);font-size:15px}.panel-glow{position:absolute;width:130px;height:130px;border-radius:50%;right:-55px;top:-50px;background:var(--accent);filter:blur(50px);opacity:.13;pointer-events:none}.portal-footer{height:38px;display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid #ffffff12;font:8px 'DM Mono';letter-spacing:.16em;color:#56647b;position:relative;z-index:2;padding-top:16px}
body.scifi-theme{background:#050812;color:#eaf0ff}body.scifi-theme .nav{background:#070b16ec;border-color:#ffffff15;color:#eef3ff}body.scifi-theme .nav .brand b{color:var(--neon-cyan)}body.scifi-theme .nav nav a{color:#9aa9c0}body.scifi-theme .login-btn{border-color:#39f7e266;color:var(--neon-cyan)}body.scifi-theme .hero{background:radial-gradient(circle at 72% 45%,#142652,#080c19 42%,#050812 72%)}body.scifi-theme .hero-copy>p,body.scifi-theme .trust{color:#8190a8}body.scifi-theme .hero h1 em{color:var(--neon-cyan)}body.scifi-theme .hero h1 em:after{background:#7b5cff55}body.scifi-theme .hero-visual{background:radial-gradient(circle,#263979,#0b1021 62%);box-shadow:0 0 80px #3f4eff44}body.scifi-theme .ticker,body.scifi-theme .section,body.scifi-theme footer{background:#070b15;border-color:#ffffff14}body.scifi-theme .topic,body.scifi-theme .quiz-card{background:#0d1322;border-color:#ffffff12}body.scifi-theme .topic p,body.scifi-theme .lead,body.scifi-theme .section-head>p,body.scifi-theme .video-grid p{color:#8492a8}body.scifi-theme .visual-tools{background:#090e1b}body.scifi-theme .element-explorer,body.scifi-theme .reaction-viewer{background:#0d1424}body.scifi-theme .portal{background:linear-gradient(110deg,#12264a,#201344);color:white}body.scifi-theme .portal-action{background:linear-gradient(90deg,#3f67ff,#8b5dff)}
@media(max-width:1100px){.portal-content{grid-template-columns:.8fr .55fr 1fr;gap:1.5vw}.grade-panel{min-height:150px}.portal-heading h1{font-size:58px}}@media(max-width:850px){.grade-portal{min-height:auto;padding-bottom:24px}.portal-nav{grid-template-columns:1fr auto}.system-status{display:none}.portal-content{display:block;padding:45px 0}.portal-heading{text-align:center}.portal-heading .eyebrow{justify-content:center}.portal-heading p{margin-inline:auto}.atom-core{height:360px;min-height:0;max-width:420px;margin:auto}.grade-deck{grid-template-columns:repeat(3,1fr)}.grade-panel{min-height:220px;padding:20px}.grade-panel>strong{float:none;display:block;margin:10px 0;font-size:42px}.panel-level{left:20px;top:65px}.grade-panel p{white-space:normal}.panel-action{left:20px}.portal-footer span:nth-child(2){display:none}}@media(max-width:640px){.portal-nav{height:68px}.portal-code{display:none}.portal-content{padding:30px 0}.portal-heading h1{font-size:48px}.portal-heading p{font-size:12px}.atom-core{height:300px}.orbit{width:220px;height:220px;margin:-110px}.grade-deck{grid-template-columns:1fr}.grade-panel{min-height:150px}.panel-level{left:92px;top:18px}.grade-panel>strong{float:left;margin-right:18px}.portal-footer{display:none}}
@media(prefers-reduced-motion:reduce){.nucleus,.orbit,.system-status i,.grade-orbit,.atom{animation:none!important}.grade-panel{transition:none}}

/* Carbon atom: two electron shells with the correct 2,4 arrangement. */
.carbon-nucleus{width:112px;height:112px;background:radial-gradient(circle at 42% 38%,#293a76,#11162d 72%);display:block;animation:nucleus 3s ease-in-out infinite}.carbon-nucleus:before,.carbon-nucleus:after{display:none}.carbon-nucleus .proton,.carbon-nucleus .neutron{position:absolute;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:600 8px 'DM Mono';font-style:normal}.carbon-nucleus .proton{background:radial-gradient(circle at 30% 25%,#ffd3f3,#ff4fce 36%,#5d168d);color:white;box-shadow:0 0 14px #ff4fce88}.carbon-nucleus .neutron{background:radial-gradient(circle at 30% 25%,#c6ffff,#35dbe2 38%,#144e78);color:#06101a;box-shadow:0 0 14px #39f7e277}.carbon-nucleus .p1{left:11px;top:17px}.carbon-nucleus .n1{left:40px;top:9px}.carbon-nucleus .p2{right:9px;top:27px}.carbon-nucleus .n2{left:19px;bottom:17px}.carbon-nucleus .p3{left:48px;bottom:7px}.carbon-nucleus .n3{right:7px;bottom:15px}.nucleus-count{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;background:#070b18dd;border:1px solid #ffffff29;padding:5px 7px;border-radius:12px;font:7px 'DM Mono';letter-spacing:.08em;color:white;white-space:nowrap}.electron-shell{position:absolute;left:50%;top:44%;border-radius:50%;border:1px solid #62e9ff66;transform-style:preserve-3d;box-shadow:0 0 18px #3d9cff18,inset 0 0 18px #3d9cff12}.shell-inner{width:184px;height:184px;margin:-92px;animation:shellSpin 6s linear infinite}.shell-outer{width:286px;height:286px;margin:-143px;border-color:#8c64ff55;animation:shellSpin 10s linear infinite reverse}.electron-shell .electron{position:absolute;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#f9ffff;color:#15173a;font:800 11px 'DM Mono';font-style:normal;box-shadow:0 0 9px #fff,0 0 20px var(--neon-cyan),0 0 36px #486dff}.electron-shell .e1{left:50%;top:-9px;margin-left:-9px}.electron-shell .e2{left:50%;bottom:-9px;margin-left:-9px}.shell-outer .e3{top:50%;left:-9px;margin-top:-9px}.shell-outer .e4{top:50%;right:-9px;margin-top:-9px}@keyframes shellSpin{to{transform:rotate(360deg)}}

/* Keep all three year choices visible in the first viewport. */
@media(max-width:1180px){.portal-content{grid-template-columns:.82fr 1.18fr;gap:4vw}.atom-core{position:absolute;width:360px;height:360px;left:35%;top:50%;transform:translate(-50%,-50%);opacity:.38;z-index:-1}.portal-heading{position:relative;z-index:1}.grade-deck{position:relative;z-index:3}.portal-heading h1{font-size:clamp(48px,6vw,72px)}}
@media(max-width:850px){.grade-portal{height:auto;min-height:100svh;padding-bottom:18px}.portal-content{display:grid;grid-template-columns:1fr;align-content:start;padding:28px 0 16px}.portal-heading{text-align:left}.portal-heading .eyebrow{justify-content:flex-start}.portal-heading h1{font-size:clamp(42px,10vw,62px);margin:17px 0 10px}.portal-heading p{margin:0;max-width:560px;line-height:1.65}.atom-core{width:300px;height:300px;left:82%;top:22%;opacity:.22}.grade-deck{grid-template-columns:repeat(3,1fr);margin-top:22px}.grade-panel{min-height:190px;padding:18px}.grade-panel>strong{float:none;display:block;font-size:38px;margin:15px 0 5px}.grade-panel h2{margin:0 0 6px}.panel-level{left:18px;top:61px}.grade-panel p{white-space:normal;line-height:1.5}.panel-action{left:18px;right:18px}.portal-footer{margin-top:auto}}
@media(max-width:640px){.portal-content{padding-top:22px}.portal-heading h1{font-size:44px}.portal-heading p{font-size:11px;max-width:88%}.atom-core{display:none}.grade-deck{grid-template-columns:1fr;gap:8px;margin-top:16px}.grade-panel{min-height:128px}.grade-panel>strong{float:left;margin:12px 17px 0 0;font-size:40px}.grade-panel h2{margin-top:17px}.panel-level{left:88px;top:16px}.panel-action{bottom:11px}.grade-panel p{font-size:10px}.system-status{display:none}}