:root {
  --ink: #1d1d1f;
  --muted: #7a7a7a;
  --green: #0066cc;
  --green-dark: #1d1d1f;
  --green-soft: #f5f5f7;
  --mint: #f5f5f7;
  --cream: #f5f5f7;
  --gold: #0066cc;
  --line: #e0e0e0;
  --white: #fff;
  --danger: #a34545;
  --danger-soft: #fff0ee;
  --shadow: none;
  --radius: 18px;
  --bottom-fixed-menu-height: 82px;
  --font: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", sans-serif;
  --display-font: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", sans-serif;
  --action-blue: #0066cc;
  --focus-blue: #0071e3;
  --link-on-dark: #2997ff;
  --canvas: #fff;
  --parchment: #f5f5f7;
  --tile-dark: #272729;
  --tile-black: #000;
}

* { box-sizing: border-box; }
.has-patient-navigation [hidden] { display: none !important; }

html {
  color: var(--ink);
  background: var(--cream);
  font-family: var(--font);
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 10% 5%, rgba(202, 222, 215, .42), transparent 28rem),
    linear-gradient(180deg, #fbfaf6 0, var(--cream) 60%, #f1ede5 100%);
  color: var(--ink);
  line-height: 1.75;
}

a { color: inherit; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.site-header {
  position: sticky;
  z-index: 70;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0 auto;
  padding: 18px max(24px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid rgba(49,92,89,.13);
  background: rgba(251,250,246,.96);
  box-shadow: 0 5px 20px rgba(31,65,61,.06);
  backdrop-filter: blur(14px);
}

.brand {
  display: inline-flex;
  gap: 13px;
  align-items: center;
  color: var(--ink);
  text-decoration: none;
}

.brand__mark {
  display: flex;
  width: 55px;
  height: 44px;
  flex: none;
  align-items: center;
  justify-content: center;
}

.brand__mark img { display: block; width: 100%; height: 100%; object-fit: contain; }

.brand__text { display: grid; line-height: 1.25; }
.brand__text strong { font-size: 18px; font-weight: 700; }
.brand__text small { color: var(--green); font-family: Arial, sans-serif; font-size: 9px; font-weight: 700; }

.site-header__actions { display: flex; gap: 9px; align-items: center; }
.site-header__family-action { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid rgba(49,92,89,.22); border-radius: 999px; background: white; color: var(--green-dark); font-size: 11px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.site-header__family-action:hover { background: var(--mint); }
.site-header__family-action:focus-visible { outline: 3px solid rgba(197,156,88,.45); outline-offset: 3px; }
.family-menu { position: relative; }
.family-menu > summary { cursor: pointer; list-style: none; }
.family-menu > summary::-webkit-details-marker { display: none; }
.family-menu__panel { position: absolute; z-index: 90; top: calc(100% + 10px); right: 0; display: grid; width: min(350px, calc(100vw - 24px)); overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.99); box-shadow: 0 20px 45px rgba(31,65,61,.2); }
.family-menu__heading { display: grid; gap: 2px; padding: 14px 16px 11px; border-bottom: 1px solid var(--line); background: var(--mint); }
.family-menu__heading strong { font-size: 14px; }
.family-menu__heading small { color: var(--muted); font-size: 10px; }
.family-menu__options { display: grid; max-height: min(390px, calc(100dvh - 190px)); overflow-y: auto; }
.family-menu__options form { margin: 0; }
.family-menu__option { display: grid; width: 100%; min-height: 56px; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 9px 16px; border: 0; border-bottom: 1px solid var(--line); background: white; color: var(--ink); cursor: pointer; font: inherit; text-align: left; }
.family-menu__option:hover { background: var(--parchment); }
.family-menu__option.is-selected { background: #edf6ff; color: var(--action-blue); }
.family-menu__option > span, .family-menu__option > small { color: var(--muted); font-size: 10px; }
.family-menu__option > strong { overflow-wrap: anywhere; font-size: 13px; }
.family-menu__option.is-selected > small { color: var(--action-blue); font-weight: 700; }
.family-menu__add { display: flex; min-height: 52px; gap: 9px; align-items: center; justify-content: center; padding: 9px 16px; background: white; color: var(--action-blue); font-size: 13px; text-decoration: none; }
.family-menu__add:hover { background: var(--parchment); }
.family-menu__add > span { font-size: 19px; line-height: 1; }
.header-menu { position: relative; }
.header-menu > summary { display: inline-flex; min-height: 44px; gap: 9px; align-items: center; padding: 0 14px; border: 1px solid rgba(49,92,89,.22); border-radius: 999px; background: white; color: var(--green-dark); cursor: pointer; font-size: 11px; list-style: none; }
.header-menu > summary::-webkit-details-marker { display: none; }
.header-menu > summary > span { display: grid; width: 18px; gap: 3px; }
.header-menu > summary i { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .15s ease, opacity .15s ease; }
.header-menu[open] > summary i:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.header-menu[open] > summary i:nth-child(2) { opacity: 0; }
.header-menu[open] > summary i:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
.header-menu > summary:focus-visible { outline: 3px solid rgba(197,156,88,.45); outline-offset: 3px; }
.header-menu__panel { position: absolute; z-index: 80; top: calc(100% + 10px); right: 0; display: grid; width: min(310px, calc(100vw - 24px)); overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.99); box-shadow: 0 20px 45px rgba(31,65,61,.2); }
.header-menu__panel a, .header-menu__panel button { display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 17px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; font-size: 12px; font-weight: 700; text-align: left; text-decoration: none; }
.header-menu__panel [data-admin-app-install][hidden] { display: none; }
.header-menu__panel a:last-child, .header-menu__panel form:last-child button { border-bottom: 0; }
.header-menu__panel form { margin: 0; }
.header-menu__panel a:hover, .header-menu__panel button:hover { background: var(--mint); }
.header-menu__panel a[aria-current="page"] { background: var(--mint); color: var(--green-dark); }
.header-menu__panel strong { color: var(--green); font: 700 13px Arial, sans-serif; white-space: nowrap; }

.page-main {
  width: min(1120px, calc(100% - 48px));
  min-height: 55vh;
  margin: 10px auto 80px;
}

.has-patient-navigation { padding-bottom: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); }
.sr-only { position: absolute !important; top: 0 !important; left: 0 !important; width: 1px !important; height: 1px !important; overflow: hidden !important; margin: -1px !important; padding: 0 !important; border: 0 !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }

.eyebrow {
  margin: 0 0 8px;
  color: var(--gold);
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
}

.stepper {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: min(760px, 100%);
  margin: 54px auto 34px;
  padding: 0;
  list-style: none;
}

.stepper-row {
  display: grid;
  grid-template-columns: auto minmax(0, 760px);
  width: min(850px, 100%);
  gap: 14px;
  align-items: center;
  margin: 54px auto 34px;
}

.stepper-row .stepper { width: 100%; margin: 0; }
.stepper-back { display: inline-flex; min-height: 42px; gap: 5px; align-items: center; justify-content: center; padding: 0 13px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--action-blue); font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.stepper-back:hover { background: var(--parchment); }
.stepper-back-form { margin: 0; flex: none; }
.stepper-back-form button { font-family: inherit; cursor: pointer; }
.stepper-back > span { font-size: 22px; font-weight: 400; line-height: 1; }

.stepper li {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 7px;
  color: #9ba7a4;
  font-size: 11px;
}

.stepper li::before {
  position: absolute;
  z-index: -1;
  top: 16px;
  right: 50%;
  width: 100%;
  height: 1px;
  background: var(--line);
  content: "";
}

.stepper li:first-child::before { display: none; }
.stepper span { display: grid; width: 33px; height: 33px; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--cream); font: 700 12px Arial, sans-serif; }
.stepper .is-active, .stepper .is-done { color: var(--green); font-weight: 700; }
.stepper .is-active span { border-color: var(--green); background: var(--green); color: white; box-shadow: 0 5px 15px rgba(49,92,89,.22); }
.stepper .is-done span { border-color: #a9c2bc; background: var(--green-soft); }
.stepper .is-done::before, .stepper .is-active::before { background: #a9c2bc; }

.content-card {
  overflow: hidden;
  border: 1px solid rgba(49, 92, 89, .09);
  border-radius: var(--radius);
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow);
}

.entry-card, .form-card, .reservation-card, .manage-card { padding: clamp(30px, 5vw, 64px); }
.section-heading { margin-bottom: 34px; text-align: center; }
.section-heading h1, .section-heading h2 { margin: 3px 0 8px; font-size: clamp(25px, 4vw, 36px); line-height: 1.4; }
.section-heading > p:last-child { margin: 0; color: var(--muted); }

.entry-methods { width: min(820px, 100%); margin: 0 auto; }
.entry-method {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.entry-method--primary { border-color: #bfd2cc; background: var(--mint); }
.entry-method__number { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font: 700 12px Arial, sans-serif; }
.entry-method h3 { margin: 0 0 5px; font-size: 19px; }
.entry-method p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

.entry-divider { position: relative; margin: 15px 0; text-align: center; }
.entry-divider::before { position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: var(--line); content: ""; }
.entry-divider span { position: relative; padding: 0 16px; background: white; color: #9aa6a3; font-size: 11px; }

.oauth-login { width: min(820px, 100%); margin: 34px auto 0; padding-top: 30px; border-top: 1px solid var(--line); }
.oauth-login__heading { margin-bottom: 18px; text-align: center; }
.oauth-login__heading > span { color: #879593; font-size: 10px; }
.oauth-login__heading h3 { margin: 3px 0 6px; font-size: 20px; }
.oauth-login__heading p { max-width: 650px; margin: 0 auto; color: var(--muted); font-size: 11px; line-height: 1.7; }
.oauth-login__buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.oauth-button { display: flex; min-height: 54px; gap: 12px; align-items: center; justify-content: center; padding: 9px 18px; border: 1px solid var(--line); border-radius: 11px; background: white; font-size: 13px; font-weight: 700; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.oauth-button:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(24,48,47,.1); }
.oauth-button:focus-visible { outline: 3px solid rgba(197,156,88,.42); outline-offset: 2px; }
.oauth-button--line { border-color: #06c755; background: #06c755; color: white; }
.oauth-button.is-disabled { cursor: not-allowed; filter: grayscale(.5); opacity: .48; }
.oauth-button.is-disabled:hover { transform: none; box-shadow: none; }
.oauth-button > span:last-child { display: grid; line-height: 1.35; }
.oauth-button small { font-size: 9px; font-weight: 500; }
.oauth-provider-mark { display: grid; width: 34px; height: 34px; flex: none; place-items: center; border-radius: 50%; background: white; color: #4285f4; font: 800 17px Arial, sans-serif; box-shadow: inset 0 0 0 1px rgba(24,48,47,.12); }
.oauth-button--line .oauth-provider-mark, .oauth-connection-card--line .oauth-provider-mark { color: #06a844; font-size: 8px; }

.button {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: .2s ease;
}

.button:hover { transform: translateY(-1px); }
.button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid rgba(197, 156, 88, .55); outline-offset: 2px; }
.button--primary { background: var(--green); color: white; box-shadow: 0 8px 20px rgba(49, 92, 89, .2); }
.button--primary:hover { background: var(--green-dark); }
.button--dark { background: var(--ink); color: white; }
.button--secondary { border-color: var(--line); background: white; color: var(--green); }
.button--calendar { border-color: #8db4a8; background: #f5faf8; color: var(--green-dark); }
.button--device-calendar { border-color: #bec8c5; background: #fff; color: var(--ink); }
.calendar-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.calendar-actions--center { width: min(520px, 100%); margin: 28px auto 0; }
.calendar-actions .button { min-width: 0; padding: 0 12px; font-size: 12px; }
.calendar-description-note { margin: 24px auto -15px; color: var(--muted); font-size: 11px; text-align: center; }
.button-row--following { margin-top: 10px; }
.button--wide { width: 100%; margin-top: 12px; }
.button--small { min-height: 40px; padding: 0 16px; font-size: 12px; }
.button:disabled { cursor: not-allowed; opacity: .45; transform: none; }

.email-form { grid-column: 2 / -1; margin-top: 4px; }
.email-form > label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 700; }
.inline-field { display: flex; gap: 9px; }
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], input[type="date"], select, textarea { width: 100%; min-height: 54px; border: 1px solid #cad8d4; border-radius: 9px; background: white; padding: 0 16px; color: var(--ink); }
select { appearance: auto; }
input::placeholder { color: #aeb8b6; }

.info-note {
  width: min(820px, 100%);
  margin: 26px auto 0;
  padding: 20px 24px;
  border-left: 3px solid var(--gold);
  background: #fbf8f1;
}

.info-note strong { font-size: 14px; }
.info-note p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.method-unavailable { max-width: 230px; color: var(--danger) !important; }

.emergency-note {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0 30px;
  align-items: center;
  margin: 28px 0 0;
  padding: 28px 36px;
  border-radius: 18px;
  border: 1px solid #dec998;
  background: #f7f1e5;
}

.emergency-note strong { color: var(--green-dark); font-size: 15px; }
.emergency-note p { max-width: 760px; margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.emergency-note a { grid-column: 2; grid-row: 1 / 3; color: var(--green); font: 700 24px Arial, sans-serif; text-decoration: none; }

.sent-state, .error-state, .complete-card { text-align: center; }
.sent-state { max-width: 620px; margin: 0 auto; padding: 25px 0; }
.sent-state__icon, .complete-icon { display: grid; width: 72px; height: 72px; margin: 0 auto 24px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 31px; }
.sent-state h2, .complete-card h1, .error-state h1 { margin: 4px 0 12px; font-size: clamp(26px, 4vw, 38px); }
.sent-state > p:not(.eyebrow), .complete-card > p:not(.eyebrow), .error-state > p:not(.eyebrow) { color: var(--muted); }
.button-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 30px; }

.compact-card { width: min(720px, 100%); margin: 80px auto; padding: clamp(38px, 7vw, 72px); }
.error-state__icon { display: grid; width: 64px; height: 64px; margin: 0 auto 22px; place-items: center; border-radius: 50%; background: var(--danger-soft); color: var(--danger); font-size: 26px; font-weight: 700; }
.error-state .button { margin-top: 22px; }

.form-card { width: min(760px, 100%); margin: 0 auto; }
.verified-email { display: grid; grid-template-columns: 1fr auto; margin: 0 0 30px; padding: 18px 22px; border-radius: 12px; background: var(--mint); }
.verified-email span { grid-column: 1; color: var(--muted); font-size: 11px; }
.verified-email strong { grid-column: 1; word-break: break-all; }
.verified-email a { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--green); font-size: 12px; }
.verified-email > form { grid-column: 2; grid-row: 1 / 3; align-self: center; margin: 0; }
.verified-email > form button { min-height: 44px; }

.stack-form { display: grid; gap: 24px; }
.register-split-name { min-width: 0; margin: 0; padding: 0; border: 0; }
.register-split-name > legend { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; padding: 0; font-weight: 700; }
.register-split-name > legend > span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: var(--green); color: white; font: 700 11px Arial, sans-serif; }
.register-split-name__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.register-split-name__fields .field label { margin-bottom: 6px; color: var(--muted); font-size: 11px; }
.field label { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; font-weight: 700; }
.field label > span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: var(--green); color: white; font: 700 11px Arial, sans-serif; }
.optional-label { margin-left: auto; padding: 2px 7px; border-radius: 20px; background: #eef1ef; color: var(--muted); font-size: 9px; font-style: normal; font-weight: 500; }
.field small { display: block; margin-top: 7px; color: var(--muted); font-size: 11px; }

.alert, .flash { padding: 15px 18px; border-radius: 10px; font-size: 13px; }
.alert { margin: 0 0 24px; }
.alert--error, .flash--error { border: 1px solid #ecc6c1; background: var(--danger-soft); color: #7f3333; }
.alert--success { border: 1px solid #bdd6cf; background: var(--mint); color: var(--green-dark); }
.flash { width: min(920px, 100%); margin: 0 auto 24px; transition: opacity .25s ease; }
.flash--success { border: 1px solid #bdd6cf; background: var(--mint); color: var(--green-dark); }
.flash.is-dismissing { opacity: 0; pointer-events: none; }
.app-link-guide { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 22px; margin: 0 0 24px; padding: 20px 22px; border: 1px solid #b9d6ce; border-radius: 14px; background: var(--mint); }
.app-link-guide h2 { margin: 2px 0 5px; font-size: 20px; }
.app-link-guide p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.app-link-guide__help { grid-column: 1 / -1; padding-top: 10px; border-top: 1px solid rgba(49,92,89,.16); }
@media (max-width: 680px) { .app-link-guide { grid-template-columns: 1fr; } .app-link-guide .button { width: 100%; } }

.reservation-heading { display: flex; justify-content: space-between; gap: 30px; align-items: flex-start; margin-bottom: 35px; }
.reservation-heading h1 { margin: 3px 0 6px; font-size: clamp(27px, 4vw, 39px); line-height: 1.35; }
.reservation-heading p { margin: 0; color: var(--muted); }
.reservation-heading__links { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: flex-end; }
.reservation-current-patient { display: flex; flex-wrap: wrap; gap: 7px 9px; align-items: center; }
.reservation-current-patient .patient-number { margin-left: 0; }
.patient-number { display: inline-block; margin-left: 8px; padding: 2px 9px; border-radius: 20px; background: var(--green-soft); color: var(--green); font-size: 11px; }
.patient-number--card { font-weight: 700; text-decoration: none; }
.patient-number--card:hover { background: #dbe9e5; color: var(--green-dark); }
.patient-number--card:focus-visible { outline: 3px solid rgba(197,156,88,.4); outline-offset: 2px; }
.text-link { color: var(--green); font-size: 12px; font-weight: 700; }
.reservation-heading__action { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 13px; border: 1px solid #b9cfca; border-radius: 9px; background: white; color: var(--green); font-size: 11px; font-weight: 700; text-align: center; text-decoration: none; white-space: nowrap; }
.reservation-heading__action:hover { border-color: var(--green); background: var(--mint); }
.reservation-heading__action:focus-visible { outline: 3px solid rgba(197,156,88,.4); outline-offset: 2px; }

.booking-request-notice { margin: 0 0 30px; overflow: hidden; border: 1px solid #ddc79e; border-radius: 16px; background: #fffdf8; }
.booking-request-notice__heading { display: flex; gap: 10px; align-items: center; padding: 14px 18px; background: #f8f0df; }
.booking-request-notice__heading > span { display: grid; width: 25px; height: 25px; flex: none; place-items: center; border-radius: 50%; background: var(--gold); color: white; font: 700 13px Arial, sans-serif; }
.booking-request-notice__heading h2 { margin: 0; font-size: 17px; }
.booking-request-notice__body { display: grid; gap: 7px; padding: 16px 19px 14px; color: #4b5e5c; font-size: 12px; }
.booking-request-notice__body p { margin: 0; }
.booking-request-notice__body strong { color: var(--ink); }
.booking-request-notice__arrival { margin: 0; padding: 12px 19px; border-top: 1px solid #eadfc9; background: white; color: var(--green-dark); font-size: 14px; text-align: center; }
.appointment-belongings { margin: 0 0 30px; overflow: hidden; border: 2px solid #8aa7ce; border-radius: 16px; background: #fbfdff; text-align: left; }
.appointment-belongings__heading { display: flex; gap: 10px; align-items: center; padding: 14px 18px; background: #eef5fd; color: #2f629f; }
.appointment-belongings__heading > span { display: grid; width: 25px; height: 25px; flex: none; place-items: center; border: 2px solid #2f629f; border-radius: 5px; color: #e9a51b; font: 900 18px Arial, sans-serif; }
.appointment-belongings__heading h2 { margin: 0; font-size: 17px; }
.appointment-belongings ul { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; margin: 0; padding: 16px 18px 12px; list-style: none; }
.appointment-belongings li { display: flex; min-height: 48px; gap: 9px; align-items: center; padding: 10px 12px; border: 1px solid #c5d5ea; border-radius: 10px; background: white; color: #2f629f; }
.appointment-belongings li:last-child { grid-column: 1 / -1; }
.appointment-belongings li > span { color: #e9a51b; font-size: 18px; font-weight: 900; }
.appointment-belongings li strong { font-size: 12px; line-height: 1.45; }
.appointment-belongings > p { margin: 0; padding: 0 18px 15px; color: #4b5e5c; font-size: 10px; line-height: 1.65; }

.family-switcher { margin: 0 0 30px; padding: 18px; border: 1px solid #bfd2cc; border-radius: 16px; background: var(--mint); }
.family-switcher__heading { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 12px; }
.family-switcher__heading > div { display: grid; }
.family-switcher__heading small { color: var(--muted); font-size: 10px; }
.family-switcher__heading a { color: var(--green); font-size: 11px; font-weight: 700; }
.family-switcher__options { display: flex; gap: 9px; overflow-x: auto; padding: 2px 2px 8px; scroll-snap-type: x proximity; }
.family-switcher__options form { flex: none; margin: 0; }
.family-switch-option { display: grid; min-width: 170px; min-height: 92px; align-content: center; gap: 1px; padding: 12px 15px; border: 1px solid #cad8d4; border-radius: 12px; background: white; color: var(--ink); cursor: pointer; font: inherit; text-align: left; text-decoration: none; scroll-snap-align: start; }
.family-switch-option span { color: var(--muted); font-size: 9px; }
.family-switch-option strong { font-size: 14px; }
.family-switch-option small { color: var(--muted); font-size: 10px; }
.family-switch-option.is-selected { border-color: var(--green); background: var(--green); color: white; box-shadow: 0 5px 16px rgba(49,92,89,.18); }
.family-switch-option.is-selected span, .family-switch-option.is-selected small { color: rgba(255,255,255,.76); }
.family-switch-option--add { border-style: dashed; color: var(--green); }
.family-switch-dialog { width: min(760px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 28px; overflow-y: auto; border: 1px solid var(--line); border-radius: 18px; background: white; color: var(--ink); box-shadow: 0 24px 70px rgba(24,48,47,.24); }
.family-switch-dialog::backdrop { background: rgba(23,43,41,.58); backdrop-filter: blur(3px); }
.family-switch-dialog[open] { animation: admin-dialog-in .16s ease-out; }
.family-switch-dialog__heading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
.family-switch-dialog__heading h2 { margin: 2px 0 0; font-size: 23px; }
.family-switch-dialog__heading form { margin: 0; }
.family-switch-dialog__close { min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--green); font: inherit; font-size: 12px; cursor: pointer; }
.family-switch-dialog__close:hover { background: var(--green-soft); }
.family-switch-dialog__close:focus-visible { outline: 3px solid rgba(49,92,89,.24); outline-offset: 2px; }
.family-switch-dialog__intro { margin: 8px 0 18px; color: var(--muted); font-size: 11px; }
.family-switcher--dialog { margin: 0; }

.family-card, .account-card { width: min(1000px, 100%); margin: 35px auto; padding: clamp(30px, 5vw, 54px); }
.family-intro { margin: -12px 0 30px; padding: 16px 18px; border-left: 3px solid var(--gold); background: #fbf8f1; color: var(--muted); font-size: 12px; }
.account-section { padding: 27px 0; border-top: 1px solid var(--line); }
.account-section:first-of-type { border-top: 0; }
.account-section__intro { margin: -7px 0 18px; color: var(--muted); font-size: 12px; }
.patient-push-settings { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.patient-push-settings > div { min-width: 0; }
.patient-push-settings .subsection-heading { margin-bottom: 5px; }
.patient-push-settings p { margin: 0; color: var(--muted); font-size: 12px; }
.patient-push-settings__actions { display: flex; min-width: 0; flex: none; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.patient-push-settings__actions .button { min-height: 40px; padding: 0 14px; font-size: 12px; white-space: nowrap; }
.account-email { display: grid; grid-template-columns: minmax(230px, .8fr) minmax(0, 1.2fr); gap: 24px; align-items: center; padding: 19px 22px; border-radius: 13px; background: var(--mint); }
.account-email > div { display: grid; min-width: 0; }
.account-email span { color: var(--muted); font-size: 10px; }
.account-email strong { overflow-wrap: anywhere; font-size: 15px; }
.account-email p { margin: 0; color: var(--muted); font-size: 11px; }
.account-email__change { display: grid; gap: 10px; }
.account-email__change form { display: grid; gap: 5px; margin: 0; }
.account-email__change label { font-size: 10px; font-weight: 700; }
.account-email__change .inline-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.account-email__change input { min-height: 42px; }
.account-email__change .button { min-height: 42px; white-space: nowrap; }
.email-change-summary { display: grid; gap: 1px; width: min(520px, 100%); margin: 20px auto; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--line); text-align: left; }
.email-change-summary > div { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 12px; padding: 13px 16px; background: #f8faf9; }
.email-change-summary dt { color: var(--muted); font-size: 10px; }
.email-change-summary dd { margin: 0; overflow-wrap: anywhere; font-size: 12px; }
.oauth-connection-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.oauth-connection-card { position: relative; display: grid; min-width: 0; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.oauth-provider-heading { display: flex; gap: 11px; align-items: center; padding-right: 68px; }
.oauth-provider-heading > div { display: grid; line-height: 1.35; }
.oauth-provider-heading strong { font-size: 15px; }
.oauth-provider-heading small { color: var(--muted); font-size: 9px; }
.oauth-connection-card > p { margin: 0; overflow-wrap: anywhere; color: var(--muted); font-size: 11px; }
.oauth-connection-card > form { margin: 0; }
.oauth-connection-card .button { justify-self: start; }
.button.is-disabled { cursor: not-allowed; opacity: .48; }
.oauth-status { position: absolute; top: 18px; right: 18px; padding: 4px 8px; border-radius: 12px; background: #f1f3f2; color: var(--muted); font-size: 9px; font-weight: 700; }
.oauth-status--connected { background: var(--green-soft); color: var(--green); }
.oauth-status--pending { background: #f4f2ec; color: #847761; }
.account-primary-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1.15fr)) minmax(150px, .75fr) minmax(180px, .9fr) auto; gap: 14px; align-items: end; }
.account-primary-form .field label { display: block; margin-bottom: 5px; font-size: 11px; }
.account-split-name { min-width: 0; margin: 0; padding: 0; border: 0; }
.account-split-name legend { margin-bottom: 5px; padding: 0; font-size: 11px; font-weight: 700; }
.account-split-name__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.account-split-name__fields .field label { margin-bottom: 3px; color: var(--muted); font-size: 9px; }
.confirmed-label { display: inline-block; margin-left: 4px; padding: 2px 6px; border-radius: 10px; background: var(--green-soft); color: var(--green); font-size: 8px; font-style: normal; font-weight: 700; vertical-align: middle; }
.patient-number-sync-status { display: inline-block; margin-left: 4px; padding: 2px 6px; border-radius: 10px; background: #fff4d6; color: #795600; font-size: 8px; font-style: normal; font-weight: 700; vertical-align: middle; }
.patient-number-sync-status--verified { background: var(--green-soft); color: var(--green); }
.patient-number-sync-status--review { background: #fde8e8; color: #9b1c1c; }
.patient-number-sync-status--legacy_pending { background: #eef2f7; color: #52606d; }
.account-primary-form input[readonly], .family-profile__edit input[readonly] { cursor: not-allowed; background: #f1f5f3; color: var(--green); font-weight: 700; }
.account-empty-state { margin-bottom: 0; }
.account-family-add-action { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; }
.account-family-add-action .button { min-height: 46px; }
.account-family-add-action small { color: var(--muted); font-size: 11px; }
.family-profile-list { display: grid; gap: 12px; }
.family-profile { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.family-profile.is-selected { border-color: var(--green); box-shadow: inset 4px 0 var(--green); }
.family-profile.is-inactive { background: #f5f5f2; opacity: .78; }
.family-profile__summary { display: grid; }
.family-profile__summary strong { font-size: 17px; }
.family-profile__summary small { color: var(--muted); font-size: 11px; }
.family-profile__type { color: var(--green); font-size: 9px; font-weight: 700; }
.family-profile__selected { padding: 6px 11px; border-radius: 20px; background: var(--green-soft); color: var(--green); font-size: 10px; font-weight: 700; }
.family-profile__edit { display: grid; grid-template-columns: repeat(2, minmax(210px, 1fr)); gap: 12px; align-items: end; }
.family-profile__edit .field label { display: block; margin-bottom: 4px; font-size: 10px; }
.family-profile__edit input { min-height: 44px; }
.family-profile__save { min-height: 44px; grid-column: 2; justify-self: end; padding: 0; border: 0; background: none; cursor: pointer; white-space: nowrap; }
.family-profile__actions { display: grid; gap: 7px; justify-items: center; }
.family-profile__actions form { margin: 0; }
.family-add { margin-top: 34px; padding-top: 6px; border-top: 1px solid var(--line); }
.family-add__form { display: grid; grid-template-columns: repeat(2, minmax(210px, 1fr)); gap: 14px; align-items: end; }
.family-add__form .field label { display: block; margin-bottom: 5px; font-size: 11px; }
.family-add__form > .button { grid-column: 1 / -1; justify-self: end; }
.family-add-card { width: min(760px, 100%); margin: 35px auto; padding: clamp(30px, 5vw, 54px); }
.family-add-back { display: inline-flex; min-height: 44px; align-items: center; margin-bottom: 20px; font-size: 13px; font-weight: 600; text-decoration: none; }
.family-add-heading { margin-bottom: 24px; }
.family-add-card .family-intro { margin: 0 0 24px; }
.family-add-card .family-intro strong { display: block; margin-bottom: 4px; color: var(--ink); font-size: 14px; }
.family-add-card .family-intro p { margin: 0; }
.family-add__form--page { padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--canvas); }
.family-add__form--page input { min-height: 48px; }
.family-add__actions { display: flex; grid-column: 1 / -1; justify-content: flex-end; gap: 10px; padding-top: 8px; }
.family-add__actions .button { min-height: 48px; }
.reservation-patient-name { margin-bottom: 5px; color: var(--green) !important; font-size: 11px !important; font-weight: 700; }

.electronic-card-page { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100dvh; overflow: hidden; }
.electronic-card-page.has-patient-navigation { padding-bottom: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); }
.electronic-card-page .page-main { display: grid; grid-template-rows: minmax(0, 1fr); width: min(1120px, calc(100% - 24px)); height: 100%; min-height: 0; margin: 0 auto; }
.electronic-card-page .page-main > .flash { position: fixed; z-index: 65; top: 76px; right: 12px; left: 12px; }
.electronic-card-page .site-footer { display: none; }
.electronic-card-shell { display: grid; width: 100%; height: 100%; min-height: 0; margin: 0 auto; padding: 18px 12px; overflow: hidden; }
.electronic-card-layout { display: grid; min-height: 0; place-items: center; overflow: hidden; container-type: size; }
.electronic-card { --card-unit: min(7.6px, 1cqw, calc(1cqh * 86 / 54)); display: grid; width: calc(var(--card-unit) * 100); aspect-ratio: 86 / 54; grid-template-rows: minmax(0, 23fr) minmax(0, 43fr) minmax(0, 34fr); gap: clamp(5px, calc(var(--card-unit) * 1.2), 10px); padding: clamp(10px, calc(var(--card-unit) * 2.1), 18px); overflow: hidden; border: 1px solid #54201f; border-radius: clamp(16px, calc(var(--card-unit) * 3.8), 30px); background: linear-gradient(145deg, #6f2a28 0%, #5d211f 100%); box-shadow: 0 15px 34px rgba(57,25,24,.22); color: #211b19; }
.electronic-card__top { display: grid; min-width: 0; grid-template-columns: minmax(0, 46%) minmax(0, 1fr); gap: clamp(5px, calc(var(--card-unit) * 1.2), 10px); }
.electronic-card__number { display: flex; min-width: 0; align-items: center; gap: clamp(7px, calc(var(--card-unit) * 1.8), 16px); padding: 0 clamp(10px, calc(var(--card-unit) * 2.3), 22px); border-radius: clamp(7px, calc(var(--card-unit) * 1.5), 12px); background: #f8f7ee; }
.electronic-card__number span { flex: none; font: 500 clamp(15px, calc(var(--card-unit) * 3), 29px) / 1 Arial, sans-serif; letter-spacing: .08em; }
.electronic-card__number strong { min-width: 0; overflow: hidden; font: 500 clamp(15px, calc(var(--card-unit) * 3.7), 35px) / 1 Arial, sans-serif; letter-spacing: .03em; text-overflow: ellipsis; white-space: nowrap; }
.electronic-card__next { display: grid; min-width: 0; align-content: center; gap: clamp(1px, calc(var(--card-unit) * .35), 3px); padding: 0 clamp(8px, calc(var(--card-unit) * 1.7), 16px); border-radius: clamp(7px, calc(var(--card-unit) * 1.5), 12px); background: #f8f7ee; text-align: center; }
.electronic-card__next span { font-size: clamp(9px, calc(var(--card-unit) * 1.7), 16px); letter-spacing: .06em; line-height: 1; white-space: nowrap; }
.electronic-card__next strong { min-width: 0; overflow: hidden; font-size: clamp(10px, calc(var(--card-unit) * 2.15), 21px); font-weight: 600; line-height: 1.12; text-overflow: ellipsis; white-space: nowrap; }
.electronic-card__patient { display: grid; align-content: center; padding: clamp(8px, calc(var(--card-unit) * 1.7), 15px) clamp(13px, calc(var(--card-unit) * 2.7), 26px); border-radius: clamp(7px, calc(var(--card-unit) * 1.5), 12px); background: #f8f7ee; }
.electronic-card__name { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(8px, calc(var(--card-unit) * 2.2), 22px); align-items: end; padding: 0 clamp(5px, calc(var(--card-unit) * 1), 10px) clamp(5px, calc(var(--card-unit) * 1), 10px); border-bottom: 1px solid #383230; }
.electronic-card__name span { font-size: clamp(13px, calc(var(--card-unit) * 2.7), 26px); white-space: nowrap; }
.electronic-card__name strong { min-width: 0; overflow: hidden; font-size: clamp(18px, calc(var(--card-unit) * 4), 39px); font-weight: 500; letter-spacing: .05em; line-height: 1.12; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.electronic-card__name em { font-size: clamp(15px, calc(var(--card-unit) * 3), 29px); font-style: normal; white-space: nowrap; }
.electronic-card__birth { display: grid; grid-template-columns: auto 1fr; gap: clamp(14px, calc(var(--card-unit) * 3.4), 32px); align-items: center; padding: clamp(5px, calc(var(--card-unit) * 1), 10px) clamp(5px, calc(var(--card-unit) * 1), 10px) 0; }
.electronic-card__birth span { font-size: clamp(12px, calc(var(--card-unit) * 2.5), 24px); letter-spacing: .08em; white-space: nowrap; }
.electronic-card__birth strong { font-size: clamp(14px, calc(var(--card-unit) * 2.9), 28px); font-weight: 500; letter-spacing: .07em; text-align: center; }
.electronic-card__clinic { display: grid; min-width: 0; grid-template-columns: clamp(52px, calc(var(--card-unit) * 12), 112px) minmax(0, 1fr); gap: clamp(8px, calc(var(--card-unit) * 2), 20px); align-items: center; color: #dfbd6c; }
.electronic-card__clinic img { display: block; width: 100%; height: auto; filter: brightness(0) saturate(100%) invert(78%) sepia(45%) saturate(633%) hue-rotate(358deg) brightness(92%) contrast(88%); }
.electronic-card__clinic div { display: grid; min-width: 0; gap: clamp(1px, calc(var(--card-unit) * .6), 5px); }
.electronic-card__clinic strong { overflow: hidden; font-size: clamp(21px, calc(var(--card-unit) * 5.2), 50px); font-weight: 800; letter-spacing: .02em; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.electronic-card__clinic span { font: 700 clamp(13px, calc(var(--card-unit) * 2.8), 27px) / 1.1 Arial, sans-serif; letter-spacing: .06em; white-space: nowrap; }
.electronic-card__number--long { flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; padding-inline: 8px; }
.electronic-card__number--long span { font-size: clamp(9px, calc(var(--card-unit) * 1.4), 13px); }
.electronic-card__number--long strong { width: 100%; overflow: visible; overflow-wrap: anywhere; font-size: clamp(9px, calc(var(--card-unit) * 1.65), 13px); line-height: 1.1; letter-spacing: 0; white-space: normal; }

.calendar-label { display: flex; gap: 13px; align-items: center; margin: 28px 0 14px; }
.calendar-label > span { display: grid; width: 32px; height: 32px; flex: none; place-items: center; border-radius: 50%; background: var(--green); color: white; font: 700 12px Arial, sans-serif; }
.calendar-label > div { display: grid; }
.calendar-label small { color: var(--muted); font-size: 10px; }

.date-strip { display: flex; gap: 8px; overflow-x: auto; padding: 4px 3px 15px; scroll-snap-type: x proximity; scrollbar-color: #a9bcb7 transparent; }
.date-chip { display: grid; min-width: 72px; min-height: 84px; place-items: center; align-content: center; border: 1px solid var(--line); border-radius: 12px; background: white; color: var(--ink); text-decoration: none; scroll-snap-align: center; line-height: 1.35; }
.date-chip small { color: var(--muted); font-size: 10px; }
.date-chip strong { font: 700 16px Arial, sans-serif; }
.date-chip em { color: var(--green); font-size: 9px; font-style: normal; }
.date-chip.is-selected { border-color: var(--green); background: var(--green); color: white; box-shadow: 0 6px 17px rgba(49,92,89,.2); }
.date-chip.is-selected small, .date-chip.is-selected em { color: rgba(255,255,255,.72); }
.date-chip.is-closed { background: #f2f2ef; color: #a1aaa8; }
.date-chip.is-closed em { color: #a1aaa8; }
.date-strip--compact { margin-bottom: 22px; }

.week-overview { margin: 16px 0 30px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #f8faf9; }
.week-overview__heading { display: flex; align-items: baseline; justify-content: space-between; padding: 12px 16px; background: var(--green); color: white; }
.week-overview__heading small { color: rgba(255,255,255,.72); font-size: 10px; }
.week-overview__grid { display: grid; grid-template-columns: repeat(7, minmax(88px, 1fr)); overflow-x: auto; }
.week-day { display: grid; min-height: 92px; place-items: center; align-content: center; padding: 8px; border-right: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.week-day:last-child { border-right: 0; }
.week-day span { color: var(--muted); font-size: 10px; }
.week-day strong { font: 700 14px Arial, sans-serif; }
.week-day em { color: var(--green); font-size: 10px; font-style: normal; font-weight: 700; white-space: nowrap; }
.week-day.is-selected { background: var(--green-soft); box-shadow: inset 0 -3px var(--green); }
.week-day.is-full { background: #f1f2f0; color: #9ba5a2; pointer-events: none; }
.week-day.is-full em { color: #9ba5a2; }

.weekly-booking { margin-top: 28px; }
.weekly-booking__heading { display: grid; grid-template-columns: 96px minmax(0, 1fr) 96px; gap: 16px; align-items: center; margin-bottom: 14px; text-align: center; }
.weekly-booking__heading > a { display: grid; min-height: 46px; place-items: center; padding: 0 8px; border: 1px solid var(--line); border-radius: 9px; color: var(--green); font-size: 12px; font-weight: 700; text-decoration: none; }
.weekly-booking__heading > a:hover { border-color: var(--green); background: var(--mint); }
.weekly-booking__heading > a:focus-visible { outline: 3px solid rgba(197,156,88,.4); outline-offset: 2px; }
.weekly-booking__heading .eyebrow { margin-bottom: 2px; }
.weekly-booking__heading h2 { margin: 0; font-size: 20px; }
.weekly-booking__heading small { color: var(--muted); font-size: 10px; }
.weekly-slot-grid { display: grid; grid-template-columns: 58px repeat(7, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--line); }
.weekly-slot-grid__corner,
.weekly-slot-grid__date,
.weekly-slot-grid__time,
.weekly-slot-cell { display: grid; min-width: 0; min-height: 60px; place-items: center; align-content: center; background: white; text-align: center; }
.weekly-slot-grid__corner { background: var(--green); color: white; font-size: 10px; font-weight: 700; }
.weekly-slot-grid__date { gap: 1px; padding: 7px 3px; background: #f8faf9; line-height: 1.25; }
.weekly-slot-grid__date span { color: #526966; font-size: 10px; font-weight: 700; }
.weekly-slot-grid__date strong { color: var(--ink); font: 800 15px Arial, sans-serif; white-space: nowrap; }
.weekly-slot-grid__date small { color: var(--green); font-size: 10px; font-weight: 800; }
.weekly-slot-grid__date.is-today { background: var(--green-soft); box-shadow: inset 0 3px var(--green); }
.weekly-slot-grid__date.is-closed { background: #f1f2f0; color: #9ba5a2; }
.weekly-slot-grid__date.is-closed small { color: #9ba5a2; }
.weekly-slot-grid__time { background: #f8faf9; color: var(--ink); font: 800 12px Arial, sans-serif; }
.weekly-slot-cell { position: relative; min-height: 54px; line-height: 1.2; }
.weekly-slot-cell b { color: var(--green); font: 700 20px Arial, sans-serif; }
.weekly-slot-cell small { color: var(--green); font-size: 9px; font-weight: 700; white-space: nowrap; }
.weekly-slot-cell.is-available { cursor: pointer; }
.weekly-slot-cell.is-available:hover { background: var(--mint); }
.weekly-slot-cell input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.weekly-slot-cell > span { display: grid; width: 100%; height: 100%; min-height: 54px; place-items: center; align-content: center; }
.weekly-slot-cell input:checked + span { background: var(--green); color: white; box-shadow: inset 0 0 0 2px var(--green-dark); }
.weekly-slot-cell input:checked + span b,
.weekly-slot-cell input:checked + span small { color: white; }
.weekly-slot-cell input:focus-visible + span { outline: 3px solid rgba(197,156,88,.55); outline-offset: -3px; }
.weekly-slot-cell.is-full { background: #f5f5f2; color: #b2bab8; }
.weekly-slot-cell.is-full b,
.weekly-slot-cell.is-full small { color: #b2bab8; }

.slot-legend { display: flex; gap: 18px; justify-content: flex-end; margin: -4px 0 12px; color: var(--muted); font-size: 11px; }
.slot-legend b { margin-right: 4px; color: var(--green); }
.slot-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.slot-option { position: relative; cursor: pointer; }
.slot-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.slot-option > span { display: grid; min-height: 68px; place-items: center; align-content: center; gap: 2px; padding: 7px 10px; border: 1px solid #c8d8d3; border-radius: 10px; background: white; text-align: center; transition: .15s ease; }
.slot-option strong { font: 700 16px Arial, sans-serif; }
.slot-option em { color: var(--green); font-size: 10px; font-style: normal; font-weight: 700; }
.slot-option:hover > span { border-color: var(--green); background: var(--mint); }
.slot-option input:checked + span { border-color: var(--green); background: var(--green); color: white; box-shadow: 0 6px 18px rgba(49,92,89,.18); }
.slot-option input:checked + span em { color: white; }
.slot-option input:focus-visible + span { outline: 3px solid rgba(197,156,88,.4); outline-offset: 2px; }
.slot-option.is-full { cursor: not-allowed; }
.slot-option.is-full > span { border-color: #e4e6e3; background: #f5f5f2; color: #aeb5b3; }
.slot-option.is-full em { color: #b8bfbd; }
.slot-rule-note { margin: 14px 0 0; padding: 13px 15px; border-left: 3px solid var(--gold); background: #fbf8f1; color: var(--muted); font-size: 11px; }

.reservation-selection-page { padding-bottom: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); }
.reservation-selection-page .reservation-card { overflow: visible; }
.reservation-selection-page .weekly-slot-grid { overflow: clip; --today-column-line: #a9cdef; }
.reservation-selection-page .weekly-slot-grid__corner,
.reservation-selection-page .weekly-slot-grid__date {
  position: sticky;
  z-index: 20;
  top: var(--booking-header-offset, 0px);
}
.reservation-selection-page .weekly-slot-grid__date.is-today { box-shadow: none; }
.reservation-selection-page .weekly-slot-grid__date.is-today::after,
.reservation-selection-page .weekly-slot-cell.is-today::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: -1px 0;
  border-inline: 2px solid var(--today-column-line);
  pointer-events: none;
}
.reservation-selection-page .weekly-slot-grid__date.is-today::after {
  top: 0;
  border-top: 2px solid var(--today-column-line);
}
.reservation-selection-page .weekly-slot-cell.is-today:nth-last-child(-n + 8)::after {
  bottom: 0;
  border-bottom: 2px solid var(--today-column-line);
}
.sticky-submit { position: fixed; z-index: 50; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; width: 100%; height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); min-height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); margin: 0; padding: 13px max(24px, calc((100vw - 1120px) / 2)) calc(13px + env(safe-area-inset-bottom)); border: 0; border-top: 1px solid rgba(49,92,89,.18); border-radius: 0; background: rgba(255,255,255,.96); box-shadow: 0 -10px 30px rgba(31,65,61,.14); backdrop-filter: blur(14px); }
.sticky-submit > div { display: grid; }
.sticky-submit small { color: var(--muted); font-size: 10px; }
.sticky-submit strong { font-size: 14px; }

.reservation-summary { margin: 30px 0; border-top: 1px solid var(--line); }
.reservation-summary div { display: grid; grid-template-columns: 150px 1fr; gap: 20px; padding: 15px 5px; border-bottom: 1px solid var(--line); text-align: left; }
.reservation-summary dt { color: var(--muted); font-size: 12px; }
.reservation-summary dd { margin: 0; font-weight: 700; }
.reservation-summary--confirm dd { color: var(--green-dark); }
.confirm-card { margin-top: 0; }
.confirm-page--fixed-actions { padding-bottom: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); }
.confirm-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 28px; }
.confirm-actions form { margin: 0; }
.confirm-actions--fixed { position: fixed; z-index: 50; right: 0; bottom: 0; left: 0; display: flex; flex-wrap: nowrap; justify-content: flex-end; width: 100%; height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); min-height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); margin: 0; padding: 13px max(24px, calc((100vw - 1120px) / 2)) calc(13px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(49,92,89,.18); background: rgba(255,255,255,.96); box-shadow: 0 -10px 30px rgba(31,65,61,.14); backdrop-filter: blur(14px); }
.confirm-actions--fixed .button { min-width: 210px; }
.privacy-note { color: var(--muted); font-size: 11px; text-align: center; }

.registration-family-note { margin: -8px 0 24px; padding: 15px 17px; border-left: 4px solid var(--gold); border-radius: 3px 12px 12px 3px; background: #fbf8f1; }
.registration-family-note strong { display: block; color: var(--green-dark); font-size: 13px; }
.registration-family-note p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }

.reservation-change-current { margin: 10px 0 0; color: var(--green-dark); font-size: 12px; font-weight: 700; }
.reservation-limit-card { max-width: 820px; }
.reservation-limit-list { display: grid; gap: 14px; }
.reservation-limit-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--mint); }
.reservation-limit-item > div:first-child { display: grid; gap: 3px; }
.reservation-limit-item small, .reservation-limit-item span { color: var(--muted); font-size: 11px; }
.reservation-limit-item strong { color: var(--green-dark); font-size: 20px; }
.reservation-limit-item__actions { display: flex; gap: 8px; align-items: center; }
.reservation-limit-item__actions form { margin: 0; }
.reservation-limit-footer { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 24px; }
.compact-admin-form--limit { grid-template-columns: minmax(220px, 1fr) auto; }

.complete-card > h1 { margin-top: 0; }
.patient-fixed-menu { position: fixed; z-index: 60; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 150px)); justify-content: center; width: 100%; height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); min-height: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); padding: 8px max(12px, calc((100vw - 1120px) / 2)) calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(49,92,89,.18); background: rgba(255,255,255,.97); box-shadow: 0 -10px 30px rgba(31,65,61,.14); backdrop-filter: blur(14px); }
.patient-fixed-menu--three { grid-template-columns: repeat(3, minmax(0, 300px)); }
.patient-fixed-menu__item { display: grid; min-width: 0; place-items: center; align-content: center; gap: 3px; padding: 6px 8px; border-right: 1px solid var(--line); color: var(--green-dark); text-align: center; text-decoration: none; }
.patient-fixed-menu__item:first-child { border-left: 1px solid var(--line); }
.patient-fixed-menu__item span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green-dark); font: 800 12px Arial, sans-serif; }
.patient-fixed-menu__item strong { font-size: 10px; line-height: 1.2; }
.patient-fixed-menu__item:hover { background: var(--mint); }
.patient-fixed-menu__item:focus-visible { position: relative; z-index: 1; outline: 3px solid rgba(197,156,88,.45); outline-offset: -3px; }
.patient-fixed-menu__item--primary { background: var(--green-dark); color: white; }
.patient-fixed-menu__item--primary span { background: white; color: var(--green-dark); }
.patient-fixed-menu__item--primary:hover { background: var(--green); }

.reservation-list { display: grid; gap: 14px; }
.reservation-item { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: white; }
.reservation-item.is-editing { border-color: var(--green); box-shadow: 0 8px 25px rgba(49,92,89,.1); }
.reservation-item__date { display: grid; place-items: center; align-content: center; padding: 24px; background: var(--mint); line-height: 1.3; }
.reservation-item__date small { color: var(--muted); font-size: 10px; }
.reservation-item__date strong { color: var(--green); font: 700 28px Arial, sans-serif; }
.reservation-item__date span { color: var(--muted); font-size: 11px; }
.reservation-item__detail { display: grid; align-content: center; padding: 24px 28px; }
.reservation-item__detail small, .reservation-item__detail span { color: var(--muted); font-size: 10px; }
.reservation-item__detail strong { font: 700 28px Arial, sans-serif; }
.reservation-item__actions { display: grid; gap: 8px; align-content: center; justify-items: stretch; padding: 20px 24px; }
.reservation-item__actions form { text-align: center; }
.danger-link { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 11px; text-decoration: underline; }
.same-day-label { margin-top: 5px; color: var(--danger); font-size: 10px; font-style: normal; font-weight: 700; }
.phone-action { color: var(--danger); font-size: 11px; font-weight: 700; text-align: center; }

.subsection-heading { display: flex; align-items: center; justify-content: space-between; margin: 30px 0 14px; }
.subsection-heading h2 { margin: 0; font-size: 19px; }
.subsection-heading span { padding: 3px 9px; border-radius: 20px; background: var(--green-soft); color: var(--green); font-size: 10px; }
.reservation-detail { margin-bottom: 28px; padding: 28px; border: 1px solid #a9c5bd; border-radius: 16px; background: var(--mint); }
.reservation-detail__heading { display: flex; align-items: flex-start; justify-content: space-between; }
.reservation-detail__heading h2 { margin: 2px 0 0; }
.reservation-detail .reservation-summary { background: white; }
.phone-guidance { margin: 18px 0 0; padding: 14px; border-radius: 10px; background: var(--danger-soft); color: #743838; font-size: 12px; }
.phone-guidance a { font-weight: 700; }
.history-section { margin-top: 38px; border-top: 1px solid var(--line); }
.history-list { display: grid; gap: 9px; }
.history-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 15px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: 12px; }
.history-list article > div { display: grid; }
.history-list small, .history-empty { color: var(--muted); font-size: 11px; }

.empty-state { padding: 55px 20px; border: 1px dashed #c9d6d2; border-radius: 16px; text-align: center; }
.empty-state > span { display: grid; width: 47px; height: 47px; margin: 0 auto 12px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); }
.empty-state h2 { margin: 0; font-size: 20px; }
.empty-state p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }

.change-panel { margin: 38px -18px 0; padding: 40px; border-radius: 18px; background: var(--mint); }
.change-panel .section-heading { margin-bottom: 20px; }
.change-panel .slot-option > span { background: rgba(255,255,255,.85); }
.change-panel h3 { margin: 12px 0; font-size: 16px; }
.change-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 24px; }

.history-panel { margin-top: 30px; border-top: 1px solid var(--line); }
.history-panel summary { padding: 22px 0 8px; cursor: pointer; color: var(--muted); font-size: 12px; }
.history-panel ul { margin: 10px 0 0; padding: 0; list-style: none; }
.history-panel li { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.history-panel em { color: var(--muted); font-style: normal; }

.admin-shell { overflow: hidden; border-radius: 20px; background: white; box-shadow: var(--shadow); }
.admin-login-page .page-main { display: grid; min-height: calc(100dvh - 230px); place-items: center; margin-top: 34px; }
.admin-login-card { width: min(520px, 100%); padding: clamp(28px, 6vw, 52px); }
.admin-login-card .section-heading { margin-bottom: 28px; }
.admin-login-card .section-heading h1 { font-size: clamp(26px, 5vw, 34px); }
.admin-login-form { gap: 20px; }
.admin-login-card__note { margin: 22px 0 0; color: var(--muted); font-size: 11px; line-height: 1.7; text-align: center; }
.admin-alert { margin: 20px 24px 0; }
.admin-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 20px; align-items: center; padding: 15px 22px; border-bottom: 1px solid var(--line); }
.admin-view-tabs { display: flex; gap: 6px; }
.admin-view-tabs a { min-width: 56px; padding: 8px 15px; border-radius: 8px; color: var(--muted); font-size: 12px; text-align: center; text-decoration: none; white-space: nowrap; }
.admin-view-tabs a[aria-current="page"] { background: var(--green-soft); color: var(--green); font-weight: 700; }
.admin-toolbar__actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; margin-left: auto; }
.admin-toolbar__actions .button { min-height: 38px; padding: 0 12px; font-size: 10px; letter-spacing: 0; white-space: nowrap; }
.admin-search { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(140px, 1fr)) auto auto auto; gap: 12px; align-items: end; padding: 20px 22px; border-bottom: 1px solid var(--line); background: #fafbf9; }
.admin-search .field label { display: block; margin: 0 0 5px; font-size: 10px; }
.admin-search input, .admin-search select { min-height: 42px; }
.admin-search > .text-link { align-self: center; white-space: nowrap; }
.admin-table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; }
.admin-table th { padding: 12px 18px; background: #f6f8f7; color: var(--muted); font-size: 10px; text-align: left; }
.admin-table td { padding: 17px 18px; border-top: 1px solid var(--line); }
.admin-table code { padding: 3px 7px; border-radius: 5px; background: #f1f3f2; }
.patient-kana { display: block; color: var(--muted); font-size: 9px; }
.status { display: inline-block; padding: 4px 8px; border-radius: 20px; font-size: 10px; }
.status--confirmed { background: var(--green-soft); color: var(--green); }
.status--cancelled { background: var(--danger-soft); color: var(--danger); }
.simple-block-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 16px; }
.simple-block-actions > form { margin: 0; }
.simple-block-actions .button { width: auto; white-space: nowrap; padding-inline: 20px; }
/* Empty slots freed by a patient's cancellation, not by staff or rescheduling. */
.simple-week-calendar .simple-week-calendar__cell.is-patient-cancelled,
.day-calendar .day-calendar__row.is-patient-cancelled > div,
.three-day-calendar .three-day-calendar__cell.is-patient-cancelled,
.week-calendar .week-calendar__cell.is-patient-cancelled { background: #fdeaea !important; box-shadow: inset 3px 0 #d98686; }
.mail-warning { display: block; color: var(--danger); }
.booking-source { display: inline-block; padding: 4px 8px; border: 1px solid color-mix(in srgb, var(--green) 22%, transparent); border-radius: 20px; background: #f4f8f7; color: var(--green); font-size: 10px; font-weight: 700; line-height: 1.3; }
.booking-source--kiosk { border-color: #d8b977; background: #fbf6e9; color: #795b1f; }
.booking-source--smartphone_card { border-color: #afd1c7; background: #eff8f5; color: #245f54; }
.booking-source--smartphone_first_visit { border-color: #b9c5ca; background: #f3f6f7; color: #50636a; }
.booking-source--staff { border-color: #aebfd7; background: #f0f5fb; color: #355a82; }
.reservation-schedule-marker { display: inline-grid; width: 22px; height: 22px; flex: 0 0 auto; margin-left: 5px; place-items: center; border: 2px solid #3c7772; border-radius: 50%; background: #f1faf7; color: #2b625d; font-size: 11px; font-style: normal; font-weight: 800; line-height: 1; text-decoration: none; vertical-align: middle; }
.admin-empty { padding: 50px !important; color: var(--muted); text-align: center; }
.admin-row-actions { display: flex; gap: 10px; align-items: center; }
.admin-row-actions form { margin: 0; }
.admin-row-actions a { color: var(--green); }

.admin-calendar { overflow-x: auto; padding: 22px; }
.calendar-view-heading { display: grid; grid-template-columns: 90px 1fr 90px; align-items: center; margin-bottom: 18px; text-align: center; }
.calendar-view-heading h2 { margin: 0; font-size: 20px; }
.calendar-view-heading a { color: var(--green); font-size: 12px; font-weight: 700; text-decoration: none; }
.calendar-closed-note { padding: 12px; border-radius: 8px; background: var(--danger-soft); color: var(--danger); text-align: center; }
.day-calendar { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; }
.day-calendar__row { display: grid; grid-template-columns: 88px 1fr; min-height: 58px; border-bottom: 1px solid var(--line); }
.day-calendar__row:last-child { border-bottom: 0; }
.day-calendar__row time { display: grid; place-items: center; background: #f5f7f6; color: var(--muted); font: 700 13px Arial, sans-serif; }
.day-calendar__row > div { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 9px 14px; }
.calendar-reservation { display: inline-flex; max-width: 100%; align-items: center; padding: 6px 9px; border-radius: 7px; background: var(--green-soft); color: var(--green-dark); font-size: 11px; }
.calendar-patient-link, .admin-patient-link { color: var(--green-dark); font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.calendar-treatment-separator { flex: 0 0 auto; padding: 0 4px; }
.calendar-treatment { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-unavailable { color: #929c99; font-size: 11px; }
.calendar-add { margin-left: auto; color: var(--green); font-size: 11px; font-weight: 700; }
.three-day-calendar-tools { display: flex; align-items: center; justify-content: center; gap: 18px; margin: -8px 0 14px; }
.three-day-calendar-note { margin: 0; color: var(--muted); font-size: 11px; text-align: center; }
.three-day-calendar-wrap { overflow-x: auto; }
.three-day-calendar { display: grid; grid-template-columns: 72px repeat(3, minmax(240px, 1fr)); min-width: 820px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.three-day-calendar > div { min-height: 64px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.three-day-calendar__corner { display: grid; place-items: center; background: var(--green-dark); color: white; font-size: 12px; font-weight: 700; }
.three-day-calendar__head { display: grid; place-items: center; align-content: center; background: #f8faf9; }
.three-day-calendar__head span { color: var(--muted); font-size: 11px; }
.three-day-calendar__head strong { color: var(--ink); font-size: 17px; }
.three-day-calendar__time { display: grid; place-items: center; background: #f4f6f5; color: var(--ink); font: 800 13px Arial, sans-serif; }
.three-day-calendar__cell { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 7px 9px; background: white; }
.three-day-calendar__cell.is-full { background: #f6f6f4; }
.three-day-reservation { display: inline-flex; max-width: 100%; min-width: 0; align-items: center; padding: 7px 9px; border-radius: 7px; background: var(--green-soft); color: var(--green-dark); font-size: 12px; }
.three-day-unavailable { color: #788481; font-size: 11px; }
.three-day-add { margin-left: auto; color: var(--green); font-size: 11px; font-weight: 700; white-space: nowrap; }
.week-calendar-wrap { overflow-x: auto; }
.week-calendar { display: grid; grid-template-columns: 64px repeat(7, minmax(105px, 1fr)); min-width: 820px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.week-calendar > div { min-height: 48px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.week-calendar__corner, .week-calendar__time { background: #f4f6f5; }
.week-calendar__head { display: grid; place-items: center; align-content: center; background: #f8faf9; }
.week-calendar__head span { color: var(--muted); font-size: 9px; }
.week-calendar__head strong { font: 700 12px Arial, sans-serif; }
.week-calendar__head.is-closed { background: var(--danger-soft); color: var(--danger); }
.calendar-date-button { border: 0; background: transparent; color: inherit; font: inherit; text-decoration: none; cursor: pointer; }
.calendar-date-button:focus-visible { border-radius: 6px; outline: 3px solid rgba(197,156,88,.45); outline-offset: 2px; }
.week-calendar__date-button { display: grid; width: 100%; height: 100%; place-items: center; align-content: center; padding: 4px; }
.week-calendar__date-button:hover { background: var(--green-soft); color: var(--green-dark); }
.week-calendar__time { display: grid; place-items: center; color: var(--muted); font: 700 10px Arial, sans-serif; }
.week-calendar__cell { display: grid; place-items: center; align-content: center; gap: 2px; padding: 3px; background: white; }
.week-calendar__cell.is-full { background: #f4f4f2; }
.week-calendar__cell > span { max-width: 100%; overflow: hidden; color: var(--green-dark); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.week-calendar__cell a { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); text-decoration: none; }
.week-calendar__cell a.week-calendar__reservation { display: block; width: 100%; height: auto; overflow: hidden; padding: 3px 4px; border-radius: 4px; color: var(--green-dark); font-size: 9px; font-weight: 700; text-align: center; text-decoration: underline; text-overflow: ellipsis; white-space: nowrap; }
.week-calendar__cell a.week-calendar__reservation:hover { background: #d8e9e4; }
.week-calendar__cell a:focus-visible { outline: 3px solid rgba(197,156,88,.45); outline-offset: 1px; }
.week-calendar__cell small { color: #a3aaa8; }
.month-calendar { display: grid; grid-template-columns: repeat(7, minmax(105px, 1fr)); min-width: 760px; overflow: hidden; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.month-calendar__head { padding: 8px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #f4f6f5; color: var(--muted); font-size: 10px; text-align: center; }
.month-calendar__cell { display: grid; min-height: 112px; align-content: start; gap: 3px; padding: 7px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.month-calendar__date-button { display: grid; width: 30px; height: 30px; place-items: center; justify-self: start; border-radius: 50%; color: var(--green-dark); }
.month-calendar__date-button strong { font: 700 12px Arial, sans-serif; }
.month-calendar__date-button:hover { background: var(--green-soft); }
.month-calendar__cell > span { overflow: hidden; padding: 3px 5px; border-radius: 4px; background: var(--green-soft); color: var(--green-dark); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.month-calendar__cell > small { color: var(--danger); }
.month-calendar__cell > em { color: var(--muted); font-size: 8px; font-style: normal; }
.month-calendar__more { color: var(--green); font-size: 8px; font-style: normal; font-weight: 700; }
.month-calendar__cell.is-outside { opacity: .42; }
.month-calendar__cell.is-closed { background: #fff7f6; }

/* 5K iMacの全画面運用を想定した受付用管理画面。左7：右3を維持する。 */
body.admin-simple-page { min-width: 1180px; overflow: hidden; background: #f5f7f6; line-height: 1.45; }
body.admin-simple-page .site-header,
body.admin-simple-page .site-footer { display: none; }
body.admin-simple-page .page-main { width: 100%; min-height: 100dvh; margin: 0; }
body.admin-simple-page .flash,
body.admin-simple-page .admin-alert { position: fixed; z-index: 40; top: 12px; left: 50%; width: min(720px, calc(100% - 40px)); margin: 0; transform: translateX(-50%); box-shadow: 0 8px 25px rgba(24,48,47,.18); }
.admin-shell--simple { overflow: visible; border-radius: 0; box-shadow: none; }
.simple-admin-dashboard { display: grid; grid-template-columns: minmax(0, 7fr) minmax(360px, 3fr); width: 100%; height: 100dvh; overflow: hidden; background: white; }
.simple-week-panel { min-width: 0; padding: 14px 16px 16px; overflow: hidden; }
.simple-week-heading { display: grid; min-width: 1040px; grid-template-columns: auto minmax(360px, 1fr) auto; gap: 14px; align-items: center; min-height: 92px; }
.simple-shift-button { display: grid; min-width: 96px; min-height: 60px; grid-template-columns: auto auto; gap: 7px; place-content: center; align-items: center; padding: 0 15px; border: 2px solid var(--green-dark); border-radius: 12px; background: var(--green-dark); color: #fff; font: inherit; cursor: pointer; box-shadow: 0 3px 10px rgba(32, 61, 56, .14); }
.simple-shift-button > span { font-size: 25px; line-height: 1; }
.simple-shift-button > strong { font-size: 15px; white-space: nowrap; }
.simple-shift-button:hover { background: var(--green); }
.simple-shift-button:focus-visible { outline: 3px solid rgba(197,156,88,.52); outline-offset: 2px; }
.simple-shift-dialog { width: min(1600px, calc(100vw - 32px)); max-width: none; height: calc(100dvh - 32px); max-height: none; margin: auto; padding: 0; overflow: hidden; border: 0; border-radius: 16px; background: #fff; color: var(--ink); box-shadow: 0 18px 55px rgba(23, 43, 41, .28); }
.simple-shift-dialog::backdrop { background: rgba(23, 43, 41, .5); backdrop-filter: blur(2px); }
.simple-shift-dialog__heading { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 14px 8px 20px; border-bottom: 1px solid var(--line); }
.simple-shift-dialog__heading h2 { margin: 0; font-size: 22px; white-space: nowrap; }
.simple-shift-dialog__title, .simple-shift-dialog__actions { display: flex; align-items: center; gap: 12px; }
.simple-shift-dialog__title { min-width: 0; gap: 20px; }
.simple-shift-dialog__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 13px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.2; }
.simple-shift-dialog__legend span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.simple-shift-dialog__legend strong { display: inline-grid; width: 22px; height: 22px; place-items: center; border-radius: 5px; background: #e4f0ed; color: #39716b; font-size: 13px; }
.simple-shift-dialog__legend span:nth-child(2) strong { background: #e6eef9; color: #607ca7; }
.simple-shift-dialog__legend span:nth-child(3) strong { background: #fff1d8; color: #9a742e; }
.simple-shift-dialog__legend span:nth-child(4) strong { background: #f2eaf3; color: #8a638e; }
.simple-shift-dialog__heading a { color: var(--green-dark); font-size: 14px; font-weight: 700; }
.simple-shift-dialog__heading form { margin: 0; }
.simple-shift-dialog iframe { display: block; width: 100%; height: calc(100% - 64px); border: 0; background: #f5f7f6; }
.simple-week-nav { display: grid; width: 60px; height: 60px; flex: 0 0 auto; place-items: center; border: 2px solid var(--line); border-radius: 50%; background: #fff; color: var(--green-dark); font-size: 40px; font-weight: 700; line-height: 1; text-decoration: none; box-shadow: 0 3px 10px rgba(32, 61, 56, .08); }
.simple-week-nav__icon { display: block; width: 16px; height: 16px; box-sizing: border-box; border: solid currentColor; border-width: 0 6px 6px 0; transform-origin: 50% 50%; }
.simple-week-nav--previous .simple-week-nav__icon { transform: rotate(135deg); }
.simple-week-nav--next .simple-week-nav__icon { transform: rotate(-45deg); }
.simple-week-titlebar { display: flex; min-width: 0; gap: 18px; align-items: center; justify-content: center; }
.simple-week-heading h1 { margin: 0; font-size: clamp(28px, 1.5vw, 38px); font-weight: 700; line-height: 1; letter-spacing: .02em; white-space: nowrap; }
.simple-week-titlebar > .simple-today-link { display: grid; min-height: 60px; padding: 0 18px; place-items: center; border-radius: 30px; background: var(--green-soft); color: var(--green-dark); font-size: 17px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.simple-last-updated { color: var(--muted); font-size: 12px; font-weight: 500; white-space: nowrap; }
.simple-last-updated.has-error { color: var(--danger); }
.simple-week-actions { display: flex; gap: 10px; align-items: center; justify-content: flex-end; }
.simple-patient-search-button { display: grid; width: 60px; height: 60px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(0, 0, 0, .08); border-radius: 50%; background: #f5f5f7; color: var(--ink); text-decoration: none; }
.simple-patient-search-button > span { position: relative; display: block; width: 22px; height: 22px; border: 3px solid currentColor; border-radius: 50%; }
.simple-patient-search-button > span::after { position: absolute; right: -7px; bottom: -5px; width: 10px; height: 3px; border-radius: 3px; background: currentColor; content: ""; transform: rotate(45deg); transform-origin: left center; }
.simple-week-tools { display: flex; gap: 8px; align-items: center; }
.simple-week-tools .button { min-height: 60px; padding: 0 16px; font-size: 14px; letter-spacing: 0; white-space: nowrap; }
body.admin-simple-page .simple-admin-mode-menu { flex: 0 0 auto; }
body.admin-simple-page .simple-admin-mode-menu > summary { width: 60px; min-width: 60px; min-height: 60px; justify-content: center; padding: 0; border-radius: 50%; background: #f5f5f7; font-size: 14px; }
body.admin-simple-page .simple-admin-mode-menu > summary strong { display: none; }
body.admin-simple-page .simple-admin-mode-menu .header-menu__panel { width: 260px; }
.simple-week-heading a:hover { background: #dbe9e5; }
.simple-week-heading a:focus-visible,
.simple-week-calendar a:focus-visible,
.simple-week-calendar button:focus-visible,
.simple-month-calendar__date:focus-visible { outline: 3px solid rgba(197,156,88,.52); outline-offset: 2px; }
.simple-week-calendar { display: grid; grid-template-columns: 92px repeat(var(--simple-weekday-count, 7), minmax(0, 1fr)); grid-template-rows: 72px repeat(20, minmax(78px, auto)); width: 100%; height: calc(100dvh - 122px); min-width: 960px; min-height: 0; overflow: auto; border-top: 1px solid #cfdad7; border-left: 1px solid #cfdad7; overscroll-behavior: contain; }
.simple-week-calendar > div { min-width: 0; min-height: 0; border-right: 1px solid #cfdad7; border-bottom: 1px solid #cfdad7; }
.simple-week-calendar__corner,
.simple-week-calendar__time { display: grid; place-items: center; background: #f3f6f5; font-family: Arial, sans-serif; font-weight: 700; }
.simple-week-calendar__corner { color: var(--muted); font-size: 18px; }
.simple-week-calendar__time { color: var(--ink); font-size: clamp(18px, .93vw, 24px); }
.simple-week-calendar__corner,
.simple-week-calendar__head { position: sticky; z-index: 4; top: 0; }
.simple-week-calendar__corner { left: 0; z-index: 5; }
.simple-week-calendar__time,
.simple-week-calendar__note-label { position: sticky; z-index: 3; left: 0; }
.simple-week-calendar__head { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: stretch; background: #f8faf9; }
.simple-week-calendar__date-link { display: grid; min-width: 0; height: 100%; padding: 0 6px; justify-items: start; align-content: center; color: var(--ink); text-decoration: none; }
.simple-week-calendar__head strong { font: 700 clamp(22px, 1.25vw, 32px) Arial, sans-serif; white-space: nowrap; }
.simple-week-calendar__head small { color: var(--danger); font-size: 14px; }
.simple-week-attendance { display: grid; min-width: 0; margin: 5px 5px 5px 0; padding: 3px 5px; overflow: hidden; border: 1px solid #d8e1df; border-radius: 6px; background: #fff; color: #496563; font: inherit; text-align: left; cursor: pointer; }
.simple-week-attendance span { display: -webkit-box; overflow: hidden; font-size: clamp(9px, .43vw, 12px); line-height: 1.12; overflow-wrap: anywhere; white-space: pre-wrap; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.simple-week-attendance.is-empty { place-items: center; border-style: dashed; color: var(--muted); }
.simple-week-attendance.is-empty::before { content: "＋ 出勤情報"; font-size: clamp(8px, .4vw, 11px); font-weight: 700; white-space: nowrap; }
.simple-week-attendance.is-empty span { display: none; }
.simple-week-attendance:hover { border-color: var(--green); background: var(--green-soft); }
.simple-week-calendar__head.is-selected { box-shadow: inset 0 4px 0 var(--green); }
.simple-week-calendar__head.is-closed { background: #faf5f4; }
.simple-week-calendar__cell { position: relative; display: grid; min-width: 0; place-items: center; align-content: center; gap: 3px; padding: 4px 6px; background: #fff; }
.simple-week-calendar__cell.is-unavailable { background: #f4f5f3; }
.simple-week-calendar__cell.is-blocked { background: #fff1df; box-shadow: inset 4px 0 0 #d97706; }
body.admin-simple-page .simple-week-calendar__time.is-morning { background: #e1eff5; }
body.admin-simple-page .simple-week-calendar__cell.is-morning { background: #f3f9fc; }
body.admin-simple-page .simple-week-calendar__time.is-afternoon { background: #f9e7d3; }
body.admin-simple-page .simple-week-calendar__cell.is-afternoon { background: #fff8ef; }
body.admin-simple-page .simple-week-calendar__cell.is-morning.is-unavailable { background: #e8f0f3; }
body.admin-simple-page .simple-week-calendar__cell.is-afternoon.is-unavailable { background: #f5eee6; }
body.admin-simple-page .simple-week-calendar__cell.is-morning.is-blank-adjustment { position: relative; background: #dbeaf1; }
body.admin-simple-page .simple-week-calendar__cell.is-afternoon.is-blank-adjustment { position: relative; background: #f0e2d3; }
body.admin-simple-page .simple-week-calendar__cell.is-morning.is-past-entry { position: relative; background: #d6e3e8; }
body.admin-simple-page .simple-week-calendar__cell.is-afternoon.is-past-entry { position: relative; background: #eadfd4; }
body.admin-simple-page .simple-week-calendar__cell.is-blocked { background: #fff1df; }
.simple-week-block { display: grid; width: 100%; min-width: 0; min-height: 62px; gap: 3px; place-items: center; align-content: center; padding: 7px 8px; overflow: hidden; border: 1px solid #e4a34d; border-radius: 8px; background: #fff8ec; color: #92400e; font: inherit; text-align: center; cursor: pointer; }
.simple-week-block strong { font-size: clamp(14px, .7vw, 18px); line-height: 1.1; }
.simple-week-block small { display: -webkit-box; max-width: 100%; overflow: hidden; color: #9a5a16; font-size: clamp(10px, .5vw, 13px); line-height: 1.15; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.simple-week-block:hover { border-color: #b45309; background: #ffecd1; }
.simple-week-reservation { position: relative; display: grid; width: 100%; min-width: 0; gap: 2px; align-content: start; padding: 5px 7px; overflow: hidden; border-left: 4px solid #55a58f; border-radius: 5px; background: var(--green-soft); color: var(--green-dark); font-size: clamp(14px, .66vw, 18px); line-height: 1.18; text-decoration: none; }
.simple-week-reservation[data-booking-source="kiosk"] { border-left-color: #b88c35; }
.simple-week-reservation[data-booking-source="smartphone_first_visit"] { border-left-color: #829399; }
.simple-week-reservation[data-booking-source="staff"] { border-left-color: #567ba6; }
.simple-week-reservation__patient { display: grid; min-width: 0; grid-template-columns: max-content minmax(0, 1fr); align-items: start; padding-right: 0; overflow: hidden; white-space: normal; }
.simple-week-reservation__patient b { min-width: max-content; max-width: none; overflow: visible; font-weight: 700; text-overflow: clip; white-space: nowrap; }
.simple-week-reservation__patient strong { display: block; min-width: 0; overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.simple-week-reservation__treatment { display: -webkit-box; min-width: 0; padding-right: 0; overflow: hidden; color: #496563; overflow-wrap: anywhere; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.simple-week-calendar { --today-border: color-mix(in srgb, var(--action-blue) 55%, white); }
.simple-week-calendar__cell.is-today,
.simple-week-calendar__note-cell.is-today { position: relative; }
.simple-week-calendar__head.is-today::after,
.simple-week-calendar__cell.is-today::after,
.simple-week-calendar__note-cell.is-today::after { content: ''; position: absolute; inset: 0 -1px -1px 0; border-inline: 2px solid var(--today-border); pointer-events: none; z-index: 1; }
.simple-week-calendar__head.is-today::after { border-top: 2px solid var(--today-border); }
.simple-week-calendar__note-cell.is-today[data-note-period="after_hours"]::after { border-bottom: 2px solid var(--today-border); }
.simple-month-calendar__day.is-today,
.simple-mobile-date-calendar__day.is-today { outline: 2px solid color-mix(in srgb, var(--action-blue) 55%, white); outline-offset: -2px; }
.simple-week-reservation__source { display: none; }
.simple-week-reservation__patient { min-height: 1lh; }
.simple-week-reservation__treatment { min-height: 2lh; }
.simple-week-reservation > .patient-status-markers { position: absolute; right: 5px; bottom: 4px; width: auto; height: 14px; gap: 2px; margin: 0; }
.simple-week-reservation:hover { background: #d6e7e2; }

/* 予約色: 患者入力=青、スタッフ入力=緑。赤は患者キャンセル後の空き枠だけ。 */
.calendar-reservation[data-reservation-tone="patient"],
.three-day-reservation[data-reservation-tone="patient"],
.week-calendar__cell a.week-calendar__reservation[data-reservation-tone="patient"],
.month-calendar__cell > span[data-reservation-tone="patient"],
.simple-week-reservation[data-reservation-tone="patient"] { border-color: #4f8fcf; background: #e8f3ff; color: #245f99; }
.calendar-reservation[data-reservation-tone="staff"],
.three-day-reservation[data-reservation-tone="staff"],
.week-calendar__cell a.week-calendar__reservation[data-reservation-tone="staff"],
.month-calendar__cell > span[data-reservation-tone="staff"],
.simple-week-reservation[data-reservation-tone="staff"] { border-color: #4f9a70; background: #e7f5ed; color: #286641; }
.calendar-reservation[data-reservation-tone] .calendar-patient-link,
.three-day-reservation[data-reservation-tone] .calendar-patient-link,
.month-calendar__cell > span[data-reservation-tone] .calendar-patient-link { color: inherit; }
.simple-week-reservation[data-reservation-tone] .simple-week-reservation__treatment { color: inherit; opacity: .84; }
.simple-week-reservation[data-reservation-tone="patient"]:hover { background: #d9ebff; }
.simple-week-reservation[data-reservation-tone="staff"]:hover { background: #d7eddf; }
.simple-week-add { position: absolute; inset: 0; display: grid; width: 100%; min-width: 0; height: 100%; min-height: 0; place-items: center; border: 0; background: transparent; color: #0066cc; font: 900 42px/1 Arial, sans-serif; text-decoration: none; -webkit-text-stroke: 1.4px currentColor; }
.simple-week-add:hover { background: rgba(47, 91, 108, .08); color: #004f9f; transform: none; }
.simple-week-add:focus-visible { outline: 3px solid rgba(0, 102, 204, .3); outline-offset: -4px; }
.simple-week-add--adjustment,
.simple-week-add--past { position: absolute; inset: 0; width: 100%; min-width: 0; height: 100%; min-height: 0; font-size: 0; -webkit-text-stroke-width: 0; }
.simple-week-add--adjustment:hover,
.simple-week-add--past:hover { background: rgba(47, 91, 108, .08); transform: none; }
.simple-week-add--adjustment:focus-visible,
.simple-week-add--past:focus-visible { outline-offset: -4px; }
.simple-week-calendar__note-label { display: grid; place-items: center; background: #f4efe4; color: var(--ink); font-size: clamp(15px, .75vw, 19px); font-weight: 700; text-align: center; }
.simple-week-calendar__note-cell { display: grid; place-items: stretch; padding: 5px; background: #fffdf8; }
.simple-week-note { display: grid; width: 100%; min-width: 0; place-items: start; align-content: start; padding: 8px 10px; overflow: hidden; border: 1px solid #e4dac3; border-radius: 8px; background: #fff; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.simple-week-note span { display: -webkit-box; overflow: hidden; font-size: clamp(14px, .66vw, 18px); line-height: 1.35; overflow-wrap: anywhere; white-space: pre-wrap; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.simple-week-note.is-empty { place-items: center; align-content: center; border-style: dashed; color: var(--muted); }
.simple-week-note.is-empty::before { content: "＋ 備考"; font-size: clamp(14px, .66vw, 18px); font-weight: 700; }
.simple-week-note:hover { border-color: var(--green); background: var(--green-soft); }
.simple-note-dialog { width: min(720px, calc(100vw - 40px)); }
.simple-block-remove-dialog { width: min(620px, calc(100vw - 40px)); }
.simple-block-summary { margin: 20px 0; }
.simple-block-summary div { display: grid; grid-template-columns: 90px 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.simple-block-summary dt { color: var(--muted); font-size: 11px; }
.simple-block-summary dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.button--danger { border-color: #b42318; background: #b42318; color: #fff; }
.duplicate-patient-alert { position: fixed; z-index: 32; bottom: 18px; left: 18px; display: grid; min-width: 280px; gap: 3px; padding: 14px 18px; border: 1px solid #e19a95; border-radius: 12px; background: #fff0ef; color: #922f2a; text-decoration: none; box-shadow: 0 8px 24px rgba(89, 28, 24, .18); }
.duplicate-patient-alert strong { font-size: 15px; }
.duplicate-patient-alert span { font-size: 12px; }
.duplicate-patient-alert:hover { border-color: #b42318; background: #ffe5e3; }
.duplicate-patient-dialog { width: min(1100px, calc(100vw - 40px)); }
.duplicate-patient-safety-note { display: grid; gap: 4px; padding: 14px 16px; border-left: 4px solid #4f8fcf; border-radius: 8px; background: #edf6ff; color: #245f99; }
.duplicate-patient-safety-note span { font-size: 12px; line-height: 1.6; }
.duplicate-patient-correction-note { display: grid; gap: 4px; margin-top: 10px; padding: 14px 16px; border-left: 4px solid #d39a2c; border-radius: 8px; background: #fff8e8; color: #765312; }
.duplicate-patient-correction-note span { font-size: 12px; line-height: 1.6; }
.duplicate-patient-groups { display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; margin-top: 18px; }
.duplicate-patient-group { padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.duplicate-patient-group__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.duplicate-patient-group__heading h3 { margin: 0; font-size: 18px; }
.duplicate-patient-group__heading code { font-size: 19px; }
.duplicate-patient-group__heading > span { padding: 4px 9px; border-radius: 999px; background: var(--danger-soft); color: var(--danger); font-size: 12px; font-weight: 700; }
.duplicate-patient-profiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 14px 0; }
.duplicate-patient-profiles article { display: grid; gap: 10px; padding: 14px; border: 1px solid #dfe5e3; border-radius: 10px; background: #f8faf9; }
.duplicate-patient-profiles article > div { display: grid; gap: 2px; }
.duplicate-patient-profiles article strong { font-size: 16px; }
.duplicate-patient-profiles article small { color: var(--muted); }
.duplicate-patient-profiles dl { display: grid; gap: 5px; margin: 0; }
.duplicate-patient-profiles dl div { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 8px; }
.duplicate-patient-profiles dt { color: var(--muted); font-size: 11px; }
.duplicate-patient-profiles dd { min-width: 0; margin: 0; overflow-wrap: anywhere; font-size: 12px; }
.duplicate-patient-profiles article > a { color: var(--action-blue); font-size: 12px; font-weight: 700; }
.duplicate-patient-correction-form { display: grid; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line); }
.duplicate-patient-correction-form label { font-size: 12px; font-weight: 700; }
.duplicate-patient-correction-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.duplicate-patient-correction-form input { width: 100%; min-width: 0; min-height: 44px; }
.duplicate-patient-correction-form .button { min-height: 44px; padding-inline: 14px; white-space: nowrap; }
.duplicate-patient-correction-locked { padding-top: 10px; border-top: 1px solid var(--line); line-height: 1.5; }
.duplicate-patient-merge-form { display: grid; grid-template-columns: minmax(260px, 1fr) auto; gap: 12px; align-items: end; padding-top: 14px; border-top: 1px solid var(--line); }
.duplicate-patient-merge-form label { display: grid; gap: 6px; font-size: 12px; font-weight: 700; }
.duplicate-patient-merge-form select { min-height: 46px; width: 100%; min-width: 0; }
.duplicate-patient-merge-form .button { min-height: 46px; }
.duplicate-patient-merge-values { grid-column: 1 / -1; display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
.duplicate-patient-merge-values > small { color: var(--muted); }
.duplicate-patient-merge-values fieldset { display: grid; min-width: 0; gap: 7px; margin: 0; padding: 10px; border: 1px solid var(--line); border-radius: 8px; }
.duplicate-patient-merge-values legend { padding: 0 5px; font-weight: 700; }
.clinical-merge-preview { grid-column: 1 / -1; display: grid; gap: 12px; min-width: 0; }
.clinical-merge-preview fieldset { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.clinical-merge-preview legend { padding: 0 5px; font-weight: 700; }
.clinical-merge-preview label { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 5px 8px; align-items: start; padding: 8px 0; }
.clinical-merge-preview label > div { grid-column: 2; font-weight: 400; }
.duplicate-patient-merge-form > small { grid-column: 1 / -1; }
.duplicate-patient-merge-values fieldset label { display: flex; grid-template-columns: none; align-items: center; gap: 7px; font-weight: 400; }
.duplicate-patient-merge-values label span { min-width: 0; overflow-wrap: anywhere; }
.clinical-merge-preview legend { max-width: 100%; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .duplicate-patient-alert { right: 12px; bottom: 12px; left: 12px; min-width: 0; }
  .duplicate-patient-profiles { grid-template-columns: 1fr; }
  .duplicate-patient-correction-form > div { grid-template-columns: 1fr; }
  .duplicate-patient-merge-form { grid-template-columns: minmax(0,1fr); }
}
.button--danger:hover { border-color: #8f1c13; background: #8f1c13; }
.simple-note-form { display: grid; gap: 18px; }
.simple-note-form label { display: grid; gap: 8px; font-weight: 700; }
.simple-note-form textarea { width: 100%; min-height: 240px; resize: vertical; font: 16px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.simple-note-form__actions { display: flex; justify-content: flex-end; }
.simple-months { display: grid; grid-auto-rows: minmax(390px, calc(50dvh - 26px)); gap: 12px; min-width: 0; padding: 14px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; border-left: 1px solid #cfdad7; background: #f4f6f5; }
.simple-month-card { display: grid; min-height: 390px; grid-template-rows: 48px minmax(0, 1fr); overflow: hidden; border: 1px solid #d5dfdc; border-radius: 12px; background: white; }
.simple-month-card__heading { display: grid; grid-template-columns: minmax(90px, 1fr) auto minmax(90px, 1fr); gap: 8px; align-items: center; padding: 0 10px; border-bottom: 1px solid var(--line); }
.simple-month-card__heading--plain { grid-template-columns: 1fr; }
.simple-month-card__heading h2 { margin: 0; font-size: clamp(18px, 1vw, 24px); text-align: center; }
.simple-month-card__heading a { padding: 5px 8px; border-radius: 16px; color: var(--green-dark); font-size: clamp(9px, .45vw, 12px); font-weight: 700; text-decoration: none; white-space: nowrap; }
.simple-month-card__heading a:first-child { justify-self: start; }
.simple-month-card__heading a:last-child { justify-self: end; }
.simple-month-card__heading a:hover { background: var(--green-soft); }
.simple-month-calendar { display: grid; min-height: 0; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-rows: 30px repeat(6, minmax(48px, 1fr)); }
.simple-month-calendar__weekday { display: grid; place-items: center; border-right: 1px solid #e6ecea; border-bottom: 1px solid #e1e8e6; background: #f8faf9; color: var(--muted); font-size: clamp(11px, .55vw, 14px); font-weight: 700; }
.simple-month-calendar__weekday:nth-child(7) { border-right: 0; }
.simple-month-calendar__day { position: relative; display: grid; min-width: 0; grid-template-rows: 1fr 1fr; place-items: center; gap: 0; padding: 2px; overflow: hidden; border-right: 1px solid #e6ecea; border-bottom: 1px solid #e6ecea; color: var(--ink); cursor: pointer; }
.simple-month-calendar__day:nth-child(7n) { border-right: 0; }
.simple-month-calendar__day.is-outside { color: #b0bab7; }
.simple-month-calendar__day.is-closed { background: #faf4f3; color: #98615d; }
.simple-month-calendar__day.is-displayed-week { background: #eef5f2; }
.simple-month-calendar__day.is-selected { box-shadow: inset 0 0 0 3px var(--green); color: var(--green-dark); }
.simple-month-calendar__week-switch { position: absolute; z-index: 0; inset: 0; }
.simple-month-calendar__date { position: relative; z-index: 1; display: grid; min-width: 34px; height: 34px; place-items: center; align-self: end; border-radius: 50%; color: inherit; font: 700 clamp(17px, .85vw, 22px) Arial, sans-serif; text-decoration: none; }
.simple-month-calendar__day.is-today .simple-month-calendar__date { background: var(--green-dark); color: white; }
.simple-month-calendar__count { position: relative; z-index: 1; display: flex; width: 100%; min-width: 0; min-height: calc(2em + 2px); max-width: 100%; max-height: calc(2em + 2px); flex-wrap: wrap; gap: 0 4px; align-self: start; align-content: start; justify-content: center; padding: 0 1px; overflow: hidden; box-sizing: border-box; color: var(--green-dark); font-size: clamp(9px, .48vw, 12px); line-height: 1; text-align: center; pointer-events: none; }
.simple-month-calendar__count span { max-width: 100%; flex: 0 0 auto; white-space: nowrap; }
.simple-month-calendar__date:hover { background: #d6e7e2; }
.simple-month-calendar__day:hover { background: #dcebe6; }

@media (max-width: 1800px) {
  .simple-week-heading { min-width: 0; min-height: 92px; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: 1fr; }
  .simple-week-titlebar { justify-content: flex-start; }
  .simple-week-actions { grid-column: auto; grid-row: auto; justify-content: flex-end; }
  .simple-week-calendar { height: calc(100dvh - 122px); }
}

@media (max-width: 1400px) {
  .simple-week-panel { padding: 10px 12px 12px; }
  .simple-week-heading { min-height: 78px; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; }
  .simple-shift-button { min-width: 86px; min-height: 52px; padding: 0 11px; }
  .simple-shift-button > span { font-size: 22px; }
  .simple-shift-button > strong { font-size: 14px; }
  .simple-week-nav { width: 52px; height: 52px; }
  .simple-week-nav__icon { width: 14px; height: 14px; border-width: 0 5px 5px 0; }
  .simple-week-titlebar { gap: 10px; }
  .simple-week-heading h1 { font-size: 28px; }
  .simple-week-titlebar > .simple-today-link { min-height: 52px; padding: 0 14px; font-size: 15px; }
  .simple-last-updated { font-size: 10px; }
  .simple-patient-search-button { width: 52px; height: 52px; }
  body.admin-simple-page .simple-admin-mode-menu > summary { width: 52px; min-width: 52px; min-height: 52px; }
  .simple-week-calendar { height: calc(100dvh - 100px); }
}

@media (max-width: 1100px) {
  body.admin-simple-page { min-width: 0; overflow-x: hidden; overflow-y: auto; }
  body.admin-simple-page .page-main { min-height: 100dvh; }
  .simple-admin-dashboard { display: block; height: auto; min-height: 100dvh; overflow: visible; }
  .simple-week-panel { height: 100dvh; min-height: 620px; overflow: hidden; }
  .simple-week-heading { display: flex; width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden; align-items: center; justify-content: flex-start; overscroll-behavior-x: contain; scrollbar-width: thin; }
  .simple-week-heading > *, .simple-week-titlebar, .simple-week-actions { flex: 0 0 auto; }
  .simple-week-calendar { height: calc(100dvh - 100px); }
  .simple-months { height: auto; max-height: none; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 390px; overflow: visible; border-top: 1px solid #cfdad7; border-left: 0; }
}

@media (max-width: 700px) {
  body.admin-simple-page .flash,
  body.admin-simple-page .admin-alert { width: calc(100% - 24px); }
  .simple-week-panel { min-height: 560px; padding: 8px; }
  .simple-week-heading { min-height: 62px; gap: 7px; }
  .simple-shift-button { min-width: 82px; min-height: 48px; padding: 0 9px; }
  .simple-shift-button > span { font-size: 20px; }
  .simple-shift-button > strong { font-size: 13px; }
  .simple-week-nav { width: 48px; height: 48px; }
  .simple-week-nav__icon { width: 13px; height: 13px; }
  .simple-week-titlebar { gap: 7px; }
  .simple-week-heading h1 { font-size: 24px; }
  .simple-week-titlebar > .simple-today-link { min-height: 48px; padding: 0 12px; font-size: 14px; }
  .simple-last-updated { font-size: 9px; }
  .simple-week-actions { gap: 7px; }
  .simple-patient-search-button { width: 48px; height: 48px; }
  .simple-patient-search-button > span { width: 19px; height: 19px; }
  body.admin-simple-page .simple-admin-mode-menu > summary { width: 48px; min-width: 48px; min-height: 48px; }
  body.admin-simple-page .simple-admin-mode-menu .header-menu__panel { position: fixed; top: 66px; right: 8px; width: min(280px, calc(100vw - 16px)); max-height: calc(100dvh - 74px); overflow-y: auto; }
  .simple-week-calendar { height: calc(100dvh - 82px); min-width: 0; grid-template-columns: 76px repeat(var(--simple-weekday-count, 7), minmax(120px, 1fr)); grid-template-rows: 64px repeat(20, minmax(72px, auto)); }
  .simple-week-calendar__corner { font-size: 15px; }
  .simple-week-calendar__time { font-size: 17px; }
  .simple-months { grid-template-columns: 1fr; grid-auto-rows: 390px; gap: 10px; padding: 10px; }
  .simple-month-card { min-height: 390px; }
  .simple-shift-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); border-radius: 12px; }
  .simple-shift-dialog__heading { padding-left: 14px; }
  .simple-shift-dialog__heading h2 { font-size: 18px; }
  .simple-shift-dialog__legend { display: none; }
  .simple-shift-dialog__heading a { display: none; }
  .duplicate-patient-alert { right: 10px; bottom: 10px; left: 10px; min-width: 0; }
}

.admin-panel { margin: 24px 0; padding: clamp(24px, 4vw, 38px); border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: 0 12px 35px rgba(37,70,66,.07); }
.admin-panel h2 { margin: 2px 0 8px; font-size: 22px; }
.admin-panel > p:not(.eyebrow) { color: var(--muted); font-size: 12px; }
.admin-panel__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.admin-panel__heading a { color: var(--green); font-size: 12px; }
.admin-modal-dialog { width: min(860px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; overflow-y: auto; color: var(--ink); }
.admin-patient-search-dialog { width: min(760px, calc(100% - 32px)); }
.admin-patient-search-dialog .admin-panel__heading p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.admin-patient-search-form { display: grid; gap: 8px; margin: 22px 0 0; }
.admin-patient-search-form > label { font-size: 16px; font-weight: 700; }
.admin-patient-search-form > div { display: flex; gap: 10px; }
.admin-patient-search-form input { min-width: 0; min-height: 56px; flex: 1; padding: 12px 16px; font-size: 18px; }
.admin-patient-search-form .button { min-width: 112px; min-height: 56px; flex: 0 0 auto; }
.admin-patient-search-response { margin-top: 18px; }
.admin-patient-search-response > p { margin: 0 0 10px; color: var(--muted); font-size: 14px; }
.admin-patient-search-results { display: grid; gap: 8px; }
.admin-patient-search-result { display: grid; gap: 4px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfb; color: var(--ink); text-decoration: none; }
a.admin-patient-search-result:hover { border-color: var(--action-blue); background: #f2f7ff; }
.admin-patient-search-result:focus-visible { outline: 3px solid rgba(0, 102, 204, .28); outline-offset: 2px; }
.admin-patient-search-result strong { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: baseline; font-size: 18px; }
.admin-patient-search-result strong > span:first-child { min-width: 120px; color: var(--action-blue); font-family: Arial, sans-serif; }
.admin-patient-search-result small { color: var(--muted); font-size: 14px; }
.admin-patient-search-result em { justify-self: end; color: var(--action-blue); font-size: 14px; font-style: normal; font-weight: 700; }
.admin-patient-search-result.is-unavailable { opacity: .7; }
.admin-patient-search-result.is-unavailable em { color: var(--muted); }
.admin-patient-search-form[aria-busy="true"] .button { opacity: .65; }
.admin-create-dialog { width: min(980px, calc(100% - 32px)); }
.admin-create-dialog .admin-panel__heading h2 { font-size: clamp(27px, 2.2vw, 34px); }
.admin-create-dialog > p { font-size: 15px !important; line-height: 1.75; }
.admin-create-dialog .admin-form-grid .field > label, .admin-create-dialog .admin-name-fields legend { margin-bottom: 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.admin-create-dialog .admin-form-grid input, .admin-create-dialog .admin-form-grid select { min-height: 52px; padding: 11px 13px; font-size: 17px; }
.admin-create-profile-fields { margin: 0; }
.admin-create-dialog .admin-create-profile-fields input, .admin-create-dialog .admin-create-email-field input { border-radius: 9999px; background: white; }
.admin-create-dialog .admin-form-grid > .button { min-height: 54px; padding-inline: 24px; font-size: 17px; }
.admin-create-appointment { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid #c9d8d4; border-radius: 16px; background: #f1f7f5; }
.admin-create-appointment > div { display: grid; gap: 5px; min-width: 0; padding: 14px 18px; }
.admin-create-appointment > div + div { border-left: 1px solid #c9d8d4; }
.admin-create-appointment small { color: var(--muted); font-size: 13px; font-weight: 700; }
.admin-create-appointment strong { color: var(--ink); font: 700 22px/1.25 Arial, sans-serif; white-space: nowrap; }
.admin-create-flow { margin-top: 28px; }
.admin-create-step[hidden] { display: none; }
.admin-create-step__heading { margin-bottom: 18px; }
.admin-create-step__heading h3 { margin: 0; color: var(--ink); font-size: 22px; }
.admin-create-step__heading p { margin: 6px 0 0; color: var(--muted); line-height: 1.65; }
.admin-create-search-heading { margin-bottom: 24px; }
.admin-create-search-heading p { margin-top: 0; font-size: 17px; }
.admin-create-back { margin: 0 0 14px; padding: 0; border: 0; background: transparent; color: var(--green-deep); font: inherit; font-size: 14px; font-weight: 700; line-height: 1.4; cursor: pointer; }
.admin-create-patient-search { display: grid; gap: 8px; }
.admin-create-patient-search > label { color: var(--ink); font-size: 18px; font-weight: 700; }
.admin-create-patient-search__input { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 12px; }
.admin-create-patient-search__input input { min-width: 0; min-height: 64px; padding: 12px 22px; border: 1px solid #bdcbc7; border-radius: 9999px; background: white; color: var(--ink); font-size: 19px; }
.admin-create-patient-search__input input:focus { border-color: var(--action-blue); outline: 3px solid rgba(0, 102, 204, .2); outline-offset: 2px; }
.admin-create-patient-search__input .button { min-height: 64px; border-radius: 9999px; font-size: 19px; }
.admin-create-patient-search__status { min-height: 1.5em; margin: 14px 0; color: var(--muted); font-size: 15px; }
.admin-create-patient-results { display: grid; gap: 9px; }
.admin-create-patient-result { display: grid; width: 100%; gap: 5px; padding: 14px 16px; border: 1px solid #cfdbd8; border-radius: 14px; background: white; color: var(--ink); text-align: left; cursor: pointer; }
.admin-create-patient-result:hover, .admin-create-patient-result:focus-visible { border-color: var(--green); background: var(--green-soft); outline: 0; }
.admin-create-patient-result strong { display: flex; flex-wrap: wrap; gap: 10px; font-size: 17px; }
.admin-create-patient-result strong > span:first-child { color: var(--green-deep); font-family: Arial, sans-serif; }
.admin-create-patient-result small { color: var(--muted); font-size: 13px; }
.admin-create-patient-result em { color: var(--green-deep); font-size: 13px; font-style: normal; font-weight: 700; }
.admin-create-search-actions { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 12px; margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.admin-create-search-actions.is-past-entry { grid-template-columns: 1fr; }
.admin-create-search-actions > .button, .admin-create-search-actions .admin-create-block__form .button { min-height: 56px; font-size: 17px; }
.admin-create-new-from-search { width: 100%; border-color: var(--action-blue); color: var(--action-blue); }
.admin-create-new-from-search:hover { background: rgba(0, 102, 204, .07); }
.admin-create-selected-patient { margin-bottom: 16px; padding: 16px 18px; border: 1px solid #c9d8d4; border-radius: 16px; background: #f1f7f5; }
.admin-create-selected-patient > div { display: grid; gap: 4px; }
.admin-create-selected-patient small { color: var(--muted); font-weight: 700; }
.admin-create-selected-patient strong { color: var(--ink); font-size: 21px; }
.admin-create-selected-patient > div > span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.admin-create-reschedule-comparison { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 14px; align-items: center; margin-bottom: 18px; }
.admin-create-reschedule-comparison[hidden] { display: none; }
.admin-create-reschedule-comparison > div { display: grid; gap: 5px; min-height: 88px; align-content: center; padding: 13px 16px; border-radius: 14px; }
.admin-create-reschedule-comparison .is-current { border: 1px solid #e2c7c4; background: #fff4f2; }
.admin-create-reschedule-comparison .is-new { border: 1px solid #b8d7c9; background: #eff9f4; }
.admin-create-reschedule-comparison small { color: var(--muted); font-size: 12px; font-weight: 700; }
.admin-create-reschedule-comparison strong { color: var(--ink); font-size: 17px; }
.admin-create-reschedule-comparison > span { color: var(--green-deep); font-size: 22px; font-weight: 700; }
.admin-create-past-profile-note { margin: 0 0 18px; padding: 11px 14px; border-radius: 12px; background: #fff7df; color: #75520d; font-size: 14px; font-weight: 700; }
.admin-create-profile-confirm-form > .button { margin-top: 4px; }
.admin-name-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; min-width: 0; margin: 0; padding: 0; border: 0; }
.admin-name-fields legend { grid-column: 1 / -1; width: 100%; padding: 0; }
.admin-name-fields label { display: grid !important; grid-template-columns: auto 1fr; gap: 10px; align-items: center; margin: 0 !important; }
.admin-name-fields label span { min-width: 2em; font-size: 15px; font-weight: 700; }
.admin-patient-number-lookup { position: relative; }
.admin-patient-lookup__status { display: block; width: fit-content; padding: 0; border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 12px; font-weight: 500; text-align: left; }
.admin-patient-lookup__status.is-actionable { color: #0066cc; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.admin-patient-lookup__status.is-actionable:focus-visible { border-radius: 4px; outline: 3px solid rgba(0,102,204,.25); outline-offset: 3px; }
.admin-patient-suggestions { position: fixed; z-index: 1000; max-height: min(360px, 45dvh); padding: 6px; overflow-y: auto; border: 1px solid #bdcbc7; border-radius: 12px; background: white; box-shadow: 0 16px 38px rgba(23,43,41,.2); }
.admin-patient-suggestions[hidden] { display: none; }
.admin-patient-suggestions button { display: grid; width: 100%; gap: 3px; padding: 11px 13px; border: 0; border-radius: 8px; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.admin-patient-suggestions button + button { border-top: 1px solid #e5ebe9; }
.admin-patient-suggestions button:hover,
.admin-patient-suggestions button.is-active { background: var(--green-soft); }
.admin-patient-suggestions strong { font-size: 15px; }
.admin-patient-suggestions small { overflow-wrap: anywhere; color: var(--muted); font-size: 12px; }
.treatment-autocomplete { position: relative; min-width: 0; flex: 1; }
.treatment-autocomplete > input { width: 100%; box-sizing: border-box; }
.treatment-suggestions { position: fixed; z-index: 1002; max-height: min(340px, 42dvh); padding: 6px; overflow-y: auto; border: 1px solid #bdcbc7; border-radius: 12px; background: white; box-shadow: 0 16px 38px rgba(23,43,41,.22); }
.treatment-suggestions[hidden] { display: none; }
.treatment-suggestions button { display: grid; width: 100%; gap: 2px; padding: 11px 13px; border: 0; border-radius: 8px; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.treatment-suggestions button + button { border-top: 1px solid #e5ebe9; }
.treatment-suggestions button:hover,
.treatment-suggestions button.is-active { background: var(--green-soft); }
.treatment-suggestions strong { font-size: 16px; }
.treatment-suggestions small { overflow-wrap: anywhere; color: var(--muted); font-size: 11px; }
.treatment-mobile-picker { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; overflow: hidden; border: 0; background: white; color: var(--ink); }
.treatment-mobile-picker::backdrop { background: rgba(23,43,41,.4); }
.treatment-mobile-picker__surface { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100%; background: #f5f7f6; }
.treatment-mobile-picker__header { display: flex; gap: 18px; align-items: center; justify-content: space-between; padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 15px max(18px, env(safe-area-inset-left)); border-bottom: 1px solid #d8e1de; background: rgba(255,255,255,.97); }
.treatment-mobile-picker__header p { margin: 0 0 2px; color: var(--action-blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.treatment-mobile-picker__header h2 { margin: 0; font-size: clamp(22px, 4.8vw, 30px); }
.treatment-mobile-picker__close { min-width: 78px; min-height: 48px; padding: 8px 17px; border: 2px solid var(--action-blue); border-radius: 9999px; background: white; color: var(--action-blue); font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.treatment-mobile-picker__body { min-height: 0; padding: 14px max(14px, env(safe-area-inset-right)) 22px max(14px, env(safe-area-inset-left)); overflow-y: auto; overscroll-behavior: contain; }
.treatment-mobile-picker__help { margin: 0 2px 12px; color: var(--muted); font-size: 14px; font-weight: 700; }
.treatment-mobile-picker__free-text, .treatment-mobile-picker__option { display: flex; width: 100%; gap: 12px; align-items: center; justify-content: space-between; min-height: 68px; padding: 13px 16px; border: 1px solid #cbd8d4; border-radius: 15px; background: white; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.treatment-mobile-picker__free-text { margin-bottom: 12px; border-color: #8bb7df; color: var(--action-blue); }
.treatment-mobile-picker__free-text strong, .treatment-mobile-picker__option strong { display: block; font-size: 18px; line-height: 1.35; }
.treatment-mobile-picker__free-text small, .treatment-mobile-picker__option small { display: block; margin-top: 3px; overflow-wrap: anywhere; color: var(--muted); font-size: 12px; line-height: 1.45; }
.treatment-mobile-picker__list { display: grid; gap: 8px; }
.treatment-mobile-picker__option.is-selected { border-color: var(--action-blue); background: #eaf4ff; box-shadow: inset 0 0 0 1px var(--action-blue); }
.treatment-mobile-picker__check { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; border: 2px solid #aebbb7; border-radius: 50%; color: transparent; font-size: 18px; font-weight: 900; }
.treatment-mobile-picker__option.is-selected .treatment-mobile-picker__check { border-color: var(--action-blue); background: var(--action-blue); color: white; }
.treatment-mobile-picker__footer { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 9px; align-items: center; padding: 12px max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); border-top: 1px solid #d8e1de; background: rgba(255,255,255,.98); box-shadow: 0 -10px 28px rgba(23,43,41,.08); }
.treatment-mobile-picker__footer > div { display: grid; gap: 2px; min-width: 0; }
.treatment-mobile-picker__summary { color: var(--green-deep); font-size: 13px; font-weight: 800; }
.treatment-mobile-picker__notice { color: var(--danger); font-size: 11px; font-weight: 700; }
.treatment-mobile-picker__clear { min-height: 48px; padding: 8px 12px; border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.treatment-mobile-picker__clear:disabled { opacity: .4; cursor: default; }
.treatment-mobile-picker__done { min-width: 96px; min-height: 52px; border-radius: 9999px; font-size: 17px; }
.has-treatment-mobile-picker { overflow: hidden; }
@media (max-width: 560px) {
  .treatment-mobile-picker__footer { grid-template-columns: minmax(0, 1fr) auto; }
  .treatment-mobile-picker__footer > div { grid-column: 1 / -1; grid-row: 1; }
  .treatment-mobile-picker__clear { grid-column: 1; grid-row: 2; justify-self: start; }
  .treatment-mobile-picker__done { grid-column: 2; grid-row: 2; }
}
.admin-create-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, auto); gap: 14px; align-items: stretch; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
body.admin-page .admin-create-actions.is-past-entry { grid-template-columns: 1fr; }
.admin-create-actions > .button { min-height: 54px; padding: 0 24px; font-size: 17px; white-space: nowrap; }
.admin-create-block { min-width: 0; }
.admin-create-block__form { display: grid; gap: 10px; margin: 0; }
.admin-create-block__form .button { width: 100%; min-height: 54px; padding: 0 24px; font-size: 17px; line-height: 1.3; white-space: normal; }
.admin-create-past-notice { grid-column: 1 / -1; margin: 0; padding: 11px 14px; border-top: 1px solid #c9d8d4; background: #fff7df; color: #75520d; font-size: 14px; font-weight: 700; line-height: 1.6; }
.admin-info-dialog { width: min(620px, calc(100% - 32px)); }
.admin-day-schedule-dialog { width: min(1200px, calc(100% - 24px)); padding: clamp(28px, 3vw, 44px); }
.admin-day-schedule-dialog .admin-panel__heading h2 { font-size: clamp(27px, 2vw, 34px); }
.admin-day-schedule-dialog > p { margin-bottom: 18px; font-size: 15px !important; }
.admin-day-schedule-dialog__actions { display: flex; flex: 0 0 auto; gap: 10px; align-items: center; }
.admin-day-schedule-dialog__actions form { margin: 0; }
.admin-day-schedule-dialog__actions .button,
.admin-day-schedule-dialog__actions .admin-dialog-close { min-width: 88px; min-height: 46px; }
.schedule-override-toolbar { position: relative; display: flex; gap: 14px; align-items: center; justify-content: flex-end; margin: 0 0 16px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px; background: #f8faf9; }
.schedule-period-status { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.schedule-period-status span { padding: 6px 10px; border-radius: 9999px; font-size: 13px; font-weight: 700; }
.schedule-period-status .is-open { background: var(--green-soft); color: var(--green-dark); }
.schedule-reservation-conflict-warning { display: grid; gap: 5px; margin-top: 12px; padding: 13px 15px; border: 1px solid #ef9c92; border-radius: 12px; background: #fff0ee; color: #9b2d24; }
.schedule-reservation-conflict-warning strong { font-size: 15px; }
.schedule-reservation-conflict-warning span { font-size: 12px; font-weight: 800; }
.schedule-reservation-conflict-warning p { margin: 0; color: #7f2c25; font-size: 12px; font-weight: 700; line-height: 1.65; }
.schedule-settings-conflict-note { display: grid; gap: 4px; margin: 16px 0; padding: 13px 15px; border-left: 5px solid #d84a3f; border-radius: 10px; background: #fff0ee; color: #8f2c24; }
.schedule-settings-conflict-note strong { font-size: 14px; }
.schedule-settings-conflict-note span { font-size: 12px; line-height: 1.65; }
.schedule-period-status .is-closed { background: var(--danger-soft); color: var(--danger); }
.schedule-closure-remove-form { margin: 0; }
.schedule-closure-remove-form .button { min-height: 40px; white-space: nowrap; }
.schedule-override-popover { position: relative; flex: 0 0 auto; }
.schedule-override-popover > summary { min-height: 40px; list-style: none; cursor: pointer; }
.schedule-override-popover > summary::-webkit-details-marker { display: none; }
.schedule-override-popover[open] > summary { background: var(--green); color: white; }
.schedule-override-popover__panel { position: absolute; z-index: 12; top: calc(100% + 9px); right: 0; width: min(650px, calc(100vw - 64px)); padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 18px 45px rgba(23,43,41,.22); }
.schedule-override-popover__heading { display: flex; gap: 20px; align-items: start; justify-content: space-between; margin-bottom: 12px; }
.schedule-override-popover__heading h3 { margin: 2px 0 0; font-size: 19px; }
.schedule-override-popover__heading > small { color: var(--muted); font-size: 10px; }
.schedule-override-groups { display: grid; gap: 10px; }
.schedule-override-group { display: grid; grid-template-columns: minmax(170px, 1fr) auto; gap: 16px; align-items: center; padding: 12px; border-radius: 10px; background: white; }
.schedule-override-group h4 { margin: 0 0 2px; font-size: 13px; }
.schedule-override-group p { margin: 0; color: var(--muted); font-size: 10px; }
.schedule-override-actions { display: flex; gap: 7px; }
.schedule-override-actions form { margin: 0; }
.schedule-override-group--close .button { border-color: #d8aaa5; color: var(--danger); }
.schedule-override-group--close .button:hover { background: var(--danger-soft); }
.schedule-override-reset { margin: 10px 0 0; text-align: right; }
.schedule-override-reset .text-link { border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 11px; text-decoration: underline; cursor: pointer; }
.admin-day-schedule-calendar { max-height: min(68vh, 760px); overflow-y: auto; }
.admin-day-schedule-calendar .day-calendar__row > div { min-width: 0; }
.admin-day-schedule-calendar .day-calendar__row { grid-template-columns: 112px 1fr; min-height: 74px; }
.admin-day-schedule-calendar .day-calendar__row time { font-size: 19px; }
.admin-day-schedule-calendar .day-calendar__row > div { gap: 11px; padding: 12px 18px; }
.admin-day-schedule-calendar .calendar-reservation { padding: 9px 12px; font-size: 16px; }
.admin-day-schedule-calendar .calendar-unavailable { font-size: 14px; }
.admin-day-schedule-calendar .calendar-add { font-size: 15px; }
.admin-modal-dialog::backdrop { background: rgba(23, 43, 41, .58); backdrop-filter: blur(3px); }
.admin-modal-dialog[open] { animation: admin-dialog-in .16s ease-out; }
.admin-modal-dialog .admin-panel__heading form { margin: 0; }
.admin-dialog-close { min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--green); font: inherit; font-size: 12px; white-space: nowrap; cursor: pointer; }
.admin-dialog-close:hover { background: var(--green-soft); }
.admin-dialog-close:focus-visible { outline: 3px solid rgba(49, 92, 89, .24); outline-offset: 2px; }
@keyframes admin-dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
.admin-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
.admin-form-grid .field--wide { grid-column: 1 / -1; }
.admin-form-grid .field label { display: block; margin-bottom: 5px; font-size: 11px; }
.admin-form-grid > .button { grid-column: 1 / -1; justify-self: end; }
.admin-patient-detail { width: min(920px, calc(100% - 32px)); border-color: rgba(49, 92, 89, .3); }
.admin-patient-detail .admin-panel__heading { align-items: center; }
.admin-patient-detail .admin-panel__heading h2 { font-size: clamp(27px, 2.2vw, 34px); }
.admin-patient-detail__header-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; justify-content: flex-end; }
.admin-patient-detail__header-actions > form { margin: 0; }
.admin-patient-detail__header-actions .button, .admin-patient-detail__header-actions .admin-dialog-close { min-height: 46px; padding-inline: 16px; font-size: 14px; }
.admin-patient-detail__header-actions .button--dark, .admin-patient-detail__header-actions .button--danger { color: white; }
.admin-patient-edit-dialog { width: min(760px, calc(100% - 32px)); max-height: calc(100dvh - 32px); }
.admin-patient-edit-dialog .admin-panel__heading h2 { font-size: clamp(25px, 2vw, 32px); }
.admin-patient-edit-dialog .admin-panel__heading p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.admin-patient-edit-form { margin-top: 18px; }
.admin-patient-edit-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.admin-patient-edit-fields .field--wide { grid-column: 1 / -1; }
.admin-patient-edit-fields .field > label, .admin-patient-edit-fields .admin-name-fields legend { display: block; margin-bottom: 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.admin-patient-edit-fields input { min-height: 52px; padding: 11px 13px; font-size: 17px; }
.admin-patient-edit-fields .field > small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.admin-patient-edit-actions { display: flex; justify-content: flex-end; margin-top: 22px; }
.admin-patient-edit-actions .button { min-height: 52px; font-size: 16px; }
.admin-patient-profile-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 18px; margin: 24px 0; }
.admin-patient-profile-fields .field--wide { grid-column: 1 / -1; }
.admin-patient-profile-fields .field > label,
.admin-patient-profile-fields .admin-detail-name-fields legend,
.admin-patient-profile-label { display: block; margin-bottom: 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.admin-patient-detail .admin-patient-profile-fields input,
.admin-patient-detail .admin-patient-log-summary input { min-height: 52px; padding: 11px 13px; border-radius: 9999px; background: white; font-size: 17px; }
.admin-patient-profile-fields input[readonly],
.admin-patient-log-summary input[readonly] { color: var(--ink); cursor: default; }
.admin-patient-profile-fields input[readonly]:focus,
.admin-patient-log-summary input[readonly]:focus { border-color: rgba(0,0,0,.16); outline: none; }
.admin-patient-profile-readonly { display: flex; min-width: 0; flex-direction: column; }
.admin-patient-profile-readonly .admin-patient-profile-value { margin-top: auto; }
.admin-create-profile-fields .admin-patient-profile-readonly .admin-patient-profile-value { margin-top: 0; }
.admin-patient-profile-number { display: flex; min-width: 0; flex-direction: column; }
.admin-patient-profile-number > input { margin-top: auto; }
.admin-patient-profile-value { display: grid; align-content: center; min-width: 0; min-height: 52px; padding: 11px 13px; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 9999px; background: white; font-size: 17px; }
.admin-patient-profile-value a { color: var(--green); }
.admin-reservation-attribute-tags { display: flex; flex-wrap: wrap; gap: 3px; align-content: center; align-items: center; padding: 9px 5px; }
.admin-reservation-attribute { display: inline-flex; min-height: 28px; gap: 3px; align-items: center; padding: 4px 5px; border: 1px solid #b8c8d8; border-radius: 9999px; background: #f0f5fb; color: #355a82; font-size: 11px; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.admin-reservation-attribute small { color: inherit; font-size: 9px; font-weight: 500; }
.admin-reservation-attribute--unpaid { border-color: #e0aaa5; background: #ffebe8; color: #a7322b; }
.admin-reservation-attribute--lab-work { border-color: #9fc5bb; background: #e6f3ef; color: #28665d; }
.admin-patient-profile-fields .admin-detail-name-fields label { grid-template-columns: 42px minmax(0, 1fr); }
.admin-patient-profile-fields .admin-detail-name-fields label span { display: grid; width: 42px; height: 42px; min-width: 42px; place-items: center; border-radius: 50%; background: #f5f5f7; color: var(--action-blue); font-size: 17px; }
.admin-patient-profile-number__heading { display: flex; flex-wrap: wrap; gap: 5px 8px; align-items: baseline; margin-bottom: 8px; }
.admin-patient-profile-fields .admin-patient-profile-number__heading > label { margin-bottom: 0; }
.admin-patient-profile-number__heading .text-link { color: var(--muted); font-size: 12px; font-weight: 400; text-align: left; }
.admin-patient-profile-number__heading .text-link:hover { color: var(--action-blue); }
.admin-patient-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; margin: 24px 0; }
.admin-patient-summary--secondary { margin-top: 0; }
.admin-patient-summary > div { min-width: 0; padding: 0; background: white; }
.admin-patient-summary dt { margin-bottom: 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.admin-patient-summary dd { display: grid; align-content: center; min-width: 0; min-height: 52px; margin: 0; padding: 11px 13px; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfb; font-size: 17px; }
.admin-patient-summary dd strong { font-size: 17px; }
.admin-patient-summary dd small { color: var(--muted); font-size: 12px; }
.admin-patient-summary a { color: var(--green); }
.admin-patient-summary dd.admin-family-profile-links { display: flex; flex-wrap: wrap; gap: 8px; align-content: center; align-items: center; }
.admin-family-profile-link { display: inline-flex; min-height: 40px; align-items: center; padding: 7px 14px; border: 1px solid #b9ccdc; border-radius: 999px; background: white; color: var(--action-blue) !important; font-size: 15px; font-weight: 700; line-height: 1.35; text-decoration: none; }
.admin-family-profile-link:hover { border-color: var(--action-blue); background: #f1f7fc; }
.admin-family-profile-link.is-current { border-color: var(--action-blue); background: #e4f1fb; box-shadow: inset 0 0 0 1px var(--action-blue); }
.admin-family-profile-link:focus-visible { outline: 3px solid rgba(0, 102, 204, .24); outline-offset: 2px; }
.admin-next-treatment-card { margin: 22px 0; padding: 0; border: 0; background: white; }
.admin-next-treatment-card form { margin: 0; }
.admin-next-treatment-card label { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; font-size: 15px; font-weight: 700; }
.admin-next-treatment-card label small { color: var(--muted); font-size: 12px; font-weight: 400; }
.admin-next-treatment-card form > div { display: flex; gap: 10px; }
.admin-next-treatment-card input { min-width: 0; min-height: 52px; flex: 1; padding: 11px 13px; font-size: 17px; }
.admin-next-treatment-card .button { min-width: 100px; min-height: 52px; flex: 0 0 auto; font-size: 16px; }
.admin-treatment-notice-dialog { width: min(1480px, calc(100vw - 32px)); max-width: none; height: calc(100dvh - 32px); max-height: none; margin: auto; padding: 0; overflow: hidden; border: 0; border-radius: 18px; background: #fff; box-shadow: 0 20px 60px rgba(23, 43, 41, .3); }
.admin-treatment-notice-dialog::backdrop { background: rgba(23, 43, 41, .55); backdrop-filter: blur(2px); }
.admin-treatment-notice-dialog__heading { display: flex; min-height: 72px; gap: 18px; align-items: center; justify-content: space-between; padding: 9px 16px 9px 22px; border-bottom: 1px solid var(--line); }
.admin-treatment-notice-dialog__kicker { margin: 0 0 3px; color: var(--action-blue); font-size: 11px; font-weight: 800; letter-spacing: .05em; }
.admin-treatment-notice-dialog__heading h2 { margin: 0; font-size: 22px; }
.admin-treatment-notice-dialog__heading form { margin: 0; }
.admin-treatment-notice-dialog iframe { display: block; width: 100%; height: calc(100% - 72px); border: 0; background: #edf1ef; }
.admin-card-image-dialog { width: min(1000px, calc(100% - 32px)); max-height: calc(100dvh - 32px); }
.admin-card-image-dialog .admin-panel__heading h2 { font-size: clamp(25px, 2vw, 32px); }
.admin-card-image-dialog .admin-panel__heading p { margin: 3px 0 0; color: var(--muted); font-size: 14px; }
.admin-card-image-viewer { display: grid; gap: 10px; margin: 18px 0 0; }
.admin-card-image-viewer > a { display: grid; min-height: 240px; max-height: calc(100dvh - 210px); overflow: auto; place-items: center; border: 1px solid var(--line); border-radius: 12px; background: #f8faf9; }
.admin-card-image-viewer img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 220px); object-fit: contain; }
.admin-card-image-viewer figcaption { display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: space-between; color: var(--muted); font-size: 13px; }
.admin-card-image-viewer figcaption a { color: var(--action-blue); font-weight: 700; }
.admin-treatment-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: stretch; padding: 20px; border: 1px solid var(--line); border-radius: 13px; background: #f8faf9; }
.admin-treatment-card__heading { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; justify-content: space-between; }
.admin-treatment-card h3 { margin: 0; font-size: 22px; line-height: 1.45; }
.admin-treatment-card__status { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: flex-end; margin-left: auto; }
.admin-treatment-card__status > span { color: var(--muted); font-size: 13px; }
.admin-reservation-markers { display: inline-flex; flex: 0 0 auto; gap: 6px; align-items: center; }
.admin-reservation-marker-form { margin: 0; }
.admin-reservation-marker { display: grid; width: 38px; height: 38px; padding: 0; place-items: center; border: 2px solid currentColor; border-radius: 50%; background: white; color: #356b68; font: inherit; font-size: 17px; font-weight: 800; line-height: 1; opacity: .34; cursor: pointer; transition: opacity .15s ease, background-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.admin-reservation-marker--payment_unpaid { color: #b43e35; }
.admin-reservation-marker--treatment_complete { color: #1767a3; }
.admin-reservation-marker:hover { opacity: .62; transform: translateY(-1px); }
.admin-reservation-marker.is-active { background: #e3f1ed; box-shadow: 0 0 0 2px rgba(49, 92, 89, .14); opacity: 1; }
.admin-reservation-marker--payment_unpaid.is-active { background: #ffebe8; box-shadow: 0 0 0 2px rgba(180, 62, 53, .13); }
.admin-reservation-marker--treatment_complete.is-active { background: #e6f2fb; box-shadow: 0 0 0 2px rgba(23, 103, 163, .14); }
.admin-reservation-marker:focus-visible { outline: 3px solid rgba(197, 156, 88, .55); outline-offset: 2px; opacity: 1; }
.admin-treatment-card > *, .admin-treatment-form { min-width: 0; }
.admin-treatment-form { margin: 0; }
.admin-treatment-form > .admin-treatment-input-row { display: flex; gap: 8px; }
.admin-treatment-form input { min-width: 0; min-height: 52px; flex: 1; padding: 11px 13px; font-size: 17px; }
.admin-treatment-form .button { min-width: 100px; min-height: 52px; flex: 0 0 auto; font-size: 16px; }
.treatment-tooth-control { display: flex; min-width: 0; gap: 8px; align-items: stretch; }
.treatment-tooth-control > input { min-width: 0; flex: 1; }
.tooth-chart-field { min-width: 0; }
.tooth-picker { min-width: 0; flex: 0 0 190px; }
.tooth-picker__trigger { display: grid; width: 100%; min-width: 0; min-height: 52px; padding: 7px 12px; align-content: center; border: 1px solid rgba(49, 92, 89, .35); border-radius: 10px; background: white; color: var(--green-dark); font: inherit; text-align: left; cursor: pointer; }
.tooth-picker__trigger:hover { border-color: var(--green); background: var(--green-soft); }
.tooth-picker__trigger:focus-visible { outline: 3px solid rgba(197, 156, 88, .45); outline-offset: 2px; }
.tooth-picker__trigger strong { min-width: 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.tooth-picker__trigger strong.is-placeholder { color: var(--muted); font-size: 16px; font-weight: 400; }
.palmer-notation { display: inline-flex; max-width: 100%; gap: .45em; align-items: center; color: inherit; font-family: Arial, "Noto Sans", sans-serif; line-height: 1; vertical-align: -.18em; white-space: nowrap; }
.palmer-group { display: inline-flex; box-sizing: border-box; flex: 0 0 auto; color: inherit; border-color: currentColor; border-style: solid; border-width: 0; }
.palmer-group__teeth { display: inline-flex; gap: .38em; align-items: center; line-height: 1; }
.palmer-group--top-left { padding: .22em .2em 0 .28em; border-top-width: .12em; border-left-width: .12em; }
.palmer-group--top-right { padding: .22em .28em 0 .2em; border-top-width: .12em; border-right-width: .12em; }
.palmer-group--bottom-left { padding: 0 .2em .22em .28em; border-bottom-width: .12em; border-left-width: .12em; }
.palmer-group--bottom-right { padding: 0 .28em .22em .2em; border-right-width: .12em; border-bottom-width: .12em; }
.admin-treatment-tooth { display: inline-flex; gap: .12em; align-items: baseline; white-space: nowrap; }
.admin-treatment-tooth .palmer-notation { font-size: .94em; }
.tooth-chart-dialog { width: min(660px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; border: 0; border-radius: 18px; box-shadow: 0 24px 70px rgba(23, 43, 41, .3); }
.tooth-chart-dialog::backdrop { background: rgba(23, 43, 41, .58); backdrop-filter: blur(3px); }
.tooth-chart-dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px 12px; }
.tooth-chart-dialog > header span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.tooth-chart-dialog > header h3 { margin: 2px 0 0; color: var(--ink); font-size: 22px; }
.tooth-chart-dialog > header button { min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9999px; background: white; color: var(--green); font: inherit; font-size: 12px; cursor: pointer; }
.tooth-chart-dialog__help { margin: 0; padding: 0 20px 14px; color: var(--muted); font-size: 12px; }
.tooth-chart { min-width: 0; margin-top: 12px; overflow: hidden; border: 1px solid rgba(49, 92, 89, .25); border-radius: 12px; background: white; }
.tooth-chart > summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 48px; padding: 9px 12px; color: var(--green-dark); cursor: pointer; list-style: none; }
.tooth-chart > summary::-webkit-details-marker { display: none; }
.tooth-chart > summary::after { content: "＋"; grid-column: 3; grid-row: 1 / span 2; font-size: 20px; font-weight: 400; }
.tooth-chart[open] > summary::after { content: "−"; }
.tooth-chart > summary > span { align-self: end; color: var(--muted); font-size: 9px; font-weight: 700; }
.tooth-chart > summary > strong { min-width: 0; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.tooth-chart > summary > small { grid-column: 1 / 3; color: var(--muted); font-size: 9px; }
.tooth-chart__notice { color: var(--danger); font-weight: 700; }
.tooth-chart > summary:focus-visible { outline: 3px solid rgba(197, 156, 88, .45); outline-offset: -3px; }
.tooth-chart__panel { width: 100%; max-width: 100%; overflow-x: auto; padding: 14px; border-top: 1px solid var(--line); background: #fbfcfb; }
.tooth-chart-dialog .tooth-chart__panel { max-height: calc(100dvh - 145px); overflow: auto; }
.tooth-diagram { position: relative; width: 560px; min-width: 560px; height: 640px; margin: 0 auto 12px; overflow: hidden; border: 1px solid rgba(49, 92, 89, .16); border-radius: 14px; background: white; color: #3f4a48; }
.tooth-diagram__axis { position: absolute; z-index: 0; display: block; background: #687673; pointer-events: none; }
.tooth-diagram__axis--vertical { top: 28px; bottom: 28px; left: 50%; width: 1px; }
.tooth-diagram__axis--horizontal { top: 50%; right: 20px; left: 20px; height: 1px; }
.tooth-diagram__direction { position: absolute; z-index: 2; display: grid; min-width: 28px; min-height: 28px; place-items: center; background: white; color: #34423f; font-size: 22px; line-height: 1; pointer-events: none; }
.tooth-diagram__direction--upper { top: 8px; left: 50%; transform: translateX(-50%); }
.tooth-diagram__direction--lower { bottom: 8px; left: 50%; transform: translateX(-50%); }
.tooth-diagram__direction--right { top: 50%; left: 5px; transform: translateY(-50%); }
.tooth-diagram__direction--left { top: 50%; right: 5px; transform: translateY(-50%); }
.tooth-option { position: absolute; z-index: 1; display: grid; width: 52px; height: var(--tooth-size); min-height: 0; padding: 0; place-items: center; border: 1px solid transparent; border-radius: 999px; background: transparent; color: #53615e; font: inherit; cursor: default; }
.tooth-option--patient-right { left: var(--tooth-offset); }
.tooth-option--patient-left { right: var(--tooth-offset); }
.tooth-option--upper { top: var(--tooth-axis); }
.tooth-option--lower { bottom: var(--tooth-axis); }
.tooth-option--upper.tooth-option--patient-right { transform: translate(-50%, -50%); }
.tooth-option--upper.tooth-option--patient-left { transform: translate(50%, -50%); }
.tooth-option--lower.tooth-option--patient-right { transform: translate(-50%, 50%); }
.tooth-option--lower.tooth-option--patient-left { transform: translate(50%, 50%); }
.tooth-option--permanent.tooth-option--position-1 { --tooth-offset: 246px; --tooth-axis: 59px; --tooth-size: 29px; }
.tooth-option--permanent.tooth-option--position-2 { --tooth-offset: 214px; --tooth-axis: 72px; --tooth-size: 33px; }
.tooth-option--permanent.tooth-option--position-3 { --tooth-offset: 181px; --tooth-axis: 94px; --tooth-size: 37px; }
.tooth-option--permanent.tooth-option--position-4 { --tooth-offset: 145px; --tooth-axis: 124px; --tooth-size: 43px; }
.tooth-option--permanent.tooth-option--position-5 { --tooth-offset: 112px; --tooth-axis: 162px; --tooth-size: 47px; }
.tooth-option--permanent.tooth-option--position-6 { --tooth-offset: 84px; --tooth-axis: 202px; --tooth-size: 50px; }
.tooth-option--permanent.tooth-option--position-7 { --tooth-offset: 65px; --tooth-axis: 246px; --tooth-size: 52px; }
.tooth-option--permanent.tooth-option--position-8 { --tooth-offset: 57px; --tooth-axis: 292px; --tooth-size: 54px; }
.tooth-option--primary.tooth-option--position-1 { --tooth-offset: 244px; --tooth-axis: 164px; --tooth-size: 28px; }
.tooth-option--primary.tooth-option--position-2 { --tooth-offset: 216px; --tooth-axis: 180px; --tooth-size: 30px; }
.tooth-option--primary.tooth-option--position-3 { --tooth-offset: 191px; --tooth-axis: 205px; --tooth-size: 33px; }
.tooth-option--primary.tooth-option--position-4 { --tooth-offset: 170px; --tooth-axis: 238px; --tooth-size: 37px; }
.tooth-option--primary.tooth-option--position-5 { --tooth-offset: 159px; --tooth-axis: 276px; --tooth-size: 41px; }
button.tooth-option { cursor: pointer; }
button.tooth-option:hover { background: rgba(220, 235, 231, .72); color: var(--green-dark); }
.tooth-option.is-selected { background: var(--green-soft); color: var(--green-dark); box-shadow: 0 0 0 2px rgba(49, 92, 89, .32); }
.tooth-option:focus-visible { outline: 3px solid rgba(197, 156, 88, .5); outline-offset: 1px; }
.tooth-option__image { width: var(--tooth-size); height: var(--tooth-size); overflow: visible; }
.tooth-option__image ellipse, .tooth-option__image path { stroke: currentColor; vector-effect: non-scaling-stroke; }
.tooth-option__outline { fill: white; stroke-width: 1.5; }
.tooth-option__center { fill: white; stroke-width: 1.25; }
.tooth-option__grooves { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1; }
.tooth-option.is-selected .tooth-option__outline { fill: #cfe5df; stroke-width: 2.2; }
.tooth-option.is-selected .tooth-option__center { fill: white; stroke-width: 1.8; }
.tooth-option__number { position: absolute; top: 50%; font: 700 14px Arial, sans-serif; line-height: 1; transform: translateY(-50%); }
.tooth-option--patient-right .tooth-option__number { right: calc(100% + 1px); }
.tooth-option--patient-left .tooth-option__number { left: calc(100% + 1px); }
.tooth-option--primary .tooth-option__number { font-size: 13px; }
.tooth-chart__footer { display: flex; min-width: 560px; align-items: center; justify-content: space-between; gap: 15px; padding-top: 10px; border-top: 1px solid var(--line); }
.tooth-chart__footer > span { color: var(--green-dark); font-size: 12px; font-weight: 700; }
.tooth-chart__clear { flex: 0 0 auto; padding: 6px 8px; border: 0; background: transparent; color: var(--green); font: inherit; font-size: 10px; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.tooth-chart__clear:focus-visible { outline: 3px solid rgba(197, 156, 88, .45); outline-offset: 2px; }
.tooth-chart__done { min-width: 100px; }
.tooth-chart.is-readonly { margin: 0; }
.tooth-chart.is-readonly > summary { min-height: 40px; padding: 5px 9px; }
.tooth-chart.is-readonly .tooth-chart__footer { justify-content: flex-start; }
.admin-reservation-action-dialog { width: min(1120px, calc(100% - 32px)); max-height: calc(100dvh - 32px); }
.admin-reservation-action-dialog .admin-panel__heading p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.admin-reservation-action-dialog--cancel { width: min(560px, calc(100% - 32px)); }
.admin-cancel-confirmation { display: grid; gap: 5px; margin: 20px 0; padding: 20px; border-radius: 12px; background: #fff7e8; }
.admin-cancel-confirmation strong { font-size: 22px; }
.admin-cancel-confirmation span { color: var(--muted); font-size: 12px; }
.admin-cancel-confirmation p { margin: 12px 0 0; font-size: 15px; }
.admin-detail-reschedule-form { display: block; min-width: 0; }
.admin-reschedule-calendar { margin-top: 12px; }
.admin-reschedule-calendar .weekly-booking__heading h4 { margin: 0; font-size: 18px; }
.admin-reschedule-calendar .weekly-slot-grid { max-height: min(58vh, 720px); overflow-y: auto; }
.admin-reschedule-calendar .weekly-slot-grid__corner,
.admin-reschedule-calendar .weekly-slot-grid__date { position: sticky; z-index: 2; top: 0; }
.admin-reschedule-calendar .weekly-slot-grid__corner { z-index: 3; }
.weekly-slot-cell.is-current { background: #fff7e8; color: #8a641c; }
.weekly-slot-cell.is-current b { color: #8a641c; font-size: 13px; }
.weekly-slot-cell.is-current small { color: #8a641c; }
.admin-reschedule-selection { display: flex; gap: 18px; align-items: center; justify-content: space-between; margin-top: 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--parchment); }
.admin-reschedule-selection > div { display: grid; }
.admin-reschedule-selection small { color: var(--muted); font-size: 10px; }
.admin-reschedule-selection strong { font-size: 15px; }
.admin-detail-cancel-form { display: flex; justify-content: flex-end; margin: 0; }
.admin-patient-log-summary { display: grid; grid-template-columns: minmax(0, 2fr) minmax(150px, 1fr); gap: 18px; align-items: end; margin-top: 28px; }
.admin-patient-log-summary .field > label,
.admin-patient-log-count dt { display: block; margin-bottom: 8px; color: var(--ink); font-size: 15px; font-weight: 700; }
.admin-patient-log-count { margin: 0; }
.admin-patient-log-count dd { display: grid; align-content: center; min-height: 52px; margin: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfb; font-size: 17px; }
.admin-reservation-logs { margin-top: 14px; }
.admin-reservation-logs__heading { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; margin-bottom: 12px; }
.admin-reservation-logs__heading h3 { margin: 0; font-size: 22px; }
.admin-reservation-logs__heading span { color: var(--muted); font-size: 14px; }
.admin-reservation-logs__empty { margin: 0; padding: 18px; border: 1px dashed var(--line); border-radius: 12px; background: #f8faf9; color: var(--muted); font-size: 14px; line-height: 1.7; }
.admin-reservation-log { overflow: hidden; margin-top: 12px; border: 1px solid var(--line); border-radius: 12px; }
.admin-reservation-log.is-selected { border-color: var(--green); box-shadow: 0 0 0 2px rgba(49,92,89,.08); }
.admin-reservation-log > header { display: flex; gap: 20px; align-items: center; padding: 16px 18px; background: #f7f9f8; }
.admin-reservation-log > header > div { display: flex; gap: 9px; align-items: center; }
.admin-reservation-log__summary { min-width: 0; flex: 1; justify-content: space-between; }
.admin-reservation-log__meta { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: flex-end; }
.admin-reservation-log > header time { font-size: 18px; font-weight: 700; }
.admin-reservation-log > header small { color: var(--muted); font-size: 14px; }
.admin-reservation-log > dl { display: grid; grid-template-columns: 140px 1fr; gap: 12px; align-items: center; margin: 0; padding: 14px 18px; border-top: 1px solid var(--line); font-size: 17px; }
.admin-reservation-log > dl dt { color: var(--muted); font-size: 17px; }
.admin-reservation-log > dl dt label { cursor: pointer; }
.admin-reservation-log > dl dd { min-width: 0; margin: 0; font-weight: 700; }
.admin-history-treatment-form { display: flex; gap: 10px; align-items: center; margin: 0; }
.admin-history-treatment-form input[type="text"] { min-width: 0; min-height: 50px; flex: 1; padding: 10px 14px; font-size: 18px; }
.admin-history-treatment-form .button { min-width: 84px; min-height: 50px; flex: 0 0 auto; font-size: 16px; }
.admin-history-list { border-top: 1px solid var(--line); }
.admin-history-entry { display: grid; grid-template-columns: 190px 1fr; gap: 16px; padding: 14px 18px; border-top: 1px solid #edf1ef; }
.admin-history-list > .admin-history-entry:first-child { border-top: 0; }
.admin-history-entry > time { color: var(--muted); font-size: 14px; }
.admin-history-entry > div { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; }
.admin-history-list strong { font-size: 16px; }
.admin-history-list small { align-self: center; color: var(--muted); font-size: 14px; }
.admin-history-list span { grid-column: 1 / -1; color: var(--muted); font-size: 15px; line-height: 1.55; }
.admin-history-older { border-top: 1px solid #edf1ef; }
.admin-history-older > summary { display: flex; min-height: 48px; align-items: center; justify-content: center; padding: 10px 18px; color: var(--action-blue); font-size: 15px; font-weight: 700; cursor: pointer; list-style: none; }
.admin-history-older > summary::-webkit-details-marker { display: none; }
.admin-history-older > summary::after { content: "＋"; margin-left: 8px; font-size: 20px; line-height: 1; }
.admin-history-older[open] > summary::after { content: "−"; }
.admin-history-older > summary span { color: inherit; }
.admin-history-older__open { display: none; }
.admin-history-older[open] .admin-history-older__closed { display: none; }
.admin-history-older[open] .admin-history-older__open { display: inline; }
.settings-list { margin: 18px 0 0; }
.settings-list div { display: grid; grid-template-columns: 120px 1fr; gap: 15px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.settings-list dt { color: var(--muted); font-size: 11px; }
.settings-list dd { margin: 0; font-weight: 700; }
.settings-list > article { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 12px 0; border-bottom: 1px solid var(--line); }
.settings-list > article > div { display: grid; min-width: 0; grid-template-columns: 1fr; gap: 3px; padding: 0; border: 0; }
.settings-list > article span,
.settings-list > article small { color: var(--muted); }
.development-feature-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 18px; }
.development-feature-toggle { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #f8faf9; cursor: pointer; }
.development-feature-toggle > span { display: grid; gap: 3px; }
.development-feature-toggle strong { font-size: 13px; }
.development-feature-toggle small { color: var(--muted); font-size: 10px; }
.development-feature-toggle input[role="switch"] { position: relative; flex: 0 0 auto; width: 48px; height: 28px; margin: 0; appearance: none; border: 0; border-radius: 9999px; background: #b8bfbd; cursor: pointer; transition: background .15s ease; }
.development-feature-toggle input[role="switch"]::before { content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: white; transition: transform .15s ease; }
.development-feature-toggle input[role="switch"]:checked { background: var(--action-blue); }
.development-feature-toggle input[role="switch"]:checked::before { transform: translateX(20px); }
.development-feature-toggle input[role="switch"]:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 3px; }
.admin-debug-dialog { width: min(760px, calc(100% - 32px)); }
.debug-tools-warning { margin: 18px 0; padding: 16px 18px; border-left: 5px solid #d58b18; border-radius: 12px; background: #fff7df; color: #684600; }
.debug-tools-warning strong { display: block; margin-bottom: 5px; font-size: 15px; }
.debug-tools-warning p { margin: 0; font-size: 12px; line-height: 1.7; }
.debug-tools-status { margin-bottom: 20px; }
.debug-tools-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.debug-tools-actions form { margin: 0; }
.debug-tools-actions .button { width: 100%; min-height: 48px; padding: 9px 12px; white-space: normal; }
.debug-tools-actions .button:disabled { opacity: .45; cursor: not-allowed; }
.weekday-visibility-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: end; margin-top: 18px; }
.weekday-visibility-options { display: flex; min-width: 0; margin: 0; padding: 0; border: 0; gap: 8px; }
.weekday-visibility-options legend { margin-bottom: 8px; color: var(--muted); font-size: 10px; }
.weekday-visibility-options label { cursor: pointer; }
.weekday-visibility-options input { position: absolute; opacity: 0; pointer-events: none; }
.weekday-visibility-options span { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: #f4f5f3; color: var(--muted); font-size: 14px; font-weight: 700; }
.weekday-visibility-options input:checked + span { border-color: var(--action-blue); background: #eaf4ff; color: var(--action-blue); box-shadow: inset 0 0 0 1px var(--action-blue); }
.weekday-visibility-options input:focus-visible + span { outline: 2px solid var(--focus-blue); outline-offset: 3px; }
.compact-admin-form { display: grid; grid-template-columns: repeat(3, 1fr) auto; gap: 9px; align-items: end; margin-top: 18px; }
.compact-admin-form label { color: var(--muted); font-size: 9px; }
.compact-admin-form input, .compact-admin-form select { min-height: 42px; margin-top: 3px; }
.admin-simple-list { margin: 18px 0 0; padding: 0; list-style: none; }
.admin-simple-list li { display: flex; justify-content: space-between; gap: 15px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 11px; }
.admin-simple-list form { margin: 0; }
.audit-list { max-height: 330px; overflow-y: auto; }
.audit-list article { display: grid; grid-template-columns: 190px 190px minmax(0, 1fr); gap: 16px; padding: 16px 4px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.65; }
.audit-list time { color: var(--muted); font-size: 15px; }
.audit-list strong { font-size: 17px; overflow-wrap: anywhere; }
.audit-list span { color: var(--muted); font-size: 16px; overflow-wrap: anywhere; }
.admin-tool-section { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.admin-tool-section__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; }
.admin-tool-section__heading h3 { margin: 0; font-size: 17px; }
.admin-tool-section__heading span { color: var(--muted); font-size: 9px; }
.treatment-preset-dialog { width: min(1280px, calc(100% - 32px)); }
.treatment-preset-reorder { margin-top: 18px; padding: 14px 16px; border: 1px solid #c9d8d4; border-radius: 14px; background: #f8faf9; }
.treatment-preset-reorder__toolbar, .treatment-preset-reorder__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.treatment-preset-reorder__actions form { margin: 0; }
.treatment-preset-reorder__status { margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.treatment-preset-add { margin-top: 20px; padding: 18px; border: 1px solid #c9d8d4; border-radius: 14px; background: #f1f7f5; }
.treatment-preset-add form { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(210px, 1.2fr) minmax(240px, 1.5fr) auto; gap: 10px; align-items: end; margin: 14px 0 0; }
.treatment-preset-add label,
.treatment-preset-row label { display: grid; gap: 4px; color: var(--muted); font-size: 11px; font-weight: 700; }
.treatment-preset-add input,
.treatment-preset-row input { min-width: 0; min-height: 44px; }
.treatment-preset-add .button { min-height: 44px; }
.treatment-preset-list { display: grid; gap: 8px; margin-top: 18px; }
.treatment-preset-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfb; }
.treatment-preset-row > form:first-of-type { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(190px, 1.2fr) minmax(220px, 1.4fr) auto; gap: 9px; align-items: end; margin: 0; }
.treatment-preset-row > form:last-child { margin: 0 0 12px; }
.treatment-preset-row .button { min-height: 44px; }
.treatment-preset-row .danger-link { min-height: 30px; }
.treatment-preset-drag-handle, .treatment-preset-reorder-summary { display: none; }
.is-treatment-reordering .treatment-preset-add { display: none; }
.is-treatment-reordering .treatment-preset-row { grid-template-columns: 52px minmax(0, 1fr); align-items: center; cursor: grab; user-select: none; }
.is-treatment-reordering .treatment-preset-row.is-dragging { opacity: .55; border-color: var(--green); box-shadow: 0 8px 24px rgba(23,43,41,.16); }
.is-treatment-reordering .treatment-preset-row > form { display: none; }
.is-treatment-reordering .treatment-preset-drag-handle { display: grid; width: 46px; height: 46px; place-items: center; padding: 0; border: 1px solid #b8c9c4; border-radius: 10px; background: white; color: var(--green-deep); font-size: 27px; line-height: 1; cursor: grab; touch-action: none; }
.is-treatment-reordering .treatment-preset-drag-handle:active { cursor: grabbing; }
.is-treatment-reordering .treatment-preset-drag-handle:focus-visible { outline: 3px solid rgba(0,102,204,.25); outline-offset: 2px; }
.is-treatment-reordering .treatment-preset-reorder-summary { display: grid; gap: 3px; min-width: 0; }
.is-treatment-reordering .treatment-preset-reorder-summary strong { font-size: 17px; overflow-wrap: anywhere; }
.is-treatment-reordering .treatment-preset-reorder-summary small { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.compact-admin-form--closure { grid-template-columns: minmax(150px, 1fr) minmax(240px, 2fr) auto; }
.admin-tools-dialog .audit-list { max-height: min(60vh, 520px); }
#admin-audit-log[open] { display: grid; height: min(760px, calc(100dvh - 32px)); grid-template-rows: auto auto minmax(0, 1fr); overflow: hidden; box-sizing: border-box; }
#admin-audit-log .admin-audit-log-help { margin: 14px 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
#admin-audit-log .audit-list { min-height: 0; max-height: none; padding-right: 10px; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
#admin-audit-log .audit-list:focus-visible { border-radius: 10px; outline: 3px solid rgba(0, 102, 204, .25); outline-offset: 3px; }

.site-footer {
  display: none;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
  padding: 45px 0 55px;
  border-top: 1px solid rgba(49,92,89,.15);
  color: var(--muted);
  font-size: 11px;
}

.site-footer > div:nth-child(2) { text-align: right; }
.site-footer strong { color: var(--ink); font-size: 14px; }
.site-footer p { margin: 2px 0; }
.site-footer a { color: var(--green); }
.footer-session { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: -24px; padding-top: 22px; border-top: 1px solid rgba(49,92,89,.15); }
.footer-session > div { display: grid; min-width: 0; text-align: left !important; }
.footer-session span { color: var(--muted); font-size: 10px; }
.footer-session strong { overflow-wrap: anywhere; color: var(--ink); font-size: 13px; }
.footer-session form { margin: 0; }
.footer-session button { padding: 0; border: 0; background: none; color: var(--green); cursor: pointer; font-size: 11px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.footer-session button:hover { color: var(--green-dark); }
.footer-session button:focus-visible { border-radius: 3px; outline: 3px solid rgba(197,156,88,.4); outline-offset: 3px; }
.footer-session > .footer-session__actions { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; justify-content: flex-end; }
.footer-session__actions > a { font-size: 11px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.footer-session__actions > a:focus-visible { border-radius: 3px; outline: 3px solid rgba(197,156,88,.4); outline-offset: 3px; }

@media (max-width: 880px) {
  .slot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .entry-method { grid-template-columns: 50px minmax(0, 1fr); }
  .entry-method > .button, .method-unavailable { grid-column: 2; justify-self: start; }
  .reservation-item { grid-template-columns: 105px minmax(0, 1fr); }
  .reservation-item__actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
  .admin-search { grid-template-columns: 1fr 1fr; }
  .admin-search .field:first-of-type { grid-column: 1 / -1; }
  .admin-toolbar__actions { width: 100%; }
  .compact-admin-form { grid-template-columns: 1fr 1fr; }
  .compact-admin-form--closure { grid-template-columns: 1fr 1fr auto; }
  .compact-admin-form label:last-of-type { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  :root { --bottom-fixed-menu-height: 76px; }
  body { line-height: 1.65; }
  .site-header { width: 100%; padding: 10px 16px; }
  .brand { gap: 9px; }
  .brand__mark { width: 47px; height: 38px; }
  .brand__text strong { font-size: 15px; }
  .header-menu > summary { min-height: 42px; padding: 0 11px; }
  .header-menu > summary strong { display: none; }
  .page-main { width: calc(100% - 24px); margin-top: 4px; margin-bottom: 50px; }
  .stepper { margin: 36px auto 22px; }
  .stepper-row { width: calc(100% + 8px); gap: 5px; margin: 36px 0 22px -4px; }
  .stepper-row .stepper { width: 100%; margin: 0; }
  .stepper-back { min-height: 38px; padding: 0 7px; font-size: 10px; }
  .stepper-back > span { font-size: 19px; }
  .stepper small { font-size: 9px; }
  .stepper { width: calc(100% + 8px); margin-left: -4px; }
  .stepper span { width: 29px; height: 29px; }
  .stepper li::before { top: 14px; }
  .entry-card, .form-card, .reservation-card, .manage-card { padding: 29px 18px; }
  .content-card { border-radius: 18px; }
  .section-heading { margin-bottom: 25px; }
  .section-heading h1, .section-heading h2 { font-size: 25px; }
  .entry-method { grid-template-columns: 40px minmax(0, 1fr); gap: 15px; padding: 20px 16px; }
  .entry-method__number { width: 40px; height: 40px; }
  .entry-method h3 { font-size: 16px; }
  .entry-method > .button, .entry-method > .method-unavailable, .email-form { grid-column: 1 / -1; width: 100%; }
  .oauth-login { margin-top: 27px; padding-top: 25px; }
  .oauth-login__buttons { grid-template-columns: 1fr; }
  .oauth-button { min-height: 52px; }
  .inline-field { display: grid; }
  .button { min-height: 48px; padding: 0 18px; }
  .confirm-actions--fixed { gap: 8px; padding-right: 12px; padding-left: 12px; }
  .confirm-actions--fixed > a, .confirm-actions--fixed form { flex: 1 1 0; }
  .confirm-actions--fixed .button { width: 100%; min-width: 0; padding: 0 10px; font-size: 11px; }
  .reservation-limit-item { grid-template-columns: 1fr; padding: 18px; }
  .reservation-limit-item__actions { display: grid; grid-template-columns: 1fr 1fr; }
  .reservation-limit-item__actions .button { width: 100%; padding: 0 10px; }
  .patient-fixed-menu { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-right: 0; padding-left: 0; }
  .patient-fixed-menu--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .patient-fixed-menu__item { padding: 5px 2px; }
  .patient-fixed-menu__item:first-child { border-left: 0; }
  .patient-fixed-menu__item strong { font-size: 9px; }
  .emergency-note { display: block; padding: 23px; text-align: center; }
  .emergency-note p { margin: 4px 0 10px; }
  .emergency-note a { font-size: 22px; }
  .verified-email { grid-template-columns: 1fr; }
  .verified-email a { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .verified-email > form { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .reservation-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .reservation-heading__links { display: grid; gap: 8px; align-self: start; margin-top: 0; }
  .reservation-heading__action { min-height: 44px; padding: 0 9px; font-size: 10px; }
  .reservation-current-patient { margin-top: 8px !important; }
  .patient-number { margin-left: 0; }
  .booking-request-notice { margin-right: -4px; margin-left: -4px; }
  .booking-request-notice__heading { padding: 13px 14px; }
  .booking-request-notice__heading h2 { font-size: 16px; }
  .booking-request-notice__body { padding: 14px; font-size: 11px; }
  .booking-request-notice__arrival { padding: 12px 14px; font-size: 13px; }
  .appointment-belongings { margin-right: -4px; margin-left: -4px; }
  .appointment-belongings__heading { padding: 13px 14px; }
  .appointment-belongings__heading h2 { font-size: 16px; }
  .appointment-belongings ul { grid-template-columns: 1fr; padding: 14px; }
  .appointment-belongings li:last-child { grid-column: auto; }
  .appointment-belongings > p { padding: 0 14px 14px; }
  .family-switcher { margin-right: -6px; margin-left: -6px; padding: 14px 12px; }
  .family-switch-dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 22px 16px; }
  .family-switch-dialog__heading h2 { font-size: 19px; }
  .family-switch-dialog .family-switcher { margin-right: 0; margin-left: 0; }
  .family-switch-option { min-width: 150px; min-height: 86px; }
  .family-card, .account-card { margin: 18px auto; padding: 28px 18px; }
  .account-section { padding: 23px 0; }
  .account-email { grid-template-columns: 1fr; gap: 8px; padding: 17px 15px; }
  .account-email__change .inline-field { grid-template-columns: 1fr; }
  .patient-push-settings { flex-direction: column; align-items: stretch; gap: 14px; }
  .patient-push-settings__actions { width: auto; align-self: flex-start; justify-content: flex-start; }
  .oauth-connection-grid { grid-template-columns: 1fr; }
  .account-primary-form { grid-template-columns: 1fr; }
  .family-profile { grid-template-columns: 1fr; gap: 12px; }
  .family-profile__edit, .family-add__form { grid-template-columns: 1fr; }
  .account-family-add-action { align-items: stretch; flex-direction: column; }
  .account-family-add-action .button { width: 100%; }
  .family-add-card { margin: 18px auto; padding: 28px 18px; }
  .family-add__form--page { padding: 20px 14px; }
  .family-add__actions { grid-column: auto; flex-direction: column-reverse; }
  .family-add__actions .button { width: 100%; }
  .family-profile__save { grid-column: auto; justify-self: start; }
  .family-profile__actions { grid-template-columns: 1fr 1fr; justify-items: stretch; }
  .family-profile__actions .family-profile__selected { text-align: center; }
  .electronic-card-page .page-main { margin: 0 auto; }
  .electronic-card-shell { margin: 0 auto; padding: 10px 0; }
  .date-chip { min-width: 67px; min-height: 78px; }
  .weekly-booking { margin-top: 22px; }
  .weekly-booking__heading { grid-template-columns: 66px minmax(0, 1fr) 66px; gap: 8px; }
  .weekly-booking__heading > a { min-height: 44px; padding: 0 5px; font-size: 11px; }
  .weekly-booking__heading .eyebrow { font-size: 8px; }
  .weekly-booking__heading h2 { font-size: 14px; line-height: 1.4; }
  .weekly-booking__heading small { font-size: 9px; }
  .weekly-slot-grid { grid-template-columns: 48px repeat(7, minmax(0, 1fr)); border-radius: 9px; }
  .weekly-slot-grid__corner,
  .weekly-slot-grid__date { min-height: 62px; }
  .weekly-slot-grid__corner { font-size: 8px; }
  .weekly-slot-grid__date { padding: 5px 1px; }
  .weekly-slot-grid__date span { font-size: 9px; }
  .weekly-slot-grid__date strong { font-size: 12px; }
  .weekly-slot-grid__date small { font-size: 8px; }
  .weekly-slot-grid__time,
  .weekly-slot-cell { min-height: 52px; }
  .weekly-slot-grid__time { font-size: 11px; }
  .weekly-slot-cell > span { min-height: 52px; }
  .weekly-slot-cell b { font-size: 17px; }
  .weekly-slot-cell small { display: block; font-size: 8px; }
  .slot-legend { margin-bottom: 8px; font-size: 10px; }
  .calendar-actions .button { padding: 0 5px; font-size: 10px; letter-spacing: -.2px; white-space: nowrap; }
  .slot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .slot-option > span { min-height: 58px; padding: 0 10px; }
  .slot-option strong { font-size: 14px; }
  .reservation-selection-page { padding-bottom: calc(var(--bottom-fixed-menu-height) + env(safe-area-inset-bottom)); }
  .sticky-submit { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); }
  .sticky-submit > div { display: grid; min-width: 0; text-align: left; }
  .sticky-submit small { font-size: 9px; }
  .sticky-submit strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
  .sticky-submit .button { width: auto; min-height: 48px; padding: 0 14px; font-size: 12px; white-space: nowrap; }
  .reservation-summary div { grid-template-columns: 1fr; gap: 2px; }
  .reservation-item { grid-template-columns: 86px minmax(0, 1fr); }
  .reservation-item__date, .reservation-item__detail { padding: 18px 14px; }
  .reservation-item__date strong, .reservation-item__detail strong { font-size: 23px; }
  .reservation-item__actions { padding: 14px; }
  .change-panel { margin: 30px -7px 0; padding: 28px 12px; }
  .change-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .confirm-actions:not(.confirm-actions--fixed) { display: grid; }
  .confirm-actions form, .confirm-actions .button { width: 100%; }
  .reservation-detail { padding: 20px 15px; }
  .history-list article { grid-template-columns: 1fr auto; }
  .history-list article .button { grid-column: 1 / -1; }
  .compact-card { margin: 35px auto; padding: 36px 20px; }
  .site-footer { grid-template-columns: 1fr; gap: 18px; width: calc(100% - 32px); }
  .site-footer > div:nth-child(2) { text-align: left; }
  .footer-session { display: grid; gap: 10px; margin-top: 3px; }
  .footer-session > .footer-session__actions { justify-content: flex-start; }
  .admin-toolbar { align-items: stretch; }
  .admin-view-tabs { display: grid; grid-template-columns: repeat(5, 1fr); flex: 1; }
  .admin-view-tabs a { min-width: 0; padding: 8px; }
  .admin-toolbar__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-toolbar__actions .button { width: 100%; min-width: 0; padding: 0 6px; white-space: normal; }
  .admin-search { grid-template-columns: 1fr; }
  .admin-search .field:first-of-type { grid-column: auto; }
  .admin-search > .button { width: 100%; }
  .admin-calendar { padding: 14px 10px; }
  .admin-tools-dialog .admin-panel__heading h2 { font-size: 19px; }
  .calendar-view-heading { grid-template-columns: 60px 1fr 60px; }
  .calendar-view-heading h2 { font-size: 15px; }
  .calendar-view-heading--three { grid-template-columns: 80px 1fr 80px; }
  .calendar-view-heading--three h2 { font-size: 13px; }
  .calendar-view-heading--three a { font-size: 10px; }
  .month-calendar { overflow: visible; }
  .admin-panel { padding: 24px 16px; }
  .admin-modal-dialog, .admin-create-dialog, .admin-info-dialog, .admin-patient-detail { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .development-feature-form { grid-template-columns: 1fr; }
  .development-feature-form .button { width: 100%; }
  .debug-tools-actions { grid-template-columns: 1fr; }
  .weekday-visibility-form { grid-template-columns: 1fr; }
  .weekday-visibility-form .button { width: 100%; }
  .weekday-visibility-options { flex-wrap: wrap; }
  .schedule-override-toolbar { align-items: stretch; }
  .schedule-period-status { justify-content: flex-start; }
  .schedule-override-popover { margin-left: auto; }
  .schedule-override-popover__panel { position: fixed; top: 84px; right: 12px; left: 12px; width: auto; max-height: calc(100dvh - 108px); overflow-y: auto; }
  .schedule-override-group { display: grid; }
  .schedule-override-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .schedule-override-actions .button { width: 100%; min-width: 0; padding: 0 8px; }
  .admin-day-schedule-calendar .day-calendar__row { grid-template-columns: 78px 1fr; }
  .admin-day-schedule-calendar .day-calendar__row time { font-size: 16px; }
  .admin-day-schedule-calendar .calendar-reservation { font-size: 14px; }
  .admin-patient-detail .admin-panel__heading { display: grid; }
  .admin-patient-detail__header-actions { display: grid; width: 100%; grid-template-columns: 1fr 1fr; }
  .admin-patient-detail__header-actions .button { width: 100%; min-width: 0; padding-inline: 5px; font-size: 12px; white-space: nowrap; }
  .admin-patient-detail__header-actions > form { grid-column: 1 / -1; justify-self: end; }
  .admin-patient-edit-fields { grid-template-columns: 1fr; }
  .admin-patient-edit-fields .field--wide { grid-column: auto; }
  .admin-patient-edit-actions .button { width: 100%; }
  .admin-patient-search-form > div { display: grid; }
  .admin-patient-search-form .button { width: 100%; }
  .admin-create-patient-search__input { grid-template-columns: 1fr; }
  .admin-create-patient-search__input .button { width: 100%; }
  .admin-create-search-actions { grid-template-columns: 1fr; }
  .admin-create-reschedule-comparison { grid-template-columns: 1fr; gap: 8px; }
  .admin-create-reschedule-comparison > span { justify-self: center; transform: rotate(90deg); }
  .admin-patient-summary, .admin-treatment-card { grid-template-columns: 1fr; }
  .admin-patient-profile-fields { grid-template-columns: 1fr; }
  .admin-patient-profile-fields .field--wide { grid-column: auto; }
  .admin-patient-log-summary { grid-template-columns: minmax(0, 1fr) 104px; gap: 10px; }
  .admin-next-treatment-card form > div { display: grid; }
  .admin-next-treatment-card .button { width: 100%; }
  .admin-treatment-form > .admin-treatment-input-row { display: grid; }
  .admin-treatment-form .button { width: 100%; }
  .treatment-tooth-control { display: grid; grid-template-columns: 132px minmax(0, 1fr); }
  .tooth-picker { width: 100%; min-width: 0; }
  .admin-treatment-input-row .tooth-picker, .admin-history-treatment-form .tooth-picker { grid-column: 1 / -1; }
  .tooth-chart-dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .tooth-chart-dialog > header { padding: 15px 14px 10px; }
  .tooth-chart-dialog__help { padding: 0 14px 12px; }
  .tooth-chart-dialog .tooth-chart__panel { max-height: calc(100dvh - 130px); }
  .tooth-chart-dialog .tooth-chart__footer { position: sticky; left: 0; display: grid; width: calc(100vw - 68px); min-width: 0; grid-template-columns: 1fr 1fr; gap: 8px; background: #fbfcfb; }
  .tooth-chart-dialog .tooth-chart__footer > span { grid-column: 1 / -1; white-space: normal; }
  .tooth-chart-dialog .tooth-chart__clear, .tooth-chart-dialog .tooth-chart__done { width: 100%; min-width: 0; }
  .tooth-chart > summary { grid-template-columns: auto minmax(0, 1fr) 22px; }
  .admin-reschedule-calendar .weekly-booking__heading h4 { font-size: 14px; }
  .admin-reschedule-selection { display: grid; }
  .admin-reschedule-selection .button { width: 100%; }
  .admin-detail-cancel-form { margin: 0; text-align: center; }
  .admin-reservation-log > header { align-items: flex-start; }
  .admin-reservation-log > header, .admin-reservation-log > header > div { flex-wrap: wrap; }
  .admin-reservation-log > dl, .admin-history-entry { grid-template-columns: 1fr; gap: 3px; }
  .admin-history-treatment-form { display: grid; }
  .admin-history-treatment-form .button { width: 100%; }
  .admin-form-grid, .compact-admin-form, .compact-admin-form--closure { grid-template-columns: 1fr; }
  .treatment-preset-add form,
  .treatment-preset-row,
  .treatment-preset-row > form:first-of-type { grid-template-columns: 1fr; }
  .treatment-preset-row { align-items: stretch; }
  .is-treatment-reordering .treatment-preset-row { grid-template-columns: 52px minmax(0, 1fr); }
  .treatment-preset-row > form:last-child { margin: 0; text-align: right; }
  .admin-form-grid .field--wide, .compact-admin-form label:last-of-type { grid-column: auto; }
  .admin-form-grid > .button { width: 100%; }
  .admin-name-fields { grid-template-columns: 1fr; }
  .admin-name-fields legend { grid-column: auto; }
  .admin-create-block__form .button { width: 100%; }
  .audit-list article { grid-template-columns: 1fr; gap: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
  .admin-modal-dialog[open] { animation: none; }
}

@page {
  size: A4 portrait;
  margin: 7mm;
}

@media print {
  body.admin-three-day-page {
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow: visible;
    background: #fff;
    color: #000;
    font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
    line-height: 1.2;
  }

  body.admin-three-day-page > .site-header,
  body.admin-three-day-page > .site-footer,
  body.admin-three-day-page > .patient-fixed-menu,
  body.admin-three-day-page .page-main > :not(.admin-shell),
  body.admin-three-day-page .admin-shell > :not(.admin-calendar),
  body.admin-three-day-page .admin-calendar > :not(.three-day-calendar-wrap),
  body.admin-three-day-page .three-day-add {
    display: none !important;
  }

  body.admin-three-day-page .page-main,
  body.admin-three-day-page .admin-shell,
  body.admin-three-day-page .admin-calendar,
  body.admin-three-day-page .three-day-calendar-wrap {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    scrollbar-gutter: auto !important;
  }

  body.admin-three-day-page .three-day-calendar {
    display: grid !important;
    width: 100%;
    /* 20mmの上下余白でも収まる高さ。罫線も含めて指定する。 */
    height: 255mm;
    min-width: 0 !important;
    grid-template-columns: 15mm repeat(3, minmax(0, 1fr));
    grid-template-rows: 10mm repeat(18, minmax(0, 1fr));
    border-color: #555;
    break-inside: avoid-page;
    page-break-inside: avoid;
  }

  body.admin-three-day-page .three-day-calendar > div {
    min-width: 0;
    min-height: 0;
    padding: 1mm 2mm;
    overflow: hidden;
    border-color: #666;
    break-inside: avoid;
  }

  body.admin-three-day-page .three-day-calendar__corner,
  body.admin-three-day-page .three-day-calendar__head,
  body.admin-three-day-page .three-day-calendar__time,
  body.admin-three-day-page .three-day-calendar__cell,
  body.admin-three-day-page .three-day-calendar__cell.is-full,
  body.admin-three-day-page .three-day-reservation {
    position: static !important;
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
  }

  body.admin-three-day-page .three-day-calendar__corner { font-size: 8pt; }
  body.admin-three-day-page .three-day-calendar__head span { color: #444; font-size: 8pt; }
  body.admin-three-day-page .three-day-calendar__head strong { color: #000; font-size: 11pt; }
  body.admin-three-day-page .three-day-calendar__time { font-size: 8.5pt; }
  body.admin-three-day-page .three-day-calendar__cell { gap: 1mm; align-content: center; }
  body.admin-three-day-page .three-day-reservation {
    gap: 0;
    max-width: 100%;
    padding: .5mm 1.5mm;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    font-size: 8.5pt;
    white-space: nowrap;
  }
  body.admin-three-day-page .calendar-patient-link { color: #000; text-decoration: none; }
  body.admin-three-day-page .three-day-unavailable { font-size: 0; }
  body.admin-three-day-page .three-day-unavailable::before { content: "×"; color: #555; font-size: 8pt; }
}

/*
 * Apple-inspired shared visual language.
 * The application keeps its existing semantic components and interaction flows;
 * this final layer gives every patient and admin surface one consistent system.
 */
body {
  background: var(--parchment);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.47;
  letter-spacing: -.01em;
}

h1, h2, h3, h4,
.section-heading h1,
.section-heading h2,
.reservation-heading h1 {
  font-family: var(--display-font);
  font-weight: 600;
  letter-spacing: -.01em;
}

a { color: var(--action-blue); }

.site-header {
  min-height: 53px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
  background: rgba(250, 250, 252, .88);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .7);
  color: var(--ink);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

.brand { gap: 12px; color: var(--ink); }
.brand__mark { width: 50px; height: 41px; }
.brand__mark img { filter: none; opacity: 1; }
.brand__text strong { font-size: 18px; font-weight: 600; letter-spacing: -.01em; }
.brand__text small { color: #6e6e73; font: 400 10px/1 var(--font); letter-spacing: .04em; }
.site-header__sample-mode {
  display: inline-flex;
  min-height: 24px;
  flex: 0 0 auto;
  align-items: center;
  margin-right: auto;
  margin-left: 14px;
  padding: 3px 10px;
  border: 1px solid #e2b85f;
  border-radius: 999px;
  background: #fff6df;
  color: #785514;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.site-header__actions { gap: 11px; }
.site-header__family-action {
  min-height: 43px;
  padding: 0 16px;
  border-color: rgba(0, 0, 0, .08);
  border-radius: 8px;
  background: rgba(0, 0, 0, .035);
  color: var(--ink);
  font-size: 14px;
  font-weight: 400;
}
.site-header__family-action:active { transform: scale(.95); }
.site-header__family-action:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; }
.header-menu > summary {
  min-height: 43px;
  padding: 0 16px;
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 8px;
  background: rgba(0, 0, 0, .035);
  color: var(--ink);
  font-size: 14px;
  font-weight: 400;
}
.header-menu > summary > span { width: 22px; gap: 4px; }
.header-menu > summary i { height: 2.4px; }
.header-menu[open] > summary i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.header-menu[open] > summary i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.header-menu > summary:active { transform: scale(.95); }
.header-menu > summary:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; }
.header-menu__panel { border-color: rgba(0,0,0,.08); border-radius: 18px; box-shadow: none; }
.header-menu__panel a,
.header-menu__panel button { min-height: 50px; border-color: var(--line); color: var(--ink); font-size: 14px; font-weight: 400; }
.header-menu__panel a:hover,
.header-menu__panel button:hover { background: var(--parchment); }
.header-menu__panel strong { color: var(--action-blue); font-family: var(--font); font-weight: 600; }

.page-main {
  width: min(1120px, calc(100% - 48px));
  margin-top: 24px;
}

.eyebrow { color: var(--action-blue); font-family: var(--font); font-size: 12px; font-weight: 600; letter-spacing: .02em; }

.stepper { margin-top: 48px; }
.stepper li { color: var(--muted); font-size: 12px; }
.stepper span { border-color: var(--line); background: var(--parchment); font-family: var(--font); font-weight: 400; }
.stepper .is-active,
.stepper .is-done { color: var(--action-blue); font-weight: 600; }
.stepper .is-active span { border-color: var(--action-blue); background: var(--action-blue); box-shadow: none; }
.stepper .is-done span { border-color: var(--action-blue); background: #fff; }
.stepper .is-done::before,
.stepper .is-active::before { background: var(--action-blue); }

.content-card,
.admin-shell,
.admin-panel,
.family-switch-dialog {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  background: var(--canvas);
  box-shadow: none;
}

.entry-card,
.form-card,
.reservation-card,
.manage-card { padding: clamp(32px, 5vw, 64px); }
.section-heading h1,
.section-heading h2 { font-size: clamp(28px, 4vw, 40px); line-height: 1.1; }
.section-heading > p:last-child,
.reservation-heading p { color: var(--muted); font-size: 17px; }

.entry-method,
.family-profile,
.reservation-item,
.reservation-detail,
.reservation-limit-item,
.app-link-guide,
.booking-request-notice,
.appointment-belongings,
.family-switcher {
  border-color: var(--line);
  background: var(--canvas);
  box-shadow: none;
}

.entry-method { border-radius: 18px; }
.entry-method--primary { border-color: var(--line); background: var(--canvas); }
.entry-method__number,
.field label > span,
.register-split-name > legend > span,
.booking-request-notice__heading > span,
.appointment-belongings__heading > span {
  border-color: transparent;
  background: var(--parchment);
  color: var(--action-blue);
}
.entry-method h3 { font-weight: 600; }
.entry-method p,
.oauth-login__heading p,
.info-note p,
.emergency-note p { color: var(--muted); font-size: 14px; }
.entry-divider span { color: var(--muted); }
.oauth-button--line { border-color: var(--line); background: #fff; color: var(--ink); }
.oauth-button--line .oauth-provider-mark,
.oauth-connection-card--line .oauth-provider-mark { color: var(--action-blue); }

.button,
.oauth-button,
.reservation-heading__action,
.date-chip,
.slot-option > span,
.admin-view-tabs a {
  font-weight: 400;
  box-shadow: none;
  transition: transform .15s ease;
}

.button { min-height: 44px; padding: 0 22px; border-radius: 9999px; }
.button:hover,
.oauth-button:hover { transform: none; box-shadow: none; }
.button:active,
.oauth-button:active,
.reservation-heading__action:active,
.date-chip:active { transform: scale(.95); }
.button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; }
.button--primary { background: var(--action-blue); color: #fff; box-shadow: none; }
.button--primary:hover { background: var(--action-blue); }
.button--dark { background: var(--ink); color: #fff; }
.button--secondary,
.button--calendar,
.button--device-calendar { border-color: var(--action-blue); background: #fff; color: var(--action-blue); }
.button--small { min-height: 38px; padding: 0 16px; border-radius: 9999px; }
.text-link { color: var(--action-blue); font-size: 14px; font-weight: 400; }

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="date"],
select,
textarea {
  min-height: 50px;
  padding: 0 18px;
  border-color: rgba(0,0,0,.16);
  border-radius: 9999px;
  background: #fff;
  color: var(--ink);
  font-size: 17px;
}
textarea { min-height: 112px; padding-top: 14px; border-radius: 18px; }
input::placeholder { color: var(--muted); opacity: .7; }

.info-note,
.family-intro,
.registration-family-note,
.slot-rule-note {
  border-left-color: var(--action-blue);
  background: var(--parchment);
}

.verified-email,
.account-email,
.app-link-guide,
.family-switcher,
.reservation-limit-item,
.reservation-detail,
.change-panel { background: var(--parchment); }
.verified-email a { color: var(--action-blue); }
.optional-label { background: var(--parchment); }

.emergency-note {
  border: 0;
  border-radius: 0;
  background: var(--tile-dark);
  color: #fff;
}
.emergency-note strong { color: #fff; font-weight: 600; }
.emergency-note p { color: #ccc; }
.emergency-note a { color: var(--link-on-dark); font-weight: 600; }

.sent-state__icon,
.complete-icon,
.patient-fixed-menu__item span {
  background: var(--parchment);
  color: var(--action-blue);
}
.alert,
.flash { border-radius: 11px; }
.flash--success { border-color: rgba(0,102,204,.2); background: #f0f7ff; color: var(--ink); }
.app-link-guide { border-color: var(--line); }

.reservation-heading__action { border-color: var(--action-blue); color: var(--action-blue); }
.reservation-heading__action:hover { border-color: var(--action-blue); background: #fff; }
.family-switch-option { border-color: var(--line); border-radius: 18px; }
.family-switch-option.is-selected { border-color: var(--action-blue); background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--action-blue); }
.family-switch-option.is-selected span { color: var(--muted); }
.family-switch-option.is-selected strong { color: var(--action-blue); }

.booking-request-notice { background: #fff; }
.booking-request-notice__heading,
.appointment-belongings__heading { background: var(--parchment); color: var(--ink); }
.booking-request-notice__arrival { border-top-color: var(--line); color: var(--ink); }
.lab-work-notice { margin: 0 0 24px; padding: 18px 20px; border: 1px solid #ddc79e; border-radius: 16px; background: #fffaf0; color: #51432c; font-size: 15px; line-height: 1.7; }
.lab-work-notice p { margin: 0; }
.lab-work-notice p + p { margin-top: 8px; }
.lab-work-notice__title { display: flex; align-items: baseline; gap: 9px; color: var(--ink); font-size: 16px; }
.lab-work-notice__title > span { display: inline-grid; width: 22px; height: 22px; flex: none; place-items: center; border-radius: 50%; background: #816227; color: #fff; font: 700 13px Arial, sans-serif; }
.lab-work-notice__date { font-weight: 600; }
.appointment-belongings { border-width: 1px; }
.appointment-belongings__heading > span,
.appointment-belongings li > span { color: var(--action-blue); }
.appointment-belongings li { border-color: var(--line); color: var(--ink); }
.appointment-belongings > p { color: var(--muted); }

.date-chip,
.slot-option > span { border-color: var(--line); border-radius: 9999px; }
.date-chip.is-selected,
.slot-option input:checked + span,
.weekly-slot-cell input:checked + span {
  border-color: var(--action-blue);
  background: var(--action-blue);
  box-shadow: none;
  color: #fff;
}
.weekly-slot-grid,
.week-overview { border-color: var(--line); background: #fff; }
.weekly-slot-grid__date,
.weekly-slot-grid__time,
.week-day.is-selected { background: var(--parchment); box-shadow: none; }
.weekly-slot-grid__date.is-today { box-shadow: inset 0 3px var(--action-blue); }
.slot-option.is-full > span,
.weekly-slot-cell.is-full { background: var(--parchment); }

.sticky-submit,
.confirm-actions--fixed,
.patient-fixed-menu {
  border-top-color: rgba(0,0,0,.08);
  background: rgba(245,245,247,.88);
  box-shadow: none;
  backdrop-filter: saturate(180%) blur(20px);
}
.patient-fixed-menu__item { border-color: var(--line); color: var(--ink); font-weight: 400; }
.patient-fixed-menu__item:hover { background: rgba(255,255,255,.65); }
.patient-fixed-menu__item--primary { background: var(--action-blue); color: #fff; }
.patient-fixed-menu__item--primary span { background: #fff; color: var(--action-blue); }
.patient-fixed-menu__item--primary:hover { background: var(--action-blue); }

.reservation-item.is-editing,
.family-profile.is-selected { border-color: var(--action-blue); box-shadow: inset 4px 0 var(--action-blue); }
.reservation-item__date { background: var(--parchment); }
.reservation-item__date strong,
.reservation-patient-name,
.patient-number,
.reservation-summary--confirm dd { color: var(--action-blue) !important; }
.patient-number { background: var(--parchment); }

.site-footer {
  color: #333;
  font-size: 12px;
  line-height: 1.5;
}
.site-footer a,
.footer-session__actions a,
.footer-session__actions button { color: var(--action-blue); }

.admin-toolbar,
.admin-search { background: #fff; }
.admin-view-tabs a[aria-current="page"] { background: var(--parchment); color: var(--action-blue); }
.admin-panel,
.admin-modal-dialog { box-shadow: none; }
.admin-dialog-close { border-color: var(--action-blue); border-radius: 9999px; color: var(--action-blue); }
.admin-dialog-close:hover { background: #fff; }
.admin-table th,
.day-calendar__row time,
.three-day-calendar__head,
.three-day-calendar__time,
.week-calendar__corner,
.week-calendar__time,
.week-calendar__head,
.month-calendar__head,
.simple-week-calendar__time,
.simple-week-calendar__head,
.simple-months,
.simple-month-calendar__weekday { background: var(--parchment); }
.simple-week-reservation:hover,
.simple-month-calendar__day:hover { background: var(--parchment); }
.simple-month-calendar__day.is-selected { box-shadow: inset 0 0 0 2px var(--action-blue); }
body.admin-simple-page { background: var(--parchment); }

@media (max-width: 833px) {
  .page-main { width: min(100% - 32px, 980px); }
}

@media (max-width: 620px) {
  body { font-size: 17px; }
  .site-header { min-height: 62px; padding: 7px 19px; }
  .brand__mark { width: 46px; height: 37px; }
  .brand__text strong { font-size: 17px; }
  .site-header__sample-mode { min-height: 22px; margin-left: 7px; padding: 2px 7px; font-size: 9px; }
  .site-header__actions { gap: 8px; }
  .site-header__family-action { min-height: 48px; padding: 0 14px; }
  .family-menu__panel { position: fixed; top: 66px; right: 12px; left: 12px; width: auto; max-height: calc(100dvh - 78px); }
  .family-menu__options { max-height: calc(100dvh - 204px); }
  .header-menu > summary { min-height: 48px; padding: 0 16px; }
  .page-main { width: calc(100% - 24px); margin-top: 12px; }
  .stepper { margin-top: 32px; }
  .stepper li { font-size: 10px; }
  .entry-card,
  .form-card,
  .reservation-card,
  .manage-card { padding: 32px 18px; }
  .content-card { border-radius: 18px; }
  .section-heading h1,
  .section-heading h2 { font-size: 28px; }
  .section-heading > p:last-child,
  .reservation-heading p { font-size: 15px; }
  .button { min-height: 48px; }
  .emergency-note { border-radius: 0; }
  .patient-fixed-menu__item--primary { background: var(--action-blue); }
}

@media print {
  html,
  body { background: #fff; color: #000; }
}

/* Calm patient motion, adapted from the primitives in motion.css. */
.motion-reveal {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
}

.motion-reveal.is-motion-visible {
  animation: yonaiFadeInUp .5s cubic-bezier(.2, .7, .2, 1) both;
  animation-delay: var(--motion-delay, 0ms);
}

.motion-reveal.motion-settled {
  opacity: 1;
  transform: none;
  animation: none;
}

.motion-slide-up { animation: yonaiFadeInUp .42s cubic-bezier(.2, .7, .2, 1) both; }
.motion-attention { animation: yonaiSelectionPulse .34s ease-in-out both; }

@media (max-width: 833px) {
  .header-menu[open] .header-menu__panel,
  .family-menu[open] .family-menu__panel,
  .family-switch-dialog[open] {
    transform-origin: top right;
    animation: yonaiZoomIn .18s ease-out both;
  }

  .slot-option input:checked + span,
  .weekly-slot-cell input:checked + span {
    animation: yonaiSelectionPulse .28s ease-in-out both;
  }
}

/* 拡張管理画面: 受付用管理画面と操作の優先順位を揃え、狭い画面でも情報を追える構成にする。 */
body.admin-page:not(.admin-simple-page) .admin-shell {
  border: 1px solid #e3e8e6;
  border-radius: 24px;
  box-shadow: 0 16px 44px rgba(37, 70, 66, .09);
}

body.admin-page:not(.admin-simple-page) .admin-toolbar {
  position: relative;
  z-index: 24;
  top: auto;
  padding: 16px 20px;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(14px);
}

body.admin-page:not(.admin-simple-page) .admin-view-tabs {
  padding: 4px;
  border-radius: 12px;
  background: #f3f5f4;
}

body.admin-page:not(.admin-simple-page) .admin-view-tabs a {
  min-width: 62px;
  min-height: 40px;
  padding: 10px 16px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 700;
}

body.admin-page:not(.admin-simple-page) .admin-toolbar__actions,
body.admin-page:not(.admin-simple-page) .admin-toolbar-more__panel {
  display: flex;
  gap: 8px;
  align-items: center;
}

body.admin-page:not(.admin-simple-page) .admin-toolbar__actions .button {
  min-height: 42px;
  padding-inline: 15px;
  font-size: 12px;
}

body.admin-page:not(.admin-simple-page) .admin-toolbar-more {
  display: contents;
}

body.admin-page:not(.admin-simple-page) .admin-toolbar-more > summary {
  display: none;
}

body.admin-page:not(.admin-simple-page) .admin-toolbar-more > .admin-toolbar-more__panel {
  display: flex !important;
}

body.admin-page:not(.admin-simple-page) .calendar-view-heading a {
  scroll-margin-top: 150px;
}

body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary {
  display: none;
}

body.admin-page:not(.admin-simple-page) .admin-filter-panel > .admin-search {
  display: grid !important;
}

body.admin-page:not(.admin-simple-page) .admin-search {
  padding: 18px 20px;
  background: #fbfcfb;
}

body.admin-page:not(.admin-simple-page) .admin-calendar {
  padding: 26px;
}

.admin-calendar-mobile-hint,
.month-calendar__mobile-count {
  display: none;
}

.month-calendar-wrap {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

body.admin-page:not(.admin-simple-page) .admin-modal-dialog {
  border: 1px solid rgba(49, 92, 89, .2);
  border-radius: 24px;
  box-shadow: 0 28px 80px rgba(19, 42, 39, .25);
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

body.admin-page:not(.admin-simple-page) .admin-modal-dialog > .admin-panel__heading {
  position: sticky;
  z-index: 20;
  top: 0;
  padding: 4px 0 16px;
  border-bottom: 1px solid rgba(219, 226, 223, .92);
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(14px);
}

body.admin-page:not(.admin-simple-page) .admin-dialog-close {
  min-width: 76px;
  min-height: 44px;
  font-size: 14px;
  font-weight: 700;
}

@media (max-width: 760px) {
  .admin-treatment-notice-dialog { width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .admin-treatment-notice-dialog__heading { min-height: 64px; padding: 8px 12px; }
  .admin-treatment-notice-dialog__kicker { display: none; }
  .admin-treatment-notice-dialog__heading h2 { font-size: 17px; }
  .admin-treatment-notice-dialog iframe { height: calc(100% - 64px); }
  body.admin-page:not(.admin-simple-page) .page-main {
    width: 100%;
    margin: 0;
  }

  body.admin-page:not(.admin-simple-page) .admin-shell {
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar {
    position: relative;
    top: auto;
    gap: 10px;
    padding: 10px 12px 12px;
    border-bottom-color: #dce3e1;
  }

  body.admin-page:not(.admin-simple-page) .admin-view-tabs {
    width: 100%;
    flex: none;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  body.admin-page:not(.admin-simple-page) .admin-view-tabs a {
    min-width: 0;
    min-height: 42px;
    padding: 10px 4px;
    font-size: 14px;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar__actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar__actions > .button {
    min-height: 46px;
    font-size: 14px;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more {
    position: relative;
    display: block;
    grid-column: 1 / -1;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more > summary {
    display: flex;
    width: 100%;
    min-height: 42px;
    justify-content: center;
    list-style: none;
    font-size: 13px;
    cursor: pointer;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more > summary::-webkit-details-marker {
    display: none;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more > summary::after {
    margin-left: 8px;
    content: "⌄";
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more[open] > summary::after {
    content: "⌃";
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more:not([open]) > .admin-toolbar-more__panel {
    display: none !important;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more[open] > .admin-toolbar-more__panel {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 8px;
    padding: 10px;
    border: 1px solid #dbe3e0;
    border-radius: 14px;
    background: #f8faf9;
  }

  body.admin-page:not(.admin-simple-page) .admin-toolbar-more__panel .button {
    width: 100%;
    min-height: 44px;
    font-size: 13px;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel {
    border-bottom: 1px solid var(--line);
    background: #fbfcfb;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary {
    display: grid;
    min-height: 58px;
    grid-template-columns: 1fr auto;
    gap: 2px 12px;
    align-items: center;
    padding: 10px 16px;
    list-style: none;
    color: var(--action-blue);
    cursor: pointer;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary::-webkit-details-marker {
    display: none;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary::after {
    grid-column: 2;
    grid-row: 1 / 3;
    color: var(--ink);
    font-size: 22px;
    content: "+";
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel[open] > summary::after {
    content: "−";
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary span {
    font-size: 15px;
    font-weight: 800;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel > summary small {
    color: var(--muted);
    font-size: 11px;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel:not([open]) > .admin-search {
    display: none !important;
  }

  body.admin-page:not(.admin-simple-page) .admin-filter-panel[open] > .admin-search {
    display: grid !important;
  }

  body.admin-page:not(.admin-simple-page) .admin-search {
    gap: 14px;
    padding: 14px 16px 18px;
  }

  body.admin-page:not(.admin-simple-page) .admin-search input,
  body.admin-page:not(.admin-simple-page) .admin-search select {
    min-height: 48px;
    font-size: 16px;
  }

  body.admin-page:not(.admin-simple-page) .admin-table-wrap {
    padding: 12px;
    overflow: visible;
    background: #f4f6f5;
  }

  body.admin-page:not(.admin-simple-page) .admin-table,
  body.admin-page:not(.admin-simple-page) .admin-table tbody {
    display: block;
    width: 100%;
    white-space: normal;
  }

  body.admin-page:not(.admin-simple-page) .admin-table thead {
    display: none;
  }

  body.admin-page:not(.admin-simple-page) .admin-table tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin-bottom: 12px;
    overflow: hidden;
    border: 1px solid #dbe3e0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(37, 70, 66, .06);
  }

  body.admin-page:not(.admin-simple-page) .admin-table td {
    display: grid;
    min-width: 0;
    gap: 5px;
    align-content: start;
    padding: 11px 13px;
    border-top: 1px solid #edf1ef;
    overflow-wrap: anywhere;
  }

  body.admin-page:not(.admin-simple-page) .admin-table td::before {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    content: attr(data-label);
  }

  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="予約日時"],
  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="患者様"],
  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="メール"],
  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="操作"] {
    grid-column: 1 / -1;
  }

  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="予約日時"] {
    border-top: 0;
    background: #f8faf9;
    font-size: 17px;
  }

  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="患者様"] .admin-patient-link {
    color: var(--action-blue);
    font-size: 19px;
  }

  body.admin-page:not(.admin-simple-page) .admin-table td[data-label="メール"] a {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body.admin-page:not(.admin-simple-page) .admin-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    align-items: center;
  }

  body.admin-page:not(.admin-simple-page) .admin-row-actions::before {
    width: 100%;
  }

  body.admin-page:not(.admin-simple-page) .admin-table .admin-table__empty-row {
    display: block;
    margin: 0;
  }

  body.admin-page:not(.admin-simple-page) .admin-table .admin-empty {
    display: block;
    padding: 42px 16px !important;
    border: 0;
  }

  body.admin-page:not(.admin-simple-page) .admin-table .admin-empty::before {
    content: none;
  }

  body.admin-page:not(.admin-simple-page) .admin-calendar {
    padding: 14px 10px 20px;
    overflow: visible;
  }

  body.admin-page:not(.admin-simple-page) .calendar-view-heading {
    grid-template-columns: 64px minmax(0, 1fr) 64px;
    gap: 4px;
    margin: 2px 0 12px;
  }

  body.admin-page:not(.admin-simple-page) .calendar-view-heading a {
    display: grid;
    min-height: 44px;
    place-items: center;
    border: 1px solid #d9e1df;
    border-radius: 12px;
    font-size: 12px;
  }

  body.admin-page:not(.admin-simple-page) .calendar-view-heading h2 {
    font-size: 16px;
    overflow-wrap: anywhere;
  }

  body.admin-page:not(.admin-simple-page) .calendar-view-heading--three {
    grid-template-columns: 70px minmax(0, 1fr) 70px;
  }

  .admin-calendar-mobile-hint {
    display: block;
    margin: 0 2px 10px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.5;
  }

  body.admin-page:not(.admin-simple-page) .day-calendar {
    border-radius: 14px;
  }

  body.admin-page:not(.admin-simple-page) .day-calendar__row {
    grid-template-columns: 70px minmax(0, 1fr);
    min-height: 68px;
  }

  body.admin-page:not(.admin-simple-page) .day-calendar__row time {
    position: sticky;
    left: 0;
    font-size: 15px;
  }

  body.admin-page:not(.admin-simple-page) .day-calendar__row > div {
    min-width: 0;
    gap: 7px;
    padding: 9px 10px;
  }

  body.admin-page:not(.admin-simple-page) .calendar-reservation {
    width: 100%;
    padding: 9px 10px;
    font-size: 14px;
  }

  body.admin-page:not(.admin-simple-page) .calendar-add {
    display: grid;
    min-height: 42px;
    margin-left: auto;
    place-items: center;
    padding: 0 12px;
    border-radius: 999px;
    background: #edf5ff;
    color: var(--action-blue);
    font-size: 13px;
  }

  body.admin-page:not(.admin-simple-page) .week-calendar-wrap,
  body.admin-page:not(.admin-simple-page) .three-day-calendar-wrap {
    overflow-x: auto;
    border: 1px solid #dbe3e0;
    border-radius: 12px;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-gutter: stable;
  }

  body.admin-page:not(.admin-simple-page) .week-calendar {
    min-width: 940px;
  }

  body.admin-page:not(.admin-simple-page) .three-day-calendar {
    min-width: 790px;
  }

  body.admin-page:not(.admin-simple-page) .week-calendar__corner,
  body.admin-page:not(.admin-simple-page) .week-calendar__time,
  body.admin-page:not(.admin-simple-page) .three-day-calendar__corner,
  body.admin-page:not(.admin-simple-page) .three-day-calendar__time {
    position: sticky;
    z-index: 3;
    left: 0;
  }

  body.admin-page:not(.admin-simple-page) .week-calendar__corner,
  body.admin-page:not(.admin-simple-page) .three-day-calendar__corner {
    z-index: 4;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar-wrap {
    overflow: hidden;
    border: 1px solid #dbe3e0;
    border-radius: 12px;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar {
    min-width: 0;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow: visible;
    border: 0;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__head {
    min-width: 0;
    padding: 7px 1px;
    font-size: 11px;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__cell {
    min-width: 0;
    min-height: 72px;
    gap: 1px;
    justify-items: center;
    padding: 3px 1px;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__date-button {
    width: 34px;
    height: 34px;
    justify-self: center;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__date-button strong {
    font-size: 14px;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__cell > span,
  body.admin-page:not(.admin-simple-page) .month-calendar__more {
    display: none;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__cell > small {
    font-size: 9px;
  }

  body.admin-page:not(.admin-simple-page) .month-calendar__mobile-count {
    display: block;
    color: var(--action-blue);
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
  }

  body.admin-page:not(.admin-simple-page) .admin-modal-dialog,
  body.admin-page:not(.admin-simple-page) .admin-create-dialog,
  body.admin-page:not(.admin-simple-page) .admin-info-dialog,
  body.admin-page:not(.admin-simple-page) .admin-patient-detail,
  body.admin-page:not(.admin-simple-page) .admin-day-schedule-dialog,
  body.admin-page:not(.admin-simple-page) .duplicate-patient-dialog {
    width: 100%;
    height: 100dvh;
    max-width: none;
    max-height: 100dvh;
    margin: 0;
    padding: 16px 14px calc(24px + env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0;
    box-sizing: border-box;
    scrollbar-gutter: auto;
  }

  body.admin-page:not(.admin-simple-page) .admin-modal-dialog[open] {
    animation: admin-dialog-mobile-in .14s ease-out;
  }

  body.admin-page:not(.admin-simple-page) #admin-audit-log[open] {
    height: 100dvh;
    max-height: 100dvh;
  }

  body.admin-page:not(.admin-simple-page) .admin-modal-dialog > .admin-panel__heading {
    top: -16px;
    margin: 0 -2px 16px;
    padding: calc(12px + env(safe-area-inset-top)) 2px 12px;
  }

  body.admin-page:not(.admin-simple-page) .admin-modal-dialog > .admin-panel__heading h2 {
    font-size: clamp(22px, 7vw, 29px);
    line-height: 1.2;
  }

  body.admin-page:not(.admin-simple-page) .admin-dialog-close {
    min-width: 68px;
    min-height: 46px;
    padding-inline: 12px;
    font-size: 14px;
  }

  body.admin-page:not(.admin-simple-page) .admin-create-appointment {
    grid-template-columns: 1fr;
  }

  body.admin-page:not(.admin-simple-page) .admin-create-appointment > div + div {
    border-top: 1px solid #c9d8d4;
    border-left: 0;
  }

  body.admin-page:not(.admin-simple-page) .admin-create-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.admin-page:not(.admin-simple-page) .admin-create-actions > .button,
  body.admin-page:not(.admin-simple-page) .admin-create-block__form .button {
    width: 100%;
    white-space: normal;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-search-form > div {
    grid-template-columns: 1fr;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail__header-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding-top: 8px;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail > .admin-panel__heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail > .admin-panel__heading > div:first-child {
    grid-column: 1;
    padding-right: 76px;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail__header-actions .button {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail__header-actions .button--danger {
    grid-column: 1 / -1;
  }

  body.admin-page:not(.admin-simple-page) .admin-patient-detail__header-actions > form {
    position: absolute;
    z-index: 3;
    top: calc(12px + env(safe-area-inset-top));
    right: 2px;
    grid-column: auto;
  }

  body.admin-page:not(.admin-simple-page) .schedule-override-toolbar {
    display: grid;
    grid-template-columns: 1fr;
  }

  body.admin-page:not(.admin-simple-page) .schedule-override-popover {
    width: 100%;
    margin: 0;
  }

  body.admin-page:not(.admin-simple-page) .schedule-override-popover > summary {
    width: 100%;
  }
}

@keyframes admin-dialog-mobile-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-reveal,
  .motion-reveal.is-motion-visible,
  .motion-slide-up,
  .motion-attention,
  .header-menu[open] .header-menu__panel,
  .family-switch-dialog[open],
  .slot-option input:checked + span,
  .weekly-slot-cell input:checked + span {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* 患者単位の有効マークと、予約記録ごとの3段階の状態選択。 */
.patient-status-markers { display: inline-flex; flex: 0 0 auto; gap: 3px; align-items: center; margin-left: 5px; vertical-align: middle; }
.patient-status-markers > .reservation-schedule-marker { margin-left: 0; }
/* 予定表ではマークを行高の計算から外し、文字と同じ行内へ収める。 */
:is(.calendar-reservation, .three-day-reservation, .week-calendar__reservation, .month-calendar__cell > span) > .patient-status-markers { height: 0; gap: 2px; margin-left: 4px; overflow: visible; }
:is(.calendar-reservation, .three-day-reservation, .week-calendar__reservation, .month-calendar__cell > span, .simple-week-reservation) > .patient-status-markers > .reservation-schedule-marker { width: 14px; height: 14px; border-width: 1px; font-size: 9px; }
.month-calendar__cell > span[data-reservation-tone] { display: flex; column-gap: 2px; align-items: center; }
:is(.calendar-reservation, .three-day-reservation, .month-calendar__cell > span) > .calendar-patient-link { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reservation-schedule-marker--payment_unpaid { border-color: #b43e35; background: #ffebe8; color: #a7322b; }
.reservation-schedule-marker--lab_work_set { border-color: #7b5aa6; background: #f4edfc; color: #684493; }
.reservation-schedule-marker--treatment_complete { border-color: #4b91c4; background: #e6f2fb; color: #1767a3; }
.admin-reservation-marker--lab_work_set { color: #684493; }
.admin-reservation-marker--lab_work_set.is-active { background: #f0e6fb; box-shadow: 0 0 0 2px rgba(104, 68, 147, .14); }
.admin-reservation-attribute--set { border-color: #bfabd9; background: #f4edfc; color: #684493; }
.admin-reservation-attribute--treatment-complete { border-color: #9bc4df; background: #e6f2fb; color: #1767a3; }
.admin-patient-detail-title { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.admin-patient-marker-complete-form { margin: 0; }
.admin-patient-marker-complete-form button { min-height: 38px; font-family: inherit; cursor: pointer; }
.admin-patient-marker-complete-form button:hover { filter: brightness(.95); }
.admin-patient-marker-complete-form button:focus-visible { outline: 3px solid var(--action-blue); outline-offset: 2px; }
.admin-reservation-marker-picker { position: relative; padding-bottom: 15px; }
.admin-reservation-marker-picker > summary { position: relative; list-style: none; }
.admin-reservation-marker-picker > summary::-webkit-details-marker { display: none; }
.admin-reservation-marker__state { position: absolute; bottom: -14px; left: 50%; transform: translateX(-50%); font-size: 10px; font-weight: 700; white-space: nowrap; }
.admin-reservation-marker.is-completed { border-style: double; border-width: 4px; background: #edf0f1; color: #59666b; opacity: 1; }
.admin-reservation-marker-picker > .admin-reservation-marker-form { position: absolute; top: 56px; right: 0; z-index: 20; width: 218px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: white; box-shadow: 0 8px 24px #0002; color: var(--ink); }
.admin-reservation-marker-form > strong { display: block; margin-bottom: 8px; font-size: 14px; }
.admin-reservation-marker-options { display: flex; gap: 5px; }
.admin-reservation-marker-options > button { flex: 1; min-height: 44px; padding: 6px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--ink); font: inherit; font-size: 14px; cursor: pointer; }
.admin-reservation-marker-options > button[aria-pressed="true"] { border-color: var(--action-blue); background: #e5f1ff; color: var(--action-blue); font-weight: 700; }
.admin-reservation-marker-options > button:focus-visible { outline: 3px solid var(--action-blue); outline-offset: 1px; }

@media print {
  /* 全予定で同じ下余白を確保し、3種類のマークがあっても患者名・処置内容を省略しない。 */
  body.admin-three-day-page .three-day-reservation { position: relative !important; padding-bottom: 4.5mm; }
  body.admin-three-day-page .three-day-reservation > .patient-status-markers { position: absolute; right: 1.5mm; bottom: .5mm; height: 14px; margin: 0; }
}

@media (max-width: 760px) {
  .admin-reservation-marker-picker > .admin-reservation-marker-form { position: fixed; top: auto; bottom: 16px; right: 16px; left: 16px; width: auto; }
}

/* Patient menus and branding must also fit short and narrow viewports. */
.has-patient-navigation .header-menu__panel {
  max-height: calc(100dvh - 82px - env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}
@media (max-width: 360px) {
  .has-patient-navigation .site-header { padding-inline: 12px; }
  .has-patient-navigation .brand { gap: 6px; }
  .has-patient-navigation .brand__mark { width: 38px; height: 31px; }
  .has-patient-navigation .brand__text strong { font-size: 15px; white-space: nowrap; }
  .has-patient-navigation .site-header__actions { gap: 6px; }
  .has-patient-navigation .site-header__family-action { padding-inline: 10px; }
  .has-patient-navigation .header-menu > summary { min-width: 44px; padding-inline: 10px; }
}

/* Patient app setup: inline guidance, without covering booking controls. */
.app-setup-page .page-main { max-width: 760px; }
.app-setup-back { display: inline-flex; min-height: 44px; align-items: center; margin-bottom: 10px; color: var(--action-blue); font-size: 14px; text-decoration: none; }
.app-setup { padding: 32px; }
.app-setup__hero { display: flex; gap: 18px; align-items: center; }
.app-setup__hero > img { flex: none; border-radius: 16px; border: 1px solid var(--line); }
.app-setup__hero h1 { margin: 0; font-size: clamp(23px, 4vw, 32px); line-height: 1.35; }
.app-setup__label { margin: 0 0 5px; color: var(--muted); font-size: 12px; font-weight: 600; }
.app-setup__intro { margin: 20px 0 16px; line-height: 1.7; }
.app-setup__benefits { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; }
.app-setup__benefits li { padding: 7px 10px; border-radius: 8px; background: #f5f5f7; font-size: 12px; }
.app-setup__benefits li::before { content: '✓'; margin-right: 5px; color: var(--action-blue); font-weight: 700; }
.app-setup__step { padding-top: 25px; border-top: 1px solid var(--line); scroll-margin-top: 92px; }
.app-setup__step + .app-setup__step { margin-top: 30px; }
.app-setup__heading { display: flex; gap: 10px; align-items: center; }
.app-setup__heading h2 { flex: 1; min-width: 0; margin: 0; font-size: 20px; line-height: 1.4; }
.app-setup__number { display: grid; width: 30px; height: 30px; flex: none; place-items: center; border-radius: 50%; background: var(--action-blue); color: white; font-size: 15px; font-weight: 600; }
.app-setup__badge { flex: none; color: var(--action-blue); font-size: 11px; font-weight: 600; }
.app-setup__state { color: var(--muted); line-height: 1.6; }
.app-setup__step > p { font-size: 15px; line-height: 1.7; }
.app-setup__install { width: 100%; margin-bottom: 14px; }
.app-install-guide { margin-top: 12px; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.app-install-guide > summary { min-height: 52px; padding: 15px 0; color: var(--action-blue); font-size: 15px; font-weight: 600; cursor: pointer; }
.app-install-guide > p { margin: 0 0 16px; font-size: 14px; line-height: 1.7; }
.app-install-steps { display: grid; gap: 20px; margin: 5px 0 20px; padding: 0; list-style: none; counter-reset: app-install; }
.app-install-steps > li { position: relative; padding-left: 32px; counter-increment: app-install; }
.app-install-steps > li::before { content: counter(app-install); position: absolute; top: 0; left: 0; display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: #edf5fd; color: var(--action-blue); font-size: 12px; font-weight: 700; }
.app-install-steps strong { font-size: 15px; line-height: 1.6; }
.app-install-steps p { margin: 5px 0 10px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.app-install-example { display: flex; min-height: 50px; gap: 12px; align-items: center; padding: 10px 14px; border: 1px solid #dedee3; border-radius: 10px; background: #f5f5f7; color: #1d1d1f; font-size: 14px; }
.app-install-example svg, .app-install-example b { color: var(--action-blue); }
.app-install-example img { border-radius: 10px; }
.app-install-example__dots { font-size: 21px; letter-spacing: 2px; color: var(--action-blue); }
.app-install-example__plus { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid currentColor; border-radius: 5px; font-size: 18px; line-height: 1; }
.app-install-example--add { justify-content: space-between; }
.app-setup__note { color: var(--muted); font-size: 12px !important; line-height: 1.7; }
.app-setup__note a, .patient-push-settings a { color: var(--action-blue); text-underline-offset: 3px; }
.app-setup__notice, .app-setup__browser-help, .patient-push-status:not(:empty) { padding: 13px 15px; border-radius: 10px; background: #edf5fd; font-size: 14px; line-height: 1.7; }
.app-setup__browser-help p { font-size: 14px; line-height: 1.7; }
.patient-push-status[data-state="enabled"] { background: #edf7f1; color: #23553b; }
.patient-push-status[data-state="error"], .patient-push-status[data-state="denied"] { background: #fff4e6; color: #714915; }
.app-setup__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.app-setup__actions .button { min-height: 46px; }
.app-setup__actions .button--primary { flex: 1 1 240px; }
.app-nudge { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; align-items: center; margin: 22px 0; padding: 18px; border: 1px solid #d7e7f8; border-radius: 14px; background: #f0f6fd; text-align: left; }
.app-nudge__copy strong { display: block; color: var(--ink); font-size: 16px; line-height: 1.5; }
.app-nudge__copy p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.app-nudge .button { min-height: 44px; font-size: 13px; }
.app-nudge__dismiss { grid-column: 2; justify-self: end; min-width: 44px; min-height: 44px; padding: 6px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; }
.app-nudge--compact { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; width: min(620px, 100%); justify-self: center; margin: clamp(10px, 2.5dvh, 22px) 0 0; padding: 14px 16px; background: #fff; }
.app-nudge--compact .app-nudge__copy strong { font-size: 14px; }
.app-nudge--compact .app-nudge__copy p { font-size: 12px; }
.app-nudge--compact .button { min-width: 112px; padding-inline: 14px; font-size: 12px; }
.app-nudge--compact .app-nudge__dismiss { grid-column: auto; }
.electronic-card-shell { grid-template-rows: minmax(0, 1fr) auto; }
@media (max-width: 620px) {
  .app-setup { padding: 22px 16px; }
  .app-setup__hero { gap: 12px; }
  .app-setup__hero > img { width: 52px; height: 52px; border-radius: 13px; }
  .app-setup__hero h1 { font-size: 22px; }
  .app-setup__heading { gap: 8px; flex-wrap: wrap; }
  .app-setup__heading h2 { font-size: 17px; }
  .app-setup__badge { width: 100%; margin-left: 38px; }
  .app-install-guide { padding-inline: 12px; }
  .app-install-steps > li { padding-left: 29px; }
  .app-install-example { gap: 8px; padding: 10px; font-size: 12px; }
  .app-setup__actions { flex-direction: column; }
  .app-setup__actions .button--primary { flex-basis: auto; }
  .app-nudge:not(.app-nudge--compact) { grid-template-columns: minmax(0, 1fr); }
  .app-nudge:not(.app-nudge--compact) .app-nudge__dismiss { grid-column: 1; justify-self: center; }
}
@media (max-width: 420px) {
  .app-nudge--compact { grid-template-columns: minmax(0, 1fr) auto; padding: 12px 14px; }
  .app-nudge--compact .app-nudge__copy { grid-column: 1 / -1; }
  .app-nudge--compact .button { justify-self: stretch; }
  .app-nudge--compact .app-nudge__dismiss { grid-column: 2; }
}
@media (max-height: 480px) {
  .electronic-card-shell > .app-nudge { display: none; }
}

/* Keep the booking progress compact so the date grid begins higher on screen. */
.reservation-selection-page .reservation-card > .reservation-current-patient {
  margin: 0 !important;
  color: var(--muted);
}
.reservation-page .stepper-row {
  gap: 10px;
  margin: 20px auto 16px;
}
.reservation-page .stepper li {
  gap: 4px;
  font-size: 10px;
}
.reservation-page .stepper small { white-space: nowrap; }
.reservation-page .stepper li::before { top: 14px; }
.reservation-page .stepper span {
  width: 29px;
  height: 29px;
  font-size: 11px;
}
.reservation-page .stepper-back {
  min-width: 96px;
  min-height: 52px;
  padding: 0 16px;
  font-size: 16px;
}
.reservation-page .stepper-back > span { font-size: 26px; }
@media (max-width: 620px) {
  .reservation-page .stepper-row {
    width: calc(100% + 8px);
    gap: 5px;
    margin: 14px 0 12px -4px;
  }
  .reservation-page .stepper li { gap: 3px; font-size: 9px; }
  .reservation-page .stepper li::before { top: 12px; }
  .reservation-page .stepper span { width: 25px; height: 25px; font-size: 10px; }
  .reservation-page .stepper-back { min-width: 80px; min-height: 48px; padding: 0 12px; font-size: 14px; }
  .reservation-page .stepper-back > span { font-size: 24px; }
}