@font-face{font-family:Open Sans;src:url(/sorting-lab/fonts/open-sans-latin.woff2) format("woff2");font-style:normal;font-weight:400 800;font-display:swap}:root{font-family:Open Sans,system-ui,sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased;--yellow: #f9dc00;--yellow-strong: #e2c700;--yellow-soft: #fff8cf;--ink: #1e1d1c;--anthracite: #2b363f;--ink-2: #3a4440;--muted: #65706b;--line: #dde2df;--line-strong: #b6bfba;--surface: #fff;--bg: #f2f4f3;--info-bg: #f8f9f8;--radius: 6px;--gutter: clamp(14px, 2.4vw, 32px);--header: 64px;--fw-regular: 400;--fw-bold: 700;--fw-heavy: 800;--fs-display: clamp(34px, 4.6vw, 54px);--fs-score: clamp(36px, 5vw, 52px);--fs-hero: clamp(56px, 8vw, 104px);--fs-headline: clamp(22px, 2.4vw, 32px);--fs-title: 15px;--fs-body: 14px;--fs-body-sm: 13px;--fs-small: 12px;--fs-label: 12px;--fs-label-sm: 11px;--ls-display: -.04em;--ls-headline: -.02em;--ls-label: .08em;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}html{touch-action:manipulation;-webkit-text-size-adjust:100%}body{margin:0;min-width:320px;background:var(--bg)}button,input{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--ink);outline-offset:2px}h1,h2,h3,p{margin:0}#app{min-height:100dvh;display:flex;flex-direction:column}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid transparent;border-radius:4px;background:transparent;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;text-decoration:none;color:var(--ink);transition:background .15s,border-color .15s,transform .1s}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:default}.btn-primary{background:var(--yellow);border-color:var(--yellow)}.btn-primary:hover:not(:disabled){background:var(--yellow-strong);border-color:var(--yellow-strong)}.btn-outline{background:var(--surface);border-color:var(--line-strong)}.btn-outline:hover{border-color:var(--ink)}.btn-quiet{min-height:36px;padding:0 10px;color:var(--ink-2)}.btn-quiet:hover{background:#e6eae8}.btn-lg{min-height:54px;padding:0 26px;font-size:var(--fs-body-sm)}.btn span[aria-hidden]{font-size:1.3em;font-weight:var(--fw-regular);letter-spacing:0}.site-header{position:sticky;top:0;z-index:10;height:var(--header);flex:none;display:flex;align-items:center;gap:16px;padding:0 var(--gutter);background:var(--surface);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;height:48px;padding:0;border:0;background:transparent}.brand img{display:block;width:140px;height:auto}.header-title{padding-left:18px;border-left:1px solid var(--line);line-height:34px;font-size:clamp(18px,2vw,24px);font-weight:var(--fw-heavy);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.mode-switch{margin-left:auto;display:flex;gap:4px;padding:4px;border-radius:8px;background:#eaeeec}.mode-switch button{min-height:38px;padding:0 18px;border:0;border-radius:5px;background:transparent;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-2);transition:background .15s}.mode-switch button:hover:not(.is-active){background:#dde2df;color:var(--ink)}.mode-switch button.is-active{background:var(--yellow);color:var(--ink);box-shadow:0 1px 3px #0000001f}.eyebrow{font-size:var(--fs-label-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted)}.period{color:var(--yellow-strong)}.fineprint{font-size:var(--fs-small);font-weight:var(--fw-regular);line-height:1.5;color:var(--muted)}.swatch{display:block;width:var(--size);height:var(--size);flex:none}.swatch-row{display:flex;flex-wrap:wrap;gap:4px}.explore{--board-w: calc((100dvh - var(--header) - 40px) * .8889);flex:1;display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,var(--board-w)) minmax(230px,1fr);justify-content:center;align-items:start;gap:20px;padding:20px var(--gutter)}.panel{position:sticky;top:calc(var(--header) + 20px);display:flex;width:100%;max-width:380px;flex-direction:column;gap:12px;max-height:calc(100dvh - var(--header) - 40px);overflow:auto}.explore>.panel:first-child{justify-self:end}.explore>.panel:last-child{justify-self:start}.step{padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.step-info{background:var(--info-bg);border-style:dashed}.step-info .step-head h2{color:var(--muted)}.step-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.step-head h2{font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;white-space:nowrap}.step-no{width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:4px;background:var(--anthracite);color:var(--yellow);font-size:var(--fs-label);font-weight:var(--fw-bold)}.step-no.is-done{background:var(--yellow);color:var(--ink)}.step-note,.empty-note{margin-bottom:10px;font-size:var(--fs-body-sm);font-weight:var(--fw-regular);line-height:1.45;color:var(--muted)}.empty-note{margin:0}.choice-list{display:grid;gap:8px}.choice{width:100%;min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:4px;background:var(--surface);text-align:left;user-select:none;-webkit-user-select:none;touch-action:none;transition:border-color .15s,background .15s,box-shadow .15s}.choice:hover{border-color:var(--line-strong);box-shadow:0 2px 8px #0000000d}.choice.is-selected{background:var(--yellow);border-color:var(--yellow-strong)}.choice-text{display:grid;gap:1px;min-width:0}.choice strong{font-size:var(--fs-title);font-weight:var(--fw-bold);line-height:1.25}.choice small{font-size:var(--fs-small);font-weight:var(--fw-regular);line-height:1.35;color:var(--muted)}.choice.is-selected small{color:var(--ink-2)}.choice-mark{flex:none;width:22px;text-align:center;font-size:18px;color:#9aa4a0}.choice.is-selected .choice-mark{color:var(--ink);font-weight:var(--fw-bold)}.mix-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}.mix-list li{min-height:34px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;font-size:var(--fs-body-sm);font-weight:var(--fw-bold)}.mix-name small{display:block;font-size:var(--fs-label-sm);font-weight:var(--fw-regular);color:var(--muted)}.route-tag{padding:3px 8px;border-radius:3px;background:#e7ebe9;font-size:var(--fs-label-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase}.route-tag.is-eject{background:var(--yellow)}.task-options{display:grid;gap:8px}.task-option{min-height:48px;display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:4px;background:var(--surface);text-align:left;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label)}.task-option:hover{border-color:var(--line-strong)}.task-option.is-selected{background:var(--yellow);border-color:var(--yellow-strong)}.radio{width:18px;height:18px;flex:none;border:2px solid var(--line-strong);border-radius:50%;background:var(--surface)}.task-option.is-selected .radio{border-color:var(--anthracite);box-shadow:inset 0 0 0 3px var(--surface);background:var(--anthracite)}.notice{padding:12px;border:1px solid #ecd65c;border-radius:4px;background:var(--yellow-soft)}.notice strong{font-size:var(--fs-body-sm);font-weight:var(--fw-bold)}.notice p{margin:4px 0 10px;font-size:var(--fs-body-sm);font-weight:var(--fw-regular);line-height:1.45;color:var(--ink-2)}.notice-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.notice-actions span{font-size:var(--fs-small);font-weight:var(--fw-regular);color:var(--muted)}.chip-button{min-height:34px;padding:0 14px;border:1px solid var(--anthracite);border-radius:999px;background:var(--surface);font-size:var(--fs-body-sm);font-weight:var(--fw-bold)}.chip-button:hover{background:var(--yellow)}.stage{min-width:0}.board{position:relative;width:100%;aspect-ratio:800 / 900;border:1px solid var(--line);border-radius:var(--radius);background:#fafbfa;overflow:hidden}.board>canvas{display:block;width:100%;height:100%;touch-action:none}.zone{position:absolute;left:31.25%;width:37.5%;display:grid;place-items:center;padding:6px;border:2px dashed #56625d;border-radius:8px;background:#fffc;pointer-events:none;text-align:center;transition:background .15s,border-color .15s,transform .15s}.zone>span{font-size:clamp(10px,1.3vw,var(--fs-label));font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase}.zone-feed{top:87.3%;height:10.2%}.zone-sensor{top:46.67%;height:14.44%}.zone-feed:not(.is-filled),.zone-feed.is-filled~.zone-sensor:not(.is-filled){animation:zone-pulse 1.8s ease-in-out infinite}.zone.is-filled{border-color:transparent;background:transparent}.zone.is-filled>span{visibility:hidden}.tap-only{display:none}.is-dragging-feed .zone-feed,.is-dragging-sensor .zone-sensor{animation:none;border-color:var(--ink);background:#f9dc0059}.is-dragging-feed .zone-feed>span,.is-dragging-sensor .zone-sensor>span{visibility:visible}.placed{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);z-index:1;display:flex;align-items:center;gap:6px;padding:4px 4px 4px 12px;border:1px solid var(--anthracite);border-radius:4px;background:var(--surface);box-shadow:0 4px 12px #0000001f;pointer-events:auto;text-align:left;white-space:nowrap}.placed>span{display:grid}.placed strong{font-size:clamp(11px,1.5vw,14px);font-weight:var(--fw-bold);line-height:1.2}.placed small{font-size:clamp(9px,1.1vw,var(--fs-label-sm));font-weight:var(--fw-regular);color:var(--muted)}.placed-remove{width:26px;height:26px;flex:none;display:grid;place-items:center;padding:0;border:0;border-radius:3px;background:transparent;font-size:18px;line-height:1;color:var(--muted)}.placed-remove:hover{background:#eef1ef;color:var(--ink)}.step-input .choice.nudge:not(:hover):not(:focus-visible){animation:nudge-right 5s ease-in-out infinite}.step-system .choice.nudge:not(:hover):not(:focus-visible){animation:nudge-left 5s ease-in-out infinite}@keyframes nudge-right{0%,6%,14%,to{transform:none}10%{transform:translate(10px)}}@keyframes nudge-left{0%,6%,14%,to{transform:none}10%{transform:translate(-10px)}}.zone.is-over{background:#f9dc00b3!important;transform:scale(1.04)}@keyframes zone-pulse{0%,to{border-color:#56625d}50%{border-color:#56625d55;background:#fffbe0cc}}.drag-ghost{position:fixed;left:0;top:0;z-index:50;pointer-events:none;padding:10px 14px;border:1px solid var(--anthracite);border-radius:4px;background:var(--yellow);box-shadow:0 12px 28px #0003;font-size:var(--fs-title);font-weight:var(--fw-bold);white-space:nowrap}.intro{flex:1;display:grid;place-items:center;padding:28px var(--gutter)}.intro-hero{width:min(100%,980px);display:flex;flex-direction:column;align-items:center;text-align:center}.intro-hero h1{margin:0;font-size:clamp(44px,7.4vw,104px);font-weight:var(--fw-heavy);line-height:1;letter-spacing:var(--ls-display);text-wrap:balance}.round-list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;width:100%;margin:clamp(26px,5vh,54px) 0;padding:0;text-align:left}.round-list li{display:flex;flex-direction:column;gap:4px;padding-top:12px;border-top:2px solid var(--line)}.round-no{font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);color:var(--muted)}.round-text{font-size:var(--fs-title);font-weight:var(--fw-bold);line-height:1.3}.round-vs{font-size:var(--fs-body-sm);font-weight:var(--fw-regular);color:var(--muted)}.btn-start{min-height:64px;padding:0 38px;font-size:var(--fs-body);animation:start-pulse 1.6s ease-in-out infinite}@keyframes start-pulse{0%,to{box-shadow:0 0 #f9dc00b3;transform:scale(1)}50%{box-shadow:0 0 0 16px #f9dc0000;transform:scale(1.04)}}.challenge{position:relative;--cboard: calc((100dvh - var(--header) - 40px) * 1.3333);flex:1;display:grid;grid-template-columns:minmax(0,var(--cboard)) minmax(220px,340px);justify-content:center;align-items:start;align-content:start;gap:20px;padding:20px var(--gutter)}.hud{position:sticky;top:calc(var(--header) + 20px);display:flex;flex-direction:column;gap:14px;padding:18px 18px 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.round-dots{list-style:none;display:flex;gap:5px;margin:8px 0 0;padding:0}.round-dots li{flex:1;max-width:44px;height:6px;border-radius:3px;background:#dfe4e1}.round-dots li.is-done{background:var(--anthracite)}.round-dots li.is-current{background:var(--yellow-strong)}.hud-task{font-size:var(--fs-headline);font-weight:var(--fw-heavy);line-height:1.1;letter-spacing:var(--ls-headline)}.hud .task-groups{gap:10px}.hud .task-group{text-align:left}.hud .task-group .swatch-row{justify-content:flex-start;gap:6px;margin-top:8px}.hud .btn-outline{width:100%}.board-dim{position:absolute;inset:0;z-index:2;background:#f5f7f6d9;-webkit-backdrop-filter:grayscale(1);backdrop-filter:grayscale(1)}.board-dim.is-player-side{left:50%}.spotlight-ring{position:absolute;z-index:6;border:4px solid var(--yellow);border-radius:12px;pointer-events:none;transition:left .5s ease,top .5s ease,width .5s ease,height .5s ease;animation:ring-pulse 1.3s ease-in-out infinite}.spotlight-ring.no-anim{transition:none}@keyframes ring-pulse{0%,to{box-shadow:0 0 #f9dc00aa}50%{box-shadow:0 0 0 12px #f9dc0000}}.tutorial-bubble{position:absolute;z-index:7;width:max-content;max-width:340px;padding:14px 16px;border-radius:var(--radius);background:var(--anthracite);color:#fff;box-shadow:0 16px 40px #00000038}.tutorial-bubble p{font-size:var(--fs-title);font-weight:var(--fw-regular);line-height:1.4}.tutorial-bubble b{font-weight:var(--fw-bold)}.tutorial-bubble .btn{margin-top:12px}.tutorial-bubble:after{content:"";position:absolute;border:10px solid transparent}.sidebar-bubble{transform:translate(-100%,-50%)}.sidebar-bubble:after{top:50%;right:-10px;border-right:0;border-left-color:var(--anthracite);transform:translateY(-50%)}.sidebar-bubble.is-below{left:16px;right:16px;max-width:none;width:auto;transform:none}.sidebar-bubble.is-below:after{top:-10px;left:50%;right:auto;border:10px solid transparent;border-top:0;border-bottom-color:var(--anthracite);transform:translate(-50%)}.opponent-bubble{left:calc(39% + 18px);top:50%;max-width:38%;transform:translateY(-50%)}.opponent-bubble:after{top:50%;left:-10px;border-left:0;border-right-color:var(--anthracite);transform:translateY(-50%)}.challenge.is-focus-opponent .hud{opacity:.35;filter:grayscale(1)}.task-group.is-highlight{position:relative;border-color:var(--anthracite);box-shadow:0 0 0 3px var(--yellow);animation:group-glow 1.4s ease-in-out infinite}@keyframes group-glow{0%,to{box-shadow:0 0 0 3px var(--yellow)}50%{box-shadow:0 0 0 8px #f9dc0066}}.hud-timer{height:8px;margin:4px -18px 0;background:#e7ebe9}.hud-timer span{display:block;height:100%;background:var(--yellow-strong);transform-origin:left}.challenge-board{width:100%;aspect-ratio:1200 / 900}.belt-tag{position:absolute;top:46.67%;z-index:1;display:grid;padding:5px 12px;border:1px solid var(--anthracite);border-radius:4px;background:var(--surface);box-shadow:0 4px 12px #0000001f;transform:translate(-50%,-50%);pointer-events:none;text-align:left;white-space:nowrap}.belt-tag strong{font-size:clamp(11px,1.3vw,var(--fs-title));font-weight:var(--fw-bold);line-height:1.2}.belt-tag small{font-size:clamp(9px,1vw,var(--fs-label-sm));font-weight:var(--fw-regular);color:var(--muted)}.belt-tag-machine{left:25%}.belt-tag-player{left:75%;background:var(--yellow);border-color:var(--yellow-strong)}[data-mode=challenge] .challenge-board>canvas{cursor:pointer}.challenge-board,.challenge-board>canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.coach{position:absolute;z-index:8;width:max-content;max-width:34%;padding:10px 14px;border-radius:var(--radius);background:var(--anthracite);color:#fff;font-size:var(--fs-title);font-weight:var(--fw-bold);line-height:1.3;transform:translate(calc(-100% - 64px),-50%);pointer-events:none;box-shadow:0 10px 24px #0000002e}.coach:after{content:"";position:absolute;top:50%;right:-8px;border:8px solid transparent;border-right:0;border-left-color:var(--anthracite);transform:translateY(-50%)}.coach b{display:block}.coach.is-success{background:#0a9f45}.coach.is-success:after{border-left-color:#0a9f45}.coach.is-warning{background:#e3120b}.coach.is-warning:after{border-left-color:#e3120b}.overlay{position:absolute;inset:0;z-index:2;display:grid;place-items:center;padding:14px;background:#f5f7f6e6;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow:auto}.overlay-card{width:min(100%,520px);padding:clamp(16px,3vw,28px);background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 20px 50px #0000001f;text-align:center}.task-card h2{margin:6px 0 14px;font-size:var(--fs-headline);font-weight:var(--fw-heavy);line-height:1.1;letter-spacing:var(--ls-headline)}.task-groups{display:grid;gap:8px}.task-group{padding:10px;border:1px solid var(--line);border-radius:var(--radius)}.task-group>span{font-size:var(--fs-label-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted)}.task-group.is-tap{border-color:var(--yellow-strong);background:var(--yellow-soft)}.task-group.is-tap>span{color:var(--ink)}.task-group .swatch-row{justify-content:center;margin-top:6px}.countdown{margin-top:10px;min-height:1.1em;font-size:var(--fs-score);font-weight:var(--fw-heavy);line-height:1.1;letter-spacing:var(--ls-display)}.task-start{width:100%;margin-top:16px}.result-card{text-align:left}.versus{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.versus-col{padding:14px;border:1px solid var(--line);border-radius:var(--radius)}.versus-col>span{font-size:var(--fs-label-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase}.versus-col>strong{display:block;margin:2px 0 8px;font-size:var(--fs-score);font-weight:var(--fw-heavy);line-height:1;letter-spacing:var(--ls-display)}.versus-col dl{display:grid;gap:2px;margin:0}.versus-col dl div{display:flex;justify-content:space-between;font-size:var(--fs-small)}.versus-col dt{font-weight:var(--fw-regular);color:var(--muted)}.versus-col dd{margin:0;font-weight:var(--fw-bold)}.versus-col.is-machine{background:var(--yellow);border-color:var(--yellow-strong)}.versus-col.is-machine dt{color:var(--ink-2)}.versus-note{margin:-2px 0 14px;font-size:var(--fs-body-sm);font-weight:var(--fw-regular);color:var(--ink-2)}.result-card .btn{width:100%}.results{width:min(100%,900px);margin:0 auto;padding:26px var(--gutter) 40px}.results h1{font-size:var(--fs-display);font-weight:var(--fw-heavy);line-height:1.05;letter-spacing:var(--ls-display)}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 12px}.hero-card{position:relative;min-height:170px;display:flex;flex-direction:column;justify-content:space-between;padding:20px 24px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.hero-card>span,.hero-card small{font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase}.hero-card strong{font-size:var(--fs-hero);font-weight:var(--fw-heavy);line-height:1;letter-spacing:var(--ls-display)}.hero-card.is-machine{background:var(--yellow);border-color:var(--yellow-strong)}.card{padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:10px}.card h2{margin-bottom:12px;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase}.score-form label{display:block;margin-bottom:6px;font-size:var(--fs-label-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted)}.score-form-row{display:flex;gap:8px}.score-form input{flex:1;min-width:0;min-height:44px;padding:0 12px;border:1px solid var(--line-strong);border-radius:4px;background:var(--surface);font-size:var(--fs-title)}.score-form input:disabled{background:#f3f5f4}.score-list{list-style:none;margin:0;padding:0}.leaderboard .score-list:first-of-type{margin-top:16px}.leaderboard{margin-top:12px}.benchmark-row,.score-row{position:relative;min-height:44px;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:0 10px;border-bottom:1px solid var(--line);font-size:var(--fs-title);font-weight:var(--fw-bold);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.benchmark-row{border-radius:4px 4px 0 0;background:var(--yellow);color:var(--ink)}.score-row b,.benchmark-row b{font-size:var(--fs-label);letter-spacing:var(--ls-label);color:var(--muted)}.benchmark-row b{color:var(--ink)}.score-row.is-new{background:var(--yellow-soft)}.score-row.is-new b{color:var(--ink)}.score-row.is-pressing{background:#f3e9a8;transition:background .6s}.score-confirm{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 6px 0 12px;background:var(--anthracite);color:#fff;font-size:var(--fs-body-sm);font-weight:var(--fw-regular)}.score-confirm div{display:flex;gap:6px}.score-confirm .btn{min-height:32px;padding:0 12px}.score-confirm .btn-outline{background:transparent;border-color:#fff6;color:#fff}.empty-scores{padding:12px 10px;font-size:var(--fs-body-sm);font-weight:var(--fw-regular);color:var(--muted)}.result-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.modal{width:min(92vw,440px);padding:26px;border:0;border-radius:10px;box-shadow:0 24px 70px #00000040}.modal::backdrop{background:#13181599}.modal-head{font-size:var(--fs-headline);font-weight:var(--fw-heavy);letter-spacing:var(--ls-headline)}.modal p{margin:8px 0 20px;font-size:var(--fs-body);font-weight:var(--fw-regular);color:var(--ink-2)}.modal-actions{display:flex;gap:10px}.modal-actions>*{flex:1}@media(max-width:1180px){.explore{grid-template-columns:220px minmax(0,var(--board-w)) 240px;gap:14px}.step{padding:14px 12px}}@media(max-width:860px){.round-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}.challenge{grid-template-columns:minmax(0,1fr);align-content:start;gap:10px;padding-top:12px}.challenge-board{aspect-ratio:800 / 900;width:min(100%,calc((100dvh - var(--header) - 150px) * .8889));justify-self:center}.hud{position:static;order:-1}.coach{max-width:60%;padding:8px 10px;font-size:var(--fs-body-sm);transform:translate(calc(-100% - 40px),-50%)}.explore{grid-template-columns:minmax(0,1fr);gap:14px;padding-top:14px}.stage{order:-1;position:sticky;top:var(--header);z-index:5;width:calc(100% + 2 * var(--gutter));margin:-14px calc(-1 * var(--gutter)) 0;padding:10px var(--gutter) 4px;background:var(--bg);box-shadow:0 8px 12px -10px #0000002e}.board{width:min(100%,40.8894dvh);margin:0 auto}.zone .drag-only{display:none}.zone .tap-only{display:inline}.choice:not(.is-selected) .choice-mark{display:none}.panel{display:contents}.step,.step:last-child{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.step-input{order:1}.step-system{order:2}.step-task{order:3}.step-mix{order:5}.choice-list{grid-template-columns:repeat(2,minmax(0,1fr))}.choice{touch-action:manipulation}.drag-only{display:none}}@media(max-width:560px){:root{--header: 58px}.site-header{gap:10px}.header-title{display:none}.brand img{width:100px}.mode-switch{padding:3px;gap:3px}.mode-switch button{min-height:36px;padding:0 11px;font-size:var(--fs-label-sm);letter-spacing:.04em}.hud{padding:12px 12px 0;gap:8px}.hud-task{font-size:20px}.hud .task-groups{display:none}[data-mode=tutorial] .hud .task-groups{display:grid;grid-template-columns:1fr 1fr;gap:6px}[data-mode=tutorial] .hud .task-group{padding:6px}.opponent-bubble{left:calc(44.5% + 16px);max-width:48%;padding:10px 12px}.tutorial-bubble p{font-size:var(--fs-body-sm)}.hud-timer{margin:2px -12px 0}.hero-card{min-height:130px;padding:16px}.overlay{position:fixed;inset:var(--header) 0 0;z-index:20}.placed small{display:none}.versus{gap:6px}.versus-col{padding:10px}.task-group{padding:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:root[data-display=ghost]{--ink: #f4f5f4;--ink-2: #cdd3d0;--muted: #95a09b;--line: #3a454c;--line-strong: #5f6a70;--anthracite: #4b5864;--surface: #1e262b;--bg: #000;--info-bg: #171e22;--yellow-soft: #2b2600;color:var(--ink);background:#000;color-scheme:dark}:root[data-display=ghost] :is(.btn-primary,.mode-switch button.is-active,.choice.is-selected,.task-option.is-selected,.route-tag.is-eject,.step-no.is-done,.versus-col.is-machine,.hero-card.is-machine,.benchmark-row,.belt-tag-player,.drag-ghost,.zone.is-over,.chip-button:hover){--ink: #1e1d1c;--ink-2: #3a4440;--muted: #56625d;--anthracite: #2b363f;--surface: #fff;color:var(--ink)}:root[data-display=ghost] .mode-switch{background:#12181b}:root[data-display=ghost] :is(.mode-switch button:hover:not(.is-active),.btn-quiet:hover,.placed-remove:hover){background:#2c363c}:root[data-display=ghost] .board{border-color:var(--line);background:#182025}:root[data-display=ghost] .zone:not(.is-filled){border-color:#9aa5a0;background:#000c}:root[data-display=ghost] .zone-feed:not(.is-filled),:root[data-display=ghost] .zone-feed.is-filled~.zone-sensor:not(.is-filled){animation-name:zone-pulse-ghost}@keyframes zone-pulse-ghost{0%,to{border-color:#9aa5a0}50%{border-color:#f9dc00;background:#2b2600cc}}:root[data-display=ghost] .route-tag:not(.is-eject){background:#2c363c}:root[data-display=ghost] .notice{border-color:#7a6c00}:root[data-display=ghost] .round-dots li{background:#36424a}:root[data-display=ghost] .round-dots li.is-done{background:#9aa5a0}:root[data-display=ghost] .hud-timer{background:#36424a}:root[data-display=ghost] .board-dim{background:#000c}:root[data-display=ghost] .overlay{background:#000000e6}:root[data-display=ghost] :is(.score-form input:disabled){background:#171e22}:root[data-display=ghost] .score-row.is-pressing{background:#4a4200}:root[data-display=ghost] .modal{background:var(--surface);color:var(--ink);border:1px solid var(--line-strong)}:root[data-display=ghost] :is(.site-header,.stage){box-shadow:none}:root[data-display=ghost] :is(.tutorial-bubble,.coach,.score-confirm){box-shadow:none}
