@font-face{font-family:Firs;src:url('../firs-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Firs;src:url('../firs-bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--paper:#eeeee9;--ink:#eaf0f3;--cyan:#81d6e1;--muted:#b2c0c8;--line:#ffffff26}
*{box-sizing:border-box}body{margin:0;background:#09141c;color:var(--ink);font:14px/1.55 Firs,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}button:disabled{cursor:default;opacity:.4}button:hover{background:#ffffff24!important}p,h1{margin:0}.page-header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 42px}.wordmark{font-weight:700;font-size:16px;letter-spacing:.035em;display:flex;align-items:center;gap:16px}.wordmark span{font-size:29px;font-style:italic;line-height:1}.page-header p,.back-link{font-size:12px;color:var(--muted)}.divider{margin:0 15px;color:#5f707a}.back-link{border-bottom:1px solid #50616c;padding-bottom:3px}main{padding:0 22px}.stage{position:relative;height:calc(100svh - 180px);min-height:590px;max-height:1040px;overflow:hidden;border-radius:18px;background:#111e2a;isolation:isolate;border:1px solid #ffffff16}#canvas-host{position:absolute;inset:0}canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}canvas.dragging{cursor:grabbing}.scene-top,.scene-bottom{position:absolute;left:34px;right:34px;z-index:2;pointer-events:none}.scene-top{top:28px;display:flex;align-items:flex-start;justify-content:space-between}.eyebrow{font-size:10px;letter-spacing:.23em;line-height:1.4;margin-bottom:9px;color:#c1d3dc}h1{font-size:clamp(26px,3vw,46px);line-height:1.05;font-weight:400;letter-spacing:-.04em}.scene-bottom{bottom:24px;display:flex;justify-content:space-between;gap:20px;align-items:end}.instruction{font-size:11px;line-height:1.5;color:#d4dfe5;max-width:280px;text-shadow:0 1px 7px #000}.toolbar{display:flex;align-items:center;gap:7px;pointer-events:auto;background:#071119a6;border:1px solid #ffffff20;padding:6px;border-radius:32px;backdrop-filter:blur(14px)}.toolbar button,.zoom-controls button{min-height:40px;border:0;background:transparent;color:var(--ink);border-radius:24px;padding:8px 16px;font-size:12px;line-height:1.5;white-space:nowrap}.toolbar button[aria-pressed=true]{background:#dcecf1;color:#091820}.toolbar #pause{display:flex;align-items:center;gap:8px;min-width:103px}.toolbar #pause[aria-pressed=true]{background:transparent;color:var(--ink)}#pause-symbol{font-size:15px;line-height:1}.view-switch{display:flex;border-left:1px solid var(--line);padding-left:6px}.toolbar #speed{min-width:48px;padding:8px 10px}.toolbar #reset{min-width:40px;padding:6px 10px;font-size:21px;line-height:1}.zoom-controls{position:absolute;right:34px;top:50%;display:flex;flex-direction:column;gap:4px;background:#071119a6;border:1px solid var(--line);padding:4px;border-radius:25px;backdrop-filter:blur(8px)}.zoom-controls button{font-size:21px;line-height:1;padding:8px;width:39px}.prototype-note{display:flex;align-items:center;justify-content:space-between;padding:23px 20px 26px;gap:30px;color:#a3b2bd}.prototype-note p{font-size:11px;line-height:1.6;max-width:900px}.note-label{color:#e0e9ed;margin-right:16px}.note-number{font-size:19px;line-height:1;letter-spacing:-.07em;color:#c6d1d8;white-space:nowrap}.loading{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:3;background:#10202c;color:var(--muted);padding:24px;text-align:center}.loading[hidden]{display:none}.loading.error{background:#10202ce8}.stage::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,#030b122b,transparent 23%,transparent 68%,#02080db3)}
@media(max-width:760px){.page-header{height:76px;padding:0 20px;gap:10px}.page-header p{display:none}.wordmark{font-size:13px;gap:10px}.wordmark span{font-size:24px}.back-link{font-size:10px}main{padding:0 10px}.stage{min-height:590px;height:calc(100svh - 116px);max-height:900px;border-radius:14px}.scene-top{left:20px;right:20px;top:22px}h1{font-size:30px}.eyebrow{font-size:9px}.scene-bottom{left:12px;right:12px;bottom:15px;display:flex;flex-direction:column;align-items:center;gap:12px}.instruction{text-align:center;max-width:280px;font-size:10px}.toolbar{gap:2px;padding:5px;border-radius:28px;max-width:100%}.toolbar button{padding:8px 9px;font-size:10px;min-height:40px}.toolbar #pause{min-width:74px;gap:5px;padding:8px}.view-switch{padding-left:3px}.toolbar #speed{min-width:39px;padding:8px 6px}.toolbar #reset{min-width:31px;padding:6px}.zoom-controls{right:17px;padding:3px;top:24%}.zoom-controls button{width:32px;min-height:34px;font-size:20px}.prototype-note{padding:20px 12px 28px;align-items:start}.prototype-note p{font-size:10px;line-height:1.6}.note-label{display:block;margin-bottom:5px}.note-number{font-size:16px}.prototype-note{gap:15px}}

.view-switch button[aria-pressed=true]:hover,.toolbar #speed[aria-pressed=true]:hover{background:#cbe5ec!important}

html.embedded,html.embedded body{height:100%;overflow:hidden}.embedded .page-header,.embedded .prototype-note{display:none}.embedded main{padding:0}.embedded .stage{height:100svh;min-height:0;max-height:none;border:0;border-radius:0}

/* Annotations follow the body, with small circles and labels like the reference. */
.viewpoints{position:absolute;inset:0;z-index:2;pointer-events:none}.viewpoints[hidden],.viewpoint[hidden]{display:none}.viewpoint-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.viewpoint-lines line{stroke:#e8f2f6;stroke-width:1}.viewpoint{position:absolute;left:0;top:0;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:transparent;color:#f0f5f7;display:grid;place-items:center;pointer-events:auto;touch-action:pan-y;z-index:1;will-change:transform}.viewpoint:hover{background:transparent!important;z-index:3}.viewpoint:focus-visible,.viewpoint[aria-pressed=true]{z-index:4}.viewpoint-number{display:grid;place-items:center;width:27px;height:27px;border:1.5px solid #ecf3f4b3;border-radius:50%;background:#071016ba;font-size:12px;line-height:1;font-weight:400;box-shadow:0 1px 5px #0004;transition:background .15s,border-color .15s}.viewpoint:hover .viewpoint-number,.viewpoint:focus-visible .viewpoint-number,.viewpoint[aria-pressed=true] .viewpoint-number{background:#16303ae6;border-color:#eefaff}.viewpoint-label{position:absolute;left:0;top:0;min-width:120px;padding:12px 15px;border-radius:4px;background:#05090de8;color:#f0f5f7;font-size:12px;line-height:1.4;text-align:left;white-space:nowrap;pointer-events:none;opacity:0}.viewpoint.is-labelled .viewpoint-label{opacity:1}
@media(pointer:coarse){.viewpoint{width:44px;height:44px}.viewpoint-number{width:28px;height:28px}.viewpoint-label{min-width:94px;padding:10px 12px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.viewpoint-number,.viewpoint-label{transition:none}}