/* /Components/FloorPlans/AiChangeDialog.razor.rz.scp.css */
/* Phase 54 (D-02 / D-04, 53 D-17): the Change with AI dialog. Styles anchor on elements this component renders; the Mud
   buttons are reached with ::deep from the plain .ai-change-actions wrapper (never a Mud Class). */
.ai-change-save-first[b-8cmqs5vzw4] {
  margin: 0 0 var(--sp-3);
  font-weight: 600;
  color: var(--ink-2);
}

.ai-change-hint[b-8cmqs5vzw4] {
  margin: var(--sp-3) 0 0;
  color: var(--ink-3);
  font-size: 0.875rem;
}

.ai-change-actions[b-8cmqs5vzw4] {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--sp-2);
}

/* D-17: Cancel and Start AI change are 44 px finger targets on a touch screen. */
@media (any-pointer: coarse) {
  .ai-change-actions[b-8cmqs5vzw4]  .mud-button-root {
    min-height: 44px;
    min-width: 44px;
  }
}
/* /Components/FloorPlans/AiChangeStatus.razor.rz.scp.css */
/* Phase 54 (D-03, 53 D-17): the editor's AI change line, mirroring AiDraftStatus.razor.css. Styles anchor on elements
   this component renders; the Mud buttons are reached with ::deep from the plain .ai-change-status-actions wrapper
   (never a Mud Class). */
.ai-change-status-row[b-38jzb6rs81] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-1) var(--sp-3);
}

.ai-change-status[b-38jzb6rs81] {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--sp-2);
  color: var(--ink-2);
}

.ai-change-review[b-38jzb6rs81] {
  font-weight: 600;
}

.ai-change-status-elapsed[b-38jzb6rs81] {
  color: var(--ink-3);
  font-variant-numeric: tabular-nums;
}

.ai-change-status-actions[b-38jzb6rs81] {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
}

/* D-17: Cancel, Try again, Dismiss and the Review link are 44 px finger targets on a touch screen. */
@media (any-pointer: coarse) {
  .ai-change-status-actions[b-38jzb6rs81]  .mud-button-root {
    min-height: 44px;
    min-width: 44px;
  }

  a.ai-change-review[b-38jzb6rs81] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}
/* /Components/FloorPlans/AiDraftDialog.razor.rz.scp.css */
/* Phase 53 (D-13 / D-17): the Draft with AI dialog. Styles anchor on elements this component renders. */
.ai-draft-hint[b-mup5o7xk2l] {
  margin: var(--sp-3) 0 0;
  color: var(--ink-3);
  font-size: 0.875rem;
}

.ai-draft-actions[b-mup5o7xk2l] {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--sp-2);
}

/* D-17: Cancel and Start are 44 px finger targets on a touch screen, reached with ::deep from the plain wrapper. */
@media (any-pointer: coarse) {
  .ai-draft-actions[b-mup5o7xk2l]  .mud-button-root {
    min-height: 44px;
    min-width: 44px;
  }
}
/* /Components/FloorPlans/AiDraftStatus.razor.rz.scp.css */
/* Phase 53 (D-14 / D-17): one room card's AI draft line. Styles anchor on elements this component renders; the Mud
   buttons are reached with ::deep from the plain .ai-status-actions wrapper (never a Mud Class). */
.ai-status-row[b-9s98230nko] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-1) var(--sp-3);
  margin: 0 0 var(--sp-2);
}

.ai-status[b-9s98230nko] {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--sp-2);
  color: var(--ink-2);
}

.ai-status-review[b-9s98230nko] {
  font-weight: 600;
}

.ai-status-elapsed[b-9s98230nko] {
  color: var(--ink-3);
  font-variant-numeric: tabular-nums;
}

.ai-status-actions[b-9s98230nko] {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
}

@media (any-pointer: coarse) {
  .ai-status-actions[b-9s98230nko]  a,
  .ai-status-actions[b-9s98230nko]  button {
    min-height: 44px;
    min-width: 44px;
  }

  .ai-status-review[b-9s98230nko] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}
/* /Components/FloorPlans/CapacityChart.razor.rz.scp.css */
/* PLAN-08 (D-09 / D-10): the capacity chart. Only the plain elements this component renders are styled. */
.capacity-chart[b-suodfrxdfl] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2, 0.5rem);
}

.capacity-chart__room[b-suodfrxdfl] {
  margin: 0;
  font-weight: 600;
  color: var(--ink, inherit);
}

.capacity-chart__empty[b-suodfrxdfl] {
  margin: 0;
  color: var(--ink-3, #6c757d);
}

.capacity-chart__list[b-suodfrxdfl] {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2, 0.5rem);
}

.capacity-chart__item[b-suodfrxdfl] {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.65rem;
  border: 1px solid var(--line, #d9d4cc);
  border-radius: 999px;
  background: var(--paper-2, transparent);
}

.capacity-chart__default[b-suodfrxdfl] {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--wine);
}

.capacity-chart--compact[b-suodfrxdfl] {
  display: block;
  font-size: 0.85rem;
  color: var(--ink-3, #6c757d);
}
/* /Components/FloorPlans/ClientSharePanel.razor.rz.scp.css */
/* Phase 57 (57-08, D-24): the Client share panel at the top of the floor-plans page. Anchored on the panel's own
   section (never a Mud Class). Same tokens as the page's room cards. */
.efp-share[b-ymwp4jhknp] {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  margin-bottom: var(--sp-4);
  background: var(--surface);
}

.efp-share-h[b-ymwp4jhknp] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: 0 0 var(--sp-1);
  color: var(--ink);
}

.efp-share-status[b-ymwp4jhknp] {
  margin: 0;
  color: var(--ink-2);
  overflow-wrap: anywhere;
}

/* 57-09 (D-24): the coordinator actions under the status line, the inline revoke confirm and the action message. */
.efp-share-actions[b-ymwp4jhknp] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
  margin-top: var(--sp-2);
}

.efp-share-confirm[b-ymwp4jhknp] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
  padding: var(--sp-3);
  background: var(--surface-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-md);
}

.efp-share-confirm-text[b-ymwp4jhknp] {
  margin: 0;
  color: var(--ink);
}

.efp-share-confirm-actions[b-ymwp4jhknp] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1);
  justify-content: flex-end;
}

.efp-share-msg[b-ymwp4jhknp] {
  margin: var(--sp-2) 0 0;
  color: var(--ink-2);
  font-size: var(--t--1);
}

/* 57-09 (D-24 / D-25): the History expander, a native details element; muted, compact lines. */
.efp-share-history[b-ymwp4jhknp] {
  margin-top: var(--sp-2);
}

.efp-share-history-summary[b-ymwp4jhknp] {
  cursor: pointer;
  color: var(--ink);
  font-weight: 500;
  min-height: 44px;
  display: flex;
  align-items: center;
}

.efp-share-history-list[b-ymwp4jhknp] {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
}

.efp-share-history-item[b-ymwp4jhknp] {
  color: var(--ink-2);
  font-size: var(--t--1);
  overflow-wrap: anywhere;
}

/* Phase 58 (58-11; D-14, D-18): what changed since sharing (always the amber "changed" palette) and the client's
   latest response (neutral, amber once the plans moved on since). The amber palette is the shared global .change-notice
   in wwwroot/css/terroir.css, backed by the --wheat-line / --wheat-tint / --wheat-ink tokens so it reads in both themes
   (quick 261015-ldu); these scoped rules keep layout only. Anchored on page-rendered elements, never a Mud Class. */
.efp-share-changes[b-ymwp4jhknp] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
  margin-top: var(--sp-2);
}

.efp-share-change[b-ymwp4jhknp] {
  margin: 0;
  padding: var(--sp-1) var(--sp-2);
}

.efp-share-response[b-ymwp4jhknp] {
  margin: var(--sp-2) 0 0;
  padding: var(--sp-1) var(--sp-2);
  overflow-wrap: anywhere;
}

/* The neutral look is for the current response only. It sits behind :not(.change-notice) because this scoped rule
   would otherwise outrank the bare global class and paint the stale line neutral. The stale response (the
   efp-share-response--stale hook) takes its amber palette from the global .change-notice. */
.efp-share-response:not(.change-notice)[b-ymwp4jhknp] {
  border-left: 4px solid var(--line);
  color: var(--ink);
}
/* /Components/FloorPlans/EventFloorPlansCard.razor.rz.scp.css */
/* D-09: the read-only BEO floor-plans card. Styles anchor on the plain elements the card renders (never a Mud
   Class, Pitfall 31). Same tokens as CapacityChart.razor.css and EventFloorPlans.razor.css. */
.efp-card[b-t7n1mhap97] {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  background: var(--surface);
}

.efp-card-h[b-t7n1mhap97] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: 0 0 var(--sp-2);
  color: var(--ink);
}

.efp-card-list[b-t7n1mhap97] {
  list-style: none;
  margin: 0 0 var(--sp-2);
  padding: 0;
}

.efp-card-item[b-t7n1mhap97] {
  padding: var(--sp-1) 0;
  border-top: 1px solid var(--line-soft);
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
}

.efp-card-item:first-child[b-t7n1mhap97] { border-top: 0; }

.efp-card-muted[b-t7n1mhap97],
.efp-card-empty[b-t7n1mhap97] {
  margin: 0 0 var(--sp-2);
  color: var(--ink-3);
}

.efp-card-error[b-t7n1mhap97] {
  margin: 0 0 var(--sp-2);
  color: var(--wheat-ink);
}

.efp-card-link[b-t7n1mhap97] { font-weight: 600; }

/* Phase 57 (57-09, D-14): the one client share line under the plan lines, a quiet link to the plans page. */
.efp-card-share[b-t7n1mhap97] {
  display: block;
  margin: 0 0 var(--sp-2);
  color: var(--ink-2);
  font-size: var(--t--1);
  overflow-wrap: anywhere;
}

/* Phase 58 (58-11, D-18): changed since signed / shared, under the plan lines. The amber palette (border, fill,
   text, weight, wrapping) is the shared global .change-notice in wwwroot/css/terroir.css, backed by the
   --wheat-line / --wheat-tint / --wheat-ink tokens so it reads in both themes (quick 261015-ldu). This rule keeps
   layout only and must not redeclare border-left, background or color. A plain p, never a Mud Class. */
.efp-card-changes[b-t7n1mhap97] {
  margin: 0 0 var(--sp-2);
  padding: var(--sp-1) var(--sp-2);
  font-size: var(--t--1);
}
/* /Components/FloorPlans/FloorPlanEditTools.razor.rz.scp.css */
/* Phase 52 D-10 / D-20 (52-05): the shared selection tools sit inline in each page's .fp-editor-tools toolbar. The
   group is a component-rendered div, so this scoped rule matches it (a rule on a Mud component's Class would not). */
.fp-edit-tools[b-mgm85xt2hf] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.fp-edit-tools-count[b-mgm85xt2hf] {
    font-size: 0.8125rem;
    color: var(--mud-palette-text-secondary, #6b5f52);
    padding: 0 0.25rem;
    white-space: nowrap;
}

/* 52-06 (D-11): the Align / Distribute icon buttons stay one wrapping group, so on a narrow toolbar they drop to the
   next line together instead of spreading across the other tools. */
.fp-edit-tools-align[b-mgm85xt2hf] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
}

/* 52-08 (D-20): on a touch screen every selection tool is a 44 px finger target. Anchored on the component-rendered
   group and reaching the Mud buttons with ::deep (a rule on a Mud component's Class would match nothing). */
@media (any-pointer: coarse) {
    .fp-edit-tools[b-mgm85xt2hf]  .mud-button-root {
        min-height: 44px;
        min-width: 44px;
    }
}
/* /Components/FloorPlans/FloorPlanGridFillPanel.razor.rz.scp.css */
/* Phase 52 D-13 (52-07): the grid-fill panel takes its own line under the selection tools in each page's wrapping
   .fp-editor-tools toolbar. Every rule targets a component-rendered element (a rule on a Mud component's Class would
   not match). */
