/* MARKS METALL — Laser statt Mauszeiger (Prototyp 03.10.2026), Logik in assets/js/laser-zeiger.js */

/* Systemzeiger nur ausblenden, solange der Laser läuft – Eingabefelder behalten den Textcursor */
html.laser-zeiger-an,
html.laser-zeiger-an * { cursor: none !important; }
html.laser-zeiger-an input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),
html.laser-zeiger-an textarea,
html.laser-zeiger-an [contenteditable=""],
html.laser-zeiger-an [contenteditable=true] { cursor: text !important; }
html.laser-zeiger-an select { cursor: default !important; }

.laser-zeiger__spur {
  position: fixed; inset: 0; z-index: 2147483646;
  pointer-events: none;
}

.laser-zeiger {
  --kern: #FFF8EC;
  --glut: 216, 93, 0;            /* --laser-500 */
  position: fixed; top: 0; left: 0; z-index: 2147483647;
  width: 0; height: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease;
  will-change: transform;
}
.laser-zeiger.is-sichtbar { opacity: 1; }

.laser-zeiger__schein,
.laser-zeiger__kern {
  position: absolute; left: 0; top: 0; border-radius: 50%;
  transform: translate(-50%, -50%);
}
.laser-zeiger__schein {
  width: 34px; height: 34px;
  background: radial-gradient(circle, rgba(var(--glut), .55) 0%, rgba(var(--glut), .22) 35%, rgba(var(--glut), 0) 70%);
  animation: laser-zeiger-flackern 1.6s ease-in-out infinite;
  transition: width .18s ease, height .18s ease;
}
.laser-zeiger__kern {
  width: 6px; height: 6px;
  background: var(--kern);
  box-shadow: 0 0 2px 1px rgba(255, 220, 170, .95), 0 0 8px 2px rgba(var(--glut), .9);
  transition: width .18s ease, height .18s ease;
}

/* Über Links und Knöpfen: Laser zieht an – Punkt größer, Schein heller */
.laser-zeiger.is-ziel .laser-zeiger__schein { width: 52px; height: 52px; }
.laser-zeiger.is-ziel .laser-zeiger__kern { width: 9px; height: 9px; }

/* Klick: kurzer Schuss */
.laser-zeiger.is-schuss .laser-zeiger__schein { animation: laser-zeiger-schuss .32s ease-out; }

/* Auf hellem Untergrund (je nach Fläche unter dem Zeiger, nicht nach Modus): heißes Orange mit dunklem Rand */
.laser-zeiger.auf-hell { --kern: #FFB25A; }
.laser-zeiger.auf-hell .laser-zeiger__kern { box-shadow: 0 0 0 1px rgba(120, 40, 0, .55), 0 0 7px 2px rgba(var(--glut), .85); }
.laser-zeiger.auf-hell .laser-zeiger__schein {
  background: radial-gradient(circle, rgba(var(--glut), .42) 0%, rgba(var(--glut), .14) 40%, rgba(var(--glut), 0) 70%);
}

@keyframes laser-zeiger-flackern {
  0%, 100% { opacity: .9; }
  45% { opacity: 1; }
  60% { opacity: .78; }
}
@keyframes laser-zeiger-schuss {
  0% { width: 80px; height: 80px; opacity: 1; }
  100% { width: 34px; height: 34px; opacity: .9; }
}

@media (prefers-reduced-motion: reduce) {
  .laser-zeiger__schein { animation: none; }
  .laser-zeiger.is-schuss .laser-zeiger__schein { animation: none; }
}