/* Shared visual system. Layout, data, scanning and transaction behaviour stay in their modules. */
:root {
  --pm-body-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --pm-title-font: 'Manrope', var(--pm-body-font);
  --pm-ink: #20232b;
  --pm-secondary: #545b69;
  --pm-muted: #626978;
  --pm-line: #dfe2e9;
  --pm-surface: #ffffff;
  --pm-canvas: #f5f6f9;
  --pm-accent: #c21520;
  font-family: var(--pm-body-font);
  color: var(--pm-ink);
}
body, body.admin-mode, body.access-mode {font-family:var(--pm-body-font);background:var(--pm-canvas);color:var(--pm-ink);letter-spacing:-.01em}
button,input,select,textarea {font-family:var(--pm-body-font)}
h1,h2,h3,.app-brand-copy strong {font-family:var(--pm-title-font);font-weight:650;letter-spacing:-.035em;line-height:1.25;color:var(--pm-ink)}
button {touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {outline:2px solid var(--pm-accent);outline-offset:3px}
input::placeholder,textarea::placeholder {color:var(--pm-muted);opacity:1}
button:not(:disabled):hover {filter:brightness(.98)}
.eyebrow,.admin-nav-label {font-size:11px!important;letter-spacing:.12em;font-weight:600;color:var(--pm-muted)}
.app-brand-copy>span,.work-mode .app-brand-copy>span,.admin-brand .app-brand-copy>span {font-size:11px;color:var(--pm-secondary);line-height:1.5}
.app-brand-copy strong {font-weight:700}
.admin-brand .app-brand-copy strong {font-size:20px}
body .app-brand-header {border-color:var(--pm-line)}
body:not(.admin-mode) .panel,.admin-content .panel,.admin-content .reference-sheet,.report-panel {border-color:var(--pm-line);box-shadow:0 2px 10px #20232b04}
body:not(.admin-mode) p,body:not(.admin-mode) small {color:var(--pm-secondary)}

/* Navigation and management: readable labels, consistent controls, restrained spacing. */
.admin-sidebar {background:#fcfcfe;border-color:var(--pm-line)}
#admin-tabs button {font-size:14px;line-height:1.35;font-weight:500;min-height:48px;color:var(--pm-secondary);padding:10px 12px;gap:10px}
#admin-tabs button[aria-pressed=true] {color:var(--pm-accent);background:#fcecef;font-weight:600}
#admin-tabs button svg {width:30px;height:30px;color:inherit}
.admin-topbar {border-color:var(--pm-line)}
.admin-breadcrumb,.admin-account {font-size:13px;color:var(--pm-secondary)}
.admin-breadcrumb strong {color:var(--pm-ink)}
.admin-sidebar-bottom>span,#admin-close {font-size:12px;color:var(--pm-secondary)}
#admin-close {min-height:44px}
.admin-content {padding:28px}
.admin-content h1,.admin-content .panel h2,.admin-content .sheet-heading h2,.report-heading h2,#history .history-heading h2 {font-family:var(--pm-title-font);font-size:26px;font-weight:650;letter-spacing:-.035em;line-height:1.25}
.admin-content h3,.admin-content .panel h3 {font-family:var(--pm-title-font);font-size:18px;font-weight:650;line-height:1.35}
.admin-content p,.admin-content .panel p,.admin-content label,.admin-content .panel label {font-size:14px;line-height:1.6;color:var(--pm-secondary)}
.admin-content label,.admin-content .panel label {font-weight:500;color:#414856}
.admin-content small,.admin-content .panel small {color:var(--pm-muted)}
.admin-content input:not(.sheet-table input),.admin-content select,.admin-content .panel input,.admin-content .panel select {min-height:42px;border-color:#d5d9e2;border-radius:10px;font-size:14px;color:var(--pm-ink);background:#fff}
.admin-content button:not(.sheet-table button):not(.sheet-toolbar button):not(.report-page-actions button),.admin-content .panel button {min-height:40px;font-size:13px;border-radius:10px;line-height:1.4}
.admin-content summary,.admin-content .panel summary {font-size:14px;font-weight:500;color:var(--pm-ink)}
.admin-content .panel td,.admin-content .panel th {font-size:13px;line-height:1.5;border-color:var(--pm-line)}
.admin-content .panel th {color:var(--pm-secondary);font-weight:600;letter-spacing:.02em}
.admin-content .panel td {color:var(--pm-ink)}
.admin-content .row {font-size:14px;line-height:1.6;border-color:var(--pm-line)}
.admin-content .user-actions,.admin-content .form-actions {gap:8px}
.admin-content .inventory-summary {gap:20px}
.admin-content .inventory-summary span {font-size:13px;color:var(--pm-secondary)}
.admin-content .inventory-pagination span {font-size:13px;color:var(--pm-secondary)}

/* Spreadsheet density remains deliberate; headers and cell values no longer fade away. */
.admin-mode .sheet-heading small,.report-heading small,#history .history-eyebrow {font-size:11px;letter-spacing:.1em;font-weight:600;color:var(--pm-muted)}
.admin-mode .sheet-toolbar button,.admin-mode .sheet-maximized .sheet-toolbar button {font-size:13px;height:auto;min-height:40px;padding:9px 12px}
.admin-mode .sheet-toolbar .autosave-status,.admin-mode .sheet-maximized .sheet-toolbar .autosave-status {font-size:12px;color:var(--pm-secondary)}
.admin-mode .sheet-filters input,.admin-mode .sheet-filters select {height:42px;min-height:42px;font-size:14px;color:var(--pm-ink)}
.admin-mode .sheet-help {font-size:12px;line-height:1.6;color:var(--pm-secondary)}
.admin-mode .sheet-formula-bar output,.admin-mode .sheet-formula-bar>span {font-size:12px;color:var(--pm-secondary)}
.admin-mode .sheet-table,.report-table {font-family:var(--pm-body-font);font-variant-numeric:tabular-nums}
.admin-mode .sheet-table input {font-size:13px;height:36px;min-height:36px;line-height:1.4;color:var(--pm-ink)}
.admin-mode .sheet-table .sheet-column-supplier input {font-size:12px;color:var(--pm-secondary)}
.admin-mode .sheet-table thead th button {font-size:11px;line-height:1.4;letter-spacing:.02em;color:var(--pm-secondary);min-height:36px;height:auto}
.admin-mode .sheet-table thead th small,.admin-mode .sheet-table .sheet-row-number,.admin-mode .sheet-table .sheet-column-location_note small {font-size:11px;color:var(--pm-muted)}
.admin-mode .sheet-table .sheet-actions button {font-size:11px;min-height:30px;height:30px;color:var(--pm-secondary)}
.admin-mode .sheet-bottom,.admin-mode .sheet-pagination,.admin-mode .sheet-bottom>strong {font-size:12px;color:var(--pm-secondary)}
.admin-mode .sheet-pagination button {min-width:32px;min-height:32px;height:32px}
.admin-mode .sheet-dialog h2 {font-family:var(--pm-title-font);font-size:22px}
.admin-mode .sheet-maximized .sheet-heading h2 {font-size:22px}

/* Reports and activity keep their existing columns, filters and exports. */
.report-heading button,.report-filters button,.report-view-switch button {min-height:40px;font-size:13px;height:auto}
.report-filters label {font-size:12px;color:var(--pm-secondary)}
.report-filter-hint,.report-method,.report-scope,.report-status {font-size:12px;color:var(--pm-secondary);line-height:1.6}
.report-metrics span {font-size:12px;color:var(--pm-secondary)}
.report-metrics strong {font-family:var(--pm-title-font);font-size:25px;font-weight:650;color:var(--pm-ink)}
.report-table td {font-size:13px;line-height:1.5;color:var(--pm-ink)}
.report-table thead th,.report-table thead th small,.report-table .report-row-number {font-size:11px;color:var(--pm-muted)}
.report-footer {font-size:12px;color:var(--pm-secondary)}
#history .history-heading p,#history .history-count,#history .movement-code,#history .movement-time {font-size:12px;color:var(--pm-muted)}
#history #history-search {font-size:14px;min-height:44px;background:#fff}
#history .history-kinds button {font-size:13px;min-height:38px;color:var(--pm-secondary)}
#history .history-table th {font-size:12px;font-weight:600;color:var(--pm-secondary)}
#history .history-table td {font-size:14px;padding-top:20px;padding-bottom:20px}
#history .movement-description {font-size:15px;font-weight:600;color:var(--pm-ink)}
#history .movement-date,#history .movement-place,#history .movement-actor {font-size:13px;color:var(--pm-secondary)}
#history .movement-avatar {font-size:11px;color:var(--pm-secondary)}
#history .movement-kind {font-size:11px;font-weight:600}
#history .movement-quantity {font-size:19px;font-weight:600}
#history .history-status,#history .history-empty,#history .movement-location::before {font-size:12px;color:var(--pm-muted)}

/* Access and installation share the same clear type hierarchy. */
#access .box-heading h1,body:not(.admin-mode) .auth-heading h1,body:not(.admin-mode) .auth-heading h2 {font-family:var(--pm-title-font);font-size:26px;font-weight:650;letter-spacing:-.035em}
#access .box-heading small,#access .auth-heading small {font-size:11px!important;color:var(--pm-muted)!important;letter-spacing:.1em}
#access .box-heading strong {font-size:12px;color:var(--pm-secondary);padding:4px 8px}
#access #device-assignment-message {font-size:14px;color:var(--pm-secondary);line-height:1.6}
#access .users .user-info>span {font-size:16px;line-height:1.4;font-weight:600}
#access .users .user-info small {font-size:13px;color:var(--pm-secondary)}
#access .users .avatar {font-size:19px;color:var(--pm-secondary)}
#access #login label,body:not(.admin-mode) .auth-card label {font-size:14px;color:var(--pm-secondary)}
#access .auth-submit,body:not(.admin-mode) .auth-submit {font-size:15px;min-height:48px;font-weight:600}
#access .installation-entry a,#access footer button,body:not(.admin-mode) .auth-back {font-size:13px;min-height:44px;color:var(--pm-secondary)}
body:not(.admin-mode) .auth-card input {font-size:16px;min-height:48px}
.installation h1,.installation h2 {font-family:var(--pm-title-font);font-weight:650}
.installation p,.installation li {font-size:16px;line-height:1.65;color:var(--pm-secondary)}
.installation small {font-size:12px;color:var(--pm-muted)}

/* Workshop: compact camera and description retained, readable movement controls below. */
.work-mode .work-heading h1 {font-family:var(--pm-title-font);font-size:24px;font-weight:650;line-height:1.3;letter-spacing:-.035em}
.work-mode .operator-chip {font-size:13px;line-height:1.5;color:var(--pm-secondary)}
.work-mode .work-title-symbol,.work-mode .work-heading>button {color:var(--pm-secondary)!important}
.work-mode .work-status {padding:8px 12px;gap:4px 12px;border-color:var(--pm-line)}
.work-mode .work-status strong,.work-mode .work-status span,.work-mode .work-status p,.work-mode .work-status small {font-size:12px;line-height:1.5;color:var(--pm-secondary)}
.work-mode .scanner-panel .camera-feedback:has(#scan-summary:not([hidden])) {background:#f7f8fb;border-color:var(--pm-line);padding:12px;border-radius:12px;box-shadow:none}
.work-mode .scan-summary #part-description {font-family:var(--pm-title-font);font-size:21px;font-weight:650;line-height:1.35;letter-spacing:-.025em;color:var(--pm-ink)}
.work-mode .scan-summary .reference-code {font-size:12px;color:var(--pm-secondary)}
.work-mode .scan-code-chip {color:var(--pm-secondary);border-color:var(--pm-line)}
.work-mode .scan-summary #part-supplier {font-size:12px;line-height:1.5;color:var(--pm-secondary)}
.work-mode .scan-summary .scan-read-badge {font-size:11px;line-height:1.4;font-weight:600}
.work-mode .scanner-panel .camera-feedback p,.work-mode .scanner-panel:has(#scan-summary:not([hidden])) #camera-message {font-size:12px;line-height:1.5;color:var(--pm-secondary)}
.work-mode .scanner-panel #camera-retry {font-size:13px!important}
.work-mode .stock-balance .amount {font-family:var(--pm-title-font);font-size:34px;font-weight:650;letter-spacing:-.04em;color:var(--pm-ink)}
.work-mode .reference-panel .stock-balance small {font-size:12px!important;color:var(--pm-secondary)}
.work-mode .reference-panel #part-location {font-size:13px;color:var(--pm-secondary)}
.work-mode .reference-panel #part-location::before {font-size:12px;color:var(--pm-muted)}
.work-mode .reference-panel #qty-label {font-size:14px;color:var(--pm-secondary)}
.work-mode .modes button {font-size:15px;min-height:48px;font-weight:600}
.work-mode .quantity button {min-height:48px;min-width:44px}
.work-mode .quantity input {min-height:48px;font-size:22px;font-weight:600}
.work-mode .reference-panel #confirm {min-height:50px;font-size:16px;font-weight:600}
.work-mode details summary {font-size:14px;color:var(--pm-secondary)}
.daily-heading h2 {font-family:var(--pm-title-font);font-size:22px;font-weight:650}
#daily-status,.daily-help,.daily-empty,#daily-message,.daily-withdrawal small {font-size:13px;line-height:1.6;color:var(--pm-secondary)}
.daily-withdrawal strong {font-size:15px;font-weight:600}
.daily-quantity {font-size:15px}
.daily-return p {font-size:14px;line-height:1.6;color:var(--pm-secondary)}
body.work-mode .daily-return button {font-size:14px}

@media(max-width:1100px) and (min-width:901px) {
  .admin-content {padding:20px}
  #history .movement-description {font-size:14px}
  #history .movement-date {font-size:12px}
}
@media(max-width:900px) {
  .admin-sidebar {padding:0 12px 10px}
  #admin-tabs {display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#ccd0d9 transparent;padding-bottom:4px}
  #admin-tabs button {flex:1 0 92px;min-width:92px;min-height:62px;height:auto;padding:9px 8px;font-size:12px;gap:6px;white-space:normal}
  #admin-tabs button svg {width:21px;height:21px;padding:0}
  #admin-tabs button span {font-size:12px}
  #admin-tabs button span::after {content:none}
  .admin-content {padding:18px}
  .admin-content input:not(.sheet-table input),.admin-content select,.admin-content .panel input,.admin-content .panel select,.admin-mode .sheet-filters input,.admin-mode .sheet-filters select {font-size:16px;min-height:44px;height:auto}
  .admin-content button:not(.sheet-table button),.admin-mode .sheet-toolbar button,.report-heading button {min-height:44px}
  .admin-mode .sheet-table input {font-size:16px;min-height:40px;height:40px}
  .admin-mode .sheet-table .sheet-column-supplier input {font-size:16px}
  .admin-mode .sheet-table .sheet-actions button {min-height:40px;height:40px}
  .admin-mode .sheet-table thead th button {min-height:40px}
  .admin-mode .sheet-maximized .sheet-toolbar .autosave-status {font-size:12px}
}
@media(max-width:760px) {
  #history .history-heading {gap:10px;flex-wrap:wrap}
  #history .history-heading p {font-size:12px;max-width:none}
  #history .history-count {font-size:12px}
  #history .history-kinds button {min-height:44px;font-size:13px}
  #history .history-table td {padding:0}
  #history .movement-row {gap:14px 12px}
  #history .movement-location {max-width:145px}
  #history .movement-location .movement-code,#history .movement-location::before {font-size:11px}
  #history .movement-description {font-size:15px}
}
@media(max-width:480px) {
  .admin-content {padding:12px}
  .admin-content h1,.admin-content .panel h2,.admin-content .sheet-heading h2,.report-heading h2,#history .history-heading h2 {font-size:23px}
  .admin-mode .sheet-toolbar {flex-wrap:wrap}
  .admin-mode .sheet-toolbar button {font-size:12px}
  .admin-topbar {padding:0 14px}
  .admin-account {font-size:12px}
  #access #device-assignment-message {padding-left:0;font-size:14px}
  #access .box-heading h1 {font-size:24px}
  .work-mode .work-heading h1 {font-size:22px}
  .work-mode .work-grid>.scanner-panel {grid-template-columns:104px minmax(0,1fr);gap:10px;padding:10px}
  .work-mode .scanner-panel .camera {width:104px;height:104px}
  .work-mode .scanner-panel .camera-feedback:has(#scan-summary:not([hidden])) {padding:10px}
  .work-mode .scan-summary #part-description {font-size:18px}
  .work-mode .scan-summary-top {flex-wrap:wrap;gap:6px}
  .work-mode .scan-summary .reference-code {font-size:11px}
  .work-mode .scan-summary .scan-read-badge {font-size:11px}
  .work-mode .reference-panel .stock-overview {gap:12px;grid-template-columns:1fr 1fr}
  .work-mode .stock-balance .amount {font-size:30px}
  .daily-heading h2 {font-size:20px}
}