@font-face{font-family:Nunito;font-style:normal;font-weight:400;src:url(/font/Nunito-VariableFont_wght.ttf)format("truetype");font-display:block}@font-face{font-family:NunitoB;font-style:normal;font-weight:700;src:url(/font/Nunito-VariableFont_wght.ttf)format("truetype");font-display:block}@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:100 700;src:url(/font/symbols.woff2)format("woff2")}.symbols{letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;direction:ltr;font-family:Material Symbols Rounded;font-size:24px;font-style:normal;font-weight:400;line-height:1;display:inline-block}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#101316;--panel:#171c21;--panel-2:#20272e;--line:#303a43;--line-2:#52616c;--text:#edf3f5;--muted:#95a3ab;--accent:#7cc7ff;--target:#ffd166;--current:#7bd88f;--danger:#ff6b6b}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--text);background:#0f1317;font-family:Nunito,system-ui,sans-serif}button,select{color:inherit;cursor:pointer;font:inherit;background:0 0;border:0}button:disabled,select:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#app,.app{min-height:100vh}.app-shell{min-height:100vh;padding:max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));flex-direction:column;gap:18px;display:flex}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;display:flex}.title-block{flex-direction:column;gap:4px;min-width:0;display:flex}.title{letter-spacing:0;text-transform:uppercase;font-size:1rem;font-weight:800}.progress,.status-line{color:var(--muted);font-size:.92rem}.status-line{color:#d4dde1}.prototype-controls{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.text-button{border:1px solid var(--line);background:var(--panel-2);border-radius:8px;place-items:center;min-height:42px;padding:0 14px;font-weight:800;display:inline-grid}.mode-select{border:1px solid var(--line);background:var(--panel-2);min-height:42px;color:var(--text);border-radius:8px;padding:0 34px 0 12px;font-weight:800}.mode-select:hover{border-color:var(--line-2)}.prototype-controls .text-button:first-of-type,.prototype-controls .text-button:last-of-type{min-width:42px;padding:0;font-size:1.45rem;line-height:1}.level-number{color:#d4dde1;text-align:center;min-width:58px;font-weight:900}.text-button:hover:not(:disabled){border-color:var(--line-2)}.main-stage{flex:1;place-items:center;min-height:0;display:grid}.prototype-stage{gap:14px;width:min(100%,680px);display:grid}.match-board{grid-template-columns:repeat(var(--board-cols), minmax(0, 1fr));width:min(100%, var(--board-width-limit,72vh));border:1px solid var(--line);touch-action:none;-webkit-user-select:none;user-select:none;background:#151a1f;border-radius:10px;justify-self:center;gap:clamp(5px,1.4vw,10px);padding:clamp(8px,2vw,14px);display:grid}.paint-board{grid-template-columns:repeat(var(--board-cols), minmax(0, 1fr));width:min(100%,72vh);aspect-ratio:var(--board-cols) / var(--board-rows);touch-action:none;-webkit-user-select:none;user-select:none;background:#d9c6a6;border-radius:28px;gap:5px;padding:clamp(10px,2vw,16px);display:grid;box-shadow:0 18px 45px #0008,inset 0 2px #fff7,inset 0 -5px #9d8564}.paint-cell{color:#fff;background:#e8d9bd;border-radius:34% 42% 38% 45%;place-items:center;min-width:0;font-weight:900;display:grid;position:relative;box-shadow:inset 0 2px #fff5,inset 0 -3px #bca887}.paint-cell.paint-hole{visibility:hidden}.paint-cell:before{content:"";background:var(--paint-color,transparent);opacity:.78;border-radius:48% 52% 46% 54%;width:65%;height:65%;transform:rotate(-7deg)}.paint-cell.paint-exit{border:3px dashed color-mix(in srgb, var(--paint-color) 70%, #fff);background:#e0cfb1}.paint-cell.paint-exit:before{opacity:.2}.paint-cell.paint-exit.is-filled:before{opacity:.9}.paint-cell.paint-lump:before{width:calc(65% * var(--blob-scale));height:calc(65% * var(--blob-scale));opacity:1;box-shadow:inset 5px 5px 7px #fff4,inset -5px -7px 8px #0002,0 5px 7px #765b4433}.paint-cell span{z-index:1;text-shadow:0 1px 3px #0008;font-size:clamp(.75rem,2vw,1rem);position:absolute}.finger-paint-app .prototype-stage{width:min(100%,680px)}.match-board--elastic{aspect-ratio:1/1.12;width:min(100%,78vh);display:block}.elastic-board{width:100%;height:100%;position:relative}.elastic-loop{pointer-events:none;position:absolute;inset:0}.elastic-loop:before{content:"";left:var(--loop-left);top:var(--loop-top);width:var(--loop-width);height:var(--loop-height);border:2px dashed #ffffff1f;border-radius:999px;position:absolute;transform:translate(-50%,-50%)}.elastic-loop .elastic-cell{left:var(--bead-left);top:var(--bead-top);width:var(--bead-size);pointer-events:auto;min-width:0;padding:0;position:absolute;overflow:hidden;transform:translate(-50%,-50%)}.elastic-loop .match-cell--filled{box-shadow:none;background:0 0;border-color:#0000}.elastic-loop .elastic-cell.is-current-path{transform:translate(-50%,-50%)}.match-cell{aspect-ratio:1;color:#101316;letter-spacing:0;border:2px solid #ffffff14;border-radius:8px;place-items:center;min-width:0;min-height:0;font-size:clamp(.82rem,3vw,1.2rem);font-weight:900;transition:border-color 90ms,box-shadow 90ms,filter 90ms,transform 90ms;display:grid;position:relative;box-shadow:inset 0 2px #ffffff29,inset 0 -5px 10px #0000003d,0 8px 14px #0000002e}.match-cell--filled,.sequence-chip{background:var(--creature-color)}.erosion-slot,.erosion-sturdy{color:#c8d2d8;background:#28323a;border-color:#7cc7ff38;font-size:.9rem}.erosion-sturdy{color:#e5b86e;border-style:dashed}.match-cell.is-current-path{outline:3px solid var(--current);outline-offset:-3px;filter:brightness(1.2)}.creature-image{width:calc(var(--creature-scale,.96) * 100%);height:calc(var(--creature-scale,.96) * 100%);object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;display:block}.match-cell--hole{background:#11161b;border-style:dashed;border-color:#ffffff14;box-shadow:inset 0 0 18px #00000057}.match-cell--inactive{pointer-events:none;visibility:hidden}.match-cell.is-target-path{border-color:var(--target);filter:saturate(.72)brightness(.72);box-shadow:0 0 0 5px #ffd16657,0 0 22px #ffd1663d,inset 0 0 0 999px #090b0d6b,inset 0 2px #ffffff14,inset 0 -5px 10px #00000057,0 8px 14px #0000002e}.match-cell.is-target-path:after{content:attr(data-path-index);z-index:2;background:var(--target);color:#14100a;border-radius:999px;place-items:center;min-width:20px;height:20px;font-size:.72rem;font-weight:900;line-height:1;display:grid;position:absolute;top:-5px;right:-5px;box-shadow:0 0 0 2px #151a1f,0 4px 9px #00000047}.match-cell.is-target-path .creature-image{opacity:.46}.match-cell.is-current-path{border-color:var(--current);transform:translateY(-1px);box-shadow:0 0 0 4px #7bd88f33,inset 0 2px #ffffff29,inset 0 -5px 10px #0000003d,0 8px 14px #0000002e}.match-cell.is-invalid{border-color:var(--danger);box-shadow:0 0 0 4px #ff6b6b38,inset 0 2px #ffffff29,inset 0 -5px 10px #0000003d,0 8px 14px #0000002e}.sequence-tray{border:1px solid var(--line);background:var(--panel);border-radius:8px;gap:8px;min-height:58px;padding:10px;display:grid}.sequence-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.sequence-row--current{border-top:1px solid #ffffff14;padding-top:8px}.sequence-label{color:var(--muted);text-transform:uppercase;margin-right:2px;font-size:.88rem;font-weight:800}.sequence-empty{color:var(--muted)}.sequence-chip{color:#101316;border-radius:8px;place-items:center;width:42px;height:42px;font-weight:900;line-height:1;display:grid;position:relative}.sequence-chip .creature-image{width:calc(var(--creature-scale,.96) * 100%);height:calc(var(--creature-scale,.96) * 100%)}.sequence-chip.is-ticked:after{content:"";background:var(--current);width:14px;height:14px;box-shadow:0 0 0 2px var(--panel);border-radius:999px;position:absolute;top:-3px;right:-3px}.sequence-chip.is-wrong{filter:saturate(.72)brightness(.86);box-shadow:0 0 0 3px #ff6b6b47}.debug-panel{border:1px solid var(--line);color:#c6d0d5;white-space:pre-wrap;background:#11161b;border-radius:8px;min-height:92px;margin:0;padding:10px;font:.88rem/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media (width<=560px){.app-shell{gap:12px}.topbar{align-items:flex-start}.text-button{min-height:40px;padding:0 12px}.mode-select{min-height:40px}.match-board{width:min(100%, var(--board-width-limit,82vh))}.match-board--elastic{width:min(100%,82vh)}}