.fp-gridfill[b-yyr3hl78m8] {
    display: flex;
    flex-basis: 100%;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--line, #e0d6c6);
    border-radius: 4px;
    background: var(--mud-palette-surface, #fff);
}

.fp-gridfill-field[b-yyr3hl78m8] {
    width: 9rem;
}

.fp-gridfill-kind[b-yyr3hl78m8] {
    width: 11rem;
}

/* 52-07 Task 2: Rows and Columns are short whole numbers. */
.fp-gridfill-count[b-yyr3hl78m8] {
    width: 6rem;
}

.fp-gridfill-hint[b-yyr3hl78m8],
.fp-gridfill-summary[b-yyr3hl78m8] {
    font-size: 0.8125rem;
    color: var(--mud-palette-text-secondary, #6b5f52);
}

.fp-gridfill-summary[b-yyr3hl78m8] {
    color: var(--mud-palette-text-primary, #2b2420);
    font-variant-numeric: tabular-nums;
}

.fp-gridfill-actions[b-yyr3hl78m8] {
    display: inline-flex;
    gap: 0.25rem;
    margin-left: auto;
}

/* 52-08 (D-20): Place and Cancel are 44 px finger targets on a touch screen (the panel renders .fp-gridfill itself). */
@media (any-pointer: coarse) {
    .fp-gridfill[b-yyr3hl78m8]  .mud-button-root {
        min-height: 44px;
        min-width: 44px;
    }
}
/* /Components/FloorPlans/FloorPlanWarningsPanel.razor.rz.scp.css */
/* Phase 52 D-07 / D-25 (52-03): the shared warnings list, moved unchanged from EventPlanEditor.razor.css (50-09).
   .epe-warnings is the plain wrapper this component renders around the MudExpansionPanels, so the list rules reach
   the Mud internals with ::deep (Pitfall 31: never on a Mud component's Class). */
.epe-warnings[b-quz40y8jm2] { border: 1px solid var(--line, #e0d6c6); border-radius: 4px; }
.epe-warnings[b-quz40y8jm2]  .epe-warnings-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.25rem; }
.epe-warnings[b-quz40y8jm2]  .epe-warning {
  border: 0;
  background: none;
  padding: 0.15rem 0.25rem;
  color: var(--wine);
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.epe-warnings[b-quz40y8jm2]  .epe-warning:hover,
.epe-warnings[b-quz40y8jm2]  .epe-warning:focus-visible { text-decoration: underline; }
.epe-warnings[b-quz40y8jm2]  .epe-warnings-more { margin: 0.25rem 0 0; color: var(--ink-3, #6b5f52); }

/* D-07: a tight aisle is a soft warning in the wheat ink (light and dark), apart from the wine hard issues. */
.epe-warnings[b-quz40y8jm2]  .epe-warning-aisle { color: var(--wheat-ink); }
/* /Components/FloorPlans/ShareWithClientDialog.razor.rz.scp.css */
/* Phase 57 (57-08; D-15..D-17): the Share with client dialog. Rules anchor on the plain elements this dialog renders
   (never on a Mud component Class: a scoped rule on a Mud Class matches nothing). Thumbnails wrap in a responsive grid
   with no horizontal scroll at 390 px, the preview frame has a fixed height, and long links wrap. */
.share-dialog[b-xne0h9dxmn] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
  min-width: 0;
}

.share-disabled[b-xne0h9dxmn],
.share-resend-note[b-xne0h9dxmn],
.share-cap-note[b-xne0h9dxmn] {
  margin: 0;
  color: var(--ink-2, #555);
}

.share-section-h[b-xne0h9dxmn] {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 var(--sp-2, 0.5rem);
}

.share-photos[b-xne0h9dxmn] {
  min-width: 0;
}

.share-room[b-xne0h9dxmn] {
  border: 0;
  margin: 0 0 var(--sp-3, 0.75rem);
  padding: 0;
  min-width: 0;
}

.share-room-name[b-xne0h9dxmn] {
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--sp-1, 0.25rem);
  color: var(--ink-2, #555);
}

.share-grid[b-xne0h9dxmn] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: var(--sp-2, 0.5rem);
}

.share-tile[b-xne0h9dxmn] {
  position: relative;
  display: block;
  min-height: 44px;
  border: 1px solid var(--line, #ddd);
  border-radius: var(--r-sm, 6px);
  overflow: hidden;
  cursor: pointer;
  background: var(--surface-2, #f6f6f6);
}

.share-thumb[b-xne0h9dxmn] {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.share-photo-check[b-xne0h9dxmn] {
  position: absolute;
  top: 6px;
  left: 6px;
  width: 22px;
  height: 22px;
  margin: 0;
  accent-color: var(--accent, #6b4e2e);
}

.share-photo-check:disabled + .share-thumb[b-xne0h9dxmn] {
  opacity: 0.5;
}

.share-attach-help[b-xne0h9dxmn],
.share-note-help[b-xne0h9dxmn],
.share-preview-note[b-xne0h9dxmn] {
  margin: 0;
  font-size: 0.8125rem;
}

.share-note-help[b-xne0h9dxmn] {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-2, 0.5rem);
}

.share-note-count[b-xne0h9dxmn] {
  white-space: nowrap;
}

.share-note-count--over[b-xne0h9dxmn] {
  color: var(--danger, #b3261e);
  font-weight: 600;
}

.share-preview-subject[b-xne0h9dxmn] {
  margin: 0 0 var(--sp-1, 0.25rem);
  overflow-wrap: anywhere;
}

.share-preview-frame[b-xne0h9dxmn] {
  display: block;
  width: 100%;
  height: 320px;
  border: 1px solid var(--line, #ddd);
  border-radius: var(--r-sm, 6px);
  background: #fff;
}

.share-result-message[b-xne0h9dxmn] {
  margin: 0 0 var(--sp-2, 0.5rem);
}

.share-link-row[b-xne0h9dxmn] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
  min-width: 0;
}

.share-link-field[b-xne0h9dxmn] {
  flex: 1 1 16rem;
  min-width: 0;
}

.share-link-field[b-xne0h9dxmn]  input {
  overflow-wrap: anywhere;
  text-overflow: ellipsis;
}
/* /Components/FloorPlans/UploadedDrawingViewer.razor.rz.scp.css */
/* Phase 56 (56-07, D-15 / D-18): the read-only drawing page. Rules anchor on plain elements this component renders
   (never on a Mud component's Class, which a scoped rule cannot reach). Desktop: back link, title and actions on one
   row; tablet and phone: the actions wrap under the caption and the image fits the width (no horizontal scroll). */
.udv-root[b-gxierfmkhs] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
  min-width: 0;
}

.udv-head[b-gxierfmkhs] {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  flex-wrap: wrap;
}

.udv-titles[b-gxierfmkhs] { flex: 1 1 auto; min-width: 12rem; }
.udv-titles h1[b-gxierfmkhs] { margin: 0; overflow-wrap: anywhere; }

/* Room · Plan rev N · updated MM/dd/yyyy. */
.udv-meta[b-gxierfmkhs] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--sp-2, 0.5rem);
}

.udv-room[b-gxierfmkhs] { font-weight: 600; color: var(--ink, #3b332b); }

/* Open full size, Download PDF, Replace, Delete: right-aligned on desktop, wrapping under the caption on phones. */
.udv-actions[b-gxierfmkhs] {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--sp-2, 0.5rem);
  max-width: 100%;
}

/* D-10 / D-12: why the drawing is view-only, where the editor shows it. */
.udv-readonly[b-gxierfmkhs] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
  color: var(--ink-3, #6b5f52);
}

.udv-error[b-gxierfmkhs] { margin: 0; color: var(--danger, #b3261e); }

.udv-message[b-gxierfmkhs] { margin: 0; color: var(--ink-3, #6b5f52); }

.udv-figure[b-gxierfmkhs] { margin: 0; max-width: 100%; overflow: hidden; }

/* The 2400 px display copy fitted to the content width; the width/height attributes keep its aspect ratio while it
   loads. White behind it so a transparent PNG reads as a drawing in the dark theme too. */
.udv-img[b-gxierfmkhs] {
  display: block;
  max-width: 100%;
  height: auto;
  background: #fff;
  border: 1px solid var(--line, #e0d6c6);
}

/* D-18: the drawing could not be shown (missing file or storage down). A muted callout in place of the image. */
.udv-note[b-gxierfmkhs] {
  margin: 0;
  padding: var(--sp-3, 0.75rem) var(--sp-4, 1rem);
  border: 1px dashed var(--line, #e0d6c6);
  border-radius: 4px;
  color: var(--ink-3, #6b5f52);
  background: var(--paper-2, transparent);
}

@media (max-width: 600px) {
  .udv-actions[b-gxierfmkhs] { justify-content: flex-start; width: 100%; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-hl3nkfqco9] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-hl3nkfqco9] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Rail navigation is styled globally by wwwroot/css/terroir.css (.nav / .nav__item / .nav__label).
   The legacy .events-nav* scoped rules were removed when the nav moved into the Terroir rail. */
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
.public-site[b-ko3xhpu50o] {
    --public-bg: oklch(0.968 0.013 92);
    --public-bg-gradient-a: oklch(0.94 0.03 96 / 0.6);
    --public-bg-gradient-b: oklch(0.93 0.024 150 / 0.42);
    --public-surface-1: oklch(0.992 0.006 96);
    --public-surface-2: oklch(0.978 0.01 92);
    --public-ink-1: oklch(0.255 0.02 152);
    --public-ink-2: oklch(0.405 0.022 150);
    --public-line: oklch(0.886 0.013 110);
    --public-accent: oklch(0.405 0.066 158);
    --public-accent-strong: oklch(0.318 0.052 161);
    --public-on-accent: oklch(0.962 0.02 96);
    --public-font-display: "Fraunces", Georgia, "Times New Roman", serif;
    --public-font-ui: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
    --public-radius-sm: 0.45rem;
    --public-radius-md: 0.75rem;
    --public-shadow-1: 0 2px 6px oklch(0.3 0.04 150 / 0.07), 0 10px 24px oklch(0.3 0.04 150 / 0.08);

    min-height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    background:
        radial-gradient(120% 90% at 100% 0%, var(--public-bg-gradient-a), transparent 60%),
        radial-gradient(120% 80% at 0% 100%, var(--public-bg-gradient-b), transparent 58%),
        var(--public-bg);
    color: var(--public-ink-1);
    font-family: var(--public-font-ui);
}

@media (prefers-color-scheme: dark) {
    .public-site[b-ko3xhpu50o] {
        --public-bg: oklch(0.205 0.014 158);
        --public-bg-gradient-a: oklch(0.28 0.035 156 / 0.55);
        --public-bg-gradient-b: oklch(0.24 0.03 150 / 0.45);
        --public-surface-1: oklch(0.246 0.016 158);
        --public-surface-2: oklch(0.29 0.018 156);
        --public-ink-1: oklch(0.93 0.012 96);
        --public-ink-2: oklch(0.8 0.016 110);
        --public-line: oklch(0.34 0.018 156);
        --public-accent: oklch(0.53 0.09 154);
        --public-accent-strong: oklch(0.47 0.08 154);
        --public-on-accent: oklch(0.94 0.014 96);
        --public-shadow-1: 0 2px 4px oklch(0 0 0 / 0.28), 0 10px 26px oklch(0 0 0 / 0.38);
    }
}

.public-site__header[b-ko3xhpu50o],
.public-site__footer[b-ko3xhpu50o] {
    padding: 1rem 1.25rem;
    background: color-mix(in oklch, var(--public-surface-1), transparent 18%);
    border-bottom: 1px solid var(--public-line);
    backdrop-filter: blur(6px);
}

.public-site__footer[b-ko3xhpu50o] {
    border-top: 1px solid var(--public-line);
    border-bottom: none;
    color: var(--public-ink-2);
}

.public-site__brand[b-ko3xhpu50o] {
    color: inherit;
    text-decoration: none;
    font: 600 1.05rem/1.2 var(--public-font-ui);
    letter-spacing: 0.02em;
}

.public-site__main[b-ko3xhpu50o] {
    width: min(100%, 72rem);
    margin: 0 auto;
    padding: 1.5rem 1.25rem 2.25rem;
}

@media (max-width: 36rem) {
    .public-site__header[b-ko3xhpu50o],
    .public-site__footer[b-ko3xhpu50o],
    .public-site__main[b-ko3xhpu50o] {
        padding-inline: 0.9rem;
    }
}
/* /Components/Layout/PublicShareLayout.razor.rz.scp.css */
/* PublicShareLayout (57-05) - the stripped chrome for the anonymous client share page.
   Terroir tokens only, so the page follows the visitor's saved light or dark choice (theme.js flips the tokens before
   first paint). No literal text colours. The tenant accent reaches --brand only through the layout's :root override,
   which is emitted only for a trusted brand. */

.share-shell[b-ntjxhp1w99] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
}

/* Header: tenant logo or name, no navigation. */
.share-header[b-ntjxhp1w99] {
    display: flex;
    align-items: center;
    min-height: var(--sp-5);
    padding: var(--sp-2) var(--sp-3);
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    border-top: 3px solid var(--brand);
}

.share-brand[b-ntjxhp1w99] {
    display: inline-flex;
    align-items: center;
    min-height: var(--sp-4);
}

.share-brand__logo[b-ntjxhp1w99] {
    max-height: var(--sp-5);
    max-width: min(16rem, 60vw);
    object-fit: contain;
    object-position: left center;
}

.share-brand__name[b-ntjxhp1w99] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-2);
    line-height: 1.1;
    color: var(--ink);
    letter-spacing: -0.01em;
}

/* The page body: one readable column on a phone, a wider reading column on a desktop. */
.share-body[b-ntjxhp1w99] {
    flex: 1 1 auto;
    width: 100%;
    max-width: 64rem;
    margin-inline: auto;
    padding: var(--sp-4) var(--sp-2);
    box-sizing: border-box;
}

@media (min-width: 600px) {
    .share-body[b-ntjxhp1w99] {
        padding: var(--sp-5) var(--sp-3);
    }
}
/* /Components/Layout/PublicSigningLayout.razor.rz.scp.css */
/* PublicSigningLayout — minimal branded chrome for the anonymous public BEO review + signature page.
   Warm-paper editorial treatment on the Terroir token layer only: zero literal colors, zero literal
   spacing (fluid --sp-* tokens + Terroir radii). Light/dark and reduced-motion are already handled
   globally in terroir.css — no competing media queries are added here. */

.signing-page[b-hxa0na768r] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    /* Dominant 60% — warm paper behind the whole page, never pure white. */
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
}

/* ----- Header: tenant logo + name lockup, no navigation (D-09) ----- */
.signing-header[b-hxa0na768r] {
    display: flex;
    align-items: center;
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.signing-brand[b-hxa0na768r] {
    display: inline-flex;
    align-items: center;
    min-height: var(--sp-4);
}

.signing-brand__logo[b-hxa0na768r] {
    max-height: var(--sp-5);
    max-width: min(16rem, 60vw);
    object-fit: contain;
    object-position: left center;
}

.signing-brand__name[b-hxa0na768r] {
    /* Display role — Fraunces 600, editorial and tight (UI-SPEC typography). */
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.05;
    color: var(--ink);
    letter-spacing: -0.01em;
}

/* ----- Main: the document / form surface region ----- */
.signing-main[b-hxa0na768r] {
    flex: 1 1 auto;
    width: 100%;
    max-width: 68rem;
    margin-inline: auto;
    padding: var(--sp-5) var(--sp-3);
}

/* ----- Footer: simple mark, no navigation ----- */
.signing-footer[b-hxa0na768r] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface);
    border-top: 1px solid var(--line);
    color: var(--ink-3);
}

.signing-footer__mark[b-hxa0na768r] {
    font-family: var(--serif);
    font-size: var(--t--1);
    letter-spacing: 0.01em;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-h9niagk5vc],
.components-reconnect-repeated-attempt-visible[b-h9niagk5vc],
.components-reconnect-failed-visible[b-h9niagk5vc],
.components-pause-visible[b-h9niagk5vc],
.components-resume-failed-visible[b-h9niagk5vc],
.components-rejoining-animation[b-h9niagk5vc] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-retrying[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-failed[b-h9niagk5vc],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-h9niagk5vc] {
    display: block;
}


#components-reconnect-modal[b-h9niagk5vc] {
    background-color: var(--surface, #fff);
    color: var(--ink, #1a1a1a);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: var(--sh-3, 0 3px 6px 2px rgba(0, 0, 0, 0.3));
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-h9niagk5vc 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-h9niagk5vc 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-h9niagk5vc 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-h9niagk5vc]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-h9niagk5vc 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-h9niagk5vc {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-h9niagk5vc {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-h9niagk5vc {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-h9niagk5vc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-h9niagk5vc] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-h9niagk5vc] {
    border: 0;
    background-color: var(--pine, #3a6b52);
    color: var(--on-pine, #f5f5f0);
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-h9niagk5vc] {
        background-color: var(--pine-deep, #2d5240);
    }

    #components-reconnect-modal button:active[b-h9niagk5vc] {
        background-color: var(--pine, #3a6b52);
    }

.components-rejoining-animation[b-h9niagk5vc] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-h9niagk5vc] {
        position: absolute;
        border: 3px solid var(--pine-bright, #5a9e7a);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-h9niagk5vc 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-h9niagk5vc] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-h9niagk5vc {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin/CrossTenant/Dashboard.razor.rz.scp.css */
/* TENANT-05 / UI-SPEC line 72 — the cross-tenant dashboard uses Terroir base tokens (not per-tenant
   accent overrides). It spans all tenants, so it must NOT wear any one tenant's brand color (T-6-07-04).
   Per-tenant accent swatches are inline-styled DATA in the grid, not page chrome. Tokens handle both
   light and dark without any per-component media queries. */

.cross-tenant-h1[b-v7tyuzxyl0] {
    /* Display 28/600 page H1 idiom (UI-SPEC line 104). */
    font-size: 28px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--ink);
    margin-bottom: 24px;
}

.cross-tenant-empty[b-v7tyuzxyl0] {
    text-align: center;
    padding: 48px 16px;
}

/* Rolled-up headline metric group (xl 32px column gap, UI-SPEC spacing). */
.cross-tenant-rollup[b-v7tyuzxyl0] {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    padding: 24px;
    margin-bottom: 24px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.cross-tenant-metric[b-v7tyuzxyl0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 160px;
}

.cross-tenant-metric-value[b-v7tyuzxyl0] {
    /* Display 28/600 — emphasis by weight + placement, not a 5th size (UI-SPEC line 107). */
    font-size: 28px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--wine);
}

.cross-tenant-metric-caption[b-v7tyuzxyl0] {
    font-size: 14px;
    font-weight: 600; /* Label role */
    line-height: 1.4;
    color: var(--ink-3);
}

.cross-tenant-grid[b-v7tyuzxyl0] {
    margin-top: 8px;
}

.cross-tenant-name-cell[b-v7tyuzxyl0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Per-tenant accent swatch — DATA, inline-colored from the tenant's hex; the border keeps a light
   swatch visible on the neutral surface. This is the ONE place a tenant color appears, as data. */
.cross-tenant-swatch[b-v7tyuzxyl0] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid var(--line);
    flex: 0 0 auto;
}

.cross-tenant-status-list[b-v7tyuzxyl0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cross-tenant-status-chip[b-v7tyuzxyl0] {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    padding: 2px 8px;
    background: var(--paper-deep);
    border-radius: 4px;
    white-space: nowrap;
}

.cross-tenant-money[b-v7tyuzxyl0] {
    font-size: 16px;
    font-weight: 400; /* Body — money right-aligned (UI-SPEC line 108) */
}

.cross-tenant-muted[b-v7tyuzxyl0] {
    color: var(--ink-3);
}
/* /Components/Pages/Admin/Tenants/Create.razor.rz.scp.css */
.tenant-create-form[b-gegub13p28] {
    max-width: 44rem;
}

.tenant-create-actions[b-gegub13p28] {
    flex-wrap: wrap;
}
/* /Components/Pages/Admin/Tenants/Settings.razor.rz.scp.css */
.tenant-settings-empty[b-2y9sc3ud31] {
    max-width: 48rem;
    margin-inline: auto;
}

.tenant-settings-tabs[b-2y9sc3ud31] {
    margin-top: var(--sp-2);
}

.tenant-settings-form[b-2y9sc3ud31] {
    max-width: 68rem;
}

.tenant-settings-field[b-2y9sc3ud31] {
    max-width: 32rem;
}

.tenant-settings-section-h[b-2y9sc3ud31] {
    font-family: var(--serif);
    font-size: var(--t-1);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: var(--sp-3) 0 var(--sp-2);
}

.tenant-settings-hostnames[b-2y9sc3ud31] {
    max-width: 40rem;
}

.tenant-settings-col-actions[b-2y9sc3ud31] {
    width: 8rem;
}

.tenant-settings-inline-actions[b-2y9sc3ud31] {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.tenant-settings-inline-error[b-2y9sc3ud31] {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--wine);
    margin: 0 0 var(--sp-2);
}

.tenant-settings-add-hostname[b-2y9sc3ud31] {
    margin-top: 0.25rem;
}

.tenant-settings-actions[b-2y9sc3ud31] {
    flex-wrap: wrap;
}

.tenant-branding-layout[b-2y9sc3ud31] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
}

.tenant-branding-form-col[b-2y9sc3ud31] {
    flex: 1 1 28rem;
    min-width: 22rem;
}

.tenant-branding-color-row[b-2y9sc3ud31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tenant-branding-color-row[b-2y9sc3ud31]  .rz-colorpicker {
    flex: none;
}

.tenant-branding-hex[b-2y9sc3ud31] {
    width: 9rem;
}

.tenant-branding-warning[b-2y9sc3ud31] {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--wheat-deep);
    margin-top: 0.45rem;
}

.tenant-branding-switch[b-2y9sc3ud31] {
    gap: 0.5rem;
}

.tenant-branding-preview-col[b-2y9sc3ud31] {
    flex: 0 1 22rem;
    min-width: 18rem;
}

.tenant-branding-preview-frame[b-2y9sc3ud31] {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    overflow: hidden;
    background: var(--surface);
    box-shadow: var(--sh-1);
}

.tenant-branding-preview-nav[b-2y9sc3ud31] {
    padding: 0.75rem 1rem;
}

.tenant-branding-preview-name[b-2y9sc3ud31] {
    font-weight: 600;
}

.tenant-branding-preview-body[b-2y9sc3ud31] {
    background: var(--surface);
    padding: 1rem;
}

.tenant-branding-preview-card[b-2y9sc3ud31] {
    background: var(--surface-2);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xs);
    padding: 0.75rem;
    margin-bottom: 0.75rem;
}

.tenant-branding-preview-card-title[b-2y9sc3ud31] {
    font-weight: 600;
}

.tenant-branding-preview-card-copy[b-2y9sc3ud31] {
    font-size: var(--t--1);
    color: var(--ink-2);
}

.tenant-branding-preview-cta[b-2y9sc3ud31] {
    border: none;
    border-radius: var(--r-xs);
    padding: 0.5rem 1rem;
    font-weight: 600;
    min-height: 44px;
    box-shadow: var(--sh-1);
}

.tenant-branding-note[b-2y9sc3ud31] {
    font-size: var(--t--1);
    color: var(--ink-3);
    margin-top: 0.5rem;
}
/* /Components/Pages/Admin/Users/Index.razor.rz.scp.css */
/* Filter bar selects: intrinsic width + min to prevent collapsing. */
.users-filter-select[b-x2xtjrbt2r] { width: auto; min-width: 150px; }

/* In-panel section heading — editorial serif, one step below page h1. */
.users-panel-h[b-x2xtjrbt2r] {
  font-family: var(--serif);
  font-size: var(--t-1);
  font-weight: 500;
  margin: 0 0 var(--sp-3);
  color: var(--ink);
}
/* /Components/Pages/Beo/BulkExportDialog.razor.rz.scp.css */
/* BulkExportDialog — scoped styles for the Export BEOs dialog (Phase 44).
   Terroir tokens ONLY — no hex, no oklch literals. Spacing via --sp-*, type via --t-*,
   color via --ink-* / --surface. Only this component's own plain elements (bed-*) are styled;
   dialog chrome, buttons, pickers, alerts and the progress bar inherit the UI library's Terroir
   token remap (mud-terroir.css). */

.bed-body[b-pspgbey0no] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    padding-bottom: var(--sp-2);
}

/* From / To pickers side by side, wrapping on narrow dialogs */
.bed-range[b-pspgbey0no] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

/* Live count: total first, then the cancelled / no-BEO details on their own line */
.bed-count[b-pspgbey0no] {
    display: flex;
    flex-wrap: wrap;
    column-gap: var(--sp-2);
    row-gap: var(--sp-1);
    margin: 0;
    font-size: var(--t-0);
    color: var(--ink);
    line-height: 1.5;
}

.bed-count__total[b-pspgbey0no] {
    font-weight: 600;
}

.bed-count__detail[b-pspgbey0no] {
    font-size: var(--t--1);
    color: var(--ink-2);
}

.bed-status[b-pspgbey0no] {
    margin: 0;
    font-size: var(--t-0);
    color: var(--ink-2);
}

/* Rendering stage: bar then "Rendering N of M" */
.bed-rendering[b-pspgbey0no] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.bed-progress[b-pspgbey0no] {
    margin: 0;
    font-size: var(--t--1);
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

/* Done stage summary */
.bed-summary[b-pspgbey0no] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.bed-summary__headline[b-pspgbey0no] {
    margin: 0;
    font-size: var(--t-0);
    font-weight: 600;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.bed-summary__label[b-pspgbey0no] {
    margin: 0;
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--ink-2);
}

.bed-skipped[b-pspgbey0no],
.bed-list[b-pspgbey0no] {
    margin: 0;
    padding: var(--sp-2);
    list-style: none;
    background: var(--surface);
    border-radius: var(--r-sm);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    font-size: var(--t--1);
    color: var(--ink);
    line-height: 1.4;
}

.bed-skipped li[b-pspgbey0no] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1);
}

.bed-skipped__reason[b-pspgbey0no] {
    color: var(--ink-2);
}

.bed-download[b-pspgbey0no] {
    display: flex;
    justify-content: flex-start;
}

/* Footer: Close / Cancel / Export, right-aligned */
.bed-footer[b-pspgbey0no] {
    display: flex;
    gap: var(--sp-2);
    justify-content: flex-end;
    padding-top: var(--sp-2);
    flex-shrink: 0;
}
/* /Components/Pages/Beo/Edit.razor.rz.scp.css */
/* BEO editor (BEO-01..06 / 04-UI-SPEC decision A). One long sectioned form (NOT a wizard / tabs) with
   an anchored/sticky billing summary. Restyled onto the "Terroir" design system: an editorial document
   feel — warm paper canvas, crisp surface cards with hairline rules, Fraunces section headings carrying
   a leading numeral (the BEO "section key"), Space Grotesk body. Every token is theme-aware, so light
   and dark are both correct from terroir.css. Money is right-aligned and tabular. Functional palettes
   always pair color WITH a label/icon (never color alone) and meet WCAG 2.2 AA. ≥44px touch targets. */

/* ---- Two-column shell: document body + anchored billing rail ---------------------------------- */
.beo-editor[b-6etz1aiaxu] {
    display: flex;
    gap: var(--sp-4);
    align-items: flex-start;
}

.beo-editor-body[b-6etz1aiaxu] {
    flex: 1 1 auto;
    min-width: 0;
    /* Section headings auto-number 01, 02, … in document order (editorial key, like the BEO mockup).
       The billing aside sits outside this element, so its heading stays un-numbered. */
    counter-reset: beosec;
}

/* ---- Section cards — crisp editorial surfaces on the warm paper canvas ------------------------ */
.beo-section[b-6etz1aiaxu] {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--sh-1);
    padding: var(--sp-4);
    margin-bottom: var(--sp-3);
}

.beo-section-h[b-6etz1aiaxu] {
    display: flex;
    align-items: baseline;
    gap: var(--sp-2);
    font-family: var(--serif);
    font-weight: 500;
    font-size: var(--t-2);
    line-height: 1.1;
    letter-spacing: -0.012em;
    color: var(--ink);
    margin: 0 0 var(--sp-3);
}

/* Leading numeral = the editorial section key (decimal-leading-zero: 01, 02 …). */
.beo-editor-body > .beo-section > .beo-section-h[b-6etz1aiaxu]::before {
    counter-increment: beosec;
    content: counter(beosec, decimal-leading-zero);
    font-family: var(--serif);
    font-size: var(--t-3);
    font-weight: 500;
    line-height: 1;
    color: var(--wheat-deep);
    font-variant-numeric: tabular-nums;
}

/* Trailing hairline fills the row — the editorial rule under every section heading. */
.beo-section-h[b-6etz1aiaxu]::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: var(--line);
    align-self: center;
}

/* ---- Masthead (first section) — eyebrow + serif event title + facts sub-line ------------------ */
.beo-masthead[b-6etz1aiaxu] {
    background:
        linear-gradient(180deg, var(--pine-tint), transparent 78%),
        var(--surface);
}

.beo-h1[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-weight: 500;
    font-size: var(--t-4);
    line-height: 1.04;
    letter-spacing: -0.014em;
    color: var(--ink);
    margin: 0.15rem 0 0;
}

.beo-subtitle[b-6etz1aiaxu] {
    font-size: var(--t-0);
    line-height: 1.5;
    margin: var(--sp-1) 0 0;
    color: var(--ink-2);
}

.beo-dot[b-6etz1aiaxu] {
    margin: 0 0.45rem;
    color: var(--ink-3);
}

.beo-history-link[b-6etz1aiaxu] {
    font-weight: 600;
    color: var(--pine);
    text-decoration: none;
}

.beo-history-link:hover[b-6etz1aiaxu] {
    text-decoration: underline;
}

/* ---- Field labels / read-only values --------------------------------------------------------- */
.beo-label[b-6etz1aiaxu] {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--ink-2);
}

.beo-readonly-value[b-6etz1aiaxu] {
    font-size: var(--t-0);
    line-height: 1.5;
    margin: 0;
    color: var(--ink);
}

.beo-capacity-note[b-6etz1aiaxu] {
    color: var(--ink-3);
    font-size: var(--t--1);
}

.beo-number[b-6etz1aiaxu] {
    width: 100%;
}

.beo-package-select[b-6etz1aiaxu] {
    max-width: 240px;
}

.beo-template-toolbar[b-6etz1aiaxu] {
    display: flex;
    gap: var(--sp-2);
    flex-wrap: wrap;
    align-items: flex-end;
}

.beo-template-toolbar__group[b-6etz1aiaxu] {
    min-width: 240px;
}

.beo-template-toolbar__actions[b-6etz1aiaxu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

/* ---- Status control + freeze affordance ------------------------------------------------------ */
.beo-status-area[b-6etz1aiaxu] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--sp-1);
    min-width: 200px;
}

.beo-status-select[b-6etz1aiaxu] {
    min-width: 180px;
}

.beo-freeze[b-6etz1aiaxu] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: var(--t--1);
    font-weight: 600;
    /* Wine emphasis so the freeze reads unambiguously — color + lock icon + text (never color alone). */
    color: var(--wine);
}

.beo-freeze-icon[b-6etz1aiaxu] {
    font-size: 18px;
}

.beo-unlocked[b-6etz1aiaxu] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--pine);
}

.beo-unlocked-icon[b-6etz1aiaxu] {
    font-size: 18px;
}

/* ---- Dense tables: line items / run-of-show / wine / allergies / staff / guests / vendors ----- */
.beo-rows[b-6etz1aiaxu] {
    width: 100%;
    margin-bottom: var(--sp-2);
}

.beo-rows th[b-6etz1aiaxu] {
    font-size: var(--t--2);
    font-weight: 600;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ink-3);
    text-align: left;
    padding: 0 0.5rem 0.5rem;
    border-bottom: 1px solid var(--line);
}

.beo-rows td[b-6etz1aiaxu] {
    padding: var(--sp-2) 0.5rem;
    vertical-align: top;
    border-bottom: 1px solid var(--line-soft);
}

.beo-runofshow-cell[b-6etz1aiaxu] {
    min-width: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.beo-runofshow-text[b-6etz1aiaxu] {
    width: 100%;
    min-height: 88px;
    resize: vertical;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Row action icons still meet a comfortable tap target via min-size. */
.beo-row-action[b-6etz1aiaxu] {
    min-width: 36px;
    min-height: 36px;
}

/* ---- Staff assignment cards -------------------------------------------- */
.staff-assignment-list[b-6etz1aiaxu] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3, 1rem);
    margin-bottom: var(--sp-2, 0.5rem);
}

.staff-card[b-6etz1aiaxu] {
    border: 1px solid var(--line);
    border-radius: var(--radius-2, 6px);
    padding: var(--sp-3, 1rem);
    background: var(--surface-1);
}

.staff-card--loading[b-6etz1aiaxu],
.staff-card--error[b-6etz1aiaxu] {
    padding: var(--sp-3, 1rem);
    color: var(--ink-3);
}

.staff-card-header[b-6etz1aiaxu] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3, 1rem);
    margin-bottom: var(--sp-3, 1rem);
}

.staff-card-member[b-6etz1aiaxu] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 0.25rem);
}

.staff-card-time[b-6etz1aiaxu] {
    width: 120px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 0.25rem);
}

.staff-card-tasks[b-6etz1aiaxu] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--sp-3, 1rem);
}

@media (max-width: 768px) {
    .staff-card-tasks[b-6etz1aiaxu] {
        grid-template-columns: repeat(2, 1fr);
    }
}

.staff-task-field[b-6etz1aiaxu] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 0.25rem);
}

.staff-task-field textarea[b-6etz1aiaxu] {
    resize: vertical;
    min-height: 72px;
}

.staff-field-label[b-6etz1aiaxu] {
    font-size: var(--t--2);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ink-3);
    line-height: 1.4;
}

.staff-quickadd-button[b-6etz1aiaxu] {
    align-self: flex-start;
}

.staff-quickadd-panel[b-6etz1aiaxu] {
    margin-top: var(--sp-3, 1rem);
    padding-top: var(--sp-3, 1rem);
    border-top: 1px solid var(--line-soft);
}
/* ----------------------------------------------------------------------- */

/* Guest-list action button group — Add guest + Import from file side by side */
.beo-guest-actions[b-6etz1aiaxu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2, 0.5rem);
    align-items: center;
}

.beo-line-desc[b-6etz1aiaxu] {
    display: block;
    font-size: var(--t--1);
    color: var(--ink-3);
    margin-top: 0.25rem;
}

