.scroll-game-card{background:#fff;border-radius:24px;flex-direction:column;gap:20px;width:min(100%,960px);min-height:min(740px,100dvh - 180px);margin:0 auto;padding:30px;display:flex;box-shadow:0 12px 30px #193d5829}.scroll-game-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.scroll-game-heading h1{color:#ed3f9b;margin:0;font-size:clamp(21px,3vw,29px);font-weight:700}.scroll-game-heading h1 span{margin-right:8px;font-size:24px}.scroll-game-score{white-space:nowrap;margin:0;font-size:26px;font-weight:700}.scroll-game-progress{background:#e5e7eb;border-radius:8px;height:24px;overflow:hidden}.scroll-game-progress-fill{border-radius:inherit;background:#18c66b;height:100%;transition:width .22s}.scroll-ocean-shell{background:linear-gradient(#159fe0 0%,#0474a8 100%);border:3px solid #ed3f9b;border-radius:14px;flex:none;grid-template-rows:minmax(0,1fr);grid-template-columns:64px minmax(0,1fr);width:100%;height:min(66vh,620px);min-height:420px;display:grid;position:relative;overflow:hidden}.depth-ruler{z-index:2;background:#002d5326;position:relative;overflow:hidden}.depth-ruler-content{width:100%;transition:transform 80ms linear;position:relative}.depth-marker{color:#e7f8ff;white-space:nowrap;background:#00335594;border-radius:5px;padding:5px 7px;font-size:13px;font-weight:700;transition:background-color .16s,color .16s;position:absolute;left:8px;transform:translateY(-50%)}.depth-marker:first-child{transform:none;top:14px!important}.depth-marker-active{color:#17405a;background:#ffda60}.scroll-ocean{scrollbar-color:#75d8ee #075d8d;scrollbar-width:thin;scroll-behavior:auto;overscroll-behavior:contain;min-width:0;height:100%;min-height:0;position:relative;overflow:hidden auto}.scroll-ocean:focus-visible{outline-offset:-4px;outline:3px solid #ffda60}.ocean-content{background:linear-gradient(#159fe0 0%,#0781b7 27%,#05628e 58%,#064a6c 82%,#092f45 100%);min-height:0;position:relative}.ocean-bubbles{color:#e6faff61;letter-spacing:24px;pointer-events:none;font-size:27px;position:absolute;top:18px;left:20px;right:22px}.ocean-treasure{z-index:1;top:var(--treasure-y);left:var(--treasure-x);width:68px;height:68px;font:inherit;cursor:pointer;background:radial-gradient(circle,#ffe85e5c,#ffe85e00 72%);border:0;border-radius:50%;place-items:center;padding:0;font-size:48px;line-height:1;transition:filter .18s,opacity .18s,transform .18s,background-color .18s;display:grid;position:absolute;transform:translate(-50%,-50%)}.ocean-treasure:hover:not(:disabled){transform:translate(-50%,-50%)scale(1.16)}.ocean-treasure:focus-visible{outline-offset:2px;border-radius:50%;outline:3px solid #fff2a8}.ocean-treasure-collected{cursor:default;filter:brightness(.32)saturate(.65);opacity:.8;background:0 0}.ocean-seabed{color:#49351f;text-align:center;background:radial-gradient(at 20% 25%,#edc57085 0 4%,#0000 35%),radial-gradient(at 76% 5%,#dcb56d6b 0 6%,#0000 34%),linear-gradient(#1f6373 0%,#94754d 36%,#d0aa6f 100%);flex-direction:column;justify-content:center;align-items:center;min-height:300px;display:flex;position:absolute;top:2600px;left:0;right:0;overflow:hidden}.ocean-seabed:before,.ocean-seabed:after{content:"";background:#ecca8a6b;border-radius:50%;height:60px;position:absolute;left:-10%;right:-10%}.ocean-seabed:before{top:0;transform:rotate(-2deg)}.ocean-seabed:after{background:#6b533b47;top:24px;transform:rotate(2deg)}.ocean-seabed h2{z-index:1;text-shadow:0 2px #fff0c7b8;margin:0;font-size:clamp(25px,4vw,36px)}.ocean-seabed p{z-index:1;letter-spacing:8px;margin:12px 0 0;font-size:32px}.seabed-decor{opacity:.9;font-size:40px;position:absolute}.seabed-coral{bottom:44px;left:12%}.seabed-shell{bottom:50px;right:18%}.seabed-plant{bottom:54px;left:31%}.seabed-starfish{bottom:40px;right:34%}.scroll-game-instruction{color:#9d174d;text-align:center;background:#fce7f3;border-radius:9px;justify-content:center;align-items:center;gap:7px;min-height:56px;margin:0;padding:12px 16px;font-size:16px;display:flex}.scroll-game-back-section{text-align:center}.scroll-game-back-button{color:#4b5563;min-height:44px;font:inherit;background:#f3f4f6;border:2px solid #d1d5db;border-radius:10px;justify-content:center;align-items:center;padding:10px 24px;font-size:16px;font-weight:600;text-decoration:none;transition:background-color .16s,border-color .16s;display:inline-flex}.scroll-game-back-button:hover{background:#e5e7eb;border-color:#9ca3af}.scroll-win-overlay{z-index:10;background:#4ade80f0;place-items:center;padding:24px;animation:.3s ease-out both scroll-win-appear;display:grid;position:absolute;inset:0}.scroll-win-content{color:#123a2c;text-align:center;flex-direction:column;align-items:center;gap:14px;max-width:560px;display:flex}.scroll-win-icon{font-size:clamp(64px,10vw,96px);line-height:1}.scroll-win-content h2{margin:0;font-size:clamp(28px,4.5vw,44px);line-height:1.15}.scroll-win-content p{margin:0 0 8px;font-size:clamp(16px,2.2vw,21px);line-height:1.5}.scroll-win-repeat{color:#13ad65;min-height:58px;font:inherit;cursor:pointer;background:#fff;border:0;border-radius:999px;justify-content:center;align-items:center;gap:10px;padding:12px 30px;font-size:20px;font-weight:700;transition:transform .16s;display:inline-flex;box-shadow:0 8px 22px #00000029}.scroll-win-repeat:hover{transform:translateY(-2px)}@keyframes scroll-win-appear{0%{opacity:0}to{opacity:1}}@media (width<=700px){.game-page{padding:12px 0}.scroll-game-card{border-radius:18px;gap:16px;min-height:0;padding:20px}.scroll-game-heading h1{font-size:clamp(18px,5vw,25px)}.scroll-game-score{font-size:22px}.scroll-game-progress{flex:0 0 18px;height:18px}.scroll-ocean-shell{flex-basis:500px;grid-template-columns:54px minmax(0,1fr);height:500px;min-height:0}.scroll-ocean{max-height:none}.depth-marker{padding:4px 5px;font-size:11px;left:5px}.ocean-treasure{width:58px;height:58px;font-size:42px}.ocean-seabed p{letter-spacing:2px;font-size:24px}.scroll-game-instruction{flex-wrap:wrap;padding:12px;font-size:14px;line-height:1.45}.scroll-win-overlay{padding:16px}.scroll-win-repeat{min-height:50px;font-size:17px}}@media (width<=390px){.scroll-game-card{padding:16px}.scroll-ocean-shell{flex-basis:440px;grid-template-columns:48px minmax(0,1fr);height:440px}.scroll-ocean{max-height:none}.ocean-treasure{width:50px;height:50px;font-size:36px}}@media (prefers-reduced-motion:reduce){.depth-ruler-content,.scroll-game-progress-fill,.ocean-treasure,.scroll-game-back-button,.scroll-win-repeat{transition:none}.scroll-win-overlay{animation:none}}