/* Locked desktop public/applicant/staff palette.
 * Only use these families and their derived tints/shades:
 * purple #8155FF
 * blue   #18BFFF
 * green  #3FD97F
 * orange #FF9C55
 * plus the shared white/grey surface and border neutrals.
 * Do not introduce extra desktop accent colors outside this set.
 */
body.sc-public {
    --sc-bg: #ffffff;
    --sc-surface: #ffffff;
    --sc-surface-muted: #f3f5f9;
    --sc-surface-soft: #f8f9fc;
    --sc-border: #e4e8ef;
    --sc-border-strong: #d7dee8;
    --sc-panel-border: color-mix(in srgb, var(--sc-border) 82%, white 18%);
    --sc-panel-border-strong: color-mix(in srgb, var(--sc-border-strong) 86%, white 14%);
    --sc-text: #151a2d;
    --sc-text-muted: #5b6579;
    --sc-meta: color-mix(in srgb, var(--sc-text-muted) 88%, white 12%);
    --sc-primary: #8155ff;
    --sc-primary-hover: #6f43f3;
    --sc-primary-soft: #f3edff;
    --sc-primary-ink: #6b45e8;
    --sc-blue: #18bfff;
    --sc-blue-soft: #e7f9ff;
    --sc-blue-ink: #1093c7;
    --sc-amber: #ff9c55;
    --sc-button-primary-bg: var(--sc-primary);
    --sc-button-primary-bg-hover: var(--sc-primary-hover);
    --sc-button-primary-border: var(--sc-primary-hover);
    --sc-button-primary-ink: #ffffff;
    --sc-button-secondary-bg: var(--sc-surface);
    --sc-button-secondary-bg-hover: #f7f9fc;
    --sc-button-secondary-border: #d2d9e4;
    --sc-button-secondary-border-hover: #bcc6d5;
    --sc-button-secondary-ink: #151a2d;
    --sc-surface-soft-fill: #f6f9fc;
    --sc-surface-soft-fill-strong: #f1f6fb;
    --sc-button-border: #d2d9e4;
    --sc-button-border-strong: #bcc6d5;
    --sc-navy: #202642;
    --sc-success: #3fd97f;
    --sc-success-bg: #ecfcf3;
    --sc-success-border: color-mix(in srgb, var(--sc-success) 24%, white 76%);
    --sc-success-ink: color-mix(in srgb, var(--sc-success) 72%, var(--sc-text) 28%);
    --sc-info: var(--sc-blue);
    --sc-info-bg: #edf8ff;
    --sc-info-border: color-mix(in srgb, var(--sc-blue) 24%, white 76%);
    --sc-info-ink: color-mix(in srgb, var(--sc-blue) 72%, var(--sc-text) 28%);
    --sc-warning: #a85f26;
    --sc-warning-bg: #fff2e8;
    --sc-warning-border: color-mix(in srgb, var(--sc-amber) 24%, white 76%);
    --sc-warning-ink: color-mix(in srgb, var(--sc-amber) 72%, var(--sc-text) 28%);
    --sc-danger: #bf3b5a;
    --sc-danger-bg: #fff1f4;
    --sc-danger-border: color-mix(in srgb, var(--sc-danger) 24%, white 76%);
    --sc-danger-ink: color-mix(in srgb, var(--sc-danger) 72%, var(--sc-text) 28%);
    --sc-purple-bg: #f5f1ff;
    --sc-purple-border: color-mix(in srgb, var(--sc-primary) 24%, white 76%);
    --sc-purple-ink: color-mix(in srgb, var(--sc-primary) 76%, var(--sc-text) 24%);
    --sc-table-head-bg: #f5f8fc;
    --ui-font: "Segoe UI Variable Text", "Segoe UI", "Aptos", "Trebuchet MS", sans-serif;
    --ui-bg: var(--sc-bg);
    --ui-surface: var(--sc-surface);
    --ui-surface-subtle: var(--sc-surface-soft);
    --ui-surface-muted: var(--sc-surface-muted);
    --ui-border: var(--sc-border);
    --ui-border-strong: var(--sc-border-strong);
    --ui-text: var(--sc-text);
    --ui-text-muted: var(--sc-text-muted);
    --ui-primary: var(--sc-primary);
    --ui-primary-hover: var(--sc-primary-hover);
    --ui-primary-soft: var(--sc-primary-soft);
    --ui-primary-ink: var(--sc-primary-ink);
    --ui-accent: var(--sc-blue);
    --ui-accent-soft: var(--sc-blue-soft);
    --ui-accent-ink: var(--sc-blue-ink);
    --ui-success: var(--sc-success);
    --ui-success-bg: var(--sc-success-bg);
    --ui-info: var(--sc-info);
    --ui-info-bg: var(--sc-info-bg);
    --ui-warning: var(--sc-warning);
    --ui-warning-bg: var(--sc-warning-bg);
    --ui-danger: var(--sc-danger);
    --ui-danger-bg: var(--sc-danger-bg);
    --ui-btn-primary-bg: var(--sc-button-primary-bg);
    --ui-btn-primary-bg-hover: var(--sc-button-primary-bg-hover);
    --ui-btn-primary-border: var(--sc-button-primary-border);
    --ui-btn-primary-ink: var(--sc-button-primary-ink);
    --ui-btn-secondary-bg: var(--sc-button-secondary-bg);
    --ui-btn-secondary-bg-hover: var(--sc-button-secondary-bg-hover);
    --ui-btn-secondary-border: var(--sc-button-secondary-border);
    --ui-btn-secondary-border-hover: var(--sc-button-secondary-border-hover);
    --ui-btn-secondary-ink: var(--sc-button-secondary-ink);
    --ui-surface-soft-fill: var(--sc-surface-soft-fill);
    --ui-surface-soft-fill-strong: var(--sc-surface-soft-fill-strong);
    --ui-radius-control: 18px;
    --ui-radius-panel: 18px;
    --ui-radius-panel-lg: 24px;
    --ui-radius-panel-muted: 16px;
    --ui-radius-pill: 999px;
    --ui-height-control: 36px;
    --ui-height-chip: 1.7rem;
    --ui-pad-compact: 0.9rem;
    --ui-pad-panel: 1rem;
    --ui-pad-panel-lg: 1.25rem;
    --ui-control-padding-x: 12px;
    --ui-pad-card: 0.95rem;
    --ui-pad-card-compact: 0.82rem;
    --ui-space-1: 6px;
    --ui-space-2: 12px;
    --ui-space-3: 16px;
    --ui-space-4: 20px;
    --ui-size-display: 2.35rem;
    --ui-size-title: 1.42rem;
    --ui-size-section: 0.98rem;
    --ui-size-body: 0.83rem;
    --ui-size-small: 0.73rem;
    --ui-size-label: 0.73rem;
    --ui-size-meta: 0.68rem;
    --ui-line-display: 1.06;
    --ui-line-title: 1.1;
    --ui-line-section: 1.28;
    --ui-line-body: 1.52;
    --ui-line-small: 1.42;
    --ui-line-label: 1.3;
    --ui-line-meta: 1.28;
    font-family: "Segoe UI Variable Text", "Segoe UI", "Aptos", "Trebuchet MS", sans-serif;
    background: var(--sc-bg);
    color: var(--sc-text);
  }

