/* Base: self-hosted Rubik (Hebrew, Cyrillic, Latin; variable weight), reset, type scale, RTL, focus, motion.
   Rubik: SIL OFL 1.1, see /fonts/OFL.txt. Ranges from @fontsource-variable/rubik 5.3.0. */
@font-face{font-family:"Rubik";font-style:normal;font-display:swap;font-weight:300 900;
  src:url(../fonts/rubik-hebrew.woff2) format("woff2");
  unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Rubik";font-style:normal;font-display:swap;font-weight:300 900;
  src:url(../fonts/rubik-cyrillic.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Rubik";font-style:normal;font-display:swap;font-weight:300 900;
  src:url(../fonts/rubik-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip}
/* iPhone: follow the owner's Text Size setting (17px at the default size; tokens.css divides by 17 there).
   Inputs stay at 16px or more (below), so Safari never zooms into a field. */
@supports (font:-apple-system-body) and (-webkit-touch-callout:none){ html{font:-apple-system-body} }
/* Sideways: html clips (iOS still pans when only body does). body uses clip too, because hidden would make body
   its own scroll box once html is not visible, and the sticky header would stop sticking. Old Safari: hidden. */
body{margin:0;min-height:100dvh;background:var(--bg);color:var(--text);font:400 var(--fs)/1.5 var(--font);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-x:clip;
  -webkit-tap-highlight-color:transparent}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
h1{font-size:var(--fs-2xl);line-height:1.15;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
h2{font-size:var(--fs-lg);line-height:1.25;font-weight:700;text-wrap:balance}
h3{font-size:var(--fs);line-height:1.3;font-weight:700}
small{font-size:var(--fs-xs)}
a{color:var(--y);text-underline-offset:3px}
img,svg,video,canvas{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:inherit}
button:disabled{cursor:default}
input,select,textarea{font-size:max(16px,1em)} /* iOS zooms into anything smaller */
textarea{resize:vertical}
[hidden]{display:none !important}
bdi,.ltr{unicode-bidi:isolate}
.ltr{direction:ltr}
.num{font-variant-numeric:tabular-nums}

/* visible focus everywhere (site rule: 2px yellow, 3px offset) */
:focus{outline:none}
:focus-visible{outline:2px solid var(--y);outline-offset:3px;border-radius:6px}
/* a screen's h1 gets focus after a route change (screen readers hear it); no ring for that */
h1[tabindex="-1"]:focus,main[tabindex="-1"]:focus{outline:none}

/* screen-reader only */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* text helpers */
.muted{color:var(--text-2)}
.meta{color:var(--text-3);font-size:var(--fs-xs)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font:600 var(--fs-xs)/1.2 var(--font);letter-spacing:.08em;color:var(--y)}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--y);flex:none}
:lang(ru) .eyebrow,:lang(en) .eyebrow{text-transform:uppercase}
.text-ember{color:var(--ember)} .text-ok{color:var(--ok)} .text-bad{color:var(--bad)} .text-volt{color:var(--volt)} .text-y{color:var(--y)}

/* RTL: chevrons and send icons point the reading way */
[dir="rtl"] .flip-rtl{transform:scaleX(-1)}

/* entrance: only on the first mount of a route (the .enter class is added once by the router outlet) */
@keyframes vr-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes vr-spin{to{transform:rotate(360deg)}}
@keyframes vr-pulse{0%{box-shadow:0 0 0 0 var(--y-ring)}70%{box-shadow:0 0 0 18px rgba(255,212,0,0)}100%{box-shadow:0 0 0 0 rgba(255,212,0,0)}}
@keyframes vr-in-up{from{transform:translateY(100%)}to{transform:none}}
@keyframes vr-fade{from{opacity:0}to{opacity:1}}
.enter{animation:vr-rise var(--t-slow) var(--ease) both}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}
