:root{color-scheme:dark;--bg:#101925;--panel:#172536;--fg:#e5eff8;--muted:#a7bbce;--line:#30475c;--input:#101c29;--accent:#83d8d5;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:15px;color:var(--fg);background:var(--bg)}:root[data-theme=light]{color-scheme:light;--bg:#eff4f9;--panel:#fff;--fg:#203b50;--muted:#526c81;--line:#c9d7e3;--input:#f1f6fa;--accent:#086e73}*{box-sizing:border-box}body{margin:0;padding:20px max(16px,env(safe-area-inset-right)) max(75px,env(safe-area-inset-bottom));line-height:1.5}header{max-width:1600px;margin:0 auto 22px;display:flex;align-items:center;gap:24px}a{color:var(--accent);text-decoration:none;white-space:nowrap}h1{font-size:clamp(23px,2.5vw,34px);line-height:1.2;margin:3px 0 6px;letter-spacing:-.025em}h2{font-size:17px;margin:0}p{margin:6px 0}.eyebrow{font-size:11px;letter-spacing:.13em;color:var(--accent);font-weight:700}.header-actions{margin-left:auto;display:flex;gap:8px}header p:not(.eyebrow){color:var(--muted);font-size:13px}main{max-width:1600px;margin:auto;display:grid;grid-template-columns:260px minmax(300px,1fr) 260px;gap:16px;align-items:start}.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;min-width:0}.visuals{display:grid;gap:16px;min-width:0}.section-head,.actions{display:flex;align-items:center;justify-content:space-between;gap:8px}.actions{margin-top:16px}button{font:inherit;min-height:44px;padding:8px 13px;background:var(--input);color:var(--fg);border:1px solid var(--line);border-radius:10px;cursor:pointer}button:hover{border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.controls>button{width:100%;margin-top:8px}.controls>label{display:flex;align-items:center;justify-content:space-between;font-weight:600;margin-top:24px;gap:8px}input[type=number]{width:78px;min-height:44px;border-radius:8px;border:1px solid var(--line);background:var(--input);color:var(--fg);padding:6px;font:inherit}input[type=range]{width:100%;height:36px;accent-color:var(--accent)}.bounds{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}fieldset{margin:22px 0 16px;border:0;border-top:1px solid var(--line);padding:12px 0 0}legend{padding-right:10px;font-weight:600}.check{display:flex;align-items:center;gap:9px;min-height:44px;font-size:13px}input[type=checkbox]{width:19px;height:19px;accent-color:var(--accent)}.note,details{font-size:12px;color:var(--muted);line-height:1.65}.note{margin-top:12px}.vessel canvas{width:100%;aspect-ratio:1;display:block;margin-top:12px;border-radius:10px;max-height:65vh}.trajectory canvas{display:block;width:100%;height:200px}.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:var(--muted);margin-top:12px}.legend span{display:flex;align-items:center;gap:5px}.legend i{width:8px;height:8px;border-radius:50%}.liquid{background:#62b8df}.tracer{background:#f18457}.speed-key b{width:45px;height:5px;background:linear-gradient(90deg,#3298e1,#f99d37);border-radius:4px}output,dd{font-variant-numeric:tabular-nums}output{color:var(--accent);font-size:13px}dl{margin:12px 0}dl>div{padding:13px 0;border-bottom:1px solid var(--line)}dt{font-size:12px;color:var(--muted)}dd{font-size:24px;margin:4px 0 0}dd small{font-size:12px;color:var(--muted)}#sim-status{font-size:12px;color:var(--accent);margin:16px 0}summary{cursor:pointer;min-height:36px}footer{max-width:1600px;margin:18px auto 0;font-size:11px;color:var(--muted);letter-spacing:.04em}@media(max-width:1100px){main{grid-template-columns:230px 1fr}.readings{grid-column:1/-1}dl{display:grid;grid-template-columns:repeat(3,1fr);gap:0 20px}}@media(max-width:680px){body{padding-top:12px}header{flex-wrap:wrap;gap:12px}header>a{font-size:13px}header>div:not(.header-actions){flex:1}.header-actions{margin:0;width:100%}.header-actions button{flex:1}main{display:flex;flex-direction:column}.visuals{order:0;width:100%}.controls{order:1;width:100%}.readings{order:2;width:100%}.panel{padding:14px}.vessel canvas{max-height:none}dl{grid-template-columns:repeat(2,1fr)}.trajectory canvas{height:190px}.note{font-size:13px}}
main{grid-template-columns:280px minmax(0,1fr)}.vessel canvas{aspect-ratio:auto;height:clamp(360px,68vh,800px);max-height:none;touch-action:none}.camera-tools{display:flex;gap:6px;flex-wrap:wrap}.learning{margin-top:28px;border-top:1px solid var(--line);padding-top:20px}.learning p{color:var(--muted);font-size:14px;margin-top:12px}.legend{font-size:13px}.note{font-size:13px}@media(max-width:680px){.section-head{flex-wrap:wrap}.vessel canvas{height:52vh;min-height:320px}.camera-tools button{font-size:13px}.controls{order:1}}

#view-section[aria-pressed=true]{background:var(--accent);color:var(--bg);border-color:var(--accent);font-weight:700;box-shadow:0 0 0 2px var(--line)}