/* Loam Colony site styles. Colors live in :root so they are easy to tweak. */

@font-face {
  font-family: "Lilita One";
  src: url("/fonts/lilita-one-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Exo 2";
  src: url("/fonts/exo-2-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Exo 2";
  src: url("/fonts/exo-2-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --stone-950: #0f0e0d;
  --stone-900: #161412;
  --stone-850: #1c1916;
  --stone-800: #24201c;
  --stone-700: #3a332c;
  --text: #ede5d6;
  --muted: #b5aa97;
  --gold-200: #fbe3a0;
  --gold-300: #f8d272;
  --gold-400: #efb440;
  --gold-500: #d8952a;
  --gold-700: #7a5218;
  --patch-dark: rgba(11, 9, 7, 0.74);
  --patch-lit: rgba(92, 70, 41, 0.94);
  --display: "Lilita One", "Arial Black", system-ui, sans-serif;
  --body: "Exo 2", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --wrap: 1160px;
  --gutter: clamp(16px, 4vw, 40px);
  color-scheme: dark;

  /* Rough dirt patch outlines, like the game's HUD. Generated, so edit with care. */
  --patch-s: polygon(0.3px 9px, 2.7px 5.3px, 5.3px 2.5px, 9px 0.5px, calc(9px + 0.143 * (100% - 18px)) 1.1px, calc(9px + 0.286 * (100% - 18px)) 2px, calc(9px + 0.429 * (100% - 18px)) 3px, calc(9px + 0.571 * (100% - 18px)) 1.1px, calc(9px + 0.714 * (100% - 18px)) 0px, calc(9px + 0.857 * (100% - 18px)) 1.8px, calc(100% - 9px) 0.5px, calc(100% - 5.4px) 2.8px, calc(100% - 2.8px) 5.4px, calc(100% - 0.1px) 9px, calc(100% - 3.8px) calc(9px + 0.333 * (100% - 18px)), calc(100% - 1px) calc(9px + 0.667 * (100% - 18px)), calc(100% - 0.4px) calc(100% - 9px), calc(100% - 1.9px) calc(100% - 4.9px), calc(100% - 4.5px) calc(100% - 1.3px), calc(100% - 9px) calc(100% - 0.4px), calc(9px + 0.857 * (100% - 18px)) calc(100% - 1.2px), calc(9px + 0.714 * (100% - 18px)) calc(100% - 0.6px), calc(9px + 0.571 * (100% - 18px)) calc(100% - 1.1px), calc(9px + 0.429 * (100% - 18px)) calc(100% - 0.1px), calc(9px + 0.286 * (100% - 18px)) calc(100% - 1.4px), calc(9px + 0.143 * (100% - 18px)) calc(100% - 0.5px), 9px calc(100% - 2px), 5.4px calc(100% - 2.7px), 1.4px calc(100% - 4.6px), 0.7px calc(100% - 9px), 1.8px calc(9px + 0.667 * (100% - 18px)), 1.1px calc(9px + 0.333 * (100% - 18px)));
  --patch-m: polygon(2.7px 11px, 3.8px 6.8px, 5.6px 1.6px, 11px 0.2px, calc(11px + 0.083 * (100% - 22px)) 2.6px, calc(11px + 0.167 * (100% - 22px)) 1.1px, calc(11px + 0.250 * (100% - 22px)) 2.1px, calc(11px + 0.333 * (100% - 22px)) 0.6px, calc(11px + 0.417 * (100% - 22px)) 1.4px, calc(11px + 0.500 * (100% - 22px)) 3.5px, calc(11px + 0.583 * (100% - 22px)) 1.9px, calc(11px + 0.667 * (100% - 22px)) 0.9px, calc(11px + 0.750 * (100% - 22px)) 4.1px, calc(11px + 0.833 * (100% - 22px)) 1.1px, calc(11px + 0.917 * (100% - 22px)) 3.1px, calc(100% - 11px) 1.5px, calc(100% - 6.3px) 2.8px, calc(100% - 2px) 5.8px, calc(100% - 0.1px) 11px, calc(100% - 0.5px) calc(11px + 0.250 * (100% - 22px)), calc(100% - 3.5px) calc(11px + 0.500 * (100% - 22px)), calc(100% - 0.6px) calc(11px + 0.750 * (100% - 22px)), calc(100% - 2.5px) calc(100% - 11px), calc(100% - 3.4px) calc(100% - 6.6px), calc(100% - 6.5px) calc(100% - 3.3px), calc(100% - 11px) calc(100% - 2.5px), calc(11px + 0.917 * (100% - 22px)) calc(100% - 2.8px), calc(11px + 0.833 * (100% - 22px)) calc(100% - 3.4px), calc(11px + 0.750 * (100% - 22px)) calc(100% - 0.6px), calc(11px + 0.667 * (100% - 22px)) calc(100% - 2.5px), calc(11px + 0.583 * (100% - 22px)) calc(100% - 1.9px), calc(11px + 0.500 * (100% - 22px)) calc(100% - 3.2px), calc(11px + 0.417 * (100% - 22px)) calc(100% - 2.9px), calc(11px + 0.333 * (100% - 22px)) calc(100% - 3.1px), calc(11px + 0.250 * (100% - 22px)) calc(100% - 1.6px), calc(11px + 0.167 * (100% - 22px)) calc(100% - 3.2px), calc(11px + 0.083 * (100% - 22px)) calc(100% - 1.7px), 11px calc(100% - 0.6px), 6px calc(100% - 2.3px), 3.2px calc(100% - 6.5px), 0.5px calc(100% - 11px), 0.9px calc(11px + 0.750 * (100% - 22px)), 1.1px calc(11px + 0.500 * (100% - 22px)), 2.5px calc(11px + 0.250 * (100% - 22px)));
  --patch-m2: polygon(0.7px 11px, 2.8px 6.3px, 6px 2.4px, 11px 1.7px, calc(11px + 0.083 * (100% - 22px)) 0.2px, calc(11px + 0.167 * (100% - 22px)) 5.7px, calc(11px + 0.250 * (100% - 22px)) 0.8px, calc(11px + 0.333 * (100% - 22px)) 1.6px, calc(11px + 0.417 * (100% - 22px)) 1.7px, calc(11px + 0.500 * (100% - 22px)) 0.5px, calc(11px + 0.583 * (100% - 22px)) 3px, calc(11px + 0.667 * (100% - 22px)) 2.6px, calc(11px + 0.750 * (100% - 22px)) 0.2px, calc(11px + 0.833 * (100% - 22px)) 2.1px, calc(11px + 0.917 * (100% - 22px)) 0.1px, calc(100% - 11px) 2.4px, calc(100% - 6.2px) 2.6px, calc(100% - 3.2px) 6.5px, calc(100% - 2.5px) 11px, calc(100% - 3.2px) calc(11px + 0.250 * (100% - 22px)), calc(100% - 2.8px) calc(11px + 0.500 * (100% - 22px)), calc(100% - 3.3px) calc(11px + 0.750 * (100% - 22px)), calc(100% - 2.5px) calc(100% - 11px), calc(100% - 1.7px) calc(100% - 5.6px), calc(100% - 5.7px) calc(100% - 1.8px), calc(100% - 11px) calc(100% - 0.6px), calc(11px + 0.917 * (100% - 22px)) calc(100% - 1.5px), calc(11px + 0.833 * (100% - 22px)) calc(100% - 1.1px), calc(11px + 0.750 * (100% - 22px)) calc(100% - 1.4px), calc(11px + 0.667 * (100% - 22px)) calc(100% - 2px), calc(11px + 0.583 * (100% - 22px)) calc(100% - 3.2px), calc(11px + 0.500 * (100% - 22px)) calc(100% - 3.3px), calc(11px + 0.417 * (100% - 22px)) calc(100% - 3.5px), calc(11px + 0.333 * (100% - 22px)) calc(100% - 0.6px), calc(11px + 0.250 * (100% - 22px)) calc(100% - 3.4px), calc(11px + 0.167 * (100% - 22px)) calc(100% - 2px), calc(11px + 0.083 * (100% - 22px)) calc(100% - 0.7px), 11px calc(100% - 2.3px), 6.3px calc(100% - 2.9px), 2.2px calc(100% - 5.9px), 0.2px calc(100% - 11px), 3.5px calc(11px + 0.750 * (100% - 22px)), 5.6px calc(11px + 0.500 * (100% - 22px)), 0.5px calc(11px + 0.250 * (100% - 22px)));
  --patch-l: polygon(0.8px 13px, 2.1px 6.7px, 7.2px 3px, 13px 0.6px, calc(13px + 0.050 * (100% - 26px)) 7.2px, calc(13px + 0.100 * (100% - 26px)) 3.6px, calc(13px + 0.150 * (100% - 26px)) 1px, calc(13px + 0.200 * (100% - 26px)) 1.2px, calc(13px + 0.250 * (100% - 26px)) 0.5px, calc(13px + 0.300 * (100% - 26px)) 4.2px, calc(13px + 0.350 * (100% - 26px)) 3.6px, calc(13px + 0.400 * (100% - 26px)) 0.9px, calc(13px + 0.450 * (100% - 26px)) 2.8px, calc(13px + 0.500 * (100% - 26px)) 3.8px, calc(13px + 0.550 * (100% - 26px)) 0.4px, calc(13px + 0.600 * (100% - 26px)) 3px, calc(13px + 0.650 * (100% - 26px)) 0.8px, calc(13px + 0.700 * (100% - 26px)) 0.4px, calc(13px + 0.750 * (100% - 26px)) 3.9px, calc(13px + 0.800 * (100% - 26px)) 1.4px, calc(13px + 0.850 * (100% - 26px)) 2.6px, calc(13px + 0.900 * (100% - 26px)) 3.8px, calc(13px + 0.950 * (100% - 26px)) 1.9px, calc(100% - 13px) 2.2px, calc(100% - 7.3px) 3.1px, calc(100% - 2.2px) 6.8px, calc(100% - 1.1px) 13px, calc(100% - 0.2px) calc(13px + 0.167 * (100% - 26px)), calc(100% - 7.9px) calc(13px + 0.333 * (100% - 26px)), calc(100% - 2.4px) calc(13px + 0.500 * (100% - 26px)), calc(100% - 1.5px) calc(13px + 0.667 * (100% - 26px)), calc(100% - 0.9px) calc(13px + 0.833 * (100% - 26px)), calc(100% - 1.5px) calc(100% - 13px), calc(100% - 2.4px) calc(100% - 6.9px), calc(100% - 7.6px) calc(100% - 3.7px), calc(100% - 13px) calc(100% - 1px), calc(13px + 0.950 * (100% - 26px)) calc(100% - 3.4px), calc(13px + 0.900 * (100% - 26px)) calc(100% - 2.5px), calc(13px + 0.850 * (100% - 26px)) calc(100% - 0.5px), calc(13px + 0.800 * (100% - 26px)) calc(100% - 6.7px), calc(13px + 0.750 * (100% - 26px)) calc(100% - 2.8px), calc(13px + 0.700 * (100% - 26px)) calc(100% - 1.5px), calc(13px + 0.650 * (100% - 26px)) calc(100% - 2.1px), calc(13px + 0.600 * (100% - 26px)) calc(100% - 8.1px), calc(13px + 0.550 * (100% - 26px)) calc(100% - 4.3px), calc(13px + 0.500 * (100% - 26px)) calc(100% - 4.3px), calc(13px + 0.450 * (100% - 26px)) calc(100% - 6.9px), calc(13px + 0.400 * (100% - 26px)) calc(100% - 3.5px), calc(13px + 0.350 * (100% - 26px)) calc(100% - 4.2px), calc(13px + 0.300 * (100% - 26px)) calc(100% - 3.7px), calc(13px + 0.250 * (100% - 26px)) calc(100% - 0.9px), calc(13px + 0.200 * (100% - 26px)) calc(100% - 0.6px), calc(13px + 0.150 * (100% - 26px)) calc(100% - 4.3px), calc(13px + 0.100 * (100% - 26px)) calc(100% - 0px), calc(13px + 0.050 * (100% - 26px)) calc(100% - 6.5px), 13px calc(100% - 2.8px), 7.2px calc(100% - 2.9px), 2.6px calc(100% - 7px), 0.3px calc(100% - 13px), 1.9px calc(13px + 0.833 * (100% - 26px)), 0.3px calc(13px + 0.667 * (100% - 26px)), 6.5px calc(13px + 0.500 * (100% - 26px)), 0.7px calc(13px + 0.333 * (100% - 26px)), 7.5px calc(13px + 0.167 * (100% - 26px)));
  --patch-l2: polygon(2.2px 13px, 4.1px 7.8px, 7.9px 4.2px, 13px 3.4px, calc(13px + 0.050 * (100% - 26px)) 4.2px, calc(13px + 0.100 * (100% - 26px)) 7.4px, calc(13px + 0.150 * (100% - 26px)) 2.9px, calc(13px + 0.200 * (100% - 26px)) 0.5px, calc(13px + 0.250 * (100% - 26px)) 1.1px, calc(13px + 0.300 * (100% - 26px)) 2.6px, calc(13px + 0.350 * (100% - 26px)) 6.7px, calc(13px + 0.400 * (100% - 26px)) 4.1px, calc(13px + 0.450 * (100% - 26px)) 0.7px, calc(13px + 0.500 * (100% - 26px)) 0.6px, calc(13px + 0.550 * (100% - 26px)) 0.6px, calc(13px + 0.600 * (100% - 26px)) 8.6px, calc(13px + 0.650 * (100% - 26px)) 1px, calc(13px + 0.700 * (100% - 26px)) 3.9px, calc(13px + 0.750 * (100% - 26px)) 4.3px, calc(13px + 0.800 * (100% - 26px)) 3.1px, calc(13px + 0.850 * (100% - 26px)) 4.2px, calc(13px + 0.900 * (100% - 26px)) 4.3px, calc(13px + 0.950 * (100% - 26px)) 1.3px, calc(100% - 13px) 1.3px, calc(100% - 6.8px) 2.3px, calc(100% - 2.2px) 6.8px, calc(100% - 0.2px) 13px, calc(100% - 2.7px) calc(13px + 0.167 * (100% - 26px)), calc(100% - 8px) calc(13px + 0.333 * (100% - 26px)), calc(100% - 1.4px) calc(13px + 0.500 * (100% - 26px)), calc(100% - 2.2px) calc(13px + 0.667 * (100% - 26px)), calc(100% - 2.2px) calc(13px + 0.833 * (100% - 26px)), calc(100% - 2.5px) calc(100% - 13px), calc(100% - 1.9px) calc(100% - 6.6px), calc(100% - 8.3px) calc(100% - 4.8px), calc(100% - 13px) calc(100% - 0.1px), calc(13px + 0.950 * (100% - 26px)) calc(100% - 3.8px), calc(13px + 0.900 * (100% - 26px)) calc(100% - 8.4px), calc(13px + 0.850 * (100% - 26px)) calc(100% - 2.6px), calc(13px + 0.800 * (100% - 26px)) calc(100% - 6.1px), calc(13px + 0.750 * (100% - 26px)) calc(100% - 4.3px), calc(13px + 0.700 * (100% - 26px)) calc(100% - 3.4px), calc(13px + 0.650 * (100% - 26px)) calc(100% - 4.2px), calc(13px + 0.600 * (100% - 26px)) calc(100% - 1.6px), calc(13px + 0.550 * (100% - 26px)) calc(100% - 3.5px), calc(13px + 0.500 * (100% - 26px)) calc(100% - 3.4px), calc(13px + 0.450 * (100% - 26px)) calc(100% - 3.9px), calc(13px + 0.400 * (100% - 26px)) calc(100% - 8.8px), calc(13px + 0.350 * (100% - 26px)) calc(100% - 7px), calc(13px + 0.300 * (100% - 26px)) calc(100% - 4.1px), calc(13px + 0.250 * (100% - 26px)) calc(100% - 4.2px), calc(13px + 0.200 * (100% - 26px)) calc(100% - 1.4px), calc(13px + 0.150 * (100% - 26px)) calc(100% - 0.8px), calc(13px + 0.100 * (100% - 26px)) calc(100% - 6.4px), calc(13px + 0.050 * (100% - 26px)) calc(100% - 4.5px), 13px calc(100% - 0.6px), 6.6px calc(100% - 1.9px), 4.8px calc(100% - 8.3px), 1.9px calc(100% - 13px), 1.1px calc(13px + 0.833 * (100% - 26px)), 3.7px calc(13px + 0.667 * (100% - 26px)), 1.9px calc(13px + 0.500 * (100% - 26px)), 8.7px calc(13px + 0.333 * (100% - 26px)), 7.5px calc(13px + 0.167 * (100% - 26px)));
  --patch-l3: polygon(2.9px 13px, 4.3px 8px, 7.4px 3.3px, 13px 0.9px, calc(13px + 0.050 * (100% - 26px)) 8px, calc(13px + 0.100 * (100% - 26px)) 3.4px, calc(13px + 0.150 * (100% - 26px)) 3.5px, calc(13px + 0.200 * (100% - 26px)) 3.6px, calc(13px + 0.250 * (100% - 26px)) 1.9px, calc(13px + 0.300 * (100% - 26px)) 3.1px, calc(13px + 0.350 * (100% - 26px)) 2.5px, calc(13px + 0.400 * (100% - 26px)) 1.2px, calc(13px + 0.450 * (100% - 26px)) 3.1px, calc(13px + 0.500 * (100% - 26px)) 1.5px, calc(13px + 0.550 * (100% - 26px)) 8.4px, calc(13px + 0.600 * (100% - 26px)) 2px, calc(13px + 0.650 * (100% - 26px)) 6.6px, calc(13px + 0.700 * (100% - 26px)) 1.3px, calc(13px + 0.750 * (100% - 26px)) 2.6px, calc(13px + 0.800 * (100% - 26px)) 2.9px, calc(13px + 0.850 * (100% - 26px)) 4.2px, calc(13px + 0.900 * (100% - 26px)) 2.3px, calc(13px + 0.950 * (100% - 26px)) 3.1px, calc(100% - 13px) 2.9px, calc(100% - 8.3px) 4.8px, calc(100% - 1.8px) 6.6px, calc(100% - 1.3px) 13px, calc(100% - 1.4px) calc(13px + 0.167 * (100% - 26px)), calc(100% - 0.4px) calc(13px + 0.333 * (100% - 26px)), calc(100% - 2.4px) calc(13px + 0.500 * (100% - 26px)), calc(100% - 3px) calc(13px + 0.667 * (100% - 26px)), calc(100% - 0.9px) calc(13px + 0.833 * (100% - 26px)), calc(100% - 1.7px) calc(100% - 13px), calc(100% - 2.2px) calc(100% - 6.7px), calc(100% - 6.9px) calc(100% - 2.4px), calc(100% - 13px) calc(100% - 3.1px), calc(13px + 0.950 * (100% - 26px)) calc(100% - 0.1px), calc(13px + 0.900 * (100% - 26px)) calc(100% - 0.1px), calc(13px + 0.850 * (100% - 26px)) calc(100% - 4.1px), calc(13px + 0.800 * (100% - 26px)) calc(100% - 1.4px), calc(13px + 0.750 * (100% - 26px)) calc(100% - 1.8px), calc(13px + 0.700 * (100% - 26px)) calc(100% - 4.5px), calc(13px + 0.650 * (100% - 26px)) calc(100% - 7.3px), calc(13px + 0.600 * (100% - 26px)) calc(100% - 1.8px), calc(13px + 0.550 * (100% - 26px)) calc(100% - 1.1px), calc(13px + 0.500 * (100% - 26px)) calc(100% - 4px), calc(13px + 0.450 * (100% - 26px)) calc(100% - 4px), calc(13px + 0.400 * (100% - 26px)) calc(100% - 3.7px), calc(13px + 0.350 * (100% - 26px)) calc(100% - 2.3px), calc(13px + 0.300 * (100% - 26px)) calc(100% - 3.2px), calc(13px + 0.250 * (100% - 26px)) calc(100% - 0.4px), calc(13px + 0.200 * (100% - 26px)) calc(100% - 1.2px), calc(13px + 0.150 * (100% - 26px)) calc(100% - 3.5px), calc(13px + 0.100 * (100% - 26px)) calc(100% - 0.1px), calc(13px + 0.050 * (100% - 26px)) calc(100% - 2.7px), 13px calc(100% - 1.3px), 7px calc(100% - 2.5px), 3.1px calc(100% - 7.3px), 3.3px calc(100% - 13px), 1.8px calc(13px + 0.833 * (100% - 26px)), 2.8px calc(13px + 0.667 * (100% - 26px)), 2.1px calc(13px + 0.500 * (100% - 26px)), 0.6px calc(13px + 0.333 * (100% - 26px)), 1.4px calc(13px + 0.167 * (100% - 26px)));
  --torn-a: polygon(1.6px 12px, 2.2px 6.4px, 7.6px 4.3px, 12px 0.3px, calc(12px + 0.045 * (100% - 24px)) 2.2px, calc(12px + 0.091 * (100% - 24px)) 10px, calc(12px + 0.136 * (100% - 24px)) 9.7px, calc(12px + 0.182 * (100% - 24px)) 8.4px, calc(12px + 0.227 * (100% - 24px)) 5px, calc(12px + 0.273 * (100% - 24px)) 1.3px, calc(12px + 0.318 * (100% - 24px)) 5.7px, calc(12px + 0.364 * (100% - 24px)) 2.4px, calc(12px + 0.409 * (100% - 24px)) 0.3px, calc(12px + 0.455 * (100% - 24px)) 1.7px, calc(12px + 0.500 * (100% - 24px)) 0.7px, calc(12px + 0.545 * (100% - 24px)) 4.9px, calc(12px + 0.591 * (100% - 24px)) 3.5px, calc(12px + 0.636 * (100% - 24px)) 2.2px, calc(12px + 0.682 * (100% - 24px)) 0.4px, calc(12px + 0.727 * (100% - 24px)) 8.8px, calc(12px + 0.773 * (100% - 24px)) 2.6px, calc(12px + 0.818 * (100% - 24px)) 3.5px, calc(12px + 0.864 * (100% - 24px)) 1.8px, calc(12px + 0.909 * (100% - 24px)) 4.2px, calc(12px + 0.955 * (100% - 24px)) 3.4px, calc(100% - 12px) 2.5px, calc(100% - 8.1px) 5.2px, calc(100% - 4.6px) 7.8px, calc(100% - 1.4px) 12px, calc(100% - 0.7px) calc(12px + 0.045 * (100% - 24px)), calc(100% - 4.5px) calc(12px + 0.091 * (100% - 24px)), calc(100% - 2.9px) calc(12px + 0.136 * (100% - 24px)), calc(100% - 10.7px) calc(12px + 0.182 * (100% - 24px)), calc(100% - 3.4px) calc(12px + 0.227 * (100% - 24px)), calc(100% - 1.9px) calc(12px + 0.273 * (100% - 24px)), calc(100% - 3.6px) calc(12px + 0.318 * (100% - 24px)), calc(100% - 2.7px) calc(12px + 0.364 * (100% - 24px)), calc(100% - 5.7px) calc(12px + 0.409 * (100% - 24px)), calc(100% - 4px) calc(12px + 0.455 * (100% - 24px)), calc(100% - 10.8px) calc(12px + 0.500 * (100% - 24px)), calc(100% - 6px) calc(12px + 0.545 * (100% - 24px)), calc(100% - 1.7px) calc(12px + 0.591 * (100% - 24px)), calc(100% - 4px) calc(12px + 0.636 * (100% - 24px)), calc(100% - 9.8px) calc(12px + 0.682 * (100% - 24px)), calc(100% - 0.7px) calc(12px + 0.727 * (100% - 24px)), calc(100% - 11.1px) calc(12px + 0.773 * (100% - 24px)), calc(100% - 1.5px) calc(12px + 0.818 * (100% - 24px)), calc(100% - 5.2px) calc(12px + 0.864 * (100% - 24px)), calc(100% - 9.8px) calc(12px + 0.909 * (100% - 24px)), calc(100% - 5.3px) calc(12px + 0.955 * (100% - 24px)), calc(100% - 3.9px) calc(100% - 12px), calc(100% - 5.2px) calc(100% - 8.1px), calc(100% - 6.7px) calc(100% - 2.8px), calc(100% - 12px) calc(100% - 2px), calc(12px + 0.955 * (100% - 24px)) calc(100% - 5.3px), calc(12px + 0.909 * (100% - 24px)) calc(100% - 0.9px), calc(12px + 0.864 * (100% - 24px)) calc(100% - 1.4px), calc(12px + 0.818 * (100% - 24px)) calc(100% - 2.9px), calc(12px + 0.773 * (100% - 24px)) calc(100% - 1.6px), calc(12px + 0.727 * (100% - 24px)) calc(100% - 9.7px), calc(12px + 0.682 * (100% - 24px)) calc(100% - 3.4px), calc(12px + 0.636 * (100% - 24px)) calc(100% - 4.1px), calc(12px + 0.591 * (100% - 24px)) calc(100% - 3.7px), calc(12px + 0.545 * (100% - 24px)) calc(100% - 0.3px), calc(12px + 0.500 * (100% - 24px)) calc(100% - 4.7px), calc(12px + 0.455 * (100% - 24px)) calc(100% - 4.8px), calc(12px + 0.409 * (100% - 24px)) calc(100% - 2.4px), calc(12px + 0.364 * (100% - 24px)) calc(100% - 3.8px), calc(12px + 0.318 * (100% - 24px)) calc(100% - 8.3px), calc(12px + 0.273 * (100% - 24px)) calc(100% - 1px), calc(12px + 0.227 * (100% - 24px)) calc(100% - 0.3px), calc(12px + 0.182 * (100% - 24px)) calc(100% - 8.6px), calc(12px + 0.136 * (100% - 24px)) calc(100% - 2.2px), calc(12px + 0.091 * (100% - 24px)) calc(100% - 11.5px), calc(12px + 0.045 * (100% - 24px)) calc(100% - 0.9px), 12px calc(100% - 1.2px), 6.8px calc(100% - 3.1px), 3.1px calc(100% - 6.9px), 0.6px calc(100% - 12px), 6px calc(12px + 0.955 * (100% - 24px)), 2.9px calc(12px + 0.909 * (100% - 24px)), 8.4px calc(12px + 0.864 * (100% - 24px)), 1.6px calc(12px + 0.818 * (100% - 24px)), 1px calc(12px + 0.773 * (100% - 24px)), 11.8px calc(12px + 0.727 * (100% - 24px)), 0.9px calc(12px + 0.682 * (100% - 24px)), 0.2px calc(12px + 0.636 * (100% - 24px)), 5.9px calc(12px + 0.591 * (100% - 24px)), 4.2px calc(12px + 0.545 * (100% - 24px)), 2.2px calc(12px + 0.500 * (100% - 24px)), 4.6px calc(12px + 0.455 * (100% - 24px)), 4.7px calc(12px + 0.409 * (100% - 24px)), 1.3px calc(12px + 0.364 * (100% - 24px)), 5.9px calc(12px + 0.318 * (100% - 24px)), 4.8px calc(12px + 0.273 * (100% - 24px)), 4.4px calc(12px + 0.227 * (100% - 24px)), 3.1px calc(12px + 0.182 * (100% - 24px)), 0.2px calc(12px + 0.136 * (100% - 24px)), 9.1px calc(12px + 0.091 * (100% - 24px)), 4.2px calc(12px + 0.045 * (100% - 24px)));
  --torn-b: polygon(1.1px 12px, 5.6px 8.3px, 6.3px 2.1px, 12px 3.4px, calc(12px + 0.045 * (100% - 24px)) 9px, calc(12px + 0.091 * (100% - 24px)) 1.3px, calc(12px + 0.136 * (100% - 24px)) 2.8px, calc(12px + 0.182 * (100% - 24px)) 3px, calc(12px + 0.227 * (100% - 24px)) 5px, calc(12px + 0.273 * (100% - 24px)) 8.9px, calc(12px + 0.318 * (100% - 24px)) 9.1px, calc(12px + 0.364 * (100% - 24px)) 5.4px, calc(12px + 0.409 * (100% - 24px)) 0.7px, calc(12px + 0.455 * (100% - 24px)) 5.9px, calc(12px + 0.500 * (100% - 24px)) 10.5px, calc(12px + 0.545 * (100% - 24px)) 4px, calc(12px + 0.591 * (100% - 24px)) 4.1px, calc(12px + 0.636 * (100% - 24px)) 3.9px, calc(12px + 0.682 * (100% - 24px)) 3.5px, calc(12px + 0.727 * (100% - 24px)) 0.4px, calc(12px + 0.773 * (100% - 24px)) 2.9px, calc(12px + 0.818 * (100% - 24px)) 5.7px, calc(12px + 0.864 * (100% - 24px)) 4.4px, calc(12px + 0.909 * (100% - 24px)) 1.7px, calc(12px + 0.955 * (100% - 24px)) 5.3px, calc(100% - 12px) 0.6px, calc(100% - 7.8px) 4.8px, calc(100% - 2px) 6.2px, calc(100% - 3.3px) 12px, calc(100% - 5.7px) calc(12px + 0.045 * (100% - 24px)), calc(100% - 3px) calc(12px + 0.091 * (100% - 24px)), calc(100% - 0.9px) calc(12px + 0.136 * (100% - 24px)), calc(100% - 3.1px) calc(12px + 0.182 * (100% - 24px)), calc(100% - 11.6px) calc(12px + 0.227 * (100% - 24px)), calc(100% - 4.2px) calc(12px + 0.273 * (100% - 24px)), calc(100% - 1.5px) calc(12px + 0.318 * (100% - 24px)), calc(100% - 9.4px) calc(12px + 0.364 * (100% - 24px)), calc(100% - 2.5px) calc(12px + 0.409 * (100% - 24px)), calc(100% - 5px) calc(12px + 0.455 * (100% - 24px)), calc(100% - 1.1px) calc(12px + 0.500 * (100% - 24px)), calc(100% - 1px) calc(12px + 0.545 * (100% - 24px)), calc(100% - 5.8px) calc(12px + 0.591 * (100% - 24px)), calc(100% - 4.6px) calc(12px + 0.636 * (100% - 24px)), calc(100% - 0.1px) calc(12px + 0.682 * (100% - 24px)), calc(100% - 2.1px) calc(12px + 0.727 * (100% - 24px)), calc(100% - 2.6px) calc(12px + 0.773 * (100% - 24px)), calc(100% - 2.5px) calc(12px + 0.818 * (100% - 24px)), calc(100% - 2.5px) calc(12px + 0.864 * (100% - 24px)), calc(100% - 1.7px) calc(12px + 0.909 * (100% - 24px)), calc(100% - 8.3px) calc(12px + 0.955 * (100% - 24px)), calc(100% - 0.5px) calc(100% - 12px), calc(100% - 3.8px) calc(100% - 7.3px), calc(100% - 6.9px) calc(100% - 3.1px), calc(100% - 12px) calc(100% - 3.9px), calc(12px + 0.955 * (100% - 24px)) calc(100% - 4.2px), calc(12px + 0.909 * (100% - 24px)) calc(100% - 0.4px), calc(12px + 0.864 * (100% - 24px)) calc(100% - 8.6px), calc(12px + 0.818 * (100% - 24px)) calc(100% - 3.4px), calc(12px + 0.773 * (100% - 24px)) calc(100% - 2.1px), calc(12px + 0.727 * (100% - 24px)) calc(100% - 0px), calc(12px + 0.682 * (100% - 24px)) calc(100% - 1.3px), calc(12px + 0.636 * (100% - 24px)) calc(100% - 0.2px), calc(12px + 0.591 * (100% - 24px)) calc(100% - 4.6px), calc(12px + 0.545 * (100% - 24px)) calc(100% - 3.5px), calc(12px + 0.500 * (100% - 24px)) calc(100% - 5.8px), calc(12px + 0.455 * (100% - 24px)) calc(100% - 0.5px), calc(12px + 0.409 * (100% - 24px)) calc(100% - 3px), calc(12px + 0.364 * (100% - 24px)) calc(100% - 0.9px), calc(12px + 0.318 * (100% - 24px)) calc(100% - 3.5px), calc(12px + 0.273 * (100% - 24px)) calc(100% - 0.8px), calc(12px + 0.227 * (100% - 24px)) calc(100% - 4.4px), calc(12px + 0.182 * (100% - 24px)) calc(100% - 2.8px), calc(12px + 0.136 * (100% - 24px)) calc(100% - 2.2px), calc(12px + 0.091 * (100% - 24px)) calc(100% - 1.2px), calc(12px + 0.045 * (100% - 24px)) calc(100% - 0.6px), 12px calc(100% - 3.5px), 7.7px calc(100% - 4.6px), 4.1px calc(100% - 7.5px), 0.1px calc(100% - 12px), 2.6px calc(12px + 0.955 * (100% - 24px)), 11.9px calc(12px + 0.909 * (100% - 24px)), 3px calc(12px + 0.864 * (100% - 24px)), 1.2px calc(12px + 0.818 * (100% - 24px)), 3.2px calc(12px + 0.773 * (100% - 24px)), 3.9px calc(12px + 0.727 * (100% - 24px)), 10.5px calc(12px + 0.682 * (100% - 24px)), 4.5px calc(12px + 0.636 * (100% - 24px)), 5.9px calc(12px + 0.591 * (100% - 24px)), 1.8px calc(12px + 0.545 * (100% - 24px)), 5.9px calc(12px + 0.500 * (100% - 24px)), 5.6px calc(12px + 0.455 * (100% - 24px)), 3.1px calc(12px + 0.409 * (100% - 24px)), 5.7px calc(12px + 0.364 * (100% - 24px)), 1.8px calc(12px + 0.318 * (100% - 24px)), 1.2px calc(12px + 0.273 * (100% - 24px)), 5.8px calc(12px + 0.227 * (100% - 24px)), 1.9px calc(12px + 0.182 * (100% - 24px)), 3.7px calc(12px + 0.136 * (100% - 24px)), 4.1px calc(12px + 0.091 * (100% - 24px)), 4.4px calc(12px + 0.045 * (100% - 24px)));
  --torn-c: polygon(2.2px 12px, 3.2px 6.9px, 6.3px 2.2px, 12px 4.2px, calc(12px + 0.045 * (100% - 24px)) 10px, calc(12px + 0.091 * (100% - 24px)) 0.5px, calc(12px + 0.136 * (100% - 24px)) 3.7px, calc(12px + 0.182 * (100% - 24px)) 9.5px, calc(12px + 0.227 * (100% - 24px)) 2.7px, calc(12px + 0.273 * (100% - 24px)) 0.9px, calc(12px + 0.318 * (100% - 24px)) 0.7px, calc(12px + 0.364 * (100% - 24px)) 5.5px, calc(12px + 0.409 * (100% - 24px)) 4.6px, calc(12px + 0.455 * (100% - 24px)) 4.5px, calc(12px + 0.500 * (100% - 24px)) 1.7px, calc(12px + 0.545 * (100% - 24px)) 4.4px, calc(12px + 0.591 * (100% - 24px)) 0.5px, calc(12px + 0.636 * (100% - 24px)) 1.3px, calc(12px + 0.682 * (100% - 24px)) 4.9px, calc(12px + 0.727 * (100% - 24px)) 5.3px, calc(12px + 0.773 * (100% - 24px)) 0.3px, calc(12px + 0.818 * (100% - 24px)) 3px, calc(12px + 0.864 * (100% - 24px)) 9.7px, calc(12px + 0.909 * (100% - 24px)) 0.7px, calc(12px + 0.955 * (100% - 24px)) 0.7px, calc(100% - 12px) 2.8px, calc(100% - 8.1px) 5.3px, calc(100% - 2.5px) 6.5px, calc(100% - 0px) 12px, calc(100% - 10.2px) calc(12px + 0.045 * (100% - 24px)), calc(100% - 8.3px) calc(12px + 0.091 * (100% - 24px)), calc(100% - 5.5px) calc(12px + 0.136 * (100% - 24px)), calc(100% - 2.4px) calc(12px + 0.182 * (100% - 24px)), calc(100% - 0.6px) calc(12px + 0.227 * (100% - 24px)), calc(100% - 1px) calc(12px + 0.273 * (100% - 24px)), calc(100% - 5.7px) calc(12px + 0.318 * (100% - 24px)), calc(100% - 10.2px) calc(12px + 0.364 * (100% - 24px)), calc(100% - 0.9px) calc(12px + 0.409 * (100% - 24px)), calc(100% - 6px) calc(12px + 0.455 * (100% - 24px)), calc(100% - 0.7px) calc(12px + 0.500 * (100% - 24px)), calc(100% - 5.7px) calc(12px + 0.545 * (100% - 24px)), calc(100% - 3.7px) calc(12px + 0.591 * (100% - 24px)), calc(100% - 9.5px) calc(12px + 0.636 * (100% - 24px)), calc(100% - 3.5px) calc(12px + 0.682 * (100% - 24px)), calc(100% - 0.5px) calc(12px + 0.727 * (100% - 24px)), calc(100% - 5.2px) calc(12px + 0.773 * (100% - 24px)), calc(100% - 2.7px) calc(12px + 0.818 * (100% - 24px)), calc(100% - 5.9px) calc(12px + 0.864 * (100% - 24px)), calc(100% - 0.1px) calc(12px + 0.909 * (100% - 24px)), calc(100% - 2px) calc(12px + 0.955 * (100% - 24px)), calc(100% - 2.1px) calc(100% - 12px), calc(100% - 2.5px) calc(100% - 6.5px), calc(100% - 7.1px) calc(100% - 3.5px), calc(100% - 12px) calc(100% - 1.6px), calc(12px + 0.955 * (100% - 24px)) calc(100% - 10.5px), calc(12px + 0.909 * (100% - 24px)) calc(100% - 4.7px), calc(12px + 0.864 * (100% - 24px)) calc(100% - 11.1px), calc(12px + 0.818 * (100% - 24px)) calc(100% - 3px), calc(12px + 0.773 * (100% - 24px)) calc(100% - 1.5px), calc(12px + 0.727 * (100% - 24px)) calc(100% - 2.6px), calc(12px + 0.682 * (100% - 24px)) calc(100% - 5.8px), calc(12px + 0.636 * (100% - 24px)) calc(100% - 2.2px), calc(12px + 0.591 * (100% - 24px)) calc(100% - 2.2px), calc(12px + 0.545 * (100% - 24px)) calc(100% - 1px), calc(12px + 0.500 * (100% - 24px)) calc(100% - 1.6px), calc(12px + 0.455 * (100% - 24px)) calc(100% - 11.9px), calc(12px + 0.409 * (100% - 24px)) calc(100% - 5.7px), calc(12px + 0.364 * (100% - 24px)) calc(100% - 3.6px), calc(12px + 0.318 * (100% - 24px)) calc(100% - 8.2px), calc(12px + 0.273 * (100% - 24px)) calc(100% - 2.3px), calc(12px + 0.227 * (100% - 24px)) calc(100% - 5.8px), calc(12px + 0.182 * (100% - 24px)) calc(100% - 0.8px), calc(12px + 0.136 * (100% - 24px)) calc(100% - 0.8px), calc(12px + 0.091 * (100% - 24px)) calc(100% - 10.2px), calc(12px + 0.045 * (100% - 24px)) calc(100% - 0.4px), 12px calc(100% - 2.2px), 7.7px calc(100% - 4.5px), 4.8px calc(100% - 7.8px), 1.8px calc(100% - 12px), 1px calc(12px + 0.955 * (100% - 24px)), 4.6px calc(12px + 0.909 * (100% - 24px)), 3px calc(12px + 0.864 * (100% - 24px)), 8.2px calc(12px + 0.818 * (100% - 24px)), 1px calc(12px + 0.773 * (100% - 24px)), 0.5px calc(12px + 0.727 * (100% - 24px)), 1.3px calc(12px + 0.682 * (100% - 24px)), 8.7px calc(12px + 0.636 * (100% - 24px)), 3.4px calc(12px + 0.591 * (100% - 24px)), 1px calc(12px + 0.545 * (100% - 24px)), 5.7px calc(12px + 0.500 * (100% - 24px)), 5.6px calc(12px + 0.455 * (100% - 24px)), 12px calc(12px + 0.409 * (100% - 24px)), 3.3px calc(12px + 0.364 * (100% - 24px)), 3.2px calc(12px + 0.318 * (100% - 24px)), 0.4px calc(12px + 0.273 * (100% - 24px)), 3.3px calc(12px + 0.227 * (100% - 24px)), 4.3px calc(12px + 0.182 * (100% - 24px)), 0.6px calc(12px + 0.136 * (100% - 24px)), 2.7px calc(12px + 0.091 * (100% - 24px)), 3.8px calc(12px + 0.045 * (100% - 24px)));
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  background: var(--stone-900) url("/img/grain.png");
  color: var(--text);
  font-family: var(--body);
  font-size: 1.0625rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, video, svg { display: block; max-width: 100%; }

a { color: var(--gold-300); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--gold-200); }

:focus-visible { outline: 3px solid var(--gold-300); outline-offset: 3px; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }

.skip {
  position: absolute; left: 12px; top: -100px; z-index: 10;
  padding: 10px 16px;
  background: var(--gold-400); color: #24170a; font-weight: 600; text-decoration: none;
  clip-path: var(--patch-s);
}
.skip:focus { top: 12px; }

.icon { width: 1.25em; height: 1.25em; fill: currentColor; flex: none; }

/* A dark dirt patch. Rough edges come from clip-path, so focus rings sit inside. */
.patch {
  background: var(--patch-dark) url("/img/grain.png");
  clip-path: var(--patch-m);
}
.patch:focus-visible { outline: 2px solid var(--gold-300); outline-offset: -8px; }

/* ---------- Hero with the gameplay clip playing behind it ---------- */

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  align-items: center;
  min-height: clamp(620px, 100svh, 1000px);
  padding: 72px 0 120px;
  background: var(--stone-950) url("/media/gameplay-poster.webp") center / cover no-repeat;
}

.hero__bg { position: absolute; inset: 0; z-index: -1; }
.hero__video { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.hero__bg::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 55% 50% at 50% 46%, rgba(12, 10, 8, 0.45), rgba(12, 10, 8, 0.12) 70%, transparent),
    linear-gradient(to bottom, rgba(12, 10, 8, 0.45) 0%, rgba(12, 10, 8, 0.15) 30%, rgba(12, 10, 8, 0.3) 65%, var(--stone-900) 100%);
}

.hero__content {
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
}

.hero__logo {
  width: auto;
  height: clamp(150px, 36vw, 220px);
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.7)) drop-shadow(0 0 36px rgba(239, 180, 64, 0.25));
}

