/* ===== crm-compact-layout-fixes ===== */
    /* ===== Fixes: compact modal, aligned cards, non-overlapping labels ===== */
    .calendar-layout{
      grid-template-columns: minmax(0, 1fr) minmax(340px, 420px) !important;
      gap: 18px !important;
      align-items: start !important;
    }
    .panel.cal-panel,
    .orders-shell{
      min-width: 0;
    }
    .cal-panel .cal-grid{
      min-width: 0 !important;
      width: 100%;
    }
    .cal-panel .cal-day{
      min-height: 92px;
      padding: 10px 10px 38px;
    }
    .cal-panel .cal-day .mark{
      right: 8px;
      bottom: 8px;
      min-width: 38px;
      height: 24px;
      padding: 0 8px;
    }
    .orders-shell{
      min-height: 0 !important;
    }
    #orders{
      max-height: 640px;
    }

    /* order cards */
    .order{
      min-height: auto !important;
      padding: 16px 18px 58px !important;
      border-radius: 12px !important;
      overflow: visible;
    }
    .orders-shell #orders .order,
    .calendar-layout.no-calendar #orders .order{
      min-height: auto !important;
      padding: 16px 18px 58px !important;
      border-radius: 12px !important;
      border: 1px solid var(--line) !important;
      margin: 0 0 12px !important;
    }
    .order .row{
      margin: 0 0 8px !important;
      gap: 10px !important;
      align-items: center !important;
    }
    .order .row:first-child{
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      column-gap: 12px;
    }
    .order .row:nth-of-type(2){
      display: grid !important;
      grid-template-columns: minmax(220px, 1.3fr) minmax(120px, .7fr) minmax(140px, 1fr);
      gap: 10px 14px !important;
      align-items: center;
    }
    .order .row:nth-of-type(3){
      display: grid !important;
      grid-template-columns: repeat(2, minmax(220px, 1fr));
      gap: 8px 14px !important;
      align-items: center;
    }
    .order .row:nth-of-type(4){
      margin-bottom: 0 !important;
    }
    .card-actions{
      top: auto !important;
      bottom: 14px !important;
      right: 14px !important;
    }
    .dot-btn{
      width: 34px !important;
      height: 34px !important;
      border-radius: 10px !important;
    }
    .order .dropdown{
      top: auto !important;
      right: 14px !important;
      bottom: 54px !important;
      left: auto !important;
      width: 200px !important;
    }

    /* modal layout */
    .modal-backdrop{
      padding: 20px !important;
      box-sizing: border-box;
      align-items: flex-start !important;
      overflow: auto;
    }
    .modal{
      width: min(1080px, calc(100vw - 40px)) !important;
      max-height: calc(100vh - 40px) !important;
      overflow: auto !important;
      padding: 0 0 18px !important;
      margin: 0 auto;
      box-sizing: border-box;
    }
    .modal-header{
      margin: 0 0 18px !important;
      padding: 0 24px;
      min-height: 74px;
    }
    #modal-body,
    #create-body,
    #day-orders-body,
    #detail-body,
    .modal-body{
      padding: 0 24px 6px !important;
    }
    .modal form{
      overflow: hidden;
    }
    .modal .section{
      margin: 14px 0 10px !important;
      font-size: 18px;
      font-weight: 700;
    }
    .modal .grid2{
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 10px 14px !important;
    }
    .modal .field{
      margin: 0 0 10px !important;
      min-width: 0;
    }
    .modal .field > label.mini{
      position: static !important;
      display: block !important;
      width: auto !important;
      height: auto !important;
      margin: 0 0 6px !important;
      padding: 0 !important;
      background: transparent !important;
      color: #666 !important;
      opacity: 1 !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      top: auto !important;
      right: auto !important;
      left: auto !important;
      font-size: 12px !important;
      line-height: 1.2 !important;
      z-index: auto !important;
    }
    .modal input,
    .modal select,
    .modal textarea{
      min-width: 0 !important;
      width: 100% !important;
      padding: 10px 12px !important;
      border-radius: 10px !important;
    }
    .modal textarea{
      min-height: 76px;
      resize: vertical;
    }
    .modal .list{
      width: 100% !important;
      margin: 0 !important;
      padding: 10px !important;
      border: 1px solid #e7e7eb !important;
      border-radius: 10px !important;
      background: #fff !important;
      min-height: 46px;
    }
    .modal .row-end{
      margin-top: 10px !important;
      gap: 10px !important;
      flex-wrap: wrap;
    }
    .modal .btn,
    .modal button.btn{
      height: 42px !important;
      padding: 0 14px !important;
    }

    /* detail modal blocks */
    .modal .kv{
      grid-template-columns: 150px 1fr !important;
      gap: 6px 12px !important;
    }
    .modal .list .svc,
    .modal .svc{
      grid-template-columns: minmax(0, 1fr) auto !important;
    }

    /* responsive cleanups */
    @media (max-width: 1500px){
      .calendar-layout{
        grid-template-columns: 1fr !important;
      }
      #orders{
        max-height: none !important;
      }
    }
    @media (max-width: 900px){
      .modal{
        width: min(100vw - 24px, 960px) !important;
        max-height: calc(100vh - 24px) !important;
      }
      .modal-header,
      #modal-body,
      #create-body,
      #day-orders-body,
      #detail-body,
      .modal-body{
        padding-left: 16px !important;
        padding-right: 16px !important;
      }
      .modal .grid2,
      .order .row:nth-of-type(2),
      .order .row:nth-of-type(3){
        grid-template-columns: 1fr !important;
      }
    }

/* ===== crm-scale-font-fixes ===== */
    html, body,
    button, input, select, textarea {
      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif !important;
    }

    /* Slightly more compact overall scale to mimic pleasant ~75-85% browser zoom */
    .top { min-height: 64px !important; height: 64px !important; padding: 0 24px !important; gap: 20px !important; }
    .search input { height: 46px !important; }
    .head { padding: 18px 24px 10px !important; }
    h1 { font-size: 26px !important; margin-bottom: 18px !important; }
    .tab, .act { height: 40px !important; font-size: 15px !important; padding: 0 14px !important; }
    .chip { height: 30px !important; font-size: 13px !important; padding: 0 12px !important; }
    .filters { padding: 18px 24px 12px !important; }
    .view, #details-view, #monthly-view { padding-left: 24px !important; padding-right: 24px !important; }
    .side.open { width: 230px !important; }
    .brand { height: 64px !important; }
    .nav button { height: 52px !important; font-size: 15px !important; }

    /* Calendar: keep car badge inside day cell */
    .cal-panel { padding: 20px 24px 24px !important; }
    .cal-panel .cal-head { margin: 24px 0 18px !important; gap: 10px !important; }
    .cal-panel .month, .cal-title { font-size: 18px !important; }
    .cal-panel .cal-btn, .small { height: 34px !important; min-width: 46px !important; padding: 0 12px !important; }
    .cal-panel .cal-day {
      min-height: 98px !important;
      padding: 10px 8px 34px !important;
      overflow: hidden !important;
    }
    .cal-panel .cal-day .mark {
      right: 6px !important;
      bottom: 6px !important;
      min-width: 34px !important;
      max-width: calc(100% - 12px) !important;
      height: 22px !important;
      padding: 0 7px !important;
      gap: 4px !important;
      overflow: hidden !important;
      font-size: 0 !important;
      line-height: 1 !important;
      border-radius: 999px !important;
      white-space: nowrap !important;
    }
    .cal-panel .cal-day .mark:before { font-size: 12px !important; }
    .cal-panel .cal-day .cnt { font-size: 12px !important; line-height: 1 !important; }

    /* Right panel orders and cards */
    .orders-title h2 { font-size: 22px !important; }
    #orders { max-height: 600px !important; }
    .orders-shell #orders .order,
    .calendar-layout.no-calendar #orders .order {
      padding: 14px 16px 52px !important;
    }
    .order .row { font-size: 15px !important; }
    .order .sum { font-size: 17px !important; }
    .order .pill { font-size: 13px !important; }
    .card-actions { bottom: 12px !important; right: 12px !important; }
    .order .dropdown { bottom: 50px !important; right: 12px !important; }

    /* Fix floating stray 'mini' labels inside dynamic service/editor rows */
    .modal .svc,
    .modal .exec,
    .modal [id$="List"] > .svc,
    .modal [id$="List"] > .execbox {
      min-width: 0;
      align-items: start;
    }
    .modal .svc > div:first-child,
    .modal .exec > div:first-child {
      min-width: 0;
    }
    .modal .svc .mini,
    .modal .exec .mini,
    .modal .list .mini,
    .modal .grid2 .mini,
    .modal .box .mini {
      position: static !important;
      display: block !important;
      width: auto !important;
      height: auto !important;
      margin: 0 0 6px !important;
      padding: 0 !important;
      background: transparent !important;
      color: #666 !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      font-size: 12px !important;
      line-height: 1.2 !important;
      white-space: normal !important;
      top: auto !important;
      right: auto !important;
      left: auto !important;
      z-index: auto !important;
    }
    .modal .svc .grid2,
    .modal .exec .grid2 {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 10px 14px !important;
      min-width: 0;
    }
    .modal .svc textarea,
    .modal .exec textarea,
    .modal .svc select,
    .modal .svc input,
    .modal .exec select,
    .modal .exec input {
      width: 100% !important;
      min-width: 0 !important;
    }
    .modal .svc .btn,
    .modal .exec .btn {
      min-width: 42px !important;
      width: 42px !important;
      padding: 0 !important;
    }

    /* Keep modal compact and avoid weird overflow */
    .modal { width: min(1120px, calc(100vw - 36px)) !important; max-height: calc(100vh - 36px) !important; }
    .modal-header { min-height: 68px !important; }
    .modal-title { font-size: 20px !important; }
    #modal-body, #create-body, #day-orders-body, #detail-body, .modal-body { padding: 0 22px 6px !important; }
    .modal .section { font-size: 16px !important; margin: 12px 0 8px !important; }
    .modal input, .modal select, .modal textarea { padding: 9px 12px !important; }
    .modal .btn, .modal button.btn { height: 40px !important; }

    @media (max-width: 900px) {
      .modal .svc .grid2,
      .modal .exec .grid2,
      .modal .grid2,
      .order .row:nth-of-type(2),
      .order .row:nth-of-type(3) {
        grid-template-columns: 1fr !important;
      }
    }

/* ===== crm-work-deleted-layout-fixes ===== */
    /* Fix overflow in "В работе" and "Удаленные" states */
    .preview-content {
      overflow-x: hidden !important;
    }
    .calendar-layout.no-calendar {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
    }
    .calendar-layout.no-calendar .orders-shell {
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      min-width: 0 !important;
      border: 0 !important;
      background: transparent !important;
      overflow: visible !important;
    }
    .calendar-layout.no-calendar #orders {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
      overflow-y: visible !important;
      background: transparent !important;
    }
    .calendar-layout.no-calendar #orders .order {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }
    .calendar-layout.no-calendar #orders .order .row:first-child,
    .calendar-layout.no-calendar #orders .order .row:nth-of-type(2),
    .calendar-layout.no-calendar #orders .order .row:nth-of-type(3) {
      width: 100% !important;
      min-width: 0 !important;
    }
    .calendar-layout.no-calendar #orders .order .row:nth-of-type(2) {
      grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr) minmax(0, 1fr) !important;
    }
    .calendar-layout.no-calendar #orders .order .row:nth-of-type(3) {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .calendar-layout.no-calendar #orders .order .row > div {
      min-width: 0 !important;
    }
    @media (max-width: 1200px) {
      .calendar-layout.no-calendar #orders .order .row:nth-of-type(2),
      .calendar-layout.no-calendar #orders .order .row:nth-of-type(3) {
        grid-template-columns: 1fr !important;
      }
    }

