/* ============================================================
   Phytoventures Portal — Institute OVERRIDE
   Re-skins the existing portal-light classes to match the
   Institute direction (cream + forest + ochre, serif display).
   Load AFTER portal-light.css.
   ============================================================ */

:root {
  --p-cream: #f4f1e8;
  --p-cream-2: #eee9dc;
  --p-surface: #faf7ee;
  --p-ink: #0e1f17;
  --p-green: #1b3c2b;
  --p-green-mid: #2d5a3e;
  --p-accent: #e8c547;
  --p-dim: #6b7a70;
  --p-border: #d6cfbe;
  --p-border-2: #e5decb;
  --p-red: #b3412b;
  --p-muted: #4a5a50;
  --p-font-serif: "Instrument Serif", "Fraunces", Georgia, serif;
  --p-font-sans: "Inter", -apple-system, system-ui, sans-serif;
  --p-font-mono: "JetBrains Mono", "SF Mono", Consolas, monospace;

  /* Remap old tokens so inline refs still work */
  --portal-bg: var(--p-cream);
  --portal-surface: var(--p-cream);
  --portal-sidebar-bg: var(--p-surface);
  --portal-sidebar-border: var(--p-border);
  --portal-text: var(--p-ink);
  --portal-text-muted: var(--p-dim);
  --portal-text-subtle: var(--p-muted);
  --portal-border: var(--p-border);
  --portal-border-light: var(--p-border-2);
  --portal-accent: var(--p-green);
  --portal-accent-hover: var(--p-ink);
  --portal-accent-light: #e1e9e0;
  --portal-blue: var(--p-green);
  --portal-amber: var(--p-accent);
  --portal-red: var(--p-red);
  --portal-purple: var(--p-green);
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');

/* ===== FONTS ===== */
html, body, .portal-body {
  font-family: "Inter", -apple-system, system-ui, sans-serif !important;
  font-feature-settings: "ss01", "cv11";
  background: var(--p-cream) !important;
  color: var(--p-ink) !important;
  font-size: 14px;
}

/* ===== DISPLAY SERIF ===== */
.portal-main h1,
.portal-header h1,
.portal-card-title h1,
.portal-card-title h2,
h1.portal-page-title,
h2.portal-section-title {
  font-family: "Instrument Serif", "Fraunces", Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.03em !important;
  color: var(--p-ink) !important;
}
.portal-header h1 { font-size: 36px !important; line-height: 1; }

/* ===== SIDEBAR ===== */
.portal-sidebar {
  background: var(--p-surface) !important;
  border-right: 1px solid var(--p-border) !important;
  box-shadow: none !important;
  padding: 24px 18px !important;
  width: 232px !important;
}
.portal-sidebar-header {
  border-bottom: none !important;
  padding: 0 6px 22px !important;
}
.portal-sidebar-logo {
  display: flex !important; align-items: center !important;
  gap: 10px !important;
}
.portal-sidebar-logo > div:first-child,
.portal-sidebar-logo > a:first-child {
  /* The JS-injected logo wrapper */
}
.portal-sidebar-logo span[style*="font-family"] {
  font-family: "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  color: var(--p-ink) !important;
  letter-spacing: -0.015em !important;
}
.portal-sidebar-logo span[style*="color:#10b981"] { color: var(--p-green) !important; }
.portal-sidebar-label {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  margin-left: auto !important;
}

.portal-sidebar nav { margin-top: 8px; }
.portal-sidebar nav a {
  display: flex !important; align-items: center !important;
  gap: 10px !important;
  padding: 9px 10px !important;
  border-radius: 3px !important;
  font-size: 13.5px !important;
  color: var(--p-ink) !important;
  font-weight: 400 !important;
  margin-bottom: 2px;
  transition: background 0.15s ease !important;
}
.portal-sidebar nav a:hover { background: var(--p-cream-2) !important; }
.portal-sidebar nav a.active {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  font-weight: 500 !important;
}
.portal-sidebar nav a.active svg { stroke: var(--p-accent) !important; }
.portal-sidebar nav a svg { width: 16px !important; height: 16px !important; opacity: 0.7; }
.portal-sidebar nav a.active svg { opacity: 1; }

.portal-nav-section {
  display: block !important;
  font-size: 10px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  padding: 14px 8px 6px !important;
  margin-top: 6px;
}

.portal-sidebar-user {
  padding: 12px !important;
  background: var(--p-cream-2) !important;
  border-radius: 4px !important;
  border: 1px solid var(--p-border) !important;
  margin-top: auto !important;
}
.portal-sidebar-user-info { display: flex !important; align-items: center !important; gap: 10px !important; }
.portal-sidebar-avatar {
  width: 30px !important; height: 30px !important;
  border-radius: 50% !important;
  background: var(--p-green) !important;
  color: var(--p-accent) !important;
  font-size: 11px !important; font-weight: 600 !important;
  display: grid !important; place-items: center !important;
}
.portal-sidebar-user-name {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--p-ink) !important;
}
.portal-sidebar-user-company {
  font-size: 10px !important;
  color: var(--p-dim) !important;
}

.portal-sidebar-footer {
  border-top: 1px solid var(--p-border) !important;
  padding-top: 12px !important;
  margin-top: 10px;
}
.portal-sidebar-logout {
  color: var(--p-dim) !important;
  font-size: 12px !important;
}
.portal-sidebar-logout:hover { color: var(--p-red) !important; }

/* ===== MAIN CONTENT (FULL WIDTH, respects sidebar offset) =====
   Do NOT override margin-left — the existing portal-light.css sets a
   margin-left equal to the sidebar width so the content clears the
   fixed .portal-sidebar. We only remove the right-side max-width. */
.portal-main {
  background: var(--p-cream) !important;
  padding: 28px 36px 40px !important;
  max-width: none !important;
  width: auto !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}
/* Kill any max-width on inner containers inside portal-main */
.portal-main > .container,
.portal-main > .wrapper,
.portal-main > .content,
.portal-main .portal-header + .container {
  max-width: none !important;
  width: 100% !important;
}
@media (max-width: 768px) {
  .portal-main { padding: 20px 24px 32px !important; }
}
.portal-header {
  border-bottom: 1px solid var(--p-border) !important;
  padding: 0 0 22px !important;
  margin-bottom: 28px !important;
}
.portal-breadcrumbs {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.08em !important;
}
.portal-breadcrumbs a { color: var(--p-dim) !important; }
.portal-breadcrumbs a:hover { color: var(--p-ink) !important; }

/* ===== CARDS ===== */
.portal-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  padding: 22px 24px !important;
}
.portal-card--accent-emerald { border-left: 4px solid var(--p-green) !important; }
.portal-card--accent-blue { border-left: 4px solid var(--p-green) !important; }
.portal-card--accent-amber { border-left: 4px solid var(--p-accent) !important; }
.portal-card--accent-red { border-left: 4px solid var(--p-red) !important; }
.portal-card--accent-purple { border-left: 4px solid var(--p-green-mid) !important; }
.portal-card--glass {
  background: var(--p-surface) !important;
  backdrop-filter: none !important;
  border-color: var(--p-border) !important;
}
.portal-card-header {
  border-bottom: 1px solid var(--p-border) !important;
  padding-bottom: 14px !important;
  margin-bottom: 16px !important;
}
.portal-card-title {
  font-family: "Instrument Serif", serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: var(--p-ink) !important;
}