.hero__title {
  margin: 18px 0 0;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(2.6rem, 11vw, 5.8rem);
  line-height: 0.95;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--gold-400);
  background: linear-gradient(180deg, var(--gold-200) 8%, var(--gold-400) 55%, var(--gold-500) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 3px 0 rgba(30, 18, 6, 0.95)) drop-shadow(0 10px 24px rgba(0, 0, 0, 0.7));
}

.hero__tagline {
  margin: 18px 0 0;
  max-width: 30ch;
  font-size: clamp(1.15rem, 3.6vw, 1.45rem);
  line-height: 1.45;
  color: var(--text);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9), 0 1px 2px rgba(0, 0, 0, 0.9);
}

.badge {
  display: inline-flex; align-items: center;
  margin: 24px 0 0;
  padding: 9px 22px 8px;
  clip-path: var(--patch-s);
  font-family: var(--display);
  font-size: 1rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold-200);
}
.hero__foot {
  position: absolute; left: 0; right: 0; bottom: 40px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; max-width: var(--wrap); margin: 0 auto;
  padding: 0 var(--gutter);
}
.hero__foot p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--muted);
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.9);
}
.hero__toggle {
  display: grid; place-items: center;
  width: 46px; height: 46px; padding: 0;
  border: 0;
  clip-path: var(--patch-s);
  color: var(--gold-300);
  cursor: pointer;
}
.hero__toggle[hidden] { display: none; }
.hero__toggle:hover { background-color: var(--patch-lit); }
.hero__toggle .icon--play { display: none; }
.hero__toggle.is-paused .icon--play { display: block; }
.hero__toggle.is-paused .icon--pause { display: none; }

