/* v24 — вёрстка компьютера (html[data-layout="d"]): герой в две колонки
   (текст | годинник + «що від мене зараз»), под ним канбан на четыре колонки,
   лист заказа выезжает справа, доска остаётся видна слева. */

[data-layout="d"] .hero { max-width: 1280px; margin: 0 auto; padding: 24px 24px 8px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .9fr); gap: 40px; align-items: start; }
[data-layout="d"] .h1 { font-size: clamp(2.8rem, 5.2vw, 4.6rem); }
[data-layout="d"] .hero-side { display: grid; gap: 12px; padding-top: 8px; }
[data-layout="d"] .hero-side .clock { justify-self: start; }
[data-layout="d"] .board { max-width: 1280px; margin: 0 auto; padding: 8px 24px 0; }
[data-layout="d"] .cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: start; }
[data-layout="d"] .col { min-height: 260px; padding: 12px; border-radius: 20px; background: var(--bg2); border: 2px dashed transparent; transition: border-color .2s, background .2s; }
[data-layout="d"] .col.drop { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--bg2)); }
[data-layout="d"] .col.empty .col-list::after { content: ""; display: block; height: 120px; border-radius: 14px; border: 1.5px dashed var(--line); }
[data-layout="d"] .card .c-img { width: 64px; height: 64px; }
[data-layout="d"] .card:hover { box-shadow: 0 2px 4px rgba(60, 40, 20, .08), 0 14px 34px rgba(60, 40, 20, .14); }
[data-layout="d"] .pairs { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 24px; align-items: start; }
[data-layout="d"] .pack-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 24px; }
[data-layout="d"] .pilot .form { max-width: 760px; }

[data-layout="d"] .sh-panel { top: 0; right: 0; bottom: 0; width: min(520px, 46vw); transform: translateX(105%); box-shadow: -10px 0 40px rgba(0, 0, 0, .25); }
[data-layout="d"] .sheet.in .sh-panel { transform: none; }
[data-layout="d"] .sh-stage { height: 46vh; min-height: 300px; }
[data-layout="d"] .sh-grip { display: none; }