/* Базовый слой для макетов UI-кита. Не часть styles.css — только для страниц кита. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);font-size:var(--fs-base);line-height:var(--lh-normal);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;color:var(--text-heading);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);font-weight:var(--fw-bold);text-wrap:pretty}
h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3)}h4{font-size:var(--fs-h4)}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:none;box-shadow:var(--ring-focus)}

.wrap{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter-desktop)}
.overline{font:var(--type-overline);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--brand)}
.muted{color:var(--text-muted)}
.lead{font-size:var(--fs-lg);line-height:var(--lh-relaxed);color:var(--n-600)}

/* ——— Кнопки: пилюля сохранена с действующего сайта ——— */
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:var(--r-pill);font-family:inherit;font-weight:var(--fw-medium);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out),transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.btn:active{transform:translateY(1px)}
.btn-sm{padding:8px 16px;font-size:var(--fs-xs)}
.btn-md{padding:12px 24px;font-size:var(--fs-sm)}
.btn-lg{padding:16px 32px;font-size:var(--fs-base)}
.btn-primary{background:var(--brand);color:#fff;box-shadow:var(--sh-brand)}
.btn-primary:hover{background:var(--brand-hover);color:#fff}
.btn-secondary{background:var(--accent);color:#fff}
.btn-secondary:hover{background:var(--accent-hover);color:#fff}
.btn-ghost{background:transparent;color:var(--text-heading);box-shadow:inset 0 0 0 1.5px var(--border-default)}
.btn-ghost:hover{color:var(--brand);box-shadow:inset 0 0 0 1.5px var(--border-brand)}
.btn-ghost-inv{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4)}
.btn-ghost-inv:hover{color:#fff;background:rgba(255,255,255,.1)}
.btn-text{background:none;padding:0;color:var(--text-link);font-size:var(--fs-sm)}
.btn-text:hover{color:var(--text-link-hover)}
.btn[disabled]{opacity:.45;pointer-events:none;box-shadow:none}

.ico{width:18px;height:18px;flex:none}
.ico-sm{width:15px;height:15px;flex:none}

/* ——— Иконки через CSS-маску: SVG красится в currentColor ——— */
.mico{display:inline-block;flex:none;width:15px;height:15px;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.i-phone{--i:url(../assets/icons/ui/phone.svg)}
.i-pin{--i:url(../assets/icons/ui/map-pin.svg)}

/* ——— Соцсети: Simple Icons, на hover — фирменный цвет сети ——— */
.soc{display:flex;gap:4px;align-items:center}
.soc a{width:32px;height:32px;border-radius:var(--r-circle);display:grid;place-items:center;color:var(--n-500);transition:color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out)}
.soc a i{width:16px;height:16px;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.soc a:hover{background:rgba(0,0,0,.04)}
.i-vk{--i:url(../assets/icons/social/vk.svg)}
.i-ok{--i:url(../assets/icons/social/odnoklassniki.svg)}
.i-yt{--i:url(../assets/icons/social/youtube.svg)}
.i-fb{--i:url(../assets/icons/social/facebook.svg)}
.i-ig{--i:url(../assets/icons/social/instagram.svg)}
.i-wa{--i:url(../assets/icons/social/whatsapp.svg)}
.i-tg{--i:url(../assets/icons/social/telegram.svg)}
/* Фирменные цвета сетей — внешние бренд-константы, сознательно вне токенов */
.soc a.i-vk:hover{color:#0077ff}
.soc a.i-ok:hover{color:#ee8208}
.soc a.i-yt:hover{color:#ff0000}
.soc a.i-fb:hover{color:#0866ff}
.soc a.i-ig:hover{color:#e4405f}
.soc a.i-wa:hover{color:#25d366}
.soc a.i-tg:hover{color:#26a5e4}
.soc-inv a{color:rgba(255,255,255,.62)}
.soc-inv a:hover{background:rgba(255,255,255,.1)}


/* ——— Формы: label обязателен ——— */
.field{display:flex;flex-direction:column;gap:6px}
.field>label{font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--text-muted)}
.field input,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--border-default);border-radius:var(--r-md);font-family:inherit;font-size:var(--fs-sm);color:var(--text-body);background:#fff;transition:border-color var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.field textarea{resize:vertical;min-height:88px}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--border-brand);box-shadow:var(--ring-focus)}
.field input::placeholder,.field textarea::placeholder{color:var(--text-faint)}
.field-err input{border-color:var(--danger-500)}
.field-msg{font-size:var(--fs-2xs);color:var(--danger-500)}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-2xs);line-height:1.5;color:var(--text-muted)}
.consent input{appearance:none;-webkit-appearance:none;margin:0;width:38px;height:22px;flex:none;position:relative;border-radius:var(--r-pill);background:var(--n-300);cursor:pointer;transition:background var(--dur-base) var(--ease-out)}
.consent input::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:var(--r-circle);background:var(--n-0);box-shadow:0 1px 3px rgba(38,28,22,.3);transition:transform var(--dur-base) var(--ease-out)}
.consent input:checked{background:var(--brand)}
.consent input:checked::after{transform:translateX(16px)}
.consent input:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.consent{align-items:center}
.on-dark .consent input{background:rgba(255,255,255,.32)}
.on-dark .consent input:checked{background:var(--brand)}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.form-ok{padding:12px 16px;border-radius:var(--r-md);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:#256b3a;background:#e8f5ec;border:1px solid #bfe3cb}
.form-err{padding:12px 16px;border-radius:var(--r-md);font-size:var(--fs-sm);color:var(--danger-500);background:#fdf0ef;border:1px solid #f3c9c6}
.on-dark .field>label{color:rgba(255,255,255,.72)}
.on-dark .consent{color:rgba(255,255,255,.62)}
.on-dark .consent a{color:rgba(255,255,255,.9);text-decoration:underline}

/* ——— Хлебные крошки: паттерн уже есть на сайте, сохранён ——— */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:var(--fs-xs);color:var(--text-muted)}
.crumbs a{color:var(--text-muted)}.crumbs a:hover{color:var(--brand)}
.crumbs i{font-style:normal;color:var(--n-300)}

/* ——— Заглушка контента: помечаем то, что подставляется при переносе ——— */
.stub{display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-2xs);font-weight:var(--fw-medium);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--amber-500);background:var(--amber-50);border:1px dashed var(--orange-200);border-radius:var(--r-pill);padding:3px 9px}

/* ——— Плавающая кнопка WhatsApp (фирменный зелёный - бренд-константа) ——— */
.wa-float{position:fixed;right:24px;bottom:24px;z-index:45;width:52px;height:52px;border-radius:var(--r-circle);background:#25d366;box-shadow:var(--sh-lg);display:grid;place-items:center;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.wa-float:hover{transform:translateY(-2px);box-shadow:var(--sh-xl)}
.wa-float img{width:26px;height:26px;filter:brightness(0) invert(1)}

/* ——— Плавающая кнопка AI-ассистента ———
   Столбик плавающих кнопок снизу вверх: WhatsApp → ассистент → наверх.
   Все три одного размера (52px) и на одной вертикали. */
.ai-float{position:fixed;right:24px;bottom:88px;z-index:45;width:52px;height:52px;border-radius:var(--r-circle);display:grid;place-items:center;cursor:pointer;
  background:radial-gradient(115% 115% at 30% 18%,#e04440 0%,var(--brand) 42%,#8e1512 100%);
  box-shadow:0 10px 26px rgba(209,50,48,.4),0 2px 6px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.ai-float:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 16px 34px rgba(209,50,48,.48),0 3px 8px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.38)}
.ai-float>img{position:relative;z-index:2;width:26px;height:26px;filter:brightness(0) invert(1) drop-shadow(0 1px 1px rgba(0,0,0,.25))}
/* Блик: постоянный сверху слева + редкий пробег по диагонали */
.ai-float::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;
  background:radial-gradient(58% 42% at 32% 20%,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 62%),
             linear-gradient(115deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 62%);
  background-size:100% 100%,260% 100%;background-position:0 0,160% 0;
  animation:aiShine 5s ease-in-out 1.2s infinite}
/* Пульсирующий ореол */
.ai-float::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  animation:aiPulse 3s ease-out 3s infinite}
@keyframes aiShine{0%,58%{background-position:0 0,160% 0}84%,100%{background-position:0 0,-70% 0}}
@keyframes aiPulse{0%{box-shadow:0 0 0 0 rgba(209,50,48,.45)}70%{box-shadow:0 0 0 18px rgba(209,50,48,0)}100%{box-shadow:0 0 0 0 rgba(209,50,48,0)}}

/* Подсказка слева от кнопки: показывается один раз и уезжает */
.ai-hint{position:absolute;z-index:4;right:calc(100% + 12px);top:50%;white-space:nowrap;background:#fff;color:var(--text-heading);font-size:var(--fs-xs);font-weight:var(--fw-medium);padding:9px 15px;border-radius:var(--r-pill);box-shadow:var(--sh-lg);opacity:0;pointer-events:none;transform:translateY(-50%) translateX(12px);animation:aiHint 7s var(--ease-out) 2.2s forwards}
.ai-hint::after{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;border:5px solid transparent;border-left-color:#fff}
@keyframes aiHint{0%{opacity:0;transform:translateY(-50%) translateX(12px)}
  7%,72%{opacity:1;transform:translateY(-50%) translateX(0)}
  100%{opacity:0;transform:translateY(-50%) translateX(12px)}}

/* Иконка ассистента в кнопках: градиент лежит внутри SVG, поэтому инверсию
   в белый здесь не применяем. Размер привязан к размеру кнопки, чтобы кнопка
   ассистента была ровно той же высоты, что соседняя. */
.ai-btn{gap:10px}
.ai-btn .ico-shine{position:relative;display:block;flex:none;line-height:0}
.ai-btn img.ico-sm{opacity:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
.btn-md.ai-btn img.ico-sm{width:26px;height:26px}
.btn-lg.ai-btn img.ico-sm{width:32px;height:32px}
/* Блик по самой иконке: маска формой глифа, поэтому свет идёт по рисунку,
   а не по прямоугольнику. Тот же ритм, что у плавающей кнопки. */
.ai-btn .ico-shine::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(115deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.9) 50%,rgba(255,255,255,0) 60%);
  background-size:280% 100%;background-position:170% 0;
  -webkit-mask:url(../assets/icons/ui/support-icon-candy.svg?v=6) center/contain no-repeat;
  mask:url(../assets/icons/ui/support-icon-candy.svg?v=6) center/contain no-repeat;
  animation:icoShine 5s linear 1.2s infinite}
/* Пробег занимает первые 30% цикла, остальное время полоса невидима -
   иначе виден её возврат из левого края в правый при перезапуске. */
@keyframes icoShine{
  0%{background-position:170% 0;opacity:0}
  6%{opacity:1}
  24%{opacity:1}
  30%{background-position:-90% 0;opacity:0}
  100%{background-position:-90% 0;opacity:0}}
/* На красной кнопке градиент теряется - там иконка остаётся белой */
.btn-primary.ai-btn img{filter:brightness(0) invert(1)}
.btn-primary.ai-btn .ico-shine::after{display:none}

/* Рамка кнопки ассистента: настоящий бордер в 1 пиксель, красный.
   box-sizing:border-box, поэтому заданная высота кнопки не съезжает. */
.ai-btn.btn-ghost{box-shadow:none;border:1px solid var(--brand)}
.ai-btn.btn-ghost:hover{color:var(--brand);box-shadow:none;border-color:var(--brand)}

@media (prefers-reduced-motion:reduce){
.ai-float::before,.ai-float::after,.ai-btn .ico-shine::after{animation:none}
.hero .swiper-slide-active .chip-in,.hero .swiper-slide-active .chip-in::after{animation:none}
.ai-hint{display:none}
}

/* ——— Кнопка «Наверх»: показывается скриптом (data-show) после прокрутки ——— */
.to-top{position:fixed;right:24px;bottom:152px;z-index:45;width:52px;height:52px;border:0;border-radius:var(--r-circle);background:var(--brand);box-shadow:var(--sh-lg);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),visibility var(--dur-base),background var(--dur-base) var(--ease-out)}
.to-top[data-show]{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--brand-hover)}
.to-top img{width:18px;height:18px;transform:rotate(-90deg);filter:brightness(0) invert(1)}

image-slot{--is-radius:var(--r-lg)}

/* ——— Якоря: плавная прокрутка и отступ под липкую шапку ———
   --anchor-offset задаёт main.js по реальной высоте шапки (96px / 66px на мобильных). */
html{scroll-behavior:smooth}
:target,[id]{scroll-margin-top:var(--anchor-offset,120px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ——— Чат AI-ассистента ——— */
.ai-chat{position:fixed;right:24px;bottom:24px;z-index:60;width:380px;max-width:calc(100vw - 32px);height:600px;max-height:calc(100dvh - 48px);
  display:flex;flex-direction:column;background:#fff;border-radius:var(--r-lg);box-shadow:0 24px 64px rgba(38,28,22,.28),0 4px 12px rgba(0,0,0,.12);
  overflow:hidden;opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;
  transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.ai-chat.is-open{opacity:1;transform:none;pointer-events:auto}
.ai-chat-head{display:flex;align-items:center;gap:12px;padding:14px 16px;color:#fff;
  background:radial-gradient(130% 160% at 28% 12%,#e04440 0%,var(--brand) 46%,#8e1512 100%)}
.ai-chat-head .ic{flex:none;width:38px;height:38px;border-radius:var(--r-circle);background:rgba(255,255,255,.16);display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.ai-chat-head .ic img{width:22px;height:22px;filter:brightness(0) invert(1)}
.ai-chat-head .tx{min-width:0}
.ai-chat-head b{display:block;font-size:var(--fs-sm);font-weight:var(--fw-bold);line-height:1.2}
.ai-chat-head span{display:block;font-size:var(--fs-2xs);opacity:.85}
.ai-chat-close,.ai-chat-reset{flex:none;width:32px;height:32px;border:0;border-radius:var(--r-circle);background:rgba(255,255,255,.14);cursor:pointer;display:grid;place-items:center;transition:background var(--dur-base) var(--ease-out)}
.ai-chat-reset{margin-left:auto}
.ai-chat-close:hover,.ai-chat-reset:hover{background:rgba(255,255,255,.28)}
.ai-chat-close img{width:16px;height:16px;filter:brightness(0) invert(1)}
.ai-chat-reset img{width:15px;height:15px;filter:brightness(0) invert(1)}
.ai-chat-body{flex:1;overflow-y:auto;padding:16px;background:var(--sand-50,#faf7f1);display:flex;flex-direction:column;gap:10px}
.ai-msg{max-width:86%;padding:10px 14px;font-size:var(--fs-sm);line-height:1.5;white-space:pre-wrap;word-wrap:break-word}
.ai-msg-bot{align-self:flex-start;background:#fff;color:var(--text-body);border:1px solid #ece5d7;border-radius:4px 16px 16px 16px}
.ai-msg-user{align-self:flex-end;color:#fff;background:radial-gradient(140% 180% at 30% 15%,#e04440 0%,var(--brand) 55%,#a81b18 100%);border-radius:16px 4px 16px 16px}
.ai-typing{align-self:flex-start;display:flex;gap:5px;padding:14px 16px;background:#fff;border:1px solid #ece5d7;border-radius:4px 16px 16px 16px}
.ai-typing i{width:7px;height:7px;border-radius:50%;background:var(--brand);opacity:.35;animation:aiTyping 1.2s ease-in-out infinite}
.ai-typing i:nth-child(2){animation-delay:.18s}
.ai-typing i:nth-child(3){animation-delay:.36s}
@keyframes aiTyping{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}
.ai-chat-form{display:flex;align-items:flex-end;gap:10px;padding:12px 14px;border-top:1px solid #ece5d7;background:#fff}
.ai-chat-form textarea{flex:1;resize:none;border:1px solid var(--border-default);border-radius:18px;padding:10px 15px;font-family:inherit;font-size:var(--fs-sm);line-height:1.4;max-height:110px;background:#fff;color:var(--text-body)}
.ai-chat-form textarea:focus{outline:none;border-color:var(--border-brand);box-shadow:var(--ring-focus)}
.ai-chat-send{flex:none;width:42px;height:42px;border:0;border-radius:var(--r-circle);cursor:pointer;display:grid;place-items:center;
  background:radial-gradient(115% 115% at 30% 18%,#e04440 0%,var(--brand) 42%,#8e1512 100%);
  box-shadow:0 6px 16px rgba(209,50,48,.35);transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.ai-chat-send:hover{transform:translateY(-1px);box-shadow:0 9px 22px rgba(209,50,48,.45)}
.ai-chat-send:disabled{opacity:.55;cursor:default;transform:none}
.ai-chat-send img{width:18px;height:18px;filter:brightness(0) invert(1)}
.ai-inline-form .row{display:flex;gap:8px;margin-top:10px}
.ai-inline-form input[type=text]{flex:1;min-width:0;border:1px solid var(--sand-200);border-radius:var(--r-md);padding:9px 12px;font:inherit;font-size:var(--fs-xs)}
.ai-inline-form input[type=text]:focus{outline:none;border-color:var(--brand)}
.ai-inline-form .ok{flex:none;border:0;background:var(--brand);color:#fff;border-radius:var(--r-md);padding:9px 16px;font:var(--fw-medium) var(--fs-xs) var(--font-sans);cursor:pointer;transition:background var(--dur-base) var(--ease-out)}
.ai-inline-form .ok:hover{background:var(--brand-hover)}
.ai-inline-form .skip{display:block;margin-top:8px;border:0;background:none;padding:0;color:var(--text-muted);font-size:var(--fs-2xs);cursor:pointer;text-decoration:underline}
.ai-inline-form .consent{margin-top:10px}
.ai-inline-form .consent span{font-size:var(--fs-2xs)}
.ai-chat-note{padding:0 16px 10px;background:#fff;font-size:11px;line-height:1.4;color:var(--text-faint);text-align:center}
@media (max-width:720px){
  .ai-chat{right:0;bottom:0;left:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;border-radius:0}
}
@media (prefers-reduced-motion:reduce){
  .ai-chat{transition:none}
  .ai-typing i{animation:none;opacity:.7}
}

/* ——— Баннер согласия на cookie ——— */
.cc-bar{position:fixed;left:24px;right:24px;bottom:24px;z-index:70;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;
  max-width:920px;margin:0 auto;padding:18px 22px;background:#fff;border:1px solid #ece5d7;border-radius:var(--r-lg);
  box-shadow:0 18px 48px rgba(38,28,22,.22);opacity:0;transform:translateY(14px);pointer-events:none;
  transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.cc-bar.is-show{opacity:1;transform:none;pointer-events:auto}
.cc-bar p{flex:1 1 320px;margin:0;font-size:var(--fs-xs);line-height:1.55;color:var(--text-muted)}
.cc-bar p a{text-decoration:underline}
.cc-bar .cc-acts{display:flex;gap:10px;flex:none}
@media (max-width:720px){.cc-bar{left:12px;right:12px;bottom:12px}}

/* Ссылки в сообщениях чата */
.ai-msg a{text-decoration:underline;text-underline-offset:2px;word-break:break-all}
.ai-msg-bot a{color:var(--brand)}
.ai-msg-bot a:hover{color:var(--brand-hover)}
.ai-msg-user a{color:#fff}
.ai-msg-user a:hover{color:#ffd9d8}

/* ——— Попап «Оставить отзыв» ——— */
.rvcta{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
#otzyv-forma.sec{padding-top:0}
.rvcta-t{display:flex;align-items:center;gap:24px;width:min(760px,100%);margin:0;font-size:var(--fs-lg);color:var(--n-600)}
.rvcta-t::before,.rvcta-t::after{content:"";flex:1;height:1px;background:var(--sand-200)}
.rvcta-t span{flex:none;max-width:80%}
.rvcta .form-ok{max-width:560px}
.rvmodal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(25,22,20,.55);backdrop-filter:blur(4px)}
.rvmodal.is-open{display:flex}
.rvmodal-card{width:640px;max-width:100%;max-height:calc(100dvh - 40px);overflow-y:auto;background:#fff;border-radius:var(--r-lg);box-shadow:0 24px 64px rgba(38,28,22,.3)}
.rvmodal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid #ece5d7}
.rvmodal-head b{font-size:var(--fs-h4);color:var(--text-heading)}
.rvmodal-close{width:34px;height:34px;border:0;border-radius:var(--r-circle);background:var(--sand-50);cursor:pointer;display:grid;place-items:center;transition:background var(--dur-base) var(--ease-out)}
.rvmodal-close:hover{background:var(--sand-200)}
.rvmodal-close img{width:15px;height:15px}
.rvform{display:flex;flex-direction:column;gap:14px;padding:22px 24px}
.rvform .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rvform .field label i{font-style:normal;color:var(--brand);margin-left:2px}
.rvform-note{margin:-6px 0 0;font-size:var(--fs-2xs);color:var(--text-faint)}
.rvdrop{position:relative;border:1.5px dashed var(--sand-200);border-radius:var(--r-md);background:var(--sand-50);transition:border-color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out)}
.rvdrop:hover,.rvdrop.is-drag{border-color:var(--brand)}
.rvdrop.is-drag{background:var(--sand-100)}
.rvdrop input[type=file]{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer}
.rvdrop [hidden]{display:none!important}
.rvdrop-idle{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px 16px;font-size:var(--fs-xs);color:var(--text-faint);pointer-events:none}
.rvdrop-idle img{width:20px;height:20px;opacity:.4}
.rvdrop-idle b{font-weight:var(--fw-medium);color:var(--brand)}
.rvdrop-done{display:flex;align-items:center;gap:12px;padding:8px 10px;pointer-events:none}
.rvdrop-prev{width:48px;height:48px;object-fit:cover;border-radius:var(--r-sm);flex:none}
.rvdrop-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-xs);color:var(--text-muted)}
.rvdrop-x{pointer-events:auto;position:relative;z-index:2;width:30px;height:30px;border:0;border-radius:var(--r-circle);background:var(--sand-100);cursor:pointer;display:grid;place-items:center;flex:none;transition:background var(--dur-base) var(--ease-out)}
.rvdrop-x:hover{background:var(--sand-200)}
.rvdrop-x img{width:12px;height:12px}
.rvform .btn{align-self:flex-start}
@media (max-width:720px){.rvform .row{grid-template-columns:1fr}}