:root{--bg-color: #000814;--bg-rgb: 0, 8, 20;--primary-color: #00aaff;--primary-rgb: 0, 170, 255;--color-error: #fa5454;--color-error-rgb: 250, 84, 84;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .7);--text-tertiary: rgba(255, 255, 255, .5)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}::selection{background:rgba(var(--primary-rgb),.3);color:var(--text-primary)}html{width:100%;height:100dvh;background-color:var(--bg-color);-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none}body{width:100%;height:100%;font-family:Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text-primary);overflow:hidden;touch-action:none}#root{width:100%;height:100%;display:flex;flex-direction:column;background-color:transparent}.background-container{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,#001a3a 0%,var(--bg-color) 70%)}.background-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(var(--bg-rgb),0),rgba(var(--bg-rgb),.2) 60%,rgba(var(--bg-rgb),.85))}.app-container{display:flex;flex-direction:column;align-items:center;width:100%;flex:1;position:relative;z-index:1;padding:calc(60px + env(safe-area-inset-top,0px)) 20px 20px}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%}.text-container{display:inline-block}.char{display:inline-block;white-space:pre}.main-title{font-family:Montserrat,sans-serif;font-size:clamp(2.4rem,8vw,7rem);font-weight:700;color:var(--text-primary);margin:0;letter-spacing:4px;text-align:center;text-transform:uppercase}.dive-title{perspective:800px}.dive-float-wrapper{display:inline-block}.dive-char{text-shadow:0 0 10px rgba(var(--primary-rgb),0),0 0 30px rgba(var(--primary-rgb),0),0 0 60px rgba(var(--primary-rgb),0);animation:bioluminescence 4s ease-in-out infinite alternate paused;animation-play-state:running}@keyframes bioluminescence{0%{text-shadow:0 0 8px rgba(var(--primary-rgb),.15),0 0 20px rgba(var(--primary-rgb),.08)}50%{text-shadow:0 0 12px rgba(var(--primary-rgb),.3),0 0 35px rgba(var(--primary-rgb),.15),0 0 60px rgba(var(--primary-rgb),.05)}to{text-shadow:0 0 8px rgba(var(--primary-rgb),.1),0 0 25px rgba(var(--primary-rgb),.06)}}.error-title{font-size:clamp(4rem,15vw,8rem);color:var(--color-error);text-shadow:0 0 20px rgba(var(--color-error-rgb),.4);letter-spacing:4px}.error-subtitle{font-size:clamp(.9rem,2.5vw,1.2rem);letter-spacing:4px;color:var(--text-secondary);margin-top:15px;text-align:center}.btn-container{margin-top:40px;display:flex;justify-content:center}.action-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 36px;font-size:14px;color:var(--text-primary);background:rgba(var(--primary-rgb),.15);border:1px solid rgba(var(--primary-rgb),.5);border-radius:50px;text-decoration:none;font-weight:600;letter-spacing:2px;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 0 15px rgba(var(--primary-rgb),.2);-webkit-user-select:none;user-select:none;outline:none}.action-btn:focus-visible{box-shadow:0 0 0 3px rgba(var(--primary-rgb),.5)}@media (hover: hover) and (pointer: fine){.action-btn:hover{background:rgba(var(--primary-rgb),.3);border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 0 25px rgba(var(--primary-rgb),.6);will-change:transform,box-shadow}}.action-btn:active{transform:scale(.95);background:rgba(var(--primary-rgb),.25);box-shadow:0 0 10px rgba(var(--primary-rgb),.4)}.footer-container{width:100%;display:flex;justify-content:center;align-items:center;z-index:10;white-space:nowrap;padding-top:15px;padding-bottom:calc(15px + env(safe-area-inset-bottom,0px));position:relative}.copyright{font-size:11px;color:var(--text-tertiary);letter-spacing:1px}.copyright a{color:inherit;text-decoration:none;transition:color .3s ease,opacity .2s ease;padding:8px;margin:-8px;display:inline-block;outline:none}.copyright a:focus-visible{color:var(--primary-color)}@media (hover: hover) and (pointer: fine){.copyright a:hover{color:var(--primary-color)}}.copyright a:active{opacity:.7}@media (max-height: 450px) and (orientation: landscape){html,body{height:auto;min-height:100dvh;overflow-y:auto;overflow-x:hidden}.app-container{padding-top:calc(40px + env(safe-area-inset-top,0px))}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms;animation-iteration-count:1;transition-duration:.01ms}}
