/* Живые сцены кабинета на сайте (вариант «Рядом», 09.10.2026).

   Сцена — фрагмент scenes/<id>.html: свои стили, разметка .sc[data-scene] и,
   бывает, крючок; во фрагмент страницы её ставит метка <!-- scene: id -->,
   движок — scenes.js. Этот файл — три слоя:

   1. токены сцен. Сцены писались под свои имена переменных (--blue, --text-3,
      --line-2…); здесь они объявлены на самом корне .sc, а не в :root, чтобы
      не спорить с токенами сайта (у сайта --line и --surface свои);
   2. общее окно, чип, тост, курсор (scene-base);
   3. перекраска под язык сайта: синий стал тёплым чёрным, кнопки — таблетками,
      тени окон — по подложке .stage--*.

   Подключается в конце <body>, после сцен: перекраска переопределяет их правила
   и @keyframes тех же имён, а из двух одинаковых @keyframes действует последний. */

.sc {
  --blue: #1e1d1c; --blue-d: #1e1d1c; --blue-2: #4a4642; --sky: #d39a52; --sky-2: #ecd2a6;
  --blue-soft: rgba(30, 29, 28, 0.06); --blue-line: rgba(30, 29, 28, 0.22);
  --ink: #1e1d1c; --text: #1e1d1c; --text-2: #57534e; --text-3: #78756f; --text-4: #a8a29e;
  --bg: #ffffff; --bg-2: #f7f6f3; --surface: #ffffff; --surface-2: #faf9f7;
  --line: rgba(0, 0, 0, 0.06); --line-2: rgba(0, 0, 0, 0.09); --line-3: rgba(0, 0, 0, 0.16);
  --ok: #2c7651; --ok-soft: rgba(44, 118, 81, 0.1); --warn: #9a530d; --warn-soft: rgba(214, 140, 40, 0.15);
  --rose: #ad4436;
  --glass: rgba(255, 255, 255, 0.72); --glass-b: rgba(255, 255, 255, 0.94);
  --r: 16px;
  --font: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

/* ── общее окно сцен ── */
/* Общее для всех сцен v12: окно и метки. Токены — из v11 (:root). */
.sc{position:relative;font-family:var(--font);color:var(--text);font-size:13px;line-height:1.45;min-width:0}
.sc *{box-sizing:border-box}
.sc.is-reset *,.sc.is-reset *::before,.sc.is-reset *::after{transition:none!important;animation:none!important}
.sc .win{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -18px rgba(16,42,96,.28);overflow:hidden}
.sc .win__bar{display:flex;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--line);font:500 11px/1 var(--mono);color:var(--text-3);background:var(--surface-2)}
.sc .win__bar i{width:7px;height:7px;border-radius:50%;background:var(--line-3)}
.sc .win__bar span{margin-left:6px}
.sc .win__body{padding:14px}
.sc .chip{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font:500 11px/1.6 var(--mono);background:var(--blue-soft);color:var(--blue-d);white-space:nowrap}
.sc .chip--ok{background:var(--ok-soft);color:var(--ok)}
.sc .chip--warn{background:var(--warn-soft);color:var(--warn)}
.sc .toast{position:absolute;right:12px;bottom:12px;display:flex;gap:8px;align-items:center;padding:9px 12px;border-radius:12px;background:var(--glass-b);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line-2);box-shadow:0 12px 30px -12px rgba(16,42,96,.35);font-weight:600;font-size:12.5px;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}
.sc .press{transition:transform .15s,box-shadow .2s,background .2s}
.sc .cursor{position:absolute;width:18px;height:18px;pointer-events:none;transition:left .7s cubic-bezier(.4,.1,.2,1),top .7s cubic-bezier(.4,.1,.2,1),transform .15s;z-index:5}
.sc .cursor::before{content:"";position:absolute;inset:0;background:var(--ink);clip-path:polygon(0 0,0 78%,24% 60%,40% 100%,54% 94%,38% 56%,72% 56%);filter:drop-shadow(0 1px 1px rgba(255,255,255,.9))}
@media (prefers-reduced-motion:reduce){.sc *,.sc *::before,.sc *::after{transition:none!important;animation:none!important}}

