*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{font-family:DM Sans,system-ui,sans-serif;background:#0d1117;color:#f0f6fc;min-height:100dvh;overflow-x:hidden}:root{--primary: #14b49d;--primary2: #0a9180;--accent: #f59e0b;--bg: #0d1117;--bg1: #161b22;--bg2: #1c2230;--bg3: #252d3d;--border: #21293a;--text: #f0f6fc;--text2: #c9d1d9;--text3: #8b949e;--text4: #6e7681;--danger: #ef4444;--r: 12px}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{transform:scale(.88);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideDown{0%{transform:translateY(-16px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes spinRing{to{transform:rotate(360deg)}}@keyframes heartPop{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.92)}to{transform:scale(1)}}@keyframes bounce3{0%,80%,to{transform:scale(.35);opacity:.5}40%{transform:scale(1);opacity:1}}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes slideInRight{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes oceanFloat{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}.animate-fade-in{animation:fadeIn .35s cubic-bezier(.16,1,.3,1)}.animate-scale-in{animation:scaleIn .3s cubic-bezier(.16,1,.3,1)}.animate-slide-up{animation:slideUp .4s cubic-bezier(.16,1,.3,1)}.animate-slide-down{animation:slideDown .3s cubic-bezier(.16,1,.3,1)}.animate-slide-in-right{animation:slideInRight .3s cubic-bezier(.16,1,.3,1)}.animate-heart{animation:heartPop .4s cubic-bezier(.16,1,.3,1)}.ocean-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--primary)}.ocean-dot:nth-child(1){animation:bounce3 1.4s ease-in-out 0s infinite}.ocean-dot:nth-child(2){animation:bounce3 1.4s ease-in-out .18s infinite}.ocean-dot:nth-child(3){animation:bounce3 1.4s ease-in-out .36s infinite}.ocean-feed{position:fixed;top:0;right:0;bottom:0;left:0;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}.ocean-feed::-webkit-scrollbar{display:none}.ocean-video-item{height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;position:relative;overflow:hidden;background:#000}.ocean-gradient-top{position:absolute;top:0;left:0;right:0;height:140px;z-index:5;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.72) 0%,transparent 100%)}.ocean-gradient-bottom{position:absolute;bottom:0;left:0;right:0;height:260px;z-index:5;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.4) 60%,transparent 100%)}.ocean-btn{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;transition:transform .15s,opacity .15s;-webkit-tap-highlight-color:transparent}.ocean-btn:active{transform:scale(.92)}.action-circle{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#00000073;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1.5px solid rgba(255,255,255,.18);transition:all .2s}.action-circle:hover{background:#ffffff1f;border-color:#ffffff59}.action-circle.active-red{background:#ef444438;border-color:#ef444480}.action-circle.active-teal{background:#14b49d38;border-color:#14b49d80}.ocean-input{width:100%;background:var(--bg2);border:1.5px solid var(--border);border-radius:var(--r);padding:10px 14px;color:var(--text);font-family:DM Sans,sans-serif;font-size:14px;outline:none;transition:border-color .15s}.ocean-input:focus{border-color:var(--primary)}.ocean-input::-moz-placeholder{color:var(--text4)}.ocean-input::placeholder{color:var(--text4)}.ocean-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--primary);color:#fff;border:none;border-radius:var(--r);padding:10px 20px;font-size:14px;font-weight:700;cursor:pointer;font-family:DM Sans,sans-serif;transition:all .15s;box-shadow:0 4px 14px #14b49d59}.ocean-btn-primary:hover{background:var(--primary2);transform:translateY(-1px);box-shadow:0 6px 20px #14b49d73}.ocean-btn-primary:active{transform:scale(.97)}.ocean-btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--bg2);color:var(--text);border:1px solid var(--border);border-radius:var(--r);padding:10px 20px;font-size:14px;font-weight:600;cursor:pointer;font-family:DM Sans,sans-serif;transition:all .15s}.ocean-btn-secondary:hover{background:var(--bg3)}.ocean-card{background:var(--bg1);border:1px solid var(--border);border-radius:14px;overflow:hidden}.shimmer{background:linear-gradient(90deg,var(--bg2) 0px,var(--bg3) 80px,var(--bg2) 160px);background-size:400px 100%;animation:gradientShift 1.6s linear infinite}.avatar-ring{border:2.5px solid rgba(255,255,255,.9);border-radius:50%;-o-object-fit:cover;object-fit:cover}.avatar-ring-primary{border:2.5px solid var(--primary)}.ocean-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-around;background:#0d1117eb;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid var(--border);padding:8px 0;padding-bottom:calc(8px + env(safe-area-inset-bottom));height:calc(58px + env(safe-area-inset-bottom))}.ocean-nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text4);cursor:pointer;padding:4px 12px;transition:color .15s;font-size:11px;font-weight:500;background:none;border:none;-webkit-tap-highlight-color:transparent}.ocean-nav-item.active{color:var(--primary)}.ocean-overlay-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:flex-end}@media (min-width: 768px){.ocean-video-item{display:flex;align-items:center;justify-content:center}.ocean-video-item video{max-height:100dvh;max-width:480px;-o-object-fit:contain;object-fit:contain}.ocean-video-item .ocean-gradient-bottom,.ocean-video-item .ocean-gradient-top{max-width:480px;left:50%;transform:translate(-50%)}}@supports (padding-bottom: env(safe-area-inset-bottom)){.pb-safe{padding-bottom:env(safe-area-inset-bottom)}}.progress-bar{height:3px;border-radius:99px;background:#fff3;cursor:pointer;position:relative}.progress-fill{position:absolute;left:0;top:0;height:100%;border-radius:99px;background:var(--primary);transition:width .1s}.progress-buf{position:absolute;left:0;top:0;height:100%;border-radius:99px;background:#ffffff4d;transition:width .3s}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.018;z-index:9999;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}