/* Operator workspaces. Shared tokens keep these panels aligned with the storefront;
   body scoping prevents dashboard density from changing customer checkout. */
.operator-page { background: var(--bg); }
.operator-page main.container.page { padding-top: var(--space-6); }
.operator-page .topbar { background: var(--card); backdrop-filter: none; box-shadow: none; }
.operator-page .topbar .inner { gap: var(--space-5); padding-block: var(--space-2); }
.operator-page .brand { font-size: var(--text-xl); }
.operator-page .nav { gap: var(--space-1); }
.operator-page .nav > a,
.operator-page .nav-drop > summary { font-size: var(--text-sm); font-weight: var(--fw-semibold); padding: var(--space-3); }
.operator-page .nav > a.active,
.operator-page .nav-drop > summary.active { background: var(--brand-tint); color: var(--brand-dark); }
.operator-page .topbar-actions { gap: var(--space-2); }
.operator-page .topbar-actions .btn { font-size: var(--text-sm); }
.operator-page .manage-context { background: var(--tint-row); }
.operator-page .manage-context-inner { padding-block: var(--space-3); }
.operator-page .manage-context-identity > .ico {
    box-sizing: content-box; padding: var(--space-2); border: 1px solid var(--line);
    border-radius: var(--r-md); background: var(--card); color: var(--ink-soft);
}
.operator-page .manage-context-identity span { font-size: var(--text-xs); line-height: 1.3; }
.operator-page .manage-context-identity strong { font-weight: var(--fw-semibold); }
.operator-page .manage-context-switch select { background-color: var(--card); min-height: 2.75rem; }
.operator-inline-form { display: inline; }

/* Titles and actions follow the same baseline on every operational surface. */
.operator-page-head,
.operator-page .phead,
.operator-page .dash-head {
    display: flex; justify-content: space-between; align-items: center; gap: var(--space-5);
    flex-wrap: wrap; margin-bottom: var(--space-5);
}
.operator-page-head > div,
.operator-page .phead-titles,
.operator-page .dash-head > div:first-child { min-width: 0; flex: 1 1 18rem; }
.operator-page h1 { font-size: var(--text-2xl); line-height: 1.2; letter-spacing: -.035em; overflow-wrap: anywhere; }
.operator-page-head h1,
.operator-page .phead-h1,
.operator-page .dash-head h1 { margin: 0; }
.operator-page-head p:not(.operator-eyebrow),
.operator-page .phead-sub,
.operator-page .dash-head > div > p:not(.operator-eyebrow) {
    font-size: var(--text-sm); color: var(--muted); margin: var(--space-2) 0 0; max-width: 48rem;
}
.operator-page .operator-eyebrow { margin: 0 0 var(--space-2); font-size: var(--text-xs); font-weight: var(--fw-semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.operator-header-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-left: auto; }
.operator-header-actions form { margin: 0; }
.operator-page .btn { min-height: 2.75rem; border-radius: var(--r-md); font-size: var(--text-sm); font-weight: var(--fw-semibold); box-shadow: none; }
.operator-page .btn-primary:hover { box-shadow: var(--shadow-sm); }
.operator-page .btn-lg { padding: var(--space-3) var(--space-5); font-size: var(--text-base); }
.operator-page .icon-btn,
.operator-page .icon-btn-sm { min-width: 2.75rem; min-height: 2.75rem; }
.operator-page .badge { font-weight: var(--fw-semibold); letter-spacing: 0; }
.operator-page .card { border-color: var(--line); box-shadow: var(--shadow-sm); padding: var(--space-5); border-radius: var(--r-lg); }
.operator-page .card + .card { margin-top: var(--space-5); }
.operator-page .order-side > .card + .card { margin-top: 0; }
.operator-page .card h2,
.operator-page .card h3 { font-size: var(--text-lg); line-height: 1.4; letter-spacing: -.015em; }
.operator-page .card-head { gap: var(--space-3); margin-bottom: var(--space-5); align-items: center; }
.operator-page .card-head h2 { font-size: var(--text-base); }
.operator-page .card > .help { max-width: 48rem; margin-bottom: var(--space-5); }
.operator-page .dash-activate { border-left: var(--space-1) solid var(--brand); background: var(--card); }
.operator-page .dash-activate .da-main { flex: 1 1 22rem; }
.operator-page .dash-activate .da-main p { font-size: var(--text-sm); max-width: 44rem; }
.operator-page .kpis { gap: var(--space-4); }
.operator-page .stat {
    border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: none;
    padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3);
    background: var(--card); min-width: 0;
}
.operator-page .stat:hover { border-color: var(--line-strong); box-shadow: var(--shadow-sm); text-decoration: none; }
.operator-page .stat .l { order: -1; color: var(--muted); font-size: var(--text-sm); font-weight: var(--fw-medium); }
.operator-page .stat .n { font-size: var(--text-2xl); line-height: 1.2; letter-spacing: -.035em; overflow-wrap: anywhere; }
.operator-page .checklist li { padding-block: var(--space-4); gap: var(--space-4); }
.operator-page .checklist .btn-primary { background: var(--card); color: var(--brand-dark); border-color: var(--line-strong); }
.operator-page .checklist .btn-primary:hover { background: var(--brand-tint); border-color: var(--brand); }

