/* ATCODEX Glass — fixed, accessible palettes shared by desktop and Android.
   Screen-only surfaces leave report templates and printed documents unchanged.
   Glass is composited on the shell and dialogs, never on every table cell. */
:root {
  color-scheme: light;
  --page-bg:#e6edf0; --surface:rgba(255,255,255,.74); --surface-solid:#f9fbfc;
  --surface-raised:#fff; --surface-soft:#edf2f6; --field-bg:#f8fafc;
  --ink:#20262c; --muted:#596775; --subtle:#657483;
  --line:rgba(84,108,133,.16); --line-strong:#c5d0dc;
  --accent:#3349d8; --accent-hover:#253ac2; --accent-rgb:51,73,216;
  --accent-soft:#e8ecfd; --accent-contrast:#fff;
  --success:#137256; --success-soft:#e4f4ed; --danger:#b93447; --danger-soft:#fce9ed;
  --warning:#8a5d12; --warning-soft:#fcf2db;
  --glass-blur:blur(18px) saturate(115%); --glass-edge:rgba(255,255,255,.9);
  --glass-shadow:0 12px 40px -24px rgba(30,48,75,.22),0 1px 2px rgba(30,48,75,.035);
  --dialog-shadow:0 24px 90px -30px rgba(21,30,50,.38);
  --scrim:rgba(28,37,54,.36); --stripe:rgba(89,110,137,.035);
  --glow:radial-gradient(ellipse at 5% 0%,rgba(183,192,231,.35),transparent 46%),radial-gradient(ellipse at 90% 94%,rgba(183,220,230,.3),transparent 48%);
  --app-background-image:none; --sidebar-background-image:none; --button-background-image:none;
  --image-scrim:rgba(248,251,253,.86); --button-scrim:rgba(29,45,119,.8);
  --sidebar-image-opacity:.65; --sidebar-image-scrim:rgba(248,251,253,calc(1 - var(--sidebar-image-opacity)));
  --sidebar-readable-surface:rgba(249,251,252,.9);
  --primary-color:var(--accent); --primary-color-dark:var(--accent-hover); --primary-bg:var(--accent);
  --sidebar-bg:var(--surface); --sidebar-active:var(--accent); --sidebar-hover:var(--accent-soft);
  --app-text-color:var(--ink); --card-bg:var(--surface-solid); --text-color:var(--ink);
  --text-muted:var(--muted); --border-color:var(--line); --input-bg:var(--field-bg); --bg-color:var(--surface-soft);
  --radius-sm:10px; --radius-md:16px; --radius-lg:20px;
  --elev-1:var(--glass-shadow); --elev-2:0 8px 28px -18px rgba(34,48,81,.2);
  --elev-3:var(--dialog-shadow); --elev-4:var(--dialog-shadow);
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --page-bg:#202020; --surface:rgba(42,42,42,.78); --surface-solid:#282828;
  --surface-raised:#353535; --surface-soft:#303030; --field-bg:#1f1f1f;
  --ink:#f4f4f4; --muted:#c2c2c2; --subtle:#a6a6a6;
  --line:rgba(255,255,255,.09); --line-strong:#535353;
  --accent:#60cdff; --accent-hover:#8fddff; --accent-rgb:96,205,255;
  --accent-soft:#243a44; --accent-contrast:#082331;
  --success:#78d8b4; --success-soft:#203a30; --danger:#f1a1a5; --danger-soft:#3d2525;
  --warning:#ebc481; --warning-soft:#372f21;
  --glass-blur:blur(24px) saturate(100%); --glass-edge:rgba(255,255,255,.12);
  --glass-shadow:0 12px 36px -18px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.03);
  --dialog-shadow:0 22px 64px -20px rgba(0,0,0,.65); --elev-2:0 8px 28px -18px rgba(0,0,0,.5);
  --scrim:rgba(0,0,0,.55); --stripe:rgba(255,255,255,.025);
  --glow:radial-gradient(ellipse at 5% 0%,rgba(255,255,255,.075),transparent 55%),radial-gradient(ellipse at 95% 100%,rgba(255,255,255,.035),transparent 50%);
  --image-scrim:rgba(32,32,32,.8); --button-scrim:rgba(10,22,29,.84);
  --sidebar-image-scrim:rgba(32,32,32,calc(1 - var(--sidebar-image-opacity)));
  --sidebar-readable-surface:rgba(32,32,32,.88);
}
:root[data-effects="off"] { --surface:var(--surface-solid); --glass-blur:none; --glow:none; --glass-edge:var(--line); --glass-shadow:0 1px 3px rgba(0,0,0,.05); }