/* ===== crm-order-card-redesign ===== */
    .order {
      position: relative !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      padding: 16px 18px 18px !important;
      border: 1px solid #e8e8ec !important;
      border-radius: 0 !important;
      background: #fff !important;
      overflow: hidden !important;
    }
    .orders-shell #orders .order,
    .calendar-layout.no-calendar #orders .order {
      padding: 16px 18px 18px !important;
      border: 1px solid #e8e8ec !important;
      border-radius: 0 !important;
      margin: 0 0 12px !important;
      background: #fff !important;
    }
    .order-card-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 18px;
    }
    .order-card-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }
    .order-chip {
      height: 28px;
      padding: 0 10px;
      display: inline-flex;
      align-items: center;
      border-radius: 6px;
      font-size: 13px;
      line-height: 1;
      white-space: nowrap;
      background: #f3f3f5;
      color: #6b6b73;
    }
    .order-chip.status-scheduled { background: #efffe2; color: #6ecb2f; }
    .order-chip.status-in_work { background: #f3f3f5; color: #6b6b73; }
    .order-chip.status-completed { background: #eef4ff; color: #4567ff; }
    .order-chip.status-deleted { background: #fff1f8; color: #ef5c9a; }
    .order-head-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      flex: 0 0 auto;
    }
    .card-actions {
      position: static !important;
      margin: 0 !important;
    }
    .dot-btn {
      width: 28px !important;
      height: 28px !important;
      min-width: 28px !important;
      border-radius: 6px !important;
      background: #fff !important;
      border: 1px solid #e8e8ec !important;
      box-shadow: none !important;
    }
    .dot-btn:after { content: '•••' !important; font-size: 12px !important; letter-spacing: 1px; }
    .order .dropdown {
      top: 34px !important;
      right: 0 !important;
      bottom: auto !important;
      width: 190px !important;
    }
    .order-main {
      min-width: 0;
    }
    .order-title {
      margin: 0 0 12px;
      font-size: 18px;
      line-height: 1.25;
      font-weight: 700;
      color: #141414;
    }
    .order-meta-line {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 18px;
      margin-bottom: 18px;
      color: #5d5d63;
      font-size: 14px;
    }
    .order-meta-item {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      white-space: nowrap;
    }
    .order-icon {
      width: 18px;
      height: 18px;
      color: #111;
      flex: 0 0 auto;
    }
    .order-icon svg {
      width: 100%;
      height: 100%;
      display: block;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.9;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .order-sum-line {
      font-size: 16px;
      color: #141414;
    }
    .order-sum-line .sum {
      font-size: 18px !important;
      font-weight: 800 !important;
      color: #111;
    }
    .order .row { display: block !important; margin: 0 !important; }
    .order .row + .row { margin-top: 0 !important; }
    @media (max-width: 900px) {
      .order-card-top { align-items: flex-start; }
      .order-meta-line { gap: 12px; }
      .order-title { font-size: 17px; }
    }

/* ===== crm-order-card-polish-v5 ===== */
    /* Outer order card styling to match the reference */
    .orders-shell #orders .order,
    .calendar-layout.no-calendar #orders .order {
      position: relative !important;
      padding: 12px 12px 14px !important;
      border: 1px solid #e9e9ee !important;
      border-radius: 0 !important;
      background: #fff !important;
      box-shadow: none !important;
      overflow: visible !important;
    }
    .order-card-top {
      margin-bottom: 22px !important;
      align-items: center !important;
      gap: 10px !important;
    }
    .order-card-badges {
      gap: 6px !important;
    }
    .order-chip {
      height: 24px !important;
      padding: 0 9px !important;
      border-radius: 4px !important;
      font-size: 12px !important;
      font-weight: 500 !important;
      color: #8d8d97 !important;
      background: #f5f5f7 !important;
    }
    .order-chip.status-deleted {
      background: #fff2f8 !important;
      color: #ef5c9a !important;
    }
    .order-chip.status-scheduled {
      background: #f2f7eb !important;
      color: #75b846 !important;
    }
    .order-chip.status-completed {
      background: #eef4ff !important;
      color: #4567ff !important;
    }
    .order-chip.status-in_work {
      background: #f3f3f5 !important;
      color: #7b7b84 !important;
    }
    .order-head-actions,
    .card-actions {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
    }
    .dot-btn {
      width: 28px !important;
      height: 28px !important;
      min-width: 28px !important;
      padding: 0 !important;
      border-radius: 6px !important;
      border: 1px solid #ececf0 !important;
      background: #fff !important;
      appearance: none !important;
    }
    .dot-btn:before { content: none !important; }
    .dot-btn:after {
      content: '•••' !important;
      font-size: 12px !important;
      line-height: 1 !important;
      letter-spacing: 1px !important;
      color: #111 !important;
      transform: none !important;
    }
    .order .dropdown {
      top: 32px !important;
      right: 0 !important;
      bottom: auto !important;
      left: auto !important;
      width: 180px !important;
    }
    .order-main {
      min-width: 0 !important;
    }
    .order-title {
      margin: 0 0 12px !important;
      font-size: 18px !important;
      line-height: 1.3 !important;
      font-weight: 700 !important;
      color: #111 !important;
    }
    .order-meta-line {
      display: flex !important;
      flex-wrap: wrap !important;
      align-items: center !important;
      gap: 18px !important;
      margin-bottom: 18px !important;
      color: #6d6d75 !important;
      font-size: 14px !important;
    }
    .order-meta-item {
      gap: 7px !important;
      color: inherit !important;
    }
    .order-icon {
      width: 18px !important;
      height: 18px !important;
      color: #111 !important;
    }
    .order-icon svg {
      stroke-width: 1.85 !important;
    }
    .order-sum-line {
      font-size: 16px !important;
      color: #111 !important;
    }
    .order-sum-line b {
      font-weight: 700 !important;
    }
    .order-sum-line .sum {
      font-size: 16px !important;
      font-weight: 800 !important;
    }
    @media (max-width: 900px) {
      .order-card-top {
        align-items: flex-start !important;
      }
      .order-meta-line {
        gap: 12px !important;
      }
    }

/* ===== crm-final-redesign-patches ===== */
  /* ===== Final redesign patches: inline expand, calendar badge, menu actions, card accent color ===== */

  .order {
    --order-accent: transparent;
  }
  .orders-shell #orders .order.has-accent,
  .calendar-layout.no-calendar #orders .order.has-accent {
    border-left-width: 4px !important;
    border-left-style: solid !important;
    border-left-color: var(--order-accent) !important;
  }

  .order-head-actions {
    gap: 6px !important;
    position: relative !important;
  }

  .order-expand-btn,
  .dot-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid #ececf0 !important;
    background: #fff !important;
    display: inline-grid !important;
    place-items: center !important;
    box-shadow: none !important;
  }

  .order-expand-btn img {
    width: 13px;
    height: 8px;
    display: block;
    transform: rotate(180deg);
    transition: transform .16s ease;
  }
  .order.is-expanded .order-expand-btn img {
    transform: rotate(0deg);
  }

  .order .dropdown {
    padding: 6px 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.12) !important;
  }
  .order .dropdown a,
  .order .dropdown .dropdown-action {
    height: 43px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    color: #7a7a82 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    background: #fff !important;
    border: 0 !important;
    width: 100% !important;
    text-align: left !important;
    cursor: pointer !important;
  }
  .order .dropdown a:hover,
  .order .dropdown .dropdown-action:hover {
    background: #f7f7f7 !important;
    color: #111 !important;
  }
  .dropdown-action-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex: 0 0 auto;
  }
  .dropdown-color-block {
    padding: 8px 14px 10px;
    color: #8a8a92;
    font-size: 13px;
  }
  .dropdown-color-title {
    margin-bottom: 8px;
  }
  .dropdown-colors {
    display: flex;
    align-items: center;
    gap: 9px;
  }
  .dropdown-color-dot {
    width: 13px;
    height: 13px;
    border-radius: 999px;
    border: 1px solid #e6e6e6;
    background: #fff;
    padding: 0;
    cursor: pointer;
  }
  .dropdown-color-dot.is-selected {
    outline: 2px solid #d7d7dc;
    outline-offset: 2px;
  }

  .order-expanded {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #f0f0f2;
    cursor: default;
  }
  .order-expanded.loading,
  .order-expanded.error {
    color: #777;
    font-size: 14px;
  }
  .order-expanded.error {
    color: #b00020;
  }
  .expanded-title {
    margin: 0 0 18px;
    font-size: 18px;
    font-weight: 800;
  }
  .expanded-section {
    margin-top: 20px;
  }
  .expanded-section:first-child {
    margin-top: 0;
  }
  .expanded-section-title {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 800;
    color: #222;
  }
  .expanded-kv {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 8px 14px;
    max-width: 620px;
    font-size: 14px;
    line-height: 1.35;
  }
  .expanded-k {
    color: #73737a;
  }
  .expanded-v {
    min-width: 0;
    color: #151515;
  }
  .expanded-contact {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #35a9e1;
    color: #fff;
    font-weight: 800;
    font-size: 13px;
  }
  .expanded-services {
    width: min(735px, 100%);
    border: 1px solid #ececf0;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
  }
  .expanded-service {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid #f2f2f4;
    font-size: 14px;
    align-items: start;
  }
  .expanded-service:last-child {
    border-bottom: 0;
  }
  .expanded-service-dot {
    width: 7px;
    height: 7px;
    margin-top: 7px;
    border-radius: 999px;
    background: #f23d85;
    justify-self: center;
  }
  .expanded-service:nth-child(3n+1) .expanded-service-dot { background: #6be12c; }
  .expanded-service:nth-child(3n+2) .expanded-service-dot { background: #f23d85; }
  .expanded-service:nth-child(3n) .expanded-service-dot { background: #39a5ff; }
  .expanded-service-name {
    font-weight: 700;
  }
  .expanded-service-note {
    color: #777;
    font-size: 13px;
    margin-top: 4px;
  }
  .expanded-service-price {
    font-weight: 800;
    white-space: nowrap;
  }
  .expanded-empty {
    color: #777;
    padding: 10px 12px;
    font-size: 14px;
  }
  .expanded-executors {
    width: min(735px, 100%);
    min-height: 30px;
    display: flex;
    align-items: center;
    border: 1px solid #ececf0;
    border-radius: 5px;
    padding: 4px 12px;
    color: #222;
    font-size: 14px;
  }

  /* Calendar reference look */
  .cal-panel .cal-day {
    padding: 10px 12px 34px !important;
  }
  .cal-day-num {
    position: absolute;
    right: 12px;
    top: 10px;
    font-weight: 500;
  }
  .cal-day-num.free {
    color: #5acb2d;
  }
  .cal-day-num.busy {
    color: #f23d85;
  }
  .cal-day-num.other {
    color: #777;
  }
  .cal-panel .cal-day .mark {
    position: absolute !important;
    right: 13px !important;
    bottom: 18px !important;
    min-width: 48px !important;
    height: 29px !important;
    border: 1px solid #dddddf !important;
    border-radius: 999px !important;
    background: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 9px !important;
    color: #666 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
  }
  .cal-panel .cal-day .mark:before {
    content: none !important;
  }
  .cal-panel .cal-day .mark img {
    width: 16px;
    height: 17px;
    object-fit: contain;
    display: block;
  }
  .cal-panel .cal-day .mark .cnt {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #666 !important;
    line-height: 1 !important;
  }
  .cal-panel .cal-day .mark.ok {
    display: none !important;
  }
  .cal-panel .cal-day.mute .mark {
    opacity: .45;
  }

  @media (max-width: 900px) {
    .expanded-kv {
      grid-template-columns: 110px minmax(0, 1fr);
    }
    .expanded-service {
      grid-template-columns: 22px minmax(0, 1fr);
    }
    .expanded-service-price {
      grid-column: 2;
    }
  }

/* ===== crm-mobile-scheduled-v1 ===== */
  /* ===== Mobile: scheduled calendar + orders like Telegram mockup ===== */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    html,
    body {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
      background: #fff !important;
      color: #111 !important;
      -webkit-text-size-adjust: 100%;
    }

    body:not(.locked) .app {
      display: block !important;
      min-height: 100vh !important;
      width: 100% !important;
    }

    .side {
      display: none !important;
    }

    .main {
      width: 100% !important;
      min-width: 0 !important;
    }

    /* App header under Telegram native bar */
    .top {
      height: 44px !important;
      min-height: 44px !important;
      display: grid !important;
      grid-template-columns: 42px minmax(0, 1fr) 42px !important;
      align-items: center !important;
      gap: 0 !important;
      padding: 0 14px !important;
      border-bottom: 1px solid #ececf0 !important;
      background: #fff !important;
    }

    .burger {
      grid-column: 1 !important;
      width: 28px !important;
      height: 44px !important;
      padding: 0 !important;
      gap: 6px !important;
      justify-content: center !important;
      align-items: flex-start !important;
      border: 0 !important;
      background: transparent !important;
    }

    .burger span {
      width: 22px !important;
      height: 1.5px !important;
      background: #111 !important;
    }

    .branch,
    .search {
      display: none !important;
    }

    .date {
      display: block !important;
      grid-column: 2 !important;
      text-align: center !important;
      font-size: 12px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      color: #111 !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    .user {
      display: flex !important;
      grid-column: 3 !important;
      justify-self: end !important;
      align-items: center !important;
      gap: 4px !important;
      min-width: 0 !important;
    }

    .user > span:not(.ava),
    .user .chev {
      display: none !important;
    }

    .ava {
      width: 24px !important;
      height: 24px !important;
      font-size: 12px !important;
      line-height: 1 !important;
    }

    /* Title, tabs and action buttons */
    .head {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      gap: 12px 8px !important;
      align-items: start !important;
      padding: 18px 14px 10px !important;
      border-bottom: 0 !important;
      background: #fff !important;
    }

    .head > div:first-child {
      display: contents !important;
    }

    .head h1 {
      grid-column: 1 !important;
      margin: 0 !important;
      font-size: 20px !important;
      line-height: 1.1 !important;
      letter-spacing: -0.02em !important;
      font-weight: 900 !important;
    }

    .actions {
      grid-column: 2 !important;
      grid-row: 1 !important;
      display: flex !important;
      flex-wrap: nowrap !important;
      gap: 6px !important;
      justify-content: flex-end !important;
      align-items: center !important;
      margin: 0 !important;
    }

    #changeStudioBtn,
    #detailsModeWrap {
      display: none !important;
    }

    .act {
      width: 30px !important;
      height: 30px !important;
      min-width: 30px !important;
      padding: 0 !important;
      border-radius: 6px !important;
      border: 1px solid #e8e8ec !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 0 !important;
      display: inline-grid !important;
      place-items: center !important;
      line-height: 1 !important;
    }

    #filterBtn::before {
      content: "☷";
      font-size: 16px;
      line-height: 1;
      color: #111;
    }

    #reloadBtn::before {
      content: "↻";
      font-size: 18px;
      line-height: 1;
      color: #111;
    }

    #btnAdd {
      background: #000 !important;
      border-color: #000 !important;
    }

    #btnAdd::before {
      content: "+";
      font-size: 22px;
      line-height: .8;
      font-weight: 500;
      color: #fff;
      transform: translateY(-1px);
    }

    .tabs {
      grid-column: 1 / -1 !important;
      display: flex !important;
      flex-wrap: nowrap !important;
      gap: 5px !important;
      overflow-x: auto !important;
      -webkit-overflow-scrolling: touch !important;
      scrollbar-width: none !important;
      padding: 2px 0 0 !important;
      margin: 0 !important;
    }

    .tabs::-webkit-scrollbar {
      display: none !important;
    }

    .tab {
      flex: 0 0 auto !important;
      height: 30px !important;
      padding: 0 10px !important;
      border-radius: 5px !important;
      font-size: 13px !important;
      line-height: 1 !important;
      color: #777 !important;
      background: #fff !important;
      border: 1px solid #e7e7eb !important;
    }

    .tab.active {
      color: #fff !important;
      background: #202020 !important;
      border-color: #202020 !important;
    }

    .filters {
      display: block !important;
      padding: 8px 14px 14px !important;
      border-bottom: 0 !important;
    }

    #status.found,
    .found {
      font-size: 12px !important;
      line-height: 1.25 !important;
      color: #777 !important;
      margin: 0 !important;
    }

    .preview-content {
      width: 100% !important;
      max-width: 100% !important;
      padding: 0 14px 28px !important;
      overflow-x: hidden !important;
    }

    .calendar-layout,
    #crmLayout:not(.no-calendar),
    #crmLayout {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
    }

    /* Calendar block */
    #calendarWrap.panel.cal-panel,
    .panel.cal-panel {
      position: relative !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      border: 0 !important;
      background: #fff !important;
      overflow: visible !important;
    }

    .cal-panel h2 {
      margin: 0 0 18px !important;
      font-size: 17px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
      letter-spacing: -0.02em !important;
    }

    .cal-panel .cal-head {
      display: grid !important;
      grid-template-columns: 31px minmax(0, 1fr) 31px !important;
      gap: 9px !important;
      align-items: center !important;
      width: 100% !important;
      margin: 0 0 10px !important;
    }

    .cal-panel .cal-nav {
      display: contents !important;
    }

    .cal-panel #calPrev {
      grid-column: 1 !important;
    }

    .cal-panel #calTitle {
      grid-column: 2 !important;
      text-align: center !important;
      font-size: 16px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
      color: #111 !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    .cal-panel #calNext {
      grid-column: 3 !important;
    }

    .cal-panel #calPrev,
    .cal-panel #calNext {
      width: 31px !important;
      min-width: 31px !important;
      height: 29px !important;
      padding: 0 !important;
      border: 1px solid #ececf0 !important;
      border-radius: 5px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 18px !important;
      line-height: 1 !important;
      display: inline-grid !important;
      place-items: center !important;
    }

    .cal-panel #calToday {
      position: absolute !important;
      top: 0 !important;
      right: 0 !important;
      width: auto !important;
      min-width: 54px !important;
      height: 25px !important;
      padding: 0 9px !important;
      border: 1px solid #f0f0f2 !important;
      border-radius: 5px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 12px !important;
      line-height: 1 !important;
      display: inline-grid !important;
      place-items: center !important;
    }

    .cal-panel #calToggle,
    .cal-panel .cal-legend {
      display: none !important;
    }

    .cal-panel .cal-grid {
      display: grid !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      gap: 0 !important;
      min-width: 0 !important;
      width: 100% !important;
      max-width: 100% !important;
    }

    .cal-panel .cal-wd {
      height: 33px !important;
      display: grid !important;
      place-items: center !important;
      background: #fafafa !important;
      border-right: 1px solid #f1f1f3 !important;
      border-top: 1px solid #f1f1f3 !important;
      color: #111 !important;
      font-size: 11px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      text-transform: uppercase !important;
      opacity: 1 !important;
    }

    .cal-panel .cal-wd:first-child {
      border-left: 1px solid #f1f1f3 !important;
    }

    .cal-panel .cal-day {
      min-height: 58px !important;
      height: 58px !important;
      padding: 6px 4px 24px !important;
      border: 0 !important;
      border-top: 1px solid #f1f1f3 !important;
      border-right: 1px solid #f1f1f3 !important;
      border-radius: 0 !important;
      background: #fff !important;
      overflow: hidden !important;
      box-shadow: none !important;
    }

    .cal-panel .cal-day:nth-child(7n+1) {
      border-left: 1px solid #f1f1f3 !important;
    }

    .cal-panel .cal-day:nth-last-child(-n+7) {
      border-bottom: 1px solid #f1f1f3 !important;
    }

    .cal-panel .cal-day.sel {
      background: #f7f7f7 !important;
      box-shadow: inset 0 0 0 1px #d7d7dc !important;
    }

    .cal-panel .cal-day.mute {
      opacity: 1 !important;
      background: #fff !important;
    }

    .cal-day-num {
      position: absolute !important;
      right: 8px !important;
      top: 10px !important;
      font-size: 12px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
    }

    .cal-day-num.free {
      color: #5acb2d !important;
    }

    .cal-day-num.busy {
      color: #f23d85 !important;
    }

    .cal-day-num.other {
      color: #777 !important;
    }

    .cal-panel .cal-day .mark {
      left: 50% !important;
      right: auto !important;
      bottom: 6px !important;
      transform: translateX(-50%) !important;
      min-width: 31px !important;
      max-width: calc(100% - 6px) !important;
      height: 19px !important;
      padding: 0 5px !important;
      gap: 3px !important;
      border: 1px solid #dddddf !important;
      border-radius: 999px !important;
      background: #fff !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      white-space: nowrap !important;
      font-size: 12px !important;
      line-height: 1 !important;
      color: #666 !important;
      overflow: hidden !important;
    }

    .cal-panel .cal-day .mark img {
      width: 13px !important;
      height: 14px !important;
      min-width: 13px !important;
      object-fit: contain !important;
      display: block !important;
    }

    .cal-panel .cal-day .mark .cnt {
      font-size: 12px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      color: #666 !important;
      margin: 0 !important;
    }

    /* Orders block below calendar */
    .orders-shell {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      min-height: 0 !important;
      margin: 14px 0 0 !important;
      padding: 0 !important;
      border: 0 !important;
      background: #fff !important;
      overflow: visible !important;
    }

    .orders-title {
      display: block !important;
      padding: 0 !important;
      margin: 0 0 9px !important;
      border: 0 !important;
    }

    .orders-title h2,
    .orders-title #ordersTitle {
      margin: 0 !important;
      font-size: 17px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
      letter-spacing: -0.02em !important;
    }

    .orders-date-line {
      margin-top: 16px !important;
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
      font-size: 15px !important;
      line-height: 1.2 !important;
      font-weight: 800 !important;
      color: #111 !important;
    }

    .orders-date-car-badge {
      min-width: 37px !important;
      height: 24px !important;
      padding: 0 7px !important;
      gap: 4px !important;
      border-radius: 999px !important;
      font-size: 12px !important;
      font-weight: 500 !important;
    }

    .orders-date-car-badge img {
      width: 14px !important;
      height: 15px !important;
    }

    #orders {
      width: 100% !important;
      max-width: 100% !important;
      min-height: 76px !important;
      max-height: none !important;
      overflow: visible !important;
      padding: 0 !important;
      margin: 0 !important;
      background: #fff !important;
    }

    body.mobile-calendar-mode:not(.mobile-date-picked) .orders-date-line {
      display: none !important;
    }

    body.mobile-calendar-mode:not(.mobile-date-picked) #orders > * {
      display: none !important;
    }

    body.mobile-calendar-mode:not(.mobile-date-picked) #orders::before {
      content: "Выберите день для просмотра заказов";
      display: block;
      padding: 25px 0 22px;
      text-align: center;
      color: #777;
      font-size: 13px;
      line-height: 1.25;
      font-weight: 500;
    }

    .orders-shell #orders .order,
    .calendar-layout.no-calendar #orders .order,
    #orders .order {
      width: 100% !important;
      max-width: 100% !important;
      min-height: 0 !important;
      margin: 0 !important;
      padding: 14px 0 14px !important;
      border: 0 !important;
      border-top: 1px solid #ececf0 !important;
      border-radius: 0 !important;
      background: #fff !important;
      box-shadow: none !important;
      overflow: visible !important;
    }

    #orders .order:last-child {
      border-bottom: 1px solid #ececf0 !important;
    }

    .order-card-top {
      margin: 0 0 14px !important;
      align-items: center !important;
      gap: 8px !important;
    }

    .order-card-badges {
      min-width: 0 !important;
      gap: 5px !important;
    }

    .order-chip {
      height: 23px !important;
      padding: 0 8px !important;
      border-radius: 5px !important;
      font-size: 12px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
    }

    .order-head-actions {
      flex: 0 0 auto !important;
      gap: 6px !important;
    }

    .order-expand-btn,
    .dot-btn {
      width: 29px !important;
      height: 29px !important;
      min-width: 29px !important;
      border-radius: 6px !important;
    }

    .order-title {
      margin: 0 0 12px !important;
      font-size: 15px !important;
      line-height: 1.25 !important;
      font-weight: 800 !important;
      color: #111 !important;
    }

    .order-meta-line {
      display: flex !important;
      flex-wrap: wrap !important;
      align-items: center !important;
      gap: 8px 12px !important;
      margin: 0 0 12px !important;
      font-size: 13px !important;
      line-height: 1.2 !important;
      color: #666 !important;
    }

    .order-meta-item {
      gap: 5px !important;
      white-space: nowrap !important;
    }

    .order-icon {
      width: 16px !important;
      height: 16px !important;
    }

    .order-sum-line {
      font-size: 14px !important;
      line-height: 1.25 !important;
      color: #111 !important;
    }

    .order-sum-line .sum {
      font-size: 14px !important;
      font-weight: 900 !important;
    }

    .order .dropdown {
      top: 36px !important;
      right: 0 !important;
      bottom: auto !important;
      width: 190px !important;
      z-index: 30 !important;
    }

    .order-expanded {
      margin-top: 14px !important;
      padding-top: 14px !important;
    }

    .expanded-title {
      font-size: 16px !important;
      margin-bottom: 16px !important;
    }

    .expanded-section {
      margin-top: 18px !important;
    }

    .expanded-kv {
      grid-template-columns: 104px minmax(0, 1fr) !important;
      gap: 7px 10px !important;
      font-size: 13px !important;
    }

    .expanded-services,
    .expanded-executors {
      width: 100% !important;
    }

    .expanded-service {
      grid-template-columns: 20px minmax(0, 1fr) !important;
      padding: 9px 10px !important;
      font-size: 13px !important;
    }

    .expanded-service-price {
      grid-column: 2 !important;
      margin-top: 2px !important;
    }
  }

  @media (max-width: 374px) {
    .order-meta-line {
      font-size: 12px !important;
      gap: 7px !important;
    }

    .tab {
      font-size: 12px !important;
      padding: 0 8px !important;
    }

    .cal-day-num {
      right: 6px !important;
    }

    .cal-panel .cal-day .mark {
      min-width: 29px !important;
      padding: 0 4px !important;
    }
  }

/* ===== crm-mobile-calendar-v2-fix ===== */
  /*
    Mobile calendar v2.
    Нужно, потому что на iPhone/Safari viewport иногда шире 640 CSS px,
    из-за чего старый mobile-patch не включался и календарь оставался desktop/min-width.
  */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    html,
    body {
      overflow-x: hidden !important;
    }

    .preview-content,
    #crmLayout,
    #calendarWrap,
    .cal-panel,
    .orders-shell {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    #crmLayout,
    #crmLayout:not(.no-calendar),
    .calendar-layout {
      display: block !important;
      grid-template-columns: none !important;
    }

    /* Calendar must always fit 7 columns into the phone width */
    .cal-panel .cal-grid,
    #calWeekdays,
    #calDays {
      display: grid !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      width: 100% !important;
      min-width: 0 !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    .cal-panel .cal-wd {
      width: auto !important;
      min-width: 0 !important;
      height: 31px !important;
      padding: 0 !important;
      font-size: 10px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      border-top: 1px solid #f1f1f3 !important;
      border-right: 1px solid #f1f1f3 !important;
      background: #fafafa !important;
    }

    .cal-panel .cal-wd:first-child {
      border-left: 1px solid #f1f1f3 !important;
    }

    .cal-panel .cal-day {
      width: auto !important;
      min-width: 0 !important;
      min-height: 49px !important;
      height: 49px !important;
      padding: 5px 3px 20px !important;
      border: 0 !important;
      border-top: 1px solid #f1f1f3 !important;
      border-right: 1px solid #f1f1f3 !important;
      border-radius: 0 !important;
      background: #fff !important;
      overflow: hidden !important;
      position: relative !important;
      box-shadow: none !important;
    }

    .cal-panel .cal-day:nth-child(7n+1) {
      border-left: 1px solid #f1f1f3 !important;
    }

    .cal-panel .cal-day:nth-last-child(-n+7) {
      border-bottom: 1px solid #f1f1f3 !important;
    }

    .cal-day-num {
      right: 7px !important;
      top: 8px !important;
      font-size: 11px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
    }

    .cal-panel .cal-day .mark {
      left: 50% !important;
      right: auto !important;
      bottom: 5px !important;
      transform: translateX(-50%) !important;
      min-width: 29px !important;
      max-width: calc(100% - 4px) !important;
      height: 18px !important;
      padding: 0 4px !important;
      gap: 2px !important;
      border-radius: 999px !important;
      border: 1px solid #dddddf !important;
      background: #fff !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      line-height: 1 !important;
      box-sizing: border-box !important;
    }

    .cal-panel .cal-day .mark img {
      width: 12px !important;
      height: 13px !important;
      min-width: 12px !important;
      display: block !important;
      object-fit: contain !important;
    }

    .cal-panel .cal-day .mark .cnt {
      font-size: 11px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      color: #666 !important;
      margin: 0 !important;
    }

    .cal-panel .cal-day .mark.ok {
      display: none !important;
    }

    /* Calendar header from mockup: title centered, arrows at edges, today above/right */
    #calendarWrap.panel.cal-panel {
      padding: 0 !important;
      border: 0 !important;
      overflow: visible !important;
    }

    .cal-panel h2 {
      margin: 0 0 16px !important;
      font-size: 17px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
    }

    .cal-panel .cal-head {
      display: grid !important;
      grid-template-columns: 31px minmax(0, 1fr) 31px !important;
      gap: 9px !important;
      align-items: center !important;
      margin: 0 0 10px !important;
      width: 100% !important;
    }

    .cal-panel .cal-nav {
      display: contents !important;
    }

    .cal-panel #calPrev {
      grid-column: 1 !important;
    }

    .cal-panel #calTitle {
      grid-column: 2 !important;
      text-align: center !important;
      font-size: 16px !important;
      line-height: 1.15 !important;
      font-weight: 900 !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    .cal-panel #calNext {
      grid-column: 3 !important;
    }

    .cal-panel #calPrev,
    .cal-panel #calNext {
      width: 31px !important;
      min-width: 31px !important;
      height: 29px !important;
      padding: 0 !important;
      display: inline-grid !important;
      place-items: center !important;
      border: 1px solid #ececf0 !important;
      border-radius: 5px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 18px !important;
      line-height: 1 !important;
    }

    .cal-panel #calToday {
      position: absolute !important;
      top: 0 !important;
      right: 0 !important;
      width: auto !important;
      min-width: 54px !important;
      height: 25px !important;
      padding: 0 9px !important;
      border: 1px solid #f0f0f2 !important;
      border-radius: 5px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 12px !important;
      line-height: 1 !important;
      display: inline-grid !important;
      place-items: center !important;
    }

    .cal-panel #calToggle,
    .cal-panel .cal-legend {
      display: none !important;
    }

    /* On very narrow phones keep badges readable but tiny */
    @media (max-width: 374px) {
      .cal-panel .cal-day {
        height: 47px !important;
        min-height: 47px !important;
        padding-bottom: 19px !important;
      }

      .cal-day-num {
        right: 6px !important;
        top: 7px !important;
        font-size: 10px !important;
      }

      .cal-panel .cal-day .mark {
        min-width: 27px !important;
        height: 17px !important;
        padding: 0 3px !important;
      }

      .cal-panel .cal-day .mark img {
        width: 11px !important;
        height: 12px !important;
        min-width: 11px !important;
      }

      .cal-panel .cal-day .mark .cnt {
        font-size: 10px !important;
      }
    }
  }

