/* ══════════════════════════════════════════════════════════════════
   INNER ATLAS — REDESIGN LAYER (v3)
   Loaded after design-system.css on every authenticated screen.
   The language: night, paper, ink, moonlight.
   Surfaces are quiet. Typography carries the hierarchy.
   Discovery is marked in moonlight, never in neon.
   ══════════════════════════════════════════════════════════════════ */

/* ── Tokens ── */
:root {
  --ia-night: #0B0A13;
  --ia-night-2: #0E0C1A;
  --ia-paper: #EDE8DC;
  --ia-paper-dim: rgba(237, 232, 220, 0.64);
  --ia-paper-faint: rgba(237, 232, 220, 0.38);
  --ia-moon: #D8CCA4;
  --ia-moon-soft: rgba(216, 204, 166, 0.55);
  --ia-ink-line: rgba(237, 232, 220, 0.09);
  --ia-ink-line-strong: rgba(237, 232, 220, 0.18);
  --ia-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --ia-sans: 'Mulish', -apple-system, 'Segoe UI', Arial, sans-serif;
  --ia-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* Retune the shared palette away from neon violet toward moonlight */
  --ice: #EDE8DC;
  --white: #EFEAE0;
  --text: #CCC6B8;
  --text-dim: #948E7E;
  --text-faint: #655F50;
}

/* ── Atmosphere: the page is a place, not a canvas ── */
body {
  background:
    radial-gradient(120% 55% at 50% -8%, rgba(64, 54, 32, 0.22) 0%, rgba(11, 10, 19, 0) 60%),
    radial-gradient(90% 40% at 50% 108%, rgba(120, 100, 60, 0.07) 0%, rgba(11, 10, 19, 0) 55%),
    var(--ia-night) !important;
}

::selection { background: rgba(216, 204, 166, 0.28); color: #F5F1E6; }
::-webkit-scrollbar-thumb { background: rgba(237, 232, 220, 0.14); background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: rgba(237, 232, 220, 0.26); background-clip: content-box; }

/* ── Top bar: nearly invisible until needed ── */
.nav {
  background: linear-gradient(180deg, rgba(11, 10, 19, 0.72), rgba(11, 10, 19, 0.35) 80%, rgba(11, 10, 19, 0)) !important;
  border-bottom: 1px solid rgba(237, 232, 220, 0.05) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.nav-logo-text {
  font-family: var(--ia-serif) !important;
  letter-spacing: 0.04em !important;
}

/* ── The main column breathes ── */
.app-main {
  padding-top: 2.5rem !important;
  padding-bottom: calc(130px + env(safe-area-inset-bottom, 0px)) !important;
}
.app-main section + section { margin-top: 4.5rem; }
@media (max-width: 640px) {
  .app-main section + section { margin-top: 3.4rem; }
}

/* ── Editorial type hierarchy ── */
h1, h2, h3 { font-family: var(--ia-serif); }

.section-eyebrow,
.weekly-label,
.atlas-milestone-chapter {
  font-family: var(--ia-sans) !important;
  font-size: 0.62rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.32em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon-soft) !important;
}

.section-title {
  font-family: var(--ia-serif) !important;
  font-size: 1.55rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.005em !important;
  color: var(--ia-paper) !important;
}

.section-header a,
.section-link {
  font-size: 0.68rem !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ia-paper-faint) !important;
  transition: color 0.5s var(--ia-ease);
}
.section-header a:hover,
.section-link:hover { color: var(--ia-moon) !important; }

/* Tier markers: quiet rules that name the terrain */
.atlas-tier-marker {
  display: flex !important;
  align-items: center;
  gap: 1.4rem;
  margin: 0 0 2.2rem !important;
}
.atlas-tier-marker::before,
.atlas-tier-marker::after {
  content: '';
  height: 1px;
  flex: 1;
  background: linear-gradient(90deg, transparent, var(--ia-ink-line-strong), transparent);
}
.atlas-tier-marker::after { background: linear-gradient(90deg, var(--ia-ink-line-strong), transparent); }
.atlas-tier-name {
  font-family: var(--ia-sans) !important;
  font-size: 0.66rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.42em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-dim) !important;
}

