@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;0,9..144,700;1,9..144,400;1,9..144,600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --cp-paper: #f6f1e7;
  --cp-card: #fbf8f1;
  --cp-ink: #211e18;
  --cp-ink-soft: #6f685a;
  --cp-hairline: rgba(33, 30, 24, 0.14);
  --cp-oxblood: #7a2e2e;
}

/* ---- Warm paper field instead of cool white ---- */
body.fi-body,
.fi-layout,
.fi-main-ctn,
.fi-main,
.fi-sidebar,
.fi-topbar,
.fi-topbar > nav,
.fi-sidebar-header {
  background-color: var(--cp-paper) !important;
}
.fi-body { color: var(--cp-ink); }

/* ---- Hairline rules + square corners instead of shadow-cards ---- */
.fi-section,
.fi-wi-stats-overview-stat,
.fi-ta-ctn,
.fi-dropdown-panel,
.fi-modal-window {
  box-shadow: none !important;
  border-radius: 3px !important;
  border: 1px solid var(--cp-hairline) !important;
  background-color: var(--cp-card) !important;
}
.fi-btn, .fi-input, .fi-input-wrp, .fi-select-input, .fi-badge {
  border-radius: 3px !important;
  box-shadow: none !important;
}

/* ---- Serif (Fraunces) for headings, titles, section headers ---- */
.fi-header-heading,
.fi-section-header-heading,
.fi-modal-heading,
.fi-ta-empty-state-heading,
h1.fi-header-heading {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em;
  color: var(--cp-ink);
}

/* ---- Sidebar as a contents page: small-caps section labels, hairline dividers ---- */
.fi-sidebar-group-label {
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  text-transform: uppercase;
  letter-spacing: 0.16em !important;
  font-size: 0.66rem !important;
  font-weight: 500 !important;
  color: var(--cp-ink-soft) !important;
}
.fi-sidebar-group { border-top: 1px solid var(--cp-hairline); padding-top: 0.5rem; }
.fi-sidebar-group:first-of-type { border-top: 0; }
.fi-sidebar-item-label { color: var(--cp-ink); }

/* ---- Citation apparatus + metadata in mono ---- */
.cp-cite, .cp-mono {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.82em;
  color: var(--cp-ink-soft);
  letter-spacing: -0.01em;
}

/* ---- Quote display utility ---- */
.cp-quote {
  font-family: 'Fraunces', Georgia, serif;
  color: var(--cp-ink);
  line-height: 1.3;
}

