/* ===========================================================================
   PICO PU AGENT — токены и база.
   Одна палитра, один источник правды. Раньше палитра задавалась дважды:
   тёплая терракота в theme-light.css и синий акцент в патче ниже по файлу,
   который её перекрывал. Осталась итоговая — тёплый светлый фон + синий акцент.
   =========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Space+Mono:wght@400;700&display=swap');

:root {
  /* поверхности */
  --bg: #f8f8f3;
  --surface: #fffefa;
  --surface-2: #f0f0ea;
  --surface-3: #e8e9e4;
  --line: #dedfd8;
  --line-soft: #e9e9e3;

  /* текст */
  --text: #20211f;
  --text-2: #454741;
  --muted: #8d9088;

  /* акцент */
  --accent: #3868d8;
  --accent-hover: #4f83e7;
  --accent-strong: #2f59be;
  --accent-soft: #dfe8ff;
  --accent-glow: rgba(56, 104, 216, .22);
  --red: #c95542;
  --green-ok: #6fa77b;

  --shadow: 0 24px 70px rgba(66, 58, 46, .14);
  --shadow-soft: 0 6px 14px rgba(70, 62, 50, .08);

  /* Заливки поверх «стекла». Раньше они были вписаны литералами
     rgba(255,255,255,…) прямо в правила — в тёмной теме это давало светлые
     пятна на тёмном фоне. */
  --glass-fill: rgba(255, 255, 255, .28);
  --glass-fill-strong: rgba(255, 255, 255, .42);
  --glass-edge: rgba(255, 255, 255, .55);

  --sans: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Space Mono", "SFMono-Regular", Consolas, monospace;

  /* Безопасные зоны. --dock-gap — нижний отступ дока над «домашней полоской». */
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
  --dock-gap: max(10px, var(--safe-b));

  /* Высота видимой области. На десктопе и Android это просто 100dvh;
     на iOS при открытой клавиатуре JS подменяет значение на
     visualViewport.height — dvh там не сжимается и композер уезжает под
     клавиатуру. Единственная переменная, которую трогает скрипт. */
  --app-h: 100dvh;

  --radius-lg: 32px;
  --radius-md: 26px;
  --radius-sm: 16px;
}

/* Тёмная тема — по системной настройке. Раньше тёмный styles.css грузился
   первым и безусловно перекрывался светлой «темой», то есть не работал вовсе. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #101311;
    --surface: #151916;
    --surface-2: #1a201c;
    --surface-3: #202722;
    --line: #2b332e;
    --line-soft: #222923;
    --text: #f1f3ef;
    --text-2: #c4cbc5;
    --muted: #818a83;
    --accent-soft: #1c2740;
    --shadow: 0 24px 70px rgba(0, 0, 0, .45);
    --shadow-soft: 0 6px 14px rgba(0, 0, 0, .3);
    --glass-fill: rgba(255, 255, 255, .06);
    --glass-fill-strong: rgba(255, 255, 255, .11);
    --glass-edge: rgba(255, 255, 255, .12);
  }
}

*,
*::before,
*::after { box-sizing: border-box; }

html,
body {
  height: 100%;
  margin: 0;
  overscroll-behavior: none;
}

body {
  background:
    radial-gradient(circle at 12% 15%, rgba(56, 104, 216, .055), transparent 24%),
    radial-gradient(circle at 88% 72%, rgba(56, 104, 216, .045), transparent 27%),
    var(--bg);
  color: var(--text);
  font: 14px/1.5 var(--sans);
  /* Никакого position:fixed на body. Прежний iOS-хак ломал прокрутку
     и на Android, где он вообще не должен был применяться. */
}

button,
input,
select,
textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

/* Скроллбары скрыты по всему приложению — осознанное решение дизайна,
   прокрутка остаётся рабочей. */
* { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }

.hidden { display: none !important; }
[hidden] { display: none !important; }

/* ---------- liquid glass ----------
   Структура заимствована у lucasromerodb/liquid-glass-effect-macos. */
.liquidGlass-wrapper {
  position: relative;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 6px 6px rgba(72, 63, 50, .09), 0 0 20px rgba(72, 63, 50, .07);
  backface-visibility: hidden;
}

.liquidGlass-effect,
.liquidGlass-tint,
.liquidGlass-shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.liquidGlass-effect {
  z-index: 0;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  isolation: isolate;
}

.liquidGlass-tint { z-index: 1; }

.liquidGlass-shine {
  z-index: 2;
  border: 1px solid rgba(255, 255, 255, .56);
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .78), 0 0 0 1px rgba(255, 255, 255, .16);
}

@media (prefers-color-scheme: dark) {
  .liquidGlass-shine {
    border-color: rgba(255, 255, 255, .1);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .08), 0 0 0 1px rgba(255, 255, 255, .04);
  }
}

.liquidGlass-text { position: relative; z-index: 3; }

.glass-filter { position: absolute; width: 0; height: 0; pointer-events: none; }