:root{--ocean-primary:#0a4d68;--ocean-secondary:#088395;--ocean-accent:#05bfdb;--ocean-warning:#f97316;--ocean-bg:#0b1622;--ocean-surface:#1a2332;--ocean-surface-elevated:#232d3f;--text-primary:#f0f9ff;--text-secondary:rgba(240,249,255,.8);--text-tertiary:rgba(240,249,255,.6);--text-muted:rgba(240,249,255,.4);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:28px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;--font-mono:"JetBrains Mono","Fira Code","Consolas",monospace;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:20px;--text-2xl:24px;--text-3xl:32px;--text-4xl:36px;--leading-tight:1.2;--leading-normal:1.5;--leading-relaxed:1.6;--tracking-tight:-0.02em;--tracking-normal:0;--tracking-wide:0.02em;--shadow-card:0 2px 8px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.2);--shadow-button:0 1px 3px rgba(0,0,0,.4);--shadow-elevated:0 4px 16px rgba(0,0,0,.35);--shadow-glow-cyan:0 0 20px rgba(5,191,219,.3);--shadow-glow-accent:0 0 24px rgba(5,191,219,.4);--border-subtle:1px solid hsla(0,0%,100%,.08);--border-muted:1px solid hsla(0,0%,100%,.12);--border-accent:1px solid rgba(5,191,219,.3);--transition-fast:150ms ease-out;--transition-base:200ms ease-out;--transition-slow:300ms ease-out;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-full:9999px}.ocean-home{min-height:100vh;background:var(--ocean-bg);font-family:var(--font-sans);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.heading-hero{font-size:var(--text-4xl);font-weight:700}.heading-hero,.heading-section{line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--text-primary)}.heading-section{font-size:var(--text-2xl);font-weight:600}.heading-card{font-size:var(--text-lg);font-weight:600;line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--text-primary)}.text-body{font-size:var(--text-base);font-weight:400;color:var(--text-secondary)}.text-body,.text-caption{line-height:var(--leading-normal);letter-spacing:var(--tracking-normal)}.text-caption{font-size:var(--text-sm);font-weight:500;color:var(--text-tertiary)}.text-overline{font-size:var(--text-xs);font-weight:600;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.text-mono{font-family:var(--font-mono);font-size:13px;line-height:var(--leading-relaxed)}.card-base{background:var(--ocean-surface);border:var(--border-subtle);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-card);backdrop-filter:blur(12px);transition:transform var(--transition-base),box-shadow var(--transition-base)}.card-base:hover{transform:translateY(-2px);box-shadow:var(--shadow-elevated)}.card-elevated{background:var(--ocean-surface-elevated);border:var(--border-muted);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-elevated);backdrop-filter:blur(16px)}.card-glass{background:rgba(26,35,50,.7);border:var(--border-subtle);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-card);backdrop-filter:blur(12px)}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-4) var(--space-8);font-size:var(--text-base);font-weight:700;letter-spacing:var(--tracking-wide);color:#fff;background:linear-gradient(135deg,var(--ocean-secondary) 0,var(--ocean-accent) 100%);border:none;border-radius:var(--radius-lg);box-shadow:var(--shadow-button),var(--shadow-glow-cyan);cursor:pointer;transition:transform var(--transition-base),box-shadow var(--transition-base)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-elevated),var(--shadow-glow-accent)}.btn-primary:active{transform:translateY(0);box-shadow:var(--shadow-button)}.btn-primary:focus-visible{outline:2px solid var(--ocean-accent);outline-offset:2px}.btn-hero{padding:var(--space-5) var(--space-10);font-size:var(--text-lg);font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-radius:var(--radius-xl);box-shadow:var(--shadow-elevated),0 0 40px rgba(5,191,219,.25)}.btn-hero:hover{box-shadow:var(--shadow-elevated),0 0 60px rgba(5,191,219,.4)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-3) var(--space-6);font-size:var(--text-sm);font-weight:600;color:var(--ocean-accent);background:transparent;border:2px solid rgba(5,191,219,.4);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base)}.btn-secondary:hover{background:rgba(5,191,219,.1);border-color:var(--ocean-accent);transform:translateY(-2px)}.btn-secondary:active{transform:translateY(0)}.btn-secondary:focus-visible{outline:2px solid var(--ocean-accent);outline-offset:2px}.submarine-card{position:relative;overflow:hidden}.submarine-card:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(5,191,219,.03) 0,rgba(5,191,219,.03) 4px);pointer-events:none;opacity:.5}.submarine-icon-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.submarine-icon-wrapper:after{content:"";position:absolute;width:120%;height:120%;background:radial-gradient(circle,rgba(5,191,219,.15) 0,transparent 70%);animation:submarine-pulse 3s ease-in-out infinite}@keyframes submarine-pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}.stat-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:hsla(0,0%,100%,.03);border:var(--border-subtle);border-radius:var(--radius-md);transition:background var(--transition-fast)}.stat-item:hover{background:hsla(0,0%,100%,.06)}.stat-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-sm);background:rgba(5,191,219,.15);color:var(--ocean-accent)}.stat-value{font-size:var(--text-lg);font-weight:700;color:var(--text-primary)}.stat-label{font-size:var(--text-xs);font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.progress-bar{position:relative;height:8px;background:hsla(0,0%,100%,.08);border-radius:var(--radius-full);overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--ocean-primary) 0,var(--ocean-accent) 100%);border-radius:var(--radius-full);transition:width var(--transition-slow)}.captains-log{background:rgba(0,0,0,.4);border:1px solid rgba(5,191,219,.2);border-radius:var(--radius-lg);padding:var(--space-5);font-family:var(--font-mono);position:relative;overflow:hidden}.captains-log:before{content:"";position:absolute;top:0;left:0;right:0;height:32px;background:linear-gradient(180deg,rgba(5,191,219,.08),transparent);pointer-events:none}.captains-log-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid rgba(5,191,219,.15)}.captains-log-indicator{width:8px;height:8px;border-radius:50%;background:var(--ocean-accent);animation:blink 1.5s infinite}@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:.3}}.captains-log-title{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ocean-accent)}.captains-log-timestamp{margin-left:auto;font-size:11px;color:var(--text-muted)}.captains-log-entry{font-size:13px;line-height:1.6;color:var(--text-secondary)}.captains-log-cursor{display:inline-block;width:8px;height:14px;background:var(--ocean-accent);margin-left:2px;animation:cursor-blink 1s step-end infinite}@keyframes cursor-blink{0%,to{opacity:1}50%{opacity:0}}.leaderboard-row{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);transition:background var(--transition-fast),transform var(--transition-fast)}.leaderboard-row:nth-child(2n){background:hsla(0,0%,100%,.02)}.leaderboard-row:hover{background:rgba(5,191,219,.08);transform:translateX(4px)}.rank-badge{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:700}.rank-badge-gold{background:linear-gradient(135deg,gold,orange 50%,gold);color:#1a1a1a;box-shadow:0 2px 8px rgba(255,215,0,.4)}.rank-badge-silver{background:linear-gradient(135deg,#e8e8e8,#b0b0b0 50%,#e8e8e8);color:#1a1a1a;box-shadow:0 2px 8px hsla(0,0%,75%,.4)}.rank-badge-bronze{background:linear-gradient(135deg,#cd7f32,#a05a2c 50%,#cd7f32);color:#fff;box-shadow:0 2px 8px rgba(205,127,50,.4)}.rank-badge-default{background:var(--ocean-surface);color:var(--text-tertiary);border:var(--border-subtle)}.ocx-amount{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);background:rgba(5,191,219,.1);border:1px solid rgba(5,191,219,.2);border-radius:var(--radius-full);font-weight:600;color:var(--ocean-accent)}.status-bar{position:fixed;bottom:0;left:0;right:0;padding:var(--space-3) var(--space-6);background:rgba(11,22,34,.85);backdrop-filter:blur(16px);border-top:var(--border-subtle);z-index:50}.status-bar-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:var(--space-8)}.status-pill{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:hsla(0,0%,100%,.05);border:var(--border-subtle);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:500;color:var(--text-secondary)}.status-indicator{width:8px;height:8px;border-radius:50%}.status-indicator-online{background:#22c55e;animation:pulse-online 2s ease-in-out infinite}@keyframes pulse-online{0%,to{box-shadow:0 0 0 0 rgba(34,197,94,.4)}50%{box-shadow:0 0 0 6px rgba(34,197,94,0)}}.status-indicator-energy{background:var(--ocean-warning)}.skeleton{background:linear-gradient(90deg,hsla(0,0%,100%,.04),hsla(0,0%,100%,.08) 50%,hsla(0,0%,100%,.04));background-size:200% 100%;animation:skeleton-shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-md)}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{height:16px;width:100%}.skeleton-text-sm{height:12px;width:80%}.skeleton-heading{height:32px;width:60%}.skeleton-avatar{width:48px;height:48px;border-radius:50%}.skeleton-card{height:200px;width:100%}.skeleton-button{height:44px;width:100%;border-radius:var(--radius-lg)}.skeleton-stat{height:60px;width:100%;border-radius:var(--radius-md)}:focus-visible{outline:2px solid var(--ocean-accent);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.interactive{transition:transform var(--transition-fast),opacity var(--transition-fast)}.interactive:hover{transform:scale(1.02)}.interactive:active{transform:scale(.98)}.container-ocean{max-width:1200px;margin:0 auto;padding:0 var(--space-6)}.grid-main{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-8);align-items:start}@media (max-width:1024px){.grid-main{grid-template-columns:1fr}}.section-gap{margin-bottom:var(--space-8)}.ocean-glow{position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(5,191,219,.08) 0,transparent 70%);pointer-events:none;filter:blur(40px)}.depth-gradient{position:fixed;inset:0;background:linear-gradient(180deg,var(--ocean-bg) 0,rgba(10,77,104,.3) 50%,var(--ocean-bg) 100%);pointer-events:none;z-index:0}