.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shark-tile-art img{height:120px;width:120px;object-fit:contain;filter:drop-shadow(0 6px 12px #0003)}.shark-tile{border-color:#72dccc66}.shark-tile .tile-cta{color:#72dccc}.shark-panel{width:100%;max-width:600px;margin:auto;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:22px 28px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;overflow:hidden}.shark-status{display:flex;justify-content:space-between;align-items:center;width:100%;font-size:14px;color:var(--muted);gap:12px}.shark-round{color:#102f39;background:#a8e8f5;border-radius:8px;padding:7px 12px;font-weight:600}.shark-stage{position:relative;width:min(100%,430px);aspect-ratio:1;flex-shrink:0;margin:4px auto 0}.shark-art{position:absolute;inset:0;filter:drop-shadow(0 12px 20px #0003);pointer-events:none}.shark-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .22s cubic-bezier(.4,0,.8,1)}.shark-open{opacity:1}.shark-closed{opacity:0}.shark-art img{transition:opacity .1s ease}.teeth-row{position:absolute;left:17%;width:66%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;z-index:3;transition:top .22s ease,opacity .18s ease;align-items:start}.teeth-upper{top:44.5%}.teeth-lower{top:77%}.shark-tooth{border:1px solid #ccd2d7;background:linear-gradient(150deg,#fff,#eff5f5);color:#576e78;box-shadow:0 4px 0 #bdcbd1,0 6px 7px #0003;border-radius:9px 9px 15px 15px;min-height:44px;width:100%;padding:0;font:700 14px 'Mali',sans-serif;cursor:pointer;transition:opacity .2s,box-shadow .2s,background .2s;touch-action:manipulation}.teeth-lower .shark-tooth{border-radius:15px 15px 9px 9px}.teeth-upper .shark-tooth:is(:nth-child(1),:nth-child(6)){transform:translateY(15px)}.teeth-upper .shark-tooth:is(:nth-child(2),:nth-child(5)){transform:translateY(5px)}.teeth-lower .shark-tooth:is(:nth-child(1),:nth-child(6)){transform:translateY(-15px)}.teeth-lower .shark-tooth:is(:nth-child(2),:nth-child(5)){transform:translateY(-5px)}.shark-tooth:hover:not(:disabled){background:#c5f564;border-color:#c5f564;color:#15200b;box-shadow:0 4px 0 #81a240,0 6px 9px #0003}.shark-tooth:focus-visible{outline:3px solid #c5f564;outline-offset:3px}.shark-tooth:disabled{opacity:1;cursor:default}.shark-tooth.pressed{opacity:.13;box-shadow:none;color:transparent;pointer-events:none}.shark-tooth.trap-hit{background:#ff6475;color:#fff;border-color:#ff6475;box-shadow:0 4px 0 #bb354e}.shark-feedback{min-height:88px;width:100%;display:flex;flex-direction:column;justify-content:center;margin:2px 0 12px}.shark-feedback h2{font-size:26px;margin:0;color:#72dccc;line-height:1.5}.shark-feedback p{font-size:14px;color:var(--muted);margin:6px 0 0;line-height:1.7}.shark-feedback h2.bitten-message{color:var(--red)}.shark-reset{max-width:420px;flex-shrink:0}.shark-stage.bitten .shark-open{opacity:0}.shark-stage.bitten .shark-closed{opacity:1}.shark-stage.bitten .teeth-row{opacity:0;visibility:hidden;pointer-events:none;transition:none}.shark-stage.bitten{animation:shark-bite .5s ease}.shark-stage.safe-tap .shark-art{animation:shark-nod .25s ease}@keyframes shark-bite{30%{transform:scale(1.07) rotate(-2deg)}60%{transform:scale(1.03) rotate(2deg)}100%{transform:none}}@keyframes shark-nod{50%{transform:translateY(3px)}}[data-theme=light] .shark-feedback h2,[data-theme=light] .shark-tile .tile-cta{color:#16748a}[data-theme=light] .shark-feedback h2.bitten-message{color:var(--red)}
@media(max-width:800px){.game-grid{grid-template-columns:1fr}.shark-tile-art img{width:64px;height:64px}.shark-panel{padding:15px 16px 18px;border-radius:18px;flex:1;min-height:0;justify-content:center}.shark-status{align-self:stretch;flex-shrink:0}.shark-stage{width:min(100%,350px,max(230px,calc(100dvh - 350px)));margin:4px auto}.shark-feedback{min-height:80px;margin:0 0 12px;flex-shrink:0}.shark-feedback h2{font-size:23px}.shark-reset{margin-top:auto;min-height:50px}.shark-tooth{min-height:44px;font-size:14px}.teeth-row{left:16%;width:68%;gap:3px}.teeth-upper{top:44%}.teeth-lower{top:76%}
/* Four games fit a compact two-by-two menu, retaining readable labels. */
.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.game-tile{display:flex;min-height:0;padding:16px 14px;align-items:flex-start}.tile-art{height:64px;align-self:center;display:flex;font-size:60px;margin:0 0 12px}.timer-art{font-size:38px}.card-art{font-size:44px}.game-tile h2{font-size:20px;line-height:1.5}.game-tile p{font-size:14px;line-height:1.55;margin:5px 0 0}.tile-cta{display:none}.hub-intro{margin-bottom:18px}.hub-main>footer{margin-top:16px}
}
@media(max-width:800px) and (max-height:660px){.shark-stage{width:min(100%,max(220px,calc(100dvh - 330px)))}.shark-panel{padding:12px 14px}.shark-feedback{min-height:72px;margin-bottom:8px}.shark-feedback h2{font-size:21px}.game-tile{padding:12px}.tile-art{height:48px;margin-bottom:8px}.shark-tile-art img{height:48px;width:48px}.game-tile h2{font-size:18px}.game-tile p{font-size:14px}.timer-art{font-size:30px}.hub-main>footer{margin-top:12px}}
@media(max-width:800px) and (max-height:500px) and (orientation:landscape){.shark-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 18px;align-content:center}.shark-status{grid-column:2;grid-row:1}.shark-stage{grid-column:1;grid-row:1/4;width:min(100%,max(200px,calc(100dvh - 150px)));margin:0 auto}.shark-feedback{grid-column:2;grid-row:2;min-height:70px;margin:0}.shark-reset{grid-column:2;grid-row:3}.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tile-art{display:none}.game-tile h2{font-size:17px}.game-tile p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.shark-stage,.shark-art{animation:none!important}.shark-art img,.teeth-row{transition:none!important}}
@media(max-width:800px) and (min-height:501px){.shark-stage{width:min(100%,350px,max(200px,calc(100dvh - 400px)))}}
@media(max-width:800px) and (min-height:501px) and (max-height:660px){.shark-stage{width:min(100%,max(200px,calc(100dvh - 390px)))}.game-tile p{display:none}.game-tile{justify-content:center;min-height:130px}}