/* ── Home hero: the emotional focal point ── */
.home-hero { padding: 1.6rem 0 0.6rem; }
.home-greeting {
  font-family: var(--ia-serif) !important;
  font-size: clamp(2.3rem, 6vw, 3.4rem) !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.01em !important;
  color: var(--ia-paper) !important;
}
.home-greeting-question {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  font-size: clamp(1.05rem, 2.6vw, 1.3rem) !important;
  color: var(--ia-moon-soft) !important;
  opacity: 1 !important;
  margin-top: 0.7rem !important;
}
.moon-phase { opacity: 0.85; }
.moon-phase-name {
  font-family: var(--ia-sans) !important;
  font-size: 0.62rem !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
}

/* ── Surfaces, not cards: quiet rooms with hairline edges ── */
.card,
.card-glass,
.stat-card,
.capture-flow-card,
.weekly-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.01)) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 6px !important;
  box-shadow: 0 24px 60px rgba(3, 2, 8, 0.35) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color 0.7s var(--ia-ease), box-shadow 0.7s var(--ia-ease) !important;
}
@media (hover: hover) {
  .card:hover, .card-glass:hover, .stat-card:hover, .capture-flow-card:hover {
    border-color: var(--ia-ink-line-strong) !important;
    box-shadow: 0 28px 70px rgba(3, 2, 8, 0.45) !important;
  }
}

/* ── Buttons: letterpress, not candy ── */
.btn {
  border-radius: 3px !important;
  font-family: var(--ia-sans) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  padding: 0.9rem 1.7rem !important;
  transition: all 0.55s var(--ia-ease) !important;
}
.btn-primary {
  background: var(--ia-paper) !important;
  color: #16131F !important;
  border: 1px solid var(--ia-paper) !important;
  box-shadow: 0 10px 34px rgba(237, 232, 220, 0.10) !important;
}
.btn-primary:hover {
  background: #FBF8F0 !important;
  box-shadow: 0 14px 44px rgba(237, 232, 220, 0.18) !important;
  transform: translateY(-1px);
}
.btn-ghost {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line-strong) !important;
  color: var(--ia-paper-dim) !important;
}
.btn-ghost:hover { border-color: var(--ia-moon-soft) !important; color: var(--ia-paper) !important; }
.cta-btn-ivory { box-shadow: 0 10px 34px rgba(237, 232, 220, 0.10) !important; }

/* ── Capture: the notebook moment ── */
.capture-actions { gap: 0.9rem; }
.capture-btn {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.008)) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 6px !important;
  transition: border-color 0.6s var(--ia-ease), transform 0.6s var(--ia-ease) !important;
}
.capture-btn:hover { border-color: var(--ia-moon-soft) !important; transform: translateY(-2px); }
.capture-btn-title {
  font-family: var(--ia-serif) !important;
  font-size: 1.25rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
}
.capture-btn-sub {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}
.capture-btn-icon {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line-strong);
  border-radius: 50% !important;
  color: var(--ia-moon) !important;
}

/* Dream writing feels like a page, not a form */
.capture-flow-card textarea,
.onboarding-dream-input {
  font-family: var(--ia-serif) !important;
  font-size: 1.22rem !important;
  line-height: 1.75 !important;
  color: var(--ia-paper) !important;
  background: rgba(255, 255, 255, 0.015) !important;
  border: 1px solid transparent !important;
  border-bottom: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  padding: 1.1rem 0.4rem !important;
  transition: border-color 0.6s var(--ia-ease) !important;
}
.capture-flow-card textarea:focus,
.onboarding-dream-input:focus {
  border-bottom-color: var(--ia-moon-soft) !important;
  box-shadow: none !important;
  outline: none !important;
}
.capture-flow-card textarea::placeholder,
.onboarding-dream-input::placeholder {
  font-style: italic;
  color: var(--ia-paper-faint) !important;
}

