/* 9.8.39 — tablet first, neutral controls and stable edit/save bar */
body.practical-ui { height:100vh; height:100dvh; }
body.practical-ui #main { min-width:0; }
body.practical-ui .desktop-command-center,
body.practical-ui .compact-meta-bar,
body.practical-ui .mobile-editor-actions,
body.practical-ui .repertoire-floating-nav { display:none !important; }
.practical-header,.practical-strip,.practical-footer,.practical-pinned-gear { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px; flex-shrink:0; background:var(--bg); border-bottom:1px solid var(--header-border); }
body.practical-ui #practicalHeader { position:relative; z-index:3050; }
body.practical-ui #main button,
body.practical-ui #sidebar button,
body.practical-ui .cat-modal button,
body.practical-ui #performanceHud button { background:var(--panel) !important; color:var(--text) !important; border:1px solid var(--header-border) !important; box-shadow:none !important; text-shadow:none !important; border-radius:8px; min-height:40px; padding:8px 12px; font-size:14px; line-height:1.25; touch-action:manipulation; }
body.practical-ui #main button:disabled,
body.practical-ui #performanceHud button:disabled { opacity:.48 !important; cursor:default; }
body.practical-ui #main button:focus-visible,body.practical-ui #sidebar button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
body.practical-ui #main button.active,
body.practical-ui #main button[aria-expanded="true"],
body.practical-ui #main button[aria-pressed="true"],
body.practical-ui #main #saveBtn,
body.practical-ui #main #performanceModeBtn { border-color:var(--accent) !important; color:var(--text) !important; background:color-mix(in srgb,var(--accent) 18%,var(--panel)) !important; }
body.practical-ui #main button[onclick*="deleteCurrentSong"],
body.practical-ui #main .xr18-mute-all-btn:not(:disabled),
body.practical-ui #performanceHud .xr18-mute-all-btn:not(:disabled) { border-color:#c85b5b !important; color:var(--text) !important; }
body.practical-ui #main #songTitle { flex:1 1 180px; min-width:120px; max-width:none; width:auto; font-size:17px; height:42px; padding:6px; color:var(--text); text-overflow:ellipsis; background:transparent; }
body.practical-ui.admin-active #main #songTitle:not([readonly]) { border:1px solid var(--accent); border-radius:6px; }
.practical-edit-save { display:none; gap:8px; align-items:center; }
body.admin-active .practical-edit-save { display:flex; }
body.practical-ui #main #saveStatus { white-space:normal; max-width:210px; font-size:12px; padding:3px 6px; }
.practical-meta { font-size:13px; color:var(--input-text); margin-left:auto; }
.practical-strip { padding-top:6px; padding-bottom:6px; }
.practical-panels { flex-shrink:1; min-height:0; overflow:auto; max-height:42vh; background:var(--panel); }
.practical-panel { padding:12px; border-bottom:1px solid var(--header-border); }
body.practical-ui [hidden] { display:none !important; }
.practical-panel-title { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.practical-panel-title strong { font-size:16px; }
.practical-help { font-size:13px; color:var(--input-text); margin:10px 0 0; line-height:1.5; }
.practical-tools-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.practical-tool-group { display:flex; flex-wrap:wrap; align-content:start; align-items:center; gap:8px; min-width:0; }
.practical-tool-group h3 { flex-basis:100%; margin:0 0 2px; font-size:14px; }
.practical-tool-group button { white-space:normal; }
body.practical-ui .practical-tool-group .theme-select-control { padding:0; }
body.practical-ui .practical-panel :is(.toolbar-section,.rhythm-toolbar) { display:flex; flex-wrap:wrap; width:auto; gap:10px; padding:0; margin:0; overflow:visible; background:transparent; border:0; }
body.practical-ui .practical-panel .toolbar-section-label { display:none; }
body.practical-ui .practical-panel .compact-field { display:inline-flex; align-items:center; gap:8px; margin:4px 8px 4px 0; }
body.practical-ui .practical-panel input:not([type=checkbox]):not([type=range]),
body.practical-ui .practical-panel select { min-height:40px; max-width:100%; font-size:16px; color:var(--text); background:var(--input-bg); border:1px solid var(--header-border); border-radius:6px; padding:6px; }
body.practical-ui .practical-panel :is(#tempo,#capo) { width:75px; }
body.practical-ui .practical-panel .local-transpose-widget { margin:8px 0; }
body.practical-ui .practical-panel .floating-line-layout-toggle { display:flex !important; flex-wrap:wrap; }
.practical-option { display:flex; align-items:center; gap:9px; min-height:44px; font-size:14px; line-height:1.4; width:100%; }
.practical-option input { width:22px; height:22px; flex-shrink:0; accent-color:var(--accent); }
body.practical-ui:not(.admin-active) .practical-edit-only { display:none !important; }
.practical-edit-fields { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.practical-edit-fields label { display:flex; align-items:center; gap:6px; flex:1 1 220px; }
.practical-edit-fields input { min-width:0; flex:1; }
body.practical-ui .practical-panel .editor-width-control { display:flex !important; flex-wrap:wrap; flex-basis:100%; margin:0; width:100%; background:var(--bg); padding:10px; }
body.practical-ui .practical-panel .editor-width-control-label strong { font-size:12px; }
body.practical-ui .practical-panel .editor-width-control-label span { font-size:11px; }
body.practical-ui .editor-container { flex:1 1 0; height:auto; min-height:0; }
body.practical-ui .practical-footer { border-top:1px solid var(--header-border); border-bottom:0; padding-bottom:max(8px,env(safe-area-inset-bottom)); justify-content:space-between; }
.practical-navigation { display:flex; gap:8px; }
body.practical-ui .practical-footer .font-controls { display:flex !important; position:static !important; transform:none !important; flex-wrap:wrap; padding:0; margin:0; background:transparent; border:0; box-shadow:none; gap:6px; }
body.practical-ui .practical-footer .font-btn { width:44px; height:44px; border-radius:8px; }
body.practical-ui .font-controls-label { color:var(--input-text); font-size:12px; }
body.practical-ui #output { padding-bottom:20px; }
body.practical-ui:not(.admin-active) .preview-meta-row .meta-item { display:none; }
body.practical-ui .preview-meta-row .youtube-link { background:var(--panel); color:var(--text); border:1px solid var(--header-border); min-height:40px; display:inline-flex; align-items:center; padding:6px 12px; }
body.practical-ui .preview-song-header { margin-bottom:14px; }
body.practical-ui #sidebar { width:280px; flex:0 0 280px; }
body.practical-ui #sidebar.hidden { margin-left:-280px; }
body.practical-ui:not(.list-actions-visible) #sidebar :is(.rep-star,.fav-star) { display:none !important; }
body.practical-ui #sidebar .is-repertoire-row { background:none; }
body.practical-ui #sidebar li.active { background:color-mix(in srgb,var(--accent) 22%,var(--panel)); border-left:3px solid var(--accent); color:var(--text) !important; }
body.practical-ui #sidebar .li-content { padding:10px 5px; }
body.practical-ui #sidebar .main-title-list { font-size:15px; line-height:1.4; }
.practical-song-order { display:none; }
body.practical-ui .practical-song-order { display:inline-block; min-width:25px; margin-right:6px; color:var(--input-text); font-variant-numeric:tabular-nums; }
body.practical-ui .songs-stats { background:var(--bg); color:var(--text); }
body.practical-ui .songs-stats strong { color:var(--text); }
body.practical-ui .pwa-status-pill { pointer-events:none; bottom:auto; top:auto; position:static; align-self:flex-start; margin:7px 10px; font-size:11px; box-shadow:none; }
body.practical-ui #assistant-drawer { top:var(--practical-header-height,64px); height:calc(100% - var(--practical-header-height,64px)); width:min(560px,55vw); background:var(--bg); }
body.practical-ui #arrangement-panel { background:var(--bg); color:var(--text); }
body.practical-ui #main .assistant-drawer-header { background:var(--panel); color:var(--text); }
body.practical-ui .chord-tooltip-card { width:240px; padding:10px; box-sizing:border-box; background:var(--bg); border-color:var(--header-border); }
body.practical-ui .chord-tooltip-toolbar { grid-template-columns:44px minmax(0,1fr) 44px 44px; gap:4px; }
body.practical-ui .chord-tooltip-toolbar button { height:44px; background:var(--panel); color:var(--text); border:1px solid var(--header-border); }
body.practical-ui .chord-tooltip-toolbar strong { font-size:12px; color:var(--text); white-space:normal; }
body.practical-ui .chord-tooltip-toolbar span { font-size:12px; color:var(--input-text); }
body.practical-ui .chord-tooltip-card > svg { display:block; width:100%; height:auto; }
.missing-chord { padding:12px; line-height:1.5; }
.arr-interpretation-help { font-size:13px; line-height:1.5; color:var(--input-text); margin:0; }
body.practical-ui:not(.gear-pinned) .practical-pinned-gear { display:none; }
body.practical-ui .practical-pinned-gear .toolbar-section { background:transparent; border:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
body.practical-ui .practical-pinned-gear .toolbar-section-label { display:none; }
body.practical-ui.performance-mode :is(.practical-header,.practical-strip,.practical-panels,.practical-footer,.practical-pinned-gear),
body.practical-ui.fs-active :is(.practical-header,.practical-strip,.practical-panels,.practical-footer,.practical-pinned-gear) { display:none !important; }
body.practical-ui.performance-mode #performanceDock { max-width:calc(100vw - 24px); }
body.practical-ui.performance-mode:not(.performance-extra-open) #performanceDock :is(.performance-speed,.performance-tempo,.performance-strum-btn) { display:none; }
body.practical-ui.performance-mode:not(.gear-pinned):not(.performance-extra-open) .performance-xr18-all { display:none; }
body.practical-ui.performance-mode:not(.gear-pinned) #performanceLiveBadge { display:none; }
body.practical-ui.large-controls #main button,
body.practical-ui.large-controls #sidebar button,
body.practical-ui.large-controls .cat-modal button,
body.practical-ui.large-controls #performanceHud button { min-height:48px; min-width:44px; font-size:16px; }
body.practical-ui.large-controls #sidebar .main-title-list { font-size:17px; }
body.practical-ui.large-controls #sidebar .li-content { padding-top:14px; padding-bottom:14px; }
@media(max-width:900px) {
 body.practical-ui #sidebar { position:fixed; top:0; bottom:0; height:100dvh; width:min(340px,90vw); margin-left:0; z-index:6000; box-shadow:8px 0 30px #0005; }
 body.practical-ui #sidebar.hidden { transform:translateX(-110%); margin-left:0; }
 body.practical-ui .practical-header { padding:8px; }
 body.practical-ui #main #songTitle { flex-basis:160px; }
 body.practical-ui #main #saveStatus { max-width:150px; }
 body.practical-ui .practical-footer { justify-content:center; gap:6px; }
 body.practical-ui .practical-footer .font-controls-label { display:none; }
 body.practical-ui .practical-panel .editor-width-control :is(.editor-width-control-label,.editor-width-range) { display:none; }
 body.practical-ui .mobile-edit-tabs { flex-shrink:0; }
 body.practical-ui #assistant-drawer { width:100%; }
 body.practical-ui .practical-panels { max-height:40dvh; }
 body.practical-ui #output { padding:16px 12px 20px !important; }
 body.practical-ui:not(.admin-active) .practical-meta { display:none; }
 body.practical-ui .practical-footer .font-target-switch { display:none; }
}
@media(max-width:560px) {
 body.practical-ui #main #songTitle { order:-1; flex-basis:100%; }
 body.practical-ui .practical-header { gap:6px; }
 body.practical-ui #main #lockBtn { flex:1; }
 body.practical-ui .practical-edit-save { flex-basis:100%; order:3; justify-content:space-between; }
 body.practical-ui #main #saveStatus { max-width:none; }
 body.practical-ui #main .practical-strip button { padding:7px 9px; font-size:13px; min-height:40px; }
 body.practical-ui .practical-strip #performanceModeBtn { flex-basis:100%; }
 body.practical-ui .practical-footer { gap:4px; padding:6px; }
 body.practical-ui .practical-footer .font-controls { order:2; }
 body.practical-ui .practical-navigation { flex:1; }
 body.practical-ui .practical-navigation button { flex:1; }
}
@media print { body.practical-ui :is(.practical-header,.practical-strip,.practical-panels,.practical-footer,.practical-pinned-gear) { display:none !important; } }

.local-drafts-content { max-width:660px; max-height:85dvh; overflow:auto; }
.local-drafts-list { display:flex; flex-direction:column; gap:8px; margin:12px 0; }
.local-drafts-list button { text-align:left; white-space:normal; }

body.practical-ui .practical-edit-save { min-width:0; }
body.practical-ui #main #lockBtn { white-space:normal; max-width:210px; }

body.practical-ui #main .practical-strip #bicieDisp { flex:0 1 auto; display:flex; align-items:center; flex-wrap:wrap; gap:4px; color:var(--text); font-size:14px; margin:0; padding:4px 6px; background:transparent; }
body.practical-ui .practical-strip #bicieDisp:empty { display:none; }
body.practical-ui #performanceHud .performance-control-group { gap:6px; }

/* 9.8.39: compact rows, global song settings, nested modal order */
.practical-tools-grid { display:flex; flex-direction:column; gap:7px; }
.practical-tool-group { gap:6px; padding:0 0 7px; border-bottom:1px solid var(--header-border); }
.practical-tool-group h3 { flex:0 0 145px; margin:0; font-size:13px; }
.practical-tool-group .practical-option { width:auto; min-height:40px; margin:0; }
body.practical-ui #practical-tools button { min-height:40px; padding:6px 10px; }
body.practical-ui.large-controls #practical-tools button { min-height:48px; }
#practical-tools .practical-panel-title { margin-bottom:7px; }
.practical-edit-more summary { cursor:pointer; min-height:40px; display:list-item; align-content:center; font-size:14px; }
.practical-more-body { display:flex; flex-wrap:wrap; gap:6px; padding:6px 0; }
#full-lyrics-modal { z-index:9400; }
#full-lyrics-modal .full-lyrics-content { max-height:90dvh; overflow:auto; }
.song-default-fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.song-default-fields label { display:flex; flex-direction:column; gap:5px; font-size:14px; }
.song-default-fields input,.song-default-fields textarea { box-sizing:border-box; width:100%; min-height:42px; font-size:16px; padding:8px; color:var(--text); background:var(--input-bg); border:1px solid var(--header-border); border-radius:6px; }
.song-details-help { font-size:13px; margin:4px 0 10px; }
.song-full-text-section summary { cursor:pointer; padding:10px 0; }
.song-full-text-section #full-lyrics-input { width:100%; min-height:180px; box-sizing:border-box; }
.song-reading-details { font-family:Arial,sans-serif; font-size:16px; }
.song-reading-intro { border-left:3px solid var(--accent); padding:8px 10px; margin-bottom:8px; white-space:pre-wrap; }
.song-reading-intro strong { margin-right:8px; }
.song-reading-note { padding:3px 10px 10px; white-space:pre-wrap; color:var(--input-text); }
@media(max-width:650px) { .practical-tool-group h3 { flex-basis:100%; } .song-default-fields { grid-template-columns:1fr; } }

body.practical-ui #full-lyrics-modal .full-lyrics-content { height:auto; }
body.practical-ui #full-lyrics-modal #full-lyrics-input { min-height:180px; height:28vh; }
.song-reading-details:has(.song-reading-intro) { position:sticky; top:0; z-index:2; background:var(--bg); }

/* 9.8.39: independent rows for chord nudging and the footer. */
body.practical-ui #previewChordNudge {
    position:static !important; inset:auto !important; transform:none !important;
    flex:0 0 auto; align-self:stretch; width:auto; max-width:none;
    flex-wrap:wrap; justify-content:center; margin:0; padding:6px 10px;
    border-radius:0; border:0; border-top:1px solid var(--header-border);
    background:var(--panel); box-shadow:none; backdrop-filter:none;
}
body.practical-ui:not(.admin-active) #previewChordNudge,
body.practical-ui.admin-active:not(.nudge-panel-enabled):not(.has-selected-preview-chord) #previewChordNudge { display:none !important; }
body.practical-ui.admin-active:is(.nudge-panel-enabled,.has-selected-preview-chord) #previewChordNudge { display:flex !important; }
body.practical-ui:is(.performance-mode,.fs-active) #previewChordNudge { display:none !important; }
body.practical-ui #previewChordNudge strong { min-width:65px; max-width:160px; color:var(--text); }
body.practical-ui #practical-tools .practical-panel-title > strong { margin-right:auto; }
body.practical-ui .practical-more-body { align-items:center; }
body.practical-ui .practical-more-body .editor-width-control { flex:1 1 100%; min-width:0; margin:4px 0 0; }
body.practical-ui #practicalSongSettings { flex:0 0 auto; }
@media print { body.practical-ui #previewChordNudge { display:none !important; } }

/* 9.8.39: direct maintenance actions and optional smaller controls. */
.practical-maintenance-actions { display:flex; flex-wrap:wrap; gap:6px; margin-left:auto; }
body.practical-ui #practical-tools .practical-panel-title { flex-wrap:wrap; }
body.practical-ui.small-controls :is(#main,#sidebar,.cat-modal,#performanceHud) button {
    min-height:30px; min-width:30px; font-size:12px; padding:4px 8px;
}
@media print {
    body > :not(#print-all-favorites-area) { display:none !important; }
    #pwaToast, .pwa-toast { display:none !important; visibility:hidden !important; }
    .print-song-intro { margin:0 0 16pt; padding:6pt 0; border-bottom:1px solid #999; color:#000; break-inside:avoid; }
    .print-song-intro > div { white-space:pre-wrap; font-family:monospace; font-size:14pt; line-height:1.6; }
    .print-song-intro .performance-intro-chord { color:#000 !important; background:none !important; border:0 !important; padding:0 !important; }
}

body.practical-ui #practicalHeader .song-version-control{flex:0 1 250px;min-width:160px;max-width:280px;height:42px}
body.practical-ui #practicalHeader .song-version-control select{height:32px;min-width:0;flex:1}
@media(max-width:700px){
 body.practical-ui #practicalHeader .song-version-control{order:2;flex:1 1 160px;max-width:none}
 body.practical-ui #practicalHeader #songTitle{flex:1 1 180px}
}

@media(min-width:901px){
 body.practical-ui #practicalHeader:has(#songVersionWrap:not([hidden])) #songTitle{flex:0 1 520px;max-width:520px}
 body.practical-ui #practicalHeader:has(#songVersionWrap:not([hidden])) #lockBtn{margin-left:auto}
}