/* ===== crm-mobile-buttons-v3 ===== */
  /* ===== Mobile action buttons: use uploaded PNG icons for create + refresh ===== */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    .actions {
      gap: 6px !important;
    }

    #btnAdd,
    #reloadBtn {
      width: 30px !important;
      height: 30px !important;
      min-width: 30px !important;
      max-width: 30px !important;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 6px !important;
      font-size: 0 !important;
      line-height: 0 !important;
      overflow: hidden !important;
      color: transparent !important;
      background-color: transparent !important;
      background-repeat: no-repeat !important;
      background-position: center !important;
      background-size: 30px 30px !important;
      box-shadow: none !important;
      display: inline-block !important;
      flex: 0 0 30px !important;
    }

    #btnAdd {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAAAaVJREFUeAHlV+1xgzAMVXsdICNkAxjBG8AGwCRhA9gAGIEJYANgAtiAbOD6+XBLCRjT8vGj7+7lAhZ6kiyLhOgbTLAQ7AX5AYRvjyZ4HCQ2x4cS9U8UVWQ0lOBs4eJt+HI2nlcJ0ztdhE3CjDGK45jatiXOuWRVVZQkCd3vd9qK1Wa43W48iiIOFEXBhTj3fV8yDEMuApFrsIGtiU8yERVZ8b7vueu6i3YIAgHA1lBcb4As4FCUctUZbBAgnvmTMBwBnue9rIn9lpzeR1WAuTVj4TRNZbZLa6KpZtdUH+h8a7vasizKsoy2omkachxn1W4xKgBNQ6PyIksQlQDV9bi0eAag32Z8JD50i13XkW3bX9dlWUoCYo/lAAmC4OU5DJO6rnWu9ZMrz3O5z1shTsGqMLC4D9g3YG5wLB0ntb8G5167KI8FhoLpAEHDrR0lI2E1MuFwbpDQaHAgwN1GphJHFgACwItBvSRwHwMDwPfdXhLTUmJiISsFVVqDEfmD//MXyJMuAITXT/r+KPHBaENT7ERPRRCeKBpO0/fpuH8V/eCbKbFP/SDTsiN2l9UAAAAASUVORK5CYII=") !important;
    }

    #reloadBtn {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAAAi5JREFUeAHFl/Ft4jAUxp+h6K6oSGECYIOwQW4DNkiYAJggyQZsQG4CYAKyAWEC4P9KSUtF78oV3/ss0pMq4RCOpJ/kxEle/PN7tp9sQSfFcWwR3blcNbkYdHuFRCJoNh9+0j/ozn16epGHwx95PB5lEXp7O0gwwAJTPD4+O7VaZdJo1EkIQUWK+bTb7Yl9+1GpVoV9f/+tcCgERr3+HVW3wherVrujslStAklmhUrWKbJG6eBUucBhGNJwOKROp6N6jtLtdqnf79Nms1E2vu+r5yxdPLij0YjG4zFZlkW2bVO73Vbvt9stBUGgCjqVJMllDfK6ylyDpmlKwzDkYrE4azOZTCR3RnKT0nEcbXtgZnoMT+HFcrn88PKz0tDiexryLGnHGI0gvJ7nnYWmwPTO3pLrupQpXah5LCWPqby1wNR6vFqtqNfrURHSgqMoolarRaWDr9V8Pldr/WowJgvWaV4hUrz86Gowxnc2m1FeIZnw2tcb6WY1EgabaBPHZyGR4J/1ei11szozc3EaVBlJ11Aq2MB2MBho7S4C815MpUw0OJ1Oz9ohKrCBLf75b3AqeI4QIqFwNlOdQEEd7/ANnmZBc4MhhBLZDF4BhJKGNs88AFPgYhgPVKaS5IW+dAeSsPdUtgCO3t+PVJb40IBbCLC/3/+iMrwG4/X1N29xRaBe8ATzcLzAMaMI4ViE49HpCOOB+XF8iONnhx9trlp0c0neAYqIK36z2Qjx5i84V0oCuA8BewAAAABJRU5ErkJggg==") !important;
    }

    #btnAdd::before,
    #btnAdd::after,
    #reloadBtn::before,
    #reloadBtn::after {
      content: none !important;
      display: none !important;
    }

    /* Фильтр оставляем кнопкой такого же размера, чтобы ряд был ровный */
    #filterBtn {
      width: 30px !important;
      height: 30px !important;
      min-width: 30px !important;
      max-width: 30px !important;
      flex: 0 0 30px !important;
      border-radius: 6px !important;
    }
  }

/* ===== crm-desktop-topbar-buttons-v4 ===== */
  /* ===== Desktop topbar + desktop new-order button ===== */

  @media (min-width: 981px) {
    .top {
      height: 72px !important;
      min-height: 72px !important;
      padding: 0 34px !important;
      gap: 28px !important;
      border-bottom: 1px solid var(--line) !important;
      background: #fff !important;
    }

    .top .burger {
      width: 40px !important;
      height: 40px !important;
      padding: 0 !important;
      flex: 0 0 40px !important;
    }

    .top .burger span {
      width: 30px !important;
      height: 1.5px !important;
      background: #111 !important;
    }

    .top .branch {
      font-size: 20px !important;
      line-height: 1 !important;
      font-weight: 750 !important;
      white-space: nowrap !important;
      flex: 0 0 auto !important;
    }

    .top .date {
      display: block !important;
      font-size: 16px !important;
      line-height: 1 !important;
      color: #111 !important;
      white-space: nowrap !important;
      flex: 0 0 auto !important;
    }

    .top .search {
      flex: 1 1 auto !important;
      min-width: 360px !important;
      display: flex !important;
      justify-content: center !important;
    }

    .top .search > div {
      width: min(808px, 100%) !important;
    }

    .top .search input {
      height: 54px !important;
      border-radius: 8px !important;
      border: 1px solid var(--line) !important;
      padding: 0 55px 0 20px !important;
      font-size: 15px !important;
    }

    .top .user {
      display: flex !important;
      align-items: center !important;
      gap: 10px !important;
      white-space: nowrap !important;
      flex: 0 0 auto !important;
    }

    #btnAdd {
      height: 40px !important;
      min-height: 40px !important;
      padding: 0 18px 0 16px !important;
      border-radius: 6px !important;
      border: 1px solid #000 !important;
      background: #000 !important;
      color: #fff !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 8px !important;
      font-size: 15px !important;
      line-height: 1 !important;
      font-weight: 600 !important;
      white-space: nowrap !important;
    }

    #btnAdd .desktop-new-order-icon {
      width: 20px !important;
      height: 20px !important;
      display: block !important;
      flex: 0 0 20px !important;
      object-fit: contain !important;
    }
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    #btnAdd .desktop-new-order-icon {
      display: none !important;
    }
  }

/* ===== crm-mobile-calendar-details-totals-v5 ===== */
  /* ===== V5: mobile calendar height + detailing table compact + protected totals ===== */

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    /* Calendar: cells should be slightly taller than square, not stretched */
    .cal-panel {
      padding-left: 14px !important;
      padding-right: 14px !important;
      overflow-x: hidden !important;
    }

    .cal-panel .cal-grid {
      width: 100% !important;
      min-width: 0 !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    }

    .cal-panel .cal-wd {
      height: 33px !important;
      min-height: 33px !important;
      font-size: 12px !important;
    }

    .cal-panel .cal-day {
      min-height: 68px !important;
      height: 68px !important;
      padding: 7px 3px 25px !important;
      overflow: hidden !important;
    }

    .cal-day-num,
    .cal-panel .cal-day > .cal-day-num {
      top: 7px !important;
      right: 9px !important;
      font-size: 13px !important;
      line-height: 1 !important;
    }

    .cal-panel .cal-day .mark {
      right: 5px !important;
      bottom: 7px !important;
      min-width: 35px !important;
      height: 20px !important;
      padding: 0 6px !important;
      gap: 3px !important;
      border-radius: 999px !important;
    }

    .cal-panel .cal-day .mark img {
      width: 13px !important;
      height: 14px !important;
    }

    .cal-panel .cal-day .mark .cnt {
      font-size: 12px !important;
      line-height: 1 !important;
    }

    .cal-panel .cal-day.mute {
      opacity: 1 !important;
    }

    /* Details monthly table: make the grid denser on phone */
    body.is-details-mode #monthly-view,
    body.is-details-mode #details-view,
    #monthly-view,
    #details-view {
      padding-left: 14px !important;
      padding-right: 14px !important;
    }

    #monthly-view .detail-table-wrap {
      width: 100% !important;
      max-width: 100% !important;
      overflow: hidden !important;
      border-radius: 0 !important;
      box-shadow: none !important;
    }

    #monthly-view .scroll-area {
      width: 100% !important;
      overflow-x: auto !important;
      -webkit-overflow-scrolling: touch !important;
    }

    #table-month {
      table-layout: fixed !important;
      width: max-content !important;
      min-width: 740px !important;
      font-size: 11px !important;
    }

    #table-month col:nth-child(1) { width: 45px !important; }
    #table-month col:nth-child(2) { width: 78px !important; }
    #table-month col:nth-child(3) { width: 92px !important; }
    #table-month col:nth-child(4) { width: 78px !important; }
    #table-month col:nth-child(5) { width: 78px !important; }
    #table-month col:nth-child(6) { width: 92px !important; }
    #table-month col:nth-child(7) { width: 140px !important; }
    #table-month col:nth-child(8) { width: 78px !important; }
    #table-month col:nth-child(9) { width: 92px !important; }
    #table-month col:nth-child(10) { width: 92px !important; }

    #table-month th,
    #table-month td {
      padding: 8px 6px !important;
      font-size: 11px !important;
      line-height: 1.15 !important;
      white-space: normal !important;
      vertical-align: middle !important;
      text-align: center !important;
    }

    #table-month input,
    #table-month textarea {
      font-size: 12px !important;
      min-width: 0 !important;
      width: 100% !important;
      padding: 8px 7px !important;
      border-radius: 6px !important;
    }

    #table-month .exp-note {
      min-width: 110px !important;
      max-height: 44px !important;
    }

    #table-month .exp-amount {
      min-width: 70px !important;
    }

    #month-total-lock {
      margin: 20px 0 0 !important;
      width: 100% !important;
      padding: 16px 18px 18px !important;
    }

    #month-total-lock .month-total-lock-row {
      grid-template-columns: 1fr auto !important;
      gap: 8px !important;
    }

    #month-total-lock input {
      height: 40px !important;
      min-width: 0 !important;
    }

    #month-total-lock button {
      height: 40px !important;
      padding: 0 12px !important;
    }
  }

  @media (min-width: 981px) {
    #month-total-lock {
      width: 386px !important;
      margin: 26px 0 0 !important;
    }
  }

  /* Protected totals block */
  #foot-month.month-total-locked {
    display: none !important;
  }

  #month-total-lock {
    background: #f5f5f5;
    padding: 26px 30px;
    color: #111;
    box-sizing: border-box;
  }

  #month-total-lock .month-total-lock-title {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
    margin: 0 0 14px;
  }

  #month-total-lock .month-total-lock-text {
    font-size: 14px;
    line-height: 1.35;
    color: #666;
    margin: 0 0 14px;
  }

  #month-total-lock .month-total-lock-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
  }

  #month-total-lock input {
    height: 46px;
    min-width: 0;
    width: 100%;
    border: 1px solid #e5e5e8;
    border-radius: 6px;
    background: #fff;
    color: #111;
    padding: 0 14px;
    font: inherit;
    box-sizing: border-box;
  }

  #month-total-lock button {
    height: 42px;
    border: 1px solid #000;
    border-radius: 5px;
    background: #000;
    color: #fff;
    padding: 0 16px;
    font: inherit;
    cursor: pointer;
  }

  #month-total-lock .month-total-lock-error {
    min-height: 16px;
    margin-top: 9px;
    color: #b00020;
    font-size: 12px;
  }

  #month-total-lock.is-unlocked {
    display: none !important;
  }

/* ===== crm-scroll-add-buttons-v6 ===== */
  /* ===== V6: add-service/add-executor buttons + mobile autoscroll after details row click ===== */

  #svcAdd,
  #edSvcAdd,
  #execAdd,
  #edExecAdd {
    height: 37px !important;
    min-height: 37px !important;
    padding: 0 10px !important;
    border: 1px solid #111 !important;
    border-radius: 5px !important;
    background: #fff !important;
    color: #606060 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
  }

  #svcAdd img,
  #edSvcAdd img,
  #execAdd img,
  #edExecAdd img {
    width: 18px !important;
    height: 19px !important;
    object-fit: contain !important;
    display: block !important;
    flex: 0 0 auto !important;
  }

  #svcAdd span,
  #edSvcAdd span,
  #execAdd span,
  #edExecAdd span {
    display: inline-block !important;
    color: #606060 !important;
  }

  #svcAdd:hover,
  #edSvcAdd:hover,
  #execAdd:hover,
  #edExecAdd:hover {
    background: #fafafa !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    #svcAdd,
    #edSvcAdd,
    #execAdd,
    #edExecAdd {
      width: auto !important;
      max-width: 100% !important;
      height: 37px !important;
      padding: 0 10px !important;
      font-size: 14px !important;
    }

    #create-body .row-end,
    #modal-body .row-end {
      justify-content: flex-start !important;
    }
  }

/* ===== crm-final-request-fixes-v1 ===== */
  /* Desktop interface scale. Modal windows are outside .app, so they stay normal size. */
  @media (min-width: 981px) {
    body:not(.locked) .app {
      zoom: .65;
      width: 100% !important;
      min-height: calc(100vh - 50px) !important;
    }
  }

  /* Clean number inputs: remove +/- spinner arrows in tables and order detail forms. */
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
  }
  input[type="number"] {
    -moz-appearance: textfield !important;
    appearance: textfield !important;
  }

  /* Monthly totals are shown in the protected block, not as a table footer. */
  #foot-month {
    display: none !important;
  }

  #month-total-lock.crm-summary-unlocked,
  #month-total-lock.crm-summary-unlocked.is-unlocked {
    display: block !important;
    background: #f5f5f5 !important;
  }

  #month-total-lock .crm-month-summary {
    display: grid;
    gap: 0;
    border: 1px solid #e2e2e6;
    background: #fff;
  }

  #month-total-lock .crm-month-summary-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 12px 14px;
    border-bottom: 1px solid #ededf0;
    font-size: 14px;
    line-height: 1.25;
  }

  #month-total-lock .crm-month-summary-row:last-child {
    border-bottom: 0;
  }

  #month-total-lock .crm-month-summary-label {
    color: #5f5f66;
  }

  #month-total-lock .crm-month-summary-value {
    font-weight: 800;
    color: #111;
    white-space: nowrap;
  }

  /* Month table after removing the wash column. */
  #table-month {
    min-width: 900px !important;
  }
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    #table-month {
      min-width: 650px !important;
    }
  }

  /* Detail modal after removing the Autoestetika wash column. */
  #modal-detail #detail-table {
    width: max-content !important;
    min-width: 100% !important;
    table-layout: auto !important;
  }

  #modal-detail #detail-table th,
  #modal-detail #detail-table td {
    min-width: 118px;
  }

  #modal-detail #detail-table th:nth-child(2),
  #modal-detail #detail-table td:nth-child(2) {
    min-width: 260px;
    text-align: left !important;
  }

  #modal-detail #detail-table th:first-child,
  #modal-detail #detail-table td:first-child {
    min-width: 58px;
  }

/* ===== crm-calendar-toggle-orders-stretch-v8 ===== */
  /* ===== V8: desktop calendar toggle removed, mobile toggle restored, orders panel stretched ===== */

  @media (min-width: 981px) {
    /* На компьютере кнопка свернуть/развернуть календарь полностью убрана. */
    #calendarWrap #calToggle,
    .cal-panel #calToggle,
    .cal-head #calToggle,
    .cal-head.monthbar #calToggle {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }

    /* Календарь и блок заказов тянутся одной высотой. */
    .calendar-layout:not(.no-calendar) {
      align-items: stretch !important;
    }

    .calendar-layout:not(.no-calendar) .panel.cal-panel,
    .calendar-layout:not(.no-calendar) .orders-shell {
      height: calc(154dvh - 330px) !important;
      min-height: 760px !important;
      max-height: none !important;
      box-sizing: border-box !important;
    }

    .calendar-layout:not(.no-calendar) .panel.cal-panel {
      overflow: hidden !important;
    }

    .calendar-layout:not(.no-calendar) .orders-shell {
      display: flex !important;
      flex-direction: column !important;
      overflow: hidden !important;
    }

    .calendar-layout:not(.no-calendar) #orders {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      max-height: none !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
    }

    /* В режимах без календаря заказы просто занимают всю доступную ширину. */
    .calendar-layout.no-calendar .orders-shell,
    .calendar-layout.no-calendar #orders {
      width: 100% !important;
      max-width: 100% !important;
    }

    /* Таблицы детализации тоже не выглядят уже основного контента. */
    #details-view .detail-table-wrap,
    #monthly-view .detail-table-wrap {
      width: 100% !important;
      max-width: 100% !important;
    }
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    /* На телефоне кнопку возвращаем: старые mobile-fix блоки прятали #calToggle. */
    #calendarWrap .cal-head {
      position: relative !important;
    }

    #calendarWrap #calToggle,
    .cal-panel #calToggle {
      display: inline-grid !important;
      visibility: visible !important;
      pointer-events: auto !important;
      position: absolute !important;
      top: 0 !important;
      right: 62px !important;
      width: 31px !important;
      min-width: 31px !important;
      height: 25px !important;
      padding: 0 !important;
      border: 1px solid #f0f0f2 !important;
      border-radius: 5px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 14px !important;
      line-height: 1 !important;
      place-items: center !important;
      z-index: 3 !important;
      box-shadow: none !important;
    }

    /* В месячном итоге детализации календарная сетка скрыта, поэтому toggle там не нужен. */
    #calendarWrap .cal-head.monthbar #calToggle {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }

    .orders-shell {
      min-height: 0 !important;
    }
  }