/* Settings are document-like sections with calm controls and a compact save dock. */
.operator-page .subnav {
    padding: var(--space-1); gap: var(--space-1); margin-bottom: var(--space-6);
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
}
.operator-page .subnav a { min-height: 2.75rem; border-color: transparent; border-radius: var(--r-md); padding: var(--space-2) var(--space-3); font-size: var(--text-sm); }
.operator-page .subnav a.active { border-color: transparent; background: var(--brand-tint); }
.operator-page .form-row { margin-bottom: var(--space-5); }
.operator-page .form-row:last-child { margin-bottom: 0; }
.operator-page .form-row label { font-size: var(--text-sm); font-weight: var(--fw-semibold); color: var(--ink-soft); margin-bottom: var(--space-2); }
.operator-page :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input[type="time"], input[type="date"], input[type="datetime-local"], select, textarea) {
    border-color: var(--line-strong); border-radius: var(--r-md); background-color: var(--card); box-shadow: none;
}
.operator-page :is(input, select, textarea):focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.operator-page .help { line-height: 1.6; color: var(--muted); }
.operator-page .operator-section-head { border-bottom: 1px solid var(--line); margin-bottom: var(--space-5); padding-bottom: var(--space-4); }
.operator-page .operator-section-head h3 { margin-bottom: var(--space-1); }
.operator-page .operator-section-head .help { margin: 0; max-width: 48rem; }
.operator-page .upload-tile { box-shadow: none; background: var(--tint-row); border-color: var(--line); }
.operator-page .upload-preview { background: var(--card); }
.operator-page .save-bar { border-radius: var(--r); box-shadow: var(--shadow); padding: var(--space-3) var(--space-4); }
.operator-page .hours-table th { font-size: var(--text-sm); }
.operator-page .hours-table td { padding-block: var(--space-4); }
.operator-page .hours-table input[type="time"] { min-height: calc(var(--space-6) + var(--space-3)); }

