/* =============================================================================
   aapr-compat.css — re-themes older markup (.ds-*, .flash, legacy --ds-* tokens)
   onto design system v4. Loaded on admin/portal pages and converted public pages;
   NOT loaded on public templates that still use the old light stylesheets.
   Delete once no page uses .ds-* classes.
   ============================================================================= */
/* =============================================================================
   LEGACY MAPPING — older markup (`.ds-*`, `.admin-*`, `.flash`) renders in v4
   ============================================================================= */
:root {
    --ds-white: #FFFFFF;
    --ds-g50: #141917; --ds-g100: #1A201D; --ds-g200: #262D2A; --ds-g300: #343C38; --ds-g400: #6B756F;
    --ds-g500: #8C9792; --ds-g600: #A6B0AB; --ds-g700: #C3CCC7; --ds-g800: #DCE3DF; --ds-g900: #EEF2F0;
    --ds-page: var(--ink-1);
    --ds-navy-deepest: var(--ink-0); --ds-navy-deep: var(--ink-1); --ds-navy: var(--ink-3); --ds-navy-soft: var(--ink-4); --ds-navy-line: var(--ink-5);
    --ds-blue: var(--lime); --ds-blue-bright: var(--lime-hi); --ds-blue-deep: var(--lime-lo); --ds-blue-deepest: var(--lime-lo); --ds-blue-soft: var(--lime-soft);
    --ds-cyan: var(--lime-hi); --ds-indigo: var(--lime-lo);
    --ds-green: var(--good); --ds-green-soft: var(--good-soft); --ds-green-text: var(--good); --ds-green-border: var(--good-line);
    --ds-amber: var(--warn); --ds-amber-soft: var(--warn-soft); --ds-amber-text: var(--warn); --ds-amber-border: var(--warn-line);
    --ds-red: var(--bad); --ds-red-soft: var(--bad-soft); --ds-red-text: var(--bad); --ds-red-border: var(--bad-line);
    --ds-info-border: var(--info-line);
    --ds-bg: var(--ink-2); --ds-bg-alt: var(--ink-1); --ds-bg-canvas: var(--ink-1); --ds-bg-dark: var(--ink-1); --ds-bg-darkest: var(--ink-0);
    --ds-text: var(--text); --ds-text-mute: var(--text-2); --ds-text-faint: var(--text-3);
    --ds-text-on-dark: var(--text); --ds-text-on-dark-mute: var(--text-2);
    --ds-border: var(--line); --ds-border-strong: var(--line-2); --ds-border-on-dark: var(--line);
    --ds-accent: var(--lime); --ds-accent-hover: var(--lime-hi); --ds-accent-soft: var(--lime-soft);
    --ds-font-sans: var(--font-sans); --ds-font-mono: var(--font-mono);
    --ds-fs-xs: 12px; --ds-fs-sm: 14px; --ds-fs-base: 16px; --ds-fs-md: 18px; --ds-fs-lg: 20px; --ds-fs-xl: 24px;
    --ds-fs-2xl: 30px; --ds-fs-3xl: 36px; --ds-fs-4xl: 44px; --ds-fs-5xl: 56px;
    --ds-fw-regular: 400; --ds-fw-medium: 500; --ds-fw-semibold: 600; --ds-fw-bold: 700; --ds-fw-extra: 800;
    --ds-sp-1: 4px; --ds-sp-2: 8px; --ds-sp-3: 12px; --ds-sp-4: 16px; --ds-sp-5: 20px; --ds-sp-6: 24px;
    --ds-sp-7: 32px; --ds-sp-8: 40px; --ds-sp-9: 56px; --ds-sp-10: 72px; --ds-sp-11: 96px;
    --ds-r-xs: 4px; --ds-r-sm: 6px; --ds-r-md: 8px; --ds-r-lg: 12px; --ds-r-xl: 16px; --ds-r-2xl: 20px; --ds-r-full: 999px;
    --ds-sh-sm: var(--sh-1); --ds-sh-md: var(--sh-1); --ds-sh-lg: var(--sh-2); --ds-sh-xl: var(--sh-3);
    --ds-sh-card: var(--sh-1); --ds-sh-card-hover: var(--sh-2); --ds-sh-card-soft: var(--sh-1); --ds-sh-card-soft-hover: var(--sh-2);
    --ds-sh-focus: 0 0 0 3px var(--lime-soft);
    --ds-dur: var(--dur-2); --ds-dur-slow: var(--dur-3); --ds-ease: var(--ease); --ds-ease-out: var(--ease); --ds-dur-polish: var(--dur-2);
    --ds-container: var(--container); --ds-container-wide: 1280px; --ds-container-narrow: var(--container-narrow);
    --ds-grad-signature: linear-gradient(135deg, var(--lime-hi), var(--lime-lo));
    --ds-grad-primary: linear-gradient(180deg, var(--lime-hi), var(--lime));
    --ds-grad-rule: linear-gradient(90deg, var(--lime), var(--gold));
    --ds-glow-blue: var(--glow-lime); --ds-glow-blue-strong: var(--glow-lime);
    --ds-platinum: var(--text-2); --ds-platinum-soft: var(--line-2); --ds-hairline-top: var(--line-2);
    --ds-glass-dark: rgba(17, 21, 20, .7); --ds-glass-darkest: rgba(6, 8, 7, .7); --ds-glass-nav: rgba(11, 14, 13, .86);
    --ds-sh-glass: var(--sh-2); --ds-blur-glass: blur(12px);
}
/* Components */
.ds-card { background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-6); box-shadow: var(--sh-1); min-width: 0; color: var(--text); }
.ds-card--flat { box-shadow: none; }
.ds-card__head { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-4); flex-wrap: wrap; }
.ds-card__title { font: 600 var(--fs-base)/1.35 var(--font-sans); color: var(--text); margin: 0; }
.ds-card__sub { font-size: var(--fs-sm); color: var(--text-2); margin: 4px 0 0; }
.ds-card__body { margin-top: var(--sp-4); }
.ds-card--interactive:hover { border-color: var(--line-3); }
.ds-btn {
    --btn-bg: var(--ink-4); --btn-fg: var(--text); --btn-bd: var(--line-2);
    display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-height: 44px; padding: 0 var(--sp-5);
    font: 600 var(--fs-sm)/1 var(--font-sans); text-decoration: none; white-space: nowrap; color: var(--btn-fg);
    background: var(--btn-bg); border: 1px solid var(--btn-bd); border-radius: var(--r-md); cursor: pointer;
    transition: background var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), box-shadow var(--dur-2) var(--ease);
}
.ds-btn:hover { --btn-bg: var(--ink-5); --btn-bd: var(--line-3); color: var(--btn-fg); }
.ds-btn svg { width: 16px; height: 16px; }
.ds-btn--primary, .ds-btn--navy { --btn-bg: var(--lime); --btn-fg: var(--text-on-accent); --btn-bd: var(--lime); }
.ds-btn--primary:hover, .ds-btn--navy:hover { --btn-bg: var(--lime-hi); --btn-bd: var(--lime-hi); box-shadow: var(--glow-lime); }
.ds-btn--ghost, .ds-btn--on-dark { --btn-bg: transparent; --btn-bd: var(--line-2); }
.ds-btn--ghost:hover, .ds-btn--on-dark:hover { --btn-bg: rgba(255,255,255,.05); }
.ds-btn--text { --btn-bg: transparent; --btn-bd: transparent; --btn-fg: var(--lime); padding: 0 var(--sp-2); }
.ds-btn--text:hover { --btn-bg: transparent; --btn-bd: transparent; --btn-fg: var(--lime-hi); }
.ds-btn--danger { --btn-bg: transparent; --btn-fg: var(--bad); --btn-bd: var(--bad-line); }
.ds-btn--danger:hover { --btn-bg: var(--bad-soft); --btn-bd: var(--bad); }
.ds-btn--sm { min-height: 36px; padding: 0 var(--sp-3); font-size: var(--fs-xs); }
.ds-btn--lg { min-height: 52px; padding: 0 var(--sp-6); font-size: var(--fs-base); }
.ds-btn--block { width: 100%; }
.ds-btn--inline { min-height: 32px; padding: 0 var(--sp-2); }
.ds-btn[disabled] { opacity: .45; cursor: not-allowed; }
.ds-input, .ds-select, .ds-textarea {
    width: 100%; min-height: 44px; padding: 10px 12px; font: 400 var(--fs-base)/1.4 var(--font-sans); color: var(--text);
    background: var(--ink-4); border: 1px solid var(--line-2); border-radius: var(--r-md);
}
.ds-textarea { min-height: 110px; resize: vertical; }
.ds-input:focus, .ds-select:focus, .ds-textarea:focus { outline: none; border-color: var(--lime); box-shadow: 0 0 0 3px var(--lime-soft); background: var(--ink-3); }
.ds-select { appearance: none; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5l3 3 3-3' stroke='%23B6C0BB' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
.ds-field, .ds-form-field, .ds-auth-field, .ds-form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--sp-4); min-width: 0; }
.ds-label-field, .ds-form-field__label, .ds-field > label, .ds-auth-field > label, .ds-form-group > label { font-size: var(--fs-sm); font-weight: 600; color: var(--text); }
.ds-form-field__req { color: var(--bad); }
.ds-help, .ds-form-field__hint { font-size: var(--fs-xs); color: var(--text-3); line-height: 1.5; }
.ds-form-row, .ds-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-5); }
.ds-field-row--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ds-form-row--single { grid-template-columns: 1fr; }
@media (max-width: 680px) { .ds-form-row, .ds-field-row, .ds-field-row--three { grid-template-columns: 1fr; } }
.ds-form-actions { display: flex; gap: var(--sp-3); justify-content: flex-end; flex-wrap: wrap; margin-top: var(--sp-5); }
.ds-check { display: inline-flex; gap: var(--sp-2); align-items: flex-start; font-size: var(--fs-sm); cursor: pointer; }
.ds-check input { accent-color: var(--lime); width: 18px; height: 18px; margin-top: 2px; }
.ds-badge, .ds-pill {
    --b-fg: var(--text-2); --b-bg: rgba(255,255,255,.06); --b-bd: var(--line-2);
    display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; font: 600 var(--fs-xs)/1.2 var(--font-sans); white-space: nowrap;
    color: var(--b-fg); background: var(--b-bg); border: 1px solid var(--b-bd); border-radius: var(--r-full);
}
.ds-badge--dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.ds-badge--success, .ds-pill--published { --b-fg: var(--good); --b-bg: var(--good-soft); --b-bd: var(--good-line); }
.ds-badge--warn, .ds-pill--draft { --b-fg: var(--warn); --b-bg: var(--warn-soft); --b-bd: var(--warn-line); }
.ds-badge--danger { --b-fg: var(--bad); --b-bg: var(--bad-soft); --b-bd: var(--bad-line); }
.ds-badge--info, .ds-pill--info { --b-fg: var(--info); --b-bg: var(--info-soft); --b-bd: var(--info-line); }
.ds-alert, .flash, .ds-auth-flash {
    --a-c: var(--info); --a-bg: var(--info-soft); --a-bd: var(--info-line);
    display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-3) var(--sp-4); border-radius: var(--r-md); margin: 0 0 var(--sp-5);
    background: var(--a-bg); border: 1px solid var(--a-bd); border-left: 4px solid var(--a-c); color: var(--text); font-size: var(--fs-sm);
}
.ds-alert--success, .flash--success, .ds-auth-flash--success { --a-c: var(--good); --a-bg: var(--good-soft); --a-bd: var(--good-line); }
.ds-alert--warn, .ds-auth-flash--warn, .ds-auth-flash--warning { --a-c: var(--warn); --a-bg: var(--warn-soft); --a-bd: var(--warn-line); }
.ds-alert--danger, .flash--error, .ds-auth-flash--error, .ds-auth-flash--danger { --a-c: var(--bad); --a-bg: var(--bad-soft); --a-bd: var(--bad-line); }
.ds-alert__icon svg { width: 18px; height: 18px; }
.ds-table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--ink-2); }
.ds-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.ds-table th { text-align: left; font-size: var(--fs-xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); background: var(--ink-3); padding: 10px var(--sp-4); border-bottom: 1px solid var(--line-2); white-space: nowrap; }
.ds-table td { padding: 12px var(--sp-4); border-bottom: 1px solid var(--line); color: var(--text); vertical-align: middle; }
.ds-table tbody tr:hover { background: rgba(255,255,255,.025); }
.ds-table tbody tr:last-child td { border-bottom: 0; }
.ds-table__primary { font-weight: 600; }
.ds-table__meta { font-size: var(--fs-xs); color: var(--text-3); }
.ds-table__num { text-align: right; font-variant-numeric: tabular-nums; }
.ds-table__actions { text-align: right; white-space: nowrap; }
.ds-stat { background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5); }
.ds-stat__key { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.ds-stat__value { font: 700 var(--fs-2xl)/1.15 var(--font-display); color: var(--text); margin-top: 6px; font-variant-numeric: tabular-nums; }
.ds-stat__value--warn { color: var(--warn); } .ds-stat__value--danger { color: var(--bad); }
.ds-grid { display: grid; gap: var(--sp-5); }
.ds-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ds-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ds-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1024px) { .ds-grid--3, .ds-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px)  { .ds-grid--2, .ds-grid--3, .ds-grid--4 { grid-template-columns: 1fr; } }
.ds-row { display: flex; gap: var(--sp-3); align-items: center; flex-wrap: wrap; }
.ds-stack > * + * { margin-top: var(--sp-4); }
.ds-section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.ds-section-head__title { font: 600 var(--fs-lg)/1.3 var(--font-sans); margin: 0; }
.ds-section-head__meta { font-size: var(--fs-xs); color: var(--text-3); }
.ds-h1 { font: 700 clamp(24px, 2.4vw, 30px)/1.2 var(--font-display); margin: 0 0 var(--sp-3); }
.ds-h2 { font: 700 var(--fs-xl)/1.25 var(--font-display); margin: 0 0 var(--sp-3); }
.ds-lead { font-size: var(--fs-md); color: var(--text-2); }
.ds-label { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.ds-eyebrow { display: inline-flex; align-items: center; gap: 8px; font: 600 var(--fs-xs)/1.4 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--lime); }
.ds-mono { font-family: var(--font-mono); font-size: .92em; }
.ds-text-muted { color: var(--text-2); } .ds-text-faint { color: var(--text-3); } .ds-text-center { text-align: center; }
.ds-mt-2 { margin-top: var(--sp-2); } .ds-mt-4 { margin-top: var(--sp-4); } .ds-mt-6 { margin-top: var(--sp-6); }
.ds-mb-0 { margin-bottom: 0; } .ds-mb-2 { margin-bottom: var(--sp-2); } .ds-mb-4 { margin-bottom: var(--sp-4); } .ds-mb-6 { margin-bottom: var(--sp-6); }
.ds-empty, .ds-portal-empty { text-align: center; padding: var(--sp-8) var(--sp-5); color: var(--text-2); }
.ds-empty__title { font-weight: 700; color: var(--text); margin-bottom: 4px; }
.ds-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); overflow-x: auto; margin-bottom: var(--sp-5); }
.ds-tabs a, .ds-tabs button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 var(--sp-4); color: var(--text-2); text-decoration: none; font-weight: 600; font-size: var(--fs-sm); border: 0; border-bottom: 2px solid transparent; background: none; cursor: pointer; margin-bottom: -1px; }
.ds-tabs .is-active, .ds-tabs [aria-selected="true"] { color: var(--lime); border-bottom-color: var(--lime); }
.ds-tab__count { font: 600 11px/1 var(--font-mono); padding: 3px 6px; border-radius: 999px; background: rgba(255,255,255,.08); }
.ds-auth { min-height: 100vh; display: grid; place-items: center; padding: var(--sp-6) var(--sp-4); background: radial-gradient(700px 360px at 50% -10%, rgba(163,230,53,.10), transparent 70%), var(--ink-1); }
.ds-auth-card { width: 100%; max-width: 440px; background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--r-xl); box-shadow: var(--sh-3); padding: var(--sp-7); }
.ds-auth-title { font: 700 var(--fs-xl)/1.25 var(--font-display); text-align: center; margin: 0 0 4px; }
.ds-auth-sub { text-align: center; color: var(--text-2); font-size: var(--fs-sm); margin: 0 0 var(--sp-6); }
.ds-auth-foot { margin-top: var(--sp-6); text-align: center; font-size: var(--fs-sm); color: var(--text-3); }
.ds-auth-brand { display: block; text-align: center; margin-bottom: var(--sp-5); color: var(--text); text-decoration: none; font: 700 var(--fs-md)/1 var(--font-display); }
.ds-auth-back { color: var(--text-2); }