
:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:#f4f6f8; color:#17212b; }
* { box-sizing:border-box; }
body { margin:0; background:#f4f6f8; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
.hidden { display:none !important; }
.shell { max-width:1440px; margin:0 auto; padding:22px; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.brand h1 { margin:0; font-size:26px; }
.brand p { margin:4px 0 0; color:#617080; }
.card { background:#fff; border:1px solid #dfe5ea; border-radius:14px; box-shadow:0 8px 26px rgba(26,39,52,.06); padding:18px; }
.grid { display:grid; grid-template-columns:minmax(340px, .9fr) minmax(480px, 1.6fr); gap:18px; align-items:start; }
.stack { display:grid; gap:14px; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.spread { justify-content:space-between; }
.note { color:#687786; font-size:13px; }
.message { min-height:20px; margin:8px 0; color:#405363; }
.message.danger { color:#a22626; }
.message.success { color:#176b3b; }
.primary, .secondary, .ghost { border-radius:9px; padding:10px 14px; border:1px solid transparent; font-weight:650; }
.primary { background:#175cd3; color:#fff; }
.secondary { background:#eef4ff; border-color:#b9cdf7; color:#174b9f; }
.ghost { background:#fff; border-color:#cfd8df; color:#334555; }
.primary:disabled, .secondary:disabled { opacity:.45; cursor:not-allowed; }
label { display:grid; gap:6px; color:#3b4c5b; font-size:13px; font-weight:650; }
input, select, textarea { width:100%; border:1px solid #bdc9d3; border-radius:8px; padding:10px; background:#fff; color:#17212b; }
textarea { resize:vertical; min-height:78px; }
details.external-shipment { border:1px solid #d9e1e7; border-radius:10px; padding:12px; background:#f8fafb; }
details.external-shipment summary { cursor:pointer; font-weight:750; color:#334555; }
details.external-shipment[open] summary { margin-bottom:12px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.full { grid-column:1/-1; }
.orders { display:grid; gap:9px; max-height:70vh; overflow:auto; }
.order { width:100%; text-align:left; border:1px solid #d9e1e7; background:#fff; border-radius:10px; padding:12px; }
.order:hover, .order.active { border-color:#4f83db; background:#f4f8ff; }
.order strong { display:block; font-size:15px; }
.order span { display:block; margin-top:3px; color:#687786; font-size:12px; }
.pill { display:inline-flex; border-radius:999px; padding:4px 9px; background:#eaf0f5; color:#405363; font-size:12px; font-weight:700; }
table { width:100%; border-collapse:collapse; }
th, td { padding:9px 8px; text-align:left; border-bottom:1px solid #e7ecef; font-size:13px; vertical-align:top; }
th { color:#536473; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.package-row { display:grid; grid-template-columns:44px repeat(4,1fr) 42px; gap:8px; align-items:end; margin-bottom:8px; }
.package-number { padding:10px 0; font-weight:750; color:#516271; }
.login { max-width:440px; margin:10vh auto 0; }
.login h2 { margin-top:0; }
.status-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.status-item { border:1px solid #dce4ea; border-radius:9px; padding:10px; background:#f8fafb; }
.status-item strong, .status-item span { display:block; }
.status-item span { color:#667684; font-size:12px; margin-top:3px; }
.checkbox-row { display:flex; flex-direction:row; align-items:center; gap:8px; font-weight:650; }
.checkbox-row input { width:auto; margin:0; }
@media (max-width:900px) { .grid { grid-template-columns:1fr; } .orders { max-height:none; } }
@media (max-width:620px) { .shell { padding:12px; } .form-grid, .status-grid { grid-template-columns:1fr; } .package-row { grid-template-columns:38px 1fr 1fr; } .package-row label:nth-of-type(3), .package-row label:nth-of-type(4) { grid-row:2; } }
