@charset "UTF-8";
/* ---- The SHEET: the Skirmish map card's parchment ---------------------------
   The grain over aged cream, the edges worn (a ragged clip, so the lift is a
   drop-shadow filter, which follows the clip), a little darker towards the
   edge where the sheet has been handled; two more sheets under it, a degree
   askew. Drawn by two pseudo-elements BEHIND the element (its own background
   is none), so the stack can spill past its edges without painting over its
   face. The element needs position: relative and isolation: isolate --
   .wtt-sheet sets them; the game's .hud-map-preview-col sets its own. A paper
   clip over the top-right corner and a compass rose printed faint in the
   bottom-right are the two spans a sheet may carry.

   SHARED: style.css @imports this for the game's .hud-map-* names, and it is
   published beside materials.css for the community site, which wears it as
   .wtt-sheet / .wtt-sheet-clip / .wtt-sheet-compass. The game's compass is an
   inline SVG (menuIcons.ts COMPASS_ROSE, in currentColor); the published copy
   paints compass.svg beside this file -- the same drawing with the ink baked
   in, held equal by brandDeployment.test.ts. */
.wtt-sheet {
  position: relative;
  isolation: isolate;
}
.wtt-sheet::before,
.wtt-sheet::after,
.hud-map-preview-col::before,
.hud-map-preview-col::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: var(--tex-parchment), var(--cream);
  clip-path: var(--torn);
  box-shadow: inset 0 0 0 1px rgba(160, 138, 92, 0.55), inset 0 0 28px rgba(120, 90, 40, 0.18);
}
/* The top sheet. */
.wtt-sheet::before,
.hud-map-preview-col::before {
  z-index: -1;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.4));
}
/* The sheets under it. */
.wtt-sheet::after,
.hud-map-preview-col::after {
  z-index: -2;
  background: var(--tex-parchment), #dccfab;
  clip-path: var(--torn-rough);
  transform: rotate(-1.4deg) translate(4px, 4px);
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.35));
}
/* The paper clip over the sheet's top-right corner — the dossier's, in px. */
.wtt-sheet-clip,
.hud-map-clip {
  position: absolute;
  top: -8px;
  right: 14px;
  width: 13px;
  height: 32px;
  border: 2.5px solid #9299a3;
  border-radius: 7px;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.25), 0 1px 1px rgba(0, 0, 0, 0.3);
  transform: rotate(10deg);
  pointer-events: none;
}
.wtt-sheet-clip::after,
.hud-map-clip::after {
  content: "";
  position: absolute;
  inset: 3px 2px 7px;
  border: 2px solid #aab1bb;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
}
/* The compass rose, printed faint in the sheet's bottom corner. */
.wtt-sheet-compass,
.hud-map-compass {
  position: absolute;
  right: 12px;
  bottom: 8px;
  width: 44px;
  height: 44px;
  color: #4d4126;
  opacity: 0.4;
  pointer-events: none;
}
.hud-map-compass svg {
  display: block;
  width: 100%;
  height: 100%;
}
.wtt-sheet-compass {
  background: url("./compass.svg") center / contain no-repeat;
}