/* Тема «Glass»: светлая панель в духе «liquid glass» — пастельный фон с мягкими пятнами цвета, полупрозрачные
   карточки с размытием, кнопки-таблетки, фиолетовый акцент. Только светлый режим; тёмный — theme-pulse.css.
   Подключается после style.css; убрать тему — убрать <link> на этот файл. */
:root[data-theme="light"] {
  --bg: #eef0f8; --card: rgba(255, 255, 255, .62); --surface: rgba(255, 255, 255, .55); --field: rgba(255, 255, 255, .75);
  --line: rgba(80, 76, 140, .08); --line-2: rgba(80, 76, 140, .12); --line-3: rgba(80, 76, 140, .18);
  --text: #16162a; --text-2: #3c3d57; --muted: #7a7c96; --dim: #a7a9bf;
  --accent: #6b5cff; --accent-ink: #ffffff; --accent-soft: rgba(107, 92, 255, .16);
  --ok: #17996a; --ok-fill: #2fcf8f; --warn: #c27400; --warn-fill: #ffb547; --bad: #e0435a; --bad-fill: #ff6b81;
  --ok-soft: rgba(47, 207, 143, .16); --warn-soft: rgba(255, 181, 71, .2); --bad-soft: rgba(255, 107, 129, .15); --dim-soft: rgba(80, 76, 140, .07);
  --bar: rgba(244, 245, 252, .6); --hover: rgba(107, 92, 255, .06); --seg: rgba(255, 255, 255, .5); --seg-on: #16162a;
  --shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 12px 40px -12px rgba(76, 64, 170, .16), 0 2px 6px rgba(76, 64, 170, .05);
  --sheet-shadow: 0 40px 120px rgba(60, 50, 140, .28), 0 0 0 1px rgba(255, 255, 255, .8);
  --glass-edge: 1px solid rgba(255, 255, 255, .85);
  --grad: linear-gradient(135deg, #8a7bff 0%, #6b5cff 45%, #4f8dff 100%);
}

/* фон: мягкие цветные пятна, как в референсах */
:root[data-theme="light"] body {
  background:
    radial-gradient(700px 520px at 8% 0%, rgba(178, 166, 255, .55), transparent 65%),
    radial-gradient(640px 520px at 96% 12%, rgba(160, 228, 214, .5), transparent 65%),
    radial-gradient(760px 600px at 85% 100%, rgba(255, 205, 186, .45), transparent 65%),
    radial-gradient(700px 560px at 0% 100%, rgba(200, 214, 255, .55), transparent 65%), var(--bg);
  background-attachment: fixed;
}

/* шапка и меню-таблетки: активный пункт — тёмная таблетка */
:root[data-theme="light"] .top { background: rgba(255, 255, 255, .35); border-bottom: 1px solid rgba(255, 255, 255, .7); }
:root[data-theme="light"] .top .brand { display: inline-flex; align-items: center; gap: 10px; letter-spacing: .03em; }
:root[data-theme="light"] .top .brand::before { content: ""; width: 22px; height: 22px; border-radius: 8px; background: var(--grad);
  box-shadow: 0 6px 14px -4px rgba(107, 92, 255, .6), inset 0 1px 0 rgba(255, 255, 255, .5); }
:root[data-theme="light"] .top nav, :root[data-theme="light"] .seg { background: rgba(255, 255, 255, .5); border: var(--glass-edge); border-radius: 999px;
  box-shadow: 0 6px 20px -10px rgba(76, 64, 170, .25); }
:root[data-theme="light"] .top nav a, :root[data-theme="light"] .seg button { border-radius: 999px; color: var(--text-2); }
:root[data-theme="light"] .top nav:not(.has-pill) a.active, :root[data-theme="light"] .seg button.on { background: #16162a; color: #fff; box-shadow: 0 6px 16px -6px rgba(22, 22, 42, .55); }
/* плашка, что едет за курсором (nav.js), — та самая тёмная таблетка; текст на ней белый */
:root[data-theme="light"] .nav-pill { border-radius: 999px; background: #16162a; box-shadow: 0 6px 16px -6px rgba(22, 22, 42, .55); }
:root[data-theme="light"] .top nav a.pill-on { color: #fff; }
:root[data-theme="light"] .top nav a#navPulse { color: var(--accent) !important; }

/* карточки: матовое стекло */
:root[data-theme="light"] .card, :root[data-theme="light"] .stat {
  background: linear-gradient(160deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .5));
  -webkit-backdrop-filter: blur(22px) saturate(1.5); backdrop-filter: blur(22px) saturate(1.5);
  border: var(--glass-edge); border-radius: 24px; box-shadow: var(--shadow);
}
:root[data-theme="light"] h1 { font-size: 34px; letter-spacing: -.035em; font-weight: 700; }
:root[data-theme="light"] h2 { letter-spacing: -.01em; }

/* цифры: крупные, без цвета по умолчанию; цветной — только фон-оттенок карточки */
:root[data-theme="light"] .stat { padding: 18px 20px 16px; transition: transform .2s, box-shadow .2s; }
:root[data-theme="light"] .stat:hover { transform: translateY(-2px); box-shadow: 0 1px 0 #fff inset, 0 18px 44px -14px rgba(76, 64, 170, .28); }
:root[data-theme="light"] .stat .n { color: var(--text); letter-spacing: -.035em; font-weight: 650; }
:root[data-theme="light"] .stat.ok { background: linear-gradient(160deg, rgba(222, 250, 237, .9), rgba(255, 255, 255, .5)); }
:root[data-theme="light"] .stat.warn { background: linear-gradient(160deg, rgba(255, 238, 210, .92), rgba(255, 255, 255, .5)); }
:root[data-theme="light"] .stat.bad { background: linear-gradient(160deg, rgba(255, 224, 230, .92), rgba(255, 255, 255, .5)); }
:root[data-theme="light"] .stat.ok .n { color: var(--ok); }
:root[data-theme="light"] .grid3 .stat { background: rgba(255, 255, 255, .55); box-shadow: none; border-radius: 18px; }
:root[data-theme="light"] .stat .sub .d { padding: 2px 7px; border-radius: 999px; background: var(--dim-soft); }
:root[data-theme="light"] .stat .sub .d.up { background: var(--ok-soft); }
:root[data-theme="light"] .stat.live .l::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%;
  vertical-align: 1px; background: var(--ok-fill); animation: glass-ping 2s ease-out infinite; }
@keyframes glass-ping { 0% { box-shadow: 0 0 0 0 rgba(47, 207, 143, .5); } 70%, 100% { box-shadow: 0 0 0 8px rgba(47, 207, 143, 0); } }

/* график: мягкие лавандовые столбики, текущий час — градиентом; среднее — таблеткой */
:root[data-theme="light"] .hbar i { opacity: 1; border-radius: 10px 10px 6px 6px; background: linear-gradient(180deg, rgba(150, 138, 255, .45), rgba(150, 138, 255, .14)); }
:root[data-theme="light"] .hbar:hover i { background: linear-gradient(180deg, rgba(120, 106, 255, .7), rgba(120, 106, 255, .25)); }
:root[data-theme="light"] .hbar.now i { background: var(--grad); box-shadow: 0 10px 24px -6px rgba(107, 92, 255, .6); }
:root[data-theme="light"] .hbar.now .v { color: #fff; background: #16162a; border-radius: 999px; padding: 1px 7px; }
:root[data-theme="light"] .hbars-avg { border-top-color: rgba(107, 92, 255, .45); opacity: 1; }
:root[data-theme="light"] .hbars-avg span { background: #fff; color: var(--accent); border-radius: 999px; padding: 1px 8px; box-shadow: 0 4px 12px -4px rgba(76, 64, 170, .3); }

/* таблицы */
:root[data-theme="light"] th { text-transform: uppercase; font-size: 11px; letter-spacing: .06em; color: var(--dim); font-weight: 600; }
:root[data-theme="light"] th, :root[data-theme="light"] td { border-bottom: 1px solid rgba(80, 76, 140, .07); }
:root[data-theme="light"] tr:hover td { background: rgba(255, 255, 255, .6); }
:root[data-theme="light"] #advTbl td:last-child .btn { opacity: 0; transition: opacity .15s; }
:root[data-theme="light"] #advTbl tr:hover td:last-child .btn, :root[data-theme="light"] #advTbl .btn:focus { opacity: 1; }

/* метки — пастельные таблетки */
:root[data-theme="light"] .badge { border-radius: 999px; padding-left: 9px; padding-right: 9px; font-weight: 600; }
:root[data-theme="light"] .pill.ok { box-shadow: 0 0 0 3px rgba(47, 207, 143, .18); }
:root[data-theme="light"] .pill.bad { box-shadow: 0 0 0 3px rgba(255, 107, 129, .18); }

/* кнопки-таблетки: главная — градиент с цветной тенью, остальные — белое стекло */
:root[data-theme="light"] .btn { border-radius: 999px; background: rgba(255, 255, 255, .8); border: 1px solid rgba(255, 255, 255, .95); color: var(--accent);
  box-shadow: 0 4px 14px -6px rgba(76, 64, 170, .3); }
:root[data-theme="light"] .btn:hover { opacity: 1; background: #fff; box-shadow: 0 8px 20px -8px rgba(76, 64, 170, .4); }
:root[data-theme="light"] .btn.primary { background: var(--grad); color: #fff; border-color: rgba(255, 255, 255, .35);
  box-shadow: 0 12px 26px -10px rgba(107, 92, 255, .75), inset 0 1px 0 rgba(255, 255, 255, .4); }
:root[data-theme="light"] .btn.primary:hover { filter: brightness(1.06); }
:root[data-theme="light"] .btn.danger { background: var(--bad-soft); color: var(--bad); border-color: transparent; }

/* поля: белые таблетки с мягкой тенью внутрь, фокус — фиолетовое кольцо */
:root[data-theme="light"] input, :root[data-theme="light"] textarea, :root[data-theme="light"] .dd-btn {
  background: rgba(255, 255, 255, .8); border: 1px solid rgba(255, 255, 255, .95); border-radius: 14px;
  box-shadow: inset 0 1px 2px rgba(76, 64, 170, .08), 0 2px 8px -4px rgba(76, 64, 170, .12); }
:root[data-theme="light"] input:focus, :root[data-theme="light"] textarea:focus, :root[data-theme="light"] .dd-btn.open {
  outline: none; border-color: rgba(107, 92, 255, .5); box-shadow: 0 0 0 4px rgba(107, 92, 255, .14); }
:root[data-theme="light"] .dd-menu { background: rgba(255, 255, 255, .88); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border-radius: 16px; box-shadow: 0 24px 60px -12px rgba(60, 50, 140, .3), 0 0 0 1px rgba(255, 255, 255, .9); }

/* карточка рекла поверх размытой панели */
:root[data-theme="light"] .modal { background: rgba(210, 208, 240, .35); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
:root[data-theme="light"] .modal .card { background: rgba(255, 255, 255, .86); border-radius: 28px; }
:root[data-theme="light"] .detail { background: rgba(255, 255, 255, .6); border: var(--glass-edge); border-radius: 16px; }
:root[data-theme="light"] .sw input:checked + .knob { background: var(--ok-fill); box-shadow: 0 4px 12px -4px rgba(47, 207, 143, .7); }

/* молчащие реклы — белые таблетки */
:root[data-theme="light"] #ovSilent .chips a { padding: 4px 11px; border-radius: 999px; background: rgba(255, 255, 255, .75); border: var(--glass-edge);
  color: var(--text-2); box-shadow: 0 2px 8px -4px rgba(76, 64, 170, .2); }
:root[data-theme="light"] #ovSilent .chips a:hover { opacity: 1; color: var(--accent); }

:root[data-theme="light"] .toast { border-radius: 999px; }
:root[data-theme="light"] ::selection { background: rgba(107, 92, 255, .22); }

@media (prefers-reduced-motion: reduce) { :root[data-theme="light"] .stat.live .l::before { animation: none; } }

/* карточка рекла */
:root[data-theme="light"] .m-sec { background: rgba(255, 255, 255, .6); border: var(--glass-edge); border-radius: 18px; }
:root[data-theme="light"] .m-foot { background: rgba(255, 255, 255, .78); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-top-color: rgba(255, 255, 255, .9); border-radius: 0 0 28px 28px; }
:root[data-theme="light"] .theme-seg { background: rgba(255, 255, 255, .55); border: var(--glass-edge); }
:root[data-theme="light"] .theme-seg button.on { background: #16162a; color: #fff; }