.puzzle-art{background-image:url('/assets/puzzle-picnic-v1.jpg');background-size:cover;background-position:center 44%}
.game-card[data-game=puzzle]{border-color:#d8a960}.game-card[data-game=puzzle].selected{border-color:var(--teal)}
.game-page[data-game=puzzle] .playfield{aspect-ratio:auto;min-height:520px;background:#f5e9d5}
.game-page[data-game=puzzle] #game,.game-page[data-game=puzzle] .stage-label,.game-page[data-game=puzzle] .game-controls{display:none}
.game-page[data-game=puzzle] .hud{background:#fff9ed}.game-page[data-game=puzzle] .health strong{color:var(--teal)}
.puzzle-surface{display:grid;grid-template-columns:minmax(180px, .8fr) minmax(290px,1fr);gap:22px;padding:24px;align-items:center;min-height:520px;background:radial-gradient(ellipse at 5% 10%,#fffbec 0,transparent 60%),#f2e7d4}
.puzzle-friends{align-self:center;min-width:0;text-align:center}.puzzle-friends img{display:block;width:100%;height:auto;border-radius:45% 45% 22px 22px;border:5px solid #fffcf2;box-shadow:0 10px 24px #a9804520}
.puzzle-speech{position:relative;margin:18px 0 0;background:#fffaf0;border-radius:18px;padding:15px 10px;color:#315e51;min-height:100px}.puzzle-speech:before{content:"";position:absolute;top:-10px;left:calc(50% - 10px);border:10px solid transparent;border-top:0;border-bottom-color:#fffaf0}.puzzle-speech span{display:block;font-size:13px;letter-spacing:.08em;margin-bottom:8px;color:#7c785e}.puzzle-speech strong{font-size:18px;line-height:1.65;display:block}.puzzle-tip{font-size:14px;line-height:1.85;color:#74664d;margin:16px 0 0}
.puzzle-tray{min-width:0;max-width:440px;width:100%;margin:auto}.puzzle-chain-bar{display:flex;justify-content:space-between;align-items:center;gap:5px;margin:0 2px 13px;font-size:14px;color:#4b6855;font-weight:700}.puzzle-chain-bar>span:last-child{color:#876321;font-size:12px;background:#fff5d8;border-radius:20px;padding:5px 9px}
.puzzle-board-wrap{position:relative;padding:8px;border-radius:24px;background:#dac6a6;border:1px solid #c6b28e;box-shadow:0 6px 0 #b7a07b,0 13px 24px #8a653723}
.puzzle-board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;touch-action:none;user-select:none;-webkit-user-select:none}
.snack{position:relative;aspect-ratio:1;border:2px solid transparent;border-radius:15px;background:#fff8e9;box-shadow:0 3px 0 #bda784;display:grid;place-items:center;padding:4px;touch-action:none;transition:background .1s,transform .15s,border-color .1s;min-width:0;color:#58462d}
.snack svg{width:100%;height:100%;filter:drop-shadow(0 2px 0 #8d5f3220);pointer-events:none}.snack[data-kind="1"]{background:#e8f2e8}.snack[data-kind="2"]{background:#fff0e6}.snack[data-kind="3"]{background:#f1eaf3}.snack[data-kind="4"]{background:#fff4d6}
.snack.is-selected{background:#e5f7cc;border-color:#4c8673;transform:translateY(-2px);box-shadow:0 3px 0 #598574,0 0 0 2px #c7e4a6;z-index:1}.snack.is-clearing{transform:scale(.3);opacity:0;transition:transform .25s,opacity .25s}.snack.is-hint{border-color:#bd8a32;box-shadow:0 0 0 2px #ffe7a0,0 3px 0 #ba9858}.snack:focus-visible{outline:3px solid #205a53;outline-offset:1px;z-index:3}.snack[data-special=true]{background:radial-gradient(circle,#fff9d2,#f6d47c);border-color:#ce9740}.snack-spark{position:absolute;right:-3px;top:-9px;color:#b37b1b;font-size:25px;text-shadow:0 1px white;pointer-events:none}.snack:disabled{cursor:default}
.puzzle-line{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);pointer-events:none;z-index:2;opacity:.6}.puzzle-line polyline{fill:none;stroke:#276b58;stroke-width:8;stroke-linejoin:round;stroke-linecap:round}
.puzzle-actions{display:flex;gap:7px;align-items:center;justify-content:center;margin-top:20px}.puzzle-actions button{min-height:43px;border:1px solid #baa78b;background:#fff9ee;border-radius:12px;font-size:13px;font-weight:700;padding:8px 10px;color:#615a49;white-space:nowrap}.puzzle-actions #puzzle-submit{background:#326e5b;color:#fff9e9;border-color:#326e5b;flex:1}.puzzle-actions button:disabled{opacity:.45;cursor:default}.puzzle-help{font-size:12px;color:#7a6e58;text-align:center;margin:12px 0 0;line-height:1.7}
.game-page[data-game=puzzle] #welcome{background:#fff9f1f5;backdrop-filter:blur(7px);gap:0}.game-page[data-game=puzzle] .welcome-art{width:260px;height:170px;background-size:cover;border-radius:60px 60px 20px 20px;border-width:0;flex-shrink:0;order:-1;margin:0 0 15px}.game-page[data-game=puzzle] .reward-hint{display:none}.game-page[data-game=puzzle] #welcome-description{max-width:440px;line-height:1.75}.game-page[data-game=puzzle] #start-hint{font-size:13px;max-width:310px;line-height:1.7}.game-page[data-game=puzzle] .game-tag{font-size:14px}.game-page[data-game=puzzle] #welcome h2{font-size:26px}.game-page[data-game=puzzle] .play-feedback{display:none}
.puzzle-surface.is-cheering .puzzle-friends img{animation:puzzle-nibble .48s ease-out}.puzzle-surface.is-cheering .puzzle-speech{animation:puzzle-pop .4s ease-out}@keyframes puzzle-nibble{0%,100%{transform:rotate(0)}30%{transform:rotate(-2deg) translateY(-4px)}65%{transform:rotate(2deg)}}@keyframes puzzle-pop{50%{transform:scale(1.04)}}
@media(max-width:700px){.game-page[data-game=puzzle] .playfield{min-height:570px}.puzzle-surface{grid-template-columns:1fr;padding:14px 10px 18px;gap:13px;min-height:570px;align-content:start}.puzzle-friends{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center;text-align:left}.puzzle-friends img{height:88px;object-fit:cover;border-radius:22px;border-width:3px}.puzzle-speech{margin:0;padding:10px 12px;min-height:88px}.puzzle-speech:before{display:none}.puzzle-speech span{font-size:11px;margin-bottom:5px}.puzzle-speech strong{font-size:15px;line-height:1.6}.puzzle-tip{display:none}.puzzle-tray{max-width:390px}.puzzle-chain-bar{font-size:13px;margin-bottom:10px}.puzzle-chain-bar>span:last-child{font-size:11px;padding:5px 7px}.snack{padding:3px;border-radius:11px}.puzzle-board{gap:4px}.puzzle-board-wrap{padding:7px;border-radius:18px}.puzzle-line{inset:7px;width:calc(100% - 14px);height:calc(100% - 14px)}.puzzle-actions{gap:5px;margin-top:16px}.puzzle-actions button{padding:8px;font-size:12px;min-height:44px}.puzzle-help{font-size:11px}.game-page[data-game=puzzle] .hud{gap:12px;padding:11px 12px;height:70px}.game-page[data-game=puzzle] .hud small{font-size:13px;letter-spacing:0}.game-page[data-game=puzzle] .hud strong{font-size:23px}.game-page[data-game=puzzle] .health strong{font-size:18px}.game-page[data-game=puzzle] #welcome{padding:18px 12px;justify-content:center}.game-page[data-game=puzzle] #welcome h2{font-size:22px}.game-page[data-game=puzzle] #welcome-description{font-size:15px}.game-page[data-game=puzzle] .welcome-art{width:240px;height:160px}.game-page[data-game=puzzle] .active-game-heading{align-items:flex-start}.game-page[data-game=puzzle] .active-game-heading h2{font-size:18px}.game-page[data-game=puzzle] .active-game-heading .eyebrow{font-size:13px}.puzzle-art.card-art{background-position:50% 50%}.game-card[data-game=puzzle] .card-kicker em{font-size:13px}}
@media(max-width:350px){.game-page[data-game=puzzle] .playfield,.puzzle-surface{min-height:545px}.puzzle-surface{padding:12px 7px}.puzzle-friends{grid-template-columns:78px 1fr;gap:8px}.puzzle-friends img{height:80px}.puzzle-speech{padding:8px;min-height:80px}.puzzle-speech strong{font-size:14px}.puzzle-chain-bar{font-size:12px}.puzzle-actions button{padding:8px 6px;font-size:11px}.snack{padding:2px;border-radius:9px}.puzzle-board{gap:3px}.game-page[data-game=puzzle] .hud{gap:9px;padding:10px}.game-page[data-game=puzzle] .hud>div{min-width:40px}.game-page[data-game=puzzle] .hud strong{font-size:21px}.game-page[data-game=puzzle] .hud .health strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){.puzzle-surface *{animation:none!important;transition:none!important}.snack.is-clearing{transform:none}}

.game-page[data-game=puzzle] .puzzle-last-seconds #round-value,.game-page[data-game=puzzle] .puzzle-last-seconds #round-unit{color:#c33c2c}.game-page[data-game=puzzle] .puzzle-last-seconds #round-progress{background:#c33c2c}