.hero{grid-template-columns:1.05fr 1fr;align-items:center;gap:56px;min-height:78vh;display:grid;position:relative}@media (max-width:900px){.hero{grid-template-columns:1fr;gap:32px;min-height:auto}.hero-art{order:2;max-width:480px;margin:0 auto}}.hero-art{cursor:crosshair;margin-top:64px;position:relative}.hero-art canvas{width:100%;height:auto;display:block}.hero-art.dragover:after{content:"drop photo to render as stipple";background:color-mix(in oklab, var(--bg) 92%, transparent);border:2px dashed var(--accent);font-family:var(--font-mono), monospace;color:var(--accent);justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;inset:0}@media (hover:none){.hero-fx{opacity:.85}}.hero-fx{font-family:var(--font-mono), monospace;letter-spacing:.05em;opacity:.85;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:14px;font-size:11px;transition:opacity .4s;display:flex}.hero-art:hover .hero-fx{opacity:1}.hero-fx__label{color:var(--ink-mute);opacity:.7}.hero-fx__label:after{content:" ▸"}.hero-fx__opt{appearance:none;font:inherit;letter-spacing:inherit;color:var(--ink-mute);cursor:pointer;opacity:.8;background:0 0;border:0;border-bottom:1px solid #0000;padding:2px 0;transition:opacity .2s,color .2s,border-color .2s}.hero-fx__opt:hover{opacity:1}.hero-fx__opt[aria-pressed=true]{color:var(--accent);opacity:1;border-bottom-color:var(--accent)}@media (prefers-reduced-motion:reduce){.hero-fx{display:none}}.hero-meta{font-family:var(--font-mono), monospace;color:var(--ink-mute);letter-spacing:.05em;text-align:right;margin-bottom:20px;font-size:11px;line-height:1.7}.hero-meta b{color:var(--ink);font-weight:500}@media (max-width:900px){.hero-meta{display:none}}.hero-text h1{letter-spacing:-.025em;margin-bottom:28px;font-size:clamp(54px,8vw,104px);font-weight:700;line-height:.96}.hero-text h1 .accent{color:var(--accent)}.hero-text .lede{color:var(--ink-soft);max-width:500px;margin-bottom:40px;font-size:clamp(18px,1.7vw,22px);line-height:1.5}.links-list{font-family:var(--font-mono), monospace;flex-direction:column;gap:10px;font-size:14px;display:flex}.links-list a{color:var(--ink);border-bottom:1px solid var(--ink);align-self:flex-start;gap:12px;padding:4px 0;transition:gap .2s,color .15s;display:inline-flex}.links-list a:hover{color:var(--accent);border-bottom-color:var(--accent);gap:18px}.links-list a .arrow{width:16px}