:root{--ui-fg:#ffffffdb;--ui-dim:#ffffff73;--ui-faint:#ffffff24;--ui-line:#ffffff14;--ui-bg:#0e0d1080;--ui-font:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;--ui-fade:opacity .9s ease}canvas{touch-action:none}body.idle canvas{cursor:none}.panel{scrollbar-width:none;box-sizing:border-box;width:236px;max-height:calc(100vh - 48px);color:var(--ui-fg);background:var(--ui-bg);border:1px solid var(--ui-line);backdrop-filter:blur(16px)saturate(130%);font:400 12px/1.35 var(--ui-font);user-select:none;transition:var(--ui-fade);border-radius:12px;padding:2px 16px 12px;position:fixed;top:24px;right:24px;overflow-y:auto}.panel::-webkit-scrollbar{display:none}body:not(.ready) .panel,body:not(.ready) .hint,body:not(.ready) .panel-toggle,body:not(.ready) .brand,body.idle .panel,body.idle .hint,body.idle .brand,body.controls-hidden .panel,body.controls-hidden .hint,body.controls-hidden .brand{opacity:0;pointer-events:none}.group+.group{border-top:1px solid var(--ui-line)}.group__title{all:unset;box-sizing:border-box;width:100%;color:var(--ui-dim);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;justify-content:space-between;align-items:center;padding:12px 0 9px;font-size:10.5px;display:flex}.group__title:hover{color:var(--ui-fg)}.group__title:after{content:"";border-bottom:1px solid;border-right:1px solid;width:5px;height:5px;margin-right:2px;transition:transform .2s;transform:translateY(-2px)rotate(45deg)}.group:not(.open) .group__title:after{transform:rotate(-45deg)}.group:not(.open) .group__body{display:none}.group__meter{letter-spacing:.04em;text-transform:none;font-variant-numeric:tabular-nums;margin:0 12px 0 auto}.panel [hidden]{display:none}.control{grid-template-columns:1fr auto;row-gap:3px;padding:4px 0 5px;display:grid}.control--auto{grid-template-columns:1fr auto auto;align-items:center;column-gap:8px}.toggle{all:unset;border:1px solid var(--ui-line);color:var(--ui-dim);letter-spacing:.04em;cursor:pointer;border-radius:999px;padding:0 7px;font-size:10.5px;line-height:16px;transition:color .15s,border-color .15s}.toggle:hover{color:var(--ui-fg)}.toggle[aria-pressed=true]{color:var(--ui-fg);border-color:#fff9}.toggle:focus-visible{outline-offset:2px;outline:1px dashed #ffffffb3}.control__label{cursor:default}.control__value{color:var(--ui-dim);font-variant-numeric:tabular-nums}.control input{grid-column:1/-1}.control input[type=range]{-webkit-appearance:none;appearance:none;cursor:pointer;background:0 0;width:100%;height:16px;margin:0}.control input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, #ffffffb3 var(--fill), var(--ui-faint) var(--fill));border-radius:2px;height:2px}.control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border-radius:50%;width:11px;height:11px;margin-top:-4.5px;transition:transform .15s;box-shadow:0 0 0 3px #ffffff12}.control input[type=range]:active::-webkit-slider-thumb{transform:scale(1.25)}.control input[type=range]::-moz-range-track{background:var(--ui-faint);border-radius:2px;height:2px}.control input[type=range]::-moz-range-progress{background:#ffffffb3;border-radius:2px;height:2px}.control input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:11px;height:11px}.control input[type=range]:focus-visible{outline-offset:4px;border-radius:4px;outline:1px solid #ffffff80}.chips{grid-template-columns:1fr 1fr;gap:6px;padding:2px 0 10px;display:grid}.chips--row{grid-template-columns:none;grid-auto-columns:1fr;grid-auto-flow:column}.control .chips{grid-column:1/-1;padding:2px 0 0}.chip{all:unset;box-sizing:border-box;border:1px solid var(--ui-line);color:var(--ui-dim);text-align:center;letter-spacing:.02em;cursor:pointer;border-radius:7px;padding:5px 0;transition:color .15s,border-color .15s,background-color .15s}.chip:hover{color:var(--ui-fg);background:#ffffff0a}.chip[aria-checked=true]{color:var(--ui-fg);border-color:#fff9}.chip:focus-visible{outline-offset:2px;outline:1px dashed #ffffffb3}.fish-presets{gap:4px;padding:2px 0 10px;display:grid}.fish-preset{all:unset;box-sizing:border-box;border:1px solid var(--ui-line);color:var(--ui-dim);letter-spacing:.02em;white-space:nowrap;cursor:pointer;border-radius:8px;align-items:center;gap:10px;padding:6px 10px 6px 7px;transition:color .15s,border-color .15s,background-color .15s;display:flex}.fish-preset:hover{color:var(--ui-fg);background:#ffffff0a}.fish-preset[aria-checked=true]{color:var(--ui-fg);border-color:#fff9}.fish-preset:focus-visible{outline-offset:2px;outline:1px dashed #ffffffb3}.fish-preset__swatch{background:linear-gradient(135deg, var(--a) 0 42%, var(--b) 42% 72%, var(--c) 72%);border-radius:50%;flex-shrink:0;width:18px;height:18px;box-shadow:inset 0 0 0 1px #ffffff29}.fish-preset__fins{color:var(--ui-dim);margin-left:auto;font-size:11px}.swatches{flex-wrap:wrap;gap:9px;padding:4px 0 10px;display:flex}.swatch{all:unset;background:linear-gradient(135deg, var(--a) 0 42%, var(--b) 42% 72%, var(--c) 72%);cursor:pointer;border-radius:50%;width:22px;height:22px;transition:transform .15s;box-shadow:inset 0 0 0 1px #ffffff29}.swatch:hover{transform:scale(1.1)}.swatch[aria-checked=true]{outline-offset:3px;outline:1px solid #ffffffe6}.swatch:focus-visible{outline-offset:3px;outline:1px dashed #ffffffb3}.button{all:unset;box-sizing:border-box;border:1px solid var(--ui-line);text-align:center;letter-spacing:.04em;cursor:pointer;border-radius:8px;width:100%;margin-top:8px;padding:7px 0;display:block}.button:hover{background:#ffffff0f}.button:focus-visible{outline:1px solid #ffffff80}.hint{color:#ffffff5c;font:400 12px/1.4 var(--ui-font);letter-spacing:.02em;pointer-events:none;transition:var(--ui-fade);margin:0;position:fixed;bottom:20px;left:24px}.brand{--brand-cream:#fff5e9;--brand-ink:#1e1d1c;transition:var(--ui-fade);align-items:center;gap:14px;display:flex;position:fixed;top:24px;left:24px}.brand__logo{color:var(--brand-cream);padding:4px 0;display:block}.brand__logo svg{width:40px;height:25px;display:block}.brand__cta{height:34px;color:var(--brand-ink);backdrop-filter:blur(16px);font:500 12.5px/1 var(--ui-font);white-space:nowrap;background:#fff5e9f2;border-radius:999px;align-items:center;gap:6px;padding:0 14px;text-decoration:none;transition:background-color .2s;display:flex;box-shadow:0 0 0 .5px #1e1d1c1a,0 8px 24px #0000004d}.brand__cta:hover{background:var(--brand-cream)}.brand__cta svg{flex-shrink:0;width:13px;height:13px;transition:translate .2s}.brand__cta:hover svg{translate:1.5px -1.5px}.brand__logo:focus-visible,.brand__cta:focus-visible{outline-offset:3px;outline:1px solid #ffffffb3}.brand__logo:focus-visible{border-radius:4px}.brand__short,.panel-toggle{display:none}@media (width<=640px){.panel{width:auto;max-height:55vh;display:none;inset:auto 12px 64px}body.panel-open .panel{display:block}.panel-toggle{all:unset;color:var(--ui-fg);background:var(--ui-bg);border:1px solid var(--ui-line);backdrop-filter:blur(16px);font:400 12px/1.2 var(--ui-font);letter-spacing:.04em;transition:var(--ui-fade);border-radius:999px;padding:8px 14px;display:block;position:fixed;bottom:16px;right:16px}body.idle:not(.panel-open) .panel-toggle{opacity:.35}.hint{bottom:22px;left:16px;right:120px}.brand{gap:12px;top:16px;left:16px}.brand__logo svg{width:35px;height:22px}.brand__cta{height:32px;padding:0 12px}.brand__long{display:none}.brand__short{display:inline}}
