/* MagicDuel creature playing cards - THE template (spec 6.1). One layout, two sizes: every inner
   measure is em off font-size: calc(var(--w) / 15), so the 150 px deck card and the 300 px
   inspect card are one stylesheet. Rendered by core/Cards/cards.render.php only.
   Fonts: SIL OFL, downloaded from Google Fonts on 2026-09-02, relative to this file. */

@font-face { font-family: "IM Fell English"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/imfell-english-regular.woff2) format("woff2"); }
@font-face { font-family: "IM Fell English"; font-style: italic; font-weight: 400; font-display: swap; src: url(fonts/imfell-english-italic.woff2) format("woff2"); }
@font-face { font-family: "Almendra"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/almendra-regular.woff2) format("woff2"); }
@font-face { font-family: "Almendra"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/almendra-bold.woff2) format("woff2"); }

.mdcard {
  --w: 150px;
  position: relative; width: var(--w); height: calc(var(--w) * 1.5);
  font-size: calc(var(--w) / 15); color: #3a2113; flex: none; box-sizing: border-box;
  background-position: center; background-size: 100% 100%; background-repeat: no-repeat;
  filter: drop-shadow(0 .12em .25em rgba(0, 0, 0, .35));
  user-select: none;
}
/* The thumb carries the same words as the inspect card in half the width, so at the shared
   w/15 scale its text was the one size in the set that was genuinely hard to read. The thumb
   alone is nudged up; the large card keeps w/15, which is already comfortable. */
.mdcard-small { --w: 150px; font-size: calc(var(--w) / 13.2); }
.mdcard-large { --w: 300px; }

.mdcard .mdcard-title {
  position: absolute; left: 6%; right: 6%; top: 8.5%; text-align: center;
  font-family: "Monotype Corsiva", "Almendra", cursive; font-weight: 700; font-size: 1.35em; line-height: 1;
  letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: clip;
}
.mdcard .mdcard-sub {
  position: absolute; left: 8%; right: 8%; top: 16%; text-align: center;
  font-family: "IM Fell English", Georgia, serif; font-style: italic; font-size: .9em; line-height: 1; opacity: .85;
  white-space: nowrap; overflow: hidden;
}
/* the thumb's subtitle is the line that suffers most from the half-width: it is italic, it is the
   smallest thing on the card and it carries the target rule ("Weak Creatures", "Multiple") */
.mdcard-small .mdcard-sub { font-size: 1.02em; opacity: .9; }
/* the picture runs nearly edge to edge under the subtitle (owner's rule, 2026-09-02) and sits
   on the icon strip, which in turn sits on the top of the canvas's ruled band */
.mdcard .mdcard-art {
  position: absolute; left: 3%; width: 94%; top: 20.5%; height: 39%;
  object-fit: contain; object-position: center bottom; mix-blend-mode: multiply;
}
.mdcard .mdcard-icons {
  position: absolute; left: 9%; right: 9%; top: 60%; height: 6%;
  display: flex; justify-content: space-between; align-items: center;
}
.mdcard .mdcard-ic { display: inline-flex; align-items: center; gap: .18em; }
.mdcard .mdcard-ic i {
  display: inline-flex; width: 1.5em; height: 1.5em; border: .1em solid #3a2113; border-radius: 50%;
  padding: .18em; box-sizing: border-box; overflow: hidden;
}
.mdcard .mdcard-ic i img { width: 100%; height: 100%; display: block; }
/* An icon slot with no glyph draws nothing (2026-09-21): a tactic card has no ability, target,
   side or stat to show, and four empty rings read as a face left unfinished (on the small ledger
   cards they even ran past the card's edge). visibility, not display, so a card with some glyphs
   keeps each one where the strip puts it. */
.mdcard .mdcard-ic i:empty { visibility: hidden; }
.mdcard .mdcard-ic b { font-family: "IM Fell English", Georgia, serif; font-weight: 400; font-size: .95em; line-height: 1; }
.mdcard .mdcard-rule {
  position: absolute; left: 10%; right: 7%; top: 67%; height: 21%;
  font-family: "IM Fell English", Georgia, serif; font-style: italic; font-size: .92em; line-height: 1.22; overflow: hidden;
}
.mdcard .mdcard-seal { position: absolute; left: 5%; bottom: 3%; width: 17%; height: auto; filter: drop-shadow(0 .06em .1em rgba(0, 0, 0, .35)); }
.mdcard .mdcard-code { position: absolute; right: 8%; bottom: 5.5%; font-family: "IM Fell English", Georgia, serif; font-size: .8em; opacity: .8; letter-spacing: .04em; }

/* a retired definition stays in every holding, greyed and named */
.mdcard .mdcard-ribbon { display: none; }
.mdcard-retired { opacity: .6; }
.mdcard-retired .mdcard-ribbon {
  display: block; position: absolute; left: -4%; right: -4%; top: 44%; text-align: center;
  font-family: "Almendra", Georgia, serif; font-weight: 700; font-size: 1.1em; letter-spacing: .2em; text-transform: uppercase;
  color: #7a3a2a; background: rgba(245, 240, 230, .8); padding: .2em 0; transform: rotate(-12deg);
}