/* ============================================================
   SKINS — три готовых «скина» всей системы (08.10.2026)
   Вишня (cherry) · Дым (smoke) · Кость (bone).
   Грузится ПОСЛЕДНИМ, после sleaze.css. Выбор: Настройки → Общие → Стиль,
   хранится в localStorage 'uiSkin' (по умолчанию cherry), ставится на <html data-skin>
   инлайн-скриптом в <head>. Скин сам задаёт тему (вишня и дым тёмные, кость светлая),
   поэтому старые переключатели «Тема» и «Акцент» в настройках скрыты.
   Откат: убрать одну строку <link> + (по желанию) data-skin с <html>.
   Без анимаций фона, свечений, стекла, размытия. Один статичный градиент + зерно ≤1 КБ.
   ============================================================ */

/* ── общее для всех трёх: радиусы, тени, воздух ─────────────────────── */
html[data-skin]{
  --r-s:10px; --r-m:12px; --r-card:18px; --r-l:20px; --r-bubble:20px; --r-pill:999px;
  --r-sm:var(--r-m); --r-md:var(--r-card); --r-lg:var(--r-card); --r-xl:var(--r-l); --r-paper:var(--r-m);
  --r-input:14px; --r-pop:20px;
}
html[data-skin="smoke"]{--r-s:12px;--r-m:14px;--r-card:20px;--r-l:24px;--r-bubble:22px;--r-input:16px;--r-pop:24px}
html[data-skin="bone"]{--r-s:12px;--r-m:14px;--r-card:20px;--r-l:24px;--r-bubble:22px;--r-input:16px;--r-pop:24px}

/* ── ПАЛИТРЫ. Селектор [data-theme][data-accent] нужен, чтобы перебить
      старые правила [data-theme="dark"][data-accent="..."] из redesign.css/kb.css ── */