/* ===== crm-executor-employee-picker-v1 ===== */
  .executor-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: start !important;
  }
  .executor-row-grid {
    align-items: start !important;
  }
  .executor-employee-cell {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
  }
  .executor-pick-btn {
    height: 40px !important;
    padding: 0 12px !important;
    white-space: nowrap !important;
    border-color: #111 !important;
    background: #fff !important;
  }
  .executor-picked {
    min-height: 40px;
    border: 1px solid #e5e5e8;
    border-radius: 10px;
    padding: 7px 10px;
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
  }
  .executor-picked b {
    font-size: 14px;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .executor-picked span {
    margin-top: 3px;
    color: #777;
    font-size: 12px;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .executor-picked.is-empty b {
    color: #777;
    font-weight: 500;
  }
  .executor-picker-backdrop {
    z-index: 2600 !important;
  }
  .executor-picker-modal {
    width: min(760px, calc(100vw - 36px)) !important;
  }
  .executor-picker-body {
    padding: 0 24px 24px !important;
  }
  .executor-picker-status {
    margin-bottom: 12px;
    color: #666;
    font-size: 14px;
  }
  .executor-picker-table-wrap {
    border: 1px solid #ececf0;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
  }
  .executor-picker-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
  }
  .executor-picker-table th,
  .executor-picker-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #f0f0f2;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
  }
  .executor-picker-table th {
    background: #f7f7f9;
    font-weight: 800;
  }
  .executor-picker-table tr:last-child td {
    border-bottom: 0;
  }
  .executor-picker-table td:last-child,
  .executor-picker-table th:last-child {
    width: 120px;
    text-align: right;
  }
  .executor-choose-btn {
    height: 34px !important;
    padding: 0 12px !important;
    background: #000 !important;
    color: #fff !important;
    border-color: #000 !important;
  }
  @media (max-width: 700px) {
    .executor-employee-cell {
      grid-template-columns: 1fr !important;
    }
    .executor-picker-table th,
    .executor-picker-table td {
      padding: 10px 8px;
      font-size: 13px;
    }
  }

/* ===== crm-executor-selected-width-fix-v2 ===== */
  /* Исполнитель в создании/редактировании заказа:
     выбранный сотрудник занимает примерно на 30% меньше места,
     освободившаяся ширина отдаётся кнопке выбора. */
  .executor-employee-cell {
    grid-template-columns: minmax(110px, 30%) minmax(0, 70%) !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .executor-pick-btn,
  .modal .executor-pick-btn,
  .modal .svc .executor-pick-btn,
  .modal .exec .executor-pick-btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 40px !important;
    padding: 0 7px !important;
    font-size: 12px !important;
    line-height: 1.08 !important;
    font-weight: 500 !important;
    white-space: normal !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  .executor-picked {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  @media (max-width: 700px) {
    .executor-employee-cell {
      grid-template-columns: minmax(104px, 34%) minmax(0, 66%) !important;
    }

    .executor-pick-btn,
    .modal .executor-pick-btn,
    .modal .svc .executor-pick-btn,
    .modal .exec .executor-pick-btn {
      font-size: 11px !important;
      padding: 0 5px !important;
    }
  }

/* ===== crm-logo-and-header-alignment-final ===== */
  /* Финальная правка шапки: точное лого KCx картинкой и ровная компоновка верхних блоков */
  .app{
    align-items: stretch !important;
    min-height: 100vh !important;
  }

  .side{
    align-self: stretch !important;
  }

  .brand,
  .top{
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    box-sizing: border-box !important;
    border-bottom: 1px solid var(--line) !important;
    display: flex !important;
    align-items: center !important;
    background: #fff !important;
  }

  .brand{
    gap: 12px !important;
    padding: 0 20px !important;
    white-space: nowrap !important;
  }

  .top{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .logo,
  .side.open .logo{
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    flex: 0 0 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    letter-spacing: normal !important;
    overflow: visible !important;
    position: relative !important;
  }

  .logo::before,
  .logo::after{
    display: none !important;
    content: none !important;
  }

  .logo img{
    display: block !important;
    width: 36px !important;
    height: auto !important;
    max-width: none !important;
    max-height: 36px !important;
    object-fit: contain !important;
  }

  .brand-name{
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
  }

  .side.open .brand-name{
    display: block !important;
  }

  .burger{
    flex: 0 0 46px !important;
  }

  @media (max-width: 980px){
    .top{
      height: auto !important;
      min-height: 72px !important;
      max-height: none !important;
      flex-wrap: wrap !important;
      padding: 10px 18px !important;
    }
  }

/* ===== crm-master-salary-v1-style ===== */
  /* ===== Расчет ЗП мастера ===== */
  #modal-master-salary {
    position: fixed;
    inset: 0;
    z-index: 140;
    background: rgba(0, 0, 0, .38);
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding: 72px 20px 36px;
    overflow: auto;
  }
  #modal-master-salary[aria-hidden="false"] { display: flex; }
  #modal-master-salary .salary-modal {
    width: min(1180px, 100%);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 24px 60px rgba(0,0,0,.25);
    overflow: hidden;
  }
  #modal-master-salary .salary-head {
    min-height: 74px;
    border-bottom: 1px solid var(--line, #ececf0);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 18px 28px;
  }
  #modal-master-salary .salary-title { font-size: 24px; font-weight: 900; letter-spacing: -.03em; }
  #modal-master-salary .salary-close {
    width: 38px;
    height: 38px;
    border: 0;
    background: transparent;
    color: #777;
    font-size: 28px;
    line-height: 1;
  }
  #modal-master-salary .salary-body { padding: 28px; }
  #modal-master-salary .salary-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 20px;
  }
  #modal-master-salary .salary-stat {
    border: 1px solid var(--line, #ececf0);
    border-radius: 8px;
    padding: 12px 14px;
    background: #fbfbfb;
  }
  #modal-master-salary .salary-stat span { display:block; color:#777; font-size:12px; margin-bottom:6px; }
  #modal-master-salary .salary-stat b { font-size:15px; }
  #modal-master-salary .salary-grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 16px;
    margin-bottom: 18px;
  }
  #modal-master-salary .salary-field label {
    display: block;
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
  }
  #modal-master-salary .salary-field select,
  #modal-master-salary .salary-field input {
    width: 100%;
    height: 46px;
    border: 1px solid #e5e5e8;
    border-radius: 7px;
    background: #fff;
    padding: 0 12px;
    outline: 0;
  }
  #modal-master-salary .salary-note {
    margin: 8px 0 18px;
    padding: 12px 14px;
    border: 1px solid #ececf0;
    border-radius: 8px;
    background: #fafafa;
    color: #666;
    line-height: 1.45;
    font-size: 13px;
  }
  #modal-master-salary .salary-switch {
    display: inline-flex;
    gap: 8px;
    margin: 2px 0 16px;
    padding: 4px;
    border: 1px solid #e7e7eb;
    border-radius: 10px;
    background: #fafafa;
  }
  #modal-master-salary .salary-switch button {
    height: 38px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #777;
    padding: 0 16px;
  }
  #modal-master-salary .salary-switch button.active { background:#000; color:#fff; }
  #modal-master-salary .salary-table-wrap {
    overflow: auto;
    border: 1px solid var(--line, #ececf0);
    border-radius: 8px;
  }
  #modal-master-salary table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 13px;
  }
  #modal-master-salary th,
  #modal-master-salary td {
    border-bottom: 1px solid #f0f0f0;
    padding: 10px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
  }
  #modal-master-salary th { background: #fafafa; font-weight: 800; color:#555; }
  #modal-master-salary td input,
  #modal-master-salary td select {
    width: 120px;
    height: 36px;
    border: 1px solid #e5e5e8;
    border-radius: 6px;
    padding: 0 9px;
    background: #fff;
  }
  #modal-master-salary td input.salary-wide,
  #modal-master-salary td select.salary-wide { width: 190px; }
  #modal-master-salary .salary-result {
    font-weight: 900;
    color: #111;
  }
  #modal-master-salary .salary-hidden { display:none !important; }
  #modal-master-salary .salary-foot {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 18px 28px 28px;
  }
  #modal-master-salary .salary-status {
    margin-right: auto;
    color: #666;
    align-self: center;
    font-size: 13px;
  }
  #modal-master-salary .salary-btn {
    height: 44px;
    border: 1px solid #e5e5e8;
    border-radius: 7px;
    background: #f6f6f7;
    padding: 0 20px;
  }
  #modal-master-salary .salary-btn.primary { background:#000; color:#fff; border-color:#000; }
  @media(max-width: 900px){
    #modal-master-salary { padding: 16px 10px 24px; }
    #modal-master-salary .salary-body { padding: 18px; }
    #modal-master-salary .salary-summary,
    #modal-master-salary .salary-grid { grid-template-columns: 1fr; }
    #modal-master-salary .salary-title { font-size: 20px; }
  }

/* ===== crm-final-polish-v2 ===== */
  /* 1) Active ring on the selected color dot */
  .dropdown-color-dot {
    position: relative !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    border-radius: 999px !important;
    border: 1px solid #e1e1e5 !important;
    padding: 0 !important;
    box-shadow: none !important;
  }
  .dropdown-color-dot.is-selected {
    outline: 2px solid #d7d7dc !important;
    outline-offset: 3px !important;
  }
  .dropdown-color-dot[style*="background:#fff"],
  .dropdown-color-dot[style*="background: #fff"] {
    border-color: #cfd1d6 !important;
  }

  /* 2) Wider calendar, closer to the reference proportions */
  .preview-content {
    width: 100% !important;
    max-width: none !important;
    overflow-x: hidden !important;
  }
  #crmLayout:not(.no-calendar) {
    display: grid !important;
    grid-template-columns: minmax(720px, 1fr) minmax(390px, 480px) !important;
    gap: 28px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
  #calendarWrap {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: auto !important;
  }
  .panel.cal-panel {
    min-width: 0 !important;
    padding: 24px 30px 30px !important;
  }
  .cal-panel .cal-grid {
    min-width: 760px !important;
    width: 100% !important;
  }
  .cal-panel .cal-day {
    min-height: 120px !important;
    padding: 10px 12px 38px !important;
  }
  .cal-panel .cal-wd {
    height: 39px !important;
  }
  .cal-panel .cal-day .mark {
    right: 13px !important;
    bottom: 18px !important;
  }
  @media (max-width: 1179px) {
    #crmLayout:not(.no-calendar) {
      grid-template-columns: 1fr !important;
    }
    .cal-panel .cal-grid {
      min-width: 700px !important;
    }
  }

  /* 3) Right panel header: always “Заказы” + date line with car badge */
  .orders-shell {
    overflow: visible !important;
  }
  .orders-title {
    display: block !important;
    padding: 28px 32px 20px !important;
    border-bottom: 0 !important;
  }
  .orders-title h2,
  .orders-title #ordersTitle {
    margin: 0 !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    letter-spacing: -0.03em !important;
  }
  .orders-date-line {
    margin-top: 40px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #111;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
  }
  .orders-date-car-badge {
    min-width: 48px;
    height: 29px;
    padding: 0 9px;
    border: 1px solid #dddddf;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #fff;
    color: #666;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
  }
  .orders-date-car-badge img {
    width: 16px;
    height: 17px;
    object-fit: contain;
    display: block;
  }
  .orders-shell #orders {
    padding: 0 !important;
  }
  .orders-shell #orders .order {
    margin: 0 !important;
    border-left-width: 0 !important;
    border-right-width: 0 !important;
    border-radius: 0 !important;
    padding: 18px 32px 20px !important;
  }
  .orders-shell #orders .order.has-accent {
    border-left-width: 4px !important;
    padding-left: 28px !important;
  }
  .orders-shell #orders .order .order-card-top,
  .orders-shell #orders .order .order-main {
    max-width: none !important;
  }
  .orders-shell #orders .order-title {
    margin-top: 0 !important;
  }
  .calendar-layout.no-calendar .orders-title {
    display: block !important;
  }
  #crmLayout .orders-shell {
    align-self: start !important;
  }

/* ===== crm-details-layout-v5 ===== */
  /* === V5: details page layout === */
  body.is-details-mode #calendarWrap {
    display: none !important;
  }

  body.is-details-mode #crmLayout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px) !important;
    gap: 30px !important;
    align-items: start !important;
    width: 100% !important;
  }

  body.is-details-mode #monthly-view,
  body.is-details-mode #details-view {
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 24px 30px 30px !important;
    border: 1px solid var(--line) !important;
    background: #fff !important;
    box-shadow: none !important;
    align-self: start !important;
  }

  body.is-details-mode #monthly-view h3,
  body.is-details-mode #details-view h3 {
    text-align: left !important;
  }

  body.is-details-mode #monthly-view > h3:first-child {
    margin: 0 0 26px !important;
    font-size: 22px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
  }

  .details-month-nav {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    margin: 0 0 24px;
  }

  .details-month-title {
    text-align: center;
    font-size: 18px;
    font-weight: 900;
  }

  .details-month-btn {
    width: 48px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    color: #111;
    display: grid;
    place-items: center;
    font-size: 20px;
    line-height: 1;
  }

  body.is-details-mode #monthly-view .detail-table-wrap,
  body.is-details-mode #details-view .detail-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  body.is-details-mode #monthly-view table.detail,
  body.is-details-mode #details-view table.detail {
    width: max-content !important;
    min-width: 100% !important;
  }

  body.is-details-mode #orders {
    max-height: calc(100vh - 265px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body.is-details-mode .orders-shell {
    min-height: 0 !important;
  }

  body.is-details-mode .orders-shell #orders .order {
    min-height: auto !important;
    padding: 18px 32px 20px !important;
    margin: 0 !important;
    border-left-width: 0 !important;
    border-right-width: 0 !important;
    border-radius: 0 !important;
  }

  body.is-details-mode .orders-shell #orders .order.has-accent {
    border-left-width: 4px !important;
    padding-left: 28px !important;
  }

  body.is-details-mode #orders > .order {
    min-height: auto !important;
  }

  body.is-details-mode #table-month tbody tr {
    cursor: pointer !important;
  }

  body.is-details-mode #table-month tbody tr:hover {
    background: #f6f6f6 !important;
  }

  @media (max-width: 1300px) {
    body.is-details-mode #crmLayout {
      grid-template-columns: 1fr !important;
    }

    body.is-details-mode #orders {
      max-height: none !important;
    }
  }

/* ===== crm-mobile-calendar-height-40-v7 ===== */
  /*
    Последний override для мобилки.
    В предыдущей версии поздний блок финальной полировки снова задавал
    .cal-grid min-width:760px и .cal-day min-height:120px, поэтому старые
    mobile-фиксы перебивались. Здесь фикс стоит ниже всех старых стилей.
  */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.mobile-calendar-mode .preview-content {
      padding-left: 14px !important;
      padding-right: 14px !important;
      overflow-x: hidden !important;
    }

    body.mobile-calendar-mode #crmLayout,
    body.mobile-calendar-mode #crmLayout:not(.no-calendar),
    body.mobile-calendar-mode .calendar-layout {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      grid-template-columns: none !important;
      gap: 0 !important;
      overflow-x: hidden !important;
    }

    body.mobile-calendar-mode #calendarWrap.panel.cal-panel,
    body.mobile-calendar-mode .panel.cal-panel {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      border: 0 !important;
      overflow: visible !important;
      box-sizing: border-box !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-grid,
    body.mobile-calendar-mode #calWeekdays,
    body.mobile-calendar-mode #calDays {
      display: grid !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow: hidden !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-wd {
      height: 30px !important;
      min-height: 30px !important;
      padding: 0 !important;
      font-size: 10px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      border-top: 1px solid #f1f1f3 !important;
      border-right: 1px solid #f1f1f3 !important;
      background: #fafafa !important;
    }

    /* Было 120px из позднего desktop-патча. 120 - 40% = 72px. */
    body.mobile-calendar-mode #calendarWrap .cal-day {
      width: auto !important;
      min-width: 0 !important;
      min-height: 72px !important;
      height: 72px !important;
      padding: 7px 4px 24px !important;
      border: 0 !important;
      border-top: 1px solid #f1f1f3 !important;
      border-right: 1px solid #f1f1f3 !important;
      border-radius: 0 !important;
      background: #fff !important;
      overflow: hidden !important;
      position: relative !important;
      box-shadow: none !important;
      box-sizing: border-box !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day:nth-child(7n+1) {
      border-left: 1px solid #f1f1f3 !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day:nth-last-child(-n+7) {
      border-bottom: 1px solid #f1f1f3 !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day.sel {
      background: #f7f7f7 !important;
      box-shadow: inset 0 0 0 1px #d7d7dc !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day-num,
    body.mobile-calendar-mode #calendarWrap .cal-day > .cal-day-num {
      top: 8px !important;
      right: 8px !important;
      font-size: 12px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day .mark {
      left: 50% !important;
      right: auto !important;
      bottom: 6px !important;
      transform: translateX(-50%) !important;
      min-width: 32px !important;
      max-width: calc(100% - 6px) !important;
      height: 19px !important;
      padding: 0 5px !important;
      gap: 3px !important;
      border: 1px solid #dddddf !important;
      border-radius: 999px !important;
      background: #fff !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      line-height: 1 !important;
      box-sizing: border-box !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day .mark img {
      width: 12px !important;
      height: 13px !important;
      min-width: 12px !important;
      object-fit: contain !important;
      display: block !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day .mark .cnt {
      font-size: 11px !important;
      line-height: 1 !important;
      font-weight: 500 !important;
      color: #666 !important;
      margin: 0 !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day .mark.ok {
      display: none !important;
    }
  }

  @media (max-width: 374px) {
    body.mobile-calendar-mode #calendarWrap .cal-day {
      min-height: 66px !important;
      height: 66px !important;
      padding-bottom: 22px !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day-num {
      top: 7px !important;
      right: 6px !important;
      font-size: 11px !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-day .mark {
      min-width: 29px !important;
      height: 18px !important;
      padding: 0 4px !important;
    }
  }

/* ===== crm-detail-modal-table-v8 ===== */
  /*
    Таблица конкретной детализации (#detail-table) больше не наследует
    мобильное ужатие месячной таблицы (#table-month).
  */
  #modal-detail.modal-backdrop {
    padding: 10px !important;
    box-sizing: border-box !important;
    align-items: flex-start !important;
    overflow: auto !important;
  }

  #modal-detail .modal {
    width: min(1120px, calc(100vw - 20px)) !important;
    max-height: calc(100vh - 20px) !important;
    overflow: auto !important;
    box-sizing: border-box !important;
  }

  #modal-detail .modal-header {
    min-height: 64px !important;
    height: auto !important;
    padding: 0 52px 0 18px !important;
    margin: 0 0 14px !important;
    display: grid !important;
    place-items: center !important;
  }

  #modal-detail .modal-title {
    width: 100% !important;
    min-width: 0 !important;
    text-align: center !important;
    font-size: 20px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  #modal-detail .btn-close {
    right: 14px !important;
    top: 12px !important;
  }

  #modal-detail .detail-body {
    padding: 0 18px 16px !important;
    box-sizing: border-box !important;
  }

  /* Фикс поплывшего label.mini: глобальный .mini был абсолютным выпадающим календарём */
  #modal-detail label.mini,
  #modal-detail .detail-top label.mini,
  #modal-detail .detail-top .muted-mini {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    color: #666 !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    z-index: auto !important;
    white-space: normal !important;
  }

  #modal-detail .detail-top {
    display: grid !important;
    grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) !important;
    grid-template-areas:
      "label helper"
      "select helper" !important;
    gap: 6px 14px !important;
    align-items: center !important;
    margin: 0 0 14px !important;
  }

  #modal-detail .detail-top label.mini {
    grid-area: label !important;
    font-weight: 600 !important;
  }

  #modal-detail #detail-partner {
    grid-area: select !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 12px !important;
    border: 1px solid #e5e5e8 !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
  }

  #modal-detail .detail-top .muted-mini {
    grid-area: helper !important;
    align-self: center !important;
    color: #777 !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }

  #modal-detail .detail-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border: 1px solid #ececf0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  #modal-detail .detail-table-wrap .scroll-area {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #modal-detail #detail-table {
    table-layout: fixed !important;
    width: 1110px !important;
    min-width: 1110px !important;
    max-width: none !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
  }

  #modal-detail #detail-table th,
  #modal-detail #detail-table td {
    padding: 9px 8px !important;
    font-size: 12px !important;
    line-height: 1.18 !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  #modal-detail #detail-table th:nth-child(1),
  #modal-detail #detail-table td:nth-child(1) { width: 46px !important; }

  #modal-detail #detail-table th:nth-child(2),
  #modal-detail #detail-table td:nth-child(2) {
    width: 230px !important;
    text-align: left !important;
  }

  #modal-detail #detail-table th:nth-child(3),
  #modal-detail #detail-table td:nth-child(3),
  #modal-detail #detail-table th:nth-child(4),
  #modal-detail #detail-table td:nth-child(4),
  #modal-detail #detail-table th:nth-child(5),
  #modal-detail #detail-table td:nth-child(5),
  #modal-detail #detail-table th:nth-child(6),
  #modal-detail #detail-table td:nth-child(6) { width: 116px !important; }

  #modal-detail #detail-table th:nth-child(7),
  #modal-detail #detail-table td:nth-child(7),
  #modal-detail #detail-table th:nth-child(8),
  #modal-detail #detail-table td:nth-child(8) { width: 132px !important; }

  #modal-detail #detail-table th:nth-child(9),
  #modal-detail #detail-table td:nth-child(9) { width: 122px !important; }

  #modal-detail #detail-table input[type="number"] {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    height: 42px !important;
    padding: 0 8px !important;
    border: 1px solid #e5e5e8 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #modal-detail #detail-table .svc-name {
    max-width: 230px !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    line-height: 1.25 !important;
  }

  #modal-detail #detail-foot td {
    font-weight: 800 !important;
    background: #f7f7f9 !important;
  }

  #modal-detail .grid-end {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin-top: 12px !important;
    flex-wrap: wrap !important;
  }

  #modal-detail .grid-end .btn {
    height: 42px !important;
    padding: 0 16px !important;
    border-radius: 8px !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    #modal-detail.modal-backdrop {
      padding: 8px !important;
    }

    #modal-detail .modal {
      width: calc(100vw - 16px) !important;
      max-height: calc(100vh - 16px) !important;
      border-radius: 10px !important;
    }

    #modal-detail .modal-header {
      min-height: 58px !important;
      padding: 0 44px 0 14px !important;
      margin-bottom: 12px !important;
    }

    #modal-detail .modal-title {
      font-size: 18px !important;
      letter-spacing: -0.02em !important;
    }

    #modal-detail .detail-body {
      padding: 0 12px 14px !important;
    }

    #modal-detail .detail-top {
      grid-template-columns: 1fr !important;
      grid-template-areas:
        "label"
        "select"
        "helper" !important;
      gap: 6px !important;
      margin-bottom: 12px !important;
    }

    #modal-detail #detail-partner {
      height: 40px !important;
      font-size: 14px !important;
    }

    #modal-detail .detail-top .muted-mini {
      font-size: 12px !important;
      line-height: 1.25 !important;
    }

    #modal-detail #detail-table {
      width: 1060px !important;
      min-width: 1060px !important;
      font-size: 11px !important;
    }

    #modal-detail #detail-table th,
    #modal-detail #detail-table td {
      padding: 8px 6px !important;
      font-size: 11px !important;
      line-height: 1.15 !important;
    }

    #modal-detail #detail-table th:nth-child(1),
    #modal-detail #detail-table td:nth-child(1) { width: 42px !important; }

    #modal-detail #detail-table th:nth-child(2),
    #modal-detail #detail-table td:nth-child(2) { width: 210px !important; }

    #modal-detail #detail-table th:nth-child(3),
    #modal-detail #detail-table td:nth-child(3),
    #modal-detail #detail-table th:nth-child(4),
    #modal-detail #detail-table td:nth-child(4),
    #modal-detail #detail-table th:nth-child(5),
    #modal-detail #detail-table td:nth-child(5),
    #modal-detail #detail-table th:nth-child(6),
    #modal-detail #detail-table td:nth-child(6) { width: 112px !important; }

    #modal-detail #detail-table th:nth-child(7),
    #modal-detail #detail-table td:nth-child(7),
    #modal-detail #detail-table th:nth-child(8),
    #modal-detail #detail-table td:nth-child(8) { width: 128px !important; }

    #modal-detail #detail-table th:nth-child(9),
    #modal-detail #detail-table td:nth-child(9) { width: 118px !important; }

    #modal-detail #detail-table input[type="number"] {
      width: 92px !important;
      min-width: 92px !important;
      max-width: 92px !important;
      height: 40px !important;
      font-size: 13px !important;
      border-radius: 9px !important;
    }

    #modal-detail .grid-end {
      justify-content: flex-end !important;
      margin-top: 10px !important;
    }
  }

