@font-face{font-family:'Staatliches';src:url('../fonts/staatliches.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Archivo';src:url('../fonts/archivo.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap;}
@font-face{font-family:'JetBrains Mono';src:url('../fonts/jbmono.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap;}

:root{
  --ink:#0b0a09;
  --ink-2:#161210;
  --ink-3:#201a17;
  --ash:#dcd8d0;
  --ash-dim:#948d84;
  --blood:#7a2015;
  --blood-line:#4a1410;
  --ember:#eb6638;
  --ember-soft:rgba(235,102,56,0.14);
  --shadow:rgba(0,0,0,0.45);
}
/* Deliberately single-theme: this is a DayZ HUD/menu look, not a document that should
   flip to a light background just because the OS or browser prefers it. */

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--ink);
  color:var(--ash);
  font-family:'Archivo',system-ui,sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--ember);color:#0b0a09;}
a{color:var(--ember);}
:focus-visible{outline:2px solid var(--ember);outline-offset:2px;}

/* ---------- CUSTOM CURSOR ---------- */
body{
  cursor:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"%3E%3Ccircle cx="12" cy="12" r="7" fill="none" stroke="%23eb6638" stroke-width="1.4"/%3E%3Cline x1="12" y1="0" x2="12" y2="4" stroke="%23eb6638" stroke-width="1.4"/%3E%3Cline x1="12" y1="20" x2="12" y2="24" stroke="%23eb6638" stroke-width="1.4"/%3E%3Cline x1="0" y1="12" x2="4" y2="12" stroke="%23eb6638" stroke-width="1.4"/%3E%3Cline x1="20" y1="12" x2="24" y2="12" stroke="%23eb6638" stroke-width="1.4"/%3E%3Ccircle cx="12" cy="12" r="1" fill="%23eb6638"/%3E%3C/svg%3E') 12 12, crosshair;
}
a,button,.tab-btn,.copy-btn,summary{
  cursor:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28"%3E%3Ccircle cx="14" cy="14" r="9" fill="none" stroke="%23eb6638" stroke-width="2"/%3E%3Cline x1="14" y1="0" x2="14" y2="5" stroke="%23eb6638" stroke-width="2"/%3E%3Cline x1="14" y1="23" x2="14" y2="28" stroke="%23eb6638" stroke-width="2"/%3E%3Cline x1="0" y1="14" x2="5" y2="14" stroke="%23eb6638" stroke-width="2"/%3E%3Cline x1="23" y1="14" x2="28" y2="14" stroke="%23eb6638" stroke-width="2"/%3E%3Ccircle cx="14" cy="14" r="2" fill="%23eb6638"/%3E%3C/svg%3E') 14 14, pointer;
}

.eyebrow{
  font-family:'Staatliches',sans-serif;
  letter-spacing:0.22em;
  text-transform:uppercase;
  font-size:0.78rem;
  color:var(--ember);
}
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:5;
  opacity:0.05;mix-blend-mode:overlay;
}
.ash{
  position:fixed;inset:0;pointer-events:none;z-index:2;
  width:100%;height:100%;
}

/* ---------- SITE-WIDE AMBIENT BACKGROUND ---------- */
/* Fixed to the viewport (not the page), so it stays put on scroll and shows through
   everywhere content doesn't cover it. Heavily muted: atmosphere, not a photo. */
.site-bg{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:url('../img/hero.jpg');
  background-size:cover;background-position:center 30%;
  filter:blur(28px) brightness(0.16) saturate(0.5);
  transform:scale(1.1);
}
.site-bg::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at center, transparent 35%, var(--ink) 92%);
}

