@font-face{font-family:Fraunces;src:url('fonts/Fraunces.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{color-scheme:light;background:#fff8ef;color:#161616;font-family:Fraunces,Georgia,serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{overscroll-behavior:none}
.page{position:relative;width:100%;height:100%;min-height:260px}
.masthead{position:absolute;z-index:2;top:34px;left:42px;pointer-events:none}
h1{margin:0;font-size:42px;font-weight:650;line-height:1;letter-spacing:-2.5px;font-variation-settings:'SOFT' 100,'WONK' 1}
#stage{position:absolute;inset:0;isolation:isolate}
#goo-canvas{display:block;width:100%;height:100%;touch-action:none;outline:none;opacity:0;transition:opacity .35s}
.scene-ready #goo-canvas{opacity:1}#goo-canvas.is-hovering{cursor:grab}#goo-canvas.is-dragging{cursor:grabbing}
.still{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(80px,22vw,290px);font-weight:750;letter-spacing:-.065em;color:#d99535;pointer-events:none}.scene-ready .still{visibility:hidden}
#keyboard-letters{position:absolute;inset:0;pointer-events:none}
.letter-key{position:absolute;border:0;background:transparent;color:transparent;padding:0;pointer-events:none;border-radius:24px;outline:none}
.letter-key:focus-visible{outline:2px dashed #9c6740;outline-offset:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){.masthead{top:26px;left:25px}h1{font-size:35px;letter-spacing:-2px}}
@media(prefers-reduced-motion:reduce){#goo-canvas{transition:none}}

.motion-toggle{position:absolute;right:28px;bottom:25px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;color:#9f8c7a;opacity:.65}.motion-toggle:hover,.motion-toggle:focus-visible{opacity:1;background:#f2e8db}.motion-toggle span{width:2px;height:10px;background:currentColor}.motion-toggle.paused span:first-child{width:0;height:0;background:none;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor}.motion-toggle.paused span:last-child{display:none}.motion-toggle[hidden]{display:none}