/* ===== crm-desktop-scale-35-calendar-fit-v2 ===== */
  /* ===== Desktop fix: 35% reduction + no horizontal calendar scroll =====
     Previous patch used zoom: .5 with width: 200%, which stretched the layout
     and created a horizontal page scroll. Now the desktop interface is reduced
     by 35% (scale 65%) without widening the page. Modals stay unchanged. */
  @media (min-width: 981px) {
    html,
    body {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
    }

    body:not(.locked) .app {
      zoom: .65 !important;                 /* уменьшение на 35% */
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      min-height: calc(100vh - 50px) !important;
      overflow-x: hidden !important;
    }

    body:not(.locked) .main,
    body:not(.locked) .preview-content,
    body:not(.locked) #crmLayout,
    body:not(.locked) .calendar-layout {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) .preview-content {
      padding-left: 24px !important;
      padding-right: 24px !important;
    }

    body:not(.locked) #crmLayout:not(.no-calendar),
    body:not(.locked) .calendar-layout:not(.no-calendar) {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(320px, 390px) !important;
      gap: 18px !important;
      align-items: start !important;
    }

    body:not(.locked) #calendarWrap.panel.cal-panel,
    body:not(.locked) .panel.cal-panel {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) #calendarWrap .cal-grid,
    body:not(.locked) #calWeekdays,
    body:not(.locked) #calDays,
    body:not(.locked) .cal-panel .cal-grid {
      display: grid !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) #calendarWrap .cal-wd,
    body:not(.locked) #calendarWrap .cal-day,
    body:not(.locked) .cal-panel .cal-wd,
    body:not(.locked) .cal-panel .cal-day {
      min-width: 0 !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) .cal-panel .cal-day {
      min-height: 88px !important;
      height: 88px !important;
      padding: 9px 9px 32px !important;
    }

    body:not(.locked) .cal-panel .cal-day .mark {
      right: 8px !important;
      bottom: 8px !important;
      max-width: calc(100% - 16px) !important;
    }

    body:not(.locked) .orders-shell {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) #orders {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) .calendar-layout.no-calendar,
    body:not(.locked) #crmLayout.no-calendar {
      display: block !important;
    }
  }

/* ===== crm-desktop-orders-panel-wider-v3 ===== */
  /* ===== Desktop: wider orders panel, narrower calendar, no horizontal scroll ===== */
  @media (min-width: 981px) {
    html,
    body {
      overflow-x: hidden !important;
    }

    body:not(.locked) .app,
    body:not(.locked) .main,
    body:not(.locked) .preview-content,
    body:not(.locked) #crmLayout,
    body:not(.locked) .calendar-layout {
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    /* Было: правая колонка 320–390px. +50% = примерно 480–585px. */
    body:not(.locked) #crmLayout:not(.no-calendar),
    body:not(.locked) .calendar-layout:not(.no-calendar) {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(480px, 585px) !important;
      gap: 18px !important;
      align-items: start !important;
      width: 100% !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    body:not(.locked) #calendarWrap.panel.cal-panel {
      min-width: 0 !important;
      width: 100% !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    body:not(.locked) #calendarWrap .cal-grid,
    body:not(.locked) #calWeekdays,
    body:not(.locked) #calDays {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      overflow: hidden !important;
    }

    body:not(.locked) .orders-shell {
      width: 100% !important;
      min-width: 480px !important;
      max-width: 585px !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) #orders {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) #orders .order,
    body:not(.locked) .orders-shell #orders .order {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    /* На средних экранах оставляем страницу без горизонтального скролла: колонка заказов шире прежней, но адаптивная. */
    @media (max-width: 1280px) {
      body:not(.locked) #crmLayout:not(.no-calendar),
      body:not(.locked) .calendar-layout:not(.no-calendar) {
        grid-template-columns: minmax(0, 1fr) minmax(420px, 480px) !important;
      }

      body:not(.locked) .orders-shell {
        min-width: 420px !important;
        max-width: 480px !important;
      }
    }
  }

/* ===== crm-expense-note-clean-textarea-v1 ===== */
  /* ===== Clean text field for expense description: no spinner-like scrollbar arrows ===== */
  #table-month textarea.exp-note,
  #monthly-view textarea.exp-note,
  textarea.exp-note {
    -webkit-appearance: none !important;
    appearance: none !important;
    resize: none !important;
    overflow: hidden !important;
    overflow-y: hidden !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    max-height: none !important;
    min-height: 38px !important;
    line-height: 1.35 !important;
    box-sizing: border-box !important;
  }

  #table-month textarea.exp-note::-webkit-scrollbar,
  #monthly-view textarea.exp-note::-webkit-scrollbar,
  textarea.exp-note::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  #table-month td:nth-child(7) {
    vertical-align: middle !important;
  }

/* ===== crm-scale25-calendar-table-full-v1 ===== */
  /* ===== Desktop correction: 25% reduction, taller scheduled calendar, full-width details table ===== */
  @media (min-width: 981px) {
    html,
    body {
      width: 100% !important;
      max-width: 100% !important;
      overflow-x: hidden !important;
    }

    /* Было уменьшение на 35% = zoom .65. Теперь уменьшение на 25% = zoom .75. */
    body:not(.locked) .app {
      zoom: .75 !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
    }

    body:not(.locked) .main,
    body:not(.locked) .preview-content,
    body:not(.locked) #crmLayout,
    body:not(.locked) .calendar-layout {
      max-width: 100% !important;
      min-width: 0 !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    /* Правая колонка заказов остаётся расширенной, но без горизонтального выезда страницы. */
    body:not(.locked) #crmLayout:not(.no-calendar),
    body:not(.locked) .calendar-layout:not(.no-calendar) {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(480px, 585px) !important;
      gap: 18px !important;
      align-items: start !important;
      width: 100% !important;
      max-width: 100% !important;
      overflow: hidden !important;
    }

    /* Календарь в режиме заказов: +20% по высоте относительно 88px = примерно 106px. */
    body:not(.locked):not(.is-details-mode) #calendarWrap .cal-day,
    body:not(.locked):not(.is-details-mode) .cal-panel .cal-day {
      min-height: 106px !important;
      height: 106px !important;
      padding: 10px 10px 36px !important;
    }

    body:not(.locked):not(.is-details-mode) #calendarWrap .cal-wd,
    body:not(.locked):not(.is-details-mode) .cal-panel .cal-wd {
      height: 39px !important;
      min-height: 39px !important;
    }

    body:not(.locked) #calendarWrap .cal-grid,
    body:not(.locked) #calWeekdays,
    body:not(.locked) #calDays {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body:not(.locked) .orders-shell {
      min-width: 480px !important;
      max-width: 585px !important;
      width: 100% !important;
      overflow-x: hidden !important;
      box-sizing: border-box !important;
    }

    /* Детализация: месячная таблица теперь занимает всю ширину левого блока. */
    body.is-details-mode #monthly-view .detail-table-wrap,
    body.is-details-mode #details-view .detail-table-wrap {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode #monthly-view .scroll-area,
    body.is-details-mode #details-view .scroll-area,
    body.is-details-mode #month-wrapper {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode #table-month {
      width: 100% !important;
      min-width: 100% !important;
      max-width: 100% !important;
      table-layout: fixed !important;
    }

    body.is-details-mode #table-month th,
    body.is-details-mode #table-month td {
      white-space: normal !important;
      word-break: normal !important;
      overflow-wrap: anywhere !important;
      vertical-align: middle !important;
    }

    body.is-details-mode #table-month input,
    body.is-details-mode #table-month textarea {
      width: 100% !important;
      min-width: 0 !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode #table-month .exp-note {
      min-width: 0 !important;
    }

    /* На средних экранах — чуть сжимаем правую колонку, чтобы всё равно не было скролла вправо. */
    @media (max-width: 1280px) {
      body:not(.locked) #crmLayout:not(.no-calendar),
      body:not(.locked) .calendar-layout:not(.no-calendar) {
        grid-template-columns: minmax(0, 1fr) minmax(420px, 480px) !important;
      }

      body:not(.locked) .orders-shell {
        min-width: 420px !important;
        max-width: 480px !important;
      }
    }
  }

/* ===== crm-details-orders-and-mobile-toggle-v9 ===== */
  /* ===== V9: details orders height + mobile calendar toggle/buttons ===== */

  /* Desktop: right orders block in Detalизация stretches to the left monthly block height. */
  @media (min-width: 981px) {
    body.is-details-mode #crmLayout {
      align-items: stretch !important;
    }

    body.is-details-mode #monthly-view,
    body.is-details-mode #details-view {
      align-self: start !important;
    }

    body.is-details-mode .orders-shell {
      align-self: stretch !important;
      display: flex !important;
      flex-direction: column !important;
      min-height: var(--crm-details-left-height, 760px) !important;
      height: var(--crm-details-left-height, auto) !important;
      max-height: none !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode .orders-shell .orders-title {
      flex: 0 0 auto !important;
    }

    body.is-details-mode .orders-shell #orders {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      height: auto !important;
      max-height: none !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
    }

    /* If details layout becomes one column, do not force the right block height. */
    @media (max-width: 1300px) {
      body.is-details-mode .orders-shell {
        height: auto !important;
        min-height: 0 !important;
      }

      body.is-details-mode .orders-shell #orders {
        overflow: visible !important;
      }
    }
  }

  /* Desktop: calendar collapse button is hidden everywhere on PC. */
  @media (min-width: 981px) {
    #calendarWrap #calToggle,
    .cal-panel #calToggle,
    .cal-head #calToggle,
    .cal-head.monthbar #calToggle {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }
  }

  /* Mobile: clean calendar controls row and make collapse state really hide the grid. */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.mobile-calendar-mode #calendarWrap .cal-head,
    #calendarWrap.panel.cal-panel .cal-head {
      position: relative !important;
      display: grid !important;
      grid-template-columns: 31px minmax(0, 1fr) 31px 31px auto !important;
      align-items: center !important;
      gap: 7px !important;
      width: 100% !important;
      margin: 0 0 10px !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-nav,
    #calendarWrap.panel.cal-panel .cal-nav {
      display: contents !important;
    }

    body.mobile-calendar-mode #calPrev,
    body.mobile-calendar-mode #calNext,
    body.mobile-calendar-mode #calToggle,
    body.mobile-calendar-mode #calToday,
    #calendarWrap #calPrev,
    #calendarWrap #calNext,
    #calendarWrap #calToggle,
    #calendarWrap #calToday {
      position: static !important;
      inset: auto !important;
      transform: none !important;
      box-sizing: border-box !important;
      display: inline-grid !important;
      visibility: visible !important;
      pointer-events: auto !important;
      place-items: center !important;
      height: 29px !important;
      min-height: 29px !important;
      border: 1px solid #ececf0 !important;
      border-radius: 6px !important;
      background: #fff !important;
      color: #111 !important;
      box-shadow: none !important;
      line-height: 1 !important;
      z-index: auto !important;
    }

    body.mobile-calendar-mode #calPrev,
    #calendarWrap #calPrev {
      grid-column: 1 !important;
      width: 31px !important;
      min-width: 31px !important;
      padding: 0 !important;
      font-size: 19px !important;
    }

    body.mobile-calendar-mode #calTitle,
    #calendarWrap #calTitle {
      grid-column: 2 !important;
      min-width: 0 !important;
      text-align: center !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    body.mobile-calendar-mode #calNext,
    #calendarWrap #calNext {
      grid-column: 3 !important;
      width: 31px !important;
      min-width: 31px !important;
      padding: 0 !important;
      font-size: 19px !important;
    }

    body.mobile-calendar-mode #calToggle,
    #calendarWrap #calToggle {
      grid-column: 4 !important;
      width: 31px !important;
      min-width: 31px !important;
      padding: 0 !important;
      font-size: 13px !important;
    }

    body.mobile-calendar-mode #calToday,
    #calendarWrap #calToday {
      grid-column: 5 !important;
      width: auto !important;
      min-width: 62px !important;
      padding: 0 8px !important;
      font-size: 12px !important;
      white-space: nowrap !important;
    }

    /* In monthly detailing, the calendar itself is hidden, so the toggle is not needed. */
    body.is-details-mode #calendarWrap #calToggle,
    #calendarWrap .cal-head.monthbar #calToggle {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }

    /* Strong collapse rules. Previous mobile CSS forced these grids back to display:grid. */
    body.mobile-calendar-mode #calendarWrap.cal-collapsed #calWeekdays,
    body.mobile-calendar-mode #calendarWrap.cal-collapsed #calDays,
    body.mobile-calendar-mode #calendarWrap.cal-collapsed #calLegend,
    #calendarWrap.cal-collapsed #calWeekdays,
    #calendarWrap.cal-collapsed #calDays,
    #calendarWrap.cal-collapsed #calLegend {
      display: none !important;
    }

    body.mobile-calendar-mode #calendarWrap.cal-collapsed,
    #calendarWrap.cal-collapsed {
      padding-bottom: 2px !important;
    }
  }

  @media (max-width: 374px) {
    body.mobile-calendar-mode #calendarWrap .cal-head,
    #calendarWrap.panel.cal-panel .cal-head {
      grid-template-columns: 29px minmax(0, 1fr) 29px 29px auto !important;
      gap: 5px !important;
    }

    body.mobile-calendar-mode #calPrev,
    body.mobile-calendar-mode #calNext,
    body.mobile-calendar-mode #calToggle,
    #calendarWrap #calPrev,
    #calendarWrap #calNext,
    #calendarWrap #calToggle {
      width: 29px !important;
      min-width: 29px !important;
    }

    body.mobile-calendar-mode #calToday,
    #calendarWrap #calToday {
      min-width: 56px !important;
      padding: 0 6px !important;
      font-size: 11px !important;
    }
  }

