/*
 * ConjuresUp UI Kit — Free Tools Look
 *
 * Applies the "Free Tools" visual language to all plugin pages without touching
 * theme-wide styles.
 *
 * Affected areas:
 *  - Free Tools page: .conjuresup-free-tools-page
 *  - Any page using the portal frame shortcode: .conjuresup-portal-frame
 *
 * IMPORTANT:
 * This file is meant for the Free Tools/Portal UI components only.
 * Do not use broad, full-page selectors for other pages (eg. Grimoire Library),
 * because it can unintentionally restyle the site header/menu, floating cart plugins,
 * and other theme elements.
 */

:root{
  --cu-gold-1:#c9a15f;
  --cu-gold-2:#ffdca8;
  --cu-ink:#12061f;

  --cu-cream:rgba(255,245,230,0.96);
  --cu-cream-2:rgba(255,245,230,0.80);
  --cu-cream-3:rgba(255,245,230,0.78);

  --cu-border:rgba(255,215,150,0.22);
  --cu-border-strong:rgba(255,215,150,0.38);

  --cu-shadow-1:0 18px 40px rgba(0,0,0,0.20);
  --cu-shadow-2:0 0 0 1px rgba(255,215,150,0.06) inset;
  --cu-shadow-hover:0 24px 60px rgba(0,0,0,0.32);
  --cu-glow-hover:0 0 35px rgba(255,215,150,0.14);

  --cu-card-bg:radial-gradient(120% 120% at 50% 0%,
    rgba(255,220,168,0.10) 0%,
    rgba(18,6,31,0.98) 55%,
    rgba(10,3,18,1) 100%);
}

/* ---------- Base text color for plugin areas ---------- */
.conjuresup-free-tools-page,
.conjuresup-portal-frame{
  color: var(--cu-cream);
}

/* ---------- Card system (matches Free Tools cards) ---------- */
.conjuresup-free-tools-page .conjuresup-card,
.conjuresup-free-tools-page .conjuresup-portal-card,
.conjuresup-free-tools-page .conjuresup-rune-card,
.conjuresup-portal-frame .conjuresup-card,
.conjuresup-portal-frame .conjuresup-portal-card,
.conjuresup-portal-frame .conjuresup-rune-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;

  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease !important;
}

.conjuresup-free-tools-page .conjuresup-card:hover,
.conjuresup-free-tools-page .conjuresup-portal-card:hover,
.conjuresup-free-tools-page .conjuresup-rune-card:hover,
.conjuresup-portal-frame .conjuresup-card:hover,
.conjuresup-portal-frame .conjuresup-portal-card:hover,
.conjuresup-portal-frame .conjuresup-rune-card:hover{
  transform: translateY(-4px) !important;
  border-color: var(--cu-border-strong) !important;
  box-shadow: var(--cu-shadow-hover), var(--cu-glow-hover) !important;
}

/* Headings inside cards */
.conjuresup-free-tools-page .conjuresup-card h1,
.conjuresup-free-tools-page .conjuresup-card h2,
.conjuresup-free-tools-page .conjuresup-card h3,
.conjuresup-free-tools-page .conjuresup-portal-card h1,
.conjuresup-free-tools-page .conjuresup-portal-card h2,
.conjuresup-free-tools-page .conjuresup-portal-card h3,
.conjuresup-portal-frame .conjuresup-card h1,
.conjuresup-portal-frame .conjuresup-card h2,
.conjuresup-portal-frame .conjuresup-card h3,
.conjuresup-portal-frame .conjuresup-portal-card h1,
.conjuresup-portal-frame .conjuresup-portal-card h2,
.conjuresup-portal-frame .conjuresup-portal-card h3{
  color: var(--cu-cream) !important;
  letter-spacing: 0.6px !important;
}

/* Body text inside cards */
.conjuresup-free-tools-page .conjuresup-card p,
.conjuresup-free-tools-page .conjuresup-portal-card p,
.conjuresup-free-tools-page .conjuresup-rune-card p,
.conjuresup-portal-frame .conjuresup-card p,
.conjuresup-portal-frame .conjuresup-portal-card p,
.conjuresup-portal-frame .conjuresup-rune-card p{
  color: var(--cu-cream-3) !important;
}

