/* Decorative layers never change the structural grid. */
.card{color:#f6f6f6;background:#f5f5f3;--frame-radius:22px;--frame-scratches-size:760px;--frame-tread-size:64px;--frame-grunge-size:1000px;--frame-chips-size:700px}
.card::before{content:'';position:absolute;inset:0;pointer-events:none;background:url('textures/soft-grain-reference.png') center/112% 112% no-repeat;mix-blend-mode:multiply}
/* One continuous Battle Plate material, shared by every theme. */
.frame{border-radius:var(--frame-radius);background:url('textures/scratches.webp') 0 0/var(--frame-scratches-size),url('textures/tread.svg') 0 0/var(--frame-tread-size) var(--frame-tread-size),url('textures/grunge.webp') 0 0/var(--frame-grunge-size),linear-gradient(165deg,var(--c1-light) -15%,var(--c1) 30%,color-mix(in oklch,var(--c1) 70%,#000) 105%);background-blend-mode:screen,soft-light,soft-light,normal;box-shadow:inset 0 4px 0 rgb(255 255 255 / .35),inset 0 -6px 0 rgb(0 0 0 / .35),inset 0 0 0 3px rgb(0 0 0 / .5)}
/* Edge wear stays beneath content and uses a union of horizontal/vertical masks. */
.frame::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;background:url('textures/chips.webp') 0 0/var(--frame-chips-size);mix-blend-mode:multiply;mask-image:linear-gradient(90deg,#000,transparent 9%,transparent 91%,#000),linear-gradient(#000,transparent 6%,transparent 94%,#000);mask-composite:add}
.interior{background:transparent;z-index:1}

/* V2 header decoration; all effects stay outside structural measurement. */
.card{--c1:var(--theme-color);--c1-light:color-mix(in oklch,var(--c1) 45%,#fff);--c1-deep:color-mix(in oklch,var(--c1) 58%,#000)}
.header::before{content:'';position:absolute;inset:0 0 var(--header-gap);border-radius:12px;z-index:-1;background:linear-gradient(rgb(8 10 12 / .9),rgb(8 10 12 / .9)),url('textures/scratches.webp') 0 0/600px,linear-gradient(#171a1d,#0d0f11);background-blend-mode:normal,screen,normal;box-shadow:inset 0 5px 10px #000d,inset 0 -2px 0 #ffffff0f,0 3px 0 #ffffff4d,0 -2px 0 #0006}
.type{color:#c9cdd3}.type::before,.type::after{background:color-mix(in oklch,var(--c1) 85%,transparent)}
.hp{border-radius:16px;border:4px solid var(--c1);background:radial-gradient(100% 65% at 50% 110%,color-mix(in oklch,var(--c1) 55%,transparent),transparent 75%),#0b0d10;box-shadow:0 0 16px color-mix(in oklch,var(--c1) 30%,transparent)}
.hp-label{color:color-mix(in oklch,var(--c1) 22%,#e9e9e9)}.hp-value{color:var(--c1-light)}
.hp[data-style=filled]{background:linear-gradient(170deg,color-mix(in oklch,var(--c1) 45%,#fff),var(--c1) 45%,color-mix(in oklch,var(--c1) 80%,#000));border-color:color-mix(in oklch,var(--c1) 55%,#fff);box-shadow:inset 0 3px 0 #ffffff80,inset 0 -5px 0 #0000002e}.hp[data-style=filled] .hp-label,.hp[data-style=filled] .hp-value{color:#121212}
/* Step 2: shared recessed panels. Insets paint inside unchanged grid rows. */
.attack::before,.footer::before{content:'';position:absolute;inset:var(--section-inset) 0;border-radius:14px;z-index:-1;pointer-events:none;background:linear-gradient(rgb(12 14 16 / .8),rgb(12 14 16 / .8)),url('textures/scratches.webp') 0 0/600px,linear-gradient(#171a1d,#0d0f11);background-blend-mode:normal,screen,normal;box-shadow:inset 0 8px 14px #000d,inset 0 -2px 0 #ffffff12,0 3px 0 #ffffff4d,0 -2px 0 #0006}
.footer::before{inset:var(--section-inset) 0 0}.footer{color:#b9c0c7}
.art{box-shadow:0 3px 0 #ffffff4d,0 -2px 0 #0006}.art::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 10px 18px #000a,inset 0 0 0 4px #0009}
.star{fill:rgb(255 255 255 / .05);stroke:var(--c1);stroke-width:2.5}.star.filled{fill:var(--c1);stroke:var(--c1-light)}
.attack-name{color:var(--c1-light);text-shadow:0 3px 0 #000;letter-spacing:.02em}.damage{color:#fff;text-shadow:0 3px 0 #000}.description{color:#e7eaed}
.tagline{background:transparent;color:color-mix(in oklch,var(--c1) 18%,#000)}.tagline-text{text-shadow:0 2px 0 #ffffff73,0 -1px 0 #0008}.tagline-rule{border-block:4px solid #0009;filter:drop-shadow(0 2px 0 #ffffff59)}


/* Pain Bot: light, matte workshop steel; distinct from dark Evolution metal. */
.card[data-card="pain-bot"] .frame{background:url('textures/scratches.webp') 0 0/760px,repeating-linear-gradient(0deg,#ffffff12 0 1px,transparent 1px 5px),linear-gradient(110deg,#c8cdd0,#b2b9bd 55%,#c3c9cc);background-blend-mode:soft-light,normal,normal;box-shadow:inset 0 4px 0 #ffffff70,inset 0 -5px 0 #697176,inset 0 0 0 3px #555d61}
.card[data-card="pain-bot"] .hp{box-shadow:none;border-color:#f0443d}
.card[data-card="pain-bot"] .tagline{color:#202529}
.card[data-card="pain-bot"] .tagline-rule{border-color:#9c2929}

/* Skulleton: warm weathered bone on the Standard card frame. */
.card[data-card="skulleton"] .frame{background:url('textures/scratches.webp') 0 0/760px,url('textures/grunge.webp') 0 0/1000px,linear-gradient(155deg,#f0e1c0,#d4bd91 55%,#bc9d70);background-blend-mode:soft-light,soft-light,normal}
.card[data-card="skulleton"] .tagline{color:#362419}