.beo-line-total[b-6etz1aiaxu] {
    font-size: var(--t-0);
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Pricing-basis chip — neutral, non-accent: Secondary surface + hairline + Label text. */
.beo-basis-chip[b-6etz1aiaxu] {
    display: inline-block;
    margin-top: 0.3rem;
    padding: 0.1rem 0.5rem;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    border: 1px solid var(--line);
    font-size: var(--t--2);
    font-weight: 600;
    line-height: 1.5;
    color: var(--ink-2);
}

/* PRICE-05: overridden-price annotation — the effective (overridden) price in emphasis with the frozen
   original struck beside it as "was {x}". Framed like .beo-basis-chip on the Secondary surface so it reads
   as an annotated state, not an error. Non-color cue = strike + "was" text (never hue). */
.beo-override-chip[b-6etz1aiaxu] {
    display: inline-flex;
    align-items: baseline;
    gap: var(--sp-1);
    margin-top: 0.3rem;
    padding: 0.1rem 0.5rem;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    border: 1px solid var(--line);
    font-variant-numeric: tabular-nums;
}

.beo-override-now[b-6etz1aiaxu] {
    font-size: var(--t-0);
    font-weight: 600;
    line-height: 1.5;
    color: var(--ink);
}

.beo-override-was[b-6etz1aiaxu] {
    font-size: var(--t--2);
    font-weight: 400;
    line-height: 1.5;
    color: var(--ink-3);
    text-decoration: line-through;
}

/* Required-reason validation error in the override dialog — wine tone + text (never color-alone). */
.beo-override-error[b-6etz1aiaxu] {
    margin-top: 0.3rem;
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--wine);
}

/* Neutral (non-wine) heading for a Draft/Confirmed override dialog — the Signed path escalates to
   .beo-warn-heading (--wine). Same serif type scale as the warn heading, subordinate to the danger tone. */
.beo-override-heading[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-size: var(--t-2);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.012em;
    color: var(--ink);
    margin: 0 0 var(--sp-2);
}

/* Pairing-note collapsed toggle (WINE-07 / D-03) — a full-width unstyled button that reveals the
   note field on click. Neutral: no accent, no hardcoded color/size — Terroir tokens only. */
.beo-pairing-collapsed[b-6etz1aiaxu] {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    text-align: left;
    cursor: pointer;
}

/* Collapsed one-line preview of an existing note — subordinate tone, truncated via .text-truncate. */
.beo-pairing-preview[b-6etz1aiaxu] {
    margin-top: 0.3rem;
    font-size: var(--t--2);
    line-height: 1.5;
    color: var(--ink-2);
}

/* Read-only note on a locked BEO (state e) — visible but subordinate; no editable field. */
.beo-pairing-readonly[b-6etz1aiaxu] {
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
}

/* Allergy flag (safety-critical) — wine tone, icon + text, AA contrast. */
.beo-allergy-icon[b-6etz1aiaxu] {
    font-size: 20px;
    color: var(--wine);
}

.beo-allergy-input[b-6etz1aiaxu] {
    border-color: var(--wine);
}

/* Per-section empty state (sub-empty) — muted, dashed, action-pointing. */
.beo-subempty[b-6etz1aiaxu] {
    padding: var(--sp-3);
    background: var(--surface-2);
    border-radius: var(--r-md);
    border: 1px dashed var(--line);
}

.beo-subempty strong[b-6etz1aiaxu] {
    font-size: var(--t-0);
    color: var(--ink);
}

.beo-subempty p[b-6etz1aiaxu] {
    margin: 0.25rem 0 0;
    color: var(--ink-3);
    font-size: var(--t--1);
}

/* ── Billing summary — anchored/sticky rail (desktop), the strongest secondary anchor. ────────── */
.beo-billing[b-6etz1aiaxu] {
    flex: 0 0 320px;
    position: sticky;
    top: calc(var(--topbar-h, 0px) + var(--sp-3));
    align-self: flex-start;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--sh-2);
    padding: var(--sp-4);
}

/* The rail's own heading: serif + trailing hairline, but no document numeral. */
.beo-billing .beo-section-h[b-6etz1aiaxu] {
    font-size: var(--t-1);
}

.beo-billing-row[b-6etz1aiaxu] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--sp-2);
    margin-bottom: var(--sp-2);
}

.beo-billing-label[b-6etz1aiaxu] {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--ink-2);
}

.beo-billing-value[b-6etz1aiaxu] {
    font-size: var(--t-0);
    line-height: 1.5;
    text-align: right;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

/* Charges block (D-03): neutral serif mini sub-label; a semibold block sum. No accent — charges are
   neutral-toned data like F&B lines (11-UI-SPEC color contract). Category sub-labels group display-only. */
.beo-billing-charges[b-6etz1aiaxu] {
    margin-bottom: var(--sp-2);
}

.beo-billing-sublabel[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-size: var(--t--1);
    font-weight: 500;
    color: var(--ink-2);
    margin: var(--sp-1) 0;
}

/* A category sub-header sits slightly indented under the "Charges" label (still neutral). */
.beo-billing-subcat[b-6etz1aiaxu] {
    font-size: var(--t--2);
    color: var(--ink-3);
    margin-left: var(--sp-1);
}

/* The transparent D-04 percentage line may wrap its "% of {basis} ($x)" detail on the narrow rail. */
.beo-billing-charge-label[b-6etz1aiaxu] {
    font-weight: 400;
    color: var(--ink-2);
}

.beo-billing-charges-total .beo-billing-label[b-6etz1aiaxu],
.beo-billing-charges-total .beo-billing-value[b-6etz1aiaxu] {
    font-weight: 600;
}

/* Balance due — the single most important total: serif figure, tabular. */
.beo-billing-balance[b-6etz1aiaxu] {
    border-top: 1px solid var(--line);
    padding-top: var(--sp-2);
    margin-top: var(--sp-1);
}

.beo-billing-balance .beo-billing-label[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-size: var(--t-1);
    font-weight: 500;
}

.beo-billing-balance .beo-billing-value[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-size: var(--t-3);
    font-weight: 500;
    color: var(--ink);
}

.beo-actions .beo-cta[b-6etz1aiaxu] {
    width: 100%;
}

/* ── Warn + override / reopen / generate dialog — modal over the form, never a hard block. ────── */
.beo-warn-backdrop[b-6etz1aiaxu] {
    position: fixed;
    inset: 0;
    background: oklch(0.18 0.03 160 / 0.5);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: var(--sp-3);
}

.beo-warn-dialog[b-6etz1aiaxu] {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: var(--sp-4);
    max-width: 480px;
    width: 100%;
    box-shadow: var(--sh-3);
}

.beo-warn-heading[b-6etz1aiaxu] {
    font-family: var(--serif);
    font-size: var(--t-2);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.012em;
    color: var(--wine);
    margin: 0 0 var(--sp-2);
}

.beo-warn-body[b-6etz1aiaxu] {
    font-size: var(--t-0);
    line-height: 1.5;
    margin: 0;
    color: var(--ink-2);
}

.beo-warn-body ul[b-6etz1aiaxu] {
    margin: var(--sp-2) 0 0;
    padding-left: 1.25rem;
}

/* ── Jump navigation — quick-links bar between masthead and numbered sections ────────────────── */
.beo-jump-nav[b-6etz1aiaxu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1);
    align-items: center;
    padding: var(--sp-2) var(--sp-3);
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    margin-bottom: var(--sp-3);
}

.beo-jump-link[b-6etz1aiaxu] {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.4;
    color: var(--pine);
    text-decoration: none;
    padding: 0.2rem var(--sp-2);
    border-radius: var(--r-pill);
    white-space: nowrap;
    transition: background 120ms ease, color 120ms ease;
}

.beo-jump-link:hover[b-6etz1aiaxu] {
    background: var(--pine-tint);
    color: var(--pine);
    text-decoration: none;
}

.beo-jump-link:focus-visible[b-6etz1aiaxu] {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
}

/* Scroll offset so sticky nav + autosave bar don't obscure the section heading on jump. */
.beo-section[id][b-6etz1aiaxu] {
    scroll-margin-top: calc(var(--nav-h, 60px) + var(--autosave-bar-h, 2.5rem) + var(--sp-2));
}

/* Narrow viewports: billing summary drops below the body and stops sticking. */
@media (max-width: 992px) {
    .beo-editor[b-6etz1aiaxu] {
        flex-direction: column;
    }

    .beo-billing[b-6etz1aiaxu] {
        position: static;
        flex-basis: auto;
        width: 100%;
    }

    .beo-status-area[b-6etz1aiaxu] {
        align-items: flex-start;
    }
}

/* ── Generate-document entry point + variant picker (DOC-01/D5-04) ─────────────────────────────── */

/* Neutral/secondary so Save BEO keeps the single accent CTA. ≥44px tappable (on-site tablets). */
.beo-generate-btn[b-6etz1aiaxu] {
    min-height: 44px;
}

.beo-generate-dialog[b-6etz1aiaxu] {
    max-width: 520px;
}

/* Output action, not a warning — neutral heading. */
.beo-generate-dialog .beo-warn-heading[b-6etz1aiaxu] {
    color: var(--ink);
}

.beo-variant-list[b-6etz1aiaxu] {
    border: 0;
    margin: var(--sp-1) 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

/* Each variant is a selectable option row; ≥44px tappable. */
.beo-variant-row[b-6etz1aiaxu] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2);
    min-height: 44px;
    padding: var(--sp-2);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.beo-variant-row:hover[b-6etz1aiaxu] {
    border-color: var(--brand);
    background: var(--surface-2);
}

.beo-variant-selected[b-6etz1aiaxu] {
    border-color: var(--brand);
    box-shadow: 0 0 0 1px var(--brand) inset;
}

.beo-variant-radio[b-6etz1aiaxu] {
    margin-top: 0.2rem;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    accent-color: var(--brand);
}

.beo-variant-text[b-6etz1aiaxu] {
    display: flex;
    flex-direction: column;
}

.beo-variant-label[b-6etz1aiaxu] {
    font-weight: 600;
    font-size: var(--t-0);
    line-height: 1.3;
    color: var(--ink);
}

.beo-variant-who[b-6etz1aiaxu] {
    font-size: var(--t--1);
    color: var(--ink-3);
    line-height: 1.3;
}

.beo-generate-pricing[b-6etz1aiaxu] {
    display: flex;
    align-items: center;
}

/* Informational DRAFT note — warm wheat callout, not destructive (D5-14). */
.beo-generate-draft-note[b-6etz1aiaxu] {
    font-size: var(--t--1);
    line-height: 1.4;
    color: var(--ink-2);
    background: var(--wheat-tint);
    border: 1px solid var(--wheat-deep);
    border-radius: var(--r-sm);
    padding: var(--sp-2);
    margin: 0;
}

.beo-generating[b-6etz1aiaxu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: var(--t--1);
    color: var(--ink-3);
    margin-right: auto; /* push the buttons to the right, spinner stays left */
}

.beo-spin[b-6etz1aiaxu] {
    font-size: 18px;
    animation: beo-spin-b-6etz1aiaxu 1s linear infinite;
}

@keyframes beo-spin-b-6etz1aiaxu {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Respect a reduced-motion preference — the spinner becomes a static glyph. */
@media (prefers-reduced-motion: reduce) {
    .beo-spin[b-6etz1aiaxu] {
        animation: none;
    }
}

/* ── BEO autosave status strip (BEO-08 / Phase 17) ─────────────────────────────────────────── */
/* Sticky bar between ValidationSummary and editor body; rendered only for existing BEOs.       */
.autosave-status[b-6etz1aiaxu] {
    position: sticky;
    top: var(--nav-h, 60px);
    z-index: 3;                         /* above billing rail (z=1); below top-nav (z=5) */
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-height: 2.25rem;
    padding: var(--sp-1) var(--sp-3);
    background: transparent;
    font-family: var(--font-body);
    font-size: var(--type-sm);
    line-height: 1.4;
    border-radius: var(--r-sm);
    transition: opacity 220ms ease, background 220ms ease;
    margin-bottom: var(--sp-2);
    opacity: 0;
    pointer-events: none;
}

/* Idle — strip is invisible but retains layout space */
.autosave-idle[b-6etz1aiaxu] {
    /* opacity:0 + pointer-events:none from base — nothing interactive */
}

/* Saving — pine tint with animated spinner */
.autosave-saving[b-6etz1aiaxu] {
    opacity: 1;
    pointer-events: auto;
    background: var(--pine-tint);
    color: var(--pine);
}

/* Saved — pine tint with checkmark */
.autosave-saved[b-6etz1aiaxu] {
    opacity: 1;
    pointer-events: auto;
    background: var(--pine-tint);
    color: var(--pine);
}

/* Error — wine tint */
.autosave-error[b-6etz1aiaxu] {
    opacity: 1;
    pointer-events: auto;
    background: var(--wine-tint);
    color: var(--wine);
}

/* Spinner icon */
.autosave-spinner[b-6etz1aiaxu] {
    display: inline-block;
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: autosave-spin-b-6etz1aiaxu 700ms linear infinite;
    flex-shrink: 0;
}

@keyframes autosave-spin-b-6etz1aiaxu {
    to { transform: rotate(360deg); }
}

/* Retry button inside the error strip */
.autosave-retry[b-6etz1aiaxu] {
    margin-left: auto;
    padding: 0.15em 0.6em;
    font-size: var(--type-xs, 0.75rem);
    border: 1px solid currentColor;
    border-radius: var(--r-sm);
    background: transparent;
    color: inherit;
    cursor: pointer;
    line-height: 1.5;
}

.autosave-retry:hover[b-6etz1aiaxu] {
    background: var(--wine-tint);
    opacity: 0.85;
}

@media (prefers-reduced-motion: reduce) {
    .autosave-spinner[b-6etz1aiaxu] {
        animation: none;
        border-top-color: currentColor;
        opacity: 0.6;
    }

    .autosave-status[b-6etz1aiaxu] {
        transition: none;
    }
}
/* /Components/Pages/Beo/GuestImportModal.razor.rz.scp.css */
/* ─── GuestImportModal scoped styles ────────────────────────────────────────
   All values are CSS variables from terroir.css / mud-terroir.css.
   NO hard-coded hex, oklch, or rgb literals — everything through tokens. */

/* ── Body ──────────────────────────────────────────────────────────────── */
.gim-body[b-anob5phocq] {
    padding: var(--sp-4, 1.25rem) var(--sp-4, 1.25rem) 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-3, 1rem);
    min-height: 0;
    overflow: hidden;
}

.gim-intro[b-anob5phocq] {
    margin: 0;
    font-size: var(--t-sm, 0.875rem);
    color: var(--ink-2, currentColor);
    line-height: 1.5;
}

.gim-intro a[b-anob5phocq] {
    color: var(--c-pine, currentColor);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── File input ─────────────────────────────────────────────────────────── */
.gim-upload[b-anob5phocq] {
    display: flex;
    align-items: center;
}

.gim-file-input[b-anob5phocq] {
    font-size: var(--t-sm, 0.875rem);
    color: var(--ink-1, currentColor);
    cursor: pointer;
}

/* ── Loading status ─────────────────────────────────────────────────────── */
.gim-status[b-anob5phocq] {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 0.5rem);
    font-size: var(--t-sm, 0.875rem);
    color: var(--ink-2, currentColor);
}

/* ── Parse error ────────────────────────────────────────────────────────── */
.gim-error[b-anob5phocq] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2, 0.5rem);
    padding: var(--sp-2, 0.5rem) var(--sp-3, 1rem);
    background: color-mix(in oklch, var(--c-oxblood, red) 10%, var(--surface-1, white));
    border: 1px solid color-mix(in oklch, var(--c-oxblood, red) 30%, transparent);
    border-radius: var(--radius-sm, 4px);
    font-size: var(--t-sm, 0.875rem);
    color: var(--ink-1, currentColor);
}

.gim-error .material-icons[b-anob5phocq] {
    font-size: 1.125rem;
    color: var(--c-oxblood, currentColor);
    flex-shrink: 0;
}

/* ── Summary line ───────────────────────────────────────────────────────── */
.gim-summary[b-anob5phocq] {
    display: flex;
    align-items: center;
    gap: var(--sp-3, 1rem);
    font-size: var(--t-sm, 0.875rem);
    font-weight: 600;
}

.gim-summary__valid[b-anob5phocq] {
    color: var(--c-pine, currentColor);
}

.gim-summary__invalid[b-anob5phocq] {
    color: var(--c-oxblood, currentColor);
}

/* ── Warning banner ─────────────────────────────────────────────────────── */
.gim-warning[b-anob5phocq] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2, 0.5rem);
    padding: var(--sp-2, 0.5rem) var(--sp-3, 1rem);
    background: color-mix(in oklch, var(--c-gold, goldenrod) 12%, var(--surface-1, white));
    border: 1px solid color-mix(in oklch, var(--c-gold, goldenrod) 40%, transparent);
    border-radius: var(--radius-sm, 4px);
    font-size: var(--t-sm, 0.875rem);
    color: var(--ink-1, currentColor);
}

.gim-warning .material-icons[b-anob5phocq] {
    font-size: 1.125rem;
    color: var(--c-gold, goldenrod);
    flex-shrink: 0;
}

/* ── Preview table wrapper ──────────────────────────────────────────────── */
.gim-preview-wrap[b-anob5phocq] {
    overflow-x: auto;
    overflow-y: auto;
    max-height: 340px;
    border: 1px solid var(--border-1, currentColor);
    border-radius: var(--radius-sm, 4px);
}

.gim-preview[b-anob5phocq] {
    width: 100%;
    margin-bottom: 0;
    font-size: var(--t-sm, 0.875rem);
    table-layout: fixed;
}

.gim-preview thead th[b-anob5phocq] {
    position: sticky;
    top: 0;
    background: var(--surface-2, white);
    border-bottom: 1px solid var(--border-1, currentColor);
    padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
    font-weight: 600;
    font-size: var(--t-xs, 0.75rem);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink-2, currentColor);
    white-space: nowrap;
}

.gim-preview tbody tr[b-anob5phocq] {
    border-bottom: 1px solid var(--border-subtle, transparent);
}

.gim-preview tbody td[b-anob5phocq] {
    padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Column widths */
.gim-col-status[b-anob5phocq]  { width: 56px; text-align: center; }
.gim-col-size[b-anob5phocq]    { width: 72px; text-align: center; }
.gim-col-dietary[b-anob5phocq] { width: 80px; text-align: center; }

/* ── Row states ─────────────────────────────────────────────────────────── */
.gim-row--valid[b-anob5phocq] {
    background: transparent;
}

.gim-row--invalid[b-anob5phocq] {
    background: color-mix(in oklch, var(--c-oxblood, red) 5%, var(--surface-1, white));
    color: var(--ink-2, currentColor);
    opacity: 0.8;
}

/* ── Status badges ──────────────────────────────────────────────────────── */
.gim-badge[b-anob5phocq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
}

.gim-badge--ok[b-anob5phocq] {
    background: color-mix(in oklch, var(--c-pine, green) 15%, var(--surface-1, white));
    color: var(--c-pine, green);
}

.gim-badge--err[b-anob5phocq] {
    background: color-mix(in oklch, var(--c-oxblood, red) 15%, var(--surface-1, white));
    color: var(--c-oxblood, red);
    cursor: help;
}

/* ── Invalid row name/reason ────────────────────────────────────────────── */
.gim-invalid-name[b-anob5phocq] {
    display: block;
    font-style: italic;
    color: var(--ink-2, currentColor);
}

.gim-invalid-reason[b-anob5phocq] {
    display: block;
    font-size: var(--t-xs, 0.75rem);
    color: var(--c-oxblood, red);
    white-space: normal;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.gim-footer[b-anob5phocq] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--sp-2, 0.5rem);
    padding: var(--sp-3, 1rem) var(--sp-4, 1.25rem);
    border-top: 1px solid var(--border-1, currentColor);
    margin-top: var(--sp-3, 1rem);
    flex-shrink: 0;
}
/* /Components/Pages/Beo/Index.razor.rz.scp.css */
.beo-row-actions[b-y29xblbd85] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.beo-status-chip[b-y29xblbd85] {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.58rem;
    border-radius: var(--r-pill);
    border: 1px solid transparent;
    font-size: var(--t--2);
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.1;
    white-space: nowrap;
}

.beo-status-chip--draft[b-y29xblbd85] {
    color: var(--ink-2);
    background: var(--surface-2);
    border-color: var(--line);
}

.beo-status-chip--confirmed[b-y29xblbd85] {
    color: var(--pine);
    background: var(--pine-tint);
    border-color: oklch(0.405 0.066 158 / 0.18);
}

.beo-status-chip--in-progress[b-y29xblbd85] {
    color: oklch(0.36 0.07 205);
    background: oklch(0.93 0.03 210);
    border-color: oklch(0.56 0.06 210 / 0.22);
}

.beo-status-chip--completed[b-y29xblbd85] {
    color: var(--ink-3);
    background: var(--paper-deep);
    border-color: var(--line-soft);
}

:deep(.beo-grid td.beo-actions-cell .rz-cell-data)[b-y29xblbd85] {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

:deep(.beo-grid .beo-row-action)[b-y29xblbd85] {
    margin-right: 0 !important;
}

/* D-05 (BEO-16): archived indicator chip — mirrors .beo-status-chip--completed token set.
   Additive alongside the status chip; never replaces it. Terroir tokens only (no hard-coded literals). */
.beo-archived-chip[b-y29xblbd85] {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.58rem;
    border-radius: var(--r-pill);
    border: 1px solid var(--line-soft);
    font-size: var(--t--2);
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.1;
    white-space: nowrap;
    color: var(--ink-3);
    background: var(--paper-deep);
    margin-left: 0.3rem;
}
/* /Components/Pages/Beo/RunOfShowTemplates.razor.rz.scp.css */
.rost-grid[b-twg7lwfulr] {
    margin-top: 0.75rem;
}

.rost-row-action[b-twg7lwfulr] {
    min-width: 36px;
    min-height: 36px;
}

.rost-panel-title[b-twg7lwfulr] {
    margin: 0 0 0.75rem;
    font-size: 1.15rem;
    font-weight: 600;
}

.rost-items th[b-twg7lwfulr] {
    font-size: 0.78rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}
/* /Components/Pages/Calendar.razor.rz.scp.css */
/* Calendar (EVENT-04 / D3-13..16) — restyled onto the "Terroir" design system.
   Scoped component CSS: every rule below is rewritten onto theme-aware tokens (terroir.css), so the
   page follows the light/dark toggle and the per-tenant accent automatically — no hardcoded colors.

   SCOPE NOTE: the page's OWN elements (filter bar + empty state + subscription panel) are themed
   directly by scope-attribute selectors. The <MudCalendar> is a child component whose internal chrome
   and the appointment-card template markup live INSIDE it, so Blazor's scoped-CSS attribute does NOT
   reach them — those rules use the `.calendar-host ::deep` wrapper below to cross the child boundary
   (viewport-fill height + the .cal-appt / .cal-tooltip card rules). Every value stays on Terroir tokens
   so light/dark + per-tenant accent follow automatically (no hardcoded colors). */

/* ----- Filter bar — warm secondary-surface panel (was a hardcoded cool slab) ------------------ */
.calendar-filters[b-rw4i608722] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2) var(--sp-3);
    padding: var(--sp-2) var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--sh-1);
}

.calendar-filter[b-rw4i608722] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 200px;
    flex: 1 1 200px;
}

.calendar-filter-label[b-rw4i608722] {
    font-family: var(--sans);
    font-size: var(--t--2);
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    line-height: 1.4;
    color: var(--ink-3);
    margin: 0;
}

.calendar-filter-control[b-rw4i608722] {
    width: 100%;
}

/* ----- Empty state — editorial warm panel above the scheduler (line 127) ---------------------- */
.calendar-empty[b-rw4i608722] {
    padding: var(--sp-3);
    margin-bottom: var(--sp-3);
    background: var(--surface);
    border: 1px dashed var(--line);
    border-radius: var(--r-md);
    text-align: center;
    color: var(--ink-2);
}

