/* Engineering cabinet reference. Apply to a common app root.
   Light is the default; explicit warm/dark and text size remain user choices.
   Compact density and the contrast sidebar are fixed core defaults. */
.cabinet-ui {
  --cc-bg: #F3F4F5;
  --cc-surface: #FFFFFF;
  --cc-soft: #F3F4F5;
  --cc-text: #26313C;
  --cc-muted: #56616D;
  --cc-line: #CBD1D8;
  --cc-input: #7D8997;
  --cc-accent: #2D5D8A;
  --cc-accent-text: #FFFFFF;
  --cc-tint: #E8EFF6;
  --cc-side: #243447;
  --cc-side-text: #F3F5F7;
  --cc-side-muted: #C2CDD8;
  --cc-side-active: #3B526B;
  --cc-calc: #E8F1E8;
  --cc-calc-text: #315537;
  --cc-ref: #ECEFF2;
  --cc-ref-text: #56616D;
  --cc-change: #FFF0BD;
  --cc-change-text: #684D0F;
  --cc-font: 15px;
  --cc-label: 14px;
  --cc-small: 13px;
  --cc-title: 24px;
  --cc-section: 16px;
  --cc-row: calc(var(--cc-field) + 7px);
  --cc-field: 38px;
  --cc-control-line: 20px;
  --cc-control-pad-y: 8px;
  --cc-control-pad-x: 14px;
  --cc-cell-y: 3px;
  --cc-pad: 18px;
  --cc-gap: 16px;
  --cc-radius: 4px;
  --cc-sidebar-width: 196px;
  --cc-results-width: 244px;
  --cc-font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  color-scheme: light;
}
.cabinet-ui[data-theme="light"] {
  --cc-bg: #F3F4F5;
  --cc-surface: #FFFFFF;
  --cc-soft: #F3F4F5;
  --cc-text: #26313C;
  --cc-muted: #56616D;
  --cc-line: #CBD1D8;
  --cc-input: #7D8997;
  --cc-accent: #2D5D8A;
  --cc-accent-text: #FFFFFF;
  --cc-tint: #E8EFF6;
  --cc-side: #243447;
  --cc-side-text: #F3F5F7;
  --cc-side-muted: #C2CDD8;
  --cc-side-active: #3B526B;
  --cc-calc: #E8F1E8;
  --cc-calc-text: #315537;
  --cc-ref: #ECEFF2;
  --cc-ref-text: #56616D;
  --cc-change: #FFF0BD;
  --cc-change-text: #684D0F;
  color-scheme: light;
}
.cabinet-ui[data-theme="dark"] {
  --cc-bg: #18212B;
  --cc-surface: #202934;
  --cc-soft: #283340;
  --cc-text: #ECF0F5;
  --cc-muted: #BCC6D1;
  --cc-line: #526175;
  --cc-input: #8A9AAD;
  --cc-accent: #A7C7ED;
  --cc-accent-text: #182B40;
  --cc-tint: #31455D;
  --cc-side: #17232F;
  --cc-side-text: #ECF0F5;
  --cc-side-muted: #BCC6D1;
  --cc-side-active: #344B63;
  --cc-calc: #284535;
  --cc-calc-text: #C3E8C9;
  --cc-ref: #354253;
  --cc-ref-text: #CBD5E1;
  --cc-change: #584725;
  --cc-change-text: #F5DF9E;
  color-scheme: dark;
}
.cabinet-ui[data-theme="warm"] {
  --cc-bg: #F3F0E9;
  --cc-surface: #FFFDF7;
  --cc-soft: #F7F4ED;
  --cc-text: #343C36;
  --cc-muted: #596259;
  --cc-line: #C8CBC1;
  --cc-input: #808D7F;
  --cc-accent: #2D5D8A;
  --cc-accent-text: #FFFFFF;
  --cc-tint: #E9EEF2;
  --cc-side: #293748;
  --cc-side-text: #F3F4F6;
  --cc-side-muted: #C8D1DD;
  --cc-side-active: #415575;
  --cc-calc: #E8F0E2;
  --cc-calc-text: #315537;
  --cc-ref: #ECEEE5;
  --cc-ref-text: #56614F;
  --cc-change: #FFF0BD;
  --cc-change-text: #684D0F;
  color-scheme: light;
}
.cabinet-ui[data-text="small"] {
  --cc-font: 14px; --cc-label: 13px; --cc-small: 13px; --cc-title: 22px; --cc-section: 15px;
}
.cabinet-ui[data-text="large"] {
  --cc-font: 17px; --cc-label: 16px; --cc-small: 15px; --cc-title: 26px; --cc-section: 18px;
}

/* The reference changes only these token widths at 1080 px.
   Layout rules for 860 px / 600 px and coarse pointers belong to the app stylesheet. */
@media(max-width:1080px){
 .cabinet-ui{--cc-sidebar-width:180px;--cc-results-width:220px}
}

@media(pointer:coarse){
 .cabinet-ui{--cc-field:44px}
}