/* DartcherZero Design Tokens — Dallas Stars palette, commercial kiosk */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;900&family=Barlow:wght@400;500;600;700&display=swap');

:root {
  --dz-bg:       #0d1117;
  --dz-bg-warm:  #0d1a14;
  --dz-surface:  #0f1623;
  --dz-surface2: #111827;
  --dz-ink:      #e5e7eb;
  --dz-muted:    #9ca3af;
  --dz-muted2:   #A8B2C1;
  --dz-green:    #006847;
  --dz-green-lt: #008a5c;
  --dz-blue:     #3b82f6;
  --dz-amber:    #f59e0b;
  --dz-red:      #ef4444;
  --dz-line:     rgba(255,255,255,.06);
  --dz-line2:    rgba(255,255,255,.10);
  --dz-line3:    rgba(255,255,255,.14);
  --dz-r:  14px;
  --dz-r2: 20px;
  --dz-r3: 28px;
  --dz-glow-green: 0 0 24px rgba(0,104,71,.30);
}

/* ── Ripple ── */
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.15);transform:scale(0);animation:rippleAnim .5s ease-out;pointer-events:none}
@keyframes rippleAnim{to{transform:scale(4);opacity:0}}

/* ── Shimmer skeleton ── */
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.shimmer-block{border-radius:8px;background:linear-gradient(90deg,rgba(255,255,255,.04) 25%,rgba(255,255,255,.09) 50%,rgba(255,255,255,.04) 75%);background-size:200% 100%;animation:shimmer 1.6s ease-in-out infinite}

/* ── Logo pulse (idle/screensaver) ── */
@keyframes logoPulse{0%,100%{filter:drop-shadow(0 0 20px rgba(0,104,71,.3))}50%{filter:drop-shadow(0 0 50px rgba(0,104,71,.55))}}