/* =========================================================
   StaxUp — liquid glass UI
   Палитра ограничена по яркости, чтобы текст на стекле
   держал контраст 4.5:1 в худшем случае.
   ========================================================= */

:root{
  color-scheme: dark;

  /* фон — потолок яркости #3A2A80 */
  --grad-1:#070A18; --grad-2:#131A3D; --grad-3:#241A4E; --grad-4:#2E2470;

  /* стекло */
  --glass-bg: rgba(255,255,255,.06);
  --glass-bg-strong: rgba(255,255,255,.09);
  --glass-bg-header: rgba(10,13,28,.78);
  --glass-blur: blur(24px) saturate(140%) brightness(.85);
  --hairline: rgba(255,255,255,.18);
  --border-control: rgba(255,255,255,.55);

  /* текст — только непрозрачные значения */
  --text-primary:#EDEFFA;
  --text-body:#E4E7F5;
  --text-secondary:#B4BBD8;
  --accent-text:#C4B5FD;
  --ok:#86EFAC; --warn:#FCD34D; --danger:#FCA5A5;

  --focus-ring:#FFFFFF; --focus-back:#0A0D1C;

  --header-h:68px;
  --r-lg:26px; --r-md:18px; --r-sm:12px;
  --shell:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

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

html{
  scroll-behavior:smooth;
  scroll-padding-top: calc(var(--header-h) + 20px);
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  min-height:100vh;
  font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size:17px;
  line-height:1.6;
  color:var(--text-body);
  background:var(--grad-1);
  font-feature-settings:"tnum" 0;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }

/* ---------- фон со свечением ---------- */
.bg{ position:fixed; inset:0; z-index:-1; overflow:hidden;
  background:
    radial-gradient(120% 80% at 12% -10%, var(--grad-3) 0%, transparent 60%),
    radial-gradient(90% 70% at 92% 4%, var(--grad-4) 0%, transparent 62%),
    linear-gradient(168deg, var(--grad-1) 0%, var(--grad-2) 48%, var(--grad-1) 100%);
}
.bg__blob{ position:absolute; border-radius:50%; filter:blur(90px); opacity:.55; }
.bg__blob--1{ width:min(46vw,620px); aspect-ratio:1; left:-8vw; top:-6vw; background:#2E2470;
  animation:drift1 34s var(--ease) infinite alternate; }
.bg__blob--2{ width:min(40vw,520px); aspect-ratio:1; right:-6vw; top:22vh; background:#1B2E6E;
  animation:drift2 41s var(--ease) infinite alternate; }
.bg__blob--3{ width:min(52vw,700px); aspect-ratio:1; left:30vw; bottom:-24vw; background:#25184A;
  animation:drift3 47s var(--ease) infinite alternate; }
.bg__grain{ position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E"); }

@keyframes drift1{ to{ transform:translate3d(6vw,5vh,0) scale(1.12); } }
@keyframes drift2{ to{ transform:translate3d(-7vw,-6vh,0) scale(1.08); } }
@keyframes drift3{ to{ transform:translate3d(4vw,-7vh,0) scale(1.15); } }

/* ---------- базовое стекло ---------- */
.glass{
  position:relative;
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border:1px solid var(--hairline);
  border-radius:var(--r-lg);
  box-shadow:0 18px 50px rgba(3,5,16,.45), inset 0 1px 0 rgba(255,255,255,.14);
}
/* блик по верхней кромке — как у Apple */
.glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 42%);
}

/* ---------- служебное ---------- */
.vh{ position:absolute!important; width:1px; height:1px; margin:-1px; padding:0; border:0;
  clip-path:inset(50%); overflow:hidden; white-space:nowrap; }
[hidden]{ display:none!important; }

.shell{ width:min(100% - 40px, var(--shell)); margin-inline:auto; }

:focus-visible{
  outline:2px solid var(--focus-ring);
  outline-offset:2px;
  box-shadow:0 0 0 4px var(--focus-back);
  border-radius:inherit;
}

