@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Thin.ttf");font-weight:100}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Extralight.ttf");font-weight:200}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Light.ttf");font-weight:300}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Regular.ttf");font-weight:400}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Medium.ttf");font-weight:500}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Semibold.ttf");font-weight:600}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Bold.ttf");font-weight:700}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Extrabold.ttf");font-weight:800}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Heavy.ttf");font-weight:850}@font-face{font-family:Relay;src:url("fonts/MSRelaySans-Black.ttf");font-weight:900}
:root{--bg:#f1f1ed;--ink:#101010;--line:1px solid rgba(16,16,16,.45);--pad:clamp(16px,2.2vw,36px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Relay,Arial,sans-serif}.site-header,footer{display:flex;justify-content:space-between;gap:24px;padding:18px var(--pad);border-bottom:var(--line);font-size:14px}.site-header{position:sticky;top:0;z-index:10;background:rgba(241,241,237,.94);backdrop-filter:blur(10px)}a{color:inherit;text-decoration:none}nav{display:flex;gap:24px}.hero{min-height:88svh;padding:var(--pad);display:flex;flex-direction:column;justify-content:space-between}.hero h1{margin:0;font-size:clamp(84px,18vw,330px);font-weight:900;line-height:.86;letter-spacing:-.045em}.hero p{max-width:700px;margin:0;font-size:clamp(15px,1.25vw,22px);line-height:1.25;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}.tester{border-bottom:var(--line)}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:16px var(--pad);border-bottom:var(--line)}label{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;font-size:12px}select,input{width:100%;font:inherit;background:transparent;border:0}.tester-text{min-height:56svh;padding:var(--pad);font-size:120px;font-weight:400;line-height:.9;letter-spacing:0;overflow-wrap:anywhere;outline:0}.section-heading{display:flex;justify-content:space-between;align-items:end;padding:18px var(--pad);border-bottom:var(--line)}.section-heading h2{margin:0;font-size:clamp(48px,8vw,140px);line-height:.85}.weight-list article{padding:14px var(--pad) 24px;border-bottom:var(--line);font-weight:var(--weight)}.weight-list span{font-size:12px}.weight-list p{margin:12px 0 0;font-size:clamp(42px,7vw,128px);line-height:.86;letter-spacing:-.04em}.glyphs{border-bottom:var(--line)}.glyphs>p{margin:0;padding:var(--pad);font-size:clamp(34px,6vw,105px);line-height:1.05;overflow-wrap:anywhere}footer{border-bottom:0;border-top:var(--line)}
.relay-star{position:relative;top:-1.35em;left:-.55em;display:inline-block;margin-right:-.55em;font-size:.336em;vertical-align:baseline;letter-spacing:0;animation:relay-star-spin 7s linear infinite}@keyframes relay-star-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.relay-star{animation:none}}
.relay-mechanik{--relay-card-pad:clamp(14px,1.25vw,24px);--relay-meta-height:calc(10px + 2 * var(--relay-card-pad));overflow:hidden;border-bottom:var(--line)}.relay-mechanik-word{padding:clamp(10px,1.2vw,22px) var(--pad) clamp(24px,3vw,54px);font-size:clamp(126px,29vw,560px);font-weight:900;line-height:.72;letter-spacing:-.085em;white-space:nowrap}.relay-mechanik-panels{display:grid;grid-template-columns:repeat(3,1fr);padding:0 var(--pad) var(--pad)}.relay-mechanik-card{position:relative;display:grid;grid-template-rows:var(--relay-meta-height) minmax(0,1fr) var(--relay-meta-height);min-height:clamp(300px,38vw,720px);overflow:hidden;border:var(--line);border-right:0;background:var(--bg)}.relay-mechanik-card:last-child{border-right:var(--line)}.relay-mechanik-card>header,.relay-mechanik-card>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--relay-meta-height);padding:var(--relay-card-pad);font-size:10px;line-height:1;text-transform:uppercase}.relay-mechanik-card>header{border-bottom:var(--line)}.relay-mechanik-card>footer{margin:0;border-top:var(--line)}.relay-rotating-arrow{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:var(--relay-card-pad);font-size:clamp(210px,30vw,570px);font-weight:900;line-height:1}.relay-rotating-arrow canvas{display:block;width:1em;height:1em;transform-origin:50% 50%;animation:relay-arrow-spin 18s linear infinite}.relay-rotating-arrow small{position:absolute;bottom:var(--relay-card-pad);left:50%;font-size:10px;font-weight:400;line-height:1;transform:translateX(-50%)}.relay-layered-r{display:grid;place-items:center;padding:var(--relay-card-pad);font-size:clamp(210px,30vw,570px);font-weight:900;line-height:.72;letter-spacing:-.08em;cursor:ew-resize;transition:font-weight .22s ease}.relay-weight-controls button{flex:1;min-height:0;margin:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer}.relay-weight-controls button.is-active{text-decoration:underline;text-underline-offset:3px}.relay-status-field{display:flex;flex-direction:column;justify-content:flex-end;padding:var(--relay-card-pad)}.relay-status-field strong{font-size:clamp(76px,10vw,190px);font-weight:600;line-height:.75;letter-spacing:-.07em}.relay-status-field span{align-self:flex-end;font-size:10px;text-transform:uppercase}.relay-pictogram-cycle{position:relative;align-items:center;justify-content:center}.relay-pictogram-cycle strong{font-size:clamp(160px,22vw,420px);font-weight:900;line-height:.8;letter-spacing:0;transition:opacity .2s ease}.relay-pictogram-cycle #relay-cycle-code{position:absolute;bottom:var(--relay-card-pad);left:50%;align-self:auto;transform:translateX(-50%)}.relay-pictogram-cycle.is-changing strong{opacity:0}@keyframes relay-arrow-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.relay-rotating-arrow canvas{animation:none}}
.wayfinding-intro{display:grid;grid-template-columns:minmax(250px,27%) minmax(0,1fr);gap:clamp(26px,4vw,72px);padding:clamp(34px,4vw,72px) var(--pad) clamp(70px,8vw,150px);border-bottom:var(--line)}.wayfinding-copy h2{margin:0 0 16px;font-size:clamp(30px,2.6vw,50px);line-height:1}.wayfinding-copy p{margin:0 0 20px;max-width:510px;font-size:clamp(13px,1.05vw,18px);line-height:1.28}.wayfinding-copy dl{margin:34px 0 0;font-size:clamp(12px,.9vw,16px);line-height:1.35}.wayfinding-copy dl div{margin-top:24px}.wayfinding-copy dt{font-weight:700}.wayfinding-copy dd{margin:3px 0 0}.wayfinding-demo{--sign-module-height:clamp(125px,9vw,160px);min-width:0;padding-top:clamp(55px,8vw,150px)}.wayfinding-display{display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,2vw,34px);font-size:clamp(130px,20vw,380px);font-weight:900;line-height:.72;letter-spacing:-.07em;white-space:nowrap}.wayfinding-display strong{display:flex;align-items:baseline;font-weight:900}.wayfinding-display .wayfinding-lower-a{margin-left:.012em}.direction-arrow{display:inline-block;flex:0 0 auto;color:var(--ink);font-size:1em;font-weight:900;line-height:1;letter-spacing:0}.wayfinding-signs{display:flex;flex-direction:column;gap:clamp(22px,3vw,52px);margin-top:clamp(32px,4vw,70px)}.wayfinding-sign-row{display:grid;grid-template-columns:1fr 3fr;align-items:stretch;height:var(--sign-module-height)}.direction-sign,.wayfinding-sign-spacer{height:100%;border:var(--line);border-top:clamp(8px,.7vw,13px) solid var(--ink)}.direction-sign{display:flex;align-items:center;padding:clamp(20px,2.1vw,38px);font-size:clamp(28px,3vw,58px);font-weight:800;line-height:.96;letter-spacing:-.04em;white-space:nowrap}.wayfinding-sign-row>:nth-child(2){border-left:0}.sign-exit{justify-content:center;text-align:center}.sign-museum{justify-content:flex-end;gap:.14em;text-align:right}.sign-way-out{gap:.18em}.sign-shard{gap:.18em;white-space:normal}.sign-jubilee{justify-content:flex-end;gap:.18em}.direction-arrow-small{display:grid;place-items:center;align-self:center;width:1em;height:1em;font-size:.82em;line-height:1}.direction-arrow-tiny{font-size:.72em;vertical-align:middle}
.kerning-lab{--k-weight:700;--k-size:160;--k-tracking:0;background:#050505;color:#f5f5ef;border-bottom:1px solid #444;overflow:hidden}.kerning-toolbar{display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:28px;padding:24px var(--pad) 42px;border-bottom:1px solid #555}.kerning-toolbar h2{margin:6px 0 0;font-size:clamp(38px,5vw,82px);line-height:.9}.kerning-toolbar span,.kerning-toolbar label,.kerning-input-label{font-size:12px}.kerning-input-label{display:block;padding:16px var(--pad) 6px}.kerning-source{display:block;width:calc(100% - 2 * var(--pad));margin:0 var(--pad) 30px;padding:8px 0;color:#fff;border-bottom:1px solid #777;font-size:18px;outline:0}.kerning-glyphs{display:flex;align-items:flex-start;flex-wrap:wrap;padding:0 var(--pad) 70px}.kerning-glyph{position:relative;display:flex;align-items:flex-end;height:calc(var(--k-size) * 1px + 48px);border-left:1px solid #777}.kerning-glyph:last-child{border-right:1px solid #777}.kerning-glyph-value{position:absolute;top:0;left:3px;font:10px Arial,sans-serif}.kerning-glyph-character{display:block;color:#fff;font-family:Relay,sans-serif;font-size:calc(var(--k-size) * 1px);font-weight:var(--k-weight);line-height:.9;letter-spacing:calc(var(--k-tracking) * 1px);white-space:nowrap}
.kerning-toolbar{align-items:start}.kerning-toolbar h2{font-size:clamp(30px,3vw,54px);line-height:1}.kerning-toolbar>label{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 20px;align-items:center;align-content:start;gap:8px 12px}.kerning-toolbar>label output{grid-column:2;text-align:right}.kerning-toolbar>label input{grid-column:1/-1;grid-row:2;width:100%;align-self:center}
.pictograms{border-bottom:var(--line)}.pictogram-reveal{position:relative;height:min(70vw,820px);min-height:520px;overflow:hidden;background:var(--bg);border-bottom:var(--line);touch-action:none}.pictogram-outline,.pictogram-fill{position:absolute;inset:0;display:grid;place-items:center;font-size:min(54vw,720px);font-weight:900;line-height:1}.pictogram-outline{color:transparent;-webkit-text-stroke:clamp(2px,.24vw,5px) var(--ink)}.pictogram-fill{clip-path:inset(0 calc(100% - var(--reveal)) 0 0);background:#050505;color:var(--bg)}.pictogram-reveal-control{position:absolute;z-index:3;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.pictogram-divider{position:absolute;z-index:2;top:0;bottom:0;left:var(--reveal);width:1px;background:var(--bg);pointer-events:none}.pictogram-divider:after{content:"↔";position:absolute;top:50%;left:50%;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#050505;color:var(--bg);font-size:20px;transform:translate(-50%,-50%)}.pictogram-poster-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;border-bottom:var(--line);font-size:9px}.pictogram-poster-meta>span{padding:10px 16px}.pictogram-poster-copy{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}.pictogram-poster-copy p{margin:0;max-width:none;padding:12px 16px 20px;font-size:10px;line-height:1.15}.pictogram-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:18px var(--pad) 26px;gap:12px 28px}.pictogram-grid span{display:grid;place-items:center;min-height:24vw;cursor:pointer;transition:background-color .18s ease,color .18s ease}.pictogram-grid b{font-size:clamp(140px,19vw,360px);font-weight:700;line-height:1}.pictogram-grid [data-symbol="❷"] b,.pictogram-grid [data-symbol="④"] b,.pictogram-grid [data-symbol="↑"] b,.pictogram-grid [data-symbol="⮊"] b{font-weight:900}.pictogram-grid span:hover,.pictogram-grid span.is-active{background:#050505;color:var(--bg)}.pictogram-poster-meta-bottom{border-top:var(--line);border-bottom:0}
input[type="range"]{appearance:none;-webkit-appearance:none;height:1px;background:#111;outline:none}input[type="range"]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;border:0;border-radius:50%;background:#111;cursor:pointer}input[type="range"]::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#111;cursor:pointer}.kerning-lab input[type="range"]{background:#fff}.kerning-lab input[type="range"]::-webkit-slider-thumb{background:#fff}.kerning-lab input[type="range"]::-moz-range-thumb{background:#fff}
.pictogram-reveal .pictogram-reveal-control{height:100%;background:transparent}
h2{font-weight:400;text-align:left}.section-heading{display:block}.section-heading>span{display:block;margin-bottom:10px}.section-heading h2{font-size:clamp(28px,4vw,70px);font-weight:400;line-height:1;text-align:left}.kerning-toolbar h2{font-weight:400;text-align:left}
.characters{border-bottom:var(--line)}.character-browser{display:grid;grid-template-columns:1fr 1fr}.character-preview{position:sticky;top:51px;align-self:start;height:calc(100svh - 51px);display:grid;place-items:center;overflow:hidden}.character-preview>#character-preview-value{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}#character-preview-canvas{position:absolute;inset:0;width:100%;height:100%}.character-metrics{position:absolute;z-index:1;inset:0;pointer-events:none}.metric{position:absolute;left:var(--pad);right:var(--pad);display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;font-size:10px}.metric i{height:1px;background:rgba(16,16,16,.42)}.character-code{position:absolute;z-index:2;bottom:18px;display:flex;gap:18px;font-size:11px}.character-list{border-left:var(--line)}.character-grid{display:grid;grid-template-columns:repeat(6,1fr)}.character-grid span{display:grid;place-items:center;aspect-ratio:1;border-right:var(--line);border-bottom:var(--line);font-size:clamp(20px,2.5vw,46px);cursor:pointer}.character-grid span:nth-child(6n){border-right:0}.character-grid span:hover,.character-grid span:focus-visible,.character-grid span.is-selected{background:#111;color:var(--bg)}
@media(max-width:650px){nav{display:none}.hero{min-height:58svh}.hero h1{font-size:clamp(72px,24vw,112px)}.relay-mechanik-word{font-size:31vw;padding-top:16px}.relay-mechanik-panels{grid-template-columns:1fr;gap:10px}.relay-mechanik-card{min-height:88vw}.relay-layered-r{font-size:78vw}.relay-status-field strong{font-size:24vw}.wayfinding-intro{grid-template-columns:1fr;gap:22px;padding-bottom:54px}.wayfinding-copy p{font-size:14px}.wayfinding-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.wayfinding-demo{padding-top:20px}.wayfinding-display{justify-content:flex-start;font-size:31vw}.wayfinding-signs{margin-top:38px;gap:18px}.wayfinding-sign-row{grid-template-columns:1fr}.wayfinding-sign-spacer{display:none}.wayfinding-sign-row .direction-sign+ .direction-sign{border-left:var(--line)}.direction-sign{min-height:90px;padding:20px;font-size:clamp(34px,11vw,54px)}.sign-way-out{transform:none}.kerning-toolbar{grid-template-columns:1fr;gap:18px;padding-bottom:28px}.kerning-glyphs{padding-bottom:44px}.controls{grid-template-columns:1fr;gap:18px}.tester-text{min-height:38svh;font-size:64px}.pictogram-reveal{height:80vw;min-height:300px}.pictogram-outline,.pictogram-fill{font-size:58vw}.pictogram-grid{grid-template-columns:repeat(2,1fr)}.pictogram-grid span{min-height:48vw;font-size:28vw}.pictogram-grid span:nth-child(2n){border-right:0}.pictogram-grid span:nth-last-child(-n+4){border-bottom:var(--line)}.pictogram-grid span:nth-last-child(-n+2){border-bottom:0}.section-heading{align-items:flex-start;flex-direction:column;gap:14px}.character-browser{grid-template-columns:1fr}.character-preview{position:relative;top:auto;height:50svh;border-bottom:var(--line)}.character-list{border-left:0}.character-grid{grid-template-columns:repeat(5,1fr)}.character-grid span{font-size:7vw}.character-grid span:nth-child(6n){border-right:var(--line)}.character-grid span:nth-child(5n){border-right:0}footer{flex-direction:column}}
.pictogram-grid [data-symbol="↗"] b{font-weight:900}
.pictogram-grid [data-symbol="🅖"] b{font-weight:900}
.wayfinding-copy,.wayfinding-copy *{font-variant-ligatures:none!important;font-feature-settings:"liga" 0,"clig" 0,"dlig" 0,"hlig" 0,"rlig" 0,"calt" 0!important}
@media(max-width:650px){.wayfinding-sign-row{height:auto}.wayfinding-sign-row .direction-sign{height:90px;min-height:90px}.wayfinding-sign-spacer{display:none}}
.character-preview .metric{grid-template-columns:auto 1fr auto;color:#555;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1}.character-preview .metric-ascender{top:7%}.character-preview .metric-cap{top:25.2%}.character-preview .metric-x{top:36.4%}.character-preview .metric-baseline{top:74.1%}.character-preview .metric-descender{top:93%}.character-preview .character-code{bottom:2.5%;left:50%;transform:translateX(-50%);color:#555;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
@media(min-width:651px){.wayfinding-signs{grid-template-columns:1fr 3fr;column-gap:0;row-gap:clamp(26px,3vw,52px)}.direction-sign{min-height:125px;padding:22px 24px;line-height:.9}.sign-exit{font-size:clamp(26px,2.46vw,43px)}.sign-museum{font-size:clamp(38px,4vw,70px);letter-spacing:-.045em}.sign-museum .direction-arrow-small{font-size:clamp(72px,7.43vw,130px)}.sign-way-out,.sign-shard,.sign-jubilee{font-size:clamp(26px,2.46vw,43px)}.sign-way-out .direction-arrow-tiny,.sign-shard .direction-arrow-tiny,.sign-jubilee .direction-arrow-tiny{font-size:1em;line-height:.8}}

@media(min-width:651px){
  .wayfinding-display{gap:clamp(4px,.7vw,12px)}
  .sign-museum,.sign-jubilee{padding-right:14px}
  .sign-way-out,.sign-shard,.sign-jubilee{font-size:clamp(26px,2.46vw,43px)}
  .sign-shard .direction-arrow-tiny,.sign-jubilee .direction-arrow-tiny{font-size:1em}
  .wayfinding-sign-row:nth-child(2){grid-template-columns:1fr 1fr;margin-left:25%}
  .wayfinding-sign-row-last{grid-template-columns:1fr;margin-left:62.5%}
  .wayfinding-sign-row-last .wayfinding-sign-spacer{display:none}
  .wayfinding-sign-row-last .sign-jubilee{border-left:var(--line)}
  .wayfinding-sign-row-number{--number-sign-gap:clamp(22px,3vw,52px);display:flex;gap:var(--number-sign-gap);width:max-content;margin-left:auto}
  .wayfinding-sign-row-number .sign-number{flex:0 0 var(--sign-module-height);width:var(--sign-module-height);height:var(--sign-module-height);justify-content:center;padding:10px;font-size:clamp(56px,6vw,116px);text-align:center}
  .wayfinding-sign-row-number .sign-number>span{display:block;transform:translateY(.06em)}
  .wayfinding-sign-row-number .sign-number+.sign-number{border-left:var(--line)}
}
.pictogram-grid{gap:0;padding:0;border-top:var(--line)}.pictogram-grid span{position:relative;min-height:27vw;overflow:hidden;border-right:var(--line);border-bottom:var(--line)}.pictogram-grid span:nth-child(4n){border-right:0}.pictogram-grid span:nth-last-child(-n+4){border-bottom:0}.pictogram-grid span::after{content:attr(data-code);position:absolute;top:14px;left:16px;font-size:11px;font-weight:400;line-height:1;letter-spacing:0}.pictogram-grid b{font-size:clamp(170px,22vw,420px)}.pictogram-grid span:hover::after,.pictogram-grid span.is-active::after{color:var(--bg)}
@media(max-width:650px){.pictogram-grid span{min-height:52vw}.pictogram-grid span:nth-child(4n){border-right:var(--line)}.pictogram-grid span:nth-child(2n){border-right:0}.pictogram-grid span:nth-last-child(-n+4){border-bottom:var(--line)}.pictogram-grid span:nth-last-child(-n+2){border-bottom:0}.pictogram-grid b{font-size:clamp(120px,43vw,220px)}}

.direction-arrow-small,.direction-arrow-tiny{display:inline-grid;place-items:center;align-self:center;flex:0 0 auto;width:1em;height:1em;line-height:1;text-align:center;vertical-align:middle}

.hero h1,.sign-jubilee{font-feature-settings:"ss01" 1}

body{font-feature-settings:"ss01" 1}
.hero p{font-feature-settings:"ss01" 1,"liga" 0,"clig" 0}
.pictogram-poster-copy{font-feature-settings:"ss01" 1,"liga" 0,"clig" 0}
.wayfinding-copy,.wayfinding-copy *{font-feature-settings:"ss01" 1,"liga" 0,"clig" 0,"dlig" 0,"hlig" 0,"rlig" 0,"calt" 0!important}

.wayfinding-display>.direction-arrow{margin-right:-.08em}
.wayfinding-display strong{letter-spacing:0}
.wayfinding-display .wayfinding-three{margin-right:-.045em}
.wayfinding-display .wayfinding-lower-a{margin-left:-.055em}

@media(min-width:651px){
  .wayfinding-demo{padding-top:0}
  .sign-way-out,.sign-shard,.sign-jubilee{align-items:flex-start;gap:.18em;padding-top:20px}
  .sign-way-out .direction-arrow-tiny,.sign-shard .direction-arrow-tiny,.sign-jubilee .direction-arrow-tiny{align-self:flex-start;width:1em;height:1em;margin-top:0;font-size:1em;line-height:1}
  .sign-shard{line-height:1.08;white-space:nowrap}
}

.wayfinding-signs .direction-sign{font-weight:700}
.wayfinding-signs .sign-way-out{font-weight:850}

.wayfinding-copy h2{font-size:clamp(21px,1.82vw,35px)}
.wayfinding-copy p{font-size:clamp(10px,.735vw,12.6px)}
.wayfinding-copy dl{font-size:clamp(9px,.63vw,11.2px)}
.wayfinding-copy{width:78%;max-width:360px}
@media(max-width:650px){.wayfinding-copy{width:100%;max-width:none}}
@media(max-width:650px){.wayfinding-sign-row-number{--number-sign-gap:18px;grid-template-columns:repeat(2,90px);column-gap:var(--number-sign-gap);width:max-content;margin-left:auto}.wayfinding-sign-row-number .sign-number{width:90px;height:90px;justify-content:center;padding:10px;text-align:center}.wayfinding-sign-row-number .sign-number+.sign-number{border-left:var(--line)}}
.enclosed-characters{border-bottom:var(--line)}
.enclosed-characters .section-heading>span{font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}
.enclosed-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:var(--pad)}
.enclosed-card{min-width:0;border:var(--line)}
.enclosed-glyph{display:flex;align-items:center;justify-content:center;aspect-ratio:1;overflow:hidden;background:#050505;color:var(--bg);font-family:Relay,sans-serif;font-size:clamp(120px,20vw,380px);font-weight:900;line-height:1;text-align:center}
.enclosed-glyph canvas{display:block;width:100%;height:100%}
.enclosed-card>footer{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-top:var(--line);font-size:10px;line-height:1;text-transform:uppercase}
.enclosed-card code{padding:2px 4px;background:#050505;color:var(--bg);font:inherit;white-space:nowrap}
@media(max-width:650px){.enclosed-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.enclosed-glyph{font-size:clamp(100px,40vw,190px)}.enclosed-card>footer{align-items:flex-start;flex-direction:column}}

.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.system-alignment{padding:clamp(30px,3vw,58px) var(--pad) clamp(34px,4vw,76px);overflow:hidden;border-bottom:var(--line)}
.system-alignment-copy{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,4vw,72px);margin-bottom:clamp(54px,6vw,110px)}
.system-alignment-copy p{margin:0;font-size:clamp(11px,.75vw,14px);line-height:1.18;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}
.system-alignment-display{width:calc(100% + 2 * var(--pad));margin-inline:calc(-1 * var(--pad));font-size:clamp(52px,6.8vw,130px);font-weight:900;line-height:1.08;font-variant-ligatures:common-ligatures;font-feature-settings:"liga" 1,"clig" 1}
.system-alignment-display>div{display:flex;align-items:baseline;min-height:1.08em;white-space:nowrap}
.system-alignment-display>div>span{display:inline-block;transform-origin:left center}
.system-alignment-display>div:nth-child(1)>span{letter-spacing:.022em}
.system-alignment-display>div:nth-child(2)>span{letter-spacing:-.012em}
.system-alignment-display>div:nth-child(3)>span{letter-spacing:0}
.system-alignment-display>div:nth-child(4)>span{letter-spacing:-.027em}
.system-alignment-display>div:nth-child(5)>span{letter-spacing:-.029em}
.system-alignment-display>div:nth-child(6)>span{letter-spacing:-.024em}
.system-alignment-display>div:nth-child(7)>span{letter-spacing:-.037em}
.system-alignment-display>div:nth-child(8)>span,.system-alignment-display>div:nth-child(9)>span{font-size:.923em;letter-spacing:-.04em}
.system-alignment-display>div:nth-child(10)>span{font-size:.962em;letter-spacing:-.026em}
@media(max-width:650px){.system-alignment{padding-block:28px 38px}.system-alignment-copy{grid-template-columns:1fr 1fr;gap:24px 18px;margin-bottom:46px}.system-alignment-copy p{font-size:10px;line-height:1.2}.system-alignment-display{font-size:12.4vw;line-height:1.08;letter-spacing:-.06em}}

.weight-system{border-bottom:var(--line)}
.weight-system-copy{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,92px);width:50%;padding:clamp(26px,3vw,54px) var(--pad) clamp(44px,5vw,92px)}
.weight-system-copy p{margin:0;font-size:clamp(10px,.7vw,13px);line-height:1.28;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}
.weight-system-stage{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(680px,57vw,1090px)}
.weight-system-list{display:flex;justify-content:center;flex-direction:column;gap:clamp(3px,.35vw,7px);margin:0;padding:clamp(24px,3vw,58px) var(--pad);list-style:none}
.weight-system-list li{display:flex;align-items:baseline;gap:.18em;font-size:clamp(42px,5vw,96px);font-weight:var(--weight);line-height:.94;letter-spacing:-.035em;white-space:nowrap}
.weight-system-list strong{min-width:2.65em;font:inherit}
.weight-system-glyph{position:relative;overflow:hidden;background:#050505;color:var(--bg);cursor:crosshair}
.weight-layer-object{position:absolute;inset:24.2%;width:51.6%;height:51.6%;filter:invert(1);cursor:crosshair}
.weight-layer-label{position:absolute;right:var(--pad);bottom:24px;color:var(--bg);font-size:12px;letter-spacing:.02em}
@media(max-width:650px){.weight-system-copy{grid-template-columns:1fr;width:100%;gap:18px;padding-bottom:38px}.weight-system-stage{grid-template-columns:1fr;min-height:0}.weight-system-list{min-height:138vw;gap:2px}.weight-system-list li{font-size:11vw;line-height:.96}.weight-system-glyph{height:105vw}.weight-layer-object{inset:24.8%;width:50.4%;height:50.4%}}

/* Keep every Kerning Lab character optically centred inside its measured cell. */
.kerning-glyph{justify-content:center}
.kerning-glyph-character{width:auto;letter-spacing:0;text-align:center;text-indent:0}

/* Give the three construction studies one shared cap-height and optical centre. */
.relay-mechanik-panels{--relay-display-size:clamp(180px,24vw,460px);--relay-stage-pad:clamp(32px,3vw,58px)}
.relay-rotating-arrow,.relay-layered-r,.relay-pictogram-cycle{display:grid;min-width:0;min-height:0;flex:1 1 0;place-items:center;align-content:center;justify-content:center;width:100%;padding:var(--relay-stage-pad);text-align:center}
.relay-rotating-arrow{font-size:var(--relay-display-size)}
.relay-layered-r{font-size:var(--relay-display-size);line-height:1;letter-spacing:0;transform:none}
.relay-pictogram-cycle strong{align-self:center;justify-self:center;font-size:var(--relay-display-size);line-height:1;letter-spacing:0;transform:none}
.relay-pictogram-cycle #relay-cycle-code{align-self:auto;justify-self:auto}
@media(max-width:650px){.relay-mechanik-panels{--relay-display-size:64vw;--relay-stage-pad:32px}}

/* Centre every label and control inside the three construction cards. */
.relay-mechanik-card>header,.relay-mechanik-card>footer{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:center;justify-items:center;text-align:center}
.relay-mechanik-card>header>*,.relay-mechanik-card>footer>*{justify-self:center;text-align:center}

/* The custom rotating circle-arrow needs its own optical vertical correction. */
.relay-rotating-arrow canvas{position:relative;top:clamp(-24px,-1.3vw,-8px)}

/* Centre pictograms by their rendered ink bounds, not by the font line box. */
.pictogram-grid b{display:block;width:100%;height:100%}
.pictogram-grid b canvas{display:block;width:100%;height:100%}
.pictogram-grid span.is-hover-suppressed:hover{background:var(--bg);color:var(--ink)}
.pictogram-grid span.is-hover-suppressed:hover::after{color:var(--ink)}
