/* Use the available viewport before asking the user to scroll. Expanded tools and
   long collections remain accessible; no scaling or hidden form controls. */
.voice-account-status{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0;font-size:0.857143rem;color:var(--muted);min-width:0}
.voice-account-status>span{overflow-wrap:anywhere;min-width:0}
.voice-account-status>.btn{flex:none}
.voice-inspector-actions>.voice-account-label,.voice-inspector-actions>[data-action=save-account-voice]{grid-column:1/-1}
.main[data-page=voices] .voice-workspace{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:10px}
.main[data-page=voices] .voice-upload{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:14px;padding:12px 16px;text-align:left;align-items:center;border-radius:14px}
.main[data-page=voices] .voice-upload>img{grid-area:auto;width:72px;margin:0}
.main[data-page=voices] .voice-upload-copy{grid-area:auto;min-width:0}
.main[data-page=voices] .voice-upload-copy h2{font-size:1.428571rem}
.main[data-page=voices] .voice-upload-copy p{max-width:none;margin:3px 0}
.main[data-page=voices] .voice-upload-copy small{display:block;font-size:0.785714rem}
.main[data-page=voices] .voice-upload-actions{grid-area:auto;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.main[data-page=voices] .voice-upload-actions .btn{font-size:0.857143rem;padding:7px 12px;min-height:36px;margin:0}
.main[data-page=voices] .voice-workspace .voice-layout{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr);gap:12px;align-items:start}
.main[data-page=voices] .voice-layout>.voice-list:only-child{grid-column:1/-1}
.main[data-page=voices] .voice-list{display:grid;gap:8px;align-content:start}
@media(min-width:801px){
 .main[data-page=voices] .voice-list{max-height:max(180px,calc(100dvh - 300px));overflow:auto;scroll-padding:8px}
 .main[data-page=voices] .voice-assets{max-height:clamp(100px,calc(100dvh - 440px),280px)}
}
.main[data-page=voices] .voice-workspace .voice-row{margin:0;padding:8px 10px}
.main[data-page=voices] .voice-workspace .voice-select-main strong{overflow-wrap:anywhere}
.voice-assets{min-width:0;max-height:clamp(100px,24dvh,280px);overflow:auto;scroll-padding:8px}
.voice-assets .asset-row>div{min-width:0;flex:1}
.voice-assets .asset-row strong,.voice-assets .asset-row small{overflow-wrap:anywhere}
.voice-inspector-actions{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:8px;margin-top:10px}
.main[data-page=voices] .voice-inspector-actions .btn{margin:0;white-space:normal}
.main[data-page=voices] .voice-workspace .inspector .notice{font-size:0.785714rem;padding:8px;margin-top:8px}
.account-overview-more{border:1px solid var(--border);border-radius:12px;background:var(--surface);min-width:0}
.account-overview-more>summary{padding:11px 14px;cursor:pointer;font-weight:600;font-size:0.928571rem}
.account-settings-page .account-overview-more>.svc-card{border:0;border-radius:0;background:transparent;padding-top:0}
.creation-inputs>summary{cursor:pointer;font-weight:600;padding:8px 0}
.svc-page>.membership-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:8px 12px;align-items:start}
.svc-page>.membership-layout>.member-intro,
.svc-page>.membership-layout>.svc-plans,
.svc-page>.membership-layout>.svc-card,
.svc-page>.membership-layout>details[open]{grid-column:1/-1}
@media(min-width:801px){
 .svc-page>.membership-layout{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Compress shared chrome in short desktop windows, preserving readable text. */
@media(min-width:801px) and (max-height:820px){
 .titlebar{height:48px;min-height:48px}
 .sidebar-brand{height:48px}
 .sidebar .nav-list{gap:4px}
 .sidebar .nav-item{min-height:42px;padding:8px 12px;font-size:1rem;gap:10px;border-radius:12px}
 .sidebar .nav-item>svg{width:23px;height:23px}
 .sidebar .nav-group{margin:0;padding-top:3px}
 .sidebar .nav-group>summary{min-height:32px;padding-block:6px}
 .sidebar .nav-group .nav-item{min-height:32px;padding-block:6px;font-size:0.785714rem}
 .sidebar .nav-subitem{min-height:30px;padding-block:5px}
 .sidebar .sidebar-bottom{padding-block:6px}
 .main{padding:4px 10px 10px;gap:8px}
 .main>.page-panel,.svc-shell.svc-page{padding:14px 16px}
 .page-title,.page-heading{margin-bottom:10px;gap:8px}
 .page-title h1,.page-heading h1{font-size:1.571429rem;line-height:1.3}
 .page-title p,.page-heading p{font-size:0.857143rem;margin-top:3px}
 .btn{min-height:34px;padding:6px 11px;border-radius:10px;font-size:0.857143rem}
 .tabs button{min-height:34px;padding-block:5px;font-size:0.857143rem}
 .section-title{margin-block:10px;gap:8px}
 .field{margin-block:10px;gap:5px}
 .notice{padding:8px;font-size:0.785714rem;line-height:1.6}
 .inspector h4{margin:10px 0 6px}
 .inspector-song{margin-bottom:10px;gap:10px}
 .inspector-song .cover{width:42px;height:46px}
 .asset-row{padding:6px 0;gap:8px}
 .asset-row strong{font-size:0.857143rem}
 .asset-row small{font-size:0.785714rem}
 .settings-content{padding:14px}
 [data-settings-section]>.settings-sidebar{padding-bottom:8px;gap:6px;flex-wrap:wrap;overflow:visible}
 [data-settings-section]>.settings-sidebar button{min-height:32px;padding:6px 10px}
 [data-settings-section]>.settings-content{padding:14px 16px}
 [data-settings-section=appearance]>.settings-content{padding:0}
 [data-settings-section=appearance] .appearance-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 [data-settings-section=appearance] .appearance-preview-card .lyric-preview{min-height:64px;padding:8px;aspect-ratio:4}
 [data-settings-section=appearance] .appearance-card .setting-row p{margin:2px 0}
 [data-settings-section=appearance] .appearance-card .setting-row{padding:4px 0}
 [data-settings-section=appearance] .appearance-card .theme-choice{min-height:48px}
 .recording-sunset .editor-layout{gap:12px}
 .recording-sunset .recording-clock{gap:10px;margin:2px 0 4px}
 .recording-sunset .inspector>p{line-height:1.5}
 .recording-sunset .editor-wave{height:clamp(72px,14dvh,112px)}
 .recording-sunset .range-editor{padding:4px 8px;margin:4px 0}
 .recording-sunset .quality-summary .stats-row{margin:3px 0}
 .recording-sunset .recording-advanced>summary{padding:5px 0}
 .recording-sunset .record-empty{min-height:46px;display:flex;flex-direction:row;flex-wrap:wrap;padding:6px;gap:8px}
 .recording-sunset .record-empty>svg{width:22px;height:22px}
 .recording-sunset .record-empty p{margin:0}
 .recording-sunset .section-title .inline-title{min-height:32px;padding:4px 8px}
 .recording-sunset .record-controls{padding:5px;margin:5px 0}
 .recording-sunset .record-control>span{width:30px;height:30px}
 .recording-sunset .record-control.record-start>span{width:34px;height:34px}
 .recording-sunset .record-control svg{width:18px;height:18px}
 .recording-sunset .record-controls .record-control{gap:3px;font-size:0.714286rem}
 [data-settings-section=appearance] .appearance-preview-card .lyric-preview{height:64px;min-height:64px;aspect-ratio:auto}
 [data-settings-section=appearance] .appearance-card .setting-slider{padding:3px 0}
 [data-settings-section=appearance] .theme-choice{min-height:44px;padding:6px;margin:6px 0}
 [data-settings-section=appearance] .appearance-shortcuts .shortcut-row{padding:1px 0}
 [data-settings-section=appearance] .appearance-shortcuts .shortcut-row .btn{min-height:26px;padding:2px 6px}
 .main[data-page=library] .inspector>:not(.btn){grid-column:1/-1}
 .main[data-page=library] .inspector>.btn{margin:4px 0 0;width:100%;font-size:0.785714rem;padding-inline:6px}
 .main[data-page=library] .inspector>.notice{margin-top:8px}
 .main[data-page=library] .inspector .tabs button{min-height:30px}
 /* Reference detail: keep edit fields, playback and checks together. */
 .main[data-page=voices] .breadcrumb{margin-bottom:8px}
 .main[data-page=voices] .detail-layout{gap:16px}
 .main[data-page=voices] .voice-detail-hero{gap:14px;margin-bottom:10px}
 .main[data-page=voices] .voice-detail-hero>.cover{width:80px;height:86px}
 .main[data-page=voices] #voice-edit-form p{margin:3px 0;font-size:0.785714rem}
 .main[data-page=voices] #voice-edit-form input{min-height:32px;padding:5px 8px}
 .main[data-page=voices] .audio-preview{margin:6px 0;padding:6px;height:48px}
 .main[data-page=voices] .audio-preview .wave{height:36px}
 .main[data-page=voices] .check-item{padding:8px 0;gap:10px;margin:0}
 .main[data-page=voices] .check-item p{margin:3px 0;font-size:0.785714rem}
 .main[data-page=voices] .voice-reference-table td{padding:7px}
 .main[data-page=voices] .table-wave{height:28px}
 /* Account categories already provide full security and connection tools. */
 .account-settings-page.svc-shell{padding:14px 16px}
 .account-settings-page .svc-heading{margin-bottom:10px}
 .account-settings-page .svc-heading h1{font-size:1.571429rem}
 .account-categories{margin-bottom:10px}
 .account-categories a{padding:8px;font-size:0.857143rem;gap:8px}
 .account-category-content,.account-overview-grid{gap:10px}
 .account-settings-page .svc-card{padding:12px 14px}
 .account-settings-page h2{font-size:1.142857rem;margin-bottom:8px}
 .account-settings-page .account-identity{padding-bottom:8px;margin-bottom:8px;gap:12px}
 .account-settings-page .account-avatar{width:40px;height:40px}
 .account-settings-page .account-identity strong{font-size:1.071429rem}
 .account-settings-page .account-profile-card>.field{margin-bottom:7px}
 .account-settings-page input{min-height:32px;padding:5px 8px;font-size:0.857143rem}
 .account-settings-page .account-security-row{padding:5px 0;grid-template-columns:28px minmax(0,1fr) auto;gap:8px}
 .account-settings-page .account-row-icon{width:28px;height:28px}
 .account-settings-page .account-row-icon svg{width:18px;height:18px}
 .account-settings-page .account-security-row small{margin-top:1px;font-size:0.785714rem}
 .account-settings-page .account-card-title{margin-bottom:8px;gap:6px}
 .account-settings-page .account-password-card>small{margin:6px 0}
 .account-settings-page .account-connection-row{padding:4px 0;grid-template-columns:28px 70px minmax(0,1fr);gap:8px}
 .account-settings-page .account-connection-row small{margin:0;font-size:0.785714rem}
 .account-community-summary{gap:10px}
 .account-community-summary>.svc-card{padding:8px 12px;gap:10px}
 .account-settings-page .account-data-footer{padding-top:8px;gap:12px}
 .account-settings-page .btn{min-height:32px;padding:5px 10px;font-size:0.857143rem}
 .svc-page .svc-card{padding:12px 14px}
 .svc-page .svc-card h2{font-size:1.214286rem;margin-bottom:8px}
 .svc-page .svc-card h3{font-size:1.071429rem;margin-bottom:6px}
 .svc-page .svc-card p{font-size:0.857143rem;margin:6px 0;line-height:1.6}
 .svc-page .service-disclosure{margin-block:8px}
 .svc-page .service-disclosure>summary{padding:9px 12px;font-size:0.857143rem}
 .svc-page .service-disclosure-body{padding:12px}
 .svc-page .svc-plans{gap:12px}
 .svc-page .svc-plan>strong{margin:4px 0;font-size:1.714286rem}
 .svc-page .svc-plan{margin-bottom:8px}
 .svc-page .member-intro{margin:4px 0 10px;font-size:0.857143rem}
 .svc-page .svc-metrics{margin-bottom:10px}
 .svc-page .svc-metrics>div{padding:8px 12px}
 .svc-page .svc-metrics strong{font-size:1.714286rem}
 .sing-catalog{margin-top:10px}
 [data-settings-section=devices]>.settings-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;align-content:start}
 [data-settings-section=devices] .settings-content>.page-title,
 [data-settings-section=devices] .settings-content>.notice,
 [data-settings-section=devices] .settings-content>.settings-footer{grid-column:1/-1}
 [data-settings-section=devices] .settings-content>.settings-section{padding:0;margin:0}
 [data-settings-section=devices] .settings-content>.settings-section:nth-last-of-type(1){grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
 [data-settings-section=devices] .setting-row{padding:6px 0;gap:8px;flex-wrap:wrap}
 [data-settings-section=devices] .setting-row h3{margin:0 0 4px;font-size:1rem}
 [data-settings-section=devices] .setting-row p{margin:2px 0;font-size:0.785714rem}
 [data-settings-section=devices] .setting-row select{width:100%;min-height:32px;padding:5px 8px}
 [data-settings-section=devices] .meter-row{margin:8px 0}
 [data-settings-section=devices] .settings-footer{margin-top:2px;padding:6px 0}
 .create-page .create-layout{grid-template-columns:minmax(0,1fr) 240px;gap:16px}
 .create-page .creation-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start}
 .create-page .creation-steps>section{padding:0 0 8px;margin:0;min-width:0}
 .create-page .creation-steps>section:first-child{grid-row:1/3}
 .create-page .creation-steps h3{font-size:1.071429rem;gap:6px;margin-bottom:8px}
 .create-page .creation-steps p{font-size:0.785714rem;line-height:1.6;margin:6px 0}
 .create-page .creation-song{display:grid;grid-template-columns:42px minmax(0,1fr);padding:8px;gap:8px;margin:8px 0}
 .create-page .creation-song>.cover{width:42px;height:48px}
 .create-page .creation-song>.btn{grid-column:1/-1;justify-self:start}
 .create-page .creation-wave{height:32px}
 .create-page .creation-steps .field{margin:8px 0}
 .create-page .creation-steps .choice{min-height:56px;padding:8px;font-size:0.857143rem}
 .create-page .creation-steps .choice small{font-size:0.714286rem}
 .create-page .creation-steps .choice-row{gap:6px;flex-wrap:wrap}
 .create-page .creation-steps .pitch-control{margin:8px 0;gap:6px;font-size:0.785714rem;flex-wrap:wrap}
 .create-page .creation-steps .notice{padding:7px;font-size:0.785714rem}
 .create-page .creation-summary{padding-left:14px}
 .create-page .creation-summary .field{margin:8px 0}
 .create-page .creation-summary>.btn{margin-top:5px}
 .create-page .creation-summary>h3{margin-bottom:6px}
 .create-page .creation-summary .quota-summary{padding:7px;margin-block:6px;font-size:0.785714rem}
 .create-page .creation-summary .checkbox-line{margin:8px 0;font-size:0.785714rem;line-height:1.6}
 .create-page .creation-summary .advanced-disclosure{margin:7px 0;padding:6px;font-size:0.785714rem}
 .create-page .voice-field-row{flex-wrap:wrap;gap:6px}
 .compare-page.reference-split{grid-template-columns:190px minmax(0,1fr)}
 .compare-page.reference-split>.page-panel{padding:12px 14px}
 .compare-page .compact-hero{min-height:58px;margin:0 0 8px;gap:12px}
 .compare-page .compact-hero>.hero-cover{width:54px;height:58px}
 .compare-page .compact-hero h1{font-size:1.285714rem}
 .compare-page .compact-hero p{margin:3px 0}
 .compare-page .compare-layout{grid-template-columns:minmax(0,1fr) 210px;gap:12px;margin-top:8px}
 .compare-page .compare-layout h2{font-size:1.142857rem}
 .compare-page .compare-layout .section-title{margin:0 0 6px}
 .compare-page .compare-layout .section-title p{font-size:0.785714rem;margin:3px 0}
 .compare-page .range-editor{padding:6px 8px;margin:6px 0;font-size:0.785714rem;gap:6px;flex-wrap:wrap}
 .compare-page .range-editor input{min-height:28px;width:55px;padding:3px 5px}
 .compare-page .comparison-tabs{padding-inline:8px;gap:16px}
 .compare-page .comparison-row{min-height:60px;margin-bottom:6px;padding:7px 9px;gap:4px;grid-template-columns:minmax(0,1fr) 80px}
 .compare-page .comparison-wave{margin:0}
 .compare-page .comparison-wave .wave,.compare-page .comparison-wave svg{height:26px}
 .compare-page .compare-layout>.comparison-checklist{padding:10px}
 .compare-page .comparison-checklist>p{font-size:0.785714rem;margin:5px 0}
 .compare-page .comparison-checklist .checkbox-line{font-size:0.785714rem;margin:10px 0;line-height:1.6}
 .compare-page .comparison-checklist .field{margin:8px 0}
 .compare-page .comparison-checklist textarea{min-height:60px;height:60px;padding:5px 8px}
 .compare-page .comparison-footer{margin:8px 0 0;gap:10px;flex-direction:row;align-items:center}
 .compare-page .comparison-footer p{margin:3px 0;font-size:0.785714rem}
 .compare-page .comparison-footer small{font-size:0.714286rem}
 .compare-page .comparison-footer>.actions{margin:0;gap:6px;flex-wrap:wrap;max-width:220px}
 .compare-page .comparison-footer .btn{min-height:32px;padding:5px 8px;font-size:0.785714rem}
 .compare-page .compare-layout .comparison-row{min-height:54px;padding-block:5px}
 .compare-page .compare-layout .range-editor{min-height:0}
 .compare-page .comparison-footer{flex-wrap:wrap;gap:4px 12px}
 .compare-page .comparison-footer>div:first-child{min-width:200px}
 .compare-page .comparison-footer h4{font-size:0.857143rem}
 .compare-page .comparison-footer p{line-height:1.4}
 .compare-page .playlist .current-track-info{display:grid;grid-template-columns:48px minmax(0,1fr);gap:8px}
 .compare-page .playlist .current-track-info .hero-cover{width:48px;height:54px}
 .compare-page .playlist .current-track-info h3{font-size:0.857143rem}
 .compare-page .playlist .current-track-info p{font-size:0.714286rem;margin:3px 0}
 .compare-page .playlist .current-track{margin-bottom:8px;padding-bottom:8px}
 
 .compare-page .playlist .current-track-info .voice-select select{max-width:88px}
 .account-settings-page.svc-page .account-profile-card>.field{margin:0 0 7px;gap:6px}
 .account-settings-page.svc-page .account-profile-card input{min-height:32px;padding:5px 8px;font-size:0.857143rem}
 .account-settings-page.svc-page .account-identity p{margin:3px 0;font-size:0.785714rem}
 .account-settings-page .account-overview-more>summary{padding:8px 12px}
 .svc-page .project-backups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
 .svc-page .project-backups>.merged-section{margin:0}
 .svc-page .project-backups .merged-section-title{margin:0 0 8px;padding-bottom:6px;font-size:1.142857rem}
 .svc-page .project-backups .svc-columns{grid-template-columns:minmax(0,1fr);gap:8px}
 .svc-page .project-backups .svc-card{margin-bottom:8px}
 .svc-page .project-backups .sync-section{padding:10px 12px;margin-bottom:8px}
 .svc-page .project-backups .backup-layout{gap:10px}
 .svc-page .project-backups .sync-section h2{font-size:1.071429rem}
 .svc-page .project-backups .sync-section p{font-size:0.785714rem;margin:5px 0;line-height:1.6}
 .svc-page .project-backups .backup-layout .checkbox-line{margin:6px 0;font-size:0.785714rem}
 .svc-page .project-backups .backup-actions .btn{margin-top:5px}
 .svc-page .project-backups .svc-card .field{margin:6px 0}
 .svc-page .project-backups .controller-section{flex-wrap:wrap;gap:8px}
 .svc-page .project-backups .controller-section .btn{margin:0}
}
@media(min-width:901px) and (max-width:1100px){
 .sunset-workbench{grid-template-columns:190px minmax(0,1fr) 220px;grid-template-rows:minmax(0,1fr);height:100%;min-height:470px;flex:1 0 auto;gap:8px}
 .sunset-workbench .sunset-stage{grid-column:2;grid-row:1;min-height:0}
 .sunset-workbench .performance-controls{grid-column:3;grid-row:1;display:flex;flex-direction:column;gap:0;padding:6px 10px;overflow:auto}
 .sunset-workbench .control-card{padding:5px 0}
 .sunset-workbench .control-card h3{font-size:0.857143rem;margin-bottom:6px}
 .sunset-workbench .mode-grid{gap:5px}
 .sunset-workbench .mode{min-height:45px;padding:5px;gap:3px}
 .sunset-workbench .mode>svg{width:18px;height:18px}
 .sunset-workbench .mode span{font-size:0.785714rem}
 .sunset-workbench .mode small{font-size:0.642857rem}
 .sunset-workbench .gain-row{grid-template-columns:14px 68px minmax(0,1fr) 26px;min-height:25px;font-size:0.714286rem;gap:3px}
 .sunset-workbench .workbench-play{margin:6px 0 0;min-height:34px;font-size:0.928571rem}
 .sunset-workbench .workbench-record{min-height:30px;font-size:0.785714rem}
 .sunset-workbench .playlist{padding:12px 8px}
 .sunset-workbench .playlist-toolbar{flex-wrap:wrap;gap:6px}
 .sunset-workbench .playlist-toolbar .search{flex-basis:100%;width:100%}
 .sunset-workbench .current-track-info{grid-template-columns:52px minmax(0,1fr);gap:7px}
 .sunset-workbench .current-track-info .hero-cover{width:52px;height:58px}
 .sunset-workbench .current-track-info h3{font-size:0.857143rem}
 .sunset-workbench .current-track-info .voice-select{max-width:100%}
 .sunset-workbench .current-track-info .voice-select select{max-width:90px}
 .sunset-workbench .current-track-info small{overflow-wrap:anywhere}
 .sunset-workbench .playlist>.btn{min-height:34px;font-size:0.857143rem}
 .sunset-workbench .stage-heading{padding:14px 12px 6px}
}
/* Below tablet widths, switch to natural document flow with no clipped controls. */
@media(max-width:1000px){
 .main[data-page=voices] .voice-upload-actions{display:grid;gap:6px}
 .main[data-page=voices] .voice-upload-copy h2{font-size:1.285714rem}
}
@media(max-width:800px){
 .main[data-page=voices] .voice-upload{grid-template-columns:52px minmax(0,1fr);padding:10px;gap:8px 10px}
 .main[data-page=voices] .voice-upload>img{width:52px;grid-column:1;grid-row:1}
 .main[data-page=voices] .voice-upload-copy{grid-column:2}
 .main[data-page=voices] .voice-upload-actions{grid-column:1/-1;display:flex;justify-content:flex-start}
 .main[data-page=voices] .voice-upload-actions .btn{flex:1}
 .main[data-page=voices] .voice-workspace .voice-layout{grid-template-columns:minmax(0,1fr)}
 .voice-inspector-actions{grid-template-columns:minmax(0,1fr)}
}
@media(min-width:801px) and (max-height:620px){
 .main[data-page=voices] .voice-upload{grid-template-columns:52px minmax(0,1fr) auto;padding:8px 12px;gap:10px}
 .main[data-page=voices] .voice-upload>img{width:52px}
 .main[data-page=voices] .voice-upload-copy h2{font-size:1.285714rem}
 .main[data-page=voices] .voice-upload-copy p{margin:1px 0}
 .main[data-page=voices] .voice-workspace .inspector{padding:10px}
 .main[data-page=voices] .voice-workspace .voice-row .cover{width:36px;height:40px}
 .main[data-page=voices] .voice-workspace .voice-select-main strong{font-size:0.928571rem}
 .main[data-page=voices] .voice-workspace .voice-select-main small{font-size:0.714286rem}
 .main[data-page=voices] .voice-workspace .inspector h4{margin:7px 0}
 .main[data-page=voices] .voice-workspace .inspector-song{margin-bottom:6px}
 .main[data-page=voices] .voice-workspace .asset-row{padding:4px 0}
 .main[data-page=voices] .voice-workspace .inspector .notice{margin-top:6px;padding:6px}
 .main[data-page=voices] .voice-workspace .voice-row{flex-wrap:wrap}
 .main[data-page=voices] .voice-workspace .voice-row>.btn{margin:0}
}
/* Account for the shared category tabs as part of the short-window budget. */
@media(min-width:801px) and (max-height:820px){
 .unified-shell .titlebar{height:48px;min-height:48px}
 .unified-shell .sidebar-brand{height:48px;min-height:48px;margin-bottom:8px}
 .unified-shell .sidebar .nav-list{gap:4px}
 .unified-shell .sidebar .nav-item{min-height:42px;padding-block:8px;font-size:1rem;gap:10px}
 .unified-shell .section-navigation{padding-bottom:4px;gap:4px}
 .unified-shell .section-navigation button{min-height:32px;padding:4px 11px;font-size:0.857143rem}
 .main[data-page=voices]>.page-panel{padding:10px 14px}
 .main[data-page=voices]>.page-panel>.page-title{margin-bottom:6px}
 .main[data-page=voices]>.page-panel>.tabs{margin:0}
 .main[data-page=voices]>.page-panel>.tabs button{min-height:30px;padding:4px 12px}
 .main[data-page=voices] .voice-workspace{gap:8px;margin-top:8px}
 .main[data-page=voices] .voice-upload{padding:6px 10px}
 .main[data-page=voices] .voice-upload-copy h2{margin:0;font-size:1.285714rem}
 .main[data-page=voices] .voice-upload-copy p{line-height:1.5;margin:2px 0}
 .main[data-page=voices] .voice-upload-copy small{line-height:1.5}
 .main[data-page=voices] .voice-workspace .inspector{padding:8px 10px}
 .main[data-page=voices] .voice-workspace .inspector-song{margin-bottom:4px;gap:8px}
 .main[data-page=voices] .voice-workspace .inspector-song .cover{width:36px;height:40px}
 .main[data-page=voices] .voice-workspace .inspector-song h3{font-size:1rem;line-height:1.4}
 .main[data-page=voices] .voice-workspace .inspector-song small{font-size:0.785714rem}
 .main[data-page=voices] .voice-workspace .inspector h4{margin:4px 0;font-size:0.857143rem}
 .main[data-page=voices] .voice-workspace .asset-row{padding:3px 0;min-height:0}
 .main[data-page=voices] .voice-workspace .asset-row strong{font-size:0.785714rem;line-height:1.4}
 .main[data-page=voices] .voice-workspace .asset-row small{font-size:0.714286rem;line-height:1.5}
 .main[data-page=voices] .voice-inspector-actions{margin-top:6px;gap:6px}
 .main[data-page=voices] .voice-inspector-actions .btn{font-size:0.785714rem;padding:5px 6px;min-height:32px}
 .main[data-page=voices] .voice-workspace .inspector .notice{margin-top:6px;padding:5px 6px;font-size:0.714286rem;line-height:1.5}
 .main[data-page=voices] .voice-list{max-height:max(150px,calc(100dvh - 324px))}
 .main[data-page=voices] .voice-assets{max-height:clamp(70px,calc(100dvh - 440px),180px)}
 .main[data-page=voices] .empty.tall{min-height:150px;padding:12px}
 .unified-shell [data-settings-section=appearance] .appearance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:801px) and (max-height:820px){
 .main[data-page=voices] .voice-upload-actions{display:flex;flex-wrap:nowrap}
 .main[data-page=voices] .voice-upload-actions .btn{font-size:0.785714rem;min-height:32px;padding:5px 8px}
 .main[data-page=voices] .voice-upload-copy h2{line-height:1.3}
 .main[data-page=voices] .voice-upload-copy small{font-size:0.714286rem}
 .main[data-page=voices] .voice-assets{font-size:0.785714rem;line-height:1.4}
 .main[data-page=voices] .asset-row>div{display:flex;flex-direction:column;gap:2px}
 .main[data-page=voices] .asset-row strong,.main[data-page=voices] .asset-row small{margin:0}
 .main[data-page=voices] .voice-workspace .inspector-song{line-height:1.4}
 .main[data-page=voices] .voice-workspace .inspector .notice{margin-bottom:0}
 .create-page .creation-summary{padding-top:0;padding-bottom:0}
 .create-page .creation-inputs{padding:0}
 .create-page .creation-steps .choice-row{margin:8px 0}
 .create-page .creation-steps select{min-height:32px;padding:5px 8px;font-size:0.857143rem}
 .create-page .creation-steps .voice-field-row{display:flex;align-items:end}
 .create-page .creation-steps .voice-field-row>.field{flex:1 1 120px}
 .create-page .creation-steps .voice-field-row>.btn{margin:0 0 8px}
 .create-page .creation-steps .notice{margin:6px 0}
 .create-page .creation-summary .notice{margin:6px 0}
 .create-page .creation-steps{grid-template-rows:auto auto}
 .create-page .creation-steps>section:first-child{align-self:start}
 .recording-sunset .section-title input.inline-title{min-height:30px;padding:3px 0;font-size:1rem}
 .recording-sunset .section-title{margin-bottom:4px}
 .recording-sunset .recording-clock>strong{font-size:2.142857rem}
 .recording-sunset .recording-clock{margin:0 0 4px}
 .recording-sunset .editor-time{margin:3px 0}
 .recording-sunset .range-editor{margin:3px 0}
 .recording-sunset .record-controls{margin:3px 0;padding:3px}
 .recording-sunset .inspector .field{margin:6px 0}
 .recording-sunset .inspector>p{margin:5px 0;font-size:0.785714rem}
 .recording-sunset .inspector>h3{font-size:1.071429rem}
 .recording-sunset .inspector>.notice{margin:5px 0;font-size:0.714286rem;line-height:1.4;padding:6px}
 .recording-sunset .recording-save-hint{line-height:1.4}
 .main[data-page=library] .table-wrap{max-height:max(145px,calc(100dvh - 350px));overflow:auto;scroll-padding:8px}
 .main[data-page=library] .table-wrap th{position:sticky;top:0;z-index:1;background:var(--surface)}
 .main[data-page=library] .table-wrap td{padding:6px}
 .main[data-page=library] .table-song .cover{width:32px;height:36px}
 .main[data-page=library] .table-toolbar{margin:8px 0}
 .main[data-page=library] .table-toolbar .tabs{gap:12px}
 .main[data-page=library] .table-toolbar .tabs button{font-size:0.785714rem}
 .compare-page .compact-hero{display:grid;grid-template-columns:44px minmax(0,1fr) auto;min-height:44px;gap:10px}
 .compare-page .compact-hero>.hero-cover{width:44px;height:48px}
 .compare-page .compact-hero .hero-actions{grid-column:3;grid-row:1}
 .compare-page .compare-layout>.comparison-checklist{padding:8px}
 .compare-page .comparison-checklist h3{font-size:1rem}
 .compare-page .comparison-checklist h3>svg{width:20px;height:20px}
 .compare-page .comparison-checklist>p{margin:3px 0;font-size:0.714286rem}
 .compare-page .comparison-checklist .checkbox-line{margin:6px 0;font-size:0.714286rem}
 .compare-page .comparison-checklist .field{margin:6px 0;font-size:0.785714rem}
 .compare-page .comparison-checklist textarea{min-height:44px;height:44px}
 .compare-page .comparison-checklist .btn{margin-top:4px;min-height:30px}
 .compare-page .range-editor input{min-height:28px;padding:3px 5px}
 .compare-page .comparison-footer{margin:5px 0 0}
 .compare-page .comparison-footer>.actions{max-width:none}
 .compare-page .comparison-heading{gap:5px}
 .compare-page .comparison-wave>span{font-size:0.714286rem}
}
@media(min-width:801px) and (max-height:820px){
 .main[data-page=voices]>.page-panel>.page-title>div:first-child{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
 .main[data-page=voices]>.page-panel>.page-title p{margin:0;font-size:0.785714rem}
 .main[data-page=voices] .voice-workspace{margin-top:6px;gap:6px}
 .account-settings-page .account-overview-more{padding:0}
 .account-settings-page .account-security-row{padding:4px 0}
 .account-settings-page .account-overview-grid{gap:8px}
 .account-settings-page .account-community-summary>.svc-card{padding:6px 10px}
 .account-settings-page .account-community-summary p{font-size:0.714286rem;line-height:1.4;margin:2px 0}
 .account-settings-page .account-data-footer{padding-top:6px;gap:8px;font-size:0.714286rem}
 .svc-page details.service-disclosure{padding:0}
 .svc-page .svc-heading{margin-bottom:10px}
 .svc-page .svc-heading h1{font-size:1.571429rem}
 .svc-page .svc-metrics>div{padding:6px 12px}
 .svc-page .svc-metrics strong{font-size:1.571429rem}
 .svc-page .svc-plan{padding:10px 12px}
 .sing-submit .checkbox-line{margin:5px 0;font-size:0.785714rem}
 .sing-submit>p,.sing-submit>small{font-size:0.714286rem;line-height:1.5;margin:4px 0}
 .sing-submit .notice{margin:5px 0;font-size:0.714286rem;padding:6px;line-height:1.4}
 .sing-submit .btn{margin-top:4px}
}
/* Category tabs consume their own flex row; a page must not also demand 100%. */
.unified-shell .main>.svc-shell.svc-page{min-height:0;flex:1 0 auto}
@media(min-width:801px) and (max-height:820px){
 .account-settings-page .svc-heading>.actions,
 .svc-page:has(>.membership-layout) .svc-heading>.actions{margin:0}
 .svc-shell.svc-page.account-settings-page:has([data-account-category=profile]),
 .svc-shell.svc-page.sing-page{padding-block:8px}
}
.feature-map-root:after{pointer-events:none}
@media(min-width:801px) and (max-height:820px){
 .unified-shell .sunset-workbench{min-height:0;flex:1 0 0;height:auto}
 .sunset-workbench .playlist>.tabs{gap:6px;flex-wrap:wrap}
 .sunset-workbench .playlist>.tabs button{padding-inline:2px;font-size:0.785714rem}
 .main[data-page=recording]>.page-panel{padding:10px 14px}
 .recording-sunset .editor-layout>div>p.muted{font-size:0.714286rem;line-height:1.4;margin:3px 0}
 .recording-sunset .recording-advanced{margin-top:4px}
 .recording-sunset .recording-advanced>summary{padding:3px 0;font-size:0.785714rem}
 .create-page .creation-summary .checkbox-line{margin:5px 0;line-height:1.4}
 .create-page .creation-summary>.btn{min-height:32px;margin-top:3px}
 .create-page .creation-summary .advanced-disclosure{margin:4px 0;padding:4px}
 .compare-page .compact-hero{grid-template-columns:44px minmax(0,1fr);padding-right:100px}
 .compare-page .compact-hero>div{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 10px;align-items:center}
 .compare-page .compact-hero>div>h1{font-size:1.285714rem;grid-column:1}
 .compare-page .compact-hero>div>p{font-size:0.714286rem;grid-column:1;margin:0}
 .compare-page .compact-hero .hero-actions{grid-column:2;grid-row:1/3;flex-wrap:wrap;gap:4px}
 .compare-page .compact-hero .hero-actions .badge{font-size:0.714286rem;max-width:100%;white-space:normal}
 .compare-page .compact-hero .back-edit{min-height:30px;font-size:0.785714rem;padding:4px 6px;top:0}
 .compare-page .compare-layout .section-title p{font-size:0.714286rem;line-height:1.4}
 .compare-page .compare-layout .section-title h2{font-size:1.071429rem;line-height:1.3}
 .compare-page .comparison-tabs button{min-height:30px;padding-block:4px;font-size:0.785714rem}
 .main[data-page=library] .mini-player{min-height:54px;padding:5px 16px}
 .main[data-page=library] .mini-transport{display:flex;align-items:center;gap:8px}
 .main[data-page=library] .mini-transport>.muted{font-size:0.714286rem}
 .main[data-page=library] .mini-player .play-main{width:36px;height:36px}
 .main[data-page=library] .mini-player .mini-song .cover{width:36px;height:36px}
 .account-settings-page .svc-card.account-profile-card{padding-block:10px}
 .account-settings-page .account-profile-card h2{margin-bottom:5px}
 .account-settings-page .account-identity{padding-bottom:4px;margin-bottom:5px}
 .account-settings-page .account-profile-card>.btn{margin-top:4px}
 .account-settings-page .account-data-footer small{font-size:0.714286rem;line-height:1.4}
 .account-settings-page .account-community-summary h2{font-size:0.928571rem}
 .account-settings-page .account-community-summary strong{font-size:0.785714rem}
 .account-settings-page .account-community-summary .account-row-icon{width:24px;height:24px}
 .account-settings-page .account-community-summary .account-row-icon svg{width:16px;height:16px}
 .svc-page>.notice{margin:7px 0}
 .svc-page .service-disclosure{margin:5px 0}
 .svc-page .service-disclosure>summary{padding:7px 10px;font-size:0.785714rem}
 .svc-page .svc-plan>span>svg{width:20px;height:20px}
 .svc-page .svc-plan>strong{font-size:1.571429rem;margin:3px 0}
 .sing-page .sing-catalog{padding:8px 12px;margin:6px 0 0}
 .svc-page .project-backups .pair-device{flex-wrap:wrap;min-width:0}
 .svc-page .project-backups .pair-device>div{min-width:0;flex:1 1 100%}
 .svc-page .project-backups .pair-device .btn{white-space:normal}
}
@media(min-width:801px) and (max-height:820px){
 .svc-page>.membership-layout{gap:4px 12px}
 .svc-page>.membership-layout>.member-intro{margin:2px 0 6px;font-size:0.785714rem}
 .svc-page>.membership-layout>.service-disclosure{margin:0}
 .account-settings-page .svc-heading{min-height:32px;margin-bottom:8px}
 .account-settings-page .svc-heading h1{margin:0}
 .account-settings-page .account-profile-card>.field{margin-bottom:5px;gap:4px}
 .account-settings-page .account-security-row small{font-size:0.714286rem;line-height:1.3}
 .account-settings-page .account-security-row{padding:3px 0}
 .account-settings-page .account-category-content{gap:7px}
 .account-settings-page .account-overview-more>summary{padding:6px 10px;font-size:0.857143rem}
 .account-settings-page .account-data-footer{line-height:1.3}
 .account-settings-page .account-data-footer span,.account-settings-page .account-data-footer p{font-size:0.714286rem;line-height:1.3;margin:0}
 .main[data-page=library]>.page-panel>.page-title{margin-bottom:6px}
 .main[data-page=recording] .recording-sunset .editor-layout>.inspector{padding-top:0}
 .recording-sunset .recording-clock>p{font-size:0.785714rem}
 .recording-sunset .editor-layout>div>.page-title{margin-bottom:4px}
 .recording-sunset .editor-wave{height:72px}
 .recording-sunset .editor-layout>.inspector>.field{margin:4px 0}
 .recording-sunset .recording-save-hint{font-size:0.714286rem;margin:4px 0}
 .main[data-page=service] .online-catalog-page .catalog-demo-tools{padding:4px 0;margin:5px 0}
}
@media(min-width:801px) and (max-height:820px){
 .online-catalog-page .catalog-results>.svc-catalog .catalog-song{padding:8px;margin-bottom:6px;gap:2px 8px}
 .online-catalog-page .catalog-results>h2{margin:6px 0;font-size:1.142857rem}
 .online-catalog-page .catalog-results>p{font-size:0.785714rem;line-height:1.4;margin:4px 0}
 .online-catalog-page .catalog-results>.svc-catalog .catalog-song>.cover{width:44px;height:48px}
 .online-catalog-page .catalog-results>.svc-catalog .catalog-song p{font-size:0.714286rem;line-height:1.4;margin:2px 0}
 .online-catalog-page .catalog-results>.svc-catalog .catalog-song h2{font-size:1rem;line-height:1.4;margin-bottom:3px}
 .online-catalog-page .catalog-results>.svc-catalog .catalog-song .btn{min-height:30px;padding:4px 8px;margin-top:3px}
}

/* Keep playback and explicit full import together in every catalog layout. */
.online-catalog-page .catalog-song .catalog-song-actions{grid-column:3;grid-row:1/5;display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.online-catalog-page .catalog-song .catalog-song-actions .btn{grid-column:auto;grid-row:auto;margin:0}
.online-catalog-page .catalog-song .catalog-play{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex-shrink:0;background:#fff3ee;color:#c64e61;border-color:#f2bdc1;padding-inline:14px}
@media(min-width:1000px){.online-catalog-page .catalog-results>.svc-catalog .catalog-song .catalog-song-actions{grid-column:1/-1;grid-row:auto;margin-top:4px}}
@media(max-width:999px){.online-catalog-page .catalog-song .catalog-song-actions{grid-column:2;grid-row:auto;margin-top:4px}}

/* Purchase dialog: a quiet zone and fixed aspect ratio preserve QR scanability. */
.service-payment-dialog.modal{height:min(550px,calc(100dvh - 16px));width:460px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
.service-payment-dialog .modal-titlebar{position:relative;justify-content:center;min-height:46px;padding:8px 48px}
.service-payment-dialog .modal-titlebar h2{font-size:1.285714rem;text-align:center;overflow-wrap:anywhere}
.service-payment-dialog .modal-titlebar>.icon-btn{position:absolute;right:8px;top:7px;width:32px;height:32px;min-width:32px}
.service-payment-dialog.modal>.modal-content{padding:12px 18px;scrollbar-gutter:auto}
.payment-dialog{display:grid;gap:8px;text-align:center;max-width:420px;margin:0 auto;overflow-wrap:anywhere}
.payment-dialog p{margin:0}
.payment-summary{display:flex;align-items:baseline;justify-content:center;gap:16px;min-width:0;color:var(--muted)}
.payment-dialog .payment-amount{font-size:2rem;line-height:1.2;color:var(--text)}
.payment-dialog .svc-qr{width:min(240px,calc(100dvh - 310px),calc(100vw - 68px));aspect-ratio:1;margin:0 auto;background:#fff;display:grid;place-items:center;border:1px solid var(--border);border-radius:10px;padding:8px}
.payment-dialog .svc-qr svg{display:block;width:100%;height:100%;fill:#000}
.payment-dialog .payment-channel{font-size:0.857143rem;line-height:18px;font-weight:600;color:var(--text)}
.payment-dialog .payment-hint{font-size:0.785714rem;line-height:1.5}
.payment-dialog [data-payment-feedback]:empty{display:none}
.payment-dialog [data-payment-feedback]:not(:empty){padding:6px 8px;font-size:0.785714rem;line-height:1.5}
.payment-dialog .modal-footer{position:static;margin:0;padding:8px 0 0;border-top:1px solid var(--border)}
.payment-dialog .modal-footer .btn{min-height:36px;padding:7px 12px}
@media(max-height:440px) and (min-width:480px){.service-payment-dialog.modal{width:560px}.service-payment-dialog .modal-titlebar{min-height:40px;padding-block:5px}.service-payment-dialog .modal-titlebar>.icon-btn{top:4px}.service-payment-dialog.modal>.modal-content{padding:10px 14px}.payment-dialog{max-width:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:6px 14px}.payment-dialog .svc-qr{grid-column:1;grid-row:1/6;width:min(210px,calc(100dvh - 84px),calc(50vw - 38px))}.payment-dialog>:not(.svc-qr){grid-column:2}.payment-dialog .payment-amount{font-size:1.714286rem}.payment-summary{gap:10px}.payment-dialog .modal-footer{padding-top:6px}}

/* Published songs stay inside the workbench playlist. */
.sunset-workbench .song-scroll.online-song-scroll{display:block;overflow-y:auto;max-height:none}
.playlist-online-toolbar{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;color:var(--muted)}
.sunset-workbench .online-song-row{display:grid;grid-template-columns:40px minmax(0,1fr);gap:6px 10px;width:auto;max-height:none;min-height:82px}
.sunset-workbench .online-song-row>.cover{grid-row:1/3;width:40px;height:46px;align-self:center}
.online-song-info{min-width:0;display:flex;flex-direction:column;gap:3px}
.online-song-info strong,.online-song-info small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.online-song-info strong{font-size:0.857143rem}.online-song-info small{font-size:0.714286rem;color:var(--muted)}
.online-song-actions{grid-column:2;display:flex;flex-wrap:wrap;gap:6px}
.sunset-workbench .online-song-actions .btn{min-height:28px;padding:4px 12px;font-size:0.785714rem;gap:4px}
@media(max-width:550px){.sunset-workbench .song-scroll.online-song-scroll{max-height:280px;min-height:144px}.sunset-workbench .online-song-row{margin-right:0}}

/* Keep inline control icons at the same size as their text. */
.sunset-workbench .performance-controls .gain-row>svg,
.sunset-workbench .performance-controls h3>svg,
.sunset-workbench .performance-controls .text-btn>svg,
.sunset-workbench .performance-controls .device-selector>svg,
.sunset-workbench .performance-controls .btn>svg{width:1em;height:1em}

/* Recording file actions remain available before and after importing audio. */
.recording-file-actions{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:12px}
.recording-file-actions .btn{flex:0 1 112px;min-width:0}
@media(max-width:480px){.recording-file-actions .btn{padding-inline:6px;gap:4px;white-space:nowrap}.recording-file-actions .btn svg{width:16px;height:16px;flex-shrink:0}}

/* Catalog: four desktop cards; cover left, title/time and actions right. */
.online-catalog-page .catalog-results>.svc-catalog.catalog-published{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:8px 10px;padding:10px;margin:0}
.online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song>.cover{grid-column:1;grid-row:1/3;width:48px;height:54px;margin:0}
.catalog-song-info{grid-column:2;grid-row:1;min-width:0;max-width:100%;overflow:hidden;display:flex;flex-direction:row;align-items:baseline;gap:8px}
.online-catalog-page .catalog-published .catalog-song-info h2{display:block;flex:0 1 auto;min-width:0;max-width:100%;margin:0;font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.online-catalog-page .catalog-song-info .catalog-duration{flex:none;margin-inline-start:0;font-size:0.785714rem;color:var(--muted)}
.online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song-actions{grid-column:2;grid-row:2;display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px;margin:0;min-width:0}
.online-catalog-page .catalog-published .catalog-song-actions .btn{grid-column:auto;grid-row:auto;flex:1 1 64px;min-width:0;max-width:none;min-height:30px;margin:0;padding:5px 10px;white-space:nowrap;justify-content:center}
/* Keep the load status at the bottom of short catalogs, after long lists. */
.main[data-page=service]>.online-catalog-page{display:flex;flex-direction:column}
.online-catalog-page .sunset-catalog-layout{display:flex;flex-direction:column;flex:1 0 auto;gap:0}
.online-catalog-page .catalog-results{display:flex;flex-direction:column;flex:1 0 auto;width:100%;min-width:0}
.online-catalog-page .catalog-published{flex:none}
.online-catalog-page .catalog-load-status{margin-top:auto;padding-top:18px;min-height:36px;flex:none;color:var(--muted)}
@media(min-width:651px) and (max-width:999px){
 .online-catalog-page .catalog-results>.svc-catalog.catalog-published{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:650px){
 .online-catalog-page .catalog-results>.svc-catalog.catalog-published{grid-template-columns:minmax(0,1fr)}
 .online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song{grid-template-columns:42px minmax(0,1fr);gap:6px 10px}
 .online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song>.cover{width:42px;height:48px}
 .online-catalog-page .catalog-results>.svc-catalog.catalog-published .catalog-song-actions{grid-column:2;grid-row:2;justify-content:flex-start}
}


/* Shared preview transport uses real media state and survives ordinary navigation. */
.global-song-search{display:flex;align-items:center;gap:9px;min-width:0}
.global-song-search input{width:100%;min-width:0;padding:0;border:0;background:transparent;color:var(--text);font:inherit;outline:none}
.global-song-search input::placeholder{color:var(--muted)}
.sunset-workbench .online-song-info{display:flex;flex-direction:row;align-items:baseline;gap:8px;min-width:0;max-width:100%;overflow:hidden}
.online-song-info strong{display:block;flex:0 1 auto;min-width:0;max-width:100%}.online-song-info time{flex:none;font-size:0.714286rem;color:var(--muted);white-space:nowrap}
/* Bound every title container so the ellipsis also stays inside its card. */
.sunset-workbench .current-track-info>div{min-width:0;max-width:100%;width:100%}
.sunset-workbench .song-select>span{max-width:100%;overflow:hidden}
.sunset-workbench .current-track-title h3,
.sunset-workbench .song-select strong{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.has-global-preview .app-stage{padding-bottom:88px}
.floating-preview.global-preview{position:fixed;left:166px;right:16px;bottom:14px;transform:none;width:auto;max-width:none;display:flex;align-items:center;justify-content:flex-start;gap:16px;padding:12px 16px;border:1px solid var(--border);border-radius:20px;background:#fffcfb;box-shadow:0 6px 28px #42243d20;z-index:30;color:var(--text)}
.global-preview audio[hidden]{display:none}
.global-preview-song{display:flex;align-items:center;gap:10px;min-width:0;flex:0 1 240px}
.global-preview-song strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:0.928571rem}
.global-preview-art{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:13px;color:#ff6b70;background:linear-gradient(135deg,#ffe8df,#f2e5ff)}
.global-preview .global-preview-toggle{background:var(--sunset);color:white;border-radius:50%;width:38px;min-width:38px;height:38px}
.global-preview-progress{display:flex;align-items:center;gap:10px;flex:1;min-width:0;font-size:0.785714rem;color:var(--muted);font-variant-numeric:tabular-nums}
.global-preview-progress input{flex:1;width:100%;min-width:40px}.global-preview-progress time{white-space:nowrap}
.global-preview-volume{display:flex;align-items:center;gap:6px;flex:0 0 110px}.global-preview-volume input{width:80px;min-width:0}
.modal-content>.global-preview{position:static;transform:none;margin-top:16px;flex-wrap:wrap}.modal-content>.global-preview .global-preview-progress{flex-basis:100%}
@media(max-width:850px){.floating-preview.global-preview{left:92px;gap:10px}.global-preview-volume{display:none}.global-preview-song{flex-basis:180px}}
@media(max-width:550px){body.has-global-preview .app-stage{padding-bottom:118px}.floating-preview.global-preview{left:66px;right:8px;bottom:8px;padding:10px;gap:8px;flex-wrap:wrap;border-radius:16px}.global-preview-song{flex:1;max-width:calc(100% - 90px)}.global-preview-art{width:30px;height:30px}.global-preview-progress{order:5;flex-basis:100%}.global-preview-song strong{font-size:0.785714rem}.global-preview .icon-btn{min-width:30px;width:30px}.global-preview .global-preview-toggle{width:34px;min-width:34px;height:34px}}
/* Keep the selectable waveform and its highlight aligned at every editor height. */
.recording-sunset [data-recording-selection]{touch-action:none;user-select:none;cursor:crosshair}
.recording-sunset [data-recording-selection][aria-disabled=true]{cursor:default}
.recording-sunset [data-recording-selection]>.ruler{top:5px;left:8px;right:8px;padding:0;line-height:14px;pointer-events:none}
.recording-sunset [data-recording-selection]>.editor-waveform{position:absolute;inset:24px 0 10px;width:100%;height:auto;padding:0;margin:0}
.recording-sunset [data-recording-selection]>.editor-waveform>svg{height:100%;width:100%}
.recording-sunset [data-recording-selection]>.selection-area{top:24px;bottom:10px;overflow:visible}
.recording-sunset .selection-handle{position:absolute;top:0;bottom:0;width:14px;pointer-events:auto;cursor:ew-resize;touch-action:none}
.recording-sunset .selection-start{left:-1px}
.recording-sunset .selection-end{right:-1px}
.recording-sunset .selection-handle::after{content:"";position:absolute;top:calc(50% - 9px);width:4px;height:18px;border-radius:3px;background:#aa6cd2;box-shadow:0 0 0 1px #fff}
.recording-sunset .selection-start::after{left:1px}
.recording-sunset .selection-end::after{right:1px}
.recording-sunset .selection-handle:focus-visible{outline:2px solid #8c53b1;outline-offset:-2px}
.recording-sunset .record-controls{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:699px){.recording-sunset .record-controls{grid-template-columns:repeat(3,minmax(0,1fr))}}

.titlebar .global-song-search{width:260px;flex:0 1 260px;min-width:0;min-height:36px;height:36px;padding:0 12px;justify-content:flex-start;border:1px solid var(--border);background:#ffffff80}
.titlebar .global-song-search>svg{flex:none;width:16px;height:16px}
.titlebar .global-song-search input[type=search]{height:32px;min-height:0;padding:0;background:transparent;border:0;box-shadow:none;outline:none}
.titlebar .global-song-search:focus-within{border-color:var(--primary)}
@media(max-width:550px){.titlebar .global-song-search{flex:1 0 160px;min-width:160px;max-width:100%;width:auto;padding:0 10px;gap:6px;font-size:0.857143rem}.titlebar .window-actions{flex-shrink:0}.titlebar .global-song-search input{font-size:0.857143rem}}

/* Recording input stays at the right of the heading; the editor uses the full row. */
.recording-sunset .editor-layout{grid-template-columns:minmax(0,1fr)}
.recording-sunset .page-title{gap:12px;flex-wrap:wrap;align-items:center}
.recording-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0;margin-left:auto}
.recording-sunset .recording-input-device{margin:0;width:clamp(180px,22vw,280px);min-width:0}
.recording-input-device>span{font-size:0.857143rem}
.recording-input-device select{width:100%;min-width:0;text-overflow:ellipsis}
@media(max-width:650px){
 .recording-heading-actions{width:100%;justify-content:space-between}
 .recording-sunset .recording-input-device{flex:1;width:auto;max-width:280px}
}

/* Recording microphone input: rounded control and warm themed open list. */
.recording-sunset .recording-input-device .device-selector{width:100%;max-width:100%;min-height:36px;padding:7px 11px;border:1px solid #e8ddeb;border-radius:11px;background:#faf6fb;color:#675570;font:inherit;font-size:0.857143rem;line-height:1.4;cursor:pointer;transition:border-color .16s,background .16s}
.recording-sunset .recording-input-device .device-selector:hover:not(:disabled){border-color:#c5a3d6;background:#f6eef9}
.recording-sunset .recording-input-device .device-selector:focus-visible{border-color:#ac7dc4}
.recording-sunset .recording-input-device .device-selector:disabled{cursor:default;color:#9b8b9f;background:#f8f5f8}
@supports (appearance:base-select){
 .recording-sunset .recording-input-device .device-selector,.recording-sunset .recording-input-device .device-selector::picker(select){appearance:base-select}
 .recording-sunset .recording-input-device .device-selector>button{display:flex;min-width:0;width:100%;align-items:center;gap:8px;font:inherit;color:inherit;text-align:left}
 .recording-sunset .recording-input-device .device-selector selectedcontent{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .recording-sunset .recording-input-device .device-selector::picker-icon{content:"";width:6px;height:6px;border-right:1.5px solid #a17ab2;border-bottom:1.5px solid #a17ab2;rotate:45deg;translate:0 -2px;margin-inline-start:8px;transition:rotate .16s;flex:none}
 .recording-sunset .recording-input-device .device-selector:open{border-color:#bb95ce;background:#fffafd}
 .recording-sunset .recording-input-device .device-selector:open::picker-icon{rotate:225deg;translate:0 2px}
 .recording-sunset .recording-input-device .device-selector::picker(select){box-sizing:border-box;width:min(328px,calc(100vw - 24px));min-width:anchor-size(width);max-height:min(320px,60vh);inset-inline-start:auto;inset-inline-end:anchor(right);inset-block-start:calc(anchor(bottom) + 6px);inset-block-end:auto;position-try-fallbacks:flip-block;margin-block:0;padding:6px;border:1px solid #e9ddeb;border-radius:14px;background:#fffafd;color:#65516e;box-shadow:0 12px 32px #4c285426,0 2px 6px #4c28540a;overflow:auto;scrollbar-width:thin;scrollbar-color:#d4bedf transparent}
 .recording-sunset .recording-input-device .device-selector option{display:flex;align-items:center;gap:12px;min-height:40px;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:#6d5a76;font:inherit;font-size:0.857143rem;line-height:1.5;white-space:normal;overflow-wrap:anywhere;cursor:pointer}
 .recording-sunset .recording-input-device .device-selector option:disabled{display:none}
 .recording-sunset .recording-input-device .device-selector option:hover,.recording-sunset .recording-input-device .device-selector option:focus-visible{background:#f6eef9;outline:none}
 .recording-sunset .recording-input-device .device-selector option:checked{background:#eee2f5;color:#80519a;font-weight:600}
 .recording-sunset .recording-input-device .device-selector option::checkmark{order:2;margin-inline-start:auto;color:#a16db8;font-size:1rem;flex:none}
}
@media(prefers-reduced-motion:reduce){.recording-sunset .recording-input-device .device-selector,.recording-sunset .recording-input-device .device-selector::picker-icon{transition:none}}

@media(max-width:650px){
 .recording-sunset .page-title{align-items:stretch}
 .recording-sunset .recording-heading-actions{align-self:stretch;margin-left:0;justify-content:flex-end}
 .recording-sunset .recording-input-device{flex:none;width:min(280px,100%);max-width:100%}
 .recording-sunset .recording-input-device .device-selector::picker(select){width:anchor-size(width);min-width:anchor-size(width)}
}


/* Current tab text search keeps form controls intact. */
::highlight(tab-search){background:#ffe59b;color:#392246}
.global-search [data-tab-search-status]{flex-shrink:0;font-size:0.785714rem;white-space:nowrap}
.global-search:has([data-tab-search]){min-width:0}

/* Device controls belong to the audio tab; fill the two remaining columns. */
@media(min-width:801px){
 [data-settings-section=appearance] .appearance-grid.appearance-deduplicated{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:800px){
 [data-settings-section=appearance] .appearance-grid.appearance-deduplicated{grid-template-columns:minmax(0,1fr)}
}

/* Payment preparation stays in the fixed-size dialog. */
body:has(.service-payment-dialog[open]) .svc-loading{display:none}
.payment-dialog .payment-loading{grid-column:1/-1;padding:60px 0;color:var(--muted)}


/* Let the preview grow with the user's lyric size and line count. */
[data-settings-section=appearance] .appearance-preview-card .lyric-preview{height:auto;min-height:120px;aspect-ratio:auto}
[data-settings-section=appearance] .lyric-preview>div{min-width:0}
[data-settings-section=appearance] .lyric-preview p{font-size:.7em}