/* Common hierarchy, readable data and touch-friendly controls. */
:root { --text-muted:#60738b; --green:#17753e; --amber:#946000; --shadow-md:0 4px 18px rgba(16,43,92,.045); }
body { background:#f3f6fa; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #397bd6; outline-offset:3px; }
button:disabled { cursor:wait; opacity:.55; }
[hidden] { display:none !important; }
.main-panel { gap:20px; }
.topbar { border-radius:16px; padding:18px 22px; box-shadow:none; }
.topbar h2 { font-size:clamp(1.2rem,1.65vw,1.7rem); line-height:1.25; }
.section-header { gap:20px; align-items:flex-start; padding:4px 0 10px; }
.section-header h3 { font-size:clamp(1.3rem,1.7vw,1.75rem); line-height:1.3; }
.section-description { max-width:76ch; line-height:1.6; }
.section-kicker { letter-spacing:.08em; line-height:1.6; }
.panel-card { padding:22px; border-radius:16px; background:#fff; box-shadow:var(--shadow-md); }
.panel-head { margin-bottom:18px; }
.panel-head h3 { line-height:1.35; }
.inline-actions { gap:8px; flex-wrap:wrap; }
.primary-btn,.ghost-btn,.text-btn { min-height:42px; }
.primary-btn,.ghost-btn { border-radius:10px; }
.module-subnav { gap:6px; }
.module-subnav-btn { min-height:44px; border-radius:10px; }
.kpi-card { border-radius:14px; box-shadow:none; }
.kpi-card .value { font-variant-numeric:tabular-nums; }
#view-inventory > .content-grid,#view-catalog > .content-grid,#view-employees > .content-grid { grid-template-columns:minmax(0,1fr); }
#view-inventory .stack-panel { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }
.hse-editor { align-self:start; scroll-margin-top:20px; }
.hse-editor > summary { cursor:pointer; font-weight:700; color:var(--brand-deep); padding:2px 0; min-height:30px; }
.hse-editor[open] > summary { padding-bottom:20px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.hse-editor .form-grid { padding-top:4px; }
input,select,textarea { min-width:0; max-width:100%; }
.form-grid input,.form-grid select { min-height:44px; }
.form-grid label > span { font-size:.86rem; }
.field-hint { line-height:1.5; }
.table-wrap { border-radius:12px; }
.table-toolbar { background:#f8fafc; padding:12px 14px; gap:12px; align-items:end; }
.table-toolbar-field { flex:0 1 240px; }
.table-toolbar-field-tight { flex-basis:175px; }
.table-toolbar-summary { background:transparent; padding:6px 0; }
.data-table th { position:relative; background:#eef3f9; color:#364b66; padding-right:22px; font-size:.76rem; }
.data-table td { font-size:.86rem; line-height:1.5; overflow-wrap:anywhere; }
.data-table tbody tr:nth-child(even) { background:#fafbfd; }
.data-table tbody tr:hover { background:#f0f6ff; }
.hse-column-resize { position:absolute; right:0; top:0; height:100%; width:10px; padding:0; border:0; border-right:2px solid #c7d6e8; background:transparent; cursor:col-resize; touch-action:none; }
.hse-column-resize:hover { background:#d6e6fc; }
.hse-filter-summary { display:flex; gap:8px; flex-wrap:wrap; align-items:center; padding:10px 14px; font-size:.8rem; background:#edf5ff; }
.hse-filter-summary strong { padding:6px 10px; background:white; border:1px solid #ccdef3; border-radius:8px; overflow-wrap:anywhere; }
.hse-pagination { display:flex; gap:14px; align-items:center; justify-content:space-between; padding:14px; border-top:1px solid var(--line); font-size:.83rem; }
.hse-pagination button:disabled { cursor:default; }
.hse-import-dialog { width:min(960px,calc(100% - 32px)); max-height:calc(100dvh - 40px); padding:28px; border:1px solid var(--line); border-radius:20px; color:var(--text); background:#fff; box-shadow:var(--shadow-lg); overflow-y:auto; }
.hse-import-dialog::backdrop { background:rgba(12,30,53,.6); }
.hse-import-head { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.hse-import-head h2 { margin:5px 0 0; font-size:1.5rem; }
.hse-import-dialog p { line-height:1.6; }
.hse-import-dialog small { color:var(--text-soft); font-weight:400; line-height:1.5; }
.hse-import-help { border-left:3px solid var(--brand); padding:12px 16px; background:var(--brand-soft); margin:0; }
#hseImportFeedback { margin:20px 0; font-weight:600; overflow-wrap:anywhere; }
#hseImportPreview { border-top:1px solid var(--line); padding-top:16px; }
.hse-import-counts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:20px; }
.hse-import-counts div { padding:16px; background:#f3f6fa; border-radius:12px; display:grid; gap:4px; }
.hse-import-counts strong { font-size:1.5rem; }
.hse-import-counts span { font-size:.8rem; color:var(--text-soft); }
.hse-import-dialog details { padding:12px; background:#f8fafc; border-radius:10px; overflow-wrap:anywhere; }
.hse-import-dialog summary { cursor:pointer; font-weight:600; }
.hse-import-errors { padding:16px; margin-top:12px; background:#fff1ef; color:#962e25; border-radius:10px; max-height:240px; overflow:auto; }
.hse-import-footer { display:flex; gap:20px; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding-top:20px; margin-top:24px; }
.hse-import-footer span { font-size:.82rem; color:var(--text-soft); max-width:55ch; }
.hse-import-footer button { flex-shrink:0; }
@media(min-width:1181px) {
  .app-shell { grid-template-columns:260px minmax(0,1fr); }
  .app-shell.sidebar-collapsed { grid-template-columns:0 minmax(0,1fr); }
  .sidebar-scroll { padding:18px 14px; gap:14px; }
  .brand-panel { padding:14px; border-radius:16px; }
  .main-panel { padding:24px 28px; }
}
@media(max-width:1180px) {
  .topbar { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"title utility" "actions actions"; }
  .topbar-utility { gap:8px; flex-wrap:wrap; }
}
@media(max-width:860px) {
  .main-panel { padding:14px; gap:16px; }
  .topbar { padding:14px; grid-template-columns:1fr; grid-template-areas:"title" "utility" "actions"; gap:12px; }
  .topbar-utility { justify-content:flex-start; }
  .topbar-actions { flex-direction:row; gap:8px; }
  .topbar-actions > .search-field { flex:1 1 100%; }
  .topbar-actions > button { width:auto; flex:1 1 130px; }
  .panel-card { padding:16px; border-radius:14px; }
  .section-header .inline-actions { width:100%; display:flex; }
  .section-header .inline-actions > * { flex:1 1 140px; text-align:center; }
  .inventory-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  #view-inventory .stack-panel { grid-template-columns:minmax(0,1fr); }
  .table-toolbar { display:flex; flex-direction:row; flex-wrap:wrap; }
  .table-toolbar-field,.table-toolbar-field-tight { width:auto; flex:1 1 130px; }
  .table-toolbar-summary { flex:1 1 100%; width:auto; }
  .data-table tbody { padding:8px; gap:10px; }
  .data-table td { white-space:normal; padding:9px 12px; }
  .data-table td::before { font-size:.68rem; letter-spacing:.035em; }
  .hse-column-resize { display:none; }
  .hse-pagination { flex-wrap:wrap; gap:8px; }
  .hse-pagination span { order:-1; width:100%; text-align:center; }
  .hse-import-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 16px); padding:16px; border-radius:14px; }
  .hse-import-counts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hse-import-footer { flex-direction:column; align-items:stretch; gap:12px; }
  .hse-import-dialog input,.hse-import-dialog select,.form-grid input,.form-grid select,.form-grid textarea { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}

/* Prevent intrinsic grid widths and long status labels from expanding the page. */
.view.active { grid-template-columns:minmax(0,1fr); }
.view :is(div,article,section), .view > *, .content-grid > *, .stack-panel > * { min-width:0; }
.panel-head { flex-wrap:wrap; }
.status-pill { max-width:100%; white-space:normal; overflow-wrap:anywhere; text-align:center; }
.donut-chart-shell svg { max-width:100%; height:auto; }
.summary-item { min-width:0; flex-wrap:wrap; }
.summary-item > div { flex:1 1 160px; }
.summary-item > .status-pill { flex:0 1 auto; }
.hse-top-actions { position:relative; flex:0 0 auto; align-self:end; }
.hse-top-actions > summary { cursor:pointer; list-style:none; min-height:44px; padding:11px 16px; border:1px solid var(--line); border-radius:10px; background:white; font-weight:600; color:var(--brand); }
.hse-top-actions > summary::after { content:" ▾"; }
.hse-top-actions[open] .hse-top-actions-panel { position:absolute; right:0; top:calc(100% + 8px); z-index:20; display:grid; gap:8px; padding:12px; min-width:230px; background:white; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-md); }
@media(max-width:1180px) {
  .main-panel:has(.module-subnav:not(.hidden)) .mobile-nav { display:none; }
}
@media(max-width:860px) {
  .topbar-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; }
  .topbar-actions > .search-field { width:auto; }
  .topbar-actions > .hse-top-actions { width:auto; }
  .section-header .inline-actions > * { min-width:0; white-space:normal; }
  .view.active { gap:14px; }
  .toast-stack { right:12px; left:12px; }
  .toast { min-width:0; max-width:100%; }
  .section-description { font-size:.9rem; line-height:1.5; }
  .portal-entry-head, .portal-entry-head .inline-actions { flex-wrap:wrap; }
}

.topbar-actions .search-field { min-width:0; }
@media(max-width:480px) { .topbar-actions { grid-template-columns:minmax(0,1fr); } .topbar-actions > .hse-top-actions { justify-self:end; } }