#games button{cursor:pointer;margin:0;touch-action:manipulation;font-family:inherit}
.g-tabs{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem}
.g-tab,.g-btn{min-height:56px;padding:.6rem 1.1rem;border-radius:999px;font-size:1.15rem;font-weight:bold;border:3px solid var(--navy)!important;background:var(--sun);color:var(--navy)}
.g-tab[aria-selected=true]{background:var(--navy);color:var(--gold)}
.g-btn.on{background:var(--brick);color:#fff}
.g-panel{display:none}.g-panel.show{display:block}
.g-panel h3{font-size:1.7rem;margin:.2rem 0}
.g-row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:.6rem 0}
.g-msg{font-weight:bold;font-size:1.3rem;min-height:2em}
.ttt{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,360px);margin:.5rem 0 1rem}
.ttt button{aspect-ratio:1;font-size:3rem;background:#FFF3C4;border:4px solid var(--navy)!important;border-radius:18px;padding:0;color:var(--navy)}
.ttt button.win{background:var(--gold)}
.scene{position:relative;width:100%;aspect-ratio:8/5;border:4px solid var(--navy);border-radius:20px;overflow:hidden;margin:.5rem 0 1rem}
.scene svg{position:absolute;inset:0;width:100%;height:100%}
.hid{position:absolute;transform:translate(-50%,-50%);width:64px;height:64px;font-size:1.7rem;background:transparent;border:0!important;padding:0;opacity:.55;filter:saturate(.4)}
.hid.got{opacity:1;filter:none;font-size:2.6rem;animation:pop .5s}
@keyframes pop{50%{transform:translate(-50%,-50%) scale(1.6)}}
.find-list{display:flex;flex-wrap:wrap;gap:.5rem}.find-list span{background:#FFF3C4;border-radius:999px;padding:.2rem .8rem}.find-list .got{background:var(--gold);text-decoration:line-through}
.sw{display:flex;flex-wrap:wrap;gap:.5rem}
.sw button{width:56px;height:56px;border-radius:50%;border:4px solid #fff!important;box-shadow:0 0 0 3px var(--navy);padding:0}
.sw button.on{box-shadow:0 0 0 6px var(--brick)}
.g-lab{display:flex;align-items:center;gap:.5rem}.g-lab input{width:140px;padding:0}
#cv{width:100%;max-width:800px;background:#fff;border:4px solid var(--navy);border-radius:18px;touch-action:none;display:block}
.memo{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:min(100%,440px);margin:.5rem 0 1rem}
.memo button{aspect-ratio:1;font-size:2.4rem;border-radius:16px;border:4px solid var(--navy)!important;background:var(--navy);color:var(--gold);padding:0}
.memo button.up{background:#FFF3C4}.memo button.done{background:var(--gold)}
.feed{position:relative;height:320px;background:linear-gradient(#BDE7FF 60%,#7CCB5E 60%);border:4px solid var(--navy);border-radius:20px;overflow:hidden;margin:.5rem 0 1rem}
.bowl{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:3.5rem}
.treat{position:absolute;width:64px;height:64px;font-size:2.2rem;background:transparent;border:0!important;padding:0}

.pop{background:linear-gradient(#BDE7FF,#E8F7FF)}
.bub{position:absolute;bottom:-80px;width:72px;height:72px;border-radius:50%;font-size:2rem;padding:0;background:radial-gradient(circle at 30% 30%,#fff,rgba(160,215,255,.55) 60%,rgba(63,167,214,.35))!important;border:3px solid rgba(20,37,79,.35)!important;animation:rise linear forwards}
.bub.popd{animation:burst .25s forwards}
@keyframes rise{to{bottom:110%}}
@keyframes burst{to{transform:scale(1.6);opacity:0}}
@media(min-width:900px){.g-tabs{flex-wrap:nowrap;gap:.4rem}.g-tab{padding:.5rem .75rem;font-size:1.05rem;white-space:nowrap}}
