.quest{--console:#1d1d1f;--console-hi:#2c2c2e;--bezel:#0a0b09;--screen:#0e100c;--ink:#f5f5f7;--muted:#86868b;--soft:#a1a1a6;--line:#2c2c2e;--green:#c5f74f;--green-dim:#7e9e2e;--red:#ff453a;--display:"Bricolage Grotesque", "Geist", ui-sans-serif, sans-serif;--sans:"Geist", ui-sans-serif, system-ui, sans-serif;--mono:"JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace;--line-ink:#f2f4ee;--paper:#161814;--paper-2:#20231d;--sticker-ink:#171914;--r:2.6cqw;--fh:max(30rem, calc(100dvh - 3.5rem - 1px - 4rem));color-scheme:dark;container-type:inline-size;& [hidden]{display:none!important}& button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}& a,& h2,& p{color:inherit}& svg.icon{flex:none;display:block}& .frame{--fw:min(100cqw, calc(var(--fh) * 5 / 8), 528px);width:var(--fw);height:calc(var(--fw) * 8 / 5);background:var(--console);color:var(--ink);font-family:var(--sans);border-radius:calc(var(--fw) * .035) calc(var(--fw) * .035) calc(var(--fw) * .14) calc(var(--fw) * .035);padding-top:calc(var(--fw) * .045);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-direction:column;align-items:center;margin-inline:auto;display:flex;position:relative;box-shadow:inset 0 1px #3a3a3c,inset 0 -2px #111;container-type:size}& .bezel{background:var(--bezel);border-radius:2.2cqw 2.2cqw 7cqw;width:96cqw;padding:1.8cqw}& .screen{aspect-ratio:16/9;background:var(--screen);width:100%;position:relative;container-type:size}& #game{transition:opacity .5s;position:absolute;inset:0}& #game.faded{opacity:.25}& .view:not([hidden]),& .overlay:not([hidden]){animation:.2s ease-out quest-fade-in}& .screen-ui{z-index:5;pointer-events:none;--screen-h:56.25cqw;width:100%;height:100cqw;margin-inline:auto;position:absolute;inset:0 0 auto;overflow:hidden;container-type:size}& .screen-ui>*{pointer-events:auto}& #game canvas{display:block;width:100%!important;height:100%!important}& .brand{height:9cqw;color:var(--soft);font-family:var(--display);align-items:center;gap:2cqw;font-size:3.6cqw;font-weight:700;display:flex}& .brand svg{width:6cqw;height:auto;color:var(--green)}& .controls{flex:1;grid-template-rows:1fr auto;grid-template-columns:40cqw 1fr 40cqw;align-items:end;row-gap:6cqw;width:100%;padding:0 5cqw 6cqw;display:grid}& .dpad{touch-action:none;justify-self:start;width:36cqw;height:36cqw;position:relative}& .dpad:before,& .dpad:after{content:"";background:var(--console-hi);border-radius:1.6cqw;position:absolute;box-shadow:0 .8cqw #121214}& .dpad:before{height:33.4%;top:33.3%;left:0;right:0}& .dpad:after{width:33.4%;top:0;bottom:0;left:33.3%}& .dpad .arm{z-index:1;width:33.4%;height:33.4%;color:var(--soft);pointer-events:none;place-items:center;font-size:3.6cqw;display:grid;position:absolute}& .dpad .arm.on{color:var(--green)}& .dpad .a-up{top:0;left:33.3%}& .dpad .a-down{bottom:0;left:33.3%}& .dpad .a-left{top:33.3%;left:0}& .dpad .a-right{top:33.3%;right:0}& .ab{justify-self:end;width:38cqw;height:30cqw;position:relative}& .ab button{width:16.5cqw;height:16.5cqw;font-family:var(--display);touch-action:none;border-radius:50%;font-size:5cqw;font-weight:700;transition:transform 50ms;position:absolute;box-shadow:0 1cqw #121214}& .ab button.down{transform:translateY(.8cqw);box-shadow:0 .2cqw #121214}& .btn-a{background:var(--green);color:#0e100c;top:0;right:0}& .btn-b{color:var(--ink);background:#3a3a3c;bottom:0;left:0}& .ab .cap-key{display:none}@media (pointer:fine){& .ab .cap-pad{display:none}& .ab .cap-key{display:inline}& .btn-a .cap-key{font-size:.6em}}& .ab .lbl{font-family:var(--display);color:var(--soft);white-space:nowrap;font-size:3cqw;position:absolute}& .ab .lbl-a{top:18cqw;right:8.25cqw;translate:50%}& .ab .lbl-b{bottom:-4.4cqw;left:8.25cqw;translate:-50%}& .pills{grid-column:1/-1;justify-content:center;gap:6cqw;display:flex}& .pill{font-family:var(--display);color:var(--soft);background:var(--console-hi);touch-action:none;border-radius:99px;padding:1.6cqw 4.2cqw;font-size:3.4cqw}& .pill.down,& .pill:active{color:var(--ink)}& .pill[aria-pressed=false]{text-decoration:line-through}& .controls.idle .dpad:before,& .controls.idle .dpad:after{opacity:.6}& .pill:focus-visible,& .ab button:focus-visible{outline:2px solid var(--green);outline-offset:2px}& .hud{z-index:2;pointer-events:none;font-family:var(--display);color:var(--ink);justify-content:space-between;padding:2.2cqw 2.6cqw;font-size:3.8cqw;font-weight:700;display:flex;position:absolute;top:0;left:0;right:0}& .hud span{border:.35cqw solid var(--line-ink);background:#161814db;border-radius:99px;align-items:center;gap:1.4cqw;padding:.8cqw 2.4cqw .8cqw 1cqw;line-height:1;display:inline-flex;box-shadow:.5cqw .6cqw #1719148c}& .hud .ico-orb,& .card-head .orb-ico{background:radial-gradient(circle at 35% 30%, #f4ffd1 0 18%, var(--green) 55%, var(--green-dim));border-radius:50%;flex:none;display:block;box-shadow:0 0 1.2cqw #c5f74f99}& .hud .ico-orb,& .hud .ico-quiz{width:3.6cqw;height:3.6cqw}& .hud .ico-quiz{background:var(--line-ink);color:var(--sticker-ink);border-radius:50%;place-items:center;font-size:2.6cqw;font-style:normal;display:grid}& .toast{z-index:3;border-radius:var(--r);border:.35cqw solid var(--line-ink);width:max-content;max-width:84cqw;font-family:var(--sans);text-align:center;opacity:0;pointer-events:none;background:#161814f0;padding:2cqw 3.4cqw;font-size:3.6cqw;font-weight:500;line-height:1.35;transition:opacity .2s;position:absolute;top:11cqw;left:50%;transform:translate(-50%);box-shadow:.8cqw .8cqw #17191499}& .toast.show{opacity:1}& .view{z-index:5;background:var(--screen);box-shadow:0 0 0 100cqw var(--screen);flex-direction:column;align-items:center;display:flex;position:absolute;inset:0}& .view-title{--sky:linear-gradient(#4f9dff, #cfefff 75%);background:var(--sky);box-shadow:none;color:var(--sticker-ink);justify-content:center;padding:6cqw}& .view-title:before{content:"";z-index:-1;background:var(--sky);position:absolute;inset:0 -100cqw}& .title-nimbus{width:40cqw;height:auto;color:var(--sticker-ink);animation:2.6s ease-in-out infinite quest-float}& .title-logo{color:var(--sticker-ink);font-family:var(--display);letter-spacing:-.02em;align-items:center;gap:2.4cqw;margin-top:3cqw;font-size:10cqw;font-weight:800;line-height:1;display:flex}& .title-logo svg{width:12cqw;height:auto}& .subtitle{background:var(--green);color:var(--sticker-ink);font-family:var(--display);box-shadow:.6cqw .9cqw 0 var(--sticker-ink);border-radius:1.6cqw;margin:3cqw 0 0;padding:1cqw 3cqw;font-size:5.4cqw;font-weight:800;rotate:-3deg}& .btn-start{border-radius:var(--r);border:.5cqw solid var(--sticker-ink);background:var(--green);min-width:42cqw;color:var(--sticker-ink);font-family:var(--display);box-shadow:1cqw 1cqw 0 var(--sticker-ink);margin-top:6cqw;padding:2.6cqw 6cqw;font-size:6cqw;font-weight:800;animation:1.6s ease-in-out infinite quest-pulse}& .btn-start:focus-visible{outline:none}& .title-hint{color:#2b3a52;margin:4cqw 0 0;font-size:3.4cqw;font-weight:500}& .view-select{align-items:stretch;padding:6cqw 5cqw 4cqw}& .view-select h2{font-family:var(--display);letter-spacing:-.01em;margin:0 0 4cqw;font-size:7cqw;font-weight:800}& .stage-list{flex-direction:column;gap:3.4cqw;min-height:0;padding:0 1.2cqw 1.2cqw 0;display:flex;overflow-y:auto}& .stage-card{text-align:left;border-radius:var(--r);background:var(--paper);border:.35cqw solid #3a3e35;grid-template-columns:5cqw 7cqw 1fr auto;align-items:center;gap:2cqw;padding:3cqw 3cqw 3cqw 1.4cqw;display:grid}& .stage-card .cursor{visibility:hidden;color:var(--green);justify-content:center;font-size:3.6cqw;display:flex}& .stage-card.is-focused .cursor{visibility:visible}& .stage-card.is-focused{border-color:var(--line-ink);box-shadow:1cqw 1cqw 0 var(--line-ink)}& .stage-card:focus-visible{outline:none}& .stage-card .num{font-family:var(--display);color:var(--green);font-size:7cqw;font-weight:800}& .stage-card .t{font-family:var(--display);font-size:4.8cqw;font-weight:700;display:block}& .stage-card .badge{margin-top:1cqw}& .stage-card .status{text-align:right;font-family:var(--display);color:var(--soft);font-size:3.6cqw;font-weight:700}& .stage-card .status.cleared{color:var(--green)}& .stage-card .status .best{font-family:var(--sans);color:var(--soft);font-size:3cqw;font-weight:500;display:block}& .stage-card.is-locked .num,& .stage-card.is-locked .t{color:var(--soft)}& .view-foot{justify-content:space-between;align-items:center;margin-top:auto;display:flex}& .link-btn{font-family:var(--display);color:var(--ink);padding:2cqw 0;font-size:4.2cqw;font-weight:700}& .link-btn.is-focused,& .link-btn:focus-visible{color:var(--green);outline:none}& .foot-hint{color:var(--soft);font-size:3.4cqw}& .badge{font-family:var(--mono);color:var(--green);background:#c5f74f1a;border-radius:1cqw;padding:.6cqw 1.6cqw;font-size:2.9cqw;display:inline-block}& .overlay{z-index:6;background:#0e100cd1;justify-content:center;align-items:center;padding:3cqw;display:flex;position:absolute;inset:0;box-shadow:0 0 0 100cqw #0e100cd1}& .overlay:has(>.pause-card,>.load-card){grid-template-rows:calc(var(--screen-h) - 6cqw);background:linear-gradient(#0e100cd1 var(--screen-h), transparent 0);display:grid}& .overlay:has(>.pause-card,>.load-card)>.card{place-self:safe center;max-height:none}& .card,& .quiz{border-radius:calc(var(--r) * 1.4);background:var(--paper);border:.4cqw solid var(--line-ink);width:calc(100% - 1.2cqw);max-height:calc(100% - 1.2cqw);box-shadow:1.2cqw 1.2cqw 0 var(--line-ink);flex-direction:column;margin:0 1.2cqw 1.2cqw 0;display:flex;overflow:hidden}& .card-head{align-items:flex-start;gap:3cqw;padding:4cqw 4.5cqw 2cqw;display:flex}& .card-head .orb-ico{width:5.4cqw;height:5.4cqw;margin-top:1.2cqw}& .card-head .meta{background:var(--green);color:var(--sticker-ink);font-family:var(--display);box-shadow:.4cqw .6cqw 0 var(--line-ink);border-radius:1.2cqw;margin:0 0 1.8cqw;padding:.5cqw 1.8cqw;font-size:3.1cqw;font-weight:700;display:inline-block;rotate:-2deg}& .card-head h2{font-family:var(--display);letter-spacing:-.01em;margin:0;font-size:6cqw;font-weight:800;line-height:1.1}& .card-body{overscroll-behavior:contain;color:#d9d9de;-webkit-user-select:text;user-select:text;flex:1;min-height:0;padding:1cqw 4.5cqw 3cqw;font-size:3.9cqw;line-height:1.45;overflow-y:auto}& .card-body p{margin:0 0 2.6cqw}& .card-body p.sub,& .card-body strong,& .card-body b{color:var(--ink);font-weight:600}& .card-body code,& .quiz code{font-family:var(--mono);color:var(--green);font-size:.92em}& .card-body .accent,& .quiz .accent{color:var(--green)}& .card-body .warn,& .quiz .warn{color:#ff9f0a}& .card-body pre{background:var(--screen);box-shadow:inset 0 0 0 .4cqw var(--line);font-family:var(--mono);color:var(--ink);border-radius:1.6cqw;margin:0 0 2.6cqw;padding:2.4cqw 3cqw;font-size:3.1cqw;line-height:1.45;overflow-x:auto}& .card-body .visual{background:var(--screen);box-shadow:inset 0 0 0 .4cqw var(--line);border-radius:1.6cqw;margin:0 0 2.6cqw;padding:2cqw}& .card-body .visual svg{width:100%;height:auto;display:block}& .pane{margin-bottom:2.6cqw}& .pane pre{margin-bottom:0}& .pane-head{align-items:baseline;gap:2cqw;margin-bottom:1.2cqw;display:flex}& .pane-head b{font-family:var(--display);color:var(--ink);font-size:4cqw;font-weight:600}& .pane-head span{font-family:var(--mono);color:var(--soft);font-size:2.9cqw}& .pane+.pane .pane-head b{color:var(--green)}& .card-body ul{margin:0 0 2.6cqw;padding:0;list-style:none}& .card-body ul li{margin-bottom:2cqw;padding-left:4cqw;position:relative}& .card-body ul li:before{content:"";background:var(--green);border-radius:50%;width:1.6cqw;height:1.6cqw;position:absolute;top:1.6cqw;left:0}& .steps{counter-reset:s;margin:0;padding:0;list-style:none}& .steps li{counter-increment:s;margin-bottom:3.4cqw;padding-left:8cqw;position:relative}& .steps li:before{content:counter(s);background:var(--green);width:5.4cqw;height:5.4cqw;color:var(--sticker-ink);font-family:var(--display);border-radius:50%;place-items:center;font-size:3.4cqw;font-weight:800;display:grid;position:absolute;top:0;left:0}& .steps .st{color:var(--ink);margin-bottom:1.2cqw;font-weight:600}& .steps pre{margin:0}& .steps .note{color:var(--soft);margin:1.2cqw 0 0;font-size:3.9cqw}& .card-body a{color:var(--green);text-underline-offset:2px}& .card-foot{border-top:.35cqw dashed #3a3e35;justify-content:space-between;align-items:center;gap:3cqw;padding:3cqw 4.5cqw 4cqw;display:flex}& .btn-primary,& .btn-ghost{font-family:var(--display);border:.4cqw solid var(--line-ink);border-radius:1.8cqw;padding:1.8cqw 4.2cqw;font-size:4.2cqw;font-weight:700}& .btn-primary{background:var(--green);color:var(--sticker-ink);box-shadow:.7cqw .8cqw 0 var(--line-ink)}& .btn-ghost{color:var(--ink);border-color:#4a4f44}& .btn-primary.is-focused,& .btn-primary:focus-visible{outline:none}& .btn-ghost.is-focused,& .btn-ghost:focus-visible{border-color:var(--line-ink);box-shadow:.7cqw .8cqw 0 var(--line-ink);color:var(--green);outline:none}& .res-foot{grid-template-columns:auto auto auto;justify-content:space-between;display:grid}& .res-foot>*{white-space:nowrap;text-align:center;padding:2.2cqw 3.2cqw;font-size:3.9cqw;text-decoration:none}& .pause-card{width:70cqw}& .pause-body{flex-direction:column;gap:3cqw;padding-bottom:5cqw;display:flex}& .quiz-head{font-family:var(--display);color:var(--soft);justify-content:space-between;align-items:center;padding:3cqw 4cqw 1cqw;font-size:3.2cqw;font-weight:700;display:flex}& .quiz-head span:first-child{background:var(--green);color:var(--sticker-ink);box-shadow:.4cqw .6cqw 0 var(--line-ink);border-radius:1.2cqw;padding:.5cqw 1.8cqw;font-size:3.4cqw;font-weight:800;rotate:-2deg}& .quiz-body{flex:1;min-height:0;padding:4cqw;overflow-y:auto}& .quiz-prompt{font-family:var(--display);color:var(--ink);margin:0 0 4cqw;font-size:4.4cqw;font-weight:700;line-height:1.35}& .quiz-prompt p{margin:0}& .quiz-choices{flex-direction:column;gap:2.4cqw;display:flex}& .choice{text-align:left;background:var(--paper-2);color:#d9d9de;border-radius:1.8cqw;grid-template-columns:6cqw 1fr;align-items:start;gap:2cqw;padding:2.6cqw 3cqw;font-size:3.9cqw;line-height:1.4;display:grid;box-shadow:inset 0 0 0 .4cqw #3a3e35}& .choice .k{font-family:var(--display);color:var(--green);font-weight:800}& .choice.code .v,& .choice.code .v code{font-family:var(--mono);color:var(--ink)}& .choice.is-focused,& .choice:focus-visible{box-shadow:inset 0 0 0 .4cqw var(--line-ink), .7cqw .8cqw 0 var(--line-ink);color:var(--ink);outline:none}& .choice.right{box-shadow:inset 0 0 0 .5cqw var(--green);background:#c5f74f24}& .choice.wrong{box-shadow:inset 0 0 0 .5cqw var(--red);background:#ff453a1f}& .choice[disabled]{cursor:default}& .quiz-feedback{margin:4cqw 0 0;font-size:3.9cqw;line-height:1.45}& .quiz-feedback p{margin:0 0 1.6cqw}& .quiz-feedback.ok{color:var(--green)}& .quiz-feedback.bad{color:#ff8a80}& .quiz-foot{justify-content:space-between;gap:3cqw;padding:3cqw 4cqw 4cqw;display:flex}& .stats{font-family:var(--display);grid-template-columns:1fr auto;gap:1.6cqw 4cqw;margin-bottom:4cqw;font-size:4.4cqw;display:grid}& .stats span{font-family:var(--sans);font-size:3.9cqw}& .stats b{color:var(--green);font-weight:800}& .next-h{font-family:var(--display);color:var(--ink);margin:0 0 1.6cqw;font-size:4.4cqw;font-weight:600}@media (width>=48rem) and (pointer:fine){&:not([data-embedded]){& .frame{--sw:min(94cqw, calc(var(--fh) / .74));--c:calc(var(--sw) / 340);width:calc(var(--sw) + 18 * var(--c));align-items:center;column-gap:calc(8 * var(--c));row-gap:calc(4 * var(--c));height:auto;padding:calc(5 * var(--c)) calc(6 * var(--c));border-radius:calc(6 * var(--c)) calc(6 * var(--c)) calc(16 * var(--c)) calc(6 * var(--c));grid-template-columns:auto 1fr auto 1fr auto;grid-template-areas:"screen screen screen screen screen""dpad menu brand sound ab";display:grid;container-type:normal}& .bezel{width:auto;padding:calc(3 * var(--c));border-radius:calc(3 * var(--c)) calc(3 * var(--c)) calc(9 * var(--c)) calc(3 * var(--c));grid-area:screen}& .screen{width:var(--sw);overflow:hidden}& .screen-ui{--screen-h:100%;width:min(100%,92.3077cqh);height:100%;overflow:visible}& .brand{gap:calc(2 * var(--c));height:auto;font-size:calc(4.4 * var(--c));grid-area:brand}& .brand svg{width:calc(7 * var(--c))}& .controls,& .pills{display:contents}& .dpad{width:calc(36 * var(--c));height:calc(36 * var(--c));grid-area:dpad}& .dpad:before,& .dpad:after{border-radius:calc(1.6 * var(--c));box-shadow:0 calc(.8 * var(--c)) 0 #121214}& .dpad .arm{font-size:calc(3.6 * var(--c))}& .ab{width:calc(38 * var(--c));height:calc(34 * var(--c));grid-area:ab}& .ab button{width:calc(16.5 * var(--c));height:calc(16.5 * var(--c));font-size:calc(5 * var(--c));box-shadow:0 var(--c) 0 #121214}& .ab button.down{transform:translateY(calc(.8 * var(--c)));box-shadow:0 calc(.2 * var(--c)) 0 #121214}& .btn-b{bottom:calc(4.4 * var(--c))}& .ab .lbl{font-size:calc(3 * var(--c))}& .ab .lbl-a{right:calc(8.25 * var(--c));top:calc(18 * var(--c))}& .ab .lbl-b{left:calc(8.25 * var(--c));bottom:0}& .pill{font-size:calc(3.6 * var(--c));padding:calc(1.6 * var(--c)) calc(4.2 * var(--c))}& .pill[data-btn=menu]{grid-area:menu;justify-self:end}& .pill[data-sound]{grid-area:sound;justify-self:start}}}@media (orientation:landscape) and (pointer:coarse){--lh:var(--fh);&[data-embedded]{--lh:100dvh;place-items:center;display:grid}& .frame{--c:min(calc(100cqw / 506), calc((var(--lh) - 44px) / 220));--btn:max(44px, calc(27 * var(--c)));--pad:max(120px, calc(60 * var(--c)));--side:max(calc(66 * var(--c)), calc(2 * var(--btn) + 8 * var(--c)), var(--pad));width:min(100cqw, calc(2 * var(--side) + 374 * var(--c)));grid-template-columns:var(--side) minmax(0, calc(346 * var(--c))) var(--side);place-items:center;column-gap:calc(8 * var(--c));row-gap:calc(4 * var(--c));height:auto;padding:calc(6 * var(--c));border-radius:calc(6 * var(--c));grid-template-areas:"dpad screen ab""dpad pills ab";display:grid;container-type:normal}& .bezel{width:100%;padding:calc(3 * var(--c));border-radius:calc(3 * var(--c));grid-area:screen}& .screen{width:100%;overflow:hidden}& .screen-ui{--screen-h:100%;width:min(100%,92.3077cqh);height:100%;overflow:visible}& .brand{display:none}& .controls{display:contents}& .dpad{width:var(--pad);height:var(--pad);grid-area:dpad}& .dpad:before,& .dpad:after{border-radius:calc(var(--pad) / 24);box-shadow:0 calc(var(--pad) / 50) 0 #121214}& .dpad .arm{font-size:max(12px, calc(5 * var(--c)))}& .ab{width:calc(2 * var(--btn) + 6 * var(--c));height:calc(2 * var(--btn) + 4 * var(--c));grid-area:ab}& .ab button{width:var(--btn);height:var(--btn);font-size:max(14px, calc(8 * var(--c)));box-shadow:0 calc(var(--btn) / 20) 0 #121214}& .ab button.down{transform:translateY(calc(var(--btn) / 25));box-shadow:0 calc(var(--btn) / 90) 0 #121214}& .btn-b{bottom:calc(max(11px, 4.2 * var(--c)) + 3 * var(--c))}& .ab .lbl{font-size:max(11px, calc(4.2 * var(--c)))}& .ab .lbl-a{right:calc(var(--btn) / 2);top:calc(var(--btn) + 2 * var(--c))}& .ab .lbl-b{left:calc(var(--btn) / 2);bottom:0}& .pills{gap:calc(4 * var(--c));grid-area:pills}& .pill{min-height:44px;font-size:max(13px, calc(5 * var(--c)));padding:0 max(14px, calc(5 * var(--c)))}}@media (prefers-reduced-motion:reduce){& .btn-start,& .title-nimbus,& .view:not([hidden]),& .overlay:not([hidden]){animation:none}& .toast,& #game{transition:none}}}@keyframes quest-pulse{50%{box-shadow:1cqw 1cqw #171914,0 0 0 1.4cqw #c5f74f73}}@keyframes quest-fade-in{0%{opacity:0}}@keyframes quest-float{50%{translate:0 -2.4cqw;rotate:2deg}}