.calendar-empty-heading[b-rw4i608722] {
    font-family: var(--serif);
    font-weight: 500;
    font-size: var(--t-2);
    line-height: 1.15;
    color: var(--ink);
    margin: 0 0 0.4rem;
}

.calendar-subscription-panel[b-rw4i608722] {
    margin-top: var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--sh-1);
    overflow: clip;
}

.calendar-subscription-panel__summary[b-rw4i608722] {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
    padding: var(--sp-3);
    cursor: pointer;
}

.calendar-subscription-panel__summary[b-rw4i608722]::-webkit-details-marker {
    display: none;
}

.calendar-subscription-panel__summary-copy[b-rw4i608722] {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.calendar-subscription-panel__eyebrow[b-rw4i608722] {
    font-size: var(--t--2);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--ink-3);
    font-weight: 600;
}

.calendar-subscription-panel__title[b-rw4i608722] {
    font-family: var(--serif);
    font-size: var(--t-2);
    line-height: 1.2;
    color: var(--ink);
}

.calendar-subscription-panel__hint[b-rw4i608722] {
    color: var(--ink-2);
}

.calendar-subscription-panel__chevron[b-rw4i608722] {
    width: 0.8rem;
    height: 0.8rem;
    flex: none;
    border-right: 2px solid var(--ink-2);
    border-bottom: 2px solid var(--ink-2);
    transform: rotate(45deg);
    transition: transform 0.2s ease;
    margin-right: 0.2rem;
}

.calendar-subscription-panel[open] .calendar-subscription-panel__summary[b-rw4i608722] {
    border-bottom: 1px solid var(--line);
}

.calendar-subscription-panel[open] .calendar-subscription-panel__chevron[b-rw4i608722] {
    transform: rotate(225deg);
}

.calendar-subscription-panel__summary:focus-visible[b-rw4i608722] {
    outline: 2px solid var(--brand);
    outline-offset: -2px;
}

.calendar-subscription-card[b-rw4i608722] {
    padding: var(--sp-3);
    display: grid;
    gap: var(--sp-2);
}

.calendar-subscription-card__subtitle[b-rw4i608722],
.calendar-subscription-card__text[b-rw4i608722] {
    margin: 0;
    color: var(--ink-2);
}

.calendar-subscription-card__warning[b-rw4i608722] {
    margin: 0;
    color: var(--ink);
    font-weight: 600;
}

.calendar-subscription-links[b-rw4i608722] {
    display: grid;
    gap: 0.5rem;
}

.calendar-subscription-links__row[b-rw4i608722] {
    display: grid;
    gap: 0.35rem;
}

.calendar-subscription-links__label[b-rw4i608722] {
    font-size: var(--t--2);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ink-3);
    font-weight: 600;
}

.calendar-subscription-links__value[b-rw4i608722] {
    display: block;
    padding: 0.5rem 0.65rem;
    border-radius: var(--r-sm);
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: var(--ink);
    overflow-wrap: anywhere;
}

.calendar-subscription-actions[b-rw4i608722] {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.calendar-subscription-confirm[b-rw4i608722] {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-2);
    padding: 0.85rem;
    display: grid;
    gap: 0.65rem;
}

.calendar-subscription-confirm p[b-rw4i608722] {
    margin: 0;
    color: var(--ink-2);
}

.calendar-subscription-confirm__actions[b-rw4i608722] {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* ===== Calendar host + Heron chrome (scoped via ::deep) ======================================
   The <MudCalendar> renders as a child component; its chrome and the appointment-card template
   markup (.cal-appt / .cal-tooltip, emitted by this page's RenderFragment) sit INSIDE it, so the
   scope attribute never lands on them. `.calendar-host ::deep <selector>` crosses that boundary.
   These rules replace the retired global scheduler theme block for this page (that block is removed
   wholesale in Phase 39 — do NOT edit it here). */

.calendar-host[b-rw4i608722] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* Viewport-fill: Heron's Height is a px baseline; override it so the focal calendar fills the
   workspace instead of a short fixed box. `.mud-cal-container` is the best-known Heron container
   class from research — MEDIUM confidence; Plan 04's live smoke pins the real selector against the
   rendered DOM and adjusts --calendar-chrome-offset for the page head + filter bar. */
.calendar-host[b-rw4i608722]  .mud-cal-container {
    min-height: calc(100dvh - var(--calendar-chrome-offset, 260px));
}

/* Appointment card — editorial card keyed to lifecycle status. The status color arrives as the
   --evt-color custom property (set inline by the template); the card reads it for a warm tinted fill
   and a small status dot beside the always-rendered status LABEL, so status is color-coded WITHOUT
   relying on color alone (03-UI-SPEC). Ink text on a soft tint stays legible in light AND dark and
   against any per-tenant accent. */
.calendar-host[b-rw4i608722]  .cal-appt {
    display: flex;
    flex-direction: column;
    gap: 0.02rem;
    min-width: 0;
    height: 100%;
    /* CAL-01: stacking context for the absolute-positioned tooltip. */
    position: relative;
    border-radius: var(--r-xs);
    box-shadow: var(--sh-1);
    background: color-mix(in oklch, var(--evt-color, var(--pine)) 15%, var(--surface));
    color: var(--ink);
    padding: 0.18rem 0.5rem;
    /* CAL-01: visible so the absolute-positioned tooltip can escape the card clip. Individual text
       spans keep their own overflow:hidden + text-overflow:ellipsis for truncation. */
    overflow: visible;
    font-family: var(--sans);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}
/* CAL-01: lift the card on hover AND keyboard focus so the tooltip paints over sibling events. */
.calendar-host[b-rw4i608722]  .cal-appt:hover,
.calendar-host[b-rw4i608722]  .cal-appt:focus-within {
    transform: translateY(-1px);
    box-shadow: var(--sh-2);
    z-index: 10;
}

.calendar-host[b-rw4i608722]  .cal-appt__title {
    font-size: var(--t--1);
    font-weight: 600;
    line-height: 1.15;
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.calendar-host[b-rw4i608722]  .cal-appt__meta {
    font-size: var(--t--2);
    line-height: 1.15;
    color: var(--ink-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Start time is hidden by default (week/day views carry the time in their hour gutter). The month
   view has no gutter, so it reveals the time on the card — the month-view container selector is
   MEDIUM (Heron), pinned in the Plan 04 smoke. */
.calendar-host[b-rw4i608722]  .cal-appt__time {
    display: none;
}
.calendar-host[b-rw4i608722]  .mud-cal-month-view .cal-appt__time {
    display: block;
    font-size: var(--t--2);
    font-weight: 600;
    line-height: 1.15;
    color: var(--ink-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.calendar-host[b-rw4i608722]  .cal-appt__status {
    display: flex;
    align-items: center;
    gap: 0.34em;
    margin-top: auto;
    font-size: var(--t--2);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.15;
    color: color-mix(in oklch, var(--evt-color, var(--pine)) 42%, var(--ink));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.calendar-host[b-rw4i608722]  .cal-appt__status::before {
    content: "";
    flex: none;
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    background: var(--evt-color, var(--pine));
}

/* Tooltip stacking (CAL-01) — PINNED to Heron 4.0.0's REAL month DOM, verified live in the Plan 04
   smoke via Playwright DOM inspection + before/after screenshots. Heron positions each event as an
   ABSOLUTE `.mud-cal-drop-item` inside the (position:relative) `.mud-cal-month-row-holder`; there is
   NO `.mud-cal-month-cell` / `.mud-cal-cell-template` in an event's ancestor chain, and each event's
   inner `.mud-drop-item` carries a transform (its own stacking context). So a card's own z-index is
   trapped inside its event, and same-day events — later-in-DOM absolute siblings in the row — paint
   over an upper event's dropped-down tooltip. Fix: on hover OR keyboard focus, lift the hovered
   event's OWN `.mud-cal-drop-item` above its sibling events (same-day stacking), and lift the whole
   row-holder above sibling rows for a tooltip that bleeds into the week below. Heron's "+N more" hides
   overflow with visibility:hidden (`.mud-cal-overflow-hidden`), so this pure z-index change cannot
   affect it. */
.calendar-host[b-rw4i608722]  .mud-cal-drop-item:has(.cal-appt:hover),
.calendar-host[b-rw4i608722]  .mud-cal-drop-item:has(.cal-appt:focus-within) {
    z-index: 20;
}
.calendar-host[b-rw4i608722]  .mud-cal-month-row-holder:has(.cal-appt:hover),
.calendar-host[b-rw4i608722]  .mud-cal-month-row-holder:has(.cal-appt:focus-within) {
    z-index: 30;
}

/* ─── CAL-02: Edge containment ────────────────────────────────────────────────────────────────
   Verified live 2026-07-25 by walking a hovered card's ancestor chain in the rendered DOM: Heron
   clips its OWN chrome (`.mud-calendar` AND `.mud-calendar-container` both ship `overflow: hidden`)
   and the app shell clips the X axis (`main.page`, `.main`, `body` are `overflow-x: clip` in
   terroir.css). So a tooltip on a card at the calendar's edge was swallowed — it read as "the
   content is behind the page". `position: fixed` cannot rescue it either: Heron's inner
   `.mud-drop-item` carries a transform, which makes it the containing block for fixed descendants.
   Two-part fix:
   1. Unclip Heron's two containers so a tooltip can bleed DOWN out of the calendar box. Only the X
      axis is clipped further up the shell, so vertical bleed is safe — it paints over the panel
      below (the hovered card/row z-index lifts above already handle in-calendar stacking).
   2. Flip the tooltip to right-anchored for cards in the right-hand half of the grid, so it grows
      back INTO the calendar and can never reach the shell's X clip. Heron writes each event's
      column as an inline `inset-inline-start: <pct>%` on `.mud-cal-drop-item` (month = 0 /
      14.2857 / 28.5714 / 42.8571 / 57.1429 / 71.4286 / 85.7143; week adds sub-column offsets for
      overlapping events), so the substring selectors below match every value 50%–99%: the `:not()`
      pairs drop the single-digit values (`5%`, `7.1429%`, …) that share a first digit. Cards left
      of 50% keep the default drop-right — worst case there (42.8571% + a 22rem tooltip) still
      lands inside the grid. If a Heron upgrade changes that inline format the flip degrades to
      plain drop-right; it cannot break the card. */
.calendar-host[b-rw4i608722]  .mud-calendar,
.calendar-host[b-rw4i608722]  .mud-calendar-container {
    overflow: visible;
}

.calendar-host[b-rw4i608722]  .mud-cal-drop-item[style*="inset-inline-start: 5"]:not([style*="inset-inline-start: 5%"]):not([style*="inset-inline-start: 5."]) .cal-tooltip,
.calendar-host[b-rw4i608722]  .mud-cal-drop-item[style*="inset-inline-start: 6"]:not([style*="inset-inline-start: 6%"]):not([style*="inset-inline-start: 6."]) .cal-tooltip,
.calendar-host[b-rw4i608722]  .mud-cal-drop-item[style*="inset-inline-start: 7"]:not([style*="inset-inline-start: 7%"]):not([style*="inset-inline-start: 7."]) .cal-tooltip,
.calendar-host[b-rw4i608722]  .mud-cal-drop-item[style*="inset-inline-start: 8"]:not([style*="inset-inline-start: 8%"]):not([style*="inset-inline-start: 8."]) .cal-tooltip,
.calendar-host[b-rw4i608722]  .mud-cal-drop-item[style*="inset-inline-start: 9"]:not([style*="inset-inline-start: 9%"]):not([style*="inset-inline-start: 9."]) .cal-tooltip {
    left: auto;
    right: 0;
}

/* Week / Day views need their OWN signal: there Heron nests every event inside the day's
   `.mud-cal-week-cell-holder` grid column (child 1 is the 60px time gutter, children 2–8 are
   Sun–Sat) and writes the event's inline offset as `left: <pct>%` RELATIVE TO THAT COLUMN (0% /
   50% for side-by-side overlaps) — so the month selectors above cannot apply, and a percentage
   there says nothing about the position in the week. Flip by column instead: the last two days are
   where a 22rem tooltip would cross the week scroll port (`.mud-cal-week-scroll`, overflow-x: auto
   — overflowing it also pops a horizontal scrollbar). Day view has a single wide day column
   (nth-child(2)), so it keeps the default drop-right. Structure pinned live 2026-07-25. */
.calendar-host[b-rw4i608722]  .mud-cal-week-cell-holder:nth-child(7) .cal-tooltip,
.calendar-host[b-rw4i608722]  .mud-cal-week-cell-holder:nth-child(8) .cal-tooltip {
    left: auto;
    right: 0;
}

/* ─── CAL-01: Hover / focus tooltip ───────────────────────────────────────────────────────────
   Positioned below the appointment card; hidden by default; shown on :hover of the card OR when
   focus enters it (:focus-within, keyboard tab). High z-index so it paints above sibling cards inside
   the (now-lifted) hovered cell; the hovered row-holder/cell z-index bump above carries the whole
   subtree over neighbouring rows/cells (the card itself lifts to z-index: 10 on hover/focus). */
.calendar-host[b-rw4i608722]  .cal-tooltip {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 40;
    min-width: 13rem;
    /* max-content (clamped by max-width) — without it the shrink-to-fit width is capped by the
       CARD's width (~163px in month view), which forced every value onto 2-3 wrapped lines. */
    width: max-content;
    max-width: 22rem;
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    box-shadow: var(--sh-2);
    padding: var(--sp-2) var(--sp-3);
    font-family: var(--sans);
    font-size: var(--t--1);
    line-height: 1.4;
    pointer-events: none;
    /* hidden state */
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.15s ease, visibility 0s 0.15s;
}
.calendar-host[b-rw4i608722]  .cal-appt:hover .cal-tooltip,
.calendar-host[b-rw4i608722]  .cal-appt:focus-within .cal-tooltip {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.15s ease, visibility 0s 0s;
}
.calendar-host[b-rw4i608722]  .cal-tooltip__title {
    font-weight: 600;
    color: var(--ink);
    margin: 0 0 var(--sp-1);
    font-size: var(--t-0);
}
.calendar-host[b-rw4i608722]  .cal-tooltip__rows {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}
.calendar-host[b-rw4i608722]  .cal-tooltip__rows li {
    display: grid;
    grid-template-columns: 4rem 1fr;
    gap: 0.25rem;
    color: var(--ink-2);
}
.calendar-host[b-rw4i608722]  .cal-tooltip__label {
    font-weight: 600;
    color: var(--ink);
    font-size: var(--t--2);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    align-self: baseline;
}

/* Honor reduced-motion: drop the card state transitions. */
@media (prefers-reduced-motion: reduce) {
    .calendar-host[b-rw4i608722]  .cal-appt { transition: none; }
    .calendar-host[b-rw4i608722]  .cal-appt:hover,
    .calendar-host[b-rw4i608722]  .cal-appt:focus-within { transform: none; }
    .calendar-host[b-rw4i608722]  .cal-tooltip { transition: none; }
}
/* /Components/Pages/Clients/Edit.razor.rz.scp.css */
/* Constrain the form to a comfortable reading width — matches other edit forms. */
.client-form[b-a96rz82wa4] { max-width: 44rem; }

/* Section heading: "Contacts" — gets serif via global h2 rule but this adds breathing room. */
.client-section-h[b-a96rz82wa4] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: var(--sp-4) 0 var(--sp-2);
  color: var(--ink);
}

/* Contacts table: pin the Primary and action columns, let Name/Email/Phone flex. */
.client-contacts th:nth-child(4)[b-a96rz82wa4],
.client-contacts td:nth-child(4)[b-a96rz82wa4] { width: 5rem; text-align: center; }
.client-contacts th:last-child[b-a96rz82wa4],
.client-contacts td:last-child[b-a96rz82wa4]   { width: 3rem; }

.client-row-action[b-a96rz82wa4] { color: var(--ink-3); }
.client-actions[b-a96rz82wa4] { padding-top: var(--sp-1); }
/* /Components/Pages/EventStyles/Manage.razor.rz.scp.css */
.eventstyles-defaults[b-af58dwu1ys] {
    max-width: 70ch;
    margin-bottom: var(--sp-3);
}

.eventstyles-toggle[b-af58dwu1ys] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
}

.eventstyles-back[b-af58dwu1ys] {
    padding-inline: 0.2rem;
    font-weight: 600;
}

.eventstyles-add[b-af58dwu1ys] {
    max-width: 36rem;
}

.eventstyles-table[b-af58dwu1ys] {
    max-width: 52rem;
}

.eventstyles-col-status[b-af58dwu1ys] {
    width: 8.5rem;
}

.eventstyles-col-actions[b-af58dwu1ys] {
    width: 15rem;
}

.eventstyles-row-state[b-af58dwu1ys] {
    font-size: var(--t--1);
}

.eventstyles-inactive-badge[b-af58dwu1ys] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: var(--r-pill);
    background: var(--surface-2);
    border: 1px solid var(--line);
    color: var(--ink-2);
    font-size: var(--t--2);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.eventstyles-row-inactive td[b-af58dwu1ys] {
    color: var(--ink-2);
}
/* /Components/Pages/Events/DuplicateEventDialog.razor.rz.scp.css */
/* DuplicateEventDialog — scoped styles for the event-duplication confirm dialog.
   Terroir tokens ONLY — no hex, no oklch literals. Spacing via --sp-*, type via --t-*,
   color via --ink-* / --surface. Dialog chrome, button colors, and focus rings inherit
   from the UI component library's Terroir token remap (mud-terroir.css). */

/* Outer wrapper: vertical stack with generous section gaps */
.ded-body[b-ijuf5nc6dm] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    padding-bottom: var(--sp-2);
}

/* Intro sentence — --t-0 body weight */
.ded-intro[b-ijuf5nc6dm] {
    font-size: var(--t-0);
    color: var(--ink);
    line-height: 1.5;
    margin: 0;
}

/* Preview block — surface background, sm radius, compact row stack */
.ded-preview[b-ijuf5nc6dm] {
    background: var(--surface);
    border-radius: var(--r-sm);
    padding: var(--sp-2);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    /* Reset <dl> default margins */
    margin: 0;
}

.ded-preview__row[b-ijuf5nc6dm] {
    display: flex;
    gap: var(--sp-2);
    align-items: baseline;
}

/* Row key — small semibold label (--t--1) */
.ded-preview__key[b-ijuf5nc6dm] {
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--ink-2);
    min-width: 6rem;
    flex-shrink: 0;
    /* Reset <dt> default bold/margin */
    margin: 0;
    font-style: normal;
}

/* Row value — body weight (--t-0) */
.ded-preview__value[b-ijuf5nc6dm] {
    font-size: var(--t-0);
    color: var(--ink);
    line-height: 1.5;
    /* Reset <dd> default margin */
    margin: 0;
}

/* BEO opt-in block (only rendered when HasBeo) */
.ded-beo[b-ijuf5nc6dm] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

/* Checkbox + label on one baseline row */
.ded-beo__control[b-ijuf5nc6dm] {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

/* Helper text below the checkbox (--t--2, muted) */
.ded-beo__helper[b-ijuf5nc6dm] {
    font-size: var(--t--2);
    color: var(--ink-2);
    line-height: 1.4;
    margin: 0;
    padding-left: calc(var(--sp-1) + var(--sp-2)); /* indent under checkbox */
}

/* Footer: Cancel + Duplicate event, right-aligned */
.ded-footer[b-ijuf5nc6dm] {
    display: flex;
    gap: var(--sp-2);
    justify-content: flex-end;
    padding-top: var(--sp-2);
    /* Ensure the footer is not collapsed inside the dialog scroll area */
    flex-shrink: 0;
}
/* /Components/Pages/Events/Edit.razor.rz.scp.css */
/* Dialog styles (.event-conflict-backdrop / .event-conflict-dialog / .event-conflict-heading /
   .event-conflict-body / .event-conflict-actions) live in wwwroot/css/terroir.css (global) so
   the same styles apply here AND in Events/Index.razor — Blazor CSS isolation scopes per
   component, so shared markup needs a global rule. */

/* Ensure datepickers lay out as block-level controls under their labels. */
.event-label[b-jxwq45obf3] {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

/* Guest-count Min/Max: compact, inline inputs instead of full-width columns. */
.guest-count-range[b-jxwq45obf3] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}

.guest-count-field[b-jxwq45obf3] {
    display: flex;
    flex-direction: column;
}

.guest-count-input[b-jxwq45obf3] {
    max-width: 8rem;
}

.guest-count-sep[b-jxwq45obf3] {
    padding-top: 8px;
    color: var(--ink-2, inherit);
}

.event-status-chip[b-jxwq45obf3] {
    display: inline-block;
    width: fit-content;
    padding: 4px 10px;
    border-radius: var(--r-pill);
    color: var(--on-pine);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.status-inherited-note[b-jxwq45obf3] {
    display: inline-flex;
    align-items: flex-start;
    gap: var(--sp-1);
    width: fit-content;
    max-width: 100%;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--r-pill);
    background: var(--wheat-tint);
    color: var(--wheat-deep);
    font-size: var(--t--2);
    font-weight: 600;
    line-height: 1.3;
}

.status-inherited-note .material-icons[b-jxwq45obf3] {
    font-size: 1.1em;
    line-height: 1;
}

.status-inherited-note strong[b-jxwq45obf3] {
    display: block;
}

.status-inherited-note span span[b-jxwq45obf3] {
    display: block;
    font-weight: 400;
    margin-top: 2px;
}
/* /Components/Pages/Events/EventAiChangeReview.razor.rz.scp.css */
/* Phase 54 (54-09, D-06 / D-09): the AI change review page. Rules anchor on plain elements this page renders (never
   on a Mud component's Class, which a scoped rule cannot reach); Mud buttons and chips are reached with ::deep from a
   page-rendered wrapper. Canvas and checklist side by side, one column below 900px. */
.aic-root[b-i4llf0jl1i] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
}

.aic-head[b-i4llf0jl1i] {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  flex-wrap: wrap;
}

.aic-titles[b-i4llf0jl1i] { flex: 1 1 auto; min-width: 12rem; }
.aic-titles h1[b-i4llf0jl1i] { margin: 0; }

.aic-sub[b-i4llf0jl1i] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
}

.aic-room[b-i4llf0jl1i] { font-weight: 600; color: var(--ink, #3b332b); }

.aic-message[b-i4llf0jl1i] { margin: 0; }

.aic-body[b-i4llf0jl1i] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
  gap: var(--sp-3, 0.75rem);
  align-items: start;
}

.aic-canvas[b-i4llf0jl1i] { min-width: 0; }

.aic-panel[b-i4llf0jl1i] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2, 0.5rem);
  min-width: 0;
}

/* G22 (a): the impact line, computed from the ticked rows. */
.aic-impact[b-i4llf0jl1i] {
  margin: 0;
  font-weight: 600;
}

.aic-group[b-i4llf0jl1i] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1, 0.25rem);
}

.aic-group h3[b-i4llf0jl1i] {
  margin: 0;
  font-size: 1rem;
}

/* D-09: one checkbox per item; the whole row is the label. */
.aic-row[b-i4llf0jl1i] {
  display: flex;
  gap: var(--sp-2, 0.5rem);
  align-items: flex-start;
  cursor: pointer;
  margin: 0;
  padding: var(--sp-1, 0.25rem) 0;
}

.aic-row input[type="checkbox"][b-i4llf0jl1i] {
  margin-top: 0.2rem;
  flex: 0 0 auto;
}

.aic-row-text[b-i4llf0jl1i] {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow-wrap: anywhere;
}

.aic-row-name[b-i4llf0jl1i] { font-weight: 600; }

