/* =============================================================================
   Ámbar, technical documentation stylesheet
   Screen reading and print (A4) from the same source.
   ============================================================================= */

:root{
  --amber:#b8791a;
  --amber-dp:#8a5510;
  --amber-lt:#f0d9a8;
  --amber-wash:#fdf8ef;

  --ink:#1d1913;
  --ink-2:#4a4238;
  --ink-3:#7d7263;
  --line:#e2d8c6;
  --line-2:#cbbda3;
  --paper:#ffffff;
  --panel:#faf6ee;
  --code-bg:#f6f1e6;
  --code-ink:#3a3229;

  --serif:'Iowan Old Style',Georgia,'Times New Roman',serif;
  --sans:'Segoe UI',Inter,-apple-system,Helvetica,Arial,sans-serif;
  --mono:'Cascadia Mono',Consolas,'SF Mono',Menlo,monospace;

  --measure:34em;
}

*{box-sizing:border-box}

html{ -webkit-text-size-adjust:100% }

body{
  margin:0;
  background:var(--amber-wash);
  color:var(--ink);
  font-family:var(--serif);
  font-size:11.4pt;
  line-height:1.62;
  text-rendering:optimizeLegibility;
}

/* ---------- page container ---------- */
.page{
  background:var(--paper);
  max-width:210mm;
  margin:0 auto;
  padding:26mm 22mm 24mm;
  box-shadow:0 1px 3px rgba(29,25,19,.07), 0 14px 46px rgba(29,25,19,.06);
}