/* ── Form fields: quiet rules ── */
input[type="text"], input[type="email"], input[type="search"], input[type="password"],
input[type="number"], input[type="date"], textarea, select {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 4px !important;
  color: var(--ia-paper) !important;
  transition: border-color 0.5s var(--ia-ease) !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--ia-moon-soft) !important;
  box-shadow: none !important;
}
input::placeholder, textarea::placeholder { color: var(--ia-paper-faint) !important; }

/* ── Insights: discoveries, not analysis ── */
.insights-section {
  background: none !important;
  border: none !important;
  padding: 0 !important;
}
.ai-observation {
  background: none !important;
  border: none !important;
  border-left: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  padding: 0.4rem 0 0.4rem 1.6rem !important;
}
.ai-obs-label {
  font-family: var(--ia-sans) !important;
  font-size: 0.62rem !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon-soft) !important;
}
.ai-obs-text {
  font-family: var(--ia-serif) !important;
  font-size: clamp(1.35rem, 3.4vw, 1.75rem) !important;
  font-weight: 500 !important;
  font-style: italic !important;
  line-height: 1.45 !important;
  color: var(--ia-paper) !important;
  margin: 0.8rem 0 1rem !important;
}
.ai-obs-cta {
  font-family: var(--ia-sans) !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon) !important;
}
.ai-obs-cta:hover { color: #EFE4BC !important; }
.ai-obs-prompt {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}

/* ── Symbol & emotion threads ── */
.themes-chips { gap: 0.6rem; }
.themes-chips .chip,
.themes-chips > * {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 3px !important;
  font-family: var(--ia-sans) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-dim) !important;
  transition: all 0.5s var(--ia-ease) !important;
}
.themes-chips .chip:hover,
.themes-chips > *:hover {
  border-color: var(--ia-moon-soft) !important;
  color: var(--ia-paper) !important;
}

/* ── Tabs: quiet inked selectors ── */
.ia-tabs { gap: 2rem; border-bottom: 1px solid var(--ia-ink-line); }
.ia-tab {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: var(--ia-sans) !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-faint) !important;
  padding: 0.8rem 0.2rem !important;
  position: relative;
}
.ia-tab.active { color: var(--ia-paper) !important; }
.ia-tab.active::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: var(--ia-moon);
}

/* ── Empty states: the Atlas speaks ── */
.empty-state,
.dp-empty,
.atlas-empty,
.soul-empty {
  background: none !important;
  border: none !important;
  text-align: center !important;
  padding: 4.5rem 1.5rem !important;
}
.empty-state-icon {
  background: transparent !important;
  border: none !important;
  width: auto !important; height: auto !important;
  margin-bottom: 1.4rem !important;
  animation: iaBreathe 7s ease-in-out infinite !important;
}
.empty-state-icon svg { width: 34px; height: 34px; stroke: var(--ia-moon-soft) !important; }
.empty-state h3,
.dp-empty-line,
.atlas-empty h3 {
  font-family: var(--ia-serif) !important;
  font-size: 1.6rem !important;
  font-weight: 500 !important;
  font-style: italic !important;
  color: var(--ia-paper) !important;
}
.empty-state p,
.dp-empty-sub {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}
@keyframes iaBreathe {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.06); }
}

/* ── Loading: a slow gathering, not a spinner spin ── */
.loading-state {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
  padding: 3.5rem 1rem !important;
}
.spinner {
  border-color: var(--ia-ink-line-strong) !important;
  border-top-color: var(--ia-moon) !important;
  animation-duration: 1.6s !important;
}

