:root{--w-sky: #87D4E8;--w-mid: #3BBDD4;--w-deep: #1A5F78;--w-floor: #0D3D52;--lime: #8FE533;--lime-d: #6BBE1A;--white: #F4F9FA;--ink: #0B2530;--sub: rgba(244,249,250,.52);--f: "Space Grotesk", sans-serif;--ease: cubic-bezier(.16, 1, .3, 1);--spring: cubic-bezier(.34, 1.56, .64, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--f);background:var(--w-floor);color:var(--white);overflow-x:hidden;margin:0;padding:0}img{display:block}a{text-decoration:none;color:inherit}.screen{position:relative;width:100vw;height:100vh;overflow:hidden;display:flex;flex-direction:column}.screen__bg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0}.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem clamp(1.5rem,5vw,5rem);display:flex;justify-content:space-between;align-items:center}.nav:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,rgba(11,37,48,.4) 0%,transparent 100%);pointer-events:none}.nav__logo{position:relative;font:700 .82rem/1.3 var(--f);letter-spacing:.05em;color:var(--white);text-decoration:none;display:flex;flex-direction:column;cursor:pointer}.nav__logo img{height:30px;width:auto}.hidden{display:none}#first-screen{background:linear-gradient(180deg,var(--w-sky) 0%,var(--w-mid) 45%,var(--w-floor) 100%);justify-content:center;align-items:flex-start}#first-screen .screen__bg{z-index:0}#first-screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0b25300f,#1a5f7833,#0b2530bf)}.intro-body{position:relative;z-index:2;padding:18vh clamp(1.5rem,5vw,5rem) 6rem;display:flex;flex-direction:column;gap:2.5rem;max-width:820px}.intro-label{font:500 .68rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:#ffffff6b}.intro-q{font:700 clamp(2rem,4.5vw,3.4rem)/1.05 var(--f);letter-spacing:-.025em;color:var(--white);text-shadow:0 2px 20px rgba(11,37,48,.3)}.intro-q .accent{color:var(--lime)}.intro-controls{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}.counter{display:flex;align-items:stretch;border:1px solid rgba(255,255,255,.28);border-radius:3px;overflow:hidden;background:#0b25304d}.counter-btn{width:48px;height:54px;background:transparent;border:none;color:var(--white);font:400 1.3rem/1 var(--f);cursor:pointer;transition:background .16s var(--ease)}.counter-btn:hover{background:#ffffff1a}.counter-val{min-width:70px;text-align:center;padding:0 .75rem;font:700 2rem/54px var(--f);letter-spacing:-.02em;color:var(--white);border-left:1px solid rgba(255,255,255,.18);border-right:1px solid rgba(255,255,255,.18)}.intro-meta{display:flex;flex-direction:column;gap:.75rem}.intro-meta-text{font:300 .82rem/1.6 var(--f);color:var(--sub)}.intro-meta-text strong{color:var(--white);font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;padding:12px 1.5rem;border-radius:3px;cursor:pointer;font:500 .82rem/1 var(--f);letter-spacing:.07em;transition:transform .2s var(--spring),background .18s var(--ease)}.btn:hover{transform:translateY(-2px)}.btn--fill{background:var(--lime);color:var(--ink);border:none}.btn--fill:hover{background:var(--lime-d)}.btn--line{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.3)}.btn--line:hover{border-color:#fffc}.scene-cap{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:3;white-space:nowrap;font:300 .82rem/1 var(--f);color:#ffffff7a;text-align:center}.fade{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.fade.on{opacity:1;transform:none}.fade:nth-child(2){transition-delay:.07s}.fade:nth-child(3){transition-delay:.14s}.fade:nth-child(4){transition-delay:.21s}#loading-screen{background:linear-gradient(160deg,var(--w-mid) 0%,var(--w-floor) 100%);align-items:center;justify-content:center}.load-wrap{display:flex;flex-direction:column;align-items:center;gap:2rem;min-height:100vh;justify-content:center}.sonar{position:relative;width:140px;height:140px;display:flex;align-items:center;justify-content:center}.sonar-ring{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.14);animation:ping 2.6s var(--ease) infinite}.sonar-ring:nth-child(1){width:36px;height:36px;animation-delay:0s}.sonar-ring:nth-child(2){width:76px;height:76px;animation-delay:.55s}.sonar-ring:nth-child(3){width:120px;height:120px;animation-delay:1.1s}@keyframes ping{0%{opacity:.55;transform:scale(.65)}to{opacity:0;transform:scale(1)}}.sonar-dot{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime);z-index:2}.load-label{font:500 .68rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--sub)}.load-track{width:110px;height:1px;background:#ffffff1a}.load-fill{height:100%;width:0;background:#ffffff8c;animation:fill 2.7s var(--ease) forwards}@keyframes fill{to{width:100%}}#ocean-screen{display:block;position:relative;width:100vw;height:100vh;overflow:hidden;background:linear-gradient(to bottom,var(--w-deep),var(--w-floor))}#renderCanvas{display:block!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important}#ocean-ui-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 20px 48px;pointer-events:none;z-index:10}.ocean-bottom-content{display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto}.ocean-title{font:400 1.1rem/1.5 var(--f);color:#ffffffe6;text-align:center;opacity:0}.ocean-subtitle{font:500 1.3rem/1.4 var(--f);color:var(--white);text-align:center;margin:0 0 12px;opacity:0}.ocean-subtitle span{font-weight:600;color:var(--ink);background:var(--lime);padding:6px 12px;border-radius:4px;font-size:1.1em;display:inline-block}.continue-btn{padding:12px 1.5rem;background:var(--lime);color:var(--ink);border:none;border-radius:3px;cursor:pointer;font:500 .82rem/1 var(--f);letter-spacing:.07em;transition:transform .2s var(--spring),background .18s var(--ease);display:flex;align-items:center;justify-content:center;gap:10px;pointer-events:auto}.continue-btn:hover{transform:translateY(-2px);background:var(--lime-d)}.continue-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.continue-btn.hidden{display:none!important}.continue-btn.cleaning-up{background:#0b2530cc;color:var(--white)}.button-icon{width:20px;height:20px;object-fit:contain}.keyboard-hint{position:absolute;top:24px;right:24px;display:flex;flex-direction:column;align-items:center;gap:0;opacity:.7;z-index:20}.keyboard-hint:hover{opacity:.9}.keyboard-icon{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.keyboard-label{font:500 .72rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:#fffc}.rotate-phone-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:30;display:none}.rotate-phone-hint img{width:80px;opacity:.7}.walk-btn{position:absolute;bottom:24px;right:24px;padding:10px 20px;background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.3);border-radius:3px;font:500 .72rem/1 var(--f);letter-spacing:.1em;text-transform:uppercase;z-index:20;cursor:pointer}.fade-in{animation:fadeIn 1s ease-in-out forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 860px){.intro-controls{flex-direction:column;align-items:flex-start}}@media (max-width: 768px){.ocean-title{font-size:.65rem}.ocean-subtitle{font-size:.7rem}#ocean-ui-overlay{padding:60px 15px 40px;justify-content:flex-start}.ocean-bottom-content{position:fixed;top:7%;left:50%;transform:translate(-50%);width:90%;max-width:400px;gap:4px}.continue-btn{padding:8px 16px;font-size:12px}.keyboard-hint{top:auto;bottom:80px;right:24px}.keyboard-icon{width:32px;height:32px}.keyboard-label{font-size:.65rem}.rotate-phone-hint{display:none!important}}@media (max-width: 768px) and (orientation: landscape){#ocean-ui-overlay{justify-content:flex-end;padding:0 20px 20px 0}.ocean-bottom-content{position:fixed;top:auto;bottom:80px;left:auto;right:20px;transform:none;width:auto;max-width:none}.keyboard-hint,.rotate-phone-hint,.walk-btn{display:none!important}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}