:root{--bg: #ffffff;--ink: #1f1e1c;--muted: #646059;--cube-green: #3cad6f;--cube-green-rgb: 60, 173, 111;--cube-red: #d94b4b;--accent: var(--cube-green);--accent-strong: var(--cube-green);--error: var(--cube-red);--card-bg: transparent;--xxs: .125rem;--xs: .25rem;--s: .5rem;--m: .75rem;--l: 1.25rem;--xl: 2rem;--xxl: 3rem;--section-control-space: 2rem;--control-w: 152px;--control-h: 40px;--swatch: 40px;--sticker: 25px;--full: 100%;--screen-h: 100vh;--layout-max: 1100px;--shift-up: -2px;--wizard-nav-space: 5rem;--net-gap: 4px;--outline-offset: 1px;--panel-min-h: 220px;--algo-min-h: 48px;--hint-min-h: 1.2rem;--cube-3d-size: clamp(180px, 28vw, 240px);--r-s: 6px;--r-m: 12px;--r-l: 16px;--r-round: 50%;--r-pill: 999px;--b1: 1px;--b2: 2px;--b3: 3px;--text-xs: .76rem;--text-s: .85rem;--text-m: .95rem;--text-l: 1.1rem;--text-xl: clamp(1.7rem, 3.8vw, 2.4rem);--lh-tight: 1.1;--lh-1: 1;--lh-relaxed: 1.6;--fast: .15s;--bp: 980px}*{box-sizing:border-box}button,.material-symbols-outlined{-webkit-user-select:none;user-select:none}body{margin:0;font-family:Inter,sans-serif;font-optical-sizing:auto;color:var(--ink);background-color:var(--bg);min-height:var(--screen-h)}.layout{width:min(var(--layout-max),calc(var(--full) - var(--xl)));margin:0 auto;padding:var(--s) 0 calc(var(--m) + var(--wizard-nav-space));container-type:inline-size;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(min-content,1fr);align-content:start;gap:var(--s);min-height:100vh;box-sizing:border-box}.hero{min-width:0;width:100%;padding:var(--m) 0 var(--s) 0}.hero-left{min-width:0;width:100%}.hero-title-row{min-width:0;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"title subtitle links";align-items:baseline;column-gap:var(--s);row-gap:var(--xs)}.hero-title-row h1{grid-area:title;min-width:max-content;white-space:nowrap}.hero-subtitle{grid-area:subtitle;min-width:0;color:var(--muted);font-size:var(--text-s)}.header-links{grid-area:links;font-size:var(--text-s);color:var(--muted);display:flex;gap:var(--s);align-items:center;justify-self:end;white-space:nowrap}.header-links a{color:inherit;text-decoration:none;transition:color var(--fast) ease;display:inline-flex;align-items:center;gap:var(--xs)}.header-links .external-link-icon{font-size:18px}.header-links a:hover{color:var(--ink);text-decoration:none}.header-links a:hover .github-link-label{text-decoration:underline}@container (max-width: 780px){.hero-title-row{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"title links" "subtitle subtitle"}.header-links{justify-self:end}}@container (max-width: 200px){.hero-title-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"title" "subtitle" "links"}}.wizard-container{min-height:0;min-width:0;width:100%;display:flex;flex-direction:column}.app-error{display:none;min-width:0;max-width:100%;margin:0 0 var(--m);padding:var(--s) var(--m);border:var(--b1) solid rgba(217,75,75,.28);border-radius:var(--r-m);background:#d94b4b14;color:var(--error);font-size:var(--text-s);line-height:var(--lh-relaxed);overflow-wrap:anywhere}.app-error.visible{display:block}.section-block{padding-top:var(--l);padding-bottom:var(--l);padding-left:0;padding-right:0;border-top:none}.wizard-step{display:none!important;min-width:0;width:100%}.wizard-step.active{display:flex!important;flex-direction:column;flex:1 1 auto;animation:fadeSlideUp .4s cubic-bezier(.16,1,.3,1) forwards}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.card{background:var(--card-bg);border-radius:var(--r-l);padding:var(--l);box-shadow:none;border:0}.section-block.controls{padding:0}.compact-section{min-width:0}.section-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:stretch;gap:clamp(var(--l),5vw,var(--xxl));margin:0;padding:0;flex:1 1 auto;min-width:0;width:100%}.section-cube-column,.section-controls-column{min-width:0}.section-cube-column{--section-cube-padding: clamp(1.5rem, 3vw, 2rem);container-type:inline-size;position:relative;display:flex;align-items:center;justify-content:center;border:var(--b1) solid #d6d3cc;border-radius:var(--r-m);padding:var(--section-cube-padding)}.section-controls-column{display:flex;flex-direction:column;justify-content:flex-start;gap:var(--s)}.section-controls-column>p{margin-bottom:calc(var(--section-control-space) - var(--s))}.section-controls-column>.section-subtitle{margin-bottom:calc(var(--section-control-space) - var(--s))}.section-controls-column>.app-error{margin-top:0;margin-bottom:calc(var(--section-control-space) - var(--s));text-align:left}.section-controls-column .paint-controls-row{flex-wrap:wrap;overflow:visible;row-gap:var(--section-control-space);padding:0;margin:0}.section-controls-column .paint-controls-row .palette-control{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:0;flex:1 1 100%;width:100%;margin-right:0;order:3;border-top:0;padding-top:0;margin-top:0}.section-controls-column .paint-controls-row .palette{display:contents;flex:1 1 auto;width:auto;min-width:0;margin-right:0}.palette-icon.material-symbols-outlined{display:inline-flex;align-items:center;justify-content:center;align-self:center;flex:0 0 auto;width:var(--control-h);max-width:100%;height:var(--control-h);justify-self:center;color:var(--muted);font-size:24px;line-height:var(--control-h)}.section-controls-column .paint-controls-row .palette-divider{display:block;flex:1 1 100%;grid-column:1 / -1;width:100%;height:var(--b1);min-height:var(--b1);margin:0;padding:0;border:0;background:#eae6db;order:2}.section-controls-column .paint-controls-row .palette .swatch{width:var(--swatch);height:var(--swatch);min-width:var(--swatch);min-height:var(--swatch);max-width:var(--swatch);max-height:var(--swatch);flex:0 0 var(--swatch);aspect-ratio:1;justify-self:center}.section-controls-column .paint-controls-row button:not(.swatch){flex:1 1 calc(50% - var(--s));width:auto;min-width:0;order:1}.section-cube-column .source-cube-wrap,.section-cube-column .target-preview-wrap,.section-cube-column .walkthrough-preview-wrap{width:100%;margin-top:0}.section-cube-column .cube-net{--net-gap: clamp(2px, .6cqw, 4px);width:100%;max-width:min(100%,calc(133.333vh - 2.667rem));max-height:calc(100vh - 2rem);aspect-ratio:4 / 3;grid-template-rows:repeat(9,minmax(0,1fr));grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--net-gap);justify-self:center;margin:0;padding:0;overflow:visible}.section-cube-column .cube-net .sticker{width:100%;height:100%;min-width:0;min-height:0}.controls{display:flex;flex-direction:column;gap:var(--s)}.controls>p{margin-bottom:var(--m)}.controls h2{margin-bottom:var(--s);font-weight:700}.section-block h2{display:inline-block;padding-right:var(--s);position:relative}.stepper{display:flex;align-items:center;justify-content:flex-start;gap:0;margin-bottom:var(--m);flex-wrap:wrap}.step-indicator{display:flex;align-items:center;gap:8px;font-size:var(--text-s);color:#a3a19b;font-weight:600;transition:color .4s ease}.step-indicator span{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#eae6db;color:#8f8c85;font-size:.75rem;transition:all .4s ease}.step-connector{flex:1 1 3rem;min-width:2rem;height:2px;margin-inline:var(--s);background:#eae6db;transition:background-color .4s ease}.step-connector.completed{background:var(--ink)}.step-indicator.active{color:var(--accent)}.step-indicator.active span{background:var(--accent);color:#fff;box-shadow:0 0 0 4px rgba(var(--cube-green-rgb),.15);animation:stepPulse 1.8s ease-in-out infinite}@keyframes stepPulse{0%,to{box-shadow:0 0 0 4px rgba(var(--cube-green-rgb),.15)}50%{box-shadow:0 0 0 8px rgba(var(--cube-green-rgb),.08)}}.step-indicator.completed{color:var(--ink)}.step-indicator.completed span{background:var(--ink);color:#fff}h1,h2,h3,h4,h5,h6{font-family:SUSE,sans-serif;font-optical-sizing:auto;margin:0}p{margin:0}.material-symbols-outlined{font-family:Material Symbols Outlined;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;font-feature-settings:"liga";font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}h1{margin-top:var(--xs);margin-bottom:var(--xs);font-size:var(--text-xl);line-height:var(--lh-tight)}h2{margin-bottom:var(--s);font-size:var(--text-l)}h3{margin-bottom:var(--s);font-size:var(--text-m)}label{display:block;font-size:var(--text-s);color:var(--muted);margin-bottom:var(--xs)}.row{display:flex;gap:var(--s);align-items:center}.row input,.row select,.select-control{flex:1 1 auto}.row button:not(.swatch){flex:0 0 auto;width:var(--control-w)}#step1 .section-controls-column>.row:has(#scrambleInput){flex-wrap:wrap}#step1 .section-controls-column>.row:has(#scrambleInput)>input{flex:1 1 var(--full);min-width:0;width:var(--full)}#step1 .section-controls-column>.row:has(#scrambleInput)>button:not(.swatch){flex:1 1 var(--full);min-width:0;width:var(--full)}.paint-controls-row{align-items:center;justify-content:flex-start;gap:var(--s);flex-wrap:nowrap;overflow-x:auto;padding:4px var(--r-s) var(--r-s) var(--r-s);margin-top:-4px;margin-inline:calc(-1 * var(--r-s))}.paint-controls-row .palette{margin-right:auto;flex:0 0 auto}.paint-controls-row button:not(.swatch){flex:0 0 auto}.buttons-row{margin-top:var(--s);justify-content:flex-start;flex-wrap:wrap}.walkthrough-buttons{gap:var(--s);justify-content:center}.row.walkthrough-buttons button.nav-btn{width:auto;flex:1 1 0;min-width:0}.nav-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:0 0 auto}.icon-btn{min-width:var(--control-h);padding-inline:var(--s)}input,select,textarea,button{font-family:inherit;height:var(--control-h);font-size:var(--text-m)}input,select,textarea{width:var(--full);border:var(--b1) solid #d6d3cc;border-radius:var(--r-m);background:#fdfbf7;color:var(--ink);padding:0 var(--m);transition:border-color .4s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--cube-green-rgb),.1)}select{appearance:none;-webkit-appearance:none;padding-right:40px}.select-control{position:relative;min-width:0}.select-control select{display:block;width:100%}.select-icon{position:absolute;top:50%;right:var(--m);color:var(--muted);font-size:22px;pointer-events:none;transform:translateY(-50%)}button,.btn-secondary{border:var(--b1) solid #e2ded5;background:#fff;color:var(--ink);border-radius:var(--r-m);padding:0 var(--m);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1),background-color var(--fast) ease,border-color var(--fast) ease;font-weight:600;box-shadow:0 1px 2px #00000008}.btn-with-icon{gap:6px}.button-icon{font-size:20px}button:hover:not(:disabled):not(.btn-primary):not(.sticker):not(.swatch),.btn-secondary:hover:not(:disabled){transform:none;background:#fdfbf7;border-color:#d6d3cc;box-shadow:0 4px 6px #0000000a}.swatch{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1),filter .4s ease}.cube-net.interactive-net .sticker{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1),border-color var(--fast) ease,filter .4s ease}.cube-net.interactive-net{touch-action:none}.swatch:hover{transform:translateY(var(--shift-up)) scale(1.05)}.cube-net.interactive-net .sticker:not(.center):hover{transform:translateY(var(--shift-up));border:var(--b2) solid var(--ink)}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 2px 4px rgba(var(--cube-green-rgb),.2)}.btn-primary:hover:not(:disabled){transform:none;background:var(--accent-strong);border-color:var(--accent-strong);box-shadow:0 4px 8px rgba(var(--cube-green-rgb),.25)}.btn-primary:disabled{background:var(--accent);border-color:var(--accent);color:#ffffffbf;opacity:.5;transform:none;box-shadow:none}.btn-secondary:disabled{background:#eae6db;border-color:#d6d3cc;color:var(--muted);cursor:default;opacity:.72;transform:none;box-shadow:none}.palette{display:flex;gap:var(--xs);flex-wrap:nowrap}.palette .swatch{-webkit-appearance:none;appearance:none;position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--swatch);height:var(--swatch);min-width:var(--swatch);min-height:var(--swatch);max-width:var(--swatch);max-height:var(--swatch);aspect-ratio:1 / 1;flex:0 0 var(--swatch);padding:0;border-radius:var(--r-round);border:var(--b2) solid #ffffff;box-shadow:inset 0 0 0 var(--b1) #00000047}.palette .swatch.active{box-shadow:inset 0 0 0 var(--b1) #00000047,inset 0 0 0 calc(var(--b1) + var(--b2)) var(--ink)}.hint{color:var(--muted);margin-top:var(--xs);font-size:var(--text-s);min-height:var(--hint-min-h)}.source-cube-wrap{margin-top:var(--s);padding-top:0;min-height:var(--panel-min-h);display:grid;grid-template-rows:auto 1fr;align-content:start}.target-preview-wrap{margin-top:var(--s);padding-top:var(--xxs);min-height:var(--panel-min-h);display:grid;grid-template-rows:auto 1fr;align-content:start}.walkthrough-preview-wrap{margin-top:var(--s);padding-top:0;display:grid;grid-template-rows:auto 1fr;align-content:start}.preview-toggle-row{position:absolute;top:var(--section-cube-padding);right:var(--section-cube-padding);z-index:1;display:flex;align-items:center;justify-content:flex-end}.preview-toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:82px;height:32px;gap:0;padding:0 .25rem;border:var(--b1) solid #e2ded5;background:#fff;color:var(--ink);border-radius:var(--r-pill);box-shadow:0 1px 2px #00000008}.preview-toggle-option{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:2.25rem;height:24px;padding:0 var(--xs);border:0;border-radius:var(--r-pill);background:transparent;color:var(--muted);font-size:var(--text-xs);font-weight:700;line-height:var(--lh-1);box-shadow:none;flex:0 0 auto;cursor:pointer;transition:background-color var(--fast) ease,color var(--fast) ease}.preview-toggle-option.active{background:var(--ink);color:#fff}button.preview-toggle-option:hover:not(:disabled):not(.btn-primary):not(.sticker):not(.swatch){transform:none;border-color:transparent;box-shadow:none}button.preview-toggle-option.active:hover:not(:disabled):not(.btn-primary):not(.sticker):not(.swatch){background:var(--ink);color:#fff}button.preview-toggle-option:not(.active):hover:not(:disabled):not(.btn-primary):not(.sticker):not(.swatch){background:#f2f0eb;color:var(--ink)}.preview-toggle-option:focus-visible{outline:var(--b2) solid var(--accent);outline-offset:var(--outline-offset)}.walkthrough-preview-surface{border-radius:var(--r-m);overflow:hidden;min-height:clamp(190px,24vw,240px);display:grid;place-items:center}.walkthrough-preview-surface.is-3d{width:100%;aspect-ratio:4 / 3;min-height:0;overflow:visible;padding:0;border:0;background:transparent}.walkthrough-preview-surface.is-2d{border:0;background:transparent;padding:0}.cube-scene{--cube-size: var(--cube-3d-size);--cube-face-gap: clamp(3px, calc(var(--cube-size) * .03), 6px);--cube-face-padding: clamp(5px, calc(var(--cube-size) * .05), 10px);--cube-face-radius: clamp(12px, calc(var(--cube-size) * .085), 20px);--cube-sticker-radius: clamp(5px, calc(var(--cube-size) * .034), 8px);width:var(--cube-size);height:var(--cube-size);perspective:900px;perspective-origin:center}.walkthrough-preview-surface .cube-scene{--cube-size: 45cqw}.cube-3d{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:var(--cube-view);transition:transform .42s cubic-bezier(.16,1,.3,1)}.cube-3d-face{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:var(--cube-face-gap);padding:var(--cube-face-padding);border-radius:var(--cube-face-radius);background:#1c1b19e6;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px #ffffff0a;backface-visibility:hidden}.cube-3d-face--f{transform:translateZ(calc(var(--cube-size) / 2))}.cube-3d-face--b{transform:rotateY(180deg) translateZ(calc(var(--cube-size) / 2))}.cube-3d-face--r{transform:rotateY(90deg) translateZ(calc(var(--cube-size) / 2))}.cube-3d-face--l{transform:rotateY(-90deg) translateZ(calc(var(--cube-size) / 2))}.cube-3d-face--u{transform:rotateX(90deg) translateZ(calc(var(--cube-size) / 2))}.cube-3d-face--d{transform:rotateX(-90deg) translateZ(calc(var(--cube-size) / 2))}.cube-3d-face.active{border:3px solid rgba(255,255,255,.95);outline:7px solid rgba(var(--cube-green-rgb),.8);outline-offset:0;box-shadow:0 0 18px 7px rgba(var(--cube-green-rgb),.42);filter:brightness(1.08) saturate(1.12);animation:facePulse 1.5s ease-in-out infinite}.cube-3d-sticker{display:flex;align-items:center;justify-content:center;border-radius:var(--cube-sticker-radius);border:1px solid rgba(0,0,0,.25);box-shadow:inset 0 1px #ffffff47}.cube-3d-sticker.center{font-size:clamp(1.35rem,3vw,1.8rem);font-weight:700;color:#000000ad}@keyframes facePulse{0%,to{outline-color:rgba(var(--cube-green-rgb),.8);box-shadow:0 0 18px 7px rgba(var(--cube-green-rgb),.42)}50%{outline-color:rgba(var(--cube-green-rgb),.95);box-shadow:0 0 26px 10px rgba(var(--cube-green-rgb),.58)}}.cube-net{display:grid;grid-template-rows:repeat(9,var(--sticker));grid-template-columns:repeat(12,var(--sticker));gap:var(--net-gap);justify-content:center;justify-self:center;padding-top:var(--net-gap);overflow-x:auto;padding-bottom:var(--xs)}.sticker{width:var(--sticker);height:var(--sticker);border:var(--b1) solid rgba(0,0,0,.33);border-radius:var(--r-s);padding:0}.cube-net.interactive-net .sticker:not(.center){cursor:url(/apps/erno/paint-cursor.svg) 13 16,crosshair}.cube-net.static-net .sticker,.cube-net.interactive-net .sticker.center,.cube-net .sticker:disabled{cursor:default}.cube-net.interactive-net.is-painting{cursor:url(/apps/erno/paint-cursor.svg) 13 16,crosshair}.sticker.center{display:inline-flex;align-items:center;justify-content:center;font-size:clamp(1rem,2vw,var(--text-l));font-weight:700;line-height:var(--lh-1);color:#000000ad}.sticker.highlight{filter:brightness(1.08) saturate(1.12)}.net-face-highlight{width:100%;height:100%;align-self:stretch;justify-self:stretch;z-index:2;pointer-events:none;border:3px solid rgba(255,255,255,.95);border-radius:var(--r-s);outline:7px solid rgba(var(--cube-green-rgb),.8);outline-offset:0;box-shadow:0 0 18px 7px rgba(var(--cube-green-rgb),.42);animation:facePulse 1.5s ease-in-out infinite}.output .row{margin-top:var(--s)}.algorithm-box{margin-top:var(--s);width:var(--full);min-height:var(--algo-min-h);border:var(--b1) solid #c8c0b4;border-radius:var(--r-m);background:#fff;color:var(--ink);padding:var(--m);font-family:Inter,sans-serif;line-height:var(--lh-relaxed);overflow-wrap:anywhere}.move-token{display:inline-block;padding:var(--xxs) var(--xs);border-radius:var(--r-s)}.move-token.current{background:rgba(var(--cube-green-rgb),.16);box-shadow:inset 0 0 0 var(--b1) rgba(var(--cube-green-rgb),.45);font-weight:600}.moves-count{color:var(--muted);white-space:nowrap}.help-content{display:flex;flex-direction:column;gap:var(--s);padding-top:var(--xs);color:var(--muted);font-size:var(--text-s);line-height:var(--lh-tight);opacity:.9}.help-content p{margin:0}.wizard-nav{position:fixed;bottom:0;left:0;width:100%;transform:none;z-index:10;margin:0;padding:0;background:var(--bg)}.layout.wizard-nav-flow{--wizard-nav-space: 0rem}.wizard-nav.flow{position:static;margin-top:var(--l)}.wizard-nav-content{display:flex;align-items:center;column-gap:var(--xl);row-gap:var(--m);justify-content:flex-start;width:min(var(--layout-max),calc(100% - var(--xl)));min-height:var(--control-h);margin:0 auto;padding:var(--m) 0 calc(var(--m) + env(safe-area-inset-bottom))}.wizard-nav .stepper{flex:1 1 auto;min-width:0;flex-wrap:nowrap;justify-content:flex-start;margin:0}.wizard-actions{display:flex;align-items:center;gap:var(--s);flex:0 0 auto;min-width:0}.wizard-next-btn{flex:0 0 auto}.help-details{margin-top:var(--s);font-size:var(--text-s)}.help-details summary{cursor:pointer;color:var(--muted);font-weight:600;margin-bottom:var(--xs);transition:color .4s ease;-webkit-user-select:none;user-select:none;padding:4px 0}.help-details summary::marker{margin-right:8px}.help-details summary:hover{color:var(--ink)}.wizard-nav button{width:auto;padding:0 var(--l);min-width:120px}@media(max-width:980px),(orientation:portrait){.section-layout{grid-template-columns:minmax(0,1fr);gap:var(--l)}.section-cube-column{order:1}.section-controls-column{order:0}}@media(max-width:980px){body{padding-inline:1.25rem}.layout{width:min(var(--layout-max),var(--full));gap:var(--m)}.wizard-nav-content{width:min(var(--layout-max),calc(100% - 2.5rem))}#toggleStep3View .preview-toggle-option{width:auto}.row{flex-wrap:wrap}.row>*{flex:1 1 var(--full)}button:not(.swatch):not(.sticker):not(.step-indicator){width:var(--full)}.wizard-nav button:not(.swatch):not(.sticker):not(.step-indicator){width:auto}.paint-controls-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;overflow-x:visible;margin-inline:0;padding-inline:0;row-gap:var(--xs);column-gap:var(--xs)}.paint-controls-row button:not(.swatch){width:var(--full);min-width:0}.paint-controls-row .palette{grid-column:1 / -1;justify-content:flex-start;margin-right:0}.paint-controls-row .palette-control{grid-column:1 / -1}.source-cube-wrap,.target-preview-wrap{min-height:0}.walkthrough-buttons .nav-btn{width:auto}}@media(max-width:980px),(orientation:portrait){#step1 .section-controls-column>.row:has(#scrambleInput){flex-wrap:nowrap}#step1 .section-controls-column>.row:has(#scrambleInput)>input{flex:1 1 auto;min-width:0;width:auto}#step1 .section-controls-column>.row:has(#scrambleInput)>button:not(.swatch){flex:0 0 var(--control-w);width:var(--control-w)}}@media(max-width:1180px){.paint-controls-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;overflow-x:visible;margin-inline:0;padding-inline:0;row-gap:var(--xs);column-gap:var(--xs)}.paint-controls-row>button:not(.swatch){order:1}.paint-controls-row>.palette{order:2}.paint-controls-row button:not(.swatch){width:var(--full);min-width:0}.paint-controls-row .palette-control{grid-column:1 / -1;margin-right:0}}@media(max-width:700px){:root{--xl: 1.25rem;--xxl: 1.5rem;--wizard-nav-space: 9rem;--control-h: 46px;--swatch: 40px;--sticker: 28px}.layout{width:min(var(--layout-max),var(--full));margin:var(--s) auto var(--xl)}body{margin:0;padding-inline:1rem;padding-top:0}.card{padding:var(--l);border-radius:var(--r-m)}.hero{padding:0 0 var(--s)}.section-block{padding-top:var(--l);padding-bottom:var(--l)}.controls>p{margin-bottom:var(--s)}.row{gap:var(--xs)}.cube-net{justify-content:flex-start}.stepper{gap:0;justify-content:space-between}.step-indicator{font-size:.8rem;gap:4px;flex-direction:column}.step-connector{flex:1 1 2rem;min-width:1.5rem;align-self:flex-start;margin-top:11px}.wizard-nav{padding:0}.wizard-nav-content{flex-wrap:wrap;width:calc(100% - 2rem)}.wizard-nav .stepper{flex:1 1 var(--full);justify-content:space-between;margin:0;order:-1}.wizard-actions{flex:1 1 var(--full);order:0}.wizard-actions button{flex:1;min-width:0;margin:0}.palette{flex-wrap:wrap;gap:6px}.row.walkthrough-buttons button.nav-btn{flex:1 1 calc(50% - var(--xs));min-width:120px}.row.walkthrough-buttons button.nav-btn:last-child{flex-basis:var(--full)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}@media(max-width:420px){:root{--swatch: 38px;--sticker: 24px;--text-xl: 1.5rem}body{padding-inline:.75rem}.wizard-nav{width:100%}.wizard-nav-content{width:calc(100% - 1.5rem)}#step1 .section-controls-column>.row:has(#scrambleInput){flex-wrap:wrap}#step1 .section-controls-column>.row:has(#scrambleInput)>input,#step1 .section-controls-column>.row:has(#scrambleInput)>button:not(.swatch){flex:1 1 var(--full);min-width:0;width:var(--full)}.paint-controls-row{margin-inline:0;padding-inline:0}.palette{gap:2px}.row.walkthrough-buttons button.nav-btn{flex-basis:var(--full)}.cube-scene{perspective:720px}}@media(max-width:300px){.section-controls-column .paint-controls-row .palette-control{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:var(--xs)}.wizard-actions{flex-direction:column;align-items:stretch}.wizard-actions button{flex:0 0 var(--control-h);width:100%}}