/* Portal frame and application catalogue, aligned to the compact dark reference. */
.app-shell { min-height: 100dvh; grid-template-columns: 250px minmax(0,1fr); padding: 0 14px 10px; }
.sidebar { display:flex; flex-direction:column; gap:8px; height:calc(100dvh - 10px); padding:14px 10px 12px; border-radius:14px 0 0 14px; }
.brand { min-height:38px; padding:0 44px 4px 2px; }
.brand-mark { width:36px; height:36px; }
.brand h1 { font-size:14px; }
.brand p { font-size:10px; margin-top:2px; }
.sidebar-search { display:flex; align-items:center; gap:10px; height:36px; padding:0 10px; border:1px solid var(--border); border-radius:8px; color:var(--muted); }
.sidebar-search input { width:100%; min-width:0; padding:0; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:12px; }
.sidebar-search input:focus-visible { outline:0; }
.side-label { margin-top:10px; font-size:9px; letter-spacing:.14em; color:#778193; }
.sidebar > .file-item { min-height:38px; padding:5px 7px; gap:8px; }
.sidebar > .file-item .file-icon { width:28px; height:28px; border-radius:7px; }
.sidebar > .file-item .title { font-size:11px; font-weight:650; }
.sidebar > .file-item .file { font-size:9px; }
.side-count { color:var(--muted); font-size:10px; }
#fileMenu { margin-top:0; gap:3px; overflow:auto; align-content:start; grid-auto-rows:max-content; }
#fileMenu { min-height:0; flex:1 1 auto; }
#fileMenu .file-item { min-height:42px; padding:5px 7px; gap:8px; }
#fileMenu .file-item[draggable="true"] { cursor:grab; }
#fileMenu .file-item.is-dragging { opacity:.4; }
#fileMenu .file-item.drop-target { box-shadow:inset 0 2px #8cb5ff; }
#fileMenu .favorite-drag-handle { color:#697384; font-size:16px; line-height:1; cursor:grab; }
#fileMenu .file-item:hover .favorite-drag-handle { color:#cbd6e7; }
#fileMenu .file-icon { width:28px; height:28px; border-radius:7px; }
#fileMenu .title { font-size:11px; }
#fileMenu .file { font-size:9px; }
.workspace { padding:0; }
.viewer { min-height:calc(100dvh - 58px); height:calc(100dvh - 58px); overflow:auto; border:1px solid var(--border); border-top:0; border-left:0; border-radius:0 0 14px 0; background:var(--bg); }
.workspace-bar { z-index:5; height:48px; display:flex; align-items:center; justify-content:space-between; padding:0 20px; border:1px solid var(--border); border-bottom-color:var(--border); border-left:0; border-radius:0 14px 0 0; background:#101216; color:var(--muted); font-size:10px; }
.workspace-bar > div:first-child { display:flex; align-items:center; gap:10px; }
.workspace-bar > div:first-child span::after { content:'›'; padding-left:10px; color:#687180; }
.workspace-bar b { color:#e4e7ec; font-size:11px; }
.workspace-tools button { width:44px; min-height:44px; padding:4px; border:0; background:transparent; color:var(--muted); font-size:19px; }
.viewer iframe { height:calc(100dvh - 60px); min-height:500px; background:var(--bg); }
.catalog-page { padding:22px 26px 32px; color:var(--text); }
.catalog-kicker,.admin-kicker { margin-bottom:5px; color:#758094; font-size:9px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.catalog-page h1,.backup-panel h1 { font-size:23px; letter-spacing:-.04em; }
.admin-panel h1 { font-size:28px; letter-spacing:-.04em; }
.catalog-subtitle { margin:4px 0 18px; color:var(--muted); font-size:11px; }
.catalog-toolbar { display:flex; align-items:center; gap:8px; margin-bottom:18px; }
.catalog-search { display:flex; align-items:center; gap:10px; width:min(440px,45%); height:36px; padding:0 11px; border:1px solid var(--border); border-radius:8px; color:var(--muted); background:var(--card); }
.catalog-search input { min-width:0; width:100%; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:11px; }
.catalog-filter select { height:36px; min-width:126px; padding:0 10px; border:1px solid var(--border); border-radius:8px; background:var(--card); color:#dce1e9; font:inherit; font-size:10px; }
.catalog-spacer { flex:1; }
.catalog-view-toggle { display:flex; padding:3px; border:1px solid var(--border); border-radius:8px; }
.catalog-view-toggle button { width:28px; min-height:26px; padding:2px; border:0; border-radius:5px; color:var(--muted); background:transparent; }
.catalog-view-toggle button[aria-pressed=true] { background:#252a32; color:var(--text); }
.catalog-list-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:7px; }
.catalog-list-heading h2 { margin:0; font-size:13px; }
.catalog-list-heading p { margin:2px 0 0; color:var(--muted); font-size:9px; }
.catalog-total { color:var(--muted); font-size:9px; }
.catalog-results { overflow:hidden; border:1px solid var(--border); border-radius:9px; }
.catalog-card { min-height:60px; display:grid; grid-template-columns:36px minmax(0,1fr) 70px 30px 78px; align-items:center; gap:10px; padding:8px 11px; border-bottom:1px solid #252a32; background:#171a1f; cursor:pointer; }
.catalog-card:focus-visible { outline:2px solid #8cb5ff; outline-offset:-2px; }
.catalog-card:last-child { border-bottom:0; }
.catalog-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:#1d2b42; color:#8cb5ff; font-size:16px; overflow:hidden; }
.catalog-icon img { width:100%;height:100%;object-fit:cover; }
.catalog-copy { min-width:0; }
.catalog-name { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:700; }
.catalog-ready { display:inline-flex; align-items:center; gap:4px; color:#8fb89b; font-size:8px; font-weight:500; }
.catalog-ready i { width:5px;height:5px;border-radius:50%;background:#86c99a; }
.catalog-copy p { margin:3px 0 0; overflow:hidden; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.catalog-card time { color:var(--muted); font-size:9px; text-align:center; }
.catalog-card button { min-height:30px; padding:4px 8px; border:1px solid var(--border); border-radius:7px; color:#e0e4eb; background:#1b1f26; font:inherit; font-size:9px; font-weight:650; cursor:pointer; }
.catalog-card .catalog-star { width:30px; padding:0; border:0; background:transparent; color:#77808d; font-size:17px; }
.catalog-card .catalog-star.is-favorite { color:#d8bd5c; }
.catalog-empty { padding:30px; color:var(--muted); text-align:center; font-size:12px; }
.catalog-results.is-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:10px; padding:10px; border:0; overflow:visible; }
.catalog-results.is-grid .catalog-card { position:relative; grid-template-columns:36px 1fr 30px; border:1px solid var(--border); border-radius:9px; }
.catalog-results.is-grid .catalog-card time { display:none; }
.catalog-results.is-grid .catalog-card .catalog-star { grid-column:3; grid-row:1; }
.catalog-results.is-grid .catalog-open { grid-column:2 / 4; }
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap; }
@media(max-width:760px) {
 .app-shell { display:block; padding:0; }
 .sidebar { height:auto; position:relative; display:block; padding:4px 12px; border:0; border-radius:0; }
 .brand { min-height:40px; }
 .sidebar-search,#allAppsButton,.side-label,.sidebar-footer { display:none; }
 .mobile-menu-open .sidebar-search,.mobile-menu-open #allAppsButton { display:flex; }
 .mobile-menu-open .sidebar-footer { display:block; margin-top:8px; }
 #fileMenu { display:none; }
 .mobile-menu-open #fileMenu { display:grid; }
 .mobile-file-picker { min-height:44px; padding:6px 10px; }
 .workspace-bar { height:36px; }
 .viewer { height:auto; min-height:calc(100dvh - 84px); border:0; border-radius:0; }
 .catalog-page { padding:18px 14px; }
 .catalog-toolbar { flex-wrap:wrap; }
 .catalog-search { width:100%; }
 .catalog-card { grid-template-columns:34px minmax(0,1fr) 28px 70px; gap:7px; }
 .catalog-card time { display:none; }
 .catalog-results.is-grid { grid-template-columns:1fr; }
}
/* Administration page */
.admin-panel { min-height:calc(100dvh - 60px); padding:20px 24px 28px; color:var(--text); background:var(--bg); }
.admin-header { flex-direction:row; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:16px; }
.admin-header p { margin-top:5px; font-size:13px; }
.admin-panel .admin-kicker { margin-bottom:7px; font-size:10px; }
.admin-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:14px; }
.admin-stats article { display:grid; gap:4px; padding:13px 14px; border:1px solid var(--border); border-radius:8px; background:#171a1f; }
.admin-stats article span { color:var(--muted); font-size:12px; }
.admin-stats article small { color:var(--muted); font-size:11px; }
.admin-stats article strong { font-size:22px; line-height:1.15; }
.admin-toolbar { grid-template-columns:minmax(180px,1fr) auto auto; gap:8px; padding:4px 0 14px; border:0; }
.admin-panel :where(input:not([type=checkbox]),select) { min-height:42px; padding:9px 12px; border-color:var(--border); background:#171a1f; font-size:13px; }
.admin-search svg { top:9px; }
.admin-panel .admin-search input { padding-left:38px; }
.admin-list-top { display:none; }
.admin-list { border-color:var(--border); border-radius:9px; }
.admin-table { font-size:13px; }
.admin-table th { padding:11px 13px; background:#171a1f; font-size:12px; }
.admin-table td { padding:13px; border-color:#282d35; }
.admin-table th:first-child { width:42%; }
.admin-table th:nth-child(2),.admin-table th:nth-child(3) { width:18%; }
.admin-table th:nth-child(4) { width:16%; }
.admin-table th:last-child { width:10%; }
.admin-avatar { flex-basis:36px; height:36px; font-size:11px; background:#293a5b; }
.admin-email { font-size:13px; }
.admin-self,.admin-status,.admin-role,.admin-date { font-size:12px; }
.admin-panel .admin-row-action button { min-height:38px; padding:6px 8px; border:0; background:transparent; color:#9cc3ff; font-size:12px; }
.admin-panel .admin-row-action button svg { display:none; }
.admin-pagination { margin-top:12px; font-size:12px; }
.admin-pagination nav button { min-height:38px; width:38px; }
.admin-panel .admin-empty { background:#171a1f; }
/* Backups page */
.backup-panel { width:min(100%,1280px); max-width:1280px; margin:0 auto; padding:20px 24px 28px; color:var(--text); background:var(--bg); }
.backup-panel header { align-items:flex-end; }
.backup-panel header h1 { font-size:23px; }
.backup-panel header p { margin:4px 0 0; color:var(--muted); font-size:11px; }
.backup-panel button { min-height:36px; padding:7px 12px; border-color:var(--border); border-radius:7px; background:#171a1f; color:#e1e5eb; font-size:10px; }
.backup-panel button:hover:not(:disabled) { background:#20242b; }
.backup-live { min-height:0; margin:0; font-size:10px; }
.backup-summary { margin-top:16px; padding:11px 13px; border-color:var(--border); border-radius:9px; background:#171a1f; }
.backup-summary-heading { justify-content:flex-start; margin-bottom:7px; }
.backup-summary-heading h2 { font-size:12px; }
.backup-badge { padding:3px 7px; border:1px solid #304b38; background:#19291e; color:#a5d3ad; font-size:9px; }
.backup-summary dl { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; }
.backup-summary dl div { padding:3px 11px; border-right:1px solid var(--border); }
.backup-summary dl div:first-child { padding-left:0; }
.backup-summary dl div:last-child { border:0; }
.backup-summary dt { color:var(--muted); font-size:9px; }
.backup-summary dd { margin-top:3px; font-size:10px; }
.backup-summary .backup-note { margin-top:8px; font-size:9px; }
.backup-settings { width:100%; margin-top:14px; padding:12px; border-color:var(--border); border-radius:9px; background:#171a1f; }
.backup-settings h2 { color:var(--text); font-size:12px; }
.backup-settings>p { color:var(--muted); font-size:9px; }
.backup-settings-grid { width:min(100%,1040px); grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px 12px; }
.backup-settings label,.backup-size-field>label { color:#959eac; font-size:9px; }
.backup-settings input,.backup-settings select { min-height:34px; padding:6px 9px; border-color:var(--border); border-radius:7px; background:#171a1f; color:var(--text); font-size:10px; }
.backup-settings-grid>label,.backup-size-field { min-width:0; max-width:320px; }
.backup-settings-grid>label input,.backup-settings-grid>label select { max-width:320px; }
.backup-settings-grid input[name="retentionCount"],.backup-settings-grid input[name="maxFiles"] { max-width:150px; }
.backup-size-control { max-width:250px; }
.backup-size-control input { max-width:165px; }
.backup-size-control select { width:72px; }
.backup-settings-heading button { flex:0 0 auto; }
.backup-settings-hint { color:var(--muted); }
.backup-settings [data-settings-status] { color:#9bcba7; font-size:10px; }
.backup-settings [data-save-settings] { min-height:32px; padding:5px 12px; background:#1c2027; }
.backup-points { margin-top:17px; }
.backup-points h2 { margin:0; font-size:12px; }
.backup-help { margin:2px 0 8px; font-size:9px; }
.backup-list ul { border-color:var(--border); border-radius:9px; }
.backup-list li { min-height:44px; padding:7px 10px; border-color:var(--border); }
.backup-list li strong { font-size:10px; }
.backup-list li span { color:var(--muted); font-size:9px; }
.backup-list li button { min-height:29px; font-size:9px; }
.backup-empty,.backup-error { border-color:var(--border); background:#171a1f; color:var(--text); }
.backup-empty p,.backup-error p { color:var(--muted); }
@media(max-width:760px) {
 .admin-panel,.backup-panel { padding:18px 14px; }
 .admin-stats { grid-template-columns:1fr; }
 .admin-toolbar { grid-template-columns:1fr 1fr; }
 .admin-search { grid-column:1/-1; }
 .backup-summary dl { grid-template-columns:1fr 1fr; gap:8px; }
 .backup-summary dl div { border:0; padding:4px 0; }
 .backup-settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .backup-settings-grid>label,.backup-size-field { max-width:none; }
}
@media(max-width:520px) { .backup-settings-grid { grid-template-columns:1fr; } }
.sidebar-footer { flex:0 0 auto; margin-top:auto; padding-top:9px; border-top:1px solid var(--border); }
.sidebar-footer button { display:flex; width:100%; min-height:38px; align-items:center; justify-content:flex-start; gap:10px; padding:5px 8px; border:0; border-radius:8px; background:transparent; color:#c4cad4; font-size:11px; font-weight:600; text-align:left; }
.sidebar-footer button:hover { background:var(--card-hover); }
.sidebar-footer button svg { display:block; width:18px; height:18px; min-width:18px; max-width:18px; flex:0 0 18px; color:var(--muted); }
@media(max-width:760px) {
 .mobile-menu-open .sidebar-search { display:flex; margin:4px 0; }
 .mobile-menu-open #allAppsButton { display:flex; min-height:36px; }
 .mobile-menu-open #allAppsButton .meta { display:block; }
 .mobile-menu-open .file-item { min-height:40px; }
 .app-shell:not(.mobile-menu-open) #fileMenu { display:none; }
}
.backup-settings-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:8px; }
.backup-settings-heading > div { min-width:0; }
.backup-settings-heading > div > p { margin:3px 0 0; }
.backup-edit-settings { min-height:27px!important; padding:3px 5px!important; border:0!important; background:transparent!important; color:#9cc3ff!important; }
.backup-panel [hidden] { display:none!important; }
.backup-settings input:disabled,.backup-settings select:disabled { opacity:1; color:#d3d8e0; }
.sidebar-collapsed .sidebar-search { display:none; }
.sidebar-collapsed .side-count { display:none; }
.sidebar-collapsed #allAppsButton { justify-content:center; padding-inline:5px; }
.sidebar-collapsed .file-menu .side-label { display:none; }
.sidebar-collapsed #fileMenu .favorite-drag-handle { display:none; }
.sidebar-collapsed .brand { min-height:36px; justify-content:center; padding:0; }
.sidebar-collapsed .brand-mark { display:none; }
.sidebar-collapsed .brand { position:relative; min-height:38px; }
.sidebar-collapsed .sidebar-toggle { top:0; right:50%; transform:translateX(50%); }
.sidebar-collapsed .sidebar-footer { display:flex; justify-content:center; }
.sidebar-collapsed .sidebar-footer button { width:38px; min-width:38px; max-width:38px; height:38px; min-height:38px; justify-content:center; margin-inline:auto; padding:9px; }
.sidebar-collapsed .sidebar-footer button span { display:none!important; }
.sidebar-collapsed .sidebar-footer button svg { width:18px!important; height:18px!important; min-width:18px!important; max-width:18px!important; flex:0 0 18px; }
#status { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; }
@media(max-width:760px) {
 .workspace-bar { height:42px; border:0; border-bottom:1px solid var(--border); border-radius:0; }
 /* Desktop collapse preferences must not turn the mobile app picker into an
    icon-only rail. Mobile visibility is controlled by mobile-menu-open. */
 .sidebar-collapsed .brand { min-height:40px; justify-content:flex-start; padding:0 0 0 4px; }
 .sidebar-collapsed .brand-mark { display:block; }
 .sidebar-collapsed .brand-copy { display:block; }
 .sidebar-collapsed .sidebar-toggle { display:none; }
 .sidebar-collapsed #allAppsButton { justify-content:flex-start; padding-inline:7px; }
 .sidebar-collapsed .file-menu .file-item { justify-content:flex-start; padding-inline:7px; }
 .sidebar-collapsed .file-menu .file-item .meta { display:block; }
 .sidebar-collapsed .sidebar-footer { display:none; }
 .mobile-menu-open.sidebar-collapsed .sidebar-search { display:flex; }
 .mobile-menu-open.sidebar-collapsed .sidebar-footer { display:block; }
}