/* ruslab tokens — colors, typography, radii, motion */

:root,
[data-theme="dark"] {
  --rus-bg:              #0B0E11;
  --rus-bg-elev:         #14181D;
  --rus-bg-soft:         #1C2128;
  --rus-border:          rgba(255, 255, 255, 0.08);
  --rus-border-strong:   rgba(255, 255, 255, 0.14);
  --rus-fg:              #ECEDEE;
  --rus-fg-mute:         #9BA1AB;
  --rus-fg-faint:        #6A727C;

  --rus-accent:          #34D399;
  --rus-accent-2:        #22D3EE;
  --rus-accent-3:        #99F6E4;
  --rus-grad:            linear-gradient(135deg, #34D399 0%, #22D3EE 100%);

  --rus-warn:            #F59E0B;
  --rus-danger:          #EF4444;
  --rus-success:         #10B981;

  --rus-blue:            #60A5FA;
  --rus-purple:          #A78BFA;
  --rus-grey:            #9CA3AF;

  /* Hero overlay stops — dark gradient (text is light against it). */
  --rus-hero-top:        rgba(11, 14, 17, .40);
  --rus-hero-mid:        rgba(11, 14, 17, .85);
  --rus-accent-glow-top: rgba(52, 211, 153, .18);
  --rus-accent-glow-bot: rgba(34, 211, 238, .10);

  --rus-shadow:          0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.32);

  --rus-radius-sm:       8px;
  --rus-radius:          12px;
  --rus-radius-lg:       20px;

  --rus-t-fast:          150ms;
  --rus-t-base:          250ms;
  --rus-t-slow:          400ms;
  --rus-ease:            cubic-bezier(.2, .8, .2, 1);
  --rus-ease-out:        cubic-bezier(0, .8, .4, 1);

  color-scheme: dark;
}

[data-theme="light"] {
  --rus-bg:              #FAFAFA;
  --rus-bg-elev:         #FFFFFF;
  --rus-bg-soft:         #F2F4F6;
  --rus-border:          rgba(0, 0, 0, 0.10);
  --rus-border-strong:   rgba(0, 0, 0, 0.18);
  --rus-fg:              #0B0E11;
  --rus-fg-mute:         #4B5563;
  --rus-fg-faint:        #6B7280;

  --rus-accent:          #047857;
  --rus-accent-2:        #0E7490;
  --rus-accent-3:        #34D399;
  --rus-grad:            linear-gradient(135deg, #047857 0%, #0E7490 100%);

  --rus-warn:            #B45309;
  --rus-danger:          #B91C1C;
  --rus-success:         #047857;

  --rus-blue:            #1D4ED8;
  --rus-purple:          #6D28D9;
  --rus-grey:            #4B5563;

  --rus-shadow:          0 1px 2px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.08);

  /* Hero overlay stops — light theme. White-to-bg gradient so muted text
     remains high contrast on a softly tinted backdrop. */
  --rus-hero-top:        rgba(255, 255, 255, .35);
  --rus-hero-mid:        rgba(255, 255, 255, .85);
  --rus-accent-glow-top: rgba(4, 120, 87, .12);
  --rus-accent-glow-bot: rgba(14, 116, 144, .08);

  color-scheme: light;
}

/* Typography stacks — system only */
:root {
  --rus-font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
                   "Segoe UI Variable", "Segoe UI", Roboto, "Helvetica Neue", system-ui, sans-serif;
  --rus-font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Consolas, monospace;
  --rus-font-display: var(--rus-font-sans);
}

body {
  font-family: var(--rus-font-sans);
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: 0;
  background: var(--rus-bg);
  color: var(--rus-fg);
  transition: background var(--rus-t-slow) var(--rus-ease),
              color var(--rus-t-slow) var(--rus-ease);
}

/* Type scale */
.t-display { font: 800 56px/64px var(--rus-font-display); letter-spacing: -0.03em; }
.t-h1      { font: 700 36px/40px var(--rus-font-sans); letter-spacing: -0.02em; }
.t-h2      { font: 700 26px/32px var(--rus-font-sans); letter-spacing: -0.015em; }
.t-h3      { font: 600 20px/28px var(--rus-font-sans); letter-spacing: -0.01em; }
.t-h4      { font: 600 17px/24px var(--rus-font-sans); letter-spacing: 0; }
.t-body    { font: 400 15px/22px var(--rus-font-sans); }
.t-body-lg { font: 400 17px/26px var(--rus-font-sans); }
.t-small   { font: 500 13px/18px var(--rus-font-sans); }
.t-micro   { font: 600 11px/16px var(--rus-font-sans); letter-spacing: 0.04em; text-transform: uppercase; }

@media (max-width: 640px) {
  .t-display { font-size: 40px; line-height: 48px; }
  .t-h1      { font-size: 28px; line-height: 34px; }
}

/* Brand wordmark */
.brand-ruslab { font: 800 22px/1 var(--rus-font-sans); color: var(--rus-fg); letter-spacing: -0.01em; }
.brand-ruslab .lab {
  background: var(--rus-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.brand-mark {
  width: 22px; height: 22px;
  background: var(--rus-grad);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 1.5l9.5 9.5L12 21 1.5 11 12 1.5zm0 3.83L4.33 12.5 12 19.67l7.67-7.17L12 5.33zm0 3.04l4.62 4.63L12 16.62 7.38 13l4.62-4.63z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M12 1.5l9.5 9.5L12 21 1.5 11 12 1.5zm0 3.83L4.33 12.5 12 19.67l7.67-7.17L12 5.33zm0 3.04l4.62 4.63L12 16.62 7.38 13l4.62-4.63z'/></svg>") center/contain no-repeat;
  flex-shrink: 0;
}

/* Gradient text util */
.text-grad {
  background: var(--rus-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Muted helpers */
.text-mute { color: var(--rus-fg-mute); }
.text-faint { color: var(--rus-fg-faint); }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
