*,*:before,*:after{box-sizing:border-box}*{margin:0}:root{color:#2b2519;background:#f8d265;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}body{min-width:320px;min-height:100dvh;overflow-x:hidden;touch-action:pan-y;background:linear-gradient(115deg,rgba(255,255,255,.55) 0 18%,transparent 18% 100%),repeating-linear-gradient(135deg,transparent 0 34px,rgba(43,37,25,.08) 34px 52px),linear-gradient(180deg,#ffd866,#ffb638 48%,#b9793c)}button,input{font:inherit}button{border:0}button:disabled{cursor:not-allowed;opacity:.48}#root{min-height:100dvh;overflow-x:hidden}.screen{width:min(1180px,100%);min-height:100dvh;margin:0 auto;padding:clamp(14px,3.5vw,30px)}.home-screen,.setup-screen,.end-screen{display:grid;align-items:center}.setup-screen{align-items:start;padding-block:clamp(18px,4vw,42px) clamp(56px,12vh,110px)}.hero,.panel{width:min(720px,100%);margin:0 auto;border:5px solid #2c261a;border-radius:8px;background:linear-gradient(#fff7db,#fff2bf),repeating-linear-gradient(45deg,#2c261a 0,#2c261a 18px,#ffc529 18px,#ffc529 36px);box-shadow:0 14px #6d4b2d,0 24px 35px #2b251938}.hero{padding:clamp(24px,7vw,54px);text-align:center}.machine-parade{display:flex;align-items:flex-end;justify-content:center;gap:clamp(8px,3vw,18px);margin-bottom:20px;line-height:1}.machine-parade img{width:clamp(88px,15vw,150px);height:clamp(88px,15vw,150px);object-fit:contain}.machine-parade img:nth-child(2){transform:translateY(-8px) rotate(4deg)}.machine-parade img:nth-child(3){transform:rotate(-5deg)}.badge{display:inline-flex;min-height:34px;align-items:center;justify-content:center;gap:8px;border:3px solid #2c261a;border-radius:999px;padding:4px 12px;color:#2c261a;background:#ffef8a;font-size:.9rem;font-weight:900}h1{margin-top:10px;color:#2c261a;font-size:clamp(2.35rem,9vw,5.1rem);line-height:.95;letter-spacing:0}h2{color:#2c261a;font-size:clamp(1.25rem,4vw,1.75rem)}.hero p{margin-top:14px;color:#5e4328;font-size:clamp(1.15rem,3vw,1.45rem);font-weight:800}.button-row,.game-actions,.button-stack{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:24px}.button-stack{display:grid}.button{display:inline-flex;min-height:56px;align-items:center;justify-content:center;gap:8px;border:4px solid #2c261a;border-radius:8px;padding:0 20px;cursor:pointer;color:#2c261a;font-size:clamp(1rem,3vw,1.2rem);font-weight:950;transition:transform .14s ease,box-shadow .14s ease}.button:active,.icon-button:active,.stepper button:active,.grid-option:active,.match-card:active{transform:translateY(2px)}.button-primary{background:#ff9f1c;box-shadow:0 7px #9d5714}.button-secondary{background:#2ec4b6;box-shadow:0 7px #147169}.button-quiet{background:#fff7db;box-shadow:0 7px #a77b42}.wide{width:100%}.setup-panel,.end-panel{padding:clamp(18px,5vw,34px)}.icon-button{display:inline-grid;width:52px;aspect-ratio:1;place-items:center;border:4px solid #2c261a;border-radius:8px;color:#2c261a;background:#fff7db;box-shadow:0 5px #9d5714;cursor:pointer}.screen-heading{margin:16px 0 24px;text-align:center}.screen-heading h1,.game-topbar h1,.end-panel h1{font-size:clamp(2rem,7vw,3.4rem)}.setup-section{margin-top:20px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.stepper{display:flex;align-items:center;overflow:hidden;border:4px solid #2c261a;border-radius:8px;background:#fff7db}.stepper button{display:grid;width:46px;aspect-ratio:1;place-items:center;cursor:pointer;color:#2c261a;background:#ffc529}.stepper span{min-width:48px;text-align:center;font-size:1.25rem;font-weight:950}.player-fields{display:grid;gap:10px}.field{display:grid;gap:6px;color:#5e4328;font-weight:900}.field input{width:100%;min-height:54px;border:4px solid #2c261a;border-radius:8px;padding:0 14px;color:#2c261a;background:#fffdf2;font-weight:850}.recommendation{border-radius:8px;padding:8px 10px;color:#fffdf2;background:#2c261a;font-size:.82rem;font-weight:900}.grid-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px}.grid-option{display:grid;min-height:112px;place-items:center;border:4px solid #2c261a;border-radius:8px;padding:10px;cursor:pointer;color:#2c261a;background:#fff7db;box-shadow:0 6px #a77b42}.grid-option.selected{background:#ffc529;box-shadow:0 6px #9d5714}.grid-option strong{font-size:1.4rem}.grid-option span,.grid-option small{font-weight:900}.grid-option small{color:#14645d}.game-screen{width:min(1480px,100%);display:grid;height:100dvh;min-height:0;grid-template-rows:auto auto minmax(0,1fr);align-content:stretch;gap:clamp(6px,.9vh,10px);overflow:hidden}.game-topbar{display:grid;grid-template-columns:minmax(108px,auto) minmax(0,1fr) minmax(108px,auto);align-items:center;gap:10px}.topbar-actions{display:flex;gap:8px}.turn-banner{text-align:center}.game-screen .badge{min-height:32px;border-width:3px;padding:3px 14px;font-size:clamp(.76rem,1.5vw,.95rem)}.game-screen .icon-button{width:48px;border-width:4px}.hud-strip{display:block}.scoreboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.score,.final-score{display:flex;min-height:clamp(40px,4.8vh,50px);align-items:center;justify-content:space-between;gap:10px;border:4px solid #2c261a;border-radius:8px;padding:5px 10px;background:linear-gradient(90deg,rgba(255,197,41,.18),transparent 34%),#fff7db;box-shadow:0 5px #8f633c;font-weight:950}.score.active{background:linear-gradient(90deg,rgba(255,255,255,.24),transparent 36%),#2ec4b6}.score strong,.final-score strong{display:grid;min-width:32px;aspect-ratio:1;place-items:center;border-radius:50%;color:#fffdf2;background:#2c261a}.message-zone{position:relative;display:grid;min-height:clamp(40px,4.8vh,50px);place-items:center;border:4px solid #2c261a;border-radius:8px;overflow:hidden;background:#ffc529;box-shadow:0 5px #8f633c}.message-zone:before,.message-zone:after{content:"";position:absolute;inset:0 auto 0 0;width:42px;background:repeating-linear-gradient(135deg,#2c261a 0,#2c261a 11px,#ffc529 11px,#ffc529 22px)}.message-zone:after{inset:0 0 0 auto}.message-zone span{position:relative;z-index:1;border:3px solid #2c261a;border-radius:999px;padding:4px 14px;background:#fff7db;font-size:clamp(.98rem,2vw,1.25rem);font-weight:950}.grid-stage{display:grid;width:100%;min-height:0;overflow:hidden;container-type:size;place-items:center}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.confetti i{position:absolute;top:50%;left:50%;width:12px;height:18px;border-radius:3px;animation:celebrate .7s ease-out forwards}.confetti i:nth-child(1){background:#ff4d4d;--x: -150px;--y: -52px}.confetti i:nth-child(2){background:#2ec4b6;--x: -76px;--y: -82px}.confetti i:nth-child(3){background:#ffc529;--x: 0;--y: -92px}.confetti i:nth-child(4){background:#ff9f1c;--x: 86px;--y: -78px}.confetti i:nth-child(5){background:#3d5afe;--x: 152px;--y: -46px}@keyframes celebrate{0%{opacity:1;transform:translate(-50%,-50%) scale(.6) rotate(0)}to{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.1) rotate(220deg)}}.card-grid{--grid-gap: clamp(5px, 1vh, 10px);display:grid;width:min(100%,calc(100cqh * var(--grid-ratio)));height:auto;max-width:100%;max-height:100%;aspect-ratio:var(--grid-ratio);grid-template-columns:repeat(var(--grid-columns),minmax(0,1fr));grid-template-rows:repeat(var(--grid-rows),minmax(0,1fr));gap:var(--grid-gap)}.match-card{aspect-ratio:var(--card-ratio);min-width:0;border-radius:8px;border:0;padding:0;perspective:800px;cursor:pointer;background:transparent}.match-card:disabled{cursor:default;opacity:1}.card-inner{position:relative;display:block;width:100%;height:100%;transition:transform .42s cubic-bezier(.2,.75,.25,1);transform-style:preserve-3d}.match-card.flipped .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:hidden;border:4px solid #2c261a;border-radius:8px;backface-visibility:hidden;box-shadow:0 6px #6d4b2d}.card-back{background:#ffc529}.stripe-board{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(135deg,#2c261a 0,#2c261a 16px,#ffc529 16px,#ffc529 32px)}.hardhat{position:relative;display:grid;width:55%;aspect-ratio:1;place-items:center;border:4px solid #2c261a;border-radius:999px 999px 18px 18px;color:#2c261a;background:#ff9f1c;font-size:clamp(1.6rem,7vw,3.2rem);font-weight:950}.card-front{grid-template-rows:minmax(0,1fr) auto;gap:4px;padding:clamp(5px,1.3vw,10px);background:#fff7db;transform:rotateY(180deg)}.machine-art{position:relative;display:grid;width:90%;height:100%;min-height:0;place-items:center}.machine-art img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain}.machine-art img:not([hidden])+span{opacity:0}.machine-art span{color:#2c261a;font-size:clamp(1rem,3.2vw,2rem);font-weight:950}.card-front strong{width:100%;min-height:22px;color:#2c261a;font-size:clamp(.62rem,1.8vw,1rem);line-height:1.05;text-align:center}.match-card.matched .card-inner{animation:matchedPop .42s ease}.match-card.matched .card-front{background:#c5f96b}@keyframes matchedPop{50%{transform:rotateY(180deg) scale(1.04)}}.settings-backdrop,.winner-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:18px;background:#2c261a8a}.winner-backdrop{z-index:18;background:#2c261a52;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.end-panel{width:min(520px,100%);padding:clamp(18px,5vw,30px);text-align:center}.settings-modal{width:min(430px,100%);border:5px solid #2c261a;border-radius:8px;padding:18px;background:#fff7db;box-shadow:0 12px #6d4b2d,0 26px 46px #2c261a52}.settings-modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}.settings-modal h2{margin-top:8px;color:#2c261a;font-size:clamp(1.8rem,7vw,2.55rem);line-height:.95}.settings-menu{display:grid;gap:12px}.trophy{display:grid;width:86px;aspect-ratio:1;place-items:center;margin:0 auto 14px;border:5px solid #2c261a;border-radius:50%;background:#ffc529;box-shadow:0 7px #9d5714}.final-scores{display:grid;gap:10px;margin-top:20px}@media(max-width:840px){.hud-strip{grid-template-columns:1fr}.message-zone{justify-self:stretch}}@media(max-width:560px){.screen{padding:10px}.setup-screen{min-height:125dvh;padding-block:18px 150px}.game-screen{padding-top:max(24px,env(safe-area-inset-top))}.game-topbar{grid-template-columns:auto minmax(0,1fr) auto}.icon-button{width:48px}.game-topbar h1{font-size:clamp(1.45rem,8vw,2rem)}.card-grid{gap:6px}.card-face{border-width:3px;box-shadow:0 4px #6d4b2d}.card-front{padding:4px}.card-front strong{font-size:clamp(.52rem,2.5vw,.74rem)}.button{width:100%}}