body { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
input, textarea, [contenteditable]:not([contenteditable="false"]) {
    -webkit-user-select: text; user-select: text; -webkit-touch-callout: default;
}
img, video { -webkit-user-drag: none; }
html body.tag-interactive :is(#pic-before,#pic, #pic-fallback, #vid, #video-container) {
    scale: 1;
    transition: scale .52s cubic-bezier(.16,1,.3,1);
}
html body.tag-interactive.tag-pressed :is(#pic-before,#pic, #pic-fallback, #vid, #video-container) {
    scale: .94;
    transition: scale .22s cubic-bezier(.25,.46,.45,.94);
}
/* Preserve the media loading/arming transitions declared by the tag styles. */
html body.tag-interactive :is(#pic-before,#pic, #pic-fallback, #vid) {
    transition: scale .52s cubic-bezier(.16,1,.3,1), transform .3s ease, opacity .7s ease, filter .85s ease;
}
html body.tag-interactive.tag-pressed :is(#pic-before,#pic, #pic-fallback, #vid) {
    transition: scale .22s cubic-bezier(.25,.46,.45,.94), transform .3s ease, opacity .7s ease, filter .85s ease;
}
@media (prefers-reduced-motion: reduce) {
    html body.tag-interactive :is(#pic-before,#pic, #pic-fallback, #vid, #video-container),
    html body.tag-interactive.tag-pressed :is(#pic-before,#pic, #pic-fallback, #vid, #video-container) { scale: 1; transition: none; }
}

#pic-before{position:absolute;width:90%;left:5%;top:15%;max-height:65%;object-fit:contain;z-index:2;pointer-events:none;opacity:0;filter:blur(10px);transition:opacity .7s ease,filter .85s ease,transform .5s ease}
#bg-before{position:fixed;width:120%;height:120%;left:-10%;top:-10%;object-fit:cover;z-index:0;pointer-events:none;opacity:0;filter:blur(30px) brightness(.6);transition:opacity .7s ease}
#pic-before.visual-ready,#bg-before.visual-ready{opacity:1}#pic-before.visual-ready{filter:blur(0)}
body.tag-double-image:not(.tag-image-after) :is(#pic,#pic-fallback){opacity:0!important}
body.tag-image-after :is(#pic-before,#bg-before){opacity:0!important;filter:blur(10px)}
body.detonator-idle #pic-before.visual-ready{transform:scale(.9);filter:grayscale(1)}
body.detonator-armed #pic-before.visual-ready{transform:scale(1);filter:grayscale(0)}
@media(prefers-reduced-motion:reduce){#pic-before,#bg-before{transition:none}}

/* Cut between double-tag assets, while preserving loading and press animations. */
html body.tag-interactive.tag-instant-swap :is(#pic-before,#pic,#pic-fallback,#vid) {
    transition-property: scale, transform;
}
html body.tag-instant-swap #bg-before { transition: none; }