/* Menu and kitchen: retain all density/urgency contracts, soften the container chrome. */
.operator-page .mgrid { gap: var(--space-5); }
.operator-page :is(.crail, .mcard, .board-card, .board-list) { border-color: var(--line); box-shadow: var(--shadow-sm); border-radius: var(--r); }
.operator-page .crail-head { background: var(--tint-row); padding: var(--space-4); font-size: var(--text-xs); }
.operator-page .crail-row { padding: var(--space-3) var(--space-4); }
.operator-page .crail-row.is-active { box-shadow: inset var(--space-1) 0 0 var(--brand); }
.operator-page .mhead { padding: var(--space-4); gap: var(--space-2); }
.operator-page .mhead-title { font-size: var(--text-lg); }
.operator-page .mrow-name { font-size: var(--text-base); }
.operator-page .mcols,
.operator-page .board-cols { background: var(--tint-row); color: var(--muted); letter-spacing: .025em; }
.operator-page .mempty,
.operator-page .board-empty { padding: var(--space-8) var(--space-5); font-size: var(--text-sm); }
.operator-page .board-now { padding: var(--space-5); }
.operator-page .board-clock { font-size: var(--text-2xl); }
.operator-page .board-filters { gap: var(--space-2); }
.operator-page .board-list .row-main { min-height: 3.5rem; }
/* Order identity stays readable even when the reference is a full capability ID. */
.operator-page .order-head-id { min-width: 0; max-width: 100%; flex: 1 1 21rem; }
.operator-page .order-back { display: inline-flex; align-items: center; gap: var(--space-1); min-height: calc(var(--space-6) + var(--space-3)); }
.operator-order-restaurant { display: flex; align-items: center; gap: var(--space-2); margin: var(--space-2) 0 0; color: var(--ink-soft); font-size: var(--text-sm); }
.operator-order-restaurant .ico { flex: none; }
.operator-order-restaurant strong { overflow-wrap: anywhere; font-weight: var(--fw-medium); }
.operator-order-reference { max-width: 30rem; margin-top: var(--space-3); }
.operator-order-reference > label { display: block; margin-bottom: var(--space-1); color: var(--muted); font-size: var(--text-xs); font-weight: var(--fw-medium); }
.operator-order-reference-row { display: flex; gap: var(--space-2); align-items: center; }
.operator-page .operator-order-reference textarea { flex: 1; min-width: 0; width: 100%; min-height: calc(var(--space-8) + var(--space-2)); height: calc(var(--space-8) + var(--space-2)); padding: var(--space-2) var(--space-3); resize: none; font-family: var(--font-mono); font-size: var(--text-xs); line-height: 1.5; overflow-wrap: anywhere; color: var(--ink-soft); border-color: var(--line); background: var(--tint-row); }
.operator-order-reference-row .btn { flex: none; width: calc(var(--space-6) + var(--space-3)); min-height: calc(var(--space-6) + var(--space-3)); padding: 0; }
.operator-order-reference > .help:empty { display: none; }
.operator-page .row-quick-accept { min-width: 0; }
.operator-page .row-quick-label { display: block; margin-bottom: var(--space-1); color: var(--ink-soft); font-size: var(--text-xs); font-weight: var(--fw-semibold); }
.operator-page .row-quick-accept .row-preset { width: calc(var(--space-8) + var(--space-1)); min-height: calc(var(--space-6) + var(--space-3)); padding-inline: var(--space-1); font-size: var(--text-sm); white-space: nowrap; }
.operator-page .row-grid .row-preset { font-size: var(--text-sm); white-space: nowrap; }
.operator-page .row-act > form { min-width: 0; max-width: 100%; }
.operator-page .row-act .row-go { max-width: 100%; height: auto; min-height: calc(var(--space-6) + var(--space-3)); padding: var(--space-2) var(--space-3); white-space: normal; text-align: center; line-height: 1.3; }
@media (max-width: 63.9375rem) {
    .operator-page .row-act > .row-quick-accept { flex: 1; }
    .operator-page .row-quick-accept .row-preset { width: auto; min-width: calc(var(--space-8) + var(--space-1)); }
}

/* Admin filtering stays separate from creation actions and list content. */
.operator-filterbar {
    display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2);
    margin: 0 0 var(--space-5); padding: var(--space-3); background: var(--card);
    border: 1px solid var(--line); border-radius: var(--r);
}
.operator-page .operator-filterbar input[type="search"] { flex: 1 1 18rem; width: auto; }
.operator-page .operator-filterbar select { flex: 0 1 13rem; }
.operator-page .admin-record { grid-template-columns: minmax(0, 1fr) minmax(7rem, .4fr) minmax(13rem, auto); padding-block: var(--space-5); }
.operator-page .admin-record-identity h2 { font-size: var(--text-base); margin-bottom: var(--space-2); }
.operator-page .admin-record-identity h2 a { color: var(--ink); }
.operator-page .admin-record-identity h2 a:hover { color: var(--brand-dark); }
.operator-page .admin-record-status { gap: var(--space-1); }
.operator-page .admin-record-actions { gap: var(--space-2); }
.operator-page .table th { font-size: var(--text-xs); letter-spacing: .025em; color: var(--muted); font-weight: var(--fw-semibold); }
.operator-page .table td { padding-block: var(--space-4); font-size: var(--text-sm); }
.operator-page .table td:first-child { max-width: 14rem; white-space: normal; overflow-wrap: anywhere; }
.operator-page .compact-order { padding-block: var(--space-5); }
.operator-page .compact-order-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1); }

