/* ==========================================================================
   LEETFX JOURNAL — 3D DASHBOARD HERO, EQUITY CURVE, DISCIPLINE PULSE
   Member Badge 3D + Mistake Radar Light Mode Fix
   ========================================================================== */

/* --- 1. MEMBER BADGE / SIDEBAR CARD 3D --- */
.member-card {
  position: relative !important;
  padding: 18px 16px 16px !important;
  margin: 18px 0 !important;
  border-radius: 14px !important;
  background: radial-gradient(circle at 80% 20%, rgba(212,167,72,0.18), transparent 55%), linear-gradient(145deg, #1a2138, #0e1422) !important;
  border: 1px solid rgba(216,175,89,0.5) !important;
  box-shadow: 0 20px 40px -8px rgba(0,0,0,0.7), 0 0 0 1px rgba(216,175,89,0.2), inset 0 1px 0 rgba(255,255,255,0.15), 0 0 30px rgba(212,167,72,0.12) !important;
  transform: perspective(600px) translateZ(4px) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  overflow: hidden !important;
}
.member-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #d4a748, transparent);
  border-radius: 14px 14px 0 0;
}
.member-card:hover {
  transform: perspective(600px) translateZ(8px) translateY(-2px) !important;
  box-shadow: 0 28px 52px -8px rgba(0,0,0,0.8), 0 0 40px rgba(212,167,72,0.2), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}