/* ---------- Button system (matches Free Tools buttons) ---------- */
.conjuresup-free-tools-page a.conjuresup-btn,
.conjuresup-free-tools-page button.conjuresup-btn,
.conjuresup-free-tools-page button.conjuresup-btnprimary,
.conjuresup-free-tools-page a.button.conjuresup-btn,
.conjuresup-free-tools-page .conjuresup-btn-primary,
.conjuresup-portal-frame a.conjuresup-btn,
.conjuresup-portal-frame button.conjuresup-btn,
.conjuresup-portal-frame button.conjuresup-btnprimary,
.conjuresup-portal-frame a.button.conjuresup-btn,
.conjuresup-portal-frame .conjuresup-btn-primary{
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;

  padding: 11px 18px !important;
  border-radius: 999px !important;

  background: linear-gradient(135deg, var(--cu-gold-1), var(--cu-gold-2)) !important;
  color: var(--cu-ink) !important;

  border: 0 !important;
  text-decoration: none !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px !important;
  line-height: 1.1 !important;

  box-shadow:
    0 10px 20px rgba(0,0,0,0.18),
    0 0 0 1px rgba(255,255,255,0.12) inset !important;

  transition: transform 160ms ease, filter 160ms ease !important;
}

.conjuresup-free-tools-page a.conjuresup-btn:hover,
.conjuresup-free-tools-page button.conjuresup-btn:hover,
.conjuresup-free-tools-page button.conjuresup-btnprimary:hover,
.conjuresup-free-tools-page a.button.conjuresup-btn:hover,
.conjuresup-free-tools-page .conjuresup-btn-primary:hover,
.conjuresup-portal-frame a.conjuresup-btn:hover,
.conjuresup-portal-frame button.conjuresup-btn:hover,
.conjuresup-portal-frame button.conjuresup-btnprimary:hover,
.conjuresup-portal-frame a.button.conjuresup-btn:hover,
.conjuresup-portal-frame .conjuresup-btn-primary:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.08) saturate(1.05) !important;
}

/* Ghost / secondary buttons */
.conjuresup-free-tools-page .conjuresup-btn--ghost,
.conjuresup-free-tools-page .conjuresup-btn-ghost,
.conjuresup-free-tools-page a.cta-ghost,
.conjuresup-portal-frame .conjuresup-btn--ghost,
.conjuresup-portal-frame .conjuresup-btn-ghost,
.conjuresup-portal-frame a.cta-ghost{
  background: transparent !important;
  border: 1px solid rgba(255,215,150,0.55) !important;
  color: rgba(255,245,230,0.92) !important;
  box-shadow: none !important;
}

/* Icon buttons stay readable */
.conjuresup-free-tools-page .conjuresup-btn-icon,
.conjuresup-portal-frame .conjuresup-btn-icon{
  border-radius: 999px !important;
  border: 1px solid rgba(255,215,150,0.35) !important;
  background: rgba(10,3,18,0.65) !important;
  color: var(--cu-cream) !important;
}

/* ---------- Form fields (Journal, etc.) ---------- */
.conjuresup-free-tools-page input[type="text"],
.conjuresup-free-tools-page input[type="email"],
.conjuresup-free-tools-page input[type="number"],
.conjuresup-free-tools-page textarea,
.conjuresup-portal-frame input[type="text"],
.conjuresup-portal-frame input[type="email"],
.conjuresup-portal-frame input[type="number"],
.conjuresup-portal-frame textarea{
  background: rgba(10,3,18,0.55) !important;
  color: var(--cu-cream) !important;
  border: 1px solid rgba(255,215,150,0.28) !important;
  border-radius: 12px !important;
  outline: none !important;
}

.conjuresup-free-tools-page input::placeholder,
.conjuresup-free-tools-page textarea::placeholder,
.conjuresup-portal-frame input::placeholder,
.conjuresup-portal-frame textarea::placeholder{
  color: rgba(255,245,230,0.55) !important;
}

/* Links inside plugin areas */
.conjuresup-free-tools-page a,
.conjuresup-portal-frame a{
  color: rgba(255,220,168,0.92);
}

.conjuresup-free-tools-page a:hover,
.conjuresup-portal-frame a:hover{
  color: rgba(255,220,168,1);
}

/* Reduce harsh dividers */
.conjuresup-free-tools-page hr,
.conjuresup-portal-frame hr{
  border-color: rgba(255,215,150,0.18) !important;
}

/* ============================================================
   Free Tools UI — apply to Grimoire-specific buttons & panels
   (these classes exist in grimoire.php / grimoire-shortcodes.php)
   ============================================================ */

