@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Mulish:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* ─── TOKENS ─── */
/* ═══════════════════════════════════════════════════════════════════
   ТЕМА: ТЁМНАЯ (по умолчанию)
═══════════════════════════════════════════════════════════════════ */
:root {
  /* Акцент */
  --orange:        #FF6B00;
  --orange-l:      #FF8C33;
  --orange-dim:    rgba(255,107,0,0.10);
  --orange-brd:    rgba(255,107,0,0.28);

  /* Фоны */
  --bg:            #18181b;
  --bg2:           #1f1f23;
  --surface:       #26262b;
  --surface2:      #2e2e34;

  /* Линии */
  --line:          var(--surface-b);
  --line2:         var(--surface-c);

  /* Текст */
  --text:          #f2f2f2;
  --text1:         #f2f2f2;
  --text2:         #a0a0a8;
  --text3:         #52525a;

  /* Статусы */
  --green:         #22c55e;
  --red:           #ef4444;
  --blue:          #60a5fa;

  /* Размер шрифта (управляется настройками) */
  --font-scale:    1;
  --base-fs:       16px;

  /* Радиусы скруглений: единая шкала 5 / 10 / 18, управляется темой */
  --radius-min:    5px;
  --radius-mid:    10px;
  --radius-max:    18px;
  --r-sm:          var(--radius-min);
  --r-md:          var(--radius-mid);
  --r-lg:          var(--radius-max);
  --r-xl:          var(--radius-max);

  /* Nav */
  --nav-h:         62px;
  --bottom-nav-h:  68px;
  --ease:          cubic-bezier(.4,0,.2,1);

  /* Тени */
  --shadow-sm:     0 2px 8px rgba(0,0,0,.25);
  --shadow-md:     0 8px 24px rgba(0,0,0,.35);
  --shadow-lg:     0 16px 48px rgba(0,0,0,.5);

  /* Единые переменные дизайна */
  --ui-surface:     var(--surface);
  --ui-surface-2:   var(--bg2);
  --ui-surface-soft:rgba(255,255,255,.035);
  --ui-border:      var(--line);
  --ui-border-strong: var(--line2);
  --ui-radius-sm:   var(--radius-min);
  --ui-radius-md:   var(--radius-mid);
  --ui-radius-lg:   var(--radius-max);
  --ui-radius-btn:  var(--ui-radius-md);
  --ui-radius-field:var(--ui-radius-md);
  --ui-radius-card: var(--ui-radius-lg);
  --ui-radius-modal:var(--ui-radius-lg);
  --ui-radius-pill: 999px;
  --ui-shadow-card: var(--shadow-sm);
  --ui-shadow-float:var(--shadow-md);

  /* Semantic surface tokens — используй вместо var(--surface-a) */
  --surface-a:     rgba(255,255,255,.035);  /* тонкие подложки */
  --surface-b:     rgba(255,255,255,.08);   /* карточки */
  --surface-c:     rgba(255,255,255,.12);   /* hover */
  --surface-d:     rgba(255,255,255,.18);   /* активные */
  --on-surface:    rgba(255,255,255,.82);   /* текст на тёмном */
}

/* ═══════════════════════════════════════════════════════════════════
   ТЕМА: БЕЛАЯ
═══════════════════════════════════════════════════════════════════ */
[data-theme="light"] {
  --bg:            #f5f5f7;
  --bg2:           #ffffff;
  --surface:       #ffffff;
  --surface2:      #f0f0f3;
  --line:          rgba(0,0,0,0.08);
  --line2:         rgba(0,0,0,0.14);
  --text:          #111113;
  --text1:         #111113;
  --text2:         #6b6b74;
  --text3:         #a0a0a8;
  --shadow-sm:     0 2px 8px rgba(0,0,0,.08);
  --shadow-md:     0 8px 24px rgba(0,0,0,.12);
  --shadow-lg:     0 16px 48px rgba(0,0,0,.18);
  color-scheme: light;
}
[data-theme="light"] ::-webkit-scrollbar-track { background: var(--bg); }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: #d1d1d6; }

[data-theme="light"] {
  --surface-a:     rgba(0,0,0,.03);
  --surface-b:     rgba(0,0,0,.06);
  --surface-c:     rgba(0,0,0,.10);
  --surface-d:     rgba(0,0,0,.18);
  --on-surface:    rgba(0,0,0,.75);
}

/* ═══════════════════════════════════════════════════════════════════
   ТЕМА: АВТО (системные настройки)
═══════════════════════════════════════════════════════════════════ */
@media (prefers-color-scheme: light) {
  [data-theme="auto"] {
    --bg:            #f5f5f7;
    --bg2:           #ffffff;
    --surface:       #ffffff;
    --surface2:      #f0f0f3;
    --line:          rgba(0,0,0,0.08);
    --line2:         rgba(0,0,0,0.14);
    --text:          #111113;
    --text1:         #111113;
    --text2:         #6b6b74;
    --text3:         #a0a0a8;
    --shadow-sm:     0 2px 8px rgba(0,0,0,.08);
    --shadow-md:     0 8px 24px rgba(0,0,0,.12);
    --shadow-lg:     0 16px 48px rgba(0,0,0,.18);
    color-scheme: light;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   РАЗМЕР ШРИФТА
═══════════════════════════════════════════════════════════════════ */
[data-font="sm"]   { --font-scale: 0.875; }
[data-font="md"]   { --font-scale: 1;     }
[data-font="lg"]   { --font-scale: 1.125; }
[data-font="xl"]   { --font-scale: 1.25;  }

html { font-size: calc(var(--base-fs) * var(--font-scale, 1)); }

/* ═══════════════════════════════════════════════════════════════════
   РАДИУСЫ И ПОВЕРХНОСТИ ИЗ НАСТРОЕК ДИЗАЙНА
═══════════════════════════════════════════════════════════════════ */
[data-radius="min"],
[data-radius="square"],
[data-radius="sharp"] {
  --ui-radius-sm: var(--radius-min);
  --ui-radius-md: var(--radius-min);
  --ui-radius-lg: var(--radius-min);
  --ui-radius-btn: var(--radius-min);
  --ui-radius-field: var(--radius-min);
  --ui-radius-card: var(--radius-min);
  --ui-radius-modal: var(--radius-min);
}
[data-radius="mid"],
[data-radius="medium"],
[data-radius="solid"],
[data-radius="default"] {
  --ui-radius-sm: var(--radius-min);
  --ui-radius-md: var(--radius-mid);
  --ui-radius-lg: var(--radius-mid);
  --ui-radius-btn: var(--radius-mid);
  --ui-radius-field: var(--radius-mid);
  --ui-radius-card: var(--radius-mid);
  --ui-radius-modal: var(--radius-mid);
}
[data-radius="max"],
[data-radius="apple"],
[data-radius="round"] {
  --ui-radius-sm: var(--radius-min);
  --ui-radius-md: var(--radius-mid);
  --ui-radius-lg: var(--radius-max);
  --ui-radius-btn: var(--radius-mid);
  --ui-radius-field: var(--radius-mid);
  --ui-radius-card: var(--radius-max);
  --ui-radius-modal: var(--radius-max);
}
[data-surface="clean"]{
  --ui-surface: var(--surface);
  --ui-surface-2: var(--bg2);
  --ui-surface-soft: var(--surface-a);
  --ui-border: var(--line);
  --ui-shadow-card: var(--shadow-sm);
}
[data-surface="solid"]{
  --ui-surface: color-mix(in srgb, var(--surface) 92%, var(--orange) 8%);
  --ui-surface-2: color-mix(in srgb, var(--bg2) 94%, var(--orange) 6%);
  --ui-surface-soft: color-mix(in srgb, var(--surface-a) 80%, var(--orange-dim) 20%);
  --ui-border: color-mix(in srgb, var(--line) 78%, var(--orange) 22%);
  --ui-shadow-card: 0 10px 30px rgba(0,0,0,.16);
}
[data-surface="glass"]{
  --ui-surface: color-mix(in srgb, var(--surface) 82%, transparent);
  --ui-surface-2: color-mix(in srgb, var(--bg2) 78%, transparent);
  --ui-surface-soft: color-mix(in srgb, var(--orange-dim) 55%, transparent);
  --ui-border: color-mix(in srgb, var(--line) 62%, rgba(255,255,255,.28) 38%);
  --ui-shadow-card: 0 18px 46px rgba(0,0,0,.18);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{
  background:var(--bg);color:var(--text1,var(--text));
  font-family:'Mulish',sans-serif;font-weight:400;line-height:1.65;
  overflow-x:hidden;min-height:100vh;
}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font:inherit}
ul{list-style:none}
input{font:inherit}

::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--surface2);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--orange)}

/* ─── UTILS ─── */
.t-disp{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;line-height:1.05}
.t-lbl{font-size:11px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--orange)}
.container{max-width:1890px;margin:0 auto;padding:0 5vw}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;
  letter-spacing:2px;text-transform:uppercase;
  padding:13px 26px;border-radius:var(--ui-radius-btn, var(--r-md));
  transition:.25s var(--ease);white-space:nowrap;
}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 4px 16px rgba(255,107,0,.2)}
.btn-primary:hover{background:var(--orange-l);transform:translateY(-2px);box-shadow:0 10px 28px rgba(255,107,0,.4)}
.btn-outline{border:1px solid var(--orange-brd);color:var(--orange);background:var(--ui-surface-soft, transparent)}
.btn-outline:hover{background:var(--orange-dim);transform:translateY(-2px)}
.btn-ghost{color:var(--text2);padding:13px 16px}
.btn-ghost:hover{color:var(--text)}

.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.card:hover{border-color:var(--orange-brd);transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.3), 0 0 0 1px rgba(255,107,0,.05)}

section{padding:80px 0}
.sec-header{margin-bottom:48px}
.sec-label{margin-bottom:10px}
.sec-title{font-size:clamp(28px,4vw,42px);margin-bottom:12px}
.sec-line{width:48px;height:3px;background:var(--orange);border-radius:var(--ui-radius-sm,5px)}

/* ═══════════════════════
   TOP NAV (desktop)
═══════════════════════ */
#nav{
  position:fixed;top:0;left:0;right:0;
  height:var(--nav-h);z-index:500;
  background:rgba(24,24,27,.90);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s var(--ease);
}
#nav.scrolled{box-shadow:0 4px 32px rgba(0,0,0,.4)}
.nav-inner{
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.nav-logo{display:flex;align-items:center;gap:12px;flex-shrink:0}
.nav-logo-icon{
  width:34px;height:34px;background:var(--orange-dim);
  border:1px solid var(--orange-brd);border-radius:var(--ui-radius-sm,5px);
  display:flex;align-items:center;justify-content:center;
}
.nav-logo-text{font-family:'Oswald',sans-serif;font-size:18px;font-weight:700;color:#fff}
.nav-logo-text em{color:var(--orange);font-style:normal}
.nav-logo-sub{font-size:9px;letter-spacing:3px;color:var(--text3);text-transform:uppercase;display:block;margin-top:-2px}
.nav-logo-page{display:block;font-size:12px;color:#fff;font-weight:800;letter-spacing:.2px;text-transform:none;margin-top:1px;line-height:1.15;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-link{
  font-size:13px;font-weight:600;color:var(--text2);
  letter-spacing:.5px;padding:7px 13px;border-radius:var(--ui-radius-sm,5px);
  transition:.2s var(--ease);position:relative;
}
.nav-link:hover{color:var(--text);background:var(--surface-a)}
.nav-link.active{color:var(--orange)}
.nav-link.active::after{
  content:'';position:absolute;bottom:-1px;left:13px;right:13px;
  height:2px;background:var(--orange);border-radius:var(--ui-radius-sm,5px);
}
.nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-phone{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;color:var(--orange)}
.nav-phone:hover{opacity:.8}

/* Login button in nav */
.nav-auth-btn{
  display:flex;align-items:center;gap:7px;
  background:var(--orange-dim);border:1px solid var(--orange-brd);
  color:var(--orange);font-family:'Oswald',sans-serif;
  font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  padding:7px 16px;border-radius:var(--ui-radius-sm,5px);transition:.2s var(--ease);
}
.nav-auth-btn:hover{background:rgba(255,107,0,.18)}
.nav-avatar{
  width:32px;height:32px;border-radius:50%;
  background:var(--orange);color:#fff;
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:.2s var(--ease);flex-shrink:0;
}
.nav-avatar:hover{opacity:.85;transform:scale(1.05)}

/* Burger */
.burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:38px;height:38px;padding:5px;border-radius:var(--ui-radius-sm,5px);
}
.burger:hover{background:var(--surface-b)}
.burger span{display:block;width:100%;height:2px;background:var(--text);border-radius:var(--ui-radius-sm,5px);transition:.3s var(--ease);transform-origin:center}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ═══════════════════════
   BOTTOM NAV (mobile)
═══════════════════════ */
#bottom-nav{
  display:none;
  position:fixed;bottom:0;left:0;right:0;
  height:var(--bottom-nav-h);
  background:rgba(24,24,27,.96);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid var(--line);
  z-index:500;
  padding:0 4px;
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
.bnav-inner{
  height:100%;display:flex;align-items:stretch;
}
.bnav-item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;padding:8px 4px;border-radius:var(--ui-radius-sm,5px);
  color:var(--text3);transition:.2s var(--ease);
  position:relative;cursor:pointer;
}
.bnav-item:hover{color:var(--text2)}
.bnav-item.active{color:var(--orange)}
.bnav-item.active .bnav-icon-wrap::after{
  content:'';position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;background:var(--orange);border-radius:50%;
}
.bnav-icon-wrap{position:relative;display:flex;align-items:center;justify-content:center}
.bnav-icon{font-size:22px;line-height:1;transition:.2s var(--ease)}
.bnav-item.active .bnav-icon{transform:translateY(-1px)}
.bnav-label{font-size:10px;font-weight:600;letter-spacing:.3px;line-height:1}
.bnav-badge{
  position:absolute;top:-4px;right:-8px;
  min-width:16px;height:16px;padding:0 4px;
  background:var(--orange);color:#fff;
  font-size:9px;font-weight:700;border-radius:99px;
  display:flex;align-items:center;justify-content:center;
  line-height:1;
}

#notifs-fab{
  position:fixed;
  right:16px;
  bottom:calc(var(--bottom-nav-h) + 16px);
  z-index:560;
  width:58px;height:58px;
  border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#ff7b1f 0%, #ff6b00 100%);
  color:#fff;
  box-shadow:0 14px 36px rgba(255,107,0,.34), 0 4px 18px rgba(0,0,0,.32);
  border:1px solid var(--surface-d);
  transition:transform .2s var(--ease), opacity .2s var(--ease), box-shadow .2s var(--ease);
}
#notifs-fab.is-hidden{opacity:0;pointer-events:none;transform:translateY(14px) scale(.92)}
#notifs-fab.is-active{transform:translateY(-2px);box-shadow:0 18px 42px rgba(255,107,0,.42), 0 6px 20px rgba(0,0,0,.36)}
#notifs-fab:hover{transform:translateY(-2px) scale(1.02)}
#notifs-fab .notifs-fab-ico{font-size:24px;line-height:1}
#notifs-fab .bnav-badge{top:4px;right:4px;border:2px solid rgba(255,107,0,.95)}
@media (min-width: 901px){
  #notifs-fab{bottom:24px;right:24px}
}

/* ═══════════════════════
   MOBILE DRAWER
═══════════════════════ */
#drawer{
  position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
  background:var(--bg2);z-index:905;
  transform:translateX(100%);transition:transform .35s var(--ease);
  overflow-y:auto;display:flex;flex-direction:column;
}
#drawer.open{transform:translateX(0)}
.drawer-links{padding:20px 20px 0;flex:1}
.drawer-link{
  display:flex;align-items:center;gap:14px;padding:16px 0;
  border-bottom:1px solid var(--line);
  font-family:'Oswald',sans-serif;font-size:20px;font-weight:500;
  color:var(--text2);transition:.2s var(--ease);
}
.drawer-link:hover,.drawer-link.active{color:var(--orange)}
.dl-icon{
  width:38px;height:38px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:var(--ui-radius-sm,5px);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;
}
.drawer-phone{font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;color:var(--orange)}
.drawer-addr{font-size:13px;color:var(--text3);margin-top:6px}

/* ═══════════════════════
   AUTH OVERLAY
═══════════════════════ */
#auth-overlay{
  position:fixed;
  inset:0;
  z-index: 999;
  background: rgb(0 0 0 / 92%);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  animation:fadeIn .3s var(--ease) both;
  align-content: space-around;
  flex-wrap: wrap;
}
#auth-overlay.hidden{display:none}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.auth-modal{
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  width:100%;max-width:400px;
  padding:36px 32px 32px;
  animation:slideUp .35s var(--ease) both;
}
@keyframes slideUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.auth-logo{
  display:flex;align-items:center;gap:10px;margin-bottom:28px;
}
.auth-logo-icon{
  width:42px;height:42px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;
}
.auth-logo-name{font-family:'Oswald',sans-serif;font-size:22px;font-weight:700}
.auth-logo-name em{color:var(--orange);font-style:normal}

.auth-step{display:none}
.auth-step.active{display:block;animation:fadeIn .25s var(--ease) both}

.auth-title{font-family:'Oswald',sans-serif;font-size:22px;font-weight:700;margin-bottom:8px}
.auth-sub{font-size:14px;color:var(--text2);margin-bottom:28px;line-height:1.6}

.auth-label{font-size:12px;font-weight:600;color:var(--text3);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px;display:block}
.auth-input{
  width:100%;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--ui-radius-sm,5px);padding:13px 16px;font-size:16px;color:var(--text);
  outline:none;transition:.2s var(--ease);
}
.auth-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.12)}
.auth-input::placeholder{color:var(--text3)}
.auth-input--phone{font-family:'Oswald',sans-serif;font-size:22px;letter-spacing:1.2px;font-weight:500;padding:15px 18px;min-height:54px}
.auth-input--phone::placeholder{letter-spacing:.2px;font-family:inherit}

/* OTP boxes */
.otp-row{display:flex;gap:12px;justify-content:center;margin-bottom:24px}
.otp-box{
  width:56px;height:64px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;
  color:var(--orange);text-align:center;outline:none;
  transition:.2s var(--ease);caret-color:var(--orange);
}
.otp-box:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.15)}
.otp-box.filled{border-color:var(--orange-brd);background:var(--orange-dim)}

.auth-btn{
  width:100%;background:var(--orange);color:#fff;
  font-family:'Oswald',sans-serif;font-size:14px;font-weight:600;
  letter-spacing:2px;text-transform:uppercase;
  padding:14px;border-radius:var(--ui-radius-sm,5px);margin-top:4px;
  transition:.2s var(--ease);
}
.auth-btn:hover{background:var(--orange-l);transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,107,0,.3)}
.auth-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}

.auth-hint{
  font-size:12px;color:var(--text3);text-align:center;
  margin-top:16px;line-height:1.6;
}
.auth-hint a{color:var(--orange);cursor:pointer}
.auth-hint a:hover{text-decoration:underline}

.auth-skip{
  display:flex;align-items:center;justify-content:center;
  gap:6px;margin-top:16px;font-size:13px;color:var(--text3);
  cursor:pointer;transition:.2s;
}
.auth-skip:hover{color:var(--text2)}

.otp-hint{
  text-align:center;font-size:13px;color:var(--text3);margin-bottom:6px;
}
.otp-hint strong{color:var(--orange);font-size:18px;letter-spacing:4px;font-family:'Oswald',sans-serif}

/* Success checkmark */
.auth-success{
  text-align:center;padding:20px 0;
}
.auth-check{
  width:72px;height:72px;border-radius:50%;
  background:rgba(34,197,94,.12);border:2px solid var(--green);
  display:flex;align-items:center;justify-content:center;
  font-size:32px;margin:0 auto 20px;
  animation:popIn .4s var(--ease) both;
}
@keyframes popIn{from{transform:scale(0)}to{transform:scale(1)}}

/* ═══════════════════════
   APP WRAPPER
═══════════════════════ */
#app{
  padding-top:var(--nav-h);
  padding-bottom:0;
  min-height:100vh;
}

.page{display:none;animation:pageIn .35s var(--ease) both}
.page.active{display:block}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ═══════════════════════
   HERO
═══════════════════════ */
.hero{
  min-height:calc(100svh - var(--nav-h));
  display:flex;align-items:center;
  position:relative;overflow:hidden;padding:56px 0;
}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,107,0,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,107,0,.04) 1px,transparent 1px);
  background-size:54px 54px;
  animation: gridShift 20s linear infinite;
}
@keyframes gridShift {
  0%   { background-position: 0 0; }
  100% { background-position: 54px 54px; }
}
.hero-glow{
  position:absolute;width:780px;height:780px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,107,0,.12) 0%,rgba(255,107,0,.04) 40%,transparent 65%);
  right:-180px;top:50%;transform:translateY(-50%);pointer-events:none;
  animation: glowPulse 4s ease-in-out infinite;
}
.hero-glow2{
  position:absolute;width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,107,0,.06) 0%,transparent 65%);
  left:-100px;bottom:-100px;pointer-events:none;
  animation: glowPulse 5s ease-in-out infinite reverse;
}
@keyframes glowPulse {
  0%,100% { opacity:1; transform:translateY(-50%) scale(1); }
  50%      { opacity:.7; transform:translateY(-50%) scale(1.08); }
}
.hero-body{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--orange-dim);border:1px solid var(--orange-brd);
  color:var(--orange);font-size:10px;font-weight:700;letter-spacing:3px;
  text-transform:uppercase;padding:7px 16px;border-radius:99px;margin-bottom:26px;
  box-shadow: 0 0 20px rgba(255,107,0,.15);
}
.hero-dot{width:6px;height:6px;background:var(--orange);border-radius:50%;animation:blink 2s infinite;box-shadow:0 0 6px rgba(255,107,0,.8)}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}
.hero-title{font-size:clamp(42px,5.5vw,78px);margin-bottom:20px;line-height:1.0}
.hero-title .acc{
  color:var(--orange);
  text-shadow: 0 0 40px rgba(255,107,0,.3);
}
.hero-desc{font-size:15px;color:var(--text2);max-width:450px;margin-bottom:36px;line-height:1.75}
.hero-btns{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px}
.hero-stats{display:flex;gap:32px;padding-top:36px;border-top:1px solid var(--line);flex-wrap:wrap}
.stat-num{font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;color:var(--orange);line-height:1.1}
.stat-lbl{font-size:12px;color:var(--text3);margin-top:3px;font-weight:500}

.hero-visual{display:flex;flex-direction:column;gap:12px}
.hv-card{
  padding:18px 22px;display:flex;align-items:center;gap:14px;
  transition:.3s var(--ease);
  animation: cardFloat 0s ease-in-out infinite;
}
.hv-card:nth-child(1){animation-duration:3.5s;animation-delay:0s}
.hv-card:nth-child(2){animation-duration:4.2s;animation-delay:.5s}
.hv-card:nth-child(3){animation-duration:3.8s;animation-delay:1s}
.hv-card:nth-child(4){animation-duration:4.5s;animation-delay:1.5s}
.hv-card:hover{
  border-color:var(--orange-brd);
  transform:translateX(4px);
  box-shadow:0 8px 28px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,107,0,.1);
}
@keyframes cardFloat {
  0%,100%{ transform:translateY(0) }
  50%    { transform:translateY(-3px) }
}
.hv-ico{
  width:42px;height:42px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;
  transition:.3s var(--ease);
}
.hv-card:hover .hv-ico{
  background:rgba(255,107,0,.18);
  box-shadow:0 0 16px rgba(255,107,0,.2);
}
.hv-t{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;text-transform:uppercase}
.hv-d{font-size:12px;color:var(--text2);margin-top:2px}

/* ═══════════════════════
   SERVICES TEASER
═══════════════════════ */
.st-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.st-card{
  padding:26px 20px;cursor:pointer;
  position:relative;overflow:hidden;
}
.st-card::before{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,107,0,.06) 0%,transparent 60%);
  opacity:0;transition:.3s var(--ease);
}
.st-card:hover::before{opacity:1}
.st-emoji{
  font-size:26px;margin-bottom:13px;display:block;
  transition:transform .3s var(--ease);
}
.st-card:hover .st-emoji{transform:scale(1.15) rotate(-5deg)}
.st-t{font-family:'Oswald',sans-serif;font-size:16px;font-weight:600;text-transform:uppercase;margin-bottom:7px}
.st-d{font-size:13px;color:var(--text2);line-height:1.6}
.st-arr{margin-top:14px;font-size:17px;color:var(--orange);opacity:0;transform:translateX(-6px);transition:.2s var(--ease);display:block}
.st-card:hover .st-arr{opacity:1;transform:none}

/* ═══════════════════════
   PRICING
═══════════════════════ */
.ptabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.ptab{
  font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:9px 20px;border-radius:var(--ui-radius-sm,5px);border:1px solid var(--line);
  color:var(--text2);background:var(--surface);transition:.2s var(--ease);
}
.ptab:hover,.ptab.active{color:var(--orange);border-color:var(--orange);background:var(--orange-dim)}
.ptbl-wrap{border-radius:var(--ui-radius-sm,5px);border:1px solid var(--line);overflow:hidden}
.ptbl{width:100%;border-collapse:collapse;display:none}
.ptbl.active{display:table}
.ptbl thead{background:var(--surface2)}
.ptbl th{padding:13px 22px;text-align:left;font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--orange)}
.ptbl th:last-child{text-align:right}
.ptbl td{padding:15px 22px;font-size:14px;border-top:1px solid var(--line)}
.ptbl td:nth-child(2){color:var(--text2);font-size:13px}
.ptbl td:last-child{text-align:right;font-family:'Oswald',sans-serif;font-size:16px;font-weight:600;color:var(--orange);white-space:nowrap}
.ptbl tbody tr:hover td{background:rgba(255,107,0,.04)}
.p-note{margin-top:18px;padding:13px 16px;background:var(--orange-dim);border:1px solid var(--orange-brd);border-radius:var(--ui-radius-sm,5px);font-size:13px;color:var(--text2);display:flex;align-items:center;gap:9px}

/* ═══════════════════════
   ABOUT
═══════════════════════ */
.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.about-text p{font-size:14px;color:var(--text2);line-height:1.8;margin-bottom:16px}
.af-list{display:flex;flex-direction:column;gap:13px;margin-top:28px}
.af-item{display:flex;gap:12px;align-items:flex-start}
.af-ico{
  width:36px;height:36px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:var(--ui-radius-sm,5px);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;margin-top:2px;
}
.af-t{font-weight:700;font-size:13px;margin-bottom:2px}
.af-d{font-size:12px;color:var(--text2)}
.an-list{display:flex;flex-direction:column;gap:11px}
.an-card{padding:20px 24px;display:flex;align-items:center;gap:20px}
.an-num{font-family:'Oswald',sans-serif;font-size:34px;font-weight:700;color:var(--orange);line-height:1;min-width:72px}
.an-t{font-weight:700;font-size:13px;margin-bottom:2px}
.an-s{font-size:12px;color:var(--text3)}

/* ═══════════════════════
   REVIEWS
═══════════════════════ */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rv-card{padding:26px;position:relative}
.rv-stars{color:var(--orange);font-size:13px;letter-spacing:2px;margin-bottom:13px}
.rv-text{font-size:14px;color:#ccc;line-height:1.75;margin-bottom:18px;font-style:italic}
.rv-author{display:flex;align-items:center;gap:11px}
.rv-av{
  width:38px;height:38px;border-radius:50%;background:var(--orange-dim);border:1px solid var(--orange-brd);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;color:var(--orange);flex-shrink:0;
}
.rv-name{font-weight:700;font-size:13px}
.rv-date{font-size:11px;color:var(--text3);margin-top:2px}
.rv-q{position:absolute;top:16px;right:20px;font-size:48px;color:var(--orange);opacity:.07;font-family:Georgia,serif;line-height:1}

/* ═══════════════════════
   CONTACTS
═══════════════════════ */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.ci-list{display:flex;flex-direction:column;gap:12px}
.ci-card{padding:20px 22px;display:flex;align-items:center;gap:14px}
.ci-ico{
  width:44px;height:44px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;
}
.ci-lbl{font-size:11px;color:var(--text3);font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:3px}
.ci-val{font-size:14px;font-weight:600}
.ci-val a{color:var(--orange)}
.ci-val a:hover{text-decoration:underline}
.hours-wrap{border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);overflow:hidden;margin-top:16px}
.hr-row{display:flex;justify-content:space-between;padding:12px 18px;font-size:13px;border-bottom:1px solid var(--line)}
.hr-row:last-child{border:none}
.hr-row .day{color:var(--text2)}
.hr-row .time{font-weight:600}
.hr-row .time.off{color:var(--text3)}
.hr-row.today{background:var(--orange-dim)}
.hr-row.today .day{color:var(--orange);font-weight:700}
.map-box{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);
  height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--text3);
}
.map-box .mi{font-size:44px;opacity:.35}
.map-box p{font-size:14px;font-weight:600;color:var(--text2)}
.map-box a{font-size:13px;color:var(--orange);border-bottom:1px solid var(--orange-brd)}

/* ═══════════════════════
   CABINET PAGE
═══════════════════════ */
.cab-hero{
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
  border-bottom:1px solid var(--line);
  padding:48px 0 40px;
}
.cab-profile-row{
  display:flex;align-items:center;gap:20px;margin-bottom:36px;flex-wrap:wrap;
}
.cab-avatar{
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,var(--orange),#cc4400);
  color:#fff;font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 0 0 3px rgba(255,107,0,.25);
}
.cab-name{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;margin-bottom:3px}
.cab-phone-lbl{font-size:13px;color:var(--text3)}

.cab-tabs{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;
  border-bottom:0;overflow:visible;scrollbar-width:none;
}
.cab-tabs::-webkit-scrollbar{display:none}
.cab-tab{
  font-family:inherit;font-size:14px;font-weight:700;letter-spacing:0;text-transform:none;
  padding:16px;color:var(--text);border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg,var(--card),var(--bg2));
  transition:.2s var(--ease);white-space:normal;flex-shrink:1;
  min-height:92px;text-align:left;display:flex;align-items:center;gap:13px;
  box-shadow:0 10px 26px rgba(0,0,0,.08);
}
.cab-tab:hover{color:var(--text);border-color:rgba(255,107,0,.38);transform:translateY(-1px)}
.cab-tab.active{color:var(--text);border-color:var(--orange);box-shadow:0 14px 34px rgba(255,107,0,.16)}
.cab-tab-icon{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.12);font-size:22px;flex:0 0 auto}
.cab-tab-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.cab-tab-title{font-family:'Oswald',sans-serif;font-size:20px;font-weight:700;line-height:1.05;color:var(--text)}
.cab-tab-desc{font-size:13px;font-weight:500;line-height:1.25;color:var(--text3)}

.cab-pane{display:none;padding:36px 0;animation:pageIn .25s var(--ease) both}
.cab-pane.active{display:block}

/* Profile pane */
.profile-form{max-width:480px;display:flex;flex-direction:column;gap:18px}
.pf-group{display:flex;flex-direction:column;gap:6px}
.pf-label{font-size:12px;font-weight:600;color:var(--text3);letter-spacing:1px;text-transform:uppercase}
.pf-input{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);
  padding:12px 16px;font-size:15px;color:var(--text);outline:none;transition:.2s var(--ease);
}
.pf-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.12)}
.pf-input:disabled{opacity:.5;cursor:not-allowed}
.pf-save{margin-top:4px;align-self:flex-start}
.pf-toast{
  display:none;align-items:center;gap:8px;
  padding:10px 16px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3);
  border-radius:var(--ui-radius-sm,5px);font-size:13px;color:var(--green);margin-top:8px;
}
.pf-toast.show{display:flex;animation:fadeIn .3s var(--ease) both}

/* History pane */
.hist-list{display:flex;flex-direction:column;gap:12px}
.hist-item{
  padding:18px 20px;
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
}
.hist-status{
  width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:4px;
}
.hist-status.done{background:var(--green)}
.hist-status.process{background:var(--orange);animation:blink 1.5s infinite}
.hist-status.wait{background:var(--text3)}
.hist-title{font-weight:600;font-size:14px;margin-bottom:3px}
.hist-meta{font-size:12px;color:var(--text3)}
.hist-price{font-family:'Oswald',sans-serif;font-size:17px;font-weight:600;color:var(--orange);white-space:nowrap}
.hist-badge{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:3px 9px;border-radius:99px;margin-left:8px;
}
.hist-badge.done{background:rgba(34,197,94,.12);color:var(--green)}
.hist-badge.process{background:rgba(255,107,0,.12);color:var(--orange)}
.hist-badge.wait{background:var(--surface-b);color:var(--text3)}

/* Notifications pane */
.notif-list{display:flex;flex-direction:column;gap:10px}
.notif-item{
  padding:16px 18px;display:flex;gap:14px;align-items:flex-start;
}
.notif-ico{
  width:40px;height:40px;border-radius:var(--ui-radius-md,10px);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:18px;
}
.notif-ico.info{background:rgba(99,179,237,.12);border:1px solid rgba(99,179,237,.2)}
.notif-ico.success{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.2)}
.notif-ico.warning{background:var(--orange-dim);border:1px solid var(--orange-brd)}
.notif-title{font-weight:700;font-size:14px;margin-bottom:4px}
.notif-text{font-size:13px;color:var(--text2);line-height:1.5}
.notif-time{font-size:11px;color:var(--text3);margin-top:5px}
.notif-item.unread{background:rgba(255,107,0,.04);border-color:rgba(255,107,0,.12)}
.notif-dot{
  width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0;margin-top:6px;
}

/* Empty state */
.empty-state{
  text-align:center;padding:60px 20px;
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.empty-icon{font-size:52px;opacity:.3}
.empty-t{font-family:'Oswald',sans-serif;font-size:18px;color:var(--text2)}
.empty-d{font-size:14px;color:var(--text3)}

/* Logout btn */
.logout-btn{
  display:flex;align-items:center;gap:8px;color:var(--red);font-size:13px;font-weight:600;
  padding:10px 14px;border-radius:var(--ui-radius-sm,5px);border:1px solid rgba(239,68,68,.2);
  background:rgba(239,68,68,.06);transition:.2s var(--ease);margin-top:24px;
}
.logout-btn:hover{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4)}

/* ═══════════════════════
   CTA
═══════════════════════ */
.cta-strip{
  background:linear-gradient(135deg,#FF6B00 0%,#e55200 60%,#c44600 100%);
  padding:68px 0;text-align:center;position:relative;overflow:hidden;
}
.cta-strip::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(var(--surface-a) 1px,transparent 1px),linear-gradient(90deg,var(--surface-a) 1px,transparent 1px);
  background-size:36px 36px;
  animation: gridShift 15s linear infinite reverse;
}
.cta-strip::after{
  content:'';position:absolute;
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,var(--surface-b) 0%,transparent 65%);
  left:-150px;top:50%;transform:translateY(-50%);pointer-events:none;
}
.cta-inner{position:relative;z-index:1}
.cta-t{font-size:clamp(26px,4vw,44px);color:#fff;margin-bottom:10px}
.cta-s{font-size:15px;color:var(--on-surface);margin-bottom:28px}
.cta-phone{
  display:block;font-family:'Oswald',sans-serif;
  font-size:clamp(34px,5.5vw,58px);font-weight:700;color:#fff;letter-spacing:2px;
  margin-bottom:22px;transition:opacity .2s, transform .2s;
}
.cta-phone:hover{opacity:.85;transform:scale(1.02)}
.cta-meta{font-size:13px;color:var(--on-surface);display:flex;justify-content:center;gap:24px;flex-wrap:wrap}

/* ═══════════════════════
   FOOTER
═══════════════════════ */
footer{background:#111113;border-top:1px solid var(--line);padding:28px 0}
.foot-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.foot-brand{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;color:var(--text3)}
.foot-brand em{color:var(--orange);font-style:normal}
.foot-copy{font-size:12px;color:var(--text3)}
.foot-links{display:flex;gap:18px}
.foot-links a{font-size:12px;color:var(--text3);transition:.2s}
.foot-links a:hover{color:var(--orange)}

/* ═══════════════════════
   REVEAL
═══════════════════════ */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ═══════════════════════
   RESPONSIVE
═══════════════════════ */
@media(max-width:900px){
  .nav-links,.nav-phone{display:none}
  .burger{display:flex}
  #bottom-nav{display:flex}
  #app{padding-bottom:var(--bottom-nav-h)}
  footer{margin-bottom:0}

  .hero-body{grid-template-columns:1fr}
  .hero-visual{display:none}
  .st-grid{grid-template-columns:repeat(2,1fr)}
  .rv-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr;gap:36px}
  .ct-grid{grid-template-columns:1fr}
  .cab-profile-row{flex-direction:row}
}
@media(max-width:560px){
  section{padding:56px 0}
  .st-grid{grid-template-columns:1fr}
  .hero-btns{flex-direction:column}
  .btn{justify-content:center}
  .hero-stats{gap:18px}
  .cta-meta{flex-direction:column;gap:6px}
  .ptbl th:nth-child(2),.ptbl td:nth-child(2){display:none}
  .foot-links{display:none}
  .cab-tabs{margin:0 -5vw;padding:0 5vw}
  .hist-item{grid-template-columns:auto 1fr;grid-template-rows:auto auto}
  .hist-price{grid-column:2;justify-self:start}
}
@media(max-width:380px){
  .container{padding:0 14px}
  .otp-box{width:48px;height:58px;font-size:24px}
  .otp-row{gap:8px}
}

/* ══════════════════════════════════════════════
   MY ORDERS PAGE
══════════════════════════════════════════════ */

/* ─── Hero ─── */
.mo-hero {
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 44px 0 28px;
}
.mo-hero-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.mo-hero-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  line-height: 1.1;
  margin: 8px 0 6px;
}
.mo-hero-sub {
  font-size: 13px;
  color: var(--text3);
  margin-top: 2px;
}

/* ─── Stats ─── */
.mo-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 24px 0 20px;
}
.mo-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 16px 12px;
  text-align: center;
}
.mo-stat-num {
  font-family: 'Oswald', sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  color: var(--text);
}
.mo-stat-lbl {
  font-size: 11px;
  color: var(--text3);
  margin-top: 5px;
  font-weight: 600;
  letter-spacing: .5px;
}

/* ─── Filters ─── */
.mo-filters {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.mo-filters::-webkit-scrollbar { display: none; }
.mo-filter {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 13px;
  font-weight: 600;
  color: var(--text2);
  cursor: pointer;
  white-space: nowrap;
  transition: .2s var(--ease);
  flex-shrink: 0;
}
.mo-filter:active { transform: scale(.95); }
.mo-filter.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}
.mo-filter-cnt {
  background: var(--surface2);
  color: var(--text3);
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 99px;
  min-width: 18px;
  text-align: center;
}
.mo-filter.active .mo-filter-cnt {
  background: rgba(255,107,0,.2);
  color: var(--orange);
}

/* ─── Order Card ─── */
.mo-card {
  margin-bottom: 16px;
  padding: 0;
  overflow: hidden;
  border-radius: var(--ui-radius-md,10px);
  transition: .2s var(--ease);
}
.mo-card:active { transform: scale(.99); }

.mo-card-head {
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
}
.mo-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.mo-card-id {
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--text3);
  letter-spacing: 1px;
}
.mo-card-title {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  margin-bottom: 5px;
}
.mo-card-car {
  font-size: 12px;
  color: var(--text3);
}

/* ─── Status badge ─── */
.mo-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 99px;
  white-space: nowrap;
}
.mo-status-badge.done      { background: rgba(34,197,94,.12); color: var(--green); }
.mo-status-badge.process   { background: rgba(255,107,0,.12); color: var(--orange); }
.mo-status-badge.new       { background: rgba(160,160,168,.12); color: var(--text2); }
.mo-status-badge.cancelled { background: rgba(239,68,68,.12); color: var(--red); }

/* r280: mo-card-meta removed from #myorders cards; meta CSS intentionally retired. */

/* ─── Timeline ─── */
.mo-timeline {
  padding: 16px 20px;
  display: flex;
  align-items: flex-start;
  gap: 0;
  border-bottom: 1px solid var(--line);
}
.mo-tl-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
  gap: 6px;
}
.mo-tl-dot {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--surface2);
  border: 2px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: var(--text3);
  z-index: 1;
  flex-shrink: 0;
  transition: .25s var(--ease);
}
.mo-tl-dot.done {
  background: rgba(34,197,94,.12);
  border-color: var(--green);
  color: var(--green);
}
.mo-tl-line {
  position: absolute;
  top: 14px;
  left: calc(50% + 15px);
  right: calc(-50% + 15px);
  height: 2px;
  background: var(--line);
  z-index: 0;
  transition: .25s var(--ease);
}
.mo-tl-line.done { background: var(--green); }
.mo-tl-body {
  text-align: center;
  padding: 0 2px;
}
.mo-tl-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
  line-height: 1.3;
}
.mo-tl-item.done .mo-tl-label { color: var(--text2); }
.mo-tl-time {
  font-size: 10px;
  color: var(--text3);
  margin-top: 2px;
  white-space: nowrap;
}

/* ─── Card Actions ─── */
.mo-card-actions {
  padding: 14px 20px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ─── Mobile overrides ─── */
@media (max-width: 599px) {
  .mo-hero { padding: 28px 0 20px; }
  .mo-hero-row { flex-direction: column; gap: 12px; }
  .mo-hero-row .btn { width: 100%; justify-content: center; }
  .mo-stats { gap: 8px; margin: 16px 0 16px; }
  .mo-stat-card { padding: 12px 8px; }
  .mo-stat-num  { font-size: 22px; }
  .mo-stat-lbl  { font-size: 10px; }
  .mo-card-head { padding: 14px 16px 12px; }
  .mo-card-actions { padding: 12px 16px; }
  .mo-timeline { padding: 12px 16px; }
  .mo-card-actions .btn { flex: 1; justify-content: center; font-size: 11px; padding: 8px 10px; }
  .mo-tl-label { font-size: 10px; }
  .mo-tl-time  { display: none; }
}

/* ═══════════════════════
   SCROLL TO TOP
═══════════════════════ */
#scroll-top {
  position: fixed;
  right: 20px;
  bottom: calc(var(--bottom-nav-h) + 80px);
  z-index: 400;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1px solid var(--line);
  color: var(--text2);
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  opacity: 0; pointer-events: none;
  transform: translateY(12px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), background .2s;
  box-shadow: 0 4px 16px rgba(0,0,0,.3);
}
#scroll-top.vis {
  opacity: 1; pointer-events: all; transform: none;
}
#scroll-top:hover {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}
@media(min-width:901px){
  #scroll-top { bottom: 28px; right: 28px; }
}

/* ═══════════════════════
   IMPROVED REVIEWS
═══════════════════════ */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rv-card{
  padding:26px;position:relative;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.rv-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  border-color: var(--orange-brd);
}
.rv-stars{color:var(--orange);font-size:13px;letter-spacing:2px;margin-bottom:13px}
.rv-text{font-size:14px;color:#ccc;line-height:1.75;margin-bottom:18px;font-style:italic}
.rv-author{display:flex;align-items:center;gap:11px}
.rv-av{
  width:38px;height:38px;border-radius:50%;background:var(--orange-dim);border:1px solid var(--orange-brd);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;color:var(--orange);flex-shrink:0;
}
.rv-name{font-weight:700;font-size:13px}
.rv-date{font-size:11px;color:var(--text3);margin-top:2px}
.rv-q{position:absolute;top:16px;right:20px;font-size:48px;color:var(--orange);opacity:.07;font-family:Georgia,serif;line-height:1}

/* ═══════════════════════
   NAV IMPROVEMENTS
═══════════════════════ */
#nav.scrolled {
  background: rgba(18,18,20,.97);
}

/* ═══════════════════════
   PAGE TRANSITIONS
═══════════════════════ */
@keyframes pageSlideIn {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:none; }
}
.page { animation: pageSlideIn .3s var(--ease) both; }

/* ═══════════════════════════════════════════
   CABINET v2 — улучшенный кабинет клиента
═══════════════════════════════════════════ */

/* Locked state */
.cab-locked {
  text-align: center;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 420px;
  margin: 0 auto;
}
.cab-locked-ico { font-size: 56px; margin-bottom: 16px; opacity: .8; }
.cab-locked-title {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  margin-bottom: 10px;
}
.cab-locked-sub {
  font-size: 14px; color: var(--text2);
  line-height: 1.7; max-width: 340px;
}

/* Avatar wrap with badge */
.cab-avatar-wrap { position: relative; flex-shrink: 0; }
.cab-av-badge {
  position: absolute;
  top: -4px; right: -4px;
  width: 20px; height: 20px;
  background: var(--orange);
  color: #fff;
  font-size: 10px; font-weight: 700;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--bg2);
}

/* Profile meta chips */
.cab-profile-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.cab-phone-chip, .cab-car-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text3);
  background: var(--surface2);
  border: 1px solid var(--line);
  padding: 3px 10px;
  border-radius: 99px;
}
.cab-profile-actions {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-end;
  flex-shrink: 0;
}
.cab-role-btn {
  font-size: 11px;
  padding: 7px 14px;
  color: var(--text2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
}
.cab-role-btn:hover { color: var(--text); border-color: var(--orange-brd); }

/* Mini stats bar */
.cab-mini-stats {
  display: flex;
  align-items: center;
  gap: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 14px 20px;
  margin-bottom: 28px;
  flex-wrap: wrap;
  row-gap: 12px;
}
.cab-ms-item {
  flex: 1;
  text-align: center;
  min-width: 70px;
}
.cab-ms-num {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700;
  line-height: 1.1;
}
.cab-ms-lbl {
  font-size: 10px;
  color: var(--text3);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 3px;
}
.cab-ms-sep {
  width: 1px; height: 32px;
  background: var(--line);
  flex-shrink: 0;
}

/* Tab badge */
.cab-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px; height: 18px;
  padding: 0 5px;
  border-radius: 99px;
  font-size: 10px; font-weight: 700;
  background: var(--surface2);
  color: var(--text3);
  margin-left: 5px;
}
.cab-tab-badge.orange {
  background: var(--orange);
  color: #fff;
  animation: blink 2s infinite;
}

/* Pane layout with side cards */
.cab-pane-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 24px;
  align-items: start;
}
@media(max-width:860px) {
  .cab-pane-layout { grid-template-columns: 1fr; }
  .cab-side-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
}
@media(max-width:480px) {
  .cab-side-cards { grid-template-columns: 1fr; }
}

/* Profile form card */
.profile-form-card {
  padding: 28px;
}
.pfc-title {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--text2);
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 10px;
}
.pfc-title::before {
  content: '';
  width: 3px; height: 16px;
  background: var(--orange);
  border-radius: var(--ui-radius-sm,5px);
  flex-shrink: 0;
}

/* Quick cards */
.cab-side-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cab-quick-card {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: .2s var(--ease);
}
.cab-quick-card:hover {
  border-color: var(--orange-brd);
  transform: translateX(3px);
}
.cqc-ico {
  width: 38px; height: 38px;
  border-radius: var(--ui-radius-md,10px);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.cqc-body { flex: 1; min-width: 0; }
.cqc-title { font-weight: 700; font-size: 13px; }
.cqc-sub { font-size: 11px; color: var(--text3); margin-top: 2px; }
.cqc-arr {
  font-size: 16px; color: var(--text3);
  transition: transform .2s, color .2s;
}
.cab-quick-card:hover .cqc-arr { transform: translateX(3px); color: var(--orange); }

/* Loyalty hero */
.loyalty-hero {
  padding: 32px 28px;
  text-align: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 16px;
}
.loy-bg-glow {
  position: absolute; inset: 0;
  pointer-events: none;
}
.loy-level-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 99px;
  border: 1px solid;
  margin-bottom: 16px;
  position: relative;
}
.loy-pts {
  font-family: 'Oswald', sans-serif;
  font-size: 56px; font-weight: 700;
  line-height: 1;
  position: relative;
}
.loy-pts-sub {
  font-size: 13px; color: var(--text2);
  margin-top: 6px; margin-bottom: 20px;
  position: relative;
}
.loy-progress-wrap { position: relative; max-width: 480px; margin: 0 auto 20px; }
.loy-progress-bar {
  height: 8px;
  background: var(--surface2);
  border-radius: 99px;
  overflow: hidden;
}
.loy-progress-fill {
  height: 100%;
  border-radius: 99px;
  transition: width .8s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 0 8px currentColor;
}
.loy-progress-labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text3);
  margin-top: 6px;
}

/* Loyalty levels */
.loy-levels {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.loy-lvl-card {
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: .2s var(--ease);
}
.loy-active {
  border-color: var(--orange-brd);
  background: var(--orange-dim);
}
.loy-locked { opacity: .5; }
.loy-lvl-emo { font-size: 24px; flex-shrink: 0; }
.loy-lvl-info { flex: 1; }
.loy-lvl-name { font-weight: 700; font-size: 14px; }
.loy-lvl-range { font-size: 11px; color: var(--text3); margin-top: 2px; }
.loy-you {
  font-size: 11px; color: var(--orange);
  font-weight: 600; margin-left: 6px;
}
.loy-lvl-disc {
  font-size: 13px; font-weight: 700;
  text-align: right; white-space: nowrap;
}

@media(max-width:560px) {
  .cab-mini-stats { padding: 12px 14px; gap: 0; }
  .cab-ms-num { font-size: 18px; }
  .loyalty-hero { padding: 24px 20px; }
  .loy-pts { font-size: 44px; }
  .cab-profile-row { flex-wrap: wrap; }
  .cab-profile-actions { flex-direction: row; margin-left: 0; width: 100%; }
  .logout-btn { margin-top: 0; }
}

/* ═══════════════════════════════════════════
   SERVICES — full cards
═══════════════════════════════════════════ */
.svc-full-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 1024px) {
  .svc-full-grid {
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
  }
}
.svc-full-card { padding: 28px; }
.sfc-head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.sfc-ico {
  width: 52px; height: 52px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-md,10px);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; flex-shrink: 0;
}
.sfc-meta { flex: 1; min-width: 180px; }
.sfc-title {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  margin-bottom: 5px;
}
.sfc-desc { font-size: 13px; color: var(--text2); line-height: 1.6; }
.sfc-badge-wrap {
  display: flex; flex-direction: column; gap: 6px;
  align-items: flex-end; flex-shrink: 0;
}
.sfc-time-badge, .sfc-price-badge {
  font-size: 11px; font-weight: 700;
  padding: 4px 12px; border-radius: 99px;
  white-space: nowrap;
}
.sfc-time-badge  { background: rgba(96,165,250,.12); color: #60a5fa; border: 1px solid rgba(96,165,250,.2); }
.sfc-price-badge { background: var(--orange-dim); color: var(--orange); border: 1px solid var(--orange-brd); }

.sfc-why {
  font-size: 13px; color: var(--text3);
  font-style: italic;
  padding: 10px 14px;
  background: var(--surface2);
  border-left: 3px solid var(--orange-brd);
  border-radius: 0 var(--ui-radius-sm,5px) var(--ui-radius-sm,5px) 0;
  margin-bottom: 20px;
  line-height: 1.6;
}
.sfc-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 22px;
}
.sfc-col-title {
  font-size: 11px; font-weight: 700;
  color: var(--text3); letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.sfc-steps {
  display: flex; flex-direction: column; gap: 8px;
  list-style: none; padding: 0;
}
.sfc-steps li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--text2);
}
.sfc-step-n {
  width: 22px; height: 22px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: 50%;
  font-family: 'Oswald', sans-serif;
  font-size: 11px; font-weight: 700; color: var(--orange);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.sfc-checklist {
  display: flex; flex-direction: column; gap: 8px;
  list-style: none; padding: 0;
}
.sfc-checklist li {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text2);
}
.sfc-check {
  color: var(--green); font-weight: 700; flex-shrink: 0;
}
.sfc-actions {
  display: flex; gap: 10px; flex-wrap: wrap;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
@media(max-width:560px){
  .sfc-body { grid-template-columns: 1fr; gap: 16px; }
  .sfc-badge-wrap { flex-direction: row; align-items: center; }
  .svc-full-card { padding: 20px 16px; }
}

/* ═══════════════════════════════════════════
   FAQ
═══════════════════════════════════════════ */
.faq-list {
  display: flex; flex-direction: column; gap: 8px;
  max-width: 760px;
}
.faq-item {
  padding: 0; cursor: pointer;
  overflow: hidden;
  transition: border-color .2s var(--ease);
}
.faq-item:hover { border-color: var(--orange-brd); }
.faq-q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
  padding: 16px 20px;
  font-weight: 700; font-size: 14px;
  user-select: none;
}
.faq-arr {
  color: var(--orange); font-size: 16px;
  transition: transform .25s var(--ease);
  flex-shrink: 0;
}
.faq-item.open .faq-arr { transform: rotate(180deg); }
.faq-a {
  max-height: 0; overflow: hidden;
  font-size: 13px; color: var(--text2); line-height: 1.7;
  padding: 0 20px;
  transition: max-height .35s var(--ease), padding .35s var(--ease);
}
.faq-item.open .faq-a {
  max-height: 200px;
  padding: 0 20px 16px;
}

/* ═══════════════════════════════════════════
   PARTS
═══════════════════════════════════════════ */
.parts-filter-row {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 24px;
}
.parts-cat {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 16px; border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 13px; font-weight: 600; color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: .2s var(--ease);
}
.parts-cat:hover { border-color: var(--orange-brd); color: var(--text); }
.parts-cat.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}
.parts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 28px;
}
.part-card {
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 8px;
  transition: .2s var(--ease);
}
.part-card:hover { border-color: var(--orange-brd); transform: translateY(-2px); }
.part-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px;
}
.part-sku {
  font-size: 10px; font-weight: 700; color: var(--text3);
  letter-spacing: 1.5px; text-transform: uppercase;
}
.part-stock {
  font-size: 10px; font-weight: 700; letter-spacing: .5px;
  padding: 3px 9px; border-radius: 99px; white-space: nowrap;
}
.part-stock.in  { background: rgba(34,197,94,.1);  color: var(--green); }
.part-stock.out { background: rgba(245,158,11,.1);  color: #f59e0b; }
.part-name {
  font-weight: 700; font-size: 14px; line-height: 1.3;
}
.part-note { font-size: 11px; color: var(--text3); }
.part-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line);
  gap: 8px;
}
.part-price {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 700; color: var(--orange);
}
.part-ask {
  font-size: 11px; font-weight: 700; color: var(--orange);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  padding: 5px 12px; border-radius: var(--ui-radius-sm,5px);
  cursor: pointer; transition: .2s; white-space: nowrap;
}
.part-ask:hover { background: rgba(255,107,0,.2); }
.parts-request-banner {
  padding: 20px 24px;
  display: flex; align-items: center; gap: 18px;
  flex-wrap: wrap;
}
@media(max-width:560px){
  .parts-request-banner { flex-direction: column; text-align: center; }
}

/* ═══════════════════════════════════════════
   ABOUT
═══════════════════════════════════════════ */
.about-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.about-facts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.about-fact {
  padding: 18px 16px;
  text-align: center;
}
.about-fact-num {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  color: var(--orange); line-height: 1.1;
}
.about-fact-lbl {
  font-size: 11px; color: var(--text3);
  margin-top: 4px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .5px;
}
.vals-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.val-card { padding: 24px; }
.val-ico  { font-size: 28px; margin-bottom: 12px; }
.val-t    { font-family:'Oswald',sans-serif; font-size:16px; font-weight:700; text-transform:uppercase; margin-bottom:8px; }
.val-d    { font-size:13px; color:var(--text2); line-height:1.65; }
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
}
.team-card {
  padding: 28px 20px;
  text-align: center;
  transition: .3s var(--ease);
}
.team-card:hover { transform: translateY(-4px); border-color: var(--orange-brd); }
.team-av {
  width: 68px; height: 68px;
  border-radius: 50%;
  border: 2px solid;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700;
  margin: 0 auto 14px;
}
.team-name { font-weight: 700; font-size: 15px; margin-bottom: 5px; }
.team-role { font-size: 12px; color: var(--text2); margin-bottom: 8px; line-height: 1.5; }
.team-exp  { font-size: 12px; color: var(--text3); }

@media(max-width:860px) {
  .about-intro-grid { grid-template-columns: 1fr; gap: 28px; }
  .vals-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:560px) {
  .vals-grid { grid-template-columns: 1fr; }
  .about-facts-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════
   CONTACTS — real map
═══════════════════════════════════════════ */
.ct-open-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; margin-top: 16px;
}
.ct-open-dot {
  width: 8px; height: 8px; border-radius: 50%;
  display: inline-block;
  animation: blink 2s infinite;
}
.ct-cta-row {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-top: 24px;
}
.map-frame-wrap {
  width: 100%; height: 340px;
  border-radius: var(--ui-radius-md,10px);
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}
.map-links {
  display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap;
}
.map-link-btn {
  flex: 1;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  font-size: 12px; font-weight: 600; color: var(--text2);
  cursor: pointer; text-decoration: none;
  transition: .2s var(--ease);
}
.map-link-btn:hover { border-color: var(--orange-brd); color: var(--orange); }

@media(max-width:860px) {
  .ct-grid { grid-template-columns: 1fr; }
  .map-frame-wrap { height: 260px; }
}

/* ═══════════════════════════════════════════
   SKELETON LOADING — page transitions
═══════════════════════════════════════════ */
@keyframes shimmer {
  0%   { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}
.skeleton {
  background: linear-gradient(90deg, var(--surface) 25%, var(--surface2) 50%, var(--surface) 75%);
  background-size: 1200px 100%;
  animation: shimmer 1.6s infinite linear;
  border-radius: var(--ui-radius-sm,5px);
}
.sk-line  { height: 14px; margin-bottom: 10px; }
.sk-line.short { width: 40%; }
.sk-line.med   { width: 65%; }
.sk-title { height: 28px; width: 55%; margin-bottom: 16px; }
.sk-card  { height: 110px; border-radius: var(--ui-radius-md,10px); margin-bottom: 14px; }
.sk-hero  { height: 60px; width: 40%; margin-bottom: 14px; border-radius: var(--ui-radius-sm,5px); }

/* Page skeleton wrapper (shown before page content) */
.page-skeleton {
  padding: 56px 0 28px;
}
.page-skeleton .container {
  display: flex; flex-direction: column; gap: 0;
}

/* Page exit / enter transitions */
.page { animation: pageSlideIn .28s var(--ease) both; }
@keyframes pageSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════
   ONBOARDING overlay
═══════════════════════════════════════════ */
#onboarding-overlay {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,.75);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; transition: opacity .35s var(--ease);
}
#onboarding-overlay.open { opacity: 1; }

.onb-box {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  padding: 36px 32px;
  max-width: 440px; width: 100%;
  text-align: center;
  transform: translateY(24px) scale(.97);
  transition: transform .35s var(--ease);
}
#onboarding-overlay.open .onb-box { transform: translateY(0) scale(1); }

.onb-logo {
  font-size: 52px; margin-bottom: 14px;
  animation: bounceIn .5s .2s var(--ease) both;
}
@keyframes bounceIn {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.15); }
  100% { transform: scale(1); opacity: 1; }
}
.onb-hi {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  margin-bottom: 8px; line-height: 1.3;
}
.onb-hi span { color: var(--orange); }
.onb-sub {
  font-size: 13px; color: var(--text2);
  margin-bottom: 24px; line-height: 1.6;
}
.onb-features {
  display: flex; flex-direction: column; gap: 12px;
  text-align: left; margin-bottom: 28px;
}
.onb-feat {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  transition: .2s;
}
.onb-feat:hover { border-color: var(--orange-brd); }
.onb-feat-ico {
  font-size: 22px; flex-shrink: 0;
  width: 40px; height: 40px;
  background: var(--orange-dim);
  border-radius: var(--ui-radius-md,10px);
  display: flex; align-items: center; justify-content: center;
}
.onb-feat-t { font-weight: 700; font-size: 13px; }
.onb-feat-s { font-size: 11px; color: var(--text3); margin-top: 2px; }
.onb-btn { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════
   PRICING — book from row
═══════════════════════════════════════════ */
.ptbl th:last-child,
.ptbl td:last-child { width: 100px; text-align: right; }

.ptbl-price {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 600;
  color: var(--orange); white-space: nowrap;
}
.ptbl-book-btn {
  font-size: 11px; font-weight: 700;
  padding: 5px 12px; border-radius: var(--ui-radius-sm,5px);
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  color: var(--orange);
  cursor: pointer; white-space: nowrap;
  transition: .2s;
  opacity: 0;
  transform: translateX(4px);
}
.ptbl tr:hover .ptbl-book-btn {
  opacity: 1; transform: translateX(0);
}
@media(max-width:600px) {
  .ptbl-book-btn { opacity: 1; transform: none; font-size: 10px; padding: 4px 8px; }
  .ptbl th:last-child { display: none; }
  .ptbl td:last-child { padding-left: 6px; }
}

/* ═══════════════════════════════════════════
   REVIEWS — add-review form
═══════════════════════════════════════════ */
.rv-add-wrap {
  margin-top: 40px;
  max-width: 540px;
  margin-left: auto; margin-right: auto;
}
.rv-add-card {
  padding: 28px;
  text-align: center;
}
.rv-add-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 5px;
}
.rv-add-sub { font-size: 13px; color: var(--text3); margin-bottom: 18px; }

.rv-stars-pick {
  display: flex; justify-content: center; gap: 8px;
  font-size: 32px; cursor: pointer;
  margin-bottom: 14px;
}
.rv-star-btn {
  color: var(--surface2);
  transition: color .15s, transform .15s;
  user-select: none;
}
.rv-star-btn.active,
.rv-star-btn:hover { color: var(--orange); transform: scale(1.1); }

.rv-add-input {
  width: 100%; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--ui-radius-sm,5px);
  padding: 12px 14px; font-size: 14px;
  color: var(--text); outline: none;
  font-family: 'Mulish', sans-serif;
  resize: vertical; min-height: 80px;
  transition: .2s;
}
.rv-add-input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.1); }

.rv-add-toast {
  display: none; padding: 10px 14px;
  background: rgba(34,197,94,.12); border: 1px solid rgba(34,197,94,.25);
  border-radius: var(--ui-radius-sm,5px); color: var(--green); font-size: 13px;
  margin-top: 12px;
}
.rv-add-toast.show { display: block; animation: fadeIn .3s both; }

/* ═══════════════════════════════════════════
   SERVICE ILLUSTRATIONS — SVG icons in service cards
═══════════════════════════════════════════ */
.svc-illus {
  width: 100%; height: 80px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface2);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
  overflow: hidden;
  position: relative;
}
.svc-illus svg { width: 100%; height: 100%; }

/* Push notif permission banner */
.push-banner {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-md,10px);
  margin: 0 0 16px;
  flex-wrap: wrap;
}
.push-banner-text { flex: 1; min-width: 180px; }
.push-banner-t { font-weight: 700; font-size: 13px; }
.push-banner-s { font-size: 11px; color: var(--text2); margin-top: 2px; }

/* ═══════════════════════════════════════════
   PARTS PAGE v2 — полный редизайн
═══════════════════════════════════════════ */

/* Hero */
.parts-hero {
  position: relative;
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 56px 0 48px;
  overflow: hidden;
}
.parts-hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 90% 50%, rgba(255,107,0,.06) 0%, transparent 60%),
    repeating-linear-gradient(
      -45deg,
      transparent 0px,
      transparent 24px,
      rgba(255,107,0,.025) 24px,
      rgba(255,107,0,.025) 25px
    );
  pointer-events: none;
}
.parts-hero-sub {
  font-size: 14px; color: var(--text2);
  max-width: 520px; line-height: 1.75;
  margin-top: 16px; margin-bottom: 24px;
}
.parts-hero-stats {
  display: flex; align-items: center;
  gap: 0; flex-wrap: wrap;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 16px 24px;
  max-width: 580px;
}
.phs-item { flex: 1; min-width: 80px; text-align: center; }
.phs-num  {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; line-height: 1;
}
.phs-lbl  { font-size: 10px; color: var(--text3); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-top: 4px; }
.phs-sep  { width: 1px; height: 36px; background: var(--line); flex-shrink: 0; }

/* Layout: catalog + form */
.parts-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 28px;
  align-items: start;
  padding-top: 28px;
}
@media(max-width:960px) {
  .parts-layout { grid-template-columns: 1fr; }
  .parts-form-col { order: -1; }
}

/* Search bar */
.parts-search-bar { margin-bottom: 14px; }
.parts-search-wrap {
  position: relative;
  display: flex; align-items: center;
}
.parts-search-ico {
  position: absolute; left: 14px;
  font-size: 15px; pointer-events: none;
  color: var(--text3);
}
.parts-search-input {
  width: 100%;
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 12px 44px 12px 42px;
  font-size: 14px; color: var(--text);
  outline: none; font-family: 'Mulish', sans-serif;
  transition: .2s var(--ease);
}
.parts-search-input:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,107,0,.1);
}
.parts-search-clear {
  position: absolute; right: 12px;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1px solid var(--line);
  font-size: 14px; color: var(--text3);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: .15s;
}
.parts-search-clear:hover { background: var(--orange-dim); color: var(--orange); }

/* Category pills */
.parts-filter-row {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 20px;
}
.parts-cat {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 12px; font-weight: 600; color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: .18s var(--ease);
}
.parts-cat:hover { border-color: var(--orange-brd); color: var(--text); }
.parts-cat.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}

/* Parts grid */
.parts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.part-card {
  padding: 16px 18px;
  display: flex; flex-direction: column; gap: 8px;
  transition: .2s var(--ease);
  cursor: default;
}
.part-card:hover {
  border-color: var(--orange-brd);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.part-head {
  display: flex; justify-content: space-between; align-items: center; gap: 6px;
}
.part-sku {
  font-size: 9px; font-weight: 700; color: var(--text3);
  letter-spacing: 1.5px; text-transform: uppercase;
  background: var(--surface2); padding: 2px 7px; border-radius: var(--ui-radius-sm,5px);
}
.part-stock {
  font-size: 10px; font-weight: 700; letter-spacing: .3px;
  display: flex; align-items: center; gap: 4px;
  white-space: nowrap;
}
.part-stock.in  { color: var(--green); }
.part-stock.out { color: #f59e0b; }
.part-stock-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green); flex-shrink: 0;
}
.part-stock-dot.out { background: #f59e0b; animation: blink 2s infinite; }
.part-name {
  font-weight: 700; font-size: 13px; line-height: 1.35;
  flex: 1;
}
.part-note { font-size: 11px; color: var(--text3); }
.part-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: auto; padding-top: 10px;
  border-top: 1px solid var(--line); gap: 6px;
}
.part-price {
  font-family: 'Oswald', sans-serif;
  font-size: 14px; font-weight: 700; color: var(--orange);
  white-space: nowrap;
}
.part-order-btn {
  font-size: 11px; font-weight: 700;
  padding: 5px 11px; border-radius: var(--ui-radius-sm,5px);
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  color: var(--orange);
  cursor: pointer; transition: .18s; white-space: nowrap;
}
.part-order-btn:hover { background: rgba(255,107,0,.22); transform: scale(1.03); }

/* Empty state */
.parts-empty {
  flex-direction: column; align-items: center;
  padding: 48px 20px; text-align: center;
  font-size: 14px; font-weight: 600;
  color: var(--text2);
}

/* ── ORDER FORM ── */
.parts-order-form {
  padding: 0;
  overflow: hidden;
  transition: box-shadow .3s var(--ease);
  position: static; top: 80px;
}
.parts-order-form.pof-highlight {
  box-shadow: 0 0 0 3px var(--orange), 0 12px 40px rgba(255,107,0,.15);
}

.pof-header {
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, var(--orange-dim), transparent);
}
.pof-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; margin-bottom: 4px;
}
.pof-sub { font-size: 12px; color: var(--text2); line-height: 1.5; }

/* Selected part pill */
.pof-selected {
  margin: 16px 24px 0;
  padding: 12px 14px;
  background: rgba(255,107,0,.07);
  border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-md,10px);
  position: relative;
}
.pof-sel-label { font-size: 10px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.pof-sel-name  { font-weight: 700; font-size: 14px; margin-bottom: 5px; }
.pof-sel-row   { display: flex; gap: 10px; align-items: center; }
.pof-sel-sku   { font-size: 10px; color: var(--text3); background: var(--surface2); padding: 2px 7px; border-radius: var(--ui-radius-sm,5px); }
.pof-sel-price { font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 700; color: var(--orange); }
.pof-sel-clear {
  position: absolute; top: 10px; right: 12px;
  font-size: 12px; color: var(--text3); background: none; border: none;
  cursor: pointer; padding: 2px 6px; border-radius: var(--ui-radius-sm,5px);
  transition: .15s;
}
.pof-sel-clear:hover { color: var(--red); background: rgba(239,68,68,.1); }

/* Form fields */
.pof-fields { padding: 16px 24px 0; display: flex; flex-direction: column; gap: 13px; }
.pof-group  { display: flex; flex-direction: column; gap: 5px; }
.pof-label  { font-size: 11px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: .8px; }
.pof-label .req { color: var(--orange); }
.pof-input  {
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 10px 13px;
  font-size: 13px; color: var(--text);
  outline: none; font-family: 'Mulish', sans-serif;
  transition: .18s var(--ease);
}
.pof-input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.1); }
.pof-input[readonly] { opacity: .6; cursor: not-allowed; }
.pof-textarea { resize: vertical; min-height: 70px; }

.pof-submit {
  margin: 18px 24px 0;
  width: calc(100% - 48px);
  justify-content: center;
  font-size: 14px; padding: 13px;
  border-radius: var(--ui-radius-md,10px);
}
.pof-hint {
  text-align: center;
  font-size: 11px; color: var(--text3);
  padding: 10px 24px 20px;
  line-height: 1.6;
}

/* Submit toast */
.pof-toast {
  display: none;
  margin: 0 24px 20px;
  padding: 14px 16px;
  background: rgba(34,197,94,.1);
  border: 1px solid rgba(34,197,94,.25);
  border-radius: var(--ui-radius-md,10px);
}
.pof-toast.show { display: block; animation: fadeIn .35s both; }
.pof-toast-inner {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 13px; color: var(--green);
}

/* Why card */
.parts-why-card {
  padding: 20px 22px;
  margin-top: 14px;
}
.pwy-title {
  font-family: 'Oswald', sans-serif;
  font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--text3);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.pwy-row {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}
.pwy-row:last-child { border-bottom: none; }
.pwy-ico {
  width: 34px; height: 34px; border-radius: var(--ui-radius-sm,5px);
  background: var(--orange-dim);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}
.pwy-t { font-weight: 700; font-size: 13px; }
.pwy-s { font-size: 11px; color: var(--text3); margin-top: 1px; }

@media(max-width:560px) {
  .parts-hero-stats { padding: 12px 16px; }
  .phs-num { font-size: 20px; }
  .parts-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:380px) {
  .parts-grid { grid-template-columns: 1fr; }
}

/* ── Service card scroll highlight ─────────────────────── */
.svc-highlight {
  animation: svc-pulse 1.2s ease-out;
}
@keyframes svc-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,107,0,.4), var(--card-shadow, none); }
  50%  { box-shadow: 0 0 0 8px rgba(255,107,0,.15), var(--card-shadow, none); }
  100% { box-shadow: 0 0 0 0 rgba(255,107,0,0), var(--card-shadow, none); }
}

/* ── hv-card clickable ──────────────────────────────────── */
.hv-card { cursor: pointer; }

.vehicle-editor-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 14px}
.vehicle-editor-steps .step{border:1px solid var(--surface-b);background:var(--surface-a);border-radius:var(--ui-radius-md,10px);padding:12px 14px;display:grid;gap:4px;transition:.2s ease}
.vehicle-editor-steps .step span{width:26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--surface-b);color:var(--text2);font-weight:800;font-size:12px}
.vehicle-editor-steps .step b{font-size:14px}
.vehicle-editor-steps .step small{font-size:12px;color:var(--text3)}
.vehicle-editor-steps .step.active{border-color:rgba(245,158,11,.34);box-shadow:0 16px 36px rgba(0,0,0,.22), inset 0 0 0 1px rgba(245,158,11,.12);background:linear-gradient(180deg,rgba(245,158,11,.10),var(--surface-a))}
.vehicle-editor-steps .step.active span{background:rgba(245,158,11,.18);color:#ffd18a}
.profile-hint{font-size:13px;line-height:1.5;color:var(--text2);padding:12px 14px;border-radius:var(--ui-radius-md,10px);border:1px solid var(--surface-b);background:var(--surface-a)}

/* ═══════════════════════════════════════════════════════════════════
   NEWS PORTAL STYLES
═══════════════════════════════════════════════════════════════════ */
.news-page { padding-bottom: 60px; }

/* Hero section */
.news-hero-section { background: var(--bg2); border-bottom: 1px solid var(--line); padding: 56px 0 40px; }
.news-hero-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 32px; }
.news-hero-title { font-family: 'Oswald', sans-serif; font-size: clamp(32px,5vw,54px); font-weight: 700; line-height: 1.1; margin: 8px 0 10px; }
.news-hero-sub { font-size: 14px; color: var(--text2); max-width: 440px; line-height: 1.7; }
.news-stat-pills { display: flex; gap: 12px; flex-shrink: 0; }
.nsp { background: var(--surface); border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px); padding: 10px 16px; text-align: center; }
.nsp span { display: block; font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; color: var(--orange); }
.nsp { font-size: 11px; color: var(--text3); margin-top: 2px; }

/* Hero cards grid */
.news-hero-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; }

/* Category bar */
.news-main { padding: 32px 0 0; }
.news-cat-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.news-cat-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 99px; border: 1.5px solid color-mix(in srgb, var(--chip-c) 40%, transparent); background: color-mix(in srgb, var(--chip-c) 8%, transparent); color: var(--text2); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s; white-space: nowrap; }
.news-cat-chip:hover { background: color-mix(in srgb, var(--chip-c) 16%, transparent); color: var(--chip-c); }
.news-cat-chip.active { background: var(--chip-c); color: #fff; border-color: var(--chip-c); }
.ncc-count { font-size: 11px; opacity: .75; margin-left: 2px; }

/* News grid */
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; padding-bottom: 40px; }

/* Card base */
.news-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px); overflow: hidden; cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s; }
.news-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,.18); border-color: var(--orange); }

/* Cover */
.nc-cover { height: 200px; background-size: cover; background-position: center; background-color: var(--bg2); position: relative; }
.nc-cover--sm { height: 160px; }
.nc-cover-placeholder { height: 80px; display: flex; align-items: center; justify-content: center; font-size: 32px; background: color-mix(in srgb, var(--orange) 8%, transparent); }
.nc-cover-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.65) 0%, transparent 55%); }
.nc-featured-badge { position: absolute; top: 12px; right: 12px; background: #f59e0b; color: #fff; font-size: 10px; font-weight: 700; padding: 4px 9px; border-radius: 99px; }
.nc-cover-meta { position: absolute; bottom: 12px; left: 14px; }

/* Hero card specifics */
.news-card--hero .nc-cover { height: 260px; }
.news-card--hero .nc-title--hero { font-size: 20px; }

/* Category badge */
.nc-cat-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 99px; border: 1px solid; }
.nc-cat-badge--lg { font-size: 13px; padding: 6px 14px; }

/* Card body */
.nc-body { padding: 16px var(--ui-radius-lg,18px) var(--ui-radius-lg,18px); }
.nc-meta-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.nc-date, .nc-read-time, .nc-views { font-size: 11px; color: var(--text3); }
.nc-title { font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 700; line-height: 1.3; margin-bottom: 8px; }
.nc-intro { font-size: 13px; color: var(--text2); line-height: 1.6; }
.nc-intro--sm { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nc-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.nc-read-link { font-size: 12px; font-weight: 700; color: var(--orange); }
.nc-author-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.nc-author-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--orange)22; color: var(--orange); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; flex-shrink: 0; }
.nc-author-name { font-size: 12px; color: var(--text2); font-weight: 600; }

/* ── News Article MODAL ───────────────────────────────────────── */
.news-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.7); z-index: 8000; display: flex; align-items: flex-start; justify-content: center; padding: 20px 12px 40px; overflow-y: auto; opacity: 0; pointer-events: none; transition: opacity .25s; }
.news-modal-overlay.open { opacity: 1; pointer-events: all; }
.news-modal-box { background: var(--bg); border-radius: var(--ui-radius-lg,18px); width: 100%; max-width: 780px; overflow: hidden; position: relative; margin: auto; box-shadow: 0 24px 80px rgba(0,0,0,.45); transform: translateY(20px); transition: transform .25s; }
.news-modal-overlay.open .news-modal-box { transform: translateY(0); }
.news-modal-close { position: absolute; top: 14px; right: 14px; z-index: 10; width: 36px; height: 36px; border-radius: 50%; background: rgba(0,0,0,.45); border: none; color: #fff; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.news-modal-close:hover { background: rgba(0,0,0,.7); }
.news-modal-cover { height: 280px; background-size: cover; background-position: center; position: relative; }
.news-modal-cover-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.15) 60%); }
.news-modal-cover-inner { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px 28px; }
.news-modal-title { font-family: 'Oswald', sans-serif; font-size: clamp(20px,3vw,32px); font-weight: 700; color: #fff; line-height: 1.2; margin-top: 10px; }
.news-modal-title-nocov { font-family: 'Oswald', sans-serif; font-size: clamp(22px,3.5vw,36px); font-weight: 700; line-height: 1.2; margin-bottom: 6px; }
.news-modal-body { padding: 24px 28px 32px; }
.news-modal-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text3); margin-bottom: 16px; }
.news-modal-author { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--surface); border-radius: var(--ui-radius-md,10px); border: 1px solid var(--line); margin-bottom: 20px; }
.news-modal-av { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; flex-shrink: 0; }
.news-modal-av-name { font-weight: 700; font-size: 14px; }
.news-modal-av-role { font-size: 12px; color: var(--text3); margin-top: 2px; }
.news-modal-intro { font-size: 15px; font-weight: 600; color: var(--text2); line-height: 1.7; margin-bottom: 20px; padding-left: 14px; border-left: 3px solid var(--orange); }
.news-modal-content { font-size: 15px; line-height: 1.85; color: var(--text); }
.news-modal-content h3 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 700; margin: 22px 0 10px; color: var(--text); }
.news-modal-content p { margin: 0 0 14px; }
.news-modal-content ul, .news-modal-content ol { padding-left: 20px; margin: 0 0 14px; }
.news-modal-content li { margin-bottom: 6px; }
.news-modal-content strong { font-weight: 700; }
.news-modal-content em { font-style: italic; color: var(--text2); }
.news-modal-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); }

@media (max-width: 640px) {
  .news-hero-grid { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .news-modal-cover { height: 200px; }
  .news-modal-body { padding: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 24px; }
  .news-hero-top { flex-direction: column; align-items: flex-start; }
  .news-stat-pills { gap: 8px; }
}


.news-section-group { margin-bottom: 28px; }
.news-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin: 6px 0 18px; }
.news-section-kicker { color: var(--orange); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; }
.news-section-title { font-family: 'Oswald', sans-serif; font-size: clamp(24px, 3.2vw, 34px); line-height: 1.1; margin: 0 0 8px; }
.news-section-sub { margin: 0; color: var(--text2); max-width: 820px; line-height: 1.7; }
.news-categories-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; padding-bottom: 8px; }
.news-category-card { width: 100%; text-align: left; border: 1px solid color-mix(in srgb, var(--cat-c) 24%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--cat-c) 10%, var(--surface)) 0%, var(--surface) 100%); border-radius: var(--ui-radius-lg,18px); padding: 22px; cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s; color: inherit; box-shadow: 0 8px 28px rgba(0,0,0,.10); }
.news-category-card:hover { transform: translateY(-4px); border-color: var(--cat-c); box-shadow: 0 16px 36px rgba(0,0,0,.16); }
.news-category-card__top { display:grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items:center; margin-bottom: 14px; }
.news-category-card__icon { width: 60px; height: 60px; border-radius: var(--ui-radius-lg,18px); display:flex; align-items:center; justify-content:center; font-size: 28px; background: color-mix(in srgb, var(--cat-c) 16%, transparent); }
.news-category-card__label { font-size: 12px; color: var(--text3); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.news-category-card__title { font-family: 'Oswald', sans-serif; font-size: 28px; line-height: 1; }
.news-category-card__count { min-width: 58px; height: 58px; border-radius: var(--ui-radius-lg,18px); display:flex; align-items:center; justify-content:center; background: var(--cat-c); color: #fff; font-size: 22px; font-weight: 800; }
.news-category-card__desc { color: var(--text2); line-height: 1.75; min-height: 56px; margin-bottom: 14px; }
.news-category-card__stats { display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 16px; }
.news-category-card__stats span { display:inline-flex; align-items:center; gap:6px; padding: 8px 12px; border-radius: 999px; background: var(--surface-b); border: 1px solid var(--line); font-size: 12px; color: var(--text2); }
.news-category-card__cta { margin-top: 14px; color: var(--cat-c); font-weight: 700; }
.news-category-focus { display:grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: stretch; border: 1px solid color-mix(in srgb, var(--cat-c) 26%, var(--line)); background: linear-gradient(135deg, color-mix(in srgb, var(--cat-c) 12%, var(--surface)) 0%, var(--surface) 72%); border-radius: var(--ui-radius-lg,18px); padding: 22px; margin-bottom: 24px; }
.news-back-btn { margin-bottom: 16px; }
.news-category-focus__badge { display:inline-flex; align-items:center; gap:8px; padding: 8px 12px; border-radius: 999px; background: color-mix(in srgb, var(--cat-c) 16%, transparent); border: 1px solid color-mix(in srgb, var(--cat-c) 28%, transparent); color: var(--cat-c); font-weight: 700; margin-bottom: 12px; }
.news-category-focus__title { font-family: 'Oswald', sans-serif; font-size: clamp(30px, 4vw, 44px); line-height: 1; margin: 0 0 10px; }
.news-category-focus__sub { margin: 0; color: var(--text2); max-width: 760px; line-height: 1.8; }
.news-category-focus__stats { display:grid; grid-template-columns: repeat(3, minmax(110px,1fr)); gap: 12px; }
.news-category-focus__stat { min-width: 118px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; border-radius: var(--ui-radius-lg,18px); background: var(--surface-b); border: 1px solid var(--line); padding: 16px 18px; }
.news-category-focus__stat strong { font-size: 28px; line-height: 1; margin-bottom: 6px; }
.news-category-focus__stat span { color: var(--text3); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.news-list-head { display:flex; align-items:center; justify-content:space-between; gap: 12px; margin: 0 0 16px; }
.news-list-head__title { font-family: 'Oswald', sans-serif; font-size: 26px; }
.news-list-head__count { min-width: 44px; height: 44px; border-radius: var(--ui-radius-md,10px); display:flex; align-items:center; justify-content:center; background: var(--surface2); border: 1px solid var(--line); font-weight: 800; }
.news-page--article .spa-content { padding-top: 18px; }
.news-article-shell { display: grid; gap: 22px; }
.news-article-topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.news-article-topbar-nav { display:flex; gap:10px; flex-wrap:wrap; }
.news-article-page { overflow:hidden; border-radius: var(--ui-radius-lg,18px); border:1px solid var(--line); }
.news-article-hero { min-height: 360px; background-size: cover; background-position: center; position: relative; }
.news-article-hero__overlay { position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.16) 0%, rgba(0,0,0,.72) 100%); }
.news-article-hero__inner { position:absolute; left:0; right:0; bottom:0; padding: 30px 32px; z-index:1; }
.news-article-page__head { padding: 30px 32px 0; }
.news-article-page__title { font-family:'Oswald',sans-serif; font-size: clamp(28px, 4vw, 46px); line-height: 1.05; color:#fff; margin: 14px 0 0; }
.news-article-page__title--nohero { color: var(--text); margin-top: 14px; }
.news-article-page__body { padding: 28px 32px 34px; }
.news-article-page__meta { display:flex; flex-wrap:wrap; gap:10px 16px; color:var(--text3); font-size:12px; margin-bottom:18px; }
.news-article-page__author { display:flex; align-items:center; gap:12px; padding: 12px 16px; background:var(--surface); border:1px solid var(--line); border-radius: var(--ui-radius-md,10px); margin-bottom: 20px; }
.news-article-page__intro { font-size: 17px; line-height: 1.8; color: var(--text2); font-weight: 600; border-left: 4px solid var(--orange); padding-left: 16px; margin-bottom: 22px; }
.news-article-page__content { font-size:16px; line-height:1.9; }
.news-article-page__content img { max-width:100%; height:auto; border-radius:var(--ui-radius-lg,18px); margin: 18px 0; }
.news-article-more__head { margin-bottom: 16px; }
@media (max-width: 980px){
  .news-categories-grid { grid-template-columns: 1fr; }
  .news-category-focus { grid-template-columns: 1fr; }
  .news-category-focus__stats { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .news-article-hero { min-height: 280px; }
  .news-article-hero__inner, .news-article-page__body, .news-article-page__head { padding-left: 20px; padding-right: 20px; }
}
@media (max-width: 640px){
  .news-category-card { padding: 18px; border-radius: var(--ui-radius-lg,18px); }
  .news-category-card__top { grid-template-columns: auto 1fr; }
  .news-category-card__count { grid-column: 1 / -1; width: 100%; height: 44px; border-radius: var(--ui-radius-md,10px); justify-content: flex-start; padding: 0 14px; }
  .news-category-card__title { font-size: 24px; }
  .news-category-focus { padding: 18px; border-radius: var(--ui-radius-lg,18px); }
  .news-category-focus__stats { grid-template-columns: 1fr; }
  .news-list-head { align-items:flex-start; flex-direction: column; }
  .news-article-topbar, .news-article-topbar-nav { width:100%; }
  .news-article-topbar-nav .btn { flex:1; justify-content:center; }
  .news-article-page { border-radius: var(--ui-radius-lg,18px); }
  .news-article-hero { min-height: 220px; }
  .news-article-page__title { font-size: clamp(24px, 8vw, 34px); }
  .news-article-page__intro, .news-article-page__content { font-size: 15px; }
}


.svc-cat-nav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;width:100%}
.svc-cat-nav-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;width:100%;text-align:left;padding:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px);border-radius:var(--ui-radius-lg,18px);border:1px solid color-mix(in srgb, var(--fc) 26%, var(--line));background:linear-gradient(180deg,color-mix(in srgb, var(--fc) 10%, var(--surface)) 0%,var(--surface) 100%);color:inherit;cursor:pointer;transition:.2s var(--ease);box-shadow:0 10px 28px rgba(0,0,0,.10)}
.svc-cat-nav-card:hover:not(:disabled),.svc-cat-nav-card.active{transform:translateY(-2px);border-color:var(--fc);box-shadow:0 16px 34px rgba(0,0,0,.16)}
.svc-cat-nav-card:disabled{opacity:.52;cursor:not-allowed;filter:saturate(.7)}
.svc-cat-nav-card__emoji{font-size:28px;line-height:1;width:52px;height:52px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:color-mix(in srgb, var(--fc) 16%, transparent);border:1px solid color-mix(in srgb, var(--fc) 24%, transparent)}
.svc-cat-nav-card__title{font-family:'Oswald',sans-serif;font-size:22px;line-height:1.05;margin-bottom:6px}
.svc-cat-nav-card__desc{font-size:12px;line-height:1.55;color:var(--text2)}
.svc-cat-nav-card__count{min-width:46px;height:46px;padding:0 10px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:var(--fc);color:#fff;font-size:18px;font-weight:800}
.svc-cat-nav-card--price .svc-cat-nav-card__count{font-size:22px}
@media (max-width:900px){.svc-cat-nav-grid{grid-template-columns:1fr}}
@media (max-width:560px){.svc-cat-nav-card{grid-template-columns:auto 1fr;}.svc-cat-nav-card__count{grid-column:1/-1;width:100%;justify-content:flex-start;padding-left:14px}}


.parts-filter-sticky{position:static;top:78px;z-index:28;background:rgba(10,14,22,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);box-shadow:0 10px 24px rgba(0,0,0,.12)}
.parts-filter-sticky .container{padding-top:12px;padding-bottom:12px}
.pf-row-cats{margin-top:10px}
.svc-active-category{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin:0 0 18px;padding:18px 20px;border-radius:var(--ui-radius-lg,18px);border:1px solid var(--line);background:linear-gradient(135deg,var(--surface2),var(--surface))}
.svc-active-category__badge{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:999px;background:var(--orange-dim);border:1px solid var(--orange-brd);color:var(--orange);font-weight:700}
.svc-active-category__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1;margin-bottom:6px}
.svc-active-category__desc{color:var(--text2);line-height:1.65}
.svc-active-category__count{min-width:118px;padding:12px 16px;border-radius:var(--ui-radius-lg,18px);background:var(--surface-b);border:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.svc-active-category__count strong{font-size:28px;line-height:1;margin-bottom:4px}
.svc-active-category__count span{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em}
.svc-cat-empty-global,.svc-cat-empty-inline{padding:18px 20px;border:1px dashed var(--line);border-radius:var(--ui-radius-lg,18px);color:var(--text2);background:var(--surface-a)}
.svc-cat-empty-global{margin:0 0 18px}
.svc-cat-empty-inline{margin-top:14px}
.svc-cat-nav-card.is-empty{opacity:.92}
@media (max-width:900px){.svc-active-category{grid-template-columns:1fr}.parts-filter-sticky{top:68px}}
@media (max-width:560px){.parts-filter-sticky .container{padding-top:10px;padding-bottom:10px}.svc-active-category__title{font-size:24px}}

.services-level--categories{display:grid;gap:22px}.svc-cat-nav-grid--page{margin-top:8px}.services-level--category-open{display:grid;gap:22px}.svc-active-category--page{align-items:start}.svc-active-category__main{display:grid;gap:12px}.svc-cards-grid--category{margin-top:8px}
.svc-active-category__actions{display:flex;gap:10px;flex-wrap:wrap}
.booking-prefill-note{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 14px;margin-bottom:12px;border-radius:var(--ui-radius-md,10px);border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.1);text-align:left;cursor:pointer;transition:.16s border-color,.16s background,.16s transform}
.booking-prefill-note:hover{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.42);transform:translateY(-1px)}
.booking-prefill-note__emoji{font-size:18px;line-height:1.2;font-weight:800;color:#fff}
.booking-prefill-note__title{font-weight:800;color:#fff}
.booking-prefill-note__desc{font-size:12px;color:var(--text2);margin-top:2px}
.booking-empty-services{padding:14px 16px;border-radius:var(--ui-radius-md,10px);border:1px dashed var(--line);color:var(--text2);background:var(--surface-a)}


@media (min-width: 631px) {
  .services-level__head { display: none !important; }
}


.about-level-cards{margin-top:28px}
.about-level-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.about-level-card{width:100%;text-align:left;border:1px solid var(--line);background:linear-gradient(180deg,var(--surface),var(--bg2));border-radius:var(--ui-radius-lg,18px);padding:22px;cursor:pointer;transition:.18s transform,.18s border-color,.18s box-shadow;color:inherit}
.about-level-card:hover{transform:translateY(-4px);border-color:var(--orange-brd);box-shadow:0 16px 34px rgba(0,0,0,.16)}
.about-level-card__icon{font-size:34px;margin-bottom:14px}
.about-level-card__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1.05;margin-bottom:10px}
.about-level-card__desc{color:var(--text2);line-height:1.75;min-height:54px}
.about-level-card__cta{margin-top:16px;color:var(--orange);font-weight:700}
.about-level-cards__head{margin-bottom:18px}
.about-level-backline{display:flex;justify-content:flex-start;margin-bottom:18px}
@media (max-width: 760px){.about-level-grid{grid-template-columns:1fr}.about-level-card{padding:18px;border-radius:var(--ui-radius-lg,18px)}.about-level-card__title{font-size:18px}}


.about-route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:12px}
.about-route-card{width:100%;text-align:left;background:linear-gradient(180deg,var(--surface),var(--bg2));border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);padding:22px;cursor:pointer;transition:.18s transform,.18s box-shadow,.18s border-color;color:inherit}
.about-route-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,0,0,.18);border-color:var(--orange-brd)}
.about-route-card__icon{font-size:34px;margin-bottom:14px}
.about-route-card__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1.05;margin-bottom:10px}
.about-route-card__desc{font-size:14px;line-height:1.7;color:var(--text2);min-height:48px}
.about-route-card__cta{margin-top:14px;color:var(--orange);font-weight:700;font-size:13px}
.about-level-page{padding-top:6px}
@media (max-width: 760px){.about-route-grid{grid-template-columns:1fr}.about-route-card{padding:18px;border-radius:var(--ui-radius-lg,18px)}.about-route-card__title{font-size:18px}}


.news-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom: 0; }
.news-toolbar__search { position:relative; flex:1 1 auto; min-width:0; display:flex; align-items:center; }
.news-toolbar__search .pf-search-ico { position:absolute; left:14px; z-index:2; }
.news-toolbar__search .pf-search-input { width:100%; padding-left:42px; }
.news-cats-track { display:flex; gap:10px; flex-wrap:wrap; }
@media (max-width: 720px){
  .news-toolbar { flex-direction:column; align-items:stretch; }
  .news-toolbar .pf-info-btn { width:100%; justify-content:center; }
}


.parts-detail-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.parts-breadcrumb { display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--text3); font-size:13px; }
.parts-breadcrumb__link { background:none; border:none; padding:0; color:var(--orange); cursor:pointer; font:inherit; }
.parts-breadcrumb__current { color:var(--text); font-weight:700; }
.parts-breadcrumb__sep { color:var(--text3); }
.parts-share-btn { white-space:nowrap; }
@media (max-width: 640px){
  .parts-detail-tools { align-items:flex-start; flex-direction:column; }
  .parts-share-btn { width:100%; justify-content:center; }
}

.svc-cta-note {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text3);
}


@media (max-width: 631px) {
  .news-category-focus__stats {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
  }
  .news-category-focus__stat {
    border-radius: var(--ui-radius-md,10px);
    padding: 12px 12px;
    min-width: 0;
  }
  .news-category-focus__stat:last-child {
    grid-column: 1 / -1;
  }
  .news-category-focus__stat strong {
    font-size: 22px;
  }
  .news-category-focus__stat span {
    font-size: 10px;
  }
}
.services-toolbar, .parts-toolbar, .about-toolbar { margin-bottom: 18px; }


/* Mobile typography regulation for inner content pages */
@media (max-width: 631px) {
  .spa-page-hero { padding-top: 12px; }
  .spa-hero-title { font-size: clamp(22px, 6.2vw, 28px) !important; line-height: 1.08; }
  .spa-hero-sub { font-size: 13px !important; line-height: 1.6; }
  .spa-hero-label { font-size: 10px !important; }
  .spa-hero-stat-num { font-size: 18px !important; }
  .spa-hero-stat-lbl { font-size: 10px !important; }

  .news-section-title,
  .services-level__title,
  .parts-category-focus__title,
  .news-category-focus__title,
  .about-level-title,
  .svc-active-category__title {
    font-size: clamp(20px, 5.8vw, 24px) !important;
    line-height: 1.12 !important;
  }

  .news-section-sub,
  .parts-category-focus__sub,
  .news-category-focus__sub,
  .about-level-sub,
  .svc-active-category__sub,
  .services-level__sub {
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .news-category-card,
  .svc-cat-nav-card,
  .part-card-v2,
  .news-card,
  .about-nav-card,
  .services-level-card,
  .news-article-page,
  .part-details-modal-card {
    border-radius: var(--ui-radius-md,10px) !important;
  }

  .news-category-card__title,
  .svc-cat-nav-card__title,
  .about-nav-card__title,
  .services-level-card__title,
  .part-card-v2-name,
  .nc-title,
  .svc-card-title {
    font-size: 15px !important;
    line-height: 1.28 !important;
  }

  .news-category-card__desc,
  .svc-cat-nav-card__desc,
  .about-nav-card__desc,
  .services-level-card__desc,
  .part-note-v2,
  .nc-intro,
  .svc-card-sub,
  .part-details-text,
  .news-article-page__content,
  .news-article-page__intro {
    font-size: 12px !important;
    line-height: 1.58 !important;
  }

  .part-price-v2,
  .part-details-price,
  .svc-card-price,
  .news-list-head__title {
    font-size: 20px !important;
    line-height: 1.05 !important;
  }

  .part-sku-v2,
  .part-shop-v2,
  .nc-date, .nc-read-time, .nc-views,
  .news-article-page__meta,
  .svc-card-meta,
  .about-mini-meta,
  .news-category-card__label,
  .part-details-meta-card span,
  .news-list-head__count {
    font-size: 10px !important;
  }

  .part-details-meta-card strong,
  .news-modal-av-name,
  .news-article-page__author,
  .svc-card-meta strong,
  .about-team-card__name {
    font-size: 13px !important;
  }

  .btn,
  .part-details-actions .btn,
  .news-article-topbar .btn,
  .news-article-topbar-nav .btn,
  .svc-card-actions .btn,
  .part-card-v2-actions .btn {
    font-size: 12px !important;
    padding: 10px 12px !important;
    min-height: 40px;
  }

  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head,
  .services-level__head {
    padding: 14px !important;
    gap: 10px !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }

  .news-category-focus__stat,
  .parts-category-focus__stat,
  .svc-active-category__stat,
  .about-level-stat,
  .services-level__stat {
    padding: 10px 12px !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }

  .news-category-focus__stat strong,
  .parts-category-focus__stat strong,
  .svc-active-category__stat strong,
  .about-level-stat strong,
  .services-level__stat strong {
    font-size: 18px !important;
  }

  .news-category-focus__stat span,
  .parts-category-focus__stat span,
  .svc-active-category__stat span,
  .about-level-stat span,
  .services-level__stat span {
    font-size: 10px !important;
  }

  .news-article-page__body,
  .part-details-main,
  .about-page-section,
  .services-level__body {
    gap: 12px !important;
  }
}

@media (max-width: 420px) {
  .spa-hero-title { font-size: 20px !important; }
  .news-section-title,
  .services-level__title,
  .parts-category-focus__title,
  .news-category-focus__title,
  .about-level-title,
  .svc-active-category__title { font-size: 18px !important; }

  .news-category-card__title,
  .svc-cat-nav-card__title,
  .about-nav-card__title,
  .services-level-card__title,
  .part-card-v2-name,
  .nc-title,
  .svc-card-title { font-size: 14px !important; }

  .part-price-v2,
  .part-details-price,
  .svc-card-price { font-size: 18px !important; }

  .btn,
  .part-details-actions .btn,
  .news-article-topbar .btn,
  .news-article-topbar-nav .btn,
  .svc-card-actions .btn,
  .part-card-v2-actions .btn {
    font-size: 11px !important;
    padding: 9px 10px !important;
    min-height: 38px;
  }

  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head,
  .services-level__head { padding: 12px !important; }
}


/* unified responsive UI/typography reglament for news/services/parts/about */
:root{
  --ui-h1: 28px;
  --ui-h2: 22px;
  --ui-title: 17px;
  --ui-body: 13.5px;
  --ui-meta: 11.5px;
  --ui-price: 22px;
  --ui-btn: 13px;
  --ui-pad: 16px;
  --ui-gap: 16px;
  --ui-radius: var(--ui-radius-card);
}
@media (min-width:1440px){
  :root{
    --ui-h1: 32px;
    --ui-h2: 24px;
    --ui-title: 18px;
    --ui-body: 14px;
    --ui-meta: 12px;
    --ui-price: 24px;
    --ui-btn: 14px;
    --ui-pad: 18px;
    --ui-gap: 18px;
    --ui-radius: var(--ui-radius-card);
  }
}
@media (max-width:1023px){
  :root{
    --ui-h1: 24px;
    --ui-h2: 20px;
    --ui-title: 16px;
    --ui-body: 13px;
    --ui-meta: 11px;
    --ui-price: 20px;
    --ui-btn: 13px;
    --ui-pad: 14px;
    --ui-gap: 14px;
    --ui-radius: var(--ui-radius-card);
  }
}
@media (max-width:767px){
  :root{
    --ui-h1: 20px;
    --ui-h2: 17px;
    --ui-title: 14px;
    --ui-body: 12px;
    --ui-meta: 10px;
    --ui-price: 18px;
    --ui-btn: 12px;
    --ui-pad: 12px;
    --ui-gap: 12px;
    --ui-radius: var(--ui-radius-card);
  }
}
@media (max-width:430px){
  :root{
    --ui-h1: 18px;
    --ui-h2: 16px;
    --ui-title: 13px;
    --ui-body: 11px;
    --ui-meta: 10px;
    --ui-price: 16px;
    --ui-btn: 11.5px;
    --ui-pad: 10px;
    --ui-gap: 10px;
    --ui-radius: var(--ui-radius-card);
  }
}

.news-page .spa-hero-title,
.services-page .spa-hero-title,
.parts-page .spa-hero-title,
.about-page .spa-hero-title,
#about-page-root .spa-hero-title{font-size:var(--ui-h1)!important;line-height:1.1!important;}
.news-section-title,
.news-article-page__title,
.parts-category-focus__title,
.svc-active-category__title,
.about-level-title,
.about-card-title,
.services-level__title,
.services-level__head h2,
.parts-details-price{font-size:var(--ui-h2)!important;line-height:1.15!important;}
.news-category-card__title,
.parts-category-card__title,
.svc-card-title,
.svc-card h3,
.part-card-v2-name,
.about-card h3,
.about-link-card__title,
.news-list-head__title,
.news-article-page__title--nohero{font-size:var(--ui-title)!important;line-height:1.25!important;}
.news-section-sub,
.news-category-card__desc,
.news-category-focus__sub,
.parts-category-focus__sub,
.svc-active-category__desc,
.news-article-page__content,
.news-article-page__intro,
.part-details-text,
.part-note-v2,
.part-desc-v2,
.about-card p,
.about-level-sub,
.services-level__sub,
.svc-card-desc{font-size:var(--ui-body)!important;line-height:1.6!important;}
.news-category-card__label,
.news-category-card__latest-label,
.news-category-card__latest-date,
.news-article-page__meta,
.news-article-page__author .news-modal-av-role,
.parts-category-focus__stat span,
.svc-active-category__count span,
.part-sku-v2,
.part-shop-v2,
.part-details-section-title,
.part-details-rating,
.about-card small,
.about-level-kicker,
.services-level__kicker,
.pf-search-input::placeholder{font-size:var(--ui-meta)!important;}
.part-price-v2,
.part-details-price,
.svc-price,
.svc-card-price,
.news-category-focus__stat strong,
.parts-category-focus__stat strong,
.svc-active-category__count strong{font-size:var(--ui-price)!important;line-height:1.05!important;}
.news-toolbar .pf-search-input,
.news-toolbar .pf-search-clear,
.news-toolbar .pf-info-btn,
.news-toolbar .svc-filter-btn-label,
.parts-inline-tools .pf-search-input,
.parts-inline-tools .pf-search-clear,
.parts-inline-tools .pf-info-btn,
.parts-inline-tools .svc-filter-btn-label,
.svc-inline-tools .pf-search-input,
.svc-inline-tools .pf-search-clear,
.svc-inline-tools .pf-info-btn,
.svc-inline-tools .svc-filter-btn-label,
.about-inline-tools .pf-search-input,
.about-inline-tools .pf-search-clear,
.about-inline-tools .pf-info-btn,
.about-inline-tools .svc-filter-btn-label,
.btn,
.part-details-actions .btn,
.part-card-v2-actions .btn,
.news-article-topbar .btn{font-size:var(--ui-btn)!important;}

.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools,
.news-category-card,
.parts-category-card,
.part-card-v2,
.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.news-article-page,
.part-details-meta-card,
.about-card,
.about-link-card,
.svc-card{border-radius:var(--ui-radius)!important;}
.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools,
.news-category-card,
.parts-category-card,
.part-card-v2,
.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.news-article-page__body,
.news-article-page__head,
.part-details-meta-card,
.about-card,
.about-link-card,
.svc-card{padding:var(--ui-pad)!important;}
.news-categories-grid,
.parts-categories-grid,
.news-grid,
.svc-cards-grid,
.svc-cards-grid--category,
.about-links-grid,
.about-cards-grid{gap:var(--ui-gap)!important;}

@media (max-width:767px){
  .news-toolbar,
  .parts-inline-tools,
  .svc-inline-tools,
  .about-inline-tools{margin-bottom:12px!important;}
  .news-toolbar .pf-info-btn,
  .parts-inline-tools .pf-info-btn,
  .svc-inline-tools .pf-info-btn,
  .about-inline-tools .pf-info-btn{min-height:40px!important;padding:0 12px!important;}
  .news-toolbar .pf-search-input,
  .parts-inline-tools .pf-search-input,
  .svc-inline-tools .pf-search-input,
  .about-inline-tools .pf-search-input{min-height:40px!important;}
}
@media (max-width:430px){
  .news-page .spa-hero-title,
  .services-page .spa-hero-title,
  .parts-page .spa-hero-title,
  .about-page .spa-hero-title,
  #about-page-root .spa-hero-title{font-size:var(--ui-h1)!important;}
  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head{gap:8px!important;}
  .news-article-page__body,
  .news-article-page__head{padding:var(--ui-pad)!important;}
}


/* unified spacing/card reglament for news/services/parts/about */
:root{
  --ui-toolbar-min-h: 44px;
  --ui-toolbar-gap: 14px;
  --ui-summary-pad: 18px;
  --ui-summary-gap: 16px;
  --ui-summary-stat-pad: 14px;
  --ui-card-pad: 16px;
  --ui-card-gap: 12px;
  --ui-detail-pad: 20px;
  --ui-btn-h: 42px;
  --ui-grid-gap: var(--ui-gap);
}
@media (min-width:1440px){
  :root{
    --ui-toolbar-min-h: 46px;
    --ui-toolbar-gap: 16px;
    --ui-summary-pad: 20px;
    --ui-summary-gap: 18px;
    --ui-summary-stat-pad: 16px;
    --ui-card-pad: 18px;
    --ui-card-gap: 14px;
    --ui-detail-pad: 22px;
    --ui-btn-h: 44px;
  }
}
@media (max-width:1023px){
  :root{
    --ui-toolbar-min-h: 42px;
    --ui-toolbar-gap: 12px;
    --ui-summary-pad: 16px;
    --ui-summary-gap: 14px;
    --ui-summary-stat-pad: 12px;
    --ui-card-pad: 14px;
    --ui-card-gap: 10px;
    --ui-detail-pad: 18px;
    --ui-btn-h: 40px;
  }
}
@media (max-width:767px){
  :root{
    --ui-toolbar-min-h: 40px;
    --ui-toolbar-gap: 10px;
    --ui-summary-pad: 12px;
    --ui-summary-gap: 10px;
    --ui-summary-stat-pad: 10px;
    --ui-card-pad: 12px;
    --ui-card-gap: 8px;
    --ui-detail-pad: 14px;
    --ui-btn-h: 38px;
  }
}
@media (max-width:430px){
  :root{
    --ui-toolbar-min-h: 38px;
    --ui-toolbar-gap: 8px;
    --ui-summary-pad: 10px;
    --ui-summary-gap: 8px;
    --ui-summary-stat-pad: 8px;
    --ui-card-pad: 10px;
    --ui-card-gap: 6px;
    --ui-detail-pad: 12px;
    --ui-btn-h: 36px;
  }
}

.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools{
  gap: var(--ui-toolbar-gap) !important;
  margin-bottom: var(--ui-gap) !important;
}
.news-toolbar .pf-search-input,
.parts-inline-tools .pf-search-input,
.svc-inline-tools .pf-search-input,
.about-inline-tools .pf-search-input,
.news-toolbar .pf-info-btn,
.parts-inline-tools .pf-info-btn,
.svc-inline-tools .pf-info-btn,
.about-inline-tools .pf-info-btn,
.btn,
.part-details-actions .btn,
.part-card-v2-actions .btn,
.news-article-topbar .btn,
.services-level__head .btn,
.parts-detail-tools .btn{
  min-height: var(--ui-btn-h) !important;
}

.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.services-level__head{
  padding: var(--ui-summary-pad) !important;
  gap: var(--ui-summary-gap) !important;
  margin-bottom: var(--ui-gap) !important;
}
.news-category-focus__stats,
.parts-category-focus__stats,
.svc-active-category__stats,
.about-level-stats{
  gap: calc(var(--ui-summary-gap) - 4px) !important;
}
.news-category-focus__stat,
.parts-category-focus__stat,
.svc-active-category__count,
.about-level-stat{
  padding: var(--ui-summary-stat-pad) !important;
  border-radius: var(--ui-radius-sm) !important;
}

.news-category-card,
.parts-category-card,
.part-card-v2,
.svc-card,
.about-card,
.about-link-card,
.news-article-page,
.part-details-meta-card{
  padding: var(--ui-card-pad) !important;
}
.news-category-card__top,
.parts-category-card__top,
.part-card-v2,
.svc-card,
.about-card,
.about-link-card,
.part-details-main,
.news-article-shell,
.news-article-topbar{
  gap: var(--ui-card-gap) !important;
}

.news-grid,
.news-categories-grid,
.parts-grid-v2,
.parts-categories-grid,
.svc-cards-grid,
.svc-cards-grid--category,
.about-links-grid,
.about-cards-grid{
  gap: var(--ui-grid-gap) !important;
}

.news-article-page__body,
.news-article-page__head,
.news-article-hero__inner,
.part-details-layout,
.part-details-meta-card,
.parts-detail-tools,
.about-level-page,
.services-level-page{
  padding: var(--ui-detail-pad) !important;
}

.part-details-layout{gap: var(--ui-summary-gap) !important;}
.parts-detail-tools{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-card-gap)!important;flex-wrap:wrap;}
.parts-breadcrumb{gap:6px;row-gap:4px;}
.news-article-page__author{padding: var(--ui-card-pad) !important;}
.news-article-page__meta{gap: 8px 12px !important;}

@media (max-width:767px){
  .news-toolbar,
  .parts-inline-tools,
  .svc-inline-tools,
  .about-inline-tools{padding:0 !important;}
  .news-category-focus__stats,
  .parts-category-focus__stats,
  .svc-active-category__stats,
  .about-level-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .news-category-focus__stat:last-child,
  .parts-category-focus__stat:last-child,
  .svc-active-category__count:last-child,
  .about-level-stat:last-child{grid-column:1 / -1;}
  .parts-detail-tools{align-items:stretch;}
  .parts-share-btn{width:100%;justify-content:center;}
}
@media (max-width:430px){
  .news-toolbar .svc-filter-btn-label,
  .parts-inline-tools .svc-filter-btn-label,
  .svc-inline-tools .svc-filter-btn-label,
  .about-inline-tools .svc-filter-btn-label{display:none !important;}
  .news-toolbar .pf-info-btn,
  .parts-inline-tools .pf-info-btn,
  .svc-inline-tools .pf-info-btn,
  .about-inline-tools .pf-info-btn{padding-inline:10px !important;}
  .news-category-card,
  .parts-category-card,
  .part-card-v2,
  .svc-card,
  .about-card,
  .about-link-card{padding: var(--ui-card-pad) !important;}
  .parts-breadcrumb{font-size: var(--ui-meta) !important;}
}


.part-product-page .spa-content{padding-top:18px;}
.ecommerce-tools{margin-bottom:18px;}
.ecommerce-tools__actions{display:flex;gap:10px;flex-wrap:wrap;}
.product-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:22px;align-items:start;margin-bottom:18px;}
.product-gallery,.product-buybox,.product-specs,.product-details{border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);background:var(--surface);box-shadow:0 10px 24px rgba(0,0,0,.08);}
.product-gallery{padding:16px;}
.product-gallery__stage{border-radius:var(--ui-radius-lg,18px);overflow:hidden;background:linear-gradient(180deg,#111827,#1f2937);border:1px solid var(--surface-b);aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;}
.product-gallery__img{width:100%;height:100%;object-fit:cover;display:block;}
.product-gallery__caption{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px;}
.product-buybox{padding:22px;display:flex;flex-direction:column;gap:16px;position:sticky;top:12px;}
.product-buybox__sku{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;}
.product-buybox__title{font-family:'Oswald',sans-serif;font-size:30px;line-height:1.08;margin:6px 0 0;}
.product-buybox__rating{font-size:13px;color:var(--text2);margin-top:8px;}
.product-buybox__price{font-family:'Oswald',sans-serif;font-size:36px;line-height:1;color:var(--orange);}
.product-buybox__sub{font-size:12px;line-height:1.55;color:var(--text3);}
.product-buybox__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.product-buybox__actions .btn{min-height:46px;justify-content:center;}
.product-buybox__trust{display:grid;gap:8px;padding-top:8px;border-top:1px solid var(--line);}
.product-buybox__trust-item{font-size:12px;color:var(--text2);line-height:1.45;}
.product-buybox__shortdesc{padding:12px 14px;border-radius:var(--ui-radius-md,10px);background:var(--bg2);font-size:13px;line-height:1.6;color:var(--text2);}
.product-content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.product-specs,.product-details{padding:20px;}
.product-card__head{margin-bottom:16px;}
.product-card__kicker{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;}
.product-card__title{font-family:'Oswald',sans-serif;font-size:24px;line-height:1.1;margin:0;}
.product-specs__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.product-spec{border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:14px;background:var(--bg2);display:flex;flex-direction:column;gap:8px;}
.product-spec span{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-spec strong{font-size:14px;line-height:1.4;color:var(--text);}
.product-details__section + .product-details__section{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);}
.product-details__label{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-weight:700;}
.product-details__text,.product-details__empty{font-size:14px;line-height:1.7;color:var(--text2);}
.part-empty-card{padding:20px;border-radius:var(--ui-radius-lg,18px);}
.product-related-grid .part-card-v2{width:100%;min-width:0;}
@media (max-width: 1023px){
  .product-layout{grid-template-columns:1fr;}
  .product-buybox{position:static;}
  .product-content-grid{grid-template-columns:1fr;}
}
@media (max-width: 767px){
  #hero-part{display:none!important;}
  .ecommerce-tools{margin-bottom:12px;}
  .ecommerce-tools__actions{width:100%;display:grid;grid-template-columns:1fr 1fr;}
  .ecommerce-tools__actions .btn{min-height:40px;padding:10px 12px;font-size:12px;}
  .product-layout{gap:14px;}
  .product-gallery,.product-buybox,.product-specs,.product-details{border-radius:var(--ui-radius-md,10px);}
  .product-gallery,.product-specs,.product-details{padding:12px;}
  .product-buybox{padding:14px;gap:12px;}
  .product-gallery__stage{border-radius:var(--ui-radius-md,10px);aspect-ratio:16 / 13;}
  .product-buybox__title{font-size:22px;}
  .product-buybox__price{font-size:26px;}
  .product-buybox__sub,.product-buybox__trust-item,.product-buybox__shortdesc{font-size:11px;line-height:1.5;}
  .product-buybox__actions{grid-template-columns:1fr;gap:8px;}
  .product-buybox__actions .btn{min-height:42px;font-size:12px;}
  .product-card__title{font-size:18px;}
  .product-specs__grid{grid-template-columns:1fr;gap:8px;}
  .product-spec{padding:10px 12px;border-radius:var(--ui-radius-md,10px);gap:6px;}
  .product-spec span{font-size:10px;}
  .product-spec strong{font-size:12px;}
  .product-details__text,.product-details__empty{font-size:12px;line-height:1.55;}
  .product-related-grid{gap:12px;}
}
@media (max-width: 420px){
  .parts-breadcrumb{font-size:10px;gap:4px;}
  .ecommerce-tools__actions{grid-template-columns:1fr;}
  .product-buybox__title{font-size:19px;}
  .product-buybox__price{font-size:23px;}
}


.part-product-page .spa-content{padding-top:10px;}
.product-shell{display:grid;gap:16px;}
.product-tools{margin-bottom:8px;}
.product-top{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:18px;align-items:start;}
.product-media-card,.product-buybox--shop,.product-specs,.product-details,.product-merchant{border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);background:var(--surface);box-shadow:none;}
.product-media-card{padding:14px;display:grid;gap:12px;}
.product-media-frame{border-radius:var(--ui-radius-md,10px);overflow:hidden;background:linear-gradient(180deg,#0f172a,#1f2937);border:1px solid var(--surface-b);aspect-ratio:1/1;}
.product-media-main{display:block;width:100%;height:100%;object-fit:cover;}
.product-media-meta{display:grid;gap:10px;}
.product-media-badges{display:flex;flex-wrap:wrap;gap:8px;}
.product-media-chip{display:inline-flex;align-items:center;padding:8px 10px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);font-size:12px;color:var(--text2);line-height:1.2;}
.product-media-note{font-size:12px;color:var(--text3);line-height:1.5;}
.product-buybox--shop{padding:18px;display:grid;gap:12px;}
.product-buybox__title{font-family:'Oswald',sans-serif;font-size:26px;line-height:1.08;margin:2px 0 0;color:var(--text);}
.product-buybox__price{font-family:'Oswald',sans-serif;font-size:32px;line-height:1;color:var(--orange);}
.product-buybox__sub{font-size:13px;line-height:1.6;color:var(--text2);padding:0;margin:0;background:none;}
.product-buybox__rating{font-size:12px;color:var(--text2);}
.product-buybox__status{display:grid;gap:8px;padding:12px;border-radius:var(--ui-radius-md,10px);background:var(--bg2);border:1px solid var(--line);}
.product-buybox__status-note{font-size:12px;line-height:1.45;color:var(--text3);}
.product-buybox__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.product-buybox__actions .btn{min-height:44px;justify-content:center;}
.product-buybox__trust{display:grid;gap:8px;padding-top:6px;}
.product-buybox__trust-item{font-size:12px;color:var(--text2);line-height:1.45;}
.product-merchant{padding:12px 14px;display:grid;gap:4px;background:var(--bg2);}
.product-merchant__label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;}
.product-merchant__name{font-size:14px;font-weight:700;color:var(--text);}
.product-merchant__meta{font-size:12px;color:var(--text3);}
.product-info-pill{padding:12px 14px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface);display:grid;gap:6px;}
.product-info-pill span{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-info-pill strong{font-size:13px;line-height:1.35;color:var(--text);}
.product-content-grid--shop{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:16px;}
.product-specs,.product-details{padding:18px;}
.product-card__title{font-family:'Oswald',sans-serif;font-size:20px;line-height:1.1;margin:0;}
.product-card__head{margin-bottom:14px;}
.product-details__text,.product-details__empty{font-size:13px;line-height:1.7;color:var(--text2);}
.product-details__section + .product-details__section{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);}
.product-specs__grid--shop{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.product-spec{border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px;background:var(--bg2);display:grid;gap:6px;}
.product-spec span{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-spec strong{font-size:13px;line-height:1.4;color:var(--text);}
.ecommerce-related-card{border-radius:var(--ui-radius-md,10px);box-shadow:none;}
.product-related-section .news-section-head{margin-bottom:10px;}
@media (max-width: 1023px){
  .product-top,.product-content-grid--shop{grid-template-columns:1fr;}
}
@media (max-width: 767px){
  #hero-part{display:none!important;}
  .part-product-page .spa-content{padding-top:8px;}
  .product-shell{gap:12px;}
  .product-tools{margin-bottom:4px;}
  .parts-breadcrumb{font-size:10px;gap:4px;white-space:normal;}
  .ecommerce-tools__actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .ecommerce-tools__actions .btn{min-height:38px;padding:8px 10px;font-size:11px;}
  .product-top{gap:12px;}
  .product-media-card,.product-buybox--shop,.product-specs,.product-details{border-radius:var(--ui-radius-md,10px);}
  .product-media-card,.product-specs,.product-details{padding:10px;}
  .product-buybox--shop{padding:12px;gap:10px;}
  .product-media-frame{border-radius:var(--ui-radius-md,10px);aspect-ratio:1/1;}
  .product-media-badges{gap:6px;}
  .product-media-chip{padding:6px 8px;font-size:10px;}
  .product-media-note{font-size:10px;line-height:1.4;}
  .product-buybox__sku{font-size:10px;}
  .product-buybox__title{font-size:18px;}
  .product-buybox__rating{font-size:11px;}
  .product-buybox__price{font-size:24px;}
  .product-buybox__sub,.product-buybox__status-note,.product-buybox__trust-item,.product-merchant__meta,.product-details__text,.product-details__empty{font-size:11px;line-height:1.55;}
  .product-buybox__status{padding:10px;border-radius:var(--ui-radius-md,10px);}
  .product-buybox__actions{grid-template-columns:1fr 1fr;gap:8px;}
  .product-buybox__actions .btn{min-height:40px;font-size:11px;}
  .product-merchant{padding:10px 12px;border-radius:var(--ui-radius-md,10px);}
  .product-merchant__name{font-size:12px;}
  .product-info-pill{padding:10px;border-radius:var(--ui-radius-md,10px);gap:4px;}
  .product-info-pill span{font-size:9px;}
  .product-info-pill strong{font-size:11px;}
  .product-card__title{font-size:16px;}
  .product-card__head{margin-bottom:10px;}
  .product-specs__grid--shop{grid-template-columns:1fr;gap:8px;}
  .product-spec{padding:10px;border-radius:var(--ui-radius-md,10px);}
  .product-spec strong{font-size:12px;}
}
@media (max-width: 420px){
  .ecommerce-tools__actions{grid-template-columns:1fr;}
  .product-buybox__actions{grid-template-columns:1fr;}
  .product-buybox__title{font-size:16px;}
  .product-buybox__price{font-size:21px;}
}

.product-gallery-thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,72px));gap:10px;}
.product-gallery-thumb{padding:0;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);overflow:hidden;background:var(--surface);cursor:pointer;aspect-ratio:1/1;transition:border-color .18s, transform .18s, box-shadow .18s;}
.product-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.product-gallery-thumb:hover{border-color:var(--orange-brd);transform:translateY(-1px);}
.product-gallery-thumb.active{border-color:var(--orange);box-shadow:0 0 0 1px rgba(255,153,0,.18);}
@media (min-width:1024px){
  .product-buybox--shop{position:sticky;top:16px;}
}
@media (max-width:1023px){
  .product-buybox--shop{position:static;}
}
@media (max-width:767px){
  .product-gallery-thumbs{grid-template-columns:repeat(auto-fit,minmax(54px,60px));gap:8px;}
  .product-gallery-thumb{border-radius:var(--ui-radius-md,10px);}
}

.booking-categories-grid.is-hidden-by-prefill{display:none !important}


.booking-multi-picked{margin-bottom:14px;padding:12px 14px;border:1px solid rgba(245,158,11,.22);background:rgba(245,158,11,.08);border-radius:var(--ui-radius-md,10px)}
.booking-multi-picked__title{font-weight:800;color:#fff;margin-bottom:10px}
.booking-multi-picked__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.booking-multi-picked__title{margin-bottom:0}
.booking-picked-clear{border:1px solid rgba(245,158,11,.28);background:transparent;color:#fff;border-radius:999px;padding:7px 12px;font-weight:800;cursor:pointer}
.booking-picked-clear:hover{background:rgba(245,158,11,.12)}
.booking-multi-picked__note{margin-top:8px;font-size:12px;color:var(--text3)}
.booking-multi-picked__list{display:flex;flex-wrap:wrap;gap:8px}
.booking-picked-chip{border:1px solid rgba(245,158,11,.28);background:#161616;color:#fff;border-radius:999px;padding:8px 12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.booking-picked-chip span{color:var(--orange);font-size:14px;line-height:1}
.booking-service-card.active{box-shadow:0 0 0 1px rgba(245,158,11,.35) inset}

.booking-time-mode-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px}
.booking-time-mode-card{width:100%;display:flex;align-items:flex-start;gap:12px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--ui-radius-md,10px);padding:14px 16px;color:var(--text);cursor:pointer;transition:border-color .18s,transform .18s,box-shadow .18s}
.booking-time-mode-card:hover{border-color:var(--orange-brd);transform:translateY(-1px)}
.booking-time-mode-card.selected{border-color:var(--orange);box-shadow:0 0 0 1px rgba(255,153,0,.16) inset;background:rgba(255,153,0,.06)}
.booking-time-mode-card__emoji{font-size:20px;line-height:1;flex-shrink:0;margin-top:2px}
.booking-time-mode-card__body{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.booking-time-mode-card__title{font-weight:800;color:var(--text)}
.booking-time-mode-card__desc{font-size:12px;color:var(--text3);line-height:1.45}
.booking-time-mode-card__check{width:22px;min-width:22px;text-align:right;color:var(--orange);font-weight:900;font-size:16px}
.booking-time-mode-note{padding:12px 14px;border-radius:var(--ui-radius-md,10px);border:1px solid rgba(255,153,0,.18);background:rgba(255,153,0,.06);font-size:13px;color:var(--text2);line-height:1.5}


.onb-next-btn{
  width:100%;
  min-height:44px;
  justify-content:center;
  margin-top:12px;
}


/* v20260423r32 master work return responsive */
.master-work-subtabs{width:100%;align-items:stretch}
.master-work-subtabs .btn{min-height:38px}
.master-return-grid{align-items:stretch}
.master-return-card{height:100%}
.master-return-card-actions{flex-wrap:wrap}
.master-return-card-actions .btn{flex:1 1 140px;justify-content:center}
@media (max-width: 1024px){
  .master-work-pane .container > div[style*="grid-template-columns:1.1fr .9fr"]{grid-template-columns:1fr !important}
}
@media (max-width: 768px){
  .master-work-pane{padding:14px 0 !important}
  .master-work-subtabs{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px !important}
  .master-work-subtabs .btn{width:100%;padding:10px 12px !important;font-size:12px !important}
  .master-return-grid{grid-template-columns:1fr !important}
  .master-return-card{padding:12px !important}
  .master-return-card-actions .btn{flex:1 1 calc(50% - 6px)}
}
@media (max-width: 560px){
  .master-work-subtabs{grid-template-columns:1fr !important}
  .master-return-card-actions{flex-direction:column}
  .master-return-card-actions .btn{width:100%}
}

/* r189: cabinet panes open as modal sheets */
.cab-pane-source{display:none!important}
.cab-pane-modal-overlay{padding:18px;align-items:center;justify-content:center}
.cab-pane-modal-card{width:min(96vw,980px);max-height:min(92vh,860px);display:flex;flex-direction:column;overflow:hidden;border-radius:var(--ui-radius-lg,18px)}
.cab-pane-modal-head{flex:0 0 auto}
.cab-pane-modal-body{flex:1 1 auto;min-height:0;overflow:auto;padding:0}
.cab-pane-modal-body .cab-pane{display:block!important;padding:0;animation:pageIn .2s var(--ease) both}
.cab-pane-modal-body .cab-pane>.container{width:100%;max-width:100%;padding:18px 22px 24px}
.cab-pane-modal-body .cab-pane-layout{margin:0}
@media (max-width:640px){
  .cab-pane-modal-overlay{padding:10px;align-items:flex-end}
  .cab-pane-modal-card{width:100%;max-height:88vh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0}
  .cab-pane-modal-body .cab-pane>.container{padding:var(--ui-radius-md,10px) var(--ui-radius-md,10px) 18px}
}

/* r208: account diagnostics card pane */
.diag-account-hero{display:flex;align-items:center;gap:18px;padding:22px;margin-bottom:16px;background:linear-gradient(135deg,rgba(255,107,0,.10),rgba(34,197,94,.08))}
.diag-account-ico{width:58px;height:58px;border-radius:var(--ui-radius-lg,18px);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.14);font-size:30px;flex:0 0 auto}
.diag-account-body h3{margin:0 0 6px;font-family:'Oswald',sans-serif;font-size:25px;line-height:1.05;color:var(--text)}
.diag-account-body p{margin:0;color:var(--text2);font-size:14px;line-height:1.45}
.diag-account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.diag-account-card{border:1px solid var(--line);background:var(--surface);padding:18px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:7px;transition:.18s ease}
.diag-account-card:hover{transform:translateY(-2px);border-color:rgba(255,107,0,.35);box-shadow:0 16px 34px rgba(15,23,42,.10)}
.diag-account-card-ico{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.12);font-size:22px}
.diag-account-card b{font-size:16px;color:var(--text)}
.diag-account-card small{font-size:13px;color:var(--text3);font-weight:600}
@media(max-width:560px){.diag-account-hero{align-items:flex-start;padding:16px}.diag-account-grid{grid-template-columns:1fr}.diag-account-body h3{font-size:21px}}

/* ═══════════════════════════════════════════════════════════════════
   r244 COLOR / CONTRAST HOTFIX
   Цель: убрать чёрный текст на тёмном фоне, грязную серость и привести
   фон/текст/контуры/карточки к одной читаемой цветовой матрице.
═══════════════════════════════════════════════════════════════════ */
:root{
  /* Dark default: глубокий, но не глухой чёрный */
  --bg: #0b1020;
  --bg2: #101827;
  --surface: #151f32;
  --surface2: #1c2940;
  --text: #f8fafc;
  --text1: #f8fafc;
  --text2: #cbd5e1;
  --text3: #94a3b8;
  --line: rgba(148,163,184,.22);
  --line2: rgba(148,163,184,.34);
  --surface-a: rgba(255,255,255,.055);
  --surface-b: rgba(255,255,255,.105);
  --surface-c: rgba(255,255,255,.15);
  --surface-d: rgba(255,255,255,.22);
  --on-surface: #f8fafc;
  --muted-on-surface: #cbd5e1;
  --ui-page-bg: var(--bg);
  --ui-card-bg: linear-gradient(180deg, rgba(21,31,50,.98), rgba(16,24,39,.98));
  --ui-card-bg-flat: #151f32;
  --ui-card-hover: #1b2a44;
  --ui-surface: var(--ui-card-bg-flat);
  --ui-surface-2: var(--surface2);
  --ui-border: var(--line);
  --ui-border-strong: var(--line2);
  --ui-shadow-card: 0 16px 38px rgba(0,0,0,.28);
  --ui-shadow-float: 0 26px 80px rgba(0,0,0,.42);
  color-scheme: dark;
}

[data-theme="light"]{
  /* Light: меньше грязно-серого, больше чистого воздуха и контраста */
  --bg: #f7f9fc;
  --bg2: #ffffff;
  --surface: #ffffff;
  --surface2: #eef3f8;
  --text: #101828;
  --text1: #101828;
  --text2: #344054;
  --text3: #667085;
  --line: rgba(15,23,42,.115);
  --line2: rgba(15,23,42,.18);
  --surface-a: rgba(15,23,42,.035);
  --surface-b: rgba(15,23,42,.07);
  --surface-c: rgba(15,23,42,.105);
  --surface-d: rgba(15,23,42,.16);
  --on-surface: #101828;
  --muted-on-surface: #344054;
  --ui-page-bg: #f7f9fc;
  --ui-card-bg: linear-gradient(180deg, #ffffff, #fbfdff);
  --ui-card-bg-flat: #ffffff;
  --ui-card-hover: #f3f7fc;
  --ui-surface: #ffffff;
  --ui-surface-2: #f3f7fc;
  --ui-border: rgba(15,23,42,.115);
  --ui-border-strong: rgba(15,23,42,.18);
  --ui-shadow-card: 0 12px 34px rgba(16,24,40,.08);
  --ui-shadow-float: 0 28px 80px rgba(16,24,40,.16);
  color-scheme: light;
}

@media (prefers-color-scheme: light){
  [data-theme="auto"]{
    --bg: #f7f9fc;
    --bg2: #ffffff;
    --surface: #ffffff;
    --surface2: #eef3f8;
    --text: #101828;
    --text1: #101828;
    --text2: #344054;
    --text3: #667085;
    --line: rgba(15,23,42,.115);
    --line2: rgba(15,23,42,.18);
    --surface-a: rgba(15,23,42,.035);
    --surface-b: rgba(15,23,42,.07);
    --surface-c: rgba(15,23,42,.105);
    --surface-d: rgba(15,23,42,.16);
    --on-surface: #101828;
    --muted-on-surface: #344054;
    --ui-page-bg: #f7f9fc;
    --ui-card-bg: linear-gradient(180deg, #ffffff, #fbfdff);
    --ui-card-bg-flat: #ffffff;
    --ui-card-hover: #f3f7fc;
    --ui-surface: #ffffff;
    --ui-surface-2: #f3f7fc;
    --ui-border: rgba(15,23,42,.115);
    --ui-border-strong: rgba(15,23,42,.18);
    --ui-shadow-card: 0 12px 34px rgba(16,24,40,.08);
    --ui-shadow-float: 0 28px 80px rgba(16,24,40,.16);
    color-scheme: light;
  }
}

[data-surface="clean"]{
  --ui-card-bg: linear-gradient(180deg, var(--surface), var(--bg2));
  --ui-card-bg-flat: var(--surface);
  --ui-surface: var(--surface);
  --ui-surface-2: var(--bg2);
  --ui-border: var(--line);
}
[data-surface="solid"]{
  --ui-card-bg: linear-gradient(180deg,
    color-mix(in srgb, var(--surface) 96%, var(--orange) 4%),
    color-mix(in srgb, var(--bg2) 97%, var(--orange) 3%)
  );
  --ui-card-bg-flat: color-mix(in srgb, var(--surface) 96%, var(--orange) 4%);
  --ui-surface: var(--ui-card-bg-flat);
  --ui-surface-2: color-mix(in srgb, var(--bg2) 96%, var(--orange) 4%);
  --ui-border: color-mix(in srgb, var(--line) 82%, var(--orange) 18%);
}
[data-surface="glass"]{
  --ui-card-bg: linear-gradient(180deg,
    color-mix(in srgb, var(--surface) 88%, transparent),
    color-mix(in srgb, var(--bg2) 88%, transparent)
  );
  --ui-card-bg-flat: color-mix(in srgb, var(--surface) 90%, transparent);
  --ui-surface: var(--ui-card-bg-flat);
  --ui-surface-2: color-mix(in srgb, var(--bg2) 90%, transparent);
  --ui-border: color-mix(in srgb, var(--line) 76%, rgba(255,255,255,.22) 24%);
}

body{background:var(--ui-page-bg, var(--bg));color:var(--text1);}
input,textarea,select{color:var(--text1);background:var(--ui-surface-2);border-color:var(--ui-border);}
input::placeholder,textarea::placeholder{color:var(--text3);opacity:1;}

/* Единая читаемая поверхность для ключевых карточек и окон */
.card,
.surface-card,
.page-hero,
.spa-hero-body,
.hcat-card,
.home-special-card,
.spec-svc-item,
.msng-item,
.msng-item--v2,
.mo-card,
.master-card,
.master-contact-row,
.parts-category-card,
.legal-info-card,
.legal-rich-stat,
.cab-tab,
.mprof-tab,
.masters-sticky-tools,
.page-sticky-tools,
.msng-empty-cta,
.empty-state,
.cmodal-box,
.cmodal-card,
.ui-modal-card,
.modal-dialog-v2,
#notifs-panel{
  background:var(--ui-card-bg) !important;
  color:var(--text1) !important;
  border-color:var(--ui-border) !important;
  box-shadow:var(--ui-shadow-card);
}

.card h1,.card h2,.card h3,.card h4,
.surface-card h1,.surface-card h2,.surface-card h3,.surface-card h4,
.page-hero h1,.page-hero h2,.spa-hero-body h1,.spa-hero-body h2,
.msng-item b,.mo-card b,.master-card b,.legal-info-card b,.legal-rich-stat b,
.cab-tab b,.mprof-tab b{
  color:var(--text1) !important;
}
.card p,.card small,.card span,
.surface-card p,.surface-card small,
.page-hero p,.spa-hero-body p,
.msng-item p,.mo-card p,.master-card p,.legal-info-card p,.legal-rich-stat p,
.cab-tab small,.mprof-tab small{
  color:inherit;
}
.card .muted,.card .text-muted,
.surface-card .muted,.surface-card .text-muted,
.msng-item small,.mo-card small,.master-card small,
.legal-info-card p,.legal-rich-stat p,
.cab-tab small,.mprof-tab small,
.spa-hero-body p,.page-hero p{
  color:var(--text2) !important;
}

/* Фильтры и кнопки: чётче, меньше серой каши */
.mo-filter-tab,
.mo-search-action,
.nav-link,
.drawer-link,
.btn,
.ui-btn,
button[class*="btn"],
button[class*="cta"]{
  color:var(--text1);
}
.mo-filter-tab{
  background:var(--ui-surface-2) !important;
  border-color:var(--ui-border) !important;
  color:var(--text2) !important;
}
.mo-filter-tab.active,
.mo-filter-tab.is-active,
.mo-filter-tab[aria-selected="true"]{
  background:linear-gradient(135deg, var(--orange), var(--orange-l)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 10px 28px rgba(255,107,0,.24);
}
.mo-search-action,
.cmodal-close,
.modal-close-v2{
  background:var(--ui-surface-2) !important;
  border:1px solid var(--ui-border) !important;
  color:var(--text1) !important;
}

/* Акцентные CTA должны быть контрастными, не серыми */
.svc-urgent-cta,
.home-catalog-custom-request,
.btn-primary,
.ui-btn--primary,
button[data-primary="1"]{
  background:linear-gradient(135deg, var(--orange), var(--orange-l)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 14px 34px rgba(255,107,0,.26) !important;
}

/* Selected/active surface */
.spec-svc-item--selected,
.spec-svc-item.active,
.cab-tab.active,
.mprof-tab.active,
.hcat-card.active{
  background:linear-gradient(180deg, color-mix(in srgb, var(--orange) 13%, var(--ui-card-bg-flat)), var(--ui-card-bg-flat)) !important;
  border-color:var(--orange-brd) !important;
  color:var(--text1) !important;
}

/* Читабельная типографика: не уводим второстепенный текст в почти невидимый серый */
.t-sub,.t-body-sm,.t-desc,.profile-hint,.form-hint,
.msng-empty-cta p,.empty-state p,.legal-rich-stat p,.legal-info-card p{
  color:var(--text2) !important;
}
.t-meta,.form-required,.char-counter,.notifs-meta{
  color:var(--text3) !important;
}

/* Hover — лёгкий, без грязной серой заливки */
.card:hover,
.surface-card:hover,
.hcat-card:hover,
.msng-item--v2:hover,
.mo-card:hover,
.master-card:hover,
.parts-category-card:hover,
.legal-info-card:hover,
.legal-rich-stat:hover{
  background:linear-gradient(180deg, var(--ui-card-hover), var(--ui-card-bg-flat)) !important;
  border-color:var(--ui-border-strong) !important;
}

@media (max-width:767px){
  :root{--base-fs:16px;}
  .card,.surface-card,.hcat-card,.msng-item--v2,.mo-card,.master-card,.legal-info-card,.legal-rich-stat{box-shadow:0 8px 22px rgba(16,24,40,.08);}
  .mo-filter-tab{font-size:12px;line-height:1.15;}
}

/* === SOURCE: css/ui_tokens.css === */
/* KARETA.KZ UI TOKENS — r288
   Mandatory base design tokens for future UI work.
   This file is intentionally soft: it standardizes variables and aliases
   without mass-rewriting old component CSS in this release. */
:root{
  /* Spacing scale: only these values should be used for new UI layout. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;

  /* Radius scale: project standard. */
  --radius-min: 5px;
  --radius-mid: 10px;
  --radius-max: 18px;

  /* Backward-compatible radius aliases. */
  --r-sm: var(--radius-min);
  --r-md: var(--radius-mid);
  --r-lg: var(--radius-max);
  --r-xl: var(--radius-max);
  --radius-sm: var(--radius-min);
  --radius-md: var(--radius-mid);
  --radius-lg: var(--radius-max);
  --radius-xl: var(--radius-max);
  --radius-control: var(--radius-mid);
  --radius-btn: var(--radius-mid);
  --radius-field: var(--radius-mid);
  --radius-card: var(--radius-max);
  --radius-modal: var(--radius-max);

  /* UI component radius aliases. */
  --ui-radius-sm: var(--radius-min);
  --ui-radius-md: var(--radius-mid);
  --ui-radius-lg: var(--radius-max);
  --ui-radius-xl: var(--radius-max);
  --ui-radius: var(--radius-mid);
  --ui-radius-control: var(--radius-mid);
  --ui-radius-btn: var(--radius-mid);
  --ui-radius-field: var(--radius-mid);
  --ui-radius-input: var(--radius-mid);
  --ui-radius-card: var(--radius-max);
  --ui-radius-modal: var(--radius-max);
  --ui-radius-pill: 999px;

  /* Touch and control heights. */
  --ui-btn-h-sm: 36px;
  --ui-btn-h-md: 44px;
  --ui-btn-h-lg: 48px;
  --ui-btn-h: var(--ui-btn-h-md);
  --ui-input-h: 44px;
  --ui-touch-target: 44px;

  /* Icon and typography helpers. */
  --ui-icon-sm: 16px;
  --ui-icon-md: 18px;
  --ui-icon-lg: 22px;
  --ui-text-sm: 13px;
  --ui-text-md: 15px;
  --ui-text-lg: 17px;

  /* Layering scale. Do not use random z-index values in new code. */
  --z-base: 1;
  --z-sticky: 50;
  --z-bottom-nav: 80;
  --z-dropdown: 120;
  --z-modal: 300;
  --z-toast: 500;

  /* Generic UI surface aliases. They map to existing theme variables if present. */
  --ui-surface: var(--surface, #ffffff);
  --ui-surface-2: var(--surface-2, #f6f8fb);
  --ui-surface-soft: var(--surface-soft, rgba(15,23,42,.04));
  --ui-border: var(--border, rgba(15,23,42,.12));
  --ui-border-soft: rgba(15,23,42,.08);
  --ui-border-strong: rgba(15,23,42,.18);
  --ui-shadow-card: var(--shadow-card, 0 12px 32px rgba(15,23,42,.08));
  --ui-shadow-soft: var(--shadow-soft, 0 8px 22px rgba(15,23,42,.06));
  --ui-shadow-float: var(--shadow-lg, 0 18px 48px rgba(15,23,42,.14));
}

/* Theme radius modes. These are the only supported interface radius presets. */
:root[data-radius="min"],
html[data-radius="min"],
body[data-radius="min"]{
  --ui-radius-btn: var(--radius-min);
  --ui-radius-field: var(--radius-min);
  --ui-radius-input: var(--radius-min);
  --ui-radius-card: var(--radius-min);
  --ui-radius-modal: var(--radius-min);
}

:root[data-radius="mid"],
html[data-radius="mid"],
body[data-radius="mid"],
:root[data-radius="default"],
html[data-radius="default"],
body[data-radius="default"],
:root[data-radius="solid"],
html[data-radius="solid"],
body[data-radius="solid"]{
  --ui-radius-btn: var(--radius-mid);
  --ui-radius-field: var(--radius-mid);
  --ui-radius-input: var(--radius-mid);
  --ui-radius-card: var(--radius-mid);
  --ui-radius-modal: var(--radius-mid);
}

:root[data-radius="max"],
html[data-radius="max"],
body[data-radius="max"],
:root[data-radius="round"],
html[data-radius="round"],
body[data-radius="round"],
:root[data-radius="apple"],
html[data-radius="apple"],
body[data-radius="apple"]{
  --ui-radius-btn: var(--radius-max);
  --ui-radius-field: var(--radius-max);
  --ui-radius-input: var(--radius-max);
  --ui-radius-card: var(--radius-max);
  --ui-radius-modal: var(--radius-max);
}

/* Compatibility aliases for existing local component tokens. */
:root{
  --card-radius-sm: var(--ui-radius-sm);
  --card-radius-md: var(--ui-radius-md);
  --card-radius-lg: var(--ui-radius-card);
  --kareta-card-radius: var(--ui-radius-card);
  --list-card-radius: var(--ui-radius-card);
  --list-card-radius-inner: var(--ui-radius-md);
  --tools-radius: var(--ui-radius-card);
  --myo-tools-radius: var(--ui-radius-card);
  --flow-radius-control: var(--ui-radius-control);
  --flow-radius-card: var(--ui-radius-card);
  --flow-radius-panel: var(--ui-radius-card);
  --flow-radius-pill: var(--ui-radius-pill);
  --tool-btn-h: var(--ui-btn-h-md);
}

/* === SOURCE: css/additions.css === */

/* ══════════════════════════════════════
   BOOKING PAGE
══════════════════════════════════════ */
.booking-hero {
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 52px 0 44px;
}

.booking-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 32px;
  align-items: start;
}

/* Step indicator */
.booking-steps {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 36px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.booking-steps::-webkit-scrollbar { display: none; }

.bstep {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.bstep-num {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1px solid var(--line);
  color: var(--text3);
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: .25s var(--ease);
  flex-shrink: 0;
}
.bstep-label {
  font-size: 12px;
  color: var(--text3);
  font-weight: 600;
  white-space: nowrap;
  transition: .25s var(--ease);
}
.bstep.active .bstep-num { background: var(--orange); border-color: var(--orange); color: #fff; }
.bstep.active .bstep-label { color: var(--orange); }
.bstep.done .bstep-num { background: var(--green); border-color: var(--green); color: #fff; }
.bstep.done .bstep-label { color: var(--text2); }
.bstep-line {
  flex: 1;
  min-width: 24px;
  height: 1px;
  background: var(--line);
  margin: 0 6px;
}
.bstep.done + .bstep-line { background: var(--green); }

/* Booking form card */
.bform-card {
  padding: 28px;
}

.bform-section { margin-bottom: 28px; }
.bform-section:last-child { margin-bottom: 0; }
.bform-section-title {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text2);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.bform-section-title::before {
  content: '';
  width: 3px; height: 14px;
  background: var(--orange);
  border-radius: var(--ui-radius-sm,5px);
  flex-shrink: 0;
}

/* Service selector chips */
.service-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.svc-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 99px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text2);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: .2s var(--ease);
  user-select: none;
}
.svc-chip:hover { border-color: var(--orange-brd); color: var(--text); }
.svc-chip.selected {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
  font-weight: 600;
}
.svc-chip-ico { font-size: 14px; }

/* Date/time grid */
.date-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}
.date-btn {
  padding: 10px 8px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text2);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: .2s var(--ease);
  line-height: 1.3;
}
.date-btn:hover { border-color: var(--orange-brd); color: var(--text); }
.date-btn.selected { background: var(--orange-dim); border-color: var(--orange); color: var(--orange); }
.date-btn.disabled { opacity: .35; cursor: not-allowed; pointer-events: none; }
.date-day { font-size: 10px; color: inherit; opacity: .7; }

.time-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.time-btn {
  padding: 9px 6px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text2);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: .2s var(--ease);
  text-align: center;
}
.time-btn:hover { border-color: var(--orange-brd); color: var(--text); }
.time-btn.selected { background: var(--orange-dim); border-color: var(--orange); color: var(--orange); }
.time-btn.busy { opacity: .3; cursor: not-allowed; pointer-events: none; text-decoration: line-through; }

/* Form inputs */
.bform-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.bform-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bform-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text3);
  letter-spacing: 1px;
  text-transform: uppercase;
}
.bform-input, .bform-select, .bform-textarea {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 11px 14px;
  font-size: 14px;
  color: var(--text);
  outline: none;
  font-family: 'Mulish', sans-serif;
  transition: .2s var(--ease);
}
.bform-input:focus, .bform-select:focus, .bform-textarea:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,107,0,.1);
}
.bform-input::placeholder, .bform-textarea::placeholder { color: var(--text3); }
.bform-select { cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.bform-textarea { resize: vertical; min-height: 80px; }

.bform-input[readonly] {
  background: var(--surface-a);
  color: var(--text2);
  cursor: not-allowed;
}
.bform-note {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text3);
}

/* Nav buttons */
.bform-nav {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

/* Booking sidebar summary */
.booking-summary {
  position: static;
  top: 80px;
}
.bsummary-card { padding: 24px; }
.bsummary-title {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text2);
  margin-bottom: 18px;
}
.bsum-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.bsum-row:last-of-type { border-bottom: none; }
.bsum-row .k { color: var(--text3); }
.bsum-row .v { color: var(--text); font-weight: 600; text-align: right; }
.bsum-row .v.orange { color: var(--orange); }
.bsum-empty { color: var(--text3); font-size: 13px; font-style: italic; }

/* Booking success */
.booking-success {
  text-align: center;
  padding: 48px 20px;
}
.bs-icon {
  width: 80px; height: 80px;
  border-radius: 50%;
  background: rgba(34,197,94,.1);
  border: 2px solid var(--green);
  display: flex; align-items: center; justify-content: center;
  font-size: 36px;
  margin: 0 auto 24px;
  animation: popIn .4s var(--ease) both;
}
.bs-title { font-family: 'Oswald', sans-serif; font-size: 28px; font-weight: 700; margin-bottom: 10px; }
.bs-sub { font-size: 15px; color: var(--text2); margin-bottom: 28px; line-height: 1.6; }
.bs-detail {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 18px 22px;
  max-width: 360px;
  margin: 0 auto 28px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bs-detail-row { display: flex; justify-content: space-between; font-size: 13px; }
.bs-detail-row .k { color: var(--text3); }
.bs-detail-row .v { font-weight: 600; color: var(--orange); }

/* ══════════════════════════════════════
   CHAT — BOTTOM SHEET (no FAB)
══════════════════════════════════════ */

/* Overlay behind chat/notifs */
#chat-overlay, #notifs-overlay {
  display: none;
  position: fixed; inset: 0;
  z-index: 498;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity .3s ease;
}
#chat-overlay.vis, #notifs-overlay.vis {
  display: block;
  opacity: 1;
}

.chat-window {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 499;
  max-height: 80dvh;
  min-height: 320px;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex;
  flex-direction: column;
  box-shadow: 0 -8px 40px rgba(0,0,0,.5);
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.16,1,.3,1);
}
.chat-window.open {
  transform: translateY(0);
}

/* Desktop: positioned window */
@media (min-width: 901px) {
  .chat-window {
    left: auto; right: 28px;
    bottom: 28px;
    width: 360px; max-height: 520px;
    border-radius: var(--ui-radius-md,10px);
    border: 1px solid var(--line);
    transform: scale(.92) translateY(16px);
    transform-origin: bottom right;
    opacity: 0; pointer-events: none;
  }
  .chat-window.open {
    transform: scale(1) translateY(0);
    opacity: 1; pointer-events: all;
  }
  #chat-overlay { display: none !important; }
}

/* Drag handle */
.chat-handle {
  width: 36px; height: 4px;
  background: var(--surface-d);
  border-radius: 99px;
  margin: 12px auto 0;
  flex-shrink: 0;
}
@media (min-width: 901px) { .chat-handle { display: none; } }

.chat-head { flex-shrink: 0; }
.chat-head-inner {
  padding: 14px 16px 14px;
  background: var(--orange);
  border-radius: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
@media (min-width: 901px) {
  .chat-head-inner { border-radius: var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0 0; }
}

.chat-head-av {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--surface-d);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.chat-head-name { font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 600; color: #fff; }
.chat-head-status { font-size: 11px; color: var(--on-surface); display: flex; align-items: center; gap: 5px; }
.chat-online-dot {
  width: 7px; height: 7px; background: #4ade80; border-radius: 50%;
  animation: blink 2s infinite;
  display: inline-block;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.4} }

.chat-head-close {
  margin-left: auto;
  color: var(--on-surface);
  font-size: 22px; line-height: 1;
  width: 32px; height: 32px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: .2s; cursor: pointer;
  flex-shrink: 0;
}
.chat-head-close:hover { color: #fff; background: var(--surface-c); }

.chat-messages {
  flex: 1; overflow-y: auto;
  padding: 14px 14px 6px;
  display: flex; flex-direction: column; gap: 10px;
  scrollbar-width: thin;
  scrollbar-color: var(--surface2) transparent;
}
.chat-msg { max-width: 80%; display: flex; flex-direction: column; gap: 2px; }
.chat-msg.bot  { align-self: flex-start; }
.chat-msg.user { align-self: flex-end; }
.chat-bubble {
  padding: 9px 13px; border-radius: var(--ui-radius-md,10px);
  font-size: 13px; line-height: 1.55;
}
.chat-msg.bot .chat-bubble  { background: var(--surface2); color: var(--text); border-bottom-left-radius: 4px; }
.chat-msg.user .chat-bubble { background: var(--orange); color: #fff; border-bottom-right-radius: 4px; }
.chat-time { font-size: 10px; color: var(--text3); padding: 0 4px; }
.chat-msg.user .chat-time { text-align: right; }

.chat-typing {
  display: flex; gap: 4px; align-items: center;
  padding: 10px 14px;
  background: var(--surface2);
  border-radius: var(--ui-radius-md,10px); border-bottom-left-radius: 4px;
  width: fit-content;
}
.chat-typing span {
  width: 6px; height: 6px; background: var(--text3); border-radius: 50%;
  animation: typingDot 1.2s infinite;
}
.chat-typing span:nth-child(2) { animation-delay: .2s; }
.chat-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes typingDot { 0%,80%,100%{transform:scale(1);opacity:.4} 40%{transform:scale(1.3);opacity:1} }

.chat-quick-replies {
  padding: 8px 14px; display: flex; gap: 6px; flex-wrap: wrap;
  flex-shrink: 0; border-top: 1px solid var(--line);
}
.qr-btn {
  font-size: 12px; color: var(--orange);
  border: 1px solid var(--orange-brd); background: var(--orange-dim);
  padding: 5px 10px; border-radius: 99px; cursor: pointer;
  transition: .2s var(--ease); white-space: nowrap;
}
.qr-btn:active { background: rgba(255,107,0,.22); transform: scale(.96); }

.chat-input-row {
  padding: 10px 12px;
  padding-bottom: max(10px, env(safe-area-inset-bottom, 10px));
  display: flex; gap: 8px; align-items: center;
  border-top: 1px solid var(--line); flex-shrink: 0;
}
.chat-input {
  flex: 1; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px); padding: 10px 14px;
  font-size: 16px; color: var(--text); outline: none;
  font-family: 'Mulish', sans-serif; transition: .2s var(--ease);
}
.chat-input:focus { border-color: var(--orange-brd); }
.chat-input::placeholder { color: var(--text3); font-size: 14px; }
.chat-send {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--orange); color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: .2s var(--ease);
}
.chat-send:hover  { background: var(--orange-l); transform: scale(1.07); }
.chat-send:active { transform: scale(.93); }


/* ══════════════════════════════════════
   NOTIFICATIONS PANEL — BOTTOM SHEET
══════════════════════════════════════ */
#notifs-panel {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 499;
  max-height: 85dvh;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  box-shadow: 0 -8px 40px rgba(0,0,0,.5);
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.16,1,.3,1);
}
#notifs-panel.open { transform: translateY(0); }

@media (min-width: 901px) {
  #notifs-panel {
    left: auto; right: 28px; bottom: 28px;
    width: 380px; max-height: 560px;
    border-radius: var(--ui-radius-md,10px);
    border: 1px solid var(--line);
    transform: scale(.92) translateY(16px);
    transform-origin: bottom right;
    opacity: 0; pointer-events: none;
  }
  #notifs-panel.open { transform: scale(1) translateY(0); opacity: 1; pointer-events: all; }
  #notifs-overlay { display: none !important; }
}

.notifs-handle {
  width: 36px; height: 4px;
  background: var(--surface-d); border-radius: 99px;
  margin: 12px auto 0; flex-shrink: 0;
}
@media (min-width: 901px) { .notifs-handle { display: none; } }

.notifs-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px 12px; border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.notifs-title {
  font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .5px;
}
.notifs-close {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--surface); color: var(--text3);
  font-size: 20px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: .2s;
}
.notifs-close:hover { background: var(--surface2); color: var(--text); }

.notifs-body {
  flex: 1; overflow-y: auto;
  padding: 10px 14px 8px;
  display: flex; flex-direction: column; gap: 8px;
}

.notif-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; border-radius: var(--ui-radius-md,10px);
  cursor: pointer; transition: .2s var(--ease);
  position: relative;
}
.notif-item.unread { border-left: 3px solid var(--orange); }
.notif-item:active { transform: scale(.99); opacity: .85; }
.notif-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--orange); flex-shrink: 0; margin-top: 5px;
}
.notif-ico {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}
.notif-ico.success { background: rgba(34,197,94,.12); }
.notif-ico.info    { background: rgba(96,165,250,.12); }
.notif-ico.warning { background: rgba(245,158,11,.12); }
.notif-ico.promo   { background: rgba(255,107,0,.12);  }
.notif-content { flex: 1; min-width: 0; }
.notif-title  { font-weight: 700; font-size: 13px; margin-bottom: 3px; }
.notif-text   { font-size: 12px; color: var(--text2); line-height: 1.45; }
.notif-time   { font-size: 11px; color: var(--text3); margin-top: 4px; }

.notifs-footer {
  padding: 12px 16px;
  padding-bottom: max(12px, env(safe-area-inset-bottom, 12px));
  border-top: 1px solid var(--line); flex-shrink: 0;
}
.notifs-clear-btn {
  width: 100%; padding: 10px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px); font-size: 13px; font-weight: 600;
  color: var(--text2); cursor: pointer; transition: .2s;
  font-family: 'Mulish', sans-serif;
}
.notifs-clear-btn:hover { background: var(--surface2); color: var(--text); }
.notifs-clear-btn:active { transform: scale(.98); }

/* ══════════════════════════════════════
   ADMIN PANEL
══════════════════════════════════════ */
.admin-layout {
  display: flex;
  min-height: calc(100vh - var(--nav-h));
}

/* Admin sidebar */
.admin-sidebar {
  width: 220px;
  flex-shrink: 0;
  background: var(--bg2);
  border-right: 1px solid var(--line);
  padding: 24px 0;
  position: static;
  top: var(--nav-h);
  height: calc(100vh - var(--nav-h));
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.admin-nav-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--text3);
  padding: 0 18px;
  margin-bottom: 8px;
  margin-top: 20px;
}
.admin-nav-label:first-child { margin-top: 0; }
.admin-nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  color: var(--text2);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: .2s var(--ease);
  border-left: 2px solid transparent;
  position: relative;
}
.admin-nav-item:hover { background: var(--surface-a); color: var(--text); }
.admin-nav-item.active { color: var(--orange); background: var(--orange-dim); border-left-color: var(--orange); }
.admin-nav-icon { font-size: 15px; flex-shrink: 0; }
.admin-nav-badge {
  margin-left: auto;
  min-width: 18px; height: 18px; padding: 0 5px;
  background: var(--orange);
  color: #fff; font-size: 10px; font-weight: 700;
  border-radius: 99px;
  display: flex; align-items: center; justify-content: center;
}

/* Admin content */
.admin-content {
  flex: 1;
  overflow: hidden;
  padding: 28px;
  min-width: 0;
}
.admin-pane { display: none; animation: pageIn .25s var(--ease) both; }
.admin-pane.active { display: block; }

.admin-page-title {
  font-family: 'Oswald', sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Stats row */
.admin-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 28px;
}
.astat-card {
  padding: 18px 20px;
  border-radius: var(--ui-radius-sm,5px);
}
.astat-label { font-size: 11px; color: var(--text3); font-weight: 600; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 6px; }
.astat-num { font-family: 'Oswald', sans-serif; font-size: 28px; font-weight: 700; color: var(--text); line-height: 1; }
.astat-change { font-size: 11px; margin-top: 4px; }
.astat-change.up { color: var(--green); }
.astat-change.down { color: var(--red); }

/* Orders table */
.admin-table-wrap {
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  overflow: hidden;
  overflow-x: auto;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}
.admin-table thead { background: var(--surface2); }
.admin-table th {
  padding: 12px 16px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text3);
  white-space: nowrap;
}
.admin-table td {
  padding: 14px 16px;
  font-size: 13px;
  border-top: 1px solid var(--line);
  vertical-align: middle;
}
.admin-table tbody tr:hover td { background: var(--surface-a); }

.order-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  white-space: nowrap;
}
.order-status.new { background: rgba(99,179,237,.12); color: #63b3ed; }
.order-status.process { background: var(--orange-dim); color: var(--orange); }
.order-status.done { background: rgba(34,197,94,.1); color: var(--green); }
.order-status.cancelled { background: rgba(239,68,68,.1); color: var(--red); }
.order-status::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}
.order-status.process::before { animation: blink 1.5s infinite; }

.order-actions { display: flex; gap: 6px; }
.act-btn {
  padding: 5px 11px;
  border-radius: var(--ui-radius-sm,5px);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  transition: .2s var(--ease);
}
.act-btn.view { background: var(--surface-b); color: var(--text2); border: 1px solid var(--line); }
.act-btn.view:hover { color: var(--text); background: var(--surface-c); }
.act-btn.edit { background: var(--orange-dim); color: var(--orange); border: 1px solid var(--orange-brd); }
.act-btn.edit:hover { background: rgba(255,107,0,.2); }

/* Admin filter bar */
.admin-filters {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  align-items: center;
}
.admin-filter-btn {
  padding: 7px 14px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text2);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: .2s var(--ease);
}
.admin-filter-btn:hover, .admin-filter-btn.active { color: var(--orange); border-color: var(--orange); background: var(--orange-dim); }
.admin-search {
  margin-left: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 7px 14px;
  font-size: 13px;
  color: var(--text);
  outline: none;
  width: 200px;
  transition: .2s var(--ease);
  font-family: 'Mulish', sans-serif;
}
.admin-search:focus { border-color: var(--orange-brd); }

/* Admin calendar */
.admin-calendar {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 20px;
  align-items: start;
}
.cal-grid-wrap { }
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.cal-month { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 600; }
.cal-nav { display: flex; gap: 6px; }
.cal-nav-btn {
  width: 32px; height: 32px;
  border-radius: var(--ui-radius-sm,5px);
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--text2);
  font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: .2s var(--ease);
}
.cal-nav-btn:hover { border-color: var(--orange-brd); color: var(--orange); }
.cal-days-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  margin-bottom: 6px;
}
.cal-day-name { text-align: center; font-size: 11px; color: var(--text3); font-weight: 600; padding: 6px; }
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.cal-cell {
  aspect-ratio: 1;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: .2s var(--ease);
  position: relative;
  gap: 3px;
}
.cal-cell:hover { background: var(--surface2); border-color: var(--line); }
.cal-cell.today { border-color: var(--orange-brd); background: var(--orange-dim); }
.cal-cell.selected { background: var(--orange); border-color: var(--orange); }
.cal-cell.other-month .cal-cell-num { opacity: .3; }
.cal-cell.has-orders .cal-cell-dot { display: block; }
.cal-cell-num { font-size: 13px; font-weight: 600; line-height: 1; }
.cal-cell.selected .cal-cell-num { color: #fff; }
.cal-cell-dot {
  display: none;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--orange);
}
.cal-cell.selected .cal-cell-dot { background: var(--surface-d); }

.cal-day-orders { }
.cal-day-title {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 12px;
  color: var(--orange);
}
.cal-order-item {
  padding: 12px 14px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid var(--line);
  background: var(--surface);
  margin-bottom: 8px;
  cursor: pointer;
  transition: .2s var(--ease);
}
.cal-order-item:hover { border-color: var(--orange-brd); }
.cal-order-time { font-size: 12px; color: var(--orange); font-weight: 700; margin-bottom: 3px; }
.cal-order-name { font-size: 13px; font-weight: 600; }
.cal-order-svc { font-size: 12px; color: var(--text3); margin-top: 2px; }

/* Admin messages */
.admin-msg-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  overflow: hidden;
  height: 560px;
}
.msg-list { border-right: 1px solid var(--line); overflow-y: auto; }
.msg-list-item {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: .2s var(--ease);
  display: flex;
  gap: 11px;
  align-items: flex-start;
}
.msg-list-item:hover { background: var(--surface-a); }
.msg-list-item.active { background: var(--orange-dim); border-left: 2px solid var(--orange); }
.msg-av {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--surface2);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--orange);
  flex-shrink: 0;
}
.msg-info { min-width: 0; flex: 1; }
.msg-name { font-size: 13px; font-weight: 700; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msg-preview { font-size: 12px; color: var(--text3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msg-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.msg-time { font-size: 10px; color: var(--text3); white-space: nowrap; }
.msg-unread-badge { width: 16px; height: 16px; background: var(--orange); border-radius: 50%; font-size: 9px; font-weight: 700; color: #fff; display: flex; align-items: center; justify-content: center; }

.msg-chat-area {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.msg-chat-header {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--bg2);
  flex-shrink: 0;
}
.msg-chat-name { font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 600; }
.msg-chat-phone { font-size: 12px; color: var(--text3); }
.msg-chat-actions { margin-left: auto; display: flex; gap: 8px; }
.msg-action-btn {
  padding: 6px 12px;
  border-radius: var(--ui-radius-sm,5px);
  font-size: 11px;
  font-weight: 600;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  color: var(--orange);
  cursor: pointer;
  transition: .2s var(--ease);
}
.msg-action-btn:hover { background: rgba(255,107,0,.2); }
.msg-chat-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.msg-chat-input-row {
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  display: flex;
  gap: 10px;
  align-items: flex-end;
  flex-shrink: 0;
}
.msg-chat-input {
  flex: 1;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 10px 14px;
  font-size: 13px;
  color: var(--text);
  outline: none;
  resize: none;
  font-family: 'Mulish', sans-serif;
  transition: .2s var(--ease);
  max-height: 100px;
}
.msg-chat-input:focus { border-color: var(--orange-brd); }
.msg-send-btn {
  padding: 10px 18px;
  background: var(--orange);
  color: #fff;
  border-radius: var(--ui-radius-sm,5px);
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  flex-shrink: 0;
  transition: .2s var(--ease);
}
.msg-send-btn:hover { background: var(--orange-l); }

/* Admin quick stats panel  */
.admin-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
.aqa-card {
  padding: 16px;
  border-radius: var(--ui-radius-sm,5px);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 12px;
  transition: .2s var(--ease);
}
.aqa-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.25); }
.aqa-ico { font-size: 20px; }
.aqa-t { font-weight: 700; font-size: 13px; }
.aqa-d { font-size: 11px; color: var(--text2); margin-top: 2px; }

/* Mobile admin */
@media(max-width:900px) {
  .admin-layout { flex-direction: column; }
  .admin-sidebar {
    width: 100%;
    height: auto;
    position: static;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 12px 0;
    border-right: none;
    border-bottom: 1px solid var(--line);
    scrollbar-width: none;
    gap: 0;
  }
  .admin-sidebar::-webkit-scrollbar { display: none; }
  .admin-nav-label { display: none; }
  .admin-nav-item {
    flex-direction: column;
    gap: 4px;
    padding: 8px 14px;
    border-left: none;
    border-bottom: 2px solid transparent;
    white-space: nowrap;
    font-size: 11px;
  }
  .admin-nav-item.active { border-bottom-color: var(--orange); border-left-color: transparent; }
  .admin-nav-badge { position: absolute; top: 4px; right: 6px; }
  .admin-content { padding: 20px 16px; }
  .admin-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .admin-calendar { grid-template-columns: 1fr; }
  .admin-msg-layout { grid-template-columns: 1fr; height: auto; }
  .msg-list { max-height: 200px; }
  .msg-chat-area { height: 400px; }
  .admin-quick-actions { grid-template-columns: 1fr 1fr; }
}
@media(max-width:560px) {
  .admin-stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .astat-num { font-size: 22px; }
  .booking-layout { grid-template-columns: 1fr; }
  .booking-summary { display: none; } /* скрыто — заменено кнопкой корзины */
  .bform-row { grid-template-columns: 1fr; }
  .date-grid { grid-template-columns: repeat(3, 1fr); }
  .time-grid { grid-template-columns: repeat(3, 1fr); }
  .admin-quick-actions { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════
   CONFIRM MODAL / GENERIC MODAL
══════════════════════════════════════ */
.cmodal-overlay {
  display: none;
  position: fixed; inset: 0;
  z-index: 8000;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  align-items: center; justify-content: center;
}
.cmodal-overlay.open { display: flex; }
.cmodal-box {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 28px 24px 24px;
  width: 92vw;
  max-width: 380px;
  box-shadow: 0 24px 64px rgba(0,0,0,.6);
  animation: modalIn .22s cubic-bezier(.16,1,.3,1);
}
@keyframes modalIn { from{transform:scale(.92) translateY(12px);opacity:0} to{transform:none;opacity:1} }
.cmodal-title { font-family:'Oswald',sans-serif; font-size:18px; font-weight:700; margin-bottom:8px; }
.cmodal-sub   { font-size:13px; color:var(--text2); line-height:1.5; margin-bottom:20px; }
.cmodal-actions { display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; }


/* ══════════════════════════════════════
   MODAL UI KIT / DETAIL SURFACES
══════════════════════════════════════ */
.cmodal-overlay,
.owiz-overlay,
.odet-overlay{
  background: radial-gradient(circle at top, rgba(255,107,0,.10), transparent 34%), rgba(6,10,16,.78);
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
}

.cmodal-box,
.cmodal-card{
  position: relative;
  background:
    linear-gradient(180deg, var(--surface-a), transparent),
    linear-gradient(180deg, rgba(255,107,0,.035), transparent 28%),
    var(--bg2);
  border: 1px solid var(--surface-b);
  box-shadow:
    0 28px 90px rgba(0,0,0,.46),
    0 12px 30px rgba(0,0,0,.28),
    inset 0 1px 0 var(--surface-b);
}
.cmodal-box::before,
.cmodal-card::before,
.owiz-box::before,
.odet-panel::before{
  content:"";
  position:absolute; inset:0; pointer-events:none;
  border-radius:inherit;
  box-shadow: inset 0 1px 0 var(--surface-a);
}
.cmodal-box{ border-radius:var(--ui-radius-lg,18px); padding:28px 24px 24px; max-width:420px; }
.cmodal-card{ width:min(92vw, 920px); border-radius:var(--ui-radius-lg,18px); overflow:hidden; animation: modalIn .22s cubic-bezier(.16,1,.3,1); }
.cmodal-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  padding:22px 24px 16px;
  border-bottom:1px solid var(--surface-b);
  background: linear-gradient(180deg, var(--surface-a), transparent);
}
.cmodal-head h3{
  margin:0; font-family:'Oswald',sans-serif; font-size:20px; line-height:1.2; letter-spacing:.3px;
}
.cmodal-body{ padding:20px 24px 24px; }
.cmodal-close{
  width:38px; height:38px; border-radius:var(--ui-radius-md,10px); flex:0 0 auto;
  border:1px solid var(--surface-b); background:var(--surface-a); color:var(--text2);
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s;
  box-shadow: inset 0 1px 0 var(--surface-a);
}
.cmodal-close:hover{ color:var(--text); border-color:rgba(255,107,0,.32); background:rgba(255,107,0,.10); transform:translateY(-1px); }
.cmodal-sub{ color:var(--text2); }
.cmodal-actions .btn{ min-height:42px; }

.modal-surface,
.detail-surface,
.schedule-surface{
  background: linear-gradient(180deg, var(--surface-a), transparent);
  border:1px solid var(--surface-b);
  border-radius:var(--ui-radius-lg,18px);
  box-shadow: inset 0 1px 0 var(--surface-a);
}

@media (max-width: 700px){
  .cmodal-box{ width:min(100vw - 20px, 440px); border-radius:var(--ui-radius-lg,18px); padding:22px var(--ui-radius-lg,18px) var(--ui-radius-lg,18px); }
  .cmodal-card{ width:min(100vw - 14px, 920px); border-radius:var(--ui-radius-lg,18px); }
  .cmodal-head{ padding:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 14px; }
  .cmodal-body{ padding:16px var(--ui-radius-lg,18px) var(--ui-radius-lg,18px); }
}

/* ══════════════════════════════════════
   GLOBAL TOAST
══════════════════════════════════════ */
/* ── Toast container ── */
#toast-container {
  position: fixed;
  bottom: calc(var(--bnav-h, 72px) + 12px + env(safe-area-inset-bottom, 0px));
  left: 50%;
  transform: translateX(-50%);
  z-index: 10100;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 8px;
  pointer-events: none;
  width: min(480px, calc(100vw - 32px));
}

/* ── Single toast item ── */
.g-toast {
  display: flex; align-items: center; gap: 10px;
  background: color-mix(in srgb, var(--bg2) 92%, #000 8%);
  border: 1px solid var(--line2, rgba(255,255,255,.1));
  border-radius: var(--ui-radius-md,10px);
  padding: 12px 16px;
  font-size: 13px; font-weight: 600;
  color: var(--text);
  box-shadow: 0 8px 40px rgba(0,0,0,.45), 0 2px 8px rgba(0,0,0,.25);
  pointer-events: auto;
  width: 100%;
  min-width: 200px;
  position: relative;
  overflow: hidden;
  opacity: 0;
  transform: translateY(16px) scale(.96);
  transition: opacity .22s cubic-bezier(.16,1,.3,1),
              transform .26s cubic-bezier(.16,1,.3,1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  cursor: pointer;
}
.g-toast.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.g-toast.hide {
  opacity: 0;
  transform: translateY(8px) scale(.95);
  transition: opacity .18s ease, transform .2s ease;
}

/* ── Toast icon ── */
.g-toast-ico {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800;
}

/* ── Toast text ── */
.g-toast-msg {
  flex: 1;
  line-height: 1.45;
  white-space: normal;
  word-break: break-word;
}

/* ── Optional action button ── */
.g-toast-action {
  flex-shrink: 0;
  font-size: 11px; font-weight: 800;
  color: var(--orange);
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 4px 8px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid rgba(255,107,0,.3);
  background: rgba(255,107,0,.08);
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s;
}
.g-toast-action:hover { background: rgba(255,107,0,.15); }

/* ── Close button ── */
.g-toast-close {
  flex-shrink: 0;
  width: 20px; height: 20px;
  opacity: .45;
  font-size: 11px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  transition: opacity .15s;
}
.g-toast-close:hover { opacity: .9; }

/* ── Progress bar ── */
.g-toast-bar {
  position: absolute; bottom: 0; left: 0;
  height: 2px;
  background: currentColor;
  opacity: .25;
  transform-origin: left;
  animation: toast-bar-shrink linear forwards;
}
@keyframes toast-bar-shrink {
  from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}

/* ── TYPE VARIANTS ── */
.g-toast.success {
  border-color: rgba(34,197,94,.25);
}
.g-toast.success .g-toast-ico {
  background: rgba(34,197,94,.15);
  color: #22c55e;
}
.g-toast.success .g-toast-bar { color: #22c55e; opacity: .3; }

.g-toast.error {
  border-color: rgba(239,68,68,.3);
  background: color-mix(in srgb, var(--bg2) 88%, rgba(239,68,68,.2) 12%);
}
.g-toast.error .g-toast-ico {
  background: rgba(239,68,68,.15);
  color: #ef4444;
}
.g-toast.error .g-toast-bar { color: #ef4444; opacity: .3; }

.g-toast.warn {
  border-color: rgba(245,158,11,.3);
}
.g-toast.warn .g-toast-ico {
  background: rgba(245,158,11,.15);
  color: #f59e0b;
}
.g-toast.warn .g-toast-bar { color: #f59e0b; opacity: .3; }

.g-toast.info {
  border-color: rgba(96,165,250,.25);
}
.g-toast.info .g-toast-ico {
  background: rgba(96,165,250,.12);
  color: #60a5fa;
}
.g-toast.info .g-toast-bar { color: #60a5fa; opacity: .3; }

/* ── Light theme ── */
[data-theme="light"] .g-toast {
  background: rgba(255,255,255,.95);
  border-color: rgba(0,0,0,.1);
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  color: #111;
}
[data-theme="light"] .g-toast.error {
  background: rgba(254,242,242,.97);
  border-color: rgba(239,68,68,.25);
}

/* ── Mobile ── */
@media (max-width: 640px) {
  #toast-container {
    bottom: calc(var(--bnav-h, 72px) + 10px + env(safe-area-inset-bottom, 0px));
    width: calc(100vw - 24px);
  }
  .g-toast { border-radius: var(--ui-radius-md,10px); padding: 11px 14px; font-size: 14px; }
}

/* ══════════════════════════════════════
   ORDER STATUS SELECT (inline)
══════════════════════════════════════ */
.order-status-sel {
  border-radius: 99px;
  padding: 3px 8px;
  font-size: 11px; font-weight: 700;
  cursor: pointer;
  border: 1px solid transparent;
}
.order-status-sel.new       { background:rgba(96,165,250,.15); color:#60a5fa; border-color:rgba(96,165,250,.3); }
.order-status-sel.process   { background:rgba(245,158,11,.12); color:#f59e0b; border-color:rgba(245,158,11,.3); }
.order-status-sel.done      { background:rgba(34,197,94,.12);  color:#22c55e; border-color:rgba(34,197,94,.3); }
.order-status-sel.cancelled { background:rgba(239,68,68,.1);   color:#ef4444; border-color:rgba(239,68,68,.25); }

/* ══════════════════════════════════════
   SCHED BUTTON — finish state
══════════════════════════════════════ */
.sched-btn.finish {
  background: rgba(245,158,11,.15);
  color: #f59e0b;
  border: 1px solid rgba(245,158,11,.3);
  font-size: 11px; font-weight: 700;
  border-radius: var(--ui-radius-sm,5px); padding: 6px 10px;
  cursor: pointer; transition: .2s;
}
.sched-btn.finish:hover { background: rgba(245,158,11,.25); }


/* PATCH 2026-03-11 — parts order modal */
.parts-order-modal-box .pof-fields{margin-top:12px;}
.parts-order-modal-box .pof-group{margin-bottom:12px;}
.parts-order-modal-box .pof-input{width:100%;}
.parts-order-modal-box .cmodal-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
@media (max-width:640px){
  .parts-order-modal-box{width:min(100vw - 24px,520px);padding:18px;border-radius:var(--ui-radius-lg,18px);}
  .parts-order-modal-box .cmodal-actions .btn{width:100%;}
}

.client-card-hero{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);background:linear-gradient(180deg, var(--surface-a), transparent);margin-bottom:14px}.client-card-ico,.car-card-ico{width:52px;height:52px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;font-size:24px;background:var(--surface-b);border:1px solid var(--line);flex-shrink:0}.client-card-title{font-family:'Oswald',sans-serif;font-size:18px;font-weight:700}.client-card-sub{font-size:13px;color:var(--text2);margin-top:3px}.cars-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.car-card{padding:16px;border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);background:var(--card)}.car-card.is-default{border-color:rgba(251,146,60,.35);box-shadow:0 0 0 1px rgba(251,146,60,.12) inset}.car-card-head{display:flex;align-items:flex-start;gap:12px}.car-card-main{min-width:0;flex:1}.car-card-title{font-weight:800;font-size:15px}.car-card-sub,.car-card-meta{font-size:12px;color:var(--text2);margin-top:4px;line-height:1.5}.car-default-chip{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:5px 8px;border-radius:999px;background:rgba(251,146,60,.14);color:var(--orange);border:1px solid rgba(251,146,60,.22)}.car-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.car-empty{padding:24px;text-align:center;border-style:dashed}.car-empty-ico{font-size:32px;margin-bottom:8px}.car-empty-t{font-weight:800;margin-bottom:6px}.car-empty-d{font-size:13px;color:var(--text2)}.vehicle-editor{padding:18px;border-radius:var(--ui-radius-lg,18px)}.vehicle-editor .profile-form{display:grid;gap:12px}@media (max-width:720px){.vehicle-editor .profile-form{grid-template-columns:1fr}.cars-grid{grid-template-columns:1fr}}


.booking-vehicles-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:8px}
.booking-vehicle-card{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:var(--card);border-radius:var(--ui-radius-md,10px);padding:12px 14px;text-align:left;cursor:pointer;color:inherit}
.booking-vehicle-card.selected{border-color:var(--orange);box-shadow:0 0 0 2px rgba(245,158,11,.12)}
.booking-vehicle-card .ico{width:34px;height:34px;border-radius:var(--ui-radius-md,10px);background:var(--bg2);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.booking-vehicle-card .main{display:flex;flex-direction:column;min-width:0;flex:1}
.booking-vehicle-card .title{font-weight:700;font-size:13px}
.booking-vehicle-card .sub{font-size:11px;color:var(--text3);white-space:normal}
.booking-vehicle-card .chip{font-size:10px;color:var(--orange);border:1px solid var(--orange-brd);background:var(--orange-dim);padding:4px 8px;border-radius:999px}
.garage-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.garage-stats>div{background:var(--bg2);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:10px 8px;text-align:center}
.garage-stats b{display:block;font-family:'Oswald',sans-serif;font-size:16px;color:var(--text)}
.garage-stats span{display:block;font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.8px}
.garage-km{font-family:'Oswald',sans-serif;font-size:14px;color:var(--orange);margin-left:auto;white-space:nowrap}
.garage-history-list{display:grid;gap:8px;margin-top:12px;width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden}
.garage-history-item{display:flex;align-items:center;gap:10px;width:100%;max-width:100%;min-width:0;box-sizing:border-box;background:var(--bg2);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:10px 12px;text-align:left;cursor:pointer;color:inherit;overflow:hidden}
.garage-history-item>*{min-width:0;box-sizing:border-box}
.garage-history-item .badge{font-size:10px;padding:4px 8px;border-radius:999px;background:var(--green-dim);border:1px solid rgba(16,185,129,.16);color:#10b981;flex:0 0 auto;max-width:92px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.garage-history-item .badge.parts{background:var(--orange-dim);border-color:var(--orange-brd);color:var(--orange)}
.garage-history-item .name{font-weight:600;font-size:12px;line-height:1.35;flex:1 1 auto;min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.garage-history-item .meta{font-size:11px;line-height:1.35;color:var(--text3);white-space:normal;overflow-wrap:anywhere;word-break:break-word;max-width:100%}
.garage-history-item .btn,.garage-history-item .act-btn{flex:0 0 auto;max-width:100%}
@media (max-width: 640px){
  .garage-history-list{gap:7px;overflow:visible}
  .garage-history-item{gap:8px;padding:9px 10px;border-radius:var(--ui-radius-md,10px);align-items:flex-start;flex-wrap:wrap}
  .garage-history-item .badge{max-width:84px;font-size:9.5px;padding:3px 7px}
  .garage-history-item .name{font-size:12px;flex-basis:calc(100% - 94px)}
  .garage-history-item .meta{font-size:10.5px;flex-basis:100%;width:100%}
}
@media (max-width: 380px){
  .garage-history-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 8px}
  .garage-history-item .meta{grid-column:1/-1}
}
.garage-empty-mini{font-size:12px;color:var(--text3);padding:10px 0}
.vehicle-detail-card{padding:18px}
.vehicle-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.vehicle-detail-grid>div{background:var(--bg2);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px}
.vehicle-detail-grid span{display:block;font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;margin-bottom:4px}
.vehicle-detail-grid b{font-family:'Oswald',sans-serif;font-size:16px}
.vehicle-maint-row,.vehicle-last-order .ttl,.vehicle-detail-card .ttl{font-size:12px;color:var(--text2);margin-top:10px}
@media (max-width: 720px){.garage-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.vehicle-detail-grid{grid-template-columns:1fr}}


/* === v9.4.60 unified card system === */
:root{
  --card-radius-sm:12px;
  --card-radius-md:18px;
  --card-radius-lg:22px;
  --card-border:var(--surface-b);
  --card-border-strong:var(--surface-c);
  --card-shadow-soft:0 10px 30px rgba(0,0,0,.18);
  --card-shadow-hover:0 18px 46px rgba(0,0,0,.28);
  --card-shadow-accent:0 0 0 1px rgba(255,107,0,.14) inset, 0 20px 50px rgba(255,107,0,.10);
}
.card,
.hv-card,
.st-card,
.team-card,
.rv-card,
.faq-item,
.part-card,
.parts-why-card,
.val-card,
.client-card-hero,
.car-card,
.vehicle-detail-card,
.master-card,
.schedule-card,
.notif-card{
  border-radius:var(--card-radius-md);
  border:1px solid var(--card-border);
  box-shadow:var(--card-shadow-soft);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
  background:linear-gradient(180deg, var(--surface-a), transparent);
  backdrop-filter:blur(10px);
}
.card:hover,
.hv-card:hover,
.st-card:hover,
.team-card:hover,
.rv-card:hover,
.faq-item:hover,
.part-card:hover,
.parts-why-card:hover,
.val-card:hover,
.car-card:hover{
  transform:translateY(-2px);
  border-color:var(--card-border-strong);
  box-shadow:var(--card-shadow-hover);
}
.card.is-selected,
.car-card.is-default,
.hv-card.is-active,
.st-card.is-active,
.vehicle-detail-card{
  border-color:rgba(255,107,0,.30);
  box-shadow:var(--card-shadow-accent);
}
.hero-visual{
  position:relative;
  padding:8px;
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  border:1px solid var(--surface-b);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.hero-visual::before{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,107,0,.12), transparent 30%, transparent 70%, var(--surface-a));
}
.hv-card{
  position:relative;
  overflow:hidden;
  min-height:88px;
}
.hv-card::after,
.st-card::after,
.car-card::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, var(--surface-a), transparent 35%, transparent 65%, var(--surface-a));
}
.client-card-hero,
.vehicle-detail-card{
  border-radius:var(--card-radius-lg);
}
.st-card,
.part-card,
.team-card,
.rv-card,
.faq-item,
.val-card{
  border-radius:var(--ui-radius-lg,18px);
}
.hero-stats,
.parts-hero-stats,
.mo-hero,
.cab-hero,
.owner-hero{
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  box-shadow:0 14px 40px rgba(0,0,0,.16);
}
.reveal{ will-change:transform, opacity; }
.reveal:not(.in){ opacity:0; transform:translateY(18px) scale(.985); }
.reveal.in{ opacity:1; transform:none; }
@media (max-width:720px){
  .card,
  .hv-card,
  .st-card,
  .team-card,
  .rv-card,
  .faq-item,
  .part-card,
  .parts-why-card,
  .val-card,
  .client-card-hero,
  .car-card,
  .vehicle-detail-card{ border-radius:var(--ui-radius-md,10px); }
  .hero-visual{ border-radius:var(--ui-radius-lg,18px); padding:6px; }
}


/* === v9.4.61 internal panels visual-system === */
.admin-pane,
.owner-pane,
.master-pane,
.admin-table-wrap,
.admin-msg-layout,
.owner-block,
.a-stat-card,
.astat-card,
.cal-day-orders,
.msg-chat-area,
.msg-list,
.msg-composer,
.price-view,
.admin-quick-actions .aqa-card,
.aqa-card{
  border-radius:var(--ui-radius-lg,18px);
}

.admin-pane{
  padding:18px;
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 18px 48px rgba(0,0,0,.18);
}
.admin-pane.active{ display:block; }
.admin-page-title{
  font-size:26px;
  letter-spacing:.2px;
  margin-bottom:18px;
}
.admin-page-title + div[style*="display:flex"],
.admin-pane > div[style*="display:flex"]:has(.admin-page-title){
  padding:2px 0 14px;
}
.admin-stats-grid{ gap:16px; }
.astat-card{
  padding:20px 22px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 14px 38px rgba(0,0,0,.18);
  position:relative;
  overflow:hidden;
}
.astat-card::after,
.owner-block::after,
.admin-table-wrap::after,
.admin-msg-layout::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, var(--surface-a), transparent 35%, transparent 70%, var(--surface-a));
}
.astat-num{ font-size:30px; }
.astat-label{ color:var(--text2); }
.admin-filters{ gap:10px; margin-bottom:18px; }
.admin-filter-btn{
  min-height:40px;
  padding:9px 16px;
  border-radius:999px;
  background:var(--surface-a);
  border-color:var(--surface-b);
  box-shadow:inset 0 1px 0 var(--surface-a);
}
.admin-search{
  height:42px;
  border-radius:var(--ui-radius-md,10px);
  min-width:220px;
  background:var(--surface-a);
  border-color:var(--surface-b);
}
.admin-table-wrap{
  position:relative;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.admin-table thead{ background:var(--surface-a); }
.admin-table th{ color:var(--text2); }
.admin-table td{ border-top:1px solid var(--surface-b); }
.admin-table tbody tr{ transition:background .18s ease, transform .18s ease; }
.admin-table tbody tr:hover td{ background:var(--surface-a); }

.admin-msg-layout{
  position:relative;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 18px 50px rgba(0,0,0,.2);
}
.msg-list-item{ transition:background .18s ease, border-color .18s ease, transform .18s ease; }
.msg-list-item:hover{ background:var(--surface-a); }
.msg-list-item.active{ background:rgba(255,107,0,.10); border-left:2px solid var(--orange); }

.admin-calendar{ gap:22px; }
.cal-grid-wrap, .cal-day-orders{
  position:relative;
  padding:18px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 18px 48px rgba(0,0,0,.18);
}
.cal-grid{ gap:8px; }
.cal-cell{
  border-radius:var(--ui-radius-md,10px);
  border:1px solid var(--surface-b);
  background:var(--surface-a);
  box-shadow:inset 0 1px 0 var(--surface-a);
}
.cal-cell:hover{ border-color:var(--surface-c); box-shadow:0 10px 24px rgba(0,0,0,.16); }
.cal-order-item{
  border-radius:var(--ui-radius-md,10px);
  border:1px solid var(--surface-b);
  background:var(--surface-a);
  box-shadow:0 10px 24px rgba(0,0,0,.14);
}

.owner-block{
  position:relative;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b)!important;
  background:linear-gradient(180deg, var(--surface-a), transparent)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.18)!important;
}
.owner-block-elevated{
  box-shadow:0 24px 60px rgba(0,0,0,.22)!important;
}
.owner-block-title{ font-size:15px; letter-spacing:.3px; }
.owner-hero{
  border:1px solid var(--surface-b);
  box-shadow:0 24px 64px rgba(0,0,0,.22);
}
.owner-tab{
  min-height:44px;
  padding:0 16px;
  border-bottom-width:2px;
}
.owner-tab.active{ box-shadow:inset 0 -1px 0 rgba(255,107,0,.25); }

.admin-master-grid{ gap:14px; }
.admin-master-card{
  position:relative;
  min-height:168px;
  padding:18px;
  border-radius:var(--ui-radius-lg,18px);
}
.admin-master-card .car-title{ font-size:16px; font-weight:800; }
.admin-master-card .car-sub{ color:var(--text2); }
.admin-master-card-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.master-card, .schedule-card{
  padding:18px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:linear-gradient(180deg, var(--surface-a), transparent);
  box-shadow:0 18px 46px rgba(0,0,0,.18);
}

.price-view{
  position:relative;
  padding:14px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--surface-b);
  background:var(--surface-a);
  box-shadow:0 10px 24px rgba(0,0,0,.14);
}

@media (max-width:900px){
  .admin-pane{ padding:14px; }
  .admin-page-title{ font-size:22px; }
  .admin-table-wrap, .admin-msg-layout, .owner-block, .cal-grid-wrap, .cal-day-orders{ border-radius:var(--ui-radius-lg,18px); }
}
@media (max-width:560px){
  .admin-pane{ padding:12px; }
  .admin-search{ width:100%; min-width:0; margin-left:0; }
  .admin-filters{ flex-direction:column; align-items:stretch; }
  .admin-filter-btn{ width:100%; justify-content:center; }
  .admin-master-card{ min-height:auto; }
}

/* ══════════════════════════════════════════
   QUICK SEARCH OVERLAY
══════════════════════════════════════════ */
.qs-item:hover {
  background: var(--orange-dim, rgba(255,107,0,.12)) !important;
}

/* ══════════════════════════════════════════
   MASTER NAV TABS — IMPROVED
══════════════════════════════════════════ */
.cab-tab {
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
  font-weight: 600;
  letter-spacing: .2px;
}
.cab-tab.active {
  color: var(--orange) !important;
  border-bottom-color: var(--orange) !important;
}
.cab-tab:hover:not(.active) {
  color: var(--text2);
}

/* ══════════════════════════════════════════
   OWNER ANALYTICS CARDS
══════════════════════════════════════════ */
.analytics-kpi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}

/* ══════════════════════════════════════════
   MASTER STATS GRID
══════════════════════════════════════════ */
.master-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}

/* ══════════════════════════════════════════
   MO-STATS IMPROVEMENT
══════════════════════════════════════════ */
.mo-stats {
  grid-template-columns: repeat(4, 1fr) !important;
}
@media (max-width: 480px) {
  .mo-stats { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ══════════════════════════════════════════
   ADMIN SIDEBAR SEARCH BTN
══════════════════════════════════════════ */
.admin-sidebar kbd {
  font-family: monospace;
  opacity: .6;
  transition: opacity .2s;
}
.admin-sidebar button:hover kbd { opacity: 1; }

/* ══════════════════════════════════════════
   OWNER TABS SCROLLABLE
══════════════════════════════════════════ */
.owner-tabs {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.owner-tabs::-webkit-scrollbar { display: none; }
.owner-tab {
  white-space: nowrap;
  flex-shrink: 0;
}

/* ══════════════════════════════════════════
   REVIEWS STARS ANIMATION
══════════════════════════════════════════ */
@keyframes starPop {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.3); }
  100% { transform: scale(1); }
}

/* ══════════════════════════════════════════
   BAR CHART HOVER
══════════════════════════════════════════ */
.bar-fill { transition: width .5s cubic-bezier(.4,0,.2,1); }

/* ══════════════════════════════════════════
   WEEK CELL HOVER
══════════════════════════════════════════ */
.week-cell { cursor: pointer; transition: box-shadow .15s, transform .15s; }
.week-cell:hover { transform: translateY(-2px); }

/* ══════════════════════════════════════════
   CMODAL CARD HOVER LIFT
══════════════════════════════════════════ */
.master-schedule-shell {
  transition: box-shadow .2s;
}
.master-schedule-shell:hover {
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
}

/* ══════════════════════════════════════════
   ADMIN MASTERS LIST SEARCH HIGHLIGHT
══════════════════════════════════════════ */
#admin-masters-list .cmodal-card {
  transition: opacity .2s, transform .2s;
}
#admin-masters-list .cmodal-card[style*="display: none"] {
  opacity: 0;
  transform: scale(.97);
}

/* ══════════════════════════════════════════
   CLIENT ORDER DETAIL MODAL
══════════════════════════════════════════ */
#client-order-modal.cmodal-overlay {
  z-index: 8000;
}
#client-order-modal .cmodal-box {
  animation: slideUpFade .28s cubic-bezier(.22,1,.36,1);
}
@keyframes slideUpFade {
  from { opacity:0; transform:translateY(28px) scale(.97); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}

/* Clickable mo-card */
.mo-card {
  transition: box-shadow .15s, transform .12s;
}
.mo-card:hover {
  box-shadow: 0 0 0 2px var(--orange), 0 8px 24px rgba(0,0,0,.15);
  transform: translateY(-1px);
}
.mo-card:active {
  transform: translateY(0);
  box-shadow: 0 0 0 2px var(--orange);
}

/* Photo lightbox */
#photo-viewer-overlay {
  animation: fadeIn .18s ease;
}
#photo-viewer-overlay img {
  animation: scaleIn .22s cubic-bezier(.22,1,.36,1);
}
@keyframes scaleIn {
  from { opacity:0; transform:scale(.88); }
  to   { opacity:1; transform:scale(1); }
}

/* Report form in Detail panel */
#odet-report-form-section textarea {
  transition: border-color .2s;
}
#odet-report-form-section textarea:focus {
  outline: none;
  border-color: var(--orange) !important;
}



.car-card{cursor:pointer}
.car-card-media{margin:-16px -16px 12px}
.car-card-photo-wrap{height:172px;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-md,10px) var(--ui-radius-md,10px);overflow:hidden;background:var(--bg2);border-bottom:1px solid var(--line)}
.car-card-photo{width:100%;height:172px;object-fit:cover;display:block}
.car-card-photo--placeholder{height:172px;display:flex;align-items:center;justify-content:center;font-size:48px;background:linear-gradient(180deg, var(--surface-a), transparent);border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-md,10px) var(--ui-radius-md,10px);border-bottom:1px solid var(--line)}
.vehicle-quick-create-note{font-size:13px;color:var(--text2);margin-bottom:14px}
.vehicle-quick-create-grid{display:grid;grid-template-columns:148px 1fr;gap:14px;align-items:start}
.vehicle-quick-photo-box{display:flex;align-items:flex-start;justify-content:center}
.vehicle-quick-photo-label{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;cursor:pointer}
.vehicle-quick-photo-preview{width:132px;height:132px;border-radius:var(--ui-radius-lg,18px);border:1px dashed var(--line);background:var(--bg2);display:flex;align-items:center;justify-content:center;font-size:42px;overflow:hidden}
.vehicle-quick-photo-preview.has-image{padding:0;border-style:solid}
.vehicle-quick-photo-preview img{width:100%;height:100%;object-fit:cover;display:block}
.vehicle-quick-photo-text{font-size:12px;color:var(--text3)}
.vehicle-detail-photo-wrap{margin:-18px -18px 14px;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-md,10px) var(--ui-radius-md,10px);overflow:hidden;background:var(--bg2);border-bottom:1px solid var(--line)}
.vehicle-detail-photo{width:100%;height:220px;object-fit:cover;display:block}
@media (max-width:720px){.vehicle-quick-create-grid{grid-template-columns:1fr}.vehicle-quick-photo-box{justify-content:flex-start}.car-card-photo-wrap,.car-card-photo,.car-card-photo--placeholder{height:148px}.vehicle-detail-photo{height:180px}}

.vehicle-editor-sections{display:grid;gap:14px}
.vehicle-editor-section{border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:14px;background:var(--bg2)}
.vehicle-editor-section-title{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;margin-bottom:12px}
.vehicle-fill-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:var(--ui-radius-md,10px);border:1px solid var(--line);background:var(--bg2);margin-top:14px}
.vehicle-fill-card.good{border-color:rgba(16,185,129,.25)}
.vehicle-fill-card.mid{border-color:rgba(245,158,11,.25)}
.vehicle-fill-card.low{border-color:rgba(239,68,68,.22)}
.vehicle-fill-title{font-weight:800}
.vehicle-fill-sub{font-size:12px;color:var(--text3);margin-top:4px}
.vehicle-fill-value{font-family:'Oswald',sans-serif;font-size:28px;color:var(--orange);white-space:nowrap}
.vehicle-fill-bar{height:8px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);overflow:hidden;margin:10px 0 4px}
.vehicle-fill-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#f59e0b,#f97316)}
.vehicle-detail-section{margin-top:16px}
.vehicle-detail-section-title{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;margin-bottom:10px}
.vehicle-note-box{margin-top:10px;padding:12px 14px;border-radius:var(--ui-radius-md,10px);background:var(--bg2);border:1px solid var(--line)}
.vehicle-note-box span{display:block;font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px}
.vehicle-note-box b{display:block;font-size:13px;line-height:1.5;font-weight:600}


/* Services unified page */
.services-hero-shell { position: relative; overflow: hidden; }
.services-hero-content { position: relative; z-index: 1; }
.service-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
}
.service-toolbar-chips { flex: 1 1 640px; }
.service-pricing-trigger { min-height: 44px; white-space: nowrap; }
.services-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
  margin-top: 22px;
}
.services-overview-card { padding: 20px; }
.services-overview-kicker {
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 10px;
}
.services-overview-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 8px;
}
.services-overview-text { color: var(--text2); line-height: 1.7; }
.services-featured-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}
.services-featured-card { padding: 20px; display: grid; gap: 14px; }
.services-featured-top { display: flex; gap: 12px; align-items: center; }
.services-featured-name { font-size: 18px; font-weight: 800; color: var(--text); }
.services-featured-meta { font-size: 13px; color: var(--text3); margin-top: 4px; }
.services-featured-desc { color: var(--text2); line-height: 1.7; min-height: 48px; }
.services-featured-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.services-featured-price { font-size: 16px; font-weight: 800; color: var(--orange); }
.services-grid--unified {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
}
.services-inline-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.services-inline-tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--bg2);
  border: 1px solid var(--line);
  color: var(--text2);
  font-size: 12px;
  font-weight: 600;
}
@media (max-width: 1100px){
  .services-overview-grid,
  .services-featured-grid,
  .services-grid--unified { grid-template-columns: 1fr; }
}
@media (max-width: 760px){
  .service-toolbar { align-items: stretch; }
  .service-pricing-trigger { width: 100%; justify-content: center; }
  .services-overview-card,
  .services-featured-card { padding: 16px; }
  .services-featured-foot { flex-direction: column; align-items: stretch; }
  .services-featured-foot .btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════
   УЛУЧШЕННЫЕ СТРАНИЦЫ: УСЛУГИ / ЗАПЧАСТИ / О НАС  v9.4.72
   ═══════════════════════════════════════════════════════════ */

/* ── HERO universal upgrade ─────────────────────────────── */
.page-hero-v2 {
  position: relative;
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 60px 0 52px;
  overflow: hidden;
}
.page-hero-v2-bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 90% at 92% 50%, rgba(255,107,0,.07) 0%, transparent 60%),
    radial-gradient(ellipse 30% 60% at 10% 80%, rgba(255,107,0,.04) 0%, transparent 55%),
    repeating-linear-gradient(-45deg, transparent 0, transparent 28px, rgba(255,107,0,.018) 28px, rgba(255,107,0,.018) 29px);
}
.page-hero-v2-label {
  font-size: 11px; font-weight: 700; letter-spacing: 4px;
  text-transform: uppercase; color: var(--orange); margin-bottom: 14px;
}
.page-hero-v2-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(34px, 5vw, 62px);
  font-weight: 700; line-height: 1.05;
  margin-bottom: 12px;
}
.page-hero-v2-sub {
  font-size: 15px; color: var(--text2);
  max-width: 560px; line-height: 1.8; margin-bottom: 28px;
}
.page-hero-v2-statsrow {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 18px 24px;
  max-width: 620px;
  margin-bottom: 28px;
}
.hero-stat { flex: 1; min-width: 90px; text-align: center; }
.hero-stat-num {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700; line-height: 1; color: var(--orange);
}
.hero-stat-lbl { font-size: 10px; color: var(--text3); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-top: 5px; }
.hero-stat-sep { width: 1px; height: 40px; background: var(--line); flex-shrink: 0; }

/* ── SERVICES PAGE v2 ────────────────────────────────────── */
.svc-filter-bar {
  display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap; margin-top: 6px;
}
.svc-chip-v2 {
  display: flex; align-items: center; gap: 7px;
  padding: 9px 16px; border-radius: var(--ui-radius-md,10px);
  background: var(--surface); border: 1.5px solid var(--line);
  font-size: 13px; font-weight: 600; color: var(--text2);
  cursor: pointer; transition: .18s var(--ease);
  white-space: nowrap;
}
.svc-chip-v2:hover { border-color: var(--orange-brd); color: var(--text); }
.svc-chip-v2.active, .svc-chip-v2.selected {
  background: var(--orange-dim); border-color: var(--orange-brd);
  color: var(--orange);
}
.svc-chip-v2 .chip-cnt {
  background: var(--surface2); color: var(--text3);
  font-size: 10px; font-weight: 700; border-radius: 99px;
  padding: 2px 7px; min-width: 20px; text-align: center;
}
.svc-chip-v2.active .chip-cnt, .svc-chip-v2.selected .chip-cnt {
  background: var(--orange); color: #fff;
}

.svc-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 18px;
}
@media(max-width: 720px) { .svc-cards-grid { grid-template-columns: 1fr; } }

.svc-card-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 22px 22px 18px;
  display: flex; flex-direction: column; gap: 0;
  transition: .2s var(--ease);
}
.svc-card-v2:hover { border-color: var(--orange-brd); transform: translateY(-3px); box-shadow: 0 14px 36px rgba(0,0,0,.35); }

.svc-card-v2-head {
  display: flex; align-items: flex-start; gap: 14px;
  margin-bottom: 12px;
}
.svc-card-v2-ico {
  width: 52px; height: 52px; border-radius: var(--ui-radius-md,10px);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; flex-shrink: 0;
}
.svc-card-v2-info { flex: 1; min-width: 0; }
.svc-card-v2-name {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 600; line-height: 1.15;
  margin-bottom: 5px;
}
.svc-card-v2-cat {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--orange);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-sm,5px); padding: 3px 8px;
}
.svc-card-v2-price {
  font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 700;
  color: var(--orange); white-space: nowrap; margin-top: 4px;
}
.svc-card-v2-time { font-size: 11px; color: var(--text3); margin-top: 2px; }

.svc-card-v2-desc {
  font-size: 13px; color: var(--text2); line-height: 1.65;
  margin-bottom: 12px; border-bottom: 1px solid var(--line); padding-bottom: 14px;
}
.svc-card-v2-body {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
  margin-bottom: 16px;
}
@media(max-width: 480px) { .svc-card-v2-body { grid-template-columns: 1fr; } }

.svc-col-title {
  font-size: 10px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--text3); margin-bottom: 8px;
}
.svc-steps-v2 { list-style: none; display: flex; flex-direction: column; gap: 5px; }
.svc-steps-v2 li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 12px; color: var(--text2); line-height: 1.4;
}
.svc-step-n {
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--surface2); border: 1px solid var(--line);
  font-size: 10px; font-weight: 700; color: var(--orange);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 1px;
}
.svc-checklist-v2 { list-style: none; display: flex; flex-direction: column; gap: 5px; }
.svc-checklist-v2 li {
  display: flex; align-items: flex-start; gap: 7px;
  font-size: 12px; color: var(--text2); line-height: 1.4;
}
.svc-check-v2 {
  color: var(--green); font-weight: 700; font-size: 12px;
  flex-shrink: 0; margin-top: 1px;
}
.svc-card-v2-why {
  font-size: 12px; color: var(--text3); line-height: 1.55;
  background: var(--bg2); border-radius: var(--ui-radius-sm,5px); padding: 9px 12px;
  margin-bottom: 12px; border-left: 3px solid var(--orange-brd);
}
.svc-card-v2-foot {
  display: flex; gap: 8px; flex-wrap: wrap;
  border-top: 1px solid var(--line); padding-top: 14px;
}
.svc-card-v2-foot .btn { flex: 1; justify-content: center; font-size: 13px; }

/* ── PARTS PAGE v2 ───────────────────────────────────────── */
.parts-v2-layout {
  display: grid;
  grid-template-columns: 1fr 310px;
  gap: 24px; padding-top: 28px; align-items: start;
}
@media(max-width: 960px) {
  .parts-v2-layout { grid-template-columns: 1fr; }
  .parts-v2-sidebar { order: -1; }
}
.parts-search-v2 {
  position: relative; display: flex; align-items: center;
  margin-bottom: 12px;
}
.parts-search-v2 .psi { position: absolute; left: 14px; color: var(--text3); font-size: 16px; pointer-events: none; }
.parts-search-v2 input {
  width: 100%; background: var(--surface);
  border: 1.5px solid var(--line); border-radius: var(--ui-radius-md,10px);
  padding: 13px 44px 13px 44px; font-size: 14px; color: var(--text);
  font-family: 'Mulish', sans-serif; outline: none;
  transition: .2s var(--ease);
}
.parts-search-v2 input:focus { border-color: var(--orange-brd); }
.parts-search-v2 .psc {
  position: absolute; right: 12px; background: none; border: none;
  color: var(--text3); font-size: 18px; cursor: pointer; padding: 4px;
}
.parts-cats-v2 {
  display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px;
}
.parts-cat-v2 {
  padding: 8px 14px; border-radius: var(--ui-radius-md,10px);
  background: var(--surface); border: 1.5px solid var(--line);
  font-size: 12px; font-weight: 600; color: var(--text2);
  cursor: pointer; transition: .18s var(--ease);
}
.parts-cat-v2:hover { border-color: var(--orange-brd); color: var(--text); }
.parts-cat-v2.active { background: var(--orange-dim); border-color: var(--orange-brd); color: var(--orange); }

.parts-grid-v2 {
  display: flex;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
  justify-content: space-evenly;
  align-content: center;
  align-items: start;
  justify-items: start;
  flex-wrap: wrap;
  flex-direction: row;
}
@media(max-width: 520px) { .parts-grid-v2 { grid-template-columns: 1fr 1fr; } }
@media(max-width: 360px) { .parts-grid-v2 { grid-template-columns: 1fr; } }

.part-card-v2 {
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 14px;
  display: flex;
  width: min(100%, 320px);
  min-width: 260px;
  gap: 10px;
  transition: .2s var(--ease);
  flex-wrap: nowrap;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
  flex-direction: column;
  overflow: hidden;
}
.part-card-v2:hover { border-color: var(--orange-brd); transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,.3); }
.part-card-v2-media-wrap {
  position: relative;
  border-radius: var(--ui-radius-md,10px);
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, var(--surface-a), var(--surface-a));
  border: 1px solid var(--surface-b);
}
.part-card-v2-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.part-card-v2-cat {
  position: absolute;
  left: 10px;
  bottom: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.72);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  backdrop-filter: blur(6px);
}
.part-card-v2-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.part-card-v2-name { font-weight: 700; font-size: 15px; line-height: 1.35; }
.part-stock-badge {
  font-size: 10px; font-weight: 700; border-radius: var(--ui-radius-sm,5px); padding: 3px 8px;
  white-space: nowrap; flex-shrink: 0;
}
.part-stock-badge.in { background: rgba(34,197,94,.15); color: var(--green); border: 1px solid rgba(34,197,94,.3); }
.part-stock-badge.order { background: rgba(245,158,11,.12); color: #f59e0b; border: 1px solid rgba(245,158,11,.3); }
.part-sku-v2 { font-size: 11px; color: var(--text3); }
.part-price-v2 {
  font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700; color: var(--orange);
}
.part-note-v2 { font-size: 11px; color: var(--text3); line-height: 1.4; }
.part-shop-v2 {
  font-size: 11px; color: var(--text3);
  display: flex; align-items: center; gap: 5px;
}
.part-card-v2-actions { margin-top: auto; display: flex; gap: 6px; }
.part-card-v2-actions--stacked { align-items: stretch; }
.part-card-v2-actions .btn { flex: 1; justify-content: center; font-size: 12px; padding: 9px 10px; }
.part-rating-btn { flex: 0 0 48px; max-width: 48px; }

.part-details-layout {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(320px, 1.05fr);
  gap: 18px;
  align-items: start;
}
.part-details-media-wrap {
  background: linear-gradient(135deg, var(--surface-a), var(--surface-a));
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  overflow: hidden;
}
.part-details-media {
  width: 100%;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.part-details-main { display:flex; flex-direction:column; gap:14px; }
.part-details-topline { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; flex-wrap:wrap; }
.part-details-chip {
  display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:999px;
  background:rgba(251,146,60,.12); border:1px solid rgba(251,146,60,.22); color:var(--orange); font-size:12px; font-weight:700;
}
.part-details-price { font-family:'Oswald', sans-serif; font-size:32px; line-height:1; color:var(--orange); }
.part-details-meta-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.part-details-meta-card {
  border:1px solid var(--line); border-radius:var(--ui-radius-md,10px); padding:12px 14px; background:var(--bg2);
  display:flex; flex-direction:column; gap:6px;
}
.part-details-meta-card span { font-size:11px; color:var(--text3); text-transform:uppercase; letter-spacing:.04em; }
.part-details-meta-card strong { font-size:14px; color:var(--text); line-height:1.35; }
.part-details-rating { font-size:13px; color:var(--text2); }
.part-details-section { border-top:1px solid var(--line); padding-top:12px; }
.part-details-section-title { font-size:12px; font-weight:700; color:var(--text3); text-transform:uppercase; letter-spacing:.04em; margin-bottom:8px; }
.part-details-text { font-size:14px; line-height:1.6; color:var(--text); }
.part-details-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:4px; }
.part-details-actions .btn { min-width:160px; }
@media (max-width: 860px) {
  .part-details-layout { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .part-card-v2 { width: 100%; min-width: 0; }
  .part-details-meta-grid { grid-template-columns: 1fr; }
  .part-details-actions .btn { width: 100%; }
}

/* sidebar */
.parts-v2-sidebar-card {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 20px; margin-bottom: 14px;
}
.parts-v2-sidebar-title {
  font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 700;
  margin-bottom: 4px;
}
.parts-v2-sidebar-sub { font-size: 12px; color: var(--text2); line-height: 1.55; margin-bottom: 14px; }
.parts-why-row-v2 {
  display: flex; align-items: flex-start; gap: 12px;
  margin-bottom: 12px;
}
.parts-why-ico-v2 {
  width: 36px; height: 36px; border-radius: var(--ui-radius-md,10px);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; flex-shrink: 0;
}
.parts-why-t-v2 { font-weight: 700; font-size: 13px; }
.parts-why-s-v2 { font-size: 12px; color: var(--text2); margin-top: 2px; }

/* parts empty */
.parts-empty-v2 {
  display: none; flex-direction: column; align-items: center;
  justify-content: center; padding: 40px 20px; text-align: center;
  grid-column: 1/-1;
}
.parts-empty-v2-ico { font-size: 40px; margin-bottom: 10px; }
.parts-empty-v2-t { font-weight: 700; font-size: 16px; margin-bottom: 6px; }
.parts-empty-v2-d { font-size: 13px; color: var(--text3); }

/* ── ABOUT PAGE v2 ───────────────────────────────────────── */
.about-nav-v2 {
  display: flex; gap: 4px; flex-wrap: wrap; margin-top: 24px;
}
.about-nav-btn {
  padding: 9px 18px; border-radius: var(--ui-radius-md,10px);
  background: var(--surface); border: 1.5px solid var(--line);
  font-size: 13px; font-weight: 600; color: var(--text2);
  cursor: pointer; transition: .18s var(--ease);
}
.about-nav-btn:hover { border-color: var(--orange-brd); color: var(--text); }
.about-nav-btn.active, .about-nav-btn.selected {
  background: var(--orange-dim); border-color: var(--orange-brd); color: var(--orange);
}

/* overview */
.about-grid-v2 {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 36px;
  align-items: start;
}
@media(max-width: 860px) { .about-grid-v2 { grid-template-columns: 1fr; } }

.about-facts-v2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.about-fact-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 18px 16px; text-align: center;
  transition: .2s var(--ease);
}
.about-fact-v2:hover { border-color: var(--orange-brd); }
.about-fact-v2-num {
  font-family: 'Oswald', sans-serif; font-size: 30px; font-weight: 700;
  color: var(--orange); line-height: 1;
}
.about-fact-v2-lbl { font-size: 12px; color: var(--text2); margin-top: 6px; line-height: 1.3; }

/* values */
.vals-v2 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
@media(max-width: 860px) { .vals-v2 { grid-template-columns: 1fr 1fr; } }
@media(max-width: 520px) { .vals-v2 { grid-template-columns: 1fr; } }

.val-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 22px 20px;
  display: flex; flex-direction: column; gap: 10px;
  transition: .2s var(--ease);
}
.val-v2:hover { border-color: var(--orange-brd); transform: translateY(-2px); }
.val-v2-ico { font-size: 28px; }
.val-v2-t { font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 600; }
.val-v2-d { font-size: 13px; color: var(--text2); line-height: 1.6; }

/* team */
.team-v2 {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px;
}
.team-card-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 24px 18px;
  display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: 10px; transition: .2s var(--ease);
}
.team-card-v2:hover { border-color: var(--orange-brd); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,.3); }
.team-av-v2 {
  width: 62px; height: 62px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700;
  border: 2px solid; flex-shrink: 0;
}
.team-name-v2 { font-weight: 700; font-size: 15px; line-height: 1.2; }
.team-role-v2 { font-size: 12px; color: var(--text2); line-height: 1.4; }
.team-exp-v2 { font-size: 11px; color: var(--text3); }
.team-vacancy-v2 {
  border-style: dashed !important;
  justify-content: center; gap: 8px; padding: 28px 18px;
}
.team-vacancy-v2 .vac-plus { font-size: 32px; opacity: .25; }
.team-vacancy-v2 .vac-t { font-size: 13px; font-weight: 700; color: var(--text2); }
.team-vacancy-v2 .vac-d { font-size: 11px; color: var(--text3); }

/* reviews */
.rv-grid-v2 {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px;
  margin-bottom: 24px;
}
.rv-card-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 20px;
  display: flex; flex-direction: column; gap: 10px;
  transition: .2s var(--ease);
}
.rv-card-v2:hover { border-color: var(--orange-brd); }
.rv-q-v2 {
  font-family: 'Oswald', sans-serif; font-size: 42px; font-weight: 700;
  color: var(--orange); line-height: 1; opacity: .35; margin-bottom: -6px;
}
.rv-stars-v2 { color: var(--orange); font-size: 14px; letter-spacing: 2px; }
.rv-text-v2 { font-size: 13px; color: var(--text2); line-height: 1.7; flex: 1; }
.rv-author-v2 { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--line); padding-top: 12px; }
.rv-av-v2 {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  color: var(--orange); font-weight: 700; font-size: 14px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.rv-name-v2 { font-weight: 700; font-size: 13px; }
.rv-date-v2 { font-size: 11px; color: var(--text3); margin-top: 2px; }
.rv-score-bar {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 20px 22px;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  margin-bottom: 20px;
}
.rv-score-big {
  font-family: 'Oswald', sans-serif; font-size: 56px; font-weight: 700;
  color: var(--orange); line-height: 1; flex-shrink: 0;
}
.rv-score-stars { color: var(--orange); font-size: 20px; letter-spacing: 3px; }
.rv-score-count { font-size: 12px; color: var(--text3); margin-top: 4px; }
.rv-score-actions { margin-left: auto; display: flex; gap: 10px; flex-wrap: wrap; }

/* contacts v2 */
.ct-v2-grid {
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 24px; align-items: start;
}
@media(max-width: 860px) { .ct-v2-grid { grid-template-columns: 1fr; } }

.ci-v2-card {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 16px 18px;
  display: flex; align-items: flex-start; gap: 14px;
  transition: .2s var(--ease); margin-bottom: 10px;
}
.ci-v2-card:hover { border-color: var(--orange-brd); }
.ci-v2-ico {
  width: 40px; height: 40px; border-radius: var(--ui-radius-md,10px);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.ci-v2-lbl { font-size: 10px; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; font-weight: 700; margin-bottom: 3px; }
.ci-v2-val { font-size: 14px; font-weight: 600; }
.ci-v2-val a { color: var(--text); text-decoration: none; }
.ci-v2-val a:hover { color: var(--orange); }
.ci-v2-hint { font-size: 11px; color: var(--text3); margin-top: 3px; line-height: 1.4; }

.ct-hours-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 16px 18px; margin-bottom: 14px;
}
.ct-hours-title { font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--text3); margin-bottom: 10px; }
.hr-row-v2 {
  display: flex; justify-content: space-between;
  font-size: 13px; padding: 5px 0; border-bottom: 1px solid var(--line);
}
.hr-row-v2:last-child { border-bottom: none; }
.hr-row-v2.today { color: var(--orange); font-weight: 700; }
.hr-row-v2 .off { color: var(--text3); }

.ct-map-v2 {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); overflow: hidden;
  min-height: 300px; position: relative;
}
.ct-map-placeholder {
  min-height: 300px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px;
  text-align: center; padding: 24px;
}
.ct-open-badge-v2 {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; margin-bottom: 16px;
}
.ct-open-dot-v2 {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  animation: pulseGreen 2s infinite;
}
@keyframes pulseGreen { 0%,100%{opacity:1} 50%{opacity:.4} }

/* FAQ accordion v2 */
.faq-v2-list { display: flex; flex-direction: column; gap: 8px; }
.faq-v2-item {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); overflow: hidden; cursor: pointer;
  transition: border-color .18s var(--ease);
}
.faq-v2-item:hover, .faq-v2-item.open { border-color: var(--orange-brd); }
.faq-v2-q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 14px; padding: 16px 18px; font-weight: 600; font-size: 14px;
  user-select: none;
}
.faq-v2-arr {
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--surface2); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: var(--orange); flex-shrink: 0;
  transition: transform .25s var(--ease);
}
.faq-v2-item.open .faq-v2-arr { transform: rotate(180deg); }
.faq-v2-a {
  max-height: 0; overflow: hidden;
  font-size: 13px; color: var(--text2); line-height: 1.7;
  transition: max-height .3s var(--ease), padding .3s var(--ease);
  padding: 0 18px;
}
.faq-v2-item.open .faq-v2-a { max-height: 400px; padding: 0 18px 16px; }

/* ── УНИФИКАЦИЯ ШАПОК (v9.4.73) ─────────────────────────────
   Все публичные страницы: page-hero-v2
   Кабинет (.cab-hero) и заявки (.mo-hero) — выравниваем
   визуально под тот же стиль (bg, border, overlay)
   ──────────────────────────────────────────────────────── */

/* Override cab-hero to match page-hero-v2 palette */
.cab-hero {
  background: var(--bg2) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative;
  overflow: hidden;
}
.cab-hero::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 90% at 92% 50%, rgba(255,107,0,.06) 0%, transparent 60%),
    repeating-linear-gradient(-45deg, transparent 0, transparent 28px, rgba(255,107,0,.015) 28px, rgba(255,107,0,.015) 29px);
}

/* Override mo-hero — now replaced by page-hero-v2 in JS,
   keep these as fallback for any cached renders */
.mo-hero {
  background: var(--bg2) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative;
  overflow: hidden;
}

/* news-hero-section fallback (now page-hero-v2 in JS) */
.news-hero-section {
  background: var(--bg2) !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 60px 0 52px;
}

/* ═══════════════════════════════════════════════════════════
   SPA LAYOUT SYSTEM  v9.4.74
   Страницы — не лендинги. Компактная шапка + липкий фильтр
   ═══════════════════════════════════════════════════════════ */

/* ── SPA страница ─────────────────────────────────────────── */
.spa-page {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - var(--nav-h));
}

/* ── Компактная шапка страницы ────────────────────────────── */
.spa-page-header {
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding: 16px 0 14px;
  flex-shrink: 0;
}
.spa-page-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.spa-page-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.spa-page-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.spa-page-title {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.spa-page-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface2);
  color: var(--text3);
  border: 1px solid var(--line);
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  min-width: 24px;
}
.spa-page-badge {
  font-size: 11px; font-weight: 700;
  border-radius: 99px; padding: 2px 9px;
  border: 1px solid;
}
.spa-badge-green { background: rgba(34,197,94,.12); color: var(--green); border-color: rgba(34,197,94,.28); }
.spa-badge-amber { background: rgba(245,158,11,.12); color: #f59e0b; border-color: rgba(245,158,11,.28); }
.spa-page-meta-text { font-size: 12px; color: var(--text3); }
.spa-page-meta { display: flex; align-items: center; gap: 8px; }
.spa-cta { font-size: 13px; padding: 9px 16px; }

/* ── Липкий фильтр-бар ────────────────────────────────────── */
.spa-filter-bar {
  position: static;
  top: var(--nav-h);
  z-index: 40;
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  flex-shrink: 0;
}
.spa-filter-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  flex-wrap: wrap;
  min-height: 50px;
}

/* ── Чипы-фильтры ─────────────────────────────────────────── */
.spa-chips {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex: 1;
}
.spa-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border-radius: var(--ui-radius-sm,5px);
  background: var(--surface);
  border: 1.5px solid var(--line);
  font-size: 12px;
  font-weight: 600;
  color: var(--text2);
  cursor: pointer;
  transition: .15s var(--ease);
  white-space: nowrap;
  line-height: 1;
}
.spa-chip:hover {
  border-color: var(--orange-brd);
  color: var(--text);
}
.spa-chip.active, .spa-chip.selected {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}
.spa-chip-e { font-size: 13px; }
.spa-chip-cnt {
  background: var(--surface2);
  color: var(--text3);
  border-radius: 99px;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  min-width: 18px;
  text-align: center;
}
.spa-chip.active .spa-chip-cnt,
.spa-chip.selected .spa-chip-cnt {
  background: var(--orange);
  color: #fff;
}
.spa-info-btn {
  font-size: 12px;
  color: var(--text3);
  background: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  padding: 4px 6px;
  border-radius: var(--ui-radius-sm,5px);
  transition: .15s;
}
.spa-info-btn:hover { color: var(--text); background: var(--surface); }

/* ── Контент-зона ─────────────────────────────────────────── */
.spa-content {
  flex: 1;
  padding: 24px 0 40px;
}

/* ── Разделитель внутри секции ────────────────────────────── */
.spa-section-sep {
  height: 1px;
  background: var(--line);
  margin: 28px 0 22px;
}
.spa-section-title {
  font-family: 'Oswald', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .5px;
  margin-bottom: 12px;
  color: var(--text);
}

/* ── О нас: applyAboutFilterState обновляет чипы и секции ─── */
[data-about-section] { transition: none; }

/* ── Мобайл ───────────────────────────────────────────────── */
@media (max-width: 520px) {
  .spa-page-title { font-size: 18px; }
  .spa-filter-inner { gap: 8px; padding-top: 8px; padding-bottom: 8px; }
  .spa-chip { font-size: 11px; padding: 5px 10px; }
  .spa-content { padding: 16px 0 32px; }
}

/* ── Убираем старые hero-классы от мешающего стиля ───────── */
.news-hero-section,
.mo-hero { padding: 0; background: transparent; border: none; }

/* ═══════════════════════════════════════════════════════════
   УСЛУГИ v9.4.75 — категорийные группы + модалка
   ═══════════════════════════════════════════════════════════ */

/* ── Группа категории ─────────────────────────────────────── */
.svc-cat-group {
  margin-bottom: 36px;
}
.svc-cat-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.svc-cat-header-ico {
  width: 46px; height: 46px;
  border-radius: var(--ui-radius-md,10px);
  border: 1.5px solid;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; flex-shrink: 0;
}
.svc-cat-header-name {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; line-height: 1;
}
.svc-cat-header-count {
  font-size: 12px; color: var(--text3); margin-top: 4px;
}

/* ── spa-chip с CSS-переменными цвета ─────────────────────── */
.spa-chip {
  --chip-active-bg:  var(--orange-dim);
  --chip-active-brd: var(--orange-brd);
  --chip-active-clr: var(--orange);
}
.spa-chip.active, .spa-chip.selected {
  background:    var(--chip-active-bg)  !important;
  border-color:  var(--chip-active-brd) !important;
  color:         var(--chip-active-clr) !important;
}
.spa-chip.active .spa-chip-cnt,
.spa-chip.selected .spa-chip-cnt {
  background: var(--chip-active-clr) !important;
  color: #fff !important;
}

/* ── Модалка услуги ───────────────────────────────────────── */
.svc-modal-box {
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  width: min(92vw, 700px);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  margin: auto;
  position: relative;
}

/* Hero */
.svc-modal-hero {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 22px 22px 18px;
  flex-shrink: 0;
}
.svc-modal-hero-ico {
  width: 60px; height: 60px;
  border-radius: var(--ui-radius-md,10px); border: 1.5px solid;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; flex-shrink: 0;
}
.svc-modal-hero-info { flex: 1; min-width: 0; }
.svc-modal-hero-cat {
  font-size: 11px; font-weight: 700;
  letter-spacing: 1.5px; text-transform: uppercase;
  margin-bottom: 6px;
}
.svc-modal-hero-name {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; line-height: 1.1;
  margin-bottom: 10px;
}
.svc-modal-hero-meta {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.svc-modal-badge {
  font-size: 11px; font-weight: 700;
  border-radius: var(--ui-radius-sm,5px); padding: 4px 10px;
  background: var(--surface2);
  border: 1px solid var(--line);
  color: var(--text2);
}
.svc-modal-close {
  background: var(--surface2);
  border: 1px solid var(--line);
  color: var(--text2);
  border-radius: var(--ui-radius-sm,5px);
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
  font-size: 14px; font-weight: 700;
  transition: .15s var(--ease);
}
.svc-modal-close:hover { background: var(--orange-dim); border-color: var(--orange-brd); color: var(--orange); }

/* Tabs */
.svc-modal-tabs {
  display: flex;
  border-bottom: 1px solid var(--line);
  background: var(--bg2);
  flex-shrink: 0;
}
.svc-modal-tab {
  flex: 1; padding: 11px 8px;
  font-size: 13px; font-weight: 600;
  color: var(--text3);
  background: none; border: none; border-bottom: 2px solid transparent;
  cursor: pointer; transition: .15s var(--ease);
}
.svc-modal-tab:hover { color: var(--text); }
.svc-modal-tab.active { color: var(--orange); border-bottom-color: var(--orange); }

/* Panes */
.svc-modal-pane {
  display: none;
  padding: 22px;
  overflow-y: auto;
  flex: 1;
}
.svc-modal-pane.active { display: block; }

/* Описание pane */
.svc-modal-desc {
  font-size: 14px; color: var(--text2); line-height: 1.75;
  margin-bottom: 16px;
}
.svc-modal-why {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--bg2); border-radius: var(--ui-radius-md,10px);
  padding: 12px 14px; margin-bottom: 18px;
  border-left: 3px solid var(--orange-brd);
  font-size: 13px; color: var(--text2); line-height: 1.6;
}
.svc-modal-why-ico { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
.svc-modal-two-col {
  display: grid; grid-template-columns: 1fr 200px; gap: 18px;
  align-items: start;
}
@media (max-width: 560px) { .svc-modal-two-col { grid-template-columns: 1fr; } }

.svc-modal-col-title {
  font-size: 10px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--text3); margin-bottom: 10px;
}
.svc-modal-list {
  list-style: none; display: flex; flex-direction: column; gap: 6px;
}
.svc-modal-list li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: var(--text2); line-height: 1.4;
}
.svc-modal-book-aside {
  background: var(--bg2); border-radius: var(--ui-radius-md,10px);
  padding: 16px; text-align: center;
  border: 1px solid var(--line);
}
.svc-modal-price-big {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; color: var(--orange);
  line-height: 1; margin-bottom: 6px;
}
.svc-modal-time-hint { font-size: 12px; color: var(--text3); }

/* Этапы pane */
.svc-modal-steps-list { display: flex; flex-direction: column; gap: 10px; }
.svc-modal-step {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 12px 14px;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
}
.svc-modal-step-n {
  width: 28px; height: 28px; border-radius: 50%;
  border: 1.5px solid;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; flex-shrink: 0;
}
.svc-modal-step-text { font-size: 14px; color: var(--text2); line-height: 1.5; padding-top: 3px; }

/* Стоимость pane */
.svc-modal-price-table { display: flex; flex-direction: column; gap: 0; }
.svc-modal-price-row {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 16px; padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.svc-modal-price-row:last-child { border-bottom: none; }
.svc-modal-price-key { font-size: 13px; color: var(--text3); flex-shrink: 0; }
.svc-modal-price-val { font-size: 13px; font-weight: 600; text-align: right; }

/* ── Мобайл ───────────────────────────────────────────────── */
@media (max-width: 520px) {
  .svc-modal-hero { padding: 16px; gap: 12px; }
  .svc-modal-hero-ico { width: 48px; height: 48px; font-size: 22px; }
  .svc-modal-hero-name { font-size: 18px; }
  .svc-modal-pane { padding: 16px; }
  .svc-cat-header-name { font-size: 17px; }
}

/* ═══════════════════════════════════════════════════════════
   SPA-PAGE-HERO  v9.4.76
   Полноценная шапка страницы: название + описание + статистика
   Единый стиль для всех SPA-страниц (Услуги, Запчасти, Новости,
   О нас, Правовые, Мои заявки и т.д.)
   ═══════════════════════════════════════════════════════════ */
.spa-page-hero {
  position: relative;
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 44px 0 36px;
  overflow: hidden;
  flex-shrink: 0;
}
.spa-hero-bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 90% at 92% 50%, rgba(255,107,0,.07) 0%, transparent 60%),
    radial-gradient(ellipse 25% 60% at 8% 80%,  rgba(255,107,0,.04) 0%, transparent 55%),
    repeating-linear-gradient(
      -45deg,
      transparent 0, transparent 28px,
      rgba(255,107,0,.018) 28px, rgba(255,107,0,.018) 29px
    );
}
.spa-hero-label {
  font-size: 11px; font-weight: 700;
  letter-spacing: 4px; text-transform: uppercase;
  color: var(--orange); margin-bottom: 12px;
}
.spa-hero-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(28px, 4.5vw, 52px);
  font-weight: 700; line-height: 1.05;
  margin-bottom: 12px;
}
.spa-hero-sub {
  font-size: 14px; color: var(--text2);
  max-width: 540px; line-height: 1.8;
  margin-bottom: 24px;
}
.spa-hero-stats {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 14px 22px;
  max-width: 580px;
  margin-bottom: 22px;
}
.spa-hero-stat { flex: 1; min-width: 80px; text-align: center; }
.spa-hero-stat-num {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; line-height: 1; color: var(--orange);
}
.spa-hero-stat-lbl {
  font-size: 10px; color: var(--text3);
  font-weight: 600; text-transform: uppercase;
  letter-spacing: .5px; margin-top: 4px;
}
.spa-hero-stat-sep {
  width: 1px; height: 34px;
  background: var(--line); flex-shrink: 0;
}

/* Мобайл */
@media (max-width: 640px) {
  .spa-page-hero { padding: 28px 0 24px; }
  .spa-hero-title { font-size: 26px; }
  .spa-hero-stats { padding: 10px 14px; max-width: 100%; }
  .spa-hero-stat-num { font-size: 18px; }
}
@media (max-width: 420px) {
  .spa-hero-stats { flex-direction: column; gap: 8px; }
  .spa-hero-stat-sep { width: 100%; height: 1px; }
  .spa-hero-stat { text-align: left; }
}

/* ═══════════════════════════════════════════════════════════
   SVC-FILTER-STICKY  v9.4.78 — улучшенные кнопки фильтра
   ═══════════════════════════════════════════════════════════ */

.svc-filter-sticky {
  position: static;
  top: var(--nav-h);
  z-index: 40;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  flex-shrink: 0;
}

.svc-filter-track {
  display: flex;
  align-items: stretch;
  gap: 6px;
  padding: 10px 0;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.svc-filter-track::-webkit-scrollbar { display: none; }

/* ── Одна кнопка ─────────────────────────────────────────── */
.svc-filter-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface);
  border: 1.5px solid var(--line);
  color: var(--text2);
  font-family: 'Mulish', sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition:
    background .18s var(--ease),
    border-color .18s var(--ease),
    color .18s var(--ease),
    transform .15s var(--ease),
    box-shadow .18s var(--ease);
  --fc: var(--orange);
  position: relative;
  overflow: hidden;
}

/* shimmer-подсветка при наведении */
.svc-filter-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 0%, var(--surface-b) 0%, transparent 70%);
  opacity: 0;
  transition: opacity .2s;
}
.svc-filter-btn:hover::before { opacity: 1; }

.svc-filter-btn:hover {
  border-color: rgba(var(--fc-r, 255), var(--fc-g, 107), var(--fc-b, 0), .35);
  color: var(--text);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0,0,0,.2);
}

/* Иконка */
.svc-filter-btn-ico {
  font-size: 16px;
  line-height: 1;
  flex-shrink: 0;
}

/* Счётчик */
.svc-filter-btn-cnt {
  background: var(--surface2);
  color: var(--text3);
  border-radius: 99px;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  min-width: 20px;
  text-align: center;
  transition: background .18s, color .18s;
}

/* ── Активное состояние ──────────────────────────────────── */
.svc-filter-btn.active {
  background: color-mix(in srgb, var(--fc) 12%, transparent);
  border-color: color-mix(in srgb, var(--fc) 40%, transparent);
  color: var(--fc);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--fc) 20%, transparent),
              0 4px 16px color-mix(in srgb, var(--fc) 15%, transparent);
  transform: translateY(-1px);
}
.svc-filter-btn.active .svc-filter-btn-cnt {
  background: var(--fc);
  color: #fff;
}

/* ── Fallback для браузеров без color-mix ────────────────── */
@supports not (background: color-mix(in srgb, red 10%, blue)) {
  .svc-filter-btn.active {
    background: var(--orange-dim);
    border-color: var(--orange-brd);
    color: var(--orange);
    box-shadow: none;
  }
  .svc-filter-btn.active .svc-filter-btn-cnt {
    background: var(--orange);
    color: #fff;
  }
}

/* ── Кнопка «Прайс» — всегда нейтральная ────────────────── */
.svc-filter-price {
  margin-left: auto;
  color: var(--text3);
  border-style: dashed;
}
.svc-filter-price:hover {
  color: var(--orange);
  border-color: var(--orange-brd);
  border-style: solid;
}

/* ── Мобайл ───────────────────────────────────────────────── */
@media (max-width: 600px) {
  .svc-filter-btn {
    padding: 8px 12px;
    font-size: 12px;
    gap: 5px;
    border-radius: var(--ui-radius-md,10px);
  }
  .svc-filter-btn-ico { font-size: 14px; }
  .svc-filter-price { margin-left: 0; }
}

/* ═══════════════════════════════════════════════════════════
   SPA-PAGE-HERO — мобильный режим  v9.4.79
   На десктопе: полный hero как обычно
   На телефоне: компактная 1-строчная шапка + кнопка ℹ
                Весь контент — в bottom sheet
   ═══════════════════════════════════════════════════════════ */

/* ── Мобильная компактная строка (скрыта на десктопе) ────── */
.spa-hero-mobile-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.spa-hero-mobile-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.spa-hero-mobile-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 99px;
  background: var(--surface2);
  color: var(--text3);
  border: 1px solid var(--line);
  font-family: 'Mulish', sans-serif;
  letter-spacing: 0;
}
.spa-hero-mobile-badge.green { background: rgba(34,197,94,.15); color: var(--green); border-color: rgba(34,197,94,.3); }
.spa-hero-mobile-badge.amber { background: rgba(245,158,11,.13); color: #f59e0b; border-color: rgba(245,158,11,.3); }

.spa-hero-mobile-info {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1.5px solid var(--line);
  color: var(--text3);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: .15s var(--ease);
  font-family: serif;
}
.spa-hero-mobile-info:hover,
.spa-hero-mobile-info:active {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}

/* ── На мобиле: весь hero скрыт, только кнопка ℹ в фильтр-баре ── */
@media (max-width: 640px) {
  .spa-page-hero { display: none !important; }
}
@media (min-width: 641px) {
  .spa-hero-mobile-bar { display: none !important; }
  .spa-hero-body { display: block !important; }
  /* Кнопка ℹ в фильтр-баре не нужна на десктопе */
  .svc-filter-hero-btn { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   BOTTOM SHEET
   ═══════════════════════════════════════════════════════════ */
.spa-hero-sheet {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  align-items: flex-end;
}
.spa-hero-sheet.open {
  display: flex;
}

.spa-hero-sheet-box {
  width: 100%;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  padding: 16px 20px 32px;
  transform: translateY(100%);
  transition: transform .32s cubic-bezier(.32,1,.5,1);
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}
.spa-hero-sheet-box.up {
  transform: translateY(0);
}

/* Ручка */
.spa-hero-sheet-handle {
  width: 40px; height: 4px;
  border-radius: 99px;
  background: var(--surface2);
  margin: 0 auto 18px;
}

/* Контент внутри sheet */
.spa-hero-sheet-label {
  font-size: 10px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  color: var(--orange); margin-bottom: 8px;
}
.spa-hero-sheet-title {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700;
  line-height: 1.1; margin-bottom: 4px;
}
.spa-hero-sheet-sub {
  font-size: 13px; color: var(--text2);
  line-height: 1.7; margin-bottom: 18px;
}
.spa-hero-sheet-stats {
  max-width: 100%;
  margin-bottom: 18px;
}
.spa-hero-sheet-actions {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-bottom: 16px;
}
.spa-hero-sheet-close {
  width: 100%;
  padding: 11px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface);
  border: 1.5px solid var(--line);
  color: var(--text2);
  font-size: 13px; font-weight: 600;
  cursor: pointer;
  transition: .15s;
  font-family: 'Mulish', sans-serif;
}
.spa-hero-sheet-close:hover { border-color: var(--orange-brd); color: var(--orange); }

/* На десктопе sheet вообще не показывается */
@media (min-width: 641px) {
  .spa-hero-sheet { display: none !important; }
}

/* ── Кнопка ℹ в фильтр-баре (только мобиле ≤640px) ─────── */
.svc-filter-hero-btn {
  display: none; /* скрыта на десктопе */
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface2);
  border: 1.5px solid var(--line);
  color: var(--text2);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: 'Mulish', sans-serif;
  transition: .15s var(--ease);
}
.svc-filter-hero-btn:hover,
.svc-filter-hero-btn:active {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}
.svc-filter-hero-info {
  font-family: serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  opacity: .8;
}
.svc-filter-sep {
  width: 1px;
  height: 24px;
  background: var(--line);
  flex-shrink: 0;
  align-self: center;
}

@media (max-width: 640px) {
  .svc-filter-hero-btn { display: flex !important; }
  .svc-filter-sep { display: flex; }
}

/* ═══════════════════════════════════════════════════════════
   PARTS FILTER STICKY  v9.4.82
   Двухрядный адаптивный фильтр-бар для страницы Запчасти
   ═══════════════════════════════════════════════════════════ */

.parts-filter-sticky {
  position: static;
  top: var(--nav-h);
  z-index: 40;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  flex-shrink: 0;
}

/* ── Строки внутри ───────────────────────────────────────── */
.pf-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.pf-row-search {
  padding: 10px 0 8px;
  border-bottom: 1px solid var(--line);
}
.pf-row-cats {
  padding: 8px 0;
  overflow: hidden;
}

/* ── Строка поиска ───────────────────────────────────────── */
.pf-search-wrap {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
}
.pf-search-ico {
  position: absolute;
  left: 13px;
  font-size: 15px;
  color: var(--text3);
  pointer-events: none;
  line-height: 1;
}
.pf-search-input {
  width: 100%;
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 10px 40px 10px 40px;
  font-size: 14px;
  color: var(--text);
  font-family: 'Mulish', sans-serif;
  outline: none;
  transition: border-color .15s var(--ease);
  min-width: 0;
}
.pf-search-input:focus {
  border-color: var(--orange-brd);
  background: var(--surface2);
}
.pf-search-input::placeholder { color: var(--text3); }
.pf-search-clear {
  position: absolute;
  right: 10px;
  background: var(--surface2);
  border: none;
  color: var(--text3);
  font-size: 16px;
  font-weight: 700;
  width: 24px; height: 24px;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: .15s;
  line-height: 1;
}
.pf-search-clear:hover { color: var(--text); background: var(--line); }

/* Кнопка инфо в строке поиска — только мобиле */
.pf-info-btn {
  flex-shrink: 0;
}

/* ── Строка категорий (горизонтальный скролл) ────────────── */
.pf-cats-track {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 2px;
}
.pf-cats-track::-webkit-scrollbar { display: none; }

/* ── Кнопка категории ────────────────────────────────────── */
.pf-cat-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface);
  border: 1.5px solid var(--line);
  color: var(--text2);
  font-family: 'Mulish', sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s, border-color .15s, color .15s, transform .12s;
  line-height: 1;
}
.pf-cat-btn:hover {
  border-color: var(--orange-brd);
  color: var(--text);
  transform: translateY(-1px);
}
.pf-cat-btn.active {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
  transform: translateY(-1px);
}
.pf-cat-ico { font-size: 15px; line-height: 1; }
.pf-cat-label { line-height: 1; }

/* ── Адаптив ─────────────────────────────────────────────── */
@media (max-width: 640px) {
  .pf-row-search { padding: 8px 0 7px; }
  .pf-row-cats   { padding: 6px 0; }
  .pf-search-input { font-size: 16px; /* prevent iOS zoom */ padding: 9px 38px 9px 38px; }
  .pf-cat-btn { font-size: 12px; padding: 7px 12px; gap: 5px; }
  .pf-cat-ico { font-size: 14px; }
  /* Инфо-кнопка показывается только на мобиле */
  .pf-info-btn.svc-filter-hero-btn { display: inline-flex !important; }
}
@media (min-width: 641px) {
  .pf-info-btn.svc-filter-hero-btn { display: none !important; }
  .pf-search-input { font-size: 14px; }
}

/* ── Сетка карточек запчастей ─────────────────────────────── */
/* Переопределяем grid для мобиле */
@media (max-width: 640px) {
  .parts-grid-v2 {
    flex-template-columns: 0fr 0fr !important;
    gap: 10px !important;
  }
}
@media (max-width: 360px) {
  .parts-grid-v2 {
    grid-template-columns: 1fr !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   MY ORDERS v9.4.83 — filter tabs + type cards
   ═══════════════════════════════════════════════════════════ */

/* ── Фильтр-бар со вкладками ─────────────────────────────── */
.mo-filter-bar {
  margin-bottom: 16px;
}
.mo-filter-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 2px;
}
.mo-filter-tabs::-webkit-scrollbar { display: none; }

.mo-filter-tab {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface);
  border: 1.5px solid var(--line);
  font-family: 'Mulish', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--text2);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: .15s var(--ease);
  line-height: 1;
}
.mo-filter-tab:hover { border-color: var(--orange-brd); color: var(--text); }
.mo-filter-tab.active {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}
.mo-filter-tab[data-filter="parts_request"].active {
  background: rgba(96,165,250,.12);
  border-color: rgba(96,165,250,.35);
  color: #60a5fa;
}
.mo-filter-tab[data-filter="service_order"].active {
  background: rgba(34,197,94,.11);
  border-color: rgba(34,197,94,.3);
  color: var(--green);
}
.mo-filter-tab-ico { font-size: 13px; }
.mo-filter-cnt {
  background: var(--surface2);
  color: var(--text3);
  border-radius: 99px;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  min-width: 18px;
  text-align: center;
}
.mo-filter-tab.active .mo-filter-cnt {
  background: currentColor;
  color: var(--bg);
}

/* ── Тип-бейдж на карточке ───────────────────────────────── */
.mo-type-badge {
  font-size: 10px;
  font-weight: 700;
  border-radius: var(--ui-radius-sm,5px);
  padding: 3px 8px;
  border: 1px solid;
  white-space: nowrap;
}
.mo-type-badge.parts {
  background: rgba(96,165,250,.12);
  border-color: rgba(96,165,250,.3);
  color: #60a5fa;
}
.mo-type-badge.service {
  background: rgba(34,197,94,.1);
  border-color: rgba(34,197,94,.25);
  color: var(--green);
}

/* ── Карточка запчасти — левый акцент ────────────────────── */
.mo-card-parts {
  border-left: 3px solid #60a5fa !important;
}

/* ── Чат-кнопка ─────────────────────────────────────────── */
.mo-chat-btn {
  position: relative;
  font-size: 12px;
  padding: 8px 14px;
}
.mo-chat-badge {
  position: absolute;
  top: -6px; right: -6px;
  background: var(--orange);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  border-radius: 99px;
  min-width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}

/* ── Мобайл ─────────────────────────────────────────────── */
@media (max-width: 520px) {
  .mo-filter-tab { font-size: 11px; padding: 6px 10px; }
  .mo-filter-tab-ico { font-size: 12px; }
}


.parts-categories-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.parts-category-card{width:100%;text-align:left;border:1px solid color-mix(in srgb,var(--pc) 24%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--pc) 10%,var(--surface)) 0%,var(--surface) 100%);border-radius:var(--ui-radius-lg,18px);padding:22px;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s;color:inherit;box-shadow:0 8px 28px rgba(0,0,0,.10)}
.parts-category-card:hover{transform:translateY(-4px);border-color:var(--pc);box-shadow:0 16px 36px rgba(0,0,0,.16)}
.parts-category-card__top{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;margin-bottom:14px}
.parts-category-card__icon{width:60px;height:60px;border-radius:var(--ui-radius-lg,18px);display:flex;align-items:center;justify-content:center;font-size:28px;background:color-mix(in srgb,var(--pc) 16%,transparent)}
.parts-category-card__label{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.parts-category-card__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1}
.parts-category-card__count{min-width:58px;height:58px;border-radius:var(--ui-radius-lg,18px);display:flex;align-items:center;justify-content:center;background:var(--pc);color:#fff;font-size:22px;font-weight:800}
.parts-category-card__desc{color:var(--text2);line-height:1.75;min-height:56px;margin-bottom:14px}
.parts-category-card__stats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.parts-category-card__stats span{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:var(--surface-b);border:1px solid var(--line);font-size:12px;color:var(--text2)}
.parts-category-card__cta{margin-top:14px;color:var(--pc);font-weight:700}
.parts-category-focus{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:stretch;border:1px solid color-mix(in srgb,var(--pc) 26%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--pc) 12%,var(--surface)) 0%,var(--surface) 72%);border-radius:var(--ui-radius-lg,18px);padding:22px;margin-bottom:24px}
.parts-category-focus__badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:color-mix(in srgb,var(--pc) 16%,transparent);border:1px solid color-mix(in srgb,var(--pc) 28%,transparent);color:var(--pc);font-weight:700;margin-bottom:12px}
.parts-category-focus__title{font-family:'Oswald',sans-serif;font-size:clamp(30px,4vw,44px);line-height:1;margin:0 0 10px}
.parts-category-focus__sub{margin:0;color:var(--text2);max-width:760px;line-height:1.8}
.parts-category-focus__stats{display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:12px}.parts-category-focus__stat{min-width:118px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;border-radius:var(--ui-radius-lg,18px);background:var(--surface-b);border:1px solid var(--line);padding:16px 18px}.parts-category-focus__stat strong{font-size:28px;line-height:1;margin-bottom:6px}.parts-category-focus__stat span{color:var(--text3);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.parts-inline-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:18px}
.part-desc-v2{font-size:13px;color:var(--text2);line-height:1.65;min-height:42px}
@media(max-width:980px){.parts-categories-grid{grid-template-columns:1fr}.parts-category-focus{grid-template-columns:1fr}.parts-category-focus__stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.parts-category-card{padding:18px;border-radius:var(--ui-radius-lg,18px)}.parts-category-card__top{grid-template-columns:auto 1fr}.parts-category-card__count{grid-column:1/-1;width:100%;height:44px;border-radius:var(--ui-radius-md,10px);justify-content:flex-start;padding:0 14px}.parts-category-card__title{font-size:24px}.parts-category-focus{padding:12px 14px;border-radius:var(--ui-radius-md,10px);gap:12px;margin-bottom:16px}.parts-category-focus__badge{padding:6px 10px;font-size:12px;margin-bottom:8px}.parts-category-focus__title{font-size:24px;margin:0 0 6px}.parts-category-focus__sub{font-size:13px;line-height:1.55}.parts-category-focus__stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.parts-category-focus__stat{min-width:0;padding:var(--ui-radius-md,10px) var(--ui-radius-md,10px);border-radius:var(--ui-radius-md,10px)}.parts-category-focus__stat strong{font-size:18px;margin-bottom:4px}.parts-category-focus__stat span{font-size:10px;letter-spacing:.04em}.parts-inline-tools{grid-template-columns:1fr}.part-desc-v2{min-height:0}}
@media(max-width:420px){.parts-category-focus{padding:10px 12px}.parts-category-focus__title{font-size:21px}.parts-category-focus__sub{font-size:12px;line-height:1.45}.parts-category-focus__stats{grid-template-columns:repeat(2,minmax(0,1fr))}.parts-category-focus__stat:last-child{grid-column:1/-1}.parts-category-focus__stat strong{font-size:16px}.parts-category-focus__stat span{font-size:9px}}


/* part detail mobile compact fix */
@media (max-width: 640px){
  #hero-part{display:none !important}
  .parts-detail-tools{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:10px}
  .parts-breadcrumb{font-size:11px;gap:5px;line-height:1.35}
  .parts-breadcrumb__current{display:block;width:100%}
  .parts-share-btn{width:100%;justify-content:center;min-height:40px;padding:9px 12px;font-size:12px}
  .parts-section-group{margin-bottom:16px}
  .parts-category-focus{padding:10px 12px;border-radius:var(--ui-radius-md,10px);gap:10px;margin-bottom:12px}
  .parts-category-focus__badge{padding:5px 9px;font-size:11px;margin-bottom:6px}
  .parts-category-focus__title{font-size:20px;line-height:1.05;margin:0 0 4px}
  .parts-category-focus__sub{display:none}
  .news-back-btn{min-height:38px;padding:8px 12px;font-size:12px;margin-bottom:8px}
  .parts-category-focus__stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .parts-category-focus__stat{padding:8px 8px;border-radius:var(--ui-radius-md,10px);min-width:0}
  .parts-category-focus__stat strong{font-size:14px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .parts-category-focus__stat span{font-size:9px;letter-spacing:.02em}
  .part-details-layout{gap:10px}
  .part-details-media-wrap{border-radius:var(--ui-radius-md,10px)}
  .part-details-media{aspect-ratio:16 / 11}
  .part-details-main{gap:10px}
  .part-details-topline{gap:5px}
  .part-details-chip{padding:5px 10px;font-size:11px}
  .part-stock-badge{font-size:11px;padding:6px 10px}
  .part-details-price{font-size:24px}
  .part-details-meta-grid{gap:8px}
  .part-details-meta-card{padding:10px 12px;border-radius:var(--ui-radius-md,10px)}
  .part-details-meta-card span{font-size:10px}
  .part-details-meta-card strong{font-size:10px}
  .part-details-rating{font-size:10px}
  .part-details-section{padding-top:10px}
  .part-details-section-title{font-size:10px;margin-bottom:6px}
  .part-details-text{font-size:13px;line-height:1.5}
  .part-details-actions{gap:6px}
  .part-details-actions .btn{min-width:0;width:100%;min-height:42px;padding:10px 12px;font-size:13px}
  .news-section-head{margin:4px 0 10px}
  .news-section-title{font-size:22px}
  .news-section-sub{font-size:13px;line-height:1.5}
  .parts-grid-v2{gap:12px}
}
@media (max-width: 420px){
  .parts-detail-tools{gap:6px}
  .parts-breadcrumb{font-size:10px}
  .parts-category-focus{padding:8px 10px;border-radius:var(--ui-radius-md,10px)}
  .parts-category-focus__title{font-size:18px}
  .parts-category-focus__stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .parts-category-focus__stat:last-child{grid-column:1/-1}
  .parts-category-focus__stat strong{font-size:10px}
  .part-details-price{font-size:18px}
  .part-details-meta-card{padding:var(--ui-radius-md,10px) var(--ui-radius-md,10px)}
  .part-details-text{font-size:10px}
}


.part-card-v2--shoplike{gap:10px}
.part-card-v2-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.part-card-v2-info{flex:1;min-width:0;display:grid;gap:4px}
.part-card-v2-sku{font-size:11px;color:var(--text3);line-height:1.35}
.part-card-v2-desc{font-size:12px;color:var(--text2);line-height:1.6;min-height:38px}
.part-card-v2-meta{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.part-card-v2-meta-side{display:grid;gap:4px;justify-items:end}
.part-card-v2-rating,.part-card-v2-shop{font-size:11px;color:var(--text3);line-height:1.35;text-align:right}
.part-card-v2-bottomline{display:flex;align-items:center;min-height:26px}
.part-card-v2-chip{display:inline-flex;align-items:center;max-width:100%;padding:7px 10px;border-radius:999px;background:var(--surface-a);border:1px solid var(--line);font-size:11px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.part-card-v2-foot{margin-top:auto;display:flex;gap:6px;align-items:stretch}
.part-card-v2-foot .btn{flex:1;justify-content:center;font-size:12px;padding:9px 10px}
.part-card-v2-foot .part-rating-btn{flex:0 0 48px;max-width:48px}
@media (max-width: 640px){
  .part-card-v2--shoplike{gap:10px}
  .part-card-v2-desc{font-size:11px;line-height:1.5;min-height:0}
  .part-card-v2-meta{align-items:flex-start;flex-direction:column;gap:6px}
  .part-card-v2-meta-side{justify-items:start}
  .part-card-v2-price{font-size:18px}
  .part-card-v2-foot .btn{font-size:11px;padding:8px 8px}
}


.parts-level__head{display:flex;align-items:center;justify-content:flex-start;gap:12px;margin:0 0 14px}
.parts-summary-card{grid-template-columns:minmax(0,1fr) repeat(3,minmax(120px,1fr));gap:14px;align-items:stretch;margin-bottom:18px}
.parts-summary-card__badge{background:color-mix(in srgb,var(--pc) 16%,transparent);border-color:color-mix(in srgb,var(--pc) 28%,transparent);color:var(--pc)}
.parts-summary-card__count strong{color:var(--text)}
.parts-grid-v2--catalog{align-items:stretch}
.parts-grid-v2--catalog .part-card-v2{height:100%}
.part-card-v2--shoplike{padding:14px;display:flex;flex-direction:column;justify-content:flex-start}
.part-card-v2-media-wrap{aspect-ratio:16/10}
.part-card-v2-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.part-card-v2-desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:4.8em}
.part-card-v2-meta{margin-top:auto;padding-top:2px}
.part-card-v2-bottomline{margin-top:2px;min-height:34px}
.part-card-v2-chip{width:100%;justify-content:flex-start}
.part-card-v2-foot{margin-top:8px}
@media (max-width:980px){
  .parts-summary-card{grid-template-columns:1fr repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .parts-level__head{margin:0 0 10px}
  .parts-summary-card{grid-template-columns:1fr 1fr;gap:10px;padding:12px 14px;border-radius:var(--ui-radius-md,10px)}
  .parts-summary-card .svc-active-category__main{grid-column:1/-1;gap:8px}
  .parts-summary-card__count{min-width:0;padding:10px 12px;border-radius:var(--ui-radius-md,10px)}
  .parts-summary-card__count strong{font-size:18px}
  .parts-summary-card__count span{font-size:10px}
  .part-card-v2--shoplike{padding:10px}
  .part-card-v2-name{min-height:2.55em}
  .part-card-v2-desc{min-height:3.9em;-webkit-line-clamp:3}
}
@media (max-width:420px){
  .parts-summary-card{grid-template-columns:1fr;gap:8px;padding:10px 12px;border-radius:var(--ui-radius-md,10px)}
  .parts-summary-card .svc-active-category__main,.parts-summary-card__count{grid-column:auto}
  .parts-summary-card__count strong{font-size:10px}
  .part-card-v2--shoplike{padding:10px}
  .part-card-v2-desc{min-height:3.6em}
}

.booking-categories-grid{margin-top:10px}
.booking-subcat-chips{display:flex;flex-wrap:wrap;gap:10px}
.booking-subcat-chip{border:1px solid var(--line);background:var(--surface-2,#151515);color:var(--text);padding:10px 14px;border-radius:999px;font-weight:700;cursor:pointer;transition:.18s ease}
.booking-subcat-chip:hover{border-color:var(--orange-brd);transform:translateY(-1px)}
.booking-subcat-chip.selected{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.35);color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.booking-step-price .svc-card-v2.selected{border-color:var(--orange-brd);box-shadow:0 16px 36px rgba(0,0,0,.35),0 0 0 1px rgba(245,158,11,.24) inset}
.booking-step-price .svc-card-v2.selected .svc-card-v2-price{color:#fff}
.booking-empty-services{padding:16px 18px;border-radius:var(--ui-radius-md,10px);border:1px dashed var(--surface-c);background:var(--surface-a);color:var(--text2);font-size:13px;line-height:1.6}
.booking-price-grid{margin-top:4px}


.booking-service-grid{
  grid-template-columns:1fr;
  gap:12px;
}
.booking-service-card{
  width:100%;
  text-align:left;
}
.booking-service-card.active{
  border-color:var(--fc);
  box-shadow:0 16px 36px rgba(0,0,0,.35),0 0 0 1px color-mix(in srgb, var(--fc) 35%, transparent) inset;
}
.booking-service-card .svc-cat-nav-card__count{
  min-width:72px;
  text-align:center;
}
.booking-service-card__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:8px;
  font-size:11px;
  color:var(--text3);
}
.booking-service-card__meta span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--surface-b);
  background:var(--surface-a);
}
.booking-service-actions{
  display:flex;
  gap:10px;
  margin:-2px 0 2px;
}
.booking-service-actions .btn{
  flex:1;
  justify-content:center;
}
@media(max-width:640px){
  .booking-service-actions{flex-direction:column;}
  .booking-service-card .svc-cat-nav-card__count{min-width:64px;font-size:12px;}
}


.booking-vehicle-empty{border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:14px;background:linear-gradient(180deg, var(--surface-a), transparent)}
.booking-vehicle-empty__title{font-weight:800;color:#fff;font-size:14px}
.booking-vehicle-empty__desc{font-size:12px;color:var(--text3);margin-top:4px;line-height:1.45}
.booking-vehicle-card{position:relative;min-height:68px;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.booking-vehicle-card:hover{border-color:var(--orange-brd);transform:translateY(-1px)}
.booking-vehicle-card.selected{background:linear-gradient(180deg,rgba(245,158,11,.12),rgba(245,158,11,.05))}
.booking-vehicle-card .sub-soft{opacity:.92}
.booking-vehicle-side{display:flex;align-items:center;justify-content:flex-end;flex-shrink:0;min-width:44px}
.booking-vehicle-check{width:28px;height:28px;border-radius:999px;background:var(--orange);color:#111;display:flex;align-items:center;justify-content:center;font-weight:900;box-shadow:0 10px 24px rgba(245,158,11,.22)}
.booking-vehicle-arrow{color:var(--text3);font-weight:800;flex-shrink:0}
.booking-vehicle-card--action .ico,.booking-vehicle-card--manual .ico{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.2)}

/* ── Кнопка корзины бронирования (мобиль) ─────────────────────── */
#booking-cart-fab {
  display: none;
  position: fixed;
  bottom: calc(72px + env(safe-area-inset-bottom, 0px) + 12px);
  right: 18px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--orange);
  color: #fff;
  border: none;
  font-size: 22px;
  cursor: pointer;
  z-index: 900;
  box-shadow: 0 4px 16px rgba(255,107,0,.45);
  align-items: center;
  justify-content: center;
  transition: transform .15s, box-shadow .15s;
}
#booking-cart-fab:active { transform: scale(.93); }
#booking-cart-fab .booking-cart-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: #fff;
  color: var(--orange);
  font-size: 11px;
  font-weight: 800;
  border-radius: 99px;
  min-width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 2px solid var(--orange);
  line-height: 1;
}
@media(max-width:560px) {
  #booking-cart-fab { display: flex; }
}


/* ╔══════════════════════════════════════════════════════════════════
   MOBILE APP UPGRADE — комплексный апгрейд под мобильное приложение
   ══════════════════════════════════════════════════════════════════╝ */

/* ── 1. Базовые улучшения для touch-устройств ────────────────────── */
:root {
  --bnav-h: 68px;
  --topbar-h: 56px;
  --radius-modal: 24px;
  --tap-target: 44px;   /* минимальный tap-target по Apple HIG */
}

/* Убираем tap-highlight на всех интерактивных элементах */
a, button, [role="button"], [data-booking-action], .bnav-item,
.booking-vehicle-card, .mo-card, .card[onclick], .act-btn,
.svc-cat-nav-card, .cab-tab, .admin-nav-item, .drawer-link {
  -webkit-tap-highlight-color: transparent;
}

/* Плавный скролл везде */
* { -webkit-overflow-scrolling: touch; }
html { scroll-behavior: smooth; }

/* Запрет случайного выделения текста при свайпах */
.bnav-item, .booking-steps, .mo-card, .act-btn,
.sched-btn, .cab-tab, .admin-nav-item {
  -webkit-user-select: none;
  user-select: none;
}

/* ── 2. Нижний навбар — нативный вид ────────────────────────────── */
#bottom-nav {
  height: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  background: rgba(13,13,15,.88);
  border-top: 1px solid var(--surface-b);
}
.bnav-inner {
  height: var(--bnav-h);
  display: flex;
  align-items: stretch;
}
.bnav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 4px;
  min-height: var(--tap-target);
  border-radius: var(--ui-radius-md,10px);
  margin: 4px 2px;
  transition: background .15s, transform .1s;
  position: relative;
}
.bnav-item:active { transform: scale(.91); background: var(--surface-b); }
.bnav-item.active { background: rgba(255,107,0,.12); }
.bnav-icon { font-size: 22px; line-height: 1; }
.bnav-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .2px;
  color: var(--text3);
  transition: color .15s;
}
.bnav-item.active .bnav-label { color: var(--orange); }
.bnav-icon-wrap { position: relative; }

/* ── 3. Верхний навбар — компактнее на мобиле ───────────────────── */
@media (max-width: 640px) {
  #nav {
    height: var(--topbar-h);
    padding: 0 14px;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
  }
  #nav.scrolled { box-shadow: 0 1px 0 var(--surface-b); }
  .nav-logo { font-size: 17px; letter-spacing: .5px; }
  .nav-links { display: none; } /* скрыт на мобиле — есть bottom nav */
  #navLinks { display: none; }
}

/* ── 4. Отступ от нижнего навбара ───────────────────────────────── */
@media (max-width: 900px) {
  #app {
    padding-bottom: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px) + 8px);
  }
}

/* ── 5. Карточки — увеличенные tap-зоны ─────────────────────────── */
@media (max-width: 640px) {
  .card {
    border-radius: var(--ui-radius-lg,18px);
  }

  /* Кнопки — минимум 44px высота */
  .btn {
    min-height: var(--tap-target);
    border-radius: var(--ui-radius-md,10px);
    font-size: 14px;
    padding: 11px 18px;
  }
  .btn-primary { font-weight: 700; }

  /* Инпуты — крупнее и удобнее */
  .pf-input, .bform-input, .bform-textarea {
    font-size: 16px; /* предотвращает зум на iOS */
    min-height: 48px;
    border-radius: var(--ui-radius-md,10px);
    padding: 12px 14px;
  }
  textarea.pf-input, .bform-textarea {
    min-height: 96px;
  }

  /* Селект */
  select.pf-input {
    min-height: 48px;
    background-image: none;
    -webkit-appearance: none;
  }
}

/* ── 6. Модалки — bottom sheet на мобиле ───────────────────────── */
/* cmodal mobile rules moved to settings.css */

/* ── 7. Карточки заявок (мастер, клиент) ───────────────────────── */
@media (max-width: 640px) {
  .mo-card {
    border-radius: var(--ui-radius-lg,18px);
    padding: 16px;
    margin-bottom: 10px;
  }
  .mo-card-title { font-size: 15px; font-weight: 700; }
  .mo-card-actions {
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
  }
  .mo-card-actions .btn { flex: 1; min-width: 0; justify-content: center; }

  /* Мастер — карточка заявки */
  .sched-card {
    border-radius: var(--ui-radius-lg,18px);
    padding: 14px 16px;
  }
  .sched-card .btn { min-height: 42px; }

  /* Бирж‑карточка */
  .queue-card {
    border-radius: var(--ui-radius-lg,18px);
    padding: 14px 16px;
  }
}

/* ── 8. Страница «Мои заявки» ───────────────────────────────────── */
@media (max-width: 640px) {
  .mo-filter-bar {
    margin: 0 -16px;
    padding: 0 12px;
  }
  .mo-filter-tabs {
    padding: 0 4px 8px;
    gap: 6px;
  }
  .mo-filter-tab {
    flex-shrink: 0;
    padding: 8px 14px;
    border-radius: 99px;
    font-size: 13px;
    min-height: 38px;
  }
  .mo-timeline {
    padding: 10px 0 0;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .mo-timeline::-webkit-scrollbar { display: none; }
}

/* ── 9. Booking wizard ──────────────────────────────────────────── */
@media (max-width: 640px) {
  .booking-hero { padding: 28px 0 20px; }
  .bform-card { padding: 16px; border-radius: var(--ui-radius-lg,18px); }
  .bform-section-title { font-size: 13px; }

  /* Шаги — горизонтальный скролл без обрезания */
  .booking-steps {
    padding: 0 4px 6px;
    margin-bottom: 20px;
    gap: 0;
  }
  .bstep-label { font-size: 10px; }
  .bstep-num { width: 24px; height: 24px; font-size: 10px; }
  .bstep-line { min-width: 16px; }

  /* Карточки услуг */
  .booking-service-card {
    padding: 12px;
    border-radius: var(--ui-radius-md,10px);
  }

  /* Выбор авто */
  .booking-vehicle-card {
    padding: 12px 14px;
    border-radius: var(--ui-radius-md,10px);
    min-height: var(--tap-target);
  }

  /* Дата и время */
  .date-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .time-grid { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .date-btn, .time-btn {
    padding: 10px 6px;
    border-radius: var(--ui-radius-md,10px);
    font-size: 12px;
    min-height: 52px;
  }

  /* Навигация wizard */
  .bform-nav {
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
  }
  .bform-nav .btn { flex: 1; justify-content: center; }
}

/* ── 10. Нотиф FAB и корзина — правильное позиционирование ────── */
#notifs-fab {
  bottom: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px) + 14px);
  right: 18px;
}
#booking-cart-fab {
  bottom: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px) + 76px);
  right: 18px;
}

/* ── 11. Формы профиля ──────────────────────────────────────────── */
@media (max-width: 640px) {
  .profile-form {
    grid-template-columns: 1fr !important;
    gap: 12px;
  }
  .pf-group { margin-bottom: 0; }
  .pf-label { font-size: 12px; margin-bottom: 5px; }
}

/* ── 12. Toast mobile — см. систему g-toast выше ── */

/* ── 13. Spa hero — компактнее на мобиле ────────────────────────── */
@media (max-width: 640px) {
  .spa-page-hero { padding: 28px 0 20px; }
  .spa-hero-title { font-size: 26px; }
  .spa-hero-sub { font-size: 14px; }
  .spa-hero-stats {
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-start;
  }
  .spa-hero-stat { min-width: 60px; }
  .spa-hero-stat-num { font-size: 22px; }
  .section { padding: 28px 0; }
}

/* ── 14. Чат — оптимизация под мобиль ──────────────────────────── */
@media (max-width: 640px) {
  .chat-overlay.open {
    border-radius: var(--radius-modal) var(--radius-modal) 0 0;
    top: auto !important;
    bottom: 0;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: 92vh;
    height: 92vh;
  }
  .chat-head {
    padding: 14px 16px;
    border-radius: var(--radius-modal) var(--radius-modal) 0 0;
  }
  .chat-messages {
    padding: 12px 14px;
  }
  .chat-footer {
    padding: 10px 14px;
    padding-bottom: max(14px, env(safe-area-inset-bottom, 14px));
  }
  .chat-input {
    font-size: 16px; /* no zoom on iOS */
    border-radius: var(--ui-radius-md,10px);
    min-height: 42px;
  }
  .chat-send-btn {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    flex-shrink: 0;
  }
}

/* ── 15. Контейнер — паддинги на мобиле ─────────────────────────── */
@media (max-width: 640px) {
  .container { padding: 0 14px; }
}

/* ── 16. Таблицы — скролл по горизонтали ────────────────────────── */
@media (max-width: 640px) {
  .admin-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--ui-radius-md,10px);
  }
  table { min-width: 480px; }
  th, td { padding: 10px 12px; font-size: 12px; }
}

/* ── 17. Pull-to-refresh индикатор (визуальный) ─────────────────── */
@keyframes spin-ptr {
  to { transform: rotate(360deg); }
}
.ptr-indicator {
  position: fixed;
  top: calc(var(--topbar-h) + env(safe-area-inset-top, 0px) + 8px);
  left: 50%;
  transform: translateX(-50%);
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  opacity: 0;
  transition: opacity .2s;
  z-index: 500;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
.ptr-indicator.visible { opacity: 1; animation: spin-ptr .7s linear infinite; }

/* ── 18. Скелетон-загрузка ──────────────────────────────────────── */
@keyframes shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}
.skeleton {
  background: linear-gradient(90deg,
    var(--surface) 25%,
    var(--surface-b) 50%,
    var(--surface) 75%
  );
  background-size: 800px 100%;
  animation: shimmer 1.4s infinite;
  border-radius: var(--ui-radius-sm,5px);
}
.skeleton-text  { height: 14px; border-radius: var(--ui-radius-sm,5px); }
.skeleton-title { height: 22px; border-radius: var(--ui-radius-sm,5px); }
.skeleton-card  { height: 80px; border-radius: var(--ui-radius-md,10px); }

/* ── 19. Переходы страниц ────────────────────────────────────────── */
@media (max-width: 900px) {
  .page {
    animation: page-enter .22s cubic-bezier(.25,.46,.45,.94) both;
  }
  @keyframes page-enter {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* ── 20. Активные состояния кнопок ──────────────────────────────── */
@media (hover: none) {
  .btn:active         { transform: scale(.95); opacity: .88; }
  .act-btn:active     { transform: scale(.93); }
  .bnav-item:active   { transform: scale(.88); }
  .mo-card:active     { transform: scale(.99); }
  .sched-card:active  { transform: scale(.99); box-shadow: none; }
  .booking-vehicle-card:active { transform: scale(.97); }
  .date-btn:active, .time-btn:active { transform: scale(.93); }
}


@media (max-width: 768px){
  #svc-active-category,
  .svc-active-category#svc-active-category{
    display:none !important;
  }
}


.svc-card-v2-cart-btn{
  gap:8px;
  transition:background .15s, color .15s, border-color .15s;
}
.svc-card-v2-cart-btn::before{
  content:'';
}
.svc-card-v2-cart-btn--active{
  border-color:#ef4444 !important;
  color:#ef4444 !important;
}
.svc-card-v2-cart-btn--active:hover{
  background:rgba(239,68,68,.08) !important;
}

@media (max-width:768px){
  .news-category-focus__stats{
    display:none !important;
  }
}


@media (max-width:768px){
  .svc-active-category.svc-active-category--page.parts-summary-card{
    display:none !important;
  }
}



/* ── Общая корзина услуг (категории services:*) ─────────────────── */
#services-cart-fab{
  display:none;
  position:fixed;
  right:18px;
  bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 12px);
  width:56px;
  height:56px;
  border:none;
  border-radius:50%;
  background:linear-gradient(180deg, #ff8b3d 0%, #ff6b00 100%);
  color:#fff;
  font-size:24px;
  cursor:pointer;
  z-index: 898;
  box-shadow:0 10px 28px rgba(255,107,0,.38);
  align-items:center;
  justify-content:center;
}
#services-cart-fab:active{ transform:scale(.95); }
#services-cart-fab .services-cart-badge{
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:22px;
  height:22px;
  border-radius:999px;
  background:#fff;
  color:var(--orange);
  border:2px solid var(--orange);
  font-size:11px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 5px;
  line-height:1;
}
.services-cart-modal-card{
  max-width:430px;
  width:min(94vw,430px);
  border-radius:var(--ui-radius-lg,18px);
  padding-bottom:env(safe-area-inset-bottom,0);
}
.services-cart-modal__count{
  font-size:12px;
  color:var(--text3);
  font-weight:500;
}
.services-cart-modal__list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.services-cart-modal__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}
.services-cart-modal__meta{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.services-cart-modal__ico{
  width:32px;
  height:32px;
  border-radius:var(--ui-radius-md,10px);
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,107,0,.08);
  flex:0 0 32px;
}
.services-cart-modal__name{
  font-size:14px;
  font-weight:700;
}
.services-cart-modal__sub{
  font-size:12px;
  color:var(--text3);
  margin-top:2px;
}
.services-cart-modal__remove{
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text3);
  font-size:18px;
  cursor:pointer;
  flex:0 0 30px;
}
.services-cart-modal__footer{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.services-cart-modal__total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}
.services-cart-modal__total span{
  font-size:13px;
  color:var(--text);
  font-weight:700;
}
.services-cart-modal__total strong{
  color:var(--orange);
  font-size:20px;
  font-weight:800;
}
.services-cart-modal__actions{
  display:flex;
  gap:8px;
}
.services-cart-modal__actions .btn{
  flex:1;
}
.services-cart-modal__actions--single .btn{
  width:100%;
}
.services-cart-modal__empty{
  color:var(--text3);
  font-size:13px;
  text-align:center;
  padding:18px 0;
}
@media (min-width: 769px){
  #services-cart-fab{ display:none !important; }
  #services-cart-gonext{ display:none !important; }
}

/* ── Кнопка «Далее» рядом с FAB корзины ───────────────────────── */
#services-cart-gonext{
  display:none;
  position:fixed;
  right:calc(18px + 56px + 10px);
  bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 12px);
  height:56px;
  padding:0 22px;
  border:none;
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(135deg, #ff8b3d 0%, #ff6b00 100%);
  color:#fff;
  font-size:15px;
  font-weight:700;
  font-family:inherit;
  cursor:pointer;
  z-index:898;
  box-shadow:0 10px 28px rgba(255,107,0,.38);
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  gap:6px;
  letter-spacing:.2px;
  transition:transform .15s,box-shadow .15s;
}
#services-cart-gonext:active{ transform:scale(.95); box-shadow:0 6px 16px rgba(255,107,0,.28); }

/* ── Services Booking Wizard ────────────────────────────────────── */
.swiz-overlay{ z-index:1200; }

.swiz-card{
  width:min(96vw, 520px);
  max-height:92dvh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:var(--ui-radius-lg,18px);
  padding:0;
}
.swiz-card .cmodal-head{
  flex-shrink:0;
  padding:16px 20px 14px;
  border-bottom:1px solid var(--line);
}
.swiz-body{
  flex:1;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:0 20px 20px;
}
/* Booking-форма внутри модалки — отступы и тени адаптируем */
.swiz-body .bform-card{
  box-shadow:none;
  border:none;
  padding:16px 0 0;
  margin:0;
}
.swiz-body .booking-layout{ display:block; }
.swiz-body .booking-summary{ display:none; }
.swiz-body .bform-nav{
  position:sticky;
  bottom:0;
  background:var(--bg-card,var(--surface));
  padding:12px 0 4px;
  margin-top:8px;
  border-top:1px solid var(--line);
  z-index:2;
}
.swiz-body .booking-steps{
  padding:14px 0 4px;
  margin-bottom:4px;
}
.swiz-body .booking-success{
  text-align:center;
  padding:24px 0;
}
/* ── PartsCart FAB ─────────────────────────────────────────────── */
#parts-cart-fab{
  display:none;
  position:fixed;
  right:18px;
  bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 80px); /* выше services-cart-fab */
  width:56px;
  height:56px;
  border:none;
  border-radius:50%;
  background:linear-gradient(180deg, #38bdf8 0%, #0ea5e9 100%);
  color:#fff;
  font-size:22px;
  cursor:pointer;
  z-index:897;
  box-shadow:0 10px 28px rgba(14,165,233,.38);
  align-items:center;
  justify-content:center;
}
#parts-cart-fab:active{ transform:scale(.95); }
@media (min-width: 769px){
  #parts-cart-fab{ display:none !important; }
}
/* Кнопка «В корзину» на карточке */
.parts-cart-btn.active{
  background:rgba(14,165,233,.12);
  border-color:#0ea5e9;
  color:#0ea5e9;
}

/* ── Floating back button — под-страницы категорий ─────────────── */
#section-back-fab {
  display: none;
  position: fixed;
  left: 18px;
  bottom: calc(var(--bottom-nav-h, 68px) + env(safe-area-inset-bottom, 0px) + 14px);
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--bg2);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: var(--text);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  z-index: 895;
  box-shadow: 0 4px 16px rgba(0,0,0,.28);
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s, background .12s;
}
#section-back-fab:active {
  transform: scale(.88);
  background: var(--surface);
}


.onb-next-btn{
  width:100%;
  min-height:44px;
  justify-content:center;
  margin-top:12px;
}

/* ── Booking wizard step 4 — auth confirmed block ──────────────── */
.booking-auth-confirmed{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  background:rgba(34,197,94,.08);
  border:1.5px solid rgba(34,197,94,.3);
  border-radius:var(--ui-radius-md,10px);
}
.booking-auth-confirmed__check{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#22c55e,#16a34a);
  color:#fff;font-size:18px;font-weight:900;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.booking-auth-confirmed__name{font-size:15px;font-weight:700;color:var(--text);}
.booking-auth-confirmed__phone{font-size:13px;color:var(--text3);margin-top:2px;}
.booking-auth-fields{ display:flex; flex-direction:column; gap:4px; }

/* ── Step 4 OTP row ─────────────────────────────────────────────── */
.bstep4-otp-row{
  display:flex;
  gap:10px;
  justify-content:center;
  margin:4px 0 8px;
}
.bstep4-otp-row .otp-box{
  width:54px;height:58px;
  border-radius:var(--ui-radius-md,10px);
  border:2px solid var(--line);
  background:var(--surface);
  font-size:24px;font-weight:800;
  text-align:center;
  color:var(--text);
  transition:border-color .15s;
  outline:none;
  font-family:inherit;
  -moz-appearance:textfield;
}
.bstep4-otp-row .otp-box:focus{ border-color:var(--orange); }
.bstep4-otp-row .otp-box::-webkit-inner-spin-button,
.bstep4-otp-row .otp-box::-webkit-outer-spin-button{ -webkit-appearance:none; }

/* ── Step 3 vehicle loading state ───────────────────────────────── */
.bv-loading{
  display:flex;
  align-items:center;
  gap:10px;
  padding:18px 14px;
  font-size:14px;
  color:var(--text3);
  background:var(--surface);
  border-radius:var(--ui-radius-md,10px);
  border:1.5px solid var(--line);
}
.bv-loading-dot{
  width:18px;height:18px;border-radius:50%;
  border:2px solid var(--orange);
  border-top-color:transparent;
  animation:bv-spin .7s linear infinite;
  flex-shrink:0;
}
@keyframes bv-spin{ to{ transform:rotate(360deg); } }

/* ── Vehicle add modal — должна быть выше booking wizard (z:1200) ── */
#vehicle-add-modal{ z-index: 1300 !important; }

/* ── Vehicle add modal — компактный размер внутри booking wizard ── */
.swiz-overlay ~ #vehicle-add-modal .cmodal-box,
body:has(.swiz-overlay.open) #vehicle-add-modal .cmodal-box{
  max-width:360px;
  padding:18px 16px 16px;
}
body:has(.swiz-overlay.open) #vehicle-add-modal .vehicle-quick-create-note{
  font-size:12px;
  margin-bottom:10px;
}
body:has(.swiz-overlay.open) #vehicle-add-modal .vehicle-quick-photo-box{
  display:none;
}
body:has(.swiz-overlay.open) #vehicle-add-modal .profile-form{
  gap:8px;
}
body:has(.swiz-overlay.open) #vehicle-add-modal .pf-input{
  padding:9px 11px;
  font-size:13px;
}

/* ══════════════════════════════════════════════════════
   Booking Step 3 — выбор автомобиля
══════════════════════════════════════════════════════ */
.bstep3-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:4px;
}

/* Карточка авто */
.bstep3-car-btn{
  display:flex;
  align-items:center;
  gap:13px;
  width:100%;
  padding:13px 14px;
  border:1.5px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
  cursor:pointer;
  text-align:left;
  transition:border-color .15s, background .15s;
  position:relative;
}
.bstep3-car-btn:not(.selected):hover{
  border-color:var(--orange);
  background:rgba(255,107,0,.04);
}
.bstep3-car-btn.selected{
  border-color:var(--orange);
  background:rgba(255,107,0,.07);
}

.bstep3-car-ico{
  font-size:24px;
  flex-shrink:0;
  width:36px;
  text-align:center;
}

.bstep3-car-main{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.bstep3-car-title{
  font-size:14px;
  font-weight:700;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bstep3-car-meta{
  font-size:12px;
  color:var(--text3);
}

.bstep3-car-check{
  font-size:16px;
  font-weight:800;
  color:var(--orange);
  flex-shrink:0;
}
.bstep3-car-badge{
  font-size:11px;
  font-weight:700;
  color:var(--orange);
  background:rgba(255,107,0,.1);
  border:1px solid rgba(255,107,0,.25);
  border-radius:999px;
  padding:2px 8px;
  flex-shrink:0;
}

/* Кнопка добавить */
.bstep3-add-row{
  margin-top:10px;
}
.bstep3-add-btn{
  width:100%;
  justify-content:center;
  font-size:13px;
  padding:10px 16px;
  border-radius:var(--ui-radius-md,10px);
  color:var(--text2);
  border-color:var(--line);
}
.bstep3-add-btn:hover{
  border-color:var(--orange);
  color:var(--orange);
}

/* Превью черновика */
.bstep3-preview-wrap{
  margin-top:14px;
}

/* ══════════════════════════════════════════════════════
   Loyalty — реальная система баллов
══════════════════════════════════════════════════════ */

/* Hero-блок */
.loy-hero{
  position:relative;
  overflow:hidden;
  padding:28px 24px 20px;
  text-align:center;
  margin-bottom:14px;
}
.loy-hero-glow{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.loy-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 16px;
  border-radius:999px;
  border:1.5px solid;
  font-size:13px;
  font-weight:800;
  margin-bottom:14px;
  letter-spacing:.3px;
  position:relative;
}
.loy-hero-pts{
  font-family:'Oswald',sans-serif;
  font-size:54px;
  font-weight:700;
  line-height:1;
  color:var(--text);
  letter-spacing:-1px;
  position:relative;
}
.loy-hero-sub{
  font-size:12px;
  color:var(--text3);
  margin-top:4px;
  margin-bottom:16px;
  position:relative;
}

/* Progress bar */
.loy-hero-bar-wrap{ position:relative; margin-bottom:12px; }
.loy-hero-bar{
  height:8px;
  border-radius:999px;
  background:var(--line);
  overflow:hidden;
  margin-bottom:6px;
}
.loy-hero-bar-fill{
  height:100%;
  border-radius:999px;
  transition:width .6s cubic-bezier(.4,0,.2,1);
  min-width:4px;
}
.loy-hero-bar-labels{
  display:flex;
  justify-content:space-between;
  font-size:11px;
  color:var(--text3);
  gap:8px;
}

/* Статы */
.loy-hero-stats{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  padding:12px 8px;
  margin:12px 0;
  position:relative;
}
.loy-hero-stat{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
}
.loy-hero-stat-val{
  font-family:'Oswald',sans-serif;
  font-size:18px;
  font-weight:700;
  color:var(--text);
  line-height:1;
}
.loy-hero-stat-lbl{
  font-size:10px;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.6px;
}
.loy-hero-stat-sep{
  width:1px;
  height:32px;
  background:var(--line);
  flex-shrink:0;
}
.loy-hero-actions{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  position:relative;
  margin-top:4px;
}

/* Уровни */
.loy-levels-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-bottom:14px;
}
.loy-lvl-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1.5px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
  opacity:.55;
  transition:opacity .2s,border-color .2s;
}
.loy-lvl-card.loy-lvl-done{ opacity:.85; }
.loy-lvl-card.loy-lvl-cur{
  opacity:1;
  border-color:var(--orange);
  background:rgba(255,107,0,.06);
}
.loy-lvl-ico{ font-size:22px; flex-shrink:0; }
.loy-lvl-body{ flex:1; min-width:0; }
.loy-lvl-name{
  font-size:13px;
  font-weight:700;
  color:var(--text);
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.loy-lvl-you{
  font-size:10px;
  font-weight:700;
  color:var(--orange);
  background:rgba(255,107,0,.12);
  padding:1px 6px;
  border-radius:999px;
}
.loy-lvl-range{ font-size:11px; color:var(--text3); margin-top:2px; }
.loy-lvl-disc{ font-size:12px; font-weight:700; margin-top:3px; }
.loy-lvl-tick{ font-size:16px; font-weight:800; flex-shrink:0; }

/* Как зарабатывать */
.loy-how{ padding:18px 20px; margin-bottom:14px; }
.loy-how-title{
  font-size:14px;
  font-weight:700;
  margin-bottom:14px;
  color:var(--text);
}
.loy-how-grid{ display:flex; flex-direction:column; gap:12px; }
.loy-how-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-size:13px;
}
.loy-how-item > span{ font-size:20px; flex-shrink:0; margin-top:1px; }
.loy-how-item b{ display:block; font-weight:700; color:var(--text); margin-bottom:2px; }
.loy-how-item p{ color:var(--text3); margin:0; font-size:12px; line-height:1.4; }

/* История транзакций */
.loy-history{ overflow:hidden; margin-bottom:14px; }
.loy-history-head{
  padding:14px 18px 10px;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.8px;
  color:var(--text3);
  border-bottom:1px solid var(--line);
}
.loy-history-body{ padding:0 18px; }
.loy-txn{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}
.loy-txn:last-child{ border-bottom:none; }
.loy-txn-pts{
  font-family:'Oswald',sans-serif;
  font-size:16px;
  font-weight:700;
  min-width:60px;
  text-align:right;
  flex-shrink:0;
}
.loy-txn-earn{ color:var(--green,#22c55e); }
.loy-txn-spend{ color:#ef4444; }
.loy-txn-body{ flex:1; min-width:0; }
.loy-txn-label{ font-size:13px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.loy-txn-date{ font-size:11px; color:var(--text3); margin-top:2px; }
.loy-history-empty{
  padding:20px 0;
  font-size:13px;
  color:var(--text3);
  line-height:1.5;
}

@media (max-width:480px){
  .loy-levels-grid{ grid-template-columns:1fr; }
  .loy-hero-pts{ font-size:44px; }
}

/* ══════════════════════════════════════════════════════
   Комментарии к новостям
══════════════════════════════════════════════════════ */
.nac-wrap{
  max-width:740px;
  margin:0 auto 40px;
  padding:0 16px;
}
.nac-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.nac-title{
  font-family:'Oswald',sans-serif;
  font-size:20px;
  font-weight:700;
  color:var(--text);
  margin:0;
}
.nac-count{
  font-size:13px;
  color:var(--text3);
  font-weight:500;
}
.nac-item{
  display:flex;
  gap:12px;
  margin-bottom:16px;
}
.nac-item-av{
  width:36px;
  height:36px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--orange),#ff8b3d);
  color:#fff;
  font-weight:800;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.nac-item-body{
  flex:1;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  padding:11px 14px;
}
.nac-item-meta{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
  flex-wrap:wrap;
}
.nac-item-name{
  font-size:13px;
  font-weight:700;
  color:var(--text);
}
.nac-item-date{
  font-size:11px;
  color:var(--text3);
}
.nac-del{
  margin-left:auto;
  background:none;
  border:none;
  color:var(--text3);
  cursor:pointer;
  font-size:14px;
  padding:0 4px;
  line-height:1;
  opacity:.6;
}
.nac-del:hover{ opacity:1; color:#ef4444; }
.nac-item-text{
  font-size:14px;
  color:var(--text);
  line-height:1.55;
  white-space:pre-wrap;
  word-break:break-word;
}
.nac-form{
  display:flex;
  gap:12px;
  margin-top:20px;
}
.nac-form-av{
  width:36px;
  height:36px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--orange),#ff8b3d);
  color:#fff;
  font-weight:800;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  margin-top:4px;
}
.nac-form-right{ flex:1; }
.nac-textarea{
  width:100%;
  padding:12px 14px;
  border:1.5px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg);
  color:var(--text);
  font-size:14px;
  font-family:inherit;
  resize:vertical;
  min-height:80px;
  box-sizing:border-box;
  transition:border-color .15s;
}
.nac-textarea:focus{ border-color:var(--orange); outline:none; }
.nac-form-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
}
.nac-form-who{
  font-size:12px;
  color:var(--text3);
}
.nac-empty{
  font-size:13px;
  color:var(--text3);
  padding:16px 0 20px;
  text-align:center;
}
.nac-login-hint{
  text-align:center;
  padding:20px 0;
}

/* ══════════════════════════════════════════════════════
   Отзывы — улучшенный дизайн
══════════════════════════════════════════════════════ */
.rvs-rating-block{
  display:flex;
  align-items:flex-start;
  gap:28px;
  padding:24px 28px;
  margin-bottom:28px;
  flex-wrap:wrap;
}
.rvs-rating-big{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  min-width:100px;
}
.rvs-avg{
  font-family:'Oswald',sans-serif;
  font-size:56px;
  font-weight:700;
  color:var(--text);
  line-height:1;
}
.rvs-stars{
  font-size:18px;
  color:#f5b800;
  letter-spacing:2px;
}
.rvs-count{
  font-size:12px;
  color:var(--text3);
  text-align:center;
}
.rvs-bars{
  flex:1;
  min-width:160px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.rvs-bar-row{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
}
.rvs-bar-n{ color:var(--text3); min-width:24px; text-align:right; }
.rvs-bar-track{
  flex:1;
  height:7px;
  background:var(--line);
  border-radius:999px;
  overflow:hidden;
}
.rvs-bar-fill{
  height:100%;
  background:linear-gradient(90deg,#f5b800,#ff8b3d);
  border-radius:999px;
  transition:width .5s ease;
  min-width:2px;
}
.rvs-bar-c{ color:var(--text3); min-width:18px; }
.rvs-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  align-self:center;
}

/* Форма отзыва */
.rvs-form-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}
.rvs-form-av{
  width:42px;
  height:42px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--orange),#ff8b3d);
  color:#fff;
  font-weight:800;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.rvs-form-who{ font-size:15px; font-weight:700; color:var(--text); }
.rvs-form-sub{ font-size:12px; color:var(--text3); margin-top:2px; }
.rvs-stars-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.rvs-stars-hint{
  font-size:12px;
  color:var(--text3);
}
.rvs-form-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  flex-wrap:wrap;
}
.rvs-login-cta{
  text-align:center;
  padding:24px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.rvs-login-ico{ font-size:36px; }
.rvs-login-title{ font-size:18px; font-weight:700; color:var(--text); }
.rvs-login-sub{ font-size:13px; color:var(--text3); max-width:320px; line-height:1.5; }

@media (max-width:560px){
  .rvs-rating-block{ padding:16px; gap:16px; }
  .rvs-avg{ font-size:44px; }
  .rvs-actions{ flex-direction:row; flex-wrap:wrap; }
}

/* ══════════════════════════════════════════════════════
   Cabinet Car — компактные карточки гаража
══════════════════════════════════════════════════════ */
.vcar-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
  padding-top:4px;
}
.vcar-title{
  font-family:'Oswald',sans-serif;
  font-size:20px;
  font-weight:700;
  margin:0;
  color:var(--text);
}
.vcar-grid{
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* Компактная карточка авто */
.vcard{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 14px;
  border:1.5px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
  cursor:pointer;
  text-align:left;
  width:100%;
  transition:border-color .15s,background .15s;
}
.vcard:hover{
  border-color:var(--orange);
  background:rgba(255,107,0,.04);
}
.vcard-ico{
  width:44px;
  height:44px;
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg2);
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex-shrink:0;
}
.vcard-ico-emoji{ font-size:24px; line-height:1; }
.vcard-ico-img{ width:100%; height:100%; object-fit:cover; border-radius:var(--ui-radius-md,10px); }
.vcard-body{ flex:1; min-width:0; }
.vcard-title{
  font-size:14px;
  font-weight:700;
  color:var(--text);
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.vcard-sub{
  font-size:12px;
  color:var(--text3);
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.vcard-def-badge{
  font-size:10px;
  font-weight:700;
  color:var(--orange);
  background:rgba(255,107,0,.1);
  border:1px solid rgba(255,107,0,.25);
  border-radius:999px;
  padding:2px 7px;
}
.vcard-arrow{
  font-size:18px;
  color:var(--text3);
  flex-shrink:0;
}

/* ── Vehicle Detail Modal ── */
.vdm-box{
  max-width:480px;
  max-height:88vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.vdm-body{
  overflow-y:auto;
  flex:1;
  padding-bottom:8px;
}
.vdm-photo-wrap{
  margin-bottom:14px;
  border-radius:var(--ui-radius-md,10px);
  overflow:hidden;
  max-height:180px;
}
.vdm-photo{ width:100%; height:180px; object-fit:cover; display:block; }

.vdm-hero{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
.vdm-hero-ico{
  font-size:28px;
  width:48px;
  height:48px;
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg2);
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.vdm-hero-title{ font-size:16px; font-weight:700; color:var(--text); }
.vdm-hero-sub{ font-size:12px; color:var(--text3); margin-top:2px; }

.vdm-fill-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}
.vdm-fill-bar{
  flex:1;
  height:6px;
  background:var(--line);
  border-radius:999px;
  overflow:hidden;
}
.vdm-fill-bar > div{
  height:100%;
  border-radius:999px;
  min-width:4px;
}
.vdm-fill-bar.good > div{ background:#22c55e; }
.vdm-fill-bar.mid  > div{ background:#f5b800; }
.vdm-fill-bar.low  > div{ background:#ef4444; }
.vdm-fill-lbl{ font-size:11px; color:var(--text3); flex-shrink:0; }

.vdm-stats{
  display:flex;
  gap:0;
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  padding:10px 8px;
  margin-bottom:16px;
}
.vdm-stat{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  border-right:1px solid var(--line);
}
.vdm-stat:last-child{ border-right:none; }
.vdm-stat b{ font-family:'Oswald',sans-serif; font-size:17px; font-weight:700; color:var(--text); }
.vdm-stat span{ font-size:10px; color:var(--text3); text-transform:uppercase; letter-spacing:.5px; }

.vdm-section-title{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.8px;
  color:var(--text3);
  margin:14px 0 8px;
}
.vdm-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin-bottom:4px;
}
.vdm-field{
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  padding:8px 10px;
}
.vdm-field-lbl{ display:block; font-size:10px; color:var(--text3); margin-bottom:3px; }
.vdm-field-val{ display:block; font-size:13px; font-weight:600; color:var(--text); word-break:break-word; }

.vdm-actions{
  display:flex;
  gap:8px;
  margin-top:16px;
  flex-wrap:wrap;
}
.vdm-actions .btn{ flex:1; justify-content:center; min-width:80px; }
.vdm-del{ color:#ef4444 !important; border-color:#ef444440 !important; }

#vehicle-detail-modal{ z-index:1200 !important; }

/* ── Cab avatar — фото из галереи ── */
.cab-avatar-wrap{
  position:relative;
}
.cab-avatar--photo{
  width:64px;
  height:64px;
  border-radius:50%;
  object-fit:cover;
  border:3px solid var(--orange);
  display:block;
}
.cab-av-camera{
  position:absolute;
  bottom:0;
  right:0;
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--orange);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  box-shadow:0 1px 4px rgba(0,0,0,.3);
  pointer-events:none;
}
.cab-avatar-wrap:hover .cab-av-camera{
  transform:scale(1.15);
  transition:transform .15s;
}

/* ══════════════════════════════════════════════════════
   Cabinet Stats Tab
══════════════════════════════════════════════════════ */
.cst-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-bottom:22px;
}
.cst-card{
  padding:16px 14px;
  text-align:center;
  border-radius:var(--ui-radius-md,10px);
}
.cst-card-ico{ font-size:22px; margin-bottom:6px; }
.cst-card-val{
  font-family:'Oswald',sans-serif;
  font-size:24px;
  font-weight:700;
  color:var(--text);
  line-height:1;
  margin-bottom:4px;
}
.cst-card-lbl{ font-size:11px; color:var(--text3); text-transform:uppercase; letter-spacing:.6px; }

.cst-section-title{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.8px;
  color:var(--text3);
  margin:18px 0 10px;
}
.cst-orders{ display:flex; flex-direction:column; gap:6px; }
.cst-order-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  cursor:pointer;
  text-align:left;
  width:100%;
  transition:border-color .15s;
}
.cst-order-row:hover{ border-color:var(--orange); }
.cst-order-ico{ font-size:18px; flex-shrink:0; }
.cst-order-body{ flex:1; min-width:0; }
.cst-order-name{
  display:block;
  font-size:13px;
  font-weight:600;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cst-order-meta{ display:block; font-size:11px; color:var(--text3); margin-top:2px; }
.cst-order-price{ font-size:13px; font-weight:700; color:var(--orange); flex-shrink:0; }
.cst-empty{ padding:18px 0; font-size:13px; color:var(--text3); display:flex; align-items:center; }

.cst-actions{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-bottom:20px;
}
.cst-action-btn{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:14px 8px 12px;
  background:var(--surface);
  border:1.5px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  cursor:pointer;
  font-size:22px;
  transition:border-color .15s,background .15s;
}
.cst-action-btn:hover{ border-color:var(--orange); background:rgba(255,107,0,.05); }
.cst-action-btn span{ font-size:11px; color:var(--text2); font-weight:600; }

@media(max-width:400px){
  .cst-grid{ grid-template-columns:repeat(2,1fr); }
  .cst-actions{ grid-template-columns:repeat(2,1fr); }
}



/* Vehicle add modal — correct mobile scroll with sticky header/footer */
#vehicle-add-modal{
  align-items:center;
  justify-content:center;
  padding:12px;
  overflow:hidden;
}
#vehicle-add-modal .vehicle-add-modal-box{
  width:min(100vw - 24px, 560px) !important;
  max-height:min(92dvh, calc(100dvh - 24px));
  padding:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
#vehicle-add-modal .vehicle-add-modal-head{
  position:sticky;
  top:0;
  z-index:3;
  flex-shrink:0;
  background:linear-gradient(180deg, rgba(20,24,33,.98), rgba(20,24,33,.94));
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
#vehicle-add-modal .vehicle-add-modal-body{
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:16px 18px calc(16px + env(safe-area-inset-bottom, 0px));
}
#vehicle-add-modal .vehicle-add-modal-grid{
  align-items:start;
}
#vehicle-add-modal .vehicle-add-modal-form{
  min-width:0;
}
#vehicle-add-modal .vehicle-add-modal-actions{
  position:sticky;
  bottom:0;
  z-index:2;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  grid-column:1/-1;
  margin-top:8px;
  padding-top:12px;
  padding-bottom:max(2px, env(safe-area-inset-bottom, 0px));
  background:linear-gradient(180deg, rgba(20,24,33,0), rgba(20,24,33,.96) 22%);
}
@media (max-width:720px){
  #vehicle-add-modal{
    align-items:flex-end;
    padding:8px;
  }
  #vehicle-add-modal .vehicle-add-modal-box{
    width:min(100vw - 16px, 560px) !important;
    max-height:min(94dvh, calc(100dvh - 12px));
    border-radius:var(--ui-radius-lg,18px);
  }
  #vehicle-add-modal .vehicle-add-modal-body{
    padding:14px 14px calc(14px + env(safe-area-inset-bottom, 0px));
  }
  #vehicle-add-modal .vehicle-add-modal-actions .btn{
    width:100%;
    flex:1 1 100%;
  }
}

/* ── Приёмка авто: пульс ─────────────────────────────────────── */
@keyframes _karetaPulse {
  0%,100% { opacity:1; box-shadow:0 0 0 2px rgba(34,197,94,.5); }
  50%      { opacity:.92; box-shadow:0 0 0 5px rgba(34,197,94,.15); }
}

/* ── Parts Modal: bottom sheet mobile ────────────────────────── */
#master-parts-modal.open {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(4px);
}
#master-parts-modal > div {
  animation: _sheetSlideUp .28s cubic-bezier(.32,1,.6,1);
  width: 100%;
}
@keyframes _sheetSlideUp {
  from { transform: translateY(60px); opacity: .4; }
  to   { transform: translateY(0);    opacity: 1;  }
}

/* ── btn-ghost ────────────────────────────────────────────────── */
.btn.btn-ghost {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--text2);
}
.btn.btn-ghost:active { opacity: .7; }

/* ── Catalog items ────────────────────────────────────────────── */
.mp-cat-item { transition: background .12s; }
.mp-cat-item:active { background: var(--surface) !important; }

@media (min-width: 640px) {
  #master-parts-modal > div {
    border-radius: var(--ui-radius-lg,18px);
    max-height: 88vh !important;
    margin: auto;
    position: relative !important;
    bottom: auto !important;
  }
  #master-parts-modal.open {
    align-items: center;
  }
}

/* ── Master Cabinet: scrollable tab nav ──────────────────────── */
#mp-cabinet [data-subtabs="cabinet"] {
  scrollbar-width: none;
}
#mp-cabinet [data-subtabs="cabinet"]::-webkit-scrollbar { display: none; }

/* ── Resume editor ────────────────────────────────────────────── */
#master-resume-editor { animation: _karetaPulse .3s ease; }

/* ── Stat grid 3-col ─────────────────────────────────────────── */
@media (max-width: 400px) {
  .mcab-stat-grid { grid-template-columns: repeat(2,1fr) !important; }
}

/* ── Masters public page ───────────────────────────────────────── */
.master-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}
.master-post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}
#master-create-post, #master-post-detail {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  backdrop-filter: blur(4px); z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  animation: fadeIn .2s ease;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
#master-create-post:not(.open), #master-post-detail:not(.open) { display: none; }

/* Кнопка публикации на выполненных заявках */
.btn-publish-story {
  color: #34d399; border-color: rgba(52,211,153,.3);
}

/* ═══════════════════════════════════════════════════════════
   СТРАНИЦА МАСТЕРОВ — карточки и профиль
   ═══════════════════════════════════════════════════════════ */

/* ── Грид-сетка карточек ── */
.masters-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
}

/* ── Карточка мастера ── */
.master-card {
  border-radius: var(--ui-radius-lg,18px);
  overflow: hidden;
  background: var(--bg2);
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  cursor: pointer;
  transition: transform .18s, box-shadow .18s, border-color .18s;
  text-decoration: none;
  color: inherit;
}
.master-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 56px rgba(0,0,0,.35);
  border-color: var(--mc, var(--orange-brd));
}
.master-card:focus-visible {
  outline: 2px solid var(--mc, var(--orange));
  outline-offset: 2px;
}

/* Cover-зона */
.master-card__cover {
  height: 120px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--mc-dim, rgba(52,211,153,.15)), transparent);
}
.master-card__cover img {
  width: 100%; height: 100%; object-fit: cover; opacity: .45;
}
.master-card__cover-icon {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 56px; opacity: .1;
}
.master-card__cover-grad {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 30%, rgba(0,0,0,.5));
}
.master-card__rating-badge {
  position: absolute; top: 10px; right: 10px;
  background: rgba(0,0,0,.65); backdrop-filter: blur(8px);
  padding: 3px 10px; border-radius: 99px;
  font-size: 12px; font-weight: 700; color: #fbbf24;
}
.master-card__posts-badge {
  position: absolute; top: 10px; left: 10px;
  background: rgba(0,0,0,.55); backdrop-filter: blur(6px);
  padding: 3px 9px; border-radius: 99px;
  font-size: 11px; color: var(--on-surface);
}
.master-card__status {
  position: absolute; left: 12px; bottom: 12px;
  z-index: 2;
  padding: 4px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
  border: 1px solid var(--surface-c);
  background: rgba(12,18,27,.72);
  color: #fff;
}
.master-card__status--online { color: #86efac; }
.master-card__status--replying { color: #fcd34d; }
.master-card__status--busy { color: #fca5a5; }

/* Аватар */
.master-card__avatar {
  position: absolute; bottom: -24px; left: 16px;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--mc-dim, rgba(52,211,153,.2));
  border: 3px solid var(--bg2);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700;
  color: var(--mc, #34d399);
  box-shadow: 0 2px 14px rgba(0,0,0,.4);
}

/* Body */
.master-card__body {
  padding: 32px 16px 12px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.master-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.master-card__name {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; line-height: 1.15;
}
.master-card__price {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 800;
  color: var(--mc, #34d399);
  background: var(--mc-dim, rgba(52,211,153,.12));
  border: 1px solid var(--mc-brd, rgba(52,211,153,.25));
  padding: 6px 10px;
  border-radius: var(--ui-radius-md,10px);
}
.master-card__biz {
  font-size: 11px; font-weight: 700;
  color: var(--mc, #34d399);
  display: flex; align-items: center; gap: 4px;
}
.master-card__spec {
  font-size: 12px; color: var(--text2); margin-top: 2px;
}
.master-card__addr {
  font-size: 11px; color: var(--text3);
  display: flex; align-items: center; gap: 4px; margin-top: 2px;
}
.master-card__shop {
  font-size: 11px; color: var(--mc, #34d399);
  display: flex; align-items: center; gap: 4px; margin-top: 2px;
}
.master-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.master-card__meta-item {
  font-size: 11px;
  color: var(--text3);
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-a);
  border: 1px solid var(--line);
}
.master-card__stats {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px;
}
.master-card__stat {
  font-size: 11px; color: var(--text2);
  padding: 3px 8px; border-radius: var(--ui-radius-sm,5px);
}
.master-card__stat--green  { background: rgba(52,211,153,.08); border: 1px solid rgba(52,211,153,.2); }
.master-card__stat--blue   { background: rgba(96,165,250,.08); border: 1px solid rgba(96,165,250,.2); }
.master-card__stat--violet { background: rgba(167,139,250,.10); border: 1px solid rgba(167,139,250,.24); }
.master-card__services,
.master-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.master-card__service,
.master-card__badge {
  font-size: 11px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--mc-dim, rgba(52,211,153,.1));
  border: 1px solid var(--mc-brd, rgba(52,211,153,.2));
  color: var(--mc, #34d399);
  font-weight: 700;
}
.master-card__badge {
  background: var(--surface-a);
  color: var(--text2);
  border-color: var(--line);
}

/* Footer */
.master-card__footer {
  padding: 12px 16px 16px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.master-card__action {
  appearance: none;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  min-height: 40px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.master-card__action:hover {
  transform: translateY(-1px);
}
.master-card__action--ghost {
  background: var(--surface-a);
  color: var(--text);
}
.master-card__action--outline {
  background: transparent;
  border-color: var(--mc-brd, rgba(52,211,153,.25));
  color: var(--mc, #34d399);
}
.master-card__action--primary {
  background: linear-gradient(180deg, var(--mc, #34d399), color-mix(in srgb, var(--mc, #34d399) 70%, #0b1320));
  color: #07111b;
  border-color: transparent;
}

/* ── Профиль мастера — Hero ── */
.master-profile-hero {
  border-bottom: 1px solid var(--line);
  padding: 24px 0 32px;
}
.master-profile-hero__inner {
  display: flex; gap: 22px; align-items: flex-start; flex-wrap: wrap;
}
.master-profile-hero__avatar {
  width: 92px; height: 92px;
  border-radius: 50%;
  background: var(--mc-dim, rgba(52,211,153,.15));
  border: 3px solid var(--mc, #34d399);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 34px; font-weight: 700;
  color: var(--mc, #34d399);
  flex-shrink: 0;
  box-shadow: 0 4px 24px var(--mc-dim, rgba(52,211,153,.3));
}
.master-profile-hero__name {
  font-family: 'Oswald', sans-serif;
  font-size: 30px; font-weight: 700; line-height: 1.1;
}
.master-profile-hero__biz {
  font-size: 13px; color: var(--mc, #34d399);
  font-weight: 600; margin-top: 5px;
  display: flex; align-items: center; gap: 5px;
}
.master-profile-hero__spec {
  font-size: 14px; color: var(--text2); margin-top: 5px;
}
.master-profile-badges {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
}
.master-profile-badge {
  display: flex; align-items: center; gap: 5px;
  padding: 5px 13px; border-radius: 99px;
  font-size: 12px; font-weight: 600;
}
.master-profile-badge--gold   { background: rgba(251,191,36,.1); border: 1px solid rgba(251,191,36,.28); color: #fbbf24; }
.master-profile-badge--blue   { background: rgba(96,165,250,.1); border: 1px solid rgba(96,165,250,.25); color: #60a5fa; }
.master-profile-badge--green  { background: rgba(52,211,153,.1); border: 1px solid rgba(52,211,153,.25); color: #34d399; }
.master-profile-badge--muted  { background: var(--surface); border: 1px solid var(--line); color: var(--text2); }

/* CTA */
.master-profile-cta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}
.master-profile-cta--compact {
  max-width: 360px;
}
.master-profile-action {
  min-height: 44px;
  border-radius: var(--ui-radius-md,10px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1;
}
.master-profile-action--order {
  padding: 0 18px;
  font-size: 14px;
  font-weight: 800;
}
.master-profile-action--icon {
  width: 44px;
  min-width: 44px;
  padding: 0;
  font-size: 20px;
}
.master-profile-action__ico {
  font-size: 16px;
  line-height: 1;
}
.master-profile-action__label {
  display: inline-block;
}

/* Секции профиля */
.master-section {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 22px 24px;
}
.master-section__title {
  font-family: 'Oswald', sans-serif;
  font-size: 17px; font-weight: 700;
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}

/* Посты-работы в профиле */
.master-posts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}
.master-post-card {
  border-radius: var(--ui-radius-md,10px); overflow: hidden;
  background: var(--bg2);
  border: 1px solid var(--line);
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  display: flex; flex-direction: column;
}
.master-post-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 32px rgba(0,0,0,.3);
}
.master-post-card__cover {
  height: 140px; position: relative; overflow: hidden;
}
.master-post-card__cover img {
  width: 100%; height: 100%; object-fit: cover;
}
.master-post-card__cover-icon {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 40px; opacity: .2;
}
.master-post-card__cover-grad {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 40%, rgba(0,0,0,.55));
}
.master-post-card__cat-badge {
  position: absolute; top: 8px; left: 8px;
  color: #fff; font-size: 10px; font-weight: 700;
  padding: 3px 9px; border-radius: 99px;
}
.master-post-card__photos-badge {
  position: absolute; top: 8px; right: 8px;
  background: rgba(0,0,0,.55); backdrop-filter: blur(6px);
  color: #fff; font-size: 10px; padding: 3px 8px; border-radius: 99px;
}
.master-post-card__body {
  padding: 11px 13px;
  flex: 1; display: flex; flex-direction: column; gap: 4px;
}
.master-post-card__title {
  font-weight: 700; font-size: 14px; line-height: 1.4;
}
.master-post-card__preview {
  font-size: 12px; color: var(--text2); line-height: 1.5;
}
.master-post-card__meta {
  display: flex; align-items: center; gap: 8px;
  margin-top: 5px; flex-wrap: wrap;
}
.master-post-card__meta-item {
  font-size: 11px; color: var(--text3);
}

/* Отзыв */
.master-review-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 15px 18px;
}
.master-review-card__header {
  display: flex; align-items: center;
  justify-content: space-between; gap: 8px;
  margin-bottom: 8px;
}
.master-review-card__name { font-weight: 700; font-size: 13px; }
.master-review-card__stars { color: #fbbf24; font-size: 15px; letter-spacing: 1px; }
.master-review-card__text { font-size: 13px; color: var(--text2); line-height: 1.6; }
.master-review-card__date { font-size: 11px; color: var(--text3); margin-top: 5px; }

/* CTA-banner в профиле */
.master-cta-banner {
  border-radius: var(--ui-radius-md,10px);
  padding: 24px;
  text-align: center;
  border: 1px solid var(--mc-brd, rgba(52,211,153,.2));
}
.master-cta-banner__title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; margin-bottom: 6px;
}
.master-cta-banner__sub {
  font-size: 13px; color: var(--text2); margin-bottom: 18px;
}
.master-cta-banner__btns {
  display: flex; justify-content: center; gap: 10px; flex-wrap: wrap;
}

/* Пустое состояние мастеров */
.masters-empty {
  text-align: center; padding: 56px 20px;
}
.masters-empty__icon { font-size: 52px; margin-bottom: 14px; }
.masters-empty__title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; margin-bottom: 8px;
}
.masters-empty__sub { font-size: 14px; color: var(--text3); }

/* Hero страницы мастеров */
.masters-hero {
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 36px 0 28px;
}
.masters-hero__title {
  font-family: 'Oswald', sans-serif;
  font-size: 30px; font-weight: 700; margin-bottom: 8px;
}
.masters-hero__sub {
  font-size: 14px; color: var(--text2); max-width: 540px; line-height: 1.6;
}

/* Мобильные адаптации */
@media (max-width: 600px) {
  .masters-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .master-card__cover { height: 90px; }
  .master-card__avatar { width: 42px; height: 42px; font-size: 16px; bottom: -18px; }
  .master-card__body { padding: 24px var(--ui-radius-md,10px) var(--ui-radius-md,10px); }
  .master-card__name { font-size: 15px; }
  .master-card__footer { grid-template-columns: 1fr; }
  .master-card__action { min-height: 38px; }
  .master-profile-hero__avatar { width: 72px; height: 72px; font-size: 26px; }
  .master-profile-hero__name { font-size: 24px; }
  .master-profile-cta { width: 100%; max-width: none; margin-left: 0; justify-content: flex-start; }
  .master-profile-action--order { flex: 1 1 auto; min-width: 0; padding: 0 14px; font-size: 14px; }
  .master-profile-action--icon { width: 44px; min-width: 44px; }
  .master-section { padding: 16px; }
  .master-posts-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
}
@media (max-width: 400px) {
  .masters-grid { grid-template-columns: 1fr; }
}


.master-card[data-master-id]{ cursor:pointer; }
.master-card[data-master-id]:focus-visible{ outline:2px solid var(--orange); outline-offset:3px; }
.master-card[data-master-id] > *{ pointer-events:none; }
.master-card[data-master-id] [data-no-master-open],
.master-card[data-master-id] button,
.master-card[data-master-id] a,
.master-card[data-master-id] input,
.master-card[data-master-id] select,
.master-card[data-master-id] textarea,
.master-card[data-master-id] label{ pointer-events:auto; }


/* MASTERS HERO aligned to services */
.masters-hero.spa-page-hero {
  position: relative;
}
.masters-hero .spa-hero-bg {
  opacity: .98;
}
.masters-hero__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.masters-content {
  padding-top: 0;
}
@media (max-width: 768px){
  .masters-hero__actions {
    display: none;
  }
}


.news-compose-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(4,10,24,.72);z-index:9800;padding:16px}
.news-compose-box{width:min(860px,100%);max-height:min(92vh,920px);overflow:auto;background:var(--bg2);border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);box-shadow:0 30px 80px rgba(0,0,0,.34);padding:28px;position:relative}
.news-compose-box--catalog{width:min(920px,100%)}
.news-compose-close{position:absolute;right:16px;top:16px;border:0;background:transparent;color:var(--text2);font-size:24px;cursor:pointer}
.news-compose-head{margin-bottom:18px}
.news-compose-kicker{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);margin-bottom:6px}
.news-compose-title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1.05}
.news-compose-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.news-compose-field--full{grid-column:1/-1}
.news-compose-field label{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);margin-bottom:7px}
.news-compose-field input,.news-compose-field select,.news-compose-field textarea{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px 14px;color:var(--text);font:inherit;outline:none}
.news-compose-field textarea{resize:vertical;min-height:110px}
.news-compose-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;flex-wrap:wrap}
.my-news-item{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.my-news-item:last-child{border-bottom:0}
.my-news-item__main{min-width:0;flex:1}
.my-news-item__title{font-weight:800;font-size:16px;margin-bottom:4px}
.my-news-item__meta{font-size:12px;color:var(--text3);margin-bottom:8px}
.my-news-item__intro{font-size:13px;color:var(--text2)}
.my-news-item__actions{display:flex;gap:10px;flex-wrap:wrap;flex-shrink:0}
@media (max-width: 768px){
  .news-compose-box{padding:22px 16px 18px;border-radius:var(--ui-radius-lg,18px)}
  .news-compose-grid{grid-template-columns:1fr}
  .my-news-item{flex-direction:column}
  .my-news-item__actions{width:100%}
  .my-news-item__actions .btn{flex:1}
}

/* m18 nav cleanup */
.nav-userbox{position:relative;display:flex;align-items:center}
.nav-userbox .nav-avatar{border:none;cursor:pointer}
.nav-profile-menu{position:absolute;top:calc(100% + 10px);right:0;display:none;min-width:210px;padding:8px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:rgba(18,20,24,.96);backdrop-filter:blur(12px);box-shadow:0 18px 40px rgba(0,0,0,.28);z-index:40}
.nav-profile-menu.is-open{display:grid;gap:4px}
.nav-profile-menu button{appearance:none;border:none;background:transparent;color:var(--text);text-align:left;padding:11px 12px;border-radius:var(--ui-radius-md,10px);font:inherit;cursor:pointer}
.nav-profile-menu button:hover{background:var(--surface-b)}
.nav-links .nav-link[data-page="booking"]{font-weight:800}
@media (max-width: 1180px){
  .nav-links{gap:10px}
  .nav-links .nav-link{font-size:13px}
}


.home-news-strip{padding:10px 0 38px}.home-news-strip__actions{display:flex;justify-content:flex-end;margin-top:18px}.home-news-strip .news-grid{margin-top:18px}

.nav-userbox{position:relative;display:flex;align-items:center;min-width:44px;justify-content:center}
.nav-userbox:not(.is-authenticated) #navProfileMenu{display:none!important}
.nav-profile-menu button.is-danger{color:#ffb4b4}

/* HERO SYSTEM UNIFICATION v20260411m28 */
:root{
  --hero-title-size: clamp(30px, 4.2vw, 46px);
  --hero-title-lh: 1.08;
  --hero-sub-size: 14px;
  --hero-sub-lh: 1.7;
  --hero-block-gap: 12px;
  --hero-body-max: 760px;
}

.spa-page-hero{
  padding: 40px 0 32px;
}

.spa-page-hero .container{
  position: relative;
}

.spa-page-hero .spa-hero-body{
  display: grid !important;
  align-content: start;
  gap: 0;
  max-width: var(--hero-body-max);
  min-height: 0;
}

.spa-page-hero .spa-hero-label{
  margin: 0 0 10px;
}

.spa-page-hero .spa-hero-title{
  font-family: 'Oswald', sans-serif !important;
  font-size: var(--hero-title-size);
  line-height: var(--hero-title-lh) !important;
  font-weight: 700;
  letter-spacing: 0;
  margin: 0 0 12px;
  max-width: var(--hero-body-max);
  text-wrap: balance;
}

.spa-page-hero .spa-hero-sub{
  font-size: var(--hero-sub-size);
  line-height: var(--hero-sub-lh) !important;
  max-width: 640px;
  margin: 0 0 20px;
}

.spa-page-hero .sec-line{
  margin: 0 0 14px;
}

.spa-page-hero .spa-hero-stats{
  margin: 0 0 18px;
  max-width: 640px;
}

.spa-page-hero .masters-hero__actions,
.spa-page-hero .spa-hero-actions{
  margin-top: 0;
}

.spa-page-hero--catalog .spa-hero-title{
  --hero-title-size: clamp(32px, 4.6vw, 48px);
}

.spa-page-hero--content .spa-hero-title{
  --hero-title-size: clamp(30px, 4.1vw, 44px);
}

.spa-page-hero--article .spa-hero-body{
  max-width: 860px;
}

.spa-page-hero--article .spa-hero-title{
  --hero-title-size: clamp(28px, 3.9vw, 42px);
  max-width: 860px;
}

.spa-page-hero--compact .spa-hero-title{
  --hero-title-size: clamp(28px, 3.6vw, 38px);
}

#hero-masters .spa-hero-title,
#hero-services .spa-hero-title,
#hero-parts .spa-hero-title,
#hero-news .spa-hero-title,
#hero-about .spa-hero-title,
#hero-myorders .spa-hero-title,
#hero-news-article .spa-hero-title{
  min-height: 0 !important;
}

@media (max-width: 767px){
  :root{
    --hero-title-size: clamp(24px, 7vw, 30px);
    --hero-sub-size: 13px;
  }
  .spa-page-hero{
    padding: 28px 0 22px;
  }
  .spa-page-hero .spa-hero-title{
    margin-bottom: 10px;
    text-wrap: pretty;
  }
  .spa-page-hero .spa-hero-sub{
    margin-bottom: 16px;
  }
}


.master-fallback-card{max-width:760px;margin:32px auto;text-align:center}
.master-fallback-icon{font-size:42px;margin-bottom:12px}
.master-profile-page .chips-row{display:flex;flex-wrap:wrap;gap:10px}
.master-profile-page .chip,.master-profile-page .badge{display:inline-flex;align-items:center;min-height:34px;padding:8px 12px;border-radius:999px;background:#15171c;border:1px solid var(--surface-b)}
.master-profile-page .chip-muted,.master-profile-page .badge-muted{opacity:.72}


.master-card__body--compact{padding-bottom:6px}.master-card__body--compact .master-card__meta{margin-top:10px}.master-card__body--compact .master-card__services{margin-top:10px}.master-profile-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:4px}.master-profile-info-item{padding:12px 14px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--bg2);display:flex;flex-direction:column;gap:6px}.master-profile-info-item span{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--text3);font-weight:700}.master-profile-info-item strong{font-size:14px;color:var(--text1)}.master-profile-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.master-profile-chip{display:inline-flex;align-items:center;min-height:34px;padding:8px 12px;border-radius:999px;background:#15171c;border:1px solid var(--surface-b)}.master-profile-chip--muted{opacity:.78}

/* ═══════════════════════════════════════════════════════════
   MASTER MODAL — большое модальное окно (Level 2 по ТЗ)
═══════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════════
   UNIFIED MODAL SYSTEM — bottom sheet + center dialog
═══════════════════════════════════════════════════════════════════ */

/* Base overlay — все модалки используют */
.k-overlay {
  position: fixed; inset: 0;
  z-index: 8200;
  background: rgba(7,17,27,.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity .22s ease;
}
.k-overlay.open { opacity: 1; }
.k-overlay.center { align-items: center; }

/* Sheet panel */
.k-sheet {
  width: min(640px, 100%);
  max-height: 92dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  transform: translateY(100%);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
  overflow: hidden;
}
.k-overlay.open .k-sheet { transform: translateY(0); }

/* Center dialog */
.k-dialog {
  width: min(540px, 92vw);
  max-height: 88dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  display: flex; flex-direction: column;
  transform: scale(.94) translateY(8px);
  transition: transform .24s cubic-bezier(.16,1,.3,1), opacity .22s ease;
  overflow: hidden;
  opacity: 0;
}
.k-overlay.open .k-dialog { transform: scale(1) translateY(0); opacity: 1; }

/* Sheet head */
.k-sheet-head {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 12px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.k-sheet-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; color: var(--text);
  line-height: 1.2;
}
.k-sheet-sub {
  font-size: 12px; color: var(--text3); margin-top: 3px;
}
.k-sheet-close {
  width: 32px; height: 32px; flex-shrink: 0;
  border-radius: 50%; border: 1px solid var(--line);
  background: var(--bg3); color: var(--text2);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; cursor: pointer;
  transition: background .15s, color .15s;
}
.k-sheet-close:hover { background: var(--line); color: var(--text); }

/* Sheet body */
.k-sheet-body {
  flex: 1; overflow-y: auto;
  padding: 16px 20px 20px;
  overscroll-behavior: contain;
}

/* Sheet footer */
.k-sheet-footer {
  padding: 14px 20px 16px;
  border-top: 1px solid var(--line);
  display: flex; gap: 10px; flex-shrink: 0;
  background: var(--bg2);
}
.k-sheet-footer .btn { flex: 1; }

/* Drag indicator */
.k-sheet-drag {
  width: 36px; height: 4px;
  border-radius: var(--ui-radius-sm,5px);
  background: var(--line2, var(--line));
  margin: 10px auto 0;
  flex-shrink: 0;
}

/* Light theme */
[data-theme="light"] .k-overlay { background: rgba(0,0,0,.45); }
[data-theme="light"] .k-sheet,
[data-theme="light"] .k-dialog { background: #fff; border-color: rgba(0,0,0,.08); }

/* ═══════════════════════════════════════════════════════════════════
   SVC-MODAL — модалка услуги (улучшения)
═══════════════════════════════════════════════════════════════════ */
.svc-modal-box {
  width: min(640px, 100%);
  max-height: 88dvh;
  background: var(--bg2);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  border: 1px solid var(--line);
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(40px);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
}
.cmodal-overlay.open .svc-modal-box { transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════════
   NEWS MODAL
═══════════════════════════════════════════════════════════════════ */
.news-modal-overlay {
  position: fixed; inset: 0; z-index: 8400;
  background: rgba(7,17,27,.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0; transition: opacity .22s ease;
}
.news-modal-overlay.open { opacity: 1; }
.news-modal-box {
  width: min(680px, 100%);
  max-height: 94dvh;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  overflow-y: auto;
  transform: translateY(60px);
  transition: transform .3s cubic-bezier(.16,1,.3,1);
  overscroll-behavior: contain;
}
.news-modal-overlay.open .news-modal-box { transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════════
   MASTER MODAL
═══════════════════════════════════════════════════════════════════ */
.master-modal-overlay {
  position: fixed; inset: 0; z-index: 8300;
  background: rgba(7,17,27,.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0; transition: opacity .22s ease;
}
.master-modal-overlay.open { opacity: 1; }
.master-modal-box {
  width: min(640px, 100%);
  max-height: 92dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(50px);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
}
.master-modal-overlay.open .master-modal-box { transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════════
   PARTS MODAL — заказ запчасти
═══════════════════════════════════════════════════════════════════ */
.parts-order-overlay {
  position: fixed; inset: 0; z-index: 8300;
  background: rgba(7,17,27,.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0; transition: opacity .22s ease;
}
.parts-order-overlay.open { opacity: 1; }
.parts-order-box {
  width: min(560px, 100%);
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  max-height: 90dvh;
  transform: translateY(40px);
  transition: transform .26s cubic-bezier(.16,1,.3,1);
}
.parts-order-overlay.open .parts-order-box { transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════════
   APP SETTINGS MODAL
═══════════════════════════════════════════════════════════════════ */
#app-settings-modal {
  position: fixed; inset: 0;
  z-index: 9700;
  background: rgba(7,17,27,.75);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity .22s ease;
}
#app-settings-modal.open { opacity: 1; }
#app-settings-modal .cmodal-shell {
  width: min(600px, 100%);
  max-height: 88dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(40px);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
}
#app-settings-modal.open .cmodal-shell { transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════════
   SPEC-SVC-PANEL — специальные сервисы (эвакуатор, юрист)
═══════════════════════════════════════════════════════════════════ */
.spec-svc-panel {
  width: min(600px, 100%);
  max-height: 88dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.16,1,.3,1);
}
.spec-svc-panel.open { transform: translateY(0); }
.spec-svc-head {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 12px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.spec-svc-title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; color: var(--text);
}
.spec-svc-desc { font-size: 12px; color: var(--text3); margin-top: 3px; }
.spec-svc-close {
  width: 32px; height: 32px; flex-shrink: 0;
  border-radius: 50%; border: 1px solid var(--line);
  background: var(--bg3); color: var(--text2);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; cursor: pointer;
  transition: background .15s;
}
.spec-svc-close:hover { background: var(--line); }
.spec-svc-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.spec-svc-overlay {
  position: fixed; inset: 0; z-index: 8800;
  background: rgba(7,17,27,.75);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity .22s ease;
}
.spec-svc-overlay[style*="opacity:1"],
.spec-svc-overlay.open { opacity: 1 !important; }

/* ═══════════════════════════════════════════════════════════════════
   FORM FIELD VALIDATION
═══════════════════════════════════════════════════════════════════ */
.field-error {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.12) !important;
}
.field-error-msg {
  font-size: 11px; color: #ef4444;
  margin-top: 4px; display: block;
}
.field-ok {
  border-color: rgba(34,197,94,.5) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   INPUT УЛУЧШЕНИЯ — единый стиль
═══════════════════════════════════════════════════════════════════ */
.k-input {
  width: 100%;
  background: var(--bg3);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 11px 14px;
  font-size: 14px; color: var(--text);
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
  outline: none;
}
.k-input:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,107,0,.1);
}
.k-input::placeholder { color: var(--text3); }
.k-input:disabled { opacity: .5; cursor: not-allowed; }

.k-label {
  display: block;
  font-size: 12px; font-weight: 700;
  color: var(--text2); margin-bottom: 6px;
  letter-spacing: .01em;
}
.k-label .req { color: #ef4444; margin-left: 2px; }

.k-field { margin-bottom: 16px; }

/* Select */
.k-select {
  width: 100%;
  background: var(--bg3);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 11px 14px;
  font-size: 14px; color: var(--text);
  font-family: inherit;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
  transition: border-color .15s;
}
.k-select:focus { outline: none; border-color: var(--orange); }

/* Textarea */
.k-textarea {
  width: 100%; min-height: 90px; resize: vertical;
  background: var(--bg3);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 11px 14px;
  font-size: 14px; color: var(--text);
  font-family: inherit;
  transition: border-color .15s;
  outline: none;
}
.k-textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.1); }

/* ═══════════════════════════════════════════════════════════════════
   MASTER SCHEDULE PAGE
═══════════════════════════════════════════════════════════════════ */

/* Заголовок страницы */
.msched-hero {
  background: linear-gradient(135deg, rgba(255,107,0,.08) 0%, transparent 60%);
  border: 1px solid rgba(255,107,0,.15);
  border-radius: var(--ui-radius-lg,18px);
  padding: 18px 20px;
  margin-bottom: 16px;
}
.msched-hero-title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; color: var(--text);
  margin-bottom: 4px;
}
.msched-hero-sub { font-size: 12px; color: var(--text3); line-height: 1.5; }
.msched-stats {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-top: 12px;
}
.msched-stat {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 99px;
  font-size: 12px; font-weight: 700;
  border: 1px solid var(--line);
  background: var(--bg3);
}

/* День графика */
.msched-day {
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  padding: 14px;
  margin-bottom: 10px;
  transition: border-color .15s;
}
.msched-day.is-today {
  border-color: rgba(255,107,0,.4);
  box-shadow: 0 0 0 1px rgba(255,107,0,.1);
}
.msched-day.is-dayoff {
  opacity: .6;
  background: rgba(255,255,255,.02);
}
.msched-day-head {
  display: flex; align-items: center;
  justify-content: space-between; gap: 10px;
  margin-bottom: 10px;
}
.msched-day-label {
  font-size: 14px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 8px;
}
.msched-day-badge {
  font-size: 10px; padding: 2px 8px; border-radius: 99px;
  font-weight: 700;
}
.msched-today-badge {
  background: rgba(255,107,0,.12);
  color: var(--orange);
  border: 1px solid rgba(255,107,0,.2);
}
.msched-dayoff-badge {
  background: rgba(148,163,184,.1);
  color: var(--text3);
  border: 1px solid var(--line);
}

/* Заказы в дне */
.msched-orders { display: flex; flex-direction: column; gap: 6px; }
.msched-order-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  background: var(--surface);
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
}
.msched-order-ico { font-size: 14px; flex-shrink: 0; }
.msched-order-body { flex: 1; min-width: 0; }
.msched-order-client {
  font-size: 12px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.msched-order-service {
  font-size: 11px; color: var(--text3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.msched-order-time {
  font-size: 10px; font-weight: 700;
  padding: 2px 6px; border-radius: 99px;
  flex-shrink: 0;
}

/* Кнопки действий */
.msched-actions {
  display: flex; gap: 6px; flex-wrap: wrap;
  margin-top: 10px;
}
.msched-actions .btn {
  font-size: 11px; padding: 6px 10px;
}

/* Mobile */
@media (max-width: 640px) {
  .msched-hero { padding: 14px 16px; }
  .msched-hero-title { font-size: 17px; }
  .msched-day { padding: 12px; }
  .msched-actions { flex-direction: column; }
  .msched-actions .btn { width: 100%; }
}

/* ══════════════════════════════════════════════════════════════════
   MASTER WORK — убираем лишние card-обёртки
══════════════════════════════════════════════════════════════════ */
.master-work-page .mpane > .card:first-child:last-child {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* ══════════════════════════════════════════════════════════════════
   LEGAL PAGES — #terms, #privacy: спокойный стиль
══════════════════════════════════════════════════════════════════ */
.legal-page {
  max-width: 760px;
  margin: 0 auto;
  padding: 32px 0 80px;
}
.legal-page-head {
  margin-bottom: 28px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}
.legal-page-title {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; color: var(--text);
  margin-bottom: 6px;
}
.legal-page-date {
  font-size: 12px; color: var(--text3);
}
.legal-section {
  margin-bottom: 24px;
}
.legal-section-title {
  font-size: 15px; font-weight: 700; color: var(--text);
  margin-bottom: 10px;
  padding-left: 10px;
  border-left: 3px solid var(--orange);
}
.legal-section-body {
  font-size: 14px; color: var(--text2);
  line-height: 1.75;
}
.legal-section-body p { margin: 0 0 10px; }
.legal-section-body ul {
  padding-left: 18px; margin: 0 0 10px;
}
.legal-section-body li { margin-bottom: 5px; }

@media (max-width: 640px) {
  .legal-page { padding: 20px 0 calc(var(--bnav-h, 72px) + 24px); }
  .legal-page-title { font-size: 20px; }
  .legal-section-title { font-size: 14px; }
  .legal-section-body { font-size: 13px; }
}

/* ═══════════════════════════════════════════════════════════════════
   MO-FILTER-TAB — разделы заявок клиента (ТЗ 7.2)
═══════════════════════════════════════════════════════════════════ */
.mo-filter-bar {
  margin-bottom: 16px;
}
.mo-filter-tabs {
  display: flex; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto; padding: 2px 0 6px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.mo-filter-tabs::-webkit-scrollbar { display: none; }
.mo-filter-tab {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 700;
  padding: 7px 12px; border-radius: 99px;
  border: 1px solid var(--line);
  background: var(--bg3); color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: border-color .15s, background .15s, color .15s;
  min-height: 36px;
}
.mo-filter-tab.active {
  border-color: var(--orange);
  background: rgba(255,107,0,.1);
  color: var(--orange);
}
.mo-filter-tab--alert { border-color: rgba(52,211,153,.4) !important; }
.mo-filter-tab--alert.active { background: rgba(52,211,153,.1) !important; color: #22c55e !important; }

.mo-filter-tab-ico { font-size: 13px; }
.mo-filter-cnt {
  min-width: 18px; height: 18px;
  background: rgba(255,255,255,.12);
  border-radius: 99px; padding: 0 4px;
  font-size: 10px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
}
.mo-filter-cnt--hot {
  background: var(--orange) !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════════════
   MO-STATUS-BADGE — статусы заявки
═══════════════════════════════════════════════════════════════════ */
.mo-status-badge {
  font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: 99px;
  white-space: nowrap;
}
.mo-status-badge.new,
.mo-status-badge.waiting_responses {
  background: rgba(96,165,250,.1); color: #60a5fa;
  border: 1px solid rgba(96,165,250,.25);
}
.mo-status-badge.process,
.mo-status-badge.in_progress {
  background: rgba(255,107,0,.1); color: var(--orange);
  border: 1px solid rgba(255,107,0,.25);
}
.mo-status-badge.done_pending_client {
  background: rgba(52,211,153,.12); color: #34d399;
  border: 1px solid rgba(52,211,153,.3);
  animation: pulse-green 1.5s ease-in-out infinite;
}
.mo-status-badge.done {
  background: rgba(34,197,94,.1); color: #22c55e;
  border: 1px solid rgba(34,197,94,.2);
}
.mo-status-badge.cancelled {
  background: rgba(148,163,184,.08); color: var(--text3);
  border: 1px solid var(--line);
}
.mo-status-badge.dispute {
  background: rgba(239,68,68,.1); color: #ef4444;
  border: 1px solid rgba(239,68,68,.25);
}
@keyframes pulse-green {
  0%,100% { box-shadow: 0 0 0 0 rgba(52,211,153,.3); }
  50% { box-shadow: 0 0 0 4px rgba(52,211,153,.1); }
}

/* ═══════════════════════════════════════════════════════════════════
   КНОПКИ ЗАВЕРШЕНИЯ В MO-CARD
═══════════════════════════════════════════════════════════════════ */
.mo-card[data-status="done_pending_client"] {
  border-color: rgba(52,211,153,.4) !important;
  background: linear-gradient(180deg, rgba(52,211,153,.04), transparent) !important;
}
.mo-card[data-status="dispute"] {
  border-color: rgba(239,68,68,.3) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   MO-RESPONSES — блок откликов в карточке клиента
═══════════════════════════════════════════════════════════════════ */
.mo-responses--empty {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px dashed var(--line);
  background: rgba(255,255,255,.02);
  font-size: 12px; color: var(--text3);
  line-height: 1.5;
}
.mo-resp-empty-ico { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.mo-responses--empty span b { display: block; color: var(--text2); margin-bottom: 2px; }

/* Принятый отклик — выделен зелёным */
.mo-response-row.is-accepted {
  border-color: rgba(52,211,153,.35) !important;
  background: rgba(52,211,153,.05) !important;
}

/* Диалог подтверждения — k-dialog анимация */
.k-overlay.open .k-dialog {
  transform: scale(1) translateY(0);
  opacity: 1;
}

/* Фильтр "Завершить" — пульс */
.mo-filter-tab--alert .mo-filter-cnt--hot {
  animation: pulse-orange 1.8s ease-in-out infinite;
}
@keyframes pulse-orange {
  0%,100% { box-shadow: 0 0 0 0 rgba(255,107,0,.4); }
  50%      { box-shadow: 0 0 0 4px rgba(255,107,0,.1); }
}

/* r149 — services cart to client request + chat flow */
.services-cart-modal__hint{
  margin:12px 0 10px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(255,255,255,.035);
  color:var(--text3);
  font-size:12px;
  line-height:1.45;
}
.services-cart-modal__actions--stacked{
  display:grid;
  grid-template-columns:1fr 1.2fr 1.1fr;
  gap:8px;
}
.svc-request-modal__card{max-width:560px;width:min(96vw,560px);}
.svc-request-modal__body{display:flex;flex-direction:column;gap:14px;}
.svc-request-modal__lead{
  padding:12px 14px;
  border:1px solid rgba(255,107,0,.22);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(255,107,0,.08);
  color:var(--text2);
  font-size:13px;
  line-height:1.45;
}
.svc-request-modal__list{display:grid;gap:8px;}
.svc-request-modal__svc{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface);
  min-width:0;
}
.svc-request-modal__svc-ico{width:34px;height:34px;border-radius:var(--ui-radius-md,10px);display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.07);font-size:18px;flex:0 0 auto;}
.svc-request-modal__svc-main{min-width:0;display:flex;flex-direction:column;gap:3px;}
.svc-request-modal__svc-main b{font-size:13px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.svc-request-modal__svc-main span{font-size:11px;color:var(--text3);}
.svc-request-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.svc-request-field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.svc-request-field span{font-size:12px;color:var(--text3);font-weight:700;}
.svc-request-field--wide{grid-column:1/-1;}
.svc-request-modal__profile{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.svc-request-modal__profile>div{padding:10px 12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:rgba(255,255,255,.03);min-width:0;}
.svc-request-modal__profile b{display:block;font-size:12px;margin-bottom:4px;}
.svc-request-modal__profile span{display:block;font-size:12px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.svc-request-modal__footer{display:flex;gap:10px;justify-content:flex-end;}
@media(max-width:680px){
  .services-cart-modal__actions--stacked{grid-template-columns:1fr;}
  .svc-request-modal{align-items:flex-end!important;padding:0!important;}
  .svc-request-modal__card{width:100%!important;max-width:100%!important;max-height:92dvh!important;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0!important;}
  .svc-request-grid,.svc-request-modal__profile{grid-template-columns:1fr;}
  .svc-request-modal__footer{display:grid;grid-template-columns:1fr 1.35fr;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 12px);}
}

/* ═══════════════════════════════════════════════════════════════════
   CLIENT EXECUTOR BLOCK — "Исполнитель выбран" в деталях заявки
═══════════════════════════════════════════════════════════════════ */
.client-executor-block {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(52,211,153,.08), rgba(52,211,153,.04));
  border: 1.5px solid rgba(52,211,153,.3);
  border-radius: var(--ui-radius-md,10px);
  margin-bottom: 8px;
}
.client-executor-av {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 16px; font-weight: 700;
  flex-shrink: 0;
}
.client-executor-info { flex: 1; min-width: 0; }
.client-executor-label {
  font-size: 11px; font-weight: 700; color: #34d399;
  text-transform: uppercase; letter-spacing: .04em;
  margin-bottom: 3px;
}
.client-executor-name {
  font-size: 15px; font-weight: 700; color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.client-executor-spec {
  font-size: 12px; color: var(--text3); margin-top: 1px;
}

/* Принятый отклик — выделен */
.client-order-offer.is-accepted {
  border-color: rgba(52,211,153,.3) !important;
  background: rgba(52,211,153,.04) !important;
}
.client-order-offer.is-muted {
  opacity: .55;
}
.client-order-offer.is-muted .client-order-offer-actions {
  display: none;
}

@media (max-width: 640px) {
  .client-executor-block { flex-wrap: wrap; }
  .client-executor-block .btn { width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════════
   EXTRA QUOTES — допработы (r157)
═══════════════════════════════════════════════════════════════════ */
.mo-extra-quotes-block {
  margin-top: 12px;
  border: 1px solid rgba(245,158,11,.35);
  border-radius: var(--ui-radius-md,10px);
  padding: 12px;
  background: rgba(245,158,11,.04);
}
.mo-extra-quotes-head {
  font-size: 12px; font-weight: 800;
  color: #f59e0b;
  text-transform: uppercase; letter-spacing: .04em;
  margin-bottom: 10px;
}
.mo-extra-quote {
  padding: 10px;
  background: var(--bg3);
  border-radius: var(--ui-radius-md,10px);
  margin-bottom: 8px;
}
.mo-extra-quote-title { font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.mo-extra-quote-meta  { font-size: 12px; color: var(--text2); margin-bottom: 6px; }
.mo-extra-quote-comment { font-size: 12px; color: var(--text3); margin-bottom: 8px; font-style: italic; }
.mo-extra-quote-actions { display: flex; gap: 8px; }
.mo-extra-quote-actions .btn { flex: 1; font-size: 12px; min-height: 38px; }

/* ═══════════════════════════════════════════════════════════════════
   GPDRIVE улучшения (r159)
═══════════════════════════════════════════════════════════════════ */
.gpdrive-field-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; border-radius: 99px;
  font-size: 11px; font-weight: 700;
  background: rgba(96,165,250,.1);
  border: 1px solid rgba(96,165,250,.25);
  color: #60a5fa;
}
.gpdrive-distance {
  font-size: 12px; color: var(--text3);
  display: flex; align-items: center; gap: 4px;
}
.gpdrive-route-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px; border-radius: var(--ui-radius-sm,5px);
  font-size: 11px; font-weight: 700;
  background: rgba(52,211,153,.1);
  border: 1px solid rgba(52,211,153,.25);
  color: #34d399;
  cursor: pointer;
  transition: background .15s;
}
.gpdrive-route-btn:hover { background: rgba(52,211,153,.18); }

/* ═══════════════════════════════════════════════════════════════════
   DISPUTE CARD (r155)
═══════════════════════════════════════════════════════════════════ */
.dispute-block {
  margin-top: 12px;
  border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--ui-radius-md,10px);
  padding: 12px;
  background: rgba(239,68,68,.04);
}
.dispute-head {
  font-size: 12px; font-weight: 800;
  color: #ef4444;
  margin-bottom: 8px;
}
.dispute-messages { display: flex; flex-direction: column; gap: 6px; }
.dispute-msg {
  font-size: 12px;
  padding: 7px 10px;
  border-radius: var(--ui-radius-sm,5px);
  background: var(--bg3);
  line-height: 1.5;
}
.dispute-msg.from-admin { border-left: 3px solid var(--orange); }
.dispute-msg-author { font-size: 10px; color: var(--text3); margin-bottom: 3px; }
.dispute-reply { display: flex; gap: 8px; margin-top: 8px; }
.dispute-reply input { flex: 1; }

/* ═══════════════════════════════════════════════════════════════════
   STO PIPELINE UI (r156)
═══════════════════════════════════════════════════════════════════ */
.sto-pipeline-tabs {
  display: flex; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto; padding: 2px 0 6px;
  scrollbar-width: none;
}
.sto-pipeline-tabs::-webkit-scrollbar { display: none; }
.sto-pipeline-tab {
  flex: 0 0 auto;
  font-size: 11px; font-weight: 700;
  padding: 6px 12px; border-radius: 99px;
  border: 1px solid var(--line);
  background: var(--bg3); color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: border-color .15s, background .15s;
  min-height: 32px;
}
.sto-pipeline-tab.active {
  border-color: var(--orange);
  background: rgba(255,107,0,.1);
  color: var(--orange);
}
.sto-assign-btn {
  font-size: 11px; padding: 5px 10px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid rgba(52,211,153,.3);
  background: rgba(52,211,153,.07);
  color: #34d399;
  cursor: pointer;
  transition: background .15s;
}
.sto-assign-btn:hover { background: rgba(52,211,153,.15); }

/* ═══════════════════════════════════════════════════════════════════
   r162 — Client completion, disputes, business health UI
═══════════════════════════════════════════════════════════════════ */
.client-completion-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:var(--ui-radius-md,10px);
  border:1px solid var(--line);
  background:var(--surface);
}
.client-completion-card--pending{border-color:rgba(245,158,11,.34);background:rgba(245,158,11,.055)}
.client-completion-card--done{border-color:rgba(34,197,94,.34);background:rgba(34,197,94,.055)}
.client-completion-card--dispute{border-color:rgba(239,68,68,.34);background:rgba(239,68,68,.055)}
.client-completion-ico{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.07);font-size:22px;flex-shrink:0}
.client-completion-title{font-weight:800;font-size:15px;color:var(--text)}
.client-completion-text{font-size:12px;color:var(--text2);line-height:1.55;margin-top:3px}
.client-completion-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;font-size:11px;color:var(--text3)}
.client-completion-meta span{padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.client-completion-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.client-completion-actions .btn{min-height:38px;font-size:12px;padding:7px 12px}
.business-health-card{width:min(920px,94vw);max-height:88dvh;display:flex;flex-direction:column}
.business-health-card .cmodal-head p{margin:4px 0 0;font-size:12px;color:var(--text3)}
.business-health-body{overflow:auto;display:flex;flex-direction:column;gap:18px}
.business-health-body section{padding:14px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface)}
.business-health-body h3{margin:0 0 10px;font-family:Oswald,sans-serif;font-size:16px}
.bh-problem{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:var(--ui-radius-md,10px);background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.22);margin-bottom:8px;font-size:13px}
.bh-problem span{font-family:Oswald,sans-serif;color:#ef4444;font-size:17px;font-weight:800}
.bh-empty{padding:14px;border-radius:var(--ui-radius-md,10px);background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.22);color:#22c55e;font-size:13px;font-weight:700}
.bh-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.bh-kpi{padding:10px 12px;border-radius:var(--ui-radius-md,10px);border:1px solid var(--line);background:var(--bg);min-width:0}
.bh-kpi b{display:block;font-family:Oswald,sans-serif;font-size:20px;color:var(--orange)}
.bh-kpi span{display:block;font-size:11px;color:var(--text3);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bh-chip-grid{display:flex;gap:7px;flex-wrap:wrap}
.bh-chip{font-size:11px;font-weight:800;padding:5px 9px;border-radius:999px;border:1px solid var(--line);background:var(--bg)}
.bh-chip.ok{color:#22c55e;border-color:rgba(34,197,94,.22)}
.bh-chip.bad{color:#ef4444;border-color:rgba(239,68,68,.25)}
@media(max-width:680px){
  .client-completion-card{grid-template-columns:auto minmax(0,1fr);align-items:start}
  .client-completion-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;width:100%}
  .client-completion-actions .btn{width:100%;justify-content:center}
}


/* ═══════════════════════════════════════════════════════════════════
   MODAL SPECIFICS — #client-order-modal, #mcab-modal
═══════════════════════════════════════════════════════════════════ */

/* k-sheet (кабинет, споры, допработы) */
#mcab-modal .k-sheet {
  max-height: 94dvh;
  display: flex;
  flex-direction: column;
}
#mcab-modal .k-sheet-body {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* ═══════════════════════════════════════════════════════════════════
   SVC ATTACH (кнопки фото/видео в форме заявки)
═══════════════════════════════════════════════════════════════════ */
.svc-attach-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 0 4px;
}
.svc-attach-label {
  font-size: 12px;
  color: var(--text3);
  font-weight: 600;
  flex-shrink: 0;
}
.svc-attach-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px dashed var(--line);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  color: var(--text2);
  background: var(--bg3);
  transition: border-color .15s, background .15s, color .15s;
  user-select: none;
}
.svc-attach-btn:hover {
  border-color: var(--orange);
  color: var(--orange);
  background: rgba(255,107,0,.06);
}
.svc-attach-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

/* Адрес-строка — анимация появления */
.svc-addr-row {
  transition: opacity .2s ease, transform .2s ease;
}

/* ═══════════════════════════════════════════════════════════════════
   SERVICES PAGE — SMS + чаты клиента
═══════════════════════════════════════════════════════════════════ */
.svc-sms-card {
  border-color: rgba(34,197,94,.2) !important;
  background: rgba(34,197,94,.03) !important;
}
.svc-chat-card {
  transition: background .15s, transform .1s;
  padding: 0 !important;
}
.svc-chat-card:hover {
  background: rgba(255,107,0,.04) !important;
}
.svc-chat-card:active {
  transform: scale(.99);
}
.svc-chats-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* ═══════════════════════════════════════════════════════════════════
   MESSENGER v2 — карточки чатов
═══════════════════════════════════════════════════════════════════ */
.msng-item--v2 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background .12s;
  -webkit-tap-highlight-color: transparent;
}
.msng-item--v2:hover { background: rgba(255,107,0,.04); }
.msng-item--v2:active { background: rgba(255,107,0,.07); }
.msng-item--unread { background: rgba(255,107,0,.03); }
.msng-item--active .msng-item-name2 { color: var(--orange); }

/* Аватар v2 */
.msng-item-av-wrap { flex-shrink: 0; }
.msng-av2 {
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 2px solid transparent;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 17px;
  position: relative;
}
.msng-av2-dot {
  position: absolute; bottom: 0; right: 0;
  width: 12px; height: 12px;
  background: var(--orange);
  border: 2px solid var(--bg);
  border-radius: 50%;
}

/* Контент */
.msng-item-content { flex: 1; min-width: 0; }
.msng-item-row1 {
  display: flex; align-items: center;
  justify-content: space-between; gap: 8px;
  margin-bottom: 2px;
}
.msng-item-name2 {
  font-weight: 700; font-size: 14px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1;
}
.msng-item-time2 {
  font-size: 10px; color: var(--text3);
  flex-shrink: 0; white-space: nowrap;
}
.msng-item-title-row {
  display: flex; align-items: center; gap: 5px;
  font-size: 12px; color: var(--text2);
  margin-bottom: 2px; flex-wrap: wrap;
}
.msng-order-num {
  font-family: 'Courier New', monospace;
  font-size: 11px; font-weight: 700;
  padding: 1px 6px; border-radius: var(--ui-radius-sm,5px);
  background: rgba(255,107,0,.1);
  color: var(--orange);
  flex-shrink: 0;
}
.msng-item-svc {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1;
}
.msng-item-car2 {
  font-size: 11px; color: var(--text3);
  margin-bottom: 3px;
}
.msng-item-row3 {
  display: flex; align-items: center;
  justify-content: space-between; gap: 6px;
}
.msng-item-preview2 {
  font-size: 12px; color: var(--text3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1;
}
.msng-item-right-meta {
  display: flex; align-items: center; gap: 5px; flex-shrink: 0;
}
.msng-status-pill-sm {
  font-size: 10px; padding: 1px 6px; border-radius: 99px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.msng-unread2 {
  min-width: 18px; height: 18px;
  background: var(--orange); color: #fff;
  border-radius: 99px;
  font-size: 10px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}

/* ═══════════════════════════════════════════════════════════════════
   CHAT HEADER v2
═══════════════════════════════════════════════════════════════════ */
.msng-chat-header2 {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  min-height: 58px;
  background: var(--bg);
}
.msng-back-btn2 {
  width: 34px; height: 34px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border: none; background: none; cursor: pointer;
  border-radius: var(--ui-radius-sm,5px); color: var(--text2);
  transition: background .12s;
}
.msng-back-btn2:hover { background: var(--bg3); }
.msng-chat-av2 {
  width: 38px; height: 38px; flex-shrink: 0;
  border-radius: 50%; border: 2px solid transparent;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 15px;
  position: relative;
}
.msng-chat-info2 {
  flex: 1; min-width: 0;
}
.msng-chat-name2 {
  font-weight: 700; font-size: 14px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.msng-chat-sub2 {
  display: flex; align-items: center; gap: 5px;
  flex-wrap: wrap; margin-top: 1px;
}
.msng-chat-sub2 > span { font-size: 11px; color: var(--text3); white-space: nowrap; }
.msng-order-chip {
  font-family: 'Courier New', monospace;
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: var(--ui-radius-sm,5px);
  background: rgba(255,107,0,.1); color: var(--orange);
}
.msng-chat-car2 {
  font-size: 11px; color: var(--text3); margin-top: 1px;
}
.msng-chat-actions2 {
  display: flex; align-items: center; gap: 4px; flex-shrink: 0;
}
.msng-hd-btn2 {
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border: none; background: none; cursor: pointer;
  border-radius: var(--ui-radius-sm,5px); font-size: 16px;
  transition: background .12s; text-decoration: none;
  color: inherit;
}
.msng-hd-btn2:hover { background: var(--bg3); }

/* mo-write-btn */
.mo-write-btn { white-space: nowrap; font-size: 12px !important; }

/* ═══════════════════════════════════════════════════════════════════
   SERVICES CATALOG PAGE — #services
═══════════════════════════════════════════════════════════════════ */
.svc-page-head {
  padding: 20px 0 8px;
}
.svc-page-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(20px, 4vw, 28px);
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--text);
}
.svc-page-sub {
  font-size: 13px;
  color: var(--text3);
  margin-bottom: 4px;
}

/* ── Категориальные табы ── */
.svc-cat-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding: 8px 0 12px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.svc-cat-tabs::-webkit-scrollbar { display: none; }
.svc-cat-tab {
  flex: 0 0 auto;
  padding: 7px 14px;
  border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--bg3);
  color: var(--text2);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color .15s, background .15s, color .15s;
}
.svc-cat-tab:hover {
  border-color: var(--tc, var(--orange));
  color: var(--tc, var(--orange));
}
.svc-cat-tab.active {
  background: color-mix(in srgb, var(--tc, var(--orange)) 15%, transparent);
  border-color: var(--tc, var(--orange));
  color: var(--tc, var(--orange));
}

/* ── Кнопка "Не знаю что выбрать" ── */
.svc-urgent-cta {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  margin-bottom: 16px;
  border-radius: var(--ui-radius-md,10px);
  border: 1.5px solid rgba(239,68,68,.3);
  background: rgba(239,68,68,.04);
  cursor: pointer;
  text-align: left;
  transition: background .15s, border-color .15s;
}
.svc-urgent-cta:hover { background: rgba(239,68,68,.08); }
.svc-urgent-cta__ico { font-size: 22px; flex-shrink: 0; }
.svc-urgent-cta__body { flex: 1; min-width: 0; }
.svc-urgent-cta__body strong { display: block; font-size: 14px; font-weight: 700; color: var(--text); }
.svc-urgent-cta__body em { display: block; font-size: 12px; color: var(--text3); margin-top: 2px; font-style: normal; }

/* ── Сетка карточек услуг ── */
.svc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
@media (max-width: 480px) {
  .svc-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
}
@media (max-width: 360px) {
  .svc-grid { grid-template-columns: 1fr; }
}

/* ── Карточка услуги ── */
.svc-card {
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: var(--bg2);
  overflow: hidden;
  cursor: pointer;
  transition: transform .12s, box-shadow .12s, border-color .15s;
  display: flex;
  flex-direction: column;
}
.svc-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0,0,0,.14);
}
.svc-card:active { transform: scale(.98); }

.svc-card__head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
}
.svc-card__icon {
  width: 32px; height: 32px;
  border-radius: var(--ui-radius-sm,5px);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}
.svc-card__cat {
  font-size: 11px; font-weight: 700;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  text-transform: uppercase; letter-spacing: .03em;
}

.svc-card__body {
  padding: 8px 12px;
  flex: 1;
}
.svc-card__name {
  font-size: 13px; font-weight: 700; line-height: 1.4;
  color: var(--text);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 4px;
}
.svc-card__price {
  font-size: 12px; font-weight: 700; color: var(--orange);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.svc-card__time {
  font-size: 11px; color: var(--text3); margin-top: 2px;
}

.svc-card__footer {
  display: flex; gap: 6px; padding: 8px var(--ui-radius-md,10px) var(--ui-radius-md,10px);
}
.svc-card__cta {
  flex: 1; font-size: 11px !important; padding: 6px 8px !important;
  justify-content: center; min-height: 32px !important;
}
.svc-card__info {
  width: 32px; height: 32px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; padding: 0 !important;
}

/* Счётчик */
.svc-count {
  text-align: center;
  font-size: 12px;
  color: var(--text3);
  padding: 8px 0 20px;
}

/* openServiceDetailsModal — кнопка записи в карточке  */
.svc-modal-book-aside .btn {
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════════════
   HOME CATALOG MODAL — каталог услуг поверх главной
═══════════════════════════════════════════════════════════════════ */
.home-catalog-modal-card {
  max-width: 900px !important;
  width: 100%;
  max-height: calc(92dvh - env(safe-area-inset-top, 0px)) !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.home-catalog-modal-card .cmodal-head {
  flex: 0 0 auto;
  padding: 16px 20px 8px;
  border-bottom: 1px solid var(--line);
}
.home-catalog-modal-card .cmodal-body {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
@media (max-width: 680px) {
  .home-catalog-modal-card {
    max-width: 100% !important;
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
    max-height: calc(96dvh - env(safe-area-inset-top, 0px)) !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   HOME HERO CTA BUTTONS
═══════════════════════════════════════════════════════════════════ */
.home-hero-cta-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 20px 0 8px;
}
.home-hero-main-cta {
  font-size: 14px !important;
  padding: 11px 22px !important;
  min-height: 44px !important;
}
@media (max-width: 480px) {
  .home-hero-cta-row { flex-direction: column; }
  .home-hero-main-cta { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════
   ACTIVE ORDER WIDGET — улучшенный
═══════════════════════════════════════════════════════════════════ */
.home-active-order__hint {
  font-size: 11px;
  color: var(--text3);
  margin-top: 3px;
  font-style: italic;
}

/* ═══════════════════════════════════════════════════════════════════
   BNAV BADGE
═══════════════════════════════════════════════════════════════════ */
.bnav-badge {
  position: absolute;
  top: -6px; right: -8px;
  min-width: 17px; height: 17px;
  background: #ef4444;
  color: #fff;
  border-radius: 99px;
  font-size: 9px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px;
  border: 2px solid var(--bg);
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════════
   SERVICE MODAL — улучшенная таблица цен
═══════════════════════════════════════════════════════════════════ */
.svc-modal-price-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.svc-modal-price-row:last-child { border-bottom: none; }
.svc-modal-price-key {
  color: var(--text3);
  font-weight: 500;
  min-width: 90px;
  flex-shrink: 0;
}
.svc-modal-price-val { font-weight: 600; text-align: right; }
.svc-modal-price-row--note .svc-modal-price-val {
  font-weight: 400; color: var(--text3); font-size: 11px;
}

/* ═══════════════════════════════════════════════════════════════════
   REQUEST FORM — поле авто
═══════════════════════════════════════════════════════════════════ */
#srm-car::placeholder { color: var(--text3); }

/* ═══════════════════════════════════════════════════════════════════
   CATALOG MODAL — улучшенный
═══════════════════════════════════════════════════════════════════ */
.home-catalog-modal-card .svc-cat-tabs {
  padding: 4px 0 0;
  gap: 5px;
}
.home-catalog-modal-card .svc-cat-tab {
  font-size: 11px;
  padding: 5px 10px;
}

/* ═══════════════════════════════════════════════════════════════════
   SERVICE ↔ CHAT ↔ ORDER CHIPS
═══════════════════════════════════════════════════════════════════ */

/* Чип услуги в чате/заявке */
.msng-svc-chip, .mo-svc-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 99px;
  border: 1px solid rgba(255,107,0,.3);
  background: rgba(255,107,0,.08);
  color: var(--orange);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background .12s, border-color .12s;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.msng-svc-chip:hover, .mo-svc-chip:hover {
  background: rgba(255,107,0,.15);
  border-color: rgba(255,107,0,.5);
}
.msng-svc-chip--cat {
  border-color: rgba(var(--cc-r, 255),var(--cc-g, 107),var(--cc-b, 0),.3);
  background: rgba(var(--cc-r, 255),var(--cc-g, 107),var(--cc-b, 0),.08);
  color: var(--cc, var(--orange));
}

/* Бар услуг в заголовке чата */
.msng-svc-bar {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 6px 14px 2px;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}

/* Список услуг в модалке заявки */
.mo-services-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 6px 0 4px;
}

/* Бейдж активного статуса на карточке услуги */
.svc-card__active-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 99px;
  white-space: nowrap;
  margin-top: 3px;
}

/* Кнопка 📖 в mo-card */
.mo-svc-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: var(--ui-radius-sm,5px);
  border: 1px solid var(--line);
  background: var(--bg3);
  font-size: 13px;
  cursor: pointer;
  vertical-align: middle;
  margin-left: 4px;
  flex-shrink: 0;
  transition: background .12s;
}
.mo-svc-tag:hover { background: rgba(255,107,0,.1); border-color: var(--orange); }

/* r181: сценарные карточки услуг в клиентском каталоге */
.home-catalog-modal-card--scenarios .cmodal-body{
  background:linear-gradient(180deg, color-mix(in srgb, var(--ssc, #f97316) 4%, transparent), transparent 42%);
}
.home-catalog-scenario-list{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.home-catalog-scenario-list .spec-svc-item{
  min-height:136px;
  background:color-mix(in srgb, var(--ssc, #f97316) 5%, rgba(255,255,255,.02));
}
.home-catalog-scenario-list .spec-svc-item.active{
  border-color:color-mix(in srgb, var(--ssc, #f97316) 34%, var(--line));
}
.home-catalog-modal-card--scenarios .svc-cat-tabs--compact{
  padding-bottom:2px;
}
.home-catalog-modal-card--scenarios .svc-cat-tab{
  white-space:nowrap;
}
.home-catalog-custom-request{
  border-color:color-mix(in srgb, var(--ssc, #f97316) 24%, var(--line));
}
@media (max-width: 760px){
  .home-catalog-scenario-list{grid-template-columns:1fr;gap:10px}
  .home-catalog-scenario-list .spec-svc-item{min-height:0;padding:14px;border-radius:var(--ui-radius-lg,18px)}
  .home-catalog-modal-card--scenarios .cmodal-head{position:sticky;top:0;z-index:2;background:var(--card)}
}


/* r185: кабинет — крупные карточки вместо узких вкладок */
.cab-tabs--cards .cab-tab{
  border:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.cab-tabs--cards .cab-tab.active{
  color:var(--text) !important;
  border-color:var(--orange) !important;
  border-bottom-color:var(--orange) !important;
}
.cab-tabs--cards .cab-tab:hover:not(.active){
  color:var(--text);
}


/* r192 — masters page filter bar */
.masters-filter-bar {
  margin: 0 0 14px;
}
.masters-filter-bar .mo-filter-tabs {
  padding: 2px 1px 6px;
}
.masters-filter-empty {
  margin-top: 12px;
}
@media (max-width: 640px) {
  .masters-filter-bar {
    margin-bottom: 12px;
  }
  .masters-filter-bar .mo-filter-tab {
    min-height: 36px;
  }
}

/* r195 — masters filter: максимум 4 вкладки в строке, остальные через горизонтальный scroll */
.masters-filter-bar .mo-filter-tabs{
  display:grid !important;
  grid-auto-flow:column;
  grid-auto-columns:calc((100% - 24px) / 4);
  grid-template-columns:none !important;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:2px 1px 8px;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
}
.masters-filter-bar .mo-filter-tabs::-webkit-scrollbar{display:none;}
.masters-filter-bar .mo-filter-tab{
  width:100%;
  min-width:0;
  justify-content:center;
  white-space:nowrap;
  scroll-snap-align:start;
}
.masters-filter-bar .mo-filter-cnt{
  flex:0 0 auto;
}
@media (max-width:420px){
  .masters-filter-bar .mo-filter-tabs{
    grid-auto-columns:calc((100% - 18px) / 4);
    gap:6px;
    padding-left:0;
    padding-right:0;
  }
  .masters-filter-bar .mo-filter-tab{
    padding:8px 7px;
    font-size:11px;
    gap:3px;
  }
  .masters-filter-bar .mo-filter-tab-ico{
    display:none;
  }
}

/* r197 — compact mo-filter tabs */
.mo-filter-bar{
  margin-bottom:8px;
}
.mo-filter-tabs{
  gap:8px;
  padding:0 0 8px;
}
.mo-filter-tab{
  gap:4px;
  padding:6px 8px;
  min-height:30px;
  border-radius:var(--ui-radius-md,10px);
  font-size:11px;
  line-height:1.1;
}
.mo-filter-tab-ico{
  font-size:11px;
}
.mo-filter-cnt{
  min-width:16px;
  height:16px;
  padding:0 4px;
  font-size:9px;
  line-height:16px;
}
.masters-filter-bar{
  margin-bottom:8px;
}
.masters-filter-bar .mo-filter-tabs{
  gap:8px;
  padding:0 0 8px;
}
.masters-filter-bar .mo-filter-tab{
  min-height:30px;
  padding:6px 8px;
  font-size:11px;
  gap:4px;
}
@media (max-width:420px){
  .mo-filter-tabs,
  .masters-filter-bar .mo-filter-tabs{
    gap:6px;
    padding-bottom:6px;
  }
  .mo-filter-tab,
  .masters-filter-bar .mo-filter-tab{
    padding:5px 6px;
    min-height:28px;
    font-size:10px;
    gap:3px;
  }
  .mo-filter-tab-ico,
  .masters-filter-bar .mo-filter-tab-ico{
    font-size:10px;
  }
}

/* r204 — masters page: safe top offset under fixed header */
.masters-page-shell .masters-content{
  padding-top: 18px;
}
.masters-page-shell .masters-content > .container{
  position: relative;
}
@media (max-width: 640px){
  .masters-page-shell .masters-content{
    padding-top: calc(16px + env(safe-area-inset-top, 0px));
  }
  .masters-page-shell .masters-filter-bar{
    margin-top: 0;
  }
}

/* r207 — compact search button after mo-filter-bar */
.mo-search-action{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:0 0 12px;
}
.mo-search-toggle{
  width:100%;
  min-height:40px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:var(--ui-radius-md,10px);
  background:linear-gradient(180deg,#fff,#f8fafc);
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:8px 12px;
  font-size:13px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
  cursor:pointer;
}
.mo-search-toggle span{font-size:16px;line-height:1;}
.mo-search-toggle b{font:inherit;}
.mo-search-panel{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:var(--ui-radius-lg,18px);
  background:#fff;
  box-shadow:0 12px 28px rgba(15,23,42,.07);
}
.mo-search-panel[hidden]{display:none!important;}
.mo-search-input{
  flex:1;
  min-width:0;
  height:38px;
  border:0;
  outline:0;
  border-radius:var(--ui-radius-md,10px);
  background:#f3f4f6;
  color:#111827;
  padding:0 12px;
  font-size:13px;
  font-weight:650;
}
.mo-search-clear{
  width:38px;
  height:38px;
  border:0;
  border-radius:var(--ui-radius-md,10px);
  background:#f3f4f6;
  color:#64748b;
  font-weight:900;
  cursor:pointer;
}
.msng-search-action{margin-top:8px;}
@media (max-width:560px){
  .mo-search-action{margin-bottom:10px;gap:6px;}
  .mo-search-toggle{min-height:36px;border-radius:var(--ui-radius-md,10px);padding:7px 10px;font-size:12px;}
  .mo-search-panel{padding:6px;border-radius:var(--ui-radius-md,10px);}
  .mo-search-input{height:34px;font-size:12px;padding:0 10px;}
  .mo-search-clear{width:34px;height:34px;border-radius:var(--ui-radius-md,10px);}
}

/* r213 — service request attachments reliable tap targets */
.svc-attach-btn{min-height:38px;touch-action:manipulation;position:relative;}
.svc-attach-btn input[type="file"]{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important;display:block!important;}
.svc-attach-btn span{pointer-events:none;position:relative;z-index:1;}
.svc-attach-thumb{width:44px;height:44px;border-radius:var(--ui-radius-md,10px);background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:visible;}

/* r214 — masters: убрать пустой вертикальный скролл и лишние нижние отступы */
body.kareta-page-masters{
  overflow-x:hidden;
}
body.kareta-page-masters #app{
  min-height:auto;
}
body.kareta-page-masters .page.masters-page-shell{
  min-height:auto;
  padding-bottom:calc(var(--bottom-nav-h, 72px) + env(safe-area-inset-bottom, 0px));
}
body.kareta-page-masters .masters-content{
  padding-bottom:0!important;
  margin-bottom:0!important;
}
body.kareta-page-masters .masters-content > .container{
  padding-bottom:0!important;
  margin-bottom:0!important;
}
body.kareta-page-masters .masters-grid{
  margin-bottom:0!important;
}
@media (max-width:760px){
  body.kareta-page-masters .masters-page-shell{
    padding-bottom:calc(var(--bottom-nav-h, 76px) + env(safe-area-inset-bottom, 0px) + 8px);
  }
  body.kareta-page-masters .masters-content{
    padding-top:10px!important;
  }
}

/* r215 — masters: no artificial empty scroll on short content */
body.kareta-page-masters,
body.kareta-page-masters html{
  min-height:auto!important;
}
body.kareta-page-masters #app{
  min-height:0!important;
  padding-bottom:0!important;
}
body.kareta-page-masters .page.masters-page-shell,
body.kareta-page-masters .spa-page.masters-page-shell{
  min-height:0!important;
  padding-bottom:0!important;
}
body.kareta-page-masters .masters-content{
  flex:0 0 auto!important;
  min-height:0!important;
  padding-bottom:8px!important;
}
body.kareta-page-masters .masters-content > .container,
body.kareta-page-masters .masters-grid,
body.kareta-page-masters .masters-empty{
  padding-bottom:0!important;
  margin-bottom:0!important;
}
@media (max-width:900px){
  body.kareta-page-masters #app{padding-bottom:0!important;}
  body.kareta-page-masters .masters-content{padding-bottom:10px!important;}
}


/* r223 — masters: filter + search packed into sticky tools below fixed header */
body.kareta-page-masters .masters-sticky-tools{
  position:sticky;
  top:calc(var(--topbar-h, 64px) + env(safe-area-inset-top, 0px) + 6px);
  z-index:80;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 12px;
  padding:8px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--ui-radius-lg,18px);
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  backdrop-filter:saturate(1.15) blur(10px);
}
body.kareta-page-masters .masters-sticky-tools .masters-filter-bar{
  margin:0!important;
}
body.kareta-page-masters .masters-sticky-tools .masters-filter-bar .mo-filter-tabs{
  padding-bottom:0!important;
}
body.kareta-page-masters .masters-sticky-tools .mo-search-action{
  margin:0!important;
}
body.kareta-page-masters .masters-sticky-tools .mo-search-toggle{
  min-height:34px;
  border-radius:var(--ui-radius-md,10px);
  box-shadow:none;
}
body.kareta-page-masters .masters-sticky-tools .mo-search-panel{
  box-shadow:none;
}
body.kareta-page-masters .masters-grid{
  scroll-margin-top:calc(var(--topbar-h, 64px) + 96px);
}
@media (max-width:760px){
  body.kareta-page-masters .masters-sticky-tools{
    top:calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px);
    margin-left:-2px;
    margin-right:-2px;
    padding:6px;
    border-radius:var(--ui-radius-lg,18px);
    gap:5px;
    background:rgba(255,255,255,.97);
  }
  body.kareta-page-masters .masters-sticky-tools .mo-search-toggle{
    min-height:32px;
    font-size:11px;
  }
}
@supports not ((backdrop-filter: blur(2px))){
  body.kareta-page-masters .masters-sticky-tools{
    background:#fff;
  }
}

/* r225 — shared card surface for messages, master contacts and client orders */
:root{
  --kareta-card-bg:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,250,252,.96) 100%);
  --kareta-card-border:rgba(15,23,42,.09);
  --kareta-card-shadow:0 14px 36px rgba(15,23,42,.08), 0 2px 8px rgba(15,23,42,.04);
  --kareta-card-shadow-hover:0 18px 44px rgba(15,23,42,.12), 0 4px 12px rgba(15,23,42,.06);
  --kareta-card-radius:22px;
  --kareta-card-pad:16px;
  --kareta-card-accent:rgba(255,107,0,.11);
}
.msng-item.msng-item--v2,
.master-contact-row.reveal.in,
.master-contact-row,
.mo-card.card,
.mo-card{
  border:1px solid var(--kareta-card-border)!important;
  border-radius:var(--kareta-card-radius)!important;
  background:var(--kareta-card-bg)!important;
  box-shadow:var(--kareta-card-shadow)!important;
  color:var(--text, #111827)!important;
  overflow:hidden;
  position:relative;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.msng-item.msng-item--v2::after,
.master-contact-row.reveal.in::after,
.master-contact-row::after,
.mo-card.card::after,
.mo-card::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 16% 0%, var(--kareta-card-accent), transparent 34%);
  opacity:.82;
}
.msng-item.msng-item--v2 > *,
.master-contact-row.reveal.in > *,
.master-contact-row > *,
.mo-card.card > *,
.mo-card > *{
  position:relative;
  z-index:1;
}
.msng-item.msng-item--v2:hover,
.master-contact-row.reveal.in:hover,
.master-contact-row:hover,
.mo-card.card:hover,
.mo-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,107,0,.24)!important;
  box-shadow:var(--kareta-card-shadow-hover)!important;
}
.msng-item.msng-item--v2:active,
.master-contact-row.reveal.in:active,
.master-contact-row:active,
.mo-card.card:active,
.mo-card:active{
  transform:translateY(0) scale(.995);
}
.msng-item.msng-item--v2{
  margin:0 0 10px;
  padding:14px 16px!important;
  border-bottom:1px solid var(--kareta-card-border)!important;
}
.msng-list .msng-item.msng-item--v2:last-child{margin-bottom:0;}
.msng-item.msng-item--v2:hover{background:var(--kareta-card-bg)!important;}
.msng-item.msng-item--unread{
  border-color:rgba(255,107,0,.28)!important;
  background:linear-gradient(180deg, rgba(255,247,237,.98) 0%, rgba(255,255,255,.98) 100%)!important;
}
.msng-item.msng-item--active{
  border-color:rgba(255,107,0,.38)!important;
  box-shadow:0 16px 38px rgba(255,107,0,.13), 0 2px 8px rgba(15,23,42,.04)!important;
}
.master-contact-row.reveal.in,
.master-contact-row{
  padding:18px!important;
  gap:14px!important;
  min-height:168px;
}
.master-contact-row.reveal.in::before,
.master-contact-row::before{
  opacity:.45!important;
}
.mo-card.card,
.mo-card{
  margin-bottom:14px!important;
}
.mo-card.card .mo-card-head,
.mo-card .mo-card-head{
  border-bottom:1px solid rgba(15,23,42,.07)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.58), rgba(255,255,255,0));
}
.mo-card.card .mo-card-actions,
.mo-card .mo-card-actions{
  background:rgba(248,250,252,.62);
  border-top:1px solid rgba(15,23,42,.06);
}
@media (max-width:760px){
  :root{
    --kareta-card-radius:18px;
    --kareta-card-pad:14px;
    --kareta-card-shadow:0 10px 26px rgba(15,23,42,.075), 0 1px 5px rgba(15,23,42,.04);
  }
  .msng-item.msng-item--v2{padding:12px 13px!important;margin-bottom:8px;}
  .master-contact-row.reveal.in,
  .master-contact-row{padding:14px!important;min-height:0!important;}
  .mo-card.card,
  .mo-card{margin-bottom:10px!important;}
}


/* r226 — shared sticky filter/search tools for masters, messages and myorders */
body.kareta-page-messages .msng-sticky-tools,
body.kareta-page-myorders .myorders-sticky-tools{
  position:sticky;
  top:calc(var(--topbar-h, 64px) + env(safe-area-inset-top, 0px) + 6px);
  z-index:80;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 12px;
  padding:8px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--ui-radius-lg,18px);
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  backdrop-filter:saturate(1.15) blur(10px);
}
body.kareta-page-messages .msng-sticky-tools .mo-filter-bar,
body.kareta-page-myorders .myorders-sticky-tools .mo-filter-bar{
  margin:0!important;
}
body.kareta-page-messages .msng-sticky-tools .mo-filter-tabs,
body.kareta-page-myorders .myorders-sticky-tools .mo-filter-tabs{
  padding-bottom:0!important;
}
body.kareta-page-messages .msng-sticky-tools .mo-search-action,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-action{
  margin:0!important;
}
body.kareta-page-messages .msng-sticky-tools .mo-search-toggle,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-toggle{
  min-height:34px;
  border-radius:var(--ui-radius-md,10px);
  box-shadow:none;
}
body.kareta-page-messages .msng-sticky-tools .mo-search-panel,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-panel{
  box-shadow:none;
}
body.kareta-page-messages #msng-page-listmount,
body.kareta-page-myorders #mo-list{
  scroll-margin-top:calc(var(--topbar-h, 64px) + 104px);
}
@media (max-width:760px){
  body.kareta-page-messages .msng-sticky-tools,
  body.kareta-page-myorders .myorders-sticky-tools{
    top:calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px);
    margin-left:-2px;
    margin-right:-2px;
    padding:6px;
    border-radius:var(--ui-radius-lg,18px);
    gap:5px;
    background:rgba(255,255,255,.97);
  }
  body.kareta-page-messages .msng-sticky-tools .mo-search-toggle,
  body.kareta-page-myorders .myorders-sticky-tools .mo-search-toggle{
    min-height:32px;
    font-size:11px;
  }
}
@supports not ((backdrop-filter: blur(2px))){
  body.kareta-page-messages .msng-sticky-tools,
  body.kareta-page-myorders .myorders-sticky-tools{
    background:#fff;
  }
}

/* r227 — Cabinet avatar crop modal */
body.cab-avatar-crop-open{overflow:hidden;}
.cab-avatar-crop-modal{
  position:fixed;
  inset:0;
  z-index:2300;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.cab-avatar-crop-modal.open{display:flex;}
.cab-avatar-crop-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(10px);
}
.cab-avatar-crop-card{
  position:relative;
  width:min(520px,96vw);
  max-height:calc(100vh - 28px);
  overflow:auto;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid rgba(255,255,255,.9);
  background:linear-gradient(180deg,#fff 0%,#fff7ed 100%);
  box-shadow:0 28px 80px rgba(15,23,42,.28);
  padding:18px;
}
.cab-avatar-crop-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.cab-avatar-crop-title{
  font-family:'Oswald',sans-serif;
  font-size:24px;
  font-weight:800;
  line-height:1.05;
  color:#111827;
}
.cab-avatar-crop-sub{
  margin-top:6px;
  max-width:380px;
  font-size:13px;
  line-height:1.35;
  color:#64748b;
}
.cab-avatar-crop-x{
  width:38px;
  height:38px;
  border-radius:var(--ui-radius-md,10px);
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  color:#111827;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
}
.cab-avatar-crop-stage-wrap{
  border-radius:var(--ui-radius-lg,18px);
  background:repeating-linear-gradient(45deg,#f8fafc 0 12px,#eef2f7 12px 24px);
  border:1px solid rgba(15,23,42,.08);
  padding:10px;
}
.cab-avatar-crop-stage{
  position:relative;
  min-height:300px;
  max-height:58vh;
  border-radius:var(--ui-radius-lg,18px);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#111827;
  touch-action:none;
  user-select:none;
}
.cab-avatar-crop-stage img{
  display:block;
  max-width:100%;
  max-height:58vh;
  object-fit:contain;
  pointer-events:none;
}
.cab-avatar-crop-shade{
  position:absolute;
  inset:0;
  background:rgba(2,6,23,.28);
  pointer-events:none;
}
.cab-avatar-crop-box{
  position:absolute;
  border:3px solid #fff;
  border-radius:var(--ui-radius-lg,18px);
  box-shadow:0 0 0 9999px rgba(2,6,23,.42),0 14px 40px rgba(0,0,0,.26),0 0 0 2px rgba(255,107,0,.9) inset;
  cursor:grab;
  touch-action:none;
}
.cab-avatar-crop-box.dragging{cursor:grabbing;}
.cab-avatar-crop-grid{
  position:absolute;
  inset:0;
  border-radius:var(--ui-radius-md,10px);
  background:
    linear-gradient(90deg,transparent 32%,rgba(255,255,255,.55) 33%,transparent 34%,transparent 65%,rgba(255,255,255,.55) 66%,transparent 67%),
    linear-gradient(0deg,transparent 32%,rgba(255,255,255,.55) 33%,transparent 34%,transparent 65%,rgba(255,255,255,.55) 66%,transparent 67%);
  pointer-events:none;
}
.cab-avatar-crop-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:14px;
}
.cab-avatar-crop-actions .btn{
  min-height:44px;
  border-radius:var(--ui-radius-md,10px);
  padding:10px 16px;
}
@media (max-width:560px){
  .cab-avatar-crop-modal{padding:10px;align-items:flex-end;}
  .cab-avatar-crop-card{width:100%;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-lg,18px);padding:14px;}
  .cab-avatar-crop-title{font-size:21px;}
  .cab-avatar-crop-sub{font-size:12px;}
  .cab-avatar-crop-stage{min-height:260px;}
  .cab-avatar-crop-actions{display:grid;grid-template-columns:1fr 1fr;}
  .cab-avatar-crop-actions .btn{width:100%;}
}


/* r228 — MyOrders sticky tools works on both #myorders and #myorders:all */
#myorders-sticky-tools,
body.kareta-page-myorders .masters-sticky-tools,
body.kareta-page-myorders .myorders-sticky-tools,
body[data-kareta-active-page="myorders"] .masters-sticky-tools,
body[data-kareta-active-page="myorders"] .myorders-sticky-tools{
  position:sticky;
  top:calc(var(--topbar-h, 64px) + env(safe-area-inset-top, 0px) + 6px);
  z-index:80;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 12px;
  padding:8px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--ui-radius-lg,18px);
  background:rgba(255,255,255,.96);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  backdrop-filter:saturate(1.15) blur(10px);
}

#myorders-sticky-tools .mo-filter-bar,
body.kareta-page-myorders .masters-sticky-tools .mo-filter-bar,
body.kareta-page-myorders .myorders-sticky-tools .mo-filter-bar{
  margin:0!important;
}

#myorders-sticky-tools .mo-filter-tabs,
body.kareta-page-myorders .masters-sticky-tools .mo-filter-tabs,
body.kareta-page-myorders .myorders-sticky-tools .mo-filter-tabs{
  padding-bottom:0!important;
}

#myorders-sticky-tools .mo-search-action,
body.kareta-page-myorders .masters-sticky-tools .mo-search-action,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-action{
  margin:0!important;
}

#myorders-sticky-tools .mo-search-toggle,
body.kareta-page-myorders .masters-sticky-tools .mo-search-toggle,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-toggle{
  min-height:34px;
  border-radius:var(--ui-radius-md,10px);
  box-shadow:none;
}

#myorders-sticky-tools .mo-search-panel,
body.kareta-page-myorders .masters-sticky-tools .mo-search-panel,
body.kareta-page-myorders .myorders-sticky-tools .mo-search-panel{
  box-shadow:none;
}

@media (max-width:760px){
  #myorders-sticky-tools,
  body.kareta-page-myorders .masters-sticky-tools,
  body.kareta-page-myorders .myorders-sticky-tools,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools,
  body[data-kareta-active-page="myorders"] .myorders-sticky-tools{
    top:calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px);
    margin-left:-2px;
    margin-right:-2px;
    padding:6px;
    border-radius:var(--ui-radius-lg,18px);
    gap:5px;
    background:rgba(255,255,255,.97);
  }
  #myorders-sticky-tools .mo-search-toggle,
  body.kareta-page-myorders .masters-sticky-tools .mo-search-toggle,
  body.kareta-page-myorders .myorders-sticky-tools .mo-search-toggle{
    min-height:32px;
    font-size:11px;
  }
}

@supports not ((backdrop-filter: blur(2px))){
  #myorders-sticky-tools,
  body.kareta-page-myorders .masters-sticky-tools,
  body.kareta-page-myorders .myorders-sticky-tools{
    background:#fff;
  }
}


/* r229 — parts sticky tools and nested cabinet vehicle modal fix */
#parts-sticky-tools,
body.kareta-page-parts .parts-sticky-tools,
body[data-kareta-active-page="parts"] .parts-sticky-tools{
  position:sticky;
  top:calc(var(--topbar-h, 64px) + env(safe-area-inset-top, 0px) + 6px);
  z-index:80;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 12px;
  padding:8px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--ui-radius-lg,18px);
  background:rgba(255,255,255,.96);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  backdrop-filter:saturate(1.15) blur(10px);
}
#parts-sticky-tools .mo-filter-bar,
body.kareta-page-parts .parts-sticky-tools .mo-filter-bar{margin:0!important;}
#parts-sticky-tools .mo-filter-tabs,
body.kareta-page-parts .parts-sticky-tools .mo-filter-tabs{
  padding-bottom:0!important;
  flex-wrap:nowrap!important;
  overflow-x:auto;
  scrollbar-width:none;
}
#parts-sticky-tools .mo-filter-tabs::-webkit-scrollbar{display:none;}
#parts-sticky-tools .mo-search-action,
body.kareta-page-parts .parts-sticky-tools .mo-search-action{margin:0!important;}
#parts-sticky-tools .mo-search-toggle,
body.kareta-page-parts .parts-sticky-tools .mo-search-toggle{
  min-height:34px;
  border-radius:var(--ui-radius-md,10px);
  box-shadow:none;
}
#parts-sticky-tools .mo-search-panel,
body.kareta-page-parts .parts-sticky-tools .mo-search-panel{box-shadow:none;}
.vehicle-add-modal-overlay{z-index:10020!important;}
.vehicle-add-modal-overlay.open{display:flex!important;align-items:center!important;justify-content:center!important;}
.vehicle-add-modal-box{position:relative;z-index:10021;}
@media (max-width:760px){
  #parts-sticky-tools,
  body.kareta-page-parts .parts-sticky-tools,
  body[data-kareta-active-page="parts"] .parts-sticky-tools{
    top:calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px);
    margin-left:-2px;
    margin-right:-2px;
    padding:6px;
    border-radius:var(--ui-radius-lg,18px);
    gap:5px;
    background:rgba(255,255,255,.97);
  }
  #parts-sticky-tools .mo-search-toggle,
  body.kareta-page-parts .parts-sticky-tools .mo-search-toggle{
    min-height:32px;
    font-size:11px;
  }
}
@supports not ((backdrop-filter: blur(2px))){
  #parts-sticky-tools,
  body.kareta-page-parts .parts-sticky-tools{background:#fff;}
}

/* r232 — service request photo/video preview, replace and delete */
.svc-attach-row{
  align-items:flex-start;
  padding:10px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.92));
  box-shadow:0 10px 28px rgba(15,23,42,.06);
}
.svc-attach-label{width:100%;font-size:13px;color:#475569;font-weight:800;}
.svc-attach-btn{border-radius:var(--ui-radius-md,10px);padding:8px 12px;background:#fff;border:1px dashed rgba(255,107,0,.36);color:#1f2937;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.svc-attach-btn:hover{background:rgba(255,107,0,.07);border-color:rgba(255,107,0,.72);}
.svc-attach-preview{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px;margin-top:2px;}
.svc-attach-empty{grid-column:1/-1;min-height:42px;display:flex;align-items:center;justify-content:center;border:1px dashed rgba(148,163,184,.42);border-radius:var(--ui-radius-md,10px);background:rgba(248,250,252,.76);color:#64748b;font-size:12px;font-weight:700;}
.svc-attach-thumb{width:100%;height:auto;min-height:126px;border-radius:var(--ui-radius-lg,18px);border:1px solid rgba(15,23,42,.08);background:#fff;padding:7px;display:flex;flex-direction:column;gap:6px;align-items:stretch;justify-content:flex-start;overflow:hidden;cursor:pointer;text-align:left;box-shadow:0 12px 28px rgba(15,23,42,.08);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;}
.svc-attach-thumb:hover{transform:translateY(-1px);border-color:rgba(255,107,0,.38);box-shadow:0 16px 32px rgba(15,23,42,.11);}
.svc-attach-thumb-media{position:relative;display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;border-radius:var(--ui-radius-md,10px);background:rgba(15,23,42,.04);overflow:hidden;}
.svc-attach-thumb-media img,.svc-attach-thumb-media video{width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--ui-radius-md,10px);}
.svc-attach-play{position:absolute;inset:auto auto 8px 8px;width:30px;height:30px;border-radius:999px;background:rgba(15,23,42,.72);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;}
.svc-attach-file-ico{font-size:30px;}
.svc-attach-thumb-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:11px;line-height:1.2;color:#475569;}
.svc-attach-thumb-meta b{font-size:12px;color:#111827;}
.svc-attach-thumb-meta em{font-style:normal;color:#64748b;white-space:nowrap;}
.svc-attach-thumb-actions{font-size:11px;font-weight:800;color:#f97316;}
.svc-attach-preview-modal{position:fixed;inset:0;z-index:10080;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.58);backdrop-filter:blur(10px);}
.svc-attach-modal-card{width:min(620px,100%);max-height:92dvh;display:flex;flex-direction:column;border-radius:var(--ui-radius-lg,18px);background:#fff;border:1px solid rgba(255,255,255,.72);box-shadow:0 28px 80px rgba(15,23,42,.32);overflow:hidden;}
.svc-attach-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(15,23,42,.08);}
.svc-attach-modal-head div{min-width:0;display:flex;flex-direction:column;gap:3px;}
.svc-attach-modal-head b{font-size:16px;color:#111827;}
.svc-attach-modal-head span{font-size:12px;color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.svc-attach-modal-body{padding:12px;background:linear-gradient(180deg,#f8fafc,#fff);overflow:auto;}
.svc-attach-modal-body img,.svc-attach-modal-body video{display:block;width:100%;max-height:64dvh;object-fit:contain;border-radius:var(--ui-radius-lg,18px);background:#0f172a;}
.svc-attach-modal-actions{display:flex;gap:10px;justify-content:flex-end;padding:12px 16px;border-top:1px solid rgba(15,23,42,.08);}
.svc-attach-modal-actions .btn{min-height:42px;border-radius:var(--ui-radius-md,10px);}
.svc-attach-modal-actions .btn-danger{background:#ef4444;color:#fff;border-color:#ef4444;}
@media (max-width:640px){
  .svc-attach-row{border-radius:var(--ui-radius-md,10px);padding:9px;}
  .svc-attach-preview{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .svc-attach-thumb{min-height:112px;border-radius:var(--ui-radius-md,10px);padding:6px;}
  .svc-attach-preview-modal{align-items:flex-end;padding:10px;}
  .svc-attach-modal-card{border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;max-height:94dvh;}
  .svc-attach-modal-actions{flex-wrap:wrap;}
  .svc-attach-modal-actions .btn{flex:1 1 auto;justify-content:center;}
}


/* r233 — desktop wide container without over-stretched cards */
@media (min-width:1025px){
  :root{
    --desktop-content-max:1890px;
    --desktop-block-max:1480px;
    --desktop-readable-max:1220px;
    --desktop-card-max:420px;
    --desktop-card-radius:24px;
    --desktop-card-gap:18px;
  }

  .container{
    max-width:var(--desktop-content-max)!important;
  }

  /* Широкий экран = больше воздуха у секций, но сами карточки не растягиваются */
  .home-catalog__grid,
  .masters-grid,
  .parts-grid-v2,
  .parts-grid-v2--catalog,
  .cab-tabs,
  .mprof-tabs.mprof-tabs--icons,
  .legal-info-grid,
  .legal-rich-stats,
  .master-profile-info-grid,
  .master-contact-grid,
  #mo-list,
  .mo-list,
  .msng-page-sections,
  .msng-chat-list,
  .msng-empty-cta.card{
    max-width:var(--desktop-block-max);
    margin-left:auto;
    margin-right:auto;
  }

  .masters-sticky-tools,
  .myorders-sticky-tools,
  .msng-sticky-tools,
  .parts-sticky-tools,
  #masters-sticky-tools,
  #myorders-sticky-tools,
  #msng-sticky-tools,
  #parts-sticky-tools{
    max-width:var(--desktop-block-max);
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .masters-grid{
    grid-template-columns:repeat(auto-fill, minmax(300px, 360px));
    justify-content:center;
    gap:var(--desktop-card-gap);
  }
  .master-card{
    width:100%;
    max-width:360px;
    border-radius:var(--desktop-card-radius);
  }

  .home-catalog__grid,
  .parts-grid-v2,
  .parts-grid-v2--catalog{
    grid-template-columns:repeat(auto-fill, minmax(260px, 340px));
    justify-content:center;
    gap:var(--desktop-card-gap);
  }
  .home-catalog__grid > *,
  .parts-grid-v2 > *,
  .part-card-v2,
  .svc-cat-tab,
  .svc-cat-nav-card{
    max-width:360px;
  }

  #mo-list,
  .mo-list{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(340px, 430px));
    justify-content:center;
    align-items:start;
    gap:var(--desktop-card-gap);
  }
  #mo-list > .mo-card,
  .mo-list > .mo-card,
  .mo-card.card{
    width:100%;
    max-width:430px;
  }

  .msng-page-sections,
  .msng-chat-list{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(340px, 430px));
    justify-content:center;
    align-items:start;
    gap:14px;
  }
  .msng-item.msng-item--v2{
    width:100%;
    max-width:430px;
  }

  .cab-tabs,
  .mprof-tabs.mprof-tabs--icons{
    grid-template-columns:repeat(2, minmax(320px, 520px));
    justify-content:center;
    gap:18px;
  }
  .cab-tab,
  .mprof-tab{
    max-width:520px;
    border-radius:var(--ui-radius-lg,18px);
  }

  .master-contact-row,
  .master-contact-row.reveal.in{
    max-width:560px;
  }

  .card,
  .cmodal-box,
  .cmodal-card,
  .modal-card,
  .cab-pane-modal-card,
  .mprof-pane-modal-card,
  .home-catalog-modal-card{
    border-radius:var(--ui-radius-lg,18px);
  }

  .cmodal-box,
  .cmodal-card,
  .modal-card,
  .cab-pane-modal-card,
  .mprof-pane-modal-card,
  .home-catalog-modal-card{
    max-width:min(920px, calc(100vw - 72px));
  }

  .spa-page-hero .container,
  .home-hero .container,
  .masters-content > .container,
  .msng-page-content.container,
  .mo-page .container,
  .parts-page .container{
    padding-left:clamp(28px, 3vw, 56px);
    padding-right:clamp(28px, 3vw, 56px);
  }
}

/* r234: сценарные карточки услуг — выбор в корзину и переход к оформлению */
.home-catalog-scenario-list .spec-svc-item{
  position:relative;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.home-catalog-scenario-list .spec-svc-item.spec-svc-item--selected{
  border-color:color-mix(in srgb, var(--ssc, #f97316) 58%, var(--line));
  background:linear-gradient(135deg, color-mix(in srgb, var(--ssc, #f97316) 16%, #fff), #fff 72%);
  box-shadow:0 14px 34px rgba(249,115,22,.16), inset 0 0 0 1px color-mix(in srgb, var(--ssc, #f97316) 24%, transparent);
}
.home-catalog-scenario-list .spec-svc-item.spec-svc-item--selected::after{
  content:'✓';
  position:absolute;
  top:10px;
  right:10px;
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:999px;
  color:#fff;
  font-weight:900;
  background:var(--ssc, #f97316);
  box-shadow:0 8px 18px color-mix(in srgb, var(--ssc, #f97316) 32%, transparent);
}
.spec-svc-selected-note{
  display:none;
  margin-top:8px;
  width:max-content;
  max-width:100%;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  color:color-mix(in srgb, var(--ssc, #f97316) 72%, #111827);
  background:color-mix(in srgb, var(--ssc, #f97316) 12%, #fff);
  border:1px solid color-mix(in srgb, var(--ssc, #f97316) 22%, var(--line));
}
.spec-svc-item--selected .spec-svc-selected-note{display:inline-flex;align-items:center;gap:4px}
.home-catalog-custom-request[data-home-catalog-next]{
  position:sticky;
  bottom:0;
  z-index:3;
  border-color:color-mix(in srgb, var(--ssc, #f97316) 36%, var(--line));
  background:linear-gradient(135deg, color-mix(in srgb, var(--ssc, #f97316) 13%, #fff), #fff);
  box-shadow:0 -10px 28px rgba(15,23,42,.08), 0 14px 34px rgba(15,23,42,.10);
}
.home-catalog-custom-request[data-home-catalog-next]:not(.is-disabled){
  cursor:pointer;
}
.home-catalog-custom-request[data-home-catalog-next].is-disabled{
  opacity:.58;
  cursor:not-allowed;
  filter:grayscale(.18);
}
.home-catalog-next-count{
  min-width:32px;
  height:32px;
  padding:0 10px;
  display:inline-grid;
  place-items:center;
  border-radius:999px;
  color:#fff;
  font-weight:900;
  background:var(--ssc, #f97316);
  box-shadow:0 10px 24px color-mix(in srgb, var(--ssc, #f97316) 28%, transparent);
}
@media (max-width:760px){
  .home-catalog-custom-request[data-home-catalog-next]{bottom:0;margin-left:-2px!important;margin-right:-2px!important;border-radius:var(--ui-radius-lg,18px)}
  .home-catalog-scenario-list .spec-svc-item.spec-svc-item--selected::after{top:5px;right:8px;width:24px;height:24px}
}

/* r238 — notifications body scroll fix */
#notifs-panel{
  height:min(85dvh, 680px);
  max-height:min(85dvh, 680px);
  min-height:0;
  overflow:hidden;
}
#notifs-panel.open{
  display:flex;
}
.notifs-body{
  min-height:0;
  flex:1 1 auto;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.notifs-body::-webkit-scrollbar{ width:6px; }
.notifs-body::-webkit-scrollbar-thumb{ background:rgba(148,163,184,.55); border-radius:999px; }
.notifs-footer,
.notifs-head,
.notifs-handle{ flex:0 0 auto; }
@media (min-width:901px){
  #notifs-panel{
    height:min(72vh, 620px);
    max-height:min(72vh, 620px);
  }
}
@media (max-width:900px){
  #notifs-panel{
    height:min(86dvh, calc(100dvh - 12px));
    max-height:min(86dvh, calc(100dvh - 12px));
  }
}

/* r239 admin shop + master workload + accept schedule */
.admin-shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.admin-shop-stat{padding:14px 16px;border-left:3px solid var(--orange);display:flex;flex-direction:column;gap:4px}
.admin-shop-stat>div{font-size:22px}.admin-shop-stat>b{font-family:'Oswald',sans-serif;font-size:24px}.admin-shop-stat>span{font-size:11px;color:var(--text3)}
.admin-shop-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-bottom:18px}
.admin-shop-item{padding:14px 16px;display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,107,0,.035)),var(--bg2)}
.admin-shop-icon{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.12);border:1px solid rgba(255,107,0,.2);font-size:20px;flex:0 0 auto}
.admin-shop-title{font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-shop-sub{font-size:12px;color:var(--text3);margin-top:3px}
.admin-shop-meta{display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:12px}.admin-shop-meta b{font-family:'Oswald',sans-serif;color:var(--orange);font-size:16px}.admin-shop-meta span{color:var(--text3)}.admin-shop-meta .warn{color:#ef4444;font-weight:800}
.mx-accept-schedule{display:grid;gap:14px}.mx-accept-order-card{padding:14px 16px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface);display:flex;flex-direction:column;gap:4px}.mx-accept-order-card b{font-size:15px}.mx-accept-order-card span{font-size:12px;color:var(--text3)}
.mx-accept-note{padding:10px 12px;border-radius:var(--ui-radius-md,10px);background:rgba(96,165,250,.1);border:1px solid rgba(96,165,250,.22);color:var(--text2);font-size:12px;line-height:1.45}.mx-accept-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mx-accept-form label span{display:block;font-size:11px;color:var(--text3);margin-bottom:5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.mx-accept-load{padding:10px 12px;border-radius:var(--ui-radius-md,10px);background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.25);font-size:13px;color:var(--green)}.mx-accept-load.is-full{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.25);color:#ef4444}
.admin-master-load-strip{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.admin-master-load-pill{font-size:10px;padding:4px 7px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--text3)}.admin-master-load-pill.is-full{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.25);color:#ef4444;font-weight:800}
@media (max-width: 640px){.mx-accept-form{grid-template-columns:1fr}.admin-shop-list{grid-template-columns:1fr}}

/* r240 — design settings variables standardization */
.hcat-card::before{content:none!important;display:none!important}
.card,
.cmodal-card,
.cmodal-box,
.modal-panel-v2,
.modal-dialog-v2,
.cab-tab-card,
.cab-pane-modal-card,
.mprof-tab-card,
.mprof-pane-modal-card,
.msng-item.msng-item--v2,
.master-contact-row,
.mo-card.card,
.legal-info-card,
.legal-rich-stat,
.hcat-card,
.spec-svc-item,
.parts-category-card,
.parts-item-card,
.masters-sticky-tools,
.msng-empty-cta,
.admin-shop-item,
.mx-accept-order-card{
  background:var(--ui-surface, var(--surface))!important;
  border:1px solid var(--ui-border, var(--line))!important;
  border-radius:var(--ui-radius-card, var(--r-lg))!important;
  box-shadow:var(--ui-shadow-card, var(--shadow-sm));
}
.cmodal-card,
.cmodal-box,
.modal-panel-v2,
.modal-dialog-v2,
.cab-pane-modal-card,
.mprof-pane-modal-card,
.legal-detail-modal-card,
#app-settings-modal .app-settings-shell{
  border-radius:var(--ui-radius-modal, var(--r-xl))!important;
  background:var(--ui-surface-2, var(--bg2))!important;
  border:1px solid var(--ui-border, var(--line))!important;
  box-shadow:var(--ui-shadow-float, var(--shadow-lg))!important;
}
.btn,
button.btn,
.mo-filter-tab,
.mo-search-action,
.cmodal-close,
.seg-btn,
.drawer-link,
.bnav-item,
.svc-urgent-cta,
.home-catalog-custom-request,
.cab-av-camera,
.msng-send,
.msng-action,
.spec-svc-request,
.mx-action-btn{
  border-radius:var(--ui-radius-btn, var(--r-md))!important;
}
.mo-filter-cnt,
.badge,
.badge-pill,
.home-catalog-next-count,
.admin-master-load-pill,
.legal-rich-stat-more,
.legal-card-more,
.msng-unread-badge{
  border-radius:var(--ui-radius-pill, 999px)!important;
}
input,
select,
textarea,
.pf-input,
.form-input,
.settings-row,
.settings-list,
.font-preview{
  border-radius:var(--ui-radius-btn, var(--r-md))!important;
  border-color:var(--ui-border, var(--line))!important;
  background:var(--ui-surface-2, var(--bg2));
}
[data-surface="glass"] .card,
[data-surface="glass"] .cmodal-card,
[data-surface="glass"] .cmodal-box,
[data-surface="glass"] .masters-sticky-tools{
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.hcat-card:hover,
.mo-card.card:hover,
.master-contact-row:hover,
.msng-item.msng-item--v2:hover,
.legal-rich-stat:hover,
.legal-info-card:hover{
  border-color:color-mix(in srgb, var(--orange) 38%, var(--ui-border, var(--line)))!important;
  box-shadow:var(--ui-shadow-float, var(--shadow-md));
}

/* r241 — adaptive sticky tools sizing for myorders: phone / tablet / desktop */
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools,
#myorders-sticky-tools{
  --myo-tools-pad-y: 8px;
  --myo-tools-pad-x: 10px;
  --myo-tools-gap: 8px;
  --myo-tools-radius: var(--ui-radius-card, 22px);
  --myo-tools-filter-h: 38px;
  --myo-tools-filter-fs: 12px;
  --myo-tools-search-h: 38px;
  --myo-tools-search-fs: 12px;
  --myo-tools-count-fs: 10px;
  --myo-tools-shadow: 0 14px 34px rgba(15,23,42,.08);
  padding:var(--myo-tools-pad-y) var(--myo-tools-pad-x)!important;
  gap:var(--myo-tools-gap)!important;
  border-radius:var(--myo-tools-radius)!important;
  box-shadow:var(--myo-tools-shadow)!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-bar,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-bar,
#myorders-sticky-tools .mo-filter-bar{
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs,
#myorders-sticky-tools .mo-filter-tabs{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:0 2px 2px!important;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
#myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar{display:none;}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
#myorders-sticky-tools .mo-filter-tab{
  min-height:var(--myo-tools-filter-h)!important;
  height:var(--myo-tools-filter-h)!important;
  padding:0 10px!important;
  font-size:var(--myo-tools-filter-fs)!important;
  line-height:1!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-cnt,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-cnt,
#myorders-sticky-tools .mo-filter-cnt{
  min-width:18px!important;
  height:18px!important;
  padding:0 5px!important;
  font-size:var(--myo-tools-count-fs)!important;
  line-height:18px!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-action,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-action,
#myorders-sticky-tools .mo-search-action{margin:0!important;}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle,
#myorders-sticky-tools .mo-search-toggle{
  min-height:var(--myo-tools-search-h)!important;
  height:var(--myo-tools-search-h)!important;
  padding:0 12px!important;
  font-size:var(--myo-tools-search-fs)!important;
  line-height:1!important;
  gap:6px!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle b,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle b,
#myorders-sticky-tools .mo-search-toggle b{
  font-size:inherit!important;
  line-height:1.05!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-panel,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-panel,
#myorders-sticky-tools .mo-search-panel{
  margin-top:6px!important;
  padding:7px 8px!important;
  border-radius:calc(var(--myo-tools-radius) - var(--radius-min))!important;
}
body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-input,
body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-input,
#myorders-sticky-tools .mo-search-input{
  min-height:36px!important;
  font-size:13px!important;
}
@media (max-width:560px){
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools,
  #myorders-sticky-tools{
    --myo-tools-pad-y: 6px;
    --myo-tools-pad-x: 6px;
    --myo-tools-gap: 5px;
    --myo-tools-radius: 18px;
    --myo-tools-filter-h: 32px;
    --myo-tools-filter-fs: 11px;
    --myo-tools-search-h: 34px;
    --myo-tools-search-fs: 11px;
    --myo-tools-count-fs: 9px;
    --myo-tools-shadow: 0 10px 24px rgba(15,23,42,.07);
    top:calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px)!important;
    margin:0 -2px 10px!important;
  }
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  #myorders-sticky-tools .mo-filter-tab{
    padding:0 8px!important;
    max-width:132px;
  }
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab .mo-filter-ico,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab .mo-filter-ico,
  #myorders-sticky-tools .mo-filter-tab .mo-filter-ico{display:none!important;}
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-toggle,
  #myorders-sticky-tools .mo-search-toggle{justify-content:center!important;}
}
@media (min-width:561px) and (max-width:1024px){
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools,
  #myorders-sticky-tools{
    --myo-tools-pad-y: 8px;
    --myo-tools-pad-x: 10px;
    --myo-tools-gap: 8px;
    --myo-tools-radius: 22px;
    --myo-tools-filter-h: 38px;
    --myo-tools-filter-fs: 12px;
    --myo-tools-search-h: 38px;
    --myo-tools-search-fs: 12px;
    --myo-tools-count-fs: 10px;
    top:calc(var(--topbar-h, 64px) + env(safe-area-inset-top, 0px) + 8px)!important;
    max-width:920px;
    margin:0 auto 14px!important;
  }
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  #myorders-sticky-tools .mo-filter-tab{padding:0 12px!important;}
}
@media (min-width:1025px){
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools,
  #myorders-sticky-tools{
    --myo-tools-pad-y: 10px;
    --myo-tools-pad-x: 12px;
    --myo-tools-gap: 10px;
    --myo-tools-radius: 26px;
    --myo-tools-filter-h: 42px;
    --myo-tools-filter-fs: 13px;
    --myo-tools-search-h: 42px;
    --myo-tools-search-fs: 13px;
    --myo-tools-count-fs: 11px;
    --myo-tools-shadow: 0 16px 38px rgba(15,23,42,.09);
    top:calc(var(--topbar-h, 72px) + 10px)!important;
    max-width:1180px;
    margin:0 auto 16px!important;
  }
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools{
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) 260px;
    align-items:center!important;
  }
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tabs,
  #myorders-sticky-tools .mo-filter-tabs{gap:8px!important;}
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-filter-tab,
  #myorders-sticky-tools .mo-filter-tab{padding:0 14px!important;}
  body.kareta-page-myorders .masters-sticky-tools.myorders-sticky-tools .mo-search-panel,
  body[data-kareta-active-page="myorders"] .masters-sticky-tools.myorders-sticky-tools .mo-search-panel,
  #myorders-sticky-tools .mo-search-panel{
    position:absolute;
    right:12px;
    top:calc(100% + 8px);
    width:min(520px, calc(100vw - 48px));
    z-index:2;
    box-shadow:var(--ui-shadow-float, 0 18px 44px rgba(15,23,42,.14))!important;
  }
}

/* r242 — spa hero body nav icon integration */
.spa-page-hero .spa-hero-body{
  position: relative;
  padding: clamp(18px, 2.2vw, 28px);
  border: var(--ui-border, 1px solid rgba(15,23,42,.08));
  border-radius: var(--ui-radius-card, 18px);
  background: var(--ui-surface, rgba(255,255,255,.86));
  box-shadow: var(--ui-shadow-card, 0 18px 48px rgba(15,23,42,.10));
  backdrop-filter: saturate(1.1) blur(10px);
}
.spa-page-hero .spa-hero-ico.nav-link-ico{
  width: clamp(44px, 4.2vw, 58px);
  height: clamp(44px, 4.2vw, 58px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 12px;
  border-radius: var(--ui-radius-btn, 18px);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent, #ff7a00) 16%, #fff), rgba(255,255,255,.94));
  border: var(--ui-border, 1px solid rgba(15,23,42,.08));
  box-shadow: 0 12px 28px rgba(15,23,42,.10);
  color: var(--accent, #ff7a00);
  font-size: clamp(22px, 2.3vw, 30px);
  line-height: 1;
  flex: 0 0 auto;
}
.spa-page-hero .spa-hero-label{
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #ff7a00) 9%, #fff);
  color: color-mix(in srgb, var(--accent, #ff7a00) 74%, #111827);
  border: 1px solid color-mix(in srgb, var(--accent, #ff7a00) 20%, transparent);
  font-weight: 800;
  letter-spacing: .02em;
}
@media (min-width: 1025px){
  .spa-page-hero .spa-hero-body{
    max-width: min(var(--hero-body-max), 820px);
  }
}
@media (max-width: 767px){
  .spa-page-hero .spa-hero-body{
    padding: 16px;
    border-radius: var(--ui-radius-card, 18px);
    box-shadow: var(--ui-shadow-card, 0 12px 30px rgba(15,23,42,.08));
  }
  .spa-page-hero .spa-hero-ico.nav-link-ico{
    width: 42px;
    height: 42px;
    margin-bottom: 10px;
    font-size: 22px;
  }
}

/* r243 — responsive UI system foundation: phone / tablet / desktop / wide desktop */
:root{
  --bp-phone-max: 767px;
  --bp-tablet-min: 768px;
  --bp-desktop-min: 1024px;
  --bp-wide-min: 1440px;

  --ui-page-gap: clamp(14px, 1.6vw, 26px);
  --ui-card-gap: clamp(10px, 1.2vw, 18px);
  --ui-shell-pad-y: clamp(14px, 1.8vw, 28px);
  --ui-readable: min(100%, 1180px);
  --ui-readable-wide: min(100%, 1480px);
  --ui-panel-max: 1320px;
  --ui-card-max: 440px;
  --ui-table-card-min: 260px;

  --ui-font-page-title: clamp(22px, 2.2vw, 34px);
  --ui-font-card-title: clamp(16px, 1.08vw, 19px);
  --ui-font-body: clamp(14px, .92vw, 16px);
  --ui-font-small: clamp(12px, .8vw, 14px);
  --ui-line-tight: 1.18;
  --ui-line-normal: 1.45;
}

.page-shell,
.spa-page,
.masters-page-shell,
.parts-page-shell,
.messages-page-shell,
.myorders-page-shell{
  --page-top-gap: var(--ui-shell-pad-y);
  width:100%;
}
.page-container,
.spa-content > .container,
.masters-content > .container,
.container.msng-page-content{
  position:relative;
}
.page-content,
.masters-grid,
.parts-grid-v2,
.home-catalog__grid,
.msng-page-sections,
#mo-list,
.cab-tabs,
.mprof-tabs{
  gap:var(--ui-card-gap);
}

.page-hero,
.spa-page-hero .spa-hero-body,
.msng-hero,
.legal-hero,
.home-hero{
  font-size:var(--ui-font-body);
  line-height:var(--ui-line-normal);
}
.spa-page-hero h1,
.msng-hero h1,
.legal-hero h1,
.home-hero h1,
.page-hero h1{
  font-size:var(--ui-font-page-title);
  line-height:var(--ui-line-tight);
  letter-spacing:-.035em;
}

.surface-card,
.msng-item.msng-item--v2,
.master-contact-row.reveal.in,
.mo-card.card,
.master-card,
.parts-category-card,
.hcat-card,
.legal-info-card,
.legal-rich-stat,
.cab-tab,
.mprof-tab,
.card{
  border:var(--ui-border, 1px solid rgba(15,23,42,.08));
  border-radius:var(--ui-radius-card, 18px);
  background:var(--ui-surface, rgba(255,255,255,.88));
  box-shadow:var(--ui-shadow-card, 0 14px 36px rgba(15,23,42,.08));
}
.ui-btn,
.btn,
.mo-search-toggle,
.mo-filter-tab,
.svc-urgent-cta,
.cmodal-close,
.cab-av-camera,
button{
  border-radius:var(--ui-radius-btn, 10px);
}
.ui-modal-overlay,
.cmodal-overlay,
.cab-pane-modal-overlay,
.spec-svc-overlay,
.legal-detail-modal{
  padding:clamp(12px, 2vw, 28px);
}
.ui-modal-card,
.cmodal-box,
.cmodal-card,
.cab-pane-modal-card,
.spec-svc-panel{
  border-radius:var(--ui-radius-modal, 18px);
  border:var(--ui-border, 1px solid rgba(15,23,42,.08));
  background:var(--ui-modal-bg, rgba(255,255,255,.96));
  box-shadow:var(--ui-shadow-float, 0 24px 80px rgba(15,23,42,.18));
}

.empty-state,
.msng-empty-cta,
.msng-chat-empty,
.msng-chat-loading,
.notifs-empty{
  border:var(--ui-border, 1px solid rgba(15,23,42,.08));
  border-radius:var(--ui-radius-card, 18px);
  background:var(--ui-surface, rgba(255,255,255,.88));
  box-shadow:var(--ui-shadow-card, 0 14px 36px rgba(15,23,42,.08));
  padding:clamp(18px, 2.2vw, 30px);
}
.status-badge,
[class*="status"],
.mo-status,
.spec-svc-price,
.mo-filter-cnt{
  border-radius:var(--ui-radius-pill, 999px);
}

/* Unified sticky-tools visual layer. Existing route-specific classes stay as aliases. */
.page-sticky-tools,
.masters-sticky-tools,
.msng-sticky-tools,
.myorders-sticky-tools,
.parts-sticky-tools{
  isolation:isolate;
  border:var(--ui-border, 1px solid rgba(15,23,42,.08));
  border-radius:var(--ui-radius-card, 18px);
  background:var(--ui-surface-strong, rgba(255,255,255,.92));
  box-shadow:var(--ui-shadow-card, 0 12px 34px rgba(15,23,42,.08));
  backdrop-filter:saturate(1.15) blur(12px);
}
.page-sticky-tools .mo-filter-tabs,
.masters-sticky-tools .mo-filter-tabs{
  min-width:0;
}
.page-sticky-tools .mo-filter-tab,
.masters-sticky-tools .mo-filter-tab{
  white-space:nowrap;
}

/* Data table foundation: desktop only by default; mobile should remain card-based. */
.ui-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 8px;
  font-size:var(--ui-font-body);
}
.ui-table th,
.ui-table td{
  padding:12px 14px;
  text-align:left;
  vertical-align:middle;
}
.ui-table th{
  color:var(--muted, #6b7280);
  font-size:var(--ui-font-small);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.ui-table tr{
  background:var(--ui-surface, #fff);
  box-shadow:var(--ui-shadow-soft, 0 8px 22px rgba(15,23,42,.06));
}
.ui-table td:first-child{border-radius:var(--ui-radius-card, 18px) 0 0 var(--ui-radius-card, 18px);}
.ui-table td:last-child{border-radius:0 var(--ui-radius-card, 18px) var(--ui-radius-card, 18px) 0;}
.ui-data-card{display:none;}
.desktop-only{display:none!important;}
.mobile-only{display:initial!important;}

@media (max-width: 767px){
  :root{
    --ui-page-gap: 12px;
    --ui-card-gap: 10px;
    --ui-shell-pad-y: 12px;
    --ui-font-page-title: 21px;
    --ui-font-card-title: 16px;
    --ui-font-body: 14px;
    --ui-font-small: 12px;
  }
  .container{padding-left:12px!important;padding-right:12px!important;}
  .spa-content > .container,
  .masters-content > .container,
  .container.msng-page-content{width:100%;}
  .page-hero,
  .spa-page-hero .spa-hero-body,
  .legal-hero,
  .home-hero{
    padding:14px!important;
    border-radius:var(--ui-radius-card, 18px)!important;
  }
  .msng-hero{display:none!important;}
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{
    position:sticky!important;
    top:calc(var(--topbar-h, 58px) + env(safe-area-inset-top, 0px) + 6px)!important;
    z-index:40!important;
    display:block!important;
    padding:8px!important;
    margin:8px 0 12px!important;
    border-radius:var(--ui-radius-card, 10px)!important;
    box-shadow:0 8px 22px rgba(15,23,42,.07)!important;
  }
  .masters-sticky-tools .mo-filter-tabs,
  .msng-sticky-tools .mo-filter-tabs,
  .myorders-sticky-tools .mo-filter-tabs,
  .parts-sticky-tools .mo-filter-tabs{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:6px!important;
    padding:0 2px 3px!important;
    scrollbar-width:none;
  }
  .masters-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .msng-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .parts-sticky-tools .mo-filter-tabs::-webkit-scrollbar{display:none;}
  .masters-sticky-tools .mo-filter-tab,
  .msng-sticky-tools .mo-filter-tab,
  .myorders-sticky-tools .mo-filter-tab,
  .parts-sticky-tools .mo-filter-tab{
    min-height:34px!important;
    padding:0 9px!important;
    font-size:12px!important;
    flex:0 0 auto!important;
  }
  .masters-sticky-tools .mo-search-action,
  .msng-sticky-tools .mo-search-action,
  .myorders-sticky-tools .mo-search-action,
  .parts-sticky-tools .mo-search-action{margin-top:7px!important;width:100%!important;}
  .masters-sticky-tools .mo-search-toggle,
  .msng-sticky-tools .mo-search-toggle,
  .myorders-sticky-tools .mo-search-toggle,
  .parts-sticky-tools .mo-search-toggle{min-height:36px!important;width:100%!important;font-size:12px!important;}
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid,
  #mo-list,
  .msng-page-sections,
  .cab-tabs,
  .mprof-tabs{grid-template-columns:1fr!important;max-width:100%!important;}
  .ui-table{display:none!important;}
  .ui-data-card{display:block;}
  .desktop-only{display:none!important;}
  .mobile-only{display:initial!important;}
}

@media (min-width: 768px) and (max-width: 1023px){
  :root{
    --ui-page-gap: 16px;
    --ui-card-gap: 14px;
    --ui-font-page-title: 26px;
    --ui-font-card-title: 17px;
    --ui-font-body: 15px;
  }
  .container{padding-left:22px!important;padding-right:22px!important;}
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{
    position:sticky!important;
    top:calc(var(--topbar-h, 62px) + 8px)!important;
    z-index:42!important;
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:10px!important;
    align-items:center!important;
    padding:10px!important;
    margin:12px auto 16px!important;
    max-width:min(100%, 920px)!important;
  }
  .masters-sticky-tools .mo-filter-tabs,
  .msng-sticky-tools .mo-filter-tabs,
  .myorders-sticky-tools .mo-filter-tabs,
  .parts-sticky-tools .mo-filter-tabs{overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none;}
  .masters-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .msng-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
  .parts-sticky-tools .mo-filter-tabs::-webkit-scrollbar{display:none;}
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid,
  #mo-list,
  .cab-tabs,
  .mprof-tabs{grid-template-columns:repeat(2, minmax(0, 1fr))!important;max-width:920px!important;margin-left:auto!important;margin-right:auto!important;}
  .msng-page-sections{max-width:920px!important;margin-left:auto!important;margin-right:auto!important;}
  .ui-table{display:none!important;}
  .ui-data-card{display:block;}
  .desktop-only{display:none!important;}
  .mobile-only{display:initial!important;}
}

@media (min-width: 1024px) and (max-width: 1439px){
  :root{
    --ui-page-gap: 22px;
    --ui-card-gap: 16px;
    --ui-font-page-title: 30px;
  }
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{
    position:sticky!important;
    top:calc(var(--topbar-h, 68px) + 10px)!important;
    z-index:45!important;
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) 240px;
    gap:12px!important;
    align-items:center!important;
    max-width:min(100%, 1160px)!important;
    margin:14px auto 18px!important;
    padding:12px!important;
  }
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid{grid-template-columns:repeat(3, minmax(260px, 1fr))!important;max-width:1180px!important;margin-left:auto!important;margin-right:auto!important;}
  #mo-list,
  .msng-page-sections{max-width:1120px!important;margin-left:auto!important;margin-right:auto!important;}
  .cab-tabs,
  .mprof-tabs{grid-template-columns:repeat(2, minmax(280px, 1fr))!important;max-width:900px!important;margin-left:auto!important;margin-right:auto!important;}
  .ui-table{display:table;}
  .desktop-only{display:initial!important;}
  .mobile-only{display:none!important;}
}

@media (min-width: 1440px){
  :root{
    --ui-page-gap: 28px;
    --ui-card-gap: 18px;
    --ui-font-page-title: 34px;
  }
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{
    position:sticky!important;
    top:calc(var(--topbar-h, 72px) + 12px)!important;
    z-index:45!important;
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) 280px;
    gap:14px!important;
    align-items:center!important;
    max-width:min(100%, 1380px)!important;
    margin:16px auto 22px!important;
    padding:14px!important;
  }
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid{grid-template-columns:repeat(4, minmax(280px, 1fr))!important;max-width:1480px!important;margin-left:auto!important;margin-right:auto!important;}
  #mo-list,
  .msng-page-sections{max-width:1280px!important;margin-left:auto!important;margin-right:auto!important;}
  .cab-tabs,
  .mprof-tabs{grid-template-columns:repeat(2, minmax(320px, 1fr))!important;max-width:980px!important;margin-left:auto!important;margin-right:auto!important;}
  .wide-layout,
  .admin-wide-layout,
  .messages-wide-layout{display:grid;grid-template-columns:minmax(360px, 520px) minmax(0, 1fr);gap:var(--ui-page-gap);align-items:start;}
  .ui-table{display:table;}
  .desktop-only{display:initial!important;}
  .mobile-only{display:none!important;}
}

/* === SOURCE: css/master.css === */
.mmaster-overlay {
  position: fixed; inset: 0; z-index: 960;
  background: rgba(7,17,27,.78); backdrop-filter: blur(6px);
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
}
.mmaster-overlay.open { opacity: 1; pointer-events: all; }

.mmaster-panel {
  position: fixed; z-index: 961;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%) scale(.96);
  width: min(780px, 96vw);
  max-height: 88dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  display: flex; flex-direction: column;
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease, transform .25s cubic-bezier(.16,1,.3,1);
  overflow: hidden;
}
.mmaster-panel.open {
  opacity: 1; pointer-events: all;
  transform: translate(-50%, -50%) scale(1);
}
@media (max-width: 600px) {
  .mmaster-panel {
    top: auto; bottom: 0; left: 0; right: 0;
    transform: translateY(32px) scale(1);
    width: 100%; max-height: 92dvh; border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
    border-bottom: none;
  }
  .mmaster-panel.open { transform: translateY(0) scale(1); }
}

/* Шапка */
.mmaster-head {
  padding: 20px 22px 0;
  flex-shrink: 0;
}
.mmaster-head-row {
  display: flex; gap: 16px; align-items: flex-start;
}
.mmaster-avatar {
  width: 72px; height: 72px; flex-shrink: 0;
  border-radius: 50%;
  background: var(--mc-dim, rgba(52,211,153,.15));
  border: 3px solid var(--mc, #34d399);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  color: var(--mc, #34d399);
}
.mmaster-info { flex: 1; min-width: 0; }
.mmaster-name {
  font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700;
  line-height: 1.15; margin-bottom: 2px;
}
.mmaster-spec { font-size: 13px; color: var(--text2); margin-bottom: 6px; }
.mmaster-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.mmaster-badge {
  display: inline-flex; align-items: center;
  padding: 3px 10px; border-radius: 99px;
  font-size: 11px; font-weight: 700;
}
.mmaster-badge--gold  { background: rgba(251,191,36,.1);  border: 1px solid rgba(251,191,36,.3);  color: #fbbf24; }
.mmaster-badge--green { background: rgba(52,211,153,.1); border: 1px solid rgba(52,211,153,.25); color: #34d399; }
.mmaster-badge--blue  { background: rgba(96,165,250,.1);  border: 1px solid rgba(96,165,250,.25);  color: #60a5fa; }
.mmaster-badge--muted { background: var(--surface-a); border: 1px solid var(--line); color: var(--text2); }
.mmaster-badge--ver   { background: rgba(52,211,153,.08); border: 1px solid rgba(52,211,153,.25); color: #34d399; }
.mmaster-close {
  width: 36px; height: 36px; flex-shrink: 0;
  background: var(--surface-b); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); display: flex; align-items: center;
  justify-content: center; font-size: 18px; cursor: pointer;
  transition: background .15s;
}
.mmaster-close:hover { background: var(--surface-c); }

/* Метрики */
.mmaster-metrics {
  display: flex; gap: 0;
  margin: 16px 22px 0;
  background: var(--surface, var(--surface-a));
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  overflow: hidden;
  flex-shrink: 0;
}
.mmaster-metric {
  flex: 1; padding: 10px 8px; text-align: center;
  border-right: 1px solid var(--line);
}
.mmaster-metric:last-child { border-right: none; }
.mmaster-metric-val {
  font-family: 'Oswald', sans-serif; font-size: 18px;
  font-weight: 700; line-height: 1; color: var(--mc, #34d399);
  margin-bottom: 3px;
}
.mmaster-metric-lbl {
  font-size: 10px; color: var(--text3);
  text-transform: uppercase; letter-spacing: .04em;
}

/* Вкладки */
.mmaster-tabs {
  display: flex; gap: 0; overflow-x: auto; flex-shrink: 0;
  margin: 14px 0 0; padding: 0 22px;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.mmaster-tabs::-webkit-scrollbar { display: none; }
.mmaster-tab {
  flex-shrink: 0; padding: 10px 14px;
  font-size: 12px; font-weight: 700; letter-spacing: .02em;
  color: var(--text3); cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px; transition: color .15s, border-color .15s;
  white-space: nowrap;
}
.mmaster-tab:hover { color: var(--text1); }
.mmaster-tab.active { color: var(--mc, var(--orange)); border-bottom-color: var(--mc, var(--orange)); }

/* Контент вкладок */
.mmaster-body {
  flex: 1; overflow-y: auto; padding: 20px 22px;
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
}
.mmaster-pane { display: none; }
.mmaster-pane.active { display: block; }

/* Метрики панель в «О мастере» */
.mmaster-about-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px; margin-top: 14px;
}
.mmaster-about-item {
  padding: 10px 14px; background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px);
}
.mmaster-about-item span { display: block; font-size: 10px; color: var(--text3); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; font-weight: 700; }
.mmaster-about-item strong { font-size: 13px; color: var(--text1); }

/* Карточка работы в модале */
.mmaster-work-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px; margin-top: 2px;
}
.mmaster-work-card {
  border-radius: var(--ui-radius-md,10px); overflow: hidden;
  background: var(--bg); border: 1px solid var(--line);
  cursor: pointer; transition: transform .15s, border-color .15s;
}
.mmaster-work-card:hover { transform: translateY(-3px); border-color: var(--mc, var(--orange-brd)); }
.mmaster-work-cover {
  height: 110px; background: var(--surface);
  display: flex; align-items: center; justify-content: center;
  font-size: 36px; overflow: hidden;
}
.mmaster-work-cover img { width: 100%; height: 100%; object-fit: cover; }
.mmaster-work-body { padding: 10px 12px; }
.mmaster-work-title { font-size: 13px; font-weight: 700; margin-bottom: 4px; }
.mmaster-work-meta { font-size: 11px; color: var(--text3); }

/* Карточка отзыва */
.mmaster-review {
  padding: 12px 14px; background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px); margin-bottom: 8px;
}
.mmaster-review-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.mmaster-review-name { font-size: 13px; font-weight: 700; }
.mmaster-review-stars { font-size: 13px; color: #fbbf24; }
.mmaster-review-text { font-size: 13px; color: var(--text2); line-height: 1.55; }
.mmaster-review-date { font-size: 11px; color: var(--text3); margin-top: 6px; }

/* Условия */
.mmaster-cond-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.mmaster-cond-row:last-child { border-bottom: none; }
.mmaster-cond-row span { color: var(--text3); }
.mmaster-cond-row strong { color: var(--text1); text-align: right; max-width: 60%; }

/* Footer действий */
.mmaster-footer {
  flex-shrink: 0;
  padding: 14px 22px calc(env(safe-area-inset-bottom, 0px) + 14px);
  border-top: 1px solid var(--line);
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px;
}
@media (max-width: 400px) {
  .mmaster-footer { grid-template-columns: 1fr; }
}
.mmaster-footer-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; padding: 11px 10px;
  border-radius: var(--ui-radius-md,10px); border: 1px solid var(--line);
  font-size: 13px; font-weight: 700; cursor: pointer;
  transition: background .15s, border-color .15s;
  text-decoration: none; color: inherit;
}
.mmaster-footer-btn:hover { border-color: var(--mc, var(--orange-brd)); }
.mmaster-footer-btn--primary {
  background: var(--mc, var(--orange));
  border-color: transparent; color: #07111b;
}
.mmaster-footer-btn--primary:hover { opacity: .9; }
.mmaster-footer-btn--ghost { background: var(--surface-a); }

/* ── Профиль мастера — вкладочный интерфейс (Level 3) ── */
.mprof-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  margin-bottom: 24px;
  scrollbar-width: none;
  position: sticky;
  top: 0;
  z-index: 5;
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter: blur(10px);
  padding: 10px 0;
}
.mprof-tabs::-webkit-scrollbar { display: none; }
.mprof-tab {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--surface, var(--bg2));
  color: var(--text2);
  cursor: pointer;
  flex: 0 0 auto;
  min-width: 44px;
  min-height: 42px;
  padding: 9px 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease, background .16s ease;
}
.mprof-tab:hover {
  color: var(--text1);
  border-color: var(--mc-brd, var(--orange-brd));
  transform: translateY(-1px);
}
.mprof-tab.active {
  color: var(--mc, var(--orange));
  border-color: var(--mc-brd, var(--orange-brd));
  background: linear-gradient(135deg, var(--mc-dim, rgba(255,107,0,.12)), var(--surface, var(--bg2)));
  box-shadow: 0 12px 26px rgba(15, 23, 42, .08);
  padding-right: 14px;
}
.mprof-tab-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 18px;
  line-height: 1;
}
.mprof-tab-label,
.mprof-tab-count {
  display: none;
}
.mprof-tab.active .mprof-tab-label,
.mprof-tab.active .mprof-tab-count {
  display: inline-flex;
}
.mprof-tab-count {
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  color: #07111b;
  background: var(--mc, var(--orange));
}
.mprof-pane { display: none; }
.mprof-pane.active { display: block; }
@media (max-width: 640px) {
  .mprof-tabs {
    gap: 6px;
    margin-left: -4px;
    margin-right: -4px;
    padding: 8px 4px;
  }
  .mprof-tab {
    min-width: 42px;
    min-height: 40px;
    padding: 8px 10px;
    font-size: 13px;
  }
  .mprof-tab.active {
    max-width: 210px;
  }
  .mprof-tab-ico {
    font-size: 17px;
  }
}


/* r72: равномерная сетка вкладок профиля мастера — все иконки занимают одинаковую долю ширины */
.mprof-tabs.mprof-tabs--icons {
  display: grid;
  grid-template-columns: repeat(var(--mprof-tabs-count, 6), minmax(0, 1fr));
  align-items: stretch;
  width: 100%;
  gap: 8px;
  overflow: visible;
  padding-left: 0;
  padding-right: 0;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab {
  width: 100%;
  min-width: 0;
  flex: initial;
  padding-left: 6px;
  padding-right: 6px;
  justify-content: center;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-label,
.mprof-tabs.mprof-tabs--icons .mprof-tab-count {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab.active {
  max-width: none;
}
@media (max-width: 640px) {
  .mprof-tabs.mprof-tabs--icons {
    gap: 6px;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab {
    min-width: 0;
    padding-left: 4px;
    padding-right: 4px;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab-label {
    font-size: 12px;
    line-height: 1;
  }
}

/* Офер-строка на карточке */
.master-card__offer {
  font-size: 11px; color: var(--text2); line-height: 1.45;
  margin-top: 4px; font-style: italic;
}
.master-card__workmode {
  font-size: 11px; color: var(--text3);
  display: flex; align-items: center; gap: 4px;
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER CABINET — Profile editor, Posts manager, Stats
═══════════════════════════════════════════════════════════════════ */

/* Кнопки доступности */
.avail-btn {
  padding: 10px 14px; border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line); background: var(--bg);
  cursor: pointer; text-align: left;
  transition: border-color .15s, background .15s;
}
.avail-btn:hover { border-color: var(--orange-brd); }
.avail-btn--active {
  border-color: var(--orange) !important;
  background: rgba(255,107,0,.1) !important;
}

/* Карточки публикаций */
.posts-mgr-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  overflow: hidden;
  transition: border-color .15s;
}
.posts-mgr-card:hover { border-color: var(--orange-brd); }

/* Редактор постов overlay */
#master-post-editor-overlay {
  opacity: 0;
  transition: opacity .25s ease;
}
#master-post-editor-overlay.visible { opacity: 1; }

/* pf-input base (если не определён) */
.pf-input {
  width: 100%; padding: 10px 14px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); color: var(--text1);
  font-family: inherit; outline: none;
  transition: border-color .15s;
  box-sizing: border-box;
}
.pf-input:focus { border-color: var(--orange); }
select.pf-input { cursor: pointer; }
textarea.pf-input { min-height: 80px; }

/* Stats grid */
.mstat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 10px;
}
.mstat-cell {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 14px 12px; text-align: center;
}
.mstat-val {
  font-family: 'Oswald', sans-serif; font-size: 22px;
  font-weight: 700; line-height: 1; margin-bottom: 5px;
}
.mstat-lbl {
  font-size: 10px; color: var(--text3);
  text-transform: uppercase; letter-spacing: .04em;
}

/* ═══════════════════════════════════════════════════════════════════
   REVIEWS — гистограмма, суб-рейтинги, карточки отзывов
═══════════════════════════════════════════════════════════════════ */
.review-summary-block {
  display: flex; gap: 20px; align-items: flex-start;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px); padding: 20px;
  margin-bottom: 16px;
}
@media (max-width: 480px) {
  .review-summary-block { flex-direction: column; gap: 14px; }
}
.review-summary-score {
  flex-shrink: 0; text-align: center; min-width: 80px;
}
.review-score-big {
  font-family: 'Oswald', sans-serif; font-size: 48px;
  font-weight: 700; line-height: 1; color: var(--text1);
}
.review-score-stars {
  font-size: 16px; color: #fbbf24; letter-spacing: 2px;
  margin: 4px 0;
}
.review-score-count {
  font-size: 11px; color: var(--text3);
  text-transform: uppercase; letter-spacing: .04em;
}
.review-histogram {
  flex: 1; display: flex; flex-direction: column; gap: 5px;
}
.review-hist-row {
  display: flex; align-items: center; gap: 8px;
}
.review-hist-label {
  font-size: 11px; font-weight: 700; color: var(--text3);
  min-width: 22px; text-align: right; flex-shrink: 0;
}
.review-hist-bar-wrap {
  flex: 1; height: 8px; background: var(--line);
  border-radius: 99px; overflow: hidden;
}
.review-hist-bar {
  height: 100%; background: #fbbf24;
  border-radius: 99px;
  transition: width .5s ease;
  min-width: 4px;
}
.review-hist-count {
  font-size: 11px; color: var(--text3);
  min-width: 16px; text-align: right; flex-shrink: 0;
}

.review-sub-ratings {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px; margin-bottom: 16px;
}
.review-sub-item {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 10px 14px;
  display: flex; flex-direction: column; gap: 6px;
}
.review-sub-label {
  font-size: 11px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: .04em;
}
.review-sub-bar-wrap {
  height: 6px; background: var(--line); border-radius: 99px; overflow: hidden;
}
.review-sub-bar {
  height: 100%; background: linear-gradient(90deg, var(--orange), #fbbf24);
  border-radius: 99px; transition: width .5s ease;
}
.review-sub-score {
  font-family: 'Oswald', sans-serif; font-size: 14px;
  font-weight: 700; color: var(--orange);
}

/* Карточка отзыва — общая для профиля и модала */
.master-review-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 14px 16px;
  transition: border-color .15s;
}
.master-review-card:hover { border-color: var(--orange-brd); }
.mrc-header {
  display: flex; align-items: flex-start; gap: 12px;
  margin-bottom: 10px;
}
.mrc-avatar {
  width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, rgba(255,107,0,.15), rgba(52,211,153,.12));
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 15px;
  font-weight: 700; color: var(--orange);
}
.mrc-info { flex: 1; min-width: 0; }
.mrc-name {
  font-size: 13px; font-weight: 700; color: var(--text1);
  margin-bottom: 2px; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis;
}
.mrc-date { font-size: 11px; color: var(--text3); }
.mrc-stars {
  font-size: 14px; color: #fbbf24; flex-shrink: 0;
  letter-spacing: 1px;
}
.mrc-text {
  font-size: 13px; color: var(--text2); line-height: 1.65;
}
.mrc-reply {
  margin-top: 10px; padding: 10px 12px;
  background: rgba(52,211,153,.06); border-left: 3px solid #34d399;
  border-radius: 0 var(--ui-radius-sm,5px) var(--ui-radius-sm,5px) 0;
  font-size: 12px; color: var(--text2); line-height: 1.55;
}
.mrc-reply-label {
  font-weight: 700; color: #34d399; display: block; margin-bottom: 3px;
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER CONTACT LIST — карточки мастеров в стиле category-card
═══════════════════════════════════════════════════════════════════ */
.masters-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  max-width: 1180px;
  margin: 0 auto;
}

.master-contact-row {
  width: 100%;
  min-height: 178px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--mc, var(--orange)) 24%, var(--line));
  border-radius: var(--ui-radius-lg,18px);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mc, var(--orange)) 10%, var(--surface)) 0%,
    var(--surface) 100%
  );
  box-shadow: 0 8px 28px rgba(0,0,0,.10);
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  transition: transform .18s, box-shadow .18s, border-color .18s, background .18s;
}
.master-contact-row::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 18% 10%, color-mix(in srgb, var(--mc, var(--orange)) 16%, transparent), transparent 34%);
  opacity: .75;
}
.master-contact-row:hover {
  transform: translateY(-4px);
  border-color: var(--mc, var(--orange));
  box-shadow: 0 16px 36px rgba(0,0,0,.16);
}
.master-contact-row:active {
  transform: translateY(-1px);
}

/* Аватар */
.mcl-avatar {
  width: 60px; height: 60px; flex-shrink: 0;
  border-radius: var(--ui-radius-lg,18px);
  border: 1px solid;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 800;
  position: relative;
  z-index: 1;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.mcl-status-dot {
  position: absolute; bottom: -2px; right: -2px;
  width: 14px; height: 14px; border-radius: 50%;
  border: 3px solid var(--surface);
}

/* Тело карточки */
.mcl-body {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 8px;
  position: static;
}
.mcl-top {
  display: block;
  min-height: 30px;
  padding-right: 92px;
}
.mcl-name {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 800; line-height: 1;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mcl-rating {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 15px; font-weight: 800; color: #fbbf24;
  background: color-mix(in srgb, #fbbf24 14%, var(--surface));
  border: 1px solid rgba(251,191,36,.30);
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
  padding: 7px 10px; border-radius: 999px;
  white-space: nowrap;
  pointer-events: none;
}
.mcl-spec {
  font-size: 16px; color: var(--text2);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mcl-chips {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px;
}
.mcl-chip {
  font-size: 14px; font-weight: 800;
  padding: 7px 10px; border-radius: 999px;
  background: color-mix(in srgb, var(--mc, var(--orange)) 13%, var(--surface-b));
  border: 1px solid color-mix(in srgb, var(--mc, var(--orange)) 28%, var(--line));
  color: var(--mc, var(--orange));
  white-space: nowrap;
}
.mcl-meta {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px;
}
.mcl-meta-item {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 15px; color: var(--text2);
  padding: 8px 10px; border-radius: 999px;
  background: var(--surface-b);
  border: 1px solid var(--line);
}
.mcl-price {
  color: var(--mc, var(--orange));
  font-weight: 800;
}
.mcl-verified { color: #34d399; }


[data-theme="light"] .masters-grid .master-contact-row {
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mc, var(--orange)) 8%, #fff) 0%,
    #fff 100%
  ) !important;
  border-color: color-mix(in srgb, var(--mc, var(--orange)) 18%, rgba(0,0,0,.08)) !important;
}
[data-theme="light"] .masters-grid .mcl-meta-item {
  background: #fff !important;
  border-color: rgba(0,0,0,.08) !important;
}

@media (max-width: 980px) {
  .masters-grid { grid-template-columns: 1fr; max-width: 720px; }
}
@media (max-width: 640px) {
  .masters-grid { gap: 14px; }
  .master-contact-row {
    min-height: 0;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 18px;
    border-radius: var(--ui-radius-lg,18px);
  }
  .mcl-avatar { width: 54px; height: 54px; border-radius: var(--ui-radius-md,10px); font-size: 22px; }
  .mcl-top { min-height: 28px; padding-right: 78px; }
  .mcl-name { font-size: 15px; line-height: 1.12; }
  .mcl-spec { font-size: 12px; line-height: 1.45; }
  .mcl-chip { font-size: 12px; padding: 8px 11px; }
  .mcl-meta-item { font-size: 12px; padding: 8px 10px; }
  .mcl-rating { top: 12px; right: 12px; font-size: 12px; padding: 6px 9px; }
}
@media (max-width: 420px) {
  .master-contact-row { padding: 16px; gap: 12px; }
  .mcl-avatar { width: 48px; height: 48px; font-size: 20px; }
  .mcl-top { padding-right: 74px; }
  .mcl-name { font-size: 15px; line-height: 1.12; }
  .mcl-spec { font-size: 12px; -webkit-line-clamp: 3; }
  .mcl-chip { font-size: 12px; }
  .mcl-meta-item { font-size: 12px; padding: 8px 10px; }
  .mcl-rating { top: 10px; right: 10px; font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════
   SPLASH SCREEN — анимация логотипа при загрузке
═══════════════════════════════════════════════════════════════════ */
#kareta-splash {
  position: fixed; inset: 0; z-index: 9999;
  pointer-events: none;
  /* Фон исчезает */
  animation: splash-bg-fade 0.55s ease 1.7s forwards;
}
.splash-bg {
  position: absolute; inset: 0;
  background: var(--bg);
  animation: splash-bg-out 0.55s ease 1.7s forwards;
}
@keyframes splash-bg-out {
  from { opacity: 1; }
  to   { opacity: 0; }
}
/* Обёртка логотипа — стартует по центру экрана */
.splash-logo-wrap {
  position: absolute;
  /* JS вычислит точную конечную позицию и подставит CSS-переменные */
  left: var(--splash-start-x, 50%);
  top:  var(--splash-start-y, 50%);
  transform: translate(-50%, -50%) scale(var(--splash-start-scale, 2.6));
  transform-origin: center center;
  display: flex; flex-direction: column; align-items: center;
  gap: 6px;
  /* Фаза 1 — держим 1.7с неподвижно */
  /* Фаза 2 — JS запускает анимацию в позицию nav */
  transition:
    left   0.72s cubic-bezier(.32,.72,0,1),
    top    0.72s cubic-bezier(.32,.72,0,1),
    transform 0.72s cubic-bezier(.32,.72,0,1),
    opacity 0.3s ease;
}
.splash-logo-wrap.splash-done {
  opacity: 0;
  pointer-events: none;
}

.splash-logo-icon {
  width: 52px; height: 52px;
  background: rgba(255,107,0,.12);
  border: 1.5px solid rgba(255,107,0,.3);
  border-radius: var(--ui-radius-md,10px);
  display: flex; align-items: center; justify-content: center;
  padding: 10px;
  /* Пульс на старте */
  animation: splash-pulse 1.5s ease 0s 1;
}
@keyframes splash-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,107,0,.4); }
  50%  { box-shadow: 0 0 0 18px rgba(255,107,0,.0); }
  100% { box-shadow: 0 0 0 0 rgba(255,107,0,.0); }
}
.splash-logo-text {
  font-family: 'Oswald', sans-serif;
  font-size: 28px; font-weight: 700; color: #fff;
  letter-spacing: .5px; line-height: 1;
}
.splash-logo-text em { color: #FF6B00; font-style: normal; }
.splash-logo-sub {
  font-size: 11px; letter-spacing: 3px;
  color: var(--text3); text-transform: uppercase;
}

/* onb2 styles moved to css/onb2.css to keep onboarding isolated and versioned. */

/* ═══ ЭВАКУАТОР — экстренная полоса на главной ═══ */
.home-emergency-bar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 20px;
  background: linear-gradient(90deg, rgba(239,68,68,.12), rgba(239,68,68,.06));
  border-bottom: 1px solid rgba(239,68,68,.2);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s;
}
.home-emergency-bar:active { background: rgba(239,68,68,.18); }
.home-emergency-ico { font-size: 20px; flex-shrink: 0; }
.home-emergency-text {
  font-size: 14px; font-weight: 700; color: #ef4444; flex: 1;
}
.home-emergency-arrow { font-size: 18px; color: rgba(239,68,68,.6); }

/* ═══ ЭВАКУАТОР — модальное окно ═══ */
.evac-panel {
  width: min(480px, 100%);
  background: var(--bg2);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  border: 1px solid var(--line); border-bottom: none;
  overflow: hidden;
  transform: translateY(40px);
  transition: transform .32s cubic-bezier(.16,1,.3,1);
}
.evac-panel-head {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 14px;
  padding: 24px 20px 16px;
  border-bottom: 1px solid var(--line);
}
.evac-panel-title {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; color: #ef4444;
}
.evac-panel-sub { font-size: 13px; color: var(--text2); margin-top: 4px; }

/* ═══════════════════════════════════════════════════════════════════
   LIGHT THEME — полный оверрайд
═══════════════════════════════════════════════════════════════════ */
[data-theme="light"] {
  color-scheme: light;
}

/* Nav и header */
[data-theme="light"] #nav,
[data-theme="light"] .site-header {
  background: rgba(250,250,252,.96) !important;
  border-color: rgba(0,0,0,.08) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
[data-theme="light"] .nav-logo-text { color: #111; }
[data-theme="light"] .nav-link { color: var(--text2); }
[data-theme="light"] .nav-link.active { color: var(--orange); }

/* Bottom nav */
[data-theme="light"] #bottom-nav {
  background: rgba(250,250,252,.96) !important;
  border-color: rgba(0,0,0,.08) !important;
  box-shadow: 0 -1px 0 rgba(0,0,0,.06);
}
[data-theme="light"] .bnav-item { color: var(--text2); }
[data-theme="light"] .bnav-item.active { color: var(--orange); }
[data-theme="light"] .bnav-icon-wrap { color: var(--text2); }

/* Drawer */
[data-theme="light"] #drawer {
  background: #fff !important;
  border-color: rgba(0,0,0,.08) !important;
  box-shadow: 4px 0 24px rgba(0,0,0,.1);
}
[data-theme="light"] .drawer-link { color: var(--text1); }
[data-theme="light"] .drawer-link:hover { background: rgba(0,0,0,.04); }
[data-theme="light"] .drawer-handle { background: rgba(0,0,0,.15); }

/* Cards и surfaces */
[data-theme="light"] .card,
[data-theme="light"] .ncard,
[data-theme="light"] .hcat-card,
[data-theme="light"] .home-special-card,
[data-theme="light"] .home-trust-card,
[data-theme="light"] .onb2-modal,
[data-theme="light"] .spec-svc-panel,
[data-theme="light"] .profile-setup-panel,
[data-theme="light"] .evac-panel {
  background: #fff !important;
  border-color: rgba(0,0,0,.08) !important;
}
[data-theme="light"] .master-contact-row,
[data-theme="light"] .sto-section,
[data-theme="light"] .sto-stat-card,
[data-theme="light"] .settings-list {
  background: #fff !important;
  border-color: rgba(0,0,0,.08) !important;
}

/* Onboarding */
[data-theme="light"] #onb2-overlay { background: rgba(0,0,0,.5); }
[data-theme="light"] .onb2-modal { background: #fff !important; }
[data-theme="light"] .onb2-role-card { background: #f7f7f9 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .onb2-role-card.onb2-role--featured { background: rgba(255,107,0,.05) !important; }
[data-theme="light"] .onb2-role-ico-wrap { background: rgba(255,107,0,.07) !important; border-color: rgba(255,107,0,.14) !important; }
[data-theme="light"] .onb2-role-feat { background: #fff !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .onb2-spec-card { background: #f7f7f9 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .onb2-spec-check { background: #fff !important; border-color: rgba(0,0,0,.12) !important; }
[data-theme="light"] .onb2-city-slide { background: #f7f7f9 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .onb2-brand-slide { background: #f7f7f9 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .onb2-back-btn { background: #f0f0f3 !important; border-color: rgba(0,0,0,.08) !important; color: var(--text2); }
[data-theme="light"] .onb2-slide-nav { background: #f0f0f3 !important; border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] .onb2-dot { background: rgba(0,0,0,.12); }

/* Splash */
[data-theme="light"] #kareta-splash,
[data-theme="light"] .splash-bg { background: #f5f5f7; }
[data-theme="light"] .splash-logo-text { color: #111; }

/* Inputs */
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea,
[data-theme="light"] .pf-input {
  background: #f7f7f9 !important;
  color: #111 !important;
  border-color: rgba(0,0,0,.12) !important;
}
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder { color: #aaa; }

/* Hero */
[data-theme="light"] .hero { background: linear-gradient(135deg, #f5f5f7 0%, #fff 100%); }
[data-theme="light"] .hero-title { color: #111; }
[data-theme="light"] .hero-desc { color: #555; }
[data-theme="light"] .hero-grid, [data-theme="light"] .hero-glow, [data-theme="light"] .hero-glow2 { opacity: .15; }

/* Buttons */
[data-theme="light"] .btn-ghost { color: var(--text2); }
[data-theme="light"] .btn-ghost:hover { color: var(--text1); background: rgba(0,0,0,.04); }
[data-theme="light"] .btn-outline { border-color: rgba(0,0,0,.15); color: var(--orange); }
[data-theme="light"] .btn-outline:hover { background: rgba(255,107,0,.06); }

/* Badges и чипы */
[data-theme="light"] .rbadge { opacity: .9; }
[data-theme="light"] .nws-pill { border-color: rgba(0,0,0,.1); color: var(--text2); }
[data-theme="light"] .nws-pill:hover { border-color: rgba(0,0,0,.2); color: var(--text1); }
[data-theme="light"] .ncard-noimg { background: linear-gradient(135deg,rgba(255,107,0,.1),rgba(255,107,0,.04)); }

/* Emergency bar */
[data-theme="light"] .home-emergency-bar {
  background: linear-gradient(90deg, rgba(239,68,68,.08), rgba(239,68,68,.03)) !important;
  border-color: rgba(239,68,68,.15) !important;
}

/* Splash */
[data-theme="light"] .splash-logo-sub { color: rgba(0,0,0,.35); }

/* Скроллбар */
[data-theme="light"] ::-webkit-scrollbar-track { background: #f5f5f7; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: #d0d0d5; }

/* @media auto тема */
@media (prefers-color-scheme: light) {
  [data-theme="auto"] #nav,
  [data-theme="auto"] .site-header { background: rgba(250,250,252,.96) !important; border-color: rgba(0,0,0,.08) !important; }
  [data-theme="auto"] #bottom-nav { background: rgba(250,250,252,.96) !important; border-color: rgba(0,0,0,.08) !important; }
  [data-theme="auto"] .card, [data-theme="auto"] .ncard { background: #fff !important; border-color: rgba(0,0,0,.08) !important; }
  [data-theme="auto"] input, [data-theme="auto"] select { background: #f7f7f9 !important; color: #111 !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   ENTRY FLOW ACTIVE — скрытие nav/header до выбора роли
═══════════════════════════════════════════════════════════════════ */
.entry-flow-active #bottom-nav,
html.entry-flow-active #bottom-nav {
  display: none !important;
}
.entry-flow-active #nav,
html.entry-flow-active #nav {
  visibility: hidden !important;
  pointer-events: none;
}
.entry-flow-active #drawer,
html.entry-flow-active #drawer {
  display: none !important;
}
.entry-flow-active #drawer-overlay,
html.entry-flow-active #drawer-overlay {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   HOME CATALOG — клиентский вход в сервисный модуль
═══════════════════════════════════════════════════════════════════ */

/* ── Личный кабинет мастера: плитки 2 в ряд ───────────────────────── */
.master-cabinet-tile-nav{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  width:100%;
  max-width:560px;
  margin:0 auto 12px;
  padding:2px 0 10px;
}
.master-cabinet-tile-nav .master-cabinet-tile{
  position:relative;
  width:100%;
  min-height:82px;
  border-radius:var(--ui-radius-md,10px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:5px;
  padding:10px 11px;
  white-space:normal;
  text-align:left;
  line-height:1.15;
  font-weight:800;
  overflow:hidden;
  box-shadow:0 8px 18px rgba(15,23,42,.06);
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.master-cabinet-tile-nav .master-cabinet-tile:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(15,23,42,.09);
}
.master-cabinet-tile-nav .master-cabinet-tile:focus-visible{
  outline:2px solid var(--orange, #ff6b00);
  outline-offset:2px;
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-top{
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-ico{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  flex:0 0 32px;
  border-radius:var(--ui-radius-md,10px);
  font-size:18px;
  background:var(--surface-a, rgba(255,255,255,.58));
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-badge{
  max-width:82px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:4px 8px;
  border-radius:999px;
  font-size:10px;
  line-height:1;
  font-weight:900;
  color:var(--orange, #ff6b00);
  background:rgba(255,107,0,.10);
  border:1px solid rgba(255,107,0,.22);
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-label{
  display:block;
  width:100%;
  font-size:13px;
  letter-spacing:.01em;
  color:var(--text1);
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-desc{
  display:block;
  width:100%;
  min-height:0;
  font-size:10px;
  line-height:1.18;
  color:var(--text3);
  font-weight:700;
}
.master-cabinet-tile-nav .master-cabinet-tile.active,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary{
  transform:translateY(-1px);
  border-color:var(--orange-brd, rgba(255,107,0,.38));
  box-shadow:0 16px 38px rgba(255,107,0,.12), 0 10px 26px rgba(15,23,42,.06);
}
.master-cabinet-tile-nav .master-cabinet-tile.active::after,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary::after{
  content:'';
  position:absolute;
  left:10px;
  right:10px;
  bottom:7px;
  height:3px;
  border-radius:999px;
  background:var(--orange, #ff6b00);
  opacity:.9;
}
.master-cabinet-tile-nav .master-cabinet-tile.active .mct-desc,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-desc{
  color:rgba(255,255,255,.82);
}
.master-cabinet-tile-nav .master-cabinet-tile:active{
  transform:translateY(0);
}
[data-theme="light"] .master-cabinet-tile-nav .master-cabinet-tile.active .mct-desc,
[data-theme="light"] .master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-desc{
  color:rgba(255,255,255,.88);
}
@media (max-width:420px){
  .master-cabinet-tile-nav{
    gap:7px;
    max-width:100%;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:66px;
    border-radius:var(--ui-radius-md,10px);
    padding:8px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile .mct-ico{
    width:28px;
    height:28px;
    flex-basis:28px;
    border-radius:var(--ui-radius-md,10px);
    font-size:16px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile .mct-label{
    font-size:12.5px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile .mct-desc{
    display:none;
  }
  .master-cabinet-tile-nav .master-cabinet-tile .mct-badge{
    max-width:70px;
    padding:4px 6px;
    font-size:9.5px;
  }
}

/* ── Личный кабинет мастера: верхняя сводка и заголовок текущего раздела ── */
.master-cabinet-hero{
  width:100%;
  max-width:620px;
  margin:0 auto 14px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(135deg,rgba(255,107,0,.10),rgba(52,211,153,.07)), var(--surface);
  box-shadow:0 14px 34px rgba(15,23,42,.07);
}
.master-cabinet-hero .mch-main{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.master-cabinet-hero .mch-avatar{
  width:58px;
  height:58px;
  flex:0 0 58px;
  border-radius:var(--ui-radius-lg,18px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Oswald',sans-serif;
  font-size:22px;
  font-weight:900;
  color:var(--orange,#ff6b00);
  background:rgba(255,255,255,.55);
  border:1px solid rgba(255,107,0,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
.master-cabinet-hero .mch-copy{min-width:0;flex:1;}
.master-cabinet-hero .mch-kicker{
  font-size:10px;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
  margin-bottom:3px;
}
.master-cabinet-hero .mch-title{
  font-family:'Oswald',sans-serif;
  font-size:21px;
  line-height:1.12;
  font-weight:900;
  color:var(--text1);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.master-cabinet-hero .mch-sub{
  margin-top:5px;
  font-size:12px;
  line-height:1.35;
  color:var(--text2);
  font-weight:700;
}
.master-cabinet-hero .mch-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:14px;
}
.master-cabinet-hero .mch-stat{
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(255,255,255,.38);
  padding:10px 8px;
  text-align:center;
}
.master-cabinet-hero .mch-stat b{
  display:block;
  font-family:'Oswald',sans-serif;
  font-size:20px;
  line-height:1;
  color:var(--orange,#ff6b00);
}
.master-cabinet-hero .mch-stat span{
  display:block;
  margin-top:4px;
  font-size:10px;
  color:var(--text3);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.master-cabinet-hero .mch-progress{
  height:7px;
  border-radius:999px;
  overflow:hidden;
  margin-top:12px;
  background:rgba(148,163,184,.18);
  border:1px solid rgba(148,163,184,.18);
}
.master-cabinet-hero .mch-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--orange,#ff6b00),#34d399);
}
.master-cabinet-hero .mch-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}
.master-cabinet-hero .mch-actions .btn{
  min-width:0;
  padding:9px 10px;
  font-size:12px;
  border-radius:var(--ui-radius-md,10px);
  white-space:nowrap;
}
.master-cabinet-section-head{
  width:100%;
  max-width:620px;
  margin:0 auto 14px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-lg,18px);
  background:var(--surface);
}
.master-cabinet-section-head .mcsh-ico{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--ui-radius-md,10px);
  font-size:21px;
  background:rgba(255,107,0,.10);
  border:1px solid rgba(255,107,0,.18);
}
.master-cabinet-section-head .mcsh-text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.master-cabinet-section-head .mcsh-text b{
  font-size:14px;
  line-height:1.15;
  color:var(--text1);
}
.master-cabinet-section-head .mcsh-text small{
  font-size:11px;
  line-height:1.3;
  color:var(--text3);
  font-weight:700;
}
@media (max-width:420px){
  .master-cabinet-hero{
    border-radius:var(--ui-radius-lg,18px);
    padding:14px;
  }
  .master-cabinet-hero .mch-avatar{
    width:52px;
    height:52px;
    flex-basis:52px;
    border-radius:var(--ui-radius-lg,18px);
    font-size:20px;
  }
  .master-cabinet-hero .mch-title{font-size:19px;}
  .master-cabinet-hero .mch-sub{font-size:11.5px;}
  .master-cabinet-hero .mch-actions{
    grid-template-columns:1fr;
  }
  .master-cabinet-hero .mch-actions .btn{
    width:100%;
    padding:10px;
  }
}


.master-cabinet-inline-panel{
  width:100%;
  margin:2px auto 0;
  padding:0;
}
.master-cabinet-inline-panel > *:first-child{
  margin-top:0 !important;
}

/* r137: мастерский кабинет — встроенный контент вместо модального окна */
/* ═══════════════════════════════════════════════════════════════════
   MASTER CABINET IMPROVEMENTS
═══════════════════════════════════════════════════════════════════ */

/* Шапка профиля мастера */
.mstr-profile-head {
  padding: 20px 20px 0;
  display: flex; align-items: flex-start; gap: 16px;
}
.mstr-av {
  width: 72px; height: 72px;
  border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  background: linear-gradient(135deg, rgba(52,211,153,.2), rgba(52,211,153,.08));
  border: 2px solid rgba(52,211,153,.35);
  color: #34d399;
  position: relative;
}
.mstr-av-photo {
  width: 100%; height: 100%;
  border-radius: 50%;
  object-fit: cover;
  position: absolute; inset: 0;
}
.mstr-info { flex: 1; min-width: 0; padding-top: 4px; }
.mstr-name {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mstr-spec {
  font-size: 13px; color: var(--orange);
  font-weight: 600; margin-top: 4px;
}
.mstr-meta {
  display: flex; align-items: center;
  gap: 12px; margin-top: 8px; flex-wrap: wrap;
}

/* Блок анкеты */
.mstr-bio-block {
  font-size: 14px; color: var(--text2);
  line-height: 1.7; padding: 14px;
  background: rgba(255,255,255,.03);
  border-radius: var(--ui-radius-md,10px); margin-bottom: 4px;
}
.mstr-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}
.mstr-info-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 14px;
}
.mstr-info-label {
  font-size: 10px; color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .5px; margin-bottom: 6px;
}
.mstr-info-value {
  font-size: 13px; color: var(--text2);
  line-height: 1.55;
}

/* Skills chips */
.mstr-skills {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.mstr-skill-chip {
  font-size: 12px; padding: 4px 12px;
  border-radius: 999px;
  background: rgba(255,107,0,.07);
  border: 1px solid rgba(255,107,0,.18);
  color: var(--text2);
}

/* Stats mini-grid */
.mstr-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 16px 20px;
}
.mstr-stat-card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 10px;
  text-align: center;
}
.mstr-stat-n {
  display: block;
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; color: var(--orange);
}
.mstr-stat-l {
  display: block; font-size: 10px;
  color: var(--text3); margin-top: 3px;
}

/* Available/Unavailable badge */
.mstr-status-avail {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 99px;
  font-size: 12px; font-weight: 700;
}
.mstr-status-avail.on {
  background: rgba(34,197,94,.1);
  border: 1px solid rgba(34,197,94,.25);
  color: #22c55e;
}
.mstr-status-avail.off {
  background: rgba(148,163,184,.08);
  border: 1px solid var(--line);
  color: var(--text3);
}

/* Mobile */
@media (max-width: 640px) {
  .mstr-profile-head { padding: 16px 16px 0; gap: 12px; }
  .mstr-av { width: 56px; height: 56px; font-size: 20px; }
  .mstr-name { font-size: 18px; }
  .mstr-stats-grid { grid-template-columns: repeat(3, 1fr); padding: 12px 16px; }
  .mstr-stat-n { font-size: 17px; }
  .mstr-grid-2 { grid-template-columns: 1fr; }
}

/* r138: master cabinet inline cleanup — без модалки, компактные плитки */
.master-cabinet-inline-panel{
  max-width:920px;
  margin:0 auto;
}
.master-cabinet-inline-panel:focus-within{
  scroll-margin-top:calc(var(--nav-h, 64px) + 10px);
}
.master-cabinet-tile-nav .master-cabinet-tile{
  min-height:72px;
  padding:9px 10px;
  border-radius:var(--ui-radius-md,10px);
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-ico{
  width:28px;
  height:28px;
  flex-basis:28px;
  border-radius:var(--ui-radius-md,10px);
  font-size:16px;
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-label{
  font-size:12.5px;
}
.master-cabinet-tile-nav .master-cabinet-tile .mct-desc{
  font-size:9.5px;
}
@media (max-width:680px){
  .master-cabinet-tile-nav{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    padding-bottom:8px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:58px;
    padding:7px 8px;
    gap:3px;
    box-shadow:none;
  }
  .master-cabinet-tile-nav .master-cabinet-tile:hover{
    transform:none;
    box-shadow:none;
  }
  .master-cabinet-tile-nav .master-cabinet-tile .mct-desc,
  .master-cabinet-tile-nav .master-cabinet-tile .mct-badge{
    display:none !important;
  }
  .master-cabinet-tile-nav .master-cabinet-tile.active::after,
  .master-cabinet-tile-nav .master-cabinet-tile.btn-primary::after{
    left:8px;
    right:8px;
    bottom:5px;
    height:2px;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER CABINET MODAL (mcab-modal)
   Использует k-overlay + k-sheet из additions.css
═══════════════════════════════════════════════════════════════════ */

/* Тайл — убираем active-after стрелку если кабинет в модалке */
.master-cabinet-tile-nav .master-cabinet-tile.active::after,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary::after {
  content: none;
}

/* Тайл активный — просто оранжевый бордер */
.master-cabinet-tile-nav .master-cabinet-tile.active,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary {
  border-color: var(--orange) !important;
  background: rgba(255,107,0,.06) !important;
  box-shadow: 0 0 0 2px rgba(255,107,0,.15) !important;
}

/* Inline panel — только для сводки (cabinet) */
.master-cabinet-inline-panel {
  transition: opacity .2s ease;
}

/* k-sheet body для кабинетных разделов */
#mcab-modal .k-sheet {
  max-height: 92dvh;
}
#mcab-modal .k-sheet-body {
  padding: 16px 20px 24px;
}
#mcab-modal .k-sheet-body > .pf-section:first-child,
#mcab-modal .k-sheet-body > .card:first-child {
  margin-top: 0 !important;
}

/* Заголовок модалки кабинета */
#mcab-modal .k-sheet-title {
  font-size: 17px;
}

/* Мобильные улучшения */
@media (max-width: 640px) {
  #mcab-modal .k-sheet-body {
    padding: 14px 16px 20px;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER CHATS PANE (mp-chats)
═══════════════════════════════════════════════════════════════════ */
.master-chat-row {
  transition: background .15s, transform .1s;
}
.master-chat-row:hover {
  background: rgba(255,107,0,.04) !important;
}
.master-chat-row:active {
  transform: scale(.99);
}

.msng-master-pane { width: 100%; }
.msng-master-pane-head {
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  position: sticky; top: 0; z-index: 2;
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER SCHEDULE — онбординг-хинт
═══════════════════════════════════════════════════════════════════ */
.msched-onboard-hint {
  padding: 10px 14px;
  background: rgba(255,107,0,.08);
  border: 1px solid rgba(255,107,0,.2);
  border-radius: var(--ui-radius-md,10px);
  font-size: 12px;
  color: var(--orange);
  margin-top: 8px;
  line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER PROCESS — кнопки "Нет заказов"
═══════════════════════════════════════════════════════════════════ */
.mx-empty-state > div[style*="gap:10px"] {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}

/* ═══════════════════════════════════════════════════════════════════
   CABINET TILES — улучшенные
═══════════════════════════════════════════════════════════════════ */
.master-cabinet-tile-nav .master-cabinet-tile {
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.master-cabinet-tile-nav .master-cabinet-tile:hover:not(.active) {
  border-color: rgba(255,107,0,.35);
  background: rgba(255,107,0,.04);
}

/* r222: профиль мастера — большие кнопки 2 в ряд + pane в модальных окнах */
.mprof-tabs.mprof-tabs--icons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  position: relative !important;
  top: auto !important;
  z-index: 1 !important;
  overflow: visible !important;
  border-bottom: 0 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 86px !important;
  padding: 14px 14px !important;
  border-radius: var(--ui-radius-lg,18px) !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: left !important;
  background: var(--surface, #fff) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06) !important;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab.active {
  background: linear-gradient(135deg, var(--mc-dim, rgba(255,107,0,.12)), var(--surface, #fff)) !important;
  border-color: var(--mc-brd, var(--orange-brd)) !important;
  color: var(--text1) !important;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-ico {
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: var(--ui-radius-md,10px) !important;
  background: var(--mc-dim, rgba(255,107,0,.12)) !important;
  font-size: 22px !important;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-label,
.mprof-tabs.mprof-tabs--icons .mprof-tab.active .mprof-tab-label {
  display: block !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
  color: var(--text1) !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-desc {
  display: block;
  font-size: 12px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--text3);
}
.mprof-tabs.mprof-tabs--icons .mprof-tab-count,
.mprof-tabs.mprof-tabs--icons .mprof-tab.active .mprof-tab-count {
  display: inline-flex !important;
  position: absolute;
  top: 10px;
  right: 10px;
}
.mprof-pane,
.mprof-pane.active {
  display: none !important;
}
body.mprof-modal-open {
  overflow: hidden;
}
.mprof-pane-modal {
  position: fixed;
  inset: 0;
  z-index: 10080;
  display: none;
  align-items: center;
  justify-content: center;
  padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
}
.mprof-pane-modal.open {
  display: flex;
}
.mprof-pane-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .52);
  backdrop-filter: blur(8px);
}
.mprof-pane-modal__card {
  position: relative;
  width: min(920px, 100%);
  max-height: min(86vh, 860px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ui-radius-lg,18px);
  border: 1px solid rgba(148, 163, 184, .28);
  background: var(--bg, #fff);
  box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
}
.mprof-pane-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, var(--mc-dim, rgba(255,107,0,.10)), var(--surface, #fff));
}
.mprof-pane-modal__titlewrap {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.mprof-pane-modal__ico {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-radius-md,10px);
  background: var(--mc-dim, rgba(255,107,0,.12));
  font-size: 24px;
}
.mprof-pane-modal__titlewrap h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.15;
}
.mprof-pane-modal__sub {
  margin: 4px 0 0;
  color: var(--text3);
  font-size: 12px;
  font-weight: 700;
}
.mprof-pane-modal__close {
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  background: var(--surface, #fff);
  color: var(--text1);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.mprof-pane-modal__body {
  padding: 18px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.mprof-pane-modal__body > *:first-child { margin-top: 0; }
@media (max-width: 640px) {
  .mprof-tabs.mprof-tabs--icons {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab {
    min-height: 82px !important;
    padding: 12px 10px !important;
    border-radius: var(--ui-radius-lg,18px) !important;
    gap: 9px !important;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab-ico {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    font-size: 20px !important;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab-label,
  .mprof-tabs.mprof-tabs--icons .mprof-tab.active .mprof-tab-label {
    font-size: 13px !important;
  }
  .mprof-tabs.mprof-tabs--icons .mprof-tab-desc {
    font-size: 11px;
  }
  .mprof-pane-modal {
    align-items: flex-end;
    padding: 10px;
  }
  .mprof-pane-modal__card {
    width: 100%;
    max-height: 88vh;
    border-radius: var(--ui-radius-lg,18px);
  }
  .mprof-pane-modal__head {
    padding: 14px;
  }
  .mprof-pane-modal__body {
    padding: 14px;
  }
}

/* r237 — master order workflow polish */
.mx-actions--core .mx-accept-btn{
  background:linear-gradient(135deg,#16a34a,#22c55e);
  border-color:rgba(34,197,94,.5);
  color:#fff;
  box-shadow:0 10px 22px rgba(34,197,94,.18);
}
.mx-actions--core .mx-accept-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(34,197,94,.24)}
.mx-card .mx-actions--core,
.mx-row .mx-actions--core{gap:8px;align-items:center;flex-wrap:wrap}
.mx-card .mx-actions--core .btn,
.mx-row .mx-actions--core .btn{min-height:38px;border-radius:var(--ui-radius-md,10px)}
@media (min-width:18px){
  .mx-card .mx-actions--core{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));}
  .mx-row .mx-actions--core{display:grid;grid-template-columns:repeat(4,minmax(96px,1fr));min-width:520px;}
}

/* === SOURCE: css/home_page.css === */
.home-catalog {
  padding: 40px 0 36px;
  border-top: 1px solid var(--line);
}
.home-catalog__head {
  margin-bottom: 22px;
}
.home-catalog__subhead {
  max-width: 760px;
  margin: 0 0 14px;
  color: var(--text2);
  font-size: 15px;
  line-height: 1.55;
}
.home-catalog__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 14px;
}
.hcat-card {
  appearance: none;
  width: 100%;
  min-height: 200px;  /* уменьшили с 232 */
  height: 100%;       /* одинаковая высота в grid */
  text-align: left;
  border: 1px solid color-mix(in srgb, var(--hcat) 24%, var(--line));
  background: linear-gradient(180deg, color-mix(in srgb, var(--hcat) 10%, var(--bg2)) 0%, var(--bg2) 100%);
  border-radius: var(--ui-radius-lg,18px);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
  box-shadow: 0 10px 28px rgba(0,0,0,.10);
  box-sizing: border-box;
}
.hcat-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--hcat) 46%, var(--line));
  box-shadow: 0 18px 38px rgba(0,0,0,.16);
}
.hcat-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--hcat) 70%, white);
  outline-offset: 3px;
}
.hcat-card--special {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hcat) 14%, var(--bg2)) 0%, color-mix(in srgb, var(--hcat) 4%, var(--bg2)) 100%);
}
.hcat-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.hcat-icon {
  width: 54px;
  height: 54px;
  border-radius: var(--ui-radius-lg,18px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  background: color-mix(in srgb, var(--hcat) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--hcat) 34%, var(--line));
  flex-shrink: 0;
}
.hcat-count {
  font-size: 12px;
  font-weight: 800;
  color: color-mix(in srgb, var(--hcat) 72%, white);
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--hcat) 26%, var(--line));
  background: color-mix(in srgb, var(--hcat) 10%, transparent);
  white-space: nowrap;
}
.hcat-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
  flex: 1;
}
.hcat-label {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--text1);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hcat-sub {
  color: var(--text2);
  font-size: 13px;
  line-height: 1.5;

  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hcat-price {
  font-size: 13px;
  font-weight: 800;
  color: var(--text1);
}
.hcat-badges,
.hcat-examples {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hcat-badge,
.hcat-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--hcat) 22%, var(--line));
  background: color-mix(in srgb, var(--hcat) 10%, transparent);
  color: var(--text2);
  font-size: 11px;
  font-weight: 700;
}
.hcat-arrow {
  margin-top: auto;
  font-size: 13px;
  font-weight: 800;
  color: color-mix(in srgb, var(--hcat) 76%, white);
}
.home-specials {
  margin-top: 18px;
}
.home-specials__title {
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text3);
  font-weight: 800;
  margin-bottom: 12px;
}
.home-specials__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.home-special-card {
  appearance: none;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  background: var(--bg2);
  padding: 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  text-align: left;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.home-special-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(0,0,0,.12);
}
.home-special-card--danger {
  border-color: rgba(239,68,68,.28);
  background: linear-gradient(180deg, rgba(239,68,68,.10) 0%, rgba(239,68,68,.04) 100%);
}
.home-special-card--legal {
  border-color: rgba(139,92,246,.28);
  background: linear-gradient(180deg, rgba(139,92,246,.10) 0%, rgba(139,92,246,.04) 100%);
}
.home-special-card__ico {
  width: 56px;
  height: 56px;
  border-radius: var(--ui-radius-lg,18px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}
.home-special-card__title {
  font-size: 18px;
  font-weight: 800;
  color: var(--text1);
  margin-bottom: 6px;
}
.home-special-card__sub {
  color: var(--text2);
  font-size: 13px;
  line-height: 1.5;
}
.home-special-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.home-special-card__badge {
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--text2);
}
.home-special-card__cta {
  white-space: nowrap;
  font-size: 13px;
  font-weight: 800;
  color: var(--text1);
}
.home-urgent-cta {
  width: 100%;
  margin-top: 16px;
  appearance: none;
  border: 1px solid rgba(239,68,68,.34);
  border-radius: var(--ui-radius-lg,18px);
  background: linear-gradient(135deg, rgba(239,68,68,.18) 0%, rgba(239,68,68,.08) 100%);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 18px 42px rgba(239,68,68,.14);
}
.home-urgent-cta__ico {
  width: 56px;
  height: 56px;
  border-radius: var(--ui-radius-lg,18px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.home-urgent-cta__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.home-urgent-cta__body strong {
  font-size: 20px;
  line-height: 1.15;
  color: #fff;
}
.home-urgent-cta__body em {
  font-style: normal;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255,255,255,.84);
}
.home-urgent-cta__arrow {
  font-size: 24px;
  color: #fff;
}
.home-trust {
  margin-top: 18px;
}
.home-trust__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
}
.home-trust-card {
  appearance: none;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  background: var(--bg2);
  padding: 16px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.home-trust-card--action { cursor: pointer; }
.home-trust-card__title {
  font-size: 15px;
  font-weight: 800;
  color: var(--text1);
}
.home-trust-card__text {
  font-size: 13px;
  line-height: 1.55;
  color: var(--text2);
}
.home-trust-card__list {
  display: grid;
  gap: 7px;
  color: var(--text2);
  font-size: 13px;
}
.home-trust-card__list span::before {
  content: '•';
  color: var(--orange);
  margin-right: 8px;
}
@media (max-width: 1180px) {
  .home-catalog__grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .home-trust__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .home-special-card { grid-template-columns: auto 1fr; }
  .home-special-card__cta { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .home-catalog { padding-top: 24px; }
  .home-catalog__head { display: none !important; }
  .home-catalog__grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .hcat-card {
    min-height: 0;
    padding: 14px;
    gap: 10px;
    border-radius: var(--ui-radius-lg,18px);
  }
  .hcat-icon { width: 46px; height: 46px; border-radius: var(--ui-radius-md,10px); font-size: 24px; }
  .hcat-label { font-size: 15px; }
  .hcat-sub,
  .hcat-price,
  .hcat-examples,
  .hcat-arrow,
  .hcat-badges { display: none; }
  .hcat-count { font-size: 11px; padding: 6px 8px; }
  .home-specials__grid,
  .home-trust__grid { grid-template-columns: 1fr; }
  .home-special-card {
    padding: 15px;
    border-radius: var(--ui-radius-lg,18px);
    grid-template-columns: auto 1fr;
  }
  .home-special-card__cta { grid-column: 1 / -1; }
  .home-urgent-cta {
    padding: 16px;
    border-radius: var(--ui-radius-lg,18px);
    grid-template-columns: auto 1fr;
  }
  .home-urgent-cta__arrow { display: none; }
  .home-urgent-cta__body strong { font-size: 17px; }
}
@media (min-width: 768px) and (max-width: 1180px) {
  .hcat-card {
    min-height: 212px;
    padding: 16px;
  }
  .hcat-sub { font-size: 12px; }
  .hcat-examples { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   STO DASHBOARD
═══════════════════════════════════════════════════════════════════ */

/* === SOURCE: css/sto.css === */
.sto-stat-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  gap: 10px; margin-bottom: 20px;
}
@media (max-width: 560px) { .sto-stat-grid { grid-template-columns: repeat(2,1fr); } }
.sto-stat-card {
  background: var(--bg2); border: 1px solid var(--line);
  border-radius: var(--r-lg,10px); padding: 14px 12px; text-align: center;
}
.sto-stat-ico { font-size: 22px; margin-bottom: 6px; }
.sto-stat-val {
  font-family: 'Oswald',sans-serif;
  font-size: 24px; font-weight: 700; color: var(--text1); line-height: 1;
}
.sto-stat-lbl { font-size: 11px; color: var(--text3); margin-top: 4px; }
.sto-section {
  background: var(--bg2); border: 1px solid var(--line);
  border-radius: var(--r-xl,18px); overflow: hidden; margin-bottom: 14px;
}
.sto-section-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--line);
}
.sto-section-title {
  font-family: 'Oswald',sans-serif;
  font-size: 15px; font-weight: 700; color: var(--text1);
}
.sto-master-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 18px; border-bottom: 1px solid var(--line);
}
.sto-master-row:last-child { border-bottom: none; }
.sto-master-av {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald',sans-serif; font-size: 15px; font-weight: 700;
}
.sto-master-body { flex: 1; min-width: 0; }
.sto-master-name { font-size: 14px; font-weight: 700; color: var(--text1); }
.sto-master-spec { font-size: 12px; color: var(--text3); }
.sto-master-stats { display: flex; gap: 6px; flex-wrap: wrap; }
.sto-badge {
  font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 99px;
}
.sto-badge--busy { background: rgba(251,191,36,.12); color: #f59e0b; border: 1px solid rgba(251,191,36,.25); }
.sto-badge--done { background: rgba(34,197,94,.1); color: #22c55e; border: 1px solid rgba(34,197,94,.2); }
.sto-master-open {
  font-size: 16px; padding: 6px 8px; border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line); background: var(--surface); cursor: pointer;
}
.sto-order-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 18px; border-bottom: 1px solid var(--line);
}
.sto-order-row:last-child { border-bottom: none; }
.sto-order-ico { font-size: 20px; flex-shrink: 0; }
.sto-order-body { flex: 1; min-width: 0; }
.sto-order-name { font-size: 14px; font-weight: 600; color: var(--text1); }
.sto-order-meta { font-size: 12px; color: var(--text3); }

/* ═══════════════════════════════════════════════════════════════════
   APP SETTINGS — страница настроек
═══════════════════════════════════════════════════════════════════ */

/* r148: STO dispatch business workflow */
.sto-dispatch-page{padding-bottom:calc(var(--bnav-h,0px) + 24px)}
.sto-dispatch-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.sto-dispatch-title{font-size:24px;margin:2px 0 0}
.sto-dispatch-sub{font-size:13px;color:var(--text3);margin-top:4px}
.sto-dispatch-head-actions{display:flex;gap:8px;flex-wrap:wrap}
.sto-section-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;margin-left:6px;border-radius:999px;background:rgba(255,107,0,.14);color:var(--orange);font-size:11px;font-weight:800}
.sto-dispatch-row{align-items:flex-start}
.sto-lead-chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.sto-lead-chip{display:inline-flex;align-items:center;border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:999px;padding:3px 7px;font-size:10px;color:var(--text3);font-weight:700;line-height:1.1}
.sto-order-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;min-width:190px}
.sto-row-btn{font-size:12px!important;padding:7px 10px!important;min-height:34px!important;border-radius:var(--ui-radius-md,10px)!important}
.sto-empty-line{padding:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px);text-align:center;color:var(--text3);font-size:13px;line-height:1.45}
@media (max-width:680px){
  .sto-dispatch-head{gap:10px;margin-bottom:14px}
  .sto-dispatch-head-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .sto-dispatch-head-actions .btn{width:100%;justify-content:center;min-height:42px}
  .sto-dispatch-title{font-size:21px}
  .sto-order-row.sto-dispatch-row{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:12px 14px}
  .sto-order-actions{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;min-width:0;width:100%}
  .sto-row-btn{width:100%;padding:8px 6px!important;font-size:11px!important}
  .sto-section-head{padding:12px 14px}
  .sto-section-title{font-size:14px}
}

/* STO-ASSIGN-r2: assignment modal hints */
.pf-hint{
  margin:0 0 12px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(255,255,255,.04);
  color:var(--text2);
  font-size:12px;
  line-height:1.45;
}
.pf-hint b{color:var(--text1)}

/* STO-ASSIGN-r3 — assignment history in order detail */
.odet-assignment-history .odet-assign-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
  margin:8px 0 10px;
  font-size:12px;
  color:var(--text3);
}
.odet-assign-state{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:99px;
  font-size:12px;
  font-weight:700;
}
.odet-assign-state--active{
  color:#22c55e;
  background:rgba(34,197,94,.10);
  border:1px solid rgba(34,197,94,.25);
}
.odet-assign-state--empty{
  color:#f59e0b;
  background:rgba(245,158,11,.10);
  border:1px solid rgba(245,158,11,.25);
}
.odet-assign-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.odet-assign-item{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
}
.odet-assign-dot{
  width:30px;
  height:30px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(148,163,184,.12);
  border:1px solid rgba(148,163,184,.22);
  font-size:13px;
}
.odet-assign-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
  font-size:13px;
  color:var(--text);
}
.odet-assign-top span{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--text3);
}
.odet-assign-meta{
  margin-top:3px;
  font-size:11px;
  color:var(--text3);
}
.odet-assign-comment{
  margin-top:7px;
  padding:7px 9px;
  border-left:2px solid rgba(245,158,11,.35);
  border-radius:var(--ui-radius-sm,5px);
  background:var(--bg2);
  font-size:12px;
  color:var(--text2);
  line-height:1.5;
}
.odet-assign-empty{
  padding:12px;
  border:1px dashed var(--line);
  border-radius:var(--ui-radius-md,10px);
  color:var(--text3);
  font-size:12px;
  text-align:center;
}
.odet-assign-item--active .odet-assign-dot{
  color:#22c55e;
  background:rgba(34,197,94,.10);
  border-color:rgba(34,197,94,.25);
}
.odet-assign-item--superseded .odet-assign-dot{
  color:#60a5fa;
  background:rgba(96,165,250,.10);
  border-color:rgba(96,165,250,.25);
}
.odet-assign-item--removed .odet-assign-dot{
  color:#ef4444;
  background:rgba(239,68,68,.10);
  border-color:rgba(239,68,68,.25);
}
@media (max-width: 640px){
  .odet-assign-item{grid-template-columns:28px 1fr;padding:9px 10px;gap:8px}
  .odet-assign-dot{width:26px;height:26px;font-size:12px}
  .odet-assignment-history .odet-assign-summary{align-items:flex-start;flex-direction:column}
}

/* STO-DISPATCH-r1 — dispatcher sync/health strip */
.sto-dispatch-sync{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:-6px 0 14px;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(255,255,255,.035);
  color:var(--text3);
  font-size:11px;
  font-weight:700;
  line-height:1.25;
}
.sto-dispatch-sync span{
  display:inline-flex;
  align-items:center;
  min-height:18px;
}
.sto-dispatch-sync--loading{color:#f59e0b;background:rgba(245,158,11,.08);border-color:rgba(245,158,11,.22)}
.sto-dispatch-sync--error{color:#ef4444;background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.24)}
.sto-dispatch-sync-error{font-weight:800;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:680px){
  .sto-dispatch-sync{margin:-2px 0 12px;padding:9px 10px;font-size:10.5px;gap:6px}
  .sto-dispatch-sync span{max-width:100%}
}

/* === SOURCE: css/settings.css === */
.app-settings-page { padding: 0 0 32px; }
.settings-section { margin-bottom: 6px; }
.settings-section-title {
  font-size: 11px; font-weight: 800; color: var(--text3);
  letter-spacing: .08em; text-transform: uppercase;
  padding: 18px 20px 8px;
}
.settings-list {
  background: var(--bg2);
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.settings-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 20px; border-bottom: 1px solid var(--line);
  min-height: 56px;
}
.settings-row:last-child { border-bottom: none; }
.settings-row-ico { font-size: 22px; width: 28px; text-align: center; flex-shrink: 0; }
.settings-row-body { flex: 1; min-width: 0; }
.settings-row-label { font-size: 15px; font-weight: 600; color: var(--text1); margin-bottom: 2px; }
.settings-row-sub { font-size: 12px; color: var(--text3); }
.settings-row-control { flex-shrink: 0; }
.font-preview {
  font-size: 15px; color: var(--text2); padding: 12px 20px;
  background: var(--surface); border-radius: var(--ui-radius-md,10px);
  margin: 0 20px; line-height: 1.6;
  border: 1px solid var(--line);
}

/* Segment control */
.seg-ctrl {
  display: inline-flex; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px);
  overflow: hidden; padding: 2px; gap: 2px;
}
.seg-btn {
  padding: 6px 12px; font-size: 12px; font-weight: 700;
  border-radius: var(--ui-radius-md,10px); color: var(--text2); cursor: pointer;
  transition: background .15s, color .15s;
  white-space: nowrap; border: none; background: none; font-family: inherit;
}
.seg-btn.active { background: var(--orange); color: #fff; }
.seg-btn:not(.active):hover { background: var(--line); color: var(--text1); }

/* Accent dots */
.accent-grid { display: flex; gap: 10px; flex-wrap: wrap; padding: 12px 20px; }
.accent-dot {
  width: 34px; height: 34px; border-radius: 50%;
  cursor: pointer; position: relative;
  transition: transform .15s; border: 2px solid transparent;
}
.accent-dot:hover { transform: scale(1.1); }
.accent-dot.active { border-color: var(--text1); transform: scale(1.06); }
.accent-dot.active::after {
  content: '✓'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 900; color: #fff;
}

/* ═══════════════════════════════════════════
   Special service panel
═══════════════════════════════════════════ */
.spec-svc-overlay {
  position: fixed;
  inset: 0;
  z-index: 960;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(7,17,27,.82);
  backdrop-filter: blur(10px);
  opacity: 0;
  transition: opacity .25s ease;
}
.spec-svc-panel {
  --ssc: var(--orange);
  width: min(100%, 980px);
  max-height: min(88dvh, 920px);
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 22px;
  overflow: auto;
  border-radius: var(--ui-radius-lg,18px);
  border: 1px solid color-mix(in srgb, var(--ssc) 24%, rgba(255,255,255,.10));
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--ssc) 16%, transparent) 0%, transparent 34%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg2) 96%, white 4%), var(--bg2));
  box-shadow: 0 34px 80px rgba(0,0,0,.42);
  transform: translateY(24px);
  transition: transform .25s ease;
}
.spec-svc-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.spec-svc-headcopy {
  flex: 1;
  min-width: 0;
}
.spec-svc-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 11px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ssc) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--ssc) 26%, transparent);
  color: var(--ssc);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.spec-svc-title {
  margin-top: 10px;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1.05;
  color: var(--text1);
}
.spec-svc-desc {
  margin-top: 8px;
  max-width: 760px;
  font-size: 14px;
  line-height: 1.62;
  color: var(--text2);
}
.spec-svc-close {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  background: rgba(255,255,255,.04);
  color: var(--text1);
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.spec-svc-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.spec-svc-item {
  appearance: none;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  background: rgba(255,255,255,.02);
  padding: 16px;
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 12px;
  align-items: start;
  text-align: left;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.spec-svc-ico {
  width: 48px;
  height: 48px;
  border-radius: var(--ui-radius-md,10px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  background: color-mix(in srgb, var(--ssc) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--ssc) 18%, transparent);
}
.spec-svc-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.spec-svc-label {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--text1);
}
.spec-svc-sub {
  font-size: 13px;
  line-height: 1.55;
  color: var(--text2);
}
.spec-svc-price {
  grid-column: 1 / -1;
  justify-self: flex-start;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--line);
  color: var(--text1);
  font-size: 12px;
  font-weight: 800;
}
@media (hover: hover) {
  .spec-svc-item:hover,
  .spec-svc-close:hover {
    border-color: color-mix(in srgb, var(--ssc) 32%, var(--line));
    background: color-mix(in srgb, var(--ssc) 8%, rgba(255,255,255,.02));
  }
  .spec-svc-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 32px rgba(0,0,0,.14);
  }
}

@media (max-width: 900px) {
  .spec-svc-overlay { padding: 12px; }
  .spec-svc-items { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .spec-svc-overlay {
    padding: 12px;
    align-items: center;
  }
  .spec-svc-panel {
    width: 100%;
    max-height: min(92dvh, 860px);
    padding: 18px 16px 16px;
    gap: 14px;
    border-radius: var(--ui-radius-lg,18px);
  }
  .spec-svc-head { gap: 12px; }
  .spec-svc-kicker { min-height: 26px; padding: 0 10px; font-size: 10px; }
  .spec-svc-title { margin-top: 8px; font-size: 26px; }
  .spec-svc-desc { font-size: 13px; line-height: 1.55; }
  .spec-svc-close {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: var(--ui-radius-md,10px);
  }
  .spec-svc-item {
    padding: 14px;
    border-radius: var(--ui-radius-lg,18px);
    gap: 10px;
  }
  .spec-svc-ico {
    width: 42px;
    height: 42px;
    border-radius: var(--ui-radius-md,10px);
    font-size: 22px;
  }
  .spec-svc-label { font-size: 14px; }
  .spec-svc-sub { font-size: 12px; }
  .spec-svc-price { font-size: 11px; min-height: 28px; }
}


/* v20260423r33 master exchange */
.mx-exchange-shell{display:block;min-width:0;max-width:100%;overflow-x:hidden}
.mx-work-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.mx-title{font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;color:var(--text)}
.mx-subtitle{font-size:13px;color:var(--text3);margin-top:4px}
.mx-counter-grid{display:grid;grid-template-columns:repeat(5,minmax(90px,1fr));gap:10px;flex:1;min-width:320px}
.mx-counter{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px 10px;display:flex;flex-direction:column;gap:4px;min-height:74px}
.mx-counter b{font-family:'Oswald',sans-serif;font-size:20px;color:var(--text)}
.mx-counter span{font-size:11px;color:var(--text3)}
.mx-layout{display:grid;grid-template-columns:minmax(250px,300px) minmax(0,1fr) minmax(220px,280px);gap:16px;align-items:start;min-width:0;max-width:100%}
.mx-sidebar,.mx-center-col{min-width:0}
.mx-panel-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:10px}
.mx-sidebar--filters,.mx-sidebar--service{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);padding:14px}
.mx-filter-grid{display:grid;grid-template-columns:1fr;gap:10px}
.mx-filter-grid label,.mx-respond-grid label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--text2)}
.mx-filter-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mx-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.mx-tabs button{border:1px solid var(--line);background:var(--surface);color:var(--text2);border-radius:999px;padding:10px 14px;font-size:12px;font-weight:600}
.mx-tabs button.is-active{background:var(--orange);color:#fff;border-color:var(--orange)}
.mx-stream-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--text3);font-size:12px;margin-bottom:12px}
.mx-card-list{display:grid;grid-template-columns:1fr;gap:12px;min-width:0;width:100%;overflow:hidden}
.mx-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0;overflow:hidden;box-sizing:border-box;width:100%}
.mx-card.is-urgent{box-shadow:0 0 0 1px rgba(239,68,68,.18) inset}
.mx-card.is-suitable{border-color:rgba(255,107,0,.35)}
.mx-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
.mx-card-headings h4{margin:0;font-size:18px;line-height:1.2;color:var(--text);word-break:break-word;overflow-wrap:break-word}
.mx-card-sub{font-size:12px;color:var(--text3);margin-top:4px}
.mx-card-budget{font-family:'Oswald',sans-serif;font-size:20px;font-weight:700;color:var(--orange);white-space:nowrap;max-width:160px;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
.mx-chip-row{display:flex;gap:6px;flex-wrap:wrap}
.mx-chip{font-size:10px;font-weight:700;padding:4px 8px;border-radius:999px;background:rgba(255,107,0,.08);border:1px solid rgba(255,107,0,.2);color:var(--text2)}
.mx-chip--urgent{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.3);color:#ef4444}
.mx-card-desc{font-size:13px;line-height:1.5;color:var(--text2)}
.mx-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mx-meta-grid div{background:var(--bg);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:10px}
.mx-meta-grid span{display:block;font-size:11px;color:var(--text3);margin-bottom:5px}
.mx-meta-grid b{display:block;font-size:13px;color:var(--text)}
.mx-actions{display:flex;gap:8px;flex-wrap:wrap}
.mx-actions .btn{padding:9px 12px;font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis}
.mx-my-response{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--text2);padding:10px 12px;background:rgba(96,165,250,.08);border:1px solid rgba(96,165,250,.18);border-radius:var(--ui-radius-md,10px)}
.mx-my-response .mx-status{margin-left:auto;font-weight:700;color:#60a5fa}
.mx-side-stack{display:grid;gap:10px}
.mx-side-card,.mx-side-list{background:var(--bg);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px}
.mx-side-card{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mx-side-card span{font-size:12px;color:var(--text3)}
.mx-side-card b{font-family:'Oswald',sans-serif;font-size:18px;color:var(--text)}
.mx-mini-response{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;border:none;background:transparent;padding:8px 0;border-top:1px solid var(--line);text-align:left}
.mx-mini-response:first-of-type{border-top:none;padding-top:0}
.mx-mini-response b{font-size:12px;color:var(--text)}
.mx-mini-response span{font-size:11px;color:var(--text3)}
.mx-empty-mini{font-size:12px;color:var(--text3)}
.mx-mobile-bar{display:none;position:sticky;bottom:10px;z-index:5;margin-top:14px;padding:8px;background:rgba(15,23,42,.92);border:1px solid rgba(255,255,255,.08);border-radius:var(--ui-radius-md,10px);backdrop-filter:blur(10px)}
.mx-mobile-bar button{flex:1;border:none;background:transparent;color:#fff;font-size:12px;font-weight:700;padding:10px}
.mx-detail-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:16px}
.mx-detail-block{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:14px}
.mx-photo-row{display:flex;gap:10px;flex-wrap:wrap}
.mx-photo{width:84px;height:84px;border-radius:var(--ui-radius-md,10px);overflow:hidden;border:1px solid var(--line);padding:0;background:var(--bg)}
.mx-photo img{width:100%;height:100%;object-fit:cover}
.mx-history-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.mx-history-item:first-child{border-top:none;padding-top:0}
.mx-history-item b{font-size:12px;color:var(--text)}
.mx-history-item span{font-size:11px;color:var(--text3)}
.mx-respond-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mx-span-2{grid-column:1 / -1}
@media (max-width: 1180px){
  .mx-layout{grid-template-columns:minmax(240px,280px) minmax(0,1fr)}
  .mx-sidebar--service{grid-column:1 / -1;position:static}
  .mx-side-stack{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mx-side-list{grid-column:1 / -1}
}
@media (max-width: 900px){
  .mx-counter-grid{grid-template-columns:repeat(2,minmax(120px,1fr));min-width:0;width:100%}
  .mx-layout{grid-template-columns:1fr}
  .mx-sidebar--filters{display:none}
  .mx-sidebar--service{position:static}
  .mx-mobile-bar{display:flex;gap:8px}
  .mx-meta-grid,.mx-detail-grid,.mx-respond-grid,.mx-side-stack{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .mx-title{font-size:22px}
  .mx-counter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mx-card{padding:14px}
  .mx-card-top{flex-direction:column}
  .mx-card-budget{font-size:18px}
  .mx-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mx-actions .btn{flex:1;min-width:calc(50% - 4px)}
}


.mx-tabs button{display:inline-flex;align-items:center;gap:8px}
.mx-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:rgba(255,255,255,.14);font-size:10px;font-weight:700}
.mx-tabs button.is-active .mx-tab-count{background:rgba(255,255,255,.22)}
.mx-card-scenario{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;color:var(--text2);margin-bottom:8px}
.mx-card-scenario-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:999px;background:rgba(255,107,0,.10);border:1px solid rgba(255,107,0,.18)}
.mx-card--tow .mx-card-scenario-icon{background:rgba(96,165,250,.12);border-color:rgba(96,165,250,.2)}
.mx-card--legal .mx-card-scenario-icon{background:rgba(168,85,247,.12);border-color:rgba(168,85,247,.2)}
.mx-card--battery .mx-card-scenario-icon{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.2)}
.mx-card--tires .mx-card-scenario-icon{background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.2)}
.mx-empty-state{background:var(--surface);border:1px dashed var(--line);border-radius:var(--ui-radius-lg,18px);padding:28px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;color:var(--text3)}
.mx-empty-state b{font-size:16px;color:var(--text)}
.mx-empty-icon{font-size:32px}
@media (max-width: 767px){
  .mx-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .mx-tabs button{justify-content:space-between;width:100%}
  .mx-actions .btn{min-width:100%;flex:1 1 100%}
  .mx-mobile-bar{left:0;right:0;bottom:8px}
}

/* ═══════════════════════════════════════════════════════════════════
   HOME — улучшения главной страницы
═══════════════════════════════════════════════════════════════════ */

/* Сетка категорий */
.home-catalog__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
@media (min-width: 640px) { .home-catalog__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .home-catalog__grid { grid-template-columns: repeat(4, 1fr); } }

/* Карточка категории */
.hcat-card {
  display: flex; flex-direction: column;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--r-xl,18px);
  padding: 16px 14px;
  cursor: pointer; text-align: left;
  font-family: inherit;
  position: relative; overflow: hidden;
  transition: border-color .18s, transform .15s, box-shadow .18s;
}
.hcat-card:hover {
  border-color: color-mix(in srgb, var(--hcat,var(--orange)) 40%, transparent);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,.25);
}
.hcat-card__top {
  display: flex; align-items: flex-start;
  justify-content: space-between; margin-bottom: 10px;
}
.hcat-icon { font-size: 28px; line-height: 1; }
.hcat-count {
  font-size: 10px; font-weight: 700;
  color: var(--hcat,var(--orange));
  background: color-mix(in srgb, var(--hcat,var(--orange)) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--hcat,var(--orange)) 25%, transparent);
  padding: 2px 8px; border-radius: 99px;
}
.hcat-label {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 700; color: var(--text1);
  margin-bottom: 4px; line-height: 1.2;
}
.hcat-sub {
  font-size: 11px; color: var(--text3); line-height: 1.5;
  margin-bottom: 8px;
}
.hcat-price {
  font-size: 11px; font-weight: 700;
  color: var(--hcat,var(--orange));
  margin-bottom: 8px;
}
.hcat-examples {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-bottom: 10px;
}
.hcat-chip {
  font-size: 10px; padding: 2px 7px;
  border-radius: 99px;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--line);
  color: var(--text3);
}
.hcat-badges { display: flex; gap: 4px; margin-bottom: 8px; }
.hcat-badge {
  font-size: 9px; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase; padding: 2px 7px;
  border-radius: 99px;
  background: var(--hcat,var(--orange));
  color: #fff;
}
.hcat-arrow {
  font-size: 11px; font-weight: 700;
  color: var(--hcat,var(--orange));
  margin-top: auto;
}

/* Спец-карточки (эвакуатор, юрист) */
.home-specials { margin-top: 20px; }
.home-specials__title {
  font-size: 11px; font-weight: 800; color: var(--text3);
  text-transform: uppercase; letter-spacing: .06em;
  margin-bottom: 10px;
}
.home-specials__grid { display: flex; flex-direction: column; gap: 10px; }
.home-special-card {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
  border-radius: var(--r-lg,18px);
  border: 1.5px solid var(--line);
  background: var(--bg2);
  cursor: pointer; text-align: left; font-family: inherit;
  transition: border-color .15s, transform .12s;
}
.home-special-card--danger { border-color: rgba(239,68,68,.25); background: rgba(239,68,68,.05); }
.home-special-card--legal  { border-color: rgba(139,92,246,.25); background: rgba(139,92,246,.05); }
.home-special-card:hover { transform: translateY(-2px); }
.home-special-card__ico { font-size: 30px; flex-shrink: 0; }
.home-special-card__body { flex: 1; }
.home-special-card__title { font-size: 14px; font-weight: 700; color: var(--text1); margin-bottom: 2px; }
.home-special-card__sub { font-size: 12px; color: var(--text2); line-height: 1.5; }
.home-special-card__badges { display: flex; gap: 5px; margin-top: 5px; }
.home-special-card__badge {
  font-size: 9px; font-weight: 700;
  background: rgba(239,68,68,.15); color: #ef4444;
  border: 1px solid rgba(239,68,68,.25);
  padding: 2px 7px; border-radius: 99px;
  text-transform: uppercase; letter-spacing: .04em;
}
.home-special-card__cta {
  font-size: 12px; font-weight: 700; color: var(--orange);
  white-space: nowrap; flex-shrink: 0;
}

/* Срочная CTA полоска */
.home-urgent-cta {
  display: flex; align-items: center; gap: 12px;
  width: 100%; margin-top: 14px;
  padding: 14px 16px;
  border-radius: var(--r-lg,18px);
  border: 1.5px solid rgba(239,68,68,.3);
  background: rgba(239,68,68,.06);
  cursor: pointer; text-align: left; font-family: inherit;
  transition: background .15s;
}
.home-urgent-cta:hover { background: rgba(239,68,68,.1); }
.home-urgent-cta__ico { font-size: 24px; flex-shrink: 0; }
.home-urgent-cta__body { flex: 1; }
.home-urgent-cta__body strong { display: block; font-size: 14px; color: var(--text1); }
.home-urgent-cta__body em { display: block; font-size: 11px; color: var(--text2); font-style: normal; margin-top: 2px; }
.home-urgent-cta__arrow { font-size: 18px; color: #ef4444; }

.home-catalog__subhead {
  font-size: 13px; color: var(--text2); margin-bottom: 16px; line-height: 1.6;
}

/* ═══════════════════════════════════════════════════════════════════
   МОБИЛЬНЫЕ — bottom nav скругления и улучшения
═══════════════════════════════════════════════════════════════════ */
.bnav-item {
  transition: color .15s, background .15s;
  border-radius: var(--ui-radius-md,10px);
}
.bnav-item.active { background: rgba(255,107,0,.1); }
.bnav-item .bnav-lbl { transition: color .15s; }
.bnav-item.active .bnav-icon-wrap { color: var(--orange); }
.bnav-item.active .bnav-lbl { color: var(--orange); }

/* ═══════════════════════════════════════════════════════════════════
   LIGHT THEME — onb2 и карточки
═══════════════════════════════════════════════════════════════════ */
[data-theme="light"] .hcat-card,
[data-theme="light"] .home-special-card { background: #fff; }
[data-theme="light"] .home-urgent-cta { background: rgba(239,68,68,.04); }

/* ═══════════════════════════════════════════════════════════════════
   DRAWER — настройки кнопка
═══════════════════════════════════════════════════════════════════ */
.drawer-link--settings {
  color: var(--orange);
  font-weight: 600;
}

/* ═══════════════════════════════════════════════════════════════════
   DRAWER — пользовательская карточка в шапке
═══════════════════════════════════════════════════════════════════ */

/* v20260423r66 special service request form */
.spec-svc-item.active{
  border-color: color-mix(in srgb, var(--ssc) 52%, var(--line));
  background: color-mix(in srgb, var(--ssc) 12%, rgba(255,255,255,.03));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ssc) 20%, transparent) inset;
}
.spec-svc-request{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:16px;
  border:1px solid color-mix(in srgb, var(--ssc) 26%, var(--line));
  border-radius:var(--ui-radius-lg,18px);
  background: color-mix(in srgb, var(--ssc) 8%, rgba(255,255,255,.025));
}
.spec-svc-request-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.spec-svc-request-title{
  font-size:18px;
  font-weight:900;
  line-height:1.2;
  color:var(--text1);
}
.spec-svc-request-sub{
  margin-top:4px;
  font-size:14px;
  line-height:1.45;
  color:var(--text2);
}
.spec-svc-request-sub b{color:var(--ssc)}
.spec-svc-request-badge{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 11px;
  border-radius:999px;
  background:color-mix(in srgb, var(--ssc) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--ssc) 24%, transparent);
  color:var(--ssc);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.spec-svc-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.spec-svc-field{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:7px;
  font-size:14px;
  font-weight:800;
  color:var(--text2);
}
.spec-svc-field b{color:#ef4444}
.spec-svc-field input,
.spec-svc-field textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg);
  color:var(--text1);
  padding:12px 13px;
  font-size:16px;
  line-height:1.35;
  outline:none;
}
.spec-svc-field textarea{resize:vertical;min-height:92px}
.spec-svc-field input:focus,
.spec-svc-field textarea:focus{
  border-color:color-mix(in srgb, var(--ssc) 60%, var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb, var(--ssc) 16%, transparent);
}
.spec-svc-field--wide{grid-column:1/-1}
.spec-svc-submit-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.spec-svc-submit-row .btn{min-height:46px;justify-content:center}
.spec-svc-submit{flex:0 0 auto}
.spec-svc-hint{
  font-size:13px;
  line-height:1.55;
  color:var(--text3);
}
@media (max-width:767px){
  .spec-svc-form-grid{grid-template-columns:1fr;gap:10px}
  .spec-svc-request{padding:14px;border-radius:var(--ui-radius-lg,18px)}
  .spec-svc-request-title{font-size:10px}
  .spec-svc-request-sub{font-size:10px}
  .spec-svc-field{font-size:10px}
  .spec-svc-field input,
  .spec-svc-field textarea{font-size:10px;padding:12px}
  .spec-svc-submit-row{flex-direction:column}
  .spec-svc-submit-row .btn{width:100%}
}


/* r74: форма предложения заказа конкретному мастеру */
.master-order-proposal-overlay.open{display:flex;align-items:center;justify-content:center;padding:18px;}
.master-order-proposal{width:min(720px,100%);max-height:92vh;overflow:hidden;border-radius:var(--ui-radius-lg,18px);}
.master-order-proposal .cmodal-body{max-height:calc(92vh - 72px);overflow:auto;}
.master-order-proposal-master{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:14px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:linear-gradient(135deg,rgba(255,107,0,.08),var(--surface));}
.master-order-proposal-avatar{width:48px;height:48px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:var(--orange);color:#fff;font-family:'Oswald',sans-serif;font-weight:800;font-size:18px;flex-shrink:0;}
.master-order-proposal-name{font-weight:800;font-size:16px;color:var(--text);}
.master-order-proposal-spec{font-size:13px;color:var(--text2);margin-top:3px;line-height:1.4;}
.master-order-proposal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.master-order-proposal-hint{margin-top:12px;padding:12px 14px;border-radius:var(--ui-radius-md,10px);background:rgba(96,165,250,.08);border:1px solid rgba(96,165,250,.18);color:var(--text2);font-size:13px;line-height:1.55;}
.master-order-proposal-actions{margin-top:14px;}
@media (max-width:640px){
  .master-order-proposal-overlay.open{align-items:flex-end;padding:10px;}
  .master-order-proposal{border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) var(--ui-radius-lg,18px);max-height:94vh;}
  .master-order-proposal-grid{grid-template-columns:1fr;gap:10px;}
  .master-order-proposal-name{font-size:17px;}
  .master-order-proposal-spec,.master-order-proposal-hint{font-size:14px;}
  .master-order-proposal-actions{display:grid;grid-template-columns:1fr;}
}

/* r75: special service 3-level flow */
.spec-svc-panel{
  overflow:hidden;
}
.spec-svc-items{
  min-height:0;
  max-height:min(44dvh, 430px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-right:4px;
  scrollbar-width:thin;
}
.spec-svc-items::-webkit-scrollbar{width:6px}
.spec-svc-items::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--ssc) 34%,rgba(255,255,255,.18))}
.spec-svc-request-overlay,
.spec-svc-result-overlay{
  position:fixed;
  inset:0;
  z-index:982;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:18px;
  background:rgba(7,17,27,.54);
  backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity .24s ease;
}
.spec-svc-result-overlay{z-index:984;background:rgba(7,17,27,.70)}
.spec-svc-request-modal,
.spec-svc-result-modal{
  width:min(760px,100%);
  max-height:min(88dvh,860px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px;
  border:1px solid color-mix(in srgb,var(--ssc) 28%,var(--line));
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg2) 96%,white 4%),var(--bg2));
  box-shadow:0 34px 84px rgba(0,0,0,.46);
  transform:translateY(24px);
  transition:transform .24s ease;
}
.spec-svc-request-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.spec-svc-request-modal-title{
  margin-top:8px;
  font-family:'Oswald',sans-serif;
  font-size:28px;
  line-height:1.08;
  color:var(--text1);
}
.spec-svc-request-modal .spec-svc-request{
  overflow:auto;
  max-height:calc(88dvh - 110px);
  background:color-mix(in srgb,var(--ssc) 6%,rgba(255,255,255,.02));
}
.spec-svc-result-modal{
  position:relative;
  align-items:center;
  text-align:center;
  width:min(420px,100%);
  padding:28px 20px 20px;
}
.spec-svc-result-close{position:absolute;top:14px;right:14px}
.spec-svc-result-icon{
  width:68px;
  height:68px;
  border-radius:var(--ui-radius-lg,18px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  background:color-mix(in srgb,var(--ssc) 16%,transparent);
  border:1px solid color-mix(in srgb,var(--ssc) 24%,transparent);
}
.spec-svc-result-title{font-size:20px;font-weight:900;color:var(--text1);margin-top:2px}
.spec-svc-result-number{
  width:100%;
  padding:14px 16px;
  border-radius:var(--ui-radius-lg,18px);
  background:color-mix(in srgb,var(--ssc) 12%,rgba(255,255,255,.03));
  border:1px solid color-mix(in srgb,var(--ssc) 26%,var(--line));
  color:var(--text1);
  font-family:'Oswald',sans-serif;
  font-size:30px;
  font-weight:800;
  letter-spacing:.02em;
}
.spec-svc-result-sub{font-size:14px;line-height:1.45;color:var(--text2)}
.spec-svc-result-actions{width:100%;display:flex;gap:10px;margin-top:6px}
.spec-svc-result-actions .btn{flex:1;justify-content:center;min-height:46px}
@media (max-width:767px){
  .spec-svc-panel{max-height:92dvh;overflow:hidden}
  .spec-svc-items{max-height:50dvh;padding-right:2px}
  .spec-svc-request-overlay,.spec-svc-result-overlay{padding:0;align-items:flex-end}
  .spec-svc-request-modal{width:100%;max-height:92dvh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;padding:16px 14px 14px}
  .spec-svc-request-modal-title{font-size:24px}
  .spec-svc-request-modal .spec-svc-request{max-height:calc(92dvh - 96px);padding:14px;border-radius:var(--ui-radius-lg,18px)}
  .spec-svc-result-modal{width:100%;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;padding:28px 16px 18px}
  .spec-svc-result-actions{flex-direction:column}
  .spec-svc-result-number{font-size:28px}
}

/* r76: отдельные формы сценариев аккумулятора */
.spec-svc-mode{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:10px;
  border:1px solid color-mix(in srgb,var(--ssc) 24%,var(--line));
  border-radius:var(--ui-radius-lg,18px);
  background:color-mix(in srgb,var(--ssc) 7%,rgba(255,255,255,.025));
}
.spec-svc-mode-title{
  grid-column:1/-1;
  font-size:13px;
  font-weight:900;
  color:var(--text2);
}
.spec-svc-mode-title b{color:#ef4444}
.spec-svc-mode-option{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg);
  color:var(--text1);
  font-size:14px;
  font-weight:850;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.spec-svc-mode-option input{accent-color:var(--ssc);width:18px;height:18px;flex:0 0 auto}
.spec-svc-mode-option:has(input:checked){
  border-color:color-mix(in srgb,var(--ssc) 54%,var(--line));
  background:color-mix(in srgb,var(--ssc) 12%,rgba(255,255,255,.04));
}
@media (hover:hover){.spec-svc-mode-option:hover{transform:translateY(-1px)}}
@media (max-width:767px){
  .spec-svc-mode{grid-template-columns:1fr;gap:8px;padding:9px;border-radius:var(--ui-radius-md,10px)}
  .spec-svc-mode-title{font-size:10px}
  .spec-svc-mode-option{font-size:10px;min-height:46px;padding:11px 12px}
}

/* r77: special service form uses account card data instead of visible name/phone/car fields */
.spec-svc-account-source{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px 14px;
  border-radius:var(--ui-radius-md,10px);
  background:color-mix(in srgb, var(--ssc) 8%, var(--surface));
  border:1px solid color-mix(in srgb, var(--ssc) 18%, var(--line));
}
.spec-svc-account-title{
  font-size:14px;
  font-weight:900;
  color:var(--text1);
}
.spec-svc-account-note{
  font-size:13px;
  line-height:1.45;
  color:var(--text2);
}
.spec-svc-account-chips{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}
.spec-svc-account-chips span{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:var(--surface);
  border:1px solid var(--line);
  color:var(--text1);
  font-size:13px;
  font-weight:800;
}
.spec-svc-account-warn{
  font-size:13px;
  font-weight:800;
  color:#ef4444;
}
@media (max-width:767px){
  .spec-svc-account-title{font-size:15px}
  .spec-svc-account-note,.spec-svc-account-warn{font-size:14px}
  .spec-svc-account-chips span{font-size:14px;min-height:30px}
}

/* v20260423r95 master exchange simplified + GPDRIVE */
.mx-work-head--compact{margin-bottom:12px}
.mx-work-head--compact .mx-title{font-size:24px}
.mx-layout{grid-template-columns:minmax(230px,280px) minmax(0,1fr)}
.mx-sidebar--service{display:none!important}
.mx-sidebar--filters{top:72px;padding:12px;border-radius:var(--ui-radius-md,10px)}
.mx-filter-grid{gap:5px}
.mx-filter-grid label span{font-size:10px;color:var(--text3)}
.mx-filter-actions .btn{flex:1;padding:9px 10px;font-size:12px}
.mx-counter-grid{grid-template-columns:repeat(5,minmax(72px,1fr));gap:8px;min-width:280px}
.mx-counter{min-height:58px;padding:9px 10px;border-radius:var(--ui-radius-md,10px)}
.mx-counter b{font-size:18px}.mx-counter span{font-size:10px}
.mx-tabs{gap:5px;margin-bottom:10px}.mx-tabs button{padding:8px 11px;font-size:11px}
.mx-stream-head--tools{position:sticky;top:62px;z-index:4;background:var(--bg);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:8px 10px;margin-bottom:10px}
.mx-view-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mx-view-tools button{border:1px solid var(--line);background:var(--surface);color:var(--text2);border-radius:999px;padding:8px 11px;font-size:11px;font-weight:700;cursor:pointer}
.mx-view-tools button.is-active,.mx-gpdrive-btn{background:var(--orange)!important;color:#fff!important;border-color:var(--orange)!important}
.mx-card{border-radius:var(--ui-radius-md,10px);padding:14px;gap:10px}.mx-card-headings h4{font-size:16px}.mx-card-budget{font-size:17px}
.mx-card-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mx-meta-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mx-meta-grid div{padding:8px;border-radius:var(--ui-radius-md,10px)}.mx-meta-grid b{font-size:10px}
.mx-actions .btn{padding:5px 10px;font-size:11px}
.mx-list-view{display:grid;gap:8px}
.mx-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:11px 12px}
.mx-row.is-urgent{border-color:rgba(239,68,68,.28);box-shadow:0 0 0 1px rgba(239,68,68,.12) inset}
.mx-row-title{display:flex;align-items:center;gap:8px;color:var(--text)}.mx-row-title b{font-size:14px}.mx-row-meta{font-size:11px;color:var(--text3);margin-top:3px}
.mx-row-price{font-family:'Oswald',sans-serif;font-size:16px;color:var(--orange);white-space:nowrap}.mx-row-actions{display:flex;gap:6px}.mx-row-actions .btn{font-size:11px;padding:7px 10px}
.mx-gpdrive-shell{max-width:min(1100px,96vw)!important}.mx-gpdrive{display:grid;grid-template-rows:minmax(300px,52vh) minmax(150px,28vh);gap:12px}
.mx-gp-map{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);background:radial-gradient(circle at 25% 20%,rgba(255,107,0,.14),transparent 28%),radial-gradient(circle at 80% 70%,rgba(96,165,250,.12),transparent 32%),var(--surface)}
.mx-gp-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:44px 44px;opacity:.55}
.mx-map-pin{position:absolute;z-index:2;transform:translate(-50%,-50%);width:32px;height:32px;border-radius:999px;border:2px solid #fff;background:var(--orange);color:#fff;font-weight:800;box-shadow:0 10px 24px rgba(0,0,0,.28);cursor:pointer}
.mx-map-pin.is-hot{background:#ef4444;animation:mxPulse 1.4s infinite}.mx-gp-legend{position:absolute;left:14px;bottom:14px;z-index:3;background:rgba(15,23,42,.86);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:var(--ui-radius-md,10px);padding:10px 12px;display:flex;gap:10px;align-items:center}.mx-gp-legend span{font-size:12px;color:rgba(255,255,255,.74)}
.mx-gp-list{overflow:auto;display:grid;gap:8px;padding-right:4px}.mx-gp-row{width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:var(--ui-radius-md,10px);padding:11px 12px;display:grid;gap:3px;cursor:pointer}.mx-gp-row span,.mx-gp-row small{color:var(--text3);font-size:12px}.mx-gp-row b{font-size:13px}
@keyframes mxPulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.38),0 10px 24px rgba(0,0,0,.28)}50%{box-shadow:0 0 0 10px rgba(239,68,68,0),0 10px 24px rgba(0,0,0,.28)}}
@media (max-width:900px){.mx-layout{grid-template-columns:1fr}.mx-sidebar--filters{display:none}.mx-counter-grid{grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.mx-stream-head--tools{top:8px}.mx-view-tools{width:100%}.mx-view-tools button{flex:1}.mx-row{grid-template-columns:1fr}.mx-row-price{font-size:15px}.mx-row-actions{display:grid;grid-template-columns:repeat(3,1fr)}.mx-gpdrive{grid-template-rows:45vh 34vh}.mx-gp-map{border-radius:var(--ui-radius-md,10px)}}
@media (max-width:18px){.mx-work-head--compact .mx-title{font-size:18px}.mx-counter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mx-counter{min-height:18px}.mx-tabs{display:flex;overflow:auto;flex-wrap:nowrap;padding-bottom:4px}.mx-tabs button{white-space:nowrap}.mx-stream-head--tools{align-items:stretch}.mx-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mx-card{padding:12px}.mx-actions .btn{min-width:calc(50% - 4px);flex:1 1 calc(50% - 4px)}.mx-row-actions{grid-template-columns:1fr}.mx-gpdrive{grid-template-rows:42vh 38vh}.mx-map-pin{width:28px;height:28px;font-size:11px}.mx-gp-legend{left:10px;right:10px;bottom:10px;justify-content:space-between}}

/* v20260503r96 — unified modal cleanup */
.app-settings-modal-overlay{z-index:9700;align-items:center;padding:14px;}
.app-settings-shell{width:min(600px,96vw);max-height:88dvh;display:flex;flex-direction:column;}
.app-settings-shell .cmodal-body{overflow:auto;padding:16px var(--ui-radius-lg,18px) var(--ui-radius-lg,18px);}
.app-settings-modal-body{min-height:0;}
.app-settings-sub{font-size:13px;color:var(--text2);margin-top:3px;}
.mx-modal-overlay{z-index:9750;align-items:center;padding:12px;}
.mx-sheet .cmodal-body{max-height:72dvh;overflow:auto;}
.mx-sheet-body .mx-panel-title{display:none;}
.mx-sheet-body .mx-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.mx-sheet-body .mx-filter-actions{position:sticky;bottom:0;background:var(--surface, #fff);padding-top:10px;margin-top:10px;}
@media (max-width: 680px){
  .app-settings-modal-overlay,.mx-modal-overlay{align-items:flex-end;padding:0;}
  .app-settings-shell,.mx-modal-overlay .cmodal-card{width:100%;max-width:100%;max-height:92dvh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;}
  .mx-sheet-body .mx-filter-grid{grid-template-columns:1fr;}
}

/* v20260503r97 — cmodal viewport fit fix */
.cmodal-overlay.open {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;    /* контент сверху — overlay скроллится */
  padding: clamp(12px, 2.5vw, 32px) clamp(8px, 2vw, 20px);
  padding-bottom: max(32px, env(safe-area-inset-bottom, 0px));
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
/* flex-item — не растягивать, не сжимать */
.cmodal-overlay.open > * {
  flex: 0 0 auto;
  width: 100%;
  max-width: 620px;
}
/* cmodal-card — широкий бокс (биржа, фильтры, GPDRIVE) */
.cmodal-overlay.open .cmodal-card,
.cmodal-overlay.open > .cmodal-card {
  max-width: min(940px, calc(100vw - 24px));
  max-height: calc(100dvh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ui-radius-lg,18px);
}
.cmodal-overlay.open .cmodal-card .cmodal-head { flex: 0 0 auto; }
.cmodal-overlay.open .cmodal-card .cmodal-body {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.cmodal-overlay.open .cmodal-card .cmodal-actions,
.cmodal-overlay.open .cmodal-card .mx-filter-actions { flex: 0 0 auto; }

/* cmodal-box — стандартный бокс */
.cmodal-overlay.open .cmodal-box,
.cmodal-overlay.open > .cmodal-box {
  max-width: min(520px, calc(100vw - 24px));
  border-radius: var(--ui-radius-lg,18px);
  /* НЕТ max-height — overlay сам скроллится на десктопе */
}

/* modal-body-v2 (клиентская деталь заявки) */
.cmodal-overlay.open .modal-body-v2,
.cmodal-overlay.open > .modal-body-v2 {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  box-shadow: 0 24px 64px rgba(0,0,0,.5);
}
.modal-header-v2 {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bg2);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ── Mobile ≤ 680px: bottom sheet ── */
@media (max-width: 680px) {
  .cmodal-overlay.open {
    align-items: flex-end;     /* прибиваем к низу */
    justify-content: flex-end;
    padding: 0;
    padding-bottom: 0;
    overflow: hidden;          /* overlay не скроллится — скроллится box */
  }
  /* Все боксы = bottom sheet */
  .cmodal-overlay.open > *,
  .cmodal-overlay.open .cmodal-card,
  .cmodal-overlay.open .cmodal-box,
  .cmodal-overlay.open .modal-body-v2 {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
    max-height: calc(94dvh - env(safe-area-inset-top, 0px)) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  .modal-header-v2 { border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0; }
  /* cmodal-card на мобиле: header sticky внутри бокса */
  .cmodal-overlay.open .cmodal-card {
    overflow: hidden !important;  /* cmodal-body скроллится внутри */
  }
  .cmodal-overlay.open .cmodal-card .cmodal-body {
    max-height: none !important;
    overflow-y: auto !important;
  }
}
@media (max-width: 400px) {
  .cmodal-overlay.open > *,
  .cmodal-overlay.open .cmodal-card,
  .cmodal-overlay.open .cmodal-box,
  .cmodal-overlay.open .modal-body-v2 {
    max-height: calc(96dvh - env(safe-area-inset-top, 0px)) !important;
  }
}


/* v20260503r99 — hide heavy master exchange meta grid on mobile */
@media (max-width:680px){
  .mx-exchange-shell--no-head .mx-card > .mx-meta-grid{
    display:none !important;
  }
}

/* v20260503r100 — mobile exchange toolbar and tablet-visible filters */
.mx-mobile-tools{display:none}
.mx-filter-tabs{margin-bottom:10px}
.mx-filter-tabs label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--text2)}
@media (max-width:900px) and (min-width:681px){
  .mx-exchange-shell--no-head .mx-layout{grid-template-columns:1fr}
  .mx-exchange-shell--no-head .mx-sidebar--filters{display:block !important;position:static;top:auto;order:0}
  .mx-exchange-shell--no-head .mx-center-col{order:1}
  .mx-exchange-shell--no-head .mx-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mx-exchange-shell--no-head .mx-filter-actions{justify-content:flex-end}
  .mx-exchange-shell--no-head .mx-filter-actions .btn{flex:0 0 auto;min-width:130px}
}
@media (max-width:680px){
  .master-work-page .master-work-nav-card{display:none !important}
  .mx-exchange-shell--no-head{margin-top:0}
  .mx-exchange-shell--no-head .mx-layout{display:block}
  .mx-exchange-shell--no-head .mx-sidebar--filters{display:none !important}
  .mx-exchange-shell--no-head .mx-tabs{display:none !important}
  .mx-exchange-shell--no-head .mx-stream-head--tools{position:static;top:auto;padding:0;border:0;background:transparent;margin:8px 0 10px}
  .mx-exchange-shell--no-head .mx-stream-head--tools > div:first-child{display:none}
  .mx-exchange-shell--no-head .mx-view-tools{display:none}
  .mx-mobile-tools{display:grid;grid-template-columns:minmax(0,1fr) 42px 42px;gap:8px;align-items:center;margin:0 0 10px;position:sticky;top:8px;z-index:7;padding:8px;background:rgba(15,23,42,.92);border:1px solid rgba(255,255,255,.10);border-radius:var(--ui-radius-md,10px);box-shadow:0 12px 30px rgba(0,0,0,.18);backdrop-filter:blur(12px)}
  .mx-mobile-searchbox{display:grid;align-items:center;gap:4px;min-width:0;background:#fff;border:1px solid rgba(255,255,255,.14);border-radius:var(--ui-radius-md,10px);padding:3px 4px 3px 8px}
  .mx-mobile-search-ico{font-size:14px;opacity:.72;text-align:center}
  .mx-mobile-searchbox .pf-input{height:34px;min-height:34px;border:0 !important;background:transparent !important;padding:0 4px !important;color:#111827;font-size:14px;box-shadow:none !important}
  .mx-mobile-searchbox .pf-input::placeholder{color:#6b7280}
  .mx-icon-btn{height:42px;min-width:42px;border:1px solid rgba(255,255,255,.14);border-radius:var(--ui-radius-md,10px);background:rgba(255,255,255,.10);color:#fff;font-size:17px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;position:relative;cursor:pointer}
  .mx-mobile-searchbox .mx-icon-btn{height:32px;min-width:32px;border-radius:var(--ui-radius-md,10px);background:var(--orange);border-color:var(--orange);font-size:14px}
  .mx-filter-btn span{position:absolute;right:-4px;top:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#ef4444;color:#fff;font-size:10px;line-height:17px;text-align:center;border:1px solid rgba(255,255,255,.7)}
  .mx-mobile-bar{display:none !important}
  .mx-sheet-body .mx-panel-title{display:block;font-size:15px;margin-bottom:10px}
  .mx-sheet-body .mx-filter-tabs{display:block}
  .mx-sheet-body .mx-filter-grid{grid-template-columns:1fr}
}

/* v20260503r101 — compact master exchange actions */
.mx-actions--core,
.mx-row-actions.mx-actions--core{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  width:100%;
}
.mx-actions--core .btn,
.mx-row-actions.mx-actions--core .btn{
  min-width:0!important;
  width:100%;
  flex:0 1 auto!important;
  justify-content:center;
  padding:9px 8px;
  font-size:12px;
  white-space:nowrap;
}
@media (max-width:680px){
  .mx-actions--core,
  .mx-row-actions.mx-actions--core{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .mx-actions--core .btn,
  .mx-row-actions.mx-actions--core .btn{
    min-width:0!important;
    flex:0 1 auto!important;
    padding:8px 6px;
    font-size:11px;
  }
}

/* v20260503r103 — master work process accepted demo page */
.mx-process-shell{display:block;margin-top:0}
.mx-process-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.mx-process-summary>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:13px 14px;min-width:0}
.mx-process-summary b{display:block;font-family:'Oswald',sans-serif;font-size:22px;line-height:1;color:var(--orange)}
.mx-process-summary span{display:block;margin-top:5px;font-size:12px;color:var(--text3)}
.mx-process-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-lg,18px);padding:14px 16px;margin-bottom:12px}
.mx-process-tools strong{display:block;font-family:'Oswald',sans-serif;font-size:18px;line-height:1.15;color:var(--text)}
.mx-process-tools span{display:block;margin-top:4px;font-size:12px;color:var(--text3);line-height:1.35}
.mx-process-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}
.mx-process-card{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--orange);border-radius:var(--ui-radius-lg,18px);padding:15px 16px;min-width:0;box-shadow:0 12px 28px rgba(0,0,0,.05)}
.mx-process-card.is-urgent{border-left-color:#ef4444}
.mx-process-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.mx-process-main{min-width:0;flex:1}
.mx-process-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.mx-process-badges span{font-size:10px;font-weight:800;line-height:1;padding:5px 8px;border-radius:999px;background:rgba(255,107,0,.10);border:1px solid rgba(255,107,0,.22);color:var(--orange)}
.mx-process-badges .is-hot{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.25);color:#ef4444}
.mx-process-card h3{margin:0;font-family:'Oswald',sans-serif;font-size:18px;line-height:1.15;color:var(--text)}
.mx-process-card p{margin:5px 0 0;font-size:13px;line-height:1.45;color:var(--text2)}
.mx-process-price{text-align:right;flex:0 0 auto}
.mx-process-price b{display:block;font-family:'Oswald',sans-serif;font-size:18px;color:var(--orange);white-space:nowrap}
.mx-process-price small{display:block;margin-top:4px;font-size:10px;color:var(--text3)}
.mx-process-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0}
.mx-process-meta>div{background:var(--bg);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:9px 10px;min-width:0}
.mx-process-meta span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.03em;color:var(--text3);margin-bottom:4px}
.mx-process-meta b{display:block;font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mx-process-progress{margin-top:10px;background:var(--bg);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:10px;overflow:hidden}
.mx-process-progress>div{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px;font-size:12px;color:var(--text2)}
.mx-process-progress b{font-size:12px;color:var(--orange)}
.mx-process-progress i{display:block;height:5px;background:var(--orange);border-radius:99px;min-width:5px}
.mx-process-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.mx-process-actions .btn{min-width:0!important;width:100%;justify-content:center;padding:9px 8px;font-size:12px;white-space:nowrap}
@media (max-width:680px){
  .mx-process-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:10px}
  .mx-process-summary>div{padding:10px 8px;border-radius:var(--ui-radius-md,10px);text-align:center}
  .mx-process-summary b{font-size:18px}
  .mx-process-summary span{font-size:10px;line-height:1.15}
  .mx-process-tools{padding:12px 13px;border-radius:var(--ui-radius-md,10px);margin-bottom:10px}
  .mx-process-tools .btn{display:none}
  .mx-process-tools strong{font-size:17px}
  .mx-process-list{grid-template-columns:1fr;gap:10px}
  .mx-process-card{padding:13px 13px;border-radius:var(--ui-radius-md,10px)}
  .mx-process-top{gap:5px;margin-bottom:8px}
  .mx-process-card h3{font-size:17px}
  .mx-process-card p{font-size:12px}
  .mx-process-price b{font-size:16px}
  .mx-process-meta{grid-template-columns:1fr 1fr;gap:7px}
  .mx-process-meta>div{padding:8px 9px}
  .mx-process-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .mx-process-actions .btn{font-size:11px;padding:8px 6px}
}
@media (max-width:380px){
  .mx-process-meta{grid-template-columns:1fr}
  .mx-process-summary span{font-size:9px}
}

/* v20260503r104 — hide quick summary on mobile master queue/work */
@media (max-width:680px){
  .master-work-quick-summary{
    display:none !important;
  }
  .master-work-extra-grid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin-top:10px !important;
  }
}


/* v20260503r108 — legal pages: privacy/terms visible layout */
.legal-page-section{
  padding:34px 0 64px;
}
.legal-page-container{
  max-width:920px;
}
.legal-page-grid{
  display:grid;
  gap:14px;
}
.legal-card{
  padding:22px;
}
.legal-card-title{
  margin:0 0 10px;
  font-size:18px;
  line-height:1.25;
  font-weight:900;
  color:var(--text1);
}
.legal-card-text{
  font-size:14px;
  line-height:1.85;
  color:var(--text2);
  white-space:pre-line;
}
@media (max-width:680px){
  .legal-page-section{
    padding:22px 0 calc(var(--bnav-h, 72px) + 34px);
  }
  .legal-page-container{
    padding:0 12px;
  }
  .legal-page-grid{
    gap:10px;
  }
  .legal-card{
    padding:16px 14px;
    border-radius:var(--ui-radius-md,10px);
  }
  .legal-card-title{
    font-size:16px;
  }
  .legal-card-text{
    font-size:13px;
    line-height:1.7;
  }
}

/* ── MX-CARD кнопки на маленьких экранах ── */
@media (max-width: 480px) {
  .mx-actions--core {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  .mx-actions--core .btn {
    min-width: 0 !important;
    width: 100% !important;
    font-size: 11px !important;
    padding: 8px 4px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

@media (max-width: 360px) {
  .mx-actions--core {
    grid-template-columns: 1fr 1fr !important;
  }
  .mx-actions--core .btn:last-child {
    grid-column: 1 / -1 !important;
  }
  .mx-card-budget {
    font-size: 14px !important;
    max-width: 120px !important;
  }
}

/* ── MX-PROCESS: зелёный акцент вместо оранжевого ── */
.mx-process-card{border-left-color:#34d399 !important}
.mx-process-card h3{font-size:16px !important}
.mx-process-card p{font-size:12px !important;-webkit-line-clamp:1;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}
.mx-process-price b{color:#34d399 !important;font-size:16px !important}
@media (max-width:640px){
  .mx-process-card{padding:12px !important}
  .mx-process-meta{grid-template-columns:repeat(2,1fr) !important}
  .mx-process-summary{grid-template-columns:repeat(3,1fr) !important;padding:8px !important}
  .mx-process-summary b{font-size:17px !important}
}

/* ── MX-CARD QUEUE: акцент на срочность ── */
.mx-card.is-urgent{border-left-width:3px !important;border-left-color:#ef4444 !important}
.mx-card.is-suitable{border-left-width:3px !important;border-left-color:var(--orange) !important}
.mx-card-scenario{align-items:center;flex-wrap:wrap}

/* ── MX QUICK FILTERS: единственный рабочий контейнер — модалка фильтров ── */
.mx-mobile-tools-row {
  display: flex; gap: 8px; align-items: center;
}
.mx-mobile-tools-row .mx-mobile-searchbox { flex: 1; }
.mx-sheet-quickfilters {
  display: none; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto; padding: 2px 0 4px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.mx-sheet-quickfilters::-webkit-scrollbar { display: none; }
.mx-sheet-qbtn {
  flex: 0 0 auto;
  font-size: 11px; font-weight: 700;
  padding: 5px 10px; border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--bg3); color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: border-color .15s, background .15s, color .15s;
}
.mx-sheet-qbtn.is-active {
  border-color: var(--orange);
  background: rgba(255,107,0,.1);
  color: var(--orange);
}
.mx-sheet-qbtn:active { transform: scale(.96); }
.mx-filter-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 3px;
  border-radius: 99px; background: var(--orange);
  color: #fff; font-size: 9px; font-weight: 800;
  margin-left: 3px;
}

/* ── MOBILE TOOLS layout ── */
.mx-mobile-tools {
  display: flex !important;
  flex-direction: column;
  gap: 8px;
}

/* v20260503r117 — data source labels for exchange/process */
.mx-source-badge{display:inline-flex;align-items:center;justify-content:center;min-height:18px;padding:3px 7px;border-radius:999px;font-size:9px;font-style:normal;font-weight:900;letter-spacing:.04em;line-height:1;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:var(--text2)}
.mx-source-badge.is-demo{background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.30);color:#f59e0b}
.mx-source-badge.is-db{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28);color:#22c55e}
.mx-source-badge.is-runtime{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.28);color:#60a5fa}
.mx-detail-source{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}.mx-detail-source small{font-size:12px;color:var(--text2);line-height:1.35}
.mx-card.is-demo,.mx-row.is-demo,.mx-process-card.is-demo{border-style:dashed}
@media (max-width:680px){.mx-source-badge{font-size:8px;padding:3px 6px}.mx-detail-source small{font-size:11px}.mx-card-scenario .mx-source-badge{margin-left:2px}}

/* v20260503r128 — быстрые фильтры видимы только в теле модалки фильтров */
.cmodal-overlay.open.mx-modal-overlay .cmodal-body.mx-sheet-body > .mx-sheet-quickfilters.mx-sheet-quickfilters--sheet{display:flex;margin-bottom:10px;}

/* v20260503r121 — profile setup modal visual cleanup */
.profile-setup-overlay{
  position:fixed;inset:0;z-index:9750;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(12px,3vw,28px);
  background:radial-gradient(circle at 50% 0%, rgba(255,107,0,.16), transparent 38%), rgba(7,17,27,.84);
  -webkit-backdrop-filter:blur(14px) saturate(1.25);
  backdrop-filter:blur(14px) saturate(1.25);
  opacity:0;transition:opacity .22s ease;
}
.profile-setup-overlay.is-visible{opacity:1}
.profile-setup-panel{
  width:min(560px,100%);
  max-height:min(720px,calc(100dvh - 28px));
  display:grid;grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg, rgba(28,28,32,.98), rgba(14,14,17,.98));
  box-shadow:0 28px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateY(18px) scale(.985);
  transition:transform .24s cubic-bezier(.16,1,.3,1);
}
.profile-setup-overlay.is-visible .profile-setup-panel{transform:translateY(0) scale(1)}
.profile-setup-drag{display:none;width:42px;height:4px;border-radius:999px;background:rgba(255,255,255,.20);margin:10px auto 0}
.profile-setup-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:start;padding:20px 20px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.profile-setup-icon{width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ui-radius-md,10px);background:linear-gradient(180deg, rgba(255,107,0,.18), rgba(255,107,0,.07));border:1px solid rgba(255,107,0,.24);font-size:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.profile-setup-titlebox{min-width:0}
.profile-setup-kicker{font-size:10px;font-weight:900;color:var(--orange);text-transform:uppercase;letter-spacing:.09em;margin-bottom:5px}
.profile-setup-title{font-family:Oswald,sans-serif;font-size:22px;font-weight:800;line-height:1.08;color:var(--text1)}
.profile-setup-subtitle{max-width:420px;margin-top:7px;font-size:13px;line-height:1.45;color:var(--text2)}
.profile-setup-close{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ui-radius-md,10px);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);color:var(--text2);font-size:15px;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s}
.profile-setup-close:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);color:var(--text1)}
.profile-setup-close:active{transform:scale(.94)}
.profile-setup-body{min-height:0;overflow:auto;padding:18px 20px 20px;scrollbar-width:thin}
.profile-setup-grid{display:grid;grid-template-columns:1fr;gap:13px}
.profile-setup-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.profile-setup-label{font-size:10px;font-weight:900;color:var(--text3);text-transform:uppercase;letter-spacing:.055em}
.profile-setup-input{width:100%;min-height:48px;border-radius:var(--ui-radius-md,10px) !important;font-size:15px !important;padding:0 14px !important;background:rgba(255,255,255,.055) !important;border-color:rgba(255,255,255,.12) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.profile-setup-input:focus{border-color:rgba(255,107,0,.55) !important;box-shadow:0 0 0 4px rgba(255,107,0,.13), inset 0 1px 0 rgba(255,255,255,.06) !important;outline:none}
.profile-setup-footer{display:flex;align-items:center;gap:10px;padding:14px 20px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015))}
.profile-setup-skip{min-width:132px;min-height:46px;padding:0 16px !important;border-radius:var(--ui-radius-md,10px) !important}
.profile-setup-save{flex:1;min-height:46px;padding:0 18px !important;border-radius:var(--ui-radius-md,10px) !important;font-size:14px !important;font-weight:900 !important}
[data-theme="light"] .profile-setup-overlay{background:radial-gradient(circle at 50% 0%, rgba(255,107,0,.14), transparent 40%), rgba(244,245,247,.76)}
[data-theme="light"] .profile-setup-panel{background:#fff !important;border-color:rgba(0,0,0,.08) !important;box-shadow:0 28px 80px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.8)}
[data-theme="light"] .profile-setup-head,[data-theme="light"] .profile-setup-footer{border-color:rgba(0,0,0,.08)}
[data-theme="light"] .profile-setup-footer{background:linear-gradient(180deg, rgba(0,0,0,.015), rgba(0,0,0,.025))}
[data-theme="light"] .profile-setup-close{background:#f4f5f7;border-color:rgba(0,0,0,.08);color:#4b5563}

/* r129: client order response offers */
.mo-responses{
  margin:12px 0 0;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--ui-radius-md,10px);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  display:grid;
  gap:9px;
}
.mo-responses--empty{
  color:var(--text3);
  font-size:12px;
  padding:10px 12px;
}
.mo-responses-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--text2)}
.mo-responses-head b{color:var(--text1);font-size:13px}
.mo-responses-head span{min-width:24px;height:24px;border-radius:999px;background:rgba(255,107,0,.14);color:var(--orange);display:inline-flex;align-items:center;justify-content:center;font-weight:900}
.mo-response-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:var(--ui-radius-md,10px);background:rgba(0,0,0,.14)}
.mo-response-row.is-accepted{border-color:rgba(52,211,153,.28);background:rgba(52,211,153,.075)}
.mo-response-av{width:38px;height:38px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px}
.mo-response-main{min-width:0;display:grid;gap:4px}
.mo-response-top{display:flex;align-items:center;gap:8px;justify-content:space-between;min-width:0}
.mo-response-top b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mo-response-top span{font-size:10px;color:var(--text3);white-space:nowrap}
.mo-response-meta{font-size:11px;color:var(--text2);line-height:1.35}
.mo-response-comment{font-size:11px;color:var(--text3);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mo-response-actions{display:flex;gap:7px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.mo-response-actions .btn{min-height:34px;padding:7px 10px;font-size:11px;border-radius:var(--ui-radius-md,10px)}
@media (max-width:18px){
  .mo-responses{padding:10px;border-radius:var(--ui-radius-md,10px)}
  .mo-response-row{grid-template-columns:18px minmax(0,1fr);align-items:start}
  .mo-response-av{width:34px;height:34px;border-radius:var(--ui-radius-md,10px)}
  .mo-response-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;width:100%}
  .mo-response-actions .btn{width:100%;justify-content:center}
}


.mx-filter-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 3px;
  border-radius: 99px; background: var(--orange);
  color: #fff; font-size: 9px; font-weight: 800;
  margin-left: 3px; vertical-align: middle;
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSE STATUS — статус отклика в карточке биржи
═══════════════════════════════════════════════════════════════════ */
.mx-resp-status {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700;
  padding: 6px 12px; border-radius: 99px;
  flex: 1;
}
.mx-resp-status--pending {
  background: rgba(245,158,11,.1);
  border: 1px solid rgba(245,158,11,.25);
  color: #f59e0b;
}
.mx-resp-status--viewed {
  background: rgba(96,165,250,.1);
  border: 1px solid rgba(96,165,250,.25);
  color: #60a5fa;
}
.mx-resp-status--accepted {
  background: rgba(52,211,153,.1);
  border: 1px solid rgba(52,211,153,.3);
  color: #34d399;
}
.mx-resp-status--declined {
  background: rgba(239,68,68,.08);
  border: 1px solid rgba(239,68,68,.2);
  color: #ef4444;
  opacity: .8;
}

/* Строка статус + цена */
.mx-resp-status-row {
  display: flex; align-items: center;
  justify-content: space-between; gap: 8px;
  flex-wrap: wrap;
}
.mx-resp-my-price {
  font-size: 12px; color: var(--text2); white-space: nowrap;
}
.mx-resp-my-price b { color: #34d399; }

/* ═══════════════════════════════════════════════════════════════════
   RESPONSES LIST — вкладка "Отклики" мастера
═══════════════════════════════════════════════════════════════════ */
.mx-responses-list {
  display: grid; gap: 12px;
}
.mx-resp-card {
  border-left: 3px solid rgba(245,158,11,.5) !important;
}
.mx-resp-card.mx-resp-accepted {
  border-left-color: #34d399 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   EMPTY STATES — унифицированный стиль
═══════════════════════════════════════════════════════════════════ */
.mx-empty-state {
  display: flex; flex-direction: column;
  align-items: center; text-align: center;
  padding: 48px 24px; gap: 10px;
}
.mx-empty-icon { font-size: 40px; margin-bottom: 4px; }
.mx-empty-state b {
  font-size: 17px; font-weight: 700; color: var(--text);
  font-family: 'Oswald', sans-serif;
}
.mx-empty-state span {
  font-size: 13px; color: var(--text3);
  max-width: 300px; line-height: 1.55;
}

/* Mobile */
@media (max-width: 640px) {
  .mx-resp-status { font-size: 11px; padding: 5px 10px; }
  .mx-empty-state { padding: 36px 16px; }
  .mx-empty-state b { font-size: 15px; }
}

/* ═══════════════════════════════════════════════════════════════════
   PROCESS CARD — таймер работы, запчасти, ETA
═══════════════════════════════════════════════════════════════════ */
.mx-work-timer {
  font-size: 11px; font-weight: 700;
  color: #f59e0b;
  display: block; margin-top: 3px;
}
.mx-work-meta-row {
  display: flex; gap: 12px; flex-wrap: wrap;
  font-size: 11px; color: var(--text3);
  padding: 6px 0; border-top: 1px solid var(--line);
}
.mx-work-eta {
  display: flex; align-items: center; gap: 4px;
}
.mx-work-eta b { color: #34d399; }
.mx-work-parts {
  display: flex; align-items: center; gap: 4px;
}
.mx-work-parts b { color: var(--orange); }

/* Полоса этапа в карточке */
.mx-process-progress {
  background: rgba(52,211,153,.08);
  border: 1px solid rgba(52,211,153,.15);
  border-radius: var(--ui-radius-md,10px); padding: 8px 12px;
}
.mx-process-progress > div {
  display: flex; align-items: center;
  justify-content: space-between;
  font-size: 12px; color: var(--text2);
  margin-bottom: 6px;
}
.mx-process-progress > div b { color: #34d399; font-weight: 800; }
.mx-process-progress > i {
  display: block; height: 4px; border-radius: var(--ui-radius-sm,5px);
  background: #34d399;
  transition: width .4s ease;
}

/* Кнопки process: ETap | Chat | Card */
.mx-process-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.mx-process-actions .btn {
  min-height: 40px; font-size: 12px;
}

@media (max-width: 400px) {
  .mx-process-actions {
    grid-template-columns: 1fr 1fr;
  }
  .mx-process-actions .btn:first-child {
    grid-column: 1 / -1;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   PROCESS CARD — 4 кнопки в сетке
═══════════════════════════════════════════════════════════════════ */
.mx-process-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.mx-process-actions .btn {
  font-size: 11px !important;
  padding: 8px 6px !important;
  min-height: 40px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 480px) {
  .mx-process-actions {
    grid-template-columns: repeat(2, 1fr);
  }
  .mx-process-actions .btn:first-child {
    grid-column: 1 / -1;
    font-size: 12px !important;
    padding: 10px !important;
  }
}
@media (max-width: 360px) {
  .mx-process-actions { grid-template-columns: 1fr; }
  .mx-process-actions .btn:first-child { grid-column: unset; }
}

/* ═══════════════════════════════════════════════════════════════════
   WORK TIMER
═══════════════════════════════════════════════════════════════════ */
.mx-work-timer {
  font-size: 11px; font-weight: 700;
  color: var(--orange); white-space: nowrap;
  padding: 2px 8px;
  background: rgba(255,107,0,.1);
  border-radius: 99px;
  margin-top: 4px;
  display: inline-block;
}
.mx-work-eta {
  font-size: 12px; color: var(--text2);
  padding: 2px 0;
}
.mx-work-parts {
  font-size: 12px; color: var(--text2);
}
.mx-work-meta-row {
  display: flex; gap: 12px;
  flex-wrap: wrap; align-items: center;
  padding: 6px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin: 4px 0;
}

/* r145: repair stages and client event timeline */
.repair-stage-steps{display:grid;gap:6px;margin:8px 0 10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:color-mix(in srgb,var(--surface,#151515) 88%,transparent);font-size:12px;line-height:1.45;color:var(--text2)}
.repair-stage-steps--master label{display:flex;align-items:flex-start;gap:8px;min-width:0;cursor:pointer}
.repair-stage-steps--master input{margin-top:2px;accent-color:var(--orange)}
.repair-stage-steps--client span{display:block;min-width:0;word-break:break-word}
.repair-events-list{display:flex;flex-direction:column;gap:8px}
.repair-event-item{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface);min-width:0}
.repair-event-item b{font-size:12px;color:var(--text);min-width:0;word-break:break-word}
.repair-event-item span{font-size:11px;color:var(--text3);text-align:right;min-width:90px}
.repair-events-empty{padding:14px 16px;border:1px dashed var(--line);border-radius:var(--ui-radius-md,10px);color:var(--text3);font-size:13px;text-align:center;background:var(--surface)}
@media (max-width:680px){
  .repair-stage-steps{font-size:12px;padding:9px 10px;border-radius:var(--ui-radius-md,10px)}
  .repair-event-item{display:block;padding:10px 11px}
  .repair-event-item span{display:block;text-align:left;margin-top:4px;min-width:0}
}

/* r147: master response management */
.mx-response-status-strip{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:8px 0 4px;
}
.mx-response-status-strip span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:30px;
  padding:5px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:var(--text2);
  font-size:12px;
  font-weight:700;
}
.mx-resp-card--accepted{border-left-color:rgba(34,197,94,.75)!important;}
.mx-resp-card--declined,
.mx-resp-card--rejected{border-left-color:rgba(239,68,68,.6)!important;}
.mx-resp-card--cancelled{opacity:.72;border-left-color:rgba(148,163,184,.45)!important;}
.mx-resp-status--cancelled{background:rgba(148,163,184,.12);border-color:rgba(148,163,184,.26);color:#cbd5e1;}
.mx-resp-status--rejected,
.mx-resp-status--declined{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28);color:#fca5a5;}
.mx-danger-action{color:#ef4444!important;border-color:rgba(239,68,68,.3)!important;}
.mx-edit-note{
  margin:0 0 12px;
  padding:10px 12px;
  border:1px solid rgba(245,158,11,.25);
  border-radius:var(--ui-radius-md,10px);
  background:rgba(245,158,11,.08);
  color:#fbbf24;
  font-size:12px;
  font-weight:700;
}
@media (max-width:680px){
  .mx-response-status-strip{gap:6px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px;}
  .mx-response-status-strip span{white-space:nowrap;font-size:11px;padding:5px 9px;}
  .mx-resp-card .mx-actions--core{grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* r150: client order cards — compact responses CTA + full offers in details modal */
.mo-responses-cta{
  width:100%;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  color:var(--text1);
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  margin:10px 0 0;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  box-sizing:border-box;
  min-width:0;
}
.mo-responses-cta:hover{border-color:rgba(255,107,0,.35);background:rgba(255,107,0,.055)}
.mo-responses-cta-ico{width:38px;height:38px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.10);font-size:18px;flex-shrink:0}
.mo-responses-cta-main{min-width:0;display:flex;flex-direction:column;gap:2px}
.mo-responses-cta-main b{font-size:13px;line-height:1.2;color:var(--text1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mo-responses-cta-main em{font-style:normal;font-size:11px;line-height:1.25;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mo-responses-cta-count{min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:rgba(255,107,0,.14);color:var(--orange);font-size:12px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,107,0,.22)}
.mo-responses-cta.has-responses{border-color:rgba(255,107,0,.28);background:linear-gradient(180deg, rgba(255,107,0,.10), rgba(255,107,0,.035))}

.client-order-offers{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);padding:12px;box-sizing:border-box;min-width:0}
.client-order-offers-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font-size:12px;color:var(--text2)}
.client-order-offers-head b{font-size:12px;color:var(--text1);text-transform:uppercase;letter-spacing:.7px}
.client-order-offers-head span{min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:rgba(255,107,0,.14);color:var(--orange);font-weight:900;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,107,0,.22)}
.client-order-offers-list{display:flex;flex-direction:column;gap:10px}
.client-order-offer{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--bg);min-width:0}
.client-order-offer.is-accepted{border-color:rgba(34,197,94,.34);background:rgba(34,197,94,.055)}
.client-order-offer.is-muted{opacity:.62}
.client-order-offer-av{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);display:flex;align-items:center;justify-content:center;font-weight:900;flex-shrink:0}
.client-order-offer-main{min-width:0;display:flex;flex-direction:column;gap:4px}
.client-order-offer-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.client-order-offer-top b{font-size:14px;color:var(--text1);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.client-order-offer-top span{font-size:10px;font-weight:800;color:var(--orange);padding:3px 7px;border-radius:999px;background:rgba(255,107,0,.10);white-space:nowrap;flex-shrink:0}
.client-order-offer-meta{font-size:12px;color:var(--text3);line-height:1.35;word-break:break-word}
.client-order-offer-comment{font-size:12px;color:var(--text2);line-height:1.45;background:rgba(255,255,255,.035);border-radius:var(--ui-radius-md,10px);padding:7px 9px;word-break:break-word}
.client-order-offer-actions{display:flex;flex-direction:column;gap:6px;align-items:stretch;min-width:96px}
.client-order-offer-actions .btn{min-height:34px;padding:7px 10px;font-size:11px;justify-content:center;white-space:nowrap}
.client-order-offers-empty{display:flex;align-items:flex-start;gap:12px;padding:12px;border:1px dashed var(--line);border-radius:var(--ui-radius-md,10px);background:var(--bg)}
.client-order-offers-empty-ico{width:42px;height:42px;border-radius:var(--ui-radius-md,10px);background:rgba(255,107,0,.10);display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0}
.client-order-offers-empty b{display:block;font-size:14px;color:var(--text1);margin-bottom:3px}
.client-order-offers-empty p{margin:0;font-size:12px;line-height:1.45;color:var(--text3)}

@media (max-width:680px){
  .mo-responses-cta{grid-template-columns:34px minmax(0,1fr) auto;padding:9px 10px;border-radius:var(--ui-radius-md,10px);gap:9px}
  .mo-responses-cta-ico{width:34px;height:34px;border-radius:var(--ui-radius-md,10px);font-size:16px}
  .mo-responses-cta-main b{font-size:12px}
  .mo-responses-cta-main em{font-size:10.5px}
  .client-order-offer{grid-template-columns:38px minmax(0,1fr);gap:9px}
  .client-order-offer-av{width:38px;height:38px;border-radius:var(--ui-radius-md,10px)}
  .client-order-offer-actions{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
  .client-order-offer-actions .btn{width:100%;min-height:38px}
}

/* r202 — richer legal pages: privacy / terms */
.legal-rich-page .legal-rich-hero{
  padding-bottom:28px;
}
.legal-rich-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,360px);
  gap:18px;
  align-items:stretch;
}
.legal-rich-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.legal-rich-sub{
  max-width:760px;
}
.legal-rich-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
.legal-rich-chips span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,107,0,.18);
  background:rgba(255,107,0,.08);
  color:var(--text1);
  font-size:12px;
  font-weight:800;
}
.legal-rich-updated{
  font-size:13px;
  color:var(--text2);
  margin-top:12px;
}
.legal-rich-summary{
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:220px;
  border:1px solid rgba(255,107,0,.16);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,107,0,.055));
}
.legal-rich-summary-icon{
  width:58px;
  height:58px;
  border-radius:var(--ui-radius-lg,18px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  margin-bottom:14px;
  background:rgba(255,107,0,.12);
  box-shadow:inset 0 0 0 1px rgba(255,107,0,.16);
}
.legal-rich-summary-title{
  font-size:19px;
  line-height:1.25;
  font-weight:900;
  color:var(--text1);
  margin-bottom:8px;
}
.legal-rich-summary-text{
  font-size:13px;
  line-height:1.65;
  color:var(--text2);
}
.legal-rich-section{
  padding-top:20px;
}
.legal-rich-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}
.legal-rich-stat{
  padding:16px;
  min-height:96px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
}
.legal-rich-stat-ico{
  width:32px;
  height:32px;
  border-radius:var(--ui-radius-md,10px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(17,24,39,.06);
  font-weight:900;
}
.legal-rich-stat b{
  font-size:18px;
  color:var(--text1);
}
.legal-rich-stat small{
  font-size:12px;
  color:var(--text3);
  font-weight:700;
}
.legal-rich-info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
}
.legal-info-card{
  padding:18px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.legal-info-card-ico,
.legal-card-ico{
  width:42px;
  height:42px;
  border-radius:var(--ui-radius-md,10px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  background:rgba(255,107,0,.10);
  box-shadow:inset 0 0 0 1px rgba(255,107,0,.14);
}
.legal-info-card h2{
  margin:0 0 6px;
  font-size:16px;
  line-height:1.25;
  font-weight:900;
  color:var(--text1);
}
.legal-info-card p{
  margin:0;
  font-size:13px;
  line-height:1.65;
  color:var(--text2);
}
.legal-rich-text-grid{
  margin-top:4px;
}
.legal-card--rich{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.legal-rich-note{
  margin-top:14px;
  padding:16px 18px;
  display:flex;
  gap:12px;
  align-items:flex-start;
  font-size:13px;
  line-height:1.65;
  color:var(--text2);
  border-style:dashed;
}
.legal-rich-note span{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--ui-radius-md,10px);
  background:rgba(17,24,39,.06);
}
.legal-rich-page--privacy .legal-info-card-ico,
.legal-rich-page--privacy .legal-card-ico,
.legal-rich-page--privacy .legal-rich-summary-icon{
  background:rgba(34,197,94,.12);
  box-shadow:inset 0 0 0 1px rgba(34,197,94,.18);
}
.legal-rich-page--privacy .legal-rich-chips span{
  border-color:rgba(34,197,94,.18);
  background:rgba(34,197,94,.08);
}
.legal-rich-page--terms .legal-info-card-ico,
.legal-rich-page--terms .legal-card-ico,
.legal-rich-page--terms .legal-rich-summary-icon{
  background:rgba(59,130,246,.12);
  box-shadow:inset 0 0 0 1px rgba(59,130,246,.18);
}
.legal-rich-page--terms .legal-rich-chips span{
  border-color:rgba(59,130,246,.18);
  background:rgba(59,130,246,.08);
}
@media (max-width:780px){
  .legal-rich-hero-grid{
    grid-template-columns:1fr;
  }
  .legal-rich-summary{
    min-height:0;
  }
  .legal-rich-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }
  .legal-rich-stat{
    min-height:88px;
    padding:12px 10px;
  }
  .legal-rich-info-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:520px){
  .legal-rich-page .legal-rich-hero{
    padding-top:22px;
    padding-bottom:18px;
  }
  .legal-rich-title{
    font-size:28px;
  }
  .legal-rich-chips{
    gap:6px;
  }
  .legal-rich-chips span{
    font-size:11px;
    padding:5px 8px;
  }
  .legal-rich-summary{
    padding:16px;
    border-radius:var(--ui-radius-lg,18px);
  }
  .legal-rich-summary-icon{
    width:48px;
    height:48px;
    border-radius:var(--ui-radius-md,10px);
    font-size:24px;
  }
  .legal-rich-summary-title{
    font-size:17px;
  }
  .legal-rich-stats{
    grid-template-columns:1fr;
  }
  .legal-rich-stat{
    min-height:0;
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
  }
  .legal-rich-stat small{
    grid-column:2;
  }
  .legal-info-card,
  .legal-card--rich{
    grid-template-columns:38px minmax(0,1fr);
    padding:14px;
    gap:10px;
  }
  .legal-info-card-ico,
  .legal-card-ico{
    width:38px;
    height:38px;
    border-radius:var(--ui-radius-md,10px);
    font-size:18px;
  }
  .legal-info-card h2,
  .legal-card-title{
    font-size:15px;
  }
  .legal-info-card p,
  .legal-card-text{
    font-size:13px;
    line-height:1.6;
  }
}

/* r205 — legal cards open rich modal */
.legal-rich-stat,
.legal-info-card{
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.legal-rich-stat:hover,
.legal-info-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,107,0,.28);
  box-shadow:0 18px 44px rgba(17,24,39,.12);
}
.legal-rich-stat:focus-visible,
.legal-info-card:focus-visible{
  outline:3px solid rgba(255,107,0,.26);
  outline-offset:3px;
}
.legal-rich-stat em{
  margin-top:4px;
  font-size:11px;
  line-height:1.2;
  font-style:normal;
  font-weight:900;
  color:var(--accent);
}
.legal-info-card-more{
  display:inline-flex;
  margin-top:10px;
  font-size:12px;
  line-height:1.2;
  font-weight:900;
  color:var(--accent);
}
.legal-detail-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(15,23,42,.62);
  backdrop-filter:blur(8px);
}
.legal-detail-modal.open{display:flex;}
.legal-detail-card{
  width:min(820px,100%);
  max-height:min(86vh,760px);
  overflow:hidden;
  position:relative;
  border-radius:var(--ui-radius-lg,18px);
  background:var(--card,#fff);
  border:1px solid rgba(17,24,39,.10);
  box-shadow:0 34px 90px rgba(15,23,42,.35);
  display:flex;
  flex-direction:column;
}
.legal-detail-close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border:none;
  border-radius:var(--ui-radius-md,10px);
  background:rgba(17,24,39,.06);
  color:var(--text1);
  font-weight:900;
  cursor:pointer;
  z-index:2;
}
.legal-detail-head{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:16px;
  padding:26px 64px 20px 26px;
  border-bottom:1px solid rgba(17,24,39,.08);
  background:linear-gradient(135deg,rgba(255,107,0,.10),rgba(255,255,255,.78));
}
.legal-detail-icon{
  width:64px;
  height:64px;
  border-radius:var(--ui-radius-lg,18px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  background:rgba(255,107,0,.12);
  box-shadow:inset 0 0 0 1px rgba(255,107,0,.18);
}
.legal-detail-kicker{
  margin-bottom:6px;
  font-size:12px;
  line-height:1.2;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:950;
}
.legal-detail-head h2{
  margin:0 0 8px;
  font-size:25px;
  line-height:1.15;
  color:var(--text1);
}
.legal-detail-head p{
  margin:0;
  font-size:14px;
  line-height:1.55;
  color:var(--text2);
}
.legal-detail-body{
  overflow:auto;
  padding:22px 26px 28px;
}
.legal-detail-body p{
  margin:0 0 16px;
  font-size:15px;
  line-height:1.75;
  color:var(--text2);
}
.legal-detail-body p:last-child{margin-bottom:0;}
.legal-detail-body b{
  color:var(--accent);
  margin-right:4px;
}
@media (max-width:640px){
  .legal-detail-modal{padding:12px;align-items:center;}
  .legal-detail-card{border-radius:var(--ui-radius-lg,18px);max-height:88vh;}
  .legal-detail-head{grid-template-columns:48px minmax(0,1fr);gap:12px;padding:20px 54px 16px 18px;}
  .legal-detail-icon{width:48px;height:48px;border-radius:var(--ui-radius-md,10px);font-size:24px;}
  .legal-detail-head h2{font-size:20px;}
  .legal-detail-head p{font-size:13px;}
  .legal-detail-body{padding:18px;}
  .legal-detail-body p{font-size:14px;line-height:1.68;}
}

/* r238 — richer legal stat details button */
.legal-rich-stat{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,107,0,.12);
  background:
    radial-gradient(circle at 12% 10%, rgba(255,107,0,.10), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,247,237,.78));
  box-shadow:0 14px 34px rgba(17,24,39,.08);
}
.legal-rich-stat::after{
  content:'';
  position:absolute;
  inset:auto -26px -42px auto;
  width:96px;
  height:96px;
  border-radius:999px;
  background:rgba(255,107,0,.08);
  pointer-events:none;
}
.legal-rich-stat em{
  position:relative;
  z-index:1;
  width:max-content;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin-top:10px;
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(255,107,0,.24);
  background:linear-gradient(135deg, rgba(255,107,0,.12), rgba(255,255,255,.92));
  color:#c2410c;
  box-shadow:0 8px 18px rgba(255,107,0,.12);
  font-size:12px;
  letter-spacing:.01em;
  transition:transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}
.legal-rich-stat em::before{
  content:'↗';
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#fff;
  color:#f97316;
  box-shadow:0 4px 10px rgba(255,107,0,.14);
  font-size:11px;
  font-weight:900;
}
.legal-rich-stat:hover em,
.legal-rich-stat:focus-visible em{
  transform:translateY(-1px);
  background:linear-gradient(135deg, #ff6b00, #fb923c);
  border-color:rgba(255,107,0,.44);
  color:#fff;
}
.legal-rich-stat:hover em::before,
.legal-rich-stat:focus-visible em::before{
  color:#ff6b00;
}
@media (max-width:640px){
  .legal-rich-stat em{
    padding:7px 10px;
    font-size:11px;
  }
}

/* ── UI-r5 — drawer cab-section (cabinet tabs in drawer) ── */
.drawer-cab-section{ display: block; }
.drawer-link--cab{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 20px;
  background: none;
  border: 0;
  text-align: left;
  cursor: pointer;
  color: var(--text, #111827);
  font-size: 14px;
  transition: background .12s;
}
.drawer-link--cab:hover, .drawer-link--cab:active{
  background: var(--surface2, rgba(15,23,42,.04));
}
.drawer-link--cab .dl-icon{
  font-size: 17px;
  flex-shrink: 0;
  width: 24px;
  text-align: center;
}
.drawer-link--cab .dl-body{
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.drawer-link--cab .dl-title{
  font-weight: 600;
  font-size: 13.5px;
  line-height: 1.2;
}
.drawer-link--cab .dl-desc{
  font-size: 11px;
  color: var(--text3, #94a3b8);
  margin-top: 1px;
}

/* === SOURCE: css/ui_components.css === */
.drawer-user-card {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 18px 14px;
  cursor: pointer;
  transition: background .15s;
}
.drawer-user-card:hover { background: rgba(255,255,255,.04); }
.drawer-user-av {
  width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 17px; font-weight: 700;
  background: rgba(255,107,0,.15);
  border: 2px solid rgba(255,107,0,.3);
  color: var(--orange);
}
.drawer-user-av.r-master { background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.3); color: #34d399; }
.drawer-user-av.r-sto    { background: rgba(96,165,250,.12); border-color: rgba(96,165,250,.3); color: #60a5fa; }
.drawer-user-av.r-admin  { background: rgba(251,191,36,.12); border-color: rgba(251,191,36,.3); color: #f59e0b; }
.drawer-user-body { flex: 1; min-width: 0; }
.drawer-user-name {
  font-size: 15px; font-weight: 700; color: var(--text1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.drawer-user-role { font-size: 12px; color: var(--text3); margin-top: 2px; }

/* ── Drawer divider улучшение ── */
.drawer-divider {
  height: 1px; background: var(--line);
  margin: 4px 0;
}

/* ═══════════════════════════════════════════════════════════════════
   TOAST — улучшенный дизайн
═══════════════════════════════════════════════════════════════════ */
/* g-toast styles moved to additions.css */

/* ═══════════════════════════════════════════════════════════════════
   EMPTY STATES — единый стиль
═══════════════════════════════════════════════════════════════════ */
.empty-state {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 48px 24px; text-align: center;
  min-height: 280px;
}
.empty-icon { font-size: 48px; margin-bottom: 16px; opacity: .7; }
.empty-t {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 700; color: var(--text1);
  margin-bottom: 8px;
}
.empty-d { font-size: 14px; color: var(--text2); line-height: 1.6; max-width: 280px; }

/* ═══════════════════════════════════════════════════════════════════
   LIGHT THEME — drawer и toast
═══════════════════════════════════════════════════════════════════ */
[data-theme="light"] .drawer-user-card { background: #fff; }
[data-theme="light"] .drawer-user-card:hover { background: #f5f5f7; }
[data-theme="light"] .g-toast {
  background: #fff; border-color: rgba(0,0,0,.1);
  color: #111; box-shadow: 0 8px 32px rgba(0,0,0,.12);
}

/* ═══════════════════════════════════════════════════════════════════
   HOME — виджет активной заявки
═══════════════════════════════════════════════════════════════════ */
.home-active-order {
  display: flex; flex-direction: column; gap: 8px;
  margin: 16px 10px 16px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(255,107,0,.08), rgba(255,107,0,.03));
  border: 1.5px solid rgba(255,107,0,.3);
  border-radius: var(--r-xl, 18px);
  cursor: pointer;
  transition: border-color .15s, transform .12s;
}
.home-active-order:hover { border-color: var(--orange); transform: translateY(-2px); }
.home-active-order__head {
  display: flex; align-items: center; gap: 8px;
}
.home-active-order__ico { font-size: 18px; flex-shrink: 0; }
.home-active-order__title {
  font-size: 12px; font-weight: 800; color: var(--text3);
  text-transform: uppercase; letter-spacing: .05em; flex: 1;
}
.home-active-order__status {
  font-size: 12px; font-weight: 700; color: var(--orange);
  background: rgba(255,107,0,.1); border: 1px solid rgba(255,107,0,.2);
  padding: 2px 10px; border-radius: 99px;
}
.home-active-order__body { padding: 0 4px; }
.home-active-order__service {
  font-size: 15px; font-weight: 700; color: var(--text1);
}
.home-active-order__master {
  font-size: 12px; color: var(--text2); margin-top: 2px;
}
.home-active-order__cta {
  font-size: 12px; font-weight: 700; color: var(--orange);
  align-self: flex-end;
}

/* ═══════════════════════════════════════════════════════════════════
   UTILITY CLASSES — заменяют повторяющиеся инлайн-стили
═══════════════════════════════════════════════════════════════════ */

/* Текст */
.t-meta     { font-size: 11px; color: var(--text3); }
.t-sub      { font-size: 12px; color: var(--text3); }
.t-body-sm  { font-size: 13px; color: var(--text2); }
.t-desc     { font-size: 14px; color: var(--text2); line-height: 1.5; }
.fw7.t1     { font-weight: 700; color: var(--text1); }

/* Flex layouts */
.flex-ac-8  { display: flex; align-items: center; gap: 8px; }
.flex-ac-10 { display: flex; align-items: center; gap: 10px; }
.flex-ac-12 { display: flex; align-items: center; gap: 12px; }
.flex-sb    { display: flex; align-items: center; justify-content: space-between; }
.flex-sb-10 { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.flex-col-8 { display: flex; flex-direction: column; gap: 8px; }
.flex-wrap-8{ display: flex; gap: 8px; flex-wrap: wrap; }

/* ── Button size utilities (заменяют инлайн-стили) ── */
.btn-xs  { font-size: 11px !important; padding: 5px  10px !important; }
.btn-sm  { font-size: 12px !important; padding: 7px  12px !important; }
.btn-md  { font-size: 13px !important; padding: 8px  16px !important; }
.btn-lg  { font-size: 14px !important; padding: 10px 20px !important; }

/* ── Gap utilities ── */
.gap-4  { gap: 4px  !important; }
.gap-6  { gap: 6px  !important; }
.gap-8  { gap: 8px  !important; }
.gap-12 { gap: 12px !important; }
.gap-16 { gap: 16px !important; }

/* ── Text utilities ── */
.text-orange { color: var(--orange) !important; }
.text-error  { color: var(--red)    !important; }
.text-muted  { color: var(--text3)  !important; }
.fw-bold     { font-weight: 700 !important; }
.fw-800      { font-weight: 800 !important; }
.fs-11       { font-size: 11px !important; }
.fs-12       { font-size: 12px !important; }
.fs-13       { font-size: 13px !important; }
.fs-14       { font-size: 14px !important; }
.fs-15       { font-size: 15px !important; }

/* ═══════════════════════════════════════════════════════════════════
   MODAL DESIGN SYSTEM v2 — r110
   Единый стиль для всех модалок и шитов
═══════════════════════════════════════════════════════════════════ */

/* ── Overlay ── */
.modal-overlay-v2 {
  position: fixed; inset: 0;
  z-index: 8100;
  background: rgba(7,17,27,.75);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: flex-end; justify-content: center;
  opacity: 0; transition: opacity .22s ease;
}
.modal-overlay-v2.open { opacity: 1; }

/* ── Панель-шит снизу ── */
.modal-panel-v2 {
  width: min(640px, 100%);
  max-height: 90dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 -12px 60px rgba(0,0,0,.4);
}
.modal-overlay-v2.open .modal-panel-v2 { transform: translateY(0); }

/* ── Центрированный диалог ── */
.modal-dialog-v2 {
  width: min(520px, calc(100% - 32px));
  max-height: 88dvh;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: scale(.94) translateY(12px);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 24px 80px rgba(0,0,0,.45);
}
.modal-overlay-v2.open .modal-dialog-v2 { transform: scale(1) translateY(0); }

/* ── Header ── */
.modal-header-v2 {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 12px;
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.modal-header-v2__icon {
  font-size: 26px; line-height: 1; flex-shrink: 0;
  margin-top: 2px;
}
.modal-header-v2__body { flex: 1; min-width: 0; }
.modal-header-v2__title {
  font-family: 'Oswald', sans-serif;
  font-size: 19px; font-weight: 700; color: var(--text1);
  margin-bottom: 2px;
}
.modal-header-v2__sub {
  font-size: 12px; color: var(--text3); line-height: 1.5;
}
.modal-close-v2 {
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(255,255,255,.07); border: 1px solid var(--line);
  color: var(--text3); cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; transition: background .15s, color .15s;
}
.modal-close-v2:hover { background: rgba(255,255,255,.12); color: var(--text1); }

/* ── Handle (drag indicator) ── */
.modal-handle {
  width: 40px; height: 4px;
  background: var(--line2, rgba(255,255,255,.15));
  border-radius: var(--ui-radius-sm,5px); margin: 10px auto 0;
  flex-shrink: 0;
}

/* ── Body ── */
.modal-body-v2 {
  flex: 1; overflow-y: auto;
  padding: 20px;
  -webkit-overflow-scrolling: touch;
}
.modal-body-v2::-webkit-scrollbar { width: 4px; }
.modal-body-v2::-webkit-scrollbar-thumb { background: var(--line); border-radius: var(--ui-radius-sm,5px); }

/* ── Footer ── */
.modal-footer-v2 {
  display: flex; gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  flex-shrink: 0;
  background: var(--bg2);
}
.modal-footer-v2 .btn { flex: 1; }

/* ── Секция внутри модалки ── */
.modal-section {
  margin-bottom: 20px;
}
.modal-section-title {
  font-size: 11px; font-weight: 800; color: var(--text3);
  text-transform: uppercase; letter-spacing: .06em;
  margin-bottom: 10px;
}

/* ── Info-row внутри модалки ── */
.modal-info-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.modal-info-row:last-child { border-bottom: none; }
.modal-info-row__ico { font-size: 16px; flex-shrink: 0; width: 22px; text-align: center; }
.modal-info-row__label { font-size: 12px; color: var(--text3); width: 90px; flex-shrink: 0; }
.modal-info-row__val { font-size: 14px; color: var(--text1); font-weight: 600; flex: 1; }

/* ── Status badge в модалке ── */
.modal-status {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px;
  border-radius: 99px;
  font-size: 12px; font-weight: 700;
}
.modal-status--new     { background: rgba(96,165,250,.12);  color: #60a5fa; border: 1px solid rgba(96,165,250,.25); }
.modal-status--process { background: rgba(255,107,0,.12);   color: var(--orange); border: 1px solid rgba(255,107,0,.25); }
.modal-status--done    { background: rgba(34,197,94,.12);   color: #22c55e; border: 1px solid rgba(34,197,94,.25); }
.modal-status--wait    { background: rgba(245,158,11,.12);  color: #f59e0b; border: 1px solid rgba(245,158,11,.25); }
.modal-status--error   { background: rgba(239,68,68,.12);   color: #ef4444; border: 1px solid rgba(239,68,68,.25); }

/* ── Light theme ── */
[data-theme="light"] .modal-panel-v2,
[data-theme="light"] .modal-dialog-v2 { background: #fff; box-shadow: 0 -8px 40px rgba(0,0,0,.12); }
[data-theme="light"] .modal-overlay-v2 { background: rgba(0,0,0,.45); }
[data-theme="light"] .modal-close-v2 { background: rgba(0,0,0,.05); }
[data-theme="light"] .modal-info-row { border-color: rgba(0,0,0,.06); }

/* ── Input error state ── */
.input-error,
input.input-error,
textarea.input-error,
select.input-error {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.15) !important;
  animation: shake-err .3s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes shake-err {
  0%,100% { transform: translateX(0); }
  20%      { transform: translateX(-6px); }
  40%      { transform: translateX(6px); }
  60%      { transform: translateX(-4px); }
  80%      { transform: translateX(4px); }
}

/* ── Form field улучшения ── */
.form-field { margin-bottom: 16px; }
.form-label {
  display: block;
  font-size: 11px; font-weight: 700;
  color: var(--text3); text-transform: uppercase;
  letter-spacing: .05em; margin-bottom: 6px;
}
.form-hint {
  font-size: 11px; color: var(--text3);
  margin-top: 4px; line-height: 1.5;
}
.form-required::after { content: ' *'; color: #ef4444; }

/* ── Char counter ── */
.char-counter {
  font-size: 10px; color: var(--text3);
  text-align: right; margin-top: 3px;
}
.char-counter.near-limit { color: #f59e0b; }
.char-counter.at-limit   { color: #ef4444; font-weight: 700; }

/* ═══════════════════════════════════════════════════════════════════
   UTILITY — часто используемые паттерны
═══════════════════════════════════════════════════════════════════ */

/* Карточка-ячейка */
.k-cell {
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  background: var(--bg);
}
.k-cell-pad { padding: 10px; }
.k-cell-sm  { padding: 8px 12px; }

/* Поверхность */
.k-surface {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 14px;
}
.k-surface-lg { border-radius: var(--ui-radius-lg,18px); padding: 16px; }

/* Oswald заголовки */
.h-oswald-sm  { font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 700; }
.h-oswald-md  { font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 700; color: var(--text); }
.h-oswald-lg  { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 700; }
.h-oswald-xl  { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700; }

/* Section label */
.sec-label {
  font-size: 11px; font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 10px;
}

/* Flex row с space-between */
.row-sb       { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.row-sb-nowrap{ display: flex; align-items: center; justify-content: space-between; gap: 8px; }

/* Meta row */
.meta-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--text3);
}

/* Badge inline */
.badge-inline {
  display: inline-flex; align-items: center;
  padding: 3px 9px; border-radius: 99px;
  font-size: 10px; font-weight: 700;
  background: rgba(255,107,0,.1);
  color: var(--orange);
  border: 1px solid rgba(255,107,0,.2);
}

/* Separator */
.k-sep { height: 1px; background: var(--line); margin: 12px 0; }
.k-sep-sm { height: 1px; background: var(--line); margin: 8px 0; }

/* r237 — shared work-cycle chips */
.kareta-workflow-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(255,107,0,.09);border:1px solid rgba(255,107,0,.18);color:var(--orange);font-size:12px;font-weight:800}

/* === SOURCE: css/onb2.css === */
/* ═══════════════════════════════════════════════════════════════════
   ONB2 — isolated onboarding module
   v20260422r21
═══════════════════════════════════════════════════════════════════ */
#onb2-overlay {
  position: fixed;
  inset: 0;
  z-index: 9850;
  background:
    radial-gradient(circle at top, rgba(255,107,0,.10), transparent 34%),
    linear-gradient(180deg, rgba(5,8,12,.92), rgba(5,8,12,.96));
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: block;
  opacity: 0;
  transition: opacity .24s ease;
  overflow: hidden;
}
#onb2-overlay.open { opacity: 1; }

.onb2-step {
  position: absolute;
  inset: 0;
  display: none;
  pointer-events: none;
}
.onb2-step.active {
  display: block;
  pointer-events: auto;
}

.onb2-modal {
  width: 100%;
  height: 100%;
  background:
    radial-gradient(circle at top right, rgba(255,107,0,.10), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 96%, white 4%), color-mix(in srgb, var(--bg) 92%, #000 8%));
  display: flex;
  flex-direction: column;
  animation: onb2-fade-up .28s cubic-bezier(.16,1,.3,1) both;
}
@keyframes onb2-fade-up {
  from { transform: translateY(18px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.onb2-modal-head,
.onb2-modal-body,
.onb2-modal-foot {
  padding-left: clamp(16px, 3vw, 42px);
  padding-right: clamp(16px, 3vw, 42px);
}

.onb2-modal-head {
  padding-top: max(16px, env(safe-area-inset-top, 0px));
  padding-bottom: 18px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 78%, rgba(255,255,255,.08));
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    radial-gradient(circle at top left, rgba(255,107,0,.16), transparent 40%);
}
.onb2-headbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}
.onb2-brandbox {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.onb2-brandmark {
  width: 46px;
  height: 46px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-radius-md,10px);
  background: rgba(255,107,0,.09);
  border: 1px solid rgba(255,107,0,.20);
  box-shadow: 0 12px 24px rgba(255,107,0,.10);
}
.onb2-brandcopy { min-width: 0; }
.onb2-brandtext {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  line-height: 1.05;
  font-weight: 700;
  color: var(--text1);
}
.onb2-brandsub {
  margin-top: 4px;
  font-size: 12px;
  color: var(--text3);
}
.onb2-close-btn {
  width: 42px;
  min-width: 42px;
  height: 42px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: rgba(255,255,255,.03);
  color: var(--text2);
  font-size: 18px;
  cursor: pointer;
  transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}
.onb2-close-btn:hover,
.onb2-close-btn:focus-visible {
  border-color: rgba(255,107,0,.30);
  color: var(--orange);
  background: rgba(255,107,0,.08);
  outline: none;
}
.onb2-modal-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255,107,0,.10);
  border: 1px solid rgba(255,107,0,.20);
  color: var(--orange);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.onb2-modal-role-ico {
  font-size: 34px;
  line-height: 1;
  margin-top: 14px;
  margin-bottom: 10px;
}
.onb2-modal-title {
  margin-top: 4px;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(22px, 2.2vw, 34px);
  line-height: 1.08;
  font-weight: 700;
  color: var(--text1);
}
.onb2-modal-sub {
  margin-top: 8px;
  max-width: 760px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--text2);
}
.onb2-modal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.onb2-meta-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255,107,0,.10);
  border: 1px solid rgba(255,107,0,.20);
  font-size: 11px;
  font-weight: 800;
  color: var(--orange);
  letter-spacing: .03em;
}
.onb2-meta-pill--soft {
  background: rgba(255,255,255,.04);
  border-color: var(--line);
  color: var(--text2);
  font-weight: 700;
}
.onb2-stepdots {
  display: flex;
  gap: 6px;
  margin-top: 14px;
}
.onb2-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--line);
  transition: width .2s ease, background .2s ease;
}
.onb2-dot.act {
  width: 22px;
  background: var(--orange);
}

.onb2-modal-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-top: 18px;
  padding-bottom: 22px;
  -webkit-overflow-scrolling: touch;
}
.onb2-shell {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}
.onb2-shell--role { max-width: 1240px; }
.onb2-shell--split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
/* На мобиле скрываем preview-панель — только контент */
.onb2-shell--split [data-onb2-profile-preview] {
  display: none;
}
.onb2-city-stack { display: flex; flex-direction: column; gap: 16px; }

.onb2-modal-foot {
  padding-top: 14px;
  padding-bottom: calc(max(14px, env(safe-area-inset-bottom, 0px)));
  border-top: 1px solid color-mix(in srgb, var(--line) 78%, rgba(255,255,255,.08));
  background: linear-gradient(180deg, rgba(255,255,255,.015), rgba(255,255,255,.03));
}
.onb2-foot-shell {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  gap: 10px;
}
.onb2-back-btn,
.onb2-continue-btn,
.onb2-role-card,
.onb2-spec-card,
.onb2-slide-nav,
.onb2-city-slide,
.onb2-brand-slide,
.onb2-ip-confirm {
  -webkit-tap-highlight-color: transparent;
}
.onb2-back-btn {
  width: 50px;
  min-width: 50px;
  height: 50px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text2);
  font-size: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.onb2-continue-btn {
  flex: 1;
  min-height: 50px;
  border: none;
  border-radius: var(--ui-radius-md,10px);
  background: linear-gradient(180deg, color-mix(in srgb, var(--orange) 92%, white 8%), var(--orange));
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(255,107,0,.18);
}
.onb2-continue-btn:active,
.onb2-back-btn:active { transform: translateY(1px); }

.onb2-profile-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  border-radius: var(--ui-radius-lg,18px);
  border: 1px solid color-mix(in srgb, var(--line) 82%, rgba(255,255,255,.08));
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    radial-gradient(circle at top right, rgba(255,107,0,.10), transparent 34%),
    var(--bg2);
  box-shadow: 0 18px 40px rgba(0,0,0,.14);
}
.onb2-profile-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.onb2-profile-mark {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-radius-md,10px);
  background: rgba(255,107,0,.10);
  border: 1px solid rgba(255,107,0,.18);
  font-size: 26px;
}
.onb2-profile-copy { min-width: 0; }
.onb2-profile-eyebrow {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--orange);
}
.onb2-profile-title {
  margin-top: 4px;
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  line-height: 1.1;
  color: var(--text1);
}
.onb2-profile-sub {
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text2);
}
.onb2-profile-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.onb2-profile-metric {
  min-width: 0;
  padding: 12px 12px 11px;
  border-radius: var(--ui-radius-md,10px);
  background: rgba(255,255,255,.03);
  border: 1px solid var(--line);
}
.onb2-profile-metric span {
  display: block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text3);
}
.onb2-profile-metric strong {
  display: block;
  margin-top: 7px;
  font-size: 14px;
  line-height: 1.3;
  color: var(--text1);
}
.onb2-profile-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.onb2-profile-chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,107,0,.10);
  border: 1px solid rgba(255,107,0,.18);
  color: var(--text1);
  font-size: 11px;
  font-weight: 700;
}
.onb2-profile-chip--soft {
  background: rgba(255,255,255,.04);
  border-color: var(--line);
}
.onb2-profile-chip--ghost {
  background: transparent;
  border-style: dashed;
  border-color: rgba(255,255,255,.14);
  color: var(--text3);
}
.onb2-profile-note {
  font-size: 12px;
  line-height: 1.6;
  color: var(--text2);
}

.onb2-roles {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.onb2-role-card {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 16px 15px;
  border-radius: var(--ui-radius-lg,18px);
  border: 1.5px solid color-mix(in srgb, var(--line) 84%, rgba(255,255,255,.06));
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg2) 94%, white 6%), var(--bg2));
  box-shadow: 0 12px 26px rgba(0,0,0,.09);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.onb2-role-card:focus-visible,
.onb2-role-card.is-selected {
  outline: none;
  border-color: var(--orange);
  background: linear-gradient(180deg, rgba(255,107,0,.10), rgba(255,107,0,.04));
  box-shadow: 0 18px 34px rgba(255,107,0,.13);
}
.onb2-role-top {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.onb2-role-ico-wrap {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  border-radius: var(--ui-radius-md,10px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,107,0,.08);
  border: 1px solid rgba(255,107,0,.18);
}
.onb2-role-ico {
  font-size: 27px;
  line-height: 1;
}
.onb2-role-main {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.onb2-role-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}
.onb2-role-name {
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  line-height: 1.15;
  font-weight: 700;
  color: var(--text1);
}
.onb2-role-arrow {
  flex-shrink: 0;
  font-size: 18px;
  color: var(--text3);
}
.onb2-role-card.is-selected .onb2-role-arrow,
.onb2-role-card.onb2-role--featured .onb2-role-arrow,
.onb2-role-card.onb2-role--featured .onb2-role-name {
  color: var(--orange);
}
.onb2-role-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text2);
}
.onb2-role-features {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.onb2-role-feat {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--surface-a);
  border: 1px solid var(--line);
  font-size: 11px;
  font-weight: 700;
  color: var(--text2);
  white-space: nowrap;
}
.onb2-role-card.onb2-role--featured {
  border-color: rgba(255,107,0,.28);
}
.onb2-role-badge {
  position: absolute;
  top: -1px;
  right: 14px;
  padding: 2px 8px;
  border-radius: 0 0 var(--ui-radius-sm,5px) var(--ui-radius-sm,5px);
  background: var(--orange);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.onb2-desc-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.onb2-desc-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 15px 16px;
  border-radius: var(--ui-radius-lg,18px);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg2) 95%, white 5%), var(--bg2));
  border: 1px solid var(--line);
}
.onb2-desc-item-ico {
  font-size: 22px;
  line-height: 1;
  margin-top: 2px;
}
.onb2-desc-item-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text1);
  margin-bottom: 3px;
}
.onb2-desc-item-sub {
  font-size: 12px;
  line-height: 1.65;
  color: var(--text2);
}

.onb2-step-note {
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: var(--text3);
}
.onb2-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.onb2-spec-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 118px;
  padding: 14px 12px 12px;
  border-radius: var(--ui-radius-lg,18px);
  border: 1.5px solid var(--line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg2) 95%, white 5%), var(--bg2));
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  color: inherit;
  font: inherit;
  text-align: center;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.onb2-spec-card.is-selected {
  border-color: var(--orange);
  background: rgba(255,107,0,.08);
  box-shadow: 0 14px 26px rgba(255,107,0,.12);
}
.onb2-spec-check {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  pointer-events: none;
}
.onb2-spec-card.is-selected .onb2-spec-check {
  background: var(--orange);
  border-color: var(--orange);
  color: #fff;
}
.onb2-spec-ico {
  font-size: 26px;
  line-height: 1;
}
.onb2-spec-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.onb2-spec-name {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--text1);
}
.onb2-spec-sub {
  font-size: 11px;
  line-height: 1.42;
  color: var(--text2);
}
.onb2-spec-card.is-selected .onb2-spec-name { color: var(--orange); }
.onb2-spec--evac {
  grid-column: 1 / -1;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  text-align: left;
  padding: 14px 16px 44px;
  border-color: rgba(239,68,68,.3);
  background: rgba(239,68,68,.06);
}
.onb2-spec--evac .onb2-spec-body { align-items: flex-start; }
.onb2-spec--evac .onb2-spec-name { font-size: 14px; color: #ef4444; }
.onb2-spec--evac .onb2-spec-ico { font-size: 28px; flex-shrink: 0; }
.onb2-spec-evac-badge {
  position: absolute;
  right: 14px;
  bottom: 12px;
  padding: 2px 8px;
  border-radius: 99px;
  background: rgba(239,68,68,.15);
  color: #ef4444;
  border: 1px solid rgba(239,68,68,.25);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.onb2-spec--evac.is-selected {
  border-color: #ef4444;
  background: rgba(239,68,68,.10);
}

.onb2-slider-block { margin-bottom: 0; }
.onb2-slider-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text3);
}
.onb2-ip-loading,
.onb2-optional {
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 600;
  color: var(--text3);
}
.onb2-slider-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.onb2-slide-nav {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: var(--surface-a);
  color: var(--text1);
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.onb2-slide-wrap {
  flex: 1;
  overflow: hidden;
}
.onb2-city-track {
  display: flex;
  gap: 8px;
  will-change: transform;
  transition: transform .28s cubic-bezier(.4,0,.2,1);
}
.onb2-city-slide {
  flex-shrink: 0;
  width: clamp(82px, 23vw, 108px);
  min-height: 78px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 10px 6px;
  border-radius: var(--ui-radius-md,10px);
  border: 1.5px solid var(--line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg2) 95%, white 5%), var(--bg2));
  opacity: .45;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition: border-color .18s ease, transform .18s ease, opacity .18s ease, background .18s ease;
}
.onb2-city-slide.is-active {
  opacity: 1;
  border-color: var(--orange);
  background: rgba(255,107,0,.08);
  transform: scale(1.04);
}
.onb2-city-slide.is-side { opacity: .75; }
.onb2-city-slide-title {
  font-family: 'Oswald', sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  color: var(--text1);
}
.onb2-city-slide.is-active .onb2-city-slide-title { color: var(--orange); font-size: 12px; }
.onb2-brand-wrap { overflow-x: auto; }
.onb2-brand-track {
  display: flex;
  gap: 8px;
  padding-bottom: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.onb2-brand-track::-webkit-scrollbar { display: none; }
.onb2-brand-slide {
  flex-shrink: 0;
  min-width: 68px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 9px 12px;
  border-radius: var(--ui-radius-md,10px);
  border: 1.5px solid var(--line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg2) 95%, white 5%), var(--bg2));
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.onb2-brand-slide.is-selected {
  border-color: var(--orange);
  background: rgba(255,107,0,.08);
}
.onb2-brand-abbr {
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .03em;
  line-height: 1;
  color: var(--text2);
}
.onb2-brand-name {
  font-size: 10px;
  font-weight: 700;
  color: var(--text2);
  white-space: nowrap;
}
.onb2-brand-slide.is-selected .onb2-brand-abbr,
.onb2-brand-slide.is-selected .onb2-brand-name {
  color: var(--orange);
}

.onb2-ip-suggest {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-radius: var(--ui-radius-md,10px);
  background: rgba(52,211,153,.08);
  border: 1px solid rgba(52,211,153,.22);
}
.onb2-ip-suggest-text,
.onb2-ip-city-label {
  font-size: 13px;
  color: var(--text1);
}
.onb2-ip-city-label { font-weight: 700; }
.onb2-ip-confirm {
  margin-left: auto;
  height: 34px;
  padding: 0 14px;
  border-radius: var(--ui-radius-md,10px);
  border: none;
  background: var(--orange);
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.onb2-ip-picked {
  font-size: 13px;
  font-weight: 700;
  color: #34d399;
}

@keyframes onb2-shake {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}
.onb2-shake { animation: onb2-shake .35s ease; }

@media (max-width: 679px) {
  .onb2-headbar { justify-content: flex-start; }
  [data-onb2-profile-preview="desc"],
  [data-onb2-profile-preview="spec"],
  [data-onb2-profile-preview="city"] { display: none !important; }
  .onb2-modal-head {
    padding-top: max(10px, env(safe-area-inset-top, 0px));
    padding-bottom: 14px;
  }
  .onb2-headbar { margin-bottom: 12px; }
  .onb2-brandmark { width: 40px; height: 40px; }
  .onb2-brandtext { font-size: 18px; }
  .onb2-brandsub { font-size: 11px; }
  .onb2-modal-kicker { min-height: 24px; padding: 0 9px; font-size: 10px; }
  .onb2-modal-role-ico { margin-top: 10px; margin-bottom: 6px; font-size: 28px; }
  .onb2-modal-title { font-size: 21px; }
  .onb2-modal-sub { margin-top: 6px; font-size: 12px; line-height: 1.52; }
  .onb2-modal-meta { margin-top: 10px; gap: 6px; }
  .onb2-meta-pill { min-height: 26px; padding: 0 9px; font-size: 10px; }
  .onb2-modal-body {
    padding-top: 12px;
    padding-bottom: 16px;
  }
  .onb2-shell--split,
  .onb2-city-stack { gap: 12px; }
  .onb2-profile-card { padding: 15px; border-radius: var(--ui-radius-lg,18px); }
  .onb2-profile-metrics { grid-template-columns: 1fr; }
  .onb2-role-card { gap: 10px; }
  .onb2-step-note {
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.45;
  }
  .onb2-spec-grid { gap: 6px; }
  .onb2-spec-card {
    min-height: 98px;
    gap: 8px;
    padding: 12px var(--ui-radius-md,10px) var(--ui-radius-md,10px);
    border-radius: var(--ui-radius-md,10px);
  }
  .onb2-spec-check {
    top: 8px;
    right: 8px;
    width: 18px;
    height: 18px;
    font-size: 10px;
  }
  .onb2-spec-ico { font-size: 22px; }
  .onb2-spec-name { font-size: 11px; line-height: 1.24; }
  .onb2-spec--evac {
    gap: 10px;
    padding: 12px 14px 40px;
    border-radius: var(--ui-radius-lg,18px);
  }
  .onb2-spec--evac .onb2-spec-name { font-size: 13px; }
  .onb2-spec--evac .onb2-spec-ico { font-size: 24px; }
  .onb2-spec-evac-badge {
    right: 12px;
    bottom: 10px;
    font-size: 8px;
  }
  .onb2-slider-label { margin-bottom: 8px; font-size: 10px; }
  .onb2-slider-row { gap: 6px; }
  .onb2-slide-nav {
    width: 30px;
    height: 30px;
    min-width: 30px;
    border-radius: var(--ui-radius-md,10px);
    font-size: 16px;
  }
  .onb2-city-slide {
    width: clamp(74px, 22vw, 94px);
    min-height: 68px;
    gap: 4px;
    padding: 8px 6px;
    border-radius: var(--ui-radius-md,10px);
  }
  .onb2-city-slide-title { font-size: 10px; }
  .onb2-city-slide.is-active .onb2-city-slide-title { font-size: 11px; }
  .onb2-brand-track { gap: 6px; }
  .onb2-brand-slide {
    min-width: 60px;
    gap: 3px;
    padding: 8px 10px;
    border-radius: var(--ui-radius-md,10px);
  }
  .onb2-brand-abbr { font-size: 12px; }
  .onb2-brand-name { font-size: 9px; }
  .onb2-ip-suggest {
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--ui-radius-md,10px);
  }
  .onb2-ip-suggest-text,
  .onb2-ip-city-label,
  .onb2-ip-picked { font-size: 12px; }
  .onb2-ip-confirm {
    width: 100%;
    margin-left: 0;
    justify-content: center;
  }
  .onb2-role-desc,
  .onb2-role-features,
  .onb2-spec-sub,
  .onb2-meta-pill--soft { display: none; }
  .onb2-foot-shell { gap: 8px; }
}

@media (min-width: 680px) {
  .onb2-shell--split {
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 18px;
  }
  /* Восстанавливаем profile-preview на планшете */
  .onb2-shell--split [data-onb2-profile-preview] {
    display: block;
  }
  .onb2-role-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .onb2-role-features { display: flex; }
  .onb2-role-feat:nth-child(n+3) { display: none; }
  .onb2-spec-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .onb2-spec-card { min-height: 150px; padding: 16px 14px; }
  .onb2-spec-sub {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
}

@media (min-width: 1024px) {
  .onb2-modal-head { padding-top: max(20px, env(safe-area-inset-top, 0px)); padding-bottom: 22px; }
  .onb2-shell--split {
    grid-template-columns: minmax(320px, 390px) minmax(0, 1fr);
    gap: 22px;
  }
  .onb2-roles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .onb2-role-card { min-height: 230px; padding: 20px; }
  .onb2-role-desc { -webkit-line-clamp: 4; font-size: 14px; }
  .onb2-role-feat:nth-child(n+3) { display: inline-flex; }
  .onb2-spec-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  .onb2-spec-card {
    min-height: 172px;
    align-items: flex-start;
    text-align: left;
    padding: 18px 16px 16px;
  }
  .onb2-spec-body { align-items: flex-start; }
  .onb2-spec-name { font-size: 13px; }
  .onb2-spec-sub { -webkit-line-clamp: 3; }
  .onb2-spec--evac {
    grid-column: span 2;
    align-items: flex-start;
    padding-right: 72px;
  }
  .onb2-spec-evac-badge { right: 16px; bottom: 16px; }
}

@media (hover: hover) {
  .onb2-role-card:hover,
  .onb2-spec-card:hover,
  .onb2-city-slide:hover,
  .onb2-brand-slide:hover {
    border-color: rgba(255,107,0,.28);
    transform: translateY(-1px);
  }
}

/* r84 — onboarding route-state + шаг 3/4 "Точность профиля" */

/* r85 — route labels for every onboarding step */
.onb2-routebar {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 18px 8px;
  margin-top: -4px;
}
.onb2-route-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  max-width: 100%;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.05);
  color: var(--text3);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-theme="light"] .onb2-route-chip {
  background: #f7f7f9;
  border-color: rgba(0,0,0,.08);
}
@media (max-width: 767px) {
  .onb2-routebar { padding: 0 12px 7px; }
  .onb2-route-chip { min-height: 22px; padding: 4px 7px; font-size: 10px; }
}
.onb2-spec-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.onb2-spec-stage-card {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border-radius: var(--ui-radius-lg,18px);
}
.onb2-spec-stage-ico {
  width: 54px;
  height: 54px;
  border-radius: var(--ui-radius-lg,18px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  background: rgba(255, 107, 0, .12);
  border: 1px solid rgba(255, 107, 0, .24);
}
.onb2-spec-stage-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.onb2-spec-stage-kicker {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--orange);
}
.onb2-spec-stage-title {
  font-family: Oswald, sans-serif;
  font-size: 21px;
  line-height: 1.08;
  font-weight: 800;
  color: var(--text);
}
.onb2-spec-stage-sub {
  font-size: 13px;
  line-height: 1.35;
  color: var(--text2);
}
.onb2-spec-stage-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.onb2-spec-stage-meta span,
.onb2-spec-counter,
.onb2-spec-route {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 5px 8px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.05);
  color: var(--text2);
  font-size: 11px;
  font-weight: 750;
}
.onb2-spec-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.onb2-spec-counter {
  color: var(--orange);
  border-color: rgba(255, 107, 0, .22);
  background: rgba(255, 107, 0, .08);
}
.onb2-spec-route {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--text3);
}
[data-theme="light"] .onb2-spec-stage-card {
  background: #fff !important;
  border-color: rgba(0,0,0,.08) !important;
}
[data-theme="light"] .onb2-spec-stage-meta span,
[data-theme="light"] .onb2-spec-route {
  background: #f7f7f9;
  border-color: rgba(0,0,0,.08);
}
@media (max-width: 767px) {
  .onb2-spec-stage-card {
    grid-template-columns: 44px 1fr;
    padding: 12px;
    border-radius: var(--ui-radius-md,10px);
    gap: 10px;
  }
  .onb2-spec-stage-ico {
    width: 44px;
    height: 44px;
    border-radius: var(--ui-radius-md,10px);
    font-size: 24px;
  }
  .onb2-spec-stage-title { font-size: 18px; }
  .onb2-spec-stage-sub { font-size: 12px; }
  .onb2-spec-tools { gap: 6px; }
  .onb2-spec-counter,
  .onb2-spec-route { font-size: 10px; min-height: 22px; padding: 4px 7px; }
}

/* === SOURCE: css/onboarding_r1_welcome.css === */
/* ONBOARDING-r1 — first welcome screen. Scope: #onboarding-welcome-r1 only. */
#onboarding-welcome-r1.onbw-overlay{
  position:fixed;
  inset:0;
  z-index:12000;
  display:grid;
  place-items:center;
  background:#f4f4f5;
  opacity:0;
  pointer-events:auto;
  transition:opacity .18s ease;
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
#onboarding-welcome-r1.onbw-overlay.open{opacity:1;}
#onboarding-welcome-r1 .onbw-screen{
  position:relative;
  width:min(390px, 100vw);
  min-height:100dvh;
  margin:0 auto;
  background:linear-gradient(180deg,#fff 0%,#fff 54%,#f4f5f7 100%);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:10px 18px max(18px, env(safe-area-inset-bottom));
  box-shadow:0 22px 70px rgba(15,23,42,.10);
}
#onboarding-welcome-r1 .onbw-statusbar{
  height:22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:11px;
  line-height:1;
  font-weight:900;
  color:#111827;
  opacity:.96;
  flex:0 0 auto;
}
#onboarding-welcome-r1 .onbw-status-icons{
  letter-spacing:-.08em;
  font-size:10px;
}
#onboarding-welcome-r1 .onbw-content{
  position:relative;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:0;
  padding:28px 0 14px;
  text-align:center;
}
#onboarding-welcome-r1 .onbw-brand{
  font-size:30px;
  line-height:1;
  font-weight:950;
  letter-spacing:-1.15px;
  color:#111827;
  margin-bottom:26px;
}
#onboarding-welcome-r1 .onbw-brand span{color:#f5b400;}
#onboarding-welcome-r1 h1{
  margin:0;
  max-width:300px;
  color:#1f2937;
  font-size:16px;
  line-height:1.38;
  font-weight:750;
  letter-spacing:-.02em;
}
#onboarding-welcome-r1 .onbw-skyline{
  position:relative;
  width:100%;
  height:340px;
  margin-top:26px;
  opacity:1;
}
#onboarding-welcome-r1 .onbw-skyline::before{
  content:'';
  position:absolute;
  left:50%;
  bottom:32px;
  width:360px;
  height:260px;
  transform:translateX(-50%);
  background:radial-gradient(circle at 50% 60%, rgba(17,24,39,.06), transparent 58%);
}
#onboarding-welcome-r1 .onbw-building{
  position:absolute;
  bottom:70px;
  width:34px;
  border-radius:7px 7px 0 0;
  background:linear-gradient(180deg,rgba(148,163,184,.18),rgba(148,163,184,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
#onboarding-welcome-r1 .onbw-building.b1{left:12px;height:78px;}
#onboarding-welcome-r1 .onbw-building.b2{left:58px;height:112px;width:42px;}
#onboarding-welcome-r1 .onbw-building.b3{left:128px;height:148px;width:50px;}
#onboarding-welcome-r1 .onbw-building.b4{right:80px;height:104px;width:44px;}
#onboarding-welcome-r1 .onbw-building.b5{right:20px;height:72px;width:38px;}
#onboarding-welcome-r1 .onbw-road{
  position:absolute;
  left:50%;
  bottom:58px;
  width:340px;
  height:92px;
  transform:translateX(-50%);
  border-radius:50% 50% 0 0;
  background:linear-gradient(180deg,rgba(229,231,235,.22),rgba(229,231,235,.02));
  border-top:1px solid rgba(209,213,219,.45);
}
#onboarding-welcome-r1 .onbw-pin{
  position:absolute;
  width:11px;
  height:11px;
  border:2px solid #f5b400;
  border-radius:999px 999px 999px 0;
  transform:rotate(-45deg);
  background:#fff;
  z-index:2;
  box-shadow:0 4px 10px rgba(245,180,0,.18);
}
#onboarding-welcome-r1 .onbw-pin::after{
  content:'';
  position:absolute;
  width:3px;
  height:3px;
  left:2px;
  top:2px;
  border-radius:999px;
  background:#f5b400;
}
#onboarding-welcome-r1 .onbw-pin--one{left:68px;top:86px;}
#onboarding-welcome-r1 .onbw-pin--two{right:72px;top:48px;}
#onboarding-welcome-r1 .onbw-pin--three{left:170px;top:28px;}
#onboarding-welcome-r1 .onbw-car-svg{
  position:absolute;
  left:50%;
  bottom:18px;
  width:330px;
  max-width:94%;
  transform:translateX(-50%);
  filter:drop-shadow(0 22px 25px rgba(15,23,42,.18));
  z-index:3;
}
#onboarding-welcome-r1 .onbw-footer{
  position:relative;
  z-index:4;
  flex:0 0 auto;
  display:grid;
  gap:13px;
  padding-bottom:2px;
}
#onboarding-welcome-r1 .onbw-start{
  width:100%;
  min-height:54px;
  border:0;
  border-radius:12px;
  background:linear-gradient(180deg,#ffc400,#f4b400);
  color:#111827;
  font-size:14px;
  font-weight:950;
  box-shadow:0 12px 28px rgba(245,180,0,.25);
}
#onboarding-welcome-r1 .onbw-start:active{transform:translateY(1px) scale(.995);}
#onboarding-welcome-r1 .onbw-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:8px;
}
#onboarding-welcome-r1 .onbw-dots span{
  width:6px;
  height:6px;
  border-radius:999px;
  background:#e5e7eb;
}
#onboarding-welcome-r1 .onbw-dots span.is-active{
  width:22px;
  background:#ffc400;
}
@media (min-width:768px){
  #onboarding-welcome-r1 .onbw-screen{
    min-height:min(812px, calc(100dvh - 40px));
    border-radius:28px;
    border:1px solid rgba(17,24,39,.08);
  }
}
@media (max-width:360px){
  #onboarding-welcome-r1 .onbw-screen{padding-left:14px;padding-right:14px;}
  #onboarding-welcome-r1 .onbw-brand{font-size:28px;margin-bottom:22px;}
  #onboarding-welcome-r1 h1{font-size:17px;}
  #onboarding-welcome-r1 .onbw-skyline{height:320px;}
}

/* ONBOARDING-r16 — reference alignment for first 3 onboarding screens. Scope: welcome overlay only. */
#onboarding-welcome-r1 .onbw-screen{
  width:min(393px,100vw);
  min-height:100dvh;
  background:#fff;
  padding:10px 16px max(14px, env(safe-area-inset-bottom));
}
#onboarding-welcome-r1 .onbw-content{
  justify-content:flex-start;
  padding:56px 0 8px;
}
#onboarding-welcome-r1 .onbw-brand{
  font-size:31px;
  margin-bottom:24px;
  letter-spacing:-1.25px;
}
#onboarding-welcome-r1 h1{
  max-width:292px;
  font-size:17px;
  line-height:1.32;
  font-weight:820;
  color:#111827;
}
#onboarding-welcome-r1 .onbw-skyline{
  width:calc(100% + 32px);
  height:430px;
  margin:22px -16px 0;
  background:url('../assets/onboarding/welcome_city_bg.png') center bottom / cover no-repeat;
  isolation:isolate;
}
#onboarding-welcome-r1 .onbw-skyline::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.02) 0%,rgba(255,255,255,.08) 48%,rgba(255,255,255,.30) 100%);
  z-index:1;
  pointer-events:none;
}
#onboarding-welcome-r1 .onbw-skyline::before,
#onboarding-welcome-r1 .onbw-building,
#onboarding-welcome-r1 .onbw-road{display:none;}
#onboarding-welcome-r1 .onbw-pin{z-index:2;}
#onboarding-welcome-r1 .onbw-pin--one{left:94px;top:152px;width:13px;height:13px;}
#onboarding-welcome-r1 .onbw-pin--two{right:68px;top:92px;width:9px;height:9px;}
#onboarding-welcome-r1 .onbw-pin--three{left:210px;top:52px;width:8px;height:8px;}
#onboarding-welcome-r1 .onbw-car-svg{
  bottom:42px;
  width:318px;
  z-index:3;
  filter:drop-shadow(0 24px 24px rgba(15,23,42,.20));
}
#onboarding-welcome-r1 .onbw-footer{
  gap:10px;
  padding-bottom:0;
}
#onboarding-welcome-r1 .onbw-start{
  min-height:48px;
  border-radius:10px;
}
@media (min-width:768px){
  #onboarding-welcome-r1 .onbw-screen{
    min-height:min(844px, calc(100dvh - 40px));
    border-radius:18px;
  }
}
@media (max-width:360px){
  #onboarding-welcome-r1 .onbw-content{padding-top:44px;}
  #onboarding-welcome-r1 .onbw-skyline{height:396px;}
  #onboarding-welcome-r1 .onbw-car-svg{width:286px;bottom:38px;}
}

/* ONBOARDING-r17 — welcome footer cleanup and closer reference polish. */
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen{
  background:#fff;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content{
  padding-bottom:0;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer{
  position:relative;
  gap:10px;
  margin:0 -16px;
  padding:10px 16px max(6px, env(safe-area-inset-bottom));
  background:#fff;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.0) 0%,rgba(255,255,255,.92) 16%,#fff 100%);
  pointer-events:none;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer > *{
  position:relative;
  z-index:1;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-start{
  min-height:50px;
  border-radius:12px;
  box-shadow:0 14px 24px rgba(245,180,0,.20);
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-dots{
  padding-bottom:2px;
}

/* ONBOARDING-r20 — custom first screen built from provided user assets. */
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay){
  background:#f2f2f3;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
  width:min(430px,100vw);
  min-height:100dvh;
  background:linear-gradient(180deg,#f5f5f6 0%,#ffffff 100%);
  padding:14px 18px max(16px, env(safe-area-inset-bottom));
  box-shadow:0 26px 72px rgba(15,23,42,.12);
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-statusbar{
  height:28px;
  font-size:16px;
  font-weight:900;
  color:#050505;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-status-icons{
  font-size:14px;
  letter-spacing:-.12em;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
  padding:42px 0 0;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(100%, 360px);
  margin:0 auto 24px;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-full{
  display:block;
  width:min(100%, 360px);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(255,110,0,.10));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1{
  max-width:100%;
  margin:0 0 12px;
  color:#09090b;
  font-size:28px;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.05em;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{
  margin:0;
  max-width:304px;
  color:#6b7280;
  font-size:16px;
  line-height:1.48;
  font-weight:500;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
  position:relative;
  width:calc(100% + 36px);
  height:450px;
  margin:16px -18px 0;
  background:url('../assets/onboarding/welcome_city_bg_orange.png') center top / cover no-repeat;
  overflow:hidden;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 16%,rgba(255,255,255,0) 82%,rgba(255,255,255,.22) 100%);
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-pin-img,
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset{
  position:absolute;
  z-index:2;
  user-select:none;
  pointer-events:none;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-pin-img--one{
  left:74px;
  top:108px;
  width:56px;
  filter:drop-shadow(0 10px 12px rgba(255,106,0,.20));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-pin-img--two{
  right:74px;
  left:auto;
  top:76px;
  width:34px;
  filter:drop-shadow(0 8px 10px rgba(255,106,0,.18));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--wrench{
  right:92px;
  top:168px;
  width:118px;
  transform:rotate(8deg);
  filter:drop-shadow(0 18px 18px rgba(255,106,0,.18));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--oil{
  right:26px;
  top:228px;
  width:114px;
  filter:drop-shadow(0 18px 18px rgba(255,106,0,.12));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--car{
  left:34px;
  bottom:84px;
  width:234px;
  filter:drop-shadow(0 18px 28px rgba(15,23,42,.18));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--tow{
  right:10px;
  bottom:86px;
  width:136px;
  filter:drop-shadow(0 18px 24px rgba(15,23,42,.14));
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero{
  margin:0;
  padding:14px 6px 2px;
  background:transparent;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero::before{
  display:none;
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-start--hero{
  min-height:60px;
  border-radius:18px;
  background:linear-gradient(90deg,#ff8d21 0%,#ff5a00 100%);
  color:#fff;
  font-size:18px;
  font-weight:900;
  box-shadow:0 18px 28px rgba(255,102,0,.22);
}
#onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-dots{
  display:none;
}
@media (min-width:768px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    min-height:min(900px, calc(100dvh - 24px));
    border-radius:36px;
  }
}
@media (max-width:400px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    padding-left:14px;
    padding-right:14px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    padding-top:34px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
    grid-template-columns:64px 4px minmax(0,1fr);
    gap:14px;
    width:min(100%, 300px);
    margin-bottom:20px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-icon{
    width:64px;height:64px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-divider{
    height:70px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-title{
    font-size:31px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-subtitle{
    font-size:20px;
    margin-top:8px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1{
    font-size:25px;
    margin-bottom:14px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{
    max-width:280px;
    font-size:16px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    width:calc(100% + 28px);
    height:408px;
    margin-left:-14px;
    margin-right:-14px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-pin-img--one{
    left:54px; top:98px; width:46px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-pin-img--two{
    right:56px; left:auto; top:70px; width:28px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--wrench{
    right:70px; top:146px; width:100px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--oil{
    right:18px; top:198px; width:96px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--car{
    left:24px; bottom:74px; width:202px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--tow{
    right:8px; bottom:76px; width:122px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero{
    padding-top:12px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-start--hero{
    min-height:56px;
    border-radius:18px;
    font-size:18px;
  }
}


@media (max-width:420px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
    width:min(100%, 326px);
    margin-bottom:22px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-full{
    width:min(100%, 326px);
  }
}

/* ONBOARDING-r25 — wide/tablet optimization for first welcome screen. */
@media (min-width:768px){
  #onboarding-welcome-r1.onbw-overlay{
    padding:18px;
    background:radial-gradient(circle at 50% 18%, rgba(255,255,255,.92), rgba(244,244,245,.96) 58%, #eceeef 100%);
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    width:min(960px, calc(100vw - 40px));
    min-height:min(820px, calc(100dvh - 36px));
    height:auto;
    padding:20px 36px 32px;
    border-radius:34px;
    box-shadow:0 24px 80px rgba(15,23,42,.16);
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    flex:1 1 auto;
    display:grid;
    grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);
    grid-template-areas:
      "brand hero"
      "title hero"
      "lead hero";
    align-content:center;
    align-items:center;
    column-gap:36px;
    row-gap:0;
    padding:30px 8px 26px;
    text-align:left;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
    grid-area:brand;
    justify-content:flex-start;
    width:min(100%, 390px);
    margin:0 0 44px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-full{
    width:min(100%, 390px);
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1{
    grid-area:title;
    max-width:420px;
    margin:0 0 18px;
    font-size:40px;
    line-height:1.06;
    text-align:left;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{
    grid-area:lead;
    max-width:430px;
    font-size:20px;
    line-height:1.45;
    text-align:left;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    grid-area:hero;
    width:100%;
    max-width:520px;
    height:min(540px, calc(100dvh - 210px));
    min-height:420px;
    margin:0 0 0 auto;
    border-radius:30px;
    background-position:center center;
    background-size:cover;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero{
    width:360px;
    margin:0 0 0 8px;
    padding:0;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-start--hero{
    min-height:64px;
    border-radius:18px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--car{
    left:42px;
    bottom:98px;
    width:268px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-asset--tow{
    right:22px;
    bottom:98px;
    width:160px;
  }
}
@media (min-width:1024px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    width:min(1160px, calc(100vw - 56px));
    padding-left:48px;
    padding-right:48px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    grid-template-columns:minmax(390px,.95fr) minmax(500px,1.05fr);
    column-gap:52px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    max-width:610px;
    min-height:500px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1{
    max-width:520px;
    font-size:46px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{
    max-width:500px;
    font-size:21px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero{
    width:390px;
  }
}
@media (min-width:768px) and (max-height:760px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    min-height:calc(100dvh - 24px);
    padding-top:14px;
    padding-bottom:22px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    padding-top:16px;
    padding-bottom:18px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
    margin-bottom:24px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    min-height:360px;
    height:calc(100dvh - 178px);
  }
}


/* ONBOARDING-r32 — tablet/wide cleanup for first welcome screen after direct-cabinet flow. */
@media (min-width:768px) and (orientation:portrait){
  #onboarding-welcome-r1.onbw-overlay{
    align-items:center;
    justify-content:center;
    padding:24px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    width:min(860px, calc(100vw - 48px));
    min-height:min(1040px, calc(100dvh - 48px));
    padding:26px 42px 36px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    grid-template-columns:1fr;
    grid-template-areas:"brand" "title" "lead" "hero";
    align-content:start;
    justify-items:center;
    text-align:center;
    row-gap:0;
    padding-top:34px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{
    justify-content:center;
    margin:0 auto 28px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1,
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{
    text-align:center;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    width:min(100%, 640px);
    height:min(520px, calc(100dvh - 430px));
    min-height:430px;
    margin:34px auto 0;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-footer--hero{
    width:min(420px, 100%);
    margin:0 auto;
  }
}
@media (min-width:1200px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    width:min(1280px, calc(100vw - 80px));
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    grid-template-columns:minmax(430px,.9fr) minmax(560px,1.1fr);
    column-gap:72px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    max-width:690px;
  }
}
@media (min-width:768px) and (orientation:landscape) and (max-height:680px){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-screen--hero{
    min-height:calc(100dvh - 20px);
    padding-top:12px;
    padding-bottom:16px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    padding-top:8px;
    padding-bottom:10px;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-logo-lockup{margin-bottom:16px;}
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) h1{font-size:34px;margin-bottom:12px;}
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-lead{font-size:17px;}
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    min-height:300px;
    height:calc(100dvh - 150px);
  }
}

/* ONBOARDING-r32b — keep large portrait tablets readable, avoid accidental desktop split. */
@media (min-width:1200px) and (orientation:portrait){
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-content--hero{
    grid-template-columns:1fr;
    grid-template-areas:"brand" "title" "lead" "hero";
    column-gap:0;
  }
  #onboarding-welcome-r1:not(.onb2-benefits-overlay):not(.onb3-transparency-overlay) .onbw-hero{
    max-width:720px;
  }
}

/* === SOURCE: css/onboarding_r2_benefits.css === */
/* ONBOARDING-r2 — benefits screen: everything for the car. Scope: #onboarding-welcome-r1.onb2-benefits-overlay only. */
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-screen{
  background:linear-gradient(180deg,#fff 0%,#fff 68%,#f7f7f8 100%);
}
#onboarding-welcome-r1 .onb2-progress{
  height:4px;
  width:118px;
  margin:8px auto 0;
  border-radius:999px;
  background:#e8e8eb;
  overflow:hidden;
}
#onboarding-welcome-r1 .onb2-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
#onboarding-welcome-r1 .onb2-benefit-content{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:24px 0 10px;
  text-align:left;
}
#onboarding-welcome-r1 .onb2-benefit-content h1{
  margin:0 0 10px;
  max-width:310px;
  color:#111827;
  font-size:24px;
  line-height:1.06;
  letter-spacing:-.045em;
  font-weight:950;
}
#onboarding-welcome-r1 .onb2-benefit-content p{
  margin:0;
  max-width:318px;
  color:#374151;
  font-size:14px;
  line-height:1.45;
  font-weight:650;
}
#onboarding-welcome-r1 .onb2-benefit-art{
  position:relative;
  align-self:center;
  width:100%;
  height:330px;
  margin:22px 0 8px;
}
#onboarding-welcome-r1 .onb2-benefit-art::before{
  content:'';
  position:absolute;
  inset:38px 6px 0;
  border-radius:38px;
  background:linear-gradient(180deg,#fff8d6 0%,rgba(255,248,214,.35) 46%,rgba(255,255,255,0) 100%);
  filter:blur(.1px);
}
#onboarding-welcome-r1 .onb2-benefit-car{
  position:absolute;
  left:50%;
  bottom:14px;
  width:350px;
  max-width:104%;
  transform:translateX(-50%);
  z-index:3;
  filter:drop-shadow(0 18px 22px rgba(15,23,42,.16));
}
#onboarding-welcome-r1 .onb2-art-tool{
  position:absolute;
  z-index:4;
  width:54px;
  height:54px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(17,24,39,.07);
  box-shadow:0 14px 34px rgba(15,23,42,.11);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
}
#onboarding-welcome-r1 .onb2-art-tool--wrench{right:34px;top:18px;transform:rotate(-10deg);}
#onboarding-welcome-r1 .onb2-art-tool--oil{right:8px;top:112px;transform:rotate(7deg);}
#onboarding-welcome-r1 .onb2-art-tool--wheel{left:16px;top:128px;transform:rotate(-5deg);}
#onboarding-welcome-r1 .onb2-art-tool--tow{left:46px;top:38px;transform:rotate(6deg);}
#onboarding-welcome-r1 .onb2-benefit-chips{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin-top:2px;
}
#onboarding-welcome-r1 .onb2-benefit-chips span{
  min-height:30px;
  border-radius:999px;
  background:#f4f4f5;
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  font-size:10.5px;
  line-height:1;
  font-weight:850;
}
@media (max-width:360px){
  #onboarding-welcome-r1 .onb2-benefit-content h1{font-size:22px;}
  #onboarding-welcome-r1 .onb2-benefit-content p{font-size:13.5px;}
  #onboarding-welcome-r1 .onb2-benefit-art{height:306px;}
  #onboarding-welcome-r1 .onb2-art-tool{width:48px;height:48px;font-size:23px;border-radius:16px;}
  #onboarding-welcome-r1 .onb2-benefit-chips{gap:5px;}
  #onboarding-welcome-r1 .onb2-benefit-chips span{font-size:10px;padding:0 5px;}
}

/* ONBOARDING-r16 — screen 2 reference density and illustration polish. */
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-screen{background:#fff;}
#onboarding-welcome-r1 .onb2-progress{width:126px;height:4px;margin-top:9px;}
#onboarding-welcome-r1 .onb2-benefit-content{justify-content:flex-start;padding:42px 10px 8px;}
#onboarding-welcome-r1 .onb2-benefit-content h1{font-size:23px;line-height:1.08;margin-bottom:12px;}
#onboarding-welcome-r1 .onb2-benefit-content p{max-width:310px;font-size:13.2px;line-height:1.48;color:#2f3744;font-weight:700;}
#onboarding-welcome-r1 .onb2-benefit-art{height:390px;margin:28px -2px 6px;}
#onboarding-welcome-r1 .onb2-benefit-art::before{
  inset:34px 18px 8px;
  border-radius:44px;
  background:radial-gradient(circle at 50% 48%,rgba(255,196,0,.22),rgba(255,248,214,.34) 38%,rgba(255,255,255,0) 72%);
}
#onboarding-welcome-r1 .onb2-benefit-car{width:372px;bottom:28px;}
#onboarding-welcome-r1 .onb2-art-tool{color:#111827;width:58px;height:58px;border-radius:20px;background:#fff;}
#onboarding-welcome-r1 .onb2-art-tool svg{width:38px;height:38px;display:block;}
#onboarding-welcome-r1 .onb2-art-tool--wrench{right:42px;top:10px;}
#onboarding-welcome-r1 .onb2-art-tool--oil{right:8px;top:126px;}
#onboarding-welcome-r1 .onb2-art-tool--wheel{left:20px;top:172px;}
#onboarding-welcome-r1 .onb2-art-tool--tow{left:42px;top:78px;}
#onboarding-welcome-r1 .onb2-spark{position:absolute;width:7px;height:7px;border-radius:999px;background:#ffc400;box-shadow:0 0 0 4px rgba(255,196,0,.12);z-index:5;}
#onboarding-welcome-r1 .onb2-spark--one{left:112px;top:44px;}
#onboarding-welcome-r1 .onb2-spark--two{right:112px;top:86px;transform:scale(.68);}
#onboarding-welcome-r1 .onb2-spark--three{left:172px;bottom:92px;transform:scale(.58);}
#onboarding-welcome-r1 .onb2-benefit-chips{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:0;}
#onboarding-welcome-r1 .onb2-benefit-chips span{min-height:34px;border-radius:14px;background:#f6f6f7;font-size:11.5px;}
@media (max-width:360px){
  #onboarding-welcome-r1 .onb2-benefit-content{padding-top:32px;}
  #onboarding-welcome-r1 .onb2-benefit-art{height:346px;}
  #onboarding-welcome-r1 .onb2-benefit-car{width:332px;}
}

/* ONBOARDING-r17 — screen 2 uses supplied collage artwork from the user archive task. */
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-content{
  padding-top:36px;
}
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-art{
  height:418px;
  margin:24px -4px 8px;
  background:url('../assets/onboarding/benefits_reference_trimmed.png') center 12px / 92% auto no-repeat;
}
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-art::before{
  inset:18px 12px 8px;
  border-radius:46px;
  background:radial-gradient(circle at 50% 44%,rgba(255,196,0,.14),rgba(255,248,214,.26) 40%,rgba(255,255,255,.0) 78%);
}
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-art > *{
  display:none !important;
}
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-chips{
  margin-top:2px;
}
#onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-chips span{
  min-height:35px;
  border-radius:15px;
  font-size:11.5px;
  background:#f5f5f6;
}
@media (max-width:360px){
  #onboarding-welcome-r1.onb2-benefits-overlay .onb2-benefit-art{
    height:382px;
    background-size:94% auto;
    background-position:center 8px;
  }
}

/* === SOURCE: css/onboarding_r3_transparency.css === */
/* ONBOARDING-r3 — transparency/convenience screen.
   Scope: #onboarding-welcome-r1.onb3-transparency-overlay only. */
#onboarding-welcome-r1.onb3-transparency-overlay .onb3-transparency-screen{
  background:linear-gradient(180deg,#fff 0%,#fff 64%,#f7f7f8 100%);
}
#onboarding-welcome-r1 .onb3-transparency-content{
  justify-content:center;
  padding-top:22px;
}
#onboarding-welcome-r1 .onb3-trust-art{
  position:relative;
  width:100%;
  height:350px;
  margin:24px 0 10px;
}
#onboarding-welcome-r1 .onb3-trust-art::before{
  content:'';
  position:absolute;
  left:50%;
  top:18px;
  width:292px;
  height:292px;
  transform:translateX(-50%);
  border-radius:36px;
  background:linear-gradient(180deg,#fff8d6 0%,rgba(255,248,214,.28) 56%,rgba(255,255,255,0) 100%);
}
#onboarding-welcome-r1 .onb3-chat,
#onboarding-welcome-r1 .onb3-order-card{
  position:absolute;
  z-index:2;
  background:#fff;
  border:1px solid rgba(17,24,39,.07);
  box-shadow:0 16px 36px rgba(15,23,42,.10);
}
#onboarding-welcome-r1 .onb3-chat{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:10px;
  align-items:center;
  min-height:72px;
  border-radius:20px;
  padding:12px;
}
#onboarding-welcome-r1 .onb3-chat--left{
  left:12px;
  top:26px;
  width:212px;
}
#onboarding-welcome-r1 .onb3-chat--right{
  right:16px;
  top:104px;
  width:178px;
  grid-template-columns:1fr;
  min-height:62px;
  padding:13px 15px;
}
#onboarding-welcome-r1 .onb3-avatar{
  width:44px;
  height:44px;
  border-radius:999px;
  background:#f4f4f5;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:23px;
  overflow:hidden;
}
#onboarding-welcome-r1 .onb3-avatar--small{
  width:42px;
  height:42px;
  font-size:20px;
}
#onboarding-welcome-r1 .onb3-chat i,
#onboarding-welcome-r1 .onb3-chat b{
  display:block;
  border-radius:999px;
  background:#e5e7eb;
}
#onboarding-welcome-r1 .onb3-chat--left i{width:118px;height:11px;margin-bottom:8px;}
#onboarding-welcome-r1 .onb3-chat--left b{width:84px;height:10px;}
#onboarding-welcome-r1 .onb3-chat--right i{width:124px;height:11px;margin-bottom:8px;}
#onboarding-welcome-r1 .onb3-chat--right b{width:92px;height:10px;}
#onboarding-welcome-r1 .onb3-order-card{
  left:50%;
  bottom:24px;
  width:304px;
  transform:translateX(-50%);
  border-radius:22px;
  padding:14px;
}
#onboarding-welcome-r1 .onb3-order-top{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}
#onboarding-welcome-r1 .onb3-order-top strong,
#onboarding-welcome-r1 .onb3-order-top em{
  display:block;
}
#onboarding-welcome-r1 .onb3-order-top strong{
  color:#111827;
  font-size:13px;
  line-height:1.2;
  font-weight:950;
}
#onboarding-welcome-r1 .onb3-order-top em{
  margin-top:3px;
  color:#6b7280;
  font-size:10.5px;
  line-height:1.2;
  font-style:normal;
  font-weight:750;
}
#onboarding-welcome-r1 .onb3-order-top mark{
  border-radius:999px;
  background:#dcfce7;
  color:#15803d;
  padding:5px 8px;
  font-size:10px;
  line-height:1;
  font-weight:900;
}
#onboarding-welcome-r1 .onb3-progress-line{
  height:8px;
  border-radius:999px;
  background:#e5e7eb;
  overflow:hidden;
  margin:14px 0 10px;
}
#onboarding-welcome-r1 .onb3-progress-line span{
  display:block;
  height:100%;
  border-radius:999px;
  background:#22c55e;
}
#onboarding-welcome-r1 .onb3-stage-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#374151;
  font-size:11px;
  line-height:1.2;
}
#onboarding-welcome-r1 .onb3-stage-row span{color:#6b7280;font-weight:750;}
#onboarding-welcome-r1 .onb3-stage-row b{color:#111827;font-weight:900;}
#onboarding-welcome-r1 .onb3-feature-list{
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
}
#onboarding-welcome-r1 .onb3-feature-list span{
  min-height:34px;
  border-radius:14px;
  background:#f4f4f5;
  color:#111827;
  display:flex;
  align-items:center;
  padding:0 13px;
  font-size:12px;
  line-height:1.2;
  font-weight:850;
}
#onboarding-welcome-r1 .onb3-feature-list span::before{
  content:'✓';
  width:20px;
  height:20px;
  margin-right:8px;
  border-radius:999px;
  background:#ffc400;
  color:#111827;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:950;
}
@media (max-width:360px){
  #onboarding-welcome-r1 .onb3-trust-art{height:326px;margin-top:18px;}
  #onboarding-welcome-r1 .onb3-order-card{width:286px;bottom:18px;}
  #onboarding-welcome-r1 .onb3-chat--left{left:4px;width:202px;}
  #onboarding-welcome-r1 .onb3-chat--right{right:4px;width:166px;}
}

/* ONBOARDING-r16 — screen 3 reference density and trust cards. */
#onboarding-welcome-r1.onb3-transparency-overlay .onb3-transparency-screen{background:#fff;}
#onboarding-welcome-r1 .onb3-transparency-content{justify-content:flex-start;padding:42px 10px 8px;}
#onboarding-welcome-r1 .onb3-trust-art{height:386px;margin:26px -2px 8px;}
#onboarding-welcome-r1 .onb3-trust-art::before{
  top:12px;width:306px;height:322px;border-radius:44px;
  background:radial-gradient(circle at 50% 42%,rgba(255,196,0,.16),rgba(255,248,214,.30) 36%,rgba(255,255,255,0) 76%);
}
#onboarding-welcome-r1 .onb3-chat,
#onboarding-welcome-r1 .onb3-order-card{box-shadow:0 18px 42px rgba(15,23,42,.12);border-color:rgba(17,24,39,.06);}
#onboarding-welcome-r1 .onb3-chat--left{left:4px;top:30px;width:230px;}
#onboarding-welcome-r1 .onb3-chat--right{right:8px;top:116px;width:190px;}
#onboarding-welcome-r1 .onb3-master-bubble{position:absolute;z-index:4;width:50px;height:50px;border-radius:999px;background:#fff;display:flex;align-items:center;justify-content:center;border:1px solid rgba(17,24,39,.07);box-shadow:0 16px 30px rgba(15,23,42,.12);font-size:25px;}
#onboarding-welcome-r1 .onb3-master-bubble--right{right:28px;top:34px;}
#onboarding-welcome-r1 .onb3-order-card{width:316px;bottom:28px;border-radius:23px;padding:15px;}
#onboarding-welcome-r1 .onb3-progress-line span{background:#22c55e;}
#onboarding-welcome-r1 .onb3-stage-row span{color:#22c55e;letter-spacing:.06em;font-weight:950;}
#onboarding-welcome-r1 .onb3-feature-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
#onboarding-welcome-r1 .onb3-feature-list span{min-height:34px;border-radius:14px;font-size:10.5px;justify-content:center;text-align:center;padding:0 6px;}
#onboarding-welcome-r1 .onb3-feature-list span::before{display:none;}
@media (max-width:360px){
  #onboarding-welcome-r1 .onb3-transparency-content{padding-top:32px;}
  #onboarding-welcome-r1 .onb3-trust-art{height:348px;}
  #onboarding-welcome-r1 .onb3-order-card{width:290px;}
}

/* ONBOARDING-r17 — small trust-screen polish to sit closer to the reference density. */
#onboarding-welcome-r1.onb3-transparency-overlay .onb3-transparency-content{
  padding-top:38px;
}
#onboarding-welcome-r1.onb3-transparency-overlay .onb3-order-card{
  bottom:30px;
}
#onboarding-welcome-r1.onb3-transparency-overlay .onb3-feature-list span{
  background:#f5f5f6;
}

/* === SOURCE: css/onboarding_r4_role.css === */
/* ONBOARDING-r4 — app-style role selection screen.
   Scope: only the existing OnboardingV2 role step (#onb2-step-role).
   This is a visual/do-not-rewrite patch: it keeps existing role selection logic. */
#onb2-overlay:has(#onb2-step-role.active){
  background:#f7f7f8;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#onb2-step-role .onb2-modal{
  width:min(430px, 100%);
  margin:0 auto;
  min-height:100dvh;
  height:100dvh;
  background:#fff;
  color:#111827;
  border-left:1px solid rgba(17,24,39,.06);
  border-right:1px solid rgba(17,24,39,.06);
  box-shadow:0 22px 70px rgba(15,23,42,.12);
  overflow:hidden;
}
#onb2-step-role .onb2-modal-head{
  position:relative;
  padding:18px 16px 12px;
  border-bottom:0;
  background:#fff;
}
#onb2-step-role .onb2-modal-head::before{
  content:'9:41';
  display:block;
  height:18px;
  margin-bottom:9px;
  color:#111827;
  font-size:11px;
  line-height:18px;
  font-weight:850;
}
#onb2-step-role .onb2-modal-head::after{
  content:'';
  display:block;
  width:118px;
  height:4px;
  margin-top:13px;
  border-radius:999px;
  background:linear-gradient(90deg,#ffc400 0 52%,#ececef 52% 100%);
}
#onb2-step-role .onb2-headbar{
  display:none;
}
#onb2-step-role .onb2-modal-kicker{
  min-height:22px;
  padding:0 9px;
  border-radius:999px;
  background:#fff1c2;
  border:0;
  color:#f59e0b;
  font-size:10px;
  line-height:22px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#onb2-step-role .onb2-modal-title{
  margin-top:10px;
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:22px;
  line-height:1.12;
  font-weight:950;
  letter-spacing:-.04em;
}
#onb2-step-role .onb2-modal-sub{
  width:min(320px, 100%);
  margin-top:8px;
  color:#374151;
  font-size:13px;
  line-height:1.45;
  font-weight:650;
}
#onb2-step-role .onb2-modal-meta{
  display:none;
}
#onb2-step-role .onb2-routebar{
  display:none;
}
#onb2-step-role .onb2-modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:14px 16px 104px;
  background:linear-gradient(180deg,#fff 0%,#f8f8f9 100%);
}
#onb2-step-role .onb2-shell,
#onb2-step-role .onb2-shell--role{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
}
#onb2-step-role .onb2-roles{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
#onb2-step-role .onb2-role-card{
  min-height:86px;
  display:grid;
  grid-template-columns:58px minmax(0,1fr) 28px;
  align-items:center;
  gap:12px;
  padding:13px 14px;
  border-radius:18px;
  border:1px solid #e8e8ea;
  background:#fff;
  box-shadow:0 10px 26px rgba(15,23,42,.055);
  color:#111827;
}
#onb2-step-role .onb2-role-card.onb2-role--featured,
#onb2-step-role .onb2-role-card.is-selected{
  border-color:#ffc400;
  background:#fffdf4;
  box-shadow:0 12px 28px rgba(255,196,0,.14), 0 8px 20px rgba(15,23,42,.045);
}
#onb2-step-role .onb2-role-card::after{
  content:'';
  width:20px;
  height:20px;
  border-radius:999px;
  border:2px solid #d1d5db;
  grid-column:3;
  grid-row:1;
  align-self:center;
  justify-self:end;
  box-sizing:border-box;
}
#onb2-step-role .onb2-role-card.is-selected::after,
#onb2-step-role .onb2-role-card.onb2-role--featured::after{
  content:'✓';
  border-color:#ffc400;
  background:#ffc400;
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:950;
}
#onb2-step-role .onb2-role-badge{
  top:0;
  right:16px;
  min-height:20px;
  padding:0 8px;
  border-radius:0 0 8px 8px;
  background:#ffc400;
  color:#111827;
  font-size:8.5px;
  line-height:20px;
  font-weight:950;
  letter-spacing:.04em;
}
#onb2-step-role .onb2-role-top{
  display:contents;
}
#onb2-step-role .onb2-role-ico-wrap{
  grid-column:1;
  grid-row:1;
  width:58px;
  height:58px;
  border-radius:14px;
  background:#f4f4f5;
  border:1px solid #ececef;
  box-shadow:none;
}
#onb2-step-role .onb2-role-ico{
  font-size:30px;
  line-height:1;
  filter:grayscale(.2) contrast(1.04);
}
#onb2-step-role .onb2-role-main{
  grid-column:2;
  grid-row:1;
  gap:5px;
}
#onb2-step-role .onb2-role-name-row{
  display:block;
}
#onb2-step-role .onb2-role-name{
  color:#111827 !important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:16px;
  line-height:1.15;
  font-weight:950;
  letter-spacing:-.02em;
}
#onb2-step-role .onb2-role-arrow{
  display:none;
}
#onb2-step-role .onb2-role-desc{
  display:block;
  color:#6b7280;
  font-size:11.5px;
  line-height:1.32;
  font-weight:700;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
#onb2-step-role .onb2-role-features{
  display:none;
}
#onb2-step-role .onb2-role-card:active{
  transform:scale(.992);
}
#onb2-step-role .onb2-role-card:focus-visible{
  outline:2px solid #ffc400;
  outline-offset:2px;
}
#onb2-step-role::after{
  content:'Выберите роль, чтобы продолжить настройку профиля';
  position:absolute;
  left:50%;
  bottom:max(14px, env(safe-area-inset-bottom));
  width:min(398px, calc(100% - 32px));
  min-height:46px;
  transform:translateX(-50%);
  border-radius:14px;
  background:#ffc400;
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  text-align:center;
  font-size:13px;
  line-height:1.2;
  font-weight:950;
  box-shadow:0 16px 34px rgba(255,196,0,.24);
  pointer-events:none;
}
@media (min-width:768px){
  #onb2-step-role .onb2-modal{
    border-radius:28px;
    margin:20px auto;
    height:calc(100dvh - 40px);
    min-height:0;
  }
}
@media (max-width:360px){
  #onb2-step-role .onb2-modal-head{padding-left:13px;padding-right:13px;}
  #onb2-step-role .onb2-modal-body{padding-left:13px;padding-right:13px;}
  #onb2-step-role .onb2-role-card{grid-template-columns:52px minmax(0,1fr) 24px;padding:12px;}
  #onb2-step-role .onb2-role-ico-wrap{width:52px;height:52px;}
  #onb2-step-role .onb2-modal-title{font-size:21px;}
}


/* ONBOARDING-r18 — reference role screen: selectable cards + real continue CTA. */
#onb2-overlay:has(#onb2-step-role.active){
  background:#f4f4f5;
}
#onb2-step-role .onb2-modal{
  background:#fff;
}
#onb2-step-role .onb2-modal-head{
  padding:16px 16px 10px;
}
#onb2-step-role .onb2-modal-head::after{
  width:128px;
  margin-top:14px;
  background:linear-gradient(90deg,#ffc400 0 28%,#ececef 28% 100%);
}
#onb2-step-role .onb2-modal-kicker{
  display:none;
}
#onb2-step-role .onb2-modal-title{
  margin-top:26px;
  font-size:23px;
  line-height:1.08;
}
#onb2-step-role .onb2-modal-sub{
  margin-top:9px;
  max-width:315px;
  color:#2f3744;
  font-size:13px;
  line-height:1.45;
  font-weight:700;
}
#onb2-step-role .onb2-modal-body{
  padding:16px 16px 98px;
  background:#fff;
  overflow:auto;
}
#onb2-step-role .onb2-roles{
  gap:13px;
}
#onb2-step-role .onb2-role-card{
  position:relative;
  min-height:82px;
  grid-template-columns:54px minmax(0,1fr) 24px;
  gap:12px;
  padding:12px 13px;
  border-radius:16px;
  border:1px solid #e7e7ea;
  box-shadow:0 9px 22px rgba(15,23,42,.055);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease, transform .12s ease;
}
#onb2-step-role .onb2-role-card.onb2-role--featured,
#onb2-step-role .onb2-role-card.is-selected{
  border-color:#ffc400;
  background:#fffdf5;
  box-shadow:0 0 0 1px rgba(255,196,0,.18), 0 12px 26px rgba(255,196,0,.12), 0 8px 18px rgba(15,23,42,.04);
}
#onb2-step-role .onb2-role-card.onb2-role--featured:not(.is-selected){
  border-color:#e7e7ea;
  background:#fff;
  box-shadow:0 9px 22px rgba(15,23,42,.055);
}
#onb2-step-role .onb2-role-card.onb2-role--featured:not(.is-selected)::after{
  content:'';
  border-color:#d1d5db;
  background:#fff;
  color:transparent;
}
#onb2-step-role .onb2-role-badge{
  display:none;
}
#onb2-step-role .onb2-role-ico-wrap{
  width:54px;
  height:54px;
  border-radius:14px;
  background:#f6f6f7;
  border:1px solid #ededf0;
}
#onb2-step-role .onb2-role-card.is-selected .onb2-role-ico-wrap{
  background:#fff7d6;
  border-color:rgba(255,196,0,.42);
}
#onb2-step-role .onb2-role-ico{
  font-size:26px;
  filter:none;
}
#onb2-step-role .onb2-role-name{
  font-size:15.5px;
  line-height:1.14;
  letter-spacing:-.015em;
}
#onb2-step-role .onb2-role-desc{
  margin-top:5px;
  color:#5f6673;
  font-size:11.8px;
  line-height:1.25;
  font-weight:760;
  -webkit-line-clamp:1;
}
#onb2-step-role::after{
  display:none;
}
#onb2-step-role .onb2-role-footer{
  position:absolute;
  left:50%;
  bottom:0;
  z-index:8;
  width:min(430px,100%);
  transform:translateX(-50%);
  padding:12px 16px max(14px, env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.94) 18%,#fff 100%);
  box-sizing:border-box;
}
#onb2-step-role .onb2-role-continue{
  width:100%;
  min-height:50px;
  border:0;
  border-radius:12px;
  background:linear-gradient(180deg,#ffc400,#f4b400);
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:14px;
  line-height:1;
  font-weight:950;
  box-shadow:0 15px 30px rgba(255,196,0,.24);
}
#onb2-step-role .onb2-role-continue:active{
  transform:translateY(1px) scale(.995);
}
#onb2-step-role .onb2-role-continue:focus-visible{
  outline:2px solid #111827;
  outline-offset:2px;
}
@media (min-width:768px){
  #onb2-step-role .onb2-role-footer{
    bottom:20px;
    border-radius:0 0 28px 28px;
  }
}
@media (max-width:360px){
  #onb2-step-role .onb2-modal-title{font-size:21px;margin-top:20px;}
  #onb2-step-role .onb2-modal-body{padding-bottom:92px;}
  #onb2-step-role .onb2-role-card{min-height:76px;grid-template-columns:50px minmax(0,1fr) 22px;}
  #onb2-step-role .onb2-role-ico-wrap{width:50px;height:50px;}
  #onb2-step-role .onb2-role-name{font-size:14.5px;}
}


/* ONBOARDING-r21 — second screen from provided sketch/background.
   Scope: visual layer for #onb2-step-role only. Flow, API, role saving and next city step are unchanged. */
#onb2-overlay:has(#onb2-step-role.active){
  background:#f6f2ef;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#onb2-step-role .onb2-modal{
  width:min(430px,100%);
  max-width:430px;
  height:100dvh;
  min-height:100dvh;
  margin:0 auto;
  position:relative;
  background:#fff url('../assets/onboarding/role_choice_bg.png') center center / cover no-repeat;
  border:0;
  box-shadow:0 22px 70px rgba(15,23,42,.14);
  overflow:hidden;
}
#onb2-step-role .onb2-modal::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.04) 52%,rgba(255,255,255,0) 100%);
  pointer-events:none;
}
#onb2-step-role .onb2-modal-head{
  position:relative;
  z-index:2;
  padding:22px 32px 8px;
  background:transparent;
  border:0;
}
#onb2-step-role .onb2-modal-head::before{
  content:'9:41';
  height:22px;
  margin:0 0 58px;
  color:#111827;
  font-size:15px;
  line-height:22px;
  font-weight:900;
  letter-spacing:-.02em;
}
#onb2-step-role .onb2-modal-head::after{
  display:none;
}
#onb2-step-role .onb2-headbar{
  display:flex;
  justify-content:center;
  align-items:center;
  margin:0 auto 152px;
}
#onb2-step-role .onb2-brandbox{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:100%;
}
#onb2-step-role .onb2-brand-logo{
  display:block;
  width:min(100%, 360px);
  max-width:360px;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 8px 14px rgba(255,90,0,.08));
}
#onb2-step-role .onb2-brandmark,
#onb2-step-role .onb2-brandcopy,
#onb2-step-role .onb2-brandbox::after{
  display:none !important;
}
#onb2-step-role .onb2-modal-kicker,
#onb2-step-role .onb2-stepdots,
#onb2-step-role .onb2-modal-meta,
#onb2-step-role .onb2-routebar{
  display:none !important;
}
#onb2-step-role .onb2-modal-title{
  margin:0;
  max-width:330px;
  color:#24262b;
  font-size:28px;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.045em;
}
#onb2-step-role .onb2-modal-sub{
  margin-top:17px;
  max-width:330px;
  color:#5c5f66;
  font-size:21px;
  line-height:1.3;
  font-weight:650;
  letter-spacing:-.025em;
}
#onb2-step-role .onb2-modal-body{
  position:relative;
  z-index:3;
  padding:34px 32px 132px;
  background:transparent;
  overflow:auto;
  scrollbar-width:none;
}
#onb2-step-role .onb2-modal-body::-webkit-scrollbar{display:none;}
#onb2-step-role .onb2-roles{
  gap:18px;
}
#onb2-step-role .onb2-role-card{
  min-height:92px;
  grid-template-columns:64px minmax(0,1fr) 38px;
  gap:16px;
  padding:16px 18px;
  border-radius:14px;
  border:1px solid rgba(29,33,40,.16);
  background:rgba(255,255,255,.78);
  box-shadow:0 10px 24px rgba(20,24,32,.035);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
#onb2-step-role .onb2-role-card.onb2-role--featured:not(.is-selected){
  border-color:rgba(29,33,40,.16);
  background:rgba(255,255,255,.78);
  box-shadow:0 10px 24px rgba(20,24,32,.035);
}
#onb2-step-role .onb2-role-card.is-selected,
#onb2-step-role .onb2-role-card.onb2-role--featured.is-selected,
#onb2-step-role .onb2-role-card.onb2-role--featured{
  border-color:#ff5a00;
  background:rgba(255,255,255,.86);
  box-shadow:0 12px 26px rgba(255,90,0,.08),0 0 0 1px rgba(255,90,0,.22);
}
#onb2-step-role .onb2-role-card::after,
#onb2-step-role .onb2-role-card.onb2-role--featured:not(.is-selected)::after{
  content:'';
  width:0;
  height:0;
  border:0;
  background:transparent;
}
#onb2-step-role .onb2-role-card.is-selected::after,
#onb2-step-role .onb2-role-card.onb2-role--featured::after{
  content:'✓';
  width:34px;
  height:34px;
  border:0;
  border-radius:999px;
  background:#ff5a00;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:23px;
  font-weight:950;
  line-height:1;
}
#onb2-step-role .onb2-role-ico-wrap{
  width:62px;
  height:62px;
  border-radius:12px;
  background:transparent;
  border:0;
  box-shadow:none;
}
#onb2-step-role .onb2-role-card.is-selected .onb2-role-ico-wrap{
  background:transparent;
  border:0;
}
#onb2-step-role .onb2-role-ico{
  display:flex;
  align-items:center;
  justify-content:center;
  width:62px;
  height:62px;
  font-size:0;
  filter:none;
}
#onb2-step-role .onb2-role-svg{
  width:58px;
  height:58px;
  display:block;
}
#onb2-step-role .onb2-role-name{
  color:#24262b !important;
  font-size:21px;
  line-height:1.13;
  font-weight:950;
  letter-spacing:-.025em;
}
#onb2-step-role .onb2-role-desc{
  margin-top:9px;
  color:#5c5f66;
  font-size:17px;
  line-height:1.18;
  font-weight:600;
  letter-spacing:-.02em;
  -webkit-line-clamp:1;
}
#onb2-step-role .onb2-role-footer{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:42px;
  width:min(366px,calc(100% - 64px));
  transform:translateX(-50%);
  padding:0;
  background:transparent;
}
#onb2-step-role .onb2-role-continue{
  min-height:64px;
  border-radius:14px;
  background:linear-gradient(180deg,#ff6908 0%,#ff5200 100%);
  color:#fff;
  font-size:22px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.02em;
  box-shadow:0 16px 30px rgba(255,82,0,.26);
}
#onb2-step-role .onb2-role-continue:focus-visible{
  outline:2px solid #24262b;
  outline-offset:3px;
}
@media (min-width:768px){
  #onb2-step-role .onb2-modal{
    height:calc(100dvh - 32px);
    min-height:0;
    margin:16px auto;
    border-radius:30px;
  }
  #onb2-step-role .onb2-role-footer{
    bottom:42px;
    border-radius:0;
  }
}
@media (max-width:390px){
  #onb2-step-role .onb2-modal-head{padding-left:28px;padding-right:28px;}
  #onb2-step-role .onb2-modal-body{padding-left:28px;padding-right:28px;}
  #onb2-step-role .onb2-headbar{margin-bottom:132px;}
  #onb2-step-role .onb2-brandtext{font-size:26px;}
  #onb2-step-role .onb2-brandsub{font-size:14px;}
  #onb2-step-role .onb2-modal-title{font-size:26px;}
  #onb2-step-role .onb2-modal-sub{font-size:19px;}
  #onb2-step-role .onb2-role-card{min-height:86px;grid-template-columns:58px minmax(0,1fr) 34px;padding:14px 15px;}
  #onb2-step-role .onb2-role-ico,#onb2-step-role .onb2-role-ico-wrap{width:56px;height:56px;}
  #onb2-step-role .onb2-role-svg{width:54px;height:54px;}
  #onb2-step-role .onb2-role-name{font-size:19px;}
  #onb2-step-role .onb2-role-desc{font-size:15.5px;}
  #onb2-step-role .onb2-role-footer{width:calc(100% - 56px);bottom:34px;}
}
@media (max-height:760px){
  #onb2-step-role .onb2-modal-head::before{margin-bottom:38px;}
  #onb2-step-role .onb2-headbar{margin-bottom:92px;}
  #onb2-step-role .onb2-modal-body{padding-top:22px;padding-bottom:112px;}
  #onb2-step-role .onb2-role-card{min-height:80px;}
  #onb2-step-role .onb2-role-footer{bottom:24px;}
  #onb2-step-role .onb2-role-continue{min-height:58px;}
}


@media (max-width:420px){
  #onb2-step-role .onb2-brand-logo{
    width:min(100%, 330px);
    max-width:330px;
  }
}


/* ONBOARDING-r24 — role screen aligned to new reference. Scope: #onb2-step-role only. */
#onb2-overlay:has(#onb2-step-role.active){
  background:linear-gradient(180deg,#f6f6f7 0%,#ececec 100%);
}
#onb2-step-role{
  position:relative;
}
#onb2-step-role::after{
  display:none !important;
}
#onb2-step-role .onb2-modal{
  position:relative;
  width:min(430px,100%);
  min-height:100dvh;
  background:linear-gradient(180deg,#f7f7f8 0%,#efefef 100%);
  box-shadow:0 18px 60px rgba(20,24,32,.12);
}
#onb2-step-role .onb2-modal::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 24%, rgba(255,255,255,.9), rgba(255,255,255,0) 42%), linear-gradient(90deg, rgba(0,0,0,.02), rgba(255,255,255,.06) 20%, rgba(0,0,0,.02) 50%, rgba(255,255,255,.06) 80%, rgba(0,0,0,.02));
  pointer-events:none;
}
#onb2-step-role .onb2-modal-head,
#onb2-step-role .onb2-modal-body,
#onb2-step-role .onb2-role-privacy{
  position:relative;
  z-index:1;
}
#onb2-step-role .onb2-modal-head{
  padding:36px 20px 10px;
  text-align:center;
  background:transparent;
}
#onb2-step-role .onb2-modal-head::before{
  content:'9:41';
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 0 34px;
  height:auto;
  color:#0f1720;
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.03em;
}
#onb2-step-role .onb2-modal-head::after,
#onb2-step-role .onb2-modal-kicker,
#onb2-step-role .onb2-stepdots,
#onb2-step-role .onb2-modal-meta,
#onb2-step-role .onb2-routebar,
#onb2-step-role .onb2-role-footer,
#onb2-step-role .onb2-role-features,
#onb2-step-role .onb2-role-arrow,
#onb2-step-role .onb2-role-badge{
  display:none !important;
}
#onb2-step-role .onb2-headbar{
  display:flex;
  justify-content:center;
  align-items:center;
  margin:0 auto 54px;
}
#onb2-step-role .onb2-brandbox{
  width:100%;
  justify-content:center;
}
#onb2-step-role .onb2-brand-logo{
  width:min(100%, 328px);
  max-width:328px;
  filter:drop-shadow(0 8px 14px rgba(255,90,0,.08));
}
#onb2-step-role .onb2-modal-title{
  margin:0;
  color:#08111a;
  font-size:34px;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.05em;
}
#onb2-step-role .onb2-modal-sub{
  margin:16px auto 0;
  max-width:92%;
  color:#666b73;
  font-size:18px;
  line-height:1.35;
  font-weight:500;
  letter-spacing:-.02em;
}
#onb2-step-role .onb2-modal-body{
  padding:42px 20px 26px;
  background:transparent;
  overflow:auto;
}
#onb2-step-role .onb2-roles{
  gap:18px;
}
#onb2-step-role .onb2-role-card{
  min-height:132px;
  display:grid;
  grid-template-columns:88px minmax(0,1fr) 26px;
  align-items:center;
  gap:18px;
  padding:18px 18px 18px 20px;
  border-radius:24px;
  border:1px solid rgba(15,23,42,.05);
  background:rgba(255,255,255,.83);
  box-shadow:0 10px 28px rgba(17,24,39,.09), inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  color:#0c131b;
  text-align:left;
}
#onb2-step-role .onb2-role-card:hover,
#onb2-step-role .onb2-role-card:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(255,106,0,.18);
  box-shadow:0 14px 30px rgba(17,24,39,.10), 0 0 0 1px rgba(255,106,0,.12);
}
#onb2-step-role .onb2-role-card.is-selected{
  border-color:rgba(255,106,0,.18);
  box-shadow:0 14px 30px rgba(17,24,39,.10), 0 0 0 1px rgba(255,106,0,.12);
  background:rgba(255,255,255,.88);
}
#onb2-step-role .onb2-role-card::after{
  display:none !important;
}
#onb2-step-role .onb2-role-top{
  display:contents;
}
#onb2-step-role .onb2-role-ico-wrap{
  width:88px;
  height:88px;
  border-radius:20px;
  background:transparent;
  border:0;
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
#onb2-step-role .onb2-role-ico{
  width:78px;
  height:78px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#ff6a00;
}
#onb2-step-role .onb2-role-svg{
  width:74px;
  height:74px;
  display:block;
}
#onb2-step-role .onb2-role-main{
  display:grid;
  gap:10px;
  min-width:0;
}
#onb2-step-role .onb2-role-name-row{
  display:block;
}
#onb2-step-role .onb2-role-name{
  color:#101821;
  font-size:27px;
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.035em;
}
#onb2-step-role .onb2-role-desc{
  color:#5e646d;
  font-size:17px;
  line-height:1.42;
  font-weight:500;
  letter-spacing:-.015em;
}
#onb2-step-role .onb2-role-chevron{
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  color:#2e333a;
  font-size:46px;
  line-height:1;
  font-weight:300;
}
#onb2-step-role .onb2-role-privacy{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:28px 0 10px;
  padding:10px 12px 0;
  color:#6a7078;
  font-size:14px;
  line-height:1.35;
  font-weight:500;
  text-align:center;
}
#onb2-step-role .onb2-role-privacy-ico{
  font-size:16px;
  line-height:1;
  transform:translateY(-1px);
}
@media (max-width:420px){
  #onb2-step-role .onb2-modal-head{padding-left:18px;padding-right:18px;padding-top:28px;}
  #onb2-step-role .onb2-headbar{margin-bottom:46px;}
  #onb2-step-role .onb2-brand-logo{width:min(100%, 286px);max-width:286px;}
  #onb2-step-role .onb2-modal-title{font-size:28px;}
  #onb2-step-role .onb2-modal-sub{font-size:15px;margin-top:14px;}
  #onb2-step-role .onb2-modal-body{padding:34px 16px 24px;}
  #onb2-step-role .onb2-roles{gap:14px;}
  #onb2-step-role .onb2-role-card{min-height:116px;grid-template-columns:72px minmax(0,1fr) 22px;gap:14px;padding:15px 16px; border-radius:20px;}
  #onb2-step-role .onb2-role-ico-wrap{width:72px;height:72px;}
  #onb2-step-role .onb2-role-ico{width:64px;height:64px;}
  #onb2-step-role .onb2-role-svg{width:60px;height:60px;}
  #onb2-step-role .onb2-role-name{font-size:24px;}
  #onb2-step-role .onb2-role-desc{font-size:14px;}
  #onb2-step-role .onb2-role-chevron{font-size:38px;}
  #onb2-step-role .onb2-role-privacy{margin-top:22px;font-size:12.5px;}
}

/* ONBOARDING-r25 — wide/tablet optimization for role selection screen. */
@media (min-width:768px){
  #onb2-overlay:has(#onb2-step-role.active){
    display:grid;
    place-items:center;
    padding:18px;
    background:radial-gradient(circle at 50% 15%, rgba(255,255,255,.96), rgba(241,241,242,.98) 56%, #e9eaec 100%);
  }
  #onb2-step-role .onb2-modal{
    width:min(960px, calc(100vw - 40px));
    max-width:960px;
    min-height:min(780px, calc(100dvh - 36px));
    height:auto;
    border-radius:34px;
    box-shadow:0 24px 80px rgba(15,23,42,.16);
  }
  #onb2-step-role .onb2-modal-head{
    padding:34px 48px 12px;
    text-align:center;
  }
  #onb2-step-role .onb2-modal-head::before{
    margin-bottom:32px;
    font-size:13px;
  }
  #onb2-step-role .onb2-headbar{
    margin-bottom:48px;
  }
  #onb2-step-role .onb2-brand-logo{
    width:min(100%, 390px);
    max-width:390px;
  }
  #onb2-step-role .onb2-modal-title{
    font-size:42px;
    line-height:1.05;
  }
  #onb2-step-role .onb2-modal-sub{
    margin-top:16px;
    max-width:720px;
    font-size:22px;
  }
  #onb2-step-role .onb2-modal-body{
    padding:52px 48px 18px;
    overflow:visible;
  }
  #onb2-step-role .onb2-roles{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:22px;
  }
  #onb2-step-role .onb2-role-card{
    min-height:258px;
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr auto;
    justify-items:center;
    align-items:center;
    gap:14px;
    padding:28px 22px 24px;
    border-radius:28px;
    text-align:center;
  }
  #onb2-step-role .onb2-role-ico-wrap{
    width:96px;
    height:96px;
  }
  #onb2-step-role .onb2-role-ico{
    width:88px;
    height:88px;
  }
  #onb2-step-role .onb2-role-svg{
    width:84px;
    height:84px;
  }
  #onb2-step-role .onb2-role-main{
    justify-items:center;
    gap:12px;
  }
  #onb2-step-role .onb2-role-name{
    font-size:28px;
  }
  #onb2-step-role .onb2-role-desc{
    max-width:240px;
    font-size:17px;
    line-height:1.35;
  }
  #onb2-step-role .onb2-role-chevron{
    width:42px;
    height:42px;
    border-radius:999px;
    background:rgba(255,106,0,.08);
    color:#ff5a00;
    font-size:38px;
    line-height:.8;
  }
  #onb2-step-role .onb2-role-privacy{
    margin:34px 0 28px;
    font-size:15px;
  }
}
@media (min-width:1024px){
  #onb2-step-role .onb2-modal{
    width:min(1120px, calc(100vw - 56px));
    max-width:1120px;
  }
  #onb2-step-role .onb2-modal-head{
    padding-left:64px;
    padding-right:64px;
  }
  #onb2-step-role .onb2-modal-body{
    padding-left:64px;
    padding-right:64px;
  }
  #onb2-step-role .onb2-role-card{
    min-height:276px;
    padding:32px 28px 26px;
  }
}
@media (min-width:768px) and (max-width:900px){
  #onb2-step-role .onb2-modal{
    width:min(820px, calc(100vw - 28px));
  }
  #onb2-step-role .onb2-modal-head{
    padding-left:34px;
    padding-right:34px;
  }
  #onb2-step-role .onb2-modal-body{
    padding-left:34px;
    padding-right:34px;
  }
  #onb2-step-role .onb2-role-card{
    min-height:236px;
    padding-left:18px;
    padding-right:18px;
  }
  #onb2-step-role .onb2-role-name{
    font-size:24px;
  }
  #onb2-step-role .onb2-role-desc{
    font-size:15px;
  }
}
@media (min-width:768px) and (max-height:760px){
  #onb2-step-role .onb2-modal{
    min-height:calc(100dvh - 24px);
  }
  #onb2-step-role .onb2-modal-head{
    padding-top:20px;
  }
  #onb2-step-role .onb2-modal-head::before{
    margin-bottom:18px;
  }
  #onb2-step-role .onb2-headbar{
    margin-bottom:28px;
  }
  #onb2-step-role .onb2-modal-body{
    padding-top:28px;
  }
  #onb2-step-role .onb2-role-card{
    min-height:214px;
  }
  #onb2-step-role .onb2-role-privacy{
    margin-top:20px;
    margin-bottom:18px;
  }
}


/* ONBOARDING-r32 — tablet/wide cleanup for role screen, actual flow only. */
@media (min-width:768px) and (orientation:portrait){
  #onb2-overlay:has(#onb2-step-role.active){
    padding:24px;
  }
  #onb2-step-role .onb2-modal{
    width:min(860px, calc(100vw - 48px));
    min-height:min(1040px, calc(100dvh - 48px));
    display:flex;
    flex-direction:column;
  }
  #onb2-step-role .onb2-modal-head{
    padding-top:34px;
    padding-bottom:8px;
  }
  #onb2-step-role .onb2-modal-body{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    padding-top:38px;
    padding-bottom:26px;
  }
  #onb2-step-role .onb2-shell--role{width:100%;}
  #onb2-step-role .onb2-roles{
    grid-template-columns:1fr;
    max-width:640px;
    margin:0 auto;
  }
  #onb2-step-role .onb2-role-card{
    min-height:132px;
    grid-template-columns:92px minmax(0,1fr) 34px;
    justify-items:stretch;
    text-align:left;
  }
  #onb2-step-role .onb2-role-main{justify-items:start;}
  #onb2-step-role .onb2-role-desc{max-width:440px;}
}
@media (min-width:1200px){
  #onb2-step-role .onb2-modal{
    width:min(1280px, calc(100vw - 80px));
    max-width:1280px;
  }
  #onb2-step-role .onb2-roles{
    gap:28px;
  }
  #onb2-step-role .onb2-role-card{
    min-height:292px;
  }
}
@media (min-width:768px) and (orientation:landscape) and (max-height:680px){
  #onb2-step-role .onb2-modal{
    min-height:calc(100dvh - 20px);
  }
  #onb2-step-role .onb2-modal-head{
    padding-top:14px;
  }
  #onb2-step-role .onb2-modal-head::before{margin-bottom:12px;}
  #onb2-step-role .onb2-headbar{margin-bottom:16px;}
  #onb2-step-role .onb2-brand-logo{max-width:300px;}
  #onb2-step-role .onb2-modal-title{font-size:30px;}
  #onb2-step-role .onb2-modal-sub{font-size:16px;}
  #onb2-step-role .onb2-modal-body{padding-top:18px;padding-bottom:8px;}
  #onb2-step-role .onb2-role-card{min-height:172px;padding:20px 18px 18px;}
  #onb2-step-role .onb2-role-ico-wrap{width:74px;height:74px;}
  #onb2-step-role .onb2-role-ico{width:68px;height:68px;}
  #onb2-step-role .onb2-role-svg{width:64px;height:64px;}
  #onb2-step-role .onb2-role-name{font-size:23px;}
  #onb2-step-role .onb2-role-desc{font-size:14px;}
  #onb2-step-role .onb2-role-privacy{margin-top:12px;margin-bottom:12px;}
}

/* === SOURCE: css/onboarding_r5_city.css === */

/* ONBOARDING-r5 — city select app-style.
   Scope: OnboardingV2 city step only. No page/API/DB changes.
*/
#onb2-overlay[data-step="city"] .onb2-modal--city-r5{
  background:#fff;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-body{
  padding-top:10px;
}
.onb2-city-r5{
  width:min(390px, 100%);
  margin:0 auto;
  display:grid;
  gap:12px;
}
.onb2-city-r5-search{
  position:relative;
}
.onb2-city-r5-search input{
  width:100%;
  min-height:44px;
  border:1px solid #ececef;
  border-radius:14px;
  background:#fff;
  color:#111;
  outline:none;
  padding:0 42px;
  font-size:14px;
  font-weight:700;
  box-shadow:0 6px 18px rgba(15,23,42,.035);
}
.onb2-city-r5-search input::placeholder{
  color:#a1a1aa;
}
.onb2-city-r5-search-ico{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#9ca3af;
  font-size:18px;
  pointer-events:none;
}
.onb2-ip-suggest--r5{
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:10px 12px;
  border:1px solid rgba(255,184,0,.35);
  border-radius:14px;
  background:#fff8dc;
  color:#111;
  box-shadow:none;
}
.onb2-ip-suggest--r5 .onb2-ip-suggest-text,
.onb2-ip-suggest--r5 .onb2-ip-city-label{
  font-size:12px;
  font-weight:850;
}
.onb2-ip-suggest--r5 .onb2-ip-confirm{
  min-height:30px;
  border:0;
  border-radius:10px;
  background:#ffc400;
  color:#111;
  padding:0 10px;
  font-size:12px;
  font-weight:950;
}
.onb2-city-r5-list{
  overflow:visible;
}
.onb2-city-track--list{
  display:grid;
  gap:0;
  transform:none !important;
  border:1px solid #ececef;
  border-radius:18px;
  overflow:hidden;
  background:#fff;
}
.onb2-city-track--list .onb2-city-slide{
  width:100%;
  min-height:54px;
  border:0;
  border-bottom:1px solid #f0f0f2;
  border-radius:0;
  background:#fff;
  color:#111;
  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:10px;
  padding:0 14px;
  text-align:left;
  box-shadow:none;
  transform:none !important;
}
.onb2-city-track--list .onb2-city-slide:last-child{
  border-bottom:0;
}
.onb2-city-track--list .onb2-city-slide::after{
  content:'';
  width:18px;
  height:18px;
  border-radius:999px;
  border:2px solid #d4d4d8;
  background:#fff;
}
.onb2-city-track--list .onb2-city-slide.is-active::after{
  border-color:#ffc400;
  box-shadow:inset 0 0 0 4px #fff;
  background:#ffc400;
}
.onb2-city-track--list .onb2-city-slide.is-active{
  background:#fffdf3;
}
.onb2-city-radio{
  width:16px;
  height:16px;
  border-radius:999px;
  background:#ffc400;
  box-shadow:0 0 0 5px rgba(255,196,0,.13);
}
.onb2-city-track--list .onb2-city-slide-title{
  font-size:14px;
  line-height:1.2;
  font-weight:850;
  color:#111;
}
.onb2-city-r5-other{
  width:100%;
  min-height:44px;
  border:1px solid #ececef;
  border-radius:14px;
  background:#fff;
  color:#333;
  font-size:13px;
  font-weight:850;
}
.onb2-city-r5-note{
  min-height:14px;
  color:#71717a;
  font-size:11px;
  font-weight:800;
  text-align:center;
}
.onb2-city-r5-note.is-warning{
  color:#ef4444;
}
.onb2-brand-r5{
  margin-top:2px;
}
#onb2-overlay[data-step="city"] .onb2-brand-track{
  gap:8px;
}
#onb2-overlay[data-step="city"] .onb2-brand-slide{
  min-width:82px;
  min-height:42px;
  border-radius:12px;
  box-shadow:none;
}
@media (max-width:420px){
  .onb2-city-r5{
    width:100%;
  }
  #onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-body{
    padding-left:14px;
    padding-right:14px;
  }
  .onb2-city-track--list .onb2-city-slide{
    min-height:52px;
  }
}

/* ONBOARDING-r19 — reference city selection screen. Scope: city step only. */
#onb2-overlay[data-step="city"]{
  background:#f4f4f5;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5{
  width:min(430px,100%);
  min-height:100dvh;
  height:100dvh;
  margin:0 auto;
  background:#fff;
  color:#111827;
  border-left:1px solid rgba(17,24,39,.06);
  border-right:1px solid rgba(17,24,39,.06);
  box-shadow:0 22px 70px rgba(15,23,42,.12);
  overflow:hidden;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-head{
  position:relative;
  padding:16px 16px 10px;
  border-bottom:0;
  background:#fff;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-head::before{
  content:'9:41';
  display:block;
  height:18px;
  margin-bottom:9px;
  color:#111827;
  font-size:11px;
  line-height:18px;
  font-weight:850;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-head::after{
  content:'';
  display:block;
  width:128px;
  height:4px;
  margin-top:14px;
  border-radius:999px;
  background:linear-gradient(90deg,#ffc400 0 36%,#ececef 36% 100%);
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-headbar,
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-kicker,
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-role-ico,
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-meta,
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-stepdots{
  display:none;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-title{
  margin:26px 0 0;
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:23px;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.04em;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-sub{
  max-width:320px;
  margin-top:9px;
  color:#2f3744;
  font-size:13px;
  line-height:1.45;
  font-weight:700;
}
#onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-body{
  flex:1 1 auto;
  min-height:0;
  padding:16px 16px 104px;
  overflow:auto;
  background:#fff;
}
#onb2-overlay[data-step="city"] .onb2-city-r5{
  width:100%;
  gap:12px;
}
#onb2-overlay[data-step="city"] .onb2-city-r5-search input{
  min-height:46px;
  border-color:#e8e8ea;
  border-radius:13px;
  background:#fff;
  padding-left:44px;
  color:#111827;
  font-size:13px;
  font-weight:760;
  box-shadow:0 8px 20px rgba(15,23,42,.04);
}
#onb2-overlay[data-step="city"] .onb2-city-r5-search-ico{
  left:15px;
  color:#8a8f99;
  font-size:17px;
}
#onb2-overlay[data-step="city"] .onb2-ip-suggest--r5{
  min-height:44px;
  border-color:rgba(255,196,0,.42);
  border-radius:14px;
  background:#fff9dc;
}
#onb2-overlay[data-step="city"] .onb2-city-track--list{
  border-color:#e8e8ea;
  border-radius:18px;
  box-shadow:0 12px 28px rgba(15,23,42,.045);
}
#onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide{
  min-height:54px;
  grid-template-columns:22px 1fr auto;
  gap:12px;
  padding:0 15px;
  border-bottom-color:#f0f0f2;
  background:#fff;
}
#onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide.is-active{
  background:#fffdf5;
}
#onb2-overlay[data-step="city"] .onb2-city-radio{
  width:12px;
  height:12px;
  border-radius:999px;
  background:#ffc400;
  box-shadow:0 0 0 5px rgba(255,196,0,.12);
  opacity:0;
}
#onb2-overlay[data-step="city"] .onb2-city-slide.is-active .onb2-city-radio{
  opacity:1;
}
#onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide::after{
  width:18px;
  height:18px;
  border:2px solid #d4d4d8;
}
#onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide.is-active::after{
  border-color:#ffc400;
  background:#ffc400;
  box-shadow:inset 0 0 0 4px #fff;
}
#onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide-title{
  color:#111827;
  font-size:14px;
  line-height:1.2;
  font-weight:900;
}
#onb2-overlay[data-step="city"] .onb2-city-r5-other{
  min-height:46px;
  border-color:#e8e8ea;
  border-radius:13px;
  background:#fff;
  color:#333842;
  font-size:12.5px;
  font-weight:900;
  box-shadow:0 8px 20px rgba(15,23,42,.035);
}
#onb2-overlay[data-step="city"] .onb2-city-r5-note{
  min-height:16px;
  color:#71717a;
  font-size:11px;
  font-weight:800;
}
#onb2-overlay[data-step="city"] .onb2-brand-r5{
  display:none;
}
#onb2-overlay[data-step="city"] .onb2-modal-foot{
  position:absolute;
  left:50%;
  bottom:0;
  z-index:8;
  width:min(430px,100%);
  transform:translateX(-50%);
  padding:12px 16px max(14px, env(safe-area-inset-bottom));
  border-top:0;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.94) 18%,#fff 100%);
  box-sizing:border-box;
}
#onb2-overlay[data-step="city"] .onb2-foot-shell{
  gap:10px;
}
#onb2-overlay[data-step="city"] .onb2-back-btn{
  width:50px;
  min-width:50px;
  height:50px;
  border:1px solid #e8e8ea;
  border-radius:12px;
  background:#fff;
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:24px;
  box-shadow:0 8px 20px rgba(15,23,42,.045);
}
#onb2-overlay[data-step="city"] .onb2-continue-btn{
  min-height:50px;
  border:0;
  border-radius:12px;
  background:linear-gradient(180deg,#ffc400,#f4b400);
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:14px;
  line-height:1;
  font-weight:950;
  letter-spacing:0;
  text-transform:none;
  box-shadow:0 15px 30px rgba(255,196,0,.24);
}
@media (min-width:768px){
  #onb2-overlay[data-step="city"] .onb2-modal--city-r5{
    min-height:0;
    height:calc(100dvh - 40px);
    margin:20px auto;
    border-radius:28px;
  }
  #onb2-overlay[data-step="city"] .onb2-modal-foot{
    bottom:20px;
    border-radius:0 0 28px 28px;
  }
}
@media (max-width:360px){
  #onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-head,
  #onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-body{
    padding-left:13px;
    padding-right:13px;
  }
  #onb2-overlay[data-step="city"] .onb2-modal--city-r5 .onb2-modal-title{
    font-size:21px;
    margin-top:20px;
  }
  #onb2-overlay[data-step="city"] .onb2-city-track--list .onb2-city-slide{
    min-height:51px;
  }
}

/* === SOURCE: css/onboarding_r6_city_search.css === */
/* ONBOARDING-r6 — separate city search screen.
   Scope: only OnboardingV2 city-search step.
   Does not change auth, roles, API, DB or existing public pages.
*/
.onb2-modal--city-search-r6 .onb2-modal-body{
  padding-top:8px;
}
.onb2-city-search-r6{
  display:grid;
  gap:12px;
}
.onb2-city-r6-input-wrap{
  position:relative;
}
.onb2-city-r6-search-ico{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#9ca3af;
  font-size:18px;
  line-height:1;
  pointer-events:none;
}
#onb2-city-search-r6-input,
#onb2-city-search-r6-custom{
  width:100%;
  min-height:46px;
  border:1px solid rgba(17,24,39,.08);
  border-radius:16px;
  background:#f5f5f6;
  color:#111827;
  padding:0 14px;
  font-size:14px;
  font-weight:750;
  outline:none;
}
#onb2-city-search-r6-input{
  padding-left:40px;
}
#onb2-city-search-r6-input::placeholder,
#onb2-city-search-r6-custom::placeholder{
  color:#9ca3af;
}
.onb2-city-r6-selected{
  min-height:36px;
  display:flex;
  align-items:center;
  padding:8px 12px;
  border-radius:14px;
  background:#fff7d1;
  color:#6b4b00;
  border:1px solid rgba(255,196,0,.42);
  font-size:12px;
  line-height:1.25;
  font-weight:900;
}
.onb2-city-r6-list{
  display:grid;
  gap:8px;
  max-height:min(36dvh, 260px);
  overflow:auto;
  padding:2px 2px 4px;
  scrollbar-width:none;
}
.onb2-city-r6-list::-webkit-scrollbar{
  display:none;
}
.onb2-city-r6-option{
  width:100%;
  min-height:58px;
  border:1px solid #ececef;
  border-radius:16px;
  background:#fff;
  color:#111827;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 24px;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  text-align:left;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
}
.onb2-city-r6-option[hidden]{
  display:none !important;
}
.onb2-city-r6-option-ico{
  width:38px;
  height:38px;
  border-radius:14px;
  background:#f4f4f5;
  display:grid;
  place-items:center;
  font-size:18px;
}
.onb2-city-r6-option-main{
  min-width:0;
  display:grid;
  gap:2px;
}
.onb2-city-r6-option-main b{
  color:#111827;
  font-size:14px;
  line-height:1.15;
  font-weight:950;
}
.onb2-city-r6-option-main small{
  color:#71717a;
  font-size:11px;
  line-height:1.2;
  font-weight:800;
}
.onb2-city-r6-option-check{
  width:24px;
  height:24px;
  border-radius:999px;
  background:#f4f4f5;
  color:transparent;
  display:grid;
  place-items:center;
  font-size:13px;
  font-weight:950;
}
.onb2-city-r6-option.is-selected{
  border-color:#ffc400;
  background:linear-gradient(180deg,#fffaf0,#fff);
}
.onb2-city-r6-option.is-selected .onb2-city-r6-option-check{
  background:#ffc400;
  color:#111827;
}
.onb2-city-r6-custom{
  display:grid;
  gap:8px;
  padding:12px;
  border-radius:18px;
  background:#fafafa;
  border:1px solid #ececef;
}
.onb2-city-r6-label{
  color:#242424;
  font-size:12px;
  line-height:1.2;
  font-weight:900;
}
.onb2-city-r6-custom-btn{
  min-height:42px;
  border:0;
  border-radius:14px;
  background:#111827;
  color:#fff;
  font-size:13px;
  font-weight:950;
}
.onb2-city-r6-note{
  color:#71717a;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.onb2-city-r6-note.is-warning{
  color:#b45309;
}
@media (max-width:420px){
  .onb2-city-r6-list{
    max-height:34dvh;
  }
  .onb2-city-r6-option{
    min-height:56px;
  }
}

/* === SOURCE: css/onboarding_r7_address_geo.css === */

/* ONBOARDING-r7 — address and geolocation */
.onb-address-screen{min-height:100dvh;width:100%;background:#fff;color:#111;display:flex;align-items:stretch;justify-content:center;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}.onb-address-card{width:min(430px,100%);min-height:100dvh;padding:18px 16px calc(22px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#fff 0%,#fff 64%,#f8f8f9 100%);display:flex;flex-direction:column}.onb-address-progress{height:5px;border-radius:999px;background:#f0f0f1;overflow:hidden;margin:2px 0 18px}.onb-address-progress i{display:block;height:100%;background:#ffc400;border-radius:999px}.onb-address-head{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start}.onb-address-back{width:36px;height:36px;border:0;border-radius:50%;background:#f4f4f5;color:#111;font-size:28px;line-height:1}.onb-address-kicker{color:#a1a1aa;font-size:11px;line-height:1;font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin:2px 0 8px}.onb-address-head h1{margin:0;font-size:25px;line-height:1.05;letter-spacing:-.7px;font-weight:950}.onb-address-head p{margin:9px 0 0;color:#71717a;font-size:13px;line-height:1.42;font-weight:650}.onb-address-city{margin:18px 0 12px;min-height:56px;border:1px solid #e8e8eb;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(15,23,42,.045);padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}.onb-address-city span{color:#71717a;font-size:12px;font-weight:800}.onb-address-city b{color:#111;font-size:15px;font-weight:950}.onb-address-form{display:grid;gap:11px}.onb-address-field{display:grid;gap:7px}.onb-address-field span{font-size:12px;color:#242424;font-weight:900}.onb-address-field input{width:100%;min-height:45px;border:1px solid #e8e8eb;border-radius:14px;background:#fff;color:#111;outline:0;padding:0 13px;font-size:14px;font-weight:700}.onb-address-field input::placeholder{color:#a1a1aa}.onb-geo-btn{margin:14px 0 12px;width:100%;border:1px solid rgba(255,196,0,.45);border-radius:16px;background:#fff8d7;color:#111;padding:12px;display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;text-align:left}.onb-geo-icon{width:42px;height:42px;border-radius:14px;background:#ffc400;display:grid;place-items:center;font-size:22px;font-weight:950}.onb-geo-btn b{display:block;font-size:14px;font-weight:950;line-height:1.2}.onb-geo-btn em{display:block;margin-top:3px;color:#71717a;font-size:11.5px;line-height:1.25;font-style:normal;font-weight:700}.onb-geo-btn.is-loading .onb-geo-icon{animation:onbGeoPulse 1s infinite ease-in-out}@keyframes onbGeoPulse{0%,100%{transform:scale(1)}50%{transform:scale(.94)}}.onb-address-map{position:relative;min-height:138px;border:1px solid #e8e8eb;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 62% 48%, #ffc400 0 8px, #fff 9px 12px, transparent 13px),linear-gradient(35deg, transparent 0 43%, rgba(255,196,0,.23) 44% 54%, transparent 55%),linear-gradient(135deg, transparent 0 38%, rgba(34,197,94,.14) 39% 47%, transparent 48%),linear-gradient(90deg, #edf1f4 1px, transparent 1px),linear-gradient(0deg, #edf1f4 1px, transparent 1px),#fafafa;background-size:auto,auto,auto,30px 30px,30px 30px,auto}.onb-address-map i,.onb-address-map span,.onb-address-map b{position:absolute;border-radius:999px;background:#111;opacity:.8}.onb-address-map i{left:36px;top:38px;width:72px;height:8px;transform:rotate(-18deg)}.onb-address-map span{right:34px;bottom:34px;width:86px;height:8px;transform:rotate(-28deg)}.onb-address-map b{left:72px;bottom:42px;width:44px;height:8px;transform:rotate(28deg)}.onb-address-actions{margin-top:auto;padding-top:16px;display:grid;gap:9px}.onb-address-primary,.onb-address-skip{width:100%;min-height:48px;border:0;border-radius:14px;font-size:14px;font-weight:950}.onb-address-primary{background:#ffc400;color:#111;box-shadow:0 10px 22px rgba(255,196,0,.24)}.onb-address-skip{background:#fff;color:#71717a;border:1px solid #e8e8eb}@media (min-width:768px){.onb-address-screen{background:#f6f6f7}.onb-address-card{min-height:calc(100dvh - 32px);margin:16px 0;border:1px solid #e8e8eb;border-radius:28px;box-shadow:0 24px 70px rgba(15,23,42,.10);overflow:hidden}}

/* === SOURCE: css/onboarding_r8_contact.css === */

/* ONBOARDING-r8 — phone / email contact step */
.onb-contact-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-contact-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 68%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-contact-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-contact-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-contact-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-contact-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-contact-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-contact-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-contact-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-contact-methods{
  margin:20px 0 14px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}
.onb-contact-method{
  min-height:36px;
  border:0;
  border-radius:999px;
  background:#f4f4f5;
  color:#242424;
  font-size:12px;
  font-weight:950;
}
.onb-contact-method.is-active{
  background:#ffc400;
  color:#111;
}
.onb-contact-form{
  display:grid;
  gap:11px;
}
.onb-contact-field{
  display:grid;
  gap:7px;
}
.onb-contact-field span{
  font-size:12px;
  color:#242424;
  font-weight:900;
}
.onb-contact-field input{
  width:100%;
  min-height:45px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  outline:0;
  padding:0 13px;
  font-size:14px;
  font-weight:750;
}
.onb-contact-field input::placeholder{
  color:#a1a1aa;
}
.onb-contact-note{
  margin:14px 0 0;
  border:1px solid rgba(255,196,0,.44);
  border-radius:16px;
  background:#fff8d7;
  padding:12px 13px;
}
.onb-contact-note b{
  display:block;
  color:#111;
  font-size:13px;
  line-height:1.25;
  font-weight:950;
}
.onb-contact-note span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-contact-error{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,.34);
  background:#fff0f0;
  color:#b91c1c;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-contact-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-contact-primary,
.onb-contact-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-contact-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-contact-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-contact-screen{background:#f6f6f7;}
  .onb-contact-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r9_sms_verify.css === */

/* ONBOARDING-r9 — SMS / code verification */
.onb-verify-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-verify-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 68%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-verify-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-verify-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-verify-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-verify-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-verify-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-verify-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-verify-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-verify-head p b{
  color:#111;
  font-weight:950;
}
.onb-verify-code{
  margin:28px 0 14px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.onb-code-cell{
  width:100%;
  height:58px;
  border:1px solid #e8e8eb;
  border-radius:16px;
  background:#fff;
  color:#111;
  text-align:center;
  font-size:24px;
  font-weight:950;
  outline:0;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
}
.onb-code-cell:focus{
  border-color:#ffc400;
  box-shadow:0 0 0 4px rgba(255,196,0,.18);
}
.onb-verify-devnote{
  border:1px solid rgba(255,196,0,.44);
  border-radius:16px;
  background:#fff8d7;
  padding:12px 13px;
}
.onb-verify-devnote b,
.onb-verify-devnote span{
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-verify-devnote em{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-style:normal;
  font-weight:700;
}
.onb-verify-error{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,.34);
  background:#fff0f0;
  color:#b91c1c;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-verify-resend{
  margin:12px 0 0;
  width:100%;
  min-height:42px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-verify-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-verify-primary,
.onb-verify-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-verify-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-verify-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-verify-screen{background:#f6f6f7;}
  .onb-verify-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r10_account.css === */

/* ONBOARDING-r10 — account creation */
.onb-account-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-account-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 68%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-account-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-account-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-account-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-account-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-account-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-account-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-account-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-account-role{
  margin:18px 0 12px;
  min-height:54px;
  border:1px solid rgba(255,196,0,.44);
  border-radius:16px;
  background:#fff8d7;
  padding:12px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.onb-account-role span{
  color:#71717a;
  font-size:12px;
  font-weight:900;
}
.onb-account-role b{
  color:#111;
  font-size:14px;
  font-weight:950;
}
.onb-account-form{
  display:grid;
  gap:11px;
}
.onb-account-field{
  display:grid;
  gap:7px;
}
.onb-account-field span{
  font-size:12px;
  color:#242424;
  font-weight:900;
}
.onb-account-field input{
  width:100%;
  min-height:45px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  outline:0;
  padding:0 13px;
  font-size:14px;
  font-weight:750;
}
.onb-account-field input::placeholder{
  color:#a1a1aa;
}
.onb-account-password{
  display:grid;
  grid-template-columns:1fr 44px;
  gap:8px;
}
.onb-account-password input{
  min-width:0;
}
.onb-account-password button{
  width:44px;
  min-height:45px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
}
.onb-account-check{
  margin:13px 0 0;
  display:grid;
  grid-template-columns:22px 1fr;
  gap:9px;
  align-items:start;
  color:#71717a;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.onb-account-check input{
  width:20px;
  height:20px;
  accent-color:#ffc400;
}
.onb-account-note{
  margin:12px 0 0;
  border:1px solid #e8e8eb;
  border-radius:16px;
  background:#fff;
  padding:12px 13px;
}
.onb-account-note b{
  color:#111;
  font-size:12px;
  font-weight:950;
}
.onb-account-note span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-account-error{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,.34);
  background:#fff0f0;
  color:#b91c1c;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-account-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-account-primary,
.onb-account-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-account-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-account-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-account-screen{background:#f6f6f7;}
  .onb-account-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r11_profile.css === */
/* ONBOARDING-r11 — role-aware profile details */
.onb-profile-screen{min-height:100dvh;width:100%;background:#fff;color:#111;display:flex;align-items:stretch;justify-content:center;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.onb-profile-card{width:min(430px,100%);min-height:100dvh;padding:18px 16px calc(22px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#fff 0%,#fff 68%,#f8f8f9 100%);display:flex;flex-direction:column}
.onb-profile-progress{height:5px;border-radius:999px;background:#f0f0f1;overflow:hidden;margin:2px 0 18px}.onb-profile-progress i{display:block;height:100%;border-radius:999px;background:#ffc400}
.onb-profile-head{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start}.onb-profile-back{width:36px;height:36px;border:0;border-radius:50%;background:#f4f4f5;color:#111;font-size:28px;line-height:1}
.onb-profile-kicker{color:#a1a1aa;font-size:11px;line-height:1;font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin:2px 0 8px}.onb-profile-head h1{margin:0;font-size:25px;line-height:1.05;letter-spacing:-.7px;font-weight:950}.onb-profile-head p{margin:9px 0 0;color:#71717a;font-size:13px;line-height:1.42;font-weight:650}
.onb-profile-role-card{margin:18px 0 12px;border:1px solid rgba(255,196,0,.44);border-radius:18px;background:#fff8d7;padding:12px;display:grid;grid-template-columns:48px 1fr;gap:11px;align-items:center}.onb-profile-avatar{width:48px;height:48px;border-radius:16px;background:#ffc400;display:grid;place-items:center;font-size:23px}.onb-profile-role-card b{display:block;color:#111;font-size:15px;font-weight:950}.onb-profile-role-card span{display:block;margin-top:3px;color:#71717a;font-size:12px;font-weight:800}
.onb-profile-form{display:grid;gap:11px}.onb-profile-field{display:grid;gap:7px}.onb-profile-field span{font-size:12px;color:#242424;font-weight:900}.onb-profile-field input,.onb-profile-field textarea{width:100%;border:1px solid #e8e8eb;border-radius:14px;background:#fff;color:#111;outline:0;padding:0 13px;font-size:14px;font-weight:750}.onb-profile-field input{min-height:45px}.onb-profile-field textarea{min-height:94px;padding-top:11px;resize:vertical;line-height:1.4}.onb-profile-field input::placeholder,.onb-profile-field textarea::placeholder{color:#a1a1aa}
.onb-profile-error{margin-top:10px;padding:10px 12px;border-radius:14px;border:1px solid rgba(239,68,68,.34);background:#fff0f0;color:#b91c1c;font-size:12px;line-height:1.35;font-weight:800}
.onb-profile-actions{margin-top:auto;padding-top:16px;display:grid;gap:9px}.onb-profile-primary,.onb-profile-skip{width:100%;min-height:48px;border-radius:14px;font-size:14px;font-weight:950}.onb-profile-primary{border:0;background:#ffc400;color:#111;box-shadow:0 10px 22px rgba(255,196,0,.24)}.onb-profile-skip{border:1px solid #e8e8eb;background:#fff;color:#71717a}
@media (min-width:768px){.onb-profile-screen{background:#f6f6f7}.onb-profile-card{min-height:calc(100dvh - 32px);margin:16px 0;border:1px solid #e8e8eb;border-radius:28px;box-shadow:0 24px 70px rgba(15,23,42,.10);overflow:hidden}}

/* === SOURCE: css/onboarding_r12_vehicle.css === */

/* ONBOARDING-r12 — vehicle add step */
.onb-vehicle-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-vehicle-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 70%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-vehicle-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-vehicle-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-vehicle-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-vehicle-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-vehicle-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-vehicle-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-vehicle-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-vehicle-visual{
  position:relative;
  min-height:112px;
  margin:16px 0 14px;
  border-radius:22px;
  background:
    radial-gradient(circle at 24% 30%, rgba(255,196,0,.30) 0 28px, transparent 29px),
    linear-gradient(180deg,#f9fafb,#f2f2f3);
  overflow:hidden;
  border:1px solid #e8e8eb;
}
.onb-vehicle-road{
  position:absolute;
  left:0;
  right:0;
  bottom:20px;
  height:24px;
  background:linear-gradient(90deg,transparent,#d9d9df,transparent);
  opacity:.7;
}
.onb-vehicle-car{
  position:absolute;
  left:50%;
  bottom:29px;
  width:158px;
  height:46px;
  transform:translateX(-50%);
}
.onb-vehicle-car i{
  position:absolute;
  left:20px;
  right:20px;
  bottom:10px;
  height:27px;
  border-radius:18px 24px 10px 10px;
  background:#ffc400;
  border:2px solid #111;
}
.onb-vehicle-car b{
  position:absolute;
  left:48px;
  top:1px;
  width:62px;
  height:28px;
  border-radius:22px 22px 6px 6px;
  background:#fff;
  border:2px solid #111;
}
.onb-vehicle-car span:before,
.onb-vehicle-car span:after{
  content:"";
  position:absolute;
  bottom:0;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#111;
  box-shadow:inset 0 0 0 6px #fff;
}
.onb-vehicle-car span:before{left:30px;}
.onb-vehicle-car span:after{right:30px;}
.onb-vehicle-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:11px;
}
.onb-vehicle-field{
  display:grid;
  grid-column:1/-1;
  gap:7px;
}
.onb-vehicle-field--half{
  grid-column:auto;
}
.onb-vehicle-field span{
  font-size:12px;
  color:#242424;
  font-weight:900;
}
.onb-vehicle-field input{
  width:100%;
  min-height:45px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  outline:0;
  padding:0 13px;
  font-size:14px;
  font-weight:750;
}
.onb-vehicle-field input::placeholder{
  color:#a1a1aa;
}
.onb-vehicle-note{
  margin:12px 0 0;
  border:1px solid rgba(255,196,0,.44);
  border-radius:16px;
  background:#fff8d7;
  padding:12px 13px;
}
.onb-vehicle-note b{
  display:block;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-vehicle-note span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-vehicle-error{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,.34);
  background:#fff0f0;
  color:#b91c1c;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-vehicle-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-vehicle-primary,
.onb-vehicle-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-vehicle-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-vehicle-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-vehicle-screen{background:#f6f6f7;}
  .onb-vehicle-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r13_permissions.css === */

/* ONBOARDING-r13 — permissions */
.onb-perm-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-perm-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 70%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-perm-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-perm-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-perm-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-perm-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-perm-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-perm-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-perm-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-perm-list{
  display:grid;
  gap:10px;
  margin:18px 0 12px;
}
.onb-perm-item{
  width:100%;
  border:1px solid #e8e8eb;
  border-radius:18px;
  background:#fff;
  color:#111;
  padding:12px;
  display:grid;
  grid-template-columns:42px 1fr 44px;
  gap:10px;
  align-items:center;
  text-align:left;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
}
.onb-perm-item.is-on{
  border-color:rgba(255,196,0,.62);
  background:linear-gradient(180deg,#fffef7,#fff);
}
.onb-perm-icon{
  width:42px;
  height:42px;
  border-radius:14px;
  background:#f4f4f5;
  display:grid;
  place-items:center;
  font-size:21px;
  font-weight:950;
}
.onb-perm-item.is-on .onb-perm-icon{
  background:#ffc400;
}
.onb-perm-body{
  min-width:0;
  display:grid;
  gap:4px;
}
.onb-perm-body b{
  display:flex;
  align-items:center;
  gap:6px;
  color:#111;
  font-size:14px;
  line-height:1.2;
  font-weight:950;
}
.onb-perm-body b em{
  padding:3px 7px;
  border-radius:999px;
  background:#fff3be;
  color:#8a6100;
  font-size:9px;
  line-height:1;
  font-style:normal;
  font-weight:950;
}
.onb-perm-body small{
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-perm-toggle{
  width:42px;
  height:25px;
  border-radius:999px;
  background:#e8e8eb;
  padding:3px;
  display:flex;
  justify-content:flex-start;
  transition:.16s ease;
}
.onb-perm-toggle i{
  width:19px;
  height:19px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}
.onb-perm-item.is-on .onb-perm-toggle{
  background:#ffc400;
  justify-content:flex-end;
}
.onb-perm-note{
  border:1px solid #e8e8eb;
  border-radius:16px;
  background:#fff;
  padding:12px 13px;
}
.onb-perm-note b{
  display:block;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-perm-note span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-perm-status{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,196,0,.44);
  background:#fff8d7;
  color:#111;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-perm-status[data-type="ok"]{
  border-color:rgba(34,197,94,.32);
  background:#e7f8ee;
  color:#15803d;
}
.onb-perm-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-perm-primary,
.onb-perm-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-perm-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-perm-primary:disabled{
  opacity:.7;
}
.onb-perm-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-perm-screen{background:#f6f6f7;}
  .onb-perm-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r14_review.css === */

/* ONBOARDING-r14 — review data */
.onb-review-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-review-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 70%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-review-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-review-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-review-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-review-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-review-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-review-head h1{
  margin:0;
  font-size:25px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-review-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-review-list{
  display:grid;
  gap:9px;
  margin:18px 0 12px;
}
.onb-review-row{
  border:1px solid #e8e8eb;
  border-radius:16px;
  background:#fff;
  padding:11px;
  display:grid;
  grid-template-columns:38px 1fr auto;
  gap:10px;
  align-items:center;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
}
.onb-review-row__icon{
  width:38px;
  height:38px;
  border-radius:13px;
  background:#f4f4f5;
  display:grid;
  place-items:center;
  color:#111;
  font-size:18px;
  font-weight:950;
}
.onb-review-row__body{
  min-width:0;
  display:grid;
  gap:3px;
}
.onb-review-row__body small{
  color:#71717a;
  font-size:10.8px;
  line-height:1;
  font-weight:850;
}
.onb-review-row__body b{
  color:#111;
  font-size:13px;
  line-height:1.25;
  font-weight:950;
  overflow:hidden;
  text-overflow:ellipsis;
}
.onb-review-edit{
  min-height:30px;
  border:0;
  border-radius:999px;
  background:#fff3be;
  color:#8a6100;
  padding:0 10px;
  font-size:11px;
  font-weight:950;
}
.onb-review-note{
  border:1px solid rgba(255,196,0,.44);
  border-radius:16px;
  background:#fff8d7;
  padding:12px 13px;
}
.onb-review-note b{
  display:block;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-review-note span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:11.5px;
  line-height:1.35;
  font-weight:700;
}
.onb-review-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-review-primary,
.onb-review-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-review-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-review-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-review-screen{background:#f6f6f7;}
  .onb-review-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_r15_done.css === */

/* ONBOARDING-r15 — final done screen */
.onb-done-screen{
  min-height:100dvh;
  width:100%;
  background:#fff;
  color:#111;
  display:flex;
  align-items:stretch;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-done-card{
  width:min(430px,100%);
  min-height:100dvh;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,#fff 0%,#fff 68%,#f8f8f9 100%);
  display:flex;
  flex-direction:column;
}
.onb-done-progress{
  height:5px;
  border-radius:999px;
  background:#f0f0f1;
  overflow:hidden;
  margin:2px 0 18px;
}
.onb-done-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:#ffc400;
}
.onb-done-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-done-back{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
  line-height:1;
}
.onb-done-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-done-head h1{
  margin:0;
  font-size:26px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:950;
}
.onb-done-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-done-hero{
  position:relative;
  min-height:174px;
  margin:20px 0 14px;
  border-radius:28px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 38%, rgba(255,196,0,.34) 0 58px, transparent 59px),
    linear-gradient(180deg,#fff8d7 0%,#f8f8f9 100%);
  border:1px solid rgba(255,196,0,.38);
}
.onb-done-badge{
  position:absolute;
  left:50%;
  top:18px;
  width:52px;
  height:52px;
  transform:translateX(-50%);
  border-radius:50%;
  background:#ffc400;
  color:#111;
  display:grid;
  place-items:center;
  font-size:27px;
  font-weight:950;
  box-shadow:0 12px 28px rgba(255,196,0,.24);
}
.onb-done-road{
  position:absolute;
  left:0;
  right:0;
  bottom:28px;
  height:24px;
  background:linear-gradient(90deg,transparent,#d9d9df,transparent);
}
.onb-done-car{
  position:absolute;
  left:50%;
  bottom:42px;
  width:170px;
  height:52px;
  transform:translateX(-50%);
}
.onb-done-car i{
  position:absolute;
  left:20px;
  right:20px;
  bottom:10px;
  height:30px;
  border-radius:20px 26px 11px 11px;
  background:#ffc400;
  border:2px solid #111;
}
.onb-done-car b{
  position:absolute;
  left:51px;
  top:1px;
  width:68px;
  height:31px;
  border-radius:24px 24px 7px 7px;
  background:#fff;
  border:2px solid #111;
}
.onb-done-car span:before,
.onb-done-car span:after{
  content:"";
  position:absolute;
  bottom:0;
  width:26px;
  height:26px;
  border-radius:50%;
  background:#111;
  box-shadow:inset 0 0 0 7px #fff;
}
.onb-done-car span:before{left:31px;}
.onb-done-car span:after{right:31px;}
.onb-done-summary{
  display:grid;
  gap:9px;
}
.onb-done-row{
  min-height:48px;
  border:1px solid #e8e8eb;
  border-radius:16px;
  background:#fff;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.onb-done-row span{
  color:#71717a;
  font-size:12px;
  font-weight:900;
}
.onb-done-row b{
  min-width:0;
  color:#111;
  font-size:13px;
  line-height:1.2;
  font-weight:950;
  text-align:right;
}
.onb-done-next{
  margin:12px 0 0;
  border:1px solid rgba(255,196,0,.44);
  border-radius:18px;
  background:#fff8d7;
  padding:13px;
}
.onb-done-next b{
  display:block;
  color:#111;
  font-size:14px;
  font-weight:950;
}
.onb-done-next span{
  display:block;
  margin-top:4px;
  color:#71717a;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.onb-done-actions{
  margin-top:auto;
  padding-top:16px;
  display:grid;
  gap:9px;
}
.onb-done-primary,
.onb-done-skip{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:14px;
  font-weight:950;
}
.onb-done-primary{
  border:0;
  background:#ffc400;
  color:#111;
  box-shadow:0 10px 22px rgba(255,196,0,.24);
}
.onb-done-skip{
  border:1px solid #e8e8eb;
  background:#fff;
  color:#71717a;
}
@media (min-width:768px){
  .onb-done-screen{background:#f6f6f7;}
  .onb-done-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    overflow:hidden;
  }
}

/* === SOURCE: css/onboarding_live_r1.css === */

/* ONBOARDING-LIVE-r1 diagnostics */
.onb-live-screen{
  min-height:100dvh;
  background:#f6f6f7;
  color:#111;
  display:flex;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-live-card{
  width:min(430px,100%);
  min-height:100dvh;
  background:#fff;
  padding:18px 16px calc(22px + env(safe-area-inset-bottom));
}
.onb-live-head{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:10px;
  align-items:start;
}
.onb-live-head button{
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f4f5;
  color:#111;
  font-size:28px;
}
.onb-live-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:2px 0 8px;
}
.onb-live-head h1{
  margin:0;
  font-size:24px;
  line-height:1.05;
  font-weight:950;
}
.onb-live-head p{
  margin:9px 0 0;
  color:#71717a;
  font-size:13px;
  line-height:1.42;
  font-weight:650;
}
.onb-live-summary{
  margin:18px 0 12px;
  display:grid;
  gap:8px;
}
.onb-live-summary div,
.onb-live-step{
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.onb-live-summary span,
.onb-live-step span{
  color:#71717a;
  font-size:12px;
  font-weight:850;
}
.onb-live-summary b,
.onb-live-step b{
  color:#111;
  font-size:12px;
  line-height:1.2;
  font-weight:950;
  text-align:right;
}
.onb-live-step.is-active{
  border-color:rgba(255,196,0,.62);
  background:#fff8d7;
}
.onb-live-ok,
.onb-live-issues{
  border-radius:16px;
  padding:12px;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}
.onb-live-ok{
  border:1px solid rgba(34,197,94,.32);
  background:#e7f8ee;
  color:#15803d;
}
.onb-live-issues{
  border:1px solid rgba(239,68,68,.34);
  background:#fff0f0;
  color:#b91c1c;
  display:grid;
  gap:7px;
}
.onb-live-section{
  margin-top:16px;
}
.onb-live-section h2{
  margin:0 0 8px;
  font-size:14px;
  font-weight:950;
}
.onb-live-steps{
  display:grid;
  gap:7px;
}
.onb-live-section pre{
  max-height:260px;
  overflow:auto;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#111;
  color:#f8f8f9;
  padding:12px;
  font-size:11px;
  line-height:1.4;
}
.onb-live-actions{
  position:sticky;
  bottom:0;
  margin-top:16px;
  padding:12px 0 0;
  display:grid;
  gap:8px;
  background:linear-gradient(180deg,rgba(255,255,255,0),#fff 18%);
}
.onb-live-actions button{
  min-height:44px;
  border-radius:14px;
  border:1px solid #e8e8eb;
  background:#fff;
  color:#111;
  font-size:13px;
  font-weight:950;
}
.onb-live-actions button:first-child{
  background:#ffc400;
  border-color:#ffc400;
}
@media (min-width:768px){
  .onb-live-card{
    min-height:calc(100dvh - 32px);
    margin:16px 0;
    border:1px solid #e8e8eb;
    border-radius:28px;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
  }
}


/* ONBOARDING-LIVE-r2 route matrix */
.onb-live-role{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  margin-bottom:10px;
}
.onb-live-role button{
  min-height:34px;
  border:1px solid #e8e8eb;
  border-radius:999px;
  background:#fff;
  color:#111;
  font-size:12px;
  font-weight:950;
}
.onb-live-role button.is-active{
  background:#ffc400;
  border-color:#ffc400;
}
.onb-live-routes{
  display:grid;
  gap:7px;
}
.onb-live-route{
  width:100%;
  min-height:50px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  padding:9px 10px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 10px;
  align-items:center;
  text-align:left;
}
.onb-live-route span{
  font-size:12px;
  font-weight:950;
}
.onb-live-route small{
  color:#71717a;
  font-size:10.5px;
  line-height:1.2;
  font-weight:750;
}
.onb-live-route b{
  grid-row:1/3;
  grid-column:2;
  padding:4px 8px;
  border-radius:999px;
  background:#f4f4f5;
  color:#71717a;
  font-size:10px;
  font-weight:950;
}
.onb-live-route.is-ok{
  border-color:rgba(34,197,94,.34);
  background:#f7fff9;
}
.onb-live-route.is-ok b{
  background:#e7f8ee;
  color:#15803d;
}
.onb-live-route.is-bad{
  border-color:rgba(239,68,68,.34);
  background:#fff7f7;
}
.onb-live-route.is-bad b{
  background:#fff0f0;
  color:#b91c1c;
}
.onb-live-actions--matrix{
  position:static;
  background:none;
  grid-template-columns:1fr;
}
.onb-live-actions--matrix button:first-child{
  background:#ffc400;
}


/* ONBOARDING-LIVE-r3 fallback and report */
.onb-live-report-actions{
  margin-top:14px;
  display:grid;
  gap:8px;
}
.onb-live-report-actions button{
  min-height:42px;
  border:1px solid #e8e8eb;
  border-radius:14px;
  background:#fff;
  color:#111;
  font-size:12px;
  font-weight:950;
}
.onb-live-report-actions button:first-child{
  background:#ffc400;
  border-color:#ffc400;
}
.onb-live-fallback-screen{
  min-height:100dvh;
  background:#f6f6f7;
  color:#111;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.onb-live-fallback-card{
  width:min(430px,100%);
  border:1px solid #e8e8eb;
  border-radius:28px;
  background:#fff;
  padding:18px;
  box-shadow:0 24px 70px rgba(15,23,42,.10);
}
.onb-live-fallback-kicker{
  color:#a1a1aa;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin:0 0 8px;
}
.onb-live-fallback-card h1{
  margin:0;
  font-size:24px;
  line-height:1.08;
  font-weight:950;
}
.onb-live-fallback-card p{
  margin:10px 0 14px;
  color:#71717a;
  font-size:13px;
  line-height:1.4;
  font-weight:650;
}
.onb-live-fallback-box{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:8px 10px;
  border:1px solid rgba(239,68,68,.34);
  border-radius:16px;
  background:#fff0f0;
  padding:12px;
  margin-bottom:14px;
}
.onb-live-fallback-box span{
  color:#71717a;
  font-size:12px;
  font-weight:900;
}
.onb-live-fallback-box b{
  color:#111;
  font-size:12px;
  line-height:1.25;
  font-weight:950;
  word-break:break-word;
}
.onb-live-fallback-card button{
  width:100%;
  min-height:44px;
  border-radius:14px;
  border:1px solid #e8e8eb;
  background:#fff;
  color:#111;
  font-size:13px;
  font-weight:950;
  margin-top:8px;
}
.onb-live-fallback-card button:first-of-type{
  background:#ffc400;
  border-color:#ffc400;
}

/* === SOURCE: css/onboarding_reference_r23.css === */

/* ONBOARDING-r23 — reference app screens for quick/profile role forms. */
#onb2-overlay:has(.onb2-step.active .onb2-modal--ref){
  background:#f7f7f8;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#onb2-overlay:has(.onb2-step.active .onb2-modal--ref) .onb2-step{
  align-items:stretch;
}
.onb2-modal--ref{
  position:relative;
  width:min(430px,100%);
  height:100dvh;
  min-height:100dvh;
  margin:0 auto;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 6%, rgba(255,90,0,.06), transparent 26%),
    linear-gradient(180deg,#fff 0%,#fffaf7 100%);
  color:#24262b;
  border-left:1px solid rgba(17,24,39,.06);
  border-right:1px solid rgba(17,24,39,.06);
  box-shadow:0 22px 70px rgba(15,23,42,.12);
}
.onb2-modal--ref::before{
  content:'';
  position:absolute;
  left:-18%;
  right:-14%;
  bottom:-118px;
  height:255px;
  z-index:0;
  border-radius:58% 58% 0 0 / 38% 38% 0 0;
  background:linear-gradient(135deg,#ff8c2a 0%,#ff5a00 54%,#ff6a00 100%);
  box-shadow:0 -14px 0 rgba(255,90,0,.25);
}
.onb2-modal--ref::after{
  content:'';
  position:absolute;
  left:-20%;
  right:-13%;
  top:132px;
  height:130px;
  z-index:0;
  pointer-events:none;
  border-top:1px solid rgba(255,90,0,.18);
  border-bottom:2px solid rgba(255,90,0,.55);
  border-radius:0 0 58% 58%;
  transform:rotate(-3deg);
}
.onb2-ref-status{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 24px 0;
  color:#1f2227;
  font-size:13px;
  line-height:18px;
  font-weight:900;
  letter-spacing:-.02em;
}
.onb2-ref-topbar{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:34px 1fr 34px;
  align-items:center;
  gap:6px;
  padding:20px 20px 4px;
}
.onb2-ref-back{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  color:#ff5a00;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}
.onb2-ref-logo{
  grid-column:2;
  justify-self:center;
  display:block;
  width:min(100%, 210px);
  height:auto;
  object-fit:contain;
}
.onb2-ref-body{
  position:relative;
  z-index:2;
  padding:20px 34px 124px;
  text-align:center;
}
.onb2-ref-body h2,
.onb2-ref-profile-head h2{
  margin:0;
  color:#24262b;
  font-size:20px;
  line-height:1.15;
  font-weight:950;
  letter-spacing:-.035em;
}
.onb2-ref-body p,
.onb2-ref-profile-head p{
  margin:8px auto 0;
  max-width:310px;
  color:#5c5f66;
  font-size:12px;
  line-height:1.35;
  font-weight:600;
  letter-spacing:-.015em;
}
.onb2-ref-avatar{
  position:relative;
  width:74px;
  height:74px;
  margin:20px auto 14px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 10px 24px rgba(20,24,32,.08);
  display:flex;
  align-items:center;
  justify-content:center;
}
.onb2-ref-avatar::before{
  content:'';
  position:absolute;
  inset:8px auto auto 9px;
  width:31px;
  height:31px;
  border-radius:999px;
  background:linear-gradient(135deg,#ff8c2a,#ff5a00);
}
.onb2-ref-avatar span{
  position:relative;
  z-index:2;
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.onb2-ref-avatar .onb2-role-svg{
  width:48px;
  height:48px;
}
.onb2-ref-avatar i{
  position:absolute;
  right:4px;
  bottom:4px;
  width:22px;
  height:22px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(36,38,43,.12);
}
.onb2-ref-avatar i::before{
  content:'⌕';
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#333;
  font-size:12px;
  font-style:normal;
  font-weight:900;
}
.onb2-ref-form,
.onb2-ref-profile-form{
  display:grid;
  gap:10px;
  text-align:left;
}
.onb2-ref-form label,
.onb2-ref-profile-form label{
  position:relative;
  display:grid;
  gap:4px;
}
.onb2-ref-form label span,
.onb2-ref-profile-form label span{
  padding-left:2px;
  color:#7a7d84;
  font-size:10px;
  line-height:1.1;
  font-weight:800;
}
.onb2-ref-profile-form label span b{
  color:#ff5a00;
}
.onb2-ref-input{
  width:100%;
  min-height:48px;
  box-sizing:border-box;
  border:1px solid rgba(29,33,40,.10);
  border-radius:9px;
  background:rgba(255,255,255,.88);
  color:#24262b;
  outline:0;
  padding:12px 40px 12px 14px;
  box-shadow:0 6px 16px rgba(20,24,32,.035);
  font-size:13px;
  line-height:1.2;
  font-weight:800;
}
select.onb2-ref-input{
  appearance:none;
  -webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,#7a7d84 50%),linear-gradient(135deg,#7a7d84 50%,transparent 50%);
  background-position:calc(100% - 17px) 21px,calc(100% - 12px) 21px;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
textarea.onb2-ref-input{
  min-height:86px;
  resize:none;
  line-height:1.35;
  padding-right:14px;
}
.onb2-ref-profile-form label i{
  position:absolute;
  right:13px;
  top:31px;
  color:#2f333a;
  font-style:normal;
  font-size:13px;
}
.onb2-ref-profile-form label small{
  position:absolute;
  right:11px;
  bottom:8px;
  color:#8b8e96;
  font-size:9px;
  font-weight:700;
}
.onb2-ref-profile-head{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 76px;
  gap:12px;
  align-items:start;
  padding:18px 28px 12px;
  text-align:left;
}
.onb2-ref-profile-head .onb2-ref-avatar{
  margin:0;
  width:68px;
  height:68px;
}
.onb2-ref-profile-scroll{
  position:relative;
  z-index:2;
  height:calc(100dvh - 198px);
  overflow:auto;
  padding:0 28px 112px;
  scrollbar-width:none;
}
.onb2-ref-profile-scroll::-webkit-scrollbar{display:none;}
.onb2-ref-services-title{
  margin-top:2px;
  color:#7a7d84;
  font-size:11px;
  font-weight:900;
}
.onb2-ref-checks{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.onb2-ref-check{
  display:inline-flex !important;
  grid-template-columns:none !important;
  align-items:center;
  gap:6px !important;
  padding:5px 8px;
  border-radius:6px;
  background:#fff8f2;
  border:1px solid rgba(255,90,0,.25);
}
.onb2-ref-check input{
  accent-color:#ff5a00;
}
.onb2-ref-check span{
  padding:0 !important;
  color:#6b4a35 !important;
  font-size:10px !important;
}
.onb2-ref-add-service{
  min-height:38px;
  border:1px dashed rgba(255,90,0,.75);
  border-radius:8px;
  background:#fffaf7;
  color:#ff5a00;
  font-size:12px;
  font-weight:950;
}
.onb2-ref-note{
  padding:11px 12px;
  border-radius:10px;
  background:#fff1e8;
  color:#7b4b2e;
  font-size:11px;
  line-height:1.35;
  font-weight:700;
}
.onb2-ref-footer{
  position:absolute;
  left:28px;
  right:28px;
  bottom:23px;
  z-index:4;
}
.onb2-ref-primary{
  width:100%;
  min-height:58px;
  border:0;
  border-radius:10px;
  background:linear-gradient(90deg,#ff5a00 0%,#ff6a00 100%);
  color:#fff;
  box-shadow:0 12px 26px rgba(255,90,0,.22);
  font-size:15px;
  line-height:1;
  font-weight:950;
  cursor:pointer;
}
.onb2-ref-primary:active{
  transform:translateY(1px) scale(.996);
}
@media (max-width:420px){
  .onb2-ref-status{padding-left:20px;padding-right:20px;}
  .onb2-ref-topbar{padding-left:16px;padding-right:16px;}
  .onb2-ref-logo{width:min(100%, 190px);}
  .onb2-ref-body{padding-left:28px;padding-right:28px;}
  .onb2-ref-profile-head{padding-left:22px;padding-right:22px;}
  .onb2-ref-profile-scroll{padding-left:22px;padding-right:22px;}
  .onb2-ref-footer{left:22px;right:22px;}
}
@media (max-height:760px){
  .onb2-ref-body{padding-top:12px;}
  .onb2-ref-avatar{margin-top:14px;margin-bottom:10px;}
  .onb2-ref-profile-scroll{height:calc(100dvh - 176px);}
}

/* ONBOARDING-r26 — third quick screen tablet/wide optimization. Scope: quick ref screen only. */
@media (min-width:768px){
  #onb2-overlay:has(#onb2-step-quick.active){
    background:
      radial-gradient(circle at 50% 14%, rgba(255,255,255,.92), rgba(255,255,255,0) 44%),
      linear-gradient(180deg,#f4f4f5 0%,#ececef 100%);
  }
  #onb2-step-quick.active{
    align-items:center !important;
    justify-content:center !important;
    padding:28px;
    box-sizing:border-box;
  }
  #onb2-step-quick .onb2-modal--quick-ref{
    width:min(920px, calc(100vw - 56px));
    height:min(760px, calc(100dvh - 56px));
    min-height:620px;
    border-radius:34px;
    border:1px solid rgba(17,24,39,.08);
    overflow:hidden;
    box-shadow:0 28px 90px rgba(15,23,42,.16);
  }
  #onb2-step-quick .onb2-modal--quick-ref::before{
    left:-16%;
    right:-16%;
    bottom:-132px;
    height:260px;
    border-radius:60% 60% 0 0 / 46% 46% 0 0;
  }
  #onb2-step-quick .onb2-modal--quick-ref::after{
    top:144px;
    height:150px;
  }
  #onb2-step-quick .onb2-ref-status{
    padding:22px 36px 0;
    font-size:14px;
  }
  #onb2-step-quick .onb2-ref-topbar{
    grid-template-columns:44px 1fr 44px;
    padding:20px 36px 8px;
  }
  #onb2-step-quick .onb2-ref-back{
    width:44px;
    height:44px;
    font-size:24px;
    border-radius:14px;
  }
  #onb2-step-quick .onb2-ref-logo{
    width:min(100%, 286px);
  }
  #onb2-step-quick .onb2-ref-body{
    display:grid;
    grid-template-columns:minmax(260px, 330px) minmax(360px, 1fr);
    grid-template-areas:
      "title form"
      "avatar form";
    align-items:center;
    column-gap:46px;
    row-gap:16px;
    padding:34px 58px 120px;
    text-align:left;
  }
  #onb2-step-quick .onb2-ref-body h2{
    grid-area:title;
    align-self:end;
    font-size:31px;
    line-height:1.08;
    letter-spacing:-.05em;
  }
  #onb2-step-quick .onb2-ref-body p{
    grid-area:title;
    align-self:end;
    margin:44px 0 0;
    max-width:310px;
    font-size:15px;
    line-height:1.45;
  }
  #onb2-step-quick .onb2-ref-avatar{
    grid-area:avatar;
    align-self:start;
    justify-self:start;
    width:122px;
    height:122px;
    margin:20px 0 0;
    box-shadow:0 18px 42px rgba(20,24,32,.10);
  }
  #onb2-step-quick .onb2-ref-avatar::before{
    inset:13px auto auto 15px;
    width:50px;
    height:50px;
  }
  #onb2-step-quick .onb2-ref-avatar span{
    width:92px;
    height:92px;
  }
  #onb2-step-quick .onb2-ref-avatar .onb2-role-svg{
    width:78px;
    height:78px;
  }
  #onb2-step-quick .onb2-ref-avatar i{
    right:8px;
    bottom:8px;
    width:30px;
    height:30px;
  }
  #onb2-step-quick .onb2-ref-form--quick{
    grid-area:form;
    align-self:center;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    padding:22px;
    border-radius:24px;
    background:rgba(255,255,255,.62);
    border:1px solid rgba(17,24,39,.06);
    box-shadow:0 18px 42px rgba(15,23,42,.075);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  #onb2-step-quick .onb2-ref-form--quick label:nth-child(1),
  #onb2-step-quick .onb2-ref-form--quick label:nth-child(2){
    grid-column:auto;
  }
  #onb2-step-quick .onb2-ref-form--quick label:nth-last-child(1):nth-child(odd){
    grid-column:1 / -1;
  }
  #onb2-step-quick .onb2-ref-form label span{
    font-size:11px;
  }
  #onb2-step-quick .onb2-ref-input{
    min-height:56px;
    border-radius:13px;
    padding:14px 42px 14px 16px;
    font-size:15px;
  }
  #onb2-step-quick select.onb2-ref-input{
    background-position:calc(100% - 19px) 25px,calc(100% - 13px) 25px;
  }
  #onb2-step-quick .onb2-ref-footer{
    left:58px;
    right:58px;
    bottom:34px;
  }
  #onb2-step-quick .onb2-ref-primary{
    max-width:420px;
    min-height:62px;
    margin-left:auto;
    display:block;
    border-radius:14px;
    font-size:17px;
  }
}

@media (min-width:1024px){
  #onb2-step-quick .onb2-modal--quick-ref{
    width:min(1040px, calc(100vw - 80px));
    height:min(780px, calc(100dvh - 80px));
  }
  #onb2-step-quick .onb2-ref-body{
    grid-template-columns:minmax(300px, 390px) minmax(430px, 1fr);
    column-gap:62px;
    padding-left:72px;
    padding-right:72px;
  }
  #onb2-step-quick .onb2-ref-body h2{
    font-size:36px;
  }
  #onb2-step-quick .onb2-ref-body p{
    max-width:360px;
    font-size:16px;
  }
  #onb2-step-quick .onb2-ref-form--quick{
    gap:16px;
    padding:26px;
  }
  #onb2-step-quick .onb2-ref-footer{
    left:72px;
    right:72px;
  }
}

@media (min-width:768px) and (max-height:720px){
  #onb2-step-quick.active{
    padding:16px;
  }
  #onb2-step-quick .onb2-modal--quick-ref{
    height:calc(100dvh - 32px);
    min-height:560px;
  }
  #onb2-step-quick .onb2-ref-body{
    padding-top:18px;
    padding-bottom:104px;
  }
  #onb2-step-quick .onb2-ref-avatar{
    width:96px;
    height:96px;
  }
  #onb2-step-quick .onb2-ref-avatar .onb2-role-svg{
    width:64px;
    height:64px;
  }
}


/* ONBOARDING-r27 — profile client/master/STO forms tablet/wide optimization. Scope: profile ref screen only. */
@media (min-width:768px){
  #onb2-overlay:has(#onb2-step-profile.active){
    background:
      radial-gradient(circle at 50% 12%, rgba(255,255,255,.94), rgba(255,255,255,0) 46%),
      linear-gradient(180deg,#f4f4f5 0%,#ececef 100%);
  }
  #onb2-step-profile.active{
    align-items:center !important;
    justify-content:center !important;
    padding:28px;
    box-sizing:border-box;
  }
  #onb2-step-profile .onb2-modal--profile-ref{
    width:min(960px, calc(100vw - 56px));
    height:min(780px, calc(100dvh - 56px));
    min-height:640px;
    display:grid;
    grid-template-columns:minmax(250px, 330px) minmax(430px, 1fr);
    grid-template-rows:auto auto minmax(0, 1fr) auto;
    grid-template-areas:
      "status status"
      "topbar topbar"
      "head form"
      "footer footer";
    column-gap:34px;
    border-radius:34px;
    border:1px solid rgba(17,24,39,.08);
    overflow:hidden;
    box-shadow:0 28px 90px rgba(15,23,42,.16);
  }
  #onb2-step-profile .onb2-modal--profile-ref::before{
    left:-16%;
    right:-16%;
    bottom:-144px;
    height:270px;
    border-radius:60% 60% 0 0 / 46% 46% 0 0;
  }
  #onb2-step-profile .onb2-modal--profile-ref::after{
    top:150px;
    height:150px;
  }
  #onb2-step-profile .onb2-ref-status{
    grid-area:status;
    padding:22px 36px 0;
    font-size:14px;
  }
  #onb2-step-profile .onb2-ref-topbar{
    grid-area:topbar;
    grid-template-columns:44px 1fr 44px;
    padding:20px 36px 6px;
  }
  #onb2-step-profile .onb2-ref-back{
    width:44px;
    height:44px;
    font-size:24px;
    border-radius:14px;
  }
  #onb2-step-profile .onb2-ref-logo{
    width:min(100%, 286px);
  }
  #onb2-step-profile .onb2-ref-profile-head{
    grid-area:head;
    display:flex;
    flex-direction:column-reverse;
    align-items:flex-start;
    justify-content:center;
    gap:24px;
    padding:28px 0 104px 54px;
    text-align:left;
  }
  #onb2-step-profile .onb2-ref-profile-head h2{
    font-size:34px;
    line-height:1.08;
    letter-spacing:-.05em;
  }
  #onb2-step-profile .onb2-ref-profile-head p{
    max-width:290px;
    margin:12px 0 0;
    font-size:15px;
    line-height:1.45;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-ref-avatar{
    width:118px;
    height:118px;
    margin:0;
    box-shadow:0 18px 42px rgba(20,24,32,.10);
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-ref-avatar::before{
    inset:13px auto auto 15px;
    width:50px;
    height:50px;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-ref-avatar span{
    width:90px;
    height:90px;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-role-svg{
    width:76px;
    height:76px;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-ref-avatar i{
    right:8px;
    bottom:8px;
    width:30px;
    height:30px;
  }
  #onb2-step-profile .onb2-ref-profile-scroll{
    grid-area:form;
    height:auto;
    min-height:0;
    overflow:auto;
    padding:26px 54px 110px 0;
    scrollbar-width:thin;
  }
  #onb2-step-profile .onb2-ref-profile-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    padding:24px;
    border-radius:24px;
    background:rgba(255,255,255,.66);
    border:1px solid rgba(17,24,39,.06);
    box-shadow:0 18px 42px rgba(15,23,42,.075);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  #onb2-step-profile .onb2-ref-profile-form label{
    min-width:0;
  }
  #onb2-step-profile .onb2-ref-profile-form label span{
    font-size:11px;
  }
  #onb2-step-profile .onb2-ref-input{
    min-height:56px;
    border-radius:13px;
    padding:14px 42px 14px 16px;
    font-size:15px;
  }
  #onb2-step-profile select.onb2-ref-input{
    background-position:calc(100% - 19px) 25px,calc(100% - 13px) 25px;
  }
  #onb2-step-profile textarea.onb2-ref-input{
    min-height:118px;
    padding-right:16px;
  }
  #onb2-step-profile .onb2-ref-profile-form label i{
    top:34px;
    right:15px;
    font-size:14px;
  }
  #onb2-step-profile .onb2-ref-profile-form label small{
    right:14px;
    bottom:10px;
    font-size:10px;
  }
  #onb2-step-profile .onb2-ref-wide,
  #onb2-step-profile .onb2-ref-note,
  #onb2-step-profile .onb2-ref-services-title,
  #onb2-step-profile .onb2-ref-checks,
  #onb2-step-profile .onb2-ref-add-service{
    grid-column:1 / -1;
  }
  #onb2-step-profile .onb2-ref-services-title{
    margin-top:4px;
    font-size:12px;
  }
  #onb2-step-profile .onb2-ref-checks{
    gap:10px;
  }
  #onb2-step-profile .onb2-ref-check{
    min-height:34px;
    padding:7px 10px;
    border-radius:9px;
  }
  #onb2-step-profile .onb2-ref-check span{
    font-size:11px !important;
  }
  #onb2-step-profile .onb2-ref-add-service{
    min-height:46px;
    border-radius:12px;
    font-size:13px;
  }
  #onb2-step-profile .onb2-ref-note{
    padding:14px 16px;
    border-radius:14px;
    font-size:12px;
  }
  #onb2-step-profile .onb2-ref-footer{
    grid-area:footer;
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    z-index:4;
    padding:0 54px 34px;
    display:flex;
    justify-content:flex-end;
  }
  #onb2-step-profile .onb2-ref-primary{
    width:min(100%, 420px);
    min-height:62px;
    border-radius:14px;
    font-size:17px;
  }
}

@media (min-width:1024px){
  #onb2-step-profile .onb2-modal--profile-ref{
    width:min(1120px, calc(100vw - 80px));
    height:min(800px, calc(100dvh - 80px));
    grid-template-columns:minmax(300px, 390px) minmax(500px, 1fr);
    column-gap:50px;
  }
  #onb2-step-profile .onb2-ref-profile-head{
    padding-left:72px;
  }
  #onb2-step-profile .onb2-ref-profile-head h2{
    font-size:38px;
  }
  #onb2-step-profile .onb2-ref-profile-head p{
    max-width:340px;
    font-size:16px;
  }
  #onb2-step-profile .onb2-ref-profile-scroll{
    padding-right:72px;
  }
  #onb2-step-profile .onb2-ref-profile-form{
    gap:16px;
    padding:28px;
  }
  #onb2-step-profile .onb2-ref-footer{
    padding-left:72px;
    padding-right:72px;
  }
}

@media (min-width:768px) and (max-height:720px){
  #onb2-step-profile.active{
    padding:16px;
  }
  #onb2-step-profile .onb2-modal--profile-ref{
    height:calc(100dvh - 32px);
    min-height:560px;
  }
  #onb2-step-profile .onb2-ref-profile-head{
    padding-top:14px;
    padding-bottom:92px;
    gap:16px;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-ref-avatar{
    width:92px;
    height:92px;
  }
  #onb2-step-profile .onb2-ref-profile-head .onb2-role-svg{
    width:62px;
    height:62px;
  }
  #onb2-step-profile .onb2-ref-profile-scroll{
    padding-top:14px;
    padding-bottom:90px;
  }
  #onb2-step-profile .onb2-ref-profile-form{
    gap:10px;
    padding:18px;
  }
  #onb2-step-profile .onb2-ref-input{
    min-height:50px;
  }
  #onb2-step-profile textarea.onb2-ref-input{
    min-height:88px;
  }
  #onb2-step-profile .onb2-ref-footer{
    padding-bottom:20px;
  }
}


/* ONBOARDING-r29 — validation states for reference profile forms. */
.onb2-ref-input.is-invalid{
  border-color:#ef4444!important;
  box-shadow:0 0 0 3px rgba(239,68,68,.12)!important;
  background:#fffafa!important;
}
.onb2-ref-profile-form label.is-invalid > span,
.onb2-ref-form label.is-invalid > span{
  color:#b91c1c!important;
}
.onb2-ref-error{
  display:block;
  margin-top:6px;
  color:#b91c1c;
  font-size:12px;
  line-height:1.25;
  font-style:normal;
  font-weight:750;
}


/* ONBOARDING-r32 — tablet/wide cleanup for actual quick/profile chain after address removal. */
@media (min-width:768px) and (orientation:portrait){
  #onb2-step-quick.active,
  #onb2-step-profile.active{
    padding:24px;
  }
  #onb2-step-quick .onb2-modal--quick-ref,
  #onb2-step-profile .onb2-modal--profile-ref{
    width:min(860px, calc(100vw - 48px));
    min-height:min(1040px, calc(100dvh - 48px));
  }
  #onb2-step-quick .onb2-modal--quick-ref{
    height:auto;
    display:flex;
    flex-direction:column;
  }
  #onb2-step-quick .onb2-ref-body{
    flex:1 1 auto;
    display:grid;
    grid-template-columns:1fr;
    grid-template-areas:"title" "avatar" "form";
    justify-items:center;
    text-align:center;
    padding:34px 58px 126px;
  }
  #onb2-step-quick .onb2-ref-body h2,
  #onb2-step-quick .onb2-ref-body p{
    text-align:center;
  }
  #onb2-step-quick .onb2-ref-body p{
    margin:12px auto 0;
    max-width:520px;
  }
  #onb2-step-quick .onb2-ref-avatar{
    justify-self:center;
    margin:22px auto 26px;
  }
  #onb2-step-quick .onb2-ref-form--quick{
    width:min(100%, 640px);
    grid-template-columns:1fr 1fr;
  }
  #onb2-step-quick .onb2-ref-footer{
    left:50%;
    right:auto;
    width:min(520px, calc(100% - 96px));
    transform:translateX(-50%);
  }
  #onb2-step-profile .onb2-modal--profile-ref{
    height:auto;
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto minmax(0,1fr) auto;
    grid-template-areas:"status" "topbar" "head" "form" "footer";
  }
  #onb2-step-profile .onb2-ref-profile-head{
    padding:22px 58px 12px;
    align-items:center;
    text-align:center;
    flex-direction:column-reverse;
  }
  #onb2-step-profile .onb2-ref-profile-head p{
    max-width:560px;
    margin-left:auto;
    margin-right:auto;
  }
  #onb2-step-profile .onb2-ref-profile-scroll{
    padding:18px 58px 112px;
  }
  #onb2-step-profile .onb2-ref-profile-form{
    width:min(100%, 680px);
    margin:0 auto;
  }
  #onb2-step-profile .onb2-ref-footer{
    left:50%;
    right:auto;
    width:min(520px, calc(100% - 96px));
    transform:translateX(-50%);
  }
}
@media (min-width:1200px){
  #onb2-step-quick .onb2-modal--quick-ref,
  #onb2-step-profile .onb2-modal--profile-ref{
    width:min(1180px, calc(100vw - 80px));
  }
  #onb2-step-quick .onb2-ref-body{
    grid-template-columns:minmax(360px, 440px) minmax(520px, 1fr);
    column-gap:74px;
  }
  #onb2-step-profile .onb2-modal--profile-ref{
    grid-template-columns:minmax(320px, 410px) minmax(560px, 1fr);
    column-gap:48px;
  }
}
@media (min-width:768px) and (orientation:landscape) and (max-height:680px){
  #onb2-step-quick.active,
  #onb2-step-profile.active{
    padding:10px;
  }
  #onb2-step-quick .onb2-modal--quick-ref,
  #onb2-step-profile .onb2-modal--profile-ref{
    height:calc(100dvh - 20px);
    min-height:0;
    border-radius:24px;
  }
  #onb2-step-quick .onb2-ref-status,
  #onb2-step-profile .onb2-ref-status{padding-top:12px;}
  #onb2-step-quick .onb2-ref-topbar,
  #onb2-step-profile .onb2-ref-topbar{padding-top:12px;padding-bottom:4px;}
  #onb2-step-quick .onb2-ref-body{
    padding-top:12px;
    padding-bottom:88px;
    column-gap:32px;
  }
  #onb2-step-profile .onb2-ref-profile-head{
    padding-top:14px;
    padding-bottom:86px;
  }
  #onb2-step-profile .onb2-ref-profile-scroll{
    padding-top:12px;
    padding-bottom:86px;
  }
  #onb2-step-quick .onb2-ref-form--quick,
  #onb2-step-profile .onb2-ref-profile-form{
    padding:16px;
    gap:10px;
  }
  #onb2-step-quick .onb2-ref-input,
  #onb2-step-profile .onb2-ref-input{
    min-height:48px;
    font-size:14px;
  }
  #onb2-step-quick .onb2-ref-primary,
  #onb2-step-profile .onb2-ref-primary{
    min-height:54px;
  }
}

/* ONBOARDING-r32b — keep large portrait tablets in portrait composition. */
@media (min-width:1200px) and (orientation:portrait){
  #onb2-step-quick .onb2-ref-body{
    grid-template-columns:1fr;
    grid-template-areas:"title" "avatar" "form";
    column-gap:0;
  }
  #onb2-step-profile .onb2-modal--profile-ref{
    grid-template-columns:1fr;
    grid-template-areas:"status" "topbar" "head" "form" "footer";
    column-gap:0;
  }
}

/* === SOURCE: css/flow-system.css === */
/* ═══════════════════════════════════════════════════════════════════
   FLOW SYSTEM — shared auth/onb2 design tokens and components
   v20260422r22
═══════════════════════════════════════════════════════════════════ */
:root {
  --flow-overlay-backdrop:
    radial-gradient(circle at top, rgba(255,107,0,.12), transparent 34%),
    linear-gradient(180deg, rgba(5,8,12,.90), rgba(5,8,12,.95));
  --flow-panel-bg:
    radial-gradient(circle at top right, rgba(255,107,0,.10), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg2) 96%, white 4%), color-mix(in srgb, var(--bg) 92%, #000 8%));
  --flow-panel-border: color-mix(in srgb, var(--line) 82%, rgba(255,255,255,.08));
  --flow-panel-shadow: 0 24px 64px rgba(0,0,0,.28);
  --flow-card-bg:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    radial-gradient(circle at top right, rgba(255,107,0,.08), transparent 34%),
    var(--bg2);
  --flow-card-border: color-mix(in srgb, var(--line) 82%, rgba(255,255,255,.08));
  --flow-card-shadow: 0 18px 40px rgba(0,0,0,.14);
  --flow-radius-panel: 28px;
  --flow-radius-card: 22px;
  --flow-radius-control: 16px;
  --flow-radius-pill: 999px;
  --flow-kicker-bg: rgba(255,107,0,.10);
  --flow-kicker-border: rgba(255,107,0,.20);
  --flow-kicker-color: var(--orange);
  --flow-brand-bg: rgba(255,107,0,.09);
  --flow-brand-border: rgba(255,107,0,.20);
  --flow-field-bg: linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, white 4%), var(--surface));
  --flow-field-border: color-mix(in srgb, var(--line) 88%, rgba(255,255,255,.06));
  --flow-focus-ring: 0 0 0 3px rgba(255,107,0,.14);
  --flow-primary-bg: linear-gradient(180deg, color-mix(in srgb, var(--orange) 92%, white 8%), var(--orange));
  --flow-primary-shadow: 0 14px 28px rgba(255,107,0,.18);
  --flow-secondary-bg: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  --flow-secondary-border: color-mix(in srgb, var(--line) 84%, rgba(255,255,255,.08));
  --flow-chip-bg: rgba(255,107,0,.10);
  --flow-chip-border: rgba(255,107,0,.18);
  --flow-chip-color: var(--text1);
  --flow-chip-soft-bg: rgba(255,255,255,.04);
  --flow-chip-soft-border: var(--line);
  --flow-chip-soft-color: var(--text2);
}

#auth-overlay,
#onb2-overlay {
  background: var(--flow-overlay-backdrop);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.flow-panel,
.auth-modal,
.onb2-modal {
  background: var(--flow-panel-bg);
  border: 1px solid var(--flow-panel-border);
  box-shadow: var(--flow-panel-shadow);
}

.auth-modal {
  border-radius: var(--flow-radius-panel);
  overflow: hidden;
}

.onb2-modal {
  border: none;
  box-shadow: none;
}

.flow-brandbar,
.auth-logo,
.onb2-headbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.auth-logo-box,
.onb2-brandbox {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.flow-brandmark,
.auth-logo-icon,
.onb2-brandmark {
  width: 46px;
  height: 46px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-radius-md,10px);
  background: var(--flow-brand-bg);
  border: 1px solid var(--flow-brand-border);
  box-shadow: 0 12px 24px rgba(255,107,0,.10);
}

.auth-logo-copy,
.onb2-brandcopy { min-width: 0; }

.onb2-brand-logo {
  display: block;
  width: min(100%, 220px);
  max-width: 220px;
  height: auto;
  object-fit: contain;
}

.flow-brandtitle,
.auth-logo-name,
.onb2-brandtext {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  line-height: 1.05;
  font-weight: 700;
  color: var(--text1);
}

.flow-brandsub,
.auth-logo-sub,
.onb2-brandsub {
  margin-top: 4px;
  font-size: 12px;
  color: var(--text3);
}

.flow-icon-btn,
.auth-close-btn,
.onb2-close-btn {
  width: 42px;
  min-width: 42px;
  height: 42px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--flow-secondary-border);
  background: rgba(255,255,255,.03);
  color: var(--text2);
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}
.flow-icon-btn:hover,
.flow-icon-btn:focus-visible,
.auth-close-btn:hover,
.auth-close-btn:focus-visible,
.onb2-close-btn:hover,
.onb2-close-btn:focus-visible {
  border-color: rgba(255,107,0,.30);
  color: var(--orange);
  background: rgba(255,107,0,.08);
  outline: none;
}

.flow-kicker,
.auth-pill,
.onb2-modal-kicker,
.onb2-meta-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: var(--flow-radius-pill);
  background: var(--flow-kicker-bg);
  border: 1px solid var(--flow-kicker-border);
  color: var(--flow-kicker-color);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.auth-pill--soft,
.onb2-meta-pill--soft {
  background: var(--flow-chip-soft-bg);
  border-color: var(--flow-chip-soft-border);
  color: var(--flow-chip-soft-color);
  font-weight: 700;
}

.auth-step-meta,
.onb2-modal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.flow-title,
.auth-title,
.onb2-modal-title {
  margin-top: 4px;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(22px, 2.2vw, 34px);
  line-height: 1.08;
  font-weight: 700;
  color: var(--text1);
}

.flow-sub,
.auth-sub,
.onb2-modal-sub {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--text2);
}

.flow-label,
.auth-label {
  font-size: 11px;
  font-weight: 800;
  color: var(--text3);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 8px;
  display: block;
}

.flow-input,
.auth-input {
  width: 100%;
  background: var(--flow-field-bg);
  border: 1px solid var(--flow-field-border);
  border-radius: var(--flow-radius-control);
  padding: 13px 16px;
  font-size: 16px;
  color: var(--text1);
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.flow-input:focus,
.auth-input:focus {
  border-color: rgba(255,107,0,.34);
  box-shadow: var(--flow-focus-ring);
}

.flow-btn,
.auth-btn,
.onb2-continue-btn,
.onb2-back-btn,
.auth-back-btn {
  min-height: 50px;
  border-radius: var(--ui-radius-md,10px);
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease, opacity .18s ease;
}
.flow-btn--primary,
.auth-btn,
.onb2-continue-btn {
  background: var(--flow-primary-bg);
  color: #fff;
  border: none;
  box-shadow: var(--flow-primary-shadow);
}
.flow-btn--secondary,
.onb2-back-btn,
.auth-back-btn {
  background: var(--flow-secondary-bg);
  color: var(--text2);
  border: 1px solid var(--flow-secondary-border);
}
.flow-btn--primary:hover,
.auth-btn:hover,
.onb2-continue-btn:hover,
.flow-btn--secondary:hover,
.onb2-back-btn:hover,
.auth-back-btn:hover {
  transform: translateY(-1px);
}
.flow-btn--primary:disabled,
.auth-btn:disabled,
.onb2-continue-btn:disabled,
.auth-back-btn:disabled,
.onb2-back-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.flow-card,
.onb2-role-card,
.onb2-profile-card,
.onb2-spec-card {
  border-radius: var(--flow-radius-card);
  border: 1px solid var(--flow-card-border);
  background: var(--flow-card-bg);
  box-shadow: var(--flow-card-shadow);
}

.flow-chip,
.onb2-role-feat,
.onb2-profile-chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border-radius: var(--flow-radius-pill);
  background: var(--flow-chip-bg);
  border: 1px solid var(--flow-chip-border);
  color: var(--flow-chip-color);
  font-size: 11px;
  font-weight: 700;
}
.onb2-profile-chip--soft {
  background: var(--flow-chip-soft-bg);
  border-color: var(--flow-chip-soft-border);
  color: var(--flow-chip-soft-color);
}

.auth-shell { display: flex; flex-direction: column; gap: 24px; }
.auth-step { display: none; }
.auth-step.active { display: block; animation: fadeIn .25s var(--ease) both; }
.auth-step-head { display: flex; flex-direction: column; gap: 0; }
.auth-back-btn { margin-bottom: 18px; padding: 0 16px; }
.auth-close-btn { margin-left: auto; }
.auth-logo { margin-bottom: 0; }
.auth-btn { width: 100%; padding: 14px 16px; }
.auth-logo-sub { white-space: nowrap; }
.auth-input--phone { border-radius: var(--ui-radius-lg,18px); }
.auth-step--success .auth-step-meta { justify-content: center; }
.auth-step--success .auth-title,
.auth-step--success .auth-sub { text-align: center; }

@media (max-width: 679px) {
  .flow-brandmark,
  .auth-logo-icon,
  .onb2-brandmark {
    width: 40px;
    height: 40px;
    border-radius: var(--ui-radius-md,10px);
  }
  .flow-brandtitle,
  .auth-logo-name,
  .onb2-brandtext { font-size: 18px; }
  .flow-brandsub,
  .auth-logo-sub,
  .onb2-brandsub { font-size: 11px; }
  .flow-kicker,
  .auth-pill,
  .onb2-modal-kicker,
  .onb2-meta-pill { min-height: 28px; padding: 0 10px; font-size: 10px; }
  .flow-title,
  .auth-title,
  .onb2-modal-title { font-size: 22px; }
  .flow-sub,
  .auth-sub,
  .onb2-modal-sub { font-size: 13px; }
  .auth-logo-sub { display: none; }
  .auth-step-meta { margin-top: 12px; }
}

/* === SOURCE: css/roles.css === */
/* ══════════════════════════ ROLE STYLES ══════════════════════════ */

/* Role badge pill */
.rbadge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;
  font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}
.rbadge.guest  {background:rgba(82,82,90,.18); color:#a0a0a8;border:1px solid rgba(82,82,90,.3)}
.rbadge.client {background:rgba(96,165,250,.12);color:#60a5fa;border:1px solid rgba(96,165,250,.25)}
.rbadge.master {background:rgba(52,211,153,.12);color:#34d399;border:1px solid rgba(52,211,153,.25)}
.rbadge.admin  {background:rgba(245,158,11,.12);color:#f59e0b;border:1px solid rgba(245,158,11,.25)}
.rbadge.owner  {background:rgba(255,107,0,.12); color:#FF6B00;border:1px solid rgba(255,107,0,.28)}

/* Avatar ring by role */
.nav-avatar.r-client{box-shadow:0 0 0 2px #60a5fa}
.nav-avatar.r-master{box-shadow:0 0 0 2px #34d399}
.nav-avatar.r-admin {box-shadow:0 0 0 2px #f59e0b}
.nav-avatar.r-owner {box-shadow:0 0 0 2px #FF6B00}

/* Drawer role footer */
.drawer-role-footer{padding:16px 20px;border-top:1px solid var(--line);
  display:flex;align-items:center;gap:12px}
.drf-av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;flex-shrink:0}
.drf-av.guest {background:var(--surface);color:var(--text3)}
.drf-av.client{background:rgba(96,165,250,.15);color:#60a5fa}
.drf-av.master{background:rgba(52,211,153,.15);color:#34d399}
.drf-av.admin {background:rgba(245,158,11,.15);color:#f59e0b}
.drf-av.owner {background:rgba(255,107,0,.12); color:#FF6B00}
.drf-name{font-size:14px;font-weight:700}
.drf-btn{margin-left:auto;padding:6px 13px;border-radius:var(--ui-radius-sm,5px);font-size:12px;font-weight:600;
  background:var(--orange-dim);border:1px solid var(--orange-brd);color:var(--orange);
  cursor:pointer;transition:.2s var(--ease);white-space:nowrap}
.drf-btn:hover{background:rgba(255,107,0,.2)}

/* Locked page */
.locked-wrap{min-height:55vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:48px 20px;gap:14px}
.locked-ico{font-size:54px;opacity:.35}
.locked-title{font-family:'Oswald',sans-serif;font-size:22px;font-weight:700}
.locked-sub{font-size:14px;color:var(--text2);max-width:300px;line-height:1.65}

/* ── MASTER DASHBOARD ── */
.mast-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}
.mast-stat{padding:16px 18px;border-radius:var(--ui-radius-sm,5px)}
.mast-stat-num{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;color:var(--orange)}
.mast-stat-lbl{font-size:11px;color:var(--text3);margin-top:3px;font-weight:600;text-transform:uppercase;letter-spacing:1px}
.mast-stat-ch{font-size:11px;color:var(--green);margin-top:2px}

.sched-list{display:flex;flex-direction:column;gap:10px}
.sched-slot{display:grid;grid-template-columns:60px 1fr auto;gap:14px;
  align-items:center;padding:14px 18px;border-radius:var(--ui-radius-sm,5px)}
.sched-time{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;
  color:var(--orange);line-height:1}
.sched-sub{font-size:10px;color:var(--text3);font-family:'Mulish',sans-serif;margin-top:2px}
.sched-name{font-weight:700;font-size:14px;margin-bottom:2px}
.sched-svc{font-size:12px;color:var(--text2)}
.sched-car{font-size:11px;color:var(--text3);margin-top:2px}
.sched-btn{padding:7px 14px;border-radius:var(--ui-radius-sm,5px);font-size:11px;font-weight:700;
  cursor:pointer;transition:.2s var(--ease);white-space:nowrap}
.sched-btn.go  {background:var(--orange-dim);color:var(--orange);border:1px solid var(--orange-brd)}
.sched-btn.go:hover{background:rgba(255,107,0,.2)}
.sched-btn.done{background:rgba(34,197,94,.1);color:var(--green);border:1px solid rgba(34,197,94,.25)}
.sched-free{font-size:13px;color:var(--text3);font-style:italic}

/* ── OWNER PANEL ── */
.owner-hero{background:linear-gradient(135deg,rgba(255,107,0,.07),transparent);
  border-bottom:1px solid var(--orange-brd);padding:44px 0 0}
.owner-tabs{display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
.owner-tabs::-webkit-scrollbar{display:none}
.owner-tab{font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;padding:12px 20px;color:var(--text2);border-bottom:2px solid transparent;
  transition:.2s var(--ease);white-space:nowrap;flex-shrink:0;cursor:pointer}
.owner-tab:hover{color:var(--text)}
.owner-tab.active{color:var(--orange);border-bottom-color:var(--orange)}
.owner-pane{display:none;padding:32px 0;animation:pageIn .25s var(--ease) both}
.owner-pane.active{display:block}

.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}
.kpi-card{padding:20px;border-radius:var(--ui-radius-sm,5px)}
.kpi-emo{font-size:18px;margin-bottom:10px}
.kpi-lbl{font-size:10px;font-weight:700;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:6px}
.kpi-num{font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;line-height:1}
.kpi-ch{font-size:11px;margin-top:4px}
.kpi-ch.up{color:var(--green)}.kpi-ch.flat{color:var(--text3)}

.bar-row{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.bar-label{font-size:13px;font-weight:600;min-width:180px}
.bar-track{flex:1;height:7px;background:var(--surface2);border-radius:99px;overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange-l));border-radius:99px}
.bar-val{font-family:'Oswald',sans-serif;font-size:13px;color:var(--orange);min-width:80px;text-align:right}

/* Staff table */
.staff-wrap{border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);overflow:hidden;overflow-x:auto}
.staff-tbl{width:100%;border-collapse:collapse;min-width:540px}
.staff-tbl th{padding:11px 16px;background:var(--surface2);text-align:left;
  font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--text3)}
.staff-tbl td{padding:13px 16px;font-size:13px;border-top:1px solid var(--line);vertical-align:middle}
.staff-tbl tbody tr:hover td{background:rgba(255,255,255,.02)}
.role-sel{background:var(--surface);border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);
  padding:5px 10px;font-size:12px;color:var(--text);cursor:pointer;outline:none;
  transition:.2s var(--ease);font-family:'Mulish',sans-serif}
.role-sel:focus{border-color:var(--orange-brd)}

/* Permission matrix */
.perm-wrap{border:1px solid var(--line);border-radius:var(--ui-radius-sm,5px);overflow:hidden;overflow-x:auto}
.perm-tbl{width:100%;border-collapse:collapse;min-width:480px}
.perm-tbl th,.perm-tbl td{padding:10px 14px;border:1px solid var(--line);font-size:12px}
.perm-tbl th{background:var(--surface2);color:var(--text3);font-weight:700;
  letter-spacing:1px;text-transform:uppercase;white-space:nowrap}
.perm-tbl td:first-child{font-weight:600;color:var(--text2);background:rgba(255,255,255,.02)}
.perm-yes{color:var(--green);font-size:16px;display:block;text-align:center}
.perm-no {color:var(--text3);font-size:14px;display:block;text-align:center}

/* Section block */
.owner-block{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);padding:24px;margin-bottom:20px}
.owner-block-title{font-family:'Oswald',sans-serif;font-size:14px;font-weight:600;
  text-transform:uppercase;letter-spacing:1px;color:var(--orange);margin-bottom:18px;
  display:flex;align-items:center;gap:8px}

/* Responsive */
@media(max-width:900px){
  .kpi-grid{grid-template-columns:repeat(2,1fr)}
  .mast-stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:560px){
  .kpi-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .kpi-num{font-size:20px}
  .mast-stats{grid-template-columns:repeat(2,1fr);gap:8px}
  .sched-slot{grid-template-columns:52px 1fr;grid-template-rows:auto auto}
  .sched-btn{grid-column:2;margin-top:4px}
  .bar-label{min-width:120px;font-size:12px}
}

/* ── Staff panel role selector ─────────────────── */
.role-sel {
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 5px 10px;
  font-size: 12px;
  color: var(--text);
  font-family: 'Mulish', sans-serif;
  cursor: pointer;
  outline: none;
  transition: border-color .2s;
}
.role-sel:focus { border-color: var(--orange); }
.role-sel:hover { border-color: var(--orange-brd); }

/* ── Staff filter row active ────────────────────── */
.admin-filter-btn.active {
  background: var(--orange);
  color: #fff;
  border-color: var(--orange);
}

/* ── Add user modal fields ──────────────────────── */
.owiz-field { margin-bottom: 12px; }
.owiz-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
}
.owiz-input {
  width: 100%;
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-sm,5px);
  padding: 10px 12px;
  font-size: 14px;
  color: var(--text);
  font-family: 'Mulish', sans-serif;
  outline: none;
  transition: border-color .2s;
  box-sizing: border-box;
}
.owiz-input:focus { border-color: var(--orange); }

/* === SOURCE: css/mobile.css === */
/* ══════════════════════════════════════════════════
   KARETA.KZ — Mobile Web App Layer
══════════════════════════════════════════════════ */

:root {
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
  --bnav-bar: 60px;
  --bnav-h: calc(var(--bnav-bar) + var(--safe-b));
  --tap: 44px;
  --r: 12px;
}

* { -webkit-tap-highlight-color: transparent; }
input, select, textarea { touch-action: manipulation; }

/* ══════ BOTTOM NAV ══════ */
@media (max-width: 900px) {
  :root { --bottom-nav-h: var(--bnav-h); }

  #bottom-nav {
    display: flex;
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 900;
    background: rgba(13,13,15,.95);
    backdrop-filter: blur(28px) saturate(1.6);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    border-top: 1px solid rgba(255,255,255,.07);
    box-shadow: 0 -4px 30px rgba(0,0,0,.5);
    padding-bottom: var(--safe-b);
    transform: translateZ(0);
  }
  .bnav-inner {
    height: var(--bnav-bar); display: flex; align-items: center;
    width: 100%; padding: 0 6px; gap: 2px;
  }
  .bnav-item {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 3px; padding: 6px 4px 7px;
    min-height: var(--bnav-bar);
    border-radius: var(--ui-radius-md,10px);
    color: rgba(140,140,150,.65);
    cursor: pointer; position: relative;
    transition: color .15s ease;
    -webkit-user-select: none; user-select: none;
  }
  .bnav-item:active {
    background: rgba(255,255,255,.07);
    transform: scale(.92);
    transition: transform .08s ease;
  }
  .bnav-item.active { color: var(--orange); }
  .bnav-item.active .bnav-icon-wrap {
    /* background: rgba(255,107,0,.15); */
    border-radius: var(--ui-radius-md,10px);
  }
  .bnav-item.active .bnav-icon-wrap::after { display: none; }
  .bnav-icon-wrap {
    width: 40px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--ui-radius-md,10px); position: relative;
    transition: background .15s ease;
  }
  .bnav-icon {
    font-size: 14px;
    line-height: 1;
    transition: transform .22s cubic-bezier(.34,1.56,.64,1);
  }
  .bnav-item.active .bnav-icon { transform: scale(1.18) translateY(-1px); }
  .bnav-label {
    font-size: 9.5px; font-weight: 700;
    letter-spacing: .3px; line-height: 1; text-align: center;
  }
  .bnav-badge {
    position: absolute; top: -4px; right: -4px;
    min-width: 16px; height: 16px; padding: 0 4px;
    background: var(--orange); color: #fff;
    font-size: 8px; font-weight: 800; border-radius: 99px;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid rgba(13,13,15,.95); line-height: 1;
  }
  #app { padding-bottom: var(--bnav-h) !important; }
  footer { display: none; }
}

/* ══════ TOP NAV ══════ */
@media (max-width: 900px) {
  :root { --nav-h: 54px; }
  .nav-phone { display: none; }
  .nav-logo-text { font-size: 16px; }
  .nav-logo-sub  { font-size: 8px; }
  .nav-avatar { width: 34px; height: 34px; font-size: 14px; }
  .nav-avatar:active { transform: scale(.9); transition: transform .1s; }
  .burger {
    display: flex; width: var(--tap); height: var(--tap);
    border-radius: var(--ui-radius-md,10px); padding: 10px; margin-right: -6px;
  }
  .burger:active { background: rgba(255,255,255,.08); }
}

/* ══════ DRAWER — bottom sheet ══════ */
@media (max-width: 900px) {
  #drawer-overlay {
    display: none; position: fixed; inset: 0;
    z-index: 798; background: rgba(0,0,0,.6);
    backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
    opacity: 0; transition: opacity .3s ease;
  }
  #drawer-overlay.vis { display: block; opacity: 1; }

  #drawer {
    top: auto; bottom: 0; left: 0; right: 0; width: 100%;
    max-height: 82dvh;
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
    border-right: none;
    border-top: 1px solid rgba(255,255,255,.09);
    transform: translateY(100%);
    transition: transform .32s cubic-bezier(.16,1,.3,1);
    overflow-y: auto; overflow-x: hidden;
    padding-bottom: calc(var(--safe-b) + 16px);
    z-index: 800;
  }
  #drawer.open { transform: translateY(0); }

  /* Ручка */
  .drawer-handle {
    width: 38px; height: 4px;
    background: rgba(255,255,255,.18);
    border-radius: 99px;
    margin: 14px auto 6px;
  }

  .drawer-link {
    min-height: 52px; padding: 0 22px;
    font-size: 15px; display: flex; align-items: center; gap: 14px;
  }
  .drawer-link:active { background: rgba(255,255,255,.055); }
  .dl-icon { font-size: 18px; width: 26px; text-align: center; flex-shrink: 0; }
  .drawer-role-footer { padding: 14px 20px; }
  .drf-av  { width: 38px; height: 38px; font-size: 15px; }
  .drf-btn { min-height: var(--tap); padding: 8px 16px; }
  .drawer-phone  { font-size: 20px; }
}

/* ══════ КНОПКИ ══════ */
@media (max-width: 900px) {
  .btn-primary:hover,
  .btn-outline:hover { transform: none !important; box-shadow: none !important; }
  .card:hover        { transform: none !important; box-shadow: none !important; border-color: var(--line) !important; }

  .btn  { touch-action: manipulation; border-radius: var(--r); }
  .btn:active  { opacity: .78; transform: scale(.96) !important; transition: .09s ease; }
  .card:active { transform: scale(.98) !important; transition: .09s ease; }

  .hero-btns { flex-direction: column; gap: 10px; width: 100%; }
  .hero-btns .btn {
    width: 100%; justify-content: center;
    min-height: 50px; font-size: 14px; padding: 14px 20px;
  }
  .act-btn    { min-height: 36px; padding: 6px 14px; border-radius: var(--ui-radius-sm,5px); }
  .logout-btn { min-height: 36px; }
  .sched-btn  { min-height: 38px; padding: 8px 16px; border-radius: var(--ui-radius-sm,5px); }

  /* micro-press на карточках */
  .st-card:active, .rv-card:active, .hv-card:active { transform: scale(.97) !important; transition: .08s ease !important; }
  .hist-item:active, .notif-item:active { opacity: .7; transition: opacity .08s; }
}

/* ══════ ФОРМЫ / inputs ══════ */
@media (max-width: 900px) {
  /* 16px — iOS не масштабирует */
  input:not([type=checkbox]):not([type=radio]), select, textarea {
    font-size: 16px !important;
    border-radius: var(--r);
    min-height: var(--tap);
  }
  textarea { min-height: 88px; }

  .otp-box   { width: 60px !important; height: 64px !important; font-size: 26px !important; border-radius: var(--ui-radius-md,10px) !important; }
  .otp-row   { gap: 10px; }

  /* Auth как bottom sheet disabled: centered modal retained */
  /* #auth-overlay { align-items: flex-end !important; } */
  .auth-modal {
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important; border: none !important;
    border-top: 1px solid rgba(255,255,255,.09) !important;
    max-height: 92dvh; overflow-y: auto;
    padding: 20px 20px calc(var(--safe-b) + 20px) !important;
    width: 100% !important; max-width: 100% !important;
  }
  .auth-btn { min-height: 52px; border-radius: var(--r); font-size: 15px; }
  .auth-btn:active { opacity: .78; transform: scale(.97); transition: .08s ease; }
  .pf-input { border-radius: var(--r); }
  .pf-save  { min-height: 50px; width: 100%; justify-content: center; }
}

/* ══════ КАБИНЕТ ══════ */
@media (max-width: 900px) {
  .cab-profile-row { padding: 20px 16px 0; gap: 12px; flex-wrap: wrap; }
  .cab-avatar { width: 54px; height: 54px; font-size: 21px; flex-shrink: 0; }

  .cab-tabs {
    display: flex; overflow-x: auto; scrollbar-width: none;
    padding: 0 8px; border-bottom: 1px solid var(--line);
    -webkit-overflow-scrolling: touch;
  }
  .cab-tabs::-webkit-scrollbar { display: none; }
  .cab-tab {
    min-height: 46px; padding: 0 16px;
    white-space: nowrap; flex-shrink: 0; font-size: 13px;
  }
  .cab-tab:active { opacity: .7; }

  .hist-item { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; }
  .hist-price { align-self: flex-start; }
  .notif-item { padding: 14px 14px; }
  .profile-form { padding: 20px 16px; }
  .pf-group { margin-bottom: 16px; }
}

/* ══════ BOOKING ══════ */
@media (max-width: 900px) {
  .booking-layout { grid-template-columns: 1fr; }
  .booking-summary { display: none; }
  .bform-card { padding: 20px 16px; border-radius: var(--ui-radius-md,10px); }
  .bform-row  { grid-template-columns: 1fr; gap: 12px; }

  .service-chips { gap: 8px; }
  .svc-chip {
    flex: 1; min-width: calc(50% - 4px);
    min-height: 46px; justify-content: center;
    border-radius: var(--ui-radius-md,10px); font-size: 13px;
  }
  .svc-chip:active { transform: scale(.95); opacity: .8; transition: .08s; }

  /* Даты — горизонтальный скролл */
  .date-grid {
    overflow-x: auto;
    gap: 8px;
    scrollbar-width: none;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }
  .date-grid::-webkit-scrollbar { display: none; }
  .date-btn {
    flex-shrink: 0; min-width: 58px; min-height: 58px;
    border-radius: var(--ui-radius-md,10px); display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 1px;
  }
  .date-btn:active { transform: scale(.92); transition: .08s; }

  .time-grid { grid-template-columns: repeat(4,1fr); gap: 8px; }
  .time-btn  { min-height: var(--tap); border-radius: var(--ui-radius-md,10px); font-size: 14px; }
  .time-btn:active { transform: scale(.92); transition: .08s; }

  .booking-steps { padding: 16px 16px 12px; gap: 0; }
  .bstep-num  { width: 22px; height: 22px; font-size: 9px; }
  .bstep-label { font-size: 10px; }
  .bstep-line  { min-width: 14px; }

  .bform-nav { flex-direction: row; gap: 10px; margin-top: 20px; }
  .bform-nav .btn { flex: 1; justify-content: center; min-height: 50px; }
}

/* ══════ CHAT ══════ */
@media (max-width: 900px) {
  /* Chat и Notifs панели — bottom sheet, управляется JS */
  .chat-input { font-size: 16px !important; }
  .qr-btn:active { opacity: .7; }
}

/* ══════ ADMIN ══════ */
@media (max-width: 900px) {
  .admin-layout { flex-direction: column; min-height: auto; }
  .admin-sidebar {
    position: sticky; top: var(--nav-h); z-index: 50;
    width: 100%; height: auto; flex-direction: row;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
    padding: 6px 8px; border-right: none;
    border-bottom: 1px solid var(--line); gap: 4px;
    display: flex; -webkit-overflow-scrolling: touch;
  }
  .admin-sidebar::-webkit-scrollbar { display: none; }
  .admin-sidebar > div:last-child { display: none; }
  .admin-nav-label { display: none; }
  .admin-nav-item {
    flex-direction: column; gap: 3px; padding: 7px 10px;
    border-left: none !important; border-bottom: 2.5px solid transparent;
    border-radius: var(--ui-radius-sm,5px); white-space: nowrap; font-size: 10px;
    min-width: var(--tap); min-height: var(--tap);
    justify-content: center; flex-shrink: 0;
  }
  .admin-nav-item.active {
    border-bottom-color: var(--orange); background: var(--orange-dim);
    color: var(--orange); border-left-color: transparent !important;
  }
  .admin-nav-item:active { background: rgba(255,255,255,.06); }
  .admin-nav-icon { font-size: 18px; }
  .admin-content  { padding: 16px; }
  .admin-stats-grid    { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .admin-quick-actions { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .admin-filters   { flex-wrap: wrap; gap: 6px; }
  .admin-filter-btn { min-height: 36px; padding: 6px 12px; }
  .admin-search { width: 100%; margin-left: 0; font-size: 16px !important; }
}

/* ══════ MASTER ══════ */
@media (max-width: 900px) {
  .mast-stats { grid-template-columns: repeat(3,1fr); gap: 8px; }
  .mast-stat  { padding: 12px 10px; }
  .mast-stat-num { font-size: 18px; }
  .sched-slot { grid-template-columns: 52px 1fr; grid-template-rows: auto auto; gap: 6px 12px; padding: 12px 14px; }
  .sched-btn  { grid-column: 2; align-self: start; }
}

/* ══════ OWNER ══════ */
@media (max-width: 900px) {
  .kpi-grid { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .kpi-card { padding: 14px 14px; }
  .kpi-num  { font-size: 20px; }
  .owner-tabs { padding: 0 6px; overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; }
  .owner-tabs::-webkit-scrollbar { display: none; }
  .owner-tab  { min-height: 44px; padding: 0 14px; flex-shrink: 0; white-space: nowrap; font-size: 11px; }
  .owner-tab:active { opacity: .7; }
  .staff-tbl th, .staff-tbl td { padding: 10px 12px; font-size: 12px; }
  .bar-label { min-width: 100px; font-size: 12px; }
  .perm-tbl th, .perm-tbl td { padding: 8px 8px; font-size: 11px; }
}

/* ══════ HERO / СЕКЦИИ ══════ */
@media (max-width: 560px) {
  section    { padding: 48px 0; }
  .container { padding: 0 16px; }
  .hero-title { font-size: clamp(34px,9vw,46px) !important; }
  .hero-desc  { font-size: 14px; }
  .hero-stats {
    display: grid; grid-template-columns: repeat(4,1fr); gap: 0;
    border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px);
    overflow: hidden; background: var(--surface);
  }
  .hero-stats > div {
    padding: 12px 6px; text-align: center;
    border-right: 1px solid var(--line);
  }
  .hero-stats > div:last-child { border-right: none; }
  .stat-num { font-size: 16px; }
  .stat-lbl { font-size: 9px; }
  .st-grid  { grid-template-columns: 1fr 1fr; gap: 10px; }
  .st-card  { padding: 14px 12px; }
  .st-emoji { font-size: 22px; }
  .cta-t     { font-size: 22px; }
  .cta-phone { font-size: 24px; }
  .cta-meta  { flex-direction: column; gap: 5px; font-size: 12px; }
}

/* ══════ PWA standalone ══════ */
@media (display-mode: standalone) {
  #nav { padding-top: var(--safe-t); height: calc(var(--nav-h) + var(--safe-t)); }
  #app { padding-top: calc(var(--nav-h) + var(--safe-t)) !important; }
}

/* ══════ Landscape phone ══════ */
@media (max-width: 900px) and (orientation: landscape) {
  :root  { --bnav-bar: 50px; }
  .bnav-icon  { font-size: 18px; }
  .bnav-label { font-size: 9px;  }
  section { padding: 32px 0; }
}


@media (max-width: 900px) {
  #notifs-fab {
    right: 14px;
    bottom: calc(var(--bottom-nav-h) + 12px);
    width: 56px;
    height: 56px;
  }
}


/* r185: account tabs as two-column action cards */
@media (max-width: 900px){
  .cab-tabs.cab-tabs--cards{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    padding:0 16px 16px;
    border-bottom:0;
    overflow:visible;
  }
  .cab-tabs.cab-tabs--cards .cab-tab{
    min-height:96px;
    padding:14px;
    white-space:normal;
    flex-shrink:1;
    border-radius:var(--ui-radius-lg,18px);
    font-size:14px;
    display:flex;
    align-items:flex-start;
    gap:10px;
  }
  .cab-tabs.cab-tabs--cards .cab-tab-icon{
    width:38px;
    height:38px;
    border-radius:var(--ui-radius-md,10px);
    font-size:20px;
  }
  .cab-tabs.cab-tabs--cards .cab-tab-title{font-size:18px}
  .cab-tabs.cab-tabs--cards .cab-tab-desc{font-size:12px}
}
@media (max-width: 380px){
  .cab-tabs.cab-tabs--cards{grid-template-columns:1fr}
}

/* === SOURCE: css/mobile_v2.css === */
/* ═══════════════════════════════════════════════════════════════
   KARETA.KZ — MOBILE MASTER STYLESHEET v2
   Полная адаптация под телефоны. Подключается последним.
   Breakpoints: 900px (tablet+), 600px (phone), 430px (small phone), 360px (mini)
═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────
   0. ГЛОБАЛ
───────────────────────────────────────── */
@media (max-width: 900px) {
  /* Блокируем iOS-zoom на фокусе */
  input:not([type=checkbox]):not([type=radio]),
  select, textarea {
    font-size: 16px !important;
    touch-action: manipulation;
  }

  /* Минимальные tap-цели */
  .btn, button, a.btn, [role=button] { min-height: 44px; }

  /* Убираем hover-состояния — на touch они «залипают» */
  .btn-primary:hover,
  .btn-outline:hover,
  .btn-ghost:hover { transform: none !important; box-shadow: none !important; }
  .card:hover,
  .rv-card:hover,
  .hv-card:hover,
  .st-card:hover,
  .part-card:hover,
  .svc-full-card:hover { transform: none !important; box-shadow: inherit !important; border-color: var(--line) !important; }

  /* Tap-активные состояния */
  .btn:active   { opacity: .74; transform: scale(.95) !important; transition: .07s ease !important; }
  .card:active  { transform: scale(.97) !important; transition: .07s ease !important; }
  .bnav-item:active { transform: scale(.90); transition: .07s ease; }
}

/* ─────────────────────────────────────────
   1. КОНТЕЙНЕР / СЕКЦИИ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .container { padding: 0 16px; }
  section    { padding: 40px 0; }
}
@media (max-width: 430px) {
  .container { padding: 0 14px; }
  section    { padding: 32px 0; }
}

/* ─────────────────────────────────────────
   2. ТОП-НАВ И DRAWER
───────────────────────────────────────── */
@media (max-width: 900px) {
  :root { --nav-h: 54px; }
  .nav-phone   { display: none; }
  .nav-logo-text { font-size: 16px; }
  .nav-logo-sub  { font-size: 8px; }
  .nav-avatar  { width: 34px; height: 34px; font-size: 14px; }

  /* Drawer — bottom sheet */
  #drawer-overlay { display: none; position: fixed; inset: 0; z-index: 798; background: rgba(0,0,0,.6); backdrop-filter: blur(3px); opacity: 0; transition: opacity .3s; }
  #drawer-overlay.vis { display: block; opacity: 1; }
  #drawer {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-height: 82dvh;
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
    border-right: none;
    border-top: 1px solid rgba(255,255,255,.09);
    transform: translateY(100%);
    transition: transform .32s cubic-bezier(.16,1,.3,1);
    overflow-y: auto;
    padding-bottom: calc(var(--safe-b, 0px) + 0px);
    z-index: 906;
  }
  #drawer.open { transform: translateY(0); }
  .drawer-link { min-height: 52px; padding: 0 22px; font-size: 15px; gap: 14px; }
  .drawer-link:active { background: rgba(255,255,255,.055); }
}

/* ─────────────────────────────────────────
   3. НИЖНЯЯ НАВИГАЦИЯ
───────────────────────────────────────── */
@media (max-width: 900px) {
  :root { --bnav-bar: 60px; --bnav-h: calc(60px + var(--safe-b, 0px)); }
  #bottom-nav {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 900;
    background: rgba(13,13,15,.96); backdrop-filter: blur(28px) saturate(1.6);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    border-top: 1px solid rgba(255,255,255,.07);
    box-shadow: 0 -4px 30px rgba(0,0,0,.5);
    padding-bottom: var(--safe-b, 0px);
  }
  .bnav-inner { height: var(--bnav-bar); display: flex; align-items: center; width: 100%; padding: 0 4px; gap: 2px; }
  .bnav-item {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; padding: 6px 4px 7px; min-height: var(--bnav-bar);
    border-radius: var(--ui-radius-md,10px); color: rgba(140,140,150,.65); cursor: pointer;
    transition: color .15s; -webkit-user-select: none; user-select: none;
  }
  .bnav-item.active { color: var(--orange); }
  .bnav-item.active .bnav-icon-wrap {/* background: rgba(255,107,0,.15); */border-radius: var(--ui-radius-md,10px);}
  .bnav-icon-wrap { width: 40px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: var(--ui-radius-md,10px); position: relative; transition: background .15s; }
  .bnav-icon {font-size: 14px;line-height: 1;transition: transform .22s cubic-bezier(.34,1.56,.64,1);}
  .bnav-item.active .bnav-icon { transform: scale(1.18) translateY(-1px); }
  .bnav-label { font-size: 9.5px; font-weight: 700; letter-spacing: .3px; line-height: 1; text-align: center; }
  .bnav-badge { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; background: var(--orange); color: #fff; font-size: 8px; font-weight: 800; border-radius: 99px; display: flex; align-items: center; justify-content: center; border: 2px solid rgba(13,13,15,.95); }
  #app { padding-bottom: var(--bnav-h, 60px) !important; }
  footer { display: none; }
  #notifs-fab { right: 14px; bottom: calc(var(--bnav-h, 60px) + 12px); width: 52px; height: 52px; }
  #scroll-top { bottom: calc(var(--bnav-h, 60px) + 12px); right: 12px; width: 42px; height: 42px; font-size: 16px; }
}
@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px) {
  :root { --bnav-bar: 50px; }
  .bnav-icon { font-size: 18px; }
  .bnav-label { font-size: 9px; }
}

/* ─────────────────────────────────────────
   4. АВТОРИЗАЦИЯ — bottom sheet
───────────────────────────────────────── */
@media (max-width: 900px) {
  #auth-overlay { align-items: flex-end !important; padding: 0 !important; }
  .auth-modal {
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
    border: none !important;
    border-top: 1px solid rgba(255,255,255,.09) !important;
    max-height: 92dvh !important;
    overflow-y: auto;
    padding: 8px 20px calc(var(--safe-b, 0px) + 28px) !important;
    width: 100% !important;
    margin: 20px;
    box-shadow: 2px 0px 20px 6px #333333;
    max-width: 100% !important;
    animation: sheetUp .32s cubic-bezier(.16,1,.3,1) both;
  }
  @keyframes sheetUp { from { transform: translateY(100%); } to { transform: none; } }
  /* Ручка */
  .auth-modal::before {
    content: ''; display: block; width: 36px; height: 4px;
    background: rgba(255,255,255,.2); border-radius: 99px;
    margin: 8px auto 20px;
  }
  .auth-btn { min-height: 52px; border-radius: var(--ui-radius-md,10px); font-size: 15px; width: 100%; justify-content: center; }
  .otp-box  { width: 60px !important; height: 64px !important; font-size: 26px !important; border-radius: var(--ui-radius-md,10px) !important; }
  .otp-row  { gap: 10px; justify-content: center; }
}

/* ─────────────────────────────────────────
   5. HERO — главная
───────────────────────────────────────── */
@media (max-width: 900px) {
  .hero-section { min-height: 82svh; padding: 76px 0 44px; }
  .hero-badge   { font-size: 11px; padding: 6px 12px; }
  .hero-title   { font-size: clamp(32px, 10vw, 50px) !important; margin-bottom: 14px; }
  .hero-desc    { font-size: 14px; line-height: 1.7; max-width: 100%; }
  .hero-btns    { flex-direction: column; gap: 10px; width: 100%; margin-top: 24px; }
  .hero-btns .btn { width: 100%; justify-content: center; min-height: 52px; font-size: 15px; }
  .hero-stats   { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; overflow: hidden; }
  .hero-stats > div { padding: 12px 6px; text-align: center; }
  .stat-num     { font-size: 16px; }
  .stat-lbl     { font-size: 9px; }
  .hero-glow2   { display: none; }
}
@media (max-width: 600px) {
  .hv-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .hv-card { padding: 14px 12px; }
  .hv-ico  { font-size: 20px; }
  .hv-title { font-size: 13px; }
}
@media (max-width: 430px) {
  .hero-title { font-size: clamp(28px, 11vw, 40px) !important; }
  .hero-stats > div { padding: 10px 4px; }
  .stat-num { font-size: 14px; }
}

/* ─────────────────────────────────────────
   6. СЕРВИСЫ НА ГЛАВНОЙ
───────────────────────────────────────── */
@media (max-width: 600px) {
  .st-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .st-card { padding: 14px 12px; }
  .st-emoji { font-size: 22px; }
}
@media (max-width: 360px) {
  .st-grid { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────
   7. CTA-ПОЛОСА
───────────────────────────────────────── */
@media (max-width: 900px) {
  .cta-strip  { padding: 40px 0; }
  .cta-t      { font-size: clamp(20px, 6vw, 26px); }
  .cta-s      { font-size: 13px; max-width: 100%; }
  .cta-phone  { font-size: clamp(22px, 7vw, 30px); }
  .cta-meta   { flex-direction: column; gap: 5px; font-size: 12px; align-items: center; }
  .cta-inner  { flex-direction: column; text-align: center; gap: 16px; align-items: center; }
  .cta-btns   { flex-direction: column; gap: 10px; width: 100%; }
  .cta-btns .btn { width: 100%; justify-content: center; min-height: 50px; }
}

/* ─────────────────────────────────────────
   8. ОТЗЫВЫ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .rv-grid { grid-template-columns: 1fr; gap: 12px; }
  .rv-card { padding: 18px 16px; }
  .rv-text { font-size: 13px; }
  .rv-add-card { padding: 20px 16px; }
  .rv-stars-pick { font-size: 34px; gap: 8px; }
}
@media (min-width: 540px) and (max-width: 900px) {
  .rv-grid { grid-template-columns: 1fr 1fr; }
}

/* ─────────────────────────────────────────
   9. ПРАЙС
───────────────────────────────────────── */
@media (max-width: 900px) {
  .ptabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 2px; gap: 6px; }
  .ptabs::-webkit-scrollbar { display: none; }
  .ptab  { flex-shrink: 0; min-height: 44px; padding: 0 16px; font-size: 13px; white-space: nowrap; }
  .ptbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--ui-radius-md,10px); }
  .ptbl  { min-width: 340px; }
  .ptbl th, .ptbl td { padding: 10px 12px; font-size: 13px; }
  .ptbl-book-btn { opacity: 1 !important; transform: none !important; font-size: 11px; padding: 5px 10px; white-space: nowrap; }
  .p-note { font-size: 12px; padding: 10px 14px; }
}
@media (max-width: 480px) {
  /* Скрываем колонку «Время» — экономим место */
  .ptbl th:nth-child(2),
  .ptbl td:nth-child(2) { display: none; }
}

/* ─────────────────────────────────────────
   10. УСЛУГИ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .svc-full-grid { gap: 20px; }
  .svc-full-card { padding: 20px 16px; border-radius: var(--ui-radius-md,10px); }
  .sfc-head  { flex-wrap: wrap; gap: 10px; }
  .sfc-ico   { width: 44px; height: 44px; font-size: 20px; border-radius: var(--ui-radius-md,10px); }
  .sfc-title { font-size: 18px; }
  .sfc-badge-wrap { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .sfc-body  { grid-template-columns: 1fr; gap: 14px; }
  .sfc-actions { flex-direction: column; gap: 8px; }
  .sfc-actions .btn { width: 100%; justify-content: center; min-height: 48px; }
  .faq-q { font-size: 13px; padding: 14px 16px; min-height: 52px; }
  .faq-a { padding: 0 16px; font-size: 13px; }
  .faq-item.open .faq-a { padding: 0 16px 14px; }
}

/* ─────────────────────────────────────────
   11. ЗАПЧАСТИ
───────────────────────────────────────── */
@media (max-width: 900px) {
  /* Герой */
  .parts-hero      { padding: 40px 0 32px; }
  .parts-hero-sub  { font-size: 13px; margin-bottom: 16px; }
  .parts-hero-stats { max-width: 100%; padding: 12px 16px; gap: 0; }
  .phs-sep  { width: 1px; height: 28px; }
  .phs-item { padding: 0 12px 0 0; }
  .phs-num  { font-size: 20px; }
  .phs-lbl  { font-size: 9px; }

  /* Форма заказа СВЕРХУ каталога */
  .parts-layout    { grid-template-columns: 1fr; padding-top: 20px; gap: 24px; }
  .parts-form-col  { order: -1; position: static !important; }
  .parts-order-form { position: static !important; top: auto; }

  /* Поиск */
  .parts-search-input { min-height: 48px; padding-left: 44px; }

  /* Фильтр — горизонтальный скролл */
  .parts-filter-row {
    overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none;
    -webkit-overflow-scrolling: touch; padding-bottom: 4px; margin-bottom: 16px;
  }
  .parts-filter-row::-webkit-scrollbar { display: none; }
  .parts-cat { flex-shrink: 0; padding: 7px 14px; }

  /* Карточки — 2 колонки */
  .parts-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .part-card  { padding: 12px 12px; }
  .part-name  { font-size: 12px; line-height: 1.3; }
  .part-sku   { font-size: 8px; }
  .part-note  { font-size: 10px; }
  .part-price { font-size: 13px; }
  .part-order-btn { font-size: 10px; padding: 5px 9px; }
  .part-footer { padding-top: 8px; }

  /* Форма */
  .pof-header  { padding: 18px 16px 14px; }
  .pof-title   { font-size: 16px; }
  .pof-fields  { padding: 14px 16px 0; gap: 12px; }
  .pof-submit  { margin: 14px 16px 0; width: calc(100% - 32px); min-height: 52px; font-size: 15px; }
  .pof-hint    { padding: 8px 16px 16px; font-size: 10px; }
  .pof-toast   { margin: 0 16px 16px; }
  .pof-selected { margin: 12px 16px 0; }

  /* Блок «Почему» */
  .parts-why-card { padding: 16px; margin-top: 12px; }
  .pwy-ico { width: 32px; height: 32px; font-size: 15px; }
  .pwy-t   { font-size: 13px; }
  .pwy-s   { font-size: 11px; }
}
@media (max-width: 430px) {
  .parts-hero-stats { flex-wrap: wrap; row-gap: 10px; }
  .phs-sep   { display: none; }
  .phs-item  { min-width: 45%; flex: none; padding: 0; }
}
@media (max-width: 360px) {
  .parts-grid { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────
   12. О КОМПАНИИ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .about-intro-grid  { grid-template-columns: 1fr; gap: 20px; }
  .about-facts-grid  { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .about-fact        { padding: 14px 10px; }
  .about-fact-num    { font-size: 20px; }
  .about-fact-lbl    { font-size: 9px; }
  .vals-grid         { grid-template-columns: 1fr 1fr; gap: 10px; }
  .val-card          { padding: 14px 12px; }
  .val-ico           { font-size: 22px; margin-bottom: 8px; }
  .val-t             { font-size: 12px; }
  .val-d             { font-size: 11px; }
  .team-grid         { grid-template-columns: 1fr 1fr; gap: 12px; }
  .team-card         { padding: 18px 12px; }
  .team-av           { width: 52px; height: 52px; font-size: 20px; }
  .team-name         { font-size: 13px; }
  .team-role         { font-size: 11px; }
}
@media (max-width: 430px) {
  .about-facts-grid  { grid-template-columns: 1fr 1fr; }
  .vals-grid         { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────
   13. КОНТАКТЫ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .ct-grid     { grid-template-columns: 1fr; gap: 20px; }
  .map-frame-wrap { height: 240px; border-radius: var(--ui-radius-md,10px); overflow: hidden; }
  .map-links   { flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .map-link-btn { flex: 1; min-width: 130px; justify-content: center; min-height: 44px; }
  .ct-cta-row  { flex-direction: column; gap: 8px; }
  .ct-cta-row .btn { width: 100%; justify-content: center; min-height: 50px; }
  .hours-wrap  { border-radius: var(--ui-radius-md,10px); }
  .hr-row      { padding: 10px 14px; font-size: 13px; }
  .ci-card     { padding: 14px 16px; }
  .ct-open-badge { font-size: 12px; padding: 5px 10px; }
}

/* ─────────────────────────────────────────
   14. ЗАПИСЬ (BOOKING)
───────────────────────────────────────── */
@media (max-width: 900px) {
  .booking-hero   { padding: 40px 0 28px; }
  .booking-layout { grid-template-columns: 1fr; }
  .booking-summary { display: none; }
  .bform-card     { padding: 18px 16px; border-radius: var(--ui-radius-md,10px); }
  .bform-row      { grid-template-columns: 1fr; gap: 12px; }

  .service-chips  { gap: 8px; }
  .svc-chip {
    flex: 1; min-width: calc(50% - 4px); min-height: 52px;
    justify-content: center; border-radius: var(--ui-radius-md,10px); font-size: 13px;
  }
  .svc-chip:active { transform: scale(.93); transition: .07s; }

  .date-grid {
    overflow-x: auto; flex-wrap: nowrap; gap: 8px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 4px;
  }
  .date-grid::-webkit-scrollbar { display: none; }
  .date-btn {
    flex-shrink: 0; min-width: 62px; min-height: 62px;
    flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  }
  .date-btn:active { transform: scale(.90); transition: .07s; }
  .date-num { font-size: 16px; font-weight: 700; }
  .date-day { font-size: 10px; }

  .time-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .time-btn  { min-height: 44px; font-size: 13px; border-radius: var(--ui-radius-md,10px); }
  .time-btn:active { transform: scale(.90); transition: .07s; }

  .booking-steps  { padding: 14px 16px 10px; gap: 0; overflow: hidden; }
  .bstep-num      { width: 22px; height: 22px; font-size: 9px; flex-shrink: 0; }
  .bstep-label    { font-size: 9px; white-space: nowrap; }
  .bstep-line     { min-width: 10px; }

  .bform-nav { flex-direction: row; gap: 10px; margin-top: 20px; }
  .bform-nav .btn { flex: 1; justify-content: center; min-height: 50px; }

  .booking-success { padding: 32px 16px; }
  .bs-icon  { width: 60px; height: 60px; font-size: 24px; }
  .bs-title { font-size: 20px; }
  .bs-sub   { font-size: 13px; }
  .bs-detail-row { font-size: 13px; padding: 8px 0; }
}
@media (max-width: 430px) {
  .time-grid { grid-template-columns: repeat(3, 1fr); }
  .svc-chip  { min-width: calc(50% - 4px); font-size: 12px; }
}

/* ─────────────────────────────────────────
   15. ЛИЧНЫЙ КАБИНЕТ
───────────────────────────────────────── */
@media (max-width: 900px) {
  /* Hero */
  .cab-hero         { padding: 24px 0 0; }
  .cab-profile-row  { padding: 0 16px; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
  .cab-avatar       { width: 52px; height: 52px; font-size: 20px; flex-shrink: 0; }
  .cab-name         { font-size: 20px; }
  .cab-phone-chip,
  .cab-car-chip     { font-size: 11px; padding: 4px 10px; }
  .cab-profile-actions { flex-direction: row; flex-wrap: wrap; gap: 8px; margin-left: 0; width: 100%; }
  .logout-btn, .cab-role-btn { flex: 1; justify-content: center; min-height: 40px; font-size: 12px; }

  /* Мини-статистика */
  .cab-mini-stats   { padding: 12px 16px; margin: 0 0 16px; border-radius: var(--ui-radius-md,10px); gap: 0; }
  .cab-ms-sep       { display: none; }
  .cab-ms-item      { flex: 1; min-width: 0; }
  .cab-ms-num       { font-size: 18px; }
  .cab-ms-lbl       { font-size: 9px; }

  /* Вкладки */
  .cab-tabs {
    display: flex; overflow-x: auto; scrollbar-width: none;
    padding: 0 8px; border-bottom: 1px solid var(--line);
    -webkit-overflow-scrolling: touch;
  }
  .cab-tabs::-webkit-scrollbar { display: none; }
  .cab-tab { min-height: 48px; padding: 0 16px; white-space: nowrap; flex-shrink: 0; font-size: 13px; }
  .cab-tab:active { opacity: .7; }

  /* Профиль — колонка */
  .cab-pane-layout  { grid-template-columns: 1fr; gap: 16px; }
  .profile-form-card { padding: 18px 16px; }
  .pfc-title        { font-size: 13px; margin-bottom: 14px; }
  .cab-side-cards   { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .cab-quick-card   { padding: 14px 12px; }
  .cqc-ico          { font-size: 20px; width: 36px; height: 36px; border-radius: var(--ui-radius-sm,5px); }
  .cqc-title        { font-size: 12px; }
  .cqc-sub          { font-size: 11px; }

  /* История */
  .hist-item   { flex-direction: column; gap: 8px; padding: 14px 16px; }
  .hist-price  { align-self: flex-start; }
  .hist-title  { font-size: 13px; }
  .hist-meta   { font-size: 11px; flex-wrap: wrap; }
  .hist-actions { flex-wrap: wrap; gap: 8px; }
  .hist-actions .btn { flex: 1; min-width: 110px; justify-content: center; min-height: 40px; font-size: 12px; }

  /* Лояльность */
  .loyalty-hero   { padding: 24px 16px; border-radius: var(--ui-radius-md,10px); }
  .loy-pts        { font-size: 44px; }
  .loy-pts-sub    { font-size: 12px; }
  .loy-levels     { grid-template-columns: 1fr 1fr; gap: 10px; }
  .loy-lvl-card   { padding: 12px 12px; }
  .loy-lvl-name   { font-size: 12px; }

  /* Автомобиль */
  .car-tip { padding: 14px 16px; font-size: 12px; }

  /* Push-баннер */
  .push-banner { flex-wrap: wrap; gap: 10px; }
  .push-banner .btn { width: 100%; justify-content: center; }
}
@media (max-width: 430px) {
  .cab-mini-stats   { flex-wrap: wrap; row-gap: 10px; }
  .cab-ms-item      { min-width: 45%; }
  .cab-side-cards   { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────
   16. МОИ ЗАЯВКИ
───────────────────────────────────────── */
@media (max-width: 900px) {
  .mo-header   { flex-wrap: wrap; gap: 10px; padding: 16px 16px 12px; }
  .mo-add-btn  { width: 100%; justify-content: center; min-height: 44px; }
  .mo-filters  {
    overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none;
    -webkit-overflow-scrolling: touch; padding: 0 16px 4px; gap: 6px;
  }
  .mo-filters::-webkit-scrollbar { display: none; }
  .mo-filter   { flex-shrink: 0; min-height: 38px; padding: 6px 14px; }
  .mo-card     { padding: 14px 16px; margin-bottom: 10px; border-radius: var(--ui-radius-md,10px); }
  .mo-card-header { flex-wrap: wrap; gap: 8px; }
  .mo-card-title  { font-size: 14px; }
  .mo-card-actions { flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .mo-card-actions .btn,
  .mo-card-actions a { flex: 1; min-width: 110px; justify-content: center; min-height: 44px; font-size: 12px; }
  .mo-empty    { padding: 48px 16px; }
  .mo-stat-bar { grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 14px 16px; }
  .mo-stat-num { font-size: 20px; }
  .mo-stat-lbl { font-size: 10px; }
}
@media (max-width: 430px) {
  .mo-stat-bar { grid-template-columns: repeat(2, 1fr); }
}

/* ─────────────────────────────────────────
   17. МЕССЕНДЖЕР
───────────────────────────────────────── */
@media (max-width: 900px) {
  #messenger-panel  { border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0; }
  .msng-messages    { padding: 10px 12px; }
  .msng-bubble      { font-size: 14px; padding: 9px 13px; max-width: 86vw; }
  .msng-textarea    { font-size: 16px !important; min-height: 44px; }
  .msng-send-btn    { width: 44px; height: 44px; flex-shrink: 0; }
  .msng-qa-btn      { min-height: 36px; padding: 5px 11px; font-size: 11px; }
  .msng-item        { padding: 12px 14px; min-height: 72px; }
  .msng-item-name   { font-size: 13px; }
  .msng-item-preview { font-size: 12px; }
  .msng-chat-name   { font-size: 14px; }
  .msng-chat-meta   { font-size: 11px; }
  .msng-subpanel    { border-radius: var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0 0; }
  .msng-stage-row   { padding: 12px 14px; min-height: 56px; }
  .msng-stage-row-label { font-size: 13px; }
  .msng-stage-row-desc  { font-size: 11px; }
  .msng-report-input    { font-size: 16px !important; }
  .msng-search      { font-size: 16px !important; min-height: 44px; }
  .msng-tracker     { padding: 10px 14px; }
  .msng-track-label { font-size: 9px; }
}

/* ─────────────────────────────────────────
   18. ОНБОРДИНГ — bottom sheet
───────────────────────────────────────── */
@media (max-width: 900px) {
  #onboarding-overlay { align-items: flex-end; padding: 0; }
  #onboarding-overlay .onb-box {
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0; max-width: 100%;
    padding: 10px 20px calc(var(--safe-b, 0px) + 28px);
    transform: translateY(100%); max-height: 92dvh; overflow-y: auto;
  }
  #onboarding-overlay.open .onb-box { transform: translateY(0); }
  /* Ручка */
  #onboarding-overlay .onb-box::before {
    content: ''; display: block; width: 36px; height: 4px;
    background: rgba(255,255,255,.2); border-radius: 99px;
    margin: 4px auto 14px;
  }
  .onb-logo    { font-size: 36px; margin-bottom: 8px; }
  .onb-hi      { font-size: 20px; }
  .onb-sub     { font-size: 12px; margin-bottom: 16px; }
  .onb-features { gap: 8px; margin-bottom: 20px; }
  .onb-feat    { padding: 10px 12px; gap: 10px; }
  .onb-feat-ico { width: 34px; height: 34px; font-size: 16px; border-radius: var(--ui-radius-sm,5px); flex-shrink: 0; }
  .onb-feat-t  { font-size: 12px; }
  .onb-feat-s  { font-size: 11px; }
  .onb-actions { gap: 8px; }
  .onb-btn     { min-height: 52px; font-size: 14px; }
}

/* ─────────────────────────────────────────
   19. ADMIN / MASTER / OWNER
───────────────────────────────────────── */
@media (max-width: 900px) {
  /* Admin — горизонтальный сайдбар */
  .admin-layout   { flex-direction: column; min-height: auto; }
  .admin-sidebar  {
    position: sticky; top: var(--nav-h, 54px); z-index: 50;
    width: 100%; height: auto; flex-direction: row;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
    padding: 6px 8px; border-right: none;
    border-bottom: 1px solid var(--line); gap: 4px;
    -webkit-overflow-scrolling: touch;
  }
  .admin-sidebar::-webkit-scrollbar { display: none; }
  .admin-sidebar > div:last-child { display: none; }
  .admin-nav-item {
    flex-direction: column; gap: 3px; padding: 6px 10px;
    border-left: none !important; border-bottom: 2.5px solid transparent !important;
    border-radius: var(--ui-radius-sm,5px); white-space: nowrap; font-size: 10px;
    min-width: 44px; min-height: 44px; justify-content: center; flex-shrink: 0;
  }
  .admin-nav-item.active { border-bottom-color: var(--orange) !important; background: var(--orange-dim); color: var(--orange); }
  .admin-nav-icon { font-size: 18px; }
  .admin-nav-label { display: none; }
  .admin-content  { padding: 16px; }
  .admin-stats-grid    { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .admin-quick-actions { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .admin-search   { width: 100%; font-size: 16px !important; min-height: 44px; }
  .admin-filters  { flex-wrap: wrap; gap: 6px; }
  .admin-filter-btn { min-height: 38px; padding: 6px 12px; }

  /* Calendar — горизонтальный скролл */
  .a-cal-week  { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .a-cal-grid  { min-width: 600px; }

  /* Master */
  .mast-stats   { grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 16px; }
  .mast-stat    { padding: 12px 10px; }
  .mast-stat-num { font-size: 18px; }
  .sched-slot   { padding: 12px 14px; gap: 8px 12px; }
  .sched-btn    { min-height: 40px; font-size: 12px; }

  /* Owner */
  .kpi-grid     { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .kpi-card     { padding: 14px 14px; }
  .kpi-num      { font-size: 20px; }
  .owner-tabs   { overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; padding: 0 8px; -webkit-overflow-scrolling: touch; }
  .owner-tabs::-webkit-scrollbar { display: none; }
  .owner-tab    { min-height: 44px; padding: 0 14px; flex-shrink: 0; white-space: nowrap; font-size: 11px; }
  .bar-label    { min-width: 90px; font-size: 11px; }
  .staff-tbl th, .staff-tbl td { padding: 9px 10px; font-size: 12px; }
  .perm-tbl th,  .perm-tbl td  { padding: 7px 8px; font-size: 11px; }
}
@media (max-width: 430px) {
  .admin-stats-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .kpi-grid         { grid-template-columns: 1fr 1fr; }
  .mast-stats       { grid-template-columns: 1fr 1fr 1fr; }
}

/* ─────────────────────────────────────────
   20. СКЕЛЕТОН-ЗАГРУЗКА
───────────────────────────────────────── */
@media (max-width: 900px) {
  .page-skeleton { padding: 28px 0 20px; }
  .sk-hero  { height: 44px; }
  .sk-card  { height: 90px; }
  .sk-title { height: 24px; }
}

/* ─────────────────────────────────────────
   21. ULTRA SMALL (≤ 360px)
───────────────────────────────────────── */
@media (max-width: 360px) {
  .container      { padding: 0 12px; }
  .hero-title     { font-size: 28px !important; }
  .hv-grid        { grid-template-columns: 1fr; }
  .st-grid        { grid-template-columns: 1fr; }
  .svc-chip       { min-width: 100%; }
  .time-grid      { grid-template-columns: repeat(3, 1fr); }
  .otp-box        { width: 52px !important; height: 56px !important; font-size: 22px !important; }
  .parts-grid     { grid-template-columns: 1fr; }
  .cab-mini-stats { flex-wrap: wrap; row-gap: 8px; }
  .cab-side-cards { grid-template-columns: 1fr; }
  .loy-levels     { grid-template-columns: 1fr; }
  .hist-actions .btn { min-width: 0; }
}

/* ─────────────────────────────────────────
   22. PWA STANDALONE + LANDSCAPE
───────────────────────────────────────── */
@media (display-mode: standalone) {
  #nav { padding-top: var(--safe-t, 0px); height: calc(var(--nav-h, 54px) + var(--safe-t, 0px)); }
  #app { padding-top: calc(var(--nav-h, 54px) + var(--safe-t, 0px)) !important; }
}

@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px) {
  :root { --bnav-bar: 50px; }
  .bnav-icon  { font-size: 18px; }
  .bnav-label { font-size: 9px; }
  .hero-section { min-height: auto; padding: 56px 0 32px; }
  .booking-hero { padding: 28px 0 18px; }
  #messenger-panel { max-height: 96dvh; }
  .onb-box { max-height: 90dvh; }
  section  { padding: 24px 0; }
}


/* PATCH 2026-03-11 — parts mobile hardening */
@media (max-width: 900px) {
  .parts-hero,
  .parts-layout,
  .parts-catalogue,
  .parts-form-col,
  .parts-order-form,
  .parts-search-wrap,
  .parts-grid,
  .part-card,
  .part-head,
  .part-footer,
  .pof-selected,
  .pof-sel-row,
  .pof-fields,
  .pof-group,
  .pof-input,
  .pof-textarea {
    min-width: 0;
    box-sizing: border-box;
  }

  .page,
  .parts-hero,
  .parts-layout,
  .parts-catalogue,
  .parts-form-col,
  .parts-order-form {
    max-width: 100%;
  }

  .parts-layout {
    overflow-x: clip;
  }

  .parts-grid {
    align-items: stretch;
  }

  .part-head,
  .part-footer,
  .pof-sel-row {
    flex-wrap: wrap;
  }

  .part-stock,
  .part-price,
  .part-order-btn,
  .pof-sel-sku,
  .pof-sel-price {
    white-space: normal;
    word-break: break-word;
  }

  .part-order-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    min-height: 40px;
  }

  .part-footer {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .part-price {
    width: 100%;
  }

  .pof-sel-clear {
    position: static;
    margin-top: 10px;
    display: inline-flex;
    align-self: flex-start;
  }

  .pof-input,
  .pof-textarea,
  .pof-submit {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 560px) {
  .parts-hero .container,
  .parts-layout,
  .parts-catalogue,
  .parts-form-col {
    min-width: 0;
  }

  .parts-hero-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .phs-sep {
    display: none;
  }

  .phs-item {
    min-width: 0;
    padding: 0;
  }

  .parts-grid {
    grid-template-columns: 1fr;
  }

  .part-card {
    padding: 14px;
  }

  .parts-filter-row {
    margin-right: -4px;
    padding-right: 4px;
  }
}

@media (max-width: 380px) {
  .parts-hero-stats {
    grid-template-columns: 1fr;
  }
}


/* v20260423r32 master work return responsive */
.master-work-subtabs{width:100%;align-items:stretch}
.master-work-subtabs .btn{min-height:38px}
.master-return-grid{align-items:stretch}
.master-return-card{height:100%}
.master-return-card-actions{flex-wrap:wrap}
.master-return-card-actions .btn{flex:1 1 140px;justify-content:center}
@media (max-width: 1024px){
  .master-work-pane .container > div[style*="grid-template-columns:1.1fr .9fr"]{grid-template-columns:1fr !important}
}
@media (max-width: 768px){
  .master-work-pane{padding:14px 0 !important}
  .master-work-subtabs{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px !important}
  .master-work-subtabs .btn{width:100%;padding:10px 12px !important;font-size:12px !important}
  .master-return-grid{grid-template-columns:1fr !important}
  .master-return-card{padding:12px !important}
  .master-return-card-actions .btn{flex:1 1 calc(50% - 6px)}
}
@media (max-width: 560px){
  .master-work-subtabs{grid-template-columns:1fr !important}
  .master-return-card-actions{flex-direction:column}
  .master-return-card-actions .btn{width:100%}
}


/* r58: mobile home category cards — hide examples only inside #home catalog.
   settings.css is loaded after home_page.css, so this late mobile layer owns the override. */
@media (max-width: 767px) {
  .home-catalog .hcat-examples {
    display: none !important;
  }
}

/* r64: master cards requested mobile font reduction.
   Keep rating attached to the top-right corner; reduce r63 text scale by 4px. */
@media (max-width: 640px) {
  .master-contact-row .mcl-rating {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    z-index: 3 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    padding: 6px 9px !important;
    border-radius: 999px !important;
    pointer-events: none !important;
  }

  .master-contact-row .mcl-top {
    min-height: 28px !important;
    padding-right: 78px !important;
  }

  .master-contact-row .mcl-name {
    font-size: 15px !important;
    line-height: 1.12 !important;
  }

  .master-contact-row .mcl-spec {
    font-size: 12px !important;
    line-height: 1.45 !important;
  }

  .master-contact-row .mcl-chip,
  .master-contact-row .mcl-meta-item {
    font-size: 12px !important;
  }
}


/* v20260423r68: mobile home special service dock + home cart guard */
.home-specials-mobile-dock{
  display:none;
}
@media (max-width: 768px){
  body.kareta-page-home #services-cart-fab,
  body.kareta-page-home #services-cart-gonext,
  body.services-cart-fab-hidden-home #services-cart-fab,
  body.services-cart-fab-hidden-home #services-cart-gonext{
    display:none !important;
  }
  .home-catalog .home-specials,
  .home-catalog .home-urgent-cta{
    display:none !important;
  }
  .home-specials-mobile-dock{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
    width:100%;
    max-width:480px;
    margin:0 auto 14px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .home-specials-mobile-btn{
    appearance:none;
    min-width:0;
    min-height:52px;
    border:1px solid var(--line);
    border-radius:var(--ui-radius-lg,18px);
    padding:8px 6px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    background:#fff;
    color:#111827;
    font-family:inherit;
    cursor:pointer;
    box-shadow:0 10px 24px rgba(15,23,42,.08);
    transition:transform .14s ease, border-color .14s ease, background .14s ease;
  }
  .home-specials-mobile-btn:active{
    transform:scale(.96);
  }
  .home-specials-mobile-btn--evac{
    border-color:rgba(239,68,68,.22);
    background:#fff;
  }
  .home-specials-mobile-btn--legal{
    border-color:rgba(139,92,246,.22);
    background:#fff;
  }
  .home-specials-mobile-btn--sos{
    border-color:rgba(255,107,0,.26);
    background:#fff;
  }
  .home-specials-mobile-ico{
    width:34px;
    height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:var(--ui-radius-md,10px);
    background:rgba(15,23,42,.05);
    font-size:20px;
    line-height:1;
  }
  .home-specials-mobile-label{
    display:block !important;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    line-height:1.05;
    font-weight:800;
    letter-spacing:.1px;
    color:#111827;
  }
  body.kareta-page-home .bottom-nav{
    z-index:880;
  }
}
@media (min-width: 769px){
  .home-specials-mobile-dock{ display:none !important; }
}

/* r70: master profile — hide CTA banner on mobile phones only */
@media (max-width: 640px) {
  .master-cta-banner {
    display: none !important;
  }
}


/* r73: mobile home — active order spacing + compact standard service tiles */
.home-active-order {
  margin: 16px 10px 16px;
}
@media (max-width: 640px) {
  body.kareta-page-home .home-catalog__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 0 10px !important;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard {
    min-height: 58px !important;
    padding: 12px 10px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    display: flex !important;
    flex-direction: row;
    align-items: center !important;
    justify-content: left!important;
    gap: 10px !important;
    text-align: center !important;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-card__top {
    width: auto!important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    gap: 0 !important;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-icon {
    width: 35px !important;
    height: 35px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    font-size: 14px !important;
    margin: 0!important;
    padding: 0px;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-body {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-label {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
    text-align: left !important;
  }

  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-count,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-sub,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-price,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-badges,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-examples,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-arrow {
    display: none !important;
  }
}

/* v20260503r105 — master work queue mobile card hardening
   mobile_v2.css подключается последним, поэтому этот слой фиксирует карточки биржи после всех глобальных mobile-правил. */
@media (max-width: 680px) {
  .master-work-page .master-work-nav-card {
    display: none !important;
  }

  .master-work-page [data-subpane-scope="work"][data-subpane="queue"] .master-work-quick-summary,
  .master-work-page [data-subpane="queue"] ~ .master-work-extra-grid .master-work-quick-summary {
    display: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head {
    margin-top: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-layout {
    display: block !important;
    min-width: 0 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-sidebar--filters,
  .master-work-page .mx-exchange-shell--no-head .mx-sidebar--service,
  .master-work-page .mx-exchange-shell--no-head .mx-tabs,
  .master-work-page .mx-exchange-shell--no-head .mx-view-tools,
  .master-work-page .mx-exchange-shell--no-head .mx-mobile-found {
    display: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-stream-head--tools {
    position: sticky !important;
    top: 8px !important;
    z-index: 20 !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-stream-head--tools > div:first-child {
    display: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-mobile-tools {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px 42px !important;
    gap: 8px !important;
    align-items: center !important;
    margin: 0 0 10px !important;
    padding: 8px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    background: rgba(15,23,42,.94) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-list {
    gap: 10px !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card {
    padding: 12px !important;
    gap: 9px !important;
    border-radius: var(--ui-radius-lg,18px) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035)) !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.18) !important;
    transform: none !important;
    /* Фикс overflow на мобилке */
    overflow: hidden !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card:active,
  .master-work-page .mx-exchange-shell--no-head .card:active {
    transform: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    gap: 8px !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .master-work-page .mx-exchange-shell--no-head .mx-card-headings {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-scenario {
    margin-bottom: 6px !important;
    font-size: 10px !important;
    line-height: 1 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-scenario-icon {
    width: 22px !important;
    height: 22px !important;
    font-size: 12px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-headings h4 {
    margin: 0 !important;
    font-size: 15.5px !important;
    line-height: 1.18 !important;
    letter-spacing: -.01em !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    min-width: 0 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-sub {
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
    color: var(--text3) !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-budget {
    align-self: start !important;
    padding: 6px 8px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    background: rgba(255,107,0,.12) !important;
    border: 1px solid rgba(255,107,0,.22) !important;
    font-size: 14.5px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-chip-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    padding: 0 1px 2px !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-chip-row::-webkit-scrollbar {
    display: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-chip {
    flex: 0 0 auto !important;
    padding: 5px 7px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    border-radius: 999px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-desc {
    font-size: 12px !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin: 0 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-meta-grid {
    display: none !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-my-response {
    padding: 8px 9px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    font-size: 11px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-actions,
  .master-work-page .mx-exchange-shell--no-head .mx-actions--core,
  .master-work-page .mx-exchange-shell--no-head .mx-row-actions.mx-actions--core {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-actions .btn,
  .master-work-page .mx-exchange-shell--no-head .mx-actions--core .btn,
  .master-work-page .mx-exchange-shell--no-head .mx-row-actions.mx-actions--core .btn {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 40px !important;
    padding: 8px 5px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-row {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 12px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035)) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.16) !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-row-title b {
    font-size: 14.5px !important;
    line-height: 1.2 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-row-meta {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-row-price {
    justify-self: start !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    background: rgba(255,107,0,.12) !important;
    border: 1px solid rgba(255,107,0,.22) !important;
    font-size: 14px !important;
    line-height: 1 !important;
  }
}

@media (max-width: 380px) {
  .master-work-page .mx-exchange-shell--no-head .mx-card-headings h4 {
    font-size: 14.5px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-card-budget {
    font-size: 13px !important;
    padding: 5px 7px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-actions .btn,
  .master-work-page .mx-exchange-shell--no-head .mx-actions--core .btn,
  .master-work-page .mx-exchange-shell--no-head .mx-row-actions.mx-actions--core .btn {
    font-size: 10.5px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   MX-EXCHANGE OVERFLOW FIXES — глобальные
═══════════════════════════════════════════════════════════════════ */
.mx-exchange-shell,
.mx-layout,
.mx-card-list,
.mx-card {
  box-sizing: border-box;
}
@media (max-width: 900px) {
  .mx-exchange-shell--no-head {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  .mx-layout {
    min-width: 0 !important;
    width: 100% !important;
  }
  .mx-card-list {
    min-width: 0 !important;
    overflow: hidden !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   MASTER EXCHANGE PAGE — финальные мобильные фиксы
═══════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Убираем горизонтальный overflow на всей странице мастера */
  .master-work-page {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  /* Контейнер биржи */
  .mx-exchange-shell--no-head {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }
  /* Основной поток карточек */
  .mx-stream-main {
    min-width: 0 !important;
    overflow: hidden !important;
    max-width: 100% !important;
  }
  /* Сетка карточек */
  .mx-card-list {
    padding: 0 !important;
    max-width: 100% !important;
  }
  /* Каждая карточка — жёсткие ограничения */
  .mx-card {
    max-width: 100% !important;
    box-sizing: border-box !important;
    contain: layout !important;
  }
  /* chip-row — горизонтальный скролл без overflow родителя */
  .mx-chip-row {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  /* Бюджет — не вылезает */
  .mx-card-budget {
    max-width: 140px !important;
    font-size: 15px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  /* Заголовок заявки — перенос */
  .mx-card-headings {
    min-width: 0 !important;
    flex: 1 !important;
    overflow: hidden !important;
  }
  .mx-card-headings h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    word-break: break-word !important;
  }
}

/* v20260503r128 — mobile queue toolbar without quick filters; quick filters only in filter sheet */
@media (max-width: 680px) {
  .master-work-page .mx-exchange-shell--no-head .mx-mobile-tools {
    display: block !important;
    margin: 0 0 10px !important;
    padding: 8px !important;
  }

  .master-work-page .mx-exchange-shell--no-head .mx-mobile-tools .mx-mobile-tools-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px 42px !important;
    gap: 8px !important;
    align-items: center !important;
  }

  .cmodal-overlay.open.mx-modal-overlay .cmodal-body.mx-sheet-body > .mx-sheet-quickfilters.mx-sheet-quickfilters--sheet {
    display: flex !important;
    gap: 7px !important;
    overflow-x: auto !important;
    padding: 2px 0 12px !important;
    margin: 0 0 10px !important;
    border-bottom: 1px solid var(--line) !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .cmodal-overlay.open.mx-modal-overlay .cmodal-body.mx-sheet-body > .mx-sheet-quickfilters.mx-sheet-quickfilters--sheet::-webkit-scrollbar {
    display: none !important;
  }

  .cmodal-overlay.open.mx-modal-overlay .cmodal-body.mx-sheet-body > .mx-sheet-quickfilters.mx-sheet-quickfilters--sheet .mx-sheet-qbtn {
    min-height: 34px !important;
    padding: 7px 12px !important;
    font-size: 12px !important;
  }
}

/* v20260503r121 — profile setup mobile bottom sheet */
@media (max-width: 680px) {
  #profile-setup-overlay.profile-setup-overlay{
    align-items:flex-end !important;
    padding:0 !important;
  }
  #profile-setup-overlay .profile-setup-panel{
    width:100% !important;
    max-height:92dvh !important;
    border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-bottom:0 !important;
    transform:translateY(100%) !important;
  }
  #profile-setup-overlay.is-visible .profile-setup-panel{
    transform:translateY(0) !important;
  }
  #profile-setup-overlay .profile-setup-drag{display:block !important;}
  #profile-setup-overlay .profile-setup-head{
    grid-template-columns:40px minmax(0,1fr) 36px !important;
    gap:10px !important;
    padding:12px 14px 12px !important;
  }
  #profile-setup-overlay .profile-setup-icon{
    width:40px !important;height:40px !important;border-radius:var(--ui-radius-md,10px) !important;font-size:20px !important;
  }
  #profile-setup-overlay .profile-setup-title{font-size:19px !important;}
  #profile-setup-overlay .profile-setup-subtitle{font-size:12px !important;line-height:1.38 !important;}
  #profile-setup-overlay .profile-setup-close{width:36px !important;height:36px !important;border-radius:var(--ui-radius-md,10px) !important;}
  #profile-setup-overlay .profile-setup-body{padding:14px !important;}
  #profile-setup-overlay .profile-setup-grid{gap:11px !important;}
  #profile-setup-overlay .profile-setup-input{min-height:48px !important;font-size:16px !important;border-radius:var(--ui-radius-md,10px) !important;}
  #profile-setup-overlay .profile-setup-footer{
    padding:10px 14px calc(12px + env(safe-area-inset-bottom,0px)) !important;
    gap:8px !important;
  }
  #profile-setup-overlay .profile-setup-skip{min-width:104px !important;min-height:46px !important;font-size:13px !important;}
  #profile-setup-overlay .profile-setup-save{min-height:46px !important;font-size:13px !important;}
}
@media (max-width: 380px) {
  #profile-setup-overlay .profile-setup-footer{flex-direction:column !important;}
  #profile-setup-overlay .profile-setup-skip,
  #profile-setup-overlay .profile-setup-save{width:100% !important;}
}




/* r185: account tabs as two-column action cards */
@media (max-width: 900px){
  .cab-tabs.cab-tabs--cards{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    padding:0 16px 16px;
    border-bottom:0;
    overflow:visible;
  }
  .cab-tabs.cab-tabs--cards .cab-tab{
    min-height:96px;
    padding:14px;
    white-space:normal;
    flex-shrink:1;
    border-radius:var(--ui-radius-lg,18px);
    font-size:14px;
    display:flex;
    align-items:flex-start;
    gap:10px;
  }
  .cab-tabs.cab-tabs--cards .cab-tab-icon{
    width:38px;
    height:38px;
    border-radius:var(--ui-radius-md,10px);
    font-size:20px;
  }
  .cab-tabs.cab-tabs--cards .cab-tab-title{font-size:18px}
  .cab-tabs.cab-tabs--cards .cab-tab-desc{font-size:12px}
}
@media (max-width: 380px){
  .cab-tabs.cab-tabs--cards{grid-template-columns:1fr}
}


/* r190 — client cabinet mini stats: max 3 cards */
.cab-mini-stats.cab-mini-stats--max3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
  padding: 12px !important;
}
.cab-mini-stats.cab-mini-stats--max3 .cab-ms-sep { display: none !important; }
.cab-mini-stats.cab-mini-stats--max3 .cab-ms-item {
  min-width: 0 !important;
  width: auto !important;
  flex: initial !important;
  padding: 10px 8px;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  background: var(--bg);
}
.cab-mini-stats.cab-mini-stats--max3 .cab-ms-num { font-size: 22px; }
.cab-mini-stats.cab-mini-stats--max3 .cab-ms-lbl { font-size: 11px; }
@media (max-width: 380px) {
  .cab-mini-stats.cab-mini-stats--max3 { gap: 8px !important; padding: 10px !important; }
  .cab-mini-stats.cab-mini-stats--max3 .cab-ms-item { padding: 9px 6px; }
  .cab-mini-stats.cab-mini-stats--max3 .cab-ms-num { font-size: 18px; }
  .cab-mini-stats.cab-mini-stats--max3 .cab-ms-lbl { font-size: 10px; }
}

/* === SOURCE: css/messenger.css === */
/* ═══════════════════════════════════════════════
   KARETA.KZ — MESSENGER STYLES
   WhatsApp-style full-height panel
═══════════════════════════════════════════════ */

/* ── Overlay ── */
#messenger-overlay {
  display: none;
  position: fixed; inset: 0;
  z-index: 99996;
  background: rgba(5, 10, 18, .36);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity .3s ease;
}
#messenger-overlay.vis { display: block; opacity: 1; }

/* ── Panel — fullscreen overlay on all devices ── */
#messenger-panel {
  position: fixed;
  inset: 0;
  z-index: 99997;
  width: 100vw;
  height: 100dvh;
  background: var(--bg);
  border-radius: 0;
  border: none;
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(100%);
  transition: transform .34s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 0 0 1px rgba(255,255,255,.02), 0 18px 60px rgba(0,0,0,.45);
}
#messenger-panel.open { transform: translateY(0); }

body.chat-fullscreen-open {
  overflow: hidden;
  overscroll-behavior: none;
}

/* Handle */
.msng-handle { display: none; }

/* ── HEADER ── */
.msng-header {
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--bg2) 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--line);
  padding-top: env(safe-area-inset-top, 0px);
}
.msng-hd-row {
  display: flex; align-items: center;
  min-height: 60px;
  padding: 10px 16px;
  gap: 10px;
}
.msng-hd-row--list {
  padding-top: 12px;
  padding-bottom: 8px;
}
.msng-hd-title {
  font-family: 'Oswald', sans-serif;
  font-size: 17px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  flex: 1;
}
.msng-close-btn {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--surface); color: var(--text3);
  font-size: 20px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: .2s; flex-shrink: 0;
  border: 1px solid var(--line);
}
.msng-close-btn:hover { background: var(--surface2); color: var(--text); }

.msng-search-row { padding: 0 16px 14px; }
.msng-search {
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px);
  padding: 10px 14px;
  font-size: 14px; color: var(--text);
  font-family: 'Mulish', sans-serif;
  outline: none; transition: .2s;
}
.msng-search:focus { border-color: var(--orange-brd); }

/* Chat header */
.msng-chat-header {
  display: flex; align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px 16px;
}
.msng-back-btn {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--surface); color: var(--text2);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; transition: .2s;
  border: 1px solid var(--line);
}
.msng-back-btn:hover { background: var(--surface2); }
.msng-back-btn--panel {
  width: 40px;
  height: 40px;
}
.msng-chat-av {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,107,0,.18);
  border: 2px solid rgba(255,107,0,.3);
  color: var(--orange);
  font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.msng-chat-info { flex: 1; min-width: 0; }
.msng-chat-name {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.msng-chat-meta {
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
  font-size: 11px; color: var(--text3); margin-top: 2px;
}
.msng-status-pill {
  font-size: 10px; font-weight: 700;
  padding: 2px 7px; border-radius: 99px;
  white-space: nowrap;
}
.msng-chat-hd-actions { display: flex; gap: 6px; margin-right: 44px; }
.msng-hd-btn {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--surface); font-size: 15px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: .2s;
}
.msng-hd-btn:hover { background: var(--orange-dim); }

/* ── ORDER TRACKER ── */
.msng-tracker {
  display: flex; align-items: flex-start;
  padding: 10px 16px 12px;
  gap: 0;
  overflow-x: auto; scrollbar-width: none;
  border-top: 1px solid var(--line);
  background: var(--bg2);
}
.msng-tracker::-webkit-scrollbar { display: none; }
.msng-track-step {
  display: flex; flex-direction: column; align-items: center;
  gap: 5px; flex-shrink: 0;
  position: relative;
}
.msng-track-dot {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--surface2); border: 1.5px solid var(--line);
  color: var(--text3); font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  transition: .3s; z-index: 1;
}
.msng-track-step.done .msng-track-dot { background: rgba(34,197,94,.15); border-color: #22c55e; }
.msng-track-step.current .msng-track-dot { background: rgba(255,107,0,.18); border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.15); }
.msng-track-label { font-size: 9px; font-weight: 700; color: var(--text3); text-align: center; max-width: 56px; }
.msng-track-step.done .msng-track-label { color: #22c55e; }
.msng-track-step.current .msng-track-label { color: var(--orange); }
.msng-track-line {
  position: absolute; top: 14px; left: 50%;
  width: calc(100% + 16px); height: 1.5px;
  background: var(--line); z-index: 0;
}
.msng-track-step.done .msng-track-line { background: #22c55e; }

/* ── BODY ── */
.msng-body {
  flex: 1; display: flex; flex-direction: column; overflow: hidden;
}

/* ── LIST ── */
.msng-list {
  flex: 1;
  overflow-y: auto;
  /* Список чатов: отступ снизу, чтобы нижняя навигация не перекрывала элементы */
  padding-bottom: calc(var(--bnav-h, 60px) + 8px);
}
.msng-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  cursor: pointer; transition: .15s;
  position: relative;
}
.msng-item:hover { background: rgba(255,255,255,.025); }
.msng-item:active { background: var(--orange-dim); }
.msng-av {
  width: 46px; height: 46px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 700;
  color: var(--orange); flex-shrink: 0;
  position: relative;
}
.msng-av-dot {
  position: absolute; bottom: 1px; right: 1px;
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--bg);
}
.msng-item-body { flex: 1; min-width: 0; }
.msng-item-row1 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2px; }
.msng-item-name { font-weight: 700; font-size: 14px; }
.msng-item-time { font-size: 11px; color: var(--text3); flex-shrink: 0; }
.msng-item-row2 { display: flex; gap: 6px; align-items: center; margin-bottom: 3px; }
.msng-item-sub  { font-size: 12px; font-weight: 600; color: var(--orange); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msng-item-car  { font-size: 10px; color: var(--text3); flex-shrink: 0; }
.msng-item-row3 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.msng-item-preview { font-size: 12px; color: var(--text3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msng-status-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.msng-unread {
  min-width: 18px; height: 18px; padding: 0 5px;
  background: var(--orange); color: #fff;
  font-size: 10px; font-weight: 700; border-radius: 99px;
  display: flex; align-items: center; justify-content: center;
}
.msng-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 60px 24px; text-align: center; color: var(--text3);
}

/* ── MESSAGES ── */
.msng-messages {
  flex: 1; overflow-y: auto;
  padding: 14px 14px 8px;
  display: flex; flex-direction: column; gap: 6px;
  scrollbar-width: thin; scrollbar-color: var(--surface2) transparent;
  background: var(--bg);
}

/* System event */
.msng-msg-event {
  text-align: center; margin: 6px 0;
}
.msng-msg-event span {
  display: inline-block;
  font-size: 11px; color: var(--text3);
  background: var(--surface2); border: 1px solid var(--line);
  border-radius: 99px; padding: 3px 12px;
}

/* Stage milestone */
.msng-msg-stage {
  display: flex; align-items: center; gap: 10px;
  background: rgba(34,197,94,.08);
  border: 1px solid rgba(34,197,94,.2);
  border-radius: var(--ui-radius-md,10px); padding: 10px 14px;
  margin: 4px 0;
}
.msng-stage-ico { font-size: 20px; flex-shrink: 0; }
.msng-stage-label { font-weight: 700; font-size: 13px; color: #22c55e; }
.msng-stage-time  { font-size: 11px; color: var(--text3); margin-top: 1px; }

/* Report card */
.msng-msg-report {
  background: rgba(255,107,0,.07);
  border: 1px solid var(--orange-brd);
  border-left: 3px solid var(--orange);
  border-radius: var(--ui-radius-md,10px); padding: 12px 14px;
  margin: 4px 0;
}
.msng-report-head { font-weight: 700; font-size: 12px; color: var(--orange); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .5px; }
.msng-report-text { font-size: 13px; color: var(--text2); line-height: 1.5; }
.msng-report-time { font-size: 10px; color: var(--text3); margin-top: 6px; text-align: right; }

/* Regular messages */
.msng-msg {
  display: flex; flex-direction: column; max-width: 78%; gap: 3px;
}
.msng-msg.mine   { align-self: flex-end; align-items: flex-end; }
.msng-msg.theirs { align-self: flex-start; align-items: flex-start; }
.msng-bubble {
  padding: 9px 13px; border-radius: var(--ui-radius-md,10px);
  font-size: 14px; line-height: 1.5;
  word-break: break-word;
}
.msng-msg.mine   .msng-bubble { background: var(--orange); color: #fff; border-bottom-right-radius: 4px; }
.msng-msg.theirs .msng-bubble { background: var(--surface2); color: var(--text); border-bottom-left-radius: 4px; }
.msng-bubble.photo { background: var(--surface2); padding: 0; overflow: hidden; border-radius: var(--ui-radius-md,10px); }
.msng-photo-placeholder {
  padding: 16px 20px;
  background: linear-gradient(135deg, var(--surface), var(--surface2));
  font-size: 13px; font-weight: 600; cursor: pointer;
  min-width: 180px; text-align: center;
}
.msng-msg-time { font-size: 10px; color: var(--text3); padding: 0 4px; }

/* ── INPUT AREA ── */
.msng-input-area {
  flex-shrink: 0;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  padding: 8px 12px;
  padding-bottom: max(8px, env(safe-area-inset-bottom, 8px));
}
.msng-input-area.closed {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 12px 16px;
}
.msng-closed-note { font-size: 13px; color: var(--text3); }

/* Quick action buttons (master) */
.msng-quick-actions {
  display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap;
}
.msng-qa-btn {
  font-size: 12px; font-weight: 600;
  color: var(--orange);
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-sm,5px); padding: 6px 12px;
  cursor: pointer; transition: .2s; white-space: nowrap;
}
.msng-qa-btn:hover  { background: rgba(255,107,0,.18); }
.msng-qa-btn:active { transform: scale(.95); }

.msng-input-row {
  display: flex; gap: 8px; align-items: flex-end;
}
.msng-textarea {
  flex: 1;
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 11px 14px;
  font-size: 14px; color: var(--text);
  font-family: 'Mulish', sans-serif;
  resize: none; outline: none; transition: .2s;
  min-height: 46px;
  max-height: calc(1.4em * 4 + 24px);
  overflow-y: hidden;
  line-height: 1.4;
  box-sizing: border-box;
}
.msng-textarea:focus { border-color: var(--orange-brd); }
.msng-textarea::placeholder { color: var(--text3); }
.msng-send-btn {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--orange); color: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; transition: .2s;
}
.msng-send-btn:hover  { background: var(--orange-l); transform: scale(1.06); }
.msng-send-btn:active { transform: scale(.93); }

/* ── SUB-PANELS (stage/report/order card) ── */
.msng-subpanel {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  z-index: 10;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0 0;
  max-height: 80%;
  display: flex; flex-direction: column;
  box-shadow: 0 -8px 40px rgba(0,0,0,.5);
  transform: translateY(100%);
  transition: transform .32s cubic-bezier(.16,1,.3,1);
}
#messenger-panel { position: fixed; } /* ensure absolute children work */
.msng-subpanel.open { transform: translateY(0); }

.msng-subpanel-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px 12px; border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.msng-subpanel-title {
  font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
}
.msng-subpanel-body {
  overflow-y: auto; padding: 14px 16px;
  padding-bottom: max(14px, env(safe-area-inset-bottom, 14px));
}

/* Stage rows */
.msng-stage-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: var(--ui-radius-md,10px);
  cursor: pointer; transition: .2s;
  border: 1px solid transparent; margin-bottom: 8px;
}
.msng-stage-row:hover   { background: var(--surface2); border-color: var(--line); }
.msng-stage-row:active  { transform: scale(.98); }
.msng-stage-row.done    { opacity: .5; }
.msng-stage-ico-big     { font-size: 24px; flex-shrink: 0; }
.msng-stage-row-label   { font-weight: 700; font-size: 13px; }
.msng-stage-row-desc    { font-size: 11px; color: var(--text3); margin-top: 2px; }
.msng-stage-done-mark   { margin-left: auto; color: var(--green); font-size: 16px; font-weight: 700; }
.msng-stage-arrow       { margin-left: auto; color: var(--text3); font-size: 16px; }

/* Report form */
.msng-label {
  display: block; font-size: 11px; font-weight: 700;
  color: var(--text3); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 7px;
}
.msng-report-input {
  width: 100%; background: var(--surface);
  border: 1.5px solid var(--line); border-radius: var(--ui-radius-sm,5px);
  padding: 10px 14px; font-size: 13px; color: var(--text);
  font-family: 'Mulish', sans-serif; outline: none; resize: vertical; transition: .2s;
  box-sizing: border-box;
}
.msng-report-input:focus { border-color: var(--orange-brd); }

/* Order card */
.msng-card-id {
  font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700;
  color: var(--orange); margin-bottom: 16px;
}
.msng-card-row {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid var(--line);
}
.msng-card-key { font-size: 12px; color: var(--text3); min-width: 130px; }
.msng-card-val { font-size: 13px; font-weight: 600; flex: 1; }

/* ── MOBILE fine-tuning ── */
@media (max-width: 600px) {
  .msng-textarea { font-size: 16px !important; }
  .msng-bubble   { font-size: 14px; }
  .msng-item-name { font-size: 13px; }
}

/* На мобилке список чатов учитывает высоту нижней навигации */
@media (max-width: 900px) {
  .msng-list {
    padding-bottom: calc(var(--bnav-h, 76px) + 8px);
  }
}

.msng-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.msng-messages { overscroll-behavior: contain; }


/* ── Messenger page shell ── */
.msng-page-hero{margin-bottom:16px}
.msng-page-shell{
  overflow:hidden;
  border:1px solid var(--line);
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
}
.msng-page-header{border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%)}
.msng-search-row--page{padding:0 16px 16px}
.msng-page-body{min-height:420px;display:flex;flex-direction:column}
.msng-list--page{padding-bottom:12px}
.msng-empty--page{min-height:320px}

/* fullscreen dialog only */
#messenger-overlay{pointer-events:none}
#messenger-panel{pointer-events:auto}
.msng-chat-hd-actions{margin-right:0}

@media (max-width: 768px){
  .msng-page-shell{margin-bottom:calc(var(--bnav-h, 60px) + 12px)}
  .msng-item{padding:12px 14px}
  .msng-item-row2{flex-wrap:wrap}
  .msng-item-sub{max-width:100%;white-space:normal}
  .msng-item-preview{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
}


/* ── Messages page upgrades ── */
.msng-page-shell {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}
.msng-page-header {
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.02), transparent);
}
.msng-page-body { min-height: 280px; }
  border:1px solid var(--line); border-radius:var(--ui-radius-md,10px); overflow:hidden; background:rgba(255,255,255,.015);
}
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:12px 14px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.02);
}
  min-width:22px; height:22px; padding:0 7px; border-radius:999px; background:var(--surface2); color:var(--text2);
  display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800;
}
.msng-list--page { padding-bottom:0; }
.msng-list--section .msng-item:last-child { border-bottom:none; }
.msng-item { align-items:center; }
.msng-item-meta-pills { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:4px; }
.msng-mini-pill {
  display:inline-flex; align-items:center; gap:4px; min-width:0;
  padding:4px 8px; border-radius:999px; border:1px solid var(--line);
  background:rgba(255,255,255,.03); color:var(--text2); font-size:10px; font-weight:700;
}
.msng-item-preview {
  white-space:normal; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  line-height:1.35; max-height:2.7em;
}
@media (max-width: 900px) {
  }
@media (max-width: 640px) {
  .msng-page-shell { border-radius:var(--ui-radius-md,10px); }
  .msng-page-header { padding:12px; }
  .msng-item { padding:12px; align-items:flex-start; }
  .msng-av { width:42px; height:42px; font-size:15px; }
  .msng-item-row1 { gap:8px; align-items:flex-start; }
  .msng-item-name { font-size:13px; }
  .msng-item-sub { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .msng-item-car { display:block; width:100%; }
  .msng-item-row2 { flex-direction:column; align-items:flex-start; gap:4px; }
  .msng-item-row3 { align-items:flex-end; }
}

/* ── Loyalty cards inside messenger ── */
.msng-loyalty-card{
  margin: 0 16px 12px;
  padding: 14px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,107,0,.10), rgba(255,107,0,.04));
}
.msng-loyalty-card--compact{
  margin: 8px 0 10px;
  padding: 8px 10px;
  border-radius: var(--ui-radius-md,10px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.msng-loyalty-head,.msng-loyalty-main{display:flex;align-items:center;justify-content:space-between;gap:12px}
.msng-loyalty-caption{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.msng-loyalty-level{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.msng-loyalty-icon{font-size:18px;line-height:1}
.msng-loyalty-points-big{font-family:'Oswald',sans-serif;font-size:30px;line-height:1;color:var(--orange)}
.msng-loyalty-points{font-size:12px;color:var(--text2);font-weight:700}
.msng-loyalty-title{font-size:12px;font-weight:800}
.msng-loyalty-disc{font-size:12px;font-weight:800;color:var(--orange);white-space:nowrap}
.msng-loyalty-sub{margin-top:4px;font-size:12px;color:var(--text2)}
.msng-loyalty-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.msng-loyalty-btn{border:1px solid rgba(255,107,0,.25);background:rgba(255,107,0,.12);color:var(--text);padding:9px 12px;border-radius:var(--ui-radius-md,10px);font-size:12px;font-weight:800;cursor:pointer}
.msng-loyalty-btn--ghost{background:var(--surface)}
.msng-loyalty-levels{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.msng-loyalty-tier{display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--ui-radius-md,10px);background:var(--surface);border:1px solid var(--line)}
.msng-loyalty-tier.active{border-color:rgba(255,107,0,.35);box-shadow:inset 0 0 0 1px rgba(255,107,0,.16)}
.msng-loyalty-tier span{font-size:18px}
.msng-loyalty-tier div{flex:1;min-width:0}
.msng-loyalty-tier strong,.msng-loyalty-tier b{display:block;font-size:12px}
.msng-loyalty-tier small{display:block;font-size:10px;color:var(--text3)}
.msng-loyalty-history-title{margin-top:12px;font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.msng-loyalty-history{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.msng-loyalty-row{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:var(--ui-radius-md,10px);background:var(--surface)}
.msng-loyalty-row-pts{min-width:44px;color:var(--orange);font-weight:900}
.msng-loyalty-row-main{min-width:0}
.msng-loyalty-row-main div{font-size:12px;font-weight:700}
.msng-loyalty-row-main small{font-size:11px;color:var(--text3)}
@media (max-width:640px){
  .msng-loyalty-levels{grid-template-columns:1fr}
  .msng-loyalty-card{margin:0 12px 10px;padding:12px}
}


.msng-chat-avatar-btn{
  appearance:none;border:0;background:transparent;padding:0;margin:0;cursor:pointer;flex-shrink:0;
}
.msng-chat-avatar-btn .msng-chat-av{transition:.2s}
.msng-chat-avatar-btn:hover .msng-chat-av{transform:scale(1.04);box-shadow:0 0 0 4px rgba(255,107,0,.08)}
.msng-subpanel--profile{max-width:420px}
.msng-subpanel-body--profile{display:flex;flex-direction:column;gap:14px}
.msng-profile-top{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface)}
.msng-profile-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.14);border:2px solid rgba(255,107,0,.25);color:var(--orange);font-family:'Oswald',sans-serif;font-size:20px;font-weight:700;flex-shrink:0}
.msng-profile-meta{min-width:0}
.msng-profile-name{font-size:15px;font-weight:800;line-height:1.2}
.msng-profile-sub{font-size:12px;color:var(--text3);margin-top:4px;word-break:break-word}


.msng-staff-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.msng-staff-card{border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:var(--ui-radius-md,10px);padding:12px;text-align:left;display:flex;flex-direction:column;gap:6px;cursor:pointer;transition:.15s}
.msng-staff-card:hover,.msng-staff-card.active{border-color:rgba(255,140,0,.35);background:rgba(255,140,0,.08)}
.msng-staff-card-top{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text2)}
.msng-staff-card-count{font-size:26px;font-weight:800;line-height:1;color:var(--text)}
.msng-staff-card-sub{font-size:11px;color:var(--text3);line-height:1.35}
.msng-inbox-pill{display:inline-flex;align-items:center;gap:6px;margin:3px 0 6px;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:700;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text2)}
.msng-inbox-pill--admin_queue{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.3);color:#93c5fd}
.msng-inbox-pill--overdue_admin_queue,.msng-inbox-pill--overdue{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.3);color:#fca5a5}
.msng-inbox-pill--waiting_staff{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.3);color:#fcd34d}
.msng-inbox-pill--waiting_client{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.3);color:#86efac}
@media (max-width: 720px){
  .msng-staff-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .msng-staff-card{padding:10px;border-radius:var(--ui-radius-md,10px)}
  .msng-staff-card-count{font-size:18px}
}

/* ═══════════════════════════════════════════════════════
   MESSAGES PAGE REDESIGN
═══════════════════════════════════════════════════════ */
.msng-full-page { padding-bottom: 18px; }

/* Hero */
.msng-hero { background: linear-gradient(180deg, var(--bg2) 0%, var(--bg) 100%); border-bottom: 1px solid var(--line); padding: 48px 0 32px; }
.msng-hero-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.msng-hero-left { display: flex; align-items: center; gap: 16px; }
.msng-hero-av { width: 56px; height: 56px; border-radius: var(--ui-radius-md,10px); display: flex; align-items: center; justify-content: center; font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700; flex-shrink: 0; }
.msng-hero-title { font-family: 'Oswald', sans-serif; font-size: clamp(22px, 3.5vw, 34px); font-weight: 700; line-height: 1.1; }
.msng-hero-sub { font-size: 13px; color: var(--text3); margin-top: 5px; max-width: 380px; line-height: 1.55; }
.msng-hero-stats { display: flex; gap: 12px; flex-shrink: 0; }
.msng-stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px); padding: 12px 18px; text-align: center; min-width: 70px; }
.msng-stat-n { display: block; font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; }
.msng-stat span:last-child { font-size: 10px; color: var(--text3); margin-top: 3px; display: block; }

/* Shell */
.msng-page-shell { width:min(1140px, calc(100% - 10vw)); border-radius: var(--ui-radius-md,10px); overflow: hidden; margin:24px auto; }
.msng-page-header { padding: 16px 20px; border-bottom: 1px solid var(--line); background: var(--bg2); }
.msng-page-body { min-height: 360px; }

/* Search row */
.msng-search-row--page { background: var(--surface); border: 1px solid var(--line); border-radius: var(--ui-radius-md,10px); display: flex; align-items: center; gap: 10px; padding: 0 14px; }
.msng-search-row--page::before { content: '🔍'; font-size: 14px; }
.msng-search-row--page input { background: none; border: none; outline: none; font-size: 14px; color: var(--text); padding: 11px 0; width: 100%; font-family: 'Mulish', sans-serif; }


/* Section headers */

/* Chat items on page */
.msng-list--page .msng-item { padding: 14px 20px; border-bottom: 1px solid var(--line); transition: background .15s; }
.msng-list--page .msng-item:last-child { border-bottom: none; }
.msng-list--page .msng-item:hover { background: rgba(255,107,0,.04); }

/* Empty CTA */
.msng-empty-cta { padding: 48px 24px; text-align: center; }
.msng-empty--page { padding: 60px 24px; text-align: center; color: var(--text3); }

/* Inbox cards */
.msng-inbox-cards { display: grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 8px; margin-bottom: 12px; }
.msng-inbox-card { padding: 12px 14px; border-radius: var(--ui-radius-md,10px); border: 1.5px solid var(--line); cursor: pointer; transition: border-color .15s; }
.msng-inbox-card:hover { border-color: var(--orange); }
.msng-inbox-card-n { font-family: 'Oswald',sans-serif; font-size: 20px; font-weight: 700; }
.msng-inbox-card-l { font-size: 11px; color: var(--text3); margin-top: 3px; }

@media (max-width: 640px) {
  .msng-hero { padding: 24px 0 18px; }
  .msng-hero-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
  .msng-hero-left { gap: 12px; }
  .msng-hero-av { width: 44px; height: 44px; font-size: 16px; border-radius: var(--ui-radius-md,10px); }
  .msng-hero-title { font-size: clamp(20px, 6vw, 28px); }
  .msng-hero-stats { gap: 8px; width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); }
  .msng-stat { padding: 10px 8px; min-width: 0; text-align: center; border-radius: var(--ui-radius-md,10px); }
  .msng-stat-n { font-size: 18px; }
  .msng-page-shell { margin-top:16px; }
  .msng-list--page .msng-item { padding: 12px 14px; }
}

/* ═══════════════════════════════════════════════════════════════════
   MESSAGES PAGE IMPROVEMENTS
═══════════════════════════════════════════════════════════════════ */

/* Empty state CTA */
.msng-empty-cta {
  text-align: center;
  padding: 40px 24px;
  max-width: 400px;
  margin: 0 auto;
}

/* Chat list item улучшения */
.msng-chat-item {
  transition: background .15s, transform .1s;
}
.msng-chat-item:hover {
  background: rgba(255,255,255,.04);
}
.msng-chat-item:active {
  transform: scale(.99);
}

/* Unread badge */
.msng-unread-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--orange);
  flex-shrink: 0;
}

/* Статус индикатор в заголовке чата */
.msng-chat-status {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: 99px;
}
.msng-chat-status.new     { background: rgba(255,107,0,.12); color: var(--orange); }
.msng-chat-status.process { background: rgba(52,211,153,.12); color: #34d399; }
.msng-chat-status.done    { background: rgba(148,163,184,.12); color: var(--text3); }

/* Quick actions в пустом состоянии: не трогаем панель быстрых действий в поле ввода чата */
.msng-empty .msng-quick-actions,
.msng-empty-preview .msng-quick-actions,
.msng-empty-cta .msng-quick-actions {
  display: flex; flex-direction: column; gap: 10px;
  margin-top: 20px;
}
.msng-quick-action {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
  border-radius: var(--ui-radius-md,10px);
  border: 1px solid var(--line);
  background: var(--bg2);
  cursor: pointer; text-align: left;
  transition: border-color .15s, background .15s;
}
.msng-quick-action:hover {
  border-color: var(--orange);
  background: rgba(255,107,0,.04);
}
.msng-quick-action-ico { font-size: 24px; flex-shrink: 0; }
.msng-quick-action-title { font-size: 14px; font-weight: 700; color: var(--text); }
.msng-quick-action-sub { font-size: 12px; color: var(--text3); margin-top: 2px; }

@media (max-width: 640px) {
  .msng-full-page { padding-bottom: calc(var(--bnav-h, 68px) + 16px); }
  .msng-hero { padding: 20px 0 16px; }
  .msng-page-shell { width:calc(100% - 24px); margin:12px auto 16px; border-radius: var(--ui-radius-md,10px); }
  .msng-empty-cta { padding: 28px 16px; }
}


/* r196 — messages page: remove neutral wrapper and style direct page nodes */
.msng-full-page > .msng-page-header,
.msng-full-page > .msng-page-body{
  width:min(1140px, calc(100% - 10vw));
  margin-left:auto;
  margin-right:auto;
}
.msng-full-page > .msng-page-header{
  margin-top:24px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0 0;
}
.msng-full-page > .msng-page-body{
  margin-bottom:24px;
  border:1px solid var(--line);
  border-top:0;
  border-radius:0 0 var(--ui-radius-md,10px) var(--ui-radius-md,10px);
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
  overflow:hidden;
}
@media (max-width:640px){
  .msng-hero-inner{display:none!important}
  .msng-full-page > .msng-page-header,
  .msng-full-page > .msng-page-body{width:calc(100% - 24px)}
  .msng-full-page > .msng-page-header{margin-top:12px;border-radius:var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0 0}
  .msng-full-page > .msng-page-body{margin-bottom:10px;border-radius:0 0 var(--ui-radius-md,10px) var(--ui-radius-md,10px)}
}

/* r198 — messages page: single card container for preview/list */
.msng-page-content{
  width:min(18px, calc(100% - 10vw));
  margin:24px auto 28px;
  padding:0;
}
#msng-page-chatbox.msng-empty-cta{
  max-width:none;
  width:100%;
  text-align:left;
  padding:18px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--line);
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
  overflow:hidden;
}
.msng-empty-preview{
  min-height:220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:22px 16px;
}
.msng-empty-preview__icon{font-size:42px;margin-bottom:12px;line-height:1}
.msng-empty-preview__title{font-family:'Oswald',sans-serif;font-size:22px;font-weight:800;color:var(--text);margin-bottom:8px}
.msng-empty-preview__text{font-size:13px;line-height:1.45;color:var(--text3);max-width:420px;margin:0 auto 18px}
.msng-empty-preview__btn{padding:11px 18px;border-radius:var(--ui-radius-md,10px);font-size:13px;font-weight:800}
.msng-empty-preview--compact{min-height:180px}
.msng-page-list-in-card{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.msng-page-list-in-card .msng-list--page{border-radius:var(--ui-radius-md,10px);overflow:hidden}
@media (max-width:640px){
  .msng-hero-inner{display:none!important}
  .msng-page-content{width:calc(100% - 24px);margin:12px auto 16px}
  #msng-page-chatbox.msng-empty-cta{padding:12px;border-radius:var(--ui-radius-md,10px)}
  .msng-empty-preview{min-height:18px;padding:18px 10px}
  .msng-empty-preview__title{font-size:20px}
  .msng-empty-preview__text{font-size:12px;margin-bottom:16px}
  .msng-page-list-in-card{margin-top:10px;padding-top:10px}
}


/* r203 — messages filters use common mo-filter-bar only */
.msng-page-content > #msng-page-filterbar {
  margin: 0 0 8px;
}
.msng-page-content > #msng-page-filterbar > .mo-filter-bar.msng-mo-filter-bar {
  margin: 0 0 8px;
}
.msng-mo-filter-bar .mo-filter-tabs {
  flex-wrap: nowrap;
  overflow-x: auto;
}


/* r209 — messages: hide whole hero on mobile */
@media (max-width: 640px){
  .msng-full-page .msng-hero{
    display:none!important;
  }
}


/* r210 — messages: sections/list moved directly into .container.msng-page-content */
#msng-page-listmount{
  width:100%;
}
.msng-page-content > #msng-page-listmount > .msng-list--page{
  margin-top:8px;
}
.msng-page-content > #msng-page-listmount > .msng-empty-preview--list{
  border:1px solid var(--line);
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
}
#msng-page-chatbox[hidden]{
  display:none!important;
}


/* r211 — messenger quick actions restore after messages layout move */
.msng-input-area > .msng-quick-actions{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin:0 0 8px 0;
}
.msng-input-area > .msng-quick-actions .msng-qa-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
}
@media (max-width:640px){
  .msng-input-area > .msng-quick-actions{
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    padding-bottom:2px;
  }
  .msng-input-area > .msng-quick-actions .msng-qa-btn{
    flex:0 0 auto;
    padding:6px 10px;
  }
}

/* r213 — media bubbles fit and fullscreen viewer */
.msng-msg{max-width:min(78%, 520px); min-width:0;}
.msng-bubble.file-bubble{
  display:block;
  width:fit-content;
  max-width:min(72vw, 320px);
  min-width:0;
  padding:0;
  border:0;
  cursor:pointer;
  overflow:hidden;
  text-align:left;
  box-sizing:border-box;
}
.msng-msg.mine .msng-bubble.file-bubble,
.msng-msg.theirs .msng-bubble.file-bubble{background:var(--surface2); color:var(--text);}
.msng-media-bubble{border-radius:var(--ui-radius-md,10px)!important; box-shadow:0 10px 24px rgba(0,0,0,.12);}
.msng-img-preview{
  display:block;
  width:min(72vw, 320px);
  max-width:100%;
  height:auto;
  max-height:260px;
  object-fit:cover;
  background:var(--surface);
}
.msng-video-preview{position:relative;width:min(72vw, 320px);max-width:100%;height:190px;background:#05070b;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.msng-video-preview video{width:100%;height:100%;object-fit:cover;opacity:.78;}
.msng-video-play{position:absolute;inset:auto;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:999px;background:rgba(255,255,255,.9);color:#111827;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.22);}
.msng-file-caption{display:block;max-width:100%;padding:8px 10px;font-size:11px;font-weight:800;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:var(--surface);border-top:1px solid var(--line);}
.msng-file-row{display:flex;align-items:center;gap:10px;max-width:min(72vw, 320px);padding:12px 14px;box-sizing:border-box;}
.msng-file-ico{font-size:22px;flex:0 0 auto;}
.msng-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:800;color:var(--text);}
.msng-audio-bubble{max-width:min(78vw, 340px);}
.msng-audio-row{display:flex;align-items:center;gap:10px;min-width:0;}
.msng-audio-row audio{width:min(60vw, 260px);max-width:100%;height:36px;}
.msng-media-viewer{position:fixed;inset:0;z-index:100005;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(3,7,18,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.msng-media-viewer__card{width:min(96vw, 920px);max-height:94dvh;display:flex;flex-direction:column;border-radius:var(--ui-radius-lg,18px);background:var(--card);border:1px solid var(--line);box-shadow:0 24px 80px rgba(0,0,0,.42);overflow:hidden;}
.msng-media-viewer__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--bg2);}
.msng-media-viewer__head div{min-width:0;display:flex;flex-direction:column;gap:2px;}
.msng-media-viewer__head b{font-size:15px;}
.msng-media-viewer__head span{font-size:12px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw;}
.msng-media-viewer__close{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;font-size:18px;}
.msng-media-viewer__body{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:12px;overflow:auto;background:#05070b;}
.msng-media-viewer__body img{display:block;max-width:100%;max-height:72dvh;object-fit:contain;border-radius:var(--ui-radius-md,10px);}
.msng-media-viewer__body video{display:block;width:100%;max-width:880px;max-height:72dvh;border-radius:var(--ui-radius-md,10px);background:#000;}
.msng-file-open-card{display:grid;place-items:center;gap:12px;color:#fff;text-align:center;padding:40px;}
.msng-file-open-card span{font-size:56px;}
.msng-media-viewer__actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px 16px;border-top:1px solid var(--line);background:var(--bg2);}
.msng-media-delete{color:#ef4444!important;border-color:rgba(239,68,68,.35)!important;}
@media(max-width:640px){
  .msng-msg{max-width:86%;}
  .msng-bubble.file-bubble,.msng-img-preview,.msng-video-preview,.msng-file-row{max-width:76vw;width:min(76vw, 300px);}
  .msng-video-preview{height:170px;}
  .msng-media-viewer{padding:10px;align-items:flex-end;}
  .msng-media-viewer__card{width:100%;max-height:96dvh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;}
  .msng-media-viewer__body img,.msng-media-viewer__body video{max-height:68dvh;}
  .msng-media-viewer__actions .btn{flex:1 1 auto;justify-content:center;}
}

/* r214 — messages: flat list only, no duplicated grouped sections */
#msng-page-listmount > .msng-list--page{
  margin-top:8px;
}

/* r215 — #messages must be flat: no grouped sections/head labels */
#msng-page-listmount{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:8px;
}
#msng-page-listmount > .msng-list--page{
  margin-top:0;
}
#msng-page-listmount .msng-page-section,
#msng-page-listmount .msng-page-section-head{
  display:none!important;
}

/* r218 — messenger quick actions attachment preview */
.msng-qa-btn--media{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.msng-attach-preview-modal{
  position:fixed;
  inset:0;
  z-index:100006;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(3,7,18,.74);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.msng-attach-preview-card{
  width:min(94vw, 620px);
  max-height:92dvh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:var(--ui-radius-lg,18px);
  background:var(--card);
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(0,0,0,.38);
}
.msng-attach-preview-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  background:var(--bg2);
}
.msng-attach-preview-head div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.msng-attach-preview-head b{font-size:15px;color:var(--text);}
.msng-attach-preview-head span{font-size:12px;color:var(--text3);}
.msng-attach-preview-body{
  min-height:0;
  overflow:auto;
  padding:14px;
}
.msng-attach-preview-media{
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:var(--ui-radius-lg,18px);
  background:#05070b;
  border:1px solid var(--line);
}
.msng-attach-preview-media img,
.msng-attach-preview-media video{
  display:block;
  max-width:100%;
  max-height:54dvh;
  object-fit:contain;
  background:#05070b;
}
.msng-attach-preview-meta{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.msng-attach-preview-meta b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  color:var(--text);
}
.msng-attach-preview-meta span{font-size:12px;color:var(--text3);}
.msng-attach-preview-file{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid var(--line);
  background:var(--surface);
}
.msng-attach-preview-file > span{font-size:34px;flex:0 0 auto;}
.msng-attach-preview-file div{min-width:0;display:flex;flex-direction:column;gap:3px;}
.msng-attach-preview-file b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:var(--text);}
.msng-attach-preview-file em{font-style:normal;font-size:12px;color:var(--text3);}
.msng-attach-preview-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 16px;
  border-top:1px solid var(--line);
  background:var(--bg2);
}
.msng-attach-preview-actions .btn{min-height:42px;}
@media(max-width:640px){
  .msng-qa-btn--media span{display:none;}
  .msng-attach-preview-modal{padding:10px;align-items:flex-end;}
  .msng-attach-preview-card{width:100%;max-height:94dvh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;}
  .msng-attach-preview-media img,
  .msng-attach-preview-media video{max-height:58dvh;}
  .msng-attach-preview-actions .btn{flex:1 1 auto;justify-content:center;}
}

/* r230 — messenger loading / empty preview inside .msng-messages */
.msng-messages:has(.msng-chat-state){
  justify-content:center;
  align-items:stretch;
  min-height:260px;
}
.msng-chat-state{
  width:min(100%, 520px);
  margin:auto;
  padding:28px 18px;
  border-radius:var(--ui-radius-lg,18px);
  border:1px solid rgba(255,107,0,.16);
  background:
    radial-gradient(circle at 12% 10%, rgba(255,107,0,.12), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,247,237,.82));
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  text-align:center;
  color:var(--text);
}
.msng-chat-state__icon{font-size:42px;line-height:1;margin-bottom:12px}
.msng-chat-state__title{font-size:18px;font-weight:900;letter-spacing:-.01em;margin-bottom:7px;color:var(--text)}
.msng-chat-state__text{max-width:380px;margin:0 auto;color:var(--text3);font-size:13px;line-height:1.5}
.msng-chat-state__loader{height:38px;display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px}
.msng-chat-state__loader span{width:10px;height:10px;border-radius:50%;background:var(--orange);opacity:.35;animation:msngLoaderDot 1s ease-in-out infinite}
.msng-chat-state__loader span:nth-child(2){animation-delay:.16s}.msng-chat-state__loader span:nth-child(3){animation-delay:.32s}
@keyframes msngLoaderDot{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-7px);opacity:1}}
.msng-chat-skeleton{display:grid;gap:9px;margin:18px auto 0;max-width:330px}
.msng-chat-skeleton i{display:block;height:12px;border-radius:999px;background:linear-gradient(90deg, rgba(255,107,0,.10), rgba(255,107,0,.24), rgba(255,107,0,.10));background-size:220% 100%;animation:msngSkeleton 1.2s linear infinite}
.msng-chat-skeleton i:nth-child(1){width:72%}.msng-chat-skeleton i:nth-child(2){width:92%;justify-self:end}.msng-chat-skeleton i:nth-child(3){width:58%}
@keyframes msngSkeleton{0%{background-position:220% 0}100%{background-position:-220% 0}}
@media (max-width:640px){.msng-messages:has(.msng-chat-state){min-height:220px}.msng-chat-state{padding:22px 14px;border-radius:var(--ui-radius-lg,18px)}.msng-chat-state__title{font-size:10px}.msng-chat-state__text{font-size:10px}}

/* ── UI-r5 — message chips on master card ── */
.mcl-msg-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}
.mcl-msg-chip{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 9px 4px 7px;
  border-radius: var(--ui-radius-sm, 6px);
  background: var(--orange-dim, rgba(255,107,0,.08));
  border: 1px solid var(--orange-brd, rgba(255,107,0,.22));
  color: var(--orange, #FF6B00);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, transform .1s;
  touch-action: manipulation;
  min-height: 28px;
  max-width: 140px;
}
.mcl-msg-chip:active{ transform: scale(.96); }
.mcl-msg-chip-ico{ font-size: 12px; flex-shrink: 0; }
.mcl-msg-chip-txt{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mcl-msg-chip--profile{
  background: var(--surface2, rgba(15,23,42,.04));
  border-color: var(--line, rgba(15,23,42,.1));
  color: var(--text2, #475569);
}

/* chat unread badge on master avatar */
.mcl-chat-badge{
  position: absolute;
  top: -4px; right: -4px;
  min-width: 16px; height: 16px;
  background: var(--orange, #FF6B00);
  color: #fff;
  font-size: 9px; font-weight: 800;
  border-radius: 99px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px;
  border: 1.5px solid var(--bg, #fff);
  pointer-events: none;
}

/* ── mo-chat-entity: inline chat card in order ── */
.mo-chat-entity{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--orange-dim, rgba(255,107,0,.06));
  border-top: 1px solid var(--orange-brd, rgba(255,107,0,.18));
  cursor: pointer;
  transition: background .15s;
  user-select: none;
}
.mo-chat-entity:active{ background: var(--orange-dim, rgba(255,107,0,.12)); }
.mo-chat-entity-ico{
  font-size: 20px;
  flex-shrink: 0;
  line-height: 1;
}
.mo-chat-entity-body{ flex: 1; min-width: 0; }
.mo-chat-entity-label{
  font-size: 13px;
  font-weight: 700;
  color: var(--orange, #FF6B00);
}
.mo-chat-entity-hint{
  font-size: 11px;
  color: var(--text3, #94a3b8);
  margin-top: 1px;
}
.mo-chat-entity-badge{
  min-width: 20px; height: 20px;
  background: var(--orange, #FF6B00);
  color: #fff;
  font-size: 10px; font-weight: 800;
  border-radius: 99px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
  flex-shrink: 0;
}
.mo-chat-entity-arr{
  font-size: 20px;
  color: var(--orange, #FF6B00);
  opacity: .6;
  flex-shrink: 0;
}

/* === SOURCE: css/orders.css === */
/* ═══════════════════════════════════════════════
   KARETA.KZ — ORDER SYSTEM STYLES
═══════════════════════════════════════════════ */

/* ── Order Wizard Overlay ── */
.owiz-overlay {
  display: none;
  position: fixed; inset: 0;
  z-index: 800;
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  align-items: flex-end; justify-content: center;
}
.owiz-overlay.open { display: flex; }

@media (min-width: 640px) {
  .owiz-overlay { align-items: center; }
}

.owiz-box {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;
  width: 100%;
  max-height: 92dvh;
  display: flex; flex-direction: column;
  overflow: hidden;
  animation: slideUp .32s cubic-bezier(.16,1,.3,1);
}
@keyframes slideUp { from{transform:translateY(40px);opacity:0} to{transform:none;opacity:1} }

@media (min-width: 640px) {
  .owiz-box { border-radius: var(--ui-radius-md,10px); max-width: 620px; max-height: 88vh; }
}

.owiz-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 20px 14px; border-bottom: 1px solid var(--line); flex-shrink: 0;
}
.owiz-title {
  font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
}
.owiz-close {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--surface); color: var(--text3); font-size: 20px;
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .2s;
}
.owiz-close:hover { background: var(--surface2); color: var(--text); }

/* Steps bar */
.owiz-steps {
  display: flex; align-items: center;
  padding: 14px 20px; border-bottom: 1px solid var(--line); flex-shrink: 0;
  overflow-x: auto; scrollbar-width: none; gap: 0;
}
.owiz-steps::-webkit-scrollbar { display: none; }
.owiz-step {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px; flex-shrink: 0; position: relative;
}
.owiz-step-dot {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--surface2); border: 1.5px solid var(--line);
  color: var(--text3); font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: .25s; z-index: 1;
}
.owiz-step.active .owiz-step-dot { background: var(--orange); border-color: var(--orange); color: #fff; box-shadow: 0 0 0 4px rgba(255,107,0,.15); }
.owiz-step.done   .owiz-step-dot { background: rgba(34,197,94,.15); border-color: #22c55e; color: #22c55e; }
.owiz-step-label { font-size: 9px; font-weight: 700; color: var(--text3); white-space: nowrap; }
.owiz-step.active .owiz-step-label { color: var(--orange); }
.owiz-step.done   .owiz-step-label { color: #22c55e; }
.owiz-step-line {
  position: absolute; top: 14px; left: 50%; width: calc(100% + 24px);
  height: 1.5px; background: var(--line); z-index: 0;
}
.owiz-step.done .owiz-step-line { background: #22c55e; }

/* Body */
.owiz-body { flex: 1; overflow-y: auto; padding: 18px 20px; }

/* Footer */
.owiz-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-top: 1px solid var(--line); flex-shrink: 0;
  padding-bottom: max(14px, env(safe-area-inset-bottom, 14px));
  gap: 10px;
}
.owiz-footer .btn { flex: 1; justify-content: center; }

/* ── Wizard content styles ── */
.owiz-section-title {
  font-size: 11px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 12px;
}
.owiz-cat-label {
  font-size: 11px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px;
}
.owiz-svc-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px;
}
.owiz-svc-chip {
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-md,10px); padding: 12px; cursor: pointer; transition: .2s;
}
.owiz-svc-chip:hover { border-color: var(--orange-brd); background: var(--orange-dim); }
.owiz-svc-chip.sel  { border-color: var(--orange); background: var(--orange-dim); }
.owiz-svc-ico   { font-size: 22px; display: block; margin-bottom: 6px; }
.owiz-svc-name  { font-size: 12px; font-weight: 700; margin-bottom: 3px; }
.owiz-svc-price { font-size: 11px; color: var(--orange); font-weight: 600; }

.owiz-priority-row { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.owiz-prio-btn {
  padding: 7px 14px; border-radius: var(--ui-radius-sm,5px); font-size: 12px; font-weight: 700;
  background: var(--surface); border: 1.5px solid var(--line); cursor: pointer; transition: .2s;
}
.owiz-prio-btn.sel { border-color: var(--orange); background: var(--orange-dim); color: var(--orange); }

.owiz-days-scroll {
  display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none;
}
.owiz-days-scroll::-webkit-scrollbar { display: none; }
.owiz-day-btn {
  flex-shrink: 0; padding: 8px 14px; border-radius: var(--ui-radius-md,10px); font-size: 12px; font-weight: 700;
  background: var(--surface); border: 1.5px solid var(--line); cursor: pointer; transition: .2s;
  white-space: nowrap;
}
.owiz-day-btn:hover { border-color: var(--orange-brd); }
.owiz-day-btn.sel   { background: var(--orange); border-color: var(--orange); color: #fff; }
.owiz-day-btn.weekend { color: var(--text3); }

.owiz-times-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 4px;
}
.owiz-time-btn {
  padding: 10px 4px; border-radius: var(--ui-radius-sm,5px); font-size: 13px; font-weight: 700; text-align: center;
  background: var(--surface); border: 1.5px solid var(--line); cursor: pointer; transition: .2s;
}
.owiz-time-btn:hover { border-color: var(--orange-brd); }
.owiz-time-btn.sel  { background: var(--orange); border-color: var(--orange); color: #fff; }
.owiz-time-btn.busy { opacity: .45; cursor: not-allowed; background: var(--surface2); }
.owiz-pick-hint { font-size: 13px; color: var(--text3); padding: 12px 0; text-align: center; }

.owiz-masters-row {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px;
}
.owiz-master-card {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 14px; border-radius: var(--ui-radius-md,10px); cursor: pointer; transition: .2s;
  background: var(--surface); border: 1.5px solid var(--line); min-width: 80px;
}
.owiz-master-card:hover { border-color: var(--orange-brd); }
.owiz-master-card.sel   { border-color: var(--orange); background: var(--orange-dim); }
.owiz-master-av {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 700;
}
.owiz-master-name { font-size: 12px; font-weight: 700; }
.owiz-master-spec { font-size: 10px; color: var(--text3); }

/* Client step */
.owiz-form {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
@media (max-width: 500px) { .owiz-form { grid-template-columns: 1fr; } }
.owiz-field label { display: block; font-size: 11px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }
.owiz-input {
  width: 100%; box-sizing: border-box;
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--ui-radius-sm,5px); padding: 10px 12px; font-size: 14px;
  color: var(--text); font-family: 'Mulish', sans-serif;
  outline: none; transition: .2s;
}
.owiz-input:focus { border-color: var(--orange-brd); }
.owiz-input textarea { resize: vertical; }

.owiz-divider {
  display: flex; align-items: center; gap: 10px; margin: 14px 0;
  color: var(--text3); font-size: 12px;
}
.owiz-divider::before, .owiz-divider::after { content:''; flex:1; height:1px; background:var(--line); }

.owiz-cl-dropdown {
  display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 10;
  background: var(--bg2); border: 1px solid var(--orange-brd);
  border-radius: 0 0 var(--ui-radius-md,10px) var(--ui-radius-md,10px); box-shadow: 0 8px 24px rgba(0,0,0,.4);
  max-height: 200px; overflow-y: auto;
}
.owiz-cl-item {
  padding: 10px 14px; cursor: pointer; border-bottom: 1px solid var(--line); transition: .15s;
}
.owiz-cl-item:hover { background: var(--orange-dim); }
.owiz-client-selected {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: var(--ui-radius-sm,5px); margin-top: 10px;
  background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.25); font-size: 13px;
}
.owiz-cs-ico { color: #22c55e; font-size: 16px; font-weight: 700; }

/* Confirm step */
.owiz-confirm-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--ui-radius-md,10px); overflow: hidden;
}
.owiz-cc-row {
  display: flex; align-items: flex-start; gap: 10px; padding: 11px 14px;
  border-bottom: 1px solid var(--line); font-size: 13px;
}
.owiz-cc-row span:first-child { color: var(--text3); min-width: 130px; flex-shrink: 0; }
.owiz-cc-row span:last-child  { font-weight: 600; flex: 1; }
.owiz-cc-total {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 14px; background: var(--orange-dim);
  font-size: 13px; font-weight: 700;
}
.owiz-cc-price { font-family: 'Oswald', sans-serif; font-size: 22px; color: var(--orange); }

/* ═══════════════════════════════════════════════
   ORDER DETAIL PANEL
═══════════════════════════════════════════════ */
.odet-overlay {
  display: none; position: fixed; inset: 0; z-index: 750;
  background: rgba(0,0,0,.65); backdrop-filter: blur(4px);
  align-items: flex-end; justify-content: center;
}
.odet-overlay.open { display: flex; }
@media (min-width: 700px) { .odet-overlay { align-items: center; } }

.odet-panel {
  background: var(--bg2); border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0; width: 100%; max-height: 92dvh;
  display: flex; flex-direction: column; overflow: hidden;
  animation: slideUp .3s cubic-bezier(.16,1,.3,1);
}
@media (min-width: 700px) { .odet-panel { border-radius: var(--ui-radius-md,10px); max-width: 560px; max-height: 88vh; } }

.odet-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 20px 20px 14px; border-bottom: 1px solid var(--line); flex-shrink: 0;
  position: relative;
}
.odet-id { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 700; margin-bottom: 6px; }
.odet-status {
  display: inline-block; font-size: 11px; font-weight: 700;
  padding: 3px 10px; border-radius: 99px;
}
.odet-body { flex: 1; overflow-y: auto; }
.odet-section { padding: 16px 20px; border-bottom: 1px solid var(--line); }
.odet-section-title { font-size: 11px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; }

.odet-info-grid { display: grid; gap: 1px; }
.odet-row { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.odet-key { font-size: 12px; color: var(--text3); min-width: 120px; flex-shrink: 0; }
.odet-val { font-size: 13px; font-weight: 600; flex: 1; }

.odet-status-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.odet-status-btn {
  padding: 8px 14px; border-radius: var(--ui-radius-sm,5px); font-size: 12px; font-weight: 700;
  background: var(--surface); border: 1.5px solid var(--line);
  color: var(--text3); cursor: pointer; transition: .2s;
}
.odet-status-btn.active { background: var(--sc, var(--orange))22; border-color: var(--sc, var(--orange)); color: var(--sc, var(--orange)); }
.odet-status-btn:hover:not(.active) { border-color: var(--sc, var(--line)); opacity: .85; }

.odet-masters-row { display: flex; gap: 8px; flex-wrap: wrap; }
.odet-master-chip {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: var(--ui-radius-md,10px); cursor: pointer; transition: .2s;
  background: var(--surface); border: 1.5px solid var(--line); font-size: 12px; font-weight: 700;
}
.odet-master-chip:hover { border-color: var(--orange-brd); }
.odet-master-chip.active { border-color: var(--orange); background: var(--orange-dim); color: var(--orange); }
.odet-mc-av {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 11px; font-weight: 700;
}

/* Timeline */
.odet-timeline { display: flex; flex-direction: column; gap: 0; }
.odet-tl-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 8px 0;
}
.odet-tl-dot {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--surface2); border: 1.5px solid var(--line);
  color: var(--text3); font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  margin-top: 2px; transition: .25s;
}
.odet-tl-item.done .odet-tl-dot { background: rgba(34,197,94,.12); border-color: #22c55e; }
.odet-tl-label { font-size: 13px; font-weight: 600; }
.odet-tl-item.done .odet-tl-label { color: #22c55e; }
.odet-tl-time { font-size: 11px; color: var(--text3); margin-top: 2px; }
.odet-add-stage-btn {
  font-size: 11px; font-weight: 700; color: var(--orange);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-sm,5px); padding: 4px 10px; cursor: pointer; transition: .2s;
}
.odet-add-stage-btn:hover { background: rgba(255,107,0,.2); }

.odet-report-card {
  background: rgba(255,107,0,.06); border: 1px solid var(--orange-brd);
  border-left: 3px solid var(--orange); border-radius: var(--ui-radius-sm,5px);
  padding: 10px 12px; margin-bottom: 8px;
}
.odet-report-head { font-size: 11px; font-weight: 700; color: var(--orange); margin-bottom: 5px; }
.odet-report-text { font-size: 13px; color: var(--text2); line-height: 1.5; }

/* ── Clients panel toolbar ── */
.cpanel-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.cpanel-toolbar { display: flex; gap: 10px; align-items: center; }

/* ═══════════════════════════════════════════════
   ORDER DETAIL PANEL
═══════════════════════════════════════════════ */
.odet-overlay {
  display: none; position: fixed; inset: 0; z-index: 750;
  background: rgba(0,0,0,.65); backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  align-items: flex-end; justify-content: center;
}
.odet-overlay.open { display: flex; }
@media (min-width: 700px) { .odet-overlay { align-items: center; } }

.odet-panel {
  background: var(--bg2); border: 1px solid var(--line);
  border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0; width: 100%; max-height: 92dvh;
  display: flex; flex-direction: column; overflow: hidden;
  animation: slideUp .3s cubic-bezier(.16,1,.3,1);
}
@media (min-width: 700px) { .odet-panel { border-radius: var(--ui-radius-md,10px); max-width: 560px; max-height: 88vh; } }
@keyframes slideUp { from{transform:translateY(30px);opacity:0} to{transform:none;opacity:1} }

.odet-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 20px 20px 14px; border-bottom: 1px solid var(--line);
  flex-shrink: 0; position: relative;
}
.odet-id { font-family:'Oswald',sans-serif; font-size: 20px; font-weight: 700; margin-bottom: 6px; }
.odet-status-badge { display: inline-block; font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 99px; }
.odet-body { flex: 1; overflow-y: auto; }
.odet-section { padding: 14px 20px; border-bottom: 1px solid var(--line); }
.odet-sec-title {
  font-size: 11px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px;
}
.odet-row { display: flex; align-items: flex-start; gap: 8px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.03); }
.odet-key { font-size: 12px; color: var(--text3); min-width: 110px; flex-shrink: 0; }
.odet-val { font-size: 13px; font-weight: 600; flex: 1; }

.odet-status-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.odet-st-btn {
  padding: 8px 14px; border-radius: var(--ui-radius-sm,5px); font-size: 12px; font-weight: 700;
  background: var(--surface); border: 1.5px solid var(--line);
  color: var(--text3); cursor: pointer; transition: .2s;
}
.odet-st-btn.active { background: color-mix(in srgb, var(--sc) 15%, transparent); border-color: var(--sc); color: var(--sc); }
.odet-st-btn:hover:not(.active) { border-color: var(--sc); opacity: .8; }

.odet-masters-row { display: flex; gap: 8px; flex-wrap: wrap; }
.odet-master-chip {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: var(--ui-radius-md,10px); cursor: pointer; transition: .2s;
  background: var(--surface); border: 1.5px solid var(--line); font-size: 12px; font-weight: 700;
}
.odet-master-chip:hover  { border-color: var(--orange-brd); }
.odet-master-chip.active { border-color: var(--orange); background: var(--orange-dim); color: var(--orange); }
.odet-mc-av {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family:'Oswald',sans-serif; font-size: 11px; font-weight: 700;
}

.odet-timeline { display: flex; flex-direction: column; }
.odet-tl-item { display: flex; align-items: flex-start; gap: 12px; padding: 7px 0; }
.odet-tl-dot {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--surface2); border: 1.5px solid var(--line);
  color: var(--text3); font-size: 13px;
  display: flex; align-items: center; justify-content: center; transition: .25s;
}
.odet-tl-item.done .odet-tl-dot { background: rgba(34,197,94,.12); border-color: #22c55e; }
.odet-tl-label { font-size: 13px; font-weight: 600; }
.odet-tl-item.done .odet-tl-label { color: #22c55e; }
.odet-tl-time { font-size: 11px; color: var(--text3); margin-top: 2px; }
.odet-add-btn {
  font-size: 11px; font-weight: 700; color: var(--orange);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  border-radius: var(--ui-radius-sm,5px); padding: 4px 10px; cursor: pointer; transition: .2s;
}
.odet-add-btn:hover { background: rgba(255,107,0,.2); }
.odet-report-card {
  background: rgba(255,107,0,.06); border: 1px solid var(--orange-brd);
  border-left: 3px solid var(--orange); border-radius: var(--ui-radius-sm,5px);
  padding: 10px 12px; margin-bottom: 8px;
}
.odet-report-head { font-size: 11px; font-weight: 700; color: var(--orange); margin-bottom: 5px; }
.odet-report-text { font-size: 13px; color: var(--text2); line-height: 1.5; }


/* ═══════════════════════════════════════════════
   MODAL / DETAIL VISUAL SYSTEM PATCH v9.4.62
═══════════════════════════════════════════════ */
.owiz-box,
.odet-panel{
  position:relative;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    linear-gradient(180deg, rgba(255,107,0,.04), transparent 32%),
    var(--bg2);
  border:1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 100px rgba(0,0,0,.48), 0 14px 36px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
}
@media (min-width:640px){
  .owiz-box{ border-radius:var(--ui-radius-lg,18px); max-width:700px; }
}
@media (min-width:700px){
  .odet-panel{ border-radius:var(--ui-radius-lg,18px); max-width:760px; }
}
.owiz-header,
.odet-header{
  background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0));
  border-bottom:1px solid rgba(255,255,255,.07);
}
.owiz-body,
.odet-body{ scrollbar-width:thin; scrollbar-color: rgba(255,255,255,.18) transparent; }
.owiz-section-card,
.odet-section,
.odet-report-card{
  border-radius:var(--ui-radius-lg,18px);
}
.odet-section{
  margin:14px 16px 0;
  border:1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.012));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.odet-body .odet-section:last-child{ margin-bottom:16px; }
.odet-row{ border-bottom:1px solid rgba(255,255,255,.05); }
.odet-row:last-child{ border-bottom:0; }
.odet-status-btn,
.odet-st-btn,
.odet-master-chip,
.owiz-prio-btn,
.owiz-svc-chip{
  border-radius:var(--ui-radius-md,10px);
}
.odet-report-card{
  background: linear-gradient(180deg, rgba(255,107,0,.09), rgba(255,107,0,.035));
  border:1px solid rgba(255,107,0,.24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.client-modal-summary,
.order-modal-summary,
.master-schedule-surface{
  border:1px solid rgba(255,255,255,.07);
  background: linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.012));
  border-radius:var(--ui-radius-lg,18px);
}


/* HOTFIX v14.2 — detail scroll + flex containment */
#odet-panel .owiz-box{ min-height:0; }
#odet-panel-inner.odet-panel{ display:flex; flex-direction:column; min-height:0; width:100%; max-height:inherit; }
#odet-panel-inner.odet-panel .odet-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}

/* r182: centered and viewport-safe generic cmodal overlays */
.cmodal-overlay.open {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: max(10px, env(safe-area-inset-top, 0px)) 10px max(10px, env(safe-area-inset-bottom, 0px)) !important;
  overflow: hidden !important;
}
.cmodal-overlay.open > .cmodal-card,
.cmodal-overlay.open > .cmodal-box,
.cmodal-overlay.open > .modal-body-v2,
.cmodal-overlay.open .cmodal-card,
.cmodal-overlay.open .cmodal-box,
.cmodal-overlay.open .modal-body-v2 {
  margin: auto !important;
  max-height: calc(100dvh - 20px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  max-width: calc(100vw - 20px) !important;
  box-sizing: border-box !important;
}
.cmodal-overlay.open > .cmodal-card,
.cmodal-overlay.open .cmodal-card {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
.cmodal-overlay.open .cmodal-head,
.cmodal-overlay.open .cmodal-actions,
.cmodal-overlay.open .mx-filter-actions {
  flex: 0 0 auto !important;
}
.cmodal-overlay.open .cmodal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.cmodal-overlay.open > .cmodal-box .cmodal-body,
.cmodal-overlay.open .cmodal-box .cmodal-body,
.cmodal-overlay.open > .modal-body-v2,
.cmodal-overlay.open .modal-body-v2 {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}
.home-catalog-modal-card,
.cmodal-overlay.open .home-catalog-modal-card {
  width: min(900px, calc(100vw - 20px)) !important;
  max-height: calc(100dvh - 20px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  border-radius: var(--ui-radius-lg,18px) !important;
}
@media (max-width: 680px) {
  .cmodal-overlay.open {
    align-items: center !important;
    justify-content: center !important;
    padding: max(8px, env(safe-area-inset-top, 0px)) 8px max(8px, env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }
  .cmodal-overlay.open > .cmodal-card,
  .cmodal-overlay.open > .cmodal-box,
  .cmodal-overlay.open > .modal-body-v2,
  .cmodal-overlay.open .cmodal-card,
  .cmodal-overlay.open .cmodal-box,
  .cmodal-overlay.open .modal-body-v2 {
    width: min(100%, calc(100vw - 16px)) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    border-radius: var(--ui-radius-lg,18px) !important;
  }
  .home-catalog-modal-card,
  .cmodal-overlay.open .home-catalog-modal-card {
    width: calc(100vw - 16px) !important;
    border-radius: var(--ui-radius-lg,18px) !important;
  }
}

/* === SOURCE: css/visual_audit.css === */
/* r245 — visual audit: contrast, color matrix and readable surfaces
   Loaded last. Do not add business logic here. */

:root{
  color-scheme: dark;
  --bg: #0f172a;
  --bg2: #111827;
  --surface: #182235;
  --surface2: #202b3f;
  --text: #f8fafc;
  --text1: #f8fafc;
  --text2: #d6deea;
  --text3: #a7b4c7;
  --line: rgba(226,232,240,.16);
  --line2: rgba(226,232,240,.26);
  --surface-a: rgba(255,255,255,.055);
  --surface-b: rgba(255,255,255,.095);
  --surface-c: rgba(255,255,255,.14);
  --surface-d: rgba(255,255,255,.22);
  --orange: #ff7a1a;
  --orange-l: #ff9a4d;
  --orange-dim: rgba(255,122,26,.16);
  --orange-brd: rgba(255,122,26,.34);

  --ui-page-bg: radial-gradient(circle at 12% 0%, rgba(255,122,26,.10), transparent 34%), linear-gradient(180deg, #101827 0%, #0f172a 100%);
  --ui-surface: #182235;
  --ui-surface-2: #202b3f;
  --ui-surface-strong: rgba(24,34,53,.94);
  --ui-surface-soft: rgba(255,255,255,.055);
  --ui-border: 1px solid rgba(226,232,240,.16);
  --ui-border-strong: 1px solid rgba(226,232,240,.26);
  --ui-muted-bg: rgba(226,232,240,.08);
  --ui-hover: rgba(255,122,26,.12);
  --ui-active: linear-gradient(135deg, #ff7a1a, #ff9a4d);
  --ui-on-accent: #ffffff;
  --ui-shadow-soft: 0 14px 36px rgba(2,6,23,.28);
  --ui-shadow-card: 0 16px 42px rgba(2,6,23,.26);
  --ui-shadow-float: 0 24px 70px rgba(2,6,23,.38);

  --kareta-card-bg: linear-gradient(180deg, rgba(24,34,53,.98) 0%, rgba(17,24,39,.96) 100%);
  --kareta-card-border: rgba(226,232,240,.14);
  --kareta-card-accent: rgba(255,122,26,.13);
}

[data-theme="light"],
[data-theme="auto"]{
  color-scheme: light;
  --bg: #f6f8fb;
  --bg2: #ffffff;
  --surface: #ffffff;
  --surface2: #f3f6fa;
  --text: #111827;
  --text1: #111827;
  --text2: #334155;
  --text3: #64748b;
  --line: rgba(15,23,42,.10);
  --line2: rgba(15,23,42,.16);
  --surface-a: rgba(15,23,42,.035);
  --surface-b: rgba(15,23,42,.065);
  --surface-c: rgba(15,23,42,.105);
  --surface-d: rgba(15,23,42,.17);
  --orange: #f97316;
  --orange-l: #fb923c;
  --orange-dim: rgba(249,115,22,.12);
  --orange-brd: rgba(249,115,22,.30);

  --ui-page-bg: radial-gradient(circle at 12% 0%, rgba(249,115,22,.11), transparent 34%), linear-gradient(180deg, #fffaf5 0%, #f6f8fb 38%, #f8fafc 100%);
  --ui-surface: #ffffff;
  --ui-surface-2: #f8fafc;
  --ui-surface-strong: rgba(255,255,255,.96);
  --ui-surface-soft: rgba(15,23,42,.035);
  --ui-border: 1px solid rgba(15,23,42,.10);
  --ui-border-strong: 1px solid rgba(15,23,42,.16);
  --ui-muted-bg: #f1f5f9;
  --ui-hover: rgba(249,115,22,.08);
  --ui-active: linear-gradient(135deg, #f97316, #fb923c);
  --ui-on-accent: #ffffff;
  --ui-shadow-soft: 0 10px 26px rgba(15,23,42,.07);
  --ui-shadow-card: 0 16px 38px rgba(15,23,42,.09), 0 1px 0 rgba(255,255,255,.82) inset;
  --ui-shadow-float: 0 28px 80px rgba(15,23,42,.18);

  --kareta-card-bg: linear-gradient(180deg, #ffffff 0%, #fffaf6 100%);
  --kareta-card-border: rgba(15,23,42,.10);
  --kareta-card-accent: rgba(249,115,22,.105);
}

@media (prefers-color-scheme: dark){
  [data-theme="auto"]{
    color-scheme: dark;
    --bg: #0f172a;
    --bg2: #111827;
    --surface: #182235;
    --surface2: #202b3f;
    --text: #f8fafc;
    --text1: #f8fafc;
    --text2: #d6deea;
    --text3: #a7b4c7;
    --line: rgba(226,232,240,.16);
    --line2: rgba(226,232,240,.26);
    --surface-a: rgba(255,255,255,.055);
    --surface-b: rgba(255,255,255,.095);
    --surface-c: rgba(255,255,255,.14);
    --surface-d: rgba(255,255,255,.22);
    --ui-page-bg: radial-gradient(circle at 12% 0%, rgba(255,122,26,.10), transparent 34%), linear-gradient(180deg, #101827 0%, #0f172a 100%);
    --ui-surface: #182235;
    --ui-surface-2: #202b3f;
    --ui-surface-strong: rgba(24,34,53,.94);
    --ui-surface-soft: rgba(255,255,255,.055);
    --ui-border: 1px solid rgba(226,232,240,.16);
    --ui-border-strong: 1px solid rgba(226,232,240,.26);
    --ui-muted-bg: rgba(226,232,240,.08);
    --ui-shadow-card: 0 16px 42px rgba(2,6,23,.26);
    --kareta-card-bg: linear-gradient(180deg, rgba(24,34,53,.98) 0%, rgba(17,24,39,.96) 100%);
    --kareta-card-border: rgba(226,232,240,.14);
  }
}

html, body{
  background: var(--ui-page-bg, var(--bg)) !important;
  color: var(--text1) !important;
}
body{ text-rendering: optimizeLegibility; }

/* Base readability: do not let old hard-coded colors win inside surfaces. */
.page-shell,
.spa-page,
.spa-content,
.home-catalog,
.masters-content,
.msng-full-page,
.container.msng-page-content,
.cabinet-page,
.parts-page,
.legal-page,
.admin-page{
  color: var(--text1) !important;
}

.page-shell p,
.spa-page p,
.home-catalog p,
.masters-content p,
.msng-full-page p,
.cabinet-page p,
.parts-page p,
.legal-page p,
.admin-page p{
  color: var(--text2);
}

/* Shared surfaces — cards, panels, sticky tools, tables, modals. */
.surface-card,
.page-hero,
.page-sticky-tools,
.spa-page-hero .spa-hero-body,
.spa-hero-body,
.home-hero,
.legal-hero,
.legal-rich-stat,
.legal-info-card,
.msng-item.msng-item--v2,
.master-card,
.master-contact-row,
.mo-card,
.parts-category-card,
.hcat-card,
.cab-tab,
.cab-mini-stat,
.mprof-tab,
.mprof-pane-modal-card,
.cab-pane-modal-card,
.cmodal-box,
.cmodal-card,
.spec-svc-panel,
.notifs-panel,
#notifs-panel,
.msng-empty-cta.card,
.msng-page-sections,
.msng-messages,
.ui-data-card,
.ui-table tr,
.k-dialog,
.modal-dialog-v2,
.vehicle-add-modal-box,
.svc-attach-row,
.svc-attach-thumb,
.svc-attach-modal-card{
  background: var(--ui-surface-strong, var(--ui-surface)) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
  box-shadow: var(--ui-shadow-card) !important;
}

[data-theme="light"] .surface-card,
[data-theme="light"] .page-hero,
[data-theme="light"] .page-sticky-tools,
[data-theme="light"] .spa-page-hero .spa-hero-body,
[data-theme="light"] .spa-hero-body,
[data-theme="light"] .home-hero,
[data-theme="light"] .legal-hero,
[data-theme="light"] .legal-rich-stat,
[data-theme="light"] .legal-info-card,
[data-theme="light"] .msng-item.msng-item--v2,
[data-theme="light"] .master-card,
[data-theme="light"] .master-contact-row,
[data-theme="light"] .mo-card,
[data-theme="light"] .parts-category-card,
[data-theme="light"] .hcat-card,
[data-theme="light"] .cab-tab,
[data-theme="light"] .cab-mini-stat,
[data-theme="light"] .mprof-tab,
[data-theme="light"] .msng-empty-cta.card,
[data-theme="light"] .msng-page-sections,
[data-theme="light"] .msng-messages,
[data-theme="light"] .svc-attach-row,
[data-theme="light"] .svc-attach-thumb{
  background: var(--kareta-card-bg) !important;
}

/* Text hierarchy inside cards. */
.surface-card h1,.surface-card h2,.surface-card h3,.surface-card h4,
.page-hero h1,.page-hero h2,.page-hero h3,
.spa-hero-body h1,.spa-hero-body h2,.spa-hero-body h3,
.home-hero h1,.home-hero h2,.home-hero h3,
.legal-rich-stat b,.legal-rich-stat strong,
.legal-info-card b,.legal-info-card strong,
.msng-item b,.msng-item strong,
.master-card b,.master-card strong,
.mo-card b,.mo-card strong,
.parts-category-card b,.parts-category-card strong,
.hcat-card b,.hcat-card strong,
.cab-tab b,.cab-tab strong,
.mprof-tab b,.mprof-tab strong,
.cmodal-box h1,.cmodal-box h2,.cmodal-box h3,
.cab-pane-modal-card h1,.cab-pane-modal-card h2,.cab-pane-modal-card h3,
.mprof-pane-modal-card h1,.mprof-pane-modal-card h2,.mprof-pane-modal-card h3{
  color: var(--text1) !important;
}

.surface-card p,.surface-card small,.surface-card span,
.legal-info-card p,.legal-info-card small,
.msng-item small,.msng-item .msng-item-preview,
.master-card small,.master-card .master-card__meta,
.mo-card small,.mo-card .mo-card-sub,
.parts-category-card p,.parts-category-card small,
.hcat-card p,.hcat-card small,
.cab-tab p,.cab-tab small,
.mprof-tab p,.mprof-tab small,
.cmodal-box p,.cmodal-box small,
.cab-pane-modal-card p,.cab-pane-modal-card small,
.mprof-pane-modal-card p,.mprof-pane-modal-card small{
  color: var(--text2) !important;
}

/* Sticky blocks and filters. */
.masters-sticky-tools,
.msng-sticky-tools,
.myorders-sticky-tools,
.parts-sticky-tools,
#myorders-sticky-tools,
#parts-sticky-tools{
  background: var(--ui-surface-strong) !important;
  border: var(--ui-border) !important;
  box-shadow: var(--ui-shadow-card) !important;
}
.mo-filter-bar,
.mo-filter-tabs{
  color: var(--text1) !important;
}
.mo-filter-tab{
  background: var(--ui-surface-2) !important;
  border: var(--ui-border) !important;
  color: var(--text2) !important;
  min-height: 34px;
}
.mo-filter-tab:hover{
  background: var(--ui-hover) !important;
  color: var(--text1) !important;
  border-color: var(--orange-brd) !important;
}
.mo-filter-tab.active,
.mo-filter-tab.is-active,
.mo-filter-tab[aria-selected="true"]{
  background: var(--ui-active) !important;
  color: var(--ui-on-accent) !important;
  border-color: transparent !important;
}
.mo-filter-tab.active *,
.mo-filter-tab.is-active *,
.mo-filter-tab[aria-selected="true"] *{
  color: var(--ui-on-accent) !important;
}
.mo-filter-cnt{
  background: color-mix(in srgb, var(--orange) 16%, transparent) !important;
  color: var(--text1) !important;
  border: 1px solid var(--orange-brd) !important;
}
.mo-filter-tab.active .mo-filter-cnt,
.mo-filter-tab.is-active .mo-filter-cnt{
  background: rgba(255,255,255,.22) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.28) !important;
}

/* Search controls: remove hard-coded white/black pairs. */
.mo-search-toggle,
.mo-search-panel,
.mo-search-input,
.mo-search-clear,
.svc-attach-btn,
.svc-attach-empty{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
.mo-search-input::placeholder{
  color: var(--text3) !important;
}
.mo-search-clear{
  color: var(--text2) !important;
}

/* Buttons. */
.btn,
button,
.ui-btn,
.cmodal-close,
.modal-close-v2,
.news-modal-close{
  color: inherit;
}
.btn-primary,
.ui-btn--primary,
.svc-urgent-cta,
.home-catalog-custom-request,
.auth-btn,
.mo-search-toggle.is-active{
  background: var(--ui-active) !important;
  color: var(--ui-on-accent) !important;
  border-color: transparent !important;
  box-shadow: 0 14px 30px rgba(249,115,22,.24) !important;
}
.btn-primary *,
.ui-btn--primary *,
.svc-urgent-cta *,
.home-catalog-custom-request *,
.auth-btn *{
  color: var(--ui-on-accent) !important;
}
.btn-ghost,
.ui-btn--ghost,
.btn-secondary,
.ui-btn--secondary{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
.btn-danger,
.ui-btn--danger{
  background: #ef4444 !important;
  color: #fff !important;
  border-color: #ef4444 !important;
}

/* Inputs and form readability. */
input,
textarea,
select,
.auth-input,
.k-input,
.k-textarea,
.pof-input,
.owiz-field input,
.owiz-field textarea,
.owiz-field select{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
input::placeholder,
textarea::placeholder{
  color: var(--text3) !important;
}
label,
.auth-label,
.k-label,
.pof-label,
.owiz-field label{
  color: var(--text2) !important;
}

/* Service/category cards. */
.hcat-card::before{ display:none !important; content:none !important; }
.spec-svc-item{
  background: var(--ui-surface-strong) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
.spec-svc-item:hover{
  background: var(--ui-hover) !important;
  border-color: var(--orange-brd) !important;
}
.spec-svc-item.active,
.spec-svc-item--selected{
  background: color-mix(in srgb, var(--orange) 13%, var(--ui-surface) 87%) !important;
  border-color: var(--orange-brd) !important;
}
.spec-svc-label{ color: var(--text1) !important; }
.spec-svc-sub{ color: var(--text2) !important; }
.spec-svc-price{
  background: var(--orange-dim) !important;
  color: var(--orange-l) !important;
  border: 1px solid var(--orange-brd) !important;
}

/* Message bubbles and media. */
.msng-bubble{
  color: var(--text1) !important;
}
.msng-bubble:not(.me){
  background: var(--ui-surface-2) !important;
  border: var(--ui-border) !important;
}
.msng-bubble.me{
  background: var(--ui-active) !important;
  color: #fff !important;
}
.msng-bubble.me *{ color:#fff !important; }
.msng-bubble.file-bubble{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
.msng-bubble.file-bubble img,
.msng-bubble.file-bubble video{
  background:#0f172a !important;
}
.msng-quick-actions button,
.msng-attach-preview-card,
.msng-empty-preview,
.msng-loading-state{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}

/* Legal and information pages: stronger CTA/readability. */
.legal-rich-stat .legal-card-more,
.legal-rich-stat [class*="more"],
.legal-info-card .legal-card-more,
.legal-info-card [class*="more"]{
  background: var(--ui-active) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.legal-rich-stat .legal-card-more *,
.legal-rich-stat [class*="more"] *,
.legal-info-card .legal-card-more *,
.legal-info-card [class*="more"] *{ color:#fff !important; }

/* Old dark chips/hard-coded fragments that broke light theme. */
.master-profile-chip,
.master-profile-page .chip,
.master-profile-page .badge,
.booking-picked-chip,
.booking-picked-clear,
.vehicle-editor-steps .step span,
.profile-hint,
.pof-sel-sku{
  background: var(--ui-surface-2) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}
.booking-multi-picked__title,
.booking-prefill-note__title,
.booking-prefill-note__emoji{
  color: var(--text1) !important;
}
.booking-prefill-note{
  background: var(--ui-surface-strong) !important;
  color: var(--text1) !important;
  border: var(--ui-border) !important;
}

/* Attach preview modal and service attachments. */
.svc-attach-label,
.svc-attach-thumb-meta,
.svc-attach-modal-head b,
.svc-attach-thumb-meta b{
  color: var(--text1) !important;
}
.svc-attach-thumb-meta em,
.svc-attach-modal-head span{
  color: var(--text3) !important;
}
.svc-attach-modal-body{
  background: var(--ui-surface-2) !important;
}
.svc-attach-modal-actions,
.svc-attach-modal-head{
  border-color: color-mix(in srgb, var(--line) 100%, transparent) !important;
}

/* Tables: readable desktop only, card-like rows. */
.ui-table th{ color: var(--text2) !important; }
.ui-table td{ color: var(--text1) !important; background: var(--ui-surface-strong) !important; }
.ui-table tr{ background: transparent !important; box-shadow:none !important; }

/* Status colors: modern but readable on both themes. */
.status-badge,
.mo-status-badge,
.modal-status,
[class*="status-badge"]{
  color: var(--text1);
  border: var(--ui-border);
}
.status-badge--done,
.mo-status-badge.done,
.modal-status--done{ background: rgba(34,197,94,.14) !important; color:#22c55e !important; border-color:rgba(34,197,94,.30) !important; }
.status-badge--danger,
.mo-status-badge.danger,
.modal-status--error{ background: rgba(239,68,68,.14) !important; color:#ef4444 !important; border-color:rgba(239,68,68,.30) !important; }
.status-badge--wait,
.mo-status-badge.wait,
.modal-status--wait{ background: rgba(245,158,11,.14) !important; color:#f59e0b !important; border-color:rgba(245,158,11,.30) !important; }
.status-badge--new,
.mo-status-badge.new,
.modal-status--new{ background: rgba(96,165,250,.14) !important; color:#60a5fa !important; border-color:rgba(96,165,250,.30) !important; }

/* Font scale audit: keep mobile readable, avoid tiny gray captions. */
@media (max-width: 767px){
  body{ font-size: 16px; }
  .mo-filter-tab,
  .bnav-item,
  .msng-item-preview,
  .spec-svc-sub,
  .hcat-card small,
  .cab-tab small,
  .mprof-tab small,
  .legal-info-card p,
  .parts-category-card p{ font-size: max(12.5px, .82rem) !important; }
  .msng-item b,
  .mo-card b,
  .master-card b,
  .spec-svc-label,
  .hcat-card b{ font-size: max(15px, .96rem) !important; }
}

/* Desktop visual rhythm: cleaner blocks, no gray wash. */
@media (min-width: 1024px){
  .container{ max-width: 1890px; }
  .page-hero,
  .spa-hero-body,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{ backdrop-filter: saturate(1.12) blur(14px); }
  .msng-item.msng-item--v2,
  .master-card,
  .mo-card,
  .parts-category-card,
  .hcat-card{ min-height: auto; }
}

/* r246 — interface cohesion pass: unified rhythm for remaining screens
   Keeps mobile lightweight: cards first, tables only on wider screens. */
:root{
  --ui-section-gap: clamp(14px, 1.5vw, 24px);
  --ui-section-pad: clamp(14px, 1.6vw, 24px);
  --ui-list-gap: clamp(10px, 1vw, 16px);
  --ui-control-h: 42px;
  --ui-control-h-sm: 36px;
  --ui-card-title-weight: 850;
  --ui-card-sub-size: clamp(13px, .86vw, 15px);
  --ui-icon-box: 44px;
}

/* Page rhythm: every route should feel like the same product shell. */
#app > section,
.spa-page,
.home-catalog,
.masters-content,
.msng-full-page,
.parts-page,
.cabinet-page,
.legal-page,
.admin-page,
.myorders-page{
  color: var(--text1) !important;
}

.spa-content,
.masters-content,
.msng-full-page,
.parts-page,
.cabinet-page,
.legal-page,
.admin-page,
.myorders-page{
  --route-max-readable: min(100%, 1480px);
}

.spa-content > .container,
.masters-content > .container,
.container.msng-page-content,
.parts-page .container,
.cabinet-page .container,
.legal-page .container,
.admin-page .container,
.myorders-page .container{
  display:flex;
  flex-direction:column;
  gap:var(--ui-section-gap);
}

/* Shared route headers and inner block titles. */
.page-title-row,
.section-title-row,
.card-head,
.mo-head,
.msng-section-head,
.parts-section-head,
.admin-section-head,
.cab-section-head,
.mprof-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  color:var(--text1) !important;
}
.page-title-row h1,
.section-title-row h2,
.card-head h2,
.mo-head h2,
.msng-section-head h2,
.parts-section-head h2,
.admin-section-head h2,
.cab-section-head h2,
.mprof-section-head h2{
  margin:0;
  color:var(--text1) !important;
  font-weight:900;
  letter-spacing:-.025em;
  line-height:1.15;
}
.page-title-row p,
.section-title-row p,
.card-head p,
.mo-head p,
.msng-section-head p,
.parts-section-head p,
.admin-section-head p,
.cab-section-head p,
.mprof-section-head p{
  margin:.25rem 0 0;
  color:var(--text2) !important;
  font-size:var(--ui-card-sub-size);
  line-height:1.45;
}

/* Icon language: same square icon system in nav, hero, cards and stat blocks. */
.nav-link-ico,
.spa-hero-ico,
.legal-rich-stat > i,
.legal-info-card > i,
.cab-tab-ico,
.mprof-tab-ico,
.hcat-card .hcat-ico,
.spec-svc-ico,
.parts-category-card .parts-category-ico,
.msng-empty-ico,
.empty-state__icon{
  display:inline-grid;
  place-items:center;
  width:var(--ui-icon-box);
  height:var(--ui-icon-box);
  min-width:var(--ui-icon-box);
  border-radius:var(--ui-radius-btn, 10px);
  background:color-mix(in srgb, var(--orange) 12%, var(--ui-surface-2) 88%) !important;
  color:var(--orange-l) !important;
  border:1px solid var(--orange-brd) !important;
  box-shadow:0 10px 24px rgba(249,115,22,.10);
}
.nav-link .nav-link-ico,
.bnav-item .nav-link-ico{
  width:30px;
  height:30px;
  min-width:30px;
  border-radius:var(--ui-radius-md,10px);
  font-size:16px;
}

/* Card internals: consistent spacing, no oversized gray empty zones. */
.msng-item.msng-item--v2,
.master-card,
.mo-card.card,
.parts-category-card,
.hcat-card,
.legal-info-card,
.legal-rich-stat,
.cab-tab,
.mprof-tab,
.master-contact-row.reveal.in{
  position:relative;
  overflow:hidden;
  padding:var(--ui-section-pad) !important;
}
.msng-item.msng-item--v2::after,
.master-card::after,
.mo-card.card::after,
.parts-category-card::after,
.hcat-card::after,
.legal-info-card::after,
.legal-rich-stat::after,
.cab-tab::after,
.mprof-tab::after{
  content:'';
  position:absolute;
  inset:auto 16px 0 16px;
  height:3px;
  border-radius:999px 999px 0 0;
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--orange) 34%, transparent), transparent);
  opacity:.38;
  pointer-events:none;
}
.msng-item.msng-item--v2:hover,
.master-card:hover,
.mo-card.card:hover,
.parts-category-card:hover,
.hcat-card:hover,
.legal-info-card:hover,
.legal-rich-stat:hover,
.cab-tab:hover,
.mprof-tab:hover{
  transform:translateY(-1px);
  border-color:var(--orange-brd) !important;
  box-shadow:var(--ui-shadow-float) !important;
}

/* Unified controls: keep practical height and hit area. */
.btn,
.ui-btn,
.mo-search-toggle,
.mo-filter-tab,
.svc-attach-btn,
.cab-av-camera,
.cmodal-close,
.msng-quick-actions button,
button[type="button"],
button[type="submit"]{
  min-height:var(--ui-control-h-sm);
  font-weight:800;
  letter-spacing:-.01em;
}
.btn-primary,
.ui-btn--primary,
.svc-urgent-cta,
.home-catalog-custom-request{
  min-height:var(--ui-control-h);
}

/* Forms and content tables: same sizing and contrast. */
input,
textarea,
select,
.mo-search-input,
.auth-input,
.k-input,
.k-textarea{
  min-height:var(--ui-control-h-sm);
  border-radius:var(--ui-radius-input, var(--ui-radius-btn, 10px)) !important;
  font-size:15px;
}
textarea{line-height:1.45;}

.ui-table,
.admin-table,
.data-table{
  max-width:100%;
  overflow:hidden;
  border-radius:var(--ui-radius-card, 18px);
}

/* Modal content rhythm. */
.cmodal-body,
.cab-pane-modal-body,
.mprof-pane-modal-body,
.legal-detail-modal-body,
.spec-svc-body,
.msng-media-modal-body{
  color:var(--text1) !important;
  line-height:1.5;
}
.cmodal-body p,
.cab-pane-modal-body p,
.mprof-pane-modal-body p,
.legal-detail-modal-body p{
  color:var(--text2) !important;
}

/* Messages and orders: keep list cards readable but compact. */
.msng-page-sections,
#mo-list,
.masters-grid,
.parts-grid-v2,
.home-catalog__grid{
  align-items:start;
}
.msng-item-preview,
.mo-card-sub,
.master-card__meta,
.parts-category-card p,
.hcat-card small{
  color:var(--text2) !important;
  line-height:1.42;
}

/* Phone: no tables, no heavy split panes, larger readable text. */
@media (max-width: 767px){
  :root{
    --ui-section-gap: 12px;
    --ui-section-pad: 14px;
    --ui-icon-box: 40px;
    --ui-control-h: 42px;
    --ui-control-h-sm: 36px;
  }
  .spa-content > .container,
  .masters-content > .container,
  .container.msng-page-content,
  .parts-page .container,
  .cabinet-page .container,
  .legal-page .container,
  .admin-page .container,
  .myorders-page .container{gap:12px;}
  .page-title-row,
  .section-title-row,
  .card-head,
  .mo-head,
  .msng-section-head,
  .parts-section-head,
  .admin-section-head,
  .cab-section-head,
  .mprof-section-head{
    flex-direction:column;
    gap:8px;
  }
  .msng-item.msng-item--v2,
  .master-card,
  .mo-card.card,
  .parts-category-card,
  .hcat-card,
  .legal-info-card,
  .legal-rich-stat,
  .cab-tab,
  .mprof-tab,
  .master-contact-row.reveal.in{
    padding:14px !important;
    transform:none!important;
  }
  .msng-item.msng-item--v2:hover,
  .master-card:hover,
  .mo-card.card:hover,
  .parts-category-card:hover,
  .hcat-card:hover,
  .legal-info-card:hover,
  .legal-rich-stat:hover,
  .cab-tab:hover,
  .mprof-tab:hover{transform:none!important;}
  .nav-link-ico,
  .spa-hero-ico,
  .legal-rich-stat > i,
  .legal-info-card > i,
  .cab-tab-ico,
  .mprof-tab-ico,
  .hcat-card .hcat-ico,
  .spec-svc-ico,
  .parts-category-card .parts-category-ico,
  .msng-empty-ico,
  .empty-state__icon{
    width:40px;
    height:40px;
    min-width:40px;
    font-size:20px;
  }
  .desktop-table,
  .ui-table,
  .admin-table,
  .data-table{display:none!important;}
  .ui-data-card{display:block!important;}
}

/* Tablet: two-column cards where useful; still no heavy admin tables by default. */
@media (min-width: 768px) and (max-width: 1023px){
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid,
  #mo-list,
  .msng-page-sections,
  .cab-tabs,
  .mprof-tabs{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
  .ui-table{display:none!important;}
  .ui-data-card{display:block!important;}
}

/* Desktop: use width, not huge cards. */
@media (min-width: 1024px) and (max-width: 1439px){
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid{
    grid-template-columns:repeat(3, minmax(260px, 1fr)) !important;
    max-width:var(--ui-panel-max, 1320px);
  }
  #mo-list,
  .msng-page-sections{
    max-width:var(--ui-readable, 1180px);
  }
  .desktop-only{display:initial!important;}
  .mobile-only{display:none!important;}
}

/* Wide desktop: master-detail ready, still capped and readable. */
@media (min-width: 1440px){
  .masters-grid,
  .parts-grid-v2,
  .home-catalog__grid{
    grid-template-columns:repeat(4, minmax(260px, 1fr)) !important;
    max-width:var(--ui-readable-wide, 1480px);
  }
  #mo-list,
  .msng-page-sections{
    max-width:var(--ui-readable-wide, 1480px);
  }
  .page-master-detail,
  .admin-master-detail,
  .messages-master-detail{
    display:grid;
    grid-template-columns:minmax(360px, 520px) minmax(0, 1fr);
    gap:var(--ui-section-gap);
    align-items:start;
  }
  .desktop-only{display:initial!important;}
  .mobile-only{display:none!important;}
}

/* === SOURCE: css/interface_finish.css === */
/* r247 — interface finish pass: one visual language without heavy mobile tables */
:root{
  --ui-font-main: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-text-strong: #0f172a;
  --ui-text-body: #1f2937;
  --ui-text-muted: #64748b;
  --ui-surface-clean: #ffffff;
  --ui-surface-soft: #f8fafc;
  --ui-surface-warm: #fffaf5;
  --ui-border-soft: rgba(15, 23, 42, .09);
  --ui-border-strong: rgba(15, 23, 42, .14);
  --ui-shadow-soft: 0 14px 34px rgba(15,23,42,.08);
  --ui-shadow-card: 0 10px 24px rgba(15,23,42,.07);
  --ui-shadow-active: 0 16px 38px rgba(255,107,0,.16);
  --ui-radius-card: var(--radius-card, 22px);
  --ui-radius-control: var(--radius-control, 16px);
  --ui-page-gap: clamp(14px, 1.6vw, 28px);
  --ui-card-pad: clamp(14px, 1.35vw, 22px);
  --ui-readable-max: 1480px;
  --ui-wide-max: 1720px;
}
:root[data-theme="dark"], body.dark, body.theme-dark{
  --ui-text-strong:#f8fafc;
  --ui-text-body:#e2e8f0;
  --ui-text-muted:#a8b3c7;
  --ui-surface-clean:#101827;
  --ui-surface-soft:#0f172a;
  --ui-surface-warm:#17120e;
  --ui-border-soft:rgba(226,232,240,.12);
  --ui-border-strong:rgba(226,232,240,.18);
  --ui-shadow-soft:0 16px 40px rgba(0,0,0,.34);
  --ui-shadow-card:0 12px 30px rgba(0,0,0,.30);
}
html{font-family:var(--ui-font-main);}
body{color:var(--ui-text-body);background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);} 
body.dark, body.theme-dark{background:linear-gradient(180deg,#08111f 0%,#0f172a 100%);}

/* Common page rhythm for old and new page containers. */
.page-shell,
.masters-content,
.msng-full-page,
.parts-page,
.myorders-page,
.admin-page,
.cabinet-page,
.legal-page{
  color:var(--ui-text-body);
}
.container,
.page-container{
  width:min(100% - 32px, 1890px);
}
.page-content,
.masters-grid,
.parts-grid-v2,
.home-catalog__grid,
.msng-page-sections,
#mo-list,
.cab-tabs,
.mprof-tabs{
  gap:var(--ui-page-gap);
}

/* Hero blocks should feel related, not like separate sites. */
.page-hero,
.spa-hero-body,
.msng-hero,
.home-hero,
.legal-hero,
.cab-hero,
.parts-hero,
.admin-hero{
  color:var(--ui-text-body)!important;
  background:
    radial-gradient(circle at top left, rgba(255,107,0,.16), transparent 34%),
    linear-gradient(135deg, var(--ui-surface-clean), var(--ui-surface-soft))!important;
  border:1px solid var(--ui-border-soft)!important;
  border-radius:var(--ui-radius-card)!important;
  box-shadow:var(--ui-shadow-soft)!important;
}
.page-hero h1,.page-hero h2,
.spa-hero-body h1,.spa-hero-body h2,
.msng-hero h1,.home-hero h1,.legal-hero h1,
.cab-hero h1,.parts-hero h1,.admin-hero h1{
  color:var(--ui-text-strong)!important;
  letter-spacing:-.03em;
  line-height:1.05;
}
.page-hero p,.spa-hero-body p,.msng-hero p,.home-hero p,.legal-hero p,
.cab-hero p,.parts-hero p,.admin-hero p{
  color:var(--ui-text-muted)!important;
  line-height:1.55;
}
.spa-hero-ico,.page-hero__icon,.nav-link-ico{
  background:linear-gradient(135deg, rgba(255,107,0,.16), rgba(255,176,94,.22));
  color:#9a3f00;
  border:1px solid rgba(255,107,0,.20);
}
body.dark .spa-hero-ico, body.theme-dark .spa-hero-ico,
body.dark .page-hero__icon, body.theme-dark .page-hero__icon,
body.dark .nav-link-ico, body.theme-dark .nav-link-ico{color:#ffd7ad;background:rgba(255,107,0,.18);}

/* Shared surface cards: readable, crisp, consistent. */
.surface-card,
.card,
.mo-card.card,
.msng-item.msng-item--v2,
.master-card,
.master-contact-row.reveal.in,
.parts-category-card,
.hcat-card,
.legal-info-card,
.legal-rich-stat,
.cab-tab,
.mprof-tab,
.ui-data-card,
.notifs-item,
.garage-history-item,
.spec-svc-item{
  color:var(--ui-text-body)!important;
  background:linear-gradient(180deg, var(--ui-surface-clean), var(--ui-surface-soft))!important;
  border:1px solid var(--ui-border-soft)!important;
  border-radius:var(--ui-radius-card)!important;
  box-shadow:var(--ui-shadow-card)!important;
}
.surface-card:hover,
.mo-card.card:hover,
.msng-item.msng-item--v2:hover,
.master-card:hover,
.parts-category-card:hover,
.hcat-card:hover,
.legal-info-card:hover,
.legal-rich-stat:hover,
.cab-tab:hover,
.mprof-tab:hover,
.spec-svc-item:hover{
  border-color:rgba(255,107,0,.24)!important;
  box-shadow:var(--ui-shadow-active)!important;
}
.card h1,.card h2,.card h3,.card h4,
.mo-card h3,.msng-item h3,.master-card h3,.parts-category-card h3,
.hcat-card h3,.legal-info-card h3,.legal-rich-stat h3,.cab-tab-title,.mprof-tab-title{
  color:var(--ui-text-strong)!important;
}
.card p,.card small,.card .meta,.card .muted,
.mo-card .meta,.msng-item .meta,.master-card .meta,.parts-category-card .meta,
.hcat-card p,.legal-info-card p,.legal-rich-stat p,.cab-tab-desc,.mprof-tab-desc{
  color:var(--ui-text-muted)!important;
}

/* Sticky toolbars: identical behavior, device-specific scale. */
.page-sticky-tools,
.masters-sticky-tools,
.msng-sticky-tools,
.myorders-sticky-tools,
.parts-sticky-tools{
  color:var(--ui-text-body)!important;
  background:rgba(255,255,255,.88)!important;
  border:1px solid var(--ui-border-soft)!important;
  border-radius:var(--ui-radius-card)!important;
  box-shadow:0 12px 28px rgba(15,23,42,.08)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
body.dark .page-sticky-tools, body.dark .masters-sticky-tools,
body.dark .msng-sticky-tools, body.dark .myorders-sticky-tools, body.dark .parts-sticky-tools,
body.theme-dark .page-sticky-tools, body.theme-dark .masters-sticky-tools,
body.theme-dark .msng-sticky-tools, body.theme-dark .myorders-sticky-tools, body.theme-dark .parts-sticky-tools{
  background:rgba(15,23,42,.88)!important;
}
.mo-filter-tab,
.mo-search-action,
.msng-filter-action{
  min-height:38px;
  color:var(--ui-text-body)!important;
  border:1px solid var(--ui-border-soft)!important;
  background:var(--ui-surface-clean)!important;
  border-radius:var(--ui-radius-control)!important;
  font-weight:750;
}
.mo-filter-tab.active,
.mo-filter-tab.is-active,
.mo-search-action.active,
.mo-search-action[aria-expanded="true"]{
  color:#fff!important;
  background:linear-gradient(135deg, var(--orange, #ff6b00), #ff9f43)!important;
  border-color:rgba(255,107,0,.42)!important;
  box-shadow:0 10px 22px rgba(255,107,0,.22)!important;
}
.mo-filter-cnt{background:rgba(15,23,42,.08);color:var(--ui-text-strong);}
.mo-filter-tab.active .mo-filter-cnt{background:rgba(255,255,255,.22);color:#fff;}

/* Buttons and forms. */
.btn,.ui-btn,button,input[type="button"],input[type="submit"]{
  border-radius:var(--ui-radius-control);
}
.btn-primary,.ui-btn--primary,.svc-urgent-cta:not([disabled]){
  color:#fff!important;
  background:linear-gradient(135deg, var(--orange, #ff6b00), #ff9f43)!important;
  border-color:rgba(255,107,0,.48)!important;
  box-shadow:0 12px 24px rgba(255,107,0,.22)!important;
}
.btn-outline,.ui-btn--secondary{
  color:var(--ui-text-strong)!important;
  background:var(--ui-surface-clean)!important;
  border:1px solid var(--ui-border-soft)!important;
}
input,textarea,select,.pf-input,.ui-input,.ui-textarea,.ui-select{
  color:var(--ui-text-strong)!important;
  background:var(--ui-surface-clean)!important;
  border:1px solid var(--ui-border-soft)!important;
  border-radius:var(--ui-radius-control)!important;
}
input::placeholder, textarea::placeholder{color:var(--ui-text-muted)!important;opacity:.85;}

/* Tables: only ergonomic on desktop; cards remain default for touch devices. */
.ui-table,.admin-table,.data-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 8px;
  color:var(--ui-text-body);
}
.ui-table th,.admin-table th,.data-table th{
  color:var(--ui-text-muted);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  padding:0 14px 4px;
}
.ui-table td,.admin-table td,.data-table td{
  background:var(--ui-surface-clean);
  border-top:1px solid var(--ui-border-soft);
  border-bottom:1px solid var(--ui-border-soft);
  padding:14px;
}
.ui-table td:first-child,.admin-table td:first-child,.data-table td:first-child{border-left:1px solid var(--ui-border-soft);border-radius:var(--ui-radius-md,10px) 0 0 var(--ui-radius-md,10px);}
.ui-table td:last-child,.admin-table td:last-child,.data-table td:last-child{border-right:1px solid var(--ui-border-soft);border-radius:0 var(--ui-radius-md,10px) var(--ui-radius-md,10px) 0;}

/* Modal unification. */
.ui-modal-overlay,.cmodal-overlay,.cab-pane-modal-overlay,.spec-svc-overlay,.legal-detail-modal-overlay{
  background:rgba(15,23,42,.58)!important;
  backdrop-filter:blur(8px);
}
.ui-modal-card,.cmodal-card,.cmodal-box,.cab-pane-modal-card,.mprof-pane-modal-card,.legal-detail-modal-card,.spec-svc-panel{
  color:var(--ui-text-body)!important;
  background:var(--ui-surface-clean)!important;
  border:1px solid var(--ui-border-soft)!important;
  border-radius:var(--ui-radius-card)!important;
  box-shadow:0 28px 80px rgba(15,23,42,.24)!important;
}
.cmodal-head,.ui-modal-head,.cab-pane-modal-head,.mprof-pane-modal-head{
  border-bottom:1px solid var(--ui-border-soft);
}
.cmodal-body,.ui-modal-body,.cab-pane-modal-body,.mprof-pane-modal-body{color:var(--ui-text-body);}

/* Empty states and loaders. */
.empty-state,.msng-empty-cta,.msng-empty-preview,.msng-chat-empty,.notifs-empty{
  color:var(--ui-text-body)!important;
  background:linear-gradient(180deg, var(--ui-surface-clean), var(--ui-surface-soft))!important;
  border:1px dashed var(--ui-border-strong)!important;
  border-radius:var(--ui-radius-card)!important;
}
.empty-state h3,.msng-empty-cta h3,.msng-chat-empty h3{color:var(--ui-text-strong)!important;}
.empty-state p,.msng-empty-cta p,.msng-chat-empty p{color:var(--ui-text-muted)!important;}

/* Message media and bubbles should not break the layout. */
.msng-messages{color:var(--ui-text-body);}
.msng-bubble{max-width:min(680px, 86%);}
.msng-bubble.file-bubble img,.msng-bubble.file-bubble video{
  max-width:min(100%, 520px)!important;
  height:auto!important;
  border-radius:var(--ui-radius-control)!important;
  display:block;
}

/* Device versions. */
@media (max-width: 767px){
  :root{--ui-card-pad:14px;--ui-page-gap:12px;}
  .container,.page-container{width:min(100% - 20px, 100%);}
  .page-hero,.spa-hero-body,.home-hero,.legal-hero,.cab-hero,.parts-hero,.admin-hero{
    padding:16px!important;
    border-radius:var(--ui-radius-lg,18px)!important;
  }
  .page-hero h1,.spa-hero-body h1,.home-hero h1,.legal-hero h1{font-size:clamp(20px, 6vw, 24px)!important;}
  .page-hero p,.spa-hero-body p,.home-hero p,.legal-hero p{font-size:14px!important;}
  .masters-sticky-tools,.msng-sticky-tools,.myorders-sticky-tools,.parts-sticky-tools{
    padding:8px!important;
    gap:8px!important;
    border-radius:var(--ui-radius-lg,18px)!important;
  }
  .mo-filter-tab,.mo-search-action{font-size:12px!important;padding:7px 8px!important;min-height:34px;}
  .surface-card,.card,.mo-card.card,.msng-item.msng-item--v2,.master-card,.parts-category-card,.hcat-card,.cab-tab,.mprof-tab,.spec-svc-item{
    padding:14px!important;
    border-radius:var(--ui-radius-lg,18px)!important;
  }
  .ui-table,.admin-table,.data-table{display:none!important;}
  .ui-data-card{display:block!important;}
}
@media (min-width: 768px) and (max-width: 1023px){
  .container,.page-container{width:min(100% - 28px, 100%);}
  .masters-grid,.parts-grid-v2,.home-catalog__grid,#mo-list,.msng-page-sections,.cab-tabs,.mprof-tabs{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr))!important;
  }
  .ui-table,.admin-table,.data-table{display:none!important;}
  .ui-data-card{display:block!important;}
}
@media (min-width:1024px) and (max-width:1439px){
  .masters-grid,.parts-grid-v2,.home-catalog__grid{max-width:1320px;margin-inline:auto;}
  .msng-page-sections,#mo-list{max-width:1180px;margin-inline:auto;}
  .page-sticky-tools,.masters-sticky-tools,.msng-sticky-tools,.myorders-sticky-tools,.parts-sticky-tools{max-width:1180px;margin-inline:auto;}
}
@media (min-width:1440px){
  .masters-grid,.parts-grid-v2,.home-catalog__grid{max-width:1540px;margin-inline:auto;}
  .msng-page-sections,#mo-list{max-width:1480px;margin-inline:auto;}
  .page-sticky-tools,.masters-sticky-tools,.msng-sticky-tools,.myorders-sticky-tools,.parts-sticky-tools{max-width:1480px;margin-inline:auto;}
  .admin-wide-layout,.page-wide-layout{display:grid;grid-template-columns:minmax(420px, .9fr) minmax(0,1.4fr);gap:24px;align-items:start;}
}

/* r248 — stable card heights + services mobile 2-up + adaptive myorders search */
:root{
  --k-card-min-service-mobile: 86px;
  --k-card-min-service-tablet: 128px;
  --k-card-min-standard: 148px;
  --k-card-min-compact: 104px;
}

/* Equalize cards inside grids without stretching single-column mobile lists into awkward blocks. */
.home-catalog__grid,
.masters-grid,
.parts-grid-v2,
.cab-tabs,
.mprof-tabs,
.legal-rich-grid,
.legal-info-grid{
  align-items:stretch!important;
  grid-auto-rows:1fr!important;
}

.home-catalog__grid > *,
.masters-grid > *,
.parts-grid-v2 > *,
.cab-tabs > *,
.mprof-tabs > *,
.legal-rich-grid > *,
.legal-info-grid > *{
  height:100%!important;
  box-sizing:border-box!important;
}

.hcat-card.hcat-card--standard,
.master-card,
.parts-category-card,
.cab-tab,
.mprof-tab,
.legal-rich-stat,
.legal-info-card{
  min-height:var(--k-card-min-standard)!important;
}

.msng-item.msng-item--v2,
.mo-card.card,
.master-contact-row.reveal.in{
  min-height:var(--k-card-min-compact)!important;
  box-sizing:border-box!important;
}

/* Services page uses renderHome(), but body is kareta-page-services. Keep service cards 2-up on phones. */
@media (max-width:767px){
  body.kareta-page-services .home-catalog__grid,
  body.kareta-page-home .home-catalog__grid{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:10px!important;
    align-items:stretch!important;
    grid-auto-rows:1fr!important;
    padding-inline:0!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard,
  body.kareta-page-home .hcat-card.hcat-card--standard{
    min-height:var(--k-card-min-service-mobile)!important;
    height:100%!important;
    padding:11px 10px!important;
    border-radius:var(--ui-radius-card)!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-areas:"ico body"!important;
    align-items:center!important;
    gap:9px!important;
    text-align:left!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-card__top,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-card__top{
    grid-area:ico!important;
    width:auto!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-icon,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-icon{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    border-radius:var(--ui-radius-md,10px)!important;
    font-size:16px!important;
    margin:0!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-body,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-body{
    grid-area:body!important;
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    gap:3px!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-label,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-label{
    width:100%!important;
    margin:0!important;
    font-size:13px!important;
    line-height:1.16!important;
    font-weight:900!important;
    text-align:left!important;
    color:var(--ui-text-strong)!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-count,
  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-sub,
  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-price,
  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-badges,
  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-examples,
  body.kareta-page-services .hcat-card.hcat-card--standard .hcat-arrow,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-count,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-sub,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-price,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-badges,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-examples,
  body.kareta-page-home .hcat-card.hcat-card--standard .hcat-arrow{
    display:none!important;
  }

  /* On phones the applications search must be already expanded, not hidden behind the button. */
  .mo-search-action[data-search-scope="myorders"]{
    width:100%!important;
    gap:6px!important;
  }
  .mo-search-action[data-search-scope="myorders"] .mo-search-toggle{
    display:none!important;
  }
  .mo-search-action[data-search-scope="myorders"] .mo-search-panel,
  .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden]{
    display:flex!important;
    width:100%!important;
    padding:7px!important;
    border-radius:var(--ui-radius-md,10px)!important;
  }
  .mo-search-action[data-search-scope="myorders"] .mo-search-input{
    height:38px!important;
    font-size:14px!important;
  }

  /* Keep non-grid list cards readable instead of artificially tall. */
  .msng-item.msng-item--v2,
  .mo-card.card,
  .master-contact-row.reveal.in{
    min-height:auto!important;
  }
}

@media (min-width:768px) and (max-width:1023px){
  .hcat-card.hcat-card--standard,
  .master-card,
  .parts-category-card,
  .cab-tab,
  .mprof-tab{
    min-height:var(--k-card-min-service-tablet)!important;
  }
  .mo-search-action[data-search-scope="myorders"] .mo-search-toggle{display:flex!important;}
  .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden]{display:none!important;}
}

@media (min-width:1024px){
  .hcat-card.hcat-card--standard,
  .master-card,
  .parts-category-card,
  .cab-tab,
  .mprof-tab{
    min-height:156px!important;
  }
  .mo-search-action[data-search-scope="myorders"] .mo-search-toggle{display:flex!important;}
  .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden]{display:none!important;}
}

/* r249 — final card rhythm and responsive grid stabilization
   Goal: cards must not visually float by height; phone remains light, tablet/desktop get predictable blocks. */
:root{
  --k-card-h-phone: 104px;
  --k-card-h-phone-compact: 82px;
  --k-card-h-tablet: 142px;
  --k-card-h-desktop: 158px;
  --k-card-h-wide: 168px;
  --k-list-card-min: 118px;
}

/* Stable rows for real grid/card menus. List screens keep natural height unless explicitly grouped. */
.home-catalog__grid,
.masters-grid,
.parts-grid-v2,
.cab-tabs,
.mprof-tabs,
.car-grid,
.admin-master-grid,
.legal-rich-stats,
.legal-info-grid{
  align-items:stretch!important;
  grid-auto-rows:1fr!important;
}

.home-catalog__grid > *,
.masters-grid > *,
.parts-grid-v2 > *,
.cab-tabs > *,
.mprof-tabs > *,
.car-grid > *,
.admin-master-grid > *,
.legal-rich-stats > *,
.legal-info-grid > *{
  height:100%!important;
  min-height:0;
}

.hcat-card.hcat-card--standard,
.master-card,
.parts-category-card,
.cab-tab,
.cab-tab-card,
.mprof-tab,
.legal-rich-stat,
.legal-info-card,
.admin-master-card{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  overflow:hidden!important;
}

.hcat-card .hcat-label,
.parts-category-card__title,
.master-card__name,
.master-card__title,
.cab-tab-title,
.mprof-tab-label,
.legal-info-card h3,
.legal-rich-stat strong,
.mo-card-title,
.msng-item-title{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
}

.hcat-card .hcat-label,
.parts-category-card__title,
.cab-tab-title,
.mprof-tab-label{
  -webkit-line-clamp:2!important;
}

.master-card__name,
.master-card__title,
.legal-info-card h3,
.legal-rich-stat strong,
.mo-card-title,
.msng-item-title{
  -webkit-line-clamp:1!important;
}

.parts-category-card__desc,
.master-card__desc,
.master-card__sub,
.cab-tab-desc,
.mprof-tab-desc,
.legal-info-card p,
.mo-card-car,
.msng-item-sub{
  overflow:hidden!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
}

@media (max-width:767px){
  /* Services/home categories: exactly 2 compact cards per row on phones. */
  body.kareta-page-services .home-catalog__grid,
  body.kareta-page-home .home-catalog__grid{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0,1fr))!important;
    gap:9px!important;
    grid-auto-rows:minmax(var(--k-card-h-phone-compact), auto)!important;
  }

  body.kareta-page-services .hcat-card.hcat-card--standard,
  body.kareta-page-home .hcat-card.hcat-card--standard{
    min-height:var(--k-card-h-phone-compact)!important;
    height:100%!important;
    padding:10px!important;
  }

  /* Functional card menus: phone stays compact, not tall desktop cards. */
  .cab-tabs,
  .mprof-tabs{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0,1fr))!important;
    gap:10px!important;
  }
  .cab-tab,
  .cab-tab-card,
  .mprof-tab{
    min-height:var(--k-card-h-phone)!important;
    padding:12px!important;
  }

  .parts-grid-v2,
  .masters-grid,
  .car-grid,
  .admin-master-grid,
  .legal-info-grid{
    grid-auto-rows:auto!important;
  }
  .master-card,
  .parts-category-card,
  .legal-info-card,
  .admin-master-card{
    min-height:auto!important;
  }

  /* Orders search is a field on phone, not another tap. */
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"],
  body[data-kareta-active-page="myorders"] .mo-search-action[data-search-scope="myorders"]{
    width:100%!important;
  }
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"] .mo-search-toggle,
  body[data-kareta-active-page="myorders"] .mo-search-action[data-search-scope="myorders"] .mo-search-toggle{
    display:none!important;
  }
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"] .mo-search-panel,
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden],
  body[data-kareta-active-page="myorders"] .mo-search-action[data-search-scope="myorders"] .mo-search-panel,
  body[data-kareta-active-page="myorders"] .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden]{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
  }
}

@media (min-width:768px) and (max-width:1023px){
  .home-catalog__grid,
  .parts-grid-v2,
  .masters-grid{
    grid-auto-rows:minmax(var(--k-card-h-tablet), auto)!important;
  }
  .hcat-card.hcat-card--standard,
  .master-card,
  .parts-category-card,
  .cab-tab,
  .cab-tab-card,
  .mprof-tab{
    min-height:var(--k-card-h-tablet)!important;
  }
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"] .mo-search-toggle{display:flex!important;}
  body.kareta-page-myorders .mo-search-action[data-search-scope="myorders"] .mo-search-panel[hidden]{display:none!important;}
}

@media (min-width:1024px) and (max-width:1439px){
  .home-catalog__grid,
  .parts-grid-v2,
  .masters-grid,
  .cab-tabs,
  .mprof-tabs{
    grid-auto-rows:minmax(var(--k-card-h-desktop), auto)!important;
  }
  .hcat-card.hcat-card--standard,
  .master-card,
  .parts-category-card,
  .cab-tab,
  .cab-tab-card,
  .mprof-tab{
    min-height:var(--k-card-h-desktop)!important;
  }
}

@media (min-width:1440px){
  .home-catalog__grid,
  .parts-grid-v2,
  .masters-grid,
  .cab-tabs,
  .mprof-tabs{
    grid-auto-rows:minmax(var(--k-card-h-wide), auto)!important;
  }
  .hcat-card.hcat-card--standard,
  .master-card,
  .parts-category-card,
  .cab-tab,
  .cab-tab-card,
  .mprof-tab{
    min-height:var(--k-card-h-wide)!important;
  }
}

/* Lists: uniform rhythm without forcing every order/chat to the same large height. */
#mo-list,
.msng-page-sections{
  align-items:stretch!important;
}
.mo-card.card,
.msng-item.msng-item--v2,
.master-contact-row.reveal.in{
  box-sizing:border-box!important;
  width:100%!important;
}
@media (min-width:1024px){
  .mo-card.card,
  .msng-item.msng-item--v2,
  .master-contact-row.reveal.in{
    min-height:var(--k-list-card-min)!important;
  }
}

/* r263: expanded client primary navigation */
@media (max-width: 900px){
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"]{
    overflow-x:auto;
    overflow-y:hidden;
    justify-content:flex-start;
    gap:4px;
    padding:0 8px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"]::-webkit-scrollbar{display:none;}
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"] .bnav-item{
    flex:0 0 clamp(54px, 14.25vw, 72px);
    min-width:54px;
    max-width:72px;
    margin:4px 0;
    padding:5px 3px;
    scroll-snap-align:center;
  }
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"] .bnav-icon-wrap{width:34px;height:26px;}
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"] .bnav-icon{font-size:17px;}
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"] .bnav-label{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:9px;
    line-height:1.05;
  }
}
@media (min-width: 901px){
  .nav-links .nav-link--primary{
    min-width:0;
  }
  .nav-links .nav-link--primary .nav-link-label{
    white-space:nowrap;
  }
}

/* === SOURCE: css/unified_tools.css === */
/* r251 — unified filter + search tools
   One visual system for #masters, #messages, #myorders, #parts and admin shop.
   Data and business logic remain page-specific; surface, spacing, button and search behavior are unified here. */
:root{
  --tools-top-offset: calc(var(--topbar-h, 72px) + 8px);
  --tools-max-w: min(100%, 1180px);
  --tools-bg: color-mix(in srgb, var(--surface-bg, #fff) 94%, var(--accent, #ff7a18) 6%);
  --tools-border: 1px solid color-mix(in srgb, var(--surface-border, rgba(15,23,42,.12)) 82%, var(--accent, #ff7a18) 18%);
  --tools-shadow: 0 14px 32px rgba(15,23,42,.08);
  --tools-radius: var(--ui-radius-card);
  --tools-pad-y: 10px;
  --tools-pad-x: 12px;
  --tools-gap: 10px;
  --tools-control-h: 42px;
  --tools-font: 13px;
}

/* Sticky wrapper: all route-specific wrappers become the same component. */
.page-sticky-tools,
.masters-sticky-tools,
.msng-sticky-tools,
.myorders-sticky-tools,
.parts-sticky-tools,
.admin-shop-tools,
#masters-sticky-tools,
#msng-sticky-tools,
#myorders-sticky-tools,
#parts-sticky-tools{
  position: sticky !important;
  top: var(--tools-top-offset) !important;
  z-index: 30 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: var(--tools-gap) !important;
  width: var(--tools-max-w) !important;
  max-width: var(--tools-max-w) !important;
  margin: 0 auto 16px !important;
  padding: var(--tools-pad-y) var(--tools-pad-x) !important;
  background: var(--tools-bg) !important;
  border: var(--tools-border) !important;
  border-radius: var(--tools-radius) !important;
  box-shadow: var(--tools-shadow) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  color: var(--text-main, #111827) !important;
  overflow: visible !important;
}

/* Filter wrapper reset. */
.page-sticky-tools .mo-filter-bar,
.masters-sticky-tools .mo-filter-bar,
.msng-sticky-tools .mo-filter-bar,
.myorders-sticky-tools .mo-filter-bar,
.parts-sticky-tools .mo-filter-bar,
.admin-shop-tools .mo-filter-bar,
#masters-sticky-tools .mo-filter-bar,
#msng-sticky-tools .mo-filter-bar,
#myorders-sticky-tools .mo-filter-bar,
#parts-sticky-tools .mo-filter-bar{
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.page-sticky-tools .mo-filter-tabs,
.masters-sticky-tools .mo-filter-tabs,
.msng-sticky-tools .mo-filter-tabs,
.myorders-sticky-tools .mo-filter-tabs,
.parts-sticky-tools .mo-filter-tabs,
.admin-shop-tools .mo-filter-tabs,
#masters-sticky-tools .mo-filter-tabs,
#msng-sticky-tools .mo-filter-tabs,
#myorders-sticky-tools .mo-filter-tabs,
#parts-sticky-tools .mo-filter-tabs{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 0 !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}
.page-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
.masters-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
.msng-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
.myorders-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
.parts-sticky-tools .mo-filter-tabs::-webkit-scrollbar,
.admin-shop-tools .mo-filter-tabs::-webkit-scrollbar{display:none!important;}

.page-sticky-tools .mo-filter-tab,
.masters-sticky-tools .mo-filter-tab,
.msng-sticky-tools .mo-filter-tab,
.myorders-sticky-tools .mo-filter-tab,
.parts-sticky-tools .mo-filter-tab,
.admin-shop-tools .mo-filter-tab,
#masters-sticky-tools .mo-filter-tab,
#msng-sticky-tools .mo-filter-tab,
#myorders-sticky-tools .mo-filter-tab,
#parts-sticky-tools .mo-filter-tab{
  flex: 0 0 auto !important;
  min-width: 0 !important;
  height: var(--tools-control-h) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 12px !important;
  border-radius: var(--ui-radius-sm) !important;
  border: 1px solid color-mix(in srgb, var(--surface-border, rgba(15,23,42,.12)) 76%, transparent) !important;
  background: color-mix(in srgb, var(--surface-bg, #fff) 90%, transparent) !important;
  color: var(--text-main, #111827) !important;
  font-size: var(--tools-font) !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  box-shadow: 0 5px 14px rgba(15,23,42,.045) !important;
  cursor: pointer !important;
  scroll-snap-align: start !important;
}
.page-sticky-tools .mo-filter-tab:hover,
.masters-sticky-tools .mo-filter-tab:hover,
.msng-sticky-tools .mo-filter-tab:hover,
.myorders-sticky-tools .mo-filter-tab:hover,
.parts-sticky-tools .mo-filter-tab:hover,
.admin-shop-tools .mo-filter-tab:hover{
  border-color: color-mix(in srgb, var(--accent, #ff7a18) 42%, var(--surface-border, rgba(15,23,42,.12))) !important;
  transform: translateY(-1px) !important;
}
.page-sticky-tools .mo-filter-tab.active,
.page-sticky-tools .mo-filter-tab[aria-pressed="true"],
.masters-sticky-tools .mo-filter-tab.active,
.masters-sticky-tools .mo-filter-tab[aria-pressed="true"],
.msng-sticky-tools .mo-filter-tab.active,
.msng-sticky-tools .mo-filter-tab[aria-pressed="true"],
.myorders-sticky-tools .mo-filter-tab.active,
.myorders-sticky-tools .mo-filter-tab[aria-pressed="true"],
.parts-sticky-tools .mo-filter-tab.active,
.parts-sticky-tools .mo-filter-tab[aria-pressed="true"],
.admin-shop-tools .mo-filter-tab.active,
.admin-shop-tools .mo-filter-tab[aria-pressed="true"]{
  background: linear-gradient(135deg, var(--accent, #ff7a18), color-mix(in srgb, var(--accent, #ff7a18) 72%, #111827 28%)) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--accent, #ff7a18) 28%, transparent) !important;
}
.page-sticky-tools .mo-filter-tab-ico,
.page-sticky-tools .mo-filter-ico,
.masters-sticky-tools .mo-filter-tab-ico,
.masters-sticky-tools .mo-filter-ico,
.msng-sticky-tools .mo-filter-tab-ico,
.msng-sticky-tools .mo-filter-ico,
.myorders-sticky-tools .mo-filter-tab-ico,
.myorders-sticky-tools .mo-filter-ico,
.parts-sticky-tools .mo-filter-tab-ico,
.parts-sticky-tools .mo-filter-ico,
.admin-shop-tools .mo-filter-tab-ico,
.admin-shop-tools .mo-filter-ico{font-size:14px!important;line-height:1!important;}

.page-sticky-tools .mo-filter-cnt,
.masters-sticky-tools .mo-filter-cnt,
.msng-sticky-tools .mo-filter-cnt,
.myorders-sticky-tools .mo-filter-cnt,
.parts-sticky-tools .mo-filter-cnt,
.admin-shop-tools .mo-filter-cnt{
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--text-main, #111827) 8%, transparent) !important;
  color: inherit !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}
.page-sticky-tools .mo-filter-tab.active .mo-filter-cnt,
.masters-sticky-tools .mo-filter-tab.active .mo-filter-cnt,
.msng-sticky-tools .mo-filter-tab.active .mo-filter-cnt,
.myorders-sticky-tools .mo-filter-tab.active .mo-filter-cnt,
.parts-sticky-tools .mo-filter-tab.active .mo-filter-cnt,
.admin-shop-tools .mo-filter-tab.active .mo-filter-cnt{background:rgba(255,255,255,.22)!important;color:#fff!important;}

/* Search: one visual component everywhere. */
.page-sticky-tools .mo-search-action,
.masters-sticky-tools .mo-search-action,
.msng-sticky-tools .mo-search-action,
.myorders-sticky-tools .mo-search-action,
.parts-sticky-tools .mo-search-action,
.admin-shop-tools .mo-search-action,
#masters-sticky-tools .mo-search-action,
#msng-sticky-tools .mo-search-action,
#myorders-sticky-tools .mo-search-action,
#parts-sticky-tools .mo-search-action{
  position: relative !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.page-sticky-tools .mo-search-toggle,
.page-sticky-tools .mo-search-btn,
.masters-sticky-tools .mo-search-toggle,
.masters-sticky-tools .mo-search-btn,
.msng-sticky-tools .mo-search-toggle,
.msng-sticky-tools .mo-search-btn,
.myorders-sticky-tools .mo-search-toggle,
.myorders-sticky-tools .mo-search-btn,
.parts-sticky-tools .mo-search-toggle,
.parts-sticky-tools .mo-search-btn,
.admin-shop-tools .mo-search-toggle,
.admin-shop-tools .mo-search-btn{
  height: var(--tools-control-h) !important;
  min-width: 142px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: var(--ui-radius-sm) !important;
  background: linear-gradient(135deg, var(--accent, #ff7a18), color-mix(in srgb, var(--accent, #ff7a18) 68%, #111827 32%)) !important;
  color: #fff !important;
  font-size: var(--tools-font) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--accent, #ff7a18) 24%, transparent) !important;
  cursor: pointer !important;
}
.page-sticky-tools .mo-search-toggle b,
.masters-sticky-tools .mo-search-toggle b,
.msng-sticky-tools .mo-search-toggle b,
.myorders-sticky-tools .mo-search-toggle b,
.parts-sticky-tools .mo-search-toggle b{font:inherit!important;color:inherit!important;}

.page-sticky-tools .mo-search-panel,
.masters-sticky-tools .mo-search-panel,
.msng-sticky-tools .mo-search-panel,
.myorders-sticky-tools .mo-search-panel,
.parts-sticky-tools .mo-search-panel,
.admin-shop-tools .mo-search-panel{
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  width: min(360px, calc(100vw - 32px)) !important;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px !important;
  border-radius: var(--tools-radius) !important;
  background: var(--surface-bg, #fff) !important;
  border: var(--tools-border) !important;
  box-shadow: 0 18px 40px rgba(15,23,42,.16) !important;
  z-index: 45 !important;
}
.page-sticky-tools .mo-search-panel[hidden],
.masters-sticky-tools .mo-search-panel[hidden],
.msng-sticky-tools .mo-search-panel[hidden],
.myorders-sticky-tools .mo-search-panel[hidden],
.parts-sticky-tools .mo-search-panel[hidden]{display:none!important;}
.page-sticky-tools .mo-search-input,
.masters-sticky-tools .mo-search-input,
.msng-sticky-tools .mo-search-input,
.myorders-sticky-tools .mo-search-input,
.parts-sticky-tools .mo-search-input,
.admin-shop-tools .mo-search-input{
  width: 100% !important;
  height: 40px !important;
  min-width: 0 !important;
  border-radius: var(--ui-radius-md) !important;
  border: 1px solid var(--surface-border, rgba(15,23,42,.12)) !important;
  background: var(--page-bg, #f8fafc) !important;
  color: var(--text-main, #111827) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 0 12px !important;
  outline: none !important;
}
.page-sticky-tools .mo-search-input::placeholder,
.masters-sticky-tools .mo-search-input::placeholder,
.msng-sticky-tools .mo-search-input::placeholder,
.myorders-sticky-tools .mo-search-input::placeholder,
.parts-sticky-tools .mo-search-input::placeholder,
.admin-shop-tools .mo-search-input::placeholder{color:var(--text-muted,#64748b)!important;font-weight:650!important;}
.page-sticky-tools .mo-search-clear,
.masters-sticky-tools .mo-search-clear,
.msng-sticky-tools .mo-search-clear,
.myorders-sticky-tools .mo-search-clear,
.parts-sticky-tools .mo-search-clear{
  width: 40px !important;
  height: 40px !important;
  border: 0 !important;
  border-radius: var(--ui-radius-md) !important;
  background: color-mix(in srgb, var(--text-main,#111827) 8%, transparent) !important;
  color: var(--text-main,#111827) !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

/* Phone: the tools stay compact. Orders search is already open; other pages keep the search button. */
@media (max-width: 767px){
  :root{
    --tools-top-offset: calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 4px);
    --tools-control-h: 36px;
    --tools-font: 12px;
    --tools-pad-y: 8px;
    --tools-pad-x: 8px;
    --tools-gap: 8px;
  }
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools,
  .admin-shop-tools,
  #masters-sticky-tools,
  #msng-sticky-tools,
  #myorders-sticky-tools,
  #parts-sticky-tools{
    grid-template-columns: 1fr auto !important;
    width: calc(100% - 12px) !important;
    max-width: calc(100% - 12px) !important;
    margin-bottom: 10px !important;
    border-radius: var(--ui-radius-lg,18px) !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.07) !important;
  }
  .masters-sticky-tools .mo-filter-tab,
  .msng-sticky-tools .mo-filter-tab,
  .myorders-sticky-tools .mo-filter-tab,
  .parts-sticky-tools .mo-filter-tab,
  .admin-shop-tools .mo-filter-tab,
  #masters-sticky-tools .mo-filter-tab,
  #msng-sticky-tools .mo-filter-tab,
  #myorders-sticky-tools .mo-filter-tab,
  #parts-sticky-tools .mo-filter-tab{
    padding: 0 9px !important;
    gap: 5px !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }
  .masters-sticky-tools .mo-filter-tab-ico,
  .masters-sticky-tools .mo-filter-ico,
  .msng-sticky-tools .mo-filter-tab-ico,
  .msng-sticky-tools .mo-filter-ico,
  .myorders-sticky-tools .mo-filter-tab-ico,
  .myorders-sticky-tools .mo-filter-ico,
  .parts-sticky-tools .mo-filter-tab-ico,
  .parts-sticky-tools .mo-filter-ico{display:none!important;}
  .masters-sticky-tools .mo-filter-cnt,
  .msng-sticky-tools .mo-filter-cnt,
  .myorders-sticky-tools .mo-filter-cnt,
  .parts-sticky-tools .mo-filter-cnt{min-width:18px!important;height:18px!important;font-size:10px!important;padding:0 5px!important;}
  .masters-sticky-tools .mo-search-toggle,
  .msng-sticky-tools .mo-search-toggle,
  .parts-sticky-tools .mo-search-toggle,
  .admin-shop-tools .mo-search-btn{
    min-width: 40px !important;
    width: 40px !important;
    padding: 0 !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }
  .masters-sticky-tools .mo-search-toggle b,
  .msng-sticky-tools .mo-search-toggle b,
  .parts-sticky-tools .mo-search-toggle b{display:none!important;}
  .masters-sticky-tools .mo-search-panel,
  .msng-sticky-tools .mo-search-panel,
  .parts-sticky-tools .mo-search-panel,
  .admin-shop-tools .mo-search-panel{
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    top: calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 58px) !important;
    width: auto !important;
    border-radius: var(--ui-radius-lg,18px) !important;
  }

  /* My orders: on phones the search field is visible immediately, no extra tap. */
  .myorders-sticky-tools,
  #myorders-sticky-tools{grid-template-columns: 1fr !important;}
  .myorders-sticky-tools .mo-search-action,
  #myorders-sticky-tools .mo-search-action{width:100%!important;}
  .myorders-sticky-tools .mo-search-toggle,
  #myorders-sticky-tools .mo-search-toggle{display:none!important;}
  .myorders-sticky-tools .mo-search-panel,
  #myorders-sticky-tools .mo-search-panel{
    position: static !important;
    display: grid !important;
    width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  .myorders-sticky-tools .mo-search-panel[hidden],
  #myorders-sticky-tools .mo-search-panel[hidden]{display:grid!important;}
  .myorders-sticky-tools .mo-search-input,
  #myorders-sticky-tools .mo-search-input{height:38px!important;background:var(--surface-bg,#fff)!important;}
}

@media (min-width:768px) and (max-width:1023px){
  :root{--tools-max-w:min(100%, 920px);--tools-control-h:40px;--tools-font:13px;}
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{grid-template-columns:minmax(0,1fr) auto!important;}
}

@media (min-width:1024px){
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools,
  .admin-shop-tools{grid-template-columns:minmax(0,1fr) auto!important;}
  .masters-sticky-tools .mo-filter-tabs,
  .msng-sticky-tools .mo-filter-tabs,
  .myorders-sticky-tools .mo-filter-tabs,
  .parts-sticky-tools .mo-filter-tabs{flex-wrap:nowrap!important;}
}
@media (min-width:1440px){:root{--tools-max-w:1240px;--tools-control-h:44px;--tools-font:13.5px;}}

/* r252: interaction hardening for unified search controls */
.page-sticky-tools .mo-search-action.open .mo-search-toggle,
.masters-sticky-tools .mo-search-action.open .mo-search-toggle,
.msng-sticky-tools .mo-search-action.open .mo-search-toggle,
.myorders-sticky-tools .mo-search-action.open .mo-search-toggle,
.parts-sticky-tools .mo-search-action.open .mo-search-toggle,
.admin-shop-tools .mo-search-action.open .mo-search-toggle,
.page-sticky-tools .mo-search-toggle[aria-expanded="true"],
.masters-sticky-tools .mo-search-toggle[aria-expanded="true"],
.msng-sticky-tools .mo-search-toggle[aria-expanded="true"],
.myorders-sticky-tools .mo-search-toggle[aria-expanded="true"],
.parts-sticky-tools .mo-search-toggle[aria-expanded="true"],
.admin-shop-tools .mo-search-toggle[aria-expanded="true"]{
  filter: saturate(1.08) brightness(1.02) !important;
  transform: translateY(-1px) !important;
}
.page-sticky-tools .mo-search-panel[hidden],
.masters-sticky-tools .mo-search-panel[hidden],
.msng-sticky-tools .mo-search-panel[hidden],
.myorders-sticky-tools .mo-search-panel[hidden],
.parts-sticky-tools .mo-search-panel[hidden],
.admin-shop-tools .mo-search-panel[hidden]{display:none!important;}
.page-sticky-tools .mo-search-clear,
.masters-sticky-tools .mo-search-clear,
.msng-sticky-tools .mo-search-clear,
.myorders-sticky-tools .mo-search-clear,
.parts-sticky-tools .mo-search-clear,
.admin-shop-tools .mo-search-clear{
  width: 40px !important;
  height: 40px !important;
  border: 0 !important;
  border-radius: var(--ui-radius-md) !important;
  background: color-mix(in srgb, var(--text-main,#111827) 8%, transparent) !important;
  color: var(--text-main,#111827) !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}
@media (max-width: 767px){
  .admin-shop-tools .mo-search-panel[hidden]{display:none!important;}
  .admin-shop-tools .mo-search-action.open .mo-search-panel{
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    top: calc(var(--topbar-h, 56px) + env(safe-area-inset-top, 0px) + 58px) !important;
    width: auto !important;
  }
}

/* r253/r285 — tools sheet styles kept; old mo-mobile-tools-row template removed. */
.mo-tools-sheet{align-items:center!important;justify-content:center!important;padding:16px!important;z-index:9999!important;}
.mo-tools-sheet-card{width:min(560px,calc(100vw - 24px));max-height:min(82vh,720px);display:flex;flex-direction:column;overflow:hidden;background:var(--surface-bg,#fff);color:var(--text,#111827);border:var(--surface-border,1px solid rgba(15,23,42,.12));border-radius:var(--radius-modal,18px);box-shadow:var(--shadow-modal,0 24px 70px rgba(15,23,42,.28));}
.mo-tools-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:var(--surface-border,1px solid rgba(15,23,42,.10));background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));}
.mo-tools-sheet-head b{display:block;font-size:18px;line-height:1.15;color:var(--text,#111827);}
.mo-tools-sheet-head span{display:block;margin-top:4px;font-size:13px;color:var(--text2,#64748b);}
.mo-tools-sheet-body{overflow:auto;padding:14px;min-height:0;-webkit-overflow-scrolling:touch;}
.mo-tools-filter-list,.mo-tools-sort-list{display:grid;gap:10px;}
.mo-tools-filter-btn,.mo-tools-sort-btn{width:100%;border:var(--surface-border,1px solid rgba(15,23,42,.12));background:var(--surface-elevated,#fff);color:var(--text,#111827);border-radius:var(--radius-card,18px);padding:13px 14px;display:grid;grid-template-columns:38px 1fr;align-items:center;text-align:left;gap:10px;box-shadow:var(--shadow-soft,0 10px 26px rgba(15,23,42,.08));cursor:pointer;}
.mo-tools-filter-btn>span,.mo-tools-sort-btn>span{width:38px;height:38px;border-radius:var(--ui-radius-md,10px);display:grid;place-items:center;background:color-mix(in srgb,var(--accent,#f97316) 12%,transparent);color:var(--accent,#f97316);font-weight:800;}
.mo-tools-filter-btn>b,.mo-tools-sort-btn>b{font-size:15px;line-height:1.2;color:var(--text,#111827);}
.mo-tools-sort-btn small{grid-column:2;display:block;margin-top:-4px;color:var(--text2,#64748b);font-size:12px;line-height:1.25;}
.mo-tools-filter-btn.active{border-color:color-mix(in srgb,var(--accent,#f97316) 52%,transparent);background:color-mix(in srgb,var(--accent,#f97316) 10%,var(--surface-bg,#fff));}
.mo-tools-filter-btn.active>span{background:var(--accent,#f97316);color:#fff;}

@media (max-width:767px){
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools,
  .admin-shop-tools{
    gap:8px!important;
    padding:10px!important;
  }
  .masters-sticky-tools .mo-filter-bar,
  .msng-sticky-tools .mo-filter-bar,
  .myorders-sticky-tools .mo-filter-bar,
  .parts-sticky-tools .mo-filter-bar,
  .admin-shop-tools .mo-filter-bar{
    display:none!important;
  }
  .masters-sticky-tools .mo-search-action,
  .msng-sticky-tools .mo-search-action,
  .myorders-sticky-tools .mo-search-action,
  .parts-sticky-tools .mo-search-action,
  .admin-shop-tools .mo-search-action{
    width:100%!important;
    margin:0!important;
    order:-9;
  }
  .masters-sticky-tools .mo-search-toggle,
  .msng-sticky-tools .mo-search-toggle,
  .myorders-sticky-tools .mo-search-toggle,
  .parts-sticky-tools .mo-search-toggle,
  .admin-shop-tools .mo-search-toggle{
    display:none!important;
  }
  .masters-sticky-tools .mo-search-panel,
  .msng-sticky-tools .mo-search-panel,
  .myorders-sticky-tools .mo-search-panel,
  .parts-sticky-tools .mo-search-panel,
  .admin-shop-tools .mo-search-panel{
    width:100%!important;
    display:flex!important;
    position:relative!important;
    inset:auto!important;
    opacity:1!important;
    transform:none!important;
    visibility:visible!important;
    pointer-events:auto!important;
    padding:8px!important;
    border-radius:var(--radius-card,10px)!important;
    background:var(--surface-bg,#fff)!important;
    border:var(--surface-border,1px solid rgba(15,23,42,.12))!important;
    box-shadow:none!important;
  }
  .masters-sticky-tools .mo-search-panel[hidden],
  .msng-sticky-tools .mo-search-panel[hidden],
  .myorders-sticky-tools .mo-search-panel[hidden],
  .parts-sticky-tools .mo-search-panel[hidden],
  .admin-shop-tools .mo-search-panel[hidden]{
    display:flex!important;
  }
  .masters-sticky-tools .mo-search-input,
  .msng-sticky-tools .mo-search-input,
  .myorders-sticky-tools .mo-search-input,
  .parts-sticky-tools .mo-search-input,
  .admin-shop-tools .mo-search-input{
    min-height:40px!important;
    font-size:15px!important;
    border-radius:var(--ui-radius-md,10px)!important;
  }
  .mo-tools-sheet{align-items:flex-end!important;padding:0!important;}
  .mo-tools-sheet-card{width:100%;max-height:82vh;border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0;border-left:0;border-right:0;border-bottom:0;}
  .mo-tools-sheet-head{padding:15px 16px;}
  .mo-tools-sheet-body{padding:12px 12px calc(16px + env(safe-area-inset-bottom));}
}

@media (min-width:768px){
  .masters-sticky-tools .mo-filter-bar,
  .msng-sticky-tools .mo-filter-bar,
  .myorders-sticky-tools .mo-filter-bar,
  .parts-sticky-tools .mo-filter-bar,
  .admin-shop-tools .mo-filter-bar{display:block;}
}

/* r254 — mobile home hero CTA centering
   На телефонах CTA-блок в домашнем hero не должен смещаться влево/вправо. */
@media (max-width: 767px) {
  .home-hero-cta-row {
    width: 100% !important;
    max-width: min(100%, 420px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
  }

  .home-hero-cta-row > * {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (max-width: 480px) {
  .home-hero-cta-row {
    flex-direction: column !important;
    padding-left: max(0px, env(safe-area-inset-left)) !important;
    padding-right: max(0px, env(safe-area-inset-right)) !important;
  }

  .home-hero-cta-row .home-hero-main-cta,
  .home-hero-cta-row .btn,
  .home-hero-cta-row button,
  .home-hero-cta-row a {
    width: min(100%, 360px) !important;
    justify-content: center !important;
    text-align: center !important;
  }
}

/* r255 — monolithic catalog tools renderer/state layer
   Единая шапка фильтрации/поиска/сортировки для DB-каталогов. */
.catalog-tools{
  width:min(100%, var(--tools-max, 1180px));
  margin:0 auto 16px;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px;
  border:var(--surface-border, 1px solid rgba(15,23,42,.12));
  border-radius:var(--radius-card, 18px);
  background:var(--surface-bg, #fff);
  color:var(--text, #111827);
  box-shadow:var(--surface-shadow, 0 10px 28px rgba(15,23,42,.08));
  backdrop-filter:saturate(1.1) blur(10px);
}
.catalog-tools__filters,
.catalog-tools__search{min-width:0;}
.catalog-tools .mo-filter-bar{margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;}
.catalog-tools .mo-filter-tabs{gap:8px!important;padding:0!important;}
.catalog-tools .mo-search-action{margin:0!important;}
.catalog-tools .mo-search-toggle{white-space:nowrap;min-height:40px;}
.catalog-tools .mo-search-panel{min-width:min(420px, 42vw);}
.catalog-tools .mo-search-input{min-height:40px;}
.catalog-tools .mo-filter-tab{min-height:38px;}
.catalog-tools[data-catalog-tools] .mo-filter-tab.active,
.catalog-tools[data-catalog-tools] .mo-filter-tab.is-active{box-shadow:0 8px 20px color-mix(in srgb, var(--accent, var(--orange)) 22%, transparent);}

@media (max-width:767px){
  .catalog-tools{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    padding:8px;
    margin-bottom:10px;
    border-radius:var(--ui-radius-md,10px);
    box-shadow:0 8px 18px rgba(15,23,42,.08);
  }
  .catalog-tools .catalog-tools__filters{display:none!important;}
  .catalog-tools .catalog-tools__search{width:100%;}
  .catalog-tools .mo-search-action{width:100%!important;display:flex!important;flex-direction:column!important;gap:7px!important;}
  .catalog-tools .mo-search-toggle{display:none!important;}
  .catalog-tools .mo-search-panel,
  .catalog-tools .mo-search-panel[hidden]{display:flex!important;width:100%!important;min-width:0!important;padding:7px!important;border-radius:var(--ui-radius-md,10px)!important;}
  .catalog-tools .mo-search-input{font-size:16px!important;min-height:42px!important;}
  .catalog-tools .mo-mobile-sort-state{grid-column:1/-1;font-size:11px;color:var(--text-muted, #64748b);text-align:center;margin-top:0;}
}

@media (min-width:768px) and (max-width:1023px){
  .catalog-tools{grid-template-columns:1fr;max-width:920px;padding:10px;gap:9px;}
  .catalog-tools .mo-search-panel{min-width:0;width:100%;}
}

@media (min-width:1024px) and (max-width:1439px){
  .catalog-tools{--tools-max:1120px;}
}
@media (min-width:1440px){
  .catalog-tools{--tools-max:1280px;}
}

/* r285 — legacy catalog toolbar cleanup: unified-v2 owns mobile/tablet/desktop layout */
.catalog-tools > .mo-mobile-tools-row,
.masters-sticky-tools > .mo-mobile-tools-row,
.admin-shop-tools > .mo-mobile-tools-row{
  display:none!important;
}
.catalog-tools[data-catalog-render="unified-v2"] > .catalog-tools__actions,
.catalog-tools[data-catalog-render="unified-v2"] > .catalog-tools__inner{
  display:grid;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__route-nav,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__route-btn{
  display:none!important;
}

/* === SOURCE: css/mprof_wide_tabs.css === */
/* r256 — Master profile tabs wide screen layout
   На больших экранах mprof-tabs показываются 3 карточками в ряд.
   Телефон и планшет остаются 2 в ряд, логика модальных окон не меняется. */

@media (min-width: 1280px) {
  .mprof-tabs.mprof-tabs--icons {
    grid-template-columns: repeat(3, minmax(260px, 1fr)) !important;
    max-width: 1120px !important;
    gap: 14px !important;
    align-items: stretch !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab {
    min-height: 108px !important;
    padding: 16px 18px !important;
    border-radius: var(--ui-radius-lg, var(--radius-card, 18px)) !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab-ico {
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: var(--ui-radius-md, 10px) !important;
    font-size: 24px !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab-copy {
    gap: 6px !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab-label,
  .mprof-tabs.mprof-tabs--icons .mprof-tab.active .mprof-tab-label {
    font-size: 16px !important;
    line-height: 1.18 !important;
    letter-spacing: -.01em !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab-desc {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
    max-width: 100% !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab-count,
  .mprof-tabs.mprof-tabs--icons .mprof-tab.active .mprof-tab-count {
    top: 12px !important;
    right: 12px !important;
  }
}

@media (min-width: 1600px) {
  .mprof-tabs.mprof-tabs--icons {
    max-width: 1240px !important;
    grid-template-columns: repeat(3, minmax(300px, 1fr)) !important;
    gap: 16px !important;
  }

  .mprof-tabs.mprof-tabs--icons .mprof-tab {
    min-height: 116px !important;
    padding: 18px 20px !important;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .mprof-tabs.mprof-tabs--icons {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: 920px !important;
  }
}

@media (max-width: 767px) {
  .mprof-tabs.mprof-tabs--icons {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* === SOURCE: css/spa_hero_unified.css === */
/* r258 — unified SPA page hero structure and DB-driven headings */
.spa-page-hero[data-spa-hero]{
  padding: clamp(18px, 2.2vw, 34px) 0 clamp(14px, 2vw, 28px);
}
.spa-page-hero[data-spa-hero] .container{
  max-width: min(1890px, calc(100vw - 24px));
}
.spa-page-hero[data-spa-hero] .spa-hero-body.page-hero{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  align-items:start;
  gap: clamp(14px, 1.6vw, 22px);
  width: min(100%, 1320px);
  margin-inline:auto;
  padding: clamp(18px, 2.2vw, 30px);
  border-radius: var(--ui-radius-xl, var(--surface-radius, 18px));
  border: var(--ui-border, 1px solid rgba(15,23,42,.10));
  background: var(--surface-bg, #fff);
  color: var(--text, #111827);
  box-shadow: var(--surface-shadow, 0 18px 50px rgba(15,23,42,.08));
  position:relative;
  overflow:hidden;
}
.spa-page-hero[data-spa-hero] .spa-hero-body.page-hero::before{
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:linear-gradient(180deg, var(--accent, #ff6b00), rgba(255,107,0,.25));
  opacity:.9;
}
.spa-page-hero[data-spa-hero] .spa-hero-ico.page-hero__icon{
  width: clamp(48px, 5vw, 68px);
  height: clamp(48px, 5vw, 68px);
  border-radius: var(--ui-radius-lg, 18px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: clamp(24px, 2.2vw, 34px);
  background: color-mix(in srgb, var(--accent, #ff6b00) 12%, var(--surface-bg, #fff));
  color: var(--text, #111827);
  border: 1px solid color-mix(in srgb, var(--accent, #ff6b00) 22%, transparent);
  box-shadow: 0 10px 28px rgba(15,23,42,.08);
  position:relative;
  z-index:1;
}
.spa-page-hero[data-spa-hero] .spa-hero-main{
  min-width:0;
  position:relative;
  z-index:1;
}
.spa-page-hero[data-spa-hero] .spa-hero-label.page-hero__label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  color: var(--accent, #ff6b00);
  font-size:13px;
  line-height:1.2;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.spa-page-hero[data-spa-hero] .spa-hero-title.page-hero__title{
  margin:0;
  color:var(--text, #111827);
  font-size:clamp(24px, 2.6vw, 40px);
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.035em;
}
.spa-page-hero[data-spa-hero] .spa-hero-sub.page-hero__text{
  max-width:780px;
  margin:0 0 14px;
  color:var(--text2, #475569);
  font-size:clamp(15px, 1.15vw, 18px);
  line-height:1.58;
}
.spa-page-hero[data-spa-hero] .spa-hero-stats.page-hero__stats{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:10px;
  margin-top:14px;
}
.spa-page-hero[data-spa-hero] .spa-hero-stat{
  min-width:108px;
  padding:10px 12px;
  border-radius:var(--ui-radius-md, 10px);
  border:1px solid var(--surface-border, rgba(15,23,42,.10));
  background:var(--surface-soft, rgba(248,250,252,.88));
}
.spa-page-hero[data-spa-hero] .spa-hero-stat-sep{display:none!important;}
.spa-page-hero[data-spa-hero] .spa-hero-stat-num{
  color:var(--text, #111827);
  font-size:clamp(18px, 1.5vw, 24px);
  font-weight:950;
  line-height:1.1;
}
.spa-page-hero[data-spa-hero] .spa-hero-stat-lbl{
  margin-top:3px;
  color:var(--text2, #475569);
  font-size:12px;
  font-weight:800;
}
.spa-page-hero[data-spa-hero] .page-hero__actions,
.spa-page-hero[data-spa-hero] .masters-hero__actions.spa-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.spa-page-hero[data-spa-hero] .legal-rich-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 8px;
}
.spa-page-hero[data-spa-hero] .legal-rich-chips span{
  padding:7px 10px;
  border-radius:999px;
  background:color-mix(in srgb, var(--accent, #ff6b00) 10%, var(--surface-bg, #fff));
  border:1px solid color-mix(in srgb, var(--accent, #ff6b00) 18%, transparent);
  color:var(--text, #111827);
  font-size:12px;
  font-weight:850;
}
.spa-page-hero[data-spa-hero] .legal-rich-summary{
  margin-top:14px;
  max-width:620px;
  padding:14px;
  border-radius:var(--ui-radius-lg, 18px);
}
@media (min-width: 1440px){
  .spa-page-hero[data-spa-hero] .spa-hero-body.page-hero{width:min(100%, 1480px);}
}
@media (max-width: 767px){
  .spa-page-hero[data-spa-hero]{padding:12px 0 10px;}
  .spa-page-hero[data-spa-hero] .spa-hero-body.page-hero{
    grid-template-columns:1fr;
    padding:16px;
    border-radius:var(--ui-radius-lg, 18px);
  }
  .spa-page-hero[data-spa-hero] .spa-hero-body.page-hero::before{width:4px;}
  .spa-page-hero[data-spa-hero] .spa-hero-ico.page-hero__icon{width:44px;height:44px;font-size:23px;}
  .spa-page-hero[data-spa-hero] .spa-hero-title.page-hero__title{font-size:22px;line-height:1.12;}
  .spa-page-hero[data-spa-hero] .spa-hero-sub.page-hero__text{font-size:14px;line-height:1.48;}
  .spa-page-hero[data-spa-hero] .spa-hero-stats.page-hero__stats{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:8px;}
  .spa-page-hero[data-spa-hero] .spa-hero-stat{min-width:0;padding:9px 10px;}
  .spa-page-hero[data-spa-hero] .page-hero__actions .btn{width:100%;justify-content:center;}
}

/* === SOURCE: css/spa_hero_catalog_tools.css === */
/* r259 — SPA hero + catalog tools unified layout
   Цель: фильтры/поиск живут внутри spa-hero-mobile-bar/tools-card,
   а на ПК hero становится 2-колоночной карточкой: описание + инструменты. */

.spa-page-hero--with-tools {
  display: block;
}

.spa-page-hero--with-tools .spa-hero-layout {
  display: grid;
  gap: var(--space-4, 16px);
  align-items: stretch;
}

.spa-page-hero--with-tools .spa-hero-body,
.spa-page-hero--with-tools .spa-hero-tools-card {
  min-width: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
  padding: 14px;
  background: var(--surface-bg, #fff);
  border: var(--surface-border, 1px solid rgba(15, 23, 42, .10));
  border-radius: var(--ui-radius-card);
  box-shadow: var(--surface-shadow, 0 16px 36px rgba(15, 23, 42, .08));
  color: var(--text, #111827);
}

.spa-page-hero--with-tools .spa-hero-tools-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-body {
  min-width: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools,
.spa-page-hero--with-tools .spa-hero-tools-body .masters-sticky-tools {
  position: static !important;
  top: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: auto !important;
}

.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__filters,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__search {
  min-width: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-bar {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tabs {
  width: 100%;
  min-width: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action {
  width: 100%;
  margin: 0;
}

.spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel {
  width: 100%;
}

@media (min-width: 1024px) {
  .spa-page-hero--with-tools .spa-hero-layout {
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
    align-items: stretch;
  }

  .spa-page-hero--with-tools .spa-hero-body {
    height: 100%;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card {
    min-height: 100%;
    padding: 18px;
  }

  .spa-page-hero--with-tools .spa-hero-tools-head::before {
    content: 'Фильтры и поиск';
    display: block;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--text, #111827);
  }

  .spa-page-hero--with-tools .spa-hero-tools-head .spa-hero-mobile-title {
    display: none;
  }

  .spa-page-hero--with-tools .spa-hero-mobile-info {
    display: none;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1440px) {
  .spa-page-hero--with-tools .spa-hero-layout {
    grid-template-columns: minmax(0, 1.25fr) minmax(420px, .75fr);
  }
}

@media (max-width: 1023px) {
  .spa-page-hero--with-tools .spa-hero-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .spa-page-hero.spa-page-hero--with-tools {
    display: block !important;
    padding: 8px 0 4px;
  }

  .spa-page-hero--with-tools .spa-hero-bg,
  .spa-page-hero--with-tools .spa-hero-body {
    display: none !important;
  }

  .spa-page-hero--with-tools .spa-hero-layout {
    display: block;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card {
    display: flex !important;
    gap: 10px;
    padding: 10px;
    border-radius: var(--radius-md, 18px);
    box-shadow: var(--shadow-sm, 0 8px 18px rgba(15,23,42,.08));
  }

  .spa-page-hero--with-tools .spa-hero-mobile-title {
    font-size: 16px;
    line-height: 1.15;
    min-width: 0;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner {
    display: grid;
    gap: 8px;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__filters {
    display: none !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__mobile {
    display: grid !important;
    grid-template-columns: 1fr auto auto;
    gap: 8px;
    align-items: center;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action,
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action.open,
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel {
    width: 100%;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-toggle {
    display: none !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel {
    display: flex !important;
    position: static !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-input {
    min-height: 42px;
    font-size: 15px;
  }
}

/* r260 — fix desktop hero catalog tools visibility
   Причина: старый слой additions.css скрывал .spa-hero-mobile-bar на desktop.
   В r259 tools-card использует тот же класс для совместимости, поэтому desktop видел hero,
   но не видел правую карточку фильтров/поиска. */
@media (min-width: 641px) {
  .spa-page-hero--with-tools .spa-hero-mobile-bar.spa-hero-tools-card,
  .spa-page-hero--with-tools .spa-hero-tools-card {
    display: flex !important;
  }
}

@media (min-width: 1024px) {
  .spa-page-hero--with-tools .spa-hero-tools-card {
    height: 100%;
    min-width: 0;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body {
    display: block !important;
    width: 100%;
    min-width: 0;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="legacy-unified-disabled"] {
    display: block !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__filters,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__search {
    display: block !important;
    width: 100% !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-bar,
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tabs {
    display: flex !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action {
    display: flex !important;
    justify-content: stretch !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-toggle {
    display: inline-flex !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel[hidden] {
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action.open .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel:not([hidden]) {
    display: flex !important;
  }
}


/* r271 — единая адаптация шапки панели инструментов.
   Mobile: шапка скрыта. Tablet: только название. Desktop: название + совет двумя строками. */
.spa-page-hero--with-tools .spa-hero-tools-head{
  min-width:0;
}
.spa-page-hero--with-tools .spa-hero-tools-head::before{
  content:none !important;
  display:none !important;
}
.spa-page-hero--with-tools .spa-hero-tools-titlebox{
  min-width:0;
  display:grid;
  gap:4px;
}
.spa-page-hero--with-tools .spa-hero-tools-hint{
  color:var(--text2,#64748b);
  font-size:12.5px;
  line-height:1.35;
  font-weight:650;
  max-width:52ch;
}

@media (min-width:1024px){
  .spa-page-hero--with-tools .spa-hero-tools-head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:0 2px 2px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-head .spa-hero-mobile-title{
    display:block !important;
    font-size:18px !important;
    line-height:1.15 !important;
    font-weight:950 !important;
    letter-spacing:-.02em !important;
    color:var(--text,#111827) !important;
    white-space:normal !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-hint{
    display:block !important;
    min-height:18px !important;
  }
  .spa-page-hero--with-tools .spa-hero-mobile-info{
    display:none !important;
  }
}

@media (min-width:641px) and (max-width:1023px){
  .spa-page-hero--with-tools .spa-hero-tools-head{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    min-height:32px !important;
    padding:0 2px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-head .spa-hero-mobile-title{
    display:block !important;
    font-size:17px !important;
    line-height:1.18 !important;
    font-weight:950 !important;
    color:var(--text,#111827) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-hint,
  .spa-page-hero--with-tools .spa-hero-mobile-info{
    display:none !important;
  }
}

@media (max-width:640px){
  .spa-page-hero--with-tools .spa-hero-tools-head{
    display:none !important;
  }
}

/* === SOURCE: css/home_special_services_grid.css === */

/* r261: desktop/tablet special services — 3 cards in one traffic-light row */
@media (min-width: 769px){
  .home-catalog .home-specials{
    margin-top: clamp(18px, 2vw, 28px);
  }
  .home-catalog .home-specials__title{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
    color:var(--text2);
    font-size:13px;
    letter-spacing:.075em;
  }
  .home-catalog .home-specials__title::before{
    content:'⚡';
    width:34px;
    height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:var(--radius-md, 10px);
    background:color-mix(in srgb, var(--accent, #ff7a1a) 14%, var(--surface-bg, #fff));
    border:1px solid color-mix(in srgb, var(--accent, #ff7a1a) 24%, var(--surface-border, #e5e7eb));
    letter-spacing:0;
  }
  .home-catalog .home-specials__grid{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:clamp(12px, 1.2vw, 18px);
    align-items:stretch;
  }
  .home-catalog .home-special-card{
    min-height:176px;
    height:100%;
    grid-template-columns:1fr;
    align-content:start;
    gap:12px;
    padding:clamp(16px, 1.35vw, 22px);
    border-radius:var(--radius-xl, 18px);
    box-shadow:0 16px 38px rgba(15,23,42,.10);
    overflow:hidden;
    position:relative;
  }
  .home-catalog .home-special-card::after{
    content:'';
    position:absolute;
    inset:auto 18px 0 18px;
    height:3px;
    border-radius:999px 999px 0 0;
    opacity:.72;
  }
  .home-catalog .home-special-card__ico{
    width:58px;
    height:58px;
    border-radius:var(--ui-radius-lg,18px);
    font-size:29px;
    background:rgba(255,255,255,.68);
    border:1px solid rgba(255,255,255,.82);
    box-shadow:0 10px 24px rgba(15,23,42,.10);
  }
  .home-catalog .home-special-card__body{
    min-width:0;
  }
  .home-catalog .home-special-card__title{
    font-size:clamp(16px, 1.15vw, 20px);
    line-height:1.16;
    color:var(--text1);
    margin-bottom:8px;
  }
  .home-catalog .home-special-card__sub{
    min-height:42px;
    color:var(--text2);
    font-size:13px;
    line-height:1.45;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .home-catalog .home-special-card__badges{
    margin-top:12px;
    gap:7px;
  }
  .home-catalog .home-special-card__badge{
    background:rgba(255,255,255,.70);
    color:var(--text1);
    border-color:rgba(255,255,255,.76);
    box-shadow:0 4px 10px rgba(15,23,42,.06);
  }
  .home-catalog .home-special-card__cta{
    margin-top:auto;
    width:max-content;
    max-width:100%;
    padding:9px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(255,255,255,.86);
    color:var(--text1);
    box-shadow:0 8px 18px rgba(15,23,42,.08);
  }
  .home-catalog .home-special-card--danger{
    --special-main:#ef4444;
    --special-soft:#fee2e2;
    --special-soft-2:#fff7f7;
    border-color:rgba(239,68,68,.34);
    background:linear-gradient(145deg, rgba(254,226,226,.92) 0%, rgba(255,247,247,.96) 58%, var(--surface-bg, #fff) 100%);
  }
  .home-catalog .home-special-card--legal{
    --special-main:#f59e0b;
    --special-soft:#fef3c7;
    --special-soft-2:#fffbea;
    border-color:rgba(245,158,11,.38);
    background:linear-gradient(145deg, rgba(254,243,199,.94) 0%, rgba(255,251,235,.96) 58%, var(--surface-bg, #fff) 100%);
  }
  .home-catalog .home-special-card--sos{
    --special-main:#22c55e;
    --special-soft:#dcfce7;
    --special-soft-2:#f0fdf4;
    border-color:rgba(34,197,94,.35);
    background:linear-gradient(145deg, rgba(220,252,231,.94) 0%, rgba(240,253,244,.96) 58%, var(--surface-bg, #fff) 100%);
  }
  .home-catalog .home-special-card--danger::after,
  .home-catalog .home-special-card--legal::after,
  .home-catalog .home-special-card--sos::after{
    background:var(--special-main);
  }
  .home-catalog .home-special-card:hover{
    transform:translateY(-3px);
    border-color:color-mix(in srgb, var(--special-main, var(--accent)) 52%, var(--surface-border, #e5e7eb));
    box-shadow:0 22px 52px rgba(15,23,42,.14);
  }
}

@media (min-width: 769px) and (max-width: 1023px){
  .home-catalog .home-specials__grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
  }
  .home-catalog .home-special-card{
    min-height:138px;
    padding:12px;
    border-radius:var(--ui-radius-lg,18px);
    gap:8px;
  }
  .home-catalog .home-special-card__ico{
    width:42px;
    height:42px;
    border-radius:var(--ui-radius-md,10px);
    font-size:22px;
  }
  .home-catalog .home-special-card__title{
    font-size:13px;
    line-height:1.14;
  }
  .home-catalog .home-special-card__sub{
    min-height:32px;
    font-size:11px;
    line-height:1.35;
    -webkit-line-clamp:2;
  }
  .home-catalog .home-special-card__badges{
    gap:5px;
    margin-top:8px;
  }
  .home-catalog .home-special-card__badge{
    padding:4px 7px;
    font-size:10px;
  }
  .home-catalog .home-special-card__cta{
    padding:7px 9px;
    font-size:11px;
  }
}

@media (min-width: 1440px){
  .home-catalog .home-special-card{
    min-height:198px;
    grid-template-columns:auto 1fr;
  }
  .home-catalog .home-special-card__cta{
    grid-column:1 / -1;
  }
}

/* === SOURCE: css/spa_hero_tools_standard_fix.css === */
/* r262 — spa hero tools and stats standard fix
   Цель: убрать серый текст на сером фоне, не дать инструментам вылезать за карточку
   и сделать единый компактный nav-ряд для основных клиентских разделов. */

.spa-page-hero[data-spa-hero] .spa-hero-stat,
.spa-page-hero .spa-hero-stat{
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--surface-bg, #fff) 96%, var(--accent, #ff7a18) 4%),
    color-mix(in srgb, var(--surface-bg, #fff) 90%, #ffffff 10%)
  ) !important;
  border: 1px solid color-mix(in srgb, var(--accent, #ff7a18) 22%, var(--surface-border, rgba(15,23,42,.12))) !important;
  color: var(--text-main, var(--text, #111827)) !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.055) !important;
}
.spa-page-hero[data-spa-hero] .spa-hero-stat-num,
.spa-page-hero .spa-hero-stat-num{
  color: var(--text-main, var(--text, #0f172a)) !important;
  text-shadow: none !important;
}
.spa-page-hero[data-spa-hero] .spa-hero-stat-lbl,
.spa-page-hero .spa-hero-stat-lbl{
  color: var(--text-muted-strong, #475569) !important;
  opacity: 1 !important;
}
html[data-theme="dark"] .spa-page-hero[data-spa-hero] .spa-hero-stat,
body.theme-dark .spa-page-hero[data-spa-hero] .spa-hero-stat{
  background: color-mix(in srgb, var(--surface-bg, #111827) 84%, #ffffff 8%) !important;
  border-color: color-mix(in srgb, var(--accent, #ff7a18) 30%, rgba(255,255,255,.18)) !important;
}
html[data-theme="dark"] .spa-page-hero[data-spa-hero] .spa-hero-stat-num,
html[data-theme="dark"] .spa-page-hero[data-spa-hero] .spa-hero-stat-lbl,
body.theme-dark .spa-page-hero[data-spa-hero] .spa-hero-stat-num,
body.theme-dark .spa-page-hero[data-spa-hero] .spa-hero-stat-lbl{
  color: var(--text-main, #f8fafc) !important;
}

.spa-page-hero--with-tools .spa-hero-tools-card,
.spa-page-hero--with-tools .spa-hero-tools-body,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner{
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body{
  width: 100% !important;
  overflow: hidden !important;
  contain: layout paint;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="legacy-unified-disabled"]{
  overflow: hidden !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner{
  overflow: hidden !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tabs{
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding-bottom: 2px !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tab{
  max-width: 100% !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tab b,
.spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tab span:not(.mo-filter-cnt){
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action,
.spa-page-hero--with-tools .spa-hero-tools-body .mo-search-panel,
.spa-page-hero--with-tools .spa-hero-tools-body .mo-search-input{
  min-width: 0 !important;
  max-width: 100% !important;
}

@media (min-width: 1024px){
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools__inner{
    grid-template-columns: minmax(0,1fr) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tabs{
    flex-wrap: wrap !important;
    align-content: start;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tab{
    flex: 1 1 calc(50% - 8px) !important;
    white-space: nowrap !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-search-action.open .mo-search-panel{
    width: 100% !important;
  }
}
@media (min-width: 1440px){
  .spa-page-hero--with-tools .spa-hero-tools-body .mo-filter-tab{
    flex-basis: calc(33.333% - 8px) !important;
  }
}
@media (max-width: 767px){
  .spa-page-hero--with-tools .spa-hero-tools-body{contain:none;}
}

/* === SOURCE: css/catalog_tools_action_template.css === */
/* r264 — единый шаблон иконок/кнопок фильтрации и сортировки catalog-tools
   Один renderer, одна визуальная модель. Наполнение меняется по scope, структура не меняется. */
.catalog-tools[data-catalog-render="unified-v2"]{
  --tool-ico-size: 38px;
  --tool-btn-h: 42px;
  overflow: hidden;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  min-width: 0;
  min-height: var(--tool-btn-h);
  border: var(--surface-border, 1px solid rgba(15,23,42,.12));
  border-radius: var(--ui-radius-btn);
  background: var(--surface-elevated, #fff);
  color: var(--text, #111827);
  display: grid;
  grid-template-columns: var(--tool-ico-size) minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 6px 10px;
  box-shadow: var(--shadow-soft, 0 8px 20px rgba(15,23,42,.07));
  cursor: pointer;
  text-align: left;
  line-height: 1;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
  width: var(--tool-ico-size);
  height: var(--tool-ico-size);
  border-radius: var(--ui-radius-sm);
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--accent, #f97316) 12%, transparent);
  color: var(--accent, #f97316);
  font-size: 16px;
  font-weight: 900;
  flex: 0 0 auto;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text, #111827);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: -.01em;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:hover,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:focus-visible{
  border-color: color-mix(in srgb, var(--accent, #f97316) 44%, transparent);
  background: color-mix(in srgb, var(--accent, #f97316) 7%, var(--surface-elevated, #fff));
  outline: none;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--filters{
  background: color-mix(in srgb, var(--accent, #f97316) 8%, var(--surface-elevated, #fff));
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__state{
  grid-column: 1 / -1;
  min-width: 0;
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 2px 8px;
  background: color-mix(in srgb, var(--accent, #f97316) 8%, transparent);
  color: var(--text2, #475569);
  font-size: 11px;
  font-weight: 750;
  text-align: center;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
  min-width: 0;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
  min-width: 0;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters .mo-filter-tab{
  min-width: 0;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters .mo-filter-tab b,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters .mo-filter-tab span{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Единый вид модальных списков фильтров/сортировок */
.mo-tools-sheet-card{
  background: var(--surface-bg, #fff) !important;
  color: var(--text, #111827) !important;
}
.mo-tools-sheet-head{
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent, #f97316) 7%, transparent), transparent) !important;
}
.mo-tools-filter-list,
.mo-tools-sort-list{
  gap: 10px !important;
}
.mo-tools-filter-btn,
.mo-tools-sort-btn{
  min-width: 0;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  border-radius: var(--radius-card, 18px) !important;
}
.mo-tools-filter-btn > span,
.mo-tools-sort-btn > span{
  width: 42px !important;
  height: 42px !important;
  font-size: 16px !important;
}
.mo-tools-filter-btn > b,
.mo-tools-sort-btn > b,
.mo-tools-sort-btn small{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mo-tools-filter-btn > b,
.mo-tools-sort-btn > b{
  white-space: nowrap;
}
.mo-tools-sort-btn small{
  white-space: normal;
}

@media (max-width: 767px){
  .catalog-tools[data-catalog-render="unified-v2"]{
    --tool-ico-size: 36px;
    --tool-btn-h: 42px;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 8px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    order: -2;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 4px;
    padding: 7px 6px;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width: 28px;
    height: 28px;
    border-radius: var(--ui-radius-md,10px);
    font-size: 14px;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    width: 100%;
    font-size: 11.5px;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__state{
    display: flex;
    order: -1;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
    display: none !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    width: 100%;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle{
    display: none !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .mo-tools-sheet-card{
    width: 100% !important;
    max-height: 84vh !important;
    border-radius: var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
  }
}

@media (min-width: 768px){
}

@media (min-width: 768px) and (max-width: 1023px){
  .catalog-tools[data-catalog-render="unified-v2"]{
    grid-template-columns: 1fr;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px){
  .catalog-tools[data-catalog-render="unified-v2"]{
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: repeat(3, minmax(130px, 1fr));
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
  }
}

/* r265 — messages page compact tools: search field + one manage button */
.catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact{
  grid-template-columns: minmax(180px, 260px);
  justify-content: end;
}
.catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn--manage{
  background: color-mix(in srgb, var(--accent, #f97316) 9%, var(--surface-elevated, #fff));
  border-color: color-mix(in srgb, var(--accent, #f97316) 30%, transparent);
}
.mo-tools-combined{
  display: grid;
  gap: 16px;
}
.mo-tools-combined-section{
  display: grid;
  gap: 10px;
}
.mo-tools-combined-title{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 2px;
  color: var(--text, #111827);
  font-size: 14px;
  font-weight: 900;
}
.mo-tools-combined-title span{
  width: 28px;
  height: 28px;
  border-radius: var(--ui-radius-md,10px);
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--accent, #f97316) 12%, transparent);
  color: var(--accent, #f97316);
}
@media (max-width: 767px){
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions{
    grid-template-columns: 1fr;
  }
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn--manage{
    min-height: 40px;
    flex-direction: row;
    gap: 8px;
  }
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn--manage .catalog-tool-btn__ico{
    width: 30px;
    height: 30px;
  }
}
@media (min-width: 1024px){
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__inner{
    grid-template-columns: minmax(0, 1fr);
  }
}

/* r267 — spa hero tools adaptive line: search field + 3 icon controls */
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 767px){
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "search actions" !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px !important;
    overflow: hidden !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display: contents !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area: search !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area: actions !important;
    order: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, 38px) !important;
    gap: 5px !important;
    align-items: center !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    width: 38px !important;
    min-width: 38px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width: 30px !important;
    height: 30px !important;
    border-radius: var(--ui-radius-md,10px) !important;
    font-size: 14px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__state{
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-action,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle{
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel{
    min-height: 42px !important;
    padding: 4px 7px !important;
    border-radius: var(--ui-radius-md,10px) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input{
    min-height: 34px !important;
    font-size: 15.5px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-clear{
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
  }

  /* messages в hero остаётся компактным: поле поиска + одна кнопка управления */
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages{
    grid-template-columns: minmax(0, 1fr) 42px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions{
    grid-template-columns: 42px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn--manage{
    width: 42px !important;
    min-width: 42px !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px){
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "search"
      "actions" !important;
    gap: 9px !important;
    padding: 9px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display: contents !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area: search !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area: actions !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    min-height: 44px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle{
    display: none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions{
    grid-template-columns: minmax(190px, 280px) !important;
    justify-content: end !important;
  }
}

/* r268 — единый шаблон tools для всех разделов: поиск + 3 иконки, фильтры/сортировка только в модалках */
.catalog-tools[data-catalog-render="unified-v2"]{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
  display:none !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
.catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
.catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:8px !important;
  justify-content:stretch !important;
  min-width:0 !important;
  width:100% !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--manage{display:none !important;}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  min-width:0 !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__state{
  display:none !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle{
  display:none !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
  display:flex !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-action{
  width:100% !important;
  min-width:0 !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
  width:100% !important;
  min-width:0 !important;
}

@media (max-width:767px){
  .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    grid-template-areas:"search actions" !important;
    align-items:center !important;
    gap:7px !important;
    padding:7px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:contents !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area:search !important;
    width:100% !important;
    min-width:0 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area:actions !important;
    order:0 !important;
    width:auto !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:repeat(3, 38px) !important;
    gap:5px !important;
    align-items:center !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    width:38px !important;
    min-width:38px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 !important;
    display:grid !important;
    place-items:center !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width:30px !important;
    height:30px !important;
    border-radius:var(--ui-radius-md,10px) !important;
    font-size:14px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    display:none !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    min-height:42px !important;
    padding:4px 7px !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input{
    min-height:34px !important;
    font-size:15.5px !important;
  }
}

@media (min-width:768px) and (max-width:1023px){
  .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"search" "actions" !important;
    gap:9px !important;
    padding:9px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:contents !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area:search !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area:actions !important;
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:8px !important;
    justify-content:stretch !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    min-height:44px !important;
  }
}

@media (min-width:1024px){
  .catalog-tools[data-catalog-render="unified-v2"]{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) minmax(390px, 520px) !important;
    grid-template-areas:"search actions" !important;
    gap:10px !important;
    align-items:center !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:contents !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{grid-area:search !important;}
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{grid-area:actions !important;}
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    grid-template-columns:minmax(0, 1fr) minmax(360px, 500px) !important;
  }
}

/* r269 — единая панель: 1 ряд управление, 2 ряд поиск. Применяется ко всем catalog-tools и spa-hero-tools-body. */
.mo-tools-settings{
  display:grid;
  gap:10px;
}
.mo-tools-setting-btn{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  grid-template-areas:"ico title" "ico desc";
  gap:3px 10px;
  align-items:center;
  border:1px solid color-mix(in srgb, var(--accent,#f97316) 18%, var(--surface-border,rgba(15,23,42,.12)));
  border-radius:var(--ui-radius-lg,18px);
  background:var(--surface-elevated,#fff);
  color:var(--text,#111827);
  padding:10px;
  text-align:left;
  cursor:pointer;
}
.mo-tools-setting-btn span{
  grid-area:ico;
  width:44px;
  height:44px;
  border-radius:var(--ui-radius-md,10px);
  display:grid;
  place-items:center;
  background:color-mix(in srgb, var(--accent,#f97316) 12%, transparent);
  color:var(--accent,#f97316);
  font-weight:900;
}
.mo-tools-setting-btn b{grid-area:title;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:900;}
.mo-tools-setting-btn small{grid-area:desc;min-width:0;color:var(--text2,#64748b);font-size:12px;font-weight:650;}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit{
  flex:0 0 auto;
  min-height:38px;
  border:0;
  border-radius:var(--ui-radius-md,10px);
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:var(--accent,#f97316);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit span{line-height:1;}
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit b{font-size:13px;}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings{
  background:color-mix(in srgb, var(--accent,#f97316) 5%, var(--surface-elevated,#fff));
}

@media (max-width:1023px){
  .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"actions" "search" !important;
    gap:8px !important;
    padding:8px !important;
    align-items:stretch !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:contents !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area:actions !important;
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
    order:0 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:54px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    padding:7px 5px !important;
    text-align:center !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width:28px !important;
    height:28px !important;
    border-radius:var(--ui-radius-md,10px) !important;
    font-size:14px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:11.5px !important;
    line-height:1.05 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area:search !important;
    width:100% !important;
    min-width:0 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:7px !important;
    align-items:center !important;
    min-height:44px !important;
    padding:5px !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-clear{
    display:none !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit{
    min-width:44px !important;
    min-height:38px !important;
    padding:0 10px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit b{
    display:none !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input{
    min-height:36px !important;
    font-size:16px !important;
  }
}

@media (min-width:768px) and (max-width:1023px){
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    flex-direction:row !important;
    justify-content:center !important;
    min-height:48px !important;
    gap:8px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    width:auto !important;
    font-size:13px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit b{
    display:inline !important;
  }
}

@media (min-width:1024px){
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns:repeat(3,minmax(130px,1fr)) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
  }
}

.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
}
.mo-tools-sheet.cmodal-overlay.open{
  align-items:center !important;
  justify-content:center !important;
  padding:14px !important;
}
.mo-tools-sheet .mo-tools-sheet-card{
  width:min(560px,100%) !important;
  max-height:min(82vh,720px) !important;
  overflow:auto !important;
}
@media (max-width:767px){
  .mo-tools-sheet.cmodal-overlay.open{
    align-items:flex-end !important;
    padding:0 !important;
  }
  .mo-tools-sheet .mo-tools-sheet-card{
    width:100% !important;
    max-height:86vh !important;
    border-radius:var(--ui-radius-lg,18px) var(--ui-radius-lg,18px) 0 0 !important;
  }
}


/* r273 — desktop repair for spa-hero tools and final unified tools standard.
   PC: hero tools must not collapse into a broken two-column inner grid.
   Mobile/tablet rules from r269-r271 remain authoritative. */
.spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
  min-width:0 !important;
}
.spa-page-hero--with-tools .spa-hero-tools-card,
.spa-page-hero--with-tools .spa-hero-tools-body{
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

@media (min-width:1024px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    display:grid !important;
    grid-template-columns:minmax(0, 1.15fr) minmax(380px, .85fr) !important;
    gap:16px !important;
    align-items:stretch !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    padding:18px !important;
    overflow:hidden !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body{
    width:100% !important;
    overflow:hidden !important;
    contain:none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"actions" "search" !important;
    gap:10px !important;
    padding:0 !important;
    overflow:visible !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:contents !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-area:actions !important;
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:8px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    width:100% !important;
    min-width:0 !important;
    min-height:44px !important;
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) !important;
    gap:7px !important;
    align-items:center !important;
    padding:7px 9px !important;
    text-align:left !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width:34px !important;
    height:34px !important;
    border-radius:var(--ui-radius-md,10px) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    display:block !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:12.5px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area:search !important;
    width:100% !important;
    min-width:0 !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-action,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:7px !important;
    align-items:center !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input{
    min-width:0 !important;
    width:100% !important;
  }
}

@media (min-width:1440px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:minmax(0, 1.25fr) minmax(420px, .75fr) !important;
  }
}

/* r276 — fix messages/news hero tools standard.
   #messages: protect actions grid from collapsing inside spa-hero-tools-body.
   #news: same spa-hero-layout--with-tools standard as masters/parts/myorders/messages/admin-shop. */
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"],
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] *{
  box-sizing:border-box !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
  min-width:0 !important;
  max-width:100% !important;
  overflow:visible !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  min-width:0 !important;
  max-width:100% !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn{
  padding-left:7px !important;
  padding-right:7px !important;
}
@media (min-width:1024px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:minmax(0, 1.12fr) minmax(360px, .88fr) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn{
    grid-template-columns:30px minmax(0,1fr) !important;
    gap:6px !important;
    min-height:42px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn__ico{
    width:30px !important;
    height:30px !important;
    font-size:13px !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn b{
    font-size:11.5px !important;
    letter-spacing:-.02em !important;
  }
}
@media (min-width:1440px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:minmax(0, 1.2fr) minmax(400px, .8fr) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn b{
    font-size:12px !important;
  }
}
@media (max-width:1023px){
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }
}

/* r277 — flatten catalog tool buttons: one visual button layer, no nested substrate stack.
   Applies to catalog-tool-btn, catalog-tool-btn--sort, --filters, --settings and all unified-v2 scopes. */
.catalog-tools[data-catalog-render="unified-v2"]{
  --tool-btn-h: 44px;
  --tool-ico-size: 28px;
  --tool-btn-bg: var(--surface-elevated, #fff);
  --tool-btn-border: var(--surface-border, 1px solid rgba(15,23,42,.12));
  --tool-btn-shadow: 0 1px 2px rgba(15,23,42,.06);
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
  position: relative !important;
  z-index: 3 !important;
  isolation: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  position: relative !important;
  z-index: 4 !important;
  isolation: isolate !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: var(--tool-btn-h) !important;
  padding: 6px 9px !important;
  display: grid !important;
  grid-template-columns: var(--tool-ico-size) minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: center !important;
  justify-content: stretch !important;
  text-align: left !important;
  line-height: 1 !important;
  border: var(--tool-btn-border) !important;
  border-radius: var(--ui-radius-md, 10px) !important;
  background: var(--tool-btn-bg) !important;
  box-shadow: var(--tool-btn-shadow) !important;
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  overflow: hidden !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn::before,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn::after,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn::before,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn::after{
  display: none !important;
  content: none !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
  width: var(--tool-ico-size) !important;
  height: var(--tool-ico-size) !important;
  min-width: var(--tool-ico-size) !important;
  min-height: var(--tool-ico-size) !important;
  border-radius: var(--ui-radius-sm, 5px) !important;
  display: grid !important;
  place-items: center !important;
  background: color-mix(in srgb, var(--accent, #f97316) 11%, transparent) !important;
  color: var(--accent, #f97316) !important;
  font-size: 14px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  border: 0 !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
  line-height: 1.08 !important;
  letter-spacing: -.015em !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--sort,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--filters,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings{
  background: var(--tool-btn-bg) !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--filters .catalog-tool-btn__ico{
  background: color-mix(in srgb, var(--accent, #f97316) 14%, transparent) !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings .catalog-tool-btn__ico{
  background: color-mix(in srgb, var(--text, #111827) 8%, transparent) !important;
  color: var(--text, #111827) !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:hover,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:focus-visible{
  border-color: color-mix(in srgb, var(--accent, #f97316) 40%, rgba(15,23,42,.12)) !important;
  background: color-mix(in srgb, var(--accent, #f97316) 5%, var(--tool-btn-bg)) !important;
  box-shadow: 0 2px 6px rgba(15,23,42,.08) !important;
  outline: none !important;
}
.spa-page-hero--with-tools .spa-hero-tools,
.spa-page-hero--with-tools .spa-hero-tools-body,
.spa-page-hero--with-tools .catalog-tools__inner,
.spa-page-hero--with-tools .catalog-tools__search{
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

@media (max-width: 767px){
  .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    --tool-btn-h: 54px;
    --tool-ico-size: 26px;
    padding: 0 !important;
    gap: 8px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    min-height: var(--tool-btn-h) !important;
    padding: 7px 4px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    text-align: center !important;
    border-radius: var(--ui-radius-md, 10px) !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    width: 100% !important;
    font-size: 11px !important;
    line-height: 1.05 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings b{
    font-size: 10.5px !important;
    letter-spacing: -.03em !important;
  }
}
@media (min-width: 768px) and (max-width: 1023px){
  .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"]{
    --tool-btn-h: 48px;
    --tool-ico-size: 30px;
    padding: 0 !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    min-height: var(--tool-btn-h) !important;
    display: grid !important;
    grid-template-columns: var(--tool-ico-size) minmax(0, auto) !important;
    justify-content: center !important;
    text-align: left !important;
    padding: 7px 10px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    width: auto !important;
    font-size: 13px !important;
  }
}
@media (min-width: 1024px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    align-items: stretch !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    min-height: 44px !important;
  }
}


/* r280 — #myorders compact card after removing mo-card-meta */
body.kareta-page-myorders #mo-list{
  display:grid;
  gap:12px;
}
body.kareta-page-myorders #mo-list > .mo-card.card,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card{
  margin-bottom:0!important;
  overflow:hidden!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-head,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-head{
  padding:14px 16px 12px!important;
  border-bottom:1px solid var(--ui-border, var(--line))!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-top,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-top{
  margin-bottom:7px!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-title,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-title{
  margin-bottom:4px!important;
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-car,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-car{
  font-size:12px!important;
  line-height:1.35!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-timeline,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-timeline{
  padding:11px 16px 10px!important;
  border-bottom:1px solid var(--ui-border, var(--line))!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-tl-dot,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-tl-dot{
  width:26px!important;
  height:26px!important;
  font-size:12px!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-tl-line,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-tl-line{
  top:12px!important;
  left:calc(50% + 13px)!important;
  right:calc(-50% + 13px)!important;
}
body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-actions,
body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-actions{
  padding:11px 16px 12px!important;
  gap:8px!important;
}
@media (max-width:640px){
  body.kareta-page-myorders #mo-list{
    gap:10px;
  }
  body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-head,
  body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-head{
    padding:12px 13px 10px!important;
  }
  body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-top,
  body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-top{
    align-items:flex-start!important;
    gap:8px!important;
  }
  body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-top > div:last-child,
  body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-top > div:last-child{
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  body.kareta-page-myorders #mo-list > .mo-card.card .mo-timeline,
  body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-timeline{
    padding:10px 12px 9px!important;
  }
  body.kareta-page-myorders #mo-list > .mo-card.card .mo-card-actions,
  body[data-kareta-active-page="myorders"] #mo-list > .mo-card.card .mo-card-actions{
    padding:10px 12px 11px!important;
  }
}


/* r281 — flatten hero/tools layers
   One visual surface: .spa-hero-tools-card. Inner wrappers are layout-only. */
.spa-page-hero--with-tools,
.spa-page-hero--with-tools .spa-hero-layout,
.spa-page-hero--with-tools .spa-hero-layout--with-tools,
.spa-page-hero--with-tools .spa-hero-tools-card,
.spa-page-hero--with-tools .spa-hero-tools-body,
.spa-page-hero--with-tools .catalog-tools,
.spa-page-hero--with-tools .catalog-tools__inner,
.spa-page-hero--with-tools .catalog-tools__actions,
.spa-page-hero--with-tools .catalog-tools__search,
.spa-page-hero--with-tools .mo-search-action,
.spa-page-hero--with-tools .mo-search-panel{
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
}
.spa-page-hero--with-tools .spa-hero-layout,
.spa-page-hero--with-tools .spa-hero-layout--with-tools,
.spa-page-hero--with-tools .spa-hero-tools-body,
.spa-page-hero--with-tools .catalog-tools,
.spa-page-hero--with-tools .catalog-tools__inner,
.spa-page-hero--with-tools .catalog-tools__actions,
.spa-page-hero--with-tools .catalog-tools__search,
.spa-page-hero--with-tools .mo-search-action,
.spa-page-hero--with-tools .mo-search-panel{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  transform:none!important;
  overflow:visible!important;
}
.spa-page-hero--with-tools .spa-hero-layout,
.spa-page-hero--with-tools .spa-hero-layout--with-tools,
.spa-page-hero--with-tools .spa-hero-tools-body,
.spa-page-hero--with-tools .catalog-tools,
.spa-page-hero--with-tools .catalog-tools__inner,
.spa-page-hero--with-tools .catalog-tools__search,
.spa-page-hero--with-tools .mo-search-action,
.spa-page-hero--with-tools .mo-search-panel{
  padding:0!important;
  margin:0!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card{
  position:relative!important;
  z-index:1!important;
  isolation:isolate!important;
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  padding:16px!important;
  background:var(--surface-bg, #fff)!important;
  border:var(--surface-border, 1px solid rgba(15,23,42,.10))!important;
  border-radius:var(--ui-radius-card, 18px)!important;
  box-shadow:var(--surface-shadow, 0 14px 32px rgba(15,23,42,.08))!important;
  overflow:visible!important;
}
.spa-page-hero--with-tools .spa-hero-tools-head{
  position:relative!important;
  z-index:2!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.spa-page-hero--with-tools .spa-hero-tools-body{
  position:relative!important;
  z-index:2!important;
  display:block!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"]{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-areas:"actions" "search"!important;
  gap:10px!important;
  width:100%!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
  grid-area:actions!important;
  display:grid!important;
  grid-template-columns:repeat(3, minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
  position:relative!important;
  z-index:3!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
  grid-area:search!important;
  width:100%!important;
  position:relative!important;
  z-index:2!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__filters{
  display:none!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
  display:flex!important;
  align-items:stretch!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  position:static!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-toggle{
  display:none!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .mo-search-input,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-input{
  min-width:0!important;
  flex:1 1 auto!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit,
.catalog-tools[data-catalog-render="unified-v2"] .mo-search-submit{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
.spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  position:relative!important;
  z-index:4!important;
  isolation:auto!important;
  overflow:hidden!important;
  box-shadow:0 1px 2px rgba(15,23,42,.06)!important;
}
.spa-page-hero--with-tools .spa-hero-bg,
.spa-page-hero--with-tools .spa-hero-bg::before,
.spa-page-hero--with-tools .spa-hero-bg::after,
.spa-page-hero--with-tools .spa-hero-layout::before,
.spa-page-hero--with-tools .spa-hero-layout::after,
.spa-page-hero--with-tools .spa-hero-tools-card::before,
.spa-page-hero--with-tools .spa-hero-tools-card::after{
  pointer-events:none!important;
}
@media (min-width:1024px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    display:grid!important;
    grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)!important;
    gap:16px!important;
    align-items:stretch!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card{
    min-height:100%!important;
  }
}
@media (min-width:1440px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:minmax(0,1.25fr) minmax(420px,.75fr)!important;
  }
}
@media (max-width:1023px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card{
    padding:12px!important;
  }
}
@media (max-width:767px){
  .spa-page-hero--with-tools .spa-hero-tools-card{
    gap:10px!important;
    padding:10px!important;
  }
  .spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"actions" "search"!important;
    gap:8px!important;
  }
  .spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions--compact{
    grid-area:actions!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    width:100%!important;
  }
  .spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area:search!important;
  }
}


/* r282 — responsive audit lock for unified spa-hero/tools pages.
   Applies the same structure to masters / parts / myorders / messages / admin-shop / news. */
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__inner{
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-areas:"actions" "search"!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__actions{
  grid-area:actions!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__search{
  grid-area:search!important;
  width:100%!important;
  min-width:0!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__state,
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__filters,
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-toggle,
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-clear{
  display:none!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-action,
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-panel,
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-panel[hidden]{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-input{
  width:100%!important;
  min-width:0!important;
}
.spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-submit{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
@media (min-width:1024px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:minmax(0,1.2fr) minmax(380px,.8fr)!important;
    align-items:stretch!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
    padding:16px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn{
    min-height:46px!important;
    padding:9px 10px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn b{
    display:block!important;
    font-size:12.5px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-submit b{
    display:inline!important;
  }
}
@media (min-width:641px) and (max-width:1023px){
  .spa-page-hero--with-tools .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:1fr!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
    padding:12px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__inner{
    gap:9px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn{
    min-height:44px!important;
    padding:8px 9px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn b{
    display:block!important;
    font-size:12px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-submit b{
    display:inline!important;
  }
}
@media (max-width:640px){
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
    padding:10px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__inner{
    gap:8px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools__actions{
    gap:6px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn{
    min-height:42px!important;
    padding:7px 5px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn__ico{
    width:20px!important;
    height:20px!important;
    font-size:16px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tool-btn b{
    display:block!important;
    font-size:10.5px!important;
    line-height:1.05!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-submit{
    min-width:44px!important;
    padding:0 11px!important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .mo-search-submit b{
    display:none!important;
  }
}

/* r283 — unified modal shell for Sort / Filter / Page settings.
   One visual language for all catalog tools modals without changing filtering logic. */
.mo-tools-sheet.cmodal-overlay.open{
  align-items:center !important;
  justify-content:center !important;
  padding:16px !important;
  z-index:9999 !important;
  background:rgba(15,23,42,.48) !important;
}
.mo-tools-sheet .mo-tools-sheet-card{
  width:min(580px, calc(100vw - 24px)) !important;
  max-height:min(84vh, 760px) !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  background:var(--surface-bg,#fff) !important;
  color:var(--text,#111827) !important;
  border:1px solid color-mix(in srgb,var(--border,#d8dee8) 86%,transparent) !important;
  border-radius:var(--ui-radius-modal,var(--radius-max,18px)) !important;
  box-shadow:0 24px 70px rgba(15,23,42,.26) !important;
}
.mo-tools-sheet .mo-tools-sheet-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-height:68px !important;
  padding:14px 16px !important;
  border-bottom:1px solid color-mix(in srgb,var(--border,#d8dee8) 80%,transparent) !important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent,#f97316) 8%,transparent),transparent) !important;
}
.mo-tools-sheet .mo-tools-sheet-titlebox{
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) !important;
  align-items:center !important;
  gap:10px !important;
}
.mo-tools-sheet .mo-tools-sheet-icon{
  width:42px !important;
  height:42px !important;
  display:grid !important;
  place-items:center !important;
  flex:0 0 auto !important;
  border-radius:var(--ui-radius-md,var(--radius-mid,10px)) !important;
  background:color-mix(in srgb,var(--accent,#f97316) 13%,transparent) !important;
  color:var(--accent,#f97316) !important;
  font-size:18px !important;
  font-weight:900 !important;
}
.mo-tools-sheet .mo-tools-sheet-head b{
  display:block !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:var(--text,#111827) !important;
  font-size:18px !important;
  line-height:1.15 !important;
  font-weight:900 !important;
}
.mo-tools-sheet .mo-tools-sheet-head span:not(.mo-tools-sheet-icon){
  display:block !important;
  min-width:0 !important;
  margin-top:3px !important;
  color:var(--text2,#64748b) !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-weight:650 !important;
}
.mo-tools-sheet .mo-tools-sheet-close{
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  display:grid !important;
  place-items:center !important;
  position:static !important;
  border-radius:var(--ui-radius-md,var(--radius-mid,10px)) !important;
  border:1px solid color-mix(in srgb,var(--border,#d8dee8) 75%,transparent) !important;
  background:var(--surface-elevated,#fff) !important;
  color:var(--text,#111827) !important;
  box-shadow:none !important;
}
.mo-tools-sheet .mo-tools-sheet-body{
  min-height:0 !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  padding:14px !important;
}
.mo-tools-sheet .mo-tools-option-list,
.mo-tools-sheet .mo-tools-filter-list,
.mo-tools-sheet .mo-tools-sort-list,
.mo-tools-sheet .mo-tools-settings{
  display:grid !important;
  gap:10px !important;
}
.mo-tools-sheet .mo-tools-option,
.mo-tools-sheet .mo-tools-filter-btn,
.mo-tools-sheet .mo-tools-sort-btn,
.mo-tools-sheet .mo-tools-setting-btn{
  width:100% !important;
  min-width:0 !important;
  min-height:62px !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) !important;
  grid-template-areas:"ico title" "ico desc" !important;
  align-items:center !important;
  column-gap:10px !important;
  row-gap:2px !important;
  padding:10px 12px !important;
  text-align:left !important;
  border:1px solid color-mix(in srgb,var(--border,#d8dee8) 84%,transparent) !important;
  border-radius:var(--ui-radius-card,var(--radius-max,18px)) !important;
  background:var(--surface-elevated,#fff) !important;
  color:var(--text,#111827) !important;
  box-shadow:none !important;
  cursor:pointer !important;
}
.mo-tools-sheet .mo-tools-option:hover,
.mo-tools-sheet .mo-tools-option:focus-visible,
.mo-tools-sheet .mo-tools-filter-btn:hover,
.mo-tools-sheet .mo-tools-sort-btn:hover,
.mo-tools-sheet .mo-tools-setting-btn:hover,
.mo-tools-sheet .mo-tools-filter-btn:focus-visible,
.mo-tools-sheet .mo-tools-sort-btn:focus-visible,
.mo-tools-sheet .mo-tools-setting-btn:focus-visible{
  border-color:color-mix(in srgb,var(--accent,#f97316) 44%,var(--border,#d8dee8)) !important;
  background:color-mix(in srgb,var(--accent,#f97316) 7%,var(--surface-elevated,#fff)) !important;
}
.mo-tools-sheet .mo-tools-option > span,
.mo-tools-sheet .mo-tools-filter-btn > span,
.mo-tools-sheet .mo-tools-sort-btn > span,
.mo-tools-sheet .mo-tools-setting-btn > span{
  grid-area:ico !important;
  width:42px !important;
  height:42px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:var(--ui-radius-md,var(--radius-mid,10px)) !important;
  background:color-mix(in srgb,var(--accent,#f97316) 12%,transparent) !important;
  color:var(--accent,#f97316) !important;
  font-size:16px !important;
  font-weight:900 !important;
}
.mo-tools-sheet .mo-tools-option > b,
.mo-tools-sheet .mo-tools-filter-btn > b,
.mo-tools-sheet .mo-tools-sort-btn > b,
.mo-tools-sheet .mo-tools-setting-btn > b{
  grid-area:title !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  color:var(--text,#111827) !important;
}
.mo-tools-sheet .mo-tools-option small,
.mo-tools-sheet .mo-tools-sort-btn small,
.mo-tools-sheet .mo-tools-setting-btn small{
  grid-area:desc !important;
  min-width:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:12px !important;
  line-height:1.25 !important;
  font-weight:650 !important;
  color:var(--text2,#64748b) !important;
}
.mo-tools-sheet .mo-tools-option.active,
.mo-tools-sheet .mo-tools-filter-btn.active,
.mo-tools-sheet .mo-tools-sort-btn.active{
  border-color:color-mix(in srgb,var(--accent,#f97316) 58%,var(--border,#d8dee8)) !important;
  background:color-mix(in srgb,var(--accent,#f97316) 10%,var(--surface-elevated,#fff)) !important;
}
.mo-tools-sheet .mo-tools-option.active > span,
.mo-tools-sheet .mo-tools-filter-btn.active > span,
.mo-tools-sheet .mo-tools-sort-btn.active > span{
  background:var(--accent,#f97316) !important;
  color:#fff !important;
}
.mo-tools-sheet .mo-tools-combined{
  display:grid !important;
  gap:12px !important;
}
.mo-tools-sheet .mo-tools-combined-section{
  min-width:0 !important;
  display:grid !important;
  gap:10px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.mo-tools-sheet .mo-tools-combined-title{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:4px 2px !important;
  color:var(--text,#111827) !important;
  font-size:13px !important;
  font-weight:900 !important;
}
.mo-tools-sheet .mo-tools-empty{
  border:1px dashed color-mix(in srgb,var(--border,#d8dee8) 90%,transparent) !important;
  border-radius:var(--ui-radius-card,var(--radius-max,18px)) !important;
  background:color-mix(in srgb,var(--surface-elevated,#fff) 92%,transparent) !important;
}
body.mo-tools-sheet-open{
  overflow:hidden !important;
}
@media (max-width:767px){
  .mo-tools-sheet.cmodal-overlay.open{
    align-items:flex-end !important;
    justify-content:center !important;
    padding:0 !important;
  }
  .mo-tools-sheet .mo-tools-sheet-card{
    width:100% !important;
    max-height:86vh !important;
    border-radius:var(--ui-radius-lg,var(--radius-max,18px)) var(--ui-radius-lg,var(--radius-max,18px)) 0 0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-bottom:0 !important;
  }
  .mo-tools-sheet .mo-tools-sheet-head{
    min-height:64px !important;
    padding:13px 14px !important;
  }
  .mo-tools-sheet .mo-tools-sheet-titlebox{
    grid-template-columns:38px minmax(0,1fr) !important;
  }
  .mo-tools-sheet .mo-tools-sheet-icon{
    width:38px !important;
    height:38px !important;
  }
  .mo-tools-sheet .mo-tools-sheet-head b{
    font-size:16px !important;
  }
  .mo-tools-sheet .mo-tools-sheet-body{
    padding:12px 12px calc(16px + env(safe-area-inset-bottom,0px)) !important;
  }
  .mo-tools-sheet .mo-tools-option,
  .mo-tools-sheet .mo-tools-filter-btn,
  .mo-tools-sheet .mo-tools-sort-btn,
  .mo-tools-sheet .mo-tools-setting-btn{
    min-height:58px !important;
    border-radius:var(--ui-radius-md,var(--radius-mid,10px)) !important;
  }
}

/* === SOURCE: css/radius_theme_guard.css === */
/* r284 — финальная привязка border-radius к теме: 5px / 10px / 18px.
   Этот файл подключается последним и не меняет логику компонентов. */
:root{
  --radius-min:5px;
  --radius-mid:10px;
  --radius-max:18px;
  --r-sm:var(--radius-min);
  --r-md:var(--radius-mid);
  --r-lg:var(--radius-max);
  --r-xl:var(--radius-max);
  --radius-btn:var(--ui-radius-btn, var(--radius-mid));
  --radius-field:var(--ui-radius-field, var(--radius-mid));
  --radius-card:var(--ui-radius-card, var(--radius-max));
  --radius-modal:var(--ui-radius-modal, var(--radius-max));
}

[data-radius="min"],
[data-radius="square"],
[data-radius="sharp"]{
  --ui-radius-sm:var(--radius-min);
  --ui-radius-md:var(--radius-min);
  --ui-radius-lg:var(--radius-min);
  --ui-radius-btn:var(--radius-min);
  --ui-radius-field:var(--radius-min);
  --ui-radius-card:var(--radius-min);
  --ui-radius-modal:var(--radius-min);
}

[data-radius="mid"],
[data-radius="medium"],
[data-radius="solid"],
[data-radius="default"]{
  --ui-radius-sm:var(--radius-min);
  --ui-radius-md:var(--radius-mid);
  --ui-radius-lg:var(--radius-mid);
  --ui-radius-btn:var(--radius-mid);
  --ui-radius-field:var(--radius-mid);
  --ui-radius-card:var(--radius-mid);
  --ui-radius-modal:var(--radius-mid);
}

[data-radius="max"],
[data-radius="apple"],
[data-radius="round"]{
  --ui-radius-sm:var(--radius-min);
  --ui-radius-md:var(--radius-mid);
  --ui-radius-lg:var(--radius-max);
  --ui-radius-btn:var(--radius-mid);
  --ui-radius-field:var(--radius-mid);
  --ui-radius-card:var(--radius-max);
  --ui-radius-modal:var(--radius-max);
}

/* Кнопки и поля */
.btn,
button.btn,
.catalog-tool-btn,
.catalog-tools__search-btn,
.mo-tools-option,
input:not([type="checkbox"]):not([type="radio"]),
textarea,
select,
.form-control,
.k-input{
  border-radius:var(--ui-radius-field, var(--radius-mid));
}

.btn,
button.btn,
.catalog-tool-btn,
.catalog-tools__search-btn,
.mo-tools-option{
  border-radius:var(--ui-radius-btn, var(--radius-mid));
}

/* Карточки и панели */
.card,
.mo-card,
.msng-item,
.parts-category-card,
.master-contact-row,
.spa-hero,
.spa-hero-tools-card,
.news-card,
.news-category-card,
.svc-cat-nav-card,
.cmodal-card,
.mo-tools-sheet{
  border-radius:var(--ui-radius-card, var(--radius-max));
}

/* Модальные окна */
.cmodal-card,
.modal-v2,
.modal-content,
.mo-tools-sheet,
.news-modal-box,
.owiz-box,
.odet-panel{
  border-radius:var(--ui-radius-modal, var(--radius-max));
}

/* Малые элементы: не делаем pill, но оставляем минимальный радиус темы */
.k-surface-sm,
.badge:not(.pill),
.tag:not(.pill),
.chip:not(.pill),
.mo-timeline-dot,
.mo-card-action,
.msng-filter-chip:not(.pill){
  border-radius:var(--ui-radius-sm, var(--radius-min));
}

/* === SOURCE: css/list_cards_unified.css === */
/* r286 — unified list card system for myorders / masters / parts / messages / news.
   Scope-only visual normalization. No business logic changes. */
:root{
  --list-card-radius: var(--ui-radius-lg, 18px);
  --list-card-radius-inner: var(--ui-radius-md, 10px);
  --list-card-bg: linear-gradient(180deg, color-mix(in srgb, var(--surface, #fff) 96%, #fff) 0%, color-mix(in srgb, var(--surface2, #f8fafc) 82%, #fff) 100%);
  --list-card-border: color-mix(in srgb, var(--line, #e5e7eb) 78%, transparent);
  --list-card-shadow: 0 10px 26px rgba(15, 23, 42, .075), 0 2px 7px rgba(15, 23, 42, .035);
  --list-card-shadow-hover: 0 16px 34px rgba(15, 23, 42, .105), 0 4px 12px rgba(15, 23, 42, .045);
  --list-card-pad: 16px;
  --list-card-gap: 14px;
  --list-card-text: var(--text, #111827);
  --list-card-muted: var(--text2, #64748b);
  --list-card-soft: color-mix(in srgb, var(--surface2, #f8fafc) 78%, transparent);
}

body.kareta-page-myorders #mo-list,
body.kareta-page-masters .masters-grid,
body.kareta-page-parts .parts-categories-grid,
body.kareta-page-parts .parts-grid,
body.kareta-page-messages #msng-page-listmount,
body.kareta-page-news .news-grid,
body.kareta-page-news .news-hero-grid{
  gap: var(--list-card-gap) !important;
}

body.kareta-page-myorders .mo-card.card,
body.kareta-page-myorders .mo-card,
body.kareta-page-masters .master-contact-row,
body.kareta-page-masters .master-contact-row.reveal.in,
body.kareta-page-parts .parts-category-card,
body.kareta-page-parts .parts-card,
body.kareta-page-parts .part-card,
body.kareta-page-messages .msng-item.msng-item--v2,
body.kareta-page-news .news-card{
  border: 1px solid var(--list-card-border) !important;
  border-radius: var(--list-card-radius) !important;
  background: var(--list-card-bg) !important;
  box-shadow: var(--list-card-shadow) !important;
  color: var(--list-card-text) !important;
  overflow: hidden !important;
  position: relative !important;
  isolation: isolate;
  box-sizing: border-box;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

body.kareta-page-myorders .mo-card.card::after,
body.kareta-page-myorders .mo-card::after,
body.kareta-page-masters .master-contact-row::after,
body.kareta-page-parts .parts-category-card::after,
body.kareta-page-parts .parts-card::after,
body.kareta-page-parts .part-card::after,
body.kareta-page-messages .msng-item.msng-item--v2::after,
body.kareta-page-news .news-card::after{
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--orange, #ff6b00) 11%, transparent), transparent 36%);
  opacity: .7;
}

body.kareta-page-myorders .mo-card.card > *,
body.kareta-page-myorders .mo-card > *,
body.kareta-page-masters .master-contact-row > *,
body.kareta-page-parts .parts-category-card > *,
body.kareta-page-parts .parts-card > *,
body.kareta-page-parts .part-card > *,
body.kareta-page-messages .msng-item.msng-item--v2 > *,
body.kareta-page-news .news-card > *{
  position: relative;
  z-index: 1;
}

body.kareta-page-myorders .mo-card:hover,
body.kareta-page-masters .master-contact-row:hover,
body.kareta-page-parts .parts-category-card:hover,
body.kareta-page-parts .parts-card:hover,
body.kareta-page-parts .part-card:hover,
body.kareta-page-messages .msng-item.msng-item--v2:hover,
body.kareta-page-news .news-card:hover{
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--orange, #ff6b00) 28%, var(--list-card-border)) !important;
  box-shadow: var(--list-card-shadow-hover) !important;
}

body.kareta-page-myorders .mo-card:active,
body.kareta-page-masters .master-contact-row:active,
body.kareta-page-parts .parts-category-card:active,
body.kareta-page-parts .parts-card:active,
body.kareta-page-parts .part-card:active,
body.kareta-page-messages .msng-item.msng-item--v2:active,
body.kareta-page-news .news-card:active{
  transform: translateY(0) scale(.995) !important;
}

body.kareta-page-myorders .mo-card-head,
body.kareta-page-myorders .mo-timeline,
body.kareta-page-myorders .mo-chat-entity,
body.kareta-page-myorders .mo-card-actions,
body.kareta-page-news .nc-body,
body.kareta-page-messages .msng-item.msng-item--v2,
body.kareta-page-masters .master-contact-row,
body.kareta-page-parts .parts-category-card{
  padding: var(--list-card-pad) !important;
}

body.kareta-page-myorders .mo-card-head,
body.kareta-page-myorders .mo-card-actions,
body.kareta-page-myorders .mo-chat-entity,
body.kareta-page-myorders .mo-timeline,
body.kareta-page-news .nc-author-row{
  border-color: color-mix(in srgb, var(--line, #e5e7eb) 76%, transparent) !important;
}

body.kareta-page-myorders .mo-card-head,
body.kareta-page-myorders .mo-card-actions{
  background: color-mix(in srgb, var(--surface, #fff) 68%, transparent) !important;
}

body.kareta-page-myorders .mo-card-top,
body.kareta-page-messages .msng-item-row1,
body.kareta-page-messages .msng-item-title-row,
body.kareta-page-news .nc-meta-row,
body.kareta-page-parts .parts-category-card__top{
  gap: 10px !important;
}

body.kareta-page-myorders .mo-card-title,
body.kareta-page-messages .msng-item-name2,
body.kareta-page-news .nc-title,
body.kareta-page-parts .parts-category-card__title{
  color: var(--text, #111827) !important;
  line-height: 1.22 !important;
}

body.kareta-page-myorders .mo-card-car,
body.kareta-page-messages .msng-item-preview2,
body.kareta-page-messages .msng-item-car2,
body.kareta-page-news .nc-intro,
body.kareta-page-news .nc-date,
body.kareta-page-news .nc-read-time,
body.kareta-page-news .nc-views,
body.kareta-page-parts .parts-category-card__desc,
body.kareta-page-parts .parts-category-card__label{
  color: var(--list-card-muted) !important;
}

body.kareta-page-myorders .mo-card-actions,
body.kareta-page-news .nc-footer,
body.kareta-page-parts .parts-category-card__stats,
body.kareta-page-messages .msng-item-row3{
  display: flex;
  align-items: center;
  gap: 10px !important;
  flex-wrap: wrap;
}

body.kareta-page-myorders .mo-card-actions .btn,
body.kareta-page-masters .master-contact-row .btn,
body.kareta-page-parts .parts-category-card .btn,
body.kareta-page-parts .parts-card .btn,
body.kareta-page-parts .part-card .btn,
body.kareta-page-messages .msng-item.msng-item--v2 .btn,
body.kareta-page-news .news-card .btn,
body.kareta-page-news .nc-read-link{
  min-height: 38px;
  border-radius: var(--ui-radius-md, 10px) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-sizing: border-box;
}

body.kareta-page-myorders .mo-status-badge,
body.kareta-page-news .nc-cat-badge,
body.kareta-page-news .nc-featured-badge,
body.kareta-page-parts .parts-category-card__stats span,
body.kareta-page-messages .msng-item-svc{
  border-radius: 999px !important;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
}

body.kareta-page-messages .msng-item.msng-item--v2{
  margin: 0 0 var(--list-card-gap) !important;
  border-bottom: 1px solid var(--list-card-border) !important;
}
body.kareta-page-messages .msng-list .msng-item.msng-item--v2:last-child{margin-bottom:0!important;}
body.kareta-page-messages .msng-item--unread{
  border-color: color-mix(in srgb, var(--orange, #ff6b00) 30%, var(--list-card-border)) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--orange, #ff6b00) 7%, #fff) 0%, var(--surface, #fff) 100%) !important;
}
body.kareta-page-messages .msng-item--active{
  border-color: color-mix(in srgb, var(--orange, #ff6b00) 42%, var(--list-card-border)) !important;
}

body.kareta-page-news .nc-cover{
  border-radius: 0 !important;
}
body.kareta-page-news .news-card--hero .nc-cover{height:240px;}
body.kareta-page-news .nc-cover--sm{height:150px;}

body.kareta-page-parts .parts-category-card__icon,
body.kareta-page-parts .parts-category-card__count{
  border-radius: var(--list-card-radius-inner) !important;
}
body.kareta-page-parts .parts-category-card__desc{
  min-height: 0 !important;
  line-height: 1.55 !important;
}

body.kareta-page-masters .master-contact-row{
  min-height: 0 !important;
  gap: 14px !important;
}
body.kareta-page-masters .master-contact-row::before{opacity:.34!important;}

body.kareta-page-myorders .mo-timeline{
  background: color-mix(in srgb, var(--surface2, #f8fafc) 58%, transparent);
}
body.kareta-page-myorders .mo-tl-dot{
  width: 28px;
  height: 28px;
  font-size: 12px;
}
body.kareta-page-myorders .mo-tl-line{
  top: 13px;
  left: calc(50% + 14px);
  right: calc(-50% + 14px);
}

body.kareta-page-myorders .mo-empty,
body.kareta-page-masters .masters-empty,
body.kareta-page-parts .parts-empty,
body.kareta-page-messages .msng-empty-cta.card,
body.kareta-page-news .news-empty,
body.kareta-page-news .news-empty-state{
  border: 1px dashed color-mix(in srgb, var(--line, #e5e7eb) 88%, transparent) !important;
  border-radius: var(--list-card-radius) !important;
  background: color-mix(in srgb, var(--surface, #fff) 88%, transparent) !important;
  box-shadow: none !important;
  padding: 18px !important;
}

@media (max-width: 760px){
  :root{
    --list-card-pad: 14px;
    --list-card-gap: 10px;
    --list-card-shadow: 0 8px 18px rgba(15, 23, 42, .07), 0 1px 5px rgba(15, 23, 42, .035);
    --list-card-shadow-hover: 0 10px 22px rgba(15, 23, 42, .09), 0 2px 8px rgba(15, 23, 42, .04);
  }
  body.kareta-page-myorders .mo-card-head,
  body.kareta-page-myorders .mo-timeline,
  body.kareta-page-myorders .mo-card-actions,
  body.kareta-page-news .nc-body,
  body.kareta-page-messages .msng-item.msng-item--v2,
  body.kareta-page-masters .master-contact-row,
  body.kareta-page-parts .parts-category-card{
    padding: var(--list-card-pad) !important;
  }
  body.kareta-page-myorders .mo-card-actions .btn{
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
    min-height: 36px;
    font-size: 12px;
  }
  body.kareta-page-messages .msng-item-preview2,
  body.kareta-page-news .nc-intro--sm{
    -webkit-line-clamp: 2;
  }
  body.kareta-page-news .news-grid{
    grid-template-columns: 1fr !important;
  }
  body.kareta-page-news .nc-cover,
  body.kareta-page-news .news-card--hero .nc-cover{
    height: 176px;
  }
}

/* === SOURCE: css/card_normalization.css === */
/* KARETA.KZ r290 — cards component normalization
   Purpose: bind legacy card classes to the UI_STANDARD_KARETA.md card contract.
   Scope: visual/card structure only. No data, routing, search, filter or order logic changes. */

:root{
  --ui-card-radius: var(--ui-radius-card, 18px);
  --ui-card-radius-inner: var(--ui-radius-md, 10px);
  --ui-card-bg: var(--ui-surface, var(--surface, #fff));
  --ui-card-bg-soft: var(--ui-surface-2, var(--surface2, #f8fafc));
  --ui-card-border: var(--ui-border, var(--border, rgba(15,23,42,.12)));
  --ui-card-border-soft: var(--ui-border-soft, rgba(15,23,42,.08));
  --ui-card-shadow: var(--ui-shadow-card, 0 12px 32px rgba(15,23,42,.08));
  --ui-card-shadow-hover: var(--ui-shadow-float, 0 18px 48px rgba(15,23,42,.14));
  --ui-card-pad-sm: var(--space-3, 12px);
  --ui-card-pad-md: var(--space-4, 16px);
  --ui-card-pad-lg: var(--space-5, 20px);
  --ui-card-gap: var(--space-3, 12px);
  --ui-card-line: color-mix(in srgb, var(--ui-card-border) 72%, transparent);
}

/* Future base card + legacy aliases. One card = one visual surface. */
.ui-card,
.card.ui-card,
.mo-card,
.mo-card.card,
.master-card,
.master-contact-row,
.master-contact-row.reveal.in,
.parts-category-card,
.parts-card,
.part-card,
.msng-item.msng-item--v2,
.news-card,
.admin-card,
.admin-master-card,
.schedule-card,
.legal-info-card,
.legal-rich-stat{
  box-sizing: border-box !important;
  min-width: 0;
  max-width: 100%;
  position: relative;
  isolation: isolate;
  border: 1px solid var(--ui-card-border) !important;
  border-radius: var(--ui-card-radius) !important;
  background: var(--ui-card-bg) !important;
  box-shadow: var(--ui-card-shadow) !important;
  color: var(--text, #111827);
  overflow: hidden;
}

/* Structural card zones. They are layout/content, not additional cards. */
.ui-card__head,
.ui-card__body,
.ui-card__footer,
.ui-card__actions,
.mo-card-head,
.mo-card-actions,
.mo-timeline,
.master-card__body,
.master-card__head,
.master-card__footer,
.master-contact-row > *,
.parts-category-card__top,
.parts-category-card__stats,
.msng-item-content,
.msng-item-row1,
.msng-item-title-row,
.msng-item-row3,
.nc-body,
.nc-footer,
.admin-card__body,
.admin-card__footer{
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

/* Prevent nested accidental visual surfaces inside normalized cards. */
.ui-card .ui-card__body,
.mo-card .mo-card-head,
.mo-card .mo-timeline,
.mo-card .mo-card-actions,
.master-card .master-card__body,
.master-card .master-card__footer,
.parts-category-card .parts-category-card__top,
.parts-category-card .parts-category-card__stats,
.msng-item.msng-item--v2 .msng-item-content,
.news-card .nc-body,
.news-card .nc-footer,
.admin-card .admin-card__body{
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Consistent internal rhythm without forcing all cards into identical markup. */
.mo-card-head,
.master-card__body,
.master-contact-row,
.parts-category-card,
.msng-item.msng-item--v2,
.news-card .nc-body,
.admin-card,
.admin-master-card,
.schedule-card{
  padding: var(--ui-card-pad-md) !important;
}

.mo-card-actions,
.master-card__footer,
.news-card .nc-footer,
.ui-card__actions{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2, 8px);
  padding: var(--ui-card-pad-sm) var(--ui-card-pad-md) !important;
  border-top: 1px solid var(--ui-card-line) !important;
}

.mo-timeline{
  padding: var(--ui-card-pad-sm) var(--ui-card-pad-md) !important;
  border-top: 1px solid var(--ui-card-line) !important;
}

/* Unified hover is subtle; active must not move layout. */
.ui-card:hover,
.mo-card:hover,
.master-card:hover,
.master-contact-row:hover,
.parts-category-card:hover,
.parts-card:hover,
.part-card:hover,
.msng-item.msng-item--v2:hover,
.news-card:hover,
.admin-card:hover,
.admin-master-card:hover{
  border-color: color-mix(in srgb, var(--accent, var(--orange, #ff6b00)) 32%, var(--ui-card-border)) !important;
  box-shadow: var(--ui-card-shadow-hover) !important;
}

.ui-card:active,
.mo-card:active,
.master-card:active,
.master-contact-row:active,
.parts-category-card:active,
.parts-card:active,
.part-card:active,
.msng-item.msng-item--v2:active,
.news-card:active{
  transform: scale(.995);
}

/* Text overflow contract for all card families. */
.ui-card h1,
.ui-card h2,
.ui-card h3,
.ui-card h4,
.ui-card p,
.ui-card b,
.mo-card-title,
.mo-card-car,
.master-card__name,
.master-card__biz,
.master-card__spec,
.master-card__addr,
.parts-category-card__title,
.parts-category-card__desc,
.msng-item-name2,
.msng-item-preview2,
.msng-item-car2,
.news-card .nc-title,
.news-card .nc-intro,
.admin-card h3,
.admin-card p{
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.mo-card-title,
.master-card__name,
.parts-category-card__title,
.msng-item-name2,
.news-card .nc-title{
  line-height: 1.2;
}

.mo-card-car,
.master-card__spec,
.master-card__addr,
.parts-category-card__desc,
.msng-item-preview2,
.news-card .nc-intro{
  color: var(--text2, #64748b) !important;
  line-height: 1.45;
}

/* Inner media / counters use inner radius, not card radius. */
.master-card__cover,
.master-card__avatar,
.parts-category-card__icon,
.parts-category-card__count,
.news-card .nc-cover,
.msng-avatar,
.msng-item-av,
.mo-tl-dot{
  border-radius: var(--ui-card-radius-inner) !important;
}

.news-card .nc-cover{
  border-radius: 0 !important;
}

/* Badges/statuses inside cards: pill is allowed as a separate semantic shape. */
.mo-status-badge,
.master-card__badge,
.master-card__service,
.parts-category-card__stats span,
.msng-item-svc,
.news-card .nc-cat-badge,
.news-card .nc-featured-badge,
.ui-badge,
.ui-status{
  box-sizing: border-box;
  max-width: 100%;
  min-height: 24px;
  border-radius: var(--ui-radius-pill, 999px) !important;
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 4px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Card grids/lists must not stretch children beyond the viewport. */
#mo-list,
.mo-list,
.masters-grid,
.master-card-grid,
.parts-categories-grid,
.parts-grid,
#msng-page-listmount,
.msng-list,
.news-grid,
.news-hero-grid,
.admin-grid,
.admin-list{
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

#mo-list > *,
.mo-list > *,
.masters-grid > *,
.master-card-grid > *,
.parts-categories-grid > *,
.parts-grid > *,
#msng-page-listmount > *,
.msng-list > *,
.news-grid > *,
.news-hero-grid > *,
.admin-grid > *,
.admin-list > *{
  min-width: 0;
  max-width: 100%;
}

/* Empty states are cards without hover elevation. */
.ui-empty,
.mo-empty,
.masters-empty,
.parts-empty,
.msng-empty-cta.card,
.news-empty,
.news-empty-state{
  box-sizing: border-box;
  max-width: 100%;
  border: 1px dashed var(--ui-card-border) !important;
  border-radius: var(--ui-card-radius) !important;
  background: color-mix(in srgb, var(--ui-card-bg) 88%, transparent) !important;
  box-shadow: none !important;
  padding: var(--ui-card-pad-lg) !important;
}

@media (max-width: 760px){
  :root{
    --ui-card-pad-md: var(--space-3, 12px);
    --ui-card-pad-lg: var(--space-4, 16px);
  }

  .mo-card-head,
  .master-card__body,
  .master-contact-row,
  .parts-category-card,
  .msng-item.msng-item--v2,
  .news-card .nc-body,
  .admin-card,
  .admin-master-card,
  .schedule-card{
    padding: var(--ui-card-pad-md) !important;
  }

  .mo-card-actions,
  .master-card__footer,
  .news-card .nc-footer,
  .ui-card__actions{
    padding: var(--space-2, 8px) var(--ui-card-pad-md) !important;
  }

  .mo-card-actions .btn,
  .master-card__footer .btn,
  .news-card .nc-footer .btn{
    flex: 1 1 calc(50% - var(--space-2, 8px));
    min-width: 0;
  }
}

/* === SOURCE: css/button_normalization.css === */
/* KARETA.KZ r289 — button normalization guard
   Purpose: bind legacy button classes to the mandatory UI_STANDARD_KARETA.md button contract.
   This file is intentionally loaded after component CSS and does not change click logic. */

:root{
  --btn-radius: var(--ui-radius-btn, 10px);
  --btn-height-sm: var(--ui-btn-h-sm, 36px);
  --btn-height-md: var(--ui-btn-h-md, 44px);
  --btn-height-lg: var(--ui-btn-h-lg, 48px);
  --btn-gap: var(--space-2, 8px);
  --btn-pad-x: var(--space-3, 12px);
  --btn-font: var(--ui-text-md, 15px);
  --btn-icon: var(--ui-icon-md, 18px);
}

/* Base button contract. Old page-specific classes stay valid, but inherit one physical model. */
.btn,
.ui-btn,
button.btn,
a.btn,
input[type="button"].btn,
input[type="submit"].btn,
.catalog-tool-btn,
.mo-action-btn,
.msng-action-btn,
.parts-action-btn,
.master-action-btn,
.admin-action-btn,
.news-action-btn,
.flow-btn,
.mmaster-footer-btn,
.msng-loyalty-btn,
.msng-empty-preview__btn,
.parts-share-btn,
.parts-cart-btn,
.part-rating-btn,
.news-back-btn,
.mo-search-submit,
.mo-search-clear,
.mo-search-toggle,
.cmodal-close,
.modal-close-v2{
  box-sizing: border-box !important;
  min-width: 0;
  min-height: var(--btn-height-md) !important;
  border-radius: var(--btn-radius) !important;
  font-family: inherit;
  font-size: var(--btn-font);
  font-weight: 800;
  line-height: 1.15;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--btn-gap);
  padding: 0 var(--btn-pad-x);
  border: 1px solid var(--ui-border, rgba(15,23,42,.12));
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  vertical-align: middle;
  max-width: 100%;
}

.btn *,
.ui-btn *,
.catalog-tool-btn *,
.mo-action-btn *,
.msng-action-btn *,
.parts-action-btn *,
.master-action-btn *,
.admin-action-btn *,
.news-action-btn *{
  min-width: 0;
}

.btn span,
.ui-btn span,
.catalog-tool-btn span,
.mo-action-btn span,
.msng-action-btn span,
.parts-action-btn span,
.master-action-btn span,
.admin-action-btn span,
.news-action-btn span{
  flex: 0 0 auto;
}

.btn b,
.ui-btn b,
.catalog-tool-btn b,
.mo-action-btn b,
.msng-action-btn b,
.parts-action-btn b,
.master-action-btn b,
.admin-action-btn b,
.news-action-btn b,
.btn .btn-text,
.ui-btn .btn-text{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.btn:focus-visible,
.ui-btn:focus-visible,
.catalog-tool-btn:focus-visible,
.mo-action-btn:focus-visible,
.msng-action-btn:focus-visible,
.parts-action-btn:focus-visible,
.master-action-btn:focus-visible,
.admin-action-btn:focus-visible,
.news-action-btn:focus-visible,
.mo-search-submit:focus-visible,
.mo-search-clear:focus-visible,
.cmodal-close:focus-visible,
.modal-close-v2:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--accent, #f97316) 62%, transparent) !important;
  outline-offset: 2px;
}

/* Variants: keep old class names, map them to a single visual contract. */
.btn-primary,
.btn--primary,
.ui-btn--primary,
.catalog-tool-btn.is-primary,
.mo-action-btn--primary,
.parts-action-btn--primary,
.master-action-btn--primary,
.news-action-btn--primary,
.flow-btn--primary{
  background: linear-gradient(135deg, var(--orange, #ff6b00), var(--orange-l, #ff8a2a)) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 24px rgba(255,107,0,.22) !important;
}

.btn-outline,
.btn-secondary,
.btn--secondary,
.ui-btn--secondary,
.mo-action-btn--secondary,
.parts-action-btn--secondary,
.master-action-btn--secondary,
.news-action-btn--secondary,
.flow-btn--secondary{
  background: var(--ui-surface, #fff) !important;
  color: var(--accent, var(--orange, #ff6b00)) !important;
  border-color: color-mix(in srgb, var(--accent, #f97316) 34%, var(--ui-border, rgba(15,23,42,.12))) !important;
  box-shadow: none !important;
}

.btn-ghost,
.btn--ghost,
.ui-btn--ghost,
.mo-action-btn--ghost,
.parts-action-btn--ghost,
.master-action-btn--ghost,
.news-action-btn--ghost{
  background: transparent !important;
  color: var(--text2, #475569) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.btn-danger,
.btn--danger,
.ui-btn--danger,
.mo-action-btn--danger,
.parts-action-btn--danger,
.master-action-btn--danger,
.news-action-btn--danger{
  background: var(--danger, #ef4444) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 24px rgba(239,68,68,.18) !important;
}

.btn:hover,
.ui-btn:hover,
.catalog-tool-btn:hover,
.mo-action-btn:hover,
.msng-action-btn:hover,
.parts-action-btn:hover,
.master-action-btn:hover,
.admin-action-btn:hover,
.news-action-btn:hover,
.flow-btn:hover{
  transform: translateY(-1px);
}

.btn:active,
.ui-btn:active,
.catalog-tool-btn:active,
.mo-action-btn:active,
.msng-action-btn:active,
.parts-action-btn:active,
.master-action-btn:active,
.admin-action-btn:active,
.news-action-btn:active,
.flow-btn:active{
  transform: translateY(0);
}

.btn[disabled],
.ui-btn[disabled],
button[disabled].btn,
.catalog-tool-btn[disabled],
.mo-action-btn[disabled],
.msng-action-btn[disabled],
.parts-action-btn[disabled],
.master-action-btn[disabled],
.admin-action-btn[disabled],
.news-action-btn[disabled],
.flow-btn[disabled],
.btn.is-disabled,
.ui-btn.is-disabled{
  opacity: .55 !important;
  cursor: not-allowed !important;
  pointer-events: none;
  transform: none !important;
}

/* Sizes. */
.btn-xs,
.btn-sm,
.ui-btn--sm{
  min-height: var(--btn-height-sm) !important;
  font-size: 13px !important;
  padding-inline: var(--space-2, 8px) !important;
}
.btn-md,
.ui-btn--md{
  min-height: var(--btn-height-md) !important;
}
.btn-lg,
.ui-btn--lg{
  min-height: var(--btn-height-lg) !important;
  font-size: 16px !important;
  padding-inline: var(--space-4, 16px) !important;
}
.btn--block,
.ui-btn--block,
.btn.block{
  width: 100%;
  justify-content: center;
}

/* Icon-only buttons stay square and do not inherit long text metrics. */
.btn--icon,
.ui-btn--icon,
.cmodal-close,
.modal-close-v2,
.mo-search-clear,
.msng-close-btn,
.msng-back-btn,
.msng-back-btn2,
.msng-hd-btn,
.msng-hd-btn2,
.msng-send-btn,
.msng-chat-avatar-btn,
.parts-cart-btn,
.part-rating-btn{
  width: var(--btn-height-md) !important;
  min-width: var(--btn-height-md) !important;
  max-width: var(--btn-height-md) !important;
  height: var(--btn-height-md) !important;
  min-height: var(--btn-height-md) !important;
  padding: 0 !important;
  flex: 0 0 var(--btn-height-md);
}

.msng-send-btn{
  border-radius: var(--ui-radius-btn, 10px) !important;
  background: var(--orange, #ff6b00) !important;
  color: #fff !important;
}

/* Unified hero/tools buttons: override older action-template conflicts without changing markup. */
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
  min-height: var(--btn-height-md) !important;
  height: auto !important;
  border-radius: var(--ui-radius-btn, 10px) !important;
  padding: var(--space-2, 8px) var(--space-3, 12px) !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0,1fr) !important;
  align-items: center !important;
  justify-content: start !important;
  gap: var(--space-2, 8px) !important;
  background: var(--ui-surface, #fff) !important;
  border: 1px solid var(--ui-border, rgba(15,23,42,.12)) !important;
  box-shadow: none !important;
  color: var(--text, #111827) !important;
  text-align: left !important;
  overflow: hidden !important;
  position: relative;
  z-index: var(--z-base, 1);
}

.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: var(--ui-radius-sm, 5px) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 16px !important;
  background: color-mix(in srgb, var(--accent, #f97316) 12%, transparent) !important;
  color: var(--accent, #f97316) !important;
}

.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--filters .catalog-tool-btn__ico{
  background: color-mix(in srgb, var(--accent, #f97316) 16%, transparent) !important;
}
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn--settings .catalog-tool-btn__ico{
  background: color-mix(in srgb, var(--text, #111827) 8%, transparent) !important;
  color: var(--text2, #475569) !important;
}

.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
.spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
}

.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:hover,
.catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn:focus-visible{
  background: color-mix(in srgb, var(--accent, #f97316) 7%, var(--ui-surface, #fff)) !important;
  border-color: color-mix(in srgb, var(--accent, #f97316) 38%, var(--ui-border, rgba(15,23,42,.12))) !important;
}

/* Search buttons belong to the same button scale. */
.mo-search-submit{
  min-width: var(--btn-height-md) !important;
  background: var(--orange, #ff6b00) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.mo-search-submit span{font-size: 16px;}
.mo-search-submit b{white-space: nowrap;}

/* Action rows: no overflow, consistent wrapping. */
.mo-card-actions,
.part-card-v2-foot,
.part-details-actions,
.product-buybox__actions,
.master-return-card-actions,
.master-cabinet-hero .mch-actions,
.cmodal-actions,
.msng-attach-preview-actions,
.msng-media-viewer__actions{
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 8px);
}

.mo-card-actions .btn,
.part-card-v2-foot .btn,
.part-details-actions .btn,
.product-buybox__actions .btn,
.master-return-card-actions .btn,
.master-cabinet-hero .mch-actions .btn,
.cmodal-actions .btn,
.msng-attach-preview-actions .btn,
.msng-media-viewer__actions .btn{
  flex: 1 1 130px;
  justify-content: center;
}

@media (max-width: 640px){
  .btn,
  .ui-btn,
  button.btn,
  a.btn,
  .catalog-tool-btn,
  .mo-action-btn,
  .msng-action-btn,
  .parts-action-btn,
  .master-action-btn,
  .admin-action-btn,
  .news-action-btn,
  .flow-btn{
    min-height: var(--ui-touch-target, 44px) !important;
    font-size: 14px;
  }

  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: var(--space-2, 8px) !important;
  }

  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn{
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: var(--ui-touch-target, 44px) !important;
    grid-template-columns: 28px minmax(0,1fr) !important;
    gap: 5px !important;
    padding: 6px 7px !important;
    text-align: center !important;
  }

  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    font-size: 14px !important;
  }

  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-body .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    font-size: 11.5px !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .mo-card-actions .btn,
  .part-card-v2-foot .btn,
  .part-details-actions .btn,
  .product-buybox__actions .btn,
  .cmodal-actions .btn,
  .msng-attach-preview-actions .btn,
  .msng-media-viewer__actions .btn{
    flex: 1 1 calc(50% - var(--space-2, 8px));
  }
}

@media (hover: none){
  .btn:hover,
  .ui-btn:hover,
  .catalog-tool-btn:hover,
  .mo-action-btn:hover,
  .msng-action-btn:hover,
  .parts-action-btn:hover,
  .master-action-btn:hover,
  .admin-action-btn:hover,
  .news-action-btn:hover,
  .flow-btn:hover{
    transform: none !important;
  }
}

/* === SOURCE: css/modal_normalization.css === */
/* r291 — Modal / sheet normalization по UI_STANDARD_KARETA.md
   Цель: единая база модалок без изменения JS-логики открытия/закрытия. */

:root{
  --ui-modal-w-sm: 420px;
  --ui-modal-w-md: 560px;
  --ui-modal-w-lg: 780px;
  --ui-modal-max-h: min(86vh, 760px);
  --ui-sheet-max-h: min(88vh, 760px);
  --ui-modal-pad: var(--space-4,16px);
  --ui-modal-head-pad: var(--space-4,16px);
  --ui-modal-body-pad: var(--space-4,16px);
  --ui-modal-z: var(--z-modal,300);
  --ui-modal-backdrop: rgba(15,23,42,.58);
}

/* Overlay contract: старые классы подключаются к единому поведению. */
.ui-modal,
.ui-sheet,
.cmodal-overlay.open,
.modal-overlay-v2.open,
.news-modal-overlay.open,
.cab-pane-modal-overlay.open,
.mo-tools-sheet.cmodal-overlay.open{
  position: fixed;
  inset: 0;
  z-index: var(--ui-modal-z);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: var(--ui-modal-pad);
  background: var(--ui-modal-backdrop);
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* Общий контракт карточки модалки. */
.ui-modal__card,
.ui-sheet__card,
.cmodal-card,
.cmodal-box,
.modal-dialog-v2,
.modal-panel-v2,
.mo-tools-sheet-card,
.news-modal-box,
.cab-pane-modal-card,
.home-catalog-modal-card,
.part-details-modal-card,
.auth-modal{
  width: min(var(--ui-modal-w-md), calc(100vw - 24px));
  max-width: 100%;
  max-height: var(--ui-modal-max-h);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: var(--ui-radius-modal);
  background: var(--surface-bg, var(--surface, #fff));
  color: var(--text, #111827);
  border: var(--surface-border, 1px solid rgba(15,23,42,.12));
  box-shadow: var(--shadow-modal, 0 24px 80px rgba(15,23,42,.28));
  isolation: isolate;
}

/* Размерные варианты по смыслу старых модалок. */
.cmodal-card,
.cmodal-box,
.modal-dialog-v2,
.mo-tools-sheet-card,
.auth-modal{
  width: min(var(--ui-modal-w-md), calc(100vw - 24px));
}

.news-modal-box,
.part-details-modal-card,
.cab-pane-modal-card,
.home-catalog-modal-card{
  width: min(var(--ui-modal-w-lg), calc(100vw - 24px));
}

/* Шапка модалки — один стандарт для старых и новых классов. */
.ui-modal__head,
.ui-sheet__head,
.cmodal-head,
.modal-header-v2,
.mo-tools-sheet-head,
.cab-pane-modal-head{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3,12px);
  min-width: 0;
  padding: var(--ui-modal-head-pad);
  border-bottom: 1px solid var(--line, rgba(15,23,42,.10));
  background: transparent;
}

.ui-modal__title,
.ui-sheet__title,
.cmodal-title,
.modal-header-v2__title,
.mo-tools-sheet-head b{
  min-width: 0;
  margin: 0;
  color: var(--text, #111827);
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-modal__sub,
.ui-sheet__sub,
.modal-header-v2__sub,
.mo-tools-sheet-head span:not(.mo-tools-sheet-icon){
  margin-top: 4px;
  color: var(--text2, #64748b);
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* Тело модалки: один scroll-контейнер внутри карточки. */
.ui-modal__body,
.ui-sheet__body,
.cmodal-body,
.modal-body-v2,
.mo-tools-sheet-body,
.news-modal-body,
.cab-pane-modal-body{
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: var(--ui-modal-body-pad);
  box-sizing: border-box;
}

/* Footer/actions. */
.ui-modal__footer,
.ui-sheet__footer,
.cmodal-actions,
.modal-footer-v2,
.news-modal-actions,
.mx-filter-actions{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--space-2,8px);
  min-width: 0;
  padding: var(--space-3,12px) var(--ui-modal-body-pad);
  border-top: 1px solid var(--line, rgba(15,23,42,.10));
}

/* Кнопки закрытия: квадратный icon-only contract. */
.ui-modal__close,
.ui-sheet__close,
.cmodal-close,
.modal-close-v2,
.mo-tools-sheet-close,
.news-modal-close{
  flex: 0 0 var(--ui-touch-target,44px);
  width: var(--ui-touch-target,44px);
  height: var(--ui-touch-target,44px);
  min-width: var(--ui-touch-target,44px);
  min-height: var(--ui-touch-target,44px);
  display: inline-grid;
  place-items: center;
  border-radius: var(--ui-radius-btn);
  border: 1px solid var(--line, rgba(15,23,42,.12));
  background: var(--surface-2, rgba(15,23,42,.04));
  color: var(--text, #111827);
  box-sizing: border-box;
  cursor: pointer;
}

.ui-modal__close:hover,
.ui-sheet__close:hover,
.cmodal-close:hover,
.modal-close-v2:hover,
.mo-tools-sheet-close:hover,
.news-modal-close:hover{
  background: var(--surface-hover, rgba(15,23,42,.08));
}

/* Tool sheets: карточка инструментов использует тот же modal contract. */
.mo-tools-sheet .mo-tools-option-list,
.mo-tools-sheet .mo-tools-filter-list,
.mo-tools-sheet .mo-tools-sort-list,
.mo-tools-sheet .mo-tools-settings{
  display: grid;
  gap: var(--space-2,8px);
  min-width: 0;
}

.mo-tools-sheet .mo-tools-option,
.mo-tools-sheet .mo-tools-filter-btn,
.mo-tools-sheet .mo-tools-sort-btn,
.mo-tools-sheet .mo-tools-setting-btn{
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border-radius: var(--ui-radius-btn);
}

/* Длинные тексты в модалках не выталкивают карточку. */
.cmodal-card *,
.cmodal-box *,
.modal-dialog-v2 *,
.modal-panel-v2 *,
.mo-tools-sheet-card *,
.news-modal-box *,
.cab-pane-modal-card *{
  max-width: 100%;
}

/* ПК: центрированная модалка. */
@media (min-width: 1024px){
  .cmodal-overlay.open,
  .modal-overlay-v2.open,
  .news-modal-overlay.open,
  .cab-pane-modal-overlay.open,
  .mo-tools-sheet.cmodal-overlay.open{
    align-items: center;
    justify-content: center;
    padding: var(--space-5,20px);
  }
}

/* Мобильный: bottom sheet без вылета за экран и без двойных радиусов. */
@media (max-width: 640px){
  .ui-sheet,
  .cmodal-overlay.open,
  .modal-overlay-v2.open,
  .news-modal-overlay.open,
  .cab-pane-modal-overlay.open,
  .mo-tools-sheet.cmodal-overlay.open{
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    overflow: hidden;
  }

  .ui-modal__card,
  .ui-sheet__card,
  .cmodal-card,
  .cmodal-box,
  .modal-dialog-v2,
  .modal-panel-v2,
  .mo-tools-sheet-card,
  .news-modal-box,
  .cab-pane-modal-card,
  .home-catalog-modal-card,
  .part-details-modal-card,
  .auth-modal{
    width: 100%;
    max-width: 100%;
    max-height: var(--ui-sheet-max-h);
    border-radius: var(--ui-radius-modal) var(--ui-radius-modal) 0 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
  }

  .ui-modal__head,
  .ui-sheet__head,
  .cmodal-head,
  .modal-header-v2,
  .mo-tools-sheet-head,
  .cab-pane-modal-head{
    padding: var(--space-3,12px) var(--space-4,16px);
  }

  .ui-modal__body,
  .ui-sheet__body,
  .cmodal-body,
  .modal-body-v2,
  .mo-tools-sheet-body,
  .news-modal-body,
  .cab-pane-modal-body{
    padding: var(--space-3,12px) var(--space-4,16px) calc(var(--space-4,16px) + env(safe-area-inset-bottom));
  }

  .ui-modal__footer,
  .ui-sheet__footer,
  .cmodal-actions,
  .modal-footer-v2,
  .news-modal-actions,
  .mx-filter-actions{
    padding: var(--space-3,12px) var(--space-4,16px) calc(var(--space-3,12px) + env(safe-area-inset-bottom));
  }
}

/* === SOURCE: css/overflow_layers_audit.css === */
/* KARETA.KZ — r292 overflow / z-index / layers guard
   Purpose: stop UI blocks from leaving viewport and prevent decorative layers
   from intercepting controls. This file is a final guard layer; it does not
   change business logic or component rendering. */

:root{
  --ui-overflow-safe-width: 100%;
}

/* 1) Global safe sizing for application surfaces. */
html,
body,
#app,
.app,
.page,
.container,
.spa-page,
.spa-page-content,
.msng-page-content,
.news-page,
.parts-page,
.masters-page,
.myorders-page,
.admin-shop-page{
  max-width: var(--ui-overflow-safe-width);
  box-sizing: border-box;
}

*,
*::before,
*::after{
  box-sizing: border-box;
}

/* 2) Grid/flex children must be allowed to shrink. Without min-width:0,
   long text and buttons can push cards/tools outside the viewport. */
.spa-hero-layout,
.spa-hero-main,
.spa-hero-tools,
.spa-hero-tools-card,
.spa-hero-tools-body,
.catalog-tools,
.catalog-tools__inner,
.catalog-tools__actions,
.catalog-tools__search,
.catalog-tools__search-wrap,
.catalog-tool-btn,
.ui-card,
.mo-card,
.master-card,
.master-contact-row,
.parts-category-card,
.parts-card,
.part-card,
.msng-item,
.msng-item--v2,
.news-card,
.admin-card,
.cmodal-card,
.modal-dialog-v2,
.modal-panel-v2,
.mo-tools-sheet,
.mo-tools-sheet-card,
.news-modal-box,
.cab-pane-modal-card,
.bottom-nav,
.bnav-inner,
.nav-links,
.bnav-item{
  min-width: 0;
  max-width: 100%;
}

/* 3) Do not let tools and card action rows overflow horizontally. */
.catalog-tools__actions,
.mo-card-actions,
.ui-card__actions,
.msng-actions,
.nc-footer,
.master-card__footer,
.parts-card__actions,
.admin-card__actions{
  overflow: visible;
  min-width: 0;
  max-width: 100%;
}

.catalog-tool-btn,
.catalog-tools__search input,
.catalog-tools__search-input,
.mo-action-btn,
.msng-action-btn,
.parts-action-btn,
.master-action-btn,
.news-action-btn,
.admin-action-btn,
.btn,
.ui-btn{
  min-width: 0;
  max-width: 100%;
}

.catalog-tool-btn > *,
.mo-action-btn > *,
.msng-action-btn > *,
.parts-action-btn > *,
.master-action-btn > *,
.news-action-btn > *,
.admin-action-btn > *,
.btn > *,
.ui-btn > *{
  min-width: 0;
}

/* 4) Long titles/messages should not force overflow. */
.mo-card-title,
.mo-card h3,
.master-card__title,
.master-contact-row,
.parts-category-card h3,
.parts-category-card__title,
.msng-title,
.msng-name,
.msng-last,
.news-card h3,
.nc-title,
.admin-card h3,
.spa-hero-title,
.spa-hero-tools-title,
.spa-hero-tools-hint{
  max-width: 100%;
  overflow-wrap: anywhere;
}

.catalog-tool-btn span,
.catalog-tool-btn strong,
.bnav-item span,
.bnav-label,
.nav-links a,
.mo-action-btn span,
.msng-action-btn span,
.parts-action-btn span,
.master-action-btn span,
.news-action-btn span,
.admin-action-btn span{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 5) Decorative layers must never cover real controls. */
.spa-hero::before,
.spa-hero::after,
.spa-hero-bg,
.hero-glow,
.hero-shard,
.shards-strip,
.home-hero::before,
.home-hero::after,
.spa-hero-tools-card::before,
.spa-hero-tools-card::after{
  pointer-events: none;
}

/* 6) Normalize layering for recurring app surfaces. */
header,
.site-header,
.navbar{
  z-index: var(--z-sticky, 50);
}

#bottom-nav,
.bottom-nav{
  z-index: var(--z-bottom-nav, 80);
}

.cmodal-overlay,
.modal-overlay-v2,
.news-modal-overlay,
.cab-pane-modal-overlay,
.mo-tools-sheet-overlay,
.auth-modal-overlay{
  z-index: var(--z-modal, 300);
}

.toast,
.toast-stack,
#toast,
#toasts,
.notify-stack{
  z-index: var(--z-toast, 500);
}

/* 7) Controls inside hero/tools must stay above decorative hero layers. */
.spa-hero-tools-card,
.spa-hero-tools-body,
.catalog-tools,
.catalog-tools__actions,
.catalog-tools__search,
.catalog-tool-btn{
  position: relative;
  z-index: var(--z-base, 1);
}

/* 8) Mobile viewport safety. */
@media (max-width: 640px){
  body,
  .page,
  .container,
  .spa-page,
  .spa-page-content,
  .msng-page-content{
    overflow-x: hidden;
  }

  /* Стандарт/без вертикального режима: полная ширина */
  html:not([data-tools-actions="left"]):not([data-tools-actions="right"]) .catalog-tools__actions,
  .mo-card-actions,
  .ui-card__actions,
  .msng-actions,
  .nc-footer,
  .master-card__footer,
  .parts-card__actions,
  .admin-card__actions{
    width: 100%;
  }

  .cmodal-card,
  .modal-dialog-v2,
  .modal-panel-v2,
  .mo-tools-sheet-card,
  .news-modal-box,
  .cab-pane-modal-card,
  .auth-modal{
    max-width: calc(100vw - var(--space-4, 16px));
  }
}

/* 9) UI-r4 — vertical actions safe-area / z-index / overflow guard.
   Дополнение к vertical_actions_mobile.css: явные ограничения для rail-режима. */
@media (max-width: 640px){
  /* Рейка не должна создавать горизонтальный скролл */
  html[data-tools-actions="left"] .catalog-tools,
  html[data-tools-actions="right"] .catalog-tools{
    contain: layout style;
  }

  /* Rail и search — строго в пределах карточки */
  html[data-tools-actions="left"] .catalog-tools__actions,
  html[data-tools-actions="right"] .catalog-tools__actions{
    max-width: clamp(58px, 21vw, 74px);
    flex-shrink: 0;
  }

  /* Кнопки внутри rail не должны перекрывать bottom-nav (z-index шкала) */
  html[data-tools-actions="left"] .catalog-tool-btn,
  html[data-tools-actions="right"] .catalog-tool-btn{
    z-index: var(--z-base, 1);
  }
}

/* === SOURCE: css/state_normalization.css === */
/* KARETA r293 — unified UI states
   Contract: visual states are shared across old page-specific classes without changing JS logic. */

:root {
  --state-active-bg: color-mix(in srgb, var(--orange, #ff6b00) 12%, transparent);
  --state-active-border: color-mix(in srgb, var(--orange, #ff6b00) 42%, var(--line, rgba(148,163,184,.24)));
  --state-active-color: var(--orange, #ff6b00);
  --state-selected-bg: color-mix(in srgb, var(--orange, #ff6b00) 14%, transparent);
  --state-success-bg: color-mix(in srgb, var(--green, #22c55e) 13%, transparent);
  --state-success-border: color-mix(in srgb, var(--green, #22c55e) 40%, var(--line, rgba(148,163,184,.24)));
  --state-success-color: var(--green, #22c55e);
  --state-danger-bg: color-mix(in srgb, #ef4444 12%, transparent);
  --state-danger-border: color-mix(in srgb, #ef4444 40%, var(--line, rgba(148,163,184,.24)));
  --state-danger-color: #ef4444;
  --state-muted-opacity: .62;
  --state-disabled-opacity: .48;
  --state-focus-ring: 0 0 0 3px color-mix(in srgb, var(--orange, #ff6b00) 22%, transparent);
}

/* Base interactive state */
.ui-state-active,
.is-active,
.active:not(.page):not(.cab-pane):not(.ptbl):not(.auth-step),
[aria-current="page"],
[aria-selected="true"] {
  border-color: var(--state-active-border);
}

.ui-state-selected,
.is-selected,
.selected,
.mo-filter.active,
.parts-cat.active,
.odet-master-chip.active,
.odet-status-btn.active,
.odet-st-btn.active,
.rv-star-btn.active {
  background: var(--state-selected-bg);
  border-color: var(--state-active-border);
  color: var(--state-active-color);
}

.ui-state-current,
.is-current,
.current {
  border-color: var(--state-active-border);
  color: var(--state-active-color);
}

/* Disabled / muted */
.ui-state-disabled,
.is-disabled,
.disabled,
[disabled],
[aria-disabled="true"] {
  opacity: var(--state-disabled-opacity);
  pointer-events: none;
  cursor: not-allowed;
  filter: saturate(.72);
}

.ui-state-muted,
.is-muted,
.muted {
  opacity: var(--state-muted-opacity);
}

/* Loading */
.ui-state-loading,
.is-loading,
.loading,
[aria-busy="true"] {
  position: relative;
  pointer-events: none;
  cursor: progress;
}

.ui-state-loading::after,
.is-loading::after,
.loading::after,
[aria-busy="true"]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.07), transparent);
  animation: kareta-state-sheen 1.25s linear infinite;
  pointer-events: none;
}

@keyframes kareta-state-sheen {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

/* Empty / error blocks */
.ui-state-empty,
.is-empty,
.empty-state,
.mo-empty,
.masters-empty,
.parts-empty,
.msng-empty-cta.card,
.news-empty,
.news-empty-state {
  border-radius: var(--ui-radius-card);
  border: 1px dashed color-mix(in srgb, var(--line, rgba(148,163,184,.24)) 82%, transparent);
  background: color-mix(in srgb, var(--surface, #111827) 84%, transparent);
}

.ui-state-error,
.is-error,
.error,
.has-error {
  border-color: var(--state-danger-border) !important;
  background: var(--state-danger-bg);
  color: var(--state-danger-color);
}

/* New / unread / success */
.ui-state-new,
.is-new,
.new,
.unread,
.msng-item--unread,
.notif-item.unread {
  border-color: var(--state-active-border);
  background: color-mix(in srgb, var(--orange, #ff6b00) 7%, var(--surface, #111827));
}

.ui-state-done,
.is-done,
.done,
.success,
.is-success {
  border-color: var(--state-success-border);
  color: var(--state-success-color);
}

.ui-state-danger,
.is-danger,
.danger,
.btn-danger {
  border-color: var(--state-danger-border);
  color: var(--state-danger-color);
}

/* Focus: visible only for keyboard/navigation, not noisy after mouse/touch. */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.catalog-tool-btn:focus-visible,
.mo-action-btn:focus-visible,
.msng-action-btn:focus-visible {
  outline: 0;
  box-shadow: var(--state-focus-ring);
}

/* Keep active navigation stable: state must not change element size. */
.nav-link.active,
.bnav-item.active,
.drawer-link.active,
.cab-tab.active,
.ptab.active,
.mprof-tab.active {
  min-width: 0;
  transform: none;
}

/* Timeline/status compatibility */
.mo-tl-dot.done,
.odet-tl-item.done .odet-tl-dot,
.owiz-step.done .owiz-step-dot {
  border-color: var(--state-success-border);
  background: var(--state-success-bg);
}

.mo-status-badge.done,
.hist-badge.done,
.odet-tl-item.done .odet-tl-label,
.owiz-step.done .owiz-step-label {
  color: var(--state-success-color);
}

@media (prefers-reduced-motion: reduce) {
  .ui-state-loading::after,
  .is-loading::after,
  .loading::after,
  [aria-busy="true"]::after {
    animation: none;
  }
}

/* === SOURCE: css/navigation_normalization.css === */
/* KARETA.KZ — r294 navigation/header/bottom-nav normalization
   Scope: navigation surfaces only. No route or JS behavior changes. */

:root{
  --ui-nav-h: var(--nav-h, 64px);
  --ui-bottom-nav-h: var(--bottom-nav-h, var(--bnav-h, 68px));
  --ui-nav-item-h: 40px;
  --ui-bnav-item-h: 54px;
  --ui-nav-gap: var(--space-2, 8px);
  --ui-nav-icon: var(--ui-icon-lg, 22px);
}

/* Desktop header/nav must be a structural shell, not a second card layer. */
#nav,
.site-header{
  z-index: var(--z-sticky, 50);
  max-width: 100%;
  overflow: visible;
  box-sizing: border-box;
}

.nav-inner,
.nav-links,
.nav-right,
.nav-logo{
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.nav-inner{
  gap: var(--space-4, 16px);
}

.nav-links{
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  min-width: 0;
  overflow: hidden;
}

.nav-link,
.nav-auth-btn,
.burger{
  min-height: var(--ui-nav-item-h, 40px);
  border-radius: var(--ui-radius-btn, 10px);
  box-sizing: border-box;
}

.nav-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2, 8px);
  max-width: 190px;
  min-width: 0;
  padding: 0 var(--space-3, 12px);
  font-size: var(--ui-text-sm, 13px);
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nav-link:hover,
.nav-link.active{
  transform: none !important;
}

.nav-link.active{
  background: var(--ui-surface-soft, rgba(255,107,0,.08));
}

.nav-link.active::after{
  left: var(--space-3, 12px);
  right: var(--space-3, 12px);
  bottom: 4px;
  height: 2px;
  border-radius: var(--ui-radius-pill, 999px);
}

.nav-logo{
  overflow: hidden;
}

.nav-logo-text,
.nav-logo-page,
.nav-phone{
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nav-auth-btn{
  min-width: 0;
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: none !important;
}

/* Mobile bottom nav: one standard, no scaling layout shift. */
#bottom-nav{
  z-index: var(--z-bottom-nav, 80);
  height: calc(var(--ui-bottom-nav-h, 68px) + env(safe-area-inset-bottom, 0px));
  padding: 0 var(--space-1, 4px) env(safe-area-inset-bottom, 0px);
  box-sizing: border-box;
  max-width: 100%;
  overflow: visible;
}

#bottom-nav .bnav-inner,
.bnav-inner{
  height: var(--ui-bottom-nav-h, 68px);
  display: flex;
  align-items: stretch;
  gap: var(--space-1, 4px);
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.bnav-item{
  flex: 1 1 0;
  min-width: 0;
  min-height: var(--ui-bnav-item-h, 54px);
  max-width: 100%;
  margin: var(--space-1, 4px) 0;
  padding: var(--space-1, 4px);
  border-radius: var(--ui-radius-btn, 10px);
  box-sizing: border-box;
  display: grid;
  grid-template-rows: 26px 1fr;
  place-items: center;
  gap: 2px;
  overflow: hidden;
  transform: none !important;
  transition: background-color .15s var(--ease, ease), color .15s var(--ease, ease), border-color .15s var(--ease, ease);
}

.bnav-item:hover,
.bnav-item:active,
.bnav-item.active{
  transform: none !important;
}

.bnav-item:active{
  background: var(--ui-surface-soft, rgba(255,107,0,.08));
}

.bnav-item.active{
  background: rgba(255,107,0,.12);
  color: var(--orange);
}

.bnav-icon-wrap{
  width: 26px;
  height: 26px;
  min-width: 26px;
  max-width: 26px;
  display: grid;
  place-items: center;
  position: relative;
  color: inherit;
}

.bnav-icon{
  font-size: var(--ui-nav-icon, 22px);
  line-height: 1;
  transform: none !important;
  transition: color .15s var(--ease, ease);
}

.bnav-item.active .bnav-icon,
.bnav-item:active .bnav-icon{
  transform: none !important;
}

.bnav-item.active .bnav-icon-wrap::after{
  display: none !important;
}

.bnav-label,
.bnav-lbl{
  width: 100%;
  min-width: 0;
  max-width: 100%;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: .1px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
}

.bnav-badge{
  top: -5px;
  right: -8px;
  z-index: 2;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: var(--ui-radius-pill, 999px);
  box-sizing: border-box;
  pointer-events: none;
}

/* Client role may contain more items. Keep it scrollable, but keep every item same size. */
@media (max-width: 640px){
  #bottom-nav[data-role="client"] .bnav-inner[data-count="6"],
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"]{
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  #bottom-nav[data-role="client"] .bnav-inner[data-count="6"]::-webkit-scrollbar,
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"]::-webkit-scrollbar{display:none;}

  #bottom-nav[data-role="client"] .bnav-inner[data-count="6"] .bnav-item,
  #bottom-nav[data-role="client"] .bnav-inner[data-count="7"] .bnav-item{
    flex: 0 0 64px;
    width: 64px;
    scroll-snap-align: start;
  }
}

/* Header must not fight bottom nav on small screens. */
@media (max-width: 900px){
  .nav-links,
  .nav-phone{
    display: none !important;
  }
  #bottom-nav{
    display: flex;
  }
  #app{
    padding-bottom: calc(var(--ui-bottom-nav-h, 68px) + env(safe-area-inset-bottom, 0px));
  }
}

@media (min-width: 901px){
  #bottom-nav{
    display: none !important;
  }
  .nav-links{
    display: flex;
  }
}

/* Accessibility: same focus ring as buttons, no layout jump. */
.nav-link:focus-visible,
.nav-auth-btn:focus-visible,
.burger:focus-visible,
.bnav-item:focus-visible{
  outline: 2px solid var(--orange, #ff6b00);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(255,107,0,.16);
}

/* === SOURCE: css/form_normalization.css === */
/* KARETA.KZ r295 — forms / inputs normalization
   Contract: all inputs, selects, textareas, search fields and form groups follow UI_STANDARD_KARETA.md.
   This layer is visual only; it does not change submit/search/API logic. */

:root{
  --form-control-h: var(--ui-input-h, 44px);
  --form-control-radius: var(--ui-radius-field, 10px);
  --form-control-pad-x: var(--space-3, 12px);
  --form-control-gap: var(--space-2, 8px);
  --form-label-size: 13px;
  --form-help-size: 12px;
  --form-border: var(--ui-border, rgba(15,23,42,.12));
  --form-border-focus: color-mix(in srgb, var(--accent, #f97316) 54%, var(--form-border));
  --form-ring: 0 0 0 3px color-mix(in srgb, var(--accent, #f97316) 16%, transparent);
}

/* Base form control contract. */
.ui-input,
.ui-select,
.ui-textarea,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
select,
textarea,
.bform-input,
.bform-select,
.bform-textarea,
.pf-input,
.pf-search-input,
.parts-search-input,
.mo-search-input,
.admin-search,
.chat-input,
.msng-textarea,
.owiz-input,
.k-select,
.k-textarea,
.nac-textarea,
.order-status-sel,
.news-compose-field input,
.news-compose-field select,
.news-compose-field textarea{
  box-sizing: border-box !important;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: var(--form-control-h) !important;
  border-radius: var(--form-control-radius) !important;
  border: 1px solid var(--form-border) !important;
  background: var(--ui-surface, var(--surface, #fff)) !important;
  color: var(--text, var(--text1, #111827)) !important;
  font: inherit;
  font-size: max(16px, var(--ui-text-md, 15px));
  line-height: 1.35;
  padding: 0 var(--form-control-pad-x);
  outline: none;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

textarea,
.ui-textarea,
.bform-textarea,
.pf-input:is(textarea),
.msng-textarea,
.owiz-input:is(textarea),
.k-textarea,
.nac-textarea,
.news-compose-field textarea{
  min-height: 88px !important;
  padding-top: var(--space-3, 12px);
  padding-bottom: var(--space-3, 12px);
  resize: vertical;
  overflow: auto;
}

select,
.ui-select,
.bform-select,
.k-select,
.order-status-sel{
  cursor: pointer;
  padding-right: 36px;
}

input::placeholder,
textarea::placeholder,
.ui-input::placeholder,
.ui-textarea::placeholder,
.bform-input::placeholder,
.bform-textarea::placeholder,
.pf-search-input::placeholder,
.parts-search-input::placeholder,
.mo-search-input::placeholder,
.admin-search::placeholder,
.chat-input::placeholder,
.msng-textarea::placeholder{
  color: var(--text3, #94a3b8) !important;
  opacity: 1;
}

input:focus,
select:focus,
textarea:focus,
.ui-input:focus,
.ui-select:focus,
.ui-textarea:focus,
.bform-input:focus,
.bform-select:focus,
.bform-textarea:focus,
.pf-input:focus,
.pf-search-input:focus,
.parts-search-input:focus,
.mo-search-input:focus,
.admin-search:focus,
.chat-input:focus,
.msng-textarea:focus,
.owiz-input:focus,
.k-select:focus,
.k-textarea:focus,
.nac-textarea:focus{
  border-color: var(--form-border-focus) !important;
  box-shadow: var(--form-ring) !important;
}

input[disabled],
select[disabled],
textarea[disabled],
.ui-input.is-disabled,
.ui-select.is-disabled,
.ui-textarea.is-disabled{
  opacity: .58;
  cursor: not-allowed;
  background: var(--ui-surface-2, #f6f8fb) !important;
}

/* File inputs are controls, but should not be forced into text-field geometry. */
input[type="file"]{
  max-width: 100%;
  color: var(--text2, #475569);
  font: inherit;
  font-size: 14px;
}

input[type="checkbox"],
input[type="radio"]{
  accent-color: var(--accent, var(--orange, #f97316));
}

/* Form grouping contract. */
.ui-field,
.form-field,
.bform-group,
.owiz-field,
.news-compose-field,
.pof-field,
.nac-field,
.admin-field,
.settings-field{
  display: grid;
  gap: var(--form-control-gap);
  min-width: 0;
  max-width: 100%;
}

.ui-field label,
.form-field label,
.bform-group label,
.owiz-field label,
.news-compose-field label,
.pof-field label,
.nac-field label,
.admin-field label,
.settings-field label{
  color: var(--text2, #475569);
  font-size: var(--form-label-size);
  font-weight: 800;
  line-height: 1.25;
}

.ui-help,
.form-help,
.field-help,
.bform-hint,
.owiz-hint{
  color: var(--text3, #94a3b8);
  font-size: var(--form-help-size);
  line-height: 1.35;
}

.ui-error,
.form-error,
.field-error,
.input-error-msg{
  color: var(--danger, #ef4444);
  font-size: var(--form-help-size);
  font-weight: 700;
  line-height: 1.35;
}

.input-error,
.is-error input,
.is-error select,
.is-error textarea,
input.is-error,
select.is-error,
textarea.is-error{
  border-color: var(--danger, #ef4444) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #ef4444) 14%, transparent) !important;
}

/* Search rows must not overflow the hero/tools cards. */
.catalog-tools__search,
.mo-search-action,
.mo-search-panel,
.news-toolbar__search,
.parts-search-wrap,
.msng-composer,
.msng-input-row{
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.mo-search-panel{
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
}

.mo-search-panel .mo-search-input{
  flex: 1 1 auto;
  width: 100%;
}

.mo-search-panel .mo-search-clear,
.mo-search-panel .mo-search-submit{
  flex: 0 0 auto;
}

.msng-textarea,
.chat-input{
  width: 100%;
}

/* Admin forms often sit in flex rows; allow them to shrink instead of forcing horizontal scroll. */
.admin-search,
.order-status-sel,
.admin-field input,
.admin-field select,
.admin-field textarea{
  min-width: 0 !important;
}

/* Mobile safety: no accidental browser zoom, no clipped controls. */
@media (max-width: 640px){
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
  select,
  textarea,
  .bform-input,
  .bform-select,
  .bform-textarea,
  .pf-input,
  .pf-search-input,
  .parts-search-input,
  .mo-search-input,
  .admin-search,
  .chat-input,
  .msng-textarea,
  .owiz-input{
    font-size: 16px !important;
    min-height: var(--ui-touch-target, 44px) !important;
  }

  .mo-search-panel{
    gap: var(--space-2, 8px);
  }

  textarea,
  .msng-textarea,
  .bform-textarea,
  .owiz-input:is(textarea){
    min-height: 96px !important;
  }
}

/* === SOURCE: css/vertical_actions_desktop.css === */
/* UI-r2 — desktop vertical actions for unified spa hero tools.
   Scope: only catalog-tools__actions inside spa-hero-tools-card on desktop.
   Mobile/tablet remains unchanged for UI-r3. */
@media (min-width: 1024px){
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display: grid !important;
    grid-template-columns: minmax(132px, 164px) minmax(0, 1fr) !important;
    grid-template-areas: "actions search" !important;
    gap: 12px !important;
    align-items: start !important;
    justify-content: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions{
    grid-area: actions !important;
    align-self: start !important;
    justify-self: start !important;
    width: min(164px, 100%) !important;
    min-width: 0 !important;
    max-width: 164px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-rows: minmax(42px, auto) !important;
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area: search !important;
    align-self: start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 42px !important;
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: 7px !important;
    align-items: center !important;
    justify-content: stretch !important;
    padding: 7px 8px !important;
    text-align: left !important;
    overflow: hidden !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn__ico,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn__ico{
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    border-radius: var(--ui-radius-sm, 5px) !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn b{
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 11.5px !important;
    line-height: 1.05 !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-action,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (min-width: 1440px){
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    grid-template-columns: minmax(150px, 184px) minmax(0, 1fr) !important;
  }
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions{
    width: min(184px, 100%) !important;
    max-width: 184px !important;
  }
}

/* === SOURCE: css/vertical_actions_mobile.css === */
/* UI-r3 — mobile configurable vertical actions for unified catalog tools.
   Scope: phones only. Desktop UI-r2 and tablet standard layout are not changed.
   Modes are controlled by html[data-tools-actions="standard|left|right"]. */
@media (max-width: 640px){
  /* standard — явно flex-column: гарантирует возврат из left/right при переключении настройки */
  html[data-tools-actions="standard"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"],
  html:not([data-tools-actions]) .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
    display: flex !important;
    flex-direction: column !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"],
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
    --tools-mobile-rail-w: clamp(58px, 21vw, 74px);
    --tools-mobile-gap: 8px;
    display: grid !important;
    grid-template-rows: auto !important;
    gap: var(--tools-mobile-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
    align-items: start !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
    grid-template-columns: var(--tools-mobile-rail-w) minmax(0, 1fr) !important;
    grid-template-areas: "actions search" !important;
  }

  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"]{
    grid-template-columns: minmax(0, 1fr) var(--tools-mobile-rail-w) !important;
    grid-template-areas: "search actions" !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__inner{
    display: contents !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tools__actions,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tools__actions{
    grid-area: actions !important;
    width: var(--tools-mobile-rail-w) !important;
    min-width: 0 !important;
    max-width: var(--tools-mobile-rail-w) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-rows: minmax(44px, auto) !important;
    gap: 6px !important;
    align-self: start !important;
    justify-self: stretch !important;
    overflow: visible !important;
    z-index: var(--z-base, 1) !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--messages .catalog-tool-btn,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"].catalog-tools--news .catalog-tool-btn{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 24px auto !important;
    gap: 3px !important;
    place-items: center !important;
    padding: 5px 4px !important;
    text-align: center !important;
    overflow: hidden !important;
    border-radius: var(--ui-radius-btn, 10px) !important;
    box-sizing: border-box !important;
    touch-action: manipulation !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn__ico{
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    font-size: 13px !important;
    border-radius: var(--ui-radius-sm, 5px) !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tool-btn b{
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 9.8px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__search{
    grid-area: search !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    align-self: start !important;
    overflow: visible !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-action,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden],
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-action,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel[hidden]{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .mo-search-panel{
    min-height: 44px !important;
    padding: 5px !important;
    grid-template-columns: minmax(0,1fr) 44px !important;
  }

  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card{
    overflow: visible !important;
  }
}

/* === SOURCE: css/mobile_container_flatten.css === */
/* UI-r8 — mobile container flatten / shell density guard
   Scope: mobile route containers and nested visual shells only.
   Goal: reduce "block inside block" effect: fewer duplicated backgrounds,
   borders, shadows and paddings on phones. No JS/API/business logic changes. */

@media (max-width: 640px){
  :root{
    --ui-mobile-page-x: 10px;
    --ui-mobile-route-gap: 10px;
    --ui-mobile-card-pad: 12px;
    --ui-mobile-card-gap: 8px;
    --ui-mobile-tools-pad: 10px;
  }

  html,
  body,
  #app,
  .page,
  .spa-page,
  .masters-page-shell,
  .parts-page-shell,
  .messages-page-shell,
  .myorders-page-shell,
  .admin-page-shell,
  .news-page{
    max-width: 100%;
    overflow-x: hidden;
  }

  /* Page containers: один внешний горизонтальный отступ, без накопления 12+14+16px. */
  .container,
  .page-container,
  .spa-page-hero .container,
  .spa-content > .container,
  .masters-content > .container,
  .container.msng-page-content,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container,
  .cabinet-page .container,
  .legal-page .container{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-left: var(--ui-mobile-page-x) !important;
    padding-right: var(--ui-mobile-page-x) !important;
    box-sizing: border-box !important;
  }

  .spa-content > .container,
  .masters-content > .container,
  .container.msng-page-content,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container,
  .cabinet-page .container,
  .legal-page .container{
    gap: var(--ui-mobile-route-gap) !important;
  }

  /* Structural wrappers: только раскладка. Никакой второй/третьей подложки. */
  .spa-page-hero--with-tools .spa-hero-layout,
  .spa-page-hero--with-tools .spa-hero-tools,
  .spa-page-hero--with-tools .spa-hero-tools-body,
  .spa-page-hero--with-tools .catalog-tools,
  .spa-page-hero--with-tools .catalog-tools__inner,
  .spa-page-hero--with-tools .catalog-tools__filters,
  .spa-page-hero--with-tools .catalog-tools__search,
  .spa-page-hero--with-tools .catalog-tools__search-wrap,
  .spa-page-hero--with-tools .mo-search-action{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    transform: none !important;
  }

  /* Единственный визуальный слой tools на телефоне. */
  .spa-page-hero--with-tools{
    padding-block: 10px !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card{
    padding: var(--ui-mobile-tools-pad) !important;
    border-radius: var(--ui-radius-card, 18px) !important;
    overflow: visible !important;
  }

  .spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"]{
    gap: var(--ui-mobile-card-gap) !important;
  }

  /* List/card density: карточка остаётся карточкой, но без раздутой внутренней пустоты. */
  .mo-card.card,
  .master-card,
  .master-contact-row.reveal.in,
  .parts-category-card,
  .parts-card,
  .part-card,
  .msng-item.msng-item--v2,
  .news-card,
  .admin-card,
  .schedule-card,
  .cmodal-card,
  .modal-panel-v2,
  .modal-dialog-v2,
  .mo-tools-sheet-card,
  .news-modal-box,
  .cab-pane-modal-card{
    padding: var(--ui-mobile-card-pad) !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Nested card/surface inside another visual card: убрать вторую обложку.
     Контент остаётся, но фон/бордер/тень/большой padding не удваиваются. */
  .ui-card > .ui-card,
  .ui-card > .card,
  .card > .card,
  .card > .surface-card,
  .surface-card > .surface-card,
  .mo-card.card > .card,
  .mo-card.card > .surface-card,
  .master-card > .card,
  .master-card > .surface-card,
  .msng-item.msng-item--v2 > .card,
  .msng-item.msng-item--v2 > .surface-card,
  .cmodal-card > .card,
  .cmodal-card > .surface-card,
  .modal-panel-v2 > .card,
  .modal-dialog-v2 > .card{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: inherit !important;
  }

  /* Внутренние rows/head/body/actions — структурные, не дополнительные карточки. */
  .mo-card-head,
  .mo-card-body,
  .mo-card-actions,
  .mo-timeline,
  .msng-item-main,
  .msng-item-body,
  .master-card__body,
  .master-card__footer,
  .parts-category-card__body,
  .parts-card__actions,
  .nc-body,
  .nc-footer,
  .admin-card__body,
  .admin-card__actions,
  .cmodal-body,
  .cmodal-actions{
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .mo-card-actions,
  .ui-card__actions,
  .master-card__footer,
  .parts-card__actions,
  .nc-footer,
  .admin-card__actions,
  .cmodal-actions{
    gap: 6px !important;
    padding-top: 8px !important;
    margin-top: 8px !important;
  }

  /* Старые декоративные нижние линии в карточках дают ощущение ещё одной подложки. */
  .msng-item.msng-item--v2::after,
  .master-card::after,
  .mo-card.card::after,
  .parts-category-card::after,
  .hcat-card::after,
  .legal-info-card::after,
  .legal-rich-stat::after,
  .cab-tab::after,
  .mprof-tab::after{
    display: none !important;
  }

  /* Sticky/route tools old shells: если старый блок ещё встречается — компактный слой, не карточка в карточке. */
  .page-sticky-tools,
  .masters-sticky-tools,
  .msng-sticky-tools,
  .myorders-sticky-tools,
  .parts-sticky-tools{
    padding: 6px !important;
    margin: 6px 0 10px !important;
    box-shadow: 0 6px 18px rgba(15,23,42,.06) !important;
  }

  /* Безопасность текста/кнопок: длинный текст не растягивает контейнер. */
  .mo-card *,
  .master-card *,
  .parts-category-card *,
  .msng-item *,
  .news-card *,
  .admin-card *,
  .cmodal-card *{
    min-width: 0;
  }
}

/* === SOURCE: css/action_bar_guard.css === */
/* UI-r9: unified action-bar guard for cards and modal action rows.
   Scope: layout/density only. No business logic, no route/API changes. */
:root{
  --ui-action-bar-gap: var(--space-2, 8px);
  --ui-action-bar-pad: var(--space-2, 8px);
  --ui-action-bar-btn-min: var(--ui-btn-h-md, 44px);
}

.ui-action-bar,
.mo-card-actions,
.part-card-v2-actions,
.part-details-actions,
.cmodal-actions,
.mx-actions,
.mx-actions--core,
.mx-row-actions,
.mx-process-actions,
.msng-chat-hd-actions,
.msng-quick-actions,
.msng-loyalty-actions,
.msng-media-viewer__actions,
.msng-attach-preview-actions,
.admin-quick-actions,
.admin-master-card-actions,
.admin-card__actions,
.nc-footer,
.master-card__footer{
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  width:100%;
  display:flex;
  align-items:center;
  gap:var(--ui-action-bar-gap);
  flex-wrap:wrap;
  overflow:visible;
}

.ui-action-bar > *,
.mo-card-actions > *,
.part-card-v2-actions > *,
.part-details-actions > *,
.cmodal-actions > *,
.mx-actions > *,
.mx-actions--core > *,
.mx-row-actions > *,
.mx-process-actions > *,
.msng-chat-hd-actions > *,
.msng-quick-actions > *,
.msng-loyalty-actions > *,
.msng-media-viewer__actions > *,
.msng-attach-preview-actions > *,
.admin-master-card-actions > *,
.admin-card__actions > *,
.nc-footer > *,
.master-card__footer > *{
  min-width:0;
  max-width:100%;
}

.ui-action-bar .btn,
.ui-action-bar button,
.ui-action-bar a,
.mo-card-actions .btn,
.mo-card-actions button,
.mo-card-actions a,
.part-card-v2-actions .btn,
.part-card-v2-actions button,
.part-card-v2-actions a,
.part-details-actions .btn,
.part-details-actions button,
.part-details-actions a,
.cmodal-actions .btn,
.cmodal-actions button,
.cmodal-actions a,
.mx-actions .btn,
.mx-actions button,
.mx-actions a,
.mx-actions--core .btn,
.mx-actions--core button,
.mx-actions--core a,
.mx-row-actions .btn,
.mx-row-actions button,
.mx-row-actions a,
.mx-process-actions .btn,
.mx-process-actions button,
.mx-process-actions a,
.msng-chat-hd-actions .btn,
.msng-chat-hd-actions button,
.msng-chat-hd-actions a,
.msng-quick-actions .btn,
.msng-quick-actions button,
.msng-quick-actions a,
.msng-loyalty-actions .btn,
.msng-loyalty-actions button,
.msng-loyalty-actions a,
.msng-media-viewer__actions .btn,
.msng-media-viewer__actions button,
.msng-media-viewer__actions a,
.msng-attach-preview-actions .btn,
.msng-attach-preview-actions button,
.msng-attach-preview-actions a,
.admin-master-card-actions .btn,
.admin-master-card-actions button,
.admin-master-card-actions a,
.admin-card__actions .btn,
.admin-card__actions button,
.admin-card__actions a,
.nc-footer .btn,
.nc-footer button,
.nc-footer a,
.master-card__footer .btn,
.master-card__footer button,
.master-card__footer a{
  box-sizing:border-box;
  min-width:0;
  min-height:var(--ui-action-bar-btn-min);
  max-width:100%;
  border-radius:var(--ui-radius-btn, 10px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Modal action rows: one visual modal card, action bar stays structural. */
.cmodal-actions,
.msng-media-viewer__actions,
.msng-attach-preview-actions{
  justify-content:flex-end;
  padding-top:var(--space-2, 8px);
}

/* Card actions: no extra surface. */
.mo-card-actions,
.part-card-v2-actions,
.part-details-actions,
.admin-master-card-actions,
.master-card__footer,
.nc-footer{
  background:transparent;
  border:0;
  box-shadow:none;
}

/* Master exchange rows had historical min-width values; keep them responsive. */
.mx-row-actions,
.mx-row-actions.mx-actions--core,
.mx-card .mx-actions--core,
.mx-row .mx-actions--core{
  min-width:0 !important;
  width:100%;
}

@media (max-width:640px){
  .ui-action-bar,
  .mo-card-actions,
  .part-card-v2-actions,
  .part-details-actions,
  .cmodal-actions,
  .mx-actions,
  .mx-actions--core,
  .mx-row-actions,
  .mx-process-actions,
  .msng-quick-actions,
  .msng-loyalty-actions,
  .msng-media-viewer__actions,
  .msng-attach-preview-actions,
  .admin-master-card-actions,
  .admin-card__actions,
  .nc-footer,
  .master-card__footer{
    gap:var(--space-2, 8px);
    align-items:stretch;
  }

  .mo-card-actions .btn,
  .mo-card-actions button,
  .mo-card-actions a,
  .part-card-v2-actions .btn,
  .part-card-v2-actions button,
  .part-card-v2-actions a,
  .part-details-actions .btn,
  .part-details-actions button,
  .part-details-actions a,
  .cmodal-actions .btn,
  .cmodal-actions button,
  .cmodal-actions a,
  .mx-actions .btn,
  .mx-actions button,
  .mx-actions a,
  .mx-actions--core .btn,
  .mx-actions--core button,
  .mx-actions--core a,
  .mx-row-actions .btn,
  .mx-row-actions button,
  .mx-row-actions a,
  .mx-process-actions .btn,
  .mx-process-actions button,
  .mx-process-actions a,
  .msng-quick-actions .btn,
  .msng-quick-actions button,
  .msng-quick-actions a,
  .msng-loyalty-actions .btn,
  .msng-loyalty-actions button,
  .msng-loyalty-actions a,
  .msng-media-viewer__actions .btn,
  .msng-media-viewer__actions button,
  .msng-media-viewer__actions a,
  .msng-attach-preview-actions .btn,
  .msng-attach-preview-actions button,
  .msng-attach-preview-actions a,
  .admin-master-card-actions .btn,
  .admin-master-card-actions button,
  .admin-master-card-actions a,
  .admin-card__actions .btn,
  .admin-card__actions button,
  .admin-card__actions a,
  .nc-footer .btn,
  .nc-footer button,
  .nc-footer a,
  .master-card__footer .btn,
  .master-card__footer button,
  .master-card__footer a{
    flex:1 1 calc(50% - var(--space-2, 8px));
    width:auto;
    min-width:0 !important;
    justify-content:center;
    font-size:clamp(12px, 3.25vw, 14px);
    padding-inline:var(--space-2, 8px);
  }

  .cmodal-actions .btn,
  .cmodal-actions button,
  .cmodal-actions a,
  .part-details-actions .btn,
  .part-details-actions button,
  .part-details-actions a,
  .msng-media-viewer__actions .btn,
  .msng-media-viewer__actions button,
  .msng-media-viewer__actions a{
    flex-basis:100%;
  }

  .msng-chat-hd-actions{
    width:auto;
    flex:0 0 auto;
    gap:var(--space-1, 4px);
  }

  .msng-chat-hd-actions .btn,
  .msng-chat-hd-actions button,
  .msng-chat-hd-actions a{
    flex:0 0 var(--ui-touch-target, 44px);
    width:var(--ui-touch-target, 44px);
    min-width:var(--ui-touch-target, 44px) !important;
    padding-inline:0;
  }

  .admin-quick-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:var(--space-2, 8px);
    min-width:0;
    max-width:100%;
  }

  .admin-quick-actions > *{
    min-width:0;
    max-width:100%;
  }
}

@media (max-width:380px){
  .mo-card-actions .btn,
  .mo-card-actions button,
  .mo-card-actions a,
  .part-card-v2-actions .btn,
  .part-card-v2-actions button,
  .part-card-v2-actions a,
  .mx-actions .btn,
  .mx-actions button,
  .mx-actions a,
  .mx-actions--core .btn,
  .mx-actions--core button,
  .mx-actions--core a,
  .mx-row-actions .btn,
  .mx-row-actions button,
  .mx-row-actions a,
  .admin-master-card-actions .btn,
  .admin-master-card-actions button,
  .admin-master-card-actions a,
  .admin-card__actions .btn,
  .admin-card__actions button,
  .admin-card__actions a,
  .nc-footer .btn,
  .nc-footer button,
  .nc-footer a,
  .master-card__footer .btn,
  .master-card__footer button,
  .master-card__footer a{
    flex-basis:100%;
  }
}

/* === SOURCE: css/mobile_decoration_flatten_hard.css === */
/* UI-r10a — mobile decoration flatten hard guard
   Scope: mobile-only visual shell cleanup.
   Goal: remove duplicated container backgrounds/borders/shadows/paddings around hero/tools
   without changing JS/API/business logic. */

@media (max-width: 640px){
  :root{
    --ui-mobile-page-x: 8px;
    --ui-mobile-route-gap: 8px;
    --ui-mobile-card-pad: 10px;
    --ui-mobile-tools-pad: 0px;
  }

  /* Main requested fix: hero with tools must not be a decorated wrapper on phones. */
  .spa-page-hero.spa-page-hero--with-tools{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    border-radius: 0 !important;
    padding: 4px 0 6px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .spa-page-hero.spa-page-hero--with-tools::before,
  .spa-page-hero.spa-page-hero--with-tools::after{
    display: none !important;
    content: none !important;
  }

  /* Hero/tools internal wrappers are structural only on mobile. */
  .spa-page-hero--with-tools > .container,
  .spa-page-hero--with-tools .spa-hero-layout,
  .spa-page-hero--with-tools .spa-hero-tools,
  .spa-page-hero--with-tools .spa-hero-tools-card,
  .spa-page-hero--with-tools .spa-hero-tools-body,
  .spa-page-hero--with-tools .catalog-tools,
  .spa-page-hero--with-tools .catalog-tools__inner,
  .spa-page-hero--with-tools .catalog-tools__actions,
  .spa-page-hero--with-tools .catalog-tools__search,
  .spa-page-hero--with-tools .catalog-tools__search-wrap,
  .spa-page-hero--with-tools .mo-search-action,
  .spa-page-hero--with-tools .mo-search-panel{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    transform: none !important;
  }

  /* Do not let route containers become card-like wrappers. */
  .container.msng-page-content,
  .spa-content > .container,
  .masters-content > .container,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    border-radius: 0 !important;
    padding-left: var(--ui-mobile-page-x) !important;
    padding-right: var(--ui-mobile-page-x) !important;
  }

  /* Compact spacing: no 10-layer vertical air around tools. */
  .spa-page-hero--with-tools .spa-hero-tools-card{
    display: block !important;
    gap: 0 !important;
  }

  .spa-page-hero--with-tools .catalog-tools[data-catalog-render="unified-v2"],
  .spa-page-hero--with-tools .catalog-tools__inner{
    gap: 6px !important;
  }

  .spa-page-hero--with-tools .catalog-tools__actions{
    gap: 6px !important;
  }

  .spa-page-hero--with-tools .catalog-tools__search{
    gap: 6px !important;
  }

  /* Keep real controls visible and tappable even after wrapper flattening. */
  .spa-page-hero--with-tools .catalog-tool-btn,
  .spa-page-hero--with-tools .catalog-tools__search-input,
  .spa-page-hero--with-tools .catalog-tools__search-submit,
  .spa-page-hero--with-tools .mo-search-input,
  .spa-page-hero--with-tools .mo-search-submit{
    min-height: 44px !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Nested visual shells inside route content are layout-only unless they are actual cards. */
  .page-shell,
  .route-shell,
  .content-shell,
  .section-shell,
  .section-wrap,
  .content-wrap,
  .list-wrap,
  .panel-wrap{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    padding: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Prevent accidental horizontal overflow after compacting wrappers. */
  .spa-page-hero--with-tools *,
  .container.msng-page-content *,
  .myorders-page .container *,
  .parts-page .container *,
  .masters-content > .container *,
  .news-page .container *,
  .admin-page .container *{
    min-width: 0;
  }
}

/* === SOURCE: css/mobile_tools_icon_row.css === */
/* UI-r10b: mobile catalog tool actions icon row
   Purpose: remove text labels from catalog tool buttons on phones and keep exactly three icon buttons in one compact block.
   Scope: catalog-tools__actions inside unified spa hero tools only. */

@media (max-width: 640px){
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(44px, 1fr)) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    border-radius: var(--ui-radius-btn, 10px) !important;
    overflow: hidden !important;
    text-align: center !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn b,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn strong,
  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tools__state{
    display: none !important;
  }

  .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn__ico{
    display: inline-grid !important;
    place-items: center !important;
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    font-size: 19px !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  /* In custom left/right mode keep icon-only behavior, but do not allow labels to expand the side column. */
  html[data-tools-actions="left"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions,
  html[data-tools-actions="right"] .spa-page-hero--with-tools .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"] .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions{
    grid-template-columns: 1fr !important;
    width: clamp(48px, 16vw, 56px) !important;
    max-width: clamp(48px, 16vw, 56px) !important;
  }
}

/* UI-r10d: hard guard for mobile sort button label.
   Some route/fallback renderers can place catalog-tools outside the spa-hero-tools-card scope.
   On phones the sort button must be icon-only in every catalog-tools__actions block. */
@media (max-width: 640px){
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn.catalog-tool-btn--sort > b,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn.catalog-tool-btn--sort > strong,
  .catalog-tools__actions .catalog-tool-btn.catalog-tool-btn--sort > b,
  .catalog-tools__actions .catalog-tool-btn.catalog-tool-btn--sort > strong{
    display: none !important;
  }

  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn.catalog-tool-btn--sort{
    gap: 0 !important;
    min-width: 44px !important;
  }
}

/* UI-r12a: hard guard for all mobile catalog tool labels.
   In every mobile catalog-tools__actions block the tool buttons must be icon-only.
   This covers sort, filters, settings and fallback renderers outside spa-hero-tools-card. */
@media (max-width: 640px){
  .catalog-tools__actions .catalog-tool-btn > b,
  .catalog-tools__actions .catalog-tool-btn > strong,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn > b,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn > strong,
  .spa-page-hero--with-tools .catalog-tools__actions .catalog-tool-btn > b,
  .spa-page-hero--with-tools .catalog-tools__actions .catalog-tool-btn > strong{
    display: none !important;
  }

  .catalog-tools__actions .catalog-tool-btn,
  .catalog-tools[data-catalog-render="unified-v2"] .catalog-tools__actions .catalog-tool-btn{
    gap: 0 !important;
    min-width: 44px !important;
  }
}

/* === SOURCE: css/mobile_nav_stabilization.css === */
/* UI-r12: mobile navigation/profile stabilization guard.
   Scope: bottom-nav + top client cabinet avatar only. */

@media (max-width: 640px){
  #bottom-nav,
  #bottomNavInner,
  #bottomNavInner .bnav-item{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }

  #bottomNavInner .bnav-item{
    overflow:hidden;
  }

  #bottomNavInner .bnav-label{
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .nav-userbox,
  #navAuthBtn{
    min-width:0;
    max-width:100%;
  }

  .nav-avatar.nav-avatar--cabinet{
    inline-size:44px;
    block-size:44px;
    min-inline-size:44px;
    min-block-size:44px;
    display:inline-grid;
    place-items:center;
    border-radius:var(--ui-radius-btn, 10px);
    touch-action:manipulation;
    flex:0 0 auto;
  }

  .nav-profile-menu:not(.is-open){
    pointer-events:none;
  }

  .nav-profile-menu{
    max-width:calc(100vw - 16px);
  }
}

/* === SOURCE: css/mobile_client_auth_hide.css === */
/* UI-r12c: hide top auth/profile button for authenticated client on mobile only.
   Scope: .nav-right #navAuthBtn for client role; other roles and desktop remain unchanged. */

@media (max-width: 640px){
  .nav-right #navUserbox.is-authenticated.is-client #navAuthBtn,
  .nav-right #navUserbox[data-auth-role="client"] #navAuthBtn{
    display:none !important;
  }

  .nav-right #navUserbox.is-authenticated.is-client,
  .nav-right #navUserbox[data-auth-role="client"]{
    min-width:0;
    width:0;
    max-width:0;
    overflow:hidden;
    pointer-events:none;
  }
}

/* === SOURCE: css/cabinet_tablet_r33.css === */

/* ONBOARDING-r33 — cabinet tablet/wide guards after direct onboarding profile finish.
   Scope is visual only. It does not change API, DB, role routing, or onboarding state. */

@media (min-width: 768px){
  body[data-role="client"] #profile,
  body[data-role="client"] #cabinet,
  body[data-role="client"] [data-route="cabinet"],
  body[data-role="client"] [data-route="profile"],
  body[data-role="client"] .profile-page,
  body[data-role="client"] .cabinet-page{
    max-width:min(100%, 980px);
    margin-left:auto;
    margin-right:auto;
  }

  body[data-role="master"] #master,
  body[data-role="master"] #master-cabinet,
  body[data-role="master"] [data-route*="master"],
  body[data-role="master"] .master-page,
  body[data-role="master"] .master-cabinet,
  body[data-role="master"] .mprof-page,
  body[data-role="master"] .mprof-shell{
    max-width:min(100%, 1040px);
    margin-left:auto;
    margin-right:auto;
  }

  body[data-role="sto"] #sto,
  body[data-role="sto"] #sto-dashboard,
  body[data-role="sto"] [data-route*="sto"],
  body[data-role="sto"] .sto-page,
  body[data-role="sto"] .sto-dashboard,
  body[data-role="sto"] .sto-shell{
    max-width:min(100%, 1080px);
    margin-left:auto;
    margin-right:auto;
  }

  .cabinet-page,
  .profile-page,
  .master-cabinet,
  .mprof-shell,
  .sto-dashboard,
  .sto-shell{
    padding-left:clamp(20px,4vw,44px);
    padding-right:clamp(20px,4vw,44px);
  }

  .profile-card,
  .cabinet-card,
  .mprof-card,
  .master-card,
  .sto-card,
  .admin-card{
    border-radius:22px;
  }

  .profile-grid,
  .cabinet-grid,
  .mprof-grid,
  .sto-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(16px,2.4vw,28px);
  }
}

@media (min-width: 1024px){
  body.entry-flow-active .app,
  body.entry-flow-active #app{
    overflow-x:hidden;
  }

  body[data-role="client"] #profile,
  body[data-role="client"] #cabinet,
  body[data-role="client"] [data-route="cabinet"],
  body[data-role="client"] [data-route="profile"],
  body[data-role="master"] #master,
  body[data-role="master"] #master-cabinet,
  body[data-role="master"] [data-route*="master"],
  body[data-role="sto"] #sto,
  body[data-role="sto"] #sto-dashboard,
  body[data-role="sto"] [data-route*="sto"]{
    width:min(100%, 1120px);
  }

  .profile-grid,
  .cabinet-grid,
  .mprof-grid,
  .sto-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .profile-header,
  .cabinet-header,
  .mprof-header,
  .sto-header{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) auto;
    align-items:center;
    gap:24px;
  }
}

@media (min-width: 768px) and (orientation: landscape) and (max-height: 760px){
  .cabinet-page,
  .profile-page,
  .master-cabinet,
  .mprof-shell,
  .sto-dashboard,
  .sto-shell{
    padding-top:16px;
    padding-bottom:16px;
  }

  .profile-card,
  .cabinet-card,
  .mprof-card,
  .master-card,
  .sto-card{
    min-height:0;
  }
}

@media (max-width: 767px){
  .profile-grid,
  .cabinet-grid,
  .mprof-grid,
  .sto-grid{
    display:block;
  }
}

/* === SOURCE: css/cabinet_visual_r34.css === */

/* ONBOARDING-r34 — visual polish for role cabinets after first-entry onboarding.
   Scope: visual-only guards for client/master/STO cabinets. No API/DB/onboarding routing changes. */

:root{
  --cab-r34-bg:#f7f7f8;
  --cab-r34-card:#ffffff;
  --cab-r34-line:rgba(15,23,42,.08);
  --cab-r34-shadow:0 18px 46px rgba(15,23,42,.08);
  --cab-r34-soft-shadow:0 10px 28px rgba(15,23,42,.06);
  --cab-r34-orange:#ff6a00;
}

/* Client cabinet */
.cab-hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#fff 0%,#f7f7f8 100%);
  border-bottom:1px solid rgba(15,23,42,.06);
}
.cab-hero::before{
  content:'';
  position:absolute;
  inset:-120px -80px auto auto;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,106,0,.18),rgba(255,106,0,0) 68%);
  pointer-events:none;
}
.cab-hero .container{
  position:relative;
  z-index:1;
}
.cab-profile-row{
  border:1px solid var(--cab-r34-line);
  border-radius:26px;
  background:rgba(255,255,255,.82);
  box-shadow:var(--cab-r34-shadow);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  padding:clamp(16px,2.4vw,26px);
}
.cab-avatar-wrap{
  filter:drop-shadow(0 12px 18px rgba(255,106,0,.13));
}
.cab-avatar,
.cab-avatar--photo{
  border:3px solid rgba(255,255,255,.9);
  box-shadow:0 12px 26px rgba(15,23,42,.12);
}
.cab-name{
  letter-spacing:-.045em;
}
.cab-profile-meta{
  gap:8px;
}
.cab-phone-chip,
.cab-car-chip,
.rbadge{
  min-height:30px;
  border-radius:999px!important;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.78);
  box-shadow:0 5px 14px rgba(15,23,42,.04);
}
.cab-mini-stats{
  margin-top:16px;
  gap:12px;
}
.cab-ms-item{
  border-radius:20px;
  border:1px solid var(--cab-r34-line);
  background:rgba(255,255,255,.86);
  box-shadow:var(--cab-r34-soft-shadow);
}
.cab-pane>.container{
  max-width:min(100% - 28px,1120px);
}
.profile-form-card,
.cst-card,
.loy-hero,
.loy-lvl-card,
.diag-account-card,
.hist-item,
.notif-item{
  border:1px solid var(--cab-r34-line)!important;
  border-radius:22px!important;
  background:var(--cab-r34-card)!important;
  box-shadow:var(--cab-r34-soft-shadow)!important;
}
.profile-form-card{
  padding:clamp(18px,2.4vw,28px)!important;
}
.pfc-title,
.cst-section-title{
  letter-spacing:-.035em;
}
.pf-input{
  min-height:48px;
  border-radius:16px!important;
  background:#fff!important;
}
.pf-save{
  min-height:48px;
  border-radius:16px!important;
  padding-left:22px!important;
  padding-right:22px!important;
}

/* Master cabinet */
.master-cabinet-shell{
  width:min(100%,1180px);
  margin:0 auto;
  padding:clamp(14px,2.4vw,30px);
}
.master-cabinet-hero{
  max-width:none;
  border-radius:28px;
  border:1px solid rgba(255,106,0,.14);
  background:
    radial-gradient(circle at 12% 10%,rgba(255,106,0,.20),rgba(255,106,0,0) 35%),
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,247,239,.82));
  box-shadow:0 18px 46px rgba(15,23,42,.08);
  padding:clamp(18px,2.6vw,30px);
}
.master-cabinet-hero .mch-avatar{
  width:72px;
  height:72px;
  flex-basis:72px;
  border-radius:22px;
  font-size:26px;
  background:#fff;
  color:var(--cab-r34-orange);
}
.master-cabinet-hero .mch-title{
  font-size:clamp(24px,3vw,34px);
}
.master-cabinet-hero .mch-sub{
  font-size:clamp(13px,1.5vw,16px);
}
.master-cabinet-hero .mch-stat{
  border-radius:18px;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.master-cabinet-hero .mch-actions .btn,
.master-cabinet-tile-nav .master-cabinet-tile{
  border-radius:18px!important;
}
.master-cabinet-shell__main{
  gap:clamp(16px,2.4vw,28px);
}
.master-cabinet-shell__navcol{
  min-width:0;
}
.master-cabinet-tile-nav{
  gap:12px;
}
.master-cabinet-tile-nav .master-cabinet-tile{
  box-shadow:0 8px 22px rgba(15,23,42,.055);
}
.master-cabinet-inline-panel{
  border-radius:26px;
}
.master-cabinet-inline-panel>.card,
.master-cabinet-inline-panel .card{
  border-radius:22px;
}

/* STO dashboard */
.sto-dispatch-page{
  width:min(100%,1180px);
  max-width:1180px!important;
  margin:0 auto;
  padding-left:clamp(14px,2.4vw,30px);
  padding-right:clamp(14px,2.4vw,30px);
}
.sto-dispatch-head{
  padding:clamp(18px,2.8vw,30px);
  border:1px solid rgba(255,106,0,.12);
  border-radius:28px;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,106,0,.16),rgba(255,106,0,0) 42%),
    rgba(255,255,255,.86);
  box-shadow:var(--cab-r34-shadow);
}
.sto-dispatch-title{
  font-size:clamp(26px,3.2vw,38px);
  letter-spacing:-.045em;
}
.sto-dispatch-sub{
  font-size:clamp(13px,1.4vw,16px);
}
.sto-stat-grid{
  gap:clamp(12px,1.8vw,18px);
}
.sto-stat-card{
  border-radius:22px;
  background:#fff;
  border:1px solid var(--cab-r34-line);
  box-shadow:var(--cab-r34-soft-shadow);
  padding:clamp(14px,2vw,22px);
}
.sto-stat-val{
  font-size:clamp(24px,2.8vw,34px);
}
.sto-section{
  border-radius:24px;
  background:#fff;
  box-shadow:0 10px 30px rgba(15,23,42,.055);
}
.sto-section-head{
  padding:clamp(14px,2vw,20px) clamp(16px,2.4vw,24px);
}
.sto-section-title{
  font-size:clamp(15px,1.8vw,20px);
}
.sto-order-row,
.sto-master-row{
  padding:clamp(12px,1.8vw,18px) clamp(16px,2.4vw,24px);
}
.sto-order-actions .btn,
.sto-row-btn,
.sto-master-open{
  border-radius:14px!important;
}

@media (min-width:768px){
  .cab-hero .container,
  .cab-pane>.container{
    max-width:min(100% - 48px,1120px);
  }
  .cab-profile-row{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:22px;
  }
  .cab-mini-stats--max3,
  .cab-mini-stats{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .cab-pane-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr);
  }
  .profile-form{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
  .profile-form .pf-group:nth-last-child(1),
  .profile-form > div:last-child{
    grid-column:1 / -1;
  }
  .cst-grid,
  .diag-account-grid,
  .loy-levels-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
  .master-cabinet-shell__main{
    display:grid;
    grid-template-columns:minmax(240px,300px) minmax(0,1fr);
    align-items:start;
  }
  .master-cabinet-tile-nav{
    position:sticky;
    top:18px;
  }
  .sto-order-row.sto-dispatch-row{
    display:grid;
    grid-template-columns:40px minmax(0,1fr) minmax(220px,auto);
    align-items:center;
  }
}

@media (min-width:1024px){
  .cab-hero .container,
  .cab-pane>.container{
    max-width:min(100% - 72px,1240px);
  }
  .cab-profile-row{
    padding:30px;
  }
  .cab-name{
    font-size:clamp(28px,3vw,40px);
  }
  .cab-avatar,
  .cab-avatar--photo{
    width:92px!important;
    height:92px!important;
    font-size:32px!important;
  }
  .cab-mini-stats{
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
  }
  .cst-grid,
  .diag-account-grid,
  .loy-levels-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .profile-form-card{
    max-width:980px;
    margin:0 auto;
  }
  .master-cabinet-shell__main{
    grid-template-columns:310px minmax(0,1fr);
  }
  .master-cabinet-hero .mch-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .sto-stat-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (min-width:768px) and (orientation:landscape) and (max-height:760px){
  .cab-hero .container,
  .cab-pane>.container,
  .master-cabinet-shell,
  .sto-dispatch-page{
    max-width:min(100% - 32px,1180px);
  }
  .cab-profile-row,
  .master-cabinet-hero,
  .sto-dispatch-head{
    padding:16px 18px;
    border-radius:22px;
  }
  .master-cabinet-hero .mch-avatar,
  .cab-avatar,
  .cab-avatar--photo{
    width:58px!important;
    height:58px!important;
    flex-basis:58px!important;
  }
  .master-cabinet-hero .mch-grid,
  .cab-mini-stats{
    margin-top:10px;
  }
  .master-cabinet-shell__main{
    grid-template-columns:260px minmax(0,1fr);
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:74px;
    padding:10px 12px!important;
  }
}

@media (max-width:767px){
  .cab-profile-row{
    border-radius:22px;
    padding:16px;
  }
  .cab-pane>.container{
    max-width:100%;
  }
  .master-cabinet-shell,
  .sto-dispatch-page{
    padding-left:12px;
    padding-right:12px;
  }
  .master-cabinet-hero,
  .sto-dispatch-head{
    border-radius:22px;
  }
}

/* === SOURCE: css/cabinet_finish_r37.css === */
/* CABINET-r37 — first pass after onboarding closeout.
   Scope: visual/tablet-only hardening for client, master and STO cabinets.
   Does not change API, DB, onboarding routes or profile save logic. */

:root{
  --cab-r37-max:1280px;
  --cab-r37-radius:24px;
  --cab-r37-line:rgba(15,23,42,.08);
  --cab-r37-shadow:0 16px 44px rgba(15,23,42,.075);
  --cab-r37-orange:#ff6a00;
  --cab-r37-bg:#f6f7f8;
}

body:not(.entry-flow-active) .cab-hero,
body:not(.entry-flow-active) .master-cabinet-shell,
body:not(.entry-flow-active) .sto-dispatch-page{
  isolation:isolate;
}

/* Client cabinet after onboarding */
body[data-role="client"] .cab-hero{
  background:
    radial-gradient(circle at 14% 0%,rgba(255,106,0,.15),rgba(255,106,0,0) 34%),
    linear-gradient(180deg,#fff 0%,#f7f7f8 100%);
}
body[data-role="client"] .cab-hero .container,
body[data-role="client"] .cab-pane>.container{
  width:min(100% - 28px,var(--cab-r37-max));
  max-width:var(--cab-r37-max);
}
body[data-role="client"] .cab-profile-row{
  align-items:center;
}
body[data-role="client"] .profile-form-card,
body[data-role="client"] .cst-card,
body[data-role="client"] .loy-hero,
body[data-role="client"] .diag-account-card{
  position:relative;
  overflow:hidden;
}
body[data-role="client"] .profile-form-card::before,
body[data-role="client"] .cst-card::before,
body[data-role="client"] .diag-account-card::before{
  content:'';
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,var(--cab-r37-orange),rgba(255,106,0,0));
  opacity:.75;
}

/* Master cabinet after onboarding */
body[data-role="master"] .master-cabinet-shell{
  width:min(100% - 28px,var(--cab-r37-max));
  max-width:var(--cab-r37-max);
}
body[data-role="master"] .master-cabinet-hero{
  position:relative;
  overflow:hidden;
}
body[data-role="master"] .master-cabinet-hero::after{
  content:'';
  position:absolute;
  right:-90px;
  top:-130px;
  width:300px;
  height:300px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,106,0,.18),rgba(255,106,0,0) 68%);
  pointer-events:none;
}
body[data-role="master"] .master-cabinet-hero>*{
  position:relative;
  z-index:1;
}
body[data-role="master"] .master-cabinet-tile-nav .master-cabinet-tile{
  text-align:left;
  justify-content:flex-start;
}
body[data-role="master"] .master-cabinet-inline-panel{
  min-width:0;
}

/* STO dashboard after onboarding */
body[data-role="sto"] .sto-dispatch-page{
  width:min(100% - 28px,var(--cab-r37-max));
  max-width:var(--cab-r37-max)!important;
}
body[data-role="sto"] .sto-dispatch-head,
body[data-role="sto"] .sto-section,
body[data-role="sto"] .sto-stat-card{
  border-color:var(--cab-r37-line);
}
body[data-role="sto"] .sto-dispatch-head-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
body[data-role="sto"] .sto-dispatch-head-actions .btn{
  border-radius:16px!important;
}

@media (min-width:768px){
  body:not(.entry-flow-active) .page{
    overflow-x:hidden;
  }
  body[data-role="client"] .cab-profile-row{
    grid-template-columns:auto minmax(0,1fr) minmax(280px,360px);
  }
  body[data-role="client"] .cab-mini-stats{
    align-self:stretch;
    margin-top:0;
  }
  body[data-role="client"] .cab-ms-item{
    min-height:74px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  body[data-role="client"] .profile-form-card{
    max-width:1040px;
  }
  body[data-role="client"] .cab-pane-modal-card{
    width:min(92vw,860px);
  }

  body[data-role="master"] .master-cabinet-shell__main{
    grid-template-columns:minmax(240px,300px) minmax(0,1fr);
  }
  body[data-role="master"] .master-cabinet-tile-nav{
    top:calc(env(safe-area-inset-top,0px) + 16px);
    max-height:calc(100dvh - 32px);
    overflow:auto;
    scrollbar-width:thin;
  }
  body[data-role="master"] .master-cabinet-inline-panel .card{
    min-width:0;
  }

  body[data-role="sto"] .sto-dispatch-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:20px;
  }
  body[data-role="sto"] .sto-stat-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  body[data-role="sto"] .sto-master-row{
    grid-template-columns:48px minmax(0,1fr) auto auto;
  }
}

@media (min-width:1024px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container,
  body[data-role="master"] .master-cabinet-shell,
  body[data-role="sto"] .sto-dispatch-page{
    width:min(100% - 72px,var(--cab-r37-max));
  }
  body[data-role="client"] .cab-profile-row,
  body[data-role="master"] .master-cabinet-hero,
  body[data-role="sto"] .sto-dispatch-head{
    border-radius:30px;
  }
  body[data-role="master"] .master-cabinet-shell__main{
    grid-template-columns:320px minmax(0,1fr);
  }
  body[data-role="master"] .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:82px;
  }
}

@media (min-width:1200px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container,
  body[data-role="master"] .master-cabinet-shell,
  body[data-role="sto"] .sto-dispatch-page{
    width:min(100% - 96px,1320px);
    max-width:1320px!important;
  }
  body[data-role="client"] .profile-form{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  body[data-role="client"] .profile-form .pf-group:nth-last-child(1),
  body[data-role="client"] .profile-form > div:last-child{
    grid-column:1 / -1;
  }
}

@media (min-width:768px) and (orientation:landscape) and (max-height:760px){
  body[data-role="client"] .cab-profile-row,
  body[data-role="master"] .master-cabinet-hero,
  body[data-role="sto"] .sto-dispatch-head{
    padding-top:14px!important;
    padding-bottom:14px!important;
  }
  body[data-role="client"] .cab-name,
  body[data-role="master"] .master-cabinet-hero .mch-title,
  body[data-role="sto"] .sto-dispatch-title{
    font-size:clamp(22px,2.4vw,30px)!important;
  }
  body[data-role="master"] .master-cabinet-shell__main{
    grid-template-columns:280px minmax(0,1fr);
  }
}

@media (max-width:767px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container,
  body[data-role="master"] .master-cabinet-shell,
  body[data-role="sto"] .sto-dispatch-page{
    width:100%;
    max-width:100%!important;
  }
  body[data-role="sto"] .sto-dispatch-head-actions{
    justify-content:stretch;
  }
  body[data-role="sto"] .sto-dispatch-head-actions .btn{
    flex:1 1 140px;
  }
}

/* === SOURCE: css/client_cabinet_r42_polish.css === */
/* CLIENT-CABINET-r42 — post-onboarding client cabinet visual/tablet polish.
   Scope: client cabinet only. No onboarding/API/DB logic changes. */

:root{
  --client-r42-max:1280px;
  --client-r42-line:rgba(15,23,42,.08);
  --client-r42-card:#fff;
  --client-r42-bg:#f6f7f8;
  --client-r42-orange:#ff6a00;
  --client-r42-shadow:0 18px 44px rgba(15,23,42,.08);
  --client-r42-soft-shadow:0 10px 26px rgba(15,23,42,.055);
}

body[data-role="client"] .cab-hero,
body[data-role="client"] .cab-pane{
  background:var(--client-r42-bg);
}

body[data-role="client"] .cab-hero .container,
body[data-role="client"] .cab-pane>.container{
  width:min(100% - 28px,var(--client-r42-max));
  max-width:var(--client-r42-max);
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

body[data-role="client"] .cab-profile-row{
  position:relative;
  overflow:hidden;
  border:1px solid var(--client-r42-line);
  background:
    radial-gradient(circle at 12% 10%, rgba(255,106,0,.18), transparent 34%),
    linear-gradient(135deg,#fff 0%,#fff7f1 48%,#fff 100%);
  border-radius:26px;
  box-shadow:var(--client-r42-shadow);
  min-width:0;
}

body[data-role="client"] .cab-profile-row::after{
  content:'';
  position:absolute;
  right:-74px;
  bottom:-96px;
  width:260px;
  height:260px;
  border-radius:999px;
  background:rgba(255,106,0,.08);
  pointer-events:none;
}

body[data-role="client"] .cab-profile-row>*{
  position:relative;
  z-index:1;
}

body[data-role="client"] .cab-profile-info,
body[data-role="client"] .cab-profile-meta,
body[data-role="client"] .cab-profile-actions,
body[data-role="client"] .cab-mini-stats,
body[data-role="client"] .cst-grid,
body[data-role="client"] .cst-orders,
body[data-role="client"] .profile-form,
body[data-role="client"] .hist-list,
body[data-role="client"] .notif-list{
  min-width:0;
}

body[data-role="client"] .cab-name{
  overflow-wrap:anywhere;
  hyphens:auto;
  color:#0f1720;
}

body[data-role="client"] .cab-profile-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}

body[data-role="client"] .cab-phone-chip,
body[data-role="client"] .cab-car-chip,
body[data-role="client"] .rbadge{
  max-width:100%;
  min-width:0;
  overflow-wrap:anywhere;
  white-space:normal;
}

body[data-role="client"] .cab-profile-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}

body[data-role="client"] .cab-profile-actions .btn,
body[data-role="client"] .cab-profile-actions .logout-btn,
body[data-role="client"] .cab-role-btn{
  min-height:42px;
  border-radius:14px;
  white-space:normal;
  overflow-wrap:anywhere;
}

body[data-role="client"] .cab-mini-stats{
  display:grid;
  gap:12px;
}

body[data-role="client"] .cab-ms-item,
body[data-role="client"] .cst-card,
body[data-role="client"] .profile-form-card,
body[data-role="client"] .hist-item,
body[data-role="client"] .notif-item,
body[data-role="client"] .loy-hero,
body[data-role="client"] .card{
  min-width:0;
}

body[data-role="client"] .cab-ms-item,
body[data-role="client"] .cst-card{
  border-radius:22px;
  border:1px solid var(--client-r42-line)!important;
  background:var(--client-r42-card)!important;
  box-shadow:var(--client-r42-soft-shadow)!important;
}

body[data-role="client"] .cst-card-val,
body[data-role="client"] .cab-ms-num,
body[data-role="client"] .loy-hero-pts{
  overflow-wrap:anywhere;
}

body[data-role="client"] .cst-order-row,
body[data-role="client"] .hist-item,
body[data-role="client"] .notif-item{
  min-width:0;
  gap:12px;
  align-items:flex-start;
}

body[data-role="client"] .cst-order-body,
body[data-role="client"] .notif-content{
  min-width:0;
}

body[data-role="client"] .cst-order-name,
body[data-role="client"] .cst-order-meta,
body[data-role="client"] .cst-order-price,
body[data-role="client"] .hist-title,
body[data-role="client"] .hist-meta,
body[data-role="client"] .hist-price,
body[data-role="client"] .notif-title,
body[data-role="client"] .notif-text,
body[data-role="client"] .notif-time{
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}

body[data-role="client"] .profile-form-card{
  border-radius:24px;
  border:1px solid var(--client-r42-line)!important;
  box-shadow:var(--client-r42-shadow)!important;
  overflow:hidden;
}

body[data-role="client"] .profile-form{
  display:grid;
  gap:14px;
}

body[data-role="client"] .pf-group,
body[data-role="client"] .pf-input,
body[data-role="client"] .push-banner{
  min-width:0;
  box-sizing:border-box;
}

body[data-role="client"] .pf-input{
  width:100%;
  min-height:48px;
  border-radius:16px!important;
  overflow-wrap:anywhere;
}

body[data-role="client"] .pf-label,
body[data-role="client"] .pfc-title,
body[data-role="client"] .push-banner-t,
body[data-role="client"] .push-banner-s{
  overflow-wrap:anywhere;
}

body[data-role="client"] .pf-save{
  min-height:48px;
  border-radius:16px;
}

body[data-role="client"] .loy-hero{
  overflow:hidden;
  border-radius:28px;
  border:1px solid var(--client-r42-line)!important;
  box-shadow:var(--client-r42-shadow)!important;
}

body[data-role="client"] .loy-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

body[data-role="client"] .loy-hero-actions .btn{
  flex:1 1 180px;
  min-height:46px;
  white-space:normal;
}

@media (max-width:767px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container{
    width:100%;
    max-width:100%;
    padding-left:12px;
    padding-right:12px;
  }

  body[data-role="client"] .cab-profile-row{
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    gap:12px;
    padding:16px;
    border-radius:22px;
  }

  body[data-role="client"] .cab-profile-actions{
    grid-column:1 / -1;
    justify-content:stretch;
  }

  body[data-role="client"] .cab-profile-actions .btn,
  body[data-role="client"] .cab-profile-actions .logout-btn,
  body[data-role="client"] .cab-role-btn{
    flex:1 1 140px;
  }

  body[data-role="client"] .cab-mini-stats,
  body[data-role="client"] .cst-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  body[data-role="client"] .cab-mini-stats--max3 .cab-ms-item:first-child{
    grid-column:1 / -1;
  }

  body[data-role="client"] .cst-order-row{
    grid-template-columns:36px minmax(0,1fr);
  }

  body[data-role="client"] .cst-order-price{
    grid-column:2;
    justify-self:start;
  }
}

@media (min-width:768px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container{
    width:min(100% - 48px,var(--client-r42-max));
  }

  body[data-role="client"] .cab-profile-row{
    display:grid;
    grid-template-columns:92px minmax(0,1fr) minmax(220px,auto);
    align-items:center;
    gap:22px;
    padding:24px;
  }

  body[data-role="client"] .cab-avatar,
  body[data-role="client"] .cab-avatar--photo{
    width:84px!important;
    height:84px!important;
    flex-basis:84px!important;
  }

  body[data-role="client"] .cab-name{
    font-size:clamp(28px,3.2vw,42px)!important;
    line-height:1.05!important;
  }

  body[data-role="client"] .cab-mini-stats,
  body[data-role="client"] .cst-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  body[data-role="client"] .cst-grid{
    gap:16px;
  }

  body[data-role="client"] .cab-pane-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:18px;
  }

  body[data-role="client"] .profile-form{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  body[data-role="client"] .profile-form > div:last-child,
  body[data-role="client"] .push-banner{
    grid-column:1 / -1;
  }

  body[data-role="client"] .pf-input{
    min-height:54px;
    font-size:16px;
  }

  body[data-role="client"] .hist-item{
    display:grid;
    grid-template-columns:10px minmax(0,1fr) auto;
  }
}

@media (min-width:1024px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container{
    width:min(100% - 72px,var(--client-r42-max));
  }

  body[data-role="client"] .cab-profile-row{
    grid-template-columns:104px minmax(0,1fr) minmax(260px,auto);
    gap:28px;
    padding:30px;
    border-radius:32px;
  }

  body[data-role="client"] .cab-avatar,
  body[data-role="client"] .cab-avatar--photo{
    width:96px!important;
    height:96px!important;
    flex-basis:96px!important;
  }

  body[data-role="client"] .cab-mini-stats,
  body[data-role="client"] .cst-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  body[data-role="client"] .cab-mini-stats--max3{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  body[data-role="client"] .profile-form-card{
    padding:28px!important;
  }

  body[data-role="client"] .profile-form{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
  }

  body[data-role="client"] .profile-form > div:last-child,
  body[data-role="client"] .push-banner{
    grid-column:1 / -1;
  }

  body[data-role="client"] .cst-orders,
  body[data-role="client"] .hist-list,
  body[data-role="client"] .notif-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }

  body[data-role="client"] .cst-empty,
  body[data-role="client"] .empty-state{
    grid-column:1 / -1;
  }
}

@media (min-width:1200px){
  body[data-role="client"] .cab-hero .container,
  body[data-role="client"] .cab-pane>.container{
    width:min(100% - 96px,var(--client-r42-max));
  }

  body[data-role="client"] .profile-form-card{
    border-radius:30px;
  }
}

@media (min-width:768px) and (orientation:landscape) and (max-height:760px){
  body[data-role="client"] .cab-profile-row{
    padding-top:16px!important;
    padding-bottom:16px!important;
  }

  body[data-role="client"] .cab-avatar,
  body[data-role="client"] .cab-avatar--photo{
    width:68px!important;
    height:68px!important;
    flex-basis:68px!important;
  }

  body[data-role="client"] .cab-name{
    font-size:clamp(23px,2.8vw,32px)!important;
  }

  body[data-role="client"] .cab-mini-stats,
  body[data-role="client"] .cst-grid{
    gap:10px;
  }

  body[data-role="client"] .cab-ms-item,
  body[data-role="client"] .cst-card{
    padding-top:12px!important;
    padding-bottom:12px!important;
  }
}

/* === SOURCE: css/ui_icons_buttons_unified_r43.css === */
/* UI-r43 — unified icon/button visual language.
   Scope: visual normalization only. Matches first onboarding screens: orange line icons, white/gray surfaces, single primary CTA. */
:root{
  --kr-ui-accent:#ff6a00;
  --kr-ui-accent-2:#ff8a2a;
  --kr-ui-text:#101821;
  --kr-ui-muted:#5e646d;
  --kr-ui-surface:#ffffff;
  --kr-ui-soft:#f5f5f6;
  --kr-ui-line:rgba(15,23,42,.10);
  --kr-ui-shadow:0 10px 26px rgba(17,24,39,.08);
  --kr-ui-radius:20px;
  --kr-ui-radius-sm:14px;
}

/* Interface icons: neutralize random colored emoji boxes without touching uploaded media. */
:where(
  .catalog-tool-btn__ico,.mo-search-ico,.services-app-card__ico,.services-app-service__ico,
  .services-app-icon,.services-app-option-ico,.services-app-confirm-ico,
  .client-cabinet-ico,.cabinet-ico,.cabinet-stat-ico,.mcab-ico,.sto-dash-ico,
  .ccab-ico,.ccab-stat-ico,.ccab-chip-ico,.onb2-role-ico,
  .bottom-nav .nav-icon,.nav-ico,.drawer-ico,.profile-ico,.order-ico,
  .btn-ico,.button-ico,.icon-btn__ico
){
  color:var(--kr-ui-accent)!important;
  background:linear-gradient(180deg,rgba(255,106,0,.10),rgba(255,106,0,.04))!important;
  border:1px solid rgba(255,106,0,.16)!important;
  box-shadow:none!important;
  text-shadow:none!important;
  filter:none!important;
  border-radius:16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
}

:where(
  .catalog-tool-btn__ico,.mo-search-ico,.services-app-card__ico,.services-app-service__ico,
  .services-app-icon,.services-app-option-ico,.services-app-confirm-ico,
  .client-cabinet-ico,.cabinet-ico,.cabinet-stat-ico,.mcab-ico,.sto-dash-ico,
  .ccab-ico,.ccab-stat-ico,.ccab-chip-ico,.bottom-nav .nav-icon,.nav-ico,.drawer-ico,
  .profile-ico,.order-ico,.btn-ico,.button-ico,.icon-btn__ico
){
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  font-size:20px!important;
  line-height:1!important;
}

/* SVG icons inherit the orange line style from onboarding role screen. */
:where(.services-app-card__ico,.services-app-service__ico,.client-cabinet-ico,.cabinet-ico,.mcab-ico,.sto-dash-ico,.nav-ico,.drawer-ico,.btn-ico) svg{
  width:22px!important;
  height:22px!important;
  color:var(--kr-ui-accent)!important;
  stroke:currentColor!important;
  fill:none!important;
}

/* Remove multicolor decorative gradients from action buttons; keep semantic danger visible. */
:where(
  .btn,.flow-btn,.ui-btn,.catalog-tool-btn,.mo-search-submit,.mo-search-clear,
  .services-app-cta,.services-app-btn,.services-app-action,.services-app-sheet button,
  .ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn,.profile-action-btn,.order-action-btn
){
  min-height:44px;
  border-radius:16px!important;
  font-weight:850!important;
  letter-spacing:-.02em;
  box-shadow:none!important;
  text-decoration:none!important;
  text-shadow:none!important;
  transition:transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease!important;
}

:where(
  .btn-primary,.flow-btn--primary,.ui-btn--primary,.services-app-cta,.services-app-btn--primary,
  .ccab-btn--primary,.cabinet-btn--primary,.mcab-btn--primary,.sto-btn--primary,
  .profile-action-btn--primary,.order-action-btn--primary,.mo-search-submit
){
  background:linear-gradient(180deg,var(--kr-ui-accent-2),var(--kr-ui-accent))!important;
  color:#fff!important;
  border:1px solid rgba(255,106,0,.42)!important;
  box-shadow:0 10px 20px rgba(255,106,0,.16)!important;
}

:where(
  .btn-outline,.btn-secondary,.flow-btn--secondary,.ui-btn--secondary,.services-app-btn--secondary,
  .ccab-btn--secondary,.cabinet-btn--secondary,.mcab-btn--secondary,.sto-btn--secondary,
  .profile-action-btn,.order-action-btn,.catalog-tool-btn,.services-app-action
):not(.btn-primary):not(.flow-btn--primary){
  background:rgba(255,255,255,.88)!important;
  color:var(--kr-ui-text)!important;
  border:1px solid var(--kr-ui-line)!important;
}

:where(.btn-danger,.ui-btn--danger,.order-action-btn--danger){
  background:#fff!important;
  color:#b42318!important;
  border:1px solid rgba(180,35,24,.24)!important;
}

:where(.btn,.flow-btn,.ui-btn,.catalog-tool-btn,.mo-search-submit,.services-app-cta,.services-app-btn,.ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn,.profile-action-btn,.order-action-btn):active{
  transform:translateY(1px) scale(.995)!important;
}

/* Cards and panels: first-screen style — white surfaces, soft border, no random neon. */
:where(
  .services-app-card,.services-app-service,.services-app-option,.services-app-sheet,
  .ccab-card,.ccab-panel,.cabinet-card,.cabinet-panel,.mcab-card,.mcab-panel,
  .sto-card,.sto-panel,.profile-card,.order-card
){
  background:rgba(255,255,255,.88)!important;
  border:1px solid var(--kr-ui-line)!important;
  box-shadow:var(--kr-ui-shadow)!important;
  border-radius:var(--kr-ui-radius)!important;
}

/* Text guards for tablet: no icon/text collision. */
:where(
  .services-app-card,.services-app-service,.services-app-option,
  .ccab-card,.cabinet-card,.mcab-card,.sto-card,.profile-card,.order-card,
  .catalog-tool-btn,.services-app-action,.ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn
) :where(b,strong,span,p,small,h1,h2,h3,h4){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}

@media (min-width:768px){
  :where(.catalog-tool-btn__ico,.mo-search-ico,.services-app-card__ico,.services-app-service__ico,.client-cabinet-ico,.cabinet-ico,.mcab-ico,.sto-dash-ico,.nav-ico,.drawer-ico){
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    font-size:21px!important;
  }
  :where(.btn,.flow-btn,.ui-btn,.catalog-tool-btn,.services-app-cta,.services-app-btn,.ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn){
    min-height:48px;
    padding-inline:18px;
  }
}

@media (max-width:430px){
  :where(.catalog-tool-btn__ico,.mo-search-ico,.services-app-card__ico,.services-app-service__ico,.client-cabinet-ico,.cabinet-ico,.mcab-ico,.sto-dash-ico,.nav-ico,.drawer-ico){
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    border-radius:14px!important;
    font-size:18px!important;
  }
  :where(.btn,.flow-btn,.ui-btn,.catalog-tool-btn,.services-app-cta,.services-app-btn,.ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn){
    min-height:44px;
    border-radius:14px!important;
  }
}

/* === SOURCE: css/ui_icon_svg_replace_r44.css === */
/* UI-r44 — targeted emoji-to-line-icon replacement for interface elements.
   Scope: UI icon containers only. Content emoji in normal text is not touched. */
:root{
  --kr-icon-line: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4.5 4.5 0 0 0-6.4 6.4l-4.6 4.6a2.1 2.1 0 0 0 3 3l4.6-4.6a4.5 4.5 0 0 0 6.4-6.4l-3.2 3.2-3-3 3.2-3.2Z'/%3E%3C/svg%3E");
  --kr-icon-car: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13l2.2-5.2A3 3 0 0 1 8 6h8a3 3 0 0 1 2.8 1.8L21 13'/%3E%3Cpath d='M5 13h14a2 2 0 0 1 2 2v3h-3a2 2 0 0 1-4 0H10a2 2 0 0 1-4 0H3v-3a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M7 13h10'/%3E%3C/svg%3E");
  --kr-icon-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E");
  --kr-icon-shop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10l1-5h14l1 5'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M9 20v-6h6v6'/%3E%3C/svg%3E");
  --kr-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
  --kr-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
  --kr-icon-box: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5 9 5 9-5Z'/%3E%3Cpath d='M3 8v8l9 5 9-5V8'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E");
  --kr-icon-bell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 1 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E");
  --kr-icon-chat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-8 8H5l-2 2v-7a8 8 0 1 1 18-3Z'/%3E%3Cpath d='M8 11h8M8 15h5'/%3E%3C/svg%3E");
  --kr-icon-users: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='4'/%3E%3Cpath d='M2 21a7 7 0 0 1 14 0'/%3E%3Cpath d='M17 11a3 3 0 0 0 0-6'/%3E%3Cpath d='M22 21a5 5 0 0 0-4-5'/%3E%3C/svg%3E");
  --kr-icon-alert: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l10 18H2L12 3Z'/%3E%3Cpath d='M12 9v5M12 18h.01'/%3E%3C/svg%3E");
  --kr-icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

:where(
  .svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.booking-prefill-note__emoji,
  .bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,
  .onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,
  .parts-category-card__icon,.parts-card-ico,.news-card-ico,.master-card-ico,
  .services-app-card__ico,.services-app-service__ico,.services-app-option-ico,
  .ccab-ico,.ccab-stat-ico,.cabinet-stat-ico,.mcab-ico,.sto-dash-ico
){
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  border-radius:16px!important;
  color:var(--kr-ui-accent,#ff6a00)!important;
  background:linear-gradient(180deg,rgba(255,106,0,.10),rgba(255,106,0,.04))!important;
  border:1px solid rgba(255,106,0,.16)!important;
  box-shadow:none!important;
  text-shadow:none!important;
  font-size:0!important;
  line-height:1!important;
  overflow:hidden!important;
}

:where(
  .svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.booking-prefill-note__emoji,
  .bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,
  .onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,
  .parts-category-card__icon,.parts-card-ico,.news-card-ico,.master-card-ico,
  .services-app-card__ico,.services-app-service__ico,.services-app-option-ico,
  .ccab-ico,.ccab-stat-ico,.cabinet-stat-ico,.mcab-ico,.sto-dash-ico
)::before{
  content:'';
  display:block;
  width:23px;
  height:23px;
  background:currentColor;
  -webkit-mask:var(--kr-icon-line) center/contain no-repeat;
  mask:var(--kr-icon-line) center/contain no-repeat;
}

.bstep3-car-ico::before,.services-app-card__ico::before,.services-app-service__ico::before{ -webkit-mask-image:var(--kr-icon-car); mask-image:var(--kr-icon-car); }
.aqa-ico::before,.onb-review-row__icon::before{ -webkit-mask-image:var(--kr-icon-line); mask-image:var(--kr-icon-line); }
.admin-shop-icon::before,.parts-category-card__icon::before,.parts-card-ico::before{ -webkit-mask-image:var(--kr-icon-box); mask-image:var(--kr-icon-box); }
.msng-staff-card-top > span:first-child::before,.ccab-ico::before,.master-card-ico::before{ -webkit-mask-image:var(--kr-icon-chat); mask-image:var(--kr-icon-chat); }
.notifs-fab-ico::before,.notif-ico::before{ -webkit-mask-image:var(--kr-icon-bell); mask-image:var(--kr-icon-bell); }
.booking-time-mode-card__emoji::before{ -webkit-mask-image:var(--kr-icon-calendar); mask-image:var(--kr-icon-calendar); }
.onb-perm-icon::before{ -webkit-mask-image:var(--kr-icon-alert); mask-image:var(--kr-icon-alert); }
.sto-dash-ico::before{ -webkit-mask-image:var(--kr-icon-shop); mask-image:var(--kr-icon-shop); }
.ccab-stat-ico::before,.cabinet-stat-ico::before,.mcab-ico::before{ -webkit-mask-image:var(--kr-icon-user); mask-image:var(--kr-icon-user); }
.booking-prefill-note__emoji::before{ -webkit-mask-image:var(--kr-icon-arrow); mask-image:var(--kr-icon-arrow); }

/* Button/action icons: make old emoji-only spans behave like the same icon chip, not colored glyphs. */
:where(.btn,.ui-btn,.services-app-btn,.services-app-action,.ccab-btn,.cabinet-btn,.mcab-btn,.sto-btn,.profile-action-btn,.order-action-btn) > span:first-child:not(:only-child){
  text-shadow:none!important;
}

:where(.catalog-tool-btn,.services-app-action,.booking-picked-chip,.svc-cat-nav-card,.booking-time-mode-card,.aqa-card,.msng-staff-card){
  color:var(--kr-ui-text,#101821)!important;
}

:where(.svc-cat-nav-card,.booking-time-mode-card,.aqa-card,.msng-staff-card,.services-app-card,.services-app-service){
  min-width:0!important;
  overflow:hidden!important;
}

:where(.svc-cat-nav-card,.booking-time-mode-card,.aqa-card,.msng-staff-card,.services-app-card,.services-app-service) :where(.svc-cat-nav-card__body,.booking-time-mode-card__body,.aqa-t,.aqa-d,.msng-staff-card-top,.services-app-card__body){
  min-width:0!important;
  overflow-wrap:anywhere!important;
}

@media (min-width:768px){
  :where(.svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,.onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,.services-app-card__ico,.services-app-service__ico){
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
  }
  :where(.svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,.onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,.services-app-card__ico,.services-app-service__ico)::before{
    width:25px;
    height:25px;
  }
}

@media (max-width:430px){
  :where(.svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,.onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,.services-app-card__ico,.services-app-service__ico){
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    border-radius:14px!important;
  }
  :where(.svc-cat-nav-card__emoji,.booking-time-mode-card__emoji,.bstep3-car-ico,.admin-shop-icon,.aqa-ico,.msng-staff-card-top > span:first-child,.onb-perm-icon,.onb-review-row__icon,.notif-ico,.notifs-fab-ico,.services-app-card__ico,.services-app-service__ico)::before{
    width:21px;
    height:21px;
  }
}

/* === SOURCE: css/ui_inline_icon_replace_r45.css === */
/* UI-r45 — inline emoji-to-line-icon pass. Scope: UI glyphs/buttons/cards only. */
:root{--kui-icon-color:#ff6a00;--kui-icon-bg:rgba(255,106,0,.09);--kui-icon-line:rgba(255,106,0,.18);}
.bnav-ico,.nav-ico,.aqa-ico,.admin-shop-icon,.empty-icon,.settings-row-ico,.pf-search-ico,.mo-search-ico,.mo-search-ico span,.catalog-tool-btn__ico,.vcard-ico-emoji,.ct-map-placeholder,.onb2-profile-mark,.onb2-spec-ico,.onb2-city-r6-option-ico,.services-app-icon,.services-app-card__ico,.services-app-sheet__ico,.services-app-confirm-ico,.rv-add-icon,.nac-icon,.msng-photo-placeholder,.client-cabinet-r42 .ccab-ico,.cabinet-stat-ico{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  color:var(--kui-icon-color)!important;
  text-shadow:none!important;
  filter:none!important;
  line-height:1!important;
}
.aqa-ico,.admin-shop-icon,.empty-icon,.settings-row-ico,.vcard-ico-emoji,.onb2-profile-mark,.services-app-icon,.services-app-card__ico,.services-app-sheet__ico,.services-app-confirm-ico,.cabinet-stat-ico{
  background:var(--kui-icon-bg)!important;
  border:1px solid var(--kui-icon-line)!important;
  box-shadow:0 8px 18px rgba(255,106,0,.08)!important;
}
.bnav-ico{font-size:22px!important;font-weight:850!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:24px!important;min-height:24px!important;}
.aqa-ico,.admin-shop-icon{font-size:22px!important;font-weight:850!important;display:flex!important;align-items:center!important;justify-content:center!important;}
button,.btn,.flow-btn,.catalog-tool-btn,.mo-search-submit,.services-app-cta,.services-app-sheet__action{gap:8px;min-width:0;}
button > span,.btn > span,.catalog-tool-btn > span,.services-app-cta > span{min-width:0;flex-shrink:0;}
.admin-page-title,.cmodal-title,.mmaster-footer-btn,.act-btn,.btn,.catalog-tool-btn,.services-app-cta,.services-app-sheet__action{overflow-wrap:anywhere;}
@media (max-width:767px){.bnav-ico{font-size:20px!important}.aqa-ico,.admin-shop-icon{font-size:20px!important}}
@media (min-width:768px){.bnav-ico{font-size:23px!important}.aqa-ico,.admin-shop-icon{font-size:24px!important}}

/* === SOURCE: css/ui_r46_mobile_tablet_smoke_guard.css === */

/* UI-r46 — mobile/tablet smoke guards after icon unification.
   Scope: visual safety only. No route/API/business logic changes. */

:root{
  --kr-ui-icon-size: 22px;
  --kr-ui-icon-box: 42px;
  --kr-ui-icon-color: #ff6a00;
  --kr-ui-icon-bg: rgba(255,106,0,.08);
  --kr-ui-icon-border: rgba(255,106,0,.14);
}

/* Universal text/icon overlap guard for button-like and card-like controls. */
button,
.btn,
.flow-btn,
.catalog-tool-btn,
.mo-search-submit,
.mo-search-toggle,
.services-app-btn,
.services-app-card,
.services-app-item,
.services-app-option,
.services-app-sheet button,
.services-app-sheet__option,
.cabinet-card,
.client-cabinet-card,
.master-cabinet-card,
.sto-card{
  min-width:0;
  max-width:100%;
}

button > span,
.btn > span,
.flow-btn > span,
.catalog-tool-btn > span,
.mo-search-submit > span,
.mo-search-toggle > span,
.services-app-btn > span,
.services-app-card > span,
.services-app-item > span,
.services-app-option > span,
.client-cabinet-card > span,
.master-cabinet-card > span,
.sto-card > span{
  min-width:0;
}

button b,
button strong,
button small,
.btn b,
.btn strong,
.btn small,
.catalog-tool-btn b,
.mo-search-submit b,
.mo-search-toggle b,
.services-app-btn b,
.services-app-btn strong,
.services-app-card b,
.services-app-card strong,
.services-app-card small,
.services-app-item b,
.services-app-item strong,
.services-app-item small,
.services-app-option b,
.services-app-option strong,
.services-app-option small,
.client-cabinet-card b,
.client-cabinet-card strong,
.client-cabinet-card small,
.master-cabinet-card b,
.master-cabinet-card strong,
.master-cabinet-card small,
.sto-card b,
.sto-card strong,
.sto-card small{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
  white-space:normal;
}

/* Icon boxes: keep first-screen orange line style and stop emoji/color icons from dominating. */
[class*="ico"],
[class*="icon"],
.services-app-ico,
.services-app-icon,
.cabinet-icon,
.client-cabinet-icon,
.master-cabinet-icon,
.sto-icon,
.mo-search-ico,
.catalog-tool-btn__ico{
  flex:0 0 auto;
  line-height:1;
}

.services-app-ico,
.services-app-icon,
.cabinet-icon,
.client-cabinet-icon,
.master-cabinet-icon,
.sto-icon,
.catalog-tool-btn__ico{
  width:var(--kr-ui-icon-box);
  height:var(--kr-ui-icon-box);
  min-width:var(--kr-ui-icon-box);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  color:var(--kr-ui-icon-color);
  background:var(--kr-ui-icon-bg);
  border:1px solid var(--kr-ui-icon-border);
  font-size:var(--kr-ui-icon-size);
  overflow:hidden;
}

/* Prevent inline SVG helpers from stretching or shifting text baselines. */
.kr-line-icon,
.ui-line-icon,
[data-ui-icon] svg,
button svg,
.btn svg,
.services-app-btn svg,
.services-app-card svg,
.catalog-tool-btn svg{
  width:1.15em;
  height:1.15em;
  min-width:1.15em;
  display:inline-block;
  vertical-align:-.18em;
  color:currentColor;
  stroke:currentColor;
}

/* Mobile smoke guards. */
@media (max-width:767px){
  button,
  .btn,
  .flow-btn,
  .services-app-btn,
  .catalog-tool-btn,
  .mo-search-submit,
  .mo-search-toggle{
    gap:8px;
    align-items:center;
    justify-content:center;
    line-height:1.18;
  }

  .services-app-card,
  .services-app-item,
  .services-app-option,
  .client-cabinet-card,
  .master-cabinet-card,
  .sto-card{
    min-height:auto;
    height:auto;
    align-items:flex-start;
  }

  .services-app-ico,
  .services-app-icon,
  .cabinet-icon,
  .client-cabinet-icon,
  .master-cabinet-icon,
  .sto-icon,
  .catalog-tool-btn__ico{
    width:38px;
    height:38px;
    min-width:38px;
    border-radius:13px;
    font-size:20px;
  }
}

/* Tablet smoke guards. */
@media (min-width:768px){
  .services-app-card,
  .services-app-item,
  .services-app-option,
  .client-cabinet-card,
  .master-cabinet-card,
  .sto-card{
    min-height:auto;
    height:auto;
    align-items:stretch;
  }

  .services-app-card,
  .services-app-item,
  .services-app-option{
    gap:14px;
  }

  .services-app-ico,
  .services-app-icon,
  .cabinet-icon,
  .client-cabinet-icon,
  .master-cabinet-icon,
  .sto-icon,
  .catalog-tool-btn__ico{
    width:46px;
    height:46px;
    min-width:46px;
    border-radius:15px;
  }

  .catalog-tool-btn,
  .mo-search-submit,
  .mo-search-toggle{
    min-height:48px;
  }
}

/* Wide/tablet landscape: keep icon/text from stretching across large grid cells. */
@media (min-width:1024px){
  .services-app-card,
  .services-app-item,
  .services-app-option,
  .client-cabinet-card,
  .master-cabinet-card,
  .sto-card{
    container-type:inline-size;
  }

  .services-app-card > *,
  .services-app-item > *,
  .services-app-option > *,
  .client-cabinet-card > *,
  .master-cabinet-card > *,
  .sto-card > *{
    max-width:100%;
  }

  .services-app-ico,
  .services-app-icon,
  .cabinet-icon,
  .client-cabinet-icon,
  .master-cabinet-icon,
  .sto-icon{
    width:50px;
    height:50px;
    min-width:50px;
  }
}

/* Low-height tablet landscape. */
@media (min-width:768px) and (max-height:760px){
  .services-app-card,
  .services-app-item,
  .services-app-option,
  .client-cabinet-card,
  .master-cabinet-card,
  .sto-card{
    padding-top:12px;
    padding-bottom:12px;
  }

  .services-app-ico,
  .services-app-icon,
  .cabinet-icon,
  .client-cabinet-icon,
  .master-cabinet-icon,
  .sto-icon{
    width:40px;
    height:40px;
    min-width:40px;
  }
}

/* === SOURCE: css/admin_clients_page.css === */
/* UI-r11 — STO/admin clients page */
.admin-clients-pane{padding:0;max-width:100%;overflow:hidden}
.admin-clients-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;min-width:0}
.admin-clients-head .admin-page-title span{font-size:14px;font-weight:500;color:var(--text3)}
.admin-clients-sub{font-size:12px;color:var(--text3);margin-top:6px;line-height:1.5;max-width:760px}
.admin-clients-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.admin-clients-tools .admin-search{min-width:min(260px,100%)}
.crm-client-loading{padding:42px 20px;text-align:center;color:var(--text3);border:1px dashed var(--line);border-radius:var(--ui-radius-card);background:var(--surface)}
.crm-client-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px;min-width:0}
.crm-client-stat{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 10px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--ui-radius-card);background:var(--surface);min-width:0}
.crm-client-stat span{font-size:18px;grid-row:span 2}
.crm-client-stat b{font-family:Oswald,sans-serif;font-size:22px;color:var(--orange);line-height:1}
.crm-client-stat em{font-style:normal;font-size:11px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-client-modebar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px;min-width:0}
.crm-client-modebar button{min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:var(--ui-radius-btn);background:var(--surface);color:var(--text2);font-size:13px;font-weight:800;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crm-client-modebar button.active{background:var(--orange-dim);border-color:rgba(255,107,0,.34);color:var(--orange)}
.crm-client-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;min-width:0}
.crm-client-card{border:1px solid var(--line);border-radius:var(--ui-radius-card);background:var(--surface);box-shadow:var(--shadow-card,0 12px 30px rgba(0,0,0,.12));padding:14px;min-width:0;max-width:100%;overflow:hidden}
.crm-client-card.is-active{border-color:rgba(255,107,0,.28)}
.crm-client-card__head{display:flex;align-items:center;gap:10px;min-width:0;margin-bottom:12px}
.crm-client-avatar{width:42px;height:42px;border-radius:var(--ui-radius-md);display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.12);border:1px solid rgba(255,107,0,.24);color:var(--orange);font-family:Oswald,sans-serif;font-size:15px;font-weight:800;flex:0 0 42px}
.crm-client-avatar--lg{width:52px;height:52px;flex-basis:52px;font-size:18px}
.crm-client-title{min-width:0;flex:1}
.crm-client-title h3{margin:0;font-size:15px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-client-title div,.crm-client-detail__meta{font-size:12px;color:var(--text3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.crm-client-title a,.crm-client-detail__meta a{color:var(--orange)}
.crm-client-state{font-size:11px;font-weight:800;padding:4px 8px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);color:var(--text3);white-space:nowrap;flex-shrink:0}
.crm-client-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:12px;min-width:0}
.crm-client-metrics div{padding:8px;border:1px solid var(--line);border-radius:var(--ui-radius-md);background:var(--bg2);min-width:0;text-align:center}
.crm-client-metrics b{display:block;font-family:Oswald,sans-serif;font-size:17px;color:var(--orange);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-client-metrics span{display:block;font-size:10px;color:var(--text3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-client-card__body,.crm-client-detail__orders{display:grid;gap:8px;min-width:0}
.crm-client-order{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:var(--ui-radius-md);background:var(--bg2);padding:10px;min-width:0;max-width:100%}
.crm-client-order__main{min-width:0}
.crm-client-order__top{display:flex;align-items:center;gap:8px;justify-content:space-between;min-width:0}
.crm-client-order__top b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.crm-order-badge{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;font-size:10px;font-weight:800;padding:3px 7px;border-radius:999px;background:color-mix(in srgb,var(--_badge) 14%, transparent);border:1px solid color-mix(in srgb,var(--_badge) 28%, transparent);color:var(--_badge);white-space:nowrap}
.crm-client-order__meta,.crm-client-order__hint{font-size:11px;color:var(--text3);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.crm-client-order__hint{color:var(--text2)}
.crm-client-order__actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.crm-client-card__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;min-width:0}
.crm-client-empty{padding:14px;border:1px dashed var(--line);border-radius:var(--ui-radius-md);color:var(--text3);font-size:13px;text-align:center;background:var(--bg2)}
.crm-client-empty--wide{grid-column:1/-1}
.crm-client-detail__head{display:flex;align-items:center;gap:12px;margin-bottom:14px;min-width:0}
.crm-client-metrics--detail{margin:12px 0}
.crm-client-detail__actions{margin-top:14px}
@media (max-width:640px){
  .admin-clients-pane{padding:0 2px}
  .admin-clients-head{gap:10px;margin-bottom:12px}
  .admin-clients-tools{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto}
  .admin-clients-tools .admin-search{min-width:0;width:100%}
  .crm-client-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .crm-client-stat{padding:10px;border-radius:var(--ui-radius-md)}
  .crm-client-grid{grid-template-columns:1fr;gap:10px}
  .crm-client-card{padding:12px;border-radius:var(--ui-radius-md);box-shadow:none}
  .crm-client-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .crm-client-order{grid-template-columns:1fr;gap:8px;padding:9px}
  .crm-client-order__actions{justify-content:stretch;display:grid;grid-template-columns:1fr 1fr}
  .crm-client-card__actions{grid-template-columns:1fr}
  .crm-client-modebar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .crm-client-modebar button{padding:0 10px;font-size:12px}
}

/* STO-r2 — clients filters refinement */
.crm-client-modebar--filters{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:stretch;
}
.crm-client-modebar--filters button,
.crm-client-modebar--modal button{
  min-width:0;
  max-width:100%;
}
.crm-client-modebar--modal{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:860px){
  .crm-client-modebar--filters,
  .crm-client-modebar--modal{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:420px){
  .crm-client-modebar--filters,
  .crm-client-modebar--modal{grid-template-columns:1fr;}
}

/* STO-r3 — client cards: order stages + latest messages */
.crm-order-stage-strip{
  display:grid;
  gap:5px;
  margin-top:8px;
  min-width:0;
}
.crm-order-stage-strip span{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:5px 7px;
  border:1px solid color-mix(in srgb,var(--line) 74%, transparent);
  border-radius:var(--ui-radius-sm,5px);
  background:color-mix(in srgb,var(--surface) 58%, transparent);
}
.crm-order-stage-strip i{
  font-style:normal;
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  border-radius:50%;
  background:var(--orange-dim);
  color:var(--orange);
  flex:0 0 18px;
}
.crm-order-stage-strip b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px;
  color:var(--text2);
  font-weight:800;
}
.crm-order-stage-strip em{
  font-style:normal;
  font-size:10px;
  color:var(--text3);
  white-space:nowrap;
}
.crm-order-stage-strip.is-empty{
  padding:7px 8px;
  border:1px dashed var(--line);
  border-radius:var(--ui-radius-sm,5px);
  color:var(--text3);
  font-size:11px;
  background:color-mix(in srgb,var(--bg2) 72%, transparent);
}
.crm-order-last-message{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-width:0;
  margin-top:7px;
  padding:7px 8px;
  border-radius:var(--ui-radius-sm,5px);
  background:color-mix(in srgb,var(--orange) 7%, transparent);
  border:1px solid color-mix(in srgb,var(--orange) 15%, transparent);
}
.crm-order-last-message span{
  font-size:10px;
  font-weight:900;
  color:var(--orange);
  white-space:nowrap;
}
.crm-order-last-message b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px;
  color:var(--text2);
  font-weight:700;
}
.crm-order-last-message em{
  font-style:normal;
  font-size:10px;
  color:var(--text3);
  white-space:nowrap;
}
.crm-order-last-message.is-empty{
  display:block;
  font-size:11px;
  color:var(--text3);
  background:transparent;
  border:1px dashed var(--line);
}
@media (max-width:640px){
  .crm-order-stage-strip span,
  .crm-order-last-message{grid-template-columns:auto minmax(0,1fr);}
  .crm-order-stage-strip em,
  .crm-order-last-message em{grid-column:2;justify-self:start;}
  .crm-order-last-message{gap:4px 7px;padding:7px;}
}

/* === SOURCE: css/responsive_audit_guard.css === */
/* UI-r13: responsive audit guard
   Scope: mobile/tablet/desktop overflow and density guard after mobile flatten/navigation changes.
   No business logic. */

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

img,
svg,
video,
canvas{
  max-width:100%;
  height:auto;
}

#app,
.app,
.page,
.spa-page,
.container,
.spa-content,
.spa-page-hero,
.spa-page-hero--with-tools,
.spa-hero-layout,
.spa-hero-tools-card,
.catalog-tools,
.catalog-tools__inner,
.catalog-tools__actions,
.catalog-tools__search,
.mo-card,
.master-card,
.parts-category-card,
.part-card,
.msng-item,
.news-card,
.admin-card,
.cmodal-card,
.modal-dialog-v2,
.modal-panel-v2{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.catalog-tool-btn,
.bnav-item,
.drawer-link,
.btn,
.ui-btn,
.mo-action-btn,
.msng-action-btn,
.parts-action-btn,
.admin-action-btn{
  min-width:0;
  max-width:100%;
}

.catalog-tool-btn b,
.catalog-tool-btn strong,
.bnav-label,
.drawer-link span,
.btn span,
.ui-btn span,
.mo-card-title,
.master-card-title,
.parts-category-title,
.news-card-title,
.msng-title{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width: 430px){
  :root{
    --ui-mobile-page-pad: 8px;
    --ui-mobile-card-pad: 10px;
    --ui-mobile-gap: 8px;
  }

  .container,
  .spa-content > .container,
  .msng-page-content,
  .masters-content > .container,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:var(--ui-mobile-page-pad) !important;
    padding-right:var(--ui-mobile-page-pad) !important;
  }

  .spa-page-hero.spa-page-hero--with-tools{
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .spa-hero-layout,
  .spa-hero-tools-card,
  .catalog-tools,
  .catalog-tools__inner{
    gap:var(--ui-mobile-gap) !important;
  }

  .mo-card,
  .master-card,
  .parts-category-card,
  .part-card,
  .msng-item,
  .news-card,
  .admin-card{
    padding:var(--ui-mobile-card-pad) !important;
  }

  #bottom-nav,
  #bottomNavInner,
  .bnav-inner{
    max-width:100vw !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
  }
}

@media (min-width:431px) and (max-width:640px){
  .container,
  .spa-content > .container,
  .msng-page-content,
  .masters-content > .container,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }
}

@media (min-width:641px) and (max-width:1023px){
  .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .catalog-tools__actions,
  .catalog-tools__search{
    width:100% !important;
    max-width:100% !important;
  }
}

@media (min-width:1024px){
  .spa-hero-layout.spa-hero-layout--with-tools{
    align-items:stretch;
  }

  .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
    min-width:0;
    max-width:100%;
  }
}

/* === SOURCE: css/drawer_cab_section.css === */
/* UI-r15 — Drawer cabinet/navigation section cleanup
   Goal: no fake links, no empty wrappers, one compact visual grammar for drawer buttons. */
.drawer-cab-section {
  display: grid;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 6px 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.drawer-cab-section--routes {
  margin-top: 2px;
}

.drawer-cab-section .drawer-link.drawer-link--cab {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 1px solid var(--border, rgba(148,163,184,.22));
  border-radius: var(--ui-radius-card, 18px);
  background: color-mix(in srgb, var(--surface, #fff) 86%, transparent);
  color: var(--text, #111827);
  box-shadow: none;
  text-decoration: none;
  text-align: left;
  cursor: pointer;
  font: inherit;
  line-height: 1.2;
  overflow: hidden;
}

.drawer-cab-section .drawer-link.drawer-link--cab:hover,
.drawer-cab-section .drawer-link.drawer-link--cab:focus-visible {
  border-color: color-mix(in srgb, var(--accent, #ff6b00) 46%, var(--border, #e5e7eb));
  background: color-mix(in srgb, var(--accent-soft, rgba(255,107,0,.12)) 58%, var(--surface, #fff));
  color: var(--text, #111827);
}

.drawer-cab-section .drawer-link.drawer-link--cab:active {
  transform: translateY(1px);
}

.drawer-cab-section .drawer-link.drawer-link--cab.active,
.drawer-cab-section .drawer-link.drawer-link--cab[aria-current="page"] {
  border-color: color-mix(in srgb, var(--accent, #ff6b00) 62%, var(--border, #e5e7eb));
  background: color-mix(in srgb, var(--accent-soft, rgba(255,107,0,.14)) 72%, var(--surface, #fff));
}

.drawer-cab-section .drawer-link.drawer-link--cab .dl-icon {
  width: 38px;
  height: 38px;
  min-width: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-radius-btn, 10px);
  background: var(--accent-soft, rgba(255,107,0,.12));
  border: 1px solid color-mix(in srgb, var(--accent, #ff6b00) 28%, transparent);
  font-size: 17px;
  line-height: 1;
}

.drawer-cab-section .drawer-link.drawer-link--cab .dl-body,
.drawer-cab-section .drawer-link.drawer-link--cab .dl-title,
.drawer-cab-section .drawer-link.drawer-link--cab .dl-desc {
  min-width: 0;
  max-width: 100%;
}

.drawer-cab-section .drawer-link.drawer-link--cab .dl-body {
  display: grid;
  gap: 2px;
}

.drawer-cab-section .drawer-link.drawer-link--cab .dl-title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -.01em;
}

.drawer-cab-section .drawer-link.drawer-link--cab .dl-desc {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11.5px;
  color: var(--text3, #94a3b8);
}

.drawer-cab-section .drawer-divider,
.drawer-cab-section .drawer-divider--routes {
  margin: 4px 0;
  height: 1px;
  background: var(--border, rgba(148,163,184,.22));
  border: 0;
}

@media (max-width: 640px) {
  .drawer-links {
    padding-inline: 12px;
  }
  .drawer-cab-section {
    gap: 7px;
    padding-block: 5px;
  }
  .drawer-cab-section .drawer-link.drawer-link--cab {
    min-height: 46px;
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 7px 10px;
    border-radius: var(--ui-radius-card, 18px);
  }
  .drawer-cab-section .drawer-link.drawer-link--cab .dl-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
}

/* === SOURCE: css/admin_clients_stabilization.css === */
/* STO-r5 — admin/STO clients page UI stabilization */
.admin-clients-pane,
.admin-clients-pane *{box-sizing:border-box;min-width:0}
.admin-clients-pane{width:100%;max-width:100%;overflow-x:hidden}
.admin-clients-head{position:relative;z-index:1}
.admin-clients-head>div:first-child{min-width:0;flex:1 1 320px}
.admin-clients-tools{flex:0 1 420px;max-width:100%}
.admin-clients-tools .btn,
.crm-client-card__actions .btn,
.crm-client-order__actions .act-btn,
.crm-client-detail__actions .btn{min-height:var(--ui-btn-h-md,44px);border-radius:var(--ui-radius-btn);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-client-grid{align-items:start}
.crm-client-card{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:0;isolation:isolate}
.crm-client-card__head{max-width:100%}
.crm-client-title h3,
.crm-client-title div{max-width:100%}
.crm-client-state{max-width:120px;overflow:hidden;text-overflow:ellipsis}
.crm-client-metrics div{overflow:hidden}
.crm-client-order{isolation:isolate;overflow:hidden}
.crm-client-order__top{overflow:hidden}
.crm-client-order__top b{display:block;flex:1 1 auto;max-width:100%}
.crm-order-badge{max-width:126px;overflow:hidden;text-overflow:ellipsis}
.crm-client-order__actions .act-btn{padding:0 12px;font-size:12px;font-weight:900;border:1px solid var(--line);background:var(--surface);color:var(--text2);cursor:pointer}
.crm-client-order__actions .act-btn.view{border-color:rgba(255,107,0,.34);background:var(--orange-dim);color:var(--orange)}
.crm-client-order__actions .act-btn:disabled{opacity:.55;cursor:not-allowed}
.crm-order-stage-strip,
.crm-order-last-message{max-width:100%}
.crm-order-stage-strip span{overflow:hidden}
.crm-client-detail{width:min(760px,calc(100vw - 24px));max-width:100%;overflow-x:hidden}
.crm-client-detail__head>div:nth-child(2){min-width:0;flex:1}
.crm-client-detail__orders{max-width:100%}
.crm-client-modebar--filters button,
.crm-client-modebar--modal button{display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.15}
@media (max-width:640px){
  .admin-clients-pane{padding:0!important}
  .admin-clients-head{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:10px}
  .admin-clients-sub{font-size:11px;line-height:1.35;max-width:100%}
  .admin-clients-tools{display:grid;grid-template-columns:1fr;gap:8px;width:100%;max-width:100%;flex-basis:auto}
  .admin-clients-tools .admin-search{height:44px;font-size:16px}
  .admin-clients-tools .btn{width:100%}
  .crm-client-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
  .crm-client-stat{padding:9px 10px;border-radius:var(--ui-radius-md);box-shadow:none}
  .crm-client-stat b{font-size:19px}
  .crm-client-modebar--filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
  .crm-client-modebar--filters button{min-height:42px;padding:0 8px;font-size:11px}
  .crm-client-grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .crm-client-card{padding:11px;border-radius:var(--ui-radius-md);box-shadow:none;gap:0}
  .crm-client-card__head{align-items:flex-start;gap:8px;margin-bottom:10px}
  .crm-client-avatar{width:38px;height:38px;flex-basis:38px;border-radius:var(--ui-radius-md);font-size:14px}
  .crm-client-state{max-width:96px;font-size:10px;padding:4px 6px}
  .crm-client-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:10px}
  .crm-client-metrics div{padding:7px 6px}
  .crm-client-order{grid-template-columns:1fr;gap:8px;padding:8px;border-radius:var(--ui-radius-md)}
  .crm-client-order__top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:start}
  .crm-order-badge{max-width:110px;font-size:9px;padding:3px 6px}
  .crm-client-order__meta,
  .crm-client-order__hint{font-size:10px;line-height:1.35;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .crm-order-stage-strip{gap:4px;margin-top:6px}
  .crm-order-stage-strip span{padding:5px 6px;grid-template-columns:auto minmax(0,1fr);gap:4px 6px}
  .crm-order-stage-strip em{grid-column:2;font-size:9px}
  .crm-order-last-message{grid-template-columns:auto minmax(0,1fr);padding:6px;gap:4px 6px;margin-top:6px}
  .crm-order-last-message em{grid-column:2;font-size:9px}
  .crm-client-order__actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;justify-content:stretch}
  .crm-client-order__actions .act-btn{width:100%;min-height:40px;padding:0 8px}
  .crm-client-card__actions{grid-template-columns:1fr;gap:7px;margin-top:10px}
  .crm-client-detail{width:100%;max-width:100%;max-height:86vh;border-radius:var(--ui-radius-modal) var(--ui-radius-modal) 0 0!important}
  .crm-client-detail__head{align-items:flex-start;gap:10px;margin-bottom:12px}
  .crm-client-avatar--lg{width:44px;height:44px;flex-basis:44px;font-size:16px}
  .crm-client-metrics--detail{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0}
  .crm-client-modebar--modal{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .crm-client-modebar--modal button{min-height:42px;font-size:11px;padding:0 8px}
  .crm-client-detail__actions{display:grid;grid-template-columns:1fr;gap:8px}
}
@media (max-width:380px){
  .crm-client-stats,
  .crm-client-metrics,
  .crm-client-metrics--detail,
  .crm-client-modebar--filters,
  .crm-client-modebar--modal{grid-template-columns:1fr}
  .crm-client-order__actions{grid-template-columns:1fr}
  .crm-client-state{display:none}
}
@media (min-width:1024px){
  .crm-client-grid{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
  .crm-client-card:hover{transform:translateY(-1px)}
}

/* STO-r9: client history/chat/attachments stabilization */
.crm-client-history-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:10px 0 12px;
}
.crm-client-history-summary>div{
  min-width:0;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md);
  background:var(--surface);
  padding:9px 10px;
}
.crm-client-history-summary b{
  display:block;
  font-family:'Oswald',sans-serif;
  font-size:16px;
  color:var(--text1);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.crm-client-history-summary span{
  display:block;
  margin-top:3px;
  font-size:10px;
  line-height:1.25;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.crm-client-history-summary__wide{grid-column:1/-1;}
.crm-order-files{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  margin-top:7px;
  padding:6px 7px;
  border:1px dashed rgba(148,163,184,.28);
  border-radius:var(--ui-radius-sm,5px);
  background:rgba(148,163,184,.06);
  color:var(--text2);
  font-size:11px;
}
.crm-order-files b{font-family:'Oswald',sans-serif;color:var(--orange);font-size:14px;line-height:1;}
.crm-order-files span{color:var(--text3);}
.crm-order-files.is-empty{opacity:.72;}
.crm-order-file-thumb{
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  border-radius:var(--ui-radius-sm,5px);
  border:1px solid var(--line);
  background:var(--bg2);
  overflow:hidden;
  font-size:13px;
}
.crm-order-file-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:700px){
  .crm-client-history-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:8px 0 10px;}
  .crm-client-history-summary>div{padding:8px;}
  .crm-client-history-summary b{font-size:15px;}
  .crm-order-files{gap:5px;padding:6px;white-space:nowrap;overflow:hidden;}
  .crm-order-file-thumb{width:24px;height:24px;}
}

/* === SOURCE: css/parts_crosses.css === */
/* PARTS-CROSSES-r1 — OEM cross-reference chips and lists */
.part-card-v2-crosses,
.part-cross-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.part-card-v2-crosses{
  margin:7px 0 0;
}
.part-cross-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  max-width:100%;
  min-height:24px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text2);
  font-size:10.5px;
  font-weight:800;
  line-height:1.15;
}
.part-cross-chip b{
  color:var(--orange,#ff6b00);
  font-weight:900;
}
.part-cross-chip--oem{
  border-color:rgba(255,107,0,.28);
  background:rgba(255,107,0,.08);
}
.part-cross-chip--premium{
  border-color:rgba(34,197,94,.24);
  background:rgba(34,197,94,.07);
}
.part-cross-chip--analog{
  border-color:rgba(96,165,250,.24);
  background:rgba(96,165,250,.07);
}
.part-cross-chip--budget{
  border-color:rgba(245,158,11,.24);
  background:rgba(245,158,11,.07);
}
.part-cross-list{
  flex-direction:column;
}
.part-cross-row{
  display:grid;
  grid-template-columns:96px minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:var(--ui-radius-md,10px);
  border:1px solid var(--line);
  background:var(--surface);
}
.part-cross-row span{
  color:var(--orange,#ff6b00);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
}
.part-cross-row b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text1);
  font-size:13px;
}
.part-cross-row em{
  color:var(--text3);
  font-size:12px;
  font-style:normal;
}
@media(max-width:640px){
  .part-cross-row{
    grid-template-columns:1fr;
    gap:4px;
  }
  .part-cross-row b{
    white-space:normal;
  }
}

/* === SOURCE: css/parts_suppliers.css === */
/* PARTS-SUPPLIERS-r1 — supplier offers for part cards/details */
.part-card-v2-suppliers,
.part-supplier-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
.part-supplier-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  max-width:100%;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(148,163,184,.08);
  color:var(--text2);
  font-size:10.5px;
  line-height:1.2;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.part-supplier-chip b{
  color:var(--text1);
  font-weight:900;
}
.part-supplier-chip--stock{
  border-color:rgba(34,197,94,.28);
  background:rgba(34,197,94,.08);
}
.part-supplier-chip--order{
  border-color:rgba(245,158,11,.28);
  background:rgba(245,158,11,.08);
}
.part-supplier-list{
  flex-direction:column;
  gap:8px;
  margin-top:0;
}
.part-supplier-row{
  display:grid;
  grid-template-columns:minmax(120px,1fr) minmax(110px,.8fr) minmax(160px,1.2fr);
  gap:8px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
}
.part-supplier-row span{
  color:var(--text1);
  font-weight:900;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.part-supplier-row b{
  color:var(--orange,#ff6b00);
  font-weight:900;
}
.part-supplier-row em{
  color:var(--text3);
  font-style:normal;
  font-size:12px;
  font-weight:700;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media(max-width:680px){
  .part-supplier-row{
    grid-template-columns:1fr;
    gap:3px;
  }
  .part-supplier-row em{
    white-space:normal;
  }
}

/* === SOURCE: css/mcab_modal_fix.css === */
/* MCAB-MODAL-r1 — master cabinet modal viewport/scroll stabilization.
   Scope: only #mcab-modal; does not alter shared .k-sheet modals. */

#mcab-modal {
  align-items: center;
  justify-content: center;
  padding: clamp(10px, 2vw, 20px);
  overflow: hidden;
}

#mcab-modal .k-sheet {
  width: min(980px, calc(100vw - 40px));
  max-height: calc(100dvh - 40px);
  min-height: min(420px, calc(100dvh - 40px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ui-radius-lg, 18px);
}

#mcab-modal .k-sheet-drag {
  display: none;
}

#mcab-modal .k-sheet-head {
  flex: 0 0 auto;
  padding: 16px 18px 12px;
}

#mcab-modal .k-sheet-title {
  font-size: 17px;
  line-height: 1.2;
}

#mcab-modal .k-sheet-body {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 16px 20px max(20px, env(safe-area-inset-bottom));
}

#mcab-modal .k-sheet-body > .pf-section:first-child,
#mcab-modal .k-sheet-body > .card:first-child {
  margin-top: 0 !important;
}

#mcab-modal .k-sheet-body *,
#mcab-modal .k-sheet-body *::before,
#mcab-modal .k-sheet-body *::after {
  max-width: 100%;
  box-sizing: border-box;
}

#mcab-modal .k-sheet-body input,
#mcab-modal .k-sheet-body select,
#mcab-modal .k-sheet-body textarea {
  font-size: 16px;
}

@media (min-width: 1024px) {
  #mcab-modal .k-sheet {
    width: min(1040px, calc(100vw - 64px));
    max-height: calc(100dvh - 64px);
  }
}

@media (max-width: 640px) {
  #mcab-modal {
    align-items: flex-end;
    padding: 0;
  }

  #mcab-modal .k-sheet {
    width: 100%;
    min-height: 0;
    height: min(92dvh, calc(100dvh - env(safe-area-inset-top) - 8px));
    max-height: calc(100dvh - env(safe-area-inset-top) - 8px);
    border-radius: var(--ui-radius-lg, 18px) var(--ui-radius-lg, 18px) 0 0;
  }

  #mcab-modal .k-sheet-drag {
    display: block;
    margin-top: 8px;
  }

  #mcab-modal .k-sheet-head {
    padding: 10px 14px 10px;
    gap: 10px;
  }

  #mcab-modal .k-sheet-title {
    font-size: 16px;
  }

  #mcab-modal .k-sheet-close {
    width: 38px;
    height: 38px;
  }

  #mcab-modal .k-sheet-body {
    padding: 12px 12px max(18px, calc(12px + env(safe-area-inset-bottom)));
  }
}

@media (max-height: 560px) {
  #mcab-modal {
    padding: 6px;
  }

  #mcab-modal .k-sheet {
    min-height: 0;
    max-height: calc(100dvh - 12px);
  }

  #mcab-modal .k-sheet-head {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  #mcab-modal .k-sheet-body {
    padding-top: 10px;
  }
}

/* === SOURCE: css/master_desktop_refresh.css === */
/* MASTER-DESKTOP-r1
   Scope: master cabinet desktop clean-up and mcab modal contrast fixes.
   Goals:
   - remove excessive empty gutters on desktop
   - make navigation and content read as one clean layout
   - fix low-contrast text on active tiles / modal content
   - keep mobile and tablet safe
*/

.master-cabinet-shell{
  width:min(1180px, 100%);
  margin:0 auto 18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.master-cabinet-shell__hero,
.master-cabinet-shell__main,
.master-cabinet-shell__navcol,
.master-cabinet-shell__content{
  min-width:0;
}
.master-cabinet-shell__main{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.master-cabinet-hero,
.master-cabinet-section-head,
.master-cabinet-inline-panel{
  max-width:none;
}
.master-cabinet-hero,
.master-cabinet-section-head{
  margin-left:0;
  margin-right:0;
}
.master-cabinet-inline-panel{
  margin:0;
}

.master-cabinet-tile-nav .master-cabinet-tile,
.master-cabinet-inline-panel .card,
.master-cabinet-inline-panel .pf-section,
#mcab-modal .k-sheet-body .card,
#mcab-modal .k-sheet-body .pf-section{
  box-shadow:0 12px 28px rgba(15,23,42,.05);
}

.master-cabinet-tile-nav .master-cabinet-tile.active,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary{
  background:linear-gradient(135deg, rgba(255,107,0,.14), rgba(255,107,0,.05)), var(--surface) !important;
  color:var(--text1) !important;
  border-color:rgba(255,107,0,.28) !important;
  box-shadow:0 14px 32px rgba(255,107,0,.08), 0 10px 24px rgba(15,23,42,.04) !important;
}
.master-cabinet-tile-nav .master-cabinet-tile.active .mct-label,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-label{
  color:var(--text1) !important;
}
.master-cabinet-tile-nav .master-cabinet-tile.active .mct-desc,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-desc{
  color:var(--text2) !important;
}
.master-cabinet-tile-nav .master-cabinet-tile.active .mct-ico,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-ico{
  color:var(--orange, #ff6b00);
  background:rgba(255,107,0,.09);
  border-color:rgba(255,107,0,.18);
}
.master-cabinet-tile-nav .master-cabinet-tile.active .mct-badge,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary .mct-badge{
  background:rgba(255,107,0,.12);
  color:var(--orange, #ff6b00);
}

#mcab-modal,
#mcab-modal .k-sheet,
#mcab-modal .k-sheet-head,
#mcab-modal .k-sheet-body,
#mcab-modal .k-sheet-body .card,
#mcab-modal .k-sheet-body .pf-section{
  color:var(--text1);
}
#mcab-modal .k-sheet-body .muted,
#mcab-modal .k-sheet-body small,
#mcab-modal .k-sheet-body .text-muted,
#mcab-modal .k-sheet-body .hint,
#mcab-modal .k-sheet-body .field-hint{
  color:var(--text3);
}
#mcab-modal .k-sheet-body a:not(.btn),
.master-cabinet-inline-panel a:not(.btn){
  color:var(--orange, #ff6b00);
}
#mcab-modal .btn-outline,
.master-cabinet-inline-panel .btn-outline{
  color:var(--text1);
}
#mcab-modal input,
#mcab-modal select,
#mcab-modal textarea{
  color:var(--text1);
}
#mcab-modal input::placeholder,
#mcab-modal textarea::placeholder{
  color:var(--text3);
}

@media (min-width:1024px){
  .master-cabinet-shell{
    gap:18px;
  }
  .master-cabinet-shell__main{
    display:grid;
    grid-template-columns:320px minmax(0, 1fr);
    align-items:start;
    gap:18px;
  }
  .master-cabinet-shell__navcol{
    position:sticky;
    top:calc(var(--nav-h, 64px) + 14px);
  }
  .master-cabinet-tile-nav{
    grid-template-columns:1fr;
    max-width:none;
    margin:0;
    padding:0;
    gap:10px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:74px;
    padding:12px 14px;
    border-radius:var(--ui-radius-lg,18px);
  }
  .master-cabinet-hero{
    padding:18px 20px;
  }
  .master-cabinet-hero .mch-main{
    gap:16px;
  }
  .master-cabinet-hero .mch-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
  }
  .master-cabinet-hero .mch-actions{
    grid-template-columns:repeat(3, minmax(0, 180px));
    justify-content:start;
  }
  .master-cabinet-inline-panel .card,
  .master-cabinet-inline-panel .pf-section{
    border-radius:var(--ui-radius-lg,18px);
  }
  .master-cabinet-inline-panel > .pf-section,
  .master-cabinet-inline-panel > .card{
    margin-top:0 !important;
  }
  #mcab-modal .k-sheet{
    width:min(1180px, calc(100vw - 48px));
    max-height:min(92dvh, 980px);
    border-radius:24px;
  }
  #mcab-modal .k-sheet-head{
    padding:18px 22px;
    border-bottom:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,107,0,.06), rgba(255,107,0,0)), var(--surface);
  }
  #mcab-modal .k-sheet-title{
    font-size:20px;
    line-height:1.2;
  }
  #mcab-modal .k-sheet-body{
    padding:22px 24px 28px;
  }
  #mcab-modal .k-sheet-body > .pf-section,
  #mcab-modal .k-sheet-body > .card{
    border-radius:20px;
  }
}

@media (min-width:768px) and (max-width:1023px){
  .master-cabinet-shell{
    width:min(960px, 100%);
  }
  .master-cabinet-tile-nav,
  .master-cabinet-hero,
  .master-cabinet-section-head,
  .master-cabinet-inline-panel{
    max-width:none;
  }
}

/* === SOURCE: css/master_sections_refresh.css === */
/* MASTER-DESKTOP-r2
   Scope: inner master cabinet sections on PC and #mcab-modal content.
   This file intentionally avoids global card/button rewrites. */

.master-cabinet-inline-panel .mcab-section,
#mcab-modal .mcab-section{
  color:var(--text1);
}
.master-cabinet-inline-panel .mcab-section .t-meta,
#mcab-modal .mcab-section .t-meta,
.master-cabinet-inline-panel .mcab-section [style*="color:var(--text3)"],
#mcab-modal .mcab-section [style*="color:var(--text3)"]{
  color:var(--text3) !important;
}
.master-cabinet-inline-panel .mcab-section [style*="color:var(--text2)"],
#mcab-modal .mcab-section [style*="color:var(--text2)"]{
  color:var(--text2) !important;
}
.master-cabinet-inline-panel .mcab-section .btn-outline[style*="color:var(--text3)"],
#mcab-modal .mcab-section .btn-outline[style*="color:var(--text3)"]{
  color:var(--text1) !important;
}
.master-cabinet-inline-panel .mcab-section .pf-input,
#mcab-modal .mcab-section .pf-input{
  min-height:42px;
  background:var(--bg) !important;
  color:var(--text1) !important;
  border-color:var(--line) !important;
}
.master-cabinet-inline-panel .mcab-section textarea.pf-input,
#mcab-modal .mcab-section textarea.pf-input{
  min-height:92px;
}
.master-cabinet-inline-panel .mcab-section .pf-label,
#mcab-modal .mcab-section .pf-label{
  color:var(--text2) !important;
  font-size:11px;
  font-weight:900;
  letter-spacing:.05em;
}

@media (min-width:1024px){
  .master-cabinet-inline-panel .mcab-section,
  #mcab-modal .mcab-section{
    gap:14px !important;
  }

  /* Профиль: форма не должна быть узкой телефонной колонкой на ПК */
  .master-cabinet-inline-panel .mcab-section--profile .profile-form,
  #mcab-modal .mcab-section--profile .profile-form,
  .master-cabinet-inline-panel .mcab-section--settings .profile-form,
  #mcab-modal .mcab-section--settings .profile-form{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
    max-width:none !important;
    padding:0 !important;
  }
  .master-cabinet-inline-panel .mcab-section--profile .pf-group[style*="grid-column:1/-1"],
  #mcab-modal .mcab-section--profile .pf-group[style*="grid-column:1/-1"],
  .master-cabinet-inline-panel .mcab-section--settings .pf-group[style*="grid-column:1/-1"],
  #mcab-modal .mcab-section--settings .pf-group[style*="grid-column:1/-1"]{
    grid-column:1 / -1 !important;
  }
  .master-cabinet-inline-panel .mcab-section--profile > button.btn-primary,
  #mcab-modal .mcab-section--profile > button.btn-primary{
    width:auto !important;
    min-width:220px;
    align-self:flex-start;
  }

  /* Публикации: меньше пустоты в empty-state, карточки читаются плотнее */
  .master-cabinet-inline-panel .mcab-section--posts > div:first-child,
  #mcab-modal .mcab-section--posts > div:first-child{
    padding:14px 16px !important;
    margin-bottom:12px !important;
    border:1px solid var(--line);
    border-radius:var(--ui-radius-lg,18px);
    background:var(--surface);
  }
  .master-cabinet-inline-panel .mcab-section--posts > div:nth-child(2),
  #mcab-modal .mcab-section--posts > div:nth-child(2){
    margin-bottom:12px !important;
  }
  .master-cabinet-inline-panel .mcab-section--posts [style*="text-align:center"][style*="padding:48px"],
  #mcab-modal .mcab-section--posts [style*="text-align:center"][style*="padding:48px"]{
    padding:30px 24px !important;
    border:1px dashed var(--line);
    border-radius:var(--ui-radius-lg,18px);
    background:var(--surface);
  }
  .master-cabinet-inline-panel .posts-mgr-card,
  #mcab-modal .posts-mgr-card{
    border-radius:var(--ui-radius-lg,18px) !important;
    background:var(--surface) !important;
  }

  /* Статистика: единая плотность KPI на ПК */
  .master-cabinet-inline-panel .mcab-section--stats > div:first-child,
  #mcab-modal .mcab-section--stats > div:first-child{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:12px !important;
  }
  .master-cabinet-inline-panel .mcab-section--stats > div:first-child > div,
  #mcab-modal .mcab-section--stats > div:first-child > div{
    padding:16px 14px !important;
    border-radius:var(--ui-radius-lg,18px) !important;
    background:var(--surface) !important;
  }
  .master-cabinet-inline-panel .mcab-section--stats > div:not(:first-child),
  #mcab-modal .mcab-section--stats > div:not(:first-child){
    border-radius:var(--ui-radius-lg,18px) !important;
    padding:18px 20px !important;
  }

  /* Связь: две колонки вместо длинного вертикального списка на ПК */
  .master-cabinet-inline-panel .mcab-section--contacts,
  #mcab-modal .mcab-section--contacts{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    align-items:start;
  }
  .master-cabinet-inline-panel .mcab-section--contacts > div,
  #mcab-modal .mcab-section--contacts > div{
    padding:16px;
    border:1px solid var(--line);
    border-radius:var(--ui-radius-lg,18px);
    background:var(--surface);
    min-width:0;
  }
  .master-cabinet-inline-panel .mcab-section--contacts > div > div:last-child,
  #mcab-modal .mcab-section--contacts > div > div:last-child{
    gap:10px !important;
  }
  .master-cabinet-inline-panel .mcab-section--contacts [style*="display:flex"][style*="align-items:center"][style*="gap:12px"],
  #mcab-modal .mcab-section--contacts [style*="display:flex"][style*="align-items:center"][style*="gap:12px"]{
    padding:12px !important;
    border-radius:var(--ui-radius-md,10px) !important;
    background:var(--bg) !important;
  }

  /* Настройки: быстрые действия в сетку, география на всю ширину */
  .master-cabinet-inline-panel .mcab-section--settings,
  #mcab-modal .mcab-section--settings{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }
  .master-cabinet-inline-panel .mcab-section--settings > div,
  #mcab-modal .mcab-section--settings > div{
    min-width:0;
    border-radius:var(--ui-radius-lg,18px) !important;
    background:var(--surface) !important;
  }
  .master-cabinet-inline-panel .mcab-section--settings > div:last-child,
  #mcab-modal .mcab-section--settings > div:last-child{
    grid-column:1 / -1;
    padding:18px 20px !important;
  }
  .master-cabinet-inline-panel .mcab-section--settings > div:not(:last-child),
  #mcab-modal .mcab-section--settings > div:not(:last-child){
    padding:12px 14px !important;
  }
  .master-cabinet-inline-panel .mcab-section--settings > div:not(:last-child) .btn,
  #mcab-modal .mcab-section--settings > div:not(:last-child) .btn{
    min-width:104px;
  }

  /* История/аналитика из legacy HTML: нормализуем заголовочные карточки и KPI */
  .master-cabinet-inline-panel > .card:first-child,
  #mcab-modal .k-sheet-body > .card:first-child{
    border-radius:var(--ui-radius-lg,18px) !important;
    padding:18px 20px !important;
    margin-bottom:12px !important;
  }
  .master-cabinet-inline-panel > div[style*="display:grid"],
  #mcab-modal .k-sheet-body > div[style*="display:grid"]{
    gap:12px !important;
  }
  .master-cabinet-inline-panel > div[style*="display:grid"] > .card,
  #mcab-modal .k-sheet-body > div[style*="display:grid"] > .card{
    border-radius:var(--ui-radius-lg,18px) !important;
    padding:16px !important;
  }
}

@media (max-width:760px){
  .master-cabinet-inline-panel .mcab-section--settings .profile-form,
  #mcab-modal .mcab-section--settings .profile-form,
  .master-cabinet-inline-panel .mcab-section--profile .profile-form,
  #mcab-modal .mcab-section--profile .profile-form{
    grid-template-columns:1fr !important;
  }
  .master-cabinet-inline-panel .mcab-section--contacts,
  #mcab-modal .mcab-section--contacts,
  .master-cabinet-inline-panel .mcab-section--settings,
  #mcab-modal .mcab-section--settings{
    display:flex !important;
    flex-direction:column !important;
  }
}

/* === SOURCE: css/master_cabinet_r47_polish.css === */
/* MASTER-CABINET-r47 — post-onboarding master cabinet visual polish.
   Scope: master cabinet only. Does not change routes, API, DB, or onboarding flow. */

.master-cabinet-shell,
#mp-cabinet,
.master-cabinet-inline-panel,
.master-cabinet-hero,
.master-cabinet-tile-nav{
  min-width:0;
  box-sizing:border-box;
}

.master-cabinet-shell{
  --mc-orange:var(--orange,#ff6b00);
  --mc-soft:rgba(255,107,0,.08);
  --mc-soft-2:rgba(255,107,0,.14);
  --mc-line:rgba(15,23,42,.08);
}

.master-cabinet-hero{
  position:relative;
  overflow:hidden;
  border-radius:24px !important;
  border:1px solid var(--mc-line) !important;
  background:
    radial-gradient(circle at 92% 12%, rgba(255,107,0,.15), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,247,241,.92)) !important;
  box-shadow:0 20px 46px rgba(15,23,42,.08) !important;
}
.master-cabinet-hero::after{
  content:'';
  position:absolute;
  right:-70px;
  bottom:-88px;
  width:230px;
  height:230px;
  border-radius:999px;
  background:rgba(255,107,0,.08);
  pointer-events:none;
}
.master-cabinet-hero .mch-main,
.master-cabinet-hero .mch-grid,
.master-cabinet-hero .mch-actions{
  position:relative;
  z-index:1;
  min-width:0;
}
.master-cabinet-hero h1,
.master-cabinet-hero h2,
.master-cabinet-hero h3,
.master-cabinet-section-head h1,
.master-cabinet-section-head h2,
.master-cabinet-section-head h3{
  color:var(--text1,#111827) !important;
  letter-spacing:-.045em;
  overflow-wrap:anywhere;
}
.master-cabinet-hero p,
.master-cabinet-hero small,
.master-cabinet-section-head p,
.master-cabinet-section-head small{
  color:var(--text2,#4b5563) !important;
  overflow-wrap:anywhere;
}
.master-cabinet-hero .mch-grid > *,
.master-cabinet-hero [class*="stat"],
.master-cabinet-inline-panel .card,
.master-cabinet-inline-panel .pf-section,
.master-cabinet-inline-panel .mcab-section > div,
.master-cabinet-inline-panel .posts-mgr-card{
  min-width:0;
  border-color:var(--mc-line) !important;
}

.master-cabinet-tile-nav{
  display:grid;
  gap:12px;
}
.master-cabinet-tile-nav .master-cabinet-tile{
  min-width:0;
  border-radius:20px !important;
  border:1px solid var(--mc-line) !important;
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.055) !important;
  color:var(--text1,#111827) !important;
  align-items:center;
}
.master-cabinet-tile-nav .master-cabinet-tile:hover,
.master-cabinet-tile-nav .master-cabinet-tile:focus-visible{
  border-color:rgba(255,107,0,.24) !important;
  box-shadow:0 16px 34px rgba(15,23,42,.08),0 0 0 1px rgba(255,107,0,.10) !important;
}
.master-cabinet-tile-nav .master-cabinet-tile.active,
.master-cabinet-tile-nav .master-cabinet-tile.btn-primary{
  background:linear-gradient(135deg,rgba(255,107,0,.13),rgba(255,255,255,.92)) !important;
  border-color:rgba(255,107,0,.28) !important;
}
.master-cabinet-tile-nav .mct-ico,
.master-cabinet-inline-panel .cabinet-stat-ico,
.master-cabinet-inline-panel .master-cabinet-icon,
#mcab-modal .mct-ico,
#mcab-modal .cabinet-stat-ico,
#mcab-modal .master-cabinet-icon{
  flex:0 0 auto;
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:var(--mc-orange) !important;
  background:var(--mc-soft) !important;
  border:1px solid rgba(255,107,0,.18) !important;
  font-size:0 !important;
  line-height:1 !important;
}
.master-cabinet-tile-nav .mct-ico::before,
.master-cabinet-inline-panel .cabinet-stat-ico::before,
.master-cabinet-inline-panel .master-cabinet-icon::before,
#mcab-modal .mct-ico::before,
#mcab-modal .cabinet-stat-ico::before,
#mcab-modal .master-cabinet-icon::before{
  content:'';
  width:20px;
  height:20px;
  display:block;
  background:currentColor;
  -webkit-mask:var(--kr-ui-icon-user, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.6-4.4 4.2-6 8-6s6.4 1.6 8 6'/%3E%3C/svg%3E")) center / contain no-repeat;
  mask:var(--kr-ui-icon-user, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.6-4.4 4.2-6 8-6s6.4 1.6 8 6'/%3E%3C/svg%3E")) center / contain no-repeat;
}
.master-cabinet-tile-nav .mct-label,
.master-cabinet-tile-nav .mct-desc,
.master-cabinet-tile-nav .mct-badge,
.master-cabinet-inline-panel .card *,
.master-cabinet-inline-panel .pf-section *,
#mcab-modal .card *,
#mcab-modal .pf-section *{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}
.master-cabinet-tile-nav .mct-label{
  font-weight:900 !important;
  color:var(--text1,#111827) !important;
}
.master-cabinet-tile-nav .mct-desc{
  color:var(--text2,#4b5563) !important;
  line-height:1.35 !important;
}
.master-cabinet-tile-nav .mct-badge{
  border-radius:999px !important;
  color:var(--mc-orange) !important;
  background:rgba(255,107,0,.10) !important;
  border:1px solid rgba(255,107,0,.15) !important;
}

.master-cabinet-inline-panel{
  border-radius:24px;
}
.master-cabinet-inline-panel .mcab-section,
#mcab-modal .mcab-section{
  width:100%;
  min-width:0;
}
.master-cabinet-inline-panel .mcab-section .btn,
#mcab-modal .mcab-section .btn,
.master-cabinet-hero .btn,
.master-cabinet-tile-nav .btn{
  min-height:44px;
  border-radius:16px !important;
  font-weight:900 !important;
  white-space:normal !important;
  text-align:center;
  line-height:1.18;
}
.master-cabinet-inline-panel .mcab-section .btn-primary,
#mcab-modal .mcab-section .btn-primary,
.master-cabinet-hero .btn-primary{
  background:linear-gradient(135deg,#ff7a18,#ff5a00) !important;
  color:#fff !important;
  border-color:rgba(255,90,0,.42) !important;
  box-shadow:0 12px 26px rgba(255,90,0,.18) !important;
}
.master-cabinet-inline-panel .mcab-section .btn-outline,
#mcab-modal .mcab-section .btn-outline,
.master-cabinet-inline-panel .mcab-section .btn-ghost,
#mcab-modal .mcab-section .btn-ghost{
  background:rgba(255,255,255,.88) !important;
  color:var(--text1,#111827) !important;
  border-color:var(--mc-line) !important;
}
.master-cabinet-inline-panel .pf-input,
#mcab-modal .pf-input,
.master-cabinet-inline-panel input,
.master-cabinet-inline-panel select,
.master-cabinet-inline-panel textarea,
#mcab-modal input,
#mcab-modal select,
#mcab-modal textarea{
  border-radius:16px !important;
  min-height:46px;
  font-size:16px !important;
  line-height:1.35 !important;
}
.master-cabinet-inline-panel textarea,
#mcab-modal textarea{
  min-height:112px !important;
}

@media (min-width:768px){
  .master-cabinet-shell{
    width:min(100%, 1040px) !important;
    padding-left:24px;
    padding-right:24px;
  }
  .master-cabinet-hero{
    padding:24px !important;
  }
  .master-cabinet-hero .mch-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .master-cabinet-hero .mch-actions{
    display:flex !important;
    flex-wrap:wrap;
    gap:10px;
  }
  .master-cabinet-tile-nav{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .master-cabinet-inline-panel .mcab-section--profile .profile-form,
  .master-cabinet-inline-panel .mcab-section--settings .profile-form,
  #mcab-modal .mcab-section--profile .profile-form,
  #mcab-modal .mcab-section--settings .profile-form{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
}

@media (min-width:1024px){
  .master-cabinet-shell{
    width:min(100%, 1180px) !important;
  }
  .master-cabinet-shell__main{
    grid-template-columns:300px minmax(0,1fr) !important;
    gap:22px !important;
  }
  .master-cabinet-hero{
    padding:28px 30px !important;
  }
  .master-cabinet-hero h1,
  .master-cabinet-hero h2{
    font-size:clamp(28px,2.6vw,42px) !important;
  }
  .master-cabinet-tile-nav{
    grid-template-columns:1fr;
    gap:12px;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:86px !important;
    padding:16px !important;
  }
  .master-cabinet-inline-panel .mcab-section--stats > div:first-child,
  #mcab-modal .mcab-section--stats > div:first-child{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .master-cabinet-inline-panel .mcab-section--contacts,
  #mcab-modal .mcab-section--contacts,
  .master-cabinet-inline-panel .mcab-section--settings,
  #mcab-modal .mcab-section--settings{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (min-width:1200px){
  .master-cabinet-shell{
    width:min(100%, 1280px) !important;
  }
  .master-cabinet-shell__main{
    grid-template-columns:320px minmax(0,1fr) !important;
  }
}

@media (max-width:767px){
  .master-cabinet-shell{
    width:100% !important;
    padding-left:12px;
    padding-right:12px;
  }
  .master-cabinet-hero{
    border-radius:20px !important;
    padding:18px !important;
  }
  .master-cabinet-tile-nav{
    grid-template-columns:1fr;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:72px !important;
    padding:12px !important;
  }
  .master-cabinet-tile-nav .mct-ico,
  .master-cabinet-inline-panel .cabinet-stat-ico,
  .master-cabinet-inline-panel .master-cabinet-icon{
    width:38px !important;
    height:38px !important;
    border-radius:13px !important;
  }
  .master-cabinet-inline-panel .mcab-section .btn,
  #mcab-modal .mcab-section .btn{
    width:100%;
  }
}

@media (min-width:768px) and (max-height:760px) and (orientation:landscape){
  .master-cabinet-shell{
    padding-top:10px;
  }
  .master-cabinet-hero{
    padding:18px 20px !important;
  }
  .master-cabinet-tile-nav .master-cabinet-tile{
    min-height:68px !important;
    padding:10px 12px !important;
  }
  .master-cabinet-tile-nav .mct-desc{
    display:none;
  }
  .master-cabinet-inline-panel textarea,
  #mcab-modal textarea{
    min-height:84px !important;
  }
}

/* === SOURCE: css/sto_cabinet_r48_polish.css === */
/* STO-CABINET-r48 — polish for STO cabinet/dashboard.
   Scope: STO dashboard/dispatch only. No API/route/business logic changes. */
:root{
  --sto-r48-orange:#ff6a00;
  --sto-r48-orange-soft:rgba(255,106,0,.10);
  --sto-r48-line:rgba(15,23,42,.10);
  --sto-r48-text:#101821;
  --sto-r48-muted:#667085;
  --sto-r48-card:#fff;
}

body[data-role="sto"] .sto-dispatch-page,
.sto-dispatch-page{
  width:100%;
  max-width:1180px!important;
  margin:0 auto;
  padding:clamp(18px,3vw,34px) clamp(14px,3vw,32px) calc(var(--bnav-h,0px) + 34px)!important;
  box-sizing:border-box;
}

.sto-dispatch-page *{
  box-sizing:border-box;
  min-width:0;
}

.sto-dispatch-head{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding:24px;
  margin:0 0 18px;
  border:1px solid rgba(255,106,0,.14);
  border-radius:28px;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,106,0,.14), transparent 34%),
    linear-gradient(135deg, #fff 0%, #fff8f2 100%);
  box-shadow:0 16px 42px rgba(15,23,42,.08);
  overflow:hidden;
}
.sto-dispatch-head::after{
  content:'';
  position:absolute;
  right:-70px;
  top:-70px;
  width:220px;
  height:220px;
  border-radius:50%;
  border:36px solid rgba(255,106,0,.055);
  pointer-events:none;
}
.sto-dispatch-head > *{position:relative;z-index:1;}
.sto-dispatch-head .t-lbl{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,106,0,.10);
  border:1px solid rgba(255,106,0,.16);
  color:var(--sto-r48-orange);
  font-size:11px;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.sto-dispatch-title{
  margin:12px 0 0!important;
  color:var(--sto-r48-text);
  font-size:clamp(28px,3.2vw,44px)!important;
  line-height:1.02!important;
  font-weight:950!important;
  letter-spacing:-.055em;
  overflow-wrap:anywhere;
}
.sto-dispatch-sub{
  margin-top:10px!important;
  max-width:680px;
  color:var(--sto-r48-muted)!important;
  font-size:16px!important;
  line-height:1.45!important;
  font-weight:650;
}
.sto-dispatch-head-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.sto-dispatch-head-actions .btn,
.sto-section-head .btn,
.sto-row-btn,
.sto-btn{
  min-height:44px!important;
  border-radius:16px!important;
  font-size:14px!important;
  font-weight:900!important;
  line-height:1.15!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
.sto-dispatch-head-actions .btn-primary,
.sto-section-head .btn-primary,
.sto-row-btn.btn-primary,
.sto-btn.btn-primary{
  background:linear-gradient(180deg,#ff7a1a 0%,#ff5a00 100%)!important;
  border-color:rgba(255,90,0,.82)!important;
  color:#fff!important;
  box-shadow:0 12px 24px rgba(255,90,0,.18)!important;
}
.sto-dispatch-head-actions .btn-outline,
.sto-section-head .btn-outline,
.sto-row-btn.btn-outline,
.sto-btn.btn-outline{
  background:rgba(255,255,255,.88)!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#1f2937!important;
}

.sto-dispatch-sync{
  margin:0 0 18px!important;
  padding:12px 14px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.80)!important;
  border:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 10px 26px rgba(15,23,42,.045);
  color:#64748b!important;
  font-size:12px!important;
  line-height:1.35!important;
}
.sto-dispatch-sync span,
.sto-dispatch-sync-error{
  max-width:100%;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}

.sto-stat-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  margin:0 0 18px!important;
}
.sto-stat-card{
  position:relative;
  min-height:122px;
  display:grid;
  align-content:center;
  justify-items:start;
  gap:7px;
  padding:18px!important;
  text-align:left!important;
  border-radius:24px!important;
  border:1px solid rgba(15,23,42,.08)!important;
  background:linear-gradient(180deg,#fff 0%,#fffaf6 100%)!important;
  box-shadow:0 12px 30px rgba(15,23,42,.06);
  overflow:hidden;
}
.sto-stat-card::after{
  content:'';
  position:absolute;
  right:-24px;
  top:-24px;
  width:82px;
  height:82px;
  border-radius:50%;
  background:rgba(255,106,0,.08);
}
.sto-stat-ico,
.sto-order-ico,
.sto-dash-ico{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:rgba(255,106,0,.10);
  border:1px solid rgba(255,106,0,.16);
  color:var(--sto-r48-orange)!important;
  font-size:0!important;
  flex:0 0 auto;
}
.sto-stat-ico::before,
.sto-order-ico::before,
.sto-dash-ico::before{
  content:'';
  width:22px;
  height:22px;
  background:currentColor;
  -webkit-mask:var(--kr-icon-shop, none) center / contain no-repeat;
  mask:var(--kr-icon-shop, none) center / contain no-repeat;
}
.sto-stat-val{
  position:relative;
  z-index:1;
  color:#111827!important;
  font-size:34px!important;
  line-height:.95!important;
  font-weight:950!important;
  letter-spacing:-.04em;
}
.sto-stat-lbl{
  position:relative;
  z-index:1;
  color:#667085!important;
  font-size:13px!important;
  line-height:1.25!important;
  font-weight:800;
  overflow-wrap:anywhere;
}

.sto-section{
  margin:0 0 16px!important;
  border-radius:26px!important;
  border:1px solid rgba(15,23,42,.08)!important;
  background:rgba(255,255,255,.90)!important;
  box-shadow:0 12px 34px rgba(15,23,42,.055);
  overflow:hidden;
}
.sto-section-head{
  min-height:68px;
  padding:18px 20px!important;
  border-bottom:1px solid rgba(15,23,42,.07)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,250,246,.92));
  gap:12px;
  flex-wrap:wrap;
}
.sto-section-title{
  color:#111827!important;
  font-size:18px!important;
  line-height:1.15!important;
  font-weight:950!important;
  letter-spacing:-.03em;
  overflow-wrap:anywhere;
}
.sto-section-count{
  background:rgba(255,106,0,.12)!important;
  border:1px solid rgba(255,106,0,.20);
  color:var(--sto-r48-orange)!important;
}
.sto-order-row,
.sto-master-row{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center!important;
  gap:14px!important;
  min-height:76px;
  padding:14px 18px!important;
  border-bottom:1px solid rgba(15,23,42,.065)!important;
  background:rgba(255,255,255,.70);
}
.sto-order-row:last-child,
.sto-master-row:last-child{border-bottom:0!important;}
.sto-order-body,
.sto-master-body{
  min-width:0;
  display:grid;
  gap:5px;
}
.sto-order-name,
.sto-master-name{
  color:#111827!important;
  font-size:15px!important;
  line-height:1.25!important;
  font-weight:900!important;
  overflow-wrap:anywhere;
}
.sto-order-meta,
.sto-master-spec{
  color:#667085!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:650;
  overflow-wrap:anywhere;
}
.sto-lead-chips,
.sto-master-stats{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  min-width:0;
}
.sto-lead-chip,
.sto-badge{
  max-width:100%;
  min-height:24px;
  display:inline-flex!important;
  align-items:center;
  padding:4px 9px!important;
  border-radius:999px!important;
  font-size:11px!important;
  line-height:1.15!important;
  font-weight:850!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
.sto-badge--busy{
  background:rgba(255,106,0,.10)!important;
  color:var(--sto-r48-orange)!important;
  border-color:rgba(255,106,0,.18)!important;
}
.sto-badge--done{
  background:rgba(16,185,129,.10)!important;
  color:#059669!important;
  border-color:rgba(16,185,129,.18)!important;
}
.sto-master-av{
  width:48px!important;
  height:48px!important;
  border-radius:16px!important;
  background:rgba(255,106,0,.10)!important;
  border:1px solid rgba(255,106,0,.16);
  color:var(--sto-r48-orange)!important;
  font-size:16px!important;
  font-weight:950!important;
}
.sto-master-open{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px!important;
  border:1px solid rgba(15,23,42,.10)!important;
  background:#fff!important;
  color:var(--sto-r48-orange)!important;
  font-size:0!important;
}
.sto-master-open::before{
  content:'›';
  font-size:30px;
  line-height:1;
  font-weight:300;
}
.sto-order-actions{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.sto-row-btn{
  min-width:104px;
  padding:9px 12px!important;
}
.sto-empty-line{
  padding:22px!important;
  color:#667085!important;
  font-size:14px!important;
  line-height:1.5!important;
  overflow-wrap:anywhere;
}

#sto-accept-assign-modal .cmodal,
#sto-assign-order-modal .cmodal,
#sto-unassign-order-modal .cmodal,
#sto-invite-modal .cmodal{
  border-radius:26px!important;
  overflow:hidden;
}
#sto-accept-assign-modal .cmodal-head,
#sto-assign-order-modal .cmodal-head,
#sto-unassign-order-modal .cmodal-head,
#sto-invite-modal .cmodal-head{
  background:linear-gradient(180deg,#fff,#fff8f2)!important;
  border-bottom:1px solid rgba(15,23,42,.08)!important;
}
#sto-accept-assign-modal .cmodal-head h3,
#sto-assign-order-modal .cmodal-head h3,
#sto-unassign-order-modal .cmodal-head h3,
#sto-invite-modal .cmodal-head h3{
  color:#111827;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:950!important;
  overflow-wrap:anywhere;
}

@media (max-width:767px){
  .sto-dispatch-page{
    padding:16px 12px calc(var(--bnav-h,0px) + 22px)!important;
  }
  .sto-dispatch-head{
    grid-template-columns:1fr;
    padding:18px;
    border-radius:24px;
  }
  .sto-dispatch-title{font-size:26px!important;}
  .sto-dispatch-sub{font-size:14px!important;}
  .sto-dispatch-head-actions{
    width:100%;
    display:grid!important;
    grid-template-columns:1fr 1fr;
  }
  .sto-dispatch-head-actions .btn{width:100%;justify-content:center;}
  .sto-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
  .sto-stat-card{min-height:106px;padding:14px!important;border-radius:20px!important;}
  .sto-stat-val{font-size:27px!important;}
  .sto-stat-lbl{font-size:11.5px!important;}
  .sto-order-row,
  .sto-master-row{
    grid-template-columns:42px minmax(0,1fr);
    gap:10px!important;
    padding:13px 14px!important;
  }
  .sto-order-actions,
  .sto-master-stats{
    grid-column:1 / -1;
    width:100%;
    justify-content:stretch!important;
  }
  .sto-order-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .sto-row-btn{width:100%;min-width:0;font-size:12px!important;padding:9px 7px!important;}
  .sto-master-open{grid-column:1 / -1;width:100%;height:40px;}
  .sto-section-head{padding:15px!important;}
  .sto-section-title{font-size:16px!important;}
}

@media (min-width:768px){
  .sto-dispatch-page{max-width:1080px!important;}
  .sto-section-grid-r48{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
}
@media (min-width:1024px){
  .sto-dispatch-page{max-width:1240px!important;}
  .sto-stat-grid{gap:18px!important;}
  .sto-section{margin-bottom:18px!important;}
  .sto-order-row.sto-dispatch-row{
    grid-template-columns:52px minmax(0,1fr) minmax(220px,auto)!important;
  }
}
@media (min-width:1200px){
  .sto-dispatch-page{max-width:1320px!important;}
  .sto-dispatch-head{padding:30px 32px;}
  .sto-section-title{font-size:19px!important;}
}
@media (orientation:landscape) and (max-height:760px) and (min-width:768px){
  .sto-dispatch-page{padding-top:16px!important;}
  .sto-dispatch-head{padding:18px 22px;margin-bottom:12px;}
  .sto-dispatch-title{font-size:30px!important;margin-top:8px!important;}
  .sto-dispatch-sub{font-size:14px!important;margin-top:6px!important;}
  .sto-stat-card{min-height:96px;padding:14px!important;}
  .sto-section-head{min-height:58px;padding:14px 16px!important;}
  .sto-order-row,.sto-master-row{min-height:64px;padding:11px 14px!important;}
}

/* === SOURCE: css/parts_cards_standard.css === */
/* PARTS-CARDS-r1 — VIN/request flow and manufacturer options for parts cards */
.part-card-v2-makers{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  min-height:28px;
  margin-top:2px;
}
.part-maker-chip{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(255,107,0,.20);
  background:rgba(255,107,0,.075);
  color:var(--text2);
  font-size:10.5px;
  line-height:1.15;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.parts-vin-hint,
.parts-maker-hint,
.parts-card-standard-note{
  margin-top:6px;
  color:var(--text3);
  font-size:11.5px;
  line-height:1.45;
  font-weight:700;
}
.parts-card-standard-note{
  margin:8px 0 14px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface-a, rgba(255,255,255,.05));
}
.parts-vin-hint.ok{color:#16a34a}
.parts-vin-hint.warn{color:#d97706}
.parts-vin-input{text-transform:uppercase;letter-spacing:.04em;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}
.shop-part-form-grid{display:grid;grid-template-columns:1fr;gap:12px}
.shop-part-field-wide{grid-column:1/-1}
@media (min-width:760px){
  .shop-part-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .parts-order-modal-box{width:min(760px,96vw)!important;max-width:760px!important}
  .parts-order-modal-box .pof-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .parts-order-modal-box .pof-group{margin:0!important}
  .parts-order-modal-box .pof-group:first-child,
  .parts-order-modal-box .pof-group:last-child{grid-column:1/-1}
  .parts-order-modal-box .pof-textarea{min-height:92px}
}
@media (max-width:560px){
  .part-card-v2-makers{gap:4px;min-height:0}
  .part-maker-chip{font-size:10px;padding:4px 7px}
}

/* PARTS-CARDS-r2 — PartCardDTO output guards */
.part-card-v2[data-oem]:not([data-oem=""]) .part-card-v2-sku{
  color:var(--text2);
}
.part-card-v2 .part-card-v2-sku{
  overflow-wrap:anywhere;
}
.parts-cart-modal__sub .parts-cart-oem,
.part-card-dto-chip{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--surface-a, rgba(255,255,255,.05));
  color:var(--text2);
  font-size:10.5px;
  font-weight:800;
}

/* === SOURCE: css/parts_fitment.css === */
/* PARTS-FITMENT-r1 — scoped fitment UI for part cards and shop part form */
.part-fitment-vin-chip{
  display:inline-flex;
  align-items:center;
  width:100%;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  border:1px dashed rgba(255,107,0,.32);
  background:rgba(255,107,0,.07);
  color:var(--text2);
  font-size:11px;
  font-weight:800;
  line-height:1.25;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.part-card-v2-bottomline--fitment .part-card-v2-chip{
  border-color:rgba(34,197,94,.22);
  background:rgba(34,197,94,.06);
  color:var(--text2);
}
.shop-part-fitment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-lg,18px);
  background:var(--surface-a, rgba(255,255,255,.04));
}
.shop-part-fitment-grid .shop-part-field-wide{
  grid-column:1/-1;
}
.product-specs__grid--shop .product-spec strong{
  overflow:hidden;
  text-overflow:ellipsis;
}
@media(max-width:680px){
  .shop-part-fitment-grid{
    grid-template-columns:1fr;
    gap:9px;
    padding:10px;
  }
  .part-fitment-vin-chip{
    font-size:10.5px;
    min-height:26px;
  }
}

/* PARTS-FITMENT-r2 — many-to-many applicability chips/list */
.part-card-v2-fitments{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:7px;
}
.part-fitment-chip{
  display:inline-flex;
  align-items:center;
  min-width:0;
  max-width:100%;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(52,211,153,.22);
  background:rgba(52,211,153,.08);
  color:var(--text2);
  font-size:10.5px;
  font-weight:800;
  line-height:1.2;
}
.part-fitment-list{
  display:grid;
  gap:8px;
}
.part-fitment-row{
  display:grid;
  grid-template-columns:minmax(130px,.8fr) minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--surface);
  color:var(--text1);
}
.part-fitment-row b{font-size:12px;color:var(--text1);}
.part-fitment-row span{font-size:11px;color:var(--text2);font-weight:700;}
.part-fitment-row em{font-style:normal;font-size:10.5px;color:var(--text3);font-weight:800;}
@media(max-width:680px){
  .part-fitment-row{grid-template-columns:1fr;gap:4px;}
  .part-fitment-chip{font-size:10px;}
}

/* === SOURCE: css/parts_request_flow.css === */
/* PARTS-REQUEST-r1 — VIN → OEM → analogs → suppliers → client offer flow */
.parts-request-grid{
  display:grid;
  grid-template-columns:1fr 120px;
  gap:10px;
}
.parts-request-flow{
  margin:8px 0 0;
  padding:12px;
  border:1px solid rgba(255,107,0,.20);
  border-radius:var(--ui-radius-lg,18px);
  background:linear-gradient(135deg,rgba(255,107,0,.075),rgba(96,165,250,.055)),var(--surface);
}
.parts-request-flow__head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  margin-bottom:10px;
}
.parts-request-flow__head b{
  color:var(--text1);
  font-size:13px;
}
.parts-request-flow__head span{
  color:var(--text3);
  font-size:11px;
  font-weight:700;
  text-align:right;
}
.parts-request-steps{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;
  margin-bottom:10px;
}
.parts-request-steps span{
  min-width:0;
  padding:6px 7px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.05);
  color:var(--text2);
  font-size:10px;
  font-weight:800;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.parts-request-offers{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:var(--text2);
  font-size:12px;
}
.parts-request-empty{
  padding:10px;
  border:1px dashed var(--line);
  border-radius:var(--ui-radius-md,10px);
  color:var(--text3);
  line-height:1.45;
}
.parts-request-offer-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:var(--ui-radius-md,10px);
  background:var(--bg);
}
.parts-request-offer-row div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.parts-request-offer-row b{
  color:var(--text1);
  font-size:12px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.parts-request-offer-row span,
.parts-request-offer-row em{
  color:var(--text3);
  font-size:10.5px;
  font-style:normal;
  line-height:1.35;
}
.parts-request-offer-row strong{
  flex:0 0 auto;
  color:var(--orange,#ff6b00);
  font-size:12px;
  white-space:nowrap;
}
@media(max-width:680px){
  .parts-request-grid{grid-template-columns:1fr;}
  .parts-request-steps{grid-template-columns:repeat(2,minmax(0,1fr));}
  .parts-request-flow__head{flex-direction:column;}
  .parts-request-flow__head span{text-align:left;}
  .parts-request-offer-row{flex-direction:column;}
}

/* === SOURCE: css/parts_request_manager.css === */
/* PARTS-REQUEST-r2 — manager offer builder for parts requests */
.parts-offer-panel{position:relative}
.parts-offer-status{display:inline-flex;align-items:center;gap:6px;margin:2px 0 10px;padding:6px 10px;border-radius:999px;background:rgba(255,107,0,.09);border:1px solid rgba(255,107,0,.22);font-size:12px;font-weight:800;color:var(--orange)}
.parts-offer-help{font-size:12px;line-height:1.55;color:var(--text3);margin-bottom:12px;padding:10px 12px;border:1px dashed rgba(148,163,184,.32);border-radius:var(--ui-radius-md,10px);background:rgba(148,163,184,.06)}
.parts-offer-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:10px;margin-bottom:10px}
.parts-offer-grid label,.parts-offer-lines{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:900;color:var(--text3);text-transform:uppercase;letter-spacing:.04em}
.parts-offer-grid input,.parts-offer-lines textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface);color:var(--text1);padding:10px 12px;font:700 13px/1.4 Mulish,system-ui,sans-serif;outline:none;text-transform:none;letter-spacing:0}
.parts-offer-lines textarea{min-height:132px;resize:vertical;white-space:pre;overflow:auto}
.parts-offer-grid input:focus,.parts-offer-lines textarea:focus{border-color:rgba(255,107,0,.42);box-shadow:0 0 0 3px rgba(255,107,0,.10)}
.parts-offer-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px}
.parts-offer-local{display:flex;flex-direction:column;gap:6px;margin-top:10px;font-size:12px;color:var(--text2)}
.parts-offer-local b{color:var(--text1)}
.parts-offer-local span{padding:8px 10px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--bg2)}
.parts-offer-items{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.parts-offer-item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--ui-radius-md,10px);background:var(--surface)}
.parts-offer-item b{display:block;font-size:13px;color:var(--text1)}
.parts-offer-item span{display:block;margin-top:3px;font-size:11px;line-height:1.45;color:var(--text3)}
.parts-offer-item strong{white-space:nowrap;color:var(--orange);font-family:Oswald,system-ui,sans-serif;font-size:16px}
.parts-offer-empty{padding:14px;border:1px dashed rgba(148,163,184,.32);border-radius:var(--ui-radius-md,10px);font-size:12px;color:var(--text3);background:rgba(148,163,184,.06)}
.parts-offer-note{margin-top:10px;padding:10px 12px;border-left:3px solid var(--orange);border-radius:var(--ui-radius-sm,5px);background:rgba(255,107,0,.06);font-size:12px;line-height:1.55;color:var(--text2)}
@media(max-width:680px){.parts-offer-grid{grid-template-columns:1fr}.parts-offer-actions{display:grid;grid-template-columns:1fr}.parts-offer-actions .btn{width:100%;justify-content:center}.parts-offer-item{flex-direction:column}.parts-offer-item strong{white-space:normal}}

/* === SOURCE: css/services_lite.css === */
/* SERVICES-MOBILE-r1
   KARETA #services compact app-like design based on the provided reference.
   Scope: only .services-lite-page.
*/
.services-lite-page{
  min-height:calc(100dvh - var(--nav-h, 0px));
  background:#ffffff;
  color:#111827;
  padding:0 0 calc(88px + env(safe-area-inset-bottom));
}
.services-lite-shell{
  width:min(430px, 100%);
  margin:0 auto;
  padding:14px 16px 18px;
  box-sizing:border-box;
}
.services-lite-head{
  padding:4px 0 10px;
}
.services-lite-logo{
  font-family:Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight:900;
  letter-spacing:.01em;
  font-size:20px;
  line-height:1;
  color:#111827;
  margin:0 0 18px;
}
.services-lite-logo span{
  color:#f5b400;
}
.services-lite-head h1{
  margin:0;
  color:#111827;
  font-family:Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight:800;
  font-size:22px;
  line-height:1.08;
  letter-spacing:-.03em;
}
.services-lite-search{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 42px;
  gap:8px;
  align-items:center;
  margin:8px 0 20px;
}
.services-lite-search input{
  width:100%;
  height:38px;
  border:0;
  border-radius:6px;
  background:#f1f1f1;
  color:#111827;
  padding:0 12px 0 34px;
  font-size:12px;
  font-weight:600;
  outline:none;
  box-shadow:none;
  background-image:linear-gradient(transparent,transparent);
  position:relative;
}
.services-lite-search::before{
  content:'⌕';
  position:absolute;
  z-index:1;
  margin-left:12px;
  margin-top:0;
  color:#9ca3af;
  font-size:17px;
  line-height:38px;
  pointer-events:none;
}
.services-lite-search input::placeholder{
  color:#9ca3af;
  opacity:1;
}
.services-lite-search button{
  width:42px;
  height:38px;
  border:0;
  border-radius:6px;
  background:#f5bf00;
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  font-weight:900;
  box-shadow:0 8px 16px rgba(245,191,0,.22);
  cursor:pointer;
}
.services-lite-search button:active{
  transform:translateY(1px);
}
.services-lite-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
}
.services-lite-card{
  position:relative;
  min-height:76px;
  border:0;
  border-radius:8px;
  background:#f4f4f4;
  color:#111827;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:10px 6px 9px;
  text-align:center;
  box-shadow:0 6px 14px rgba(15,23,42,.055);
  cursor:pointer;
  transition:transform .14s ease, box-shadow .14s ease, background .14s ease;
}
.services-lite-card:hover{
  transform:translateY(-1px);
  background:#eeeeee;
  box-shadow:0 10px 20px rgba(15,23,42,.08);
}
.services-lite-card:focus-visible{
  outline:2px solid #f5bf00;
  outline-offset:2px;
}
.services-lite-card__icon{
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#111827;
  font-size:22px;
  line-height:1;
  filter:grayscale(.15) contrast(1.05);
}
.services-lite-card__label{
  display:block;
  color:#111827;
  font-size:11px;
  line-height:1.1;
  font-weight:800;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.services-lite-card__count{
  position:absolute;
  top:5px;
  right:6px;
  min-width:16px;
  height:16px;
  border-radius:999px;
  background:#fff;
  color:#6b7280;
  border:1px solid #e5e7eb;
  font-size:9px;
  line-height:14px;
  font-weight:800;
}
.services-lite-empty{
  display:none;
  margin:16px 0 0;
  padding:12px;
  border-radius:10px;
  background:#f7f7f7;
  color:#6b7280;
  font-size:12px;
  font-weight:700;
  text-align:center;
}
[data-theme="dark"] .services-lite-page{
  background:#ffffff;
  color:#111827;
}
[data-theme="dark"] .services-lite-logo,
[data-theme="dark"] .services-lite-head h1,
[data-theme="dark"] .services-lite-card,
[data-theme="dark"] .services-lite-card__label,
[data-theme="dark"] .services-lite-card__icon,
[data-theme="dark"] .services-lite-search input{
  color:#111827;
}
@media (min-width:768px){
  .services-lite-page{
    background:linear-gradient(180deg,#ffffff 0%,#f7f7f7 100%);
    padding-top:18px;
  }
  .services-lite-shell{
    border-radius:24px;
    background:#ffffff;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
    border:1px solid #f0f0f0;
    padding:22px 22px 24px;
  }
}
@media (max-width:360px){
  .services-lite-shell{padding-left:12px;padding-right:12px;}
  .services-lite-grid{gap:9px;}
  .services-lite-card{min-height:70px;}
  .services-lite-head h1{font-size:21px;}
}

/* === SOURCE: css/services_lite_r2.css === */
/* SERVICES-MOBILE-r2
   Refines #services to be closer to the provided light mobile reference.
   - replace emoji look with monochrome outline SVG icons
   - cleaner search button/icon
   - lighter, flatter cards
   - less visual noise on counts
*/
.services-lite-shell{
  width:min(420px, 100%);
  padding:14px 14px 18px;
}
.services-lite-head{
  padding:2px 0 8px;
}
.services-lite-logo{
  margin-bottom:16px;
  font-size:19px;
}
.services-lite-head h1{
  font-size:20px;
  line-height:1.1;
}
.services-lite-search{
  grid-template-columns:minmax(0,1fr) 40px;
  gap:7px;
  margin:10px 0 18px;
}
.services-lite-search input,
.services-lite-search button{
  height:36px;
  border-radius:6px;
}
.services-lite-search::before{
  line-height:36px;
}
.services-lite-search button{
  box-shadow:none;
  background:#f2c200;
}
.services-lite-search button svg{
  width:17px;
  height:17px;
  stroke:#111827;
  stroke-width:2.1;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.services-lite-grid{
  gap:10px;
}
.services-lite-card{
  min-height:74px;
  border-radius:7px;
  background:#f3f3f3;
  box-shadow:none;
  gap:6px;
  padding:10px 5px 8px;
}
.services-lite-card:hover{
  background:#ededed;
  box-shadow:none;
  transform:none;
}
.services-lite-card__icon{
  width:26px;
  height:26px;
}
.services-lite-card__icon svg{
  width:24px;
  height:24px;
  display:block;
  stroke:#111827;
  stroke-width:1.8;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.services-lite-card__label{
  font-size:10.5px;
  line-height:1.15;
  font-weight:700;
  white-space:normal;
  text-overflow:clip;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  min-height:24px;
}
.services-lite-card__count{
  display:none;
}
@media (min-width:768px){
  .services-lite-shell{
    width:min(460px, 100%);
    padding:20px 20px 24px;
  }
}

/* === SOURCE: css/services_lite_r3.css === */
/* SERVICES-MOBILE-r3
   Pixel rhythm pass for #services based on the supplied reference screenshot.
   Scope: only .services-lite-page, visual-only. Existing routing and flows stay unchanged.
*/
.services-lite-page{
  background:#fff !important;
}
.services-lite-shell{
  width:min(390px, 100%);
  padding:8px 7px 18px;
}
.services-lite-head{
  padding:0 0 7px;
}
.services-lite-logo{
  margin:0 0 17px;
  font-size:18px;
  line-height:1;
  letter-spacing:-.01em;
}
.services-lite-head h1{
  max-width:220px;
  margin:0;
  font-size:18px;
  line-height:1.07;
  letter-spacing:-.035em;
  font-weight:900;
}
.services-lite-search{
  grid-template-columns:minmax(0,1fr) 30px;
  gap:5px;
  margin:7px 0 14px;
}
.services-lite-search input{
  height:28px;
  border-radius:4px;
  background:#f1f1f1;
  padding-left:27px;
  padding-right:8px;
  font-size:9.5px;
  font-weight:700;
}
.services-lite-search::before{
  content:'';
  width:12px;
  height:12px;
  left:9px;
  top:8px;
  margin:0;
  line-height:1;
  border:1.8px solid #a8a8a8;
  border-radius:50%;
  box-sizing:border-box;
}
.services-lite-search::after{
  content:'';
  position:absolute;
  left:20px;
  top:19px;
  width:6px;
  height:1.8px;
  background:#a8a8a8;
  border-radius:99px;
  transform:rotate(45deg);
  pointer-events:none;
}
.services-lite-search button{
  width:30px;
  height:28px;
  border-radius:4px;
  background:#f3bf00;
}
.services-lite-search button svg{
  width:14px;
  height:14px;
  stroke-width:2.3;
}
.services-lite-grid{
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:7px;
}
.services-lite-card{
  min-height:58px;
  border-radius:5px;
  background:#f2f2f2;
  gap:4px;
  padding:7px 4px 6px;
}
.services-lite-card:active{
  transform:scale(.985);
  background:#ececec;
}
.services-lite-card__icon{
  width:22px;
  height:22px;
}
.services-lite-card__icon svg{
  width:22px;
  height:22px;
  stroke-width:1.7;
}
.services-lite-card__label{
  min-height:auto;
  font-size:8.5px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.01em;
  -webkit-line-clamp:1;
}
.services-lite-empty{
  margin-top:10px;
  padding:9px;
  border-radius:6px;
  font-size:10px;
}
@media (min-width:430px) and (max-width:767px){
  .services-lite-shell{
    width:min(430px,100%);
    padding-left:12px;
    padding-right:12px;
  }
  .services-lite-card{
    min-height:66px;
  }
  .services-lite-card__label{
    font-size:10px;
  }
}
@media (min-width:768px){
  .services-lite-page{
    padding-top:16px;
    background:linear-gradient(180deg,#fff 0%,#f7f7f7 100%) !important;
  }
  .services-lite-shell{
    width:min(430px,100%);
    padding:18px 18px 22px;
    border-radius:22px;
  }
  .services-lite-logo{font-size:19px;}
  .services-lite-head h1{font-size:21px;max-width:260px;}
  .services-lite-search{grid-template-columns:minmax(0,1fr) 38px;gap:7px;margin:9px 0 16px;}
  .services-lite-search input,.services-lite-search button{height:34px;border-radius:6px;}
  .services-lite-search button{width:38px;}
  .services-lite-grid{gap:10px;}
  .services-lite-card{min-height:72px;border-radius:7px;}
  .services-lite-card__label{font-size:10.5px;}
}
@media (max-width:340px){
  .services-lite-shell{padding-left:6px;padding-right:6px;}
  .services-lite-grid{gap:6px;}
  .services-lite-card{min-height:55px;}
  .services-lite-head h1{font-size:17px;}
}

/* === SOURCE: css/services_app_reference.css === */
/* SERVICES-APP-r1
   Full #services mobile app reference pass:
   home, category list, repair list and request form.
   Scoped to .services-app-page only.
*/
.services-app-page{
  min-height:calc(100dvh - var(--nav-h, 0px));
  background:#fff;
  color:#101114;
  padding:0 0 calc(82px + env(safe-area-inset-bottom));
  font-family:Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
.services-app-page *{box-sizing:border-box;}
.services-app-phone{
  width:min(430px, 100%);
  margin:0 auto;
  padding:16px 16px 18px;
}
.services-app-home-head{padding:2px 0 10px;}
.services-app-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;}
.services-app-logo{font-size:22px;line-height:1;font-weight:900;letter-spacing:.01em;color:#050505;}
.services-app-logo span{color:#f5ae00;}
.services-app-icon-btn{
  width:34px;height:34px;border:0;background:transparent;color:#1f2937;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.services-app-icon-btn svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.services-app-home-head h1{
  margin:0;
  font-size:21px;
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.03em;
  color:#101114;
}
.services-app-search{
  display:grid;
  grid-template-columns:22px minmax(0,1fr) 40px;
  align-items:center;
  gap:0;
  height:38px;
  margin:10px 0 18px;
}
.services-app-search--wide{grid-template-columns:26px minmax(0,1fr);margin:12px 0 16px;height:38px;background:#f3f3f3;border-radius:8px;padding:0 10px;}
.services-app-search > span{
  height:38px;
  border-radius:8px 0 0 8px;
  background:#f3f3f3;
  display:flex;align-items:center;justify-content:flex-end;color:#9ca3af;padding-left:10px;
}
.services-app-search svg{width:17px;height:17px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.services-app-search input{
  width:100%;height:38px;border:0;outline:none;background:#f3f3f3;color:#111827;font-size:12px;font-weight:700;padding:0 10px;border-radius:0 8px 8px 0;
}
.services-app-search--wide > span,.services-app-search--wide input{background:transparent;border-radius:0;padding:0;}
.services-app-search input::placeholder{color:#a1a1aa;opacity:1;}
.services-app-search button{
  width:38px;height:38px;margin-left:8px;border:0;border-radius:8px;background:#ffb300;color:#101114;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 18px rgba(255,179,0,.24);
}
.services-app-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 18px;}
.services-app-tile{
  min-height:70px;border:0;border-radius:8px;background:#f3f3f3;color:#101114;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:9px 4px 7px;cursor:pointer;box-shadow:none;
}
.services-app-tile:active,.services-app-list-card:active,.services-app-field:active{transform:translateY(1px);}
.services-app-tile__icon,.services-app-list-icon,.services-app-selected-card span{
  display:flex;align-items:center;justify-content:center;color:#101114;flex-shrink:0;
}
.services-app-tile__icon{width:28px;height:28px;}
.services-app-tile svg,.services-app-list-icon svg,.services-app-selected-card svg{
  width:26px;height:26px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;
}
.services-app-tile__label{font-size:11px;line-height:1.1;font-weight:800;color:#101114;}
.services-app-empty{margin-top:10px;}
.services-app-nearby{margin-top:3px;}
.services-app-section-row{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px;}
.services-app-section-row b{font-size:13px;font-weight:900;color:#101114;}
.services-app-section-row button{border:0;background:transparent;color:#101114;font-size:11px;font-weight:700;cursor:pointer;}
.services-app-shop-card{
  width:100%;min-height:76px;border:1px solid #ececec;border-radius:10px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.07);display:grid;grid-template-columns:58px minmax(0,1fr) 26px;gap:10px;align-items:center;padding:9px;text-align:left;color:#101114;cursor:pointer;
}
.services-app-shop-photo{width:58px;height:58px;border-radius:9px;background:linear-gradient(135deg,#18181b,#52525b);position:relative;overflow:hidden;}
.services-app-shop-photo::after{content:'🚘';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:26px;filter:grayscale(1);}
.services-app-shop-body{min-width:0;display:flex;flex-direction:column;gap:3px;}
.services-app-shop-body strong{font-size:13px;line-height:1.15;color:#101114;font-weight:900;}
.services-app-shop-body em{font-size:11px;line-height:1.2;color:#101114;font-style:normal;font-weight:700;}
.services-app-shop-body small{font-size:10.5px;line-height:1.25;color:#6b7280;font-weight:700;}
.services-app-heart{font-size:22px;color:#111827;text-align:center;}
.services-app-nav-head{height:38px;display:flex;align-items:center;gap:12px;margin:0 0 10px;}
.services-app-nav-head button{width:30px;height:30px;border:0;background:transparent;color:#101114;font-size:28px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}
.services-app-nav-head h1{margin:0;color:#101114;font-size:17px;line-height:1.2;font-weight:900;letter-spacing:-.01em;}
.services-app-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 14px;scrollbar-width:none;}
.services-app-chips::-webkit-scrollbar{display:none;}
.services-app-chips button{flex:0 0 auto;border:0;border-radius:8px;background:#f0f0f0;color:#101114;font-size:11px;font-weight:800;padding:8px 14px;cursor:pointer;}
.services-app-chips button.active{background:#ffb300;color:#101114;}
.services-app-list{display:flex;flex-direction:column;gap:9px;padding-bottom:64px;}
.services-app-list-card{
  width:100%;min-height:82px;border:1px solid #ececec;border-radius:10px;background:#fff;color:#101114;box-shadow:0 8px 24px rgba(15,23,42,.065);display:grid;grid-template-columns:50px minmax(0,1fr) 20px;gap:12px;align-items:center;text-align:left;padding:12px;cursor:pointer;
}
.services-app-list-icon{width:46px;height:46px;}
.services-app-list-icon svg{width:32px;height:32px;stroke-width:1.65;}
.services-app-list-body{min-width:0;display:flex;flex-direction:column;gap:2px;}
.services-app-list-body strong{font-size:13px;line-height:1.15;color:#101114;font-weight:900;}
.services-app-list-body em{font-size:11.5px;line-height:1.32;color:#6b7280;font-style:normal;font-weight:700;}
.services-app-list-body b{font-size:12px;line-height:1.2;color:#101114;font-weight:900;}
.services-app-chevron{font-size:26px;color:#101114;line-height:1;text-align:right;}
.services-app-bottom-cta,.services-app-submit{
  width:100%;height:44px;border:0;border-radius:8px;background:#ffb300;color:#101114;font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 22px rgba(255,179,0,.24);
}
.services-app-bottom-cta{position:sticky;bottom:calc(70px + env(safe-area-inset-bottom));margin-top:8px;}
.services-app-form{display:flex;flex-direction:column;gap:9px;}
.services-app-form-label{font-size:11px;font-weight:900;color:#101114;margin:7px 0 -3px;}
.services-app-selected-card,.services-app-field{
  width:100%;border:1px solid #ececec;border-radius:9px;background:#fff;color:#101114;box-shadow:0 6px 18px rgba(15,23,42,.055);display:flex;align-items:center;text-align:left;
}
.services-app-selected-card{min-height:62px;gap:12px;padding:11px 13px;}
.services-app-selected-card span{width:36px;height:36px;}
.services-app-selected-card b{font-size:12.5px;line-height:1.2;font-weight:900;flex:1;min-width:0;color:#101114;}
.services-app-selected-card em{font-style:normal;font-size:12px;font-weight:900;color:#101114;white-space:nowrap;}
.services-app-field{height:38px;border:1px solid #eeeeee;padding:0 11px;justify-content:space-between;cursor:pointer;}
.services-app-field span{font-size:12px;font-weight:700;color:#101114;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.services-app-field b{font-size:20px;line-height:1;color:#101114;}
.services-app-textarea{min-height:86px;resize:vertical;border:1px solid #eeeeee;border-radius:9px;background:#fff;color:#101114;padding:12px;font-size:12px;font-weight:700;outline:none;box-shadow:0 6px 18px rgba(15,23,42,.045);}
.services-app-textarea::placeholder{color:#a1a1aa;}
.services-app-submit{margin-top:7px;}
.services-app-form-note{text-align:center;color:#9ca3af;font-size:11px;font-weight:700;margin-top:0;}
[data-theme="dark"] .services-app-page{background:#fff;color:#101114;}
@media (min-width:768px){
  .services-app-page{background:linear-gradient(180deg,#fff 0%,#f5f5f5 100%);padding-top:20px;}
  .services-app-phone{background:#fff;border:1px solid #f1f1f1;border-radius:28px;box-shadow:0 24px 80px rgba(15,23,42,.12);padding:24px 20px 22px;}
}
@media (max-width:360px){
  .services-app-phone{padding-left:12px;padding-right:12px;}
  .services-app-grid{gap:8px;}
  .services-app-tile{min-height:66px;}
  .services-app-home-head h1{font-size:20px;}
}

/* === SOURCE: css/services_app_phone_adaptive_r38.css === */
/* SERVICES-APP-PHONE-r38
   Scope: .services-app-page / .services-app-phone only.
   Goal: адаптация services-app-phone под телефоны, планшеты и wide preview без изменения JS/API flow.
*/
.services-app-page{
  --svc-phone-max:430px;
  --svc-pad-x:16px;
  --svc-card-radius:10px;
  --svc-gap:10px;
}
.services-app-phone{
  width:min(var(--svc-phone-max), 100%);
  max-width:var(--svc-phone-max);
  margin-inline:auto;
}
.services-app-page .services-app-phone{
  overflow-x:hidden;
}
.services-app-search input,
.services-app-textarea,
.services-app-field,
.services-app-submit,
.services-app-bottom-cta{
  min-font-size:16px;
}

/* Телефоны: полный экран без горизонтального переполнения */
@media (max-width:767px){
  .services-app-page{
    --svc-phone-max:100%;
    --svc-pad-x:clamp(12px,4vw,18px);
    padding-inline:0;
    padding-bottom:calc(84px + env(safe-area-inset-bottom));
    background:#fff;
  }
  .services-app-phone{
    width:100%;
    max-width:none;
    padding-left:var(--svc-pad-x);
    padding-right:var(--svc-pad-x);
    border-radius:0;
    box-shadow:none;
  }
  .services-app-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(8px,2.6vw,12px);
  }
  .services-app-tile{
    min-height:clamp(68px,20vw,84px);
    border-radius:12px;
  }
  .services-app-list-card,
  .services-app-shop-card,
  .services-app-selected-card,
  .services-app-field,
  .services-app-textarea{
    border-radius:12px;
  }
  .services-app-search,
  .services-app-search input,
  .services-app-search > span,
  .services-app-search button{
    height:42px;
  }
  .services-app-search input,
  .services-app-textarea{
    font-size:16px;
  }
  .services-app-submit,
  .services-app-bottom-cta{
    min-height:48px;
    height:auto;
    font-size:15px;
    border-radius:12px;
  }
}

/* Узкие телефоны: не давить карточки */
@media (max-width:374px){
  .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .services-app-tile{
    min-height:74px;
  }
  .services-app-home-head h1{
    font-size:20px;
  }
  .services-app-list-card{
    grid-template-columns:44px minmax(0,1fr) 18px;
    gap:10px;
    padding:10px;
  }
  .services-app-list-icon{width:42px;height:42px;}
}

/* Планшеты portrait: расширяем phone-контейнер, но сохраняем app-вид */
@media (min-width:768px){
  .services-app-page{
    --svc-phone-max:min(720px, calc(100vw - 48px));
    --svc-pad-x:clamp(24px,4vw,34px);
    min-height:calc(100dvh - var(--nav-h,0px));
    padding:clamp(18px,3vw,34px) 0 calc(98px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,#fafafa 0%,#f2f3f5 100%);
  }
  .services-app-phone{
    width:var(--svc-phone-max);
    max-width:var(--svc-phone-max);
    padding:clamp(26px,3.4vw,34px) var(--svc-pad-x) clamp(28px,3vw,36px);
    border-radius:32px;
    border:1px solid rgba(15,23,42,.06);
    box-shadow:0 28px 90px rgba(15,23,42,.13);
  }
  .services-app-home-head{
    padding-bottom:18px;
  }
  .services-app-topline{
    margin-bottom:24px;
  }
  .services-app-logo{
    font-size:28px;
  }
  .services-app-icon-btn{
    width:44px;
    height:44px;
    border-radius:16px;
    background:#f5f5f5;
  }
  .services-app-home-head h1{
    max-width:560px;
    font-size:clamp(28px,4vw,38px);
    line-height:1.06;
  }
  .services-app-search{
    grid-template-columns:30px minmax(0,1fr) 52px;
    height:52px;
    margin:16px 0 24px;
  }
  .services-app-search > span,
  .services-app-search input,
  .services-app-search button{
    height:52px;
  }
  .services-app-search input{
    font-size:16px;
    padding-inline:14px;
  }
  .services-app-search button{
    width:52px;
    border-radius:16px;
  }
  .services-app-search > span{
    border-radius:16px 0 0 16px;
  }
  .services-app-search input{
    border-radius:0 16px 16px 0;
  }
  .services-app-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:26px;
  }
  .services-app-tile{
    min-height:112px;
    border-radius:20px;
    gap:12px;
    padding:16px 10px;
  }
  .services-app-tile__icon{
    width:42px;
    height:42px;
  }
  .services-app-tile svg{
    width:36px;
    height:36px;
  }
  .services-app-tile__label{
    font-size:14px;
    line-height:1.18;
  }
  .services-app-section-row{
    margin-bottom:14px;
  }
  .services-app-section-row b{
    font-size:18px;
  }
  .services-app-section-row button{
    font-size:14px;
  }
  .services-app-shop-card{
    min-height:104px;
    grid-template-columns:84px minmax(0,1fr) 34px;
    gap:16px;
    padding:14px;
    border-radius:20px;
  }
  .services-app-shop-photo{
    width:84px;
    height:84px;
    border-radius:16px;
  }
  .services-app-shop-body strong{font-size:18px;}
  .services-app-shop-body em{font-size:14px;}
  .services-app-shop-body small{font-size:13px;}
  .services-app-heart{font-size:28px;}
  .services-app-nav-head{
    height:52px;
    margin-bottom:18px;
    gap:16px;
  }
  .services-app-nav-head button{
    width:44px;
    height:44px;
    border-radius:16px;
    background:#f5f5f5;
  }
  .services-app-nav-head h1{
    font-size:26px;
  }
  .services-app-chips{
    gap:10px;
    padding-bottom:20px;
  }
  .services-app-chips button{
    border-radius:14px;
    font-size:14px;
    padding:11px 18px;
  }
  .services-app-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    padding-bottom:90px;
  }
  .services-app-list-card{
    min-height:108px;
    grid-template-columns:62px minmax(0,1fr) 24px;
    gap:14px;
    padding:16px;
    border-radius:20px;
  }
  .services-app-list-icon{
    width:58px;
    height:58px;
  }
  .services-app-list-icon svg{width:42px;height:42px;}
  .services-app-list-body strong{font-size:16px;}
  .services-app-list-body em{font-size:13px;}
  .services-app-list-body b{font-size:14px;}
  .services-app-bottom-cta,
  .services-app-submit{
    min-height:56px;
    height:auto;
    border-radius:16px;
    font-size:16px;
  }
  .services-app-bottom-cta{
    bottom:calc(84px + env(safe-area-inset-bottom));
  }
  .services-app-form{
    gap:12px;
  }
  .services-app-form-label{
    font-size:14px;
    margin:10px 0 -4px;
  }
  .services-app-selected-card{
    min-height:82px;
    border-radius:18px;
    padding:16px;
  }
  .services-app-selected-card span{width:52px;height:52px;}
  .services-app-selected-card b{font-size:16px;}
  .services-app-selected-card em{font-size:15px;}
  .services-app-field{
    min-height:52px;
    height:auto;
    border-radius:16px;
    padding:0 16px;
  }
  .services-app-field span{font-size:15px;}
  .services-app-textarea{
    min-height:132px;
    border-radius:18px;
    padding:16px;
    font-size:16px;
  }
  .services-app-form-note{
    font-size:13px;
  }
}

/* Большие планшеты и desktop-preview: убираем узкую колонку, но не растягиваем бесконтрольно */
@media (min-width:1024px){
  .services-app-page{
    --svc-phone-max:min(1040px, calc(100vw - 72px));
    padding-top:clamp(28px,4vh,48px);
  }
  .services-app-phone{
    display:block;
    padding:36px 38px 40px;
    border-radius:36px;
  }
  .services-app-page--home .services-app-phone{
    display:grid;
    grid-template-columns:minmax(280px,.78fr) minmax(460px,1fr);
    grid-template-areas:
      "head grid"
      "search grid"
      "emergency nearby";
    column-gap:34px;
    row-gap:18px;
    align-items:start;
  }
  .services-app-page--home .services-app-home-head{grid-area:head;}
  .services-app-page--home .services-app-search{grid-area:search;margin:0;}
  .services-app-page--home .services-app-emergency-row{grid-area:emergency;}
  .services-app-page--home .services-app-grid{grid-area:grid;margin:0;grid-template-columns:repeat(3,minmax(0,1fr));}
  .services-app-page--home .services-app-empty{grid-column:2;}
  .services-app-page--home .services-app-nearby{grid-area:nearby;margin-top:0;}
  .services-app-page--category .services-app-list{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .services-app-page--request .services-app-phone{
    max-width:min(860px, calc(100vw - 72px));
  }
  .services-app-page--request .services-app-form{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px 16px;
  }
  .services-app-page--request .services-app-form-label,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-textarea,
  .services-app-page--request .services-app-submit,
  .services-app-page--request .services-app-form-note{
    grid-column:1 / -1;
  }
  .services-app-page--confirm .services-app-phone{
    max-width:min(760px, calc(100vw - 72px));
  }
}

/* Landscape tablets / low height: меньше вертикальных пустот */
@media (min-width:768px) and (max-height:820px){
  .services-app-page{
    padding-top:14px;
  }
  .services-app-phone{
    padding-top:22px;
    padding-bottom:24px;
  }
  .services-app-home-head h1{
    font-size:clamp(24px,3vw,32px);
  }
  .services-app-grid{
    gap:10px;
  }
  .services-app-tile{
    min-height:92px;
  }
  .services-app-list-card{
    min-height:92px;
  }
  .services-app-textarea{
    min-height:104px;
  }
}

/* === SOURCE: css/services_app_r2_sheets.css === */
/* SERVICES-APP-r2
   Bottom-sheet selectors for the service request screen.
   Scope: services app field sheet only.
*/
body.services-app-sheet-open{
  overflow:hidden;
}
.services-app-sheet{
  position:fixed;
  inset:0;
  z-index:11050;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .16s ease;
  color:#101114;
  font-family:Arial, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
.services-app-sheet.open{
  opacity:1;
  pointer-events:auto;
}
.services-app-sheet__backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.36);
  backdrop-filter:blur(5px);
}
.services-app-sheet__panel{
  position:relative;
  width:min(430px,100%);
  max-height:min(76dvh,640px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:22px 22px 0 0;
  background:#fff;
  box-shadow:0 -24px 70px rgba(15,23,42,.22);
  padding:9px 14px calc(14px + env(safe-area-inset-bottom));
  transform:translateY(22px);
  transition:transform .18s ease;
}
.services-app-sheet.open .services-app-sheet__panel{
  transform:translateY(0);
}
.services-app-sheet__handle{
  width:44px;
  height:4px;
  border-radius:99px;
  background:#d4d4d8;
  margin:0 auto 12px;
}
.services-app-sheet__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:0 2px 12px;
  border-bottom:1px solid #eeeeee;
}
.services-app-sheet__head b{
  display:block;
  color:#101114;
  font-size:16px;
  line-height:1.2;
  font-weight:900;
}
.services-app-sheet__head span{
  display:block;
  margin-top:3px;
  color:#8b8f98;
  font-size:11.5px;
  line-height:1.25;
  font-weight:700;
}
.services-app-sheet__head button{
  width:32px;
  height:32px;
  border:0;
  border-radius:10px;
  background:#f3f3f3;
  color:#101114;
  font-size:22px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.services-app-sheet__options{
  display:flex;
  flex-direction:column;
  gap:8px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:12px 0;
}
.services-app-sheet__options button{
  width:100%;
  min-height:44px;
  border:1px solid #ececec;
  border-radius:12px;
  background:#fff;
  color:#101114;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  text-align:left;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
  cursor:pointer;
}
.services-app-sheet__options button.active{
  border-color:rgba(255,179,0,.45);
  background:rgba(255,179,0,.10);
}
.services-app-sheet__options button span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#101114;
  font-size:12.5px;
  line-height:1.25;
  font-weight:800;
}
.services-app-sheet__options button em{
  color:#101114;
  font-style:normal;
  font-size:20px;
  line-height:1;
}
.services-app-sheet__custom{
  display:grid;
  grid-template-columns:minmax(0,1fr) 92px;
  gap:8px;
  padding-top:10px;
  border-top:1px solid #eeeeee;
}
.services-app-sheet__custom input{
  width:100%;
  height:42px;
  border:1px solid #eeeeee;
  border-radius:12px;
  background:#f7f7f7;
  color:#101114;
  outline:none;
  padding:0 12px;
  font-size:12.5px;
  font-weight:800;
}
.services-app-sheet__custom input::placeholder{
  color:#a1a1aa;
}
.services-app-sheet__custom button{
  height:42px;
  border:0;
  border-radius:12px;
  background:#ffb300;
  color:#101114;
  font-size:12.5px;
  font-weight:900;
  cursor:pointer;
}
.services-app-field[data-svc-value] span{
  color:#101114;
}
@media (min-width:768px){
  .services-app-sheet{
    align-items:center;
  }
  .services-app-sheet__panel{
    border-radius:24px;
    padding:10px 16px 16px;
  }
}
[data-theme="dark"] .services-app-sheet,
[data-theme="dark"] .services-app-sheet__panel{
  color:#101114;
}

/* === SOURCE: css/services_app_r3_confirm.css === */
/* SERVICES-APP-r3
   Confirmation screen after service request submit.
   Scope: only .services-app-page--confirm.
*/
.services-app-page--confirm .services-app-phone{
  min-height:calc(100dvh - 82px - env(safe-area-inset-bottom));
}
.services-app-nav-head--confirm{
  margin-bottom:16px;
}
.services-app-success{
  border:1px solid #eeeeee;
  border-radius:14px;
  background:#ffffff;
  box-shadow:0 10px 28px rgba(15,23,42,.07);
  padding:22px 18px 20px;
  text-align:center;
  color:#101114;
}
.services-app-success__icon{
  width:58px;
  height:58px;
  margin:0 auto 13px;
  border-radius:20px;
  background:#ffb300;
  color:#101114;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:32px;
  font-weight:900;
  box-shadow:0 12px 24px rgba(255,179,0,.24);
}
.services-app-success h2{
  margin:0;
  font-size:21px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.03em;
  color:#101114;
}
.services-app-success p{
  margin:9px auto 0;
  max-width:310px;
  color:#6b7280;
  font-size:12px;
  line-height:1.45;
  font-weight:700;
}
.services-app-confirm-card{
  margin-top:12px;
  border:1px solid #eeeeee;
  border-radius:14px;
  background:#ffffff;
  box-shadow:0 8px 24px rgba(15,23,42,.055);
  overflow:hidden;
}
.services-app-confirm-row{
  display:grid;
  grid-template-columns:108px minmax(0,1fr);
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid #f1f1f1;
  align-items:start;
}
.services-app-confirm-row:last-child{
  border-bottom:0;
}
.services-app-confirm-row span{
  color:#9ca3af;
  font-size:11px;
  line-height:1.25;
  font-weight:800;
}
.services-app-confirm-row strong{
  color:#101114;
  font-size:12px;
  line-height:1.32;
  font-weight:900;
  text-align:right;
  overflow-wrap:anywhere;
}
.services-app-confirm-actions{
  display:flex;
  flex-direction:column;
  gap:9px;
  margin-top:13px;
}
.services-app-secondary{
  width:100%;
  height:42px;
  border:1px solid #eeeeee;
  border-radius:8px;
  background:#ffffff;
  color:#101114;
  font-size:13px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.services-app-secondary:active{
  transform:translateY(1px);
}
@media (max-width:360px){
  .services-app-confirm-row{
    grid-template-columns:92px minmax(0,1fr);
    padding:11px 12px;
  }
}

/* === SOURCE: css/services_app_r39_tablet_overlap_fix.css === */
/* SERVICES-r39 — tablet/wide overlap cleanup for services-app.
   Scope: .services-app-page and .services-app-sheet only.
   Goal: prevent text-on-text overlays on tablets without changing JS/API flow. */

.services-app-page,
.services-app-sheet{
  text-size-adjust:100%;
  -webkit-text-size-adjust:100%;
}
.services-app-page *,
.services-app-sheet *{
  min-width:0;
}
.services-app-page strong,
.services-app-page b,
.services-app-page em,
.services-app-page small,
.services-app-page span,
.services-app-page h1,
.services-app-sheet b,
.services-app-sheet span,
.services-app-sheet em{
  overflow-wrap:anywhere;
  word-break:normal;
}
.services-app-tile,
.services-app-list-card,
.services-app-shop-card,
.services-app-selected-card,
.services-app-field,
.services-app-confirm-row,
.services-app-sheet__options button{
  min-width:0;
}
.services-app-tile__label,
.services-app-list-body,
.services-app-shop-body,
.services-app-selected-card b,
.services-app-field span,
.services-app-confirm-row strong,
.services-app-sheet__options button span{
  min-width:0;
  max-width:100%;
}

/* Mobile guard: не ломаем телефон, но не даём длинным словам залезать друг на друга. */
@media (max-width:767px){
  .services-app-home-head h1,
  .services-app-nav-head h1{
    overflow-wrap:anywhere;
  }
  .services-app-tile__label{
    display:block;
    white-space:normal;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .services-app-list-body strong,
  .services-app-list-body em,
  .services-app-list-body b,
  .services-app-shop-body strong,
  .services-app-shop-body em,
  .services-app-shop-body small{
    white-space:normal;
  }
}

/* Tablet portrait: fixed-height cards caused text overlay; cards now grow by content. */
@media (min-width:768px) and (max-width:1023px){
  .services-app-phone{
    overflow:visible;
  }
  .services-app-home-head h1{
    max-width:none;
    font-size:clamp(28px,3.8vw,36px);
    line-height:1.12;
    overflow-wrap:anywhere;
  }
  .services-app-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:stretch;
  }
  .services-app-tile{
    height:auto;
    min-height:118px;
    display:grid;
    grid-template-rows:auto minmax(34px,auto);
    align-content:center;
    justify-items:center;
    gap:12px;
  }
  .services-app-tile__label{
    width:100%;
    min-height:34px;
    text-align:center;
    white-space:normal;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .services-app-emergency-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    align-items:stretch;
  }
  .services-app-emergency-row button,
  .services-app-emergency-row .services-app-emergency,
  .services-app-emergency-row > *{
    min-width:0;
    white-space:normal;
    height:auto;
    min-height:48px;
    line-height:1.2;
  }
  .services-app-list{
    grid-template-columns:1fr;
    padding-bottom:84px;
  }
  .services-app-list-card{
    min-height:104px;
    height:auto;
    align-items:start;
    grid-template-columns:58px minmax(0,1fr) 22px;
  }
  .services-app-list-body{
    gap:5px;
    align-self:center;
  }
  .services-app-list-body strong,
  .services-app-list-body em,
  .services-app-list-body b{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
  .services-app-shop-card{
    height:auto;
    min-height:104px;
    align-items:start;
  }
  .services-app-shop-body{
    align-self:center;
    gap:5px;
  }
  .services-app-shop-body strong,
  .services-app-shop-body em,
  .services-app-shop-body small{
    white-space:normal;
  }
  .services-app-nav-head{
    height:auto;
    min-height:52px;
    align-items:flex-start;
  }
  .services-app-nav-head h1{
    white-space:normal;
    line-height:1.18;
    padding-top:8px;
  }
  .services-app-chips{
    flex-wrap:wrap;
    overflow:visible;
    padding-bottom:18px;
  }
  .services-app-chips button{
    white-space:normal;
    line-height:1.2;
  }
  .services-app-selected-card{
    height:auto;
    min-height:82px;
    align-items:flex-start;
  }
  .services-app-selected-card b,
  .services-app-selected-card em{
    white-space:normal;
  }
  .services-app-field{
    min-height:54px;
    height:auto;
    gap:12px;
    padding-top:10px;
    padding-bottom:10px;
    align-items:flex-start;
  }
  .services-app-field span{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:1.3;
  }
  .services-app-confirm-row{
    grid-template-columns:minmax(118px,.36fr) minmax(0,1fr);
    align-items:start;
  }
  .services-app-confirm-row strong{
    text-align:left;
  }
}

/* Wide / desktop preview: не растягиваем тексты поверх соседних колонок. */
@media (min-width:1024px){
  .services-app-page--home .services-app-phone{
    grid-template-columns:minmax(320px,.72fr) minmax(520px,1fr);
    overflow:visible;
  }
  .services-app-page--home .services-app-home-head,
  .services-app-page--home .services-app-search,
  .services-app-page--home .services-app-emergency-row,
  .services-app-page--home .services-app-grid,
  .services-app-page--home .services-app-nearby{
    min-width:0;
  }
  .services-app-home-head h1{
    max-width:100%;
    line-height:1.12;
    overflow-wrap:anywhere;
  }
  .services-app-grid{
    align-items:stretch;
  }
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(3,minmax(150px,1fr));
  }
  .services-app-tile{
    height:auto;
    min-height:126px;
    display:grid;
    grid-template-rows:auto minmax(40px,auto);
    align-content:center;
  }
  .services-app-tile__label{
    width:100%;
    white-space:normal;
    line-height:1.22;
    text-align:center;
  }
  .services-app-page--category .services-app-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .services-app-list-card{
    height:auto;
    min-height:112px;
    align-items:start;
  }
  .services-app-list-body{
    align-self:center;
    gap:5px;
  }
  .services-app-list-body strong,
  .services-app-list-body em,
  .services-app-list-body b{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
  .services-app-page--request .services-app-form{
    align-items:stretch;
  }
  .services-app-page--request .services-app-form-label,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-textarea,
  .services-app-page--request .services-app-submit,
  .services-app-page--request .services-app-form-note{
    min-width:0;
  }
  .services-app-selected-card{
    height:auto;
    min-height:88px;
  }
  .services-app-selected-card b,
  .services-app-selected-card em{
    white-space:normal;
  }
  .services-app-field{
    height:auto;
    min-height:56px;
    align-items:flex-start;
    padding-top:12px;
    padding-bottom:12px;
  }
  .services-app-field span{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
  .services-app-confirm-row{
    grid-template-columns:150px minmax(0,1fr);
  }
  .services-app-confirm-row strong{
    text-align:left;
  }
}

/* Bottom sheet tablet: options stop overlapping, panel becomes wider and scroll-safe. */
@media (min-width:768px){
  .services-app-sheet{
    align-items:center;
    padding:24px;
  }
  .services-app-sheet__panel{
    width:min(720px, calc(100vw - 48px));
    max-height:min(82dvh,760px);
    border-radius:28px;
    padding:12px 20px 20px;
  }
  .services-app-sheet__head{
    align-items:flex-start;
  }
  .services-app-sheet__head b{
    font-size:20px;
    line-height:1.18;
  }
  .services-app-sheet__head span{
    font-size:13px;
    line-height:1.35;
  }
  .services-app-sheet__options{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .services-app-sheet__options button{
    min-height:56px;
    height:auto;
    align-items:flex-start;
    padding:12px 14px;
  }
  .services-app-sheet__options button span{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    font-size:14px;
    line-height:1.3;
  }
  .services-app-sheet__options button em{
    flex:0 0 auto;
  }
  .services-app-sheet__custom{
    grid-template-columns:minmax(0,1fr) 128px;
  }
  .services-app-sheet__custom input,
  .services-app-sheet__custom button{
    height:auto;
    min-height:48px;
    font-size:14px;
  }
}

@media (min-width:1024px){
  .services-app-sheet__panel{
    width:min(820px, calc(100vw - 72px));
  }
}

/* Low-height tablet landscape: reduce only vertical spaces, not text sizes to unsafe values. */
@media (min-width:768px) and (max-height:820px){
  .services-app-phone{
    overflow:visible;
  }
  .services-app-tile{
    min-height:96px;
  }
  .services-app-tile__label{
    -webkit-line-clamp:2;
  }
  .services-app-list-card{
    min-height:92px;
  }
  .services-app-sheet__panel{
    max-height:88dvh;
  }
}

/* === SOURCE: css/services_app_r40_sheets_modal_fix.css === */
/* SERVICES-r40 — services-app sheets/modal hardening for 360 / 430 / 768 / 1024.
   Scope: .services-app-page + .services-app-sheet only.
   Goal: close residual tablet text overlaps without touching JS/API flow. */

.services-app-page,
.services-app-sheet{
  --svc-safe-bottom:calc(82px + env(safe-area-inset-bottom));
}
.services-app-page *,
.services-app-sheet *{
  box-sizing:border-box;
}
.services-app-page :where(h1,b,strong,em,small,span,button,input,textarea),
.services-app-sheet :where(b,strong,em,span,button,input){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}
.services-app-phone{
  isolation:isolate;
}
.services-app-nav-head,
.services-app-topline,
.services-app-section-row{
  min-width:0;
}
.services-app-nav-head h1,
.services-app-home-head h1{
  max-width:100%;
  white-space:normal;
}
.services-app-search,
.services-app-emergency-row,
.services-app-grid,
.services-app-list,
.services-app-form,
.services-app-confirm-card,
.services-app-confirm-actions{
  min-width:0;
}
.services-app-tile,
.services-app-list-card,
.services-app-shop-card,
.services-app-selected-card,
.services-app-field,
.services-app-confirm-row{
  overflow:visible;
}
.services-app-list-body,
.services-app-shop-body,
.services-app-selected-card b,
.services-app-field span,
.services-app-confirm-row strong{
  min-width:0;
  max-width:100%;
}
.services-app-field span,
.services-app-selected-card b,
.services-app-selected-card em,
.services-app-confirm-row strong{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
.services-app-selected-card em{
  flex:0 1 auto;
  text-align:right;
}
.services-app-textarea{
  width:100%;
  max-width:100%;
  line-height:1.45;
}
.services-app-submit,
.services-app-bottom-cta,
.services-app-secondary{
  min-height:44px;
  height:auto;
  line-height:1.18;
  padding-top:12px;
  padding-bottom:12px;
  white-space:normal;
  text-align:center;
}

/* 360px: narrow phone guard. */
@media (max-width:380px){
  .services-app-phone{
    width:100%;
    padding-left:12px;
    padding-right:12px;
  }
  .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }
  .services-app-tile{
    min-height:76px;
    padding:10px 7px;
  }
  .services-app-tile__label{
    font-size:11.5px;
    line-height:1.18;
  }
  .services-app-emergency-row{
    grid-template-columns:1fr;
  }
  .services-app-list-card,
  .services-app-shop-card{
    grid-template-columns:46px minmax(0,1fr) 18px;
    gap:10px;
    padding:10px;
  }
  .services-app-selected-card{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:10px;
  }
  .services-app-selected-card em{
    grid-column:2;
    text-align:left;
  }
  .services-app-confirm-row{
    grid-template-columns:1fr;
    gap:4px;
  }
  .services-app-sheet__custom{
    grid-template-columns:1fr;
  }
}

/* 430px: large phone / small foldable guard. */
@media (min-width:381px) and (max-width:767px){
  .services-app-phone{
    width:min(100%, 460px);
  }
  .services-app-tile{
    min-height:82px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:88px;
  }
  .services-app-selected-card{
    min-height:74px;
  }
  .services-app-field{
    min-height:48px;
    height:auto;
    padding-top:10px;
    padding-bottom:10px;
    align-items:flex-start;
  }
}

/* Shared sheet safety. */
.services-app-sheet{
  padding:max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
}
.services-app-sheet__panel{
  min-width:0;
  max-width:100%;
}
.services-app-sheet__head{
  min-width:0;
}
.services-app-sheet__head > div{
  min-width:0;
  flex:1 1 auto;
}
.services-app-sheet__head b,
.services-app-sheet__head span{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
.services-app-sheet__head button{
  flex:0 0 auto;
}
.services-app-sheet__options{
  min-height:0;
  overscroll-behavior:contain;
}
.services-app-sheet__options button{
  height:auto;
  min-height:48px;
  align-items:flex-start;
  white-space:normal;
}
.services-app-sheet__options button span{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.32;
}
.services-app-sheet__options button em{
  flex:0 0 auto;
}
.services-app-sheet__custom{
  min-width:0;
}
.services-app-sheet__custom input,
.services-app-sheet__custom button{
  min-width:0;
  height:auto;
  min-height:44px;
  white-space:normal;
}

/* 768px tablet portrait. */
@media (min-width:768px) and (max-width:1023px){
  .services-app-page{
    padding-left:24px;
    padding-right:24px;
  }
  .services-app-phone{
    width:min(100%, 820px);
    max-width:820px;
    padding:28px;
  }
  .services-app-page--home .services-app-phone{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:22px;
    align-items:start;
  }
  .services-app-page--home .services-app-home-head,
  .services-app-page--home .services-app-search,
  .services-app-page--home .services-app-emergency-row,
  .services-app-page--home .services-app-nearby{
    grid-column:1;
  }
  .services-app-page--home .services-app-grid{
    grid-column:2;
    grid-row:1 / span 4;
  }
  .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .services-app-tile{
    min-height:124px;
    padding:16px 12px;
  }
  .services-app-tile__label{
    font-size:15px;
    line-height:1.22;
  }
  .services-app-emergency-row{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .services-app-emergency-row button{
    min-height:56px;
  }
  .services-app-page--category .services-app-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:112px;
    align-items:start;
  }
  .services-app-list-body,
  .services-app-shop-body{
    align-self:center;
    gap:5px;
  }
  .services-app-page--request .services-app-phone{
    display:grid;
    grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);
    gap:24px;
    align-items:start;
  }
  .services-app-page--request .services-app-nav-head,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-form-note{
    grid-column:1;
  }
  .services-app-page--request .services-app-form{
    grid-column:2;
    grid-row:1 / span 4;
  }
  .services-app-page--request .services-app-nav-head{
    align-items:flex-start;
  }
  .services-app-field{
    min-height:56px;
    height:auto;
  }
  .services-app-page--confirm .services-app-phone{
    width:min(100%, 760px);
  }
  .services-app-confirm-row{
    grid-template-columns:minmax(150px,.32fr) minmax(0,1fr);
    gap:18px;
  }
  .services-app-sheet{
    padding:28px;
  }
  .services-app-sheet__panel{
    width:min(760px, calc(100vw - 56px));
    max-height:min(86dvh, 760px);
  }
  .services-app-sheet__options{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* 1024px+ wide tablet / desktop preview. */
@media (min-width:1024px){
  .services-app-page{
    padding-left:32px;
    padding-right:32px;
  }
  .services-app-phone{
    width:min(100%, 1080px);
    max-width:1080px;
    padding:32px;
  }
  .services-app-page--home .services-app-phone{
    grid-template-columns:minmax(330px,.42fr) minmax(0,.58fr);
    gap:30px;
  }
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
  }
  .services-app-tile{
    min-height:132px;
    border-radius:16px;
  }
  .services-app-tile__icon{
    width:42px;
    height:42px;
  }
  .services-app-tile svg{
    width:36px;
    height:36px;
  }
  .services-app-tile__label{
    font-size:15.5px;
  }
  .services-app-page--category .services-app-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .services-app-page--request .services-app-phone{
    grid-template-columns:minmax(320px,.38fr) minmax(0,.62fr);
    gap:32px;
  }
  .services-app-page--request .services-app-form{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:14px;
    row-gap:10px;
  }
  .services-app-page--request .services-app-form-label{
    margin-bottom:-2px;
  }
  .services-app-page--request .services-app-textarea,
  .services-app-page--request .services-app-submit,
  .services-app-page--request .services-app-form-note{
    grid-column:1 / -1;
  }
  .services-app-page--confirm .services-app-phone{
    width:min(100%, 860px);
  }
  .services-app-confirm-card{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .services-app-confirm-row{
    min-height:62px;
    grid-template-columns:1fr;
    gap:5px;
    padding:12px 14px;
    border:1px solid #ececec;
    border-radius:14px;
    background:#fff;
  }
  .services-app-sheet{
    align-items:center;
    padding:36px;
  }
  .services-app-sheet__panel{
    width:min(900px, calc(100vw - 72px));
    max-height:min(86dvh, 820px);
    border-radius:30px;
  }
  .services-app-sheet__options{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
  }
  .services-app-sheet__custom{
    grid-template-columns:minmax(0,1fr) 150px;
  }
}

/* Landscape tablets with low height: reduce vertical pressure without clipping text. */
@media (min-width:768px) and (max-height:760px){
  .services-app-page{
    padding-top:12px;
  }
  .services-app-phone{
    padding-top:20px;
    padding-bottom:20px;
  }
  .services-app-home-head h1{
    font-size:clamp(26px,3vw,34px);
  }
  .services-app-tile{
    min-height:102px;
    padding-top:12px;
    padding-bottom:12px;
  }
  .services-app-page--request .services-app-phone{
    align-items:start;
  }
  .services-app-sheet__panel{
    max-height:92dvh;
  }
  .services-app-sheet__options{
    max-height:calc(92dvh - 190px);
  }
}

/* === SOURCE: css/services_app_r41_width_overlap_final.css === */
/* SERVICES-r41 — final width pass for services-app at 360 / 430 / 768 / 1024.
   Scope: .services-app-page + .services-app-sheet only.
   Purpose: close residual tablet text overlaps, overflow and cramped grid cases after r38-r40. */

.services-app-page,
.services-app-sheet{
  --svc-r41-line:1.28;
  --svc-r41-card-gap:12px;
}
.services-app-page :where(h1,h2,h3,p,b,strong,em,small,span,button,label,input,textarea),
.services-app-sheet :where(h1,h2,h3,p,b,strong,em,small,span,button,label,input,textarea){
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
  text-wrap:pretty;
}
.services-app-page :where(.services-app-tile,.services-app-list-card,.services-app-shop-card,.services-app-selected-card,.services-app-field,.services-app-confirm-row),
.services-app-sheet :where(.services-app-sheet__panel,.services-app-sheet__options,.services-app-sheet__options button,.services-app-sheet__custom){
  min-width:0;
  max-width:100%;
}
.services-app-tile,
.services-app-list-card,
.services-app-shop-card,
.services-app-selected-card,
.services-app-field,
.services-app-confirm-row,
.services-app-sheet__options button{
  height:auto !important;
  overflow:visible !important;
}
.services-app-tile__label,
.services-app-list-body strong,
.services-app-list-body em,
.services-app-list-body b,
.services-app-shop-body strong,
.services-app-shop-body em,
.services-app-shop-body small,
.services-app-selected-card b,
.services-app-selected-card em,
.services-app-field span,
.services-app-confirm-row strong,
.services-app-sheet__options button span{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  line-height:var(--svc-r41-line);
}
.services-app-list-body,
.services-app-shop-body{
  min-width:0;
  max-width:100%;
}
.services-app-search input,
.services-app-textarea,
.services-app-sheet__custom input{
  min-width:0;
  width:100%;
}
.services-app-bottom-cta,
.services-app-submit,
.services-app-secondary,
.services-app-sheet__custom button{
  min-height:48px;
  height:auto !important;
  white-space:normal;
  line-height:1.2;
}

/* 360px / narrow phone: prevent squeezed 3-column labels. */
@media (max-width:380px){
  .services-app-page{
    padding-left:10px;
    padding-right:10px;
  }
  .services-app-phone{
    width:100%;
    max-width:100%;
    padding-left:12px;
    padding-right:12px;
  }
  .services-app-topline,
  .services-app-nav-head,
  .services-app-section-row{
    gap:8px;
  }
  .services-app-home-head h1,
  .services-app-nav-head h1{
    font-size:clamp(19px,6vw,23px);
    line-height:1.12;
  }
  .services-app-grid,
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px;
  }
  .services-app-tile{
    min-height:84px !important;
    padding:10px 8px;
    gap:8px;
  }
  .services-app-tile__label{
    font-size:11.5px;
    line-height:1.18;
  }
  .services-app-list-card,
  .services-app-shop-card{
    grid-template-columns:44px minmax(0,1fr) 18px !important;
    gap:10px;
    padding:10px;
  }
  .services-app-list-icon,
  .services-app-shop-photo{
    width:44px;
    height:44px;
  }
  .services-app-selected-card{
    display:grid !important;
    grid-template-columns:38px minmax(0,1fr);
    align-items:start;
  }
  .services-app-selected-card em{
    grid-column:2;
    text-align:left;
  }
  .services-app-field{
    align-items:flex-start;
    gap:10px;
  }
}

/* 430px / large phone: allow text growth without vertical collision. */
@media (min-width:381px) and (max-width:767px){
  .services-app-page{
    padding-left:14px;
    padding-right:14px;
  }
  .services-app-phone{
    width:min(100%, 480px);
    max-width:480px;
  }
  .services-app-grid{
    gap:10px;
  }
  .services-app-tile{
    min-height:92px !important;
    padding:12px 9px;
  }
  .services-app-tile__label{
    font-size:12px;
    line-height:1.2;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:92px !important;
  }
  .services-app-field,
  .services-app-selected-card{
    min-height:54px !important;
    align-items:flex-start;
  }
}

/* Tablet portrait: wider, readable, no overlapping text. */
@media (min-width:768px) and (max-width:1023px){
  .services-app-page{
    padding:24px clamp(22px,4vw,38px) calc(92px + env(safe-area-inset-bottom));
  }
  .services-app-phone{
    width:min(100%, 900px) !important;
    max-width:900px !important;
    padding:clamp(24px,3vw,34px) !important;
    border-radius:30px;
    overflow:visible;
  }
  .services-app-page--home .services-app-phone{
    display:grid;
    grid-template-columns:minmax(280px,.9fr) minmax(340px,1.1fr);
    gap:24px;
    align-items:start;
  }
  .services-app-page--home .services-app-home-head,
  .services-app-page--home .services-app-search,
  .services-app-page--home .services-app-emergency-row,
  .services-app-page--home .services-app-nearby{
    grid-column:1;
  }
  .services-app-page--home .services-app-grid{
    grid-column:2;
    grid-row:1 / span 5;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px;
    align-content:start;
  }
  .services-app-home-head h1{
    font-size:clamp(30px,4vw,40px);
    line-height:1.08;
  }
  .services-app-search{
    min-height:58px;
    height:auto;
  }
  .services-app-emergency-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .services-app-emergency-row > *,
  .services-app-emergency-row button{
    min-height:58px;
    height:auto;
    white-space:normal;
    line-height:1.2;
  }
  .services-app-tile{
    min-height:130px !important;
    padding:16px 12px;
    gap:12px;
    align-content:center;
  }
  .services-app-tile__icon{
    width:42px;
    height:42px;
  }
  .services-app-tile svg{
    width:36px;
    height:36px;
  }
  .services-app-tile__label{
    font-size:15px;
    line-height:1.22;
  }
  .services-app-page--category .services-app-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:13px;
    padding-bottom:96px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:116px !important;
    padding:16px;
    align-items:flex-start;
  }
  .services-app-list-body,
  .services-app-shop-body{
    align-self:center;
    gap:6px;
  }
  .services-app-page--request .services-app-phone{
    display:grid;
    grid-template-columns:minmax(270px,.78fr) minmax(360px,1.22fr);
    gap:24px;
    align-items:start;
  }
  .services-app-page--request .services-app-nav-head,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-form-note{
    grid-column:1;
  }
  .services-app-page--request .services-app-form{
    grid-column:2;
    grid-row:1 / span 5;
    gap:12px;
  }
  .services-app-selected-card{
    min-height:86px !important;
    align-items:flex-start;
  }
  .services-app-field{
    min-height:58px !important;
    padding-top:12px;
    padding-bottom:12px;
    align-items:flex-start;
  }
  .services-app-textarea{
    min-height:132px;
  }
  .services-app-sheet__panel{
    width:min(820px, calc(100vw - 48px)) !important;
    max-height:min(88dvh, 780px);
  }
  .services-app-sheet__options{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .services-app-sheet__options button{
    min-height:58px;
    padding:12px 14px;
  }
}

/* 1024px / tablet landscape and desktop preview. */
@media (min-width:1024px){
  .services-app-page{
    padding:32px clamp(28px,4vw,58px) calc(96px + env(safe-area-inset-bottom));
  }
  .services-app-phone{
    width:min(100%, 1160px) !important;
    max-width:1160px !important;
    padding:34px !important;
    border-radius:34px;
  }
  .services-app-page--home .services-app-phone{
    display:grid;
    grid-template-columns:minmax(330px,.42fr) minmax(560px,.58fr);
    gap:32px;
    align-items:start;
  }
  .services-app-page--home .services-app-home-head,
  .services-app-page--home .services-app-search,
  .services-app-page--home .services-app-emergency-row,
  .services-app-page--home .services-app-nearby{
    grid-column:1;
  }
  .services-app-page--home .services-app-grid{
    grid-column:2;
    grid-row:1 / span 5;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px;
    align-content:start;
  }
  .services-app-home-head h1{
    font-size:clamp(38px,3.8vw,52px);
    line-height:1.05;
  }
  .services-app-tile{
    min-height:138px !important;
    padding:18px 14px;
    gap:12px;
  }
  .services-app-tile__label{
    font-size:15.5px;
    line-height:1.22;
  }
  .services-app-page--category .services-app-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:120px !important;
    padding:18px;
  }
  .services-app-page--request .services-app-phone{
    display:grid;
    grid-template-columns:minmax(330px,.38fr) minmax(0,.62fr);
    gap:34px;
    align-items:start;
  }
  .services-app-page--request .services-app-nav-head,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-form-note{
    grid-column:1;
  }
  .services-app-page--request .services-app-form{
    grid-column:2;
    grid-row:1 / span 5;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 14px;
  }
  .services-app-page--request .services-app-textarea,
  .services-app-page--request .services-app-submit,
  .services-app-page--request .services-app-form-note{
    grid-column:1 / -1;
  }
  .services-app-sheet__panel{
    width:min(940px, calc(100vw - 72px)) !important;
    max-height:min(88dvh, 820px);
  }
  .services-app-sheet__options{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .services-app-sheet__options button{
    min-height:62px;
  }
}

/* Low-height tablet landscape: reduce vertical pressure, never clip labels. */
@media (min-width:768px) and (max-height:760px){
  .services-app-page{
    padding-top:12px;
    padding-bottom:84px;
  }
  .services-app-phone{
    padding-top:20px !important;
    padding-bottom:20px !important;
  }
  .services-app-home-head h1{
    font-size:clamp(28px,3vw,38px);
  }
  .services-app-tile{
    min-height:112px !important;
    padding-top:12px;
    padding-bottom:12px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:102px !important;
  }
  .services-app-sheet__panel{
    max-height:92dvh;
  }
  .services-app-sheet__options{
    max-height:calc(92dvh - 180px);
    overflow:auto;
  }
}

/* === SOURCE: css/kareta_app_design_system.css === */
/* APP-DESIGN-r1 — KARETA mobile app design system.
   Scope: shared variables and reusable classes for the new reference-style app screens.
   This file is additive. It does not rewrite existing pages by itself.
*/
:root{
  --k-bg:#f7f7f8;
  --k-screen:#ffffff;
  --k-surface:#ffffff;
  --k-surface-soft:#f2f2f3;
  --k-surface-2:#fafafa;
  --k-text:#111111;
  --k-muted:#707070;
  --k-light:#a8a8a8;
  --k-yellow:#ffc400;
  --k-yellow-dark:#f4b400;
  --k-green:#29b35a;
  --k-red:#ef4444;
  --k-blue:#3b82f6;
  --k-border:#e8e8ea;
  --k-shadow:0 10px 30px rgba(0,0,0,.08);
  --k-card-shadow:0 4px 16px rgba(0,0,0,.055);
  --k-radius-sm:10px;
  --k-radius:14px;
  --k-radius-lg:20px;
  --k-radius-xl:28px;
  --k-font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

.k-app-screen{
  width:100%;
  max-width:430px;
  min-height:100dvh;
  margin:0 auto;
  background:var(--k-screen);
  color:var(--k-text);
  position:relative;
  padding:18px 16px calc(88px + env(safe-area-inset-bottom));
  font-family:var(--k-font);
}
.k-app-screen--gray{background:var(--k-bg)}
.k-app-header{
  min-height:44px;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
.k-app-back,
.k-app-icon-btn{
  width:38px;
  height:38px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--k-text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  cursor:pointer;
}
.k-app-title{
  flex:1;
  margin:0;
  font-size:18px;
  font-weight:850;
  line-height:1.2;
}
.k-app-logo{
  font-size:24px;
  font-weight:900;
  letter-spacing:-.7px;
  line-height:1;
}
.k-app-logo span{color:var(--k-yellow-dark)}
.k-app-hero-title{
  margin:18px 0 14px;
  font-size:24px;
  font-weight:900;
  line-height:1.08;
  letter-spacing:-.5px;
}
.k-app-section{margin-top:22px}
.k-app-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
  gap:12px;
}
.k-app-section-title{
  margin:0;
  font-size:16px;
  font-weight:850;
}
.k-app-section-link{
  border:0;
  background:transparent;
  color:var(--k-muted);
  font-size:13px;
  font-weight:750;
  cursor:pointer;
}
.k-app-search{
  display:flex;
  gap:8px;
  margin:12px 0 20px;
}
.k-app-search__field{
  flex:1;
  height:44px;
  border:0;
  outline:0;
  border-radius:var(--k-radius);
  background:var(--k-surface-soft);
  padding:0 14px;
  font-size:14px;
  color:var(--k-text);
}
.k-app-search__field::placeholder{color:var(--k-light)}
.k-app-search__btn,
.k-app-btn{
  border:0;
  cursor:pointer;
  border-radius:var(--k-radius);
  font-weight:850;
  transition:transform .12s ease,background .12s ease,opacity .12s ease;
}
.k-app-search__btn{
  width:48px;
  height:44px;
  background:var(--k-yellow);
  color:#111;
  font-size:18px;
}
.k-app-btn{
  width:100%;
  min-height:48px;
  padding:0 18px;
  background:var(--k-yellow);
  color:#111;
  font-size:15px;
}
.k-app-btn:active,
.k-app-search__btn:active{transform:scale(.98)}
.k-app-btn--outline{background:#fff;border:1px solid var(--k-border)}
.k-app-btn--danger{color:var(--k-red);background:#fff;border:1px solid rgba(239,68,68,.4)}
.k-app-btn-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.k-app-category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.k-app-category{
  min-height:86px;
  border:0;
  border-radius:var(--k-radius);
  background:linear-gradient(180deg,#f8f8f9,#f1f1f2);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:var(--k-text);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.02);
  cursor:pointer;
}
.k-app-category__icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.k-app-category__label{font-size:13px;font-weight:850}
.k-app-card{
  background:var(--k-surface);
  border:1px solid var(--k-border);
  border-radius:var(--k-radius-lg);
  box-shadow:var(--k-card-shadow);
  padding:14px;
}
.k-app-list-card{
  display:grid;
  grid-template-columns:52px 1fr 18px;
  gap:12px;
  align-items:center;
  margin-bottom:10px;
}
.k-app-list-card__icon{
  width:52px;
  height:52px;
  border-radius:var(--k-radius);
  background:var(--k-surface-soft);
  display:flex;
  align-items:center;
  justify-content:center;
}
.k-app-list-card__title{margin:0 0 4px;font-size:15px;font-weight:850;line-height:1.2}
.k-app-list-card__text{margin:0 0 5px;color:var(--k-muted);font-size:12px;line-height:1.35}
.k-app-list-card__price{font-size:13px;font-weight:850}
.k-app-chevron{color:var(--k-muted);font-size:20px}
.k-app-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px;scrollbar-width:none}
.k-app-chips::-webkit-scrollbar{display:none}
.k-app-chip{
  border:0;
  white-space:nowrap;
  height:34px;
  padding:0 14px;
  border-radius:999px;
  background:var(--k-surface-soft);
  color:var(--k-text);
  font-size:13px;
  font-weight:850;
}
.k-app-chip.is-active{background:var(--k-yellow)}
.k-app-status{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:850}
.k-app-status--work{color:#8a5c00;background:#fff1bd}
.k-app-status--wait{color:#9a4b00;background:#ffe1c2}
.k-app-status--done{color:#14783a;background:#dff7e8}
.k-app-status--blue{color:#1d5fbf;background:#e4f0ff}
.k-app-form{display:grid;gap:13px}
.k-app-field{display:grid;gap:7px}
.k-app-field__label{font-size:13px;font-weight:850}
.k-app-input,
.k-app-textarea,
.k-app-select-like{
  width:100%;
  border:1px solid var(--k-border);
  border-radius:var(--k-radius);
  background:#fff;
  min-height:45px;
  padding:0 13px;
  color:var(--k-text);
  font-size:14px;
  outline:0;
}
.k-app-textarea{min-height:108px;resize:vertical;padding-top:12px;line-height:1.45}
.k-app-select-like{display:flex;align-items:center;justify-content:space-between;text-align:left}
.k-app-timeline{position:relative;display:grid;gap:22px;margin:18px 0 28px}
.k-app-timeline__item{position:relative;display:grid;grid-template-columns:30px 1fr;gap:12px}
.k-app-timeline__item::before{content:"";position:absolute;left:14px;top:30px;bottom:-22px;width:2px;background:var(--k-border)}
.k-app-timeline__item:last-child::before{display:none}
.k-app-timeline__dot{width:30px;height:30px;border-radius:50%;border:2px solid var(--k-border);background:#fff;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:900}
.k-app-timeline__item.is-done .k-app-timeline__dot{background:var(--k-green);border-color:var(--k-green)}
.k-app-timeline__item.is-active .k-app-timeline__dot{background:var(--k-yellow);border-color:var(--k-yellow);color:#111}
.k-app-timeline__title{margin:0 0 4px;font-size:15px;font-weight:850}
.k-app-timeline__meta{margin:0;color:var(--k-muted);font-size:13px}
@media (min-width:768px){
  .k-app-screen{border-radius:28px;box-shadow:var(--k-shadow);min-height:min(900px,100dvh);margin:24px auto;background:#fff}
}

/* === SOURCE: css/kareta_client_pages_ui.css === */
/*
  KARETA.KZ Client UI CSS
  Макет: главная клиента, услуги, новости, товары, мастера, чаты,
  карточка услуги, карточка мастера, запись, мои заказы, детали заказа,
  этапы ремонта, VIN-поиск, избранное, профиль клиента.

  Version: client-ui-r001
  Type: CSS-only design layer
*/

:root {
  --kr-bg: #f6f6f7;
  --kr-page: #ffffff;
  --kr-soft: #f4f4f5;
  --kr-soft-2: #fafafa;
  --kr-line: #e8e8eb;
  --kr-line-2: #d9d9df;

  --kr-text: #111111;
  --kr-text-2: #242424;
  --kr-muted: #71717a;
  --kr-muted-2: #a1a1aa;

  --kr-yellow: #ffc400;
  --kr-yellow-2: #ffb800;
  --kr-yellow-soft: #fff3be;

  --kr-green: #22c55e;
  --kr-green-soft: #e7f8ee;
  --kr-orange: #f97316;
  --kr-orange-soft: #fff1e7;
  --kr-blue: #2563eb;
  --kr-blue-soft: #eaf2ff;
  --kr-red: #ef4444;
  --kr-red-soft: #fff0f0;

  --kr-shadow: 0 14px 36px rgba(15, 23, 42, .09);
  --kr-card-shadow: 0 6px 18px rgba(15, 23, 42, .06);

  --kr-r8: 8px;
  --kr-r10: 10px;
  --kr-r12: 12px;
  --kr-r14: 14px;
  --kr-r18: 18px;
  --kr-r22: 22px;
  --kr-r28: 28px;

  --kr-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --kr-screen: 390px;
  --kr-bottom-nav: 72px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100%;
  background: var(--kr-bg);
  color: var(--kr-text);
  font-family: var(--kr-font);
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

img,
svg {
  display: block;
  max-width: 100%;
}

.kr-app {
  width: 100%;
  min-height: 100dvh;
  background: var(--kr-bg);
}

.kr-screen {
  width: 100%;
  max-width: var(--kr-screen);
  min-height: 100dvh;
  margin: 0 auto;
  padding: 16px 14px calc(var(--kr-bottom-nav) + 16px);
  position: relative;
  overflow-x: hidden;
  background: var(--kr-page);
}

.kr-screen--soft {
  background: var(--kr-bg);
}

.kr-screen--no-nav {
  padding-bottom: 18px;
}

.kr-statusbar {
  height: 18px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #111;
  font-size: 11px;
  font-weight: 850;
}

.kr-header {
  min-height: 40px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.kr-header__title {
  flex: 1;
  margin: 0;
  text-align: center;
  font-size: 17px;
  line-height: 1.15;
  font-weight: 950;
}

.kr-header__title--left {
  text-align: left;
}

.kr-icon-btn,
.kr-back {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--kr-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
}

.kr-logo {
  font-size: 21px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: -.65px;
}

.kr-logo span {
  color: var(--kr-yellow-2);
}

.kr-greeting {
  margin: 14px 0 12px;
}

.kr-greeting__hello {
  margin: 0;
  font-size: 18px;
  line-height: 1.12;
  font-weight: 950;
}

.kr-page-title {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1.15;
  font-weight: 950;
}

.kr-subtitle {
  margin: 0;
  color: var(--kr-muted);
  font-size: 12px;
  line-height: 1.35;
}

.kr-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.kr-row--between {
  justify-content: space-between;
}

.kr-stack {
  display: grid;
  gap: 10px;
}

.kr-stack--md {
  gap: 14px;
}

.kr-stack--lg {
  gap: 18px;
}

.kr-section {
  margin-top: 18px;
}

.kr-section__head {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.kr-section__title {
  margin: 0;
  font-size: 15px;
  font-weight: 950;
}

.kr-section__link {
  border: 0;
  background: transparent;
  color: var(--kr-muted);
  font-size: 12px;
  font-weight: 850;
}

/* Search */

.kr-search {
  margin: 12px 0 16px;
  display: grid;
  grid-template-columns: 1fr 44px;
  gap: 8px;
}

.kr-search--single {
  grid-template-columns: 1fr;
}

.kr-search__input {
  height: 42px;
  border: 0;
  border-radius: var(--kr-r12);
  background: var(--kr-soft);
  padding: 0 13px;
  color: var(--kr-text);
  outline: none;
  font-size: 13px;
}

.kr-search__input::placeholder {
  color: var(--kr-muted-2);
}

.kr-search__btn {
  height: 42px;
  border: 0;
  border-radius: var(--kr-r12);
  background: var(--kr-yellow);
  color: #111;
  font-size: 18px;
  font-weight: 950;
}

/* Buttons */

.kr-btn {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: var(--kr-r12);
  background: var(--kr-yellow);
  color: #111;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 950;
  transition: transform .12s ease, opacity .12s ease, background .12s ease;
}

.kr-btn:active {
  transform: scale(.985);
}

.kr-btn--outline {
  background: #fff;
  border: 1px solid var(--kr-line-2);
}

.kr-btn--ghost {
  background: transparent;
}

.kr-btn--danger {
  color: var(--kr-red);
  background: #fff;
  border: 1px solid rgba(239, 68, 68, .45);
}

.kr-btn--small {
  width: auto;
  min-height: 32px;
  padding: 0 12px;
  border-radius: var(--kr-r10);
  font-size: 12px;
}

.kr-action-row {
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.kr-bottom-action {
  margin-top: 18px;
}

/* Forms */

.kr-field {
  display: grid;
  gap: 6px;
}

.kr-label {
  margin: 0;
  font-size: 12px;
  font-weight: 900;
  color: var(--kr-text-2);
}

.kr-input,
.kr-select,
.kr-textarea {
  width: 100%;
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r12);
  background: #fff;
  color: var(--kr-text);
  outline: none;
  font-size: 13px;
}

.kr-input,
.kr-select {
  min-height: 42px;
  padding: 0 12px;
}

.kr-textarea {
  min-height: 84px;
  padding: 11px 12px;
  resize: vertical;
  line-height: 1.45;
}

.kr-input::placeholder,
.kr-textarea::placeholder {
  color: var(--kr-muted-2);
}

.kr-select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--kr-muted) 50%),
    linear-gradient(135deg, var(--kr-muted) 50%, transparent 50%);
  background-position:
    calc(100% - 16px) 50%,
    calc(100% - 11px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

/* Cards */

.kr-card {
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r18);
  background: #fff;
  box-shadow: var(--kr-card-shadow);
  padding: 13px;
}

.kr-card--flat {
  box-shadow: none;
}

.kr-card--soft {
  background: var(--kr-soft-2);
}

.kr-menu-list {
  display: grid;
  gap: 10px;
}

.kr-menu-card {
  min-height: 58px;
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r14);
  background: #fff;
  padding: 11px;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 10px;
  align-items: center;
  text-align: left;
}

.kr-menu-card__icon {
  width: 34px;
  height: 34px;
  border-radius: var(--kr-r10);
  background: var(--kr-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #111;
}

.kr-menu-card__title {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
  line-height: 1.2;
}

.kr-menu-card__text {
  margin: 3px 0 0;
  color: var(--kr-muted);
  font-size: 11px;
  line-height: 1.25;
}

.kr-chevron {
  color: var(--kr-muted-2);
  font-size: 18px;
}

/* Chips / tabs */

.kr-chips,
.kr-tabs {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 3px;
  scrollbar-width: none;
}

.kr-chips::-webkit-scrollbar,
.kr-tabs::-webkit-scrollbar {
  display: none;
}

.kr-chip,
.kr-tab {
  min-height: 31px;
  border: 0;
  border-radius: 999px;
  padding: 0 12px;
  background: var(--kr-soft);
  color: var(--kr-text-2);
  white-space: nowrap;
  font-size: 12px;
  font-weight: 900;
}

.kr-chip.is-active,
.kr-tab.is-active {
  background: var(--kr-yellow);
  color: #111;
}

.kr-tab--line {
  border-radius: 0;
  background: transparent;
  border-bottom: 2px solid transparent;
}

.kr-tab--line.is-active {
  background: transparent;
  border-bottom-color: var(--kr-yellow);
}

/* Bottom navigation */

.kr-bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 50;
  width: 100%;
  max-width: var(--kr-screen);
  min-height: var(--kr-bottom-nav);
  transform: translateX(-50%);
  background: rgba(255, 255, 255, .96);
  border-top: 1px solid var(--kr-line);
  backdrop-filter: blur(18px);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 6px 7px max(7px, env(safe-area-inset-bottom));
}

.kr-nav {
  border: 0;
  background: transparent;
  color: var(--kr-muted);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  font-size: 10.5px;
  line-height: 1;
  font-weight: 850;
}

.kr-nav__icon {
  font-size: 20px;
  line-height: 1;
}

.kr-nav.is-active {
  color: var(--kr-yellow-2);
}

/* Service grid */

.kr-service-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.kr-service-tile {
  min-height: 86px;
  border: 0;
  border-radius: var(--kr-r14);
  background: linear-gradient(180deg, #f8f8f9, #eeeeef);
  padding: 10px 6px;
  display: grid;
  place-items: center;
  gap: 7px;
  text-align: center;
}

.kr-service-tile__icon {
  font-size: 24px;
  line-height: 1;
}

.kr-service-tile__title {
  font-size: 11.5px;
  line-height: 1.15;
  font-weight: 950;
}

/* News */

.kr-news-list {
  display: grid;
  gap: 12px;
}

.kr-news-card {
  overflow: hidden;
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r18);
  background: #fff;
  box-shadow: var(--kr-card-shadow);
}

.kr-news-card__img {
  width: 100%;
  height: 112px;
  object-fit: cover;
  background: var(--kr-soft);
}

.kr-news-card__body {
  padding: 12px;
}

.kr-news-card__title {
  margin: 0 0 7px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 950;
}

.kr-news-card__date {
  color: var(--kr-muted);
  font-size: 11px;
}

/* Products */

.kr-product-cats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.kr-product-cat {
  min-height: 82px;
  border: 0;
  border-radius: var(--kr-r14);
  background: var(--kr-soft-2);
  padding: 10px 6px;
  display: grid;
  place-items: center;
  gap: 7px;
  text-align: center;
}

.kr-product-cat__icon {
  font-size: 23px;
}

.kr-product-cat__title {
  font-size: 11px;
  line-height: 1.12;
  font-weight: 950;
}

.kr-product-card {
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r18);
  background: #fff;
  padding: 12px;
  display: grid;
  grid-template-columns: 1fr 84px;
  gap: 10px;
  align-items: center;
}

.kr-product-card__title {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 950;
}

.kr-product-card__price {
  font-size: 14px;
  font-weight: 950;
}

.kr-product-card__img {
  width: 84px;
  height: 84px;
  object-fit: contain;
}

/* Masters */

.kr-master-list {
  display: grid;
  gap: 12px;
}

.kr-master-row {
  border-bottom: 1px solid var(--kr-line);
  padding-bottom: 11px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 10px;
  align-items: center;
}

.kr-master-row:last-child {
  border-bottom: 0;
}

.kr-avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--kr-soft);
  object-fit: cover;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 950;
}

.kr-master-row__name {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
}

.kr-master-row__spec {
  margin: 3px 0 0;
  color: var(--kr-muted);
  font-size: 11px;
}

.kr-rating {
  color: var(--kr-yellow-2);
  font-size: 11px;
  font-weight: 950;
}

.kr-master-row__side {
  text-align: right;
  color: var(--kr-muted);
  font-size: 10.5px;
}

/* Chat list */

.kr-chat-list {
  display: grid;
  gap: 12px;
}

.kr-chat-row {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 10px;
  align-items: center;
}

.kr-chat-row__name {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
}

.kr-chat-row__msg {
  margin: 3px 0 0;
  color: var(--kr-muted);
  font-size: 11px;
  line-height: 1.25;
}

.kr-chat-row__time {
  color: var(--kr-muted);
  font-size: 10.5px;
  text-align: right;
}

.kr-unread {
  min-width: 19px;
  height: 19px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--kr-yellow);
  color: #111;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 950;
}

/* Service detail */

.kr-hero-img {
  width: 100%;
  height: 154px;
  border-radius: var(--kr-r18);
  object-fit: cover;
  background: var(--kr-soft);
  margin-bottom: 14px;
}

.kr-detail-title {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 950;
}

.kr-detail-text {
  margin: 0;
  color: var(--kr-muted);
  font-size: 12px;
  line-height: 1.45;
}

.kr-feature-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin: 14px 0;
}

.kr-feature {
  min-height: 68px;
  border-radius: var(--kr-r14);
  background: var(--kr-soft-2);
  padding: 9px 6px;
  text-align: center;
}

.kr-feature__value {
  margin: 0 0 3px;
  font-size: 13px;
  font-weight: 950;
}

.kr-feature__label {
  margin: 0;
  color: var(--kr-muted);
  font-size: 10px;
}

/* Booking */

.kr-booking-service {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 10px;
  align-items: center;
}

.kr-booking-service__img {
  width: 70px;
  height: 60px;
  border-radius: var(--kr-r10);
  object-fit: cover;
  background: var(--kr-soft);
}

.kr-booking-service__name {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 950;
}

.kr-booking-total {
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 950;
}

/* Orders */

.kr-order-list {
  display: grid;
  gap: 11px;
}

.kr-order-card {
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r18);
  background: #fff;
  padding: 13px;
  display: grid;
  gap: 8px;
}

.kr-order-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.kr-order-card__id {
  font-size: 13px;
  font-weight: 950;
}

.kr-order-card__title {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
}

.kr-order-card__meta {
  margin: 0;
  color: var(--kr-muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.kr-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 950;
}

.kr-badge--green {
  color: #15803d;
  background: var(--kr-green-soft);
}

.kr-badge--yellow {
  color: #8a6100;
  background: var(--kr-yellow-soft);
}

.kr-badge--blue {
  color: var(--kr-blue);
  background: var(--kr-blue-soft);
}

.kr-badge--orange {
  color: var(--kr-orange);
  background: var(--kr-orange-soft);
}

.kr-badge--red {
  color: var(--kr-red);
  background: var(--kr-red-soft);
}

/* Order detail */

.kr-info-list {
  display: grid;
  gap: 11px;
}

.kr-info-line {
  display: grid;
  gap: 3px;
}

.kr-info-line__label {
  color: var(--kr-muted);
  font-size: 11px;
}

.kr-info-line__value {
  color: var(--kr-text);
  font-size: 13px;
  font-weight: 850;
}

.kr-photo-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.kr-photo {
  width: 68px;
  height: 58px;
  border-radius: var(--kr-r10);
  background: var(--kr-soft);
  object-fit: cover;
  border: 1px solid var(--kr-line);
}

.kr-photo-more {
  width: 68px;
  height: 58px;
  border-radius: var(--kr-r10);
  background: rgba(0,0,0,.48);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 13px;
  font-weight: 950;
}

.kr-map {
  height: 86px;
  border-radius: var(--kr-r14);
  border: 1px solid var(--kr-line);
  background:
    radial-gradient(circle at 58% 48%, #1889ff 0 5px, #fff 6px 8px, transparent 9px),
    linear-gradient(35deg, transparent 0 45%, rgba(34,197,94,.18) 46% 54%, transparent 55%),
    linear-gradient(90deg, #edf1f4 1px, transparent 1px),
    linear-gradient(0deg, #edf1f4 1px, transparent 1px),
    #fafafa;
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
}

/* Repair stages */

.kr-timeline {
  display: grid;
  gap: 17px;
  margin: 14px 0 18px;
}

.kr-timeline__item {
  position: relative;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  align-items: start;
}

.kr-timeline__item::before {
  content: "";
  position: absolute;
  left: 13px;
  top: 27px;
  bottom: -19px;
  width: 2px;
  background: var(--kr-line);
}

.kr-timeline__item:last-child::before {
  display: none;
}

.kr-timeline__dot {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 2px solid var(--kr-line-2);
  background: #fff;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 13px;
  font-weight: 950;
}

.kr-timeline__item.is-done .kr-timeline__dot {
  border-color: var(--kr-green);
  background: var(--kr-green);
}

.kr-timeline__item.is-active .kr-timeline__dot {
  border-color: var(--kr-yellow-2);
  background: #fff;
  box-shadow: inset 0 0 0 5px var(--kr-yellow);
}

.kr-timeline__title {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
}

.kr-timeline__time {
  margin: 2px 0 0;
  color: var(--kr-muted);
  font-size: 11px;
}

/* VIN search */

.kr-vin-card {
  display: grid;
  grid-template-columns: 1fr 94px;
  gap: 10px;
  align-items: center;
}

.kr-vin-card__brand {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 950;
}

.kr-vin-card__meta {
  margin: 0 0 4px;
  color: var(--kr-muted);
  font-size: 11.5px;
  line-height: 1.3;
}

.kr-vin-car-img {
  width: 94px;
  height: 64px;
  object-fit: contain;
}

.kr-vin-category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.kr-vin-category {
  min-height: 76px;
  border: 0;
  border-radius: var(--kr-r14);
  background: var(--kr-soft-2);
  padding: 9px 5px;
  display: grid;
  place-items: center;
  gap: 6px;
  text-align: center;
}

.kr-vin-category__icon {
  font-size: 22px;
}

.kr-vin-category__title {
  font-size: 10.5px;
  line-height: 1.12;
  font-weight: 950;
}

/* Favorites */

.kr-fav-list {
  display: grid;
  gap: 10px;
}

.kr-fav-card {
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r18);
  background: #fff;
  padding: 11px;
  display: grid;
  grid-template-columns: 70px 1fr 28px;
  gap: 10px;
  align-items: center;
}

.kr-fav-card__img {
  width: 70px;
  height: 58px;
  border-radius: var(--kr-r10);
  object-fit: cover;
  background: var(--kr-soft);
}

.kr-fav-card__title {
  margin: 0 0 4px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 950;
}

.kr-fav-card__meta {
  margin: 0;
  color: var(--kr-muted);
  font-size: 11px;
}

.kr-heart {
  color: var(--kr-yellow-2);
  font-size: 20px;
}

/* Profile */

.kr-profile-head {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.kr-profile-avatar {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  background: var(--kr-soft);
  object-fit: cover;
}

.kr-profile-name {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 950;
}

.kr-profile-contact {
  margin: 0;
  color: var(--kr-muted);
  font-size: 11.5px;
}

.kr-car-card {
  border: 1px solid var(--kr-line);
  border-radius: var(--kr-r14);
  background: #fff;
  padding: 11px;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 10px;
  align-items: center;
}

.kr-car-card__title {
  margin: 0;
  font-size: 13px;
  font-weight: 950;
}

.kr-car-card__meta {
  margin: 2px 0 0;
  color: var(--kr-muted);
  font-size: 11px;
}

.kr-settings-list {
  display: grid;
  gap: 2px;
}

.kr-settings-item {
  min-height: 45px;
  border: 0;
  border-bottom: 1px solid var(--kr-line);
  background: transparent;
  padding: 0;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  text-align: left;
}

.kr-settings-item__text {
  font-size: 13px;
  font-weight: 850;
}

/* Board view for visual checking */

.kr-ui-board {
  width: 100%;
  min-height: 100vh;
  padding: 26px;
  background: #fff;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 28px 20px;
}

.kr-ui-board__item {
  display: grid;
  gap: 10px;
  justify-items: center;
}

.kr-ui-board__title {
  margin: 0;
  text-align: center;
  font-size: 15px;
  font-weight: 950;
}

.kr-phone {
  width: 210px;
  height: 456px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid #d9d9df;
  box-shadow: var(--kr-shadow);
  overflow: hidden;
}

/* Utilities */

.kr-mt-0 { margin-top: 0; }
.kr-mt-8 { margin-top: 8px; }
.kr-mt-12 { margin-top: 12px; }
.kr-mt-16 { margin-top: 16px; }
.kr-mt-20 { margin-top: 20px; }

.kr-text-muted { color: var(--kr-muted); }
.kr-text-yellow { color: var(--kr-yellow-2); }
.kr-text-green { color: var(--kr-green); }
.kr-text-red { color: var(--kr-red); }

.kr-fw-800 { font-weight: 800; }
.kr-fw-900 { font-weight: 900; }
.kr-fw-950 { font-weight: 950; }

.kr-hide-scrollbar {
  scrollbar-width: none;
}

.kr-hide-scrollbar::-webkit-scrollbar {
  display: none;
}

/* Responsive */

@media (max-width: 420px) {
  :root {
    --kr-screen: 100vw;
  }

  .kr-screen {
    max-width: none;
  }
}

@media (min-width: 768px) {
  .kr-screen {
    border-left: 1px solid var(--kr-line);
    border-right: 1px solid var(--kr-line);
  }
}

/* === SOURCE: css/client_master_reference_r1.css === */
/* CLIENT-MASTER-r1
   Client-facing master pages refresh based on the new KARETA mobile reference.
   Scope: #masters list and #masters:<id> master profile family.
   This is a CSS design layer only: it does not rewrite existing business flows.
*/

body.kareta-page-masters,
body.kareta-page-master_profile{
  --cm-bg:#f6f6f7;
  --cm-page:#fff;
  --cm-soft:#f4f4f5;
  --cm-line:#e8e8eb;
  --cm-text:#111;
  --cm-muted:#71717a;
  --cm-yellow:#ffc400;
  --cm-yellow-2:#ffb800;
  --cm-shadow:0 6px 18px rgba(15,23,42,.06);
  background:var(--cm-bg);
}

body.kareta-page-masters .page.masters-page-shell,
body.kareta-page-master_profile .page.master-profile-page{
  background:var(--cm-page);
  color:var(--cm-text);
  max-width:430px;
  min-height:100dvh;
  margin:0 auto;
  padding-bottom:calc(var(--bottom-nav-h, 72px) + 16px);
  overflow-x:hidden;
  box-shadow:0 0 0 1px rgba(232,232,235,.8);
}

body.kareta-page-masters .spa-content,
body.kareta-page-master_profile .container{
  padding-left:14px !important;
  padding-right:14px !important;
}

body.kareta-page-masters .spa-page-hero,
body.kareta-page-masters .masters-hero{
  background:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  padding:16px 14px 6px !important;
}

body.kareta-page-masters .spa-page-hero__title,
body.kareta-page-masters .page-hero__title,
body.kareta-page-masters .masters-hero h1{
  font-size:21px !important;
  line-height:1.1 !important;
  letter-spacing:-.45px;
  color:#111 !important;
  font-weight:950 !important;
}

body.kareta-page-masters .spa-page-hero__lead,
body.kareta-page-masters .page-hero__lead{
  font-size:12px !important;
  color:var(--cm-muted) !important;
  line-height:1.35 !important;
}

body.kareta-page-masters .catalog-tools,
body.kareta-page-masters .masters-sticky-tools{
  position:static !important;
  top:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:8px 0 12px !important;
}

body.kareta-page-masters .catalog-tools__actions,
body.kareta-page-masters .catalog-tool-btn,
body.kareta-page-masters .catalog-tools .catalog-tools__filters{
  display:none !important;
}

body.kareta-page-masters .catalog-tools__inner{
  display:block !important;
  padding:0 !important;
}

body.kareta-page-masters .catalog-tools__search,
body.kareta-page-masters .mo-search-action,
body.kareta-page-masters .mo-search-panel{
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 44px !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.kareta-page-masters .mo-search-input{
  height:42px !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--cm-soft) !important;
  padding:0 13px !important;
  color:#111 !important;
  font-size:13px !important;
  box-shadow:none !important;
}

body.kareta-page-masters .mo-search-submit{
  width:44px !important;
  height:42px !important;
  min-width:44px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--cm-yellow) !important;
  color:#111 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:none !important;
}
body.kareta-page-masters .mo-search-submit b{display:none !important;}

body.kareta-page-masters .masters-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
  margin-top:10px !important;
}

body.kareta-page-masters .master-contact-row{
  border:1px solid var(--cm-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:var(--cm-shadow) !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:start !important;
  color:#111 !important;
}

body.kareta-page-masters .mcl-avatar{
  width:54px !important;
  height:54px !important;
  border-radius:999px !important;
  border:0 !important;
  background:var(--cm-soft) !important;
  color:#111 !important;
  font-weight:950 !important;
  font-size:18px !important;
}

body.kareta-page-masters .mcl-name{
  color:#111 !important;
  font-size:15px !important;
  font-weight:950 !important;
  line-height:1.15 !important;
}
body.kareta-page-masters .mcl-spec{
  color:var(--cm-muted) !important;
  font-size:12px !important;
  line-height:1.35 !important;
  margin-top:4px !important;
}
body.kareta-page-masters .mcl-rating,
body.kareta-page-masters .mcl-price{
  color:#111 !important;
  font-weight:950 !important;
}
body.kareta-page-masters .mcl-meta{
  margin-top:10px !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}
body.kareta-page-masters .mcl-meta-item,
body.kareta-page-masters .mcl-msg-chip{
  min-height:26px !important;
  border-radius:999px !important;
  background:#f4f4f5 !important;
  border:0 !important;
  color:#242424 !important;
  font-size:11px !important;
  font-weight:850 !important;
  padding:0 9px !important;
}
body.kareta-page-masters .mcl-msg-chip--profile{
  background:var(--cm-yellow) !important;
  color:#111 !important;
}

body.kareta-page-master_profile .master-profile-hero{
  min-height:0 !important;
  background:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}
body.kareta-page-master_profile .master-profile-hero .container{
  padding-top:16px !important;
}
body.kareta-page-master_profile .master-profile-hero__inner{
  border:1px solid var(--cm-line) !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:var(--cm-shadow) !important;
  padding:0 0 14px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  overflow:hidden !important;
}
body.kareta-page-master_profile .master-profile-hero__inner::before{
  content:'';
  display:block;
  height:132px;
  background:linear-gradient(135deg, rgba(17,17,17,.72), rgba(17,17,17,.18)), var(--cm-soft);
}
body.kareta-page-master_profile .master-profile-hero__avatar{
  width:70px !important;
  height:70px !important;
  margin:-38px 0 0 16px !important;
  border:4px solid #fff !important;
  border-radius:999px !important;
  background:#f4f4f5 !important;
  color:#111 !important;
  font-size:22px !important;
  font-weight:950 !important;
  z-index:1;
}
body.kareta-page-master_profile .master-profile-hero__name{
  margin:8px 16px 0 !important;
  color:#111 !important;
  font-size:20px !important;
  line-height:1.15 !important;
  font-weight:950 !important;
}
body.kareta-page-master_profile .master-profile-hero__spec,
body.kareta-page-master_profile .master-profile-hero__biz{
  margin-left:16px !important;
  margin-right:16px !important;
  color:var(--cm-muted) !important;
  font-size:12px !important;
}
body.kareta-page-master_profile .master-profile-badges{
  margin:12px 16px 0 !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
body.kareta-page-master_profile .master-profile-badge{
  min-height:42px !important;
  border-radius:12px !important;
  background:#fafafa !important;
  border:1px solid var(--cm-line) !important;
  color:#111 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:950 !important;
}
body.kareta-page-master_profile .master-profile-cta{
  margin:12px 16px 0 !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}
body.kareta-page-master_profile .master-profile-action{
  min-height:42px !important;
  border-radius:12px !important;
  font-size:12px !important;
  font-weight:950 !important;
}
body.kareta-page-master_profile .master-profile-action--order{
  grid-column:1/-1;
  background:var(--cm-yellow) !important;
  color:#111 !important;
  border:0 !important;
}

body.kareta-page-master_profile .mprof-tabs{
  margin:16px 0 14px !important;
  padding:0 0 4px !important;
  display:flex !important;
  gap:7px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
}
body.kareta-page-master_profile .mprof-tabs::-webkit-scrollbar{display:none !important;}
body.kareta-page-master_profile .mprof-tab{
  flex:0 0 auto !important;
  min-height:32px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f4f4f5 !important;
  color:#111 !important;
  padding:0 12px !important;
  display:flex !important;
  gap:6px !important;
  align-items:center !important;
}
body.kareta-page-master_profile .mprof-tab.active{
  background:var(--cm-yellow) !important;
}
body.kareta-page-master_profile .mprof-tab-desc,
body.kareta-page-master_profile .mprof-tab-count{display:none !important;}
body.kareta-page-master_profile .mprof-tab-label{
  font-size:12px !important;
  font-weight:900 !important;
}

body.kareta-page-master_profile .mprof-pane,
body.kareta-page-master_profile .pf-section,
body.kareta-page-master_profile .card,
body.kareta-page-master_profile .master-cta-banner{
  border-radius:18px !important;
  background:#fff !important;
  border:1px solid var(--cm-line) !important;
  box-shadow:var(--cm-shadow) !important;
  color:#111 !important;
}
body.kareta-page-master_profile .mprof-pane{
  padding:14px !important;
}
body.kareta-page-master_profile .mprof-pane h2,
body.kareta-page-master_profile .mprof-pane h3,
body.kareta-page-master_profile .card h2,
body.kareta-page-master_profile .card h3{
  color:#111 !important;
  font-weight:950 !important;
}
body.kareta-page-master_profile .mprof-pane p,
body.kareta-page-master_profile .card p,
body.kareta-page-master_profile .muted{
  color:var(--cm-muted) !important;
}
body.kareta-page-master_profile .btn-primary,
body.kareta-page-master_profile .master-cta-banner .btn-primary{
  background:var(--cm-yellow) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:none !important;
}
body.kareta-page-master_profile .btn-outline{
  background:#fff !important;
  color:#111 !important;
  border:1px solid var(--cm-line) !important;
}

@media (min-width:768px){
  body.kareta-page-masters .page.masters-page-shell,
  body.kareta-page-master_profile .page.master-profile-page{
    border-left:1px solid var(--cm-line);
    border-right:1px solid var(--cm-line);
  }
}

/* === SOURCE: css/client_masters_r2_screen4.css === */
/* CLIENT-MASTERS-r2 — screen 4 from full client path.
   Scope: #masters list only. Does not alter master profile, orders, parts, or STO. */

.kr-client-masters-page{
  min-height:100dvh;
  background:#f6f6f7;
  color:#111;
}

.kr-screen--masters{
  background:#fff;
  padding-top:14px;
}

.kr-master-screen-header{
  margin-bottom:10px;
}

.kr-master-screen-header .kr-back{
  font-size:28px;
  line-height:1;
}

.kr-master-screen-header .kr-icon-btn{
  font-size:17px;
}

.kr-master-screen-search{
  margin:6px 0 13px;
}

.kr-master-screen-search .kr-search__input{
  height:38px;
  border-radius:10px;
  background:#f4f4f5;
  padding-left:13px;
  font-size:12px;
  font-weight:700;
}

.kr-master-screen-tabs{
  margin:0 0 12px;
  gap:8px;
}

.kr-master-screen-tabs .kr-tab{
  height:32px;
  min-height:32px;
  padding:0 14px;
  background:#f3f3f4;
  color:#242424;
  font-size:12px;
  font-weight:900;
}

.kr-master-screen-tabs .kr-tab.is-active{
  background:#ffc400;
  color:#111;
}

.kr-master-screen-list{
  display:grid;
  gap:13px;
}

.kr-master-screen-card{
  width:100%;
  border:0;
  border-bottom:1px solid #ececef;
  background:#fff;
  padding:0 0 13px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  text-align:left;
  cursor:pointer;
}

.kr-master-screen-card:last-child{
  border-bottom:0;
}

.kr-master-screen-card[hidden]{
  display:none !important;
}

.kr-master-screen-avatar{
  position:relative;
  width:48px;
  height:48px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#f2f2f3,#e8e8ea);
  color:#111;
  font-size:13px;
  font-weight:950;
  overflow:hidden;
}

.kr-master-screen-avatar span{
  position:absolute;
  right:2px;
  bottom:3px;
  width:11px;
  height:11px;
  border-radius:999px;
  border:2px solid #fff;
}

.kr-master-screen-avatar span.is-online{
  background:#22c55e;
}

.kr-master-screen-avatar span.is-busy{
  background:#ef4444;
}

.kr-master-screen-body{
  min-width:0;
  display:grid;
  gap:4px;
}

.kr-master-screen-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.kr-master-screen-top h3{
  margin:0;
  min-width:0;
  color:#111;
  font-size:13.5px;
  line-height:1.15;
  font-weight:950;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kr-master-screen-top b{
  flex:0 0 auto;
  color:#111;
  font-size:11.5px;
  line-height:1.2;
  font-weight:950;
  white-space:nowrap;
}

.kr-master-screen-spec{
  margin:0;
  color:#3f3f46;
  font-size:11.5px;
  line-height:1.25;
  font-weight:750;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kr-master-screen-meta{
  display:flex;
  align-items:center;
  gap:4px;
  min-width:0;
  color:#71717a;
  font-size:10.5px;
  line-height:1.15;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.kr-master-screen-meta span:first-child{
  color:#111;
}

.kr-master-screen-chevron{
  color:#a1a1aa;
  font-size:21px;
  line-height:1;
  padding-left:2px;
}

.kr-master-screen-empty{
  display:grid;
  gap:5px;
  padding:18px;
  text-align:center;
  color:#71717a;
  border-radius:18px;
  background:#fafafa;
  box-shadow:none;
}

.kr-master-screen-empty b{
  color:#111;
  font-size:14px;
}

.kr-master-screen-empty span{
  font-size:12px;
  line-height:1.35;
}

/* Guard against older hero/catalog styling leaking into the new #masters screen */
.kr-client-masters-page .spa-page-hero,
.kr-client-masters-page .masters-hero,
.kr-client-masters-page .catalog-tools,
.kr-client-masters-page .masters-grid{
  display:none !important;
}

@media (min-width:768px){
  .kr-client-masters-page{
    padding:18px 0;
  }

  .kr-screen--masters{
    border:1px solid #e8e8eb;
    border-radius:26px;
    min-height:calc(100dvh - 36px);
    box-shadow:0 24px 70px rgba(15,23,42,.09);
  }
}

/* === SOURCE: css/bottom_nav_reference.css === */
/* APP-NAV-r1 — bottom navigation aligned to the provided KARETA app references.
   Scope: #bottom-nav only. Keeps routes/API untouched. */
:root{
  --bnav-ref-h:72px;
  --bnav-ref-yellow:#ffb800;
  --bnav-ref-text:#111111;
  --bnav-ref-muted:#6f7279;
  --bnav-ref-line:#ededf0;
}
#bottom-nav{
  display:flex !important;
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:0 !important;
  width:100% !important;
  max-width:430px !important;
  min-height:calc(var(--bnav-ref-h) + env(safe-area-inset-bottom, 0px)) !important;
  height:calc(var(--bnav-ref-h) + env(safe-area-inset-bottom, 0px)) !important;
  transform:translateX(-50%) !important;
  padding:6px 8px max(7px, env(safe-area-inset-bottom, 0px)) !important;
  background:rgba(255,255,255,.97) !important;
  border-top:1px solid var(--bnav-ref-line) !important;
  box-shadow:0 -10px 30px rgba(15,23,42,.06) !important;
  backdrop-filter:blur(18px) saturate(1.25) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.25) !important;
  z-index:900 !important;
  box-sizing:border-box !important;
}
#bottom-nav .bnav-inner{
  width:100% !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  align-items:stretch !important;
  gap:0 !important;
  padding:0 !important;
  overflow:visible !important;
}
#bottom-nav .bnav-item{
  min-width:0 !important;
  max-width:none !important;
  min-height:0 !important;
  height:100% !important;
  margin:0 !important;
  padding:5px 2px 3px !important;
  border:0 !important;
  border-radius:14px !important;
  background:transparent !important;
  color:var(--bnav-ref-muted) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  -webkit-tap-highlight-color:transparent !important;
  box-shadow:none !important;
}
#bottom-nav .bnav-item:active{
  transform:scale(.96) !important;
  background:transparent !important;
}
#bottom-nav .bnav-item:hover{
  color:var(--bnav-ref-muted) !important;
  background:transparent !important;
}
#bottom-nav .bnav-item.active{
  color:var(--bnav-ref-yellow) !important;
  background:transparent !important;
  box-shadow:none !important;
}
#bottom-nav .bnav-icon-wrap{
  width:30px !important;
  height:28px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:12px !important;
  position:relative !important;
  color:currentColor !important;
  background:transparent !important;
}
#bottom-nav .bnav-item.active .bnav-icon-wrap{
  color:var(--bnav-ref-yellow) !important;
  background:transparent !important;
}
#bottom-nav .bnav-item.active .bnav-icon-wrap::after,
#bottom-nav .bnav-item.active .bnav-icon-wrap::before{
  display:none !important;
  content:none !important;
}
#bottom-nav .bnav-svg{
  width:22px !important;
  height:22px !important;
  display:block !important;
  stroke:currentColor !important;
  fill:none !important;
  stroke-width:1.85 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
#bottom-nav .bnav-icon{
  font-size:20px !important;
  line-height:1 !important;
  color:currentColor !important;
  transform:none !important;
}
#bottom-nav .bnav-item.active .bnav-icon,
#bottom-nav .bnav-item.active .bnav-svg{
  transform:none !important;
}
#bottom-nav .bnav-label{
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:currentColor !important;
  font-size:10.2px !important;
  line-height:1.05 !important;
  font-weight:760 !important;
  letter-spacing:0 !important;
  text-align:center !important;
}
#bottom-nav .bnav-item.active .bnav-label{
  color:var(--bnav-ref-yellow) !important;
  font-weight:900 !important;
}
#bottom-nav .bnav-badge{
  position:absolute !important;
  top:-4px !important;
  right:-6px !important;
  min-width:18px !important;
  height:18px !important;
  padding:0 5px !important;
  border:2px solid #fff !important;
  border-radius:999px !important;
  background:var(--bnav-ref-yellow) !important;
  color:#111 !important;
  font-size:9px !important;
  font-weight:900 !important;
  line-height:14px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#bottom-nav .bnav-item--center .bnav-icon-wrap{
  width:44px !important;
  height:44px !important;
  margin-top:-18px !important;
  border-radius:50% !important;
  background:var(--bnav-ref-yellow) !important;
  color:#111 !important;
  box-shadow:0 10px 22px rgba(255,184,0,.28) !important;
}
#bottom-nav .bnav-item--center .bnav-label{
  margin-top:-2px !important;
}
body #app,
body .page,
body .spa-page,
body .kr-screen,
body .services-app-page,
body .services-lite-page{
  padding-bottom:calc(var(--bnav-ref-h) + env(safe-area-inset-bottom,0px) + 14px) !important;
}
@media (min-width:768px){
  #bottom-nav{
    border-left:1px solid var(--bnav-ref-line) !important;
    border-right:1px solid var(--bnav-ref-line) !important;
    border-radius:0 !important;
  }
}
@media (max-width:360px){
  #bottom-nav .bnav-label{font-size:9.3px !important;}
  #bottom-nav .bnav-svg{width:20px !important;height:20px !important;}
}

/* === SOURCE: css/app_request_r1.css === */
/* APP-REQUEST-r1
   Unified app-style request screen for SOS / tow truck / legal help / service.
   Scope: services app request flow only.
*/
.services-app-emergency-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 12px;
}
.services-app-emergency-row button{
  min-height:46px;
  border:1px solid #eeeeee;
  border-radius:10px;
  background:#fff;
  color:#101114;
  box-shadow:0 6px 18px rgba(15,23,42,.045);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:6px 5px;
  cursor:pointer;
}
.services-app-emergency-row button span{
  width:18px;
  height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.services-app-emergency-row button svg{
  width:18px;
  height:18px;
  stroke:#101114;
  stroke-width:1.9;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.services-app-emergency-row button b{
  font-size:10.5px;
  line-height:1;
  font-weight:900;
  color:#101114;
}
.services-app-page--request-sos .services-app-selected-card,
.services-app-page--request-tow .services-app-selected-card,
.services-app-page--request-legal .services-app-selected-card{
  border-color:rgba(255,179,0,.34);
  background:linear-gradient(180deg,#fff,#fff9e8);
}
.services-app-page--request-sos .services-app-submit,
.services-app-page--request-tow .services-app-submit,
.services-app-page--request-legal .services-app-submit{
  height:46px;
}
.services-app-page--request-sos .services-app-form-note,
.services-app-page--request-tow .services-app-form-note,
.services-app-page--request-legal .services-app-form-note{
  color:#6b7280;
  line-height:1.35;
  padding:0 8px;
}
.services-app-form--sos .services-app-field,
.services-app-form--tow .services-app-field,
.services-app-form--legal .services-app-field{
  min-height:40px;
}
.services-app-form--sos .services-app-form-label,
.services-app-form--tow .services-app-form-label,
.services-app-form--legal .services-app-form-label{
  margin-top:6px;
}
@media (max-width:360px){
  .services-app-emergency-row{gap:6px;}
  .services-app-emergency-row button{min-height:44px;gap:4px;}
  .services-app-emergency-row button b{font-size:10px;}
}

/* === SOURCE: css/app_myorders_r1.css === */

/* APP-MYORDERS-r1
   #myorders app-style redesign without touching services/masters/nav flows.
   Scope: body.kareta-page-myorders only.
*/
body.kareta-page-myorders{
  background:#f6f6f7;
}
body.kareta-page-myorders #app,
body.kareta-page-myorders main,
body.kareta-page-myorders .page.spa-page{
  background:#fff;
}
body.kareta-page-myorders .page.spa-page{
  width:100%;
  max-width:430px;
  min-height:100dvh;
  margin:0 auto;
  padding:14px 14px calc(92px + env(safe-area-inset-bottom));
  color:#111;
  overflow-x:hidden;
}
body.kareta-page-myorders .spa-content,
body.kareta-page-myorders .container{
  width:100%;
  max-width:none !important;
  padding:0 !important;
  margin:0 !important;
}
body.kareta-page-myorders .spa-page-hero,
body.kareta-page-myorders .spa-page-hero--compact{
  margin:0 0 12px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
body.kareta-page-myorders .spa-hero-inner,
body.kareta-page-myorders .spa-hero-main,
body.kareta-page-myorders .spa-hero-copy{
  display:block !important;
  padding:0 !important;
  margin:0 !important;
}
body.kareta-page-myorders .spa-hero-kicker,
body.kareta-page-myorders .spa-hero-icon,
body.kareta-page-myorders .spa-hero-sub,
body.kareta-page-myorders .spa-hero-stats,
body.kareta-page-myorders .spa-hero-actions{
  display:none !important;
}
body.kareta-page-myorders .spa-hero-title{
  margin:0 0 10px !important;
  color:#111 !important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:20px !important;
  line-height:1.15 !important;
  font-weight:950 !important;
  letter-spacing:-.02em !important;
}
body.kareta-page-myorders .spa-hero-title::before{
  content:'‹';
  display:inline-flex;
  width:28px;
  height:28px;
  align-items:center;
  justify-content:flex-start;
  margin-right:4px;
  color:#111;
  font-size:28px;
  line-height:1;
  vertical-align:-2px;
}
body.kareta-page-myorders .catalog-tools,
body.kareta-page-myorders .myorders-sticky-tools{
  position:static !important;
  top:auto !important;
  margin:0 0 14px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.kareta-page-myorders .catalog-tools__search,
body.kareta-page-myorders .unified-tools__search,
body.kareta-page-myorders .tools-search{
  margin:0 0 10px !important;
}
body.kareta-page-myorders .catalog-tools input[type="search"],
body.kareta-page-myorders .catalog-tools input,
body.kareta-page-myorders .unified-tools input,
body.kareta-page-myorders .tools-search input{
  height:38px !important;
  border:0 !important;
  border-radius:10px !important;
  background:#f3f3f4 !important;
  color:#111 !important;
  box-shadow:none !important;
  font-size:12px !important;
  font-weight:700 !important;
  padding:0 12px !important;
}
body.kareta-page-myorders .catalog-tools input::placeholder,
body.kareta-page-myorders .unified-tools input::placeholder{
  color:#a1a1aa !important;
}
body.kareta-page-myorders .mo-filter-bar{
  margin:0 0 12px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  overflow:visible !important;
}
body.kareta-page-myorders .mo-filter-tabs{
  display:flex !important;
  gap:7px !important;
  overflow-x:auto !important;
  padding:0 0 4px !important;
  scrollbar-width:none;
}
body.kareta-page-myorders .mo-filter-tabs::-webkit-scrollbar{display:none;}
body.kareta-page-myorders .mo-filter-tab{
  flex:0 0 auto !important;
  min-height:31px !important;
  border:0 !important;
  border-radius:999px !important;
  padding:0 12px !important;
  background:#f2f2f3 !important;
  color:#242424 !important;
  box-shadow:none !important;
  font-size:12px !important;
  line-height:31px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kareta-page-myorders .mo-filter-tab.active,
body.kareta-page-myorders .mo-filter-tab--alert.active{
  background:#ffc400 !important;
  color:#111 !important;
}
body.kareta-page-myorders .mo-filter-tab-ico{
  display:none !important;
}
body.kareta-page-myorders .mo-filter-cnt{
  min-width:18px !important;
  height:18px !important;
  margin-left:6px !important;
  padding:0 5px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  color:#111 !important;
  border:1px solid #ececef !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:950 !important;
}
body.kareta-page-myorders #mo-list,
body.kareta-page-myorders .kr-order-list{
  display:grid;
  gap:11px;
}
body.kareta-page-myorders .mo-card{
  border:1px solid #e8e8eb !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 6px 18px rgba(15,23,42,.055) !important;
  padding:13px !important;
  margin:0 !important;
  color:#111 !important;
  overflow:hidden !important;
}
body.kareta-page-myorders .mo-card + .mo-card{
  margin-top:0 !important;
}
body.kareta-page-myorders .mo-card-head{
  display:grid !important;
  gap:7px !important;
  margin:0 !important;
}
body.kareta-page-myorders .mo-card-top{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
}
body.kareta-page-myorders .mo-card-id{
  color:#111 !important;
  font-size:13px !important;
  font-weight:950 !important;
}
body.kareta-page-myorders .mo-card-title{
  margin:0 !important;
  color:#111 !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-weight:950 !important;
}
body.kareta-page-myorders .mo-card-car{
  color:#71717a !important;
  font-size:11.5px !important;
  line-height:1.35 !important;
  font-weight:750 !important;
}
body.kareta-page-myorders .mo-type-badge,
body.kareta-page-myorders .mo-status-badge{
  min-height:22px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  border:0 !important;
  box-shadow:none !important;
  font-size:10.5px !important;
  line-height:1 !important;
  font-weight:950 !important;
}
body.kareta-page-myorders .mo-type-badge.service,
body.kareta-page-myorders .mo-type-badge.parts{
  color:#1d5fbf !important;
  background:#eaf2ff !important;
}
body.kareta-page-myorders .mo-status-badge.new,
body.kareta-page-myorders .mo-status-badge.waiting_responses,
body.kareta-page-myorders .mo-status-badge.draft{
  color:#8a6100 !important;
  background:#fff3be !important;
}
body.kareta-page-myorders .mo-status-badge.process{
  color:#f97316 !important;
  background:#fff1e7 !important;
}
body.kareta-page-myorders .mo-status-badge.done,
body.kareta-page-myorders .mo-status-badge.done_pending_client{
  color:#15803d !important;
  background:#e7f8ee !important;
}
body.kareta-page-myorders .mo-timeline{
  display:none !important;
}
body.kareta-page-myorders .mo-chat-entity{
  margin:10px 0 0 !important;
  min-height:42px !important;
  border:1px solid #e8e8eb !important;
  border-radius:14px !important;
  background:#fafafa !important;
  padding:8px 10px !important;
  display:grid !important;
  grid-template-columns:30px 1fr auto !important;
  gap:9px !important;
  align-items:center !important;
}
body.kareta-page-myorders .mo-chat-entity-ico{
  width:30px !important;
  height:30px !important;
  border-radius:10px !important;
  background:#f2f2f3 !important;
  display:grid !important;
  place-items:center !important;
  font-size:14px !important;
}
body.kareta-page-myorders .mo-chat-entity-label{
  color:#111 !important;
  font-size:12px !important;
  font-weight:950 !important;
}
body.kareta-page-myorders .mo-chat-entity-hint{
  color:#71717a !important;
  font-size:10.5px !important;
  font-weight:700 !important;
}
body.kareta-page-myorders .mo-chat-entity-arr{
  color:#a1a1aa !important;
  font-size:20px !important;
}
body.kareta-page-myorders .mo-card-actions{
  margin-top:11px !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
body.kareta-page-myorders .mo-card-actions .btn{
  width:100% !important;
  min-height:38px !important;
  padding:0 10px !important;
  border-radius:12px !important;
  font-size:11.5px !important;
  font-weight:950 !important;
  box-shadow:none !important;
}
body.kareta-page-myorders .mo-card-actions .btn-primary{
  background:#ffc400 !important;
  color:#111 !important;
  border:0 !important;
}
body.kareta-page-myorders .mo-card-actions .btn-outline,
body.kareta-page-myorders .mo-card-actions .btn-ghost{
  background:#fff !important;
  color:#111 !important;
  border:1px solid #d9d9df !important;
}
body.kareta-page-myorders .empty-state{
  border:1px solid #e8e8eb !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 6px 18px rgba(15,23,42,.055) !important;
  padding:24px 16px !important;
  color:#111 !important;
}
body.kareta-page-myorders .empty-icon{
  background:#f4f4f5 !important;
  color:#111 !important;
}
@media (min-width:768px){
  body.kareta-page-myorders .page.spa-page{
    border-left:1px solid #e8e8eb;
    border-right:1px solid #e8e8eb;
  }
}

/* === SOURCE: css/ui_r49_global_smoke_check.css === */
/* UI-r49 — global smoke guards after client/master/STO cabinet polish.
   Scope: visual safety only. No route, API, DB or business-logic changes. */
:root{
  --kr-r49-orange:#ff6a00;
  --kr-r49-text:#101821;
  --kr-r49-muted:#667085;
  --kr-r49-line:rgba(15,23,42,.10);
  --kr-r49-card:#fff;
  --kr-r49-soft:rgba(255,106,0,.10);
}

/* Universal anti-overlap contract for icon+text UI controls. */
button,
.btn,
.flow-btn,
.catalog-tool-btn,
.services-app-btn,
.services-app-card,
.services-app-option,
.services-app-sheet-option,
.cabinet-action,
.client-cabinet-card,
.master-cabinet-tile,
.sto-row-btn,
.sto-btn,
.mcab-section .btn{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

button > span,
.btn > span,
.catalog-tool-btn > span,
.services-app-btn > span,
.services-app-card > span,
.services-app-option > span,
.services-app-sheet-option > span,
.client-cabinet-card span,
.master-cabinet-tile span,
.sto-row-btn span,
.sto-btn span{
  min-width:0;
}

button b,
.btn b,
.catalog-tool-btn b,
.services-app-btn b,
.services-app-card b,
.services-app-option b,
.services-app-sheet-option b,
.client-cabinet-card b,
.master-cabinet-tile b,
.sto-row-btn b,
.sto-btn b{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
  line-height:1.18;
}

/* Keep line-icon language consistent with the first onboarding screens. */
[class*="ico"],
[class*="icon"],
.kr-ui-icon,
.mct-ico,
.sto-stat-ico,
.sto-order-ico,
.sto-dash-ico,
.cabinet-stat-ico,
.services-app-card__ico,
.services-app-option__ico,
.bnav-icon-wrap{
  flex:0 0 auto;
  color:var(--kr-r49-orange);
}

/* Prevent old large emoji glyphs from forcing row height or text collision. */
.catalog-tool-btn__ico,
.mo-search-ico,
.services-app-card__ico,
.services-app-option__ico,
.services-app-sheet-option__ico,
.cabinet-stat-ico,
.master-cabinet-icon,
.sto-stat-ico,
.sto-order-ico,
.sto-dash-ico,
.mct-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:14px;
  background:var(--kr-r49-soft);
  border:1px solid rgba(255,106,0,.18);
  font-size:0!important;
  line-height:1;
  overflow:hidden;
}

.catalog-tool-btn__ico::before,
.mo-search-ico::before,
.services-app-card__ico::before,
.services-app-option__ico::before,
.services-app-sheet-option__ico::before,
.cabinet-stat-ico::before,
.master-cabinet-icon::before,
.sto-stat-ico::before,
.sto-order-ico::before,
.sto-dash-ico::before,
.mct-ico::before{
  content:'';
  display:block;
  width:22px;
  height:22px;
  background:currentColor;
  -webkit-mask:var(--kr-ui-icon-user, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.6-4.4 4.2-6 8-6s6.4 1.6 8 6'/%3E%3C/svg%3E")) center / contain no-repeat;
  mask:var(--kr-ui-icon-user, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.6-4.4 4.2-6 8-6s6.4 1.6 8 6'/%3E%3C/svg%3E")) center / contain no-repeat;
}

/* Buttons: final pass after cabinet polish. */
.btn-primary,
.flow-btn--primary,
.services-app-primary,
.services-app-submit,
.onb2-role-continue{
  background:linear-gradient(180deg,#ff7a1a 0%,#ff5a00 100%)!important;
  color:#fff!important;
  border-color:rgba(255,106,0,.95)!important;
  box-shadow:0 12px 26px rgba(255,106,0,.20)!important;
}
.btn-outline,
.btn-secondary,
.flow-btn--secondary,
.services-app-secondary,
.services-app-ghost,
.sto-row-btn,
.sto-btn,
.master-cabinet-tile{
  background:rgba(255,255,255,.86)!important;
  color:var(--kr-r49-text)!important;
  border-color:var(--kr-r49-line)!important;
}

/* Mobile smoke: controls must wrap, not collide. */
@media (max-width:767px){
  .catalog-tool-btn,
  .services-app-btn,
  .services-app-option,
  .services-app-sheet-option,
  .client-cabinet-card,
  .master-cabinet-tile,
  .sto-row-btn,
  .sto-btn{
    gap:10px!important;
    align-items:center!important;
  }
  .catalog-tool-btn b,
  .services-app-btn b,
  .services-app-option b,
  .services-app-sheet-option b,
  .client-cabinet-card b,
  .master-cabinet-tile b,
  .sto-row-btn b,
  .sto-btn b{
    font-size:clamp(13px,3.6vw,16px)!important;
  }
  .catalog-tool-btn__ico,
  .mo-search-ico,
  .services-app-card__ico,
  .services-app-option__ico,
  .services-app-sheet-option__ico,
  .cabinet-stat-ico,
  .master-cabinet-icon,
  .sto-stat-ico,
  .sto-order-ico,
  .sto-dash-ico,
  .mct-ico{
    width:38px;
    height:38px;
    min-width:38px;
    border-radius:13px;
  }
}

/* Tablet/wide smoke: keep cards readable and avoid over-stretched text lines. */
@media (min-width:768px){
  .services-app-phone,
  .client-cabinet-shell,
  .master-cabinet-shell,
  .sto-dispatch-page{
    min-width:0;
    overflow-x:hidden;
  }
  .services-app-list,
  .client-cabinet-grid,
  .master-cabinet-tile-nav,
  .sto-stat-grid{
    align-items:stretch;
  }
  .services-app-card,
  .client-cabinet-card,
  .master-cabinet-tile,
  .sto-stat-card,
  .sto-section{
    min-height:auto;
    height:auto;
  }
  .services-app-card *,
  .client-cabinet-card *,
  .master-cabinet-tile *,
  .sto-section *,
  .sto-stat-card *{
    overflow-wrap:anywhere;
  }
}

@media (min-width:1024px){
  .catalog-tool-btn__ico,
  .mo-search-ico,
  .services-app-card__ico,
  .services-app-option__ico,
  .services-app-sheet-option__ico,
  .cabinet-stat-ico,
  .master-cabinet-icon,
  .sto-stat-ico,
  .sto-order-ico,
  .sto-dash-ico,
  .mct-ico{
    width:46px;
    height:46px;
    min-width:46px;
    border-radius:16px;
  }
}

@media (min-width:768px) and (max-height:760px){
  .services-app-phone,
  .client-cabinet-shell,
  .master-cabinet-shell,
  .sto-dispatch-page{
    padding-top:14px!important;
    padding-bottom:18px!important;
  }
  .client-cabinet-hero,
  .master-cabinet-hero,
  .sto-dispatch-head{
    padding-top:18px!important;
    padding-bottom:18px!important;
  }
}

/* === SOURCE: css/cab_pane_inline_r51.css === */
/* CAB-PANE-r51 — remove legacy #cab-pane-modal from active cabinet UI.
   Scope: client cabinet panes only. Routes/API/DB unchanged. */

#cab-pane-modal,
.cab-pane-modal-overlay{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

body[data-page="cabinet"] .cab-pane-source{
  display:none !important;
}

body[data-page="cabinet"] .cab-pane{
  width:100%;
  min-width:0;
}

body[data-page="cabinet"] .cab-pane.active{
  display:block !important;
  animation:pageIn .22s var(--ease, ease) both;
}

body[data-page="cabinet"] .cab-pane:not(.active){
  display:none !important;
}

body[data-page="cabinet"] .cab-pane > .container{
  width:min(100%, 1180px);
  max-width:1180px;
  margin-inline:auto;
}

body[data-page="cabinet"] .cab-pane-layout,
body[data-page="cabinet"] .profile-form-card,
body[data-page="cabinet"] .profile-side-card,
body[data-page="cabinet"] .cst-grid,
body[data-page="cabinet"] .cst-orders,
body[data-page="cabinet"] .loyalty-hero,
body[data-page="cabinet"] .settings-card{
  min-width:0;
}

body[data-page="cabinet"] .cab-pane .card,
body[data-page="cabinet"] .cab-pane .profile-form-card,
body[data-page="cabinet"] .cab-pane .profile-side-card{
  border-radius:22px;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 12px 28px rgba(15,23,42,.055);
}

@media (min-width:768px){
  body[data-page="cabinet"] .cab-pane{
    padding:22px 0 calc(var(--bottom-nav-h, 72px) + 30px);
  }
  body[data-page="cabinet"] .cab-pane > .container{
    padding-inline:clamp(18px, 3vw, 38px);
  }
}

@media (min-width:1024px){
  body[data-page="cabinet"] .cab-pane{
    padding-top:28px;
  }
  body[data-page="cabinet"] .cab-pane > .container{
    width:min(100%, 1220px);
    max-width:1220px;
  }
}

@media (max-width:767px){
  body[data-page="cabinet"] .cab-pane{
    padding:16px 0 calc(var(--bottom-nav-h, 72px) + env(safe-area-inset-bottom,0px) + 18px);
  }
  body[data-page="cabinet"] .cab-pane > .container{
    padding-inline:14px;
  }
}

/* === SOURCE: css/app_reference_r52.css === */
/* KARETA UI-r52 — app reference background + client home/services + floating dock.
   Scope: client-facing app shell, services-app-page, #bottom-nav.
   Rules: CSS-only visual layer; no API/DB/route changes. */
:root{
  --r52-bg:#eef0f2;
  --r52-page:#ffffff;
  --r52-soft:#f3f3f4;
  --r52-soft-2:#f8f8f9;
  --r52-line:#e7e8eb;
  --r52-text:#090b10;
  --r52-muted:#707782;
  --r52-orange:#ffb000;
  --r52-orange-2:#ff9800;
  --r52-radius:18px;
  --r52-radius-lg:24px;
  --r52-shadow:0 16px 42px rgba(15,23,42,.08);
  --r52-shadow-soft:0 8px 24px rgba(15,23,42,.055);
}

/* Global client background resonance */
body[data-role="client"],
body.kareta-page-services,
body.kareta-page-home{
  background:var(--r52-bg) !important;
}

/* Services home as white app card like the reference */
.services-app-page{
  background:var(--r52-bg) !important;
  color:var(--r52-text) !important;
  padding:clamp(10px,2vw,24px) clamp(10px,2vw,24px) calc(98px + env(safe-area-inset-bottom,0px)) !important;
  min-height:100dvh !important;
}
.services-app-phone{
  width:min(100%, 1040px) !important;
  max-width:1040px !important;
  min-height:calc(100dvh - 130px) !important;
  margin:0 auto !important;
  padding:clamp(18px,3vw,36px) !important;
  background:var(--r52-page) !important;
  border:1px solid rgba(15,23,42,.05) !important;
  border-radius:var(--r52-radius-lg) !important;
  box-shadow:var(--r52-shadow) !important;
  overflow:hidden !important;
}
.services-app-home-head{
  padding:0 !important;
}
.services-app-topline{
  margin:0 0 clamp(20px,3vw,34px) !important;
}
.services-app-logo{
  font-size:clamp(21px,2.2vw,28px) !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
}
.services-app-logo span{
  color:var(--r52-orange) !important;
}
.services-app-icon-btn{
  background:var(--r52-soft) !important;
  border:1px solid rgba(15,23,42,.04) !important;
  color:#0f1720 !important;
  box-shadow:none !important;
}
.services-app-title{
  max-width:370px !important;
  margin:0 !important;
  color:var(--r52-text) !important;
  font-size:clamp(42px,6.2vw,70px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.07em !important;
}
.services-app-search{
  margin-top:clamp(20px,3vw,38px) !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 52px !important;
  gap:8px !important;
  max-width:430px !important;
}
.services-app-search input{
  height:52px !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--r52-soft) !important;
  color:var(--r52-text) !important;
  font-size:15px !important;
  padding:0 16px 0 42px !important;
}
.services-app-search button{
  width:52px !important;
  height:52px !important;
  border-radius:12px !important;
  background:var(--r52-orange) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}

/* Service category tiles */
.services-app-tile-grid,
.services-app-categories,
.services-app-home-grid{
  gap:14px !important;
}
.services-app-tile,
.services-app-cat-card,
.services-app-category-card{
  min-height:118px !important;
  border:0 !important;
  border-radius:14px !important;
  background:var(--r52-soft) !important;
  color:var(--r52-text) !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:12px !important;
  text-align:center !important;
  overflow:hidden !important;
}
.services-app-tile :where(.services-app-tile-ico,.services-app-tile-icon,svg),
.services-app-cat-card :where(.services-app-tile-ico,.services-app-tile-icon,svg){
  color:#171a20 !important;
  stroke:#171a20 !important;
  fill:none !important;
}
.services-app-tile-title,
.services-app-tile b,
.services-app-cat-title{
  color:#111318 !important;
  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.18 !important;
  letter-spacing:-.03em !important;
  text-align:center !important;
}

/* Quick buttons: SOS / tow / lawyer */
.services-app-quick,
.services-app-actions,
.services-app-home-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:clamp(22px,3vw,36px) !important;
}
.services-app-quick button,
.services-app-action-btn,
.services-app-home-actions button{
  min-height:40px !important;
  min-width:128px !important;
  padding:0 16px !important;
  border-radius:10px !important;
  border:1px solid var(--r52-line) !important;
  background:#fff !important;
  color:#161a22 !important;
  box-shadow:0 6px 16px rgba(15,23,42,.035) !important;
  font-weight:800 !important;
  line-height:1.1 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
}

/* Nearby card/list */
.services-app-nearby,
.services-app-near,
.services-app-shops,
.services-app-list{
  min-width:0 !important;
}
.services-app-section-title,
.services-app-nearby-title,
.services-app-list-title{
  color:var(--r52-text) !important;
  font-size:clamp(18px,2vw,22px) !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
}
.services-app-shop-card,
.services-app-list-card,
.services-app-nearby-card{
  min-height:96px !important;
  border-radius:16px !important;
  border:1px solid var(--r52-line) !important;
  background:#fff !important;
  box-shadow:var(--r52-shadow-soft) !important;
  padding:14px !important;
  overflow:hidden !important;
}
.services-app-shop-card :where(h3,b,strong),
.services-app-list-card :where(h3,b,strong){
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:-.035em !important;
  color:var(--r52-text) !important;
}
.services-app-shop-card :where(p,small,span),
.services-app-list-card :where(p,small,span){
  color:var(--r52-muted) !important;
  line-height:1.28 !important;
}

/* Tablet / desktop composition */
@media (min-width:768px){
  .services-app-page{
    padding:clamp(18px,3vw,34px) clamp(18px,3vw,44px) calc(112px + env(safe-area-inset-bottom,0px)) !important;
  }
  .services-app-phone{
    border-radius:28px !important;
    padding:clamp(26px,3.2vw,42px) !important;
  }
  .services-app-home-head{
    display:grid !important;
    grid-template-columns:minmax(280px, .85fr) minmax(360px, 1.15fr) !important;
    align-items:start !important;
    gap:clamp(28px,4vw,62px) !important;
  }
  .services-app-title{
    max-width:420px !important;
  }
  .services-app-search{
    max-width:470px !important;
  }
  .services-app-tile-grid,
  .services-app-categories,
  .services-app-home-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  .services-app-tile,
  .services-app-cat-card,
  .services-app-category-card{
    min-height:128px !important;
  }
  .services-app-home-main,
  .services-app-main,
  .services-app-body{
    margin-top:clamp(28px,4vw,48px) !important;
  }
}

@media (min-width:1024px){
  .services-app-phone{
    max-width:1120px !important;
    min-height:650px !important;
  }
  .services-app-title{
    font-size:68px !important;
  }
  .services-app-tile-grid,
  .services-app-categories,
  .services-app-home-grid{
    gap:16px !important;
  }
  .services-app-tile,
  .services-app-cat-card,
  .services-app-category-card{
    min-height:132px !important;
  }
}

/* Phones remain app-like and full width */
@media (max-width:767px){
  .services-app-page{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
    background:#fff !important;
  }
  .services-app-phone{
    width:100% !important;
    max-width:none !important;
    min-height:100dvh !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 16px 22px !important;
  }
  .services-app-title{
    font-size:42px !important;
    max-width:310px !important;
  }
  .services-app-search{
    grid-template-columns:minmax(0,1fr) 46px !important;
    max-width:none !important;
  }
  .services-app-search input,
  .services-app-search button{
    height:46px !important;
  }
  .services-app-tile-grid,
  .services-app-categories,
  .services-app-home-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .services-app-tile,
  .services-app-cat-card,
  .services-app-category-card{
    min-height:104px !important;
  }
}

/* Bottom nav: floating dock like reference */
#bottom-nav{
  display:flex !important;
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:clamp(10px,2vw,24px) !important;
  transform:translateX(-50%) !important;
  width:min(calc(100vw - 28px), 430px) !important;
  max-width:430px !important;
  min-height:auto !important;
  height:auto !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  z-index:var(--z-bottom-nav,80) !important;
}
#bottom-nav .bnav-inner{
  width:100% !important;
  min-height:72px !important;
  height:72px !important;
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:0 !important;
  padding:8px 12px !important;
  border:1px solid rgba(15,23,42,.06) !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 14px 38px rgba(15,23,42,.12) !important;
  backdrop-filter:blur(18px) saturate(1.2) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.2) !important;
  overflow:hidden !important;
}
#bottom-nav .bnav-item{
  min-width:0 !important;
  width:auto !important;
  min-height:54px !important;
  height:54px !important;
  padding:4px 2px !important;
  border-radius:12px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  color:#6f747d !important;
  text-align:center !important;
  overflow:hidden !important;
}
#bottom-nav .bnav-icon-wrap{
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  min-height:24px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:currentColor !important;
}
#bottom-nav .bnav-svg{
  width:22px !important;
  height:22px !important;
  color:currentColor !important;
  stroke:currentColor !important;
}
#bottom-nav .bnav-icon{
  font-size:21px !important;
  line-height:1 !important;
  color:currentColor !important;
}
#bottom-nav .bnav-label{
  max-width:100% !important;
  color:currentColor !important;
  font-size:10.5px !important;
  line-height:1.05 !important;
  font-weight:850 !important;
  letter-spacing:-.02em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#bottom-nav .bnav-item.active,
#bottom-nav .bnav-item.is-active{
  color:var(--r52-orange-2) !important;
  background:transparent !important;
}
#bottom-nav .bnav-item.active .bnav-icon-wrap,
#bottom-nav .bnav-item.is-active .bnav-icon-wrap{
  color:var(--r52-orange-2) !important;
  background:transparent !important;
  box-shadow:none !important;
}
#bottom-nav .bnav-badge{
  top:2px !important;
  right:10px !important;
  background:var(--r52-orange) !important;
  color:#111 !important;
}

/* Tablet/PC dock width */
@media (min-width:768px){
  #bottom-nav{
    width:min(74vw, 760px) !important;
    max-width:760px !important;
    bottom:clamp(20px,3vw,34px) !important;
  }
  #bottom-nav .bnav-inner{
    min-height:78px !important;
    height:78px !important;
    border-radius:18px !important;
    padding:9px 28px !important;
  }
  #bottom-nav .bnav-item{
    min-height:60px !important;
    height:60px !important;
  }
  #bottom-nav .bnav-svg{
    width:24px !important;
    height:24px !important;
  }
  #bottom-nav .bnav-label{
    font-size:12px !important;
  }
}
@media (min-width:1024px){
  #bottom-nav{
    width:min(66vw, 820px) !important;
    max-width:820px !important;
  }
  #bottom-nav .bnav-inner{
    border-radius:20px !important;
    padding-inline:34px !important;
  }
}
@media (min-width:1280px){
  #bottom-nav{
    width:min(58vw, 860px) !important;
    max-width:860px !important;
  }
}

/* If a role has more than 5 items, keep layout safe without overlap. */
#bottom-nav .bnav-inner[data-count="6"],
#bottom-nav .bnav-inner[data-count="7"]{
  grid-template-columns:repeat(auto-fit,minmax(64px,1fr)) !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
}
#bottom-nav .bnav-inner[data-count="6"]::-webkit-scrollbar,
#bottom-nav .bnav-inner[data-count="7"]::-webkit-scrollbar{display:none !important;}

/* Content breathing room above floating dock */
#app{
  padding-bottom:calc(98px + env(safe-area-inset-bottom,0px)) !important;
}
@media (min-width:768px){
  #app{
    padding-bottom:calc(118px + env(safe-area-inset-bottom,0px)) !important;
  }
}

/* Text-overlap guards for reference pass */
.services-app-page :where(h1,h2,h3,p,span,small,b,strong,button,label),
#bottom-nav :where(span,div,button){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}

/* === SOURCE: css/client_pages_reference_r53.css === */
/* KARETA UI-r53 — client pages reference style pass.
   Scope: Orders / Chats / Favorites / Profile and adjacent client pages.
   Visual-only layer. No API/DB/route/business logic changes. */
:root{
  --r53-bg:#eef0f2;
  --r53-page:#ffffff;
  --r53-soft:#f4f4f5;
  --r53-soft-2:#fafafa;
  --r53-line:#e7e8eb;
  --r53-text:#090b10;
  --r53-muted:#6f747d;
  --r53-orange:#ffb000;
  --r53-orange-2:#ff9800;
  --r53-red:#ef4444;
  --r53-green:#22c55e;
  --r53-radius:16px;
  --r53-radius-lg:24px;
  --r53-shadow:0 16px 42px rgba(15,23,42,.08);
  --r53-shadow-soft:0 8px 24px rgba(15,23,42,.055);
}

/* Client app pages background */
body[data-role="client"] :where(.page,#myorders,#messages,#masters,#cabinet,#parts,#news),
body.kareta-page-myorders,
body.kareta-page-messages,
body.kareta-page-masters,
body.kareta-page-cabinet{
  background:var(--r53-bg) !important;
}

/* Main page containers as white app cards */
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
body[data-role="client"] :where(.cab-pane) > .container,
body[data-role="client"] :where(.client-page,.kr-page,.client-screen){
  max-width:1120px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  background:var(--r53-page) !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:var(--r53-radius-lg) !important;
  box-shadow:var(--r53-shadow) !important;
  padding:clamp(18px,3vw,34px) !important;
  overflow:hidden !important;
}

/* Page headings */
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts) :where(h1,.page-title,.section-title,.cab-title,.ccab-title){
  color:var(--r53-text) !important;
  font-size:clamp(26px,3.2vw,42px) !important;
  line-height:1.02 !important;
  font-weight:950 !important;
  letter-spacing:-.06em !important;
  margin-bottom:clamp(14px,2vw,24px) !important;
}
body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts) :where(p,.page-subtitle,.muted,.ccab-sub,.section-subtitle){
  color:var(--r53-muted) !important;
  line-height:1.35 !important;
}

/* Generic reference cards */
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--r53-line) !important;
  border-radius:var(--r53-radius) !important;
  background:#fff !important;
  box-shadow:var(--r53-shadow-soft) !important;
  overflow:hidden !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card) :where(h2,h3,h4,b,strong){
  color:var(--r53-text) !important;
  font-weight:900 !important;
  letter-spacing:-.035em !important;
  line-height:1.12 !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.ccab-panel,.cabinet-card,.profile-card,.car-card,.settings-row,.notify-row,.notification-card,.review-card,.history-card) :where(p,span,small){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  line-height:1.28 !important;
}

/* Orders page: tabs + cards */
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs){
  display:flex !important;
  gap:8px !important;
  overflow:auto !important;
  scrollbar-width:none !important;
  border-bottom:1px solid var(--r53-line) !important;
  padding-bottom:10px !important;
  margin-bottom:16px !important;
}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs)::-webkit-scrollbar{display:none !important;}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs) :where(button,.tab){
  min-height:36px !important;
  padding:0 14px !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  color:var(--r53-muted) !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}
body[data-role="client"] :where(.orders-tabs,.myorders-tabs,.tabs,.filter-tabs) :where(.active,.is-active,[aria-selected="true"]){
  color:var(--r53-text) !important;
  background:#fff7df !important;
  box-shadow:inset 0 -2px 0 var(--r53-orange) !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card){
  padding:16px !important;
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.order-card,.myorder-card,.mo-card) :where(.status,.badge,.chip){
  width:max-content !important;
  max-width:100% !important;
  min-height:26px !important;
  padding:4px 9px !important;
  border-radius:999px !important;
  background:#ecfdf3 !important;
  color:#15803d !important;
  font-size:12px !important;
  font-weight:850 !important;
}

/* Chats */
body[data-role="client"] :where(.chat-list,.messages-list,.dialogs-list){
  display:grid !important;
  gap:10px !important;
}
body[data-role="client"] :where(.chat-card,.message-card,.dialog-card){
  padding:12px !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.chat-avatar,.message-avatar,.dialog-avatar,.avatar){
  width:54px !important;
  height:54px !important;
  border-radius:14px !important;
  background:#2c2d32 !important;
  color:#fff !important;
  flex:0 0 auto !important;
  overflow:hidden !important;
}
body[data-role="client"] :where(.chat-time,.message-time,.dialog-time){
  color:var(--r53-muted) !important;
  font-size:12px !important;
  white-space:nowrap !important;
}

/* Favorites / masters */
body[data-role="client"] :where(.masters-list,.favorites-list,.fav-list){
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.master-card,.favorite-card,.fav-card){
  padding:14px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.master-card,.favorite-card,.fav-card) :where(img,.thumb,.photo){
  width:64px !important;
  height:64px !important;
  border-radius:14px !important;
  object-fit:cover !important;
  background:#2c2d32 !important;
}

/* Profile / cabinet rows */
body[data-role="client"] :where(.profile-menu,.settings-list,.cab-list,.ccab-list){
  display:grid !important;
  gap:8px !important;
}
body[data-role="client"] :where(.settings-row,.profile-row,.cab-row,.ccab-row){
  min-height:54px !important;
  padding:12px 14px !important;
  border-radius:14px !important;
  background:#fff !important;
  border:1px solid var(--r53-line) !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.settings-row,.profile-row,.cab-row,.ccab-row) :where(.ico,.icon,.row-icon,svg){
  color:#171a20 !important;
  stroke:#171a20 !important;
}

/* Buttons */
body[data-role="client"] :where(.btn,.button,button,.action-btn,.primary-btn,.ccab-btn,.cab-btn){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body[data-role="client"] :where(.btn-primary,.primary-btn,.submit-btn,.save-btn,.cta,.ccab-btn-primary){
  border:0 !important;
  background:linear-gradient(180deg,var(--r53-orange),var(--r53-orange-2)) !important;
  color:#111 !important;
  border-radius:12px !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
  font-weight:900 !important;
}
body[data-role="client"] :where(.btn-secondary,.secondary-btn,.outline-btn,.ghost-btn,.ccab-btn-secondary){
  border:1px solid var(--r53-line) !important;
  background:#fff !important;
  color:var(--r53-text) !important;
  border-radius:12px !important;
  font-weight:850 !important;
}

/* Inputs */
body[data-role="client"] :where(input,select,textarea){
  min-height:44px !important;
  border:1px solid var(--r53-line) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--r53-text) !important;
  font-size:16px !important;
}
body[data-role="client"] :where(input,select,textarea):focus{
  border-color:rgba(255,176,0,.75) !important;
  box-shadow:0 0 0 3px rgba(255,176,0,.16) !important;
  outline:0 !important;
}

/* Tablet / desktop layouts */
@media (min-width:768px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page{
    padding:clamp(18px,3vw,34px) clamp(18px,3vw,44px) calc(118px + env(safe-area-inset-bottom,0px)) !important;
  }
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    border-radius:28px !important;
    padding:clamp(26px,3.2vw,42px) !important;
  }
  body[data-role="client"] :where(.orders-grid,.myorders-list,.favorites-list,.masters-list,.cab-grid,.ccab-grid){
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  body[data-role="client"] :where(.settings-list,.profile-menu,.cab-list,.ccab-list){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1024px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:1120px !important;
    min-height:620px !important;
  }
  body[data-role="client"] :where(.favorites-list,.masters-list,.cab-grid,.ccab-grid){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}
@media (max-width:767px){
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
    background:#fff !important;
  }
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:none !important;
    min-height:100dvh !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 16px 22px !important;
  }
  body[data-role="client"] :where(.chat-card,.message-card,.dialog-card){
    grid-template-columns:48px minmax(0,1fr) auto !important;
  }
  body[data-role="client"] :where(.master-card,.favorite-card,.fav-card){
    grid-template-columns:56px minmax(0,1fr) auto !important;
  }
}

/* Global overlap guard */
body[data-role="client"] :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0;
}

/* === SOURCE: css/client_detail_cards_r54.css === */
/* KARETA UI-r54 — client detail cards reference pass.
   Scope: order detail, chat detail, reviews, cars, notifications and client detail panels.
   Visual-only layer. No API/DB/route/business logic changes. */
:root{
  --r54-bg:#eef0f2;
  --r54-page:#ffffff;
  --r54-soft:#f4f4f5;
  --r54-soft-2:#fafafa;
  --r54-line:#e7e8eb;
  --r54-text:#090b10;
  --r54-muted:#6f747d;
  --r54-orange:#ffb000;
  --r54-orange-2:#ff9800;
  --r54-green:#22c55e;
  --r54-red:#ef4444;
  --r54-radius:16px;
  --r54-radius-lg:24px;
  --r54-shadow:0 16px 42px rgba(15,23,42,.08);
  --r54-shadow-soft:0 8px 24px rgba(15,23,42,.055);
}

/* Detail page shell */
body[data-role="client"] :where(.order-detail,.order-details,.order-view,.chat-detail,.chat-view,.review-detail,.car-detail,.vehicle-detail,.notification-detail,.notify-detail,.detail-page,.detail-card-wrap){
  min-width:0 !important;
  max-width:1120px !important;
  margin-inline:auto !important;
  color:var(--r54-text) !important;
}

/* Detail cards */
body[data-role="client"] :where(.order-detail-card,.order-info-card,.order-stage-card,.order-timeline-card,.chat-thread-card,.chat-panel,.review-card,.review-detail-card,.car-detail-card,.vehicle-card,.vehicle-detail-card,.notify-card,.notification-card,.detail-card,.info-card,.timeline-card,.attachment-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--r54-line) !important;
  border-radius:var(--r54-radius) !important;
  background:#fff !important;
  box-shadow:var(--r54-shadow-soft) !important;
  overflow:hidden !important;
  padding:clamp(14px,2vw,20px) !important;
}

/* Detail title blocks */
body[data-role="client"] :where(.order-detail,.chat-detail,.review-detail,.car-detail,.notification-detail,.detail-page) :where(h1,.detail-title,.order-title,.chat-title,.vehicle-title){
  color:var(--r54-text) !important;
  font-size:clamp(26px,3.1vw,42px) !important;
  line-height:1.02 !important;
  font-weight:950 !important;
  letter-spacing:-.06em !important;
}
body[data-role="client"] :where(.order-detail,.chat-detail,.review-detail,.car-detail,.notification-detail,.detail-page) :where(.detail-sub,.order-sub,.chat-sub,.vehicle-sub,p,small){
  color:var(--r54-muted) !important;
  line-height:1.35 !important;
}

/* Order stages / timeline */
body[data-role="client"] :where(.order-timeline,.timeline,.stage-list,.repair-stages){
  display:grid !important;
  gap:10px !important;
}
body[data-role="client"] :where(.timeline-item,.stage-item,.repair-stage,.order-stage){
  position:relative !important;
  min-width:0 !important;
  border:1px solid var(--r54-line) !important;
  border-radius:14px !important;
  background:var(--r54-soft-2) !important;
  padding:12px 14px 12px 44px !important;
  overflow:hidden !important;
}
body[data-role="client"] :where(.timeline-item,.stage-item,.repair-stage,.order-stage)::before{
  content:'' !important;
  position:absolute !important;
  left:16px !important;
  top:16px !important;
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  background:var(--r54-orange) !important;
  box-shadow:0 0 0 5px rgba(255,176,0,.16) !important;
}
body[data-role="client"] :where(.timeline-item.is-done,.stage-item.is-done,.repair-stage.is-done,.order-stage.is-done)::before{
  background:var(--r54-green) !important;
  box-shadow:0 0 0 5px rgba(34,197,94,.15) !important;
}

/* Chat thread */
body[data-role="client"] :where(.chat-thread,.messages-thread,.thread-body){
  display:grid !important;
  gap:10px !important;
  min-width:0 !important;
}
body[data-role="client"] :where(.chat-bubble,.message-bubble,.msg-bubble){
  width:fit-content !important;
  max-width:min(78%, 620px) !important;
  min-width:0 !important;
  border-radius:16px !important;
  padding:10px 13px !important;
  background:var(--r54-soft) !important;
  color:var(--r54-text) !important;
  box-shadow:none !important;
  overflow-wrap:anywhere !important;
}
body[data-role="client"] :where(.chat-bubble.is-me,.message-bubble.is-me,.msg-bubble.is-me,.mine){
  justify-self:end !important;
  background:#fff4cf !important;
  color:#15120a !important;
}
body[data-role="client"] :where(.chat-input,.message-input,.thread-input,.composer){
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:8px !important;
  align-items:end !important;
  border:1px solid var(--r54-line) !important;
  border-radius:16px !important;
  background:#fff !important;
  padding:8px !important;
}
body[data-role="client"] :where(.chat-input,.message-input,.thread-input,.composer) :where(input,textarea){
  min-height:42px !important;
  border:0 !important;
  background:var(--r54-soft) !important;
  border-radius:12px !important;
  padding:10px 12px !important;
}

/* Reviews */
body[data-role="client"] :where(.reviews-list,.review-list){
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.review-card,.review-row){
  display:grid !important;
  gap:8px !important;
}
body[data-role="client"] :where(.rating,.stars,.review-stars){
  color:var(--r54-orange) !important;
  letter-spacing:1px !important;
  font-weight:900 !important;
}

/* Cars / garage */
body[data-role="client"] :where(.garage-list,.cars-list,.vehicles-list){
  display:grid !important;
  gap:12px !important;
}
body[data-role="client"] :where(.car-card,.vehicle-card,.garage-card){
  display:grid !important;
  grid-template-columns:72px minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.car-card,.vehicle-card,.garage-card) :where(.car-thumb,.vehicle-thumb,img){
  width:72px !important;
  height:72px !important;
  border-radius:16px !important;
  background:#25272d !important;
  object-fit:cover !important;
}

/* Notifications */
body[data-role="client"] :where(.notifications-list,.notify-list){
  display:grid !important;
  gap:10px !important;
}
body[data-role="client"] :where(.notify-row,.notification-row,.notification-card){
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
  min-height:64px !important;
}
body[data-role="client"] :where(.notify-icon,.notification-icon){
  width:42px !important;
  height:42px !important;
  border-radius:12px !important;
  background:#fff4cf !important;
  color:var(--r54-orange-2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Attachments / media */
body[data-role="client"] :where(.attachments,.attach-list,.media-list){
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
}
body[data-role="client"] :where(.attachment-card,.attach-card,.media-card){
  min-height:90px !important;
  border-radius:14px !important;
  background:var(--r54-soft) !important;
  border:1px solid var(--r54-line) !important;
  overflow:hidden !important;
}

/* Buttons / action bars */
body[data-role="client"] :where(.detail-actions,.order-actions,.chat-actions,.review-actions,.vehicle-actions,.notify-actions){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  align-items:center !important;
}
body[data-role="client"] :where(.detail-actions,.order-actions,.chat-actions,.review-actions,.vehicle-actions,.notify-actions) :where(button,.btn,.action-btn){
  min-height:40px !important;
  border-radius:12px !important;
  padding:0 14px !important;
  font-weight:850 !important;
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}

/* Tablet/wide layout */
@media (min-width:768px){
  body[data-role="client"] :where(.detail-layout,.order-detail-layout,.chat-detail-layout,.vehicle-detail-layout){
    display:grid !important;
    grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr) !important;
    gap:16px !important;
    align-items:start !important;
  }
  body[data-role="client"] :where(.attachments,.attach-list,.media-list){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body[data-role="client"] :where(.reviews-list,.garage-list,.cars-list,.vehicles-list,.notifications-list){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1024px){
  body[data-role="client"] :where(.detail-layout,.order-detail-layout,.chat-detail-layout,.vehicle-detail-layout){
    grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr) !important;
    gap:20px !important;
  }
  body[data-role="client"] :where(.attachments,.attach-list,.media-list){
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}

/* Phone safety */
@media (max-width:767px){
  body[data-role="client"] :where(.chat-bubble,.message-bubble,.msg-bubble){
    max-width:88% !important;
  }
  body[data-role="client"] :where(.car-card,.vehicle-card,.garage-card){
    grid-template-columns:58px minmax(0,1fr) auto !important;
  }
  body[data-role="client"] :where(.car-card,.vehicle-card,.garage-card) :where(.car-thumb,.vehicle-thumb,img){
    width:58px !important;
    height:58px !important;
  }
  body[data-role="client"] :where(.attachments,.attach-list,.media-list){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* Hard text-overlap guards */
body[data-role="client"] :where(.order-detail,.chat-detail,.review-detail,.car-detail,.vehicle-detail,.notification-detail,.detail-card,.order-card,.chat-card,.review-card,.car-card,.notify-card) :where(h1,h2,h3,h4,p,span,small,b,strong,button,label,div){
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/ui_r55_final_smoke_guard.css === */
/* KARETA UI-r55 — final mobile/tablet/pc smoke guards.
   Scope: client app reference pass r52-r54.
   Purpose: final visual guards against text overlaps, horizontal overflow and dock/content collisions.
   Visual-only layer. */

:root{
  --r55-bg:#eef0f2;
  --r55-page:#fff;
  --r55-line:#e7e8eb;
  --r55-text:#090b10;
  --r55-muted:#707782;
  --r55-orange:#ffb000;
}

/* Global overflow containment */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}
#app,
.page,
.container,
.services-app-page,
.services-app-phone{
  min-width:0;
  max-width:100%;
}

/* Hard text wrapping after all app-card passes */
:where(.services-app-page,#myorders,#messages,#masters,#cabinet,#parts,.cab-pane,.order-detail,.chat-detail,.vehicle-detail,.notification-detail)
:where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div,input,textarea,select){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* Prevent buttons and cards from forcing horizontal scroll */
:where(.btn,.button,button,.action-btn,.bnav-item,.services-app-tile,.services-app-list-card,.services-app-shop-card,.order-card,.myorder-card,.mo-card,.chat-card,.message-card,.master-card,.fav-card,.favorite-card,.cab-card,.ccab-card,.detail-card,.order-detail-card,.chat-thread-card,.review-card,.vehicle-card,.notification-card){
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
}

/* Icons should never overlap labels */
:where(.bnav-icon-wrap,.services-app-tile-ico,.services-app-tile-icon,.ico,.icon,.row-icon,.ccab-ico,.ccab-stat-ico,.notify-icon,.notification-icon){
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
:where(.bnav-label,.services-app-tile-title,.card-title,.row-title,.ccab-title,.detail-title){
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis;
}

/* Mobile final pass */
@media (max-width:430px){
  body{
    background:#fff !important;
  }
  .services-app-phone,
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    padding-left:14px !important;
    padding-right:14px !important;
  }
  .services-app-title{
    font-size:clamp(34px,11vw,42px) !important;
    letter-spacing:-.065em !important;
  }
  .services-app-search{
    grid-template-columns:minmax(0,1fr) 44px !important;
  }
  .services-app-tile-grid,
  .services-app-categories,
  .services-app-home-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }
  .services-app-tile,
  .services-app-cat-card,
  .services-app-category-card{
    min-height:96px !important;
    padding:10px !important;
  }
  .services-app-tile-title,
  .services-app-tile b,
  .services-app-cat-title{
    font-size:13px !important;
    line-height:1.16 !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden !important;
  }
  #bottom-nav{
    width:calc(100vw - 18px) !important;
    bottom:8px !important;
  }
  #bottom-nav .bnav-inner{
    height:68px !important;
    min-height:68px !important;
    padding:7px 8px !important;
    border-radius:16px !important;
  }
  #bottom-nav .bnav-label{
    font-size:9.6px !important;
  }
}

/* Tablet portrait final pass */
@media (min-width:768px) and (max-width:1023px){
  .services-app-phone,
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:900px !important;
  }
  .services-app-home-head{
    grid-template-columns:minmax(260px,.9fr) minmax(330px,1.1fr) !important;
    gap:28px !important;
  }
  .services-app-title{
    font-size:clamp(48px,6vw,60px) !important;
  }
  #bottom-nav{
    width:min(calc(100vw - 56px),720px) !important;
  }
  #bottom-nav .bnav-inner{
    padding-left:24px !important;
    padding-right:24px !important;
  }
}

/* Tablet landscape / low height */
@media (min-width:768px) and (max-height:760px){
  .services-app-page,
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page{
    padding-top:14px !important;
    padding-bottom:96px !important;
  }
  .services-app-phone,
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    min-height:auto !important;
    padding-top:22px !important;
    padding-bottom:22px !important;
  }
  .services-app-title{
    font-size:46px !important;
  }
  .services-app-home-head{
    gap:22px !important;
  }
  #bottom-nav{
    bottom:12px !important;
  }
  #bottom-nav .bnav-inner{
    height:68px !important;
    min-height:68px !important;
  }
}

/* Desktop preview */
@media (min-width:1200px){
  .services-app-phone,
  body[data-role="client"] :where(#myorders,#messages,#masters,#cabinet,#parts).page > .container,
  body[data-role="client"] :where(.cab-pane) > .container{
    max-width:1180px !important;
  }
  .services-app-phone{
    min-height:680px !important;
  }
  #bottom-nav{
    width:min(56vw,860px) !important;
  }
}

/* Keep dock above content but below modals */
#bottom-nav{
  z-index:80 !important;
}
:where(.modal,.modal-overlay,.cmodal-overlay,.ui-modal-overlay,.services-app-sheet,.drawer){
  z-index:120 !important;
}

/* Final app padding so floating dock does not cover content */
#app,
.page,
.services-app-page{
  padding-bottom:calc(112px + env(safe-area-inset-bottom,0px)) !important;
}
@media (min-width:768px){
  #app,
  .page,
  .services-app-page{
    padding-bottom:calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
}

/* === SOURCE: css/real_routes_reference_r56.css === */
/* KARETA r56 — real route reference style activation.
   Problem fixed: r52-r55 applied well to #services, but other pages were gated by role/body classes.
   This layer targets actual hash routes via body.kr-route-* added by js/route_style_r56.js. */

:root{
  --r56-bg:#eef0f2;
  --r56-page:#ffffff;
  --r56-soft:#f4f4f5;
  --r56-line:#e7e8eb;
  --r56-text:#090b10;
  --r56-muted:#707782;
  --r56-orange:#ffb000;
  --r56-orange-2:#ff9800;
  --r56-radius:18px;
  --r56-radius-lg:28px;
  --r56-shadow:0 16px 42px rgba(15,23,42,.08);
  --r56-shadow-soft:0 8px 24px rgba(15,23,42,.055);
}

body.kr-route-myorders,
body.kr-route-messages,
body.kr-route-masters,
body.kr-route-cabinet,
body.kr-route-parts{
  background:var(--r56-bg) !important;
}

/* Real route shell activation */
body.kr-route-myorders #app > .page,
body.kr-route-messages #app > .page,
body.kr-route-masters #app > .page,
body.kr-route-cabinet #app > .page,
body.kr-route-parts #app > .page{
  min-height:100dvh !important;
  background:var(--r56-bg) !important;
  padding:clamp(14px,2.6vw,32px) clamp(12px,2.8vw,38px) calc(112px + env(safe-area-inset-bottom,0px)) !important;
}

body.kr-route-myorders #app > .page > section,
body.kr-route-messages #app > .page > section,
body.kr-route-masters #app > .page > section,
body.kr-route-cabinet #app > .page > section,
body.kr-route-parts #app > .page > section{
  margin:0 !important;
  padding:0 !important;
}

body.kr-route-myorders #app > .page .container,
body.kr-route-messages #app > .page .container,
body.kr-route-masters #app > .page .container,
body.kr-route-cabinet #app > .page .container,
body.kr-route-parts #app > .page .container,
body.kr-route-cabinet .cab-pane > .container{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(20px,3vw,38px) !important;
  background:var(--r56-page) !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:var(--r56-radius-lg) !important;
  box-shadow:var(--r56-shadow) !important;
  overflow:hidden !important;
}

/* Hero/header actual classes */
body.kr-route-myorders :where(.spa-hero,.page-hero,.kr-header,.section-head,.cab-head,.ccab-hero),
body.kr-route-messages :where(.spa-hero,.page-hero,.kr-header,.section-head,.cab-head,.ccab-hero),
body.kr-route-masters :where(.spa-hero,.page-hero,.kr-header,.section-head,.cab-head,.ccab-hero),
body.kr-route-cabinet :where(.spa-hero,.page-hero,.kr-header,.section-head,.cab-head,.ccab-hero),
body.kr-route-parts :where(.spa-hero,.page-hero,.kr-header,.section-head,.cab-head,.ccab-hero){
  margin:0 0 clamp(18px,2.4vw,30px) !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.kr-route-myorders :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title),
body.kr-route-messages :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title),
body.kr-route-masters :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title),
body.kr-route-cabinet :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title),
body.kr-route-parts :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title){
  color:var(--r56-text) !important;
  font-size:clamp(32px,4.6vw,58px) !important;
  line-height:.96 !important;
  font-weight:950 !important;
  letter-spacing:-.07em !important;
  margin:0 0 10px !important;
}

body.kr-route-myorders :where(.spa-hero-sub,.page-subtitle,.kr-header__sub,.cab-sub,.ccab-sub,.muted),
body.kr-route-messages :where(.spa-hero-sub,.page-subtitle,.kr-header__sub,.cab-sub,.ccab-sub,.muted),
body.kr-route-masters :where(.spa-hero-sub,.page-subtitle,.kr-header__sub,.cab-sub,.ccab-sub,.muted),
body.kr-route-cabinet :where(.spa-hero-sub,.page-subtitle,.kr-header__sub,.cab-sub,.ccab-sub,.muted),
body.kr-route-parts :where(.spa-hero-sub,.page-subtitle,.kr-header__sub,.cab-sub,.ccab-sub,.muted){
  color:var(--r56-muted) !important;
  font-size:clamp(15px,1.8vw,18px) !important;
  line-height:1.35 !important;
}

/* Real page card classes */
body.kr-route-myorders :where(.mo-card,.myorder-card,.order-card,.order-row,.exchange-card),
body.kr-route-messages :where(.messenger-card,.message-card,.dialog-card,.chat-card,.msg-card),
body.kr-route-masters :where(.master-card,.mcl-card,.masters-page-card,.master-list-card),
body.kr-route-cabinet :where(.cab-card,.cab-pane,.ccab-card,.ccab-panel,.cabinet-card,.settings-row,.profile-row,.car-card,.notify-row),
body.kr-route-parts :where(.parts-category-card,.product-card,.parts-card,.shop-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--r56-line) !important;
  border-radius:var(--r56-radius) !important;
  background:#fff !important;
  box-shadow:var(--r56-shadow-soft) !important;
  overflow:hidden !important;
}

/* Myorders exact blocks */
body.kr-route-myorders :where(.mo-filter-bar,.myorders-sticky-tools,.catalog-tools,.spa-tools){
  border:1px solid var(--r56-line) !important;
  border-radius:16px !important;
  background:var(--r56-soft) !important;
  padding:10px !important;
  box-shadow:none !important;
  overflow:auto !important;
}
body.kr-route-myorders :where(.mo-filter-tabs){
  display:flex !important;
  gap:8px !important;
  overflow:auto !important;
  scrollbar-width:none !important;
}
body.kr-route-myorders :where(.mo-filter-tab){
  min-height:38px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--r56-muted) !important;
  padding:0 12px !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}
body.kr-route-myorders :where(.mo-filter-tab.active){
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--r56-orange) !important;
}
body.kr-route-myorders :where(.mo-card){
  padding:16px !important;
  margin:12px 0 !important;
  display:grid !important;
  gap:12px !important;
}

/* Messages exact + generic messenger */
body.kr-route-messages :where(.messenger-page,.messenger-shell,.messages-page,.dialogs-page){
  background:transparent !important;
}
body.kr-route-messages :where(.messenger-card,.dialog-card,.chat-card,.message-card){
  padding:14px !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body.kr-route-messages :where(.messenger-avatar,.dialog-avatar,.chat-avatar,.avatar){
  width:54px !important;
  height:54px !important;
  border-radius:14px !important;
  background:#26282e !important;
  color:#fff !important;
  flex:0 0 auto !important;
}

/* Masters exact classes */
body.kr-route-masters :where(.masters-page-shell,.masters-shell){
  max-width:1120px !important;
  margin:0 auto !important;
}
body.kr-route-masters :where(.masters-grid,.masters-list,.mcl-grid,.mcl-list){
  display:grid !important;
  gap:14px !important;
}
body.kr-route-masters :where(.master-card,.mcl-card){
  padding:16px !important;
}

/* Cabinet actual panes */
body.kr-route-cabinet :where(.cab-pane){
  display:block;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid){
  display:grid !important;
  gap:14px !important;
}
body.kr-route-cabinet :where(.settings-row,.profile-row,.cab-row,.ccab-row){
  min-height:56px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}

/* Parts as adjacent route */
body.kr-route-parts :where(.parts-category-grid,.parts-grid,.product-grid){
  display:grid !important;
  gap:14px !important;
}
body.kr-route-parts :where(.parts-category-card,.product-card,.parts-card){
  padding:16px !important;
}

/* Buttons / inputs */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(.btn,.button,button,.action-btn){
  min-width:0 !important;
  max-width:100% !important;
  border-radius:12px !important;
  font-weight:850 !important;
  overflow-wrap:anywhere !important;
}
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(.btn-primary,.primary-btn,.submit-btn,.cta){
  background:linear-gradient(180deg,var(--r56-orange),var(--r56-orange-2)) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(input,select,textarea){
  min-height:44px !important;
  border:1px solid var(--r56-line) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--r56-text) !important;
  font-size:16px !important;
}

/* Tablet and PC layout */
@media (min-width:768px){
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page{
    padding:clamp(22px,3vw,40px) clamp(20px,3vw,48px) calc(126px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-myorders :where(.mo-list,.myorders-list,.orders-grid),
  body.kr-route-masters :where(.masters-grid,.masters-list,.mcl-grid,.mcl-list),
  body.kr-route-parts :where(.parts-category-grid,.parts-grid,.product-grid),
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1024px){
  body.kr-route-myorders :where(.mo-list,.myorders-list,.orders-grid),
  body.kr-route-masters :where(.masters-grid,.masters-list,.mcl-grid,.mcl-list),
  body.kr-route-parts :where(.parts-category-grid,.parts-grid,.product-grid){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body.kr-route-messages :where(.messenger-shell,.messages-shell){
    display:grid !important;
    grid-template-columns:minmax(320px,.42fr) minmax(0,.58fr) !important;
    gap:16px !important;
  }
}

/* Mobile clean app mode */
@media (max-width:767px){
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts),
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page{
    background:#fff !important;
  }
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) #app > .page .container,
  body.kr-route-cabinet .cab-pane > .container{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px 22px !important;
    min-height:100dvh !important;
  }
  body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(h1,.spa-hero-title,.kr-header__title,.page-title,.cab-title,.ccab-title){
    font-size:clamp(30px,9vw,40px) !important;
  }
}

/* Final hard overlap guard for real routes */
body:is(.kr-route-myorders,.kr-route-messages,.kr-route-masters,.kr-route-cabinet,.kr-route-parts) :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/myorders_manual_r57.css === */
/* KARETA r57 — manual #myorders reference redesign.
   This is not a generic guard. It targets the real My Orders page structure rendered by renderMyOrders(). */

body.kr-route-myorders{
  --mo-r57-bg:#eef0f2;
  --mo-r57-page:#fff;
  --mo-r57-soft:#f4f4f5;
  --mo-r57-line:#e7e8eb;
  --mo-r57-text:#080b10;
  --mo-r57-muted:#6f747d;
  --mo-r57-orange:#ffb000;
  --mo-r57-orange2:#ff9800;
  --mo-r57-green:#22c55e;
  --mo-r57-red:#ef4444;
  background:var(--mo-r57-bg) !important;
}

body.kr-route-myorders #app{
  background:var(--mo-r57-bg) !important;
}

body.kr-route-myorders .myorders-reference-r57,
body.kr-route-myorders #app > .page{
  min-height:100dvh !important;
  background:var(--mo-r57-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

/* The page is deliberately rebuilt visually as one app panel. */
body.kr-route-myorders .myorders-reference-r57 .spa-content,
body.kr-route-myorders .myorders-reference-r57 > .spa-content{
  max-width:1120px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:transparent !important;
}

body.kr-route-myorders .myorders-reference-r57 .spa-content > .container,
body.kr-route-myorders .myorders-reference-r57 .container{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(18px,3vw,34px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Hero as reference app-card header */
body.kr-route-myorders #hero-myorders,
body.kr-route-myorders .spa-page-hero--compact{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto 14px !important;
  padding:clamp(22px,3vw,36px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

body.kr-route-myorders #hero-myorders :where(.spa-hero-kicker,.spa-hero-label){
  width:max-content !important;
  max-width:100% !important;
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-weight:900 !important;
  font-size:12px !important;
  letter-spacing:-.02em !important;
}

body.kr-route-myorders #hero-myorders :where(.spa-hero-title,h1){
  max-width:520px !important;
  color:var(--mo-r57-text) !important;
  font-size:clamp(38px,5.5vw,68px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
  margin:10px 0 10px !important;
}

body.kr-route-myorders #hero-myorders :where(.spa-hero-sub){
  color:var(--mo-r57-muted) !important;
  font-size:clamp(15px,1.8vw,18px) !important;
  line-height:1.35 !important;
}

body.kr-route-myorders #hero-myorders :where(.spa-hero-stats,.spa-hero-statline){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}

body.kr-route-myorders #hero-myorders .spa-hero-stat{
  min-width:116px !important;
  padding:12px !important;
  border-radius:16px !important;
  background:var(--mo-r57-soft) !important;
  border:1px solid var(--mo-r57-line) !important;
}

body.kr-route-myorders #hero-myorders .spa-hero-stat-num{
  color:var(--mo-r57-text) !important;
  font-size:22px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}
body.kr-route-myorders #hero-myorders .spa-hero-stat-lbl{
  margin-top:5px !important;
  color:var(--mo-r57-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
}

body.kr-route-myorders #hero-myorders :where(.spa-hero-actions,.spa-hero-actionbar){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}

body.kr-route-myorders #hero-myorders .btn,
body.kr-route-myorders #mo-empty .btn{
  min-height:44px !important;
  padding:0 16px !important;
  border-radius:12px !important;
  font-weight:900 !important;
}

/* Tools and filters are now a real app search/filter strip. */
body.kr-route-myorders #myorders-sticky-tools,
body.kr-route-myorders .myorders-sticky-tools,
body.kr-route-myorders .mo-filter-bar{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  margin:0 0 16px !important;
  padding:10px !important;
  background:var(--mo-r57-soft) !important;
  border:1px solid var(--mo-r57-line) !important;
  border-radius:18px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

body.kr-route-myorders .catalog-tools,
body.kr-route-myorders .catalog-tools__main,
body.kr-route-myorders .catalog-tools__row{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  gap:10px !important;
}

body.kr-route-myorders .catalog-tools input,
body.kr-route-myorders .catalog-search input,
body.kr-route-myorders input[type="search"]{
  min-height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  background:#fff !important;
  color:var(--mo-r57-text) !important;
  padding:0 14px !important;
  font-size:16px !important;
}

body.kr-route-myorders .mo-filter-tabs{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
  padding:0 !important;
}
body.kr-route-myorders .mo-filter-tabs::-webkit-scrollbar{display:none !important;}

body.kr-route-myorders .mo-filter-tab{
  min-height:38px !important;
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--mo-r57-muted) !important;
  box-shadow:none !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kr-route-myorders .mo-filter-tab.active{
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--mo-r57-orange) !important;
}
body.kr-route-myorders .mo-filter-tab-ico{
  color:var(--mo-r57-orange2) !important;
}
body.kr-route-myorders .mo-filter-cnt{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--mo-r57-soft) !important;
  color:#111 !important;
  font-size:12px !important;
}

/* Cards list */
body.kr-route-myorders .myorders-reference-r57-list,
body.kr-route-myorders #mo-list{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
}

body.kr-route-myorders .mo-card{
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:16px !important;
  border:1px solid var(--mo-r57-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  display:grid !important;
  gap:14px !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}
body.kr-route-myorders .mo-card:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.28) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08) !important;
}

body.kr-route-myorders .mo-card-top{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
}
body.kr-route-myorders .mo-card-id{
  width:max-content !important;
  max-width:100% !important;
  min-height:26px !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  background:var(--mo-r57-soft) !important;
  color:#464b55 !important;
  font-size:12px !important;
  line-height:1.1 !important;
  font-weight:900 !important;
}
body.kr-route-myorders .mo-type-badge,
body.kr-route-myorders .mo-status-badge{
  min-height:26px !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  font-size:12px !important;
  line-height:1.1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kr-route-myorders .mo-type-badge.service{
  background:#fff3c7 !important;
  color:#765100 !important;
}
body.kr-route-myorders .mo-type-badge.parts{
  background:#eef2ff !important;
  color:#273a8a !important;
}
body.kr-route-myorders .mo-status-badge{
  background:#ecfdf3 !important;
  color:#15803d !important;
}

body.kr-route-myorders .mo-card-title{
  margin-top:10px !important;
  color:var(--mo-r57-text) !important;
  font-size:clamp(18px,2vw,22px) !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}
body.kr-route-myorders .mo-card-car{
  margin-top:6px !important;
  color:var(--mo-r57-muted) !important;
  font-size:14px !important;
  line-height:1.25 !important;
  font-weight:750 !important;
}

/* Timeline simplified like reference process chips */
body.kr-route-myorders .mo-timeline{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(92px,1fr)) !important;
  gap:8px !important;
  padding:10px !important;
  border-radius:16px !important;
  background:var(--mo-r57-soft) !important;
  border:1px solid var(--mo-r57-line) !important;
}
body.kr-route-myorders .mo-tl-item{
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:22px minmax(0,1fr) !important;
  align-items:center !important;
  gap:7px !important;
  position:relative !important;
}
body.kr-route-myorders .mo-tl-dot{
  width:22px !important;
  height:22px !important;
  border-radius:50% !important;
  border:0 !important;
  background:#fff !important;
  color:var(--mo-r57-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:11px !important;
  overflow:hidden !important;
}
body.kr-route-myorders .mo-tl-dot.done{
  background:var(--mo-r57-orange) !important;
  color:#111 !important;
}
body.kr-route-myorders .mo-tl-line{display:none !important;}
body.kr-route-myorders .mo-tl-label{
  color:#4c535d !important;
  font-size:12px !important;
  line-height:1.14 !important;
  font-weight:850 !important;
}

/* Chat entity */
body.kr-route-myorders .mo-chat-entity{
  min-height:58px !important;
  padding:10px 12px !important;
  border:1px solid var(--mo-r57-line) !important;
  border-radius:16px !important;
  background:#fafafa !important;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
}
body.kr-route-myorders .mo-chat-entity-ico{
  width:38px !important;
  height:38px !important;
  border-radius:12px !important;
  background:#fff3c7 !important;
  color:var(--mo-r57-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.kr-route-myorders .mo-chat-entity-label{
  color:var(--mo-r57-text) !important;
  font-weight:900 !important;
}
body.kr-route-myorders .mo-chat-entity-hint{
  color:var(--mo-r57-muted) !important;
  font-size:12px !important;
}

/* Actions */
body.kr-route-myorders .mo-card-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
body.kr-route-myorders .mo-card-actions .btn{
  min-height:40px !important;
  flex:0 1 auto !important;
  padding:0 13px !important;
  border-radius:12px !important;
  font-weight:900 !important;
}
body.kr-route-myorders .mo-card-actions .btn-primary{
  background:linear-gradient(180deg,var(--mo-r57-orange),var(--mo-r57-orange2)) !important;
  color:#111 !important;
  border:0 !important;
}
body.kr-route-myorders .mo-card-actions .btn-outline,
body.kr-route-myorders .mo-card-actions .btn-ghost{
  background:#fff !important;
  border:1px solid var(--mo-r57-line) !important;
  color:var(--mo-r57-text) !important;
}

/* Empty state */
body.kr-route-myorders #mo-empty{
  min-height:320px !important;
  border:1px dashed #d9dbe0 !important;
  border-radius:22px !important;
  background:#fafafa !important;
  padding:24px !important;
}

/* Tablet / desktop: real card grid and wide hero */
@media (min-width:768px){
  body.kr-route-myorders .myorders-reference-r57{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-myorders #hero-myorders{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:24px !important;
    align-items:start !important;
  }
  body.kr-route-myorders #hero-myorders :where(.spa-hero-title,h1){
    max-width:620px !important;
  }
  body.kr-route-myorders .myorders-reference-r57-list,
  body.kr-route-myorders #mo-list{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (min-width:1120px){
  body.kr-route-myorders .myorders-reference-r57-list,
  body.kr-route-myorders #mo-list{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Mobile: full screen app without fake desktop shell */
@media (max-width:767px){
  body.kr-route-myorders,
  body.kr-route-myorders #app,
  body.kr-route-myorders .myorders-reference-r57{
    background:#fff !important;
  }
  body.kr-route-myorders .myorders-reference-r57{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-myorders #hero-myorders,
  body.kr-route-myorders .myorders-reference-r57 .container{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px !important;
  }
  body.kr-route-myorders #hero-myorders :where(.spa-hero-title,h1){
    font-size:clamp(34px,10vw,42px) !important;
  }
  body.kr-route-myorders .mo-card{
    border-radius:16px !important;
    padding:14px !important;
  }
  body.kr-route-myorders .mo-timeline{
    grid-template-columns:1fr 1fr !important;
  }
  body.kr-route-myorders .mo-card-actions .btn{
    flex:1 1 calc(50% - 8px) !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-myorders .myorders-reference-r57{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-myorders #hero-myorders,
  body.kr-route-myorders .myorders-reference-r57 .container{
    padding:20px !important;
  }
  body.kr-route-myorders #hero-myorders :where(.spa-hero-title,h1){
    font-size:46px !important;
  }
}

/* Hard text guards for this route */
body.kr-route-myorders :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/messages_manual_r58.css === */
/* KARETA r58 — manual #messages reference redesign.
   Route: https://kareta.kz/#messages and #messages:<chatId>
   This is route-specific, not a generic guard. */

body.kr-route-messages{
  --msg-r58-bg:#eef0f2;
  --msg-r58-page:#fff;
  --msg-r58-soft:#f4f4f5;
  --msg-r58-line:#e7e8eb;
  --msg-r58-text:#080b10;
  --msg-r58-muted:#6f747d;
  --msg-r58-orange:#ffb000;
  --msg-r58-orange2:#ff9800;
  --msg-r58-green:#22c55e;
  --msg-r58-red:#ef4444;
  background:var(--msg-r58-bg) !important;
}

body.kr-route-messages #app{
  background:var(--msg-r58-bg) !important;
}

body.kr-route-messages .messages-reference-r58,
body.kr-route-messages #app > .page{
  min-height:100dvh !important;
  background:var(--msg-r58-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

/* Hero */
body.kr-route-messages #hero-messages,
body.kr-route-messages .spa-page-hero--messages{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto 14px !important;
  padding:clamp(22px,3vw,36px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-kicker,.spa-hero-label){
  width:max-content !important;
  max-width:100% !important;
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-weight:900 !important;
  font-size:12px !important;
  letter-spacing:-.02em !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
  max-width:620px !important;
  color:var(--msg-r58-text) !important;
  font-size:clamp(38px,5.5vw,68px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
  margin:10px 0 10px !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-sub){
  color:var(--msg-r58-muted) !important;
  font-size:clamp(15px,1.8vw,18px) !important;
  line-height:1.35 !important;
}

body.kr-route-messages #hero-messages :where(.spa-hero-stats,.spa-hero-statline){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat{
  min-width:116px !important;
  padding:12px !important;
  border-radius:16px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat-num{
  color:var(--msg-r58-text) !important;
  font-size:22px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}

body.kr-route-messages #hero-messages .spa-hero-stat-lbl{
  margin-top:5px !important;
  color:var(--msg-r58-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
}

/* Main app-card container */
body.kr-route-messages .msng-page-content-wrap{
  max-width:1120px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:transparent !important;
}

body.kr-route-messages .msng-page-content{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(18px,3vw,34px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Tools/filter/search */
body.kr-route-messages #msng-page-filterbar,
body.kr-route-messages .msng-mo-filter-bar,
body.kr-route-messages .msng-sticky-tools,
body.kr-route-messages .catalog-tools--messages{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  margin:0 0 16px !important;
  padding:10px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
  border-radius:18px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

body.kr-route-messages .mo-filter-tabs{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
  padding:0 !important;
}

body.kr-route-messages .mo-filter-tabs::-webkit-scrollbar{display:none !important;}

body.kr-route-messages .mo-filter-tab{
  min-height:38px !important;
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--msg-r58-muted) !important;
  box-shadow:none !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .mo-filter-tab.active{
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--msg-r58-orange) !important;
}

body.kr-route-messages .mo-filter-tab-ico{
  color:var(--msg-r58-orange2) !important;
}

body.kr-route-messages .mo-filter-cnt{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--msg-r58-soft) !important;
  color:#111 !important;
  font-size:12px !important;
}

body.kr-route-messages .mo-search-action,
body.kr-route-messages .msng-search-action{
  margin:0 0 16px !important;
}

body.kr-route-messages .mo-search-toggle{
  min-height:46px !important;
  width:100% !important;
  border:0 !important;
  border-radius:14px !important;
  background:var(--msg-r58-soft) !important;
  color:var(--msg-r58-text) !important;
  padding:0 14px !important;
  font-weight:900 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}

body.kr-route-messages .mo-search-panel{
  margin-top:8px !important;
  padding:8px !important;
  border-radius:16px !important;
  background:var(--msg-r58-soft) !important;
  border:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages .mo-search-input{
  min-height:44px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--msg-r58-text) !important;
  padding:0 12px !important;
}

/* List */
body.kr-route-messages #msng-page-listmount{
  min-width:0 !important;
}

body.kr-route-messages .msng-list--page{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}

/* Actual chat item card */
body.kr-route-messages .msng-item--v2{
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:14px !important;
  border:1px solid var(--msg-r58-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns:56px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

body.kr-route-messages .msng-item--v2:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.28) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08) !important;
}

body.kr-route-messages .msng-item--unread{
  border-color:rgba(255,176,0,.42) !important;
  background:linear-gradient(180deg,#fff,#fffaf0) !important;
}

body.kr-route-messages .msng-item-av-wrap{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  align-self:start !important;
}

body.kr-route-messages .msng-av2{
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  background:#26282e !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
}

body.kr-route-messages .msng-av2 span:first-child{
  color:inherit !important;
  font-size:18px !important;
}

body.kr-route-messages .msng-av2-dot{
  position:absolute !important;
  right:1px !important;
  bottom:1px !important;
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  background:var(--msg-r58-green) !important;
  border:2px solid #fff !important;
}

body.kr-route-messages .msng-item-content{
  min-width:0 !important;
  display:grid !important;
  gap:6px !important;
}

body.kr-route-messages .msng-item-row1,
body.kr-route-messages .msng-item-title-row,
body.kr-route-messages .msng-item-row3{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

body.kr-route-messages .msng-item-row1{
  justify-content:space-between !important;
}

body.kr-route-messages .msng-item-name2{
  min-width:0 !important;
  color:var(--msg-r58-text) !important;
  font-size:17px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-time2{
  flex:0 0 auto !important;
  color:var(--msg-r58-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .msng-order-num{
  flex:0 0 auto !important;
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  background:var(--msg-r58-soft) !important;
  color:#464b55 !important;
  font-size:12px !important;
  font-weight:900 !important;
}

body.kr-route-messages .msng-item-svc{
  min-width:0 !important;
  color:#262a32 !important;
  font-size:14px !important;
  line-height:1.15 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-car2{
  min-width:0 !important;
  color:var(--msg-r58-muted) !important;
  font-size:13px !important;
  line-height:1.18 !important;
  font-weight:750 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-preview2{
  min-width:0 !important;
  flex:1 1 auto !important;
  color:var(--msg-r58-muted) !important;
  font-size:13px !important;
  line-height:1.22 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.kr-route-messages .msng-item-right-meta{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}

body.kr-route-messages .msng-status-pill-sm{
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  border:1px solid transparent !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

body.kr-route-messages .msng-unread2{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--msg-r58-orange) !important;
  color:#111 !important;
  font-size:12px !important;
  font-weight:950 !important;
}

/* Empty and chatbox */
body.kr-route-messages .msng-empty-cta,
body.kr-route-messages #msng-page-chatbox{
  min-height:0 !important;
  margin:0 0 12px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.kr-route-messages .msng-empty{
  min-height:260px !important;
  border:1px dashed #d9dbe0 !important;
  border-radius:22px !important;
  background:#fafafa !important;
  padding:24px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Open chat overlay/panel should match reference when launched from #messages */
body.kr-route-messages #messenger-panel{
  border-radius:24px 24px 0 0 !important;
  background:#fff !important;
  box-shadow:0 -18px 48px rgba(15,23,42,.18) !important;
}

body.kr-route-messages .msng-header{
  background:#fff !important;
  border-bottom:1px solid var(--msg-r58-line) !important;
}

body.kr-route-messages .msng-body{
  background:#f7f7f8 !important;
}

body.kr-route-messages :where(.msng-bubble,.msg-bubble,.message-bubble){
  border-radius:16px !important;
}

/* Tablet/PC */
@media (min-width:768px){
  body.kr-route-messages .messages-reference-r58{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-messages #hero-messages{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:24px !important;
    align-items:start !important;
  }
  body.kr-route-messages .msng-list--page{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  body.kr-route-messages .msng-page-content{
    padding:clamp(22px,3vw,34px) !important;
  }
}

@media (min-width:1120px){
  body.kr-route-messages .msng-list--page{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-messages #messenger-panel{
    width:min(820px, calc(100vw - 64px)) !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) translateY(var(--msng-y,0)) !important;
    border-radius:24px !important;
    bottom:24px !important;
    max-height:calc(100vh - 96px) !important;
  }
}

/* Mobile: clean app screen */
@media (max-width:767px){
  body.kr-route-messages,
  body.kr-route-messages #app,
  body.kr-route-messages .messages-reference-r58{
    background:#fff !important;
  }
  body.kr-route-messages .messages-reference-r58{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-messages #hero-messages,
  body.kr-route-messages .msng-page-content{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px !important;
  }
  body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
    font-size:clamp(34px,10vw,42px) !important;
  }
  body.kr-route-messages .msng-item--v2{
    grid-template-columns:50px minmax(0,1fr) !important;
    padding:12px !important;
    border-radius:16px !important;
  }
  body.kr-route-messages .msng-item-av-wrap,
  body.kr-route-messages .msng-av2{
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
  }
  body.kr-route-messages .msng-status-pill-sm{
    display:none !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-messages .messages-reference-r58{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-messages #hero-messages,
  body.kr-route-messages .msng-page-content{
    padding:20px !important;
  }
  body.kr-route-messages #hero-messages :where(.spa-hero-title,h1){
    font-size:46px !important;
  }
}

/* Hard guards */
body.kr-route-messages :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/masters_manual_r59.css === */
/* KARETA r59 — manual #masters / Избранное reference redesign.
   Route: https://kareta.kz/#masters
   This is route-specific, not a generic guard. */

body.kr-route-masters{
  --mst-r59-bg:#eef0f2;
  --mst-r59-page:#fff;
  --mst-r59-soft:#f4f4f5;
  --mst-r59-line:#e7e8eb;
  --mst-r59-text:#080b10;
  --mst-r59-muted:#6f747d;
  --mst-r59-orange:#ffb000;
  --mst-r59-orange2:#ff9800;
  --mst-r59-green:#22c55e;
  background:var(--mst-r59-bg) !important;
}
body.kr-route-masters #app{background:var(--mst-r59-bg) !important;}

body.kr-route-masters .masters-reference-r59,
body.kr-route-masters #app > .page{
  min-height:100dvh !important;
  background:var(--mst-r59-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

body.kr-route-masters .kr-screen--masters{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(22px,3vw,38px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Header */
body.kr-route-masters .kr-master-screen-header{
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) 44px !important;
  gap:12px !important;
  align-items:center !important;
  margin:0 0 18px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
body.kr-route-masters .kr-header__title{
  color:var(--mst-r59-text) !important;
  font-size:clamp(38px,5.5vw,68px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
  margin:0 !important;
}
body.kr-route-masters .kr-back,
body.kr-route-masters .kr-icon-btn{
  width:44px !important;
  height:44px !important;
  border:0 !important;
  border-radius:14px !important;
  background:var(--mst-r59-soft) !important;
  color:#111 !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:950 !important;
}

/* Search */
body.kr-route-masters .kr-master-screen-search{
  margin:0 0 12px !important;
  padding:8px !important;
  border-radius:18px !important;
  background:var(--mst-r59-soft) !important;
  border:1px solid var(--mst-r59-line) !important;
  box-shadow:none !important;
}
body.kr-route-masters .kr-search__input{
  width:100% !important;
  min-height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  background:#fff !important;
  color:var(--mst-r59-text) !important;
  padding:0 14px !important;
  font-size:16px !important;
  font-weight:750 !important;
}

/* Tabs */
body.kr-route-masters .kr-master-screen-tabs{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
  margin:0 0 18px !important;
  padding:10px !important;
  border-radius:18px !important;
  background:var(--mst-r59-soft) !important;
  border:1px solid var(--mst-r59-line) !important;
}
body.kr-route-masters .kr-master-screen-tabs::-webkit-scrollbar{display:none !important;}
body.kr-route-masters .kr-tab{
  flex:0 0 auto !important;
  min-height:38px !important;
  padding:0 13px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--mst-r59-muted) !important;
  font-size:14px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kr-route-masters .kr-tab.is-active{
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--mst-r59-orange) !important;
}

/* List */
body.kr-route-masters .masters-reference-r59-list,
body.kr-route-masters .kr-master-screen-list{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
}

/* Actual cards */
body.kr-route-masters .kr-master-screen-card{
  position:relative !important;
  min-width:0 !important;
  max-width:100% !important;
  min-height:108px !important;
  margin:0 !important;
  padding:16px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) 28px !important;
  gap:14px !important;
  align-items:center !important;
  border:1px solid var(--mst-r59-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  cursor:pointer !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}
body.kr-route-masters .kr-master-screen-card:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.28) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08) !important;
}
body.kr-route-masters .kr-master-screen-avatar{
  width:64px !important;
  height:64px !important;
  border-radius:18px !important;
  background:#26282e !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:20px !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  position:relative !important;
  overflow:visible !important;
}
body.kr-route-masters .kr-master-screen-avatar span{
  position:absolute !important;
  right:0 !important;
  bottom:0 !important;
  width:14px !important;
  height:14px !important;
  border-radius:999px !important;
  border:2px solid #fff !important;
  background:var(--mst-r59-green) !important;
}
body.kr-route-masters .kr-master-screen-avatar span.is-busy{
  background:#f59e0b !important;
}
body.kr-route-masters .kr-master-screen-body{
  min-width:0 !important;
  display:grid !important;
  gap:6px !important;
}
body.kr-route-masters .kr-master-screen-top{
  min-width:0 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:10px !important;
}
body.kr-route-masters .kr-master-screen-top h3{
  min-width:0 !important;
  margin:0 !important;
  color:var(--mst-r59-text) !important;
  font-size:clamp(18px,2vw,22px) !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.kr-route-masters .kr-master-screen-top b{
  flex:0 0 auto !important;
  min-height:26px !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-size:12px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}
body.kr-route-masters .kr-master-screen-spec{
  margin:0 !important;
  color:#363b44 !important;
  font-size:14px !important;
  line-height:1.22 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.kr-route-masters .kr-master-screen-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  color:var(--mst-r59-muted) !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
}
body.kr-route-masters .kr-master-screen-meta span:first-child{
  color:var(--mst-r59-orange2) !important;
  font-weight:950 !important;
}
body.kr-route-masters .kr-master-screen-chevron{
  width:28px !important;
  height:28px !important;
  border-radius:10px !important;
  background:var(--mst-r59-soft) !important;
  color:#111 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:22px !important;
  font-weight:900 !important;
}

/* Empty */
body.kr-route-masters .kr-master-screen-empty{
  min-height:280px !important;
  border:1px dashed #d9dbe0 !important;
  border-radius:22px !important;
  background:#fafafa !important;
  padding:24px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  text-align:center !important;
}

/* Tablet/wide */
@media (min-width:768px){
  body.kr-route-masters .masters-reference-r59{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-masters .kr-screen--masters{
    padding:clamp(26px,3vw,38px) !important;
  }
  body.kr-route-masters .kr-master-screen-header{
    grid-template-columns:52px minmax(0,1fr) 52px !important;
    margin-bottom:22px !important;
  }
  body.kr-route-masters .kr-back,
  body.kr-route-masters .kr-icon-btn{
    width:52px !important;
    height:52px !important;
    border-radius:16px !important;
  }
  body.kr-route-masters .masters-reference-r59-list,
  body.kr-route-masters .kr-master-screen-list{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1180px){
  body.kr-route-masters .masters-reference-r59-list,
  body.kr-route-masters .kr-master-screen-list{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body.kr-route-masters .kr-master-screen-card{
    grid-template-columns:60px minmax(0,1fr) 26px !important;
  }
  body.kr-route-masters .kr-master-screen-avatar{
    width:60px !important;
    height:60px !important;
  }
}

/* Mobile full-screen app mode */
@media (max-width:767px){
  body.kr-route-masters,
  body.kr-route-masters #app,
  body.kr-route-masters .masters-reference-r59{
    background:#fff !important;
  }
  body.kr-route-masters .masters-reference-r59{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-masters .kr-screen--masters{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px 22px !important;
    min-height:100dvh !important;
  }
  body.kr-route-masters .kr-header__title{
    font-size:clamp(34px,10vw,42px) !important;
  }
  body.kr-route-masters .kr-master-screen-card{
    grid-template-columns:56px minmax(0,1fr) 24px !important;
    padding:14px !important;
    border-radius:16px !important;
  }
  body.kr-route-masters .kr-master-screen-avatar{
    width:56px !important;
    height:56px !important;
    border-radius:16px !important;
  }
  body.kr-route-masters .kr-master-screen-top{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
  }
  body.kr-route-masters .kr-master-screen-meta{
    font-size:12px !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-masters .masters-reference-r59{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-masters .kr-screen--masters{
    padding:20px !important;
  }
  body.kr-route-masters .kr-header__title{
    font-size:46px !important;
  }
}

/* Master profile opened from #masters:<id> — keep it in the same app-card language. */
body.kr-route-masters :where(.master-profile-page){
  min-height:100dvh !important;
  background:var(--mst-r59-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}
body.kr-route-masters .master-profile-page > .container{
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(20px,3vw,36px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
}

/* Hard guards */
body.kr-route-masters :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/cabinet_manual_r60.css === */
/* KARETA r60 — manual #cabinet and #cabinet:* reference redesign.
   Routes:
   - https://kareta.kz/#cabinet
   - https://kareta.kz/#cabinet:editprofile
   - https://kareta.kz/#cabinet:car
   - https://kareta.kz/#cabinet:diagnostics
   - https://kareta.kz/#cabinet:stats
   - https://kareta.kz/#cabinet:loyalty
   - https://kareta.kz/#cabinet:appsettings
   This is route-specific, not a generic guard. */

body.kr-route-cabinet{
  --cab-r60-bg:#eef0f2;
  --cab-r60-page:#fff;
  --cab-r60-soft:#f4f4f5;
  --cab-r60-line:#e7e8eb;
  --cab-r60-text:#080b10;
  --cab-r60-muted:#6f747d;
  --cab-r60-orange:#ffb000;
  --cab-r60-orange2:#ff9800;
  --cab-r60-green:#22c55e;
  --cab-r60-red:#ef4444;
  background:var(--cab-r60-bg) !important;
}
body.kr-route-cabinet #app{background:var(--cab-r60-bg) !important;}

body.kr-route-cabinet #app > .page,
body.kr-route-cabinet .cabinet-reference-r60{
  min-height:100dvh !important;
  background:var(--cab-r60-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

/* Main cabinet containers and panes */
body.kr-route-cabinet #app > .page > section,
body.kr-route-cabinet #app > .page .cab-pane,
body.kr-route-cabinet .cabinet-reference-r60-pane{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.kr-route-cabinet #app > .page .container,
body.kr-route-cabinet .cab-pane > .container,
body.kr-route-cabinet .cabinet-reference-r60-pane > .container{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(20px,3vw,38px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Cabinet headers */
body.kr-route-cabinet :where(.cab-pane-head,.cab-head,.ccab-hero,.profile-head,.vcar-header,.diag-account-hero,.loy-hero){
  margin:0 0 18px !important;
  padding:clamp(16px,2vw,22px) !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title,.diag-account-body h3,.loy-hero-title,h1,h2,h3){
  color:var(--cab-r60-text) !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
  line-height:1.02 !important;
}
body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title){
  font-size:clamp(30px,4.6vw,56px) !important;
  margin:0 !important;
}
body.kr-route-cabinet :where(.cab-pane-sub,.cab-sub,.ccab-sub,.profile-sub,.diag-account-body p,.loy-hero-sub,p,small){
  color:var(--cab-r60-muted) !important;
  line-height:1.35 !important;
}

/* Layouts */
body.kr-route-cabinet :where(.cab-pane-layout,.profile-form,.cst-grid,.vcar-grid,.vehicle-list,.settings-list,.loy-how-grid,.loy-levels,.cab-grid,.ccab-grid){
  display:grid !important;
  gap:14px !important;
}

/* Cards */
body.kr-route-cabinet :where(.card,.profile-form-card,.cst-card,.cst-order-row,.loy-hero,.loy-lvl-card,.loy-how,.loy-how-item,.vehicle-card,.vehicle-editor-section,.diag-account-hero,.diag-card,.settings-row,.cab-row,.ccab-card,.garage-history-item,.notify-row,.notification-card){
  min-width:0 !important;
  max-width:100% !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

/* Stats */
body.kr-route-cabinet .cst-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  margin-bottom:16px !important;
}
body.kr-route-cabinet .cst-card{
  min-height:116px !important;
  padding:16px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:8px !important;
}
body.kr-route-cabinet .cst-card-ico{
  width:40px !important;
  height:40px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:18px !important;
}
body.kr-route-cabinet .cst-card-val{
  color:var(--cab-r60-text) !important;
  font-size:clamp(22px,3vw,32px) !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.05em !important;
}
body.kr-route-cabinet .cst-card-lbl{
  color:var(--cab-r60-muted) !important;
  font-size:13px !important;
  font-weight:850 !important;
}

/* Profile form */
body.kr-route-cabinet .profile-form-card{
  padding:clamp(16px,2.2vw,24px) !important;
}
body.kr-route-cabinet .profile-form{
  grid-template-columns:1fr !important;
}
body.kr-route-cabinet :where(.pf-group,.form-group){
  display:grid !important;
  gap:7px !important;
  min-width:0 !important;
}
body.kr-route-cabinet :where(.pf-label,label){
  color:#303540 !important;
  font-size:13px !important;
  font-weight:900 !important;
}
body.kr-route-cabinet :where(.pf-input,input,select,textarea){
  min-height:46px !important;
  width:100% !important;
  border:1px solid var(--cab-r60-line) !important;
  border-radius:14px !important;
  background:#fff !important;
  color:var(--cab-r60-text) !important;
  padding:0 14px !important;
  font-size:16px !important;
}
body.kr-route-cabinet textarea{padding-top:12px !important;}

/* History/orders rows */
body.kr-route-cabinet .cst-order-row,
body.kr-route-cabinet .garage-history-item{
  min-height:64px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
  text-align:left !important;
}
body.kr-route-cabinet .cst-order-ico{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.kr-route-cabinet .cst-order-name,
body.kr-route-cabinet .garage-history-item .name{
  color:var(--cab-r60-text) !important;
  font-size:15px !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
}
body.kr-route-cabinet .cst-order-meta,
body.kr-route-cabinet .garage-history-item .meta{
  color:var(--cab-r60-muted) !important;
  font-size:12px !important;
  font-weight:750 !important;
}
body.kr-route-cabinet .cst-order-price{
  color:var(--cab-r60-text) !important;
  font-size:13px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}

/* Garage */
body.kr-route-cabinet .vcar-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
body.kr-route-cabinet :where(.vehicle-card,.car-card,.vcar-card){
  min-height:96px !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:center !important;
}
body.kr-route-cabinet :where(.vehicle-card img,.car-card img,.vcar-thumb,img.vehicle-photo){
  width:64px !important;
  height:64px !important;
  border-radius:16px !important;
  object-fit:cover !important;
  background:#25272d !important;
}

/* Loyalty */
body.kr-route-cabinet .loy-hero{
  position:relative !important;
  padding:clamp(18px,2.5vw,28px) !important;
  background:linear-gradient(135deg,#fff,#fff8df) !important;
}
body.kr-route-cabinet .loy-levels{
  grid-template-columns:1fr !important;
}
body.kr-route-cabinet .loy-lvl-card{
  min-height:72px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}
body.kr-route-cabinet .loy-lvl-ico{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Notifications/settings */
body.kr-route-cabinet :where(.settings-row,.notify-row,.notification-card){
  min-height:62px !important;
  padding:12px 14px !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
}

/* Diagnostics */
body.kr-route-cabinet .diag-account-hero{
  display:grid !important;
  grid-template-columns:56px minmax(0,1fr) !important;
  gap:14px !important;
  align-items:center !important;
}
body.kr-route-cabinet .diag-account-ico{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  background:#fff3c7 !important;
  color:var(--cab-r60-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:22px !important;
}

/* Buttons */
body.kr-route-cabinet :where(.btn,.button,button,.cab-btn,.ccab-btn){
  min-width:0 !important;
  max-width:100% !important;
  min-height:40px !important;
  border-radius:12px !important;
  font-weight:900 !important;
  overflow-wrap:anywhere !important;
}
body.kr-route-cabinet :where(.btn-primary,.primary-btn,.save-btn,.submit-btn){
  background:linear-gradient(180deg,var(--cab-r60-orange),var(--cab-r60-orange2)) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}
body.kr-route-cabinet :where(.btn-outline,.btn-ghost,.secondary-btn){
  background:#fff !important;
  color:var(--cab-r60-text) !important;
  border:1px solid var(--cab-r60-line) !important;
}

/* Tablet/desktop */
@media (min-width:768px){
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-cabinet .profile-form{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .cst-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid,.vcar-grid,.vehicle-list,.loy-how-grid){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .loy-levels{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1120px){
  body.kr-route-cabinet :where(.cab-pane-layout,.ccab-grid,.cab-grid,.vcar-grid,.vehicle-list){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet .profile-form-card,
  body.kr-route-cabinet #cp-editprofile .profile-form-card{
    grid-column:span 2 !important;
  }
}

/* Mobile full-screen app mode */
@media (max-width:767px){
  body.kr-route-cabinet,
  body.kr-route-cabinet #app,
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    background:#fff !important;
  }
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-cabinet #app > .page .container,
  body.kr-route-cabinet .cab-pane > .container,
  body.kr-route-cabinet .cabinet-reference-r60-pane > .container{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px 22px !important;
    min-height:100dvh !important;
  }
  body.kr-route-cabinet :where(.cab-pane-title,.cab-title,.ccab-title,.profile-title,.vcar-title){
    font-size:clamp(32px,9vw,42px) !important;
  }
  body.kr-route-cabinet .cst-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body.kr-route-cabinet :where(.vehicle-card,.car-card,.vcar-card){
    grid-template-columns:56px minmax(0,1fr) auto !important;
  }
  body.kr-route-cabinet :where(.vehicle-card img,.car-card img,.vcar-thumb,img.vehicle-photo){
    width:56px !important;
    height:56px !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-cabinet #app > .page,
  body.kr-route-cabinet .cabinet-reference-r60{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-cabinet #app > .page .container,
  body.kr-route-cabinet .cab-pane > .container{
    padding:20px !important;
  }
}

/* Hard guards */
body.kr-route-cabinet :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div,input,textarea,select){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/parts_manual_r61.css === */
/* KARETA r61 — manual #parts reference redesign.
   Route: https://kareta.kz/#parts and parts category states.
   This is route-specific, not a generic guard. */

body.kr-route-parts{
  --prt-r61-bg:#eef0f2;
  --prt-r61-page:#fff;
  --prt-r61-soft:#f4f4f5;
  --prt-r61-line:#e7e8eb;
  --prt-r61-text:#080b10;
  --prt-r61-muted:#6f747d;
  --prt-r61-orange:#ffb000;
  --prt-r61-orange2:#ff9800;
  --prt-r61-green:#22c55e;
  background:var(--prt-r61-bg) !important;
}
body.kr-route-parts #app{background:var(--prt-r61-bg) !important;}

body.kr-route-parts .parts-reference-r61,
body.kr-route-parts #app > .page{
  min-height:100dvh !important;
  background:var(--prt-r61-bg) !important;
  padding:clamp(14px,2.5vw,32px) clamp(12px,2.8vw,40px) calc(124px + env(safe-area-inset-bottom,0px)) !important;
}

/* Hero */
body.kr-route-parts #hero-parts,
body.kr-route-parts .spa-page-hero--catalog{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto 14px !important;
  padding:clamp(22px,3vw,36px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}
body.kr-route-parts #hero-parts :where(.spa-hero-kicker,.spa-hero-label){
  width:max-content !important;
  max-width:100% !important;
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-weight:900 !important;
  font-size:12px !important;
}
body.kr-route-parts #hero-parts :where(.spa-hero-title,h1){
  max-width:650px !important;
  color:var(--prt-r61-text) !important;
  font-size:clamp(38px,5.5vw,68px) !important;
  line-height:.94 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
  margin:10px 0 10px !important;
}
body.kr-route-parts #hero-parts :where(.spa-hero-sub){
  color:var(--prt-r61-muted) !important;
  font-size:clamp(15px,1.8vw,18px) !important;
  line-height:1.35 !important;
}
body.kr-route-parts #hero-parts :where(.spa-hero-stats,.spa-hero-statline){
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}
body.kr-route-parts #hero-parts .spa-hero-stat{
  min-width:116px !important;
  padding:12px !important;
  border-radius:16px !important;
  background:var(--prt-r61-soft) !important;
  border:1px solid var(--prt-r61-line) !important;
}
body.kr-route-parts #hero-parts .spa-hero-stat-num{
  color:var(--prt-r61-text) !important;
  font-size:22px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}
body.kr-route-parts #hero-parts .spa-hero-stat-lbl{
  margin-top:5px !important;
  color:var(--prt-r61-muted) !important;
  font-size:12px !important;
  font-weight:800 !important;
}

/* Main app-card container */
body.kr-route-parts .parts-reference-r61-content{
  max-width:1120px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:transparent !important;
}
body.kr-route-parts .parts-reference-r61-container,
body.kr-route-parts .parts-page-shell .spa-content > .container{
  width:100% !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:clamp(18px,3vw,34px) !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.055) !important;
  border-radius:28px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

/* Filters/tools */
body.kr-route-parts #parts-sticky-tools,
body.kr-route-parts .parts-sticky-tools,
body.kr-route-parts .parts-filter-bar{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  margin:0 0 16px !important;
  padding:10px !important;
  background:var(--prt-r61-soft) !important;
  border:1px solid var(--prt-r61-line) !important;
  border-radius:18px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
body.kr-route-parts .mo-filter-tabs{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
  padding:0 !important;
}
body.kr-route-parts .mo-filter-tabs::-webkit-scrollbar{display:none !important;}
body.kr-route-parts .mo-filter-tab{
  min-height:38px !important;
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:var(--prt-r61-muted) !important;
  box-shadow:none !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kr-route-parts .mo-filter-tab.active{
  color:#111 !important;
  background:#fff3c7 !important;
  box-shadow:inset 0 -2px 0 var(--prt-r61-orange) !important;
}
body.kr-route-parts .mo-filter-tab-ico{
  color:var(--prt-r61-orange2) !important;
}
body.kr-route-parts .mo-filter-cnt{
  min-width:22px !important;
  height:22px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--prt-r61-soft) !important;
  color:#111 !important;
  font-size:12px !important;
}

/* Category cards */
body.kr-route-parts .parts-categories-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
}
body.kr-route-parts .parts-category-card{
  min-width:0 !important;
  min-height:132px !important;
  padding:16px !important;
  display:grid !important;
  gap:12px !important;
  border:1px solid var(--prt-r61-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  text-align:left !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}
body.kr-route-parts .parts-category-card:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.28) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08) !important;
}
body.kr-route-parts .parts-category-card__top{
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
}
body.kr-route-parts .parts-category-card__icon{
  width:52px !important;
  height:52px !important;
  border-radius:16px !important;
  background:#fff3c7 !important;
  color:var(--prt-r61-orange2) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:22px !important;
}
body.kr-route-parts .parts-category-card__label{
  color:var(--prt-r61-muted) !important;
  font-size:12px !important;
  font-weight:850 !important;
}
body.kr-route-parts .parts-category-card__title{
  color:var(--prt-r61-text) !important;
  font-size:clamp(18px,2vw,22px) !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  letter-spacing:-.045em !important;
}
body.kr-route-parts .parts-category-card__desc{
  color:var(--prt-r61-muted) !important;
  font-size:13px !important;
  line-height:1.3 !important;
}

/* Category summary and products */
body.kr-route-parts .parts-summary-card{
  margin:0 0 16px !important;
  padding:16px !important;
  border:1px solid var(--prt-r61-line) !important;
  border-radius:20px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
}
body.kr-route-parts .parts-summary-card__badge{
  width:max-content !important;
  max-width:100% !important;
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  font-size:12px !important;
  font-weight:900 !important;
}
body.kr-route-parts .svc-active-category__title{
  color:var(--prt-r61-text) !important;
  font-size:clamp(22px,3vw,34px) !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
}
body.kr-route-parts .svc-active-category__desc{
  color:var(--prt-r61-muted) !important;
}
body.kr-route-parts .parts-grid-v2{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
}
body.kr-route-parts .part-card-v2{
  min-width:0 !important;
  border:1px solid var(--prt-r61-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}
body.kr-route-parts .part-card-v2-media-wrap{
  border-radius:16px !important;
  overflow:hidden !important;
  background:var(--prt-r61-soft) !important;
}
body.kr-route-parts .part-card-v2-name{
  color:var(--prt-r61-text) !important;
  font-size:17px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
}
body.kr-route-parts .part-card-v2-sku{
  color:var(--prt-r61-muted) !important;
  font-size:12px !important;
  line-height:1.25 !important;
}
body.kr-route-parts .part-stock-badge{
  min-height:26px !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
body.kr-route-parts .part-stock-badge.in{
  background:#ecfdf3 !important;
  color:#15803d !important;
}
body.kr-route-parts .part-stock-badge.order{
  background:#fff3c7 !important;
  color:#6f4a00 !important;
}

/* Buttons */
body.kr-route-parts :where(.btn,.button,button,.part-card-v2 button){
  min-width:0 !important;
  max-width:100% !important;
  min-height:40px !important;
  border-radius:12px !important;
  font-weight:900 !important;
  overflow-wrap:anywhere !important;
}
body.kr-route-parts :where(.btn-primary,.primary-btn){
  background:linear-gradient(180deg,var(--prt-r61-orange),var(--prt-r61-orange2)) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}
body.kr-route-parts :where(.btn-outline,.btn-ghost){
  background:#fff !important;
  color:var(--prt-r61-text) !important;
  border:1px solid var(--prt-r61-line) !important;
}

/* Tablet/wide */
@media (min-width:768px){
  body.kr-route-parts .parts-reference-r61{
    padding:clamp(20px,3vw,40px) clamp(20px,3vw,48px) calc(128px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-parts #hero-parts{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:24px !important;
    align-items:start !important;
  }
  body.kr-route-parts .parts-categories-grid,
  body.kr-route-parts .parts-grid-v2{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (min-width:1120px){
  body.kr-route-parts .parts-categories-grid,
  body.kr-route-parts .parts-grid-v2{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Mobile full-screen */
@media (max-width:767px){
  body.kr-route-parts,
  body.kr-route-parts #app,
  body.kr-route-parts .parts-reference-r61{
    background:#fff !important;
  }
  body.kr-route-parts .parts-reference-r61{
    padding:0 0 calc(92px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.kr-route-parts #hero-parts,
  body.kr-route-parts .parts-reference-r61-container,
  body.kr-route-parts .parts-page-shell .spa-content > .container{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:18px 14px !important;
  }
  body.kr-route-parts #hero-parts :where(.spa-hero-title,h1){
    font-size:clamp(34px,10vw,42px) !important;
  }
  body.kr-route-parts .parts-category-card{
    min-height:116px !important;
    padding:14px !important;
  }
}

/* Low-height tablet compact */
@media (min-width:768px) and (max-height:760px){
  body.kr-route-parts .parts-reference-r61{
    padding-top:14px !important;
    padding-bottom:104px !important;
  }
  body.kr-route-parts #hero-parts,
  body.kr-route-parts .parts-reference-r61-container{
    padding:20px !important;
  }
  body.kr-route-parts #hero-parts :where(.spa-hero-title,h1){
    font-size:46px !important;
  }
}

/* Hard guards */
body.kr-route-parts :where(h1,h2,h3,h4,p,span,small,b,strong,a,button,label,div,input,textarea,select){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* === SOURCE: css/parts_entry_r62.css === */


/* KARETA r62c — 9 tiles in services-app-grid + parts order reference style.
   Base: locked r61. No r63/r64/r65/r66 code reused.
   Change: main grid has 9 tiles; "Запчасти" is a normal services-app-tile, no separate CTA block. */

/* Parts order modal should feel like the sent cart/order reference. */
#parts-order-modal.cmodal-overlay{
  background:rgba(238,240,242,.86) !important;
  backdrop-filter:blur(16px) saturate(1.1) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.1) !important;
}

#parts-order-modal .parts-order-modal-box{
  width:min(100% - 24px, 760px) !important;
  max-width:760px !important;
  max-height:min(92vh, 860px) !important;
  border:1px solid rgba(15,23,42,.06) !important;
  border-radius:28px !important;
  background:#fff !important;
  box-shadow:0 24px 70px rgba(15,23,42,.18) !important;
  padding:clamp(18px,3vw,28px) !important;
}

#parts-order-modal .cmodal-title{
  color:#080b10 !important;
  font-size:clamp(24px,3vw,34px) !important;
  line-height:1.04 !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
}

#parts-order-modal .cmodal-sub,
#parts-order-modal .pof-hint{
  color:#6f747d !important;
  font-size:14px !important;
  line-height:1.32 !important;
}

#parts-order-modal .pof-selected{
  border:1px solid #e7e8eb !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  padding:12px !important;
}

#parts-order-modal .parts-request-grid,
#parts-order-modal .pof-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
}

#parts-order-modal .pof-group{
  min-width:0 !important;
  display:grid !important;
  gap:7px !important;
}

#parts-order-modal .pof-label{
  color:#303540 !important;
  font-size:13px !important;
  font-weight:900 !important;
}

#parts-order-modal .pof-input{
  min-height:46px !important;
  border:1px solid #e7e8eb !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#080b10 !important;
  padding:0 14px !important;
  font-size:16px !important;
  box-shadow:none !important;
}

#parts-order-modal .pof-input:focus{
  border-color:rgba(255,176,0,.75) !important;
  box-shadow:0 0 0 3px rgba(255,176,0,.16) !important;
  outline:0 !important;
}

#parts-order-modal .pof-textarea{
  min-height:92px !important;
  padding-top:12px !important;
}

#parts-order-modal .parts-request-flow{
  grid-column:1/-1 !important;
  border:1px solid #e7e8eb !important;
  border-radius:18px !important;
  background:#fafafa !important;
  padding:12px !important;
}

#parts-order-modal .parts-request-steps{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:7px !important;
  margin-top:10px !important;
}

#parts-order-modal .parts-request-steps span{
  min-height:34px !important;
  border-radius:999px !important;
  background:#fff3c7 !important;
  color:#6f4a00 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  font-size:11px !important;
  font-weight:900 !important;
  padding:0 6px !important;
}

#parts-order-modal .cmodal-actions{
  display:grid !important;
  grid-template-columns:1fr 1.35fr !important;
  gap:10px !important;
}

#parts-order-modal .btn{
  min-height:48px !important;
  border-radius:14px !important;
  font-weight:950 !important;
}

#parts-order-modal .btn-primary{
  background:linear-gradient(180deg,#ffb000,#ff9800) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 12px 26px rgba(255,176,0,.24) !important;
}

#parts-order-modal .btn-outline{
  background:#fff !important;
  border:1px solid #e7e8eb !important;
  color:#080b10 !important;
}

/* Part request/order cards in myorders keep a shop-like style. */
body.kr-route-myorders .mo-type-badge.parts,
body.kr-route-myorders .mo-card[data-type="parts_request"] .mo-type-badge{
  background:#fff3c7 !important;
  color:#6f4a00 !important;
}

@media (min-width:768px){
}

@media (max-width:767px){
  #parts-order-modal .parts-order-modal-box{
    width:100% !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    border-radius:0 !important;
    padding:18px 14px calc(18px + env(safe-area-inset-bottom,0px)) !important;
  }
  #parts-order-modal .parts-request-grid,
  #parts-order-modal .pof-grid{
    grid-template-columns:1fr !important;
  }
  #parts-order-modal .parts-request-steps{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #parts-order-modal .cmodal-actions{
    grid-template-columns:1fr !important;
  }
}

/* === SOURCE: css/parts_orders_r62b.css === */
/* KARETA r62b — parts orders list + parts order detail reference style.
   Base: r62a from locked r61. No r63/r64/r65/r66 reused. */

/* Dedicated parts filter in My Orders */
body.kr-route-myorders .mo-filter-tab--parts{
  border:1px solid rgba(255,176,0,.30) !important;
}
body.kr-route-myorders .mo-filter-tab--parts.active{
  background:#fff3c7 !important;
  color:#111 !important;
}

/* Parts order card preview, close to the provided "Мои заказы запчастей" style */
body.kr-route-myorders .mo-card-parts{
  border-color:rgba(255,176,0,.28) !important;
  background:linear-gradient(180deg,#fff,#fffaf0) !important;
}
body.kr-route-myorders .mo-card-parts .mo-card-title{
  color:#080b10 !important;
}
body.kr-route-myorders .parts-order-card-r62b{
  margin-top:12px !important;
  min-width:0 !important;
  padding:10px !important;
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) auto !important;
  gap:10px !important;
  align-items:center !important;
  border:1px solid #e7e8eb !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(15,23,42,.045) !important;
}
body.kr-route-myorders .parts-order-card-r62b-img{
  width:54px !important;
  height:54px !important;
  border-radius:14px !important;
  background:#fff3c7 !important;
  color:#ff9800 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.kr-route-myorders .parts-order-card-r62b-img svg{
  width:27px !important;
  height:27px !important;
  stroke:currentColor !important;
}
body.kr-route-myorders .parts-order-card-r62b-main{
  min-width:0 !important;
  display:grid !important;
  gap:4px !important;
}
body.kr-route-myorders .parts-order-card-r62b-main b{
  color:#080b10 !important;
  font-size:14px !important;
  line-height:1.15 !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.kr-route-myorders .parts-order-card-r62b-main em{
  color:#6f747d !important;
  font-size:12px !important;
  line-height:1.2 !important;
  font-style:normal !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
body.kr-route-myorders .parts-order-card-r62b-price{
  color:#080b10 !important;
  font-size:13px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}

/* Detail panel for parts requests */
#odet-panel[data-order-type="parts_request"]{
  background:rgba(238,240,242,.88) !important;
  backdrop-filter:blur(16px) saturate(1.1) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.1) !important;
}
#odet-panel[data-order-type="parts_request"] .owiz-box{
  width:min(100% - 24px, 820px) !important;
  max-width:820px !important;
  max-height:min(92vh, 900px) !important;
  border-radius:28px !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.06) !important;
  box-shadow:0 24px 70px rgba(15,23,42,.18) !important;
  overflow:hidden !important;
}
#odet-panel-inner.odet-panel--parts-r62b{
  background:#fff !important;
  color:#080b10 !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-header{
  padding:20px 22px !important;
  background:#fff !important;
  border-bottom:1px solid #e7e8eb !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-id{
  color:#080b10 !important;
  font-size:clamp(24px,3vw,34px) !important;
  line-height:1.04 !important;
  font-weight:950 !important;
  letter-spacing:-.055em !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-body{
  padding:18px 22px 22px !important;
  background:#fff !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-section{
  border:1px solid #e7e8eb !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
  padding:16px !important;
  margin-bottom:14px !important;
  overflow:hidden !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-sec-title{
  color:#080b10 !important;
  font-size:18px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  margin-bottom:12px !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-row{
  min-height:44px !important;
  padding:10px 0 !important;
  display:grid !important;
  grid-template-columns:minmax(130px,.38fr) minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
  border-bottom:1px solid #f0f1f3 !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-row:last-child{
  border-bottom:0 !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-key{
  color:#6f747d !important;
  font-size:13px !important;
  font-weight:850 !important;
}
#odet-panel-inner.odet-panel--parts-r62b .odet-val{
  color:#080b10 !important;
  font-size:14px !important;
  line-height:1.28 !important;
  font-weight:850 !important;
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}

/* Parts processing/timeline section */
#odet-panel-inner.odet-panel--parts-r62b .odet-status-badge{
  min-height:28px !important;
  padding:6px 10px !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:950 !important;
}

/* Client offers / manager blocks should resemble order detail cards */
#odet-panel-inner.odet-panel--parts-r62b :where(.parts-offer-manager,.parts-client-offers,.parts-offer-card,.parts-request-offer-row){
  border-radius:16px !important;
}
#odet-panel-inner.odet-panel--parts-r62b :where(input,select,textarea){
  min-height:44px !important;
  border:1px solid #e7e8eb !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#080b10 !important;
  font-size:15px !important;
}
#odet-panel-inner.odet-panel--parts-r62b :where(.btn-primary,.odet-st-btn){
  border-radius:12px !important;
}
#odet-panel-inner.odet-panel--parts-r62b .btn-primary{
  background:linear-gradient(180deg,#ffb000,#ff9800) !important;
  color:#111 !important;
  border:0 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.22) !important;
}

/* Mobile */
@media (max-width:767px){
  body.kr-route-myorders .parts-order-card-r62b{
    grid-template-columns:48px minmax(0,1fr) !important;
  }
  body.kr-route-myorders .parts-order-card-r62b-img{
    width:48px !important;
    height:48px !important;
  }
  body.kr-route-myorders .parts-order-card-r62b-price{
    grid-column:2 !important;
    justify-self:start !important;
  }
  #odet-panel[data-order-type="parts_request"] .owiz-box{
    width:100% !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    border-radius:0 !important;
  }
  #odet-panel-inner.odet-panel--parts-r62b .odet-header,
  #odet-panel-inner.odet-panel--parts-r62b .odet-body{
    padding-left:14px !important;
    padding-right:14px !important;
  }
  #odet-panel-inner.odet-panel--parts-r62b .odet-row{
    grid-template-columns:1fr !important;
    gap:4px !important;
  }
}

/* === SOURCE: css/services_grid_9_r62c.css === */
/* KARETA r62c — home services grid is 3x3, no separate "Далее" block. */
.services-app-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
}

.services-app-grid .services-app-tile{
  min-width:0 !important;
}

@media (max-width:360px){
  .services-app-grid{
    gap:8px !important;
  }
}

/* === SOURCE: css/services_home_fix_r62e.css === */
/* KARETA r62e — #services grid/search/button/logo cleanup.
   Scope: https://kareta.kz/#services only.
   Base: r62d. No service worker/API/DB/business logic changes. */

body.kareta-page-services,
body.kr-route-services,
#app.kr-route-services{
  background:#eef0f2 !important;
}

.services-app-page--home{
  background:#eef0f2 !important;
  min-height:100dvh !important;
  overflow-x:hidden !important;
}

/* Main phone/tablet shell */
.services-app-page--home .services-app-phone{
  width:min(100%, 1040px) !important;
  max-width:1040px !important;
  margin:0 auto !important;
  padding:clamp(16px,3vw,34px) !important;
  border-radius:clamp(0px,2vw,28px) !important;
  background:#fff !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  border:1px solid rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

/* Header/logo */
.services-app-page--home .services-app-home-head{
  padding:0 !important;
  margin:0 0 16px !important;
}

.services-app-page--home .services-app-topline{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-width:0 !important;
  margin:0 0 clamp(16px,2.5vw,26px) !important;
}

.services-app-page--home .services-app-logo,
.services-app-page--home .services-app-logo span{
  display:none !important;
}

.services-app-page--home .services-app-logo-img{
  display:block !important;
  width:auto !important;
  height:clamp(46px,6vw,66px) !important;
  max-width:min(220px,65vw) !important;
  object-fit:contain !important;
  object-position:left center !important;
  flex:0 1 auto !important;
}

.services-app-page--home .services-app-icon-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  border:1px solid #e7e8eb !important;
  border-radius:14px !important;
  background:#f4f4f5 !important;
  color:#111318 !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.services-app-page--home .services-app-icon-btn svg{
  width:21px !important;
  height:21px !important;
  stroke:currentColor !important;
}

/* Title */
.services-app-page--home .services-app-home-head h1{
  max-width:620px !important;
  margin:0 !important;
  color:#080b10 !important;
  font-size:clamp(34px,6.2vw,68px) !important;
  line-height:.96 !important;
  font-weight:950 !important;
  letter-spacing:-.075em !important;
}

/* Search: fixed grid, no floating/overlap from older CSS */
.services-app-page--home .services-app-search{
  width:100% !important;
  max-width:520px !important;
  height:50px !important;
  margin:clamp(18px,3vw,30px) 0 clamp(16px,2.6vw,24px) !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr) 50px !important;
  align-items:center !important;
  gap:0 !important;
  border:1px solid #e7e8eb !important;
  border-radius:16px !important;
  background:#f4f4f5 !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

.services-app-page--home .services-app-search > span{
  width:42px !important;
  height:50px !important;
  min-width:42px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#9ca3af !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.services-app-page--home .services-app-search svg{
  width:18px !important;
  height:18px !important;
  stroke:currentColor !important;
  fill:none !important;
}

.services-app-page--home .services-app-search input{
  min-width:0 !important;
  width:100% !important;
  height:50px !important;
  margin:0 !important;
  padding:0 10px !important;
  border:0 !important;
  border-radius:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#111318 !important;
  font-size:15px !important;
  font-weight:750 !important;
  box-shadow:none !important;
}

.services-app-page--home .services-app-search input::placeholder{
  color:#8b929d !important;
  opacity:1 !important;
}

.services-app-page--home .services-app-search button{
  width:50px !important;
  height:50px !important;
  min-width:50px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:14px !important;
  background:#ffb000 !important;
  color:#111 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.20) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Emergency buttons */
.services-app-page--home .services-app-emergency-row{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  margin:0 0 14px !important;
}

.services-app-page--home .services-app-emergency-row button{
  min-width:0 !important;
  min-height:42px !important;
  padding:0 9px !important;
  border:1px solid #e7e8eb !important;
  border-radius:14px !important;
  background:#fff !important;
  color:#111318 !important;
  box-shadow:0 6px 16px rgba(15,23,42,.035) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  overflow:hidden !important;
}

.services-app-page--home .services-app-emergency-row button span{
  width:20px !important;
  height:20px !important;
  min-width:20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.services-app-page--home .services-app-emergency-row button b{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

/* 3x3 services grid with no overlap */
.services-app-page--home .services-app-grid{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  margin:0 0 clamp(18px,3vw,30px) !important;
  align-items:stretch !important;
}

.services-app-page--home .services-app-grid .services-app-tile{
  min-width:0 !important;
  width:100% !important;
  min-height:clamp(92px,13vw,132px) !important;
  padding:clamp(10px,1.8vw,16px) 8px !important;
  border:0 !important;
  border-radius:16px !important;
  background:#f4f4f5 !important;
  color:#111318 !important;
  box-shadow:none !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:clamp(8px,1.4vw,12px) !important;
  text-align:center !important;
  overflow:hidden !important;
  position:relative !important;
}

.services-app-page--home .services-app-grid .services-app-tile__icon{
  width:clamp(38px,5.8vw,54px) !important;
  height:clamp(38px,5.8vw,54px) !important;
  min-width:clamp(38px,5.8vw,54px) !important;
  min-height:clamp(38px,5.8vw,54px) !important;
  border-radius:15px !important;
  background:#fff !important;
  color:#111318 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 6px 16px rgba(15,23,42,.035) !important;
  overflow:hidden !important;
}

.services-app-page--home .services-app-grid .services-app-tile:nth-child(9) .services-app-tile__icon{
  background:#ffb000 !important;
  color:#111 !important;
  box-shadow:0 10px 22px rgba(255,176,0,.20) !important;
}

.services-app-page--home .services-app-grid .services-app-tile__icon svg{
  width:clamp(21px,3vw,28px) !important;
  height:clamp(21px,3vw,28px) !important;
  stroke:currentColor !important;
  fill:none !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.services-app-page--home .services-app-grid .services-app-tile__label{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  color:#111318 !important;
  font-size:clamp(11px,1.7vw,15px) !important;
  line-height:1.12 !important;
  font-weight:900 !important;
  letter-spacing:-.025em !important;
  text-align:center !important;
  white-space:normal !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  text-overflow:ellipsis !important;
}

/* Nearby block */
.services-app-page--home .services-app-nearby{
  min-width:0 !important;
  margin-top:0 !important;
}

.services-app-page--home .services-app-section-row{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin:0 0 10px !important;
}

.services-app-page--home .services-app-section-row b{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#080b10 !important;
  font-size:18px !important;
  font-weight:950 !important;
}

.services-app-page--home .services-app-section-row button{
  flex:0 0 auto !important;
  min-height:34px !important;
  padding:0 10px !important;
  border:1px solid #e7e8eb !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#111318 !important;
  font-size:12px !important;
  font-weight:900 !important;
}

/* Tablet layout */
@media (min-width:768px){
  .services-app-page--home{
    padding:clamp(18px,3vw,38px) clamp(18px,3vw,48px) calc(116px + env(safe-area-inset-bottom,0px)) !important;
  }

  .services-app-page--home .services-app-phone{
    min-height:640px !important;
  }

  .services-app-page--home .services-app-home-head{
    display:block !important;
  }

  .services-app-page--home .services-app-grid{
    gap:14px !important;
  }

  .services-app-page--home .services-app-grid .services-app-tile{
    border-radius:18px !important;
  }
}

/* Phone layout */
@media (max-width:767px){
  .services-app-page--home{
    padding:0 0 calc(90px + env(safe-area-inset-bottom,0px)) !important;
    background:#fff !important;
  }

  .services-app-page--home .services-app-phone{
    width:100% !important;
    min-height:100dvh !important;
    padding:16px 14px 22px !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  .services-app-page--home .services-app-logo-img{
    height:44px !important;
    max-width:170px !important;
  }

  .services-app-page--home .services-app-home-head h1{
    font-size:clamp(32px,9.5vw,42px) !important;
  }

  .services-app-page--home .services-app-grid{
    gap:9px !important;
  }

  .services-app-page--home .services-app-grid .services-app-tile{
    min-height:94px !important;
    padding:10px 6px !important;
  }
}

/* Very narrow phones */
@media (max-width:360px){
  .services-app-page--home .services-app-phone{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .services-app-page--home .services-app-search{
    grid-template-columns:36px minmax(0,1fr) 44px !important;
    height:46px !important;
  }

  .services-app-page--home .services-app-search > span,
  .services-app-page--home .services-app-search input,
  .services-app-page--home .services-app-search button{
    height:46px !important;
  }

  .services-app-page--home .services-app-search button{
    width:44px !important;
    min-width:44px !important;
  }

  .services-app-page--home .services-app-emergency-row{
    gap:7px !important;
  }

  .services-app-page--home .services-app-emergency-row button b{
    font-size:11px !important;
  }

  .services-app-page--home .services-app-grid{
    gap:7px !important;
  }

  .services-app-page--home .services-app-grid .services-app-tile{
    min-height:88px !important;
    border-radius:14px !important;
  }

  .services-app-page--home .services-app-grid .services-app-tile__label{
    font-size:10.5px !important;
  }
}

/* === SOURCE: css/services_home_polish_r62f.css === */
/* KARETA r62f — #services page polish.
   Scope: #services only. Builds on r62e.
   Goal: cleaner hero, stable search, stronger 3x3 grid, better buttons/adaptation. */

.services-app-page--home{
  --svc-r62f-bg:#eef0f2;
  --svc-r62f-card:#ffffff;
  --svc-r62f-soft:#f4f4f5;
  --svc-r62f-line:#e7e8eb;
  --svc-r62f-text:#080b10;
  --svc-r62f-muted:#6f747d;
  --svc-r62f-orange:#ffb000;
  --svc-r62f-orange2:#ff9800;
  --svc-r62f-shadow:0 18px 46px rgba(15,23,42,.085);
  background:
    radial-gradient(circle at 18% 0%, rgba(255,176,0,.11), transparent 28%),
    linear-gradient(180deg,#f3f4f6 0%, #eef0f2 100%) !important;
}

/* The page card should look intentional on tablet/desktop and clean on phone. */
.services-app-page--home .services-app-phone{
  position:relative !important;
  isolation:isolate !important;
}

.services-app-page--home .services-app-phone::before{
  content:'' !important;
  position:absolute !important;
  z-index:-1 !important;
  right:-80px !important;
  top:-100px !important;
  width:260px !important;
  height:260px !important;
  border-radius:50% !important;
  background:rgba(255,176,0,.10) !important;
  pointer-events:none !important;
}

/* Header */
.services-app-page--home .services-app-logo-img{
  height:clamp(50px,6vw,70px) !important;
  image-rendering:auto !important;
}

.services-app-page--home .services-app-icon-btn{
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease !important;
}

.services-app-page--home .services-app-icon-btn:active{
  transform:scale(.96) !important;
}

.services-app-page--home .services-app-home-head h1{
  max-width:680px !important;
  text-wrap:balance !important;
}

.services-app-page--home .services-app-hero-sub{
  max-width:520px !important;
  margin:12px 0 0 !important;
  color:var(--svc-r62f-muted) !important;
  font-size:clamp(14px,1.8vw,18px) !important;
  line-height:1.34 !important;
  font-weight:750 !important;
  letter-spacing:-.02em !important;
}

/* Search: visual polish and stronger focus state */
.services-app-page--home .services-app-search{
  position:relative !important;
  background:#fff !important;
  border-color:rgba(15,23,42,.07) !important;
  box-shadow:0 8px 24px rgba(15,23,42,.055) !important;
}

.services-app-page--home .services-app-search:focus-within{
  border-color:rgba(255,176,0,.72) !important;
  box-shadow:0 0 0 4px rgba(255,176,0,.14), 0 10px 26px rgba(15,23,42,.065) !important;
}

.services-app-page--home .services-app-search > span{
  color:#7b828d !important;
}

.services-app-page--home .services-app-search button{
  margin-right:0 !important;
  border-radius:14px !important;
  transition:transform .14s ease, filter .14s ease !important;
}

.services-app-page--home .services-app-search button:active{
  transform:scale(.96) !important;
  filter:saturate(1.08) !important;
}

/* Quick action buttons */
.services-app-page--home .services-app-emergency-row button{
  background:#fff !important;
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

.services-app-page--home .services-app-emergency-row button:hover{
  border-color:rgba(255,176,0,.32) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.065) !important;
}

.services-app-page--home .services-app-emergency-row button:active{
  transform:scale(.985) !important;
}

.services-app-page--home .services-app-emergency-row button:first-child{
  border-color:rgba(239,68,68,.18) !important;
}

.services-app-page--home .services-app-emergency-row button:first-child span{
  color:#ef4444 !important;
}

/* 9-tile grid: denser but readable */
.services-app-page--home .services-app-grid--r62f{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:clamp(8px,1.7vw,14px) !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile{
  border:1px solid rgba(15,23,42,.045) !important;
  background:linear-gradient(180deg,#fff,#f8f8f9) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.045) !important;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,176,0,.30) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.075) !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile:active{
  transform:scale(.985) !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile__icon{
  background:#fff !important;
  border:1px solid rgba(15,23,42,.045) !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile:nth-child(9){
  background:linear-gradient(180deg,#fff8df,#fff) !important;
  border-color:rgba(255,176,0,.34) !important;
}

.services-app-page--home .services-app-grid--r62f .services-app-tile:nth-child(9) .services-app-tile__icon{
  border:0 !important;
}

/* Nearby card improvement */
.services-app-page--home .services-app-shop-card{
  min-width:0 !important;
  width:100% !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:58px minmax(0,1fr) 30px !important;
  gap:12px !important;
  align-items:center !important;
  border:1px solid var(--svc-r62f-line) !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 10px 28px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
  text-align:left !important;
}

.services-app-page--home .services-app-shop-photo{
  width:58px !important;
  height:58px !important;
  border-radius:16px !important;
  background:
    linear-gradient(135deg,rgba(255,176,0,.95),rgba(255,152,0,.78)),
    #ffb000 !important;
  position:relative !important;
  overflow:hidden !important;
}

.services-app-page--home .services-app-shop-photo::after{
  content:'K' !important;
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#111 !important;
  font-weight:950 !important;
  font-size:22px !important;
  letter-spacing:-.06em !important;
}

.services-app-page--home .services-app-shop-body{
  min-width:0 !important;
  display:grid !important;
  gap:4px !important;
}

.services-app-page--home .services-app-shop-body strong{
  color:var(--svc-r62f-text) !important;
  font-size:16px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.services-app-page--home .services-app-shop-body em,
.services-app-page--home .services-app-shop-body small{
  min-width:0 !important;
  color:var(--svc-r62f-muted) !important;
  font-size:12px !important;
  line-height:1.18 !important;
  font-style:normal !important;
  font-weight:750 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.services-app-page--home .services-app-heart{
  width:30px !important;
  height:30px !important;
  border-radius:10px !important;
  background:#f4f4f5 !important;
  color:#111 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:18px !important;
}

/* Tablet wide: keep compact 3x3 and avoid text overflow */
@media (min-width:768px){
  .services-app-page--home .services-app-grid--r62f .services-app-tile{
    min-height:126px !important;
  }

  .services-app-page--home .services-app-search{
    max-width:560px !important;
  }
}

@media (min-width:1040px){
  .services-app-page--home .services-app-phone{
    max-width:1120px !important;
    padding:40px !important;
  }

  .services-app-page--home .services-app-home-head{
    margin-bottom:10px !important;
  }

  .services-app-page--home .services-app-grid--r62f{
    max-width:680px !important;
  }

  .services-app-page--home .services-app-nearby{
    max-width:680px !important;
  }
}

/* Phone: exact anti-overlap tuning */
@media (max-width:767px){
  .services-app-page--home .services-app-phone::before{
    display:none !important;
  }

  .services-app-page--home .services-app-hero-sub{
    font-size:14px !important;
    margin-top:10px !important;
  }

  .services-app-page--home .services-app-grid--r62f .services-app-tile{
    min-height:92px !important;
  }
}

@media (max-width:390px){
  .services-app-page--home .services-app-logo-img{
    height:40px !important;
    max-width:150px !important;
  }

  .services-app-page--home .services-app-home-head h1{
    font-size:31px !important;
  }

  .services-app-page--home .services-app-hero-sub{
    font-size:13px !important;
  }

  .services-app-page--home .services-app-grid--r62f{
    gap:7px !important;
  }

  .services-app-page--home .services-app-grid--r62f .services-app-tile{
    min-height:84px !important;
    padding:8px 4px !important;
  }

  .services-app-page--home .services-app-grid--r62f .services-app-tile__icon{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    min-height:34px !important;
    border-radius:12px !important;
  }

  .services-app-page--home .services-app-grid--r62f .services-app-tile__icon svg{
    width:19px !important;
    height:19px !important;
  }

  .services-app-page--home .services-app-grid--r62f .services-app-tile__label{
    font-size:10px !important;
  }
}

/* Hard guard scoped to services only */
.services-app-page--home :where(h1,p,span,b,strong,em,small,button,input,div){
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
}

/* === SOURCE: css/services_logo_image_r62g.css === */
/* KARETA r62g — visible logo image fix for #services.
   Scope: header logo only. */

.services-app-page--home .services-app-topline{
  min-height:64px !important;
  align-items:center !important;
}

.services-app-page--home .services-app-logo-img--full-r62g{
  display:block !important;
  width:auto !important;
  height:clamp(54px,7vw,78px) !important;
  max-width:min(280px,72vw) !important;
  object-fit:contain !important;
  object-position:left center !important;
  opacity:1 !important;
  visibility:visible !important;
  position:relative !important;
  z-index:2 !important;
  flex:0 1 auto !important;
}

.services-app-page--home .services-app-logo-img--fallback-r62g{
  height:clamp(48px,6vw,66px) !important;
  max-width:min(190px,56vw) !important;
  padding:6px !important;
  border-radius:18px !important;
  background:#fff3c7 !important;
  box-shadow:0 8px 22px rgba(255,176,0,.16) !important;
}

/* Old text logo must not appear under the image. */
.services-app-page--home .services-app-logo{
  display:none !important;
}

/* On narrow phones keep the logo visible and prevent overlap with notification button. */
@media (max-width:430px){
  .services-app-page--home .services-app-topline{
    min-height:54px !important;
    gap:8px !important;
  }

  .services-app-page--home .services-app-logo-img--full-r62g{
    height:46px !important;
    max-width:calc(100vw - 92px) !important;
  }

  .services-app-page--home .services-app-logo-img--fallback-r62g{
    height:42px !important;
    max-width:128px !important;
  }
}