/* ===== STATS ===== */
.portal-stats {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
}
.portal-stat {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  padding: 22px 24px !important;
  transition: border-color 0.15s ease;
}
.portal-stat:hover { border-color: var(--p-border-2) !important; transform: none !important; }
.portal-stat-icon {
  border-radius: 4px !important;
  width: 40px !important; height: 40px !important;
}
.portal-stat-icon--emerald { background: var(--p-cream-2) !important; color: var(--p-green) !important; }
.portal-stat-icon--emerald svg { stroke: var(--p-green) !important; }
.portal-stat-icon--blue { background: var(--p-cream-2) !important; color: var(--p-green) !important; }
.portal-stat-icon--blue svg { stroke: var(--p-green) !important; }
.portal-stat-icon--amber { background: #fef3c7 !important; color: #b45309 !important; }
.portal-stat-icon--amber svg { stroke: #b45309 !important; }
.portal-stat-icon--red { background: #f2d8cf !important; color: var(--p-red) !important; }
.portal-stat-icon--red svg { stroke: var(--p-red) !important; }
.portal-stat-icon--purple { background: var(--p-cream-2) !important; color: var(--p-green-mid) !important; }
.portal-stat-icon--purple svg { stroke: var(--p-green-mid) !important; }
.portal-stat-label {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  font-weight: 500 !important;
}
.portal-stat-value {
  font-family: "Instrument Serif", serif !important;
  font-size: 38px !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: var(--p-ink) !important;
  line-height: 1 !important;
}
.portal-stat-value--currency { color: var(--p-ink) !important; }
.portal-stat-trend--up { color: var(--p-green) !important; background: #e1e9e0 !important; }
.portal-stat-trend--down { color: var(--p-red) !important; background: #f2d8cf !important; }

/* ===== TABLES ===== */
.portal-table-wrap {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}
.portal-table thead th {
  background: var(--p-surface) !important;
  font-size: 10.5px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--p-border) !important;
  padding: 12px 22px !important;
}
.portal-table tbody td {
  padding: 16px 22px !important;
  border-bottom: 1px solid var(--p-border) !important;
  color: var(--p-ink) !important;
  font-size: 13px !important;
}
.portal-table tbody tr:hover td { background: var(--p-surface) !important; }
.portal-table tbody tr:last-child td { border-bottom: none !important; }
.portal-table td.currency,
.portal-table .currency {
  font-family: "Instrument Serif", serif !important;
  font-size: 17px !important;
  letter-spacing: -0.01em !important;
  font-weight: 400 !important;
}

/* ===== BADGES ===== */
.portal-badge {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  border: 1px solid transparent;
  display: inline-block !important;
}
.portal-badge--draft { background: var(--p-cream-2) !important; color: var(--p-ink) !important; border-color: var(--p-border) !important; }
.portal-badge--todo, .portal-badge--pending, .portal-badge--sent {
  background: #f5e6a8 !important; color: #6b551a !important; border-color: #d9bf66 !important;
}
.portal-badge--completed, .portal-badge--paid, .portal-badge--approved, .portal-badge--active {
  background: #e1e9e0 !important; color: var(--p-green) !important; border-color: #b8ccbc !important;
}
.portal-badge--rejected, .portal-badge--overdue, .portal-badge--cancelled {
  background: #f2d8cf !important; color: var(--p-red) !important; border-color: #e5b5a5 !important;
}
.portal-badge--expired { background: var(--p-cream-2) !important; color: var(--p-dim) !important; border-color: var(--p-border) !important; }

/* ===== BUTTONS ===== */
.portal-btn {
  font-family: "Inter", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  padding: 12px 20px !important;
  border-radius: 999px !important;
  letter-spacing: -0.005em !important;
  transition: background 0.15s ease, transform 0.15s ease, filter 0.15s ease !important;
  box-shadow: none !important;
  border: none !important;
  cursor: pointer !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
}
.portal-btn:hover { transform: translateY(-1px); }
.portal-btn--primary {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border: none !important;
}
.portal-btn--primary:hover { background: var(--p-ink) !important; }
.portal-btn--outline {
  background: transparent !important;
  color: var(--p-ink) !important;
  border: 1px solid var(--p-ink) !important;
  padding: 11px 20px !important;
}
.portal-btn--outline:hover { background: var(--p-ink) !important; color: var(--p-cream) !important; }
.portal-btn--dashed {
  background: transparent !important;
  color: var(--p-dim) !important;
  border: 1px dashed var(--p-border) !important;
}
.portal-btn--dashed:hover { border-color: var(--p-ink) !important; color: var(--p-ink) !important; }
.portal-btn--danger {
  background: var(--p-red) !important;
  color: var(--p-cream) !important;
  border: none !important;
}
.portal-btn--ghost {
  background: transparent !important;
  color: var(--p-ink) !important;
  border: none !important;
}
.portal-btn--ghost:hover { background: var(--p-cream-2) !important; }
.portal-btn--sm { padding: 8px 14px !important; font-size: 12px !important; }
.portal-btn--sm.portal-btn--outline { padding: 7px 14px !important; }
.portal-btn--pay {
  background: var(--p-accent) !important;
  color: var(--p-ink) !important;
  border: none !important;
}
.portal-btn--pay:hover { filter: brightness(0.95); }

/* ===== FORMS ===== */
.portal-input,
.portal-select,
.portal-textarea {
  background: var(--p-surface) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px !important;
  color: var(--p-ink) !important;
  transition: border-color 0.15s !important;
}
.portal-input:focus,
.portal-select:focus,
.portal-textarea:focus {
  border-color: var(--p-green) !important;
  outline: none !important;
  box-shadow: none !important;
}
.portal-label {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
}
.portal-input-group-text {
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  color: var(--p-dim) !important;
}

/* ===== ALERTS ===== */
.portal-alert {
  border-radius: 4px !important;
  border: 1px solid var(--p-border) !important;
  padding: 14px 18px !important;
  box-shadow: none !important;
}
.portal-alert--success { background: #e1e9e0 !important; color: var(--p-green) !important; border-color: #b8ccbc !important; }
.portal-alert--error { background: #f2d8cf !important; color: var(--p-red) !important; border-color: #e5b5a5 !important; }
.portal-alert--warning { background: #f5e6a8 !important; color: #6b551a !important; border-color: #d9bf66 !important; }
.portal-alert--info { background: var(--p-cream-2) !important; color: var(--p-ink) !important; border-color: var(--p-border) !important; }

/* ===== BELL / NOTIFICATIONS ===== */
.portal-bell {
  width: 34px !important; height: 34px !important;
  border-radius: 50% !important;
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  color: var(--p-ink) !important;
}
.portal-bell:hover { background: var(--p-border) !important; }
.portal-bell-badge {
  background: var(--p-accent) !important;
  color: var(--p-ink) !important;
  border: 2px solid var(--p-cream) !important;
}

.portal-notification-panel {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  box-shadow: 0 12px 40px rgba(14,31,23,0.12) !important;
}
.portal-notification-item {
  border-bottom: 1px solid var(--p-border-2) !important;
}
.portal-notification-item:hover { background: var(--p-surface) !important; }

/* ===== EMPTY / LOADING ===== */
.portal-empty {
  color: var(--p-dim) !important;
}
.portal-empty h3 {
  font-family: "Instrument Serif", serif !important;
  font-weight: 400 !important;
  color: var(--p-ink) !important;
  letter-spacing: -0.01em !important;
}
.portal-loading .portal-spinner {
  border-top-color: var(--p-green) !important;
  border-color: var(--p-border) !important;
}

/* ===== LINKS ===== */
a.text-accent,
.portal-main a:not(.portal-btn):not(.portal-sidebar-logo):not(.portal-sidebar-footer a) {
  color: var(--p-green) !important;
}
a.text-accent:hover,
.portal-main a:not(.portal-btn):hover { color: var(--p-ink) !important; }

/* Avatar initials colour */
.portal-avatar {
  background: var(--p-green) !important;
  color: var(--p-accent) !important;
}

/* Dashboard welcome card (re-skin gradient) */
.dash-welcome,
[class*="dash-welcome"] {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border: none !important;
  border-radius: 4px !important;
}
.dash-welcome h1,
[class*="dash-welcome"] h1 {
  color: var(--p-cream) !important;
  font-family: "Instrument Serif", serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
}
.dash-welcome-date,
.dash-welcome-sub {
  color: #c9d7cd !important;
}

/* Dash stat card legacy */
.dash-stat-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}
.dash-stat-card:hover { transform: none !important; box-shadow: none !important; border-color: var(--p-border-2) !important; }
.dash-stat-icon { border-radius: 4px !important; }
.dash-stat-icon--emerald, .dash-stat-icon--blue { background: var(--p-cream-2) !important; }
.dash-stat-icon--emerald svg, .dash-stat-icon--blue svg { stroke: var(--p-green) !important; }
.dash-stat-icon--amber { background: #fef3c7 !important; }
.dash-stat-icon--amber svg { stroke: #b45309 !important; }
.dash-stat-icon--purple { background: var(--p-cream-2) !important; }
.dash-stat-icon--purple svg { stroke: var(--p-green-mid) !important; }

/* Inline message/chat bubbles and misc page-specific */
.chat-bubble-sent,
[class*="bubble--me"],
[class*="bubble--out"] {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
}

/* Focus ring */
*:focus-visible {
  outline: 2px solid var(--p-green) !important;
  outline-offset: 2px !important;
  border-radius: 2px;
}

/* Sidebar badges JS-injected */
#chatUnreadBadge,
[class*="badge"][style*="background:#10b981"] {
  background: var(--p-accent) !important;
  color: var(--p-ink) !important;
}

/* ============================================================
   EXTENDED INSTITUTE PATTERNS — picks up inline/existing HTML
   ============================================================ */

/* CannCare commitment banner (green) */
.cc-commitment-banner {
  background: var(--p-green) !important; color: var(--p-cream) !important;
  border-radius: 4px !important; padding: 20px 24px !important;
  margin: 0 0 28px !important;
  display: flex !important; align-items: center !important; gap: 20px !important;
  flex-wrap: wrap;
}
.cc-commitment-banner-cta {
  background: var(--p-accent); color: var(--p-ink);
  padding: 10px 18px; border-radius: 999px;
  font-size: 13px; font-weight: 600;
  text-decoration: none; white-space: nowrap;
  border: none; flex-shrink: 0;
  transition: filter 0.15s, transform 0.15s;
}
.cc-commitment-banner-cta:hover {
  filter: brightness(0.95); transform: translateY(-1px);
}
.cc-commitment-banner-dot {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--p-accent); color: var(--p-ink);
  display: grid; place-items: center;
  font-size: 16px; font-weight: 700; flex-shrink: 0;
}
.cc-commitment-banner-eyebrow {
  font-size: 11px; color: var(--p-accent);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.cc-commitment-banner-eyebrow::before { content: "— "; }
.cc-commitment-banner-title {
  font-family: var(--p-font-serif); font-size: 20px;
  letter-spacing: -0.01em; margin-top: 4px; font-weight: 400;
}
.cc-commitment-banner-title em { color: var(--p-accent); font-style: italic; }

/* Action banner (ink) for alerts */
.ii-action-banner {
  background: var(--p-ink); color: var(--p-cream);
  border-radius: 4px; padding: 20px 24px; margin-bottom: 28px;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
.ii-action-banner-icon {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--p-accent); color: var(--p-ink);
  display: grid; place-items: center;
  font-size: 16px; font-weight: 700; flex-shrink: 0;
}
.ii-action-banner-body { flex: 1; min-width: 200px; }
.ii-action-banner-eyebrow {
  font-size: 11px; color: var(--p-accent);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.ii-action-banner-eyebrow::before { content: "— "; }
.ii-action-banner-title {
  font-family: var(--p-font-serif); font-size: 22px;
  letter-spacing: -0.01em; margin-top: 4px; font-weight: 400;
}
.ii-action-banner-title em { color: var(--p-accent); font-style: italic; }

/* 40% ochre commitment card */
.ii-commitment-card {
  background: var(--p-accent); color: var(--p-ink);
  border-radius: 4px; padding: 22px 24px;
}
.ii-commitment-card-eyebrow {
  font-size: 11px; letter-spacing: 0.14em;
  text-transform: uppercase; font-weight: 700;
}
.ii-commitment-card-eyebrow::before { content: "— "; }
.ii-commitment-card-amount {
  font-family: var(--p-font-serif); font-size: 44px;
  letter-spacing: -0.03em; line-height: 1; margin-top: 8px; font-weight: 400;
}
.ii-commitment-card-amount .cents { font-size: 18px; color: #6b551a; }
.ii-commitment-card-sub { font-size: 12px; margin-top: 6px; color: #5c4918; }
.ii-commitment-card-divider { height: 1px; background: #d9bf66; margin: 16px 0; }
.ii-commitment-card-body { font-size: 11.5px; color: #5c4918; line-height: 1.55; }

/* Revenue card (green) */
.ii-revenue-card {
  background: var(--p-green); color: var(--p-cream);
  border-radius: 4px; padding: 20px 22px;
}
.ii-revenue-card-eyebrow {
  font-size: 11px; color: var(--p-accent);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.ii-revenue-card-eyebrow::before { content: "— "; }
.ii-revenue-card-body {
  font-family: var(--p-font-serif); font-size: 26px;
  line-height: 1.15; margin-top: 6px; letter-spacing: -0.01em;
}
.ii-revenue-card-body em { color: var(--p-accent); font-style: normal; }
.ii-revenue-card-sub { font-size: 11.5px; color: #c9d7cd; margin-top: 6px; }

/* Chat bubbles */
[class*="chat-bubble"]:not([class*="--me"]):not([class*="--out"]):not([class*="--sent"]) {
  background: var(--p-cream-2) !important; color: var(--p-ink) !important;
  border-radius: 14px 14px 14px 2px !important;
}
[class*="bubble--me"], [class*="bubble--out"], [class*="bubble--sent"],
[class*="chat-bubble-sent"], [class*="message-out"], .chat-mine, .msg-out {
  background: var(--p-green) !important; color: var(--p-cream) !important;
  border-radius: 14px 14px 2px 14px !important;
}
.chat-timestamp, .msg-time, [class*="msg-meta"] {
  font-size: 10px !important; color: var(--p-dim) !important; letter-spacing: 0.04em;
}

/* Pull quote */
.ii-pullquote {
  margin: 32px 0; padding: 20px 24px;
  border-left: 3px solid var(--p-green); background: var(--p-cream-2);
}
.ii-pullquote p {
  font-family: var(--p-font-serif); font-size: 24px; font-style: italic;
  color: var(--p-ink); line-height: 1.3; margin: 0; font-weight: 400;
}
.ii-pullquote cite, .ii-pullquote footer {
  display: block; font-family: var(--p-font-sans); font-size: 12px;
  color: var(--p-dim); margin-top: 12px; font-style: normal;
}

/* Drop cap for article bodies */
.ii-dropcap > p:first-of-type::first-letter,
.article-body > p:first-of-type::first-letter {
  font-family: var(--p-font-serif); font-size: 68px; line-height: 0.85;
  font-weight: 400; color: var(--p-green);
  float: left; padding: 6px 10px 0 0; margin-top: 4px;
}

/* Stats strip */
.ii-stats-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 1px solid var(--p-border); border-bottom: 1px solid var(--p-border);
}
.ii-stats-cell { padding: 28px 24px; border-right: 1px solid var(--p-border); }
.ii-stats-cell:last-child { border-right: none; }
.ii-stats-key {
  font-size: 11px; color: var(--p-dim);
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
}
.ii-stats-val {
  font-family: var(--p-font-serif); font-size: 56px;
  letter-spacing: -0.03em; line-height: 1; color: var(--p-ink);
  margin-top: 10px; font-weight: 400;
}
.ii-stats-note { font-size: 12px; color: var(--p-green); margin-top: 8px; font-style: italic; }
@media (max-width: 900px) {
  .ii-stats-strip { grid-template-columns: repeat(2, 1fr); }
  .ii-stats-cell:nth-child(2) { border-right: none; }
  .ii-stats-cell:nth-child(3), .ii-stats-cell:nth-child(4) {
    border-top: 1px solid var(--p-border);
  }
  .ii-stats-val { font-size: 40px; }
}
@media (max-width: 600px) {
  .ii-stats-strip { grid-template-columns: 1fr; }
  .ii-stats-cell { border-right: none; border-top: 1px solid var(--p-border); }
  .ii-stats-cell:first-child { border-top: none; }
}

/* Timeline */
.ii-timeline {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.ii-timeline-cell { padding: 0 18px; border-left: 1px solid var(--p-border); }
.ii-timeline-cell:first-child { border-left: none; padding-left: 0; }
.ii-timeline-date {
  font-size: 11px; color: var(--p-green);
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600;
}
.ii-timeline-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--p-green); margin: 12px 0;
}
.ii-timeline-title {
  font-family: var(--p-font-serif); font-size: 20px;
  margin: 0 0 8px; letter-spacing: -0.015em; font-weight: 400;
}
.ii-timeline-body { font-size: 13px; line-height: 1.55; color: var(--p-muted); }

/* Settings toggle */
.ii-setting-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 0; border-bottom: 1px solid var(--p-border); gap: 20px;
}
.ii-setting-row:last-child { border-bottom: none; }
.ii-setting-info { flex: 1; }
.ii-setting-label { font-weight: 600; font-size: 14px; color: var(--p-ink); }
.ii-setting-desc { font-size: 12px; color: var(--p-dim); margin-top: 4px; line-height: 1.5; }
.ii-toggle {
  width: 44px; height: 24px; background: var(--p-border);
  border-radius: 12px; cursor: pointer; position: relative;
  border: none; flex-shrink: 0; transition: background 0.2s ease;
}
.ii-toggle.active, .ii-toggle[aria-checked="true"] { background: var(--p-green); }
.ii-toggle::after {
  content: ""; position: absolute; width: 18px; height: 18px;
  background: #fff; border-radius: 50%; top: 3px; left: 3px;
  transition: transform 0.2s ease; box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}
.ii-toggle.active::after, .ii-toggle[aria-checked="true"]::after { transform: translateX(20px); }

/* Progress stepper */
.ii-stepper { display: flex; align-items: center; gap: 8px; padding: 20px 0; }
.ii-step { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ii-step-num {
  width: 28px; height: 28px; border-radius: 50%;
  border: 1.5px solid var(--p-border); color: var(--p-dim);
  display: grid; place-items: center;
  font-size: 12px; font-weight: 600;
}
.ii-step.done .ii-step-num {
  background: var(--p-green); color: var(--p-cream); border-color: var(--p-green);
}
.ii-step.current .ii-step-num {
  border-color: var(--p-green); color: var(--p-green); background: var(--p-cream-2);
}
.ii-step-label { font-size: 12px; color: var(--p-dim); font-weight: 500; }
.ii-step.done .ii-step-label, .ii-step.current .ii-step-label { color: var(--p-ink); }
.ii-step-line { flex: 1; height: 1px; background: var(--p-border); min-width: 20px; }
.ii-step.done + .ii-step-line { background: var(--p-green); }

/* Invoice-style meta strip */
.ii-meta-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  background: var(--p-surface);
  border: 1px solid var(--p-border); border-radius: 4px;
  margin-bottom: 28px;
}
.ii-meta-cell { padding: 20px 24px; border-right: 1px solid var(--p-border); }
.ii-meta-cell:last-child { border-right: none; }
.ii-meta-key {
  font-size: 10px; color: var(--p-dim);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500;
}
.ii-meta-val {
  font-family: var(--p-font-serif); font-size: 28px;
  letter-spacing: -0.02em; margin-top: 6px; color: var(--p-ink);
  line-height: 1; font-weight: 400;
}
.ii-meta-val.warn { color: var(--p-red); }
.ii-meta-val.good { color: var(--p-green); }
.ii-meta-sub { font-size: 11px; color: var(--p-dim); margin-top: 4px; }
@media (max-width: 900px) {
  .ii-meta-strip { grid-template-columns: repeat(2, 1fr); }
  .ii-meta-cell:nth-child(2) { border-right: none; }
  .ii-meta-cell:nth-child(3), .ii-meta-cell:nth-child(4) { border-top: 1px solid var(--p-border); }
}

/* Pricing card */
.ii-pricing-card {
  background: var(--p-cream); border: 1px solid var(--p-border);
  border-radius: 4px; padding: 28px;
  display: flex; flex-direction: column; height: 100%;
}
.ii-pricing-card.featured { background: var(--p-green); color: var(--p-cream); border-color: var(--p-green); }
.ii-pricing-eyebrow {
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--p-dim); font-weight: 500;
}
.ii-pricing-card.featured .ii-pricing-eyebrow { color: var(--p-accent); }
.ii-pricing-eyebrow::before { content: "— "; }
.ii-pricing-name {
  font-family: var(--p-font-serif); font-size: 26px;
  letter-spacing: -0.02em; margin-top: 6px; font-weight: 400;
}
.ii-pricing-price {
  font-family: var(--p-font-serif); font-size: 56px;
  letter-spacing: -0.03em; line-height: 1; margin: 16px 0 4px; font-weight: 400;
}
.ii-pricing-price .cadence {
  font-size: 13px; color: var(--p-dim);
  letter-spacing: 0; font-family: var(--p-font-sans);
}
.ii-pricing-card.featured .ii-pricing-price .cadence { color: #c9d7cd; }
.ii-pricing-card ul {
  list-style: none; padding: 0; margin: 20px 0 0;
  border-top: 1px solid var(--p-border); flex: 1;
}
.ii-pricing-card.featured ul { border-top-color: #2f513e; }
.ii-pricing-card li {
  padding: 12px 0; font-size: 13px; color: var(--p-muted);
  border-bottom: 1px solid var(--p-border-2);
  display: flex; align-items: flex-start; gap: 10px;
}
.ii-pricing-card.featured li { color: #c9d7cd; border-bottom-color: #2f513e; }
.ii-pricing-card li::before { content: "✓"; color: var(--p-green); font-weight: 700; }
.ii-pricing-card.featured li::before { color: var(--p-accent); }
.ii-pricing-card li:last-child { border-bottom: none; }

/* Eyebrow utility */
.ii-eyebrow {
  font-size: 11px; color: var(--p-dim);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500;
  display: inline-block; margin-bottom: 10px;
}
.ii-eyebrow::before { content: "— "; }
.ii-eyebrow.green { color: var(--p-green); font-weight: 600; }
.ii-eyebrow.accent { color: var(--p-accent); font-weight: 600; }

/* Stack pills */
.ii-pills { display: flex; gap: 8px; flex-wrap: wrap; }
.ii-pill {
  font-size: 12px; font-weight: 500; color: var(--p-green);
  background: var(--p-cream-2); border: 1px solid var(--p-border);
  padding: 6px 12px; border-radius: 999px;
  transition: background 0.15s, color 0.15s;
}
.ii-pill:hover { background: var(--p-green); color: var(--p-accent); border-color: var(--p-green); }

/* Ordered check list */
.ii-check-list { list-style: none; padding: 0; margin: 0; }
.ii-check-list li {
  padding: 10px 0 10px 28px; position: relative;
  font-size: 14px; color: var(--p-ink); line-height: 1.55;
  border-bottom: 1px solid var(--p-border-2);
}
.ii-check-list li:last-child { border-bottom: none; }
.ii-check-list li::before {
  content: ""; position: absolute; left: 0; top: 13px;
  width: 16px; height: 16px; border-radius: 2px; background: var(--p-green);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'><path d='M3 8L6.5 11.5L13 4.5' stroke='%23e8c547' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-size: 16px 16px; background-position: center;
}

/* Serif italic utilities */
.ii-italic { font-style: italic; color: var(--p-green); }
.ii-italic-accent { font-style: italic; color: var(--p-accent); }

/* Card-link (clickable card) */
a.portal-card {
  display: block; color: inherit; text-decoration: none;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
a.portal-card:hover { border-color: var(--p-green) !important; transform: translateY(-1px); }

/* Horizontal divider */
hr.ii-divider, .ii-divider {
  border: none !important; border-top: 1px solid var(--p-border) !important;
  margin: 40px 0 !important;
}

/* Page-level tabs (not notif-tabs) */
[role="tablist"]:not(.notif-tabs):not(.notif-page-tabs),
.tabs:not(.notif-tabs), [class*="tab-strip"] {
  border-bottom: 1px solid var(--p-border) !important;
  display: flex; gap: 4px;
}
[role="tab"]:not(.notif-tab), .tab-link, .tabs > a, .tabs > button {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
  color: var(--p-dim) !important;
  font-weight: 500 !important;
  cursor: pointer !important;
}
[role="tab"][aria-selected="true"]:not(.notif-tab),
.tab-link.active, .tabs > a.active, .tabs > button.active {
  color: var(--p-green) !important;
  border-bottom-color: var(--p-green) !important;
  font-weight: 600 !important;
}

/* ============================================================
   UNIFIED PORTAL HEADER (applied to 17 pages)
   Eyebrow + serif title pattern
   ============================================================ */
.portal-header-ii {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  gap: 24px !important;
  padding: 8px 0 24px !important;
  border-bottom: 1px solid var(--p-border) !important;
  margin-bottom: 28px !important;
  flex-wrap: wrap;
}
.portal-header-ii .portal-header-text { flex: 1; min-width: 0; }
.portal-header-ii .portal-breadcrumbs {
  margin-bottom: 8px;
  font-size: 11px;
  color: var(--p-dim);
  letter-spacing: 0.08em;
}
.portal-header-ii .portal-breadcrumbs a { color: var(--p-dim); }
.portal-header-ii .portal-breadcrumbs a:hover { color: var(--p-ink); }
.portal-header-ii .portal-breadcrumbs span { color: var(--p-border); margin: 0 6px; }
.portal-header-eyebrow {
  font-size: 11px !important;
  color: var(--p-green) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  margin-bottom: 6px;
}
.portal-header-eyebrow::before { content: "— "; }
.portal-header-ii h1 {
  font-family: var(--p-font-serif) !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  letter-spacing: -0.03em !important;
  color: var(--p-ink) !important;
  line-height: 1 !important;
  margin: 0 !important;
}
.portal-header-ii h1 em,
.portal-header-ii h1 .portal-badge {
  font-family: inherit;
  font-style: italic;
  color: var(--p-green);
}
.portal-header-ii h1 .portal-badge {
  font-family: var(--p-font-sans);
  font-style: normal;
  font-size: 10.5px !important;
  vertical-align: middle;
  margin-left: 12px;
}
.portal-header-ii .portal-bell {
  flex-shrink: 0;
  margin-bottom: 4px;
}
@media (max-width: 768px) {
  .portal-header-ii { flex-direction: column; align-items: flex-start; }
  .portal-header-ii h1 { font-size: 30px !important; }
  .portal-header-ii .portal-bell { align-self: flex-end; margin-top: -12px; }
}

/* ============================================================
   DASHBOARD — Institute Welcome Section (dark forest with cream text)
   ============================================================ */
.dash-welcome-ii {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 32px 32px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
  position: relative !important;
  overflow: hidden !important;
}
.dash-welcome-ii::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--p-accent) 50%, transparent 100%);
  opacity: 0.6;
}
.dash-welcome-left { flex: 1; min-width: 0; }
.dash-welcome-eyebrow {
  font-size: 11px !important;
  color: var(--p-accent) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  margin-bottom: 10px !important;
}
.dash-welcome-eyebrow::before { content: "— "; }
.dash-welcome-serif,
.dash-welcome-ii h1.dash-welcome-serif {
  font-family: var(--p-font-serif) !important;
  font-size: 42px !important;
  font-weight: 400 !important;
  letter-spacing: -0.03em !important;
  color: var(--p-cream) !important;
  line-height: 1 !important;
  margin: 0 !important;
}
.dash-welcome-serif span,
.dash-welcome-ii #greeting {
  color: var(--p-cream) !important;
}
.dash-welcome-meta {
  margin-top: 10px !important;
  font-size: 13px !important;
  color: #c9d7cd !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.dash-welcome-date {
  color: var(--p-accent) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}
.dash-welcome-dot { color: #3b6a4c !important; }
.dash-welcome-sub { color: #c9d7cd !important; }
.dash-welcome-ii .portal-bell {
  background: rgba(250, 247, 238, 0.1) !important;
  border-color: rgba(232, 197, 71, 0.3) !important;
  color: var(--p-cream) !important;
}
.dash-welcome-ii .portal-bell:hover {
  background: rgba(250, 247, 238, 0.15) !important;
}
.dash-welcome-right { flex-shrink: 0; }
.dash-welcome-right .portal-bell {
  width: 40px !important; height: 40px !important;
  border-radius: 50% !important;
}

@media (max-width: 767px) {
  .dash-welcome-ii { flex-direction: column; align-items: flex-start; padding: 24px; }
  .dash-welcome-serif { font-size: 32px !important; }
}

/* Institute stat cards — overrides existing .dash-stat-card */
.dash-stat-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 22px 24px !important;
  gap: 14px !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease !important;
}
.dash-stat-card:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: var(--p-green) !important;
}
.dash-stat-icon {
  width: 40px !important; height: 40px !important;
  border-radius: 4px !important;
}
.dash-stat-label {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
}
.dash-stat-value {
  font-family: var(--p-font-serif) !important;
  font-size: 32px !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: var(--p-ink) !important;
  line-height: 1 !important;
}
.dash-stat-value--mono {
  font-family: var(--p-font-serif) !important;
}

/* Dashboard card re-skin */
.dash-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 22px 24px !important;
  box-shadow: none !important;
}
.dash-card-header {
  border-bottom: 1px solid var(--p-border) !important;
  padding-bottom: 14px !important;
  margin-bottom: 16px !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dash-card-title {
  font-family: var(--p-font-serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
  color: var(--p-ink) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.dash-card-title svg {
  width: 18px !important; height: 18px !important;
  stroke: var(--p-green) !important;
  opacity: 0.8;
}
.dash-card-link {
  font-size: 12px !important;
  color: var(--p-green) !important;
  font-weight: 600 !important;
  letter-spacing: 0;
}
.dash-card-link:hover { color: var(--p-ink) !important; }

/* Dashboard skeleton */
.dash-skeleton {
  background: linear-gradient(90deg, var(--p-cream-2) 25%, var(--p-border-2) 50%, var(--p-cream-2) 75%) !important;
  background-size: 200% 100% !important;
  border-radius: 3px !important;
}
.dash-skeleton--value { height: 28px !important; width: 120px !important; }

/* Recent Activity / Activity feed */
.dash-activity-item, [class*="activity-item"] {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid var(--p-border-2);
}
.dash-activity-item:last-child { border-bottom: none; }
.dash-activity-item::before,
[class*="activity-item"]::before {
  content: ""; width: 8px; height: 8px;
  border-radius: 50%; background: var(--p-green);
  margin-top: 8px; flex-shrink: 0;
}

/* Recent Invoices table styling */
.dash-invoices-table, #recentInvoices table, [id="recentInvoices"] table {
  width: 100%; border-collapse: collapse;
}
#recentInvoices th, [id="recentInvoices"] th {
  font-size: 10.5px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--p-border) !important;
  text-align: left !important;
}
#recentInvoices td, [id="recentInvoices"] td {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
  font-size: 13px !important;
}
#recentInvoices td:last-child, [id="recentInvoices"] td:last-child { border-bottom: none; }

/* Quick Actions grid (portal dashboard) */
.dash-actions-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
}
.dash-action-btn, .dash-quick-action {
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 14px 16px !important;
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  color: var(--p-ink) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: border-color 0.15s ease, transform 0.15s ease !important;
}
.dash-action-btn:hover, .dash-quick-action:hover {
  border-color: var(--p-green) !important;
  transform: translateY(-1px);
}
.dash-action-btn svg, .dash-quick-action svg {
  width: 16px !important; height: 16px !important;
  stroke: var(--p-green) !important;
  opacity: 0.8;
}
.dash-action-btn .action-icon, .dash-quick-action [class*="icon"] {
  background: var(--p-cream-2) !important;
  border-radius: 4px !important;
}

/* Upcoming deadlines styling */
#upcomingDeadlines > div, .upcoming-deadline {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
}
#upcomingDeadlines > div:last-child { border-bottom: none; }

/* Account Overview section */
.account-overview-row, #accountOverview > div,
[class*="account-overview"] > div {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--p-border-2);
  font-size: 13px;
}
.account-overview-row:last-child { border-bottom: none; }

/* ============================================================
   PROJECTS LIST (projects.html)
   Each .proj-card becomes a mini "active project" hero
   ============================================================ */
.proj-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
  gap: 20px !important;
}
.proj-card {
  background: var(--p-surface) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 24px 26px !important;
  display: flex !important;
  flex-direction: column !important;
  transition: border-color 0.15s ease, transform 0.15s ease !important;
  text-decoration: none !important;
  color: inherit !important;
  position: relative;
}
.proj-card::before {
  content: "— Project"; position: absolute; top: 20px; left: 26px;
  font-family: var(--p-font-sans);
  font-size: 10px; color: var(--p-green);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.proj-card:hover {
  border-color: var(--p-green) !important; transform: translateY(-2px);
}
.proj-card-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  margin: 22px 0 8px !important;
}
.proj-card-name {
  font-family: var(--p-font-serif) !important;
  font-size: 22px !important; font-weight: 400 !important;
  letter-spacing: -0.015em !important;
  color: var(--p-ink) !important;
}
.proj-card-desc {
  font-size: 13px !important;
  color: var(--p-muted) !important;
  margin-bottom: 18px !important;
  line-height: 1.55 !important;
}
.portal-progress {
  height: 4px !important;
  background: var(--p-border) !important;
  border-radius: 2px !important;
  overflow: hidden !important;
  margin: auto 0 8px !important;
}
.portal-progress-fill {
  height: 100% !important;
  background: var(--p-green) !important;
  transition: width 0.6s ease !important;
}
.proj-card-meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.04em;
  padding-top: 12px;
  border-top: 1px solid var(--p-border-2);
  margin-top: 4px;
}
.proj-card-milestones { color: var(--p-green) !important; font-weight: 600; }

/* ============================================================
   PROJECT DETAIL (project-detail.html)
   ============================================================ */
.proj-tab-panel { animation: portalFadeIn 0.3s ease both; }
.portal-tabs {
  display: flex !important;
  gap: 4px !important;
  border-bottom: 1px solid var(--p-border) !important;
  margin-bottom: 24px !important;
  padding: 0 !important;
}
.portal-tab {
  padding: 12px 20px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  font-family: var(--p-font-sans) !important;
  font-size: 13px !important;
  color: var(--p-dim) !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: color 0.15s, border-color 0.15s !important;
  margin-bottom: -1px;
}
.portal-tab:hover { color: var(--p-ink) !important; }
.portal-tab.active {
  color: var(--p-green) !important;
  border-bottom-color: var(--p-green) !important;
  font-weight: 600 !important;
}

/* Task items in project detail */
.proj-task {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
}
.proj-task:last-child { border-bottom: none !important; }
.proj-task-name {
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--p-ink) !important;
}

/* File rows */
.proj-file {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
}
.proj-file:last-child { border-bottom: none !important; }
.proj-file-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 3px !important;
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  color: var(--p-green) !important;
}
.proj-file-icon svg { color: var(--p-green) !important; }
.proj-file-name {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--p-ink) !important;
}
.proj-file-meta {
  font-size: 11px !important;
  color: var(--p-dim) !important;
}

/* Milestones */
.portal-milestones { padding: 4px 0; }
.portal-milestone {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
  position: relative;
  padding-left: 24px !important;
}
.portal-milestone:last-child { border-bottom: none !important; }
.portal-milestone-dot {
  position: absolute; left: 4px; top: 20px;
  width: 10px !important; height: 10px !important;
  border-radius: 50%; background: var(--p-border) !important;
  border: 2px solid var(--p-cream) !important;
}
.portal-milestone--complete .portal-milestone-dot { background: var(--p-green) !important; }
.portal-milestone--in_progress .portal-milestone-dot { background: var(--p-accent) !important; }
.portal-milestone-title {
  font-family: var(--p-font-serif) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
  color: var(--p-ink) !important;
  margin-bottom: 4px;
}
.portal-milestone-date {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* ============================================================
   SETTINGS PAGE
   ============================================================ */
.settings-toggle {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
}
.settings-toggle:last-child { border-bottom: none !important; }
.settings-toggle-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--p-ink) !important;
}
.settings-toggle-desc {
  font-size: 12px !important;
  color: var(--p-dim) !important;
  margin-top: 4px !important;
  line-height: 1.5;
}
.toggle-switch {
  width: 44px !important;
  height: 24px !important;
  background: var(--p-border) !important;
  border-radius: 12px !important;
  transition: background 0.2s ease !important;
}
.toggle-switch.on { background: var(--p-green) !important; }
.toggle-switch::after {
  width: 18px !important; height: 18px !important;
  top: 3px !important; left: 3px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.15) !important;
}
.toggle-switch.on::after { transform: translateX(20px) !important; }

