/* «Кімната Каті», фаза 5: картка речі, листы полей, меню речі, «Додати речі», «Це все речі?»,
   «Глянь, усе правильно?», «Чи є в мене таке?». Подключается после styles.css и кладёт правила
   в те же пласты: сырые значения только в tokens, вид в components, раскладка в screens. */

/* ========================================================================== tokens */
@layer tokens {
  :root {
    --it-photo-h: 250px;          /* фото в карточке вещи (m-item: 358 × 250) */
    --it-photo-h-rv: 230px;       /* фото в «Глянь, усе правильно?» */
    --it-btn2-h: 46px;            /* «Мої образи з нею», «Вдягла сьогодні» */
    --it-zoom-v: 36px;            /* лупа нарисована 36, коробка 44 */
    --it-pane-w: 528px;           /* панель справа на компьютере (d2-item) */
    --it-pane-top: 130px;
    --it-pane-side: 80px;
    --it-pane-photo: 220px;
    --it-swatch-h: 78px;          /* клетка цвета (m-color: 86 × 78) */
    --it-dot: 40px;               /* кружок цвета */
    --it-dot-check: 20px;
    --it-fieldtile-h: 52px;       /* плитка поля в проверке (m-review) */
    --it-add-tile-h: 120px;       /* «Вибрати з галереї» / «Сфотографувати» */
    --it-add-icon: 32px;
    --it-x-v: 34px;               /* крестик на фото «Це все речі?» */
    --it-x-icon: 16px;
    --it-shot-w: 120px;           /* фото из магазина (m-check: 120 × 160) */
    --it-shot-h: 160px;
    --it-ck-tile: 114px;          /* плитка «Схожі у твоїй шафі» */
    --it-crop-h: min(60dvh, 520px);
    --it-crop-handle-v: 18px;
    --it-crop-scrim: rgb(22 18 15 / .55);
    --it-crop-line: #FFFFFF;
    --it-multi: conic-gradient(from 210deg, #C9993A, #B5563B, #8A4A3D, #6F7F5B, #2F4F8A, #C9993A);
    --it-later-opacity: .42;
    --it-pick-check: 26px;
  }
}

/* ========================================================================== components */
@layer components {
  /* ---------- экран и панель ---------- */
  .it-panehead {
    flex: none;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 18px 18px 6px 24px;
  }
  .it-panehead__t {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    font: 600 var(--fs-title)/1.3 var(--font-ui);
    color: var(--ink);
  }
  .it-panehead__x { margin-left: var(--sp-2); color: var(--ink-2); }
  .it-fshead { position: sticky; top: 0; }

  /* ---------- картка речі (m-item) ---------- */
  .it-photo {
    position: relative;
    height: var(--it-photo-h);
    border-radius: var(--r-hero);
    background: var(--surface-2);
    overflow: hidden;
  }
  .it-photo > img {
    position: absolute;
    inset: 4% 6%;
    width: 88%;
    height: 92%;
    object-fit: contain;
    -webkit-user-drag: none;
  }
  .it-photo--cut > img { inset: 6% 10%; width: 80%; height: 88%; }
  .it-photo__none {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font: 500 var(--fs-hint)/1.3 var(--font-ui);
    color: var(--ink-2);
  }
  .it-photo__zoom {
    position: absolute;
    right: 10px;
    bottom: 10px;
    border: calc((var(--target) - var(--it-zoom-v)) / 2) solid transparent;
    background-clip: padding-box;
    box-shadow: none;
    color: var(--ink-2);
  }
  .it-photo__zoom .k-icon { width: 20px; height: 20px; }
  .it-photo__badge { position: absolute; left: var(--sp-3); top: var(--sp-3); }
  .it-title {
    margin: 0;
    font: 600 var(--fs-display-m)/var(--lh-display) var(--font-display);
    color: var(--ink);
    overflow-wrap: anywhere;
  }
  .it-sum { margin: 6px 0 0; font: 400 var(--fs-hint)/1.35 var(--font-ui); color: var(--ink-2); }
  .it-state {
    margin: var(--sp-3) 0 0;
    padding: 10px 14px;
    border-radius: var(--r-btn);
    background: var(--surface-2);
    font: 500 var(--fs-hint)/1.35 var(--font-ui);
    color: var(--ink);
  }
  .it-btn2 { min-height: var(--it-btn2-h); font-size: var(--fs-body-s); }
  .it-group > .k-row .k-row__value { max-width: 58%; }
  .it-row--empty .k-row__value { color: var(--ink-2); font-style: italic; }
  .it-group--static > .k-row { min-height: var(--row-h-group); }
  .it-hint { margin: var(--sp-2) var(--sp-1) 0; font-size: var(--fs-caption); }
  .it-menu .k-row { min-height: var(--row-h); }
  .it-menu .k-row--danger .k-row__label { color: var(--danger); }

  /* фото во весь экран: щипок, перетаскивание, двойное касание */
  .it-zoom {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
  }
  .it-zoom__img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transform-origin: center center;
    will-change: transform;
    -webkit-user-drag: none;
  }
  .it-zoom__img.is-smooth { transition: transform var(--dur-move) var(--ease-move); }

  /* обрезка */
  .it-crop {
    position: relative;
    height: var(--it-crop-h);
    border-radius: var(--r-card);
    background: var(--night-2);
    overflow: hidden;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
  }
  .it-crop__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; }
  .it-crop__frame {
    position: absolute;
    box-shadow: 0 0 0 100vmax var(--it-crop-scrim);
    outline: 2px solid var(--it-crop-line);
    outline-offset: -1px;
    cursor: move;
    touch-action: none;
  }
  .it-crop__frame::after { content: none; }
  .it-crop__h {
    position: absolute;
    width: var(--target);
    height: var(--target);
    touch-action: none;
  }
  .it-crop__h::before {
    content: "";
    position: absolute;
    width: var(--it-crop-handle-v);
    height: var(--it-crop-handle-v);
    border: 3px solid var(--it-crop-line);
  }
  .it-crop__h--tl { left: -22px; top: -22px; cursor: nwse-resize; }
  .it-crop__h--tl::before { right: 14px; bottom: 14px; border-right: 0; border-bottom: 0; }
  .it-crop__h--tr { right: -22px; top: -22px; cursor: nesw-resize; }
  .it-crop__h--tr::before { left: 14px; bottom: 14px; border-left: 0; border-bottom: 0; }
  .it-crop__h--bl { left: -22px; bottom: -22px; cursor: nesw-resize; }
  .it-crop__h--bl::before { right: 14px; top: 14px; border-right: 0; border-top: 0; }
  .it-crop__h--br { right: -22px; bottom: -22px; cursor: nwse-resize; }
  .it-crop__h--br::before { left: 14px; top: 14px; border-left: 0; border-top: 0; }

  /* новая вещь из очереди входит мягко (MOTION-SPEC #14): только scale и opacity */
  @keyframes it-enter { from { opacity: 0; scale: var(--scale-enter); } }
  .it-new { animation: it-enter var(--dur-enter) var(--ease-enter) backwards; }

  /* ---------- листы полей (m-color) ---------- */
  .fs-swatch {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
    min-height: var(--it-swatch-h);
    padding: 8px 0 6px;
    border: 0;
    border-radius: var(--r-btn);
    background: none;
    color: var(--ink);
    --tr-x: background-color var(--dur-state) var(--ease-fade), box-shadow var(--dur-state) var(--ease-fade);
  }
  .fs-swatch__dot {
    display: grid;
    place-items: center;
    width: var(--it-dot);
    height: var(--it-dot);
    border-radius: 50%;
    background: var(--dot, var(--surface-3));
    box-shadow: inset 0 0 0 1px var(--line-2);
    color: var(--white);
  }
  .fs-swatch__dot--multi { background: var(--it-multi); }
  .fs-swatch--none .fs-swatch__dot { background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--line-2); color: var(--ink); }
  .fs-swatch[data-light] .fs-swatch__dot { color: var(--ink); }
  .fs-swatch__dot > .k-icon { display: none; width: var(--it-dot-check); height: var(--it-dot-check); --icon-stroke: 2.6px; }
  .fs-swatch[aria-checked="true"] { background: var(--acc-soft); box-shadow: inset 0 0 0 2px var(--acc); }
  .fs-swatch[aria-checked="true"] .fs-swatch__dot > .k-icon { display: block; }
  .fs-swatch__l { font: 500 var(--fs-label)/1.2 var(--font-ui); text-align: center; white-space: nowrap; }
  .fs-note {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-btn);
    background: var(--surface-2);
    font: 500 var(--fs-hint)/1.35 var(--font-ui);
    color: var(--ink);
  }
  .fs-note > .k-icon { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--acc); }
  .fs-hint { font-size: var(--fs-caption); }
  .fs-clear {
    min-height: var(--target);
    padding: 0 var(--sp-1);
    border: 0;
    border-radius: var(--r-btn);
    background: none;
    color: var(--acc);
    font: 600 var(--fs-body-s)/1 var(--font-ui);
  }
  .fs-thumb { position: relative; background: var(--surface-2); }
  .fs-thumb > img { position: absolute; inset: 8%; width: 84%; height: 84%; object-fit: contain; }
  .fs-x { color: var(--ink-2); }
  .fs-pick .k-tile__ph { --tr-x: box-shadow var(--dur-state) var(--ease-fade); }
  .fs-pick[aria-selected="true"] .k-tile__ph { box-shadow: inset 0 0 0 2.5px var(--acc); }
  .fs-pick[aria-selected="true"]::after {
    content: "";
    position: absolute;
    top: 8px;
    right: 8px;
    width: var(--it-pick-check);
    height: var(--it-pick-check);
    border-radius: 50%;
    background: var(--acc) center / 60% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 25l9 9 19-19'/%3E%3C/svg%3E");
    pointer-events: none;
  }

  /* ---------- «Додати речі» (m-add) и «Це все речі?» (m-preview) ---------- */
  .ad-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    min-height: var(--it-add-tile-h);
    padding: var(--sp-3);
    border: 0;
    border-radius: var(--r-card-l);
    background: var(--surface);
    box-shadow: inset 0 0 0 1px var(--line-2);
    color: var(--ink);
    font: 600 var(--fs-body-s)/1.25 var(--font-ui);
    text-align: center;
  }
  .ad-tile > .k-icon { width: var(--it-add-icon); height: var(--it-add-icon); }
  .ad-tile--soft { background: var(--acc-soft); box-shadow: none; color: var(--acc-deep); }
  .ad-off { margin: 0 0 var(--sp-2); font-size: var(--fs-caption); }
  .ad-or { margin: var(--sp-4) 0 var(--sp-2); font: 400 var(--fs-hint)/1.3 var(--font-ui); color: var(--ink-2); }
  .ad-tips { margin: 0; padding-left: 1.4em; font: 400 var(--fs-body-s)/1.45 var(--font-ui); color: var(--ink); }
  .ad-tips > li + li { margin-top: var(--sp-3); }
  .ad-note {
    margin: 0;
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-btn);
    background: var(--mus-soft);
    font: 500 var(--fs-hint)/1.35 var(--font-ui);
    color: var(--mus-ink);
  }
  .ad-pv {
    position: relative;
    aspect-ratio: 114 / 160;
    min-width: 0;
    border-radius: var(--r-btn);
    background: var(--surface-2);
    overflow: hidden;
  }
  .ad-ph { position: absolute; inset: 0; display: block; }
  .ad-ph > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; }
  .ad-x {
    position: absolute;
    top: 0;
    right: 0;
    display: grid;
    place-items: center;
    width: var(--target);
    height: var(--target);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
    color: var(--ink);
  }
  .ad-x::after { content: none; }
  .ad-x > span {
    display: grid;
    place-items: center;
    width: var(--it-x-v);
    height: var(--it-x-v);
    border-radius: 50%;
    background: var(--surface);
    box-shadow: var(--shadow-thumb);
  }
  .ad-x > span .k-icon { width: var(--it-x-icon); height: var(--it-x-icon); --icon-stroke: 2.4px; }
  .ad-x.is-pressed > span { background: var(--surface-2); }
  .ad-later { position: absolute; left: var(--sp-2); bottom: var(--sp-2); display: none; }
  .ad-pv--later .ad-ph > img { opacity: var(--it-later-opacity); }
  .ad-pv--later .ad-later { display: inline-flex; }
  .ad-bar {
    position: sticky;
    bottom: 0;
    margin: 0 calc(var(--gutter) * -1);
    padding: var(--sp-4) var(--gutter) calc(var(--sp-3) + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: var(--bg);
  }
  .ad-gohint { margin-top: var(--sp-3); font-size: var(--fs-caption); text-align: center; }

  /* ---------- «Глянь, усе правильно?» (m-review) ---------- */
  .rv-count { font: 600 var(--fs-hint)/1 var(--font-ui); color: var(--ink-2); white-space: nowrap; }
  .rv-photo {
    position: relative;
    height: var(--it-photo-h-rv);
    border-radius: var(--r-hero);
    background: var(--surface-2);
    overflow: hidden;
  }
  .rv-photo > img { position: absolute; inset: 5% 8%; width: 84%; height: 90%; object-fit: contain; }
  .rv-title { margin: 0; font: 600 var(--fs-display-m)/var(--lh-display) var(--font-display); color: var(--ink); overflow-wrap: anywhere; }
  .rv-state {
    padding: 10px 14px;
    border-radius: var(--r-btn);
    background: var(--mus-soft);
    color: var(--mus-ink);
  }
  .rv-tiles .k-fieldtile { min-height: var(--it-fieldtile-h); padding: 7px 12px 7px 14px; }
  .rv-tiles .k-fieldtile__v { font-size: var(--fs-body-s); overflow-wrap: anywhere; }
  .rv-link {
    min-height: var(--target);
    padding: 0 var(--sp-1);
    border: 0;
    border-radius: var(--r-btn);
    background: none;
    color: var(--ink-2);
    font: 600 var(--fs-body-s)/1.2 var(--font-ui);
  }
  .rv-link--acc { color: var(--acc); }

  /* ---------- «Чи є в мене таке?» (m-check) ---------- */
  .ck-note {
    margin: 0;
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-btn);
    background: var(--mus-soft);
    font: 500 var(--fs-hint)/1.35 var(--font-ui);
    color: var(--mus-ink);
  }
  .ck-hint { font-size: var(--fs-caption); }
  .ck-shot {
    position: relative;
    width: var(--it-shot-w);
    height: var(--it-shot-h);
    border-radius: var(--r-tile);
    background: var(--surface-2);
    overflow: hidden;
  }
  .ck-shot > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; }
  .ck-shot__badge { position: absolute; left: var(--sp-2); bottom: var(--sp-2); }
  .ck-name { margin: 0; font: 600 var(--fs-section)/1.3 var(--font-ui); color: var(--ink); overflow-wrap: anywhere; }
  .ck-sub { margin: 4px 0 0; font: 400 var(--fs-hint)/1.3 var(--font-ui); color: var(--ink-2); }
  .ck-verdict {
    margin-top: var(--sp-3);
    padding: 12px 14px;
    border-radius: var(--r-tile);
    background: var(--mus-soft);
    color: var(--mus-ink);
  }
  .ck-verdict--calm { background: var(--surface-2); color: var(--ink); }
  .ck-verdict--wait { min-height: 96px; background: var(--surface-2); animation: ck-pulse var(--dur-shimmer) var(--ease-fade) infinite alternate; }
  @keyframes ck-pulse { from { opacity: 1; } to { opacity: .5; } }
  .ck-verdict__t { margin: 0; font: 700 var(--fs-body)/1.3 var(--font-ui); }
  .ck-verdict__d { margin: 4px 0 0; font: 400 var(--fs-caption)/1.35 var(--font-ui); }
  .ck-sec { margin: 0; }
  .ck-row > .k-tile { width: var(--it-ck-tile); }
  .ck-row .k-tile__ph { aspect-ratio: 114 / 150; }
  .ck-link {
    min-height: var(--target);
    border: 0;
    border-radius: var(--r-btn);
    background: none;
    color: var(--acc);
    font: 600 var(--fs-body-s)/1.2 var(--font-ui);
  }
}

