/* TranbjergDnD portal theme layer
   Additive overrides only: the existing portal theme remains the default.
*/

:root {
  --portal-theme-surface: #ffffff;
  --portal-theme-surface-muted: #f9fafb;
  --portal-theme-border: rgba(45, 90, 39, 0.14);
  --portal-theme-hover: #f0f8ef;
  --portal-theme-shadow: rgba(45, 90, 39, 0.10);
  --portal-theme-backdrop: rgba(20, 83, 45, 0.40);
  --portal-theme-input-bg: #ffffff;
  --portal-theme-input-text: #111827;
  --portal-theme-muted-text: #6b7280;
  --portal-theme-heading: var(--primary);
  --portal-theme-focus-ring: rgba(45, 90, 39, 0.16);
  --portal-theme-page-overlay-top: rgba(249, 250, 251, 0.65);
  --portal-theme-page-overlay-bottom: rgba(249, 250, 251, 0.65);
}

/* ------------------------------
   Top-right theme selector
------------------------------ */

.portal-theme-control {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 120;
  width: min(12.5rem, calc(100vw - 2rem));
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--portal-theme-border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--portal-theme-surface) 92%, transparent);
  box-shadow: 0 8px 22px var(--portal-theme-shadow);
  backdrop-filter: blur(10px);
}

.portal-theme-label {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--portal-theme-heading);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.portal-theme-select {
  width: 100%;
  min-height: 2.25rem;
  padding: 0.45rem 2rem 0.45rem 0.65rem;
  border: 1px solid var(--portal-theme-border);
  border-radius: 0.65rem;
  outline: none;
  background: var(--portal-theme-input-bg);
  color: var(--portal-theme-input-text);
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}

.portal-theme-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--portal-theme-focus-ring);
}

@media (max-width: 700px) {
  .portal-theme-control {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 10.5rem;
    padding: 0.55rem 0.65rem;
  }

  .portal-theme-label {
    font-size: 0.62rem;
  }

  .portal-theme-select {
    min-height: 2rem;
    font-size: 0.76rem;
  }
}

/* ------------------------------
   Shared themed components
------------------------------ */

html[data-portal-theme]:not([data-portal-theme="default"]) body {
  background-color: var(--bg-light);
  color: var(--text-dark);
}

