/* FirstBookClients — Ledger Indigo & Marigold
   deep indigo #2a2753 · paper #f7f2e7 · card #fffdf6 · ink #211e33 ·
   marigold #dfa018 · muted #55506e · link indigo #353182 */
:root{
  --indigo:#2a2753; --indigo2:#1f1c40; --paper:#f7f2e7; --paper2:#eee7d3;
  --marigold:#dfa018; --marigoldlt:#f2c14e; --link:#353182; --ink:#211e33;
  --card:#fffdf6; --muted:#55506e; --pale:#e9e5f5; --line:#d8cfb8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.62}
.wrap{max-width:1060px;margin:0 auto;padding:0 20px}
h1,h2,h3,h4{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;line-height:1.22;color:var(--ink)}
h1{font-size:2.35rem;margin:.35em 0 .5em}
h2{font-size:1.65rem;margin:1.4em 0 .55em}
h3{font-size:1.25rem;margin:1.2em 0 .45em}
h4{font-size:1.05rem;margin:1.1em 0 .35em}
p{margin:.65em 0}
a{color:var(--link);text-decoration:underline;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
.small{font-size:.86rem;color:var(--muted)}
.src{font-size:.86rem;color:var(--muted)}
.kicker{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-size:.78rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--indigo);margin:0 0 .4em;font-weight:700}
.tagline{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-size:.85rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--marigoldlt);font-weight:700;margin:0 0 .6em}
.lede{font-size:1.13rem}
.btn{display:inline-block;background:var(--marigold);color:var(--ink);
  font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-weight:700;font-size:1rem;
  padding:.78em 1.5em;border-radius:8px;text-decoration:none;border:2px solid var(--ink)}
.btn:hover{background:var(--marigoldlt)}
.btn.alt{background:var(--indigo);color:var(--paper);border-color:var(--indigo)}
section{padding:34px 0}
section.alt{background:var(--paper2)}
section.dark{background:var(--indigo);color:var(--paper)}
section.dark h2,section.dark h3,section.dark p{color:var(--paper)}
section.dark a{color:var(--marigoldlt)}
section.dark .btn{background:var(--marigold);color:var(--ink);border-color:var(--ink)}
/* Light components inside dark sections — cascade hardening.
   section.dark paints paper text two ways: direct rules at (0,1,2) for
   h2/h3/p, and INHERITANCE for everything else. Any light panel inside
   it must re-declare EVERY text element at strictly higher specificity,
   or elements with no direct rule — li above all — silently inherit
   paper onto cream. Every group below is scoped above (0,1,2).
   th is deliberately excluded: it paints its own indigo/paper scheme. */