.aic-row-summary[b-i4llf0jl1i] {
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

.aic-select[b-i4llf0jl1i] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2, 0.5rem);
}

.aic-notes-title[b-i4llf0jl1i] {
  margin: 0;
  font-size: 1rem;
}

/* T-54-29: model text is plain, encoded text; its own line breaks are kept. */
.aic-notes[b-i4llf0jl1i] {
  margin: 0;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

/* CP13 / G22 (b): the notes caption, standing or partial. */
.aic-caption[b-i4llf0jl1i] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
  font-style: italic;
}

/* G22 (c) / G11: a caution the coordinator should read before accepting. Wheat tokens, so it follows light / dark. */
.aic-caution[b-i4llf0jl1i] {
  margin: 0;
  padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
  border-left: 3px solid var(--wheat-line);
  color: var(--wheat-ink);
}

/* CP4: a proposal with no rows. */
.aic-empty[b-i4llf0jl1i] {
  margin: 0;
  font-weight: 600;
}

.aic-state[b-i4llf0jl1i] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
}

.aic-state-links[b-i4llf0jl1i] { margin: 0; }

.aic-readonly[b-i4llf0jl1i] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
  color: var(--ink-3, #6b5f52);
  font-weight: 600;
}

.aic-actions[b-i4llf0jl1i] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
}

.aic-reasons[b-i4llf0jl1i] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1, 0.25rem);
  width: 100%;
}

.aic-reasons-label[b-i4llf0jl1i] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

/* 54-12 D-11 / D-13 / race: the seat shortfall, the stale-base banner and the Accept-click race line. Never softened,
   never disabling Accept. The amber palette comes from the global .change-notice class (wwwroot/css/terroir.css) the
   markup also carries; this scoped rule keeps layout only, because a scoped border-left / background / color would
   outrank the global class (quick 261015-mmh). */
.aic-stale[b-i4llf0jl1i],
.aic-seats[b-i4llf0jl1i],
.aic-race[b-i4llf0jl1i] {
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
}

/* 54-15 WR-01 / G12 (54-AI-SPEC §6): the merged plan's people above the room's recorded capacity, with the 53
   proposal page's .aip-capacity values. A plain page-rendered p, so scoped CSS applies. Display only. */
.aic-capacity[b-i4llf0jl1i] {
  margin: 0;
  padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
  border-left: 3px solid var(--wheat-line);
  color: var(--wheat-ink);
}

/* 54-12 D-10: what the ticked rows introduce that blocks Accept, in the plan editor's warning red (the wine tokens,
   as .alert-danger, so it follows light / dark). */
.aic-blocking[b-i4llf0jl1i],
.aic-server-blocking[b-i4llf0jl1i] {
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 4px solid var(--wine);
  background: var(--wine-tint);
  color: var(--wine);
}

.aic-blocking h3[b-i4llf0jl1i] {
  margin: 0 0 var(--sp-1, 0.25rem);
  font-size: 1rem;
}

.aic-blocking ul[b-i4llf0jl1i],
.aic-server-blocking ul[b-i4llf0jl1i] {
  margin: 0;
  padding-left: 1.25rem;
  overflow-wrap: anywhere;
}

/* D-10: the canvas's own warnings (already in the plan) never block. */
.aic-warnings-note[b-i4llf0jl1i] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

/* D-14: a row the coordinator edited since the request (both versions shown) and one deleted since (not tickable). */
.aic-row.is-changed-since[b-i4llf0jl1i] {
  border-left: 3px solid var(--wheat-line);
  padding-left: var(--sp-2, 0.5rem);
}

.aic-row.is-deleted-since[b-i4llf0jl1i] {
  cursor: not-allowed;
  opacity: 0.7;
}

.aic-row.is-deleted-since .aic-row-name[b-i4llf0jl1i] { text-decoration: line-through; }

/* D-10: a ticked row whose item is part of a clash the picks introduce. */
.aic-row.is-blocking[b-i4llf0jl1i] {
  border-left: 3px solid var(--wine);
  padding-left: var(--sp-2, 0.5rem);
}

.aic-row-conflict[b-i4llf0jl1i] {
  color: var(--wheat-ink);
  font-size: 0.8125rem;
  font-weight: 600;
}

.aic-row-since[b-i4llf0jl1i] {
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

/* D-06 (53 D-17): canvas and checklist stack in one column on a phone or narrow tablet. */
@media (max-width: 900px) {
  .aic-body[b-i4llf0jl1i] { grid-template-columns: minmax(0, 1fr); }
}

/* D-06 (53 D-17): on a touch screen every checklist row, Accept, Discard, the reason chips and Select all / none are
   44 px finger targets. Anchored on the page-rendered wrappers and reaching the Mud components with ::deep. */
@media (any-pointer: coarse) {
  .aic-row[b-i4llf0jl1i] { min-height: 44px; align-items: center; }

  .aic-actions[b-i4llf0jl1i]  .mud-button-root,
  .aic-actions[b-i4llf0jl1i]  .mud-chip,
  .aic-select[b-i4llf0jl1i]  .mud-button-root {
    min-height: 44px;
    min-width: 44px;
  }
}
/* /Components/Pages/Events/EventAiProposal.razor.rz.scp.css */
/* Phase 53 (53-07, D-05 / D-07 / D-17): the AI draft review page. Rules anchor on plain elements this page renders
   (never on a Mud component's Class, which a scoped rule cannot reach); Mud buttons and chips are reached with ::deep
   from a page-rendered wrapper. Notes and preview side by side, one column below 900px. */
.aip-root[b-c2ykgmaeji] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
}

.aip-head[b-c2ykgmaeji] {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  flex-wrap: wrap;
}

.aip-titles[b-c2ykgmaeji] { flex: 1 1 auto; min-width: 12rem; }
.aip-titles h1[b-c2ykgmaeji] { margin: 0; }

.aip-sub[b-c2ykgmaeji] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
}

.aip-room[b-c2ykgmaeji] { font-weight: 600; color: var(--ink, #3b332b); }

.aip-message[b-c2ykgmaeji] { margin: 0; }

/* D-07: the seat shortfall, above the preview. Never softened. The amber palette comes from the global .change-notice
   class the markup also carries; this scoped rule keeps layout only (quick 261015-mmh). */
.aip-shortfall[b-c2ykgmaeji] {
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
}

.aip-body[b-c2ykgmaeji] {
  display: grid;
  grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
  gap: var(--sp-3, 0.75rem);
  align-items: start;
}

.aip-side[b-c2ykgmaeji] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2, 0.5rem);
  min-width: 0;
}

.aip-canvas[b-c2ykgmaeji] { min-width: 0; }

/* T-53-30: model text is plain, encoded text; its own line breaks are kept. */
.aip-notes[b-c2ykgmaeji] {
  margin: 0;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

/* AI-SPEC: the standing caption under every proposal. */
.aip-caption[b-c2ykgmaeji] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
  font-style: italic;
}

/* G11 / G12 / review round 1: cautions the coordinator should read before accepting. */
.aip-caution[b-c2ykgmaeji],
.aip-capacity[b-c2ykgmaeji],
.aip-repair-stopped[b-c2ykgmaeji] {
  margin: 0;
  padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
  border-left: 3px solid var(--wheat-line);
  color: var(--wheat-ink);
}

.aip-issues-title[b-c2ykgmaeji] {
  margin: 0;
  font-size: 1rem;
}

.aip-issues[b-c2ykgmaeji] {
  margin: var(--sp-1, 0.25rem) 0 0;
  padding-left: 1.25rem;
  color: var(--wine);
}

.aip-actions[b-c2ykgmaeji] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
}

.aip-reasons[b-c2ykgmaeji] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-1, 0.25rem);
  width: 100%;
}

.aip-reasons-label[b-c2ykgmaeji] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

.aip-state[b-c2ykgmaeji] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
}

.aip-readonly[b-c2ykgmaeji] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
  color: var(--ink-3, #6b5f52);
  font-weight: 600;
}

/* D-17: preview, banner and notes stack in one column on a phone or narrow tablet. */
@media (max-width: 900px) {
  .aip-body[b-c2ykgmaeji] { grid-template-columns: minmax(0, 1fr); }
}

/* D-17: on a touch screen Accept, Discard and the reason chips are 44 px finger targets. Anchored on the page-rendered
   .aip-actions wrapper and reaching the Mud components with ::deep. */
@media (any-pointer: coarse) {
  .aip-actions[b-c2ykgmaeji]  .mud-button-root,
  .aip-actions[b-c2ykgmaeji]  .mud-chip {
    min-height: 44px;
    min-width: 44px;
  }
}
/* /Components/Pages/Events/EventFloorPlans.razor.rz.scp.css */
/* PLAN-03 / D-08: the event plans page. Styles anchor on plain elements the page renders (never a Mud Class,
   Pitfall 31). Same tokens as RoomDetail.razor.css. */
.efp-page[b-378b6homar] { max-width: 60rem; }

.efp-event[b-378b6homar] {
  margin: 0;
  color: var(--ink-2);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  align-items: baseline;
}

.efp-event-title[b-378b6homar] { font-weight: 600; color: var(--ink); }
.efp-sep[b-378b6homar] { color: var(--ink-3); }

.efp-readonly[b-378b6homar] {
  margin: 0 0 var(--sp-4);
  color: var(--ink-3);
  font-style: italic;
}

.efp-empty[b-378b6homar],
.efp-not-found[b-378b6homar] { color: var(--ink-2); }

.efp-room[b-378b6homar] {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  margin-bottom: var(--sp-4);
  background: var(--surface);
}

.efp-room-head[b-378b6homar] {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-2);
}

.efp-room-h[b-378b6homar] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: 0;
  color: var(--ink);
}

.efp-room-size[b-378b6homar] { color: var(--ink-3); font-size: 0.875rem; }

.efp-room-actions[b-378b6homar] { margin-left: auto; }

.efp-noplan[b-378b6homar] { margin: 0; color: var(--ink-3); }

.efp-plans[b-378b6homar] {
  list-style: none;
  margin: 0;
  padding: 0;
}

.efp-row[b-378b6homar] {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) 8rem 4rem max-content;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-1) 0;
  border-top: 1px solid var(--line-soft);
}

.efp-row:first-child[b-378b6homar] { border-top: 0; }

.efp-name[b-378b6homar] { color: var(--ink); }

/* Phase 56 (D-15 / MEDIA-03): an uploaded drawing's preview before its name. The whole drawing stays visible
   (contain) on white, so line art still reads in the dark theme. A plain img the page renders, never a Mud Class. */
.efp-thumb[b-378b6homar] {
  width: 40px;
  height: 40px;
  object-fit: contain;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  vertical-align: middle;
  margin-right: var(--sp-2);
}

/* Phase 56 (D-18): storage missing or down, shown once above the room cards. */
.efp-storage-note[b-378b6homar] {
  margin: 0 0 var(--sp-4);
  color: var(--ink-2);
}
.efp-seats[b-378b6homar] { color: var(--ink-2); font-variant-numeric: tabular-nums; }

.efp-warn[b-378b6homar] {
  display: inline-block;
  padding: 0 var(--sp-2);
  border-radius: var(--r-pill);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--wheat-ink);
  background: var(--wheat-tint);
}

.efp-action[b-378b6homar] { text-align: right; white-space: nowrap; }

/* Phase 58 (D-18 / D-19): "Changed since signed, rev 4 to 6" / "New since shared" under the row, in the amber "changed"
   palette: the shared global .change-notice in wwwroot/css/terroir.css, backed by the --wheat-line / --wheat-tint /
   --wheat-ink tokens so it reads in both themes (quick 261015-ldu). Plain spans the page renders, so scoped CSS reaches
   them; the scoped .efp-row-changed rule keeps layout only and must not redeclare border-left, background or color.
   The wrapper takes its own full-width grid line (row 2), so the name, seats, warning and actions keep row 1; a long
   label wraps instead of widening the row on a phone. */
.efp-row-changes[b-378b6homar] {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1) var(--sp-2);
  min-width: 0;
}

.efp-row-changed[b-378b6homar] {
  display: inline-block;
  max-width: 100%;
  padding: 0 var(--sp-2);
  font-size: 0.8rem;
}

/* D-16: plans hidden by a removed room (or of the alternate location). Collapsed and muted. */
.efp-other[b-378b6homar] {
  margin-top: var(--sp-4);
  color: var(--ink-3);
}

.efp-other > summary[b-378b6homar] {
  cursor: pointer;
  font-size: 0.9rem;
}

.efp-other-list[b-378b6homar] {
  list-style: none;
  margin: var(--sp-2) 0 0;
  padding: 0;
}

.efp-other-row[b-378b6homar] {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 1fr) max-content;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-1) 0;
  border-top: 1px solid var(--line-soft);
}

.efp-other-row .efp-name[b-378b6homar] { color: var(--ink-2); }
.efp-other-reason[b-378b6homar] { font-size: 0.875rem; font-style: italic; }

/* Phase 53 (D-12): the daily AI limit, shown only when it blocks (no meter, no figures). */
.efp-ai-cap[b-378b6homar] {
  margin: 0 0 var(--sp-4);
  color: var(--ink-2);
}

/* Phase 53 (D-17): Add plan and Draft with AI wrap under the room name on a narrow screen. Phase 56 (D-11): Upload
   drawing is the third button; the same wrap keeps all three inside a 390 px phone with no horizontal scroll. */
.efp-room-actions[b-378b6homar] {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  max-width: 100%;
}

@media (max-width: 599.98px) {
  .efp-room-actions[b-378b6homar] {
    margin-left: 0;
    flex-basis: 100%;
  }

  /* Phase 56: on a phone a row is the name and seats, then its actions on their own line, wrapping (Open and
     Download PDF first), so a row with a thumbnail never scrolls sideways. */
  .efp-row[b-378b6homar] {
    grid-template-columns: minmax(0, 1fr) max-content;
  }

  .efp-action[b-378b6homar] {
    grid-column: 1 / -1;
    white-space: normal;
    text-align: left;
  }

  /* The badges follow the name and seats in source order on a phone (the actions line comes last). */
  .efp-row-changes[b-378b6homar] {
    grid-row: auto;
  }
}

/* D-17: on a touch screen the room-card actions are 44 px finger targets. Anchored on the page-rendered wrapper and
   reaching the Mud buttons with ::deep (a rule on a Mud component's Class would match nothing). */
@media (any-pointer: coarse) {
  .efp-room-actions[b-378b6homar]  .mud-button-root {
    min-height: 44px;
    min-width: 44px;
  }
}

/* Phase 57 (57-08, D-14): the short note beside a disabled Share with client button (a page-rendered span). */
.efp-share-note[b-378b6homar] {
  color: var(--ink-3);
  font-size: 0.875rem;
}
/* /Components/Pages/Events/EventPlanEditor.razor.rz.scp.css */
/* PLAN-03 / Phase 50 D-08 / D-10: the full-page event-plan editor, copied from LayoutEditor.razor.css. Rules anchor on
   plain elements this page renders (never on a Mud component's Class, which a scoped rule cannot reach). Palette |
   canvas | inspector, one column below 900px. */
.fp-editor-root[b-8tlsfauj1g] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
}

.fp-editor-head[b-8tlsfauj1g] {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  flex-wrap: wrap;
}

.fp-editor-titles[b-8tlsfauj1g] { flex: 1 1 auto; min-width: 12rem; }
.fp-editor-titles h1[b-8tlsfauj1g] { margin: 0; }

/* D-10: event title · date · guests · room. */
.fp-editor-event[b-8tlsfauj1g] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--sp-2, 0.5rem);
}

.fp-editor-event-title[b-8tlsfauj1g] { font-weight: 600; color: var(--ink, #3b332b); }

.fp-editor-actions[b-8tlsfauj1g] {
  display: flex;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
}

.fp-editor-status[b-8tlsfauj1g] { color: var(--ink-3, #6b5f52); font-weight: 600; }
.fp-editor-findings[b-8tlsfauj1g] { margin: var(--sp-1, 0.25rem) 0 0; padding-left: 1.25rem; }

/* D-12: why this plan opens read-only. */
.fp-editor-readonly[b-8tlsfauj1g] {
  margin: 0;
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
  border-left: 3px solid var(--line, #e0d6c6);
  color: var(--ink-3, #6b5f52);
}

.fp-editor-toolbar[b-8tlsfauj1g] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2, 0.5rem);
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line, #e0d6c6);
  padding-bottom: var(--sp-2, 0.5rem);
}

.fp-editor-tools[b-8tlsfauj1g],
.fp-editor-counts[b-8tlsfauj1g] {
  display: flex;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
  flex-wrap: wrap;
}

/* 50-09 (D-25 / EDIT-04): the totals bar, the D-24 note and the D-12 banner. Plain elements only. The warnings list
   rules moved with the list into FloorPlanWarningsPanel.razor.css (Phase 52 D-07). */
.epe-totals[b-8tlsfauj1g] { gap: 0; }
.epe-totals-main[b-8tlsfauj1g] { font-weight: 600; }
.epe-totals-warn[b-8tlsfauj1g] { color: var(--wine); font-weight: 600; white-space: pre; }
/* Phase 52 D-07 / D-25: the tight-aisle count, a soft warning in amber, apart from the red ⚠ count. */
.epe-totals-aisles[b-8tlsfauj1g] { color: var(--wheat-ink); font-weight: 600; white-space: pre; }

.epe-note[b-8tlsfauj1g] {
  margin: 0;
  color: var(--ink-3, #6b5f52);
  font-size: 0.875rem;
}

.epe-readonly[b-8tlsfauj1g] { font-weight: 600; }

/* Phase 58 (58-11, D-20): the signed-plan and upload banners, in the amber "changed" palette: the shared global
   .change-notice in wwwroot/css/terroir.css, backed by the --wheat-line / --wheat-tint / --wheat-ink tokens so it reads
   in both themes (quick 261015-ldu). This rule keeps layout only and must not redeclare border-left, background or
   color. A plain p, never a Mud Class. */
.epe-signed-banner[b-8tlsfauj1g] {
  margin: 0 0 var(--sp-2, 0.5rem);
  padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
}

.fp-editor-body[b-8tlsfauj1g] {
  display: grid;
  grid-template-columns: 13rem minmax(0, 1fr) 15rem;
  gap: var(--sp-3, 0.75rem);
  align-items: start;
}

.fp-editor-body[hidden][b-8tlsfauj1g] { display: none; }

/* 50-09 smoke S8: the read-only editor has no palette column. */
.fp-editor-body.epe-viewonly[b-8tlsfauj1g] { grid-template-columns: minmax(0, 1fr) 15rem; }

.fp-editor-palette[b-8tlsfauj1g],
.fp-editor-inspector[b-8tlsfauj1g] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2, 0.5rem);
  max-height: 70vh;
  overflow-y: auto;
}

/* 50-07: the palette and inspector markup lives in the shared FloorPlanPalette / FloorPlanInspector components, so
   these rules reach it with ::deep from the page-rendered asides (never from a Mud component's Class, Pitfall 31). */
.fp-editor-palette[b-8tlsfauj1g]  .fp-palette-group { display: flex; flex-direction: column; gap: 0.25rem; }

.fp-editor-palette[b-8tlsfauj1g]  .fp-palette-heading,
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-heading {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-3, #6b5f52);
  margin: var(--sp-2, 0.5rem) 0 0.25rem;
}

.fp-editor-palette[b-8tlsfauj1g]  .fp-palette-item {
  text-align: left;
  border: 1px solid var(--line, #e0d6c6);
  background: var(--surface, #fff);
  color: var(--ink, #3b332b);
  border-radius: 4px;
  padding: 0.3rem 0.5rem;
  font-size: 0.875rem;
  cursor: pointer;
}

.fp-editor-palette[b-8tlsfauj1g]  .fp-palette-item:hover,
.fp-editor-palette[b-8tlsfauj1g]  .fp-palette-item:focus-visible { border-color: var(--wine); }

.fp-editor-canvas[b-8tlsfauj1g] {
  border: 1px solid var(--line, #e0d6c6);
  border-radius: 4px;
  overflow: hidden;
  min-width: 0;
}

.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-empty,
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-locked { color: var(--ink-3, #6b5f52); margin: 0; }
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-actions { display: flex; gap: var(--sp-2, 0.5rem); margin-top: var(--sp-2, 0.5rem); }
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-readonly { display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 0.75rem; margin: 0; }
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-readonly dt { color: var(--ink-3, #6b5f52); font-weight: 600; }
.fp-editor-inspector[b-8tlsfauj1g]  .fp-inspector-readonly dd { margin: 0; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .fp-editor-body[b-8tlsfauj1g],
  .fp-editor-body.epe-viewonly[b-8tlsfauj1g] { grid-template-columns: minmax(0, 1fr); }
  .fp-editor-palette[b-8tlsfauj1g],
  .fp-editor-inspector[b-8tlsfauj1g] { max-height: none; }
}

/* 52-08 (D-20): on a touch screen the toolbar and head buttons (Undo, Redo, Zoom, Fit, Save) are 44 px finger targets.
   Anchored on page-rendered wrappers, reaching the Mud buttons with ::deep. */
@media (any-pointer: coarse) {
    .fp-editor-toolbar[b-8tlsfauj1g]  .mud-button-root,
    .fp-editor-actions[b-8tlsfauj1g]  .mud-button-root {
        min-height: 44px;
        min-width: 44px;
    }
}

/* Phase 54 (D-03 / 53 D-12): the AI change line and the cap sentence under the toolbar. The Change with AI button sits
   inside .fp-editor-toolbar, so the coarse-pointer rule above already gives it a 44 px target. */
.epe-ai-line[b-8tlsfauj1g] {
    margin: 0 0 var(--sp-2, 0.5rem);
}

.epe-ai-cap[b-8tlsfauj1g] {
    margin: 0 0 var(--sp-1, 0.25rem);
    color: var(--ink-3, #6b5f52);
    font-size: 0.875rem;
}
/* /Components/Pages/Events/Index.razor.rz.scp.css */
/* Lifecycle status chip (D3-14 / 03-UI-SPEC). Status is encoded by BOTH color AND label text — never
   color alone (line 102). Background + text color are set per [data-status] below using Terroir tokens
   so dark mode, tenant themes, and OKLCH palette are all respected with zero hex literals. */

.event-status-chip[b-fz891cd22w] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

/* Per-status token palette. Uses OKLCH values on-palette or Terroir custom properties.
   text/bg pairings verified ≥ 4.5:1 contrast (WCAG 2.2 AA).
   Cancelled is de-emphasized (opacity 0.75) per 03-UI-SPEC line 100. */
.event-status-chip[data-status="inquiry"][b-fz891cd22w] {
    background: var(--line);
    color: var(--ink-2);
}
.event-status-chip[data-status="tentative"][b-fz891cd22w] {
    background: var(--wheat-tint);
    color: var(--wheat-ink);
}
.event-status-chip[data-status="contracted"][b-fz891cd22w] {
    background: var(--sky-tint);
    color: var(--sky-deep);
}
.event-status-chip[data-status="confirmed"][b-fz891cd22w] {
    background: var(--pine);
    color: var(--on-pine);
}
.event-status-chip[data-status="completed"][b-fz891cd22w] {
    background: var(--surface-2);
    color: var(--ink-2);
}
.event-status-chip[data-status="cancelled"][b-fz891cd22w] {
    background: var(--wine-tint);
    color: var(--wine);
    opacity: 0.75;
}

/* EVENT-10 (v1.8 UAT) — two-line event row. Token-driven per the Terroir contract (no hex literals in
   new work). Primary line: Title + Status chip. Meta line: Client · Lead · Location · Type · Start, with
   CSS-generated "·" separators so omitted segments never leave a dangling dot. Hierarchy reads Title
   (--ink) > meta (--ink-2) > inactive/separators (--ink-3). */
.event-cell[b-fz891cd22w] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    padding: var(--sp-1) 0;
}

.event-cell__title[b-fz891cd22w] {
    font-weight: 600;
    font-size: var(--t-0);
    color: var(--ink);
    line-height: 1.3;
}

.event-cell__meta[b-fz891cd22w] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    font-size: var(--t--1);
    color: var(--ink-2);
    line-height: 1.5;
}

.event-cell__meta-row[b-fz891cd22w] {
    white-space: normal;
}

.event-cell__meta-item + .event-cell__meta-item[b-fz891cd22w]::before {
    content: "·";
    margin: 0 var(--sp-1);
    color: var(--ink-3);
}

/* Quick task 260817-evg — dedicated Date/Time column: date stacked above time (or "All day"), mirroring
   .event-cell's own primary/secondary hierarchy (title = ink, meta = ink-2). Token-driven only. */
.event-datetime-cell[b-fz891cd22w] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.event-datetime-cell__date[b-fz891cd22w] {
    color: var(--ink);
    font-size: var(--t--1);
}

.event-datetime-cell__time[b-fz891cd22w] {
    color: var(--ink-2);
    font-size: var(--t--2);
}

/* Top-align every cell so the Status chip and row actions line up with the event Title's first line
   (the Event cell is two lines tall). ::deep reaches the grid-rendered <td>s through the scoped
   .events-bucket__body anchor — see the "Scoping anchor" note in the mobile block below. */
.events-bucket__body[b-fz891cd22w]  .events-grid td {
    vertical-align: top;
}

/* EVENT-07 / EVENT-02 — shared class for all row-action icon buttons (BEO / Duplicate / Edit columns).
   Ensures the ≥44px interactive hit target required by WCAG 2.2 AA §2.5.8. Token-driven only. */
.events-row-action[b-fz891cd22w] {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Loading skeleton shown on initial page load (events is null). */
.events-empty-state p[b-fz891cd22w] {
    font-style: italic;
}

/* Reloading indicator shown during filter re-queries. Subtle — users already see the grid. */
.events-reloading[b-fz891cd22w] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--r-sm);
    font-family: var(--sans);
    font-size: var(--t--1);
    color: var(--ink-2);
    margin-bottom: var(--sp-1);
}

.events-reloading .material-icons[b-fz891cd22w] {
    font-size: 1rem;
    animation: events-spin-b-fz891cd22w 1s linear infinite;
}

@keyframes events-spin-b-fz891cd22w {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .events-reloading .material-icons[b-fz891cd22w] {
        animation: none;
    }
}


.events-filter-bar[b-fz891cd22w] {
    --events-filter-border: var(--ink-3);
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--line-soft);
    background: var(--surface);
    font-family: var(--sans);
    position: sticky;
    top: var(--topbar-h, 0);
    z-index: 10;
}

/* Quick task 261008-pog: the wrapped row of facets moved onto this panel div (Index.razor wraps the
   7 facets and Clear all in it) so the phone block can hide it as one unit. Desktop paints as before. */
.events-filter-facets[b-fz891cd22w] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--sp-3);
}

/* Phone-only "Filters" toggle. Hidden by default; only the phone block below displays it. */
.events-filter-toggle[b-fz891cd22w] {
    display: none;
    align-items: center;
    gap: var(--sp-1);
    min-height: 44px;
    padding: var(--sp-1) var(--sp-2);
    background: none;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    color: var(--ink);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    /* Intentionally NOT setting outline: none/0 here — the browser's native visible focus ring
       must be preserved for keyboard users (WCAG 2.2 AA). */
}

.events-filter-toggle__chevron[b-fz891cd22w] {
    transition: transform .15s ease;
}

.events-filter-bar.is-expanded .events-filter-toggle__chevron[b-fz891cd22w] {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    .events-filter-toggle__chevron[b-fz891cd22w] {
        transition: none;
    }
}

.events-filter-facet[b-fz891cd22w] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    flex: 0 1 auto;
    min-width: 11rem;
    max-width: 16rem;
}

.events-filter-facet label[b-fz891cd22w] {
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--ink-2);
}

.events-filter-clear[b-fz891cd22w] {
    align-self: flex-end;
    margin-top: auto;
}

/* ----- Phone filter collapse (quick task 261008-pog) ---------------------- */
/* 599px is MudBlazor's xs boundary, the same width at which the events grid already turns into
   cards. The second clause catches a phone held in landscape (short and touch-first). Tablets are at
   least 600px wide and 768px tall, so they match neither clause and keep the full bar.
   position: static because a sticky bar taller than the viewport is what hid the list on phones;
   an opened panel now scrolls away with the page. An opened panel is one full-width column of
   controls and finger targets, the same one-column-under-a-breakpoint pattern as 53-06 and 53-07.
   Every selector here targets an element Index.razor renders itself, so the scope attribute lands
   on a real element. */
@media (max-width: 599px), (max-height: 500px) and (any-pointer: coarse) {
    .events-filter-bar[b-fz891cd22w] {
        position: static;
    }

    .events-filter-toggle[b-fz891cd22w] {
        display: inline-flex;
    }

    .events-filter-bar:not(.is-expanded) .events-filter-facets[b-fz891cd22w] {
        display: none;
    }

    .events-filter-facets[b-fz891cd22w] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--sp-2);
        margin-top: var(--sp-2);
    }

    .events-filter-facet[b-fz891cd22w] {
        min-width: 0;
        max-width: none;
    }
}

.page-head .eyebrow[b-fz891cd22w] {
    color: var(--ink-2);
}

.events-result-count[b-fz891cd22w] {
    margin: var(--sp-2) 0 var(--sp-1);
    font-family: var(--sans);
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--ink-2);
}

.events-empty-state[b-fz891cd22w],
.empty-state[b-fz891cd22w] {
    padding: var(--sp-4);
    text-align: center;
}

.events-empty-state h2[b-fz891cd22w],
.empty-state h2[b-fz891cd22w] {
    font-family: var(--serif);
    font-size: var(--t-2);
    color: var(--ink);
}

.events-empty-state p[b-fz891cd22w],
.empty-state p[b-fz891cd22w] {
    color: var(--ink-2);
}

@media (prefers-reduced-motion: reduce) {
    .events-empty-state[b-fz891cd22w],
    .empty-state[b-fz891cd22w],
    .event-conflict-dialog[b-fz891cd22w] {
        transition: none !important;
        animation: none !important;
    }
}

/* BEO-09: non-interactive label shown in the BEO column when an event has NoBeoRequired=true.
   Wheat-palette tint/ink for a warm, muted look — distinct from the green primary action buttons.
   Not a button: no cursor:pointer, no hover state. Token-driven only (no hard-coded literals). */
.beo-exempt[b-fz891cd22w] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: var(--r-pill);
    font-size: var(--t--2);
    font-family: var(--sans);
    font-weight: 600;
    letter-spacing: .03em;
    white-space: nowrap;
    background: var(--wheat-tint);
    color: var(--wheat-deep);
}

