/* Background-only translucency: clothing remains visible while all labels/cards stay crisp. */
body[data-v142-field-skin="zaraku-blood-banquet"] .field-area.player-area {
    --v150-zone-panel-alpha: 46%; --v150-zone-tail-alpha: 22%;
    --v150-accent: #e24e60; --v150-secondary: #ffd08a; --v150-deep: #190609;
}
body[data-v142-field-skin="riana-amethyst-vow"] .field-area.player-area {
    --v150-zone-panel-alpha: 42%; --v150-zone-tail-alpha: 20%;
    --v150-accent: #bd82f0; --v150-secondary: #fff3ff; --v150-deep: #170d25;
}
body[data-v142-field-skin="larasa-halloween"] .field-area.player-area {
    --v150-zone-panel-alpha: 40%; --v150-zone-tail-alpha: 18%;
    --v150-accent: #a66bea; --v150-secondary: #ff9a45; --v150-deep: #140b22;
}
body[data-v142-field-skin="mirano-midnight-service"] .field-area.player-area {
    --v150-zone-panel-alpha: 44%; --v150-zone-tail-alpha: 20%;
    --v150-accent: #67dda0; --v150-secondary: #f4df9c; --v150-deep: #061a16;
}
body[data-v142-field-skin="zaraku-blood-banquet"] { --v150-accent:#e24e60; --v150-secondary:#ffd08a; --v150-deep:#190609; }
body[data-v142-field-skin="riana-amethyst-vow"] { --v150-accent:#bd82f0; --v150-secondary:#fff3ff; --v150-deep:#170d25; }
body[data-v142-field-skin="larasa-halloween"] { --v150-accent:#a66bea; --v150-secondary:#ff9a45; --v150-deep:#140b22; }
body[data-v142-field-skin="mirano-midnight-service"] { --v150-accent:#67dda0; --v150-secondary:#f4df9c; --v150-deep:#061a16; }

body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box {
    opacity: 1 !important;
    background: linear-gradient(105deg,
        color-mix(in srgb, var(--v143-deep) var(--v150-zone-panel-alpha), transparent),
        color-mix(in srgb, #050607 var(--v150-zone-tail-alpha), transparent) 72%) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.07), inset 0 -8px 16px rgba(0,0,0,.16), 0 0 10px var(--v143-zone-glow) !important;
}
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box:first-child {
    background: linear-gradient(100deg,
        color-mix(in srgb, var(--v143-grave) 11%, transparent),
        color-mix(in srgb, var(--v143-deep) var(--v150-zone-panel-alpha), transparent) 38%,
        color-mix(in srgb, #050607 var(--v150-zone-tail-alpha), transparent) 76%) !important;
}
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box:last-child {
    background: linear-gradient(260deg,
        color-mix(in srgb, var(--v143-slash) 10%, transparent),
        color-mix(in srgb, var(--v143-deep) var(--v150-zone-panel-alpha), transparent) 38%,
        color-mix(in srgb, #050607 var(--v150-zone-tail-alpha), transparent) 76%) !important;
}
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box > .disposal-title,
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box > .graveyard-zone,
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box > .slash-zone,
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area #player-grave-count,
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area #player-slash-count { opacity:1 !important; }
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box > .disposal-title {
    padding-right: 4px !important;
    background: linear-gradient(90deg, color-mix(in srgb,#030405 48%,transparent), color-mix(in srgb,var(--v143-zone-edge) 10%,transparent), transparent 82%) !important;
}
body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
.field-area.player-area > .disposal-container > .disposal-box > .disposal-title::after { display:none !important; content:none !important; }

/* Remove flat glyphs, CSS diamonds/circles and generic suit particles on rare skins. */
#home-screen.v62-shocker-home .v142-home-vault .home-menu-icon,
.v142-skin-perk::before,
.v142-character-mark { display:none !important; content:none !important; }
body[data-v150-rare-vfx="true"] #v142-table-props { display:none !important; }
body[data-v150-rare-vfx="true"] #v142-rare-clash-fx[data-v150-visible="true"] .v142-clash-aura,
body[data-v150-rare-vfx="true"] #v142-rare-clash-fx[data-v150-visible="true"] .v142-clash-sigil,
body[data-v150-rare-vfx="true"] #v142-rare-clash-fx[data-v150-visible="true"] .v142-clash-particle { display:none !important; animation:none !important; }
body[data-v150-rare-vfx="true"] #v142-rare-clash-fx[data-v150-visible="true"] .v142-clash-badge { z-index:7; }
/* Generated rare-card compositions replace the old generic ring/slash/VS stack. */
#v61-character-clash[data-v150-visible-clash="true"]::before { content:none !important; display:none !important; animation:none !important; }
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-backlight,
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-speedlines,
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-flash,
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-ring,
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-slash,
#v61-character-clash[data-v150-visible-clash="true"] .v61-clash-core,
#v61-character-clash[data-v150-visible-clash="true"] .v61-impact-spark { display:none !important; animation:none !important; }
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-special.v150-trigger-only::before,
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-special.v150-trigger-only::after { content:none !important; display:none !important; animation:none !important; }
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-special.v150-trigger-only .v67-special-glyph,
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-special.v150-trigger-only .v67-special-ring,
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-special.v150-trigger-only .v67-special-particle { display:none !important; animation:none !important; }
body[data-v150-rare-vfx="true"] #v67-fx-layer .v67-impact-core.v150-trigger-only {
    opacity:0 !important; visibility:hidden !important; background:none !important; box-shadow:none !important;
    filter:none !important; mix-blend-mode:normal !important;
}
/* A player-owned landing core stays alive only long enough to emit animationstart. */
body[data-v150-rare-vfx="true"] #v68-motion-layer .v68-land-core.v150-trigger-only,
body[data-v150-rare-vfx="true"] #v68-motion-layer .v68-deck-vortex.v150-trigger-only {
    opacity:0 !important; visibility:hidden !important; background:none !important; box-shadow:none !important;
    filter:none !important; mix-blend-mode:normal !important; animation:none !important;
}
body[data-v150-rare-vfx="true"] #v68-turn-arrival.v150-trigger-only .v68-turn-crest,
body[data-v150-rare-vfx="true"] #v68-turn-arrival.v150-trigger-only .v68-turn-particle,
body[data-v150-rare-vfx="true"] #v68-turn-arrival.v150-trigger-only .v68-turn-slash { display:none !important; animation:none !important; }
body[data-v150-rare-vfx="true"] #v68-turn-arrival.v150-trigger-only::before,
body[data-v150-rare-vfx="true"] #v68-turn-arrival.v150-trigger-only::after { content:none !important; display:none !important; }
body[data-v150-rare-vfx="true"] .v150-legacy-muted { display:none !important; animation:none !important; }

/* Keep the existing turn typography, but hand its palette to the selected premium art. */
body.v45-battle-active[data-v150-rare-vfx="true"] #v68-turn-arrival { --turn-color:var(--v150-accent); }
body.v45-battle-active[data-v150-rare-vfx="true"] #v68-turn-arrival .v68-turn-panel {
    border-block-color:color-mix(in srgb,var(--v150-secondary) 66%,#fff);
    box-shadow:0 0 26px color-mix(in srgb,var(--turn-color) 18%,transparent),inset 0 1px rgba(255,255,255,.12);
}
body.v45-battle-active[data-v150-rare-vfx="true"] #v68-turn-arrival .v68-turn-kicker { color:color-mix(in srgb,var(--turn-color) 48%,#fff); text-shadow:0 0 6px color-mix(in srgb,var(--turn-color) 54%,transparent); }
body.v45-battle-active[data-v150-rare-vfx="true"] #v68-turn-arrival .v68-turn-main { text-shadow:0 3px 0 #000,0 0 8px rgba(255,255,255,.7),0 0 18px color-mix(in srgb,var(--turn-color) 58%,transparent); }
body.v45-battle-active[data-v150-rare-vfx="true"] #v68-turn-arrival .v68-turn-sub { color:var(--v150-secondary); }

/* The existing rare field art and physical props remain the only persistent decor.
   Generated art is intentionally event-only so it never becomes a second backdrop. */

/* Small, flat effect cels stay secondary to the character art. No filter or glow.
   Six generated drawings per theme. The inner image changes frames discretely;
   only the outer track controls its position. Nothing is a static-art zoom. */
.v150-clash-signature {
    --v150-clash-peak:.80;
    position:absolute; z-index:15; inset:0; overflow:hidden; pointer-events:none; user-select:none;
    display:block !important; visibility:visible !important; opacity:1 !important;
}
.v150-clash-art,.v150-battle-art {
    position:absolute; inset:0; pointer-events:none; user-select:none;
}
.v150-motion-track {
    position:absolute; opacity:0; pointer-events:none;
    width:var(--v150-sprite-size,96px); aspect-ratio:1; translate:-50% -50%;
    will-change:transform,opacity;
}
.v150-sprite {
    position:absolute; inset:0; display:block; overflow:hidden; contain:paint; isolation:isolate;
}
.v150-atlas-image {
    position:absolute !important; display:block !important; left:0 !important; top:0 !important;
    width:300% !important; height:200% !important; max-width:none !important; max-height:none !important;
    margin:0 !important; padding:0 !important; border:0 !important; opacity:1 !important;
    object-fit:fill; transform:translate3d(0,0,0); transform-origin:0 0;
    pointer-events:none; user-select:none; will-change:transform;
}
.is-ready > .v150-clash-art .v150-atlas-image,
.is-ready > .v150-battle-art .v150-atlas-image {
    animation:v150-sheet-cycle .6s steps(1,end) var(--v150-frame-offset,0s) infinite;
}
@keyframes v150-sheet-cycle {
    0%       { transform:translate3d(0,0,0); }
    16.6667% { transform:translate3d(-33.333333%,0,0); }
    33.3333% { transform:translate3d(-66.666667%,0,0); }
    50%      { transform:translate3d(0,-50%,0); }
    66.6667% { transform:translate3d(-33.333333%,-50%,0); }
    83.3333%,100% { transform:translate3d(-66.666667%,-50%,0); }
}
/* Player-side outer margins only: faces, central VS and opponent stay uncovered. */
.v150-clash-art .v150-motion-track { --v150-sprite-size:clamp(72px,9vw,128px); }
.v150-clash-art .v150-track-0 { left:9%; top:31%; --v150-travel-x:50px; --v150-travel-y:-18px; }
.v150-clash-art .v150-track-1 { left:12%; top:78%; --v150-sprite-size:clamp(64px,8vw,112px); --v150-travel-x:38px; --v150-travel-y:-26px; --v150-frame-offset:-.2s; --v150-start-delay:calc(var(--v150-clash-delay,.42s) + var(--v150-clash-stagger,.2s)); }
.v150-clash-signature.is-ready .v150-motion-track {
    animation:v150-clash-flight var(--v150-clash-life,1.6s) var(--v150-start-delay,var(--v150-clash-delay,.42s)) ease-in-out both;
}
.v150-clash-signature[data-skin-id="riana-amethyst-vow"] { --v150-clash-peak:.78; }
.v150-clash-signature[data-skin-id="zaraku-blood-banquet"] .v150-motion-track,
.v150-clash-signature[data-skin-id="riana-amethyst-vow"] .v150-motion-track { --v150-travel-x:12px; --v150-travel-y:-28px; }
.v150-clash-signature[data-skin-id="mirano-midnight-service"] .v150-motion-track { --v150-travel-x:10px; --v150-travel-y:-24px; }
@keyframes v150-clash-flight {
    0% { opacity:0; transform:translate3d(calc(var(--v150-travel-x) * -.4),calc(var(--v150-travel-y) * -.4),0); }
    15%,67% { opacity:var(--v150-clash-peak); }
    100% { opacity:0; transform:translate3d(var(--v150-travel-x),var(--v150-travel-y),0); }
}
/* The event is a direct child of the player field, above card stacks (z3/4).
   Persistent field decoration remains at z2. All effect pixels pass pointer input. */
.v150-battle-event {
    --v150-battle-peak:.90;
    position:absolute; z-index:5; inset:0; overflow:hidden; pointer-events:none; user-select:none;
    display:block !important; visibility:visible !important; opacity:0;
}
.v150-battle-event.is-ready { animation:v150-event-life var(--v150-event-life,.9s) linear both; }
.v150-battle-art .v150-motion-track {
    left:var(--v150-origin-x); top:var(--v150-origin-y);
    --v150-sprite-size:clamp(68px,10%,104px); --v150-travel-x:18px; --v150-travel-y:-18px;
}
.v150-battle-event[data-kind="land"] { --v150-battle-peak:.86; }
.v150-battle-event[data-kind="land"] .v150-motion-track { --v150-sprite-size:clamp(68px,10%,104px); }
.v150-battle-event[data-kind="special"] .v150-motion-track,
.v150-battle-event[data-kind="turn"] .v150-motion-track { --v150-sprite-size:clamp(84px,13%,124px); }
.v150-battle-event.is-ready .v150-motion-track {
    animation:v150-battle-flight var(--v150-event-life,.9s) ease-in-out both;
}
@keyframes v150-event-life { 0%,100%{opacity:0} 8%,80%{opacity:1} }
@keyframes v150-battle-flight {
    0% { opacity:0; transform:translate3d(calc(var(--v150-travel-x) * -.4),12px,0); }
    15%,70% { opacity:var(--v150-battle-peak); }
    100% { opacity:0; transform:translate3d(var(--v150-travel-x),var(--v150-travel-y),0); }
}
@keyframes v150-reduced-clash { 0%,100%{opacity:0;transform:none} 22%,76%{opacity:var(--v150-clash-peak);transform:none} }
@keyframes v150-reduced-battle { 0%,100%{opacity:0;transform:none} 18%,72%{opacity:var(--v150-battle-peak);transform:none} }
@media (max-width:820px) {
    body[data-v142-field-skin="zaraku-blood-banquet"] .field-area.player-area { --v150-zone-panel-alpha:40%; --v150-zone-tail-alpha:18%; }
    body[data-v142-field-skin="riana-amethyst-vow"] .field-area.player-area { --v150-zone-panel-alpha:37%; --v150-zone-tail-alpha:17%; }
    body[data-v142-field-skin="larasa-halloween"] .field-area.player-area { --v150-zone-panel-alpha:35%; --v150-zone-tail-alpha:16%; }
    body[data-v142-field-skin="mirano-midnight-service"] .field-area.player-area { --v150-zone-panel-alpha:38%; --v150-zone-tail-alpha:17%; }
    .v150-clash-art .v150-motion-track { --v150-sprite-size:clamp(58px,14vw,94px); --v150-travel-x:24px; }
    .v150-clash-art .v150-track-1 { --v150-sprite-size:clamp(54px,13vw,86px); }
    .v150-battle-art .v150-motion-track,
    .v150-battle-event[data-kind="land"] .v150-motion-track { --v150-sprite-size:clamp(62px,15%,84px); }
    .v150-battle-event[data-kind="special"] .v150-motion-track,
    .v150-battle-event[data-kind="turn"] .v150-motion-track { --v150-sprite-size:clamp(72px,18%,100px); }
}
@media (prefers-reduced-motion:reduce) {
    .is-ready > .v150-clash-art .v150-atlas-image,
    .is-ready > .v150-battle-art .v150-atlas-image { animation:none !important; transform:translate3d(-33.333333%,0,0) !important; will-change:auto; }
    .v150-clash-signature.is-ready .v150-motion-track { animation:v150-reduced-clash var(--v150-clash-life,1.6s) var(--v150-start-delay,var(--v150-clash-delay,.42s)) ease both !important; }
    .v150-battle-event.is-ready .v150-motion-track { animation:v150-reduced-battle var(--v150-event-life,.9s) ease both !important; }
}
@media (forced-colors:active) {
    .v150-clash-signature,.v150-battle-event { display:none !important; }
    body.v45-battle-active.v64-shocker-battle[data-v142-field-skin]
    .field-area.player-area > .disposal-container > .disposal-box { background:Canvas !important; }
}
