/* A LEAF, AS THE PRESS PRINTS IT.
 *
 * Everything below is lifted verbatim out of `src/screens/Print.svelte` — the
 * same stylesheet that renders the PDFs — with three changes and no others:
 *
 *   1. Svelte scoped these rules to one component. Here they are scoped to
 *      `.leafwrap` instead, so nothing on the page can reach into a card and
 *      nothing in a card leaks out.
 *   2. `zoom` on the wrapper, because a card is 63 × 118 mm and a screen is not
 *      a sheet of A4. Everything inside stays in millimetres and keeps its
 *      proportion exactly; only the scale changes.
 *   3. Print-only concerns (page boxes, crop ticks, the ready flag) are gone.
 *
 * If the printed card changes, this file is wrong until it is copied again.
 * Do not "improve" a value here — improve it in Print.svelte and copy it back,
 * or the page will start lying about the object it is selling.
 */

.leafwrap{zoom:var(--leaf-zoom,.72);line-height:1;font-synthesis-weight:none}
.leafwrap *{box-sizing:border-box}

.leafwrap .leaf{
  position:relative;width:63mm;height:118mm;box-sizing:border-box;
  overflow:hidden;background:#fff;color:#000;
  print-color-adjust:exact;-webkit-print-color-adjust:exact;
}

