/* Functional calendar only. No selectors apply to onboarding or its tour. */
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-400-cyrillic.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0400-052F,U+2DE0-2DFF,U+A640-A69F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-400-latin.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-024F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-600-cyrillic.woff2') format('woff2');font-weight:500 600;font-display:swap;unicode-range:U+0400-052F,U+2DE0-2DFF,U+A640-A69F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-600-latin.woff2') format('woff2');font-weight:500 600;font-display:swap;unicode-range:U+0000-024F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-700-cyrillic.woff2') format('woff2');font-weight:700;font-display:swap;unicode-range:U+0400-052F,U+2DE0-2DFF,U+A640-A69F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-700-latin.woff2') format('woff2');font-weight:700;font-display:swap;unicode-range:U+0000-024F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-800-cyrillic.woff2') format('woff2');font-weight:800;font-display:swap;unicode-range:U+0400-052F,U+2DE0-2DFF,U+A640-A69F}
@font-face{font-family:ZarokUI;src:url('public/fonts/manrope-800-latin.woff2') format('woff2');font-weight:800;font-display:swap;unicode-range:U+0000-024F}
.functional {
  --ui:ZarokUI,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  font-family:var(--ui);
  --bg:#f7f8f6; --bg2:#eff2ee; --surface:#fff;
  --t1:#202a25; --t2:#47574e; --t3:#68776e; --t4:#738078;
  --line:#e1e7e1; --line-soft:#edf0ec; --line-btn:#d4ddd5;
  --green:#3e6653; --green-bg:#eaf2ec; --green-tx:#305442;
  --scrim:rgba(22,35,28,.28);
  --mark:#a5b5a9;
  font-size:14px; line-height:1.5;
  /* цвет текста — от темы: иначе он наследуется от body со светлыми значениями */
  color:var(--t1);
}
.functional .screen { background:var(--bg); }
.functional .scroll { margin-bottom:0; padding-bottom:20px; }
.functional :is(button,input,textarea,select):focus-visible { outline:3px solid var(--acc-ring); outline-offset:3px; }
.functional button { transition:background .15s,color .15s; }
.functional button:disabled { opacity:.45; cursor:default; }
.functional .hdr,.functional .cal-hdr,.functional .plain-hdr { padding:22px 20px 16px; border-bottom:1px solid var(--line); }
.functional .hdr-date,.functional .plain-hdr h1 { font-size:28px; line-height:1.15; letter-spacing:-.035em; font-weight:800; }
.functional .hdr-sub { font-size:13px; margin-top:7px; }
.functional .hdr-prog { margin-top:18px; }
.functional .hdr-prog span { font:600 12px var(--ui); color:var(--t2); }
.functional .track { height:4px; }
.functional .navbtn { width:44px; height:44px; border-radius:14px; border-color:var(--line); font-size:24px; }
.functional .today-nav { font-size:18px; }
.functional .plain-hdr { min-height:80px; }
.functional .plain-hdr .sub { font:500 12px var(--ui); }
.functional .tabbar { padding:8px 8px calc(8px + var(--safe-bottom)); align-items:stretch; }
.functional .tab { min-height:56px; justify-content:center; color:var(--t3); gap:4px; }
.functional .tab-ico { width:48px; height:28px; border-radius:9px; }
.functional .tab-lb { font-size:10px; }
.functional .tab.on { color:var(--green-tx); }
.functional .tab.on .tab-ico { background:var(--green-bg); }
.functional .tab-assistant:not(.on) .tab-ico { color:var(--green); }
.functional .timeline { padding:8px 16px 20px; grid-template-columns:39px minmax(0,1fr); gap:10px 8px; }
.functional .tl-time b { font:600 11px var(--ui); color:var(--t3); }
.functional :is(.evcard,.dosecard,.card,.course,.fold,.prog) { border-radius:16px; box-shadow:none; }
.functional :is(.evcard,.dosecard) { padding:12px; gap:6px; background:var(--surface) !important; border-color:var(--line) !important; }
/* иконки видов записей, как в первой версии: цветной значок слева в карточке */
.functional .evbadge { width:34px; height:34px; border-radius:11px; padding:7px; flex:none; display:flex; align-items:center; justify-content:center; }
.functional .evbadge.sm { width:30px; height:30px; border-radius:10px; padding:6px; }
.functional .evbadge svg { width:100%; height:100%; display:block; }
.functional .kind-auto { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; margin:-4px 0 14px; padding:6px 10px; border:1px solid var(--line); border-radius:12px; background:var(--surface); text-align:left; }
.functional .kind-auto .kind-ic { width:30px; height:30px; border-radius:9px; padding:6px; flex:none; display:flex; }
.functional .kind-auto .kind-ic svg { width:100%; height:100%; }
.functional .kind-auto b { font-size:13px; font-weight:700; }
.functional .kind-auto em { margin-left:auto; font-style:normal; font-size:11px; color:var(--t3); }
.functional .evtext { min-width:0; flex:1; }
.functional .evtext b { color:var(--t1) !important; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.functional .evtext span { font-size:12px; line-height:1.45; color:var(--t3); margin-top:4px; }
.functional .icon-btn { min-width:32px; min-height:44px; font-size:22px; color:var(--t3); }
.functional .chk { position:relative; width:44px; height:44px; flex:none; border:0; background:transparent; color:transparent; border-radius:13px; font-size:0; }
.functional .chk::before { content:''; position:absolute; width:24px; height:24px; border:1.5px solid var(--mark); border-radius:8px; display:grid; place-items:center; }
.functional .chk.on::before { content:'✓'; background:var(--green); border-color:var(--green); color:var(--on-acc); font-size:14px; }
.functional .prep-row2.on .prep-body b { color:var(--t3); text-decoration:line-through; }
.functional .donerow { min-height:60px; border-radius:14px; padding:8px 12px; }
.functional .day-actions { display:flex; gap:6px; padding:16px 16px 12px; }
.functional .day-actions .btn { padding:0 10px; font-size:12px; flex:1; white-space:nowrap; }
.functional :is(.btn,.addbtn,.addrow) { min-height:44px; border-radius:12px; font-size:13px; font-weight:650; box-shadow:none; }
.functional .btn.green,.functional .btn.dark { background:var(--green); color:var(--on-acc); border-color:var(--green); }
.functional .addrow { border-style:solid; background:var(--surface); }
.functional .addpair2 { gap:10px; }
.functional .dayempty { padding:50px 24px; text-align:center; }
.functional .dayempty b,.functional .empty b { font-size:18px; color:var(--t1); }
.functional .dayempty p,.functional .empty p { font-size:13px; line-height:1.65; color:var(--t3); margin:8px 0 0; }
.functional .empty { padding:40px 12px 30px; }
/* шаг «Подготовка» перед распорядком дня: карточка из первой версии */
.functional .prep-step { padding:16px 16px 24px; gap:14px; }
.functional .prep-lead { margin:0 4px; font-size:13px; line-height:1.6; color:var(--t3); }
.functional .prep-card, .functional .rit-card { border-radius:16px; padding:14px 14px 4px; }
.functional .prep-card .scard-h b, .functional .rit-card .scard-h b { font-size:15px; font-weight:750; }
.functional .prep-card .scount, .functional .rit-card .scount { color:var(--t3); }
.functional .prep-card .sbar, .functional .rit-card .sbar { background:var(--line-soft); margin:10px 0 6px; }
.functional .prep-card .sbar i, .functional .rit-card .sbar i { background:linear-gradient(90deg,var(--acc-1),var(--acc-2)); }
.functional .prep-card .prep-row2, .functional .rit-card .prep-row2 { text-align:left; }
.functional .prep-card .dotchk, .functional .rit-card .dotchk { width:24px; height:24px; border-color:var(--mark); }
.functional .prep-card .prep-row2.on .dotchk, .functional .rit-card .prep-row2.on .dotchk { background:linear-gradient(145deg,var(--acc-1),var(--acc-edge)); border-color:var(--acc-edge); }
.functional .prep-go { width:100%; min-height:50px; font-size:14px; }
.functional .prep-inline { margin:16px 16px 0; padding:0 14px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.functional .prep-heading { width:100%; display:flex; align-items:center; gap:8px; min-height:48px; font-size:13px; font-weight:650; }
.functional .prep-heading small { margin-left:auto; color:var(--t3); font-size:12px; }
.functional .prep-row2 { min-height:48px; border-top:1px solid var(--line-soft); }
.functional .banner { margin:14px 16px 0; padding:12px 14px; }
/* зарок на «Дне» и в выбранном дне «Месяца» — в тех же полях, что баннер и подготовка;
   в списке «Курсов» поля уже даёт сам список */
.functional .quitcard { margin:14px 16px 0; }
.functional .list .quitcard { margin:0; }
.functional .banner span { font-size:12px; }
.functional .cal-title { font-size:19px; font-weight:750; }
.functional .cal-hdr { padding-top:16px; }
.functional .segrow { margin-top:14px; }
.functional .viewseg { border:0; padding:3px; }
.functional .viewseg button { min-height:38px; font-size:12px; }
.functional .segadd { background:transparent; color:var(--green-tx); font-size:12px; min-height:44px; }
.functional .dow { padding:16px 14px 8px; font:650 10px var(--ui); color:var(--t3); gap:3px; }
.functional .grid { padding:0 14px 16px; gap:3px; }
.functional .cell { min-height:48px; height:48px; border:0; border-radius:12px; align-items:center; padding:6px 2px; background:transparent !important; }
.functional .cell.sel { background:var(--green-bg) !important; box-shadow:inset 0 0 0 1.5px var(--acc-ring); }
.functional .cell-n { color:var(--t2) !important; font-size:13px; min-height:21px; display:flex; align-items:center; }
.functional .cell-n.today { color:var(--on-acc) !important; background:var(--green); width:23px; height:23px; margin:0; }
.functional .cell-dots { padding:0; gap:3px; margin-top:auto; }
.functional .cell-dots i { width:4px; height:4px; }
.functional .cell-bar { display:none; }
/* прошедшие дни серые, внимание на сегодня и будущее */
.functional .cell.past .cell-n { color:var(--t4) !important; font-weight:500; }
.functional .cell.past .cell-dots { opacity:.4; filter:grayscale(1); }
.functional .agenda-row.past { background:var(--bg2); box-shadow:none; }
.functional .agenda-row.past .agenda-date b, .functional .agenda-row.past .agenda-body { color:var(--t3); opacity:.75; }
.functional .agenda-row.past .chip { filter:grayscale(1); }
.functional .selected-day { border-top:1px solid var(--line); }
.functional .selected-day h2 { margin:18px 20px 0; font-size:17px; letter-spacing:-.02em; }
.functional .selected-day .dayempty { padding:28px 20px; }
.functional .selected-day .prep-inline { margin-top:12px; }
.functional .list { padding:16px; gap:12px; }
.functional .account-card { background:var(--surface); padding:18px; border:1px solid var(--line); border-radius:16px; margin-bottom:12px; }
.functional .account-card h2 { margin:0 0 6px; font-size:16px; letter-spacing:-.02em; }
.functional .account-card p { margin:4px 0 12px; color:var(--t3); font-size:13px; line-height:1.6; }
.functional .account-card .access-panel { padding:0; border:0; background:none; }
.functional .text-button { min-height:44px; padding:8px 0; display:block; color:var(--green-tx); font-size:13px; font-weight:600; }
.functional .assistant-intro { padding:28px 20px; }
.functional .assistant-intro h2 { margin:0 0 10px; font-size:23px; line-height:1.3; letter-spacing:-.025em; }
.functional .assistant-intro>p { color:var(--t3); font-size:14px; line-height:1.7; margin:0 0 24px; }
.functional .access-panel { border:1px solid var(--line); border-radius:16px; padding:18px; background:var(--surface); }
.functional .access-panel p { margin:0 0 12px; font-size:13px; color:var(--t2); line-height:1.65; }
.functional .access-panel p:last-child { margin:0; }
.functional .chat-hdr { padding:18px 20px; border-bottom:1px solid var(--line); }
.functional .aimark.xs { background:var(--green-bg); color:var(--green); box-shadow:none; border-radius:12px; }
.functional .chat-empty { padding:28px 4px 16px; }
.functional .chat-empty h2 { font-size:22px; line-height:1.35; margin:0 0 8px; letter-spacing:-.025em; }
.functional .chat-empty p { margin:0; font-size:13px; color:var(--t3); }
.functional .chat-inner { padding:16px; }
.functional .bub { font-size:14px; line-height:1.65; border-radius:16px; }
.functional .bub.me { background:var(--green-bg); color:var(--t1); }
.functional .chips { gap:8px; }
.functional .chip { padding:10px 12px; min-height:40px; font-size:12px; }
/* Помощник — обычная переписка: быстрые варианты мелкими кнопками под
   сообщением помощника, короткая строка об ИИ под ответом модели */
.functional .qr { display:flex; flex-wrap:wrap; gap:6px; align-self:flex-start; max-width:92%; margin:-2px 0 2px; }
.functional .qr-btn { min-height:34px; padding:6px 12px; border-radius:99px; border:1px solid var(--line-btn); background:var(--surface); font:650 12.5px var(--ui); color:var(--green-tx); }
.functional .qr-btn.main { background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-2) 55%,var(--acc-3) 100%); border-color:var(--acc-edge); color:var(--on-acc); box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 6px 14px -10px rgba(38,72,55,.9); }
.functional .qr-btn:disabled { opacity:.45; box-shadow:none; }
.functional .planbox { border-radius:16px; }
.functional .pb-one { display:flex; align-items:flex-start; gap:10px; }
.functional .pb-one .tick { flex:none; margin-top:2px; }
.functional .csend.idle { opacity:.5; box-shadow:none; }
/* экран условий помощника: один раз до начала работы */
.functional .ai-intro { padding:20px 20px 28px; }
.functional .ai-consent p { margin:0 0 14px; font-size:14px; line-height:1.65; color:var(--t2); }
.functional .ai-consent .inlink { font:inherit; color:var(--green-tx); text-decoration:underline; padding:0; }
.functional .ai-consent .ai-go { width:100%; min-height:50px; font-size:15px; margin-top:6px; }
.functional .ai-consent .consent-note { margin:12px 2px 0; text-align:left; }
.functional .sheet .ai-consent p { font-size:13px; }
/* чат: короткая строка об ИИ над полем ввода, жалоба — маленькой кнопкой у ответа */
.functional .ai-hint { margin:0; padding:6px 16px; font-size:11px; line-height:1.4; color:var(--t3); text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:var(--bg); }
.functional .bub-row { display:flex; align-items:flex-end; gap:4px; align-self:flex-start; max-width:92%; }
.functional .bub-row .bub { max-width:none; }
.functional .bub-flag { flex:none; width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--t4); opacity:.8; }
.functional .bub-flag svg { width:15px; height:15px; }
.functional .bub-flag.done { color:var(--green); }
/* запись голоса: распознанное подсказкой над полем, «Стоп» дописывает его в поле */
.functional .recbar { display:flex; align-items:center; gap:10px; }
.functional .recprev { flex:1; min-width:0; font-size:13px; line-height:1.4; color:var(--t2); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.functional .cbtn.rec svg { width:18px; height:18px; }
.functional .composer { padding:8px 12px 12px; gap:6px; }
.functional .cinput { font-size:16px; line-height:1.5; border-radius:13px; }
.functional .cbtn,.functional .csend { width:44px; height:44px; border-radius:12px; }
.functional .csend { background:var(--green); }
.functional .ai-consent-inline { padding:12px 16px; max-height:42dvh; overflow:auto; background:var(--surface); border-top:1px solid var(--line); }
.functional .ai-consent-inline .ainote { padding:0; margin:0 0 10px; background:none; border:0; font-size:12px; line-height:1.6; color:var(--t2); }
.functional .consent-note { margin:8px 0 0; font-size:11px; line-height:1.5; color:var(--t3); }
.functional .sheet .ai-consent-inline { padding:0; max-height:none; overflow:visible; background:none; border-top:0; }
.functional .sheet { border-radius:24px 24px 0 0; max-height:94%; box-shadow:0 -8px 32px #16231c18; }
.functional .sheet-h { padding:10px 20px 16px; }
.functional .sheet-h h2 { font-size:21px; line-height:1.3; text-transform:none; }
.functional .sheet-body { padding:18px 20px; }
.functional .sheet-foot { padding:12px 16px calc(14px + var(--safe-bottom)); }
.functional .sheet-foot .btn { min-height:48px; }
.functional .field { margin-bottom:16px; }
.functional .field label { display:block; font:600 12px/1.4 var(--ui); color:var(--t2); margin-bottom:7px; text-transform:none; letter-spacing:0; }
.functional .input { font-size:16px; min-height:48px; padding:12px; border-radius:12px; background:var(--input-bg); }
.functional .seg button { min-height:40px; font-size:12px; }
.functional .qtext,.functional .legal { font-size:13px; line-height:1.7; }
.functional .hint { font-size:12px; line-height:1.6; color:var(--t3); }
.functional .warn { font-size:13px; line-height:1.6; }
.functional .legal-links { display:flex; flex-wrap:wrap; gap:16px; }
.functional .legal-links button { min-height:44px; color:var(--green-tx); font-size:12px; text-decoration:underline; }
.functional .date-jump { display:block; position:relative; cursor:pointer; }
.functional .date-jump input { position:absolute; inset:0; opacity:0; width:100%; cursor:pointer; }
.functional .date-jump:focus-within { outline:2px solid var(--green); border-radius:6px; }
.functional .toast { display:flex; gap:12px; align-items:center; font-size:13px; line-height:1.5; bottom:calc(86px + var(--safe-bottom)); }
.functional .toast button { pointer-events:auto; min-height:44px; color:#fff; text-decoration:underline; font-weight:700; }
@media(max-width:360px) {
  .functional .hdr,.functional .plain-hdr { padding-left:16px; padding-right:16px; }
  .functional .hdr-date { font-size:25px; }
  .functional .day-actions { gap:4px; padding-left:12px; padding-right:12px; }
  .functional .day-actions .btn { font-size:11px; padding:0 7px; }
  .functional .timeline { padding-left:12px; padding-right:12px; grid-template-columns:34px minmax(0,1fr); gap:8px 5px; }
  .functional .evcard { padding:10px 8px; }
  .functional .quitcard { margin-left:12px; margin-right:12px; padding:0 12px 12px; }
  .functional .list .quitcard { margin:0; }
  .functional .q-btns { gap:5px; }
  .functional .q-btn { font-size:12px; padding:0 6px; }
  .functional .q-btn.ghost { flex-basis:36px; padding:0; }
  .functional .q-btn.soft { padding:0 9px; }
}
@media(prefers-reduced-motion:reduce) {
  .functional *, .functional *::before, .functional *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* Глянец, как в версии до Astra: на акцентных элементах мягкий градиент,
   блик сверху и цветная тень. Раньше так были сделаны кнопка отправки,
   свои сообщения в чате, значок помощника, полоса «Старт дня» и ярлыки
   курсов; здесь тот же приём в новой палитре. Поверхности остаются плоскими. */
.functional .btn.green,.functional .btn.dark {
  background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-2) 55%,var(--acc-3) 100%);
  border-color:var(--acc-edge);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 18px -12px rgba(38,72,55,.85);
}
.functional .btn.green:active,.functional .btn.dark:active { box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 3px 8px -6px rgba(38,72,55,.8); }
.functional .csend {
  background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-2) 55%,var(--acc-3) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 14px -8px rgba(38,72,55,.9);
}
.functional .csend:disabled { box-shadow:none; }
.functional .bub.me {
  background:linear-gradient(160deg,var(--me-1) 0%,var(--me-2) 100%);
  box-shadow:inset 0 1px 0 var(--hl),0 3px 8px -5px rgba(38,72,55,.3);
}
.functional .aimark.xs {
  background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-2) 60%,var(--acc-3) 100%); color:var(--on-acc);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 16px -10px rgba(38,72,55,.85);
}
.functional .tab.on .tab-ico {
  background:linear-gradient(180deg,var(--tab-1) 0%,var(--tab-2) 100%);
  box-shadow:inset 0 1px 0 var(--hl),0 2px 6px -3px rgba(38,72,55,.35);
}
.functional .viewseg button.on { box-shadow:inset 0 1px 0 var(--hl),0 2px 6px -3px rgba(30,50,40,.3); }
.functional .chk.on::before {
  background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-2) 60%,var(--acc-3) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 3px 8px -4px rgba(38,72,55,.8);
}
.functional .cell-n.today { background:linear-gradient(145deg,var(--acc-1) 0%,var(--acc-edge) 100%); box-shadow:0 4px 10px -5px rgba(38,72,55,.85); }

