:root{--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--fs-xs:.72rem;--fs-sm:.8rem;--fs-base:.925rem;--fs-md:1.05rem;--fs-lg:1.3rem;--fs-xl:1.7rem;--fs-2xl:2.25rem;--fw-normal:450;--fw-medium:560;--fw-bold:700;--lh-tight:1.15;--lh-normal:1.5;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:32px;--sp-8:40px;--r-xs:8px;--r-sm:11px;--r-md:15px;--r-lg:20px;--r-xl:26px;--r-pill:999px;--dur-scale:1;--dur-fast:calc(.11s * var(--dur-scale));--dur:calc(.18s * var(--dur-scale));--dur-slow:calc(.32s * var(--dur-scale));--ease:cubic-bezier(.22, .61, .36, 1);--ease-out:cubic-bezier(.16, 1, .3, 1);--topbar-h:60px;--sidebar-w:340px;--panel-border-width:1px;--focus-ring-width:3px;--bg:#f4f7fc;--bg-grad:radial-gradient(1200px 600px at 15% -10%, #e6efff 0%, #f4f7fc00 60%);--surface:#fff;--surface-2:#f2f5fa;--surface-3:#e9eef7;--text:#101828;--text-2:#5b6b86;--text-inverse:#fff;--border:#e2e8f2;--border-strong:#cbd5e5;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-soft:#e8efff;--accent-text:#1b4bd0;--accent-2:#0ea5e9;--success:#12805c;--success-soft:#e2f6ee;--warning:#b45309;--warning-soft:#fdf1dd;--error:#c02626;--error-soft:#fdeaea;--shadow-1:0 1px 2px #1018280d, 0 1px 3px #1018280f;--shadow-2:0 8px 24px -12px #10182838, 0 2px 6px #1018280f;--shadow-pop:0 24px 60px -24px #10182859;--overlay:#10182870;--stage-bg:radial-gradient(120% 90% at 50% 0%, #fff 0%, #eef3fb 55%, #e4ebf7 100%);--focus:#2563eb;--canvas-bg-top:#eef3fb;--canvas-bg-bottom:#dfe7f5;--glass-blur:0px;--rarity-common:#64748b;--rarity-uncommon:#0f9d70;--rarity-rare:#2563eb;--rarity-epic:#8b5cf6;--rarity-legendary:#d97706;--medal-bronze-a:#f0b27a;--medal-bronze-b:#9a5b21;--medal-silver-a:#f1f5f9;--medal-silver-b:#8592a6;--medal-gold-a:#ffe793;--medal-gold-b:#c88a12;--medal-locked:#c3cddd}[data-theme=dark],[data-theme=midnight],[data-theme=arcade],[data-theme=glass],[data-theme=frost]{--bg:#0b1020;--bg-grad:radial-gradient(1200px 600px at 20% -12%, #1a2444 0%, #0b102000 62%);--surface:#141b2e;--surface-2:#1a2338;--surface-3:#222d47;--text:#eef2ff;--text-2:#9dabc9;--text-inverse:#0b1020;--border:#26314f;--border-strong:#35426a;--accent:#5c8dff;--accent-hover:#7ba4ff;--accent-soft:#1d2a4d;--accent-text:#a9c4ff;--accent-2:#38bdf8;--success:#34d399;--success-soft:#123328;--warning:#fbbf24;--warning-soft:#3a2c12;--error:#f87171;--error-soft:#3a1c1c;--shadow-1:0 1px 2px #0006;--shadow-2:0 12px 32px -16px #000000b3, 0 2px 6px #00000059;--shadow-pop:0 30px 70px -30px #000c;--overlay:#040710a8;--stage-bg:radial-gradient(120% 90% at 50% 0%, #1d2745 0%, #121a2e 55%, #0d1424 100%);--focus:#7ba4ff;--canvas-bg-top:#1b2440;--canvas-bg-bottom:#0d1424;--rarity-common:#94a3b8;--rarity-uncommon:#34d399;--rarity-rare:#60a5fa;--rarity-epic:#a78bfa;--rarity-legendary:#fbbf24;--medal-locked:#38456a}[data-theme=blue]{--bg:#eef5ff;--bg-grad:radial-gradient(1200px 600px at 12% -12%, #cfe2ff 0%, #eef5ff00 60%);--surface:#fff;--surface-2:#e8f1ff;--surface-3:#d8e7ff;--text:#0a2540;--text-2:#436189;--border:#cfe0f7;--border-strong:#a9c6ec;--accent:#0b63f6;--accent-hover:#084fc7;--accent-soft:#dbeafe;--accent-text:#0b4fc0;--stage-bg:radial-gradient(120% 90% at 50% 0%, #fff 0%, #e6f0ff 55%, #d6e6ff 100%);--canvas-bg-top:#e6f0ff;--canvas-bg-bottom:#cfe1ff}[data-theme=midnight]{--bg:#070b18;--surface:#101529;--surface-2:#161d36;--surface-3:#1f2745;--accent:#8b5cf6;--accent-hover:#a78bfa;--accent-soft:#241a45;--accent-text:#c4b5fd;--accent-2:#22d3ee;--canvas-bg-top:#171d38;--canvas-bg-bottom:#080c18}[data-theme=paper]{--bg:#f7f3ea;--bg-grad:radial-gradient(1200px 600px at 15% -10%, #efe6d5 0%, #f7f3ea00 60%);--surface:#fffdf8;--surface-2:#f4eee1;--surface-3:#ebe2d0;--text:#2b2417;--text-2:#6b5f49;--text-inverse:#fffdf8;--border:#e6dcc8;--border-strong:#cfc0a4;--accent:#b45309;--accent-hover:#92400e;--accent-soft:#fbecd5;--accent-text:#8a4a0c;--accent-2:#0e7490;--success:#3f6212;--success-soft:#ecf4dc;--stage-bg:radial-gradient(120% 90% at 50% 0%, #fffdf8 0%, #f6efe1 55%, #efe5d3 100%);--canvas-bg-top:#f6efe1;--canvas-bg-bottom:#e8dcc6;--focus:#b45309;--rarity-rare:#b45309;--rarity-epic:#7c3aed}[data-theme=arcade]{--bg:#05060f;--surface:#0e1224;--surface-2:#141a31;--surface-3:#1d2545;--text:#f2f5ff;--text-2:#97a2c9;--border:#232c50;--border-strong:#37436f;--accent:#ff3d81;--accent-hover:#ff6a9d;--accent-soft:#33132a;--accent-text:#ffa1c0;--accent-2:#22d3ee;--success:#4ade80;--warning:#fde047;--error:#ff6b6b;--focus:#ff6a9d;--canvas-bg-top:#171d3d;--canvas-bg-bottom:#05060f;--stage-bg:radial-gradient(120% 90% at 50% 0%, #1b2350 0%, #0c1128 55%, #05060f 100%)}[data-theme=glass]{--bg:#0d1224;--surface:#1c26428c;--surface-2:#26325480;--surface-3:#34426a80;--border:#94b2ff38;--border-strong:#94b2ff5c;--glass-blur:14px;--accent:#7dd3fc;--accent-hover:#bae6fd;--accent-soft:#7dd3fc29;--accent-text:#bae6fd;--canvas-bg-top:#1d2947;--canvas-bg-bottom:#0a0e1c}[data-theme=frost]{--bg:#f2f8ff;--bg-grad:radial-gradient(1200px 600px at 10% -10%, #dff0ff 0%, #f2f8ff00 60%);--surface:#fff;--surface-2:#eef6ff;--surface-3:#e0eeff;--text:#10243b;--text-2:#4d6b8c;--border:#d6e8fa;--border-strong:#b6d4f0;--accent:#0ea5e9;--accent-hover:#0284c7;--accent-soft:#e0f2fe;--accent-text:#0369a1;--accent-2:#22d3ee;--stage-bg:radial-gradient(120% 90% at 50% 0%, #fff 0%, #eef8ff 55%, #dcf0ff 100%);--canvas-bg-top:#eef8ff;--canvas-bg-bottom:#d1e9fb;--rarity-rare:#0ea5e9;--rarity-legendary:#d97706;--text-inverse:#fff;--overlay:#10243b6b;--shadow-1:0 1px 2px #10243b0f;--shadow-2:0 8px 24px -14px #10243b40;--shadow-pop:0 24px 60px -24px #10243b4d}@media (prefers-reduced-motion:reduce){:root{--dur-fast:1ms;--dur:1ms;--dur-slow:1ms}}[data-reduced-motion=true]{--dur-fast:1ms;--dur:1ms;--dur-slow:1ms}[data-motion=off] *{transition-duration:1ms!important;animation-duration:1ms!important}*,:before,:after{box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-sans);font-size:var(--fs-base);font-weight:var(--fw-normal);line-height:var(--lh-normal);color:var(--text);background-color:var(--bg);background-image:var(--bg-grad);-webkit-font-smoothing:antialiased;overscroll-behavior:none;background-attachment:fixed;margin:0}h1,h2,h3,h4,p{margin:0}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--accent-text)}:focus-visible{outline:var(--focus-ring-width) solid var(--focus);outline-offset:2px;border-radius:var(--r-xs)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.boot{place-items:center;gap:var(--sp-4);min-height:100vh;padding:var(--sp-6);text-align:center;display:grid}.boot__mark{border-radius:var(--r-lg);background:var(--accent);color:#fff;width:64px;height:64px;font-weight:var(--fw-bold);font-size:var(--fs-lg);box-shadow:var(--shadow-2);animation:pulse 1.6s var(--ease) infinite;place-items:center;display:grid}.boot__text{color:var(--text-2)}@keyframes pulse{50%{opacity:.86;transform:scale(1.06)}}.spinner{border:2px solid var(--border-strong);border-top-color:var(--accent);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(1turn)}}.main{width:100%;max-width:1500px;padding:var(--sp-5) var(--sp-5) var(--sp-7);flex:1;margin:0 auto}.view{gap:var(--sp-5);animation:view-in var(--dur-slow) var(--ease-out);flex-direction:column;display:flex}@keyframes view-in{0%{opacity:0;transform:translateY(6px)}}[data-reduced-motion=true] .view{animation:none}.view__head{justify-content:space-between;align-items:flex-end;gap:var(--sp-3);flex-wrap:wrap;display:flex}.view__title{font-size:var(--fs-xl);font-weight:var(--fw-bold);letter-spacing:-.02em;line-height:var(--lh-tight)}.view__sub{color:var(--text-2);font-size:var(--fs-sm)}.brand{align-items:center;gap:var(--sp-2);cursor:pointer;color:inherit;background:0 0;border:0;padding:0;display:flex}.brand__mark{border-radius:var(--r-sm);background:var(--accent);color:#fff;width:34px;height:34px;font-weight:var(--fw-bold);font-size:var(--fs-sm);place-items:center;display:grid}.topbar__nav{align-items:center;gap:var(--sp-1);scrollbar-width:none;flex:1;min-width:0;display:flex;overflow-x:auto}.topbar__nav::-webkit-scrollbar{display:none}.navlink{align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-pill);color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease), color var(--dur) var(--ease);background:0 0;border:0;display:inline-flex}.navlink:hover{background:var(--surface-2);color:var(--text)}.navlink[aria-current=page]{background:var(--accent-soft);color:var(--accent-text)}.navlink__icon{flex:none;width:18px;height:18px}.topbar__stats{align-items:center;gap:var(--sp-2);display:flex}.stat-pill{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);font-size:var(--fs-sm);font-weight:var(--fw-medium);white-space:nowrap;display:inline-flex}.stat-pill__label{color:var(--text-2);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em}.stat-pill__icon{width:16px;height:16px}.stat-pill--coin{color:var(--warning)}.stat-pill--xp{color:var(--accent-text)}.panel{background:var(--surface);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-1);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));overflow:hidden}.panel__head{justify-content:space-between;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:var(--panel-border-width) solid var(--border);display:flex}.panel__title{font-size:var(--fs-sm);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.07em;color:var(--text-2)}.panel__body{padding:var(--sp-4)}.panel--flush .panel__body{padding:0}.panel--tint{background:var(--surface-2)}.stack{gap:var(--sp-3);flex-direction:column;display:flex}.stack--tight{gap:var(--sp-2)}.stack--loose{gap:var(--sp-5)}.row{align-items:center;gap:var(--sp-2);flex-wrap:wrap;display:flex}.row--between{justify-content:space-between}.row--nowrap{flex-wrap:nowrap}.spacer{flex:1}.grid-2{gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));display:grid}.muted{color:var(--text-2)}.small{font-size:var(--fs-sm)}.xsmall{font-size:var(--fs-xs)}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.center{text-align:center}.strong{font-weight:var(--fw-bold)}.btn{justify-content:center;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);border:var(--panel-border-width) solid transparent;border-radius:var(--r-pill);background:var(--surface-2);min-height:38px;color:var(--text);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;transition:transform var(--dur-fast) var(--ease), background var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), opacity var(--dur) var(--ease);touch-action:manipulation;text-decoration:none;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-3)}.btn:active:not(:disabled){transform:translateY(1px)scale(.99)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn svg{flex:none;width:17px;height:17px}.btn--primary{background:var(--accent);color:#fff;box-shadow:var(--shadow-1)}.btn--primary:hover:not(:disabled){background:var(--accent-hover)}.btn--soft{background:var(--accent-soft);color:var(--accent-text);border-color:#0000}.btn--soft:hover:not(:disabled){background:color-mix(in srgb, var(--accent-soft) 70%, var(--accent) 30%)}.btn--ghost{border-color:var(--border);background:0 0}.btn--ghost:hover:not(:disabled){background:var(--surface-2)}.btn--danger{background:var(--error-soft);color:var(--error)}.btn--danger:hover:not(:disabled){background:color-mix(in srgb, var(--error-soft) 80%, var(--error) 20%)}.btn--success{background:var(--success-soft);color:var(--success)}.btn--icon{padding:var(--sp-2);border-radius:var(--r-sm);min-width:38px;min-height:38px}.btn--sm{min-height:30px;padding:var(--sp-1) var(--sp-3);font-size:var(--fs-xs)}.btn--lg{min-height:46px;padding:var(--sp-3) var(--sp-6);font-size:var(--fs-base)}.btn--block{width:100%}.btn--active{background:var(--accent);color:#fff}.chip{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);border:var(--panel-border-width) solid var(--border);background:var(--surface);color:var(--text-2);font-size:var(--fs-xs);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--dur) var(--ease);display:inline-flex}.chip:hover{color:var(--text);border-color:var(--border-strong)}.chip[aria-pressed=true],.chip--active{background:var(--accent-soft);border-color:color-mix(in srgb, var(--accent) 35%, transparent);color:var(--accent-text)}.kbd{min-width:24px;height:24px;padding:0 var(--sp-2);border:var(--panel-border-width) solid var(--border-strong);border-radius:var(--r-xs);background:var(--surface-2);font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text);border-bottom-width:2px;justify-content:center;align-items:center;display:inline-flex}.badge-tag{padding:2px var(--sp-2);border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.03em;text-transform:uppercase;background:var(--surface-3);color:var(--text-2);align-items:center;gap:6px;display:inline-flex}.badge-tag--primary{background:var(--accent-soft);color:var(--accent-text)}.badge-tag--success{background:var(--success-soft);color:var(--success)}.badge-tag--warning{background:var(--warning-soft);color:var(--warning)}.badge-tag--error{background:var(--error-soft);color:var(--error)}.badge-tag--pb{background:linear-gradient(120deg, var(--medal-gold-a), var(--medal-gold-b));color:#3b2606}.playgrid{grid-template-columns:minmax(0, 1fr) var(--sidebar-w);gap:var(--sp-5);align-items:start;display:grid}.playgrid__side{gap:var(--sp-4);flex-direction:column;min-width:0;display:flex}.stage{border-radius:var(--r-xl);background:var(--stage-bg);border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-2);isolation:isolate;min-height:62vh;position:relative;overflow:hidden}.stage__canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}.stage__canvas:active{cursor:grabbing}.stage__overlay{z-index:2;gap:var(--sp-2);pointer-events:none;display:flex;position:absolute}.stage__overlay>*{pointer-events:auto}.stage__overlay--tl{top:var(--sp-4);left:var(--sp-4);flex-direction:column;align-items:flex-start}.stage__overlay--tr{top:var(--sp-4);right:var(--sp-4);flex-direction:column;align-items:flex-end}.stage__overlay--bl{bottom:var(--sp-4);left:var(--sp-4)}.stage__overlay--br{bottom:var(--sp-4);right:var(--sp-4);flex-direction:column;align-items:flex-end}.mode-pill{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(calc(var(--glass-blur) + 6px));backdrop-filter:blur(calc(var(--glass-blur) + 6px));border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-1);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.05em;text-transform:uppercase;color:var(--text-2);display:inline-flex}.timer{font-family:var(--font-mono);font-size:clamp(2rem,6vw,3.4rem);font-weight:var(--fw-bold);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text);text-shadow:0 2px 18px color-mix(in srgb, var(--accent) 22%, transparent);transition:color var(--dur) var(--ease)}.timer--running{color:var(--accent-text)}.timer--ready{color:var(--success)}.timer--small{font-size:clamp(1.4rem,3vw,2rem)}.scramble{gap:var(--sp-1) var(--sp-2);font-family:var(--font-mono);font-size:var(--fs-md);flex-wrap:wrap;line-height:1.7;display:flex}.scramble__move{border-radius:var(--r-xs);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);transition:background var(--dur) var(--ease), color var(--dur) var(--ease);padding:1px 6px}.scramble__move--played{background:var(--accent);color:#fff;border-color:#0000}.scramble__move--pending{background:var(--accent-soft);color:var(--accent-text)}.campad{gap:var(--sp-1);pointer-events:auto;grid-template-rows:repeat(2,38px);grid-template-columns:repeat(3,38px);display:grid}.campad__btn{border:var(--panel-border-width) solid var(--border);border-radius:var(--r-sm);background:color-mix(in srgb, var(--surface) 90%, transparent);width:38px;height:38px;-webkit-backdrop-filter:blur(calc(var(--glass-blur) + 4px));backdrop-filter:blur(calc(var(--glass-blur) + 4px));color:var(--text-2);cursor:pointer;transition:background var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur-fast) var(--ease);place-items:center;display:grid}.campad__btn:hover{background:var(--surface);color:var(--text)}.campad__btn:active,.campad__btn--held{background:var(--accent);color:#fff;transform:scale(.96)}.campad__btn svg{width:18px;height:18px}.campad__up{grid-area:1/2}.campad__left{grid-area:2/1}.campad__down{grid-area:2/2}.campad__right{grid-area:2/3}.movepad{gap:var(--sp-2);display:grid}.movepad__row{gap:var(--sp-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.movepad__btn{padding:var(--sp-2) var(--sp-1);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);min-height:46px;color:var(--text);font-weight:var(--fw-bold);cursor:pointer;transition:background var(--dur) var(--ease), transform var(--dur-fast) var(--ease);touch-action:manipulation;flex-direction:column;align-items:center;gap:2px;display:flex}.movepad__btn:hover{background:var(--surface-3)}.movepad__btn:active{background:var(--accent);color:#fff;transform:scale(.97)}.movepad__key{font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:var(--fw-normal);color:var(--text-2)}.stat-card{padding:var(--sp-3);border-radius:var(--r-md);background:var(--surface-2);border:var(--panel-border-width) solid var(--border)}.stat-card--accent{background:var(--accent-soft);border-color:#0000}.stat-card__value{font-family:var(--font-mono);font-size:var(--fs-lg);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;line-height:1.2}.stat-card__label{font-size:var(--fs-xs);color:var(--text-2);text-transform:uppercase;letter-spacing:.05em}.progress{border-radius:var(--r-pill);background:var(--surface-3);height:10px;overflow:hidden}.progress--lg{height:14px}.progress__fill{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%;transition:width var(--dur-slow) var(--ease)}.progress__fill--success{background:linear-gradient(90deg, var(--success), var(--accent-2))}.list{flex-direction:column;display:flex}.list-row{align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-4);border-bottom:var(--panel-border-width) solid var(--border);display:flex}.list-row:last-child{border-bottom:0}.list-row--interactive:hover{background:var(--surface-2)}.list-row__main{flex:1;min-width:0}.list-row__title{font-weight:var(--fw-medium)}.list-row__meta{font-size:var(--fs-xs);color:var(--text-2)}.list-row--pb{background:linear-gradient(90deg, color-mix(in srgb, var(--medal-gold-a) 32%, transparent), transparent)}.list-row--dnf .list-row__title{color:var(--text-2);text-decoration:line-through}.empty{padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--text-2)}.empty__title{font-weight:var(--fw-bold);color:var(--text);margin-bottom:var(--sp-1)}.banner{gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);font-size:var(--fs-sm);display:flex}.banner--warning{background:var(--warning-soft);color:var(--warning)}.banner--error{background:var(--error-soft);color:var(--error)}.banner--success{background:var(--success-soft);color:var(--success)}.banner svg{flex:none;width:18px;height:18px;margin-top:1px}.field__hint{font-size:var(--fs-xs);color:var(--text-2)}.input,.select{padding:var(--sp-2) var(--sp-3);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);min-height:38px;color:var(--text)}.input:focus,.select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);outline:none}.range{width:100%;accent-color:var(--accent)}.switch{justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-2) 0;display:flex}.switch__text{min-width:0}.switch__label{font-weight:var(--fw-medium)}.switch__hint{font-size:var(--fs-xs);color:var(--text-2)}.switch input[type=checkbox]{appearance:none;border-radius:var(--r-pill);background:var(--surface-3);border:var(--panel-border-width) solid var(--border-strong);cursor:pointer;width:44px;height:26px;transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);flex:none;position:relative}.switch input[type=checkbox]:after{content:"";background:var(--surface);width:20px;height:20px;box-shadow:var(--shadow-1);transition:transform var(--dur) var(--ease);border-radius:50%;position:absolute;top:2px;left:2px}.switch input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.switch input[type=checkbox]:checked:after{transform:translate(17px)}.settings-group+.settings-group{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:var(--panel-border-width) solid var(--border)}.settings-grid{gap:var(--sp-4) var(--sp-6);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));display:grid}.tabs{gap:var(--sp-1);padding:var(--sp-1);background:var(--surface-2);border-radius:var(--r-pill);border:var(--panel-border-width) solid var(--border);scrollbar-width:none;display:flex;overflow-x:auto}.tab[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-1)}.modal-backdrop{z-index:60;padding:var(--sp-4);background:var(--overlay);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:fade-in var(--dur) var(--ease);place-items:center;display:grid;position:fixed;inset:0;overflow-y:auto}@keyframes fade-in{0%{opacity:0}}.modal{background:var(--surface);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-xl);width:min(520px,100%);box-shadow:var(--shadow-pop);animation:pop-in var(--dur-slow) var(--ease-out);flex-direction:column;max-height:90vh;display:flex}.modal--wide{width:min(760px,100%)}@keyframes pop-in{0%{opacity:0;transform:translateY(12px)scale(.98)}}[data-reduced-motion=true] .modal,[data-reduced-motion=true] .modal-backdrop{animation:none}.modal__head{justify-content:space-between;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-5) var(--sp-5) var(--sp-3);display:flex}.modal__title{font-size:var(--fs-lg);font-weight:var(--fw-bold);line-height:var(--lh-tight)}.modal__sub{font-size:var(--fs-sm);color:var(--text-2)}.modal__body{padding:0 var(--sp-5) var(--sp-4);overflow-y:auto}.modal__foot{justify-content:flex-end;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5) var(--sp-5);flex-wrap:wrap;display:flex}.toast{gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-2);animation:toast-in var(--dur-slow) var(--ease-out);pointer-events:auto;display:flex}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)scale(.98)}}[data-reduced-motion=true] .toast{animation:none}.toast--success{border-left:4px solid var(--success)}.toast--error{border-left:4px solid var(--error)}.toast--warning{border-left:4px solid var(--warning)}.toast--info{border-left:4px solid var(--accent)}.toast__icon{flex:none;width:20px;height:20px;margin-top:1px}.toast__title{font-weight:var(--fw-bold);font-size:var(--fs-sm)}.toast__text{font-size:var(--fs-sm);color:var(--text-2)}.toast__close{color:var(--text-2);cursor:pointer;background:0 0;border:0;padding:0;line-height:1}.medal-ring{cursor:pointer;background:0 0;border:0;flex:none;place-items:center;padding:0;display:inline-grid;position:relative}.medal-ring__avatar{background:linear-gradient(140deg, var(--accent), var(--accent-2));color:#fff;font-weight:var(--fw-bold);border:2px solid var(--surface);box-shadow:var(--shadow-1);border-radius:50%;place-items:center;line-height:1;display:grid}.medal-ring__badge{border:1.5px solid var(--surface);background:var(--surface-2);box-shadow:var(--shadow-1);transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);border-radius:50%;place-items:center;display:grid;position:absolute}.medal-ring__badge svg{width:62%;height:62%}.medal-ring__badge:hover{z-index:3;transform:scale(1.12)}.medal-ring__badge--locked{background:var(--surface-3);color:var(--medal-locked);opacity:.85;border-style:dashed}.medal-ring__badge--bronze{background:radial-gradient(circle at 32% 26%, var(--medal-bronze-a), var(--medal-bronze-b));color:#3d2205}.medal-ring__badge--silver{background:radial-gradient(circle at 32% 26%, var(--medal-silver-a), var(--medal-silver-b));color:#2b3340}.medal-ring__badge--gold{background:radial-gradient(circle at 32% 26%, var(--medal-gold-a), var(--medal-gold-b));color:#4a3203;box-shadow:0 0 0 2px color-mix(in srgb, var(--medal-gold-b) 30%, transparent), var(--shadow-1)}.medal-ring__badge--new{animation:medal-pop .62s var(--ease-out)}@keyframes medal-pop{0%{opacity:0;transform:scale(.4)}60%{transform:scale(1.25)}to{transform:scale(1)}}[data-reduced-motion=true] .medal-ring__badge--new{animation:none}.medal-ring__tip{z-index:40;width:max-content;max-width:240px;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--text);color:var(--bg);font-size:var(--fs-xs);box-shadow:var(--shadow-2);pointer-events:none;text-align:left;line-height:1.45;position:absolute;top:calc(100% + 8px);left:50%;translate:-50%}.medal-ring__tip strong{display:block}.medal-ring__tip em{opacity:.75;font-style:normal}.medal-tier{padding:2px var(--sp-2);border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:capitalize;border:var(--panel-border-width) solid var(--border);background:var(--surface-2);color:var(--text-2);align-items:center;gap:6px;display:inline-flex}.medal-tier--bronze{background:color-mix(in srgb, var(--medal-bronze-b) 18%, var(--surface));color:var(--medal-bronze-b);border-color:color-mix(in srgb, var(--medal-bronze-b) 40%, transparent)}.medal-tier--silver{background:color-mix(in srgb, var(--medal-silver-b) 18%, var(--surface));color:color-mix(in srgb, var(--medal-silver-b) 80%, var(--text));border-color:color-mix(in srgb, var(--medal-silver-b) 45%, transparent)}.medal-tier--gold{background:color-mix(in srgb, var(--medal-gold-b) 20%, var(--surface));color:color-mix(in srgb, var(--medal-gold-b) 85%, var(--text));border-color:color-mix(in srgb, var(--medal-gold-b) 45%, transparent)}.achievement{gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-md);border:var(--panel-border-width) solid var(--border);background:var(--surface);transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);align-items:center;display:flex}.achievement--locked{opacity:.72}.achievement__icon svg{width:22px;height:22px}.achievement__name{font-weight:var(--fw-medium)}.shop-card__preview{border-radius:var(--r-md);background:var(--surface-2);place-items:center;min-height:116px;display:grid;position:relative;overflow:hidden}.shop-card__desc{font-size:var(--fs-xs);color:var(--text-2);min-height:2.6em}.shop-card__price{font-family:var(--font-mono);font-weight:var(--fw-bold);align-items:center;gap:6px;display:inline-flex}.shop-card__price--unaffordable{color:var(--error)}.shop-card__foot{justify-content:space-between;align-items:center;gap:var(--sp-2);margin-top:auto;display:flex}.rarity--common{color:var(--rarity-common)}.rarity--uncommon{color:var(--rarity-uncommon)}.rarity--rare{color:var(--rarity-rare)}.rarity--epic{color:var(--rarity-epic)}.rarity--legendary{color:var(--rarity-legendary)}.rarity-dot{background:currentColor;border-radius:50%;width:8px;height:8px;display:inline-block}.shop-card__ribbon{top:var(--sp-2);right:var(--sp-2);position:absolute}.swatch-row{gap:var(--sp-1);display:flex}.swatch{border:1px solid #00000026;border-radius:6px;width:22px;height:22px}.swatch--lg{border-radius:8px;width:30px;height:30px}.preview-cube{background:var(--surface-3);border-radius:8px;grid-template-rows:repeat(3,22px);grid-template-columns:repeat(3,22px);gap:2px;padding:5px;display:grid}.preview-cube__cell{background:var(--surface);border-radius:4px}.theme-preview{gap:var(--sp-2);width:100%;padding:var(--sp-3);border-radius:var(--r-sm);border:1px solid var(--border);grid-template-columns:26px 1fr;display:grid}.theme-preview__side{border-radius:6px}.theme-preview__bars{flex-direction:column;justify-content:center;gap:6px;display:flex}.theme-preview__bar{border-radius:4px;height:8px}.algo-row{align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:var(--panel-border-width) solid var(--border);cursor:pointer;text-align:left;width:100%;color:inherit;background:0 0;border-left:3px solid #0000;display:flex}.algo-row:hover{background:var(--surface-2)}.algo-row--active{border-left-color:var(--accent);background:var(--accent-soft)}.algo-row__notation{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-2);overflow-wrap:anywhere}.algo-row--active .algo-row__notation{color:var(--accent-text)}.algo-row__step{border-radius:var(--r-xs);padding:1px 5px}.algo-row__step--current{background:var(--accent);color:#fff}.pattern-grid{gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(250px,1fr));display:grid}.pattern-card{gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r-lg);border:var(--panel-border-width) solid var(--border);background:var(--surface);box-shadow:var(--shadow-1);flex-direction:column;display:flex}.pattern-card--done{border-color:color-mix(in srgb, var(--success) 40%, transparent)}.stars{color:var(--medal-gold-b);gap:2px;display:inline-flex}.stars__star--off{color:var(--border-strong)}.stars svg{width:14px;height:14px}.help-table{border-collapse:collapse;width:100%;font-size:var(--fs-sm)}.help-table th,.help-table td{text-align:left;padding:var(--sp-2) var(--sp-3);border-bottom:var(--panel-border-width) solid var(--border);vertical-align:top}.help-table th{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-2)}.challenge-card{gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r-lg);border:var(--panel-border-width) solid var(--border);background:var(--surface);box-shadow:var(--shadow-1);flex-direction:column;display:flex}.challenge-card__icon{border-radius:var(--r-md);background:var(--accent-soft);width:44px;height:44px;color:var(--accent-text);place-items:center;display:grid}.challenge-card__icon svg{width:24px;height:24px}.tier-row{align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;display:flex}.tier-row__label{min-width:62px}.tier-row__req{font-size:var(--fs-xs);color:var(--text-2)}.webgl-fallback{padding:var(--sp-6);text-align:center;background:var(--surface-2);place-items:center;display:grid;position:absolute;inset:0}.webgl-fallback__inner{gap:var(--sp-3);justify-items:center;max-width:420px;display:grid}@media (max-width:1080px){.playgrid{grid-template-columns:minmax(0,1fr)}.playgrid__side{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;display:grid}}@media (max-width:720px){:root{--topbar-h:56px}.main{padding:var(--sp-4) var(--sp-3) var(--sp-6)}.brand__name{display:none}.topbar__nav{gap:0}.navlink__label{display:none}.navlink{padding:var(--sp-2)}.stage{border-radius:var(--r-lg);min-height:46vh}.stage__overlay--tl{top:var(--sp-3);left:var(--sp-3)}.stage__overlay--tr{top:var(--sp-3);right:var(--sp-3)}.toasts{left:var(--sp-3);right:var(--sp-3);width:auto;bottom:var(--sp-3)}.view__title{font-size:var(--fs-lg)}.panel__body{padding:var(--sp-3)}.list-row{padding:var(--sp-2) var(--sp-3)}}@media (max-width:420px){.shop-grid,.pattern-grid{grid-template-columns:minmax(0,1fr)}}@media print{.topbar,.toasts{display:none}}[hidden]{display:none!important}.app{flex-direction:column;min-height:100svh;display:flex}.app__main{width:100%;max-width:1560px;padding:var(--sp-4);flex-direction:column;flex:1;min-width:0;margin:0 auto;display:flex}.app__stage-host{flex-direction:column;flex:1;min-height:0;display:flex}.view-host{gap:var(--sp-5);flex-direction:column;display:flex}body.has-dialog{overflow:hidden}.skip-link{left:var(--sp-3);z-index:200;padding:var(--sp-2) var(--sp-4);background:var(--surface);border-radius:var(--r-pill);box-shadow:var(--shadow-2);transition:top var(--dur) var(--ease);position:absolute;top:-70px}.skip-link:focus{top:var(--sp-3)}.topbar{z-index:40;align-items:center;gap:var(--sp-3);min-height:var(--topbar-h);padding:var(--sp-2) var(--sp-3);background:color-mix(in srgb, var(--surface) 86%, transparent);-webkit-backdrop-filter:blur(calc(var(--glass-blur) + 10px));backdrop-filter:blur(calc(var(--glass-blur) + 10px));border-bottom:var(--panel-border-width) solid var(--border);display:flex;position:sticky;top:0}.brand{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-2);color:inherit;cursor:pointer;border-radius:var(--r-sm);background:0 0;border:0;flex:none;text-decoration:none;display:inline-flex}.brand__mark{border-radius:var(--r-sm);background:linear-gradient(140deg, var(--accent), var(--accent-2));color:#fff;width:34px;height:34px;font-weight:var(--fw-bold);font-size:var(--fs-sm);letter-spacing:.02em;flex:none;place-items:center;display:grid}.brand__text{flex-direction:column;line-height:1.15;display:flex}.brand__name{font-weight:var(--fw-bold);font-size:var(--fs-md);letter-spacing:-.01em;white-space:nowrap}.brand__tagline{font-size:var(--fs-xs);color:var(--text-2);white-space:nowrap}.nav{scrollbar-width:none;flex:1;align-items:center;gap:2px;min-width:0;display:flex;overflow-x:auto}.nav::-webkit-scrollbar{display:none}.nav__item{align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-pill);color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease), color var(--dur) var(--ease);background:0 0;border:0;display:inline-flex}.nav__item svg{flex:none;width:18px;height:18px}.nav__item:hover{background:var(--surface-2);color:var(--text)}.nav__item--active,.nav__item[aria-current=page]{background:var(--accent-soft);color:var(--accent-text)}.nav__label{display:inline}.nav__divider{width:1px;height:22px;margin:0 var(--sp-1);background:var(--border);flex:none}.topbar__right{align-items:center;gap:var(--sp-2);flex:none;display:flex}.topbar__status{align-items:center;gap:var(--sp-2);display:flex}.topbar__avatar{cursor:pointer;background:0 0;border:0;border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.status-chip{align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);border:var(--panel-border-width) solid var(--border);background:var(--surface-2);color:var(--text);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);display:inline-flex}.status-chip:hover{background:var(--surface-3)}.status-chip svg{width:16px;height:16px}.status-chip--coins{color:var(--medal-gold-b)}.status-chip--level{gap:var(--sp-2);color:var(--accent-text)}.status-chip__value{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.status-chip__label{font-weight:var(--fw-bold)}.status-chip__bar{border-radius:var(--r-pill);width:54px;height:6px;display:block;position:relative;overflow:hidden}.status-chip__track{background:var(--surface-3);position:absolute;inset:0}.status-chip__fill{background:linear-gradient(90deg, var(--accent), var(--accent-2));transition:width var(--dur-slow) var(--ease);position:absolute;inset:0 auto 0 0}.play-surface{grid-template-columns:minmax(0, 1fr) minmax(300px, var(--sidebar-w));gap:var(--sp-4);align-items:start;min-height:0;display:grid}.play-surface__stage{border-radius:var(--r-xl);background:var(--stage-bg);border:var(--panel-border-width) solid var(--border);min-width:0;min-height:min(74svh,760px);box-shadow:var(--shadow-2);isolation:isolate;flex-direction:column;display:flex;position:relative;overflow:hidden}.play-surface__side{gap:var(--sp-3);flex-direction:column;min-width:0;display:flex}.cube-stage{touch-action:none;cursor:grab;flex:1;min-height:0;position:relative}.cube-stage:active{cursor:grabbing}.cube-stage canvas{touch-action:none;width:100%;height:100%;display:block}.cube-stage[hidden]{display:none}.hud{gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:color-mix(in srgb, var(--surface) 72%, transparent);-webkit-backdrop-filter:blur(calc(var(--glass-blur) + 8px));backdrop-filter:blur(calc(var(--glass-blur) + 8px));border-bottom:var(--panel-border-width) solid var(--border);z-index:2;flex-direction:column;display:flex}.hud__heading{justify-content:space-between;align-items:flex-start;gap:var(--sp-3);display:flex}.hud__titles{min-width:0}.hud__title{font-size:var(--fs-md);font-weight:var(--fw-bold);letter-spacing:-.01em;line-height:var(--lh-tight)}.hud__subtitle{font-size:var(--fs-xs);color:var(--text-2)}.hud__status{padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-text);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;flex:none}.hud__meters{align-items:center;gap:var(--sp-4);flex-wrap:wrap;display:flex}.hud__chip{align-items:baseline;gap:var(--sp-2);display:inline-flex}.hud__chip[hidden]{display:none}.hud__chip-label{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--text-2)}.hud__timer-value{font-family:var(--font-mono);font-size:clamp(1.5rem,3.4vw,2.1rem);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--text);transition:color var(--dur) var(--ease)}.hud__chip--timer[data-status=running] .hud__timer-value{color:var(--accent-text)}.hud__chip--timer[data-status=ready] .hud__timer-value,.hud__chip--timer[data-status=inspection] .hud__timer-value{color:var(--success)}.hud__moves-value{font-family:var(--font-mono);font-size:var(--fs-lg);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}.hud__scramble{align-items:baseline;gap:var(--sp-2);min-width:0;display:flex}.hud__scramble[hidden]{display:none}.hud__scramble-text{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-2);overflow-wrap:anywhere}.hud__controls{gap:var(--sp-2);flex-wrap:wrap;display:flex}.camera-pad{gap:var(--sp-1);padding:var(--sp-2);border-radius:var(--r-md);background:var(--surface);border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-1);grid-template-rows:repeat(2,40px);grid-template-columns:repeat(3,40px);align-self:flex-end;display:grid}.camera-pad__btn{border:var(--panel-border-width) solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text-2);cursor:pointer;transition:background var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur-fast) var(--ease);touch-action:manipulation;place-items:center;display:grid}.camera-pad__btn:hover{background:var(--surface-3);color:var(--text)}.camera-pad__btn:active{background:var(--accent);color:#fff;transform:scale(.95)}.camera-pad__btn--up{grid-area:1/2}.camera-pad__btn--left{grid-area:2/1}.camera-pad__btn--down{grid-area:2/2}.camera-pad__btn--right{grid-area:2/3}.play-panel{gap:var(--sp-3);flex-direction:column;min-width:0;display:flex}.panel-stack{gap:var(--sp-3);flex-direction:column;display:flex}.panel-stack[hidden]{display:none}.panel-text{font-size:var(--fs-sm);color:var(--text-2);line-height:var(--lh-relaxed,1.62)}.panel-list{gap:var(--sp-1);font-size:var(--fs-sm);color:var(--text-2);flex-direction:column;margin:0;padding-left:1.15rem;display:flex}.panel-note{align-items:flex-start;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);font-size:var(--fs-xs);color:var(--text-2);line-height:1.5;display:flex}.panel-note svg{flex:none;margin-top:2px}.panel-success{align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--success-soft);color:var(--success);font-size:var(--fs-sm);font-weight:var(--fw-medium);display:flex}.row-actions{gap:var(--sp-2);flex-wrap:wrap;display:flex}.chip-row{gap:var(--sp-2);flex-wrap:wrap;align-items:center;display:flex}.stat-grid{gap:var(--sp-2);grid-template-columns:repeat(auto-fit,minmax(104px,1fr));display:grid}.scramble-box{padding:var(--sp-3);border-radius:var(--r-sm);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);font-family:var(--font-mono);font-size:var(--fs-sm);overflow-wrap:anywhere;color:var(--text);line-height:1.6;display:block}.solution-box:empty{display:none}.countdown{align-items:baseline;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--accent-soft);color:var(--accent-text);display:flex}.countdown__label{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em}.countdown__value{font-family:var(--font-mono);font-size:var(--fs-md);font-variant-numeric:tabular-nums}.card{background:var(--surface);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-1);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));overflow:hidden}.card__header{justify-content:space-between;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:var(--panel-border-width) solid var(--border);display:flex}.card__titles{min-width:0}.card__title{align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.06em;color:var(--text-2);display:flex}.card__title svg{flex:none}.card__subtitle{font-size:var(--fs-xs);color:var(--text-2);text-transform:none;letter-spacing:0;margin-top:2px}.card__actions{gap:var(--sp-1);flex:none;display:flex}.card__body{gap:var(--sp-3);padding:var(--sp-4);flex-direction:column;display:flex}.field{gap:var(--sp-1);flex-direction:column;display:flex}.field__label{font-size:var(--fs-sm);font-weight:var(--fw-medium)}.field__hint{font-size:var(--fs-xs);color:var(--text-2);line-height:1.45}.field__output{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-2)}.field--switch,.field--slider{align-items:flex-start;gap:var(--sp-3);padding:var(--sp-2) 0;flex-direction:row;display:flex}.field--slider{flex-wrap:wrap;align-items:center}.field__texts{flex-direction:column;gap:2px;min-width:0;display:flex}.field--switch>.switch{flex:none}.switch{flex:none;align-items:center;display:inline-flex}.switch__input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.switch__track{border-radius:var(--r-pill);background:var(--surface-3);border:var(--panel-border-width) solid var(--border-strong);width:44px;height:26px;transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);display:block;position:relative}.switch__track:after{content:"";background:var(--surface);width:20px;height:20px;box-shadow:var(--shadow-1);transition:transform var(--dur) var(--ease);border-radius:50%;position:absolute;top:2px;left:2px}.switch__input:checked+.switch__track{background:var(--accent);border-color:var(--accent)}.switch__input:checked+.switch__track:after{transform:translate(17px)}.switch__input:focus-visible+.switch__track{box-shadow:0 0 0 var(--focus-ring-width) color-mix(in srgb, var(--focus) 35%, transparent)}.slider{min-width:140px;accent-color:var(--accent);flex:1}.file-input{width:100%;padding:var(--sp-3);border:var(--panel-border-width) dashed var(--border-strong);border-radius:var(--r-sm);background:var(--surface-2)}.btn--tiny{min-height:26px;padding:2px var(--sp-2);font-size:var(--fs-xs);border-radius:var(--r-xs)}.btn__label{display:inline}.stat{padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);flex-direction:column;gap:2px;min-width:0;display:flex}.stat__label{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-2)}.stat__value{font-family:var(--font-mono);font-size:var(--fs-md);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;line-height:1.25}.stat__hint{font-size:var(--fs-xs);color:var(--text-2)}.stat--accent{background:var(--accent-soft);border-color:#0000}.stat--accent .stat__value{color:var(--accent-text)}.stat--success{background:var(--success-soft);border-color:#0000}.stat--success .stat__value{color:var(--success)}.stat--warning{background:var(--warning-soft);border-color:#0000}.stat--warning .stat__value{color:var(--warning)}.stat--gold{background:color-mix(in srgb, var(--medal-gold-b) 16%, var(--surface));border-color:color-mix(in srgb, var(--medal-gold-b) 35%, transparent)}.stat--gold .stat__value{color:color-mix(in srgb, var(--medal-gold-b) 85%, var(--text))}.stat--muted .stat__value{color:var(--text-2)}.progress{border-radius:var(--r-pill);background:var(--surface-3);width:100%;height:9px;position:relative;overflow:hidden}.progress__fill{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%;transition:width var(--dur-slow) var(--ease);display:block}.chip{padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);border:var(--panel-border-width) solid var(--border);background:var(--surface-2);color:var(--text-2);font-size:var(--fs-xs);font-weight:var(--fw-medium);white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.chip--button{cursor:pointer;transition:background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease)}.chip--button:hover{color:var(--text);border-color:var(--border-strong)}.chip--accent,.chip[aria-pressed=true].chip--button{background:var(--accent-soft);border-color:color-mix(in srgb, var(--accent) 32%, transparent);color:var(--accent-text)}.chip--success{background:var(--success-soft);color:var(--success);border-color:#0000}.chip--warning{background:var(--warning-soft);color:var(--warning);border-color:#0000}.chip--danger{background:var(--error-soft);color:var(--error);border-color:#0000}.chip--gold{background:color-mix(in srgb, var(--medal-gold-b) 18%, var(--surface));border-color:color-mix(in srgb, var(--medal-gold-b) 36%, transparent);color:color-mix(in srgb, var(--medal-gold-b) 88%, var(--text))}.chip--neutral{background:var(--surface-2)}.empty{align-items:center;gap:var(--sp-2);padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--text-2);flex-direction:column;display:flex}.empty svg{color:var(--text-2);opacity:.7}.empty strong{color:var(--text)}.empty p{font-size:var(--fs-sm)}.toasts{z-index:90;right:var(--sp-4);bottom:var(--sp-4);gap:var(--sp-2);pointer-events:none;flex-direction:column-reverse;width:min(360px,100vw - 32px);display:flex;position:fixed}.toast{gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-2);opacity:0;transition:opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);pointer-events:auto;border-left-width:4px;display:flex;transform:translateY(10px)scale(.98)}.toast--in{opacity:1;transform:none}.toast--out{opacity:0;transform:translateY(6px)scale(.98)}.toast--success{border-left-color:var(--success)}.toast--error{border-left-color:var(--error)}.toast--warning{border-left-color:var(--warning)}.toast--info{border-left-color:var(--accent)}.toast__icon{color:var(--text-2);flex:none;margin-top:1px}.toast--success .toast__icon{color:var(--success)}.toast--error .toast__icon{color:var(--error)}.toast--warning .toast__icon{color:var(--warning)}.toast__body{flex:1;min-width:0}.toast__title{font-size:var(--fs-sm);font-weight:var(--fw-bold);display:block}.toast__msg{font-size:var(--fs-xs);color:var(--text-2);margin-top:2px;line-height:1.45}.toast__close{color:var(--text-2);cursor:pointer;border-radius:var(--r-xs);background:0 0;border:0;flex:none;align-self:flex-start;padding:2px}.toast__close:hover{color:var(--text)}.dialog-overlay{z-index:100;padding:var(--sp-4);background:var(--overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity var(--dur) var(--ease);place-items:center;display:grid;position:fixed;inset:0;overflow-y:auto}.dialog-overlay--in{opacity:1}.dialog-overlay--closing{opacity:0}.dialog{background:var(--surface);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-xl);width:min(520px,100%);max-height:90svh;box-shadow:var(--shadow-pop);transition:transform var(--dur-slow) var(--ease-out);flex-direction:column;display:flex;transform:translateY(12px)scale(.98)}.dialog-overlay--in .dialog{transform:none}.dialog--sm{width:min(420px,100%)}.dialog--lg{width:min(760px,100%)}.dialog__header{justify-content:space-between;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-5) var(--sp-5) var(--sp-3);display:flex}.dialog__title{font-size:var(--fs-lg);font-weight:var(--fw-bold);line-height:var(--lh-tight)}.dialog__body{gap:var(--sp-3);padding:0 var(--sp-5) var(--sp-3);flex-direction:column;display:flex;overflow-y:auto}.dialog__text{font-size:var(--fs-sm);color:var(--text-2);line-height:1.6}.dialog__actions{justify-content:flex-end;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5) var(--sp-5);flex-wrap:wrap;display:flex}[data-reduced-motion=true] .dialog,[data-reduced-motion=true] .dialog-overlay,[data-reduced-motion=true] .toast{transition:none}.medal-ring{flex:none;display:block;position:relative}.medal-ring__avatar{background:linear-gradient(140deg, var(--accent), var(--accent-2));color:#fff;font-weight:var(--fw-bold);border:2px solid var(--surface);box-shadow:var(--shadow-1);border-radius:50%;place-items:center;line-height:1;display:grid;position:absolute;top:50%;left:50%;translate:-50% -50%}.medal-ring__initials{letter-spacing:.02em}.medal-ring__slots{position:absolute;inset:0}.medal-ring__slot{cursor:pointer;transition:transform var(--dur) var(--ease), filter var(--dur) var(--ease);background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;translate:-50% -50%}.medal-ring__slot:hover{z-index:3;transform:scale(1.12)}.medal-ring__glyph{filter:drop-shadow(0 1px 1px #10182840);width:100%;height:100%;display:block;overflow:visible}.medal-ring__disc{stroke:var(--surface);stroke-width:1.6px}.medal-ring__mark{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round}.medal-ring__slot--locked{color:var(--medal-locked)}.medal-ring__slot--locked .medal-ring__disc{fill:var(--surface-3)}.medal-ring__slot--locked .medal-ring__glyph{opacity:.75;filter:none}.medal-ring__slot--bronze{color:#3d2205}.medal-ring__slot--bronze .medal-ring__disc{fill:var(--medal-bronze-b)}.medal-ring__slot--silver{color:#2b3340}.medal-ring__slot--silver .medal-ring__disc{fill:var(--medal-silver-b)}.medal-ring__slot--gold{color:#4a3203}.medal-ring__slot--gold .medal-ring__disc{fill:var(--medal-gold-b)}.medal-ring__slot--just-unlocked{animation:medal-slot-pop .82s var(--ease-out)}@keyframes medal-slot-pop{0%{filter:brightness(1.6);transform:scale(.5)}55%{filter:brightness(1.25);transform:scale(1.28)}to{filter:none;transform:scale(1)}}[data-reduced-motion=true] .medal-ring__slot--just-unlocked{animation:none}.medal-ring--card .medal-ring__avatar{border-width:3px}.medal-row{gap:var(--sp-2);display:flex}.medal-badge{border:var(--panel-border-width) solid var(--border);background:var(--surface-2);width:30px;height:30px;color:var(--text-2);border-radius:50%;place-items:center;display:grid}.medal-badge--locked{color:var(--medal-locked);opacity:.8;border-style:dashed}.medal-badge--bronze{background:radial-gradient(circle at 32% 26%, var(--medal-bronze-a), var(--medal-bronze-b));color:#3d2205;border-color:#0000}.medal-badge--silver{background:radial-gradient(circle at 32% 26%, var(--medal-silver-a), var(--medal-silver-b));color:#2b3340;border-color:#0000}.medal-badge--gold{background:radial-gradient(circle at 32% 26%, var(--medal-gold-a), var(--medal-gold-b));color:#4a3203;border-color:#0000}.medal-dot{background:var(--surface-3);border:var(--panel-border-width) solid var(--border);border-radius:50%;flex:none;width:12px;height:12px}.medal-dot--bronze{background:var(--medal-bronze-b)}.medal-dot--silver{background:var(--medal-silver-b)}.medal-dot--gold{background:var(--medal-gold-b)}.tier-row{align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;border-bottom:var(--panel-border-width) solid var(--border);display:flex}.tier-row:last-child{border-bottom:0}.tier-row__texts{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.tier-row__texts strong{font-size:var(--fs-sm);font-weight:var(--fw-medium)}.tier-row__reward{font-size:var(--fs-xs);color:var(--text-2)}.keymap{gap:var(--sp-2) var(--sp-4);grid-template-columns:minmax(0,auto) minmax(0,1fr);margin:0;display:grid}.keymap__keys{margin:0}.keymap__keys kbd{padding:2px var(--sp-2);border:var(--panel-border-width) solid var(--border-strong);border-radius:var(--r-xs);background:var(--surface-2);font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text);white-space:nowrap;border-bottom-width:2px;display:inline-block}.keymap__meaning{font-size:var(--fs-sm);color:var(--text-2);margin:0}.solve-list{flex-direction:column;display:flex}.solve-row{align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;border-bottom:var(--panel-border-width) solid var(--border);font-size:var(--fs-sm);display:flex}.solve-row:last-child{border-bottom:0}.solve-row__index{min-width:46px;color:var(--text-2);font-size:var(--fs-xs)}.solve-row__time{font-family:var(--font-mono);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;min-width:74px}.solve-row--dnf .solve-row__time{color:var(--error);text-decoration:line-through}.solve-row--plus2 .solve-row__time{color:var(--warning)}.solve-row__meta{color:var(--text-2);font-size:var(--fs-xs);flex:1}.solve-row__actions{gap:var(--sp-1);flex:none;display:flex}.pattern-list,.lesson-list,.algo-list{flex-direction:column;display:flex}.pattern-row,.lesson-row{justify-content:space-between;align-items:center;gap:var(--sp-3);width:100%;padding:var(--sp-3);border:0;border-bottom:var(--panel-border-width) solid var(--border);color:inherit;text-align:left;cursor:pointer;transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);background:0 0;border-left:3px solid #0000;display:flex}.pattern-row:last-child,.lesson-row:last-child{border-bottom:0}.pattern-row:hover,.lesson-row:hover{background:var(--surface-2)}.pattern-row--active,.lesson-row--active{background:var(--accent-soft);border-left-color:var(--accent)}.pattern-row__name,.lesson-row__title{font-weight:var(--fw-medium);min-width:0}.pattern-row__meta,.lesson-row__meta{gap:var(--sp-1);flex:none;display:flex}.lesson-steps{gap:var(--sp-1);font-size:var(--fs-sm);color:var(--text-2);flex-direction:column;margin:0;padding-left:1.15rem;display:flex}.lesson-steps code{font-family:var(--font-mono);font-size:var(--fs-xs);border-radius:var(--r-xs);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);padding:1px 5px}.quest-list{gap:var(--sp-3);flex-direction:column;display:flex}.quest{align-items:center;gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-sm);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);grid-template-columns:minmax(0,1fr) minmax(90px,150px) auto auto;display:grid}.quest--done{background:var(--success-soft);border-color:#0000}.quest__texts{flex-direction:column;gap:2px;min-width:0;display:flex}.quest__desc{font-size:var(--fs-xs);color:var(--text-2)}.quest__count{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-2)}.achievement-grid{gap:var(--sp-3);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.achievement{gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-md);border:var(--panel-border-width) solid var(--border);background:var(--surface-2);align-items:center;display:flex}.achievement--unlocked{border-color:color-mix(in srgb, var(--success) 35%, transparent);background:color-mix(in srgb, var(--success-soft) 60%, var(--surface))}.achievement__icon{border-radius:var(--r-sm);background:var(--surface-3);width:40px;height:40px;color:var(--text-2);flex:none;place-items:center;display:grid}.achievement--unlocked .achievement__icon{background:var(--success);color:#fff}.achievement__texts{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.achievement__desc{font-size:var(--fs-xs);color:var(--text-2)}.achievement__progress{font-size:var(--fs-xs);color:var(--text-2);font-family:var(--font-mono)}.page{gap:var(--sp-4);flex-direction:column;display:flex}.page--wide{max-width:100%}.page__header{justify-content:space-between;align-items:flex-end;gap:var(--sp-3);flex-wrap:wrap;display:flex}.page__title{font-size:var(--fs-xl);font-weight:var(--fw-bold);letter-spacing:-.02em;line-height:var(--lh-tight)}.page__subtitle{font-size:var(--fs-sm);color:var(--text-2)}.page__note{font-size:var(--fs-xs);color:var(--text-2);max-width:52ch}.page__body{gap:var(--sp-4);flex-direction:column;display:flex}.page__actions{gap:var(--sp-2);flex-wrap:wrap;display:flex}.profile-row{gap:var(--sp-5);flex-wrap:wrap;align-items:center;display:flex}.profile-row__stats{gap:var(--sp-3);flex-direction:column;flex:1;min-width:260px;display:flex}.tabs{gap:var(--sp-1);padding:var(--sp-1);border-radius:var(--r-pill);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);scrollbar-width:none;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tab{padding:var(--sp-2) var(--sp-3);border-radius:var(--r-pill);color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease), color var(--dur) var(--ease);background:0 0;border:0}.tab:hover{color:var(--text)}.tab--active,.tab[aria-pressed=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-1)}.shop-grid{gap:var(--sp-3);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.shop-card{gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-lg);background:var(--surface);border:var(--panel-border-width) solid var(--border);box-shadow:var(--shadow-1);transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);flex-direction:column;display:flex}.shop-card:hover{box-shadow:var(--shadow-2);transform:translateY(-2px)}.shop-card--equipped{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent), var(--shadow-2)}.shop-card--owned{background:color-mix(in srgb, var(--success-soft) 30%, var(--surface))}.shop-card--rarity-legendary{border-color:color-mix(in srgb, var(--rarity-legendary) 45%, var(--border))}.shop-card--rarity-epic{border-color:color-mix(in srgb, var(--rarity-epic) 40%, var(--border))}.shop-card__preview{border-radius:var(--r-md);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);min-height:116px;padding:var(--sp-3);place-items:center;display:grid}.shop-card__preview--large{min-height:150px}.shop-card__body{gap:var(--sp-2);flex-direction:column;flex:1;display:flex}.shop-card__head{justify-content:space-between;align-items:flex-start;gap:var(--sp-2);display:flex}.shop-card__name{font-weight:var(--fw-bold)}.shop-card__desc{font-size:var(--fs-xs);color:var(--text-2);line-height:1.5}.shop-card__actions{align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin-top:auto;display:flex}.skin-preview{border-radius:var(--r-md);background:var(--surface-3);place-items:center;width:84px;height:84px;display:grid;position:relative;overflow:hidden}.skin-preview__body{border-radius:var(--r-sm);position:absolute;inset:8px}.skin-preview__sticker{width:38px;height:38px;box-shadow:var(--shadow-1);border-radius:8px;position:relative}.palette-preview{gap:var(--sp-2);flex-wrap:wrap;justify-content:center;display:flex}.palette-preview__dot{border:1px solid #0000002e;border-radius:8px;place-items:center;width:30px;height:30px;display:grid;position:relative}.palette-preview__letter{font-size:var(--fs-xs);font-weight:var(--fw-bold);color:#fff;mix-blend-mode:difference}.effect-preview{align-items:center;gap:var(--sp-1);color:var(--accent-text);flex-direction:column;display:flex}.effect-preview__label{font-weight:var(--fw-bold);font-size:var(--fs-sm)}.effect-preview__intensity{font-size:var(--fs-xs);color:var(--text-2)}.theme-preview{align-items:center;gap:var(--sp-2);flex-wrap:wrap;justify-content:center;display:flex}.theme-preview__dot{border:2px solid var(--surface);width:26px;height:26px;box-shadow:var(--shadow-1);border-radius:50%}.theme-preview__id{text-align:center;width:100%;font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--text-2)}.palette-editor{gap:var(--sp-3);flex-direction:column;display:flex}.palette-editor__grid{gap:var(--sp-2);grid-template-columns:repeat(auto-fit,minmax(74px,1fr));display:grid}.palette-editor__field{align-items:center;gap:var(--sp-1);padding:var(--sp-2);border-radius:var(--r-sm);background:var(--surface-2);border:var(--panel-border-width) solid var(--border);flex-direction:column;display:flex}.palette-editor__face{font-family:var(--font-mono);font-weight:var(--fw-bold);font-size:var(--fs-sm)}.palette-editor__input{cursor:pointer;background:0 0;border:0;width:100%;height:34px;padding:0}.palette-editor__input:disabled{cursor:not-allowed;opacity:.5}.fatal{gap:var(--sp-3);max-width:520px;padding:var(--sp-6);text-align:center;background:var(--surface);border:var(--panel-border-width) solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-2);justify-items:center;margin:12svh auto;display:grid}.fatal h1{font-size:var(--fs-xl);font-weight:var(--fw-bold)}.fatal p{font-size:var(--fs-sm);color:var(--text-2)}@media (max-width:1080px){.play-surface{grid-template-columns:minmax(0,1fr)}.play-surface__side{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;display:grid}.camera-pad{align-self:start}.play-surface__stage{min-height:min(58svh,560px)}}@media (max-width:820px){.brand__tagline,.nav__label{display:none}.nav__item{padding:var(--sp-2)}.quest{row-gap:var(--sp-2);grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"texts badge""bar bar""count count"}.quest__texts{grid-area:texts}.quest__count{grid-area:count}.quest .progress{grid-area:bar}}@media (max-width:560px){.app__main{padding:var(--sp-3) var(--sp-2) var(--sp-5)}.shop-grid,.achievement-grid{grid-template-columns:minmax(0,1fr)}.play-surface__stage{border-radius:var(--r-lg);min-height:min(50svh,460px)}.hud{padding:var(--sp-2) var(--sp-3)}.hud__heading{gap:var(--sp-1);flex-direction:column}.keymap{gap:var(--sp-1);grid-template-columns:minmax(0,1fr)}.keymap__meaning{margin-bottom:var(--sp-2)}.toasts{left:var(--sp-2);right:var(--sp-2);width:auto;bottom:var(--sp-2)}.dialog{border-radius:var(--r-lg)}}