html[data-portal-theme]:not([data-portal-theme="default"]) h1,
html[data-portal-theme]:not([data-portal-theme="default"]) h2,
html[data-portal-theme]:not([data-portal-theme="default"]) h3 {
  color: var(--portal-theme-heading);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .page-background {
  background-image:
    linear-gradient(
      var(--portal-theme-page-overlay-top),
      var(--portal-theme-page-overlay-bottom)
    ),
    url('/filer/Background.png');
}


html[data-portal-theme="dnd"] .page-background {
  background-image: url('/filer/dnd.jpg') !important;
  background-position: center center;
  background-size: cover;
  filter: none;
}

html[data-portal-theme="cthulhu"] .page-background {
  background-image: url('/filer/cthulhu.jpg') !important;
  background-position: center center;
  background-size: cover;
  filter: none;
}

html[data-portal-theme="starwars"] .page-background {
  background-image: url('/filer/starwars.jpg') !important;
  background-position: center center;
  background-size: cover;
  filter: none;
}

html[data-portal-theme]:not([data-portal-theme="default"]) .card,
html[data-portal-theme]:not([data-portal-theme="default"]) .character-editor-side-nav {
  border-color: var(--portal-theme-border);
  background: var(--portal-theme-surface);
  box-shadow: 0 10px 25px var(--portal-theme-shadow);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .input-field,
html[data-portal-theme]:not([data-portal-theme="default"]) .calc-input,
html[data-portal-theme]:not([data-portal-theme="default"]) .portal-theme-select {
  border-color: var(--portal-theme-border);
  background: var(--portal-theme-input-bg);
  color: var(--portal-theme-input-text);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .input-field:focus,
html[data-portal-theme]:not([data-portal-theme="default"]) .calc-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--portal-theme-focus-ring);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .character-card,
html[data-portal-theme]:not([data-portal-theme="default"]) .spell-level-box,
html[data-portal-theme]:not([data-portal-theme="default"]) .event-card {
  border-color: var(--portal-theme-border);
  background: var(--portal-theme-surface-muted);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .character-card:hover,
html[data-portal-theme]:not([data-portal-theme="default"]) .event-card:hover,
html[data-portal-theme]:not([data-portal-theme="default"]) .character-editor-side-nav-links button:hover {
  border-color: var(--primary);
  background: var(--portal-theme-hover);
  color: var(--primary);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .btn-secondary {
  border-color: var(--portal-theme-border);
  background: var(--portal-theme-surface);
  color: var(--primary);
}

html[data-portal-theme]:not([data-portal-theme="default"]) .btn-secondary:hover {
  border-color: var(--primary);
  background: var(--portal-theme-hover);
}

html[data-portal-theme]:not([data-portal-theme="default"]) #event-detail-modal,
html[data-portal-theme]:not([data-portal-theme="default"]) #profile-editor-modal,
html[data-portal-theme]:not([data-portal-theme="default"]) #character-editor-modal,
html[data-portal-theme]:not([data-portal-theme="default"]) #scheduler-character-signup-modal,
html[data-portal-theme]:not([data-portal-theme="default"]) #scheduler-character-sheet-modal {
  background-color: var(--portal-theme-backdrop) !important;
}

/* Hard-coded Tailwind green classes used throughout the portal */
html[data-portal-theme]:not([data-portal-theme="default"]) .text-green-700,
html[data-portal-theme]:not([data-portal-theme="default"]) .text-green-800,
html[data-portal-theme]:not([data-portal-theme="default"]) .text-green-900,
html[data-portal-theme]:not([data-portal-theme="default"]) .text-green-950 {
  color: var(--primary) !important;
}

html[data-portal-theme]:not([data-portal-theme="default"]) .bg-green-50,
html[data-portal-theme]:not([data-portal-theme="default"]) .bg-green-100 {
  background-color: var(--portal-theme-hover) !important;
}

html[data-portal-theme]:not([data-portal-theme="default"]) .border-green-200 {
  border-color: var(--portal-theme-border) !important;
}

html[data-portal-theme]:not([data-portal-theme="default"]) .ring-green-600 {
  --tw-ring-color: var(--primary) !important;
}

/* ------------------------------
   D&D firelit cavern fantasy theme
------------------------------ */

html[data-portal-theme="dnd"] {
  --primary: #6d431d;
  --accent: #d9821d;
  --bg-light: #1b2117;
  --text-dark: #332a19;

  --portal-theme-surface: rgba(239, 227, 185, 0.95);
  --portal-theme-surface-muted: rgba(220, 203, 153, 0.95);
  --portal-theme-border: rgba(111, 82, 39, 0.46);
  --portal-theme-hover: rgba(232, 212, 157, 0.98);
  --portal-theme-shadow: rgba(8, 12, 8, 0.34);
  --portal-theme-backdrop: rgba(12, 18, 13, 0.68);
  --portal-theme-input-bg: rgba(248, 239, 207, 0.98);
  --portal-theme-input-text: #332a19;
  --portal-theme-muted-text: #786946;
  --portal-theme-heading: #5c391b;
  --portal-theme-focus-ring: rgba(217, 130, 29, 0.28);
  --portal-theme-page-overlay-top: transparent;
  --portal-theme-page-overlay-bottom: transparent;
}

html[data-portal-theme="dnd"] body {
  background:
    radial-gradient(circle at 55% 38%, rgba(217, 130, 29, 0.18), transparent 22rem),
    radial-gradient(circle at 5% 12%, rgba(150, 126, 71, 0.14), transparent 20rem),
    linear-gradient(145deg, #111711, #252b1c 52%, #111612);
}

html[data-portal-theme="dnd"] h1,
html[data-portal-theme="dnd"] h2,
html[data-portal-theme="dnd"] h3 {
  color: #5c391b;
  text-shadow: 0 1px 0 rgba(255, 246, 214, 0.26);
}

html[data-portal-theme="dnd"] header h1 {
  color: #f0df9e;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, 0.90),
    0 0 16px rgba(217, 130, 29, 0.34);
}

html[data-portal-theme="dnd"] header p {
  color: #e7d89e !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.78);
}

html[data-portal-theme="dnd"] header .bg-green-100 {
  border: 1px solid rgba(217, 130, 29, 0.48);
  background:
    radial-gradient(circle, rgba(217, 130, 29, 0.66), rgba(37, 43, 28, 0.94)) !important;
  box-shadow: 0 0 22px rgba(217, 130, 29, 0.24);
}

html[data-portal-theme="dnd"] header .text-green-700 {
  color: #fff0ba !important;
}

html[data-portal-theme="dnd"] .card,
html[data-portal-theme="dnd"] .character-editor-side-nav {
  border: 1px solid rgba(111, 82, 39, 0.46);
  background:
    radial-gradient(circle at 5% 8%, rgba(216, 172, 82, 0.10), transparent 10rem),
    linear-gradient(145deg, rgba(244, 233, 193, 0.96), rgba(219, 202, 151, 0.96));
  box-shadow:
    inset 0 0 0 1px rgba(255, 248, 218, 0.34),
    0 12px 26px rgba(8, 12, 8, 0.34);
}

html[data-portal-theme="dnd"] .portal-theme-control {
  border-color: rgba(217, 130, 29, 0.40);
  background: rgba(31, 38, 25, 0.92);
  box-shadow:
    0 0 0 1px rgba(216, 172, 82, 0.10),
    0 9px 24px rgba(0, 0, 0, 0.42);
}

html[data-portal-theme="dnd"] .portal-theme-label {
  color: #eadb9a;
}

html[data-portal-theme="dnd"] .portal-theme-select {
  border-color: rgba(217, 130, 29, 0.42);
  background: #2c3522;
  color: #f1e1a5;
}

html[data-portal-theme="dnd"] .btn-primary {
  border: 1px solid rgba(110, 62, 19, 0.72);
  background:
    linear-gradient(180deg, rgba(211, 119, 20, 0.98), rgba(139, 73, 17, 0.98));
  color: #fff6d3 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 233, 175, 0.20),
    0 5px 15px rgba(80, 43, 13, 0.28);
}

html[data-portal-theme="dnd"] .btn-primary:hover {
  background: linear-gradient(180deg, #e28c25, #9c5318);
  transform: translateY(-1px);
}

html[data-portal-theme="dnd"] .btn-secondary {
  border-color: rgba(111, 82, 39, 0.42);
  background: rgba(241, 229, 188, 0.92);
  color: #5c391b;
}

html[data-portal-theme="dnd"] .btn-secondary:hover {
  border-color: #d9821d;
  background: rgba(232, 212, 157, 0.98);
}

html[data-portal-theme="dnd"] .input-field,
html[data-portal-theme="dnd"] .calc-input {
  border-color: rgba(111, 82, 39, 0.36);
  background:
    linear-gradient(180deg, rgba(250, 242, 211, 0.98), rgba(237, 224, 181, 0.98));
  color: #332a19;
  box-shadow: inset 0 1px 3px rgba(73, 54, 25, 0.10);
}

html[data-portal-theme="dnd"] .input-field:focus,
html[data-portal-theme="dnd"] .calc-input:focus {
  border-color: #d9821d;
  box-shadow:
    0 0 0 3px rgba(217, 130, 29, 0.24),
    inset 0 1px 3px rgba(73, 54, 25, 0.10);
}

html[data-portal-theme="dnd"] .character-card,
html[data-portal-theme="dnd"] .spell-level-box,
html[data-portal-theme="dnd"] .event-card {
  border-color: rgba(111, 82, 39, 0.38);
  background:
    radial-gradient(circle at 8% 6%, rgba(217, 130, 29, 0.08), transparent 8rem),
    linear-gradient(145deg, rgba(231, 215, 165, 0.98), rgba(211, 193, 143, 0.98));
}

html[data-portal-theme="dnd"] .character-card:hover,
html[data-portal-theme="dnd"] .event-card:hover,
html[data-portal-theme="dnd"] .character-editor-side-nav-links button:hover {
  border-color: rgba(217, 130, 29, 0.68);
  background:
    radial-gradient(circle at 8% 6%, rgba(217, 130, 29, 0.14), transparent 8rem),
    linear-gradient(145deg, rgba(238, 219, 166, 1), rgba(216, 194, 139, 1));
  color: #6d431d;
}

html[data-portal-theme="dnd"] .sheet-section {
  border-top-color: rgba(111, 82, 39, 0.24);
}

html[data-portal-theme="dnd"] .text-gray-900,
html[data-portal-theme="dnd"] .text-gray-800,
html[data-portal-theme="dnd"] .text-gray-700,
html[data-portal-theme="dnd"] .text-gray-600 {
  color: #3d321f !important;
}

html[data-portal-theme="dnd"] .text-gray-500,
html[data-portal-theme="dnd"] .text-gray-400 {
  color: #786946 !important;
}

html[data-portal-theme="dnd"] .bg-white,
html[data-portal-theme="dnd"] .bg-white\/95 {
  background-color: rgba(239, 227, 185, 0.96) !important;
}

html[data-portal-theme="dnd"] .bg-gray-50,
html[data-portal-theme="dnd"] .bg-gray-100 {
  background-color: rgba(220, 203, 153, 0.96) !important;
}

html[data-portal-theme="dnd"] .tab-btn.active,
html[data-portal-theme="dnd"] .vote-btn:hover,
html[data-portal-theme="dnd"] .vote-btn.vote-active {
  border-color: #8b4917;
  background: #8b4917;
  color: #fff2c4;
}

html[data-portal-theme="dnd"] #event-detail-modal,
html[data-portal-theme="dnd"] #profile-editor-modal,
html[data-portal-theme="dnd"] #character-editor-modal,
html[data-portal-theme="dnd"] #scheduler-character-signup-modal,
html[data-portal-theme="dnd"] #scheduler-character-sheet-modal {
  background-color: rgba(12, 18, 13, 0.72) !important;
}

html[data-portal-theme="dnd"] ::selection {
  background: rgba(217, 130, 29, 0.72);
  color: #fff7dc;
}

html[data-portal-theme="dnd"] ::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}

html[data-portal-theme="dnd"] ::-webkit-scrollbar-track {
  background: #1c2418;
}

html[data-portal-theme="dnd"] ::-webkit-scrollbar-thumb {
  border: 2px solid #1c2418;
  background: #8a6931;
}

html[data-portal-theme="dnd"] ::-webkit-scrollbar-thumb:hover {
  background: #d9821d;
}


/* ------------------------------
   Call of Cthulhu occult-ocean horror theme
------------------------------ */

html[data-portal-theme="cthulhu"] {
  --primary: #a22328;
  --accent: #6fd3db;
  --bg-light: #06121a;
  --text-dark: #dbe7ea;

  --portal-theme-surface: rgba(7, 25, 34, 0.90);
  --portal-theme-surface-muted: rgba(11, 34, 46, 0.90);
  --portal-theme-border: rgba(84, 164, 173, 0.26);
  --portal-theme-hover: rgba(17, 47, 61, 0.95);
  --portal-theme-shadow: rgba(0, 0, 0, 0.55);
  --portal-theme-backdrop: rgba(2, 10, 16, 0.84);
  --portal-theme-input-bg: rgba(8, 25, 35, 0.95);
  --portal-theme-input-text: #dbe7ea;
  --portal-theme-muted-text: #91abb3;
  --portal-theme-heading: #d54a4f;
  --portal-theme-focus-ring: rgba(162, 35, 40, 0.26);
  --portal-theme-page-overlay-top: rgba(3, 13, 20, 0.54);
  --portal-theme-page-overlay-bottom: rgba(2, 10, 16, 0.76);
}

html[data-portal-theme="cthulhu"] body {
  position: relative;
  background:
    radial-gradient(circle at 50% -5%, rgba(111, 211, 219, 0.12), transparent 18rem),
    radial-gradient(circle at 50% 100%, rgba(0, 0, 0, 0.64), transparent 34rem),
    radial-gradient(circle at 50% 12%, rgba(162, 35, 40, 0.10), transparent 16rem),
    linear-gradient(145deg, #050c12, #07161f 48%, #03080d);
}

html[data-portal-theme="cthulhu"] body::before,
html[data-portal-theme="cthulhu"] body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

html[data-portal-theme="cthulhu"] body::before {
  background:
    radial-gradient(ellipse at center, transparent 32%, rgba(0, 0, 0, 0.58) 100%),
    repeating-radial-gradient(
      ellipse at 22% 28%,
      rgba(45, 88, 102, 0.06) 0 2px,
      transparent 3px 20px
    );
  mix-blend-mode: multiply;
}

html[data-portal-theme="cthulhu"] body::after {
  background:
    linear-gradient(180deg, rgba(111, 211, 219, 0.04), transparent 18rem),
    radial-gradient(circle at 50% 14%, rgba(202, 34, 43, 0.18), transparent 8rem);
  opacity: 0.9;
}

html[data-portal-theme="cthulhu"] h1,
html[data-portal-theme="cthulhu"] h2,
html[data-portal-theme="cthulhu"] h3 {
  color: #e0565b;
  text-shadow: 0 0 14px rgba(162, 35, 40, 0.18);
}

html[data-portal-theme="cthulhu"] header h1 {
  color: #d8edf2;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, 0.80),
    0 0 18px rgba(111, 211, 219, 0.14);
}

html[data-portal-theme="cthulhu"] header p {
  color: #a3bec5 !important;
}

html[data-portal-theme="cthulhu"] header .bg-green-100 {
  border: 1px solid rgba(111, 211, 219, 0.26);
  background:
    radial-gradient(circle, rgba(162, 35, 40, 0.44), rgba(9, 28, 37, 0.96)) !important;
  box-shadow: 0 0 24px rgba(162, 35, 40, 0.18);
}

html[data-portal-theme="cthulhu"] header .text-green-700 {
  color: #cfeef4 !important;
}

html[data-portal-theme="cthulhu"] .card,
html[data-portal-theme="cthulhu"] .character-editor-side-nav {
  position: relative;
  border: 1px solid rgba(84, 164, 173, 0.26);
  border-radius: 0.5rem;
  background:
    linear-gradient(180deg, rgba(10, 30, 40, 0.95), rgba(7, 22, 31, 0.96));
  box-shadow:
    inset 0 0 0 1px rgba(111, 211, 219, 0.05),
    0 12px 28px rgba(0, 0, 0, 0.46);
}

html[data-portal-theme="cthulhu"] .portal-theme-control {
  border-color: rgba(84, 164, 173, 0.30);
  border-radius: 0.5rem;
  background: rgba(5, 18, 25, 0.92);
  box-shadow:
    0 0 0 1px rgba(111, 211, 219, 0.06),
    0 10px 25px rgba(0, 0, 0, 0.56);
}

html[data-portal-theme="cthulhu"] .portal-theme-label {
  color: #b5d9e0;
}

html[data-portal-theme="cthulhu"] .portal-theme-select {
  border-color: rgba(84, 164, 173, 0.34);
  border-radius: 0.38rem;
  background: rgba(8, 24, 34, 0.95);
  color: #d9edf2;
}

html[data-portal-theme="cthulhu"] .btn-primary,
html[data-portal-theme="cthulhu"] .btn-secondary,
html[data-portal-theme="cthulhu"] .tab-btn,
html[data-portal-theme="cthulhu"] .status-pill,
html[data-portal-theme="cthulhu"] .vote-btn,
html[data-portal-theme="cthulhu"] .input-field,
html[data-portal-theme="cthulhu"] .calc-input {
  border-radius: 0.35rem;
}

html[data-portal-theme="cthulhu"] .btn-primary {
  border: 1px solid rgba(202, 34, 43, 0.65);
  background:
    linear-gradient(180deg, rgba(174, 35, 43, 0.98), rgba(119, 23, 30, 0.98));
  color: #f8f3f3 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 220, 220, 0.12),
    0 5px 16px rgba(78, 8, 12, 0.34);
}

html[data-portal-theme="cthulhu"] .btn-primary:hover {
  background: linear-gradient(180deg, #c32d35, #8b1d24);
  transform: translateY(-1px);
}

html[data-portal-theme="cthulhu"] .btn-secondary {
  border-color: rgba(84, 164, 173, 0.28);
  background: rgba(11, 34, 46, 0.92);
  color: #bfe8ee;
}

html[data-portal-theme="cthulhu"] .btn-secondary:hover {
  border-color: #a22328;
  background: rgba(17, 47, 61, 0.98);
  color: #e9f8fb;
}

html[data-portal-theme="cthulhu"] .input-field,
html[data-portal-theme="cthulhu"] .calc-input {
  border-color: rgba(84, 164, 173, 0.22);
  background:
    linear-gradient(180deg, rgba(8, 24, 34, 0.98), rgba(9, 28, 38, 0.98));
  color: #dbe7ea;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.22);
}

html[data-portal-theme="cthulhu"] .input-field:focus,
html[data-portal-theme="cthulhu"] .calc-input:focus {
  border-color: #a22328;
  box-shadow:
    0 0 0 3px rgba(162, 35, 40, 0.20),
    inset 0 1px 3px rgba(0, 0, 0, 0.22);
}

html[data-portal-theme="cthulhu"] .character-card,
html[data-portal-theme="cthulhu"] .spell-level-box,
html[data-portal-theme="cthulhu"] .event-card {
  border-color: rgba(84, 164, 173, 0.22);
  background:
    linear-gradient(180deg, rgba(11, 34, 46, 0.95), rgba(8, 26, 36, 0.95));
}

html[data-portal-theme="cthulhu"] .character-card:hover,
html[data-portal-theme="cthulhu"] .event-card:hover,
html[data-portal-theme="cthulhu"] .character-editor-side-nav-links button:hover {
  border-color: rgba(162, 35, 40, 0.60);
  background:
    linear-gradient(180deg, rgba(15, 40, 53, 0.98), rgba(10, 30, 40, 0.98));
  color: #f06b71;
}

html[data-portal-theme="cthulhu"] .sheet-section {
  border-top-color: rgba(84, 164, 173, 0.16);
}

html[data-portal-theme="cthulhu"] .sheet-label,
html[data-portal-theme="cthulhu"] .text-gray-500,
html[data-portal-theme="cthulhu"] .text-gray-400 {
  color: #91abb3 !important;
}

html[data-portal-theme="cthulhu"] .text-gray-900,
html[data-portal-theme="cthulhu"] .text-gray-800,
html[data-portal-theme="cthulhu"] .text-gray-700,
html[data-portal-theme="cthulhu"] .text-gray-600 {
  color: #dbe7ea !important;
}

html[data-portal-theme="cthulhu"] .bg-white,
html[data-portal-theme="cthulhu"] .bg-white\/95 {
  background-color: rgba(8, 25, 34, 0.96) !important;
}

html[data-portal-theme="cthulhu"] .bg-gray-50,
html[data-portal-theme="cthulhu"] .bg-gray-100 {
  background-color: rgba(11, 34, 46, 0.96) !important;
}

html[data-portal-theme="cthulhu"] .status-green {
  background: rgba(52, 100, 86, 0.22);
  color: #9be3d2;
}

/* Keep success/setup text readable on the dark Call of Cthulhu theme. */
html[data-portal-theme="cthulhu"] .text-green-700,
html[data-portal-theme="cthulhu"] .text-green-800,
html[data-portal-theme="cthulhu"] .text-green-900,
html[data-portal-theme="cthulhu"] .text-green-950,
html[data-portal-theme="cthulhu"] .text-green-700\/70,
html[data-portal-theme="cthulhu"] .text-green-800\/70,
html[data-portal-theme="cthulhu"] .text-green-900\/70,
html[data-portal-theme="cthulhu"] .text-green-950\/70,
html[data-portal-theme="cthulhu"] .text-green-700\/80,
html[data-portal-theme="cthulhu"] .text-green-800\/80,
html[data-portal-theme="cthulhu"] .text-green-900\/80,
html[data-portal-theme="cthulhu"] .text-green-950\/80 {
  color: #9be3d2 !important;
}

html[data-portal-theme="cthulhu"] .border-green-200.bg-green-50,
html[data-portal-theme="cthulhu"] .bg-green-50 {
  border-color: rgba(84, 164, 173, 0.34) !important;
  background-color: rgba(11, 34, 46, 0.96) !important;
}

html[data-portal-theme="cthulhu"] .status-blue,
html[data-portal-theme="cthulhu"] .status-purple {
  background: rgba(80, 123, 141, 0.22);
  color: #c5ebf5;
}

html[data-portal-theme="cthulhu"] .status-orange {
  background: rgba(150, 82, 49, 0.24);
  color: #ffcea6;
}

html[data-portal-theme="cthulhu"] .status-gray {
  background: rgba(116, 129, 138, 0.18);
  color: #c4d2d8;
}

html[data-portal-theme="cthulhu"] .tab-btn.active,
html[data-portal-theme="cthulhu"] .vote-btn:hover,
html[data-portal-theme="cthulhu"] .vote-btn.vote-active {
  border-color: #a22328;
  background: #a22328;
  color: #f6f3f4;
}

html[data-portal-theme="cthulhu"] #event-detail-modal,
html[data-portal-theme="cthulhu"] #profile-editor-modal,
html[data-portal-theme="cthulhu"] #character-editor-modal,
html[data-portal-theme="cthulhu"] #scheduler-character-signup-modal,
html[data-portal-theme="cthulhu"] #scheduler-character-sheet-modal {
  background-color: rgba(1, 8, 14, 0.86) !important;
}

html[data-portal-theme="cthulhu"] ::selection {
  background: rgba(162, 35, 40, 0.82);
  color: #fff7f7;
}

html[data-portal-theme="cthulhu"] ::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}

html[data-portal-theme="cthulhu"] ::-webkit-scrollbar-track {
  background: #09141c;
}

html[data-portal-theme="cthulhu"] ::-webkit-scrollbar-thumb {
  border: 2px solid #09141c;
  background: #2f5b67;
}

html[data-portal-theme="cthulhu"] ::-webkit-scrollbar-thumb:hover {
  background: #a22328;
}


/* ------------------------------
   Star Wars-inspired sci-fi theme
   No external logos or copyrighted artwork are used.
------------------------------ */

html[data-portal-theme="starwars"] {
  --primary: #57b9f2;
  --accent: #f2c34b;
  --bg-light: #07111e;
  --text-dark: #e8f5ff;

  --portal-theme-surface: rgba(10, 28, 45, 0.96);
  --portal-theme-surface-muted: rgba(15, 39, 59, 0.96);
  --portal-theme-border: rgba(87, 185, 242, 0.34);
  --portal-theme-hover: rgba(28, 71, 98, 0.88);
  --portal-theme-shadow: rgba(0, 0, 0, 0.42);
  --portal-theme-backdrop: rgba(0, 5, 13, 0.78);
  --portal-theme-input-bg: rgba(5, 19, 33, 0.96);
  --portal-theme-input-text: #e8f5ff;
  --portal-theme-muted-text: #9fb9cb;
  --portal-theme-heading: #75cbff;
  --portal-theme-focus-ring: rgba(87, 185, 242, 0.28);
  --portal-theme-page-overlay-top: rgba(0, 7, 18, 0.90);
  --portal-theme-page-overlay-bottom: rgba(3, 18, 32, 0.86);
}

html[data-portal-theme="starwars"] body {
  background-image:
    radial-gradient(circle at 12% 18%, rgba(117, 203, 255, 0.14), transparent 20rem),
    radial-gradient(circle at 82% 12%, rgba(242, 195, 75, 0.09), transparent 18rem),
    linear-gradient(145deg, #050c16, #0b1c2c);
}

html[data-portal-theme="starwars"] .card {
  border-radius: 0.5rem;
  box-shadow:
    0 0 0 1px rgba(87, 185, 242, 0.08),
    0 10px 28px rgba(0, 0, 0, 0.44);
}

html[data-portal-theme="starwars"] .btn-primary,
html[data-portal-theme="starwars"] .btn-secondary,
html[data-portal-theme="starwars"] .tab-btn,
html[data-portal-theme="starwars"] .status-pill,
html[data-portal-theme="starwars"] .vote-btn,
html[data-portal-theme="starwars"] .input-field,
html[data-portal-theme="starwars"] .calc-input,
html[data-portal-theme="starwars"] .portal-theme-control,
html[data-portal-theme="starwars"] .portal-theme-select {
  border-radius: 0.35rem;
}

html[data-portal-theme="starwars"] .btn-primary {
  border: 1px solid rgba(117, 203, 255, 0.42);
  background: linear-gradient(135deg, #14547b, #1e739e);
  color: #f4fbff !important;
  box-shadow: 0 0 16px rgba(87, 185, 242, 0.18);
}

html[data-portal-theme="starwars"] .btn-primary:hover {
  background: #236f96;
  box-shadow: 0 0 20px rgba(87, 185, 242, 0.28);
}

html[data-portal-theme="starwars"] .text-gray-900,
html[data-portal-theme="starwars"] .text-gray-800,
html[data-portal-theme="starwars"] .text-gray-700,
html[data-portal-theme="starwars"] .text-gray-600 {
  color: #e8f5ff !important;
}

html[data-portal-theme="starwars"] .text-gray-500,
html[data-portal-theme="starwars"] .text-gray-400 {
  color: #9fb9cb !important;
}

html[data-portal-theme="starwars"] .bg-white,
html[data-portal-theme="starwars"] .bg-white\/95 {
  background-color: var(--portal-theme-surface) !important;
}

html[data-portal-theme="starwars"] .bg-gray-50,
html[data-portal-theme="starwars"] .bg-gray-100 {
  background-color: var(--portal-theme-surface-muted) !important;
}

html[data-portal-theme="starwars"] .border-gray-200,
html[data-portal-theme="starwars"] .border-gray-300,
html[data-portal-theme="starwars"] .border {
  border-color: var(--portal-theme-border) !important;
}

html[data-portal-theme="starwars"] .status-gray {
  background: rgba(148, 163, 184, 0.18);
  color: #d9ebf5;
}

html[data-portal-theme="starwars"] .status-blue,
html[data-portal-theme="starwars"] .status-green {
  background: rgba(87, 185, 242, 0.18);
  color: #bfe8ff;
}

html[data-portal-theme="starwars"] .status-purple {
  background: rgba(167, 139, 250, 0.18);
  color: #ddd3ff;
}

html[data-portal-theme="starwars"] .status-orange {
  background: rgba(242, 195, 75, 0.18);
  color: #ffe39a;
}

/* Missing-choice highlighting must remain obvious in every theme */
html[data-portal-theme="dnd"] .bg-yellow-50,
html[data-portal-theme="cthulhu"] .bg-yellow-50,
html[data-portal-theme="starwars"] .bg-yellow-50 {
  background-color: rgba(254, 243, 199, 0.96) !important;
}

html[data-portal-theme="dnd"] .text-yellow-700,
html[data-portal-theme="dnd"] .text-yellow-800,
html[data-portal-theme="cthulhu"] .text-yellow-700,
html[data-portal-theme="cthulhu"] .text-yellow-800,
html[data-portal-theme="starwars"] .text-yellow-700,
html[data-portal-theme="starwars"] .text-yellow-800 {
  color: #854d0e !important;
}

html[data-portal-theme="dnd"] .border-yellow-200,
html[data-portal-theme="cthulhu"] .border-yellow-200,
html[data-portal-theme="starwars"] .border-yellow-200 {
  border-color: #fde68a !important;
}

/* ------------------------------
   Character creator readability fix for dark themes
   Keeps the Call of Cthulhu red and Star Wars blue accent headings/buttons intact,
   but prevents inherited dark grey text in Saving Throws & Skills and other
   character-editor form rows from becoming unreadable.
------------------------------ */

html[data-portal-theme="cthulhu"] #character-editor-modal .sheet-check-row,
html[data-portal-theme="cthulhu"] #character-editor-modal .sheet-check-row label,
html[data-portal-theme="cthulhu"] #character-editor-modal .sheet-check-row span,
html[data-portal-theme="cthulhu"] #character-editor-modal .sheet-check-list,
html[data-portal-theme="cthulhu"] #character-editor-modal details,
html[data-portal-theme="cthulhu"] #character-editor-modal details > summary,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-700,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-600,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-700,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-600,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-700,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-600,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-700,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-600 {
  color: #dbe7ea !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .sheet-label,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-500,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-slate-400,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-500,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-neutral-400,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-500,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-zinc-400,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-500,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-stone-400 {
  color: #a7c7cd !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .sheet-check-row,
html[data-portal-theme="starwars"] #character-editor-modal .sheet-check-row label,
html[data-portal-theme="starwars"] #character-editor-modal .sheet-check-row span,
html[data-portal-theme="starwars"] #character-editor-modal .sheet-check-list,
html[data-portal-theme="starwars"] #character-editor-modal details,
html[data-portal-theme="starwars"] #character-editor-modal details > summary,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-900,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-800,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-700,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-600,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-900,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-800,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-700,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-600,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-900,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-800,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-700,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-600,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-900,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-800,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-700,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-600 {
  color: #e8f5ff !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .sheet-label,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-500,
html[data-portal-theme="starwars"] #character-editor-modal .text-slate-400,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-500,
html[data-portal-theme="starwars"] #character-editor-modal .text-neutral-400,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-500,
html[data-portal-theme="starwars"] #character-editor-modal .text-zinc-400,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-500,
html[data-portal-theme="starwars"] #character-editor-modal .text-stone-400 {
  color: #bfe8ff !important;
}


/* ------------------------------
   Star Wars missing-choice warnings: Sith red instead of pale yellow
   Keeps the Star Wars light-blue accents intact, but makes unresolved setup
   choices and highlighted tabs/categories readable and thematically consistent.
------------------------------ */

html[data-portal-theme="starwars"] #character-editor-modal .bg-yellow-50,
html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 {
  background: linear-gradient(135deg, rgba(69, 10, 10, 0.98), rgba(127, 29, 29, 0.92)) !important;
  border-color: rgba(248, 113, 113, 0.72) !important;
  color: #fff1f2 !important;
  box-shadow:
    0 0 0 1px rgba(248, 113, 113, 0.18),
    0 0 24px rgba(220, 38, 38, 0.20) !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert summary,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 > summary,
html[data-portal-theme="starwars"] #character-editor-modal .text-yellow-950,
html[data-portal-theme="starwars"] #character-editor-modal .text-yellow-900,
html[data-portal-theme="starwars"] #character-editor-modal .text-yellow-800,
html[data-portal-theme="starwars"] #character-editor-modal .text-yellow-700 {
  color: #fff1f2 !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .border-yellow-300,
html[data-portal-theme="starwars"] #character-editor-modal .border-yellow-200 {
  border-color: rgba(248, 113, 113, 0.72) !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert .bg-white,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .bg-white,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .bg-white\/70 {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(248, 113, 113, 0.58) !important;
  color: #fff1f2 !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-900,
html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-800,
html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-700,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .text-gray-900,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .text-gray-800,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .text-gray-700 {
  color: #fff1f2 !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-green-800,
html[data-portal-theme="starwars"] #character-editor-modal details.bg-yellow-50 .text-green-800 {
  color: #ff8a8a !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-needs-attention {
  border-color: rgba(248, 113, 113, 0.82) !important;
  background: rgba(127, 29, 29, 0.52) !important;
  color: #fff1f2 !important;
  box-shadow:
    0 0 0 2px rgba(239, 68, 68, 0.42),
    0 0 18px rgba(220, 38, 38, 0.18) !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .tdnd-needs-attention-soft {
  border-color: rgba(248, 113, 113, 0.62) !important;
  background: rgba(69, 10, 10, 0.36) !important;
  color: #fff1f2 !important;
}

html[data-portal-theme="starwars"] #dnd-character-tab-bar [data-dnd-character-tab].tdnd-tab-needs-attention:not([aria-selected="true"]) {
  border-color: rgba(248, 113, 113, 0.82) !important;
  background: linear-gradient(135deg, rgba(69, 10, 10, 0.96), rgba(127, 29, 29, 0.90)) !important;
  color: #fff1f2 !important;
  box-shadow: 0 0 14px rgba(220, 38, 38, 0.24) !important;
}

html[data-portal-theme="starwars"] #dnd-character-tab-bar [data-dnd-character-tab].tdnd-tab-needs-attention[aria-selected="true"] {
  box-shadow:
    0 0 0 3px rgba(239, 68, 68, 0.62),
    0 0 20px rgba(220, 38, 38, 0.22) !important;
}

html[data-portal-theme="starwars"] #dnd-character-tab-bar .tdnd-warning-pill,
html[data-portal-theme="starwars"] #character-editor-modal .tdnd-warning-pill {
  border-color: rgba(248, 113, 113, 0.88) !important;
  background: #7f1d1d !important;
  color: #fff1f2 !important;
  box-shadow: 0 0 10px rgba(220, 38, 38, 0.28) !important;
}

/* ------------------------------
   Call of Cthulhu missing-choice warnings: eldritch crimson instead of pale yellow
   Keeps the existing Call of Cthulhu red accent language, but removes unreadable
   pale-yellow warning panels from the character creator.
------------------------------ */

html[data-portal-theme="cthulhu"] #character-editor-modal .bg-yellow-50,
html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 {
  background: linear-gradient(135deg, rgba(32, 6, 12, 0.98), rgba(92, 18, 25, 0.92)) !important;
  border-color: rgba(185, 28, 28, 0.78) !important;
  color: #f8e7e7 !important;
  box-shadow:
    0 0 0 1px rgba(185, 28, 28, 0.20),
    0 0 24px rgba(127, 29, 29, 0.24) !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert summary,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 > summary,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-yellow-950,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-yellow-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-yellow-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .text-yellow-700 {
  color: #f8e7e7 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .border-yellow-300,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-yellow-200 {
  border-color: rgba(185, 28, 28, 0.78) !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert .bg-white,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .bg-white,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .bg-white\/70 {
  background: rgba(8, 18, 22, 0.88) !important;
  border-color: rgba(185, 28, 28, 0.62) !important;
  color: #f8e7e7 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-900,
html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-800,
html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-gray-700,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .text-gray-900,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .text-gray-800,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .text-gray-700 {
  color: #f8e7e7 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-missing-choice-sync-alert .text-green-800,
html[data-portal-theme="cthulhu"] #character-editor-modal details.bg-yellow-50 .text-green-800 {
  color: #ffb4a8 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-needs-attention {
  border-color: rgba(185, 28, 28, 0.86) !important;
  background: rgba(92, 18, 25, 0.54) !important;
  color: #f8e7e7 !important;
  box-shadow:
    0 0 0 2px rgba(185, 28, 28, 0.42),
    0 0 18px rgba(127, 29, 29, 0.22) !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-needs-attention-soft {
  border-color: rgba(185, 28, 28, 0.66) !important;
  background: rgba(32, 6, 12, 0.38) !important;
  color: #f8e7e7 !important;
}

html[data-portal-theme="cthulhu"] #dnd-character-tab-bar [data-dnd-character-tab].tdnd-tab-needs-attention:not([aria-selected="true"]) {
  border-color: rgba(185, 28, 28, 0.86) !important;
  background: linear-gradient(135deg, rgba(32, 6, 12, 0.98), rgba(92, 18, 25, 0.92)) !important;
  color: #f8e7e7 !important;
  box-shadow: 0 0 14px rgba(127, 29, 29, 0.28) !important;
}

html[data-portal-theme="cthulhu"] #dnd-character-tab-bar [data-dnd-character-tab].tdnd-tab-needs-attention[aria-selected="true"] {
  box-shadow:
    0 0 0 3px rgba(185, 28, 28, 0.62),
    0 0 20px rgba(127, 29, 29, 0.26) !important;
}

html[data-portal-theme="cthulhu"] #dnd-character-tab-bar .tdnd-warning-pill,
html[data-portal-theme="cthulhu"] #character-editor-modal .tdnd-warning-pill {
  border-color: rgba(185, 28, 28, 0.88) !important;
  background: #5c1219 !important;
  color: #f8e7e7 !important;
  box-shadow: 0 0 10px rgba(127, 29, 29, 0.30) !important;
}


/* Character Creator semantic surfaces v1 */
#character-editor-modal [data-feature-guidance],
#character-editor-modal [data-maneuver-description],
#character-editor-modal [data-tool-description],
#character-editor-modal [data-weapon-mastery-description],
#character-editor-modal [data-weapon-mastery-glossary] {
  color: #263244;
}

#character-editor-modal [data-feature-guidance] summary,
#character-editor-modal [data-maneuver-description] summary,
#character-editor-modal [data-tool-description] summary,
#character-editor-modal [data-weapon-mastery-description] summary,
#character-editor-modal [data-weapon-mastery-glossary] summary,
#character-editor-modal [data-feature-guidance] p,
#character-editor-modal [data-maneuver-description] p,
#character-editor-modal [data-tool-description] p,
#character-editor-modal [data-weapon-mastery-description] p,
#character-editor-modal [data-weapon-mastery-glossary] p {
  color: inherit !important;
}

html[data-portal-theme="dnd"] #character-editor-modal [data-feature-guidance],
html[data-portal-theme="dnd"] #character-editor-modal [data-maneuver-description],
html[data-portal-theme="dnd"] #character-editor-modal [data-tool-description],
html[data-portal-theme="dnd"] #character-editor-modal [data-weapon-mastery-description],
html[data-portal-theme="dnd"] #character-editor-modal [data-weapon-mastery-glossary] {
  border-color: rgba(111, 82, 39, 0.46) !important;
  background: linear-gradient(145deg, rgba(232, 214, 161, 0.98), rgba(211, 191, 137, 0.98)) !important;
  color: #3d321f !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal [data-feature-guidance],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-maneuver-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-tool-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-weapon-mastery-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-weapon-mastery-glossary],
html[data-portal-theme="cthulhu"] #character-editor-modal .bg-blue-50,
html[data-portal-theme="cthulhu"] #character-editor-modal .bg-purple-50 {
  border-color: rgba(84, 164, 173, 0.34) !important;
  background: linear-gradient(180deg, rgba(11, 34, 46, 0.98), rgba(7, 25, 34, 0.98)) !important;
  color: #dbe7ea !important;
}

html[data-portal-theme="starwars"] #character-editor-modal [data-feature-guidance],
html[data-portal-theme="starwars"] #character-editor-modal [data-maneuver-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-tool-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-weapon-mastery-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-weapon-mastery-glossary],
html[data-portal-theme="starwars"] #character-editor-modal .bg-blue-50,
html[data-portal-theme="starwars"] #character-editor-modal .bg-purple-50 {
  border-color: rgba(87, 185, 242, 0.42) !important;
  background: linear-gradient(180deg, rgba(15, 39, 59, 0.98), rgba(7, 24, 40, 0.98)) !important;
  color: #e8f5ff !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal select option {
  background: #081923;
  color: #dbe7ea;
}

html[data-portal-theme="starwars"] #character-editor-modal select option {
  background: #07182a;
  color: #e8f5ff;
}

