:root{font-family:Arial,sans-serif;color:#171717;background:#f2f0ea;font-synthesis:none;text-rendering:optimizeLegibility}@font-face{font-family:Geist;src:url(/assets/Geist-Variable-Bj2R_7yk.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Geist Mono;src:url(/assets/GeistMono-Variable-Dispecij.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Hershey Simplex;src:url(/assets/HersheySimplex-Medium-B07jXscI.otf) format("opentype");font-style:normal;font-weight:500;font-display:swap}@font-face{font-family:Departure Mono;src:url(/assets/DepartureMono-Regular-2BZob_Zz.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Geist Pixel Square;src:url(/assets/GeistPixel-Square-B0mEoKr8.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Geist Pixel Grid;src:url(/assets/GeistPixel-Grid-CHCHJWPp.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Geist Pixel Circle;src:url(/assets/GeistPixel-Circle-oRhtFUcQ.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Geist Pixel Triangle;src:url(/assets/GeistPixel-Triangle-D7IC7Eqm.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:Geist Pixel Line;src:url(/assets/GeistPixel-Line-Bn2EgCYP.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}*{box-sizing:border-box}body{margin:0;min-width:320px}button,select,textarea,input{font:inherit}button,select{cursor:pointer}.app{--body-size: 16px;--body-leading: 24px;--emphasis-h1: 96px;--emphasis-h1-leading: 108px;--emphasis-h2: 18px;--emphasis-h2-leading: 24px;--grid-unit: var(--body-leading);--column-gap: 24px;display:flex;flex-direction:column;align-items:center;min-height:100vh;color:var(--ink);background:var(--paper);overflow:hidden}.topbar,.workspace{width:100%;max-width:1440px}.topbar{min-height:calc(var(--grid-unit) * 3);display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:var(--column-gap);padding:var(--grid-unit) 24px;border-bottom:1px solid var(--ink);position:relative;z-index:2}.wordmark{display:inline-flex;gap:10px;align-items:flex-start;color:inherit;text-decoration:none}.wordmark-logo{display:block;width:34px;height:34px;overflow:hidden}.wordmark-logo img{display:block;width:34px;height:34px}.wordmark strong{transform:translateY(-1.5px);font:700 12px/1.1 var(--sans);letter-spacing:-.03em}.topbar-meta{display:flex;gap:var(--column-gap);font:11px/var(--grid-unit) var(--mono);text-transform:uppercase;letter-spacing:.08em}.workspace{display:grid;grid-template-columns:minmax(280px,31.25%) 1fr;min-height:calc(100vh - 72px)}.controls{border-right:1px solid var(--ink);padding:calc(var(--grid-unit) * 2) 24px calc(var(--grid-unit) * 2);position:relative;z-index:1}.eyebrow,.role-label,.ratio,.edit-button{font:10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.11em}.eyebrow{color:var(--accent)}.intro h1{max-width:340px;margin:var(--grid-unit) 0;font:500 var(--emphasis-h1)/var(--emphasis-h1-leading) var(--sans);letter-spacing:-.07em}.intro h1 em{font-family:var(--serif);font-style:italic;letter-spacing:-.06em}.control-section{padding:var(--grid-unit) 0;border-top:1px solid var(--ink)}.triad-section,.presets-section{border-top:0}.triad-section,.presets-section{padding-top:0}.section-heading{display:flex;justify-content:space-between;align-items:baseline;min-height:var(--grid-unit);margin-bottom:var(--grid-unit)}.ratio{color:color-mix(in srgb,var(--ink) 55%,transparent)}.font-selector{display:grid;grid-template-columns:52px 1fr 20px;align-items:center;gap:8px;min-height:calc(var(--grid-unit) * 2);border-bottom:1px solid color-mix(in srgb,var(--ink) 30%,transparent)}.triad-section .font-selector{border-bottom:0}.font-selector select{min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;outline:0;padding:0;color:var(--ink);background:transparent;font:14px/var(--grid-unit) var(--sans)}.select-arrow{justify-self:end;font:16px/1 Geist,sans-serif}.role-label{color:var(--accent)}.preset-list{display:grid;gap:1px;background:var(--ink);border:1px solid var(--ink)}.preset{position:relative;display:grid;gap:0;min-height:calc(var(--grid-unit) * 2);padding:var(--grid-unit) 12px;text-align:left;color:var(--ink);background:var(--paper);border:0}.preset:hover,.preset:focus-visible,.preset.selected{color:var(--paper);background:var(--ink)}.preset-list:has(.preset:hover) .preset.selected:not(:hover),.preset-list:has(.preset:focus-visible) .preset.selected:not(:focus-visible){color:var(--ink);background:var(--paper)}.preset-title{font:15px/1 var(--sans);letter-spacing:-.03em}.preset-tag{font:10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;opacity:.65}.preset-arrow{position:absolute;top:var(--grid-unit);right:12px;font:18px/1 Geist,sans-serif}.color-controls{display:grid;gap:8px}.color-control{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:9px;font:12px/1 var(--sans);text-transform:capitalize}.color-control input{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:24px;height:24px;padding:4px;border:0;border-radius:0;background:var(--paper);overflow:hidden}.color-control input::-webkit-color-swatch-wrapper{padding:0}.color-control input::-webkit-color-swatch{border:.75px solid #000;border-radius:0}.color-control input::-moz-color-swatch{border:.75px solid #000;border-radius:0}.color-control code{font:10px/1 var(--mono);text-transform:uppercase;opacity:.65}.reset-button{border:0;padding:0;color:var(--ink);background:transparent;text-decoration:underline;text-underline-offset:3px}.reset-button{margin-top:var(--grid-unit);font:12px/var(--grid-unit) var(--sans)}.specimen-panel{position:relative;z-index:3;min-width:0;padding:0 48px}.specimen-grid{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--column-gap);min-height:calc(100vh - 180px);padding:calc(var(--grid-unit) * 2) 0 calc(var(--grid-unit) * 3)}.specimen-content{position:relative;z-index:1;grid-column:1 / -1;max-width:960px;text-wrap:pretty}.hanging{transform:translateY(0)}.sans{font-family:var(--sans)}.serif{font-family:var(--serif)}.mono{font-family:var(--mono)}.assigned-section{position:relative}.assignment-menu{position:absolute;top:50%;left:-32px;z-index:4;transform:translateY(-50%)}.assignment-trigger{width:16px;padding:0;border:0;color:var(--accent);background:transparent;font:14px/1 var(--sans);cursor:pointer}.assignment-trigger:hover,.assignment-trigger:focus-visible{color:var(--ink)}.assignment-trigger:focus-visible{outline:1px solid var(--accent);outline-offset:3px}.assignment-plus{display:inline-block;width:14px;height:14px;border:1px solid currentColor;border-radius:50%;background:linear-gradient(currentColor,currentColor) center / 7px 1px no-repeat,linear-gradient(currentColor,currentColor) center / 1px 7px no-repeat;vertical-align:middle}.assignment-plus.is-open{background-size:7px 1px,0 0}.assignment-options{position:absolute;top:50%;right:24px;display:grid;width:max-content;min-width:208px;border:1px solid var(--ink);background:var(--paper);box-shadow:4px 4px color-mix(in srgb,var(--ink) 14%,transparent);transform:translateY(-50%)}.adjustment-close{position:absolute;top:-27px;right:-1px;z-index:1;display:grid;width:28px;height:26px;padding:0;border:1px solid var(--ink);border-bottom:0;color:var(--ink);background:var(--paper);font:18px/1 var(--sans);place-items:center;cursor:pointer}.adjustment-close:hover,.adjustment-close:focus-visible{color:var(--accent)}.adjustment-close:focus-visible{outline:1px solid var(--accent);outline-offset:2px}.assignment-option{display:grid;grid-template-columns:42px 1fr;gap:8px;align-items:baseline;padding:8px 10px;border:0;border-bottom:1px solid color-mix(in srgb,var(--ink) 24%,transparent);color:var(--ink);background:var(--paper);text-align:left;cursor:pointer}.assignment-option:last-child{border-bottom:0}.assignment-option span{color:var(--accent);font:9px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}.assignment-option strong{font:12px/1.2 var(--sans);font-weight:500}.assignment-option:hover,.assignment-option.selected{color:var(--paper);background:var(--ink)}.assignment-option:hover span,.assignment-option.selected span{color:var(--accent)}.assignment-options:hover .assignment-option.selected:not(:hover){color:var(--ink);background:var(--paper)}.assignment-options:hover .assignment-option.selected:not(:hover) span{color:var(--accent)}.tracking-control{display:grid;gap:8px;padding:14px 10px;border-top:1px solid var(--ink)}.tracking-heading,.tracking-scale{display:flex;justify-content:space-between;align-items:baseline}.tracking-heading span,.tracking-scale{color:color-mix(in srgb,var(--ink) 62%,transparent);font:9px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}.tracking-heading output{color:var(--ink);font:10px/1 var(--mono)}.tracking-control input{width:100%;margin:4px 0;accent-color:var(--accent)}.tracking-scale button{padding:0;border:0;color:var(--ink);background:transparent;font:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.tracking-scale .tracking-nudge{font:15px/1 var(--mono);letter-spacing:0;text-decoration:none}.byline-assigned-section .assignment-menu{top:calc(50% + 12px)}.specimen-headline{--section-leading: var(--emphasis-h1-leading);max-width:650px;margin:-12px 0 var(--grid-unit);font:500 var(--emphasis-h1)/var(--section-leading) var(--serif);line-height:calc(var(--section-leading) + var(--line-spacing, 0em));text-wrap:balance;text-box-trim:trim-start;text-box-edge:cap alphabetic}.no-orphan{white-space:nowrap}.editable-copy{cursor:text;outline:none;caret-color:var(--accent)}.editable-copy:focus{outline:1px solid var(--accent);outline-offset:6px}.specimen-subhead{--section-leading: var(--emphasis-h2-leading);max-width:440px;margin:0 0 calc(var(--grid-unit) * 2);font:var(--emphasis-h2)/var(--section-leading) var(--sans);line-height:calc(var(--section-leading) + var(--line-spacing, 0em))}.specimen-lede{--section-leading: var(--grid-unit);max-width:520px;margin:0 0 calc(var(--grid-unit) * 2);font:24px/var(--section-leading) var(--serif);line-height:calc(var(--section-leading) + var(--line-spacing, 0em))}.body-block{--section-leading: var(--body-leading);max-width:480px;font:var(--body-size)/var(--section-leading) var(--serif);line-height:calc(var(--section-leading) + var(--line-spacing, 0em))}.body-block p{margin:0}.byline{--section-leading: var(--grid-unit);margin-top:var(--grid-unit);padding-top:var(--grid-unit);border-top:1px solid color-mix(in srgb,var(--ink) 40%,transparent);font:10px/var(--section-leading) var(--mono);line-height:calc(var(--section-leading) + var(--line-spacing, 0em));text-transform:uppercase;letter-spacing:.08em}.mono-note{--section-leading: 16px;max-width:960px;margin-top:calc(var(--grid-unit) * 2);color:var(--accent);font:10px/var(--section-leading) var(--mono);line-height:calc(var(--section-leading) + var(--line-spacing, 0em));letter-spacing:.02em;text-transform:uppercase}.section-stats-heading,.section-stats-row{display:grid;grid-template-columns:82px minmax(130px,1fr) 82px 76px;column-gap:12px}.section-stats-heading{color:color-mix(in srgb,var(--ink) 62%,transparent);border-bottom:1px solid color-mix(in srgb,var(--ink) 40%,transparent);letter-spacing:.08em}.section-stats-row{border-bottom:1px solid color-mix(in srgb,var(--ink) 16%,transparent)}.section-stats-heading span:nth-child(n+3),.section-stats-row span:nth-child(n+3){text-align:right}.section-css-toggle{margin-top:16px;padding:0;border:0;color:var(--ink);background:transparent;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.section-css-output{margin:12px 0 0;padding:12px;overflow-x:auto;border:1px solid var(--ink);color:var(--ink);background:color-mix(in srgb,var(--paper) 94%,var(--ink));font:10px/1.5 var(--mono);letter-spacing:0;text-align:left;text-transform:none;white-space:pre}.specimen-headline.sans,.specimen-subhead.sans,.specimen-lede.sans,.body-block.sans,.mono-note.sans{font-family:var(--sans)}.specimen-headline.serif,.specimen-subhead.serif,.specimen-lede.serif,.body-block.serif,.mono-note.serif{font-family:var(--serif)}.specimen-headline.mono,.specimen-subhead.mono,.specimen-lede.mono,.body-block.mono,.mono-note.mono{font-family:var(--mono)}.byline.sans{font-family:var(--sans)}.byline.serif{font-family:var(--serif)}.byline.mono{font-family:var(--mono)}.waves-section{width:100%;padding:calc(var(--grid-unit) * 5) 24px calc(var(--grid-unit) * 3);border-top:1px solid var(--ink)}.waves-section img{display:block;width:100%;max-width:900px;height:auto;margin:0 auto}@media(min-width:1200px){.topbar,.workspace,.waves-section{width:calc(31.25% + 840px);max-width:100%}.workspace{grid-template-columns:minmax(280px,31.25%) minmax(0,840px)}}@media(max-width:900px){.topbar{grid-template-columns:1fr auto}.topbar-meta{display:none}.workspace{grid-template-columns:1fr}.controls{border-right:0;border-bottom:1px solid var(--ink)}.specimen-panel{min-height:800px}}@media(max-width:600px){.topbar,.controls,.specimen-panel,.waves-section{padding-left:48px;padding-right:48px}.controls{padding-top:var(--grid-unit)}.intro h1{font-size:32px;line-height:calc(var(--grid-unit) * 2)}.specimen-grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:12px;padding-top:var(--grid-unit)}.specimen-content{grid-column:1 / -1}.assignment-menu{left:-40px;margin-top:-16px;transform:none}.assignment-trigger{width:32px;height:32px;touch-action:manipulation}.assignment-options{position:fixed;top:auto;right:16px;bottom:max(16px,env(safe-area-inset-bottom));left:16px;width:auto;min-width:0;max-height:calc(100dvh - 32px);padding-top:44px;overflow-y:auto;overscroll-behavior:contain;transform:none}.adjustment-close{top:0;right:0;width:44px;height:44px;border-top:0;border-right:0;border-bottom:1px solid var(--ink)}.assignment-option{min-height:44px;padding:10px 12px;touch-action:manipulation}.tracking-control{gap:6px;padding:12px}.tracking-control input{min-height:28px}.tracking-scale button{min-width:44px;min-height:40px;touch-action:manipulation}.specimen-headline{--section-leading: 72px;font-size:60px;margin-top:-8px}.specimen-subhead{--section-leading: var(--grid-unit);font-size:18px}.specimen-lede{--section-leading: var(--grid-unit);font-size:21px}.waves-section{padding-top:calc(var(--grid-unit) * 4);padding-bottom:calc(var(--grid-unit) * 2)}}@media(prefers-reduced-motion:no-preference){.preset,.reset-button{transition:background-color .18s ease,color .18s ease}}
