:root{--paper:#f5f0e7;--paper2:#eee5d8;--ink:#171310;--muted:#6e655d;--gold:#b68c43;--roast:#994233;--leaf:#4d5b4a;--line:#cfc3b4;--serif:'Cormorant Garamond',serif;--sans:'Inter',sans-serif;--g:clamp(22px,5vw,80px)}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}img{width:100%;display:block}.book-header{height:70px;padding:0 var(--g);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;background:rgba(245,240,231,.95);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em}.book-header a{color:var(--ink);text-decoration:none}.book-header>a:last-child{justify-self:end}.mark{display:inline-grid;line-height:1;width:max-content}.mark span{font:500 1.35rem var(--serif);letter-spacing:.1em}.mark small{font-size:.39rem;letter-spacing:.3em;margin-top:4px}.cover{min-height:calc(100vh - 70px);display:grid;grid-template-columns:48% 52%}.cover>div{padding:10vh var(--g);display:flex;flex-direction:column;justify-content:center}.cover>div>p:first-child,.number{font-size:.68rem;text-transform:uppercase;letter-spacing:.15em;color:var(--roast)}.cover h1{font:500 clamp(4.4rem,8.3vw,9rem)/.77 var(--serif);letter-spacing:-.045em;margin:30px 0}.dek{max-width:48ch;color:var(--muted)}.cover picture img{height:100%;object-fit:cover}.book-section{padding:clamp(90px,12vw,180px) var(--g);border-top:1px solid var(--line)}.book-section h2{font:500 clamp(3.3rem,6vw,7rem)/.88 var(--serif);letter-spacing:-.035em;margin:16px 0}.split,.type,.rules,.ui,.voice,.handoff{display:grid;grid-template-columns:.55fr 1.1fr;gap:10vw}.sticky{position:sticky;top:110px;align-self:start}.lead{font:500 clamp(2.3rem,4vw,4.5rem)/1.02 var(--serif);margin-top:0}.copy p:not(.lead),.block p,.palette p,.photography p{color:var(--muted)}.block{border-top:1px solid var(--line);padding:26px 0}.block h3,.rule-grid h3{font:500 2rem var(--serif)}.palette{display:grid;gap:65px}.palette>div:first-child{max-width:720px}.swatches{display:grid;grid-template-columns:repeat(5,1fr)}.swatches div{background:var(--c);color:#fff;min-height:220px;padding:20px;display:flex;flex-direction:column;justify-content:flex-end}.swatches .light{color:var(--ink)}.swatches b,.swatches span{font-size:.72rem}.type-copy{display:grid;gap:28px}.display{font:500 clamp(3rem,5vw,6rem)/.9 var(--serif);margin:0}.ui{font-size:.76rem;letter-spacing:.13em}.mark-sample{display:grid;line-height:1;width:max-content;margin-top:15px}.mark-sample span{font:500 3.7rem var(--serif);letter-spacing:.12em}.mark-sample small{font-size:.56rem;letter-spacing:.36em;text-align:center;margin-top:8px}.photography{padding-left:0;padding-right:0}.photography>div:first-child{padding:0 var(--g) 65px;max-width:900px}.photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.photo-grid picture:nth-child(2),.photo-grid picture:nth-child(4){margin-top:75px}.photo-grid img{aspect-ratio:3/4;object-fit:cover}.rule-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.rule-grid article{border-top:1px solid var(--line);padding-top:20px}.rule-grid li{margin:12px 0;color:var(--muted)}.recognition{background:var(--paper2);display:grid;gap:55px}.recognition-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw;align-items:center}.recognition-layout picture img{aspect-ratio:4/5;object-fit:cover}.ui-demo{border:1px solid var(--line);padding:28px;margin:40px 0;display:flex;align-items:center;gap:24px;flex-wrap:wrap}.ui-demo button{background:var(--gold);border:1px solid var(--gold);color:#fff;padding:14px 18px;text-transform:uppercase;font-size:.68rem;letter-spacing:.1em}.ui-demo a{text-transform:uppercase;font-size:.68rem;letter-spacing:.1em;border-bottom:1px solid var(--gold)}.ui-demo div{border-left:1px solid var(--line);padding-left:20px;display:grid}.ui-demo small{color:var(--roast);letter-spacing:.1em}.voice table{width:100%;border-collapse:collapse}.voice th,.voice td{border-top:1px solid var(--line);padding:16px 0;text-align:left;vertical-align:top}.voice th{width:110px;color:var(--roast);text-transform:uppercase;font-size:.68rem;letter-spacing:.1em}.voice blockquote{font:500 3.2rem/1 var(--serif);margin:55px 0}.note{border-left:2px solid var(--roast);padding-left:20px}footer{border-top:1px solid var(--line);padding:36px var(--g);display:flex;justify-content:space-between;font-size:.7rem;text-transform:uppercase;letter-spacing:.09em}footer a{color:var(--ink)}
@media(max-width:800px){.book-header{grid-template-columns:1fr auto}.book-header>span{display:none}.cover{grid-template-columns:1fr;min-height:auto}.cover>div{padding-top:90px;padding-bottom:60px}.cover picture img{height:70vh}.split,.type,.rules,.ui,.voice,.handoff,.recognition-layout{grid-template-columns:1fr}.sticky{position:static}.swatches{grid-template-columns:1fr 1fr}.swatches div{min-height:150px}.photo-grid{grid-template-columns:1fr 1fr}.photo-grid picture:nth-child(2),.photo-grid picture:nth-child(4){margin-top:38px}.rule-grid{grid-template-columns:1fr}.voice blockquote{font-size:2.4rem}footer{gap:20px;flex-wrap:wrap}}