/* CrusherOS v0.17 professional operating experience. Loaded last to retire earlier visual experiments. */
@font-face {
  font-family: "Crusher Display";
  src: local("DIN Condensed Bold"), local("Avenir Next Condensed Heavy"), local("Arial Narrow Bold"), local("Impact");
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

/* Fleet tools share a workspace while keeping each daily task focused. */
.fleet-tabs { margin-bottom: 1.25rem; }
[data-fleet-panel][hidden] { display: none; }
.fleet-panel-actions { display: flex; justify-content: flex-end; margin-bottom: 1rem; }
.fleet-work-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.fleet-work-layout > .panel { min-width: 0; }
#fleet-utility-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fleet-work-layout .operation-form { display: grid; gap: 1rem; }
.fleet-work-layout .operations-ledger { max-height: 42rem; }
@media (max-width: 1120px) { .fleet-work-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { #fleet-utility-summary { grid-template-columns: minmax(0, 1fr); } .fleet-tabs button { flex: 1 1 100%; } }

:root {
  --ink: #15120f;
  --ink-2: #211d18;
  --muted: #6f685e;
  --paper: #f3f0e8;
  --surface: #fffdf7;
  --surface-2: #ebe6dc;
  --line: #d1c9bb;
  --line-strong: #9a9184;
  --green: #15120f;
  --green-2: #2a241e;
  --lime: #ff4d00;
  --orange: #ff4d00;
  --orange-2: #d94200;
  --blue: #15120f;
  --focus: #ff4d00;
  --amber: #c36a00;
  --red: #a8281d;
  --success: #17744a;
  --shadow: 0 10px 25px rgba(21, 18, 15, .07);
  --shadow-hover: 0 15px 32px rgba(21, 18, 15, .12);
  --body-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --display-font: "Outfit", "Inter", -apple-system, system-ui, sans-serif;
  --tech-font: "SFMono-Regular", "Roboto Mono", Menlo, Monaco, Consolas, monospace;
  color: var(--ink);
  font-family: var(--body-font);
  font-weight: 450;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  color: var(--ink);
  background:
    linear-gradient(rgba(21,18,15,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,18,15,.025) 1px, transparent 1px),
    var(--paper);
  background-size: 32px 32px;
  letter-spacing: -.004em;
}

::selection { color: var(--ink); background: #ff9a70; }
h1, h2, h3, strong, b { color: inherit; }
b, strong { font-weight: 700; }
.topbar h1,
.section-heading h2,
.login-brand h1,
.login-card h2,
.kpi strong,
.stock-card strong,
.system-card .metric,
.readiness-card strong,
dialog h2 {
  font-family: var(--display-font);
  font-weight: 900;
  font-stretch: condensed;
  letter-spacing: .01em;
}
.section-heading h2 {
  margin-top: .05rem;
  font-size: clamp(2.15rem, 4vw, 3.7rem);
  line-height: .9;
  text-transform: uppercase;
}
.section-copy { color: var(--muted); max-width: 58rem; }
.eyebrow,
.release-badge,
.status,
.count-chip,
.role-pill,
.plant-only-badge {
  font-family: var(--tech-font);
  text-transform: uppercase;
  letter-spacing: .12em;
}
.eyebrow { color: var(--orange-2); font-size: .65rem; font-weight: 750; }
.muted, .help-text, .field-help { color: var(--muted); }

.crusher-logo {
  display: block;
  flex: 0 0 auto;
  border-radius: .32rem;
  filter: drop-shadow(0 6px 11px rgba(21,18,15,.2));
}
.login-logo { width: 4rem; height: 4rem; border-radius: .45rem; }
.sidebar-logo { width: auto; height: 2.2rem; flex: 0 0 auto; border-radius: 0; }
.release-badge { color: #8e2d00; background: #fff0e8; border: 1px solid #f1b092; font-size: .54rem; font-weight: 800; }

/* Industrial controls */
.primary, .secondary, .text-button, .nav-item, .experience-action, button {
  transition: transform 130ms ease, background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.primary, .secondary {
  border-radius: .26rem;
  min-height: 2.75rem;
  font-weight: 760;
}
.primary {
  color: var(--ink);
  border: 1px solid var(--orange);
  background: var(--orange);
  box-shadow: 4px 4px 0 rgba(21,18,15,.14);
}
.primary:hover:not(:disabled) { color: var(--ink); background: #ff6727; border-color: #ff6727; box-shadow: 5px 5px 0 rgba(21,18,15,.19); transform: translate(-1px,-1px); }
.secondary { color: var(--ink); background: var(--surface); border: 1px solid var(--ink); box-shadow: none; }
.secondary:hover:not(:disabled) { color: var(--ink); background: #e9e3d7; border-color: var(--ink); transform: translateY(-1px); }
.text-button { color: #a93600; border-radius: .2rem; }
.text-button:hover:not(:disabled) { color: var(--ink); background: #ffe9de; }
button:active:not(:disabled), .experience-action:active { transform: translateY(1px) scale(.985); box-shadow: none; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 2px;
}
input, select, textarea, .login-card input {
  color: var(--ink);
  border: 1px solid #aaa195;
  border-radius: .22rem;
  background: #fffefa;
}
input:focus, select:focus, textarea:focus, .login-card input:focus {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgba(255,77,0,.18);
}
.page-progress span { background: linear-gradient(90deg, var(--orange), #ff9464); }

/* Login artwork */
.login-shell { color: var(--paper); background: var(--ink); }
.login-brand {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--paper);
  background:
    radial-gradient(circle at 86% 80%, rgba(255,77,0,.09), transparent 23rem),
    var(--ink);
  border-right: 1px solid #3b342d;
}
.login-brand::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 27%;
  height: 13px;
  background: repeating-linear-gradient(135deg, var(--orange) 0 19px, transparent 19px 34px);
  opacity: .95;
}
.login-brand::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, transparent 49.85%, rgba(243,240,232,.08) 50%, transparent 50.15%);
  pointer-events: none;
}
.login-brand .eyebrow { color: var(--orange); }
.login-brand h1 {
  position: relative;
  z-index: 2;
  max-width: 8.2ch;
  margin: .5rem 0 1.2rem;
  color: var(--paper);
  font-size: clamp(4.4rem, 9vw, 8.8rem);
  line-height: .78;
  letter-spacing: -.015em;
  text-transform: uppercase;
  text-wrap: balance;
}
.login-brand h1 span { color: var(--paper); }
.login-brand h1 span::after { content: "."; color: var(--orange); }
.login-brand > p:not(.eyebrow) { position: relative; z-index: 2; max-width: 38rem; color: #d3cdc2; line-height: 1.65; }
.trust-row { position: relative; z-index: 2; }
.trust-row span {
  color: #e4ded3;
  border: 1px solid #625a50;
  border-radius: .18rem;
  background: rgba(255,255,255,.025);
  font-family: var(--tech-font);
  font-size: .62rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.login-card { color: var(--ink); background: var(--surface); box-shadow: -18px 0 55px rgba(0,0,0,.2); }
.login-card .eyebrow { color: var(--orange-2); }
.login-card h2 { font-size: clamp(2.7rem,5vw,4rem); line-height: .9; text-transform: uppercase; }
.product-name, .wordmark { font-family: var(--display-font); font-size: 1.35rem; font-weight: 900; letter-spacing: .025em; text-transform: uppercase; }

.crusher-process-figure {
  position: absolute;
  z-index: 1;
  right: 7%;
  bottom: 14%;
  width: min(34%, 31rem);
  color: #a69e92;
  font-family: var(--tech-font);
  font-size: .62rem;
  letter-spacing: .2em;
  opacity: .82;
}
.process-labels { display: flex; justify-content: space-between; margin: 0 7% .65rem; }
.process-line { display: grid; grid-template-columns: auto auto 5.2rem auto auto; align-items: center; gap: 1.1rem; border-top: 2px dashed #787065; }
.process-line i { width: .72rem; height: .72rem; margin-top: -.43rem; border-radius: 50%; background: var(--orange); }
.process-line b { width: 5.2rem; height: 3.5rem; margin-top: -1.8rem; border: 2px solid #b9b1a5; background: var(--ink); }
.stockpile-mark { display: grid; justify-content: end; margin-top: 2rem; }
.stockpile-mark span { width: 7.2rem; height: 2.5rem; border: 2px solid #aaa296; border-bottom: 0; border-radius: 50% 50% 0 0; }
.stockpile-mark small { margin-top: .5rem; text-align: center; }
.crusher-process-figure p { margin: 2.5rem 0 0; text-align: right; }

/* Main shell */
.app-shell { grid-template-columns: 16rem minmax(0,1fr); }
.sidebar {
  position: relative;
  overflow: hidden;
  color: var(--paper);
  background: var(--ink);
  border-right: 1px solid #3b342d;
  box-shadow: 8px 0 25px rgba(21,18,15,.08);
}
.wordmark { color: var(--paper); margin-bottom: 2rem; }
.sidebar-version { color: #ffb18e; background: rgba(255,77,0,.1); border-color: rgba(255,119,61,.36); }
.sidebar nav { gap: .22rem; }
.nav-item {
  min-height: 2.8rem;
  color: #bdb5aa;
  border: 1px solid transparent;
  border-radius: .22rem;
  font-size: .82rem;
  font-weight: 590;
}
.nav-item:hover { color: var(--paper); border-color: #534b42; background: #211d18; }
.nav-item.active { color: var(--ink); background: var(--orange); border-color: var(--orange); box-shadow: none; }
.nav-glyph { color: var(--orange); background: transparent; border: 1px solid #5b5248; border-radius: .12rem; }
.nav-item.active .nav-glyph { color: var(--ink); background: transparent; border-color: rgba(21,18,15,.35); }
.gate-link { margin-top: .65rem; color: var(--paper); background: #211d18; border-color: #62594f; }
.gate-link .nav-glyph { color: var(--ink); background: var(--orange); border-color: var(--orange); }
.sidebar-foot { color: #aaa297; border-color: #4a433b; border-top: 2px solid var(--orange); }
.sidebar-foot .text-button { color: var(--paper); }
.connection-dot { background: #35c67b; box-shadow: 0 0 0 4px rgba(53,198,123,.14); }

.topbar {
  min-height: 6.4rem;
  color: var(--ink);
  border-bottom: 1px solid var(--ink);
  background: rgba(243,240,232,.96);
  box-shadow: 0 6px 20px rgba(21,18,15,.05);
}
.topbar::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg,var(--orange) 0 38%,transparent 38%);
}
.topbar h1 { color: var(--ink); font-size: clamp(1.65rem,2.5vw,2.25rem); line-height: .9; text-transform: uppercase; }
.access-scope-label, .updated { color: var(--muted); }
.save-mode-label { color: #5f3a28; background: #fff0e8; border-color: #e8b197; }
.top-actions { flex-wrap: wrap; justify-content: flex-end; }

#main-content { max-width: 100rem; margin: 0 auto; }
.experience-bar {
  position: relative;
  display: grid;
  grid-template-columns: minmax(18rem,1.2fr) auto minmax(12rem,.6fr) auto;
  align-items: center;
  gap: 1rem;
  overflow: hidden;
  margin: 0 0 1rem;
  padding: 1.2rem 1rem .9rem;
  color: var(--paper);
  border: 1px solid var(--ink);
  border-radius: .32rem;
  background: var(--ink);
  box-shadow: 6px 6px 0 rgba(21,18,15,.12);
}
.experience-bar::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 7px;
  background: repeating-linear-gradient(135deg,var(--orange) 0 14px,transparent 14px 26px);
}
.experience-state { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.experience-state strong, .experience-state small { display: block; }
.experience-state strong { font-family: var(--display-font); font-size: 1.25rem; letter-spacing: .03em; text-transform: uppercase; }
.experience-state small { margin-top: .1rem; color: #c7c0b5; font-size: .68rem; line-height: 1.45; }
.experience-pulse { width: .62rem; height: .62rem; flex: 0 0 auto; border-radius: 50%; background: #35c67b; box-shadow: 0 0 0 5px rgba(53,198,123,.14); animation: experience-pulse 2.4s ease-out infinite; }
.experience-checks { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
.experience-checks span { padding: .32rem .5rem; color: #d5cec3; border: 1px solid #595147; border-radius: .15rem; font-family: var(--tech-font); font-size: .56rem; letter-spacing: .06em; text-transform: uppercase; }
.experience-action { display: inline-flex; min-height: 2.7rem; align-items: center; justify-content: center; gap: .55rem; padding: .65rem .85rem; color: var(--ink); background: var(--orange); border: 1px solid var(--orange); border-radius: .18rem; text-decoration: none; font-family: var(--tech-font); font-size: .66rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.experience-action:hover { color: var(--ink); background: #ff6727; transform: translateY(-1px); }
.crusher-flow-mini {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto;
  align-items: center;
  gap: .35rem;
  min-width: 13rem;
  color: #9f978b;
  font: 600 .5rem/1 var(--tech-font);
  letter-spacing: .11em;
}
.crusher-flow-mini i { border-top: 1px dashed #766e63; }
.crusher-flow-mini b { padding: .45rem .5rem; color: var(--paper); border: 1px solid #8d8579; font: inherit; }
.crusher-flow-mini small { position: absolute; top: 1.7rem; right: 0; font-size: .48rem; }

/* Cards, data and forms */
.panel, .kpi, .stock-card, .system-card, .readiness-card, .access-summary-card, .security-card {
  position: relative;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: .32rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.panel:hover, .kpi:hover, .stock-card:hover, .system-card:hover, .readiness-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-hover); }
.panel::after, .system-card::after, .stock-card::after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 0;
  height: 3px;
  background: var(--orange);
  transition: width 180ms ease;
}
.panel:hover::after, .system-card:hover::after, .stock-card:hover::after { width: calc(100% + 2px); }
.panel h3, .stock-card h3 { font-weight: 760; }
.kpi { min-height: 8rem; border-top: 3px solid var(--ink); overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
.kpi span { color: var(--muted); font-family: var(--tech-font); font-size: .63rem; letter-spacing: .06em; text-transform: uppercase; line-height: 1.2; }
.kpi strong { color: var(--ink); font-family: var(--display-font), var(--body-font), sans-serif; font-size: clamp(1.25rem, 2.1vw, 1.85rem); font-weight: 700; line-height: 1.2; margin: 0.3rem 0; letter-spacing: -0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.kpi small { font-size: .72rem; line-height: 1.2; margin-top: auto; }
.kpi.accent {
  color: var(--paper);
  border-color: var(--ink);
  border-top-color: var(--orange);
  background: var(--ink);
}
.kpi.accent::after { content: "FIG. 01"; position: absolute; right: .8rem; bottom: .65rem; color: #776f64; font: .5rem var(--tech-font); letter-spacing: .1em; }
.kpi.accent span { color: #c9c1b6; }
.kpi.accent strong { color: var(--paper); }
.kpi.accent small { color: #ff986c; }
.system-strip {
  position: relative;
  overflow: hidden;
  color: var(--paper);
  border: 1px solid var(--ink);
  border-radius: .28rem;
  background: var(--ink);
  box-shadow: 6px 6px 0 rgba(21,18,15,.1);
}
.system-strip::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: repeating-linear-gradient(135deg,var(--orange) 0 14px,transparent 14px 26px); }
.system-strip div { padding-top: .7rem; border-color: #4d453c; }
.system-strip span { color: #a9a196; font-family: var(--tech-font); }
.system-strip strong { color: var(--paper); }

.table-panel { border-radius: .28rem; }
table { background: var(--surface); }
th { color: var(--paper); background: var(--ink); font-family: var(--tech-font); font-size: .6rem; letter-spacing: .1em; }
th, td { border-bottom-color: #e1dbd0; }
tbody tr:hover { background: #fff4ec; }
.alert-row, .conflict-row, .guidance, .architecture-rule { border-left-color: var(--orange); border-radius: 0 .18rem .18rem 0; background: #fff1e9; }
.architecture-panel, .access-add-panel, .report-builder, .setup-readiness-panel { background: linear-gradient(145deg,var(--surface),#f0ebe1); }
.architecture-node, .role-card, .device-profile, .device-diagnostic, .activation-row, .setup-step { border-radius: .25rem; background: var(--surface); }
.architecture-node::before { color: var(--orange-2); }
.setup-progress, .setup-step, .activation-row { border-color: var(--line); }
.setup-progress { color: #8d2d00; border-radius: .22rem; background: #fff4ee; }
.setup-progress-track { background: #ddd5ca; }
.setup-progress-track span { background: var(--orange); }
.setup-step-marker { border-radius: .16rem; background: var(--orange); }
.setup-step.complete .setup-step-marker { background: var(--ink); }
.setup-step-status.complete { color: var(--success); }
.role-level, .role-pill, .current-user, .plant-only-badge { color: #8e2d00; background: #fff0e8; border-color: #efb395; }
.role-areas span { color: #5f574d; background: #eee8de; }
.security-instruction, .account-session.current { color: #6f2b0a; border-color: #e8b79e; background: #fff2eb; }
.recovery-codes-panel { border-color: #e2a686; background: #fff4ee; }
.recovery-codes-panel pre, #activation-package { color: var(--paper); background: var(--ink); font-family: var(--tech-font); }
.toast { color: var(--paper); border-radius: .2rem; background: var(--ink) !important; box-shadow: 6px 6px 0 rgba(255,77,0,.28); }
.toast::before { color: var(--orange); }

.status.SENT, .status.COMPLETED, .status.ONLINE, .status.PASS, .status.PASSED, .status.ACTIVATED, .status.VERIFIED { color: #0e633b; background: #e2f2e8; }
.status.PROCESSING, .status.LOADING, .status.AWAITING_DEVICE { color: #5e3b00; background: #fff0cd; }
.status.PENDING, .status.ARRIVED, .status.FIRST_WEIGHT_CAPTURED, .status.SECOND_WEIGHT_CAPTURED, .status.APPROVED, .status.TESTING, .status.IN_PROGRESS { color: #8d2d00; background: #ffe8dc; }
.status.FAILED, .status.ERROR, .status.BLOCKED, .status.CANCELLED, .status.REVOKED, .status.EXPIRED { color: #7f1f18; background: #f7dfdc; }
.mobile-nav { background: rgba(243,240,232,.98); border-top: 2px solid var(--ink); }
.mobile-nav button.active { color: var(--ink); background: #ffd9c7; box-shadow: inset 0 3px 0 var(--orange); }

/* v0.12 balanced Owner workspace */
#main-content { width: 100%; padding: clamp(1.15rem, 2.6vw, 2.65rem); }
.view-section { width: 100%; }
.section-heading {
  min-height: 6.5rem;
  align-items: flex-end;
  padding: .2rem 0 1.2rem;
  border-bottom: 1px solid var(--line);
}
.section-heading > div { min-width: 0; }
.section-copy { margin: .6rem 0 0; line-height: 1.55; }
.panel { padding: clamp(1rem, 1.7vw, 1.35rem); }
.panel-head { align-items: flex-start; margin-bottom: 1.15rem; }
.panel-head h3 { margin-top: .15rem; font-size: 1.05rem; line-height: 1.25; }
.panel-head .muted { max-width: 48rem; margin: .4rem 0 0; line-height: 1.5; }
.kpi-grid, .content-grid, .stock-grid, .system-cards, .mini-kpis { gap: .9rem; }

.inventory-principle {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(16rem, 1fr) minmax(13rem, .55fr);
  align-items: center;
  gap: 1.1rem;
  overflow: hidden;
  margin: 0 0 .9rem;
  padding: 1rem 1.15rem 1rem 1.35rem;
  color: var(--paper);
  border: 1px solid var(--ink);
  border-radius: .28rem;
  background: var(--ink);
  box-shadow: 5px 5px 0 rgba(21,18,15,.1);
}
.inventory-principle::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 7px;
  background: repeating-linear-gradient(135deg,var(--orange) 0 10px,transparent 10px 18px);
}
.inventory-principle > span {
  color: var(--orange);
  font: 800 .6rem/1 var(--tech-font);
  letter-spacing: .13em;
}
.inventory-principle > strong {
  color: var(--paper);
  font-family: var(--display-font);
  font-size: clamp(1.15rem,2vw,1.65rem);
  line-height: 1.05;
  letter-spacing: .015em;
  text-transform: uppercase;
}
.inventory-principle > small { color: #bfb7ac; line-height: 1.45; }
.stock-grid { margin-bottom: .9rem; }
.stock-card { min-height: 9.2rem; display: flex; flex-direction: column; justify-content: space-between; }
.stock-card .eyebrow { margin-bottom: .45rem; }
.stock-card strong { line-height: .9; }

.inventory-control-grid {
  display: grid;
  grid-template-columns: minmax(30rem,1.35fr) minmax(19rem,.65fr);
  gap: .9rem;
  align-items: start;
}
.inventory-side-stack { display: grid; gap: .9rem; }
.product-master-panel { min-width: 0; }
.material-list { display: grid; gap: .65rem; }
.material-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .85rem 1.25rem;
  min-width: 0;
  padding: .9rem 1.15rem;
  border: 1px solid #ded7cc;
  border-left: 4px solid var(--ink);
  border-radius: .28rem;
  background: #fffefa;
  box-shadow: 0 1px 3px rgba(20, 16, 10, .04);
  transition: border-color 160ms ease, border-left-color 160ms ease, background 160ms ease, transform 130ms ease, box-shadow 160ms ease;
}
.material-row:hover {
  border-color: var(--line-strong);
  border-left-color: var(--orange);
  background: #fff8f3;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 77, 0, .06);
}
.material-row.archived {
  opacity: .78;
  background: #fbf9f6;
  border-left-color: #9c9183;
}
.material-identity {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 13rem;
  flex: 1 1 14rem;
}
.material-identity strong {
  display: block;
  font-size: clamp(.9rem, 1.3vw, 1.02rem);
  font-weight: 750;
  color: var(--ink);
  letter-spacing: -.01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.material-identity small {
  display: block;
  color: var(--muted);
  font-size: clamp(.72rem, 1vw, .8rem);
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: break-word;
}
.material-code {
  display: inline-flex;
  align-items: center;
  width: max-content;
  margin-bottom: .2rem;
  padding: .22rem .45rem;
  color: var(--paper);
  background: var(--ink);
  font: 750 clamp(.58rem, .9vw, .65rem)/1 var(--tech-font);
  letter-spacing: .08em;
  border-radius: .15rem;
}
.material-values {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .65rem;
  min-width: 0;
  flex: 1.5 1 16rem;
}
.material-values span {
  display: inline-flex;
  align-items: center;
  min-height: 2.15rem;
  padding: .35rem .7rem;
  color: #38322b;
  background: #fbf9f5;
  border: 1px solid var(--line, #e2dbcf);
  border-left: 3px solid var(--orange);
  border-radius: .2rem;
  font: 650 clamp(.74rem, .9vw, .8rem)/1.35 var(--tech-font);
  white-space: nowrap;
  letter-spacing: .01em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .02);
  word-break: normal;
  overflow-wrap: normal;
}
.material-values span.muted {
  color: var(--muted);
  background: #f4efe7;
  border-color: #ddd5c9;
  border-left-color: #9c9183;
}
.material-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .45rem;
  flex: 0 0 auto;
  margin-left: auto;
  flex-wrap: nowrap;
}
.material-actions button,
.material-actions .text-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  padding: .35rem .75rem;
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 650;
  border-radius: .22rem;
  cursor: pointer;
  transition: all 140ms ease;
}
.material-actions .text-button.danger {
  color: #c5221f;
  background: transparent;
  border: 1px solid rgba(197, 34, 31, .25);
}
.material-actions .text-button.danger:hover {
  background: #fdf2f0;
  border-color: #c5221f;
  color: #a51816;
}

.compact-form { display: grid; gap: .85rem; }
.compact-form label, .material-form-grid label { display: grid; gap: .4rem; font-size: .77rem; font-weight: 750; }
.split-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem; }
.stock-count-panel, .reconciliation-panel { overflow: hidden; }
.stock-count-panel::before, .reconciliation-panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--orange);
}
.reconciliation-summary { display: grid; gap: .45rem; min-height: 5.6rem; padding: .85rem; border: 1px dashed var(--line-strong); background: #f8f4ec; }
.reconciliation-summary strong, .reconciliation-summary small { display: block; }
.reconciliation-summary small { color: var(--muted); }
.assurance-issue { margin: .2rem 0 0; padding: .45rem .55rem; color: #77251d; border-left: 3px solid var(--red); background: #f9e6e2; font-size: .72rem; }

.settings-form {
  grid-template-columns: repeat(12,minmax(0,1fr));
  gap: .9rem;
  margin-bottom: .9rem;
}
.settings-form fieldset {
  grid-column: span 4;
  min-width: 0;
  padding: 1rem;
  border-color: var(--line);
  border-radius: .25rem;
  background: linear-gradient(145deg,#fffefa,#f7f2e8);
}
.settings-form fieldset:nth-of-type(1),
.settings-form fieldset:nth-of-type(2) { grid-column: 1/-1; }
.settings-form legend { color: var(--ink); font-family: var(--display-font); font-size: 1.1rem; letter-spacing: .025em; text-transform: uppercase; }
.fieldset-copy { max-width: 60rem; margin: 0 0 .2rem; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.settings-field-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.settings-form > label, .settings-form > .form-actions { grid-column: 1/-1; }
.settings-form > label { padding: .9rem; border: 1px solid var(--line); background: #fffefa; }
.settings-form .form-actions { padding-top: .15rem; }

.audit-panel { overflow: hidden; }
.audit-panel::before {
  content: "AUDIT / CHANGE CONTROL";
  position: absolute;
  top: 0;
  right: 0;
  padding: .32rem .55rem;
  color: var(--paper);
  background: var(--ink);
  font: 700 .5rem/1 var(--tech-font);
  letter-spacing: .1em;
}
.audit-panel-head { padding-right: 8.5rem; }
.audit-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .85rem; padding: .75rem; border: 1px solid var(--line); background: #f5f0e7; }
.audit-toolbar label { display: grid; grid-template-columns: auto minmax(13rem,22rem); align-items: center; gap: .6rem; color: var(--muted); font-size: .74rem; font-weight: 750; }
.audit-event-list { display: grid; gap: .55rem; }
.audit-event { overflow: hidden; border: 1px solid var(--line); border-left: 4px solid var(--ink); border-radius: .2rem; background: #fffefa; }
.audit-event[open] { border-left-color: var(--orange); }
.audit-event summary { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 1rem; padding: .8rem .9rem; cursor: pointer; list-style-position: inside; }
.audit-event summary:hover { background: #fff5ef; }
.audit-event-headline { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.audit-event-headline strong { font-size: .82rem; }
.audit-event-headline span { color: #8e2d00; font: 700 .55rem var(--tech-font); letter-spacing: .08em; text-transform: uppercase; }
.audit-event-meta { display: flex; align-items: center; justify-content: flex-end; gap: .7rem; color: var(--muted); font-size: .68rem; }
.audit-event-body { padding: 0 .9rem .9rem; border-top: 1px solid #e5ded3; }
.audit-reason { margin: .75rem 0; padding: .6rem .7rem; border-left: 3px solid var(--orange); background: #fff1e9; font-size: .76rem; }
.audit-values { overflow: auto; border: 1px solid #ddd5c9; }
.audit-value-row { display: grid; grid-template-columns: minmax(9rem,.7fr) repeat(2,minmax(13rem,1fr)); min-width: 40rem; }
.audit-value-row > * { min-width: 0; padding: .55rem .65rem; border-right: 1px solid #e3dcd1; border-bottom: 1px solid #e3dcd1; overflow-wrap: anywhere; }
.audit-value-row > *:last-child { border-right: 0; }
.audit-value-row:last-child > * { border-bottom: 0; }
.audit-value-row code { color: #4d463e; background: #fffefa; font: .65rem/1.45 var(--tech-font); white-space: pre-wrap; }
.audit-value-head { color: var(--paper); background: var(--ink); font: .56rem var(--tech-font); letter-spacing: .08em; text-transform: uppercase; }

.material-dialog { width: min(46rem,calc(100% - 2rem)); max-width: 46rem; border: 1px solid var(--ink); border-radius: .28rem; }
.material-dialog form { position: relative; padding-top: 1.75rem; }
.material-dialog form::before { content: ""; position: absolute; inset: 0 0 auto; height: 7px; background: repeating-linear-gradient(135deg,var(--orange) 0 14px,var(--ink) 14px 27px); }
.material-dialog form > label { display: grid; gap: .4rem; font-size: .77rem; font-weight: 750; margin-top: .85rem; }
.material-dialog .check-line { display: flex !important; align-items: center; gap: .6rem !important; font-size: .82rem !important; font-weight: 600 !important; margin: 1rem 0 !important; cursor: pointer; }
.material-dialog .checkbox-row { margin: 1rem 0; }
.material-dialog .dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: .65rem; flex-wrap: wrap; margin-top: 1.25rem; }
.material-dialog .dialog-actions button { min-width: 6.5rem; min-height: 2.45rem; padding: .45rem .95rem; font-size: .82rem; font-weight: 650; white-space: nowrap; }
.material-dialog .dialog-actions .text-button.danger { color: #c5221f; background: transparent; border: 1px solid rgba(197, 34, 31, .25); border-radius: .25rem; padding: .45rem .85rem; }
.material-dialog .dialog-actions .text-button.danger:hover { background: #fdf2f0; border-color: #c5221f; color: #a51816; }
.dialog-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.dialog-close { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; min-height: 0; padding: 0; color: var(--ink); border: 1px solid var(--line-strong); border-radius: 50%; background: transparent; font-size: 1.35rem; line-height: 1; cursor: pointer; transition: all 0.15s ease; }
.dialog-close:hover { color: #ffffff; background: var(--ink); border-color: var(--ink); }
.material-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; margin: 1rem 0; }

.panel-head-actions { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; }

.action-quick-reasons { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin: 0.65rem 0 0.85rem; }
.quick-reasons-label { font-size: 0.72rem; font-weight: 600; color: var(--muted); margin-right: 0.2rem; }
.quick-chip { display: inline-flex; align-items: center; padding: 0.25rem 0.6rem; font-size: 0.72rem; font-weight: 550; background: var(--surface-2, #f5f1eb); color: var(--ink); border: 1px solid var(--line-strong, #ddd5c9); border-radius: 9999px; cursor: pointer; transition: all 0.15s ease; }
.quick-chip:hover { background: var(--ink); color: #ffffff; border-color: var(--ink); }
.quick-chip:active { transform: scale(0.96); }
#dialog-confirm.danger-button, #dialog-confirm.danger { background: #c5221f !important; border-color: #a51816 !important; color: #ffffff !important; }
#dialog-confirm.danger-button:hover, #dialog-confirm.danger:hover { background: #a51816 !important; }

/* v0.13 plant-entry workspace */
.operations-principle { position: relative; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .2rem 1rem; margin-bottom: 1rem; padding: .9rem 1rem; color: var(--paper); background: var(--ink); border-left: 7px solid var(--orange); overflow: hidden; }
.operations-principle::after { content: ""; position: absolute; inset: auto 0 0; height: 5px; background: repeating-linear-gradient(135deg,var(--orange) 0 16px,transparent 16px 31px); }
.operations-principle span,.operations-principle small { color: #b9b0a4; font: .61rem var(--tech-font); letter-spacing: .09em; text-transform: uppercase; }
.operations-principle small { grid-column: 2; }
.operations-principle strong { font-size: .92rem; letter-spacing: .01em; }
.operations-summary { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: .65rem; margin-bottom: 1rem; }
.operation-summary-card { min-width: 0; padding: .85rem .9rem; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 5px 15px rgba(21,18,15,.04); }
.operation-summary-card span,.operation-summary-card small { display: block; color: var(--muted); }
.operation-summary-card span { min-height: 2em; font: .6rem var(--tech-font); letter-spacing: .07em; text-transform: uppercase; }
.operation-summary-card strong { display: block; margin: .35rem 0 .25rem; font-size: clamp(1rem,1.25vw,1.35rem); font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.operation-summary-card small { font-size: .7rem; }
.operations-layout { display: grid; grid-template-columns: minmax(29rem,1.12fr) minmax(24rem,.88fr); align-items: start; gap: 1rem; }
.operation-entry-panel,.operations-ledger-panel { min-width: 0; }
.operations-layout > .todays-attendance-panel,
.operations-layout > .supplier-master-panel,
.operations-layout > .lender-master-panel,
.operations-layout > .customer-master-panel,
.operations-layout > .vehicle-master-panel {
  grid-column: 1 / -1;
  min-width: 0;
}
.operation-tabs,.operation-ledger-filters { display: flex; flex-wrap: wrap; gap: .4rem; }
.operation-tabs { margin: .9rem 0 1rem; padding: .35rem; background: var(--surface-2); border: 1px solid var(--line); }
.operation-tabs button,.operation-ledger-filters button { min-height: 2.25rem; padding: .55rem .72rem; color: var(--ink); background: transparent; border: 1px solid transparent; border-radius: .15rem; font: 650 .7rem var(--body-font); }
.operation-tabs button:hover,.operation-ledger-filters button:hover { border-color: var(--line-strong); }
.operation-tabs button.active { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.operation-kind.kind-utility { color:#7b2b06; border-color:#ff9d72; background:#fff0e8; }
.operation-ledger-filters { margin: .75rem 0; }
.operation-ledger-filters button { min-height: 2rem; padding: .4rem .65rem; font: .59rem var(--tech-font); letter-spacing: .05em; text-transform: uppercase; }
.operation-ledger-filters button.active { color: var(--orange); border-color: var(--orange); background: rgba(255,77,0,.06); }
.operation-form { animation: operation-enter .22s ease both; }
.operation-explainer { display: grid; gap: .2rem; margin-bottom: .85rem; padding: .72rem .8rem; background: #f8f4eb; border-left: 3px solid var(--orange); }
.operation-explainer strong { font-size: .86rem; }
.operation-explainer span { color: var(--muted); font-size: .73rem; line-height: 1.45; }
.operation-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
.operation-form > label { margin-top: .75rem; }
.operation-form > button { width: 100%; margin-top: .9rem; }
.entry-preview { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .15rem .75rem; margin-top: .8rem; padding: .65rem .75rem; border: 1px solid var(--line); background: var(--surface-2); }
.entry-preview span { color: var(--muted); font: .58rem var(--tech-font); letter-spacing: .06em; text-transform: uppercase; }
.entry-preview strong { font-size: 1.05rem; }
.entry-preview small { grid-column: 1/-1; color: var(--muted); }
.entry-preview.warning { color: var(--red); border-color: var(--red); background: rgba(168,40,29,.05); }
.production-output-fieldset { min-width: 0; margin: .85rem 0 0; padding: .8rem; border: 1px solid var(--line); background: var(--surface-2); }
.production-output-fieldset legend { padding: 0 .35rem; color: var(--ink); font: 700 .7rem var(--body-font); }
.production-output-fieldset > p { margin: 0 0 .65rem; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.production-output-lines { display: grid; gap: .55rem; }
.production-output-row { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr) auto; align-items: end; gap: .55rem; padding: .6rem; border: 1px solid var(--line); background: var(--surface); animation: operation-enter .2s ease both; }
.production-output-row .production-output-remove { min-height: 2.55rem; padding-inline: .55rem; }
.production-add-output { width: 100%; margin-top: .6rem; border-style: dashed; }
.production-mass-preview { grid-template-columns: 1fr auto; }
.production-mass-values { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .45rem; margin-top: .45rem; }
.production-mass-values small { display: grid; grid-column: auto; gap: .1rem; padding: .5rem; background: var(--surface); border: 1px solid var(--line); }
.production-mass-values b { color: var(--ink); font: 700 .85rem var(--body-font); }
#production-balance-note { margin-top: .25rem; }
.permission-note { margin-top: 1rem; padding: .8rem; color: var(--muted); background: var(--surface-2); border: 1px dashed var(--line-strong); font-size: .75rem; }
.operations-ledger { display: grid; gap: .5rem; max-height: 52rem; overflow: auto; padding-right: .15rem; }
.operation-ledger-row { display: grid; grid-template-columns: 2.3rem minmax(0,1fr) auto auto; align-items: center; gap: .7rem; padding: .7rem; background: var(--surface); border: 1px solid var(--line); transition: border-color .18s ease,transform .18s ease; }
.operation-ledger-row:hover { border-color: var(--line-strong); transform: translateX(2px); }
.operation-ledger-row.reversed { opacity: .68; background: var(--surface-2); }
.operation-kind { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; color: var(--ink); border: 1px solid var(--ink); font: 700 .58rem var(--tech-font); }
.kind-production { color: var(--paper); background: var(--ink); }
.kind-purchase { color: var(--paper); background: var(--orange); border-color: var(--orange); }
.kind-receipt { color: var(--success); border-color: var(--success); }
.kind-payment,.kind-expense { color: var(--red); border-color: var(--red); }
.operation-ledger-copy { min-width: 0; }
.operation-ledger-copy strong,.operation-ledger-copy small,.operation-ledger-copy p { display: block; overflow: hidden; text-overflow: ellipsis; }
.operation-ledger-copy strong { font-size: .8rem; white-space: nowrap; }
.operation-ledger-copy small { margin-top: .15rem; color: var(--muted); font: .57rem var(--tech-font); }
.operation-ledger-copy p { margin: .2rem 0 0; color: var(--muted); font-size: .68rem; line-height: 1.35; }
.operation-ledger-value { display: grid; justify-items: end; gap: .25rem; }
.operation-ledger-value strong { font-size: .8rem; white-space: nowrap; }
.operation-ledger-action { min-width: 5rem; text-align: right; }
.operation-ledger-action button { font-size: .65rem; }
@keyframes operation-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

@keyframes experience-pulse { 0% { box-shadow: 0 0 0 0 rgba(53,198,123,.35); } 70%,100% { box-shadow: 0 0 0 9px rgba(53,198,123,0); } }
@keyframes data-pulse { 0%,100% { background-color: transparent; } 40% { background-color: rgba(255,77,0,.12); } }
@keyframes connection-pulse { 0% { box-shadow: 0 0 0 0 rgba(53,198,123,.3); } 70%,100% { box-shadow: 0 0 0 8px rgba(53,198,123,0); } }

@media (max-width: 1260px) {
  .crusher-process-figure { display: none; }
  .experience-bar { grid-template-columns: minmax(17rem,1fr) auto auto; }
  .crusher-flow-mini { display: none; }
}
@media (max-width: 1120px) {
  .experience-bar { grid-template-columns: minmax(17rem,1fr) auto; }
  .experience-checks { display: none; }
  .inventory-control-grid { grid-template-columns: 1fr; }
  .inventory-side-stack { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .settings-field-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .operations-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .operations-layout { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  /* Avoid stale composited entrance layers on mobile WebKit while preserving
     button feedback and live-status motion. */
  .view-section.active > * { animation: none !important; transform: none !important; }
  .topbar { color: var(--ink); background: rgba(243,240,232,.98); }
  .experience-bar { grid-template-columns: 1fr auto; }
  .login-brand::before { top: 7px; }
  .login-shell {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }
  .login-brand,
  .login-card,
  .login-card form,
  .login-card label { width: 100%; min-width: 0; max-width: 100%; }
  .login-brand > * { min-width: 0; max-width: 100%; }
  .login-brand > p:not(.eyebrow) { width: 100%; overflow-wrap: anywhere; }
  .trust-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  .trust-row span { min-width: 0; text-align: center; white-space: normal; }
  .login-brand h1 { font-size: clamp(3.8rem,17vw,6rem); }
  .section-heading { min-height: 0; }
  .inventory-principle { grid-template-columns: auto 1fr; }
  .inventory-principle small { grid-column: 2; }
  .inventory-side-stack { grid-template-columns: 1fr; }
  .settings-form { grid-template-columns: 1fr; }
  .settings-form fieldset,
  .settings-form fieldset:nth-of-type(1),
  .settings-form fieldset:nth-of-type(2),
  .settings-form > label,
  .settings-form > .form-actions { grid-column: 1/-1; }
  .settings-field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .audit-panel-head { padding-right: 0; }
  .audit-panel::before { display: none; }
  .operations-principle { grid-template-columns: auto 1fr; }
  .operations-principle small { grid-column: 2; }
}
@media (max-width: 560px) {
  .login-brand {
    padding: 2rem 1.25rem 2.25rem;
  }
  .login-brand h1 {
    font-size: clamp(3.2rem, 16vw, 4.2rem);
    overflow-wrap: normal;
  }
  .login-brand > p:not(.eyebrow) {
    width: 100%;
    font-size: .94rem;
    overflow-wrap: anywhere;
  }
  .trust-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: .5rem;
  }
  .trust-row span {
    min-width: 0;
    padding: .5rem .45rem;
    text-align: center;
    white-space: normal;
  }
  .trust-row span:last-child { grid-column: 1 / -1; }
  .experience-bar { grid-template-columns: 1fr; padding-top: 1.25rem; }
  .experience-action { width: 100%; }
  .section-heading h2 { font-size: 2.7rem; }
  .topbar h1 { font-size: 1.75rem; }
  .panel::after, .system-card::after, .stock-card::after { display: none; }
  .section-heading { align-items: stretch; flex-direction: column; }
  .section-heading > button { width: 100%; }
  .inventory-principle { grid-template-columns: 1fr; gap: .5rem; }
  .inventory-principle small { grid-column: 1; }
  .material-row { flex-direction: column; align-items: stretch; gap: .75rem; }
  .material-values { width: 100%; }
  .material-actions { justify-content: flex-start; margin-left: 0; width: 100%; }
  .split-fields, .settings-field-grid, .material-form-grid { grid-template-columns: 1fr; }
  .operations-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .operations-principle { grid-template-columns: 1fr; gap: .45rem; }
  .operations-principle small { grid-column: 1; }
  .operation-form-grid { grid-template-columns: 1fr; }
  .production-output-row { grid-template-columns: 1fr; align-items: stretch; }
  .production-output-row .production-output-remove { width: 100%; }
  .production-mass-values { grid-template-columns: 1fr; }
  .operation-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .operation-tabs button:last-child { grid-column: 1/-1; }
  .operation-ledger-row { grid-template-columns: 2.3rem minmax(0,1fr) auto; align-items: start; }
  .operation-ledger-value { justify-items: end; }
  .operation-ledger-action { grid-column: 2/-1; text-align: left; }
  .audit-toolbar, .audit-event summary, .audit-event-meta { align-items: stretch; flex-direction: column; }
  .audit-toolbar { display: grid; }
  .audit-toolbar label { grid-template-columns: 1fr; }
  .audit-event summary { display: grid; grid-template-columns: 1fr; }
  .audit-event-meta { display: flex; justify-content: flex-start; gap: .25rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .experience-pulse { animation: none; }
}

/* v0.15.1 calm professional experience.
   Industrial character remains in the structure and orange signal accents;
   operational content now uses lower-contrast surfaces for long shifts. */
:root {
  --ink: #09090b;
  --ink-2: #18181b;
  --muted: #71717a;
  --paper: #f4f4f6;
  --surface: #ffffff;
  --surface-2: #f4f4f5;
  --line: #e4e4e7;
  --line-strong: #a1a1aa;
  --green: #09090b;
  --green-2: #18181b;
  --lime: #ff5500;
  --orange: #ff5500;
  --orange-2: #e64d00;
  --blue: #09090b;
  --focus: #ff5500;
  --amber: #d97706;
  --red: #dc2626;
  --success: #16a34a;
  --shadow: 0 8px 24px rgba(9, 9, 11, 0.05);
  --shadow-hover: 0 14px 32px rgba(9, 9, 11, 0.1);
}

body {
  background: var(--paper);
  background-size: auto;
}

.topbar h1,
.section-heading h2,
.login-brand h1,
.login-card h2,
.kpi strong,
.stock-card strong,
.system-card .metric,
.readiness-card strong,
dialog h2 {
  font-family: var(--body-font);
  font-stretch: normal;
  font-weight: 720;
  letter-spacing: -.035em;
  text-transform: none;
}

.section-heading h2 {
  max-width: 18ch;
  font-size: clamp(2rem, 3.1vw, 3rem);
  line-height: 1.04;
}

.eyebrow {
  color: var(--orange-2);
  font-family: var(--body-font);
  font-size: .68rem;
  font-weight: 720;
  letter-spacing: .08em;
}

.primary {
  color: #ffffff;
  border: 1px solid var(--orange);
  border-radius: .55rem;
  background: var(--orange);
  box-shadow: 0 6px 16px rgba(255, 85, 0, 0.25);
  font-weight: 700;
}
.primary:hover:not(:disabled) {
  color: #ffffff;
  border-color: var(--orange-2);
  background: var(--orange-2);
  box-shadow: 0 8px 20px rgba(255, 85, 0, 0.35);
  transform: translateY(-1px);
}
.secondary {
  color: var(--ink);
  border: 1px solid var(--ink-2);
  border-radius: .55rem;
  background: #ffffff;
}
.secondary:hover:not(:disabled) { color: var(--ink); border-color: var(--ink); background: var(--surface-2); }
.text-button { color: var(--orange); border-radius: .5rem; font-weight: 600; }
.text-button:hover:not(:disabled) { color: var(--orange-2); background: rgba(255, 85, 0, 0.08); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline-color: var(--orange);
}
input, select, textarea, .login-card input {
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: #ffffff;
  color: var(--ink);
}
input:focus, select:focus, textarea:focus, .login-card input:focus {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgba(255, 85, 0, 0.2);
}

.login-brand {
  color: #ffffff;
  border-color: #27272a;
  background:
    radial-gradient(circle at 86% 78%, rgba(255, 85, 0, 0.12), transparent 24rem),
    linear-gradient(145deg, #09090b, #18181b);
}
.login-brand::before {
  top: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--orange) 0 32%, rgba(255, 255, 255, 0.1) 32%);
}
.login-brand::after { opacity: .18; }
.login-brand h1 {
  max-width: 11ch;
  color: #ffffff;
  font-size: clamp(3.7rem, 7.2vw, 7rem);
  line-height: .9;
  text-transform: none;
}
.login-brand h1 span { color: #ffffff; }
.login-brand h1 span::after { content: "."; color: var(--orange); }
.login-brand > p:not(.eyebrow) { color: #a1a1aa; }
.trust-row span {
  color: #e4e4e7;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: .45rem;
  background: rgba(255, 255, 255, 0.04);
  font-family: var(--body-font);
  letter-spacing: .03em;
  text-transform: none;
}
.login-card { background: #ffffff; box-shadow: -12px 0 36px rgba(9, 9, 11, 0.15); }
.login-card h2 { font-size: clamp(2.3rem,4vw,3.4rem); line-height: 1.02; }
.product-name, .wordmark { font-family: var(--body-font); font-weight: 740; letter-spacing: -.02em; text-transform: none; }
.crusher-process-figure { opacity: .42; }

.sidebar {
  color: #ffffff;
  border-color: #27272a;
  background: linear-gradient(180deg, #09090b, #121215);
  box-shadow: 6px 0 22px rgba(9, 9, 11, 0.08);
}
.sidebar::after { height: 3px; background: linear-gradient(90deg,var(--orange) 0 34%,rgba(255,255,255,.08) 34%); }
.wordmark { color: #ffffff; }
.nav-item {
  min-height: 2.9rem;
  color: #a1a1aa;
  border-radius: .55rem;
  font-size: .8rem;
  font-weight: 560;
}
.nav-item:hover { color: #ffffff; border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.055); }
.nav-item.active {
  color: #ffffff;
  border-color: rgba(255,255,255,.08);
  background: #18181b;
  box-shadow: inset 3px 0 0 var(--orange);
}
.nav-glyph { color: var(--orange); border-color: rgba(255,85,0,.25); border-radius: .35rem; }
.nav-item.active .nav-glyph { color: #ffffff; border-color: var(--orange); background: var(--orange); }
.gate-link { color: #ffffff; border-color: var(--orange); background: rgba(255,85,0,.12); }
.gate-link .nav-glyph { color: #ffffff; background: var(--orange); border-color: var(--orange); }
.sidebar-foot { color: #a1a1aa; border-color: rgba(255,255,255,.12); }

.topbar {
  min-height: 6.1rem;
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.96);
  box-shadow: 0 4px 18px rgba(9,9,11,.04);
}
.topbar::after { height: 2px; background: linear-gradient(90deg,var(--orange) 0 12%,transparent 12%); }
.topbar h1 { font-size: clamp(1.5rem,2.2vw,2rem); line-height: 1.05; }
.save-mode-label { color: var(--ink-2); border-color: var(--line); background: var(--surface-2); }

.experience-bar {
  color: var(--ink);
  border: 1px solid var(--line);
  border-left: 4px solid var(--orange);
  border-radius: .8rem;
  background: #ffffff;
  box-shadow: var(--shadow);
}
.experience-bar::before { height: 3px; background: linear-gradient(90deg,var(--orange) 0 20%,transparent 20%); }
.experience-state strong { color: var(--ink); font-family: var(--body-font); font-size: 1rem; font-weight: 700; letter-spacing: -.01em; text-transform: none; }
.experience-state small { color: var(--muted); font-size: .72rem; }
.experience-checks span { color: var(--ink-2); border: 1px solid var(--line); border-radius: .4rem; background: var(--surface-2); font-family: var(--body-font); letter-spacing: 0; text-transform: none; }
.experience-action { color: #ffffff; border: 1px solid var(--orange); border-radius: .55rem; background: var(--orange); font-family: var(--body-font); letter-spacing: .01em; text-transform: none; font-weight: 700; }
.experience-action:hover { color: #ffffff; background: var(--orange-2); }
.crusher-flow-mini { color: var(--muted); }
.crusher-flow-mini b { color: var(--ink); border-color: var(--line-strong); }

.panel, .kpi, .stock-card, .system-card, .readiness-card, .access-summary-card, .security-card {
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: #ffffff;
  box-shadow: var(--shadow);
}
.panel:hover, .kpi:hover, .stock-card:hover, .system-card:hover, .readiness-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-hover); }
.panel::after, .system-card::after, .stock-card::after { display: none; }
.panel h3, .stock-card h3 { font-weight: 680; letter-spacing: -.015em; }
.kpi { min-height: 7.5rem; border-top: 1px solid var(--line); overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
.kpi strong { font-size: clamp(1.25rem,2.1vw,1.85rem); line-height: 1.2; margin: 0.3rem 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.kpi.accent {
  color: #ffffff;
  border: 1px solid #18181b;
  border-top: 3px solid var(--orange);
  background: #09090b;
}
.kpi.accent span, .kpi.accent strong { color: #ffffff; }
.kpi.accent small { color: var(--orange); }
.kpi.accent::after { color: var(--muted); }
.system-strip {
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: var(--surface-2);
  box-shadow: none;
}
.system-strip::before { height: 3px; background: linear-gradient(90deg,var(--orange) 0 16%,transparent 16%); }
.system-strip div { border-color: var(--line); }
.system-strip span { color: var(--muted); font-family: var(--body-font); }
.system-strip strong { color: var(--ink); }

th { color: #ffffff; background: #09090b; font-family: var(--body-font); font-size: .7rem; letter-spacing: .02em; text-transform: uppercase; }
th, td { border-bottom-color: var(--line); }
tbody tr:hover { background: #fff7f4; }
.alert-row, .conflict-row, .guidance, .architecture-rule { border-left-color: var(--orange); background: #fff7f4; }
.architecture-panel, .access-add-panel, .report-builder, .setup-readiness-panel { background: #ffffff; }
.architecture-node, .role-card, .device-profile, .device-diagnostic, .activation-row, .setup-step { border-radius: .65rem; }
.role-level, .role-pill, .current-user, .plant-only-badge { color: var(--orange-2); background: #fff0eb; border-color: #ffd0c0; }
.role-areas span { color: var(--ink-2); background: var(--surface-2); }
.toast { border-radius: .65rem; background: var(--ink) !important; box-shadow: 0 12px 30px rgba(9,9,11,.25); }

.inventory-principle, .operations-principle {
  color: #09090b;
  border: 1px solid rgba(255, 85, 0, 0.25);
  border-left: 5px solid #ff5500;
  border-radius: .7rem;
  background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
  box-shadow: 0 4px 12px rgba(9,9,11,.04);
}
.inventory-principle::after, .operations-principle::after { display: none; }
.inventory-principle > strong, .operations-principle > strong { color: #09090b !important; font-weight: 700; font-size: clamp(1rem,1.5vw,1.3rem); line-height: 1.2; }
.inventory-principle > span, .operations-principle > span { color: #ff5500 !important; font-weight: 800; font-size: .65rem; letter-spacing: .08em; background: rgba(255, 85, 0, 0.1); padding: .25rem .55rem; border-radius: .35rem; }
.inventory-principle .op { color: #ff5500; font-weight: 900; margin: 0 .2rem; }
.inventory-principle > small, .operations-principle > small { color: #52525b !important; font-weight: 500; }

.bin-filter-toggle {
  display: inline-flex;
  gap: .35rem;
  background: var(--surface-2, #f4f4f5);
  padding: .25rem;
  border-radius: .5rem;
  border: 1px solid var(--line, #e4e4e7);
}
.bin-filter-toggle .tab-pill {
  font-family: var(--body-font);
  font-size: .75rem;
  font-weight: 600;
  padding: .3rem .7rem;
  border-radius: .35rem;
  border: none;
  background: transparent;
  color: var(--muted, #71717a);
  cursor: pointer;
  transition: all .15s ease;
}
.bin-filter-toggle .tab-pill.active {
  background: #09090b;
  color: #ffffff;
  box-shadow: 0 2px 6px rgba(9,9,11,.15);
}
.bin-filter-toggle .tab-pill span { font-weight: 700; }

.toast-undo-btn {
  margin-left: 1rem;
  padding: .2rem .6rem;
  background: #ff5500;
  color: #ffffff;
  border: none;
  border-radius: .3rem;
  font-size: .75rem;
  font-weight: 700;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.toast-undo-btn:hover { background: #e04b00; }
.settings-form fieldset { border-radius: .7rem; background: #ffffff; border: 1px solid var(--line); }
.settings-form legend { font-family: var(--body-font); font-weight: 700; letter-spacing: -.01em; text-transform: none; }
.audit-panel::before { color: #fff; background: var(--ink); }
.audit-toolbar { border-radius: .6rem; background: var(--surface-2); }
.operation-tabs { border-radius: .65rem; background: var(--surface-2); }
.operation-tabs button, .operation-ledger-filters button { border-radius: .45rem; }
.operation-tabs button.active { color: #fff; background: var(--ink); }
.operation-ledger-filters button.active { color: var(--orange); border-color: var(--orange); background: #fff7f4; }

.current-access-card {
  display: grid;
  grid-template-columns: minmax(16rem,1fr) minmax(18rem,1.1fr);
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  color: var(--ink);
  border: 1px solid var(--line);
  border-left: 4px solid var(--orange);
  border-radius: .8rem;
  background: #ffffff;
}
.current-access-label { display: block; margin-bottom: .25rem; color: var(--orange-2); font-size: .68rem; font-weight: 720; }
.current-access-card strong { display: block; font-size: 1.05rem; }
.current-access-card p { margin: .25rem 0 0; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.current-access-scope { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.current-access-scope span { padding: .32rem .5rem; color: var(--ink-2); border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2); font-size: .64rem; }
.role-card { border: 1px solid var(--line); box-shadow: none; }
.role-card-head strong { font-size: .92rem; }
.role-clarity { display: grid; gap: .35rem; margin: .65rem 0; padding: .65rem; border-radius: .55rem; background: var(--surface-2); }
.role-clarity p, .selected-role-preview p { margin: 0; font-size: .7rem; line-height: 1.45; }
.role-can { color: var(--success); }
.role-limit { color: var(--orange-2); }
.selected-role-preview { grid-column: 1/-1; padding: .75rem .8rem; border: 1px solid var(--line); border-left: 3px solid var(--orange); border-radius: .6rem; background: #fff7f4; }
.selected-role-preview strong { display: block; margin-bottom: .35rem; font-size: .8rem; }

@media (max-width: 820px) {
  .topbar { background: rgba(255,255,255,.98); }
  .login-brand::before { top: 0; }
  .login-brand h1 { font-size: clamp(3rem,14vw,4.8rem); }
  .current-access-card { grid-template-columns: 1fr; }
  .current-access-scope { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .section-heading h2 { font-size: 2.2rem; }
  .topbar h1 { font-size: 1.5rem; }
}

/* v0.15.2 — official full-logo integration and usability defect pass */
.crusher-logo {
  display: block;
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  filter: drop-shadow(0 5px 10px rgba(10, 25, 31, .16));
}
.full-brand-logo.login-logo {
  width: auto;
  max-width: 14rem;
  height: 3.5rem;
  object-fit: contain;
  margin: 0 0 .8rem;
  filter: none;
}
.sidebar-logo {
  width: auto;
  height: 2.5rem;
  flex: 0 0 auto;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .2));
}
.app-shell:not([hidden]) .sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 15rem;
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}
.app-shell[hidden] .sidebar,
#app-view[hidden] .sidebar {
  display: none !important;
}
.workspace { grid-column: 2; }
.product-name { margin: .25rem 0 1.8rem; }
.wordmark { gap: .65rem; }
.wordmark > span { min-width: 0; }
.panel, .kpi, .stock-card, .system-card, .readiness-card,
.access-summary-card, .security-card, .access-layout > *, .topbar > * { min-width: 0; }
.top-actions > * { max-width: 100%; }
dialog { max-height: calc(100dvh - 2rem); overflow: auto; }
.dialog-actions { flex-wrap: wrap; }
.dialog-actions button { min-width: 7rem; }

@media (max-width: 1180px) and (min-width: 821px) {
  .topbar { align-items: flex-start; flex-wrap: wrap; }
  .top-actions { flex: 1 0 100%; justify-content: flex-start; }
  .access-layout { grid-template-columns: 1fr; }
  .role-guide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .access-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .sidebar { position: static; width: auto; height: auto; overflow: visible; }
  .workspace { grid-column: auto; }
  .full-brand-logo.login-logo { width: auto; max-width: 14rem; height: 3.5rem; }
  .save-mode-label { display: none; }
  .topbar { align-items: flex-start; flex-wrap: wrap; gap: .75rem; }
  .topbar > div:first-child { flex: 1 0 100%; }
  .top-actions { flex: 1 0 100%; width: 100%; justify-content: flex-start; }
  .top-actions .account-button { min-height: 2.55rem; padding: .55rem .7rem; }
  .mobile-nav {
    display: grid;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(5rem, 1fr);
    justify-content: start;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none; /* Hide scrollbar for a cleaner look */
    -webkit-overflow-scrolling: touch;
  }
  .mobile-nav::-webkit-scrollbar {
    display: none;
  }
  .mobile-nav button { min-width: 5rem; scroll-snap-align: start; }
}
@media (max-width: 560px) {
  .login-card { padding-top: 1.5rem; }
  .full-brand-logo.login-logo { width: auto; max-width: 12rem; height: 3rem; }
  .topbar { min-height: auto; }
  .topbar .eyebrow { margin-bottom: .25rem; }
  .top-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); width: 100%; justify-content: stretch; }
  .top-actions .account-button, #refresh-button { min-width: 0; width: 100%; }
  .section-heading h2 { overflow-wrap: anywhere; }
  .toast { left: .75rem; right: .75rem; top: .75rem; max-width: none; }
  .dialog-actions { display: grid; grid-template-columns: 1fr; }
  .dialog-actions button { width: 100%; }
}

/* v0.16 — Universal Hardware Hub */
.hardware-setup-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
  margin: .9rem 0 1.1rem;
}
.hardware-setup-step {
  position: relative;
  min-width: 0;
  padding: .75rem;
  border: 1px solid #d8e1df;
  border-radius: .7rem;
  background: #f7f9f8;
}
.hardware-setup-step span,
.hardware-setup-step strong,
.hardware-setup-step small { display: block; }
.hardware-setup-step span { color: var(--orange); font: 700 .64rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .1em; }
.hardware-setup-step strong { margin-top: .3rem; font-size: .78rem; }
.hardware-setup-step small { margin-top: .25rem; color: var(--muted); font-size: .63rem; line-height: 1.38; }
.device-preset { grid-column: 1 / -1; }
.device-connection-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .12rem .65rem;
  align-items: center;
  padding: .78rem .85rem;
  border-left: 3px solid var(--orange);
  border-radius: .55rem;
  background: #f2f6f4;
}
.device-connection-summary strong { font-size: .78rem; }
.device-connection-summary small { grid-column: 2; color: var(--muted); font-size: .66rem; line-height: 1.4; }
.connection-maturity { grid-row: 1 / span 2; align-self: stretch; display: grid; place-items: center; min-width: 4.8rem; padding: .3rem .5rem; border-radius: .42rem; color: #31594c; background: #dceae3; font: 700 .58rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; text-align: center; }
.connection-maturity.BENCH_REQUIRED { color: #76502c; background: #f5e8d8; }
.connection-maturity.SIMULATION { color: #3e5861; background: #e2eaed; }
.indicator-tuning-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .7rem;
  align-items: end;
  margin: .1rem 0;
  padding: 1rem;
  border: 1px solid #e0cfc4;
  border-radius: .9rem;
  background: #fffaf6;
}
.indicator-tuning-panel[hidden] { display: none; }
.indicator-tuning-panel legend { padding: 0 .4rem; color: #8a472f; font-size: .72rem; font-weight: 700; }
.indicator-preview-result { grid-column: 1 / -1; min-height: 3.1rem; padding: .7rem .8rem; border-radius: .55rem; background: #f0f3f2; color: var(--muted); font-size: .7rem; line-height: 1.4; }
.indicator-preview-result strong,.indicator-preview-result small { display: block; }
.indicator-preview-result strong { color: var(--ink); font-size: 1.05rem; }
.indicator-preview-result.success { border: 1px solid #bdd8ca; background: #edf6f1; }
.indicator-preview-result.error { border: 1px solid #ebc5c1; background: #fff1ef; color: #873c36; }
#connector-recipe-json { font: 600 .7rem/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.connector-recipe-notes { margin: .8rem 0; padding: .75rem .85rem; border-radius: .6rem; background: #f2f6f4; }
.connector-recipe-notes p { margin: .25rem 0; color: var(--muted); font-size: .68rem; line-height: 1.45; }
.connector-recipe-notes p::before { content: "✓"; margin-right: .45rem; color: var(--orange); font-weight: 800; }

@media (max-width: 1180px) {
  .hardware-setup-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .hardware-setup-steps { grid-template-columns: 1fr; }
  .device-connection-summary { grid-template-columns: 1fr; }
  .device-connection-summary small { grid-column: 1; }
  .connection-maturity { grid-row: auto; justify-self: start; min-width: 0; }
  .indicator-tuning-panel { grid-template-columns: 1fr; }
  .indicator-tuning-panel button { width: 100%; }
}

/* ============================================================
   OTP Sign-In — Tab Toggle & Forms
   ============================================================ */
.login-tab-toggle { display:flex; gap:.35rem; margin:.9rem 0 1.2rem; padding:.2rem; background:#f5ede7; border-radius:.85rem; }
.login-tab { flex:1; padding:.5rem .8rem; border:none; border-radius:.65rem; background:transparent; color:var(--muted); font-size:.82rem; font-weight:600; cursor:pointer; transition:background .18s,color .18s; }
.login-tab.active { background:#fff; color:var(--orange); box-shadow:0 1px 6px rgba(0,0,0,.10); }
.split-fields { display:flex; gap:1.2rem; margin:.4rem 0; }
.radio-label { display:flex; align-items:center; gap:.45rem; font-size:.84rem; font-weight:500; color:var(--ink); cursor:pointer; }
.radio-label input[type=radio] { accent-color:var(--orange); width:1rem; height:1rem; }

/* ============================================================
   Universal Software Accessor — Manifest Grid & Entity Browser
   ============================================================ */
.accessor-manifest-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:.65rem; margin-top:.9rem; }
.manifest-card { padding:.75rem .9rem; border:1px solid #edddd4; border-radius:.75rem; background:#fffaf6; }
.manifest-label { display:block; font-size:.68rem; font-weight:700; color:#a0614a; text-transform:uppercase; letter-spacing:.04em; margin-bottom:.25rem; }
.manifest-value { display:block; font-size:.94rem; font-weight:700; color:var(--ink); word-break:break-all; }
.accessor-form { margin-top:.5rem; }
.accessor-form-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.8rem; margin-bottom:1rem; }
.accessor-browser-bar { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin:.75rem 0 .9rem; }
.accessor-browser-bar select { flex:1; min-width:160px; }
.check-line { display:flex; align-items:center; gap:.45rem; font-size:.83rem; font-weight:500; color:var(--ink); cursor:pointer; }
.check-line input[type=checkbox] { accent-color:var(--orange); width:1rem; height:1rem; }
.acc-entity-result { overflow-x:auto; margin-top:.5rem; }
.accessor-table { width:100%; border-collapse:collapse; font-size:.76rem; }
.accessor-table th { padding:.5rem .7rem; text-align:left; background:#faf3ee; border-bottom:2px solid #edddd4; font-weight:700; color:#8a472f; }
.accessor-table td { padding:.45rem .7rem; border-bottom:1px solid #f0e8e2; color:var(--ink); word-break:break-all; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.accessor-table tr:hover td { background:#fffaf6; }
.accessor-nav-item { border-left:2px solid var(--orange) !important; }

/* ============================================================
   Fleet workspace & permanent benchmark alignment
   ============================================================ */
.fleet-principle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .18rem .85rem;
  align-items: center;
  margin: 0 0 1rem;
  padding: .9rem 1rem;
  border: 1px solid var(--line);
  border-left: 4px solid var(--orange);
  border-radius: .75rem;
  background: var(--surface);
  box-shadow: 0 8px 22px rgba(29, 42, 38, .04);
}
.fleet-principle span {
  grid-row: 1 / span 2;
  align-self: stretch;
  display: grid;
  place-items: center;
  min-width: 4.3rem;
  padding: .35rem .55rem;
  border-radius: .5rem;
  color: #8a472f;
  background: var(--orange-soft);
  font: 800 .62rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .08em;
}
.fleet-principle strong { font-size: .86rem; letter-spacing: -.01em; }
.fleet-principle small { grid-column: 2; color: var(--muted); font-size: .68rem; line-height: 1.45; }
.vehicle-kpis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 0 1rem;
}
.vehicle-master-panel .panel-head { align-items: flex-start; gap: 1rem; }
.vehicle-master-panel .bin-filter-toggle { justify-content: flex-end; }

.settings-form fieldset.benchmark-fieldset { grid-column: 1 / -1; min-width: 0; }
.benchmark-fieldset > .fieldset-copy { max-width: 68rem; }
.benchmark-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: .8rem;
  margin-top: .85rem;
}
.benchmark-group {
  min-width: 0;
  padding: .9rem;
  border: 1px solid var(--line);
  border-radius: .7rem;
  background: #fbfcfb;
}
.benchmark-group-head {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-bottom: .8rem;
}
.benchmark-group-head > span {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 2rem;
  border-radius: .45rem;
  color: #8a472f;
  background: var(--orange-soft);
  font: 800 .62rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.benchmark-group-head strong,
.benchmark-group-head small { display: block; }
.benchmark-group-head strong { font-size: .78rem; }
.benchmark-group-head small { margin-top: .12rem; color: var(--muted); font-size: .63rem; }
.benchmark-group .settings-field-grid {
  grid-template-columns: 1fr;
  gap: .65rem;
}

@media (max-width: 1180px) and (min-width: 701px) {
  .benchmark-group:last-child {
    grid-column: 1 / -1;
  }
  .benchmark-group:last-child .settings-field-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .vehicle-kpis { grid-template-columns: 1fr; }
  .fleet-principle { grid-template-columns: 1fr; }
  .fleet-principle span { grid-row: auto; justify-self: start; min-width: 0; }
  .fleet-principle small { grid-column: 1; }
  .vehicle-master-panel .panel-head { align-items: stretch; }
  .vehicle-master-panel .bin-filter-toggle { justify-content: flex-start; }
  .benchmark-group:last-child .settings-field-grid { grid-template-columns: 1fr; }
}