*{box-sizing:border-box;margin:0;padding:0}body{background:#000;margin:0;padding:0;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}#ocean-canvas{cursor:grab;width:100vw;height:100vh;display:block}#ocean-canvas:active{cursor:grabbing}#info{backdrop-filter:blur(10px);color:#fff;pointer-events:none;background:#001428d9;border:1px solid #4488ff4d;border-radius:10px;max-width:350px;padding:20px;font-size:14px;position:fixed;top:20px;left:20px;box-shadow:0 8px 32px #00000080}#info h1{color:#48f;text-shadow:0 0 10px #4488ff80;margin-bottom:15px;font-size:24px}#info p{margin:10px 0;line-height:1.6}#info ul{margin:8px 0;padding-left:20px;line-height:1.8}#info li{margin:4px 0}#info kbd{color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:3px;padding:2px 6px;font-family:Courier New,monospace;font-size:12px}#info strong{color:#6af}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@keyframes panelEnter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes panelExit{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}.ocean-panel{transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);animation:.45s cubic-bezier(.16,1,.3,1) backwards panelEnter}.ocean-panel.exiting{animation:.3s cubic-bezier(.4,0,.6,1) forwards panelExit}.ocean-button{will-change:transform;transition:transform .18s cubic-bezier(.4,0,.2,1),filter .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1)}.ocean-button:hover{filter:brightness(1.1);transform:scale(1.02)translateY(-1px);box-shadow:0 8px 24px #0000004d}.ocean-button:active{transition-duration:50ms;transform:scale(.98)}#ocean-ui{transition:opacity .3s cubic-bezier(.4,0,.2,1)}input[type=range]{transition:opacity .15s ease-out}input[type=range]:hover{opacity:1}input[type=range]:active{opacity:.9}select{transition:border-color .15s ease-out,background-color .15s ease-out}select:hover{border-color:#64c8ff80!important}select:focus{outline:none;background-color:#ffffff26!important;border-color:#64c8ffcc!important}