/* ---------- cover ---------- */
.cover{
  min-height:250mm;
  display:flex; flex-direction:column;
  padding:0; overflow:hidden; position:relative;
  color:#f5ead8; background:#120c06;
}
.cover-art{
  position:relative; padding:34mm 22mm 0; flex:1;
  background:
    radial-gradient(58% 76% at 84% 24%, rgba(245,166,35,.30), transparent 66%),
    radial-gradient(44% 60% at 8% 88%, rgba(200,118,15,.16), transparent 72%),
    linear-gradient(162deg,#120c06 0%,#1d1408 58%,#0e0904 100%);
}
.cover .inclusions{position:absolute; inset:0; pointer-events:none}
.cover .inclusions i{
  position:absolute; border-radius:50%; background:#ffc766; display:block;
}
.cover .wordmark{
  font-family:var(--serif); font-size:64pt; line-height:1; letter-spacing:.16em;
  margin:0; color:#f5a623;
  background:linear-gradient(100deg,#ffd98a,#f5a623 46%,#d97b0c);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.cover .hr{height:1.4pt; width:74mm; margin:11mm 0 7mm;
  background:linear-gradient(90deg,#f5a623,rgba(245,166,35,0))}
.cover .sub{font-size:19pt; margin:0 0 4mm; color:#f3e6d4; font-weight:400}
.cover .kick{font-family:var(--sans); font-size:8.4pt; letter-spacing:.26em; color:#c79a5c; margin:0}
.cover .meta{
  font-family:var(--sans); padding:0 22mm 24mm; font-size:9.6pt; line-height:1.75;
  color:#b9a488; position:relative;
}
.cover .meta .who{font-family:var(--serif); font-size:13pt; color:#f3e6d4; margin-bottom:1.5mm}
.cover .meta .ver{
  display:inline-block; margin-top:6mm; padding:1.6mm 4mm; font-size:8pt;
  letter-spacing:.18em; border:.8pt solid #6b4d1f; border-radius:2mm; color:#e0b465;
}

/* ---------- headings ---------- */
h1,h2,h3,h4{font-weight:400; color:var(--ink); letter-spacing:.005em}

h1.part{
  font-size:26pt; line-height:1.18; margin:0 0 3mm;
  padding-bottom:5mm; border-bottom:1.4pt solid var(--amber);
}
h1.part .num{
  display:block; font-family:var(--sans); font-size:8.4pt; letter-spacing:.28em;
  color:var(--amber); margin-bottom:4mm; font-weight:600;
}

h2{font-size:16pt; margin:11mm 0 3mm; padding-bottom:2mm; border-bottom:.6pt solid var(--line)}
h3{font-size:12.6pt; margin:8mm 0 2mm; color:var(--amber-dp)}
h4{font-family:var(--sans); font-size:10.4pt; margin:6mm 0 1.5mm; color:var(--ink-2); font-weight:600}

p{margin:0 0 3.4mm; max-width:var(--measure)}
p.lead{font-size:12.6pt; color:var(--ink-2); max-width:32em}

ul,ol{margin:0 0 4mm; padding-left:6mm; max-width:var(--measure)}
li{margin-bottom:1.6mm}

strong{font-weight:600; color:var(--ink)}
em{font-style:italic}

a{color:var(--amber-dp)}

/* ---------- table of contents ---------- */
.toc{font-family:var(--sans); font-size:10pt; max-width:none}
.toc ol{list-style:none; padding:0; margin:0; max-width:none}
.toc > ol > li{border-top:.6pt solid var(--line); padding:2.6mm 0}
.toc > ol > li:last-child{border-bottom:.6pt solid var(--line)}
.toc a{display:flex; gap:3mm; align-items:baseline; text-decoration:none; color:var(--ink)}
.toc a:hover{color:var(--amber-dp)}
.toc .cn{
  font-family:var(--serif); color:var(--amber); min-width:8mm;
  font-size:10.6pt; font-variant-numeric:tabular-nums;
}
.toc .ct{flex:1}
.toc ol ol{margin:1.8mm 0 0 11mm}
.toc ol ol li{padding:.7mm 0; color:var(--ink-3)}
.toc ol ol a{color:var(--ink-2); font-size:9.4pt}

/* ---------- code ---------- */
pre{
  font-family:var(--mono); font-size:8.9pt; line-height:1.58;
  background:var(--code-bg); color:var(--code-ink);
  border:.6pt solid var(--line); border-left:2.2pt solid var(--amber);
  border-radius:0 1.5mm 1.5mm 0;
  padding:3.4mm 4.4mm; margin:0 0 4mm;
  overflow-x:auto; white-space:pre; max-width:none;
}
code{font-family:var(--mono); font-size:.88em; color:var(--amber-dp)}
pre code{color:inherit; font-size:1em}

figcaption{
  font-family:var(--sans); font-size:8.4pt; color:var(--ink-3);
  margin:-2.4mm 0 5mm; padding-left:2.2pt;
}

/* ---------- callouts ---------- */
.note,.warn,.key{
  margin:5mm 0; padding:3.6mm 5mm; border-radius:1.5mm;
  font-size:10.6pt; max-width:var(--measure);
}
.note{background:var(--panel); border-left:2.2pt solid var(--line-2); color:var(--ink-2)}
.warn{background:#fdf1e6; border-left:2.2pt solid #c2691a; color:#5c3410}
.key{background:#fbf4e4; border-left:2.2pt solid var(--amber); color:#5a4413}
.note p:last-child,.warn p:last-child,.key p:last-child{margin-bottom:0}
.note .lbl,.warn .lbl,.key .lbl{
  font-family:var(--sans); font-size:8pt; letter-spacing:.2em; font-weight:600;
  display:block; margin-bottom:1.6mm; text-transform:uppercase;
}
.warn .lbl{color:#a3540f}
.key .lbl{color:var(--amber-dp)}
.note .lbl{color:var(--ink-3)}

/* ---------- tables ---------- */
table{border-collapse:collapse; width:100%; font-family:var(--sans); font-size:9.6pt; margin:0 0 5mm}
th,td{text-align:left; padding:2.4mm 3mm; border-bottom:.6pt solid var(--line); vertical-align:top}
th{
  font-size:8pt; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); font-weight:600; border-bottom:.9pt solid var(--line-2);
}
td{color:var(--ink-2)}
td:first-child{color:var(--ink)}
td code,th code{font-size:8.8pt}
.tbl-wrap{overflow-x:auto; margin-bottom:5mm}

/* ---------- running footer on screen ---------- */
.colophon{
  margin-top:14mm; padding-top:5mm; border-top:.6pt solid var(--line);
  font-family:var(--sans); font-size:8.6pt; color:var(--ink-3);
}

/* =============================================================================
   PRINT / PDF
   ============================================================================= */
@page{
  size:A4;
  margin:19mm 17mm 17mm;
}
@page:first{ margin:0 }

@media print{
  body{background:#fff; font-size:10.4pt}
  .page{box-shadow:none; max-width:none; margin:0; padding:0}

  .cover{
    min-height:297mm; page-break-after:always; break-after:page;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  .cover-art,.cover .meta{-webkit-print-color-adjust:exact; print-color-adjust:exact}

  h1.part{page-break-before:always; break-before:page; padding-top:0}
  h1.part:first-of-type{page-break-before:avoid; break-before:avoid}

  h2,h3,h4{page-break-after:avoid; break-after:avoid}
  p,li{orphans:3; widows:3}
  pre,table,.note,.warn,.key,figure{page-break-inside:avoid; break-inside:avoid}
  pre{overflow:visible; white-space:pre-wrap; word-break:break-word}
  .tbl-wrap{overflow:visible}

  a{color:var(--ink); text-decoration:none}
  .toc a{color:var(--ink)}

  .no-print{display:none}
}