/* ---------- INTRO ---------- */
#intro{
  position:fixed;inset:0;z-index:9999;
  background:var(--ink);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  transition:opacity 1s ease;
  animation:introPowerOn 0.45s steps(2,end) both;
}
#intro::before{
  /* CRT scanline texture: grit, not a document background */
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,0.4) 0 1px, transparent 1px 3px);
  opacity:0.45;pointer-events:none;
}
#intro::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 45%, var(--ember-soft) 0%, transparent 55%);
  pointer-events:none;
}
#intro.out{opacity:0;pointer-events:none;}
#intro-inner{
  position:relative;z-index:1;text-align:center;padding:1.5rem;
  animation:introRise 1.1s ease forwards;
}
#intro-logo{
  height:96px;width:auto;margin:0 auto 20px;display:block;
  filter:drop-shadow(0 0 40px var(--ember-soft)) drop-shadow(0 0 90px rgba(235,102,56,0.22));
}
#intro-line{
  width:0;height:1px;margin:18px auto;
  background:linear-gradient(to right,transparent,var(--ember),transparent);
  box-shadow:0 0 10px var(--ember);
  animation:introLine 1s 0.5s ease forwards;
}
#intro-tag{
  font-family:'Staatliches',sans-serif;font-size:0.72rem;letter-spacing:0.45em;
  color:var(--ash-dim);text-transform:uppercase;
  opacity:0;
  animation:introTag 0.9s 0.9s ease forwards;
}
#intro{cursor:pointer;}
#intro-skip{
  margin-top:28px;
  font-family:'JetBrains Mono',monospace;font-size:0.68rem;letter-spacing:0.08em;
  color:var(--ash-dim);opacity:0;
  animation:introTag 0.9s 1.4s ease forwards;
}
@keyframes introPowerOn{0%{opacity:0;}45%{opacity:1;}60%{opacity:0.25;}100%{opacity:1;}}
@keyframes introRise{from{opacity:0;transform:translateY(22px) scale(0.93);}to{opacity:1;transform:translateY(0) scale(1);}}
@keyframes introLine{from{width:0;}to{width:180px;}}
@keyframes introTag{from{opacity:0;letter-spacing:0.65em;}to{opacity:0.8;letter-spacing:0.45em;}}
@media (prefers-reduced-motion: reduce){
  #intro{display:none;}
}

/* ---------- TOPBAR ---------- */
.topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:0.9rem clamp(1rem,4vw,2.5rem);
  background:color-mix(in srgb, var(--ink) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--blood-line);
}
.brand{display:flex;align-items:center;gap:0.7rem;}
.brand img{height:34px;width:auto;display:block;filter:drop-shadow(0 0 6px var(--shadow));}
.brand-text{display:flex;flex-direction:column;line-height:1.1;}
.brand-text .name{font-family:'Staatliches',sans-serif;letter-spacing:0.12em;font-size:1.05rem;}
.brand-text .sub{font-size:0.65rem;letter-spacing:0.18em;color:var(--ash-dim);text-transform:uppercase;}

