/* Бьюти-направление (04.10.2026): всё в одном стиле — страница записи, чат и журнал мастера.
   Пудра и ягода, крупный Tenor Sans, большое фото ниши. Включается классом .beauty на <html> (index.html). */
.beauty{
  --bg:#F5ECEC;          /* пудра — фон страницы */
  --white:#FFFBFA;       /* поверхность: телефон, журнал */
  --text:#2B1F27;        /* слива — текст */
  --ink:#93405C;         /* ягода — кнопки и выбранное */
  --ink-soft:#F6E5EA;
  --muted:#7A6670; --line:#EBDDE0; --soft:#F8F0F1; --disabled:#BFAEB5; --faint:#B49FA8;
  /* тетрадь: та же клетка, но розовая; маркер — розовый текстовыделитель */
  --paper:#FDF8F7; --grid:#F0DEE2; --margin:#D08A9C; --hand:#5B3A4C;
  --marker:#F7C4D3; --marker-2:#F2AFC3; --marker-0:rgba(247,196,211,0); --marker-text:#7A2E48;
  --display:'Tenor Sans','Golos Text',ui-sans-serif,system-ui,sans-serif;
}
.beauty h1{font-family:var(--display);font-weight:400;font-size:clamp(28px,7.6vw,46px);line-height:1.1;letter-spacing:-.015em;max-width:20ch;margin-bottom:12px}
.beauty .tabs{border-radius:999px;border-color:var(--line)}
.beauty .tabs button{border-radius:999px}
.beauty .entry button{border-color:var(--line)}
.beauty #viaLink{order:-1}
.beauty .phone{border:0;border-radius:32px;box-shadow:0 30px 60px -36px rgba(91,40,62,.45),0 0 0 1px var(--line)}
.beauty .phone.linkmode .bar{display:none}
.beauty .bar .ava{background:var(--ink)}
.beauty .msg.bot{box-shadow:0 1px 0 var(--line)}
.beauty .btns button{border-radius:999px;padding:8px 14px}
.beauty .btns.grid button{border-radius:12px;padding:9px 0}
.beauty .btns button small{color:var(--muted)}

/* ── Страница записи по ссылке ─────────────────────────────── */
.beauty .lp{padding:0;background:var(--white);min-height:100%}
.beauty .b-hero{position:relative;height:clamp(230px,64vw,300px);transition:height .35s ease;
  background:var(--photo,none) center 40%/cover no-repeat,
    radial-gradient(90% 70% at 18% 12%,#F2D3DC 0,transparent 62%),
    radial-gradient(80% 70% at 88% 78%,#E9CFC4 0,transparent 60%),#EFE1E3}
.beauty .b-hero.small{height:150px}
.beauty .b-hero.small + .b-head h3{font-size:22px}
.beauty .b-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;
  background:linear-gradient(to bottom,rgba(255,251,250,0),var(--white))}
.beauty .b-restart{position:absolute;top:12px;right:12px;z-index:1;border-radius:999px;padding:6px 12px;font-size:13px;color:var(--text)}
.beauty .b-head{position:relative;z-index:1;margin-top:-30px;padding:0 20px 10px}
.beauty .b-head h3{font-family:var(--display);font-weight:400;font-size:31px;line-height:1.08;letter-spacing:-.01em;margin:0}
.beauty .b-head p{margin:6px 0 0;color:var(--muted);font-size:14px}

.beauty .b-list{padding:6px 12px 104px}
.beauty .b-svc{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;text-align:left;
  padding:14px 10px;border-bottom:1px solid var(--line)}
.beauty .b-svc:last-child{border-bottom-color:transparent}
.beauty .b-svc::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--disabled);transition:border-width .15s,border-color .15s}
.beauty .b-svc[aria-checked="true"]{background:var(--ink-soft);border-radius:16px;border-bottom-color:transparent}
.beauty .b-svc[aria-checked="true"]::before{border:6px solid var(--ink)}
.beauty .b-n{flex:1;min-width:0;font-size:16px;line-height:1.3;font-weight:500}
.beauty .b-n small{display:block;color:var(--muted);font-size:13px;font-weight:400;margin-top:2px}
.beauty .b-p{white-space:nowrap;font-size:15px;font-weight:600}