/* ----- Mobile responsive grid (< 940 px) -------------------------------- */
/* Column order: Event(1) | Date/Time(2) | BEO(3) | Status(4) | Public(5) | Duplicate(6) |
   Add dates to series(7) | Edit(8) | Delete(9).
   SCHED-05 / D-16 added column 7 immediately after Duplicate, deliberately AFTER the two
   already-hidden columns so 5 and 6 keep their meaning; it is a secondary series action of the same
   priority as Duplicate and is hidden with it.
   At < 940 px hide columns 5 (Public), 6 (Duplicate) and 7 (Add dates) so the primary BEO action
   stays visible without requiring horizontal scroll on a typical 390 px phone.
   The Event cell is capped at 40 vw to prevent the table expanding to max-content width.
   Edit + Delete remain visible at the far right for users who swipe to see them.
   See the "Scoping anchor" note on the hide rule below for why it starts at .events-bucket__body. */
@media (max-width: 939px) {
    /* Constrain the Event cell so the table doesn't expand to max-content width. */
    .event-cell[b-fz891cd22w] {
        max-width: 40vw;
        overflow: hidden;
    }
    /* Truncate long event titles with an ellipsis — the meta rows wrap naturally. */
    .event-cell__title[b-fz891cd22w] {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* Hide Public (5th), Duplicate (6th) and Add dates to series (7th) at narrow widths.
       Scoping anchor: ::deep is required because the <th>/<td>s are rendered by the data grid child
       component. Blazor puts the scope attribute on the element LEFT of ::deep, so the selector is
       anchored on .events-bucket__body, the wrapper div this page renders itself. The grid's own
       class sits on the child component's root, which never carries the attribute, so a
       grid-class-first selector compiles but matches nothing — the Phase 36 data-grid migration
       (28d2f5e) regression found by Phase 46 smoke F.6. */
    .events-bucket__body[b-fz891cd22w]  .events-grid th:nth-child(5),
    .events-bucket__body[b-fz891cd22w]  .events-grid td:nth-child(5),
    .events-bucket__body[b-fz891cd22w]  .events-grid th:nth-child(6),
    .events-bucket__body[b-fz891cd22w]  .events-grid td:nth-child(6),
    .events-bucket__body[b-fz891cd22w]  .events-grid th:nth-child(7),
    .events-bucket__body[b-fz891cd22w]  .events-grid td:nth-child(7) {
        display: none;
    }
}

/* ----- Compact phone rows (quick task 261008-quz) ------------------------- */
/* On phones the data grid falls back to its own CSS-only card mode: every cell becomes a flex row
   with a printed field label (Event / Date/Time / BEO / Status) and each icon button gets a row of
   its own, so only about two events fit on a screen. This block replaces that card with a compact
   grid row: title and status chip / one secondary line / date and time / actions.
   Why the phone query: it is the same definition of "phone" as the Filters toggle above, so the
   toggle and the compact rows always appear together. The rules are self-sufficient (they hide the
   header, turn table and tbody into blocks and remove the label pseudo-element) because a phone held
   in landscape still gets a table: the grid's card mode is width-only.
   Why a second block placed here: it must come after the 939 px block to undo that block's 40vw cap
   on the Event cell, and the first phone block is gated as page-anchored only (no ::deep).
   Specificity: the .events-bucket__body anchor plus the scope attribute beats the grid's card rules.
   The grid's last-cell rules rank higher, which is why the delete cell repeats padding and border.
   The 939 px hide outranks the plain cell rule here, so Public, Duplicate and Add dates stay hidden.
   Cells are placed by position (1-4, 8 and 9); EventsIndexCompactPhoneRowTests pins that order. */
@media (max-width: 599px), (max-height: 500px) and (any-pointer: coarse) {
    .events-bucket__body[b-fz891cd22w]  .events-grid thead {
        display: none;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid colgroup {
        display: none;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid table {
        display: block;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody {
        display: block;
        border-top: none;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "event status status"
            "when when when"
            "beo edit delete";
        align-items: center;
        column-gap: var(--sp-1);
        row-gap: calc(var(--sp-1) / 2);
        padding: var(--sp-1) var(--sp-2);
        border-bottom: 1px solid var(--line-soft);
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody tr:last-child {
        border-bottom: none;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td {
        display: block;
        min-width: 0;
        padding: 0;
        border: none;
    }

    /* Removes the Event / Date/Time / BEO / Status field labels the card mode prints. */
    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td::before {
        content: none;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(1) {
        grid-area: event;
        align-self: start;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(2) {
        grid-area: when;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(3) {
        grid-area: beo;
        justify-self: start;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(4) {
        grid-area: status;
        justify-self: end;
        align-self: start;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(8) {
        grid-area: edit;
        justify-self: end;
    }

    .events-bucket__body[b-fz891cd22w]  .events-grid tbody td:nth-child(9) {
        grid-area: delete;
        justify-self: end;
        padding: 0;
        border: none;
    }

    /* Finger-sized targets for Open BEO / Create BEO, Edit and Delete (53-06 / 53-07 pattern). */
    .events-bucket__body[b-fz891cd22w]  .events-grid tbody .mud-button-root {
        min-height: 44px;
        min-width: 44px;
    }

    /* Inner lines (page-rendered cell markup, so no ::deep). The secondary line is one line with an
       ellipsis per the agreed wireframe; the full text stays in the DOM for assistive tech and on the
       event page. */
    .event-cell[b-fz891cd22w] {
        max-width: none;
        padding: 0;
        gap: calc(var(--sp-1) / 2);
    }

    .event-cell__meta[b-fz891cd22w] {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .event-cell__meta-row[b-fz891cd22w] {
        display: inline;
        white-space: nowrap;
    }

    .event-cell__meta-row + .event-cell__meta-row[b-fz891cd22w]::before {
        content: "·";
        margin: 0 var(--sp-1);
        color: var(--ink-3);
    }

    .event-datetime-cell[b-fz891cd22w] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0;
    }

    .event-datetime-cell__time[b-fz891cd22w] {
        font-size: var(--t--1);
    }

    .event-datetime-cell__time[b-fz891cd22w]::before {
        content: "·";
        margin: 0 var(--sp-1);
        color: var(--ink-3);
    }
}

/* Quick task 260814-p8s (D-01..D-06) — time-bucketed collapsible section headers. Token-driven
   only (no hardcoded colors/sizes), consistent with the Terroir contract used everywhere else in
   this file. */
.events-bucket + .events-bucket[b-fz891cd22w] {
    border-top: 1px solid var(--line-soft);
    margin-top: var(--sp-3);
    padding-top: var(--sp-2);
}

.events-bucket__header[b-fz891cd22w] {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
    width: 100%;
    min-height: 44px;
    padding: var(--sp-1) 0;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font: inherit;
    /* Intentionally NOT setting outline: none/0 here — the browser's native visible focus ring
       must be preserved for keyboard users (WCAG 2.2 AA). */
}

.events-bucket__chevron[b-fz891cd22w] {
    transition: transform .15s ease;
}

.events-bucket__chevron.is-expanded[b-fz891cd22w] {
    transform: rotate(90deg);
}

@media (prefers-reduced-motion: reduce) {
    .events-bucket__chevron[b-fz891cd22w] {
        transition: none;
    }
}

.events-bucket__title[b-fz891cd22w] {
    font-family: var(--serif);
    font-size: var(--t-1);
    color: var(--ink);
    font-weight: 600;
    margin: 0;
}

.events-bucket__count[b-fz891cd22w] {
    font-family: var(--sans);
    font-size: var(--t--1);
    color: var(--ink-2);
    font-weight: 600;
}

/* /Components/Pages/EventTypes/Manage.razor.rz.scp.css */
.eventtypes-defaults[b-jlb8tscwpb] {
    max-width: 70ch;
    margin-bottom: var(--sp-3);
}

.eventtypes-back[b-jlb8tscwpb] {
    padding-inline: 0.2rem;
    font-weight: 600;
}

.eventtypes-add[b-jlb8tscwpb] {
    max-width: 36rem;
}

.eventtypes-table[b-jlb8tscwpb] {
    max-width: 44rem;
}

.eventtypes-col-actions[b-jlb8tscwpb] {
    width: 12.5rem;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Home dashboard layout — scoped to Home.razor. Uses Terroir tokens (loaded globally).
   Most chrome reuses global Terroir classes (.page-head, .figs, .panel, .event-card, .pill);
   this only adds the dashboard's two-column grid and a few list/empty states. */

.dash-grid[b-3xojdxxyoh] {
    display: grid;
    gap: var(--sp-3);
    grid-template-columns: 1fr;
    margin-top: var(--sp-4);
}

.dash-cards[b-3xojdxxyoh] {
    display: grid;
    gap: var(--sp-2);
}

.dash-list[b-3xojdxxyoh] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.dash-list li[b-3xojdxxyoh] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--line-soft);
}

.dash-list li:last-child[b-3xojdxxyoh] {
    border-bottom: 0;
}

.dash-list__main[b-3xojdxxyoh] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.dash-list__title[b-3xojdxxyoh] {
    font-weight: 600;
    color: var(--ink);
}

.dash-list__meta[b-3xojdxxyoh] {
    font-size: var(--t--2);
    color: var(--ink-3);
}

.dash-list li .btn[b-3xojdxxyoh] {
    margin-left: auto;
    flex: none;
}

.status-guide[b-3xojdxxyoh] {
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-2);
    border-bottom: 1px solid var(--line-soft);
}

.status-guide h4[b-3xojdxxyoh] {
    margin: 0 0 0.5rem;
    font-size: var(--t--2);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink-3);
}

.status-guide ul[b-3xojdxxyoh] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.status-guide li[b-3xojdxxyoh] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.status-guide li .pill[b-3xojdxxyoh] {
    flex: none;
    min-width: 5.5rem;
    justify-content: center;
}

.status-guide li span:last-child[b-3xojdxxyoh] {
    font-size: var(--t--2);
    color: var(--ink-2);
}

.dash-empty[b-3xojdxxyoh] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
    padding: var(--sp-3) 0;
    color: var(--ink-2);
}

.dash-empty__title[b-3xojdxxyoh] {
    font-family: var(--serif);
    font-size: var(--t-1);
    color: var(--ink);
}

.dash-allset[b-3xojdxxyoh] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: var(--sp-2) 0;
    color: var(--ink-2);
}

.dash-allset .material-icons[b-3xojdxxyoh] {
    color: var(--pine);
    font-size: 26px;
}

@media (min-width: 980px) {
    .dash-grid[b-3xojdxxyoh] {
        grid-template-columns: 1.5fr 1fr;
    }
}
/* /Components/Pages/Menu/Index.razor.rz.scp.css */
/* MENU-05: secondary catalog CTAs (Import / Add package) are MudButton
   Variant.Outlined. Their contrast/hover/focus treatment is supplied by the
   UI component library's Terroir token remap (mud-terroir.css) — no scoped
   override is needed here. Verified by the two-theme smoke (Wave 5). */
/* /Components/Pages/Menu/Packages.razor.rz.scp.css */
/* Constrain the editor form to a comfortable reading width. */
.package-form[b-70zqady507] { max-width: 44rem; }

/* Section heading: "Items in this package". */
.menu-section-h[b-70zqady507] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: var(--sp-4) 0 var(--sp-2);
  color: var(--ink);
}

/* Package items table: scoped column widths (replaces inline style="width:…" on <th>). */
.menu-package-items-edit .menu-col-basis[b-70zqady507]  { width: 180px; }
.menu-package-items-edit .menu-col-qty[b-70zqady507]    { width: 130px; }
.menu-package-items-edit td:last-child[b-70zqady507],
.menu-package-items-edit th:last-child[b-70zqady507]    { width: 3rem; }

.menu-row-action[b-70zqady507] { color: var(--ink-3); }
.menu-actions[b-70zqady507] { padding-top: var(--sp-1); }
/* /Components/Pages/OperatorDocs/BeoBuilderGuide.razor.rz.scp.css */
.operator-guide[b-ot9ilrid3b] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-ot9ilrid3b],
.operator-guide h3[b-ot9ilrid3b] {
    margin-top: 0;
}

.operator-guide ol[b-ot9ilrid3b],
.operator-guide ul[b-ot9ilrid3b] {
    padding-left: 1.25rem;
}
/* /Components/Pages/OperatorDocs/BeoStatusAndHistoryGuide.razor.rz.scp.css */
.operator-guide[b-rtp8prsdnu] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-rtp8prsdnu],
.operator-guide h3[b-rtp8prsdnu] {
    margin-top: 0;
}

.operator-guide ol[b-rtp8prsdnu],
.operator-guide ul[b-rtp8prsdnu] {
    padding-left: 1.25rem;
}
/* /Components/Pages/OperatorDocs/EventOperationsGuide.razor.rz.scp.css */
.operator-guide[b-5nhd3zu6hz] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-5nhd3zu6hz],
.operator-guide h3[b-5nhd3zu6hz] {
    margin-top: 0;
}

.operator-guide ol[b-5nhd3zu6hz],
.operator-guide ul[b-5nhd3zu6hz] {
    padding-left: 1.25rem;
}
/* /Components/Pages/OperatorDocs/MenuCatalogGuide.razor.rz.scp.css */
.operator-guide[b-hdtbk4hrhl] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-hdtbk4hrhl],
.operator-guide h3[b-hdtbk4hrhl] {
    margin-top: 0;
}

.operator-guide ol[b-hdtbk4hrhl],
.operator-guide ul[b-hdtbk4hrhl] {
    padding-left: 1.25rem;
}
/* /Components/Pages/OperatorDocs/TemplatesAndCloningGuide.razor.rz.scp.css */
.operator-guide[b-dfq2t1dw11] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-dfq2t1dw11],
.operator-guide h3[b-dfq2t1dw11] {
    margin-top: 0;
}

.operator-guide ol[b-dfq2t1dw11],
.operator-guide ul[b-dfq2t1dw11] {
    padding-left: 1.25rem;
}
/* /Components/Pages/OperatorDocs/View.razor.rz.scp.css */
.operator-docs-view[b-fv3d5zgf75] {
    display: grid;
    gap: 1rem;
}