html[data-portal-theme="default"] #character-editor-modal .bg-blue-50,
html[data-portal-theme="default"] #character-editor-modal .bg-purple-50,
html[data-portal-theme="default"] #character-editor-modal .bg-green-50 {
  color: #1f2937 !important;
}

/* Character Creator franchise accent ownership v2
   Franchise colours are deliberately scoped. Portal navigation keeps the global
   theme palette, while generated Automation cards and choice controls receive
   the requested Character Creator accents.
*/

/* Call of Cthulhu: blood-red Character Creator borders and choice surfaces. */
html[data-portal-theme="cthulhu"] #dnd-automation-content .rounded-xl.border,
html[data-portal-theme="cthulhu"] #dnd-automation-content .rounded-2xl.border,
html[data-portal-theme="cthulhu"] #dnd-automation-selections-panel .rounded-xl.border,
html[data-portal-theme="cthulhu"] #dnd-automation-selections-panel .rounded-2xl.border,
html[data-portal-theme="cthulhu"] #dnd-character-information-panel .rounded-xl.border,
html[data-portal-theme="cthulhu"] #dnd-character-information-panel .rounded-2xl.border,
html[data-portal-theme="cthulhu"] #character-editor-modal .rounded-xl.border,
html[data-portal-theme="cthulhu"] #character-editor-modal .rounded-2xl.border,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-gray-200,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-gray-300,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-blue-200,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-purple-200,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-red-200,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-red-300,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-rose-200,
html[data-portal-theme="cthulhu"] #character-editor-modal .border-rose-300,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-feature-guidance],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-maneuver-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-tool-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-weapon-mastery-description],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-weapon-mastery-glossary] {
  border-color: rgba(202, 34, 43, 0.78) !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .bg-red-50,