/* Driver administration: the same readable record works at every screen width. */
.operator-driver-grid { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; gap: var(--space-5); }
.operator-driver-grid > .card + .card { margin-top: 0; }
.operator-count { padding: var(--space-1) var(--space-2); background: var(--fill-muted); border-radius: var(--r-sm); font-size: var(--text-sm); font-weight: var(--fw-semibold); font-variant-numeric: var(--num); }
.operator-driver-record + .operator-driver-record { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.operator-driver-identity { display: flex; align-items: center; gap: var(--space-3); }
.operator-driver-avatar { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 2.75rem; height: 2.75rem; border-radius: var(--r); color: var(--ink-soft); background: var(--fill-muted); }
.operator-page .operator-driver-identity h3 { font-size: var(--text-base); margin: 0; overflow-wrap: anywhere; }
.operator-record-meta { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); margin: var(--space-4) 0; font-size: var(--text-sm); }
.operator-record-meta dt { color: var(--muted); font-size: var(--text-xs); margin-bottom: var(--space-1); }
.operator-record-meta dd { margin: 0; font-variant-numeric: var(--num); }
.operator-record-actions { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; }
.operator-record-actions form { margin: 0; }
.operator-page .operator-driver-add h2 { margin-bottom: var(--space-5); }
.operator-empty { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); padding: var(--space-6) var(--space-4); text-align: center; color: var(--muted); font-size: var(--text-sm); }
.operator-empty p { max-width: 26rem; margin: 0; }
.operator-empty-icon { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: var(--r-lg); background: var(--fill-muted); color: var(--ink-soft); }

/* The delivery view uses the same white/neutral shell, with cash still prominent. */
.drv-page { background: var(--bg); }
.drv-page .drv-top { background: var(--card); color: var(--ink); border-bottom: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.drv-page .drv-top-head { padding: var(--space-4) var(--space-5); }
.drv-page .drv-top-sub { color: var(--muted); margin-top: var(--space-1); }
.drv-page .drv-refresh { color: var(--ink-soft); background: var(--tint-row); border: 1px solid var(--line); border-radius: var(--r-md); }
.drv-page .drv-refresh:hover { background: var(--fill-muted); }
.drv-page .drv-tally { border-top-color: var(--line); }
.drv-page .drv-tally-cell { color: var(--ink); padding: var(--space-3) var(--space-2); }
.drv-page .drv-tally-cell + .drv-tally-cell { border-left-color: var(--line); }
.drv-page .drv-tally-cell.is-active { background: var(--brand-tint); color: var(--brand-dark); }
.drv-page a.drv-tally-cell:hover { background: var(--tint-row); }
.drv-page .drv-tally-lab { color: var(--muted); font-weight: var(--fw-medium); margin-top: var(--space-1); }
.drv-page .drv-wrap { padding-top: var(--space-5); }
.drv-page .drv-section { scroll-margin-top: 10rem; }
.drv-page .drv-heading { padding-bottom: var(--space-3); }
.drv-page .drv-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.75rem; height: 1.75rem; padding-inline: var(--space-2); border-radius: var(--r-sm); background: var(--fill-muted); color: var(--ink-soft); font-size: var(--text-sm); }
.drv-page .drv-card { border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); margin-bottom: var(--space-4); }
.drv-page .drv-band { font-weight: var(--fw-semibold); font-size: var(--text-xs); }
.drv-page .drv-head { padding: var(--space-5) var(--space-4); }
.drv-page .drv-sub { margin-top: var(--space-1); font-size: var(--text-sm); }
.drv-page .drv-eta { background: var(--tint-row); border-color: var(--line); font-size: var(--text-sm); }
.drv-page .drv-customer { border-top: 0; padding-top: 0; }
.drv-page .drv-order-reference { padding-top: 0; padding-bottom: var(--space-3); font-size: var(--text-xs); }
.drv-page .drv-money { margin: 0 var(--space-4) var(--space-4); padding: var(--space-3); border-radius: var(--r-md); }
.drv-page .drv-money-label { font-size: var(--text-sm); }
.drv-page .drv-money-paid { background: var(--tint-row); color: var(--ink-soft); }
.drv-page .drv-money-paid > .ico { color: var(--ok); }
.drv-page .drv-route { display: flex; margin: 0 var(--space-4) var(--space-4); min-height: 2.75rem; font-size: var(--text-sm); }
.drv-page .drv-actions { padding: var(--space-4); background: var(--tint-row); }
.drv-page .drv-action { min-height: 3.25rem; font-size: var(--text-base); border-radius: var(--r-md); box-shadow: none; }
.drv-page .drv-actionform.is-delivery .checkbox { padding: var(--space-3); background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); font-size: var(--text-sm); }
.drv-page .drv-unclaim-row { padding: 0 var(--space-4) var(--space-3); background: var(--tint-row); }
.drv-page .drv-empty { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); background: var(--card); border: 1px dashed var(--line-strong); border-radius: var(--r-lg); padding: var(--space-6) var(--space-5); }
.drv-empty-icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: var(--r); background: var(--tint-row); color: var(--muted); }

