/* Report (screen + print). Shares tokens with site.css; defines its own when used standalone. */
:root {
  --ivory: #FAF6EE; --champagne: #F1E7D0; --paper: #FFFDF8; --ink: #1D1B19; --muted: #6F6A5E;
  --gold: #B8923A; --gold-deep: #8A6A1F; --gold-soft: #E9D9A8; --burgundy: #7A1E2B; --line: #E3D6B5;
  --serif: "Cormorant Garamond", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
body.print-page { margin: 0; background: var(--champagne); color: var(--ink); font-family: var(--sans); line-height: 1.6; }
body.print-page * { box-sizing: border-box; }
body.print-page .btn { display: inline-flex; padding: .45rem .9rem; border: 1px solid var(--ink); background: var(--ink); color: var(--ivory); font: 600 .85rem var(--sans); text-decoration: none; cursor: pointer; border-radius: 2px; }
body.print-page .btn-gold { background: var(--gold); border-color: var(--gold); color: #1d1608; }
body.print-page .btn-ghost { background: transparent; color: var(--ink); border-color: var(--line); }
body.print-page .muted { color: var(--muted); font-size: .85rem; }

.report { max-width: 900px; margin: 1.5rem auto 3rem; padding: clamp(1.4rem, 5vw, 3.5rem); background: var(--paper); border: 1px solid var(--gold-soft); outline: 1px solid var(--gold-soft); outline-offset: -10px; box-shadow: 0 30px 60px -40px rgba(60,40,0,.45); font-family: var(--sans); color: var(--ink); }
.report h1, .report h2, .report h3 { font-family: var(--serif); font-weight: 600; margin: 0; }

.rp-head { text-align: center; padding-bottom: 2rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--gold); position: relative; }
.rp-head::after { content: ""; position: absolute; left: 50%; bottom: -4px; width: 56px; height: 7px; transform: translateX(-50%); background: var(--paper); border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold); }
.rp-brand { display: inline-flex; align-items: center; gap: .9rem; text-align: left; margin-bottom: 1.4rem; }
.rp-brand strong { font-family: var(--serif); font-size: 1.5rem; display: block; line-height: 1.1; }
.rp-brand span { color: var(--muted); font-size: .85rem; }
.rp-kicker { margin: 0 0 .4rem; color: var(--gold-deep); font-size: .95rem; letter-spacing: .02em; }
.rp-name { font-size: clamp(2.2rem, 6vw, 3.6rem); line-height: 1.05; margin-bottom: 1.4rem; }
.rp-meta { display: flex; justify-content: center; flex-wrap: wrap; gap: .8rem 2.4rem; margin: 0; }
.rp-meta div { text-align: center; }
.rp-meta dt { color: var(--muted); font-size: .8rem; }
.rp-meta dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }

.sec { margin: 0 0 2.2rem; padding-top: .2rem; }
.sec h2 { font-size: 1.85rem; padding-bottom: .35rem; margin-bottom: .8rem; border-bottom: 1px solid var(--line); }
.sec-note { color: var(--muted); margin: 0 0 1rem; }
.sec p { margin: 0 0 .8rem; }