html[data-portal-theme="cthulhu"] #character-editor-modal .bg-rose-50 {
  background: linear-gradient(180deg, rgba(57, 12, 18, 0.96), rgba(27, 8, 13, 0.98)) !important;
  border-color: rgba(202, 34, 43, 0.82) !important;
  color: #f8e7e7 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .input-field,
html[data-portal-theme="cthulhu"] #character-editor-modal .calc-input,
html[data-portal-theme="cthulhu"] #character-editor-modal select,
html[data-portal-theme="cthulhu"] #character-editor-modal input {
  border-color: rgba(202, 34, 43, 0.68) !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal .input-field:focus,
html[data-portal-theme="cthulhu"] #character-editor-modal .calc-input:focus,
html[data-portal-theme="cthulhu"] #character-editor-modal select:focus,
html[data-portal-theme="cthulhu"] #character-editor-modal input:focus {
  border-color: #f06b71 !important;
  box-shadow: 0 0 0 3px rgba(202, 34, 43, 0.28) !important;
}

html[data-portal-theme="cthulhu"] #dnd-automation-content details > summary,
html[data-portal-theme="cthulhu"] #dnd-automation-content h4,
html[data-portal-theme="cthulhu"] #dnd-automation-selections-panel h4,
html[data-portal-theme="cthulhu"] #dnd-character-information-panel h4,
html[data-portal-theme="cthulhu"] #character-editor-modal .rounded-xl.border > strong,
html[data-portal-theme="cthulhu"] #character-editor-modal .rounded-2xl.border h4 {
  color: #f06b71 !important;
}