/* Accounting separates order-date values from actual receipt/refund movements. */
.accounting-presets { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.accounting-presets a { padding: var(--space-2) var(--space-3); min-height: 2.75rem; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: var(--r-md); color: var(--ink-soft); background: var(--card); font-size: var(--text-sm); }
.accounting-presets a.is-active { background: var(--brand-tint); color: var(--brand-dark); border-color: var(--brand-soft); }
.accounting-filter { align-items: end; gap: var(--space-3); }
.accounting-filter label { display: block; font-size: var(--text-xs); color: var(--muted); margin-bottom: var(--space-1); }
.accounting-filter input[type="date"] { min-height: 3rem; width: 100%; padding: var(--space-3); border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--card); color: var(--ink); font: inherit; }
.accounting-timezone { display: flex; align-items: center; align-self: center; gap: var(--space-2); margin-left: auto; font-size: var(--text-sm); color: var(--muted); }
.accounting-note { max-width: 64rem; margin-bottom: var(--space-5); }
.accounting-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin: var(--space-5) 0; }
.accounting-metrics > div { min-width: 0; }
.accounting-metrics dt { color: var(--muted); font-size: var(--text-sm); margin-bottom: var(--space-2); }
.accounting-metrics dd { margin: 0; font-size: var(--text-xl); line-height: 1.35; font-weight: var(--fw-semibold); font-variant-numeric: var(--num); overflow-wrap: anywhere; }
.accounting-sales { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: var(--space-4); background: var(--tint-row); border-radius: var(--r); }
.accounting-sales dd { font-size: var(--text-2xl); }
.accounting-section-head { border-top: 1px solid var(--line); padding-top: var(--space-5); margin-top: var(--space-5); }
.accounting-section-head h3 { margin-bottom: var(--space-1); }
.accounting-section-head p { margin-bottom: 0; }
.accounting-money { padding: var(--space-4); border-radius: var(--r); background: var(--tint-row); }
.accounting-method { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 1fr)); gap: var(--space-3); padding-block: var(--space-3); border-top: 1px solid var(--line); font-size: var(--text-sm); }
.accounting-method > strong, .accounting-method > span { min-width: 0; overflow-wrap: anywhere; }
.accounting-method span { color: var(--muted); }
.accounting-method b { display: block; color: var(--ink); font-weight: var(--fw-semibold); font-variant-numeric: var(--num); }
.accounting-cash-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-4); padding-block: var(--space-4); color: var(--ink); font-size: var(--text-sm); }
.accounting-cash-row + .accounting-cash-row { border-top: 1px solid var(--line); }
.accounting-cash-row > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.accounting-cash-row small { display: block; margin-top: var(--space-1); color: var(--muted); }
.accounting-reference { max-width: 12rem; overflow-wrap: anywhere; }
.accounting-cash-confirm .checkbox { display: flex; align-items: flex-start; gap: var(--space-3); min-height: 2.75rem; font-size: var(--text-sm); }
@media (max-width: 37.5rem) {
    .accounting-page-head .operator-header-actions { width: 100%; }
    .accounting-page-head .operator-header-actions .btn { flex: 1 1 100%; }
    .accounting-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-3); }
    .accounting-method { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .accounting-method > strong { grid-column: 1 / -1; }
    .accounting-filter > div { flex: 1 1 40%; min-width: 0; }
    .accounting-filter .btn { width: 100%; }
    .accounting-timezone { margin-left: 0; }
    .accounting-cash-row { grid-template-columns: minmax(0, 1fr) auto; }
    .accounting-cash-row > span:last-child { grid-column: 1 / -1; }
}
@media (max-width: 22.5rem) {
    .accounting-filter > div { flex-basis: 100%; }
}

