/* Оправа юридичних сторінок: privacy / terms / delete-account.

   Свій файл, а не ui/theme.css: там усе ведене від dvh і зверстане під один екран без
   скролу, а тут навпаки — довгий документ, який читають з прокруткою й друкують. Спільними
   лишаються тільки палітра й пара шрифтів, тож вони й продубльовані тут дослівно.

   Мова цих сторінок — англійська й лише вона: їх читають рецензенти сторів. */

:root {
  --wood-deep: #0d0906;
  --panel-top: #2b1e15;
  --panel-bottom: #1b120d;
  --edge: #4a3423;
  --edge-dim: #2c1f14;
  --brass: #c9973f;
  --brass-lit: #f2cb84;
  --ink: #f1e4d0;
  --ink-muted: #a3907a;
  --ink-dim: #6b5a45;
  --blood-lit: #f0a493;

  --font-display: "Philosopher", "Iowan Old Style", Georgia, serif;
  --font-ui: "Manrope", "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }

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

body {
  margin: 0;
  padding: 0 1.25rem 4rem;
  background: var(--wood-deep);
  /* Легкий світляк угорі — той самий прийом, що й на титульному екрані гри. */
  background-image: radial-gradient(120% 60% at 50% 0%, rgba(201, 151, 63, 0.10), transparent 70%);
  background-repeat: no-repeat;
  color: var(--ink);
  font: 400 17px/1.65 var(--font-ui);
}

main { max-width: 46rem; margin: 0 auto; }

/* ---------- Шапка ---------- */

header { padding: 2.5rem 0 1.5rem; border-bottom: 1px solid var(--edge-dim); }

.logo {
  display: inline-block;
  font: 700 1.05rem/1 var(--font-display);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
  text-decoration: none;
}
.logo:hover { color: var(--brass-lit); }

h1 {
  margin: 1.1rem 0 0.5rem;
  font: 700 clamp(1.9rem, 6vw, 2.6rem)/1.15 var(--font-display);
  color: var(--ink);
}

.stamp { margin: 0; color: var(--ink-dim); font-size: 0.9rem; }

/* ---------- Текст ---------- */

h2 {
  margin: 2.4rem 0 0.75rem;
  font: 700 clamp(1.25rem, 3.6vw, 1.5rem)/1.25 var(--font-display);
  color: var(--brass-lit);
}

h3 {
  margin: 1.6rem 0 0.5rem;
  font: 600 1.05rem/1.3 var(--font-ui);
  color: var(--ink);
}

p, li { color: var(--ink); }
p { margin: 0 0 1rem; }

ul, ol { margin: 0 0 1rem; padding-left: 1.25rem; }
li { margin: 0 0 0.5rem; }
li::marker { color: var(--brass); }

strong { color: var(--ink); font-weight: 700; }
.muted { color: var(--ink-muted); }

a { color: var(--brass); }
a:hover { color: var(--brass-lit); }

code {
  padding: 0.1em 0.35em;
  border: 1px solid var(--edge-dim);
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.35);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em;
  color: var(--brass-lit);
  /* anywhere, а не break-all: ідентифікатор пакета мусить ламатися лише коли не влазить,
     а не посеред слова в широкій колонці. */
  overflow-wrap: anywhere;
}

/* ---------- Таблиця даних ---------- */

.table-wrap { overflow-x: auto; margin: 0 0 1.25rem; }

table {
  width: 100%;
  min-width: 34rem;
  border-collapse: collapse;
  font-size: 0.95rem;
}
th, td {
  padding: 0.65rem 0.8rem;
  border-bottom: 1px solid var(--edge-dim);
  text-align: left;
  vertical-align: top;
}
th {
  color: var(--brass-lit);
  font: 600 0.8rem/1.3 var(--font-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
td:first-child { color: var(--ink); font-weight: 600; }
td:last-child { color: var(--ink-muted); }

/* ---------- Панель ---------- */

.panel {
  margin: 1.5rem 0;
  padding: 1.25rem 1.4rem;
  border: 1px solid var(--edge);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(43, 30, 21, 0.8), rgba(20, 13, 8, 0.9));
  box-shadow: 0 18px 44px -18px #000;
}
.panel > :last-child { margin-bottom: 0; }
.panel h3 { margin-top: 0; }

.panel.warn { border-color: #6a2f26; }
.panel.warn h3 { color: var(--blood-lit); }

/* ---------- Кнопка-пошта ---------- */

.cta {
  display: inline-block;
  margin: 0.35rem 0 0.25rem;
  padding: 0.7rem 1.3rem;
  border: 1px solid #8a5f1b;
  border-radius: 10px;
  background: linear-gradient(180deg, #d0982f, #8a5f1b);
  color: #1b120d;
  font: 700 1rem/1 var(--font-ui);
  text-decoration: none;
}
.cta:hover { color: #1b120d; filter: brightness(1.08); }

/* Виявлений ідентифікатор гравця: до відповіді Firebase блок не показується взагалі. */
#whoami { display: none; }
#whoami.shown { display: block; }
.id-row { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; margin: 0 0 0.75rem; }
.id-row code { font-size: 0.95rem; }

.copy {
  padding: 0.4rem 0.8rem;
  border: 1px solid var(--edge);
  border-radius: 8px;
  background: transparent;
  color: var(--ink-muted);
  font: 600 0.85rem/1 var(--font-ui);
  cursor: pointer;
}
.copy:hover { border-color: var(--brass); color: var(--brass-lit); }

/* ---------- Підвал ---------- */

footer {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--edge-dim);
  color: var(--ink-dim);
  font-size: 0.9rem;
}
footer nav { display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem; margin-bottom: 0.75rem; }
footer nav a { text-decoration: none; }
footer nav a:hover { text-decoration: underline; }
footer .here { color: var(--ink-muted); }

@media (max-width: 480px) {
  body { font-size: 16px; }
  table { min-width: 28rem; }
}