/* Atelance — système visuel « atelier de précision numérique », sans dépendance externe. */
:root {
  color-scheme: light;
  --canvas: #eaf0f2;
  --surface: #ffffff;
  --surface-muted: #e4eef1;
  --surface-strong: #d8e5ea;
  --ink: #153945;
  --ink-soft: #365764;
  --ink-muted: #526a75;
  --border: #d3dfe2;
  --border-strong: #adc2cb;
  --control-border: #708994;
  --brand: #123f3d;
  --brand-hover: #0c302f;
  --brand-on: #ffffff;
  --action: #1462e8;
  --action-hover: #0c4fc5;
  --action-on: #ffffff;
  --focus: #1769e0;
  --public: #1769e0;
  --internal: #526562;
  --success: #16734b;
  --warning: #945333;
  --copper: #b8744e;
  --ivory: #f4efe5;
  --danger: #b42318;
  --sidebar: #092e3d;
  --sidebar-soft: #174353;
  --radius-sm: 5px;
  --radius-md: 9px;
  --radius-lg: 12px;
  --shadow-subtle: 0 1px 2px rgb(18 63 61 / 8%);
  --shadow-overlay: 0 18px 44px rgb(18 63 61 / 18%);
  --font-body: "Avenir Next", "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-heading: "Avenir Next", "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "SFMono-Regular", "Cascadia Mono", Consolas, ui-monospace, monospace;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font: 400 1rem/1.5 var(--font-body); -webkit-font-smoothing: antialiased; }