/* Star Wars: white Character Creator geometry, including unresolved choices. */
html[data-portal-theme="starwars"] #dnd-automation-content .rounded-xl.border,
html[data-portal-theme="starwars"] #dnd-automation-content .rounded-2xl.border,
html[data-portal-theme="starwars"] #dnd-automation-selections-panel .rounded-xl.border,
html[data-portal-theme="starwars"] #dnd-automation-selections-panel .rounded-2xl.border,
html[data-portal-theme="starwars"] #dnd-character-information-panel .rounded-xl.border,
html[data-portal-theme="starwars"] #dnd-character-information-panel .rounded-2xl.border,
html[data-portal-theme="starwars"] #character-editor-modal .rounded-xl.border,
html[data-portal-theme="starwars"] #character-editor-modal .rounded-2xl.border,
html[data-portal-theme="starwars"] #character-editor-modal .border-gray-200,
html[data-portal-theme="starwars"] #character-editor-modal .border-gray-300,
html[data-portal-theme="starwars"] #character-editor-modal .border-blue-200,
html[data-portal-theme="starwars"] #character-editor-modal .border-purple-200,
html[data-portal-theme="starwars"] #character-editor-modal .border-red-200,
html[data-portal-theme="starwars"] #character-editor-modal .border-red-300,
html[data-portal-theme="starwars"] #character-editor-modal .border-rose-200,
html[data-portal-theme="starwars"] #character-editor-modal .border-rose-300,
html[data-portal-theme="starwars"] #character-editor-modal [data-feature-guidance],
html[data-portal-theme="starwars"] #character-editor-modal [data-maneuver-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-tool-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-weapon-mastery-description],
html[data-portal-theme="starwars"] #character-editor-modal [data-weapon-mastery-glossary] {
  border-color: rgba(255, 255, 255, 0.90) !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .bg-red-50,
