.ocean{height:740px;min-height:650px}.play-layout{align-items:start}aside{display:grid;gap:16px}.sound-card,.collection{background:#fff;border:1px solid #e4eadd;border-radius:16px;padding:19px}.sound-card .setting{margin-top:17px}.sound-card .tiny{margin:9px 0 12px}.sound-buttons{display:flex;gap:8px}.sound-buttons button{flex:1;border:1px solid #d5e5d4;background:#edf6eb;color:#417559;border-radius:8px;font-size:11px;padding:10px 4px}.sound-buttons button[aria-pressed=false]{color:#859184;background:#f3f5f1}.bonus-hud{position:absolute;top:94px;left:26px;right:26px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:#c6e2d8;font-size:9px;pointer-events:none}.bonus-hud span{padding:6px 9px;border:1px solid #d4f7dc20;border-radius:18px;background:#062d403d}.bonus-hud #combo{color:#f1d696}.bonus-hud #pearls{margin-left:auto}.shell{position:absolute;bottom:52px;left:25px;background:none;border:0;font-size:31px;filter:drop-shadow(0 3px 6px #061d37);transition:transform .2s;line-height:1;padding:8px}.shell:hover{transform:rotate(-12deg) scale(1.12)}.shell:active{transform:scale(.9)}.discovery-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.discovery-grid .guide{padding:22px 24px;background:#eaf0e4;border-radius:16px}.discovery-grid .guide h3{margin-bottom:14px}.discovery-grid .step{display:inline-flex;margin-right:22px;vertical-align:top}.discovery-grid .step small{max-width:145px;line-height:1.7}.badges{display:flex;flex-wrap:wrap;gap:9px}.badge{border:1px dashed #dce4d7;border-radius:8px;padding:8px 10px;color:#a3afa0;font-size:10px}.badge.earned{border:1px solid #d9e5bd;background:#f3f7e7;color:#6c8543}.collection .tiny{margin-bottom:0}.under{margin-right:0}button:disabled{cursor:default}.sound-card .secondary:disabled{opacity:.55}.overlay{z-index:2}.toast{z-index:3;max-width:90%;text-align:center;line-height:1.6}.discovery-grid .collection .card-title{margin-bottom:18px}
@media(min-width:901px){.control-card{padding:17px}.camera{aspect-ratio:1.6}.sound-card{padding:17px}.discovery-grid{grid-template-columns:1.2fr 1fr}.discovery-grid .guide .step{margin-right:14px}.discovery-grid .guide .step small{max-width:120px}}
@media(max-width:900px){.ocean{height:740px}.sound-card{padding:14px}.discovery-grid .guide .step{display:flex}.discovery-grid .step small{max-width:none}}
@media(max-width:680px){.ocean{height:68vh;min-height:490px}.bonus-hud{top:85px;left:15px;right:15px;font-size:8px;gap:5px}.bonus-hud span{padding:5px 7px}.bonus-hud #buff{order:3;flex-basis:100%;width:max-content;flex-grow:0;border:0;background:none;padding:3px}.bonus-hud #pearls{margin-left:auto}.sound-card{padding:14px 11px}.sound-buttons{gap:4px}.sound-buttons button{font-size:10px}.sound-card .tiny{font-size:8px}.sound-card .card-title h3{font-size:11px}.sound-card .card-title .live{font-size:7px}.sound-card .setting{margin-top:12px}.discovery-grid{grid-template-columns:1fr;gap:14px;margin-top:16px}.discovery-grid .guide .step{display:inline-flex;margin-right:14px}.discovery-grid .step small{max-width:110px}.discovery-grid .guide{padding:19px}.shell{left:14px;font-size:28px}.under{line-height:1.8}.privacy{max-width:250px;line-height:1.8}.overlay h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){.hero-fish{animation:none}.shell,.toast{transition:none}}

.bonus-hud #goal{flex-basis:100%;border:0;background:none;padding:2px 9px;color:#dcecc5;font-size:9px}.bonus-hud #buff{flex-basis:auto}
@media(max-width:680px){.bonus-hud #goal{order:4;padding:2px 7px}.bonus-hud #buff{flex-basis:100%}}

.mode-picker{display:flex;gap:5px;background:#ffffff15;border:1px solid #ffffff25;padding:4px;border-radius:12px;margin-top:14px}.mode-picker button{border:0;border-radius:8px;padding:8px 18px;font-size:11px;background:transparent;color:#c2dbd6}.mode-picker button[aria-pressed=true]{background:#e9cc8d;color:#244e4e}.mode-help{color:#9ac4c1;font-size:9px;margin-top:9px}.overlay .hero-fish{font-size:65px;margin:7px 0}.duo-status{position:absolute;left:25px;right:25px;bottom:60px;display:flex;justify-content:center;gap:10px;font-size:10px;pointer-events:none}.duo-status span{border-radius:12px;padding:8px 10px;background:#082d40d9;border:1px solid #ffffff25;color:#f4cd7f}.duo-status span+span{color:#90d9f5}.duo-status[hidden],.touch-controls[hidden],#dash2[hidden]{display:none}#dash2{margin-top:8px}.touch-controls{display:flex;justify-content:space-between;gap:16px;margin-top:16px}.touch-controls>div{display:flex;align-items:center;gap:5px}.touch-controls small{font-size:10px;margin-right:5px}.touch-controls button{touch-action:none;user-select:none;width:36px;height:36px;background:#e5efe2;border:1px solid #c8dcc6;border-radius:8px;color:#407565}.touch-controls>div+div button{background:#e0edf2;border-color:#bbd4e2}.duo-status~.bottom-hint{font-size:9px}@media(max-width:680px){.duo-status{left:12px;right:12px;bottom:92px;gap:5px;flex-wrap:wrap}.duo-status span{font-size:8px;padding:5px 8px}.touch-controls{flex-wrap:wrap}.touch-controls button{width:34px}.overlay .hero-fish{font-size:48px}.overlay .pill{font-size:8px}.overlay h2{font-size:19px}.mode-picker button{padding:7px 15px}.mode-help{font-size:8px}.overlay p{margin-bottom:15px}}