:root {
  --ink: #0a1915;
  --deep: #08221b;
  --forest: #0b3026;
  --paper: #f4f1e9;
  --paper-2: #ebe8de;
  --mint: #9df6d0;
  --acid: #c7f35b;
  --coral: #ff9075;
  --gold: #eabf5e;
  --blue: #8ccfff;
  --muted: #69736e;
  --line: rgba(10, 25, 21, .15);
  --shadow: 0 18px 45px rgba(10, 25, 21, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input { font: inherit; }
a { color: inherit; }
.site-shell { overflow: hidden; }
.section-pad { padding: 112px max(5vw, 36px); }

.topbar { height: 76px; padding: 0 max(5vw, 36px); border-bottom: 1px solid rgba(244, 241, 233, .14); background: var(--deep); color: white; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 5; }
.brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; font-size: 15px; letter-spacing: -.02em; }
.brand b { color: var(--mint); font-weight: 700; }
.brand-mark { width: 44px; height: 44px; position: relative; display: inline-flex; flex: 0 0 44px; align-items: center; justify-content: center; border-radius: 9px; background: url("assets/biobody-os-header.png") center / contain no-repeat; }
.brand-mark i { display: none; }
.brand-mark i:nth-child(1) { transform: translate(-7px, 4px); }
.brand-mark i:nth-child(2) { transform: translate(7px, 4px); }
.brand-mark i:nth-child(3) { transform: translate(0, -7px); }
.topbar nav { display: flex; gap: 16px; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; white-space: nowrap; }
.topbar nav a { text-decoration: none; color: rgba(255,255,255,.66); transition: color .2s; }
.topbar nav a:hover { color: white; }
.header-cta { color: var(--mint); font-size: 12px; text-decoration: none; border-bottom: 1px solid rgba(157,246,208,.5); padding-bottom: 3px; }
.header-cta span { margin-left: 8px; }
.topbar button.header-cta { background: transparent; border-left: 0; border-right: 0; border-top: 0; cursor: pointer; font: inherit; }
.account-trigger { width:36px; height:36px; display:grid; place-items:center; border:1px solid rgba(157,246,208,.55); border-radius:50%; background:transparent; color:var(--mint); cursor:pointer; text-decoration:none; transition:background .2s,color .2s; }.account-trigger:hover,.account-trigger.active { background:var(--mint); color:var(--deep); }.user-icon { position:relative; width:17px; height:17px; display:block; }.user-icon::before { content:""; position:absolute; left:5px; top:0; width:7px; height:7px; border:1.5px solid currentColor; border-radius:50%; }.user-icon::after { content:""; position:absolute; left:1px; bottom:0; width:15px; height:8px; border:1.5px solid currentColor; border-bottom:0; border-radius:9px 9px 0 0; }

.report-section { background: #dff2e9; }.report-section .split-heading { margin-bottom: 28px; }.report-section .split-heading > div:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }.report-note { border-left: 4px solid #287c5d; padding: 16px 18px; background: rgba(255,255,255,.52); color: #51665d; font-size: 12px; line-height: 1.6; }.report-note b { color: var(--ink); }
.profile-page { min-height: 100vh; background: #dff2e9; }.profile-main { max-width: 980px; margin: 0 auto; min-height: calc(100vh - 76px); }.profile-intro { max-width: 650px; margin-bottom: 44px; }.profile-intro h1 { margin: 8px 0 16px; font: 400 clamp(58px, 9vw, 96px)/.88 Georgia, serif; letter-spacing: -.065em; }.profile-intro p { max-width: 570px; color: #52685e; font-size: 15px; line-height: 1.7; }.profile-card { padding: 30px; background: var(--paper); border: 1px solid rgba(22,78,60,.22); box-shadow: var(--shadow); }.profile-card h2 { margin: 7px 0 0; font: 400 28px/1.1 Georgia, serif; }.profile-card-head { display: flex; justify-content: space-between; gap: 20px; align-items: start; padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid var(--line); }.profile-card-head .text-button { margin: 0; }.profile-signin { max-width: 520px; }.profile-signin p { color: var(--muted); font-size: 13px; line-height: 1.6; margin-bottom: 23px; }
.admin-main { max-width:1280px; margin:0 auto; min-height:calc(100vh - 76px); }.admin-card,.admin-detail { background:var(--paper); border:1px solid rgba(22,78,60,.22); box-shadow:var(--shadow); }.admin-tabs { display:flex; gap:3px; padding:8px; border-bottom:1px solid var(--line); }.admin-tabs button { border:0; background:transparent; padding:10px 14px; color:#52685e; cursor:pointer; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.admin-tabs button.active { background:var(--deep); color:var(--mint); }.admin-grid-wrap { overflow:auto; }.admin-grid { width:100%; border-collapse:collapse; min-width:850px; }.admin-grid th,.admin-grid td { padding:15px 16px; border-bottom:1px solid var(--line); text-align:left; font-size:12px; vertical-align:top; }.admin-grid th { color:#557266; font-size:8px; letter-spacing:.12em; text-transform:uppercase; }.admin-grid td { color:#4b6057; }.admin-grid td a,.admin-links a,.admin-detail a,.admin-back { color:#196b4d; text-decoration:none; border-bottom:1px solid rgba(25,107,77,.35); }.admin-back { display:inline-block; margin-bottom:20px; font-size:11px; }.admin-detail { padding:34px; }.admin-detail h1 { margin:9px 0; font:400 clamp(38px,6vw,62px)/.95 Georgia,serif; letter-spacing:-.05em; }.admin-detail h2 { margin:35px 0 12px; font:400 26px/1.1 Georgia,serif; }.admin-detail > p { color:var(--muted); font-size:12px; }.admin-detail section { border-top:1px solid var(--line); margin-top:28px; }.admin-detail dl { display:grid; grid-template-columns:160px 1fr; gap:0; margin:0; }.admin-detail dt,.admin-detail dd { margin:0; padding:12px 0; border-bottom:1px solid var(--line); font-size:12px; }.admin-detail dt { color:#668078; font-weight:750; }.admin-detail dd { color:#30483e; }.issue-copy { white-space:pre-wrap; color:#3b5047; font-size:13px; line-height:1.7; }.admin-links { padding:0; list-style:none; }.admin-links li { display:flex; justify-content:space-between; gap:20px; padding:10px 0; border-bottom:1px solid var(--line); font-size:12px; }.admin-links span { color:#78867f; white-space:nowrap; }
.account-dialog { width: min(620px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; border: 0; padding: 34px; background: var(--paper); color: var(--ink); box-shadow: 0 25px 90px rgba(0,0,0,.35); }.account-dialog::backdrop { background: rgba(4,22,17,.72); backdrop-filter: blur(3px); }.account-dialog h2 { margin: 8px 0 12px; font: 400 clamp(38px, 6vw, 56px)/.95 Georgia, serif; letter-spacing: -.05em; }.account-dialog > p, .account-dialog #auth-view > p { color: var(--muted); font-size: 13px; line-height: 1.6; }.dialog-kicker { color: #287c5d; font-size: 9px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }.dialog-close { position: absolute; right: 15px; top: 12px; border: 0; background: transparent; color: #486259; cursor: pointer; font-size: 28px; }.google-button { display: flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 24px; border: 1px solid #80958b; background: white; color: #1b382e; font-size: 12px; font-weight: 700; text-decoration: none; }.or-divider { display: flex; align-items: center; gap: 10px; color: #74837c; font-size: 9px; margin: 18px 0; }.or-divider::before,.or-divider::after { content:""; height: 1px; flex: 1; background: var(--line); }.profile-form, #auth-form { display: grid; gap: 14px; }.profile-form label, #auth-form label { display: grid; gap: 6px; color: #3f5a50; font-size: 10px; font-weight: 750; letter-spacing: .04em; }.profile-form input,.profile-form textarea,#auth-form input { width: 100%; border: 1px solid #b7c2bc; border-radius: 0; background: #fffefa; color: var(--ink); padding: 10px; font: 400 14px/1.4 inherit; }.profile-form textarea { resize: vertical; }.profile-form small { color: #728078; font-weight: 400; letter-spacing: 0; }.text-button { width: max-content; margin-top: 16px; border: 0; border-bottom: 1px solid #597268; background: transparent; color: #315e4d; padding: 4px 0; cursor: pointer; font-size: 10px; }.form-message { min-height: 18px; margin: 0; color: #9d3e2f !important; font-size: 11px !important; }.form-message.success { color: #16704e !important; }.profile-form fieldset { margin: 4px 0; border: 1px solid #afc0b7; padding: 14px; }.profile-form legend { padding: 0 5px; color: #416459; font-size: 10px; font-weight: 800; }.profile-form fieldset > label { display: flex; align-items: center; gap: 8px; margin: 9px 0; font-weight: 500; }.profile-form fieldset input { width: auto; }.visibility-fields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; margin: 12px 0 2px; }.visibility-fields label { display: flex; align-items: center; gap: 6px; padding: 7px; border: 1px solid #cad7d0; background: #f7faf6; font-size: 9px; font-weight: 600; }

.hero { min-height: calc(100vh - 76px); background: var(--deep); color: white; position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, .8fr); align-items: center; gap: 8vw; padding-top: 80px; padding-bottom: 82px; }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .08; background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(90deg, #000, transparent 65%); }
.hero-copy, .hero-console { position: relative; z-index: 1; }
.eyebrow { font-size: 11px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; color: #5c6e67; display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.hero .eyebrow { color: var(--mint); }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 5px rgba(199,243,91,.1); }
.hero h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(62px, 7vw, 112px); line-height: .88; letter-spacing: -.065em; font-weight: 400; margin: 0; max-width: 830px; }
.hero h1 em { color: var(--mint); font-weight: 400; }
.hero-lede { color: rgba(255,255,255,.65); font-size: 17px; line-height: 1.65; max-width: 620px; margin: 34px 0 38px; }
.hero-actions { display: flex; align-items: center; gap: 14px; }
.button { min-height: 48px; padding: 0 21px; border: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 28px; font-size: 12px; font-weight: 750; letter-spacing: .04em; text-decoration: none; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--mint); color: var(--ink); }
.button-ghost { color: white; border: 1px solid rgba(255,255,255,.22); }
.button-light { background: var(--paper); color: var(--ink); margin-top: 28px; }
.hero-console { border: 1px solid rgba(157,246,208,.28); background: rgba(4,24,19,.62); backdrop-filter: blur(8px); min-height: 470px; padding: 20px; box-shadow: 0 35px 80px rgba(0,0,0,.2); }
.console-head { display: flex; justify-content: space-between; color: rgba(255,255,255,.5); font-size: 9px; letter-spacing: .15em; border-bottom: 1px solid rgba(255,255,255,.12); padding-bottom: 15px; }
.pulse-orbit { height: 345px; position: relative; display: flex; align-items: center; justify-content: center; }
.orbit { position: absolute; border: 1px solid rgba(157,246,208,.18); border-radius: 50%; }
.orbit-a { width: 250px; height: 250px; }
.orbit-b { width: 330px; height: 160px; transform: rotate(-18deg); }
.pulse-core { width: 132px; height: 132px; border-radius: 50%; border: 1px solid var(--mint); background: radial-gradient(circle at 40% 35%, rgba(157,246,208,.2), rgba(6,36,29,.85) 63%); display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 0 0 42px rgba(157,246,208,.1); }
.pulse-core::after { content: ""; position: absolute; width: 150px; height: 150px; border: 1px solid rgba(157,246,208,.14); border-radius: 50%; animation: pulse 2.7s infinite; }
@keyframes pulse { 0% { transform: scale(.85); opacity: 0; } 40% { opacity: 1; } 100% { transform: scale(1.2); opacity: 0; } }
.pulse-core small { color: var(--mint); font-size: 8px; letter-spacing: .16em; }
.pulse-core strong { font-family: Georgia, serif; font-size: 19px; margin: 5px 0; }
.pulse-core span { font-size: 9px; color: var(--acid); }
.orb-label { position: absolute; border: 1px solid rgba(255,255,255,.2); background: var(--deep); padding: 6px 9px; font-size: 8px; letter-spacing: .12em; }
.label-glucose { top: 44px; left: 27%; color: var(--gold); }.label-liver { right: 8%; top: 45%; color: var(--mint); }.label-muscle { left: 5%; top: 61%; color: var(--blue); }.label-adipose { right: 25%; bottom: 25px; color: var(--coral); }
.console-readouts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255,255,255,.1); }
.console-readouts div { background: var(--deep); padding: 12px 10px; }
.console-readouts span { display: block; color: rgba(255,255,255,.35); font-size: 7px; letter-spacing: .14em; margin-bottom: 5px; }
.console-readouts b { font-size: 10px; font-weight: 650; }.console-readouts .mint { color: var(--mint); }
.hero-footnote { position: absolute; z-index: 2; left: max(5vw, 36px); right: max(5vw, 36px); bottom: 26px; border-top: 1px solid rgba(255,255,255,.12); padding-top: 15px; color: rgba(255,255,255,.35); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; display: flex; justify-content: space-between; }

.signal-strip { background: var(--mint); display: grid; grid-template-columns: repeat(4, 1fr); padding: 0 max(5vw, 36px); }
.signal-strip div { min-height: 112px; border-right: 1px solid rgba(10,25,21,.18); padding: 26px 24px; display: grid; grid-template-columns: 32px 1fr; column-gap: 9px; }
.signal-strip div:first-child { border-left: 1px solid rgba(10,25,21,.18); }
.signal-strip b { grid-row: 1/3; font-size: 9px; color: #3e6a59; }.signal-strip span { font-family: Georgia, serif; font-size: 20px; }.signal-strip small { font-size: 9px; color: #527064; margin-top: 3px; }

/* Whole-body master map */
.whole-body { background: #101f1a; color: #f5f2e9; border-bottom: 1px solid rgba(255,255,255,.12); }
.whole-body .split-heading > p { color: rgba(255,255,255,.67); }.whole-body .eyebrow { color: var(--mint); }.whole-body h2 { color: white; }
.body-map-tools { margin-top: 38px; border: 1px solid rgba(255,255,255,.16); display: grid; grid-template-columns: 1.2fr 1.55fr 1.8fr 1fr; background: #0b1915; }
.body-search-wrap, .segmented-control { min-height: 92px; padding: 15px; border-right: 1px solid rgba(255,255,255,.14); position: relative; }.body-map-tools > :last-child { border-right: 0; }
.body-search-wrap label, .segmented-control > span { display: block; margin-bottom: 10px; color: #8eb3a4; font-size: 8px; font-weight: 600; letter-spacing: .14em; }
.body-search-wrap input { width: 100%; height: 38px; border: 1px solid rgba(255,255,255,.2); border-radius: 0; background: rgba(255,255,255,.05); color: white; padding: 0 11px; font: 11px/1.3 "DM Sans", sans-serif; outline: none; }.body-search-wrap input:focus { border-color: var(--mint); box-shadow: 0 0 0 2px rgba(157,246,208,.18); }.body-search-wrap input::placeholder { color: rgba(255,255,255,.4); }
.body-search-results { position: absolute; z-index: 30; left: -1px; right: -1px; top: 91px; border: 1px solid #5c786d; background: #f4f1e9; color: var(--ink); box-shadow: 0 18px 38px rgba(0,0,0,.32); max-height: 320px; overflow: auto; }.body-search-results button { width: 100%; display: grid; gap: 4px; padding: 13px; text-align: left; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: inherit; cursor: pointer; }.body-search-results button:hover, .body-search-results button:focus { background: var(--mint); outline: none; }.body-search-results b { font: 500 14px Georgia, serif; }.body-search-results small, .body-search-results p { color: #5d6d67; font-size: 9px; line-height: 1.45; }.body-search-results p { padding: 14px; margin: 0; }
.segmented-control { display: flex; flex-wrap: wrap; align-content: center; gap: 5px; }.segmented-control > span { flex: 0 0 100%; }.segmented-control button { min-height: 31px; padding: 5px 8px; border: 1px solid rgba(255,255,255,.18); background: transparent; color: rgba(255,255,255,.63); font: 500 8px/1.2 "DM Sans", sans-serif; letter-spacing: .04em; cursor: pointer; }.segmented-control button:hover { border-color: rgba(157,246,208,.6); color: white; }.segmented-control button[aria-pressed="true"] { border-color: var(--mint); background: var(--mint); color: var(--ink); }.segmented-control button:focus-visible { outline: 2px solid white; outline-offset: 2px; }
.whole-body-map { display: grid; grid-template-columns: minmax(0, 1fr) 340px; min-height: 850px; border: 1px solid rgba(255,255,255,.16); border-top: 0; background: #f3f0e8; color: var(--ink); }
.body-visual-panel { min-width: 0; border-right: 1px solid var(--line); display: grid; grid-template-rows: auto 720px auto; }.body-map-legend { min-height: 52px; padding: 10px 18px; display: flex; align-items: center; flex-wrap: wrap; gap: 20px; border-bottom: 1px solid var(--line); color: #596a63; font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }.body-map-legend span { display: inline-flex; align-items: center; gap: 7px; }.body-map-legend i { display: inline-block; width: 13px; height: 13px; border: 1px solid var(--ink); }.body-map-legend .legend-shape { transform: rotate(45deg); background: #d7efe5; }.body-map-legend .legend-line { height: 1px; width: 20px; border: 0; border-top: 2px dashed #4d7868; }.body-map-legend .legend-ring { border: 3px double #0b6f54; border-radius: 50%; }
.body-canvas { position: relative; overflow: hidden; background-color: #eceae2; background-image: linear-gradient(rgba(9,48,38,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(9,48,38,.045) 1px, transparent 1px); background-size: 28px 28px; }
.body-canvas::before { content: "SYSTEM COORDINATES · SELECT A LABELED NODE"; position: absolute; top: 16px; left: 18px; color: #668077; font-size: 8px; letter-spacing: .14em; }
.body-silhouette { position: absolute; left: 50%; top: 26px; width: 390px; height: 680px; transform: translateX(-50%); fill: rgba(70,117,99,.09); stroke: rgba(33,91,70,.34); stroke-width: 1.4; }
.body-connection-layer { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }.body-connection-layer line { stroke: #4b8a74; stroke-width: .23; stroke-dasharray: 1.2 1; vector-effect: non-scaling-stroke; opacity: .7; animation: body-path-in .9s ease both; }.body-connection-layer marker path { fill: #4b8a74; }
@keyframes body-path-in { from { stroke-dashoffset: 12; opacity: 0; } }
.body-system-node { --size: 52px; position: absolute; z-index: 4; left: var(--node-x); top: var(--node-y); transform: translate(-50%,-50%); min-width: var(--size); min-height: var(--size); padding: 5px; border: 1px solid #527568; background: #f8f5ec; color: var(--ink); box-shadow: 0 3px 0 rgba(8,34,27,.14); cursor: pointer; display: grid; place-items: center; transition: transform .35s ease, background .25s ease, box-shadow .25s ease; }.body-system-node i { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font: normal 600 7px/1 "DM Mono", monospace; }.body-system-node span { position: absolute; left: 50%; top: calc(100% + 5px); transform: translateX(-50%); width: max-content; max-width: 110px; padding: 3px 5px; background: rgba(244,241,233,.92); color: #263d35; font-size: 8px; font-weight: 600; letter-spacing: .04em; text-align: center; }.body-system-node:hover { transform: translate(-50%,-50%) scale(1.09); z-index: 8; }.body-system-node:focus-visible { outline: 3px solid #123f32; outline-offset: 4px; z-index: 9; }.body-system-node.active { background: var(--mint); border-color: #0a4c3b; box-shadow: 0 0 0 4px #f3f0e8, 0 0 0 7px #0b6f54; z-index: 7; }.body-system-node.active span { background: #0b3026; color: white; }
.shape-circle { border-radius: 50%; }.shape-diamond { border-radius: 4px; rotate: 45deg; }.shape-diamond > * { rotate: -45deg; }.shape-diamond span { rotate: -45deg; left: 77%; top: 82%; }.shape-paired { border-radius: 45% 45% 28% 28%; }.shape-heart { clip-path: polygon(50% 96%, 6% 48%, 6% 24%, 21% 8%, 42% 8%, 50% 20%, 58% 8%, 79% 8%, 94% 24%, 94% 48%); padding-top: 1px; }.shape-rounded { border-radius: 16px 5px 16px 5px; }.shape-hex { clip-path: polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%); }.shape-square { border-radius: 1px; }.shape-shield { clip-path: polygon(50% 0,96% 17%,86% 72%,50% 100%,14% 72%,4% 17%); }
.cell-layer { position: absolute; z-index: 3; right: 16px; bottom: 18px; width: 230px; height: 230px; border: 3px solid #26765e; border-radius: 49% 51% 46% 54%; background: rgba(218,244,232,.94); box-shadow: 0 12px 35px rgba(8,34,27,.2); opacity: 0; transform: translateY(18px) scale(.92); pointer-events: none; transition: opacity .5s ease, transform .6s ease; }.cell-layer.visible { opacity: 1; transform: none; }.cell-membrane { position: absolute; top: 11px; left: 70px; color: #27614f; font: 600 7px "DM Mono", monospace; letter-spacing: .12em; }.organelle { position: absolute; display: grid; padding: 8px; border: 1px solid #3a7763; border-radius: 50%; background: #f4f1e9; font: 600 8px/1.1 "DM Sans", sans-serif; text-align: center; place-items: center; }.organelle small { display: block; max-width: 64px; margin-top: 3px; color: #5a6f67; font-size: 6px; font-weight: 500; }.organelle-nucleus { width: 76px; height: 76px; left: 78px; top: 75px; background: #c7f35b; }.organelle-mito { width: 82px; height: 42px; left: 15px; top: 135px; border-radius: 50%; }.organelle-er { width: 72px; height: 35px; right: 14px; top: 35px; border-radius: 8px; }.organelle-lyso { width: 53px; height: 53px; right: 20px; bottom: 22px; }.organelle-signal { width: 67px; height: 36px; left: 18px; top: 35px; border-radius: 5px; }
.circulating-layer { padding: 22px; border-top: 1px solid var(--line); background: #e2e9e1; }.circulating-layer > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }.circulating-layer > div > span { color: #45705f; font-size: 8px; letter-spacing: .13em; }.circulating-layer h3 { margin: 0; font: 500 18px Georgia, serif; }.circulating-layer ul { list-style: none; padding: 0; margin: 17px 0 0; display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid #b8c9c0; }.circulating-layer li { min-height: 57px; padding: 9px; border-right: 1px solid #b8c9c0; border-bottom: 1px solid #b8c9c0; display: flex; gap: 8px; align-items: center; }.circulating-layer li:nth-child(3n) { border-right: 0; }.circulating-layer li:nth-last-child(-n+3) { border-bottom: 0; }.circulating-layer li > b { flex: 0 0 27px; height: 27px; display: grid; place-items: center; border: 1px solid #3d6e5c; border-radius: 50%; color: #275c49; font: 600 7px "DM Mono", monospace; }.circulating-layer li span { font-size: 9px; font-weight: 600; }.circulating-layer li small { display: block; margin-top: 2px; color: #6b7d76; font-size: 7px; font-weight: 400; }
.body-system-detail { position: sticky; top: 0; align-self: start; min-height: 850px; padding: 31px 27px; background: #09291f; color: white; }.body-detail-kicker { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.15); color: var(--mint); font-size: 8px; letter-spacing: .12em; }.body-system-detail h3 { margin: 32px 0 14px; font: 500 39px/1.02 Georgia, serif; }.body-detail-lede { min-height: 135px; color: rgba(255,255,255,.7); font-size: 13px; line-height: 1.65; }.body-time-card { margin-top: 28px; padding: 18px; border: 1px solid rgba(199,243,91,.35); background: rgba(199,243,91,.08); }.body-time-card span, .body-detail-links > span { color: #d5ef91; font-size: 8px; letter-spacing: .13em; }.body-time-card p { margin: 10px 0 0; font-size: 11px; line-height: 1.55; }.body-detail-links { margin-top: 27px; display: grid; }.body-detail-links > span { margin-bottom: 8px; }.body-detail-links a { padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.78); text-decoration: none; font: 500 11px "DM Sans", sans-serif; display: flex; justify-content: space-between; }.body-detail-links a:hover, .body-detail-links a:focus { color: var(--mint); }.body-subsystem-link { margin-top: 28px; width: 100%; justify-content: space-between; box-sizing: border-box; font-size: 8px; }.body-planned-note { margin-top: 29px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.15); color: #87a399; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.body-outline-list { display: none; grid-column: 1/-1; padding: 25px; grid-template-columns: repeat(2,1fr); gap: 1px; background: #b8c7c0; }.outline-mode .body-visual-panel, .outline-mode .body-system-detail { display: none; }.outline-mode .body-outline-list { display: grid; }.body-outline-list article { padding: 28px; background: #f4f1e9; outline: none; }.body-outline-list article:focus { box-shadow: inset 0 0 0 4px #17634e; }.body-outline-list article > span { color: #42725f; font-size: 8px; letter-spacing: .14em; }.body-outline-list h4 { margin: 12px 0; font: 500 25px Georgia, serif; }.body-outline-list p { color: #53645d; font-size: 12px; line-height: 1.6; }.body-outline-list dl { margin: 20px 0; }.body-outline-list dl div { padding: 10px 0; border-top: 1px solid var(--line); }.body-outline-list dt { color: #527265; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }.body-outline-list dd { margin: 4px 0 0; font-size: 10px; line-height: 1.5; }.body-outline-list a { color: #0a563f; font-size: 9px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.screen-reader-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.platform-directory { background: #edf0e8; border-bottom: 1px solid var(--line); }
.platform-grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); }
.platform-card { min-height: 235px; padding: 28px; border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: flex-start; gap: 14px; color: var(--ink); background: rgba(255,255,255,.26); }
.platform-card:last-child { border-right: 0; }.platform-card span, .platform-lanes span { color: #4d7868; font-size: 9px; font-weight: 600; letter-spacing: .14em; }.platform-card h3 { margin: 0; font: 500 23px/1.08 Georgia, serif; }.platform-card p { margin: 0; color: #52625d; font-size: 13px; line-height: 1.6; }.platform-card b { margin-top: auto; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }.platform-card-live { background: var(--deep); color: white; text-decoration: none; }.platform-card-live span { color: var(--mint); }.platform-card-live p { color: rgba(255,255,255,.68); }
.platform-card-live-secondary { background: #174b3c; color: white; text-decoration: none; }.platform-card-live-secondary span { color: var(--acid); }.platform-card-live-secondary p { color: rgba(255,255,255,.72); }
.platform-lanes { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-top: 0; }.platform-lanes > div { padding: 19px 24px; border-right: 1px solid var(--line); display: grid; gap: 6px; }.platform-lanes > div:last-child { border-right: 0; }.platform-lanes b { font: 500 16px/1.25 Georgia, serif; }.platform-lanes small { color: #66746e; font-size: 10px; line-height: 1.45; }

.section-heading h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(50px, 6vw, 86px); line-height: .95; letter-spacing: -.055em; font-weight: 400; }
.split-heading { display: grid; grid-template-columns: 1.1fr .75fr; gap: 8vw; align-items: end; margin-bottom: 58px; }
.split-heading > p { color: var(--muted); font-size: 14px; line-height: 1.75; max-width: 490px; margin: 0 0 7px; }

.atlas { background: var(--paper); }
.state-selector { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); margin-bottom: 16px; }
.state-tab { border: 0; border-right: 1px solid var(--line); padding: 18px; background: transparent; color: var(--ink); display: grid; grid-template-columns: 30px 1fr auto; align-items: center; text-align: left; cursor: pointer; min-height: 82px; transition: background .2s; }
.state-tab:last-child { border-right: 0; }.state-tab:hover { background: rgba(157,246,208,.15); }.state-tab.active { background: var(--deep); color: white; }
.state-tab .tab-index { font-size: 9px; color: #789087; }.state-tab b { display: block; font-family: Georgia, serif; font-size: 16px; font-weight: 400; }.state-tab small { display: block; margin-top: 4px; font-size: 9px; color: #75817d; }.state-tab.active small { color: rgba(255,255,255,.45); }.state-tab i { font-style: normal; font-size: 8px; font-weight: 800; letter-spacing: .1em; color: #587269; border: 1px solid currentColor; padding: 5px 7px; }.state-tab.active i { color: var(--mint); }
.scenario-lab { margin: 16px 0; border: 1px solid var(--line); background: #f8f5ed; }
.scenario-head { padding: 20px 22px; display: flex; justify-content: space-between; gap: 28px; align-items: flex-start; border-bottom: 1px solid var(--line); }.scenario-head > div > span, .lab-subhead > span { color: #517269; font-size: 7px; font-weight: 750; letter-spacing: .15em; }.scenario-head h3 { font-family: Georgia, serif; font-size: 30px; font-weight: 400; letter-spacing: -.035em; margin: 4px 0 3px; }.scenario-head p { margin: 0; color: var(--muted); font-size: 10px; }.scenario-head button { border: 0; border-bottom: 1px solid #61766e; background: transparent; padding: 5px 0; color: #496159; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; cursor: pointer; }
.scenario-grid { display: grid; grid-template-columns: 1.05fr .95fr; }.meal-composer, .medication-composer { padding: 20px 22px; }.meal-composer { border-right: 1px solid var(--line); }.lab-subhead { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 17px; }.lab-subhead small { color: #84908a; font-size: 8px; }
.meal-controls { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 17px 22px; }.meal-control { display: block; min-width: 0; }.meal-control > span { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 7px; }.meal-control b { font-family: Georgia, serif; font-size: 13px; font-weight: 400; }.meal-control output { color: #276c53; font-size: 9px; font-weight: 750; }.meal-control small { display: block; color: #89938e; font-size: 7px; margin-top: 4px; }.meal-control input[type="range"] { --fill: 40%; appearance: none; width: 100%; height: 3px; margin: 3px 0; background: linear-gradient(90deg, #2c8766 var(--fill), #d5d5cd var(--fill)); outline: none; }.meal-control input[type="range"]::-webkit-slider-thumb { appearance: none; width: 13px; height: 13px; border-radius: 50%; border: 2px solid #f8f5ed; background: #155f47; box-shadow: 0 0 0 1px #155f47; cursor: pointer; }.meal-control input[type="range"]::-moz-range-thumb { width: 11px; height: 11px; border-radius: 50%; border: 2px solid #f8f5ed; background: #155f47; box-shadow: 0 0 0 1px #155f47; cursor: pointer; }
.medication-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }.med-card { position: relative; border: 1px solid var(--line); background: #f1eee5; min-height: 75px; cursor: pointer; padding: 11px 11px 10px 34px; transition: border .2s, background .2s; }.med-card:hover { border-color: #5f8d7b; }.med-card.active { background: #e1f5ed; border-color: #2f8665; }.med-card input { position: absolute; left: 10px; top: 13px; accent-color: #147553; }.med-card b { display: block; font-family: Georgia, serif; font-size: 13px; font-weight: 400; }.med-card span { display: block; color: #567067; font-size: 7px; letter-spacing: .06em; margin: 3px 0; }.med-card small { color: #8a938f; font-size: 7px; line-height: 1.35; display: block; }
.medication-flow-panel[hidden] { display: none; }.medication-flow-panel { border-top: 1px solid var(--line); background: #e9f3f7; }.med-flow-card { padding: 18px 22px; border-bottom: 1px solid #b9d3df; }.med-flow-card:last-child { border-bottom: 0; }.med-flow-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }.med-flow-head > div > span { color: #317493; font-size: 7px; font-weight: 800; letter-spacing: .15em; }.med-flow-head h4 { margin: 4px 0 0; font: 400 22px/1.1 Georgia, serif; }.med-flow-head h4 small { color: #5f7c88; font: 8px/1.2 Arial, sans-serif; letter-spacing: .06em; }.med-flow-head button { border: 1px solid #4b8ba8; background: #d9edf6; color: #245f7a; padding: 8px 10px; cursor: pointer; font-size: 7px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }.med-flow-chain { display: flex; align-items: stretch; gap: 7px; margin: 16px 0; overflow-x: auto; padding-bottom: 4px; }.med-flow-chain b { display: flex; align-items: center; min-width: 128px; min-height: 48px; padding: 8px 10px; border: 1px solid #a8cad9; background: rgba(255,255,255,.66); color: #254b5b; font: 400 11px/1.35 Georgia, serif; }.med-flow-chain i { align-self: center; color: #3189b7; font-size: 17px; font-style: normal; }.med-flow-notes { display: grid; grid-template-columns: 1fr 1.25fr auto; gap: 10px; align-items: stretch; }.med-flow-notes p { margin: 0; padding: 11px 12px; background: rgba(255,255,255,.55); color: #536c76; font-size: 8.5px; line-height: 1.5; }.med-flow-notes p span { display: block; margin-bottom: 5px; color: #317493; font-size: 6.5px; font-weight: 800; letter-spacing: .13em; }.med-flow-notes p.side-effects { border-left: 3px solid #d96b50; background: #fff1ec; color: #71483f; }.med-flow-notes p.side-effects span { color: #a24331; }.med-flow-notes > a { display: flex; align-items: center; padding: 11px; border: 1px solid #9cbfce; color: #286c86; text-decoration: none; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.dose-config { display:grid; grid-template-columns:1fr .7fr 1.15fr 1.4fr; gap:8px; margin-top:16px; padding:12px; border:1px solid #a8cad9; background:rgba(255,255,255,.45); }.dose-config label,.dose-readout { display:flex; flex-direction:column; gap:6px; }.dose-config label > span,.dose-readout > span { color:#317493; font-size:6px; font-weight:850; letter-spacing:.14em; }.dose-config select { width:100%; min-height:34px; border:1px solid #9cbfce; background:white; color:#173d4c; padding:6px 8px; font-size:9px; }.dose-readout { border-left:4px solid #3189b7; padding:4px 9px; }.dose-readout.low { border-color:#87aabd; }.dose-readout.moderate { border-color:#3189b7; }.dose-readout.high { border-color:#164e72; }.dose-readout b { color:#173d4c; font:400 13px/1.2 Georgia,serif; }.dose-readout small { color:#667f89; font-size:7px; line-height:1.35; }
.absolute-risk-panel { margin-top:12px; border:1px solid #8db4c4; background:#f6fbfc; }.absolute-risk-head { display:flex; justify-content:space-between; gap:22px; padding:13px 14px; background:#163943; color:white; }.absolute-risk-head span { color:#91dcf6; font-size:6px; font-weight:850; letter-spacing:.15em; }.absolute-risk-head h5 { margin:4px 0 0; font:400 18px/1.1 Georgia,serif; }.absolute-risk-head p { max-width:280px; margin:0; color:rgba(255,255,255,.58); font-size:7px; line-height:1.45; text-align:right; }.risk-study-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.risk-study { min-height:175px; padding:13px 14px; border-right:1px solid #bfd3da; border-bottom:1px solid #bfd3da; display:flex; flex-direction:column; }.risk-study:nth-child(even) { border-right:0; }.risk-study > div { display:flex; justify-content:space-between; gap:12px; }.risk-study > div b { color:#245e74; font-size:8px; }.risk-study > div span { color:#71878f; font-size:7px; text-align:right; }.risk-study h6 { margin:18px 0 5px; color:#123f50; font:400 22px/1 Georgia,serif; }.risk-study.uncertain h6 { color:#8a5b18; }.risk-study p { margin:0; color:#405d67; font-size:9px; }.risk-study small { margin-top:8px; color:#788b91; font-size:7px; line-height:1.5; }.risk-study a { margin-top:auto; align-self:flex-start; color:#28728e; font-size:7px; text-decoration:none; border-bottom:1px solid #9abac7; }.risk-comparison { margin:0; padding:12px 14px; color:#536a72; font-size:8px; line-height:1.55; border-bottom:1px solid #bfd3da; }.risk-comparison b { display:block; color:#286b83; font-size:6px; letter-spacing:.14em; margin-bottom:4px; }.integrity-note { display:grid; grid-template-columns:120px 1fr auto; gap:12px; align-items:start; padding:13px 14px; background:#eef5f3; border-left:5px solid #57977f; }.integrity-note.caution { background:#fff8e7; border-color:#c28c31; }.integrity-note.alert { background:#fff0eb; border-color:#c95d45; }.integrity-note > span { color:#496d62; font-size:6px; font-weight:850; letter-spacing:.14em; }.integrity-note p { margin:0; color:#566a65; font-size:8px; line-height:1.55; }.integrity-note a { color:#276c7d; font-size:7px; text-decoration:none; border-bottom:1px solid #9abac7; white-space:nowrap; }
.drug-drilldown { margin: 18px -22px; border-top: 1px solid #99c4d7; border-bottom: 1px solid #99c4d7; background: #dcecf1; }.drug-drill-head { min-height: 82px; padding: 16px 22px; display: flex; justify-content: space-between; align-items: center; gap: 24px; background: #18333c; color: white; }.drug-drill-head span { color: #86d9fb; font-size: 6.5px; font-weight: 800; letter-spacing: .14em; }.drug-drill-head h5 { margin: 5px 0 3px; font: 400 22px/1.1 Georgia, serif; }.drug-drill-head p { margin: 0; color: rgba(255,255,255,.48); font-size: 8px; }.drug-drill-head button { flex: 0 0 auto; border: 1px solid #83cae7; background: #dff5ff; color: #174e66; padding: 12px 15px; cursor: pointer; font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }.drug-map-scroll { overflow-x: auto; background: linear-gradient(rgba(24,51,60,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(24,51,60,.055) 1px, transparent 1px), #edf4f5; background-size: 26px 26px; }.drug-map-canvas { position: relative; width: 1160px; height: 540px; }.drug-map-canvas > svg { position: absolute; inset: 0; width: 1160px; height: 540px; overflow: visible; pointer-events: none; }.drug-drill-edge { fill: none; stroke: #8daab5; stroke-width: 1.7; opacity: .45; marker-end: url(#drug-drill-arrow); transition: opacity .25s, stroke .25s, stroke-width .25s; }.drug-drill-edge.secondary { stroke: #a9822f; }.drug-drill-edge.safety { stroke: #c26b55; stroke-dasharray: 5 5; }.drug-drill-edge.modifier { stroke: #8d705c; stroke-dasharray: 2 6; }.drug-drill-edge.complete { opacity: .9; stroke-width: 2.4; }.drug-drill-edge.active { opacity: 1; stroke: #1194c7; stroke-width: 4; stroke-dasharray: 7 6; animation: drug-drill-flow .9s linear infinite; filter: drop-shadow(0 0 4px rgba(17,148,199,.45)); }.drug-drill-edge.safety.active, .drug-drill-edge.modifier.active { stroke: #db6348; }.drug-map-node { position: absolute; z-index: 2; width: 156px; height: 76px; padding: 9px 10px; border: 1px solid #91b1bc; background: rgba(250,252,251,.97); color: #15343e; text-align: left; cursor: pointer; box-shadow: 0 4px 12px rgba(24,51,60,.07); transition: border .2s, box-shadow .2s, transform .2s, opacity .2s; }.drug-map-node:hover { transform: translateY(-2px); border-color: #1788b4; }.drug-map-node > span { display: block; color: #58808f; font-size: 6px; font-weight: 800; letter-spacing: .13em; }.drug-map-node > b { display: block; margin: 5px 0 3px; font: 400 13px/1.05 Georgia, serif; }.drug-map-node > small { display: block; color: #71858c; font-size: 7px; line-height: 1.25; }.drug-map-node.target { border-left: 4px solid #1194c7; }.drug-map-node.signal, .drug-map-node.receptor { border-left: 4px solid #3978a9; }.drug-map-node.outcome { border-left: 4px solid #2c8a68; }.drug-map-node.safety { border-left: 4px solid #d2644b; background: #fff4ef; }.drug-map-node.modifier { border-left: 4px solid #927059; background: #f6eee7; }.drug-map-node.complete { background: #e5f6f1; border-color: #72ad9d; }.drug-map-node.active { z-index: 3; border-color: #1194c7; transform: translateY(-4px); box-shadow: 0 0 0 5px rgba(17,148,199,.18), 0 12px 22px rgba(24,51,60,.18); animation: drug-node-pulse 1s ease-in-out infinite alternate; }.drug-map-node.safety.active, .drug-map-node.modifier.active { border-color: #d2644b; box-shadow: 0 0 0 5px rgba(210,100,75,.16), 0 12px 22px rgba(24,51,60,.18); }.drug-map-lane { position: absolute; left: 20px; color: #78939c; font-size: 6px; font-weight: 800; letter-spacing: .16em; }.core-lane { top: 20px; }.output-lane { top: 201px; }.safety-lane { top: 382px; }.drug-drill-readout { min-height: 112px; padding: 15px 22px; display: grid; grid-template-columns: 145px 1fr 1.4fr; column-gap: 18px; align-items: start; background: white; }.drug-drill-readout > span { color: #2483a9; font-size: 6.5px; font-weight: 800; letter-spacing: .13em; padding-top: 3px; }.drug-drill-readout > strong { font: 400 16px/1.25 Georgia, serif; }.drug-drill-readout > p { margin: 0; color: #62777f; font-size: 9px; line-height: 1.55; }.drug-drill-readout > small { grid-column: 3; margin-top: 7px; color: #849399; font-size: 7px; }.drug-drill-readout a { color: #247698; text-decoration: none; border-bottom: 1px solid #8bb7c8; }.med-flow-notes { margin-top: 16px; }
@keyframes drug-drill-flow { to { stroke-dashoffset: -26; } }
@keyframes drug-node-pulse { to { transform: translateY(-6px); } }
.scenario-results { border-top: 1px solid var(--line); display: grid; grid-template-columns: 1.2fr repeat(4, 1fr); background: #e9e7de; }.scenario-results > div { min-height: 78px; padding: 14px 15px; border-right: 1px solid var(--line); }.scenario-results > div:last-child { border-right: 0; }.result-intro > span { display: block; color: #517269; font-size: 6px; letter-spacing: .15em; }.result-intro strong { display: block; font-family: Georgia, serif; font-size: 15px; font-weight: 400; margin: 6px 0 3px; }.result-intro small { color: #87918c; font-size: 7px; }.result-meter > span { display: block; color: #687871; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }.result-meter > div { height: 4px; margin: 10px 0 7px; background: #cdd1c9; overflow: hidden; }.result-meter i { display: block; width: 50%; height: 100%; background: #278261; transition: width .25s, background .25s; }.result-meter b { font-family: Georgia, serif; font-size: 13px; font-weight: 400; }.result-meter.high i { background: var(--coral); }.result-meter.low i { background: var(--blue); }.result-meter.very-high i { background: #d54e32; }
.scenario-explanation { border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(2, 1fr); }.scenario-impact { padding: 14px 17px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }.scenario-impact:nth-child(even) { border-right: 0; }.scenario-impact strong { display: flex; align-items: center; gap: 8px; font-family: Georgia, serif; font-size: 14px; font-weight: 400; }.scenario-impact strong i { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }.scenario-impact.drug strong i { background: var(--blue); }.scenario-impact p { margin: 6px 0 0; color: #65726c; font-size: 8.5px; line-height: 1.55; }.scenario-impact em { color: #8b4c3d; font-style: normal; }.scenario-impact a { color: #286c54; text-decoration: none; border-bottom: 1px solid rgba(40,108,84,.3); }.scenario-disclaimer { margin: 0; padding: 12px 17px; background: #172923; color: rgba(255,255,255,.55); font-size: 7.5px; line-height: 1.55; letter-spacing: .02em; }
.map-toolbar { min-height: 54px; padding: 0 16px; background: var(--paper-2); display: flex; justify-content: space-between; align-items: center; gap: 20px; border: 1px solid var(--line); }
.state-summary { display: flex; gap: 10px; align-items: center; min-width: 0; }.state-summary b { font-size: 11px; white-space: nowrap; }.state-summary > span:last-child { color: #718078; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.status-pip { width: 7px; height: 7px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 4px rgba(199,243,91,.14); }
.map-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }.map-actions button { border: 0; background: none; color: #52645c; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; cursor: pointer; padding: 7px; }.atlas-jump { display: flex; align-items: center; gap: 6px; color: #61736b; font-size: 7px; letter-spacing: .1em; }.atlas-jump select { max-width: 150px; border: 1px solid var(--line); background: rgba(255,255,255,.5); color: #31473e; padding: 6px 7px; font-size: 8px; }
.flow-mode-switch, .stage-detail-switch { display: flex; align-items: center; gap: 2px; border: 1px solid #b9c9c0; background: #f8f7f1; padding: 2px; }.flow-mode-switch[hidden] { display: none; }.flow-mode-switch > span, .stage-detail-switch > span { padding: 0 5px; color: #718078; font-size: 6px; font-weight: 800; letter-spacing: .12em; }.flow-mode-switch button, .stage-detail-switch button { padding: 6px 8px; font-size: 7px; }.flow-mode-switch button.active, .stage-detail-switch button.active { background: #1b5545; color: white; }
.flow-player { min-height: 124px; display: grid; grid-template-columns: 210px minmax(0, 1fr) 150px; background: #102a23; color: white; border: 1px solid rgba(10,25,21,.18); border-top: 0; }
.play-button { border: 0; border-right: 1px solid rgba(255,255,255,.12); background: var(--mint); color: var(--ink); padding: 0 20px; display: flex; align-items: center; gap: 14px; text-align: left; cursor: pointer; transition: background .2s; }.play-button:hover { background: var(--acid); }.play-button.playing { background: var(--acid); }
.play-icon { width: 38px; height: 38px; border: 1px solid currentColor; border-radius: 50%; display: grid; place-items: center; font-size: 11px; flex-shrink: 0; }.play-button b { display: block; font-family: Georgia, serif; font-size: 17px; font-weight: 400; }.play-button small { display: block; color: rgba(10,25,21,.58); font-size: 7px; letter-spacing: .08em; margin-top: 4px; text-transform: uppercase; }
.player-story { padding: 14px 22px 11px; min-width: 0; }.player-story-top { display: flex; gap: 12px; align-items: baseline; }.player-story-top span { color: var(--mint); font-size: 7px; letter-spacing: .14em; flex-shrink: 0; }.player-story-top strong { font-family: Georgia, serif; font-size: 16px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.player-story > p { margin: 5px 0; color: rgba(255,255,255,.53); font-size: 9px; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.stage-transcript { display: flex; gap: 8px; color: rgba(255,255,255,.41) !important; font-size: 8px !important; }.stage-transcript > span:first-child { color: var(--acid); font-size: 6px; letter-spacing: .13em; flex: 0 0 auto; padding-top: 1px; }
.stage-track { height: 18px; display: flex; align-items: center; gap: 5px; }.stage-dot { position: relative; flex: 1; height: 3px; border: 0; padding: 0; background: rgba(255,255,255,.14); cursor: pointer; overflow: visible; }.stage-dot::after { content: ""; position: absolute; inset: -7px 0; }.stage-dot.complete { background: rgba(157,246,208,.46); }.stage-dot.active { background: var(--mint); box-shadow: 0 0 12px rgba(157,246,208,.45); }.stage-dot.active::before { content: ""; position: absolute; right: 0; top: -2px; width: 7px; height: 7px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 4px rgba(199,243,91,.13); }
.player-controls { border-left: 1px solid rgba(255,255,255,.12); padding: 12px 15px; display: grid; grid-template-columns: 32px 32px 1fr; gap: 6px; align-content: center; }.player-controls button { width: 32px; height: 28px; border: 1px solid rgba(255,255,255,.2); background: transparent; color: white; cursor: pointer; }.player-controls button:disabled { opacity: .25; cursor: default; }.voice-button { grid-column: 1 / -1; width: auto !important; display: flex; align-items: center; justify-content: center; gap: 6px; color: var(--mint) !important; font-size: 7px; text-transform: uppercase; letter-spacing: .1em; }.voice-button[aria-pressed="false"] { color: rgba(255,255,255,.45) !important; }.voice-button[aria-pressed="false"] span:first-child { text-decoration: line-through; }.player-controls label { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; color: rgba(255,255,255,.4); font-size: 7px; text-transform: uppercase; letter-spacing: .1em; }.player-controls select { border: 0; outline: none; background: transparent; color: var(--mint); font-size: 9px; }
.map-help { background: var(--ink); color: rgba(255,255,255,.65); padding: 13px 16px; font-size: 10px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }.map-help[hidden] { display: none; }.map-help strong { color: white; }
.trend { width: 23px; height: 23px; display: inline-grid; place-items: center; font-weight: 800; }.trend.up, .big-trend.up { color: #246e4f; background: var(--mint); }.trend.down, .big-trend.down { color: #82301f; background: #ffd4c9; }.trend.mixed, .big-trend.mixed { color: #604610; background: #fae4a8; }.trend.stable, .big-trend.stable { color: #2b5264; background: #d6ecf7; }
.map-layout { display: grid; grid-template-columns: minmax(0, 1fr) 314px; min-height: 710px; border: 1px solid var(--line); border-top: 0; background: #eeece4; }
.map-viewport { overflow: auto; position: relative; height: 710px; border-right: 1px solid var(--line); }
.map-stage { width: 1540px; height: 2780px; zoom: .52; position: relative; background-image: linear-gradient(rgba(10,25,21,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(10,25,21,.045) 1px, transparent 1px); background-size: 34px 34px; transition: zoom 2.4s cubic-bezier(.22,.75,.22,1); }.map-stage.stage-zoom { zoom: .9; }
.edge-layer { position: absolute; inset: 0; width: 1540px; height: 2780px; overflow: visible; pointer-events: none; }
.map-edge { fill: none; stroke: #8e9b94; stroke-width: 1.2; opacity: .33; transition: stroke 1.15s ease, opacity 1.15s ease, stroke-width 1.15s ease; marker-end: url(#arrow-dim); }
.map-edge.active { stroke: #397b64; opacity: .8; stroke-width: 1.8; marker-end: url(#arrow-active); }.map-edge.focused { stroke: #0d7958; opacity: 1; stroke-width: 2.3; }.map-edge.faded { opacity: .07; }.map-edge.stage-flow { stroke: var(--mint); opacity: 1; stroke-width: 2.8; filter: drop-shadow(0 0 4px rgba(76,211,160,.65)); marker-end: url(#arrow-flow); }.map-edge.drug-flow { stroke: #3189b7; opacity: 1; stroke-width: 3.2; stroke-dasharray: 8 5; marker-end: url(#arrow-drug); filter: drop-shadow(0 0 3px rgba(49,137,183,.45)); animation: drug-path-flow 1.2s linear infinite; }.map-edge.drug-exposure-low { opacity:.38; stroke-width:1.6; }.map-edge.drug-exposure-moderate { opacity:.7; stroke-width:2.4; }.map-edge.drug-exposure-high { opacity:1; stroke-width:3.2; }
@keyframes drug-path-flow { to { stroke-dashoffset: -26; } }
.flow-tracer { fill: none; stroke: var(--acid); stroke-width: 3.1; stroke-linecap: round; stroke-dasharray: 2 18; opacity: .95; animation: pathway-flow 1s linear infinite; pointer-events: none; filter: drop-shadow(0 0 3px rgba(199,243,91,.8)); }
@keyframes pathway-flow { to { stroke-dashoffset: -40; } }
.lane-label { position: absolute; top: 18px; left: var(--x); color: #8c9691; font-size: 8px; letter-spacing: .15em; }
.map-node { position: absolute; width: 184px; min-height: 73px; background: rgba(249,247,241,.97); border: 1px solid rgba(10,25,21,.18); padding: 11px 12px; cursor: pointer; text-align: left; color: var(--ink); box-shadow: 0 5px 12px rgba(10,25,21,.04); transition: border 1.15s ease, transform 1.15s cubic-bezier(.22,.75,.22,1), opacity 1.15s ease, box-shadow 1.15s ease; }
.map-node:hover { transform: translateY(-3px); border-color: #3c8b6d; box-shadow: 0 10px 25px rgba(10,25,21,.09); }.map-node.selected { border: 2px solid #147553; box-shadow: 0 0 0 4px rgba(157,246,208,.34); padding: 10px 11px; }.map-node.faded { opacity: .27; }.map-node.stage-active { opacity: 1; border-color: #168963; transform: translateY(-4px); box-shadow: 0 0 0 5px rgba(157,246,208,.38), 0 14px 28px rgba(10,25,21,.15); animation: node-breathe 1.15s ease-in-out infinite alternate; }.map-node.stage-complete:not(.stage-active) { opacity: .72; background: #effaf5; }.map-node.meal-adjusted { outline: 2px solid rgba(234,191,94,.7); outline-offset: 2px; }.map-node.drug-adjusted.drug-exposure-low { box-shadow:0 0 0 3px rgba(49,137,183,.18); }.map-node.drug-adjusted.drug-exposure-moderate { box-shadow:0 0 0 4px rgba(49,137,183,.28); }.map-node.drug-adjusted.drug-exposure-high { box-shadow:0 0 0 5px rgba(49,137,183,.42); }.map-node.meal-adjusted.drug-adjusted { box-shadow: 0 0 0 4px rgba(140,207,255,.28), 0 0 0 7px rgba(234,191,94,.2); }
.map-stage.medication-map { height: 3500px; }.map-stage.medication-map .edge-layer { height: 3500px; }.med-map-lane { position: absolute; z-index: 1; left: 45px; color: #477d91; font-size: 7px; font-weight: 800; letter-spacing: .16em; }.med-map-lane.primary { top: 2836px; }.med-map-lane.outputs { top: 2985px; }.med-map-lane.safety { top: 3310px; }.combined-organ-node { width: 148px; min-height: 58px; padding: 7px 8px; }.combined-organ-node .node-title { margin-top: 3px; font-size: 12px; }.combined-organ-node .node-note { margin-top: 2px; font-size: 7px; }.combined-organ-node .node-trend { width: 17px; height: 17px; font-size: 10px; }.combined-organ-node .node-code { font-size: 6px; }.medication-main-node { width: 132px; min-height: 60px; padding: 7px 8px; border-color: #91b1bc; background: rgba(250,252,251,.98); box-shadow: 0 4px 12px rgba(24,51,60,.07); }.medication-main-node.drug-exposure-low { opacity:.68; }.medication-main-node.drug-exposure-moderate { box-shadow:0 0 0 3px rgba(49,137,183,.18); }.medication-main-node.drug-exposure-high { box-shadow:0 0 0 5px rgba(49,137,183,.3); }.medication-main-node .node-title { margin-top: 3px; font-size: 12px; }.medication-main-node .node-note { margin-top: 2px; font-size: 6.8px; }.medication-main-node .node-code { font-size: 5.5px; }.medication-main-node.target { border-left: 4px solid #1194c7; }.medication-main-node.signal, .medication-main-node.receptor { border-left: 4px solid #3978a9; }.medication-main-node.outcome { border-left: 4px solid #2c8a68; }.medication-main-node.safety { border-left: 4px solid #d2644b; background: #fff4ef; }.medication-main-node.modifier { border-left: 4px solid #927059; background: #f6eee7; }.medication-main-node .scenario-marker.rx { min-width: 19px; height: 15px; border-radius: 3px; }.organ-map-edge { opacity: .27; }.medication-map-edge { stroke: #6a9aaa; opacity: .55; stroke-width: 1.8; marker-end: url(#arrow-drug); }.medication-map-edge.drug-exposure-low,.cross-layer-edge.drug-exposure-low { opacity:.28; stroke-width:1.2; }.medication-map-edge.drug-exposure-moderate,.cross-layer-edge.drug-exposure-moderate { opacity:.58; stroke-width:1.9; }.medication-map-edge.drug-exposure-high,.cross-layer-edge.drug-exposure-high { opacity:.9; stroke-width:2.7; }.medication-map-edge.secondary { stroke: #a9822f; }.medication-map-edge.safety { stroke: #c26b55; stroke-dasharray: 5 5; }.medication-map-edge.modifier { stroke: #8d705c; stroke-dasharray: 2 6; }.medication-map-edge.complete { opacity: .9; stroke-width: 2.4; }.cross-layer-edge { stroke: #567f9c; stroke-width: 1.7; stroke-dasharray: 4 7; opacity: .52; marker-end: url(#arrow-drug); }.cross-layer-edge.output { stroke: #2c8a68; }.cross-layer-edge.safety { stroke: #c26b55; }.cross-layer-edge.stage-flow { stroke-dasharray: 7 5; }.map-stage.medication-map.player-active .map-edge.medication-map-edge:not(.stage-flow), .map-stage.medication-map.player-active .map-edge.organ-map-edge:not(.stage-flow), .map-stage.medication-map.player-active .map-edge.cross-layer-edge:not(.stage-flow) { opacity: .13; }.map-stage.medication-map.player-active .map-edge.medication-map-edge.complete { opacity: .8; }
.cross-layer-edge.drug-exposure-low { opacity:.28; stroke-width:1.2; }.cross-layer-edge.drug-exposure-moderate { opacity:.58; stroke-width:1.9; }.cross-layer-edge.drug-exposure-high { opacity:.9; stroke-width:2.7; }
.atlas-layer-label { position:absolute; z-index:1; color:#567168; font-size:8px; font-weight:850; letter-spacing:.14em; border-left:4px solid #7fd4b4; padding-left:9px; }.deep-node { width:142px; min-height:62px; padding:7px 8px; background:rgba(252,251,247,.98); }.deep-node .node-title { margin-top:3px; font-size:12px; line-height:1.05; }.deep-node .node-note { margin-top:2px; font-size:6.5px; }.deep-node .node-code { font-size:5.5px; }.deep-node .node-trend { width:17px; height:17px; font-size:10px; }.map-node[data-system="organelle"] { border-left:3px solid #a979d0; }.map-node[data-system="brain"] { border-left:3px solid #8998f0; }.map-node[data-system="kidney"] { border-left:3px solid #58a9c8; }.map-node[data-system="vascular"] { border-left:3px solid #e47e9b; }.map-node[data-system="immune"] { border-left:3px solid #b46b55; }.map-node[data-system="blood"] { border-left:3px solid #b04f58; }.map-node[data-layer="artery"] { background:rgba(252,247,244,.98); }
.scenario-markers { display: inline-flex; gap: 3px; margin-left: auto; }.scenario-marker { min-width: 17px; height: 17px; display: grid; place-items: center; font-size: 6px; font-style: normal; font-weight: 800; border-radius: 50%; }.scenario-marker.meal { background: #f9dda1; color: #684c13; }.scenario-marker.rx { min-width:25px; padding:0 3px; border-radius:9px; background:#d4ecfa; color:#285d73; }.scenario-marker.rx.low { opacity:.55; }.scenario-marker.rx.high { background:#9fd8f1; color:#123f54; }
@keyframes node-breathe { from { box-shadow: 0 0 0 3px rgba(157,246,208,.25), 0 10px 20px rgba(10,25,21,.1); } to { box-shadow: 0 0 0 8px rgba(157,246,208,.12), 0 16px 34px rgba(10,25,21,.17); } }
.map-stage.player-active .map-node:not(.stage-active):not(.stage-complete) { opacity: .18; }.map-stage.player-active .map-edge:not(.stage-flow) { opacity: .06; }.map-stage.player-paused .flow-tracer, .map-stage.player-paused .map-node.stage-active { animation-play-state: paused; }
.node-top { display: flex; align-items: center; justify-content: space-between; gap: 7px; }.node-code { font-size: 7px; font-weight: 750; letter-spacing: .12em; color: #7d8a84; }.node-trend { width: 21px; height: 21px; display: grid; place-items: center; font-size: 12px; font-weight: 900; }.node-title { display: block; margin-top: 5px; font-family: Georgia, serif; font-size: 16px; font-weight: 400; }.node-note { display: block; margin-top: 3px; color: #748079; font-size: 8.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.map-node[data-system="glucose"] { border-left: 3px solid var(--gold); }.map-node[data-system="lipid"] { border-left: 3px solid var(--coral); }.map-node[data-system="hormone"] { border-left: 3px solid var(--blue); }.map-node[data-system="signal"] { border-left: 3px solid #58caa0; }
.detail-panel { background: var(--deep); color: white; padding: 26px 24px; min-height: 710px; }
.detail-kicker { display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.38); font-size: 7px; letter-spacing: .14em; }.evidence-badge { font-size: 6px; padding: 5px 6px; border: 1px solid currentColor; }.evidence-badge.high { color: var(--mint); }.evidence-badge.moderate { color: var(--gold); }
.detail-icon { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--mint); display: grid; place-items: center; color: var(--mint); font-size: 10px; margin-top: 30px; }
.detail-panel h3 { font-family: Georgia, serif; font-size: 38px; font-weight: 400; letter-spacing: -.04em; margin: 14px 0 10px; }.detail-definition { color: rgba(255,255,255,.58); font-size: 12px; line-height: 1.65; min-height: 58px; }
.state-effect, .detail-section { border-top: 1px solid rgba(255,255,255,.13); padding-top: 16px; margin-top: 22px; }.state-effect > span, .detail-section > span { display: block; color: rgba(255,255,255,.34); font-size: 7px; letter-spacing: .15em; margin-bottom: 11px; }.state-effect > div { display: grid; grid-template-columns: 34px 1fr; gap: 12px; }.big-trend { width: 32px; height: 32px; display: grid; place-items: center; font-size: 18px; }.state-effect p, .detail-section p { margin: 0; color: rgba(255,255,255,.76); font-size: 10px; line-height: 1.62; }.detail-section.nuance { border: 1px solid rgba(234,191,94,.22); background: rgba(234,191,94,.06); padding: 14px; }.detail-section.nuance span { color: var(--gold); }.source-jump { display: flex; justify-content: space-between; color: var(--mint); text-decoration: none; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; border-bottom: 1px solid rgba(157,246,208,.35); padding: 13px 0; margin-top: 24px; }

.pathways { background: #e9e6dc; }
.pathway-tools { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 14px; }.search-box { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--ink); min-width: 350px; padding: 10px 0; }.search-box input { border: 0; outline: none; background: transparent; width: 100%; color: var(--ink); font-size: 12px; }.filter-chips { display: flex; gap: 7px; }.filter-chip { border: 1px solid var(--line); background: transparent; padding: 8px 13px; font-size: 9px; cursor: pointer; }.filter-chip.active { background: var(--ink); color: white; }
.pathway-list { border-top: 1px solid var(--ink); }.pathway-row { display: grid; grid-template-columns: 48px 1.05fr 1.3fr .8fr 24px; gap: 20px; align-items: center; padding: 19px 8px; border-bottom: 1px solid var(--line); cursor: pointer; transition: background .2s; }.pathway-row:hover { background: rgba(255,255,255,.38); }.pathway-row > b { color: #87918c; font-size: 9px; }.pathway-name strong { display: block; font-family: Georgia, serif; font-weight: 400; font-size: 17px; }.pathway-name small { color: #78847d; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }.pathway-action { font-size: 10px; line-height: 1.5; color: #3d4b45; }.pathway-impact { font-size: 9px; color: #6b7871; }.pathway-impact i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); margin-right: 6px; }.pathway-row > span:last-child { color: #597269; }.empty-state { padding: 40px; text-align: center; color: var(--muted); }

.resistance { background: var(--deep); color: white; }.resistance-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 10vw; }.eyebrow.light { color: var(--mint); }.resistance h2 { font-family: Georgia, serif; font-size: clamp(48px, 5.4vw, 78px); line-height: .98; letter-spacing: -.055em; font-weight: 400; margin: 0; }.resistance-copy > p { color: rgba(255,255,255,.56); max-width: 490px; font-size: 13px; line-height: 1.7; margin-top: 24px; }.resistance-copy em { color: white; }.loop-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.18); }.loop-list li { display: grid; grid-template-columns: 52px 1fr; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.14); }.loop-list li > b { color: var(--mint); font-size: 9px; }.loop-list strong { display: block; font-family: Georgia, serif; font-size: 18px; font-weight: 400; margin-bottom: 7px; }.loop-list span { color: rgba(255,255,255,.46); font-size: 10px; line-height: 1.55; display: block; max-width: 520px; }

.evidence { background: var(--paper); }.claim-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--line); }.claim-card { min-height: 330px; padding: 25px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; }.claim-head { display: flex; justify-content: space-between; gap: 10px; color: #77827d; font-size: 7px; letter-spacing: .14em; }.verdict { font-style: normal; border: 1px solid currentColor; padding: 4px 5px; }.verdict.partial { color: #39765c; }.verdict.no { color: #a04d3a; }.verdict.context { color: #8a671a; }.verdict.source { color: #2f6d88; }.claim-card h3 { font-family: Georgia, serif; font-size: 24px; line-height: 1.16; font-weight: 400; letter-spacing: -.025em; margin: 34px 0 16px; }.claim-card p { color: #66726c; font-size: 11px; line-height: 1.68; margin: 0 0 24px; }.claim-card a, .plain-link { margin-top: auto; color: #276c53; font-size: 9px; text-decoration: none; border-bottom: 1px solid rgba(39,108,83,.28); padding-bottom: 5px; align-self: flex-start; }.transcript-card { background: #e2f3ed; }

.diagnostic-note { background: var(--acid); display: grid; grid-template-columns: 1.1fr .75fr; gap: 8vw; position: relative; }.diagnostic-note span { font-size: 8px; letter-spacing: .14em; }.diagnostic-note h2 { font-family: Georgia, serif; font-size: clamp(36px, 4vw, 58px); font-weight: 400; letter-spacing: -.045em; line-height: 1; margin: 20px 0 0; }.diagnostic-note p { font-size: 12px; line-height: 1.75; margin: 26px 0 60px; }.diagnostic-note > a { position: absolute; right: max(5vw, 36px); bottom: 58px; font-size: 9px; text-decoration: none; border-bottom: 1px solid var(--ink); padding-bottom: 4px; }

.sources { background: #e9e6dc; }.source-columns { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--ink); }.source-item { display: grid; grid-template-columns: 36px 1fr auto; gap: 13px; padding: 19px 12px 19px 0; border-bottom: 1px solid var(--line); text-decoration: none; }.source-item:nth-child(odd) { border-right: 1px solid var(--line); padding-right: 26px; }.source-item:nth-child(even) { padding-left: 26px; }.source-item > b { color: #7a8780; font-size: 8px; }.source-item strong { display: block; font-family: Georgia, serif; font-size: 15px; font-weight: 400; }.source-item small { display: block; color: #738078; font-size: 8px; margin-top: 5px; line-height: 1.5; }.source-item > span { font-size: 11px; color: #537468; }.video-register { margin-top: 76px; border: 1px solid var(--line); }.video-register-head { background: var(--ink); color: white; padding: 14px 17px; display: flex; justify-content: space-between; font-size: 8px; letter-spacing: .12em; }.video-register-head small { color: rgba(255,255,255,.45); }.video-links a { min-height: 58px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; text-decoration: none; border-bottom: 1px solid var(--line); padding: 0 17px; }.video-links a:last-child { border: 0; }.video-links b { font-size: 8px; color: #78867f; }.video-links span { font-family: Georgia, serif; font-size: 15px; }.video-links i { font-style: normal; font-size: 7px; color: #537468; letter-spacing: .1em; }

/* Insulin subsystem landing and evidence register */
.subsystem-landing { background: #e6eee7; border-top: 1px solid var(--line); }.subsystem-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; border: 1px solid var(--line); }.subsystem-grid > article { min-height: 330px; padding: 30px; border-right: 1px solid var(--line); }.subsystem-grid > article:last-child { border-right: 0; }.subsystem-grid > article > span, .related-system-strip > div > span, .evidence-export > div > span { color: #3d705e; font-size: 8px; font-weight: 700; letter-spacing: .15em; }.subsystem-purpose { background: var(--deep); color: white; }.subsystem-purpose > span { color: var(--mint) !important; }.subsystem-purpose h3 { margin: 26px 0 15px; max-width: 350px; font: 500 31px/1.04 Georgia, serif; }.subsystem-purpose p { color: rgba(255,255,255,.67); font-size: 13px; line-height: 1.65; }.subsystem-purpose .button { margin-top: 19px; font-size: 10px; }.subsystem-prerequisites { background: rgba(255,255,255,.37); }.subsystem-prerequisites ul { list-style: none; padding: 0; margin: 24px 0 0; }.subsystem-prerequisites li { padding: 13px 0; border-top: 1px solid var(--line); color: #53665e; font-size: 12px; line-height: 1.55; }.subsystem-prerequisites b { display: block; color: var(--ink); }.subsystem-legend { background: #d8e9dd; }.subsystem-legend > div { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(10,25,21,.14); }.legend-trend { width: 29px; height: 29px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 16px; }.legend-trend.up { color: #176e54; }.legend-trend.down { color: #9d4638; }.legend-trend.mixed { color: #98711e; }.subsystem-legend p { margin: 0; color: #50655c; font-size: 11px; line-height: 1.4; }.subsystem-legend small { display: block; margin-top: 16px; color: #6a7a72; font-size: 9px; line-height: 1.55; }.related-system-strip { margin-top: 1px; padding: 25px 29px; display: grid; grid-template-columns: 270px 1fr; gap: 32px; background: #f4f1e9; border: 1px solid var(--line); }.related-system-strip h3 { margin: 9px 0 0; font: 500 20px/1.15 Georgia, serif; }.related-system-strip nav { display: flex; flex-wrap: wrap; align-content: center; gap: 8px; }.related-system-strip a { display: inline-flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border: 1px solid #aebfb6; color: #294f40; background: #fbfaf5; text-decoration: none; font-size: 10px; font-weight: 700; }.related-system-strip a:hover, .related-system-strip a:focus { background: var(--mint); border-color: #36705b; }.detail-related { margin: 21px 0 0; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.14); }.detail-related > span { display: block; margin-bottom: 8px; color: #9ddfc6; font-size: 8px; letter-spacing: .12em; }.detail-related a { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.76); text-decoration: none; font-size: 10px; line-height: 1.35; }.detail-related a:hover, .detail-related a:focus { color: var(--mint); }
.evidence-export { margin-top: 70px; padding: 28px; border: 1px solid #93a99e; background: #f8f7f1; }.evidence-export > div:first-child { max-width: 720px; }.evidence-export h3 { margin: 10px 0; font: 500 29px Georgia, serif; }.evidence-export p { color: #53675e; font-size: 12px; line-height: 1.6; }.evidence-export-actions { display: flex; gap: 9px; margin: 21px 0; }.evidence-export-actions button { min-height: 37px; padding: 0 14px; border: 1px solid #326451; background: transparent; color: #173f32; cursor: pointer; font: 700 9px "DM Sans", sans-serif; letter-spacing: .08em; text-transform: uppercase; }.evidence-export-actions button:hover, .evidence-export-actions button:focus { background: var(--mint); }.evidence-audit { margin: 0 0 18px !important; padding: 12px; border-left: 3px solid #367a60; background: #e5f1e9; color: #315849 !important; font-size: 10px !important; }.evidence-table-wrap { overflow: auto; border: 1px solid #9eafa6; max-height: 520px; background: white; }.evidence-table-wrap:focus { outline: 3px solid #155d48; outline-offset: 3px; }.evidence-table { border-collapse: collapse; min-width: 1280px; width: 100%; font-size: 10px; line-height: 1.45; }.evidence-table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }.evidence-table th { position: sticky; top: 0; z-index: 1; background: #10362a; color: white; font-size: 8px; letter-spacing: .06em; text-align: left; }.evidence-table th, .evidence-table td { padding: 10px; border-right: 1px solid #d4ddd7; border-bottom: 1px solid #d4ddd7; vertical-align: top; }.evidence-table tr:nth-child(even) td { background: #f4f7f3; }.evidence-table td a { color: #155e48; }.evidence-table td:nth-child(1) { min-width: 120px; font-weight: 700; }.evidence-table td:nth-child(2) { min-width: 210px; }.evidence-table td:nth-child(3), .evidence-table td:nth-child(9) { min-width: 255px; }
@media (max-width: 980px) { .subsystem-grid { grid-template-columns: 1fr; }.subsystem-grid > article { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line); }.subsystem-grid > article:last-child { border-bottom: 0; }.related-system-strip { grid-template-columns: 1fr; gap: 20px; } }
@media (max-width: 680px) { .subsystem-landing { padding-top: 68px; padding-bottom: 68px; }.subsystem-grid > article { padding: 23px 20px; }.subsystem-purpose h3 { font-size: 27px; }.related-system-strip { padding: 22px 20px; }.related-system-strip nav { display: grid; grid-template-columns: 1fr; }.evidence-export { margin-top: 48px; padding: 20px; }.evidence-export h3 { font-size: 25px; }.evidence-export-actions { display: grid; grid-template-columns: 1fr; }.evidence-export-actions button { width: 100%; }.evidence-table { font-size: 9px; } }
@media print { body { background: white; } .topbar, .hero, .signal-strip, .whole-body, .platform-directory, .subsystem-landing, .atlas, .pathways, .resistance, .evidence > .section-heading, .sources > .section-heading, .source-columns, .video-register, .report-section, .diagnostic-note, footer, dialog, .evidence-export-actions { display: none !important; } .sources { display: block !important; padding: 0 !important; background: white !important; } .evidence-export { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } .evidence-table-wrap { max-height: none !important; overflow: visible !important; border: 0 !important; } .evidence-table { min-width: 0 !important; font-size: 7px !important; } .evidence-table th { position: static !important; background: #eee !important; color: #000 !important; } .evidence-table th, .evidence-table td { padding: 5px !important; } }

footer { background: #061712; color: white; min-height: 160px; padding: 45px max(5vw, 36px); display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: end; }.footer-brand { align-self: start; }.footer-brand .brand-mark i { border-color: var(--mint); }.footer-brand + p { color: rgba(255,255,255,.4); font-family: Georgia, serif; font-size: 17px; margin: 0; }.footer > div { display: flex; flex-direction: column; align-items: flex-end; gap: 9px; color: rgba(255,255,255,.3); font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }.footer-meta .footer-notice { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 12px; color: rgba(255,255,255,.72); font-size: 9px; letter-spacing: .08em; }.footer-notice span + span { padding-left: 12px; border-left: 1px solid rgba(157,246,208,.35); }.footer-review { color: rgba(255,255,255,.38); font-size: 8px; letter-spacing: .1em; }.footer-review time { color: rgba(255,255,255,.64); }.footer-meta nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 13px; margin-top: 5px; }.footer-meta a { color: rgba(255,255,255,.62); text-decoration: none; }.footer-meta a:hover { color: var(--mint); }

@media (max-width: 980px) {
  .hero { grid-template-columns: 1fr; padding-top: 90px; }.hero-console { display: none; }.hero { min-height: 780px; }
  .split-heading, .resistance-grid, .diagnostic-note { grid-template-columns: 1fr; }.split-heading { gap: 26px; }.split-heading > p { max-width: 620px; }.body-map-tools { grid-template-columns: 1fr 1fr; }.body-map-tools > :nth-child(2) { border-right: 0; }.body-map-tools > :nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.14); }.whole-body-map { grid-template-columns: 1fr; }.body-visual-panel { border-right: 0; }.body-system-detail { position: static; min-height: auto; }.map-layout { grid-template-columns: 1fr; }.map-viewport { border-right: 0; }.detail-panel { min-height: auto; }.claim-grid { grid-template-columns: repeat(2, 1fr); }.diagnostic-note > a { position: static; align-self: start; }.diagnostic-note p { margin-bottom: 0; }.source-columns { grid-template-columns: 1fr; }.source-item:nth-child(odd) { border-right: 0; padding-right: 12px; }.source-item:nth-child(even) { padding-left: 0; }.signal-strip { grid-template-columns: repeat(2, 1fr); }.signal-strip div:nth-child(3) { border-left: 1px solid rgba(10,25,21,.18); }.platform-grid, .platform-lanes { grid-template-columns: 1fr; }.platform-card, .platform-lanes > div { border-right: 0; border-bottom: 1px solid var(--line); }.platform-card:last-child, .platform-lanes > div:last-child { border-bottom: 0; }.flow-player { grid-template-columns: 190px 1fr; }.player-controls { grid-column: 1/-1; grid-template-columns: 34px 34px 1fr; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); padding: 8px 14px; }.player-controls label { grid-column: auto; justify-content: flex-end; gap: 12px; }.scenario-grid { grid-template-columns: 1fr; }.meal-composer { border-right: 0; border-bottom: 1px solid var(--line); }.scenario-results { grid-template-columns: repeat(2, 1fr); }.scenario-results > div { border-bottom: 1px solid var(--line); }
}
@media (max-width: 680px) {
  .section-pad { padding: 78px 20px; }.topbar { padding: 0 20px; }.topbar nav { display: none; }.header-cta { font-size: 10px; }
  .hero { padding: 80px 20px 80px; min-height: 690px; }.hero h1 { font-size: 61px; }.hero-lede { font-size: 14px; }.hero-actions { align-items: stretch; flex-direction: column; }.button { justify-content: space-between; }.hero-footnote { left: 20px; right: 20px; }.hero-footnote span { display: none; }
  .account-dialog { padding: 27px 20px; }.visibility-fields { grid-template-columns: 1fr; }
  .profile-card { padding: 20px; }.profile-card-head { display: block; }.profile-card-head .text-button { margin-top: 14px; }
  .signal-strip { padding: 0; }.signal-strip div { min-height: 96px; padding: 20px 14px; }.signal-strip span { font-size: 17px; }.body-map-tools { grid-template-columns: 1fr; }.body-map-tools > * { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }.body-map-tools > :last-child { border-bottom: 0; }.body-visual-panel { grid-template-rows: auto 690px auto; }.body-map-legend { align-items: flex-start; flex-direction: column; gap: 8px; }.body-silhouette { width: 300px; }.body-system-node { --size: 44px; }.body-system-node span { font-size: 7px; max-width: 80px; }.cell-layer { width: 190px; height: 190px; transform-origin: bottom right; scale: .82; }.circulating-layer > div { align-items: flex-start; flex-direction: column; }.circulating-layer ul { grid-template-columns: 1fr 1fr; }.circulating-layer li:nth-child(3n) { border-right: 1px solid #b8c9c0; }.circulating-layer li:nth-child(2n) { border-right: 0; }.circulating-layer li:nth-last-child(-n+3) { border-bottom: 1px solid #b8c9c0; }.circulating-layer li:last-child { border-bottom: 0; }.body-outline-list { grid-template-columns: 1fr; padding: 1px; }.body-system-detail h3 { font-size: 32px; }
  .state-selector { grid-template-columns: 1fr; }.state-tab { border-right: 0; border-bottom: 1px solid var(--line); }.state-tab:last-child { border-bottom: 0; }.scenario-head { padding: 17px; }.scenario-head p { max-width: 240px; }.scenario-grid { grid-template-columns: 1fr; }.meal-composer, .medication-composer { padding: 17px; }.meal-controls, .medication-grid { grid-template-columns: 1fr; }.scenario-results { grid-template-columns: 1fr 1fr; }.result-intro { grid-column: 1/-1; }.scenario-results > div { min-height: 72px; }.scenario-explanation { grid-template-columns: 1fr; }.scenario-impact { border-right: 0; }
  .med-flow-card { padding: 16px; }.med-flow-head { display: block; }.med-flow-head button { margin-top: 12px; }.dose-config,.risk-study-grid { grid-template-columns:1fr; }.absolute-risk-head { display:block; }.absolute-risk-head p { margin-top:8px; text-align:left; }.risk-study { border-right:0; }.integrity-note { grid-template-columns:1fr; }.med-flow-notes { grid-template-columns: 1fr; }.med-flow-chain b { min-width: 118px; }.drug-drilldown { margin-left: -16px; margin-right: -16px; }.drug-drill-head { display: block; padding: 16px; }.drug-drill-head button { margin-top: 13px; }.drug-drill-readout { grid-template-columns: 1fr; gap: 7px; padding: 15px 16px; }.drug-drill-readout > small { grid-column: 1; }.drug-map-canvas { transform-origin: top left; }
  .state-summary > span:last-child { display: none; }.map-actions > #reset-map { display: none; }.atlas-jump { display:none; }.flow-mode-switch > span, .stage-detail-switch > span { display: none; }.flow-mode-switch button, .stage-detail-switch button { padding: 6px; font-size: 6px; }.map-layout { margin-left: -20px; margin-right: -20px; }.detail-panel { padding: 26px 20px; }.map-viewport { max-width: 100vw; }.flow-player { margin-left: -20px; margin-right: -20px; grid-template-columns: 1fr; }.play-button { min-height: 72px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }.player-story { min-height: 112px; }.player-story-top strong, .player-story p { white-space: normal; }.player-controls { grid-column: 1; }.stage-track { gap: 3px; }
  .pathway-tools { align-items: stretch; flex-direction: column; }.search-box { min-width: 0; }.filter-chips { overflow-x: auto; }.pathway-row { grid-template-columns: 30px 1fr 24px; gap: 10px; }.pathway-action, .pathway-impact { display: none; }
  .claim-grid { grid-template-columns: 1fr; }.claim-card { min-height: 290px; }.source-columns { grid-template-columns: 1fr; }.video-register-head small { display: none; }.video-links span { font-size: 13px; }.video-links i { display: none; }.video-links a { grid-template-columns: 30px 1fr; }
  footer { grid-template-columns: 1fr; gap: 26px; padding: 40px 20px; }.footer-brand + p { display: none; }footer > div { align-items: flex-start; }.footer-meta .footer-notice, .footer-meta nav { justify-content: flex-start; }.footer-notice span + span { padding-left: 0; border-left: 0; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { animation: none !important; transition: none !important; } }
@media (prefers-contrast: more) {
  .whole-body { background: #00120d; }.body-map-tools, .whole-body-map, .body-visual-panel, .body-system-detail { border-width: 2px; }.body-system-node { border-width: 2px; box-shadow: 0 0 0 2px white; }.body-system-node span, .body-map-legend, .body-search-wrap label, .segmented-control > span, .body-detail-kicker { font-size: 11px; }.body-system-detail, .body-detail-lede, .body-system-detail a { color: white; }.body-connection-layer line { stroke: #004b35; stroke-width: .45; opacity: 1; }
}
@media (forced-colors: active) {
  .body-system-node, .segmented-control button, .body-search-wrap input { forced-color-adjust: auto; }.body-system-node.active { outline: 4px double Highlight; }.body-connection-layer line { stroke: CanvasText; }.cell-layer { border: 3px solid CanvasText; }
}