/* ===== crm-mobile-calendar-buttons-v10 ===== */
  /* ===== V10: mobile calendar buttons exactly like reference ===== */
  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.mobile-calendar-mode #calendarWrap.panel.cal-panel,
    #calendarWrap.panel.cal-panel {
      position: relative !important;
      overflow: visible !important;
    }

    /* First row: title on the left, Today on the right */
    body.mobile-calendar-mode #calendarWrap h2,
    #calendarWrap.panel.cal-panel h2 {
      display: block !important;
      margin: 0 92px 18px 0 !important;
      padding: 0 !important;
      font-size: 20px !important;
      line-height: 36px !important;
      font-weight: 900 !important;
      letter-spacing: -0.02em !important;
      color: #111 !important;
      text-align: left !important;
    }

    body.mobile-calendar-mode #calendarWrap #calToday,
    #calendarWrap.panel.cal-panel #calToday {
      position: absolute !important;
      top: 0 !important;
      right: 0 !important;
      left: auto !important;
      bottom: auto !important;
      transform: none !important;
      display: inline-grid !important;
      place-items: center !important;
      width: auto !important;
      min-width: 82px !important;
      height: 36px !important;
      min-height: 36px !important;
      padding: 0 12px !important;
      border: 1px solid #e8e8ec !important;
      border-radius: 6px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 14px !important;
      line-height: 1 !important;
      font-weight: 400 !important;
      white-space: nowrap !important;
      box-shadow: none !important;
      z-index: 2 !important;
    }

    /* Second row: prev — month — next */
    body.mobile-calendar-mode #calendarWrap .cal-head,
    #calendarWrap.panel.cal-panel .cal-head,
    body.mobile-calendar-mode #calendarWrap .cal-head.monthbar,
    #calendarWrap.panel.cal-panel .cal-head.monthbar {
      position: static !important;
      display: grid !important;
      grid-template-columns: 38px minmax(0, 1fr) 38px !important;
      align-items: center !important;
      gap: 10px !important;
      width: 100% !important;
      margin: 0 0 14px !important;
      padding: 0 !important;
    }

    body.mobile-calendar-mode #calendarWrap .cal-nav,
    #calendarWrap.panel.cal-panel .cal-nav,
    body.mobile-calendar-mode #calendarWrap .cal-head.monthbar .cal-nav,
    #calendarWrap.panel.cal-panel .cal-head.monthbar .cal-nav {
      display: contents !important;
    }

    body.mobile-calendar-mode #calendarWrap #calPrev,
    #calendarWrap.panel.cal-panel #calPrev,
    body.mobile-calendar-mode #calendarWrap #calNext,
    #calendarWrap.panel.cal-panel #calNext {
      position: static !important;
      inset: auto !important;
      transform: none !important;
      display: inline-grid !important;
      place-items: center !important;
      width: 38px !important;
      min-width: 38px !important;
      height: 34px !important;
      min-height: 34px !important;
      padding: 0 !important;
      border: 1px solid #e8e8ec !important;
      border-radius: 6px !important;
      background: #fff !important;
      color: #111 !important;
      font-size: 22px !important;
      line-height: 1 !important;
      font-weight: 400 !important;
      box-shadow: none !important;
      z-index: 1 !important;
    }

    body.mobile-calendar-mode #calendarWrap #calPrev,
    #calendarWrap.panel.cal-panel #calPrev {
      grid-column: 1 !important;
      justify-self: start !important;
    }

    body.mobile-calendar-mode #calendarWrap #calTitle,
    #calendarWrap.panel.cal-panel #calTitle,
    body.mobile-calendar-mode #calendarWrap .cal-title,
    #calendarWrap.panel.cal-panel .cal-title {
      grid-column: 2 !important;
      justify-self: stretch !important;
      min-width: 0 !important;
      text-align: center !important;
      font-size: 20px !important;
      line-height: 34px !important;
      font-weight: 900 !important;
      letter-spacing: -0.03em !important;
      color: #111 !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    body.mobile-calendar-mode #calendarWrap #calNext,
    #calendarWrap.panel.cal-panel #calNext {
      grid-column: 3 !important;
      justify-self: end !important;
    }

    /* The floating ▲/▼ caused the row to drift. Hide it in this visual layout. */
    body.mobile-calendar-mode #calendarWrap #calToggle,
    #calendarWrap.panel.cal-panel #calToggle,
    body.mobile-calendar-mode #calendarWrap .cal-head.monthbar #calToggle,
    #calendarWrap.panel.cal-panel .cal-head.monthbar #calToggle {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
      position: absolute !important;
      width: 0 !important;
      min-width: 0 !important;
      height: 0 !important;
      padding: 0 !important;
      border: 0 !important;
      overflow: hidden !important;
    }

    @media (max-width: 374px) {
      body.mobile-calendar-mode #calendarWrap h2,
      #calendarWrap.panel.cal-panel h2 {
        margin-right: 84px !important;
        font-size: 19px !important;
      }

      body.mobile-calendar-mode #calendarWrap #calToday,
      #calendarWrap.panel.cal-panel #calToday {
        min-width: 76px !important;
        padding: 0 10px !important;
        font-size: 13px !important;
      }

      body.mobile-calendar-mode #calendarWrap .cal-head,
      #calendarWrap.panel.cal-panel .cal-head {
        grid-template-columns: 36px minmax(0, 1fr) 36px !important;
        gap: 8px !important;
      }

      body.mobile-calendar-mode #calendarWrap #calPrev,
      #calendarWrap.panel.cal-panel #calPrev,
      body.mobile-calendar-mode #calendarWrap #calNext,
      #calendarWrap.panel.cal-panel #calNext {
        width: 36px !important;
        min-width: 36px !important;
      }
    }
  }

/* ===== crm-details-orders-match-month-v11 ===== */
  /* ===== V11: в разделе "Детализация" блок "Заказы" равен по высоте активному блоку детализации ===== */
  @media (min-width: 981px) {
    body.is-details-mode .orders-shell {
      display: flex !important;
      flex-direction: column !important;
      align-self: start !important;
      height: var(--crm-details-panel-height, auto) !important;
      min-height: var(--crm-details-panel-height, 0px) !important;
      max-height: var(--crm-details-panel-height, none) !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode .orders-shell .orders-title {
      flex: 0 0 auto !important;
    }

    body.is-details-mode .orders-shell #orders {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      height: auto !important;
      max-height: none !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
    }

    /* Перебивает старое правило, которое на ширине до 1300px сбрасывало высоту заказов в auto. */
    @media (max-width: 1300px) {
      body.is-details-mode .orders-shell {
        height: var(--crm-details-panel-height, auto) !important;
        min-height: var(--crm-details-panel-height, 0px) !important;
        max-height: var(--crm-details-panel-height, none) !important;
      }

      body.is-details-mode .orders-shell #orders {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
      }
    }
  }

/* ===== crm-details-orders-exact-height-v12 ===== */
  /* ===== V12: Заказы в детализации строго равны высоте блока "Итоги за месяц" ===== */
  @media (min-width: 981px) {
    body.is-details-mode #crmLayout {
      align-items: stretch !important;
      grid-auto-rows: auto !important;
    }

    body.is-details-mode #monthly-view,
    body.is-details-mode #details-view {
      align-self: start !important;
    }

    body.is-details-mode .orders-shell {
      align-self: stretch !important;
      display: flex !important;
      flex-direction: column !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }

    body.is-details-mode .orders-shell .orders-title {
      flex: 0 0 auto !important;
    }

    body.is-details-mode .orders-shell #orders {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      height: auto !important;
      max-height: none !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
    }
  }

/* ===== crm-employees-page-v2 ===== */
  /* ===== Employees page: clickable sidebar section + list + add/edit/protected details ===== */
  body.crm-employees-mode .tabs,
  body.crm-employees-mode .actions,
  body.crm-employees-mode .filters,
  body.crm-employees-mode .preview-content,
  body.crm-employees-mode #details-view,
  body.crm-employees-mode #monthly-view {
    display: none !important;
  }

  #employees-view {
    display: none;
    padding: 0 30px 36px;
  }

  body.crm-employees-mode #employees-view {
    display: block;
  }

  .employees-shell {
    width: min(1170px, 100%);
    margin: 0 auto;
    padding-top: 26px;
  }

  .employees-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
  }

  .employees-toolbar-title {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 900;
    letter-spacing: -0.03em;
  }

  .employees-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .employees-add-btn,
  .employees-refresh-btn {
    height: 40px;
    border-radius: 7px;
    border: 1px solid #e5e5e8;
    background: #fff;
    color: #111;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
  }

  .employees-add-btn {
    background: #000;
    color: #fff;
    border-color: #000;
    font-weight: 600;
  }

  .employees-view-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 14px;
  }

  .employees-view-tab {
    height: 34px;
    border-radius: 999px;
    border: 1px solid #e5e5e8;
    background: #fff;
    color: #777;
    padding: 0 13px;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
  }

  .employees-view-tab.active {
    background: #111;
    border-color: #111;
    color: #fff;
  }

  .employees-status {
    min-height: 20px;
    margin: 0 0 14px;
    color: #777;
    font-size: 14px;
  }

  .employees-status.error {
    color: #b00020;
  }

  .employees-list {
    border: 1px solid #ececf0;
    background: #fff;
  }

  .employee-row {
    position: relative;
    padding: 16px 18px 18px;
    border-bottom: 1px solid #f0f0f2;
    background: #fff;
    overflow: visible;
  }

  .employee-row:last-child {
    border-bottom: 0;
  }

  .employee-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
  }

  .employee-card-main {
    min-width: 0;
  }

  .employee-name {
    min-width: 0;
    margin: 0 0 10px;
    font-size: 18px;
    line-height: 1.25;
    font-weight: 800;
    color: #111;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .employee-position {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    border-radius: 5px;
    background: #f3f3f5;
    color: #6b6b73;
    padding: 0 10px;
    font-size: 13px;
    line-height: 1;
    white-space: nowrap;
  }

  .employee-position.hidden {
    background: #fff4f4;
    color: #d12b2b;
  }

  .employee-row .order-head-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    position: relative !important;
    flex: 0 0 auto;
  }

  .employee-expand-btn,
  .employee-row .dot-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid #ececf0 !important;
    background: #fff !important;
    display: inline-grid !important;
    place-items: center !important;
    box-shadow: none !important;
  }

  .employee-expand-btn img {
    width: 13px;
    height: 8px;
    display: block;
    transform: rotate(180deg);
    transition: transform .16s ease;
  }

  .employee-row.is-expanded .employee-expand-btn img {
    transform: rotate(0deg);
  }

  .employee-row .card-actions {
    position: static !important;
    margin: 0 !important;
  }

  .employee-row .dot-btn:after {
    content: '•••' !important;
    font-size: 12px !important;
    line-height: 1 !important;
    letter-spacing: 1px !important;
    color: #111 !important;
    transform: none !important;
  }

  .employee-row .dropdown {
    position: absolute !important;
    top: 52px !important;
    right: 18px !important;
    bottom: auto !important;
    left: auto !important;
    width: 190px !important;
    padding: 6px 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.12) !important;
    border: 1px solid #00000008 !important;
    background: #fff !important;
    z-index: 40 !important;
    display: none;
    overflow: hidden;
  }

  .employee-row .dropdown-action {
    height: 43px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    color: #7a7a82 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    background: #fff !important;
    border: 0 !important;
    width: 100% !important;
    text-align: left !important;
    cursor: pointer !important;
  }

  .employee-row .dropdown-action:hover {
    background: #f7f7f7 !important;
    color: #111 !important;
  }

  .employee-row .dropdown-action.danger {
    color: #d12b2b !important;
  }

  .employee-row .dropdown-action.restore {
    color: #167a2f !important;
  }

  .employee-row .dropdown-action .dropdown-action-mark {
    width: 18px;
    min-width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    font-size: 16px;
    line-height: 1;
    font-weight: 800;
  }

  .employee-expanded {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #f0f0f2;
    cursor: default;
  }

  .employee-expanded.loading,
  .employee-expanded.error {
    color: #777;
    font-size: 14px;
  }

  .employee-expanded.error {
    color: #b00020;
  }

  .employee-lock-box {
    width: min(520px, 100%);
    background: #f5f5f5;
    padding: 22px 24px;
    color: #111;
    box-sizing: border-box;
  }

  .employee-lock-title {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
    margin: 0 0 12px;
  }

  .employee-lock-text {
    font-size: 14px;
    line-height: 1.35;
    color: #666;
    margin: 0 0 14px;
  }

  .employee-lock-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
  }

  .employee-lock-row input {
    height: 42px;
    min-width: 0;
    width: 100%;
    border: 1px solid #e5e5e8;
    border-radius: 6px;
    background: #fff;
    color: #111;
    padding: 0 14px;
    font: inherit;
    box-sizing: border-box;
  }

  .employee-lock-row button {
    height: 42px;
    border: 1px solid #000;
    border-radius: 5px;
    background: #000;
    color: #fff;
    padding: 0 16px;
    font: inherit;
    cursor: pointer;
  }

  .employee-lock-error {
    min-height: 16px;
    margin-top: 9px;
    color: #b00020;
    font-size: 12px;
  }

  .employees-empty {
    padding: 34px 20px;
    text-align: center;
    color: #777;
    font-size: 14px;
    font-weight: 600;
  }

  #modal-employee .modal {
    width: min(940px, calc(100vw - 40px)) !important;
  }

  #modal-employee .employee-form-body {
    padding: 0 24px 6px;
  }

  #modal-employee .employee-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
  }

  #modal-employee .field label {
    position: static !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #666 !important;
    opacity: 1 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
  }

  #modal-employee .field.full {
    grid-column: 1 / -1;
  }

  #modal-employee .employee-form-error {
    min-height: 18px;
    color: #b00020;
    font-size: 13px;
    margin-top: 10px;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    #employees-view {
      padding: 0 14px 28px !important;
    }

    .employees-shell {
      padding-top: 14px;
    }

    .employees-toolbar {
      align-items: flex-start;
      flex-direction: column;
      gap: 10px;
    }

    .employees-toolbar-title {
      font-size: 20px;
    }

    .employees-toolbar-actions {
      width: 100%;
      justify-content: flex-start;
    }

    .employees-view-switch {
      gap: 6px;
    }

    .employees-view-tab {
      height: 32px;
      padding: 0 11px;
      font-size: 12px;
    }

    .employee-row {
      padding: 14px 0;
      border-left: 0;
      border-right: 0;
    }

    .employee-card-top {
      gap: 8px;
    }

    .employee-name {
      font-size: 16px;
      margin-bottom: 8px;
    }

    .employee-row .dropdown {
      top: 44px !important;
      right: 0 !important;
    }

    .employee-lock-row {
      grid-template-columns: 1fr;
    }

    .employees-list {
      border-left: 0;
      border-right: 0;
    }

    #modal-employee .modal {
      width: min(100vw - 24px, 940px) !important;
    }

    #modal-employee .employee-form-body {
      padding: 0 16px 6px !important;
    }

    #modal-employee .employee-form-grid {
      grid-template-columns: 1fr;
    }
  }

/* ===== crm-nav-allowed-only-fix ===== */
  /* Рабочие разделы сейчас: Заказы, Склад, Сотрудники и ЗП, Услуги и цены */
  #nav button.crm-nav-disabled {
    opacity: .45;
    cursor: default;
  }
  #nav button.crm-nav-disabled:hover {
    background: #fff;
    color: #707070;
  }

