


:root { color-scheme: light; --by-day: initial; --by-night: ; }
@media (prefers-color-scheme: dark) { :root[data-theme="system"] { color-scheme: dark; --by-day: ; --by-night: initial; } }
:root[data-theme="dark"] { color-scheme: dark; --by-day: ; --by-night: initial; }

:root {
  --space-1: 0.25rem;
  --space-2: calc(2 * var(--space-1));
  --space-3: calc(3 * var(--space-1));
  --space-4: calc(4 * var(--space-1));
  --space-6: calc(6 * var(--space-1));
  --space-8: calc(8 * var(--space-1));
  --space-12: calc(12 * var(--space-1));
  --space-16: calc(16 * var(--space-1));
  --header-pad-top: var(--space-4);
  --paper-day: #d9d8d3; --paper-night: #161719;
  --paper: var(--by-day, var(--paper-day)) var(--by-night, var(--paper-night));
  --grain-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.003 0.7' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0.16 -0.07'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  --paper-grain: var(--by-day, var(--grain-dark)) var(--by-night, none);
  --paper-surface: var(--paper-grain), var(--paper);
  --paper-raised: var(--by-day, #e7e6e2) var(--by-night, #202124);
  --paper-sunk: var(--by-day, #c5c3bc) var(--by-night, #0e0f10);
  --floor: var(--paper-sunk);
  --floor-surface: var(--floor);
  --chamfer: 2px;
  --chamfer-lit: var(--by-day, #f2f1ed) var(--by-night, #2e2f33);
  --chamfer-shade: var(--by-day, #a9a7a0) var(--by-night, #070708);
  --plate-edge: var(--by-day, #6c6b66) var(--by-night, #000000);
  --plate-cast: var(--by-day, rgba(48, 26, 8, 0.5)) var(--by-night, rgba(0, 0, 0, 0.6)); --plate-cast-blur: 20px;
  
  --unit-cast-shade: var(--by-day, rgba(18, 17, 16, 0.32)) var(--by-night, rgba(0, 0, 0, 0.7));
  
  --engrave-lip: var(--by-day, rgba(255, 255, 255, 0.7)) var(--by-night, rgba(255, 255, 255, 0.07));
  --engrave-shade: var(--by-day, rgba(0, 0, 0, 0.28)) var(--by-night, rgba(0, 0, 0, 0.9));
  --engraved-cut: 0 1px 0 rgba(255, 255, 255, 0.7), 0 -1px 0 rgba(0, 0, 0, 0.22);
  --engraved-inlay: 0 -1px 0 rgba(0, 0, 0, 0.75), 0 1px 1.5px rgba(0, 0, 0, 0.8);
  --engraved: var(--by-day, var(--engraved-cut)) var(--by-night, var(--engraved-inlay));
  --legend-ink: var(--ink);
  --legend-ink-mute: var(--ink-mute);
  --legend-ink-soft: color-mix(in srgb, var(--legend-ink) var(--soft-share), transparent);
  --crimson: #ce2137;
  --crimson-bright: #f88192;
  --lit: var(--crimson-bright);
  --lit-hot: color-mix(in srgb, var(--crimson-bright) 16%, #ffffff);
  --lit-halo: color-mix(in srgb, var(--lit) 36%, transparent);
  --unlit: color-mix(in srgb, var(--lit) 9%, transparent);
  --unlit-legend: color-mix(in srgb, var(--lit) 40%, transparent);
  
  --lit-mark: var(--by-day, var(--accent)) var(--by-night, var(--lit));
  --ink-day: #18191b; --ink-night: #e6e3dc;
  --ink: var(--by-day, var(--ink-day)) var(--by-night, var(--ink-night));
  --soft-share: 72%;
  --ink-soft: color-mix(in srgb, var(--ink) var(--soft-share), transparent);
  --ink-mute-day: #48494d; --ink-mute-night: #9c9a94;
  --ink-mute: var(--by-day, var(--ink-mute-day)) var(--by-night, var(--ink-mute-night));
  --rule: var(--by-day, #8f8e89) var(--by-night, rgba(230, 227, 220, 0.22));
  --tick: var(--by-day, #c2c1bb) var(--by-night, rgba(230, 227, 220, 0.1));
  --interface: var(--crimson);
  --interface-accent: var(--by-day, var(--interface)) var(--by-night, var(--crimson-bright));
  --interface-ink: var(--by-day, color-mix(in srgb, var(--interface) 76%, #000000)) var(--by-night, var(--crimson-bright));
  --interface-stage: var(--crimson-bright);
  --illustration: var(--crimson);
  --illustration-accent: var(--interface-accent);
  --illustration-ink: var(--interface-ink);
  --illustration-stage: var(--interface-stage);
  --accent: var(--interface-accent);
  --accent-fill: var(--accent);
  --accent-ink: var(--interface-ink);
  --wash-share: 14%;
  --accent-wash: color-mix(in srgb, var(--accent) var(--wash-share), transparent);
  --on-accent: var(--by-day, #ffffff) var(--by-night, var(--paper));
  --poche: color-mix(in srgb, var(--ink) 88%, var(--paper));
  --zone-blend: var(--by-day, multiply) var(--by-night, normal);
  --zone-opacity: 0.8;
  --listening-zone-opacity: 0.16;
  --marker-size: 11px;
  --shadow-bar: var(--by-day, var(--ink)) var(--by-night, color-mix(in srgb, var(--ink-mute) 55%, transparent));
  --hard-bar: 0 var(--bar) 0 var(--shadow-bar);
  --label-bg: var(--by-day, var(--ink)) var(--by-night, #dcd8cf);
  --label-ink: var(--paper);
  --art-mat: #f8f8f6;
  --screen: #000000;

  --flow-sink: var(--by-day, var(--ink-mute)) var(--by-night, #b1afa8);
  --flow-bass: var(--by-day, var(--ink-mute)) var(--by-night, #85847f);
  --pressure-high: var(--illustration-accent);
  --pressure-low-day: #2b5f9e; --pressure-low-night: #86b3e6;
  --pressure-low: var(--by-day, var(--pressure-low-day)) var(--by-night, var(--pressure-low-night));
  --wave-blend: var(--by-day, multiply) var(--by-night, screen);
  --band-bass: color-mix(in srgb, var(--interface-accent) 55%, var(--paper));
  --band-mids: var(--interface-accent);
  --band-highs: var(--ink);
  
  --sound-bass: var(--illustration-accent);
  --sound-mids: var(--by-day, #2e8b45) var(--by-night, #6fcf85);
  --sound-highs: var(--pressure-low);

  
  --lora: var(--by-day, #324941) var(--by-night, #4a6a5f);
  --lora-light: var(--by-day, #506961) var(--by-night, #6f8f84);
  --lora-dark: var(--by-day, #1d322b) var(--by-night, #33504a);
  --wood-0: #c99c6c; --wood-1: #b8875a; --wood-2: #a8764b; --wood-3: #d4aa7c; --wood-4: #9d6c44; --wood-5: #be9163;
  --wood-grain: rgba(92, 58, 32, 0.38);
  --wood-shadow: #3a291c;

  --ok: var(--by-day, #285c36) var(--by-night, #8fd19e);
  --warn: var(--by-day, #6f4700) var(--by-night, #f2c14e);
  --error: var(--by-day, #8a2470) var(--by-night, #e79bce);
  --focus: var(--interface-accent);

  --stage: var(--by-day, #222326) var(--by-night, #27282c);
  --stage-ink: var(--by-day, var(--paper-raised)) var(--by-night, var(--ink));
  --stage-soft: color-mix(in srgb, var(--stage-ink) 68%, var(--stage));
  --stage-accent: var(--interface-stage);
  --stage-rule: color-mix(in srgb, var(--stage-ink) 22%, transparent);
  --stage-tick: color-mix(in srgb, var(--stage-ink) 10%, transparent);
  --stage-wash: color-mix(in srgb, var(--stage-accent) 22%, transparent);
  --stage-focus: var(--lit);
  --stage-recess: color-mix(in srgb, var(--stage) 55%, var(--screen)); --window-depth: 0.75rem;
  
  --grain-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.003 0.7' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.12 -0.05'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  --anodised: #17181a;
  --unit-finish: var(--by-day, var(--paper-surface)) var(--by-night, var(--grain-light), var(--anodised));
  --bezel: linear-gradient(#fbfbfa, #a7a6a0 40%, #e9e8e4 62%, #8f8e88);

  --glow: var(--by-day, 0px) var(--by-night, 6px); --glow-wide: var(--by-day, 0px) var(--by-night, 14px);
  --bevel-hi: color-mix(in srgb, var(--paper-raised) 85%, transparent); --bevel-lo: color-mix(in srgb, var(--ink) 16%, transparent);
  --plate-radius: 3px;
  --well: inset 0 2px 0 var(--bevel-lo);
  --key-ring: 2px;
  --key-h: 3rem; --key-legend-leading: 1.2; --key-pad-inline: 1.25rem; --key-pad-inline-quiet: 1rem; --key-radius: 5px; --key-cap-gap: 3px; --key-sink: 2px;
  --key-lamp: 0.875rem; --key-lamp-gap: 0.5rem; --key-glyph: 0.625rem;
  --key-frame-lit: var(--by-day, #ffffff) var(--by-night, color-mix(in srgb, var(--lit) 34%, #2a2b2f));
  --key-frame-shade: var(--by-day, #8c8b85) var(--by-night, #000000);
  --key-recess: var(--by-day, linear-gradient(#6b6a64, #a5a49e)) var(--by-night, linear-gradient(#000000, #141416));
  --key-recess-shade: inset 0 2px 2px rgba(0, 0, 0, 0.5), inset 2px 0 2px rgba(0, 0, 0, 0.3); --key-recess-shade-pressed: inset 0 3px 3px rgba(0, 0, 0, 0.65), inset 2px 0 2px rgba(0, 0, 0, 0.35);
  --key-cap: var(--by-day, linear-gradient(#cfcec8, #e9e8e3 16%, #f6f5f1 34%, #e8e7e2 58%, #d6d5cf 84%, #bdbcb6)) var(--by-night, linear-gradient(#141518, #2a2b2f 20%, #393a3f 33%, #26272b 58%, #1a1b1e 84%, #0e0f11));
  --key-cap-accent: color-mix(in oklch, var(--interface) 92%, #000000);
  --key-cap-filled: linear-gradient(color-mix(in srgb, var(--key-cap-accent) 75%, #000000), var(--key-cap-accent) 18%, color-mix(in srgb, var(--key-cap-accent) 89%, #ffffff) 32%, var(--key-cap-accent) 58%, color-mix(in srgb, var(--key-cap-accent) 80%, #000000));
  --key-grain: var(--by-day, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0.22 -0.05'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23b)'/%3E%3C/svg%3E")) var(--by-night, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.07 -0.02'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23b)'/%3E%3C/svg%3E"));
  --key-cap-shade: inset 0 1px 0 var(--by-day, rgba(255, 255, 255, 0.95)) var(--by-night, rgba(255, 255, 255, 0.14)), inset 0 -2px 0 rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.5);
  --key-cap-shade-pressed: inset 0 2px 1px rgba(0, 0, 0, 0.22), inset 0 -1px 0 var(--by-day, rgba(255, 255, 255, 0.6)) var(--by-night, rgba(255, 255, 255, 0.06));
  --key-legend-primary: var(--accent-ink);
  --key-legend-quiet: var(--legend-ink);
  --key-legend-cut: var(--by-day, 0 1px 0 rgba(255, 255, 255, 0.85), 0 -1px 0 rgba(0, 0, 0, 0.12)) var(--by-night, var(--engraved-inlay));
  --key-legend-filled: #ffffff;
  --key-legend-cut-filled: 0 -1px 0 rgba(0, 0, 0, 0.3);
  --led-off: var(--by-day, color-mix(in oklab, var(--lit) 14%, #5b5751)) var(--by-night, color-mix(in oklab, var(--lit) 12%, #1e1c1b));
  --led-halo-on-filled: color-mix(in srgb, var(--lit-hot) 50%, transparent);
  --lamp-fade: 0.12s; --lamp-size: 6px; --lamp-inset: 5px; --lamp-rim: var(--ink-mute);
  --fader-focus: 0 0 0 2px var(--accent), 0 0 var(--glow-wide) color-mix(in srgb, var(--accent) 60%, transparent);

  --fascia-lit: var(--by-day, rgba(255, 255, 255, 0.8)) var(--by-night, rgba(255, 255, 255, 0.12));
  --foot-hi: var(--by-day, #e6e5e0) var(--by-night, #3b3732); --foot-mid: var(--by-day, #b6b5af) var(--by-night, #222125); --foot-lo: var(--by-day, #807f7a) var(--by-night, #0e0f11);
  --foot-rim: var(--by-day, #fbfbf9) var(--by-night, color-mix(in srgb, var(--ink-night) 55%, transparent)); --foot-seat: var(--by-day, rgba(40, 38, 34, 0.45)) var(--by-night, #000000);
  --meter-lit: var(--paper-raised);
  --meter-dim: var(--paper);
  --meter-glass: linear-gradient(var(--meter-lit), var(--meter-dim) 42%, var(--meter-dim) 58%, var(--meter-lit));
  --meter-ends: linear-gradient(to right, var(--meter-end-shade), transparent 14%, transparent 86%, var(--meter-end-shade));
  --meter-end-shade: color-mix(in srgb, var(--ink) 10%, transparent);
  --meter-lip: linear-gradient(var(--paper-raised), var(--paper));
  --meter-seam: var(--rule);
  --meter-glass-edge: var(--rule);
  --meter-frame: var(--by-day, 0 0 0 1px #f7f6f2, 0 -1px 0 1px rgba(60, 58, 50, 0.35)) var(--by-night, 0 0 0 1px #0a0908, 0 0 0 2px color-mix(in srgb, var(--ink) 20%, transparent));
  --meter-ink: var(--ink);
  --meter-needle: var(--accent);
  --meter-needle-glow: transparent;
  --meter-dome-lit: var(--paper-raised);
  --meter-dome-dim: var(--paper-sunk);
  --meter-rim: var(--rule);
  --meter-halo: transparent;
  --meter-sensor: var(--paper-raised);
  
  --meter-window-max: 52rem; --meter-gap: 1rem;

  --display-glass: linear-gradient(rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.015) 34%, transparent 36%), color-mix(in oklab, var(--lit) 3%, #070606);
  --display-figure: 1.375rem; --display-pad: 7px 10px 6px 12px; --display-gap: 9px; --display-legend-gap: 5px; --display-led: 4px;
  --display-depth: inset 0 1px 0 #000000, inset 0 2px 0 rgba(0, 0, 0, 0.45), inset 0 -1px 0 rgba(255, 255, 255, 0.06);
  --display-bezel: var(--by-day, var(--display-depth), 0 0 0 1px #5d5c57, 0 0 0 2px #f6f5f1, 0 0 0 var(--display-bezel-w) #b4b3ad, 0 1px 0 var(--display-bezel-w) #ffffff, 0 -1px 0 var(--display-bezel-w) #9f9e98)
    var(--by-night, var(--display-depth), 0 0 0 1px #000000, 0 0 0 2px #2c2d31, 0 0 0 var(--display-bezel-w) #08080a, 0 1px 0 var(--display-bezel-w) rgba(255, 255, 255, 0.16), 0 0 0 5px color-mix(in srgb, var(--lit) 6%, transparent), 0 0 0 8px color-mix(in srgb, var(--lit) 2.5%, transparent));
  --display-bezel-w: 3px;

  --font-fallback: 'Geist Mono', 'Helvetica Neue', Arial, system-ui, sans-serif;
  --font-display: 'Quantico', var(--font-fallback);
  --font-body: 'Atkinson Hyperlegible Next', var(--font-fallback);
  --font-ui: var(--font-display);
  --font-data: var(--font-display);

  --step--2: 0.75rem;
  --step--1: 0.875rem;
  --step-0: 1rem;
  --body-size: 1.0625rem;
  --body-weight: 400;
  --type-growth: clamp(0rem, 2vw - 0.5rem, 1rem);
  --step-1: calc(1.125rem + var(--type-growth) / 8);
  --step-lead: calc(var(--step-0) + var(--type-growth) / 4);
  --step-2: calc(1.25rem + var(--type-growth) / 4);
  --step-3: calc(1.5rem + var(--type-growth) / 2);
  --step-4: calc(2rem + var(--type-growth));
  --title-size: calc(2.375rem + var(--type-growth) * 1.5);
  --title-weight: 700;
  --title-case: none;
  --heading-weight: var(--title-weight);
  --leading-title: 1.02;
  --leading-heading: 1.1;
  --leading-body: 1.4;
  --leading-prose: 1.55;
  --tracking-display: -0.01em;
  --tracking-body: 0;
  --logo-size-fit: calc(clamp(1.35rem, 1.35rem + (100vw - 24.4rem) * 0.14, 3.4rem) + clamp(0rem, (100vw - 48rem) * 0.08, 0.64rem));
  --logo-size: var(--logo-size-fit);
  --label-size: var(--step--2);
  --label-weight: 700;
  --label-case: uppercase;
  --label-tracking: 0.08em;
  --font-label: var(--label-weight) var(--label-size) / 1 var(--font-ui);

  --radius: 0;
  --border-w: max(1.5px, 0.15rem);
  --underline-hover: 2px;
  --bar: 8px;
  --tap-min: 44px;

  --button-arrow: url(/assets/icons/arrow.svg);
  --button-arrow-out: url(/assets/icons/arrow-out.svg);
  --ink-edge: url(/assets/icons/ink-edge.svg);
  --ink-edge-depth: 0.14;
  --sweep-time: 0.5s;
  --beam-lit: #ffffff; --beam-width: 9%; --beam-angle: 100deg; --beam-time: 0.7s; --beam-start: -20%; --beam-end: 120%; --beam-held: 50%;
  --hover-fade: 0.4s;
  --answer-fade: 0.3s;
  --zoom-fade: 0.5s;
  --crossfade-shift: 3px; --crossfade-grow: 1.04; --crossfade-shrink: 0.96;
  --wipe-time: 0.6s;

  --spinner-turn: 0.6s;
  --dots-pulse: 1.2s; --dots-stagger: 0.2s;
  --chip-slide: 0.3s;
  --tick-draw: 0.25s;
  --toast-rise: 0.35s;

  --ease-open: cubic-bezier(0.5, 1, 0.89, 1);
  --ease-rise: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-settle: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-fly: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-roll: cubic-bezier(0.625, 0.05, 0, 1);
  --ease-sweep: cubic-bezier(0.23, 1, 0.32, 1);
  --rise-block: 26.67px;
}

@property --wall-m { syntax: '<length>'; inherits: true; initial-value: 0px; }
:root { --wall-m: min(178.2px, (100vw - 2 * (var(--frame-inset) + 1px)) / 3.9697); --wall-depth: calc(0.17 * var(--wall-m)); --wall-unit: calc(1.2 * var(--wall-m)); --wall-spaced: calc(1.92 * var(--wall-m)); --wall-cap: calc(0.71 * var(--wall-m)); --answer-fade-curve: linear(0.000, 0.351, 0.578, 0.726, 0.822, 0.885, 0.925, 0.951, 0.968, 0.979, 0.987, 0.991, 0.994, 0.996, 0.998, 0.998, 1.000); --sound-m-per-s: 343; --sound-slowdown: 16; --sound-speed-label: "1/16 speed"; --sound-speed-words: "Shown 16 times slower than real speed"; --sound-slowed: "Slowed 16 times"; --sound-room-second: "62.5 ms"; }
:root[data-sound="1"] { --sound-slowdown: 1; --sound-speed-label: "1/1 speed"; --sound-speed-words: "Shown at real speed"; --sound-slowed: "At real speed"; --sound-room-second: "1,000 ms"; }
:root[data-sound="1.25"] { --sound-slowdown: 1.25; --sound-speed-label: "1/1.25 speed"; --sound-speed-words: "Shown at real speed"; --sound-slowed: "At real speed"; --sound-room-second: "800 ms"; }
:root[data-sound="1.5"] { --sound-slowdown: 1.5; --sound-speed-label: "1/1.5 speed"; --sound-speed-words: "Shown 1.5 times slower than real speed"; --sound-slowed: "Slowed 1.5 times"; --sound-room-second: "667 ms"; }
:root[data-sound="2"] { --sound-slowdown: 2; --sound-speed-label: "1/2 speed"; --sound-speed-words: "Shown 2 times slower than real speed"; --sound-slowed: "Slowed 2 times"; --sound-room-second: "500 ms"; }
:root[data-sound="2.5"] { --sound-slowdown: 2.5; --sound-speed-label: "1/2.5 speed"; --sound-speed-words: "Shown 2.5 times slower than real speed"; --sound-slowed: "Slowed 2.5 times"; --sound-room-second: "400 ms"; }
:root[data-sound="3"] { --sound-slowdown: 3; --sound-speed-label: "1/3 speed"; --sound-speed-words: "Shown 3 times slower than real speed"; --sound-slowed: "Slowed 3 times"; --sound-room-second: "333 ms"; }
:root[data-sound="4"] { --sound-slowdown: 4; --sound-speed-label: "1/4 speed"; --sound-speed-words: "Shown 4 times slower than real speed"; --sound-slowed: "Slowed 4 times"; --sound-room-second: "250 ms"; }
:root[data-sound="5"] { --sound-slowdown: 5; --sound-speed-label: "1/5 speed"; --sound-speed-words: "Shown 5 times slower than real speed"; --sound-slowed: "Slowed 5 times"; --sound-room-second: "200 ms"; }
:root[data-sound="6"] { --sound-slowdown: 6; --sound-speed-label: "1/6 speed"; --sound-speed-words: "Shown 6 times slower than real speed"; --sound-slowed: "Slowed 6 times"; --sound-room-second: "167 ms"; }
:root[data-sound="8"] { --sound-slowdown: 8; --sound-speed-label: "1/8 speed"; --sound-speed-words: "Shown 8 times slower than real speed"; --sound-slowed: "Slowed 8 times"; --sound-room-second: "125 ms"; }
:root[data-sound="10"] { --sound-slowdown: 10; --sound-speed-label: "1/10 speed"; --sound-speed-words: "Shown 10 times slower than real speed"; --sound-slowed: "Slowed 10 times"; --sound-room-second: "100 ms"; }
:root[data-sound="12"] { --sound-slowdown: 12; --sound-speed-label: "1/12 speed"; --sound-speed-words: "Shown 12 times slower than real speed"; --sound-slowed: "Slowed 12 times"; --sound-room-second: "83.3 ms"; }
:root[data-sound="20"] { --sound-slowdown: 20; --sound-speed-label: "1/20 speed"; --sound-speed-words: "Shown 20 times slower than real speed"; --sound-slowed: "Slowed 20 times"; --sound-room-second: "50 ms"; }
:root[data-sound="24"] { --sound-slowdown: 24; --sound-speed-label: "1/24 speed"; --sound-speed-words: "Shown 24 times slower than real speed"; --sound-slowed: "Slowed 24 times"; --sound-room-second: "41.7 ms"; }
:root[data-sound="32"] { --sound-slowdown: 32; --sound-speed-label: "1/32 speed"; --sound-speed-words: "Shown 32 times slower than real speed"; --sound-slowed: "Slowed 32 times"; --sound-room-second: "31.3 ms"; }
:root[data-sound="40"] { --sound-slowdown: 40; --sound-speed-label: "1/40 speed"; --sound-speed-words: "Shown 40 times slower than real speed"; --sound-slowed: "Slowed 40 times"; --sound-room-second: "25 ms"; }
:root[data-sound="48"] { --sound-slowdown: 48; --sound-speed-label: "1/48 speed"; --sound-speed-words: "Shown 48 times slower than real speed"; --sound-slowed: "Slowed 48 times"; --sound-room-second: "20.8 ms"; }
:root[data-sound="64"] { --sound-slowdown: 64; --sound-speed-label: "1/64 speed"; --sound-speed-words: "Shown 64 times slower than real speed"; --sound-slowed: "Slowed 64 times"; --sound-room-second: "15.6 ms"; }
:root[data-sound="80"] { --sound-slowdown: 80; --sound-speed-label: "1/80 speed"; --sound-speed-words: "Shown 80 times slower than real speed"; --sound-slowed: "Slowed 80 times"; --sound-room-second: "12.5 ms"; }
:root[data-sound="96"] { --sound-slowdown: 96; --sound-speed-label: "1/96 speed"; --sound-speed-words: "Shown 96 times slower than real speed"; --sound-slowed: "Slowed 96 times"; --sound-room-second: "10.4 ms"; }
:root[data-sound="128"] { --sound-slowdown: 128; --sound-speed-label: "1/128 speed"; --sound-speed-words: "Shown 128 times slower than real speed"; --sound-slowed: "Slowed 128 times"; --sound-room-second: "7.81 ms"; }
:root[data-sound="160"] { --sound-slowdown: 160; --sound-speed-label: "1/160 speed"; --sound-speed-words: "Shown 160 times slower than real speed"; --sound-slowed: "Slowed 160 times"; --sound-room-second: "6.25 ms"; }
:root[data-sound="192"] { --sound-slowdown: 192; --sound-speed-label: "1/192 speed"; --sound-speed-words: "Shown 192 times slower than real speed"; --sound-slowed: "Slowed 192 times"; --sound-room-second: "5.21 ms"; }
:root[data-sound="256"] { --sound-slowdown: 256; --sound-speed-label: "1/256 speed"; --sound-speed-words: "Shown 256 times slower than real speed"; --sound-slowed: "Slowed 256 times"; --sound-room-second: "3.91 ms"; }
