
/* ═══ base.html ═══ */

body.plain-mode {
  overflow: auto !important;
}

body.plain-mode html,
body.plain-mode body {
  height: auto !important;
}

body.plain-mode .crt-noise,
body.plain-mode .crt-curvature,
body.plain-mode .scanline,
body.plain-mode .corner-tl,
body.plain-mode .corner-tr,
body.plain-mode .corner-bl,
body.plain-mode .corner-br,
body.plain-mode .edge-left,
body.plain-mode .edge-right {
  display: none !important;
}

body.plain-mode *,
body.plain-mode *::before,
body.plain-mode *::after {
  animation: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  font-family: 'Georgia', 'Times New Roman', serif !important;
  letter-spacing: 0 !important;
}

body.plain-mode .pip-screen {
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: #f5f5f0 !important;
  color: #1a1a2e !important;
}

body.plain-mode .pip-header {
  background: #1a1a2e !important;
  border-bottom: 3px solid #8b0000 !important;
 /* padding: 1rem 2rem !important; */
}

body.plain-mode .pip-logo {
  color: #ffffff !important;
  font-family: 'Georgia', serif !important;
  font-size: 1.1rem !important;
  letter-spacing: 0.05em !important;
}

body.plain-mode .pip-nav a {
  color: #cccccc !important;
  border: none !important;
  font-family: 'Georgia', serif !important;
  font-size: 0.85rem !important;
}

body.plain-mode .pip-nav a:hover {
  color: #ffffff;
  background: rgba(139,0,0,0.4);
  border-color: transparent;
}

body.plain-mode .pip-nav a.active {
  color: #ffffff !important;
  background: rgba(139,0,0,0.4) !important;
  border-color: transparent !important;
}

@media (hover: none) {
  body.plain-mode .pip-nav a:hover {
    color: inherit;
    background: transparent;
    border-color: transparent;
  }
}

body.plain-mode .pip-sysbar {
  display: none !important;
}

body.plain-mode .pip-main {
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 2.5rem 2rem !important;
  background: #f5f5f0 !important;
  color: #1a1a2e !important;
}

body.plain-mode .pip-panel {
  background: #ffffff !important;
  border: none !important;
  border-left: 4px solid #8b0000 !important;
  border-radius: 0 !important;
  padding: 1.5rem 2rem !important;
  margin-bottom: 2rem !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
  color: #1a1a2e !important;
}

body.plain-mode .pip-panel::before,
body.plain-mode .pip-panel::after {
  display: none !important;
}

body.plain-mode .pip-heading {
  font-family: 'Georgia', serif !important;
  font-size: 1rem !important;
  font-weight: bold !important;
  color: #8b0000 !important;
  letter-spacing: 0.05em !important;
  border-bottom: 1px solid #cccccc !important;
  padding-bottom: 0.5rem !important;
  margin-bottom: 1rem !important;
  text-transform: uppercase !important;
}

body.plain-mode .pip-heading::before {
  display: none !important;
}

body.plain-mode p,
body.plain-mode span,
body.plain-mode div,
body.plain-mode td,
body.plain-mode th,
body.plain-mode li {
  color: #2c2c2c !important;
  font-family: 'Georgia', serif !important;
  line-height: 1.8 !important;
}

body.plain-mode h1,
body.plain-mode h2,
body.plain-mode h3 {
  color: #1a1a2e !important;
  font-family: 'Georgia', serif !important;
}

body.plain-mode a {
  color: #8b0000 !important;
  text-decoration: underline !important;
}

body.plain-mode .pip-btn {
  font-family: 'Georgia', serif !important;
  background: white !important;
  color: black !important;
  border: 1px solid  #8b0000 !important;
  border-radius: 2px !important;
  padding: 0.5rem 1.2rem !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.03em !important;
  cursor: pointer !important;
}

body.plain-mode .pip-btn:hover {
  background: #8b0000 !important;
  color: #ffffff !important;
}

body.plain-mode .pip-btn-danger {
  background: #8b0000 !important;
  color: #ffffff !important;
}

/* Score display */
body.plain-mode .score-number {
  font-family: 'Georgia', serif !important;
  color: #1a1a2e !important;
  font-size: clamp(4rem, 15vw, 8rem) !important;
}

body.plain-mode .score-level {
  font-family: 'Georgia', serif !important;
  font-size: 1.2rem !important;
  border: 2px solid #8b0000 !important;
  color: #8b0000 !important;
  padding: 0.3rem 1rem !important;
}