html[data-portal-theme="starwars"] #character-editor-modal .bg-rose-50 {
  background: linear-gradient(180deg, rgba(11, 30, 48, 0.98), rgba(5, 19, 33, 0.98)) !important;
  border-color: rgba(255, 255, 255, 0.92) !important;
  color: #ffffff !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .bg-red-50 strong,
html[data-portal-theme="starwars"] #character-editor-modal .bg-rose-50 strong {
  color: #ffffff !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .bg-red-50 .text-red-700,
html[data-portal-theme="starwars"] #character-editor-modal .bg-rose-50 .text-red-700 {
  color: #ff4d5d !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .input-field,
html[data-portal-theme="starwars"] #character-editor-modal .calc-input,
html[data-portal-theme="starwars"] #character-editor-modal select,
html[data-portal-theme="starwars"] #character-editor-modal input {
  border-color: rgba(255, 255, 255, 0.86) !important;
}

html[data-portal-theme="starwars"] #character-editor-modal .input-field:focus,
html[data-portal-theme="starwars"] #character-editor-modal .calc-input:focus,
html[data-portal-theme="starwars"] #character-editor-modal select:focus,
html[data-portal-theme="starwars"] #character-editor-modal input:focus {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.24) !important;
}

html[data-portal-theme="starwars"] #dnd-automation-content details > summary,
html[data-portal-theme="starwars"] #dnd-automation-content h4,
html[data-portal-theme="starwars"] #dnd-automation-selections-panel h4,
html[data-portal-theme="starwars"] #dnd-character-information-panel h4,
html[data-portal-theme="starwars"] #character-editor-modal .rounded-xl.border > strong,
html[data-portal-theme="starwars"] #character-editor-modal .rounded-2xl.border h4 {
  color: #ffffff !important;
}

