/* Colourful cabinet trim, deliberately outside the playable geometry. */
.arcade-web body[data-arcade]{background:radial-gradient(ellipse at 5% 15%,color-mix(in srgb,var(--arcade-accent) 22%,transparent),transparent 48%),radial-gradient(ellipse at 95% 85%,color-mix(in srgb,var(--arcade-violet) 18%,transparent),transparent 55%),var(--arcade-night)}
.arcade-web .arcade-toolbar{background:linear-gradient(110deg,color-mix(in srgb,var(--arcade-accent) 13%,var(--arcade-night)),var(--arcade-night) 60%);box-shadow:0 3px 24px color-mix(in srgb,var(--arcade-accent) 10%,transparent)}
.arcade-web .arcade-toolbar::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--arcade-accent),var(--arcade-violet),transparent);pointer-events:none}
.arcade-web .arcade-identity strong{font-weight:900;letter-spacing:.015em;text-shadow:0 2px var(--arcade-night),0 0 20px color-mix(in srgb,var(--arcade-accent) 30%,transparent)}
.arcade-web .arcade-identity small{font-family:ui-monospace,monospace;letter-spacing:.12em;color:var(--color-text-secondary);opacity:.7}
.arcade-web .arcade-identity img{border:1px solid color-mix(in srgb,var(--arcade-accent) 60%,transparent);box-shadow:0 3px 0 var(--arcade-night),0 0 22px color-mix(in srgb,var(--arcade-accent) 25%,transparent)}
.arcade-web .arcade-toolbar :is(a,button){transition:border-color .16s,box-shadow .16s,background .16s}
.arcade-web .arcade-toolbar :is(a,button):hover{background:color-mix(in srgb,var(--arcade-accent) 12%,var(--arcade-panel));box-shadow:0 0 16px color-mix(in srgb,var(--arcade-accent) 18%,transparent)}
.arcade-web #hud :is(span,.stat){background:linear-gradient(160deg,color-mix(in srgb,var(--arcade-accent) 10%,var(--arcade-panel)),var(--arcade-panel));border-bottom:2px solid color-mix(in srgb,var(--arcade-accent) 45%,var(--arcade-panel));border-radius:6px;font-family:ui-monospace,monospace;font-weight:700}
.arcade-web #hud b{color:var(--color-text-primary);text-shadow:0 0 10px color-mix(in srgb,var(--arcade-accent) 50%,transparent)}
.arcade-web body[data-arcade] canvas#game,.arcade-web body[data-arcade=shmup]>#game-container,.arcade-web body[data-arcade=krazlings]>#game-area{border-color:color-mix(in srgb,var(--arcade-accent) 65%,var(--arcade-night));box-shadow:0 0 0 3px var(--arcade-night),0 0 0 4px color-mix(in srgb,var(--arcade-accent) 25%,transparent),0 18px 50px color-mix(in srgb,var(--arcade-night) 90%,transparent),0 0 38px color-mix(in srgb,var(--arcade-accent) 14%,transparent)}
.arcade-web body[data-arcade=krazpeep] canvas#game,.arcade-web body[data-arcade=krazlings] canvas#game{box-shadow:none}
.arcade-web body[data-arcade]>:is(.bar,.controls) button,.arcade-web #action-bar button,.arcade-web button.mode{background:linear-gradient(180deg,color-mix(in srgb,var(--arcade-accent) 15%,var(--arcade-panel)),var(--arcade-panel));color:var(--color-text-primary);border-color:color-mix(in srgb,var(--arcade-accent) 38%,var(--arcade-panel));border-bottom-width:3px;box-shadow:inset 0 1px color-mix(in srgb,var(--color-text-primary) 12%,transparent);font-weight:800}
.arcade-web body[data-arcade]>:is(.bar,.controls) #startBtn{background:linear-gradient(160deg,var(--arcade-accent),color-mix(in srgb,var(--arcade-accent) 72%,var(--arcade-night)));color:var(--arcade-night);border-color:var(--arcade-accent);text-shadow:none}
.arcade-web #skill-bar button.active{background:color-mix(in srgb,var(--arcade-violet) 35%,var(--arcade-panel));border-color:var(--arcade-violet)}
.arcade-web #next-panel{box-shadow:inset 0 1px color-mix(in srgb,var(--arcade-violet) 25%,transparent),0 5px 20px color-mix(in srgb,var(--arcade-night) 50%,transparent)}
.arcade-web .arcade-score-pop{animation:arcade-score-pop .34s ease-out}
@keyframes arcade-score-pop{0%{filter:brightness(1.5)}35%{transform:translateY(-2px)}100%{transform:translateY(0);filter:brightness(1)}}
/* Web-only Polarity presentation. No shared Android/Switch renderer changes. */
.arcade-web body[data-arcade=shmup] .screen-content h1{font-weight:1000;letter-spacing:.04em;text-shadow:none;filter:drop-shadow(0 3px var(--arcade-night))}
.arcade-web body[data-arcade=shmup] .screen-content button{border-radius:8px;border-width:1px;border-bottom-width:3px;box-shadow:inset 0 1px color-mix(in srgb,var(--color-text-primary) 18%,transparent),0 6px 22px color-mix(in srgb,var(--arcade-night) 60%,transparent)}
.arcade-web body[data-arcade=shmup] .hud-top>div{background:color-mix(in srgb,var(--arcade-night) 78%,transparent);border:1px solid color-mix(in srgb,var(--color-info-blue) 35%,transparent);border-radius:6px;padding:6px 8px}
.arcade-web body[data-arcade=shmup] #game-container::after{content:"";pointer-events:none;position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 32px color-mix(in srgb,var(--color-info-blue) 7%,transparent);z-index:5}
@media(prefers-reduced-motion:reduce){.arcade-web .arcade-score-pop{animation:none;outline:1px solid var(--arcade-accent)}}
