/* Спільний стиль технічних сторінок (privacy.html, terms.html). Токени й шрифти — копія з 404.html/index.html:
   міняєте палітру чи шрифти там — міняйте і тут. */
@font-face{
  font-family:'Rye'; font-style:normal; font-weight:400; font-display:swap;
  src:url(/fonts/rye-latin.woff2) format('woff2');
}
@font-face{
  font-family:'Lora'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url(/fonts/lora-latin-var.woff2) format('woff2');
}
@font-face{
  font-family:'Share Tech Mono'; font-style:normal; font-weight:400; font-display:swap;
  src:url(/fonts/sharetechmono-latin.woff2) format('woff2');
}
/* Метричні фолбеки — ті самі, що на головній: підміна шрифту не рухає верстку. */
@font-face{font-family:'Lora Fallback';src:local('Georgia');
  size-adjust:90.4%;ascent-override:102%;descent-override:25%;line-gap-override:0%}
@font-face{font-family:'Rye Fallback';src:local('Georgia');
  size-adjust:89.7%;ascent-override:102%;descent-override:25%;line-gap-override:0%}

:root{
  --velvet:#2a070c; --velvet-2:#3f0b13;
  --gold:#e9b94f; --gold-2:#f6d98a; --bulb:#ffb24a;
  --led-bg:#120406;
  --ink:#f6eedd; --ink-dim:#dcc9ab;

  --s1:8px; --s2:12px; --s3:16px; --s4:24px;
  --s5:32px; --s6:48px; --s7:64px;

  --fs-body:clamp(17px, 1.6vw, 19px);
  --fs-lead:clamp(19px, 2vw, 22px);
  --fs-kicker:.78rem;
  --fs-fine:.82rem;
  --lh-body:1.65;
  --radius:14px;

  --font-display:'Rye','Rye Fallback',Georgia,serif;
  --font-body:'Lora','Lora Fallback',Georgia,serif;
  --font-led:'Share Tech Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:#1a0408}
body{
  margin:0; min-height:100svh;
  color:var(--ink); font-family:var(--font-body);
  font-size:var(--fs-body); line-height:var(--lh-body);
  background:
    radial-gradient(60% 45% at 50% 30%, rgba(255,178,74,.18) 0%, transparent 68%),
    radial-gradient(120% 60% at 50% -10%, #6b1320 0%, transparent 60%),
    linear-gradient(180deg, var(--velvet-2) 0%, var(--velvet) 40%, #1a0408 100%);
  overflow-x:hidden;
}
body::before{ /* velvet grain */
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.wrap{position:relative;z-index:1;width:100%;max-width:52rem;margin:0 auto;
  padding:var(--s7) var(--s3) var(--s6);text-align:center}
a{color:var(--gold-2)}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px}

/* ---------- табло ---------- */
.led{
  display:inline-block;font-family:var(--font-led);text-transform:uppercase;letter-spacing:.12em;
  color:transparent;background-color:#4a1208;
  background-image:radial-gradient(circle,#ff7a52 0 38%,#c8331a 39% 46%,transparent 50%);
  background-size:4px 4px;-webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 0 6px rgba(255,90,58,.85)) drop-shadow(0 0 16px rgba(255,90,58,.35));
  animation:ledflicker 6s steps(1) infinite;
}
.led-panel{display:inline-block;padding:.35em .9em;border-radius:12px;background:var(--led-bg);
  border:2px solid #4b2a1a;line-height:1;max-width:100%;
  box-shadow:inset 0 0 0 1px #1d0a08,inset 0 6px 14px rgba(0,0,0,.8),0 0 0 3px #2d1510,0 4px 0 #190b08}
.led-small{font-size:1.05rem}
.led-xl{font-size:clamp(1.7rem,7.6vw,3.6rem)}
@keyframes ledflicker{0%,96%,100%{opacity:1}97%{opacity:.75}98%{opacity:1}99%{opacity:.85}}


/* ---------- технічна сторінка ---------- */
.top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  max-width:46rem;margin:0 auto;padding:var(--s4) var(--s3)}
.top .brand img{height:1.65rem;width:auto;display:block;filter:drop-shadow(0 0 10px rgba(255,180,80,.25))}
.top .home{font-size:var(--fs-fine);text-decoration:none}
.doc{position:relative;z-index:1;max-width:46rem;margin:0 auto;padding:var(--s4) var(--s3) var(--s6)}
.kicker{font-family:var(--font-led);text-transform:uppercase;letter-spacing:.22em;font-size:var(--fs-kicker);color:var(--bulb);margin:0 0 var(--s2)}
h1{font-family:var(--font-display);font-weight:400;line-height:1.15;font-size:clamp(1.8rem,5vw,2.6rem);color:var(--gold-2);
  text-shadow:0 0 18px rgba(233,185,79,.25);margin:0 0 var(--s2)}
h2{font-family:var(--font-display);font-weight:400;font-size:clamp(1.15rem,3vw,1.4rem);color:var(--gold-2);margin:var(--s6) 0 var(--s2);scroll-margin-top:var(--s4)}
.meta{color:var(--ink-dim);font-size:var(--fs-fine);margin:0 0 var(--s4)}
.tldr{border:1px solid rgba(233,185,79,.35);border-radius:var(--radius);background:rgba(18,4,6,.45);padding:var(--s3) var(--s4);margin:0 0 var(--s4)}
.tldr p{margin:0}
p,li{color:var(--ink)} ul{padding-left:1.2em} li{margin:.35em 0}
.ph{border-bottom:1px dashed var(--bulb);color:var(--gold-2);font-family:var(--font-led);font-size:.92em;letter-spacing:.02em}  /* плейсхолдер — замінити */
.legal-foot{position:relative;z-index:1;max-width:46rem;margin:0 auto;padding:var(--s4) var(--s3) calc(var(--s5) + env(safe-area-inset-bottom));
  border-top:1px solid rgba(233,185,79,.25);font-size:var(--fs-fine);color:var(--ink-dim);display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:space-between}
.legal-foot a{color:var(--ink-dim);text-decoration:none} .legal-foot a:hover,.legal-foot a[aria-current]{color:var(--gold-2)}
@media (prefers-reduced-motion:reduce){.led{animation:none}}