/* Clinic workspace only. The public catalog and patient request page keep their own styles. */
body.clinic-glass {
  --ink: #f1f7f4;
  --dark: #f1f7f4;
  --muted: #b3c6bf;
  --line: rgba(221, 241, 231, .15);
  --paper: #1c332e;
  --bg: #0b211d;
  --mint: #8ce0bf;
  --accent: #8ce0bf;
  --lime: #8ce0bf;
  --pale: rgba(140, 224, 191, .12);
  --amber: #f2d29a;
  --danger: #ffb5af;
  --radius: 22px;
  --glass-surface: rgba(31, 52, 46, .82);
  --glass-border: rgba(225, 246, 236, .16);
  --glass-shadow: 0 12px 34px rgba(0, 14, 10, .13), inset 0 1px 0 rgba(255, 255, 255, .04);
  min-height: 100dvh;
  background: #0b211d;
  background-image: radial-gradient(ellipse at 72% 3%, rgba(168, 180, 151, .23), transparent 47%), radial-gradient(ellipse at 4% 67%, rgba(47, 124, 102, .27), transparent 43%), linear-gradient(135deg, #0b211d 10%, #203a31 63%, #10251f);
  background-attachment: fixed;
  color: var(--ink);
  color-scheme: dark;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
.clinic-glass ::selection { background: #8ce0bf; color: #102c23; }
.clinic-glass :is(h1,h2,h3,h4,strong) { color: inherit; }
.clinic-glass :is(h1,h2,h3) { font-weight: 750; }
.clinic-glass h1 { font-size: clamp(32px, 3vw, 43px); letter-spacing: -.045em; }
.clinic-glass h2 { font-size: 24px; }
.clinic-glass a { text-underline-offset: 4px; }
.clinic-glass :is(button,a,input,select,textarea,summary):focus-visible { outline: 3px solid #a7f0d6; outline-offset: 4px; }
.clinic-glass button { min-height: 44px; transition: background-color .16s ease, border-color .16s ease; }
.clinic-glass button:hover { filter: none; }
.clinic-glass button:disabled { opacity: .62; }
.clinic-glass :is(.eyebrow,.guide-step:before) { color: #9bd9c1; font-size: 10px; font-weight: 750; letter-spacing: 1.5px; }
.clinic-glass :is(.intro p:not(.eyebrow),.page-intro>p:not(.eyebrow),.status-line,.workspace-footnote,.page-footer,footer) { color: var(--muted); }
.clinic-glass .intro { padding: 0; align-items: center; }
.clinic-glass .intro p:not(.eyebrow) { font-size: 14px; line-height: 1.65; }
.clinic-glass .intro h1 { margin: 9px 0 10px; }
.clinic-glass .skip-link { position: fixed; left: 16px; top: -90px; z-index: 50; padding: 12px 18px; border-radius: 10px; background: #a7f0d6; color: #0a2c20; }
.clinic-glass .skip-link:focus { top: 12px; }

/* Floating glass frame, with a stable readable surface when blur is unavailable. */
.clinic-glass :is(.sidebar,.topbar,.page-header,.panel,.stats article,.readiness-panel,.calendar-note) {
  background: var(--glass-surface);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .clinic-glass :is(.sidebar,.topbar,.page-header,.panel,.stats article,.readiness-panel,.calendar-note) {
    background: rgba(37, 58, 51, .61);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
}
.clinic-glass .sidebar {
  inset: 16px auto 16px 16px;
  width: 240px;
  padding: 24px 16px 18px;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #49695b transparent;
  background: rgba(22, 42, 35, .77);
}
.clinic-glass .main-wrap { margin-left: 272px; min-width: 0; padding: 0 16px 0 0; }
.clinic-glass .topbar {
  min-height: 68px;
  height: auto;
  margin: 16px 0 0;
  padding: 12px 24px;
  border-radius: 20px;
  font-size: 12px;
  gap: 16px;
}
.clinic-glass main { padding: 30px 10px 30px; max-width: 1600px; }
.clinic-glass .brand { display: flex; align-items: center; gap: 10px; white-space: nowrap; letter-spacing: 0; line-height: 1.12; }
.clinic-glass .brand .brand-mark { width: 36px; height: 38px; border: 1px solid rgba(174,239,207,.2); border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; color: #d0f7e6; background: rgba(140,224,191,.1); }
.clinic-glass .brand .brand-name { display: flex; flex-direction: column; color: #f1f7f4; }
.clinic-glass .brand-name strong { font-size: 18px; font-weight: 800; letter-spacing: -.5px; }
.clinic-glass .brand-name small { font: 500 10px/1.5 ClinicSans,Arial,sans-serif; color: var(--muted); margin-top: 4px; }
.clinic-glass .workspace { gap: 10px; margin: 24px 0 20px; padding: 17px 5px; border-color: var(--line); }
.clinic-glass .workspace strong { font-size: 12px; line-height: 1.5; }
.clinic-glass .workspace small { color: var(--muted); font-size: 11px; }
.clinic-glass .clinic-mark { width: 35px; height: 35px; background: rgba(140,224,191,.13); border: 1px solid rgba(140,224,191,.15); color: #b8f3d9; border-radius: 11px; font-size: 17px; }
.clinic-glass .sidebar nav { display: grid; gap: 6px; }
.clinic-glass .sidebar nav button { min-height: 48px; padding: 12px; gap: 11px; font-size: 12px; line-height: 1.4; border: 1px solid transparent; border-radius: 13px; color: #bfd0c8; background: transparent; }
.clinic-glass .sidebar nav button:hover { color: #fff; background: rgba(230,248,237,.06); border-color: rgba(230,248,237,.1); }
.clinic-glass .sidebar nav button:is(.active,[aria-current]) { background: rgba(140,224,191,.17); border-color: rgba(168,237,204,.25); color: #d5ffe8; box-shadow: inset 0 1px rgba(255,255,255,.04); }
.clinic-glass .nav-icon { display: grid; place-items: center; width: 20px; height: 20px; flex-shrink: 0; }
.clinic-glass .sidebar nav svg { width: 19px; height: 19px; flex-shrink: 0; }
.clinic-glass .sidebar nav :is(.nav-count,b) { margin-left: auto; min-width: 24px; height: 24px; display: grid; place-items: center; padding: 0 5px; border: 1px solid rgba(222,245,233,.13); border-radius: 7px; color: #d2e5da; background: rgba(4,24,16,.19); font-size: 10px; }
.clinic-glass .sidebar nav button:is(.active,[aria-current]) :is(.nav-count,b) { color: #defbe9; background: rgba(140,224,191,.13); border-color: rgba(140,224,191,.18); }
.clinic-glass .sidebar-bottom { margin-top: auto; padding: 36px 9px 15px; }
.clinic-glass .sidebar-bottom>p:nth-child(2) { font-size: 20px; line-height: 1.35; font-weight: 650; color: #d3e5da; margin: 12px 0 18px; }
.clinic-glass .sidebar-bottom a { min-height: 44px; margin: 0; display: flex; align-items: center; justify-content: space-between; font-size: 11px; color: #b8cfc2; }
.clinic-glass .sidebar-bottom a span { color: #8ce0bf; }
.clinic-glass .sidebar-note { margin-top: auto; background: rgba(140,224,191,.055); border-color: rgba(216,239,225,.12); padding: 18px 15px; border-radius: 17px; }
.clinic-glass .sidebar-note h3 { font-size: 21px; color: #e6f4eb; font-weight: 650; line-height: 1.2; }
.clinic-glass .sidebar-note p { font-size: 11px; line-height: 1.7; color: var(--muted); }
.clinic-glass .demo-tag { background: rgba(140,224,191,.14); color: #baf0d6; border: 1px solid rgba(140,224,191,.16); font-size: 9px; padding: 4px 8px; }
.clinic-glass .back-link { min-height: 44px; display: flex; align-items: center; color: var(--muted); font-size: 11px; padding: 0 9px; margin: 10px 0 0; }
.clinic-glass .breadcrumb { color: #b0c6ba; }
.clinic-glass :is(.breadcrumb strong,#crumb) { color: #eaf6ee; }
.clinic-glass :is(.breadcrumb span,.slash) { color: #81998c; margin-inline: 10px; }
.clinic-glass :is(.mode-pill,.demo-pill) { background: rgba(140,224,191,.08); border: 1px solid rgba(140,224,191,.18); color: #c0e3cf; font-size: 10px; font-weight: 600; padding: 8px 11px; }
.clinic-glass .avatar { background: rgba(140,224,191,.16); color: #cbf9e0; border: 1px solid rgba(140,224,191,.2); width: 34px; height: 34px; font-size: 10px; }
.clinic-glass .top-actions>a { min-height: 44px; display: flex; align-items: center; color: #d6eadd; }

/* Buttons, fields and state labels keep an opaque enough base for daily use. */
.clinic-glass :is(.button,.primary,.secondary) { min-height: 44px; border-radius: 12px; padding: 12px 17px; font-size: 12px; font-weight: 750; line-height: 1.4; }
.clinic-glass .primary { background: #8ce0bf; border: 1px solid #a1e9cd; color: #123c2c; box-shadow: 0 3px 10px rgba(0,20,12,.12); }
.clinic-glass .primary:hover { background: #a4ebcf; color: #102f24; }
.clinic-glass .secondary { color: #e1f0e7; background: rgba(206,236,218,.075); border: 1px solid rgba(224,245,232,.2); }
.clinic-glass .secondary:hover { background: rgba(206,236,218,.14); }
.clinic-glass .danger { color: #ffc4bb; background: #47332e; border-color: #76504a; }
.clinic-glass .danger:hover { background: #573830; }
.clinic-glass :is(.text-button,.quiet-link) { color: #b7edd3; font-size: 12px; }
.clinic-glass .text-button { min-height: 44px; }
.clinic-glass .quiet-link { display: inline-flex; align-items: center; min-height: 44px; }
.clinic-glass :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { color: #f0f7f3; background-color: #223d32; border: 1px solid #557464; border-radius: 11px; min-height: 44px; }
.clinic-glass :is(input,textarea)::placeholder { color: #a9beb2; opacity: 1; }
.clinic-glass select option { color: #f0f7f3; background: #233e32; }
.clinic-glass :is(input,select):disabled { color: #acc1b3; background: #253c32; opacity: 1; }
.clinic-glass input[type=checkbox] { accent-color: #8ce0bf; }
.clinic-glass .badge { font-size: 10px; line-height: 1.4; padding: 5px 8px; border: 1px solid rgba(213,238,223,.15); border-radius: 7px; color: #c8d9cf; background: #344b3e; }
.clinic-glass .badge:is(.pending,.proposed,.reschedule_proposed,.awaiting_confirmation,.cancel_requested,.reschedule_requested) { color: #f7d599; background: #493e29; border-color: #72613e; }
.clinic-glass .badge:is(.confirmed,.arrived,.completed) { color: #adf0cd; background: #224b39; border-color: #426952; }
.clinic-glass .badge:is(.declined,.cancelled,.no_show) { color: #ffc2b5; background: #4d3530; border-color: #795047; }
.clinic-glass .badge.expired { background: #3b4841; border-color: #657268; color: #c8d2ca; }
.clinic-glass :is(.status-line.error,.inline-status.error,#form-error) { color: #ffc4b9; }
.clinic-glass .count-pill { color: #c3d4c9; background: rgba(210,238,221,.05); border-color: var(--line); padding: 5px 10px; }

/* Content panels and agenda. */
.clinic-glass .panel { border-radius: 20px; overflow: hidden; }
.clinic-glass .work-grid { grid-template-columns: minmax(0,1fr) 280px; gap: 18px; }
.clinic-glass .right-column { gap: 18px; }
.clinic-glass .panel-heading { padding: 23px 23px 19px; }
.clinic-glass .panel-heading h2 { font-size: 24px; font-weight: 700; }
.clinic-glass .list-tools { padding: 0 23px 17px; border-color: var(--line); }
.clinic-glass .appointment-table th { background: rgba(10,29,19,.22); color: #b8d0bf; padding-block: 13px; font-size: 10px; }
.clinic-glass .appointment-table td { border-color: rgba(224,246,233,.1); }
.clinic-glass .appointment-table tbody tr:hover { background: rgba(201,238,213,.04); }
.clinic-glass .appointment-table td small { color: #adc5b6; font-size: 11px; }
.clinic-glass .appointment-table .row-open { background: rgba(140,224,191,.1); border: 1px solid rgba(140,224,191,.18); color: #c3f5d9; min-width: 44px; width: 44px; height: 44px; border-radius: 11px; }
.clinic-glass .appointment-table .row-open:hover { background: rgba(140,224,191,.19); }
.clinic-glass .appointment { border-color: rgba(224,246,233,.1); padding: 21px 23px; }
.clinic-glass .appointment:hover { background: rgba(201,238,213,.035); }
.clinic-glass .time { color: #ecf8ef; font-size: 16px; }
.clinic-glass :is(.time small,.service) { color: #b6ccbd; }
.clinic-glass .patient { color: #f1f7f2; font-size: 14px; font-weight: 700; }
.clinic-glass .row-actions { max-width: 190px; gap: 6px; }
.clinic-glass .row-actions button { color: #dceee2; background: rgba(208,236,217,.07); border: 1px solid rgba(224,245,232,.19); min-height: 44px; border-radius: 10px; padding: 10px 12px; font-size: 11px; }
.clinic-glass .row-actions .accept { color: #123c2c; background: #8ce0bf; border-color: #a1e9cd; }
.clinic-glass .row-actions .decline { color: #ffc4b9; }
.clinic-glass .row-actions button:hover { background: rgba(208,236,217,.15); }
.clinic-glass .row-actions .accept:hover { background: #a4ebcf; }
.clinic-glass .filters { gap: 5px; }
.clinic-glass .filters button { min-height: 44px; border-radius: 10px; padding: 10px 12px; font-size: 11px; color: #b6ccbd; }
.clinic-glass .filters button.active { background: rgba(140,224,191,.14); color: #d0f8df; }
.clinic-glass .search { background: rgba(8,29,17,.23); border-color: rgba(224,245,232,.17); color: #b6ccbd; border-radius: 12px; min-height: 44px; padding: 0 12px; }
.clinic-glass .search input { background: transparent; border: 0; color: #eaf5ec; font-size: 12px; min-height: 42px; padding: 0; }
.clinic-glass .search:focus-within { outline: 2px solid #a7f0d6; outline-offset: 3px; border-radius: 12px; }
.clinic-glass .empty-state>span { color: #baf1d4; background: rgba(140,224,191,.12); }
.clinic-glass .empty-state h3 { color: #e8f5ec; }
.clinic-glass :is(.empty-state,.empty) { color: #b6ccbd; }
.clinic-glass .calendar-note { padding: 24px; background: linear-gradient(135deg, rgba(90,151,113,.22), rgba(22,55,34,.56)); }
.clinic-glass .calendar-note .eyebrow { color: #aedec1; font-size: 9px; }
.clinic-glass .calendar-note h2 { font-size: 31px; color: #eaf8ec; font-weight: 650; }
.clinic-glass .calendar-note>p:last-child { color: #b8d5bf; }
.clinic-glass .note-mark { color: #93d5ab; }
.clinic-glass .onboarding { padding: 23px; }
.clinic-glass .onboarding summary { min-height: 44px; font-size: 14px; }
.clinic-glass .onboarding li:before { color: #b8f3d0; background: rgba(140,224,191,.12); }
.clinic-glass .onboarding li p { color: #b0c9b8; }
.clinic-glass .onboarding .text-button { font-size: 11px; min-height: 44px; }
.clinic-glass .onboarding>.quiet-link { font-size: 12px; }
.clinic-glass .next-panel { background: linear-gradient(130deg,rgba(105,156,111,.26),rgba(31,67,42,.62)); border-color: rgba(190,237,192,.23); }
.clinic-glass .next-panel>.eyebrow { color: #c0e2be; font-size: 9px; }
.clinic-glass .next-time { color: #eff9e9; font-size: 46px; letter-spacing: -2px; }
.clinic-glass .next-panel p { color: #bcd5bc; }
.clinic-glass .hours-panel { padding: 23px; }
.clinic-glass .hours-panel .panel-heading { padding: 0; }
.clinic-glass .hours-panel h2 { font-size: 23px; }
.clinic-glass :is(.hours-panel p,.hours-panel .panel-heading>span,.slot-legend) { color: #b5caba; }
.clinic-glass .slots button { min-height: 44px; border: 1px solid #526f59; border-radius: 10px; color: #c4efcf; background: #2a4935; font-size: 11px; }
.clinic-glass .slots button.closed { background: #2e3f34; color: #a8b9ac; border-color: #536155; opacity: 1; }
.clinic-glass .slots button.booked { color: #f2d498; background: #4a422d; border-color: #716346; opacity: 1; }
.clinic-glass .green { background: #8ce0bf; }
.clinic-glass .amber { background: #f2cd8d; }
.clinic-glass .muted { background: #82998a; }
.clinic-glass :is(.demo-banner,.readiness-panel) { font-size: 12px; color: #bdd4c5; }
.clinic-glass .demo-banner { border: 1px solid rgba(206,239,211,.16); border-radius: 16px; background: rgba(18,44,27,.48); padding: 13px 17px; margin: 24px 0; line-height: 1.7; }
.clinic-glass .demo-banner strong { color: #deeee0; }
.clinic-glass .demo-reset-link { display: inline-flex; align-items: center; min-height: 44px; border-bottom: 0; color: #bce7cc; text-decoration: underline; text-underline-offset: 4px; padding: 0 7px; margin: 0 0 0 4px; font-size: 11px; }
.clinic-glass .guide-start { background: rgba(174,227,186,.08); border: 1px solid rgba(210,241,214,.23); color: #def3e1; padding: 10px 13px; border-radius: 10px; font-size: 11px; margin-top: 5px; }
.clinic-glass .readiness-panel { background: rgba(59,96,67,.25); border-color: rgba(178,226,185,.18); padding: 19px 21px; margin-bottom: 22px; }
.clinic-glass .readiness-mark { color: #bcf1d0; background: rgba(140,224,191,.12); }
.clinic-glass .readiness-panel h2 { font-size: 15px; }
.clinic-glass .readiness-panel p { color: #bfd4c3; }
.clinic-glass .readiness-panel .pilot-note { color: #afc8b5; }
.clinic-glass .readiness-panel>.quiet-link { margin-top: 0; }
.clinic-glass .clinic-toolbar { margin-bottom: 20px; }
.clinic-glass .clinic-toolbar p { color: #adc6b5; }
.clinic-glass .setup-toolbar { gap: 10px; }
.clinic-glass .setup-toolbar p { color: #b0c8b6; }
.clinic-glass .date-controls button { background: rgba(201,237,211,.07); border-color: rgba(218,242,221,.18); color: #e3f3e5; min-width: 44px; height: 44px; border-radius: 11px; }
.clinic-glass .date-controls input { background: #253f2e; border-color: #55715b; border-radius: 11px; min-height: 44px; width: 160px; }
.clinic-glass .date-controls button.quiet { min-height: 44px; color: #bfd3c2; background: transparent; border-radius: 11px; padding: 0 14px; }
.clinic-glass .date-controls button.quiet.active { background: rgba(140,224,191,.16); color: #d6f7dc; }
.clinic-glass #day-label { color: #b6ccb9; }
.clinic-glass .stats { gap: 14px; }
.clinic-glass .stats article { padding: 20px 22px; border-radius: 20px; }
.clinic-glass .stats article.highlight { background: rgba(135,157,104,.22); border-color: rgba(223,235,173,.24); }
.clinic-glass .stats article>span { color: #c7d9ca; font-size: 12px; }
.clinic-glass .stats article>strong { font-size: 42px; color: #f3f8ec; font-weight: 700; font-variant-numeric: tabular-nums; margin: 12px 0 6px; }
.clinic-glass .stats small { color: #b7c9bb; font-size: 11px; }
.clinic-glass .metric-card { background: rgba(12,36,21,.22); border-color: rgba(218,242,221,.14); border-radius: 16px; }
.clinic-glass .metric-card:first-child { background: rgba(135,187,135,.16); border-color: rgba(188,233,185,.27); color: #f1f9eb; }
.clinic-glass .metric-number { color: #eff8ea; font-weight: 700; }
.clinic-glass .metric-label { color: #c5dcc7; }
.clinic-glass .metric-note,.clinic-glass .metric-card:first-child .metric-note { color: #b2cbb5; }
.clinic-glass .metrics-definition { background: rgba(10,32,19,.23); border: 1px solid rgba(214,239,216,.1); border-radius: 15px; }
.clinic-glass .metrics-definition p { color: #b6ceb9; }
.clinic-glass :is(.detail-grid dt,.detail-section p,.field-hint) { color: #b5cbb7; }
.clinic-glass .detail-grid { border-color: var(--line); }
.clinic-glass :is(.notice,.form-note,.delivery-note,.fee-note) { background: #2b4935; border-color: #516f58; color: #c5dfca; }
.clinic-glass .notice.warning { background: #3f3c2b; border-color: #6c6547; color: #f0dba7; }
.clinic-glass fieldset .checkbox-label { background: #2a4231; border-color: #526a55; min-height: 44px; }
.clinic-glass .profile { max-width: 780px; }

/* Dialogs remain readable above every translucent surface. */
.clinic-glass dialog:not(#clinic-guide) { background: #1f382a; color: #eff7ed; border: 1px solid #5b7861; border-radius: 24px; box-shadow: 0 32px 100px rgba(0,14,6,.5),inset 0 1px rgba(255,255,255,.04); }
.clinic-glass dialog::backdrop { background: rgba(3,18,11,.7); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.clinic-glass .icon-button { background: #314f3a; color: #d9edda; border: 1px solid #58745c; min-width: 44px; width: 44px; height: 44px; border-radius: 12px; }
.clinic-glass .time-choice span,.clinic-glass .service-choices span { background: #2b4733; color: #d5e9d5; border-color: #55715a; min-height: 44px; }
.clinic-glass .time-choice input:checked+span,.clinic-glass .service-choices input:checked+span { color: #103b25; background: #8ce0bf; border-color: #a1e9cd; }
.clinic-glass .time-choice input:checked+span small { color: #234e36; }
.clinic-glass .time-choice input:disabled+span { background: #314136; color: #abbcac; border-color: #546358; }
.clinic-glass .time-choice small { color: #bfd1bf; }
.clinic-glass .time-choice input:focus-visible+span,.clinic-glass .service-choices input:focus-visible+span { outline-color: #a7f0d6; }
.clinic-glass #toast { color: #e6f5e6; background: #1c3a28; border-color: #678d70; }
.clinic-glass #clinic-guide { background: transparent; color: #eff7ed; }
.clinic-glass #clinic-guide::backdrop { background: rgba(2,18,10,.58); backdrop-filter: none; }
.clinic-glass .guide-card { background: #203d2a; border-color: #6b8e71; box-shadow: 0 28px 100px rgba(0,14,6,.5); color: #edf8e9; border-radius: 22px; }
.clinic-glass .guide-ring { border-color: #9ceac5; box-shadow: 0 0 0 5px rgba(156,234,197,.13); }
.clinic-glass .guide-top { color: #b9d7bd; }
.clinic-glass .guide-top>span { background: #304f37; color: #ccebc9; border: 1px solid #55765a; }
.clinic-glass :is(#guide-skip,#guide-link) { color: #c1efd0; }
.clinic-glass #guide-section { color: #abdcb3; }
.clinic-glass #guide-title { color: #eef8e9; }
.clinic-glass #guide-description { color: #c4dac3; }
.clinic-glass .guide-card progress,.clinic-glass .guide-card progress::-webkit-progress-bar { background: #405b44; }
.clinic-glass .guide-card progress::-webkit-progress-value { background: #8ce0bf; }
.clinic-glass .guide-card progress::-moz-progress-bar { background: #8ce0bf; }
.clinic-glass #clinic-guide :is(button,a):focus-visible { outline-color: #a7f0d6; }
.clinic-glass .page-header { max-width: 1160px; margin: 16px auto 0; padding: 19px 24px; border-radius: 20px; }
.clinic-glass .page-header nav a { min-height: 44px; display: inline-flex; align-items: center; }
.clinic-glass .page-main { max-width: 1160px; padding: 48px 24px 56px; }
.clinic-glass .page-intro { margin-bottom: 28px; }
.clinic-glass .guide-step { padding: 28px; }
.clinic-glass .guide-step:before { display: grid; place-items: center; width: 36px; height: 36px; background: rgba(140,224,191,.12); border: 1px solid rgba(140,224,191,.19); border-radius: 11px; color: #b8eccb; letter-spacing: 0; margin-bottom: 22px; }
.clinic-glass .guide-step h2 { font-size: 26px; font-weight: 650; }
.clinic-glass :is(.guide-step p,.guide-limitations ul,.guide-footer p) { color: #bed0bf; }
.clinic-glass .guide-limitations { background: rgba(24,49,28,.68); }
.clinic-glass .page-footer { max-width: 1160px; }

/* Keep the live work queue in the first viewport; explanatory copy stays visible. */
@media (min-width: 801px) {
  .clinic-glass main:has(> #workspace-content) { padding-top: 20px; }
  .clinic-glass #view-title { font-size: 38px; margin: 5px 0 6px; }
  .clinic-glass #page-status { margin: 10px 0 12px; }
  .clinic-glass #page-status:empty { min-height: 0; margin: 12px 0; }
  .clinic-glass #workspace-content .clinic-toolbar { margin-bottom: 14px; }
  .clinic-glass #workspace-content .readiness-panel { padding: 12px 16px; gap: 12px; margin-bottom: 15px; }
  .clinic-glass #workspace-content .readiness-panel h2 { margin-top: 0; }
  .clinic-glass #workspace-content .readiness-panel .pilot-note { margin-top: 5px; }
  .clinic-glass #workspace-content .setup-toolbar { margin: 0 0 16px; }
  .clinic-glass #workspace-content .setup-toolbar .button { min-height: 44px; }
  .clinic-glass #workspace-content .list-panel>.panel-heading { padding: 18px 22px 14px; }
  .clinic-glass #workspace-content .list-tools { padding: 0 22px 14px; }
  .clinic-glass #workspace-content .appointment-table { font-size: 13px; }
}

@media (min-width: 1600px) {
  .clinic-glass main { padding: 38px 26px; }
  .clinic-glass .work-grid { grid-template-columns: minmax(0,1fr) 310px; gap: 22px; }
  .clinic-glass .appointment { grid-template-columns: 54px 1fr auto; }
}
@media (max-width: 1180px) {
  .clinic-glass .sidebar { width: 222px; padding-inline: 14px; }
  .clinic-glass .main-wrap { margin-left: 252px; }
  .clinic-glass .work-grid { grid-template-columns: minmax(0,1fr); }
  .clinic-glass .right-column { grid-template-columns: 1fr 1fr; align-items: start; }
  .clinic-glass .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .clinic-glass .appointment { grid-template-columns: 48px 1fr auto; }
  .clinic-glass .row-actions { grid-column: auto; max-width: 190px; justify-content: flex-end; }
  .clinic-glass .intro { align-items: flex-start; flex-wrap: wrap; gap: 18px; }
  .clinic-glass .intro>.primary { font-size: 12px; margin-top: 0; }
  .clinic-glass .page-header { margin-inline: 16px; }
}
@media (max-width: 800px) {
  .clinic-glass { background-attachment: scroll; }
  .clinic-glass .sidebar { position: relative; inset: auto; width: auto; margin: 12px 12px 0; padding: 18px 16px 12px; border: 1px solid var(--glass-border); border-radius: 20px; display: block; overflow: visible; }
  .clinic-glass .sidebar .brand { font-size: 20px; width: fit-content; }
  .clinic-glass .brand-name strong { font-size: 19px; }
  .clinic-glass .brand-name small { font-size: 10px; }
  .clinic-glass :is(.workspace,.sidebar-bottom,.sidebar-note) { display: none; }
  .clinic-glass .back-link { position: absolute; top: 17px; right: 14px; margin: 0; min-height: 44px; padding: 0 5px; font-size: 11px; }
  .clinic-glass .sidebar nav { display: flex; gap: 6px; overflow-x: auto; padding: 4px 1px 5px; margin-top: 19px; scrollbar-width: thin; scrollbar-color: #56745d transparent; }
  .clinic-glass .sidebar nav button { flex: 0 0 auto; min-height: 44px; flex-direction: row; justify-content: flex-start; gap: 8px; padding: 10px 12px; white-space: nowrap; font-size: 12px; }
  .clinic-glass .sidebar nav .nav-icon { display: grid; width: 18px; height: 18px; }
  .clinic-glass .sidebar nav svg { width: 18px; height: 18px; }
  .clinic-glass .sidebar nav :is(.nav-count,b) { display: none; }
  .clinic-glass #metrics-button { grid-column: auto; padding: 10px 12px; min-height: 44px; }
  .clinic-glass .main-wrap { margin: 0; padding: 0 12px; }
  .clinic-glass .topbar { margin-top: 10px; min-height: 58px; padding: 9px 16px; border-radius: 16px; font-size: 11px; }
  .clinic-glass .topbar .avatar { display: none; }
  .clinic-glass .top-actions { gap: 12px; }
  .clinic-glass :is(.mode-pill,.demo-pill) { font-size: 9px; padding: 7px 9px; }
  .clinic-glass main { padding: 27px 4px; }
  .clinic-glass .intro h1 { font-size: 35px; }
  .clinic-glass .intro p:not(.eyebrow) { font-size: 13px; }
  .clinic-glass .readiness-panel { display: grid; grid-template-columns: 30px minmax(0,1fr); align-items: start; gap: 10px 12px; padding: 18px; }
  .clinic-glass .readiness-panel>.readiness-mark { grid-column: 1; width: 30px; height: 30px; }
  .clinic-glass .readiness-panel>div { grid-column: 2; min-width: 0; }
  .clinic-glass .readiness-panel>.quiet-link { grid-column: 2; margin: 0; justify-self: start; }
  .clinic-glass .datebar { flex-direction: column; align-items: flex-start; }
  .clinic-glass .date-controls { flex-wrap: wrap; width: 100%; gap: 6px; }
  .clinic-glass .date-controls input { width: 154px; }
  .clinic-glass .page-main { padding: 32px 18px 40px; }
  .clinic-glass .page-header { margin: 12px 12px 0; padding: 15px 17px; flex-wrap: wrap; gap: 10px; }
  .clinic-glass .page-header nav { flex-wrap: wrap; gap: 18px; font-size: 12px; }
}
@media (max-width: 560px) {
  .clinic-glass .back-link { font-size: 10px; max-width: 92px; text-align: right; line-height: 1.35; }
  .clinic-glass .back-link:after { content: none; }
  .clinic-glass .breadcrumb { display: none; }
  .clinic-glass .topbar .breadcrumb { display: inline; }
  .clinic-glass .top-actions>.mode-pill { max-width: 240px; white-space: normal; }
  .clinic-glass .top-actions { justify-content: space-between; width: 100%; }
  .clinic-glass .topbar:has(.top-actions)>.breadcrumb { display: none; }
  .clinic-glass .topbar>.top-right { gap: 4px; }
  .clinic-glass .topbar>div:first-child { font-size: 10px; }
  .clinic-glass .slash { margin-inline: 5px; }
  .clinic-glass .demo-pill { font-size: 9px; padding: 7px 8px; }
  .clinic-glass .intro { display: flex; flex-wrap: nowrap; gap: 10px; }
  .clinic-glass .intro:has(> #add) { display: block; }
  .clinic-glass .intro>.primary { margin-top: 20px; width: 100%; }
  .clinic-glass .intro>.button { margin-top: 24px; min-width: 44px; padding: 10px; }
  .clinic-glass .intro .eyebrow { font-size: 9px; }
  .clinic-glass .intro h1 { font-size: 33px; }
  .clinic-glass .demo-banner-copy { display: block; }
  .clinic-glass .demo-banner { margin: 21px 0; padding: 14px 16px; font-size: 12px; }
  .clinic-glass .guide-start { margin: 11px 8px 0 0; display: inline-flex; }
  .clinic-glass .demo-reset-link { margin: 7px 0 0; padding: 0; }
  .clinic-glass .right-column { grid-template-columns: 1fr; }
  .clinic-glass .stats { gap: 10px; margin-bottom: 20px; }
  .clinic-glass .stats article { padding: 17px 15px; border-radius: 17px; }
  .clinic-glass .stats article>span { font-size: 11px; }
  .clinic-glass .stats article>strong { font-size: 35px; margin-top: 10px; }
  .clinic-glass .stats small { font-size: 10px; }
  .clinic-glass .panel-heading { padding: 22px 18px 17px; }
  .clinic-glass .panel-heading h2 { font-size: 24px; }
  .clinic-glass .list-tools { padding: 0 18px 15px; gap: 9px; }
  .clinic-glass .list-tools label { flex-basis: 100%; width: 100%; }
  .clinic-glass .list-tools .text-button { min-height: 44px; font-size: 11px; }
  .clinic-glass .list-tools select { font-size: 16px; }
  .clinic-glass .clinic-toolbar select { font-size: 16px; }
  .clinic-glass .appointment-table tr { grid-template-columns: 49px minmax(0,1fr) 44px; gap: 0 9px; padding: 19px 17px; border-color: var(--line); }
  .clinic-glass .appointment-table td { padding: 0; border: 0; }
  .clinic-glass .appointment-table td:first-child,.clinic-glass .appointment-table td:last-child { padding: 0; }
  .clinic-glass .appointment-table td:nth-child(2) strong { overflow-wrap: anywhere; }
  .clinic-glass .appointment-table td:nth-child(3) strong { color: #b7ccbb; }
  .clinic-glass .appointment-table td small { font-size: 10px; }
  .clinic-glass .appointment { grid-template-columns: 45px minmax(0,1fr); gap: 10px; padding: 20px 18px; }
  .clinic-glass .row-actions { grid-column: 2; max-width: none; justify-content: flex-start; }
  .clinic-glass .row-actions button { font-size: 11px; padding: 10px 11px; }
  .clinic-glass .filters { width: 100%; flex-wrap: wrap; gap: 4px; }
  .clinic-glass .filters button { font-size: 11px; padding: 9px 11px; }
  .clinic-glass .search { width: 100%; max-width: 100%; }
  .clinic-glass .search input { font-size: 16px; max-width: 100%; }
  .clinic-glass .readiness-panel .pilot-note { font-size: 11px; }
  .clinic-glass .readiness-panel>.quiet-link { margin-left: 0; }
  .clinic-glass .guide-steps { grid-template-columns: 1fr; }
  .clinic-glass .guide-step { padding: 25px; }
  .clinic-glass .guide-step h2 { font-size: 25px; }
  .clinic-glass .guide-footer { flex-direction: column; align-items: stretch; }
  .clinic-glass .page-header .brand-name strong { font-size: 19px; }
  .clinic-glass .page-header nav { font-size: 11px; }
  .clinic-glass .metrics-grid { margin-inline: 18px; gap: 10px; }
  .clinic-glass .metric-card { padding: 17px 13px; }
  .clinic-glass .metric-label { font-size: 11px; }
  .clinic-glass .metric-note { font-size: 11px; }
  .clinic-glass .metric-number { font-size: 34px; }
  .clinic-glass .access-panel { padding: 27px 23px; }
  .clinic-glass .access-panel h2 { font-size: 29px; }
  .clinic-glass .large-mark { display: none; }
  .clinic-glass dialog:not(#clinic-guide) { padding: 23px; width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .clinic-glass :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { font-size: 16px; }
  .clinic-glass dialog:not(#clinic-guide) .dialog-actions { background: #1f382a; bottom: -23px; padding: 14px 0; }
  .clinic-glass .slots button { font-size: 12px; padding: 10px 2px; }
  .clinic-glass[data-view=availability] .slots { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .clinic-glass[data-view=availability] .right-column { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .clinic-glass { scroll-behavior: auto; }
  .clinic-glass *, .clinic-glass *:before, .clinic-glass *:after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
}
@media (prefers-reduced-transparency: reduce) {
  body.clinic-glass { background: #10291d; }
  .clinic-glass :is(.sidebar,.topbar,.page-header,.panel,.stats article,.readiness-panel,.calendar-note,.next-panel) { background: #243f2d; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .clinic-glass dialog::backdrop { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (forced-colors: active) {
  body.clinic-glass { background: Canvas; color: CanvasText; }
  .clinic-glass :is(.sidebar,.topbar,.page-header,.panel,.stats article,.readiness-panel,.calendar-note,.next-panel) { background: Canvas; color: CanvasText; border: 1px solid CanvasText; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .clinic-glass :is(button,a,input,select,summary):focus-visible { outline-color: Highlight; }
}