/* ---------- Buttons ---------- */

.actions {
  display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;
  margin-top: 28px;
  filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.5));
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 54px;
  padding: 0 28px;
  clip-path: var(--patch-m);
  font-family: var(--display);
  font-size: 1.1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform 0.15s ease, filter 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 2px solid currentColor; outline-offset: -8px; }

.btn--gold {
  color: #2a1906;
  background:
    url("/img/grain.png"),
    linear-gradient(180deg, var(--gold-300) 0%, var(--gold-400) 55%, var(--gold-500) 100%);
}
.btn--gold:hover { color: #2a1906; filter: brightness(1.08); }

.btn--dirt {
  clip-path: var(--patch-m2);
  color: var(--gold-300);
  background: var(--patch-dark) url("/img/grain.png");
}
.btn--dirt:hover { color: var(--gold-200); background-color: var(--patch-lit); }

/* ---------- Sections ---------- */

.section { position: relative; padding: clamp(56px, 9vw, 104px) 0; }

/* Panels get a torn soil edge top and bottom, like the in-game UI. */
.section--panel { background: var(--stone-800) url("/img/grain.png"); }
.section--panel::before,
.section--panel::after {
  content: "";
  position: absolute; left: 0; right: 0;
  height: 22px;
  background: var(--stone-800) url("/img/grain.png");
  -webkit-mask: url("/img/torn.svg") 0 0 / 1200px 100% repeat-x;
  mask: url("/img/torn.svg") 0 0 / 1200px 100% repeat-x;
  pointer-events: none;
}
.section--panel::before { bottom: calc(100% - 1px); }
.section--panel::after { top: calc(100% - 1px); transform: scaleY(-1); -webkit-mask-position: 470px 0; mask-position: 470px 0; }

.kicker {
  margin: 0 0 20px;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(1.5rem, 4.5vw, 2rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold-400);
}

/* About */

.about { display: grid; gap: 36px; }
.about__text p { margin: 0 0 16px; max-width: 60ch; color: var(--text); }
.about__text .lead { font-size: clamp(1.2rem, 3.4vw, 1.45rem); line-height: 1.5; }
.about__text p:last-child { margin-bottom: 0; }

.facts {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.35));
}
.facts li {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  padding: 20px 8px 18px;
  background: var(--patch-dark) url("/img/grain.png");
  clip-path: var(--patch-l);
  text-align: center;
}
.facts li:nth-child(2) { clip-path: var(--patch-l2); }
.facts li:nth-child(3) { clip-path: var(--patch-l3); }
.facts strong {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(1.6rem, 6vw, 2.4rem);
  line-height: 1;
  color: var(--gold-300);
}
.facts span { margin-top: 8px; font-size: 0.88rem; line-height: 1.3; color: var(--muted); }

