/* OVERKILL · Tatort: Tropf-Schrift, Absperrband, Spritzer, Asservaten */
html[data-theme] body { --type: 'Special Elite', 'Courier New', monospace; }
html[data-theme] .fxt { background: none; -webkit-text-fill-color: currentColor; color: #d81f28; text-shadow: 0 3px 0 #3a0306, 0 0 40px rgba(214, 32, 38, 0.45); }
html[data-theme] .ph-t { font-size: clamp(60px, 15cqi, 170px); line-height: 0.95; letter-spacing: 0.01em; }
html[data-theme] .ph-s { font-family: var(--type); letter-spacing: 0.3em; color: #f4e7c8; text-transform: uppercase; margin-top: 0.95em; }   /* Platz fuer die Blut-Tropfen der Titelschrift */
html[data-theme] .kick, html[data-theme] .ph-meta li { font-family: var(--type); letter-spacing: 0.2em; }
html[data-theme] .kick { color: #ffd600; }
html[data-theme] .kick::before { background: repeating-linear-gradient(-45deg, #ffd600 0 4px, #111 4px 8px); height: 6px; width: 36px; box-shadow: none; }
html[data-theme] .ph-l, html[data-theme] .pt-text { font-family: var(--type); color: #d9cdb4; }
html[data-theme] .ph-fx { background: linear-gradient(90deg, rgba(9, 5, 5, 0.95) 0%, rgba(9, 5, 5, 0.6) 50%, rgba(40, 0, 0, 0.3) 100%), radial-gradient(60% 80% at 80% 60%, rgba(214, 32, 38, 0.22), transparent 70%); }
.fx-tape { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; -webkit-mask: linear-gradient(90deg, transparent 0 34%, #000 58%); mask: linear-gradient(90deg, transparent 0 34%, #000 58%); }
.fx-tape .t { position: absolute; left: -10%; right: -10%; display: flex; gap: 0; padding: 10px 0; background: #ffd600; color: #111; font: 400 18px/1 var(--type); letter-spacing: 0.3em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5); }
.fx-tape .t span { padding: 0 30px; }
.fx-tape .t span::after { content: "▲"; margin-left: 30px; }
.fx-tape .t1 { top: 74%; transform: rotate(-8deg); animation: tape1 40s linear infinite; }
.fx-tape .t2 { top: 20%; transform: rotate(6deg); opacity: 0.85; animation: tape2 50s linear infinite; }
@keyframes tape1 { to { transform: rotate(-8deg) translateX(-30%); } }
@keyframes tape2 { from { transform: rotate(6deg) translateX(-30%); } to { transform: rotate(6deg) translateX(0); } }
.fx-tape .sp { position: absolute; border-radius: 50%; background: radial-gradient(circle at 40% 40%, #b0101a, #5a0006 60%, transparent 62%); transform: scale(0); animation: splat 0.5s cubic-bezier(0.2, 1.6, 0.4, 1) forwards; }
.fx-tape .sp::before, .fx-tape .sp::after { content: ""; position: absolute; border-radius: 50%; background: #8a0812; }
.fx-tape .sp::before { width: 22%; height: 22%; left: -18%; top: 30%; } .fx-tape .sp::after { width: 14%; height: 14%; right: -14%; top: 64%; }
.fx-tape .s0 { left: 66%; top: 18%; width: 90px; height: 80px; animation-delay: 0.9s; } .fx-tape .s1 { left: 84%; top: 58%; width: 54px; height: 50px; animation-delay: 1.1s; }
.fx-tape .s2 { left: 58%; top: 72%; width: 34px; height: 30px; animation-delay: 1.25s; } .fx-tape .s3 { left: 92%; top: 22%; width: 26px; height: 24px; animation-delay: 1.35s; }
.fx-tape .s4 { left: 74%; top: 86%; width: 60px; height: 40px; animation-delay: 1.5s; } .fx-tape .s5 { left: 50%; top: 10%; width: 20px; height: 20px; animation-delay: 1.6s; } .fx-tape .s6 { left: 96%; top: 76%; width: 40px; height: 36px; animation-delay: 1.7s; }
@keyframes splat { to { transform: scale(1); } }
html[data-theme] .ph-cover .glow { background: radial-gradient(closest-side, rgba(214, 32, 38, 0.6), rgba(110, 10, 14, 0.25) 55%, transparent); }
html[data-theme] .btn--acc { background: #d81f28; color: #fff; border-radius: 2px; font-family: var(--type); letter-spacing: 0.2em; box-shadow: 0 0 0 1px #ff5a60, 0 12px 40px -10px rgba(214, 32, 38, 0.8); }
html[data-theme] .btn--ghost { border-radius: 2px; color: #ffd600; border-color: rgba(255, 214, 0, 0.5); background: rgba(255, 214, 0, 0.04); }
html[data-theme] .ph-meta li + li::before, html[data-theme] .pb .gem { width: 10px; height: 12px; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%; transform: none; background: #b0101a; box-shadow: none; }
html[data-theme] .pb .marq-row span { color: #d81f28; }
html[data-theme] .pt-card { border-radius: 2px; border-color: rgba(255, 214, 0, 0.25); background: linear-gradient(160deg, rgba(214, 32, 38, 0.1), transparent 50%), rgba(14, 8, 8, 0.92); }
html[data-theme] .pt-card .br { border-color: #ffd600; }
html[data-theme] .pt-claim { color: #ffd600; font-family: var(--type); }
html[data-theme] .pd .num { color: #d81f28; filter: drop-shadow(0 0 0.1em rgba(214, 32, 38, 0.6)); }
.ev-switch { display: inline-flex; padding: 4px; border: 1px solid rgba(255, 214, 0, 0.4); margin-bottom: 30px; }
.ev-switch button { padding: 12px 20px; font: 400 13px var(--type); letter-spacing: 0.2em; text-transform: uppercase; color: var(--mute); transition: background-color 0.25s, color 0.25s; }
.ev-switch button.on { background: #ffd600; color: #111; }
.ev-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 30px); }
.ev { position: relative; padding: 26px 26px 54px; background: #efe6d2; color: #1a1410; transform: rotate(var(--r)); box-shadow: 0 30px 50px -25px rgba(0, 0, 0, 0.9); transition: transform 0.5s var(--ease), box-shadow 0.4s, opacity 0.7s var(--ease) calc(var(--d, 0) * 0.75ms), translate 0.85s var(--ease-out) calc(var(--d, 0) * 0.75ms), scale 0.85s var(--ease-out) calc(var(--d, 0) * 0.75ms); }
.ev:hover { transform: rotate(0) translateY(-6px) scale(1.02); }
.ev::before { content: ""; position: absolute; top: -12px; left: 50%; width: 90px; height: 24px; margin-left: -45px; background: rgba(255, 214, 0, 0.85); transform: rotate(-3deg); }
.ev-no { font: 400 12px var(--type); letter-spacing: 0.2em; text-transform: uppercase; color: #8a0812; }
.ev h3 { margin-top: 10px; font: 400 clamp(38px, 3.4vw, 54px)/1 var(--t-disp); color: #a50e18; }
.ev p { margin-top: 12px; font: 400 15px/1.5 var(--type); }
.ev-case { position: absolute; left: 26px; bottom: 18px; font: 400 11px var(--type); letter-spacing: 0.14em; color: #6b5d48; }
.ev-blood { position: absolute; right: 16px; bottom: 14px; width: 60px; height: 50px; border-radius: 50%; background: radial-gradient(circle at 40% 40%, rgba(165, 14, 24, 0.85), rgba(90, 0, 6, 0.6) 55%, transparent 62%); opacity: 0.35; transition: opacity 0.4s, transform 0.4s; }
.sx-evidence.ott .ev { background: #f3e4e0; animation: shakeev 0.35s ease 1; }
.sx-evidence.ott .ev-blood { opacity: 1; transform: scale(2.4) rotate(20deg); }
.sx-evidence.ott .ev h3 { text-shadow: 3px 3px 0 rgba(165, 14, 24, 0.25); }
@keyframes shakeev { 25% { transform: rotate(var(--r)) translate(-4px, 2px); } 75% { transform: rotate(var(--r)) translate(4px, -2px); } }
@media (max-width: 980px) { .ev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ev-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 720px) { html[data-theme] .fx-tape { display: none; } }
