.cl-shell { display:grid; grid-template-columns:190px minmax(0,1fr); min-height:620px; border:1px solid var(--cx-border); border-radius:.75rem; overflow:hidden; background:var(--cx-surface-1); }
#dept-nav .cx-nav-soon.dept-btn { opacity:1; cursor:pointer; color:var(--cx-text-2); background:transparent; }
#dept-nav .cx-nav-soon.dept-btn:hover,#dept-nav .cx-nav-soon.dept-btn:focus-visible { background:var(--cx-surface-2); color:var(--cx-text); }
#dept-nav .cx-nav-soon.dept-btn.bg-\[var\(--cx-accent-wash\)\] { background:var(--cx-accent-wash); color:var(--cx-accent); }
.cl-nav { border-right:1px solid var(--cx-border); background:var(--cx-surface-2); padding:.7rem; }
.cl-nav-group { margin:.75rem .5rem .25rem; color:var(--cx-text-muted); font-size:.64rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.cl-nav button { display:block; width:100%; border:0; border-radius:.38rem; padding:.42rem .52rem; text-align:left; color:var(--cx-text-2); background:transparent; font-size:.78rem; cursor:pointer; }
.cl-nav button:hover,.cl-nav button:focus-visible { background:var(--cx-accent-wash); color:var(--cx-text); outline:2px solid transparent; }
.cl-nav button[aria-current="page"] { color:var(--cx-accent); background:var(--cx-accent-wash); font-weight:650; }
.cl-main { min-width:0; padding:1rem; }
.cl-heading { display:flex; align-items:flex-start; gap:.75rem; margin-bottom:.85rem; }
.cl-heading h2 { font-size:1.08rem; font-weight:700; }
.cl-heading p { color:var(--cx-text-muted); font-size:.75rem; margin-top:.14rem; }
.cl-actions { margin-left:auto; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.4rem; }
.cl-btn { border:1px solid var(--cx-border); border-radius:.4rem; padding:.42rem .65rem; color:var(--cx-text); background:var(--cx-surface-1); font-size:.72rem; font-weight:600; cursor:pointer; }
.cl-btn:hover,.cl-btn:focus-visible { border-color:var(--cx-accent); background:var(--cx-accent-wash); outline:2px solid transparent; }
.cl-btn-primary { color:var(--cx-text-on-accent); background:var(--cx-accent); border-color:var(--cx-accent); }
.cl-btn-danger { color:var(--cx-error); }
.cl-toolbar { display:flex; flex-wrap:wrap; gap:.45rem; align-items:end; padding:.65rem; margin-bottom:.65rem; border:1px solid var(--cx-border); border-radius:.5rem; background:var(--cx-surface-2); }
.cl-field { display:flex; flex-direction:column; gap:.18rem; min-width:130px; }
.cl-field-grow { flex:1 1 220px; }
.cl-field label { color:var(--cx-text-muted); font-size:.64rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.cl-input,.cl-select,.cl-textarea { width:100%; border:1px solid var(--cx-border); border-radius:.38rem; padding:.44rem .5rem; color:var(--cx-text); background:var(--cx-bg); font-size:.78rem; }
.cl-input:focus,.cl-select:focus,.cl-textarea:focus { outline:2px solid var(--cx-accent); outline-offset:1px; }
.cl-table-wrap { overflow-x:auto; border:1px solid var(--cx-border); border-radius:.5rem; }
.cl-table { width:100%; border-collapse:collapse; min-width:760px; font-size:.72rem; }
.cl-table th { position:sticky; top:0; z-index:1; padding:.48rem .55rem; color:var(--cx-text-muted); background:var(--cx-surface-2); border-bottom:1px solid var(--cx-border); text-align:left; white-space:nowrap; font-size:.63rem; letter-spacing:.04em; text-transform:uppercase; }
.cl-table td { padding:.46rem .55rem; border-bottom:1px solid var(--cx-border); vertical-align:top; }
.cl-table tbody tr:last-child td { border-bottom:0; }
.cl-table tbody tr:hover { background:var(--cx-accent-wash); }
.cl-table a,.cl-link { color:var(--cx-accent); text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.cl-table input[type="checkbox"] { width:1rem; height:1rem; accent-color:var(--cx-accent); }
.cl-pager { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:.55rem; color:var(--cx-text-muted); font-size:.68rem; }
.cl-status { display:inline-flex; align-items:center; border:1px solid var(--cx-border); border-radius:999px; padding:.13rem .42rem; font-size:.61rem; font-weight:700; text-transform:capitalize; white-space:nowrap; }
.cl-status[data-status="completed"],.cl-status[data-status="posted"],.cl-status[data-status="received"],.cl-status[data-status="closed"] { color:var(--cx-ok); border-color:color-mix(in srgb,var(--cx-ok) 40%,var(--cx-border)); }
.cl-status[data-status="cancelled"],.cl-status[data-status="failed"] { color:var(--cx-error); }
.cl-status[data-status="sent"],.cl-status[data-status="in_transit"],.cl-status[data-status="in_progress"],.cl-status[data-status="partially_received"] { color:var(--cx-accent); }
.cl-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.55rem; margin-bottom:.75rem; }
.cl-kpi { border:1px solid var(--cx-border); border-radius:.5rem; padding:.75rem; background:var(--cx-surface-2); }
.cl-kpi strong { display:block; font-size:1.35rem; font-variant-numeric:tabular-nums; }
.cl-kpi span { color:var(--cx-text-muted); font-size:.68rem; }
.cl-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
.cl-card { border:1px solid var(--cx-border); border-radius:.5rem; padding:.75rem; min-width:0; }
.cl-card h3 { font-size:.8rem; font-weight:700; margin-bottom:.45rem; }
.cl-muted { color:var(--cx-text-muted); }
.cl-empty { padding:2rem 1rem; text-align:center; color:var(--cx-text-muted); }
.cl-error { border:1px solid color-mix(in srgb,var(--cx-error) 45%,var(--cx-border)); background:color-mix(in srgb,var(--cx-error) 8%,transparent); border-radius:.5rem; padding:.7rem; color:var(--cx-error); font-size:.78rem; }
.cl-form-section { border:1px solid var(--cx-border); border-radius:.5rem; margin-bottom:.65rem; overflow:hidden; }
.cl-form-section h3 { padding:.55rem .7rem; background:var(--cx-surface-2); border-bottom:1px solid var(--cx-border); font-size:.73rem; font-weight:700; }
.cl-form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; padding:.7rem; }
.cl-line-editor { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; align-items:end; padding:.65rem 0; border-bottom:1px solid var(--cx-border); }
.cl-line-editor:first-child { padding-top:0; }
.cl-line-editor:last-child { padding-bottom:0; border-bottom:0; }
.cl-span-2 { grid-column:span 2; }.cl-span-3 { grid-column:1/-1; }
.cl-form-footer { display:flex; gap:.45rem; justify-content:flex-end; position:sticky; bottom:0; padding:.65rem; background:color-mix(in srgb,var(--cx-surface-1) 94%,transparent); border-top:1px solid var(--cx-border); }
.cl-note { padding:.55rem .65rem; border-left:3px solid var(--cx-accent); background:var(--cx-accent-wash); font-size:.72rem; }
.cl-negative { color:var(--cx-error); font-weight:700; }
@media(max-width:900px){.cl-shell{grid-template-columns:1fr}.cl-nav{border-right:0;border-bottom:1px solid var(--cx-border);display:flex;gap:.2rem;overflow:auto}.cl-nav-group{display:none}.cl-nav button{width:auto;white-space:nowrap}.cl-kpis{grid-template-columns:repeat(2,1fr)}.cl-form-grid,.cl-line-editor{grid-template-columns:1fr}.cl-span-2,.cl-span-3{grid-column:auto}.cl-grid{grid-template-columns:1fr}}