.operator-docs-view :deep(.operator-guide)[b-fv3d5zgf75] {
    border: 1px solid var(--rz-base-300, #d5cfd1);
    border-radius: 0.75rem;
    padding: 1rem;
    background: var(--rz-base-50, #f8f5f6);
}

.operator-docs-view :deep(.operator-guide__toc ul)[b-fv3d5zgf75] {
    margin-bottom: 0;
}

.operator-docs-view :deep(.operator-guide section)[b-fv3d5zgf75] {
    margin-top: 1.5rem;
}

.operator-docs-view :deep(.operator-guide h2)[b-fv3d5zgf75] {
    margin-bottom: 0.75rem;
}

.operator-docs-view :deep(.operator-guide .operator-guide__troubleshooting)[b-fv3d5zgf75] {
    border-left: 0.25rem solid var(--rz-primary, #712f79);
    padding-left: 0.75rem;
}
/* /Components/Pages/OperatorDocs/WineProgramGuide.razor.rz.scp.css */
.operator-guide[b-e9fgnu44ip] {
    display: grid;
    gap: 1rem;
}

.operator-guide h2[b-e9fgnu44ip],
.operator-guide h3[b-e9fgnu44ip] {
    margin-top: 0;
}

.operator-guide ol[b-e9fgnu44ip],
.operator-guide ul[b-e9fgnu44ip] {
    padding-left: 1.25rem;
}
/* /Components/Pages/Venues/Edit.razor.rz.scp.css */
/* Constrain the form to a comfortable reading width — matches other edit forms. */
.venue-form[b-t0u8yp8oor] { max-width: 44rem; }

/* Section heading: "Rooms" — breathing room above the nested table. */
.venue-section-h[b-t0u8yp8oor] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: var(--sp-4) 0 var(--sp-2);
  color: var(--ink);
}

/* Rooms table: scoped column widths (replaces inline style="width:…" on <th>). */
.venue-rooms-edit .venue-col-capacity[b-t0u8yp8oor] { width: 140px; }
.venue-rooms-edit .venue-col-type[b-t0u8yp8oor]     { width: 180px; }
.venue-rooms-edit td:last-child[b-t0u8yp8oor],
.venue-rooms-edit th:last-child[b-t0u8yp8oor]       { width: 3rem; }

.venue-row-action[b-t0u8yp8oor] { color: var(--ink-3); }
.venue-actions[b-t0u8yp8oor] { padding-top: var(--sp-1); }

/* PLAN-08 (D-10 / D-11): compact capacity chart + room-page link under a saved room's name. Anchored on the
   page-rendered div (never a Mud Class). */
.venue-room-layouts[b-t0u8yp8oor] {
  display: flex;
  align-items: baseline;
  gap: var(--sp-2);
  margin-top: var(--sp-1);
  flex-wrap: wrap;
}

.venue-room-layouts-link[b-t0u8yp8oor] {
  font-size: 0.85rem;
  white-space: nowrap;
}

/* D-10 (55-06): a saved room's cover thumbnail beside its capacity chart. Anchored on the page's own table (never a
   Mud Class). */
table.venue-rooms-edit .venue-room-cover[b-t0u8yp8oor] {
  width: 3rem;
  height: 3rem;
  object-fit: cover;
  border-radius: var(--r-sm);
  align-self: center;
  flex: none;
}
/* /Components/Pages/Venues/FloorPlansIndex.razor.rz.scp.css */
/* Quick 261017-jzo: the Floor Plans list. Anchored on page-rendered plain elements only (scoped CSS on a Mud
   component's Class never applies). */
.floor-plans-room-link[b-97yqjepi2m] { text-decoration: none; }
.floor-plans-room-link:hover[b-97yqjepi2m],
.floor-plans-room-link:focus-visible[b-97yqjepi2m] { text-decoration: underline; }

/* The room page's .layout-default marker. --ink-2 keeps 4.5:1 on the dark-mode row hover (--surface-2), where --wine drops to about 3.9:1. */
.floor-plans-table .floor-plans-default[b-97yqjepi2m] {
  margin-left: var(--sp-2);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-2);
}

.floor-plans-scroll[b-97yqjepi2m] { width: 100%; overflow-x: auto; }
.floor-plans-scroll:focus-visible[b-97yqjepi2m] { outline: 2px solid var(--ink-2); outline-offset: 2px; }

.floor-plans-table .floor-plans-actions[b-97yqjepi2m] { white-space: nowrap; text-align: right; }
/* /Components/Pages/Venues/Index.razor.rz.scp.css */
/* PLAN-08 (D-10): room meta line with the compact capacity chart beneath it, aligned to the row's right edge.
   Anchored on page-rendered plain elements (never a Mud Class). */
.room-summary[b-1ej8pyucha] { text-align: right; }
.room-link[b-1ej8pyucha] { text-decoration: none; }
.room-link:hover .room-name[b-1ej8pyucha],
.room-link:focus-visible .room-name[b-1ej8pyucha] { text-decoration: underline; }
/* /Components/Pages/Venues/LayoutEditor.razor.rz.scp.css */
/* EDIT-01 / Phase 49 D-12: the full-page layout editor. Rules anchor on plain elements this page renders (never on a
   Mud component's Class, which a scoped rule cannot reach). Palette | canvas | inspector, one column below 900px. */
.fp-editor-root[b-7mk69w97qo] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 0.75rem);
}

.fp-editor-head[b-7mk69w97qo] {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  flex-wrap: wrap;
}

.fp-editor-titles[b-7mk69w97qo] { flex: 1 1 auto; min-width: 12rem; }
.fp-editor-titles h1[b-7mk69w97qo] { margin: 0; }
.fp-editor-room-size[b-7mk69w97qo] { margin: 0; color: var(--ink-3, #6b5f52); }

.fp-editor-actions[b-7mk69w97qo] {
  display: flex;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
}

.fp-editor-status[b-7mk69w97qo] { color: var(--ink-3, #6b5f52); font-weight: 600; }
.fp-editor-findings[b-7mk69w97qo] { margin: var(--sp-1, 0.25rem) 0 0; padding-left: 1.25rem; }

.fp-editor-toolbar[b-7mk69w97qo] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2, 0.5rem);
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line, #e0d6c6);
  padding-bottom: var(--sp-2, 0.5rem);
}

.fp-editor-tools[b-7mk69w97qo],
.fp-editor-counts[b-7mk69w97qo] {
  display: flex;
  align-items: center;
  gap: var(--sp-2, 0.5rem);
  flex-wrap: wrap;
}

.fp-editor-seats[b-7mk69w97qo] { font-weight: 600; }
.fp-editor-overlaps[b-7mk69w97qo],
.fp-editor-outside[b-7mk69w97qo] { color: var(--wine); font-weight: 600; }

/* Phase 52 D-07: the tight-aisle count is a soft warning in the wheat ink, readable in light and dark. */
.fp-editor-aisles[b-7mk69w97qo] { color: var(--wheat-ink); font-weight: 600; }

.fp-editor-body[b-7mk69w97qo] {
  display: grid;
  grid-template-columns: 13rem minmax(0, 1fr) 15rem;
  gap: var(--sp-3, 0.75rem);
  align-items: start;
}

.fp-editor-body[hidden][b-7mk69w97qo] { display: none; }

.fp-editor-palette[b-7mk69w97qo],
.fp-editor-inspector[b-7mk69w97qo] {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2, 0.5rem);
  max-height: 70vh;
  overflow-y: auto;
}

/* 50-07: the palette and inspector markup lives in the shared FloorPlanPalette / FloorPlanInspector components, so
   these rules reach it with ::deep from the page-rendered asides (never from a Mud component's Class, Pitfall 31). */
.fp-editor-palette[b-7mk69w97qo]  .fp-palette-group { display: flex; flex-direction: column; gap: 0.25rem; }

.fp-editor-palette[b-7mk69w97qo]  .fp-palette-heading,
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-heading {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-3, #6b5f52);
  margin: var(--sp-2, 0.5rem) 0 0.25rem;
}

.fp-editor-palette[b-7mk69w97qo]  .fp-palette-item {
  text-align: left;
  border: 1px solid var(--line, #e0d6c6);
  background: var(--surface, #fff);
  color: var(--ink, #3b332b);
  border-radius: 4px;
  padding: 0.3rem 0.5rem;
  font-size: 0.875rem;
  cursor: pointer;
}

.fp-editor-palette[b-7mk69w97qo]  .fp-palette-item:hover,
.fp-editor-palette[b-7mk69w97qo]  .fp-palette-item:focus-visible { border-color: var(--wine); }

.fp-editor-canvas[b-7mk69w97qo] {
  border: 1px solid var(--line, #e0d6c6);
  border-radius: 4px;
  overflow: hidden;
  min-width: 0;
}

.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-empty,
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-locked { color: var(--ink-3, #6b5f52); margin: 0; }
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-actions { display: flex; gap: var(--sp-2, 0.5rem); margin-top: var(--sp-2, 0.5rem); }
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-readonly { display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 0.75rem; margin: 0; }
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-readonly dt { color: var(--ink-3, #6b5f52); font-weight: 600; }
.fp-editor-inspector[b-7mk69w97qo]  .fp-inspector-readonly dd { margin: 0; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .fp-editor-body[b-7mk69w97qo] { grid-template-columns: minmax(0, 1fr); }
  .fp-editor-palette[b-7mk69w97qo],
  .fp-editor-inspector[b-7mk69w97qo] { max-height: none; }
}

/* 52-08 (D-20): on a touch screen the toolbar and head buttons (Undo, Redo, Zoom, Fit, Save) are 44 px finger targets.
   Anchored on page-rendered wrappers, reaching the Mud buttons with ::deep. */
@media (any-pointer: coarse) {
    .fp-editor-toolbar[b-7mk69w97qo]  .mud-button-root,
    .fp-editor-actions[b-7mk69w97qo]  .mud-button-root {
        min-height: 44px;
        min-width: 44px;
    }
}
/* /Components/Pages/Venues/RoomDetail.razor.rz.scp.css */
/* PLAN-02 / PLAN-08: the room page. Styles anchor on plain elements the page renders (never a Mud Class). */
.room-page[b-qhzddrvs83] { max-width: 60rem; }

.room-venue-name[b-qhzddrvs83] { color: var(--ink-3); margin: 0; }

.room-details[b-qhzddrvs83] {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--sp-1) var(--sp-4);
  margin: 0 0 var(--sp-4);
}

.room-details dt[b-qhzddrvs83] { font-weight: 600; color: var(--ink-2); }
.room-details dd[b-qhzddrvs83] { margin: 0; display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }

.room-section[b-qhzddrvs83] { margin-bottom: var(--sp-5); }

.room-section-h[b-qhzddrvs83] {
  font-family: var(--serif);
  font-weight: 500;
  font-size: var(--t-2);
  margin: var(--sp-4) 0 var(--sp-2);
  color: var(--ink);
}

.room-layouts .layout-default[b-qhzddrvs83] {
  margin-left: var(--sp-2);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--accent);
}

.room-layouts .layout-mismatch[b-qhzddrvs83] {
  display: block;
  font-size: 0.8rem;
  color: var(--ink-3);
}

.room-layouts .layout-actions[b-qhzddrvs83] { white-space: nowrap; text-align: right; }

.room-section-actions[b-qhzddrvs83] { margin-bottom: var(--sp-2); }

/* Phase 55 (D-10): the room's cover photo at the top of the page. */
.room-cover-wrap[b-qhzddrvs83] { margin: 0 0 var(--sp-4); }

.room-cover[b-qhzddrvs83] {
  display: block;
  width: 100%;
  max-height: 16rem;
  object-fit: cover;
  border-radius: var(--r-md);
  background: var(--surface-2);
}

@media (max-width: 600px) {
  .room-cover[b-qhzddrvs83] { max-height: 10rem; }
}
/* /Components/Pages/Venues/RoomPhotos.razor.rz.scp.css */
/* Phase 55 (55-05, D-08 / D-09 / D-11): the room Photos section. Every selector anchors on section.room-photos, an
   element this component renders; Mud-rendered children (the file input, the drop zone and its items) are reached
   with ::deep from there, never through a Mud component's Class alone (scoped CSS on a Mud Class matches nothing). */

.room-photos[b-b25j6esmfu] { min-width: 0; }

.photo-storage-message[b-b25j6esmfu] { color: var(--ink-2); margin: 0 0 var(--sp-2); }

.photo-empty[b-b25j6esmfu] { margin: var(--sp-2) 0; }

/* ---- upload batch ---- */

.photo-upload-area[b-b25j6esmfu] { margin-bottom: var(--sp-2); }

.room-photos[b-b25j6esmfu]  .photo-upload { position: relative; margin: 0; }

/* While files are dragged over the area, MudFileUpload shows its input; laid over the target it catches the drop. */
.room-photos[b-b25j6esmfu]  .photo-upload__input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 2;
  cursor: copy;
}

.photo-upload__target[b-b25j6esmfu] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2) var(--sp-3);
  padding: var(--sp-3);
  border: 1px dashed var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
}

.photo-upload__target--dragging[b-b25j6esmfu] {
  border-color: var(--ink-2);
  background: var(--surface-2);
}

.photo-upload__hint[b-b25j6esmfu] { color: var(--ink-3); font-size: 0.875rem; }

.photo-upload-status[b-b25j6esmfu] {
  list-style: none;
  margin: 0 0 var(--sp-2);
  padding: 0;
  display: grid;
  gap: var(--sp-1);
  font-size: 0.875rem;
}

.photo-upload-row[b-b25j6esmfu] {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--sp-2);
  min-width: 0;
}

.photo-upload-row__name[b-b25j6esmfu] {
  font-weight: 600;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.photo-upload-row__status[b-b25j6esmfu] { color: var(--ink-3); }
.photo-upload-row--added .photo-upload-row__status[b-b25j6esmfu] { color: var(--pine, var(--ink-2)); }
.photo-upload-row--rejected .photo-upload-row__status[b-b25j6esmfu] { color: var(--wine, var(--ink-2)); }

.photo-upload-summary[b-b25j6esmfu] { margin: 0 0 var(--sp-3); color: var(--ink-2); }
.photo-upload-summary:empty[b-b25j6esmfu] { display: none; }

/* ---- grid (D-08): square tiles, captions under them ---- */

.photo-grid[b-b25j6esmfu],
.room-photos[b-b25j6esmfu]  .photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: var(--sp-3);
  list-style: none;
  margin: 0;
  padding: 0;
}

.photo-tile[b-b25j6esmfu] { min-width: 0; margin: 0; }

.photo-frame[b-b25j6esmfu] {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--r-sm);
  background: var(--surface-2);
}

.photo-frame img[b-b25j6esmfu] {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.photo-caption[b-b25j6esmfu] {
  margin: var(--sp-1) 0 0;
  font-size: 0.875rem;
  color: var(--ink-2);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow-wrap: anywhere;
}

.photo-caption:empty[b-b25j6esmfu] { display: none; }

/* ---- manager grid (D-09): MudDropZone renders the grid; its items are the grid cells ---- */

.room-photos[b-b25j6esmfu]  .photo-drop { min-width: 0; }

.room-photos[b-b25j6esmfu]  .photo-grid .mud-drop-item { min-width: 0; }

/* MudBlazor's index -1 item ("preview-start") is the drop-to-front strip: dropping there moves a photo to the front
   (a drop on a tile lands AFTER that tile). It sits absolutely in the zone's top padding, a band entirely above the
   first row, so no point is both strip and tile. Keep it hit-testable (no pointer-events rule):
   mudDragAndDrop.getDropIndexOnPosition finds it with elementsFromPoint.

   Touch (55-13, S3.6): when a touch drag starts, mudDragAndDrop.makeDropZonesNotRelative sets an inline
   position: unset on every .mud-drop-zone and position: static on the strip (makeDropZonesRelative sets both back to
   relative afterwards). Without !important the zone loses its containing block mid-drag, the absolute strip
   re-anchors to <body> and leaves the band, and a touch drop at the front finds no index -1 item. The !important
   declarations below beat those inline styles, so the strip stays in its band for the whole touch drag.

   The band is 2.75rem (44 px), the minimum touch target in Apple's HIG and WCAG 2.5.5, so a finger can hit it. */
.room-photos[b-b25j6esmfu]  .photo-drop .photo-grid { position: relative !important; padding-top: 2.75rem; }

.room-photos[b-b25j6esmfu]  .photo-drop .mud-drop-item-preview-start {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 2.75rem;
}

/* Pitfall 10: only the handle takes over touch; a finger anywhere else on the tile still scrolls the page. */
.photo-drag-handle[b-b25j6esmfu] {
  position: absolute;
  top: var(--sp-1);
  right: var(--sp-1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: var(--r-sm);
  background: color-mix(in oklab, var(--surface) 85%, transparent);
  color: var(--ink-2);
  cursor: grab;
  touch-action: none;
}

.photo-drag-handle:active[b-b25j6esmfu] { cursor: grabbing; }

.photo-cover-badge[b-b25j6esmfu] {
  position: absolute;
  left: var(--sp-1);
  bottom: var(--sp-1);
  padding: 0.1rem 0.5rem;
  border-radius: var(--r-pill);
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: var(--ink);
  color: var(--surface);
}

.photo-caption-edit[b-b25j6esmfu] {
  display: block;
  width: 100%;
  margin: var(--sp-1) 0 0;
  padding: 0;
  border: 0;
  background: none;
  text-align: left;
  font: inherit;
  cursor: text;
}

.photo-caption-edit .photo-caption[b-b25j6esmfu] { margin: 0; }

.photo-caption-add[b-b25j6esmfu] {
  font-size: 0.875rem;
  color: var(--ink-3);
  text-decoration: underline dotted;
}

.photo-caption-input[b-b25j6esmfu] {
  width: 100%;
  margin-top: var(--sp-1);
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: 0.875rem;
}

.photo-caption-error[b-b25j6esmfu] {
  margin: var(--sp-1) 0 0;
  font-size: 0.8rem;
  color: var(--wine, var(--ink-2));
}

.photo-actions[b-b25j6esmfu] {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--sp-1);
  margin-top: var(--sp-1);
}

/* ---- tile image button (opens the viewer) ---- */

.photo-open[b-b25j6esmfu] {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
}

.photo-open:focus-visible[b-b25j6esmfu] {
  outline: 2px solid var(--ink-2);
  outline-offset: -2px;
}

/* ---- phone (D-08): two columns at 390 px, nothing wider than the viewport ---- */

@media (max-width: 600px) {
  .photo-grid[b-b25j6esmfu],
  .room-photos[b-b25j6esmfu]  .photo-grid {
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    gap: var(--sp-2);
  }

  .photo-upload__target[b-b25j6esmfu] { padding: var(--sp-2); }
}
/* /Components/Pages/Venues/RoomPhotoViewer.razor.rz.scp.css */
/* Phase 55 (55-05, D-08): the full-size viewer. Anchored on .photo-viewer, an element this component renders. */

.photo-viewer[b-je7vrbmr3a] {
  display: grid;
  gap: var(--sp-2);
  outline: none;
}

.photo-viewer:focus-visible[b-je7vrbmr3a] {
  outline: 2px solid var(--ink-2);
  outline-offset: 4px;
  border-radius: var(--r-sm);
}

.photo-viewer__img[b-je7vrbmr3a] {
  display: block;
  width: 100%;
  max-height: 75vh;
  object-fit: contain;
  background: var(--surface-2);
  border-radius: var(--r-sm);
}

.photo-viewer__meta[b-je7vrbmr3a] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-1) var(--sp-3);
}

.photo-viewer__caption[b-je7vrbmr3a] {
  margin: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.photo-viewer__caption:empty[b-je7vrbmr3a] { display: none; }

.photo-viewer__count[b-je7vrbmr3a] {
  margin: 0 0 0 auto;
  color: var(--ink-3);
  font-size: 0.875rem;
  white-space: nowrap;
}
/* /Components/Public/Events/Detail.razor.rz.scp.css */
.public-event-detail[b-aepn1g054q] {
    display: grid;
    gap: 1rem;
}

.public-event-detail__hero[b-aepn1g054q] {
    width: 100%;
    min-height: 16rem;
    max-height: 28rem;
    object-fit: cover;
    border-radius: 0.75rem;
    border: 1px solid var(--public-line);
    background: var(--public-surface-2);
    box-shadow: var(--public-shadow-1);
}

.public-event-detail__hero--placeholder[b-aepn1g054q] {
    background:
        linear-gradient(135deg, color-mix(in oklch, var(--public-surface-2), var(--public-accent) 20%), var(--public-surface-2));
}

.public-event-detail__body[b-aepn1g054q] {
    display: grid;
    gap: 0.65rem;
}

.public-event-detail__body h1[b-aepn1g054q] {
    margin: 0;
    font: 600 clamp(1.85rem, 1.55rem + 1vw, 2.45rem)/1.15 var(--public-font-display);
}

.public-event-detail__datetime[b-aepn1g054q],
.public-event-detail__location[b-aepn1g054q],
.public-event-detail__description[b-aepn1g054q] {
    margin: 0;
    color: var(--public-ink-2);
}

.public-event-detail__price[b-aepn1g054q] {
    margin: 0;
    color: var(--public-ink-1);
    font-weight: 600;
}

.public-event-detail__tags[b-aepn1g054q] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.public-event-detail__tags li[b-aepn1g054q] {
    border: 1px solid var(--public-line);
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    font-size: 0.9rem;
    color: var(--public-ink-2);
    background: var(--public-surface-1);
}

.public-event-detail__ticket[b-aepn1g054q] {
    margin: 0.25rem 0 0;
}

.public-event-detail__ticket a[b-aepn1g054q] {
    color: var(--public-accent-strong);
}

@media (max-width: 48rem) {
    .public-event-detail__hero[b-aepn1g054q] {
        min-height: 12rem;
    }

    .public-event-detail__body[b-aepn1g054q] {
        gap: 0.55rem;
    }
}
/* /Components/Public/Events/Index.razor.rz.scp.css */
.public-events[b-u5a6s6rynn] {
    display: grid;
    gap: 1.5rem;
}

.public-events__header h1[b-u5a6s6rynn] {
    margin: 0;
    font: 600 clamp(1.8rem, 1.5rem + 1.1vw, 2.35rem)/1.15 var(--public-font-display);
}

.public-events__header p[b-u5a6s6rynn] {
    margin: 0.5rem 0 0;
    color: var(--public-ink-2);
}

.public-events__view-toggle[b-u5a6s6rynn] {
    margin-top: 0.9rem;
    display: inline-flex;
    gap: 0.5rem;
}

.public-events__view-toggle a[b-u5a6s6rynn] {
    border: 1px solid var(--public-line);
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    text-decoration: none;
    color: var(--public-ink-1);
    background: var(--public-surface-1);
}

.public-events__view-toggle a[aria-current="page"][b-u5a6s6rynn] {
    background: var(--public-accent);
    color: var(--public-on-accent);
    border-color: var(--public-accent);
}

.public-events__empty[b-u5a6s6rynn] {
    padding: 2rem;
    border: 1px solid var(--public-line);
    border-radius: 0.75rem;
    background: var(--public-surface-1);
    box-shadow: var(--public-shadow-1);
}

.public-events__empty h2[b-u5a6s6rynn] {
    margin: 0;
    font: 600 1.3rem/1.3 var(--public-font-display);
}

.public-events__empty p[b-u5a6s6rynn] {
    margin: 0.75rem 0 0;
    color: var(--public-ink-2);
}

.public-events__grid[b-u5a6s6rynn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem;
}

.public-events__calendar h2[b-u5a6s6rynn] {
    margin: 0 0 0.75rem;
    font: 600 1.45rem/1.2 var(--public-font-display);
}

.public-events__calendar-grid[b-u5a6s6rynn] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.5rem;
}

.public-events__calendar-day[b-u5a6s6rynn] {
    min-height: 7rem;
    border: 1px solid var(--public-line);
    border-radius: 0.6rem;
    padding: 0.5rem;
    background: var(--public-surface-1);
}

.public-events__calendar-day > header[b-u5a6s6rynn] {
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.public-events__calendar-day ul[b-u5a6s6rynn] {
    margin: 0;
    padding-left: 1rem;
    display: grid;
    gap: 0.2rem;
}

.public-events__calendar-empty[b-u5a6s6rynn] {
    margin: 0;
    color: var(--public-ink-2);
    font-size: 0.9rem;
}

.public-event-card[b-u5a6s6rynn] {
    border: 1px solid var(--public-line);
    border-radius: 0.75rem;
    background: var(--public-surface-1);
    overflow: hidden;
    box-shadow: var(--public-shadow-1);
}

.public-event-card__link[b-u5a6s6rynn] {
    display: grid;
    grid-template-rows: 10rem 1fr;
    color: inherit;
    text-decoration: none;
    height: 100%;
}

.public-event-card__hero[b-u5a6s6rynn] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: var(--public-surface-2);
}

.public-event-card__hero--placeholder[b-u5a6s6rynn] {
    background:
        linear-gradient(135deg, color-mix(in oklch, var(--public-surface-2), var(--public-accent) 20%), var(--public-surface-2));
}

.public-event-card__body[b-u5a6s6rynn] {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem 1rem 1rem;
}

.public-event-card__body h2[b-u5a6s6rynn] {
    margin: 0;
    font: 600 1.2rem/1.25 var(--public-font-display);
}

.public-event-card__datetime[b-u5a6s6rynn],
.public-event-card__location[b-u5a6s6rynn],
.public-event-card__price[b-u5a6s6rynn],
.public-event-card__description[b-u5a6s6rynn] {
    margin: 0;
    color: var(--public-ink-2);
}

.public-event-card__price[b-u5a6s6rynn] {
    color: var(--public-ink-1);
    font-weight: 600;
}

@media (max-width: 52rem) {
    .public-events__calendar-grid[b-u5a6s6rynn] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 36rem) {
    .public-events[b-u5a6s6rynn] {
        gap: 1.1rem;
    }

    .public-events__grid[b-u5a6s6rynn] {
        grid-template-columns: 1fr;
    }

    .public-events__calendar-grid[b-u5a6s6rynn] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-event-card__link[b-u5a6s6rynn] {
        grid-template-rows: 8.25rem 1fr;
    }
}
/* /Components/Sharing/Share.razor.rz.scp.css */
/* Share.razor (57-05) - the client share page: event intro, one section per room, plan images with a Download PDF link,
   the chosen photos, the coordinator footer, and the one terminal.

   WR-05 dark-mode policy: text and surfaces use Terroir tokens only, so the page follows the visitor's light or dark
   choice. The ONE fixed colour is the plan card: plan drawings are dark ink on white, so each plan image sits on a light
   paper card in both themes (a white plan on a dark page would otherwise glare, and a transparent one would vanish).
   Images never exceed their column, and photos stack in one column on a phone. */

/* ---------- Intro ---------- */
.share-intro[b-42v3a8lklq] {
    margin-bottom: var(--sp-4);
}

.share-intro__title[b-42v3a8lklq] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-4);
    line-height: 1.05;
    letter-spacing: -0.015em;
    color: var(--ink);
    margin: 0 0 var(--sp-1) 0;
    overflow-wrap: anywhere;
}