.avatar-upload-section {
  padding: 20px 0 !important;
  border-bottom: 1px solid var(--p-border) !important;
  align-items: center;
}
.avatar-preview {
  width: 72px !important; height: 72px !important;
  background: var(--p-green) !important;
  color: var(--p-accent) !important;
  font-family: var(--p-font-serif) !important;
  font-size: 24px !important;
  font-weight: 400 !important;
}
.twofa-status {
  padding: 14px 16px;
  background: var(--p-cream-2);
  border: 1px solid var(--p-border);
  border-radius: 4px;
  font-size: 13px;
}

/* ============================================================
   SUPPORT / HELP CENTER
   ============================================================ */
.hc-hero {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border-radius: 4px !important;
  padding: 48px 32px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}
.hc-hero::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--p-accent) 50%, transparent 100%);
  opacity: 0.4;
}
.hc-hero h2 {
  font-family: var(--p-font-serif) !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  letter-spacing: -0.03em !important;
  color: var(--p-cream) !important;
  margin-bottom: 24px !important;
}
.hc-hero h2 em { color: var(--p-accent) !important; font-style: italic; }
.hc-search-wrap {
  max-width: 560px !important; margin: 0 auto !important;
}
.hc-search-wrap svg { color: var(--p-on-ink-dim, #9aaea2) !important; }
.hc-search {
  background: rgba(250, 247, 238, 0.08) !important;
  border: 1.5px solid rgba(232, 197, 71, 0.25) !important;
  border-radius: 999px !important;
  color: var(--p-cream) !important;
  padding: 14px 20px 14px 48px !important;
  font-family: var(--p-font-sans) !important;
}
.hc-search::placeholder { color: rgba(250, 247, 238, 0.5) !important; }
.hc-search:focus {
  border-color: var(--p-accent) !important;
  background: rgba(250, 247, 238, 0.12) !important;
  box-shadow: none !important;
}

.hc-cats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
  margin-bottom: 32px !important;
}
.hc-cat {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 24px !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: border-color 0.15s, transform 0.15s !important;
  display: block !important;
}
.hc-cat:hover { border-color: var(--p-green) !important; transform: translateY(-2px); }
.hc-cat-icon {
  width: 40px !important; height: 40px !important;
  background: var(--p-cream-2) !important;
  border-radius: 4px !important;
  display: grid !important; place-items: center !important;
  margin-bottom: 16px !important;
}
.hc-cat-icon svg { color: var(--p-green) !important; }
.hc-cat-title {
  font-family: var(--p-font-serif) !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
  color: var(--p-ink) !important;
  margin-bottom: 4px !important;
}
.hc-cat-desc {
  font-size: 13px !important;
  color: var(--p-muted) !important;
  line-height: 1.5 !important;
}
@media (max-width: 900px) { .hc-cats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .hc-cats { grid-template-columns: 1fr; } }

/* ============================================================
   PAYMENT METHODS PAGE
   ============================================================ */
.pm-list, .payment-methods-list { padding: 0; }
.pm-item, .payment-method-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 20px 22px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 12px !important;
}
.pm-item:hover, .payment-method-card:hover {
  border-color: var(--p-green) !important;
}
.pm-item.default, .payment-method-card.default {
  border-color: var(--p-green) !important;
  background: #eef4ea !important;
}
.pm-icon, .payment-card-icon, .card-brand-icon {
  width: 48px !important; height: 32px !important;
  border-radius: 3px !important;
  background: var(--p-green) !important;
  color: var(--p-accent) !important;
  display: grid !important;
  place-items: center !important;
  font-family: var(--p-font-sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}
.pm-title, .payment-card-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--p-ink) !important;
}
.pm-sub, .payment-card-sub {
  font-size: 12px !important;
  color: var(--p-dim) !important;
  margin-top: 2px !important;
}

