/* ============================================================
   ОФОРМЛЕНИЕ
   Цвета задаются один раз здесь, в блоке :root.
   Хочешь поменять фирменный цвет — меняй --plum.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@600&family=Golos+Text:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --paper:#EDE8EC; --card:#fff; --soft:#FAF7FA;
  --ink:#221A26; --muted:#8A7E90; --line:#DED4E0;
  --plum:#5B3560; --plum-soft:#EFE4F0;
  --rose:#B23A5C; --rose-soft:#FBE8ED;
  --sage:#4E7C68; --sage-soft:#E4EFE9;
  --amber:#8A6A1F; --amber-soft:#F6EDD6;
}

* { box-sizing: border-box; }

body {
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Golos Text', system-ui, -apple-system, sans-serif;
  font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

button { font-family:inherit; cursor:pointer; }
:focus-visible { outline:2px solid var(--plum); outline-offset:2px; border-radius:6px; }

.wrap { max-width:620px; margin:0 auto; padding:0 18px 80px; }

/* шапка */
.hd { padding:26px 0 6px; }
.logo { font-family:'Unbounded',sans-serif; font-size:20px; letter-spacing:-.02em; }
.logo span { color:var(--plum); }
.sub { color:var(--muted); font-size:13.5px; margin-top:3px; }

/* прогресс */
.prog { display:flex; gap:5px; margin:20px 0 24px; }
.prog i { flex:1; height:3px; border-radius:2px; background:var(--line); }
.prog i[data-on="1"] { background:var(--plum); }

h2 { font-size:20px; font-weight:600; margin:0 0 4px; letter-spacing:-.01em; }
h3.sec { font-size:15px; font-weight:600; margin:24px 0 10px; }
.hint { color:var(--muted); font-size:13.5px; margin:0 0 16px; }

/* карточки выбора */
.opt {
  display:block; width:100%; text-align:left; background:var(--card);
  border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:9px;
  transition:border-color .14s, background .14s, box-shadow .14s;
}
.opt:hover { border-color:var(--plum); }
.opt[data-on="1"] { border-color:var(--plum); background:var(--plum-soft); box-shadow:0 0 0 3px var(--plum-soft); }
.opt:disabled { opacity:.45; cursor:not-allowed; }
.opt-n { font-weight:600; font-size:15.5px; }
.opt-d { color:var(--muted); font-size:13px; margin-top:3px; }
.row { display:flex; align-items:baseline; gap:10px; }
.row .p { margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:15px; font-weight:500; white-space:nowrap; }
.note { color:var(--sage); font-size:12.5px; margin-top:4px; }
.per { font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted); margin-top:3px; }
.tag { font-size:10.5px; font-weight:600; padding:2px 7px; border-radius:999px; background:var(--sage-soft); color:var(--sage); }
.tag.pl { background:var(--plum-soft); color:var(--plum); }
.two { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:9px; }
.two .opt { margin:0; }