/* Screenshots */

.shots {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
.shots__item { aspect-ratio: 9 / 10; }
.shots__item--big { grid-column: span 2; }
.shots a {
  display: block; height: 100%;
  filter: drop-shadow(0 10px 14px rgba(0, 0, 0, 0.5));
  transition: filter 0.2s ease;
}
.shots a:hover { filter: drop-shadow(0 0 1px var(--gold-300)) drop-shadow(0 0 10px rgba(239, 180, 64, 0.45)); }
.shots img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  clip-path: var(--torn-a);
}
.shots__item:nth-child(3n + 2) img { clip-path: var(--torn-b); }
.shots__item:nth-child(3n + 3) img { clip-path: var(--torn-c); }

/* Follow */

.follow { text-align: center; }
.follow__title {
  margin: 0;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(2.2rem, 8vw, 3.4rem);
  line-height: 1;
  text-transform: uppercase;
  color: var(--gold-400);
}
.follow > p { margin: 16px auto 0; max-width: 46ch; color: var(--text); }
.follow .btn { text-transform: none; letter-spacing: 0.02em; }
.follow .follow__mail { margin-top: 28px; color: var(--muted); }
.follow__mail a { font-weight: 600; word-break: break-word; }

/* Footer */

.footer {
  padding: 48px 0 40px;
  background: var(--stone-950);
  color: var(--muted);
  font-size: 0.92rem;
}
.footer__row {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  text-align: center;
}
.footer p { margin: 0; }
.footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; }
.footer a { color: var(--text); text-decoration: none; padding: 6px 0; }
.footer a:hover { color: var(--gold-300); text-decoration: underline; }

