/* Нордиам · Кабинет механика — адаптивная вёрстка для планшета и ПК.

   Телефон (до 640px) обслуживается файлами app.css / arm.css / intake.css
   без изменений: всё в этом файле либо спрятано, либо включается только
   начиная с 640px, а «настоящий ПК» — с 1100px.

   Три режима:
     • телефон  — до 640px   (карточки, нижняя навигация) — как было;
     • планшет  — 640–1099px (шире сетка, фильтры в строку);
     • ПК       — от 1100px  (боковое меню, плотные таблицы, две-три колонки).
*/

/* =========================================================================
   1. Новые элементы разметки, которые на телефоне не показываются
   ========================================================================= */

/* дата приёма: отдельная колонка только в таблице на ПК */
.q-date { display: none; }

/* группа «плашек» (ЗН, «вручную», «отложен») — одна ячейка таблицы */
.q-tags { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 7px; min-width: 0; }

/* название оборудования и серийник — две разные ячейки таблицы */
.q-eqname { display: inline; }
.q-sn::before { content: " · "; }

/* сводка справа в карточке заказа — только для широкого экрана */
.order-rail { display: none; }

/* группа полей приёма: на телефоне обычный блок */
.in-grp { display: block; }

/* кнопка «Принять в ремонт» в шапке — только на ПК */
.topbar-cta { display: none; }

/* боковое меню — только на ПК */
.sidebar { display: none; }

/* заголовок таблицы — только на ПК */
.q-thead { display: none; }

/* =========================================================================
   2. Планшет: 640–1099px
   ========================================================================= */
@media (min-width: 640px) {

  body { background: #e7ecf4; }
  :root[data-theme="dark"] body { background: #060c17; }

  #login { max-width: none; }
  .login-wrap { max-width: 420px; }

  .app {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    background: var(--bg);
    box-shadow: 0 0 0 1px var(--border), 0 20px 60px rgba(15, 23, 42, .12);
  }
  :root[data-theme="dark"] .app { box-shadow: 0 0 0 1px var(--border); }

  .topbar { padding: calc(12px + env(safe-area-inset-top)) 20px 12px; }
  .topbar h1 { font-size: 21px; }
  .topbar-sub { font-size: 13px; }

  .tools {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 20px;
  }
  .tools .searchbox { flex: 1 1 320px; max-width: 620px; height: 44px; }
  .tools .segmented { flex: none; width: 280px; height: 42px; }
  .tools .tool-btn { height: 42px; margin-left: auto; }
  #view-clients .tools .searchbox { max-width: 620px; }

  .banner { margin: 10px 20px 0; }
  .view-scroll { padding: 14px 20px 24px; }

  .actionbar { padding: 12px 20px; }
  .actionbar .btn { display: flex; width: 100%; max-width: 400px; margin-left: auto; }

  #view-arm .arm-select { max-width: 340px; }

  /* с планшета места хватает на кнопку в шапке — плавающая больше не нужна */
  .fab { display: none; }
  .topbar-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 40px;
    padding: 0 14px;
    margin-left: 10px;
    border-radius: 11px;
    font-size: 14px;
    flex: none;
  }
  .topbar-cta .ico { width: 17px; height: 17px; }

  .tabbar { grid-template-columns: repeat(4, minmax(0, 176px)); justify-content: center; }
  .tab { height: 62px; }

  .sheet { max-width: 640px; max-height: 80vh; }
  .toast { bottom: 100px; }

  #clients-list .client-row { margin-bottom: 0; }

  /* профиль: переключатель темы и выход не растягиваем на всю ширину */
  .segmented-theme { max-width: 420px; }
  .profile-actions .btn { max-width: 340px; }
}

/* две колонки карточек на планшете — когда места уже достаточно */
@media (min-width: 820px) and (max-width: 1099px) {
  .list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
  .list > .q-card { margin-bottom: 0; }
  #clients-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
}

/* =========================================================================
   3. Карточка заказа в две колонки — с 900px
   ========================================================================= */
@media (min-width: 900px) {
  #order-body {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 1fr);
    grid-auto-flow: row dense;
    gap: 14px;
    align-items: start;
  }
  /* шапка заказа — во всю ширину */
  #order-body > .order-hero { grid-column: 1 / -1; order: 0; }
  #order-body > .card.block { margin-top: 0; }

  /* левая колонка: работы, запчасти, комментарии, неисправность */
  .ord-main { grid-column: 1; }
  .ord-works { grid-column: 1; order: 1; }
  .ord-parts { grid-column: 1; order: 2; }
  .ord-comments { grid-column: 1; order: 3; }
  .ord-defect { grid-column: 1; order: 4; }

  /* правая колонка: клиент, оборудование, оплата, дополнительно */
  .ord-client { grid-column: 2; order: 1; }
  .ord-equipment { grid-column: 2; order: 2; }
  .ord-pay { grid-column: 2; order: 3; }
  .ord-info { grid-column: 2; order: 4; }

  .ord-notice { grid-column: 1 / -1; }

  #client-body { max-width: 1000px; }
  #profile-body { max-width: 840px; }
}