/* ── Motion: slow, intentional, atmospheric ── */
.view-fade-in {
  animation: iaRise 1.15s var(--ia-ease) both !important;
}
@keyframes iaRise {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.atlas-tier > .view-fade-in:nth-child(2) { animation-delay: 0.08s; }
.atlas-tier > .view-fade-in:nth-child(3) { animation-delay: 0.16s; }
.atlas-tier > .view-fade-in:nth-child(4) { animation-delay: 0.24s; }

@media (hover: hover) {
  .recent-dreams-section .card,
  .last-dream-section .card,
  #recentDreams > * { transition: transform 0.7s var(--ia-ease), border-color 0.7s var(--ia-ease); }
  #recentDreams > *:hover { transform: translateY(-3px); }
}

/* ── Bottom navigation: a ledge of four words ── */
.app-bottom-nav {
  background: linear-gradient(180deg, rgba(11, 10, 19, 0.55) 0%, rgba(11, 10, 19, 0.94) 45%) !important;
  border-top: 1px solid rgba(237, 232, 220, 0.06) !important;
  backdrop-filter: blur(24px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.2) !important;
}
.bottom-nav-item {
  font-family: var(--ia-sans) !important;
  font-size: 0.58rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.26em !important;
  text-transform: uppercase !important;
  color: rgba(237, 232, 220, 0.36) !important;
  transition: color 0.5s var(--ia-ease) !important;
}
.bottom-nav-item svg { opacity: 0.75; transition: opacity 0.5s var(--ia-ease); }
.bottom-nav-item.active { color: var(--ia-paper) !important; }
.bottom-nav-item.active svg { opacity: 1; }
.bottom-nav-item.active::before {
  width: 14px !important;
  height: 1px !important;
  background: var(--ia-moon) !important;
  box-shadow: none !important;
}

/* ── Meta Dream banner: an invitation, set apart ── */
.meta-dream-banner {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  margin: 2rem 0;
  padding: 1.3rem 1.4rem;
  border-radius: 6px;
  border: 1px solid rgba(216, 204, 166, 0.22);
  background: linear-gradient(115deg, rgba(216, 204, 166, 0.06), rgba(11, 10, 19, 0.35) 62%);
  text-decoration: none;
  transition: border-color 0.7s var(--ia-ease), box-shadow 0.7s var(--ia-ease);
}
.meta-dream-banner:hover {
  border-color: rgba(216, 204, 166, 0.45);
  box-shadow: 0 0 44px rgba(216, 204, 166, 0.08);
}
.meta-dream-banner-orb {
  flex-shrink: 0;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 32%, rgba(240, 232, 205, 0.95), rgba(216, 204, 166, 0.4) 48%, rgba(20, 17, 30, 0.9) 80%);
  box-shadow: 0 0 26px rgba(216, 204, 166, 0.35);
}
.meta-dream-banner-eyebrow {
  font-family: var(--ia-sans);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ia-moon-soft);
  margin-bottom: 0.3rem;
}
.meta-dream-banner-title {
  font-family: var(--ia-serif);
  font-size: 1.15rem;
  color: var(--ia-paper);
  line-height: 1.35;
}
.meta-dream-banner-sub {
  font-family: var(--ia-serif);
  font-style: italic;
  font-size: 0.82rem;
  color: var(--ia-paper-faint);
  margin-top: 0.2rem;
}
.meta-dream-banner-arrow { flex-shrink: 0; color: var(--ia-moon-soft); font-size: 1.1rem; }

/* ── Toast: a note slipped under the door ── */
.toast {
  background: rgba(20, 17, 28, 0.92) !important;
  border: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 4px !important;
  color: var(--ia-paper) !important;
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  font-size: 0.95rem !important;
  backdrop-filter: blur(16px);
}

/* ── Hairlines everywhere ── */
hr { border: 0; border-top: 1px solid var(--ia-ink-line) !important; }

/* ── Focus ring in moonlight ── */
a:focus-visible, .btn:focus-visible, .card:focus-visible, .bottom-nav-item:focus-visible {
  outline: 1px solid var(--ia-moon-soft);
  outline-offset: 3px;
}

/* ── Mobile: first-class, thumb-first ── */
@media (max-width: 640px) {
  .app-main { padding-left: 1.15rem !important; padding-right: 1.15rem !important; }
  .home-hero { padding-top: 0.8rem; }
  .capture-actions { flex-direction: column; }
  .capture-btn { min-height: 76px; }
  .meta-dream-banner { padding: 1.1rem 1.15rem; }
  .atlas-tier-marker { margin-bottom: 1.7rem !important; }
  .ai-observation { padding-left: 1.1rem !important; }
}

