@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/bricolage-grotesque-vietnamese-wght-normal-BUzh504Q.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,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-wght-normal-CcLUaPy7.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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-wght-normal-DLoelf7F.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-ext-wght-normal-DCwSJGxG.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-wght-normal-D_ZTVpCC.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--color-bg:#fff4ea;--color-surface:#fff;--color-surface-2:#ffe2d1;--color-text:#26201c;--color-muted:#5e5148;--color-primary:#26201c;--color-on-primary:#fff;--color-accent:#2453c7;--color-success:#0e7a4d;--color-danger:#b3261e;--color-focus:#26201c;--radius-sm:6px;--radius-md:12px;--radius-lg:18px;--space-1:4px;--space-2:8px;--space-3:16px;--space-4:24px;--space-5:36px;--space-6:56px;--font-display:"Bricolage Grotesque Variable", "Arial Black", Impact, sans-serif;--font-body:"Figtree Variable", Arial, sans-serif;--shadow-1:2px 3px 0 var(--color-text);--shadow-2:5px 6px 0 var(--color-text);--duration-fast:.18s;--duration-slow:.44s}@media (prefers-reduced-motion:reduce){:root{--duration-fast:0s;--duration-slow:0s}}:root{--tone-page:#e0245e;--tone-on-page:#fff;--tone-sun:#ffd23f;--tone-soft-1:#ffc4dc;--tone-soft-2:#a6f0d9;--tone-board:#ffd9c2;--tone-line:#ffd3c0;--tone-glow:#6ef2c4;--game-observe:#ff4f98;--game-changed:#ff8a1f;--game-sequence:#22cfa8;--game-pairs:#ffd23f}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--tone-page);color:var(--tone-on-page);font-family:var(--font-body);margin:0;font-size:clamp(1rem,.94rem + .2vw,1.0625rem);line-height:1.5}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.025em;margin:0 0 var(--space-3);font-weight:800;line-height:1.02}h1{font-size:clamp(1.9rem,1.35rem + 2.2vw,3.1rem)}h2{font-size:clamp(1.3rem,1.12rem + .8vw,1.75rem)}h3{font-size:1.15em}p{margin:0 0 var(--space-3)}a{color:inherit;text-underline-offset:3px;text-decoration-thickness:2px}img{max-width:100%}:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.muted{color:var(--color-muted)}.lead{font-size:1.12em}.chip{width:fit-content;max-width:100%;padding:var(--space-1) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text);font-weight:700}.note{font-family:var(--font-display);color:var(--tone-sun);font-size:1.3rem;font-weight:800;line-height:1.15}.error{width:fit-content;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-danger);justify-self:start;font-weight:800}.error:before{content:"✕ "}.page{--gutter:clamp(var(--space-3), 4vw, var(--space-6));width:100%;max-width:80rem;padding:var(--space-4) var(--gutter) var(--space-6);margin:0 auto}.topbar{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.topbar a{align-items:center;min-height:44px;text-decoration:none;display:inline-flex}.logo{white-space:nowrap;font-family:var(--font-display);letter-spacing:-.05em;color:var(--tone-sun);font-size:2.1rem;font-weight:800;line-height:1;text-decoration:none;display:block}.logo .tilt{color:var(--tone-on-page);display:inline-block;transform:rotate(-10deg)translateY(-.06em)}.logo-xl{font-size:clamp(3rem,2.2rem + 4vw,5rem)}.code{font-family:var(--font-display);letter-spacing:.08em;white-space:nowrap;padding:var(--space-1) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface);margin:0;font-size:1.2rem;font-weight:800}.banner{z-index:4;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);padding:var(--space-2) var(--space-4);border:2px solid var(--color-text);border-radius:var(--radius-md);background:var(--tone-sun);color:var(--color-text);box-shadow:var(--shadow-1);font-weight:800;display:flex;position:sticky;top:0}.card,.banner,.how,.question,.create,.join-box,.solo-box,.demo,.game-card,.players-box,.player,.step,.code,.option,.pad-key,.segmented label,.qr,.blank,.round-points{color:var(--color-text)}.card{background:var(--color-surface);border:2px solid var(--color-text);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:clamp(var(--space-3), 3vw, var(--space-4))}.stack{gap:var(--space-3);display:grid}fieldset{margin:0 0 var(--space-4);border:0;min-width:0;padding:0}fieldset.contents{display:contents}legend{margin-bottom:var(--space-2);padding:0;font-weight:800}label{gap:var(--space-1);font-weight:700;display:grid}input{font:inherit;min-height:48px;padding:var(--space-2) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);color:var(--color-text);background:#fff}input::placeholder{color:var(--color-muted)}label.check{align-items:center;gap:var(--space-2);cursor:pointer;min-height:44px;font-weight:600;display:flex}label.check input{width:1.35rem;height:1.35rem;min-height:0;accent-color:var(--color-text)}.checks{gap:var(--space-1);margin-bottom:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));display:grid}.btn{justify-content:center;align-items:center;gap:var(--space-2);min-width:44px;min-height:48px;padding:var(--space-2) var(--space-4);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-1);font:inherit;cursor:pointer;transition:transform var(--duration-fast) cubic-bezier(.34, 1.56, .64, 1), box-shadow var(--duration-fast);font-weight:800;text-decoration:none;display:inline-flex}.btn.primary{background:var(--color-primary);color:var(--color-on-primary)}.btn[aria-pressed=true]{background:var(--tone-sun);color:var(--color-text)}.btn[aria-pressed=true]:before{content:"✓"}.btn.big{width:100%;min-height:60px;padding-inline:var(--space-5);font-size:1.12em}.btn.small{min-height:44px;padding:var(--space-1) var(--space-3);font-size:.92em}.btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.btn.primary:disabled{opacity:1;background:var(--color-surface);color:var(--color-muted)}.btn:active:not(:disabled){box-shadow:none;transform:translate(2px,3px)}.tag{margin-left:var(--space-2);padding:0 var(--space-2);border:1.5px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface);vertical-align:.1em;font-size:.78em;font-weight:800;display:inline-block}.face.illustration{width:min(40%,9rem);margin:0 auto var(--space-3);border:3px solid var(--color-text);box-shadow:var(--shadow-2);display:block;transform:rotate(-4deg)}.face.illustration--small{width:2.75rem;box-shadow:none;border-width:2px;margin:0;transform:rotate(-6deg)}.face.illustration--wide{width:min(40%,10rem)}.home-top{gap:var(--space-4);margin-bottom:var(--space-5);grid-template-columns:minmax(0,1fr);display:grid}.home-box{gap:var(--space-2);grid-template-columns:minmax(0,1fr);min-width:0;display:grid;position:relative}.home-box>.logo{margin-bottom:var(--space-2)}.home-box h1{margin:0;font-size:clamp(2.2rem,1.5rem + 2.6vw,3.4rem)}.home-box .note{margin:0}.home-box .lead{margin:var(--space-1) 0 0}.facts{gap:var(--space-2) var(--space-3);margin:var(--space-2) 0 var(--space-3);flex-wrap:wrap;padding:0;list-style:none;display:flex}.facts li{padding:var(--space-2) var(--space-4);background:var(--color-bg);color:var(--color-text);font-size:.95em;font-weight:800;-webkit-mask:radial-gradient(7px at 0,#0000 98%,#000) 0/51% 100% no-repeat,radial-gradient(7px at 100%,#0000 98%,#000) 100%/51% 100% no-repeat;mask:radial-gradient(7px at 0,#0000 98%,#000) 0/51% 100% no-repeat,radial-gradient(7px at 100%,#0000 98%,#000) 100%/51% 100% no-repeat}.facts li:nth-child(odd){transform:rotate(-2deg)}.facts li:nth-child(2n){transform:rotate(1.5deg)}.create{background:var(--tone-sun);border:3px solid var(--color-text);border-radius:var(--radius-sm);box-shadow:var(--shadow-2);position:relative;transform:rotate(-1.2deg)}.create h2{margin-bottom:var(--space-2);font-size:1.15rem}.create label{color:var(--color-text)}.create .arrow{right:clamp(var(--space-3), 6vw, var(--space-5));width:5.5rem;height:auto;color:var(--color-text);pointer-events:none;margin-top:-.6rem;position:absolute}.create form>fieldset>.btn.primary{margin-top:var(--space-3)}.home-alt{gap:var(--space-3);margin-top:var(--space-2);grid-template-columns:minmax(0,1fr);display:grid}.join-box,.solo-box{padding:var(--space-3);border:3px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);box-shadow:var(--shadow-1)}.join-box{transform:rotate(1deg)}.solo-box{background:var(--tone-soft-2);transform:rotate(-.8deg)}.join-box h2,.solo-box h2{margin-bottom:var(--space-2);font-size:1.1rem}.solo-box p{margin-bottom:var(--space-2)}.join-code{gap:var(--space-2);display:flex}.join-code input{text-transform:uppercase;letter-spacing:.06em;flex:1;min-width:0;font-weight:700}.join-code input::placeholder{text-transform:none;letter-spacing:0;font-weight:400}.card-fan{height:clamp(12rem,9rem + 12vw,19rem);margin:var(--space-2) 0;display:none;position:relative}.card-fan .face{border:3px solid var(--color-text);width:31%;max-width:13rem;box-shadow:var(--shadow-2);position:absolute;top:8%;left:50%}.card-fan .face:first-child{animation:3s ease-in-out infinite fan-left;top:16%;transform:translate(-138%)rotate(-11deg)}.card-fan .face:nth-child(2){z-index:1;animation:1.8s ease-in-out infinite fan-mid;transform:translate(-50%)rotate(-2deg)}.card-fan .face:nth-child(3){animation:3.4s ease-in-out infinite fan-right;top:16%;transform:translate(38%)rotate(11deg)}@keyframes fan-mid{50%{transform:translate(-50%)rotate(4deg)translateY(-8%)}}@keyframes fan-left{50%{transform:translate(-138%)rotate(-16deg)}}@keyframes fan-right{50%{transform:translate(38%)rotate(16deg)}}.face{aspect-ratio:1;border-radius:var(--radius-md);background:var(--color-surface);width:100%;height:auto;display:block}.cover{aspect-ratio:3/2;border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);place-items:center;width:100%;padding:6%;display:grid;overflow:hidden}.cover-cards{justify-content:center;align-items:center;gap:4%;width:100%;display:flex}.cover-cards .face{border:2px solid var(--color-text);width:30%;box-shadow:2px 3px 0 var(--color-text)}.cover-cards .face:nth-child(odd){transform:rotate(-4deg)}.cover-cards .face:nth-child(2n){transform:rotate(4deg)translateY(-6%)}.cover-grid{grid-template-columns:repeat(3,1fr);gap:4%;width:62%;display:grid}.cover-grid .face{border:2px solid var(--color-text);border-radius:var(--radius-sm);width:100%}.cover-two{justify-content:center;align-items:center;gap:5%;width:100%;display:flex}.cover-two .cover-grid{grid-template-columns:repeat(2,1fr);width:38%}.cover-two .face.changed{box-shadow:0 0 0 3px var(--tone-page)}.cover-arrow{font-family:var(--font-display);font-size:1.6rem;font-weight:800}.cover-cards .back-face{aspect-ratio:1;border:2px solid var(--color-text);border-radius:var(--radius-md);width:30%;box-shadow:2px 3px 0 var(--color-text);place-items:center;padding:0;display:grid}.cover--page{margin-bottom:var(--space-4);border-radius:var(--radius-md)}.join-card{gap:var(--space-2);background:var(--color-bg);width:100%;max-width:34rem;box-shadow:var(--shadow-2);border-width:3px;margin:0 auto;display:grid;rotate:-.6deg}.join-card>h1,.join-card>.lead,.join-card>.code{text-align:center;justify-self:center;margin:0}.join-card>.lead{margin-bottom:var(--space-2)}.join-fan{aspect-ratio:2.6;width:100%;max-height:11rem;margin-bottom:var(--space-2);position:relative}.join-fan .face{border:3px solid var(--color-text);width:min(30%,8.5rem);box-shadow:var(--shadow-2);position:absolute;top:8%;left:50%}.join-fan .face:first-child{top:16%;transform:translate(-138%)rotate(-11deg)}.join-fan .face:nth-child(2){z-index:1;animation:1.8s ease-in-out infinite fan-mid;transform:translate(-50%)rotate(-2deg)}.join-fan .face:nth-child(3){top:16%;transform:translate(38%)rotate(11deg)}.play-now{gap:var(--space-1);margin-top:var(--space-2);justify-items:start;display:grid}.play-now .btn{box-shadow:4px 5px 0 var(--tone-sun)}.play-now p{margin:0;font-size:.92em;font-weight:700}.home-actions{gap:var(--space-3);min-width:0;display:grid}.demo-next{gap:var(--space-2);flex-wrap:wrap;display:flex}.demo{align-content:start;gap:var(--space-3);padding:clamp(var(--space-3), 3vw, var(--space-4));border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);box-shadow:var(--shadow-2);min-width:0;display:grid;transform:rotate(.8deg)}.demo h2{margin:0}.demo-board{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(6px,1.2vw,12px);width:min(100%,26rem);margin-inline:auto;display:grid}.demo-card{aspect-ratio:1;border:2px solid var(--color-text);border-radius:var(--radius-md);cursor:pointer;min-width:44px;min-height:44px;font:inherit;color:inherit;transition:transform var(--duration-slow) cubic-bezier(.34, 1.56, .64, 1);place-items:center;padding:14%;display:grid;position:relative}.demo-card.down{background:var(--tone-sun) repeating-linear-gradient(-45deg, #ffffff80 0 6px, transparent 6px 14px)}.demo-card.up,.demo-card.found{background:var(--color-surface);animation:flip var(--duration-slow) both;padding:0;overflow:hidden}.demo-card.found{box-shadow:0 0 0 3px var(--tone-glow), 0 0 0 6px var(--color-success);border-radius:var(--radius-sm)}.demo-card.found:after{content:"✓";border:2px solid var(--color-surface);background:var(--color-success);width:26px;height:26px;color:var(--color-surface);border-radius:50%;place-items:center;font-size:15px;font-weight:800;display:grid;position:absolute;bottom:-8px;right:-8px}.demo-card.cheer{animation:.52s cubic-bezier(.34,1.56,.64,1) both bounce}.demo-card[aria-disabled=true]{cursor:default}.demo-foot{justify-content:space-between;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.demo-status{margin:0;font-weight:700}.demo .btn{box-shadow:none}.card-back{border:2px solid var(--color-text);background:var(--tone-page);color:var(--tone-on-page);font-family:var(--font-display);border-radius:50%;place-items:center;font-weight:800;line-height:1;display:grid;position:absolute;inset:24%;container-type:size}.card-back:after{content:"m";padding-bottom:.12em;font-size:62cqh}.games{margin-bottom:var(--space-5)}.game-cards{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));margin:0;padding:0;list-style:none;display:grid}.game-cards li{display:flex}.game-card{gap:var(--space-2);padding:var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-md);color:var(--color-text);box-shadow:var(--shadow-1);transition:transform var(--duration-fast) cubic-bezier(.34, 1.56, .64, 1), box-shadow var(--duration-fast);flex:1;grid-template-rows:auto auto 1fr auto;text-decoration:none;display:grid}.game-card h3{margin:var(--space-1) 0 0;font-size:1.2rem}.game-card p{margin:0}.game-observe{background:var(--game-observe)}.game-changed{background:var(--game-changed)}.game-sequence{background:var(--game-sequence)}.game-pairs{background:var(--game-pairs)}.game-go{min-height:44px;padding:0 var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-text);color:var(--color-surface);justify-self:start;align-items:center;font-weight:800;display:inline-flex}.how{margin-bottom:var(--space-5);padding:clamp(var(--space-3), 3vw, var(--space-4));border:2px solid var(--color-text);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-1)}.how h2{white-space:nowrap}.how-steps{counter-reset:step;gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.how-steps li{counter-increment:step;column-gap:var(--space-3);grid-template-columns:auto 1fr;align-items:start;display:grid}.how-steps li:before{content:counter(step);border:2px solid var(--color-text);background:var(--color-primary);width:2.6rem;height:2.6rem;color:var(--color-on-primary);font-family:var(--font-display);border-radius:50%;grid-row:span 2;place-items:center;font-size:1.2rem;font-weight:800;display:grid}.how-steps strong{font-family:var(--font-display);font-size:1.1rem}.layout-split{gap:var(--space-4);display:grid}.layout-main,.layout-side{gap:var(--space-4);align-content:start;min-width:0;display:grid}.players{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}.player{align-items:center;gap:var(--space-2);min-height:52px;padding:var(--space-1) var(--space-3) var(--space-1) var(--space-2);border:1.5px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface-2);display:flex}.player .rank{font-family:var(--font-display);font-weight:800}.player.me{background:var(--color-surface);box-shadow:inset 0 0 0 2px var(--color-primary)}.avatar{background:var(--color-accent);width:2.25rem;height:2.25rem;color:var(--color-surface);font-family:var(--font-display);border-radius:50%;flex:none;place-items:center;font-weight:800;display:grid}.player .name{overflow-wrap:anywhere;flex:1;min-width:0;font-weight:700}.player.absent{opacity:.6}.score{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:1.15em;font-weight:800}.lobby{gap:var(--space-4);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}.share-actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.share-body{gap:var(--space-4);align-items:center;display:grid}.share .link{overflow-wrap:anywhere;font-weight:700}.share .code{margin-bottom:var(--space-2);font-size:1.5rem;display:inline-block}.qr{width:min(100%,12.5rem);height:auto;padding:var(--space-2);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:#fff;justify-self:center}.segmented{gap:var(--space-2);flex-wrap:wrap;display:flex}.segmented label{justify-content:center;align-items:center;gap:var(--space-1);min-width:48px;min-height:48px;padding:0 var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface);box-shadow:var(--shadow-1);cursor:pointer;font-weight:700;display:inline-flex;position:relative}.segmented label.on{background:var(--tone-sun);color:var(--color-text)}.segmented label.on:before{content:"✓"}.segmented input{opacity:0;width:1px;height:1px;position:absolute}.segmented label:has(input:focus-visible){outline:3px solid var(--color-focus);outline-offset:3px}.round-head{align-items:end;gap:var(--space-2) var(--space-3);margin-bottom:var(--space-4);grid-template-columns:1fr auto;display:grid}.round-head h1{grid-column:1;margin:0}.round-head .round-count{padding:var(--space-1) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--tone-sun);color:var(--color-text);grid-area:1/2;justify-self:end;margin:0;font-weight:800}.round-head .timer{grid-column:1/-1}.round-tip{width:fit-content;max-width:100%;margin:calc(-1 * var(--space-2)) 0 var(--space-3);padding:var(--space-2) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text);box-shadow:var(--shadow-1);font-weight:600;line-height:1.35;rotate:-.6deg}.round-tip strong{font-family:var(--font-display);font-weight:800}.timer{align-items:center;gap:var(--space-3);display:flex}.timer-track{border:2px solid var(--color-text);background:var(--color-surface);border-radius:999px;flex:1;height:.9rem;overflow:hidden}.timer-bar{background:var(--color-accent);transform-origin:0;height:100%}.timer-bar[data-low=true]{background:var(--color-danger) repeating-linear-gradient(135deg, #ffffff40 0 4px, transparent 4px 9px)}.timer-num{font-family:var(--font-display);font-variant-numeric:tabular-nums;text-align:right;min-width:2.2ch;font-size:1.3rem;font-weight:800}.grid-view,.board{grid-template-columns:repeat(var(--cols), minmax(0, 1fr));gap:clamp(4px, 1vw, var(--space-2));width:min(100%, calc(62vh * var(--cols) / var(--rows)));margin:0 auto var(--space-4);padding:0;list-style:none;display:grid}.board{box-sizing:content-box;width:min(calc(100% - 2 * clamp(8px, 2vw, 16px) - 4px), calc(62vh * var(--cols) / var(--rows)));border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-bg);box-shadow:var(--shadow-2);padding:clamp(8px,2vw,16px)}.cell-static,.cell,.card-tile{aspect-ratio:1;border:2px solid var(--color-text);border-radius:var(--radius-md);background:var(--color-surface);min-width:0;color:var(--color-text);font:inherit;place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.cell,.card-tile,.option,.pad-key{cursor:pointer;transition:transform var(--duration-fast) cubic-bezier(.34, 1.56, .64, 1), box-shadow var(--duration-fast)}.icon{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block}.icon-text{text-align:center;overflow-wrap:anywhere;place-items:center;font-size:.8em;display:grid}.mark-badge{z-index:1;border:2px solid var(--color-text);background:var(--color-surface);border-radius:50%;place-items:center;width:24px;height:24px;font-size:14px;font-weight:800;line-height:1;display:grid;position:absolute;top:4px;right:4px}.cell[data-mark=selected]{box-shadow:var(--shadow-1);transform:translateY(-3px)}.cell[data-mark=selected]:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 5px var(--tone-sun), inset 0 0 0 7px var(--color-text);pointer-events:none;position:absolute;inset:0}.cell[data-mark=selected] .mark-badge{background:var(--tone-sun);color:var(--color-text)}[data-mark=hit]{border:3px solid var(--color-success)}[data-mark=hit] .mark-badge{background:var(--color-success);color:var(--color-surface)}[data-mark=miss]{border:3px dashed var(--color-danger)}[data-mark=miss] .mark-badge{background:var(--color-danger);color:var(--color-surface)}[data-mark=added]{border:3px solid var(--color-accent)}[data-mark=removed]{border:3px dashed var(--color-accent)}[data-mark=replaced]{border:4px double var(--color-accent)}.card-tile{background:var(--tone-sun) repeating-linear-gradient(-45deg, #ffffff80 0 6px, transparent 6px 14px);padding:14%}.card-tile.up{background:var(--color-surface);animation:flip var(--duration-slow) both;padding:0}.card-tile.matched{box-shadow:0 0 0 3px var(--color-success);animation:.52s cubic-bezier(.34,1.56,.64,1) both bounce}.card-tile.matched:after{content:"✓";border:2px solid var(--color-surface);background:var(--color-success);width:24px;height:24px;color:var(--color-surface);border-radius:50%;place-items:center;font-size:14px;font-weight:800;display:grid;position:absolute;bottom:-6px;right:-6px}.blank{aspect-ratio:1;border:2px dashed var(--color-text);border-radius:var(--radius-md);background:var(--color-surface-2);width:min(100%,62vh);margin:0 auto}.pairs-play>[role=status]{padding:var(--space-1) var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--tone-sun);color:var(--color-text);font-weight:800;display:inline-block}.question{margin-bottom:var(--space-4);padding:var(--space-3);border:2px solid var(--color-text);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-1)}.question legend{float:left;width:100%;margin-bottom:var(--space-3);font-family:var(--font-display);font-size:1.2rem;font-weight:800}.options{clear:both;gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.option{justify-content:center;align-items:center;gap:var(--space-1);min-height:64px;padding:var(--space-2);border:2px solid var(--color-text);border-radius:var(--radius-sm);background:var(--color-surface-2);color:inherit;font:inherit;flex-direction:column;font-weight:700;display:flex;position:relative}.option[aria-pressed=true]{background:var(--tone-sun);color:var(--color-text)}.option[aria-pressed=true]:after{content:"✓";font-weight:800;position:absolute;top:4px;right:8px}.option .icon{border:2px solid var(--color-text);border-radius:var(--radius-sm);width:3.5rem;height:3.5rem}.option-number{font-family:var(--font-display);font-size:1.6em;font-weight:800}.sequence-item{aspect-ratio:1;width:min(60vw,14rem);margin:0 auto var(--space-3);border:3px solid var(--color-text);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-2);animation:pop var(--duration-slow) both;place-items:center;padding:0;display:grid;overflow:hidden}.sequence-row{gap:var(--space-1);margin:0 0 var(--space-3);flex-wrap:wrap;min-height:2.75rem;padding:0;list-style:none;display:flex}.sequence-row li{border:2px solid var(--color-text);background:var(--color-surface);border-radius:8px;width:2.75rem;height:2.75rem;overflow:hidden}.pad{gap:var(--space-2);margin:var(--space-3) 0;grid-template-columns:repeat(auto-fill,minmax(4.25rem,1fr));max-width:34rem;display:grid}.pad-key{aspect-ratio:1;border:2px solid var(--color-text);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-1);padding:0;overflow:hidden}.pad-key:active:not(:disabled){box-shadow:none;transform:translate(2px,3px)}.pad-key:disabled{opacity:.5;cursor:not-allowed}.round-points{border-collapse:collapse;width:100%}.round-points th,.round-points td{text-align:left;padding:var(--space-2);border-bottom:1px solid var(--tone-line)}.round-points thead th{color:var(--color-muted);border-bottom:2px solid var(--color-text);font-size:.9em}.round-points td{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:800}.two-grids{gap:var(--space-4);display:grid}figure{margin:0}figcaption{margin-bottom:var(--space-2);font-weight:800}.reveal-answers{padding-left:var(--space-5)}.reveal-answers .answer{align-items:center;gap:var(--space-2);font-weight:700;display:flex}.reveal-answers .icon{border:2px solid var(--color-text);border-radius:8px;width:2.75rem;height:2.75rem}.reveal-answers li{margin-bottom:var(--space-3)}.reveal-answers li p{margin:0 0 var(--space-1)}.pick{align-items:center;gap:var(--space-1) var(--space-2);width:fit-content;padding:2px var(--space-3) 2px 2px;background:var(--color-surface);border-radius:999px;flex-wrap:wrap;font-weight:700;display:inline-flex}.pick[data-mark=hit]{border:2px solid var(--color-success)}.pick[data-mark=miss]{border:2px dashed var(--color-danger)}.pick-badge{width:1.6rem;height:1.6rem;color:var(--color-surface);border-radius:50%;place-items:center;font-size:.9em;font-weight:800;display:grid}.pick[data-mark=hit] .pick-badge{background:var(--color-success)}.pick[data-mark=miss] .pick-badge{background:var(--color-danger)}.reveal-answers .pick .icon{border-radius:6px;width:2rem;height:2rem}.pick-summary{margin:0 0 var(--space-3);font-family:var(--font-display);font-size:1.15rem;font-weight:800}.reveal-me{padding:var(--space-2) var(--space-4);border:3px solid var(--color-text);border-radius:var(--radius-sm);background:var(--tone-sun);color:var(--color-text);box-shadow:var(--shadow-2);font-family:var(--font-display);font-variant-numeric:tabular-nums;animation:pop var(--duration-slow) both;justify-self:start;margin:0;font-size:clamp(1.35rem,1.15rem + 1vw,1.9rem);font-weight:800;line-height:1.1;rotate:-1.5deg}.score-big{font-family:var(--font-display);animation:pop var(--duration-slow) both;font-size:clamp(2rem,1.5rem + 2vw,3.2rem);font-weight:800}.solo-done{width:100%;max-width:40rem;padding:clamp(var(--space-4), 4vw, var(--space-5));box-shadow:var(--shadow-2);text-align:center;border-width:3px;margin:0 auto;position:relative;rotate:-.4deg}.solo-done h1,.done-total{z-index:1;position:relative}.solo-done h1{margin:0;font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem)}.done-total{margin:var(--space-2) 0 var(--space-4);font-family:var(--font-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:clamp(3rem,2.2rem + 4vw,4.75rem);font-weight:800;line-height:1}.done-list{gap:var(--space-2);text-align:left;margin:0;padding:0;list-style:none;display:grid}.done-row{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3) var(--space-2) var(--space-2);border:2px solid var(--color-text);border-left:12px solid var(--game);border-radius:var(--radius-sm);background:var(--color-surface);grid-template-columns:auto minmax(0,1fr) auto;display:grid}.done-face{border:2px solid var(--color-text);border-radius:var(--radius-sm);width:3rem;rotate:-5deg}.done-row:nth-child(2n) .done-face{rotate:5deg}.done-name{align-items:center;gap:var(--space-1) var(--space-2);flex-wrap:wrap;font-weight:800;display:flex}.ribbon{padding:1px var(--space-2);border:2px solid var(--color-text);background:var(--tone-sun);box-shadow:2px 2px 0 var(--color-text);font-family:var(--font-display);white-space:nowrap;border-radius:3px;font-size:.82em;display:inline-block;rotate:-4deg}.done-actions{gap:var(--space-3);margin-top:var(--space-5);justify-items:center;display:grid}.done-actions .btn.big{width:100%}.text-link{align-items:center;min-height:44px;font-weight:700;display:inline-flex}.done-burst{z-index:0;pointer-events:none;background:radial-gradient(circle, var(--game-observe) 0 6px, transparent 7px) 8% 0% / 16px 16px no-repeat, radial-gradient(circle, var(--game-sequence) 0 5px, transparent 6px) 22% 4% / 14px 14px no-repeat, radial-gradient(circle, var(--color-text) 0 3px, transparent 4px) 36% 0% / 10px 10px no-repeat, radial-gradient(circle, var(--game-pairs) 0 6px, transparent 7px) 50% 2% / 16px 16px no-repeat, radial-gradient(circle, var(--game-observe) 0 4px, transparent 5px) 64% 0% / 12px 12px no-repeat, radial-gradient(circle, var(--game-changed) 0 6px, transparent 7px) 79% 4% / 16px 16px no-repeat, radial-gradient(circle, var(--game-pairs) 0 5px, transparent 6px) 93% 0% / 14px 14px no-repeat, radial-gradient(circle, var(--game-changed) 0 5px, transparent 6px) 0% 30% / 14px 14px no-repeat, radial-gradient(circle, var(--game-pairs) 0 6px, transparent 7px) 2% 62% / 16px 16px no-repeat, radial-gradient(circle, var(--color-text) 0 3px, transparent 4px) 0% 90% / 10px 10px no-repeat, radial-gradient(circle, var(--game-sequence) 0 6px, transparent 7px) 100% 28% / 16px 16px no-repeat, radial-gradient(circle, var(--game-observe) 0 5px, transparent 6px) 98% 60% / 14px 14px no-repeat, radial-gradient(circle, var(--color-text) 0 3px, transparent 4px) 100% 92% / 10px 10px no-repeat;height:12rem;animation:.9s cubic-bezier(.34,1.56,.64,1) both confetti;position:absolute;inset:-1.25rem -.75rem auto}@keyframes confetti{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:none}}.podium{align-items:end;gap:var(--space-2);margin:0 0 var(--space-4);text-align:center;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;list-style:none;display:grid}.step{gap:var(--space-1);padding:var(--space-3) var(--space-2);border:2px solid var(--color-text);border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:var(--color-surface-2);overflow-wrap:anywhere;animation:rise var(--duration-slow) cubic-bezier(.34, 1.56, .64, 1) both;align-content:end;display:grid}.step.p1{background:var(--tone-sun);min-height:10rem;color:var(--color-text);animation-delay:.24s;rotate:-2deg}.step.me{border-width:4px}.step .tag.you{background:var(--color-text);color:var(--color-surface);justify-self:center;margin:0}.podium-card>.btn.big{width:100%}.podium-wait{color:var(--color-muted);margin:0;font-weight:700}.step.p2{background:var(--color-accent);min-height:7.5rem;color:var(--color-surface);animation-delay:.12s}.step.p3{background:var(--tone-sun);min-height:5.5rem;color:var(--color-text)}.step .place{font-family:var(--font-display);font-size:1.8em;font-weight:800}.problem-card{justify-items:start;gap:var(--space-2);display:grid}.problem-card .illustration{justify-self:center}footer{justify-content:center;gap:var(--space-4);margin-top:var(--space-6);flex-wrap:wrap;display:flex}footer a{align-items:center;min-height:44px;font-weight:700;display:inline-flex}@keyframes pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes flip{0%{transform:rotateY(90deg)}to{transform:rotateY(0)}}@keyframes bounce{0%{transform:scale(1)}40%{transform:scale(1.1)translateY(-4px)}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translateY(1.5rem)}to{opacity:1;transform:none}}.legal-list,.info-page ol{padding-left:var(--space-5)}.facts-list div{gap:var(--space-1);margin-bottom:var(--space-3);display:grid}.facts-list dt{font-weight:800}.facts-list dd{margin:0}.table-wrap{overflow-x:auto}.table-wrap table{border-collapse:collapse;width:100%}.table-wrap th,.table-wrap td{text-align:left;vertical-align:top;padding:var(--space-2);border-bottom:1px solid var(--tone-line)}.info-page section{margin-top:var(--space-5)}.info-page nav li a,.game-page~nav li a{align-items:center;min-height:44px;display:inline-flex}[data-game=observe],.game-observe{--game:var(--game-observe)}[data-game=changed],.game-changed{--game:var(--game-changed)}[data-game=sequence],.game-sequence{--game:var(--game-sequence)}[data-game=pairs],.game-pairs{--game:var(--game-pairs)}.round .round-head .round-count{background:var(--game,var(--tone-sun))}.round .timer-bar{background:var(--game,var(--color-accent))}.round .timer-bar[data-low=true]{background:var(--color-danger) repeating-linear-gradient(135deg, #ffffff40 0 4px, transparent 4px 9px)}.round-head h1{-webkit-text-decoration:underline .18em var(--game,transparent);text-decoration:underline .18em var(--game,transparent);text-underline-offset:.12em;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}.game-page .cover{border:4px solid var(--game)}.game-page h1{-webkit-text-decoration:underline .18em var(--game);text-decoration:underline .18em var(--game);text-underline-offset:.12em;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}.game-card .cover{border-color:var(--color-text)}.player:nth-child(4n+1) .avatar,.how-steps li:nth-child(4n+1):before{background:var(--game-observe);color:var(--color-text)}.player:nth-child(4n+2) .avatar,.how-steps li:nth-child(4n+2):before{background:var(--game-changed);color:var(--color-text)}.player:nth-child(4n+3) .avatar,.how-steps li:nth-child(4n+3):before{background:var(--game-sequence);color:var(--color-text)}.player:nth-child(4n+4) .avatar{background:var(--game-pairs);color:var(--color-text)}.card-tile.matched:before,.demo-card.cheer:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle, var(--game-observe) 0 3px, transparent 4px) 10% 20% / 30% 30% no-repeat, radial-gradient(circle, var(--game-changed) 0 3px, transparent 4px) 85% 15% / 30% 30% no-repeat, radial-gradient(circle, var(--game-sequence) 0 3px, transparent 4px) 15% 85% / 30% 30% no-repeat, radial-gradient(circle, var(--game-pairs) 0 4px, transparent 5px) 90% 80% / 30% 30% no-repeat;border-radius:50%;animation:.7s ease-out both burst;position:absolute;inset:-18%}.step.p2{background:var(--game-changed);color:var(--color-text)}.step.p3{background:var(--game-sequence);color:var(--color-text)}.podium{background:radial-gradient(circle, var(--game-observe) 0 3px, transparent 4px) 0 0 / 2.6rem 2.2rem, radial-gradient(circle, var(--game-pairs) 0 3px, transparent 4px) 1.3rem 1.1rem / 2.6rem 2.2rem;padding-top:var(--space-4)}@keyframes burst{0%{opacity:0;transform:scale(.4)}60%{opacity:1}to{opacity:0;transform:scale(1.15)}}@media (hover:hover){.btn:not(:disabled):hover,.game-card:hover{box-shadow:var(--shadow-2);transform:translate(-1px,-2px)}.cell:hover,.card-tile:not([aria-disabled=true]):hover,.option:hover,.pad-key:not(:disabled):hover,.segmented label:hover,.demo-card.down:hover{box-shadow:var(--shadow-1);transform:translateY(-2px)}}.game-card:focus-visible{box-shadow:var(--shadow-2);transform:translate(-1px,-2px)}@media (width<=29.99rem){.create{padding:var(--space-3) var(--space-2)}.topbar .code{padding:2px var(--space-2);letter-spacing:.04em;font-size:1rem}}@media (width<=47.99rem){.room-top .lang-switch{display:none}.round-head{z-index:3;align-items:center;gap:var(--space-1) var(--space-2);margin:calc(-1 * var(--space-2)) calc(-1 * var(--gutter)) var(--space-3);padding:var(--space-2) var(--gutter);background:var(--tone-page);position:sticky;top:0}.round-head h1{font-size:1.4rem}.round-head .round-count{padding:2px var(--space-2);font-size:.88em}.round-head .timer-track{height:.75rem}.round-head .timer-num{font-size:1.1rem}}@media (width>=48rem){.home-alt{grid-template-columns:repeat(2,minmax(0,1fr))}.how-steps{grid-template-columns:repeat(3,minmax(0,1fr))}.options{grid-template-columns:repeat(4,minmax(0,1fr))}.share-body{grid-template-columns:minmax(0,1fr) auto}.two-grids{grid-template-columns:repeat(2,minmax(0,1fr))}.btn.big{width:auto}.create .btn.big{width:100%}}@media (width>=72rem){.home-top{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-areas:"box fan""actions demo";align-items:start}.home-box{grid-area:box}.card-fan{grid-area:fan;height:17rem;margin:0;display:block}.home-top>.demo{grid-area:demo}.home-actions{grid-area:actions}.home-top>.demo{padding:var(--space-3);gap:var(--space-2);grid-area:demo}.home-top>.demo h2{font-size:1.25rem}.home-top .demo-board{width:min(100%,19rem)}.home-box h1{font-size:2.3rem}.home-box .logo-xl{height:4.25rem}.game-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.layout-split{grid-template-columns:minmax(0,1fr) minmax(18rem,24rem);align-items:start}.layout-side{top:var(--space-4);position:sticky}.lobby{grid-template-rows:auto auto auto 1fr;grid-template-columns:minmax(0,1fr) minmax(18rem,24rem);row-gap:0}.lobby>*{margin-bottom:var(--space-4);grid-column:1}.lobby>.lobby-side{top:var(--space-4);grid-area:1/2/span 4;position:sticky}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.lang-switch{align-items:center;gap:2px;display:inline-flex}.lang-switch a{min-width:44px;min-height:44px;padding:0 var(--space-2);border:2px solid #0000;border-radius:999px;justify-content:center;align-items:center;font-weight:800;text-decoration:none;display:inline-flex}.lang-switch a[aria-current=true]{background:var(--tone-sun);border-color:var(--color-text);color:var(--color-text)}@media (hover:hover){.lang-switch a:not([aria-current=true]):hover{border-color:currentColor}}
