@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/nunito-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/nunito-latin-800.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Silkscreen;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/silkscreen-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Silkscreen;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/silkscreen-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--font-display: "Nunito", ui-rounded, "SF Pro Rounded", -apple-system, "Segoe UI", sans-serif;--font-pix: "Silkscreen", "Nunito", ui-rounded, "SF Pro Rounded", -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{overflow-x:hidden;overflow-y:auto}.back-link svg{width:13px;height:13px}a,button,summary,[role=switch]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip{position:absolute;left:-9999px;top:0;z-index:99;display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:0 0 10px;background:var(--card, var(--paper, #fff));color:inherit;font-weight:800;text-decoration:none}.skip:focus{left:0}.topbar{display:flex;align-items:flex-start;justify-content:space-between;flex-shrink:0}.brand{display:flex;flex-direction:column;align-items:flex-start}.top-actions{display:flex;gap:2vw}.back-link{display:flex;align-items:center;gap:4px;margin-bottom:.8svh;color:var(--ink-soft);font-size:clamp(10px,1.4svh,12px);font-weight:600;letter-spacing:.08em;text-decoration:none}.subtitle{margin:.4em 0 0;font-size:clamp(10px,1.4svh,12px);letter-spacing:.3em;color:var(--ink-soft)}.seo-info{flex-shrink:0;align-self:center;max-width:90vw;margin-top:.6svh;font-size:11px;color:var(--ink-soft);text-align:center}.icon-btn svg{width:20px;height:20px}.icon-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,transform .1s ease}:focus-visible{outline:2px solid var(--accent-dark, currentColor);outline-offset:2px}@media(forced-colors:active){:focus-visible{outline-color:Highlight}}@media(max-height:480px){.subtitle,.seo-info{display:none}.back-link{margin-bottom:.4svh}.howto-link{padding-top:.4svh}}.icon-btn .ico-sound-off,.icon-btn.is-off .ico-sound-on{display:none}.icon-btn.is-off .ico-sound-off{display:block}.icon-btn.is-off{color:var(--ink-soft)}.icon-btn [data-theme-icon=light]{display:none}.icon-btn [data-theme-icon=dark]{display:block}:root[data-theme=dark] .icon-btn [data-theme-icon=light]{display:block}:root[data-theme=dark] .icon-btn [data-theme-icon=dark]{display:none}@media(max-width:400px){.top-actions{gap:6px}}.back-link,.howto-link{position:relative}.back-link:after,.howto-link:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(100%,44px);height:44px}.pill-btn,.again-btn,.share-btn{min-height:44px}.seo-info summary{position:relative;min-height:44px;display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;letter-spacing:.06em;font-weight:600;list-style:none}.seo-info summary::-webkit-details-marker{display:none}.seo-info summary:after{content:" ▾"}.seo-info[open] summary:after{content:" ▴"}.seo-info p{margin:4px 0 0;line-height:1.5;text-align:left}.share-note{margin:0;font-size:clamp(11px,1.5svh,13px);color:var(--ink-soft);letter-spacing:.06em;opacity:0;transition:opacity .25s ease}.share-note.show{opacity:1}@media(hover:hover)and (pointer:fine){.back-link:hover{color:var(--ink)}}.howto-link{align-self:center;flex-shrink:0;border:none;background:none;color:var(--accent-dark);font-weight:600;font-size:clamp(12px,1.8svh,14px);letter-spacing:.02em;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:1svh 4px 0}.howto-backdrop{position:fixed;inset:0;background:var(--scrim, rgba(30, 24, 16, .35));opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:10}.howto-backdrop.show{opacity:1;pointer-events:auto}.howto-sheet{position:fixed;left:0;right:0;bottom:0;background:var(--bg);border-radius:20px 20px 0 0;box-shadow:0 -1svh 3svh #00000040;padding:1.6svh 6vw calc(4svh + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);z-index:11}.howto-sheet.show{transform:translateY(0)}.howto-handle{width:36px;height:4px;border-radius:2px;background:var(--ink-soft);opacity:.4;margin:0 auto 2svh}.howto-title{margin:0 0 1.6svh;font-size:clamp(14px,2svh,16px);font-weight:600;letter-spacing:.1em;color:var(--ink)}.howto-list{margin:0;padding:0 0 0 1.1em;display:flex;flex-direction:column;gap:1.2svh;font-size:clamp(13px,1.9svh,15px);color:var(--ink);line-height:1.4}.howto-list li::marker{color:var(--accent);font-weight:700}.howto-list strong{color:var(--ink);font-weight:700}@media(prefers-reduced-motion:reduce){.howto-sheet{transition:opacity .12s linear;transform:none;opacity:0;pointer-events:none}.howto-sheet.show{transform:none;opacity:1;pointer-events:auto}.howto-backdrop{transition:opacity .12s linear}}.overlay-exit{position:absolute;top:max(2.4svh,env(safe-area-inset-top,0px));right:max(4vw,env(safe-area-inset-right,0px));width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);transition:transform .1s ease}.overlay-exit svg{width:20px;height:20px}.overlay-exit:active{transform:scale(.94)}.overlay-exit{pointer-events:none}.overlay.show .overlay-exit{pointer-events:auto}.overlay-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(10px,3vw,16px);row-gap:clamp(8px,1.2svh,12px);width:min(80vw,320px)}.overlay-actions>*{justify-content:center;text-align:center}.overlay-actions>:is(button,a){padding-inline:clamp(8px,2vw,16px)}.wall-btn{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;padding:1.2svh 4vw;border:1.5px solid var(--accent);border-radius:999px;background:transparent;color:var(--accent-dark);font-family:var(--font-display, inherit);font-size:clamp(12px,1.8svh,14px);font-weight:600;letter-spacing:.06em;text-decoration:none;cursor:pointer;transition:transform .1s ease}.wall-btn svg{width:16px;height:16px;flex-shrink:0}.wall-btn:active{transform:scale(.96)}html:has(.overlay.show) .top-actions{visibility:hidden}[data-party] .topbar,[data-party] .controls,[data-party] .howto-link,[data-party] .seo-info,[data-party] .overlay,[data-party] .challenge{display:none!important}[data-party=wait] .board-area{pointer-events:none}:root{--bg: #eaf6ee;--paper: #fdfbf6;--paper-edge: #d3ecda;--ink: #262b3d;--ink-soft: #767b8c;--line: #d2ecd9;--purple: #7c5cff;--purple-dark: #6a3ff0;--accent: var(--purple);--accent-dark: var(--purple-dark);--pink: #ff5f96;--orange: #ff9a3d;--teal: #2ee6b8;--yellow: #ffd93d;--rainbow: linear-gradient(90deg, var(--orange), var(--pink), var(--purple), #4fb8ff, var(--teal), var(--yellow));color-scheme:light}html,body{margin:0;height:100%;height:100svh;background:var(--bg);color:var(--ink);font-family:ui-rounded,SF Pro Rounded,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation}.stage{height:100%;display:flex;flex-direction:column;padding:max(2.4svh,env(safe-area-inset-top,0px)) max(4vw,env(safe-area-inset-right,0px)) max(2.2svh,env(safe-area-inset-bottom,0px)) max(4vw,env(safe-area-inset-left,0px))}.title{margin:0;font-family:var(--font-display);font-size:clamp(16px,2.6svh,21px);font-weight:700;letter-spacing:.01em;color:var(--ink)}.title-accent{background:linear-gradient(90deg,var(--pink),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}.top-actions{align-items:center}.icon-btn:active{background:#7c5cff1f;border-color:var(--purple);color:var(--purple-dark);transform:scale(.94)}.timer{margin:0;min-width:52px;padding:.7svh 2.4vw;border:1.5px solid var(--line);border-radius:999px;font-family:var(--font-display);font-size:clamp(13px,1.9svh,15px);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em;text-align:center;color:var(--ink)}.timer.urgent{border-color:var(--pink);color:var(--pink);animation:pulse 1s ease-in-out infinite}.prompt{flex-shrink:0;margin:1svh 0 0;text-align:center;font-size:clamp(13px,2svh,16px);font-weight:700;line-height:1.35;color:var(--ink-soft)}.prompt-shape{color:var(--ink)}.prompt-dir{color:var(--purple-dark)}.prompt.nudge{animation:prompt-nudge 1.5s ease-in-out infinite}@keyframes prompt-nudge{0%,45%,75%,to{transform:translateY(0)}22%{transform:translateY(-7px)}62%{transform:translateY(-3px)}}.canvas-area{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:1.6svh 0}.canvas-wrap{position:relative;width:100%;max-width:660px;height:100%;border-radius:22px;background-color:var(--paper);background-image:radial-gradient(circle,rgba(43,38,32,.1) 1px,transparent 1.6px);background-size:22px 22px;background-position:11px 11px;border:1.5px solid var(--paper-edge);box-shadow:inset 0 0 0 1px #fff9,0 1svh 2.2svh #285a411f;overflow:hidden}.layers{position:absolute;inset:0}.canvas-wrap canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none}#paintCanvas{pointer-events:none}#canvas.paint-mode{cursor:crosshair}.timer-bar{position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--purple),var(--pink));transform-origin:left center;pointer-events:none;z-index:2}.timer-bar.run{animation:timer-drain 30s linear forwards}.timer-bar.urgent{background:var(--pink)}@keyframes timer-drain{to{transform:scaleX(0)}}.idle-prompt{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:0 6vw 5%;pointer-events:none;transition:opacity .25s ease}.idle-hint{margin:0;padding:.8svh 4vw;border:1.5px dashed var(--purple);border-radius:999px;background:#7c5cff0f;font-size:clamp(11px,1.6svh,13px);font-weight:600;letter-spacing:.02em;color:var(--purple-dark);animation:pulse 1.8s ease-in-out infinite}.idle-prompt.hide{opacity:0}@keyframes pulse{0%,to{opacity:.55}50%{opacity:1}}@keyframes doodle-present{0%{transform:scale(.94) rotate(-2.5deg)}40%{transform:scale(1.035) rotate(2deg)}70%{transform:scale(.99) rotate(-.8deg)}to{transform:scale(1) rotate(0)}}@keyframes doodle-drift{0%,to{transform:translateY(0) rotate(-.8deg)}50%{transform:translateY(-9px) rotate(.8deg)}}.layers.finished{animation:doodle-present .9s cubic-bezier(.2,.8,.2,1) both}.layers.presented{animation:doodle-drift 3.6s ease-in-out infinite}.toolbar{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:1.1svh;transition:opacity .3s ease}.toolbar.locked{opacity:.25;pointer-events:none}.swatches{display:flex;align-items:center;gap:1.6vw}.swatch{width:34px;height:34px;padding:4px;border:none;border-radius:50%;background:transparent;cursor:pointer;transition:transform .1s ease}.swatch i{display:block;width:100%;height:100%;border-radius:50%;background:var(--chip, var(--ink));box-shadow:0 0 0 1.5px var(--line);transition:box-shadow .15s ease}.swatch-rainbow i{background:var(--rainbow)}.swatch.is-active{transform:scale(1.1)}.swatch.is-active i{box-shadow:0 0 0 2.5px var(--purple)}.swatch:active{transform:scale(.94)}.tool-row{display:flex;align-items:center;gap:1.8vw}.tool{width:38px;height:38px;border-radius:12px;border:1.5px solid var(--line);background:transparent;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}.tool:active{transform:scale(.94)}.tool.is-active{border-color:var(--purple);background:#7c5cff1a;color:var(--purple-dark)}.tool:disabled{opacity:.35;cursor:default;transform:none}.tool-sep{width:1px;height:20px;background:var(--line)}.done-btn{margin-left:1vw;min-width:78px;padding:1svh 4vw;border:none;border-radius:999px;background:linear-gradient(135deg,var(--purple),var(--purple-dark));color:#fff;font-family:var(--font-display);font-size:clamp(12px,1.8svh,14px);font-weight:700;letter-spacing:.02em;cursor:pointer;box-shadow:0 .6svh 1.4svh #7c5cff59;transition:transform .1s ease}.done-btn:active{transform:scale(.96)}.overlay{position:fixed;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:max(6svh,env(safe-area-inset-bottom));background:linear-gradient(to top,#eaf6eeeb,#eaf6ee8c 40%,#eaf6ee00 75%);opacity:0;pointer-events:none;transition:opacity .4s ease}.overlay.show{opacity:1}.overlay-content{display:flex;flex-direction:column;align-items:center;gap:1.6svh;pointer-events:none}.overlay.show .overlay-content{pointer-events:auto}.overlay-icon{color:var(--purple);margin-bottom:-.4svh}.overlay-title-row{display:flex;align-items:center;gap:2.2vw}.overlay-title{margin:0;font-family:var(--font-display);font-size:clamp(20px,4svh,30px);font-weight:700;letter-spacing:.02em;background:linear-gradient(90deg,var(--pink),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}.deco{font-size:clamp(12px,2svh,16px);line-height:1}.deco-1{color:var(--purple)}.deco-2{color:var(--orange)}.overlay-sub{margin:0;font-size:clamp(12px,1.8svh,14px);color:var(--ink-soft);letter-spacing:.04em}.overlay-actions{margin-top:.6svh}.again-btn,.share-btn{display:flex;align-items:center;gap:.5em;padding:1.2svh 4vw;border-radius:999px;font-family:var(--font-display);font-size:clamp(12px,1.8svh,14px);font-weight:600;letter-spacing:.02em;cursor:pointer;transition:transform .1s ease}.again-btn:active,.share-btn:active{transform:scale(.96)}.again-btn{border:none;background:linear-gradient(135deg,var(--purple),var(--purple-dark));color:#fff;box-shadow:0 .8svh 1.8svh #7c5cff66}.share-btn{border:1.5px solid var(--purple);background:transparent;color:var(--purple-dark)}@media(prefers-reduced-motion:reduce){.idle-hint,.prompt.nudge,.timer.urgent,.layers.finished,.layers.presented{animation:none}}:root[data-theme=dark]{--bg: #0d0e1a;--paper: #14132a;--paper-edge: #2c2850;--ink: #f0eefa;--ink-soft: #9b96c4;--line: #2c2850;--purple: #b06bff;--purple-dark: #9d4dff;--pink: #ff4fc4;--orange: #ffb84d;--teal: #3df0d4;--yellow: #ffe066;color-scheme:dark}[data-theme=dark] .canvas-wrap{background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.6px);box-shadow:inset 0 0 0 1px #ffffff0d,0 0 0 1.5px color-mix(in srgb,var(--purple) 35%,transparent),0 0 3svh color-mix(in srgb,var(--purple) 20%,transparent)}[data-theme=dark] .idle-hint{background:color-mix(in srgb,var(--purple) 14%,transparent)}[data-theme=dark] .tool.is-active{background:color-mix(in srgb,var(--purple) 16%,transparent)}[data-theme=dark] .done-btn{box-shadow:0 .6svh 1.4svh color-mix(in srgb,var(--purple) 45%,transparent)}[data-theme=dark] .overlay{background:linear-gradient(to top,#0d0e1af0,#0d0e1a99 40%,#0d0e1a00 75%)}[data-theme=dark] .again-btn{box-shadow:0 .8svh 1.8svh color-mix(in srgb,var(--purple) 50%,transparent)}@media(max-height:480px){.stage{padding-top:1.4svh;padding-bottom:1.2svh}.overlay-exit{top:1.4svh}.back-link{margin-bottom:.3svh}.howto-link{padding-top:.4svh}.prompt{margin-top:.5svh;font-size:12px}.canvas-area{padding:1svh 0}.toolbar{gap:.6svh}.swatch{width:28px;height:28px;padding:3px}.tool{width:32px;height:32px;border-radius:10px}.tool svg{width:16px;height:16px}.done-btn{min-width:66px;padding:.8svh 3vw}.timer{padding:.5svh 2vw;min-width:46px}}.swatch,.tool{position:relative}.swatch:after,.tool:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:44px}.done-btn{min-height:44px}[data-party] .timer-bar,[data-party] .idle-prompt{display:none}[data-party=wait] .prompt{visibility:hidden}[data-party=wait] .canvas-area,[data-party=wait] .toolbar{pointer-events:none}[data-party] .canvas-area{container-type:size}[data-party] .canvas-wrap{width:min(100cqw,100cqh);height:min(100cqw,100cqh)}
