:root{--ui-accent:var(--experiments-colors-ce4d5f6);--ui-panel:var(--experiments-colors-c111726e8);--ui-muted:var(--experiments-colors-cadb6cb)}html,body,main{background:var(--experiments-colors-c070b13)}canvas{cursor:grab}canvas:active{cursor:grabbing}.intro{top:auto;bottom:125px;pointer-events:none;transition:opacity .7s}.intro h1{font-size:clamp(38px,5vw,70px)}.intro p{font-size:12px}.playing .intro{opacity:0}.study{font-size:9px;letter-spacing:.17em;color:var(--ui-muted);margin-left:auto}.dock #pause{width:auto;min-width:76px;padding:0 14px;font-size:11px}.dock #reset,header #help{min-width:44px;min-height:44px}.dock .palette{padding:0 13px}.caption,.status{max-width:24%;line-height:1.6}aside{z-index:5}#message{bottom:95px;font-size:12px}@media(max-width:650px){.study{display:none}.intro{top:110px;bottom:auto;left:24px}.intro h1{font-size:42px}.intro p{font-size:11px}.intro .eyebrow{font-size:8px}.dock{gap:2px}.dock .palette{padding:0 10px}.dock #pause{min-width:70px}.caption,.status{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

header #help{margin-left:auto}canvas:focus:not(:focus-visible){outline:none}@media(max-width:650px){.intro{top:105px}.intro h1{font-size:36px;margin-bottom:12px}.intro .eyebrow{margin-bottom:14px}}

@media(min-width:651px){body:not(.playing) .intro{top:auto;bottom:125px}}

@media(max-width:650px){body:not(.playing) .intro{top:105px}}