/* Locked champion #130 geometry; silver/gold from locked130-tier-set-CMeBai,
   stronger prismatic #136 paints from prismatic-spectrum-EixD79. */
@font-face {
    font-family: PowerBarlow;
    src: url('assets/power-BarlowCondensed.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* Keep the raised fittings in the same 3D scene as the shared card rotor. */
.tcg-card.tcg-champion-approved[data-tier],
.tcg-card.tcg-champion-approved[data-tier]:hover,
.tcg-card.tcg-champion-approved[data-tier]:focus-visible {
    aspect-ratio: 258 / 366;
    filter: none;
}
.tcg-card.tcg-champion-approved:not([data-champion-ready="true"]) {
    visibility: hidden;
}
.tcg-champion-face {
    display: block;
    position: absolute;
    inset: 0;
    overflow: visible;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.tcg-champion130 {
    display: block;
    transform: scale3d(var(--champion-scale, 1), var(--champion-scale, 1), var(--champion-scale, 1));
    transform-origin: top left;
    transform-style: preserve-3d;
    overflow: visible;
    text-transform: none;
    text-align: left;
    letter-spacing: normal;
}
.tcg-champion130 [class^="c130-"] {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.tcg-champion130 {
    position: relative;
    width: 258px;
    height: 366px;
    flex: none;
    color: #eee5d5;
    font: 13px Arial,sans-serif;
}

.tcg-champion130 *,.tcg-champion130 *::before,.tcg-champion130 *::after {
    box-sizing: border-box;
}

.tcg-champion130 .c130-card {
    position: absolute;
    inset: 0;
    width: 258px;
    height: 366px;
    transform-style: preserve-3d;
    overflow: visible;
}

.tcg-champion130 .c130-front {
    position: absolute;
    inset: 0;
    isolation: isolate;
    border: 0;
    border-radius: 12px;
    overflow: hidden;
    background: #1d252c;
    box-shadow: 0 12px 24px #0008;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%);
}

.tcg-champion130 .c130-portrait {
    position: absolute;
    inset: 5px;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    object-fit: cover;
    object-position: 50% 25%;
    border-radius: 7px;
}

.tcg-champion130 .c130-relic-frame {
    position: absolute;
    inset: 0;
    z-index: 12;
    border-radius: 12px;
    /* The dark base of the raised band (frame family below). */
    box-shadow: inset 0 0 0 10px #11191b;
    pointer-events: none;
}

.tcg-champion130 .c130-topline {
    position: absolute;
    z-index: 5;
    left: 18px;
    top: 18px;
    color: #bdcfd6;
    text-shadow: 0 1px 3px #000;
}

.tcg-champion130 .c130-topline small {
    font: 600 11px/14px Arial,sans-serif;
    letter-spacing: 1.7px;
}

/* One rarity treatment shared by CHAMPION, ITEM and AUGMENT. */
.tcg-champion130[data-tier="gold"] .c130-topline small { color:#edcb7c; }
.tcg-champion130[data-tier="prismatic"] .c130-topline small {
    color:#e8d5ff;
    background:linear-gradient(105deg,#b9f8e4 0%,#e8d5ff 35%,#eec1e0 65%,#d7ecff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:none;
}
.tcg-champion130[data-tier="secret"] .c130-topline small { color:#f1aa87; }

.tcg-champion130 .c130-equipment {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
}

.tcg-champion130 .c130-items {
    position: absolute;
    left: 10px;
    top: 45px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.tcg-champion130 .c130-augments {
    position: absolute;
    right: 10px;
    top: 53px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.tcg-champion130 .c130-imprint {
    position: relative;
    display: block;
    width: 35px;
    height: 33px;
    flex: none;
}

.tcg-champion130 .c130-augments .c130-imprint {
    width: 38px;
    height: 38px;
}

.tcg-champion130 .c130-etch-item,.tcg-champion130 .c130-etch-augment {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0;
    border: 0;
    border-radius: 0;
}

.tcg-champion130 .c130-etch-item {
    -webkit-mask-image: linear-gradient(90deg,#0005,#0009 12%,#000 29%,#000 73%,#0009 88%,#0005),linear-gradient(0deg,#0005,#000b 17%,#000 31%,#000 74%,#000a 87%,#0005);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(90deg,#0005,#0009 12%,#000 29%,#000 73%,#0009 88%,#0005),linear-gradient(0deg,#0005,#000b 17%,#000 31%,#000 74%,#000a 87%,#0005);
    mask-composite: intersect;
    filter: contrast(1.16) saturate(1.14) brightness(.98);
}

.tcg-champion130 .c130-etch-augment {
    filter: contrast(1.23) saturate(1.3) brightness(.87) drop-shadow(.6px .8px .3px #080b12);
}

.tcg-champion130 .c130-identity {
    position: absolute;
    left: 17px;
    right: 17px;
    bottom: 75px;
    z-index: 5;
    text-align: center;
}

.tcg-champion130 .c130-identity small {
    display: block;
    font: 400 11px/15px Arial,sans-serif;
    letter-spacing: .2px;
    white-space: nowrap;
    color: #e7dfd2;
    text-shadow: 0 1px 1px #000,0 2px 4px #000,0 0 7px rgba(0,0,0,.85);
}

.tcg-champion130 .c130-identity .c130-name {
    display: block;
    margin: 1px 0 0;
    font: italic 32px/35px Georgia,serif;
    letter-spacing: -.6px;
    white-space: nowrap;
    color: #f0eadb;
    text-shadow: 0 1px 1px #000,0 2px 5px #000,0 0 10px rgba(0,0,0,.8);
    font-size: 32px;
    line-height: 35px;
}

.tcg-champion130 .c130-part {
    display: block;
    position: absolute;
    pointer-events: none;
    transform-origin: 50% 100%;
}

.tcg-champion130 .c130-power-value {
    position: absolute;
    display: block;
    margin: 0;
    white-space: nowrap;
    text-align: center;
    font: italic 800 32px/32px PowerBarlow,sans-serif;
    letter-spacing: .2px;
    font-variant-numeric: lining-nums tabular-nums;
    color: #f0f3e8;
    text-shadow: 0 1px #acc0c5,0 2px #4e626d,1px 3px 1px #020709;
    transform: translateZ(14px);
    left: 105px;
    right: 18px;
    bottom: 19px;
}

.tcg-champion130 .c130-power-label {
    position: absolute;
    display: block;
    white-space: nowrap;
    text-align: center;
    font: 600 8px/10px Arial,sans-serif;
    letter-spacing: 1px;
    color: #d4dedb;
    text-shadow: 0 1px 2px #020508;
    transform: translateZ(14px);
    /* Optical alignment with the italic number, not just its layout box. */
    left: 108px;
    right: 17px;
    bottom: 52px;
}

.tcg-champion130 .c130-grip-shadow {
    right: -1px;
    bottom: 2px;
    width: 100px;
    height: 94px;
    background: linear-gradient(270deg,#000a,transparent 22%),linear-gradient(0deg,#0009,transparent 18%);
    border-radius: 0 0 12px 0;
    transform: translateZ(1px);
}

.tcg-champion130 .c130-grip-wall {
    right: -5px;
    bottom: -4px;
    width: 93px;
    height: 94px;
    background: linear-gradient(105deg,#26373b 2%,#7e989c 22%,#1e2d31 43%,#40565b 74%,#26373b);
    clip-path: polygon(86% 0,100% 7%,100% 78%,79% 100%,0 100%,7% 91%,76% 91%,86% 79%);
    transform: translateZ(5px);
}

.tcg-champion130 .c130-grip-back {
    right: -3px;
    bottom: 0;
    width: 91px;
    height: 91px;
    background: linear-gradient(122deg,#bdcfd6,#566f74 15%,#8ba5aa 28%,#334447 53%,#aabfc3 80%,#50686e);
    clip-path: polygon(87% 0,100% 8%,100% 77%,78% 100%,0 100%,8% 89%,76% 89%,87% 77%);
    transform: translateZ(7px);
}

.tcg-champion130 .c130-crystal-wall {
    left: 87px;
    right: 13px;
    bottom: 7px;
    height: 64px;
    background: linear-gradient(130deg,#9fb6ba70,#26373b60 23%,#111e2265 78%,#8ba5aa4d);
    clip-path: polygon(15% 15%,96% 0,100% 9%,100% 86%,91% 100%,5% 100%,0 80%);
    transform: translateZ(5px);
}

.tcg-champion130 .c130-crystal {
    left: 87px;
    right: 14px;
    bottom: 11px;
    height: 64px;
    background: linear-gradient(135deg,#d3ddec2a,#17253a42 27%,#121d335b 70%,#6e8ea827);
    clip-path: polygon(15% 15%,96% 0,100% 9%,100% 86%,91% 100%,5% 100%,0 80%);
    transform: translateZ(9px);
}

.tcg-champion130 .c130-crystal-edge {
    left: 87px;
    right: 14px;
    bottom: 11px;
    height: 64px;
    background: linear-gradient(125deg,#bdcfd6df,#9fb6baca 27%,#bdcfd66b 53%,#aabfc3d0 80%,#7e989c99);
    clip-path: polygon(15% 15%,96% 0,100% 9%,100% 86%,91% 100%,5% 100%,0 80%,15% 15%,16% 17%,1% 80%,6% 98%,90% 98%,99% 85%,99% 10%,95% 2%,16% 17%);
    transform: translateZ(11px);
}

.tcg-champion130 .c130-crystal-bevel {
    left: 87px;
    right: 14px;
    bottom: 11px;
    height: 64px;
    background: linear-gradient(132deg,#bdcfd69c 0%,#9fb6ba42 26%,transparent 49%,#7e989c36 78%,#bdcfd667);
    clip-path: polygon(15% 15%,96% 0,100% 9%,97% 15%,94% 5%,17% 20%,3% 79%,7% 96%,5% 100%,0 80%);
    transform: translateZ(10px);
}

.tcg-champion130 .c130-grip-seat {
    right: 9px;
    bottom: 7px;
    width: 79px;
    height: 80px;
    background: linear-gradient(115deg,#26373b,#111e22 42%,#607a80 70%,#1e2d31);
    clip-path: polygon(95% 0,100% 8%,100% 82%,81% 100%,0 100%,8% 92%,77% 92%,90% 79%,90% 17%,85% 10%);
    transform: translateZ(10px);
}

.tcg-champion130 .c130-grip-face {
    right: -4px;
    bottom: 2px;
    width: 93px;
    height: 94px;
    background: linear-gradient(103deg,#7e989c 0%,#bdcfd6 14%,#9fb6ba 26%,#607a80 47%,#aabfc3 72%,#bdcfd6 88%,#8ba5aa 100%);
    clip-path: polygon(96% 0,100% 5%,100% 80%,79% 100%,0 100%,8% 92%,76% 92%,87% 80%,87% 22%,81% 16%);
    transform: translateZ(12px);
}

.tcg-champion130 .c130-grip-bevel {
    right: -4px;
    bottom: 2px;
    width: 93px;
    height: 94px;
    background: linear-gradient(150deg,#bdcfd6 0%,#aabfc3 31%,#566f74 55%,#bdcfd6 78%,#9fb6ba);
    clip-path: polygon(96% 0,100% 5%,85% 20%,90% 26%,90% 81%,77% 95%,6% 96%,0 100%,8% 92%,76% 92%,87% 80%,87% 22%,81% 16%);
    transform: translateZ(13px);
}

.tcg-champion130 .c130-grip-fold {
    right: -4px;
    bottom: 2px;
    width: 93px;
    height: 94px;
    background: linear-gradient(180deg,#9fb6ba,#334447 26%,#607a80 78%,#bdcfd6);
    clip-path: polygon(99% 7%,100% 5%,100% 80%,79% 100%,77% 98%,97% 79%,97% 10%);
    transform: translateZ(13px);
}

.tcg-champion130 .c130-grip-cut {
    right: 4px;
    bottom: 17px;
    width: 2px;
    height: 53px;
    background: linear-gradient(180deg,#26373b,#7e989c 18%,#334447 91%);
    border-radius: 2px;
    transform: translateZ(14px);
}

.tcg-champion130 .c130-bottom-glint {
    left: 181px;
    right: 25px;
    bottom: 4.5px;
    height: 2px;
    background: linear-gradient(90deg,#bdcfd699,#7e989c);
    opacity: .5;
    /* A soft 2 px line, not a bright hairline that shimmers as the card turns. */
    -webkit-mask-image: linear-gradient(180deg,transparent,#000 50%,transparent);
    mask-image: linear-gradient(180deg,transparent,#000 50%,transparent);
    transform: translateZ(14px);
}

.tcg-champion130 .c130-upper-corner {
    position: absolute;
    left: -23px;
    top: -22px;
    width: 93px;
    height: 94px;
    pointer-events: none;
    transform-style: preserve-3d;
    transform-origin: 50% 50%;
    transform: rotateZ(180deg) scale(.55);
}

.tcg-champion130 .c130-corner-under-cap {
    right: -5px;
    bottom: -4px;
    width: 31px;
    height: 31px;
    clip-path: polygon(26px 0,31px 0,31px 11px,11px 31px,0 31px,0 26px);
    background: linear-gradient(135deg,#7e989c,#40565b 52%,#26373b);
    transform: translateZ(.5px);
}

/* Gold metal and crystal paints. */
.tcg-champion130[data-tier="gold"] .c130-relic-frame {
    box-shadow: inset 0 0 0 10px #1b1913;
}

.tcg-champion130[data-tier="gold"] .c130-grip-wall {
    background: linear-gradient(105deg,#39392e 2%,#9a7e5d 22%,#2c2c24 43%,#62553e 74%,#39392e);
}

.tcg-champion130[data-tier="gold"] .c130-grip-back {
    background: linear-gradient(122deg,#f7ebce,#806a4e 15%,#b99c77 28%,#47483f 53%,#e3c49f 80%,#756147);
}

.tcg-champion130[data-tier="gold"] .c130-crystal-wall {
    background: linear-gradient(130deg,#e3c49f70,#39392e60 23%,#211f1965 78%,#b99c774d);
}

.tcg-champion130[data-tier="gold"] .c130-grip-seat {
    background: linear-gradient(115deg,#39392e,#211f19 42%,#8c7353 70%,#2c2c24);
}

.tcg-champion130[data-tier="gold"] .c130-grip-face {
    background: linear-gradient(103deg,#9a7e5d 0%,#f7ebce 14%,#e3c49f 26%,#8c7353 47%,#e3c49f 72%,#f7ebce 88%,#b99c77 100%);
}

.tcg-champion130[data-tier="gold"] .c130-grip-bevel {
    background: linear-gradient(150deg,#f7ebce 0%,#e3c49f 31%,#806a4e 55%,#f7ebce 78%,#e3c49f);
}

.tcg-champion130[data-tier="gold"] .c130-grip-fold {
    background: linear-gradient(180deg,#e3c49f,#47483f 26%,#8c7353 78%,#f7ebce);
}

.tcg-champion130[data-tier="gold"] .c130-grip-cut {
    background: linear-gradient(180deg,#39392e,#9a7e5d 18%,#47483f 91%);
}

.tcg-champion130[data-tier="gold"] .c130-bottom-glint {
    background: linear-gradient(90deg,#f7ebce99,#9a7e5d);
}

.tcg-champion130[data-tier="gold"] .c130-corner-under-cap {
    background: linear-gradient(135deg,#9a7e5d,#62553e 52%,#39392e);
}

/* Stronger prismatic metal and crystal paints. */
.tcg-champion130[data-tier="prismatic"] .c130-relic-frame {
    box-shadow: inset 0 0 0 10px #21172f;
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-wall {
    background: linear-gradient(105deg,#372845 2%,#8073ba 22%,#271e38 43%,#655084 74%,#392942);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-back {
    background: linear-gradient(122deg,#b7f5e9,#654b8c 15%,#89b8ff 28%,#443253 53%,#edb4e8 80%,#77608b);
}

.tcg-champion130[data-tier="prismatic"] .c130-crystal-wall {
    background: linear-gradient(130deg,#89caff70,#37284560 23%,#21172965 78%,#ce9aff4d);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-seat {
    background: linear-gradient(115deg,#372845,#211729 42%,#8e6dad 70%,#2b203b);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-face {
    background: linear-gradient(103deg,#9773ee 0%,#a0f3e7 14%,#83b5ff 26%,#69509b 47%,#e796ff 72%,#ffe7b6 88%,#b796fa 100%);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-bevel {
    background: linear-gradient(150deg,#d6fff7 0%,#94dfff 31%,#8b60bd 55%,#fff0c9 78%,#ce9aff);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-fold {
    background: linear-gradient(180deg,#89caff,#443253 26%,#b27cbb 78%,#fbd9b9);
}

.tcg-champion130[data-tier="prismatic"] .c130-grip-cut {
    background: linear-gradient(180deg,#382647,#b59aff 18%,#4a365d 91%);
}

.tcg-champion130[data-tier="prismatic"] .c130-bottom-glint {
    background: linear-gradient(90deg,#fff0c999,#ce9aff);
}

.tcg-champion130[data-tier="prismatic"] .c130-corner-under-cap {
    background: linear-gradient(135deg,#887ab9,#665184 52%,#372845);
}

/* Secret: obsidian fittings with ember seams, not a brighter gold reskin.
   Reuse the approved raised geometry and keep the item illustration unobscured. */
.tcg-champion130[data-tier="secret"] .c130-front { background:#151318; }
.tcg-champion130[data-tier="secret"] .c130-relic-frame { box-shadow:inset 0 0 0 10px #050304; }
.tcg-champion130[data-tier="secret"] .c130-grip-wall {
    background:linear-gradient(105deg,#100e14 2%,#55434b 22%,#09090d 43%,#652d2b 74%,#191219);
}
.tcg-champion130[data-tier="secret"] .c130-grip-back {
    background:linear-gradient(122deg,#c38d7c,#30232c 15%,#655660 28%,#121018 53%,#d66445 80%,#36242b);
}
.tcg-champion130[data-tier="secret"] .c130-crystal {
    background:linear-gradient(135deg,#392229d9,#14121bc4 38%,#391b22bd 70%,#aa452c85);
}
/* Void glass (frame family below): a dark rim and seat round the glass. */
.tcg-champion130[data-tier="secret"] .c130-crystal-wall {
    background:linear-gradient(130deg,#3a1d6a70,#0a0612e0 30%,#07040ce0 75%,#5a2a8a60);
}
.tcg-champion130[data-tier="secret"] .c130-crystal-edge {
    clip-path:polygon(evenodd,23.55px 9.60px,150.72px 0.00px,157.00px 5.76px,157.00px 55.04px,142.87px 64.00px,7.85px 64.00px,0.00px 51.20px,23.55px 9.60px,25.98px 13.43px,149.29px 4.12px,153.00px 7.52px,153.00px 52.84px,141.71px 60.00px,10.09px 60.00px,4.64px 51.12px,25.98px 13.43px);
    background:linear-gradient(170deg,#170e28,#07040d 45%,#0e0819 75%,#030205);
}
.tcg-champion130[data-tier="secret"] .c130-crystal-bevel {
    clip-path:polygon(evenodd,25.98px 13.43px,149.29px 4.12px,153.00px 7.52px,153.00px 52.84px,141.71px 60.00px,10.09px 60.00px,4.64px 51.12px,25.98px 13.43px,26.83px 14.77px,148.79px 5.56px,151.60px 8.13px,151.60px 52.07px,141.30px 58.60px,10.87px 58.60px,6.27px 51.09px,26.83px 14.77px);
    background:linear-gradient(180deg,#000b,#1a0a3088);
}
.tcg-champion130[data-tier="secret"] .c130-grip-seat {
    background:linear-gradient(115deg,#211620,#0d0b12 42%,#743b39 70%,#171019);
}
.tcg-champion130[data-tier="secret"] .c130-grip-face {
    background:linear-gradient(103deg,#342a35 0%,#8a7076 14%,#352932 26%,#15121c 47%,#5f3940 72%,#e78d66 88%,#34212c 100%);
}
.tcg-champion130[data-tier="secret"] .c130-grip-bevel {
    background:linear-gradient(150deg,#c9a294 0%,#523c47 31%,#221822 55%,#f69b65 78%,#853c3d);
}
.tcg-champion130[data-tier="secret"] .c130-grip-fold {
    background:linear-gradient(180deg,#965544,#19131c 26%,#4d2732 78%,#e38154);
}
.tcg-champion130[data-tier="secret"] .c130-grip-cut {
    background:linear-gradient(180deg,#17101a,#844439 18%,#251924 91%);
}
.tcg-champion130[data-tier="secret"] .c130-bottom-glint { background:linear-gradient(90deg,#ffba8699,#963b35); }
.tcg-champion130[data-tier="secret"] .c130-corner-under-cap { background:linear-gradient(135deg,#78403e,#30232e 52%,#100c14); }
.tcg-champion130[data-tier="secret"] .c130-power-value { color:#ffdfc9; text-shadow:0 1px 2px #000,0 0 8px #d9573040; }
.tcg-champion130[data-tier="secret"] .c130-power-label { color:#e8a18d; }
/* Dark contours keep the existing lettering readable over bright portraits. */
.tcg-champion130 .c130-identity small,
.tcg-champion130 .c130-identity .c130-name,
.tcg-champion130 .c130-power-label,
.tcg-champion130[data-tier] .c130-power-value{
    text-shadow:-1px 0 1px #000,1px 0 1px #000,0 -1px 1px #000,0 2px 2px #000,0 0 5px #000,0 0 10px #000c;
}
.tcg-champion130[data-tier] .c130-topline small{filter:drop-shadow(0 1px 1px #000) drop-shadow(0 0 3px #000)}

/* Legacy collection etchings position icons independently of these fixed slots. */
/* Counters sit bottom-left: one row each for anvils, hats and juices. */
.tcg-champion130 .c130-counters { position:absolute; left:16px; bottom:16px; z-index:14; display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.tcg-champion130 .c130-juices { gap:4px; cursor:default; }
.tcg-champion130 .c130-juice-slot { position:relative; display:block; width:22px; height:22px; cursor:help; }
/* Juice cut-outs carry transparent padding around the bottle; let it overhang the slot. */
/* 2026-10-18: drawn about 29 % larger (42 → 54 px), still centred on its slot, so it grows in place. */
.tcg-champion130 .c130-counter .c130-juice { position:absolute; left:-16px; top:-16px; width:54px; height:54px; max-width:none; object-fit:contain; }
.tcg-champion130 .c130-juice-slot:focus-visible { outline:1px solid #d7a84e; border-radius:3px; }
.tcg-champion130 .c130-counter { display:flex; align-items:center; gap:2px; color:#f4e9d4; font:600 12px/20px Arial,sans-serif; text-shadow:0 1px 3px #000; cursor:help; pointer-events:auto; }
.tcg-champion130 .c130-counter img { width:20px; height:20px; object-fit:contain; filter:drop-shadow(0 1px 2px #000); }
.tcg-champion130 .c130-counter:focus-visible { outline:1px solid #d7a84e; border-radius:3px; }
/* The anvil and its count need extra separation from bright card art. */
.tcg-champion130 .c130-counter.c130-anvils { text-shadow:0 0 2px #000,0 1px 3px #000,0 0 8px rgba(0,0,0,.9); }
.tcg-champion130 .c130-counter.c130-anvils img { filter:drop-shadow(0 0 1px #000) drop-shadow(0 1px 3px #000) drop-shadow(0 0 6px rgba(0,0,0,.85)); }
.tcg-counter-tooltip { position:fixed; z-index:2147483646; max-width:230px; box-sizing:border-box; padding:8px 12px; background:rgba(0,0,0,.92); border:1px solid #a64b44; border-radius:4px; color:#fff; font:12px/1.5 Montserrat,Arial,sans-serif; white-space:pre-line; pointer-events:none; box-shadow:0 5px 15px #0005; }
.tcg-counter-tooltip[hidden] { display:none; }
/* Anvil totals read like the card's power number, each beside its stat icon. */
.tcg-counter-tooltip.is-stats { display:flex; flex-direction:column; align-items:flex-end; gap:2px; padding:7px 10px; white-space:nowrap; }
.tcg-counter-tooltip .tcg-counter-stat { display:flex; align-items:center; gap:6px; font:italic 800 20px/22px PowerBarlow,sans-serif; letter-spacing:.2px; font-variant-numeric:lining-nums tabular-nums; color:#f0f3e8; text-shadow:-1px 0 1px #000,1px 0 1px #000,0 2px 2px #000,0 0 5px #000; }
.tcg-counter-tooltip .tcg-counter-stat img { width:18px; height:18px; object-fit:contain; filter:drop-shadow(0 1px 2px #000); }
.tcg-champion130 .c130-imprint.tcg-etched {
    position: relative;
    display: block;
    inset: auto;
    width: 35px !important;
    height: 33px !important;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    overflow: visible;
}
.tcg-champion130 .c130-augments .c130-imprint.tcg-etched {
    width: 38px !important;
    height: 38px !important;
}
.tcg-champion130 .c130-imprint.tcg-etched img {
    opacity: 1;
    mix-blend-mode: normal;
}
.tcg-champion130 .c130-imprint.tcg-etched .c130-etch-item {
    filter: contrast(1.16) saturate(1.14) brightness(.98);
}
.tcg-champion130 .c130-imprint.tcg-etched .c130-etch-augment {
    filter: contrast(1.23) saturate(1.3) brightness(.87) drop-shadow(.6px .8px .3px #080b12);
}

/* Scavenger champions: a top-right label in the item cards' EQUIP lettering (2026-10-09). */
.tcg-champion130 .c130-scavenger { position:absolute; z-index:5; right:18px; top:18px; color:#d4dedb; font:600 11px/14px Arial,sans-serif; letter-spacing:1.7px; text-shadow:0 1px 2px #000; }

/* ===== Luck word placement. Every placement and size value for the word is in this block. =====
   Card px (the face is 258 x 366). The word sits inside the type label (<small>CHAMPION ...</small> in .c130-topline at
   top:18px, left:18px), positioned at the bottom of the label's own text box (top:100%), so it is the label's next line
   whatever the label's line box: the label's letters run about y 34.5-41.5 (measured from the approved Hecarim and
   K'Sante captures, local-mockups/equip-preview/shots), its text box ends about y 44, and the word's 12px bold caps on a
   14px line then run about y 46.5-55, 5px under the label's letters like a second label line. Champion faces start
   both equipment columns at --luck-column-top (y 59, 19px lower than without a word, 4px under the word's letters);
   equipment-finish.js reads it and fits the drawn columns between it and the bottom row (a full six items or six
   augments shrink from about 39px to 36px; with three counter rows the items end at y 274, above the counters at
   y 280). The plain imprint columns keep their usual offsets from it (items +5px, augments +13px). Item and augment
   faces have only artwork under the label. (Before the frame family below: that section declares no custom
   properties.) */
.tcg-champion130 { --luck-column-top:59px; }
.tcg-champion130 .c130-topline small:has(> .tcg-luck-word) { position:relative; }
.tcg-champion130 .c130-topline .tcg-luck-word { position:absolute; left:0; top:100%; font-size:12px; line-height:14px; letter-spacing:1.4px; }
.tcg-champion130:has(.c130-topline .tcg-luck-word) .c130-items { top:calc(var(--luck-column-top) + 5px); }
.tcg-champion130:has(.c130-topline .tcg-luck-word) .c130-augments { top:calc(var(--luck-column-top) + 13px); }
/* ===== End of luck word placement ===== */

/* Frame family (approved 2026-10-12, "Row B - harmonised progression"; working version 2026-10-14): one construction
   for every tier and card kind. The V3 band: 8 px raised 1.5 px (lit outer face and shaded inner face kept apart all
   the way round by a dark hairline, chamfer wall down to the art, dark foot, 1 px outer bevel), its light moving with
   the tilt (row (c)), casting a soft shadow on the art; tiers differ by palette and by what they add:
   Silver   polished steel, cool band light, plain polished bevel glass rim, faint cool glass shine.
   Gold     shipped gold, warm band light, two-slope gold mirror-bevel rim, gold glass shine and a sweep (9 s).
   Prismatic shipped Prismatic colours, spectral inner glow (not on foil cards), mirror-bevel rim with corner prism
            facets, P4E cut-gem glass (two planes of clear shards, a slim light flashing from group to group), a
            gem-catch sweep in the card's own hues (9 s).
   Secret   black obsidian ridge, ember band light, violet-to-ember inner glow, a glint sweeping along the band
            (11 s, not on foil cards), void glass with three depths of drifting stars thrown by the tilt, a star-catch
            sweep (9 s), stars drifting along its rim; grips unchanged.
   No border animation on Silver, Gold, Prismatic or any foil card. Motion (glint, sweeps, stars) runs only on the
   hovered or inspected card when it is on screen, never on thumbnails, and not under reduced motion; each sweep comes
   soon after a card is hovered or inspected, then every period.
   Static paint is pre-rendered (assets/frames/, supports/tcg_local/render_frame_textures.py). As the card turns, the
   band's light is a stripe card-tilt.js moves (no repaint), and Prismatic's shard lights stripes it moves within their planes. Thumbnails show the band light
   and the shards as pre-rendered images (below). The top-right tear (2026-10-14) was removed on 2026-10-16. */

/* Band, front plane: contact occlusion and the cast shadow on the art (black, faded from the band edge). */
.tcg-champion130 .c130-relic-frame::before,.tcg-champion130 .c130-relic-frame::after { content:''; position:absolute; inset:0; opacity:.42; }
.tcg-champion130 .c130-relic-frame::before { background:linear-gradient(90deg,#000 8px,#0000 11px) left/11px 100% no-repeat,linear-gradient(270deg,#000 8px,#0000 11px) right/11px 100% no-repeat,linear-gradient(180deg,#000 8px,#0000 11px) top/100% 11px no-repeat,linear-gradient(0deg,#000 8px,#0000 11px) bottom/100% 11px no-repeat; }
.tcg-champion130 .c130-relic-frame::after { background:linear-gradient(90deg,#000 8px,#0000 14px) left/14px 100% no-repeat,linear-gradient(270deg,#000 8px,#0000 14px) right/14px 100% no-repeat,linear-gradient(180deg,#000 8px,#0000 14px) top/100% 14px no-repeat,linear-gradient(0deg,#000 8px,#0000 14px) bottom/100% 14px no-repeat; transform:translate(1.5px,2px); }

/* Band, raised top: the pre-rendered faces, chamfer, foot and bevel; its light, on its top faces, follows the card's
   light (row (c); card-tilt.js bandLight moves its stripe, below). */
.tcg-champion130 .c130-band { inset:0; transform-origin:50% 50%; background-size:100% 100%; background-repeat:no-repeat; transform:translateZ(1.5px); }
.tcg-champion130 .c130-band-light { inset:0; overflow:hidden; border-radius:12px; padding:6.08px; transform:translateZ(1.55px);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0); }
/* The light: the band's old 300 % sheen (transparent 30 %, the light 50 %, transparent 70 % along a gradient line at the
   light's angle) drawn once as its 40 % stripe; card-tilt.js (bandLight) places, turns and stretches it to match and sets
   its strength. At rest (never lit, and thumbnails) the values below are that light at rest. */
.tcg-champion130 .c130-band-light > i { position:absolute; left:0; top:0; width:400px; height:460px; margin:-230px 0 0 -200px;
    background:linear-gradient(90deg,transparent,var(--band-light),transparent); opacity:.585; transform:translate(154.4245px,193.2721px) rotate(22deg) scaleX(1.128958); }
.tcg-champion130[data-tier="silver"] .c130-band-light { --band-light:#eef6ff26; }
.tcg-champion130[data-tier="gold"] .c130-band-light { --band-light:#fff1cf4d; }
.tcg-champion130[data-tier="prismatic"] .c130-band-light { --band-light:#ffffff4d; }
.tcg-champion130[data-tier="secret"] .c130-band-light { --band-light:#ffb48a3d; }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-band-light > i { opacity:.585!important; transform:translate(154.4245px,193.2721px) rotate(22deg) scaleX(1.128958)!important; }
.tcg-champion130[data-tier="silver"] .c130-band { background-image:url('assets/frames/band-silver.webp'); }
.tcg-champion130[data-tier="gold"] .c130-band { background-image:url('assets/frames/band-gold.webp'); }
.tcg-champion130[data-tier="prismatic"] .c130-band { background-image:url('assets/frames/band-prismatic.webp'); }
.tcg-champion130[data-tier="secret"] .c130-band { background-image:url('assets/frames/band-secret.webp'); }
/* Secret's band glint: a light three times the card's width slides across its top face (the ring the mask leaves). */
.tcg-champion130 .c130-band-glint { display:none; inset:0; overflow:hidden; border-radius:12px; padding:6.08px; transform:translateZ(1.6px);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0); }
.tcg-champion130 .c130-glint-light { position:absolute; left:0; top:0; width:300%; height:100%; opacity:0; transform:translateX(-66.667%);
    background:linear-gradient(112deg,transparent 38%,#ff8a4a4d 45%,#ffc29a99 50%,#b48aff4d 55%,transparent 62%); }
/* Inner glow along the band, over its shadow (front plane, under the counters): Prismatic spectral, Secret
   violet-to-ember. Prismatic's is off on foil cards: the foil film is their rainbow. */
.tcg-champion130 .c130-band-glow { position:absolute; inset:8px; z-index:12; border-radius:2px; pointer-events:none; }
.tcg-champion130[data-tier="prismatic"] .c130-band-glow { box-shadow:inset 7px 7px 18px -6px #6fd0ff40,inset -7px -7px 18px -6px #ff7eb640,inset 0 0 6px #e8d5ff2b; }
.tcg-card.is-foil .tcg-champion130[data-tier="prismatic"] .c130-band-glow { display:none; }
.tcg-champion130[data-tier="secret"] .c130-band-glow { opacity:.6425; background:linear-gradient(180deg,#7a4dff3d,#c2338a24 45%,#ff6a3d47); -webkit-mask:linear-gradient(90deg,#000,#0000 10.9px) left/10.9px 100% no-repeat,linear-gradient(270deg,#000,#0000 10.9px) right/10.9px 100% no-repeat,linear-gradient(180deg,#000,#0000 10.9px) top/100% 10.9px no-repeat,linear-gradient(0deg,#000,#0000 10.9px) bottom/100% 10.9px no-repeat; mask:linear-gradient(90deg,#000,#0000 10.9px) left/10.9px 100% no-repeat,linear-gradient(270deg,#000,#0000 10.9px) right/10.9px 100% no-repeat,linear-gradient(180deg,#000,#0000 10.9px) top/100% 10.9px no-repeat,linear-gradient(0deg,#000,#0000 10.9px) bottom/100% 10.9px no-repeat; }

/* The glass box (power plate) parts. Glass rims replace the crystal edge and bevel on Silver, Gold and Prismatic. */
.tcg-champion130 .c130-glass { left:87px; bottom:11px; width:157px; height:64px; background-size:100% 100%; background-repeat:no-repeat; }
.tcg-champion130 .c130-rim { transform:translateZ(11px); }
.tcg-champion130[data-tier="silver"] .c130-rim { background-image:url('assets/frames/rim-silver.webp'); }
.tcg-champion130[data-tier="gold"] .c130-rim { background-image:url('assets/frames/rim-gold.webp'); }
.tcg-champion130[data-tier="prismatic"] .c130-rim { background-image:url('assets/frames/rim-prismatic.webp'); }

/* Glass. Silver and Gold: a broad shine across the glass; Gold adds its warm tint. */
.tcg-champion130[data-tier="silver"] .c130-crystal { background:url('assets/frames/glass-silver.webp') 0 0/100% 100% no-repeat,linear-gradient(135deg,#d3ddec2a,#17253a42 27%,#121d335b 70%,#6e8ea827); }
.tcg-champion130[data-tier="gold"] .c130-crystal { background:url('assets/frames/glass-gold.webp') 0 0/100% 100% no-repeat,linear-gradient(135deg,#f3e2c22a,#2a211542 27%,#1d17105b 70%,#a88a5c27); }

/* The glass sweeps (2026-10-15), one family for every tier but Silver: a band 55 % of the glass wide crosses the glass
   now and then, inside the crystal (its clip is the glass outline). The sweep is as wide as the glass, its paint the
   band at its left, moved from -66 % to 126.5 % of the glass in each pass (transform only). The band is a multi-tone
   tail rising toward its front and a crisp edge line in the tail's own colour (a crisp leading edge, a soft tail).
   They keep running while the card turns. Gold: bronze through champagne, the rim's own tones (2026-10-26; it was a
   yellower amber), softened a little across the number. Prismatic: light blue fading to violet, an orchid edge, seen fully through the near shards and at
   half strength on the clear glass between them. Secret: violet through deep rose to ember, a white-gold core line. */
.tcg-champion130 .c130-glass-sweep { display:none; position:absolute; left:0; top:0; bottom:0; width:100%; pointer-events:none; opacity:0; transform:translateX(-66%);
    background-repeat:no-repeat; background-position:0 0; background-size:86.35px 100%; }
.tcg-champion130[data-tier="gold"] .c130-glass-sweep { background-image:linear-gradient(105deg,transparent 66.5%,#b8834abf 69.4%,#e8c99aff 70.6%,#e8c99aff 71.4%,#f2dcb473 73%,transparent 76%),linear-gradient(105deg,#7a502400 26%,#956a3a6b 38%,#b88a5296 48%,#d4b07fa8 56%,#e0c08cc4 64%,#e0c08cb0 70%,transparent 72%);
    -webkit-mask:linear-gradient(180deg,#000 0,#000 40%,#000d 52%,#000d 88%,#000 100%); mask:linear-gradient(180deg,#000 0,#000 40%,#000d 52%,#000d 88%,#000 100%); }
.tcg-champion130 .c130-sweep-window { position:absolute; inset:0; display:block; pointer-events:none;
    -webkit-mask:url('assets/frames/prismatic-sweep-window.webp') 0 -2px/157px 68px no-repeat,linear-gradient(#00000080,#00000080);
    mask:url('assets/frames/prismatic-sweep-window.webp') 0 -2px/157px 68px no-repeat,linear-gradient(#00000080,#00000080); }
.tcg-champion130[data-tier="prismatic"] .c130-glass-sweep { background-image:linear-gradient(105deg,transparent 66.5%,#b59affbf 69.4%,#c38cffff 70.6%,#c38cffff 71.4%,#e796ff73 73%,transparent 76%),linear-gradient(105deg,#94dfff00 26%,#94dfff6b 38%,#a6c8ff9e 48%,#c9c3ffb2 56%,#b59affd1 64%,#b59affbc 70%,transparent 72%); }
.tcg-champion130[data-tier="secret"] .c130-glass-sweep { background-image:linear-gradient(105deg,transparent 66.5%,#ffb060bf 69.4%,#fff1d0ff 70.6%,#fff1d0ff 71.4%,#ffd0a066 73%,transparent 76%),linear-gradient(105deg,#7a4dff00 26%,#7a4dff59 38%,#c2338a80 50%,#ff6a3d9e 61%,#ff9a4ab8 66%,#ff9a4aa5 70%,transparent 72%); }

/* Prismatic: transparent cut-gem glass (P4E, row (c)'s glass, with G4's clearer shards, 2026-10-15). Two planes of
   facets under the crystal, deep (6 px, dimmer and a little lavender) and near (7.5 px, a faint white body), so the
   turn shifts them against each other; each plane's facets in five groups (prismatic-shards-deep/-near.webp), each
   group carrying a slim white light that moves with the card's light at the group's own offset, so as the card turns
   the light flashes from group to group while most panes stay clear. Bright cut lines in white and lavender, the
   near plane casting a hairline seat and a soft shadow on the deep shards, and the facet plate darkening the glass
   behind the number. (The moving light repaints the facets as the card turns: row (c)'s look, accepted.) */
.tcg-champion130 .c130-facets-deep { transform:translateZ(6px); }
/* The near plane sits on the deep one: a hairline dark seat and a soft shadow under its shards and cut lines. */
.tcg-champion130 .c130-facets-near { transform:translateZ(7.5px); filter:drop-shadow(0 0 .4px #140c24cc) drop-shadow(1px 1.4px .9px #140c2466); }
.tcg-champion130 .c130-facet,.tcg-champion130 .c130-facet-edges,.tcg-champion130 .c130-facet-plate { position:absolute; inset:0; }
.tcg-champion130 .c130-facets-deep .c130-facet { opacity:.36; -webkit-mask:url('assets/frames/prismatic-shards-deep.webp') 0 0/157px 340px no-repeat; mask:url('assets/frames/prismatic-shards-deep.webp') 0 0/157px 340px no-repeat; }
.tcg-champion130 .c130-facets-near .c130-facet { opacity:.88; -webkit-mask:url('assets/frames/prismatic-shards-near.webp') 0 0/157px 340px no-repeat; mask:url('assets/frames/prismatic-shards-near.webp') 0 0/157px 340px no-repeat; }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(1) { -webkit-mask-position:0 -2px; mask-position:0 -2px; background:linear-gradient(#c9c3ff2e,#c9c3ff2e),linear-gradient(135deg,#6a7fb03d,#b6e2ee24); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(1) > i { transform:translate(56.5200px,-138.2400px); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(1) > i > i { transform:rotate(2.0000deg) translateY(81.6465px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(2) { -webkit-mask-position:0 -70px; mask-position:0 -70px; background:linear-gradient(#c9c3ff2e,#c9c3ff2e),linear-gradient(135deg,#8f84d03d,#efe6ff24); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(2) > i { transform:translate(-50.2400px,-94.7200px); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(2) > i > i { transform:rotate(2.0000deg) translateY(34.4272px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(3) { -webkit-mask-position:0 -138px; mask-position:0 -138px; background:linear-gradient(#c9c3ff2e,#c9c3ff2e),linear-gradient(135deg,#b6e2ee3d,#ffffff24); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(3) > i { transform:translate(-157.0000px,-51.2000px); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(3) > i > i { transform:rotate(2.0000deg) translateY(-12.7922px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(4) { -webkit-mask-position:0 -206px; mask-position:0 -206px; background:linear-gradient(#c9c3ff2e,#c9c3ff2e),linear-gradient(135deg,#efe6ff3d,#6a7fb024); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(4) > i { transform:translate(-263.7600px,-7.6800px); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(4) > i > i { transform:rotate(2.0000deg) translateY(-60.0116px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(5) { -webkit-mask-position:0 -274px; mask-position:0 -274px; background:linear-gradient(#c9c3ff2e,#c9c3ff2e),linear-gradient(135deg,#ffffff3d,#8f84d024); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(5) > i { transform:translate(-370.5200px,35.8400px); }
.tcg-champion130 .c130-facets-deep .c130-facet:nth-child(5) > i > i { transform:rotate(2.0000deg) translateY(-107.2309px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(1) { -webkit-mask-position:0 -2px; mask-position:0 -2px; background:linear-gradient(#ffffff1f,#ffffff1f),linear-gradient(135deg,#6a7fb03d,#b6e2ee24); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(1) > i { transform:translate(18.8400px,-122.8800px); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(1) > i > i { transform:rotate(2.0000deg) translateY(64.9809px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(2) { -webkit-mask-position:0 -70px; mask-position:0 -70px; background:linear-gradient(#ffffff1f,#ffffff1f),linear-gradient(135deg,#8f84d03d,#efe6ff24); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(2) > i { transform:translate(-69.0800px,-87.0400px); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(2) > i > i { transform:rotate(2.0000deg) translateY(26.0943px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(3) { -webkit-mask-position:0 -138px; mask-position:0 -138px; background:linear-gradient(#ffffff1f,#ffffff1f),linear-gradient(135deg,#b6e2ee3d,#ffffff24); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(3) > i { transform:translate(-157.0000px,-51.2000px); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(3) > i > i { transform:rotate(2.0000deg) translateY(-12.7922px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(4) { -webkit-mask-position:0 -206px; mask-position:0 -206px; background:linear-gradient(#ffffff1f,#ffffff1f),linear-gradient(135deg,#efe6ff3d,#6a7fb024); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(4) > i { transform:translate(-244.9200px,-15.3600px); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(4) > i > i { transform:rotate(2.0000deg) translateY(-51.6787px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(5) { -webkit-mask-position:0 -274px; mask-position:0 -274px; background:linear-gradient(#ffffff1f,#ffffff1f),linear-gradient(135deg,#ffffff3d,#8f84d024); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(5) > i { transform:translate(-332.8400px,20.4800px); }
.tcg-champion130 .c130-facets-near .c130-facet:nth-child(5) > i > i { transform:rotate(2.0000deg) translateY(-90.5653px) scaleX(0.954828); }
.tcg-champion130 .c130-facets-deep .c130-facet-edges { opacity:.55; background:linear-gradient(135deg,#d9e6ff,#efe0ff);
    -webkit-mask:url('assets/frames/prismatic-edges-deep.webp') 0 -2px/157px 68px no-repeat; mask:url('assets/frames/prismatic-edges-deep.webp') 0 -2px/157px 68px no-repeat; }
.tcg-champion130 .c130-facets-near .c130-facet-edges { opacity:.95;
    background:linear-gradient(135deg,#f4f0ff,#e4dcff 50%,#f4f0ff);
    -webkit-mask:url('assets/frames/prismatic-edges-near.webp') 0 -2px/157px 68px no-repeat; mask:url('assets/frames/prismatic-edges-near.webp') 0 -2px/157px 68px no-repeat; }
/* Each lit group's light (and the near cut lines'): the old 300 % background box of its gradient (471 by 192 px, which
   clips it), holding the gradient's lit stripe (120 px for the 24 % between 38 and 62 %; the cut lines' 160 px for 34 to
   66 %). card-tilt.js (shardLights) moves the box with the light and turns, places and stretches the stripe; the values
   here are the light at rest. The stripes are painted into their plane (itself a layer) rather than given layers of their
   own: a dozen extra layers, each masked group a separate render pass, made the turning card drop frames as the pointer
   crossed it (2026-10-16). */
.tcg-champion130 .c130-facet,.tcg-champion130 .c130-facets-near .c130-facet-edges { overflow:hidden; }
.tcg-champion130 .c130-facet > i,.tcg-champion130 .c130-facet-edges > i { position:absolute; left:0; top:0; width:471px; height:192px; overflow:hidden; }
.tcg-champion130 .c130-facet > i > i,.tcg-champion130 .c130-facet-edges > i > i { position:absolute; left:175.5px; top:6px; width:120px; height:180px; background:linear-gradient(90deg,transparent,#fff,transparent); }
.tcg-champion130 .c130-facets-near .c130-facet-edges > i { transform:translate(-157.0000px,-51.2000px); }
.tcg-champion130 .c130-facets-near .c130-facet-edges > i > i { left:155.5px; width:160px; transform:rotate(22.0000deg) translateY(-11.8680px) scaleX(1.017256); }
.tcg-champion130 .c130-facet-plate { background:radial-gradient(ellipse 34% 40% at 56% 63%,#07060d8c 0,#07060d5c 50%,#07060d00 100%); }
/* Thumbnails hold the shards at rest (over the light card-tilt.js writes onto them), so a hover never repaints them. */
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facet,
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facet-edges { --shine-x:34%!important; --shine-y:22%!important; --shine-angle:112deg!important; --reflection:.17!important; }

/* Thumbnails (2026-10-16): the band light and Prismatic's shard planes hold their rest pose in a thumbnail, so
   each is one image drawn at rest from this stylesheet (supports/tcg_local/render_frame_textures.py --thumbnails) instead
   of its masked and blended layers, which a scrolling grid would rasterise card by card. The near shards' image carries
   their drop shadow (4 px round the plane). */
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-band-light > i,.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facets > i { display:none; }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-band-light { -webkit-mask:none; mask:none; background:0 0/100% 100% no-repeat; }
.tcg-card[data-thumbnail="true"] .tcg-champion130[data-tier="silver"] .c130-band-light { background-image:url('assets/frames/thumb-band-light-silver.webp'); }
.tcg-card[data-thumbnail="true"] .tcg-champion130[data-tier="gold"] .c130-band-light { background-image:url('assets/frames/thumb-band-light-gold.webp'); }
.tcg-card[data-thumbnail="true"] .tcg-champion130[data-tier="prismatic"] .c130-band-light { background-image:url('assets/frames/thumb-band-light-prismatic.webp'); }
.tcg-card[data-thumbnail="true"] .tcg-champion130[data-tier="secret"] .c130-band-light { background-image:url('assets/frames/thumb-band-light-secret.webp'); }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facets-deep { background:url('assets/frames/thumb-shards-deep.webp') 0 0/100% 100% no-repeat; }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facets-near { filter:none; }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-facets-near::after { content:''; position:absolute; inset:-4px; background:url('assets/frames/thumb-shards-near.webp') 0 0/100% 100% no-repeat; }

/* Secret's stars: three layers inside the void glass (far: the nebula field, screened; mid; near: haloed), each
   larger than the glass. The tilt throws them against the turn, the nearer the further (transform only; card-tilt.js
   writes the turn onto them), and each drifts slowly on its own, the nearer layers further and faster (clearly moving,
   calmly), pausing while the card turns (the tilt moves them then): a drift running under a turning layer costs each
   tilt frame, as would easing the throw with a transition. */
.tcg-champion130 .c130-glass-field { position:absolute; pointer-events:none; }
.tcg-champion130 .c130-glass-field > i { position:absolute; inset:0; display:block; }
.tcg-champion130 .c130-field-far { inset:-20%; opacity:.95; mix-blend-mode:screen; transform:translate(calc(var(--tilt-yaw,0) * -.4px),calc(var(--tilt-pitch,0) * .4px)); }
.tcg-champion130 .c130-field-mid { inset:-25%; transform:translate(calc(var(--tilt-yaw,0) * -.75px),calc(var(--tilt-pitch,0) * .75px)); }
.tcg-champion130 .c130-field-near { inset:-30%; transform:translate(calc(var(--tilt-yaw,0) * -1.2px),calc(var(--tilt-pitch,0) * 1.2px)); }
.tcg-champion130 .c130-field-far > i { background:url('assets/frames/secret-field.webp') 0 50%/100% calc(100% * 94 / 90) no-repeat; }
.tcg-champion130 .c130-field-mid > i { background:url('assets/frames/secret-stars-mid.webp') 0 50%/100% calc(100% * 94 / 90) no-repeat; }
.tcg-champion130 .c130-field-near > i { background:url('assets/frames/secret-stars-near.webp') 0 50%/100% calc(100% * 94 / 90) no-repeat; }
.tcg-card[data-thumbnail="true"] .tcg-champion130 .c130-glass-field { --tilt-yaw:0!important; --tilt-pitch:0!important; }

/* The light layers get layers of their own only on the card being turned (hovered or inspected): elsewhere they are
   painted once with their card, so a hand or grid of cards carries no extra layers or clip surfaces. Prismatic's shard
   lights never do (see the shards above). */
.tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-glass-field { will-change:transform; }
.tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-band-light > i { will-change:transform,opacity; }

/* Secret: void glass with its stars, a violet-to-ember aurora, its rim lit violet, and stars drifting and twinkling
   along the rim. */
.tcg-champion130[data-tier="secret"] .c130-crystal::after { content:''; position:absolute; pointer-events:none; mix-blend-mode:screen; }
.tcg-champion130[data-tier="secret"] .c130-crystal::after { inset:-30%; opacity:.568; background:linear-gradient(152deg,transparent 30%,#ff5a2a50 40%,#c2338a60 48%,#7a4dff66 56%,transparent 66%) 50% 50%/220% 220% no-repeat; }
.tcg-champion130[data-tier="secret"] .c130-crystal-edge { background:url('assets/frames/secret-edge.webp') 0 0/100% 100% no-repeat; }
.tcg-champion130 .c130-void { transform:translateZ(12px); background-image:url('assets/frames/secret-dust.webp'); }
.tcg-champion130 .c130-void-twinkle,.tcg-champion130 .c130-twinkle,.tcg-champion130 .c130-void-star { position:absolute; display:block; pointer-events:none; }
.tcg-champion130 .c130-void-twinkle { inset:0; clip-path:polygon(25.98px 13.43px,149.29px 4.12px,153.00px 7.52px,153.00px 52.84px,141.71px 60.00px,10.09px 60.00px,4.64px 51.12px); }
.tcg-champion130 .c130-twinkle { inset:-20%; background:url('assets/frames/secret-twinkle.webp') no-repeat; background-size:100% calc(100% * 282 / 90); }
.tcg-champion130 .c130-twinkle:nth-child(1) { background-position:0 1.0417%; opacity:.264; }
.tcg-champion130 .c130-twinkle:nth-child(2) { background-position:0 50%; opacity:.883; }
.tcg-champion130 .c130-twinkle:nth-child(3) { background-position:0 98.958%; opacity:.41; }
/* Each star sits at its place on the rim path at rest (the frame its animation starts from). */
.tcg-champion130 .c130-void-star { left:0; top:0; border-radius:50%; }
.tcg-champion130 .c130-void-star-1 { width:7.5px; height:7.5px; margin:-3.75px; translate:47.87px 9.77px; opacity:.83; background:radial-gradient(circle,#fff 0,#fff 12%,#fff 22%,#fff6 40%,#7a4dff33 60%,transparent 72%); }
.tcg-champion130 .c130-void-star-2 { width:4.6px; height:4.6px; margin:-2.3px; translate:136.48px 3.08px; opacity:.476; background:radial-gradient(circle,#fff 0,#fff 12%,#ffe2cf 22%,#ffe2cf66 40%,#7a4dff33 60%,transparent 72%); }
.tcg-champion130 .c130-void-star-3 { width:3.4px; height:3.4px; margin:-1.7px; translate:116.81px 62px; opacity:.489; background:radial-gradient(circle,#fff 0,#fff 12%,#d9ccff 22%,#d9ccff66 40%,#7a4dff33 60%,transparent 72%); }
.tcg-champion130 .c130-void-star-4 { width:5.6px; height:5.6px; margin:-2.8px; translate:35.68px 62px; opacity:.796; background:radial-gradient(circle,#fff 0,#fff 12%,#fff 22%,#fff6 40%,#7a4dff33 60%,transparent 72%); }
.tcg-champion130 .c130-void-star-5 { width:2.8px; height:2.8px; margin:-1.4px; translate:2.74px 51.84px; opacity:.763; background:radial-gradient(circle,#fff 0,#fff 12%,#bfe9ff 22%,#bfe9ff66 40%,#7a4dff33 60%,transparent 72%); }

/* Foil stars stay out of the power-level glass (the box between 31-97 % across and 76.5-99 % down, padded for the
   star size). */
.tcg-card.is-foil .tcg-champion130 .review-foil .dust { clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,31% 76.5%,97% 76.5%,97% 99%,31% 99%,31% 76.5%); }

/* Motion: the card under the pointer and the one being inspected (viewer, selected pack or event-winnings card,
   collection detail, trade, enlarged event card), on screen only: every running animation costs each frame, so a revealed
   hand stays still until hovered, except for the glass sweeps: every face-up card in a pack or event-winnings hand (five
   at most) has its sweep. The sweeps and Secret's glint start once the card is face up. */
@media (prefers-reduced-motion:no-preference) {
    .tcg-card-slot.is-in-view .tcg-card.is-revealed:not([data-thumbnail="true"]):not(.is-foil):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-tier="secret"] .c130-band-glint { display:block; }
    .tcg-card-slot.is-in-view .tcg-card.is-revealed:not([data-thumbnail="true"]):not(.is-foil):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-tier="secret"] .c130-glint-light { animation:c130-glint 11s .9s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card.is-revealed:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card,.tcg-hand .tcg-card) .c130-glass-sweep { display:block; }
    .tcg-card-slot.is-in-view .tcg-card.is-revealed:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card,.tcg-hand .tcg-card) .c130-glass-sweep { animation:c130-glass-sweep 9s 1.2s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-field-far > i { animation:c130-drift-far 23s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-field-mid > i { animation:c130-drift-mid 14s -6s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-field-near > i { animation:c130-drift-near 10s -4s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"])[data-turning]:is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-glass-field > i { animation-play-state:paused; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-linger] .c130-field-far { animation:c130-wander-far 13s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-linger] .c130-field-mid { animation:c130-wander-mid 13s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-linger] .c130-field-near { animation:c130-wander-near 13s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .tcg-champion130[data-tier="secret"] .c130-crystal::after { animation:c130-void-aurora 9s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-twinkle:nth-child(1) { animation:c130-void-twinkle 2.7s -1.3s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-twinkle:nth-child(2) { animation:c130-void-twinkle 4.1s -.4s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-twinkle:nth-child(3) { animation:c130-void-twinkle 5.6s -3.1s ease-in-out infinite alternate; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-void-star-1 { animation:c130-void-star-1 31s -1.86s linear infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-void-star-2 { animation:c130-void-star-2 43s -12.47s linear infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-void-star-3 { animation:c130-void-star-3 37s -15.91s linear infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-void-star-4 { animation:c130-void-star-4 53s -41.34s linear infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]):is(:hover,#tcg-inspected-card .tcg-card,.tcg-hand.is-inspecting .is-selected .tcg-card,.detail-hero .tcg-card,.tcg-trade-enlarged .tcg-card,.spoils-enlarged .tcg-card) .c130-void-star-5 { animation:c130-void-star-5 47s -5.64s linear infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]) .tcg-luck-word[data-luck="5"] { animation:c130-luck-sheen 7s ease-in-out infinite; }
    .tcg-card-slot.is-in-view .tcg-card:not([data-thumbnail="true"]) .tcg-luck-word[data-luck="5"]::after { animation:tcg-foil-glint 3.2s ease-in-out infinite; }
}
@keyframes c130-glint { 0% { opacity:0; transform:translateX(-66.667%); } 2% { opacity:1; } 15% { opacity:1; transform:translateX(0); } 16%,100% { opacity:0; transform:translateX(0); } }
/* A sweep crosses the glass at the start of each period (2.88 s of 9 s), so the first comes soon after a card is hovered
   or inspected. */
@keyframes c130-glass-sweep { 0% { opacity:0; transform:translateX(-66%); } 4% { opacity:1; } 28% { opacity:1; } 32% { opacity:0; transform:translateX(126.5%); } 32.01%,100% { opacity:0; transform:translateX(-66%); } }
/* Lingering stars (Secret, data-linger; off unless champion130.js LINGERING_STARS): the viewpoint wanders in a slow loop,
   the nearer layers further, on the layers' translate (their transform carries the tilt's eased throw: star-linger.js). */
@keyframes c130-wander-far { 0%,50%,100% { translate:0 0; } 12.5% { translate:1.1px -1.1px; } 25% { translate:1.6px -0.9px; } 37.5% { translate:1.1px 1.1px; } 62.5% { translate:-1.1px -1.1px; } 75% { translate:-1.6px 0.9px; } 87.5% { translate:-1.1px 1.1px; } }
@keyframes c130-wander-mid { 0%,50%,100% { translate:0 0; } 12.5% { translate:2.2px -2.2px; } 25% { translate:3.2px -1.8px; } 37.5% { translate:2.2px 2.2px; } 62.5% { translate:-2.2px -2.2px; } 75% { translate:-3.2px 1.8px; } 87.5% { translate:-2.2px 2.2px; } }
@keyframes c130-wander-near { 0%,50%,100% { translate:0 0; } 12.5% { translate:3.85px -3.85px; } 25% { translate:5.6px -3.15px; } 37.5% { translate:3.85px 3.85px; } 62.5% { translate:-3.85px -3.85px; } 75% { translate:-5.6px 3.15px; } 87.5% { translate:-3.85px 3.85px; } }
@keyframes c130-drift-far { to { transform:translate(-5px,2px); opacity:.8; } }
@keyframes c130-drift-mid { to { transform:translate(11px,-3px); } }
@keyframes c130-drift-near { to { transform:translate(-16px,-4px); } }
@keyframes c130-void-aurora { to { transform:translate(10px,-3px) skewX(-8deg); } }
@keyframes c130-void-twinkle { 0% { opacity:.95; } 45% { opacity:.25; } 70% { opacity:.7; } 100% { opacity:.1; } }
/* Each star drifts round the rim path at constant speed and twinkles (1, .45, .8 and back) a whole number of times
   per circuit, in one animation. */
@keyframes c130-void-star-1 { 0.00% { translate:24.76px 11.51px; opacity:0.63; } 3.74% { translate:39.18px 10.42px; opacity:1.00; } 9.24% { translate:60.37px 8.82px; opacity:0.45; } 13.74% { translate:77.70px 7.52px; opacity:0.80; } 13.74% { translate:77.70px 7.52px; opacity:0.80; } 18.24% { translate:95.04px 6.21px; opacity:0.45; } 23.74% { translate:116.23px 4.61px; opacity:1.00; } 23.74% { translate:116.23px 4.61px; opacity:1.00; } 29.24% { translate:137.42px 3.01px; opacity:0.45; } 32.51% { translate:150.01px 2.06px; opacity:0.70; } 33.74% { translate:153.50px 5.27px; opacity:0.80; } 34.27% { translate:155.00px 6.64px; opacity:0.76; } 38.24% { translate:155.00px 21.99px; opacity:0.45; } 43.74% { translate:155.00px 43.24px; opacity:1.00; } 43.74% { translate:155.00px 43.24px; opacity:1.00; } 46.51% { translate:155.00px 53.94px; opacity:0.72; } 49.24% { translate:146.10px 59.59px; opacity:0.45; } 50.41% { translate:142.29px 62.00px; opacity:0.54; } 53.74% { translate:129.42px 62.00px; opacity:0.80; } 53.74% { translate:129.42px 62.00px; opacity:0.80; } 58.24% { translate:112.03px 62.00px; opacity:0.45; } 63.74% { translate:90.79px 62.00px; opacity:1.00; } 69.24% { translate:69.54px 62.00px; opacity:0.45; } 73.74% { translate:52.15px 62.00px; opacity:0.80; } 78.24% { translate:34.77px 62.00px; opacity:0.45; } 83.74% { translate:13.52px 62.00px; opacity:1.00; } 83.74% { translate:13.52px 62.00px; opacity:1.00; } 84.92% { translate:8.97px 62.00px; opacity:0.88; } 88.21% { translate:2.32px 51.16px; opacity:0.55; } 89.24% { translate:4.28px 47.69px; opacity:0.45; } 93.74% { translate:12.85px 32.56px; opacity:0.80; } 98.24% { translate:21.41px 17.42px; opacity:0.45; } 100.00% { translate:24.76px 11.51px; opacity:0.63; } }
@keyframes c130-void-star-2 { 0.00% { translate:24.76px 11.51px; opacity:0.68; } 0.74% { translate:27.63px 11.29px; opacity:0.80; } 2.99% { translate:36.30px 10.64px; opacity:0.45; } 5.74% { translate:46.89px 9.84px; opacity:1.00; } 8.49% { translate:57.49px 9.04px; opacity:0.45; } 10.74% { translate:66.15px 8.39px; opacity:0.80; } 10.74% { translate:66.15px 8.39px; opacity:0.80; } 12.99% { translate:74.82px 7.73px; opacity:0.45; } 15.74% { translate:85.42px 6.93px; opacity:1.00; } 15.74% { translate:85.42px 6.93px; opacity:1.00; } 18.49% { translate:96.01px 6.13px; opacity:0.45; } 20.74% { translate:104.68px 5.48px; opacity:0.80; } 20.74% { translate:104.68px 5.48px; opacity:0.80; } 22.99% { translate:113.35px 4.83px; opacity:0.45; } 25.74% { translate:123.94px 4.03px; opacity:1.00; } 25.74% { translate:123.94px 4.03px; opacity:1.00; } 28.49% { translate:134.54px 3.23px; opacity:0.45; } 30.74% { translate:143.21px 2.57px; opacity:0.80; } 30.74% { translate:143.21px 2.57px; opacity:0.80; } 32.51% { translate:150.01px 2.06px; opacity:0.53; } 32.99% { translate:151.38px 3.32px; opacity:0.45; } 34.27% { translate:155.00px 6.64px; opacity:0.71; } 35.74% { translate:155.00px 12.34px; opacity:1.00; } 35.74% { translate:155.00px 12.34px; opacity:1.00; } 38.49% { translate:155.00px 22.96px; opacity:0.45; } 40.74% { translate:155.00px 31.66px; opacity:0.80; } 42.99% { translate:155.00px 40.35px; opacity:0.45; } 45.74% { translate:155.00px 50.98px; opacity:1.00; } 45.74% { translate:155.00px 50.98px; opacity:1.00; } 46.51% { translate:155.00px 53.94px; opacity:0.85; } 48.49% { translate:148.53px 58.04px; opacity:0.45; } 50.41% { translate:142.29px 62.00px; opacity:0.75; } 50.74% { translate:141.00px 62.00px; opacity:0.80; } 52.99% { translate:132.31px 62.00px; opacity:0.45; } 55.74% { translate:121.68px 62.00px; opacity:1.00; } 58.49% { translate:111.06px 62.00px; opacity:0.45; } 60.74% { translate:102.37px 62.00px; opacity:0.80; } 60.74% { translate:102.37px 62.00px; opacity:0.80; } 62.99% { translate:93.67px 62.00px; opacity:0.45; } 65.74% { translate:83.05px 62.00px; opacity:1.00; } 68.49% { translate:72.43px 62.00px; opacity:0.45; } 70.74% { translate:63.73px 62.00px; opacity:0.80; } 70.74% { translate:63.73px 62.00px; opacity:0.80; } 72.99% { translate:55.04px 62.00px; opacity:0.45; } 75.74% { translate:44.42px 62.00px; opacity:1.00; } 78.49% { translate:33.79px 62.00px; opacity:0.45; } 80.74% { translate:25.10px 62.00px; opacity:0.80; } 82.99% { translate:16.41px 62.00px; opacity:0.45; } 84.92% { translate:8.97px 62.00px; opacity:0.84; } 85.74% { translate:7.30px 59.28px; opacity:1.00; } 88.21% { translate:2.32px 51.16px; opacity:0.51; } 88.49% { translate:2.86px 50.20px; opacity:0.45; } 90.74% { translate:7.14px 42.64px; opacity:0.80; } 90.74% { translate:7.14px 42.64px; opacity:0.80; } 92.99% { translate:11.43px 35.07px; opacity:0.45; } 95.74% { translate:16.66px 25.82px; opacity:1.00; } 98.49% { translate:21.89px 16.57px; opacity:0.45; } 100.00% { translate:24.76px 11.51px; opacity:0.68; } }
@keyframes c130-void-star-3 { 0.00% { translate:24.76px 11.51px; opacity:0.79; } 5.45% { translate:14.39px 29.84px; opacity:0.45; } 11.79% { translate:2.32px 51.16px; opacity:0.96; } 12.32% { translate:3.40px 52.92px; opacity:1.00; } 15.08% { translate:8.97px 62.00px; opacity:0.78; } 19.20% { translate:24.88px 62.00px; opacity:0.45; } 24.82% { translate:46.61px 62.00px; opacity:0.80; } 30.45% { translate:68.35px 62.00px; opacity:0.45; } 37.32% { translate:94.90px 62.00px; opacity:1.00; } 44.20% { translate:121.46px 62.00px; opacity:0.45; } 49.59% { translate:142.29px 62.00px; opacity:0.79; } 49.82% { translate:143.05px 61.52px; opacity:0.80; } 53.49% { translate:155.00px 53.94px; opacity:0.57; } 55.45% { translate:155.00px 46.37px; opacity:0.45; } 62.32% { translate:155.00px 19.80px; opacity:1.00; } 65.73% { translate:155.00px 6.64px; opacity:0.73; } 67.49% { translate:150.01px 2.06px; opacity:0.59; } 69.20% { translate:143.42px 2.56px; opacity:0.45; } 74.82% { translate:121.75px 4.19px; opacity:0.80; } 80.45% { translate:100.08px 5.83px; opacity:0.45; } 87.32% { translate:73.60px 7.83px; opacity:1.00; } 94.20% { translate:47.11px 9.82px; opacity:0.45; } 99.82% { translate:25.44px 11.46px; opacity:0.80; } 100.00% { translate:24.76px 11.51px; opacity:0.79; } }
@keyframes c130-void-star-4 { 0.00% { translate:24.76px 11.51px; opacity:0.73; } 0.49% { translate:26.67px 11.37px; opacity:0.80; } 2.99% { translate:36.30px 10.64px; opacity:0.45; } 6.05% { translate:48.07px 9.75px; opacity:1.00; } 9.11% { translate:59.84px 8.86px; opacity:0.45; } 11.61% { translate:69.47px 8.14px; opacity:0.80; } 14.11% { translate:79.11px 7.41px; opacity:0.45; } 17.16% { translate:90.88px 6.52px; opacity:1.00; } 20.22% { translate:102.65px 5.63px; opacity:0.45; } 22.72% { translate:112.28px 4.91px; opacity:0.80; } 25.22% { translate:121.91px 4.18px; opacity:0.45; } 28.27% { translate:133.68px 3.29px; opacity:1.00; } 31.33% { translate:145.46px 2.40px; opacity:0.45; } 32.51% { translate:150.01px 2.06px; opacity:0.62; } 33.83% { translate:153.75px 5.49px; opacity:0.80; } 33.83% { translate:153.75px 5.49px; opacity:0.80; } 34.27% { translate:155.00px 6.64px; opacity:0.74; } 36.33% { translate:155.00px 14.59px; opacity:0.45; } 39.38% { translate:155.00px 26.40px; opacity:1.00; } 39.38% { translate:155.00px 26.40px; opacity:1.00; } 42.44% { translate:155.00px 38.21px; opacity:0.45; } 44.94% { translate:155.00px 47.87px; opacity:0.80; } 44.94% { translate:155.00px 47.87px; opacity:0.80; } 46.51% { translate:155.00px 53.94px; opacity:0.58; } 47.44% { translate:151.97px 55.86px; opacity:0.45; } 50.41% { translate:142.29px 62.00px; opacity:0.98; } 50.49% { translate:141.96px 62.00px; opacity:1.00; } 53.55% { translate:130.16px 62.00px; opacity:0.45; } 56.05% { translate:120.50px 62.00px; opacity:0.80; } 56.05% { translate:120.50px 62.00px; opacity:0.80; } 58.55% { translate:110.84px 62.00px; opacity:0.45; } 61.61% { translate:99.04px 62.00px; opacity:1.00; } 64.66% { translate:87.23px 62.00px; opacity:0.45; } 67.16% { translate:77.58px 62.00px; opacity:0.80; } 69.66% { translate:67.92px 62.00px; opacity:0.45; } 72.72% { translate:56.11px 62.00px; opacity:1.00; } 75.77% { translate:44.31px 62.00px; opacity:0.45; } 78.27% { translate:34.65px 62.00px; opacity:0.80; } 80.77% { translate:24.99px 62.00px; opacity:0.45; } 83.83% { translate:13.19px 62.00px; opacity:1.00; } 84.92% { translate:8.97px 62.00px; opacity:0.80; } 86.88% { translate:5.00px 55.53px; opacity:0.45; } 88.21% { translate:2.32px 51.16px; opacity:0.64; } 89.38% { translate:4.55px 47.21px; opacity:0.80; } 91.88% { translate:9.31px 38.81px; opacity:0.45; } 94.94% { translate:15.13px 28.53px; opacity:1.00; } 97.99% { translate:20.94px 18.25px; opacity:0.45; } 100.00% { translate:24.76px 11.51px; opacity:0.73; } }
@keyframes c130-void-star-5 { 0.00% { translate:24.76px 11.51px; opacity:0.45; } 4.55% { translate:16.09px 26.82px; opacity:1.00; } 9.14% { translate:7.37px 42.24px; opacity:0.45; } 11.79% { translate:2.32px 51.16px; opacity:0.70; } 12.89% { translate:4.54px 54.77px; opacity:0.80; } 15.08% { translate:8.97px 62.00px; opacity:0.60; } 16.64% { translate:14.98px 62.00px; opacity:0.45; } 21.22% { translate:32.69px 62.00px; opacity:1.00; } 25.80% { translate:50.40px 62.00px; opacity:0.45; } 29.55% { translate:64.88px 62.00px; opacity:0.80; } 33.30% { translate:79.37px 62.00px; opacity:0.45; } 37.89% { translate:97.08px 62.00px; opacity:1.00; } 42.47% { translate:114.78px 62.00px; opacity:0.45; } 46.22% { translate:129.27px 62.00px; opacity:0.80; } 46.22% { translate:129.27px 62.00px; opacity:0.80; } 49.59% { translate:142.29px 62.00px; opacity:0.49; } 49.97% { translate:143.53px 61.21px; opacity:0.45; } 53.49% { translate:155.00px 53.94px; opacity:0.87; } 54.55% { translate:155.00px 49.83px; opacity:1.00; } 54.55% { translate:155.00px 49.83px; opacity:1.00; } 59.14% { translate:155.00px 32.12px; opacity:0.45; } 62.89% { translate:155.00px 17.63px; opacity:0.80; } 62.89% { translate:155.00px 17.63px; opacity:0.80; } 65.73% { translate:155.00px 6.64px; opacity:0.53; } 66.64% { translate:152.43px 4.28px; opacity:0.45; } 67.49% { translate:150.01px 2.06px; opacity:0.55; } 71.22% { translate:135.64px 3.14px; opacity:1.00; } 75.80% { translate:117.98px 4.48px; opacity:0.45; } 79.55% { translate:103.53px 5.57px; opacity:0.80; } 83.30% { translate:89.09px 6.66px; opacity:0.45; } 87.89% { translate:71.43px 7.99px; opacity:1.00; } 87.89% { translate:71.43px 7.99px; opacity:1.00; } 92.47% { translate:53.77px 9.32px; opacity:0.45; } 96.22% { translate:39.32px 10.41px; opacity:0.80; } 99.97% { translate:24.88px 11.50px; opacity:0.45; } 100.00% { translate:24.76px 11.51px; opacity:0.45; } }

/* Equip luck (champion130.js luckWordMarkup): one word in the type label's lettering, coloured by its
   level (tcg_equip_power LUCK_WORDS, worst to best: Cracked, Rough, Fine, Pristine, Flawless, God Roll). Its popover
   (counter-tooltips.js luckTipMarkup) is the site's tooltip with its border in the word's colour. */
.tcg-champion130 .tcg-luck-word { font-family:Arial,sans-serif; font-weight:700; -webkit-text-fill-color:currentColor; background:none; text-transform:uppercase; white-space:nowrap; color:#d4dedb; text-shadow:0 0 1px #000,0 1px 2px #000,0 0 5px #000,0 0 9px #000c; pointer-events:auto; cursor:help; outline:none; }
.tcg-champion130 .tcg-luck-word:focus-visible { text-decoration:underline; text-underline-offset:2px; }
.tcg-champion130 .tcg-luck-word[data-luck="0"], :is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="0"] .tcg-luck-name { color:#bcbcc6; }
.tcg-champion130 .tcg-luck-word[data-luck="1"], :is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="1"] .tcg-luck-name { color:#e2a871; }
.tcg-champion130 .tcg-luck-word[data-luck="2"], :is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="2"] .tcg-luck-name { color:#7fe0a6; }
.tcg-champion130 .tcg-luck-word[data-luck="3"], :is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="3"] .tcg-luck-name { color:#7cc4ff; }
.tcg-champion130 .tcg-luck-word[data-luck="4"], :is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="4"] .tcg-luck-name { color:#ff8fec; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="5"] .tcg-luck-name { color:#f5d27a; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="0"] { border-color:#bcbcc6; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="1"] { border-color:#e2a871; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="2"] { border-color:#7fe0a6; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="3"] { border-color:#7cc4ff; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="4"] { border-color:#ff8fec; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box)[data-luck="5"] { border-color:#e8bf62; }
/* God Roll: the hub TCG mark's gold light sweep (hub-brand.css tcg-mark-sheen) on the letters, plus one foil glint
   (tcg.css tcg-foil-glint) beside them, moving on cards in view (the motion block above). The sheen paints through the
   letters, so their shadow is a drop-shadow filter. */
.tcg-champion130 .tcg-luck-word[data-luck="5"] { padding-right:10px; color:transparent; text-shadow:none; background:linear-gradient(105deg,#c99a45 0%,#e8bf62 32%,#f5e5b8 44%,#fffaf0 50%,#f5e5b8 56%,#e8bf62 68%,#c99a45 100%); background-size:300% 100%; background-position:100% 0; -webkit-background-clip:text; background-clip:text; filter:drop-shadow(0 0 1px #000) drop-shadow(0 1px 1px #000) drop-shadow(0 0 4px #000); }
.tcg-champion130 .tcg-luck-word[data-luck="5"]::after { content:''; position:absolute; right:0; top:1px; width:7px; height:7px; background:#ffedac; box-shadow:0 0 3px #ffca4f; clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%); opacity:.6; }
@keyframes c130-luck-sheen { 0%,62% { background-position:100% 0; } 88%,100% { background-position:0 0; } }
/* The popover: rarity, the range bar with the roll's marker, and on equipment the reroll line. */
.tcg-counter-tooltip.is-luck { width:170px; padding:6px 9px 7px; white-space:normal; }
/* Under an equipped piece's preview card (inspection.js): exactly the card's width, in the site tooltip's look. */
.tcg-equipment-tooltip .tcg-luck-box { display:block; box-sizing:border-box; width:100%; margin-top:6px; padding:6px 8px 7px; background:rgba(0,0,0,.92); border:1px solid #a64b44; border-radius:4px; box-shadow:0 5px 15px #0005; color:#fff; font:12px/1.4 Montserrat,Arial,sans-serif; text-align:left; overflow-wrap:normal; overflow:hidden; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) > span { display:block; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-name { font:700 12px/15px Arial,sans-serif; letter-spacing:1.2px; text-transform:uppercase; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-line { font-weight:600; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-bar { position:relative; height:5px; margin:6px 0 3px; border-radius:3px; background:#ffffff26; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-fill { position:absolute; left:0; top:0; bottom:0; border-radius:3px; background:#ffffff59; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-mark { position:absolute; top:-3px; width:3px; height:11px; margin-left:-1.5px; border-radius:1px; background:#fff; box-shadow:0 0 3px #000; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) > .tcg-luck-ends { display:flex; justify-content:space-between; font-size:11px; color:#c9c3b6; font-variant-numeric:tabular-nums; }
:is(.tcg-counter-tooltip.is-luck,.tcg-luck-box) .tcg-luck-reroll { margin-top:4px; font-size:10px; color:#d8d2c8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }