:root{--ground:#2457c5;--sheet:#fff;--ink:#1b1b1b;--ghost:#b9bec8;--keyline:#fff;--red:#e8432e;--yellow:#f7c331;--green:#3fae52;--orange:#f2802b;--sky:#4db6e8;--pink:#f28bb5;--purple:#7b5cc9;--brown:#8b5a2b;--paper-shadow:0 2px 6px #0000002e, 0 8px 18px #0000001f;--tap:64px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper-shadow:0 2px 6px #00000059, 0 8px 18px #0000004d}}:root[data-theme=dark]{--paper-shadow:0 2px 6px #00000059, 0 8px 18px #0000004d}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--ground);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;margin:0;font-family:ui-rounded,system-ui,sans-serif}::selection{background:var(--yellow);color:var(--ink)}:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0}.screen{min-height:100dvh;padding:calc(env(safe-area-inset-top) + 12px) calc(env(safe-area-inset-right) + 16px) calc(env(safe-area-inset-bottom) + 16px) calc(env(safe-area-inset-left) + 16px);flex-direction:column;gap:14px;display:flex}.piece{--paper:var(--yellow);background:var(--paper);box-shadow:inset 0 0 0 2px var(--keyline), var(--paper-shadow);min-width:var(--tap);min-height:var(--tap);color:var(--ink);border-radius:999px;justify-content:center;align-items:center;transition:transform .35s cubic-bezier(.34,1.56,.64,1);display:inline-flex}.piece:active{transform:scale(.93)}.piece:disabled{opacity:.4;cursor:default}.piece svg{width:34px;height:34px}.piece.big{min-width:84px;min-height:84px}.piece.big svg{width:44px;height:44px}.place{animation:.35s cubic-bezier(.34,1.56,.64,1) backwards place}@keyframes place{0%{transform:translateY(12px)scale(.88)}to{transform:none}}@media (prefers-reduced-motion:reduce){.place{animation:none}.piece,.tile,.swatch{transition:none}}.bar{justify-content:space-between;align-items:center;gap:12px;display:flex}.grid{grid-template-columns:repeat(3,1fr);align-content:start;gap:14px;display:grid}@media (width>=700px){.grid{grid-template-columns:repeat(4,1fr);gap:20px;width:100%;max-width:980px;margin:0 auto}}.tile{--paper:var(--yellow);aspect-ratio:1;background:var(--paper);box-shadow:inset 0 0 0 2px var(--keyline), var(--paper-shadow);border-radius:18px;padding:10%;transition:transform .35s cubic-bezier(.34,1.56,.64,1);position:relative}.tile:active{transform:scale(.95)rotate(-1.5deg)}.tile svg.pic{width:100%;height:100%;display:block}.tile .star{width:40px;height:40px;position:absolute;top:-8px;right:-8px}.star{filter:drop-shadow(0 2px 3px #00000040)}.sheet-wrap{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.sheet{background:var(--sheet);box-shadow:var(--paper-shadow);touch-action:none;border-radius:10px;position:relative;overflow:hidden}.sheet>svg,.sheet>canvas{width:100%;height:100%;position:absolute;inset:0}.model{aspect-ratio:1;background:var(--sheet);width:35%;box-shadow:inset 0 0 0 2px var(--sky), 0 2px 6px #0000002e;pointer-events:none;border-radius:8px;padding:4%;position:absolute;top:8px;right:8px}.model svg{width:100%;height:100%;display:block}.dots{flex:1;justify-content:center;gap:8px;display:flex}.dot{width:14px;height:14px;box-shadow:inset 0 0 0 2px var(--keyline);background:#ffffff59;border-radius:50%}.dot.on{background:var(--yellow)}.dot.done{background:var(--sheet)}.tools{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.swatch{width:var(--tap);height:var(--tap);background:var(--paper);box-shadow:inset 0 0 0 2px var(--keyline), var(--paper-shadow);border-radius:50%;transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.swatch.on{box-shadow:inset 0 0 0 4px var(--keyline), 0 0 0 3px var(--ink), var(--paper-shadow);transform:scale(1.18)}.center{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;display:flex}.final{aspect-ratio:1;width:min(80vw,60dvh,520px);position:relative}.final img{width:100%;height:100%;box-shadow:var(--paper-shadow);border-radius:10px;display:block}.bigstar{width:30%;position:absolute;top:-6%;right:-6%}.gallery .tile{--paper:var(--sheet);padding:0;overflow:hidden}.gallery .tile img{width:100%;height:100%;display:block}.empty{--paper:var(--sheet);place-items:center;display:grid}.empty svg{width:50%;height:50%;color:var(--ghost)}.trace{stroke-dasharray:100;stroke-dashoffset:100px;animation:1.4s cubic-bezier(.22,1,.36,1) .3s forwards trace,.5s ease-out 2.2s forwards trace-fade}@keyframes trace{to{stroke-dashoffset:0}}@keyframes trace-fade{to{opacity:0}}@media (prefers-reduced-motion:reduce){.trace{display:none}}.wall{flex-wrap:wrap;justify-content:center;gap:14px;padding:18px 0 6px;display:flex}.pin{width:84px;height:84px}.pin img{width:100%;height:100%;box-shadow:inset 0 0 0 2px var(--keyline), var(--paper-shadow);border-radius:6px;display:block}@media (width>=700px){.pin{width:120px;height:120px}}.guide{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.guide.nudge{animation:.6s ease-out nudge}@keyframes nudge{0%,to{opacity:1}30%{opacity:.25}60%{opacity:1}80%{opacity:.5}}.swatches{justify-content:center;align-items:center;gap:12px;width:100%;display:flex}.swatch.big{width:72px;height:72px}.swatch.small{width:48px;height:48px}.marker{pointer-events:none;transform-origin:50% 0;filter:drop-shadow(0 4px 6px #00000040);z-index:10;width:44px;height:154px;position:fixed}.pulse{animation:1.2s ease-in-out infinite pulse}@keyframes pulse{50%{transform:scale(1.08)}}@media (prefers-reduced-motion:reduce){.pulse,.guide.nudge{animation:none}}.doors{flex:1;grid-template-columns:1fr 1fr;align-content:center;gap:16px;width:100%;max-width:720px;margin:0 auto;display:grid}.door{aspect-ratio:3/4;background:var(--paper);box-shadow:inset 0 0 0 3px var(--keyline), var(--paper-shadow);border-radius:24px;place-items:center;transition:transform .35s cubic-bezier(.34,1.56,.64,1);display:grid}.door:active{transform:scale(.96)rotate(-1deg)}.door svg{width:80%;height:auto}.shelf-gap{background:#ffffff59;border-radius:2px;grid-column:1/-1;height:2px;margin:8px 0}.credit{color:#ffffffb3;text-align:center;-webkit-user-select:text;user-select:text;padding:12px 0 0;font-size:12px}.done-bar{top:calc(env(safe-area-inset-top) + 12px);right:calc(env(safe-area-inset-right) + 16px);position:absolute}