.wipe-chip{
  display:flex;align-items:center;gap:0.6rem;
  border:1px solid var(--blood-line);
  background:var(--ember-soft);
  padding:0.4rem 0.8rem;
  border-radius:2px;
}
.wipe-chip .lab{font-size:0.62rem;letter-spacing:0.14em;color:var(--ash-dim);text-transform:uppercase;}
.wipe-chip .val{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums;font-weight:700;color:var(--ember);font-size:0.95rem;}
.wipe-chip .val.status-closed{color:var(--ash-dim);}
.wipe-chip.is-open{
  border-color:var(--ember);
  animation:chip-pulse 2.4s ease-in-out infinite;
}
@keyframes chip-pulse{
  0%{box-shadow:0 0 0 0 rgba(235,102,56,0.35);}
  70%{box-shadow:0 0 0 8px rgba(235,102,56,0);}
  100%{box-shadow:0 0 0 0 rgba(235,102,56,0);}
}
@media (prefers-reduced-motion: reduce){
  .wipe-chip.is-open{animation:none;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  padding:clamp(3.5rem,10vw,6.5rem) clamp(1rem,4vw,2.5rem) clamp(2.5rem,6vw,4rem);
  overflow:hidden;
  border-bottom:1px solid var(--blood-line);
}
.hero::before{
  content:"";position:absolute;inset:0;
  background-image:url('../img/hero.jpg');
  background-size:cover;background-position:center 35%;
  filter:blur(1.5px) saturate(0.75) brightness(0.34);
  transform:scale(1.04);
  z-index:0;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,0.22) 0 1px, transparent 1px 4px),
    linear-gradient(180deg, color-mix(in srgb, var(--ink) 55%, transparent) 0%, var(--ink) 92%);
  z-index:1;
}
.hero-inner{position:relative;z-index:2;max-width:56rem;}
.hero h1{
  font-family:'Staatliches',sans-serif;
  font-weight:400;
  text-transform:uppercase;
  font-size:clamp(2.6rem,7vw,5rem);
  line-height:0.98;
  letter-spacing:0.01em;
  margin:0.6rem 0 1rem;
  text-wrap:balance;
  color:var(--ash);
  text-shadow:0 6px 30px var(--shadow);
}
.hero h1 em{font-style:normal;color:var(--ember);}
.hero p.lead{
  font-size:clamp(1rem,2vw,1.15rem);
  color:var(--ash-dim);
  max-width:38rem;
  line-height:1.6;
  margin:0 0 1.6rem;
}
.meta-chips{display:flex;flex-wrap:wrap;gap:0.5rem;}
.meta-chips span{
  font-family:'JetBrains Mono',monospace;
  font-size:0.7rem;letter-spacing:0.06em;
  border:1px solid var(--blood-line);
  padding:0.3rem 0.65rem;
  color:var(--ash-dim);
  border-radius:2px;
}
.hero-cta{display:flex;flex-wrap:wrap;gap:0.8rem;margin-top:1.8rem;}
.btn{
  font-family:'Staatliches',sans-serif;letter-spacing:0.12em;text-transform:uppercase;
  font-size:0.95rem;padding:0.7rem 1.7rem;text-decoration:none;border-radius:2px;
  transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.btn-primary{
  background:var(--ember);color:var(--ink);border:1px solid var(--ember);
  box-shadow:0 0 24px var(--ember-soft);
}
.btn-primary:hover{background:transparent;color:var(--ember);}
.btn-ghost{color:var(--ash);border:1px solid var(--blood-line);}
.btn-ghost:hover{color:var(--ember);border-color:var(--ember);}

/* ---------- SERVER AT A GLANCE ---------- */
.glance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0.8rem;}
.glance-item{border:1px solid var(--blood-line);background:var(--ink-2);padding:1rem 1.1rem;}
.glance-item .g-lab{
  display:block;margin-bottom:0.4rem;
  font-family:'Staatliches',sans-serif;font-size:0.66rem;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--ash-dim);
}
.glance-item .g-val{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:0.95rem;color:var(--ash);
}

/* ---------- RAID WIDGET ---------- */
.raid-status-row{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:flex-end;}
.raid-lab{
  display:block;margin-bottom:0.5rem;
  font-family:'Staatliches',sans-serif;font-size:0.68rem;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--ash-dim);
}
.raid-state-val{
  font-family:'Staatliches',sans-serif;font-size:clamp(2rem,5vw,3rem);line-height:1;
  color:var(--ash-dim);
}
.raid-state-val.is-open{color:var(--ember);text-shadow:0 0 24px var(--ember-soft);}
.raid-next-val{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-variant-numeric:tabular-nums;
  font-size:clamp(1.2rem,3vw,1.8rem);color:var(--ash);line-height:1.2;
}
.raid-week{
  display:grid;grid-template-columns:repeat(7,1fr);gap:0.4rem;margin-top:1.4rem;
}
.raid-day{
  position:relative;border:1px solid var(--blood-line);padding:0.6rem 0.25rem;text-align:center;
  font-family:'JetBrains Mono',monospace;font-size:0.72rem;letter-spacing:0.04em;color:var(--ash-dim);
}
.raid-day span{display:block;margin-top:0.25rem;font-size:0.55rem;opacity:0.85;}
.raid-day.raid-full{background:var(--ember-soft);border-color:var(--ember);color:var(--ember);}
.raid-day.raid-partial{
  background:linear-gradient(90deg, transparent 0 55%, var(--ember-soft) 55%);
  border-color:var(--ember);color:var(--ember);
}
.raid-day.is-today::after{
  content:"";position:absolute;top:4px;right:4px;width:5px;height:5px;
  background:var(--ash);transform:rotate(45deg);
}
@media (max-width:560px){
  .raid-week{grid-template-columns:repeat(4,1fr);}
}

