/*
  WNL · T3 Color System — site-wide preview
  2026-09-04
  Purpose: apply the accepted airy-warm T3 colour language to existing public pages
  without changing their content, layout, routes, or functionality.
*/

:root{
  --t3-paper:#FCFAF6;
  --t3-light:#F8F5EF;
  --t3-warm-air:#F2EEE6;
  --t3-warm-soft:#EEE8DF;
  --t3-card:#F6F2EB;
  --t3-image-mist:#E9E2D8;
  --t3-line:#DED6CA;
  --t3-champagne:#C8B99A;
  --t3-sand-soft:#D6C9B5;
  --t3-ink:#37322E;
  --t3-muted:#746E67;

  /* Compatibility layer for existing public pages */
  --paper:var(--t3-paper);
  --paper2:var(--t3-light);
  --cream:var(--t3-warm-air);
  --cream2:var(--t3-warm-soft);
  --ink:var(--t3-ink);
  --muted:var(--t3-muted);
  --line:var(--t3-line);
  --gold:var(--t3-champagne);
  --gold2:var(--t3-champagne);
  --champagne:var(--t3-champagne);
  --deep:var(--t3-ink);

  --article-bg:var(--t3-paper);
  --article-text:var(--t3-ink);
  --article-muted:var(--t3-muted);
  --article-line:var(--t3-line);
  --article-accent:var(--t3-champagne);
}

html,body{background:var(--t3-paper);color:var(--t3-ink)}
::selection{background:var(--t3-sand-soft);color:var(--t3-ink)}

/* Header / global utility: light, almost paper-like. */
.site-header,
.top,
.article-header,
body>header{
  background:rgba(252,250,246,.94)!important;
  border-color:var(--t3-line)!important;
}

/* T3 interaction accent: champagne / sand, not dark bronze. */
.button,
.od-cta,
.article-actions a{
  border-color:var(--t3-champagne)!important;
}
.button.primary,
.od-cta.primary,
.article-actions a:first-child{
  background:var(--t3-champagne)!important;
  border-color:var(--t3-champagne)!important;
  color:var(--t3-ink)!important;
}
.text-link,
.media-link,
.article-back,
.article-actions a{
  border-color:var(--t3-sand-soft)!important;
}

/* --------------------------------------------------------------------------
   PERSONAL WORK / root page
   -------------------------------------------------------------------------- */
