:root {
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", sans-serif;
  --smp-contrast-accent: #ffff00;
  --smp-contrast-accent-rgb: 255, 255, 0;
  --smp-accent-hover: #0e4b3c;
  --smp-accent: #146b55;
  --smp-surface: #f3f6f2;
  --smp-ticket-bg: #d9f49b;
  --smp-ticket-ink: #213725;
  --bs-link-color: #146b55;
  --bs-link-color-rgb: 20, 107, 85;
  --bs-link-hover-color: #0e4b3c;
  --bs-link-hover-color-rgb: 14, 75, 60;
  --smp-control-border: #6c757d;
  --smp-error: #b02a37;
}
[data-bs-theme="dark"] {
  --smp-accent-hover: #d8efbd;
  --smp-accent: #b4df82;
  --smp-surface: #252d28;
  --bs-link-color: #b4df82;
  --bs-link-color-rgb: 180, 223, 130;
  --bs-link-hover-color: #d8efbd;
  --bs-link-hover-color-rgb: 216, 239, 189;
  --smp-control-border: #adb5bd;
  --smp-error: #ffb4b4;
}
.text-danger { color: var(--smp-error) !important; }
html { scroll-padding-top: 2rem; }
body { min-height: 100dvh; display: flex; flex-direction: column; }
[hidden] { display: none !important; }
a, button, select { touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--smp-accent); outline-offset: 4px; }
main:focus { outline: none; }
.skip-link { position: fixed; top: -6rem; left: 1rem; z-index: 2000; padding: .75rem 1rem; background: var(--bs-body-bg); }
.skip-link:focus { top: 1rem; }
.navbar-brand { font-weight: 750; font-size: 1.2rem; letter-spacing: -.04em; }
.brand-mark { display: grid; place-content: center; position: relative; width: 2rem; height: 2rem; border-radius: .55rem; background: var(--smp-accent); color: var(--bs-body-bg); font-size: 1.5rem; }
.brand-mark span { position: absolute; right: .3rem; bottom: .05rem; }
.display-controls .btn { white-space: nowrap; }
.display-controls .btn:focus-visible { outline: 3px solid var(--smp-accent); outline-offset: 4px; }
.appearance-toggle { min-height: 44px; }
.appearance-menu {
  --bs-dropdown-bg: var(--bs-body-bg);
  --bs-dropdown-color: var(--bs-body-color);
  --bs-dropdown-border-color: var(--smp-control-border);
  width: 18rem;
  max-width: calc(100vw - 2rem);
  border-radius: .75rem;
  box-shadow: 0 .5rem 1.5rem #0002;
}
.appearance-menu .theme-picker { width: 100%; min-height: 44px; font-size: 1rem; }
/* In-page options avoid native OS picker colors. Preserve these meaningful
   preview colors locally, including in forced colors; never opt out site-wide. */