/* ---------- SECTION HEADER ---------- */
.section{padding:clamp(2.5rem,6vw,4rem) clamp(1rem,4vw,2.5rem);}
.sh{margin-bottom:1.8rem;}
.sh .tag{display:flex;align-items:center;gap:0.6rem;margin-bottom:0.5rem;}
.sh .tag .dot{width:7px;height:7px;background:var(--ember);transform:rotate(45deg);flex:none;}
.sh h2{
  font-family:'Staatliches',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(1.6rem,3.5vw,2.3rem);letter-spacing:0.02em;margin:0;
}

/* ---------- COUNTDOWN ---------- */
.countdown-wrap{
  border:1px solid var(--blood-line);
  background:var(--ink-2);
  padding:clamp(1.5rem,4vw,2.5rem);
  position:relative;
}
.countdown-wrap::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:repeating-linear-gradient(-45deg,var(--ember) 0 6px, transparent 6px 12px);
  opacity:0.7;
}
.countdown{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(0.75rem,2vw,1.5rem);
  text-align:center;
}
.countdown .unit{padding:0.5rem 0;}
.countdown .num{
  font-family:'JetBrains Mono',monospace;font-weight:700;
  font-variant-numeric:tabular-nums;
  font-size:clamp(2rem,6vw,3.4rem);
  color:var(--ember);
  line-height:1;
  text-shadow:0 0 24px var(--ember-soft);
}
.countdown .lab{
  margin-top:0.4rem;font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--ash-dim);
}
.countdown-target{margin-top:1.2rem;font-size:0.78rem;color:var(--ash-dim);font-family:'JetBrains Mono',monospace;}
.countdown-target b{color:var(--ash);font-weight:700;}

.server-clock{
  font-family:'JetBrains Mono',monospace;font-size:0.75rem;color:var(--ash-dim);
  margin-bottom:1rem;letter-spacing:0.02em;
}
.server-clock span{color:var(--ash);font-weight:700;font-variant-numeric:tabular-nums;}

.countdown-wrap--mini{
  margin-top:1rem;padding:1rem clamp(1.2rem,3vw,1.8rem);
}
.countdown-wrap--mini .mini-label{display:block;margin-bottom:0.7rem;}
.countdown--mini{grid-template-columns:repeat(3,1fr);}
.countdown--mini .num{font-size:clamp(1.3rem,3.5vw,1.9rem);text-shadow:none;}

