/* © 2025-2025 Álvaro Arango Ortiz. All rights reserved. */
:root{--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem}:root{--z-index-base: 10;--z-index-content: 100;--z-index-ghost: 500;--z-index-playhead: 999;--z-index-modal: 1000;--z-index-notification: 1100;--z-index-alert: 1200;--z-index-dialog: 1000;--z-index-popover: 1100}@font-face{font-display:block;font-family:Sora;font-weight:100 800;src:url(/public/fonts/sora/variable.ttf) format(truetype) tech(variations)}:root{--font-family-base: Sora, system-ui;--font-size-base: 1rem;--line-height-base: 1.6;--font-weight-light: 350;--font-weight-regular: 450;--font-weight-medium: 550;--font-weight-semibold: 650;--font-weight-bold: 750}:where(html){overscroll-behavior-block:none}:where(body){margin:0;min-block-size:100dvb}:root{--note-block-size: 1.5rem;--beat-length: 3rem;--beats-per-measure: 4;--beat-step: calc(var(--beat-length) + 1px);--glow-shadow: rgb(255 255 255 / .6) 0 0 .5rem .125rem}noscript{align-items:center;block-size:100dvb;cursor:progress;display:flex;flex-direction:column;font-family:var(--font-family-base);row-gap:var(--note-block-size);justify-content:center;>.spinner{block-size:8rem;border:1px solid transparent;border-block-start-color:#f7df1e;box-sizing:border-box;inline-size:8rem;border-radius:calc(infinity * 1px);animation:1s linear infinite spin}>p{margin-block:0}}@keyframes spin{to{transform:rotate(1turn)}}:root{--color-surface-l: 20%;--color-surface-c: 3.75%;--color-surface-h: 230;--color-text-l: 92%;--color-text-c: 2.5%;--color-text-h: var(--color-surface-h);--color-accent-l: 70%;--color-accent-c: 40%;--color-accent-h: 250;--color-surface-bg: oklch(var(--color-surface-l) var(--color-surface-c) var(--color-surface-h));--color-text-primary: oklch(var(--color-text-l) var(--color-text-c) var(--color-text-h));--color-text-secondary: oklch(calc(var(--color-text-l) - 25%) var(--color-text-c) var(--color-text-h));--color-accent: oklch(var(--color-accent-l) var(--color-accent-c) var(--color-accent-h));--color-border-subtle: oklch(calc(var(--color-surface-l) + 10%) var(--color-surface-c) var(--color-surface-h) / 15%);--color-disabled-fg: oklch(calc(var(--color-text-l) - 40%) var(--color-text-c) var(--color-text-h));--color-disabled-bg: oklch(calc(var(--color-surface-l) + 5%) var(--color-surface-c) var(--color-surface-h));--surface-gradient-start: oklch(calc(var(--color-surface-l) + 2%) var(--color-surface-c) var(--color-surface-h));--surface-gradient-end: oklch(calc(var(--color-surface-l) - 2%) var(--color-surface-c) var(--color-surface-h));--surface-bg-pressed: oklch(calc(var(--color-surface-l) - 4%) var(--color-surface-c) var(--color-surface-h));--shadow-color-soft: oklch(none none none / 40%);--shadow-highlight-dark: -2px -2px 5px oklch(100% none none / 5%);--shadow-color-pressed: oklch(none none none / 60%);--shadow-color-deep: oklch(none none none / 50%);--shadow-icon: 1px 1px 2px oklch(none none none / 30%);--shadow-soft: var(--shadow-highlight-dark), 5px 5px 10px var(--shadow-color-soft);--shadow-inset-soft: inset 2px 2px 5px var(--shadow-color-pressed);--shadow-deep: 8px 8px 20px var(--shadow-color-deep);--border-radius-base: .875rem;--border-radius-large: 1.125rem;--transition-duration: .2s;--transition-timing: ease-out;--transition-base: all var(--transition-duration) var(--transition-timing)}@media (prefers-color-scheme: light){:root{--color-surface-l: 90%;--color-surface-c: 5%;--color-text-l: 30%;--color-text-c: 7.5%;--color-accent-l: 65%;--color-accent-c: 45%;--color-text-secondary: oklch(calc(var(--color-text-l) + 25%) var(--color-text-c) var(--color-text-h));--color-border-subtle: oklch(calc(var(--color-surface-l) - 5%) var(--color-surface-c) var(--color-surface-h) / 30%);--color-disabled-fg: oklch(calc(var(--color-text-l) + 40%) var(--color-text-c) var(--color-text-h));--color-disabled-bg: oklch(calc(var(--color-surface-l) - 5%) var(--color-surface-c) var(--color-surface-h));--surface-bg-pressed: oklch(calc(var(--color-surface-l) - 6%) var(--color-surface-c) var(--color-surface-h));--shadow-color-soft: oklch(50% 2.5% var(--color-surface-h) / 50%);--shadow-color-pressed: oklch(none none none / 10%);--shadow-color-deep: oklch(40% 2.5% var(--color-surface-h) / 35%);--shadow-icon: 1px 1px 2px oklch(none none none / 20%);--shadow-soft: 5px 5px 10px var(--shadow-color-soft);--shadow-inset-soft: inset 2px 2px 5px var(--shadow-color-pressed);--shadow-deep: 8px 8px 20px var(--shadow-color-deep)}}