/* ── перекраска под язык сайта ── */
.sc{font-family:var(--font)}
.sc .win{background:#fff;border:1px solid rgba(0,0,0,.075);border-radius:18px;box-shadow:0 1px 2px rgba(0,0,0,.035),0 18px 40px -26px rgba(70,45,10,.28)}
.sc .win__bar{background:#fff;border-bottom:1px solid rgba(0,0,0,.065);padding:11px 16px;font:400 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.sc .win__bar i{display:none}
.sc .win__bar span{margin-left:0}
.sc .chip{background:rgba(0,0,0,.05);color:var(--ink)}
.sc .chip--ok{background:var(--ok-soft);color:var(--ok)}
.sc .chip--warn{background:var(--warn-soft);color:var(--warn)}
.sc .toast{background:rgba(255,255,255,.96);border:1px solid rgba(0,0,0,.08);border-radius:14px;box-shadow:0 16px 34px -14px rgba(70,45,10,.32);font-weight:600}
.sc .cursor::before{background:var(--ink)}
/* кнопки сцен — чёрные таблетки без синего свечения */
.sc .cs-btn,.sc .mk,.sc .big,.sc .fm-link,.sc .fm-pay,.sc .iv-issue,.sc .nw-go,.sc .order,.sc .take{border-radius:999px;box-shadow:none!important}
.sc.sc--case .cs-btn--ghost{background:#fff;color:var(--ink);border-color:rgba(0,0,0,.16)}
/* аватары и мелкий синий */
.sc .cs-ava,.sc .cl-ava,.sc .cd-ava{background:linear-gradient(135deg,#f4eee4,#e5dacb)!important;color:var(--ink)!important}
.sc.sc--family .fm-av{background:linear-gradient(140deg,#c9a77c,#8f6a43)}
.sc.sc--family .fm-guide .fm-av,.sc.sc--family .fm-ans .fm-av{background:linear-gradient(140deg,#d8b98f,#a07a4f)}
.sc.sc--calendar .trip .dr i{background:var(--ink)}
.sc.sc--call .task{box-shadow:0 12px 26px -18px rgba(70,45,10,.4)}
.sc.sc--agent .tap,.sc.sc--family .fm-tap{background:rgba(30,29,28,.12);border-color:rgba(30,29,28,.4)}
.sc.sc--care .ca__pin{fill:var(--ink)}
.sc.sc--care rect[stroke="#2563eb"]{fill:#f3dcbc;stroke:#a8712f}
.sc.sc--monument .dot{box-shadow:none}
/* телефоны и экраны */
.sc.sc--family .fm-phone{background:linear-gradient(160deg,#ffffff,#efebe4 60%,#e4ddd2);box-shadow:0 1px 0 #fff inset,0 30px 60px -30px rgba(70,45,10,.4)}
.sc.sc--family .fm-notch,.sc.sc--agent .notch{background:var(--ink)}
.sc.sc--family .fm-cab{background:linear-gradient(180deg,#faf8f4,#fdfcfa)}
.sc.sc--family .fm-next{background:linear-gradient(180deg,#fff,#fbf6ee)}
.sc.sc--family .fm-house::before{background:linear-gradient(140deg,var(--sky),var(--ink))}
.sc.sc--agent .dev{background:linear-gradient(160deg,#3a3632,#1e1d1c 60%);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 26px 50px -22px rgba(70,45,10,.5)}
.sc.sc--agent .scr{background:linear-gradient(180deg,#faf8f4,#f3efe8)}
.sc.sc--agent .card{box-shadow:0 6px 16px -10px rgba(70,45,10,.3)}
.sc.sc--memory .me__stage{background:linear-gradient(180deg,#fbf3e6 0,#fdf9f2 62%,#e9e1d3 62.2%,#f0eadf 100%)}
.sc.sc--monument .mn__scr{background:#faf8f4}
.sc.sc--site .form{box-shadow:0 24px 50px -24px rgba(70,45,10,.4)}
/* вспышки новых строк — тёплые */
@keyframes cs-new{0%,30%{background:rgba(214,150,70,.16)}100%{background:transparent}}
@keyframes cd-flash{0%,25%{background:rgba(214,150,70,.14)}100%{background:transparent}}
@keyframes bd-new{0%,40%{box-shadow:0 0 0 3px rgba(30,29,28,.18),0 10px 24px -10px rgba(70,45,10,.35)}100%{box-shadow:0 1px 2px rgba(0,0,0,.05)}}
@keyframes nwFlash{0%,100%{box-shadow:0 0 0 0 rgba(214,150,70,0)}30%{box-shadow:0 0 0 3px rgba(214,150,70,.28)}}
/* окна по подложкам */
.stage--none .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.04),0 2px 6px -2px rgba(40,30,15,.06),0 28px 56px -30px rgba(40,30,15,.34)}
.stage--stone .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.035),0 22px 48px -26px rgba(70,55,35,.34)}
.stage--frost .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.035),0 22px 48px -26px rgba(40,70,110,.32)}
.stage--mist .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.035),0 22px 48px -26px rgba(40,60,90,.34)}
.stage--sage .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.035),0 22px 48px -26px rgba(50,70,40,.34)}
.stage--lilac .sc .win{box-shadow:0 1px 2px rgba(0,0,0,.035),0 22px 48px -26px rgba(80,50,100,.32)}
@keyframes ag-hit{40%{transform:scale(.7);background:rgba(30,29,28,.3)}100%{transform:none}}

/* Класс .chip сайта (рамка, поля, min-height 44px на телефоне) не должен раздувать чипы сцен. */
.sc .chip{min-height:0;border:0;padding:2px 8px;box-shadow:none}
/* Общие классы сайта (.card, .go, .logo, .chip span) не должны менять одноимённые части сцен. */
.sc .card{min-height:0}
.sc .card:hover{transform:none}
.sc .chip span{font-size:inherit}
.sc .go{width:auto;height:auto;margin-top:0}
.sc .logo{min-height:0}