/* ============================================================
   INVOICE DETAIL
   ============================================================ */
.invoice-meta-strip, [class*="invoice-meta"] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: var(--p-surface) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  margin-bottom: 28px;
}
.invoice-meta-strip > div, [class*="invoice-meta"] > div {
  padding: 20px 24px !important;
  border-right: 1px solid var(--p-border) !important;
}
.invoice-meta-strip > div:last-child,
[class*="invoice-meta"] > div:last-child { border-right: none !important; }

.invoice-line-items, .invoice-lines {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 24px !important;
}
.invoice-total {
  font-family: var(--p-font-serif) !important;
  font-size: 38px !important;
  letter-spacing: -0.025em !important;
  font-weight: 400 !important;
  color: var(--p-ink) !important;
}
.invoice-commitment, .invoice-40-callout {
  padding: 16px 20px;
  background: #fef9e6;
  border-left: 3px solid var(--p-accent);
  border-radius: 0 4px 4px 0;
  margin: 20px 0;
  font-size: 13px;
  color: #5c4918;
  line-height: 1.55;
}
.invoice-commitment strong, .invoice-40-callout strong { color: var(--p-green); }

/* ============================================================
   MESSAGES / CHAT
   ============================================================ */
.chat-container, [class*="chat-window"], .message-list {
  background: var(--p-cream) !important;
}
.chat-thread, .message-thread {
  background: var(--p-surface) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 20px !important;
}
.chat-thread-item, .thread-item {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--p-border-2) !important;
  cursor: pointer;
  transition: background 0.15s ease;
}
.chat-thread-item:hover, .thread-item:hover {
  background: var(--p-cream-2) !important;
  margin: 0 -20px;
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.chat-thread-item.active, .thread-item.active {
  background: var(--p-cream-2) !important;
  border-left: 3px solid var(--p-green);
  margin: 0 -20px;
  padding-left: 17px !important;
  padding-right: 20px !important;
}
.chat-input-wrap, .message-input-wrap {
  background: var(--p-cream) !important;
  border-top: 1px solid var(--p-border) !important;
  padding: 16px !important;
}
.chat-send-btn {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border-radius: 999px !important;
}

/* ============================================================
   EVENTS LIST / QUOTES LIST
   ============================================================ */
.event-card, .quote-card, .support-ticket-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 20px 24px !important;
  margin-bottom: 12px !important;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.event-card:hover, .quote-card:hover, .support-ticket-card:hover {
  border-color: var(--p-green) !important;
  transform: translateY(-1px);
}
.event-date, .quote-date, .ticket-date {
  font-size: 11px !important;
  color: var(--p-green) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
}
.event-title, .quote-title, .ticket-title {
  font-family: var(--p-font-serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
  color: var(--p-ink) !important;
  margin: 6px 0 !important;
}

/* ============================================================
   ONBOARDING STEPPER
   ============================================================ */
.onboarding-step, .step-progress, [class*="stepper"] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 20px 0;
  overflow-x: auto;
}
.onboarding-step > div, .step-progress > div, [class*="stepper"] > * {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
}
.step-num, .step-number, .stepper-num {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--p-border) !important;
  background: transparent !important;
  color: var(--p-dim) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-family: var(--p-font-sans) !important;
}
.step-num.done, .step-number.done, .stepper-num.done,
[class*="step"].done .step-num {
  background: var(--p-green) !important;
  color: var(--p-cream) !important;
  border-color: var(--p-green) !important;
}
.step-num.current, .step-number.current, .stepper-num.current,
[class*="step"].current .step-num, [class*="step"].active .step-num {
  border-color: var(--p-green) !important;
  color: var(--p-green) !important;
  background: #eef4ea !important;
}