/* ============================================================
   ТЕМЫ ОФОРМЛЕНИЯ
   Тема ставится на <html data-theme> только в рабочей части приложения:
   анкета и приветствие всегда светлые. Каждая тема переопределяет те же
   переменные, что и светлая, поэтому экраны не знают о темах ничего.
   Фотографии (фоны пустых экранов, «отдых» после закрытого дня, фон
   помощника) подстраиваются под тему: фильтр, подкраска цветом темы
   и вуаль сверху под текст.
   ============================================================ */
html[data-theme="dark"]{--page:#0b0e0c}
html[data-theme="dark"] .app.functional{
  color-scheme:dark;
  --bg:#111513; --bg2:#171c19; --surface:#1a201d;
  --t1:#e7ece8; --t2:#b5c0b9; --t3:#8e9a92; --t4:#737e77;
  --line:#28302b; --line-soft:#1f2622; --line-btn:#343e38;
  --green:#4f8a6c; --green-bg:#1d2d25; --green-tx:#9dcab0;
  --yellow:#e2c27f; --yellow-bg:#29231a; --yellow-bd:#453a22;
  --scrim:rgba(0,0,0,.58);
  --fill:#242b27; --fill-2:#1e2521; --mark:#56645c; --hair:#2c3530; --mute:#8e9a92; --dash:#434e47;
  --danger:#e38b77; --danger-bg:#2b1a16; --danger-bd:#55302a;
  --acc-1:#5b9478; --acc-2:#478064; --acc-3:#3b6d54; --acc-edge:#3f7459; --acc-ring:#6fa388;
  --input-bg:#151a17; --me-1:#22322a; --me-2:#1c2b23; --tab-1:#23332a; --tab-2:#1d2c24;
  --hl:rgba(255,255,255,.06); --on-t1:#111513;
  --ph-filter:brightness(.52) saturate(.72) contrast(1.04);
  --ph-veil:linear-gradient(to bottom,rgba(17,21,19,.9) 0%,rgba(17,21,19,.5) 40%,rgba(17,21,19,.06) 70%,rgba(17,21,19,.3) 100%);
}
html[data-theme="sage"]{--page:#dde7df}
html[data-theme="sage"] .app.functional{
  --bg:#eef3ef; --bg2:#e3ebe5; --surface:#fbfdfb;
  --t1:#1c2a22; --t2:#43574a; --t3:#5f7467; --t4:#6f8277;
  --line:#d5e1d8; --line-soft:#e5ede7; --line-btn:#c5d5c9;
  --green:#386a50; --green-bg:#dcebe1; --green-tx:#2a543e;
  --fill:#dde7df; --fill-2:#e6eee8; --mark:#9db4a4; --hair:#d0ded4; --dash:#b6c8bb; --mute:#6f8277;
  --acc-1:#4d8267; --acc-2:#386a50; --acc-3:#2e5b44; --acc-edge:#33614a; --acc-ring:#86ab93;
  --input-bg:#f5f9f6; --me-1:#e7f2ea; --me-2:#d6e9dc; --tab-1:#e4f0e7; --tab-2:#d3e7d9;
  --ph-tint:#5f8f72; --ph-tint-op:.5;
}
html[data-theme="sand"]{--page:#e8e0d2}
html[data-theme="sand"] .app.functional{
  --bg:#f6f1e9; --bg2:#eee7db; --surface:#fffcf7;
  --t1:#29231b; --t2:#54493c; --t3:#76695a; --t4:#877c6c;
  --line:#e6ddcd; --line-soft:#efe8dc; --line-btn:#d9cebb;
  --green:#646d45; --green-bg:#ebe9d8; --green-tx:#4c5434;
  --fill:#ebe3d5; --fill-2:#f1ebe0; --mark:#c2b59f; --hair:#e1d9c8; --dash:#d0c4ae; --mute:#877c6c;
  --acc-1:#78825a; --acc-2:#646d45; --acc-3:#545c39; --acc-edge:#5a633e; --acc-ring:#a6ad84;
  --input-bg:#fbf8f2; --me-1:#f3f1e4; --me-2:#e8e5d0; --tab-1:#f2efe2; --tab-2:#e5e1cc;
  --ph-tint:#b99a6b; --ph-tint-op:.22;
}
html[data-theme="mist"]{--page:#dfe5ec}
html[data-theme="mist"] .app.functional{
  --bg:#f1f4f7; --bg2:#e7ecf1; --surface:#fcfdfe;
  --t1:#1b2430; --t2:#445162; --t3:#5f6d7f; --t4:#707d90;
  --line:#d9e0e8; --line-soft:#e8edf2; --line-btn:#c9d3de;
  --green:#3d6283; --green-bg:#e0eaf4; --green-tx:#2d4e6c;
  --fill:#e2e8ef; --fill-2:#e9eef3; --mark:#a0b0c2; --hair:#d4dde7; --dash:#b9c6d3; --mute:#707d90;
  --acc-1:#54789b; --acc-2:#3d6283; --acc-3:#32526f; --acc-edge:#375977; --acc-ring:#8aa3bd;
  --input-bg:#f8fafc; --me-1:#edf2f8; --me-2:#dde7f2; --tab-1:#ebf1f8; --tab-2:#dae5f1;
  --ph-tint:#6f8cab; --ph-tint-op:.45;
}
/* тёмная: глянец и светлые подложки, которые на тёмном смотрятся мутно */
html[data-theme="dark"] .app.functional .tagchip{background-image:none;box-shadow:none}
html[data-theme="dark"] .app.functional .toast{background:#2a332e;box-shadow:0 10px 28px -8px rgba(0,0,0,.7)}
html[data-theme="dark"] .app.functional .dlg-btns .danger{background:#b3503b;border-color:#b3503b}

/* фотографии подстраиваются под тему */
#appbg{isolation:isolate}
#appbg i{filter:var(--ph-filter)}
#appbg::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--ph-tint);opacity:var(--ph-tint-op);mix-blend-mode:color}
#appbg::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:var(--ph-veil)}
.restcard{isolation:isolate}
.restcard-ph{position:relative;filter:var(--ph-filter)}
.restcard-ph::after{content:'';position:absolute;inset:0;background:var(--ph-tint);opacity:var(--ph-tint-op);mix-blend-mode:color}

/* Без фоновых картинок и декора: цвета темы те же, но нет фото, глянца,
   свечений и цветных теней — ровные заливки и спокойные поверхности */
html.plain .app.functional #appbg,
html.plain .app.functional .restcard-ph,
html.plain .app.functional .praise-glow,
html.plain .app.functional .praise-card > i{display:none}
html.plain .app.functional .btn.green,
html.plain .app.functional .btn.dark,
html.plain .app.functional .csend,
html.plain .app.functional .aimark.xs,
html.plain .app.functional .qr-btn.main,
html.plain .app.functional .cell-n.today,
html.plain .app.functional .chk.on::before{background:var(--green);border-color:var(--green);box-shadow:none}
html.plain .app.functional .csend:disabled{background:var(--fill);color:var(--t3)}
html.plain .app.functional .bub.me{background:var(--green-bg);box-shadow:none}
html.plain .app.functional .tab.on .tab-ico{background:var(--green-bg);box-shadow:none}
html.plain .app.functional .viewseg button.on{box-shadow:none}
html.plain .app.functional .tagchip{background-image:none;box-shadow:none}
html.plain .app.functional .tab-ai{animation:none}

/* ---------- страница «Оформление» ---------- */
.look-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:2px 0 4px}
.look-tile{
  position:relative;display:flex;flex-direction:column;gap:8px;padding:8px 8px 10px;border-radius:18px;
  background:var(--surface);box-shadow:0 0 0 1px var(--line),0 6px 16px -14px rgba(30,40,34,.5);
  font:600 12px/1.2 var(--ui);color:var(--t1);text-align:center;transition:box-shadow .18s
}
.look-tile.on{box-shadow:0 0 0 2px var(--green),0 8px 20px -14px rgba(30,40,34,.55)}
.look-tile:active{transform:scale(.98)}
/* мини-экран темы: фон, карточка с двумя строками и отметка акцентом */
.look-pv{
  position:relative;display:block;height:64px;border-radius:12px;overflow:hidden;background:var(--pv-bg);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)
}
.look-pv::before{
  content:'';position:absolute;left:8px;right:8px;top:10px;height:26px;border-radius:8px;background:var(--pv-sf);
  box-shadow:0 2px 6px -3px rgba(0,0,0,.25)
}
.look-pv::after{
  content:'';position:absolute;left:14px;top:16px;width:30%;height:5px;border-radius:9px;background:var(--pv-t);
  box-shadow:0 8px 0 -.5px var(--pv-t2)
}
.look-pv i{position:absolute;right:14px;top:17px;width:12px;height:12px;border-radius:5px;background:var(--pv-ac)}
.look-pv u{position:absolute;left:8px;right:8px;bottom:8px;height:10px;border-radius:6px;background:var(--pv-sf);opacity:.7}
.look-tile b{display:flex;align-items:center;justify-content:center;gap:5px;font-weight:700}
.look-tile b svg{width:13px;height:13px;color:var(--green)}
/* переключатель */
.setrow.switchrow{padding:12px 0}
.switch{
  position:relative;flex:none;width:46px;height:28px;border-radius:99px;background:var(--mark);
  transition:background .2s
}
.switch::after{
  content:'';position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .2s ease
}
.switchrow[aria-checked="true"] .switch{background:var(--green)}
.switchrow[aria-checked="true"] .switch::after{transform:translateX(18px)}
@media(max-width:350px){.look-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ============================================================
   СОГЛАСИЕ ПЕРЕД ПОМОЩНИКОМ
   Фон — картинка раздела «Помощник» под цвет темы (#appbg). Текст —
   в стеклянной карточке, листается сам по себе, полосы прокрутки нет:
   о продолжении говорят затухание снизу и стрелка. Дочитали — стрелка
   и затухание уходят, «Продолжить» оживает.
   ============================================================ */
.functional .ai-gate{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 18px 14px}
.functional .ai-gate-head{flex:none;padding:26px 4px 16px}
.functional .ai-gate-head h1{margin:0;font:800 28px/1.12 var(--ui);letter-spacing:-.035em;color:var(--t1)}
.functional .ai-gate-head p{margin:8px 0 0;max-width:330px;font:500 13.5px/1.5 var(--ui);color:var(--t2)}
.functional .ai-gate-card{
  position:relative;flex:1 1 auto;min-height:170px;display:flex;flex-direction:column;overflow:hidden;
  border-radius:22px;background:color-mix(in srgb,var(--surface) 84%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(1.08);backdrop-filter:blur(18px) saturate(1.08);
  box-shadow:inset 0 1px 0 var(--hl),0 22px 44px -34px rgba(24,32,28,.6)
}
.functional .ai-gate-text{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:18px 18px 40px;
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent);
  mask-image:linear-gradient(to bottom,#000 calc(100% - 64px),transparent)
}
.functional .ai-gate-card.atend .ai-gate-text{padding-bottom:18px;-webkit-mask-image:none;mask-image:none}
.functional .ai-gate-text p{margin:0 0 12px;font:500 13.5px/1.62 var(--ui);color:var(--t2)}
.functional .ai-gate-text p:last-child{margin-bottom:0}
.functional .ai-gate-text b{color:var(--t1);font-weight:700}
.functional .ai-gate-text .inlink,.functional .ai-gate .consent-note .inlink{
  color:var(--green-tx);font-weight:600;text-underline-offset:2px;text-decoration-thickness:1px
}
.functional .ai-gate-text:focus-visible{outline:3px solid var(--acc-ring);outline-offset:-3px;border-radius:22px}
.functional .ai-gate-more{
  position:absolute;left:50%;bottom:10px;width:34px;height:34px;margin-left:-17px;border-radius:50%;
  display:grid;place-items:center;color:var(--t2);
  background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:0 6px 16px -8px rgba(0,0,0,.4);
  transition:opacity .25s ease,transform .25s ease;animation:gateNudge 1.6s ease-in-out .6s 2
}
.functional .ai-gate-more svg{width:17px;height:17px}
.functional .ai-gate-card.atend .ai-gate-more{opacity:0;transform:translateY(8px);pointer-events:none;animation:none}
@keyframes gateNudge{0%,100%{transform:none}50%{transform:translateY(4px)}}
.functional .ai-gate-checks{flex:none;display:flex;flex-direction:column;gap:8px;margin-top:12px}
.functional .ai-gate-checks.in{animation:gateIn .38s cubic-bezier(.2,.8,.2,1) both}
@keyframes gateIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.functional .ai-check{
  display:flex;gap:12px;align-items:flex-start;width:100%;padding:12px 14px;border-radius:16px;text-align:left;
  background:color-mix(in srgb,var(--surface) 88%,transparent);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 var(--hl),0 12px 28px -24px rgba(24,32,28,.6)
}
.functional .ai-check b{display:block;font:700 13.5px/1.3 var(--ui);color:var(--t1)}
.functional .ai-check em{display:block;margin-top:2px;font:500 11.5px/1.4 var(--ui);font-style:normal;color:var(--t3)}
.functional .ai-tick{
  flex:none;width:22px;height:22px;margin-top:1px;border-radius:7px;border:1.5px solid var(--mark);background:var(--surface);
  display:grid;place-items:center;color:var(--on-acc);transition:background .15s,border-color .15s
}
.functional .ai-tick svg{width:14px;height:14px;opacity:0;transition:opacity .15s}
.functional .ai-check[aria-checked="true"] .ai-tick{background:var(--green);border-color:var(--green)}
.functional .ai-check[aria-checked="true"] .ai-tick svg{opacity:1}
.functional .ai-check:focus-visible{outline:3px solid var(--acc-ring);outline-offset:2px}
.functional .ai-gate-dock{flex:none;padding-top:12px}
.functional .ai-gate-cta{width:100%;min-height:52px;font-size:15px;justify-content:center;text-align:center;transition:opacity .3s ease,box-shadow .3s ease}
.functional .ai-gate-cta[disabled]{opacity:.4;box-shadow:none}
/* подпись поверх картинки: мягкое свечение цветом фона вместо плашки */
.functional .ai-gate .consent-note{
  margin:10px 0 0;text-align:center;text-wrap:balance;font:500 11.5px/1.5 var(--ui);color:var(--t2);
  text-shadow:0 0 6px var(--bg),0 0 12px var(--bg),0 0 2px var(--bg)
}
/* без картинки фона стекло не нужно: обычная карточка с тонкой линией */
html.plain .app.functional .ai-gate-card,
html.plain .app.functional .ai-check{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 0 0 1px var(--line)}
@media(max-height:640px){
  .functional .ai-gate-head{padding:16px 4px 10px}
  .functional .ai-gate-head h1{font-size:24px}
  .functional .ai-gate-head p{display:none}
}

/* ---------- чёрно-белые темы ----------
   Светлая — чёрным по белому: чёрные контрастные кнопки и отметки.
   Тёмная — наоборот: белые кнопки с чёрным текстом на чёрном.
   Фотографии — в оттенках серого. */
html[data-theme="bw"]{--page:#e6e6e6}
html[data-theme="bw"] .app.functional{
  --bg:#f5f5f5; --bg2:#ededed; --surface:#ffffff;
  --t1:#111111; --t2:#3b3b3b; --t3:#666666; --t4:#7d7d7d;
  --line:#e0e0e0; --line-soft:#ececec; --line-btn:#cfcfcf;
  --green:#111111; --green-bg:#ebebeb; --green-tx:#111111;
  --yellow:#5c5140; --yellow-bg:#f4f2ee; --yellow-bd:#e2ddd3;
  --fill:#e8e8e8; --fill-2:#efefef; --mark:#8f8f8f; --hair:#dedede; --mute:#707070; --dash:#bdbdbd;
  --acc-1:#3a3a3a; --acc-2:#1a1a1a; --acc-3:#000000; --acc-edge:#111111; --acc-ring:#7a7a7a;
  --input-bg:#fafafa; --me-1:#f2f2f2; --me-2:#e6e6e6; --tab-1:#eeeeee; --tab-2:#e0e0e0;
  --on-acc:#ffffff;
  --ph-filter:grayscale(1) contrast(1.03);
}
html[data-theme="bwdark"]{--page:#000000}
html[data-theme="bwdark"] .app.functional{
  color-scheme:dark;
  --bg:#0b0b0b; --bg2:#141414; --surface:#171717;
  --t1:#f5f5f5; --t2:#cacaca; --t3:#8f8f8f; --t4:#727272;
  --line:#2b2b2b; --line-soft:#1f1f1f; --line-btn:#383838;
  --green:#f2f2f2; --green-bg:#262626; --green-tx:#f2f2f2;
  --yellow:#e0d3aa; --yellow-bg:#1f1c15; --yellow-bd:#3b3424;
  --scrim:rgba(0,0,0,.62);
  --fill:#212121; --fill-2:#1b1b1b; --mark:#5e5e5e; --hair:#2b2b2b; --mute:#8f8f8f; --dash:#474747;
  --danger:#ef8f7c; --danger-bg:#2a1a17; --danger-bd:#55302a;
  --acc-1:#ffffff; --acc-2:#ededed; --acc-3:#d9d9d9; --acc-edge:#e6e6e6; --acc-ring:#9a9a9a;
  --input-bg:#121212; --me-1:#262626; --me-2:#1f1f1f; --tab-1:#2a2a2a; --tab-2:#222222;
  --hl:rgba(255,255,255,.06); --on-t1:#0b0b0b; --on-acc:#0b0b0b;
  --ph-filter:grayscale(1) brightness(.5) contrast(1.05);
  --ph-veil:linear-gradient(to bottom,rgba(11,11,11,.88) 0%,rgba(11,11,11,.45) 40%,rgba(11,11,11,.05) 70%,rgba(11,11,11,.3) 100%);
}
html[data-theme="bwdark"] .app.functional .tagchip{background-image:none;box-shadow:none}
html[data-theme="bwdark"] .app.functional .toast{background:#2a2a2a;box-shadow:0 10px 28px -8px rgba(0,0,0,.7)}
/* глянец акцентных кнопок в ч/б — ровная заливка: блик на белом и чёрном смотрится грязно */
html[data-theme^="bw"] .app.functional .btn.green,
html[data-theme^="bw"] .app.functional .btn.dark,
html[data-theme^="bw"] .app.functional .csend,
html[data-theme^="bw"] .app.functional .qr-btn.main,
html[data-theme^="bw"] .app.functional .chk.on::before{background:var(--green);border-color:var(--green)}

/* ночь в горах в тёмных темах: картинка уже тёмная — без приглушения,
   вуаль слабее (в ч/б — только оттенки серого) */
html[data-theme="dark"] #appbg.night i,html[data-theme="dark"] .restcard-ph.night{filter:none}
html[data-theme="bwdark"] #appbg.night i,html[data-theme="bwdark"] .restcard-ph.night{filter:grayscale(1)}
#appbg.night::before{opacity:.45}
/* вечер у озера под светлым текстом анкеты и светлых тем: верх неба светлее */
#appbg.dusk::before{background:linear-gradient(to bottom,rgba(246,247,248,.78) 0%,rgba(246,247,248,.5) 30%,rgba(246,247,248,0) 55%)}
html[data-theme="dark"] #appbg.dusk::before,html[data-theme="bwdark"] #appbg.dusk::before{background:var(--ph-veil)}
