/* Preserve the desktop instrument; only the outer canvas changes scale. */
:root.bass-uniform-fit {
    --bass-design-vw: 12.8px;
    --bass-design-vh: 7.2px;
}

.bass-uniform-fit body {
    position: relative;
    width: 100%;
    height: 100%;
}

.bass-uniform-fit #app {
    position: absolute;
    width: 1280px;
    height: 720px;
    transform-origin: top left;
}

/* Readable typography within the fixed design, scaled with the instrument. */
.bass-uniform-fit .logo-section h1 { font-size: max(14px, clamp(0.9rem, calc(2.5 * var(--bass-design-vw, 1vw)), 1.4rem)); }
.bass-uniform-fit .logo-section .subtitle { font-size: max(14px, clamp(0.4rem, calc(1 * var(--bass-design-vw, 1vw)), 0.55rem)); }
.bass-uniform-fit .tempo-control label,
.bass-uniform-fit .swing-control label { font-size: max(14px, clamp(0.4rem, calc(0.8 * var(--bass-design-vw, 1vw)), 0.5rem)); }
.bass-uniform-fit .midi-io label { font-size: max(14px, clamp(0.35rem, calc(0.7 * var(--bass-design-vw, 1vw)), 0.5rem)); }
.bass-uniform-fit .midi-io select { font-size: max(14px, clamp(0.42rem, calc(0.62 * var(--bass-design-vw, 1vw)), 0.54rem)); }
.bass-uniform-fit .midi-menu-toggle,
.bass-uniform-fit .audio-menu-toggle { font-size: max(14px, 0.62rem); }
.bass-uniform-fit .bus-channel label { font-size: max(14px, clamp(0.42rem, calc(0.62 * var(--bass-design-vw, 1vw)), 0.54rem)); }
.bass-uniform-fit .midi-notes-section label { font-size: max(14px, clamp(0.35rem, calc(0.7 * var(--bass-design-vw, 1vw)), 0.5rem)); }
.bass-uniform-fit .midi-toggle-btn { font-size: max(14px, clamp(0.42rem, calc(0.62 * var(--bass-design-vw, 1vw)), 0.54rem)); }
.bass-uniform-fit .midi-learn-section label { font-size: max(14px, clamp(0.35rem, calc(0.7 * var(--bass-design-vw, 1vw)), 0.5rem)); }
.bass-uniform-fit .midi-learn-btn { font-size: max(14px, clamp(0.42rem, calc(0.62 * var(--bass-design-vw, 1vw)), 0.54rem)); }
.bass-uniform-fit .fullscreen-btn { font-size: max(14px, clamp(0.82rem, calc(1 * var(--bass-design-vw, 1vw)), 0.96rem)); }
.bass-uniform-fit .section-label { font-size: max(14px, clamp(0.45rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.6rem)); }
.bass-uniform-fit .knob-container label { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .knob-value { font-size: max(14px, clamp(0.55rem, calc(1.2 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .scale-section select { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.6rem)); }
.bass-uniform-fit .preset-section select { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.6rem)); }
.bass-uniform-fit .preset-section button { font-size: max(14px, clamp(0.45rem, calc(0.8 * var(--bass-design-vw, 1vw)), 0.55rem)); }
.bass-uniform-fit .vu-section label { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .seq-length-control label { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.6rem)); }
.bass-uniform-fit .spinner-btn { font-size: max(14px, clamp(1rem, calc(1.5 * var(--bass-design-vw, 1vw)), 1.2rem)); }
.bass-uniform-fit .spinner-value { font-size: max(14px, clamp(0.75rem, calc(1.2 * var(--bass-design-vw, 1vw)), 0.95rem)); }
.bass-uniform-fit .spinner-input { font-size: max(14px, clamp(0.75rem, calc(1.2 * var(--bass-design-vw, 1vw)), 0.95rem)); }
.bass-uniform-fit .pattern-save-section select { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.65rem)); }
.bass-uniform-fit .pattern-save-section button { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.65rem)); }
.bass-uniform-fit .chain-toggle-btn { font-size: max(14px, clamp(0.6rem, calc(1.2 * var(--bass-design-vw, 1vw)), 0.8rem)); }
.bass-uniform-fit .chain-controls select { font-size: max(14px, clamp(0.55rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .chain-slot { font-size: max(14px, clamp(0.5rem, calc(0.85 * var(--bass-design-vw, 1vw)), 0.65rem)); }
.bass-uniform-fit .chain-slot .slot-dec,
.bass-uniform-fit .chain-slot .slot-inc { font-size: max(14px, 11px); }
.bass-uniform-fit .chain-slot .slot-repeats { font-size: max(14px, 0.8em); }
.bass-uniform-fit .chain-slot .slot-remove { font-size: max(14px, 0.8em); }
.bass-uniform-fit .chain-position { font-size: max(14px, clamp(0.55rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .pattern-controls button { font-size: max(14px, clamp(0.45rem, calc(0.8 * var(--bass-design-vw, 1vw)), 0.55rem)); }
.bass-uniform-fit .step-num { font-size: max(14px, clamp(0.55rem, calc(1.1 * var(--bass-design-vw, 1vw)), 0.75rem)); }
.bass-uniform-fit .step-note { font-size: max(14px, clamp(0.7rem, calc(1.3 * var(--bass-design-vw, 1vw)), 0.9rem)); }
.bass-uniform-fit .scatter-pad span { font-size: max(14px, clamp(0.35rem, calc(0.65 * var(--bass-design-vw, 1vw)), 0.48rem)); }
.bass-uniform-fit .scatter-pad strong { font-size: max(14px, clamp(0.9rem, calc(1.55 * var(--bass-design-vw, 1vw)), 1.18rem)); }
.bass-uniform-fit .scatter-type { font-size: max(14px, clamp(0.34rem, calc(0.58 * var(--bass-design-vw, 1vw)), 0.44rem)); }
.bass-uniform-fit .mode-btn,
.bass-uniform-fit .scatter-hold-btn { font-size: max(14px, clamp(0.5rem, calc(0.9 * var(--bass-design-vw, 1vw)), 0.6rem)); }
.bass-uniform-fit .keyboard-controls-group .section-label { font-size: max(14px, clamp(0.6rem, calc(1.2 * var(--bass-design-vw, 1vw)), 0.8rem)); }
.bass-uniform-fit .transpose-controls label { font-size: max(14px, clamp(0.4rem, calc(0.7 * var(--bass-design-vw, 1vw)), 0.5rem)); }
.bass-uniform-fit .white-key { font-size: max(14px, clamp(0.6rem, calc(1.1 * var(--bass-design-vw, 1vw)), 0.75rem)); }
.bass-uniform-fit .black-key { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.65rem)); }
.bass-uniform-fit .theme-modal-header h2 { font-size: max(14px, clamp(0.9rem, calc(2 * var(--bass-design-vw, 1vw)), 1.2rem)); }
.bass-uniform-fit .theme-close-btn { font-size: max(14px, 1.2rem); }
.bass-uniform-fit .theme-preset-btn { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .theme-color-item label { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .theme-color-hex { font-size: max(14px, clamp(0.55rem, calc(1 * var(--bass-design-vw, 1vw)), 0.7rem)); }
.bass-uniform-fit .theme-action-btn { font-size: max(14px, clamp(0.6rem, calc(1 * var(--bass-design-vw, 1vw)), 0.75rem)); }
.bass-uniform-fit .theme-btn { font-size: max(14px, clamp(0.82rem, calc(1 * var(--bass-design-vw, 1vw)), 0.96rem)); }
.bass-uniform-fit .randomize-popup-header span { font-size: max(14px, 0.85rem); }
.bass-uniform-fit .randomize-popup-close { font-size: max(14px, 1.4rem); }
.bass-uniform-fit .randomize-option span { font-size: max(14px, 0.8rem); }
.bass-uniform-fit .randomize-apply-btn { font-size: max(14px, 0.8rem); }
.bass-uniform-fit .settings-mini-btn { font-size: max(14px, 0.7rem); }
.bass-uniform-fit .jam-btn { font-size: max(14px, 0.62rem); }
.bass-uniform-fit .export-btn { font-size: max(14px, 0.62rem); }
.bass-uniform-fit .export-option { font-size: max(14px, 0.75rem); }