/* ═══════════════════════════════════════════════════════════════════════════
   Stars — общее оформление: шапка с четырьмя сервисами, подвал, кнопки, карточки, поля, шторки.
   Витрина (главная) — «космос»: тёмная туманность, золото, заголовки Georgia с цветным переливом.
   Рабочие экраны (Налоги, CRM, Документы, Промпты) — светлые: так цифры читаются лучше; цвет сервиса — в акцентах.
   Цвета сервисов: Налоги — золотой, CRM — красный, Документы — голубой, Промпты — фиолетовый.
   ═══════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:Golos;font-weight:400;font-display:swap;src:url(/fonts/golos-cyrillic-400.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Golos;font-weight:500;font-display:swap;src:url(/fonts/golos-cyrillic-500.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Golos;font-weight:600;font-display:swap;src:url(/fonts/golos-cyrillic-600.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Golos;font-weight:700;font-display:swap;src:url(/fonts/golos-cyrillic-700.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Golos;font-weight:400;font-display:swap;src:url(/fonts/golos-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD}
@font-face{font-family:Golos;font-weight:500;font-display:swap;src:url(/fonts/golos-latin-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD}
@font-face{font-family:Golos;font-weight:600;font-display:swap;src:url(/fonts/golos-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD}
@font-face{font-family:Golos;font-weight:700;font-display:swap;src:url(/fonts/golos-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD}
@font-face{font-family:StarsMono;font-weight:400;font-display:swap;src:url(/fonts/mono-latin-400.woff2) format("woff2")}
@font-face{font-family:StarsMono;font-weight:500;font-display:swap;src:url(/fonts/mono-latin-500.woff2) format("woff2")}

:root{
  --font:Golos,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --display:Georgia,"Times New Roman",serif;
  --mono:StarsMono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --gold:#E8B84B; --gold-2:#F2CB73; --gold-ink:#7A5600;
  --c-nalogi:#E8B84B; --c-crm:#E0574A; --c-doc:#4FA6E8; --c-promty:#8B6CF6;
  --ink-nalogi:#6B4A00; --ink-crm:#9E2F25; --ink-doc:#145C93; --ink-promty:#5534C4;
  --night:#07060F; --night-2:#0D0B1A; --night-3:#231B3E;
  /* рабочие экраны (светлые) */
  --bg:#FAF8F5; --card:#fff; --text:#1C1A26; --text-2:#4A4658; --text-3:#6F6A80; --line:#E7E2EC; --line-2:#D6D0DE;
  --accent:#C99A33; --accent-ink:#6B4A00; --accent-wash:#FFF6DA;
  --ok:#16794A; --ok-wash:#E7F6EE; --bad:#B42318; --bad-wash:#FDECEA; --warn:#8A5A00; --warn-wash:#FFF4D6;
  --r:14px; --r-lg:20px; --r-xl:26px;
  --shadow:0 10px 28px -18px rgba(28,20,60,.45);
  --ring:0 0 0 3px rgba(232,184,75,.5);
  --head-h:104px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