.portal-shell.staff-theme,
.portal-shell.app-auth-body{
  --staff-bg:#070d16;
  --staff-bg-soft:#f5f9ff;
  --staff-shell:#ffffff;
  --staff-surface:rgba(255,255,255,.96);
  --staff-surface-raised:#ffffff;
  --staff-surface-soft:#edf5ff;
  --staff-line:rgba(129,149,180,.18);
  --staff-line-strong:rgba(129,149,180,.28);
  --staff-border:#dde6f3;
  --staff-text:#18263b;
  --staff-muted:#667792;
  --staff-navy:#10233a;
  --staff-primary:#0a84ff;
  --staff-primary-deep:#006fd6;
  --staff-blue:#0a84ff;
  --staff-blue-soft:#e9f4ff;
  --staff-accent-ink:#0b63ce;
  --staff-azure:#56a8ff;
  --staff-azure-soft:#edf5ff;
  --staff-azure-ink:#2f74c9;
  --staff-button-primary-bg:var(--staff-blue);
  --staff-button-primary-bg-hover:var(--staff-primary-deep);
  --staff-button-primary-border:var(--staff-primary-deep);
  --staff-button-primary-ink:#ffffff;
  --staff-button-secondary-bg:#ffffff;
  --staff-button-secondary-bg-hover:var(--staff-azure-soft);
  --staff-button-secondary-border:#b9cde3;
  --staff-button-secondary-border-hover:#95b6d8;
  --staff-button-secondary-ink:#284968;
  --staff-orange:#f59e0b;
  --staff-orange-soft:#fff4dc;
  --staff-success:#146c43;
  --staff-success-soft:#edf8f2;
  --staff-warning:#8f5d00;
  --staff-warning-soft:#fff5df;
  --staff-danger:#b4233f;
  --staff-danger-soft:#fff1f2;
  --staff-red:#e25555;
  --staff-red-soft:#fff0ee;
  --staff-purple:#56a8ff;
  --staff-shadow:none;
  --staff-card-shadow:none;
  --staff-card-shadow-soft:none;
  --staff-shell-gradient:
    radial-gradient(circle at 12% 12%, rgba(10,132,255,.18), transparent 22%),
    radial-gradient(circle at 88% 18%, rgba(86,168,255,.14), transparent 20%),
    linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  --staff-topbar-gradient:linear-gradient(135deg, #09111a 0%, #102033 56%, #0a84ff 100%);
  --staff-bottom-nav-bg:linear-gradient(180deg, rgba(10,21,37,.96) 0%, rgba(16,35,58,.98) 100%);
  --staff-app-width:408px;
  --staff-shell-width:408px;
  --staff-font:"Aptos","Segoe UI Variable Text","Segoe UI","Trebuchet MS",sans-serif;
  --ui-font:var(--staff-font);
  --ui-bg:var(--staff-bg-soft);
  --ui-surface:#ffffff;
  --ui-surface-muted:var(--staff-azure-soft);
  --ui-border:var(--staff-border);
  --ui-border-strong:var(--staff-line-strong);
  --ui-text:var(--staff-text);
  --ui-text-muted:var(--staff-muted);
  --ui-primary:var(--staff-blue);
  --ui-primary-hover:var(--staff-primary-deep);
  --ui-primary-soft:var(--staff-blue-soft);
  --ui-primary-ink:var(--staff-accent-ink);
  --ui-accent:var(--staff-azure);
  --ui-accent-soft:var(--staff-azure-soft);
  --ui-accent-ink:var(--staff-azure-ink);
  --ui-success:var(--staff-success);
  --ui-success-bg:var(--staff-success-soft);
  --ui-warning:var(--staff-warning);
  --ui-warning-bg:var(--staff-warning-soft);
  --ui-danger:var(--staff-danger);
  --ui-danger-bg:var(--staff-danger-soft);
  --ui-btn-primary-bg:var(--staff-button-primary-bg);
  --ui-btn-primary-bg-hover:var(--staff-button-primary-bg-hover);
  --ui-btn-primary-border:var(--staff-button-primary-border);
  --ui-btn-primary-ink:var(--staff-button-primary-ink);
  --ui-btn-secondary-bg:var(--staff-button-secondary-bg);
  --ui-btn-secondary-bg-hover:var(--staff-button-secondary-bg-hover);
  --ui-btn-secondary-border:var(--staff-button-secondary-border);
  --ui-btn-secondary-border-hover:var(--staff-button-secondary-border-hover);
  --ui-btn-secondary-ink:var(--staff-button-secondary-ink);
  --ui-radius-control: 18px;
  --ui-radius-panel: 18px;
  --ui-radius-panel-muted: 16px;
  --ui-height-control: 36px;
  --ui-space-1: 6px;
  --ui-space-2: 12px;
  --ui-space-3: 16px;
  --ui-space-4: 20px;
  --ui-size-display: 2.35rem;
  --ui-size-title: 1.42rem;
  --ui-size-section: 0.98rem;
  --ui-size-body: 0.83rem;
  --ui-size-small: 0.73rem;
  --ui-size-label: 0.73rem;
  --ui-line-display: 1.06;
  --ui-line-title: 1.12;
  --ui-line-section: 1.32;
  --ui-line-body: 1.5;
  --ui-line-small: 1.45;
  --ui-line-label: 1.35;
  --ui-line-meta: 1.35;
}
.portal-shell.staff-theme,
.portal-shell.staff-theme :where(input,select,textarea,button),
.portal-shell.app-auth-body,
.portal-shell.app-auth-body :where(input,select,textarea,button){
  font-family:var(--staff-font);
}