body.is-locked { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { color: inherit; font: inherit; }
button, summary, select { cursor: pointer; }
button:disabled, input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: .58; }
form[aria-busy="true"] { cursor: progress; }
form[aria-busy="true"] [aria-disabled="true"] { opacity: .68; pointer-events: none; }
a { color: var(--brand); text-underline-offset: .16em; }
a:hover { color: var(--brand-hover); color: color-mix(in srgb, var(--brand), black 18%); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink); font-family: var(--font-heading); letter-spacing: -.025em; }
h1 { margin-bottom: .35rem; font-size: clamp(1.65rem, 1.1rem + 1.5vw, 2rem); line-height: 1.08; }
h2 { margin-bottom: .25rem; font-size: 1.35rem; line-height: 1.22; }
h3 { margin-bottom: .2rem; font-size: 1.05rem; line-height: 1.3; }
p { margin-bottom: 1rem; }
address { font-style: normal; }
code, .reference-link, .repair-header h1, .slip-reference strong { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 1000; top: .5rem; left: .5rem; padding: .65rem .9rem; color: #fff; background: var(--ink); border-radius: var(--radius-sm); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
::selection { color: var(--ink); background: #b8e2e4; }
.muted, .quiet-copy { color: var(--ink-muted); }
.eyebrow { margin-bottom: .3rem; color: var(--ink-muted); font-size: .72rem; font-weight: 700; letter-spacing: .08em; line-height: 1.25; text-transform: uppercase; }

/* Application shell */
.app-shell { display: grid; grid-template-columns: 224px minmax(0, 1fr); min-height: 100vh; }
.app-frame { min-width: 0; }
.app-main { width: 100%; max-width: 1504px; min-height: 100vh; margin: 0 auto; padding: 2rem; }
.sidebar { position: sticky; z-index: 50; top: 0; display: flex; flex-direction: column; width: 224px; height: 100vh; color: #e8f0f2; background: var(--sidebar); border-right: 1px solid #31454a; }
.sidebar__top { display: flex; align-items: center; min-height: 76px; padding: 1rem; }
.sidebar__brand { display: flex; min-width: 0; align-items: center; gap: .7rem; color: #fff; text-decoration: none; }
.sidebar__brand:hover { color: #fff; }
.sidebar__brand img { width: 38px; height: 38px; flex: 0 0 auto; border-radius: 8px; }
.sidebar__brand span { display: grid; min-width: 0; }
.sidebar__brand strong { overflow: hidden; font-family: var(--font-heading); font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.sidebar__brand small { color: #9fb1b6; font-size: .7rem; letter-spacing: .04em; }
.sidebar__close { display: none; margin-left: auto; color: #fff; }
.sidebar__nav { display: flex; flex: 1; flex-direction: column; gap: .2rem; padding: .5rem .7rem; overflow-y: auto; }
.sidebar__label { margin: 1.15rem .65rem .35rem; color: #89a0a6; font-size: .65rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.nav-item { display: flex; align-items: center; gap: .75rem; min-height: 44px; padding: .65rem .75rem; color: #c8d5d8; border: 1px solid transparent; border-radius: 6px; font-size: .9rem; font-weight: 600; text-decoration: none; }
.nav-item:hover { color: #fff; background: var(--sidebar-soft); }
.nav-item.is-active { color: #fff; background: #2b4147; border-color: #40575c; box-shadow: inset 3px 0 0 var(--brand); }
.nav-item svg, .icon-button svg, .button svg, .search-field svg, .security-callout svg, .public-phone svg, .document-icon svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.sidebar__account { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: .6rem; min-height: 72px; padding: .75rem 1rem; border-top: 1px solid #31454a; }
.account-avatar { display: grid; width: 36px; height: 36px; place-items: center; color: #fff; background: var(--brand); border-radius: 50%; font-size: .8rem; font-weight: 700; }
.account-copy { display: grid; min-width: 0; }
.account-copy strong, .account-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-copy strong { color: #fff; font-size: .78rem; }
.account-copy span { color: #9fb1b6; font-size: .7rem; }
.sidebar__account .icon-button { color: #c8d5d8; }
.mobile-header { display: none; }
.nav-scrim { position: fixed; z-index: 40; inset: 0; background: rgb(5 16 20 / 54%); }

/* Controls */
.button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: .45rem; padding: .55rem .9rem; border: 1px solid transparent; border-radius: var(--radius-md); font-size: .86rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; transition: background-color .15s ease, border-color .15s ease, transform .15s ease; }
.button:hover { text-decoration: none; }
.button:active { transform: translateY(1px); }
.button--primary { color: var(--brand-on); background: var(--brand); border-color: var(--brand); }
.button--primary:hover { color: var(--brand-on); background: var(--brand-hover); background: color-mix(in srgb, var(--brand), black 18%); border-color: transparent; }
.button--secondary { color: var(--ink); background: var(--surface); border-color: var(--border); }
.button--secondary:hover { color: var(--ink); background: var(--surface-muted); border-color: var(--border-strong); }
.button--quiet { color: var(--ink-soft); background: transparent; border-color: transparent; }
.button--quiet:hover { color: var(--ink); background: var(--surface-muted); }
.button--danger { color: #fff; background: var(--danger); border-color: var(--danger); }
.button--small { min-height: 34px; padding: .35rem .65rem; font-size: .78rem; }
.button--large { min-height: 46px; padding-inline: 1.15rem; }
.button--full { width: 100%; }
.icon-button { display: inline-grid; width: 40px; height: 40px; padding: 0; place-items: center; color: var(--ink-soft); background: transparent; border: 1px solid transparent; border-radius: var(--radius-md); }
.icon-button:hover { color: var(--ink); background: var(--surface-muted); }
.icon-button svg { width: 20px; height: 20px; }
.text-link { display: inline-flex; align-items: center; color: var(--brand); font-size: .82rem; font-weight: 700; }

/* Page structure */
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.page-header > div > p:last-child { max-width: 50rem; margin-bottom: 0; color: var(--ink-muted); }
.page-header--compact { align-items: center; }
.breadcrumbs { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.25rem; color: var(--ink-muted); font-size: .78rem; }
.breadcrumbs a { color: var(--ink-muted); }
.work-panel, .side-panel, .upload-panel, .quote-summary, .form-panel, .deposit-summary, .attention-panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.work-panel { min-width: 0; padding: 1.25rem; }
.work-panel--flush { padding: 0; overflow: hidden; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.15rem; }
.section-heading h2 { margin-bottom: .15rem; }
.section-heading p { margin-bottom: 0; color: var(--ink-muted); font-size: .82rem; }

/* Flash and empty states */
.flash-stack { display: grid; gap: .5rem; margin-bottom: 1rem; }
.flash { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 44px; padding: .65rem .75rem .65rem 1rem; color: #12462e; background: #ecfdf3; border: 1px solid #a6f4c5; border-left: 4px solid var(--success); border-radius: var(--radius-md); font-size: .86rem; }
.flash--error, .flash--danger { color: #7a271a; background: #fef3f2; border-color: #fecdca; border-left-color: var(--danger); }
.flash--warning { color: #7a2e0e; background: #fffaeb; border-color: #fedf89; border-left-color: var(--warning); }
.flash--info { color: #1849a9; background: #eff8ff; border-color: #b2ddff; border-left-color: var(--public); }
.flash__close { width: 32px; height: 32px; }
.empty-state { display: grid; max-width: 30rem; min-height: 280px; margin: 0 auto; padding: 3rem 1rem; place-items: center; align-content: center; text-align: center; }
.empty-state svg { width: 48px; color: var(--border-strong); fill: none; stroke: currentColor; stroke-width: 1.5; }
.empty-state h2 { margin: .9rem 0 .25rem; }
.empty-state p { color: var(--ink-muted); }
.quiet-state { display: grid; min-height: 120px; place-items: center; align-content: center; color: var(--ink-muted); text-align: center; }
.quiet-state > span { display: grid; width: 34px; height: 34px; margin-bottom: .5rem; place-items: center; color: var(--success); background: #ecfdf3; border-radius: 50%; font-weight: 700; }
.quiet-state p { margin: 0; }
.error-summary { margin-bottom: 1rem; padding: .9rem 1rem; color: #7a271a; background: #fef3f2; border: 1px solid #fecdca; border-left: 4px solid var(--danger); border-radius: var(--radius-md); }
.error-summary h2 { margin: 0 0 .35rem; color: inherit; font-family: var(--font-body); font-size: .95rem; }
.error-summary ul { margin: 0; padding-left: 1.2rem; font-size: .82rem; }
.error-summary a { color: inherit; }

/* Dashboard */
.metric-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 1.5rem; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.metric-strip a { display: grid; grid-template-columns: 1fr auto; min-height: 86px; align-items: end; gap: .75rem; padding: 1rem 1.1rem; color: var(--ink); text-decoration: none; }
.metric-strip a + a { border-left: 1px solid var(--border); }
.metric-strip a:hover { background: var(--surface-muted); }
.metric-strip span { align-self: start; color: var(--ink-muted); font-size: .77rem; font-weight: 600; line-height: 1.3; }
.metric-strip strong { font-family: var(--font-heading); font-size: 1.75rem; line-height: 1; font-variant-numeric: tabular-nums; }
.metric-strip__alert { color: var(--danger); }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 1.25rem; }
.attention-panel { padding: 1.1rem; }
.attention-list { display: grid; gap: .55rem; margin: 0; padding: 0; list-style: none; }
.attention-item { overflow: hidden; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.attention-item a { display: grid; gap: .1rem; padding: .7rem .8rem .7rem 1rem; color: var(--ink); text-decoration: none; }
.attention-item a:hover { background: var(--surface-muted); }
.attention-item__top { display: flex; justify-content: space-between; gap: .5rem; }
.attention-item__top strong { font-family: var(--font-mono); font-size: .78rem; }
.attention-item__top span { color: var(--danger); font-size: .68rem; font-weight: 700; }
.attention-item a > span:not(.attention-item__top) { font-size: .83rem; }
.attention-item small { color: var(--ink-muted); }

/* Rails and status */
.repair-rail { position: relative; }
.repair-rail::before { position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; width: 4px; background: #475467; content: ""; }
.repair-rail--diagnosing::before { background: #175cd3; }
.repair-rail--awaiting_approval::before { background: #945200; }
.repair-rail--awaiting_part::before { background: #6941c6; }
.repair-rail--repairing::before { background: #0e7090; }
.repair-rail--testing::before { background: #3538cd; }
.repair-rail--ready::before { background: #067647; }
.repair-rail--returned::before { background: #344054; }
.repair-rail--cancelled::before { background: #b42318; }
.status-chip { display: inline-flex; max-width: 100%; min-height: 26px; align-items: center; gap: .4rem; padding: .22rem .55rem; color: #475467; background: #f2f4f7; border: 1px solid #e4e7ec; border-radius: 999px; font-size: .7rem; font-weight: 700; line-height: 1.25; }
.status-chip__dot { width: 7px; height: 7px; flex: 0 0 auto; background: currentColor; border-radius: 50%; }
.status-chip--diagnosing { color: #175cd3; background: #eff8ff; border-color: #b2ddff; }
.status-chip--awaiting_approval { color: #945200; background: #fffaeb; border-color: #fedf89; }
.status-chip--awaiting_part { color: #6941c6; background: #f4f3ff; border-color: #d9d6fe; }
.status-chip--repairing { color: #0e7090; background: #ecfdff; border-color: #a5f0fc; }
.status-chip--testing { color: #3538cd; background: #eef4ff; border-color: #c7d7fe; }
.status-chip--ready { color: #067647; background: #ecfdf3; border-color: #abefc6; }
.status-chip--returned { color: #344054; background: #f2f4f7; border-color: #d0d5dd; }
.status-chip--cancelled { color: #b42318; background: #fef3f2; border-color: #fecdca; }
.priority-label { display: block; width: max-content; margin-top: .25rem; color: var(--warning); font-size: .65rem; font-weight: 700; }
.priority-label--urgent { color: var(--danger); }

/* Tables */
.table-scroll { max-width: 100%; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; border-spacing: 0; font-size: .82rem; }
.data-table th { height: 42px; padding: .55rem .75rem; color: var(--ink-muted); background: var(--canvas); border-bottom: 1px solid var(--border); font-size: .68rem; font-weight: 700; letter-spacing: .045em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.data-table td { min-height: 58px; padding: .75rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: #f8fafb; }
.work-panel:not(.work-panel--flush) .data-table th { background: transparent; }
.repair-row__reference { padding-left: 1rem !important; }
.reference-link { color: var(--ink); font-size: .78rem; font-weight: 700; text-decoration-thickness: 1px; }
.repair-row td:nth-child(2), .customer-table td:nth-child(2) { display: table-cell; }
.repair-row td:nth-child(2) strong, .repair-row td:nth-child(2) span, .customer-table td:nth-child(2) span, .customer-table td:nth-child(2) small { display: block; }
.repair-row td:nth-child(2) span, .customer-table small { color: var(--ink-muted); font-size: .75rem; }
.is-overdue, .overdue-copy { color: var(--danger); font-weight: 700; }
.overdue-copy { display: block; font-size: .65rem; }
.table-action { text-align: right; }
.pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding: .8rem 1rem; color: var(--ink-muted); border-top: 1px solid var(--border); font-size: .75rem; }
.pagination > :last-child { justify-self: end; }

/* Filters and Kanban */
.filter-panel { display: grid; grid-template-columns: minmax(250px, 1.4fr) repeat(3, minmax(130px, .55fr)) auto auto; align-items: end; gap: .65rem; margin-bottom: 1rem; padding: .9rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.filter-panel--single { grid-template-columns: minmax(260px, 520px) auto auto; justify-content: start; }
.search-field { position: relative; }
.search-field svg { position: absolute; top: 50%; left: .8rem; width: 18px; color: var(--ink-muted); transform: translateY(-50%); }
.search-field input { width: 100%; padding-left: 2.35rem; }
.filter-fields { display: contents; }
.filter-fields label:not(.check-filter) { display: grid; gap: .25rem; }
.filter-fields label > span { color: var(--ink-muted); font-size: .68rem; font-weight: 700; }
.check-filter { display: flex; min-height: 40px; align-items: center; gap: .45rem; white-space: nowrap; }
.filter-actions { display: flex; align-items: center; gap: .55rem; }
.mobile-filter-toggle { display: none; }
.view-switch { display: flex; padding: 3px; background: var(--surface-muted); border: 1px solid var(--border); border-radius: var(--radius-md); }
.view-switch button { min-height: 32px; padding: .3rem .65rem; color: var(--ink-muted); background: transparent; border: 0; border-radius: 4px; font-size: .75rem; font-weight: 700; }
.view-switch button.is-active { color: var(--ink); background: var(--surface); box-shadow: 0 1px 2px rgb(23 33 38 / 12%); }
input, select, textarea { width: 100%; min-height: 42px; padding: .55rem .7rem; color: var(--ink); background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-md); }
textarea { min-height: 96px; resize: vertical; }
input:hover, select:hover, textarea:hover { border-color: #74868e; }
input:focus, select:focus, textarea:focus { border-color: var(--focus); outline: 3px solid rgb(11 116 222 / 18%); outline-offset: 0; }
input[type="checkbox"], input[type="radio"] { width: 18px; min-height: 18px; height: 18px; padding: 0; accent-color: var(--brand); }
input[type="file"] { min-height: 48px; padding: .55rem; background: var(--canvas); }
.kanban { display: grid; grid-auto-columns: 280px; grid-auto-flow: column; align-items: start; gap: .8rem; max-width: 100%; padding-bottom: 1rem; overflow-x: auto; scroll-snap-type: x proximity; }
.kanban-column { overflow: hidden; background: #e9eef0; border: 1px solid var(--border); border-radius: var(--radius-lg); scroll-snap-align: start; }
.kanban-column > header { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: .6rem; padding: .65rem .8rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.kanban-column > header h2 { margin: 0; font-family: var(--font-body); font-size: .78rem; }
.kanban-column > header span { display: grid; min-width: 24px; height: 24px; padding-inline: .3rem; place-items: center; color: var(--ink-muted); background: var(--surface-muted); border-radius: 999px; font-size: .68rem; font-weight: 700; }
.kanban-column__body { display: grid; gap: .55rem; min-height: 150px; max-height: calc(100vh - 270px); padding: .55rem; overflow-y: auto; }
.repair-card { padding: .7rem .75rem .65rem .95rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.repair-card h3 { margin: .45rem 0 .05rem; font-family: var(--font-body); font-size: .82rem; }
.repair-card p { margin: 0; color: var(--ink-muted); font-size: .74rem; }
.repair-card footer { display: flex; justify-content: space-between; gap: .5rem; margin-top: .7rem; padding-top: .55rem; color: var(--ink-muted); border-top: 1px solid var(--surface-muted); font-size: .68rem; }
.kanban-empty { margin: 1.25rem 0; color: var(--ink-muted); font-size: .75rem; text-align: center; }

/* Forms */
.stack-form { display: grid; gap: 1rem; }
.form-field { display: grid; align-content: start; gap: .28rem; min-width: 0; }
.form-field > label, fieldset > label { color: var(--ink-soft); font-size: .78rem; font-weight: 700; }
.form-field.is-required > label::after { color: var(--danger); content: " *"; }
.field-help { color: var(--ink-muted); font-size: .72rem; line-height: 1.4; }
.field-error { color: var(--danger); font-size: .72rem; font-weight: 600; }
.form-field.has-error input, .form-field.has-error select, .form-field.has-error textarea { border-color: var(--danger); }
.form-grid { display: grid; gap: 1rem; }
.form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-grid__full { grid-column: 1 / -1; }
.form-panel { padding: 1.25rem; }
.form-panel fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.form-panel fieldset + fieldset { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.form-panel fieldset > legend { margin-bottom: 1rem; padding: 0; font-family: var(--font-heading); font-size: 1.2rem; font-weight: 700; }
.checkbox-field, .confirmation-field { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: .55rem; color: var(--ink-soft); font-size: .82rem; }
.checkbox-field input, .confirmation-field input { margin-top: .1rem; }
.checkbox-field p { grid-column: 2; margin: -.2rem 0 0; color: var(--ink-muted); font-size: .72rem; }
.editor-layout { display: grid; grid-template-columns: minmax(0, 760px) 260px; align-items: start; gap: 1.25rem; }
.editor-actions { position: sticky; top: 1rem; display: grid; gap: .55rem; padding: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.editor-actions p { color: var(--ink-muted); font-size: .77rem; }
.section-divider { display: flex; align-items: center; gap: .7rem; margin: 1.25rem 0; color: var(--ink-muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; }
.section-divider::before, .section-divider::after { height: 1px; flex: 1; background: var(--border); content: ""; }
.security-callout { display: flex; align-items: flex-start; gap: .75rem; margin-top: 1rem; padding: .8rem; color: #713b12; background: #fffaeb; border: 1px solid #fedf89; border-radius: var(--radius-md); }
.security-callout svg { width: 22px; flex: 0 0 auto; }
.security-callout strong { display: block; font-size: .82rem; }
.security-callout p { margin: .1rem 0 0; font-size: .74rem; }
.security-callout--compact { margin-top: 1.2rem; color: var(--ink-muted); background: var(--canvas); border-color: var(--border); }
.time-target { padding: .35rem .55rem; color: var(--brand); background: color-mix(in srgb, var(--brand), white 91%); border: 1px solid color-mix(in srgb, var(--brand), white 70%); border-radius: var(--radius-sm); font-size: .72rem; font-weight: 700; }

/* Authentication */
.auth-body { min-height: 100vh; background: #e8eef0; }
.auth-body::before { position: fixed; inset: 0 0 auto; height: 7px; background: var(--brand); content: ""; }
.auth-shell { display: grid; min-height: 100vh; padding: 2rem 1rem; place-items: center; }
.auth-panel { width: min(100%, 410px); padding: 1.5rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: 0 20px 50px rgb(23 33 38 / 12%); }
.auth-brand { display: flex; align-items: center; gap: .7rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--border); }
.auth-brand img { width: 42px; height: 42px; border-radius: 8px; }
.auth-brand div { display: grid; }
.auth-brand strong { font-family: var(--font-heading); font-size: 1.1rem; }
.auth-brand span { color: var(--ink-muted); font-size: .72rem; }
.auth-copy { padding: 1.5rem 0 1.1rem; }
.auth-copy p:last-child { margin: 0; color: var(--ink-muted); }
.password-field { position: relative; }
.password-field input { padding-right: 5.2rem; }
.password-toggle { position: absolute; top: 50%; right: .35rem; padding: .35rem .45rem; color: var(--brand); background: transparent; border: 0; font-size: .72rem; font-weight: 700; transform: translateY(-50%); }
.demo-accounts { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.demo-accounts summary { color: var(--ink-muted); font-size: .75rem; font-weight: 700; }
.demo-accounts__body { padding-top: .8rem; }
.demo-accounts__body > p { color: var(--ink-muted); font-size: .72rem; }
.demo-account { display: grid; gap: .15rem; margin-top: .6rem; padding: .6rem; background: var(--canvas); border-radius: var(--radius-sm); }
.demo-account strong { font-size: .74rem; }
.demo-account code { font-size: .68rem; overflow-wrap: anywhere; }

/* Quick repair creation */
.repair-create { min-width: 0; }
.stepper { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 720px; margin-bottom: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.stepper button { display: flex; min-height: 54px; align-items: center; justify-content: center; gap: .55rem; color: var(--ink-muted); background: transparent; border: 0; border-right: 1px solid var(--border); font-size: .78rem; font-weight: 700; }
.stepper button:last-child { border-right: 0; }
.stepper button > span { display: grid; width: 24px; height: 24px; place-items: center; background: var(--surface-muted); border-radius: 50%; font-size: .68rem; }
.stepper button.is-current { color: var(--brand); background: color-mix(in srgb, var(--brand), white 94%); }
.stepper button.is-current > span, .stepper button.is-complete > span { color: #fff; background: var(--brand); }
.repair-create__grid { display: grid; grid-template-columns: minmax(0, 780px) 280px; align-items: start; gap: 1.25rem; }
.repair-create__panels { min-width: 0; }
.step-panel { margin: 0 0 1rem; }
.js .step-panel:not(.is-active) { display: none; }
.step-panel > legend { display: flex; align-items: flex-start; gap: .65rem; width: 100%; }
.step-panel > legend > span:first-child { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; color: #fff; background: var(--brand); border-radius: 50%; font-family: var(--font-body); font-size: .72rem; }
.step-panel > legend > span:last-child { display: grid; }
.step-panel legend small { color: var(--ink-muted); font-family: var(--font-body); font-size: .75rem; font-weight: 400; }
.step-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.deposit-summary { position: sticky; top: 1rem; padding: 1rem; }
.deposit-summary h2 { margin-bottom: 1rem; }
.deposit-summary dl { margin: 0; }
.deposit-summary dl > div { padding: .7rem 0; border-top: 1px solid var(--border); }
.deposit-summary dt { color: var(--ink-muted); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.deposit-summary dd { margin: .2rem 0 0; font-size: .82rem; font-weight: 600; overflow-wrap: anywhere; }
.deposit-summary__note { margin: .8rem 0 0; padding: .7rem; color: var(--ink-muted); background: var(--canvas); border-radius: var(--radius-sm); font-size: .7rem; }
.initial-status { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.2rem; padding: .75rem; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.initial-status > span { color: var(--ink-muted); font-size: .75rem; font-weight: 700; }

/* Repair detail */
.repair-header { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-bottom: 1rem; padding: 1rem 1rem 1rem 1.25rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.repair-header__title { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
.repair-header h1 { margin: 0; font-size: 1.7rem; }
.repair-header__identity > p { display: flex; flex-wrap: wrap; gap: .4rem; margin: .25rem 0 0; color: var(--ink-muted); font-size: .82rem; }
.repair-header__actions { display: flex; align-items: center; gap: .55rem; }
.archive-label { display: inline-flex; margin-top: .45rem; padding: .15rem .4rem; color: var(--ink-muted); background: var(--surface-muted); border-radius: 3px; font-size: .65rem; font-weight: 700; }
.action-menu { position: relative; }
.action-menu summary { list-style: none; }
.action-menu summary::-webkit-details-marker { display: none; }
.action-menu__panel { position: absolute; z-index: 20; top: calc(100% + .35rem); right: 0; width: 230px; padding: .35rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-overlay); }
.action-menu__panel a, .action-menu__panel button { display: block; width: 100%; min-height: 38px; padding: .55rem .65rem; color: var(--ink); background: transparent; border: 0; border-radius: 4px; font-size: .76rem; text-align: left; text-decoration: none; }
.action-menu__panel a:hover, .action-menu__panel button:hover { background: var(--surface-muted); }
.detail-tabs { display: flex; gap: 1.5rem; margin-bottom: 1rem; padding: 0 .25rem; overflow-x: auto; border-bottom: 1px solid var(--border); }
.detail-tabs a { position: relative; display: flex; min-height: 44px; align-items: center; gap: .35rem; color: var(--ink-muted); font-size: .8rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.detail-tabs a[aria-current="page"] { color: var(--brand); }
.detail-tabs a[aria-current="page"]::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; background: var(--brand); content: ""; }
.detail-tabs a > span:not(.tab-indicator) { display: grid; min-width: 20px; height: 20px; place-items: center; color: var(--ink-muted); background: var(--surface-muted); border-radius: 999px; font-size: .62rem; }
.tab-indicator { width: 7px; height: 7px; background: var(--success); border-radius: 50%; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 1.25rem; }
.detail-grid--wide { grid-template-columns: minmax(0, 1fr) 320px; }
.detail-main, .detail-sidebar { display: grid; gap: 1rem; min-width: 0; }
.side-panel, .upload-panel, .quote-summary { padding: 1rem; }
.side-panel h2, .upload-panel h2 { margin-bottom: .8rem; font-family: var(--font-body); font-size: .9rem; }
.side-panel__title { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.compact-list, .fact-list { margin: 0; }
.compact-list > div { display: grid; grid-template-columns: minmax(90px, .7fr) minmax(0, 1fr); gap: .6rem; padding: .48rem 0; border-top: 1px solid var(--border); font-size: .76rem; }
.compact-list dt, .fact-list dt { color: var(--ink-muted); font-weight: 600; }
.compact-list dd, .fact-list dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.side-panel address { display: grid; gap: .25rem; font-size: .78rem; }
.side-panel address span { color: var(--ink-muted); }
.fact-list > div { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 1rem; padding: .85rem 0; border-top: 1px solid var(--border); font-size: .82rem; }
.inline-editor { margin-top: .9rem; border-top: 1px solid var(--border); }
.inline-editor > summary { margin-top: .9rem; list-style: none; }
.inline-editor > summary::-webkit-details-marker { display: none; }
.inline-editor > form { display: grid; gap: .85rem; margin-top: .75rem; padding: .85rem; background: var(--canvas); border-radius: var(--radius-md); }
.note-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.note-composer { overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.note-composer--public { border-color: #b2ddff; }
.note-composer > summary { display: flex; min-height: 76px; align-items: center; gap: .75rem; padding: .9rem 1rem; list-style: none; }
.note-composer > summary::-webkit-details-marker { display: none; }
.note-composer > summary:hover { background: var(--canvas); }
.note-composer__icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; background: var(--surface-muted); border-radius: 50%; }
.note-composer--public .note-composer__icon { color: var(--public); background: #eff8ff; }
.note-composer summary > span:last-child { display: grid; }
.note-composer summary strong { font-size: .82rem; }
.note-composer summary small { color: var(--ink-muted); font-size: .7rem; }
.note-composer > form { display: grid; gap: .5rem; padding: 0 1rem 1rem; }
.note-composer > form label { font-size: .75rem; font-weight: 700; }
.note-composer > form > div { text-align: right; }
.public-link-panel label { display: block; margin-bottom: .25rem; color: var(--ink-muted); font-size: .68rem; font-weight: 700; }
.copy-field { display: flex; gap: .35rem; margin-bottom: .55rem; }
.copy-field input { min-width: 0; height: 36px; min-height: 36px; font-family: var(--font-mono); font-size: .65rem; }
.mini-qr { display: grid; margin: 0 auto .8rem; place-items: center; }
.mini-qr svg { width: 126px; height: 126px; }

/* Timeline */
.timeline, .public-timeline { position: relative; margin: 0; padding: 0; list-style: none; }
.timeline::before { position: absolute; top: 10px; bottom: 14px; left: 7px; width: 1px; background: var(--border); content: ""; }
.timeline-item { position: relative; padding: 0 0 1.15rem 1.8rem; }
.timeline-item:last-child { padding-bottom: 0; }
.timeline-item__marker { position: absolute; z-index: 1; top: .3rem; left: 2px; width: 11px; height: 11px; background: var(--surface); border: 3px solid var(--border-strong); border-radius: 50%; }
.timeline-item--public .timeline-item__marker, .timeline-item--status .timeline-item__marker { border-color: var(--public); }
.timeline-item__header { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.timeline-item__header strong { font-size: .8rem; }
.timeline-item p { margin: .25rem 0; color: var(--ink-soft); font-size: .78rem; overflow-wrap: anywhere; }
.timeline-item small { color: var(--ink-muted); font-size: .68rem; }
.visibility-badge, .document-state { display: inline-flex; min-height: 22px; align-items: center; padding: .16rem .42rem; color: var(--internal); background: #f2f4f7; border: 1px solid #d0d5dd; border-radius: 999px; font-size: .62rem; font-weight: 700; line-height: 1.2; }
.visibility-badge--public { color: var(--public); background: #eff8ff; border-color: #b2ddff; }
.visibility-badge--internal { color: var(--internal); }

/* Quotes and documents */
.quote-panel { overflow: hidden; }
.quote-lines { display: grid; margin: 1rem 0; border: 1px solid var(--border); border-radius: var(--radius-md); }
.quote-line { display: grid; grid-template-columns: minmax(220px, 2fr) 80px 110px 90px 40px; gap: .55rem; align-items: start; padding: .7rem; border-bottom: 1px solid var(--border); }
.quote-line:last-child { border-bottom: 0; }
.quote-line--head { align-items: center; padding-block: .5rem; color: var(--ink-muted); background: var(--canvas); font-size: .67rem; font-weight: 700; text-transform: uppercase; }
.quote-line .form-field label { display: none; }
.quote-line input { min-height: 38px; padding: .4rem .5rem; font-size: .78rem; }
.quote-line__remove { width: 36px; height: 36px; color: var(--danger); }
.quote-lines--read-only .quote-line { grid-template-columns: minmax(220px, 2fr) 65px 100px 70px 100px; font-size: .76rem; }
.quote-lines--read-only .quote-line strong { font-size: .78rem; }
.quote-meta { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.quote-actions { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1.1rem; }
.live-totals { display: flex; justify-content: flex-end; gap: 1.5rem; margin: 1rem 0 0; padding: .8rem; background: var(--canvas); border-radius: var(--radius-md); }
.live-totals div { display: grid; text-align: right; }
.live-totals dt { color: var(--ink-muted); font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.live-totals dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 700; }
.live-totals div:last-child dd { color: var(--brand); font-size: 1.05rem; }
.money-summary { margin: 0; }
.money-summary > div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--border); font-size: .8rem; }
.money-summary dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 700; }
.money-summary__total { margin-top: .4rem; padding-top: .8rem !important; border-bottom: 0 !important; font-size: 1rem !important; }
.money-summary__total dd { color: var(--brand); font-size: 1.25rem; }
.quote-validity { margin: .7rem 0; color: var(--ink-muted); font-size: .72rem; }
.public-comment { margin-top: 1rem; padding: .8rem; background: #eff8ff; border-left: 3px solid var(--public); border-radius: var(--radius-sm); }
.public-comment strong { font-size: .76rem; }
.public-comment p { margin: .2rem 0 0; font-size: .78rem; }
.decision-card { margin-top: 1rem; padding: .85rem; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.decision-card--accepted { background: #ecfdf3; border-color: #abefc6; }
.decision-card--refused { background: #fef3f2; border-color: #fecdca; }
.decision-card strong { display: block; font-size: 1rem; }
.decision-card > p:last-child { margin: .3rem 0 0; color: var(--ink-muted); font-size: .7rem; }
.document-state--published, .document-state--accepted { color: var(--success); background: #ecfdf3; border-color: #abefc6; }
.document-state--refused { color: var(--danger); background: #fef3f2; border-color: #fecdca; }
.document-state--waiting { color: var(--warning); background: #fffaeb; border-color: #fedf89; }
.document-list, .public-documents { margin: 0; padding: 0; list-style: none; }
.document-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto auto; align-items: center; gap: .75rem; min-height: 66px; padding: .6rem 0; border-top: 1px solid var(--border); }
.document-icon { display: grid; width: 36px; height: 36px; place-items: center; color: var(--ink-muted); background: var(--surface-muted); border-radius: var(--radius-md); }
.document-icon svg { width: 18px; }
.document-row__copy { display: grid; min-width: 0; }
.document-row__copy strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.document-row__copy span { color: var(--ink-muted); font-size: .68rem; }
.upload-panel form { display: grid; gap: .9rem; }

/* Public portal */
.public-body { min-height: 100vh; background: #edf2f3; }
.public-header { position: relative; z-index: 10; background: var(--surface); border-bottom: 1px solid var(--border); }
.public-header__inner { display: flex; width: min(100%, 720px); min-height: 62px; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 auto; padding: .6rem 1.25rem; }
.public-brand { display: flex; min-width: 0; align-items: center; gap: .65rem; font-family: var(--font-heading); font-weight: 700; }
.public-brand__logo { width: 38px; height: 38px; object-fit: contain; }
.public-brand__logo--fallback { border-radius: 8px; }
.public-brand > span { display: grid; min-width: 0; overflow: hidden; }
.public-brand > span strong,
.public-brand > span small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.public-brand > span small { color: var(--ink-muted); font-size: .66rem; font-weight: 600; }
.public-phone { display: inline-flex; min-height: 40px; align-items: center; gap: .35rem; padding: .4rem .65rem; color: var(--brand); border: 1px solid color-mix(in srgb, var(--brand), white 60%); border-radius: var(--radius-md); font-size: .76rem; font-weight: 700; text-decoration: none; }
.public-phone svg { width: 17px; }
.public-main { width: min(100%, 720px); margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.public-repair { display: grid; gap: 1rem; }
.public-repair__intro { padding: .25rem .15rem .5rem; }
.public-repair__intro h1 { margin: 0; font-family: var(--font-mono); font-size: 1.55rem; }
.public-repair__intro > p:last-child { margin: .3rem 0 0; color: var(--ink-muted); }
.public-status { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.15rem 1rem 1.15rem 1.35rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.public-status::before { width: 6px; }
.public-status div > span { color: var(--ink-muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; }
.public-status h2 { margin: .15rem 0 .3rem; font-size: 1.45rem; }
.public-status p { margin: 0; color: var(--ink-soft); font-size: .8rem; }
.public-status__updated { color: var(--ink-muted); font-size: .66rem; white-space: nowrap; }
.public-progress, .public-section, .public-contact, .public-cancelled { padding: 1.15rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.public-progress h2 { margin-bottom: 1rem; font-family: var(--font-body); font-size: .85rem; }
.public-progress ol { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; }
.public-progress ol::before { position: absolute; top: 14px; right: 12.5%; left: 12.5%; height: 2px; background: var(--border); content: ""; }
.public-progress li { position: relative; z-index: 1; display: grid; justify-items: center; gap: .35rem; color: var(--ink-muted); font-size: .68rem; text-align: center; }
.public-progress li > span { display: grid; width: 30px; height: 30px; place-items: center; background: var(--surface); border: 2px solid var(--border); border-radius: 50%; font-weight: 700; }
.public-progress li.is-reached > span { color: #fff; background: var(--brand); border-color: var(--brand); }
.public-progress li.is-reached strong { color: var(--ink); }
.public-progress li.is-current > span { box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand), white 76%); }
.public-section__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; margin-bottom: 1rem; }
.public-section__heading h2 { margin: 0; }
.public-section__heading .eyebrow { margin-bottom: .15rem; }
.public-quote { border-top: 4px solid var(--brand); }
.public-quote__lines { border-top: 1px solid var(--border); }
.public-quote-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--border); }
.public-quote-line > div { display: grid; }
.public-quote-line strong { font-size: .8rem; }
.public-quote-line small { color: var(--ink-muted); font-size: .68rem; }
.public-quote-line > span { flex: 0 0 auto; font-size: .78rem; font-variant-numeric: tabular-nums; font-weight: 700; }
.public-totals { width: min(100%, 280px); margin: .75rem 0 .75rem auto; }
.public-totals > div { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; color: var(--ink-muted); font-size: .75rem; }
.public-totals dd { margin: 0; color: var(--ink); font-variant-numeric: tabular-nums; font-weight: 700; }
.public-totals > div:last-child { margin-top: .3rem; padding-top: .65rem; color: var(--ink); border-top: 2px solid var(--ink); font-size: .95rem; font-weight: 700; }
.public-totals > div:last-child dd { color: var(--brand); font-size: 1.1rem; }
.decision-form { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--border); scroll-margin-top: 1rem; }
.decision-form fieldset { margin: 0 0 1rem; padding: 0; border: 0; }
.decision-form legend { margin-bottom: .55rem; font-size: .8rem; font-weight: 700; }
.decision-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: .65rem; }
.decision-options label { position: relative; display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: .55rem; padding: .8rem; border: 1px solid var(--border); border-radius: var(--radius-md); }
.decision-options label:has(input:checked) { background: color-mix(in srgb, var(--brand), white 94%); border-color: var(--brand); }
.decision-options input { margin-top: .15rem; }
.decision-options span { display: grid; }
.decision-options strong { font-size: .78rem; }
.decision-options small { margin-top: .1rem; color: var(--ink-muted); font-size: .67rem; }
.decision-form > .form-field, .decision-form > .confirmation-field { margin-top: .9rem; }
.decision-form > .button { margin-top: 1rem; }
.decision-form__notice { margin: .45rem 0 0; color: var(--ink-muted); font-size: .68rem; text-align: center; }
.decision-receipt { display: flex; gap: .7rem; margin-top: 1rem; padding: .85rem; color: #085d3a; background: #ecfdf3; border: 1px solid #abefc6; border-radius: var(--radius-md); }
.decision-receipt--refused { color: #912018; background: #fef3f2; border-color: #fecdca; }
.decision-receipt > span { display: grid; width: 26px; height: 26px; flex: 0 0 auto; place-items: center; color: #fff; background: var(--success); border-radius: 50%; font-weight: 700; }
.decision-receipt--refused > span { background: var(--danger); }
.decision-receipt strong { font-size: .82rem; }
.decision-receipt p { margin: .15rem 0 0; font-size: .72rem; }
.public-timeline::before { position: absolute; top: 8px; bottom: 14px; left: 6px; width: 1px; background: var(--border); content: ""; }
.public-timeline li { position: relative; padding: 0 0 1.1rem 1.7rem; }
.public-timeline li:last-child { padding-bottom: 0; }
.public-timeline__marker { position: absolute; z-index: 1; top: .25rem; left: 1px; width: 11px; height: 11px; background: var(--surface); border: 3px solid var(--brand); border-radius: 50%; }
.public-timeline strong { font-size: .8rem; }
.public-timeline p { margin: .2rem 0; color: var(--ink-soft); font-size: .78rem; overflow-wrap: anywhere; }
.public-timeline time { color: var(--ink-muted); font-size: .67rem; }
.public-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.public-gallery a { display: grid; gap: .3rem; color: var(--ink); font-size: .68rem; text-decoration: none; }
.public-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.public-gallery span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.public-documents li { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: .65rem; padding: .65rem 0; border-top: 1px solid var(--border); }
.public-documents li > div:nth-child(2) { display: grid; min-width: 0; }
.public-documents strong { overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.public-documents span { color: var(--ink-muted); font-size: .66rem; }
.public-contact { text-align: center; }
.public-contact address { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1rem; margin: .8rem 0; font-size: .8rem; }
.public-contact > p:last-child { margin: 0; color: var(--ink-muted); font-size: .66rem; }
.public-cancelled { color: #7a271a; background: #fef3f2; border-color: #fecdca; }
.public-cancelled p { margin: .2rem 0 0; font-size: .78rem; }
.mobile-decision-bar { display: none; }
.public-unavailable { display: grid; max-width: 520px; min-height: calc(100vh - 150px); margin: 0 auto; place-items: center; align-content: center; text-align: center; }
.public-unavailable__icon { display: grid; width: 72px; height: 72px; margin-bottom: 1rem; place-items: center; color: var(--ink-muted); background: var(--surface); border: 1px solid var(--border); border-radius: 50%; }
.public-unavailable__icon svg { width: 42px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 2; }
.public-unavailable > p:not(.eyebrow):not(.public-unavailable__privacy) { max-width: 440px; color: var(--ink-muted); }
.public-unavailable__privacy { margin-top: 1.5rem; color: var(--ink-muted); font-size: .68rem; }

/* Settings and simulated outbox */
.settings-tabs { display: flex; gap: 1.4rem; margin-bottom: 1rem; padding-inline: .2rem; border-bottom: 1px solid var(--border); }
.settings-tabs a { position: relative; display: flex; min-height: 44px; align-items: center; color: var(--ink-muted); font-size: .8rem; font-weight: 700; text-decoration: none; }
.settings-tabs a[aria-current="page"] { color: var(--brand); }
.settings-tabs a[aria-current="page"]::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; background: var(--brand); content: ""; }
.settings-layout { display: grid; grid-template-columns: minmax(0, 760px) 300px; align-items: start; gap: 1.25rem; }
.workshop-preview { position: sticky; top: 1rem; display: grid; gap: .75rem; padding: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.preview-header { display: flex; align-items: center; gap: .65rem; margin-bottom: .35rem; padding: .8rem; background: var(--canvas); border: 1px solid var(--border); border-radius: var(--radius-md); }
.preview-header img, .preview-logo { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; object-fit: contain; color: #fff; background: var(--brand); border-radius: 7px; font-weight: 700; }
.preview-header > div { display: grid; min-width: 0; }
.preview-header strong, .preview-header small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.preview-header strong { font-size: .8rem; }
.preview-header small { color: var(--ink-muted); font-size: .66rem; }
.color-setting { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: end; gap: 1rem; }
.color-setting input[type="color"] { width: 68px; height: 44px; padding: .2rem; }
.color-swatch { display: grid; min-height: 44px; place-items: center; color: #fff; background: var(--preview-color, var(--brand)); border-radius: var(--radius-md); font-size: .75rem; font-weight: 700; }
.settings-team-grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; align-items: start; gap: 1.25rem; }
.team-content-stack { display: grid; gap: 1.25rem; min-width: 0; }
.section-heading--padded { margin: 0; padding: 1.1rem; }
.team-table td:first-child strong, .team-table td:first-child small { display: block; }
.team-table td:first-child small { color: var(--ink-muted); font-size: .68rem; }
.self-label { display: inline-flex; margin-top: .25rem; padding: .1rem .32rem; color: var(--ink-muted); background: var(--surface-muted); border-radius: 3px; font-size: .6rem; font-weight: 700; }
.inline-role-form { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.inline-role-form select { width: auto; min-width: 130px; min-height: 36px; padding-block: .3rem; font-size: .75rem; }
.member-state, .notification-state { display: inline-flex; align-items: center; gap: .35rem; font-size: .7rem; font-weight: 700; }
.member-state::before, .notification-state::before { width: 7px; height: 7px; background: var(--border-strong); border-radius: 50%; content: ""; }
.member-state--active { color: var(--success); }
.member-state--active::before { background: var(--success); }
.member-state--inactive { color: var(--ink-muted); }
.team-invite { position: sticky; top: 1rem; }
.team-invite > p { color: var(--ink-muted); font-size: .76rem; }
.invitation-list { display: grid; }
.invitation-list--padded { padding: 0 1.1rem 1.1rem; }
.invitation-list article { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-top: 1px solid var(--border); }
.invitation-list article:first-child { border-top: 0; }
.invitation-list article > div:first-child { display: grid; min-width: 0; }
.invitation-list strong { overflow-wrap: anywhere; font-size: .82rem; }
.invitation-list span,
.invitation-list small { color: var(--ink-muted); font-size: .7rem; }
.button-row { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.button-row form { margin: 0; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .65rem; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.simulation-banner { display: flex; align-items: flex-start; gap: .8rem; margin-bottom: 1rem; padding: .85rem 1rem; color: #713b12; background: #fffaeb; border: 1px solid #fedf89; border-left: 4px solid var(--warning); border-radius: var(--radius-md); }
.simulation-banner svg { width: 22px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.simulation-banner strong { font-size: .82rem; }
.simulation-banner p { margin: .1rem 0 0; font-size: .73rem; }
.outbox-filters { grid-template-columns: repeat(3, minmax(150px, 190px)) auto auto; justify-content: start; }
.outbox-filters > label { display: grid; gap: .25rem; }
.outbox-filters > label > span { color: var(--ink-muted); font-size: .68rem; font-weight: 700; }
.message-preview { position: relative; }
.message-preview > summary { max-width: 260px; overflow: hidden; color: var(--brand); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.message-preview[open] > div { position: absolute; z-index: 25; top: calc(100% + .4rem); right: 0; width: min(430px, 80vw); max-height: 420px; padding: 1rem; overflow-y: auto; color: var(--ink); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-overlay); }
.message-preview[open] .eyebrow { margin-top: .8rem; }
.message-preview[open] .eyebrow:first-child { margin-top: 0; }
.message-preview__body { padding: .75rem; white-space: normal; background: var(--canvas); border-radius: var(--radius-sm); font-size: .75rem; }
.outbox-table td > small { display: block; margin-top: .25rem; color: var(--ink-muted); font-size: .66rem; }
.notification-error { display: block; max-width: 240px; margin-top: .5rem; padding: .55rem .65rem; color: #7a271a; background: #fef3f2; border-radius: var(--radius-sm); }
.notification-error p { margin: .2rem 0 0; font-size: .7rem; }
.notification-state--simulated { color: var(--warning); }
.notification-state--simulated::before { background: var(--warning); }
.notification-state--sent { color: var(--success); }
.notification-state--sent::before { background: var(--success); }
.notification-state--failed { color: var(--danger); }
.notification-state--failed::before { background: var(--danger); }
.notification-state--skipped { color: var(--ink-soft); }
.notification-state--skipped::before { background: var(--ink-muted); }

/* Atelance platform, account and onboarding surfaces */
.sidebar__monogram,
.workshop-monogram { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; color: var(--brand-on); background: var(--brand); border: 1px solid rgb(255 255 255 / 28%); border-radius: var(--radius-md); font: 750 .72rem var(--font-mono); letter-spacing: .04em; }
.sidebar__monogram { color: #fff; background: #1b514e; border-color: rgb(255 255 255 / 22%); }
.mobile-brand > span:last-child { display: grid; min-width: 0; }
.mobile-brand > span:last-child strong,
.mobile-brand > span:last-child small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-brand > span:last-child small { color: var(--ink-muted); font-size: .62rem; font-weight: 600; }
.public-brand__logo--fallback { color: var(--brand-on); background: var(--brand); font: 750 .8rem var(--font-mono); }
.public-brand__logo--product { padding: 4px; background: transparent; border-color: transparent; }
.auth-forgot-link { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; margin-top: .15rem; color: var(--ink-soft); font-size: .78rem; font-weight: 650; }

.platform-body { --brand: #123f3d; --brand-hover: #0c302f; --brand-on: #fff; }
.platform-sidebar { border-right-color: rgb(255 255 255 / 14%); }
.platform-brand { display: flex; min-width: 0; align-items: center; gap: .7rem; color: #fff; text-decoration: none; }
.platform-brand:hover { color: #fff; }
.platform-brand img { width: 38px; height: 38px; flex: 0 0 auto; }
.platform-brand span { display: grid; min-width: 0; }
.platform-brand strong { font-size: 1rem; }
.platform-brand small { color: #b9cac6; font-size: .66rem; }
.platform-filters { grid-template-columns: minmax(250px, 1fr) 180px auto; margin-bottom: 1rem; }
.platform-filters > label { display: grid; gap: .3rem; }
.platform-filters > label > span { color: var(--ink-soft); font-size: .68rem; font-weight: 700; }
.platform-filters .button { align-self: end; }
.platform-body .data-table td:first-child > strong,
.platform-body .data-table td:first-child > small { display: block; }
.platform-body .data-table td:first-child > small { color: var(--ink-muted); font-size: .68rem; }
.platform-audit-preview { margin-top: 1.25rem; }
.compact-audit { display: grid; margin: 0; padding: 0; list-style: none; }
.compact-audit li { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-top: 1px solid var(--border); color: var(--ink-soft); font-size: .77rem; }
.compact-audit time { flex: 0 0 auto; color: var(--ink-muted); font: 600 .67rem var(--font-mono); }
.workshop-state { display: inline-flex; min-height: 28px; align-items: center; gap: .4rem; padding: .25rem .5rem; color: var(--ink-soft); background: var(--surface-muted); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: .7rem; font-weight: 750; }
.workshop-state::before { width: 7px; height: 7px; background: currentColor; border-radius: 50%; content: ""; }
.workshop-state--active { color: #12633f; background: #ecfdf3; border-color: #a6e8c4; }
.workshop-state--onboarding { color: #784415; background: #fff8eb; border-color: #ebca93; }
.workshop-state--suspended { color: #912018; background: #fef3f2; border-color: #f7b5ae; }
.platform-form-layout { display: grid; grid-template-columns: minmax(0, 700px) 310px; align-items: start; gap: 1.5rem; }
.platform-boundary { padding: 1.2rem; background: #edf3f1; border: 1px solid var(--border); border-left: 3px solid var(--brand); border-radius: var(--radius-md); }
.platform-boundary h2 { font-size: 1rem; }
.platform-boundary p:last-child { margin: .55rem 0 0; color: var(--ink-muted); font-size: .78rem; }
.platform-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: start; gap: 1.25rem; }
.definition-list { margin: 0; }
.definition-list > div { display: grid; grid-template-columns: minmax(130px, .45fr) 1fr; gap: 1rem; padding: .75rem 0; border-top: 1px solid var(--border); }
.definition-list dt { color: var(--ink-muted); font-size: .72rem; font-weight: 700; }
.definition-list dd { margin: 0; overflow-wrap: anywhere; font-size: .82rem; }
.lifecycle-panel { border-top: 3px solid var(--warning); }
.lifecycle-panel > p { color: var(--ink-muted); font-size: .78rem; }
.danger-zone { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #f7b5ae; }
.mailbox-stack { display: grid; gap: 1rem; }
.mailbox-stack article header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border); }
.mailbox-stack article header span { color: var(--ink-muted); font-size: .72rem; overflow-wrap: anywhere; }
.mailbox-stack pre { margin: .85rem 0 0; overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--ink-soft); font: .72rem/1.55 var(--font-mono); }

.account-body { min-height: 100vh; color: var(--ink); background: var(--ivory); }
.account-body::before { position: fixed; z-index: 100; top: 0; right: 0; left: 0; height: 4px; background: var(--copper); content: ""; }
.account-header { display: flex; width: min(100% - 2rem, 1120px); min-height: 76px; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 auto; border-bottom: 1px solid rgb(18 63 61 / 18%); }
.atelance-wordmark { display: inline-flex; min-height: 44px; align-items: center; }
.atelance-wordmark img { width: 142px; height: auto; }
.account-main { display: grid; width: min(100% - 2rem, 1120px); min-height: calc(100vh - 154px); margin: 0 auto; padding: 3rem 0; place-items: center; }
.account-main > * { width: 100%; }
.account-footer { display: flex; width: min(100% - 2rem, 1120px); min-height: 78px; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 auto; color: var(--ink-muted); border-top: 1px solid rgb(18 63 61 / 18%); font-size: .68rem; }
.account-card { width: min(100%, 610px); margin: 0 auto; padding: 2rem; background: var(--surface); border: 1px solid var(--border); border-top: 3px solid var(--brand); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.account-card > p:not(.eyebrow) { color: var(--ink-muted); }
.account-card__notice { margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--border); font-size: .7rem; text-align: center; }
.account-state { display: grid; max-width: 540px; justify-items: center; text-align: center; }
.account-state__mark { width: 54px; height: 54px; margin-bottom: 1.25rem; }
.account-state > p:not(.eyebrow) { max-width: 440px; }
.onboarding-intro { max-width: 760px; margin: 0 auto 1.5rem; text-align: center; }
.onboarding-intro > p:last-child { color: var(--ink-muted); }
.onboarding-layout { display: grid; grid-template-columns: minmax(0, 720px) 300px; align-items: start; gap: 1.5rem; }
.cobrand-preview { position: sticky; top: 1rem; padding: 1.1rem; background: var(--surface); border: 1px solid var(--border); border-top: 3px solid var(--copper); border-radius: var(--radius-md); }
.cobrand-preview > p:last-child { margin: .8rem 0 0; color: var(--ink-muted); font-size: .76rem; }

/* Print preview basic structure */
.print-body { padding: 1.5rem; background: #dfe4e6; }
.print-toolbar { display: flex; width: 210mm; max-width: 100%; justify-content: flex-end; gap: .6rem; margin: 0 auto 1rem; }
.deposit-slip { width: 210mm; min-height: 297mm; margin: 0 auto; padding: 12mm; color: #000; background: #fff; box-shadow: 0 10px 40px rgb(23 33 38 / 18%); }
.slip-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8mm; padding-bottom: 6mm; border-bottom: 2px solid #000; }
.slip-brand { display: flex; align-items: flex-start; gap: 4mm; }
.slip-brand img { width: 22mm; max-height: 18mm; object-fit: contain; }
.slip-monogram { display: grid; width: 18mm; height: 18mm; flex: 0 0 auto; place-items: center; color: #fff; background: #123f3d; border: 1px solid #000; font: 700 11pt var(--font-mono); }
.slip-brand h1 { margin: 0; color: #000; font-size: 19pt; }
.slip-brand address { display: grid; font-size: 8pt; }
.slip-reference { display: grid; justify-items: end; }
.slip-reference > span { font-size: 9pt; font-weight: 700; text-transform: uppercase; }
.slip-reference strong { margin: 1mm 0; font-size: 15pt; }
.slip-reference time { font-size: 8pt; }
.slip-access { display: grid; grid-template-columns: 1fr 40mm; align-items: center; gap: 8mm; margin: 7mm 0; padding: 5mm; border: 1.5px solid #000; }
.slip-kicker { margin: 0 0 1mm; font-size: 8pt; font-weight: 700; text-transform: uppercase; }
.slip-access h2 { margin: 0 0 1.5mm; color: #000; font-size: 15pt; }
.slip-access p:not(.slip-kicker) { max-width: 110mm; margin: 0; font-size: 8.5pt; }
.slip-url { display: block; max-width: 120mm; margin-top: 2mm; font-family: var(--font-mono); font-size: 6.5pt; overflow-wrap: anywhere; }
.slip-qr { display: grid; place-items: center; }
.slip-qr svg { width: 38mm; height: 38mm; }
.slip-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6mm; }
.slip-grid section, .slip-description { padding: 4mm; border: 1px solid #000; }
.slip-grid h2, .slip-description h2 { margin: 0 0 3mm; color: #000; font-family: var(--font-body); font-size: 9pt; text-transform: uppercase; }
.slip-grid dl, .slip-description dl { margin: 0; }
.slip-grid dl > div, .slip-description dl > div { display: grid; grid-template-columns: 28mm 1fr; gap: 2mm; padding: 1.5mm 0; border-top: 1px solid #aaa; font-size: 8pt; }
.slip-grid dt, .slip-description dt { font-weight: 700; }
.slip-grid dd, .slip-description dd { margin: 0; overflow-wrap: anywhere; }
.slip-description { margin-top: 6mm; }
.slip-description dl > div { grid-template-columns: 35mm 1fr; }
.slip-notice { display: flex; gap: 3mm; margin-top: 5mm; padding: 3mm; border: 1px solid #000; font-size: 7.5pt; }
.slip-notice p { margin: 0; }
.signature-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 4mm; margin-top: 6mm; }
.signature-grid > div { min-height: 25mm; padding: 2mm; border: 1px solid #000; }
.signature-grid span { font-size: 7pt; font-weight: 700; text-transform: uppercase; }
.slip-footer { display: flex; justify-content: space-between; gap: 4mm; margin-top: 5mm; padding-top: 2mm; border-top: 1px solid #000; font-size: 6.5pt; }

/* Responsive */
@media (max-width: 1199px) {
  .filter-panel { grid-template-columns: minmax(240px, 1.4fr) repeat(2, minmax(130px, .6fr)) auto; }
  .filter-fields label:nth-child(3), .check-filter { display: none; }
  .repair-create__grid { grid-template-columns: minmax(0, 1fr) 250px; }
}

@media (max-width: 1023px) {
  .app-shell { grid-template-columns: 72px minmax(0, 1fr); }
  .sidebar { width: 72px; }
  .sidebar__top { justify-content: center; padding-inline: .75rem; }
  .sidebar__brand > span:last-child, .sidebar__label, .nav-item > span, .account-copy { display: none; }
  .platform-brand span { display: none; }
  .platform-brand img { width: 44px; height: 44px; }
  .sidebar__nav { padding-inline: .6rem; }
  .nav-item { justify-content: center; padding-inline: .6rem; }
  .sidebar__account { grid-template-columns: 1fr; justify-items: center; padding-inline: .5rem; }
  .sidebar__account form { display: none; }
  .app-main { padding: 1.5rem; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .attention-panel { order: -1; }
  .attention-list { grid-template-columns: repeat(2, 1fr); }
  .metric-strip { grid-template-columns: repeat(5, minmax(130px, 1fr)); overflow-x: auto; }
  .metric-strip a { min-width: 130px; }
  .repair-create__grid, .editor-layout { grid-template-columns: 1fr; }
  .deposit-summary, .editor-actions { position: static; }
  .deposit-summary { display: none; }
  .detail-grid, .detail-grid--wide { grid-template-columns: minmax(0, 1fr) 280px; }
  .quote-line { grid-template-columns: minmax(170px, 2fr) 65px 90px 75px 36px; }
}

@media (max-width: 767px) {
  html { scroll-padding-top: 68px; }
  .app-shell { display: block; }
  .mobile-header { position: sticky; z-index: 35; top: 0; display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: .5rem; padding: .45rem .7rem; background: var(--surface); border-bottom: 1px solid var(--border); }
  .mobile-brand { display: flex; min-width: 0; align-items: center; gap: .5rem; color: var(--ink); font-family: var(--font-heading); font-weight: 700; text-decoration: none; }
  .mobile-brand img { width: 32px; height: 32px; border-radius: 6px; }
  .mobile-brand > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sidebar { position: fixed; z-index: 60; inset: 0 auto 0 0; width: min(86vw, 290px); height: 100dvh; transform: translateX(-105%); transition: transform .2s ease; }
  .sidebar.is-open { transform: translateX(0); }
  .sidebar__top { justify-content: flex-start; }
  .sidebar__brand > span:last-child, .sidebar__label, .nav-item > span, .account-copy { display: grid; }
  .platform-brand span { display: grid; }
  .sidebar__close { display: grid; }
  .sidebar__nav { padding-inline: .7rem; }
  .nav-item { justify-content: flex-start; padding-inline: .75rem; }
  .sidebar__account { grid-template-columns: 36px minmax(0, 1fr) auto; justify-items: stretch; padding-inline: 1rem; }
  .sidebar__account form { display: block; }
  .app-main { min-height: calc(100vh - 56px); padding: 1rem; }
  .page-header { align-items: stretch; gap: 1rem; }
  .page-header:not(.repair-header) { flex-direction: column; }
  .page-header > .button { width: 100%; }
  .time-target { display: none; }
  .metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .metric-strip a { min-width: 0; min-height: 74px; }
  .metric-strip a + a { border-left: 0; }
  .metric-strip a:nth-child(even) { border-left: 1px solid var(--border); }
  .metric-strip a:nth-child(n+3) { border-top: 1px solid var(--border); }
  .metric-strip a:last-child { grid-column: 1 / -1; border-left: 0; }
  .attention-list { grid-template-columns: 1fr; }
  .work-panel { padding: 1rem; }
  .filter-panel, .filter-panel--single { grid-template-columns: 1fr auto; align-items: center; }
  .filter-panel .search-field { grid-column: 1 / -1; }
  .filter-fields { display: none; grid-column: 1 / -1; grid-template-columns: 1fr; padding-top: .75rem; border-top: 1px solid var(--border); }
  .filter-fields.is-open { display: grid; gap: .75rem; }
  .filter-fields label:nth-child(3), .check-filter { display: flex; }
  .filter-fields label:not(.check-filter) { display: grid; }
  .mobile-filter-toggle { display: inline-flex; }
  .filter-actions { grid-column: 1 / -1; flex-wrap: wrap; }
  .view-switch { grid-row: 2; grid-column: 2; }
  .repair-table thead, .customer-table thead { display: none; }
  .repair-table tbody, .repair-table tr, .repair-table td, .customer-table tbody, .customer-table tr, .customer-table td { display: block !important; width: 100%; }
  .repair-table tr, .customer-table tr { position: relative; padding: .85rem 1rem .85rem 1.15rem; border-bottom: 1px solid var(--border); }
  .repair-table tr:last-child, .customer-table tr:last-child { border-bottom: 0; }
  .repair-table td, .customer-table td { min-height: 0; padding: .2rem 0 !important; border: 0; }
  .repair-table td[data-label], .customer-table td[data-label] { display: grid !important; grid-template-columns: minmax(88px, .45fr) 1fr !important; gap: .5rem; }
  .repair-table td[data-label]::before, .customer-table td[data-label]::before { color: var(--ink-muted); content: attr(data-label); font-size: .66rem; font-weight: 700; }
  .table-action { margin-top: .5rem; text-align: left; }
  .kanban { grid-auto-columns: min(84vw, 300px); }
  .form-grid--2, .form-grid--3 { grid-template-columns: 1fr; }
  .form-grid__full { grid-column: auto; }
  .stepper { position: sticky; z-index: 20; top: 64px; }
  .stepper button { min-height: 48px; font-size: 0; }
  .stepper button > span { font-size: .7rem; }
  .stepper button.is-current { font-size: .76rem; }
  .step-actions { position: sticky; z-index: 15; bottom: 0; margin-inline: -1rem; margin-bottom: -1rem; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: var(--surface); box-shadow: 0 -8px 22px rgb(23 33 38 / 10%); }
  .step-actions .button { min-height: 44px; }
  .repair-header { align-items: flex-start; padding: .9rem .85rem .9rem 1.1rem; }
  .repair-header__actions { align-items: flex-end; }
  .repair-header__actions > .button--secondary { display: none; }
  .repair-header__actions > .button--primary { min-width: 44px; max-width: 128px; }
  .repair-header__identity > p span { display: none; }
  .detail-grid, .detail-grid--wide { grid-template-columns: 1fr; }
  .detail-sidebar { order: -1; }
  .detail-sidebar .side-panel:not(:first-child) { display: none; }
  .note-actions { grid-template-columns: 1fr; }
  .fact-list > div { grid-template-columns: 1fr; gap: .25rem; }
  .quote-line, .quote-lines--read-only .quote-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote-line--head { display: none; }
  .quote-line .form-field:first-of-type, .quote-lines--read-only .quote-line strong { grid-column: 1 / -1; }
  .quote-line .form-field label { display: block; }
  .quote-line__remove { position: absolute; right: .35rem; }
  .quote-line { position: relative; padding-top: 1rem; }
  .quote-lines--read-only .quote-line span::before { display: block; color: var(--ink-muted); content: attr(data-label); font-size: .62rem; font-weight: 700; }
  .live-totals { justify-content: space-between; gap: .5rem; }
  .quote-actions { flex-direction: column-reverse; }
  .document-row { grid-template-columns: 38px minmax(0, 1fr) auto; }
  .document-row .visibility-badge { grid-column: 2; justify-self: start; }
  .document-row .button { grid-row: 1 / span 2; grid-column: 3; }
  .public-main { padding: 1.1rem 1rem 6rem; }
  .public-header__inner { min-height: 56px; padding-inline: 1rem; }
  .public-status { display: grid; }
  .public-status__updated { white-space: normal; }
  .public-progress { padding-inline: .75rem; }
  .public-progress li strong { font-size: .64rem; }
  .decision-options { grid-template-columns: 1fr; }
  .public-gallery { grid-template-columns: repeat(2, 1fr); }
  .public-documents li { grid-template-columns: 38px minmax(0, 1fr); }
  .public-documents .button { grid-column: 2; justify-self: start; }
  .mobile-decision-bar { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: block; padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); background: rgb(255 255 255 / 96%); border-top: 1px solid var(--border); box-shadow: 0 -10px 30px rgb(23 33 38 / 12%); }
  .settings-layout, .settings-team-grid { grid-template-columns: 1fr; }
  .workshop-preview, .team-invite { position: static; }
  .workshop-preview { order: -1; }
  .color-setting { grid-template-columns: 1fr; }
  .team-table thead { display: none; }
  .team-table tbody, .team-table tr, .team-table td { display: block; width: 100%; }
  .team-table tr { padding: .85rem 1rem; border-bottom: 1px solid var(--border); }
  .team-table td { min-height: 0; padding: .25rem 0; border: 0; }
  .team-table td[data-label] { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: .5rem; }
  .team-table td[data-label]::before { color: var(--ink-muted); content: attr(data-label); font-size: .66rem; font-weight: 700; }
  .outbox-filters { grid-template-columns: 1fr 1fr; }
  .outbox-table thead { display: none; }
  .outbox-table tbody, .outbox-table tr, .outbox-table td { display: block; width: 100%; }
  .outbox-table tr { padding: .85rem 1rem; border-bottom: 1px solid var(--border); }
  .outbox-table td { min-height: 0; padding: .22rem 0; border: 0; }
  .outbox-table td[data-label] { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: .5rem; }
  .outbox-table td[data-label]::before { color: var(--ink-muted); content: attr(data-label); font-size: .66rem; font-weight: 700; }
  .message-preview[open] > div { position: fixed; inset: 70px 1rem auto; width: auto; max-height: calc(100vh - 100px); }
}

@media (max-width: 420px) {
  .app-main { padding-inline: .75rem; }
  .metric-strip a { padding: .8rem; }
  .repair-header__actions > .button--primary { padding-inline: .55rem; font-size: .72rem; }
  .public-brand > span { max-width: 190px; }
  .public-phone span { display: none; }
  .public-phone { width: 40px; justify-content: center; padding: 0; }
  .public-section, .public-progress, .public-contact, .public-cancelled { padding: 1rem; }
  .public-progress ol::before { right: 11%; left: 11%; }
  .public-progress li strong { max-width: 66px; }
  .document-state { max-width: 130px; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* --------------------------------------------------------------------------
   Precision workshop layer
   The selectors below refine the original structural primitives without
   changing the template/JavaScript contracts used by the application.
   -------------------------------------------------------------------------- */

body {
  color: var(--ink);
  background: var(--canvas);
  font-size: .9375rem;
  line-height: 1.55;
}

.app-body,
.public-body { background-image: none; }

a { color: var(--action); }
a:hover { color: var(--action-hover); }
h1 { margin-bottom: .4rem; font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2rem); font-weight: 750; line-height: 1.12; }
h2 { font-size: 1.25rem; font-weight: 720; line-height: 1.24; }
h3 { font-size: 1rem; font-weight: 700; }
.eyebrow { margin-bottom: .38rem; color: var(--ink-muted); font-size: .7rem; letter-spacing: .115em; }
.reference-link { color: var(--ink); letter-spacing: -.025em; }

.app-shell { grid-template-columns: 248px minmax(0, 1fr); }
.app-main { max-width: 1560px; padding: clamp(1.5rem, 2.3vw, 2.5rem); }
.sidebar { width: 248px; background: var(--sidebar); border-right-color: #2c5b58; }
.sidebar::after { position: absolute; top: 0; right: -1px; width: 1px; height: 96px; background: var(--copper); content: ""; }
.sidebar__top { min-height: 88px; padding: 1rem 1.1rem; border-bottom: 1px solid #2c5b58; }
.sidebar__brand { gap: .8rem; }
.sidebar__brand img { width: 42px; height: 42px; padding: 2px; object-fit: contain; background: #fff; border: 1px solid #587874; border-radius: var(--radius-md); }
.sidebar__brand strong { font-size: .95rem; line-height: 1.25; white-space: normal; }
.sidebar__brand small { margin-top: .12rem; color: #a8bbc1; font-size: .68rem; }
.sidebar__close { display: none !important; }
.sidebar__nav { gap: .2rem; padding: .75rem .75rem 1rem; }
.sidebar__label { margin: 1.3rem .75rem .45rem; color: #8fa8b0; font-size: .625rem; letter-spacing: .15em; }
.nav-item { min-height: 44px; padding: .6rem .75rem; color: #d1dde0; border-radius: var(--radius-sm); font-size: .875rem; }
.nav-item:hover { background: var(--sidebar-soft); }
.nav-item.is-active { color: #fff; background: #1d4a47; border-color: #3b6865; box-shadow: inset 3px 0 0 var(--copper); }
.nav-item svg { color: #b8cbd0; }
.nav-item.is-active svg { color: #fff; }
.sidebar__account { min-height: 80px; padding: .85rem 1rem; border-top-color: #2c5b58; }
.account-avatar { background: var(--action); border: 1px solid rgb(255 255 255 / 28%); border-radius: var(--radius-md); }
.account-copy span { color: #a8bbc1; }

.button { min-height: 44px; padding: .58rem .95rem; border-radius: var(--radius-md); font-size: .82rem; letter-spacing: -.005em; transition: background-color .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease; }
.button--primary { color: var(--action-on); background: var(--action); border-color: var(--action); box-shadow: 0 1px 1px rgb(18 49 59 / 8%); }
.button--primary:hover { color: var(--action-on); background: var(--action-hover); border-color: var(--action-hover); }
.button--secondary { border-color: var(--border-strong); box-shadow: var(--shadow-subtle); }
.button--secondary:hover { background: #f6f9fa; border-color: var(--control-border); }
.button--quiet { color: var(--ink-soft); }
.button--small { min-height: 36px; padding: .4rem .7rem; font-size: .75rem; }
.button--large { min-height: 48px; }
.icon-button { width: 44px; height: 44px; border-radius: var(--radius-md); }
.text-link { color: var(--action); font-size: .78rem; text-underline-offset: .2em; }
.text-link:hover { color: var(--action-hover); }

.page-header { position: relative; align-items: center; margin-bottom: 1.5rem; padding-bottom: 1.35rem; border-bottom: 1px solid var(--border); }
.page-header::after { position: absolute; bottom: -1px; left: 0; width: 56px; height: 2px; background: var(--ink); content: ""; }
.page-header > div > p:last-child { color: var(--ink-muted); font-size: .9rem; }
.breadcrumbs { margin-bottom: 1rem; font-size: .75rem; }
.breadcrumbs a { color: var(--ink-muted); }

.work-panel,
.side-panel,
.upload-panel,
.quote-summary,
.form-panel,
.deposit-summary,
.attention-panel {
  border-color: var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-subtle);
}
.work-panel { padding: 1.4rem; }
.section-heading { margin-bottom: 1.25rem; padding-bottom: .95rem; border-bottom: 1px solid var(--border); }
.section-heading h2 { margin-bottom: .15rem; }
.section-heading p { font-size: .78rem; }

.flash { border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.toast-region { position: fixed; z-index: 100; right: 1rem; bottom: 1rem; display: grid; gap: .5rem; width: min(360px, calc(100vw - 2rem)); pointer-events: none; }
.toast { padding: .75rem .9rem; color: #fff; background: var(--ink); border: 1px solid #31515c; border-radius: var(--radius-md); box-shadow: var(--shadow-overlay); font-size: .78rem; font-weight: 650; }
.empty-state { min-height: 260px; }
.empty-state svg { color: var(--control-border); }
.quiet-state > span { border-radius: var(--radius-md); }
.error-summary { border-radius: var(--radius-md); }

.metric-strip { margin-bottom: 1.25rem; border-top: 2px solid var(--ink); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.metric-strip a { min-height: 92px; align-items: center; padding: 1rem 1.1rem; }
.metric-strip span { align-self: center; max-width: 9rem; font-size: .73rem; line-height: 1.25; }
.metric-strip strong { align-self: center; color: var(--ink); font-family: var(--font-mono); font-size: 1.55rem; font-weight: 700; }
.metric-strip__alert { color: var(--danger) !important; }
.dashboard-grid { grid-template-columns: minmax(0, 1fr) 340px; gap: 1.25rem; }
.attention-panel { padding: 1.25rem; }
.attention-panel .section-heading { margin-bottom: .4rem; }
.attention-list { gap: 0; }
.attention-item { background: transparent; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; }
.attention-item:last-child { border-bottom: 0; }
.attention-item a { min-height: 82px; justify-content: center; padding: .75rem .7rem .75rem 1rem; }
.attention-item a:hover { background: #f5f8f9; }
.attention-item__top span { color: var(--warning); }

.repair-rail::before { width: 3px; background: #61727a; }
.repair-rail--awaiting_approval::before,
.repair-rail--awaiting_part::before { background: var(--warning); }
.repair-rail--diagnosing::before,
.repair-rail--repairing::before,
.repair-rail--testing::before { background: var(--action); }
.status-chip { min-height: 28px; padding: .25rem .55rem; border-radius: 4px; font-size: .68rem; white-space: normal; }
.status-chip--awaiting_approval,
.status-chip--awaiting_part { color: #8a430f; background: #fff7ed; border-color: #fdba74; }
.status-chip--diagnosing,
.status-chip--repairing,
.status-chip--testing { color: #1557a6; background: #eef5ff; border-color: #a8c8f4; }
.priority-label { margin-top: .3rem; color: #8a430f; }

.data-table { font-size: .8rem; }
.data-table th { height: 44px; padding: .65rem .85rem; background: #f5f8f9; font-size: .65rem; letter-spacing: .07em; }
.data-table td { min-height: 60px; padding: .78rem .85rem; }
.data-table tbody tr { transition: background-color .12s ease; }
.data-table tbody tr:hover { background: #f7fafb; }
.repair-row__reference { padding-left: 1.15rem !important; }
.reference-link { display: inline-flex; min-height: 32px; align-items: center; font-size: .77rem; }
.repair-table th:first-child,
.repair-table td:first-child { width: 148px; }
.repair-table .reference-link { white-space: nowrap; }
.pagination { min-height: 58px; }

.filter-panel { gap: .75rem; padding: 1rem; border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.filter-fields label > span,
.filter-panel > label > span { color: var(--ink-soft); font-size: .68rem; }
.view-switch { min-height: 44px; padding: 3px; border-radius: var(--radius-md); }
.view-switch button { min-height: 36px; border-radius: var(--radius-sm); }
.view-switch button.is-active { color: var(--action); box-shadow: var(--shadow-subtle); }
input,
select,
textarea { min-height: 44px; padding: .58rem .72rem; border-color: var(--control-border); border-radius: var(--radius-md); font-size: .875rem; }
input:hover,
select:hover,
textarea:hover { border-color: #526b75; }
input:focus,
select:focus,
textarea:focus { border-color: var(--action); outline-color: rgb(23 105 224 / 18%); }
input[type="checkbox"],
input[type="radio"] { min-height: 20px; width: 20px; height: 20px; accent-color: var(--action); }

.kanban { grid-auto-columns: 292px; gap: 1rem; }
.kanban-column { background: #e8eef1; border-radius: var(--radius-md); }
.kanban-column > header { min-height: 52px; }
.kanban-column > header h2 { font-size: .8rem; }
.kanban-column > header span { border-radius: var(--radius-sm); }
.repair-card { border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.repair-card .reference-link { min-height: 36px; }

.form-field { gap: .36rem; }
.form-field > label,
fieldset > label { color: var(--ink); font-size: .76rem; }
.field-help { font-size: .72rem; }
.form-grid { gap: 1.1rem; }
.form-panel { padding: 1.5rem; border-left: 3px solid var(--ink); }
.form-panel fieldset + fieldset { margin-top: 1.75rem; padding-top: 1.65rem; }
.form-panel fieldset > legend { margin-bottom: 1.1rem; font-size: 1.08rem; }
.checkbox-field,
.confirmation-field { font-size: .8rem; }
.editor-actions { padding: 1.1rem; border-radius: var(--radius-md); }
.security-callout { color: #284d5a; background: #eef6f8; border-color: #bfd3da; border-left: 3px solid var(--ink); border-radius: var(--radius-md); }
.security-callout--compact { background: #f4f7f8; }
.time-target { color: var(--ink); background: #eef4f6; border-color: #bfd0d6; }

.auth-body { --action: #1462e8; --action-hover: #0c4fc5; background: #092e3d; }
.auth-body::before { height: 4px; background: var(--copper); }
.auth-shell { grid-template-columns: minmax(280px, 420px) minmax(360px, 430px); justify-content: center; gap: clamp(2rem, 6vw, 6rem); padding: 3rem 2rem; }
.auth-context { display: grid; align-self: stretch; align-content: space-between; min-height: 560px; padding: 2rem 0; }
.auth-context__brand { display: flex; align-items: center; gap: .8rem; }
.auth-context__brand img { width: 48px; height: 48px; padding: 7px; object-fit: contain; background: #f7f8f5; border: 0; border-radius: 9px; }
.auth-context__brand > span { display: grid; }
.auth-context__brand strong { color: #f7f8f5; font-size: 1.25rem; }
.auth-context__brand small { color: #bcd3de; font-size: .8rem; }
.auth-context__copy { position: relative; padding: 2rem 0; }
.auth-context__copy::before,
.auth-context__copy::after { content: none; }
.auth-context__copy::before { top: 0; }
.auth-context__copy::after { bottom: 0; }
.auth-context__copy .eyebrow { margin-bottom: 1.2rem; color: #bcd3de; font-size: .66rem; font-weight: 600; letter-spacing: .13em; }
.auth-context__headline { max-width: 420px; margin-bottom: 1.3rem; color: #f7f8f5; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.3rem, 3.4vw, 3.1rem); font-weight: 400; letter-spacing: -.04em; line-height: 1.12; }
.auth-context__copy > p:last-child { max-width: 360px; margin: 0; color: #bcd3de; line-height: 1.7; }
.auth-context__checks { display: grid; margin: 0; padding: 0; list-style: none; border-top: 1px solid #355461; }
.auth-context__checks li { display: grid; grid-template-columns: 32px 1fr; min-height: 48px; align-items: center; color: #d5e1e5; border-bottom: 1px solid #355461; font-size: .8rem; font-weight: 500; }
.auth-context__checks span { color: #bc9a7e; font-size: .85rem; }
.auth-panel { width: 100%; align-self: center; padding: 1.75rem; background: #f9fbfc; border: 1px solid #d3dfe2; border-radius: 12px; box-shadow: 0 20px 50px rgb(0 18 29 / 16%); }
.auth-brand { display: none; }
.auth-copy { padding: .25rem 0 1.5rem; }
.auth-copy h1 { font-size: 1.75rem; font-weight: 650; }
.demo-account { border: 1px solid var(--border); border-radius: var(--radius-sm); }

.stepper { max-width: none; overflow: hidden; border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.stepper button { position: relative; min-height: 58px; justify-content: flex-start; padding: .7rem 1rem; }
.stepper button::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: transparent; content: ""; }
.stepper button > span { width: 26px; height: 26px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font-family: var(--font-mono); }
.stepper button.is-current { color: var(--action); background: #f3f7fd; }
.stepper button.is-current::after { background: var(--action); }
.stepper button.is-current > span,
.stepper button.is-complete > span { background: var(--action); border-color: var(--action); }
.repair-create__grid { grid-template-columns: minmax(0, 800px) 300px; gap: 1.5rem; }
.step-panel > legend > span:first-child { border-radius: var(--radius-sm); font-family: var(--font-mono); }
.step-actions { margin-top: 1.6rem; padding-top: 1.1rem; }
.deposit-summary { padding: 1.2rem; border-top: 3px solid var(--ink); border-radius: var(--radius-md); }
.deposit-summary__note { border-left: 2px solid var(--action); border-radius: var(--radius-sm); }
.initial-status { border-radius: var(--radius-md); }

.repair-header { padding: 1.15rem 1.15rem 1.15rem 1.4rem; border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.repair-header h1 { font-size: 1.65rem; }
.repair-header__identity > p { font-size: .8rem; }
.repair-header__actions { flex-wrap: wrap; justify-content: flex-end; }
.action-menu__panel { border-radius: var(--radius-md); }

.repair-process { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: center; gap: 1.4rem; margin-bottom: 1rem; padding: .95rem 1.1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.repair-process__heading .eyebrow { margin-bottom: .15rem; }
.repair-process__heading h2 { margin: 0; font-size: .88rem; letter-spacing: -.01em; }
.repair-process ol { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.repair-process ol::before { position: absolute; top: 14px; right: calc(25% - 15px); left: 15px; height: 1px; background: var(--border-strong); content: ""; }
.repair-process li { position: relative; z-index: 1; display: grid; grid-template-columns: 30px 1fr; grid-template-rows: auto auto; column-gap: .5rem; color: var(--ink-muted); }
.repair-process li > span { display: grid; grid-row: 1 / span 2; width: 30px; height: 30px; place-items: center; background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font: 650 .62rem var(--font-mono); }
.repair-process li strong { align-self: end; font-size: .73rem; }
.repair-process li small { align-self: start; font-size: .64rem; }
.repair-process li.is-complete > span { color: var(--action-on); background: var(--action); border-color: var(--action); }
.repair-process li.is-complete strong { color: var(--ink); }
.repair-process li.is-current > span { color: var(--brand-on); background: var(--brand); border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand), white 78%); }
.repair-process li.is-current strong { color: var(--ink); }
.repair-process li.is-current small { color: #8a430f; font-weight: 700; }
.repair-process--cancelled { display: flex; gap: .6rem; color: #7a271a; background: #fef3f2; border-color: #fecdca; }
.repair-process--cancelled span { color: #912018; }

.detail-tabs { gap: 0; padding: 0; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.detail-tabs a { min-height: 46px; padding: 0 1rem; border-right: 1px solid var(--border); }
.detail-tabs a:last-child { border-right: 0; }
.detail-tabs a[aria-current="page"] { color: var(--action); background: #f3f7fd; }
.detail-tabs a[aria-current="page"]::after { right: .85rem; left: .85rem; height: 2px; background: var(--action); }
.detail-grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 1.25rem; }
.detail-grid--wide { grid-template-columns: minmax(0, 1fr) 330px; }
.detail-sidebar { gap: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.detail-sidebar .side-panel { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; }
.detail-sidebar .side-panel:last-child { border-bottom: 0; }
.side-panel,
.upload-panel,
.quote-summary { padding: 1.15rem; }
.side-panel h2,
.upload-panel h2 { font-size: .82rem; letter-spacing: .01em; text-transform: uppercase; }
.compact-list > div { padding: .58rem 0; font-size: .74rem; }
.fact-list > div { padding: .9rem 0; }
.inline-editor > form { background: #f4f7f8; }
.note-actions { gap: .8rem; }
.note-composer { border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.note-composer--internal { border-top: 2px solid var(--internal); }
.note-composer--public { border-top: 2px solid var(--action); border-color: var(--border); }
.note-composer__icon { border-radius: var(--radius-sm); }
.note-composer__icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.mini-qr { padding: .75rem; background: #fff; border: 1px solid var(--border); }
.timeline::before { left: 6px; background: var(--border-strong); }
.timeline-item { padding-left: 1.7rem; }
.timeline-item__marker { left: 1px; }
.visibility-badge,
.document-state { border-radius: 4px; }

.quote-lines { border-radius: var(--radius-md); }
.quote-line--head { background: #f4f7f8; }
.live-totals { border: 1px solid var(--border); border-radius: var(--radius-md); }
.live-totals div:last-child dd,
.money-summary__total dd { color: var(--action); }
.public-comment { background: #f0f6ff; border-left-color: var(--action); }
.decision-card { border-radius: var(--radius-md); }
.document-icon { border-radius: var(--radius-sm); }

.public-body { color: var(--ink); background: #f1f4f3; }
.public-header { position: sticky; top: 0; border-bottom-color: #c9d7dc; box-shadow: 0 1px 0 rgb(18 49 59 / 3%); }
.public-header__inner { width: min(100%, 780px); min-height: 68px; }
.public-brand { color: var(--ink); font-size: .92rem; }
.public-brand__logo { display: grid; width: 40px; height: 40px; flex: 0 0 auto; padding: 2px; place-items: center; object-fit: contain; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); }
.public-brand__logo.public-brand__logo--fallback { color: var(--brand-on); background: var(--brand); }
.public-phone { min-height: 44px; color: var(--action); border-color: #9fc0ef; border-radius: var(--radius-md); }
.public-main { width: min(100%, 780px); padding: 1.75rem 1.25rem 3.5rem; }
.public-repair { gap: 1rem; }
.public-repair__intro { padding: .35rem .15rem .65rem; }
.public-repair__intro h1 { font-size: 1.45rem; letter-spacing: -.04em; }
.public-repair__intro > p:last-child { font-size: .92rem; }
.public-status { min-height: 142px; align-items: center; padding: 1.35rem 1.25rem 1.35rem 1.55rem; border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.public-status::before { width: 5px; }
.public-status h2 { max-width: 30rem; font-size: clamp(1.4rem, 4vw, 1.8rem); }
.public-status div > span { letter-spacing: .08em; }
.public-status__updated { align-self: flex-start; padding: .3rem .5rem; background: #f4f7f8; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.public-progress,
.public-section,
.public-contact,
.public-cancelled { padding: 1.35rem; border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
.public-progress { border-top: 2px solid var(--ink); }
.public-progress h2 { margin-bottom: 1.2rem; font-size: .82rem; letter-spacing: .01em; text-transform: uppercase; }
.public-progress ol::before { top: 16px; right: calc(25% - 17px); left: 17px; height: 1px; background: var(--border-strong); }
.public-progress li { grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: .5rem; justify-items: start; text-align: left; }
.public-progress li > span { grid-row: 1 / span 2; width: 34px; height: 34px; border-radius: var(--radius-sm); font: 650 .64rem var(--font-mono); }
.public-progress li > div { display: grid; align-self: center; }
.public-progress li strong { color: var(--ink-muted); font-size: .72rem; }
.public-progress li small { font-size: .62rem; }
.public-progress li.is-complete > span { color: var(--action-on); background: var(--action); border-color: var(--action); }
.public-progress li.is-complete strong,
.public-progress li.is-current strong { color: var(--ink); }
.public-progress li.is-current > span { color: var(--brand-on); background: var(--brand); border-color: var(--brand); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand), white 76%); }
.public-progress li.is-current small { color: #8a430f; font-weight: 700; }
.public-progress__next { margin: 1.2rem 0 0; padding: .85rem 1rem; color: var(--ink-soft); background: #f3f7f8; border-left: 3px solid var(--ink); font-size: .76rem; }
.public-section__heading { margin-bottom: 1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--border); }
.public-quote { border-top: 3px solid var(--action); }
.public-quote__action { display: none; margin: -.2rem 0 1rem; }
.public-quote-line { padding: .85rem 0; }
.public-totals > div:last-child dd { color: var(--action); }
.decision-options label { min-height: 72px; border-color: var(--control-border); border-radius: var(--radius-md); }
.decision-options label:has(input:checked) { background: #f0f6ff; border-color: var(--action); box-shadow: inset 3px 0 0 var(--action); }
.decision-receipt { border-radius: var(--radius-md); }
.decision-receipt > span { border-radius: var(--radius-sm); }
.public-timeline::before { background: var(--border-strong); }
.public-timeline__marker { border-color: var(--action); }
.public-gallery img { border-radius: var(--radius-md); }
.public-contact { border-top: 3px solid var(--ink); }
.mobile-decision-bar .button { box-shadow: 0 8px 24px rgb(18 49 59 / 20%); }
.mobile-decision-bar.is-suppressed { display: none; }

.settings-tabs { gap: 0; padding: 0; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.settings-tabs a { padding: 0 1rem; border-right: 1px solid var(--border); }
.settings-tabs a:last-child { border-right: 0; }
.settings-tabs a[aria-current="page"] { color: var(--action); background: #f3f7fd; }
.settings-tabs a[aria-current="page"]::after { right: .8rem; left: .8rem; height: 2px; background: var(--action); }

.billing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.key-facts { display: grid; gap: 0; margin: 0 0 1.25rem; }
.key-facts > div { display: grid; grid-template-columns: minmax(130px, .8fr) minmax(0, 1.2fr); gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--border); }
.key-facts dt { color: var(--ink-muted); font-size: .78rem; font-weight: 700; }
.key-facts dd { margin: 0; color: var(--ink); font-weight: 650; }
.stacked-form { display: grid; gap: .8rem; margin-top: 1rem; }

@media (max-width: 760px) {
  .billing-grid { grid-template-columns: 1fr; }
  .key-facts > div { grid-template-columns: 1fr; gap: .2rem; }
}
.workshop-preview { border-top: 3px solid var(--ink); border-radius: var(--radius-md); }
.color-swatch { border-radius: var(--radius-md); }
.self-label { border-radius: var(--radius-sm); }
.simulation-banner { color: #713b12; border-left-color: var(--warning); border-radius: var(--radius-md); }

@media (max-width: 1199px) {
  .filter-panel { grid-template-columns: minmax(230px, 1.35fr) repeat(2, minmax(130px, .65fr)); }
  .filter-fields label:nth-child(3),
  .check-filter { display: flex; }
  .filter-fields label:nth-child(3) { display: grid; }
  .filter-actions { grid-column: 1 / span 2; }
  .view-switch { justify-self: end; }
}

@media (max-width: 1023px) {
  .app-shell { grid-template-columns: 76px minmax(0, 1fr); }
  .sidebar { width: 76px; }
  .sidebar::after { height: 88px; }
  .sidebar__top { padding-inline: .85rem; }
  .sidebar__brand img { width: 44px; height: 44px; }
  .sidebar__nav { padding-inline: .65rem; }
  .sidebar__account { display: flex; flex-direction: column; gap: .45rem; padding-inline: .65rem; }
  .sidebar__account form { display: block; }
  .sidebar__account .icon-button { color: #d1dde0; }
  .app-main { padding: 1.5rem; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .attention-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1rem; }
  .repair-create__grid,
  .editor-layout { grid-template-columns: 1fr; }
  .deposit-summary,
  .editor-actions { position: static; }
  .deposit-summary { display: none; }
}

@media (max-width: 899px) {
  .detail-grid,
  .detail-grid--wide,
  .settings-layout,
  .settings-team-grid { grid-template-columns: 1fr; }
  .platform-form-layout,
  .platform-detail-grid,
  .onboarding-layout { grid-template-columns: 1fr; }
  .platform-boundary,
  .cobrand-preview { position: static; }
  .quote-summary,
  .workshop-preview,
  .team-invite { position: static; }
  .detail-sidebar { display: contents; }
  .detail-sidebar > .side-panel:first-child { order: -1; }
  .detail-sidebar > .side-panel { order: 1; border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
  .detail-main { order: 0; }
  .repair-process { grid-template-columns: 1fr; gap: .8rem; }
  .filter-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-panel .search-field { grid-column: 1 / -1; }
  .filter-actions { grid-column: 1; }
  .view-switch { grid-column: 2; justify-self: end; }
}

@media (max-width: 767px) {
  html { scroll-padding-top: 72px; }
  body { font-size: .9375rem; }
  .mobile-header { min-height: 60px; padding: .5rem .75rem; box-shadow: 0 1px 0 rgb(18 49 59 / 4%); }
  .mobile-brand { color: var(--ink); font-size: .82rem; }
  .mobile-brand img { width: 34px; height: 34px; padding: 2px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); }
  .mobile-brand .workshop-monogram { width: 34px; height: 34px; }
  .sidebar { width: min(88vw, 310px); }
  .sidebar__close { display: grid !important; }
  .sidebar__account { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; }
  .app-main { min-height: calc(100vh - 60px); padding: 1rem; }
  .page-header { gap: .9rem; padding-bottom: 1rem; }
  .page-header > .button { min-height: 48px; }
  .page-header > div > p:last-child { font-size: .82rem; }
  .breadcrumbs { margin-bottom: .8rem; }
  .button--small,
  .icon-button,
  .view-switch button,
  .flash__close { min-height: 44px; }
  .button--small { padding-inline: .75rem; }
  .platform-filters { grid-template-columns: 1fr; align-items: stretch; }
  .platform-filters .search-field { grid-column: auto; }
  .platform-filters .button { width: 100%; }
  .platform-body .data-table thead { display: none; }
  .platform-body .data-table tbody,
  .platform-body .data-table tr,
  .platform-body .data-table td { display: block; width: 100%; }
  .platform-body .data-table tr { padding: .85rem 1rem; border-bottom: 1px solid var(--border); }
  .platform-body .data-table td { min-height: 0; padding: .25rem 0; border: 0; }
  .platform-body .data-table td[data-label] { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: .5rem; }
  .platform-body .data-table td[data-label]::before { color: var(--ink-muted); content: attr(data-label); font-size: .64rem; font-weight: 700; }
  .platform-body .data-table .table-action { padding-top: .65rem; }
  .platform-body .data-table .table-action .button { width: 100%; }
  .invitation-list article,
  .mailbox-stack article header { align-items: stretch; flex-direction: column; }
  .button-row { justify-content: flex-start; }
  .inline-role-form { align-items: stretch; flex-direction: column; }
  .inline-role-form select,
  .inline-role-form .button { width: 100%; min-height: 44px; }
  .account-header { min-height: 68px; }
  .atelance-wordmark img { width: 126px; }
  .account-main { min-height: calc(100vh - 138px); padding: 1.5rem 0; }
  .account-card { padding: 1.35rem; }
  .account-footer { min-height: 70px; align-items: flex-start; flex-direction: column; justify-content: center; gap: .2rem; }
  .onboarding-intro { text-align: left; }

  .metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-strip a { min-height: 82px; padding: .85rem .9rem; }
  .metric-strip span { font-size: .7rem; }
  .metric-strip strong { font-size: 1.4rem; }
  .attention-list { grid-template-columns: 1fr; }
  .attention-item a { min-height: 76px; }
  .work-panel { padding: 1.05rem; }
  .work-panel--flush { padding: 0; }
  .section-heading { align-items: flex-start; gap: .75rem; }

  .filter-panel,
  .filter-panel--single { grid-template-columns: 1fr auto; padding: .85rem; }
  .filter-panel .search-field { grid-column: 1 / -1; }
  .filter-fields { display: none; }
  .filter-fields.is-open { display: grid; grid-column: 1 / -1; grid-template-columns: 1fr; }
  .filter-fields label:nth-child(3),
  .check-filter { display: flex; }
  .filter-fields label:nth-child(3) { display: grid; }
  .filter-actions { grid-column: 1 / -1; }
  .view-switch { grid-row: 2; grid-column: 2; }

  .repair-table tbody,
  .repair-table tr,
  .repair-table td { display: grid !important; width: 100%; }
  .repair-table tr { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .15rem .75rem; padding: .8rem .9rem .9rem 1.15rem; }
  .repair-table td { min-width: 0; min-height: 0; padding: 0 !important; border: 0; overflow-wrap: anywhere; }
  .repair-table td:first-child { width: 100%; }
  /* On mobile the rail belongs to the whole row, outside the text columns. */
  .repair-row__reference { position: static; grid-row: 1; grid-column: 1; }
  .repair-row__reference::before { top: .8rem; bottom: .9rem; left: 0; border-radius: 2px; }
  .repair-table .reference-link { min-height: 44px; font-size: .8rem; }
  .repair-table td[data-label="Statut"] { display: flex !important; grid-row: 1; grid-column: 2; align-items: center; justify-self: end; }
  .repair-table td[data-label="Statut"]::before { display: none; }
  .repair-table td[data-label="Client et appareil"] { display: block !important; grid-column: 1 / -1; padding: .15rem 0 .65rem !important; }
  .repair-table td[data-label="Client et appareil"]::before { display: none; }
  .repair-table td[data-label="Client et appareil"] strong { font-size: .84rem; }
  .repair-table td[data-label="Client et appareil"] span { font-size: .75rem; }
  .repair-table td[data-label="Technicien"],
  .repair-table td[data-label="Échéance"] { display: grid !important; grid-template-columns: 1fr !important; gap: .12rem; padding-top: .65rem !important; border-top: 1px solid var(--border); font-size: .75rem; }
  .repair-table td[data-label="Technicien"] { grid-column: 1; }
  .repair-table td[data-label="Échéance"] { grid-column: 2; min-width: 96px; }
  .repair-table td[data-label]::before { font-size: .62rem; letter-spacing: .04em; text-transform: uppercase; }

  .customer-table tr { padding: 1rem; }
  .customer-table td[data-label] { grid-template-columns: 96px minmax(0, 1fr) !important; font-size: .78rem; }
  .customer-table td[data-label]::before { font-size: .64rem; }

  .form-panel { padding: 1.1rem; border-left-width: 2px; }
  .form-grid { gap: 1rem; }
  .stepper { position: sticky; top: 68px; }
  .stepper button { min-height: 52px; justify-content: center; padding: .55rem; font-size: 0; }
  .stepper button.is-current { font-size: .74rem; }
  .step-actions { position: static; display: grid; grid-template-columns: auto minmax(0, 1fr); margin: 1.4rem 0 0; padding: 1rem 0 0; box-shadow: none; }
  .step-actions > span:empty { display: none; }
  .step-actions .button:last-child { justify-self: end; }

  .repair-header { display: grid; gap: 1rem; padding: 1rem 1rem 1rem 1.25rem; }
  .repair-header__title { align-items: flex-start; }
  .repair-header h1 { font-size: 1.35rem; }
  .repair-header__actions { width: 100%; justify-content: stretch; }
  .repair-header__actions > .button--secondary { display: inline-flex; }
  .repair-header__actions > .button { flex: 1 1 auto; }
  .repair-header__actions > .button--primary { max-width: none; }
  .repair-process { padding: 1rem; }
  .repair-process ol { grid-template-columns: 1fr; padding: 0; overflow: visible; }
  .repair-process ol::before { top: 15px; right: auto; bottom: 15px; left: 15px; width: 1px; height: auto; }
  .repair-process li { min-height: 54px; grid-template-columns: 30px minmax(0, 1fr); align-content: start; }
  .repair-process li strong { align-self: end; font-size: .76rem; }
  .repair-process li small { font-size: .68rem; }
  .detail-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; overflow: visible; }
  .detail-tabs a { min-height: 54px; justify-content: center; padding-inline: .35rem; font-size: .68rem; line-height: 1.15; text-align: center; white-space: normal; }
  .detail-sidebar { display: contents; }
  .detail-sidebar > .side-panel:first-child { order: -1; }
  .detail-sidebar > .side-panel { order: 1; border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-subtle); }
  .detail-sidebar > .side-panel:not(:first-child) { display: block; }
  .detail-main { order: 0; }
  .note-actions { grid-template-columns: 1fr; }
  .note-composer > summary { min-height: 72px; }
  .fact-list > div { grid-template-columns: 1fr; }
  .quote-line,
  .quote-lines--read-only .quote-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .document-row { grid-template-columns: 38px minmax(0, 1fr); }
  .document-row .visibility-badge { grid-column: 2; }
  .document-row .button { grid-row: auto; grid-column: 2; justify-self: start; }

  .auth-shell { display: grid; grid-template-columns: 1fr; min-height: 100vh; padding: 1.25rem 1rem; }
  .auth-context { display: none; }
  .auth-panel { max-width: 430px; padding: 1.4rem; }
  .auth-brand { display: flex; }
  .auth-copy { padding: 1.35rem 0 1.1rem; }

  .public-header__inner { min-height: 60px; padding-inline: 1rem; }
  .public-main { padding: 1.15rem 1rem 6.25rem; }
  .public-status { display: grid; min-height: 0; gap: .85rem; padding: 1.15rem 1rem 1.15rem 1.3rem; }
  .public-status__updated { justify-self: start; }
  .public-progress { padding: 1.15rem; }
  .public-progress ol { display: grid; grid-template-columns: 1fr; gap: 0; }
  .public-progress ol::before { top: 17px; right: auto; bottom: 17px; left: 16px; width: 1px; height: auto; }
  .public-progress li { grid-template-columns: 34px minmax(0, 1fr); min-height: 58px; align-items: start; }
  .public-progress li strong { font-size: .78rem; }
  .public-progress li small { font-size: .68rem; }
  .public-progress__next { margin-top: .8rem; }
  .public-section,
  .public-contact,
  .public-cancelled { padding: 1.1rem; }
  .public-section__heading { display: grid; }
  .public-quote__action { display: inline-flex; }
  .public-quote-line { gap: .65rem; }
  .decision-options { grid-template-columns: 1fr; }
  .decision-options label { min-height: 76px; }
  .public-documents li { grid-template-columns: 38px minmax(0, 1fr); }
  .public-documents .button { grid-column: 2; min-height: 44px; }
  .mobile-decision-bar { padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); }

  .workshop-preview { order: -1; }
  .team-table td[data-label],
  .outbox-table td[data-label] { font-size: .78rem; }
  .team-table td[data-label]::before,
  .outbox-table td[data-label]::before { font-size: .64rem; }
}

@media (max-width: 420px) {
  .app-main { padding-inline: .75rem; }
  .page-header h1 { font-size: 1.65rem; }
  .metric-strip a { padding: .8rem; }
  .repair-header__actions { display: grid; grid-template-columns: 1fr 1fr auto; }
  .repair-header__actions > .button { padding-inline: .55rem; font-size: .72rem; }
  .repair-process ol { grid-template-columns: 1fr; }
  .public-brand > span { max-width: 205px; }
  .public-phone { width: 44px; justify-content: center; padding: 0; }
  .public-phone span { display: none; }
  .status-chip { font-size: .7rem; }
  .repair-table td[data-label="Statut"] { max-width: 145px; }
  .public-section,
  .public-progress,
  .public-contact,
  .public-cancelled { padding: 1rem; }
}

/* Atelier signature: calm blue workspace; workshop identity remains configurable. */
.app-body .page-header { padding-bottom: 1.25rem; }
.app-body .page-header h1 { font-size: clamp(1.9rem, 2.6vw, 2.55rem); letter-spacing: -.045em; }
.app-body .page-header .eyebrow { margin-bottom: .65rem; color: var(--ink-muted); letter-spacing: .13em; font-weight: 600; }
.app-body .button--primary { background: var(--action); border-color: var(--action); color: #fff; }
.app-body .button--primary:hover { background: var(--action-hover); border-color: var(--action-hover); }
.app-body .nav-item.is-active { background: #174353; border-color: #386578; box-shadow: inset 3px 0 0 #a3c7d7; }
.sidebar__top { border-bottom: 1px solid #294a58; }
.sidebar__brand strong { font-size: 1.15rem; }
.app-body .app-main { padding: 2.25rem 2.5rem; }
.app-body .repair-header h1 { font-size: 1.9rem; }
.public-body { background: #e4eef1; }
.device-code-control { display: flex; align-items: stretch; gap: .5rem; }
.device-code-control input { min-width: 0; flex: 1; }
.device-code-control button { flex: 0 0 auto; min-height: 44px; }
.device-code-field { padding: 1rem; background: #eaf1f4; border: 1px solid #c6d9e1; border-radius: var(--radius-md); }
.device-code-field .field-help { font-size: .8rem; }
@media (max-width: 760px) {
  .app-body .app-main { padding: 1.35rem 1rem; }
  .app-body .page-header h1 { font-size: 1.95rem; }
  .device-code-control input { font-size: 16px; }
}

.application-legal-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .25rem 1rem;
  width: 100%;
  font-size: .875rem;
}
.application-legal-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-underline-offset: .2em;
}