.hero{background:var(--t3-warm-air)}
.pause{background:var(--t3-light)}
.split.reverse{background:var(--t3-warm-soft)}
.mentorship{background:var(--t3-light)!important}
.orientation{background:var(--t3-warm-soft)!important}
.acquaintance{background:var(--t3-warm-air)!important}
.start{background:var(--t3-light)!important}
.after{background:var(--t3-warm-air)!important}
.author-end{background:var(--t3-warm-soft)!important}
.door,
.presence-grid article,
.start-grid article{background:var(--t3-paper)!important}
.visual-placeholder{
  background:linear-gradient(135deg,var(--t3-image-mist),var(--t3-sand-soft))!important;
  color:rgba(55,50,46,.52)!important;
}
.visual-placeholder.warm{
  background:linear-gradient(135deg,var(--t3-warm-soft),var(--t3-sand-soft))!important;
}
.fine{color:#9D948B!important}

/* --------------------------------------------------------------------------
   PODCAST
   -------------------------------------------------------------------------- */
body>header .header{color:var(--t3-ink)}
.podcast-visual figure{background:var(--t3-light)!important;border-color:var(--t3-line)!important}
.controls-wrap{background:var(--t3-paper)!important;border-color:var(--t3-line)!important}
.controls button{border-color:var(--t3-line)!important;color:var(--t3-muted)!important}
.controls button.active{border-color:var(--t3-champagne)!important;color:var(--t3-ink)!important;background:var(--t3-light)!important}
.controls input{background:var(--t3-paper)!important;border-color:var(--t3-line)!important;color:var(--t3-ink)!important}
.episode-card{background:var(--t3-light)!important;border-color:var(--t3-line)!important}
.platforms{background:var(--t3-warm-air)!important;border-color:var(--t3-line)!important}
.platform-links a{background:var(--t3-paper)!important;border-color:var(--t3-line)!important}

/* --------------------------------------------------------------------------
   TATIANA HA / AUTHOR
   -------------------------------------------------------------------------- */
.history-panel{background:var(--t3-warm-soft)!important}
.quote-band{
  background:linear-gradient(180deg,var(--t3-warm-air),var(--t3-light))!important;
  border-color:var(--t3-line)!important;
}
.year-card,
.wnl-era,
.today-quote{background:var(--t3-light)!important;border-color:var(--t3-line)!important}
.archive,
.content-note{border-color:var(--t3-line)!important}
.hero-quote{color:#8E806B!important}
.num,
.arrow,
.year-card .year{color:#A79578!important}

/* --------------------------------------------------------------------------
   BOOK · CHUVSTVOVALA LI YA
   -------------------------------------------------------------------------- */
.origin{background:var(--t3-warm-air)!important}
.fragments{background:var(--t3-light)!important}
.history{background:var(--t3-warm-soft)!important}
.light{background:linear-gradient(180deg,var(--t3-warm-air),var(--t3-paper))!important}
.video-warning{background:var(--t3-warm-soft)!important;border-color:var(--t3-champagne)!important}
.format-card{background:var(--t3-light)!important;border-color:var(--t3-line)!important}
.state{background:var(--t3-paper)!important}
.epilogue{background:var(--t3-warm-soft)!important}
.buy{background:var(--t3-warm-air)!important}
.final{background:var(--t3-light)!important}
.warning,
.archive,
.carousel-viewport,
.video-fragment{border-color:var(--t3-line)!important}
.distance{
  background:var(--t3-warm-soft)!important;
  color:var(--t3-ink)!important;
}
.distance .kicker{color:var(--t3-muted)!important}
.distance p{color:var(--t3-muted)!important}
.distance-lines{border-color:var(--t3-line)!important}
.distance-lines p{border-color:var(--t3-line)!important;color:var(--t3-ink)!important}
.light-emphasis{color:#8E806B!important}

/* --------------------------------------------------------------------------
   ARTICLE
   -------------------------------------------------------------------------- */
.article-header{background:rgba(252,250,246,.96)!important}
.article-orientation{background:var(--t3-warm-air)!important;border-color:var(--t3-line)!important}
.article-callout,
.article-signature,
.article-meta,
.reader-survey,
.reader-survey-body{border-color:var(--t3-line)!important}
.article-actions a{color:var(--t3-ink)!important}

/* --------------------------------------------------------------------------
   OPEN DOORS 2.0 — historical / utility public surface
   -------------------------------------------------------------------------- */
.od-card{background:var(--t3-paper)!important;border-color:var(--t3-line)!important}
.od-feature{background:var(--t3-warm-air)!important}
.od-books{background:var(--t3-light)!important}
.od-future{background:var(--t3-warm-soft)!important}
.book{border-color:var(--t3-line)!important}
.book-cover{background:linear-gradient(145deg,var(--t3-image-mist),var(--t3-sand-soft))!important}
.soon,
.od-source{border-color:var(--t3-line)!important}

/* --------------------------------------------------------------------------
   SHARED WNL FOOTER — override injected footer stylesheet safely.
   -------------------------------------------------------------------------- */
.wnl-footer{
  --wf-paper:var(--t3-paper)!important;
  --wf-cream:var(--t3-warm-air)!important;
  --wf-ink:var(--t3-ink)!important;
  --wf-muted:var(--t3-muted)!important;
  --wf-line:var(--t3-line)!important;
  --wf-gold:var(--t3-champagne)!important;
  --wf-champagne:var(--t3-champagne)!important;
  background:var(--t3-paper)!important;
  color:var(--t3-ink)!important;
  border-color:var(--t3-line)!important;
}
.wnl-footer__mission{
  background:linear-gradient(110deg,var(--t3-warm-air),var(--t3-paper))!important;
  border-color:var(--t3-line)!important;
}
.wnl-footer__mission small,
.wnl-footer__mission p{color:#817560!important}
.wnl-footer__status{border-color:var(--t3-sand-soft)!important;color:#817560!important}
.wnl-footer__legal{color:#918980!important}

/* Preserve functional media darkness where it belongs to media itself,
   not to the interface surface. */
.video-frame,
.visual-pause,
.epilogue .carousel-viewport{--t3-media-dark:#1E1B19}

@media(max-width:700px){
  .site-header,.top,.article-header,body>header{background:rgba(252,250,246,.97)!important}
}