html.noscroll{overflow:hidden}
body{margin:0;font:16px/1.5 var(--font);color:var(--text);background:var(--bg);min-height:100vh;-webkit-font-smoothing:antialiased}
img,svg,canvas{max-width:100%}
a{color:var(--accent-ink)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.01em;line-height:1.15;margin:0 0 .4em}
h1{font-size:clamp(28px,4.4vw,44px)} h2{font-size:clamp(22px,3vw,30px)} h3{font-size:19px}
p{margin:0 0 .8em}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:8px;z-index:999;background:#fff;color:#000;padding:8px 12px;border-radius:8px}
.skip:focus{left:8px}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.mut{color:var(--text-3)} .small{font-size:13.5px} .tiny{font-size:12.5px}
.nowrap{white-space:nowrap}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ─────────── шапка: бренд, номер в сервисе, кнопки, четыре сервиса ─────────── */
.hd{position:sticky;top:0;z-index:50;background:linear-gradient(135deg,var(--night-2),var(--night-3));border-bottom:2px solid var(--gold);
  box-shadow:0 10px 30px rgba(0,0,0,.35);color:#fff}
.hd-in{max-width:1180px;margin:0 auto;padding:8px 16px 10px}
.hd-top{display:flex;align-items:center;gap:8px;min-height:40px}
.brand{display:inline-flex;align-items:center;gap:7px;font:700 20px/1 var(--display);color:#fff;text-decoration:none;margin-right:auto}
.brand b{color:var(--gold);font-size:22px}
.idb{display:inline-flex;align-items:center;gap:6px;border:1px dashed rgba(255,255,255,.35);background:rgba(255,255,255,.06);
  border-radius:10px;padding:5px 10px;font:500 13px/1 var(--mono);color:#fff;cursor:pointer;min-height:32px}
.idb i{font-style:normal;color:var(--gold);font-size:10.5px;letter-spacing:.08em}
.hb{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:8px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);color:#fff;font-weight:500;font-size:14px;text-decoration:none;cursor:pointer;white-space:nowrap}
.hb:hover{background:rgba(255,255,255,.14)}
.hb.install{background:#1E7F55;border-color:#1E7F55}
.hb.cab{background:var(--gold);border-color:var(--gold);color:#1A1330}
.hb.cab:hover{background:var(--gold-2)}
.tabs4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.tab4{--c:var(--gold);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:44px;padding:5px 6px;
  border-radius:12px;border:1px solid color-mix(in srgb,var(--c) 60%,transparent);background:color-mix(in srgb,var(--c) 15%,rgba(255,255,255,.04));
  color:#fff;text-decoration:none;font-weight:600;font-size:14px;line-height:1.1;transition:background .15s,box-shadow .15s}
.tab4 small{font-size:9.5px;letter-spacing:.14em;opacity:.85;font-weight:700}
.tab4:hover{background:color-mix(in srgb,var(--c) 32%,rgba(255,255,255,.04))}
.tab4[aria-current="page"]{background:color-mix(in srgb,var(--c) 72%,#000 0%);box-shadow:0 6px 18px -6px var(--c)}
.tab4.nalogi{--c:var(--c-nalogi)} .tab4.crm{--c:var(--c-crm)} .tab4.doc{--c:var(--c-doc)} .tab4.promty{--c:var(--c-promty)}
.tab4.nalogi[aria-current="page"]{color:#2A1D00}
@media (max-width:640px){
  .hd{position:relative}
  .hb .lbl{display:none}
  .hb{padding:8px 10px}
  .idb{font-size:12px;padding:5px 8px}
  .tab4{font-size:12.5px;min-height:40px}
}

/* ─────────── подвал: разделы и реквизиты продавца ─────────── */
.ft{background:#0A0914;color:#C8C2E2;margin-top:48px;border-top:1px solid rgba(232,184,75,.3)}
.ft-links{background:#F7F6FA;color:#2F2B3A;padding:16px 0;text-align:center}
.ft-links nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px}
.ft .ft-links a{color:#3B2A72;text-decoration:none;border-bottom:1px solid #C9D8CF;padding:3px 0;font-size:14.5px}
.ft .ft-links p{margin:10px 0 0;font-size:13px;color:#5B566A}
.ft-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;padding:28px 16px 36px;max-width:1180px;margin:0 auto}
.ft h2{font:600 15px/1.2 var(--font);letter-spacing:.16em;text-transform:uppercase;color:#8C87A6;margin:0 0 12px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin:0 0 9px}
.ft a{color:#DCD6F5;text-decoration:none}
.ft a:hover{color:var(--gold)}
.ft dl{display:grid;grid-template-columns:150px 1fr;gap:6px 14px;margin:0;font-size:14.5px}
.ft dt{color:#8C87A6;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding-top:2px}
.ft dd{margin:0;color:#F4F2FF}
.ft .note{font-size:13px;color:#9C96BE;margin-top:14px}
@media (max-width:520px){.ft dl{grid-template-columns:1fr}.ft dt{padding-top:6px}}

/* кнопка поддержки в углу */
.fab{position:fixed;right:16px;bottom:16px;z-index:40;width:56px;height:56px;border-radius:50%;border:1px solid rgba(232,184,75,.6);
  background:#130F24;color:#fff;font-size:24px;display:grid;place-items:center;box-shadow:0 10px 28px -8px rgba(0,0,0,.6);text-decoration:none}
.fab:hover{background:#1E1838}

/* ─────────── кнопки ─────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 18px;border-radius:13px;border:0;
  background:linear-gradient(135deg,var(--gold),#FF9A6A);color:#1A1330;font-weight:700;font-size:15.5px;cursor:pointer;text-decoration:none;
  transition:transform .12s,filter .12s;text-align:center}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.55;cursor:default;filter:none}
.btn.busy{opacity:.7;cursor:progress}
.btn.full{width:100%}
.btn.ghost{background:transparent;color:inherit;border:1.5px solid currentColor;font-weight:600}
.btn.soft{background:var(--accent-wash);color:var(--accent-ink)}
.btn.dark{background:#1A1330;color:#fff}
.btn.danger{background:var(--bad);color:#fff}
.btn.small{min-height:38px;padding:7px 13px;font-size:14px;border-radius:11px}
.btn.svc{background:var(--accent);color:#fff}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btns.col{flex-direction:column}
.link{background:none;border:0;padding:0;color:var(--accent-ink);text-decoration:underline;cursor:pointer;font:inherit}

/* ─────────── карточки и поля (рабочие экраны) ─────────── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;box-shadow:var(--shadow)}
.card h2,.card h3{margin-top:0}
.card.flat{box-shadow:none}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);background:#fff;border-radius:999px;padding:6px 12px;font-size:14px;
  color:var(--text);text-decoration:none;cursor:pointer;min-height:36px}
.chip:hover{border-color:var(--accent)}
.chip[aria-pressed="true"],.chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;background:var(--accent-wash);color:var(--accent-ink)}
.badge.ok{background:var(--ok-wash);color:var(--ok)} .badge.bad{background:var(--bad-wash);color:var(--bad)} .badge.warn{background:var(--warn-wash);color:var(--warn)}
.note{border-radius:var(--r);padding:12px 14px;background:var(--accent-wash);color:var(--accent-ink);font-size:14.5px}
.note.ok{background:var(--ok-wash);color:var(--ok)} .note.bad{background:var(--bad-wash);color:var(--bad)} .note.warn{background:var(--warn-wash);color:var(--warn)}
.field{display:block;margin:0 0 12px}
.field>span{display:flex;justify-content:space-between;gap:8px;margin-bottom:5px;font-size:13.5px;color:var(--text-2)}
.field .req{color:var(--bad);font-style:normal;margin-left:3px}
.field small{color:var(--text-3)}
.field .hint{font-size:12.5px;color:var(--text-3);margin-top:4px}
.field .err{font-size:13px;color:var(--bad);margin-top:4px;font-weight:600}
input[type=text],input[type=tel],input[type=email],input[type=number],input[type=search],input[type=date],input[type=time],input:not([type]),select,textarea{
  width:100%;min-height:46px;padding:11px 12px;border:1.5px solid var(--line-2);border-radius:12px;background:#fff;color:var(--text);font-size:16px}
textarea{min-height:96px;resize:vertical;line-height:1.45}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.field.bad input,.field.bad textarea{border-color:var(--bad)}
.money{position:relative}
.money::after{content:"₽";position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--text-3)}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{min-height:40px;padding:7px 12px;border-radius:11px;border:1.5px solid var(--line-2);background:#fff;cursor:pointer;font-size:14.5px}
.seg button.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;cursor:pointer}
.toggle b{display:block;font-weight:600} .toggle em{display:block;font-style:normal;font-size:13px;color:var(--text-3)}
.sw{flex:0 0 auto;width:46px;height:28px;border-radius:999px;background:#CFC9D9;position:relative;transition:background .15s}
.sw::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.sw.on{background:var(--ok)} .sw.on::after{transform:translateX(18px)}
.list-row{display:flex;align-items:center;gap:12px;width:100%;padding:12px 4px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;
  cursor:pointer;color:inherit;text-decoration:none}
.list-row>i{font-style:normal;font-size:20px;width:28px;text-align:center}
.list-row span{flex:1}.list-row b{display:block;font-weight:600}.list-row em{display:block;font-style:normal;font-size:13px;color:var(--text-3)}
.list-row u{text-decoration:none;color:var(--text-3);font-size:20px}
.table{width:100%;border-collapse:collapse;font-size:14.5px}
.table th,.table td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.table th{font-size:12.5px;color:var(--text-3);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.table td.num,.table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.scrollx{overflow-x:auto;-webkit-overflow-scrolling:touch}
.empty{text-align:center;padding:28px 12px;color:var(--text-2)}
.empty .em-ic{font-size:34px;margin-bottom:6px}
.empty b{display:block;font-size:17px;margin-bottom:4px;color:var(--text)}
.spin{width:30px;height:30px;margin:24px auto;border-radius:50%;border:3px solid var(--line-2);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.steps{display:flex;gap:6px}.steps i{flex:1;height:4px;border-radius:4px;background:var(--line)}.steps i.on{background:var(--accent)}
.ava{display:inline-grid;place-items:center;border-radius:50%;background:var(--accent-wash);color:var(--accent-ink);font-weight:700;overflow:hidden;flex:0 0 auto}
.ava img{width:100%;height:100%;object-fit:cover}

/* ─────────── шторки и сообщения ─────────── */
.mask{position:fixed;inset:0;z-index:100;background:rgba(10,8,22,.55);display:flex;align-items:flex-end;justify-content:center;animation:fade .15s}
.mask.top{background:rgba(10,8,22,.35)}
.sheet{position:relative;width:100%;max-width:560px;max-height:92vh;overflow:auto;background:#fff;color:var(--text);border-radius:22px 22px 0 0;
  padding:22px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.3);animation:up .18s ease-out}
.sheet.wide{max-width:860px}
.sheet h2{font-size:23px;padding-right:36px}
.sheet .sh-lead{color:var(--text-2)}
.grab{width:44px;height:5px;border-radius:5px;background:#D9D4E2;margin:-10px auto 12px}
.sh-x{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;border:0;background:#F1EEF6;cursor:pointer;font-size:16px}
@media (min-width:720px){.mask{align-items:center}.sheet{border-radius:22px;max-height:88vh}.grab{display:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:200;max-width:min(92vw,520px);
  background:#1A1330;color:#fff;padding:12px 16px;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.35);font-size:15px}
.toast.bad{background:var(--bad)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ─────────── рабочие экраны: фон и акцент сервиса ─────────── */
body.svc-nalogi{--bg:#FFFBEC;--accent:#C99A33;--accent-ink:#6B4A00;--accent-wash:#FFF2C7}
body.svc-crm{--bg:#FFF6F5;--accent:#C8473B;--accent-ink:#9E2F25;--accent-wash:#FDE7E4}
body.svc-doc{--bg:#EEF6FD;--accent:#2378C0;--accent-ink:#145C93;--accent-wash:#DCEEFC}
body.svc-promty{--bg:#F5F3FF;--accent:#6E4EE0;--accent-ink:#5534C4;--accent-wash:#E9E3FF}
body.svc-store{--bg:#F8F6FC;--accent:#6E4EE0;--accent-ink:#5534C4;--accent-wash:#ECE7FA}
.page{padding-top:22px;padding-bottom:12px}
.hero-svc{border-radius:var(--r-xl);padding:26px 22px;color:#fff;margin-bottom:18px;
  background:linear-gradient(135deg,var(--hero-a,#3B2A72),var(--hero-b,#C8473B));box-shadow:0 20px 50px -30px rgba(40,20,80,.7)}
.hero-svc h1{color:#fff;margin-bottom:8px}
.hero-svc p{color:rgba(255,255,255,.92);max-width:760px}
.hero-svc .btn.ghost{color:#fff}
body.svc-nalogi .hero-svc{--hero-a:#7A5600;--hero-b:#D9A62E}
body.svc-crm .hero-svc{--hero-a:#5B1830;--hero-b:#C8473B}
body.svc-doc .hero-svc{--hero-a:#123E6B;--hero-b:#2F86CF}
body.svc-promty .hero-svc{--hero-a:#2E1B6B;--hero-b:#7B5CF0}
body.svc-store .hero-svc{--hero-a:#241A4F;--hero-b:#6E4EE0}
.sec{margin:26px 0}
.sec>h2{margin-bottom:6px}
.sec>.lead{color:var(--text-2);max-width:780px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14.5px}
.kv dt{color:var(--text-3)} .kv dd{margin:0}
.big{font:400 30px/1.1 var(--display)}
.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.stat b{display:block;font:400 26px/1.1 var(--display)}
.stat span{font-size:13px;color:var(--text-3)}
pre.out{white-space:pre-wrap;background:#FBFAFD;border:1px solid var(--line);border-radius:14px;padding:14px;font:15px/1.55 var(--font);margin:0}