section.dark .lock-panel,section.dark .card,section.dark .tool,section.dark .result,
section.dark .notice,section.dark .tablewrap,section.dark .faq,section.dark .faq details{color:var(--ink)}
section.dark .lock-panel h2,section.dark .lock-panel h3,section.dark .lock-panel h4,section.dark .lock-panel p,section.dark .lock-panel li,section.dark .lock-panel td,section.dark .lock-panel summary,section.dark .lock-panel label,
section.dark .card h2,section.dark .card h3,section.dark .card h4,section.dark .card p,section.dark .card li,section.dark .card td,section.dark .card summary,section.dark .card label,
section.dark .tool h2,section.dark .tool h3,section.dark .tool h4,section.dark .tool p,section.dark .tool li,section.dark .tool td,section.dark .tool summary,section.dark .tool label,
section.dark .result h2,section.dark .result h3,section.dark .result h4,section.dark .result p,section.dark .result li,section.dark .result td,section.dark .result summary,section.dark .result label,
section.dark .notice h2,section.dark .notice h3,section.dark .notice h4,section.dark .notice p,section.dark .notice li,section.dark .notice td,section.dark .notice summary,section.dark .notice label,
section.dark .tablewrap h2,section.dark .tablewrap h3,section.dark .tablewrap h4,section.dark .tablewrap p,section.dark .tablewrap li,section.dark .tablewrap td,section.dark .tablewrap summary,section.dark .tablewrap label,
section.dark .faq h2,section.dark .faq h3,section.dark .faq h4,section.dark .faq p,section.dark .faq li,section.dark .faq td,section.dark .faq summary,section.dark .faq label{color:var(--ink)}
section.dark .lock-panel .small,section.dark .lock-panel .src,section.dark .card .small,section.dark .card .src,
section.dark .tool .small,section.dark .tool .src,section.dark .result .small,section.dark .result .src,
section.dark .notice .small,section.dark .notice .src,section.dark .tablewrap .small,section.dark .tablewrap .src,
section.dark .faq .small,section.dark .faq .src{color:var(--muted)}
section.dark .lock-panel .kicker,section.dark .card .kicker,section.dark .tool .kicker,section.dark .result .kicker,
section.dark .notice .kicker,section.dark .tablewrap .kicker,section.dark .faq .kicker{color:var(--indigo)}
section.dark .lock-panel a,section.dark .card a,section.dark .tool a,section.dark .result a,
section.dark .notice a,section.dark .tablewrap a,section.dark .faq a{color:var(--link)}
section.dark .lock-panel .btn,section.dark .card .btn,section.dark .tool .btn,section.dark .result .btn,
section.dark .notice .btn,section.dark .tablewrap .btn,section.dark .faq .btn{color:var(--ink)}
section.dark ul.check li::before{color:var(--marigoldlt)}
section.dark .lock-panel ul.check li::before,section.dark .card ul.check li::before,section.dark .tool ul.check li::before,
section.dark .result ul.check li::before,section.dark .notice ul.check li::before,section.dark .tablewrap ul.check li::before,
section.dark .faq ul.check li::before{color:var(--indigo)}
.hero{background:var(--indigo);color:var(--paper);padding:44px 0 40px}
.hero h1{color:var(--paper)}
.hero p{color:var(--paper)}
.hero .lede{color:#e8e2f2}
.hero a{color:var(--marigoldlt)}
.hero .btn{background:var(--marigold);color:var(--ink);border-color:var(--ink)}
.hero .small{color:#e8e2f2}
header.site{background:var(--indigo);border-bottom:3px solid var(--marigold);padding:14px 0}
header.site .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.mono{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
  background:var(--marigold);color:var(--ink);border-radius:9px;
  font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-weight:800;font-size:.95rem}
.wordmark{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-weight:800;font-size:1.3rem}
.wm-a{color:var(--marigold)}
.wm-b{color:var(--paper)}
nav.main{display:flex;flex-wrap:wrap;gap:6px 20px;margin-left:auto}
nav.main a{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-size:.95rem;font-weight:600;color:var(--paper)}
footer.site{background:var(--indigo);color:var(--paper);padding:40px 0 30px;margin-top:0}
footer.site .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:26px}
footer.site h4{color:var(--paper);margin-top:0}
footer.site p,footer.site li{color:#e8e2f2}
footer.site a{color:var(--marigoldlt)}
footer.site ul{list-style:none;padding:0;margin:0}
footer.site li{margin:.35em 0}
.wm-h{font-family:'Avenir Next','Segoe UI',Arial,sans-serif}
footer.site .wm-a{color:var(--marigold)}
footer.site .wm-b{color:var(--paper)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:20px 0}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:20px 0}
.card{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:20px 22px}
.card h3{margin-top:.2em}
.tool{background:var(--card);color:var(--ink);border:2px solid var(--indigo);border-radius:14px;padding:24px 26px;margin:22px 0}
.tool label{display:block;font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-weight:600;font-size:.95rem;margin:16px 0 5px}
.tool select,.tool input{width:100%;padding:.62em .7em;font-size:1rem;border:1.5px solid var(--muted);
  border-radius:8px;background:#fff;color:var(--ink);font-family:inherit}
.result{background:var(--pale);color:var(--ink);border:1.5px solid var(--indigo);border-radius:12px;padding:22px 26px;margin:20px 0}
.result h3{margin-top:0}
.verdict{font-size:1.08rem;font-weight:700}
.notice{background:var(--pale);color:var(--ink);border-left:5px solid var(--indigo);border-radius:0 10px 10px 0;padding:16px 20px;margin:20px 0}
.notice p{margin:.3em 0}
.lock-panel{background:var(--card);color:var(--ink);border:2px solid var(--marigold);border-radius:14px;padding:24px 28px;margin:26px 0}
.lock-panel h3{margin-top:0;color:var(--ink)}
ul.check{list-style:none;padding:0;margin:.6em 0}
ul.check li{padding:.32em 0 .32em 1.7em;position:relative}
ul.check li::before{content:"✓";position:absolute;left:.2em;color:var(--indigo);font-weight:800}
ol.moves{padding-left:1.3em}
ol.moves li{margin:.55em 0}
.tablewrap{overflow-x:auto;margin:16px 0}
table{border-collapse:collapse;width:100%;background:var(--card)}
th,td{border:1px solid var(--line);padding:.55em .7em;text-align:left;font-size:.95rem;vertical-align:top}
th{background:var(--indigo);color:var(--paper);font-family:'Avenir Next','Segoe UI',Arial,sans-serif}
.flag{display:inline-block;background:var(--marigold);color:var(--ink);border-radius:6px;
  padding:.08em .5em;font-size:.78rem;font-weight:700;font-family:'Avenir Next','Segoe UI',Arial,sans-serif}
.pill{display:inline-block;border-radius:999px;padding:.1em .7em;font-size:.8rem;font-weight:700;
  font-family:'Avenir Next','Segoe UI',Arial,sans-serif;background:var(--pale);color:var(--ink);border:1px solid var(--indigo)}
details{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:.4em 1.1em;margin:.6em 0}
summary{font-family:'Avenir Next','Segoe UI',Arial,sans-serif;font-weight:700;cursor:pointer;padding:.55em 0}
audio{width:100%;margin:.6em 0}
@media (max-width:820px){
  .grid,.grid2,.row2,.row3{grid-template-columns:1fr}
  footer.site .cols{grid-template-columns:1fr}
  h1{font-size:1.8rem}
  body{font-size:17px}
  nav.main{margin-left:0}
}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 18px}
