@import "https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap";:root{--font-family:"Noto Sans KR", sans-serif;--glass-bg:#ffffff40;--glass-border:#fff6;--glass-shadow:0 8px 32px 0 #0000005e;--text-light:#fdfdfd}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);color:var(--text-light);background-color:#010a15;background-image:url(/bg.png);background-position:50%;background-repeat:no-repeat;background-size:cover;width:100vw;height:100vh;overflow:hidden}#root{width:100%;height:100%}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:16px}.glass-input{color:#fff;font-family:var(--font-family);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;outline:none;padding:12px 16px;transition:all .3s}.glass-input::placeholder{color:#fff9;font-weight:400}.glass-input:focus{background:#ffffff1a;border-color:#fff6}.glass-button{color:#fff;cursor:pointer;font-weight:600;font-family:var(--font-family);background:linear-gradient(135deg,#ff69b4b3,#00bfffb3);border:1px solid #fff3;border-radius:8px;padding:12px 24px;transition:all .3s;box-shadow:0 4px 15px #0003}.glass-button:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes swimLeftToRight{0%{transform:translate(-20vw)}to{transform:translate(120vw)}}@keyframes swimRightToLeft{0%{transform:translate(120vw)}to{transform:translate(-20vw)}}@keyframes jellyfishFloat{0%{transform:translateY(20vh)}to{transform:translateY(-130vh)}}@keyframes jellyfishPulse{0%,to{transform:scale(1)translateY(0)}30%{transform:scale(1.05,.95)translateY(-20px)}}.bubbles-container{z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.bubble{animation:linear infinite rise;position:absolute;bottom:-20px}@keyframes rise{0%{opacity:0;bottom:-20px;transform:translate(0)}50%{opacity:1}to{opacity:0;bottom:110vh;transform:translate(-20px)}}.app-container{z-index:10;width:100%;height:100%;display:flex;position:relative}.background-video{object-fit:cover;z-index:-1;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.bottom-bar{z-index:20;position:absolute;bottom:50px;left:50%;transform:translate(-50%)}.inline-form{flex-direction:row;align-items:stretch;gap:16px;padding:16px 24px;display:flex}.glass-input{color:#fff;font-family:var(--font-family);background:#ffffff26;border:1px solid #ffffff4d;border-radius:30px;outline:none;min-width:400px;padding:16px 24px;font-size:1.1rem;transition:all .3s}.glass-button{color:#fff;cursor:pointer;font-weight:600;font-family:var(--font-family);background:linear-gradient(135deg,#ff69b4b3,#00bfffb3);border:1px solid #fff3;border-radius:30px;padding:16px 32px;font-size:1.1rem;transition:all .3s;box-shadow:0 4px 15px #0003}.ocean-area{z-index:15;flex:1;position:relative;overflow:hidden}.fish-wrapper{cursor:pointer;flex-direction:column;align-items:center;display:flex;position:absolute}.fish-svg-container{filter:drop-shadow(0 10px 15px #0006);animation:4s ease-in-out infinite float}.jellyfish-pulse{animation:4s ease-in-out infinite jellyfishPulse}.speech-bubble{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);color:#fff;opacity:0;visibility:hidden;pointer-events:none;z-index:30;text-align:center;border:1px solid #ffffff4d;border-radius:12px;min-width:150px;max-width:250px;padding:12px 16px;font-size:.85rem;line-height:1.4;transition:all .3s;position:absolute;top:-90px;box-shadow:0 4px 15px #0000004d}.speech-bubble.visible{opacity:1;visibility:visible;top:-100px}.speech-bubble:after{content:"";border:8px solid #0000;border-top-color:#ffffff4d;border-bottom-width:0;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.fish-date{color:#fff9;margin-top:4px;font-size:.7rem}@media (width<=768px){.bottom-bar{width:95vw;bottom:15px}.inline-form{flex-direction:row;gap:8px;padding:8px 12px}.glass-input{min-width:unset;flex:1;padding:10px 16px;font-size:.95rem}.glass-button{flex-shrink:0;width:auto;padding:10px 16px;font-size:.95rem}}@media (height<=500px) and (orientation:landscape){.bottom-bar{width:50vw;bottom:10px}}