/* ── Dream capture: the notebook moment, page by page ── */
.dreams-header h1 {
  font-family: var(--ia-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(2.1rem, 5.5vw, 2.9rem) !important;
  letter-spacing: -0.01em !important;
  color: var(--ia-paper) !important;
}
.capture-flow-header { text-align: left !important; }
.capture-flow-orb { display: none !important; }
.capture-flow-title {
  font-family: var(--ia-serif) !important;
  font-size: clamp(1.7rem, 4.5vw, 2.2rem) !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  color: var(--ia-paper) !important;
}
.capture-flow-sub {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-moon-soft) !important;
}
.capture-method-intro {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}
.capture-method-card {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 6px !important;
  transition: border-color 0.6s var(--ia-ease), background 0.6s var(--ia-ease) !important;
}
.capture-method-card:hover, .capture-method-card.active {
  border-color: var(--ia-moon-soft) !important;
  background: rgba(216, 204, 166, 0.04) !important;
}
.capture-method-title {
  font-family: var(--ia-serif) !important;
  font-size: 1.15rem !important;
  font-weight: 500 !important;
  color: var(--ia-paper) !important;
}
.capture-method-sub {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}
.capture-method-icon { color: var(--ia-moon) !important; background: transparent !important; border: 1px solid var(--ia-ink-line-strong) !important; }
.capture-method-icon-mic { color: var(--ia-moon) !important; }
.capture-progress-dot {
  width: 5px !important; height: 5px !important;
  background: var(--ia-ink-line-strong) !important;
  box-shadow: none !important;
}
.capture-progress-dot.active { background: var(--ia-moon) !important; }
.capture-progress-line { background: var(--ia-ink-line) !important; }
.capture-input-hint {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}
.dream-desc-header label {
  font-family: var(--ia-sans) !important;
  font-size: 0.62rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon-soft) !important;
}
.voice-capture-btn {
  border: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 3px !important;
  background: transparent !important;
  color: var(--ia-moon) !important;
}

/* ── Home widgets: quieter instruments ── */
.streak-badge, .mood-weather {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
}
.icon-btn {
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--ia-paper-faint) !important;
  transition: all 0.5s var(--ia-ease) !important;
}
.icon-btn:hover { border-color: var(--ia-moon-soft) !important; color: var(--ia-paper) !important; }
.gx-hint {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
  text-align: center !important;
}
.dp-intro {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-dim) !important;
}

/* Milestones & discoveries read like field notes */
.atlas-milestone, .atlas-discoveries {
  background: none !important;
  border: none !important;
  border-left: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  padding-left: 1.4rem !important;
}
.atlas-milestone-title {
  font-family: var(--ia-serif) !important;
  font-size: 1.3rem !important;
  font-weight: 500 !important;
  color: var(--ia-paper) !important;
}
.atlas-milestone-desc {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-dim) !important;
}

/* Mood chips: quiet signals */
.quick-mood-chips .mood-chip,
.quick-mood-chips > * {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 3px !important;
  font-family: var(--ia-sans) !important;
  letter-spacing: 0.1em !important;
  transition: all 0.5s var(--ia-ease) !important;
}
.quick-mood-chips .mood-chip:hover,
.quick-mood-chips > *:hover { border-color: var(--ia-moon-soft) !important; }

/* Generic card headings fall into the editorial voice */
.app-main .card h3, .app-main .card h4, .card-glass h3, .card-glass h4 {
  font-family: var(--ia-serif) !important;
  font-weight: 500 !important;
}

/* ── Page titles across the app ── */
.app-main h1 {
  font-family: var(--ia-serif) !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  color: var(--ia-paper) !important;
}

/* ── Insights / Patterns: discoveries, field notes ── */
.insight-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.006)) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 6px !important;
}
.map-section-title {
  font-family: var(--ia-serif) !important;
  font-size: 1.35rem !important;
  font-weight: 500 !important;
  color: var(--ia-paper) !important;
}
.map-section-sub {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-paper-faint) !important;
}