/* ========================================================================== layouts */
@layer layouts {
  /* окно во весь экран на телефоне: поверх открытого листа, выглядит как вложенный экран */
  .k-sheet.it-fs {
    inset: 0;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
    background: var(--bg);
    box-shadow: none;
  }
  .k-sheet.it-fs .k-sheet__grab { display: none; }
  .k-sheet.it-fs .k-sheet__body { padding: 0 var(--gutter) calc(var(--sp-6) + env(safe-area-inset-bottom)); }

  /* компьютер: панель справа поверх места, шкаф за ней виден (d2-item, d3-add, d3-review, d3-check) */
  @media (min-width: 1100px) {
    .k-sheet.it-pane {
      inset: var(--it-pane-top) var(--it-pane-side) auto auto;
      width: min(var(--it-pane-w), calc(100% - 2 * var(--it-pane-side)));
      max-height: calc(100dvh - var(--desk-panel-top) - var(--desk-panel-bottom)); /* фаза 9: над меню */
      margin: 0;
      border-radius: var(--r-sheet);
      box-shadow: var(--shadow-dialog);
    }
    .k-sheet.it-pane::backdrop { background: transparent; }
    .k-sheet.it-pane .k-sheet__grab { display: none; }
    .k-sheet.it-pane:not(.it-pane--sheet) .k-sheet__body { padding: var(--sp-2) var(--sp-6) var(--sp-6); }
    .it-pane .it-photo { height: auto; min-height: 346px; }
    .it-pane .rv-photo { height: auto; min-height: 372px; }
    .it-pane .ad-bar { margin: 0 calc(var(--sp-6) * -1); padding-inline: var(--sp-6); background: var(--surface); }
    .it-pane .rv-tiles .k-fieldtile {
      min-height: var(--target);
      padding: 0;
      border-radius: 0;
      background: none;
      box-shadow: none;
    }
    .it-pane .rv-tiles .k-fieldtile + .k-fieldtile { box-shadow: inset 0 1px 0 var(--line); }
    .it-pane .rv-tiles .k-fieldtile__l { flex: none; font-size: var(--fs-caption); }
    .it-pane .rv-tiles .k-fieldtile__v { text-align: right; }
  }
}

