@tailwind base;
@tailwind components;
@tailwind utilities;

/* ===================== TacForce — Command-Center ===================== */
:root { --tf-grid: rgba(9, 9, 11, .055); }
.dark { --tf-grid: rgba(255, 255, 255, .045); }

/* Technisches Raster */
.tf-grid {
  background-image:
    linear-gradient(to right, var(--tf-grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--tf-grid) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(ellipse 75% 55% at 50% 0%, #000 35%, transparent 100%);
          mask-image: radial-gradient(ellipse 75% 55% at 50% 0%, #000 35%, transparent 100%);
}

/* HUD-Ecken */
.tf-hud { position: relative; }
.tf-hud::before, .tf-hud::after {
  content: ""; position: absolute; width: 11px; height: 11px; pointer-events: none;
  border-color: rgba(59, 130, 246, .55);
}
.tf-hud::before { top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid; }
.tf-hud::after { bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid; }

/* Scanlines */
.tf-scan::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: repeating-linear-gradient(to bottom, rgba(120, 140, 180, .05) 0 1px, transparent 1px 3px);
  opacity: .6;
}

/* Terminal-Cursor */
.tf-cursor::after { content: "▮"; margin-left: .15em; color: #3b82f6; animation: tfblink 1.15s steps(1) infinite; }
@keyframes tfblink { 50% { opacity: 0; } }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #3f3f46; border-radius: 6px; }
html:not(.dark) ::-webkit-scrollbar-thumb { background: #d4d4d8; }

[x-cloak] { display: none !important; }