.member-card strong {
  display: block !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  margin-bottom: 4px !important;
  text-shadow: 0 0 20px rgba(212,167,72,0.35) !important;
  line-height: 1.2 !important;
}
html[data-theme="light"] .member-card strong {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  text-shadow: none !important;
}
.member-card small { font: 600 10px var(--mono, monospace) !important; color: #8fa0c0 !important; }

/* --- 2. 3D WELCOME BACK HERO --- */
.journal-hero {
  position: relative !important;
  padding: 40px 44px !important;
  border-radius: 24px !important;
  background: radial-gradient(ellipse at 80% 0%, rgba(212,167,72,0.14) 0%, transparent 50%),
              radial-gradient(ellipse at 0% 100%, rgba(100,80,200,0.08) 0%, transparent 50%),
              linear-gradient(145deg, #141c2e, #0b0f1a) !important;
  border: 1px solid rgba(216,175,89,0.3) !important;
  box-shadow: 0 30px 60px -12px rgba(0,0,0,0.8), 0 0 0 1px rgba(255,255,255,0.05), inset 0 1px 0 rgba(255,255,255,0.1) !important;
  margin-bottom: 30px !important;
  overflow: hidden !important;
}
.journal-hero::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,167,72,0.6) 40%, rgba(212,167,72,0.3) 100%);
  pointer-events: none;
}
/* Hero Left Column */
.hero-left {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Professional Status Bar */
.hero-status-bar {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
  padding: 6px 14px;
  background: rgba(212,167,72,0.08);
  border: 1px solid rgba(212,167,72,0.22);
  border-radius: 999px;
  width: fit-content;
}
.hero-live-pip {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 8px #22c55e, 0 0 16px rgba(34,197,94,0.4);
  animation: pip-beat 2s infinite;
  flex-shrink: 0;
}
@keyframes pip-beat {
  0%,100%{opacity:1;box-shadow:0 0 8px #22c55e,0 0 16px rgba(34,197,94,0.4)}
  50%{opacity:0.6;box-shadow:0 0 4px #22c55e}
}
.hero-session-label {
  font: 700 10px var(--mono, monospace);
  letter-spacing: 0.14em;
  color: #d4a748;
}
.hero-divider {
  width: 1px;
  height: 12px;
  background: rgba(212,167,72,0.3);
}
.hero-status-active {
  font: 800 9px var(--mono, monospace);
  letter-spacing: 0.12em;
  color: #22c55e;
}

/* Hero H1 — clear, no blur */
.journal-hero h1 {
  font-size: clamp(40px, 5vw, 68px) !important;
  letter-spacing: -0.05em !important;
  line-height: 1 !important;
  margin: 0 0 14px 0 !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

/* Name — solid gold glow, NO gradient clip (avoids blur) */
.journal-hero h1 em {
  font-family: var(--serif, 'Playfair Display', serif) !important;
  font-style: italic !important;
  font-weight: 700 !important;
  color: #e8b84b !important;
  -webkit-text-fill-color: #e8b84b !important;
  text-shadow: 0 0 30px rgba(232,184,75,0.4), 0 2px 0 rgba(0,0,0,0.3) !important;
  display: inline !important;
}

.hero-copy { color: #8fa3bf !important; font-size: 13px !important; margin: 0 !important; line-height: 1.6 !important; }
.daily-quote {
  max-width: 560px !important; margin: 14px 0 0 !important;
  padding: 10px 14px !important;
  border-left: 2px solid rgba(212,167,72,0.5) !important;
  border-radius: 0 6px 6px 0 !important;
  background: rgba(212,167,72,0.06) !important;
  color: #c4a97d !important;
  font: 500 12px var(--serif, 'Playfair Display', serif) !important;
  font-style: italic !important;
}
.account-picker {
  position: relative !important; min-width: 240px !important;
  padding: 20px 22px !important;
  background: rgba(10,14,26,0.75) !important;
  border: 1px solid rgba(216,175,89,0.4) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
.account-edit {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  margin-top: 12px !important; padding: 8px 14px !important;
  background: linear-gradient(145deg, #1c2638, #111825) !important;
  border: 1px solid rgba(216,175,89,0.35) !important; border-radius: 8px !important;
  color: #d4a748 !important; font: 700 10px var(--mono, monospace) !important;
  cursor: pointer !important;
  box-shadow: 0 3px 0 #0a0f1b, 0 6px 12px rgba(0,0,0,0.35) !important;
  transition: all 0.15s ease !important;
}
.account-edit:hover { transform: translateY(-2px) !important; border-color: #d4a748 !important; box-shadow: 0 5px 0 #0a0f1b, 0 10px 18px rgba(212,167,72,0.2) !important; }
.account-edit:active { transform: translateY(1px) !important; box-shadow: 0 1px 0 #0a0f1b !important; }

/* --- 3. 3D EQUITY CURVE PANEL --- */
.equity-panel {
  position: relative !important;
  background: radial-gradient(ellipse at 90% 0%, rgba(200,250,64,0.07), transparent 50%), linear-gradient(145deg, #0f1928, #070c14) !important;
  border: 1px solid rgba(200,250,64,0.2) !important;
  border-radius: 20px !important; padding: 26px !important;
  box-shadow: 0 24px 48px -8px rgba(0,0,0,0.75), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  transform: perspective(900px) translateZ(0) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  overflow: hidden !important;
}
.equity-panel::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,250,64,0.5), transparent);
}
.equity-panel:hover { transform: perspective(900px) translateZ(4px) translateY(-3px) !important; box-shadow: 0 32px 60px -8px rgba(0,0,0,0.9), 0 0 30px rgba(200,250,64,0.1), inset 0 1px 0 rgba(255,255,255,0.1) !important; }
.equity-panel .panel-head h2 { color: #fff !important; font-size: 18px !important; }
.period-tabs {
  display: flex !important; gap: 4px !important;
  background: rgba(0,0,0,0.35) !important; padding: 3px !important;
  border-radius: 8px !important; border: 1px solid rgba(255,255,255,0.08) !important;
}
.period-tabs button {
  border: 0 !important; background: transparent !important; color: #64748b !important;
  font: 700 9px var(--mono, monospace) !important; padding: 6px 10px !important;
  cursor: pointer !important; border-radius: 6px !important; transition: all 0.15s ease !important;
}
.period-tabs button.selected,.period-tabs button:hover { background: rgba(200,250,64,0.15) !important; color: #c8fa40 !important; }
.chart-summary strong { font-size: 30px !important; font-weight: 800 !important; color: #fff !important; text-shadow: 0 0 20px rgba(200,250,64,0.2) !important; }
#equityChart { height: 200px !important; width: 100% !important; margin-top: 14px !important; filter: drop-shadow(0 4px 12px rgba(200,250,64,0.15)) !important; }

/* --- 4. 3D DISCIPLINE PULSE PANEL --- */
.discipline-panel {
  position: relative !important;
  background: radial-gradient(ellipse at 10% 80%, rgba(120,80,220,0.1), transparent 50%), radial-gradient(ellipse at 90% 20%, rgba(212,167,72,0.08), transparent 45%), linear-gradient(145deg, #111828, #070b15) !important;
  border: 1px solid rgba(120,80,220,0.3) !important;
  border-radius: 20px !important; padding: 26px !important;
  box-shadow: 0 24px 48px -8px rgba(0,0,0,0.75), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  transform: perspective(900px) translateZ(0) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  overflow: hidden !important;
}
.discipline-panel::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(120,80,220,0.6), rgba(212,167,72,0.3), transparent);
}
.discipline-panel:hover { transform: perspective(900px) translateZ(4px) translateY(-3px) !important; box-shadow: 0 32px 60px -8px rgba(0,0,0,0.9), 0 0 28px rgba(120,80,220,0.15), inset 0 1px 0 rgba(255,255,255,0.1) !important; }
.discipline-panel .panel-head > b {
  font: 800 28px var(--mono, monospace) !important;
  background: linear-gradient(135deg, #c8fa40, #a3e635) !important;
  -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  filter: drop-shadow(0 0 8px rgba(200,250,64,0.4)) !important;
}
.pulse-row {
  display: grid !important;
  grid-template-columns: 110px 1fr 36px !important;
  align-items: center !important; gap: 12px !important;
  margin-top: 22px !important;
  font: 700 10px var(--sans, sans-serif) !important; color: #94a3b8 !important;
}
.pulse-row i { display: block !important; height: 8px !important; border-radius: 999px !important; background: #1a1f33 !important; overflow: hidden !important; box-shadow: inset 0 2px 4px rgba(0,0,0,0.5) !important; }
.pulse-row i b { display: block !important; height: 100% !important; border-radius: 999px !important; background: linear-gradient(90deg, #7850dc, #a78bfa, #c8fa40) !important; box-shadow: 0 0 10px rgba(167,139,250,0.5) !important; transition: width 0.6s cubic-bezier(0.16,1,0.3,1) !important; }
.pulse-row strong { font: 800 10px var(--mono, monospace) !important; color: #fff !important; text-align: right !important; }

/* --- 5. METRIC CARDS 3D --- */
.metric-card {
  position: relative !important; padding: 22px !important; border-radius: 16px !important;
  background: radial-gradient(circle at 100% 0%, rgba(212,167,72,0.06), transparent 40%), linear-gradient(145deg, #131826, #0c1020) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 16px 36px -6px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.07) !important;
  transform: perspective(700px) translateZ(0) !important;
  transition: transform 0.22s cubic-bezier(0.16,1,0.3,1), box-shadow 0.22s ease !important;
  overflow: hidden !important;
}
.metric-card::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent); pointer-events: none; }
.metric-card:hover { transform: perspective(700px) translateY(-4px) rotateX(1.5deg) !important; border-color: rgba(216,175,89,0.3) !important; box-shadow: 0 24px 48px -6px rgba(0,0,0,0.8), 0 0 20px rgba(212,167,72,0.12), inset 0 1px 0 rgba(255,255,255,0.1) !important; }
.metric-card.positive { border-color: rgba(200,250,64,0.2) !important; }
.metric-card.positive strong { color: #c8fa40 !important; text-shadow: 0 0 16px rgba(200,250,64,0.3) !important; }
.metric-card.total-r-card { border-color: rgba(212,167,72,0.3) !important; }

/* --- LONG/SHORT SIDE 3D PILL BUTTONS (Dark & Light Mode) --- */
.side {
  font: 800 10px var(--mono, monospace) !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  letter-spacing: 0.1em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  text-transform: uppercase !important;
  user-select: none !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}
.side:hover {
  transform: translateY(-1px) scale(1.05) !important;
}
.side.long {
  background: linear-gradient(135deg, rgba(34,197,94,0.22), rgba(16,185,129,0.12)) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(74,222,128,0.5) !important;
  box-shadow: 0 0 14px rgba(74,222,128,0.25), 0 2px 6px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}
.side.long::before {
  content: '▲';
  font-size: 8px;
  color: #4ade80;
  filter: drop-shadow(0 0 3px #4ade80);
}
.side.short {
  background: linear-gradient(135deg, rgba(239,68,68,0.22), rgba(244,63,94,0.12)) !important;
  color: #f87171 !important;
  border: 1px solid rgba(248,113,113,0.5) !important;
  box-shadow: 0 0 14px rgba(248,113,113,0.25), 0 2px 6px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}
.side.short::before {
  content: '▼';
  font-size: 8px;
  color: #f87171;
  filter: drop-shadow(0 0 3px #f87171);
}

/* --- 6. MISTAKE RADAR LIGHT MODE FIX --- */
html[data-theme="light"] .mistake-bar-meter { background: #fee2e2 !important; }
html[data-theme="light"] .mistake-bar-meter .meter-fill { background: linear-gradient(90deg, #dc2626, #f87171) !important; box-shadow: 0 0 8px rgba(220,38,38,0.3) !important; }
html[data-theme="light"] .mistake-freq { color: #64748b !important; }
html[data-theme="light"] .clean-discipline-card { background: linear-gradient(145deg, #f0fdf4, #dcfce7) !important; border-color: #86efac !important; }
html[data-theme="light"] .clean-discipline-card strong { color: #15803d !important; }
html[data-theme="light"] .clean-discipline-card p { color: #166534 !important; }
html[data-theme="light"] .panel-subtitle { color: #475569 !important; }
html[data-theme="light"] .coaching-insight-box { background: #f0f7ff !important; border-color: #bae6fd !important; }
html[data-theme="light"] .coaching-insight-box p { color: #0369a1 !important; }

/* --- 7. LIGHT MODE — HERO, MEMBER, METRICS, PANELS --- */
html[data-theme="light"] .journal-hero { background: radial-gradient(ellipse at 80% 0%, rgba(212,167,72,0.12) 0%, transparent 50%), linear-gradient(145deg, #ffffff, #f4f6fb) !important; border-color: rgba(180,133,44,0.3) !important; box-shadow: 0 24px 48px rgba(0,0,0,0.07), inset 0 1px 0 rgba(255,255,255,0.9) !important; }
html[data-theme="light"] .journal-hero h1 { color: #0f172a !important; text-shadow: none !important; }
html[data-theme="light"] .journal-hero h1 em { color: #b45309 !important; -webkit-text-fill-color: #b45309 !important; text-shadow: 0 0 20px rgba(180,83,9,0.15), 0 1px 0 rgba(0,0,0,0.05) !important; }
html[data-theme="light"] .hero-status-bar { background: rgba(180,133,44,0.08) !important; border-color: rgba(180,133,44,0.25) !important; }
html[data-theme="light"] .hero-session-label { color: #92400e !important; }
html[data-theme="light"] .hero-copy { color: #475569 !important; }
html[data-theme="light"] .daily-quote { color: #78530a !important; background: rgba(180,133,44,0.06) !important; border-color: rgba(180,133,44,0.4) !important; }
html[data-theme="light"] .account-picker { background: rgba(248,250,252,0.9) !important; border-color: rgba(180,133,44,0.35) !important; box-shadow: 0 12px 28px rgba(0,0,0,0.06) !important; }
html[data-theme="light"] .account-edit { background: linear-gradient(145deg, #fff, #f1f5f9) !important; border-color: rgba(180,133,44,0.4) !important; color: #92400e !important; box-shadow: 0 3px 0 #e2e8f0 !important; }
html[data-theme="light"] .member-card { background: radial-gradient(circle at 80% 20%, rgba(180,133,44,0.1), transparent 55%), linear-gradient(145deg, #ffffff, #f1f5f9) !important; border-color: rgba(180,133,44,0.4) !important; box-shadow: 0 12px 28px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,1) !important; }
html[data-theme="light"] .member-card strong,
html[data-theme="light"] .member-card #sidebarName,
html[data-theme="light"] #sidebarName.trader-name,
html[data-theme="light"] .trader-name { color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; text-shadow: none !important; }
html[data-theme="light"] .member-card span:first-child { color: #85580e !important; }
html[data-theme="light"] .member-card small { color: #64748b !important; }
html[data-theme="light"] .member-card .trader-id { background: #fef3c7 !important; color: #92400e !important; border-color: #d97706 !important; box-shadow: none !important; }
html[data-theme="light"] #dashboardName.trader-name { color: #583d08 !important; -webkit-text-fill-color: #583d08 !important; }

/* Light mode — LONG/SHORT side badges in trade records table */
html[data-theme="light"] .side.long {
  background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%) !important;
  color: #14532d !important;
  border: 1px solid #4ade80 !important;
  box-shadow: 0 2px 0 #22c55e, 0 4px 10px rgba(34,197,94,0.18), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] .side.long::before {
  content: '▲';
  font-size: 8px;
  color: #15803d !important;
  filter: none !important;
}
html[data-theme="light"] .side.short {
  background: linear-gradient(135deg, #fee2e2 0%, #fecdd3 100%) !important;
  color: #881337 !important;
  border: 1px solid #f87171 !important;
  box-shadow: 0 2px 0 #ef4444, 0 4px 10px rgba(239,68,68,0.18), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] .side.short::before {
  content: '▼';
  font-size: 8px;
  color: #be123c !important;
  filter: none !important;
}

/* Light mode — trade table text visibility & full contrast */
html[data-theme="light"] .trade-table-wrap {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.05), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] .trade-table-wrap table {
  background: #ffffff !important;
}
html[data-theme="light"] th {
  color: #475569 !important;
  font-weight: 800 !important;
  background: #f8fafc !important;
  border-bottom: 2px solid #e2e8f0 !important;
}
html[data-theme="light"] td {
  color: #1e293b !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 13px !important;
}
html[data-theme="light"] td b {
  color: #0f172a !important;
  font-weight: 800 !important;
}
html[data-theme="light"] td small {
  color: #64748b !important;
  font-weight: 600 !important;
}
html[data-theme="light"] .trade-table-wrap td:first-child b {
  color: #0f172a !important;
}
html[data-theme="light"] .lot-value {
  background: #fef3c7 !important;
  color: #854d0e !important;
  border: 1px solid #d97706 !important;
  font-weight: 800 !important;
}
html[data-theme="light"] .commission-value {
  display: inline-flex !important;
  align-items: center !important;
  padding: 5px 8px !important;
  border-radius: 6px !important;
  background: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #cbd5e1 !important;
  font: 700 11px var(--mono, monospace) !important;
}
html[data-theme="light"] #tradeSearch {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
html[data-theme="light"] #tradeSearch::placeholder {
  color: #94a3b8 !important;
}
html[data-theme="light"] #resultFilter {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
html[data-theme="light"] #resultFilter option {
  background: #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] .sheet-hint {
  color: #475569 !important;
  font-weight: 500 !important;
}
html[data-theme="light"] .empty-message,
html[data-theme="light"] #emptyTrades {
  color: #64748b !important;
  font-weight: 600 !important;
}
html[data-theme="light"] .edit-trade {
  background: linear-gradient(135deg, #f3e8ff, #e9d5ff) !important;
  color: #6b21a8 !important;
  border: 1px solid #c084fc !important;
  box-shadow: 0 2px 0 #a855f7 !important;
}
html[data-theme="light"] .delete-trade {
  background: linear-gradient(135deg, #fee2e2, #fecdd3) !important;
  color: #9f1239 !important;
  border: 1px solid #fca5a5 !important;
  box-shadow: 0 2px 0 #f43f5e !important;
}
html[data-theme="light"] .table-actions .edit-trade:hover {
  filter: brightness(0.95) !important;
}
html[data-theme="light"] .table-actions .delete-trade:hover {
  filter: brightness(0.95) !important;
}
html[data-theme="light"] .metric-card { background: linear-gradient(145deg, #ffffff, #f8fafc) !important; border-color: #e2e8f0 !important; box-shadow: 0 8px 24px rgba(0,0,0,0.06) !important; }
html[data-theme="light"] .metric-card:hover { border-color: rgba(180,133,44,0.35) !important; }
html[data-theme="light"] .metric-card strong { color: #0f172a !important; }
html[data-theme="light"] .metric-card.positive { background: linear-gradient(145deg, #f0fdf4, #dcfce7) !important; border-color: rgba(21,128,61,0.25) !important; }
html[data-theme="light"] .metric-card.positive strong { color: #15803d !important; text-shadow: none !important; }
html[data-theme="light"] .metric-card.total-r-card { background: linear-gradient(145deg, #fffbeb, #fef3c7) !important; border-color: rgba(180,133,44,0.3) !important; }
html[data-theme="light"] .metric-card span { color: #64748b !important; }
html[data-theme="light"] .metric-card small { color: #475569 !important; }
html[data-theme="light"] .equity-panel { background: linear-gradient(145deg, #ffffff, #f8fafc) !important; border-color: rgba(21,128,61,0.2) !important; box-shadow: 0 14px 32px rgba(0,0,0,0.06) !important; }
html[data-theme="light"] .chart-summary strong { color: #0f172a !important; text-shadow: none !important; }
html[data-theme="light"] .period-tabs { background: #f1f5f9 !important; border-color: #e2e8f0 !important; }
html[data-theme="light"] .period-tabs button { color: #64748b !important; }
html[data-theme="light"] .period-tabs button.selected, html[data-theme="light"] .period-tabs button:hover { background: #dcfce7 !important; color: #15803d !important; }
html[data-theme="light"] .discipline-panel { background: linear-gradient(145deg, #ffffff, #f5f0ff) !important; border-color: rgba(120,80,220,0.2) !important; box-shadow: 0 14px 32px rgba(0,0,0,0.06) !important; }
html[data-theme="light"] .discipline-panel .panel-head > b { background: linear-gradient(135deg, #16a34a, #22c55e) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; filter: none !important; }
html[data-theme="light"] .pulse-row { color: #475569 !important; }
html[data-theme="light"] .pulse-row i { background: #e2e8f0 !important; box-shadow: inset 0 1px 2px rgba(0,0,0,0.08) !important; }
html[data-theme="light"] .pulse-row i b { background: linear-gradient(90deg, #7c3aed, #8b5cf6, #22c55e) !important; box-shadow: none !important; }
html[data-theme="light"] .pulse-row strong { color: #0f172a !important; }
html[data-theme="light"] .panel-note { color: #64748b !important; }
html[data-theme="light"] .panel-head h2 { color: #0f172a !important; }