/* Есть вылет! (Ulet) — дизайн-токены Mini App.
   Основа — стиль панелей владельца (шаблон Kinlo / lk.gertnerlab.ru): стеклянные карточки с подсветкой по кромке,
   мягкие цветные «подложки» (персик + аква), бирюзовый акцент #0e6c84, большие радиусы, плавная кривая .22,1,.36,1.
   Шрифт — Rubik (локально, кириллица + латиница), у Kinlo Urbanist без кириллицы.
   Тема: светлая/тёмная; базовые цвета можно переопределить из Telegram.WebApp.themeParams (js/theme.js). */

@font-face {
  font-family: "Rubik";
  src: url("/assets/fonts/rubik-var.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  /* ───────── типографика ───────── */
  --font: "Rubik", ui-rounded, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 17px;
  --fs-xl: 20px;
  --fs-2xl: 26px;
  --fs-display: 34px;
  --fs-hero: 46px;
  --lh-tight: 1.15;
  --lh-base: 1.4;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --ls-tight: -0.02em;

  /* ───────── геометрия ───────── */
  --r-xs: 8px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-2xl: 32px;
  --r-pill: 999px;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 28px;
  --sp-7: 40px;
  --page-x: 16px;
  --tap: 44px;                         /* минимальная цель касания */
  --tab-h: 64px;
  --head-h: 56px;

  /* безопасные зоны: вырез/«домашний» индикатор + собственные отступы Telegram (fullscreen) */
  --safe-t: calc(env(safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px) + var(--tg-safe-area-inset-top, 0px));
  --safe-b: calc(env(safe-area-inset-bottom, 0px) + var(--tg-content-safe-area-inset-bottom, 0px) + var(--tg-safe-area-inset-bottom, 0px));
  --safe-l: env(safe-area-inset-left, 0px);
  --safe-r: env(safe-area-inset-right, 0px);

  /* ───────── движение ───────── */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);        /* выезд «пружинкой» — как у Kinlo */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 140ms;
  --dur: 260ms;
  --dur-slow: 520ms;
  --dur-bar: 900ms;

  /* ───────── цвета: светлая тема ───────── */
  --bg: #eef1f3;
  --wash-a: #f4bfa6;                   /* персик, левый верх */
  --wash-b: #bfe2e6;                   /* аква, правый низ */
  --wash-c: #e1eaf3;
  --wash-alpha: 0.9;
  --glass: rgba(255, 255, 255, 0.62);
  --glass-hi: rgba(255, 255, 255, 0.78);
  --glass-rim: rgba(255, 255, 255, 0.9);
  --glass-edge: rgba(23, 37, 45, 0.07);
  --blur: blur(22px) saturate(180%);
  --card: #fbfcfc;                     /* непрозрачная «бумага» */
  --card-2: rgba(23, 37, 45, 0.045);
  --card-3: rgba(23, 37, 45, 0.09);
  --float: rgba(251, 252, 252, 0.92);  /* шиты, меню, таббар */
  --ink: #15212a;
  --ink-2: #354550;
  --muted: #55616a;
  --line: rgba(23, 37, 45, 0.08);
  --line-2: rgba(23, 37, 45, 0.15);
  --shadow: 0 1px 2px rgba(23, 37, 45, 0.04), 0 14px 34px -18px rgba(23, 37, 45, 0.2);
  --shadow-lg: 0 2px 6px rgba(23, 37, 45, 0.06), 0 28px 60px -24px rgba(23, 37, 45, 0.34);
  --scrim: rgba(12, 22, 28, 0.42);

  --accent: #0e6c84;                   /* бирюзовый — цвет шарфа лиса и панелей владельца */
  --accent-hi: #127d98;
  --accent-ink: #ffffff;
  --accent-soft: rgba(14, 108, 132, 0.12);
  --accent-text: #0b5f74;
  --accent-glow: rgba(14, 108, 132, 0.5);

  --good: #23733f;
  --warn: #9a5208;
  --bad: #b3263a;
  --info: #2c58a0;
  --good-soft: rgba(35, 115, 63, 0.12);
  --warn-soft: rgba(196, 110, 18, 0.14);
  --bad-soft: rgba(179, 38, 58, 0.11);
  --info-soft: rgba(44, 88, 160, 0.11);

  /* ───────── уровни находок ─────────
     Палитра совпадает с карточками в чате (образец владельца 2026-11-01):
     супер / до $100 — красный с жёлтым; хорошая / до $300 — бело-голубая; распродажа и дороже $300 — сиреневая. */
  --super-a: #f23626;
  --super-b: #dc241e;
  --super-ink: #b3180f;                 /* красный текст на светлом, контраст ≥ 4.5 */
  --super-soft: rgba(242, 54, 38, 0.12);
  --super-yellow: #ffd60a;
  --super-orange: #ff8c00;
  --g-super: linear-gradient(135deg, var(--super-a), var(--super-b));
  --good-a: #1e64d2;
  --good-b: #18a0cd;
  --lvl-good-ink: #1450ad;
  --lvl-good-soft: rgba(30, 100, 210, 0.12);
  --g-good: linear-gradient(135deg, var(--good-b), var(--good-a));
  --sale-a: #5c46c8;
  --sale-b: #a79af0;
  --sale-ink: #4b36b3;
  --sale-soft: rgba(92, 70, 200, 0.12);
  --g-sale: linear-gradient(135deg, #e0dcf7, #cfc7f6);
  /* классы цены на одну сторону: 💎 до $100 = красный · 💵 до $300 = бело-голубой · 💰 дороже = сиреневый */
  --cls1-a: #f23626;
  --cls1-b: #dc241e;
  --cls1-ink: #b3180f;
  --cls1-soft: rgba(242, 54, 38, 0.12);
  --cls2-a: #18a0cd;
  --cls2-b: #1e64d2;
  --cls2-ink: #1450ad;
  --cls2-soft: rgba(30, 100, 210, 0.12);
  --cls3-a: #a79af0;
  --cls3-b: #5c46c8;
  --cls3-ink: #4b36b3;
  --cls3-soft: rgba(92, 70, 200, 0.12);
  --g-cls1: linear-gradient(135deg, var(--cls1-a), var(--cls1-b));
  --g-cls2: linear-gradient(135deg, var(--cls2-a), var(--cls2-b));
  --g-cls3: linear-gradient(135deg, var(--cls3-b), #7d6ae0);
  /* календарь: «дёшево/средне/дорого» — свои цвета, чтобы не путать с классами цены */
  --heat-1: #2ecc71;
  --heat-1-soft: rgba(46, 204, 113, 0.16);
  --heat-1-ink: #15703f;
  --heat-2: #60a5fa;
  --heat-2-soft: rgba(96, 165, 250, 0.16);
  --heat-2-ink: #1f55b8;
  --heat-3: #c084fc;
  --heat-3-soft: rgba(192, 132, 252, 0.16);
  --heat-3-ink: #7a35c7;
  /* плитка находки: цвета «посадочного талона» по классу цены (одинаковы в светлой и тёмной теме, как картинка в чате) */
  --t1-bg: linear-gradient(155deg, #f23626, #dc241e);
  --t2-bg: linear-gradient(160deg, #ffffff, #f2f7ff);
  --t3-bg: linear-gradient(160deg, #eeebfd, #e0dcf7);
  --t1-ink: #ffffff;
  --t2-ink: #0a1640;
  --t3-ink: #0c1440;
  --t2-muted: #485a7c;
  --t3-muted: #56588a;
  --t2-chip: #cee4fa;
  --t3-chip: #d6cefa;

  /* визовые статусы */
  --visa-free: var(--good);
  --visa-voa: #0b6e78;
  --visa-evisa: var(--warn);
  --visa-required: var(--bad);
  --visa-held: #6d35d4;
  --visa-unknown: var(--muted);

  /* ───────── Telegram: значения по умолчанию, перекрываются js/theme.js ───────── */
  --tg-bg: var(--bg);
  --tg-text: var(--ink);
  --tg-hint: var(--muted);
}

/* ───────── тёмная тема ───────── */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1214;
  --wash-a: #ee8a6a;
  --wash-b: #3cb2be;
  --wash-c: #5a82aa;
  --wash-alpha: 0.2;
  --glass: rgba(24, 31, 35, 0.62);
  --glass-hi: rgba(255, 255, 255, 0.06);
  --glass-rim: rgba(255, 255, 255, 0.1);
  --glass-edge: rgba(255, 255, 255, 0.07);
  --card: #172024;
  --card-2: rgba(236, 244, 246, 0.05);
  --card-3: rgba(236, 244, 246, 0.1);
  --float: rgba(23, 32, 36, 0.92);
  --ink: #ecf2f3;
  --ink-2: #cbd6d9;
  --muted: #9aaab0;
  --line: rgba(236, 244, 246, 0.08);
  --line-2: rgba(236, 244, 246, 0.17);
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 14px 32px -16px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, 0.4), 0 30px 70px -24px rgba(0, 0, 0, 0.8);
  --scrim: rgba(0, 0, 0, 0.6);

  --accent: #4cc0d6;
  --accent-hi: #6ccde0;
  --accent-ink: #04222b;
  --accent-soft: rgba(76, 192, 214, 0.15);
  --accent-text: #6fd0e3;
  --accent-glow: rgba(76, 192, 214, 0.45);

  --good: #6ccb8f;
  --warn: #f0a160;
  --bad: #f4878f;
  --info: #8db4ee;
  --good-soft: rgba(108, 203, 143, 0.15);
  --warn-soft: rgba(240, 161, 96, 0.15);
  --bad-soft: rgba(244, 135, 143, 0.15);
  --info-soft: rgba(141, 180, 238, 0.15);

  --super-ink: #ff8a80;
  --super-soft: rgba(242, 54, 38, 0.2);
  --lvl-good-ink: #8db4ff;
  --lvl-good-soft: rgba(30, 100, 210, 0.22);
  --sale-ink: #c3b8ff;
  --sale-soft: rgba(139, 120, 240, 0.22);
  --cls1-ink: #ff8a80;
  --cls1-soft: rgba(242, 54, 38, 0.2);
  --cls2-ink: #8db4ff;
  --cls2-soft: rgba(30, 100, 210, 0.22);
  --cls3-ink: #c3b8ff;
  --cls3-soft: rgba(139, 120, 240, 0.22);
  --heat-1-ink: #6ee7a0;
  --heat-2-ink: #8ec3ff;
  --heat-3-ink: #d8b4fe;
  --visa-voa: #5fd0dc;
  --visa-held: #c3a3ff;
}