#demoBanner { display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:9px 24px; background:var(--surface); border-bottom:1px solid var(--border); color:var(--muted); font-size:12px; }
.demo-mode { color:var(--accent-text); background:var(--selected-bg); padding:3px 9px; border-radius:5px; font-weight:600; }
.demo-banner-actions { display:flex; align-items:center; gap:16px; margin-left:auto; }
#demoBanner a { color:var(--accent-text); text-decoration:none; }
#demoReset { padding:4px 9px; font-size:12px; }
#demoBanner .demo-banner-notice { flex:1; min-width:180px; }
#demoTip { color:var(--muted); font-size:12px; padding:5px 24px; border-bottom:1px solid var(--border); margin:0; background:var(--sidebar); }
#appShell .user-menu, #accountDialog, #authScreen, #importDialog, #logoLinkPanel, #logoUploadPanel,
#tabUpload, #tabLink, #uploadLogoButton, #managerUpload, #pickerManageLogos, #preferencesDialog .setting-row:has(#accountSettings),
#preferencesDialog .setting-row:has(#backup), #preferencesDialog .setting-row:has(#restore),
.library-logo-actions, input[type="file"], #headerUpdate { display:none !important; }
#appShell { height:calc(100dvh - var(--demo-top-height,80px)); min-height:0; }
#appShell .layout { min-height:0; }
#demoSampleDialog { width:min(520px,calc(100vw - 24px)); }
#demoSampleDialog p { color:var(--muted); font-size:13px; line-height:1.7; }
#demoSampleDialog footer { margin-top:24px; }
#demoSampleChoice { margin-top:16px; }
@media(max-width:700px) {
 #demoBanner { gap:7px 10px; padding:8px 12px; }
 #demoBanner .demo-banner-notice { flex-basis:65%; }
 .demo-banner-actions { margin-left:0; }
 #demoTip { padding:8px 12px; }

}