/* Shared CRM interface; feature layouts and operational states stay intact. */
:root {
  --paper: #f7f8fa;
  --paper-deep: #eceef2;
  --surface: #f8f9fb;
  --surface-strong: #fff;
  --line: #dce0e6;
  --line-soft: #edf0f3;
  --text: #24272e;
  --muted: #606978;
  --soft: #707987;
  --accent: #b52230;
  --accent-soft: #fcf0f1;
  --green: #26715d;
  --green-soft: #ecf6f1;
  --red: #b52230;
  --red-soft: #fcf0f1;
  --blue: #35658f;
  --blue-soft: #eef4fa;
  --yellow: #88631f;
  --yellow-soft: #fcf7e9;
  --sidebar: #f7f8fa;
  --shadow: none;
  --shadow-soft: none;
  --motion-fast: 150ms;
  --motion-enter: 180ms;
  --motion-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

body { overflow-x: visible; font-size: 0.875rem; line-height: 1.6; }
img, video, canvas { max-width: 100%; }
button, input, select, textarea { max-width: 100%; letter-spacing: 0; }
input, select, textarea { min-width: 0; }
button { font-weight: 600; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
h1 { font-size: 1.5rem; line-height: 1.4; font-weight: 650; }
h2 { font-size: 1rem; line-height: 1.5; font-weight: 650; }
h3 { font-size: 0.9375rem; line-height: 1.5; font-weight: 650; }

.shell { gap: 0; padding: 0; grid-template-columns: minmax(0, 1fr); }
.sidebar {
  position: static; top: 0; height: auto; display: grid;
  grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  gap: 0 8px; padding: 10px 16px; border: 0;
  border-bottom: 1px solid var(--line); border-radius: 0;
}
.brand {
  display: flex; align-items: center; justify-content: start; gap: 10px;
  min-width: 0; margin: 0; padding: 0; border: 0;
  grid-column: 1; grid-row: 1;
}
.brand-mark {
  flex: 0 0 32px; width: 32px; height: 32px;
  padding: 0; border: 0; border-radius: 0; background: transparent;
}
.brand-mark img { display: block; width: 32px; height: 32px; object-fit: contain; }
.brand strong { color: var(--text); font-size: 0.8125rem; font-weight: 700; }
.brand > span { display: none; }
.mobile-nav-toggle {
  display: inline-flex; grid-column: 2; grid-row: 1;
  width: 44px; height: 44px; align-items: center; justify-content: center;
  padding: 0; border: 1px solid var(--line); border-radius: 6px;
  color: var(--text); background: #fff;
}
.mobile-nav-toggle[aria-expanded="true"] { background: var(--paper-deep); border-color: var(--line); }
.nav {
  grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px; padding: 12px 0 0; margin-top: 0;
  max-height: 60dvh; scrollbar-color: #b9c1c9 transparent;
}
.sidebar:not(.is-open) .nav { display: none; }
.nav a, .nav-more-button {
  width: 100%; min-height: 44px; gap: 10px;
  position: relative; padding: 9px 12px; border: 0; border-radius: 6px;
  background: transparent; color: #586170; font-weight: 500;
}
.nav a:hover, .nav-more-button:hover { background: var(--paper-deep); color: var(--text); border: 0; }
.nav :is(a,button):focus-visible { outline-offset: -3px; }
.nav a[aria-current="page"] {
  background: #fff; color: var(--text);
  box-shadow: none; border: 0; font-weight: 650;
}
.nav a[aria-current="page"]::before { content: ""; position: absolute; inset: 12px auto 12px 0; width: 3px; border-radius: 2px; background: var(--accent); }
.nav a[aria-current="page"] .nav-icon { color: var(--accent); }
.nav-icon { width: 19px; height: 19px; stroke-width: 1.75; }
.nav-label { font-size: 0.8125rem; }
.nav-more-button { margin-top: 12px; border-top: 1px solid var(--line); border-radius: 0; }
.admin-nav-open .nav-more-button { color: var(--text); background: var(--paper-deep); border-color: var(--line); }
.main { width: 100%; min-width: 0; padding: 24px 16px 48px; background: #fff; }
.topbar, .page-hero, .command-hero {
  align-items: center; padding: 0 0 24px; margin: 0 0 24px;
  gap: 16px; border-bottom: 1px solid var(--line-soft);
}
.topbar { flex-direction: column; align-items: stretch; }
.top-actions, .top-actions:has(> .command-search-button) {
  display: flex; flex-direction: row; flex-wrap: wrap; min-width: 0; width: auto;
  gap: 8px; align-items: center; justify-content: start; margin-left: 0;
}
.title-block { max-width: none; }
.subtitle { font-size: 0.875rem; }
.eyebrow { color: var(--muted); font-weight: 500; font-size: 0.75rem; }
.connection-card {
  min-width: 0; min-height: 44px; flex: 1 1 8rem; gap: 2px;
  border: 0; border-radius: 0; padding: 0 4px;
  background: transparent; box-shadow: none;
}
.connection-card span { color: var(--muted); font-size: 0.6875rem; font-weight: 500; }
.connection-card strong { font-size: 0.75rem; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
.ui-icon { display: block; flex: 0 0 auto; width: 19px; height: 19px; }
.refresh-button {
  display: inline-flex; flex: 0 0 44px; width: 44px; height: 44px;
  min-width: 44px; max-width: 44px;
  min-height: 44px; align-items: center; justify-content: center;
  padding: 0; color: var(--muted); background: #fff;
  border: 1px solid var(--line); border-radius: 6px;
}
.refresh-button:hover { background: var(--surface); color: var(--text); }
.refresh-button[aria-busy="true"] .ui-icon { animation: core-refresh 1s linear infinite; }
@keyframes core-refresh { to { transform: rotate(360deg); } }
.command-search-button {
  display: flex; flex: 1 1 13rem; align-items: center; gap: 10px;
  width: min(100%, 38rem); min-height: 44px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--surface); font-size: 0.8125rem;
}
.command-search-button span { font-weight: 400; color: var(--muted); }
.command-search-button .ui-icon { color: var(--soft); width: 17px; height: 17px; }
.command-search-button:hover { background: #fff; border-color: #aeb7c4; }
.command-search-button kbd { margin-left: auto; min-height: 24px; padding: 0 5px; border-radius: 4px; font-size: 0.6875rem; font-weight: 500; }
.command-copy { gap: 16px; }
.command-copy > h1 { margin-bottom: 4px; }
.quick-action-row { gap: 8px; }
.quick-action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 0.8125rem; font-weight: 500; border-color: var(--line); border-radius: 6px; }
.quick-action .ui-icon { width: 17px; height: 17px; color: var(--muted); }
.quick-action:first-child { border-color: var(--line); background: #fff; color: var(--text); }
.quick-action:hover { background: var(--surface); border-color: #aeb9c4; color: var(--text); }
.external-tool-shortcuts { width: min(100%, 38rem); }
.external-tool-shortcuts > summary { color: var(--muted); font-weight: 500; }
.external-tool-link { border-color: var(--line); border-radius: 6px; font-weight: 500; }

.home-page .command-hero { padding: 0 0 16px; margin-bottom: 16px; }
.home-page .command-copy {
  grid-template-columns: minmax(0, 1fr); align-items: start; gap: 12px;
}
.home-page .command-copy > .command-search-button {
  grid-column: 1; grid-row: 1; width: 100%; min-height: 44px;
}
.home-page .command-copy > .quick-action-row {
  display: grid; grid-column: 1; grid-row: 2;
  grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 8px;
}
.home-page .quick-action { min-height: 44px; padding: 10px 8px; }
.home-page .command-copy > .external-tool-shortcuts {
  grid-column: 1; grid-row: 3; justify-self: stretch; width: 100%; margin: 0;
}
.home-page .external-tool-shortcuts > summary { min-height: 44px; gap: 12px; }

/* Sections remain unframed; individual operational records have their own boundary. */
.panel { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.main > .panel, .main > .grid:not(.kpis), .main > .template-catalog { border-top: 1px solid var(--line-soft); }
.main > .panel + .panel { margin-top: 24px; }
.panel-header { align-items: center; padding: 20px 0 16px; gap: 12px; }
.panel-header > div { min-width: 0; }
.panel-header p { margin: 4px 0 0; font-size: 0.8125rem; }
.list, .compact-list { padding: 4px 0 16px; gap: 0; }
.status-row, .ops-card .status-row {
  padding: 16px 0; border: 0; border-bottom: 1px solid var(--line-soft);
  border-radius: 0; background: transparent; box-shadow: none;
}
.status-row strong { font-size: 0.875rem; font-weight: 600; }
.status-row p, .status-row span { font-size: 0.8125rem; }
.status-row p { margin: 5px 0 0; line-height: 1.65; color: var(--muted); }
.status-row > div { min-width: 0; }
.status-row .pill { font-size: 0.6875rem; }
.status-link:hover { background: var(--surface); }
.status-link { padding-inline: 12px; }
.home-action-card { background: transparent; }
.home-action-panel .panel-header { padding-top: 0; }
.main > .home-action-panel { border-top: 0; }
.home-action-panel .home-action-card { min-height: 80px; padding: 16px 12px; }
.home-action-panel .home-data-toolbar { padding: 12px 0 16px; border-top: 0; }
.home-data-toolbar .connection-card { gap: 4px 8px; padding: 4px 8px; }
.home-data-toolbar .connection-card span,
.home-data-toolbar .connection-card strong { font-size: 0.8125rem; line-height: 1.5; }
.home-data-toolbar .refresh-button { font-size: 0.75rem; line-height: 1.25; }
.home-page .home-action-panel { margin-bottom: 0; }
.home-page .home-action-panel > .list { padding-bottom: 0; }
.home-page .main > .panel + .panel { margin-top: 0; }
.empty-state { padding: 22px 0; border: 0; border-radius: 0; background: transparent; color: var(--muted); font-size: 0.8125rem; text-align: left; }
.empty-state.error-state { color: var(--red); background: var(--red-soft); padding: 12px; border-radius: 6px; }
.kpis, .meal-kpis, .video-watch-kpis { gap: 0; grid-auto-rows: minmax(118px, 1fr); margin-bottom: 24px; border-bottom: 1px solid var(--line-soft); }
.kpis > .metric, .meal-kpis .metric, .video-watch-kpis .metric {
  min-height: 118px; height: 100%; padding: 16px; border: 0;
  border-right: 1px solid var(--line-soft); border-radius: 0; background: transparent;
}
.kpis > .metric:first-child { padding-left: 0; }
.kpis > .metric:last-child { border-right: 0; }
.metric::before { display: none; }
.metric-label, .meal-kpis .metric-label { font-size: 0.75rem; font-weight: 500; }
.metric-value, .meal-kpis .metric-value { margin-top: 8px; font-size: 1.75rem; line-height: 1.2; font-weight: 650; font-variant-numeric: tabular-nums; }
.metric-value.compact { font-size: 0.9375rem; line-height: 1.5; }
.metric-note { font-size: 0.75rem; }
.pill { max-width: 100%; min-height: 24px; padding: 3px 8px; border: 1px solid transparent; border-radius: 4px; font-size: 0.6875rem; font-weight: 500; background: var(--paper-deep); white-space: normal; overflow-wrap: anywhere; }
.pill.good { color: var(--green); background: var(--green-soft); }
.pill.warn { color: var(--yellow); background: var(--yellow-soft); }
.pill.danger { color: var(--red); background: var(--red-soft); }
.text-link { min-height: 44px; border: 0; border-radius: 4px; padding: 8px 10px; font-size: 0.8125rem; font-weight: 500; background: transparent; color: var(--text); white-space: normal; text-decoration: underline; text-underline-offset: 4px; }
.text-link:hover { background: var(--surface); }
:is(.primary-action,.secondary-action,.filter-button,.segmented-control button,.workflow-tabs button,.renewal-actions button,.parking-delete-button) { border-radius: 5px; font-size: 0.8125rem; font-weight: 600; }
.primary-action { background: var(--text); }
.primary-action:hover { background: #39444f; }
.secondary-action { background: #fff; border-color: var(--line); color: var(--text); }
.segmented-control { background: var(--surface); border-color: var(--line-soft); border-radius: 6px; padding: 3px; }
.segmented-control button.active { box-shadow: 0 1px 3px #20262c12; }
.workflow-tabs { gap: 0; border-bottom: 1px solid var(--line); }
.workflow-tabs button { padding: 10px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; }
.workflow-tabs button[aria-selected="true"] { color: var(--accent); background: transparent; border-color: var(--accent); }
.workflow-tabs button:hover:not([aria-selected="true"]) { background: var(--surface); color: var(--text); }
.disclosure-body > .workflow-tabs { margin: 12px 0 16px; }
.action-disclosure > summary, .diagnostic-panel > summary { padding: 18px 0; gap: 12px; }
.main > .action-disclosure { margin-top: 0; }
.main > .action-disclosure > summary { min-height: 68px; }
.action-disclosure > summary { padding-inline-end: 36px; }
.action-disclosure > summary strong { font-size: 0.9375rem; font-weight: 650; }
.action-disclosure > summary small { font-size: 0.75rem; font-weight: 400; }
.action-disclosure > summary::after, .diagnostic-panel > summary::after { width: 24px; height: 24px; right: 0; background: transparent; color: var(--muted); }
.action-disclosure > summary:hover { background: var(--surface); }
.action-disclosure > summary::after { content: ""; width: 8px; height: 8px; right: 12px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; border-radius: 0; transform: translateY(-70%) rotate(45deg); }
.action-disclosure[open] > summary::after { content: ""; transform: translateY(-30%) rotate(225deg); }
.action-disclosure[open] > summary { border-bottom: 1px solid var(--line-soft); }
.home-page .main > .action-disclosure > summary {
  min-height: 64px; flex-direction: row; flex-wrap: wrap; align-items: center;
  gap: 8px 12px; padding: 16px 36px 16px 0;
}
.home-page .action-disclosure > .disclosure-body { padding-bottom: 16px; }
.ops-card, .parking-dashboard article { border: 0; border-radius: 0; padding: 16px 0; background: transparent; }
.ops-card + .ops-card { border-top: 1px solid var(--line-soft); }
.ops-card-header { margin-bottom: 12px; }
.ops-card h3, .ops-card strong { font-weight: 600; }
.ops-card p { font-weight: 400; }
.renewal-summary-grid { padding: 0 0 12px; }
.disclosure-actions { padding: 8px 0; }
.table-wrap { padding: 8px 0 20px; }
th { font-weight: 600; background: var(--surface); }
th, td { padding: 12px; }
th { color: var(--muted); font-size: 0.75rem; border-bottom-color: var(--line); }
td { font-size: 0.8125rem; font-variant-numeric: tabular-nums; }
tbody tr:hover { background: var(--surface); }
.filter-bar { padding-inline: 0; }
.action-form, .instructor-registration-form, .refund-form { padding: 16px 0; gap: 16px; }
.action-form span, .instructor-registration-fields label, .refund-form label { font-weight: 500; font-size: 0.8125rem; }
:is(.action-form,.instructor-registration-fields,.refund-form,.meal-editor-grid,.meal-day-editor,.quiz-form) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  border-color: var(--line); border-radius: 5px; background-color: #fff;
  min-height: 44px; font-size: 0.875rem; font-weight: 400;
}
input::placeholder, textarea::placeholder { color: #7a8691; font-weight: 400; opacity: 1; }
:is(.action-form,.refund-form,.instructor-registration-form,.meal-review-panel) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea):hover:not(:disabled):not(:focus) { border-color: #b9c1cc; }
:is(.action-form,.refund-form,.instructor-registration-form,.meal-review-panel) :is(input,select,textarea):focus-visible { border-color: var(--blue); outline: 2px solid var(--blue); outline-offset: 2px; }
.form-status { font-size: 0.8125rem; font-weight: 500; }
.form-status:empty { min-height: 0; margin: 0; padding: 0; }
.parking-dashboard { padding: 16px 0; }
.instructor-registration-list, .member-registration-list { padding: 8px 0 20px; }
.instructor-registration-item { border-color: var(--line); border-radius: 6px; padding: 20px; background: #fff; }
.instructor-registration-progress small, .instructor-registration-progress em { font-size: 0.75rem; font-weight: 500; }
.instructor-registration-progress li > span { width: 26px; height: 26px; font-size: 0.6875rem; }
.instructor-seat-item { min-height: 150px; border-color: var(--line); border-radius: 6px; background: #fff; gap: 14px; }
.instructor-seat-item.is-standard { background: #fff; border-color: var(--line); }
.instructor-seat-item.is-team { background: #eef9fa; border-color: #8abfc5; color: var(--text); }
.instructor-seat-progress { height: 4px; background: var(--paper-deep); }
.instructor-seat-progress > span { background: var(--green); }
.instructor-seat-item-head strong { font-weight: 600; }
.instructor-seat-counts small { font-size: 0.75rem; }
.instructor-seat-waitlist-count { color: var(--muted); font-size: 0.8125rem; }
.instructor-waitlist { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.instructor-waitlist h4 { margin: 0 0 12px; font-size: 0.875rem; }
.instructor-waitlist-list { list-style: none; padding: 0; margin: 0; }
.instructor-waitlist-row { display: grid; grid-template-columns: minmax(2.5rem, max-content) minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.instructor-waitlist-row > div { display: grid; min-width: 0; gap: 6px; }
.instructor-waitlist-row :is(strong,span,small) { overflow-wrap: anywhere; }
.instructor-waitlist-registration { overflow-wrap: anywhere; }
.instructor-waitlist-row :is(span,small), .instructor-waitlist-empty { color: var(--muted); font-size: 0.8125rem; }
.instructor-lessons-page #instructorLessonRegistrationFilters { flex-wrap: wrap; max-width: 100%; }
.instructor-lessons-page #instructorLessonRegistrationFilters button { flex: 1 0 auto; min-height: 44px; }
.instructor-registration-checks label { background: var(--surface); font-weight: 500; }
.instructor-registration-form .instructor-registration-checks[hidden],
.instructor-registration-form label[hidden] { display: none; }
.instructor-registration-note { margin: 12px 0 0; }
.instructor-lesson-roster-row { display: flex; flex-wrap: wrap; gap: 12px; }
.instructor-lesson-roster-row > div:first-child { flex: 1 1 12rem; overflow-wrap: anywhere; }
.instructor-lesson-roster-actions { display: flex; max-width: 100%; flex-wrap: wrap; align-items: center; gap: 8px; }
.instructor-lesson-cancel-button { min-height: 44px; padding: 8px 12px; color: var(--red); }
.instructor-lesson-cancellation-status:empty { display: none; }
.instructor-lesson-cancellation-dialog {
  box-sizing: border-box; width: min(30rem, calc(100% - 2rem)); max-width: calc(100% - 2rem);
  max-height: calc(100dvh - 2rem); overflow-y: auto; padding: 20px;
  border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text);
}
.instructor-lesson-cancellation-dialog::backdrop { background: rgb(24 27 32 / 45%); }
.instructor-lesson-cancellation-dialog form { display: grid; min-width: 0; gap: 12px; }
.instructor-lesson-cancellation-dialog :is(h2,p,dl,dd) { margin: 0; overflow-wrap: anywhere; }
.instructor-lesson-cancellation-target { display: grid; gap: 8px; }
.instructor-lesson-cancellation-target > div { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: 8px; }
.instructor-lesson-cancellation-target dt { color: var(--muted); }
.instructor-lesson-cancellation-dialog label { font-weight: 600; }
.instructor-lesson-cancellation-dialog textarea {
  box-sizing: border-box; width: 100%; min-width: 0; min-height: 88px; resize: vertical;
  padding: 10px; border: 1px solid var(--line); border-radius: 6px; font: inherit;
}
.instructor-lesson-cancellation-dialog [aria-invalid="true"] { border-color: var(--red); }
.instructor-lesson-cancellation-dialog .form-status:empty { display: none; }
.instructor-lesson-cancellation-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; }
.instructor-lesson-cancellation-actions button { min-height: 44px; white-space: normal; }
.instructor-flow-steps { padding: 12px 0; }
.refund-send-check, .refund-send-actions, .refund-panel > .form-status { margin-inline: 0; }
.refund-result { padding-inline: 0; }
.refund-final-amount { background: var(--green-soft); border-color: #c9e1d5; }
.refund-send-action { border-radius: 6px; }
.meal-queue-panel .panel-header, .meal-review-panel .panel-header { padding: 18px 0 12px; }
.meal-queue, #mealReviewBody, .meal-queue-panel .filter-bar { padding-inline: 0; }
.meal-source-card { border: 0; border-top: 1px solid var(--line-soft); border-radius: 0; background: var(--surface); }
.staff-composite-head strong { font-size: 2rem; }
.staff-detail-kpi strong { font-size: 1.5rem; }
.video-watch-toolbar { padding: 16px 0; }
.video-watch-member-list, .video-watch-history { padding-inline: 0; }
.rule-note { background: transparent; }
.rule-section .panel-header { padding-inline: 0; }
.rule-section.is-collapsed .panel-header { padding-inline: 0; }
.catalog-heading { border-top: 0; padding-top: 20px; }
.catalog-heading h2 { font-size: 1.0625rem; }
.template-catalog { margin-block: 0 28px; }
.catalog-row > summary:hover { background: var(--surface); }
.template-catalog :focus-visible { outline-color: var(--blue); }

.private-page { --private-ink: var(--text); --private-muted: var(--muted); --private-line: var(--line); --private-accent: var(--accent); }
.private-page .private-main { padding: 24px 16px 48px; background: #fff; }
.private-page .topbar { padding: 0 0 16px; background: transparent; }
.private-page .private-workspace { padding: 0; max-width: none; container: private-workspace / inline-size; }
.private-page .private-mast { margin: 0; }
.private-page .private-mast h1 { font-size: 1.5rem; }
.private-page .private-layout { grid-template-columns: minmax(0, 1fr); }
.private-page .private-instructors { padding-left: 0; border-left: 0; }
.private-page .private-progress { container: private-progress / inline-size; }
.private-page .stage-board { grid-template-columns: minmax(0, 1fr); }
.private-page .private-summary { margin-bottom: 24px; }
.private-page .stage-card { padding: 16px; background: #fff; border-color: var(--line); border-radius: 6px; }
.private-page .pill.warn { color: var(--yellow); background: var(--yellow-soft); }
.private-page .pill.good { color: var(--green); background: var(--green-soft); }
.private-page .stage-column-header { border-bottom-width: 1px; }
.private-page .stage-column-header strong::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--soft); }
.private-page .stage-recording .stage-column-header { border-color: var(--line); }
.private-page .stage-recording .stage-column-header strong::before { background: var(--blue); }
.private-page :is(.stage-review,.stage-report_review) .stage-column-header { border-color: var(--line); }
.private-page :is(.stage-review,.stage-report_review) .stage-column-header strong::before { background: var(--yellow); }
.private-page :is(.stage-complete,.stage-delivered) .stage-column-header { border-color: var(--line); }
.private-page :is(.stage-complete,.stage-delivered) .stage-column-header strong::before { background: var(--green); }
.private-page .top-actions { flex-basis: auto; }
.private-page .connection-card strong { font-size: 0.75rem; }
.private-page .private-brand { color: var(--muted); font-size: 0.8125rem; font-weight: 500; }
.sequence-page .shell { gap: 0; }
.sequence-page .sequence-main { padding: 0; background: #fff; }

.command-palette { background: #24272e40; backdrop-filter: none; padding-top: min(9dvh, 72px); }
.command-palette-card { grid-template-rows: auto auto minmax(0, 1fr); max-height: min(680px, calc(100dvh - min(9dvh, 72px) - 24px)); border-color: var(--line); border-radius: 8px; background: #fff; box-shadow: 0 16px 64px #24272e26; }
.command-palette-close { justify-self: end; display: inline-flex; width: 44px; height: 44px; padding: 0; margin: 8px 8px 0; align-items: center; justify-content: center; }
.command-palette-search { padding: 8px 20px 20px; gap: 10px; }
.command-palette-search span { font-size: 0.8125rem; font-weight: 500; }
.command-palette-search input { font-size: 1rem; font-weight: 400; border-radius: 6px; }
.command-palette-results { gap: 2px; padding: 8px; }
.command-palette-results a { padding: 12px; border-radius: 5px; }
.command-palette-results a:hover { border-color: transparent; background: var(--surface); }
.command-palette-results strong { font-size: 0.875rem; font-weight: 550; }
.command-palette-results span { font-size: 0.75rem; }

/* Exclude background controls while the full-page login gate is active. */
body:has(> .login-gate.on) > :is(.shell, .command-palette) { visibility: hidden; }
.login-gate { background: var(--paper); backdrop-filter: none; }
.login-card { width: min(100%, 380px); padding: 32px; gap: 20px; box-shadow: 0 12px 40px #24272e08; border-color: var(--line); border-radius: 8px; }
.login-brand { display: grid; justify-items: start; gap: 14px; margin-bottom: 4px; }
.login-brand img { width: 48px; height: 48px; }
.login-card h2 { font-size: 1.25rem; }
.login-card button { background: var(--text); font-weight: 600; border-radius: 5px; }
.login-card input { background: #fff; border-radius: 5px; }
.login-error:empty { display: none; }

@media (min-width: 720px) {
  .main, .private-page .private-main { padding: 28px 28px 56px; }
  .topbar { flex-direction: row; align-items: start; }
  .top-actions, .top-actions:has(> .command-search-button) { max-width: min(100%, 35rem); justify-content: end; margin-left: auto; }
  .home-page .command-copy { grid-template-columns: minmax(0, 1fr) minmax(12rem, 24rem); gap: 12px 16px; }
  .home-page .command-copy > .external-tool-shortcuts { grid-column: 2; grid-row: 1; }
  .home-page .command-copy > .quick-action-row { grid-column: 1 / -1; grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1040px) {
  .home-page .shell { grid-template-rows: auto 1fr; }
}
@media (min-width: 1041px) {
  .shell { grid-template-columns: 13.5rem minmax(0, 1fr); }
  .sidebar { display: flex; flex-direction: column; align-items: stretch; gap: 22px; position: sticky; height: 100dvh; padding: 24px 12px 16px; border-right: 1px solid var(--line); border-bottom: 0; }
  .brand { padding: 0 8px; }
  .sidebar .nav, .sidebar:not(.is-open) .nav { display: grid; grid-template-columns: minmax(0, 1fr); max-height: none; padding-top: 8px; gap: 3px; }
  .mobile-nav-toggle { display: none; }
  .main, .private-page .private-main { max-width: 100rem; padding: 32px 40px 64px; }
  .command-copy { grid-template-columns: minmax(0, 1fr) minmax(16rem, 32rem); align-items: center; }
  .command-copy > h1 { grid-column: 1; grid-row: 1; margin: 0; }
  .command-copy > .command-search-button { grid-column: 2; grid-row: 1; }
  .command-copy > .quick-action-row { grid-column: 1; grid-row: 2; }
  .command-copy > .external-tool-shortcuts { grid-column: 2; grid-row: 2; justify-self: end; }
  .sequence-page .sequence-main { padding: 0; max-width: none; }
}
@media (max-width: 719px) {
  h1, .private-page .private-mast h1 { font-size: 1.375rem; }
  .quick-action-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .quick-action { padding: 10px 8px; }
  .kpis > .metric:nth-child(odd) { padding-left: 0; }
  .kpis > .metric:nth-child(even) { border-right: 0; }
  .kpis > .metric:nth-child(n+3) { border-top: 1px solid var(--line-soft); }
  .private-page .topbar { align-items: stretch; padding: 0 0 16px; }
  .private-page .top-actions { width: 100%; }
  .member-registration-page .top-actions:has(> .command-search-button) { display: flex; width: auto; }
  .member-registration-open { flex: 1 1 auto; white-space: normal; }
  .top-actions > .command-search-button { flex-basis: calc(100% - 52px); }
  .top-actions .connection-card { flex-basis: calc(100% - 60px); }
  .parking-dashboard { gap: 0; }
  .instructor-registration-item { padding: 14px; }
  .private-page .private-workspace { padding: 0; }
}

@container private-workspace (min-width: 80rem) {
  .private-page .private-layout { grid-template-columns: minmax(0, 1fr) 16rem; }
  .private-page .private-instructors { padding-left: 24px; border-left: 1px solid var(--line); }
}
@container private-progress (min-width: 36rem) {
  .private-page .stage-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container private-progress (min-width: 70rem) {
  .private-page .stage-board { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Finite compositor-only feedback; no polling, timers or data-driven motion. */
@keyframes core-content-enter {
  from { opacity: 0.92; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes core-dialog-enter {
  from { opacity: 0.8; transform: translateY(-5px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: no-preference) {
  .main:not(.sequence-main) { animation: core-content-enter var(--motion-enter) var(--motion-ease); }
  .command-palette:not([hidden]) .command-palette-card { animation: core-dialog-enter var(--motion-enter) var(--motion-ease); }
  .action-disclosure[open] > .disclosure-body { animation: core-content-enter var(--motion-fast) var(--motion-ease); }
  .sidebar.is-open .nav { animation: core-content-enter var(--motion-fast) var(--motion-ease); }
  :is(.nav a,.nav-more-button,.quick-action,.primary-action,.secondary-action,.refresh-button,.command-search-button,.mobile-nav-toggle,.filter-button,.workflow-tabs button,.segmented-control button,.status-link) { transition: background-color var(--motion-fast) ease, color var(--motion-fast) ease, border-color var(--motion-fast) ease, box-shadow var(--motion-fast) ease, transform var(--motion-fast) var(--motion-ease); }
  button:is(.primary-action,.secondary-action,.refresh-button,.command-search-button,.mobile-nav-toggle):active:not(:disabled) { transform: translateY(1px); }
  .action-disclosure > summary::after { transition: transform var(--motion-fast) var(--motion-ease); }
}
@media (prefers-reduced-motion: reduce) {
  .shell, .shell *, .shell *::before, .shell *::after,
  .command-palette, .command-palette *, .login-gate, .login-gate * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .refresh-button[aria-busy="true"] .ui-icon { animation: none; }
}