/* =========================================================================
   4. Приём в ремонт: форма в две колонки — с 900px
   ========================================================================= */
@media (min-width: 900px) {
  .intake-top { max-width: 1200px; padding: calc(12px + env(safe-area-inset-top)) 24px 12px; }
  .intake-body {
    max-width: 1200px;
    padding: 16px 24px 132px;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 0 28px;
    align-content: start;
  }
  .intake-foot {
    display: flex;
    justify-content: flex-end;
    padding: 10px max(24px, calc((100vw - 1200px) / 2 + 24px)) calc(10px + env(safe-area-inset-bottom));
  }
  .intake-foot .btn { width: 320px; margin: 0; }

  .in-grp-client { grid-column: 1; grid-row: 1; }
  .in-grp-comment { grid-column: 1; grid-row: 2; }
  .in-grp-when { grid-column: 2; grid-row: 1; }
  .in-grp-units { grid-column: 1 / -1; grid-row: 3; }

  /* всё, что не в группе (прогресс, ошибки, экран успеха) — во всю ширину */
  #intake-body > :not(.in-grp) { grid-column: 1 / -1; }

  .in-grp-client > .intake-section:first-child,
  .in-grp-when > .intake-section:first-child { margin-top: 0; }
  .in-grp-when { border-left: 1px solid var(--border-soft); padding-left: 28px; }

  .intake-field { margin-bottom: 14px; }
  .intake-input { min-height: 46px; padding: 11px 13px; font-size: 15px; }
  textarea.intake-input,
  textarea.intake-textarea { min-height: 74px; }

  /* единицы оборудования — компактным списком, поля в три колонки */
  .unit-card { border-radius: 14px; margin-bottom: 10px; }
  .unit-head { min-height: 46px; padding: 8px 12px; }
  .unit-num { width: 24px; height: 24px; font-size: 13px; }
  .unit-title { font-size: 14.5px; }
  .unit-summary { font-size: 12.5px; }
  .unit-body {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 20px;
    padding: 8px 12px 2px;
  }
  /* модель и серийник — отдельной строкой, три поля-справочника — своей:
     так короткие поля не растягиваются под высоту высоких */
  .unit-body > .intake-field:not(.ms),
  .unit-body > .pick-card { grid-row: 1; }
  .unit-body > .intake-field:not(.ms):first-child,
  .unit-body > .pick-card { grid-column: span 2; }
  .unit-body > .ms { grid-row: 2; }
  .unit-body > .intake-field { margin-bottom: 12px; }
  .unit-body > .pick-card { margin-bottom: 12px; padding: 10px 12px; }
  .unit-body > .pick-card .pc-name { font-size: 14.5px; }
  .unit-body > .pick-card .pc-sub { font-size: 12px; }
  .ms-text { min-height: 58px; }
  .btn-add-unit { min-height: 46px; font-size: 14.5px; margin-top: 4px; }
  .quick-dates { max-width: 420px; }
}

/* =========================================================================
   5. ПК: от 1100px — боковое меню и таблицы
   ========================================================================= */
