/* Hypecall card component.
   The structural styles for the card: materials, sizes, the stub strip,
   the nameplate, the boost badge, the list row and the back.
   Finishes (holo layers) live in card-finishes.css, load that after this.
   Markup for every variant is in card-example.html, open it in a browser.

   Sizes: default 168px, .lg 288px feature, .g3 120px grid, .spine 44px row.
   Materials: .ticket (on the clock) and .silver/.gold/.diamond/.perfect
   (settled). Backs add .back.

   --ground must match whatever surface the card sits on, because the
   perforation notches are punched with it. */
:root{--ground:#0e1211}

.hcx{position:relative;flex-shrink:0;width:max-content;padding:3px;border-radius:17px;
  background:conic-gradient(from 0deg,#c4f542 0 var(--p,70%),rgba(255,255,255,.10) var(--p,70%) 100%);
  box-shadow:0 10px 26px rgba(0,0,0,.5)}
.hcx.minted{background:var(--rimc)}
.hcx.silver{--rimc:#cfd6dd}
.hcx.gold{--rimc:#e8b64c}
.hcx.diamond{--rimc:#9fe0f5}
.hcx.perfect{--rimc:#c9a6ff}
/* ticket perforation punches through the rim, like a torn stub */
.hcx.stub::before,.hcx.stub::after{content:"";position:absolute;width:13px;height:13px;border-radius:50%;
  background:var(--ground);bottom:44px;z-index:3}
.hcx.stub::before{left:-6px}
.hcx.stub::after{right:-6px}
.hc{width:168px;height:235px;border-radius:14px;padding:11px;display:flex;flex-direction:column;
  position:relative;overflow:hidden;color:#12151b;isolation:isolate}
.hc.ticket{background:linear-gradient(160deg,#39424b 0%,#1f262c 46%,#2c343c 100%);color:#e9eef2}
.hc.silver{background:linear-gradient(160deg,#f1f2f4 0%,#b6bac1 45%,#7c8189 75%,#9aa0a8 100%)}
.hc.gold{background:linear-gradient(160deg,#ffefc0 0%,#e0ab2e 45%,#96690a 75%,#c99420 100%)}
.hc.diamond{background:linear-gradient(135deg,rgba(255,255,255,.55) 0%,transparent 22%),
  linear-gradient(315deg,rgba(255,255,255,.35) 0%,transparent 25%),
  linear-gradient(160deg,#eaf8ff 0%,#a9def2 40%,#5fa8c9 70%,#cdeefb 100%)}
.hc.perfect{background:linear-gradient(135deg,rgba(255,255,255,.6) 0%,transparent 20%),
  linear-gradient(160deg,#ffffff 0%,#e8d9ff 25%,#b98cff 55%,#6a3fd9 85%,#4a1fa8 100%)}
.hc.h-shimmer::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(120deg,transparent 15%,rgba(255,255,255,.75) 33%,rgba(0,255,255,.6) 45%,rgba(255,0,200,.6) 57%,transparent 75%);
  background-size:260% 260%;background-position:38% 38%;opacity:.8}
/* Shared effects slot for the finishes (styled in card-finishes.css).
   .hc's two pseudo-elements are both spent on every finish: ::after is the
   plate, ::before is the signature layer. A finish needing a third layer,
   or two independent timelines, has nowhere to put them, so this is that
   layer. Inert until a finish styles it.
   The MASK and the MIX-BLEND-MODE always belong on .hcfx itself, never on a
   child: z-index makes .hcfx a stacking context, so a child's own
   mix-blend-mode would resolve against that empty group and silently do
   nothing at all. The two children exist only to carry two animations at
   once. z-index 3 puts the slot above the plate (2) and below a finish's
   spark layer (4) and the nameplate (4). */
.hc > .hcfx{position:absolute;inset:0;z-index:3;pointer-events:none;display:block}
.hc > .hcfx > i{position:absolute;inset:0;display:block}
@media (prefers-reduced-motion:reduce){.hc > .hcfx{display:none}}
.hc.sealed{background:linear-gradient(160deg,#20272e,#141a1f);color:#e9eef2;align-items:center;justify-content:center}
.hc.locked{filter:grayscale(.55) brightness(.72)}
.hc-top{display:flex;align-items:center;gap:5px;margin-bottom:5px}
.hc-plat{font-family:"JetBrains Mono",monospace;font-size:7.5px;font-weight:700;letter-spacing:.09em;
  padding:2px 5px;border-radius:4px;background:rgba(18,21,27,.16);display:flex;align-items:center;gap:4px;flex-shrink:0}
.hc.ticket .hc-plat{background:rgba(255,255,255,.11)}
.hc-plat i{width:5px;height:5px;border-radius:50%;display:block}
.hc-chan{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc-title{font-size:9.5px;line-height:1.32;max-height:25px;overflow:hidden;opacity:.72;margin-bottom:4px}
.hc-lab{font-family:"JetBrains Mono",monospace;font-size:7.5px;letter-spacing:.15em;text-transform:uppercase;opacity:.62;text-align:center}
.hc-big{font-family:"JetBrains Mono",monospace;font-size:29px;font-weight:700;text-align:center;line-height:1.06;letter-spacing:-.02em}
.hc-sub{text-align:center;font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:700}
.hc-sweep{margin-top:auto;height:46px;position:relative;margin-left:-11px;margin-right:-11px}
.hc-sweep svg{width:100%;height:100%;display:block}
.hc-sweep .dot{position:absolute;width:7px;height:7px;border-radius:50%;transform:translate(-50%,-50%)}
.hc.ticket .hc-sweep .dot{background:#c4f542;box-shadow:0 0 10px rgba(196,245,66,.9)}
.hc-sweep .dot{background:#12151b}
.hc.ticket .hc-sweep .dot{background:#c4f542}
.hc-foot{display:flex;justify-content:space-between;align-items:flex-end;font-family:"JetBrains Mono",monospace;
  font-size:8.5px;font-weight:700;padding-top:7px;position:relative;z-index:3}
.hc.ticket .hc-foot{border-top:1px dashed rgba(255,255,255,.3);margin-top:6px}
.hc-foot .k{opacity:.6;font-weight:500;letter-spacing:.1em;display:block;font-size:7px}
.hc-stamp{position:absolute;top:9px;right:9px;z-index:3;font-family:"JetBrains Mono",monospace;font-size:7px;
  font-weight:700;letter-spacing:.14em;border:1px solid rgba(18,21,27,.45);color:rgba(18,21,27,.7);
  padding:2px 5px;border-radius:3px;transform:rotate(6deg)}
/* small density, for grids */
.hc.sm{width:120px;height:168px;padding:8px;border-radius:11px}
.hc.sm .hc-big{font-size:21px}
.hc.sm .hc-title{display:none}
.hc.sm .hc-sweep{height:32px;margin-left:-8px;margin-right:-8px}
.hc.sm .hc-chan{font-size:9px}
.hcx.sm{border-radius:14px;padding:2px}
/* large density, for the anatomy sheet and card details */
.hcx.lg{padding:5px;border-radius:26px}
.hc.lg{width:288px;height:404px;padding:19px;border-radius:22px}
.hc.lg .hc-plat{font-size:11px;padding:3px 8px}
.hc.lg .hc-chan{font-size:16px}
.hc.lg .hc-title{font-size:14px;max-height:38px;margin-bottom:8px}
.hc.lg .hc-lab{font-size:11px}
.hc.lg .hc-big{font-size:48px}
.hc.lg .hc-sub{font-size:15px}
.hc.lg .hc-sweep{height:96px;margin-left:-19px;margin-right:-19px}
.hc.lg .hc-foot{font-size:13px}
.hc.lg .hc-foot .k{font-size:10px}
.hc.lg .hc-stamp{font-size:11px;padding:3px 8px;top:16px;right:16px}
.hcx.lg.stub::before,.hcx.lg.stub::after{width:22px;height:22px;bottom:74px}
.hcx.lg.stub::before{left:-11px}
.hcx.lg.stub::after{right:-11px}
/* spine density, for lists at scale */
.spine{display:flex;align-items:stretch;height:44px;border-radius:9px;overflow:hidden;position:relative;
  background:rgba(255,255,255,.032);border:1px solid rgba(255,255,255,.08)}
.sp-edge{width:6px;flex-shrink:0}
.sp-body{flex:1;display:flex;align-items:center;gap:14px;padding:0 12px;min-width:0}
.sp-chan{font-size:11.5px;font-weight:700;white-space:nowrap}
.sp-t{font-size:11px;color:#8f978f;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-n{font-family:"JetBrains Mono",monospace;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sp-n .k{display:block;font-size:7px;letter-spacing:.12em;color:#8f978f;font-weight:500}
.sp-spark{width:56px;height:20px;flex-shrink:0;opacity:.9}
.sp-clock{position:absolute;left:0;bottom:0;height:2px;background:#c4f542;opacity:.6}
.mk-t2 .spinelist{display:flex;flex-direction:column;gap:7px}
.mk-p2 .spinelist{display:flex;flex-direction:column;gap:7px}
/* ---- from lpartF.css ---- */

/* =========================================================
   CARD LAB additions
   ========================================================= */
/* medium density, used for every comparison row on this page */
.hcx.md{border-radius:20px;padding:4px}
.hc.md{width:210px;height:294px;padding:14px;border-radius:16px}
.hc.md .hc-plat{font-size:9px;padding:2px 6px}
.hc.md .hc-chan{font-size:12.5px}
.hc.md .hc-title{font-size:11px;max-height:29px;margin-bottom:5px}
.hc.md .hc-lab{font-size:9px}
.hc.md .hc-big{font-size:35px}
.hc.md .hc-sub{font-size:12px}
.hc.md .hc-sweep{height:62px;margin-left:-14px;margin-right:-14px}
.hc.md .hc-foot{font-size:10.5px;padding-top:8px}
.hc.md .hc-foot .k{font-size:8px}
.hcx.md.stub::before,.hcx.md.stub::after{width:16px;height:16px;bottom:54px}
.hcx.md.stub::before{left:-8px}
.hcx.md.stub::after{right:-8px}
/* --- potential score treatments --- */
.hc-pre{display:flex;align-items:baseline;justify-content:center;gap:7px;font-family:"JetBrains Mono",monospace;
  font-size:10px;opacity:.8;margin-bottom:1px}
.hc-boost{font-family:"JetBrains Mono",monospace;font-size:8.5px;font-weight:700;padding:2px 5px;
  border-radius:4px;background:#ffb238;color:#12151b;flex-shrink:0}
.hc-projtag{position:absolute;right:14px;top:-9px;z-index:3;font-family:"JetBrains Mono",monospace;
  font-size:9.5px;font-weight:700;color:#c4f542;background:rgba(12,16,14,.82);padding:3px 6px;border-radius:5px;
  border:1px solid rgba(196,245,66,.45)}
.hc-sweep .dot.ghost{background:transparent;border:2px solid #c4f542;box-shadow:none}
.hc-stubstrip{display:flex;margin-top:7px;padding-top:8px;border-top:1px dashed rgba(255,255,255,.32);position:relative;z-index:3}
.hc-stubstrip > div{flex:1;text-align:center;border-right:1px solid rgba(255,255,255,.14);padding:0 2px;min-width:0}
.hc-stubstrip > div:last-child{border-right:0}
.hc-stubstrip .k{display:block;font-family:"JetBrains Mono",monospace;font-size:7.5px;letter-spacing:.1em;opacity:.6;margin-bottom:2px}
.hc-stubstrip .v{font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;letter-spacing:-.02em}
/* --- rarity treatments --- */
.hc.plate{padding-bottom:30px}
.r-plate{position:absolute;left:0;right:0;bottom:0;height:24px;display:flex;align-items:center;
  justify-content:space-between;padding:0 13px;font-family:"JetBrains Mono",monospace;font-size:9.5px;
  font-weight:700;letter-spacing:.2em;z-index:4;color:#12151b}
.r-plate.silver{background:linear-gradient(90deg,#e6e9ec,#aeb4bb)}
.r-plate.gold{background:linear-gradient(90deg,#f6d17a,#c9932c)}
.r-plate.diamond{background:linear-gradient(90deg,#dff4fb,#8cc9de)}
.r-plate.perfect{background:linear-gradient(90deg,#e9dcff,#9a6ff0);color:#fff}
.pips{display:flex;gap:4px;flex-shrink:0;align-items:center}
.pips i{width:7px;height:7px;transform:rotate(45deg);background:rgba(18,21,27,.2);display:block;border-radius:1px}
.pips i.on{background:#12151b;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.hc.edgelab{padding-left:30px}
.hc.framed::before{content:"";position:absolute;inset:5px;border:1.5px solid rgba(18,21,27,.32);
  border-radius:10px;pointer-events:none;z-index:1}
.hc.framed.ticket::before{border-color:rgba(255,255,255,.22)}
/* --- the tear --- */
.tear{position:relative;width:218px;height:302px;flex-shrink:0}
.tear .half{position:absolute;inset:0;transition:transform .3s}
.tear .half.top{clip-path:polygon(0 0,100% 0,100% 60%,93% 62.5%,86% 59.5%,79% 63%,72% 60%,65% 63.5%,58% 60%,51% 63%,44% 59.5%,37% 63%,30% 60%,23% 63.5%,16% 60%,9% 63%,0 60%)}
.tear .half.bot{clip-path:polygon(0 60%,9% 63%,16% 60%,23% 63.5%,30% 60%,37% 63%,44% 59.5%,51% 63%,58% 60%,65% 63.5%,72% 60%,79% 63%,86% 59.5%,93% 62.5%,100% 60%,100% 100%,0 100%)}
.tear.ripped .half.top{transform:translate(-16px,-26px) rotate(-5.5deg)}
.tear.ripped .half.bot{transform:translate(13px,20px) rotate(3.5deg)}
.tear .reveal{position:absolute;left:50%;top:50%;transform:translate(-50%,-54%);z-index:4}
.tearhint{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);z-index:5;
  font-family:"JetBrains Mono",monospace;font-size:8px;font-weight:700;letter-spacing:.22em;
  background:rgba(12,16,14,.8);border:1px dashed rgba(255,255,255,.45);color:#e9eef2;padding:3px 8px;border-radius:20px}
.mk-lab .step .tear{margin-top:18px}
/* size bumps for the large sample card */
.hc.lg .hc-stubstrip{margin-top:10px;padding-top:11px}
.hc.lg .hc-stubstrip .k{font-size:10px;margin-bottom:3px}
.hc.lg .hc-stubstrip .v{font-size:17px}
.hc.lg .hc-projtag{font-size:13px;right:19px;top:-13px;padding:4px 8px}
.hc.lg .hc-boost{font-size:11px;padding:3px 7px}
.hc.lg.plate{padding-bottom:44px}
.hc.lg .r-plate{height:36px;font-size:13px;padding:0 19px;letter-spacing:.22em}
.hc.sm.plate{padding-bottom:23px}
.hc.sm .r-plate{height:19px;font-size:7.5px;padding:0 8px;letter-spacing:.12em}
.hc.sm .hc-stubstrip{margin-top:5px;padding-top:6px}
.hc.sm .hc-stubstrip .k{font-size:6px;margin-bottom:1px}
.hc.sm .hc-stubstrip .v{font-size:9.5px}
.hc.sm .hc-projtag{font-size:7.5px;right:8px;top:-7px;padding:2px 4px}
.stubpiece{width:158px;height:64px;background:linear-gradient(160deg,#2f373f,#1f262c);
  border:1px solid rgba(255,255,255,.13);border-radius:0 0 12px 12px;padding:14px 13px 10px;position:relative;
  clip-path:polygon(0 12%,8% 5%,16% 13%,24% 4%,32% 12%,40% 5%,48% 13%,56% 4%,64% 12%,72% 5%,80% 13%,88% 4%,96% 12%,100% 6%,100% 100%,0 100%)}
.tear .half{z-index:2}
/* ---- from lpartI.css ---- */

/* =========================================================
   FINISH LIBRARY  (round 4)
   ========================================================= */
/* stamped nameplate: a deeper band of the same metal, hairline lit edge */
.r-plate{border-top:1px solid rgba(255,255,255,.4);box-shadow:0 -9px 16px rgba(0,0,0,.22)}
.r-plate.silver{background:linear-gradient(90deg,#5d6268,#454a50);color:#f4f7fa}
.r-plate.gold{background:linear-gradient(90deg,#7c5511,#5c3e08);color:#ffeec4}
.r-plate.diamond{background:linear-gradient(90deg,#2f6a80,#1f4a5c);color:#e8faff}
.r-plate.perfect{background:linear-gradient(90deg,#3f2170,#281450);color:#f4eaff}
.r-plate.old.gold{background:linear-gradient(90deg,#f6d17a,#c9932c);color:#12151b;border-top:0;box-shadow:none}
@keyframes hc-echo{0%{transform:scale(.5);opacity:0}18%{opacity:.6}100%{transform:scale(1.75);opacity:0}}
/* --- tear v2: rip along the perforation, card slides out of the sleeve --- */
.tear2{position:relative;width:218px;height:302px;flex-shrink:0}
.tear2 > .sleeve,.tear2 > .stub{position:absolute;inset:0}
.tear2 > .sleeve{clip-path:polygon(0% 0%,100% 0%,100.0% 82.01%,97.06% 83.54%,94.12% 81.8%,91.18% 84.06%,88.24% 83.17%,85.29% 83.88%,82.35% 83.19%,79.41% 82.13%,76.47% 83.82%,73.53% 80.23%,70.59% 81.4%,67.65% 82.64%,64.71% 83.36%,61.76% 80.38%,58.82% 82.99%,55.88% 83.29%,52.94% 82.35%,50.0% 83.83%,47.06% 82.83%,44.12% 80.75%,41.18% 82.85%,38.24% 82.15%,35.29% 83.7%,32.35% 82.12%,29.41% 84.38%,26.47% 81.11%,23.53% 81.22%,20.59% 83.7%,17.65% 80.16%,14.71% 80.38%,11.76% 82.79%,8.82% 82.7%,5.88% 81.69%,2.94% 82.44%,0.0% 81.12%);z-index:3}
.tear2 > .stub{clip-path:polygon(0.0% 81.12%,2.94% 82.44%,5.88% 81.69%,8.82% 82.7%,11.76% 82.79%,14.71% 80.38%,17.65% 80.16%,20.59% 83.7%,23.53% 81.22%,26.47% 81.11%,29.41% 84.38%,32.35% 82.12%,35.29% 83.7%,38.24% 82.15%,41.18% 82.85%,44.12% 80.75%,47.06% 82.83%,50.0% 83.83%,52.94% 82.35%,55.88% 83.29%,58.82% 82.99%,61.76% 80.38%,64.71% 83.36%,67.65% 82.64%,70.59% 81.4%,73.53% 80.23%,76.47% 83.82%,79.41% 82.13%,82.35% 83.19%,85.29% 83.88%,88.24% 83.17%,91.18% 84.06%,94.12% 81.8%,97.06% 83.54%,100.0% 82.01%,100% 100%,0% 100%);z-index:3}
.tear2 > .card{position:absolute;left:0;top:0;z-index:2}
.tear2 .fibre{position:absolute;left:0;right:0;top:82%;height:2px;z-index:4;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 2px,transparent 2px 5px)}
/* type sits above every finish layer, art sits under it */
.hc-top,.hc-title,.hc-lab,.hc-big,.hc-sub,.hc-pre{position:relative;z-index:5}
.hc-foot,.hc-stubstrip{z-index:5}
.r-plate{z-index:6}
.hc.silver .hc-big,.hc.gold .hc-big,.hc.diamond .hc-big,.hc.perfect .hc-big{text-shadow:0 1px 1px rgba(255,255,255,.35)}
.hc.ticket .hc-big{text-shadow:0 1px 3px rgba(0,0,0,.5)}
.hc.sm:not(.ticket) .hc-big,.hc.sm:not(.ticket) .hc-lab{text-shadow:0 0 5px rgba(255,255,255,.95),0 0 2px rgba(255,255,255,.9)}
.hcx{isolation:isolate}
.hc.sm:not(.ticket) .hc-big,.hc.sm:not(.ticket) .hc-lab{text-shadow:0 1px 2px rgba(255,255,255,.35)}
/* ---- from r5.css ---- */

/* =========================================================
   ROUND 5  (rim follows the notch, no pips, grid card, cosmos)
   ========================================================= */
.pips{display:none}
.hcx.rimmed{background:none}
.rimsvg{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:visible}
/* boost badge */
.bx{width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-family:"JetBrains Mono",monospace;font-size:8.5px;font-weight:700;flex-shrink:0;letter-spacing:-.02em}
.bx.silver{background:linear-gradient(150deg,#f2f5f8,#a8aeb6);color:#12151b;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.bx.gold{background:linear-gradient(150deg,#ffe9a8,#c9932c);color:#12151b;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.bx.diamond{background:linear-gradient(150deg,#e2f7ff,#7fc6dd);color:#12151b;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.bx.perfect{background:linear-gradient(150deg,#efe2ff,#9a6ff0);color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.bx.empty{background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.32);color:rgba(255,255,255,.4);font-size:11px}
.hc.lg .bx{width:34px;height:34px;border-radius:10px;font-size:12px}
/* grid card, option A: title over a left aligned score */
.hc.g1{width:132px;height:186px;padding:9px;border-radius:12px}
.hcx.g1{border-radius:15px;padding:2px}
.hc.g1 .hc-chan{font-size:9.5px}
.hc.g1 .hc-title{display:block;font-size:9px;line-height:1.28;max-height:23px;margin-bottom:5px;opacity:.8}
.hc.g1 .hc-lab{font-size:7px;text-align:left;margin-top:auto}
.hc.g1 .hc-big{font-size:22px;text-align:left;margin-top:-1px}
.hc.g1 .hc-sweep{height:30px;margin-left:-9px;margin-right:-9px}
.hc.g1 .hc-plat{font-size:7px;padding:1px 4px}
.hc.g1.plate{padding-bottom:22px}
.hc.g1 .r-plate{height:18px;font-size:7px;padding:0 8px;letter-spacing:.1em}
/* grid card, option B: title, then number and curve side by side */
.hc.g2{width:132px;height:186px;padding:9px;border-radius:12px}
.hcx.g2{border-radius:15px;padding:2px}
.hc.g2 .hc-chan{font-size:9.5px}
.hc.g2 .hc-title{display:block;font-size:9px;line-height:1.28;max-height:34px;margin-bottom:6px;opacity:.8}
.hc.g2 .g2row{display:flex;align-items:flex-end;gap:6px;margin-top:auto;position:relative;z-index:5}
.hc.g2 .g2row .hc-lab{text-align:left;font-size:7px}
.hc.g2 .g2row .hc-big{text-align:left;font-size:20px;line-height:1}
.hc.g2 .g2spark{flex:1;height:30px;opacity:.75}
.hc.g2.plate{padding-bottom:22px}
.hc.g2 .r-plate{height:18px;font-size:7px;padding:0 8px;letter-spacing:.1em}
/* grid card, option C: 120px, title replaces the score label */
.hc.g3{width:120px;height:168px;padding:8px;border-radius:11px}
.hcx.g3{border-radius:14px;padding:2px}
.hc.g3 .hc-chan{font-size:9px}
.hc.g3 .hc-title{display:block;font-size:8.5px;line-height:1.25;max-height:21px;margin-bottom:4px;opacity:.8}
.hc.g3 .hc-lab{display:none}
.hc.g3 .hc-big{font-size:21px;margin-top:auto}
.hc.g3 .hc-sweep{height:26px;margin-left:-8px;margin-right:-8px}
.hc.g3 .hc-plat{font-size:7px;padding:1px 4px}
.hc.g3.plate{padding-bottom:20px}
.hc.g3 .r-plate{height:17px;font-size:6.5px;padding:0 7px;letter-spacing:.08em}
.hcx.rimmed::before,.hcx.rimmed::after{display:none}
/* ---- from r6.css ---- */

/* =========================================================
   ROUND 6  (grid card final, card back)
   ========================================================= */
/* option C, shipped: title fits, score label centred over a centred score */
.hc.g3 .hc-lab{display:block;text-align:center;font-size:7px;margin-top:auto}
.hc.g3 .hc-big{font-size:21px;text-align:center;margin-top:0}
.hc.g3 .hc-title{-webkit-line-clamp:2}
/* ---------------- CARD BACK ---------------- */
.hc.back{justify-content:flex-start}
/* Backs are never foil. app.js no longer adds a finish class to a back
   element, but this is the real belt-and-suspenders fix: a finish's
   pseudo-element can carry a large negative inset (e.g. Echo Wave's -60%,
   Starfall's -20% -10%) that overflow:hidden clipped harmlessly on every
   other face. The back overrides overflow to overflow-y:auto so long cards
   scroll (style.css, .card-zoom-face.back .hc.back) -- once that ancestor
   is a scroll container, an absolutely positioned descendant's oversized
   box counts toward its scrollable content height instead of being
   clipped, which is what was stretching the whole flipped face. !important
   because a same-specificity .hc.h-<name>::before/::after rule loads after
   this file and would otherwise win on source order alone. */
.hc.back::before,.hc.back::after{content:none!important}
/* Same rule for the effects slot, and for the same reason: Echo Wave's
   radar child is 200% of the card and Deep Space's comet overhangs by 25%,
   both harmless under overflow:hidden and both able to stretch a flipped
   back once that ancestor becomes a scroll container. */
.hc.back > .hcfx{display:none}
.bk-mark{position:absolute;right:-22px;bottom:26px;z-index:0;
  font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:150px;line-height:.8;
  color:rgba(18,21,27,.09)}
.bk-head{display:flex;align-items:center;gap:8px;padding-bottom:9px;position:relative;z-index:5;
  border-bottom:1px solid rgba(18,21,27,.28)}
.bk-head .t{flex:1;min-width:0}
.bk-head .t b{display:block;font-size:14px;font-weight:800;letter-spacing:-.01em}
.bk-head .t span{display:block;font-size:11px;opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk-sec{font-family:"JetBrains Mono",monospace;font-size:8.5px;letter-spacing:.18em;opacity:.5;
  margin:11px 0 3px;position:relative;z-index:5}
.bk-row{display:flex;align-items:baseline;font-family:"JetBrains Mono",monospace;font-size:11.5px;
  line-height:1.5;padding:1px 0;position:relative;z-index:5}
.bk-row .k{opacity:.62}
.bk-row .lead{flex:1;border-bottom:1px dotted rgba(18,21,27,.32);margin:0 7px 4px}
.bk-row .v{font-weight:700}
.bk-foot{margin-top:auto;padding-top:10px;display:flex;justify-content:space-between;
  font-family:"JetBrains Mono",monospace;font-size:10px;opacity:.6;position:relative;z-index:5}
/* B: receipt */
.bk-curve{height:66px;margin:8px -19px 2px;position:relative;z-index:1}
.bk-curve svg{width:100%;height:100%;display:block}
.bk-stamp{position:absolute;right:16px;top:96px;z-index:5;transform:rotate(-11deg);
  border:2px solid rgba(18,21,27,.5);border-radius:6px;padding:3px 8px;
  font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;letter-spacing:.14em;color:rgba(18,21,27,.62)}
/* C: tiles */
.bk-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:11px;position:relative;z-index:5}
.bk-tile{background:rgba(18,21,27,.1);border:1px solid rgba(18,21,27,.16);border-radius:11px;padding:7px 10px}
.bk-tile .k{font-family:"JetBrains Mono",monospace;font-size:8px;letter-spacing:.14em;opacity:.6;display:block}
.bk-tile .v{font-family:"JetBrains Mono",monospace;font-size:19px;font-weight:700;letter-spacing:-.02em}
.bk-tile.wide{grid-column:1 / -1}
.bk-note{font-size:10.5px;line-height:1.45;opacity:.62;margin-top:10px;position:relative;z-index:5}
/* the plate now carries rarity + finish, so it has to hold a longer string */
.hc.g3 .r-plate{font-size:6px;letter-spacing:.02em;padding:0 6px;gap:4px}
.hc.g3 .r-plate span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc.g3 .r-plate span:last-child{flex-shrink:0}
.r-plate span:first-child{min-width:0}
