.colour-forest{gap:var(--space-16);min-width:0;display:grid}.forest-picker{gap:var(--space-8);min-width:0;max-width:24rem;display:grid}.forest-picker select{width:100%;min-height:var(--control-md);padding:var(--space-8) var(--space-12);color:var(--plum);background:var(--white);border:var(--border-width) solid var(--line-strong);border-radius:var(--radius-button);font:inherit}.forest-frame{--float-inset:var(--space-12);isolation:isolate;border:var(--border-width) solid var(--line);border-radius:var(--radius-card);background:var(--white);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;height:clamp(28rem,100dvh - 9rem,54rem);position:relative;overflow:hidden}.forest-frame .forest-viewport{touch-action:pan-y;width:100%!important;height:100%!important}.forest-frame[data-pans] .forest-viewport{touch-action:none;cursor:grab}.forest-frame[data-pans][data-gesturing] .forest-viewport{cursor:grabbing}.forest-stage{width:100%;height:100%;position:relative}.forest-picture{position:absolute;inset:0}.forest-picture img,.forest-picture canvas{object-fit:contain;width:100%;height:100%;display:block}.forest-picture canvas{cursor:crosshair}.forest-frame[data-pans] canvas,.forest-frame[data-tool=move] canvas{cursor:inherit}.forest-frame[data-brushing] canvas{cursor:crosshair}.forest-picture canvas[hidden]{display:none}.forest-picture canvas:focus-visible{outline:none}.forest-frame:has(canvas:focus-visible){outline:var(--outline-width) solid var(--teal-deep);outline-offset:4px}.forest-cursor{width:24px;height:24px;transform:translate(-50%, -50%) scale(calc(1 / var(--zoom,1)));border:2px solid var(--plum);background:var(--white);box-shadow:0 0 0 2px var(--white);pointer-events:none;border-radius:50%;display:none;position:absolute}.forest-frame:has(canvas:focus-visible) .forest-cursor{display:block}.forest-cursor:before,.forest-cursor:after{content:"";background:var(--plum);position:absolute}.forest-cursor:before{width:2px;height:30px;top:-5px;left:9px}.forest-cursor:after{width:30px;height:2px;top:9px;left:-5px}.forest-float{z-index:2;align-items:center;gap:var(--space-4);padding:var(--space-4);border-radius:var(--radius-pill);background:color-mix(in srgb, var(--white) 88%, transparent);backdrop-filter:blur(14px);box-shadow:var(--shadow-float);display:flex;position:absolute}.forest-view-controls{top:var(--float-inset);left:var(--float-inset)}.forest-share-controls{top:var(--float-inset);right:var(--float-inset)}.forest-icon-button{width:var(--control-sm);height:var(--control-sm);color:var(--plum);transition:background-color var(--duration-fast) var(--ease-out);background:0 0;border:0;border-radius:50%;place-items:center;display:grid}.forest-icon-button:disabled{opacity:.35;cursor:not-allowed}@media (hover:hover){.forest-icon-button:hover:not(:disabled){background:var(--soft)}}.forest-share-controls .forest-share{width:var(--control-sm);height:var(--control-sm);border-radius:50%;padding:0}.forest-share-controls .forest-share:after{border-radius:var(--radius-pill);inset:3px 8px auto}.forest-tray{left:var(--float-inset);right:var(--float-inset);bottom:var(--float-inset);align-items:stretch;gap:var(--space-8);max-width:34rem;padding:var(--space-8) var(--space-8) var(--space-12);border-radius:calc(var(--radius-card) + 4px);flex-direction:column;margin-inline:auto}.forest-colours{border:0;min-width:0;margin:0;padding:0}.forest-palette{gap:var(--space-8);scrollbar-width:none;overscroll-behavior-x:contain;padding:5px;display:flex;overflow-x:auto}.forest-palette::-webkit-scrollbar{display:none}.forest-swatch{background:var(--swatch,var(--white));width:2.5rem;height:2.5rem;box-shadow:inset 0 -3px 0 color-mix(in srgb, var(--plum) 20%, transparent), inset 0 3px 0 color-mix(in srgb, var(--white) 35%, transparent);transition:transform var(--duration-fast) var(--ease-out);border:0;border-radius:50%;flex:none}.forest-swatch[aria-pressed=true]{outline:3px solid var(--plum);outline-offset:3px}.forest-swatch:active{transform:scale(.92)}.forest-swatch:disabled{opacity:.55;transform:none}.forest-swatch:focus-visible{outline:var(--outline-width) solid var(--teal-deep);outline-offset:3px}.forest-tools{align-items:center;gap:var(--space-4);display:flex}.forest-tool{min-width:0;height:var(--control-sm);background:var(--soft);color:var(--plum);transition:background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);border:0;border-radius:14px;flex:1;place-items:center;display:grid}.forest-tool[aria-pressed=true]{background:var(--selected);color:var(--orange-deep);box-shadow:inset 0 0 0 2px var(--selected-edge)}.forest-tool:disabled{opacity:.35;cursor:not-allowed}.forest-sizes{justify-content:center;gap:var(--space-8);display:flex}.forest-size{width:var(--control-sm);height:var(--control-sm);background:var(--soft);color:var(--plum);border:0;border-radius:50%;place-items:center;display:grid}.forest-size span{width:var(--dot);height:var(--dot);background:currentColor;border-radius:50%}.forest-size[aria-pressed=true]{background:var(--selected);color:var(--orange-deep);box-shadow:inset 0 0 0 2px var(--selected-edge)}.forest-divider{margin:var(--space-4) 2px;background:var(--line);border-radius:2px;flex:0 0 2px;align-self:stretch}.forest-actions{justify-items:start;gap:var(--space-12);min-width:0;display:grid}.forest-history{gap:var(--space-12);flex-wrap:wrap;display:flex}.forest-quiet{align-items:center;gap:var(--space-8) var(--space-24);flex-wrap:wrap;display:flex}.forest-status{min-height:1.5em;font-weight:700}.forest-hint,.forest-note{color:var(--plum-soft)}.canvas-gate-mark{width:var(--control-lg);height:var(--control-lg);border-radius:var(--radius-pill);background:var(--selected);box-shadow:inset 0 0 0 2px var(--selected-edge);place-items:center;display:grid}@media (width>=64rem){.colour-forest:not([data-expanded]){column-gap:var(--space-32);grid-template:"frame picker""frame actions"1fr/minmax(0,1fr) minmax(15rem,18rem);align-items:start}.colour-forest:not([data-expanded])>.forest-picker{grid-area:picker}.colour-forest:not([data-expanded])>.forest-frame{grid-area:frame;height:clamp(30rem,100dvh - 17rem,54rem)}.colour-forest:not([data-expanded])>.forest-actions{grid-area:actions}.colour-forest:not([data-expanded]) .forest-history{flex-direction:column;align-items:stretch;width:100%}}@media (height<=30rem) and (width>=34rem){.forest-frame{height:calc(100dvh - 2rem);min-height:16rem}.forest-tray{max-width:46rem;padding:var(--space-4) var(--space-8);border-radius:var(--radius-pill);flex-direction:row;align-items:center}.forest-colours{flex:1}.forest-tools{flex:none}.forest-tool{flex:0 0 var(--control-sm)}.forest-sizes{flex:none}}.colour-forest[data-expanded]{z-index:55;background:var(--white);display:block;position:relative}.colour-forest[data-expanded=css]{height:100dvh;position:fixed;inset:0}.colour-forest:fullscreen{width:100%;height:100%}.colour-forest[data-expanded] .forest-frame{--float-inset:var(--space-12);border:0;border-radius:0;height:auto;position:absolute;inset:0}.colour-forest[data-expanded] .forest-view-controls{top:max(var(--float-inset), env(safe-area-inset-top));left:max(var(--float-inset), env(safe-area-inset-left))}.colour-forest[data-expanded] .forest-share-controls{top:max(var(--float-inset), env(safe-area-inset-top));right:max(var(--float-inset), env(safe-area-inset-right))}.colour-forest[data-expanded] .forest-tray{bottom:max(var(--float-inset), env(safe-area-inset-bottom));left:max(var(--float-inset), env(safe-area-inset-left));right:max(var(--float-inset), env(safe-area-inset-right))}.colour-forest[data-expanded] .forest-viewport{touch-action:none}.colour-forest[data-expanded] .forest-picker,.colour-forest[data-expanded] .forest-actions>:not(.forest-status){display:none}.colour-forest[data-expanded] .forest-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.colour-forest[data-expanded] .forest-tray{max-width:36rem}:root.canvas-expanded{overflow:hidden}@media (prefers-reduced-motion:reduce){.forest-swatch:active{transform:none}.forest-stage{transition:none}}.canvas-intro[data-astro-cid-hplybzku]{gap:var(--space-8);max-width:var(--measure);margin-bottom:var(--space-24);display:grid}@media (width>=64rem){.canvas-page{padding-top:var(--space-24)}.canvas-intro[data-astro-cid-hplybzku]{margin-bottom:var(--space-16)}}.canvas-noscript[data-astro-cid-hplybzku]{margin-top:var(--space-16);max-width:var(--measure)}