/*
 * Alwaleed page identity layer.
 *
 * Every screen owns one decorative accent. Semantic colors (success, warning,
 * danger, assessment results, subjects, levels and category sequences) keep
 * their own meaning and are deliberately not aliased to these tokens.
 * This file is screen-only so approved A4/PDF output remains unchanged.
 */
@media screen {
  [data-aw-theme] {
    --aw-page-accent: var(--seq-1);
    --aw-page-deep: var(--seq-1-deep);
    --aw-page-rgb: var(--seq-1-rgb);
    --aw-page-soft: var(--seq-1-soft);
    --aw-page-tint: var(--seq-1-tint);
    --aw-page-line: rgba(var(--aw-page-rgb), .20);
    --aw-page-line-strong: rgba(var(--aw-page-rgb), .38);
    --aw-page-muted: color-mix(in srgb, var(--aw-page-deep) 66%, #879298);
    --aw-page-shadow: 0 18px 42px -28px rgba(var(--aw-page-rgb), .42);
    --aw-page-fill: linear-gradient(135deg,
      var(--aw-page-deep),
      color-mix(in srgb, var(--aw-page-deep) 88%, var(--aw-page-accent)));
  }

  [data-aw-theme="plan"] {
    --aw-page-accent: var(--seq-1);
    --aw-page-deep: var(--seq-1-deep);
    --aw-page-rgb: var(--seq-1-rgb);
    --aw-page-soft: var(--seq-1-soft);
    --aw-page-tint: var(--seq-1-tint);
  }

  [data-aw-theme="saved"] {
    --aw-page-accent: var(--seq-2);
    --aw-page-deep: var(--seq-2-deep);
    --aw-page-rgb: var(--seq-2-rgb);
    --aw-page-soft: var(--seq-2-soft);
    --aw-page-tint: var(--seq-2-tint);
  }

  [data-aw-theme="evaluation"] {
    --aw-page-accent: var(--seq-3);
    --aw-page-deep: var(--seq-3-deep);
    --aw-page-rgb: var(--seq-3-rgb);
    --aw-page-soft: var(--seq-3-soft);
    --aw-page-tint: var(--seq-3-tint);
  }

  [data-aw-theme="reports"] {
    --aw-page-accent: var(--seq-4);
    --aw-page-deep: var(--seq-4-deep);
    --aw-page-rgb: var(--seq-4-rgb);
    --aw-page-soft: var(--seq-4-soft);
    --aw-page-tint: var(--seq-4-tint);
  }

  [data-aw-theme="admin"] {
    --aw-page-accent: var(--seq-5);
    --aw-page-deep: var(--seq-5-deep);
    --aw-page-rgb: var(--seq-5-rgb);
    --aw-page-soft: var(--seq-5-soft);
    --aw-page-tint: var(--seq-5-tint);
    --vision-brand: var(--aw-page-deep);
    --vision-brand-2: var(--aw-page-accent);
    --brand: var(--aw-page-deep);
    --brand-2: var(--aw-page-accent);
  }

  [data-aw-theme="dashboard"] {
    --aw-page-accent: var(--seq-6);
    --aw-page-deep: var(--seq-6-deep);
    --aw-page-rgb: var(--seq-6-rgb);
    --aw-page-soft: var(--seq-6-soft);
    --aw-page-tint: var(--seq-6-tint);
  }

  [data-aw-theme="print-center"] {
    --aw-page-accent: var(--seq-7);
    --aw-page-deep: var(--seq-7-deep);
    --aw-page-rgb: var(--seq-7-rgb);
    --aw-page-soft: var(--seq-7-soft);
    --aw-page-tint: var(--seq-7-tint);
  }

  [data-aw-theme="services"] {
    --aw-page-accent: var(--seq-8);
    --aw-page-deep: var(--seq-8-deep);
    --aw-page-rgb: var(--seq-8-rgb);
    --aw-page-soft: var(--seq-8-soft);
    --aw-page-tint: var(--seq-8-tint);
  }

  [data-aw-theme="guardian"] {
    --aw-page-accent: #c79a45;
    --aw-page-deep: #8b6929;
    --aw-page-rgb: 199, 154, 69;
    --aw-page-soft: #efe4ca;
    --aw-page-tint: #fbf8ef;
  }

  /* Shared page chrome. The spectrum line remains controlled by
     --aw-identity-spectrum in alwaleed-header.css and is never recolored. */
  [data-aw-theme] .nh-head {
    --acc: var(--aw-page-accent);
  }

  [data-aw-theme] :is(.nh-ic, .nh-home) {
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 25px -15px rgba(var(--aw-page-rgb), .72) !important;
  }

  [data-aw-theme] .nh-tool .dot-badge {
    background: var(--aw-page-deep) !important;
  }

  [data-aw-theme] .nh-logo {
    border-color: rgba(var(--aw-page-rgb), .18) !important;
    box-shadow: 0 12px 30px -22px rgba(var(--aw-page-rgb), .55) !important;
  }

  [data-aw-theme] :where(button, a, input, select, textarea, [tabindex]):focus-visible {
    outline-color: rgba(var(--aw-page-rgb), .56);
  }

  [data-aw-theme]::-webkit-scrollbar-thumb,
  [data-aw-theme] .screen-body::-webkit-scrollbar-thumb,
  [data-aw-theme] .adm-panel::-webkit-scrollbar-thumb,
  [data-aw-theme] .admin-tabs::-webkit-scrollbar-thumb {
    background: rgba(var(--aw-page-rgb), .24) !important;
    background-clip: padding-box !important;
  }

  [data-aw-theme]::-webkit-scrollbar-thumb:hover,
  [data-aw-theme] .screen-body::-webkit-scrollbar-thumb:hover,
  [data-aw-theme] .adm-panel::-webkit-scrollbar-thumb:hover,
  [data-aw-theme] .admin-tabs::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--aw-page-rgb), .44) !important;
    background-clip: padding-box !important;
  }

  .screen[data-aw-theme] {
    background:
      radial-gradient(circle at 10% 4%, rgba(var(--aw-page-rgb), .075), transparent 32%),
      linear-gradient(180deg, rgba(255,255,255,.98), var(--aw-page-tint));
  }

  /* Empty states are page chrome, not a semantic category. */
  :is(#modal-recent, #modal-eval, #modal-codes, #modal-admin) .empty-state {
    --card-accent: var(--aw-page-accent);
    --nested-card-accent: var(--aw-page-accent);
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  :is(#modal-recent, #modal-eval, #modal-codes, #modal-admin) .empty-state .icon {
    color: var(--aw-page-accent) !important;
    background: linear-gradient(135deg, var(--aw-page-accent), var(--aw-page-deep)) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
  }

  :is(#modal-recent, #modal-eval, #modal-codes, #modal-admin) .empty-state .icon svg {
    color: var(--aw-page-accent) !important;
    stroke: currentColor !important;
  }

  /* Saved plans — seq 2. Plan/evaluation/status/subject colors stay semantic. */
  #recent-body :is(.saved-grade-head, .saved-lesson-card, .saved-metric:not(.done), .saved-subj-score) {
    border-color: var(--aw-page-line) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #recent-body :is(.saved-grade-head, .saved-lesson-card) {
    background:
      radial-gradient(circle at 11% 10%, rgba(var(--aw-page-rgb), .10), transparent 35%),
      linear-gradient(180deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  #recent-body .saved-lesson-card.open {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 24px 56px -30px rgba(var(--aw-page-rgb), .54) !important;
  }

  #recent-body .saved-grade-toggle,
  #recent-body .saved-grade-section.open .saved-grade-toggle,
  #recent-body .saved-lesson-arrow,
  #recent-body .sp-back {
    color: var(--aw-page-deep) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #recent-body .saved-grade-toggle i {
    color: var(--aw-page-accent) !important;
  }

  #recent-body :is(.sp-open, .saved-open) {
    color: #fff !important;
    border-color: transparent !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.17), transparent 44%),
      var(--aw-page-fill) !important;
    box-shadow: 0 15px 30px -13px rgba(var(--aw-page-rgb), .72) !important;
  }

  #recent-body :is(.saved-sum, .saved-grade-kpi) {
    border-inline-color: var(--aw-page-line) !important;
    border-bottom-color: var(--aw-page-line) !important;
  }

  #recent-body :is(.saved-open, .sp-open):hover {
    box-shadow: 0 16px 34px -24px rgba(var(--aw-page-rgb), .62) !important;
  }

  #recent-body .saved-grade-progress {
    color: var(--aw-page-deep) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #recent-body .saved-lesson-no {
    background: var(--aw-page-fill) !important;
    box-shadow: 0 13px 25px -17px rgba(var(--aw-page-rgb), .70) !important;
  }

  #recent-body :is(.saved-subj-score:not(.eval) i em, .saved-metric.plan .saved-meter i) {
    background: var(--aw-page-fill) !important;
  }

  #recent-body :is(.saved-subj-score i, .saved-meter) {
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #recent-body .saved-metric.done {
    --nested-card-accent: #15803d;
    border-color: rgba(21,128,61,.26) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(220,252,231,.92)) !important;
  }

  #recent-body .saved-chip.missing {
    --nested-card-accent: #d97559;
    color: #a94933 !important;
    border-color: rgba(217,117,89,.34) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,238,235,.94)) !important;
  }

  #recent-body .saved-chip.plan {
    --nested-card-accent: #15803d;
    color: #15803d !important;
    border-color: rgba(21,128,61,.26) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(220,252,231,.92)) !important;
  }

  #recent-body .saved-chip.missing:hover {
    border-color: rgba(217,117,89,.48) !important;
    box-shadow: 0 16px 34px -24px rgba(217,117,89,.40) !important;
  }

  #recent-body .saved-chip.plan:hover {
    border-color: rgba(21,128,61,.40) !important;
    box-shadow: 0 16px 34px -24px rgba(21,128,61,.36) !important;
  }

  /* Student evaluation — seq 3. Result buttons retain green/orange/red. */
  #ev-body :is(.saved-grade-head, .eval-workbench, .saved-subj-score, .eval-result-panel, .ev-rbtn, .ev-chip) {
    border-color: var(--aw-page-line) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #ev-body :is(.saved-grade-head, .ev-lesson-card, .eval-workbench) {
    background:
      radial-gradient(circle at 11% 10%, rgba(var(--aw-page-rgb), .10), transparent 35%),
      linear-gradient(180deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  #ev-body .saved-grade-head {
    border-inline-start-color: var(--aw-page-accent) !important;
  }

  #ev-body :is(.saved-grade-toggle, .saved-lesson-arrow) {
    color: var(--aw-page-deep) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #ev-body .saved-grade-toggle i {
    color: var(--aw-page-accent) !important;
  }

  #ev-body .ev-lesson-no {
    color: #fff !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 14px 25px -16px rgba(var(--aw-page-rgb), .72) !important;
  }

  #ev-body :is(.eval-workbench-progress b, .saved-grade-progress) {
    color: var(--aw-page-deep) !important;
  }

  #ev-body .saved-grade-progress {
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #ev-body .eval-result-panel {
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  #ev-body :is(.saved-sum, .saved-grade-kpi, .eval-live-kpis span) {
    border-inline-color: var(--aw-page-line) !important;
    border-bottom-color: var(--aw-page-line) !important;
  }

  /* Re-assert assessment semantics after the general surface rules. */
  #ev-body .ev-rbtn.green.active,
  #ev-body .ev-chip.green { border-color: rgba(21,128,61,.30) !important; }
  #ev-body .ev-rbtn.orange.active,
  #ev-body .ev-chip.orange { border-color: rgba(194,65,12,.30) !important; }
  #ev-body .ev-rbtn.red.active,
  #ev-body .ev-chip.red { border-color: rgba(185,28,28,.26) !important; }

  #ev-body .ev-lesson-card.complete { border-color: rgba(21,128,61,.28) !important; }
  #ev-body .ev-lesson-card.partial { border-color: rgba(194,139,38,.28) !important; }
  #ev-body .ev-lesson-card.todo { border-color: rgba(211,101,84,.24) !important; }

  /* Access codes — seq 5. The guardian group remains gold as a category. */
  :is(#modal-codes, #admin-codes-host) :is(.codes-intro, .code-card, .codes-toolbar, .codes-search, .cdc-gen, .cdc-edit) {
    border-color: var(--aw-page-line) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.code-card, .codes-intro) {
    --nested-card-accent: var(--aw-page-accent);
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  :is(#modal-codes, #admin-codes-host) .codes-intro {
    color: var(--aw-page-muted) !important;
  }

  :is(#modal-codes, #admin-codes-host) .codes-intro::after {
    --neb-icon-bg: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint));
    --neb-icon-border: var(--aw-page-line);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f8fb0' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15.2' r='3.4'/%3E%3Cpath d='M10.4 12.8 19 4.2M16 7.2l2.4 2.4M13.6 9.6l2 2'/%3E%3C/svg%3E"), var(--neb-icon-bg) !important;
    border-color: var(--aw-page-line) !important;
    box-shadow: 0 10px 22px -16px rgba(var(--aw-page-rgb), .45) !important;
  }

  :is(#modal-codes, #admin-codes-host) .chb-card:not(.gold) {
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(160deg, #fff 40%, var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  :is(#modal-codes, #admin-codes-host) .chb-card:not(.gold):is(:hover, :focus-visible) {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 18px 38px -25px rgba(var(--aw-page-rgb), .56) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.cdc-nm, .chb-card:not(.gold) .chb-t) {
    color: var(--aw-page-deep) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.cdc-role, .chb-card:not(.gold) .chb-d) {
    color: var(--aw-page-muted) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.cdc-av:not(.guardian), .chb-card:not(.gold) .chb-ic) {
    color: #fff !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 13px 26px -16px rgba(var(--aw-page-rgb), .72) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.cdc-code:not(.copied), .codes-back, .chb-card:not(.gold) .chb-n) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: rgba(var(--aw-page-rgb), .09) !important;
  }

  :is(#modal-codes, #admin-codes-host) .codes-search:focus {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 0 0 4px rgba(var(--aw-page-rgb), .11) !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.cdc-gen, .cdc-edit) {
    color: var(--aw-page-deep) !important;
    background: #fff !important;
  }

  :is(#modal-codes, #admin-codes-host) :is(.code-card, .cdc-code:not(.copied), .cdc-gen, .cdc-edit):hover {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
    background: rgba(var(--aw-page-rgb), .09) !important;
    box-shadow: 0 16px 34px -24px rgba(var(--aw-page-rgb), .55) !important;
  }

  :is(#modal-codes, #admin-codes-host) .cdc-code.copied {
    color: #15803d !important;
    border-color: #15803d !important;
    background: #dcfce7 !important;
  }

  /* Administration — seq 5. KPI sequence and readiness statuses are protected. */
  #modal-admin .admin-tabs {
    border-color: var(--aw-page-line) !important;
  }

  #modal-admin .admin-console {
    color: var(--aw-page-deep) !important;
  }

  #modal-admin .admin-tab::before {
    border-color: var(--aw-page-line) !important;
  }

  #modal-admin .admin-tab:not(.active) {
    color: var(--aw-page-muted) !important;
  }

  #modal-admin .admin-tab.active {
    color: #fff !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 11px 24px rgba(var(--aw-page-rgb), .24) !important;
  }

  #modal-admin .admin-tab.active[data-tab]::before {
    border-color: rgba(255,255,255,.34) !important;
    box-shadow: 0 9px 20px -13px rgba(var(--aw-page-rgb), .72) !important;
  }

  #modal-admin :is(.adm-hero, .adm-panel, .adm-card:not(.adm-kpi), .adm-bulk-form, .adm-mini-form) {
    border-color: var(--aw-page-line) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-admin :is(.adm-panel, .adm-card:not(.adm-kpi)) {
    --card-accent: var(--aw-page-accent);
    background:
      linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  #modal-admin .adm-hero {
    --card-accent: var(--aw-page-accent);
    background:
      linear-gradient(135deg, rgba(var(--aw-page-rgb), .10), rgba(255,255,255,.94) 52%),
      #fff !important;
  }

  #modal-admin .adm-hero h3::before {
    color: #fff !important;
    border-color: var(--aw-page-line-strong) !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 26px -16px rgba(var(--aw-page-rgb), .68) !important;
  }

  #modal-admin .adm-panel-head h4::before {
    --neb-icon-bg: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint));
    --neb-icon-border: var(--aw-page-line);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f8fb0' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.4' y='4.6' width='15.2' height='14.8' rx='2.3'/%3E%3Cpath d='M4.4 9.4h15.2M9.4 9.4v10'/%3E%3C/svg%3E"), var(--neb-icon-bg) !important;
    border-color: var(--aw-page-line) !important;
    box-shadow: 0 10px 22px -16px rgba(var(--aw-page-rgb), .45) !important;
  }

  #modal-admin :is(.adm-hero h3, .adm-panel h4, .adm-panel h5, .adm-card:not(.adm-kpi) h4, .adm-card:not(.adm-kpi) h5, .adm-class-row, .adm-class-row b, .adm-line b, .adm-student-main b, .adm-bulk-copy h4) {
    color: var(--aw-page-deep) !important;
  }

  #modal-admin :is(.adm-hero p, .adm-panel-head p, .adm-class-row > span, .adm-class-row > i, .adm-line > span, .adm-student-main > span, .adm-form-grid label, .adm-mini-form label, .adm-bulk-form label, .adm-bulk-copy p, .adm-form-hint, .adm-issue span, .adm-empty, .adm-loading) {
    color: var(--aw-page-muted) !important;
  }

  #modal-admin :is(.adm-tools select, .adm-filters input, .adm-filters select, .adm-form-grid input, .adm-form-grid select, .adm-mini-form input, .adm-mini-form select, .adm-bulk-form select, .adm-bulk-form textarea) {
    color: var(--aw-page-deep) !important;
  }

  #modal-admin :is(.adm-mini.primary, .adm-mini[data-admin-action="refresh"]) {
    color: #fff !important;
    border-color: transparent !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 24px -16px rgba(var(--aw-page-rgb), .74) !important;
  }

  #modal-admin .adm-class-row.selected {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: inset 4px 0 0 var(--aw-page-accent), var(--aw-page-shadow) !important;
    background: rgba(var(--aw-page-rgb), .07) !important;
  }

  #modal-admin :is(.adm-filters input, .adm-filters select, .adm-tools select, .adm-form-grid input, .adm-form-grid select, .adm-mini-form input, .adm-mini-form select, .adm-bulk-form select, .adm-bulk-form textarea) {
    border-color: var(--aw-page-line) !important;
  }

  #modal-admin :is(.adm-filters input, .adm-filters select, .adm-tools select, .adm-form-grid input, .adm-form-grid select, .adm-mini-form input, .adm-mini-form select, .adm-bulk-form select, .adm-bulk-form textarea):focus {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 0 0 4px rgba(var(--aw-page-rgb), .10) !important;
  }

  #modal-admin :is(.adm-class-row, .adm-data-row, .adm-line) {
    border-color: var(--aw-page-line) !important;
    background:
      linear-gradient(90deg, rgba(var(--aw-page-rgb), .055), rgba(255,255,255,0) 36%),
      rgba(255,255,255,.84) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-admin :is(.adm-class-row, .adm-data-row, .adm-line):hover {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 18px 38px -26px rgba(var(--aw-page-rgb), .52) !important;
  }

  #modal-admin :is(.adm-student-row.is-off, .adm-staff-row.is-off) {
    border-color: rgba(113,129,125,.22) !important;
    background:
      linear-gradient(90deg, rgba(113,129,125,.10), rgba(255,255,255,0) 36%),
      rgba(255,255,255,.76) !important;
    box-shadow: 0 10px 26px -22px rgba(82,96,92,.26) !important;
  }

  #modal-admin :is(.adm-empty, .adm-loading) {
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  #modal-admin .adm-mini-form {
    background: rgba(var(--aw-page-rgb), .045) !important;
  }

  #modal-admin .adm-bulk-form {
    --nested-card-accent: var(--aw-page-accent);
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-admin .adm-panel.adm-bulk-card {
    background:
      linear-gradient(135deg, rgba(var(--aw-page-rgb), .12), rgba(var(--aw-page-rgb), .045) 48%, rgba(255,255,255,.96) 49%),
      rgba(255,255,255,.94) !important;
  }

  #modal-admin .adm-bulk-glow {
    background: var(--aw-page-fill) !important;
  }

  #modal-admin :is(.adm-bulk-steps span, .adm-student-stats span, .adm-bulk-meta span) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: 0 10px 26px -22px rgba(var(--aw-page-rgb), .40) !important;
  }

  #modal-admin .adm-selection-note {
    --nested-card-accent: #c79a45;
    color: #735c24 !important;
    border-color: rgba(199,154,69,.28) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,248,229,.94)) !important;
    box-shadow: 0 10px 26px -22px rgba(199,154,69,.38) !important;
  }

  #modal-admin .adm-row-metrics span {
    color: #735c24 !important;
    border-color: rgba(199,154,69,.24) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,248,229,.92)) !important;
    box-shadow: 0 10px 26px -22px rgba(199,154,69,.34) !important;
  }

  #modal-admin .adm-issue:not(.warn):not(.danger) {
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(90deg, rgba(var(--aw-page-rgb), .07), rgba(255,255,255,0) 36%), rgba(255,255,255,.88) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-admin .adm-issue.warn {
    border-color: rgba(199,154,69,.38) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,248,229,.92)) !important;
    box-shadow: 0 12px 28px -24px rgba(199,154,69,.38) !important;
  }

  #modal-admin .adm-issue.danger {
    border-color: rgba(217,117,89,.38) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,238,235,.92)) !important;
    box-shadow: 0 12px 28px -24px rgba(217,117,89,.38) !important;
  }

  #modal-admin .adm-flash:not(.bad) {
    color: #15803d !important;
    border-color: rgba(21,128,61,.24) !important;
    background: rgba(220,252,231,.92) !important;
  }

  #modal-admin .adm-mini:not(.primary):not(.danger) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #modal-admin .adm-select-cell input:checked + span {
    border-color: var(--aw-page-deep) !important;
    background:
      linear-gradient(135deg, transparent 43%, #fff 44% 56%, transparent 57%),
      linear-gradient(45deg, transparent 47%, #fff 48% 60%, transparent 61%),
      var(--aw-page-deep) !important;
  }

  #modal-admin .adm-select-cell input:not(:disabled):not(:checked) + span {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: inset 0 1px 2px rgba(var(--aw-page-rgb), .10) !important;
  }

  #modal-admin .adm-code-chip {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
    background: var(--aw-page-tint) !important;
  }

  #modal-admin .adm-code-chip:hover {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-accent) !important;
    background: #fff !important;
    box-shadow: 0 12px 26px -20px rgba(var(--aw-page-rgb), .52) !important;
  }

  #modal-admin .adm-staff-row.is-manager {
    border-color: rgba(199,154,69,.24) !important;
    box-shadow: inset 4px 0 0 rgba(199,154,69,.72) !important;
  }

  #modal-admin .adm-staff-row.is-protected {
    border-color: rgba(8,118,107,.28) !important;
    box-shadow: inset 4px 0 0 #08766b, 0 14px 30px rgba(8,118,107,.08) !important;
  }

  #modal-admin .nbr-ready-hero:not(.attention) {
    --hero-a: var(--aw-page-deep);
    --hero-b: var(--aw-page-accent);
    box-shadow: 0 20px 50px rgba(var(--aw-page-rgb), .20) !important;
  }

  #modal-admin .nbr-ready-hero:not(.attention) .nbr-ready-score {
    background:
      radial-gradient(circle closest-side, color-mix(in srgb, var(--aw-page-deep) 91%, #102f3a) 78%, transparent 80% 99%),
      conic-gradient(#fff calc(var(--score) * 1%), rgba(255,255,255,.25) 0) !important;
  }

  #modal-admin :is(.nbr-ready-section, .nbr-class-card:not(.warn), .nbr-placement-row, .nbr-issue-row, .nbr-teacher-row:not(.warn), .nbr-teacher-metrics span, .nbr-health-matrix > div, .nbr-ready-loading) {
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-admin :is(.nbr-section-head h4, .nbr-class-head h5, .nbr-class-progress b, .nbr-placement-row b, .nbr-issue-row b, .nbr-issue-row strong, .nbr-teacher-row b, .nbr-health-matrix b) {
    color: var(--aw-page-deep) !important;
  }

  #modal-admin :is(.nbr-section-head p, .nbr-class-head p, .nbr-class-progress > div:first-child, .nbr-placement-row span, .nbr-issue-row span, .nbr-teacher-row span, .nbr-health-matrix span, .nbr-ready-loading) {
    color: var(--aw-page-muted) !important;
  }

  #modal-admin .nbr-progress-track {
    background: rgba(var(--aw-page-rgb), .12) !important;
  }

  #modal-admin .nbr-class-card:not(.warn) .nbr-progress-track i {
    background: var(--aw-page-fill) !important;
  }

  #modal-admin .nbr-ready-stat:not(.warn):not(.danger) {
    box-shadow: 0 10px 27px -20px color-mix(in srgb, var(--ready-accent) 52%, transparent) !important;
  }

  #modal-admin .nbr-ready-stat:not(.warn):not(.danger):hover {
    box-shadow: 0 17px 34px -22px color-mix(in srgb, var(--ready-accent) 64%, transparent) !important;
  }

  #modal-admin .nbr-ready-stat.warn {
    box-shadow: 0 12px 28px -23px rgba(199,154,69,.46) !important;
  }

  #modal-admin .nbr-ready-stat.danger {
    box-shadow: 0 12px 28px -23px rgba(217,117,89,.46) !important;
  }

  #modal-admin :is(.nbr-section-head > button, .nbr-link-btn, .nbr-pending-action button, .nbr-missing-row button, .nbr-placement-row button, .nbr-more) {
    color: #fff !important;
    border-color: transparent !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 23px -17px rgba(var(--aw-page-rgb), .68) !important;
  }

  #modal-admin .nbr-teacher-row > button {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
    background: #fff !important;
  }

  #modal-admin .nbr-count:not(.warn) {
    color: var(--aw-page-deep) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  #modal-admin .nbr-issue-row strong {
    color: var(--aw-page-deep) !important;
  }

  #modal-admin .nbr-ready-loading i {
    border-color: rgba(var(--aw-page-rgb), .18) !important;
    border-top-color: var(--aw-page-accent) !important;
  }

  #modal-admin .nbr-assignment-hint {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: rgba(var(--aw-page-rgb), .09) !important;
  }

  #modal-admin :is(.adm-class-row, .adm-line)::after {
    color: var(--aw-page-accent) !important;
    background-color: var(--aw-page-accent) !important;
    background-image: none !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m14.8 6.7-6 5.3 6 5.3-1.6 1.8L5.2 12l8-7.1 1.6 1.8Z'/%3E%3C/svg%3E") center/64% no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m14.8 6.7-6 5.3 6 5.3-1.6 1.8L5.2 12l8-7.1 1.6 1.8Z'/%3E%3C/svg%3E") center/64% no-repeat !important;
  }

  #modal-admin .adm-empty::before {
    color: var(--aw-page-accent) !important;
    background-color: var(--aw-page-accent) !important;
    background-image: none !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m9.4 17.8-5-5 1.8-1.8 3.2 3.2 8.4-8.4 1.8 1.8-10.2 10.2Z'/%3E%3C/svg%3E") center/60% no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m9.4 17.8-5-5 1.8-1.8 3.2 3.2 8.4-8.4 1.8 1.8-10.2 10.2Z'/%3E%3C/svg%3E") center/60% no-repeat !important;
  }

  #modal-admin .adm-profile-av:not(.student) {
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 24px -16px rgba(var(--aw-page-rgb), .70) !important;
  }

  /* Services — seq 8. data-seq category cards/pills keep their own sequence. */
  body #modal-services :is(.svc-intro, .svc-panel, .svc-empty) {
    --nested-card-accent: var(--aw-page-accent);
    --svc-accent: var(--aw-page-accent);
    --svc-deep: var(--aw-page-deep);
    --svc-rgb: var(--aw-page-rgb);
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  body #modal-services :is(.svc-panel-head h3, .svc-panel-head h3 .dot) {
    color: var(--aw-page-deep) !important;
  }
  body #modal-services .svc-panel-head h3 .dot { background: var(--aw-page-accent) !important; }

  body #modal-services :is(.svc-all, .svc-back) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
    background: #fff !important;
  }

  body #modal-services :is(.svc-all, .svc-back):hover {
    color: #fff !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 14px 28px -18px rgba(var(--aw-page-rgb), .68) !important;
  }

  body #modal-services :is(.svc-hub-card[data-seq], .svc-pill[data-seq]):hover {
    border-color: rgba(var(--svc-rgb), .38) !important;
    box-shadow: 0 18px 38px -24px rgba(var(--svc-rgb), .48) !important;
  }

  body #modal-services .svc-chk:hover {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 18px 38px -24px rgba(var(--aw-page-rgb), .44) !important;
  }

  body #modal-services .svc-chk.on {
    border-color: var(--aw-page-line-strong) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  body #modal-services .svc-box {
    border-color: rgba(var(--aw-page-rgb), .34) !important;
  }

  body #modal-services .svc-chk.on .svc-box,
  body #modal-services .svc-toast {
    color: #fff !important;
    border-color: var(--aw-page-deep) !important;
    background: var(--aw-page-deep) !important;
  }

  body #modal-services .svc-empty::after {
    color: var(--aw-page-accent) !important;
    background-color: var(--aw-page-accent) !important;
    background-image: none !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 21C8.1 18.6 4.5 15.6 4.5 11a4 4 0 0 1 7.5-1.9A4 4 0 0 1 19.5 11c0 4.6-3.6 7.6-7.5 10Z'/%3E%3C/svg%3E") center/62% no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 21C8.1 18.6 4.5 15.6 4.5 11a4 4 0 0 1 7.5-1.9A4 4 0 0 1 19.5 11c0 4.6-3.6 7.6-7.5 10Z'/%3E%3C/svg%3E") center/62% no-repeat !important;
  }

  /* Print center — seq 7. Rules are limited to the interactive UI; .a4 output is untouched. */
  #modal-studentfile {
    background:
      radial-gradient(circle at 10% 3%, rgba(var(--aw-page-rgb), .12), transparent 31%),
      linear-gradient(180deg, #fff, var(--aw-page-tint)) !important;
  }

  #modal-studentfile :is(.sf-head, .sf-panel, .sf-guide, .sf-empty, .sf-person, .sf-chip, .sf-sel, .sf-st-opt, .sf-btn) {
    border-color: var(--aw-page-line) !important;
  }

  #modal-studentfile :is(.sf-panel, .sf-guide, .sf-empty) {
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  #modal-studentfile .sf-main {
    --sf-accent: var(--aw-page-accent);
  }

  #modal-studentfile :is(.sf-guide, .sf-empty, .sf-subj) {
    --nested-card-accent: var(--aw-page-accent);
  }

  #modal-studentfile :is(.sf-title, .sf-guide b, .sf-actions .title, .sf-basket h3, .sf-chip, .sf-subj-h, .sf-export-summary b) {
    color: var(--aw-page-deep) !important;
  }

  #modal-studentfile .sf-mode::before {
    background: var(--sf-accent, var(--aw-page-accent)) !important;
  }

  #modal-studentfile .sf-mode {
    border-color: var(--sf-soft, var(--aw-page-line)) !important;
  }

  #modal-studentfile .sf-mode.active {
    border-color: var(--sf-soft, var(--aw-page-line-strong)) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--sf-tint, var(--aw-page-tint))) !important;
    box-shadow: 0 16px 34px -22px rgba(var(--sf-rgb, var(--aw-page-rgb)), .42) !important;
  }

  #modal-studentfile .sf-mode.active b {
    color: var(--sf-deep, var(--aw-page-deep)) !important;
  }

  #modal-studentfile .sf-subj-h {
    background: linear-gradient(90deg, rgba(var(--aw-page-rgb), .12), rgba(var(--aw-page-rgb), .025)) !important;
  }

  #modal-studentfile .sf-subj-h span:last-child {
    color: var(--aw-page-deep) !important;
    background: rgba(var(--aw-page-rgb), .11) !important;
  }

  #modal-studentfile :is(.sf-btn.primary, .sf-person.selected .sf-av, .sf-person.selected .sf-check, .sf-st-opt.active) {
    color: #fff !important;
    border-color: var(--aw-page-deep) !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 14px 28px -18px rgba(var(--aw-page-rgb), .70) !important;
  }

  #modal-studentfile .sf-person.selected {
    background: linear-gradient(135deg, rgba(var(--aw-page-rgb), .14), #fff) !important;
    color: inherit !important;
  }

  #modal-studentfile :is(.sf-btn, .sf-person, .sf-st-opt, .sf-field input, .sf-field select):hover,
  #modal-studentfile :is(.sf-field input, .sf-field select):focus {
    border-color: var(--aw-page-line-strong) !important;
  }

  #modal-studentfile .sf-mode:hover {
    border-color: var(--sf-soft, var(--aw-page-line-strong)) !important;
    box-shadow: 0 15px 32px -23px rgba(var(--sf-rgb, var(--aw-page-rgb)), .42) !important;
  }

  #modal-studentfile .sf-btn:not(.primary):hover,
  #modal-studentfile .sf-lesson:hover {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
  }

  #modal-studentfile.teacher-view .sf-main,
  #modal-studentfile .sf-export-summary {
    border-color: var(--aw-page-line) !important;
  }

  #modal-studentfile .sf-person:hover {
    box-shadow: 0 11px 25px rgba(var(--aw-page-rgb), .13) !important;
  }

  #modal-studentfile :is(.sf-av, .sf-check, .sf-count, .sf-sel:not(.all)) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  .sf-toast[data-aw-theme="print-center"],
  .sf-fly[data-aw-theme="print-center"],
  #sf-progress[data-aw-theme="print-center"] .sf-prog-retry {
    color: #fff !important;
    border-color: var(--aw-page-deep) !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 14px 28px -18px rgba(var(--aw-page-rgb), .70) !important;
  }

  #sf-progress[data-aw-theme="print-center"] .sf-prog-card h3 {
    color: var(--aw-page-deep) !important;
  }

  #sf-progress[data-aw-theme="print-center"] .sf-prog-bar {
    background: rgba(var(--aw-page-rgb), .13) !important;
  }

  #sf-progress[data-aw-theme="print-center"] .sf-prog-fill {
    background: var(--aw-page-fill) !important;
  }

  /* Dashboard — seq 6. Status classes retain their own green/orange/red/navy colors. */
  body[data-aw-theme="dashboard"] {
    --line: rgba(var(--aw-page-rgb), .17);
    --soft: var(--aw-page-tint);
    --bg: var(--aw-page-tint);
    --sh-sm: 0 10px 28px rgba(var(--aw-page-rgb), .10);
    --sh-md: 0 22px 60px rgba(var(--aw-page-rgb), .16);
    background:
      radial-gradient(circle at 12% 0%, rgba(var(--aw-page-rgb), .12), transparent 30%),
      linear-gradient(180deg, #fff 0%, var(--aw-page-tint) 52%, var(--aw-page-soft) 130%) !important;
  }

  body[data-aw-theme="dashboard"] :is(.insight, .tools, .tcard, .empty, .sheet, .gap-class, .gap-subject, .gap-row:not(.eval), .assign, .class-detail) {
    border-color: var(--aw-page-line) !important;
  }

  body[data-aw-theme="dashboard"] :is(.insight, .tcard, .empty, .sheet, .gap-class, .gap-subject, .gap-row:not(.eval), .assign, .class-detail) {
    background: linear-gradient(145deg, rgba(255,255,255,.98), var(--aw-page-tint)) !important;
  }

  body[data-aw-theme="dashboard"] :is(.title-mark, .back, .mini-tag:not(.soft)) {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line) !important;
    background: rgba(var(--aw-page-rgb), .10) !important;
  }

  body[data-aw-theme="dashboard"] :is(.tools input, .tools select):focus,
  body[data-aw-theme="dashboard"] .tcard:focus-visible {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 0 0 4px rgba(var(--aw-page-rgb), .11) !important;
  }

  body[data-aw-theme="dashboard"] :is(.tcard, .gap-row:not(.eval), .assign, .class-detail):hover {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 18px 38px -24px rgba(var(--aw-page-rgb), .48) !important;
  }

  body[data-aw-theme="dashboard"] .tcard[class*="status-"] {
    border-color: color-mix(in srgb, var(--accent, var(--aw-page-accent)) 24%, transparent) !important;
  }

  body[data-aw-theme="dashboard"] .tcard[class*="status-"]:is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--accent, var(--aw-page-accent)) 38%, transparent) !important;
  }

  body[data-aw-theme="dashboard"] :is(.open-detail, .copy-summary) {
    color: #fff !important;
    border-color: transparent !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 13px 26px -17px rgba(var(--aw-page-rgb), .72) !important;
  }

  /* Reports — seq 4. Only application chrome changes; .sheet/.fld/.pslot stay print-faithful. */
  body[data-aw-theme="reports"] .report-workflow {
    border-color: var(--aw-page-line) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  body[data-aw-theme="reports"] .report-flow-btn:not(.warn):not(.danger):hover {
    color: var(--aw-page-deep) !important;
    border-color: var(--aw-page-line-strong) !important;
    background: var(--aw-page-tint) !important;
  }

  body[data-aw-theme="reports"] .report-flow-btn.primary,
  body[data-aw-theme="reports"] :is(.act.primary, .btn.ok, .tab.on, .cal-day.sel) {
    color: #fff !important;
    border-color: transparent !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 16px 28px -15px rgba(var(--aw-page-rgb), .68) !important;
  }

  body[data-aw-theme="reports"] :is(.bottombar .inner, .bs, .tabs, .seg, .arch-toolbar, .set-card, .set-row, .arch-card) {
    border-color: var(--aw-page-line) !important;
  }

  body[data-aw-theme="reports"] :is(.bottombar .act, .btn:not(.dng), .tab, .opt, .set-card, .set-row, .arch-card):hover {
    border-color: var(--aw-page-line-strong) !important;
    box-shadow: 0 13px 26px -20px rgba(var(--aw-page-rgb), .46) !important;
  }

  body[data-aw-theme="reports"] :is(.bs-title, .lab, .fontctl .lbl, .cal-title, .arch-t, .set-back, .home-pill, .nh-tool) {
    color: var(--aw-page-deep) !important;
  }

  body[data-aw-theme="reports"] :is(.ta, .ti):focus {
    border-color: var(--aw-page-accent) !important;
    box-shadow: 0 0 0 4px rgba(var(--aw-page-rgb), .12) !important;
  }

  /* Guardian portal — gold identity. Subject/service/status palettes stay intact. */
  body[data-aw-theme="guardian"] {
    background:
      radial-gradient(circle at 10% 0%, rgba(var(--aw-page-rgb), .13), transparent 30%),
      linear-gradient(180deg, #fff 0%, var(--aw-page-tint) 52%, var(--aw-page-soft) 145%) !important;
  }

  body[data-aw-theme="guardian"] .gp-hero {
    background: var(--aw-page-fill) !important;
    box-shadow: 0 22px 48px -28px rgba(var(--aw-page-rgb), .68) !important;
  }

  body[data-aw-theme="guardian"] :is(.gp-section, .gp-empty) {
    border-color: var(--aw-page-line) !important;
    box-shadow: var(--aw-page-shadow) !important;
  }

  body[data-aw-theme="guardian"] .gp-sec-ic {
    color: #fff;
    border-color: var(--aw-page-line) !important;
    background: linear-gradient(135deg,
      var(--gp-acc, var(--aw-page-accent)),
      color-mix(in srgb, var(--gp-acc, var(--aw-page-accent)) 62%, #fff));
    box-shadow: 0 12px 24px -16px var(--gp-acc, var(--aw-page-accent));
  }

  body[data-aw-theme="guardian"] .gp-sec-count {
    color: var(--gp-acc, var(--aw-page-deep));
    border-color: color-mix(in srgb, var(--gp-acc, var(--aw-page-accent)) 24%, #fff) !important;
    background: color-mix(in srgb, var(--gp-acc, var(--aw-page-accent)) 11%, #fff);
  }

  body[data-aw-theme="guardian"] .gp-back {
    color: #fff !important;
    background: linear-gradient(135deg, var(--hc, var(--aw-page-accent)), var(--hc-deep, var(--aw-page-deep))) !important;
    box-shadow: 0 12px 24px -17px rgba(var(--aw-page-rgb), .64) !important;
  }

  body[data-aw-theme="guardian"] .gp-mb-btn.print,
  body[data-aw-theme="guardian"] .gp-auth .btn-primary {
    color: #fff !important;
    border-color: transparent !important;
    background: var(--aw-page-fill) !important;
    box-shadow: 0 12px 24px -16px rgba(var(--aw-page-rgb), .68) !important;
  }

  body[data-aw-theme="guardian"] .gp-loader-ring {
    border-color: rgba(var(--aw-page-rgb), .20) !important;
    border-top-color: var(--aw-page-accent) !important;
  }
}