.icon-button{width:48px;height:48px;border:0;border-radius:16px;background:var(--paper);color:var(--ink);box-shadow:0 4px 0 #d7c8ad,0 7px 12px #735f4230;font-size:1.45rem;font-weight:900;display:grid;place-items:center;transition:transform var(--fast),box-shadow var(--fast)}
.icon-button:active,.primary-button:active,.secondary-button:active{transform:translateY(3px);box-shadow:0 1px 0 #c9a77e}
button:focus-visible{outline:4px solid #31495b;outline-offset:3px}
.sound-toggle{position:relative}.sound-off{display:none}.sound-toggle.muted .sound-on{display:none}.sound-toggle.muted .sound-off{display:block}
.segmented{display:flex;gap:7px}
.choice-button{min-height:44px;border:2px solid transparent;border-radius:14px;background:#eee7d9;color:#4d5b68;font-weight:900;padding:7px 12px;transition:transform var(--fast),background var(--fast),border var(--fast)}
.choice-button[aria-checked="true"]{background:#fff;border-color:var(--coral);color:var(--coral-dark);box-shadow:0 3px 0 #e9b8a8}
.player-options .choice-button{flex:1;min-height:66px;display:flex;align-items:center;justify-content:center;gap:10px}
.player-avatar-row{display:flex}.player-avatar-row .player-avatar{margin-left:-8px}.player-avatar-row .player-avatar:first-child{margin-left:0}
.category-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.category-button{min-height:72px;display:grid;place-items:center;gap:3px;padding:5px}
.category-preview{position:relative;width:40px;height:40px;border-radius:12px;overflow:hidden;box-shadow:0 2px 0 #d2bfa1}
.category-preview img{position:absolute;left:0;top:0;width:400%;height:200%;max-width:none;display:block}
.category-symbol{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#ffe58d,#f08fbc);color:#fff;font-size:1.32rem;line-height:1;text-shadow:0 2px 0 #8e5c7355;overflow:hidden;position:relative}
.category-name{font-size:.7rem}
.difficulty-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.difficulty-button{padding:7px 3px;min-height:54px}
.difficulty-button strong,.difficulty-button small{display:block}.difficulty-button strong{font-size:.76rem}.difficulty-button small{font-size:.62rem;color:var(--muted);margin-top:2px}
.difficulty-button:disabled{opacity:.38;cursor:not-allowed;box-shadow:none}
.primary-button,.secondary-button{min-height:52px;border:0;border-radius:17px;padding:0 22px;font-weight:950;letter-spacing:.01em;transition:transform var(--fast),box-shadow var(--fast)}
.primary-button{color:#fff;background:linear-gradient(#f17a6d,#e55e56);box-shadow:0 5px 0 var(--coral-dark),0 9px 18px #be62594d;text-shadow:0 1px 1px #93443d}
.secondary-button{color:var(--ink);background:#f2ecdf;box-shadow:0 4px 0 #cfbea4}
.start-button{justify-self:center;min-width:min(100%,260px);display:flex;align-items:center;justify-content:center;gap:20px;font-size:1.08rem}.button-arrow{font-size:1.5rem}
.compact{min-height:48px}
.brand-mascot{position:relative;width:70px;height:64px;border-radius:48% 52% 45% 45%;background:linear-gradient(145deg,#7ecfaf,#4eac89);box-shadow:inset 8px 8px 0 #ffffff2e,0 5px 0 #39866d}.brand-mascot::before,.brand-mascot::after{content:"";position:absolute;top:-5px;width:20px;height:23px;background:#62b896;border-radius:70% 20%;z-index:-1}.brand-mascot::before{left:5px;transform:rotate(-25deg)}.brand-mascot::after{right:5px;transform:scaleX(-1) rotate(-25deg)}.brand-mascot i,.brand-mascot b{position:absolute;top:23px;width:10px;height:13px;border-radius:50%;background:#26394a;border:3px solid #fff}.brand-mascot i{left:18px}.brand-mascot b{right:18px}.brand-mascot em{position:absolute;left:27px;top:43px;width:18px;height:8px;border-bottom:3px solid #225644;border-radius:50%}
.score-pill{--player:#888;min-width:170px;max-width:220px;flex:1;padding:7px 12px;border-radius:18px;background:#ffffffad;border:2px solid transparent;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;color:#586673;transition:transform var(--normal),background var(--normal),border var(--normal),box-shadow var(--normal)}
.score-pill.active{background:#fff;border-color:var(--player);transform:none;box-shadow:0 0 0 1px var(--player),0 3px 9px #29404b24}
.player-avatar{--avatar-size:42px;position:relative;display:inline-block;width:var(--avatar-size);height:var(--avatar-size);border:2px solid #fff;border-radius:50%;background-image:url("../assets/images/player-avatars.png");background-size:200% 200%;background-repeat:no-repeat;box-shadow:0 2px 0 #29404b45,0 4px 10px #29404b24;flex:0 0 auto;transform-origin:center bottom}
.player-avatar::before,.player-avatar::after,.player-avatar i{display:none}
.avatar-lion{background-position:0 0}.avatar-bull{background-position:100% 0}.avatar-panda{background-position:0 100%}.avatar-zebra{background-position:100% 100%}
.avatar-small{--avatar-size:42px}.avatar-tiny{--avatar-size:48px}.avatar-micro{--avatar-size:28px}.avatar-medium{--avatar-size:62px}.avatar-hero{--avatar-size:96px;margin:8px 14px}.pose-cheer{animation:avatar-cheer .65s var(--ease) infinite alternate}
.score-name{font-weight:950;font-size:clamp(.82rem,1.65vw,1rem);white-space:nowrap}.score-value{display:grid;place-items:center;min-width:32px;height:32px;border-radius:11px;background:#eee7d9;color:var(--ink);font-weight:950}
.scoreboard.players-2 .player-avatar{--avatar-size:52px}.scoreboard.players-3 .player-avatar{--avatar-size:46px}.scoreboard.players-4 .player-avatar{--avatar-size:40px}.scoreboard.players-4 .score-pill{min-width:0;max-width:155px;padding:5px 7px;gap:5px}.scoreboard.players-4 .score-name{font-size:.72rem}.scoreboard.players-4 .score-value{min-width:27px;height:27px}
.card{position:relative;border:0;padding:0;background:transparent;border-radius:var(--radius-sm);transform-style:preserve-3d;transition:transform var(--normal) var(--ease)}
.card.entering,.card.closing,.card.mismatching,.card:not(.matched).flipped{will-change:transform}
.card.flipped,.card.matched{transform:rotateY(180deg)}.card.flipped.closing{transform:rotateY(0deg)}.card:active:not(.matched){transform:scale(.94)}.card.flipped:active{transform:rotateY(180deg) scale(.94)}.card.flipped.closing:active{transform:rotateY(0deg)}
.card-face{position:absolute;inset:0;display:grid;place-items:center;border-radius:clamp(7px,12%,16px);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.card-back{background:linear-gradient(145deg,#4e7592,#355b77);border:clamp(2px,.35vw,5px) solid #fff8e7;box-shadow:var(--shadow-card)}
.card-back::before{content:"";width:52%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff9 0 12%,transparent 13%),conic-gradient(from 20deg,#f7cc59 0 12%,#ee7b68 0 25%,#70c4a2 0 38%,#80aadd 0 51%,#f7cc59 0 64%,#ee7b68 0 77%,#70c4a2 0 90%,#80aadd 0);box-shadow:inset 0 0 0 4px #fff8}
.card-front{transform:rotateY(180deg);background:linear-gradient(145deg,#fffdf7,#efe6d4);border:clamp(2px,.35vw,5px) solid #fff;box-shadow:var(--shadow-card);color:var(--face-color,#455d73)}
.card.matched .card-front{border-color:var(--owner);box-shadow:0 0 0 clamp(2px,.3vw,4px) var(--owner),0 4px 0 color-mix(in srgb,var(--owner) 65%,#555)}
.card.matched .card-art{opacity:.23;filter:saturate(.45)}
.owner-badge{position:absolute;right:3%;bottom:3%;opacity:0;transform:scale(.5);transition:opacity var(--normal),transform var(--normal);z-index:2}.card.matched .owner-badge{opacity:1;transform:scale(1)}
.board.dense .card-face{box-shadow:0 2px 0 #d8c8ac}.board.dense .card-back::before{box-shadow:none}.board.dense .symbol-portrait{box-shadow:inset 2px 2px #fff4}
.picture-card{position:relative;width:100%;height:100%;overflow:hidden}
.picture-card img{position:absolute;left:var(--sheet-x);top:var(--sheet-y);width:400%;height:200%;max-width:none;display:block}
.symbol-portrait{position:relative;width:78%;aspect-ratio:1;border-radius:32% 42% 35% 45%;display:grid;place-items:center;background:linear-gradient(145deg,var(--symbol-a),var(--symbol-b));box-shadow:inset 5px 5px #fff5,0 4px 0 color-mix(in srgb,var(--symbol-b) 75%,#59616c);overflow:hidden}
.symbol-portrait::before,.symbol-portrait::after,.category-symbol::before,.category-symbol::after{content:"";position:absolute;opacity:.55}.symbol-card{position:relative;z-index:2;font-size:clamp(.75rem,calc(var(--card-w)*.48),4rem);font-weight:950;line-height:1;color:#fff;text-shadow:0 3px 0 #364a5b66}
.theme-0{--symbol-a:#ff9aa1;--symbol-b:#e75f7b}.theme-1{--symbol-a:#78d9bd;--symbol-b:#3aaa8d}.theme-2{--symbol-a:#83bce8;--symbol-b:#4d87c1}.theme-3{--symbol-a:#f6cd58;--symbol-b:#dda52c}.theme-4{--symbol-a:#b29be1;--symbol-b:#8068bc}.theme-5{--symbol-a:#f3a15d;--symbol-b:#d66e3d}.theme-6{--symbol-a:#ed8fc0;--symbol-b:#c65795}.theme-7{--symbol-a:#79d1d9;--symbol-b:#3a9ca7}
.motif-stars::before{content:"✦";left:9%;top:4%;font-size:calc(var(--card-w)*.22);color:#fff}.motif-stars::after{content:"★";right:7%;bottom:4%;font-size:calc(var(--card-w)*.17);color:#fff}
.category-symbol.motif-stars::before{font-size:13px}.category-symbol.motif-stars::after{font-size:10px}
.motif-cloud::before{width:60%;height:28%;left:-12%;bottom:3%;border-radius:50%;background:#fff}.motif-cloud::after{width:45%;height:22%;right:-8%;top:8%;border-radius:50%;background:#fff}
.motif-flower::before{content:"✿";left:6%;bottom:1%;font-size:calc(var(--card-w)*.25);color:#fff}.motif-flower::after{content:"✿";right:4%;top:0;font-size:calc(var(--card-w)*.18);color:#fff}
.motif-rays::before{inset:-25%;background:repeating-conic-gradient(#fff5 0 8deg,transparent 8deg 25deg)}.category-symbol.motif-rays::before{inset:-8px}
.motif-rainbow::before{width:75%;height:48%;left:12%;bottom:-28%;border-radius:50% 50% 0 0;border:clamp(4px,calc(var(--card-w)*.08),10px) solid #fff8}
.match-celebration{position:absolute;z-index:8;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.5)}.match-celebration.show{opacity:1;animation:match-celebrate .62s var(--ease) both}.match-avatar{position:absolute;left:-23px;top:-22px;padding:7px;border-radius:50%;background:#fff;border:3px solid var(--player);box-shadow:0 5px 14px #29404b55}.match-celebration>i{position:absolute;color:#f5c84d;font-style:normal;font-size:1.3rem;text-shadow:0 2px #a97a23}.match-celebration>i:nth-of-type(1){transform:translate(-58px,-38px)}.match-celebration>i:nth-of-type(2){transform:translate(45px,-30px);color:#ef7faa}.match-celebration>i:nth-of-type(3){transform:translate(-48px,38px);color:#67c9a7}.match-celebration>i:nth-of-type(4){transform:translate(48px,35px);color:#78aee0}
.dialog-card{width:min(100%,440px);max-height:calc(var(--app-height,100dvh) - max(48px,env(safe-area-inset-top)) - max(48px,env(safe-area-inset-bottom)));overflow:auto;padding:30px;border:3px solid #fff;border-radius:30px;background:var(--paper);box-shadow:0 14px 0 #b9a383,0 26px 60px #162d3c66;text-align:center}.dialog-card h2{font-size:clamp(1.7rem,5vw,2.5rem);letter-spacing:-.04em}.dialog-card p{color:var(--muted);font-weight:700;margin:8px 0 22px}.dialog-actions{display:flex;justify-content:center;gap:12px}.dialog-actions button{flex:1}
.confirm-avatar{min-height:72px;display:grid;place-items:center;margin:0 auto 10px}.confirm-avatar .player-avatar{box-shadow:0 3px 0 #29404b45,0 7px 16px #29404b2b}
.trophy{width:76px;height:68px;margin:0 auto 13px;border-radius:18px 18px 32px 32px;background:linear-gradient(145deg,#ffe783,#eeb63c);border:5px solid #fff7cf;box-shadow:0 6px 0 #c9902e;display:grid;place-items:center;color:#fff;font-size:2.2rem}.victory-card{padding-top:24px}.victory-avatars{min-height:78px;display:flex;align-items:center;justify-content:center;gap:18px;margin:8px 0}.final-scores{display:grid;gap:7px;margin:10px 0 18px}.final-score{display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:13px;background:#f2ecdf;text-align:left}.final-score strong{margin-left:auto}.confetti{contain:layout paint}
.noscript{position:fixed;inset:20px;display:grid;place-items:center;background:white;z-index:99}
@media(max-width:620px){
 .category-grid{grid-template-columns:repeat(3,1fr);gap:5px}.category-button{min-height:58px}.category-name{font-size:.65rem}
 .difficulty-grid{grid-template-columns:repeat(3,1fr)}.difficulty-button{min-height:44px;padding:3px}
 .score-pill{min-width:0;padding:4px}.score-name{display:none}.score-pill .player-avatar{margin:auto}.score-value{min-width:23px;height:23px}
 .icon-button{width:42px;height:42px;border-radius:13px}.dialog-card{padding:22px}.dialog-actions{flex-direction:column}
}
@media(max-width:900px){.scoreboard.players-3 .score-pill{min-width:145px}.scoreboard.players-4 .score-pill{padding-inline:5px}}
@media(max-height:760px) and (min-width:621px){
 .dialog-card{padding:20px}.victory-card{padding-top:18px}.trophy{width:62px;height:56px;margin:0 auto 9px;font-size:1.8rem}
 .victory-avatars{min-height:58px;margin:3px 0}.final-scores{gap:4px;margin:6px 0 10px}.final-score{padding:5px 10px}
}