/* Screenshot viewer */

.viewer {
  width: 100%; height: 100%;
  max-width: none; max-height: none;
  margin: 0; padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
}
.viewer[open] { display: grid; place-items: center; }
.viewer::backdrop { background: rgba(10, 9, 8, 0.94); }
.viewer__img {
  max-width: min(94vw, 1080px);
  max-height: calc(100dvh - 140px);
  width: auto; height: auto;
  clip-path: var(--torn-a);
}
.viewer__btn {
  position: fixed;
  display: grid; place-items: center;
  width: 50px; height: 50px; padding: 0;
  border: 0;
  background: var(--stone-800) url("/img/grain.png");
  clip-path: var(--patch-s);
  color: var(--gold-300);
  cursor: pointer;
}
.viewer__btn:hover { background-color: var(--patch-lit); }
.viewer__btn:focus-visible { outline: 2px solid var(--gold-300); outline-offset: -7px; }
.viewer__close { top: 16px; right: 16px; }
.viewer__prev, .viewer__next { bottom: 20px; }
.viewer__prev { left: calc(50% - 62px); }
.viewer__next { right: calc(50% - 62px); }

/* ---------- Simple pages (privacy, 404) ---------- */

.page-top {
  padding: 22px 0;
  background: linear-gradient(to bottom, rgba(22, 20, 18, 0) 40%, var(--stone-900)), url("/img/stone.svg") center / cover no-repeat;
}
.brand {
  display: inline-flex; align-items: center; gap: 12px;
  color: var(--gold-400);
  font-family: var(--display);
  font-size: 1.35rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
}
.brand img { width: auto; height: 44px; }
.brand:hover { color: var(--gold-300); }