/* Star Wars portal navigation: blue at rest, lightsaber red when selected. */
html[data-portal-theme="starwars"] .member-page-top-nav {
  border-color: rgba(87, 185, 242, 0.62) !important;
}

html[data-portal-theme="starwars"] .member-page-tab:not(.is-active),
html[data-portal-theme="starwars"] .member-scheduler-subtab:not(.is-active),
html[data-portal-theme="starwars"] .member-news-segment-tab:not(.is-active) {
  border-color: rgba(87, 185, 242, 0.86) !important;
  background: rgba(5, 19, 33, 0.92) !important;
  color: #75cbff !important;
  box-shadow: 0 0 10px rgba(87, 185, 242, 0.12);
}

html[data-portal-theme="starwars"] .member-page-tab:not(.is-active):hover,
html[data-portal-theme="starwars"] .member-scheduler-subtab:not(.is-active):hover,
html[data-portal-theme="starwars"] .member-news-segment-tab:not(.is-active):hover {
  border-color: #9edcff !important;
  background: rgba(18, 54, 78, 0.96) !important;
  color: #d9f2ff !important;
  box-shadow: 0 0 14px rgba(87, 185, 242, 0.28);
}

html[data-portal-theme="starwars"] .member-page-tab.is-active,
html[data-portal-theme="starwars"] .member-scheduler-subtab.is-active,
html[data-portal-theme="starwars"] .member-news-segment-tab.is-active {
  border-color: #ff4052 !important;
  background: linear-gradient(180deg, #d92336, #8f1020) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 220, 224, 0.22),
    0 0 16px rgba(255, 44, 65, 0.54) !important;
}

/* D&D Automation dark-theme text contrast v1
   The Automation renderer emits text-gray-950 and several other dark utility
   classes inside surfaces that the franchise themes convert to dark panels.
   These selectors own Automation readability without flattening warning/badge
   colours elsewhere in the Character Creator.
*/

html[data-portal-theme="starwars"] #dnd-automation-content,
html[data-portal-theme="starwars"] #dnd-automation-selections-panel,
html[data-portal-theme="starwars"] #dnd-character-information-panel {
  color: #f4fbff !important;
}

