/* Hallmark · macrostructure: bespoke interactive print · tone: cryptic, tactile, collaborative · anchor hue: vermilion
 * theme: custom · axes: light / heavy grotesk / warm · nav: edge wordmark · footer: inline controls
 * pre-emit critique: P5 H5 E4 S5 R5 V5 */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,800&family=IBM+Plex+Mono:wght@400;500&display=swap');
@import url('tokens.css');
*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}body{background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body)}main{height:100svh;min-height:560px;display:flex;flex-direction:column;padding:var(--space-lg) var(--space-xl)}header{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1;pointer-events:none}h1{font-family:var(--font-display);font-size:var(--text-display);font-weight:800;line-height:.77;letter-spacing:-.075em;margin:0;min-width:0;overflow-wrap:anywhere;font-style:normal}h1>span{display:block}.asterisk{color:var(--color-accent);font-size:.65em;vertical-align:top;margin-left:.06em}.aside{font-size:var(--text-base);line-height:1.7;text-align:right;margin:0}.field{position:relative;flex:1;min-height:260px;margin-top:calc(-1 * var(--space-lg))}canvas{display:block;width:100%;height:100%;touch-action:none;outline-offset:-4px}.whisper{position:absolute;bottom:var(--space-md);left:0;font-size:var(--text-sm);color:var(--color-muted);pointer-events:none}footer{border-top:var(--rule-width) solid var(--color-ink);display:flex;align-items:center;gap:var(--space-lg);min-height:64px;font-size:var(--text-sm)}.signature{letter-spacing:.06em}#edition{margin-left:auto;font-variant-numeric:tabular-nums}.controls{display:flex;gap:var(--space-sm);margin-left:auto}button{font:500 var(--text-base) var(--font-body);color:var(--color-ink);background:var(--color-paper);border:0;min-height:44px;padding:0 var(--space-md);cursor:pointer;white-space:nowrap;border-radius:var(--radius);transition:transform var(--dur-fast) var(--ease-out)}button span{margin-left:var(--space-sm)}button:active{transform:translateY(1px)}button:focus-visible,canvas:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}button[aria-pressed=true]{text-decoration:underline;text-underline-offset:5px}button:disabled{opacity:.5;cursor:wait}button[data-state=error]{text-decoration:underline wavy var(--color-accent)}button[data-state=success]{text-decoration:underline}button[data-state=loading]{opacity:.6}@media(hover:hover){button:hover{color:var(--color-paper);background:var(--color-ink)}}.sr-only{position:absolute;width:1px;height:1px;overflow:clip;clip-path:inset(50%);white-space:nowrap}.fallback{position:absolute;top:50%;left:var(--space-xl);right:var(--space-xl);font-size:var(--text-base)}@media(max-width:600px){main{padding:var(--space-lg) var(--space-md);min-height:540px}h1{font-size:clamp(3.8rem,13vw,5.7rem)}.aside{font-size:.6rem;max-width:80px}.field{margin-top:var(--space-md)}footer{flex-wrap:wrap;gap:0;min-height:92px;justify-content:space-between}.signature{font-size:.6rem;order:2}.controls{margin:0;width:100%;justify-content:space-between}button{padding:0 var(--space-sm)}#edition{order:3}.whisper{bottom:var(--space-sm)}}@media(prefers-reduced-motion:reduce){button{transition:none}}

footer{position:relative}.explore{position:relative;font-size:.72rem}.explore summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:12px;list-style:none}.explore summary::-webkit-details-marker{display:none}.explore nav{position:absolute;bottom:calc(100% + 12px);left:0;z-index:5;min-width:250px;max-height:65svh;overflow:auto;background:var(--color-paper);border:1px solid var(--color-ink);box-shadow:5px 5px 0 var(--color-ink);padding:12px}.explore a{display:flex;align-items:center;min-height:44px;color:inherit;padding:0 12px;text-decoration:none}.explore a:hover,.explore a:focus-visible{background:var(--color-ink);color:var(--color-paper)}@media(max-width:600px){.explore{order:2}.signature{display:none}.explore nav{max-width:calc(100vw - 48px)}}

.signature a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}.signature a:hover{text-decoration:underline;text-underline-offset:4px}.signature a:focus-visible{outline:2px solid var(--color-ink);outline-offset:4px}.explore:not([open]) summary{animation:experiment-signal 8s steps(1,end) infinite}.explore summary:hover,.explore summary:focus-visible{animation:none;text-decoration:underline;text-underline-offset:4px}
@keyframes experiment-signal{0%,88%,100%{transform:none;color:var(--color-ink);background:transparent;text-shadow:none}90%{transform:translateX(2px);color:var(--color-paper);background:var(--color-ink);text-shadow:-2px 0 #a84736,2px 0 #197478}94%{transform:translateX(-1px);color:var(--color-accent);background:transparent;text-shadow:2px 0 #197478}98%{transform:none;text-shadow:none}}
.motion-held .explore summary{animation:none}@media(prefers-reduced-motion:reduce){.explore:not([open]) summary{animation:none;text-decoration:underline;text-underline-offset:4px}}@media(max-width:600px){.signature{display:inline-flex;align-items:center;gap:4px;order:3}#edition{order:4}.explore{order:2}footer{column-gap:12px}}

.explore nav h2{font:500 .65rem var(--font-body);color:var(--color-muted);text-transform:uppercase;letter-spacing:.1em;margin:16px 12px 4px;padding-top:12px;border-top:1px solid var(--color-rule)}.explore nav h2:first-child{border-top:0;padding-top:0;margin-top:4px}