@media (min-width: 64rem) {
    .operator-page .mgrid { grid-template-columns: 14rem minmax(0, 1fr); }
    .operator-page .crail { position: sticky; top: calc(var(--bar-h) + var(--space-5)); }
}
@media (max-width: 64rem) {
    .operator-driver-grid { grid-template-columns: minmax(0, 1fr); }
    .operator-driver-add { max-width: none; }
    .operator-page .admin-record { grid-template-columns: minmax(0, 1fr) auto; }
    .operator-page .admin-record-actions { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 37.5rem) {
    .operator-page main.container.page { padding-top: var(--space-5); }
    .operator-page .topbar .inner { padding-inline: var(--space-4); gap: var(--space-3); }
    .operator-page .manage-context-inner { padding-inline: var(--space-4); }
    .operator-page .manage-context-identity small { display: block; margin-left: 0; }
    .operator-page-head,
    .operator-page .phead,
    .operator-page .dash-head { gap: var(--space-4); margin-bottom: var(--space-5); }
    .operator-header-actions { margin-left: 0; width: 100%; }
    .operator-page .phead > .operator-header-actions { gap: var(--space-2); }
    .operator-page .phead .operator-header-actions > .badge { flex-basis: 100%; width: fit-content; justify-self: start; background: transparent; padding-left: 0; }
    .operator-page .card { padding: var(--space-4); border-radius: var(--r); }
    .operator-page .kpis { gap: var(--space-3); }
    .operator-page .stat { padding: var(--space-4); gap: var(--space-2); border-radius: var(--r); }
    .operator-page .stat .n { font-size: var(--text-xl); }
    .operator-page .stat .l { font-size: var(--text-xs); }
    .operator-page .checklist li { gap: var(--space-3); }
    .operator-page .subnav { margin-bottom: var(--space-5); border-radius: var(--r-md); }
    .operator-page .subnav a { flex-shrink: 0; }
    .operator-page .mobile-tabbar { border-top-color: var(--line); box-shadow: var(--shadow-bar); }
    .operator-page .mobile-tabbar a { gap: var(--space-1); padding-top: var(--space-2); }
    .operator-page .mobile-tabbar a.active { color: var(--brand-dark); }
    .operator-page .mobile-tabbar a.active > span { background: var(--brand-tint); border-radius: var(--r-md); }
    .operator-page .admin-record { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
    .operator-page .admin-record-actions { grid-column: auto; }
    .operator-page .operator-filterbar { padding: var(--space-3); }
    .operator-page .operator-filterbar input[type="search"] { flex-basis: 100%; }
    .operator-page .operator-filterbar select { flex: 1 1 8rem; }
    .operator-page .save-bar { border-radius: var(--r); }
    .drv-page .drv-top-head { padding-inline: var(--space-4); }
}

/* Bounded restaurant identity: photos and an accessible accent, in the GoEat shell. */
.appearance-settings-link { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-4); }
.appearance-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.appearance-controls { min-width: 0; }
.appearance-controls .card + .card { margin-top: var(--space-5); }
.appearance-controls .operator-section-head h2 { font-size: var(--text-lg); margin-bottom: var(--space-2); }
.appearance-upload + .appearance-upload { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.appearance-upload input[type="file"] { width: 100%; min-width: 0; font-size: var(--text-sm); color: var(--ink-soft); }
.appearance-upload input::file-selector-button { font: inherit; color: var(--ink); background: var(--card); border: 1px solid var(--line-strong); border-radius: var(--r-md); padding: var(--space-3); margin-right: var(--space-3); cursor: pointer; }
.appearance-upload-copy .help { margin-top: var(--space-2); }
.appearance-color-row .input-color { width: 4.5rem; height: 2.75rem; padding: var(--space-1); }
.appearance-color-row .input-color:disabled { opacity: .45; cursor: not-allowed; }
.operator-page .appearance-error { color: var(--danger); }
.appearance-error:empty { display: none; }
.appearance-preview-panel { min-width: 0; }
.appearance-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); }
.appearance-preview-heading h2 { margin: 0; font-size: var(--text-lg); }
.appearance-preview { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
.appearance-preview-topbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); font-size: var(--text-sm); }
.appearance-preview-topbar strong { overflow-wrap: anywhere; }
.appearance-preview-topbar span { font-weight: var(--fw-bold); color: var(--brand); }
.appearance-preview-cover { display: grid; place-items: center; aspect-ratio: 8 / 3; background: var(--gradient-cover); color: var(--muted); position: relative; }
.appearance-preview-cover img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.appearance-preview-body { padding: var(--space-5); }
.appearance-preview-logo { display: grid; place-items: center; width: 4rem; height: 4rem; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); margin-top: calc(-1 * var(--space-8)); margin-bottom: var(--space-4); position: relative; overflow: hidden; }
.appearance-preview-logo img { width: 100%; height: 100%; object-fit: contain; }
.appearance-preview-body h3 { font-size: var(--text-xl); overflow-wrap: anywhere; }
.appearance-preview-body > .help { max-height: 4.8em; overflow: hidden; }
.appearance-preview-category { display: inline-flex; padding: var(--space-2) var(--space-3); border-radius: var(--pill); color: var(--brand-contrast); background: var(--ink); font-size: var(--text-sm); font-weight: var(--fw-semibold); margin-block: var(--space-3); }
.appearance-preview-dish { display: flex; align-items: center; gap: var(--space-4); padding-block: var(--space-4); border-block: 1px solid var(--line); margin-bottom: var(--space-5); }
.appearance-preview-dish > div { flex: 1; }
.appearance-preview-dish .help { margin: var(--space-1) 0 0; }
.appearance-preview-add { display: grid; place-items: center; flex-shrink: 0; width: 2.5rem; height: 2.5rem; color: var(--appearance-accent, var(--brand)); background: var(--card); border: 1px solid var(--line-strong); border-radius: var(--r-md); }
.appearance-preview-button { padding: var(--space-3) var(--space-4); text-align: center; border-radius: var(--r); background: var(--appearance-accent, var(--brand)); color: var(--brand-contrast); font-weight: var(--fw-semibold); }
.appearance-preview-credit { text-align: center; margin: var(--space-3) 0 0; color: var(--muted); font-size: var(--text-xs); }
@media (max-width: 50rem) {
    .appearance-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
    .appearance-preview-panel { max-width: 34rem; width: 100%; margin-inline: auto; }
}