/* ---- Buttons (gold gradient primary) ---- */
.conjuresup-free-tools-page a.grimoire-btn,
.conjuresup-free-tools-page button.grimoire-btn,
.conjuresup-free-tools-page a.gr-btn.gr-btn-primary,
.conjuresup-free-tools-page a.gr-btn.gr-btn-gold,
.conjuresup-free-tools-page a.grimoire-btn-primary,
.conjuresup-free-tools-page button.grimoire-btn-primary,
.conjuresup-free-tools-page a.grimoire-btn-gold,
.conjuresup-free-tools-page button.grimoire-btn-gold,
.conjuresup-portal-frame a.grimoire-btn,
.conjuresup-portal-frame button.grimoire-btn,
.conjuresup-portal-frame a.gr-btn.gr-btn-primary,
.conjuresup-portal-frame a.gr-btn.gr-btn-gold,
.conjuresup-portal-frame a.grimoire-btn-primary,
.conjuresup-portal-frame button.grimoire-btn-primary,
.conjuresup-portal-frame a.grimoire-btn-gold,
.conjuresup-portal-frame button.grimoire-btn-gold{
  display:inline-flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:8px !important;
  padding:11px 18px !important;
  border-radius:999px !important;
  background: linear-gradient(135deg, var(--cu-gold-1), var(--cu-gold-2)) !important;
  color: var(--cu-ink) !important;
  text-decoration:none !important;
  font-weight:800 !important;
  letter-spacing:0.2px !important;
  line-height:1.1 !important;
  border: none !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.18), 0 0 0 1px rgba(255,255,255,0.12) inset !important;
  transition: transform 160ms ease, filter 160ms ease !important;
  cursor:pointer !important;
}

.conjuresup-free-tools-page a.grimoire-btn:hover,
.conjuresup-free-tools-page button.grimoire-btn:hover,
.conjuresup-free-tools-page a.gr-btn.gr-btn-primary:hover,
.conjuresup-free-tools-page a.gr-btn.gr-btn-gold:hover,
.conjuresup-free-tools-page a.grimoire-btn-primary:hover,
.conjuresup-free-tools-page button.grimoire-btn-primary:hover,
.conjuresup-free-tools-page a.grimoire-btn-gold:hover,
.conjuresup-free-tools-page button.grimoire-btn-gold:hover,
.conjuresup-portal-frame a.grimoire-btn:hover,
.conjuresup-portal-frame button.grimoire-btn:hover,
.conjuresup-portal-frame a.gr-btn.gr-btn-primary:hover,
.conjuresup-portal-frame a.gr-btn.gr-btn-gold:hover,
.conjuresup-portal-frame a.grimoire-btn-primary:hover,
.conjuresup-portal-frame button.grimoire-btn-primary:hover,
.conjuresup-portal-frame a.grimoire-btn-gold:hover,
.conjuresup-portal-frame button.grimoire-btn-gold:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.08) saturate(1.05) !important;
}

/* ---- Buttons (outline/secondary) — use for plain .gr-btn and ghost variants ---- */
.conjuresup-free-tools-page a.gr-btn:not(.gr-btn-primary):not(.gr-btn-gold),
.conjuresup-free-tools-page a.grimoire-btn-ghost,
.conjuresup-free-tools-page button.grimoire-btn-ghost,
.conjuresup-portal-frame a.gr-btn:not(.gr-btn-primary):not(.gr-btn-gold),
.conjuresup-portal-frame a.grimoire-btn-ghost,
.conjuresup-portal-frame button.grimoire-btn-ghost{
  background: transparent !important;
  border: 1px solid rgba(255,215,150,0.55) !important;
  color: rgba(255,245,230,0.92) !important;
  box-shadow:none !important;
}

/* Keep outlines readable on hover */
.conjuresup-free-tools-page a.gr-btn:not(.gr-btn-primary):not(.gr-btn-gold):hover,
.conjuresup-free-tools-page a.grimoire-btn-ghost:hover,
.conjuresup-free-tools-page button.grimoire-btn-ghost:hover,
.conjuresup-portal-frame a.gr-btn:not(.gr-btn-primary):not(.gr-btn-gold):hover,
.conjuresup-portal-frame a.grimoire-btn-ghost:hover,
.conjuresup-portal-frame button.grimoire-btn-ghost:hover{
  border-color: rgba(255,215,150,0.75) !important;
  filter: brightness(1.05) !important;
}

/* ---- Nav Panels / Cards (match Free Tools cards) ---- */
.conjuresup-free-tools-page a.gr-card,
.conjuresup-free-tools-page .grimoire-card,
.conjuresup-portal-frame a.gr-card,
.conjuresup-portal-frame .grimoire-card{
  border-radius: 18px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(255, 220, 168, 0.10) 0%, rgba(18, 6, 31, 0.98) 55%, rgba(10, 3, 18, 1) 100%) !important;
  border: 1px solid rgba(255, 215, 150, 0.22) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.20), 0 0 0 1px rgba(255, 215, 150, 0.06) inset !important;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease !important;
  color: rgba(255,245,230,0.92) !important;
}

.conjuresup-free-tools-page a.gr-card:hover,
.conjuresup-free-tools-page .grimoire-card:hover,
.conjuresup-portal-frame a.gr-card:hover,
.conjuresup-portal-frame .grimoire-card:hover{
  transform: translateY(-4px) !important;
  border-color: rgba(255, 215, 150, 0.38) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.32), 0 0 35px rgba(255, 215, 150, 0.14) !important;
}

