*,*:before,*:after{box-sizing:border-box}html{background:var(--surface);color:var(--ink);font-family:var(--font-text);font-size:var(--type-body-size);line-height:var(--type-body-line);-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;display:flex;flex-direction:column}main{flex:1}a{color:inherit}.wrap{width:min(100% - 2 * var(--space-5),var(--content-wide));margin-inline:auto}.top{display:flex;align-items:center;justify-content:space-between;padding-block:var(--space-5)}.mark{display:inline-flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-size:var(--type-title-s-size);font-weight:var(--type-title-s-weight);letter-spacing:var(--type-title-s-tracking);text-decoration:none}.seed{width:8px;height:8px;border-radius:var(--radius-round);background:var(--ink)}.by{font-family:var(--font-data);font-size:var(--type-data-s-size);color:var(--ink-subtle);text-decoration:none}.by:hover{color:var(--ink)}.hero{padding-block:var(--space-8) var(--space-6)}h1{margin:0;font-family:var(--font-display);font-size:var(--type-display-l-size);line-height:var(--type-display-l-line);font-weight:var(--type-display-l-weight);letter-spacing:var(--type-display-l-tracking);text-wrap:balance}.flourish{font-family:var(--font-serif);font-weight:400;color:var(--accent-text)}.lead{margin:var(--space-3) 0 0;font-size:var(--type-body-l-size);line-height:var(--type-body-l-line);color:var(--ink-muted)}.stage{margin-block:0}.frame{position:relative;aspect-ratio:12 / 5;background:var(--canvas-ground);border-radius:var(--radius-xs);overflow:hidden;box-shadow:var(--shadow-1)}.frame canvas{display:block;width:100%;height:100%}.nogpu[hidden]{display:none}.nogpu{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:var(--space-6);text-align:center;color:var(--canvas-ink-muted)}figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-2) var(--space-5);padding-top:var(--space-3);font-size:var(--type-body-s-size);color:var(--ink-muted)}.readout{font-family:var(--font-data);font-size:var(--type-data-s-size);color:var(--ink-subtle);font-variant-numeric:tabular-nums}.frame canvas{cursor:ew-resize;touch-action:pan-y}.deck{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:var(--space-3) var(--space-5);align-items:end;margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line)}.deck[hidden]{display:none}.deck label{display:grid;grid-template-columns:1fr auto;gap:var(--space-1) var(--space-2);align-items:center;font-family:var(--font-data);font-size:var(--type-data-s-size);color:var(--ink-muted)}.deck .k{text-transform:uppercase;letter-spacing:var(--type-label-tracking);font-size:var(--type-label-size)}.deck output{color:var(--ink-subtle);font-variant-numeric:tabular-nums;text-align:right;min-width:5ch}.deck input[type=range]{grid-column:1 / -1;width:100%;margin:0;accent-color:var(--ink);cursor:pointer}.quiet{min-height:32px;padding:0 var(--space-4);font:inherit;font-size:var(--type-body-s-size);color:var(--ink-muted);background:transparent;border:1px solid var(--line-strong);border-radius:var(--radius-pill)}.quiet:hover{color:var(--ink);background:var(--surface-sunk)}@media(max-width:760px){.deck{grid-template-columns:repeat(2,minmax(0,1fr))}.quiet{grid-column:1 / -1;justify-self:start}}.join{padding-block:var(--space-8) var(--space-9)}h2{margin:0 0 var(--space-4);font-family:var(--font-display);font-size:var(--type-title-l-size);line-height:var(--type-title-l-line);font-weight:var(--type-title-l-weight);letter-spacing:var(--type-title-l-tracking)}form{display:flex;flex-wrap:wrap;gap:var(--space-2);max-width:520px}input[type=email]{flex:1 1 240px;min-height:44px;padding:0 var(--space-4);font:inherit;color:var(--ink);background:var(--surface-sunk);border:1px solid var(--line-strong);border-radius:var(--radius-pill)}input[type=email]::placeholder{color:var(--ink-subtle)}button{min-height:44px;padding:0 var(--space-5);font:inherit;font-weight:500;color:var(--on-brand);background:var(--brand);border:0;border-radius:var(--radius-pill);cursor:pointer;transition:background var(--dur-quick) var(--ease-whistle),transform var(--dur-instant) var(--ease-whistle)}button:hover{background:var(--brand-hover)}button:active{transform:scale(.97)}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.hp{position:absolute;left:-10000px;width:1px;height:1px;opacity:0}.status{min-height:1.5em;margin:var(--space-3) 0 0;font-size:var(--type-body-s-size);color:var(--ink-muted)}.foot{display:flex;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-5);border-top:1px solid var(--line);font-size:var(--type-body-s-size);color:var(--ink-subtle)}@media(max-width:640px){h1{font-size:var(--type-display-m-size);line-height:var(--type-display-m-line);letter-spacing:var(--type-display-m-tracking)}.frame{aspect-ratio:4 / 3}}@media(prefers-reduced-motion:reduce){button{transition:none}}