/* ---------- LEADERBOARD ---------- */
.board-tools{display:flex;justify-content:flex-end;margin-bottom:0.8rem;}
.board-tools input{
  background:var(--ink-2);border:1px solid var(--blood-line);color:var(--ash);
  font-family:'JetBrains Mono',monospace;font-size:0.8rem;
  padding:0.55rem 0.8rem;width:min(280px,100%);border-radius:2px;
}
.board-tools input::placeholder{color:var(--ash-dim);}
.board-tools input:focus{outline:none;border-color:var(--ember);}
.board{border:1px solid var(--blood-line);background:var(--ink-2);overflow-x:auto;}
table{width:100%;border-collapse:collapse;min-width:640px;}
thead th{
  text-align:left;font-family:'Staatliches',sans-serif;font-weight:400;letter-spacing:0.1em;
  text-transform:uppercase;font-size:0.72rem;color:var(--ash-dim);
  padding:0.9rem 1rem;border-bottom:1px solid var(--blood-line);
  white-space:nowrap;
}
thead th[data-sort]{cursor:pointer;user-select:none;transition:color 0.15s ease;}
thead th[data-sort]:hover{color:var(--ash);}
thead th[data-sort]::after{content:" ↕";opacity:0.35;}
thead th[data-sort].sort-desc::after{content:" ▼";opacity:1;color:var(--ember);}
thead th[data-sort].sort-asc::after{content:" ▲";opacity:1;color:var(--ember);}
thead th.num,tbody td.num{text-align:right;}
tbody td{
  padding:0.85rem 1rem;font-family:'JetBrains Mono',monospace;font-size:0.88rem;
  border-bottom:1px solid color-mix(in srgb, var(--blood-line) 45%, transparent);
  font-variant-numeric:tabular-nums;
}
tbody tr{transition:background 0.15s ease;opacity:0;transform:translateY(6px);animation:rise 0.5s ease forwards;}
tbody tr:hover{background:var(--ember-soft);}
tbody tr:last-child td{border-bottom:none;}
@keyframes rise{to{opacity:1;transform:translateY(0);}}
td.rank{font-family:'Staatliches',sans-serif;font-size:1rem;letter-spacing:0.04em;color:var(--ember);width:3rem;}
td.player{font-family:'Archivo',sans-serif;font-weight:700;color:var(--ash);letter-spacing:0.01em;}
.kd-good{color:var(--ember);}
.kd-flat{color:var(--ash-dim);}
tr.rank-1 td{border-bottom-color:color-mix(in srgb, #f5c85c 25%, transparent);}
tr.rank-1 td.rank{color:#f5c85c;font-size:1.2rem;text-shadow:0 0 14px rgba(245,200,92,0.4);}
tr.rank-2 td.rank{color:#c9c4bb;font-size:1.1rem;}
tr.rank-3 td.rank{color:#c98a5a;font-size:1.05rem;}
tr.rank-1{background:color-mix(in srgb, #f5c85c 4%, transparent);}

.board-note{
  margin-top:0.9rem;font-size:0.78rem;color:var(--ash-dim);
  border-left:2px solid var(--blood-line);padding-left:0.8rem;
}

/* ---------- FOOTER ---------- */
footer{
  padding:2rem clamp(1rem,4vw,2.5rem) 3rem;
  border-top:1px solid var(--blood-line);
  display:flex;flex-wrap:wrap;gap:0.5rem 1.5rem;justify-content:space-between;align-items:center;
}
footer .fmeta{font-size:0.72rem;color:var(--ash-dim);font-family:'JetBrains Mono',monospace;}
footer .fbrand{font-family:'Staatliches',sans-serif;letter-spacing:0.14em;font-size:0.78rem;color:var(--ash-dim);text-transform:uppercase;}

/* ---------- TAB BAR ---------- */
.tabbar{
  position:sticky;top:0;z-index:19;
  display:flex;gap:0.2rem;overflow-x:auto;
  padding:0 clamp(1rem,4vw,2.5rem);
  background:var(--ink);
  border-bottom:1px solid var(--blood-line);
}
.tabbar::-webkit-scrollbar{height:0;}
.tab-btn{
  appearance:none;border:none;background:transparent;cursor:pointer;
  font-family:'Staatliches',sans-serif;letter-spacing:0.12em;text-transform:uppercase;
  font-size:0.82rem;color:var(--ash-dim);
  padding:0.85rem 1.1rem 0.7rem;
  border-bottom:2px solid transparent;
  white-space:nowrap;
  transition:color 0.15s ease, border-color 0.15s ease;
}
.tab-btn:hover{color:var(--ash);}
.tab-btn.is-active{color:var(--ember);border-bottom-color:var(--ember);}

.tab-panel{display:none;}
.tab-panel.is-active{display:block;animation:panelIn 0.35s ease;}
@keyframes panelIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){
  .tab-panel.is-active{animation:none;}
}

/* ---------- PAGE HEADER (non-hero tabs) ---------- */
.page-header{
  padding:clamp(2.2rem,6vw,3.5rem) clamp(1rem,4vw,2.5rem) 0;
  max-width:56rem;
}
.page-header h1{
  font-family:'Staatliches',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(2rem,5vw,3.2rem);line-height:1;margin:0.5rem 0 0.8rem;
  text-wrap:balance;color:var(--ash);
}
.page-header p.lead{color:var(--ash-dim);line-height:1.6;max-width:38rem;margin:0;}

/* ---------- RULES ---------- */
.rules-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem;
}
.rule-card{
  border:1px solid var(--blood-line);background:var(--ink-2);padding:1.3rem 1.4rem;
}
.rule-card h3{
  font-family:'Staatliches',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:0.06em;
  color:var(--ember);font-size:1.05rem;margin:0 0 0.7rem;
  display:flex;align-items:center;gap:0.5rem;
}
.rule-card h3::before{content:"";width:6px;height:6px;background:var(--ember);transform:rotate(45deg);flex:none;}
.rule-card ul{margin:0;padding-left:1.1rem;color:var(--ash);}
.rule-card li{margin-bottom:0.45rem;line-height:1.5;font-size:0.92rem;}
.rule-card li:last-child{margin-bottom:0;}
.rules-footnote{
  margin-top:1.5rem;font-family:'Staatliches',sans-serif;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--ash-dim);font-size:0.85rem;text-align:center;
}

/* ---------- MODS / FEATURES ---------- */
.mods-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;
}
.mod-card{border:1px solid var(--blood-line);background:var(--ink-2);padding:1.2rem 1.3rem;}
.mod-card .mtag{
  font-family:'JetBrains Mono',monospace;font-size:0.65rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ember);border:1px solid var(--blood-line);display:inline-block;padding:0.15rem 0.5rem;margin-bottom:0.7rem;
}
.mod-card h3{font-family:'Archivo',sans-serif;font-weight:700;font-size:1rem;margin:0 0 0.5rem;color:var(--ash);}
.mod-card p{margin:0;color:var(--ash-dim);font-size:0.88rem;line-height:1.55;}

/* ---------- CONNECT ---------- */
.connect-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;}
.connect-card{border:1px solid var(--blood-line);background:var(--ink-2);padding:1.3rem 1.4rem;}
.connect-card .lab{
  font-family:'Staatliches',sans-serif;letter-spacing:0.1em;text-transform:uppercase;
  font-size:0.78rem;color:var(--ash-dim);margin-bottom:0.6rem;display:block;
}
.connect-row{display:flex;align-items:center;gap:0.6rem;}
.connect-val{
  font-family:'JetBrains Mono',monospace;font-size:0.9rem;color:var(--ember);
  background:var(--ink-3);border:1px solid var(--blood-line);padding:0.5rem 0.7rem;flex:1;
  overflow-x:auto;white-space:nowrap;
}
.connect-val.placeholder{color:var(--ash-dim);font-style:italic;}
.copy-btn{
  appearance:none;border:1px solid var(--blood-line);background:transparent;color:var(--ash-dim);
  font-family:'JetBrains Mono',monospace;font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;
  padding:0.5rem 0.7rem;cursor:pointer;flex:none;transition:color 0.15s ease, border-color 0.15s ease;
}
.copy-btn:hover{color:var(--ember);border-color:var(--ember);}
.copy-btn.copied{color:var(--ember);border-color:var(--ember);}

/* ---------- CHANGELOG ---------- */
.cl-list{display:flex;flex-direction:column;}
.cl-entry{
  display:grid;grid-template-columns:8rem 1fr;gap:1rem;
  padding:1.1rem 0;border-bottom:1px solid color-mix(in srgb, var(--blood-line) 45%, transparent);
}
.cl-entry:last-child{border-bottom:none;}
.cl-date{font-family:'JetBrains Mono',monospace;font-size:0.78rem;color:var(--ash-dim);white-space:nowrap;}
.cl-body{display:flex;flex-direction:column;gap:0.35rem;}
.cl-tag{
  align-self:flex-start;
  font-family:'JetBrains Mono',monospace;font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;
  padding:0.1rem 0.5rem;border:1px solid var(--blood-line);color:var(--ember);
}
.cl-body p{margin:0;color:var(--ash);font-size:0.92rem;line-height:1.5;}
@media (max-width:560px){
  .cl-entry{grid-template-columns:1fr;gap:0.3rem;}
}

/* ---------- CRAFTING ---------- */
.craft-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;
}
.craft-card{
  border:1px solid var(--blood-line);background:var(--ink-2);overflow:hidden;
  display:flex;flex-direction:column;
}
.craft-card .craft-img{
  width:100%;aspect-ratio:16/10;object-fit:cover;display:block;
  filter:saturate(0.85) brightness(0.92);
  border-bottom:1px solid var(--blood-line);
}
.craft-card .craft-img-placeholder{
  width:100%;aspect-ratio:16/10;
  background:repeating-linear-gradient(-45deg, var(--ink-3) 0 12px, var(--ink-2) 12px 24px);
  border-bottom:1px solid var(--blood-line);
}
.craft-body{padding:1rem 1.2rem;display:flex;flex-direction:column;gap:0.5rem;flex:1;}
.craft-body h3{margin:0;font-family:'Archivo',sans-serif;font-weight:700;font-size:1rem;color:var(--ash);}
.craft-body .craft-desc{margin:0;color:var(--ash-dim);font-size:0.88rem;line-height:1.5;}
.craft-ingredients{
  margin:0.3rem 0 0;padding:0;list-style:none;
  display:flex;flex-wrap:wrap;gap:0.35rem;
}
.craft-ingredients li{
  font-family:'JetBrains Mono',monospace;font-size:0.68rem;letter-spacing:0.03em;
  border:1px solid var(--blood-line);color:var(--ash-dim);padding:0.15rem 0.5rem;
}
code{
  font-family:'JetBrains Mono',monospace;font-size:0.85em;
  background:var(--ink-2);border:1px solid var(--blood-line);padding:0.1rem 0.4rem;
}