.doc { padding: clamp(32px, 6vw, 64px) 0 clamp(56px, 9vw, 96px); }
.doc .wrap { max-width: 760px; }
.doc h1 {
  margin: 0;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(2.2rem, 8vw, 3.2rem);
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--gold-400);
}
.doc .updated { margin: 10px 0 32px; color: var(--muted); font-size: 0.95rem; }
.doc h2 {
  margin: 36px 0 8px;
  font-family: var(--display);
  font-weight: 400;
  font-size: 1.35rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gold-300);
}
.doc p, .doc li { color: var(--text); }
.doc p { margin: 0 0 14px; }
.doc ul { margin: 0 0 14px; padding-left: 1.2em; }
.doc li { margin-bottom: 6px; }
.doc li::marker { color: var(--gold-400); }
.summary {
  padding: 22px 26px;
  background: var(--patch-dark) url("/img/grain.png");
  clip-path: var(--patch-l);
}
.summary p:last-child { margin-bottom: 0; }

.lost { min-height: 70vh; display: grid; place-items: center; text-align: center; padding: 64px 0; }
.lost p { color: var(--muted); margin: 14px auto 28px; max-width: 36ch; }

/* ---------- Larger screens ---------- */

@media (min-width: 900px) {
  .about { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; gap: 64px; }
  .facts { grid-template-columns: 1fr; gap: 12px; }
  .facts li { flex-direction: row; align-items: center; gap: 18px; padding: 20px 24px; text-align: left; }
  .facts strong { flex: 0 0 2.7em; text-align: center; }
  .facts span { margin-top: 0; font-size: 1rem; }

  .shots { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .shots__item--big { grid-row: span 2; aspect-ratio: auto; }

  .footer__row { flex-direction: row; justify-content: space-between; text-align: left; }

  .viewer__prev, .viewer__next { bottom: auto; top: calc(50% - 25px); }
  .viewer__prev { left: 24px; }
  .viewer__next { right: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .btn:hover, .btn:active { transform: none; }
}