:root{font-family:system-ui,sans-serif;color:#18323a;background:#f6f5ef;font-size:18px}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit;color:inherit;cursor:pointer;min-height:54px;border:2px solid #cad7d0;border-radius:14px;background:#fff;padding:12px 16px;font-weight:700;touch-action:manipulation}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:4px solid #177cdb;outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px max(16px,4vw);border-bottom:1px solid #dae3dc}header b{font-size:22px}#fresh{border-color:#18323a}main{max-width:1200px;margin:auto;padding:18px}h1{font-size:34px;margin:8px 0 24px}h2{font-size:25px;margin:20px 0 8px}p{line-height:1.55}.layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.viewer,#controls{background:#fffefa;border:1px solid #dae3dc;border-radius:24px;padding:24px}.viewer{position:sticky;top:16px;text-align:center}#cube-host{height:450px;touch-action:none}#cube-host canvas{display:block;width:100%;height:100%}.sides{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.sides button{padding:10px 6px}.chosen{border:3px solid #087e68;background:#e3f6ec}.paint-area{width:min(100%,330px);margin:20px auto}.grid,.palette{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.tile{display:grid;place-items:center;width:100%;aspect-ratio:1;min-height:0;padding:0;background:var(--color);border:3px solid #283b42;border-radius:12px;font-size:32px;color:#172d36}.tile.center{opacity:1}.paint{display:flex;flex-direction:column;align-items:center;gap:5px;background:none;border:0;padding:0;min-width:0;font-size:15px}.paint.chosen{background:none}.paint.chosen .tile{outline:4px solid #087e68;outline-offset:2px}.paint .tile{flex:none}.checks{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:16px;padding:16px 0}.checks span{display:flex;align-items:center;gap:7px}.checks i{width:20px;height:20px;border:1px solid #667;border-radius:4px;flex-shrink:0}.navigation{display:flex;gap:12px;margin:18px 0}.navigation button{flex:1;font-size:22px;min-height:66px}.primary{background:#087e68;color:#fff;border-color:#087e68;font-size:24px;min-height:68px}#solve{width:100%}#errors{color:#a22920;line-height:1.6;margin:14px 0}.move{font-size:28px;font-weight:750}.note{font-size:16px;color:#52666b}#status{font-size:18px}#fallback{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}#fallback[hidden]{display:none}#fallback .tile{font-size:16px}#fallback .grid{gap:3px}@media(max-width:760px){header b{font-size:18px}header{padding:12px}#fresh{font-size:16px;padding:10px}main{padding:12px}h1{font-size:28px}.layout{grid-template-columns:1fr;gap:16px}.viewer{position:static;padding:14px}#controls{padding:18px}body:has(#solve) #controls{order:-1}#cube-host{height:min(95vw,420px)}.checks{font-size:15px}.navigation button{font-size:21px}}#errors:empty{display:none}#errors:not(:empty){background:#fff4ce;color:#18323a;border:2px solid #d68d00;border-radius:18px;padding:16px;text-align:center;margin:0 0 18px}.repair-heading{display:flex;align-items:center;justify-content:center;gap:10px;font-size:23px}.repair-heading>span{font-size:32px}.hold-demo{width:94px;margin:14px auto 2px;display:grid;justify-items:center;gap:4px}.hold-top{width:64px;height:19px;transform:skew(-20deg);border:3px solid #283b42;border-radius:4px}.hold-front{width:70px;height:64px;border:3px solid #283b42;border-radius:7px;display:grid;place-items:center;font-size:26px}.hold-arrow{font-size:30px;line-height:1}.repair-sides{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:10px 0 14px}.repair-sides button{padding:7px;min-height:54px;width:54px}.repair-sides i{display:block;background:var(--color);width:32px;height:32px;border:2px solid #283b42;border-radius:5px}.tile.needs-match{outline:4px dashed #a34d00;outline-offset:2px;box-shadow:inset 0 0 0 4px #fff}.tile.needs-match:after{content:"☝";position:absolute;right:3px;bottom:0;font-size:25px;filter:drop-shadow(0 0 2px white)}.tile.needs-match,#cube-host{position:relative}#holding-labels{position:absolute;inset:0;pointer-events:none;font-size:14px;font-weight:800;color:#18323a}#holding-labels[hidden]{display:none}#holding-labels span{position:absolute;line-height:1.4;background:#fffefaed;border:2px solid #cad7d0;border-radius:10px;padding:5px 9px;box-shadow:0 2px 6px #18323a12}.label-top{top:4px;left:50%;transform:translate(-50%);white-space:nowrap}.label-bottom{bottom:4px;left:50%;transform:translate(-50%);white-space:nowrap}.label-front{left:0;bottom:65px;border-color:#20c77a!important}.label-right{right:0;top:90px;border-color:#e92b46!important}#cube-host.holding-view canvas{pointer-events:none}@media(max-width:480px){#holding-labels{font-size:12px}.label-front{bottom:45px}.label-right{top:62px}}