@font-face{font-family:Manrope;src:url('../assets/Manrope.ttf')}*{box-sizing:border-box}html{background:#f1efe7;scroll-behavior:smooth}body{margin:0;color:#12191a;font:14px Manrope,Arial,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}a:focus-visible,button:focus-visible,#visual:focus-visible{outline:2px solid #ed482f;outline-offset:5px}header{height:90px;position:fixed;inset:0 0 auto;z-index:6;display:flex;align-items:center;padding:0 4vw;gap:20px;background:linear-gradient(#f1efe7 60%,transparent)}.logo{font-size:37px;letter-spacing:-5px;font-weight:700;line-height:1.4}header>span{font-size:8px;letter-spacing:.08em}header nav{margin-left:auto;display:flex;gap:40px;font-size:11px}#stage{position:fixed;inset:90px 0 0;overflow:clip;background:radial-gradient(ellipse at 65% 58%,#fbfaf5,transparent 63%)}.index{position:absolute;left:4vw;right:4vw;top:16px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.03em;padding-top:14px;border-top:1px solid #11171935}.runway{height:430vh}#type{position:absolute;left:3.3vw;right:0;top:12%;height:13vw;z-index:1;pointer-events:none}.type-band{position:absolute;inset:0;line-height:1.03;font-size:12.15vw;letter-spacing:-.078em;font-weight:650;white-space:nowrap;will-change:filter,transform;transform-origin:0 50%}.type-band.small{font-size:11vw}#visual{position:absolute;top:10%;right:-3%;width:77%;height:86%;z-index:2;touch-action:pan-y;cursor:grab;will-change:transform}#visual.dragging{cursor:grabbing}#surface,#poster{position:absolute;width:100%;height:100%;inset:0;object-fit:contain}#surface{opacity:0;transition:opacity .3s}#poster{transition:opacity .5s;transform:scale(1.22)}.caption{position:absolute;left:5.5vw;bottom:15%;width:23%;max-width:330px;z-index:4}#phase-label{font-size:8px;letter-spacing:.08em}h2{font-size:clamp(20px,2vw,31px);font-weight:550;letter-spacing:-.045em;line-height:1.24;margin:20px 0 16px}.caption p{font-size:11px;line-height:1.7;max-width:285px;margin:0;color:#465255}#inspect{font-size:10px;margin-top:23px;border-bottom:1px solid;padding:0 0 8px;display:flex;align-items:center;gap:35px}#inspect span{font-size:17px}.frame-indicator{position:absolute;right:4vw;bottom:14%;display:flex;align-items:center;gap:12px;font-size:8px;z-index:4}.line{width:65px;height:1px;background:#12191a30}.line i{display:block;height:1px;background:#ed482f;width:0}footer{position:absolute;bottom:27px;left:4vw;right:4vw;z-index:5;display:flex;justify-content:space-between;align-items:center;font-size:10px}#hint{font-size:8px;letter-spacing:.065em;color:#465255}body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:9;opacity:.10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}dialog{background:#f1efe7;border:0;padding:22px;max-width:1000px;width:92vw;color:#12191a}dialog::backdrop{background:#151918b0;backdrop-filter:blur(15px)}.dialog-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:15px}.dialog-bar b{font-size:15px;font-weight:550}.dialog-bar p{font-size:11px;color:#465255;margin:6px 0 0}.dialog-bar button{font-size:12px;padding:5px}video{display:block;width:100%;max-height:68dvh;object-fit:contain;background:#ebebeb}.dialog-bottom{display:flex;justify-content:space-between;font-size:10px;margin-top:17px;gap:15px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:850px){header{height:72px;padding:0 22px}header nav{gap:20px}#stage{inset:72px 0 0}.index{left:22px;right:22px}.caption{left:26px;width:28%;bottom:16%}#visual{right:-8%;width:80%;height:80%;top:16%}.frame-indicator{bottom:13%}h2{font-size:22px}.type-band{font-size:12vw}#type{top:16%;left:22px}footer{left:22px;right:22px}}
@media(max-width:600px){header{height:70px;padding:0 20px}.logo{font-size:34px}header>span{display:none}header nav{gap:20px;font-size:10px}#stage{inset:70px 0 0}.index{left:20px;right:20px;top:8px;font-size:8px;padding-top:12px}#type{top:12%;left:16px;height:14vw}.type-band{font-size:12vw}.type-band.small{font-size:11vw}#visual{top:14%;right:-12%;width:118%;height:57%}.caption{left:22px;right:22px;width:auto;max-width:none;bottom:10.5%}#phase-label{font-size:7px}.caption h2{font-size:20px;margin:12px 0 10px;max-width:300px}.caption h2 br{display:none}.caption p{font-size:10px;line-height:1.55;max-width:350px}#inspect{margin-top:12px;padding-bottom:5px;font-size:10px}footer{bottom:17px;left:22px;right:22px;font-size:9px}#hint,.frame-indicator{display:none}.dialog-bottom{flex-wrap:wrap;font-size:9px}dialog{padding:16px}.dialog-bar b{font-size:12px}.dialog-bar p{font-size:10px}}
@media(max-width:600px) and (max-height:740px){#visual{top:16%;height:45%}.caption{bottom:10.5%}.caption h2{font-size:18px}#phase-label{display:none}.caption p{font-size:9px}#inspect{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}#surface{display:none}#poster{opacity:1!important}}

#tools{display:flex;gap:22px;margin-top:16px;font-size:10px;align-items:center}#tools[hidden]{display:none}#tools button{border-bottom:1px solid #12191a33;padding-bottom:4px}#magnify[aria-pressed=true]{color:#b73e1e;border-color:currentColor}@media(max-width:600px){#tools{font-size:9px;margin-top:11px;gap:20px}.caption{bottom:10.5%}}

.anatomy-content{max-width:620px;margin:25px auto}.anatomy-content ol{padding-left:24px}.anatomy-content li{padding:12px 0 12px 8px;border-bottom:1px solid #12191a25}.anatomy-content b{font-size:17px;font-weight:550}.anatomy-content p{font-size:12px;line-height:1.65;color:#465255}.anatomy-note{margin-top:25px}.anatomy-sources a{text-decoration:underline}#anatomy{max-width:760px}#anatomy-open{font-size:10px}@media(max-width:600px){#anatomy-open{font-size:9px}.anatomy-content{margin:12px auto}.anatomy-content b{font-size:15px}.anatomy-content p{font-size:11px}}

.chip-skip{position:fixed;top:-80px;z-index:100;background:#fff;padding:12px}.chip-skip:focus{top:10px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #d34428;outline-offset:5px}

.arrow-icon{width:1em;height:1em;display:inline-block;vertical-align:middle;fill:none}#inspect .arrow-icon{width:24px;height:24px}

@property --yy-trace-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
header nav{align-items:center}header .chip-join{display:inline-flex;align-items:center;gap:9px;position:relative;border:1px solid var(--color-border);border-radius:3px;background:var(--color-bg);padding:10px 13px;min-height:44px;white-space:nowrap}header .chip-join::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--yy-trace-angle),transparent 0deg 180deg,var(--color-accent) 235deg,var(--color-sky) 305deg,transparent 355deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:yy-border-trace 6s linear infinite}@keyframes yy-border-trace{to{--yy-trace-angle:360deg}}@media(max-width:600px){header nav{gap:12px}header .chip-join{padding:8px;font-size:10px}header{gap:12px}}@media(prefers-reduced-motion:reduce){header .chip-join::before{animation:none;background:var(--color-accent)}}