/* Card text inside nav panels */
.conjuresup-free-tools-page .gr-card-title,
.conjuresup-free-tools-page .grimoire-title,
.conjuresup-portal-frame .gr-card-title,
.conjuresup-portal-frame .grimoire-title{
  color: rgba(255,245,230,0.96) !important;
}

.conjuresup-free-tools-page .gr-card-note,
.conjuresup-free-tools-page .grimoire-note,
.conjuresup-portal-frame .gr-card-note,
.conjuresup-portal-frame .grimoire-note{
  color: rgba(255,245,230,0.78) !important;
}

/* Make Grimoire grids align like Free Tools grid */
.conjuresup-free-tools-page .grimoire-grid,
.conjuresup-free-tools-page .gr-card-grid,
.conjuresup-portal-frame .grimoire-grid,
.conjuresup-portal-frame .gr-card-grid{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 26px !important;
  justify-items: stretch !important;
  align-items: stretch !important;
}

@media (max-width: 980px){
  .conjuresup-free-tools-page .grimoire-grid,
  .conjuresup-free-tools-page .gr-card-grid,
  .conjuresup-portal-frame .grimoire-grid,
  .conjuresup-portal-frame .gr-card-grid{
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
}

/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Panels */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Vault columns act like cards */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Headings + body text inside panels/cols */
.conjuresup-free-tools-page .gr-panel .gr-h,
.conjuresup-portal-frame .gr-panel .gr-h{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .gr-panel .gr-sub,
.conjuresup-portal-frame .gr-panel .gr-sub{
  color: var(--cu-cream-2) !important;
}

.conjuresup-free-tools-page .gr-panel h1,
.conjuresup-free-tools-page .gr-panel h2,
.conjuresup-free-tools-page .gr-panel h3,
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-free-tools-page .gr-panel div,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li,
.conjuresup-portal-frame .gr-panel div{
  color: var(--cu-cream-3) !important;
}

/* Make emphasis and bold readable */
.conjuresup-free-tools-page .gr-panel b,
.conjuresup-free-tools-page .gr-panel strong,
.conjuresup-portal-frame .gr-panel b,
.conjuresup-portal-frame .gr-panel strong{
  color: var(--cu-cream) !important;
}

/* Links inside dark panels */
.conjuresup-free-tools-page .gr-panel a,
.conjuresup-portal-frame .gr-panel a{
  color: rgba(255,245,230,0.92) !important;
  text-decoration: underline;
  text-decoration-color: rgba(255,215,150,0.55);
  text-underline-offset: 3px;
}

.conjuresup-free-tools-page .gr-panel a:hover,
.conjuresup-portal-frame .gr-panel a:hover{
  color: rgba(255,245,230,0.98) !important;
  text-decoration-color: rgba(255,215,150,0.80);
}

/* Readability for the tarot mount placeholder */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: rgba(255,245,230,0.88) !important;
  background: rgba(0,0,0,0.18) !important;
  border-color: rgba(255,215,150,0.22) !important;
}

/* =====================================================================
   Journal UI (.cs-journal) — override inline styles to match Free Tools
   ===================================================================== */

.conjuresup-free-tools-page .cs-journal,
.conjuresup-portal-frame .cs-journal{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-card,
.conjuresup-portal-frame .cs-journal-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .cs-journal-title,
.conjuresup-portal-frame .cs-journal-title{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-sub,
.conjuresup-portal-frame .cs-journal-sub,
.conjuresup-free-tools-page .cs-journal-history-title,
.conjuresup-portal-frame .cs-journal-history-title{
  color: var(--cu-cream-2) !important;
}

/* Inputs */
.conjuresup-free-tools-page .cs-journal input,
.conjuresup-free-tools-page .cs-journal textarea,
.conjuresup-portal-frame .cs-journal input,
.conjuresup-portal-frame .cs-journal textarea{
  background: rgba(0,0,0,0.28) !important;
  border: 1px solid rgba(255,215,150,0.22) !important;
  color: rgba(255,245,230,0.92) !important;
  box-shadow: 0 0 0 1px rgba(255,215,150,0.06) inset !important;
}

.conjuresup-free-tools-page .cs-journal input::placeholder,
.conjuresup-free-tools-page .cs-journal textarea::placeholder,
.conjuresup-portal-frame .cs-journal input::placeholder,
.conjuresup-portal-frame .cs-journal textarea::placeholder{
  color: rgba(255,245,230,0.55) !important;
}

/* Journal buttons: treat any buttons inside as primary unless marked */
.conjuresup-free-tools-page .cs-journal button,
.conjuresup-free-tools-page .cs-journal a,
.conjuresup-portal-frame .cs-journal button,
.conjuresup-portal-frame .cs-journal a{
  border-radius: 999px;
}

/* Saved entry cards */
.conjuresup-free-tools-page .cs-journal-item,
.conjuresup-portal-frame .cs-journal-item{
  background: rgba(0,0,0,0.18) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
}

.conjuresup-free-tools-page .cs-journal-item-title,
.conjuresup-portal-frame .cs-journal-item-title,
.conjuresup-free-tools-page .cs-journal-item-body,
.conjuresup-portal-frame .cs-journal-item-body{
  color: rgba(255,245,230,0.92) !important;
}

.conjuresup-free-tools-page .cs-journal-item-meta,
.conjuresup-portal-frame .cs-journal-item-meta{
  color: rgba(255,245,230,0.70) !important;
}

/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Headline + subhead */
.conjuresup-free-tools-page .gr-h,
.conjuresup-portal-frame .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.6px !important;
}
.conjuresup-free-tools-page .gr-sub,
.conjuresup-portal-frame .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* Text inside panels */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-free-tools-page .gr-panel span,
.conjuresup-free-tools-page .gr-panel div,
.conjuresup-portal-frame .gr-panel,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li,
.conjuresup-portal-frame .gr-panel span,
.conjuresup-portal-frame .gr-panel div{
  color: var(--cu-cream-3) !important;
}

/* Headings inside panels */
.conjuresup-free-tools-page .gr-panel h1,
.conjuresup-free-tools-page .gr-panel h2,
.conjuresup-free-tools-page .gr-panel h3,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3{
  color: var(--cu-cream) !important;
}

/* Links in panels (Vault list items were dark) */
.conjuresup-free-tools-page .gr-panel a,
.conjuresup-portal-frame .gr-panel a{
  color: rgba(255, 220, 168, 0.92) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

/* Vault columns should look like cards too */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Locked callout in Tarot/Vault */
.conjuresup-free-tools-page .gr-locked,
.conjuresup-portal-frame .gr-locked{
  background: linear-gradient(180deg, rgba(18, 6, 31, 0.55), rgba(10, 3, 18, 0.75)) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  color: var(--cu-cream) !important;
}

/* =====================================================================
   Journal UI (.cs-journal) — override inline journal styles to match
   ===================================================================== */

.conjuresup-free-tools-page .cs-journal,
.conjuresup-portal-frame .cs-journal{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-card,
.conjuresup-portal-frame .cs-journal-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .cs-journal-title,
.conjuresup-portal-frame .cs-journal-title{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-sub,
.conjuresup-portal-frame .cs-journal-sub,
.conjuresup-free-tools-page .cs-journal-history-title,
.conjuresup-portal-frame .cs-journal-history-title{
  color: var(--cu-cream-2) !important;
}

/* Inputs */
.conjuresup-free-tools-page .cs-journal input,
.conjuresup-free-tools-page .cs-journal textarea,
.conjuresup-portal-frame .cs-journal input,
.conjuresup-portal-frame .cs-journal textarea{
  background: rgba(0,0,0,0.32) !important;
  border: 1px solid rgba(255,215,150,0.22) !important;
  color: var(--cu-cream) !important;
  border-radius: 14px !important;
}

.conjuresup-free-tools-page .cs-journal input::placeholder,
.conjuresup-free-tools-page .cs-journal textarea::placeholder,
.conjuresup-portal-frame .cs-journal input::placeholder,
.conjuresup-portal-frame .cs-journal textarea::placeholder{
  color: rgba(255,245,230,0.60) !important;
}

/* Journal list items */
.conjuresup-free-tools-page .cs-journal-item,
.conjuresup-portal-frame .cs-journal-item{
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
}

.conjuresup-free-tools-page .cs-journal-item-title,
.conjuresup-portal-frame .cs-journal-item-title,
.conjuresup-free-tools-page .cs-journal-item-body,
.conjuresup-portal-frame .cs-journal-item-body{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-item-meta,
.conjuresup-portal-frame .cs-journal-item-meta{
  color: rgba(255,245,230,0.65) !important;
}

/* Journal buttons — re-skin any <button> inside journal */
.conjuresup-free-tools-page .cs-journal button,
.conjuresup-free-tools-page .cs-journal a,
.conjuresup-portal-frame .cs-journal button,
.conjuresup-portal-frame .cs-journal a{
  border-radius: 999px !important;
}

/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Headings + sub text */
.conjuresup-free-tools-page .gr-h,
.conjuresup-portal-frame .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.08em !important;
}

.conjuresup-free-tools-page .gr-sub,
.conjuresup-portal-frame .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* Generic text inside panels */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel,
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-portal-frame .gr-panel li,
.conjuresup-free-tools-page .gr-panel div,
.conjuresup-portal-frame .gr-panel div{
  color: var(--cu-cream-2) !important;
}

/* Links inside panels */
.conjuresup-free-tools-page .gr-panel a:not(.gr-btn),
.conjuresup-portal-frame .gr-panel a:not(.gr-btn){
  color: var(--cu-cream) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(255,215,150,0.45) !important;
}

/* Vault columns become cards */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .gr-vault-col h3,
.conjuresup-portal-frame .gr-vault-col h3{
  color: var(--cu-cream) !important;
  letter-spacing: 0.06em !important;
}

.conjuresup-free-tools-page .gr-vault-col p,
.conjuresup-portal-frame .gr-vault-col p,
.conjuresup-free-tools-page .gr-vault-col li,
.conjuresup-portal-frame .gr-vault-col li{
  color: var(--cu-cream-2) !important;
}

/* Tarot mount box readability */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  background: rgba(0,0,0,0.18) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  color: var(--cu-cream) !important;
}


/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Panel headings + subtext */
.conjuresup-free-tools-page .gr-h,
.conjuresup-portal-frame .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.6px !important;
}

.conjuresup-free-tools-page .gr-sub,
.conjuresup-portal-frame .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* Generic text inside gr panels */
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-free-tools-page .gr-panel div,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li,
.conjuresup-portal-frame .gr-panel div{
  color: var(--cu-cream-2);
}

/* Links inside panels */
.conjuresup-free-tools-page .gr-panel a:not(.gr-btn),
.conjuresup-portal-frame .gr-panel a:not(.gr-btn){
  color: var(--cu-cream) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.conjuresup-free-tools-page .gr-panel a:not(.gr-btn):hover,
.conjuresup-portal-frame .gr-panel a:not(.gr-btn):hover{
  color: rgba(255,255,255,0.98) !important;
}

/* Vault columns need explicit text color */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: rgba(0,0,0,0.14) !important;
  border: 1px solid rgba(255,215,150,0.14) !important;
  border-radius: 18px !important;
}

.conjuresup-free-tools-page .gr-vault-col h3,
.conjuresup-portal-frame .gr-vault-col h3{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .gr-vault-col p,
.conjuresup-free-tools-page .gr-vault-col li,
.conjuresup-portal-frame .gr-vault-col p,
.conjuresup-portal-frame .gr-vault-col li{
  color: var(--cu-cream-2) !important;
}

/* Tarot mount area text */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: var(--cu-cream) !important;
}

/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Headline + subtext */
.conjuresup-free-tools-page .gr-h,
.conjuresup-portal-frame .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.06em !important;
}

.conjuresup-free-tools-page .gr-sub,
.conjuresup-portal-frame .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* General typography within panels */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel,
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-portal-frame .gr-panel li{
  color: var(--cu-cream-2) !important;
}

.conjuresup-free-tools-page .gr-panel b,
.conjuresup-portal-frame .gr-panel b,
.conjuresup-free-tools-page .gr-panel strong,
.conjuresup-portal-frame .gr-panel strong{
  color: var(--cu-cream) !important;
}

/* Links inside panels (Vault links were too dark) */
.conjuresup-free-tools-page .gr-panel a:not(.gr-btn),
.conjuresup-portal-frame .gr-panel a:not(.gr-btn){
  color: rgba(255,220,168,0.92) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.conjuresup-free-tools-page .gr-panel a:not(.gr-btn):hover,
.conjuresup-portal-frame .gr-panel a:not(.gr-btn):hover{
  color: var(--cu-gold-2) !important;
}

/* Vault columns should be cards too */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.20) !important;
}

.conjuresup-free-tools-page .gr-vault-col h3,
.conjuresup-portal-frame .gr-vault-col h3{
  color: var(--cu-cream) !important;
  letter-spacing: 0.04em !important;
}

.conjuresup-free-tools-page .gr-vault-col p,
.conjuresup-portal-frame .gr-vault-col p,
.conjuresup-free-tools-page .gr-vault-col li,
.conjuresup-portal-frame .gr-vault-col li{
  color: var(--cu-cream-2) !important;
}

/* Tarot mount + placeholders: keep readable */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: rgba(255,245,230,0.86) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  background: rgba(255,255,255,0.06) !important;
}


