.ocean-background{display:none;position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#073448}
html.ocean-enabled .ocean-background{display:block}
.ocean-background-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;pointer-events:none}
.ocean-background-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0611178f,#061117b8 65%,#061117cf)}
html.ocean-enabled body.pro-ui{background-image:none!important}
html.ocean-enabled body.pro-ui .app-shell{position:relative;z-index:1;background:transparent!important}
/* One continuous ocean surface; retain each theme's control/text colors. */
html:root.ocean-enabled body.pro-ui .app-shell .topbar{background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.ocean-enabled:is([data-theme=studio],[data-theme=light],[data-theme=bold]) .ocean-background-shade{background:linear-gradient(180deg,#f3f3edc2,#f3f3ede0 70%,#f3f3ede8)}
html.ocean-enabled[data-theme=future] .ocean-background-shade{background:linear-gradient(180deg,#050a1880,#050a18b5 65%,#050a18cf)}
.ocean-setting{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 0;margin-bottom:16px;border-bottom:1px solid var(--line)}
.ocean-setting>div{min-width:0}.ocean-setting b{font-size:15px;color:var(--text)}.ocean-setting p{margin:7px 0 0;font-size:12px;line-height:1.6;color:var(--muted)}
.ocean-toggle{flex:0 0 54px;width:54px;min-height:32px;height:32px;padding:3px!important;background:var(--panel2)!important;border:1px solid var(--line)!important;border-radius:999px!important;box-shadow:none!important;cursor:pointer}
.ocean-toggle span{display:block;width:24px;height:24px;border-radius:50%;background:var(--text);transform:translateX(0);transition:transform .2s}
.ocean-toggle[aria-checked=true]{background:var(--accent)!important}.ocean-toggle[aria-checked=true] span{background:#fff;transform:translateX(20px)}
.ocean-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.ocean-toggle span{transition:none}}