/* 1. ВИШНЯ — oxblood вместо чёрного, тёплый графит в карточках, кость в тексте */
html[data-skin="cherry"][data-theme][data-accent]{
  color-scheme:dark;
  --bg:#3B1420; --bg-page:#3B1420; --bg-sidebar:#2D0F18; --bg-well:#3A2C31; --bg-elev:#2D2427;
  --hairline:rgba(241,230,214,.13); --hairline-soft:rgba(241,230,214,.07); --hairline-strong:rgba(241,230,214,.34);
  --ink:#F2E9DA; --ink-soft:#CDBFBE; --ink-mute:#AB9B9D;
  --scrim:rgba(24,6,12,.74);
  --shadow-card:inset 0 1px 0 rgba(255,236,220,.06),0 6px 18px rgba(20,4,10,.34);
  --shadow-float:0 10px 28px rgba(18,3,9,.5); --shadow-modal:0 24px 70px rgba(14,2,7,.65);
  --glass-fill:rgba(45,36,39,.98); --glass-border:rgba(241,230,214,.16);
  --accent:#FF7C80; --accent-fill:#D93A47; --accent-fill-hover:#E8505B; --on-accent:#FFFFFF; --accent-text:#FF8F93;
  --signal:#F2E9DA; --signal-ink:#2D0F18; --signal-text:#F2E9DA;
  --ok-text:#B9D58F; --warn-text:#E8C377; --err-text:#FF8F93; --err-fill:#C9303D;
  --warn-bg:#40320F; --err-bg:#4A1620; --ok-bg:#243019; --info-bg:#1F3236;
  --code-bg:#241B1E; --code-inv-bg:#241B1E; --code-inv-ink:#F2E9DA;
  --forest:#2D2427; --forest-deep:#241B1E; --pl-forest:#2D2427; --pl-forest-deep:#241B1E;
  --sb-thumb:rgba(242,233,218,.2); --sb-thumb-hover:rgba(242,233,218,.34); --sb-thumb-active:rgba(242,233,218,.5);
  --skin-seg-on:#4B3A40; --skin-inset:inset 0 1px 0 rgba(255,236,220,.07),inset 0 0 28px rgba(217,58,71,.06);
  --splash-bg:#3B1420;
}
/* 2. ДЫМ — холодный сине-графитовый с фиолетовым, серебро, кислотный лайм */
html[data-skin="smoke"][data-theme][data-accent]{
  color-scheme:dark;
  --bg:#1E2030; --bg-page:#1E2030; --bg-sidebar:#171925; --bg-well:#2C3045; --bg-elev:#262A3D;
  --hairline:rgba(206,210,235,.13); --hairline-soft:rgba(206,210,235,.07); --hairline-strong:rgba(206,210,235,.34);
  --ink:#E0E2EE; --ink-soft:#B3B7CE; --ink-mute:#9B9FB9;
  --scrim:rgba(10,11,20,.72);
  --shadow-card:0 6px 18px rgba(8,9,18,.32); --shadow-float:0 10px 28px rgba(8,9,18,.45); --shadow-modal:0 24px 64px rgba(6,7,15,.6);
  --glass-fill:rgba(38,42,61,.98); --glass-border:rgba(206,210,235,.16);
  --accent:#C9F23B; --accent-fill:#C9F23B; --accent-fill-hover:#D8F96A; --on-accent:#14161F; --accent-text:#C9F23B;
  --signal:#C9F23B; --signal-ink:#14161F; --signal-text:#C9F23B;
  --ok-text:#B5E36A; --warn-text:#EBCB7A; --err-text:#FF9AA2; --err-fill:#C9303D;
  --warn-bg:#3A3414; --err-bg:#43202C; --ok-bg:#25341B; --info-bg:#1E3440;
  --code-bg:#171925; --code-inv-bg:#171925; --code-inv-ink:#E0E2EE;
  --forest:#262A3D; --forest-deep:#171925; --pl-forest:#262A3D; --pl-forest-deep:#171925;
  --sb-thumb:rgba(224,226,238,.2); --sb-thumb-hover:rgba(224,226,238,.34); --sb-thumb-active:rgba(224,226,238,.5);
  --skin-seg-on:#3B4060; --skin-inset:none;
  --splash-bg:#1E2030;
}
/* 3. КОСТЬ — светлая: экрю, чернильный текст, красный точечно, бумажные тени */
html[data-skin="bone"][data-theme][data-accent]{
  color-scheme:light;
  --bg:#EAE4D7; --bg-page:#EAE4D7; --bg-sidebar:#E2DBCB; --bg-well:#DCD4C3; --bg-elev:#F6F2E9;
  --hairline:#CFC7B6; --hairline-soft:#DDD6C7; --hairline-strong:#17140F;
  --ink:#17140F; --ink-soft:#4D473C; --ink-mute:#5C564A;
  --scrim:rgba(40,32,20,.42);
  --shadow-card:0 1px 2px rgba(60,48,28,.08),0 8px 22px rgba(60,48,28,.09);
  --shadow-float:0 2px 6px rgba(60,48,28,.10),0 14px 34px rgba(60,48,28,.16);
  --shadow-modal:0 10px 30px rgba(60,48,28,.16),0 36px 80px rgba(60,48,28,.24);
  --glass-fill:rgba(246,242,233,.98); --glass-border:#CFC7B6;
  --accent:#C8202F; --accent-fill:#C8202F; --accent-fill-hover:#AE1826; --on-accent:#FFFFFF; --accent-text:#B51C2B;
  --signal:#17140F; --signal-ink:#F6F2E9; --signal-text:#17140F;
  --ok-text:#3F5F22; --warn-text:#7D5600; --err-text:#B51C2B; --err-fill:#B51C2B;
  --warn-bg:#F4E3AE; --err-bg:#F5D5D3; --ok-bg:#DCE8C4; --info-bg:#D6E4E6;
  --code-bg:#DCD4C3; --code-inv-bg:#1C1913; --code-inv-ink:#EAE4D7;
  --forest:#1C1913; --forest-deep:#100E0A; --pl-forest:#1C1913; --pl-forest-deep:#100E0A;
  --sb-thumb:rgba(23,20,15,.26); --sb-thumb-hover:rgba(23,20,15,.42); --sb-thumb-active:rgba(23,20,15,.58);
  --skin-seg-on:#F6F2E9; --skin-inset:none;
  --splash-bg:#EAE4D7;
}

