/* zzzzmusic handwritten typography — NaniFont Regular + genuine Gaegu Bold.
 * This stylesheet is opt-in: only the music page sets data-font-theme.
 * Gaegu handles Latin letters/numbers; Chinese falls through to NaniFont.
 * Keep this file after the music and shared player stylesheets.
 */
body[data-font-theme="handwritten"] {
    --music-handwriting: "Gaegu", "NaniFont Regular", "Noto Sans TC", system-ui, sans-serif;
    font-family: var(--music-handwriting);
    font-size: 17px;
    line-height: 1.6;
    /* Preserve Nani's regular strokes; don't manufacture extra-bold glyphs. */
    font-synthesis: none;
}

/* Native form controls and local components otherwise retain their old stack. */
body[data-font-theme="handwritten"] :is(
    button, input, select, textarea,
    .zz-audio-player,
    .chord-time, .chord-volume-value,
    .history-code-value,
    .music-quota-value, .music-quota-costs,
    .multi-source-collapse, .history-batch-source-collapse,
    .history-row-retention-expiry
),
body[data-font-theme="handwritten"] .retention-code-field input[type="text"],
body[data-font-theme="handwritten"] .chord-diagram-motion text {
    font-family: var(--music-handwriting);
}

body[data-font-theme="handwritten"] input[type="file"]::file-selector-button {
    font-family: var(--music-handwriting);
}

/* Give handwriting room to breathe without changing the page's structure. */
body[data-font-theme="handwritten"] .top-title h1 {
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: .035em;
}

body[data-font-theme="handwritten"] .top-title .lead {
    font-size: 17px;
    line-height: 1.7;
}

body[data-font-theme="handwritten"] .music-convert-card > h2 {
    font-size: 23px;
    line-height: 1.4;
    letter-spacing: .025em;
}

body[data-font-theme="handwritten"] .source-choice-title {
    font-size: 17px;
}

body[data-font-theme="handwritten"] .music-main-actions :is(#readBtn, #multiReadBtn) {
    font-size: 18px;
    line-height: 1.4;
}

/* Small helper text needs a little more room with handwritten Chinese. */
body[data-font-theme="handwritten"] :is(.music-quota-costs, .music-quota-value) {
    font-size: 14px;
    line-height: 1.6;
}

body[data-font-theme="handwritten"] .source-choice-card .hint,
body[data-font-theme="handwritten"] .source-compact-note {
    font-size: 13px;
}

body[data-font-theme="handwritten"] .time-range-field small {
    font-size: 12px;
}

body[data-font-theme="handwritten"] .chord-diagram-motion text {
    font-weight: 700;
}