.leafwrap .bezel{position:absolute;inset:1.2mm;border:.15mm solid #000;pointer-events:none}
.leafwrap .bezel .cut{position:absolute;inset:-1.35mm;border:.3mm solid #000;box-sizing:border-box}
.leafwrap .bezel .c{position:absolute;width:3.4mm;height:3.4mm;border:0 solid #000}
.leafwrap .bezel .tl{top:-.15mm;left:-.15mm;border-top-width:.5mm;border-left-width:.5mm}
.leafwrap .bezel .tr{top:-.15mm;right:-.15mm;border-top-width:.5mm;border-right-width:.5mm}
.leafwrap .bezel .bl{bottom:-.15mm;left:-.15mm;border-bottom-width:.5mm;border-left-width:.5mm}
.leafwrap .bezel .br{bottom:-.15mm;right:-.15mm;border-bottom-width:.5mm;border-right-width:.5mm}

/* a legend wears the difference in its frame, never in its text */
.leafwrap .leaf.legend .bezel{inset:1.5mm;border-width:.15mm;box-shadow:0 0 0 .45mm #fff,0 0 0 .6mm #000}
.leafwrap .leaf.legend .bezel .cut{inset:-1.65mm;border-width:.6mm}
.leafwrap .leaf.legend .bezel .c{width:4.4mm;height:4.4mm}

.leafwrap .art{position:absolute;top:0;left:0;right:0;height:88mm;overflow:hidden;background:#fff}
.leafwrap .art img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.leafwrap .mana .art{bottom:0;height:auto}

.leafwrap .cost,
.leafwrap .rune{
  position:absolute;top:2.4mm;display:flex;align-items:center;gap:.6mm;background:#fff;
  border:.15mm solid #000;box-shadow:0 0 0 .35mm #fff,0 0 0 .45mm #000;padding:.35mm .9mm;
  font-family:'Alegreya',Georgia,'Times New Roman',serif;font-size:2.7mm;line-height:1;font-weight:800;
}
.leafwrap .cost{left:2.4mm;gap:.95mm}
.leafwrap .hours{margin-right:.45mm}
.leafwrap .rune{right:2.4mm;font-weight:800;letter-spacing:.02em}
.leafwrap .pip{width:1.7mm;height:1.7mm;border:.15mm solid #000;border-radius:50%;display:inline-block}
.leafwrap .pip.W{background:#fff}
.leafwrap .pip.U{background:repeating-linear-gradient(90deg,#000 0 .15mm,#fff .15mm .4mm)}
.leafwrap .pip.B{background:#000}
.leafwrap .pip.R{background:repeating-linear-gradient(45deg,#000 0 .15mm,#fff .15mm .45mm)}
.leafwrap .pip.G{background:radial-gradient(circle,#000 0 .35mm,#fff .35mm)}

.leafwrap .panel{
  position:absolute;left:0;right:0;bottom:0;height:30mm;background:#fff;
  border-top:.3mm solid #000;padding:2.5mm 1.8mm 1.2mm;box-sizing:border-box;
  font-family:'Alegreya',Georgia,'Times New Roman',serif;
}
.leafwrap .seam{
  position:absolute;top:0;left:0;right:0;height:1.1mm;
  background:repeating-linear-gradient(45deg,#000 0 .18mm,#fff .18mm .5mm);
  border-bottom:.1mm solid #000;
}
.leafwrap .orn{
  position:absolute;left:0;right:0;bottom:.7mm;text-align:center;
  font-family:Georgia,'Times New Roman',serif;font-size:2.5mm;line-height:1;
}
.leafwrap .orn::before,
.leafwrap .orn::after{
  content:'';display:inline-block;width:7mm;height:.1mm;background:#000;
  vertical-align:.6mm;margin:0 1.4mm;
}

.leafwrap .nm{margin:0;font-size:3.5mm;line-height:1.04;font-weight:700;letter-spacing:0;flex:none;padding-right:10mm}
.leafwrap .nm.unnamed::before{content:'\00a0'}
.leafwrap .crest{font-size:2.3mm;margin-left:.7mm;vertical-align:.5mm}

.leafwrap .tline{
  display:flex;align-items:center;gap:1.1mm;margin-top:.7mm;padding-bottom:.7mm;
  border-bottom:.15mm solid #000;font-family:'Alegreya SC','Alegreya',Georgia,serif;
  font-weight:500;font-size:2.2mm;line-height:1.1;flex:none;
}
.leafwrap .tline .kind{flex:1;letter-spacing:.05em}
.leafwrap .tline .sicon{width:2.7mm;height:2.7mm}
.leafwrap .sicon{width:2.9mm;height:2.9mm;object-fit:contain;display:inline-block}
.leafwrap .oico{width:3.6mm;height:3.6mm;vertical-align:-1.1mm}
.leafwrap .tline .no{font-weight:700;font-variant-numeric:tabular-nums}

.leafwrap .body{max-height:20.5mm;overflow:hidden;padding-top:.8mm}
.leafwrap .body p{margin:0 0 .9mm}
.leafwrap .kw{
  font-family:'Alegreya SC','Alegreya',Georgia,serif;font-size:2.2mm;line-height:1.2;
  font-weight:700;letter-spacing:.03em;
}
.leafwrap .kw::first-letter{text-transform:uppercase}
.leafwrap .rules{font-size:2.45mm;line-height:1.24}
.leafwrap .rems{position:relative;padding-left:1.6mm;border-left:.2mm solid #000;margin-bottom:.9mm}
.leafwrap .rem{font-size:2mm;line-height:1.2;margin:0 0 .35mm !important}
.leafwrap .rem b{
  font-family:'Alegreya SC','Alegreya',Georgia,serif;font-weight:700;font-size:1.75mm;
  letter-spacing:.05em;text-transform:uppercase;
}
.leafwrap .rem b::after{content:'';display:inline-block;width:1.2mm}
.leafwrap .flav{font-style:italic;font-size:2.2mm;line-height:1.22}
.leafwrap .lozenge{
  display:inline-block;width:1.3mm;height:1.3mm;margin:0 1.3mm 0 0;background:#000;
  transform:rotate(45deg) scale(.82);vertical-align:.15mm;
}
.leafwrap .body.snug .rules{font-size:2.25mm;line-height:1.2}
.leafwrap .body.snug .rem{font-size:1.9mm;line-height:1.16}
.leafwrap .body.snug .flav{font-size:2.05mm;line-height:1.16}
.leafwrap .body.snug p{margin-bottom:.7mm}
.leafwrap .body.tight .rules{font-size:2.1mm;line-height:1.16}
.leafwrap .body.tight .rem{font-size:1.8mm;line-height:1.12}
.leafwrap .body.tight .flav{font-size:1.95mm;line-height:1.12}
.leafwrap .body.tight p{margin-bottom:.5mm}

.leafwrap .pt{
  position:absolute;right:1.6mm;top:-3.6mm;background:#fff;border:.15mm solid #000;
  box-shadow:0 0 0 .35mm #fff,0 0 0 .45mm #000;padding:.4mm 1.2mm;font-size:3.2mm;
  line-height:1;font-weight:800;font-variant-numeric:tabular-nums lining-nums;
}
.leafwrap .pt i{font-style:normal;font-weight:400;margin:0 .2mm}

/* the anatomy callouts — verbatim from Print.svelte. They sit INLINE beside the
   part they name; an absolutely-positioned badge hanging off the card is eaten
   by `.leaf{overflow:hidden}`. */
.leafwrap .cal{
  display:inline-block;min-width:2.9mm;height:2.9mm;margin-left:.7mm;border-radius:50%;
  background:#000;color:#fff;font-size:1.9mm;line-height:2.9mm;text-align:center;
  font-weight:700;vertical-align:.3mm;font-family:'Alegreya',Georgia,serif;
}
.leafwrap .rules .cal,
.leafwrap .rem .cal{margin-left:0;margin-right:.8mm}
