/* Shared card component snapshot from TBFCtools Signal Grid V4.2 master. Native text metrics and glyphs are measured from EA. */
@font-face{font-family:YamalEACondensed;src:url('./assets/product-ui/ea-condensed-regular.woff');font-weight:100 400}@font-face{font-family:YamalEACondensed;src:url('./assets/product-ui/ea-condensed-medium.woff');font-weight:500 900}@font-face{font-family:YamalEAUI;src:url('./assets/product-ui/ea-ui-regular.woff');font-weight:100 400}@font-face{font-family:YamalEAUI;src:url('./assets/product-ui/ea-ui-medium.woff');font-weight:500 900}@font-face{font-family:YamalEAIcons;src:url('./assets/product-ui/ea-icons-11414.woff')}@font-face{font-family:'SG EA UltimateTeamCondensed';src:url('./assets/product-ui/ea-condensed-regular.woff');font-weight:100 400}@font-face{font-family:'SG EA UltimateTeamCondensed';src:url('./assets/product-ui/ea-condensed-medium.woff');font-weight:500 900}@font-face{font-family:'SG EA UltimateTeam-Icons';src:url('./assets/product-ui/ea-icons-11414.woff')}
.demo-card-info{--sg-radius-status:0.25rem;--sg-selection-line:rgb(36 222 164 / 56%);--sg-positive:var(--sg-brand-mint);--sg-brand-mint:#24dea4;--sg-canvas-deep:var(--sg-neutral-1000);--sg-neutral-1000:#06141a;--sg-line:rgb(135 165 169 / 30%);--sg-ink-muted:var(--sg-neutral-500);--sg-neutral-500:#8babb0;--sg-control:#081f28;--sg-price:var(--sg-gold-400);--sg-gold-400:#f2cf6d;--sg-surface:var(--sg-neutral-850);--sg-neutral-850:#12313c;--sg-white:#f5faf8;--sg-evolution-top:#00a7cc;--sg-evolution-bottom:#007d99;--sg-ink:var(--sg-white);--sg-focus:var(--sg-blue-400);--sg-blue-400:#69d5f2;--sg-text-11:0.6875rem;--sg-text-13:0.8125rem;--sg-text-10:0.625rem;--sg-radius-control:0.375rem;--sg-font:"UltimateTeam", sans-serif;--sg-space-1:0.25rem;--sg-text-12:0.75rem;--sg-text-14:0.875rem;--sg-line-soft:rgb(135 165 169 / 16%);--sg-ink-subtle:var(--sg-neutral-300);--sg-neutral-300:#c6d9db;--sg-control-height-touch:2.75rem;--sg-surface-deep:var(--sg-neutral-925);--sg-neutral-925:#0b222b;--sg-storage:var(--sg-violet-400);--sg-violet-400:#c18de6;--sg-storage-marker-fill:color-mix(in srgb, var(--sg-storage) 26%, var(--sg-surface-deep));--sg-warning:var(--sg-amber-400);--sg-amber-400:#f3c45b;--sg-danger:var(--sg-red-400);--sg-red-400:#ff6878;--sg-info:var(--sg-brand-cyan);--sg-brand-cyan:#1bc8ea;}
  .sg-card-native { --sg-card-meta-y: 107px; --sg-card-lock-x: 58px; --sg-card-icon-axis-x: calc(var(--sg-card-lock-x) + var(--sg-card-lock-hit-size) / 2); --sg-card-marker-x: calc(var(--sg-card-icon-axis-x) - var(--sg-card-marker-size) / 2); --sg-card-marker-center-y: 98px; --sg-card-lock-y: 3px; --sg-card-lock-hit-size: 36px; --sg-card-marker-size: 14px; --sg-card-lock-face-size: 14px; --sg-card-side-overlap: 19px; position: relative; inline-size: 82px; block-size: 114px; flex: 0 0 auto; transform: scale(1.5); }
  .sg-card-native[data-card-native-size="large"] { --sg-card-meta-y: 178px; --sg-card-lock-x: 107px; --sg-card-marker-center-y: 169px; --sg-card-lock-y: 15px; --sg-card-marker-size: 18px; --sg-card-lock-face-size: 20px; --sg-card-side-overlap: 21px; inline-size: 144px; block-size: 200px; transform: scale(1.5); }
  .sg-card-native > img { display: block; inline-size: 100%; block-size: 100%; object-fit: contain; }
  .sg-card-native__price { position: absolute; inset-block-start: 0; inset-inline-start: 50%; transform: translateX(-50%); min-block-size: 20px; display: inline-flex; align-items: center; justify-content: center; padding: 1px 4px 0; border: .5px solid var(--sg-card-price-line, rgb(174 141 87)); border-radius: var(--sg-radius-status); background: var(--sg-card-price-bg, rgb(9 31 39 / 93%)); color: var(--sg-card-price-ink, rgb(246 207 126)); font-family: "SG EA UltimateTeamCondensed", sans-serif; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1; white-space: nowrap; }
  .sg-card-native__price[data-card-price-tone="tradeable"] { --sg-card-price-line: var(--sg-selection-line); --sg-card-price-ink: var(--sg-positive); --sg-card-price-bg: color-mix(in srgb, var(--sg-positive) 10%, var(--sg-canvas-deep)); }
  .sg-card-native__price[data-card-price-tone="unavailable"] { --sg-card-price-line: var(--sg-line); --sg-card-price-ink: var(--sg-ink-muted); --sg-card-price-bg: var(--sg-control); }
  .sg-card-native[data-card-native-size="small"] .sg-card-native__price[data-card-price-length="long"],
  .sg-card-native__price[data-card-price-size="small"][data-card-price-length="long"] { font-size: 12px; padding-inline: 2px; }
  .sg-card-native__risk { position: absolute; z-index: 5; inset-block-start: calc(var(--sg-card-lock-y) + var(--sg-card-lock-hit-size) / 2); inset-inline-start: calc(100% - var(--sg-card-icon-axis-x)); transform: translate(-50%, -50%); pointer-events: none; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__price { inset-block-start: 8px; min-block-size: 20px; transform: translateX(-50%) scale(1.05); }
  .sg-card-native__positions,
  .sg-card-native__attributes { position: absolute; display: grid; justify-items: center; gap: 2px; color: var(--sg-ea-tier-ink, var(--sg-price)); font-family: "SG EA UltimateTeamCondensed", sans-serif; font-size: 12px; font-weight: 300; line-height: 1; white-space: nowrap; }
  .sg-card-native__positions[hidden],
  .sg-card-native__attributes[hidden],
  .sg-card-native__meta[hidden] { display: none; }
  .sg-card-native__positions > span,
  .sg-card-native__attributes > span { inline-size: 22px; block-size: 13px; box-sizing: border-box; display: grid; place-items: center; padding: 0; border: 1px solid currentColor; border-radius: var(--sg-radius-status); background: var(--sg-ea-tier-bg, var(--sg-surface)); line-height: 15px; }
  .sg-card-native__attributes > span[hidden] { display: none; }
  .sg-card-native[data-card-native-size="small"] :is(.sg-card-native__positions, .sg-card-native__attributes) > span { inline-size: max-content; min-inline-size: 24px; block-size: 14px; padding-inline: 1px; border-width: .5px; font-size: 11px; line-height: 1; }
  .sg-card-native[data-card-native-state="legacy"] :is(.sg-card-native__positions, .sg-card-native__attributes) > span:not([data-card-slot="evolution"]) { border-color: transparent; background: rgb(0 64 166); color: var(--sg-white); }
  .sg-card-native__attributes > [data-card-slot="evolution"] { display: inline-flex; align-items: center; gap: 1px; border: 0; background: linear-gradient(var(--sg-evolution-top), var(--sg-evolution-bottom)); color: var(--sg-canvas-deep); }
  .sg-card-native__attributes > [data-card-slot="evolution"]::before { content: "\E001"; font-family: "SG EA UltimateTeam-Icons"; font-weight: 400; }
  .sg-card-native__attributes { inset-block-start: calc(50% + 1.7px); inset-inline-start: calc(100% - var(--sg-card-side-overlap)); transform: translateY(-50%) scale(.9); }
  .sg-card-native__positions { inset-block-start: 50px; inset-inline-start: -10px; }
  .sg-card-native[data-card-native-size="small"] .sg-card-native__positions { inset-block-start: 54px; transform: translateY(-50%) scale(.9); transform-origin: right center; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__positions,
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes { gap: 4px; font-size: 14px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__positions > span { inline-size: 28px; block-size: 16px; box-sizing: border-box; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes > span { inline-size: 28px; block-size: 18px; line-height: 16px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes { inset-block-start: 44px; block-size: 108px; display: flex; flex-direction: column; justify-content: center; transform: none; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes > span { flex: 0 0 18px; }
  .sg-card-native[data-card-native-size="small"] .sg-card-native__attributes[data-card-slot-count="4"] { inset-block-start: calc(50% - 1px); gap: 1px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes[data-card-slot-count="5"] { inset-block-start: 46px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes[data-card-slot-count="6"] { inset-block-start: 44px; block-size: 112px; gap: 2px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__attributes[data-card-slot-count="6"] > span { block-size: 17px; flex-basis: 17px; line-height: 15px; }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__positions { inset-inline-start: auto; inset-inline-end: calc(100% - var(--sg-card-side-overlap)); }
  .sg-card-native__meta { position: absolute; inset-block-start: var(--sg-card-meta-y); inset-inline-start: calc(50% - 1px); transform: translateX(-50%); block-size: 18px; box-sizing: border-box; display: inline-flex; align-items: center; gap: 0; padding: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 35%, transparent); border-radius: var(--sg-radius-status); background: var(--sg-canvas-deep); color: var(--sg-ink); font-family: "SG EA UltimateTeamCondensed", sans-serif; white-space: nowrap; appearance: none; cursor: pointer; }
  .sg-card-native__meta:focus-visible { outline: 2px solid var(--sg-focus); outline-offset: 2px; }
  .sg-card-native__meta > span { display: inline-flex; flex: none; align-items: center; justify-content: center; block-size: 100%; white-space: nowrap; line-height: 1; }
  .sg-card-native__meta > [data-card-meta-part="grade"] { padding-inline: 4px; border-inline-end: 1px solid color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 40%, transparent); background: color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 12%, transparent); color: var(--sg-card-meta-line, var(--sg-price)); font-size: var(--sg-text-11); font-weight: 700; }
  .sg-card-native__meta > [data-card-meta-part="peak"] { padding-inline: 4px; font-size: var(--sg-text-13); font-weight: 700; font-variant-numeric: tabular-nums; }
  .sg-card-native__meta > [data-card-meta-part="position"] { padding-inline-end: 4px; color: var(--sg-ink-muted); font-size: var(--sg-text-10); font-weight: 600; }
  .sg-card-native[data-card-native-state="legacy"] .sg-card-native__meta > [data-card-meta-part="grade"] { background: rgb(0 64 166); color: var(--sg-white); }
  /* One large-card rating plate: grade / score / position. Small-card legacy slots retain their original density. */
  .sg-card-native[data-card-native-size="large"] .sg-card-native__meta {
    block-size: 22px;
    min-inline-size: 96px;
    display: grid;
    inline-size: max-content;
    grid-template-columns: max-content max-content max-content;
    border-color: color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 32%, var(--sg-canvas-deep));
    border-radius: var(--sg-radius-control);
    background: color-mix(in srgb, var(--sg-surface) 30%, var(--sg-canvas-deep));
    font-family: var(--sg-font);
    font-style: normal;
    line-height: 1;
  }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__meta > span {
    box-sizing: border-box;
    padding-inline: var(--sg-space-1);
    text-box: trim-both cap alphabetic;
  }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__meta > [data-card-meta-part="grade"] {
    min-inline-size: 28px;
    border-start-start-radius: calc(var(--sg-radius-control) - 1px);
    border-end-start-radius: calc(var(--sg-radius-control) - 1px);
    border-inline-end-color: color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 24%, transparent);
    background: color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 16%, transparent);
    font-size: var(--sg-text-12);
    font-weight: 700;
  }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__meta > [data-card-meta-part="peak"] {
    min-inline-size: 40px;
    color: var(--sg-ink);
    font-size: var(--sg-text-14);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
  }
  .sg-card-native[data-card-native-size="large"] .sg-card-native__meta > [data-card-meta-part="position"] {
    min-inline-size: 26px;
    border-inline-start: 1px solid var(--sg-line-soft);
    color: var(--sg-ink-subtle);
    font-size: var(--sg-text-11);
    font-weight: 600;
  }
  .sg-card-native[data-card-native-size="large"] button.sg-card-native__meta { overflow: visible; }
  .sg-card-native[data-card-native-size="large"] button.sg-card-native__meta::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-start: 50%;
    block-size: max(100%, var(--sg-control-height-touch));
    transform: translateY(-50%);
  }
  .sg-card-native[data-card-native-size="large"][data-card-native-state="legacy"] .sg-card-native__meta > [data-card-meta-part="grade"] {
    background: rgb(0 64 166);
    color: var(--sg-white);
  }
  @media (hover: hover) and (pointer: fine) {
    .sg-card-native[data-card-native-size="large"] button.sg-card-native__meta:hover {
      border-color: color-mix(in srgb, var(--sg-card-meta-line, var(--sg-price)) 65%, var(--sg-canvas-deep));
      background: var(--sg-surface);
    }
  }
  .sg-card-native__markers { position: absolute; inset-inline-start: var(--sg-card-marker-x); inset-block-start: var(--sg-card-marker-center-y); display: flex; flex-direction: column; gap: 2px; transform: translateY(-50%); }
  .sg-card-native__markers--left { inset-inline-start: calc(100% - var(--sg-card-icon-axis-x) - var(--sg-card-marker-size) / 2); }
  .sg-card-native[data-card-native-size="small"]:has(.sg-card-native__markers > .sg-card-native__marker:nth-child(2)) { --sg-card-meta-y: 115px; }
  .sg-card-native__marker { box-sizing: border-box; inline-size: var(--sg-card-marker-size); block-size: var(--sg-card-marker-size); display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 60%, var(--sg-surface-deep)); border-radius: var(--sg-radius-status); background: color-mix(in srgb, currentColor 26%, var(--sg-surface-deep)); color: var(--sg-ink-subtle); }
  .sg-card-native__marker svg { display: block; inline-size: 72%; block-size: 72%; fill: currentColor; }
  .sg-card-native__ea-icon { font-family: "SG EA UltimateTeam-Icons", sans-serif; font-style: normal; font-weight: 400; line-height: 1; }
  .sg-card-native[data-card-all-mounted] .sg-card-native__lock { pointer-events: none; cursor: default; }
  .sg-card-native[data-card-all-mounted] .sg-card-native__meta { cursor: default; pointer-events: none; }
  .sg-card-native[data-card-all-mounted] .sg-card-native__attributes > span { font-size: 12px; }
  .sg-card-native[data-card-native-size] .sg-card-native__attributes > span[data-card-slot="special"] { font-family: "SG EA UltimateTeam-Icons", sans-serif; font-size: 12px; line-height: 1; }
  .sg-card-native__markers[hidden],
  .sg-card-native__lock[hidden] { display: none; }
  .sg-card-native__marker[data-card-marker-tone="storage"] { color: var(--sg-storage); background: var(--sg-storage-marker-fill); }
  .sg-card-native__marker[data-card-marker-tone="warning"] { color: var(--sg-warning); }
  .sg-card-native__marker[data-card-marker-tone="danger"] { color: var(--sg-danger); }
  .sg-card-native__marker[data-card-marker-tone="info"] { color: var(--sg-info); }
  .sg-card-native__lock { position: absolute; inset-block-start: var(--sg-card-lock-y); inset-inline-start: var(--sg-card-lock-x); inline-size: var(--sg-card-lock-hit-size); block-size: var(--sg-card-lock-hit-size); display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: var(--sg-danger); cursor: pointer; }
  .sg-card-native__lock[role="img"] { pointer-events: none; cursor: default; }
  .sg-card-native__lock:disabled { pointer-events: none; cursor: default; opacity: 1; }
  .sg-card-native__lock[data-card-lock-state="unlocked"] { color: var(--sg-positive); }
  .sg-card-native__lock i { box-sizing: border-box; inline-size: var(--sg-card-lock-face-size); block-size: var(--sg-card-lock-face-size); display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 60%, var(--sg-surface-deep)); border-radius: var(--sg-radius-status); background: color-mix(in srgb, currentColor 26%, var(--sg-surface-deep)); font-style: normal; }
  .sg-card-native__lock i svg { display: block; inline-size: 72%; block-size: 72%; fill: currentColor; }
  .sg-card-native__lock > span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.demo-card-info{--sg-radius-status:0.25rem;--sg-selection-line:rgb(36 222 164 / 56%);--sg-positive:var(--sg-brand-mint);--sg-brand-mint:#24dea4;--sg-canvas-deep:var(--sg-neutral-1000);--sg-neutral-1000:#06141a;--sg-line:rgb(135 165 169 / 30%);--sg-ink-muted:var(--sg-neutral-500);--sg-neutral-500:#8babb0;--sg-control:#081f28;--sg-price:var(--sg-gold-400);--sg-gold-400:#f2cf6d;--sg-surface:var(--sg-neutral-850);--sg-neutral-850:#12313c;--sg-white:#f5faf8;--sg-evolution-top:#00a7cc;--sg-evolution-bottom:#007d99;--sg-ink:var(--sg-white);--sg-focus:var(--sg-blue-400);--sg-blue-400:#69d5f2;--sg-text-11:0.6875rem;--sg-text-13:0.8125rem;--sg-text-10:0.625rem;--sg-radius-control:0.375rem;--sg-font:"UltimateTeam", sans-serif;--sg-space-1:0.25rem;--sg-text-12:0.75rem;--sg-text-14:0.875rem;--sg-line-soft:rgb(135 165 169 / 16%);--sg-ink-subtle:var(--sg-neutral-300);--sg-neutral-300:#c6d9db;--sg-control-height-touch:2.75rem;--sg-surface-deep:var(--sg-neutral-925);--sg-neutral-925:#0b222b;--sg-storage:var(--sg-violet-400);--sg-violet-400:#c18de6;--sg-storage-marker-fill:color-mix(in srgb, var(--sg-storage) 26%, var(--sg-surface-deep));--sg-warning:var(--sg-amber-400);--sg-amber-400:#f3c45b;--sg-danger:var(--sg-red-400);--sg-red-400:#ff6878;--sg-info:var(--sg-brand-cyan);--sg-brand-cyan:#1bc8ea;--sg-font:YamalEAUI,sans-serif}.demo-card-info .sg-card-native-symbols{position:absolute;width:0;height:0;overflow:hidden}.card-info-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:24px}.card-info-example{min-width:0;margin:0}.card-info-stage{display:grid;place-items:center;min-height:350px;border:1px solid var(--product-line);border-radius:8px;background:#141b24}.card-info-example figcaption{display:grid;gap:4px;padding-top:14px;font-size:13px}.card-info-example figcaption>span{color:var(--product-sub);font-size:11px;line-height:1.6}.card-info-demo-note{margin:0;padding:0 24px 20px;color:var(--product-sub);font-size:11px;line-height:1.6}.ea-card-text,.ea-card-glyph,.ea-card-trait{position:absolute;display:block;box-sizing:border-box;margin:0;padding:0;pointer-events:none;white-space:nowrap}.ea-card-glyph,.ea-card-trait{font-family:YamalEAIcons,sans-serif!important;font-weight:400}.ea-card-trait-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.demo-card-info .sg-card-native{font-size:14.4px}.demo-card-info .sg-card-native__meta{cursor:default}.demo-card-info .sg-card-native__price{color:#f6cf7e}@media(max-width:950px) and (min-width:701px){.card-info-pair{grid-template-columns:1fr}}@media(max-width:700px){.card-info-pair{grid-template-columns:1fr;padding:14px;gap:22px}.card-info-stage{min-height:330px}.card-info-stage[data-sample-size=small]{min-height:250px}.card-info-demo-note{padding-inline:14px}.demo-card-info .sg-card-native[data-card-native-size=large]{transform:scale(1.3)}}
.card-info-notes{display:grid;gap:0;margin:8px 0 0;font-size:12px;line-height:1.6}.card-info-notes>div{display:grid;grid-template-columns:78px minmax(0,1fr);gap:8px;padding:7px 0;border-top:1px solid var(--product-line)}.card-info-notes dt{color:#d1d8e1}.card-info-notes dd{margin:0;color:var(--product-sub)}