/* Karta postaci MG&G - strony A4 w poziomie (podgląd, druk i PDF) */

.sheet-pages {
  display: flex; flex-direction: column; gap: 10mm;
  width: 297mm;
  font-family: var(--font-hand);
  color: #141414;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.sheet-page {
  position: relative;
  width: 297mm; height: 210mm;
  padding: 8mm 9mm;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
  font-size: 9pt; line-height: 1.3;
}
.parchment .sheet-page { background: #f2e4c4 url('../../Typst/assets/background/papier.jpg') center / cover; }
.sheet-page .tp-icon { height: 1.2em; vertical-align: -0.25em; }
.sheet-page .term { border-bottom: 0; cursor: inherit; } /* bez podkreślenia pojęć na wydruku i w PDF */

/* ------------------------------------------------------------ ramki paneli */

/* Ramka panelu: podwójna linia, która kończy się przy kwadracikach w narożnikach - dzięki temu
   kwadraciki są przezroczyste i wyglądają dobrze także na tle pergaminu. Każdy bok to osobny
   element (.sh-edge) z dwiema liniami: zewnętrzną i wewnętrzną (zwykłe obramowania, które
   poprawnie przenosi też eksport do PDF). */
.sh-panel {
  --frame: #1d1d1d;
  --frame-inner: #6b6b6b;
  position: relative;
  display: flex; flex-direction: column;
  min-height: 0;
  padding: 2.6mm 3.6mm 2.6mm;
}
.sh-edge { position: absolute; pointer-events: none; border: 0 solid var(--frame-inner); }
.sh-edge.t { top: 0; left: 2.6mm; right: 2.6mm; height: 1.05mm; border-top: 0.35mm solid var(--frame); border-bottom-width: 0.15mm; }
.sh-edge.b { bottom: 0; left: 2.6mm; right: 2.6mm; height: 1.05mm; border-bottom: 0.35mm solid var(--frame); border-top-width: 0.15mm; }
.sh-edge.l { left: 0; top: 2.6mm; bottom: 2.6mm; width: 1.05mm; border-left: 0.35mm solid var(--frame); border-right-width: 0.15mm; }
.sh-edge.r { right: 0; top: 2.6mm; bottom: 2.6mm; width: 1.05mm; border-right: 0.35mm solid var(--frame); border-left-width: 0.15mm; }
.sh-corner {
  position: absolute; width: 4.2mm; height: 4.2mm;
  border: 0.35mm solid var(--frame); background: transparent; z-index: 1;
}
.sh-corner::after { content: ''; position: absolute; inset: 0.7mm; border: 0.25mm solid var(--frame); }
.sh-corner.tl { top: -1.6mm; left: -1.6mm; }
.sh-corner.tr { top: -1.6mm; right: -1.6mm; }
.sh-corner.bl { bottom: -1.6mm; left: -1.6mm; }
.sh-corner.br { bottom: -1.6mm; right: -1.6mm; }
.sh-panel-title {
  position: relative; text-align: center;
  font-size: 12pt; font-weight: 700; line-height: 1.2;
  min-height: 6mm; margin-bottom: 1.2mm;
}
.sh-panel-icon { position: absolute; left: 0; top: -1mm; height: 7.5mm; width: auto; }
.sh-panel-body { flex: 1; min-height: 0; overflow: hidden; }

/* treść z podręcznika w wąskich panelach */
.sheet-page .tp-par { display: inline; }
.sheet-page .tp-par + .tp-par::before { content: ' '; }
.sheet-page .tp-table { display: block; border-collapse: collapse; margin: 0.4mm 0; font-size: 0.88em; }
.sheet-page .tp-table tbody { display: block; }
.sheet-page .tp-table tr { display: inline-table; margin: 0 0.8mm 0.5mm 0; border-collapse: collapse; }
.sheet-page .tp-table td, .sheet-page .tp-table th { border: 0.15mm solid #777; padding: 0 1.2mm; }
.sheet-page .tp-list { display: inline; padding: 0; margin: 0; list-style: none; }
.sheet-page .tp-list li { display: inline; }
.sheet-page .tp-list li::before { content: ' • '; }

/* ------------------------------------------------------------ strona 1 */

.page-abilities { display: flex; flex-direction: column; gap: 3.5mm; }
.sh-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 6mm; }
.sh-ident { flex: 1; display: flex; flex-direction: column; gap: 0.6mm; font-size: 11.5pt; max-width: 100mm; }
.sh-field { display: flex; gap: 2mm; border-bottom: 0.2mm dotted #777; min-height: 6.4mm; align-items: flex-end; }
.sh-label { font-weight: 700; white-space: nowrap; }
.sh-value { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sh-stats { display: flex; gap: 6mm; }
.sh-stat-group { display: flex; gap: 1.6mm; }
.sh-stat { display: flex; flex-direction: column; align-items: center; width: 13mm; }
.sh-stat-icon { height: 8.5mm; width: auto; margin-bottom: 1mm; }
.sh-stat-box {
  width: 12.5mm; height: 12.5mm;
  display: grid; place-items: center;
  border: 0.55mm solid #111; border-radius: 1.4mm;
  box-shadow: inset 0 0 1.4mm rgba(0, 0, 0, 0.45);
  font-size: 18pt; font-weight: 700; line-height: 1;
}
.sh-stat-label { font-size: 5.6pt; line-height: 1.05; text-align: center; color: #444; margin-top: 0.6mm; }

.sh-ability-grid {
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: 1.55fr 1fr; grid-template-rows: 1.05fr 1fr; gap: 5mm 6mm;
}
.sh-entry { margin-bottom: 0.9mm; }
.sh-entry strong { font-weight: 700; }
.sh-entry-basic { color: #333; }
.sh-cost .tp-par { display: inline; }

/* ------------------------------------------------------------ strona 2 */

.page-tracker { display: grid; grid-template-columns: 106mm minmax(0, 1fr) 64mm; gap: 6mm; }
.tr-left, .tr-mid { display: flex; flex-direction: column; gap: 3.2mm; min-height: 0; }
.tr-right { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6mm; }

.hp-block { display: flex; align-items: center; gap: 2.5mm; }
.hp-heart { height: 15mm; width: auto; }
.hp-rows { display: flex; flex-direction: column; align-items: flex-end; gap: 1.2mm; }
.hp-row { display: flex; align-items: center; gap: 0.9mm; }
.hp-row-label { font-size: 7pt; color: #555; width: 6mm; text-align: right; margin-right: 0.6mm; }
.hp-box {
  width: 6.3mm; height: 6.3mm; display: grid; place-items: center;
  border: 0.45mm solid #111; border-radius: 0.9mm;
  box-shadow: inset 0 0 1mm rgba(0, 0, 0, 0.4);
  font-size: 10pt; font-weight: 700; line-height: 1;
}
.hp-max { font-size: 7pt; text-align: center; line-height: 1.1; }
.hp-max b { font-size: 15pt; }

.wounds-panel .sh-panel-body { overflow: visible; }
.wound-slot { display: flex; align-items: flex-end; gap: 1.5mm; height: 6.2mm; }
.wound-no { font-weight: 700; width: 4mm; }
.wound-line { flex: 1; border-bottom: 0.3mm solid #222; }
.wound-fatal { height: 5mm; width: auto; }
.wound-table { width: 100%; border-collapse: collapse; margin-top: 1.6mm; font-size: 6.8pt; line-height: 1.2; }
.wound-table td { padding: 0.25mm 1mm; border-bottom: 0.15mm solid #bbb; vertical-align: top; }
.wt-roll { width: 3mm; font-weight: 700; }
.wt-name { width: 24mm; font-weight: 700; }
.wound-hint { font-size: 6.5pt; color: #444; margin-top: 1mm; }

.token-row { display: flex; gap: 3mm; }
.token-box { border: 0.35mm solid #222; border-radius: 1.5mm; padding: 1.2mm 2mm 1.6mm; }
.token-pool { flex: 1; min-height: 15mm; }
.token-title { font-weight: 700; font-size: 9pt; display: flex; align-items: center; gap: 1mm; }
.token-circles { display: flex; gap: 1.6mm; margin-top: 1mm; }
.token-circle { width: 9mm; height: 9mm; border-radius: 50%; border: 0.45mm solid #111; box-shadow: inset 0 0 1mm rgba(0, 0, 0, 0.35); }

/* tory na kamyczki (smocza furia, spaczenie, tokeny, tarcza) - pola 7,5 mm */
.track { display: flex; flex-direction: column; gap: 0.8mm; }
.track-title { font-weight: 700; font-size: 9pt; display: flex; align-items: center; gap: 1mm; }
.track-boxes { display: flex; flex-wrap: wrap; gap: 1mm; }
.track-box {
  min-width: 7.5mm; height: 7.5mm; padding: 0 0.6mm;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  border: 0.45mm solid #111; border-radius: 1mm; line-height: 1;
  box-shadow: inset 0 0 1mm rgba(0, 0, 0, 0.35);
}
.track-box b { font-size: 10pt; }
.track-box small { font-size: 5.5pt; color: #444; }
.track-split { display: flex; flex-direction: column; gap: 1mm; align-items: flex-start; }
.track-split .hp-box { width: 7.5mm; height: 7.5mm; font-size: 11pt; }

.status-panel .sh-panel-body { overflow: visible; }
.status { margin-bottom: 1.4mm; break-inside: avoid; }
.status-head { display: flex; justify-content: space-between; align-items: center; gap: 2mm; }
.status-name { font-size: 10.5pt; font-weight: 700; }
.status-track { display: flex; gap: 0.7mm; }
.status-box {
  width: 6mm; height: 6mm; display: grid; place-items: center;
  border: 0.4mm solid #111; border-radius: 0.8mm; font-size: 7.5pt; line-height: 1; color: #555;
}
.status-box.fatal { background: #222; color: #fff; }
.status-desc { font-size: 6.8pt; line-height: 1.2; color: #444; }

.hand-slot {
  width: 63mm; height: 88mm;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2mm;
  border: 0.45mm dashed #555; border-radius: 3mm;
  color: #8a8a8a; font-size: 13pt;
}
.hand-slot img { height: 15mm; width: auto; opacity: 0.22; }
.hand-slot img.mirror { transform: scaleX(-1); }

/* ------------------------------------------------------------ strona 3 */

.page-gear { display: grid; grid-template-columns: 1.25fr 1fr; gap: 6mm; }
.gear-panel .sh-panel-body { display: flex; flex-direction: column; }
.gear-list { flex: 1; min-height: 0; list-style: none; margin: 0; padding: 0; column-count: 2; column-gap: 6mm; }
.gear-list li {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 2mm;
  height: 1.78em; border-bottom: 0.2mm solid #bbb; break-inside: avoid;
}
.gear-qty { font-weight: 700; }
.gear-footer { display: flex; justify-content: space-between; align-items: center; gap: 4mm; margin-top: 2mm; font-size: 11pt; }
.gold-box { display: flex; align-items: center; gap: 1.5mm; font-weight: 700; }
.gold-box img { height: 7mm; width: auto; }
.gold-value {
  display: inline-block; min-width: 20mm; padding: 0.5mm 2mm; text-align: center;
  border: 0.5mm solid #111; border-radius: 1.2mm; font-size: 14pt;
}
.armor-box { font-size: 9pt; }
.gear-side { display: flex; flex-direction: column; gap: 5mm; min-height: 0; }
.notes-panel { flex: 1; }
.notes-panel .sh-panel-body { display: flex; flex-direction: column; }
.notes-text { white-space: pre-wrap; font-size: 1em; }
.notes-lines { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.notes-lines span { flex: none; height: 6.4mm; border-bottom: 0.2mm solid #bbb; }

/* ------------------------------------------------------------ strona 4 */

.page-magic { display: flex; flex-direction: column; }
.magic-title { text-align: center; font-size: 15pt; font-weight: 700; margin-bottom: 2.5mm; }
.magic-columns { flex: 1; min-height: 0; overflow: hidden; column-count: 3; column-gap: 6mm; column-rule: 0.2mm solid #bbb; line-height: 1.28; }
.magic-block { margin-bottom: 2.5mm; }
.magic-head {
  display: flex; align-items: center; gap: 1.5mm;
  font-size: 1.3em; font-weight: 700;
  border-bottom: 0.3mm solid #222; margin-bottom: 1.2mm; break-after: avoid;
}
.magic-head img { height: 1.5em; width: auto; }
.magic-head small { font-size: 0.65em; font-weight: 400; font-style: italic; margin-left: auto; }
.magic-note { font-style: italic; margin-bottom: 1mm; }
.spell { break-inside: avoid; margin-bottom: 1.5mm; }
.spell-name { font-weight: 700; }
.spell-name small { font-weight: 400; font-style: italic; color: #444; }
.spell-meta { font-size: 0.92em; }
.recipe { break-inside: avoid; margin-bottom: 0.6mm; }
.recipe-desc { color: #444; }
.recipe-desc::before { content: ' - '; }

/* ------------------------------------------------------------ karty przedmiotów */

.page-cards {
  display: grid; grid-template-columns: repeat(4, 63mm); grid-template-rows: repeat(2, 88mm);
  gap: 6mm 5mm; justify-content: center; align-content: center;
}
.item-card {
  width: 63mm; height: 88mm;
  display: flex; flex-direction: column;
  padding: 2.5mm 3mm;
  border: 0.4mm solid #222; border-radius: 3mm;
  overflow: hidden;
}
.card-art { position: relative; width: 36mm; height: 38.5mm; margin: 0 auto 1mm; flex: none; }
.card-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.card-name { font-weight: 700; font-size: 10pt; line-height: 1.15; text-align: center; }
.card-qty { font-weight: 400; }
.card-meta { font-size: 6pt; font-style: italic; color: #444; text-align: center; margin-bottom: 1mm; }
.card-desc { flex: 1; min-height: 0; overflow: hidden; line-height: 1.22; }

/* ------------------------------------------------------------ druk */

@media print {
  @page { size: A4 landscape; margin: 0; }
  html, body { background: #fff !important; }
  .topbar, .steps, .footer, .aside, .sheet-toolbar, .warn-box, .step-footer, .busy-overlay { display: none !important; }
  .app, .layout, .main, .step, .sheet-preview {
    display: block !important; padding: 0 !important; margin: 0 !important;
    max-width: none !important; overflow: visible !important; min-height: 0 !important;
  }
  .sheet-scale { transform: none !important; width: auto !important; }
  .sheet-pages { gap: 0; }
  .sheet-page { box-shadow: none; break-after: page; page-break-after: always; height: 209.6mm; }
  .sheet-page:last-child { break-after: auto; page-break-after: auto; }
}
