body { background:#06141c; }
[hidden] { display:none !important; }
.ocean-backdrop,#ocean,.ocean-scrim { position:fixed;inset:0;width:100%;height:100%;pointer-events:none; }
.ocean-backdrop { background:url('/ocean-test/poster.jpg?v=golden-angler-1') center/cover #06141c; }
#ocean { display:block;opacity:0; }
.ocean-ready #ocean { opacity:1; }
.ocean-scrim { background:linear-gradient(90deg,rgba(3,13,20,.94),rgba(3,13,20,.78) 35%,rgba(3,13,20,.15) 80%),linear-gradient(0deg,rgba(1,7,13,.45),transparent 50%); }
.ocean-scrim:after { content:'';position:absolute;inset:0;background:#01070d;opacity:calc(var(--ocean-depth,0)*.2); }
#page-content { position:relative;z-index:1; }
.hero { min-height:calc(100svh - 90px); }
.hero h1 { max-width:740px;font-size:clamp(3.4rem,7vw,6.3rem); }
.hero .lede { max-width:560px;font-size:1rem; }
.instrument-readout { display:flex;flex-wrap:wrap;gap:1.1rem;margin-top:2rem;color:var(--dim);font:11px/1.8 var(--mono); }
.instrument-readout a { color:var(--green); }
.world-grid,.harness-rules { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem; }
.world-grid article,.harness-rules article { padding:1.5rem;border:1px solid var(--line);background:rgba(5,20,28,.88); }
.world-grid img { width:100%;height:190px;object-fit:cover; }
.world-grid h3,.harness-rules h3 { font-size:1.3rem;line-height:1.3; }
.world-grid p,.harness-rules p { color:var(--dim);font-size:14px; }
.harness-rules { margin-top:2rem; }
.harness-rules small { display:block;color:var(--green);font:10px/1.8 var(--mono);overflow-wrap:anywhere; }
.diagram { width:100%;height:auto;display:block;background:#02070b;border:1px solid var(--line); }
.embed-grid { display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin:2rem 0;align-items:start; }
.embed-grid figure { margin:0;min-width:0; }
.embed-grid iframe { display:block;width:100%;height:480px;border:1px solid var(--line);background:#02070b; }
figcaption { color:var(--dim);font:11px/1.7 var(--mono);padding:.8rem 0; }
.evidence-strip { padding:1.5rem;margin:2rem 0;background:rgba(4,15,22,.92);border-block:1px solid var(--line);color:var(--dim);font:12px/1.9 var(--mono); }
.evidence-strip b { color:var(--green); }
.evidence-strip small { color:var(--faint); }
.rack details,#dive-log details { background:rgba(4,15,22,.94);border:1px solid var(--line);padding:1.1rem 1.5rem;margin:.7rem 0; }
summary { cursor:pointer;color:var(--ink); }
details p { color:var(--dim);font-size:14px; }
#dive-log time { color:var(--green);font:11px var(--mono);margin-right:1rem; }
.quiet-links { color:var(--dim);font:12px var(--mono); }
.ocean-controls { position:fixed;z-index:5;right:22px;bottom:18px;max-width:calc(100vw - 44px); }
.ocean-controls p { color:#aecac4;font:10px/1.6 var(--mono);text-shadow:0 1px 6px #000; }
.ocean-controls button { padding:9px 12px;border:1px solid var(--line);border-radius:3px;background:rgba(4,15,22,.94);color:var(--ink);font:10px var(--mono);cursor:pointer; }
footer { padding-bottom:90px; }
@media(max-width:900px) { .world-grid,.harness-rules { grid-template-columns:1fr 1fr; }.embed-grid { grid-template-columns:1fr; } }
@media(max-width:620px) { .world-grid,.harness-rules { grid-template-columns:1fr; }.hero { min-height:800px;padding:5rem 0;align-items:start; }.hero h1 { font-size:clamp(3rem,12vw,4rem); }.ocean-scrim { background:linear-gradient(90deg,rgba(3,13,20,.9),rgba(3,13,20,.45)); }.instrument-readout { gap:.5rem 1rem; }.head { gap:1rem; } }
body.exploring { overflow:hidden; }
body.exploring #ocean { pointer-events:auto;touch-action:none; }
body.exploring #page-content,body.exploring .depth-gauge { opacity:0;pointer-events:none; }
body.exploring .ocean-scrim { opacity:0; }

.hero h1 span { max-width:620px; }