/* ===== crm-storage-placeholder-v1-style ===== */
  body.crm-storage-mode .tabs,
  body.crm-storage-mode .actions,
  body.crm-storage-mode .filters,
  body.crm-storage-mode .preview-content,
  body.crm-storage-mode #details-view,
  body.crm-storage-mode #monthly-view,
  body.crm-storage-mode #employees-view,
  body.crm-storage-mode #services-view { display: none !important; }
  #storage-view { display:none; padding: 0 30px 36px; }
  body.crm-storage-mode #storage-view { display:block; }
  .storage-placeholder { border:1px solid var(--line,#ececf0); border-radius:12px; padding:24px; background:#fff; max-width:980px; }
  .storage-placeholder h2 { margin:0 0 12px; font-size:24px; font-weight:900; }
  .storage-placeholder p { color:#666; line-height:1.5; margin:0; }

/* ===== crm-service-executors-inside-service-v1 ===== */
  .service-executors-box{
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px dashed #dedee5;
    border-radius: 8px;
    background: #fafafa;
  }
  .service-executors-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
  }
  .service-executors-list{
    display: grid;
    gap: 8px;
  }
  .service-executor-row{
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 8px;
    border: 1px solid #ececf0;
    border-radius: 7px;
    background: #fff;
  }
  .service-executor-row .executor-employee-cell{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
  }
  .service-executor-row .executor-picked{
    min-width: 0;
  }
  .cal-day.has-orders .cal-day-num,
  .cal-day.mute.has-orders .cal-day-num{
    color: #f23d85 !important;
    font-weight: 800;
  }
  @media (max-width: 720px){
    .service-executors-head,
    .service-executor-row,
    .service-executor-row .executor-employee-cell{
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .service-executors-head{
      display: grid;
    }
  }

/* ===== crm-order-executor-add-button-reference ===== */
  .modal .svc button.btn.svc-exec-add,
  .modal .svc button.btn.ed-svc-exec-add{
    width:202px !important;
    min-width:202px !important;
    max-width:100% !important;
    height:37px !important;
    min-height:37px !important;
    padding:0 9px !important;
    border:1px solid #d7d7dc !important;
    border-radius:5px !important;
    background:#fff !important;
    color:#68686b !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:6px !important;
    font-size:14px !important;
    line-height:1 !important;
    font-weight:400 !important;
    white-space:nowrap !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
  }
  .modal .svc button.btn.svc-exec-add:hover,
  .modal .svc button.btn.ed-svc-exec-add:hover{
    background:#fafafa !important;
  }
  .modal .svc button.btn.svc-exec-add .service-executor-add-icon,
  .modal .svc button.btn.ed-svc-exec-add .service-executor-add-icon{
    width:21px !important;
    height:21px !important;
    min-width:21px !important;
    display:block !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.5 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
    flex:0 0 21px !important;
  }

/* ===== crm-services-page-v2-design ===== */
  /* ===== Services & prices redesign v2: categories + service material rows ===== */
  body.crm-services-mode .tabs,
  body.crm-services-mode .actions,
  body.crm-services-mode .filters,
  body.crm-services-mode .preview-content,
  body.crm-services-mode #details-view,
  body.crm-services-mode #monthly-view,
  body.crm-services-mode #employees-view {
    display: none !important;
  }

  body.locked #services-view { display: none !important; }

  #services-view.crm-services-v2 {
    display: none;
    padding: 0 30px 48px;
  }

  body.crm-services-mode #services-view.crm-services-v2 { display: block !important; }

  .services-v2-shell {
    width: 100%;
    max-width: 1640px;
    margin: 0 auto;
    padding: 24px 0 0;
    color: #111;
  }

  .services-v2-topline {
    min-height: 50px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
  }

  .services-v2-category-head {
    position: relative;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }

  .services-v2-category-pick {
    min-width: 0;
    border: 0;
    background: transparent;
    color: #111;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 0;
    font: inherit;
    cursor: pointer;
  }

  .services-v2-chevron {
    width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 18px;
    color: #111;
  }

  .services-v2-chevron::before {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
  }

  .services-v2-category-pick.is-open .services-v2-chevron::before,
  .services-v2-service-toggle.is-open .services-v2-chevron::before {
    transform: rotate(225deg) translateY(-2px);
  }

  .services-v2-category-name {
    max-width: min(520px, 52vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 24px;
    line-height: 1.1;
    font-weight: 900;
    letter-spacing: -0.03em;
  }

  .services-v2-icon-btn {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #111;
    padding: 0;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    border-radius: 6px;
  }
  .services-v2-icon-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .services-v2-icon-btn:hover { background: #f5f5f7; }
  .services-v2-icon-btn:disabled { opacity: .35; cursor: default; }

  .services-v2-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
  }

  .services-v2-btn {
    min-height: 46px;
    border: 1px solid #e7e7eb;
    border-radius: 7px;
    background: #f6f6f7;
    color: #111;
    padding: 0 18px;
    font: inherit;
    font-size: 15px;
    font-weight: 650;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    white-space: nowrap;
    cursor: pointer;
  }
  .services-v2-btn.black { background: #000; border-color: #000; color: #fff; }
  .services-v2-btn:disabled { opacity: .45; cursor: default; }
  .services-v2-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

  .services-v2-status {
    min-height: 20px;
    margin: -4px 0 20px;
    color: #777;
    font-size: 14px;
    line-height: 1.35;
  }
  .services-v2-status.error { color: #b00020; }

  .services-v2-category-menu {
    position: absolute;
    left: 0;
    top: calc(100% + 10px);
    width: 360px;
    max-width: calc(100vw - 72px);
    background: #fff;
    border: 1px solid #ececf0;
    border-radius: 8px;
    box-shadow: 0 18px 40px rgba(0,0,0,.12);
    z-index: 35;
    overflow: hidden;
    padding: 6px 0;
  }
  .services-v2-category-menu button {
    width: 100%;
    height: 44px;
    border: 0;
    background: #fff;
    color: #111;
    text-align: left;
    padding: 0 16px;
    font: inherit;
    font-size: 15px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .services-v2-category-menu button:hover,
  .services-v2-category-menu button.active { background: #f5f5f7; }

  .services-v2-list {
    width: min(1260px, 100%);
    margin: 34px auto 0;
    display: grid;
    gap: 12px;
  }

  .services-v2-service-card {
    border: 1px solid #ececf0;
    background: #fff;
    border-radius: 0;
    overflow: hidden;
  }
  .services-v2-service-card.is-disabled { opacity: .42; }

  .services-v2-service-head {
    min-height: 70px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 0 22px;
  }

  .services-v2-service-toggle {
    min-width: 0;
    border: 0;
    background: transparent;
    color: #111;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 18px;
    font: inherit;
    cursor: pointer;
    text-align: left;
  }

  .services-v2-service-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -0.02em;
  }

  .services-v2-service-actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    position: relative;
  }

  .services-v2-switch {
    width: 48px;
    height: 24px;
    padding: 2px;
    border: 1px solid #ececf0;
    border-radius: 999px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
  }
  .services-v2-switch::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: #bdbdc4;
    transition: transform .16s ease, background .16s ease;
  }
  .services-v2-switch.is-on::before { transform: translateX(22px); background: #000; }

  .services-v2-service-body {
    border-top: 1px solid #f0f0f2;
    padding: 24px 26px 30px;
  }
  .services-v2-section-title {
    margin: 0 0 18px;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 900;
  }
  .services-v2-info {
    display: grid;
    gap: 16px;
    margin-bottom: 34px;
  }
  .services-v2-info-item span {
    display: block;
    color: #8a8a92;
    font-size: 13px;
    line-height: 1.2;
    margin-bottom: 7px;
  }
  .services-v2-info-item b,
  .services-v2-info-item p {
    display: block;
    margin: 0;
    color: #111;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 500;
  }

  .services-v2-price-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
  }
  .services-v2-price-table th,
  .services-v2-price-table td {
    border-bottom: 1px solid #f0f0f2;
    border-right: 1px solid #f4f4f6;
    padding: 14px 12px;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    line-height: 1.25;
  }
  .services-v2-price-table th:last-child,
  .services-v2-price-table td:last-child { border-right: 0; }
  .services-v2-price-table th { background: #fbfbfc; font-weight: 900; }
  .services-v2-price-table td:first-child { font-weight: 800; }
  .services-v2-total-cell { font-weight: 900; }

  .services-v2-add-service-row {
    margin: 32px auto 0;
    display: flex;
    justify-content: center;
  }

  .services-v2-empty {
    min-height: 520px;
    display: grid;
    place-items: center;
    text-align: center;
    color: #111;
  }
  .services-v2-empty h3 { margin: 0 0 16px; font-size: 20px; line-height: 1.2; font-weight: 900; }
  .services-v2-empty p { margin: 0 0 26px; color: #111; font-size: 15px; line-height: 1.35; }

  .services-v2-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 4100;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 70px 24px 40px;
    background: rgba(0,0,0,.62);
    overflow: auto;
  }
  .services-v2-modal {
    width: min(920px, calc(100vw - 48px));
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 24px 70px rgba(0,0,0,.22);
    overflow: hidden;
  }
  .services-v2-modal.small { width: min(720px, calc(100vw - 48px)); }
  .services-v2-modal-head {
    min-height: 74px;
    border-bottom: 1px solid #ececf0;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 0 18px 0 28px;
  }
  .services-v2-modal-title { text-align: center; font-size: 24px; line-height: 1.15; font-weight: 900; letter-spacing: -0.03em; }
  .services-v2-modal-close {
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    color: #777;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
  }
  .services-v2-modal-body { padding: 34px 42px 24px; }
  .services-v2-modal-foot {
    padding: 0 42px 34px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
  }
  .services-v2-form-section { margin: 0 0 30px; }
  .services-v2-form-section h3 { margin: 0 0 16px; font-size: 17px; line-height: 1.2; font-weight: 900; }
  .services-v2-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 28px; }
  .services-v2-field { min-width: 0; }
  .services-v2-field.full { grid-column: 1 / -1; }
  .services-v2-field label { display: block; margin-bottom: 8px; color: #111; font-size: 13px; line-height: 1.2; font-weight: 500; }
  .services-v2-field input,
  .services-v2-field select,
  .services-v2-field textarea {
    width: 100%;
    border: 1px solid #e5e5e8;
    border-radius: 7px;
    background: #fff;
    color: #111;
    padding: 0 14px;
    outline: 0;
    font: inherit;
    box-sizing: border-box;
  }
  .services-v2-field input,
  .services-v2-field select { height: 54px; }
  .services-v2-field textarea { min-height: 92px; padding-top: 14px; resize: vertical; }

  .services-v2-material-editor {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fbfbfc;
  }
  .services-v2-material-editor th,
  .services-v2-material-editor td {
    border-bottom: 1px solid #f0f0f2;
    border-right: 1px solid #f0f0f2;
    padding: 10px;
    text-align: center;
    vertical-align: middle;
  }
  .services-v2-material-editor th:last-child,
  .services-v2-material-editor td:last-child { border-right: 0; }
  .services-v2-material-editor th { font-size: 14px; line-height: 1.2; font-weight: 900; background: #fbfbfc; }
  .services-v2-material-editor input {
    width: 100%;
    height: 48px;
    border: 1px solid #e5e5e8;
    border-radius: 7px;
    background: #fff;
    color: #111;
    padding: 0 12px;
    font: inherit;
    box-sizing: border-box;
  }
  .services-v2-material-total { font-weight: 900; white-space: nowrap; }
  .services-v2-material-remove { width: 34px; height: 34px; border: 0; background: transparent; color: #777; font-size: 22px; cursor: pointer; }
  .services-v2-add-material { width: 100%; height: 58px; border: 0; background: #fbfbfc; color: #111; font: inherit; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; }

  .services-v2-toggle-row {
    min-height: 56px;
    border: 1px solid #ececf0;
    border-radius: 7px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #111;
  }
  .services-v2-toggle-row.disabled { opacity: .45; }
  .services-v2-form-error { min-height: 18px; color: #b00020; font-size: 13px; margin-top: -10px; }

  .services-v2-category-list { display: grid; gap: 12px; }
  .services-v2-category-list-item { border: 1px solid #ececf0; background: #fff; }
  .services-v2-category-list-head { min-height: 66px; padding: 0 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; }
  .services-v2-category-list-title { display: inline-flex; align-items: center; gap: 14px; min-width: 0; font-size: 20px; font-weight: 900; }
  .services-v2-category-list-services { padding: 0 24px 20px 62px; }
  .services-v2-category-list-services span:first-child { display: block; margin-bottom: 12px; color: #111; font-size: 14px; }
  .services-v2-service-tags { display: flex; flex-wrap: wrap; gap: 8px; }
  .services-v2-service-tag { min-height: 46px; padding: 0 20px; display: inline-flex; align-items: center; background: #fbfbfc; font-size: 14px; font-weight: 800; }

  @media (max-width: 900px) {
    #services-view.crm-services-v2 { padding: 0 14px 32px; }
    .services-v2-topline { grid-template-columns: 1fr; }
    .services-v2-actions { justify-content: flex-start; }
    .services-v2-btn { min-height: 42px; padding: 0 14px; font-size: 14px; }
    .services-v2-category-name { font-size: 22px; max-width: 70vw; }
    .services-v2-list { margin-top: 22px; }
    .services-v2-service-head { padding: 0 14px; }
    .services-v2-service-title { font-size: 17px; }
    .services-v2-service-body { padding: 18px 14px 22px; overflow-x: auto; }
    .services-v2-price-table { min-width: 680px; }
    .services-v2-form-grid { grid-template-columns: 1fr; }
    .services-v2-modal { width: min(100vw - 20px, 920px); }
    .services-v2-modal-body { padding: 24px 18px 18px; }
    .services-v2-modal-foot { padding: 0 18px 24px; }
    .services-v2-material-editor { min-width: 720px; }
    .services-v2-material-table-wrap { overflow-x: auto; }
  }

/* ===== crm-services-v2-final-fixes ===== */
  /* Final fixes for redesigned "Услуги и цены" section */
  body.crm-services-mode #services-view.crm-services-v2 {
    zoom: .75;
  }

  /* Keep modals compact without breaking old order modals */
  body.crm-services-mode .services-v2-modal {
    zoom: .75;
  }

  .services-v2-modal-backdrop {
    padding-top: 92px !important;
  }

  .services-v2-modal-head {
    min-height: 74px !important;
    grid-template-columns: 36px minmax(0, 1fr) 36px !important;
    padding: 0 18px !important;
  }
  .services-v2-modal-title {
    grid-column: 2 !important;
    text-align: center !important;
  }
  .services-v2-modal-close {
    grid-column: 3 !important;
    justify-self: end !important;
  }

  .services-v2-modal.category {
    width: min(900px, calc(100vw - 48px)) !important;
    border-radius: 8px !important;
  }
  .services-v2-modal.category .services-v2-modal-body {
    padding: 58px 46px 32px !important;
  }
  .services-v2-modal.category .services-v2-modal-foot {
    padding: 0 46px 54px !important;
  }
  .services-v2-modal.category .services-v2-field input {
    height: 56px !important;
    font-size: 16px !important;
  }

  /* Category picker must open like the design dropdown */
  .services-v2-category-pick {
    user-select: none !important;
  }
  .services-v2-category-menu {
    width: 292px !important;
    top: calc(100% + 8px) !important;
    border-radius: 7px !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.10) !important;
  }
  .services-v2-category-menu button {
    height: 42px !important;
    font-size: 14px !important;
  }

  /* Important: inline plus SVG inside "Добавить материал" must not render as a huge black SVG */
  .services-v2-add-material svg,
  .services-v2-empty .services-v2-btn svg,
  .services-v2-modal .services-v2-btn svg,
  .services-v2-actions .services-v2-btn svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    display: block !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  .services-v2-add-material {
    font-size: 14px !important;
  }

  /* Compact service modal table */
  .services-v2-material-editor th,
  .services-v2-material-editor td {
    padding: 8px !important;
  }
  .services-v2-material-editor input {
    height: 42px !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.crm-services-mode #services-view.crm-services-v2,
    body.crm-services-mode .services-v2-modal {
      zoom: 1;
    }
  }

/* ===== crm-services-v4-critical-fixes ===== */
  /* V4 critical: category dropdown + category modal must sit above everything */
  body.crm-services-mode #services-view.crm-services-v2 {
    position: relative !important;
    z-index: 5 !important;
    transform-origin: top left !important;
  }

  body.crm-services-mode .services-v2-topline,
  body.crm-services-mode .services-v2-category-head {
    overflow: visible !important;
    position: relative !important;
    z-index: 50 !important;
  }

  body.crm-services-mode .services-v2-category-pick,
  body.crm-services-mode .services-v2-category-pick * {
    pointer-events: auto !important;
  }

  body.crm-services-mode .services-v2-category-menu {
    display: block !important;
    z-index: 9999 !important;
    pointer-events: auto !important;
  }

  .services-v2-category-safe-backdrop,
  .services-v2-modal-backdrop {
    z-index: 99999 !important;
  }

  .services-v2-category-safe-modal {
    display: block !important;
    position: relative !important;
    width: min(900px, calc(100vw - 48px)) !important;
    max-width: calc(100vw - 48px) !important;
    background: #fff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  .services-v2-category-safe-modal form,
  .services-v2-category-safe-modal .services-v2-modal-body,
  .services-v2-category-safe-modal .services-v2-modal-foot,
  .services-v2-category-safe-modal .services-v2-field {
    display: block !important;
    position: static !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .services-v2-category-safe-modal .services-v2-modal-foot {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }

  .services-v2-category-safe-modal input {
    display: block !important;
    width: 100% !important;
    height: 56px !important;
    box-sizing: border-box !important;
  }

  .services-v2-add-material svg,
  .services-v2-add-material svg *,
  .services-v2-btn svg,
  .services-v2-btn svg * {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
  }

  .services-v2-add-material svg,
  .services-v2-btn svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
  }

/* ===== crm-user-request-20260705-final-fixes ===== */
  /* ===== 05.07 user fixes: Services & prices scale/design, category list grid, storage nav, expanded order font ===== */

  /* 1) Services & prices: +20% over previous .75 scale -> .90. Top app bar is not touched. */
  @media (min-width: 981px) {
    body.crm-services-mode #services-view.crm-services-v2 {
      zoom: .9 !important;
      transform-origin: top center !important;
    }
    body.crm-services-mode .services-v2-modal {
      zoom: .9 !important;
      transform-origin: top center !important;
    }
  }

  /* 2) Services page brought closer to the design mockup. */
  body.crm-services-mode #services-view.crm-services-v2 {
    padding: 0 34px 58px !important;
  }
  body.crm-services-mode .services-v2-shell {
    max-width: 1760px !important;
    padding-top: 24px !important;
  }
  body.crm-services-mode .services-v2-topline {
    min-height: 56px !important;
    align-items: center !important;
    margin-bottom: 14px !important;
  }
  body.crm-services-mode .services-v2-status {
    margin: -2px 0 20px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
  }
  body.crm-services-mode .services-v2-category-name {
    font-size: 28px !important;
    line-height: 1.12 !important;
    letter-spacing: -0.035em !important;
  }
  body.crm-services-mode .services-v2-list {
    width: min(1260px, 100%) !important;
    margin: 34px auto 0 !important;
    gap: 12px !important;
  }
  body.crm-services-mode .services-v2-service-card {
    border: 1px solid #ececf0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body.crm-services-mode .services-v2-service-head {
    min-height: 70px !important;
    padding: 0 22px !important;
  }
  body.crm-services-mode .services-v2-service-title {
    font-size: 21px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
  }
  body.crm-services-mode .services-v2-service-body {
    padding: 24px 26px 30px !important;
    background: #fff !important;
  }
  body.crm-services-mode .services-v2-section-title {
    font-size: 17px !important;
    margin-bottom: 18px !important;
  }
  body.crm-services-mode .services-v2-info-item span {
    font-size: 14px !important;
    color: #8a8a92 !important;
  }
  body.crm-services-mode .services-v2-info-item b,
  body.crm-services-mode .services-v2-info-item p {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
  body.crm-services-mode .services-v2-price-table th,
  body.crm-services-mode .services-v2-price-table td {
    padding: 15px 14px !important;
    font-size: 15px !important;
  }
  body.crm-services-mode .services-v2-add-service-row {
    margin-top: 32px !important;
  }

  /* Buttons like the Figma state. */
  body.crm-services-mode .services-v2-actions {
    gap: 10px !important;
  }
  body.crm-services-mode .services-v2-btn {
    min-height: 46px !important;
    border-radius: 7px !important;
    padding: 0 18px !important;
    font-size: 15px !important;
    font-weight: 650 !important;
  }
  body.crm-services-mode .services-v2-btn.black {
    background: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
  }

  /* 4) Category list modal: straight, even service chips. */
  .services-v2-modal-backdrop {
    padding-top: 72px !important;
  }
  .services-v2-modal:not(.category) {
    width: min(1060px, calc(100vw - 64px)) !important;
    border-radius: 8px !important;
  }
  .services-v2-modal:not(.category) .services-v2-modal-head {
    min-height: 82px !important;
    grid-template-columns: 36px minmax(0, 1fr) 36px !important;
    padding: 0 20px !important;
  }
  .services-v2-modal:not(.category) .services-v2-modal-title {
    grid-column: 2 !important;
    text-align: center !important;
    font-size: 28px !important;
    line-height: 1.15 !important;
  }
  .services-v2-modal:not(.category) .services-v2-modal-close {
    grid-column: 3 !important;
    justify-self: end !important;
  }
  .services-v2-modal:not(.category) .services-v2-modal-body {
    padding: 46px 48px 44px !important;
  }
  .services-v2-category-list {
    gap: 12px !important;
  }
  .services-v2-category-list-item {
    border: 1px solid #ececf0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    overflow: hidden !important;
  }
  .services-v2-category-list-head {
    min-height: 72px !important;
    padding: 0 26px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  .services-v2-category-list-title {
    gap: 18px !important;
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
  }
  .services-v2-category-list-services {
    padding: 0 28px 24px 70px !important;
  }
  .services-v2-category-list-services > span:first-child {
    margin: 0 0 14px !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
  }
  .services-v2-service-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    width: 100% !important;
  }
  .services-v2-service-tag {
    height: 48px !important;
    min-height: 48px !important;
    max-width: 100% !important;
    padding: 0 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fbfbfc !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #111 !important;
    font-size: 15px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-sizing: border-box !important;
  }
  .services-v2-chevron.is-open::before {
    transform: rotate(225deg) translateY(-2px) !important;
  }

  /* 5) Expanded order details: +1pt. */
  .order-expanded {
    font-size: 15px !important;
    line-height: 1.38 !important;
  }
  .expanded-title {
    font-size: 19px !important;
  }
  .expanded-section-title {
    font-size: 15px !important;
  }
  .expanded-kv,
  .expanded-service,
  .expanded-executors,
  .expanded-empty {
    font-size: 15px !important;
  }
  .expanded-service-note {
    font-size: 14px !important;
  }
  .expanded-contact {
    font-size: 14px !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.crm-services-mode #services-view.crm-services-v2,
    body.crm-services-mode .services-v2-modal {
      zoom: 1 !important;
    }
    body.crm-services-mode #services-view.crm-services-v2 {
      padding: 0 14px 34px !important;
    }
    body.crm-services-mode .services-v2-category-name {
      font-size: 23px !important;
    }
    .services-v2-modal:not(.category) {
      width: min(100vw - 20px, 1060px) !important;
    }
    .services-v2-modal:not(.category) .services-v2-modal-body {
      padding: 24px 18px 22px !important;
    }
    .services-v2-category-list-services {
      padding: 0 16px 20px 46px !important;
    }
    .services-v2-service-tag {
      width: 100% !important;
      justify-content: flex-start !important;
      padding: 0 16px !important;
    }
    .expanded-title { font-size: 17px !important; }
    .expanded-section-title,
    .expanded-kv,
    .expanded-service,
    .expanded-executors,
    .expanded-empty { font-size: 14px !important; }
    .expanded-service-note { font-size: 13px !important; }
  }

/* ===== crm-services-align-under-title-v2 ===== */
  /* Правка: на странице «Услуги и цены» контент начинается ровно под заголовком, без серой полосы. */
  body.crm-services-mode .head {
    border-bottom: 0 !important;
  }

  body.crm-services-mode #services-view.crm-services-v2 {
    padding-left: 0 !important;
  }

  body.crm-services-mode .services-v2-shell {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
  }

  body.crm-services-mode .services-v2-topline,
  body.crm-services-mode .services-v2-status,
  body.crm-services-mode .services-v2-list,
  body.crm-services-mode .services-v2-add-service-row,
  body.crm-services-mode .services-v2-empty {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.crm-services-mode .services-v2-list {
    width: min(1260px, 100%) !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.crm-services-mode #services-view.crm-services-v2 {
      padding-left: 0 !important;
      padding-right: 14px !important;
    }
  }

/* ===== crm-services-top-panel-reference-fix-v3 ===== */
  /* Верхняя панель страницы «Услуги и цены» как в референсе:
     заголовок сверху, ниже строка категории + кнопки, всё по одной левой линии. */
  body.crm-services-mode .head {
    border-bottom: 0 !important;
    padding: 24px 30px 12px !important;
  }

  body.crm-services-mode .head h1 {
    margin: 0 !important;
  }

  body.crm-services-mode #services-view.crm-services-v2 {
    padding: 0 30px 48px !important;
  }

  body.crm-services-mode .services-v2-shell {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.crm-services-mode .services-v2-topline {
    min-height: 64px !important;
    margin: 0 !important;
    padding: 0 0 18px !important;
    border-bottom: 1px solid #ececf0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
  }

  body.crm-services-mode .services-v2-category-head {
    min-width: 0 !important;
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
  }

  body.crm-services-mode .services-v2-category-pick {
    min-height: 46px !important;
    align-items: center !important;
  }

  body.crm-services-mode .services-v2-category-name {
    font-size: 24px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    letter-spacing: -0.03em !important;
  }

  body.crm-services-mode .services-v2-actions {
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;
  }

  body.crm-services-mode .services-v2-status {
    margin: 0 !important;
    min-height: 0 !important;
  }

  body.crm-services-mode .services-v2-list {
    width: min(1260px, 100%) !important;
    margin: 24px 0 0 !important;
  }

  body.crm-services-mode .services-v2-add-service-row,
  body.crm-services-mode .services-v2-empty {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.crm-services-mode .head {
      padding: 18px 14px 10px !important;
    }

    body.crm-services-mode #services-view.crm-services-v2 {
      padding: 0 14px 28px !important;
    }

    body.crm-services-mode .services-v2-topline {
      grid-template-columns: 1fr !important;
      align-items: flex-start !important;
      gap: 12px !important;
      padding-bottom: 14px !important;
    }

    body.crm-services-mode .services-v2-actions {
      justify-content: flex-start !important;
      flex-wrap: wrap !important;
    }

    body.crm-services-mode .services-v2-category-name {
      font-size: 21px !important;
    }
  }

/* ===== crm-services-content-center-under-line-v4 ===== */
  /* Центрируем всё, что находится под серой линией: карточки услуг и кнопку добавления услуги. */
  body.crm-services-mode .services-v2-list {
    width: min(1260px, 100%) !important;
    margin: 24px auto 0 !important;
  }

  body.crm-services-mode .services-v2-add-service-row {
    width: min(1260px, 100%) !important;
    margin: 32px auto 0 !important;
    display: flex !important;
    justify-content: center !important;
  }

  body.crm-services-mode .services-v2-empty {
    width: min(1260px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  @media (max-width: 980px), (hover: none) and (pointer: coarse) {
    body.crm-services-mode .services-v2-list,
    body.crm-services-mode .services-v2-add-service-row,
    body.crm-services-mode .services-v2-empty {
      width: 100% !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }

    body.crm-services-mode .services-v2-add-service-row {
      justify-content: center !important;
    }
  }

/* ===== crm-auto-base-page-v1-design ===== */
  /* ===== База авто: страница управления марками и моделями ===== */
  body.crm-auto-mode .tabs,
  body.crm-auto-mode .actions,
  body.crm-auto-mode .filters,
  body.crm-auto-mode .preview-content,
  body.crm-auto-mode #details-view,
  body.crm-auto-mode #monthly-view,
  body.crm-auto-mode #employees-view,
  body.crm-auto-mode #services-view,
  body.crm-auto-mode #storage-view { display: none !important; }
  body.crm-storage-mode #auto-base-view,
  body.crm-services-mode #auto-base-view,
  body.crm-employees-mode #auto-base-view,
  body.locked #auto-base-view { display:none !important; }

  #auto-base-view.crm-auto-v1 { display:none; padding:0 34px 58px; }
  body.crm-auto-mode #auto-base-view.crm-auto-v1 { display:block !important; }
  body.crm-auto-mode .head { border-bottom:0 !important; }

  .auto-v1-shell { width:100%; max-width:1760px; margin:0 auto; padding:24px 0 0; color:#111; }
  .auto-v1-topline { min-height:56px; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:16px; align-items:center; margin-bottom:14px; }
  .auto-v1-brand-head { position:relative; min-width:0; display:inline-flex; align-items:center; gap:12px; }
  .auto-v1-brand-pick { min-width:0; border:0; background:transparent; color:#111; display:inline-flex; align-items:center; gap:12px; padding:0; font:inherit; cursor:pointer; }
  .auto-v1-chevron { width:18px; height:18px; display:inline-grid; place-items:center; flex:0 0 18px; color:#111; }
  .auto-v1-chevron::before { content:''; width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-2px); }
  .auto-v1-brand-pick.is-open .auto-v1-chevron::before,
  .auto-v1-model-toggle.is-open .auto-v1-chevron::before,
  .auto-v1-chevron.is-open::before { transform:rotate(225deg) translateY(-2px); }
  .auto-v1-brand-name { max-width:min(520px,52vw); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:28px; line-height:1.12; font-weight:900; letter-spacing:-.035em; }
  .auto-v1-icon-btn { width:30px; height:30px; border:0; background:transparent; color:#111; padding:0; display:inline-grid; place-items:center; cursor:pointer; border-radius:6px; }
  .auto-v1-icon-btn svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
  .auto-v1-icon-btn:hover { background:#f5f5f7; }
  .auto-v1-icon-btn:disabled { opacity:.35; cursor:default; }
  .auto-v1-actions { display:inline-flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
  .auto-v1-btn { min-height:46px; border:1px solid #e7e7eb; border-radius:7px; background:#f6f6f7; color:#111; padding:0 18px; font:inherit; font-size:15px; font-weight:650; display:inline-flex; align-items:center; justify-content:center; gap:9px; white-space:nowrap; cursor:pointer; }
  .auto-v1-btn.black { background:#000; border-color:#000; color:#fff; }
  .auto-v1-btn:disabled { opacity:.45; cursor:default; }
  .auto-v1-status { min-height:20px; margin:-2px 0 20px; color:#777; font-size:14px; line-height:1.35; }
  .auto-v1-status.error { color:#b00020; }
  .auto-v1-brand-menu { position:absolute; left:0; top:calc(100% + 10px); width:360px; max-width:calc(100vw - 72px); background:#fff; border:1px solid #ececf0; border-radius:8px; box-shadow:0 18px 40px rgba(0,0,0,.12); z-index:35; overflow:hidden; padding:6px 0; }
  .auto-v1-brand-menu button { width:100%; height:44px; border:0; background:#fff; color:#111; text-align:left; padding:0 16px; font:inherit; font-size:15px; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .auto-v1-brand-menu button:hover,
  .auto-v1-brand-menu button.active { background:#f5f5f7; }
  .auto-v1-list { width:min(1260px,100%); margin:34px auto 0; display:grid; gap:12px; }
  .auto-v1-model-card { border:1px solid #ececf0; background:#fff; border-radius:0; overflow:hidden; }
  .auto-v1-model-head { min-height:70px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; padding:0 22px; }
  .auto-v1-model-toggle { min-width:0; border:0; background:transparent; color:#111; padding:0; display:inline-flex; align-items:center; gap:18px; font:inherit; cursor:default; text-align:left; }
  .auto-v1-model-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:21px; line-height:1.2; font-weight:900; letter-spacing:-.02em; }
  .auto-v1-model-actions { display:inline-flex; align-items:center; gap:10px; position:relative; }
  .auto-v1-model-body { border-top:1px solid #f0f0f2; padding:24px 26px 30px; background:#fff; }
  .auto-v1-info { display:grid; gap:16px; }
  .auto-v1-info-item span { display:block; color:#8a8a92; font-size:14px; line-height:1.2; margin-bottom:7px; }
  .auto-v1-info-item b { display:block; color:#111; font-size:16px; line-height:1.4; font-weight:500; }
  .auto-v1-add-model-row { margin:32px auto 0; display:flex; justify-content:center; }
  .auto-v1-empty { min-height:520px; display:grid; place-items:center; text-align:center; color:#111; }
  .auto-v1-empty h3 { margin:0 0 16px; font-size:20px; line-height:1.2; font-weight:900; }
  .auto-v1-empty p { margin:0 0 26px; color:#111; font-size:15px; line-height:1.35; }

  .auto-v1-modal-backdrop { position:fixed; inset:0; z-index:4200; display:flex; align-items:flex-start; justify-content:center; padding:72px 24px 40px; background:rgba(0,0,0,.62); overflow:auto; }
  .auto-v1-modal { width:min(720px, calc(100vw - 48px)); background:#fff; border-radius:8px; box-shadow:0 24px 70px rgba(0,0,0,.22); overflow:hidden; }
  .auto-v1-modal.wide { width:min(1060px, calc(100vw - 64px)); }
  .auto-v1-modal-head { min-height:82px; border-bottom:1px solid #ececf0; display:grid; grid-template-columns:36px minmax(0,1fr) 36px; gap:12px; align-items:center; padding:0 20px; }
  .auto-v1-modal-title { grid-column:2; text-align:center; font-size:28px; line-height:1.15; font-weight:900; letter-spacing:-.03em; }
  .auto-v1-modal-close { grid-column:3; justify-self:end; width:36px; height:36px; border:0; background:transparent; color:#777; font-size:28px; line-height:1; cursor:pointer; }
  .auto-v1-modal-body { padding:46px 48px 30px; }
  .auto-v1-modal-foot { padding:0 48px 44px; display:flex; justify-content:flex-end; gap:10px; }
  .auto-v1-field { min-width:0; margin-bottom:16px; }
  .auto-v1-field label { display:block; margin-bottom:8px; color:#111; font-size:13px; line-height:1.2; font-weight:600; }
  .auto-v1-field input,
  .auto-v1-field select { width:100%; height:48px; border:1px solid #e5e5e8; border-radius:6px; background:#fff; color:#111; padding:0 14px; outline:0; font:inherit; }
  .auto-v1-error { min-height:18px; color:#b00020; font-size:13px; margin-top:4px; }
  .auto-v1-brand-list { display:grid; gap:12px; }
  .auto-v1-brand-list-item { border:1px solid #ececf0; border-radius:0; background:#fff; overflow:hidden; }
  .auto-v1-brand-list-head { min-height:72px; padding:0 26px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:center; }
  .auto-v1-brand-list-title { min-width:0; display:flex; align-items:center; gap:18px; font-size:22px; line-height:1.2; font-weight:900; }
  .auto-v1-brand-list-title span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .auto-v1-brand-list-models { padding:0 28px 24px 70px; }
  .auto-v1-brand-list-models > span:first-child { display:block; margin:0 0 14px; font-size:16px; line-height:1.2; font-weight:800; }
  .auto-v1-model-tags { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:flex-start; gap:6px; width:100%; }
  .auto-v1-model-tag { height:48px; min-height:48px; max-width:100%; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; background:#fbfbfc; border:0; border-radius:0; color:#111; font-size:15px; line-height:1; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box; }

  @media (min-width:981px){ body.crm-auto-mode #auto-base-view.crm-auto-v1 { zoom:.9; transform-origin:top center; } }
  @media (max-width:980px), (hover:none) and (pointer:coarse) {
    #auto-base-view.crm-auto-v1 { padding:0 14px 34px; }
    .auto-v1-topline { grid-template-columns:1fr; align-items:start; }
    .auto-v1-actions { justify-content:flex-start; }
    .auto-v1-brand-name { font-size:23px; }
    .auto-v1-modal { width:min(100vw - 20px, 1060px); }
    .auto-v1-modal-body { padding:24px 18px 22px; }
    .auto-v1-modal-foot { padding:0 18px 24px; }
    .auto-v1-brand-list-models { padding:0 16px 20px 46px; }
    .auto-v1-model-tag { width:100%; justify-content:flex-start; padding:0 16px; }
  }

/* ===== crm-settings-page-v1-design ===== */
  body.crm-settings-mode .tabs,
  body.crm-settings-mode .actions,
  body.crm-settings-mode .filters,
  body.crm-settings-mode .preview-content,
  body.crm-settings-mode #details-view,
  body.crm-settings-mode #monthly-view,
  body.crm-settings-mode #employees-view,
  body.crm-settings-mode #services-view,
  body.crm-settings-mode #storage-view,
  body.crm-settings-mode #auto-base-view { display:none !important; }

  #settings-view { display:none; padding:0 32px 64px; color:#151515; }
  body.crm-settings-mode #settings-view { display:block; }
  body.crm-settings-mode .head {
    display:block;
    padding:24px 40px 20px;
    min-height:76px;
    border-bottom:1px solid var(--line,#ececf0) !important;
  }
  body.crm-settings-mode .head > div:first-child > *:not(h1),
  body.crm-settings-mode .head > :not(:first-child) { display:none !important; }
  body.crm-settings-mode .head h1 {
    margin:0;
    font-size:32px;
    line-height:1;
    letter-spacing:-.035em;
  }
  .settings-v1-layout {
    width:100%;
    max-width:1780px;
    margin:0 auto;
    padding:50px 0 0;
    display:grid;
    grid-template-columns:290px minmax(0,1fr);
    gap:44px;
    align-items:start;
  }
  .settings-v1-menu { display:grid; gap:0; padding:0 4px; }
  .settings-v1-menu-btn {
    min-height:44px;
    padding:0;
    border:0;
    background:transparent;
    color:#c1c1c4;
    text-align:left;
    font-size:19px;
    line-height:1.25;
    font-weight:700;
    cursor:pointer;
  }
  .settings-v1-menu-btn.active { color:#111; }
  .settings-v1-content { min-width:0; }
  .settings-v1-panel {
    border:1px solid var(--line,#ececf0);
    background:#fff;
    padding:24px 28px 28px;
  }
  .settings-v1-panel-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    margin-bottom:28px;
  }
  .settings-v1-panel-head h2 {
    margin:0 0 7px;
    font-size:21px;
    line-height:1.2;
    font-weight:850;
  }
  .settings-v1-subtitle { color:#999; font-size:14px; line-height:1.4; }
  .settings-v1-btn {
    min-height:44px;
    border:0;
    border-radius:7px;
    background:#f4f4f5;
    color:#111;
    padding:0 18px;
    font-size:15px;
    font-weight:700;
    white-space:nowrap;
  }
  .settings-v1-save {
    min-width:146px;
    height:48px;
    margin-top:28px;
    border:0;
    border-radius:7px;
    background:#000;
    color:#fff;
    padding:0 24px;
    font-size:15px;
  }
  .settings-v1-form-section + .settings-v1-form-section { margin-top:36px; }
  .settings-v1-form-title { margin:0 0 22px; font-size:20px; font-weight:850; }
  .settings-v1-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px 28px; }
  .settings-v1-field { min-width:0; }
  .settings-v1-field.full { grid-column:1 / -1; }
  .settings-v1-field label {
    display:block;
    margin-bottom:7px;
    color:#252525;
    font-size:13px;
    font-weight:500;
  }
  .settings-v1-input,
  .settings-v1-textarea,
  .settings-v1-select {
    width:100%;
    height:52px;
    border:1px solid #e7e7eb;
    border-radius:6px;
    background:#fff;
    color:#171717;
    padding:0 14px;
    outline:0;
    font-size:15px;
  }
  .settings-v1-textarea { height:88px; padding-top:13px; resize:vertical; line-height:1.45; }
  .settings-v1-input:focus,
  .settings-v1-textarea:focus,
  .settings-v1-select:focus { border-color:#aaa; }
  .settings-v1-logo-row { margin-bottom:32px; }
  .settings-v1-logo {
    width:100px;
    height:100px;
    border:1px solid #e7e7eb;
    background:#fff;
    display:grid;
    place-items:center;
    overflow:hidden;
    cursor:pointer;
    position:relative;
  }
  .settings-v1-logo img { max-width:82%; max-height:82%; object-fit:contain; }
  .settings-v1-logo-fallback { font-size:25px; font-weight:900; letter-spacing:-.08em; }
  .settings-v1-logo-fallback span { font-size:15px; margin-left:2px; }
  .settings-v1-messengers { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .settings-v1-messenger {
    width:50px;
    height:50px;
    border:1px solid #ececf0;
    border-radius:50%;
    background:#fff;
    color:#aaa;
    display:grid;
    place-items:center;
    font-size:14px;
    font-weight:900;
  }
  .settings-v1-messenger.active.telegram { border-color:#35a9ea; color:#35a9ea; }
  .settings-v1-messenger.active.vk { border-color:#5a77a8; color:#5a77a8; }
  .settings-v1-messenger.active.whatsapp { border-color:#4bd245; color:#3fbc39; }
  .settings-v1-messenger.add { color:#111; font-size:20px; font-weight:400; }
  .settings-v1-list { border-top:1px solid transparent; }
  .settings-v1-row {
    min-height:66px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:18px;
    align-items:center;
    border-bottom:1px solid #ededf0;
    padding:9px 0;
  }
  .settings-v1-row:last-child { border-bottom:0; }
  .settings-v1-row-main { display:flex; align-items:center; gap:14px; min-width:0; }
  .settings-v1-row-title {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:16px;
    font-weight:750;
  }
  .settings-v1-row-sub { margin-top:5px; color:#555; font-size:13px; }
  .settings-v1-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; }
  .settings-v1-badge {
    min-height:28px;
    border-radius:5px;
    background:#f3f3f4;
    color:#858585;
    padding:6px 9px;
    font-size:13px;
    line-height:1;
    white-space:nowrap;
  }
  .settings-v1-badge.green { background:#f0ffe7; color:#70dc33; }
  .settings-v1-icon {
    width:28px;
    height:28px;
    border:0;
    border-radius:5px;
    background:transparent;
    color:#222;
    display:grid;
    place-items:center;
    padding:0;
  }
  .settings-v1-icon:hover { background:#f5f5f6; }
  .settings-v1-icon svg {
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .settings-v1-switch {
    width:43px;
    height:23px;
    border:1px solid #e5e5e8;
    border-radius:999px;
    background:#fff;
    padding:2px;
    display:flex;
    justify-content:flex-start;
  }
  .settings-v1-switch::after { content:''; width:17px; height:17px; border-radius:50%; background:#b7b7b9; }
  .settings-v1-switch.on { justify-content:flex-end; }
  .settings-v1-switch.on::after { background:#000; }
  .settings-v1-avatar {
    width:47px;
    height:47px;
    flex:0 0 47px;
    border:1px solid #ececf0;
    border-radius:50%;
    color:#8e8e92;
    display:grid;
    place-items:center;
    font-size:14px;
    background:#fff;
  }
  .settings-v1-badges { display:flex; gap:6px; align-items:center; }
  .settings-v1-empty {
    min-height:150px;
    display:grid;
    place-items:center;
    text-align:center;
    color:#888;
    font-size:14px;
  }
  .settings-v1-schedule-row {
    min-height:82px;
    display:grid;
    grid-template-columns:minmax(160px,1fr) auto;
    gap:24px;
    align-items:center;
    border-bottom:1px solid #ededf0;
  }
  .settings-v1-schedule-row:last-child { border-bottom:0; }
  .settings-v1-day { font-size:16px; font-weight:750; }
  .settings-v1-hours { display:grid; grid-template-columns:110px 32px 110px; gap:14px; align-items:center; }
  .settings-v1-hours.off { grid-template-columns:270px; }
  .settings-v1-time {
    width:100%;
    height:52px;
    border:1px solid #e7e7eb;
    border-radius:7px;
    background:#fff;
    padding:0 12px;
    font-size:15px;
  }
  .settings-v1-dash { text-align:center; color:#555; }
  .settings-v1-dialog-backdrop {
    position:fixed;
    inset:0;
    z-index:4600;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:90px 20px 40px;
    background:rgba(0,0,0,.48);
    overflow:auto;
  }
  .settings-v1-dialog {
    width:min(620px,calc(100vw - 32px));
    border-radius:8px;
    background:#fff;
    box-shadow:0 22px 70px rgba(0,0,0,.24);
    overflow:hidden;
  }
  .settings-v1-dialog-head {
    min-height:72px;
    border-bottom:1px solid #ececf0;
    display:grid;
    grid-template-columns:36px 1fr 36px;
    align-items:center;
    padding:0 18px;
  }
  .settings-v1-dialog-title { grid-column:2; text-align:center; font-size:22px; font-weight:850; }
  .settings-v1-dialog-close { grid-column:3; width:36px; height:36px; border:0; background:transparent; color:#777; font-size:27px; }
  .settings-v1-dialog-body { padding:28px 34px 30px; }
  .settings-v1-dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
  .settings-v1-dialog-error { min-height:18px; margin-top:8px; color:#b00020; font-size:13px; }
  .settings-v1-toast {
    position:fixed;
    right:26px;
    bottom:26px;
    z-index:4700;
    border-radius:8px;
    background:#111;
    color:#fff;
    padding:13px 18px;
    font-size:14px;
    box-shadow:0 12px 30px #0003;
  }
  @media (min-width:981px) {
    body.crm-settings-mode #settings-view { zoom:.9; transform-origin:top left; width:111.111%; }
  }
  @media (max-width:980px) {
    body.crm-settings-mode .head { padding:20px 18px; }
    #settings-view { padding:0 14px 40px; }
    .settings-v1-layout { grid-template-columns:1fr; gap:22px; padding-top:22px; }
    .settings-v1-menu { display:flex; gap:8px; overflow:auto; padding:0 0 4px; scrollbar-width:none; }
    .settings-v1-menu::-webkit-scrollbar { display:none; }
    .settings-v1-menu-btn {
      min-height:38px;
      flex:0 0 auto;
      border:1px solid #e7e7eb;
      border-radius:999px;
      padding:0 13px;
      font-size:14px;
      font-weight:600;
      background:#fff;
    }
    .settings-v1-menu-btn.active { background:#111; border-color:#111; color:#fff; }
    .settings-v1-panel { padding:20px 16px; }
    .settings-v1-grid { grid-template-columns:1fr; gap:16px; }
    .settings-v1-field.full { grid-column:auto; }
    .settings-v1-panel-head { flex-direction:column; margin-bottom:20px; }
    .settings-v1-row { grid-template-columns:1fr; gap:8px; padding:14px 0; }
    .settings-v1-row-actions { justify-content:flex-start; padding-left:61px; flex-wrap:wrap; }
    .settings-v1-list.boxes .settings-v1-row-actions { padding-left:0; }
    .settings-v1-schedule-row { grid-template-columns:1fr; gap:12px; padding:16px 0; }
    .settings-v1-hours { width:100%; grid-template-columns:minmax(90px,1fr) 22px minmax(90px,1fr); gap:7px; }
    .settings-v1-hours.off { grid-template-columns:1fr; }
  }
