@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-vietnamese-opsz-normal-D9N6E8K1.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-latin-ext-opsz-normal-IcJDqblK.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-latin-opsz-normal-Cre6nC2_.woff2) format("woff2-variations");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}*{box-sizing:border-box}html,body{margin:0}body{background:#efebe4}button{font:inherit;color:inherit}.app{--bg: #efebe4;--ink: #2b2620;--muted: #7d7468;--surface: #fffaf2;--line: #d9cfbf;--accent: #e5533c;--p0: #e5533c;--p1: #2f4fd8;--capture: #e5533c;--chip-bg: #2b2620;--chip-ink: #fffaf2;--font: "Bricolage Grotesque Variable", system-ui, sans-serif;--display: "Bricolage Grotesque Variable", system-ui, sans-serif;--radius: 999px;--chrome: 190px;--ph: 1.55;--fill: .75;--cell: max(28px, min(100vw * var(--fill) / 9.94, (100svh - var(--chrome)) / (2 * var(--ph) + .62)));--b: calc(var(--cell) * .19);--accent-ink: #fff;min-height:100svh;display:flex;flex-direction:column;padding:12px 16px 16px;background:var(--bg);color:var(--ink);font-family:var(--font);transition:background-color .3s,color .3s}.top{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}h1{font-family:var(--display);font-size:22px;margin:0;letter-spacing:-.01em}h2{font-family:var(--display);font-size:22px;line-height:1.3;margin:0 0 16px}.actions,.looks{display:flex;gap:6px;flex-wrap:wrap}.actions button,.looks button{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:7px 14px;font-weight:500;font-size:14px;cursor:pointer;transition:border-color .15s,transform .15s,background-color .15s}.actions button:hover:not(:disabled),.looks button:hover{border-color:var(--ink)}.actions button:active:not(:disabled),.looks button:active{transform:translateY(1px)}.actions button:disabled{opacity:.4;cursor:default}.actions button.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}.looks button{display:inline-flex;align-items:center;gap:7px}.looks button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.swatch{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 1.5px #ffffffb3}main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding-top:8px}main.tall{--chrome: 200px;--ph: 2;--cell: max(26px, min((100vw - 24px) / (2 * var(--ph) + .62), (100svh - var(--chrome)) / 9.94));--b: calc(var(--cell) * .22)}.players{display:flex;justify-content:center;gap:12px}.players.tall{width:calc(var(--cell) * (2 * var(--ph) + .62));justify-content:space-between;gap:4px}.players.tall .turn{font-size:14px;padding:4px 10px}.turn{display:flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;color:var(--muted);font-weight:500;font-size:15px;white-space:nowrap;transition:color .25s,background-color .25s}.turn .dot{width:10px;height:10px;border-radius:50%;background:currentColor}.turn.p0 .dot{background:var(--p0)}.turn.p1 .dot{background:var(--p1)}.turn.active{color:var(--ink);background:var(--surface);box-shadow:0 0 0 1.5px var(--line)}.turn .hint{font-weight:400;color:var(--muted)}.message{min-height:1.5em;margin:2px 0 0;text-align:center;font-size:15px}.stage{position:relative;display:flex;justify-content:center}.board{position:relative;display:grid;gap:calc(var(--cell) * .12);padding:calc(var(--cell) * .25);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .3s,box-shadow .3s}.board.wide{grid-template-columns:calc(var(--cell) * 1.3) repeat(6,var(--cell)) calc(var(--cell) * 1.3);grid-template-rows:repeat(2,calc(var(--cell) * var(--ph)))}.board.tall{grid-template-columns:repeat(2,calc(var(--cell) * var(--ph)));grid-template-rows:calc(var(--cell) * 1.3) repeat(6,var(--cell)) calc(var(--cell) * 1.3)}.board.playing{cursor:pointer}.pit,.store{position:relative;display:block;padding:0;border:0;background:transparent;transition:transform .18s ease,box-shadow .18s,background-color .18s,filter .18s}.pit{cursor:default}.pit.legal{cursor:pointer}.pit:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.well{position:absolute;top:6%;right:6%;bottom:6%;left:6%;border-radius:var(--well-radius, 50%);transition:box-shadow .18s,background-color .18s,transform .18s}.store .well{top:5%;right:5%;bottom:5%;left:5%}.wall{display:none}.floor{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit}.beads{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.bead{position:absolute;left:50%;top:50%;width:var(--b);height:var(--b);margin:calc(var(--b) / -2) 0 0 calc(var(--b) / -2);border-radius:50%;translate:calc((var(--x) * var(--sx, 1) + var(--px, 0)) * var(--b)) calc((var(--y) * var(--sy, 1) + var(--py, 0) - var(--drop) * .45) * var(--b));background:var(--c);animation:bead-in .65s backwards;transition:translate .8s cubic-bezier(.2,.7,.25,1)}@property --drop{syntax: "<number>"; inherits: false; initial-value: 0;}.board.wide .pit .bead{--sy: 1.3}.board.tall .pit .bead{--sx: 1.5}.board.wide .store .bead{--sy: 2.1}.board.tall .store .bead{--sx: 2.1}@keyframes bead-in{0%{opacity:0;--drop: 2.4;animation-timing-function:cubic-bezier(.45,0,.85,.55)}25%{opacity:1}70%{--drop: -.1;animation-timing-function:cubic-bezier(.3,0,.4,1)}to{--drop: 0}}.pit .bead.landed{animation-name:bead-land;animation-duration:.4s}@keyframes bead-land{0%{--drop: 2.4;animation-timing-function:cubic-bezier(.3,0,.4,1)}70%{--drop: -.1}to{--drop: 0}}.hand{position:absolute;left:0;top:0;width:0;height:0;z-index:5;pointer-events:none}.hand .beads{inset:auto;left:0;top:calc(var(--b) * -.9)}.hand .bead{animation:none;translate:calc(var(--x) * var(--b)) calc(var(--y) * var(--b));filter:drop-shadow(0 calc(var(--b) * .45) calc(var(--b) * .3) rgba(0,0,0,.22))}.hand-count{position:absolute;left:calc(var(--b) * .9);top:calc(var(--b) * -2.6);min-width:22px;padding:2px 6px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);font-size:12px;font-weight:700;text-align:center}.count{position:absolute;left:50%;bottom:-2px;transform:translate(-50%,50%);font-size:clamp(10px,calc(var(--cell) * .13),15px);font-weight:700;color:var(--count-ink, var(--muted));line-height:1;padding:2px 7px;border-radius:999px;background:var(--count-bg, transparent);z-index:3;font-variant-numeric:tabular-nums}.board.tall .pit.side1 .count{left:auto;right:-2px;bottom:50%;transform:translate(50%,50%)}.board.tall .pit.side0 .count{left:-2px;bottom:50%;transform:translate(-50%,50%)}.count.big{bottom:8%;transform:translate(-50%);font-size:clamp(14px,calc(var(--cell) * .24),30px);color:var(--store-ink, var(--ink));background:transparent}.board.tall .count.big{bottom:50%;left:auto;right:6%;transform:translateY(50%)}.face{position:absolute;left:50%;top:7%;width:46%;transform:translate(-50%);color:var(--face, var(--ink));z-index:2;opacity:.85}.face .maw{transform-origin:20px 12px;transform-box:view-box;transform:scale(.2,0);transition:transform .18s cubic-bezier(.3,.8,.4,1)}.face .smile{transition:opacity .12s}.face.open .maw{transform:none}.face.open .smile{opacity:0}.face.gulp:not(.open) .maw{animation:gulp .34s ease-in both}.face.gulp:not(.open) .smile{animation:smile-back .34s both}@keyframes gulp{0%{transform:none}45%{transform:scale(.75,.35)}to{transform:scale(.2,0)}}@keyframes smile-back{0%,60%{opacity:0}to{opacity:1}}.board.tall .face{top:50%;left:7%;width:18%;transform:translateY(-50%)}.chip{position:absolute;left:50%;top:0;transform:translate(-50%,-40%);padding:2px 7px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);font-size:12px;font-weight:700;line-height:1.2;z-index:4;white-space:nowrap;animation:fade .3s ease-out backwards;pointer-events:none}.chip.final{background:var(--accent);color:var(--accent-ink)}.chip.again{top:auto;bottom:22%;background:var(--accent);color:var(--accent-ink);animation:fade .3s ease-out backwards}.landing:after{content:"";position:absolute;top:2%;right:2%;bottom:2%;left:2%;border-radius:var(--well-radius, 50%);border:2.5px solid var(--accent);animation:breathe 2.4s ease-in-out infinite alternate;pointer-events:none;z-index:3}.store.landing:after{border-radius:var(--store-radius, 999px)}@keyframes breathe{0%{opacity:.9}to{opacity:.4}}.pit.threat .well{box-shadow:var(--well-shadow, none),inset 0 0 0 3px var(--capture)}.pit.last .well,.store.last .well{box-shadow:var(--well-shadow, none),0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in srgb,var(--ink) 45%,transparent);display:flex;align-items:center;justify-content:center;padding:16px;z-index:30;animation:fade .2s ease-out}@keyframes fade{0%{opacity:0}}.panel{background:var(--surface);color:var(--ink);border:1.5px solid var(--line);border-radius:20px;padding:24px;max-width:480px;width:100%;max-height:90vh;overflow-y:auto;animation:rise .3s ease-out}@keyframes rise{0%{transform:translateY(8px);opacity:0}}.panel.result{text-align:center}.panel.result .actions{justify-content:center;margin-top:20px}.panel .actions{justify-content:flex-end;margin-top:16px}.score{font-family:var(--display);font-size:32px;font-weight:700;margin:0 0 12px}.rules{padding-left:18px;line-height:1.5;color:var(--muted)}.rules li{margin-bottom:6px}fieldset{border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;margin:16px 0 0}legend{padding:0 6px;font-weight:500}fieldset label{display:flex;gap:8px;align-items:center;padding:4px 0;cursor:pointer}.note{color:var(--muted);font-size:13px;margin:8px 0 0}.panel.setup label .note{margin:0 0 0 auto;padding-left:12px;text-align:right}@media(max-width:640px){.app{padding:10px 12px 12px}h1{font-size:18px}.top{gap:8px}.looks{order:3;width:100%}.looks button,.actions button{padding:5px 10px;font-size:13px}.chip{font-size:10px;padding:1px 5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.app[data-theme=monster]{--bg: #fff4e4;--ink: #111;--muted: #111;--surface: #fff;--line: #111;--accent: #111;--accent-ink: #fff;--p0: #ff7300;--p1: #00a3ff;--capture: #ff7300;--chip-bg: #111;--chip-ink: #fff;--count-ink: #111;--font: "Bricolage Grotesque Variable", system-ui, sans-serif;--display: "Bricolage Grotesque Variable", system-ui, sans-serif;--cell: max(28px, min(100vw * var(--fill) / 11.4, (100svh - var(--chrome)) / (2 * var(--ph) + .62)))}body:has(.app[data-theme=monster]){background:#fff4e4}.app[data-theme=monster] main.tall{--cell: max(26px, min((100vw - 24px) / (2 * var(--ph) + .62), (100svh - var(--chrome)) / 11.4))}[data-theme=monster] h1{font-weight:800;font-size:26px;letter-spacing:-.02em}[data-theme=monster] .actions button,[data-theme=monster] .looks button{background:#11111114;border:0;padding:8px 15px;font-weight:700}[data-theme=monster] .actions button:hover:not(:disabled),[data-theme=monster] .looks button:hover{background:#11111129}[data-theme=monster] .actions button.primary,[data-theme=monster] .looks button.on{background:#111;color:#fff}[data-theme=monster] .swatch{box-shadow:none}[data-theme=monster] .turn{color:#111;font-weight:700;opacity:.4}[data-theme=monster] .turn.active{opacity:1;background:#111;color:#fff;box-shadow:none}[data-theme=monster] .turn .hint{color:inherit;opacity:.7}[data-theme=monster] .turn .dot{width:12px;height:12px}[data-theme=monster] .message{font-weight:700}[data-theme=monster] .overlay{background:#11111180}[data-theme=monster] .panel{border:0;border-radius:20px}[data-theme=monster] .panel.result h2{font-size:30px;font-weight:800}[data-theme=monster] .score{font-weight:800}[data-theme=monster] fieldset{border:2.5px solid #111}[data-theme=monster] .rules{color:#111}[data-theme=monster] .board.wide{grid-template-columns:calc(var(--cell) * 2) repeat(6,var(--cell)) calc(var(--cell) * 2)}[data-theme=monster] .board.tall{grid-template-rows:calc(var(--cell) * 2) repeat(6,var(--cell)) calc(var(--cell) * 2)}[data-theme=monster] .well{top:7%;right:7%;bottom:7%;left:7%;border-radius:calc(var(--cell) * .24);background:#f0a800}[data-theme=monster] .count{font-weight:800;font-size:clamp(11px,calc(var(--cell) * .15),17px);opacity:.3}[data-theme=monster] .pit.legal .count{opacity:1}[data-theme=monster] .landing:after{top:2%;right:2%;bottom:2%;left:2%;border:3.5px solid #111;border-radius:calc(var(--cell) * .28);animation:none}[data-theme=monster] .store.landing:after{display:none}[data-theme=monster] .pit.threat .well{background:#111}[data-theme=monster] .pit.last .well,[data-theme=monster] .store.last .well{box-shadow:none}[data-theme=monster] .chip{font-weight:800;border-radius:8px}[data-theme=monster] .chip.final,[data-theme=monster] .chip.again{background:#fff;color:#111}[data-theme=monster] .bead{background:var(--c);box-shadow:inset 0 0 0 calc(var(--b) * .16) #111}.monster{position:absolute;top:3%;right:6%;bottom:3%;left:6%;display:flex;flex-direction:column;align-items:center;--radius: calc(var(--cell) * .34)}.monster.shape-dome{--radius: 50% 50% 16% 16% / 30% 30% 10% 10%}.monster.shape-blob{--radius: 48% 52% 38% 44% / 34% 38% 28% 32%}.monster .body{position:absolute;left:calc(6% - var(--full, 0) * 6%);right:calc(6% - var(--full, 0) * 6%);top:0;bottom:0;background:linear-gradient(98deg,var(--skin) 0 74%,var(--shade) 74%);border-radius:var(--radius);transition:left .5s cubic-bezier(.3,1.4,.5,1),right .5s cubic-bezier(.3,1.4,.5,1)}.monster .head{position:relative;z-index:3;flex:none;width:100%;height:42%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding-top:10%}.monster .eyes{width:64%;overflow:visible}.monster .eyes .white{fill:#fff}.monster .eyes .pupil{fill:#111;transition:transform .3s cubic-bezier(.3,.9,.4,1)}.monster .eyes .awake{transform-box:fill-box;transform-origin:center;animation:blink 5.5s infinite;transition:opacity .2s,transform .3s}.monster .eyes .lid{fill:#111;transition:opacity .2s,translate .25s cubic-bezier(.3,.9,.4,1)}.monster .head:is(.open,.mood-hungry) .lid{opacity:0;translate:0 -6px}.monster .crest{width:64%;overflow:visible}.monster .mouth .fangs{fill:#fff;stroke:#111;stroke-width:3;stroke-linejoin:round;opacity:clamp(0,calc((.3 - var(--s)) * 8),1)}.store1 .monster .eyes .awake{animation-delay:-2.4s}.monster .eyes :is(.squint,.arcs,.brows){fill:none;stroke:#111;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .25s}.monster .eyes .tear{fill:#9fe3ff;opacity:0}@keyframes blink{0%,95%,to{transform:none}97%{transform:scaleY(.1)}}.monster .mouth{width:80%;overflow:visible}.monster .mouth :is(.smile,.frown){fill:none;stroke:#111;stroke-width:7;stroke-linecap:round;opacity:0;transition:opacity .25s}@property --s{syntax: "<number>"; inherits: true; initial-value: .14;}.monster .jaws{transition:opacity .2s}.monster .cavity{fill:#111}.monster .tongue{fill:#ff5c8a}.monster .teeth{fill:#fff;opacity:clamp(0,(var(--s) - .2) * 4,1)}.monster .head.open .jaws{opacity:1}.monster .head.open .pupil{transform:translateY(-3px)}.monster .head.gulp:not(.open) .jaws{animation:show .42s}.monster .head.gulp:not(.open) .awake{animation:hide-eyes .42s}.monster .head.gulp:not(.open) .squint{animation:show-squint .42s}@keyframes show{0%,to{opacity:1}}@keyframes hide-eyes{0%,to{opacity:1}15%,75%{opacity:0}}@keyframes show-squint{0%,to{opacity:0}15%,75%{opacity:1}}.monster .head.mood-happy:not(.open) .awake{opacity:0}.monster .head.mood-happy:not(.open) .arcs{opacity:1}.monster .head.mood-happy:not(.open) .jaws{opacity:0}.monster .head.mood-happy:not(.open) .smile{opacity:1}.monster.mood-happy{animation:hop .9s cubic-bezier(.3,0,.3,1) 2}@keyframes hop{0%,to{translate:0 0;scale:1 1}15%{translate:0 0;scale:1.04 .95}45%{translate:0 calc(var(--cell) * -.14);scale:.97 1.04}75%{translate:0 0;scale:1.03 .97}}.monster .head.mood-sad:not(.open) .brows{opacity:1}.monster .head.mood-sad:not(.open) .pupil{transform:translateY(4px)}.monster .head.mood-sad:not(.open) .jaws{opacity:0}.monster .head.mood-sad:not(.open) .frown{opacity:1}.monster .head.mood-sad:not(.open) .tear{animation:tear 1.6s cubic-bezier(.5,0,.9,.6) .3s both}@keyframes tear{0%{opacity:0;transform:translateY(-4px) scale(.4)}20%{opacity:1;transform:none}80%{opacity:1}to{opacity:0;transform:translateY(26px)}}.monster.mood-sad{animation:sag .7s cubic-bezier(.3,.8,.4,1) both}@keyframes sag{0%{scale:1 1;translate:0 0}35%{scale:1.04 .92;translate:0 calc(var(--cell) * .06)}to{scale:1.02 .96;translate:0 calc(var(--cell) * .03)}}.monster .head.mood-hungry:not(.open) .pupil{transform:translateY(-3px) scale(1.15)}.monster .belly{position:relative;z-index:1;margin-top:2%;width:calc(84% + var(--full, 0) * 12%);flex:1 1 auto;margin-bottom:6%}.monster .belly .floor{top:0;right:0;bottom:0;left:0}.monster .body.skin{z-index:2;opacity:.32;pointer-events:none}[data-theme=monster] .board.wide .store .bead{--sx: 1.3;--sy: 1.45}[data-theme=monster] .board.tall .store .bead{--sx: 1.6;--sy: 1.1}[data-theme=monster] .store .bead{animation:swallow .55s cubic-bezier(.5,0,.75,.6) backwards}@keyframes swallow{0%{opacity:0;--drop: 9;scale:.4}20%{opacity:1}80%{--drop: -.2;scale:1.05 .9;animation-timing-function:cubic-bezier(.3,0,.4,1)}to{--drop: 0;scale:1}}[data-theme=monster] .count.big{bottom:-4%;transform:translate(-50%,50%);color:#111;opacity:1;font-size:clamp(15px,calc(var(--cell) * .26),30px)}[data-theme=monster] .store.active .monster:not(.mood-happy):not(.mood-sad){animation:bob 2.6s ease-in-out infinite}@keyframes bob{50%{translate:0 calc(var(--cell) * -.04)}}.flight{position:absolute;left:0;top:0;width:0;height:0;z-index:6;pointer-events:none}.flight .bead{left:0;top:0;translate:none;animation:none;transition:none}.pit.robbed .well{animation:robbed .5s cubic-bezier(.3,0,.3,1)}@keyframes robbed{0%,to{translate:0 0}20%{translate:calc(var(--cell) * -.04) 0}40%{translate:calc(var(--cell) * .04) 0}60%{translate:calc(var(--cell) * -.025) 0}80%{translate:calc(var(--cell) * .015) 0}}.panel.new-game{max-width:620px}.pick{margin-top:14px}.pick h3{margin:0 0 10px;font-size:16px}.segments{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.segments button{border:1.5px solid var(--line);background:transparent;border-radius:999px;padding:7px 16px;font-weight:700;cursor:pointer}.segments button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.pick .note{margin:0 0 4px}[data-theme=monster] .segments button{border:0;background:#11111114}[data-theme=monster] .segments button.on{background:#111;color:#fff}.pick-row{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.pick-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px;border:0;border-radius:14px;background:transparent;cursor:pointer;font-weight:700;font-size:13px;transition:background-color .15s,transform .15s}.pick-tile:hover:not(:disabled){background:#1111110f}.pick-tile.on,.pick-tile.on:hover:not(:disabled){background:#111;color:#fff}.pick-tile:disabled{opacity:.25;cursor:default}.pick-tile:active:not(:disabled){transform:scale(.96)}.monster.mini{position:relative;inset:auto;width:100%;max-width:76px;aspect-ratio:1;--cell: 60px}.monster.mini .head{height:100%;justify-content:center;gap:12%;padding:0}.monster.mini .eyes,.monster.mini .crest{width:70%}.monster.mini .mouth{width:66%}@media(max-width:640px){.pick-row{grid-template-columns:repeat(3,1fr)}}.board.tall .monster{flex-direction:row;justify-content:center;gap:4%}.board.tall .monster .head{flex:none;width:44%;height:100%;padding:0;justify-content:center;gap:10%}.board.tall .monster .belly{margin:0;flex:1 1 auto;width:auto;height:84%}[data-theme=monster] .board.tall .count.big{left:50%;right:auto;bottom:-4%;transform:translate(-50%,50%)}.app[data-theme=monster]:has(main.wide){--side: 20vw;--cell: calc((100vw - 2 * var(--side)) / 6);--row: min(calc(var(--cell) * 1.25), 19svh);--b: min(calc(var(--cell) * .19), calc(var(--row) * .17));padding-left:var(--side);padding-right:var(--side)}.app[data-theme=monster]:has(main.wide) .top{padding:0 16px}[data-theme=monster] .board.wide{grid-template-columns:0 repeat(6,var(--cell)) 0;grid-template-rows:repeat(2,var(--row));gap:0;padding:0}[data-theme=monster] .board .pit{--tile: var(--p0)}[data-theme=monster] .board .pit.side1{--tile: var(--p1)}[data-theme=monster] .board .pit:is(:nth-of-type(odd)){--tile-shade: 0%}[data-theme=monster] .board .pit .well{top:0;right:0;bottom:0;left:0;border-radius:0;background:color-mix(in srgb,var(--tile),#000 var(--tile-shade, 7%))}[data-theme=monster] .board .pit .count{bottom:10%;transform:translate(-50%);color:#111}[data-theme=monster] .board .landing:after{top:5px;right:5px;bottom:5px;left:5px;border-radius:14px}[data-theme=monster] .board .pit.robbed .well{animation:none}[data-theme=monster] .board .pit.robbed .floor{animation:robbed .5s cubic-bezier(.3,0,.3,1)}[data-theme=monster] .board.wide .store{position:fixed;top:0;bottom:0;width:var(--side);z-index:1}[data-theme=monster] .board.wide .store0{right:0}[data-theme=monster] .board.wide .store1{left:0}[data-theme=monster] .board .monster{top:0;right:0;bottom:0;left:0;justify-content:center;background:var(--skin);animation:none}[data-theme=monster] .board .monster .body{display:none}[data-theme=monster] .board .monster .head{height:auto;padding:0;gap:min(5vh,4vw);justify-content:center}[data-theme=monster] .board .monster .eyes{width:64%}[data-theme=monster] .board .monster .mouth{width:62%}[data-theme=monster] .board .monster.mood-happy .head{animation:hop .9s cubic-bezier(.3,0,.3,1) 2}[data-theme=monster] .board .monster.mood-sad .head{animation:sag .7s cubic-bezier(.3,.8,.4,1) both}[data-theme=monster] .board .store.active .monster:not(.mood-happy):not(.mood-sad){animation:none}[data-theme=monster] .board .store.active .monster:not(.mood-happy):not(.mood-sad) .head{animation:bob 2.6s ease-in-out infinite}[data-theme=monster] .board .monster .belly{position:absolute;left:30%;right:30%;top:44%;height:14%;margin:0;opacity:0}[data-theme=monster] .board .count.big{bottom:5vh;font-size:clamp(22px,3.2vw,46px);z-index:3}.app[data-theme=monster]{overflow-x:clip}.app[data-theme=monster]:has(main.tall){--sideh: 15svh;--colw: 50vw;--cell: max(40px, min(calc(var(--colw) * .5), calc((100svh - var(--chrome) - 2 * var(--sideh)) / 6)));--b: min(calc(var(--cell) * .25), calc(var(--colw) * .07))}[data-theme=monster] .board.tall{width:100vw;grid-template-columns:repeat(2,var(--colw));grid-template-rows:var(--sideh) repeat(6,var(--cell)) var(--sideh);gap:0;padding:0}[data-theme=monster] .board.tall .pit .count{left:50%;right:auto;bottom:8%;transform:translate(-50%)}[data-theme=monster] .board.tall .monster{flex-direction:column;gap:0}[data-theme=monster] .board.tall .monster .head{gap:0;width:100%;height:auto}[data-theme=monster] .board.tall .monster .eyes{width:calc(var(--sideh) * .7)}[data-theme=monster] .board.tall .monster .crest{width:calc(var(--sideh) * .6)}[data-theme=monster] .board.tall .monster .mouth{width:calc(var(--sideh) * .5)}[data-theme=monster] .board.tall .count.big{left:auto;right:7%;bottom:50%;transform:translateY(50%);font-size:clamp(20px,6vw,34px)}[data-theme=monster] .board .monster{--rest: .08}.monster.mini .body{background:var(--skin)}.win-dance{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;background:var(--skin);pointer-events:none;animation:take-over .75s cubic-bezier(.65,0,.35,1) both}.win-dance.from-left{--from: inset(0 80% 0 0)}.win-dance.from-right{--from: inset(0 0 0 80%)}.win-dance.from-top{--from: inset(0 0 85% 0)}.win-dance.from-bottom{--from: inset(85% 0 0 0)}@keyframes take-over{0%{clip-path:var(--from)}to{clip-path:inset(0)}}.win-dance .win-title{position:absolute;top:7vh;left:0;right:0;margin:0;text-align:center;color:#111;font-size:clamp(34px,7vw,84px);font-weight:900;line-height:1;letter-spacing:-.02em;animation:title-in .5s cubic-bezier(.2,.8,.3,1.2) .55s both}.win-dance .win-title span{display:block;margin-top:.35em;font-size:max(.32em,14px);font-weight:800;letter-spacing:.12em;text-transform:uppercase}@keyframes title-in{0%{opacity:0;transform:translateY(-.4em) scale(.9)}}.win-dance .dancer{position:relative;inset:auto;width:min(72vw,52vh);justify-content:center;animation:dance .8s cubic-bezier(.45,0,.55,1) .6s infinite}.win-dance .dancer .head{height:auto;padding:0;gap:min(4vh,3vw)}.win-dance .dancer .crest{width:60%;animation:wiggle .4s ease-in-out .6s infinite alternate}.win-dance .dancer .eyes{width:64%}.win-dance .dancer .mouth{width:60%}@keyframes dance{0%{transform:translateY(0) rotate(0) scale(1)}20%{transform:translateY(4vh) rotate(-7deg) scale(1.06,.92)}45%{transform:translateY(-3vh) rotate(-3deg) scale(.96,1.05)}50%{transform:translateY(0) rotate(0) scale(1)}70%{transform:translateY(4vh) rotate(7deg) scale(1.06,.92)}95%{transform:translateY(-3vh) rotate(3deg) scale(.96,1.05)}to{transform:translateY(0) rotate(0) scale(1)}}@keyframes wiggle{0%{transform:rotate(-6deg)}to{transform:rotate(6deg)}}.app .top{display:flex;justify-content:center}.app .top .brand{position:relative;display:flex;align-items:center;outline:none}.app .top .logo{margin:0;line-height:0}.app .top .logo img{display:block;height:clamp(52px,10svh,96px);width:auto;transition:transform .25s cubic-bezier(.3,1.4,.5,1)}.app .top .brand:hover .logo img,.app .top .brand:focus-within .logo img{transform:rotate(-3deg) scale(1.04)}.app .top .actions{position:absolute;left:100%;top:50%;display:flex;flex-wrap:nowrap;gap:8px;padding-left:12px;opacity:0;pointer-events:none;transform:translate(-12px,-50%);transition:opacity .2s,transform .25s cubic-bezier(.3,1.4,.5,1)}.app .top .brand:hover .actions,.app .top .brand:focus-within .actions{opacity:1;pointer-events:auto;transform:translateY(-50%)}.app .top .actions button.icon{display:grid;place-items:center;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:#111;color:#fff4e4;box-shadow:0 3px #0000002e}.app .top .actions button.icon.primary{background:var(--p0, #ff5a4e);color:#111}.app .top .actions button.icon:hover{transform:translateY(-2px) rotate(-6deg)}.app .top .actions button.icon:active{transform:translateY(1px)}@media(max-width:720px){.app .top .actions{gap:6px;padding-left:8px}.app .top .actions button.icon{width:38px;height:38px}.app .top .logo img{height:46px}}h1,h2,.score,.count.big,.win-title{font-variation-settings:"opsz" 96}.monster .eyes .droop{fill:#111;opacity:0;translate:0 -4px;transition:opacity .3s,translate .4s cubic-bezier(.3,.9,.4,1)}.monster .head.tracking .pupil{transition:cx .12s ease-out,cy .12s ease-out,transform .3s}.monster .head.tracking .lid{opacity:0;translate:0 -6px}.store:not(.active) .monster .head.mood-idle:not(.open):not(.gulp) .droop{opacity:1;translate:0 0}.store:not(.active) .monster .head.mood-idle:not(.open):not(.gulp) .lid{opacity:0}.store:not(.active) .monster .head.mood-idle:not(.open) .pupil{animation:wander 7s ease-in-out infinite}@keyframes wander{0%,18%,to{transform:translateY(2px)}30%,46%{transform:translate(-5px,3px)}58%,78%{transform:translate(5px,2px)}}[data-theme=monster] .board .store:not(.active) .monster.mood-idle .head{animation:breathe 3.6s ease-in-out infinite}@keyframes breathe{50%{scale:1.015 .985}}[data-theme=monster] .board .store.active .monster:not(.mood-happy):not(.mood-sad) .head{animation:perk 1.5s cubic-bezier(.45,0,.55,1) infinite}@keyframes perk{0%,to{translate:0 0;rotate:0deg}25%{translate:0 calc(var(--cell) * -.05);rotate:-1.2deg}50%{translate:0 0;rotate:0deg}75%{translate:0 calc(var(--cell) * -.05);rotate:1.2deg}}@property --p0{syntax: "<color>"; inherits: true; initial-value: #ff5a4e;}@property --p1{syntax: "<color>"; inherits: true; initial-value: #2d6bff;}@property --skin{syntax: "<color>"; inherits: true; initial-value: #ff5a4e;}.app[data-theme=monster]{transition:background-color .3s,color .3s,--p0 .45s ease,--p1 .45s ease}.monster{transition:--skin .45s ease}[data-theme=monster] .board .monster .head.swap-out{position:absolute;left:0;right:0;top:50%;translate:0 -50%;pointer-events:none;animation:duck-out .32s cubic-bezier(.5,0,.9,.5) both}[data-theme=monster] .board .store .monster .head.swap-in{animation:pop-in .6s cubic-bezier(.3,1.5,.5,1) .12s both}@keyframes duck-out{0%{scale:1 1;opacity:1}35%{scale:1.08 .86}to{scale:.2 .05;opacity:0}}@keyframes pop-in{0%{scale:.2 .05;rotate:0deg;opacity:0}40%{scale:1.12 .9;rotate:-5deg;opacity:1}65%{scale:.94 1.08;rotate:4deg}85%{scale:1.03 .98;rotate:-1.5deg}to{scale:1 1;rotate:0deg;opacity:1}}[data-theme=monster] .overlay.picking{background:#1111111f}[data-theme=monster] .overlay.picking .panel{box-shadow:0 18px 50px #00000040}