.appearance-mobile-action { display: none; }
.appearance-selected-file { margin: var(--space-2) 0 0; font-size: var(--text-sm); color: var(--ink-soft); overflow-wrap: anywhere; }
.appearance-preview-status { margin: var(--space-2) 0 0; color: var(--muted); font-size: var(--text-xs); line-height: 1.5; }
.appearance-preview-status.is-unsaved { color: var(--brand-dark); }
#appearanceForm :is(#appearance-preview-title, #appearance-controls, input) { scroll-margin-top: calc(var(--appearance-header-offset, var(--bar-h)) + var(--space-6)); }
#appearance-preview-title:focus-visible, #appearance-controls:focus-visible { outline: 2px solid var(--brand); outline-offset: var(--space-2); }
@media (max-width: 50rem) {
    .appearance-mobile-action { display: inline-flex; }
    .appearance-preview-heading { align-items: flex-start; flex-wrap: wrap; gap: var(--space-2); }
    .appearance-preview-heading > div { flex: 1 1 12rem; }
    .appearance-save-bar { gap: var(--space-3); flex-wrap: nowrap; }
    .appearance-save-bar .btn { flex: 1 1 0; min-width: 0; }
    .appearance-save-bar .save-hint { display: none; }
    .appearance-upload-button { max-width: 100%; }
}

/* The workspace shares the storefront shell. Extra width belongs to useful
   columns, while individual documents and fields retain a readable measure. */
