:root{color-scheme:light dark;--bg: #efe9df;--surface: #fffaf2;--text: #2f2e38;--muted: #7a7468;--accent: #e8875b;--border: #e2d9ca;--shadow: 0 12px 32px rgb(47 46 56 / .1);--radius: 16px}@media(prefers-color-scheme:dark){:root{--bg: #14151f;--surface: #1d2033;--text: #ece8f4;--muted: #9a97ad;--accent: #ffb37a;--border: #2c3150;--shadow: 0 12px 32px rgb(0 0 0 / .4)}}*,*:before,*:after{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100dvh;padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));display:grid;grid-template-columns:minmax(0,1fr);place-items:center;align-content:center;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.app{width:min(100%,1040px);display:grid;gap:12px;padding-block:14px}.app__header h1{margin:0;font-size:clamp(1.4rem,1rem + 2vw,2rem);letter-spacing:-.02em}.app__subtitle{margin:4px 0 0;color:var(--muted)}.stage{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);cursor:pointer;touch-action:none}.stage canvas{display:block;width:100%;aspect-ratio:800 / 320;min-height:220px;max-height:calc(100svh - 300px)}.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:12px;pointer-events:none}.overlay__card{max-width:100%;padding:14px 24px;border-radius:14px;text-align:center;background:color-mix(in srgb,var(--surface) 93%,transparent);box-shadow:var(--shadow);animation:pop .25s ease-out}.overlay__title{margin:0;font-size:clamp(1rem,.7rem + 1.6vw,1.6rem)}.overlay__text{margin:4px 0 0}.overlay__text:empty{display:none}.overlay__score{margin:2px 0 0;color:var(--accent);font-size:clamp(2rem,1.4rem + 3vw,3.2rem);font-weight:800;line-height:1.1}.overlay__score:empty,.overlay__chips:empty,.overlay__note:empty{display:none}.overlay__chips{display:flex;justify-content:center;gap:14px;margin:6px 0 0;color:var(--muted);font-size:.9rem}.overlay__note{margin:6px 0 0;font-size:.85rem;font-weight:600}.toast{position:absolute;top:12%;inset-inline:5%;width:fit-content;margin:0 auto;padding:6px 14px;border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 90%,transparent);box-shadow:var(--shadow);font-weight:600;text-align:center;pointer-events:none}.stage[data-state=countdown] .overlay__title{font-size:3rem;line-height:1.1}.overlay__hint{margin:6px 0 0;color:var(--accent);font-weight:600;font-size:.9rem}.language-dialog{width:min(100% - 32px,480px);padding:clamp(20px,5vmin,40px);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);box-shadow:var(--shadow);text-align:center}.language-dialog::backdrop,.achievements::backdrop{background:#1e1e2299;-webkit-backdrop-filter:grayscale(1);backdrop-filter:grayscale(1)}.achievements{width:min(100% - 32px,600px);max-height:min(100dvh - 32px,720px);padding:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);box-shadow:var(--shadow)}.achievements__header{position:sticky;top:0;z-index:1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;padding:16px 20px 14px;background:var(--surface);border-bottom:1px solid var(--border)}.achievements__title{margin:0;font-size:1.35rem}.achievements__close{padding:.2em .65em}.achievements__count{grid-column:1 / -1;margin:0;color:var(--muted);font-size:.9rem}.achievements__bar{grid-column:1 / -1;width:100%;height:8px;accent-color:var(--accent)}.achievements__list{display:grid;gap:16px;padding:16px 20px 20px}.achievements__cat{display:flex;justify-content:space-between;margin:0 0 8px;font-size:.95rem}.achievements__cat-count{color:var(--muted);font-weight:500}.achievements__rows{display:grid;gap:6px;margin:0;padding:0;list-style:none}.achievement{display:flex;align-items:center;gap:12px;padding:8px 12px 8px 8px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.achievement__icon{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:8px;background:var(--border);font-size:1.6rem;filter:grayscale(1) opacity(.5)}.achievement--done .achievement__icon{background:linear-gradient(145deg,var(--accent),color-mix(in srgb,var(--accent) 45%,#ffd34d));filter:none}.achievement__body{flex:1;min-width:0;display:grid;gap:1px}.achievement__name{font-size:.98rem}.achievement:not(.achievement--done) .achievement__name{color:var(--muted)}.achievement__goal{color:var(--muted);font-size:.82rem;line-height:1.3}.achievement__progress{display:flex;align-items:center;gap:8px;margin-top:4px}.achievement__bar{flex:1;min-width:0;height:6px;accent-color:var(--accent)}.achievement__count,.achievement__date{flex:none;color:var(--muted);font-size:.75rem}.language-dialog__title{margin:0 0 clamp(16px,4vmin,28px);font-size:clamp(1.2rem,1rem + 1.5vmin,1.6rem);line-height:1.3}.language-dialog__options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.language-dialog__options button{padding:.8em .5em;border-radius:var(--radius);font-size:clamp(1.1rem,1rem + 1vmin,1.35rem);font-weight:600}.language-dialog__options button:focus-visible{border-color:var(--accent)}.stage[data-state=over]:not([data-can-restart]) .overlay__hint{visibility:hidden}.controls{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.settings-menu{display:none;position:absolute;bottom:calc(100% + 8px);left:50%;z-index:5;transform:translate(-50%);flex-direction:column;gap:6px;padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.settings-menu.is-open{display:flex}.settings-menu button,.settings-menu a{min-height:44px;padding:.4em 1em;text-align:left;white-space:nowrap}.settings-menu a{display:flex;align-items:center;gap:.25em;border:1px solid var(--border);border-radius:999px;color:var(--text);text-decoration:none}.settings-menu a:hover{border-color:var(--accent)}.settings-menu a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(min-width:900px)and (min-height:521px){.controls{grid-area:1 / 1;justify-self:center;align-self:center}.app__header{grid-area:1 / 1}.settings-menu{top:calc(100% + 8px);bottom:auto}}button{font:inherit;padding:.5em 1.1em;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);cursor:pointer;transition:transform .1s,border-color .15s}button:hover:not(:disabled){border-color:var(--accent)}button:active:not(:disabled){transform:scale(.96)}button:disabled{opacity:.5;cursor:default}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.skins{display:grid;gap:10px}.skins__title{margin:0;font-size:1rem}.skins__info{display:grid;min-height:112px;border:1px solid var(--border);border-radius:12px;background:var(--surface);font-size:.92rem}.skin-info__row{display:flex;align-items:center;gap:10px;margin:0;padding:6px 14px;line-height:1.3}.skin-info__row+.skin-info__row{border-top:1px solid var(--border)}.skin-info__label{flex:none;min-width:62px;color:var(--muted)}.skin-info__value{display:block;color:var(--text);font-weight:600}.skin-info__value:first-letter{text-transform:uppercase}.skin-info__value+.skin-info__label{margin-left:auto;min-width:0}.skins__list{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.skin{display:grid;justify-items:center;gap:6px;padding:8px;border-radius:14px}.skin:disabled{opacity:.72}.skin[aria-pressed=true],.skin[aria-pressed=true]:disabled{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,var(--surface));box-shadow:0 0 0 3px var(--accent),0 8px 18px color-mix(in srgb,var(--accent) 35%,transparent);opacity:1;transform:translateY(-2px)}.skin[aria-pressed=true] .skin__name{color:var(--accent);font-weight:700}.skin--locked,.skin--locked:disabled{border-style:dashed;background:var(--bg);opacity:1}.skin--locked .skin__name{color:var(--muted)}.skin__preview{width:96px;max-width:100%;aspect-ratio:96 / 68;border-radius:10px}.skin--locked .skin__preview{filter:grayscale(1) opacity(.35)}.skin--locked .skin__name:before{content:"🔒 "}.skin__name{font-size:.85rem}.skin--special{background:color-mix(in srgb,var(--accent) 8%,var(--surface))}.skin--special .skin__name:after{content:" ♥";color:var(--accent)}.sheet-handle{display:none}.credit{position:absolute;top:10px;right:12px;display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border:1.5px dashed color-mix(in srgb,var(--accent) 60%,transparent);border-radius:999px;color:var(--muted)}.credit__paws{font-size:.85rem;line-height:1}.credit__line{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.credit__name{color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:1rem;font-style:italic}.help{color:var(--muted);font-size:.9rem;text-align:center}kbd{padding:.1em .45em;border:1px solid var(--border);border-bottom-width:2px;border-radius:6px;background:var(--surface);font-family:ui-monospace,Consolas,monospace;font-size:.85em}@media(max-width:700px),(max-height:520px)and (orientation:landscape){html,body{height:100%;overflow:hidden;overscroll-behavior:none}body{display:block;padding:0}.app{position:fixed;inset:0;display:block;width:100%;padding:0}.stage{position:absolute;inset:0;border:0;border-radius:0;box-shadow:none}.stage canvas{height:100%;min-height:0;max-height:none;aspect-ratio:auto}.help{display:none}.app__header{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));z-index:3;max-width:calc(100% - 136px);padding:4px 10px;border-radius:12px;background:color-mix(in srgb,var(--surface) 88%,transparent);pointer-events:none}.app__header h1{font-size:1.05rem}.app__subtitle{margin-top:0;font-size:.72rem;line-height:1.25}html[data-state=running] .app__header,html[data-state=countdown] .app__header{display:none}.controls{position:absolute;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));z-index:4;flex-wrap:nowrap;gap:8px}.controls>button{min-width:44px;min-height:44px;padding:.4em .7em;background:color-mix(in srgb,var(--surface) 88%,transparent)}html[data-state=running] .controls,html[data-state=countdown] .controls{right:auto;left:max(8px,env(safe-area-inset-left))}html[data-state=running] #achievements-button,html[data-state=running] #settings-button,html[data-state=countdown] #achievements-button,html[data-state=countdown] #settings-button,html[data-state=ready] #pause-button{display:none}#pause-button .button__label,#share-button .button__label,#settings-button .button__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.settings-menu{top:calc(100% + 8px);right:0;bottom:auto;left:auto;transform:none}.skins{position:absolute;right:0;bottom:0;left:0;z-index:5;gap:6px;padding:12px max(10px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));border-radius:18px 18px 0 0;background:var(--bg);box-shadow:0 -8px 24px #00000040;transform:translateY(100%);transition:transform .25s ease-out}.skins.is-open{transform:none}html[data-state=running] .skins,html[data-state=countdown] .skins{visibility:hidden}.sheet-handle{position:absolute;bottom:calc(100% + 4px);left:50%;display:flex;align-items:center;gap:6px;min-height:40px;padding:.3em 1em;font-size:.85rem;font-weight:600;white-space:nowrap;transform:translate(-50%)}.sheet-handle__chevron{width:8px;height:8px;margin-top:4px;border-top:2px solid currentColor;border-left:2px solid currentColor;transform:rotate(45deg)}.is-open>.sheet-handle .sheet-handle__chevron{margin-top:-4px;transform:rotate(225deg)}.skins__title{display:none}.skins__info{min-height:84px;font-size:.8rem}.skin-info__row{gap:8px;padding:4px 10px}.skin-info__label{min-width:52px}.credit{position:static;justify-self:center;padding:2px 10px;gap:6px}.credit__line{font-size:.58rem}.credit__name{font-size:.85rem}.skins__list{display:flex;overflow-x:auto;gap:8px;padding:7px 6px;scrollbar-width:none;scroll-snap-type:x proximity;touch-action:pan-x}.skin{flex:0 0 auto;gap:2px;padding:4px 6px;scroll-snap-align:start}.skin__preview{width:64px}.skin__name{font-size:.72rem}}@media(max-height:520px)and (orientation:landscape){.app__subtitle{display:none}.skins{gap:4px;padding-block:8px}.skin__preview{width:50px}.skins__info{min-height:0}.credit{display:none}}@media(max-width:560px){.overlay__card{padding:8px 14px}.overlay__text{display:none}.stage[data-state=over] .overlay__text{display:block}.stage[data-state=paused] .overlay__note{display:none}.overlay__hint{font-size:.8rem}}.visually-hidden,#achievements-button .button__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.unsupported{max-width:32em;text-align:center}@keyframes pop{0%{opacity:0;transform:scale(.94)}}@media(prefers-reduced-motion:reduce){.overlay__card{animation:none}button{transition:none}}