/* ── фон страницы: один статичный градиент + зерно (SVG-шум, ≈0.5 КБ) ── */
html[data-skin]{--skin-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-skin]{background-color:var(--bg)}
html[data-skin="cherry"] body{background:
  var(--skin-grain),
  radial-gradient(120% 70% at 85% -10%,rgba(190,52,66,.30),transparent 60%),
  linear-gradient(180deg,#43172A 0%,#3B1420 45%,#33101B 100%);
  background-blend-mode:soft-light,normal,normal;background-attachment:fixed}
html[data-skin="smoke"] body{background:
  var(--skin-grain),
  radial-gradient(110% 70% at 10% -10%,rgba(120,106,190,.24),transparent 60%),
  linear-gradient(180deg,#232639 0%,#1E2030 50%,#1A1C2A 100%);
  background-blend-mode:soft-light,normal,normal;background-attachment:fixed}
html[data-skin="bone"] body{background:
  var(--skin-grain),
  radial-gradient(110% 60% at 90% -10%,rgba(214,150,120,.20),transparent 60%),
  linear-gradient(180deg,#EFE9DC 0%,#EAE4D7 55%,#E5DECF 100%);
  background-blend-mode:soft-light,normal,normal;background-attachment:fixed}
/* экраны не перекрывают фон страницы сплошной заливкой */
html[data-skin] .view,html[data-skin] [id^="view-"]:not(iframe),html[data-skin] .chat-main,html[data-skin] .agents-view,html[data-skin] .lib-view,
html[data-skin] .doc-view,html[data-skin] .projects-view,html[data-skin] .kb-shell,html[data-skin] .app-main,html[data-skin] main{background:transparent!important}
html[data-skin] #view-dashboard::before{content:none}

/* ── типографика: Jost мягко, без капса-крика ── */
html[data-skin] h1,html[data-skin] .pl-h1,html[data-skin] .dash-title,html[data-skin] .set-title,
html[data-skin] .view-title,html[data-skin] .page-title,html[data-skin] .chat-welcome-text{
  text-transform:none;letter-spacing:-.005em;font-weight:400!important;line-height:1.2}
html[data-skin] .dash-title{font-size:clamp(28px,3.2vw,42px)}
html[data-skin] .dash-title-accent{color:var(--accent-text)}
html[data-skin] .chat-welcome-text{font-size:clamp(24px,2.6vw,34px)}
html[data-skin] .dash-date-num{letter-spacing:0}
html[data-skin] .dash-date-text{letter-spacing:.1em}
html[data-skin] .pl-eyebrow,html[data-skin] .sb-sec,html[data-skin] .msheet-group-label,
html[data-skin] .set-block-title,html[data-skin] .pl-col-title,html[data-skin] .pl-cal-dow,
html[data-skin] .pl-stats-section-title,html[data-skin] .date-divider,html[data-skin] .chat-head-meta,
html[data-skin] .dash-card-title{letter-spacing:.1em;font-size:11px;color:var(--ink-mute)}
html[data-skin] .pl-btn,html[data-skin] .sb-new,html[data-skin] button.primary,html[data-skin] .btn-primary,html[data-skin] .btn{
  text-transform:none;letter-spacing:0;font-size:14px;font-weight:600}
html[data-skin] #appsb .hdr-logo{letter-spacing:.1em}

/* ── карточки: «таблетки» ── */
html[data-skin] .dash-card,html[data-skin] .pl-card,html[data-skin] .lib-card,html[data-skin] .ag-card,
html[data-skin] .lcard{
  border-radius:var(--r-card);border:1px solid var(--hairline);background:var(--bg-elev);
  box-shadow:var(--skin-inset,none),var(--shadow-card)}
html[data-skin] .pl-card:hover,html[data-skin] .lib-card:hover,html[data-skin] .ag-card:hover{border-color:var(--hairline-strong);box-shadow:var(--skin-inset,none),var(--shadow-float)}
html[data-skin] .dash-card{padding:24px 26px}
html[data-skin] .lcard{padding:36px}

/* ── поля ввода и кнопки ── */
html[data-skin] .dash-input-wrap,html[data-skin] .irow{
  border-radius:var(--r-l);background:var(--bg-elev);border:1px solid var(--hairline);box-shadow:var(--skin-inset,none),var(--shadow-card)}
html[data-skin] .dash-input-wrap:focus-within,html[data-skin] .irow:focus-within{border-color:var(--accent);box-shadow:var(--skin-inset,none),var(--shadow-card)}
html[data-skin] .dash-send,html[data-skin] .sbtn,html[data-skin] .mic-btn,html[data-skin] .attach-btn{border-radius:var(--r-pill)!important}
html[data-skin] .pl-input,html[data-skin] .pl-textarea,html[data-skin] .pl-select,html[data-skin] .pl-picker-btn,
html[data-skin] .lib-search,html[data-skin] .inp,html[data-skin] input[type=text],html[data-skin] input[type=search],
html[data-skin] input[type=email],html[data-skin] input[type=password],html[data-skin] input[type=number],
html[data-skin] input[type=url],html[data-skin] textarea,html[data-skin] select{border-radius:var(--r-input)}
html[data-skin] .pl-btn,html[data-skin] .btn,html[data-skin] .sb-new,html[data-skin] .hdr-act,html[data-skin] .hdr-act-primary,
html[data-skin] .dash-empty-btn,html[data-skin] .ag-start,html[data-skin] .model-btn,html[data-skin] .copy-btn,
html[data-skin] .lib-filter-btn,html[data-skin] .pl-inbox-btn,html[data-skin] .pl-bp-pick,html[data-skin] .session-busy,
html[data-skin] .chat-head-chip,html[data-skin] .dash-card-badge,html[data-skin] .ag-badge,html[data-skin] .pl-quickadd-input{
  border-radius:var(--r-pill)!important}
html[data-skin] .sq,html[data-skin] .lcard .sq{border-radius:var(--r-m)}
html[data-skin] .hdr-sq,html[data-skin] .sb-open-btn{border-radius:var(--r-m)!important}
html[data-skin] .mwrap.user .bubble{border-radius:var(--r-bubble)}
html[data-skin] :focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:none}
html[data-skin] .inp:focus-within,html[data-skin] .inp.focus{border-color:var(--accent)}

/* главная кнопка: заливка акцентом, без свечения */
html[data-skin] .pl-btn-primary,html[data-skin] .dash-send,html[data-skin] .ag-start:hover,
html[data-skin] button.primary,html[data-skin] .btn-primary,html[data-skin] .btn:not(.ghost):not(.sec){
  background:var(--accent-fill);color:var(--on-accent);border-color:transparent;box-shadow:none!important}
html[data-skin] .pl-btn-primary:hover,html[data-skin] .dash-send:hover,html[data-skin] button.primary:hover,
html[data-skin] .btn-primary:hover{background:var(--accent-fill-hover)}
html[data-skin] .dash-send svg,html[data-skin] .pl-btn-primary svg{color:var(--on-accent);stroke:var(--on-accent)}
html[data-skin] .ag-start{background:var(--bg-well);border:1px solid var(--hairline)}
html[data-skin] .ag-start:hover{background:var(--accent-fill);color:var(--on-accent)}

/* ── вкладки, переключатели, чипсы: таблетки ── */
html[data-skin] .hdrc-tabs{background:var(--bg-well);border-radius:var(--r-pill);padding:4px;gap:2px;border:0}
html[data-skin] .hdrc-tab,html[data-skin][data-theme] .hdrc-tab.on,html[data-skin] .hdrc-tab.on{
  border-radius:var(--r-pill);border-bottom:0;text-transform:none;letter-spacing:0;font-size:13.5px;font-weight:500;
  color:var(--ink-soft);min-height:36px;padding:0 16px;background:transparent!important}
html[data-skin] .hdrc-tab:hover{color:var(--ink)}
html[data-skin] .hdrc-tab.on,html[data-skin][data-theme] .hdrc-tab.on{background:var(--skin-seg-on)!important;color:var(--ink);box-shadow:var(--shadow-card)}
html[data-skin] .seg,html[data-skin] .lib-switch,html[data-skin] .an-periods{background:var(--bg-well);border-radius:var(--r-pill);padding:4px;border:0}
html[data-skin] .seg button,html[data-skin] .lib-switch-btn,html[data-skin] .ate-type-btn,html[data-skin] .q-seg button,
html[data-skin] .rv-seg button,html[data-skin] .fab-tab,html[data-skin] .mem-subtab,html[data-skin] .skc-tab,
html[data-skin] .proj-tab,html[data-skin] .help-seg button,html[data-skin] .su-period-btn,html[data-skin] .kbc-seg button,
html[data-skin] .pl-bp-seg button{border-radius:var(--r-pill)!important;text-transform:none;letter-spacing:0}
html[data-skin][data-theme] .seg button.on,html[data-skin] .seg button.on,html[data-skin] .lib-switch-btn.on,
html[data-skin] .ate-type-btn.active,html[data-skin] .q-seg button.active,html[data-skin] .rv-seg button.active,
html[data-skin] .fab-tab.active,html[data-skin] .mem-subtab.active,html[data-skin] .skc-tab.active,
html[data-skin] .proj-tab.active,html[data-skin] .help-seg button.on,html[data-skin] .su-period-btn.on,
html[data-skin] .kbc-seg button.is-on,html[data-skin] .pl-bp-seg button.is-on{
  background:var(--skin-seg-on)!important;color:var(--ink);box-shadow:var(--shadow-card)}

/* ── сайдбар ── */
html[data-skin] .sb-item{border-radius:var(--r-m);color:var(--ink-soft)}
html[data-skin] .sb-item:hover{background:var(--bg-well);color:var(--ink)}
html[data-skin] .sb-item.active{background:var(--bg-well);color:var(--ink)}
html[data-skin] .sb-item.active svg{color:var(--accent-text)}
html[data-skin] .sb-item.active::before{content:none}
html[data-skin] .sb-new{background:var(--accent-fill)!important;color:var(--on-accent);border:0;text-transform:none;letter-spacing:0}
html[data-skin] .sb-new:hover{background:var(--accent-fill-hover)!important}
html[data-skin] .hdr-sq,html[data-skin][data-theme] .hdr-sq{background:var(--bg-elev)!important;border:1px solid var(--hairline);box-shadow:var(--shadow-card)!important}
html[data-skin] #appsb:not(.mobile-open){background:var(--bg-sidebar)}

/* ── меню, модалки, всплывашки ── */
html[data-skin] .pl-menu,html[data-skin] .msheet,html[data-skin][data-theme] .pl-menu,html[data-skin][data-theme] .msheet{
  border-radius:var(--r-pop);border:1px solid var(--hairline);background:var(--bg-elev);box-shadow:var(--shadow-float)}
html[data-skin] .modal,html[data-skin] .pl-modal,html[data-skin] .dialog,html[data-skin] [role=dialog]{border-radius:var(--r-pop)}
html[data-skin] .sheet,html[data-skin] .pl-sheet{border-radius:var(--r-pop) var(--r-pop) 0 0}

/* ── настройки: строки, группы ── */
html[data-skin] .set-block .set-row{border-color:var(--hairline-soft)}
html[data-skin] .set-row:has(#ui-theme-seg),html[data-skin] .set-row:has(#ui-accent-pick){display:none}

/* ── переключатель «Стиль» (Настройки → Общие) ── */
.skin-pick{display:flex;gap:10px;flex-wrap:wrap}
.skin-opt{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 8px 10px;min-width:92px;min-height:44px;
  background:transparent;border:1px solid var(--hairline);border-radius:var(--r-card,18px);color:var(--ink-soft);
  font:500 12.5px/1 var(--font-ui,Inter,sans-serif);cursor:pointer}
.skin-opt:hover{border-color:var(--hairline-strong);color:var(--ink)}
.skin-opt.on{border-color:var(--accent);color:var(--ink);box-shadow:0 0 0 1px var(--accent)}
.skin-sw{display:block;width:76px;height:44px;border-radius:12px;position:relative;border:1px solid rgba(128,128,128,.35)}
.skin-sw::after{content:"";position:absolute;right:7px;bottom:7px;width:14px;height:14px;border-radius:50%}
.skin-sw.s-cherry{background:linear-gradient(135deg,#43172A 55%,#2D2427 55%)}.skin-sw.s-cherry::after{background:#D93A47}
.skin-sw.s-smoke{background:linear-gradient(135deg,#232639 55%,#262A3D 55%)}.skin-sw.s-smoke::after{background:#C9F23B}
.skin-sw.s-bone{background:linear-gradient(135deg,#EAE4D7 55%,#F6F2E9 55%)}.skin-sw.s-bone::after{background:#C8202F}

/* поле внутри обёртки: рамку и фокус рисует обёртка, у самого поля ни второго контура, ни скругления */
html[data-skin] .inp{border-radius:var(--r-input)}
html[data-skin] .inp input,html[data-skin] .dash-input-wrap :is(input,textarea),html[data-skin] .irow :is(input,textarea){
  border-radius:0;outline:none;box-shadow:none;background:transparent}
html[data-skin] .inp input:focus-visible,html[data-skin] .dash-input-wrap :is(input,textarea):focus-visible,
html[data-skin] .irow :is(input,textarea):focus-visible{outline:none}