/* KNUCKLE DUST · Boxring im Scheinwerfer, Marker-Graffiti, Seile */
html[data-theme] .fxt { background: none; -webkit-text-fill-color: currentColor; color: #e03232; text-shadow: 3px 3px 0 #000, 0 0 30px rgba(224, 50, 50, 0.4); }
html[data-theme] .ph-t { font-size: clamp(56px, 14cqi, 150px); line-height: 1; rotate: -3deg; }
html[data-theme] .ph-s { letter-spacing: 0.5em; color: #b8e0a6; }
html[data-theme] .ph-bg { opacity: 1; }
.fx-ring { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.fx-ring .spot { position: absolute; left: 50%; top: -20%; width: 60%; height: 140%; transform: translateX(-10%); background: linear-gradient(180deg, rgba(220, 255, 200, 0.18), transparent 80%); clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%); animation: spot 5s ease-in-out infinite; }
@keyframes spot { 50% { opacity: 0.6; } }
.fx-ring .rope { position: absolute; left: -5%; right: -5%; height: 6px; border-radius: 3px; background: linear-gradient(180deg, #e8e8e8, #8a8a8a); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.6); opacity: 0.5; }
.fx-ring .r1 { top: 66%; } .fx-ring .r2 { top: 76%; } .fx-ring .r3 { top: 86%; }
html[data-theme] .btn--acc { background: #e03232; color: #fff; border-radius: 2px; font-family: var(--t-disp); letter-spacing: 0.06em; text-transform: none; font-size: 17px; }
html[data-theme] .ph-meta li + li::before, html[data-theme] .pb .gem { border-radius: 50%; transform: none; background: #e03232; box-shadow: none; }
html[data-theme] .pd .num { color: #fff; text-shadow: 3px 3px 0 #e03232; filter: none; }
.fr { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 40px; align-items: center; padding: clamp(30px, 4vw, 60px); border: 1px solid rgba(var(--acc), 0.35); border-radius: 18px; background: radial-gradient(70% 90% at 0% 50%, rgba(var(--acc), 0.18), transparent 70%), rgba(255, 255, 255, 0.02); }
.fr img:not(.ff-h img) { width: 100%; max-width: 360px; justify-self: center; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.85)); animation: float 6s ease-in-out infinite; }
.fr-f { display: flex; gap: 8px; margin-top: 24px; max-width: 520px; }
.fr-f input { flex: 1; min-width: 0; height: 54px; padding: 0 22px; border-radius: 999px; border: 1px solid var(--line-2); background: rgba(0, 0, 0, 0.6); color: #fff; font-size: 14px; }
.fr-f input:focus { outline: none; border-color: rgb(var(--acc)); }
@media (max-width: 760px) { .fr { grid-template-columns: minmax(0, 1fr); } .fr-f { flex-direction: column; } }