/* ============================================================
   NEWS / INTELLIGENCE FEED
   ============================================================ */
.news-card, .intel-card, [class*="feed-item"], .news-item {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 20px 24px !important;
  margin-bottom: 12px !important;
}
.news-title, .intel-title, .feed-title {
  font-family: var(--p-font-serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: var(--p-ink) !important;
  margin-bottom: 8px !important;
}
.news-meta, .intel-meta, .feed-meta {
  font-size: 11px !important;
  color: var(--p-dim) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

/* ============================================================
   QUOTE BUILDER / EVENT BOOK FORMS
   ============================================================ */
.qb-step-indicator, .booking-step-indicator {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 20px 0;
  margin-bottom: 32px;
}
.qb-step-indicator > div, .booking-step-indicator > div {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--p-border);
  transition: all 0.2s ease;
}
.qb-step-indicator > div.active,
.booking-step-indicator > div.active {
  width: 24px; border-radius: 4px;
  background: var(--p-green);
}
.qb-question, .booking-question {
  font-family: var(--p-font-serif) !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  letter-spacing: -0.025em !important;
  color: var(--p-ink) !important;
  line-height: 1.05 !important;
  margin-bottom: 12px !important;
}
.qb-question em { color: var(--p-green) !important; font-style: italic; }

/* ============================================================
   HOSTING PAGES (portal)
   ============================================================ */
.hosting-service-card, .hosting-site-card {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 20px 22px !important;
  margin-bottom: 12px !important;
}
.hosting-status-indicator {
  width: 8px; height: 8px; border-radius: 50%;
}
.hosting-status-indicator.online { background: var(--p-green); }
.hosting-status-indicator.offline { background: var(--p-red); }

/* ============================================================
   CONTRACTS / DOCUMENTS LIST
   ============================================================ */
.contract-item, .document-item {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  padding: 16px 20px !important;
  margin-bottom: 8px !important;
  display: flex; align-items: center; gap: 14px;
}
.contract-item .file-icon, .document-item .doc-icon {
  width: 36px !important; height: 36px !important;
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 3px !important;
  color: var(--p-green) !important;
}

/* ============================================================
   NOTIFICATIONS DRAWER (Institute — slide-in from right)
   ============================================================ */
.notif-drawer-scrim {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(14,31,23,0.22);
  opacity: 0; visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.notif-drawer-scrim.open { opacity: 1; visibility: visible; }

.notif-drawer-ii {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 420px; max-width: calc(100vw - 40px);
  background: var(--p-cream);
  border-left: 1px solid var(--p-border);
  box-shadow: -24px 0 60px rgba(0,0,0,0.22);
  display: flex; flex-direction: column;
  z-index: 10001;
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: var(--p-font-sans);
}
.notif-drawer-ii.open { transform: translateX(0); }

.notif-drawer-head {
  padding: 22px 26px 18px;
  border-bottom: 1px solid var(--p-border);
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
}
.notif-drawer-eyebrow {
  font-size: 11px; color: var(--p-green);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.notif-drawer-eyebrow::before { content: "— "; }
.notif-drawer-title {
  font-family: var(--p-font-serif); font-size: 30px;
  letter-spacing: -0.02em; margin-top: 4px;
  color: var(--p-ink); font-weight: 400; line-height: 1;
}
.notif-drawer-sub {
  font-size: 12px; color: var(--p-dim); margin-top: 6px;
}
.notif-drawer-close {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--p-cream-2); border: none;
  color: var(--p-dim); cursor: pointer;
  display: grid; place-items: center;
  font-size: 14px; flex-shrink: 0;
  transition: background 0.15s, color 0.15s;
}
.notif-drawer-close:hover { background: var(--p-border); color: var(--p-ink); }

.notif-drawer-tabs {
  padding: 8px 12px;
  border-bottom: 1px solid var(--p-border);
  display: flex; gap: 4px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.notif-drawer-tabs::-webkit-scrollbar { height: 0; }
.notif-drawer-tab {
  padding: 8px 14px; border-radius: 3px;
  border: none; background: transparent;
  font-family: var(--p-font-sans); font-size: 12px;
  color: var(--p-dim); font-weight: 500;
  cursor: pointer; white-space: nowrap;
  transition: background 0.15s, color 0.15s;
}
.notif-drawer-tab:hover { color: var(--p-ink); }
.notif-drawer-tab.active {
  background: var(--p-green); color: var(--p-cream); font-weight: 600;
}

.notif-drawer-list {
  flex: 1; overflow-y: auto;
  padding: 0 0 24px;
}
.notif-drawer-day {
  padding: 16px 26px 6px;
  font-size: 10px; color: var(--p-dim);
  letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
}
.notif-drawer-item {
  padding: 14px 26px;
  border-top: 1px solid var(--p-border-2);
  position: relative;
}
.notif-drawer-item.needs {
  background: #faf3dd;
}
.notif-drawer-item.needs::before {
  content: ""; position: absolute; top: 20px; left: 14px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--p-red);
}
.notif-drawer-item-head {
  display: flex; align-items: baseline; gap: 10px;
  margin-bottom: 4px;
}
.notif-drawer-who {
  font-size: 12.5px; font-weight: 600; color: var(--p-ink);
}
.notif-drawer-role {
  font-size: 10.5px; color: var(--p-dim);
}
.notif-drawer-item-title {
  font-family: var(--p-font-serif); font-size: 17px;
  color: var(--p-ink); letter-spacing: -0.01em;
  line-height: 1.25; margin-top: 2px;
}
.notif-drawer-item-body {
  font-size: 12.5px; color: var(--p-muted);
  margin-top: 4px; line-height: 1.55;
}

.notif-drawer-foot {
  padding: 14px 20px;
  border-top: 1px solid var(--p-border);
  background: var(--p-surface);
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
}
.notif-drawer-mark {
  background: transparent; border: none;
  font-family: var(--p-font-sans); font-size: 12px;
  color: var(--p-dim); cursor: pointer;
  padding: 4px 8px; border-radius: 3px;
  transition: color 0.15s, background 0.15s;
}
.notif-drawer-mark:hover { color: var(--p-ink); background: var(--p-cream-2); }

/* Mobile */
@media (max-width: 600px) {
  .notif-drawer-ii { width: 100%; max-width: 100%; }
}

/* ppill variants used inside drawer items */
.ppill {
  display: inline-block; font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 999px;
  border: 1px solid transparent;
}
.ppill-info { background: var(--p-cream-2); color: var(--p-ink); border-color: var(--p-border); }
.ppill-good { background: #e1e9e0; color: var(--p-green); border-color: #b8ccbc; }
.ppill-gold { background: #f5e6a8; color: #6b551a; border-color: #d9bf66; }

/* ============================================================
   ADVOCACY CONTRIBUTION LEDGER (statements page)
   ============================================================ */
.advocacy-ledger { margin: 0 0 28px; }
.adv-ledger-hero {
  background: var(--p-green);
  color: var(--p-cream);
  border-radius: 4px;
  padding: 28px 28px 24px;
  position: relative;
  overflow: hidden;
}
.adv-ledger-hero::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--p-accent) 50%, transparent 100%);
  opacity: 0.6;
}
.adv-ledger-eyebrow {
  font-size: 11px;
  color: var(--p-accent);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 18px;
}
.adv-ledger-eyebrow::before { content: "— "; }
.adv-ledger-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid #2f513e;
  border-bottom: 1px solid #2f513e;
}
.adv-ledger-cell {
  padding: 20px 22px;
  border-right: 1px solid #2f513e;
}
.adv-ledger-cell:last-child { border-right: none; }
.adv-ledger-cell-accent {
  background: rgba(232, 197, 71, 0.08);
}
.adv-ledger-key {
  font-size: 10.5px;
  color: #c9d7cd;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 500;
}
.adv-ledger-val {
  font-family: var(--p-font-serif);
  font-size: 38px;
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1;
  margin-top: 8px;
  color: var(--p-cream);
}
.adv-ledger-cell-accent .adv-ledger-val { color: var(--p-accent); }
.adv-ledger-sub {
  font-size: 11px;
  color: #c9d7cd;
  margin-top: 6px;
  font-style: italic;
}
.adv-ledger-cell-accent .adv-ledger-sub { color: #d9bf66; }
.adv-ledger-body {
  font-size: 13px;
  color: #c9d7cd;
  line-height: 1.6;
  margin-top: 18px;
  max-width: 640px;
}
.adv-ledger-body strong { color: var(--p-accent); font-weight: 600; }
@media (max-width: 900px) {
  .adv-ledger-grid { grid-template-columns: 1fr; }
  .adv-ledger-cell {
    border-right: none;
    border-bottom: 1px solid #2f513e;
  }
  .adv-ledger-cell:last-child { border-bottom: none; }
  .adv-ledger-val { font-size: 32px; }
}

/* ============================================================
   QUICK ACTIONS (dashboard) — Institute icon cards
   ============================================================ */
.dash-actions, .dash-actions-grid, [class*="quick-actions"],
[id*="quickAction"], .quick-actions-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
}
.dash-action, .dash-action-btn, .dash-quick-action,
[class*="quick-action"]:not([class*="quick-actions"]) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 4px !important;
  color: var(--p-ink) !important;
  font-family: var(--p-font-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: border-color 0.15s ease, transform 0.15s ease, background 0.15s ease !important;
  width: auto !important;
  box-sizing: border-box !important;
  min-height: 52px !important;
  line-height: 1.3 !important;
}
.dash-action:hover, .dash-action-btn:hover, .dash-quick-action:hover {
  border-color: var(--p-green) !important;
  background: var(--p-surface) !important;
  transform: translateY(-1px);
  color: var(--p-green) !important;
}