body.plain-mode .score-denom {
  color: #666666 !important;
  font-family: 'Georgia', serif !important;
}

body.plain-mode .score-label {
  font-family: 'Georgia', serif !important;
  color: #666666 !important;
  letter-spacing: 0.1em !important;
  font-size: 0.9rem !important;
}

/* Risk bar */
body.plain-mode .risk-bar-track {
  background: #e0e0e0 !important;
  border: 1px solid #cccccc !important;
}

body.plain-mode .risk-bar-fill {
  background: #8b0000 !important;
}

/* Model cards */
body.plain-mode .model-card {
  background: #f9f9f9 !important;
  border: 1px solid #dddddd !important;
  border-radius: 2px !important;
}

body.plain-mode .model-name {
  color: #1a1a2e !important;
  font-weight: bold !important;
  font-size: 0.8rem !important;
}

body.plain-mode .model-score {
  color: #8b0000 !important;
  font-family: 'Georgia', serif !important;
  font-size: 1.8rem !important;
}

body.plain-mode .model-reasons li {
  color: #444444 !important;
  font-size: 0.78rem !important;
  border-top-color: #eeeeee !important;
}

body.plain-mode .model-reasons li::before {
  color: #8b0000 !important;
}

/* Table */
body.plain-mode .pip-table th {
  background: #1a1a2e !important;
  color: #ffffff !important;
  font-family: 'Georgia', serif !important;
  font-size: 0.8rem !important;
  border-bottom: 2px solid #8b0000 !important;
}

body.plain-mode .pip-table td {
  color: #2c2c2c !important;
  border-bottom-color: #eeeeee !important;
}

body.plain-mode .pip-table tr:hover td {
  background: #f0f0ee !important;
}

body.plain-mode .level-badge {
  border-color: #8b0000 !important;
  color: #8b0000 !important;
}

/* Meta row */
body.plain-mode .meta-row .item-label {
  color: #888888 !important;
  font-size: 0.7rem !important;
}

body.plain-mode .meta-row .item-value {
  color: #1a1a2e !important;
  font-weight: bold !important;
}

/* Disagreement */
body.plain-mode .disagreement-explanation {
  border-left: 3px solid #8b0000 !important;
  color: #2c2c2c !important;
  font-style: italic !important;
}

body.plain-mode .disagreement-number {
  color: #8b0000 !important;
  font-family: 'Georgia', serif !important;
}

/* Chart toggle buttons */
body.plain-mode .chart-toggle button {
  font-family: 'Georgia', serif !important;
  background: #f0f0ee !important;
  color: #1a1a2e !important;
  border: 1px solid #cccccc !important;
  border-radius: 2px !important;
}

body.plain-mode .chart-toggle button.active {
  background: #1a1a2e !important;
  color: #ffffff !important;
  border-color: #1a1a2e !important;
}



/* Footer */
body.plain-mode .pip-footer {
  background: #1a1a2e !important;
  border-top: 3px solid #8b0000 !important;
  color: #aaaaaa !important;
  padding: 1rem 2rem !important;
  font-size: 0.78rem !important;
}

body.plain-mode .pip-footer span,
body.plain-mode .pip-footer div {
  color: #aaaaaa !important;
  font-family: 'Georgia', serif !important;
}

/* Cookie banner */
body.plain-mode #cookie-banner {
  background: #1a1a2e !important;
  border-top: 2px solid #8b0000 !important;
  color: #cccccc !important;
}



body.plain-mode #cookie-banner span {
  color: green !important;
}

body.plain-mode #cookie-banner a {
  color: #ccc !important;
}