/* Stats: a quiet ledger line, not a dashboard grid */
.grid-4 { gap: 0 !important; }
.stat-card {
  background: none !important;
  border: none !important;
  border-top: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  padding: 1.1rem 1.2rem 0 0 !important;
}
.stat-card:hover { transform: none !important; }
.stat-number {
  font-family: var(--ia-serif) !important;
  font-size: 2rem !important;
  font-weight: 500 !important;
  color: var(--ia-paper) !important;
}
.stat-label {
  font-family: var(--ia-sans) !important;
  font-size: 0.6rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-faint) !important;
}

/* View toggles (Reflection page) */
.view-btn {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 3px !important;
  font-family: var(--ia-sans) !important;
  font-size: 0.66rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-dim) !important;
  transition: all 0.5s var(--ia-ease) !important;
}
.view-btn:hover, .view-btn.active { border-color: var(--ia-moon-soft) !important; color: var(--ia-paper) !important; }

/* ── Dream entry: tags become quiet inscriptions ── */
.tag, .symbol-tag {
  background: transparent !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 3px !important;
  font-family: var(--ia-sans) !important;
  font-size: 0.66rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--ia-paper-dim) !important;
  box-shadow: none !important;
}
.symbol-tag {
  border-color: rgba(216, 204, 166, 0.32) !important;
  color: var(--ia-moon) !important;
}

/* Atlas's voice inside an entry: a margin note, not a chat bubble */
.ai-card {
  background: none !important;
  border: none !important;
  border-left: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.ai-name {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  font-size: 1.05rem !important;
  color: var(--ia-paper) !important;
}
.ai-subtitle {
  font-family: var(--ia-sans) !important;
  font-size: 0.6rem !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon-soft) !important;
}
.ai-section-title {
  font-family: var(--ia-sans) !important;
  font-size: 0.62rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: var(--ia-moon-soft) !important;
}
.dream-card-premium-question {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  color: var(--ia-moon-soft) !important;
}

/* ── Atlas quicklinks: the map's own table of contents ── */
.scm-quicklinks { display: flex; align-items: center; gap: 1.3rem; flex-wrap: wrap; }
.scm-quicklinks a {
  font-family: var(--ia-sans);
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ia-paper-faint);
  text-decoration: none;
  transition: color 0.5s var(--ia-ease);
}
.scm-quicklinks a:hover { color: var(--ia-moon); }

/* Profile: a quiet word beside Sign Out */
.nav-profile-link {
  font-family: var(--ia-sans);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ia-paper-faint);
  text-decoration: none;
  margin-right: 0.9rem;
  transition: color 0.5s var(--ia-ease);
}
.nav-profile-link:hover { color: var(--ia-moon); }

/* Companion empty state joins the brand voice */
.ask-empty-state { background: none !important; }
.ask-empty-state h3 {
  font-family: var(--ia-serif) !important;
  font-style: italic !important;
  font-weight: 500 !important;
  color: var(--ia-paper) !important;
}

/* ── The Companion: margin notes across the table, not chat bubbles ── */
.chat-bubble {
  background: rgba(255, 255, 255, 0.025) !important;
  border: 1px solid var(--ia-ink-line) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  font-family: var(--ia-serif) !important;
  font-size: 1.02rem !important;
  line-height: 1.7 !important;
}
.chat-bubble.ai {
  background: none !important;
  border: none !important;
  border-left: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 0 !important;
  padding-left: 1.2rem !important;
}
.chat-bubble.user {
  border-color: var(--ia-ink-line-strong) !important;
  color: var(--ia-paper) !important;
}
.chat-input-row input {
  font-family: var(--ia-serif) !important;
  font-size: 1.05rem !important;
}
.chat-send-btn {
  border: 1px solid var(--ia-ink-line-strong) !important;
  border-radius: 3px !important;
  background: transparent !important;
  color: var(--ia-moon) !important;
  transition: all 0.5s var(--ia-ease) !important;
}
.chat-send-btn:hover { border-color: var(--ia-moon-soft) !important; }

/* ── Honor stillness when asked ── */
@media (prefers-reduced-motion: reduce) {
  .view-fade-in, .empty-state-icon { animation: none !important; transition: none !important; }
}