.skip-link{
  position:fixed; top:12px; left:12px; z-index:200;
  transform:translateY(-160%);
  padding:12px 18px; border-radius:var(--r-sm);
  background:#EDEFFA; color:#0A0D1C; font-weight:600; text-decoration:none;
  transition:transform .18s var(--ease);
}
.skip-link:focus{ transform:none; }

/* ---------- шапка ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--glass-bg-header);
  -webkit-backdrop-filter:blur(22px) saturate(140%);
  backdrop-filter:blur(22px) saturate(140%);
  border-bottom:1px solid var(--hairline);
}
.site-header__inner{
  min-height:var(--header-h);
  display:flex; align-items:center; gap:24px;
}
.brand{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--text-primary); font-weight:700; letter-spacing:-.02em; }
.brand__mark svg rect{ fill:rgba(255,255,255,.10); }
.brand__mark svg path{ stroke:var(--accent-text); }
.brand__name{ font-size:19px; }

.site-nav{ margin-left:auto; }
.site-nav ul{ display:flex; gap:6px; margin:0; padding:0; list-style:none; }
.site-nav a{
  display:inline-flex; align-items:center; min-height:44px; padding:0 14px;
  border-radius:999px; color:var(--text-secondary); text-decoration:none; font-size:15px; font-weight:500;
  transition:background-color .18s var(--ease), color .18s var(--ease);
}
.site-nav a:hover{ background:rgba(255,255,255,.08); color:var(--text-primary); }

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:44px; padding:0 20px;
  border-radius:999px; border:1px solid transparent;
  font:inherit; font-size:15px; font-weight:600; text-decoration:none; cursor:pointer;
  touch-action:manipulation;
  transition:background-color .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease);
}
.btn:active{ transform:translateY(1px); }
.btn--primary{ background:#EDEFFA; color:#0A0D1C; }
.btn--primary:hover{ background:#FFFFFF; }
.btn--ghost{ background:rgba(255,255,255,.07); color:var(--text-primary); border-color:var(--border-control); }
.btn--ghost:hover{ background:rgba(255,255,255,.13); }
.btn--lg{ min-height:52px; padding:0 28px; font-size:16px; }
.site-header__cta{ flex:none; }

.icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; min-height:44px; padding:0;
  background:transparent; border:0; border-radius:999px;
  color:var(--text-secondary); cursor:pointer; touch-action:manipulation;
}
.icon-btn:hover{ color:var(--text-primary); background:rgba(255,255,255,.10); }

/* ---------- типографика ---------- */
h1,h2,h3{ color:var(--text-primary); letter-spacing:-.03em; line-height:1.1; margin:0; }
h1{ font-size:clamp(38px, 6.2vw, 68px); font-weight:700; }
h2{ font-size:clamp(28px, 3.6vw, 40px); font-weight:700; }
h3{ font-size:19px; font-weight:600; letter-spacing:-.01em; }
p{ margin:0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:500; letter-spacing:.04em; text-transform:uppercase;
  color:var(--text-secondary);
  padding:8px 14px; border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid var(--hairline);
}
.grad{
  background:linear-gradient(96deg,#C4B5FD 0%, #A5C8FF 52%, #EDEFFA 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
@supports not (background-clip:text){ .grad{ color:var(--accent-text); } }

/* ---------- герой ---------- */
.hero{ padding:clamp(56px,9vw,110px) 0 clamp(40px,6vw,72px); }
.hero h1{ margin:22px 0 0; max-width:16ch; }
.hero__lead{ margin-top:22px; max-width:60ch; font-size:clamp(16px,1.7vw,19px); color:var(--text-body); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }

.hero__stats{ display:flex; flex-wrap:wrap; gap:14px; margin:44px 0 0; padding:0; list-style:none; }
.stat-pill{ padding:18px 24px; border-radius:var(--r-md); min-width:180px; }
.stat-pill__num{ display:block; font-size:30px; font-weight:700; color:var(--text-primary); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.stat-pill__unit{ font-size:20px; }
.stat-pill__lbl{ display:block; margin-top:4px; font-size:14px; color:var(--text-secondary); }

/* ---------- заголовки секций ---------- */
.section-head{ margin-bottom:26px; }
.section-head__sub{ margin-top:10px; color:var(--text-secondary); font-size:16px; }

/* ---------- фильтры ---------- */
.catalog{ padding-top:clamp(24px,4vw,48px); scroll-margin-top:calc(var(--header-h) + 20px); }
.filters{ padding:18px; display:grid; gap:16px; }

.search{ position:relative; display:flex; align-items:center; }
.search__icon{ position:absolute; left:16px; color:var(--text-secondary); pointer-events:none; }
#q{
  width:100%; min-height:52px;
  padding:0 52px 0 46px;
  font:inherit; font-size:16px; color:var(--text-primary);
  background:rgba(10,13,28,.55);
  border:1px solid var(--border-control); border-radius:var(--r-md);
  transition:border-color .18s var(--ease), background-color .18s var(--ease);
}
#q::placeholder{ color:var(--text-secondary); opacity:1; }
#q:hover{ background:rgba(10,13,28,.7); }
#q::-webkit-search-cancel-button{ -webkit-appearance:none; display:none; }
#q-clear{ position:absolute; right:6px; }

.chips{ border:0; margin:0; padding:0; min-width:0; }
.chips__row{ display:flex; flex-wrap:wrap; gap:10px; }
.chip__input{ position:absolute!important; width:1px; height:1px; margin:-1px; padding:0; border:0; clip-path:inset(50%); overflow:hidden; }
.chip{
  display:inline-flex; align-items:center; gap:8px;
  min-height:44px; padding:0 18px;
  border-radius:999px; border:1px solid var(--border-control);
  background:rgba(255,255,255,.05);
  color:var(--text-body); font-size:15px; font-weight:500; cursor:pointer;
  touch-action:manipulation;
  transition:background-color .18s var(--ease), color .18s var(--ease);
}
.chip:hover{ background:rgba(255,255,255,.12); }
.chip__input:checked + .chip{
  background:#E9E4FF; color:#1B1640; font-weight:600; border-color:#E9E4FF;
}
.chip__input:checked + .chip::before{ content:"✓"; font-weight:700; }
.chip__input:focus-visible + .chip{
  outline:2px solid var(--focus-ring); outline-offset:2px; box-shadow:0 0 0 4px var(--focus-back);
}

.catalog__bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:16px;
  margin:22px 0 18px;
}
.results-count{ font-size:15px; color:var(--text-secondary); }
.sort{ margin-left:auto; display:flex; align-items:center; gap:10px; font-size:14px; color:var(--text-secondary); }
#sort{
  min-height:44px; padding:0 14px; font:inherit; font-size:14px;
  color:var(--text-primary); background:rgba(10,13,28,.6);
  border:1px solid var(--border-control); border-radius:var(--r-sm); cursor:pointer;
}