.share-intro__date[b-42v3a8lklq] {
    font-size: var(--t-1);
    color: var(--ink-2);
    margin: 0;
}

.share-intro__shared[b-42v3a8lklq] {
    font-size: var(--t--1);
    color: var(--ink-3);
    margin: var(--sp-1) 0 0 0;
}

/* ---------- Rooms ---------- */
.share-room[b-42v3a8lklq] {
    padding-top: var(--sp-4);
    margin-top: var(--sp-4);
    border-top: 1px solid var(--line);
}

.share-room__name[b-42v3a8lklq] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.1;
    color: var(--ink);
    margin: 0 0 var(--sp-3) 0;
    overflow-wrap: anywhere;
}

/* ---------- Plans ---------- */
.share-plan[b-42v3a8lklq] {
    margin: 0 0 var(--sp-4) 0;
}

.share-plan__paper[b-42v3a8lklq] {
    --share-plan-paper: oklch(0.992 0.006 96);
    background: var(--share-plan-paper);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: var(--sp-1);
    box-sizing: border-box;
}

.share-plan__image[b-42v3a8lklq] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: var(--r-sm);
}

.share-plan__caption[b-42v3a8lklq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-1) var(--sp-2);
    margin-top: var(--sp-1);
}

.share-plan__name[b-42v3a8lklq] {
    font-weight: 600;
    font-size: var(--t-0);
    color: var(--ink);
    overflow-wrap: anywhere;
}

.share-plan__pdf[b-42v3a8lklq] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 var(--sp-2);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    background: var(--surface);
    color: var(--ink);
    font-weight: 600;
    font-size: var(--t--1);
    text-decoration: none;
}

.share-plan__pdf:hover[b-42v3a8lklq] {
    border-color: var(--brand);
}

.share-plan__pdf:focus-visible[b-42v3a8lklq] {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
}

/* ---------- Photos ---------- */
.share-photos[b-42v3a8lklq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    gap: var(--sp-2);
}

.share-photo[b-42v3a8lklq] {
    margin: 0;
}

.share-photo__image[b-42v3a8lklq] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: var(--r-md);
    background: var(--surface-2);
}

.share-photo__caption[b-42v3a8lklq] {
    margin-top: var(--sp-1);
    font-size: var(--t--1);
    color: var(--ink-2);
    overflow-wrap: anywhere;
}

@media (max-width: 599px) {
    .share-photos[b-42v3a8lklq] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Empty share and footer ---------- */
.share-empty[b-42v3a8lklq] {
    font-size: var(--t-1);
    color: var(--ink-2);
    padding: var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.share-footer[b-42v3a8lklq] {
    margin-top: var(--sp-5);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--line);
    color: var(--ink-2);
    font-size: var(--t-0);
}

.share-footer p[b-42v3a8lklq] {
    margin: 0;
}

/* ---------- The one terminal ---------- */
.share-terminal[b-42v3a8lklq] {
    max-width: 36rem;
    margin: var(--sp-5) auto;
    padding: var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    text-align: center;
}

.share-terminal__heading[b-42v3a8lklq] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.1;
    color: var(--ink);
    margin: 0 0 var(--sp-2) 0;
}

.share-terminal__body[b-42v3a8lklq] {
    font-size: var(--t-1);
    color: var(--ink-2);
    margin: 0;
}

/* ---------- Phase 58 (58-09): the client's response ----------
   A card under the rooms. On a 390 px phone the two buttons stack full width; from 600 px they sit side by side. Every
   control is at least 44 px tall. The <form> itself is rendered by EditForm, so it carries no scope attribute and is
   reached through ::deep from the page-rendered section; everything inside it is authored here and is scoped. */
.share-response[b-42v3a8lklq] {
    margin-top: var(--sp-5);
    padding: var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.share-response__heading[b-42v3a8lklq] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.1;
    color: var(--ink);
    margin: 0 0 var(--sp-2) 0;
}

.share-response[b-42v3a8lklq]  .share-response__form {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    margin: 0;
}

.share-response__current[b-42v3a8lklq] {
    font-size: var(--t-1);
    font-weight: 600;
    color: var(--ink);
    margin: 0 0 var(--sp-2) 0;
}

.share-response__change[b-42v3a8lklq] {
    margin: 0;
}

.share-response__summary[b-42v3a8lklq] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    cursor: pointer;
    font-weight: 600;
    color: var(--ink-2);
}

.share-response__change[open] .share-response__summary[b-42v3a8lklq] {
    margin-bottom: var(--sp-2);
}

.share-response__summary:focus-visible[b-42v3a8lklq] {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
}

.share-response__label[b-42v3a8lklq] {
    font-size: var(--t-0);
    font-weight: 600;
    color: var(--ink);
}

.share-response__message[b-42v3a8lklq] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    padding: var(--sp-2);
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.4;
    color: var(--ink);
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    resize: vertical;
}

.share-response__message:focus-visible[b-42v3a8lklq] {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}

.share-response__actions[b-42v3a8lklq] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.share-response__button[b-42v3a8lklq] {
    min-height: 44px;
    width: 100%;
    padding: var(--sp-2) var(--sp-4);
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t-0);
    border-radius: var(--r-sm);
    cursor: pointer;
}

.share-response__button--good[b-42v3a8lklq] {
    color: var(--brand-contrast);
    background: var(--brand);
    border: 1px solid var(--brand);
}

.share-response__button--changes[b-42v3a8lklq] {
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
}

/* PR 295 review: --brand-soft is a faint tint for branded tenants (about 1.1:1 on the card), so a solid --ink outline
   carries the focus contrast and the halo stays as decoration. */
.share-response__button:focus-visible[b-42v3a8lklq] {
    outline: 2px solid var(--ink);
    outline-offset: 2px;
    box-shadow: 0 0 0 5px var(--brand-soft);
}

@media (min-width: 600px) {
    .share-response__actions[b-42v3a8lklq] {
        flex-direction: row;
    }

    .share-response__button[b-42v3a8lklq] {
        flex: 1 1 0;
    }
}

/* D-14: a plan changed since the last response, in the amber "changed" palette the signing page uses: the client did
   nothing wrong. WR-05 / quick 261015-ldu: the palette is the shared global .change-notice in wwwroot/css/terroir.css
   (App.razor loads it on this public page too), backed by the --wheat-line / --wheat-tint / --wheat-ink tokens (dark
   amber on a pale wheat tint in light, light amber on a dim tint in dark), so the line stays legible in both themes.
   This rule keeps shape and layout only and must not redeclare border-left, background or color. Text plus role,
   never colour alone. */
.share-response__stale[b-42v3a8lklq] {
    display: block;
    font-size: var(--t--1);
    line-height: 1.4;
    border-radius: var(--r-sm);
    padding: var(--sp-1) var(--sp-2);
    margin: 0 0 var(--sp-2) 0;
}

/* A refused response: --ink on --wine-tint with a --wine rule. PR 295 review: --wine text on the tint is about 3.65:1 in
   dark mode, under 4.5:1 for this small text, so the text is --ink and the wine stays in the fill and the rule. */
.share-response__error[b-42v3a8lklq] {
    display: block;
    font-size: var(--t--1);
    line-height: 1.4;
    color: var(--ink);
    border-left: 4px solid var(--wine);
    background: var(--wine-tint);
    border-radius: var(--r-sm);
    padding: var(--sp-1) var(--sp-2);
    margin: 0;
}
/* /Components/Signing/BeoReview.razor.rz.scp.css */
/* BeoReview — read-only Full-variant BEO render. Warm-paper editorial treatment on the Terroir
   token layer only: zero literal colors, zero literal spacing (fluid --sp-* tokens + Terroir radii).
   Section headings are Fraunces 600 --t-2; body is Space Grotesk --t-0; hairlines --line; monetary
   values are tabular. Light/dark + reduced-motion are handled globally in terroir.css. */

.beo-review[b-3mc00omfng] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: var(--sp-4);
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
}

/* ----- Document header / title ----- */
.beo-head[b-3mc00omfng] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--line);
}

.beo-head__title[b-3mc00omfng] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-4);
    line-height: 1.05;
    letter-spacing: -0.015em;
    color: var(--ink);
    margin: 0;
}

.beo-head__meta[b-3mc00omfng] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin: 0;
    color: var(--ink-2);
    font-size: var(--t--1);
    font-weight: 600;
}

.beo-head__status[b-3mc00omfng] {
    color: var(--brand);
}

/* ----- Sections ----- */
.beo-section[b-3mc00omfng] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.beo-section__band[b-3mc00omfng] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-2);
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: 0;
    padding-bottom: var(--sp-1);
    border-bottom: 1px solid var(--line-soft);
}

/* Safety-critical allergy emphasis (kitchen high-emphasis flag). */
.beo-section--alert .beo-section__band[b-3mc00omfng] {
    color: var(--wine);
    border-bottom-color: var(--wine);
}

/* ----- Fact grid (event details / account block) ----- */
.beo-facts[b-3mc00omfng] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: var(--sp-2);
    margin: 0;
}

.beo-fact[b-3mc00omfng] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.beo-fact dt[b-3mc00omfng] {
    font-size: var(--t--1);
    font-weight: 600;
    color: var(--ink-3);
}

.beo-fact dd[b-3mc00omfng] {
    margin: 0;
    color: var(--ink);
}

/* ----- Line lists (menu, wine, schedule, staff, vendors, allergies, guests) ----- */
.beo-lines[b-3mc00omfng] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.beo-line[b-3mc00omfng] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--sp-1) var(--sp-2);
    padding-block: var(--sp-1);
    border-bottom: 1px solid var(--line-soft);
}

.beo-line:last-child[b-3mc00omfng] {
    border-bottom: 0;
}

.beo-line__desc[b-3mc00omfng] {
    flex: 1 1 auto;
    color: var(--ink);
}

.beo-line__meta[b-3mc00omfng] {
    color: var(--ink-2);
    font-size: var(--t--1);
}

.beo-line__meta--lead[b-3mc00omfng] {
    flex: 0 0 auto;
    font-weight: 600;
    color: var(--ink);
}

/* Monetary line total — tabular, right-aligned. */
.beo-line__money[b-3mc00omfng] {
    flex: 0 0 auto;
    margin-left: auto;
    font-variant-numeric: tabular-nums;
    color: var(--ink);
}

/* Wine flight header + indented components. */
.beo-line--flight .beo-line__desc[b-3mc00omfng] {
    font-weight: 600;
}

.beo-line--flight-part[b-3mc00omfng] {
    padding-left: var(--sp-3);
}

/* ----- Prose blocks (setup/AV/staffing/instructions notes) ----- */
.beo-prose[b-3mc00omfng] {
    margin: 0;
    color: var(--ink);
    white-space: pre-line;
}

/* ----- Billing summary ----- */
.beo-billing[b-3mc00omfng] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    margin: 0;
    max-width: 28rem;
    margin-left: auto;
    width: 100%;
}

.beo-billing__row[b-3mc00omfng] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--sp-2);
}

.beo-billing__row dt[b-3mc00omfng] {
    color: var(--ink-2);
}

.beo-billing__val[b-3mc00omfng] {
    margin: 0;
    font-variant-numeric: tabular-nums;
    color: var(--ink);
}

.beo-billing__row--total[b-3mc00omfng] {
    padding-top: var(--sp-1);
    border-top: 1px solid var(--line);
}

.beo-billing__row--total dt[b-3mc00omfng],
.beo-billing__row--total .beo-billing__val[b-3mc00omfng] {
    font-weight: 600;
    color: var(--ink);
}

/* ----- Empty-section marker ----- */
.beo-none[b-3mc00omfng] {
    margin: 0;
    color: var(--ink-3);
    font-style: italic;
}
/* /Components/Signing/Sign.razor.rz.scp.css */
/* Sign.razor — scoped styles for the four-state public signing page.
   Terroir tokens ONLY: zero literal colors, zero literal spacing (fluid --sp-* + locked Terroir radii).
   Light/dark (prefers-color-scheme) and reduced-motion are handled globally in terroir.css — no
   competing media queries here.

   Accent (--brand → tenant accent, else Terroir pine) is RESERVED for exactly: the Approve & Sign
   fill, focus rings on interactive controls, the checked checkbox, and the "Approved & signed" banner
   leading rule. Validation/error text uses --wine on --wine-tint (never color alone — paired with
   text + aria wiring in Sign.razor). Touch targets (Clear, checkbox, Approve & Sign) are >= 44x44px. */

/* ---------- State 1: signature panel ---------- */
.sign-panel[b-84loe7oo28] {
    margin-top: var(--sp-5);
    padding: var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.sign-panel__heading[b-84loe7oo28] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-2);
    line-height: 1.15;
    color: var(--ink);
    margin: 0 0 var(--sp-1) 0;
}

.sign-panel__body[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
    margin: 0 0 var(--sp-3) 0;
}

.sign-field[b-84loe7oo28] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    margin-bottom: var(--sp-3);
}

.sign-label[b-84loe7oo28] {
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t--1);
    line-height: 1.4;
    color: var(--ink);
}

/* Canvas frame: --line border + --r-sm, explicit sizing, faint baseline hint. */
.sign-canvas[b-84loe7oo28] {
    display: block;
    width: 100%;
    height: var(--sp-5);
    min-height: 44px;
    box-sizing: border-box;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    touch-action: none; /* let signature_pad own pointer gestures */
}

.sign-canvas:focus-visible[b-84loe7oo28] {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}

.sign-canvas__hint[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t--1);
    color: var(--ink-3);
}

/* Clear signature — secondary control, >= 44x44px touch target. */
.sign-clear[b-84loe7oo28] {
    align-self: flex-start;
    min-height: 44px;
    min-width: 44px;
    padding: var(--sp-1) var(--sp-3);
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t--1);
    color: var(--ink);
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    cursor: pointer;
}

.sign-clear:focus-visible[b-84loe7oo28] {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}

/* Name input. */
.sign-input[b-84loe7oo28] {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    padding: var(--sp-1) var(--sp-2);
    font-family: var(--sans);
    font-size: var(--t-0);
    color: var(--ink);
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
}

.sign-input:focus-visible[b-84loe7oo28] {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}

/* Agreement checkbox — the label hit-area + checkbox is >= 44px tall (D-06 confirmation gate). */
.sign-agree[b-84loe7oo28] {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
    min-height: 44px;
    margin-bottom: var(--sp-3);
}

.sign-checkbox[b-84loe7oo28] {
    width: 1.4rem;
    height: 1.4rem;
    min-width: 1.4rem;
    /* Checked state adopts the tenant accent (reserved --brand usage). */
    accent-color: var(--brand);
    cursor: pointer;
}

.sign-checkbox:focus-visible[b-84loe7oo28] {
    outline: none;
    box-shadow: 0 0 0 3px var(--brand-soft);
    border-radius: var(--r-xs);
}

.sign-agree__label[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.4;
    color: var(--ink);
    /* Extend the interactive hit-area to a >= 44px row alongside the checkbox. */
    display: flex;
    align-items: center;
    min-height: 44px;
    cursor: pointer;
}

.sign-hint[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t--1);
    color: var(--ink-3);
    margin: 0 0 var(--sp-2) 0;
}

/* Approve & Sign — the sole --brand-filled element, primary visual anchor, >= 44x44px. */
.sign-submit[b-84loe7oo28] {
    min-height: 44px;
    min-width: 44px;
    width: 100%;
    padding: var(--sp-2) var(--sp-4);
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t-0);
    color: var(--brand-contrast);
    background: var(--brand);
    border: 1px solid var(--brand);
    border-radius: var(--r-sm);
    cursor: pointer;
}

.sign-submit:disabled[b-84loe7oo28] {
    opacity: 0.55;
    cursor: not-allowed;
}

.sign-submit:focus-visible[b-84loe7oo28] {
    outline: none;
    box-shadow: 0 0 0 3px var(--brand-soft);
}

/* Validation / error text — --wine on --wine-tint, paired with text (never color alone). */
.sign-error[b-84loe7oo28] {
    display: block;
    font-family: var(--sans);
    font-size: var(--t--1);
    line-height: 1.4;
    color: var(--wine);
    background: var(--wine-tint);
    border-radius: var(--r-sm);
    padding: var(--sp-1) var(--sp-2);
    margin-top: var(--sp-1);
}

/* Phase 58 (D-16): "The floor plan was updated — please review it again". Shaped like .sign-error but in the amber
   "changed" palette: the client did nothing wrong, the plan moved under them. The palette is the shared global
   .change-notice in wwwroot/css/terroir.css (App.razor loads it on this public page too), backed by the --wheat-line /
   --wheat-tint / --wheat-ink tokens so it reads in both themes (quick 261015-ldu). This rule keeps shape and layout
   only and must not redeclare border-left, background or color. Text plus role="alert", never colour alone. */
.sign-notice[b-84loe7oo28] {
    display: block;
    font-family: var(--sans);
    font-size: var(--t--1);
    line-height: 1.4;
    border-radius: var(--r-sm);
    padding: var(--sp-1) var(--sp-2);
    margin: 0 0 var(--sp-2) 0;
}

/* ---------- State 2: thank-you panel ---------- */
.sign-thanks[b-84loe7oo28] {
    margin-top: var(--sp-5);
    padding: var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.sign-thanks__heading[b-84loe7oo28] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.05;
    color: var(--ink);
    margin: 0 0 var(--sp-1) 0;
}

.sign-thanks__body[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
    margin: 0;
}

/* ---------- State 3: "Approved & signed" banner (leading rule uses reserved --brand) ---------- */
.sign-banner[b-84loe7oo28] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    margin-bottom: var(--sp-4);
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-left: 3px solid var(--brand);
    border-radius: var(--r-md);
}

.sign-banner__mark[b-84loe7oo28] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-3);
    line-height: 1.05;
    color: var(--ink);
}

.sign-banner__text[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
}

/* ---------- State 4: invalid link — neutral Terroir, NO accent, no branding (D-13/14) ---------- */
.sign-invalid[b-84loe7oo28] {
    max-width: 40rem;
    margin: var(--sp-5) auto;
    text-align: center;
}

.sign-invalid__heading[b-84loe7oo28] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-4);
    line-height: 1.05;
    color: var(--ink);
    margin: 0 0 var(--sp-3) 0;
}

.sign-invalid__body[b-84loe7oo28] {
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
    margin: 0;
}

/* ---------- Phase 58 (research A4): the signed revisit's approved plan revisions ---------- */
.sign-approved-plans[b-84loe7oo28] {
    margin-top: var(--sp-5);
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.sign-approved-plans__heading[b-84loe7oo28] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-1);
    line-height: 1.2;
    color: var(--ink);
    margin: 0 0 var(--sp-2) 0;
}

.sign-approved-plans__list[b-84loe7oo28] {
    margin: 0;
    padding-left: var(--sp-3);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    font-family: var(--sans);
    font-size: var(--t-0);
    line-height: 1.5;
    color: var(--ink-2);
    overflow-wrap: anywhere;
}
/* /Components/Signing/SignPlans.razor.rz.scp.css */
/* SignPlans.razor (Phase 58, DOC-25 / D-15) — the floor plans on the signing page, between the BEO and the signature
   box. Spaced like a BeoReview beo-section and dressed like the /share plan cards (share-plan paper) so the client sees
   the same plan look on both pages. Plain page-rendered elements, so scoped CSS applies directly.

   The plan image is a drawn PNG on white paper, so its card keeps a fixed light paper colour whatever the theme. The
   image always fits the width (no horizontal scroll on a 390 px phone) and carries width/height attributes so the page
   does not shift while it loads. */

.sign-plans[b-qxor39anyh] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    margin-top: var(--sp-5);
}

.sign-plans__heading[b-qxor39anyh] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: var(--t-2);
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: 0;
    padding-bottom: var(--sp-1);
    border-bottom: 1px solid var(--line);
}

.sign-plan[b-qxor39anyh] {
    margin: 0;
    padding: var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-sizing: border-box;
    min-width: 0;
}

.sign-plan__heading[b-qxor39anyh] {
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t-1);
    line-height: 1.3;
    color: var(--ink);
    margin: 0 0 var(--sp-2) 0;
    overflow-wrap: anywhere;
}

.sign-plan__paper[b-qxor39anyh] {
    --sign-plan-paper: oklch(0.992 0.006 96);
    background: var(--sign-plan-paper);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    padding: var(--sp-1);
    box-sizing: border-box;
}

.sign-plan__image[b-qxor39anyh] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: var(--r-sm);
}

.sign-plan__meta[b-qxor39anyh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1) var(--sp-3);
    margin-top: var(--sp-2);
}

/* Caption and stats in the BEO's meta text style. */
.sign-plan__caption[b-qxor39anyh],
.sign-plan__stats[b-qxor39anyh] {
    font-family: var(--sans);
    font-size: var(--t--1);
    line-height: 1.4;
    color: var(--ink-2);
    margin: 0;
}

/* A clear text link with a 44 px tap height. */
.sign-plan__pdf[b-qxor39anyh] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-left: auto;
    font-family: var(--sans);
    font-weight: 600;
    font-size: var(--t--1);
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.sign-plan__pdf:hover[b-qxor39anyh] {
    color: var(--brand);
}

.sign-plan__pdf:focus-visible[b-qxor39anyh] {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
}

@media print {
    .sign-plan[b-qxor39anyh] {
        break-inside: avoid;
        page-break-inside: avoid;
        break-before: page;
        border: none;
        padding: 0;
    }

    .sign-plan__pdf[b-qxor39anyh] {
        display: none;
    }
}
/* /Components/Tenancy/OperatingAsBanner.razor.rz.scp.css */
.operating-as-banner[b-5k5y4lai2d] {
    background: var(--wine); /* wine tone — signals an elevated, audited cross-tenant context */
    color: #fff;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem var(--sp-4);
    font-size: var(--t--1);
    width: 100%;
    box-shadow: var(--sh-1);
}

.operating-as-text strong[b-5k5y4lai2d] {
    font-weight: 700;
}

.operating-as-sep[b-5k5y4lai2d] {
    opacity: 0.6;
}

.operating-as-exit[b-5k5y4lai2d] {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.7);
    color: #fff;
    border-radius: 0.25rem;
    padding: 0.1rem 0.6rem;
    cursor: pointer;
    font-size: 0.85rem;
}

.operating-as-exit:hover[b-5k5y4lai2d] {
    background: rgba(255, 255, 255, 0.15);
}