* { box-sizing: border-box; }
body { margin: 0; color: #111; background: #fff; font-family: "Saira", Arial, sans-serif; }
button, input, select, textarea { font: inherit; }
.page-shell { width: min(1500px, calc(100vw - 40px)); margin: 0; padding: 20px 0 56px 20px; }
.tool-grid { display: grid; grid-template-columns: 350px minmax(860px, 1fr); gap: 24px; align-items: start; }
.details-panel { min-width: 0; }
.top-actions { align-items: end; }
.top-document-select { display: grid; gap: 8px; min-width: 320px; }
.top-document-select span { color: #475569; font-size: 14px; font-weight: 700; line-height: 22px; }
.field-group[hidden], .customs-col[hidden] { display: none; }
.field { display: grid; gap: 8px; margin-bottom: 16px; }
.field span { color: #777; font-size: 14px; line-height: 22px; }
.field-row { display: grid; gap: 14px; }
.field-row.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field-row.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.field-row.two-one { grid-template-columns: 2fr 1fr 1fr; }
.product-search-row { grid-template-columns: 170px minmax(180px, 1fr) minmax(260px, 1.4fr); align-items: end; }
input, select, textarea { width: 100%; min-height: 44px; border: 1px solid var(--at-border, #e7e2e2); border-radius: 12px; background: #fff; color: #111827; padding: 9px 12px; }
textarea { resize: vertical; min-height: 88px; line-height: 1.35; }
input:focus, select:focus, textarea:focus { border-color: rgba(15, 121, 243, .55); box-shadow: 0 0 0 4px rgba(15, 121, 243, .10); outline: 0; }
.status-line { min-height: 24px; color: #777; font-size: 14px; line-height: 24px; }
.status-line.is-error { color: #b3261e; }
.product-toolbar { margin-bottom: 14px; }
.add-product-button, .print-button, .icon-button { gap: 9px; }
.print-button { margin-top: 18px; }
.product-table-wrap { width: 100%; overflow-x: visible; background: #fff; border: 1px solid #d7d7d7; }
.product-table { width: 100%; min-width: 0; border-collapse: collapse; table-layout: fixed; background: #fff; }
.product-table th, .product-table td { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #ededed; padding: 8px; vertical-align: top; text-align: left; }
.product-table th { color: #666; font-size: 12px; font-weight: 500; background: #fafafa; }
.product-table th:first-child { width: 230px; }
.product-table .wide { width: 220px; }
.product-table td strong { display: block; font-size: 13px; font-weight: 500; line-height: 1.25; }
.product-table td span { display: block; margin-top: 3px; color: #777; font-size: 12px; line-height: 1.2; }
.product-table input, .product-table select { min-height: 34px; padding: 6px 7px; font-size: 13px; border-radius: 8px; }
.product-table .origin-col { width: 58px; }
.product-table .units-col { width: 66px; }
.product-table .mass-col { width: 68px; }
.mini-input { width: 64px; }
.code-input { width: 96px; }
.origin-select { width: 48px; padding-left: 7px; padding-right: 4px; }
.units-input { width: 56px; }
.mass-input { width: 58px; }
.empty-row td { color: #777; font-size: 14px; padding: 18px; }
.icon-button { min-width: 34px; min-height: 34px; padding: 6px; }
@media (max-width: 1100px) { .page-shell { width: auto; padding: 16px; } .tool-grid { grid-template-columns: 1fr; } .field-row.three, .field-row.four, .field-row.two-one { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .field-row.three, .field-row.four, .field-row.two-one { grid-template-columns: 1fr; } }