/* ==========================================================
   Orvin VPN — основа: сброс, текст, фон.
   ========================================================== */

*{box-sizing:border-box;margin:0;padding:0}

html{
  height:100%;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  min-height:100%;
  background:var(--void);
  color:var(--text);
  font-family:var(--body);
  font-size:15px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  overscroll-behavior-y:none;          /* чтобы страница не «оттягивалась» внутри телеги */
  transition:background var(--mid) var(--ease), color var(--mid) var(--ease);
}

img,svg{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
::selection{background:rgba(94,231,200,.28)}

/* ---------- фон: мягкое свечение сверху ---------- */
.aura{
  position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:var(--aura);
  transition:background var(--slow) var(--ease);
}

/* холст со световыми лучами (включается из bg.js) */
#bg{
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  width:100%;height:100%;opacity:0;
  transition:opacity 1.4s var(--ease);
}
#bg.on{opacity:1}
[data-theme="light"] #bg.on{opacity:.75}

/* ---------- зернистость: убирает «пластиковость» градиентов ---------- */
.grain{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  opacity:var(--grain-opacity);mix-blend-mode:var(--grain-blend);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ---------- заголовки ---------- */
h1,h2,h3,h4{
  font-family:var(--display);
  letter-spacing:-.03em;
  line-height:1.18;
  text-wrap:balance;
  font-weight:600;
}
h1{font-size:26px}
h2{font-size:19px;font-weight:500}
h3{font-size:16px;font-weight:500;letter-spacing:-.02em}

/* акцентная подсветка куска заголовка: <h1>Привет, <em>кос</em></h1> */
h1 em,h2 em{
  font-style:normal;color:transparent;
  background:linear-gradient(94deg,var(--text) 0%,var(--accent-soft) 34%,var(--accent) 82%);
  -webkit-background-clip:text;background-clip:text;
}

p{color:var(--muted)}
b,strong{color:var(--text);font-weight:600}

/* все цифры одинаковой ширины — счётчики не «прыгают» при изменении */
.num,.v,td.num{font-variant-numeric:tabular-nums}

/* ---------- надпись-ярлык над блоком ---------- */
.label{
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dim);
}

/* ---------- рамка фокуса для клавиатуры ---------- */
:focus{outline:none}
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:8px;
}

/* ---------- прокрутка ---------- */
::-webkit-scrollbar{width:0;height:0}

/* ---------- уважение к настройке «уменьшить движение» ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  html{scroll-behavior:auto}
  #bg{display:none}
}