/* PUBGM skin — battleground HUD. Charcoal/olive ground, PUBG yellow, khaki, stencil + condensed type. */

body[data-game='pubgm'] {
  --bg: #111310;
  --bg-2: #1a1d17;
  --panel: rgba(20, 23, 17, 0.9);
  --panel-solid: #151812;
  --panel-2: #1d2119;
  --panel-3: #272b21;
  --line: rgba(184, 167, 122, 0.2);
  --line-strong: rgba(184, 167, 122, 0.45);
  --ink: #ece9df;
  --ink-2: #cfcab8;
  --muted: #a09c88;
  --khaki: #b8a77a;
  --accent: #f2a900;
  --accent-2: #ffc63b;
  --accent-ink: #14120b;
  --accent-soft: rgba(242, 169, 0, 0.13);
  --danger: #c0392b;
  --danger-ink: #ff8b7b;
  --chart-grid: rgba(236, 233, 223, 0.09);
  --chart-surface: #151812;
  --font-display: 'Teko', 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-data: 'Share Tech Mono', ui-monospace, Consolas, monospace;
  --stencil: 'Saira Stencil One', 'Teko', sans-serif;
}

/* top HUD: compass on, thin tick rule under the bar */
body[data-game='pubgm'] .topbar { border-bottom: 1px solid transparent; }
body[data-game='pubgm'] .hud-top {
  background: linear-gradient(180deg, rgba(10, 11, 9, 0.97), rgba(10, 11, 9, 0.9));
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
}
body[data-game='pubgm'] .hud-top::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -5px; height: 4px; pointer-events: none;
  background-image: linear-gradient(90deg, var(--line-strong) 1px, transparent 1px);
  background-size: 16px 4px; opacity: 0.6;
}
body[data-game='pubgm'] .brand__name::after { content: ''; display: inline-block; width: 7px; height: 7px; background: var(--accent); margin-left: 6px; vertical-align: 6px; }

/* stencil stamp used on the landing preview + onboarding tag */
.stamp {
  position: absolute; z-index: 4; font-family: var(--stencil); color: rgba(192, 57, 43, 0.85);
  border: 3px solid rgba(192, 57, 43, 0.75); padding: 4px 12px 2px; font-size: 22px; letter-spacing: 0.12em;
  transform: rotate(-9deg); pointer-events: none; mix-blend-mode: screen; text-transform: uppercase; line-height: 1.1;
}
body[data-game='mlbb'] .stamp { display: none; }

/* hero title: stencil on the first line for a military-issue feel */
body[data-game='pubgm'] .hero__title .l1 { font-family: var(--stencil); font-weight: 400; font-size: 0.62em; letter-spacing: 0.04em; color: var(--khaki); line-height: 1.05; }
body[data-game='pubgm'] .hero__title .hl { text-shadow: 0 0 40px rgba(242, 169, 0, 0.25); }

/* hazard stripe accents */
.hazard { height: 6px; background: repeating-linear-gradient(135deg, var(--accent) 0 10px, #14120b 10px 20px); opacity: 0.9; }
body[data-game='mlbb'] .hazard { background: linear-gradient(90deg, transparent, var(--accent), transparent); height: 1px; }

/* HUD crosshair cursor on interactive surfaces */
body[data-game='pubgm'] .drop,
body[data-game='pubgm'] .game-card,
body[data-game='pubgm'] .pc,
body[data-game='pubgm'] .rp-tile { cursor: crosshair; }

/* dropzone reticle ring pulse */
body[data-game='pubgm'] .drop::before {
  content: ''; position: absolute; inset: 14px; pointer-events: none;
  background:
    linear-gradient(var(--accent), var(--accent)) top left / 18px 2px no-repeat,
    linear-gradient(var(--accent), var(--accent)) top left / 2px 18px no-repeat,
    linear-gradient(var(--accent), var(--accent)) top right / 18px 2px no-repeat,
    linear-gradient(var(--accent), var(--accent)) top right / 2px 18px no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom left / 18px 2px no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom left / 2px 18px no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom right / 18px 2px no-repeat,
    linear-gradient(var(--accent), var(--accent)) bottom right / 2px 18px no-repeat;
  opacity: 0.8; transition: inset 0.25s ease;
}
body[data-game='pubgm'] .drop:hover::before, body[data-game='pubgm'] .drop.is-over::before { inset: 8px; }

/* report: in-game results banner feel */
body[data-game='pubgm'] .report::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 6px;
  /* SVG tile instead of repeating-linear-gradient so the PNG export (html2canvas) paints it too */
  background: #14120b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='6'%3E%3Cpath d='M0 6 6 0h10l-6 6z' fill='%23f2a900'/%3E%3C/svg%3E") repeat-x 0 0 / 20px 6px;
}
body[data-game='pubgm'] .rp-banner__num, body[data-game='pubgm'] .rp-banner__hash { text-shadow: 0 4px 30px rgba(242, 169, 0, 0.25); }
body[data-game='pubgm'] .rp-title__team { text-shadow: 0 2px 0 rgba(0, 0, 0, 0.6); }

/* compass visible only on PUBGM */
body[data-game='mlbb'] .compass-wrap .compass { display: none; }