/* ---- Restrained motion: ink-like fades, no bounce ---- */
.fi-sidebar-item, .fi-btn, .fi-wi-stats-overview-stat {
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

/* ---- Drop cap for the featured quote ---- */
.cp-dropcap::first-letter {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 600;
  font-size: 2.1em;
  line-height: 1;
  padding-right: 0.06em;
  color: var(--cp-oxblood);
}
/* Hide the default page heading on the desk (eyebrow replaces it) */
.cp-desk-page .fi-header { display: none; }

/* Reading view: suppress default page header, custom apparatus leads */
.cp-reading-page .fi-header { display: none; }
.cp-reading-page em { font-style: italic; }

/* ---- Floating panels keep a soft shadow + clear paper card (shadow only removed from INLINE cards) ---- */
.fi-dropdown-panel,
.fi-global-search-results-ctn,
.fi-modal-window {
  background: var(--cp-card) !important;
  border: 1px solid var(--cp-hairline) !important;
  border-radius: 4px !important;
  box-shadow: 0 10px 30px rgba(33, 30, 24, 0.18) !important;
}
.fi-global-search-results-ctn { z-index: 50; }

/* ---- Search results as a scholarly index ---- */
.fi-global-search-result-group-header {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.6rem;
  color: var(--cp-ink-soft);
}
.fi-global-search-result-heading { color: var(--cp-ink); }
.fi-global-search-result-link:hover { background: rgba(122, 46, 46, 0.06); }
.fi-global-search-no-results-message { color: var(--cp-ink-soft); }

/* ---- "Pen" action: oxblood ink fills on hover (ink-like fade, never a glow) ---- */
.cp-pen { transition: background-color .22s ease, color .22s ease, border-color .22s ease; }
.cp-pen:hover {
  background-color: var(--cp-oxblood) !important;
  border-color: var(--cp-oxblood) !important;
  color: #f6f1e7 !important;
}
/* Ledger tiles + flag gently warm on hover (paper lifting, not bouncing) */
.cp-tile { transition: background-color .22s ease, border-color .22s ease; }
.cp-tile:hover { border-color: rgba(122,46,46,0.4) !important; background-color: #fcfaf4 !important; }

/* ---- The daily quote is a doorway into its reading view (whisper-subtle warm) ---- */
.cp-deskquote {
  border-radius: 4px;
  padding: 0.6rem 0.85rem;
  margin-left: -0.85rem;
  margin-right: -0.85rem;
  transition: background-color .25s ease;
}
.cp-deskquote:hover { background-color: rgba(122, 46, 46, 0.045); }

/* ---- Desk quote: clamp long passages to ~4 lines with a soft fade ---- */
[x-cloak] { display: none !important; }
.cp-clamp { max-height: 5.4em; overflow: hidden; }
.cp-faded { position: relative; }
.cp-faded::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2.4em;
  background: linear-gradient(to bottom, rgba(246, 241, 231, 0), var(--cp-paper));
  pointer-events: none;
}

/* Relocate the collapse control: hide the brand-adjacent chevron that looks like "back" */
.fi-sidebar-close-collapse-sidebar-btn { display: none !important; }
.cp-collapse-btn:hover { color: var(--cp-oxblood) !important; }

/* Also hide the brand-adjacent reopen chevron — the in-nav Collapse control handles both states */
.fi-sidebar-open-collapse-sidebar-btn { display: none !important; }

/* Bulletproof: the collapse control is always shown + clickable in either state */
.fi-sidebar-nav .cp-collapse-btn { display: flex !important; align-items: center; }

/* ── Reading view: themeable palette (light default · sepia night) ── */
.cp-reading-page {
  --cp-r-ink: #211e18;
  --cp-r-body: #3a352c;
  --cp-r-muted: #9a8f7d;
  --cp-r-faint: #6f685a;
  --cp-r-accent: #7a2e2e;
  --cp-r-verified: #4f6f55;
  --cp-r-hairline: var(--cp-hairline);
  --cp-r-focus-bg: #fffdf8;
  --cp-r-star-off: #d8cdb5;
}
.cp-sepia .cp-reading-page {
  --cp-r-ink: #ece2cf;
  --cp-r-body: #d6cbb6;
  --cp-r-muted: #a99e87;
  --cp-r-faint: #b0a58e;
  --cp-r-accent: #d68f80;
  --cp-r-verified: #8caa90;
  --cp-r-hairline: rgba(236,226,207,0.15);
  --cp-r-focus-bg: #2c2820;
  --cp-r-star-off: rgba(236,226,207,0.28);
  background: #232019;
}
.cp-sepia .cp-reading-page .cp-quote { color: var(--cp-r-ink); }
.cp-sepia .cp-reading-page .cp-cite { color: var(--cp-r-muted); }
.cp-sepia .cp-reading-page .cp-dropcap::first-letter { color: var(--cp-r-accent); }
.cp-sepia .fi-main:has(.cp-reading-page) { background: #232019; }

/* Highlight palette + marks */
[x-cloak] { display: none !important; }
.cp-hl-palette { display: flex; gap: 0.35rem; padding: 0.34rem 0.42rem; background: #fff;
  border: 1px solid rgba(33,30,24,0.15); border-radius: 7px; box-shadow: 0 5px 16px rgba(0,0,0,0.18); }
.cp-hl-palette button { width: 1.15rem; height: 1.15rem; border: 1px solid rgba(0,0,0,0.14);
  border-radius: 50%; cursor: pointer; padding: 0; transition: transform 0.1s ease; }
.cp-hl-palette button:hover { transform: scale(1.18); }
.cp-sepia .cp-reading-page .cp-hl-palette { background: #2c2820; border-color: rgba(236,226,207,0.22); }
.cp-hl { transition: background 0.15s ease; }

/* Highlight remove chip */
.cp-hl-remove { background: #fff; border: 1px solid rgba(33,30,24,0.18); border-radius: 6px;
  padding: 0.28rem 0.6rem; font-family: 'JetBrains Mono', monospace; font-size: 0.6rem;
  text-transform: uppercase; letter-spacing: 0.12em; color: #7a2e2e; cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,0.16); white-space: nowrap; }
.cp-hl-remove:hover { background: #fbf3f2; }
.cp-sepia .cp-hl-remove { background: #2c2820; border-color: rgba(236,226,207,0.22); color: #d68f80; }

/* Motion — a new quote settling onto the page (on Read-another / Back / load) */
@keyframes cp-rise { from { opacity: 0; } to { opacity: 1; } }
.cp-reading-page .cp-quote { animation: cp-rise 0.5s ease both; }
/* Day ↔ night cross-fade (lamp dimming, not a hard flip) */
.cp-reading-page, .fi-main:has(.cp-reading-page) { transition: background-color 0.4s ease; }
.cp-reading-page .cp-quote, .cp-reading-page .cp-cite { transition: color 0.35s ease; }

/* Touch highlight mode — phones only (tap a word to highlight) */
.cp-hl-mobile { display: none; }
@media (hover: none) and (pointer: coarse) {
  .cp-hl-mobile { display: flex; align-items: center; gap: 0.85rem; margin-bottom: 1rem; flex-wrap: wrap; }
}
.cp-hl-brush { background: none; border: 1px solid var(--cp-r-hairline); border-radius: 5px;
  padding: 0.34rem 0.65rem; cursor: pointer; font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.6rem; color: var(--cp-r-muted); }
.cp-hl-brush-on { color: var(--cp-r-accent); border-color: var(--cp-r-accent); }
.cp-sw { width: 1.5rem; height: 1.5rem; border: 1px solid rgba(0,0,0,0.14); border-radius: 50%; cursor: pointer; padding: 0; }
.cp-sw-on { box-shadow: 0 0 0 2px var(--cp-r-accent); border-color: transparent; }
.cp-hl-bar-label { font-family: 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.54rem; color: var(--cp-r-muted); }