@media screen {
    .operator-page .topbar .inner,
    .operator-page .manage-context-inner {
        max-width: var(--layout-max);
        padding-inline: var(--layout-gutter);
    }
    .operator-page :is(.grid, .mgrid, .operator-form-grid, .operator-settings-columns, .order-layout, .order-side) > *,
    .operator-page :is(.card, .form-row, .table-wrap, .operator-settings-column) { min-width: 0; }
    .operator-page .grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .operator-page .grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .operator-page .grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .operator-page :is(input, select, textarea) { max-width: 100%; }
    .operator-page :is(.help, .alert, .def-list dd, .def-list dt) { overflow-wrap: anywhere; }
    .operator-page .def-list { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
    .operator-page .operator-focused-form { max-width: 48rem; }
    .operator-page .operator-settings-column + .operator-settings-column { margin-top: var(--space-5); }
    .operator-page .mrow-name { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
    .operator-page .hours-table td.nowrap { white-space: normal; }
    .operator-page .order-side { min-width: 0; }
}
@media screen and (min-width: 51.25rem) {
    .operator-page .crail-name { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
}
@media screen and (min-width: 64rem) {
    .operator-page .operator-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--space-5); }
    .operator-page .operator-fields-grid > * { min-width: 0; }
    .operator-page .operator-fields-grid > .form-row { margin-bottom: 0; }
    .operator-page .operator-fields-grid > :is(button, .help, .row) { grid-column: 1 / -1; }
    .operator-page .operator-fields-grid > button { justify-self: start; }
}
@media screen and (min-width: 80rem) {
    .operator-page .operator-form-grid {
        display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start; gap: var(--space-5);
    }
    .operator-page .operator-form-grid > .card { margin: 0; }
    .operator-page .operator-form-grid > :is(.save-bar, .alert, button) { grid-column: 1 / -1; }
    .operator-page .operator-form-grid > button { justify-self: start; }
    .operator-page .operator-form-grid > .save-bar { margin-top: 0; }
    .operator-page .operator-form-featured > .card:first-of-type { grid-row: span 2; }
    .operator-page .order-layout { grid-template-columns: minmax(22rem, 30rem) minmax(0, 1fr); }
    .operator-page .order-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
    .operator-page .order-side > .accounting-cash-confirm { grid-column: 1 / -1; }
    .operator-page .operator-driver-grid { grid-template-columns: minmax(0, 1fr) minmax(20rem, 26rem); }
}
@media screen and (min-width: 90rem) {
    .operator-settings-columns { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: var(--space-5); }
    .operator-page .operator-settings-column + .operator-settings-column { margin-top: 0; }
}
@media screen and (min-width: 90rem) and (max-width: 104rem) {
    .operator-page .operator-settings-form [data-controller~="settings-address"] > .grid { grid-template-columns: minmax(0, 1fr); }
}
/* A two-row tablet header is taller than --bar-h. Keep the category rail in
   normal flow there instead of allowing it to slide behind navigation. */
@media screen and (max-width: 81.25rem), screen and (max-height: 40rem) {
    .operator-page .crail { position: static; }
}
@media screen and (min-width: 81.3125rem) and (min-height: 40.0625rem) {
    .operator-page .crail { max-height: calc(100dvh - var(--bar-h) - var(--space-8)); overflow-y: auto; scrollbar-width: thin; }
}
@media screen and (min-width: 37.5625rem) and (max-width: 53.75rem) {
    .operator-page .grid.cols-3,
    .operator-page .grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .operator-page .grid.kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media screen and (max-width: 37.5rem) {
    .operator-page .grid.cols-2,
    .operator-page .grid.cols-3,
    .operator-page .grid.cols-4 { grid-template-columns: minmax(0, 1fr); }
    .operator-page .grid.cols-4.kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

#orderingForm > :is(.save-bar, .alert) { grid-column: 1 / -1; }
.minimum-policy-fieldset { min-width: 0; border: 0; padding: 0; margin: 0 0 var(--space-5); }
.minimum-policy-fieldset legend { font-weight: var(--fw-semibold); margin-bottom: var(--space-2); }
.minimum-policy-options { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); margin-top: var(--space-4); }
.minimum-policy-options .opt-tile { min-width: 0; align-items: flex-start; padding-right: var(--space-4); }
.minimum-policy-options .opt-tile > span { display: block; min-width: 0; width: 100%; }
.minimum-policy-options .opt-tile-title { display: block; padding-right: var(--space-6); }
.minimum-policy-options .opt-tile-desc { display: block; }
.minimum-policy-options input { flex-shrink: 0; }
.minimum-distance-link { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); border-top: 1px solid var(--line); margin-top: var(--space-5); padding-top: var(--space-5); }
.minimum-distance-link > div { flex: 1 1 16rem; min-width: 0; }