/* ---------- FAQ ---------- */
.faq-list{display:flex;flex-direction:column;gap:0.7rem;max-width:44rem;}
.faq-item{
  border:1px solid var(--blood-line);background:var(--ink-2);
  padding:0;overflow:hidden;
}
.faq-item summary{
  list-style:none;cursor:pointer;
  padding:1rem 1.2rem;
  font-family:'Archivo',sans-serif;font-weight:700;color:var(--ash);font-size:0.95rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"+";flex:none;color:var(--ember);font-family:'Staatliches',sans-serif;font-size:1.3rem;
  transition:transform 0.2s ease;
}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item summary:hover{color:var(--ember);}
.faq-a{padding:0 1.2rem 1.1rem;color:var(--ash-dim);font-size:0.9rem;line-height:1.6;}
.faq-a p{margin:0;}

/* ---------- SURVIVOR DOSSIER MODAL ---------- */
#board-body tr.is-clickable{cursor:pointer;}
.pmodal{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  padding:1rem;
}
.pmodal[hidden]{display:none;}
.pmodal-backdrop{
  position:absolute;inset:0;
  background:rgba(5,4,3,0.72);
  backdrop-filter:blur(6px);
}
.pmodal-card{
  position:relative;width:min(30rem,100%);max-height:90vh;overflow-y:auto;
  background:var(--ink-2);border:1px solid var(--blood-line);
  padding:1.8rem 1.9rem 1.7rem;
  box-shadow:0 30px 80px rgba(0,0,0,0.65);
  animation:pmodalIn 0.25s ease;
}
.pmodal-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:repeating-linear-gradient(-45deg,var(--ember) 0 6px, transparent 6px 12px);
  opacity:0.7;
}
@keyframes pmodalIn{from{opacity:0;transform:translateY(14px) scale(0.97);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){
  .pmodal-card{animation:none;}
}
.pmodal-close{
  position:absolute;top:0.7rem;right:0.7rem;
  appearance:none;border:1px solid var(--blood-line);background:transparent;color:var(--ash-dim);
  font-family:'JetBrains Mono',monospace;font-size:1rem;line-height:1;
  width:2rem;height:2rem;cursor:pointer;
  transition:color 0.15s ease, border-color 0.15s ease;
}
.pmodal-close:hover{color:var(--ember);border-color:var(--ember);}
.pmodal-card h2{
  font-family:'Staatliches',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:2rem;line-height:1;letter-spacing:0.03em;color:var(--ash);
  margin:0.35rem 0 0.45rem;
}
.pmodal-group{font-size:0.85rem;color:var(--ash-dim);margin-bottom:1.3rem;}
.pmodal-group b{color:var(--ash);font-weight:700;}
.pm-tag{font-family:'JetBrains Mono',monospace;color:var(--ember);font-size:0.8rem;}
.pmodal-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0.6rem;margin-bottom:1.5rem;
}
.pstat{border:1px solid var(--blood-line);background:var(--ink-3);padding:0.7rem 0.8rem;}
.ps-lab{
  display:block;margin-bottom:0.35rem;
  font-family:'Staatliches',sans-serif;font-size:0.6rem;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ash-dim);
}
.ps-val{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:1.05rem;
  color:var(--ash);font-variant-numeric:tabular-nums;
}
.ph-title{margin-bottom:0.8rem;}
.ph-chart{
  display:flex;align-items:flex-end;gap:0.9rem;
  padding:0.4rem 0.2rem 0;
}
.ph-col{display:flex;flex-direction:column;align-items:center;gap:0.35rem;width:3.4rem;flex:0 0 auto;}
.ph-val{
  font-family:'JetBrains Mono',monospace;font-size:0.72rem;font-weight:700;
  color:var(--ash);font-variant-numeric:tabular-nums;
}
.ph-bar{
  width:22px;background:var(--ember);border-radius:4px 4px 0 0;
  box-shadow:0 0 16px var(--ember-soft);
}
.ph-col.is-current .ph-bar{
  background:color-mix(in srgb, var(--ember) 40%, transparent);
  border:1px dashed var(--ember);border-bottom:none;
  box-shadow:none;
}
.ph-lab{
  width:100%;text-align:center;padding-top:0.35rem;
  border-top:1px solid var(--blood-line);
  font-family:'JetBrains Mono',monospace;font-size:0.6rem;letter-spacing:0.04em;
  color:var(--ash-dim);text-transform:uppercase;white-space:nowrap;
}
.ph-note{margin:0.4rem 0 0;font-size:0.8rem;color:var(--ash-dim);line-height:1.5;}
@media (max-width:480px){
  .pmodal-stats{grid-template-columns:repeat(2,1fr);}
}

/* ---------- SCROLL REVEAL ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity 0.6s ease, transform 0.6s ease;}
.reveal.is-visible{opacity:1;transform:translateY(0);}

@media (prefers-reduced-motion: reduce){
  tbody tr{animation:none;opacity:1;transform:none;}
  .reveal{opacity:1;transform:none;transition:none;}
}
@media (max-width:640px){
  .countdown{grid-template-columns:repeat(2,1fr);}
  .topbar{flex-wrap:wrap;gap:0.6rem;}
}