/* дни */
.days { display:flex; gap:7px; overflow-x:auto; margin:0 -18px; padding:2px 18px 12px; scrollbar-width:none; }
.days::-webkit-scrollbar { display:none; }
.dchip {
  flex:0 0 auto; width:62px; background:var(--card); border:1px solid var(--line);
  border-radius:10px; padding:9px 0; text-align:center; transition:background .14s, border-color .14s;
}
.dchip small { display:block; font-size:11px; color:var(--muted); }
.dchip b { display:block; font-family:'JetBrains Mono',monospace; font-size:17px; font-weight:500; margin:1px 0; }
.dchip em { display:block; font-size:10px; color:var(--muted); font-style:normal; }
.dchip[data-on="1"] { background:var(--plum); border-color:var(--plum); color:#fff; }
.dchip[data-on="1"] small, .dchip[data-on="1"] em { color:#E3D2E6; }
.dchip:disabled { opacity:.34; cursor:not-allowed; }

/* слоты */
.slot {
  display:flex; align-items:center; gap:14px; width:100%; background:var(--card);
  border:1px solid var(--line); border-radius:12px; padding:13px 16px; margin-bottom:8px; text-align:left;
  transition:border-color .14s, background .14s, box-shadow .14s;
}
.slot:hover:not(:disabled) { border-color:var(--plum); }
.slot[data-on="1"] { border-color:var(--plum); background:var(--plum-soft); box-shadow:0 0 0 3px var(--plum-soft); }
.slot-t { font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:500; letter-spacing:-.02em; }
.bar { flex:1; height:4px; border-radius:2px; background:var(--plum-soft); position:relative; }
.bar i { position:absolute; inset:0; background:var(--plum); border-radius:2px; }
.slot-e { font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--muted); }
.slot:disabled { background:var(--soft); border-style:dashed; color:var(--muted); cursor:not-allowed; }
.slot:disabled .slot-t { text-decoration:line-through; }
.slot:disabled .bar { background:var(--line); }
.slot:disabled .bar i { display:none; }
.busy { font-size:12px; color:var(--muted); }

/* анкета */
.q {
  display:flex; gap:11px; align-items:flex-start; background:var(--card);
  border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:7px;
  cursor:pointer; font-size:14px; transition:border-color .14s, background .14s;
}
.q input { margin:3px 0 0; accent-color:var(--rose); width:17px; height:17px; flex:0 0 auto; }
.q[data-on="1"] { border-color:var(--rose); background:var(--rose-soft); }

.info { background:var(--soft); border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:13px; color:var(--muted); margin-bottom:16px; }
.info.warn { background:var(--amber-soft); border-color:#E6D5AE; color:#6A5013; }

/* формы */
label.f { display:block; font-size:13px; color:var(--muted); margin:0 0 5px; }
input.f {
  width:100%; background:var(--card); border:1px solid var(--line); border-radius:10px;
  padding:12px 14px; font-family:inherit; font-size:16px; color:var(--ink); margin-bottom:14px;
}
input.f::placeholder { color:#B9AEBF; }
.consent { display:flex; gap:11px; align-items:flex-start; font-size:13px; color:var(--muted); margin-bottom:18px; cursor:pointer; line-height:1.45; }
.consent input { margin:2px 0 0; accent-color:var(--plum); width:17px; height:17px; flex:0 0 auto; }
.consent a { color:var(--plum); }

/* итог */
.sum { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:15px 17px; margin-bottom:18px; }
.sr { display:flex; justify-content:space-between; gap:12px; padding:5px 0; font-size:14px; }
.sr span:first-child { color:var(--muted); }
.sr span:last-child { font-weight:500; text-align:right; }
.sr.total { border-top:1px solid var(--line); margin-top:7px; padding-top:11px; }
.sr.total span:last-child { font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:500; }
.plus { color:var(--plum); font-size:12.5px; }

/* кнопки */
.cta { width:100%; background:var(--plum); color:#fff; border:0; border-radius:12px; padding:15px; font-size:15.5px; font-weight:600; }
.cta:disabled { background:var(--line); color:var(--muted); cursor:not-allowed; }
.back { background:none; border:0; color:var(--muted); font-size:13.5px; padding:14px 0 0; width:100%; }
.ghost { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:9px 14px; font-size:13px; color:var(--ink); }
.ghost:hover { border-color:var(--plum); color:var(--plum); }

/* финал */
.done { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:26px 22px; text-align:center; }
.done[data-flag="1"] { border-color:var(--rose); }
.mk { width:46px; height:46px; border-radius:50%; background:var(--sage-soft); color:var(--sage); display:flex; align-items:center; justify-content:center; font-size:22px; margin:0 auto 14px; }
.done[data-flag="1"] .mk { background:var(--rose-soft); color:var(--rose); }
.done h3 { font-size:19px; margin:0 0 8px; font-weight:600; }
.done p { color:var(--muted); font-size:14px; margin:0 0 8px; }
.when { font-family:'JetBrains Mono',monospace; font-size:17px; color:var(--plum); background:var(--plum-soft); border-radius:10px; padding:11px; margin:16px 0 4px; }
.mylink { display:block; word-break:break-all; font-size:12.5px; color:var(--plum); margin-top:12px; }

/* чат */
.chat-btn {
  position:fixed; right:16px; bottom:16px; z-index:40;
  background:var(--plum); color:#fff; border:0; border-radius:999px;
  padding:13px 20px; font-size:14.5px; font-weight:600;
  box-shadow:0 6px 20px rgba(91,53,96,.3);
}
.chat-panel {
  position:fixed; inset:auto 0 0 0; z-index:50; background:var(--card);
  border-top:1px solid var(--line); border-radius:16px 16px 0 0;
  max-width:620px; margin:0 auto; display:none; flex-direction:column;
  max-height:78vh; box-shadow:0 -8px 32px rgba(34,26,38,.14);
}
.chat-panel[data-open="1"] { display:flex; }
.chat-head { display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--line); }
.chat-head b { font-size:15px; }
.chat-head small { color:var(--muted); font-size:12px; }
.chat-close { margin-left:auto; background:none; border:0; font-size:20px; color:var(--muted); line-height:1; }
.chat-body { flex:1; overflow-y:auto; padding:16px 18px; display:flex; flex-direction:column; gap:9px; }
.m { max-width:84%; padding:9px 13px; border-radius:13px; font-size:14px; white-space:pre-wrap; }
.m.c { background:var(--plum-soft); align-self:flex-end; border-bottom-right-radius:3px; }
.m.a { background:var(--soft); border:1px solid var(--line); align-self:flex-start; border-bottom-left-radius:3px; }
.m.a[data-h="1"] { background:var(--rose-soft); border-color:#F0CDD7; }
.chat-foot { display:flex; gap:8px; padding:12px 14px; border-top:1px solid var(--line); }
.chat-foot input { flex:1; border:1px solid var(--line); border-radius:10px; padding:11px 13px; font-family:inherit; font-size:16px; }
.chat-foot button { background:var(--plum); color:#fff; border:0; border-radius:10px; padding:0 16px; font-weight:600; }
.typing { color:var(--muted); font-size:13px; font-style:italic; }

/* личный кабинет */
.bk { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:10px; }
.bk-h { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.bk-t { font-family:'JetBrains Mono',monospace; font-size:16px; font-weight:500; }
.bk-s { color:var(--plum); font-size:13.5px; }
.bk-p { margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--muted); }
.badge { font-size:10.5px; font-weight:600; padding:2px 8px; border-radius:999px; }
.b-ok { background:var(--sage-soft); color:var(--sage); }
.b-wait { background:var(--amber-soft); color:var(--amber); }
.b-off { background:var(--line); color:var(--muted); }
.b-past { background:var(--soft); color:var(--muted); }

@media (max-width:420px) { .two { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { * { transition:none !important; animation:none !important; } }