/* the 12-box grid */
.nm-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); width: min(100%, 480px); aspect-ratio: 1 / 1; margin: 1rem auto 0; border: 2px solid var(--ink); background: var(--paper); }
.nm-box { position: relative; border: 1px solid #8f8670; display: flex; flex-direction: column; justify-content: space-between; padding: .3rem .4rem .4rem; min-width: 0; min-height: 0; overflow: hidden; }
.nm-box.has { background: linear-gradient(180deg, #fbf3dc, #f5e6b9); }
.nm-n { font-size: .85rem; font-weight: 600; color: var(--burgundy); line-height: 1; border-bottom: 1px solid rgba(122,30,43,.25); padding-bottom: .2rem; align-self: flex-start; min-width: 1.4em; }
.nm-l { font-family: var(--serif); font-weight: 700; font-size: clamp(1rem, 3.4vw, 1.5rem); letter-spacing: .06em; line-height: 1.05; word-break: break-all; text-align: center; color: var(--ink); }
.nm-box.sm .nm-l { font-size: clamp(.8rem, 2.4vw, 1.05rem); }
.nm-box.xs .nm-l { font-size: clamp(.62rem, 1.8vw, .8rem); letter-spacing: .02em; }
.nm-center { grid-row: 2 / 4; grid-column: 2 / 4; border: 1px solid #8f8670; background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(184,146,58,.08) 14px 15px); }

.breakdown { font-family: var(--serif); font-size: 1.35rem; line-height: 1.9; }
.breakdown .bd { white-space: nowrap; }
.breakdown b { color: var(--burgundy); font-weight: 700; }
.sum-line { font-family: var(--serif); font-size: 1.3rem; overflow-wrap: anywhere; }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin: 1rem 0; }
.cards.one { grid-template-columns: minmax(180px, 280px); }
.card { border: 1px solid var(--gold-soft); background: #fff; padding: 1rem 1.1rem; text-align: center; break-inside: avoid; }
.card.feature { border-color: var(--gold); background: linear-gradient(180deg, #fffdf6, #f9efd2); }
.card-k { display: block; color: var(--muted); font-size: .85rem; }
.card-v { display: block; font-family: var(--serif); font-size: 3.2rem; line-height: 1.1; font-weight: 700; color: var(--ink); }
.card-s { display: block; color: var(--muted); font-size: .8rem; }

.theory { border-left: 3px solid var(--gold); padding: .4rem 0 .4rem 1.2rem; margin: 1rem 0; }
.theory h3 { font-size: 1.35rem; margin-bottom: .4rem; }
.theory p { font-family: var(--serif); font-size: 1.25rem; line-height: 1.75; margin: 0; }
.theory.big p { font-size: 1.4rem; line-height: 1.85; text-align: justify; hyphens: auto; }
.muted-note { color: var(--muted); font-style: italic; }
.cs-head { display: flex; align-items: center; gap: 1rem; }
.cs-letter { display: inline-grid; place-items: center; width: 4.2rem; height: 4.2rem; border: 2px solid var(--gold); border-radius: 50%; font-family: var(--serif); font-size: 2.4rem; font-weight: 700; color: var(--burgundy); background: #fbf3dc; flex: none; }
.cs-letter.num { font-size: 1.6rem; }

.rp-foot { margin-top: 2.5rem; padding-top: 1.2rem; border-top: 1px solid var(--gold); font-size: .85rem; color: var(--muted); }
.rp-foot .disclaimer { font-style: italic; }
.rp-foot .footnote { margin: .3rem 0 0; }

@media (max-width: 560px) {
  .report { padding: 1.2rem; outline-offset: -6px; }
  .card-v { font-size: 2.6rem; }
}

/* letter-position sequence */
.pos-seq { list-style: none; margin: .6rem 0 1.2rem; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.pos-seq li { display: inline-flex; flex-direction: column; align-items: center; min-width: 2.5rem; border: 1px solid var(--gold-soft); background: #fff; padding: .25rem .35rem .3rem; break-inside: avoid; }
.pos-seq .pl { font-family: var(--serif); font-size: 1.35rem; font-weight: 700; line-height: 1.1; color: var(--ink); }
.pos-seq .pp { font-size: .72rem; font-weight: 600; color: var(--burgundy); border-top: 1px solid var(--gold-soft); margin-top: .15rem; padding-top: .1rem; width: 100%; text-align: center; }

/* ------------------------------------------------------------------ print */
@page { size: A4 portrait; margin: 16mm; }
@media print {
  html, body { background: #fff !important; }
  .no-print, .topbar, .sitefoot, .report-toolbar, .skip, form, button, nav { display: none !important; }
  body.site, body.print-page { display: block; }
  .report { max-width: none; margin: 0; padding: 0; border: 0; outline: 0; box-shadow: none; background: #fff; font-size: 11pt; }
  .rp-head { padding-bottom: 1rem; margin-bottom: 1rem; }
  .rp-name { font-size: 30pt; }
  .sec { break-inside: avoid; page-break-inside: avoid; margin-bottom: 1.2rem; }
  .sec.flow { break-inside: auto; page-break-inside: auto; }
  .sec h2 { break-after: avoid; page-break-after: avoid; font-size: 17pt; }
  .nm-grid { width: 100mm; break-inside: avoid; page-break-inside: avoid; }
  .nm-box, .card, .theory h3, .cs-head, .pos-seq li { break-inside: avoid; page-break-inside: avoid; }
  .theory p { orphans: 3; widows: 3; font-size: 12.5pt; }
  .theory.big p { font-size: 13pt; }
  .card-v { font-size: 30pt; }
  .nm-box.has, .card.feature, .cs-letter { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .nm-center { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  a { color: inherit; text-decoration: none; }
}