/* UI01–25 content surfaces and UI26 shared navigation. Preserve user artwork. */
:root{--canvas:#f4f8f9}
.nav-list{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin}
.sidebar .nav-group{flex:none;margin:5px 0;border-top:1px solid #ffffff20;padding-top:5px}
.nav-group>summary{display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 16px;list-style:none;color:#d1e8e4;font-size:0.928571rem;cursor:pointer}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary>span{flex:1}
.nav-group[open]>summary>svg:last-child{transform:rotate(180deg)}
.nav-group>summary:focus-visible{outline:2px solid #38e0bd;outline-offset:-2px}
.nav-group-items{padding-bottom:6px}
.sidebar .nav-group .nav-item{width:100%;padding-left:23px;font-size:0.857143rem;min-height:37px}
.sidebar .nav-group .nav-art{width:22px;height:22px;flex-basis:22px}
.sidebar .sidebar-bottom{flex:none;padding:8px 12px}
.sidebar-promo{display:none}
.svc-shell.svc-page{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;min-height:100%;align-content:start}
.svc-page h2{font-size:1.357143rem;line-height:1.45}
.svc-page h3{font-size:1.142857rem;line-height:1.5}
.svc-page .svc-card{box-shadow:none;background:#fff}
.svc-account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.svc-account-grid>.svc-card{margin:0;min-width:0}
.svc-account-grid .field{margin:10px 0}
.svc-page .svc-metrics{margin-bottom:18px}
.svc-metrics>div{padding:14px 18px;background:#f5faf9}
.svc-metrics strong{font-size:1.571429rem}
.merged-service-page .svc-metrics{gap:12px;margin-bottom:16px}
.merged-service-page .svc-metrics>div{padding:10px 14px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.merged-service-page .svc-metrics strong{font-size:1.428571rem}
.merged-service-page .svc-metrics span{margin-left:auto}
.merged-service-page .svc-account-grid>.svc-card{margin-bottom:0}
.merged-service-page .svc-account-grid{margin-bottom:16px}
.member-intro{margin:0 0 18px;color:var(--muted);line-height:1.7}
.service-disclosure{margin-top:12px;padding:0;border:1px solid var(--border);border-radius:10px;min-width:0}
.service-disclosure>summary{padding:15px 18px;cursor:pointer;font-size:1.071429rem;font-weight:600;line-height:1.5;color:var(--text)}
.service-disclosure>summary:focus-visible{outline:2px solid var(--primary);outline-offset:-3px;border-radius:10px}
.service-disclosure[open]>summary{border-bottom:1px solid var(--border)}
.service-disclosure-body{padding:16px;min-width:0}
.service-disclosure-body>.svc-card:last-child,.service-disclosure-body>.svc-account-grid{margin-bottom:0}
.merged-service-page .local-backup-section{margin-top:8px}
.merged-service-page .local-backup-section>.merged-section-title,.merged-service-page .backup-layout>div>h3{display:none}
.merged-service-page .sync-page .sync-section{padding:16px}
.merged-service-page .sync-page .sync-section h2{font-size:1.285714rem}
.merged-service-page .sync-page .sync-section>p{margin:6px 0 12px}
.merged-service-page .backup-layout{gap:12px}
.merged-service-page .backup-layout .checkbox-line{margin-block:8px}
.settings-advanced{border-top:1px solid var(--border);margin-top:12px;padding-top:4px;min-width:0}
.settings-advanced>summary{padding:10px 0;cursor:pointer;color:var(--primary);font-weight:600;line-height:1.5}
.settings-advanced[open]>summary{margin-bottom:8px}
.settings-advanced p{font-size:0.857143rem;line-height:1.7}
.settings-advanced .settings-section{margin:0}
.catalog-demo-tools{margin:0 0 16px;border-bottom:1px solid var(--border);border-top:0}
.online-catalog-page .catalog-heading{padding-bottom:16px;border-bottom:1px solid var(--border)}
.online-catalog-page .catalog-empty{min-height:clamp(240px,52dvh,520px)}
.catalog-published{grid-template-columns:minmax(0,1fr);gap:0}
.catalog-published .catalog-song{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:4px 18px;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:18px 0;margin:0;align-items:center}
.catalog-published .catalog-song>.cover{grid-row:1/5;width:72px;height:72px;object-fit:cover}
.catalog-published .catalog-song h2,.catalog-published .catalog-song p{grid-column:2;margin:0}
.catalog-published .catalog-song .btn{grid-column:3;grid-row:1/5;align-self:center;margin:0}
.settings-columns>.inspector{align-self:start}
[data-settings-section=follow] .setting-slider{padding-block:8px}
[data-settings-section=follow] .gate-preview{padding:14px 20px;min-height:76px}
[data-settings-section=follow] .settings-section{margin-top:8px;margin-bottom:8px;padding-bottom:4px}
[data-settings-section=follow] .settings-advanced{padding-bottom:0}
[data-settings-section=follow] .settings-section .setting-row{padding-block:6px}
@media(min-width:1280px){
 .page-title h1,.page-heading h1{font-size:2rem}
 .page-title p,.page-heading p{font-size:1rem}
 .settings-content[data-settings-section=follow]{padding-top:20px}
}
@media(max-height:800px) and (min-width:701px){
 .sidebar .nav-item,.nav-group>summary{min-height:35px;padding-top:6px;padding-bottom:6px}
 .sidebar .nav-subitem{min-height:30px;padding-top:5px;padding-bottom:5px}
 .sidebar-brand{height:50px}
 .sidebar .sidebar-bottom{font-size:0.714286rem}
}
@media(max-width:1000px){.svc-account-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
 .nav-group>summary{justify-content:center;padding:8px 4px}
 .nav-group>summary>span,.nav-group>summary>svg:last-child{display:none}
 .sidebar .nav-group .nav-item{padding:8px 4px;justify-content:center}
 .svc-shell.svc-page{padding:14px}
 .catalog-published .catalog-song{grid-template-columns:52px minmax(0,1fr);gap:6px 12px}
 .catalog-published .catalog-song>.cover{width:52px;height:52px;grid-row:1/3}
 .catalog-published .catalog-song .btn{grid-column:2;grid-row:auto;justify-self:start;margin-top:6px}
}