/* стекло: только кнопка внизу и панель времени */
.beauty .glass{background:rgba(255,250,251,.66);-webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7);
  border:1px solid rgba(255,255,255,.75);box-shadow:0 14px 34px -16px rgba(91,40,62,.42),inset 0 1px 0 rgba(255,255,255,.85)}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.beauty .glass{background:rgba(255,250,251,.97)}}

.beauty .b-cta{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;display:flex;align-items:center;gap:10px;
  border-radius:999px;padding:7px 7px 7px 20px;animation:rise .3s ease-out}
.beauty .b-cta-t{flex:1;min-width:0;line-height:1.2}
.beauty .b-cta-t b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-weight:600;font-size:14px;line-height:1.2}
.beauty .b-cta-t small{display:block;color:var(--muted);font-size:13px}
.beauty .b-go,.beauty .b-confirm,.beauty .b-again{border:0;border-radius:999px;background:var(--ink);color:#fff;font-weight:600;padding:13px 18px;white-space:nowrap}
.beauty .b-go:disabled,.beauty .b-confirm:disabled{background:rgba(147,64,92,.28);cursor:default}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.beauty .b-scrim{position:absolute;inset:0;z-index:4;background:rgba(43,31,39,.26);opacity:0;transition:opacity .28s}
.beauty .b-scrim.on{opacity:1}
.beauty .b-sheet{position:absolute;left:0;right:0;bottom:0;z-index:5;max-height:86%;overflow-y:auto;outline:none;
  background:rgba(255,250,251,.82);border-radius:28px 28px 0 0;border-bottom:0;padding:8px 18px 20px;
  transform:translateY(105%);transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.beauty .b-sheet.on{transform:none}
.beauty .b-grab{width:40px;height:5px;border-radius:3px;background:rgba(43,31,39,.18);margin:2px auto 6px}
.beauty .b-sh-head{display:flex;align-items:center;min-height:30px}
.beauty .b-back{border:0;background:none;color:var(--ink);padding:4px 0;font-size:14.5px}
.beauty .b-x{margin-left:auto;border:0;background:rgba(43,31,39,.07);border-radius:50%;width:30px;height:30px;font-size:13px;color:var(--muted)}
.beauty .b-sheet h4{font-family:var(--display);font-weight:400;font-size:24px;line-height:1.15;margin:2px 0 12px}
.beauty .b-days{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -18px;padding:0 18px 4px}
.beauty .b-days button{flex:none;min-width:76px;border:1px solid var(--line);background:rgba(255,255,255,.7);border-radius:16px;padding:9px 10px;font-size:14.5px;font-weight:500;line-height:1.2}
.beauty .b-days button small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:2px}
.beauty .b-days button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.beauty .b-days button[aria-pressed="true"] small{color:rgba(255,255,255,.8)}
.beauty .b-days button:disabled{opacity:.45}
.beauty .b-times{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.beauty .b-times button{border:1px solid var(--line);background:rgba(255,255,255,.75);border-radius:14px;padding:12px 0;font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}
.beauty .b-times button:active{background:var(--ink-soft);border-color:var(--ink)}
.beauty .b-when{margin:0 0 6px;font-size:16px;line-height:1.45}
.beauty .b-when span{display:block;color:var(--muted);font-size:14.5px}
.beauty .b-sheet label{display:block;font-size:14px;color:var(--muted);margin:12px 0 6px}
.beauty .b-sheet input{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-size:16px;background:rgba(255,255,255,.85)}
.beauty .b-confirm{width:100%;margin-top:16px;padding:15px}

.beauty .b-done{padding:2px 20px 28px}
.beauty .b-check{width:52px;height:52px;margin:4px 0 10px;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.beauty .b-check circle{stroke:var(--marker)}
.beauty .b-check path{stroke-dasharray:40;stroke-dashoffset:40;animation:tick .5s .15s ease-out forwards}
@keyframes tick{to{stroke-dashoffset:0}}
.beauty .b-done h4{font-family:var(--display);font-weight:400;font-size:28px;margin:0 0 8px}
.beauty .b-note{color:var(--muted);font-size:14px;line-height:1.5;margin:8px 0 0}
.beauty .b-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.beauty .b-move{border:1px solid var(--ink);background:none;color:var(--ink);border-radius:999px;padding:12px 22px;font-weight:600}
.beauty .b-again{background:none;color:var(--ink);padding:12px 8px}

/* ── Журнал мастера (05.10): не тетрадь, а лента дня ──────────
   Клетка, поля и рукописный шрифт пришли из авто — бьюти они не подходят (Руслан, 05.10). Время — Tenor Sans,
   как заголовки; тонкая линия на каждый час. Главное — запись, которая пришла сама: ягодная карточка, заливка
   наносится слева направо, как лак, и проявляет имя. Записи по звонку — тихие белые. Классы прежние (.ap.bot,
   .fresh) — ролик снимает их же. */
.beauty .journal{border-color:var(--line);border-radius:28px}
.beauty .jhead h2{font-family:var(--display);font-weight:400;font-size:25px}
.beauty .note.new{background:var(--ink-soft)}
.beauty .seg{border-radius:999px}
.beauty .install{border-radius:999px}
.beauty .page{grid-template-columns:54px 1fr;border-radius:0;overflow:visible;background-color:var(--white);
  background-image:linear-gradient(var(--line) 1px,transparent 1px);background-size:calc(100% - 54px) var(--row);
  background-position:54px 0;background-repeat:repeat-y}
.beauty .page::before{display:none}
.beauty .tm{font-family:var(--display);font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;padding:5px 0 0 2px}
.beauty .slot{margin:3px 0 3px 6px;padding:0 12px;border-radius:14px;color:var(--disabled);font-size:13.5px}
.beauty .slot::before{content:"+";margin-right:7px;font-size:16px;line-height:1}
.beauty .slot:hover{background:var(--ink-soft);color:var(--ink)}
.beauty .ap{margin:3px 0 3px 6px;padding:5px 12px;border-radius:14px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);line-height:1.2}
.beauty .ap .nm{font-family:inherit;font-size:15px;font-weight:600;color:var(--text)}
.beauty .ap .sv{font-family:inherit;font-size:13px;color:var(--muted);opacity:1}
.beauty .ap.bot{background:linear-gradient(var(--ink),var(--ink)) no-repeat;background-size:100% 100%;box-shadow:none}
.beauty .ap.bot .nm,.beauty .ap.bot .sv{font-family:inherit;color:#fff}
.beauty .ap.bot .sv{font-size:13px}
.beauty .ap.bot .via{color:rgba(255,255,255,.78);font-size:12px}
.beauty .ap.brk{background:repeating-linear-gradient(135deg,transparent 0 7px,rgba(147,64,92,.09) 7px 9px);box-shadow:inset 0 0 0 1px var(--line)}
.beauty .ap.brk .nm{font-size:14px;font-weight:500;color:var(--muted)}
.beauty .ap.sel{outline:2px solid var(--ink);outline-offset:2px}
.beauty .act{margin:3px 0 3px 6px;border-radius:16px;border-color:var(--ink)}
.beauty .act button{border-radius:999px;padding:6px 11px}
.beauty .act input,.beauty .act select{border-radius:12px}
.beauty .detail{border-radius:16px}
.beauty #legend .k{background:var(--ink)!important;border:0!important}
.beauty #legend > span:last-child .k{background:var(--white)!important;box-shadow:inset 0 0 0 1px var(--line)}
.beauty .wd{background:var(--soft);border-radius:14px}
.beauty .wd .cells i{border-radius:4px;border-color:var(--line)}
.beauty .wd .cells i.b{background:#D9C3CB;border-color:#D9C3CB;opacity:1}
.beauty .wd .cells i.m{background:var(--ink);border-color:var(--ink)}
@media (prefers-reduced-motion:reduce){.beauty .b-check path{stroke-dashoffset:0}}