/* The Trader Card (63 × 88 mm), shared by the Traders pages, the kiosk, the print sheet and the home page. */
.t-card {
  container-type: inline-size;
  position: relative;
  width: 100%;
  aspect-ratio: 63 / 88;
  border-radius: 5% / 3.6%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  color: #fff;
  font-family: var(--body);
  background:
    radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--tc) 50%, transparent), transparent 62%),
    linear-gradient(160deg, #1d2356, #0c0f2c 70%);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5);
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.t-card::before { content: ''; position: absolute; inset: 2.6cqw; border: 0.9cqw solid color-mix(in srgb, var(--tc) 75%, #fff); border-radius: 3.2cqw; pointer-events: none; }
.t-card::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 0.5cqw, transparent 0.5cqw 4cqw); pointer-events: none; }
.t-card.founding::before { border-color: #f5c542; box-shadow: inset 0 0 4cqw rgba(245, 197, 66, 0.45), 0 0 0 0.5cqw rgba(255, 233, 168, 0.5); }
.t-card > * { position: relative; z-index: 1; }
.tc-top { display: flex; justify-content: space-between; align-items: center; margin: 7cqw 8cqw 0; font: 700 3.6cqw var(--pixel); letter-spacing: 0.12em; }
.tc-kind { color: color-mix(in srgb, var(--tc) 60%, #fff); }
.tc-brand { display: inline-flex; align-items: center; gap: 1.6cqw; }
.tc-brand i { width: 2.8cqw; height: 3.8cqw; border: 0.6cqw solid #f5c542; border-radius: 0.6cqw; transform: rotate(-8deg); }
.k-head .tc-brand i { width: 14px; height: 19px; border-width: 3px; border-radius: 3px; }
.tc-emblem { display: flex; justify-content: center; margin-top: 4cqw; }
.tc-emblem svg { width: 42cqw; height: auto; filter: drop-shadow(0 2cqw 3cqw rgba(0, 0, 0, 0.5)); }
.tc-name { text-align: center; font: 700 10cqw var(--pixel); line-height: 1.1; margin: 3cqw 6cqw 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 0.6cqw 0 rgba(0, 0, 0, 0.5); }
.tc-team { align-self: center; margin-top: 1.6cqw; background: var(--tc); color: #10132b; font: 700 4.2cqw var(--pixel); padding: 0.6cqw 3.6cqw; border-radius: 99px; }
.tc-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 4.5cqw 8cqw 0; background: rgba(0, 0, 0, 0.3); border-radius: 3cqw; padding: 2.6cqw 0; text-align: center; }
.tc-stats b { display: block; font: 700 5cqw var(--pixel); line-height: 1.2; }
.tc-stats span { display: block; font-size: 2.8cqw; color: rgba(255, 255, 255, 0.7); text-transform: uppercase; letter-spacing: 0.06em; }
.tc-live { grid-template-columns: 1fr; padding: 3.4cqw 0; }
.tc-live b { font-size: 3.6cqw; letter-spacing: 0.08em; }
.tc-foot { display: flex; justify-content: space-between; align-items: center; margin: auto 8cqw 7cqw; font-size: 3.2cqw; color: rgba(255, 255, 255, 0.75); }
.tc-tag { font: 700 4.6cqw var(--pixel); color: #fff; letter-spacing: 0.04em; }
.tc-founding { color: #f5c542; font-weight: 700; letter-spacing: 0.04em; }
.t-card.back { background: linear-gradient(160deg, color-mix(in srgb, var(--tc) 32%, #12163a), #0c0f2c 75%); }
.tc-qr { width: 60cqw; margin: 6cqw auto 0; background: #fff; border-radius: 3cqw; padding: 2.2cqw; }
.tc-qr svg { display: block; width: 100%; height: auto; }
.t-qr-missing { aspect-ratio: 1; display: grid; place-items: center; color: #555; font-size: 4cqw; }
.tc-code { text-align: center; font: 700 4.4cqw ui-monospace, Consolas, monospace; letter-spacing: 0.18em; margin-top: 2.4cqw; }
.tc-how { text-align: center; font-size: 3.7cqw; line-height: 1.45; margin: 3cqw 7cqw 0; }
.tc-lost { text-align: center; font-size: 2.7cqw; color: rgba(255, 255, 255, 0.6); margin: auto 9cqw 7cqw; line-height: 1.4; }


/* ---------- Full-art Trader Card, laid out like a real full-art Pokémon card (the user's example, 2026-10-21) ----------
   Bright full art inside a team-coloured foil frame, black text with a white halo over the art. */
.t-card.full { --ink: #16182c; --halo: 0 0 0.5cqw #fff, 0 0 1.1cqw #fff, 0 0 2cqw rgba(255, 255, 255, 0.85); color: var(--ink);
  background:
    conic-gradient(from 210deg at 30% 40%, rgba(255, 255, 255, 0.45), transparent 12%, rgba(255, 255, 255, 0.3) 25%, transparent 38%, rgba(255, 255, 255, 0.4) 55%, transparent 70%, rgba(255, 255, 255, 0.35) 85%, transparent),
    linear-gradient(150deg, color-mix(in srgb, var(--tc) 50%, #fff), var(--tc) 45%, var(--tc2, var(--tc)));
  border-radius: 4.5% / 3.3%; }
.t-card.full::after { display: none; }
.t-card.full::before { inset: 4.4cqw; border: 0.5cqw solid rgba(255, 255, 255, 0.9); border-radius: 2.6cqw; box-shadow: 0 0 2cqw rgba(0, 0, 0, 0.25); z-index: 3; }
/* Founding Traders keep their team colour and get a gold inner border. */
.t-card.full.founding::before { border: 0.9cqw solid #f0c040; box-shadow: 0 0 0 0.5cqw #fff8dc, 0 0 2.4cqw rgba(240, 192, 64, 0.85); }
.tf-art { position: absolute !important; inset: 4.4cqw; border-radius: 2.6cqw; overflow: hidden; background: center 22% / cover no-repeat; z-index: 0 !important; }
.tf-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.35) 0%, transparent 16%, transparent 50%, rgba(255, 255, 255, 0.3) 66%, rgba(255, 255, 255, 0.6) 100%); }
.tf-art.none { display: grid; place-items: center; padding-bottom: 34%; background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--tc) 35%, #fff), color-mix(in srgb, var(--tc) 20%, #dfe6ff) 70%); }
.tf-art.none svg { width: 44cqw; height: auto; filter: drop-shadow(0 2cqw 3cqw rgba(0, 0, 0, 0.25)); }
.tf-art.crest { display: grid; place-items: center; padding-bottom: 30%; }
.tf-art.crest svg { position: relative; z-index: 1; width: 40cqw; height: auto; filter: drop-shadow(0 1.5cqw 3cqw rgba(0, 0, 0, 0.35)); }

/* Pokémon card text layer */
.t-card.full { --card-font: 'Gill Sans', 'Gill Sans MT', 'Gill Sans Nova', Inter, system-ui, sans-serif; }
.pk-top { display: flex; align-items: center; gap: 1.2cqw; padding: 7cqw 6.4cqw 0 6.6cqw; font-family: var(--card-font); }
.pk-stage { flex: none; align-self: flex-start; margin: -1.6cqw 0.4cqw 0 -1.4cqw; background: linear-gradient(180deg, #ffffff, #c3c6cc 55%, #eceef1); color: #2a2a2a; font: italic 800 2.7cqw var(--card-font); letter-spacing: 0.03em; padding: 0.4cqw 2.6cqw 0.4cqw 1.6cqw; border-radius: 0.8cqw 2.8cqw 2.8cqw 0.8cqw; border: 0.3cqw solid #8c9097; box-shadow: 0 0.3cqw 0.6cqw rgba(0, 0, 0, 0.35); }
.pk-name { flex: 1; min-width: 0; margin-top: 0.6cqw; font: 700 6.6cqw var(--card-font); line-height: 1.05; color: #111; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: var(--halo); }
.pk-hp { flex: none; display: flex; align-items: baseline; font: 800 8.6cqw var(--card-font); line-height: 1; color: #111; text-shadow: var(--halo); }
.pk-hp small { font-size: 2.9cqw; font-weight: 800; margin-right: 0.4cqw; }
.pk-top .t-energy { width: 8cqw; height: 8cqw; flex: none; filter: drop-shadow(0 0.3cqw 0.6cqw rgba(0, 0, 0, 0.35)); }
.pk-body { margin-top: auto; padding: 0 6.6cqw 5.8cqw; color: #111; font-family: var(--card-font); }
.pk-ability { display: flex; align-items: center; gap: 1.6cqw; }
.pk-pill { flex: none; background: linear-gradient(180deg, #e8513f, #b5231a); color: #fff; font: italic 800 3cqw var(--card-font); padding: 0.4cqw 2.8cqw; border-radius: 99px; border: 0.4cqw solid #fff; box-shadow: 0 0.3cqw 0.8cqw rgba(0, 0, 0, 0.3); }
.pk-ability b { font: 800 5.8cqw var(--card-font); color: #c2271c; -webkit-text-stroke: 0.7cqw #fff; paint-order: stroke fill; }
.pk-body p { margin: 0.4cqw 0 2.4cqw; font-size: 3.2cqw; line-height: 1.28; font-weight: 600; text-shadow: var(--halo); }
.pk-attack { display: flex; align-items: center; gap: 1.6cqw; }
.pk-cost { display: inline-flex; gap: 0.5cqw; flex: none; }
.pk-cost .t-energy { width: 5cqw; height: 5cqw; filter: drop-shadow(0 0.2cqw 0.4cqw rgba(0, 0, 0, 0.35)); }
.pk-attack b { flex: 1; font: 800 6.2cqw var(--card-font); text-shadow: var(--halo); }
.pk-dmg { font: 800 7.4cqw var(--card-font); text-shadow: var(--halo); }
.pk-stats { display: flex; justify-content: space-between; gap: 1.2cqw; padding: 0.8cqw 1.2cqw; border-top: 0.3cqw solid rgba(0, 0, 0, 0.45); border-bottom: 0.3cqw solid rgba(0, 0, 0, 0.45); background: linear-gradient(90deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.55)); font-size: 2.6cqw; font-weight: 700; }
.pk-stats span { display: inline-flex; align-items: center; gap: 0.7cqw; min-width: 0; }
.pk-stats i { font-style: normal; font-weight: 600; font-size: 2.3cqw; margin-right: 0.3cqw; }
.pk-stats .t-energy { width: 3.6cqw; height: 3.6cqw; }
.pk-stats b { font-weight: 800; }
.pk-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 3cqw; margin-top: 1.2cqw; font-size: 2.3cqw; line-height: 1.3; font-weight: 600; text-shadow: var(--halo); }
.pk-illus { display: flex; flex-direction: column; white-space: nowrap; }
.pk-num { font-weight: 800; font-size: 2.4cqw; }
.pk-foot i { text-align: right; max-width: 62%; font-size: 2.6cqw; font-weight: 600; font-style: italic; }

/* ---------- Card back: classic blue trading-card back with our own emblem (no Pokéball, no Pokémon logo) ---------- */
.t-card.back.classic { color: #fff;
  background:
    radial-gradient(circle at 12% 8%, rgba(120, 170, 255, 0.55) 0 4%, transparent 9%),
    radial-gradient(circle at 85% 14%, rgba(20, 50, 140, 0.8) 0 5%, transparent 10%),
    radial-gradient(circle at 70% 92%, rgba(120, 170, 255, 0.45) 0 5%, transparent 11%),
    radial-gradient(circle at 8% 70%, rgba(15, 40, 120, 0.8) 0 6%, transparent 12%),
    radial-gradient(circle at 94% 60%, rgba(110, 160, 250, 0.5) 0 4%, transparent 9%),
    radial-gradient(circle at 30% 97%, rgba(20, 50, 140, 0.7) 0 4%, transparent 9%),
    radial-gradient(circle at 50% 3%, rgba(110, 160, 250, 0.45) 0 4%, transparent 10%),
    linear-gradient(160deg, #3f6fd8, #1f4bb0 45%, #2c5ccc 75%, #1a3f9c); }
.t-card.back.classic::before { inset: 4.2cqw; border: none; border-radius: 3.2cqw; box-shadow: inset 0 0 0 0.5cqw rgba(255, 255, 255, 0.25), 0 0 2cqw rgba(0, 0, 0, 0.35); background: radial-gradient(ellipse at 50% 50%, #8fd0ff 0%, #4a9cf0 22%, #2a6ad6 45%, #173f9e 75%, #0f2c78 100%); z-index: 0; }
.t-card.back.classic::after { display: none; }
.tb-field { position: absolute !important; inset: 4.2cqw; border-radius: 3.2cqw; overflow: hidden; z-index: 1; }
.tb-swirl { width: 100%; height: 100%; display: block; animation: tbSpin 60s linear infinite; transform-origin: 50% 50%; }
@keyframes tbSpin { to { transform: rotate(360deg); } }
@media print, (prefers-reduced-motion: reduce) { .tb-swirl { animation: none; } }
.tb-center { position: absolute !important; left: 0; right: 0; top: 30%; display: flex; flex-direction: column; align-items: center; z-index: 2; transform: rotate(-8deg); }
.tb-emblem { width: 30cqw; height: 30cqw; filter: drop-shadow(0 1.5cqw 2cqw rgba(0, 0, 0, 0.45)); }
.tb-word { display: flex; flex-direction: column; align-items: center; margin-top: -3cqw; font: 700 13cqw/0.95 var(--pixel); letter-spacing: 0.02em; color: #ffcb05; -webkit-text-stroke: 2.2cqw #2a5bc0; paint-order: stroke fill; filter: drop-shadow(0 1cqw 0 #0e2a6b); }
.tb-word span:last-child { font-size: 11.5cqw; }
.tb-sub { margin-top: 1.5cqw; font: italic 800 3.4cqw var(--body); letter-spacing: 0.3em; color: #fff; text-shadow: 0 0.4cqw 0 #0e2a6b; }
.tb-corner { position: absolute !important; left: 7cqw; bottom: 7cqw; display: flex; align-items: flex-end; gap: 2cqw; z-index: 2; }
.tb-qr { width: 15cqw; background: #fff; border-radius: 1.6cqw; padding: 1cqw; box-shadow: 0 0.6cqw 1.5cqw rgba(0, 0, 0, 0.35); }
.tb-qr svg { display: block; width: 100%; height: auto; }
.tb-id { display: flex; flex-direction: column; font-size: 2.4cqw; line-height: 1.3; text-shadow: 0 0.3cqw 0 #0e2a6b; }
.tb-id b { font: 700 3.3cqw var(--pixel); letter-spacing: 0.04em; }
.tb-club { position: absolute !important; right: 7cqw; bottom: 7cqw; z-index: 2; font: italic 800 2.6cqw var(--body); color: #ffcb05; text-shadow: 0 0.3cqw 0 #0e2a6b; letter-spacing: 0.04em; }