:root{--sf-primary-100: hsl(207 100% 96.078%);--sf-primary-200: hsl(207.123 97.333% 85.294%);--sf-primary-300: hsl(206.809 72.308% 74.51%);--sf-primary-400: hsl(216.216 60% 63.725%);--sf-primary-500: hsl(226.935 51.667% 52.941%);--sf-primary-600: hsl(229.091 52.838% 44.902%);--sf-primary-700: hsl(230.811 58.73% 37.059%);--sf-primary-800: hsl(232.8 67.568% 29.02%);--sf-primary-900: hsl(234.483 81.308% 20.98%);--sf-neutral-100: hsl(200 60% 96.078%);--sf-neutral-200: hsl(198 26.316% 85.098%);--sf-neutral-300: hsl(200.769 19.697% 74.118%);--sf-neutral-400: hsl(210.968 16.578% 63.333%);--sf-neutral-500: hsl(219.429 14.403% 52.353%);--sf-neutral-600: hsl(223.636 14.537% 44.51%);--sf-neutral-700: hsl(226.452 16.578% 36.667%);--sf-neutral-800: hsl(228.889 18.367% 28.824%);--sf-neutral-900: hsl(230.4 23.364% 20.98%);--sf-space-1: 4px;--sf-space-2: 8px;--sf-space-3: 12px;--sf-space-4: 16px;--sf-space-6: 24px;--sf-space-8: 32px;--sf-space-12: 48px;--sf-space-16: 64px;--sf-space-24: 96px;--sf-text-caption: 12px;--sf-text-body: 16px;--sf-text-brand: 20px;--sf-text-title: 28px;--sf-text-headline: 36px;--sf-weight-normal: 400;--sf-weight-strong: 600;--sf-radius-sm: 8px;--sf-radius-md: 16px;--sf-radius-lg: 24px;--sf-radius-round: 999px;--sf-target: 44px;--sf-icon-sm: 20px;--sf-icon: 24px;--sf-shadow-1: 0 1px 2px rgb(35 50 84 / .08);--sf-shadow-2: 0 4px 8px rgb(35 50 84 / .08), 0 1px 2px rgb(35 50 84 / .06);--sf-shadow-3: 0 8px 16px rgb(35 50 84 / .1), 0 2px 4px rgb(35 50 84 / .06);--sf-shadow-4: 0 16px 32px rgb(35 50 84 / .14), 0 4px 8px rgb(35 50 84 / .06);--sf-shadow-5: 0 24px 48px rgb(35 50 84 / .18), 0 8px 16px rgb(35 50 84 / .06);--sf-motion-fast: .15s;--sf-motion-normal: .2s;--sf-z-popover: 50}:root,.sf-player,.sf-dock{--sf-bg: hsl(228 33.333% 97.059%);--sf-surface: hsl(0 0% 100%);--sf-recessed: hsl(228 33.333% 97.059%);--sf-ink: hsl(221.633 41.176% 23.333%);--sf-muted: hsl(223.636 14.537% 44.51%);--sf-subtle: hsl(223.636 14.537% 44.51%);--sf-line: hsl(223.333 31.034% 88.627%);--sf-track: hsl(219.429 14.403% 52.353%);--sf-accent: hsl(226.935 51.667% 52.941%);--sf-hover: hsl(229.091 52.838% 44.902%);--sf-on-accent: hsl(0 0% 100%);--sf-selected: hsl(207 100% 96.078%)}:root[data-theme=dark],.sf-player[data-theme=dark],.sf-dock[data-theme=dark]{--sf-bg: hsl(222 45.455% 8.627%);--sf-surface: hsl(220.714 45.161% 12.157%);--sf-recessed: hsl(222 45.455% 8.627%);--sf-ink: hsl(225 100% 94.51%);--sf-muted: hsl(223.902 23.164% 65.294%);--sf-subtle: hsl(223.902 23.164% 65.294%);--sf-line: hsl(225.405 27.82% 26.078%);--sf-track: hsl(219.429 14.403% 52.353%);--sf-accent: hsl(228.312 100% 84.902%);--sf-hover: hsl(207.123 97.333% 85.294%);--sf-on-accent: hsl(222 45.455% 8.627%);--sf-selected: hsl(224.571 42.169% 16.275%)}.sf-player{width:100%;position:relative;color:var(--sf-ink);font-family:inherit;font-size:var(--sf-text-body);font-weight:var(--sf-weight-normal);text-align:center}.sf-player *{box-sizing:border-box}.sf-player button,.sf-player input{font:inherit}.sf-player button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.sf-player button:focus-visible,.sf-player input:focus-visible{outline:2px solid var(--sf-accent);outline-offset:var(--sf-space-1)}.sf-visual{display:block;position:relative;width:100%;aspect-ratio:1;margin:0 auto;padding:0;border:0;border-radius:var(--sf-radius-round);background:transparent;isolation:isolate;touch-action:pan-y pinch-zoom;user-select:none}.sf-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}.sf-static{display:none;position:absolute;inset:16%;border:2px solid var(--sf-accent);border-radius:47% 53% 43% 57%;background:var(--sf-selected)}.sf-player[data-renderer=static] .sf-static{display:block}.sf-player[data-renderer=static] .sf-canvas{visibility:hidden}.sf-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:var(--sf-space-16);height:var(--sf-space-16);border:0;border-radius:var(--sf-radius-round);background:var(--sf-accent);color:var(--sf-on-accent);box-shadow:var(--sf-shadow-2);transition:opacity var(--sf-motion-fast),transform var(--sf-motion-fast),background var(--sf-motion-fast)}.sf-visual:hover .sf-center{background:var(--sf-hover)}.sf-player svg{display:block;width:var(--sf-icon);height:var(--sf-icon);fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sf-player[data-playing=true] .sf-center{opacity:0;transform:translate(-50%,-50%) scale(.9)}.sf-player[data-playing=true] .sf-visual:hover .sf-center,.sf-player[data-playing=true] .sf-visual:focus-visible .sf-center{opacity:1;transform:translate(-50%,-50%) scale(1)}.sf-seek-feedback{position:absolute;top:64%;left:50%;transform:translate(-50%);padding:var(--sf-space-2) var(--sf-space-3);border-radius:var(--sf-radius-round);background:var(--sf-surface);color:var(--sf-ink);box-shadow:var(--sf-shadow-1);font:var(--sf-text-caption)/1.5 ui-monospace,Consolas,monospace;white-space:nowrap;pointer-events:none}.sf-seek-feedback[hidden]{display:none}.sf-player[data-scrubbing=true] .sf-visual{cursor:ew-resize}.sf-player[data-scrubbing=true] .sf-center{opacity:0!important}.sf-info{margin:var(--sf-space-4) auto 0;padding:0 var(--sf-space-4)}.sf-title{margin:0;font-size:var(--sf-text-title);font-weight:var(--sf-weight-strong);line-height:1.25;letter-spacing:-.02em;overflow-wrap:anywhere}.sf-artist{margin:var(--sf-space-2) 0 0;color:var(--sf-muted);font-size:var(--sf-text-body);line-height:1.5}.sf-artist:empty{display:none}.sf-transport{position:relative;width:calc(100% - var(--sf-space-12));max-width:320px;margin:var(--sf-space-6) auto 0}.sf-seek-label{display:block}.sf-player input[type=range]{--sf-progress: 0%;display:block;width:100%;height:var(--sf-target);margin:0;padding:0;border:0;background:transparent;cursor:pointer;appearance:none;-webkit-appearance:none;accent-color:var(--sf-accent)}.sf-player input[type=range]::-webkit-slider-runnable-track{height:var(--sf-space-1);border-radius:var(--sf-radius-round);background:linear-gradient(to right,var(--sf-accent) var(--sf-progress),var(--sf-track) var(--sf-progress))}.sf-player input[type=range]::-moz-range-track{height:var(--sf-space-1);border-radius:var(--sf-radius-round);background:var(--sf-track)}.sf-player input[type=range]::-moz-range-progress{height:var(--sf-space-1);background:var(--sf-accent)}.sf-player input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:var(--sf-space-3);height:var(--sf-space-3);margin-top:calc((var(--sf-space-1) - var(--sf-space-3)) / 2);border:0;border-radius:var(--sf-radius-round);background:var(--sf-accent)}.sf-player input[type=range]::-moz-range-thumb{width:var(--sf-space-3);height:var(--sf-space-3);border:0;border-radius:var(--sf-radius-round);background:var(--sf-accent)}.sf-player input:disabled{opacity:.4;cursor:default}.sf-time{display:flex;align-items:center;justify-content:space-between;height:var(--sf-target);color:var(--sf-muted);font:var(--sf-text-caption)/1.5 ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}.sf-controls{position:absolute;top:var(--sf-target);left:50%;transform:translate(-50%);display:flex;align-items:center;height:var(--sf-target)}.sf-volume-group{display:flex;align-items:center;gap:var(--sf-space-1)}.sf-mute{display:grid;place-items:center;width:var(--sf-target);height:var(--sf-target);padding:0;border:0;border-radius:var(--sf-radius-round);background:transparent;color:var(--sf-muted)!important}.sf-mute svg{width:var(--sf-icon-sm);height:var(--sf-icon-sm)}.sf-mute:hover{color:var(--sf-ink)!important;background:var(--sf-selected)}.sf-volume-label{display:block;width:var(--sf-space-24)}.sf-status{margin:var(--sf-space-4) var(--sf-space-4) 0;color:var(--sf-muted);font-size:var(--sf-text-body);line-height:1.5;overflow-wrap:anywhere}.sf-status:empty{margin:0}.sf-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sf-player audio{display:none}.sf-settings-toggle{display:grid;place-items:center;flex-shrink:0;width:var(--sf-target);height:var(--sf-target);padding:0;border:0;border-radius:var(--sf-radius-round);background:transparent;color:var(--sf-muted)!important}.sf-settings-toggle:hover{background:var(--sf-selected)}.sf-settings-toggle svg{width:var(--sf-icon-sm);height:var(--sf-icon-sm)}.sf-settings-panel{position:relative;z-index:2;margin-top:var(--sf-space-3);padding:var(--sf-space-4);border:1px solid var(--sf-line);border-radius:var(--sf-radius-md);background:var(--sf-surface);text-align:left}.sf-settings-panel[hidden]{display:none}.sf-settings-panel>label{display:grid;grid-template-columns:5em minmax(0,1fr);align-items:center;gap:var(--sf-space-3);margin-bottom:var(--sf-space-3);line-height:1.5}.sf-settings-panel label>span{color:var(--sf-muted)}.sf-settings-panel select{min-width:0;width:100%;min-height:var(--sf-target);padding:var(--sf-space-2);border:1px solid var(--sf-line);border-radius:var(--sf-radius-sm);font:inherit;color:var(--sf-ink);background:var(--sf-bg)}.sf-settings-panel select:focus-visible,.sf-feature-details summary:focus-visible{outline:2px solid var(--sf-accent);outline-offset:2px}.sf-settings-panel .sf-intensity-row{grid-template-columns:1fr;gap:0;margin-bottom:0}.sf-intensity-row>span{display:flex;justify-content:space-between}.sf-quality-note{margin:var(--sf-space-2) 0;color:var(--sf-muted);font-size:var(--sf-text-caption);line-height:1.5}.sf-quality-note:empty{display:none}.sf-feature-details{margin-top:var(--sf-space-2);border-top:1px solid var(--sf-line)}.sf-feature-details summary{min-height:var(--sf-target);display:flex;align-items:center;cursor:pointer;color:var(--sf-muted)}.sf-feature-details summary:before{content:"+";margin-right:var(--sf-space-2)}.sf-feature-details[open] summary:before{content:"\2212"}.sf-feature-details p{margin:var(--sf-space-2) 0;line-height:1.6;color:var(--sf-muted)}.sf-feature-details dl{margin:var(--sf-space-3) 0 0;font-variant-numeric:tabular-nums}.sf-feature-details dl>div{display:flex;justify-content:space-between;gap:var(--sf-space-2);padding-block:var(--sf-space-1)}.sf-feature-details dt{color:var(--sf-muted)}.sf-feature-details dd{margin:0;text-align:right}.sf-ambient-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.sf-player[data-ambient=true] .sf-center{opacity:1;transform:translate(-50%,-50%)}.sf-player[data-ambient=true] .sf-static{display:none}@media(prefers-reduced-motion:reduce){.sf-player *{transition:none!important}}.sf-dock{--sf-dock-size: 128px;position:relative;width:var(--sf-dock-size);color:var(--sf-ink);font-family:inherit;font-size:var(--sf-text-body);z-index:var(--sf-z-popover);text-align:center}.sf-dock[data-position=fixed]{position:fixed;right:var(--sf-space-6);bottom:max(var(--sf-space-6),env(safe-area-inset-bottom))}.sf-dock *{box-sizing:border-box}.sf-dock button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.sf-dock button:focus-visible{outline:2px solid var(--sf-accent);outline-offset:var(--sf-space-1)}.sf-dock svg{display:block;width:var(--sf-icon-sm);height:var(--sf-icon-sm);fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sf-dock-header{display:none}.sf-dock-panel{border-radius:var(--sf-radius-lg)}.sf-dock .sf-visual{width:var(--sf-dock-size);height:var(--sf-dock-size);aspect-ratio:1;margin:0 auto}.sf-dock[data-expanded=false] .sf-info,.sf-dock[data-expanded=false] .sf-transport{display:none}.sf-dock[data-expanded=false] .sf-center{width:var(--sf-target);height:var(--sf-target)}.sf-dock[data-expanded=false] .sf-center svg{width:var(--sf-icon-sm);height:var(--sf-icon-sm)}.sf-dock[data-expanded=false] .sf-status:empty{display:none}.sf-dock[data-expanded=false] .sf-status:not(:empty){position:absolute;right:0;bottom:calc(var(--sf-dock-size) + var(--sf-space-6));width:min(256px,calc(100vw - var(--sf-space-8)));margin:0;padding:var(--sf-space-3) var(--sf-space-4);border-radius:var(--sf-radius-md);background:var(--sf-surface);box-shadow:var(--sf-shadow-3);color:var(--sf-ink);text-align:left}.sf-dock-expand{position:absolute;top:0;right:0;display:grid;place-items:center;width:var(--sf-target);height:var(--sf-target);padding:0;border:0;border-radius:var(--sf-radius-round);background:var(--sf-surface);color:var(--sf-muted)!important;box-shadow:var(--sf-shadow-1);transition:background var(--sf-motion-fast)}.sf-dock-expand:hover{background:var(--sf-selected);color:var(--sf-ink)!important}.sf-dock-caption{display:block;max-width:var(--sf-dock-size);margin-top:var(--sf-space-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-muted);font-size:var(--sf-text-caption);line-height:1.5;pointer-events:none}.sf-dock .sf-seek-feedback{top:68%;padding:var(--sf-space-1) var(--sf-space-2)}.sf-dock .sf-settings-toggle{display:none}.sf-dock .sf-settings-panel{padding:var(--sf-space-3);margin-top:var(--sf-space-4)}.sf-dock .sf-settings-panel>label{grid-template-columns:4em minmax(0,1fr);gap:var(--sf-space-2)}.sf-dock .sf-settings-panel .sf-intensity-row{grid-template-columns:1fr}.sf-dock[data-ambient=true][data-expanded=false]{--sf-dock-size:56px;width:104px;height:56px}.sf-dock[data-ambient=true][data-expanded=false] .sf-visual{margin-left:0}.sf-dock[data-ambient=true][data-expanded=false] .sf-center{width:56px;height:56px}.sf-dock[data-ambient=true][data-expanded=false] .sf-dock-caption{display:none}.sf-dock[data-ambient=true][data-expanded=false] .sf-dock-expand{top:6px}.sf-dock[data-ambient=true][data-expanded=true] .sf-visual{width:64px;height:64px;margin-block:var(--sf-space-4)}.sf-dock[data-expanded=true]{width:min(320px,calc(100vw - var(--sf-space-8)))}.sf-dock[data-expanded=true] .sf-dock-panel{max-height:calc(100dvh - var(--sf-space-12));overflow:auto;overscroll-behavior:contain;padding:var(--sf-space-4) var(--sf-space-6) var(--sf-space-6);background:var(--sf-surface);box-shadow:var(--sf-shadow-4)}.sf-dock[data-theme=dark] .sf-dock-panel{box-shadow:none}.sf-dock[data-expanded=true] .sf-dock-header{display:flex;align-items:center;justify-content:space-between;color:var(--sf-muted);font-size:var(--sf-text-body)}.sf-dock-header>span{font-weight:var(--sf-weight-strong)}.sf-dock-header>div{display:flex;align-items:center;gap:var(--sf-space-1)}.sf-dock-header button{display:grid;place-items:center;width:var(--sf-target);height:var(--sf-target);padding:0;border:0;border-radius:var(--sf-radius-round);background:transparent;color:var(--sf-muted)}.sf-dock-header button:hover{background:var(--sf-selected);color:var(--sf-ink)}.sf-dock[data-expanded=true] .sf-visual{width:192px;height:192px}.sf-dock[data-expanded=true] .sf-center{width:var(--sf-space-12);height:var(--sf-space-12)}.sf-dock[data-expanded=true] .sf-center svg{width:var(--sf-icon-sm);height:var(--sf-icon-sm)}.sf-dock[data-expanded=true] .sf-title{font-size:var(--sf-text-brand)}.sf-dock[data-expanded=true] .sf-artist{font-size:var(--sf-text-body)}.sf-dock[data-expanded=true] .sf-info{margin-top:var(--sf-space-2);padding:0}.sf-dock[data-expanded=true] .sf-transport{width:100%;margin-top:var(--sf-space-4)}.sf-dock[data-expanded=true] .sf-status{margin:var(--sf-space-3) 0 0}.sf-dock[data-expanded=true] .sf-status:empty{margin:0}.sf-dock[data-expanded=true] .sf-dock-expand,.sf-dock[data-expanded=true] .sf-dock-caption{display:none}@media(max-width:600px){.sf-dock[data-position=fixed]{right:var(--sf-space-4);bottom:max(var(--sf-space-4),env(safe-area-inset-bottom))}.sf-dock[data-position=fixed][data-expanded=true]{left:0;right:0;bottom:0;width:100%}.sf-dock[data-position=fixed][data-expanded=true] .sf-dock-panel{max-height:80dvh;border-radius:var(--sf-radius-lg) var(--sf-radius-lg) 0 0;padding-bottom:max(var(--sf-space-6),env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){.sf-dock *{transition:none!important}}.soundform-mount{position:static}.soundform-mount .sf-dock{--sf-dock-size:104px;z-index:40}.soundform-mount .sf-dock-caption,.sf-file-actions{display:none}.sf-dock[data-expanded=true] .sf-file-actions{display:flex;justify-content:center;margin-top:16px}.sf-open-file{min-height:44px;padding:10px 20px;border:1px solid var(--sf-line);border-radius:12px;background:var(--sf-selected);color:var(--sf-ink);font:inherit;cursor:pointer}.sf-dock[data-empty=true] .sf-transport,.sf-dock[data-empty=true] .sf-dock-shape{display:none}.sf-dock[data-expanded=false][data-empty=true] .sf-center{opacity:0}.sf-dock[data-expanded=true] .sf-artist{font-size:14px}@media(hover:hover)and (pointer:fine){.soundform-mount .sf-dock-expand{opacity:0;pointer-events:none;transition:opacity .15s ease}.soundform-mount .sf-dock:hover .sf-dock-expand,.soundform-mount .sf-dock:focus-within .sf-dock-expand{opacity:1;pointer-events:auto}}