@media (min-width: 1100px) {

  html { background: #dde4ef; }
  :root[data-theme="dark"] html { background: #050a13; }

  #login { display: flex; align-items: center; justify-content: center; }
  .login-wrap { max-width: 460px; padding: 32px 18px; }
  .login-card { padding: 22px 20px; }
  .login-foot { margin-top: 22px; }

  /* каркас: меню слева, рабочая область справа */
  .app {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 236px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    background: var(--bg);
    box-shadow: 0 0 0 1px var(--border), 0 24px 70px rgba(15, 23, 42, .16);
  }
  :root[data-theme="dark"] .app { box-shadow: 0 0 0 1px var(--border); }

  .view { grid-column: 2; grid-row: 1; min-width: 0; }
  .tabbar { display: none !important; }
  .fab { display: none !important; }

  /* ---------- боковое меню ---------- */
  .sidebar {
    display: flex;
    flex-direction: column;
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 18px 14px 16px;
    background: var(--surface);
    border-right: 1px solid var(--border);
  }
  .side-brand { display: flex; align-items: center; gap: 10px; padding: 2px 6px 18px; }
  .side-mark {
    width: 38px; height: 38px; flex: none;
    border-radius: 11px;
    background: linear-gradient(135deg, #2563eb, #1e40af);
    color: #fff;
    display: grid; place-items: center;
    font-size: 20px; font-weight: 800;
    box-shadow: 0 6px 14px rgba(37, 99, 235, .25);
  }
  .side-name { font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
  .side-sub { margin-top: 1px; font-size: 11.5px; color: var(--muted); }

  .side-nav { display: flex; flex-direction: column; gap: 3px; }
  .side-item {
    display: flex; align-items: center; gap: 10px;
    width: 100%; height: 42px; padding: 0 12px;
    border: 0; border-radius: 11px;
    background: transparent;
    color: var(--text-2);
    font: inherit; font-size: 14.5px; font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: background .12s, color .12s;
  }
  .side-item .ico { width: 19px; height: 19px; color: var(--muted); }
  .side-item:hover { background: var(--surface-2); color: var(--text); }
  .side-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
  .side-item.is-on { background: rgba(37, 99, 235, .10); color: var(--accent); }
  .side-item.is-on .ico { color: var(--accent); }

  .side-foot {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--border-soft);
    display: flex; align-items: center; gap: 10px;
  }
  .side-avatar {
    width: 34px; height: 34px; flex: none;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent-press));
    color: #fff;
    display: grid; place-items: center;
    font-size: 12.5px; font-weight: 800;
  }
  .side-user { min-width: 0; font-size: 12.5px; font-weight: 700; line-height: 1.3; }
  .side-user span {
    display: block;
    font-size: 11.5px; font-weight: 500; color: var(--muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .side-ver { margin-top: 10px; font-size: 10.5px; color: var(--muted); opacity: .65; }

  /* ---------- шапка и полоса фильтров ---------- */
  .topbar { padding: calc(14px + env(safe-area-inset-top)) 20px 12px; }
  .topbar h1 { font-size: 22px; }
  .topbar-order h1 { font-size: 20px; }
  .topbar-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 16px;
    margin-left: 10px;
    border-radius: 11px;
    font-size: 14.5px;
    flex: none;
  }
  .topbar-cta .ico { width: 18px; height: 18px; }

  .tools {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    padding: 10px 20px;
  }
  .tools .searchbox { flex: 0 1 460px; max-width: 460px; height: 42px; }
  .tools .segmented { flex: none; width: 226px; height: 42px; }
  .tools .seg { font-size: 14px; }
  .tools .tool-btn { margin-left: auto; height: 42px; }
  #view-clients .tools .searchbox { flex: 0 1 460px; }

  .banner { margin: 10px 20px 0; }

  #queue-scroll, #arm-scroll { padding: 0 20px 22px; overflow: auto; }
  #order-scroll, #client-scroll, .view-scroll#profile-scroll { padding: 16px 20px 28px; }
  #view-profile .view-scroll { padding: 16px 20px 28px; }
  #view-clients .view-scroll { padding: 16px 20px 28px; }

  /* ---------- таблица: общее ---------- */
  #queue-list { --qcols: 112px 74px 50px minmax(126px, 1.15fr) minmax(102px, .95fr) 60px minmax(130px, 1.5fr) 110px minmax(98px, .9fr) 36px; }
  #arm-list { --qcols: 34px 116px 74px 50px minmax(118px, 1.15fr) minmax(96px, .95fr) 64px minmax(116px, 1.4fr) 108px minmax(94px, .9fr) 34px; }
  #queue-list { min-width: 1048px; }
  #arm-list { min-width: 1068px; }

  #queue-list .q-card,
  #arm-list .q-card {
    display: grid;
    grid-template-columns: var(--qcols);
    grid-template-rows: 20px 16px;
    column-gap: 14px;
    align-items: center;
    min-height: 44px;
    margin: 0;
    padding: 7px 12px;
    border: 0;
    border-bottom: 1px solid var(--border-soft);
    border-radius: 0;
    background: var(--surface);
    box-shadow: none;
    color: var(--text);
    cursor: pointer;
    transition: background .1s;
  }
  #queue-list .q-card:last-child,
  #arm-list .q-card:last-child { border-bottom: 0; }
  #queue-list .q-card:active,
  #arm-list .q-card:active { transform: none; border-color: var(--border-soft); }
  #queue-list .q-card:hover,
  #arm-list .q-card:hover { background: var(--surface-2); }
  #queue-list .q-card:focus-visible,
  #arm-list .q-card:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
    background: var(--surface-2);
  }

  /* каркасные строки-скелетоны остаются блоками */
  #queue-list .q-card.is-skeleton,
  #arm-list .q-card.is-skeleton {
    display: block;
    height: 58px;
    padding: 8px 12px;
    background: var(--surface);
  }
  #queue-list .q-card.is-skeleton .sk,
  #arm-list .q-card.is-skeleton .sk { height: 9px; margin: 5px 0; }

  /* «обёртки» карточки растворяются, их дети становятся ячейками таблицы */
  #queue-list .q-row1, #queue-list .q-row3, #queue-list .q-eq,
  #arm-list .q-row1, #arm-list .q-row3, #arm-list .q-eq { display: contents; }

  /* ---------- ячейки очереди ---------- */
  #queue-list .q-num {
    grid-column: 1; grid-row: 1; align-self: end;
    font-size: 13.5px; letter-spacing: -.01em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-date {
    grid-column: 2; grid-row: 1 / span 2; align-self: center;
    display: block;
    font-size: 12.5px; color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
  #queue-list .q-tags { grid-column: 1; grid-row: 2; align-self: start; overflow: hidden; flex-wrap: nowrap; gap: 4px; }
  #queue-list .q-tags .chip { font-size: 10px; padding: 1px 6px; line-height: 1.5; }
  #queue-list .chip-days {
    grid-column: 3; grid-row: 1 / span 2; justify-self: start;
    margin-left: 0;
    font-size: 11px; padding: 2px 7px;
  }
  #queue-list .q-client {
    grid-column: 4; grid-row: 1 / span 2; margin: 0;
    font-size: 13.5px; font-weight: 700; letter-spacing: 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-eqname {
    grid-column: 5; grid-row: 1 / span 2;
    font-size: 12.5px; color: var(--text-2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-sn {
    grid-column: 6; grid-row: 1 / span 2;
    font-size: 12px; color: var(--muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-sn::before,
  #arm-list .q-sn::before { content: none; }
  #queue-list .q-defect {
    grid-column: 7; grid-row: 1 / span 2; margin: 0;
    display: block;
    font-size: 12.5px; color: var(--text-2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-row3 > .status { grid-column: 8; grid-row: 1 / span 2; font-size: 11px; padding: 3px 8px; justify-self: start; }
  #queue-list .q-mech {
    grid-column: 9; grid-row: 1 / span 2; margin: 0; max-width: 100%;
    font-size: 12px; text-align: left;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #queue-list .q-actions {
    position: static;
    grid-column: 10; grid-row: 1 / span 2;
    justify-self: center;
    width: 30px; height: 30px;
    border-radius: 8px;
    color: var(--muted);
  }
  #queue-list .q-actions:hover { background: var(--border); color: var(--text); }
  #queue-list .q-actions .ico { width: 18px; height: 18px; }

  #queue-list .q-card.is-unassigned { box-shadow: inset 3px 0 0 var(--st-warn-fg); }

  /* ---------- ячейки АРМ ---------- */
  #arm-list .arm-check {
    position: static;
    grid-column: 1; grid-row: 1 / span 2;
    justify-self: center;
    width: 24px; height: 24px;
    border-radius: 8px;
  }
  #arm-list .arm-check .ico { width: 14px; height: 14px; }
  #arm-list .arm-card-check { padding-left: 12px; }
  #arm-list .q-num {
    grid-column: 2; grid-row: 1; align-self: end;
    font-size: 13.5px; letter-spacing: -.01em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-date {
    grid-column: 3; grid-row: 1 / span 2; align-self: center;
    display: block;
    font-size: 12.5px; color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
  #arm-list .q-tags { grid-column: 2; grid-row: 2; align-self: start; overflow: hidden; flex-wrap: nowrap; gap: 4px; }
  #arm-list .q-tags .chip { font-size: 10px; padding: 1px 6px; line-height: 1.5; }
  #arm-list .chip-days {
    grid-column: 4; grid-row: 1 / span 2; justify-self: start;
    margin-left: 0; font-size: 11px; padding: 2px 7px;
  }
  #arm-list .q-client {
    grid-column: 5; grid-row: 1 / span 2; margin: 0;
    font-size: 13.5px; font-weight: 700;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-eqname {
    grid-column: 6; grid-row: 1 / span 2;
    font-size: 12.5px; color: var(--text-2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-sn {
    grid-column: 7; grid-row: 1 / span 2;
    font-size: 12px; color: var(--muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-defect {
    grid-column: 8; grid-row: 1 / span 2; margin: 0;
    display: block;
    font-size: 12.5px; color: var(--text-2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-row3 > .status { grid-column: 9; grid-row: 1 / span 2; font-size: 11px; padding: 3px 8px; justify-self: start; }
  #arm-list .q-mech {
    grid-column: 10; grid-row: 1 / span 2; margin: 0; max-width: 100%;
    font-size: 12px; text-align: left;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  #arm-list .q-actions {
    position: static;
    grid-column: 11; grid-row: 1 / span 2;
    justify-self: center;
    width: 30px; height: 30px;
    border-radius: 8px;
    color: var(--muted);
  }
  #arm-list .q-actions:hover { background: var(--border); color: var(--text); }
  #arm-list .q-actions .ico { width: 18px; height: 18px; }

  /* в таблице лишние плашки не нужны: состояние видно по строке */
  #arm-list .chip-nostatus,
  #arm-list .chip-defer,
  #arm-list .chip-blocked,
  #arm-list .q-block { display: none !important; }

  #arm-list .q-card.is-unassigned { box-shadow: inset 3px 0 0 var(--st-warn-fg); }
  #arm-list .q-card.is-checked { box-shadow: inset 0 0 0 2px var(--accent); }
  #arm-list .arm-card.is-deferred { opacity: .9; }
  #arm-list .arm-card.is-deferred::before {
    left: 0; top: 0; bottom: 0; width: 3px; border-radius: 0;
  }

  /* ---------- заголовок таблицы ---------- */
  .q-thead {
    position: sticky;
    top: 0;
    z-index: 5;
    display: grid;
    grid-template-columns: var(--qcols);
    column-gap: 14px;
    align-items: center;
    min-height: 38px;
    padding: 6px 12px;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
  }
  .q-th {
    display: flex;
    align-items: center;
    gap: 3px;
    min-width: 0;
    margin: 0;
    padding: 2px 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    user-select: none;
  }
  .q-th:hover { color: var(--text); }
  .q-th:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .q-th.is-sorted { color: var(--accent); }
  .q-th .th-dir { font-size: 10px; line-height: 1; }
  .q-th-actions, .q-th-check { cursor: default; }
  .q-th-actions:hover, .q-th-check:hover { color: var(--muted); }

  /* ---------- нижние панели ---------- */
  .actionbar { padding: 12px 20px; }
  .actionbar .btn { max-width: 400px; margin-left: auto; }

  .toast { bottom: 32px; }

  .sheet { border-radius: 20px; }
  .sheet-body { padding-bottom: 16px; }

  /* ---------- АРМ: фильтры в одну полосу ---------- */
  #view-arm .tools {
    display: grid;
    grid-template-columns: auto minmax(220px, 1fr) 220px;
    grid-template-areas:
      "mode search mech"
      "chips chips chips";
    gap: 10px 14px;
  }
  #view-arm .tools #arm-mode { grid-area: mode; width: 300px; height: 42px; }
  #view-arm .tools .searchbox { grid-area: search; max-width: none; height: 42px; }
  #view-arm .tools .arm-chips { grid-area: chips; flex-wrap: wrap; overflow: visible; }
  #view-arm .tools .arm-mech-row { grid-area: mech; margin: 0; }
  #view-arm .tools .arm-select { min-height: 42px; height: 42px; font-size: 14px; padding: 0 12px; }

  .arm-counters { flex-wrap: wrap; overflow: visible; padding: 4px 20px 10px; }
  .arm-tile { min-width: 0; padding: 6px 12px; border-radius: 11px; }
  .arm-tile b { font-size: 17px; }
  .arm-tile span { font-size: 11px; }

  .arm-selbar { margin: 0 20px 8px; }

  /* ---------- клиенты и профиль ---------- */
  #clients-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
  #clients-list .client-row { margin-bottom: 0; }

  /* ---------- приём: чуть свободнее ---------- */
  .intake-body { max-width: 1280px; }
  .intake-top { max-width: 1280px; }
  .intake-foot { padding-right: max(24px, calc((100vw - 1280px) / 2 + 24px)); }
}

/* =========================================================================
   6. Широкий ПК: карточка заказа в три колонки (контент + колонка действий)
   ========================================================================= */
@media (min-width: 1280px) {
  #view-order {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 312px;
    grid-template-rows: auto minmax(0, 1fr);
  }
  #view-order > .topbar { grid-column: 1 / -1; grid-row: 1; }
  #view-order > .view-scroll { grid-column: 1; grid-row: 2; }
  #view-order > .actionbar {
    grid-column: 2; grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border-top: 0;
    border-left: 1px solid var(--border);
    overflow-y: auto;
  }
  #view-order > .actionbar .btn { width: 100%; max-width: none; margin: 0; height: 46px; }
  #view-order:has(.actionbar.hidden) { grid-template-columns: minmax(0, 1fr); }

  /* у приёма без заказ-наряда действий нет — не держим пустую колонку */
  #view-order:has(#btn-status[disabled]) { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; }
  #view-order:has(#btn-status[disabled]) > .view-scroll { grid-column: 1; grid-row: 2; }
  #view-order:has(#btn-status[disabled]) > .actionbar {
    grid-column: 1; grid-row: 3;
    flex-direction: row;
    justify-content: flex-end;
    padding: 12px 20px;
    border-left: 0;
    border-top: 1px solid var(--border);
    overflow: visible;
  }
  #view-order:has(#btn-status[disabled]) > .actionbar .btn { width: 100%; max-width: 400px; }

  #order-body { grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); }

  .order-rail { display: block; }
  .order-rail .rail-title {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 8px;
  }
  .order-rail .rail-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px solid var(--border-soft);
    font-size: 13px;
    color: var(--muted);
  }
  .order-rail .rail-row b { color: var(--text); font-weight: 700; text-align: right; }
  .order-rail .rail-total {
    border-bottom: 0;
    margin-top: 2px;
    padding-top: 9px;
    border-top: 1px solid var(--border);
    font-size: 13px;
  }
  .order-rail .rail-total b { font-size: 17px; letter-spacing: -.01em; }
}