@media screen {
  html { background:var(--page-bg); scrollbar-color:var(--line-strong) transparent; }
  body { color:var(--ink); background-color:var(--page-bg); background-image:var(--glow),var(--app-background-image); background-size:cover; background-position:center; background-attachment:fixed; line-height:1.65; }
  ::selection { background:rgba(var(--accent-rgb),.23); color:var(--ink); }
  :focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
  button,input,select,textarea { font-family:var(--app-font); }
  button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
  .dashboard-layout { padding:14px; gap:16px; height:100vh; height:100dvh; }
  .sidebar { width:264px; flex:0 0 264px; padding:24px 15px 16px; border:1px solid var(--glass-edge); border-radius:24px; color:var(--ink); background:var(--surface); background-size:cover; background-position:center; box-shadow:var(--glass-shadow); backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); }
  :root[data-sidebar-image] .sidebar { background-image:linear-gradient(var(--sidebar-image-scrim),var(--sidebar-image-scrim)),var(--sidebar-background-image); }
  .sidebar-brand { gap:11px; padding:0 8px; }
  .sidebar-brand img { border-radius:13px; width:45px; height:45px; object-fit:contain; }
  .sidebar .sidebar-title { color:var(--ink); font-size:1rem; line-height:1.6; letter-spacing:-.02em; }
  .sidebar .user-info { color:var(--muted); padding:9px 10px 20px; margin-bottom:14px; border-bottom:1px solid var(--line); font-size:.75rem; }
  .menu { gap:5px; padding:1px 3px 8px; margin:0; }
  .sidebar .menu-item { min-height:43px; padding:10px 12px; border:1px solid transparent; border-radius:12px; color:var(--muted); background:none; font-size:.85rem; font-weight:600; gap:10px; transform:none; transition:background-color .14s ease,color .14s ease,box-shadow .14s ease; }
  .sidebar .menu-item:hover { color:var(--ink); background:var(--surface-soft); transform:none; }
  /* Keep labels readable without covering the whole background image. */
  :root[data-sidebar-image] .sidebar :is(.sidebar-brand,.user-info) { background:var(--sidebar-readable-surface); border-radius:12px; }
  :root[data-sidebar-image] .sidebar .menu-item:not(.active) { background:var(--sidebar-readable-surface); color:var(--ink); }
  :root[data-sidebar-image] .sidebar .menu-item:not(.active):hover { background:var(--surface-solid); }
  .sidebar .menu-item.active { background:var(--accent); color:var(--accent-contrast); box-shadow:0 4px 14px -7px rgba(var(--accent-rgb),.5); border-color:rgba(var(--accent-rgb),.24); transform:none; }
  .sidebar .menu-item::before { width:3px; inset-inline-start:0; inset-inline-end:auto; background:currentColor; }
  .sidebar .menu-item.active::before { height:38%; background:currentColor; opacity:.7; }
  :root[data-theme="dark"] .sidebar .menu-item.active { color:var(--ink); background:var(--surface-raised); border-color:var(--line); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }
  :root[data-theme="dark"] .sidebar .menu-item.active::before { background:var(--accent); opacity:1; }
  :root[data-sidebar-selection] .sidebar .menu-item.active { background:var(--sidebar-selection-background); color:var(--sidebar-selection-text); text-shadow:var(--sidebar-selection-text-shadow,none); border-color:transparent; box-shadow:none; }
  :root[data-sidebar-selection] .sidebar .menu-item.active::before { background:currentColor; }
  .sidebar .menu-item:active { transform:scale(.988); }
  .sidebar .zoom-bar { margin:14px 0 10px; background:var(--surface-soft); color:var(--muted); border:1px solid var(--line); border-radius:12px; box-shadow:none; }
  .sidebar .zoom-bar button { color:var(--ink); border:1px solid var(--line); background:var(--surface-raised); border-radius:8px; }
  .sidebar .zoom-level { color:var(--muted); }
  .appearance-toggle { display:inline-flex; justify-content:center; align-items:center; gap:9px; padding:10px 14px; min-height:42px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); font:inherit; font-size:.82rem; font-weight:600; cursor:pointer; }
  .appearance-toggle::before { content:'◐'; font-family:system-ui,sans-serif; font-size:18px; color:var(--accent); }
  .sidebar .appearance-toggle { width:100%; margin-bottom:9px; flex-shrink:0; }
  .appearance-toggle:hover { background:var(--accent-soft); border-color:rgba(var(--accent-rgb),.35); }
  .sidebar .btn-logout { color:var(--danger); background:var(--danger-soft); border:1px solid transparent; border-radius:12px; min-height:43px; padding:10px; margin-top:0; font-size:.86rem; box-shadow:none; }
  .sidebar .btn-logout:hover { border-color:var(--danger); }
  .main-content { min-width:0; padding:26px 22px 28px; background:transparent; border-radius:24px; }
  .content-section,.content-section [class*="-pane"] { animation:none; }
  .section-header { gap:14px; margin-bottom:22px; }
  .section-header h2,.sp-header h2 { color:var(--ink); font-size:1.3rem; font-weight:700; letter-spacing:-.02em; }
  .section-header h2::before,.sp-header h2::before { background:var(--accent); width:3px; height:19px; }
  .section-refresh-btn { background:var(--surface); color:var(--muted); border:1px solid var(--glass-edge); border-radius:11px; box-shadow:var(--glass-shadow); }
  .section-refresh-btn:hover { color:var(--accent); background:var(--surface-raised); }
  .card-form,.table-card,.stat-card,.sp-card,.control-workspace,.ce-card,.cl-card,.cl-section-card,.tl-card,.oh-filterbar,.oh-kpi,.oh-panel,.oh-alert,.oh-run-detail,.sei-toolbar { background:var(--surface); color:var(--ink); border:1px solid var(--glass-edge); border-radius:var(--radius-lg); box-shadow:var(--glass-shadow); }
  .card-form:hover,.table-card:hover,.stat-card:hover { box-shadow:var(--glass-shadow); transform:none; }
  .card-form h3,.table-header h3,.sp-card h3,.sp-card summary,.cw-heading h3,.cl-sheet-head h3 { color:var(--ink); }
  .table-header { background:var(--surface-solid)!important; border-bottom-color:var(--line); padding-top:19px; padding-bottom:19px; }
  .card-form,.sp-card { padding:24px; }
  .stat-card { padding:22px; border-radius:18px; }
  .stat-title,.stat-label { color:var(--muted); font-size:.8rem; }
  .stat-value,.stat-number { color:var(--ink); font-weight:700; letter-spacing:-.025em; }
  .subtab-bar { gap:5px; padding:9px; border-color:var(--line)!important; border-radius:18px; background:transparent; }
  .subtab-bar button,.sp-tabs button,.oh-tabs button { color:var(--muted)!important; background:transparent!important; border:1px solid transparent!important; border-radius:10px!important; padding:10px 14px!important; font-size:.85rem!important; font-weight:600; margin:0!important; letter-spacing:0!important; transition:color .14s ease,background .14s ease!important; transform:none!important; }
  .subtab-bar button:hover,.sp-tabs button:hover,.oh-tabs button:hover { background:var(--surface-soft)!important; color:var(--ink)!important; }
  .subtab-bar button.active,.sp-tabs button.active,.oh-tabs button.active { color:var(--accent)!important; background:var(--accent-soft)!important; border-color:rgba(var(--accent-rgb),.1)!important; box-shadow:none; }
  .subtab-bar button.active::after { background:transparent; }
  .data-table { color:var(--ink); }
  .data-table th,.sp-table th,.oh-table th,.sei-table th,.sx-preview th { background:var(--surface-soft); color:var(--muted); font-weight:700; border-color:var(--line); padding:13px 14px; }
  .dashboard-layout .data-table thead th { background:var(--surface-soft)!important; color:var(--muted)!important; border-color:var(--line)!important; }
  .data-table td,.sp-table td,.oh-table td,.sei-table td,.sx-preview td { border-color:var(--line); }
  .data-table tbody tr:nth-child(even),.sp-table tr:nth-child(even),.oh-table tr:nth-child(even),.sei-table tr:nth-child(even) { background:var(--stripe); }
  .data-table tbody tr:hover,.sp-table tbody tr:hover,.oh-table tbody tr:hover { background:var(--accent-soft); }
  .data-table tbody tr { transition:background-color .12s ease; }
  .data-table a,.cl-name { color:var(--accent); }
  .form-group label,.sp-field,.cw-field { color:var(--ink); }
  input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=range]):not([type=button]):not([type=submit]),select,textarea { color:var(--ink); background-color:var(--field-bg); border-color:var(--line-strong); border-radius:10px; box-shadow:none; }
  .form-group select,.form-group textarea { color:var(--ink); background-color:var(--field-bg); border-color:var(--line-strong); }
  input::placeholder,textarea::placeholder { color:var(--subtle); opacity:1; }
  input[type=checkbox],input[type=radio],input[type=range] { accent-color:var(--accent); }
  .form-group input:hover:not(:focus),.form-group select:hover:not(:focus),.form-group textarea:hover:not(:focus) { background-color:var(--surface-raised); border-color:var(--line-strong); }
  input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus { border-color:var(--accent); outline:0; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13); }
  select option { background:var(--surface-solid); color:var(--ink); }
  button { transition:background-color .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease; }
  .btn-primary,.sei-button.sei-primary,.sp-button.primary { color:var(--accent-contrast); background-color:var(--accent); background-image:var(--button-background-image); background-size:cover; background-position:center; border-color:transparent; box-shadow:0 4px 12px -8px rgba(var(--accent-rgb),.55); }
  :root[data-button-image="true"] .btn-primary,:root[data-button-image="true"] .sei-button.sei-primary,:root[data-button-image="true"] .sp-button.primary { background-image:linear-gradient(var(--button-scrim),var(--button-scrim)),var(--button-background-image); color:#fff; }
  .btn-primary:hover,.sei-button.sei-primary:hover,.sp-button.primary:hover { background-color:var(--accent-hover); filter:none; box-shadow:0 5px 15px -9px rgba(var(--accent-rgb),.5); transform:translateY(-1px); }
  .btn-secondary,.btn-link,.sp-button,.sei-button,.cl-btn { background:var(--surface-raised); border:1px solid var(--line); color:var(--ink); border-radius:10px; box-shadow:none; }
  .btn-secondary:hover,.btn-link:hover,.sp-button:hover,.sei-button:hover,.cl-btn:hover { color:var(--accent); background:var(--accent-soft); border-color:rgba(var(--accent-rgb),.25); }
  .btn-success { color:var(--success); background:var(--success-soft); border:1px solid rgba(36,147,112,.2); }
  .btn-danger,.btn-danger-sm { color:var(--danger); background:var(--danger-soft); border:1px solid rgba(209,69,97,.15); }
  .btn-success:hover,.btn-danger:hover,.btn-danger-sm:hover { filter:none; box-shadow:none; }
  .badge { color:var(--accent); background:var(--accent-soft); border-color:rgba(var(--accent-rgb),.15); }
  .badge.green { color:var(--success); background:var(--success-soft); border-color:rgba(36,147,112,.2); }
  .table-card::-webkit-scrollbar-track,.table-scroll::-webkit-scrollbar-track,.main-content::-webkit-scrollbar-track { background:var(--surface-solid); }
  .table-card::-webkit-scrollbar-thumb,.table-scroll::-webkit-scrollbar-thumb,.main-content::-webkit-scrollbar-thumb { background:var(--line-strong); border-color:var(--surface-solid); }
  .modal,.conn-modal,.cl-overlay,.sei-overlay,.sx-overlay,.app-confirm-overlay,#forcePwdModal { background:var(--scrim)!important; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .modal-content,.conn-modal-box,.cl-sheet,.sei-dialog,.sx-panel,.app-confirm-box { color:var(--ink); background:var(--surface-solid); border:1px solid var(--glass-edge); border-radius:22px; box-shadow:var(--dialog-shadow); }
  /* Neutral frosted material on elevated windows; dense tables stay unblurred. */
  :root[data-theme="dark"]:not([data-effects="off"]) :is(.modal-content,.conn-modal-box,.cl-sheet,.sei-dialog,.sx-card,.app-confirm-box) { background:var(--surface); backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); }
  :root[data-theme="dark"]:not([data-effects="off"]) .login-brand-panel { background:rgba(255,255,255,.025); }
  :root[data-theme="dark"][data-app-image] body { background-image:var(--glow),linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),var(--app-background-image); }
  .modal-content h3,.conn-modal-box h3,.sei-header h3,.sx-panel h3 { color:var(--ink); }
  .modal-content::-webkit-scrollbar-track { background:var(--surface-solid); }
  .modal-content::-webkit-scrollbar-thumb { background:var(--line-strong); border-color:var(--surface-solid); }
  .close-modal,.cl-x { color:var(--muted); background:var(--surface-soft); border-radius:9px; }
  .sp-header-note,.sp-empty,.sp-muted,.sp-help,.sp-card small,.cw-help,.cw-heading p,.tl-note,.tl-ar,.tl-badge,.hr-field-hint,.hr-name-en,.user-details,.user-hr-link,.users-search-hint,.sei-help,.sei-hint,.sei-file,.sei-footer span,.sx-note { color:var(--muted); }
  .sp-table-wrap,.cw-table-wrap,.sei-table-wrap,.cl-fields,.sp-settings[open]>summary,.sei-header,.sei-footer { border-color:var(--line); }
  .cw-summary,.cw-import,.cw-weekly,.tl-current,.tl-item,.tl-card,.hr-account-note,.sei-counts span,.sei-steps span,.sx-summary { color:var(--ink); background:var(--surface-soft); border-color:var(--line); }
  .sei-toolbar { background:var(--surface); border-color:var(--glass-edge); }
  .sei-toolbar-copy strong,.sei-eyebrow,.sei-toolbar-copy span { color:var(--muted); }
  .sei-status,.sei-good { color:var(--success); }
  .sei-error,.sx-error,.cw-error { color:var(--danger)!important; }
  .sei-errors { color:var(--danger); background:var(--danger-soft); border-color:rgba(209,69,97,.3); }
  #ownerHrContent { --oh-ink:var(--ink); --oh-muted:var(--muted); --oh-line:var(--line); }
  .oh-hero { color:var(--ink); background:linear-gradient(115deg,rgba(var(--accent-rgb),.12),var(--surface)); border:1px solid var(--glass-edge); }
  .oh-hero h3,.oh-kpi strong,.oh-panel h3,.oh-section-title,.oh-run-title { color:var(--ink); }
  .oh-hero p,.oh-hero-meta,.oh-eyebrow,.oh-readonly { color:var(--muted); }
  .oh-readonly { border-color:var(--line-strong); background:var(--surface); }
  .oh-kpi,.oh-section,.oh-empty,.oh-filterbar,.oh-pager,.oh-run-summary,.oh-payroll-details { background:var(--surface); border-color:var(--line); color:var(--ink); }
  .oh-filterbar input,.oh-filterbar select { background:var(--field-bg); color:var(--ink); border-color:var(--line); }
  .cl-fields dt,.cl-unset td,.cl-chip,.tl-item.is-disabled,.users-table tr.is-inactive td { background:var(--surface-soft); color:var(--muted); }
  .cl-fields dd,.cl-bus,.tl-en,.tl-chosen,.cl-group { color:var(--ink); }
  .cl-chip.active,.tl-item.is-chosen { border-color:var(--accent); background:var(--accent-soft); }
  .users-table .users-group-row th { background:var(--accent-soft); color:var(--accent); border-color:var(--line); }
  .users-table .users-group-row .users-group-count { color:var(--muted); }
  .app-toast { box-shadow:var(--dialog-shadow); }
  #mobileSetup { background:var(--page-bg)!important; background-image:var(--glow)!important; color:var(--ink)!important; font-family:var(--app-font)!important; }
  #mobileSetup input { color:var(--ink)!important; background:var(--field-bg)!important; border-color:var(--line-strong)!important; }
  #mobileSetup .ms-card,#mobileSetup .ms-box { background:var(--surface-solid)!important; color:var(--ink)!important; border-color:var(--line)!important; }

  /* Component adapters share the palette without repainting document previews. */
  .sp-tabs,.sp-table-wrap,.cl-host,.cl-option,.oh-metric,.sx-card { background:var(--surface); color:var(--ink); border-color:var(--line); box-shadow:var(--glass-shadow); }
  .sp-field input,.sp-field select,.sp-field textarea,.sp-actions input,.sp-actions select,#ownerHrContent input,#ownerHrContent select { color:var(--ink); background:var(--field-bg); border-color:var(--line-strong); }
  .sp-tabs .sp-button { color:var(--muted); background:transparent; }
  .sp-tabs .sp-button:hover:not(:disabled),.sp-tabs .sp-button.active,.sp-tabs .sp-button[aria-selected=true] { color:var(--accent); background:var(--accent-soft); border-bottom-color:var(--accent); }
  .sp-table tbody tr:nth-child(even) { background:var(--stripe); }
  .sp-table tbody tr:hover { background:var(--accent-soft); }
  .sp-button:hover:not(:disabled),.sp-button:active:not(:disabled) { background:var(--accent-soft); color:var(--accent); border-color:var(--line-strong); }
  .sp-button.sp-primary,.cl-btn.cl-primary,.oh-button.oh-primary,#ceDownload,#ceCopy { color:var(--accent-contrast); background:var(--accent); border-color:transparent; background-image:var(--button-background-image); background-position:center; background-size:cover; }
  .sp-button.sp-primary:hover:not(:disabled),.sp-button.sp-primary:active:not(:disabled),.cl-btn.cl-primary:hover,.oh-button.oh-primary:hover { color:var(--accent-contrast); background-color:var(--accent-hover); filter:none; }
  :root[data-button-image] :is(.sp-button.sp-primary,.cl-btn.cl-primary,.oh-button.oh-primary,#ceDownload,#ceCopy) { background-image:linear-gradient(var(--button-scrim),var(--button-scrim)),var(--button-background-image); color:#fff; }
  .sp-note,.cl-muted,.cl-note,.cl-option-hint,.cl-card-total,.cl-chip-stats,.cl-days-title,.bus-help,.bus-empty,.bus-roster-card small,.tl-note,.hr-field-hint,.tl-ar,.tl-legacy,.user-hr-link { color:var(--muted); }
  .sp-workspace h4,.sp-readable-text h1,.sp-readable-text h4,.sp-bank-picker>legend,.sp-answer-options>legend,.sp-day-picker>legend,.cl-card-name,.cl-section-title,.cl-option-title,.cl-toolbar label,.cl-bus,.tl-card h4 { color:var(--ink); }
  .sp-badge,.cl-more,.cl-count.boys,.cl-count.st-excused,.cl-badge.view,.hr-account-badge { color:var(--accent); background:var(--accent-soft); border-color:var(--line); }
  .sp-empty,.sp-selected-questions,.sp-day-picker>label,.cl-count,.cl-count.st-none,.cl-badge,.tl-badge,.tl-item.is-disabled { background:var(--surface-soft); color:var(--muted); border-color:var(--line); }
  .sp-question,.sp-selected-question,.sp-bank-item,.sp-file-row,.sp-reader-tools,.sp-reader-viewport,.sp-file-preview .sp-readable-text { background:var(--surface-solid); color:var(--ink); border-color:var(--line); }
  .sp-classroom,.sp-reader-dialog { background:var(--page-bg); color:var(--ink); }
  .sp-reader-width select { background:var(--field-bg); color:var(--ink); border-color:var(--line-strong); }
  .sp-reader-dialog .sp-reader-top>.sp-button:first-child,.sp-reader-dialog .sp-reader-top>.sp-button:first-child:hover { color:var(--accent-contrast); background:var(--accent); border-color:var(--accent); }
  .sp-learning-workspace,.sp-learning-workspace *,.sp-reader-dialog,.sp-reader-dialog * { scrollbar-color:var(--line-strong) var(--surface-soft); }
  .sp-learning-workspace ::-webkit-scrollbar-track,.sp-reader-dialog ::-webkit-scrollbar-track { background:var(--surface-soft); }
  .sp-learning-workspace ::-webkit-scrollbar-thumb,.sp-reader-dialog ::-webkit-scrollbar-thumb { background:var(--line-strong); border-color:var(--surface-soft); }
  .sp-bank-picker,.sp-answer-options,.sp-day-picker,.sp-attachments,.sp-quiz-editor,.sp-grading,.sp-reader-resource,.cl-panel,.bus-roster-card,.bus-check,.tl-current,.tl-item,.hr-account-note,.cw-designer,.cw-table td,.cw-table th,.cl-fields dt,.cl-fields dd { border-color:var(--line); }
  .sp-success,.cl-count.ok,.cl-count.st-present,.cl-badge.ok,.tl-badge.ok,.user-actions .user-action-toggle.on { color:var(--success); background:var(--success-soft); border-color:var(--line); }
  .sp-error,.sp-form-error,.cl-error,.cl-count.off,.cl-count.st-absent,.cl-badge.off,.hr-account-badge.off,.user-status-badge,.bus-error,.sx-card .sx-error { color:var(--danger); background:var(--danger-soft); border-color:var(--line); }
  .cl-warn,.cl-count.st-late,.tl-empty,.tl-badge.warn,.user-actions .user-action-toggle { color:var(--warning); background:var(--warning-soft); border-color:var(--line); }
  .cl-count.girls { color:var(--ink); background:var(--surface-soft); }
  .cl-group.boys,.cl-group.girls { color:var(--accent); }
  .cl-more:hover,.cl-option.active,.cl-chip.active { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
  .cl-btn.cl-toggle.active { background:var(--accent); border-color:var(--accent); color:var(--accent-contrast); }
  .cl-card-total strong { color:var(--accent); }
  .bus-status:not(.bus-error) { color:var(--accent); background:var(--accent-soft); border-color:var(--line); }
  .bus-passenger-state { color:var(--success); }
  .bus-map { border-color:var(--line); background:var(--surface-soft); }
  .bus-form-row select,.bus-search-label input { color:var(--ink); background:var(--field-bg); border-color:var(--line-strong); }
  .cl-status.st-none,.cl-unsubscribed td { color:var(--muted); }
  .tl-item.is-chosen { box-shadow:0 0 0 2px var(--accent) inset; }
  .user-hr-link.missing,.oi-stock-alert { color:var(--warning); }
  .users-filter-error,.adf-error { color:var(--danger); }
  .adf-file,.adf-button,.adf-filters select,.adf-filters input,.adf-print-options input,.adf-preview select { color:var(--ink); background:var(--surface-solid); border-color:var(--line); }
  .adf-files,.adf-preview { border-color:var(--line); }
  .sx-card { background:var(--surface-solid); border:1px solid var(--glass-edge); box-shadow:var(--dialog-shadow); border-radius:22px; }
  .sx-card>p { color:var(--muted); }
  .sx-card>input { border-color:var(--line-strong); }
  .sx-summary table th { background:var(--surface-soft); color:var(--muted); border-color:var(--line); }
  .sx-summary table td { color:var(--ink); border-color:var(--line); }
  .sei-file input,.sei-dialog select,.sei-toolbar select { color:var(--ink); background:var(--field-bg); border-color:var(--line-strong); }
  .sei-steps span { color:var(--accent); background:var(--accent-soft); }
  #ownerHrContent .oh-metric,#ownerHrContent .oh-error { background:var(--surface); border-color:var(--line); color:var(--ink); }
  #ownerHrContent .oh-metric { border-top-color:var(--accent); }
  #ownerHrContent .oh-metric-amber { border-top-color:var(--warning); }
  #ownerHrContent .oh-metric-slate { border-top-color:var(--subtle); }
  #ownerHrContent .oh-metric-teal { border-top-color:var(--success); background:var(--success-soft); }
  #ownerHrContent .oh-metric-teal strong,#ownerHrContent .oh-net-cell { color:var(--success); }
  #ownerHrContent .oh-panel h4,#ownerHrContent .oh-person strong,#ownerHrContent .oh-table strong,#ownerHrContent .oh-scope strong,#ownerHrContent .oh-leaves strong { color:var(--ink); }
  #ownerHrContent .oh-filterbar label,#ownerHrContent .oh-staff-filters label,#ownerHrContent .oh-scope,#ownerHrContent .oh-metric-label,#ownerHrContent .oh-metric-sub,#ownerHrContent .oh-kicker,#ownerHrContent .oh-date,#ownerHrContent .oh-coverage span,#ownerHrContent .oh-attendance-cell span,#ownerHrContent .oh-footnote,#ownerHrContent .oh-department small,#ownerHrContent .oh-leaves,#ownerHrContent .oh-person small,#ownerHrContent .oh-cell-sub,#ownerHrContent .oh-pagination,#ownerHrContent .oh-payroll-meta,#ownerHrContent .oh-payroll-totals span,#ownerHrContent .oh-payroll-note,#ownerHrContent .oh-empty p,#ownerHrContent .oh-error p,#ownerHrContent .oh-empty-small,#ownerHrContent .oh-loading { color:var(--muted); }
  #ownerHrContent .oh-button { color:var(--ink); background:var(--surface-raised); border-color:var(--line); }
  #ownerHrContent .oh-button:hover { color:var(--accent); background:var(--accent-soft); }
  #ownerHrContent .oh-button.oh-primary { color:var(--accent-contrast); background:var(--accent); }
  :root[data-button-image] #ownerHrContent .oh-button.oh-primary { background-image:linear-gradient(var(--button-scrim),var(--button-scrim)),var(--button-background-image); color:#fff; }
  #ownerHrContent .oh-modes,#ownerHrContent .oh-progress,#ownerHrContent .oh-department-track,#ownerHrContent .oh-attendance-cell,#ownerHrContent .oh-avatar,#ownerHrContent .oh-empty-symbol,#ownerHrContent .oh-payroll-totals>div { background:var(--surface-soft); color:var(--muted); border-color:var(--line); }
  #ownerHrContent .oh-modes button { color:var(--muted); }
  #ownerHrContent .oh-modes button.active { background:var(--surface-raised); color:var(--accent); }
  #ownerHrContent .oh-table th { background:var(--surface-soft); color:var(--muted); border-color:var(--line); }
  #ownerHrContent .oh-table td { color:var(--ink); border-color:var(--line); }
  #ownerHrContent .oh-table tbody tr:hover { background:var(--accent-soft); }
  #ownerHrContent .oh-pagination,#ownerHrContent .oh-payroll-totals,#ownerHrContent .oh-leaves { border-color:var(--line); }
  #ownerHrContent .oh-badge { background:var(--surface-soft); color:var(--muted); }
  #ownerHrContent .oh-badge.oh-active,#ownerHrContent .oh-badge.oh-present,#ownerHrContent .oh-badge.oh-finalized,#ownerHrContent .oh-attendance-cell.oh-present,#ownerHrContent .oh-payroll-totals>div.oh-net,#ownerHrContent .oh-net-cell { background:var(--success-soft); color:var(--success); }
  #ownerHrContent .oh-badge.oh-late,#ownerHrContent .oh-badge.oh-on_leave,#ownerHrContent .oh-badge.oh-draft,#ownerHrContent .oh-badge.oh-unrecorded,#ownerHrContent .oh-attendance-cell.oh-unrecorded { background:var(--warning-soft); color:var(--warning); border-color:var(--line); }
  #ownerHrContent .oh-badge.oh-absent,#ownerHrContent .oh-attendance-cell.oh-absent { background:var(--danger-soft); color:var(--danger); }
  #ownerHrContent .oh-badge.oh-excused,#ownerHrContent .oh-badge.oh-leave { background:var(--accent-soft); color:var(--accent); }
  #ownerHrContent .oh-coverage strong { color:var(--accent); }
  #ownerHrContent .oh-department-track span { background:var(--accent); }
  #ownerHrContent .oh-progress>span { background:linear-gradient(90deg,var(--success),var(--accent)); }
  #ownerHrContent .oh-filter-error,#ownerHrContent .oh-error strong { color:var(--danger); }
  #ownerHrContent .oh-loading>span { border-color:var(--line-strong); border-top-color:var(--accent); }
  #mobileSetup .ms-hint,#mobileSetup .ms-note,#mobileSetup .ms-or { color:var(--muted)!important; }
  #mobileSetup .ms-btn-primary { color:var(--accent-contrast)!important; background:var(--accent)!important; }
  #mobileSetup .ms-btn-primary:active { background:var(--accent-hover)!important; }
  #mobileSetup .ms-btn-link { color:var(--ink)!important; background:var(--surface-raised)!important; border-color:var(--line-strong)!important; }
  #mobileSetup .ms-frame { border-color:var(--accent)!important; }
  #mobileSetup .ms-box { padding:26px 22px; border:1px solid var(--glass-edge); border-radius:22px; box-shadow:var(--glass-shadow); }

  /* Older control rules use IDs and !important. Match their scope explicitly;
     the paper and editable Excel previews keep their own document colors. */
  #control .card-form { background:var(--surface); color:var(--ink); border-color:var(--glass-edge)!important; border-radius:var(--radius-lg)!important; box-shadow:var(--glass-shadow)!important; }
  #control .card-form h3 { color:var(--ink)!important; }
  #control .form-group input,#control .form-group select { border-color:var(--line-strong)!important; }
  #control .form-group input:focus,#control .form-group select:focus { border-color:var(--accent)!important; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13)!important; }
  #control .btn-primary,#control .btn-primary:hover { color:var(--accent-contrast); background-color:var(--accent)!important; background-image:var(--button-background-image)!important; background-position:center!important; background-size:cover!important; transform:none; }
  #control .btn-primary:hover { background-color:var(--accent-hover)!important; }
  :root[data-button-image] #control .btn-primary,:root[data-button-image] #control .btn-primary:hover { background-image:linear-gradient(var(--button-scrim),var(--button-scrim)),var(--button-background-image)!important; color:#fff; }
  #control .btn-primary,#control .btn-success { transition:background-color .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease!important; letter-spacing:0!important; }
  #control .data-table th { background:var(--surface-soft)!important; color:var(--muted); border-bottom-color:var(--line)!important; }
  #control .data-table td { border-color:var(--line); }
  #control .data-table tr:hover { background:var(--accent-soft)!important; }
  #control .error-msg { color:var(--danger)!important; }
  #control .card-form:first-of-type .form-group { animation:none!important; }
  #owner .btn-success,#owner .btn-success:hover { background:var(--success-soft); color:var(--success); border-color:var(--line); }
  #owner .data-table th { color:var(--muted); background:var(--surface-soft); border-color:var(--line); }
  #owner .data-table td { border-color:var(--line); }
  #owner .data-table tr:hover { background:var(--accent-soft); }
  #owner .stat-card:nth-child(1),#owner .stat-card:nth-child(2),#owner .stat-card:nth-child(6) { border-top-color:var(--accent); }
  #owner .stat-card:nth-child(3) { border-top-color:var(--warning); }
  #owner .stat-card:nth-child(4) { border-top-color:var(--success); }
  #owner .stat-card:nth-child(5) { border-top-color:var(--danger); }
  #ownerBusRosterModal table th,#ownerBusRosterModal table td { border-color:var(--line); color:var(--ink); }
  #ownerBusRosterModal table th { background:var(--surface-soft); color:var(--muted); }
  #ownerBusRosterModal table tr:nth-child(even) { background:var(--stripe); }
  #ownerBusRosterModal table tbody tr:hover { background:var(--accent-soft); }
  #reports .rpt-card { background:var(--surface); color:var(--ink); border-color:var(--line); box-shadow:var(--glass-shadow); }
  #reports .rpt-card:hover { border-color:var(--accent); box-shadow:var(--glass-shadow); }
  #reports .rpt-card h4,#reports .rpt-count,#reports .rdz-fold { color:var(--ink); }
  #reports .rpt-card p,#reports .rpt-count small,#reports .rpt-empty,#reports .rpt-search-info,#reports .rdz-status,#reports .rdz-caret,#reports .rdz-size,#reports .rdz-tip,#reports .rdz-card small,#reports .rdz-sign-row label { color:var(--muted); }
  #reports .rpt-card .rpt-card-go { color:var(--accent); }
  #reports .rpt-sep { background:var(--line); }
  #reports .rpt-colpicker,#reports .rdz-imp-mode { border-color:var(--line); }
  #reports .rpt-colchip,#reports .rdz-sign { background:var(--surface-soft); color:var(--ink); border-color:var(--line); }
  #reports .rpt-colchip.on,#reports .rpt-badge { background:var(--accent-soft); color:var(--accent); border-color:var(--accent); }
  #reports .rpt-cap { background:var(--warning-soft); color:var(--warning); border-color:var(--line); }
  #reports .rpt-table tfoot td { background:var(--surface-soft); color:var(--ink); border-color:var(--line-strong); }
  #reports .rpt-table td.rpt-neg,#reports .rdz-status.err { color:var(--danger); }
  #reports .rdz-status.dirty { color:var(--warning); }
  #reports .rdz-status.saved { color:var(--success); }
  #reports .rdz-name,#reports .rdz-name:focus,#reports .rdz-sign input,#reports .rpt-search input { color:var(--ink); background:var(--field-bg); border-color:var(--line-strong); }
  #reports .rdz-card .rdz-card-del,#reports .rdz-card .rdz-card-del:hover { color:var(--danger); background:var(--danger-soft); border-color:var(--line); }
  .pr-panel fieldset,.pr-panel .pr-separated { border-color:var(--line); }
  .pr-panel .pr-choice-grid label { color:var(--ink); background:var(--surface-soft); border-color:var(--line); }
  .pr-panel .pr-heading h3,.pr-panel legend,.pr-panel .pr-preview-controls label { color:var(--ink); }
  .pr-panel>.pr-note,.pr-panel .pr-heading p,#prChoices>.pr-note { color:var(--muted); }
  .pr-panel .pr-error { color:var(--danger); background:var(--danger-soft); }
  .pr-panel .pr-preview-label { color:var(--warning); background:var(--warning-soft); }
  @media (max-width:900px) { #control .card-form { padding:18px 16px!important; } }

  /* Personal appearance: modes, selected sidebar colors, images and typography. */
  .appearance-intro { max-width:760px; color:var(--muted); font-size:.92rem; line-height:1.9; margin:8px 0 22px; }
  .appearance-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
  .appearance-mode-card { padding:16px; border:1px solid var(--line-strong); border-radius:18px; background:var(--surface); text-align:start; color:var(--ink); cursor:pointer; box-shadow:none; }
  .appearance-mode-card.active { border-color:var(--accent); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.15); }
  .appearance-mode-art { height:118px; display:flex; gap:9px; padding:14px; border:1px solid rgba(255,255,255,.4); border-radius:11px; background:#e6edf0; margin-bottom:14px; overflow:hidden; }
  .appearance-mode-art span { width:25%; border-radius:7px; background:#f9fbfc; }
  .appearance-mode-art i { flex:1; border-radius:7px; background:linear-gradient(#fff 0 28%,transparent 28% 35%,#f8fafb 35% 100%); }
  .appearance-mode-art-dark { background:radial-gradient(ellipse at 0 0,#414141,transparent 85%),#202020; border-color:#535353; }
  .appearance-mode-art-dark span { background:rgba(255,255,255,.07); }
  .appearance-mode-art-dark i { background:linear-gradient(#3a3a3a 0 28%,transparent 28% 35%,#2d2d2d 35% 100%); }
  .appearance-mode-title { display:block; font-size:1rem; font-weight:700; margin-bottom:4px; }
  .appearance-mode-description { color:var(--muted); font-size:.8rem; line-height:1.7; }
  .appearance-effects-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:18px 0 26px; }
  .appearance-effect-option { display:flex; gap:12px; align-items:center; border:1px solid var(--line); border-radius:12px; padding:15px; background:var(--surface-soft); cursor:pointer; }
  .appearance-effect-option input { width:20px; height:20px; flex-shrink:0; }
  .appearance-effect-option small { display:block; color:var(--muted); font-weight:400; font-size:.75rem; }
  .appearance-background-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:18px 0 26px; }
  .appearance-image-card { border:1px solid var(--line); border-radius:15px; padding:15px; min-width:0; background:var(--surface-soft); }
  .appearance-image-preview { display:grid; place-items:center; height:100px; background:var(--surface-raised); background-size:cover; background-position:center; color:var(--muted); font-size:.78rem; border:1px dashed var(--line-strong); border-radius:10px; margin:12px 0; overflow:hidden; }
  .appearance-image-preview.has-image { color:transparent; border-style:solid; }
  .appearance-image-actions { position:relative; display:flex; gap:8px; flex-wrap:wrap; }
  .appearance-image-actions button,.appearance-image-actions label { flex:1; font-size:.78rem; padding:8px 10px; text-align:center; cursor:pointer; }
  .appearance-image-opacity { display:grid; gap:7px; margin-top:16px; font-size:.8rem; }
  .appearance-image-opacity label { display:flex; justify-content:space-between; gap:10px; font-weight:600; }
  .appearance-image-opacity output { color:var(--accent); font-variant-numeric:tabular-nums; }
  .appearance-image-opacity input[type=range] { width:100%; min-height:28px; padding:0; accent-color:var(--accent); cursor:pointer; }
  .appearance-image-opacity input:disabled { opacity:.4; cursor:not-allowed; }
  .appearance-image-opacity small { color:var(--muted); line-height:1.6; }
  .appearance-file-input { position:absolute; top:0; left:0; width:1px; height:1px; padding:0!important; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
  .appearance-image-actions:focus-within { outline:2px solid var(--accent); outline-offset:4px; border-radius:10px; }
  .appearance-help { color:var(--muted); font-size:.85rem; }
  .appearance-sidebar-selection { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr)); align-items:end; gap:14px; padding:18px; margin:18px 0 26px; border:1px solid var(--line); border-radius:15px; background:var(--surface-soft); }
  .appearance-sidebar-selection .form-group { min-width:0; margin:0; }
  .appearance-sidebar-selection input[type=color] { width:100%; height:44px; padding:4px; border:1px solid var(--line-strong); border-radius:10px; background:var(--field-bg); cursor:pointer; }
  .appearance-sidebar-selection :disabled { opacity:.45; cursor:not-allowed; }
  .appearance-sidebar-preview { grid-column:1/-1; justify-self:start; min-width:180px; max-width:100%; padding:10px 16px; border-radius:12px; background:var(--sidebar-selection-background,var(--accent)); color:var(--sidebar-selection-text,var(--accent-contrast)); text-shadow:var(--sidebar-selection-text-shadow,none); font-weight:600; }
  :root[data-theme="dark"]:not([data-sidebar-selection]) .appearance-sidebar-preview { background:var(--surface-raised); color:var(--ink); }
  .appearance-notice { position:fixed; bottom:22px; inset-inline:22px; margin-inline:auto; max-width:480px; z-index:20000; padding:16px 20px; border:1px solid var(--line); border-radius:14px; color:var(--danger); background:var(--surface-solid); box-shadow:var(--dialog-shadow); font-family:var(--app-font); }
  .appearance-font-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  .appearance-live-preview { background:var(--surface-soft)!important; color:var(--ink); border:1px solid var(--line)!important; border-radius:16px!important; padding:22px!important; margin:18px 0; }
  .appearance-actions { display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:12px; padding-top:18px; border-top:1px solid var(--line); }
  #themeMsg[data-status="success"] { color:var(--success); }
  #themeMsg[data-status="error"] { color:var(--danger); }
  #themeMsg[data-status="preview"] { color:var(--muted); }

  /* Existing sections generate small inline neutral surfaces. Adapt those only
     on screen; status colors, images, report designs and map tiles stay intact. */
  html[data-theme="dark"] :is(.content-section,.modal-content) :is([style*="background:#fff;"],[style*="background: #fff;"],[style$="background:#fff"],[style*="background:#ffffff"],[style*="background: #ffffff"],[style*="background: white"],[style*="background:#f8fafc"],[style*="background: #f8fafc"],[style*="background:#f9fafb"],[style*="background: #f9fafb"],[style*="background:#f1f5f9"],[style*="background: #f1f5f9"]):not(#netQrBox,#netQrBox *,#rptPreviewBody,#rptPreviewBody *,#printableReceipt,#printableReceipt *,#printArea,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { background:var(--surface-soft)!important; }
  html[data-theme="dark"] :is(.content-section,.modal-content,.sp-card,.cl-sheet) :is([style*="color:#0f172a"],[style*="color: #0f172a"],[style*="color:#1e293b"],[style*="color: #1e293b"],[style*="color:#334155"],[style*="color: #334155"],[style*="color:#111827"],[style*="color: #111827"],[style*="color:#1e3a8a"],[style*="color: #1e3a8a"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { color:var(--ink)!important; }
  html[data-theme="dark"] :is(.content-section,.modal-content,.sp-card,.cl-sheet) :is([style*="color:#64748b"],[style*="color: #64748b"],[style*="color:#475569"],[style*="color: #475569"],[style*="color:#6b7280"],[style*="color: #6b7280"],[style*="color:#94a3b8"],[style*="color: #94a3b8"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { color:var(--muted)!important; }
  html[data-theme="dark"] .content-section :is([style*="border:1px solid #e2e8f0"],[style*="border: 1px solid #e2e8f0"],[style*="border:1px solid #cbd5e1"]):not(#netQrBox,#netQrBox *,#rptPreviewBody,#rptPreviewBody *,#printableReceipt,#printableReceipt *,#printArea,#printArea *,#idCardsPrintModal *,#ceSheetPreview,#ceSheetPreview *, .rdz-grid *) { border-color:var(--line)!important; }
  html[data-theme="dark"] .content-section :is([style*="background:#eff6ff"],[style*="background: #eff6ff"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { background:var(--accent-soft)!important; color:var(--ink)!important; border-color:var(--line)!important; }
  html[data-theme="dark"] .content-section :is([style*="background:#fffbeb"],[style*="background: #fffbeb"],[style*="background:#fef3c7"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { background:var(--warning-soft)!important; color:var(--warning)!important; border-color:var(--line)!important; }
  html[data-theme="dark"] .content-section :is([style*="background:#fef2f2"],[style*="background: #fef2f2"],[style*="background:#fee2e2"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { background:var(--danger-soft)!important; color:var(--danger)!important; border-color:var(--line)!important; }
  html[data-theme="dark"] .content-section :is([style*="color:#92400e"],[style*="color: #92400e"],[style*="color:#b45309"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { color:var(--warning)!important; }
  html[data-theme="dark"] .content-section :is([style*="color:#b91c1c"],[style*="color: #b91c1c"],[style*="color:#991b1b"]):not(#netQrBox *,#rptPreviewBody *,#printableReceipt *,#printArea *,#idCardsPrintModal *,#ceSheetPreview *, .rdz-grid *) { color:var(--danger)!important; }
  #rptPreviewBody,#printableReceipt,#printArea,.rdz-grid,#ceSheetPreview,#netQrBox { color-scheme:light; color:#1e293b; background:#fff; --ink:#1e293b; --muted:#64748b; --line:#e2e8f0; --surface-soft:#f1f5f9; --field-bg:#fff; }
  html[data-effects="off"] :is(.sidebar,.mobile-topbar,.card-form,.table-card,.login-card,.login-container,.app-toast,.app-confirm-overlay,.sei-overlay,.sx-overlay,.modal,.modal-content) { backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
  html[data-effects="off"] .sidebar { background-color:var(--surface-solid); }
  html[data-effects="off"] :is(.card-form,.table-card,.sp-card,.stat-card,.oh-kpi,.appearance-mode-card) { background-color:var(--surface-solid); }
  @media (max-width:900px) {
    body { background-attachment:scroll; }
    .dashboard-layout { padding:0; gap:0; }
    .main-content { padding:18px 12px 26px; border-radius:0; }
    .mobile-topbar { background:var(--surface); color:var(--ink); border-bottom:1px solid var(--glass-edge); box-shadow:var(--glass-shadow); backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); }
    .mobile-menu-btn,.mobile-topbar-title { color:var(--ink); }
    .sidebar { border-radius:22px 0 0 22px; padding-top:max(20px,env(safe-area-inset-top)); padding-bottom:max(16px,env(safe-area-inset-bottom)); max-width:calc(100vw - 42px); background-color:var(--surface-solid); }
    [dir="ltr"] .sidebar { border-radius:0 22px 22px 0; }
    .section-header h2,.sp-header h2 { font-size:1.1rem; }
    .card-form,.sp-card { padding:18px; }
    .table-header { padding:15px; }
    .appearance-background-grid { grid-template-columns:1fr; }
    .appearance-font-grid { grid-template-columns:1fr; gap:10px; }
    .appearance-mode-grid,.appearance-effects-grid { gap:10px; }
    .appearance-mode-card { padding:12px; }
    .appearance-mode-art { height:92px; padding:9px; }
    .appearance-effect-option { padding:11px; align-items:flex-start; }
    .sei-dialog,.sx-panel,.modal-content { border-radius:18px; }
  }
  @media (max-width:420px) { .appearance-effects-grid { grid-template-columns:1fr; } .appearance-mode-title { font-size:.9rem; } .appearance-mode-description { font-size:.75rem; } }
  @media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
}
@media print {
  :root,:root[data-theme] {
    color-scheme:light!important;
    --page-bg:#fff; --surface:#fff; --surface-solid:#fff; --surface-raised:#fff; --surface-soft:#f1f5f9; --field-bg:#fff;
    --ink:#111; --muted:#555; --subtle:#555; --line:#bbb; --line-strong:#999;
    --accent:#3349d8; --accent-hover:#253ac2; --accent-rgb:51,73,216; --accent-soft:#e8ecfd; --accent-contrast:#fff;
    --success:#137256; --success-soft:#e4f4ed; --danger:#b93447; --danger-soft:#fce9ed; --warning:#8a5d12; --warning-soft:#fcf2db;
    --glass-blur:none; --glass-shadow:none; --dialog-shadow:none; --glass-edge:#bbb; --glow:none;
    --app-background-image:none!important; --sidebar-background-image:none!important; --button-background-image:none!important;
    --app-text-color:#111; --card-bg:#fff; --text-color:#111; --text-muted:#555; --border-color:#bbb; --input-bg:#fff; --bg-color:#fff;
  }
  .appearance-toggle { display:none!important; }
}

/* Navigation shows the blue & gold line icons in every theme (screen only).
   Each theme keeps its own colors; the icons follow the item's text color. */
.school-menu-icon,.school-menu-label { display:none; }
@media screen {
  .sidebar .menu-label-original { display:none; }
  .school-menu-label { display:block; min-width:0; }
  .school-menu-icon {
    display:block; width:23px; height:23px; flex:0 0 23px;
    fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
    pointer-events:none;
  }
}

/* Blue & gold is an opt-in, screen-only skin. The original palettes above and
   saved image/selection variables remain intact when the user switches back. */
@media screen {
  :root[data-theme="school"] {
    color-scheme:light;
    --page-bg:#edf3fc; --surface:#fff; --surface-solid:#fff; --surface-raised:#fff;
    --surface-soft:#f0f5fd; --field-bg:#f8faff;
    --ink:#102f68; --muted:#55719a; --subtle:#55719a;
    --line:#dfe8f7; --line-strong:#c2d2eb;
    --accent:#2567c9; --accent-hover:#194fa3; --accent-rgb:37,103,201;
    --accent-soft:#e9f1ff; --accent-contrast:#fff;
    --warning:#936006; --warning-soft:#fff3d9;
    --glass-blur:none; --glow:none; --glass-edge:#dfe8f7;
    --glass-shadow:0 5px 0 rgba(16,47,104,.045),0 1px 2px rgba(16,47,104,.025);
    --dialog-shadow:0 22px 60px -22px rgba(16,47,104,.32);
    --elev-2:0 8px 24px -16px rgba(16,47,104,.2);
    --scrim:rgba(8,26,61,.48); --stripe:#f8faff;
    --sidebar-bg:#102f68; --sidebar-hover:#244478; --sidebar-active:#344464;
    --school-gold:#ffb511; --school-blue:#387fec; --school-sidebar-ink:#d4e2fa;
    --radius-lg:22px;
  }
  :root[data-theme="school"] body { background-color:var(--page-bg); background-image:none!important; }
  :root[data-theme="school"] .dashboard-layout { padding:0; gap:0; }
  :root[data-theme="school"] .sidebar {
    width:270px; flex-basis:270px; padding:24px 14px 18px; border:0; border-radius:0;
    color:var(--school-sidebar-ink); background:linear-gradient(165deg,#12336f,#0d224f)!important;
    box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none;
  }
  :root[data-theme="school"] .sidebar-brand { padding:0 10px 16px; gap:12px; background:none!important; }
  :root[data-theme="school"] .sidebar-brand img { width:50px; height:50px; border-radius:13px; flex-shrink:0; }
  :root[data-theme="school"] .sidebar .sidebar-title { color:#fff; font-size:1.08rem; line-height:1.6; font-weight:700; }
  :root[data-theme="school"] .sidebar .user-info {
    color:#c2d5f4; padding:12px 14px; margin:0 4px 18px; background:#ffffff0c!important;
    border:1px solid #ffffff12; border-radius:14px; line-height:1.8;
  }
  :root[data-theme="school"] .sidebar .menu { gap:4px; padding:0 0 12px; margin:0; scrollbar-color:#7f9cc74d transparent; }
  :root[data-theme="school"] .sidebar .menu-item {
    min-height:46px; padding:11px 17px; gap:14px; color:var(--school-sidebar-ink);
    background:transparent; border:1px solid transparent; border-radius:14px;
    font-size:.88rem; line-height:1.6; text-align:start; font-weight:500;
  }
  :root[data-theme="school"] .sidebar .menu-item:not(.active) { color:var(--school-sidebar-ink); background:transparent; }
  :root[data-theme="school"] .sidebar .menu-item:not(.active):hover { color:#fff; background:#ffffff0d; }
  :root[data-theme="school"] .sidebar .menu-item.active {
    color:#fff; background:#344464; border-color:transparent; box-shadow:none; text-shadow:none;
  }
  :root[data-theme="school"] .sidebar .menu-item::before { width:4px; background:var(--school-gold); border-radius:5px; }
  :root[data-theme="school"] .sidebar .menu-item.active::before { height:56%; background:var(--school-gold); opacity:1; }
  :root[data-theme="school"] .sidebar .menu-item:focus-visible { outline:2px solid var(--school-gold); outline-offset:-2px; }
  :root[data-theme="school"] .school-menu-icon { color:#b6cdee; }
  :root[data-theme="school"] .menu-item.active .school-menu-icon { color:var(--school-gold); }
  :root[data-theme="school"] .menu-item:hover .school-menu-icon { color:#fff; }
  :root[data-theme="school"] .menu-item.active:hover .school-menu-icon { color:var(--school-gold); }
  :root[data-theme="school"] .sidebar .zoom-bar { color:#c2d5f4; border-color:#ffffff16; background:#ffffff0a; margin:8px 0; }
  :root[data-theme="school"] .sidebar .zoom-bar button { color:#fff; border-color:#ffffff18; background:#ffffff0c; }
  :root[data-theme="school"] .sidebar .zoom-level { color:#c2d5f4; }
  :root[data-theme="school"] .sidebar .appearance-toggle { color:#e4edff; border-color:#ffffff20; background:#ffffff0c; }
  :root[data-theme="school"] .sidebar .appearance-toggle::before { color:var(--school-gold); }
  :root[data-theme="school"] .sidebar .appearance-toggle:hover { background:#ffffff18; }
  :root[data-theme="school"] .sidebar .btn-logout { color:#ffd9dc; border-color:#ffffff14; background:#ffffff08; }
  :root[data-theme="school"] .sidebar .btn-logout:hover { background:#6c3044; border-color:#e3a1b3; }
  :root[data-theme="school"] .main-content { padding:28px 32px 36px; border-radius:0; }
  :root[data-theme="school"] .content-section > .section-header {
    margin:-28px -32px 26px; padding:22px 32px; min-height:84px; background:#fff;
    border-bottom:1px solid var(--line); box-shadow:none;
  }
  :root[data-theme="school"] .section-header h2 { font-size:1.4rem; color:var(--ink); }
  :root[data-theme="school"] :is(.section-header h2,.sp-header h2)::before { display:none; }
  :root[data-theme="school"] .section-refresh-btn { background:var(--accent-soft); border-color:transparent; color:var(--accent); box-shadow:none; }
  :root[data-theme="school"] :is(.card-form,.table-card,.stat-card,.sp-card,.control-workspace,.ce-card,.cl-card,.cl-section-card,.tl-card,.oh-panel,.oh-kpi,.oh-filterbar) {
    border-color:var(--line); background:#fff; border-radius:22px; box-shadow:var(--glass-shadow);
  }
  :root[data-theme="school"] :is(.card-form,.table-card,.stat-card):hover { box-shadow:var(--glass-shadow); }
  :root[data-theme="school"] .stat-card { border-top:1px solid var(--line)!important; padding:23px; }
  :root[data-theme="school"] .stat-card::before { display:none; }
  :root[data-theme="school"] :is(.stat-value,.stat-number) { color:var(--ink); font-size:2rem; line-height:1.35; }
  :root[data-theme="school"] :is(.stat-label,.stat-title) { color:var(--muted); font-size:.88rem; }
  :root[data-theme="school"] .stat-card :is(.stat-label,.stat-title) { margin-bottom:10px; }
  :root[data-theme="school"] .table-header { border-radius:22px 22px 0 0; }
  :root[data-theme="school"] :is(.subtab-bar,.sp-tabs,.oh-tabs) { gap:6px; border-radius:16px; }
  :root[data-theme="school"] :is(.subtab-bar,.sp-tabs,.oh-tabs) button { border-radius:11px!important; }
  :root[data-theme="school"] :is(.subtab-bar,.sp-tabs,.oh-tabs) button.active,
  :root[data-theme="school"] .sp-tabs button[aria-selected="true"] { color:#fff!important; background:var(--ink)!important; border-color:var(--ink)!important; }
  :root[data-theme="school"] :is(.btn-primary,.sei-button.sei-primary,.sp-button.primary,.sp-button.sp-primary,.cl-btn.cl-primary,.oh-button.oh-primary,#ceDownload,#ceCopy),
  :root[data-theme="school"] #control .btn-primary,
  :root[data-theme="school"] #control .btn-primary:hover { background-image:none!important; }
  :root[data-theme="school"] :is(.btn-primary,.btn-secondary,.sp-button,.sei-button,.cl-btn,.oh-button) { border-radius:11px; }
  :root[data-theme="school"] :is(.modal-content,.conn-modal-box,.cl-sheet,.sei-dialog,.sx-panel,.app-confirm-box) { border-color:var(--line); }
  :root[data-theme="school"] .appearance-sidebar-preview { background:#344464; color:#fff; text-shadow:none; border-inline-start:4px solid var(--school-gold); }
  :root[data-theme="school"] .mobile-topbar { background:#fff; border-bottom-color:var(--line); box-shadow:0 1px 0 var(--line); }
  :root[data-theme="school"] .mobile-menu-btn { color:var(--ink); background:var(--accent-soft); }
  :root[data-theme="school"] .mobile-topbar-title { color:var(--ink); }

  /* Preview artwork is limited to the new choice, never to an existing mode. */
  .appearance-mode-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .appearance-mode-art-school { background:#edf3fc; border-color:#dfe8f7; }
  .appearance-mode-art-school > span { background:#102f68; border-radius:6px; position:relative; }
  .appearance-mode-art-school > span::after { content:""; position:absolute; inset-inline:12%; top:28%; height:14%; border-inline-start:3px solid #ffb511; border-radius:3px; background:#344464; }
  .appearance-mode-art-school > i { background:linear-gradient(#fff 0 29%,transparent 29% 36%,#fff 36% 100%); border-radius:5px; box-shadow:0 2px 0 #102f6809; }
  .appearance-mode-art-school > i:last-child { border-top:3px solid #ffb511; }
  #theme_school_note { border-inline-start:3px solid #ffb511; padding:10px 14px; background:var(--surface-soft); border-radius:9px; }
  #theme_school_note[hidden] { display:none; }

  @media (max-width:1200px) and (min-width:901px) {
    :root[data-theme="school"] .sidebar { width:250px; flex-basis:250px; }
    :root[data-theme="school"] .main-content { padding:24px; }
    :root[data-theme="school"] .content-section > .section-header { margin:-24px -24px 24px; padding:20px 24px; }
  }
  @media (max-width:900px) {
    :root[data-theme="school"] .sidebar { width:280px; flex-basis:auto; padding-top:max(20px,env(safe-area-inset-top)); padding-bottom:max(16px,env(safe-area-inset-bottom)); border-radius:20px 0 0 20px; box-shadow:0 0 36px #081a3d44; }
    :root[data-theme="school"][dir="ltr"] .sidebar { border-radius:0 20px 20px 0; }
    :root[data-theme="school"] .main-content { padding:18px 14px 28px; }
    :root[data-theme="school"] .content-section > .section-header { margin:-18px -14px 20px; padding:18px 14px; min-height:70px; }
    :root[data-theme="school"] .section-header h2 { font-size:1.12rem; }
    :root[data-theme="school"] :is(.card-form,.sp-card,.stat-card) { padding:18px; border-radius:18px; }
  }
  @media (max-width:640px) { .appearance-mode-grid { grid-template-columns:1fr; } }
}