:root { --admin-sidebar-width:264px; --admin-sidebar-motion:360ms cubic-bezier(.22,1,.36,1); }
html:has(body.app) { overflow-x:clip!important; overflow-y:auto; scrollbar-color:#8a909c #f4f5fa; }
html:has(body.app.dark-mode) { background:#090a0d; scrollbar-color:#575b65 #090a0d; color-scheme:dark; }
html:has(body.app)[data-admin-drawer-open] { overflow:hidden!important; }
body.app { overflow-x:clip!important; overflow-y:visible; }
body.app.dark-mode { scrollbar-color:#575b65 #090a0d; }
html:has(body.app)::-webkit-scrollbar { width:12px; height:12px; }
html:has(body.app)::-webkit-scrollbar-track { background:#f4f5fa; }
html:has(body.app)::-webkit-scrollbar-thumb { background:#8a909c; border:2px solid #f4f5fa; border-radius:6px; }
html:has(body.app.dark-mode)::-webkit-scrollbar-track { background:#090a0d; }
html:has(body.app.dark-mode)::-webkit-scrollbar-thumb { background:#575b65; border-color:#090a0d; }
:root[data-admin-rail="collapsed"] { --admin-sidebar-width:72px; }
body.app #adminSidebarToggle { border:0; background:transparent; cursor:pointer; }
@media(min-width:992px) { body.app #adminSidebarToggle { display:none!important; } }
#adminSidebar .admin-rail-toolbar { display:flex; align-items:center; gap:8px; flex:none; height:58px; margin:0 12px; border-bottom:1px solid var(--border,#282b32); overflow:hidden; }
#adminRailToggle { display:grid; place-items:center; flex:0 0 48px; height:38px; padding:0; border:0; border-radius:9px; background:transparent; color:var(--text2,#bcc2d1); cursor:pointer; }
#adminRailToggle:hover { background:var(--surface2,#1a1e26); color:var(--text,#fff); }
#adminRailToggle:focus-visible { outline:2px solid var(--accent,#3b82f6); outline-offset:-2px; }
#adminSidebar .admin-rail-toolbar span { font-size:12px; font-weight:600; color:var(--text2,#bcc2d1); white-space:nowrap; user-select:none; }
:root[data-admin-rail="collapsed"] #adminRailToggle .admin-rail-direction { transform:translateX(29px) scaleX(-1); }
body.app #adminSidebar {
  position:fixed; inset:var(--topbar-h,64px) auto 0 0; z-index:90!important;
  display:flex; flex-direction:column; width:var(--admin-sidebar-width); height:auto;
  margin:0; padding:0!important; overflow:hidden; transform:none;
  background:var(--surface,#111318); color:var(--text,#fff);
  border:0; border-right:1px solid var(--border,#282b32); box-shadow:none;
  font-family:Inter,"Segoe UI",sans-serif;
}
body.app #adminPanel .main-content.app-content { margin-inline-start:var(--admin-sidebar-width)!important; margin-inline-end:0!important; transition:none; }
:root[data-admin-sidebar-ready] body.app #adminSidebar { transition:width var(--admin-sidebar-motion),transform var(--admin-sidebar-motion); }
:root[data-admin-sidebar-ready] body.app #adminPanel .main-content.app-content { transition:margin-inline-start var(--admin-sidebar-motion); }
#adminSidebar .admin-rail-scroll { flex:1; min-height:0; overflow:auto; overflow-x:hidden; padding:12px 0; scrollbar-width:thin; scrollbar-color:var(--border2,#3c414b) transparent; }
#adminSidebar .admin-rail-group { margin:0 0 var(--admin-rail-gap,16px); padding:0 12px; }
#adminSidebar .admin-rail-group:last-child { margin-bottom:0; }
#adminSidebar .admin-rail-heading { height:28px; margin:0; padding:0 0 0 56px; overflow:hidden; white-space:nowrap; font-size:11px; font-weight:600; line-height:28px; letter-spacing:.08em; text-transform:uppercase; color:var(--text3,#8b93a3); }
#adminSidebar .admin-rail-list { list-style:none; margin:0; padding:0; }
#adminSidebar .admin-rail-list li { margin:2px 0; padding:0; }
body.app #adminSidebar .admin-rail-link {
  display:grid; grid-template-columns:48px max-content; align-items:center; gap:8px;
  height:var(--admin-rail-row-height,44px); width:100%; margin:0; padding:0; overflow:hidden; border:0;
  border-radius:10px; background:transparent; color:var(--text,#fff);
  font-size:14px; font-weight:500; line-height:20px; text-decoration:none;
  white-space:nowrap; user-select:none; transition:background-color 150ms,color 150ms;
}
body.app #adminSidebar .admin-rail-link:hover { background:var(--surface2,#1a1e26); }
body.app #adminSidebar .admin-rail-link.active { background:rgba(59,130,246,.16)!important; color:#87b4ff!important; box-shadow:none; }
body.app.light-mode #adminSidebar .admin-rail-link.active { background:rgba(37,99,235,.11)!important; color:#1d4ed8!important; }
body.app #adminSidebar .admin-rail-link:focus-visible { outline:2px solid var(--accent,#3b82f6); outline-offset:-2px; }
#adminSidebar .admin-rail-icon { display:block; justify-self:center; width:20px; height:20px; margin:0; stroke-width:1.8; pointer-events:none; }
#adminSidebar .admin-rail-label { display:block; width:max-content; white-space:nowrap; }
#adminSidebar .admin-rail-profile { display:grid; grid-template-columns:48px max-content; gap:8px; align-items:center; flex:none; height:72px; margin:0 12px; border-top:1px solid var(--border,#282b32); overflow:hidden; }
#adminSidebar .admin-rail-profile img { width:28px; height:28px; object-fit:cover; border-radius:50%; justify-self:center; }
#adminSidebar .admin-rail-profile-name { max-width:184px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; line-height:20px; font-weight:500; }
#adminSidebar .admin-rail-profile-role { max-width:184px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; line-height:18px; color:var(--text3,#8b93a3); }
#adminSidebarBackdrop { display:none; }
@media(max-width:991px) {
  #adminSidebar .admin-rail-toolbar { display:none; }
  body.app #adminSidebar { width:min(280px,calc(100vw - 56px))!important; transform:translateX(-100%); z-index:110!important; }
  body.app #adminPanel .main-content.app-content { margin-inline-start:0!important; }
  #adminSidebarBackdrop { display:block; position:fixed; inset:var(--topbar-h,64px) 0 0; z-index:105; background:rgba(0,0,0,.45); opacity:0; visibility:hidden; pointer-events:none; transition:opacity var(--admin-sidebar-motion),visibility var(--admin-sidebar-motion); }
  :root[data-admin-drawer-open] body.app #adminSidebar { transform:translateX(0); }
  :root[data-admin-drawer-open] #adminSidebarBackdrop { opacity:1; visibility:visible; pointer-events:auto; }
  :root[data-admin-drawer-open] body { overflow:hidden; }
}
@media(prefers-reduced-motion:reduce) {
  :root[data-admin-sidebar-ready] body.app #adminSidebar,
  :root[data-admin-sidebar-ready] body.app #adminPanel .main-content.app-content,
  #adminSidebarBackdrop,body.app #adminSidebar .admin-rail-link { transition:none; }
}

html:has(#adminPanel) { scroll-behavior: auto; }
body.app { font-size: 14px; }
body.app.light-mode { --text2: #535c70; --text3: #606a7b; }
body.app :is(.tab-panel,.app-header,#adminSidebar,.modal-card,.dropdown-menu) :is(p,span,label,small,td,th,input,select,textarea,button,a,h6,.text-muted,.fs-11,.fs-12,.fs-13) { font-size: max(14px, 1em); }
body.app :is(.tab-panel,.app-header,#adminSidebar,.modal-card,.dropdown-menu) :is([style*="font-size:11"],[style*="font-size:12"],[style*="font-size:13"],[style*="font-size: 11"],[style*="font-size: 12"],[style*="font-size: 13"],[style*="font-size:.6"],[style*="font-size:.7"],[style*="font-size:.8"],[style*="font-size:0.6"],[style*="font-size:0.7"],[style*="font-size:0.8"]) { font-size: 14px !important; }
body.app :is(.tab-panel,.app-header,#adminSidebar,.modal-card,.dropdown-menu) :is(.text-muted,small) { color: var(--text2) !important; }
body.app #adminSidebar :is(.admin-rail-profile-name,.admin-rail-profile-role,.admin-rail-heading), body.app footer, body.app footer span { font-size: 14px !important; }
body.app.light-mode .btn-secondary { background: #fff !important; color: #374151 !important; border-color: #c6ccd6 !important; }
body.app.light-mode .btn-secondary:hover { background: #edf1f7 !important; }
body.app.light-mode .btn-secondary :is(span,svg) { color: inherit !important; }
body.app .tab-panel { animation: none !important; }
body.app .tab-panel > .page-header { margin-bottom: 24px; }
body.app .tab-panel > :is(.card,.cd-settings-card,.table-container) { margin-bottom: 24px; }
body.app :is(.alert,.notice,.notification) { border-left-width: 1px !important; border-left-color: var(--border) !important; }
body.app #themeToggle { position: relative; min-width: 40px; min-height: 40px; }
body.app #themeToggle :is(#themeIconMoon,#themeIconSun) { display: block !important; position: absolute; width: 20px; height: 20px; transition: opacity 220ms ease, transform 220ms ease; transform-origin: center; }
body.app.light-mode #themeIconSun, body.app.dark-mode #themeIconMoon { opacity: 0; transform: rotate(-75deg) scale(.55); pointer-events: none; }
body.app.light-mode #themeIconMoon, body.app.dark-mode #themeIconSun { opacity: 1; transform: rotate(0) scale(1); }
#adminUserSearchForm { margin: 0; max-width: 100%; }
#adminUserSearchForm input { max-width: 100%; }
body.app :is(.fs-11,.fs-12,.fs-13,.text-sm,.page-subtitle,.cd-empty-description) { font-size: 14px !important; }
body.app .tab-panel :is(.stat-label,.ai-card-sub,.ai-hint,.qs-label,.transfer-refresh-state,.cd-form-hint,.announcement-preview-title,.settings-saved,code) { font-size: 14px !important; }
body.app .admin-floating-menu { position: fixed !important; inset: auto; right: auto !important; margin: 0 !important; min-width: 0 !important; overflow: auto !important; overscroll-behavior: contain; user-select: none; z-index: 10000; }
body.app .admin-floating-menu button { font-size: 14px !important; }
body.app .announcement-editor-grid, body.app .announcement-preview-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
body.app .announcement-preview-text { white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; min-height: 60px; }
body.app .announcement-feedback:not(:empty) { margin-bottom: 16px; padding: 12px; border: 1px solid var(--border); border-radius: 8px; }
body.app .announcement-status, body.app .announcement-published-at { color: var(--text2); font-size: 14px; }
body.app .announcement-actions { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; }
@media(max-width:600px) { body.app .announcement-editor-grid, body.app .announcement-preview-grid { grid-template-columns: minmax(0,1fr); } }
@media(prefers-reduced-motion:reduce) {
  body.app #themeToggle svg { transition: none !important; }
}
