.door-window{flex-direction:column;display:flex;overflow:hidden}.door-window,.door-dive{--door-sea-bg:#dcedf4;--door-sea-line:#b5d2de;--door-sea-glow-a:#ebf6fae6;--door-sea-glow-b:#b4d4e4e6;--door-fog-ink:#93adbd;--door-label:#4e6374;--door-label-lit:#156558;--door-label-fog:#60788a;--door-badge-ink:#4e6374;--door-badge-border:#b6c9d8;--door-badge-bg:#fff9}.dark .door-window,.dark .door-dive{--door-sea-bg:color-mix(in srgb, hsl(var(--card)) 55%, #091625);--door-sea-line:color-mix(in srgb, hsl(var(--border)) 45%, #0f212e);--door-sea-glow-a:color-mix(in srgb, hsl(var(--card)) 50%, #0f1e29cc);--door-sea-glow-b:color-mix(in srgb, hsl(var(--background)) 50%, #0d1521e6);--door-fog-ink:color-mix(in srgb, hsl(var(--border)) 55%, #2e4f6b);--door-label:hsl(var(--muted-foreground));--door-label-lit:hsl(var(--foreground));--door-label-fog:color-mix(in srgb, hsl(var(--muted-foreground)) 70%, transparent);--door-badge-ink:hsl(var(--muted-foreground));--door-badge-border:hsl(var(--border));--door-badge-bg:hsl(var(--card) / .6)}.door-sea{background:radial-gradient(ellipse at 30% 20%, var(--door-sea-glow-a), transparent 55%), radial-gradient(ellipse at 75% 75%, var(--door-sea-glow-b), transparent 60%), var(--door-sea-bg);flex:1 0 auto;height:200px;position:relative;overflow:hidden}.door-dive{z-index:90;pointer-events:none;background:radial-gradient(ellipse at 30% 20%, var(--door-sea-glow-a), transparent 55%), radial-gradient(ellipse at 75% 75%, var(--door-sea-glow-b), transparent 60%), var(--door-sea-bg);transition:clip-path .36s cubic-bezier(.4,0,.2,1);position:fixed;inset:0}.door-sea-demo .door-island{opacity:.55}.door-demo-badge{z-index:1;letter-spacing:.08em;color:var(--door-badge-ink);border:1px solid var(--door-badge-border);background:var(--door-badge-bg);border-radius:999px;padding:2px 8px;font-size:10.5px;position:absolute;top:10px;right:12px}.door-sea-grid{opacity:.4;background-image:linear-gradient(var(--door-sea-line) 1px, transparent 1px), linear-gradient(90deg, var(--door-sea-line) 1px, transparent 1px);background-size:56px 56px;position:absolute;inset:0}.door-island{text-align:center;animation:6s ease-in-out infinite door-bob;animation-delay:calc(var(--i,0) * -.9s);position:absolute;transform:translate(-50%,-50%)}.door-island svg{shape-rendering:crispedges;margin:0 auto;display:block;overflow:visible}.door-island-label{letter-spacing:.02em;color:var(--door-label);white-space:nowrap;text-overflow:ellipsis;max-width:96px;margin-top:4px;font-size:10.5px;overflow:hidden}@media (max-width:640px){.door-island-label{max-width:64px}}.door-island[data-lit="1"] .c0{fill:#307e71}.door-island[data-lit="1"] .c1{fill:hsl(var(--brand-teal))}.door-island[data-lit="1"] .c2{fill:hsl(var(--brand-gold))}.door-island[data-lit="1"] .door-island-label{color:var(--door-label-lit)}.door-island[data-lit="0"] .c0,.door-island[data-lit="0"] .c1,.door-island[data-lit="0"] .c2{fill:var(--door-fog-ink)}.door-island[data-lit="0"] .door-island-label{color:var(--door-label-fog)}@keyframes door-bob{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 4px))}}.door-glyph{line-height:0;display:inline-flex}.door-glyph svg{shape-rendering:crispedges;display:block}.door-glyph[data-lit="0"] .c0,.door-glyph[data-lit="0"] .c1,.door-glyph[data-lit="0"] .c2{fill:currentColor;opacity:.45}.door-glyph[data-lit="1"] .c0{fill:#307e71}.door-glyph[data-lit="1"] .c1{fill:hsl(var(--brand-teal))}.door-glyph[data-lit="1"] .c2{fill:hsl(var(--brand-gold))}@media (prefers-reduced-motion:reduce){.door-island{animation:none}}