/* The Songs of David Steven Farkas — release package site.
   Banner standard: dark ground, gold rule, large serif title.
   Access pattern: one door, few big buttons, nothing past two taps. Phone-first. */
:root{
  --ink:#1c1710; --paper:#faf6ec; --gold:#c9a227; --gold-dark:#8a6d1a;
  --banner:#171208; --card:#fffdf6; --line:#ddd2b8; --muted:#6b5f43;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:Georgia,'Times New Roman',serif;line-height:1.55;font-size:18px}
.site-banner{background:var(--banner);border-bottom:4px solid var(--gold);
  padding:28px 16px 22px;text-align:center}
.banner-title{color:#f5ecd2;font-size:2rem;letter-spacing:.04em;font-weight:700}
.banner-sub{color:var(--gold);font-size:1.02rem;margin-top:6px;letter-spacing:.06em}
.page{max-width:860px;margin:0 auto;padding:20px 16px 8px}
h1{font-size:1.85rem;line-height:1.2;margin:.35em 0 .2em}
h2{font-size:1.3rem;margin:1.4em 0 .45em;border-bottom:2px solid var(--gold);padding-bottom:4px}
h3{font-size:1.08rem;margin:1.15em 0 .3em;color:var(--gold-dark)}
p{margin:.55em 0}
.setline{color:var(--muted);font-size:.95rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:0}
.meta{font-size:1.05rem;font-weight:700;background:var(--card);border:1px solid var(--line);
  border-left:5px solid var(--gold);padding:10px 14px;border-radius:6px}
.lead{font-size:1.12rem}
.bigbtns{display:grid;gap:14px;margin:22px 0}
.bigbtn{display:flex;flex-direction:column;justify-content:center;min-height:64px;
  padding:14px 18px;background:var(--banner);color:#f5ecd2;text-decoration:none;
  border:2px solid var(--gold);border-radius:10px;font-size:1.22rem;font-weight:700}
.bigbtn small{color:var(--gold);font-weight:400;font-size:.95rem;margin-top:3px}
.bigbtn:active{background:#2a2110}
.cards{display:grid;gap:10px;margin:14px 0}
@media(min-width:640px){.cards{grid-template-columns:1fr 1fr}}
.card{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 14px;
  background:var(--card);border:1px solid var(--line);border-left:5px solid var(--gold);
  border-radius:8px;text-decoration:none;color:var(--ink);font-size:1.05rem}
.card .num{font-weight:700;color:var(--gold-dark);min-width:2em}
.card:active{background:#f3ead2}
.backbtn{display:inline-flex;align-items:center;min-height:48px;padding:8px 16px;
  background:var(--card);border:1.5px solid var(--gold-dark);border-radius:8px;
  color:var(--ink);text-decoration:none;font-weight:700}
dl.blueprint{margin:.4em 0}
dl.blueprint dt{font-weight:700;color:var(--gold-dark);margin-top:.7em}
dl.blueprint dd{margin:.15em 0 .4em 0}
ul.inst{margin:.4em 0;padding-left:1.2em}
ul.inst li{margin:.45em 0}
.playnote,.notebox{background:#f3ead2;border:1px solid var(--gold);border-radius:8px;
  padding:12px 16px;margin:16px 0}
.lyrics p.lyr{white-space:pre-line;margin:.3em 0 .9em}
.stage{font-style:italic;color:var(--muted)}
.recovery{border:2px dashed var(--gold-dark);border-radius:10px;padding:16px 18px;
  background:var(--card);margin:16px 0;font-size:1.08rem}
.lanes{display:grid;gap:12px;margin:14px 0}
@media(min-width:640px){.lanes{grid-template-columns:1fr 1fr}}
.lane{border:1px solid var(--line);border-top:5px solid var(--gold);border-radius:8px;
  background:var(--card);padding:12px 16px}
footer.rights{max-width:860px;margin:26px auto 0;padding:16px;border-top:2px solid var(--gold);
  color:var(--muted);font-size:.95rem;text-align:center}
/* The ONE advertisement slot (owner's format law): bottom of the page only,
   below the footer, smaller half-banner size, subordinate to the words. */
.ad-slot{max-width:468px;margin:20px auto 26px;border:1px dashed #c9bfa5;
  border-radius:8px;background:var(--card);padding:10px 14px;text-align:center}
.ad-slot .ad-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 6px}
.ad-slot .ad-note{font-size:.85rem;color:var(--muted);margin:.3em 0 0}
@media print{.ad-slot{display:none}}

/* Design & Access Phase 2, 2026-10-30 — button bars (spec Step 1). */
.btnbar{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.btnbar .btn{flex:1 1 150px;text-align:center;min-height:48px;display:flex;align-items:center;justify-content:center}
@media (max-width:700px){.btnbar{flex-direction:column}.btnbar .btn{flex:1 1 auto;width:100%}}

/* READABILITY STANDARD — David's ruling, 2026-10-30 (large, dark, short lines).
   Reading body: 20px, line-height 1.6, very dark ink on white, measure 45ch
   (about seven words a line — the printed-book measure). Muted/gold are
   ornament only and never carry reading text. */
:root{--paper:#ffffff;--reading-ink:#18201e;--reading-measure:45ch}
body{font-size:20px;line-height:1.6;background:#ffffff;color:#18201e}
.lead{color:#18201e;max-width:45ch}
.card p{color:#18201e}
.workmeta{color:#18201e}
article.reading{background:#ffffff;color:#18201e;font-size:20px;line-height:1.6;max-width:45ch;margin-left:auto;margin-right:auto;font-family:Georgia,'Times New Roman',serif}
article.reading p,article.reading li{max-width:45ch}
main p,main li{max-width:45ch}
.ad-slot p,.ad-slot .ad-note,.topnav a,.site-header p{max-width:none}
article a,main p a,main li a{color:#12322f;text-decoration:underline}
.vnum{color:#18201e}
table{font-size:19px;color:#18201e;background:#ffffff}
th,td{line-height:1.5;overflow-wrap:break-word}
footer{color:#18201e}
footer.rights{color:#18201e}
.sub{color:#18201e}

.banner-free{color:#f5ecd2;opacity:.88;font-size:.98rem;margin-top:5px;letter-spacing:.02em}

/* The advertisement CARD (David, 2026-10-31 17:30 — form; 18:10 —
   visibility): ONE advertisement per page, in this compact card form,
   anchored at the BOTTOM LEFT of the screen, standing VISIBLE with the
   house placeholder while no nation's network is configured; the
   selected nation's creative replaces the placeholder in the same card
   in the live state (per-nation routing in ads-config.js untouched).
   These rules are the collection's standard card rules, identical to
   the school and library. */
.ad-slot[data-ads-state="live"]{position:fixed;left:10px;bottom:10px;z-index:60;margin:0;padding:8px;width:220px;max-width:calc(100vw - 20px);box-sizing:border-box;background:#fffdf6;border:1px solid #c9bfa5;border-radius:10px;box-shadow:0 4px 18px rgba(23,19,16,.30);text-align:left;display:flex;align-items:center;gap:8px}
.ad-slot[data-ads-state="live"] .ad-thumb{flex:0 0 54px;width:54px;height:54px;border-radius:6px;background:#e9e2cf;overflow:hidden;display:block}
.ad-slot[data-ads-state="live"] .ad-thumb img{width:100%;height:100%;object-fit:cover;display:block;border:0}
.ad-slot[data-ads-state="live"] .ad-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:5px;padding-right:14px}
.ad-slot[data-ads-state="live"] .ad-headline{font-size:13px;font-weight:700;line-height:1.25;color:#26221a;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ad-slot[data-ads-state="live"] .ad-meta{display:flex;align-items:center;gap:6px;margin:0}
.ad-slot[data-ads-state="live"] .ad-label{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6d6759;border:1px solid #c9bfa5;border-radius:3px;padding:1px 4px;margin:0}
.ad-slot[data-ads-state="live"] .ad-action{font-size:11px;font-weight:700;line-height:1;padding:5px 10px;border:0;border-radius:999px;background:#7a1f1f;color:#fff;cursor:pointer}
.ad-slot[data-ads-state="live"] .ad-close{position:absolute;top:2px;right:2px;width:20px;height:20px;padding:0;border:0;border-radius:50%;background:transparent;color:#6d6759;font-size:15px;line-height:20px;text-align:center;cursor:pointer}
@media (min-width:768px){.ad-slot[data-ads-state="live"]{width:280px}}
.ad-slot[data-ads-state="placeholder"]{position:fixed;left:10px;bottom:10px;z-index:60;margin:0;padding:8px;width:220px;max-width:calc(100vw - 20px);box-sizing:border-box;background:#fffdf6;border:1px solid #c9bfa5;border-radius:10px;box-shadow:0 4px 18px rgba(23,19,16,.30);text-align:left;display:block}
.ad-slot[data-ads-state="placeholder"] .ad-label{font-size:13px;font-weight:700;line-height:1.25;color:#26221a;margin:0 0 4px}
.ad-slot[data-ads-state="placeholder"] .ad-note{font-size:11px;line-height:1.35;color:#4a463c;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (min-width:768px){.ad-slot[data-ads-state="placeholder"]{width:280px}}
/* The languages line in the banner (the door rule: the page stands in
   its own language and carries one line to the languages page). */
.langline{margin-top:9px;font-size:.95rem}
.langline a{color:#f5ecd2;text-decoration:underline}
/* Download & print — the studio block on every song page. */
.dlbox{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--gold);
  border-radius:8px;padding:12px 16px;margin:18px 0}
.dlbox h2{margin-top:.2em}
.dlbtn{display:inline-block;margin:4px 8px 4px 0;padding:10px 16px;min-height:48px;
  background:var(--banner);color:#f5ecd2;border:2px solid var(--gold);border-radius:8px;
  font:inherit;font-weight:700;cursor:pointer;text-decoration:none;vertical-align:middle}
.dlbtn:active{background:#2a2110}
.dlnote{color:var(--muted);font-size:.95rem;margin:.3em 0}
/* PRINT — the studio sheet: the song's own page content only. No banner,
   no back button, no download block, no advertisement — the words, the
   notes and the ownership line, clean on paper. */
@media print{
  .site-banner,.backline,.ad-slot,.dlbox,.bigbtns,.langline{display:none!important}
  body{background:#fff;font-size:12pt;line-height:1.45}
  .page{max-width:none;padding:0}
  h2{border-bottom:1px solid #888}
  a{color:#000;text-decoration:none}
  section,.lyrics p.lyr,ul.inst li{break-inside:avoid}
  footer.rights{border-top:1px solid #888;color:#000;max-width:none}
}
