:root{--space: #05060c;--lab: #0a0c18;--glass: rgba(18, 20, 36, .72);--line: rgba(255, 255, 255, .08);--line-hi: rgba(255, 255, 255, .16);--ink: #f2f4f8;--muted: #a3a9be;--dim: #6f7591;--fire: #ff3b30;--ember: #ff6a2b;--flame: #ffb547;--hivis: #d4ff3a;--radius: 18px;--radius-sm: 12px;--top: 60px;--display: "Oxanium", "Segoe UI", system-ui, sans-serif;--body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top) + 12px)}body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--space);color:var(--ink);font:16px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(70% 45% at 90% -10%,rgba(255,59,48,.2),transparent 70%),radial-gradient(55% 40% at -15% 40%,rgba(255,106,43,.08),transparent 70%),radial-gradient(1px 1px at 23px 41px,rgba(255,255,255,.75),transparent 100%),radial-gradient(1px 1px at 141px 97px,rgba(255,255,255,.5),transparent 100%),radial-gradient(1.5px 1.5px at 67px 163px,rgba(255,210,180,.7),transparent 100%),radial-gradient(1px 1px at 191px 211px,rgba(255,255,255,.4),transparent 100%);background-size:100% 100%,100% 100%,211px 211px,263px 263px,337px 337px,419px 419px}.wrap{width:100%;max-width:1180px;margin:0 auto;padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right))}main.wrap{flex:1}a{color:var(--ember)}p{margin:0 0 .8em;max-width:68ch}h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.05;letter-spacing:-.01em;text-wrap:balance;margin:0}h1{font-size:clamp(40px,11vw,76px)}h2{font-size:clamp(24px,6vw,34px)}.label{font:500 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ember);margin:0}.topbar{position:sticky;top:0;z-index:10;padding-top:env(safe-area-inset-top);background:#05060cb8;-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--top)}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:700 18px var(--display);letter-spacing:.02em}.brand img{width:30px;height:30px}.topbar .tag{display:none;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}.hero{position:relative;isolation:isolate;padding:44px 0 32px}.hero h1{margin:12px 0 16px}.hero h1 span{color:var(--fire)}.lead{font-size:18px;color:var(--muted)}.planet{position:absolute;z-index:-1;top:-70px;right:-110px;width:240px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 32% 30%,#ff9a5a,#ff3b30 32%,#6e1210 68%,#14050a);box-shadow:0 0 90px #ff3b3059;opacity:.75}.planet:after{content:"";display:none;position:absolute;top:41%;right:-30%;bottom:41%;left:-30%;border:2px solid rgba(255,181,71,.35);border-radius:50%;transform:rotate(-14deg)}.stats{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none}.stats li{font:500 12px var(--mono);color:var(--muted);padding:6px 12px;border:1px solid var(--line-hi);border-radius:999px;background:var(--glass)}.stats b{color:var(--ink);font-weight:500}.section-head{margin:8px 0 14px}.tiles{display:grid;grid-template-columns:1fr;gap:14px}.tile{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:10px;min-height:200px;padding:20px 18px 18px;color:var(--ink);text-decoration:none;background:var(--glass);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .2s,transform .2s,box-shadow .2s}.tile:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--fire),var(--ember) 40%,transparent)}.tile:hover,.tile:focus-visible{border-color:#ff6a2b8c;transform:translateY(-3px);box-shadow:0 14px 40px -14px #ff3b3080}.tile .top{display:flex;justify-content:space-between;align-items:center;gap:12px}.tile .idx{font:500 12px var(--mono);color:var(--dim)}.tile h2{font-size:28px}.tile p{margin:0;color:var(--muted)}.tile .meta{margin-top:auto;display:grid;gap:8px;padding-top:6px;font:500 12px var(--mono);color:var(--muted)}.tile .meta b{color:var(--hivis);font-weight:500}.bar{height:4px;border-radius:2px;background:#ffffff14;overflow:hidden}.bar i{display:block;height:100%;border-radius:inherit;background:var(--hivis)}.mod-head{padding:22px 0 4px}.crumbs{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;font:500 13px var(--mono);color:var(--dim)}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--ink)}.mod-title{font-size:clamp(34px,9vw,60px);margin-bottom:18px}.progress{list-style:none;display:flex;gap:6px;margin:0 -16px 20px;padding:2px 16px;overflow-x:auto;scrollbar-width:none}.progress::-webkit-scrollbar{display:none}.progress a{display:grid;place-items:center;min-width:40px;height:40px;padding:0 12px;border-radius:999px;font:500 14px var(--mono);text-decoration:none;color:var(--muted);background:var(--glass);border:1px solid var(--line-hi)}.progress .done a{color:var(--hivis);border-color:#d4ff3a73}.progress .cur a{color:#fff;background:var(--fire);border-color:var(--fire);box-shadow:0 0 18px #ff3b3080}.step{display:grid;gap:20px}.step>div{min-width:0}.step .lab{order:-1}.explain h2{margin:8px 0 12px}.text p{margin:.4em 0 .8em}.text .def{max-width:none;padding:12px 14px;background:#ff6a2b14;border:1px solid rgba(255,106,43,.3);border-radius:var(--radius-sm)}.text table{border-collapse:collapse;width:100%;font-size:14px}.text td,.text th{border-bottom:1px solid var(--line-hi);padding:7px 8px;text-align:left;vertical-align:top}.text th{font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.lab{padding:10px;color:var(--ink);background:var(--lab);border:1px solid var(--line-hi);border-radius:var(--radius);box-shadow:0 24px 60px -24px #000000e6,0 0 40px -10px #ff3b3026}.stage canvas,.stage svg{width:100%;display:block;border-radius:12px}.controls{display:flex;flex-wrap:wrap;gap:8px;margin:12px 2px 0}.controls:empty{display:none}.status{font:13px/1.5 var(--mono);color:#cfd4e2;min-height:3em;margin:10px 4px 2px;max-width:none}.status b{color:var(--flame);font-weight:500}.ctl{min-height:40px;padding:8px 14px;font:500 14px var(--body);color:var(--ink);background:#ffffff0a;border:1px solid var(--line-hi);border-radius:999px;cursor:pointer;transition:border-color .15s,background-color .15s}.ctl:hover{border-color:var(--ember)}.ctl.on{color:#fff;background:#ff3b302e;border-color:var(--fire)}.ctl.off{color:var(--dim);text-decoration:line-through}.seg{display:flex;flex-wrap:wrap;gap:6px;width:100%}.seg .ctl{flex:1 1 auto}.slider{width:100%;font-size:13px;color:#cfd4e2}.slider label{display:block;margin-bottom:2px}.slider output{font-family:var(--mono);color:var(--flame)}.slider input{width:100%;height:28px;margin:0;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none}.slider input::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:#ffffff24}.slider input::-moz-range-track{height:6px;border-radius:3px;background:#ffffff24}.slider input::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:var(--ember);border:3px solid var(--lab);box-shadow:0 0 0 1px var(--ember),0 0 14px #ff6a2b99}.slider input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--ember);border:3px solid var(--lab);box-shadow:0 0 0 1px var(--ember),0 0 14px #ff6a2b99}.pager{display:flex;gap:10px;margin-top:24px}.pager>:empty{display:none}.pager .btn{flex:1 1 0}.step-pager{position:sticky;bottom:0;z-index:5;margin:24px -16px 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#05060cd1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;font:600 15px var(--body);text-decoration:none;color:#fff;background:var(--fire);border:1px solid var(--fire);border-radius:999px;box-shadow:0 10px 26px -10px #ff3b30b3;cursor:pointer;transition:background-color .15s}.btn:hover{background:#ff554b}.btn.ghost{color:var(--ink);background:#ffffff0a;border-color:var(--line-hi);box-shadow:none}.btn.ghost:hover{border-color:var(--ember)}.quiz{max-width:760px;padding:20px 16px;background:var(--glass);border:1px solid var(--line-hi);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.quiz h2{font-size:clamp(22px,5.5vw,30px);margin:8px 0 4px}.answers{display:grid;gap:10px;margin-top:16px}.ans{padding:14px 16px;text-align:left;font:500 15px/1.45 var(--body);color:var(--ink);background:#ffffff08;border:1px solid var(--line-hi);border-radius:var(--radius-sm);cursor:pointer;transition:border-color .15s,background-color .15s}.ans:hover:not(:disabled){border-color:var(--ember);background:#ff6a2b0f}.ans:disabled{cursor:default}.ans.right{border-color:var(--hivis);background:#d4ff3a14}.ans.wrong{border-color:var(--fire);background:#ff3b301a}.feedback p{margin:16px 0 0}.feedback .btn{margin-top:14px}.foot{margin-top:48px;padding-block:20px calc(24px + env(safe-area-inset-bottom));border-top:1px solid var(--line);font:12px/1.6 var(--mono);color:var(--dim)}.foot p{margin:0}:focus-visible{outline:2px solid var(--hivis);outline-offset:3px}@media (min-width: 640px){.wrap{padding-inline:24px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.progress{margin-inline:0;padding-inline:0;flex-wrap:wrap}.quiz{padding:28px}.topbar .tag{display:block}.planet{width:360px;top:-90px;right:-90px}.planet:after{display:block}}@media (min-width: 960px){.hero{padding:80px 0 44px}.hero>:not(.planet){max-width:620px}.lead{font-size:20px}.planet{width:440px;top:-110px;right:-60px}.step{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:36px;align-items:start}.step .lab{order:0;position:sticky;top:calc(var(--top) + 16px)}.step-pager{position:static;margin:36px 0 0;padding:0;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}.pager .btn{flex:0 0 auto}.pager>:last-child{margin-left:auto}}@media (min-width: 1100px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (prefers-reduced-motion: reduce){*{transition:none!important}.tile:hover,.tile:focus-visible{transform:none}}