/* ---------- сетка карточек ---------- */
.grid{
  list-style:none; margin:0; padding:0;
  display:grid; gap:16px;
  grid-template-columns:repeat(auto-fill, minmax(330px, 1fr));
}
.offer{ display:flex; }
.offer__card{
  position:relative; display:flex; flex-direction:column; width:100%;
  padding:22px;
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border:1px solid var(--hairline); border-radius:var(--r-lg);
  box-shadow:0 18px 50px rgba(3,5,16,.4), inset 0 1px 0 rgba(255,255,255,.14);
  overflow:visible;
  transition:background-color .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease);
}
.offer__card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 40%);
}
.offer__card:hover{ background:var(--glass-bg-strong); transform:translateY(-3px); border-color:rgba(255,255,255,.28); }

.offer__top{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.offer__logo{
  width:44px; height:44px; flex:none;
  display:grid; place-items:center;
  border-radius:13px; background:#FFFFFF; overflow:hidden;
}
.offer__logo img{ width:30px; height:30px; object-fit:contain; }
.offer__logo--mono{ font-weight:700; font-size:16px; color:#0A0D1C; background:#E9E4FF; }
.offer__brand{ font-size:14px; color:var(--text-secondary); }
.offer__badge{
  margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:999px;
  font-size:12px; font-weight:600; letter-spacing:.02em;
  background:rgba(196,181,253,.18); color:#DDD3FF; border:1px solid rgba(196,181,253,.42);
}
.offer__title{ margin-bottom:16px; font-size:20px; }

.offer__stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:0 0 16px; }
.offer__stats .stat{ padding:12px; border-radius:var(--r-sm); background:rgba(10,13,28,.42); border:1px solid rgba(255,255,255,.10); }
.offer__stats dt{ font-size:12px; color:var(--text-secondary); margin-bottom:4px; }
.offer__stats dd{ margin:0; font-size:17px; font-weight:700; color:var(--text-primary); letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.25; }
.offer__stats dd .u{ font-size:13px; font-weight:600; }

.offer__note{ font-size:14px; color:var(--text-secondary); margin-bottom:18px; white-space:pre-line; }

.offer__foot{ margin-top:auto; display:flex; align-items:center; gap:14px; }
.offer__approval{ font-size:13px; color:var(--text-secondary); }
.offer__approval b{ color:var(--ok); font-variant-numeric:tabular-nums; }
.offer__cta{
  margin-left:auto; display:inline-flex; align-items:center; gap:8px;
  min-height:44px; padding:0 20px; border-radius:999px;
  background:#EDEFFA; color:#0A0D1C; font-size:15px; font-weight:600; text-decoration:none;
  transition:background-color .18s var(--ease);
}
.offer__cta:hover{ background:#FFFFFF; }

.empty{ padding:34px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:18px; color:var(--text-body); }

/* ---------- шаги ---------- */
.how{ padding-top:clamp(56px,8vw,104px); scroll-margin-top:calc(var(--header-h) + 20px); }
.steps{ list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); counter-reset:s; }
.step{ padding:26px; }
.step__num{ display:block; font-size:13px; font-weight:700; letter-spacing:.12em; color:var(--accent-text); margin-bottom:14px; }
.step h3{ margin-bottom:8px; }
.step p{ color:var(--text-secondary); font-size:15px; }

/* ---------- FAQ ---------- */
.faq{ padding-top:clamp(56px,8vw,104px); padding-bottom:clamp(56px,8vw,104px); scroll-margin-top:calc(var(--header-h) + 20px); }
.faq__list{ display:grid; gap:12px; }
.faq__item{ padding:0; overflow:hidden; }
.faq__item summary{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  min-height:60px; padding:14px 24px;
  font-size:17px; font-weight:600; color:var(--text-primary); cursor:pointer;
  list-style:none;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{
  content:""; flex:none; width:11px; height:11px;
  border-right:2px solid var(--text-secondary); border-bottom:2px solid var(--text-secondary);
  transform:rotate(45deg) translateY(-3px);
  transition:transform .2s var(--ease);
}
.faq__item[open] summary::after{ transform:rotate(225deg) translateY(-3px); }
.faq__item p{ padding:0 24px 22px; color:var(--text-secondary); font-size:15px; max-width:78ch; }

/* ---------- подвал ---------- */
.site-footer{
  margin-top:24px; padding:44px 0 40px;
  background:rgba(7,10,24,.72);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  border-top:1px solid var(--hairline);
}
.site-footer__top{ display:flex; flex-wrap:wrap; align-items:center; gap:20px; padding-bottom:26px; border-bottom:1px solid rgba(255,255,255,.10); }
.site-footer nav{ margin-left:auto; }
.site-footer nav ul{ display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none; }
.site-footer nav a{
  display:inline-flex; align-items:center; min-height:44px; padding:0 12px; border-radius:999px;
  color:var(--text-secondary); text-decoration:none; font-size:14px;
}
.site-footer nav a:hover{ color:var(--text-primary); background:rgba(255,255,255,.08); }

.disclaimer{ padding:26px 0 0; max-width:88ch; scroll-margin-top:calc(var(--header-h) + 20px); }
.disclaimer h2{ font-size:15px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text-secondary); margin-bottom:12px; }
.disclaimer p{ font-size:13.5px; line-height:1.65; color:var(--text-secondary); margin-bottom:10px; }
.copy{ margin-top:22px; font-size:13px; color:var(--text-secondary); }

/* =========================================================
   Админка
   ========================================================= */
.admin-main{ padding:32px 0 80px; }
.admin-head{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:22px; }
.admin-head h1{ font-size:clamp(28px,4vw,40px); }
.admin-head__actions{ margin-left:auto; display:flex; flex-wrap:wrap; gap:10px; }

.admin-hint{ padding:18px 22px; margin-bottom:20px; font-size:14.5px; color:var(--text-body); }
.admin-hint b{ color:var(--text-primary); }
.admin-hint ol{ margin:10px 0 0; padding-left:22px; color:var(--text-secondary); }
.admin-hint li{ margin-bottom:4px; }

.admin-card{ padding:24px; margin-bottom:20px; }
.admin-card h2{ font-size:22px; }
.admin-card__head{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
.admin-card__head h2{ margin-right:auto; }
.admin-card .section-head__sub{ margin:10px 0 18px; font-size:14px; }
.admin-section-title{ font-size:22px; margin:34px 0 16px; }

.site-form{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; margin-top:16px; }
.site-form .field{ flex:1 1 260px; max-width:420px; }

.table-wrap--plain{ border-radius:var(--r-md); border:1px solid rgba(255,255,255,.10); }
table.cat-table{ min-width:560px; }
.cat-table th[scope="row"]{ font-size:15px; font-weight:600; color:var(--text-primary); text-transform:none; letter-spacing:0; }
.cat-table code{ font-size:13px; color:var(--text-secondary); }
.cat-table .cell-brand{ display:inline; }
.cat-table .hint{ font-size:13px; color:var(--text-secondary); }

.admin-toolbar{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:16px; }
.admin-toolbar input[type="search"]{
  min-height:44px; min-width:260px; padding:0 14px; font:inherit; font-size:15px;
  color:var(--text-primary); background:rgba(10,13,28,.6);
  border:1px solid var(--border-control); border-radius:var(--r-sm);
}
.admin-count{ font-size:14px; color:var(--text-secondary); }

.table-wrap{ overflow-x:auto; border-radius:var(--r-lg); }
table.admin-table{ width:100%; border-collapse:collapse; min-width:820px; }
.admin-table caption{ text-align:left; padding:16px 18px; font-size:14px; color:var(--text-secondary); }
.admin-table th, .admin-table td{ padding:12px 14px; text-align:left; border-bottom:1px solid rgba(255,255,255,.10); vertical-align:middle; font-size:14.5px; }
.admin-table th{ font-size:13px; font-weight:600; color:var(--text-secondary); letter-spacing:.03em; text-transform:uppercase; white-space:nowrap; }
.admin-table td b{ color:var(--text-primary); }
.admin-table .cell-brand{ color:var(--text-secondary); font-size:13px; }
.admin-table .row-actions{ display:flex; gap:8px; justify-content:flex-end; }
.admin-table tr:last-child td{ border-bottom:0; }
.btn--sm{ min-height:40px; padding:0 14px; font-size:14px; }
.btn--danger{ background:rgba(252,165,165,.14); color:#FCA5A5; border-color:rgba(252,165,165,.5); }
.btn--danger:hover{ background:rgba(252,165,165,.24); }

.tag{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:600;
  background:rgba(196,181,253,.16); color:#DDD3FF; border:1px solid rgba(196,181,253,.4); }

/* формы */
dialog{
  padding:0; border:0; max-width:min(720px, calc(100vw - 32px)); width:100%;
  background:transparent; color:var(--text-body);
}
dialog::backdrop{ background:rgba(5,7,18,.72); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.dialog-panel{
  background:rgba(19,22,48,.94);
  -webkit-backdrop-filter:blur(28px) saturate(140%); backdrop-filter:blur(28px) saturate(140%);
  border:1px solid var(--hairline); border-radius:var(--r-lg);
  box-shadow:0 30px 80px rgba(2,4,14,.6);
  padding:26px;
  max-height:min(86vh, 900px); overflow:auto;
}
.dialog-panel h2{ font-size:24px; margin-bottom:6px; }
.dialog-panel__sub{ color:var(--text-secondary); font-size:14px; margin-bottom:20px; }

.field-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.field--full{ grid-column:1/-1; }
.field label{ font-size:14px; font-weight:500; color:var(--text-body); }
.field .req{ color:var(--danger); }
.field input, .field select, .field textarea{
  min-height:46px; padding:10px 14px; font:inherit; font-size:15px;
  color:var(--text-primary); background:rgba(10,13,28,.75);
  border:1px solid var(--border-control); border-radius:var(--r-sm);
  width:100%;
}
.field textarea{ resize:vertical; min-height:76px; }
.field input::placeholder, .field textarea::placeholder{ color:var(--text-secondary); opacity:1; }
.field .hint{ font-size:12.5px; color:var(--text-secondary); }
.field .err{ font-size:13px; color:var(--danger); }
.field input[aria-invalid="true"], .field select[aria-invalid="true"]{ border-color:var(--danger); }
input:-webkit-autofill{ -webkit-text-fill-color:var(--text-primary); box-shadow:inset 0 0 0 1000px rgba(10,13,28,.95); }

.error-summary{
  margin-bottom:18px; padding:16px 18px; border-radius:var(--r-md);
  background:rgba(252,165,165,.12); border:1px solid rgba(252,165,165,.5); color:#FFE1E1;
}
.error-summary h3{ font-size:16px; color:#FFE1E1; margin-bottom:8px; }
.error-summary ul{ margin:0; padding-left:20px; }
.error-summary a{ color:#FFE1E1; }

.dialog-foot{ display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; margin-top:24px; }

.stats-editor{ display:grid; gap:12px; }
.stat-row{ display:grid; gap:10px; grid-template-columns:1.1fr 1fr .7fr; }

.toast{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%);
  z-index:300; display:flex; align-items:center; gap:14px;
  padding:14px 18px; border-radius:var(--r-md);
  background:rgba(19,22,48,.96); border:1px solid var(--hairline);
  box-shadow:0 20px 50px rgba(2,4,14,.55); color:var(--text-primary); font-size:15px;
  max-width:calc(100vw - 32px);
}

/* ---------- адаптив ---------- */
@media (max-width:860px){
  .site-nav{ display:none; }
  .site-header__cta{ margin-left:auto; }
  .offer__stats{ grid-template-columns:repeat(3,1fr); }
  .stat-row{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  body{ font-size:16px; }
  .hero__stats .stat-pill{ flex:1 1 100%; }
  .offer__stats{ grid-template-columns:1fr 1fr; }
  .offer__foot{ flex-wrap:wrap; }
  .offer__cta{ margin-left:0; width:100%; }
  .catalog__bar .sort{ margin-left:0; width:100%; }
}
@media (max-height:450px){
  .site-header{ position:static; }
}

/* ---------- деградации и доступность ---------- */
@supports not ((backdrop-filter: blur(24px)) or (-webkit-backdrop-filter: blur(24px))){
  :root{ --glass-bg:#171438; --glass-bg-strong:#1D1943; --glass-bg-header:#12102E; }
  .offer__card{ background:#171438; }
}
@media (prefers-reduced-transparency: reduce){
  :root{ --glass-bg:#171438; --glass-bg-strong:#1D1943; --glass-bg-header:#12102E; }
  .glass, .offer__card, .site-header, .site-footer, .dialog-panel{ backdrop-filter:none; -webkit-backdrop-filter:none; }
  .offer__card{ background:#171438; }
  .bg__blob{ display:none; }
}
@media (prefers-contrast: more){
  :root{
    --glass-bg:#12102E; --glass-bg-strong:#181545; --glass-bg-header:#0C0A24;
    --text-body:#FFFFFF; --text-secondary:#E4E7F5;
    --hairline:rgba(255,255,255,.5); --border-control:rgba(255,255,255,.9);
  }
  body{ background:#0A0D1C; }
  .glass, .offer__card{ backdrop-filter:none; -webkit-backdrop-filter:none; background:#12102E; }
  .bg__blob{ display:none; }
}
@media (forced-colors: active){
  .glass, .offer__card, .chip, .site-header, .site-footer, .dialog-panel, #q, #sort, .field input, .field select{
    background:Canvas; color:CanvasText; border:1px solid CanvasText;
    backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none;
  }
  .bg{ display:none; }
  :focus-visible{ outline:3px solid CanvasText; box-shadow:none; }
  .chip__input:checked + .chip{ background:Highlight; color:HighlightText; }
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important; animation-iteration-count:1!important;
    transition-duration:.01ms!important; scroll-behavior:auto!important;
  }
  .bg__blob{ animation:none!important; }
  html{ scroll-behavior:auto; }
}

/* ======================================================
   Экран входа (admin) + секция публикации
   ====================================================== */
.login-gate{
  position:fixed; inset:0; z-index:150;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.login-card{
  width:min(100%, 420px);
  padding:34px 30px;
  text-align:center;
}
.login-card__logo{
  display:inline-flex; align-items:center; justify-content:center;
  width:60px; height:60px; margin:0 auto 16px;
}
.login-card__logo svg rect{ fill:var(--grad-3); }
.login-card__logo svg path{ stroke:var(--text-primary); }
.login-card h1{ font-size:26px; }
.login-card__sub{ margin:8px 0 22px; font-size:15px; }
.login-card .field{ text-align:left; margin-bottom:16px; }
.login-card__err{
  text-align:left; margin:0 0 16px; padding:12px 14px;
  border:1px solid rgba(252,165,165,.5); border-radius:var(--r-sm);
  background:rgba(252,165,165,.12); color:var(--danger); font-size:14px;
}
.btn--block{ width:100%; }

/* ---- секция публикации ---- */
.publish-card{ border:1px solid rgba(196,181,253,.28); }
.conn-status{ font-size:14px; font-weight:600; color:var(--text-secondary); margin:0; }
.conn-status[data-state="on"]{ color:var(--ok); }
.conn-status[data-state="off"]{ color:var(--warn); }
/* "unknown" — токен лежит в браузере, но доступ ещё не проверяли.
   Цвет намеренно нейтральный (--text-secondary, ~8:1), новых токенов не заводим. */
.conn-status[data-state="unknown"]{ color:var(--text-secondary); }

.token-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.err-detail{
  margin:10px 0 0; padding:12px 14px; font-size:13.5px; line-height:1.55;
  color:var(--text-secondary); border:1px solid var(--hairline); border-radius:12px;
}
.err-detail p{ margin:0 0 8px; }
.err-detail p:last-child{ margin-bottom:0; }
/* Состояние "занято" — без opacity, чтобы не гасить кольцо фокуса (1.4.11 / 2.4.13). */
.btn.is-busy{ filter:saturate(.6); cursor:progress; }
.publish-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.publish-btn-busy{ opacity:.7; }
.publish-status{
  margin:0; font-size:14px; font-weight:500;
}
.publish-status[data-state="ok"]{ color:var(--ok); }
.publish-status[data-state="err"]{ color:var(--danger); }
.publish-status[data-state="busy"]{ color:var(--text-secondary); }

.publish-setup{ margin-top:22px; border-top:1px solid var(--hairline); padding-top:16px; }
.publish-setup > summary{
  cursor:pointer; font-weight:600; font-size:15px; color:var(--text-primary);
  padding:6px 4px; border-radius:var(--r-sm); list-style-position:inside;
}
.publish-setup > summary:hover{ color:#fff; }
.publish-setup__once{ font-weight:400; color:var(--text-secondary); font-size:13px; }
.publish-setup__body{ padding:16px 4px 4px; }
.token-row{ display:flex; gap:10px; align-items:stretch; }
.token-row input{ flex:1 1 auto; min-width:0; }
.token-row .btn{ flex:0 0 auto; white-space:nowrap; }
.publish-help{
  margin-top:20px; padding:16px 18px;
  background:var(--glass-bg); border:1px solid var(--hairline); border-radius:var(--r-md);
}
.publish-help h3{ font-size:15px; margin:0 0 10px; color:var(--text-primary); }
.publish-help ol{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:8px; }
.publish-help li{ font-size:14px; color:var(--text-body); line-height:1.5; }
.publish-help a{ color:var(--accent-text); }

@media (max-width:520px){
  .token-row{ flex-wrap:wrap; }
  .token-row .btn{ width:100%; }
}

/* ======================================================
   Админка: двухколоночная раскладка с живым предпросмотром
   ====================================================== */
.admin-layout{
  width:min(100% - 40px, 1560px); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,1fr) 460px; gap:28px; align-items:start;
}
.editor-col{ min-width:0; }
.preview-col{ position:sticky; top:calc(var(--header-h) + 16px); }
.preview-panel{ padding:16px; }
.preview-panel__head{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.preview-panel__head h2{ font-size:18px; margin-right:auto; }
.preview-panel__hint{ font-size:13px; color:var(--text-secondary); margin:10px 0 12px; }
.preview-frame-wrap{ border:1px solid var(--hairline); border-radius:var(--r-md); overflow:hidden; background:#070A18; }
.preview-frame{ display:block; width:100%; height:min(72vh, 780px); border:0; }
.preview-open{ margin-top:12px; }
@media (max-width:1080px){
  .admin-layout{ grid-template-columns:1fr; width:min(100% - 40px, var(--shell)); }
  .preview-col{ position:static; }
  .preview-frame{ height:70vh; }
}

/* ======================================================
   Мобильное свечение фона — насыщенное, как на ПК.
   Радиальные засветы распределены по всему экрану и не
   зависят от «пятен» (работает даже при reduced-transparency).
   Яркость в пределах палитры (потолок #3A2A80) — контраст 4.5:1 сохраняется.
   ====================================================== */
@media (max-width:700px){
  .bg{
    background:
      radial-gradient(120% 42% at 50% -6%,  var(--grad-3) 0%, transparent 62%),
      radial-gradient(95% 40% at 108% 24%,  var(--grad-4) 0%, transparent 60%),
      radial-gradient(95% 40% at -8% 52%,   #1B2E6E    0%, transparent 60%),
      radial-gradient(120% 46% at 50% 108%, var(--grad-3) 0%, transparent 62%),
      linear-gradient(168deg, var(--grad-1) 0%, var(--grad-2) 50%, var(--grad-1) 100%);
  }
  .bg__blob{ opacity:.5; filter:blur(72px); }
  .bg__blob--1{ width:82vw; left:-22vw; top:-12vw; }
  .bg__blob--2{ width:74vw; right:-24vw; top:26vh; }
  .bg__blob--3{ width:96vw; left:2vw; bottom:-34vw; }
}