/* Scrollbar in plain mode */
body.plain-mode .pip-screen::-webkit-scrollbar-track { background: #f0f0ee !important; }
body.plain-mode .pip-screen::-webkit-scrollbar-thumb { background: #8b0000 !important; border: none !important; }
body.plain-mode .pip-screen::-webkit-scrollbar-thumb:hover { background: #1a1a2e !important; }

/* Fix scroll + remove CRT leftovers */

/* ═══ ACADEMIC MODE (FINAL FIX) ═══ */

/* 1. Restore normal page scrolling */
body.plain-mode {
  overflow-y: auto !important;
}

/* CRITICAL: override the global lock */
html.plain-mode,
body.plain-mode {
  height: auto !important;
  overflow: auto !important;
}

/* 2. Disable pip-screen as scroll container */
body.plain-mode .pip-screen {
  height: auto !important;
  overflow: visible !important;
}

/* 3. REMOVE CRT overlays (this was causing visual lines) */
body.plain-mode::before,
body.plain-mode::after {
  display: none !important;
  content: none !important;
}

/* remove ALL visual FX layers */
body.plain-mode .crt-noise,
body.plain-mode .crt-curvature,
body.plain-mode .scanline,
body.plain-mode .corner-tl,
body.plain-mode .corner-tr,
body.plain-mode .corner-bl,
body.plain-mode .corner-br,
body.plain-mode .edge-left,
body.plain-mode .edge-right {
  display: none !important;
}

/* 4. Kill animations & glow */
body.plain-mode *,
body.plain-mode *::before,
body.plain-mode *::after {
  animation: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* 5. Optional: force visible scrollbar (important on WebKit) */
body.plain-mode::-webkit-scrollbar {
  width: 12px;
}

body.plain-mode::-webkit-scrollbar-track {
  background: #f0f0ee;
}

body.plain-mode::-webkit-scrollbar-thumb {
  background: #8b0000;
}

body.plain-mode::-webkit-scrollbar-thumb:hover {
  background: #1a1a2e;
}

/* Firefox */
body.plain-mode {
  scrollbar-width: auto;
  scrollbar-color: #8b0000 #f0f0ee;
}





/* home.html */
body.plain-mode .score-label {
  color: #666 !important;
  letter-spacing: 0.1em !important;
  font-size: 0.9rem !important;
}

body.plain-mode .score-number {
  color: #1a1a2e !important;
  text-shadow: none !important;
}

body.plain-mode .score-denom {
  color: #666 !important;
}

body.plain-mode .score-level {
  border: 2px solid #8b0000 !important;
  color: #8b0000 !important;
  letter-spacing: 0.1em !important;
}

body.plain-mode .change-indicator {
  font-family: Georgia, serif !important;
}

body.plain-mode .change-up { color: #8b0000 !important; }
body.plain-mode .change-down { color: #1a1a2e !important; }
body.plain-mode .change-stable { color: #888 !important; }

body.plain-mode .risk-bar-track {
  background: #e5e5e5 !important;
  border: 1px solid #ccc !important;
}

body.plain-mode .risk-bar-fill {
  background: #8b0000 !important;
  box-shadow: none !important;
}

body.plain-mode .risk-bar-ticks {
  color: #888 !important;
}

body.plain-mode .meta-row {
  color: #666 !important;
}

body.plain-mode .meta-row .item-value {
  color: #1a1a2e !important;
}

/* Model cards */
body.plain-mode .model-card {
  background: #fafafa !important;
  border: 1px solid #ddd !important;
}

body.plain-mode .model-name {
  color: #1a1a2e !important;
}

body.plain-mode .model-country {
  color: #888 !important;
}

body.plain-mode .model-score {
  color: #8b0000 !important;
  text-shadow: none !important;
}

body.plain-mode .model-reasons li {
  color: #444 !important;
  border-top: 1px solid #eee !important;
}

/* Disagreement */
body.plain-mode .disagreement-number {
  color: #8b0000 !important;
}

body.plain-mode .disagreement-label-text {
  color: #1a1a2e !important;
}

body.plain-mode .disagreement-sub {
  color: #888 !important;
}

body.plain-mode .disclaimer {
  color: #999 !important;
}

/* Disable animations */
body.plain-mode .anim-in {
  animation: none !important;
}




/* ═══ donate.html ═══ */

body.plain-mode .faq-item {
  border-bottom: 1px solid #ddd !important;
}

body.plain-mode .faq-q {
  color: #1a1a2e !important;
  text-shadow: none !important;
}

body.plain-mode .faq-q::before {
  color: #8b0000 !important;
}

body.plain-mode .faq-a {
  color: #444 !important;
}

body.plain-mode .faq-counter {
  color: #999 !important;
}



body.plain-mode .pip-input {
  font-family: 'Georgia', serif !important;
  color: #1a1a2e !important;
  background: #ffffff !important;
  border: 1px solid #ccc !important;
  letter-spacing: 0.02em !important;
}
body.plain-mode .pip-input option {
  background: #ffffff !important;
  color: #1a1a2e !important;
}



body.plain-mode .pip-input:focus {
  border-color: #8b0000 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(139,0,0,0.12) !important;
}