/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Headings + body text inside panels */
.conjuresup-free-tools-page .gr-panel .gr-h,
.conjuresup-portal-frame .gr-panel .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.6px !important;
}

.conjuresup-free-tools-page .gr-panel .gr-sub,
.conjuresup-portal-frame .gr-panel .gr-sub,
.conjuresup-free-tools-page .gr-panel p,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-portal-frame .gr-panel li{
  color: var(--cu-cream-2) !important;
}

.conjuresup-free-tools-page .gr-panel h1,
.conjuresup-free-tools-page .gr-panel h2,
.conjuresup-free-tools-page .gr-panel h3,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3{
  color: var(--cu-cream) !important;
}

/* Links in Vault (and elsewhere) */
.conjuresup-free-tools-page .gr-panel a,
.conjuresup-portal-frame .gr-panel a{
  color: rgba(255,220,168,0.96) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.conjuresup-free-tools-page .gr-panel a:hover,
.conjuresup-portal-frame .gr-panel a:hover{
  filter: brightness(1.06) !important;
}

/* Vault columns should look like Free Tools cards */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .gr-vault-col h3,
.conjuresup-portal-frame .gr-vault-col h3{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .gr-vault-col p,
.conjuresup-portal-frame .gr-vault-col p,
.conjuresup-free-tools-page .gr-vault-col li,
.conjuresup-portal-frame .gr-vault-col li{
  color: var(--cu-cream-2) !important;
}

/* Tarot mount box text */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: var(--cu-cream-2) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  background: rgba(0,0,0,0.20) !important;
}

/* =====================================================================
   Journal UI (.cs-journal) — override inline shortcode styles
   ===================================================================== */

.conjuresup-free-tools-page .cs-journal-card,
.conjuresup-portal-frame .cs-journal-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .cs-journal-title,
.conjuresup-portal-frame .cs-journal-title{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-sub,
.conjuresup-portal-frame .cs-journal-sub{
  color: var(--cu-cream-2) !important;
}

/* Inputs */
.conjuresup-free-tools-page .cs-journal input,
.conjuresup-free-tools-page .cs-journal textarea,
.conjuresup-portal-frame .cs-journal input,
.conjuresup-portal-frame .cs-journal textarea{
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal input::placeholder,
.conjuresup-free-tools-page .cs-journal textarea::placeholder,
.conjuresup-portal-frame .cs-journal input::placeholder,
.conjuresup-portal-frame .cs-journal textarea::placeholder{
  color: rgba(255,245,230,0.60) !important;
}

/* Journal list items */
.conjuresup-free-tools-page .cs-journal-item,
.conjuresup-portal-frame .cs-journal-item{
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
}

.conjuresup-free-tools-page .cs-journal-item-title,
.conjuresup-portal-frame .cs-journal-item-title,
.conjuresup-free-tools-page .cs-journal-item-body,
.conjuresup-portal-frame .cs-journal-item-body{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-item-meta,
.conjuresup-portal-frame .cs-journal-item-meta{
  color: rgba(255,245,230,0.65) !important;
}

/* Journal buttons — re-skin any <button> inside journal */
.conjuresup-free-tools-page .cs-journal button,
.conjuresup-portal-frame .cs-journal button{
  background: linear-gradient(135deg, var(--cu-gold-1), var(--cu-gold-2)) !important;
  color: var(--cu-ink) !important;
  border: 0 !important;
  font-weight: 800 !important;
}


/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Vault columns */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  color: var(--cu-cream) !important;
}

/* Headings and subheads */
.conjuresup-free-tools-page .gr-panel .gr-h,
.conjuresup-portal-frame .gr-panel .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.conjuresup-free-tools-page .gr-panel .gr-sub,
.conjuresup-portal-frame .gr-panel .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* Readable text for headings/paragraphs/lists inside gr panels */
.conjuresup-free-tools-page .gr-panel h1,
.conjuresup-free-tools-page .gr-panel h2,
.conjuresup-free-tools-page .gr-panel h3,
.conjuresup-free-tools-page .gr-panel h4,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3,
.conjuresup-portal-frame .gr-panel h4{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li{
  color: var(--cu-cream-3) !important;
}

/* Vault link readability */
.conjuresup-free-tools-page .gr-panel a:not(.gr-btn),
.conjuresup-portal-frame .gr-panel a:not(.gr-btn){
  color: rgba(255, 220, 168, 0.92) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

/* Locked blocks remain readable */
.conjuresup-free-tools-page .gr-locked,
.conjuresup-portal-frame .gr-locked{
  color: var(--cu-cream) !important;
  background: rgba(0,0,0,0.20) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
}

/* Tarot mount panel text */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: var(--cu-cream-2) !important;
}

/* =====================================================================
   Journal override (journal shortcode ships with inline CSS)
   ===================================================================== */

.conjuresup-free-tools-page .cs-journal-card,
.conjuresup-portal-frame .cs-journal-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .cs-journal-title,
.conjuresup-portal-frame .cs-journal-title{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-sub,
.conjuresup-portal-frame .cs-journal-sub,
.conjuresup-free-tools-page .cs-journal label,
.conjuresup-portal-frame .cs-journal label{
  color: var(--cu-cream-2) !important;
  font-weight: 700 !important;
}

.conjuresup-free-tools-page .cs-journal input,
.conjuresup-free-tools-page .cs-journal textarea,
.conjuresup-portal-frame .cs-journal input,
.conjuresup-portal-frame .cs-journal textarea{
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal input::placeholder,
.conjuresup-free-tools-page .cs-journal textarea::placeholder,
.conjuresup-portal-frame .cs-journal input::placeholder,
.conjuresup-portal-frame .cs-journal textarea::placeholder{
  color: rgba(255,245,230,0.60) !important;
}

/* =====================================================================
   Grimoire legacy layout (.gr-*) — ensure readable text on dark cards
   ===================================================================== */

/* Main panel container */
.conjuresup-free-tools-page .gr-panel,
.conjuresup-portal-frame .gr-panel{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

/* Vault columns */
.conjuresup-free-tools-page .gr-vault-col,
.conjuresup-portal-frame .gr-vault-col{
  color: var(--cu-cream) !important;
}

/* Headings and subheads */
.conjuresup-free-tools-page .gr-panel .gr-h,
.conjuresup-portal-frame .gr-panel .gr-h{
  color: var(--cu-cream) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.conjuresup-free-tools-page .gr-panel .gr-sub,
.conjuresup-portal-frame .gr-panel .gr-sub{
  color: var(--cu-cream-2) !important;
}

/* Readable text for headings/paragraphs/lists inside gr panels */
.conjuresup-free-tools-page .gr-panel h1,
.conjuresup-free-tools-page .gr-panel h2,
.conjuresup-free-tools-page .gr-panel h3,
.conjuresup-free-tools-page .gr-panel h4,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3,
.conjuresup-portal-frame .gr-panel h4{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .gr-panel p,
.conjuresup-free-tools-page .gr-panel li,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li{
  color: var(--cu-cream-3) !important;
}

/* Vault link readability */
.conjuresup-free-tools-page .gr-panel a:not(.gr-btn),
.conjuresup-portal-frame .gr-panel a:not(.gr-btn){
  color: rgba(255, 220, 168, 0.92) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

/* Locked blocks remain readable */
.conjuresup-free-tools-page .gr-locked,
.conjuresup-portal-frame .gr-locked{
  color: var(--cu-cream) !important;
  background: rgba(0,0,0,0.20) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
}

/* Tarot mount panel text */
.conjuresup-free-tools-page #grimoire-tarot-mount,
.conjuresup-portal-frame #grimoire-tarot-mount{
  color: var(--cu-cream-2) !important;
}

/* =====================================================================
   Journal override (journal shortcode ships with inline CSS)
   ===================================================================== */

.conjuresup-free-tools-page .cs-journal-card,
.conjuresup-portal-frame .cs-journal-card{
  background: var(--cu-card-bg) !important;
  border: 1px solid var(--cu-border) !important;
  box-shadow: var(--cu-shadow-1), var(--cu-shadow-2) !important;
}

.conjuresup-free-tools-page .cs-journal-title,
.conjuresup-portal-frame .cs-journal-title{
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal-sub,
.conjuresup-portal-frame .cs-journal-sub,
.conjuresup-free-tools-page .cs-journal label,
.conjuresup-portal-frame .cs-journal label{
  color: var(--cu-cream-2) !important;
  font-weight: 700 !important;
}

.conjuresup-free-tools-page .cs-journal input,
.conjuresup-free-tools-page .cs-journal textarea,
.conjuresup-portal-frame .cs-journal input,
.conjuresup-portal-frame .cs-journal textarea{
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(255,215,150,0.18) !important;
  color: var(--cu-cream) !important;
}

.conjuresup-free-tools-page .cs-journal input::placeholder,
.conjuresup-free-tools-page .cs-journal textarea::placeholder,
.conjuresup-portal-frame .cs-journal input::placeholder,
.conjuresup-portal-frame .cs-journal textarea::placeholder{
  color: rgba(255,245,230,0.60) !important;
}


/* === Hotfix: brighten panel text even if body class isn't present === */
.conjuresup-portal-frame .gr-panel,
.conjuresup-portal-frame .gr-panel p,
.conjuresup-portal-frame .gr-panel li,
.conjuresup-portal-frame .gr-panel span,
.conjuresup-portal-frame .gr-panel div,
.conjuresup-portal-frame .gr-panel small,
.conjuresup-portal-frame .gr-panel em,
.conjuresup-portal-frame .gr-panel i,
.conjuresup-portal-frame .gr-panel b,
.conjuresup-portal-frame .gr-panel strong,
.conjuresup-portal-frame .gr-panel h1,
.conjuresup-portal-frame .gr-panel h2,
.conjuresup-portal-frame .gr-panel h3,
.conjuresup-portal-frame .gr-panel h4{
  color: var(--cu-cream-2) !important;
}

.conjuresup-portal-frame .gr-panel a{
  color: var(--cu-gold-2) !important;
  text-decoration-color: rgba(255,215,150,0.8) !important;
}

.conjuresup-portal-frame .gr-panel a:hover{
  color: rgba(255,245,230,0.96) !important;
  text-decoration-color: rgba(255,215,150,1) !important;
}
