:root{color:#171717;font-synthesis:none;background:#fff;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}main{max-width:780px;margin:0 auto;padding:36px 24px}h1{margin:0 0 32px;font-size:26px;font-weight:650}h2{margin:0 0 24px;font-size:20px;font-weight:600}button,input{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation;background:#fff;border:1px solid #ccc;border-radius:5px;padding:11px 18px;font-size:14px}button:hover{background:#f3f3f3}button:focus-visible,input:focus-visible{outline-offset:4px;outline:3px solid #597bb6}.primary{color:#fff;background:#202020;border-color:#202020}.primary:hover{background:#404040}fieldset{border:0;min-width:0;margin:0 0 28px;padding:0}legend{margin-bottom:14px;font-size:16px;font-weight:600}.modes{grid-template-columns:1.5fr 1fr;gap:14px;max-width:590px;display:grid}.mode{cursor:pointer;border:1px solid #d4d4d4;border-radius:6px;flex-direction:column;gap:18px;padding:17px;font-size:14px;display:flex}.mode.selected{border:2px solid #222;padding:16px}.mode:focus-within{outline-offset:4px;outline:3px solid #597bb6}.mode input{accent-color:#222;margin:0 5px 0 0}.examples{gap:14px;display:flex}.example{grid-template-columns:repeat(5,1fr);gap:2px;width:65px;height:65px;display:grid}.example>span{border:1px solid #d3d3d3;place-items:center;min-width:0;min-height:0;display:grid}.example .marked{color:#fff;background:#333;border-color:#333}.example svg{stroke-width:3px;width:9px;height:9px}.toolbar{justify-content:space-between;align-items:center;gap:14px;margin-bottom:23px;display:flex}.toolbar>span{color:#666;font-size:13px}.board-actions{justify-content:center;margin-top:24px;display:flex}button:disabled{cursor:default}.board-actions button:disabled{color:#999;background:#f7f7f7;border-color:#ddd}.board{isolation:isolate;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;display:grid}.tile,.blank{aspect-ratio:1;border-radius:6px;min-width:0;position:relative}.blank{background:#fafafa;border:1px solid #e5e5e5}.tile{perspective:850px;z-index:1;background:0 0;border:0;padding:0;overflow:visible;container-type:inline-size}.tile:hover{z-index:2}.tile:hover .face{background:#f5f5f5}.tile:disabled{cursor:wait}.tile.rolling{z-index:10}.lift{width:100%;height:100%;transform-style:preserve-3d}.cube{width:100%;height:100%;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.35,.05,.2,1);position:relative;translate:0 0 -50cqw}.face{backface-visibility:hidden;background:#fff;border:1px solid #bbb;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;inset:0;box-shadow:0 2px #ddd}.face-1{transform:translateZ(50cqw)}.face-2{transform:rotateY(90deg)translateZ(50cqw)}.face-3{transform:rotateX(90deg)translateZ(50cqw)}.face-4{transform:rotateX(-90deg)translateZ(50cqw)}.face-5{transform:rotateY(-90deg)translateZ(50cqw)}.face-6{transform:rotateY(180deg)translateZ(50cqw)}.number{z-index:2;color:#000;font-size:11px;font-weight:800;position:absolute;top:6px;right:8px}.icon{justify-content:center;align-items:center;width:92%;height:92%;display:flex;position:absolute;inset:4%}.icon svg{stroke-width:1.7px;width:100%;height:100%}.label{z-index:1;text-align:center;background:#ffffffd1;border-radius:999px;max-width:94%;padding:4px 8px;font-size:11px;font-weight:500;line-height:1.25;position:absolute;bottom:5%}.rolling .lift{animation:1.1s ease-in-out lift}@keyframes lift{0%,to{transform:translateZ(0)scale(1)}40%,60%{transform:translateZ(90px)scale(1.25)}}dialog{text-align:center;color:#171717;border:1px solid #ccc;border-radius:9px;width:min(420px,100% - 32px);padding:30px}dialog::backdrop{background:#0006}.confirmation-icon{width:60px;height:60px;margin:0 auto 22px}.confirmation-icon svg{stroke-width:1.5px;width:100%;height:100%}.actions{justify-content:center;gap:12px;margin-top:25px;display:flex}.actions button{min-width:95px}dialog input{border:1px solid #bbb;border-radius:4px;width:100%;padding:12px 8px;font-size:12px}@media (width<=580px){main{padding:24px 13px}h1{margin-bottom:27px;font-size:23px}.modes{grid-template-columns:1fr}.mode{padding:16px}.mode.selected{padding:15px}.toolbar{gap:8px}.toolbar button{padding:9px 11px;font-size:11px}.toolbar>span{font-size:10px}.board{gap:7px}.number{font-size:9px;top:4px;right:5px}.label{padding:3px 5px;font-size:clamp(6px,1.9vw,10px)}dialog{padding:25px 20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.prototype-page{max-width:1100px}.prototype-heading{justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:36px;display:flex}.prototype-heading h1{margin:0}.prototype-heading a,.prompt-download{color:#444;font-size:13px}.prototype-style{margin-bottom:38px}.prototype-style h2{margin-bottom:16px;font-size:18px}.prototype-icons{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;display:grid}.prototype-tile{aspect-ratio:1;background:#fff;border:1px solid #ddd;border-radius:6px;place-items:center;min-width:0;display:grid;position:relative}.prototype-tile img{width:92%;height:92%;display:block}.prototype-label{text-align:center;background:#ffffffd1;border-radius:999px;max-width:94%;padding:4px 8px;font-size:12px;line-height:1.25;position:absolute;bottom:5%}.prototype-style details{margin-top:13px;font-size:12px}.prototype-style summary{cursor:pointer;width:max-content}.prototype-prompt{white-space:pre-wrap;background:#f7f7f7;border:1px solid #e5e5e5;border-radius:5px;max-width:100%;margin:13px 0 0;padding:16px;line-height:1.8}.prompt-download{margin-bottom:20px;display:inline-block}@media (width<=600px){.prototype-heading{margin-bottom:27px}.prototype-heading h1{font-size:21px}.prototype-heading a{font-size:11px}.prototype-icons{gap:6px}.prototype-label{padding:3px 4px;font-size:clamp(7px,1.9vw,11px)}.prototype-style h2{font-size:16px}.prototype-style{margin-bottom:30px}}