@import url('./tokens.css');
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:2rem}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:var(--text-body);line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:wait}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,canvas:focus-visible,input:focus-visible{outline:2px solid var(--signal);outline-offset:6px}::selection{color:var(--ink);background:var(--signal)}h1,h2,h3,p,figure{margin:0}h1,h2,h3,.display{font-family:var(--font-display);font-weight:600}em{font-style:normal;color:var(--signal)}sup{font:var(--text-data) var(--font-data);vertical-align:super}img{display:block;width:100%;object-fit:cover}.data{font-family:var(--font-data);font-size:var(--text-data);line-height:1.45;letter-spacing:.06em}.skip{position:fixed;top:-5rem;left:1rem;z-index:30;background:var(--signal);color:var(--ink);padding:1rem}.skip:focus{top:1rem}.masthead{height:100px;padding:0 var(--gutter);display:flex;align-items:center;gap:1.6rem;border-bottom:var(--hairline);position:relative;z-index:6}.monogram{font-family:var(--font-body);font-size:2.5rem;letter-spacing:-.12em;line-height:1;font-weight:800;padding-right:.2em}.monogram span{color:var(--signal);margin-left:.05em}.masthead-note{font:var(--text-data)/1.4 var(--font-data);letter-spacing:.04em}.masthead nav{display:flex;align-items:center;gap:2.7rem;margin-left:auto;font-size:var(--text-label)}.masthead nav a{transition:color var(--duration-short)}.masthead nav a:hover{color:var(--signal)}.hero{position:relative;min-height:780px;height:calc(100svh - 100px);max-height:1100px;overflow:hidden;padding:var(--space-4) var(--gutter) 0;background:radial-gradient(ellipse at 69% 50%,#33382c55,transparent 55%),var(--ink)}.hero-topline{display:flex;justify-content:space-between;color:var(--muted)}.hero h1{position:relative;font-size:clamp(6rem,12.5vw,15rem);line-height:.94;letter-spacing:-.018em;z-index:1;margin-top:2.2rem;pointer-events:none}.hero h1>span{color:var(--signal)}.hero-statement{position:absolute;left:var(--gutter);top:52%;z-index:3;display:flex;gap:1.25rem;font-size:var(--text-label)}.crosshair{color:var(--signal);font:2rem/1 var(--font-data)}.scene{position:absolute;right:0;top:18%;width:78%;height:66%;z-index:2;isolation:isolate;scroll-margin-top:6rem}.scene canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y;transition:opacity 700ms;opacity:0}.scene canvas:active{cursor:grabbing}.scene.ready canvas{opacity:1}.scene-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none;color:var(--muted);transition:opacity 600ms}.scene-fallback .display{font-size:clamp(8rem,25vw,24rem);line-height:1;color:var(--surface-raised)}.scene.ready .scene-fallback{opacity:0;visibility:hidden}.scene-meta{position:absolute;right:var(--gutter);top:19%;display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;color:var(--muted);pointer-events:none;z-index:3}.scene-meta span:first-child{color:var(--signal)}.scene-caption{position:absolute;bottom:11%;right:var(--gutter);color:var(--muted);pointer-events:none}.scene-controls{position:absolute;bottom:120px;left:var(--gutter);right:var(--gutter);z-index:4;display:flex;align-items:center;gap:2rem}.view-mode{display:inline-flex;border:var(--hairline);padding:4px;gap:4px}.mode-button{font-size:var(--text-label);border:0;background:transparent;min-height:40px;padding:.45rem 1.2rem;transition:background var(--duration-short),color var(--duration-short)}.mode-button.is-active{background:var(--paper);color:var(--ink)}.mode-button:hover:not(.is-active){background:var(--surface-raised)}.control-text{border:0;border-bottom:1px solid transparent;background:none;padding:.5rem 0;font-size:var(--text-label)}.control-text:hover{border-color:var(--muted)}.control-text span{padding-left:.4rem}.hero-bottom{position:absolute;bottom:0;left:var(--gutter);right:var(--gutter);height:82px;display:flex;align-items:center;justify-content:space-between;border-top:var(--hairline);gap:1rem;z-index:5}.interaction-hint{color:var(--muted);font-size:var(--text-label)}.interaction-hint>span:first-child{font-size:1.5rem;vertical-align:middle;padding-right:.7rem}.explore-link{font-size:var(--text-label);display:flex;gap:2rem;align-items:center}.explore-link span{border:1px solid var(--signal);color:var(--signal);border-radius:50%;width:42px;height:42px;display:grid;place-items:center;font-size:1.2rem;transition:color 200ms,background 200ms}.explore-link:hover span{background:var(--signal);color:var(--ink)}.section-pad{padding:var(--space-8) var(--gutter) var(--space-12)}.section-label{display:flex;justify-content:space-between;gap:1rem;padding-bottom:var(--space-4);border-top:var(--hairline);padding-top:var(--space-3);color:var(--muted)}.section-intro{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin:var(--space-6) 0 var(--space-8);gap:2rem}h2{font-size:clamp(3.8rem,7vw,8rem);line-height:.96;letter-spacing:-.015em}.section-intro p{max-width:440px;justify-self:end;padding-bottom:.4rem;color:var(--muted)}.universe-list{border-top:var(--hairline)}.universe-row{display:grid;grid-template-columns:7% 1fr 26% 6%;align-items:center;padding:1.4rem 0;border-bottom:var(--hairline);position:relative;transition:padding var(--duration-medium) var(--ease-out),color var(--duration-short)}.row-title{font-family:var(--font-display);font-size:clamp(2rem,4.8vw,5rem);line-height:1.15}.row-number,.row-descriptor{color:var(--muted)}.row-descriptor{font-size:var(--text-label)}.row-arrow{font-family:var(--font-body);font-size:2rem;text-align:right;transition:transform var(--duration-medium) var(--ease-out)}.universe-row:hover,.universe-row:focus-visible{color:var(--signal);padding-left:1rem;padding-right:1rem}.universe-row:hover .row-arrow{transform:rotate(45deg)}.automobile{background:var(--paper);color:var(--ink);position:relative;overflow:hidden;min-height:470px}.automobile .section-label{border-color:#a1a799;color:#52584d}.auto-composition{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;padding:var(--space-6) 0;position:relative;z-index:1}.automobile em{color:var(--ink)}.auto-composition>div{max-width:340px;justify-self:end;align-self:center}.auto-composition p{margin-bottom:2rem}.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:1.5rem;border-bottom:1px solid currentColor;padding:.5rem 0;font-size:var(--text-label)}.text-link span{font-size:1.4rem}.giant-index{position:absolute;right:20%;bottom:-.23em;font:600 38rem/.8 var(--font-display);opacity:.045;pointer-events:none}.photo-chapter{position:relative;min-height:640px;height:95svh;max-height:1000px;isolation:isolate;background:var(--surface)}.photo-chapter>img{position:absolute;inset:0;height:100%;z-index:-2}.photo-chapter:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0007,transparent 32%,#000b 100%);z-index:-1}.chapter-top{position:absolute;left:var(--gutter);right:var(--gutter);top:2rem;display:flex;justify-content:space-between;color:#f1f1ec}.chapter-bottom{position:absolute;left:var(--gutter);right:var(--gutter);bottom:var(--space-8);display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;color:#f1f1ec}.chapter-bottom h2{font-size:clamp(4rem,9vw,10rem)}.chapter-bottom em{color:inherit}.chapter-bottom p{max-width:290px;padding-bottom:.7rem}.aero-chapter{padding-top:var(--space-6);padding-bottom:var(--space-8)}.aero-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;padding-top:var(--space-6);align-items:center}.aero-grid p{color:var(--muted);margin-top:2.5rem}.aero-grid figure{margin-top:3rem}.aero-grid img{height:480px;filter:saturate(.55)}figcaption{padding-top:1rem;color:var(--muted)}.space-chapter{height:110svh;max-height:1050px}.space-chapter>img{object-position:center 40%}.space-chapter .chapter-bottom h2{font-size:clamp(5rem,13vw,14rem)}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;padding-top:var(--space-8)}.about-grid>div{max-width:440px;justify-self:end}.about-grid p+p{margin-top:1.6rem}.about-note{color:var(--muted);font-size:var(--text-label);border-top:var(--hairline);padding-top:1.5rem}.system-teaser{background:var(--signal);color:var(--ink);padding-top:2rem}.system-teaser>a{display:flex;justify-content:space-between;align-items:center;font:600 clamp(4rem,10vw,11rem)/.96 var(--font-display);margin:3rem 0 2rem;letter-spacing:-.015em}.system-teaser>a>span:last-child{font-family:var(--font-body);font-size:.8em;transition:transform var(--duration-medium) var(--ease-out)}.system-teaser>a:hover>span:last-child{transform:translate(10px,-10px)}.system-teaser p{font-size:var(--text-label)}.footer{display:flex;gap:2.5rem;align-items:center;padding:2rem var(--gutter);font-size:var(--text-label)}.footer .data{margin-right:auto;color:var(--muted)}.footer a:hover{color:var(--signal)}.noscript-note{position:fixed;bottom:0;left:0;right:0;background:var(--signal);color:var(--ink);padding:1rem;z-index:10}.system-page .masthead{border:0}.system-head{padding:3rem var(--gutter) 4rem;border-bottom:var(--hairline)}.system-head h1{font-size:clamp(5rem,13vw,13rem);line-height:.95;letter-spacing:-.02em;margin:2rem 0}.system-head p{max-width:650px;color:var(--muted)}.system-index{display:flex;gap:2rem;flex-wrap:wrap;font-size:var(--text-label);margin-top:2rem}.system-index a{border-bottom:var(--hairline);padding:.5rem 0}.system-section{padding:3rem var(--gutter) 4rem;border-bottom:var(--hairline)}.system-section h2{font-size:clamp(3rem,5vw,5rem);margin:1.5rem 0 2rem}.system-section>.data{color:var(--signal)}.system-section>p{max-width:760px;color:var(--muted)}.palette{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin:2.5rem 0}.swatch-block{min-height:160px;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;font-size:var(--text-label);border:var(--hairline)}.swatch-block code{font-size:.75rem}.specimens{margin-top:2rem;display:grid;gap:1.5rem}.specimen{padding:2rem 0;border-top:var(--hairline)}.specimen .big-sample{font-family:var(--font-display);font-size:clamp(3rem,8vw,8rem);line-height:1;margin:1.5rem 0}.specimen>p:not(.data){max-width:720px;margin:.8rem 0}.rules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin-top:2rem}.rule h3{font-size:2rem;margin:.5rem 0}.rule p{color:var(--muted);font-size:var(--text-label)}.component-lab{border:var(--hairline);padding:2rem;margin-top:2rem}.component-lab>.data{display:block;color:var(--muted);margin-bottom:1.5rem}.component-lab .universe-row{grid-template-columns:7% 1fr 26% 6%}.motion-lab{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2rem}.motion-demo{padding:2rem;border:var(--hairline)}.motion-demo button{border:var(--hairline);background:var(--paper);color:var(--ink);padding:.7rem 1rem;font-size:var(--text-label)}.motion-track{height:2px;background:var(--line);position:relative;margin:3rem 0}.motion-marker{position:absolute;width:26px;height:26px;top:-12px;left:0;background:var(--signal);transform:translateX(0);transition:transform var(--duration-medium) var(--ease-out)}.motion-track[data-play='true'] .motion-marker{transform:translateX(var(--travel,180px))}.motion-demo p{font-size:var(--text-label);color:var(--muted)}.download-row{display:flex;flex-wrap:wrap;gap:2rem;margin-top:2rem}.code-sample{font-family:var(--font-data);font-size:var(--text-label);background:var(--surface);border:var(--hairline);padding:1.5rem;overflow:auto;line-height:1.8;margin-top:2rem}.credit-list{max-width:850px}.credit-list article{border-bottom:var(--hairline);padding:2rem 0}.credit-list h2{font:600 2rem var(--font-display);margin-bottom:.8rem}.credit-list p{margin:.7rem 0;color:var(--muted)}.credit-list a{text-decoration:underline;text-underline-offset:4px}
@media(min-width:1650px){.hero-statement{top:58%}.scene{top:22%;height:62%}}
@media(max-width:1000px){.masthead nav{gap:1.4rem}.hero{min-height:710px}.hero h1{font-size:13.6vw}.scene{top:26%;width:90%;height:55%}.hero-statement{top:56%;max-width:30%;font-size:.875rem}.scene-meta{top:8%}.scene-caption{bottom:3%}.section-intro{grid-template-columns:1fr}.section-intro p{justify-self:start;max-width:100%}.universe-row{grid-template-columns:8% 1fr 28% 6%}.aero-grid{gap:2rem}.aero-grid img{height:390px}.about-grid{gap:2rem}.palette{grid-template-columns:repeat(3,1fr)}.rules-grid{gap:1.5rem}}
@media(max-width:680px){.masthead{height:80px;gap:1rem}.masthead-note{display:none}.masthead nav{gap:1.1rem;font-size:.875rem}.masthead nav sup{display:none}.monogram{font-size:2rem}.hero{min-height:750px;height:calc(100svh - 80px);padding-top:1.5rem}.hero-topline .data{font-size:.75rem;letter-spacing:0}.hero h1{font-size:15vw;margin-top:2.3rem;line-height:1.02}.hero h1>span{white-space:nowrap}.hero-statement{top:235px;left:var(--gutter);max-width:none;font-size:.875rem;gap:.75rem}.scene{top:285px;left:0;right:0;width:100%;height:290px}.scene-meta{right:var(--gutter);top:0}.scene-caption{bottom:0;font-size:.75rem}.scene-controls{bottom:105px;gap:1.1rem;flex-wrap:wrap}.mode-button{padding:.4rem .9rem}.control-text{font-size:.875rem}#reset-view{margin-left:auto}.hero-bottom{height:82px;align-items:center}.interaction-hint{font-size:.75rem;max-width:125px}.interaction-hint>span:first-child{display:none}.desktop-hint{display:none}.explore-link{font-size:.875rem;gap:.8rem}.explore-link span{width:38px;height:38px}.section-pad{padding:2rem var(--gutter) 3.5rem}.section-label{padding-top:1.2rem;padding-bottom:1.5rem}.section-label>.data:last-child{max-width:45%;text-align:right}.section-intro{margin:1rem 0 2.5rem;gap:1.8rem}h2{font-size:15vw}.section-intro p br{display:none}.universe-row,.component-lab .universe-row{grid-template-columns:10% 1fr 10%;padding:1.2rem 0}.row-title{font-size:9vw}.row-descriptor{display:none}.row-arrow{font-size:1.6rem}.auto-composition{grid-template-columns:1fr;gap:2rem;padding:1rem 0}.auto-composition>div{max-width:100%;justify-self:start}.automobile{min-height:0}.giant-index{font-size:30rem;right:-2rem}.photo-chapter{height:760px;min-height:0;max-height:none}.chapter-top{top:1.5rem;gap:1rem}.chapter-top>span:last-child{max-width:45%;text-align:right}.chapter-bottom{flex-direction:column;align-items:flex-start;gap:1.5rem;bottom:2rem}.chapter-bottom h2{font-size:17vw}.photo-chapter>img{object-position:58% center}.aero-grid{grid-template-columns:1fr;gap:.5rem;padding-top:1rem}.aero-grid p{margin-top:1.5rem}.aero-grid figure{margin-top:1.5rem}.aero-grid img{height:330px}.space-chapter{height:800px}.space-chapter .chapter-bottom h2{font-size:23vw}.about-grid{grid-template-columns:1fr;padding-top:1rem}.system-teaser>a{font-size:16vw;margin-top:2rem}.footer{gap:1rem;flex-wrap:wrap;padding:1.5rem var(--gutter)}.footer .data{margin-right:0;flex:1}.footer>a:last-child{margin-left:auto}.palette{grid-template-columns:1fr 1fr}.swatch-block{min-height:150px}.rules-grid,.motion-lab{grid-template-columns:1fr}.component-lab{padding:1rem}.system-head{padding:2rem var(--gutter) 3rem}.system-section{padding:2rem var(--gutter) 3rem}.system-head h1{font-size:18vw}.system-head p{font-size:1rem}}
@media(prefers-reduced-motion:reduce){html:not([data-motion='full']){scroll-behavior:auto}html:not([data-motion='full']) *,html:not([data-motion='full']) *:before,html:not([data-motion='full']) *:after{transition:none!important;animation:none!important}}html[data-motion='reduced']{scroll-behavior:auto}html[data-motion='reduced'] *,html[data-motion='reduced'] *:before,html[data-motion='reduced'] *:after{transition:none!important;animation:none!important}

/* The sandbox is a full member of the portfolio navigation. */
.masthead nav{flex-wrap:wrap;row-gap:.5rem}.masthead nav .sandbox-link{color:var(--signal)}
@media(max-width:760px){.masthead nav{column-gap:1rem}.masthead:has(.sandbox-link){height:auto;min-height:80px;padding-block:1rem}.masthead nav .sandbox-link{display:inline-block}}