/* Emoji-wrapper span (legacy) used by dashboard.html */
.dash-action-emoji {
  width: 34px !important;
  height: 34px !important;
  border-radius: 4px !important;
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
  font-size: 0 !important;           /* hide any stray emoji character */
  color: var(--p-green) !important;  /* for SVG currentColor */
}
.dash-action-emoji svg {
  width: 18px !important;
  height: 18px !important;
  stroke: var(--p-green) !important;
  color: var(--p-green) !important;
  display: block;
  opacity: 0.95;
}
.dash-action-btn:hover .dash-action-emoji {
  background: var(--p-green) !important;
  border-color: var(--p-green) !important;
}
.dash-action-btn:hover .dash-action-emoji svg {
  stroke: var(--p-accent) !important;
  color: var(--p-accent) !important;
}

/* Generic action-icon wrappers (other layouts) */
.dash-action-icon, .quick-action-icon, [class*="action-icon"] {
  width: 36px !important;
  height: 36px !important;
  border-radius: 4px !important;
  background: var(--p-cream-2) !important;
  border: 1px solid var(--p-border) !important;
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
}
.dash-action-icon svg, .quick-action-icon svg, [class*="action-icon"] svg {
  stroke: var(--p-green) !important;
  color: var(--p-green) !important;
  width: 18px !important;
  height: 18px !important;
}
.dash-action svg:not(.dash-action-icon svg),
.dash-action-btn > svg,
.dash-quick-action > svg {
  width: 18px !important;
  height: 18px !important;
  stroke: var(--p-green) !important;
  color: var(--p-green) !important;
  flex-shrink: 0;
  opacity: 0.95;
}

/* Generic modal polish */
.modal-content, [class*="modal-content"], .modal-dialog > div:not(.modal-backdrop) {
  background: var(--p-cream) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 6px !important;
  box-shadow: 0 30px 80px rgba(0,0,0,0.35) !important;
}
.modal-header, [class*="modal-header"] {
  border-bottom: 1px solid var(--p-border) !important;
  padding: 22px 26px 18px !important;
}
.modal-title, [class*="modal-title"] {
  font-family: var(--p-font-serif) !important;
  font-size: 26px !important; letter-spacing: -0.02em !important;
  font-weight: 400 !important;
}
.modal-body, [class*="modal-body"] { padding: 22px 26px !important; }
.modal-footer, [class*="modal-footer"] {
  background: var(--p-surface) !important;
  border-top: 1px solid var(--p-border) !important;
  padding: 16px 26px 22px !important;
}