/* Compact shield cards: all geometry uses the same 280 × 300 artboard. */
html[data-cards=c1] .home .lineup-panel .token.shield-card:not(.empty-slot){
 position:relative;display:block;flex:none;width:min(var(--shield-width,140px),calc(100% / var(--line-count) - 8px));height:auto;aspect-ratio:14/15;min-width:0;max-width:none;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;isolation:isolate;container-type:inline-size;filter:drop-shadow(0 3px 4px #0009);transition:filter .18s ease,translate .18s ease;
}
html[data-cards=c1] .home .lineup-panel .token.shield-card::before,
html[data-cards=c1] .home .lineup-panel .token.shield-card::after{display:none}
.shield-frame{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;filter:grayscale(1)}
/* Neutral metal and a separate light mask keep every accent tied to the live prediction. */
.shield-light{position:absolute;inset:0;display:block;pointer-events:none;background:var(--neon);mask:url(assets/player-shield-light.svg) center/100% 100% no-repeat;-webkit-mask:url(assets/player-shield-light.svg) center/100% 100% no-repeat}
.shield-club{position:absolute;z-index:1;left:27%;top:13%;width:49%;height:44%;opacity:.28;pointer-events:none}
.shield-club .club.crest{position:static;display:block;width:100%;height:100%;padding:0;border:0;background:none;box-shadow:none}
.shield-club .club.crest img{display:block;width:100%;height:100%;object-fit:contain}
.shield-portrait{position:absolute;z-index:2;inset:8% 15.5% 35.3% 15.5%;overflow:hidden;clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);pointer-events:none}
.shield-portrait>img{position:absolute;display:block;left:50%;top:0;bottom:auto;width:auto;height:175%;max-width:none;object-fit:contain;object-position:center top;transform:translateX(-50%);filter:drop-shadow(0 1px 2px #0006)}
.shield-average{position:absolute;z-index:4;left:0;top:21%;width:32.5%;height:30%;display:grid;place-items:center;clip-path:polygon(25% 0,76% 0,100% 49%,76% 100%,25% 100%,0 49%);background:linear-gradient(135deg,#e3edf4 0,#18212b 18%,color-mix(in srgb,var(--neon) 75%,white) 23%,color-mix(in srgb,var(--neon) 40%,#0a1016) 30%,#060c11 55%,color-mix(in srgb,var(--neon) 60%,white) 80%,#07121d 87%)}
.shield-average::before,.shield-average::after{content:"";position:absolute;clip-path:inherit;pointer-events:none}
.shield-average::before{inset:4%;background:#040a10}
.shield-average::after{inset:8%;background:linear-gradient(135deg,#fff 12%,#f4f7fa 50%,#d7e0e8 100%);box-shadow:inset 0 0 8px #0003}
.shield-average>span{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.5cqw;margin-top:-1cqw;color:#050b0f;text-shadow:0 1px #fff8;line-height:1}
.shield-average small{font:600 6cqw/1 Inter,Arial,sans-serif;color:#4f5a62}
.shield-average b{font:800 10.6cqw/.95 Inter,Arial,sans-serif;letter-spacing:-.4cqw;font-variant-numeric:tabular-nums}
.shield-average:is([data-digits="1"],[data-digits="2"]) b{font-size:14cqw}
.shield-average[data-digits="4"] b{font-size:7.6cqw;letter-spacing:-.3cqw}
/* Explicit square dimensions avoid percentage/aspect-ratio stretching in Safari. */
.shield-status{position:absolute;z-index:5;right:8%;top:6.2%;display:grid;place-items:center;box-sizing:border-box;width:18.8cqw;height:18.8cqw;min-width:18.8cqw;min-height:18.8cqw;padding:0;border-radius:50%;background:linear-gradient(140deg,#f1f8fc 1%,#374955 20%,#02080e 48%,#c3d0db 68%,#0a1721 88%);box-shadow:0 0 0 .35cqw #02070c,0 1px 3px #000b}
html[data-cards=c1] .home .lineup-panel .shield-status .outlook-mark{position:static;display:grid;box-sizing:border-box;flex:none;width:15.8cqw;height:15.8cqw;min-width:15.8cqw;min-height:15.8cqw;padding:0;border:.85cqw solid #05121d;border-radius:50%;background:var(--neon);color:#03111a;box-shadow:0 0 0 .45cqw var(--neon),inset 0 1px 0 #ffffff52}
html[data-cards=c1] .home .lineup-panel .shield-status .outlook-mark svg{display:block;width:100%;height:100%;min-width:0;min-height:0}
.shield-opponent{position:absolute;z-index:3;right:10.5%;top:28%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqw;width:18%;height:35%;padding:3% 0;border:.55cqw solid color-mix(in srgb,var(--neon) 35%,#8c9ba9);outline:.55cqw solid #030a12;clip-path:polygon(18% 0,82% 0,100% 8%,100% 92%,82% 100%,18% 100%,0 92%,0 8%);background:linear-gradient(100deg,#16212c,#050a10 65%,color-mix(in srgb,var(--neon) 15%,#111923));transform:none;box-shadow:inset 1px 0 0 color-mix(in srgb,var(--neon) 55%,#172431);color:#f5f8fb}
.shield-opponent .club.crest{position:static;display:block;flex:none;width:88%;height:31%;padding:0;border:0;background:none;box-shadow:none;transform:translateY(-1.5cqw)}
.shield-opponent .club.crest img{display:block;width:100%;height:100%;object-fit:contain}
.shield-opponent b{display:flex;flex-direction:column;align-items:center;gap:1.5cqw;writing-mode:horizontal-tb;transform:none;font:750 6.5cqw/1 Inter,Arial,sans-serif;white-space:nowrap;letter-spacing:0;text-shadow:0 1px 2px #000}
.shield-opponent b small{font:650 5.8cqw/1 Inter,Arial,sans-serif;color:#bdc7d1;transform:translateY(1.5cqw)}
.shield-opponent.is-unscheduled{padding:3% 1%;clip-path:none}
.shield-opponent.is-unscheduled b{font-size:5cqw;white-space:normal;text-align:center;overflow-wrap:anywhere;line-height:1.2}
html[data-cards=c1] .home .lineup-panel .shield-card .shield-name{position:absolute;z-index:4;left:22%;top:67.8%;width:57%;height:10.7%;display:flex;justify-content:center;align-items:center;padding:0;margin:0;overflow:hidden;white-space:nowrap;text-overflow:clip;background:none;color:#fff;font:760 10.8cqw/1 Inter,Arial,sans-serif;letter-spacing:-.025em;text-shadow:0 1px 2px #000}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form]{position:absolute;z-index:4;left:25%;top:81.7%;width:49.8%;height:3.65%;display:flex;flex-direction:row;gap:1.3cqw;padding:0;margin:0;border:0;background:none;clip-path:none;transform:none}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form] i{display:block;flex:1;min-width:0;width:auto;height:100%;border-radius:1cqw;border:.3cqw solid #0003;box-shadow:inset 0 .4cqw .5cqw #ffffff50;transform:none}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form] i.start{background:linear-gradient(#48f7bd,#04c889);box-shadow:inset 0 .4cqw .5cqw #baffdf8c,0 0 2cqw #00e29b4d}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form] i.sub{background:linear-gradient(#ffe780,#ecc543);box-shadow:inset 0 .4cqw .5cqw #fff2c27a,0 0 2cqw #ebce3e40}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form] i.miss{background:linear-gradient(#ff7b7e,#ef414f);box-shadow:inset 0 .4cqw .5cqw #ffc4c450,0 0 2cqw #f14a5540}
html[data-cards=c1][data-label] .home .lineup-panel .token.shield-card .start-meter[data-tone=form] i.na{background:linear-gradient(#253240,#111b27);border-color:#66809955;box-shadow:inset 0 1px 1px #ffffff0d}
html[data-cards=c1] .home .lineup-panel .shield-card>.availability-icon{position:absolute;z-index:5;left:15%;right:auto;top:55%;bottom:auto;width:11%;height:auto;aspect-ratio:1;padding:1%;border:1px solid #75899b;border-radius:50%;background:#09111b;filter:drop-shadow(0 1px 2px #000)}
html[data-cards=c1] .home .lineup-panel .token.shield-card:hover{translate:0 -2px;filter:drop-shadow(0 4px 7px #000b) drop-shadow(0 0 3px var(--neon-glow))}
html[data-cards=c1] .home .lineup-panel .token.shield-card:focus-visible{outline:2px solid #d8edff;outline-offset:3px;filter:drop-shadow(0 0 4px var(--neon))}
html[data-cards=c1] .home .lineup-panel .token.shield-card.drop-ok{filter:drop-shadow(0 0 3px #c8f25a)}
html[data-cards=c1] .home .lineup-panel .token.shield-card.drop-hover{outline:2px solid #c8f25a;outline-offset:3px;filter:drop-shadow(0 0 7px #c8f25a)}
html[data-cards=c1] .home .lineup-panel .token.shield-card.drag-source{opacity:.3}
html[data-cards=c1] .home .lineup-panel .token.shield-card.drop-no{opacity:.35}
@media(min-width:901px){
 html[data-cards=c1] .home .lineup-panel .formation-row[data-line]{--shield-step:calc((100cqh - 174px) / 4);--shield-width:calc(min(178px,var(--shield-step) - 12px) * .933333);bottom:calc(82px + var(--row-i) * var(--shield-step));}
 html[data-cards=c1] .home .lineup-panel .formation-row[data-line=TW]{--row-i:0}
 html[data-cards=c1] .home .lineup-panel .formation-row[data-line=ABW]{--row-i:1}
 html[data-cards=c1] .home .lineup-panel .formation-row[data-line=MF]{--row-i:2}
 html[data-cards=c1] .home .lineup-panel .formation-row[data-line=ST]{--row-i:3}
}
@media(max-width:900px){
 html[data-cards=c1] .home .lineup-panel .formation-row{--shield-width:126px;align-items:center}
}
@media(max-width:680px){
 html[data-cards=c1] .home .lineup-panel .formation-row{--shield-width:108px}
 html[data-cards=c1] .home .lineup-panel .formation-row[data-count="4"] .shield-card{width:calc(100% / 4 - 2px)}
 html[data-cards=c1] .home .lineup-panel .formation-row:is([data-count="5"],[data-count="6"]) .shield-card{width:calc((100% - 16px) / 3);max-width:108px}
}
@media(prefers-reduced-motion:reduce){
 html[data-cards=c1] .home .lineup-panel .token.shield-card{transition:none}
 html[data-cards=c1] .home .lineup-panel .token.shield-card:hover{translate:none}
}
/* Long surnames step down so they fit the plate (see nameFit in terminal.js). */
html[data-cards=c1] .home .lineup-panel .shield-card .shield-name[style*="--name-fit"]{font-size:var(--name-fit);letter-spacing:-.03em}