html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-950,
html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-900,
html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-800,
html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-700,
html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-600,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-950,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-900,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-800,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-700,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-950,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-900,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-800,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-950,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-900,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-800,
html[data-portal-theme="starwars"] #dnd-automation-content h4,
html[data-portal-theme="starwars"] #dnd-automation-content h5,
html[data-portal-theme="starwars"] #dnd-automation-content summary,
html[data-portal-theme="starwars"] #dnd-automation-content label,
html[data-portal-theme="starwars"] #dnd-automation-content strong {
  color: #f4fbff !important;
}

html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-500,
html[data-portal-theme="starwars"] #dnd-automation-content .text-gray-400,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-600,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-500,
html[data-portal-theme="starwars"] #dnd-automation-content .text-slate-400,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-700,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-600,
html[data-portal-theme="starwars"] #dnd-automation-content .text-neutral-500,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-700,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-600,
html[data-portal-theme="starwars"] #dnd-automation-content .text-zinc-500 {
  color: #c8ddea !important;
}

html[data-portal-theme="cthulhu"] #dnd-automation-content,
html[data-portal-theme="cthulhu"] #dnd-automation-selections-panel,
html[data-portal-theme="cthulhu"] #dnd-character-information-panel {
  color: #edf5f6 !important;
}

html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-950,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-900,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-800,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-700,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-600,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-950,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-900,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-800,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-700,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-950,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-900,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-800,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-950,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-900,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-800,
html[data-portal-theme="cthulhu"] #dnd-automation-content label,
html[data-portal-theme="cthulhu"] #dnd-automation-content strong {
  color: #edf5f6 !important;
}

html[data-portal-theme="cthulhu"] #dnd-automation-content h4,
html[data-portal-theme="cthulhu"] #dnd-automation-content h5,
html[data-portal-theme="cthulhu"] #dnd-automation-content summary {
  color: #f06b71 !important;
}

html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-500,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-gray-400,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-600,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-500,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-slate-400,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-700,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-600,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-neutral-500,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-700,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-600,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-zinc-500 {
  color: #b6cbd0 !important;
}

/* Preserve semantic warning and formula badge colours after the contrast pass. */
html[data-portal-theme="starwars"] #dnd-automation-content .text-red-700,
html[data-portal-theme="starwars"] #dnd-automation-content .text-red-800,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-red-700,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-red-800 {
  color: #ff6675 !important;
}

html[data-portal-theme="starwars"] #dnd-automation-content .text-purple-900,
html[data-portal-theme="cthulhu"] #dnd-automation-content .text-purple-900 {
  color: #2e1065 !important;
}

/* Custom Background text ownership v1
   These selectors are intentionally limited to the Custom Background surfaces.
*/
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface],
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] p,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] label,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] b,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] strong,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] input,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] select,
html[data-portal-theme="default"] #character-editor-modal [data-custom-background-surface] option,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface],
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] p,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] label,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] b,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] strong,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] input,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] select,
html[data-portal-theme="dnd"] #character-editor-modal [data-custom-background-surface] option {
  color: #000000 !important;
}

html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface],
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] p,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] label,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] b,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] strong,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] input,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] select,
html[data-portal-theme="cthulhu"] #character-editor-modal [data-custom-background-surface] option {
  color: #f06b71 !important;
}

html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface],
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] p,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] label,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] b,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] strong,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] input,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] select,
html[data-portal-theme="starwars"] #character-editor-modal [data-custom-background-surface] option {
  color: #ffffff !important;
}