/* ========================================================================== screens: только раскладка */
@layer screens {
  .it { display: flex; flex-direction: column; gap: var(--sp-4); padding-bottom: var(--sp-4); }
  .it-top { display: flex; flex-direction: column; gap: var(--sp-4); }
  .it-head { display: flex; flex-direction: column; }
  .it-acts { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: var(--sp-4); }
  .it-cols { display: flex; flex-direction: column; gap: var(--sp-2); }
  .it-col { display: flex; flex-direction: column; gap: var(--sp-2); }
  .it-sec { display: flex; flex-direction: column; }
  .it-sec > .k-section { margin-top: var(--sp-2); }
  .it-looks { padding-bottom: var(--sp-2); }
  .it-crop__tools { margin-top: var(--sp-3); }

  .fs-swatches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-2) 0; }
  .fs-sheet .k-sheet__body > * + * { margin-top: var(--sp-3); }
  .fs-options--one { grid-template-columns: minmax(0, 1fr); }
  .fs-subs { display: flex; flex-direction: column; }
  .fs-subs > .k-caps, .fs-caps1, .fs-where > .k-caps { margin-top: var(--sp-2); }
  .fs-where { display: flex; flex-direction: column; gap: var(--sp-2); }
  .fs-pairs { display: flex; flex-direction: column; }
  .fs-pickgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3) var(--sp-2); }

  .ad-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); margin-bottom: var(--sp-2); }
  .ad-rows { display: flex; flex-direction: column; }
  .ad-preview .k-screen__body, .ad-preview.it-fs .k-sheet__body, .ad-preview.it-pane .k-sheet__body { display: flex; flex-direction: column; gap: var(--sp-3); }
  .ad-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-2); }
  .ad-bar { display: flex; flex-direction: column; align-items: center; }

  .rv .k-screen__body, .rv.it-fs .k-sheet__body, .rv.it-pane .k-sheet__body { display: flex; flex-direction: column; gap: var(--sp-3); }
  .rv-prog { display: flex; align-items: center; gap: var(--sp-4); padding: 0 var(--sp-1); }
  .rv-prog > .k-progress { flex: 1 1 auto; }
  .rv-body { display: flex; flex-direction: column; gap: var(--sp-5); }
  .rv-top { display: flex; flex-direction: column; gap: var(--sp-3); }
  .rv-side { display: flex; flex-direction: column; gap: var(--sp-3); }
  .rv-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
  .rv-acts { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); }
  .rv-links { display: flex; justify-content: space-between; align-items: center; width: min(100%, var(--btn-max)); }
  .rv-done { display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); padding: var(--sp-8) 0; text-align: center; }

  .ck .k-screen__body, .ck.it-fs .k-sheet__body, .ck.it-pane .k-sheet__body { display: flex; flex-direction: column; }
  .ck-stage { display: flex; flex-direction: column; gap: var(--sp-4); }
  .ck-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
  .ck-top { display: grid; grid-template-columns: var(--it-shot-w) minmax(0, 1fr); gap: 14px; align-items: start; }
  .ck-top--words { grid-template-columns: minmax(0, 1fr); }
  .ck-what { display: flex; flex-direction: column; min-width: 0; }
  .ck-row {
    display: flex;
    gap: var(--sp-2);
    margin: 0 calc(var(--gutter) * -1);
    padding: 0 var(--gutter) var(--sp-1);
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .ck-row::-webkit-scrollbar { display: none; }
  .ck-row > .k-tile { flex: none; scroll-snap-align: start; }
  .ck-acts { display: flex; flex-direction: column; align-items: center; gap: 10px; }

  @media (min-width: 760px) {
    .ad-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  }

  /* компьютер: фото слева, название и действия справа; «Про річ» и «Історія» колонками */
  @media (min-width: 1100px) {
    .it-pane .it-top { display: grid; grid-template-columns: var(--it-pane-photo) minmax(0, 1fr); gap: var(--sp-6); align-items: start; }
    .it-pane .it-acts { margin-top: var(--sp-5); }
    .it-pane .it-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6); align-items: start; }
    .it-pane .rv-top { display: grid; grid-template-columns: var(--it-pane-photo) minmax(0, 1fr); gap: 20px; align-items: start; }
    .it-pane .rv-tiles { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .it-pane .rv-acts { flex-direction: row-reverse; justify-content: space-between; align-items: center; }
    .it-pane .rv-acts > .k-btn { width: auto; flex: none; }
    .it-pane .rv-links { width: auto; justify-content: flex-start; gap: var(--sp-5); }
    .it-pane .ck-row { margin: 0; padding: 0; }
    .it-pane .ck-acts { flex-direction: row-reverse; flex-wrap: wrap; }
    .it-pane .ck-acts > .k-btn { flex: 1 1 0; }
    .it-pane .ck-link { flex: 1 0 100%; }
    /* d3-review: подпись слева, значение справа в одной строке */
    .it-pane .rv-tiles .k-fieldtile__text { flex-direction: row; justify-content: space-between; align-items: baseline; gap: var(--sp-3); }
    .ad-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
}
