@font-face{font-family:Allotrope;src:url('assets/fonts/Allotrope-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Allotrope;src:url('assets/fonts/Allotrope-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Allotrope;src:url('assets/fonts/Allotrope-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Allotrope;src:url('assets/fonts/Allotrope-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Fixture;src:url('assets/fonts/Fixture-Medium.otf') format('opentype');font-weight:500;font-display:swap}
@font-face{font-family:FixtureExpanded;src:url('assets/fonts/Fixture-ExpandedBlack.otf') format('opentype');font-weight:900;font-display:swap}
@font-face{font-family:FixtureCondensed;src:url('assets/fonts/Fixture-CondensedBold.otf') format('opentype');font-weight:700;font-display:swap}
@font-face{font-family:FixtureCondensedThin;src:url('assets/fonts/Fixture-CondensedThin.otf') format('opentype');font-weight:100;font-display:swap}
@font-face{font-family:FixtureCondensedLight;src:url('assets/fonts/Fixture-CondensedLight.otf') format('opentype');font-weight:300;font-display:swap}
@font-face{font-family:FixtureCondensedMedium;src:url('assets/fonts/Fixture-CondensedMedium.otf') format('opentype');font-weight:500;font-display:swap}

:root{
  --deep:#391a63;--violet:#bf54ff;--sky:#24c2ed;--peach:#eb7979;--lemon:#fff42c;
  --ink:#17131d;--muted:#696370;--paper:#f7f6f7;--white:#fff;--night:#09080d;--line:rgba(25,18,31,.14);
  --font:"Allotrope","Avenir Next","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);--gutter:clamp(1.25rem,5vw,5rem);--max:1560px;--rail:250px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem;background:var(--night)}
body{margin:0;padding-left:var(--rail);color:var(--ink);background:var(--paper);font-family:var(--font);font-size:clamp(1rem,.25vw + .93rem,1.18rem);line-height:1.55;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;color:inherit}
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;padding:.8rem 1rem;background:var(--lemon);color:var(--ink);font-weight:800}
.skip-link:focus{top:1rem}

.site-rail{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:120;display:flex;flex-direction:column;padding:2rem 1.55rem 1.5rem;background:#09080d;color:#fff;border-right:1px solid rgba(255,255,255,.12);overflow:hidden}
.rail-brand{display:flex;flex-direction:column;align-items:flex-start;gap:.85rem}.rail-brand img{width:150px}.rail-brand span{font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.rail-label{margin:3rem 0 .65rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:rgba(255,255,255,.36)}
.site-nav{display:flex;flex-direction:column;gap:.08rem;min-height:0}
.site-nav a{position:relative;padding:.56rem .35rem .56rem 1rem;font-size:.9rem;font-weight:500;color:rgba(255,255,255,.58);transition:color .25s var(--ease),transform .25s var(--ease)}
.site-nav a::before{content:"";position:absolute;left:0;top:50%;width:6px;aspect-ratio:1;background:var(--sky);transform:translateY(-50%) scale(0);transition:transform .3s var(--ease)}
.site-nav a:hover,.site-nav a.is-active{color:#fff;transform:translateX(4px)}
.site-nav a.is-active::before{transform:translateY(-50%) scale(1)}
.site-nav a span{font-family:FixtureCondensed,sans-serif;color:var(--violet);font-size:.78em;margin-right:.65rem}
.rail-footer{margin-top:auto;padding-top:1rem;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:flex-start;gap:.75rem}.rail-meta{font-size:.67rem;color:rgba(255,255,255,.32)}
.rail-progress{position:absolute;right:0;top:0;width:3px;height:100%;background:linear-gradient(var(--sky),var(--violet),var(--peach));transform-origin:top;transform:scaleY(var(--scroll-progress,0));transition:transform .08s linear}
.site-header{display:none;position:fixed;inset:0 0 auto 0;height:68px;z-index:130;align-items:center;justify-content:space-between;padding:0 var(--gutter);border-bottom:1px solid rgba(255,255,255,.12);background:rgba(9,8,13,.82);backdrop-filter:blur(18px);color:#fff;transition:.35s var(--ease)}
html[data-theme="light"] .site-header{background:rgba(247,246,247,.78);color:var(--ink);border-color:var(--line)}
.brand{display:flex;align-items:center;gap:1.1rem;min-width:0}
.brand-logo{width:124px;height:auto}
.brand-logo--positive{display:none}
html[data-theme="light"] .brand-logo--positive{display:block}
html[data-theme="light"] .brand-logo--negative{display:none}
.brand span{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;opacity:.65;border-left:1px solid currentColor;padding-left:1.1rem;white-space:nowrap}
.theme-toggle,.menu-toggle{border:0;background:none;cursor:pointer}
.theme-toggle{display:flex;align-items:center;gap:.6rem;padding:.5rem 0;font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}
.theme-toggle__track{position:relative;width:42px;height:22px;border:1px solid currentColor;border-radius:22px;display:block}
.theme-toggle__dot{position:absolute;top:3px;left:22px;width:14px;height:14px;background:var(--sky);border-radius:50%;transition:.3s var(--ease)}
html[data-theme="light"] .theme-toggle__dot{transform:translateX(-19px);background:var(--deep)}
.menu-toggle{display:flex;align-items:center;gap:.35rem;padding:.65rem 0;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
.menu-toggle i{display:block;width:5px;height:5px;background:currentColor}

.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:clamp(8rem,14vh,12rem) var(--gutter) 5rem;background:#09080d;color:#fff;isolation:isolate}
.section-dark{background:#09080d;color:#fff}
.hero::after{content:"";position:absolute;inset:auto 0 0;height:18%;background:linear-gradient(transparent,#09080d);z-index:-1}
.hero-glow{position:absolute;border-radius:50%;filter:blur(80px);opacity:.72;z-index:-3;animation:breathe 12s ease-in-out infinite alternate}
.hero-glow--one{width:72vw;height:65vw;left:-18vw;top:5vh;background:radial-gradient(circle,var(--violet),var(--deep) 48%,transparent 72%)}
.hero-glow--two{width:70vw;height:55vw;right:-18vw;bottom:-10vw;background:radial-gradient(circle,var(--sky),#4f61d5 35%,transparent 70%);animation-delay:-4s}
.hero-grid{position:absolute;inset:0;z-index:-2;opacity:.17;background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:clamp(48px,5vw,84px) clamp(48px,5vw,84px);mask-image:linear-gradient(to bottom,transparent 4%,#000 35%,transparent 95%)}
.hero-content{width:min(100%,1150px);position:relative;z-index:2}
.eyebrow,.micro-label{font-family:FixtureCondensed,var(--font);font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.chapter-kicker{font-size:1rem;letter-spacing:0;text-transform:none;font-weight:750}
.eyebrow{display:flex;gap:1rem;color:rgba(255,255,255,.7);margin:0 0 2.5rem}
.eyebrow span{color:var(--sky)}
.hero h1,.chapter h2{margin:0;letter-spacing:-.03em;line-height:.97;text-wrap:balance}
.hero h1{font-size:clamp(3.6rem,7.2vw,6rem);max-width:1050px;font-weight:600}
.hero h1 em,.chapter h2 em{font-style:normal;color:var(--sky)}
.hero-copy{max-width:780px;margin:clamp(2rem,4vw,4rem) 0 0;font-size:clamp(1.15rem,1.7vw,1.7rem);line-height:1.45;color:rgba(255,255,255,.78)}
.scroll-cue{display:inline-flex;align-items:center;gap:1rem;margin-top:3rem;font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.1em}
.scroll-cue i{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.4);border-radius:50%;font-style:normal;transition:.3s}
.scroll-cue:hover i{background:var(--sky);border-color:var(--sky);color:var(--ink);transform:translateY(4px)}
.hero-code{position:absolute;right:var(--gutter);bottom:4.5rem;display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;color:rgba(255,255,255,.32);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem}
.pixel-field .pixel{position:absolute;z-index:1;box-shadow:0 0 35px rgba(255,255,255,.08)}
.pixel{display:block;aspect-ratio:1}
.pixel--s{width:clamp(24px,2.4vw,42px)}.pixel--m{width:clamp(54px,5vw,88px)}.pixel--l{width:clamp(90px,9vw,160px)}
.pixel--sky{background:var(--sky)}.pixel--peach{background:var(--peach)}.pixel--violet{background:var(--violet)}.pixel--lemon{background:var(--lemon)}
.p1{left:27%;top:0;animation:drift-a 9s ease-in-out infinite}.p2{right:4%;top:30%;animation:drift-b 11s ease-in-out infinite}.p3{right:-4%;bottom:8%;animation:drift-a 14s ease-in-out infinite reverse}.p4{left:8%;bottom:-1.2rem;animation:drift-b 10s ease-in-out infinite}

.chapter{position:relative;padding:clamp(6rem,10vw,10rem) var(--gutter);background:var(--paper);overflow:hidden}
.chapter>*{width:min(100%,var(--max));margin-left:auto;margin-right:auto}
.section-soft{background:#efedef}
.chapter-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:clamp(2rem,7vw,8rem);align-items:end;margin-bottom:clamp(4rem,8vw,8rem)}
.chapter-head .chapter-kicker{grid-column:1/-1;margin:0 0 1rem;color:var(--muted)}
.chapter-kicker span{color:var(--violet);margin-right:.7rem}
.chapter h2{font-size:clamp(3rem,6.2vw,6rem);max-width:1000px;font-weight:500}
.chapter h3{font-weight:600;letter-spacing:-.02em;text-wrap:balance}
.chapter-head>p:last-child{max-width:560px;margin:0 0 .5rem;font-size:clamp(1.05rem,1.5vw,1.45rem);color:var(--muted)}
.section-dark .chapter-head>p:last-child,.chapter--downloads .chapter-head>p:last-child{color:rgba(255,255,255,.66)}
.section-dark .chapter-kicker,.chapter--downloads .chapter-kicker{color:rgba(255,255,255,.56)}

.chapter--brand{padding-top:clamp(7rem,12vw,12rem)}
.brand-statement{max-width:1180px!important;margin-bottom:clamp(4rem,8vw,7rem)!important}
.brand-statement p{font-size:clamp(1.8rem,3.5vw,4rem);line-height:1.18;letter-spacing:-.035em;margin:0}
.principles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-bottom:clamp(4rem,8vw,7rem)!important}
.principle{padding:2rem 3rem 3rem 0;border-right:1px solid var(--line)}.principle+.principle{padding-left:3rem}.principle:last-child{border-right:0}
.principle span,.pixel-rules span{font-family:FixtureCondensed;color:var(--violet);font-weight:700}.principle h3,.pixel-rules h3{font-size:clamp(1.6rem,2.5vw,2.6rem);margin:2.5rem 0 .7rem;letter-spacing:-.04em}.principle p{color:var(--muted);margin:0;max-width:32ch}
.wide-photo{position:relative;margin-bottom:0!important}.wide-photo img{width:100%;height:clamp(380px,55vw,780px);object-fit:cover;object-position:center 42%;clip-path:polygon(0 6%,58% 0,100% 4%,100% 100%,32% 96%,0 100%)}
.wide-photo figcaption{position:absolute;left:clamp(1rem,4vw,4rem);bottom:clamp(1rem,3vw,3rem);background:rgba(9,8,13,.82);backdrop-filter:blur(12px);color:#fff;padding:1rem 1.4rem;max-width:min(620px,80%)}.wide-photo figcaption span{color:var(--sky);font-weight:800;margin-right:.8rem}

.logo-stage-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:4rem!important}
.logo-stage{min-height:clamp(320px,42vw,620px);padding:clamp(1.5rem,3vw,3rem);display:flex;flex-direction:column;justify-content:space-between}.logo-stage p{margin:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em}.logo-stage img{width:min(72%,460px);align-self:center}.logo-stage a{font-weight:750;font-size:.9rem;align-self:flex-start;border-bottom:1px solid currentColor}.logo-stage--light{background:#fff}.logo-stage--dark{background:#0b0910;color:#fff}.logo-stage--dark p{color:rgba(255,255,255,.6)}
.logo-rules{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1rem,3vw,3rem);margin-bottom:4rem!important}.protection-demo,.icon-demo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,3rem);align-items:center;background:rgba(255,255,255,.6);padding:clamp(1.5rem,3vw,3rem);border:1px solid var(--line)}
.protection-grid{aspect-ratio:1;display:grid;place-items:center;padding:15%;background-size:11.111% 11.111%;background-image:linear-gradient(rgba(57,26,99,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(57,26,99,.12) 1px,transparent 1px)}.protection-grid img{width:100%}.logo-rules h3{font-size:clamp(1.6rem,2.4vw,2.5rem);line-height:1.05;margin:.4rem 0 1rem}.logo-rules p:not(.micro-label){color:var(--muted)}.micro-label{color:var(--violet);margin:0}.icon-orbit{aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#fff 0 38%,transparent 39%),conic-gradient(from 20deg,var(--sky),var(--violet),var(--peach),var(--sky))}.icon-orbit img{width:34%}
.donts{display:grid;grid-template-columns:1fr repeat(4,1fr);align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.donts>*{padding:1.5rem;border-right:1px solid var(--line)}.donts>*:last-child{border-right:0}.donts div{font-weight:700}.donts div span{color:var(--peach);font-size:1.3rem;margin-right:.5rem}

.palette{display:grid;grid-template-columns:1.5fr repeat(4,1fr);min-height:clamp(420px,50vw,720px);margin-bottom:1.25rem!important}.swatch{border:0;padding:1.5rem;text-align:left;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;cursor:pointer;transition:flex .5s var(--ease),transform .3s var(--ease);min-width:0}.swatch:hover{transform:translateY(-10px)}.swatch span{font-size:clamp(1rem,1.5vw,1.4rem);font-weight:800}.swatch strong{font-family:ui-monospace,monospace;font-weight:500;font-size:.85rem;margin-top:.25rem}.swatch i{font-style:normal;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;margin-top:.8rem;opacity:.6}.swatch--deep{background:var(--deep);color:#fff}.swatch--violet{background:var(--violet);color:var(--ink)}.swatch--sky{background:var(--sky);color:var(--ink)}.swatch--peach{background:var(--peach);color:var(--ink)}.swatch--lemon{background:var(--lemon);color:var(--ink)}
.copy-hint{color:var(--muted);font-size:.8rem;margin-bottom:clamp(4rem,8vw,7rem)!important}
.mode-comparison{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}.mode-panel{position:relative;min-height:430px;padding:clamp(2rem,4vw,4.5rem);overflow:hidden}.mode-panel>span{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em}.mode-panel h3{font-size:clamp(2.4rem,4.5vw,5rem);line-height:.95;max-width:10ch;margin:4rem 0 1.2rem;letter-spacing:-.05em}.mode-panel p{max-width:32ch}.mode-panel i{position:absolute;right:-6%;bottom:-15%;width:45%;aspect-ratio:1;background:var(--sky)}.mode-panel--light{background:#fff}.mode-panel--dark{background:#0a0810;color:#fff}.mode-panel--dark i{background:var(--violet)}

.chapter--type{background:#09080d}.chapter--type .chapter-head h2 em{color:var(--peach)}
.type-showcase{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.15);margin-bottom:clamp(4rem,8vw,7rem)!important}.type-showcase article{padding:clamp(2rem,4vw,4rem);background:#0d0b12;min-height:600px;display:flex;flex-direction:column}.type-showcase article>p:not(.micro-label){max-width:46ch;color:rgba(255,255,255,.72)}.type-name{font-size:clamp(3.6rem,6vw,6rem);line-height:.98;margin:3rem 0 2rem;letter-spacing:-.03em}.alphabet{margin-top:auto;padding-top:4rem;font-size:clamp(1.5rem,3vw,3rem);color:rgba(255,255,255,.55);line-height:1.3}.fixture-mix{display:flex;align-items:baseline;font-size:clamp(3.6rem,7vw,6rem);line-height:.9;margin:4rem 0 2rem;letter-spacing:-.035em;white-space:nowrap}.fixture-mix span{display:inline-block}.fx-thin{font-family:FixtureCondensedThin,sans-serif;color:var(--sky)}.fx-light{font-family:FixtureCondensedLight,sans-serif;color:var(--violet)}.fx-cond-medium{font-family:FixtureCondensedMedium,sans-serif;color:var(--sky)}.fx-medium{font-family:Fixture,sans-serif;color:var(--peach)}.fx-cond-bold{font-family:FixtureCondensed,sans-serif;color:var(--sky)}.fx-expanded{font-family:FixtureExpanded,sans-serif;color:var(--lemon)}.type-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:auto}.type-tags span{border:1px solid rgba(255,255,255,.25);padding:.55rem .75rem;font-family:FixtureCondensed;font-size:.75rem;letter-spacing:.08em}
.font-fallbacks{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(2rem,6vw,7rem);padding:clamp(2rem,5vw,5rem) 0;border-top:1px solid rgba(255,255,255,.18);margin-bottom:clamp(3rem,6vw,6rem)!important}.font-fallbacks__intro h3{font-size:clamp(2.2rem,4.3vw,4.7rem);line-height:.98;margin:1rem 0 1.5rem}.font-fallbacks__intro>p:last-child{color:rgba(255,255,255,.65);max-width:50ch}.font-options{border-top:1px solid rgba(255,255,255,.18)}.font-option{display:grid;grid-template-columns:180px 1fr;gap:1rem 2rem;padding:1.5rem 0;border-bottom:1px solid rgba(255,255,255,.18);align-items:baseline}.font-option>span{grid-row:1/3;font-size:.72rem;color:rgba(255,255,255,.46);text-transform:uppercase;letter-spacing:.08em}.font-option strong{font-size:clamp(1.45rem,2.5vw,2.8rem);line-height:1.08}.font-option p{margin:0;color:rgba(255,255,255,.58);max-width:58ch}.font-option--avenir strong{font-family:"Avenir Next",Avenir,Arial,sans-serif}.font-option--aptos strong{font-family:"Aptos Display",Aptos,Arial,sans-serif}.font-option--arial strong{font-family:Arial,sans-serif;font-weight:700}.type-usage{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.18);margin-bottom:clamp(4rem,7vw,7rem)!important}.type-usage>div{padding:1.5rem 1.7rem 1.5rem 0;border-right:1px solid rgba(255,255,255,.18)}.type-usage>div+div{padding-left:1.7rem}.type-usage>div:last-child{border-right:0}.type-usage span{display:block;color:var(--sky);font-family:FixtureCondensed;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}.type-usage strong{display:block;font-size:1.45rem;margin:.8rem 0 .5rem}.type-usage p{margin:0;color:rgba(255,255,255,.58);font-size:.9rem}
.type-scale{border-top:1px solid rgba(255,255,255,.18)}.type-scale>div{display:grid;grid-template-columns:130px 1fr;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid rgba(255,255,255,.18);gap:2rem}.type-scale span{font-size:.75rem;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.1em}.type-scale strong{line-height:1.05;letter-spacing:-.035em}.type-scale>div:nth-child(1) strong{font-size:clamp(2.8rem,6vw,6rem)}.type-scale>div:nth-child(2) strong{font-size:clamp(2rem,4vw,4rem)}.type-scale>div:nth-child(3) strong{font-size:clamp(1.3rem,2vw,2.2rem)}.type-scale p{margin:0;max-width:65ch;color:rgba(255,255,255,.68)}

.signet-system{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(420px,1.15fr);gap:clamp(2rem,5vw,6rem);align-items:start;margin-bottom:clamp(4rem,8vw,8rem)!important}
.signet-intro{max-width:620px}.signet-intro h3{font-size:clamp(2.2rem,4vw,4rem);line-height:1;margin:1rem 0 1.5rem}.signet-intro>p:last-child{color:var(--muted);max-width:58ch}
.signet-variants{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.signet-variants figure{margin:0;min-height:170px;background:#fff;padding:1.25rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.signet-variants img{width:min(86px,60%);height:86px;object-fit:contain}.signet-variants figcaption{margin-top:1rem;color:var(--muted);font-size:.75rem}
.signet-motion-demo{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(150px,240px));gap:clamp(2.25rem,6vw,6rem);align-items:center;justify-content:center;padding:clamp(2rem,5vw,4rem);background:#f1eff2;position:relative}.signet-grid{display:grid;grid-template-columns:repeat(3,1fr);aspect-ratio:1;background:#cfcbd1;gap:1px;border:1px solid #cfcbd1}.signet-grid>span{display:block;background:#fff;aspect-ratio:1}.signet-grid .is-violet{background:var(--violet)}.signet-grid .is-sky{background:var(--sky)}.signet-grid .is-peach{background:var(--peach)}.signet-arrow{position:absolute;top:50%;transform:translate(-50%,-50%);font-family:FixtureCondensedMedium,sans-serif;font-size:clamp(2rem,4vw,4rem);color:rgba(57,26,99,.34)}.signet-arrow:nth-of-type(1){left:35%}.signet-arrow:nth-of-type(2){left:65%}
.signet-logic{grid-column:2;margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}.signet-logic li{display:grid;grid-template-columns:52px 1fr;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--line);align-items:start}.signet-logic b{font-family:FixtureCondensed;color:var(--violet);font-size:1.2rem}.signet-logic strong{display:block;color:var(--ink)}.signet-logic span{color:var(--muted)}
.pixel-playground{position:relative;min-height:clamp(600px,65vw,860px);background:#0d0b12;color:#fff;overflow:hidden;margin-bottom:clamp(4rem,7vw,7rem)!important;isolation:isolate}.playground-grid{position:absolute;inset:0;opacity:.15;background-size:11.111% 11.111%;background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px)}.playground-copy{position:absolute;left:clamp(2rem,6vw,6rem);top:50%;transform:translateY(-50%);z-index:3}.playground-copy span{font-family:FixtureCondensed;color:var(--sky);letter-spacing:.12em;text-transform:uppercase}.playground-copy h3{font-size:clamp(3rem,6.5vw,6rem);line-height:.94;letter-spacing:-.035em;margin:1.5rem 0 2rem}.playground-copy p{color:rgba(255,255,255,.66)}.demo-pixel{position:absolute;z-index:2;transition:transform 1.1s var(--ease)}.dp1{right:18%;top:8%}.dp2{right:3%;top:43%}.dp3{right:18%;bottom:-4%}.dp4{left:-.7rem;bottom:13%}
.pixel-rules{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.pixel-rules>div{padding:2rem 2.4rem 2rem 0;border-right:1px solid var(--line)}.pixel-rules>div+div{padding-left:2.4rem}.pixel-rules>div:last-child{border-right:0}.pixel-rules p{color:var(--muted);margin:0}.pixel-rules h3{font-size:clamp(1.3rem,2vw,2rem);margin:2rem 0 .8rem}

.photo-collage{display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:repeat(2,minmax(280px,42vw));gap:clamp(1rem,2vw,2rem);margin-bottom:clamp(4rem,7vw,7rem)!important}.photo{position:relative;margin:0;overflow:hidden;background:#d9d5db}.photo img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}.photo:hover img{transform:scale(1.035)}.photo figcaption{position:absolute;left:1rem;bottom:1rem;background:rgba(9,8,13,.78);backdrop-filter:blur(10px);color:#fff;padding:.65rem .85rem;font-size:.78rem;font-weight:750}.photo--a{grid-row:1/3;clip-path:polygon(0 0,96% 3%,100% 64%,94% 100%,0 96%)}.photo--b{clip-path:polygon(4% 0,100% 4%,96% 100%,0 95%)}.photo--c{clip-path:polygon(0 3%,96% 0,100% 96%,3% 100%)}.photo--d{display:none}
.faceless-guide{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,7rem);padding:clamp(2rem,5vw,5rem);background:var(--deep);color:#fff;margin-bottom:clamp(3rem,6vw,6rem)!important}.faceless-guide h3{font-size:clamp(2.2rem,4vw,4.2rem);line-height:1;margin:1rem 0}.faceless-rules{display:flex;flex-direction:column;justify-content:center}.faceless-rules p{color:rgba(255,255,255,.78);max-width:58ch}.faceless-rules strong{display:block;color:#fff;margin-bottom:.25rem}.faceless-rules a{align-self:flex-start;margin-top:1rem;border-bottom:1px solid currentColor;font-weight:750}
.image-rules{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.image-rules>div{display:grid;grid-template-columns:80px 1fr;gap:1.5rem;padding:2rem 3rem 2rem 0;border-right:1px solid var(--line)}.image-rules>div+div{padding-left:3rem;border-right:0}.image-rules strong{font-size:2rem;color:var(--sky)}.image-rules>div+div strong{color:var(--peach)}.image-rules p{margin:0;color:var(--muted)}

.voice-pillars{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:clamp(4rem,8vw,7rem)!important}.voice-pillars article{min-height:320px;padding:2rem 2.5rem 2rem 0;border-top:1px solid var(--line);border-right:1px solid var(--line)}.voice-pillars article+article{padding-left:2.5rem}.voice-pillars article:last-child{border-right:0}.voice-pillars span{font-family:FixtureCondensed;color:var(--violet)}.voice-pillars h3{font-size:clamp(1.8rem,3vw,3rem);margin:4rem 0 1rem;letter-spacing:-.04em}.voice-pillars p{color:var(--muted)}
.rewrite{background:#e9e6eb;padding:clamp(2rem,5vw,5rem);margin-bottom:clamp(4rem,7vw,7rem)!important}.rewrite>.micro-label{margin-bottom:3rem}.rewrite-row{display:grid;grid-template-columns:190px 1fr;gap:2rem;align-items:start;padding:2rem 0;border-top:1px solid var(--line)}.rewrite-row span{font-weight:800}.rewrite-row p{font-size:clamp(1.4rem,2.5vw,2.6rem);line-height:1.2;letter-spacing:-.03em;margin:0;max-width:38ch}.rewrite-row--no{color:#8a848d}.rewrite-row--no span{text-decoration:line-through}.rewrite-row--yes span{color:var(--deep)}.rewrite-row--yes p{font-weight:800;color:var(--deep)}
.course-formula{display:grid;grid-template-columns:repeat(4,1fr);position:relative;border-top:2px solid var(--deep)}.formula-label{position:absolute;top:-2.4rem;left:0;font-family:FixtureCondensed;text-transform:uppercase;letter-spacing:.12em;color:var(--deep);font-size:.78rem}.course-formula>div{padding:2rem 2rem 1rem 0;border-right:1px solid var(--line)}.course-formula>div+div{padding-left:2rem}.course-formula>div:last-child{border-right:0}.course-formula b{font-family:FixtureExpanded;color:var(--violet);font-size:2rem}.course-formula p{color:var(--muted)}.course-formula strong{color:var(--ink);display:block}

.chapter--applications{background:#09080d}
.format-system{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(2rem,3vw,4rem) clamp(1rem,2vw,2rem);align-items:start;margin-bottom:clamp(5rem,10vw,10rem)!important}
.format-system__intro{grid-column:1/9;padding:clamp(1rem,3vw,3rem) 0 clamp(2rem,5vw,5rem)}
.format-system__intro h3{font-size:clamp(2.8rem,5vw,5.5rem);line-height:.94;letter-spacing:-.035em;margin:1rem 0 1.5rem;max-width:9ch}.format-system__intro h3 em{font-style:normal;color:var(--sky)}
.format-system__intro>p:last-child{color:rgba(255,255,255,.68);max-width:58ch;font-size:clamp(1rem,1.35vw,1.25rem)}
.format-example{margin:0;min-width:0}.format-example figure{position:relative;margin:0;overflow:hidden;background:var(--deep)}.format-example img{display:block;width:100%;height:auto;transition:transform .9s var(--ease),filter .9s var(--ease)}.format-example:hover img{transform:scale(1.018);filter:saturate(1.06)}
.format-example>div{padding:1.2rem 0 0}.format-example span{display:block;font-family:FixtureCondensed,sans-serif;color:var(--sky);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.format-example h4{font-size:clamp(1.35rem,2vw,2.2rem);line-height:1;margin:.55rem 0 .6rem;letter-spacing:-.025em}.format-example p{margin:0;color:rgba(255,255,255,.62);max-width:44ch;font-size:.94rem}
.format-example--weekly{grid-column:2/6}.format-example--code{grid-column:7/12;margin-top:clamp(3rem,7vw,7rem)}.format-example--recruiting{grid-column:1/6;margin-top:clamp(2rem,5vw,5rem)}.format-example--brand{grid-column:7/13;margin-top:clamp(7rem,11vw,11rem)}
.format-example--weekly figure{background:#fff}.format-example--brand figure{background:var(--violet)}
.format-system__rule{grid-column:2/12;margin:clamp(2rem,5vw,5rem) 0 0;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.64)}.format-system__rule strong{color:#fff}
.application-gallery{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,5rem)}.app-mock>h3{font-size:1.4rem;margin:1.4rem 0 .35rem}.app-mock>p{color:rgba(255,255,255,.68);max-width:55ch;margin:0}.social-card,.course-card,.slide-card,.poster-card{aspect-ratio:1.22/1;position:relative;overflow:hidden;background:#15121a}.social-card img{width:100%;height:100%;object-fit:cover;filter:brightness(.56) saturate(.9)}.social-card::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(57,26,99,.82),transparent 72%)}.social-overlay{position:absolute;z-index:2;left:8%;top:10%;bottom:8%;display:flex;flex-direction:column}.social-overlay span{font-family:FixtureCondensed;color:var(--sky);letter-spacing:.12em}.social-overlay h3{font-size:clamp(2rem,4vw,4.8rem);line-height:.92;letter-spacing:-.035em;margin:1.2rem 0}.social-overlay h3 em{color:var(--sky);font-style:normal}.social-overlay p{margin-top:auto;font-weight:700}.mock-pixel{position:absolute;z-index:3;display:block;aspect-ratio:1}.mp-a{width:11%;right:0;top:14%;background:var(--peach)}.mp-b{width:6%;right:18%;bottom:0;background:var(--lemon)}
.course-card{background:#f5f3f5;color:var(--ink);display:grid;grid-template-columns:1fr 1fr}.course-image{clip-path:polygon(0 0,100% 4%,91% 100%,0 96%)}.course-image img{width:100%;height:100%;object-fit:cover}.course-copy{padding:10% 8%;display:flex;flex-direction:column}.course-copy span{font-family:FixtureCondensed;color:var(--violet);letter-spacing:.1em}.course-copy h3{font-size:clamp(1.8rem,3vw,3.3rem);line-height:.95;margin:2rem 0 1rem}.course-copy p{color:var(--muted)}.course-copy b{margin-top:auto;color:var(--deep);font-size:.85rem}
.slide-card{background:radial-gradient(circle at 75% 60%,#36569f 0,var(--deep) 38%,#0a0810 76%);padding:7%;display:flex;flex-direction:column;justify-content:center}.slide-card>img{position:absolute;left:7%;top:7%;width:17%}.slide-card small{color:var(--sky);font-family:FixtureCondensed;letter-spacing:.1em}.slide-card h3{font-size:clamp(2rem,4vw,4.8rem);line-height:.94;letter-spacing:-.035em;margin:1rem 0}.slide-card h3 em{font-style:normal;color:var(--sky)}.slide-pixel{position:absolute;aspect-ratio:1}.sp-a{width:7%;right:0;top:20%;background:var(--peach)}.sp-b{width:13%;right:11%;bottom:-2%;background:var(--violet)}.sp-c{width:5%;left:0;bottom:15%;background:var(--sky)}
.poster-card{background:var(--lemon);color:var(--ink);padding:6%;display:grid;grid-template-columns:1fr .75fr;grid-template-rows:auto 1fr auto;gap:1rem}.poster-top{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;font-family:FixtureCondensed;font-size:.7rem}.poster-top img{width:20%}.poster-card>h3{font-size:clamp(2rem,4vw,4.6rem);line-height:.82;letter-spacing:-.025em;margin:2rem 0;align-self:center}.poster-fixture b{font-family:FixtureExpanded}.poster-fixture span{font-family:FixtureCondensed}.poster-fixture i{font-family:Fixture;font-style:normal}.poster-photo{align-self:center;clip-path:polygon(5% 0,100% 6%,95% 100%,0 93%)}.poster-photo img{height:100%;width:100%;object-fit:cover}.poster-card>p{grid-column:1/-1;margin:0;font-size:.8rem;font-weight:700}

.chapter--downloads{background:#09080d;color:#fff;isolation:isolate}.download-glow{position:absolute;width:90vw;height:65vw;right:-30vw;top:-15vw;border-radius:50%;background:radial-gradient(circle,var(--violet),var(--deep) 35%,transparent 70%);filter:blur(80px);opacity:.52;z-index:-1}.download-list{border-top:1px solid rgba(255,255,255,.18);margin-bottom:clamp(5rem,10vw,10rem)!important}.download-item{display:grid;grid-template-columns:70px 1fr 60px;align-items:center;padding:1.6rem 0;border-bottom:1px solid rgba(255,255,255,.18);transition:.25s}.download-item:hover{padding-left:1rem;background:rgba(255,255,255,.045)}.download-item>span{font-family:FixtureCondensed;color:var(--sky)}.download-item div{display:flex;align-items:baseline;gap:1rem}.download-item strong{font-size:clamp(1.3rem,2.5vw,2.5rem);letter-spacing:-.03em}.download-item small{color:rgba(255,255,255,.48)}.download-item b{text-align:right;font-size:1.6rem;color:var(--violet)}
.closing{border-top:1px solid rgba(255,255,255,.18);padding-top:3rem;display:grid;grid-template-columns:180px 1fr auto;gap:3rem;align-items:center}.closing img{width:180px}.closing p{max-width:50ch;color:rgba(255,255,255,.6)}.closing a{border-bottom:1px solid currentColor;font-weight:750}

.toast{position:fixed;left:calc(50% + var(--rail)/2);bottom:2rem;z-index:300;transform:translate(-50%,150%);background:var(--ink);color:#fff;padding:.8rem 1.2rem;border-radius:2px;font-size:.85rem;transition:.4s var(--ease);box-shadow:0 12px 30px rgba(0,0,0,.25)}.toast.is-visible{transform:translate(-50%,0)}
.reveal{opacity:1;transform:none;clip-path:inset(0)}
.has-motion .reveal{opacity:.01;transform:translateY(42px);clip-path:inset(0 0 10% 0);transition:opacity .85s var(--ease),transform 1s var(--ease),clip-path 1s var(--ease)}
.has-motion .reveal.is-visible{opacity:1;transform:none;clip-path:inset(0)}
.has-motion .chapter-head.reveal{transform:translateX(-34px)}
.has-motion .chapter-head.reveal.is-visible{transform:none}
.has-motion .app-mock:nth-child(even).reveal,.has-motion .font-option:nth-child(even).reveal{transform:translateY(42px) translateX(18px)}
.has-motion .app-mock:nth-child(even).reveal.is-visible,.has-motion .font-option:nth-child(even).reveal.is-visible{transform:none}
.chapter::after{content:"";position:absolute;right:0;top:clamp(2rem,6vw,6rem);width:clamp(28px,3.5vw,58px);aspect-ratio:1;background:var(--chapter-pixel,var(--sky));transform:translateX(45%);pointer-events:none}.chapter:nth-of-type(3n+1){--chapter-pixel:var(--violet)}.chapter:nth-of-type(3n+2){--chapter-pixel:var(--peach)}.chapter:nth-of-type(3n){--chapter-pixel:var(--sky)}

@keyframes breathe{to{transform:scale(1.08) translate(2%,-2%);opacity:.86}}
@keyframes drift-a{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,24px)}}
@keyframes drift-b{0%,100%{transform:translate(0,0)}50%{transform:translate(-22px,12px)}}

@media (max-width:1000px){
  .chapter-head{grid-template-columns:1fr}.chapter-head .chapter-kicker{grid-column:auto}.chapter-head>p:last-child{max-width:700px}
  .principles,.pixel-rules,.voice-pillars,.course-formula{grid-template-columns:1fr 1fr}.principle:nth-child(2),.pixel-rules>div:nth-child(2),.voice-pillars article:nth-child(2),.course-formula>div:nth-child(2){border-right:0}.principle:nth-child(3),.pixel-rules>div:nth-child(3),.voice-pillars article:nth-child(3),.course-formula>div:nth-child(3){padding-left:0;border-top:1px solid var(--line)}.voice-pillars article:nth-child(4),.course-formula>div:nth-child(4){border-top:1px solid var(--line)}
  .logo-rules{grid-template-columns:1fr}.signet-system{grid-template-columns:1fr}.signet-logic{grid-column:auto}.signet-motion-demo{grid-template-columns:repeat(3,minmax(120px,1fr));gap:clamp(1.5rem,5vw,3rem)}.palette{grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:1.2fr 1fr}.swatch--deep{grid-row:1/3}.swatch--peach,.swatch--lemon{grid-row:2}.donts{grid-template-columns:1fr 1fr}.donts>.micro-label{grid-column:1/-1}.donts>*{border-bottom:1px solid var(--line)}
  .type-showcase{grid-template-columns:1fr}.type-showcase article{min-height:520px}.font-fallbacks,.social-patterns{grid-template-columns:1fr}.type-usage{grid-template-columns:1fr 1fr}.type-usage>div:nth-child(2){border-right:0}.type-usage>div:nth-child(3){padding-left:0;border-top:1px solid rgba(255,255,255,.18)}.type-usage>div:nth-child(4){border-top:1px solid rgba(255,255,255,.18)}
  .photo-collage{grid-template-columns:1fr 1fr;grid-template-rows:420px 300px}.photo--a{grid-column:1/-1;grid-row:auto}.photo--d{display:block}.photo--b,.photo--c,.photo--d{grid-row:2}.photo--d{display:none}
  .format-system__intro{grid-column:1/10}.format-example--weekly{grid-column:1/6}.format-example--code{grid-column:7/13;margin-top:3rem}.format-example--recruiting{grid-column:1/6;margin-top:2rem}.format-example--brand{grid-column:7/13;margin-top:5rem}
}
@media (max-width:1180px){
  :root{--rail:220px}.site-rail{padding-left:1.25rem;padding-right:1.25rem}.rail-brand img{width:132px}.site-nav a{font-size:.84rem}
}
@media (max-width:900px){
  :root{--rail:0px}body{padding-left:0}.site-header{display:flex}.site-rail{width:min(86vw,360px);padding:6rem 2rem 2rem;transform:translateX(-105%);transition:transform .55s var(--ease);box-shadow:30px 0 70px rgba(0,0,0,.35)}.site-rail.is-open{transform:translateX(0)}.rail-brand{position:absolute;left:2rem;top:1.55rem}.rail-brand img{width:128px}.rail-brand span,.rail-label{display:none}.site-nav{margin-top:1rem}.site-nav a{font-size:1.2rem;padding:.72rem .35rem .72rem 1.2rem}.rail-footer{margin-top:auto}.toast{left:50%}
}
@media (max-width:760px){
  .site-header{height:68px}.brand-logo{width:105px}.brand span{display:none}.theme-label,.menu-toggle span{display:none}.menu-toggle{gap:.3rem}
  .hero{padding-top:8rem}.hero h1{font-size:clamp(3.7rem,16vw,6rem)}.hero-copy{font-size:1.1rem}.hero-code{display:none}.p2{top:22%}.p3{right:-7%}
  .chapter{padding-top:5.5rem;padding-bottom:5.5rem}.chapter h2{font-size:clamp(2.8rem,12vw,4.6rem)}.chapter-head{margin-bottom:4rem}
  .principles,.logo-stage-grid,.mode-comparison,.application-gallery{grid-template-columns:1fr}.principle,.principle+.principle{padding:1.7rem 0;border-right:0;border-bottom:1px solid var(--line)}.principle h3{margin:1rem 0 .4rem}.wide-photo img{height:480px}.wide-photo figcaption{max-width:90%}
  .logo-stage{min-height:380px}.logo-rules article{grid-template-columns:1fr}.donts{grid-template-columns:1fr}.donts>.micro-label{grid-column:auto}.donts>*{border-right:0}
  .palette{grid-template-columns:1fr 1fr;grid-template-rows:1.4fr 1fr 1fr;min-height:680px}.swatch--deep{grid-row:1;grid-column:1/-1}.swatch--peach,.swatch--lemon{grid-row:auto}.mode-panel{min-height:360px}.mode-panel h3{margin-top:3rem}
  .type-showcase article{min-height:480px}.font-option{grid-template-columns:1fr;gap:.45rem}.font-option>span{grid-row:auto}.type-usage{grid-template-columns:1fr}.type-usage>div,.type-usage>div+div{padding:1.3rem 0;border-right:0;border-top:0;border-bottom:1px solid rgba(255,255,255,.18)}.type-scale>div{grid-template-columns:1fr;gap:.5rem}.type-name{font-size:clamp(3.4rem,14vw,6rem)}.fixture-mix{font-size:clamp(3.4rem,15vw,6rem)}
  .signet-variants{grid-template-columns:1fr 1fr}.signet-motion-demo{grid-template-columns:1fr;gap:2.75rem;padding:1.5rem}.signet-grid{width:min(100%,260px);justify-self:center}.signet-arrow{position:static;transform:rotate(90deg);justify-self:center;margin:-1.75rem 0;font-size:2.5rem}.pixel-playground{min-height:680px}.playground-copy{top:42%;left:1.5rem}.playground-copy h3{font-size:13vw}.dp1{right:15%;top:7%}.dp2{right:-2%;top:60%}.dp3{right:18%}.pixel-rules,.voice-pillars,.course-formula{grid-template-columns:1fr}.pixel-rules>div,.pixel-rules>div+div,.voice-pillars article,.voice-pillars article+article,.course-formula>div,.course-formula>div+div{padding:1.6rem 0;border-right:0;border-bottom:1px solid var(--line)}.pixel-rules>div:nth-child(3),.voice-pillars article:nth-child(3),.course-formula>div:nth-child(3){border-top:0}.voice-pillars article{min-height:auto}.voice-pillars h3{margin:1.5rem 0 .5rem}
  .photo-collage{grid-template-columns:1fr;grid-template-rows:520px repeat(2,300px)}.photo--a,.photo--b,.photo--c{grid-column:auto;grid-row:auto}.faceless-guide{grid-template-columns:1fr}.image-rules{grid-template-columns:1fr}.image-rules>div,.image-rules>div+div{padding:1.5rem 0;border-right:0;border-bottom:1px solid var(--line)}
  .rewrite-row{grid-template-columns:1fr;gap:.6rem}.course-formula{padding-top:1rem}
  .format-system{display:flex;flex-direction:column;gap:3.2rem}.format-system__intro{padding:0 0 1rem}.format-system__intro h3{font-size:clamp(3rem,15vw,5rem)}.format-example{width:100%;margin-top:0}.format-example--weekly{width:82%;align-self:flex-end}.format-example--code{width:92%;align-self:flex-start}.format-example--recruiting{width:92%;align-self:flex-end}.format-example--brand{width:100%}.format-system__rule{width:100%;margin-top:1rem}.format-example h4{font-size:1.8rem}
  .social-patterns__grid{grid-template-columns:1fr}.social-card,.course-card,.slide-card,.poster-card{aspect-ratio:1/1}.course-card{grid-template-columns:.85fr 1.15fr}.poster-card>h3{font-size:10vw}
  .download-item{grid-template-columns:42px 1fr 32px}.download-item div{display:block}.download-item small{display:block;margin-top:.2rem}.closing{grid-template-columns:1fr;gap:1rem}.closing img{width:160px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-glow,.pixel-field .pixel{animation:none!important}.reveal,.has-motion .reveal{opacity:1;transform:none;clip-path:none;transition:none}.demo-pixel{transition:none}.site-rail{transition:none}}