:root{color-scheme:dark;font-family:"DejaVu Sans",system-ui,sans-serif;color:#edf0e8;background:#091218;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #8ee4d0;outline-offset:4px}
#stage{position:absolute;inset:0 350px 0 0;background:radial-gradient(ellipse at 48% 43%,#182b34 0, #0c1a22 38%, #091218 72%)}canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}
header{position:absolute;left:38px;right:38px;top:32px;display:flex;justify-content:space-between;gap:25px;pointer-events:none}header a{pointer-events:auto}.eyebrow{color:#82dbc8;font-size:11px;letter-spacing:.14em;font-weight:700;margin:0 0 15px}h1{font-size:46px;letter-spacing:-.055em;font-weight:620;line-height:1.05;margin:0}.subtitle{font-size:15px;line-height:1.6;color:#8ea6b1;margin-top:15px;max-width:570px}.top-actions{display:flex;align-items:flex-start;gap:10px}button,.top-actions a{color:#c8d7dd;border:1px solid #2b424d;background:#14242e;border-radius:10px;padding:13px 18px;text-decoration:none;font-size:13px}.primary,button.primary,.top-actions .primary{background:#84dfca;color:#082322;border-color:#84dfca;font-weight:650}.top-actions a:hover,button:hover{filter:brightness(1.12)}
#info{position:absolute;right:38px;top:205px;width:302px;padding:24px 0 20px;background:linear-gradient(90deg,transparent,#091218 25%)}#info h2{font-size:35px;line-height:1.13;letter-spacing:-.045em;font-weight:600;margin:0 0 26px}.rule{height:3px;width:52px;background:#80dbc8;margin:24px 0}#chapter-body{font-size:15px;line-height:1.75;color:#afc0c9}#chapter-body strong{font-weight:600;color:#e8ede8}#chapter-body p{margin:0 0 24px}#chapter-note{font-size:13px;line-height:1.6;color:#8fdfca;border-left:2px solid #60998e;padding-left:15px;margin-top:32px}
#loading{position:absolute;left:30%;top:45%;color:#9bc7c4;font-size:16px;z-index:5}.tissue-controls{position:absolute;bottom:160px;left:38px;display:flex;flex-wrap:wrap;gap:7px;max-width:calc(100% - 420px)}.tissue-controls button{font-size:12px;padding:9px 12px;border-radius:20px}.tissue-controls button[aria-pressed=false]{opacity:.45}.tissue-controls button i{display:inline-block;background:var(--c);width:8px;height:8px;border-radius:50%;margin-right:7px}.view-controls{position:absolute;left:38px;bottom:63px;display:flex;flex-wrap:wrap;gap:8px;max-width:calc(100% - 80px)}.view-controls p{width:100%;font-size:12px;color:#839ba8;margin:5px 0 0}.view-controls button[aria-pressed=true]{border-color:#84dfca}
footer{position:absolute;left:38px;right:38px;bottom:20px;display:flex;justify-content:space-between;gap:12px;color:#78939f;font-size:10px;line-height:1.5}footer a{color:#8ea9b2}#selected{position:absolute;left:38px;top:184px;padding:15px 45px 15px 18px;border:1px solid #41685f;border-radius:9px;background:#10252d;max-width:450px}#selected span{display:block;font-size:10px;letter-spacing:.09em;color:#91d5c4;margin-bottom:8px}#selected strong{font-size:15px;line-height:1.4;font-weight:500}#clear-selection{position:absolute;right:8px;top:10px;background:transparent;border:0;font-size:21px;padding:0 5px}
#labels{position:absolute;inset:0;pointer-events:none}.annotation{position:absolute;font-size:13px;padding:7px 10px;color:#f0eae0;border-left:2px solid #83d7c8;background:#0b202be6;white-space:nowrap;border-radius:0 5px 5px 0;transform:translate(15px,-50%)}.annotation::before{content:"";position:absolute;left:-17px;top:50%;width:15px;height:1px;background:#82cdbb}.annotation .dot{position:absolute;left:-21px;top:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:#b6efde}.annotation[data-tone=nerve]{border-color:#e7c76f;color:#f1dba0}.annotation[data-tone=alert]{border-color:#ec9b82;color:#ffbaa2}#film-extra,#film-progress,#film-time{display:none}
body.mode-film header{left:64px;right:64px;top:42px}body.mode-film h1{font-size:44px}body.mode-film header .eyebrow{font-size:17px;letter-spacing:.12em;margin-bottom:14px}body.mode-film .subtitle{display:none}body.mode-film .top-actions,body.mode-film .view-controls,body.mode-film .tissue-controls,body.mode-film #selected{display:none}body.mode-film #stage{right:660px}body.mode-film #info{right:64px;top:228px;width:556px;background:none;padding:0}body.mode-film #info .eyebrow{font-size:19px;line-height:1.5;margin-bottom:33px}body.mode-film #info h2{font-size:60px;line-height:1.11;margin-bottom:35px}body.mode-film .rule{margin:30px 0 40px;width:78px}body.mode-film #chapter-body{font-size:29px;line-height:1.55}body.mode-film #chapter-body p{margin-bottom:32px}body.mode-film #chapter-note{font-size:24px;line-height:1.5;margin-top:40px;padding-left:20px}body.mode-film .annotation{font-size:23px;padding:9px 14px}body.mode-film footer{left:64px;right:64px;bottom:41px;font-size:15px}body.mode-film #film-progress{display:block;position:absolute;left:64px;right:64px;bottom:20px;height:3px;background:#21353f}body.mode-film #film-progress i{display:block;height:3px;background:#83deca}body.mode-film #film-time{display:block;position:absolute;right:64px;top:58px;color:#a3b5bf;font-size:22px}body.mode-film #film-extra{display:block;position:absolute;bottom:107px;left:64px;width:1080px;pointer-events:none}body.mode-film #film-extra .capsule{display:inline-block;font-size:21px;color:#a7dcd0;border:1px solid #2a4a4b;border-radius:10px;padding:14px 22px;background:#112a2dcc}.film-legend{display:flex;gap:24px;font-size:20px;color:#a3b8bf}.film-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;background:var(--c)}
@media(max-width:900px){header{left:22px;right:22px;top:24px}h1{font-size:35px}.subtitle{font-size:12px;max-width:350px}.top-actions{gap:7px}.top-actions a{font-size:11px;padding:10px}#stage{right:270px}#info{right:22px;width:238px;top:170px}#info h2{font-size:28px}#chapter-body{font-size:13px}.eyebrow{font-size:9px}.tissue-controls{left:22px;max-width:calc(100% - 320px);bottom:165px}.view-controls{left:22px;bottom:73px}.view-controls button{font-size:11px;padding:10px 12px}footer{left:22px;right:22px;font-size:9px}#caveat{max-width:240px}#selected{left:22px;max-width:280px;top:157px}.annotation{font-size:11px}}
@media(max-width:600px){body{overflow:auto;min-height:1070px}header{top:23px;display:block}h1{font-size:39px}.subtitle{font-size:13px;max-width:100%;margin-top:11px}.top-actions{margin-top:17px}.top-actions a{font-size:12px;padding:11px 15px}#stage{left:0;right:0;top:155px;height:535px}#info{top:834px;left:22px;right:22px;width:auto;padding:0;background:none}#info .eyebrow{margin-bottom:12px}#info h2{font-size:25px;line-height:1.2;margin-bottom:12px}#info h2 br{display:none}#info .rule{display:none}#chapter-body{font-size:13px;line-height:1.6}#chapter-body p{margin-bottom:10px}#chapter-note{font-size:12px;margin-top:14px}.tissue-controls{top:646px;bottom:auto;left:22px;right:22px;max-width:100%;gap:6px}.tissue-controls button{font-size:11px;padding:8px 10px}.view-controls{top:745px;bottom:auto;left:22px;right:22px;max-width:100%;gap:7px}.view-controls button{font-size:11px;padding:10px 12px}.view-controls p{font-size:10px}footer{position:relative;left:auto;right:auto;bottom:auto;margin:1090px 22px 20px;display:block;font-size:10px}footer span{display:block;margin-top:8px}#caveat{max-width:100%}#selected{top:213px;left:15px;max-width:320px;padding:11px 40px 11px 14px}#selected strong{font-size:12px}.annotation{font-size:10px;padding:5px 7px}#loading{left:22px;top:410px}}
/* Native 9:16 composition, rendered at 720 × 1280 for phone delivery. */
body.mode-portrait header{left:54px;right:54px;top:38px}
body.mode-portrait h1{font-size:51px}
body.mode-portrait header .eyebrow{font-size:21px;margin-bottom:13px}
body.mode-portrait #film-time{right:54px;top:51px;font-size:23px}
body.mode-portrait #stage{left:0;right:0;top:154px;height:884px}
body.mode-portrait #info{left:54px;right:54px;top:1170px;width:auto}
body.mode-portrait #info .eyebrow{font-size:24px;line-height:1.4;margin-bottom:19px}
body.mode-portrait #info h2{font-size:60px;line-height:1.07;margin-bottom:20px}
body.mode-portrait #info h2 br{display:none}
body.mode-portrait #info h2 br::after{content:' '}
body.mode-portrait .rule{margin:23px 0 25px;width:84px}
body.mode-portrait #chapter-body{font-size:36px;line-height:1.43}
body.mode-portrait #chapter-body p{margin-bottom:22px}
body.mode-portrait #chapter-note{font-size:30px;line-height:1.4;margin-top:24px;padding-left:20px}
body.mode-portrait .annotation{font-size:30px;max-width:880px;white-space:normal;padding:11px 15px}
body.mode-portrait #film-extra{left:54px;right:54px;top:1055px;bottom:auto;width:auto}
body.mode-portrait #film-extra .capsule{font-size:28px;line-height:1.4;padding:15px 20px}
body.mode-portrait .film-legend{font-size:27px;flex-wrap:wrap;gap:17px 26px}
body.mode-portrait footer{left:54px;right:54px;bottom:40px;font-size:18px;display:block}
body.mode-portrait footer span{display:block;margin-top:5px}
body.mode-portrait #film-progress{left:54px;right:54px;bottom:20px}
/* Explanatory 3D film: room for the original headings and comparison details. */
body.mode-portrait header h1{font-size:40px;letter-spacing:-.045em;max-width:780px}
body.mode-portrait #info .eyebrow{font-size:21px;line-height:1.3;letter-spacing:.09em}
body.mode-portrait #chapter-body{font-size:34px;line-height:1.4}
body.mode-portrait #chapter-note{font-size:28px;line-height:1.4}
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:30px;color:#e4dcc9;font-size:25px;text-align:center}
.comparison span{padding:15px 12px;border-top:2px solid #7ed4c4;background:#12232ce6;border-radius:0 0 9px 9px}
.comparison span+span{border-color:#cf9276}
body.mode-portrait.film-ligaments .annotation{width:270px;font-size:27px;line-height:1.35}
body.mode-portrait .annotation::before,body.mode-portrait .annotation .dot{display:none}
.label-leader{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.label-leader line{stroke:#83cbb9;stroke-width:1.5;opacity:.8}
.label-leader circle{fill:#b6efde}