:is(#palette-picker, #theme-picker) { background-color: var(--smp-surface); color: var(--bs-body-color); text-align: start; }
:is(.palette-options, .theme-options) {
  display: grid;
  gap: .375rem;
  padding: .5rem;
  margin: .5rem 0 0;
  list-style: none;
  border: 1px solid var(--smp-control-border);
  border-radius: .5rem;
  background: var(--bs-body-bg);
}
:is(.palette-option, .theme-option) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  min-height: 44px;
  padding: .625rem .75rem;
  border-radius: .25rem;
  cursor: pointer;
  forced-color-adjust: none;
}
:is(.palette-option, .theme-option):is(:hover, [data-active="true"]) { outline: 2px solid currentColor; outline-offset: -4px; }
:is(.palette-check, .theme-check) { visibility: hidden; font-weight: 700; }
:is(.palette-option, .theme-option)[aria-selected="true"] :is(.palette-check, .theme-check) { visibility: visible; }
[data-palette="lavender"],
.palette-option[data-palette-choice="lavender"] {
  --smp-choice-bg: #efe5fa; --smp-choice-ink: #2c223a;
  --smp-choice-dark-bg: #30253c; --smp-choice-dark-ink: #f4ebff;
  --smp-choice-contrast-bg: #e2c6ff;
}
[data-palette="blush"],
.palette-option[data-palette-choice="blush"] {
  --smp-choice-bg: #fbe6ee; --smp-choice-ink: #38252d;
  --smp-choice-dark-bg: #3c2731; --smp-choice-dark-ink: #ffeaf1;
  --smp-choice-contrast-bg: #ffc9dd;
}
[data-palette="peach"],
.palette-option[data-palette-choice="peach"] {
  --smp-choice-bg: #ffead9; --smp-choice-ink: #39291f;
  --smp-choice-dark-bg: #3c2d23; --smp-choice-dark-ink: #fff0e4;
  --smp-choice-contrast-bg: #ffdab8;
}
[data-palette="classic"],
.palette-option[data-palette-choice="classic"] {
  --smp-choice-bg: #f3f6f2; --smp-choice-ink: #213725;
  --smp-choice-dark-bg: #252d28; --smp-choice-dark-ink: #d8efbd;
  --smp-choice-contrast-bg: #ffff00;
}
.palette-option { background-color: var(--smp-choice-bg); color: var(--smp-choice-ink); }
[data-bs-theme="dark"] .palette-option { background-color: var(--smp-choice-dark-bg); color: var(--smp-choice-dark-ink); }
[data-contrast="high"] .palette-option { background-color: var(--smp-choice-contrast-bg); color: #000; }
.theme-option { justify-content: flex-start; }
.theme-check { margin-inline-start: auto; }
.theme-option[data-theme-choice="flatly"] { background: var(--smp-choice-bg); color: var(--smp-choice-ink); }
.theme-option[data-theme-choice="darkly"] { background: var(--smp-choice-dark-bg); color: var(--smp-choice-dark-ink); }
.theme-option[data-theme-choice="system"] { background: var(--smp-surface); color: var(--bs-body-color); }
.theme-preview { display: inline-grid; place-items: center; flex: 0 0 1.5rem; width: 1.5rem; height: 1.5rem; font-size: 1.25rem; line-height: 1; }
.theme-preview-system { border: 1px solid currentColor; border-radius: 50%; background: linear-gradient(90deg, var(--smp-choice-bg) 50%, var(--smp-choice-dark-bg) 50%); }
.contrast-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
}
.contrast-icon { font-size: 1.5rem; line-height: 1; }
.eyebrow { font-weight: 650; font-size: .76rem; letter-spacing: .11em; text-transform: uppercase; }
.status-dot { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; background: var(--smp-accent); margin-right: .4rem; }
.hero-title { font-size: clamp(2.8rem, 5.5vw, 5rem); line-height: 1.06; font-weight: 750; letter-spacing: -.055em; }
.hero-accent { color: var(--smp-accent); }
.hero-description { max-width: 35rem; line-height: 1.7; }
.hero .btn-primary { --bs-btn-bg: var(--smp-accent); --bs-btn-border-color: var(--smp-accent); --bs-btn-color: var(--bs-body-bg); }
.ticket-scene { position: relative; padding: 3rem 2.25rem 3.75rem; background: var(--smp-surface); border-radius: 1.25rem; overflow: hidden; }
.admission-ticket { position: relative; z-index: 1; background: var(--smp-ticket-bg); color: var(--smp-ticket-ink); padding: 1.8rem; border-radius: .75rem; transform: rotate(-5deg); box-shadow: 0 16px 30px #122a191a; }
.ticket-label { font-size: .75rem; font-weight: 650; letter-spacing: .04em; }
.ticket-title { font-size: clamp(2.5rem, 3.3vw, 3.3rem); font-weight: 750; letter-spacing: -.04em; line-height: 1.03; }
.ticket-stub { border-top: 2px dashed currentColor; }
.ticket-number { font-size: 2.5rem; font-weight: 300; line-height: 1; }
.scene-orbit { position: absolute; width: 18rem; height: 18rem; border: 1px solid var(--bs-border-color); border-radius: 50%; }
.orbit-one { right: -7rem; top: -8rem; }
.orbit-two { left: -9rem; bottom: -9rem; }
.scene-caption { position: absolute; bottom: 1.25rem; left: 0; right: 0; text-align: center; font-size: .6rem; font-weight: 700; letter-spacing: .16em; }
.experience-section { scroll-margin-top: 2rem; }
.feature-card { border-top: 1px solid var(--bs-border-color); padding: 1.4rem 1rem 0 0; }
.feature-number { font-size: .78rem; font-weight: 650; color: var(--smp-accent); }
.site-footer { margin-top: 2rem; }

/* Contrast is independent of the light/dark theme. Keep real outlines and borders,
   and allow the browser to apply the user's Windows forced-color palette. */
[data-contrast="high"] {
  color-scheme: dark;
  --bs-body-bg: #000;
  --bs-body-bg-rgb: 0, 0, 0;
  --bs-body-color: #fff;
  --bs-body-color-rgb: 255, 255, 255;
  --bs-emphasis-color: #fff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-heading-color: #fff;
  --bs-secondary-color: #fff;
  --bs-secondary-color-rgb: 255, 255, 255;
  --bs-tertiary-color: #fff;
  --bs-tertiary-color-rgb: 255, 255, 255;
  --bs-secondary-bg: #000;
  --bs-tertiary-bg: #000;
  --bs-border-color: #fff;
  --bs-link-color: var(--smp-contrast-accent);
  --bs-link-color-rgb: var(--smp-contrast-accent-rgb);
  --bs-link-hover-color: #fff;
  --bs-link-hover-color-rgb: 255, 255, 255;
  --smp-accent: var(--smp-contrast-accent);
  --smp-surface: #000;
  --smp-ticket-bg: #000;
  --smp-ticket-ink: #fff;
  --smp-control-border: #fff;
}
[data-contrast="high"] .navbar { --bs-navbar-color: var(--smp-contrast-accent); --bs-navbar-hover-color: #fff; --bs-navbar-brand-color: #fff; --bs-navbar-brand-hover-color: var(--smp-contrast-accent); --bs-navbar-toggler-border-color: #fff; }
[data-contrast="high"] :is(.admission-ticket, .ticket-scene, .card, .alert) { background: #000; color: #fff; border: 1px solid #fff; box-shadow: none; }
[data-contrast="high"] :is(.form-control, .form-select) { background-color: #000; color: #fff; border: 2px solid #fff; }
[data-contrast="high"] .form-control::placeholder { color: #fff; opacity: 1; }
[data-contrast="high"] .btn:not(.btn-link) { color: #fff; background: #000; border: 2px solid #fff; box-shadow: none; }
[data-contrast="high"] .btn:not(.btn-link):is(:hover, :focus-visible, [aria-pressed="true"]) { color: #000; background: var(--smp-contrast-accent); border-color: var(--smp-contrast-accent); }
[data-contrast="high"] :is(.btn-link, .text-danger, .text-success) { color: var(--smp-contrast-accent) !important; }
[data-contrast="high"] a:not(.btn):not(.navbar-brand) { text-decoration: underline; }
[data-contrast="high"] .form-check-input { border: 2px solid #fff; }
[data-contrast="high"] .form-check-input:checked { background-color: #000; }
[data-contrast="high"] .btn { transition: none; }
[data-contrast="high"] .navbar-toggler-icon { filter: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23fff' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
@media (forced-colors: active) {
  .brand-mark, .admission-ticket, .ticket-scene { border: 1px solid CanvasText; }
}
@media (max-width: 575.98px) {
  .ticket-scene { padding: 2rem 1.5rem 3.5rem; }
  .hero-title { font-size: 2.8rem; }
}

/* Bootswatch component defaults need explicit theme variables for navigation. */
.navbar {
  --bs-navbar-color: var(--bs-body-color);
  --bs-navbar-hover-color: var(--smp-accent);
  --bs-navbar-brand-color: var(--bs-body-color);
  --bs-navbar-brand-hover-color: var(--smp-accent);
}
.form-control, .form-control:focus, .form-select { background-color: var(--bs-body-bg); color: var(--bs-body-color); border-color: var(--smp-control-border); }
.form-check-input, .navbar-toggler { border-color: var(--smp-control-border); }
.form-floating > label,
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label { color: var(--bs-body-color); }
.display-controls .btn-outline-secondary {
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-border-color: var(--smp-control-border);
  --bs-btn-hover-bg: var(--bs-body-color);
  --bs-btn-hover-color: var(--bs-body-bg);
}
[data-contrast="high"] .form-floating > .form-control::placeholder { color: transparent; opacity: 0; }
[data-contrast="high"] .form-floating > label { color: #fff; }
.form-control:focus-visible, .form-select:focus-visible { outline: 3px solid var(--smp-accent); outline-offset: 3px; }
[data-contrast="high"] .form-select { --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }

/* Color palettes layer over Bootswatch; light/dark and contrast stay independent. */
[data-palette="lavender"] {
  --smp-contrast-accent: #e2c6ff;
  --smp-contrast-accent-rgb: 226, 198, 255;
}
[data-palette="blush"] {
  --smp-contrast-accent: #ffc9dd;
  --smp-contrast-accent-rgb: 255, 201, 221;
}
[data-palette="peach"] {
  --smp-contrast-accent: #ffdab8;
  --smp-contrast-accent-rgb: 255, 218, 184;
}
[data-palette="lavender"][data-bs-theme="light"]:not([data-contrast="high"]) {
  --bs-body-bg: #fbf8ff;
  --bs-body-bg-rgb: 251, 248, 255;
  --bs-body-color: #2c223a;
  --bs-body-color-rgb: 44, 34, 58;
  --bs-secondary-color: #665970;
  --bs-secondary-color-rgb: 102, 89, 112;
  --bs-border-color: #d8c9e8;
  --smp-accent: #68428c;
  --smp-accent-hover: #4f2d70;
  --smp-accent-rgb: 104, 66, 140;
  --smp-surface: #efe5fa;
  --smp-ticket-bg: #e7d2fc;
  --smp-ticket-ink: #38234e;
  --smp-control-border: #847091;
}
[data-palette="lavender"][data-bs-theme="dark"]:not([data-contrast="high"]) {
  --bs-body-bg: #211c29;
  --bs-body-bg-rgb: 33, 28, 41;
  --bs-body-color: #f4ebff;
  --bs-body-color-rgb: 244, 235, 255;
  --bs-secondary-color: #c8b9d7;
  --bs-secondary-color-rgb: 200, 185, 215;
  --bs-border-color: #776484;
  --smp-accent: #d5b5f5;
  --smp-accent-hover: #e5d0fa;
  --smp-accent-rgb: 213, 181, 245;
  --smp-surface: #30253c;
  --smp-ticket-bg: #d6b9f0;
  --smp-ticket-ink: #30203e;
  --smp-control-border: #ad97c0;
}
[data-palette="blush"][data-bs-theme="light"]:not([data-contrast="high"]) {
  --bs-body-bg: #fff8fa;
  --bs-body-bg-rgb: 255, 248, 250;
  --bs-body-color: #38252d;
  --bs-body-color-rgb: 56, 37, 45;
  --bs-secondary-color: #735762;
  --bs-secondary-color-rgb: 115, 87, 98;
  --bs-border-color: #e7c7d4;
  --smp-accent: #a33662;
  --smp-accent-hover: #7d2448;
  --smp-accent-rgb: 163, 54, 98;
  --smp-surface: #fbe6ee;
  --smp-ticket-bg: #f5cedd;
  --smp-ticket-ink: #57263a;
  --smp-control-border: #98717f;
}
[data-palette="blush"][data-bs-theme="dark"]:not([data-contrast="high"]) {
  --bs-body-bg: #2b1c23;
  --bs-body-bg-rgb: 43, 28, 35;
  --bs-body-color: #ffeaf1;
  --bs-body-color-rgb: 255, 234, 241;
  --bs-secondary-color: #d9b8c5;
  --bs-secondary-color-rgb: 217, 184, 197;
  --bs-border-color: #906677;
  --smp-accent: #f4b4cd;
  --smp-accent-hover: #ffd1e2;
  --smp-accent-rgb: 244, 180, 205;
  --smp-surface: #3c2731;
  --smp-ticket-bg: #efb9ce;
  --smp-ticket-ink: #422432;
  --smp-control-border: #c391a5;
}
[data-palette="peach"][data-bs-theme="light"]:not([data-contrast="high"]) {
  --bs-body-bg: #fff9f3;
  --bs-body-bg-rgb: 255, 249, 243;
  --bs-body-color: #39291f;
  --bs-body-color-rgb: 57, 41, 31;
  --bs-secondary-color: #725a49;
  --bs-secondary-color-rgb: 114, 90, 73;
  --bs-border-color: #e8cdb9;
  --smp-accent: #9a481c;
  --smp-accent-hover: #753310;
  --smp-accent-rgb: 154, 72, 28;
  --smp-surface: #ffead9;
  --smp-ticket-bg: #fbd4b4;
  --smp-ticket-ink: #54301b;
  --smp-control-border: #92735d;
}
[data-palette="peach"][data-bs-theme="dark"]:not([data-contrast="high"]) {
  --bs-body-bg: #2b211b;
  --bs-body-bg-rgb: 43, 33, 27;
  --bs-body-color: #fff0e4;
  --bs-body-color-rgb: 255, 240, 228;
  --bs-secondary-color: #d6bda9;
  --bs-secondary-color-rgb: 214, 189, 169;
  --bs-border-color: #8e715c;
  --smp-accent: #f5bc8f;
  --smp-accent-hover: #ffdab8;
  --smp-accent-rgb: 245, 188, 143;
  --smp-surface: #3c2d23;
  --smp-ticket-bg: #f1c29c;
  --smp-ticket-ink: #452c1a;
  --smp-control-border: #ba9779;
}
[data-palette]:not([data-palette="classic"]):not([data-contrast="high"]) {
  --bs-emphasis-color: var(--bs-body-color);
  --bs-emphasis-color-rgb: var(--bs-body-color-rgb);
  --bs-heading-color: var(--bs-body-color);
  --bs-secondary-bg: var(--smp-surface);
  --bs-tertiary-bg: var(--smp-surface);
  --bs-link-color: var(--smp-accent);
  --bs-link-color-rgb: var(--smp-accent-rgb);
  --bs-link-hover-color: var(--smp-accent-hover);
  --bs-link-hover-color-rgb: var(--smp-accent-rgb);
  --bs-primary: var(--smp-accent);
  --bs-primary-rgb: var(--smp-accent-rgb);
  --bs-primary-bg-subtle: var(--smp-surface);
  --bs-primary-text-emphasis: var(--smp-accent);
  --bs-primary-border-subtle: var(--bs-border-color);
}
.btn-primary {
  --bs-btn-color: var(--bs-body-bg);
  --bs-btn-bg: var(--smp-accent);
  --bs-btn-border-color: var(--smp-accent);
  --bs-btn-hover-color: var(--bs-body-bg);
  --bs-btn-hover-bg: var(--smp-accent-hover);
  --bs-btn-hover-border-color: var(--smp-accent-hover);
  --bs-btn-active-color: var(--bs-body-bg);
  --bs-btn-active-bg: var(--smp-accent-hover);
  --bs-btn-active-border-color: var(--smp-accent-hover);
  --bs-btn-disabled-color: var(--bs-body-bg);
  --bs-btn-disabled-bg: var(--smp-accent);
  --bs-btn-disabled-border-color: var(--smp-accent);
}
.btn-outline-primary {
  --bs-btn-color: var(--smp-accent);
  --bs-btn-border-color: var(--smp-accent);
  --bs-btn-hover-color: var(--bs-body-bg);
  --bs-btn-hover-bg: var(--smp-accent);
  --bs-btn-hover-border-color: var(--smp-accent);
  --bs-btn-active-color: var(--bs-body-bg);
  --bs-btn-active-bg: var(--smp-accent);
  --bs-btn-active-border-color: var(--smp-accent);
}
[data-palette]:not([data-palette="classic"]):not([data-contrast="high"]) .text-bg-primary { color: var(--bs-body-bg) !important; }
[data-contrast="high"] .badge { background: #000 !important; color: #fff !important; border: 1px solid #fff; }
[data-contrast="high"] .page-link { color: var(--smp-accent); background: #000; border-color: #fff; }
[data-contrast="high"] .page-item.active .page-link { color: #000; background: var(--smp-accent); }
@media (min-width: 992px) {
  .navbar-collapse { flex-wrap: wrap; }
  .site-header .navbar-nav { flex-wrap: wrap; }
  .site-header .navbar-collapse { row-gap: .75rem; justify-content: flex-end; }
}
@media (max-width: 991.98px) {
  .appearance-dropdown { flex: 1; min-width: 0; }
  .appearance-toggle { width: 100%; }
  .appearance-menu { position: static; width: 100%; max-width: none; margin-top: .5rem; box-shadow: none; }
}

/* Semantic feedback uses readable text/background pairs instead of Bootswatch's
   saturated fills. Keep the colors consistent across the decorative palettes. */
:root {
  --smp-success-bg: #dff2e9;
  --smp-success-ink: #164b37;
  --smp-success-border: #327453;
  --smp-warning-bg: #fff1cc;
  --smp-warning-ink: #664d03;
  --smp-warning-border: #8a6a13;
  --smp-danger-bg: #f8dfe3;
  --smp-danger-ink: #842029;
  --smp-danger-border: #a74753;
  --smp-info-bg: #e0effa;
  --smp-info-ink: #174966;
  --smp-info-border: #3e728e;
}
[data-bs-theme="dark"] {
  --smp-success-bg: #143b2b;
  --smp-success-ink: #c6f2db;
  --smp-success-border: #78b797;
  --smp-warning-bg: #403411;
  --smp-warning-ink: #ffe39a;
  --smp-warning-border: #b99a4a;
  --smp-danger-bg: #48232a;
  --smp-danger-ink: #ffd0d7;
  --smp-danger-border: #c0818a;
  --smp-info-bg: #173747;
  --smp-info-ink: #cbeeff;
  --smp-info-border: #7caabe;
}
.alert {
  color: var(--bs-alert-color);
  background-color: var(--bs-alert-bg);
  border: 1px solid var(--bs-alert-border-color);
}
.alert-success {
  --bs-alert-color: var(--smp-success-ink);
  --bs-alert-bg: var(--smp-success-bg);
  --bs-alert-border-color: var(--smp-success-border);
  --bs-alert-link-color: var(--smp-success-ink);
}
.alert-warning {
  --bs-alert-color: var(--smp-warning-ink);
  --bs-alert-bg: var(--smp-warning-bg);
  --bs-alert-border-color: var(--smp-warning-border);
  --bs-alert-link-color: var(--smp-warning-ink);
}
.alert-danger {
  --bs-alert-color: var(--smp-danger-ink);
  --bs-alert-bg: var(--smp-danger-bg);
  --bs-alert-border-color: var(--smp-danger-border);
  --bs-alert-link-color: var(--smp-danger-ink);
}
.alert-info {
  --bs-alert-color: var(--smp-info-ink);
  --bs-alert-bg: var(--smp-info-bg);
  --bs-alert-border-color: var(--smp-info-border);
  --bs-alert-link-color: var(--smp-info-ink);
}
.alert-primary, .alert-secondary, .alert-light, .alert-dark {
  --bs-alert-color: var(--bs-body-color);
  --bs-alert-bg: var(--smp-surface);
  --bs-alert-border-color: var(--smp-control-border);
  --bs-alert-link-color: var(--bs-body-color);
}
.alert .alert-link, .alert a { color: var(--bs-alert-link-color); }
.btn-outline-secondary {
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-bg: transparent;
  --bs-btn-border-color: var(--smp-control-border);
  --bs-btn-hover-color: var(--bs-body-bg);
  --bs-btn-hover-bg: var(--bs-body-color);
  --bs-btn-hover-border-color: var(--bs-body-color);
  --bs-btn-active-color: var(--bs-body-bg);
  --bs-btn-active-bg: var(--bs-body-color);
  --bs-btn-active-border-color: var(--bs-body-color);
  --bs-btn-disabled-color: var(--bs-body-color);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--smp-control-border);
}
[data-palette]:not([data-palette="classic"]):not([data-contrast="high"]) .card {
  --bs-card-bg: var(--smp-surface);
  --bs-card-cap-bg: var(--bs-body-bg);
  --bs-card-color: var(--bs-body-color);
  --bs-card-border-color: var(--bs-border-color);
}
[data-contrast="high"] .alert {
  --bs-alert-color: #fff;
  --bs-alert-bg: #000;
  --bs-alert-border-color: #fff;
  --bs-alert-link-color: var(--smp-contrast-accent);
}

/* Bootswatch's saturated pagination fills need readable pairs in every palette. */
#notification-history .pagination {
  --bs-pagination-color: var(--bs-body-color);
  --bs-pagination-bg: var(--bs-body-bg);
  --bs-pagination-border-color: var(--bs-border-color);
  --bs-pagination-hover-color: var(--bs-body-bg);
  --bs-pagination-hover-bg: var(--bs-body-color);
  --bs-pagination-hover-border-color: var(--bs-body-color);
  --bs-pagination-focus-color: var(--bs-body-bg);
  --bs-pagination-focus-bg: var(--bs-body-color);
  --bs-pagination-disabled-color: var(--bs-secondary-color);
  --bs-pagination-disabled-bg: var(--bs-body-bg);
  --bs-pagination-disabled-border-color: var(--bs-border-color);
}

/* Keep each notification and its expandable details readable on narrow screens.
   Explicit table roles and header references preserve the table relationships. */
@media (max-width: 575.98px) {
  #notification-history .table,
  #notification-history .table > tbody,
  #notification-history .table > tbody > tr,
  #notification-history .table > tbody > tr > td {
    display: block;
    width: 100%;
  }
  #notification-history .table > thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  #notification-history .table > tbody > tr > td {
    padding: 0 1rem 1rem;
    border-bottom: 0;
    overflow-wrap: anywhere;
  }
  #notification-history .table > tbody > tr + tr {
    border-top: 1px solid var(--bs-border-color);
  }
}