:root {
  color-scheme: light;
  --navy-950: #020d1d;
  --navy-900: #061a34;
  --navy-800: #0b2949;
  --ink: #17263a;
  --muted: #68788b;
  --line: #dce4ec;
  --surface: #ffffff;
  --canvas: #f3f6f9;
  --warm: #fff8f2;
  --orange: #f26a13;
  --orange-dark: #c54d05;
  --orange-soft: #fff0e6;
  --action: #28679e;
  --action-dark: #174d7a;
  --action-soft: #eaf3fb;
  --action-softer: #f4f8fc;
  --control-border: #c7d3df;
  --focus-ring: rgba(40,103,158,.2);
  --table-stripe: #f8fafc;
  --table-hover: #eef6fc;
  --gold: #eeb42e;
  --gold-bright: #ffd15a;
  --green: #087a59;
  --green-soft: #e6f6f0;
  --amber: #a85b00;
  --amber-soft: #fff2dc;
  --red: #b33b3b;
  --red-soft: #fdecec;
  --shadow: 0 12px 35px rgba(24, 34, 50, .09);
  --control-height: 32px;
  --control-radius: 5px;
  --control-font-size: 12px;
  --control-padding-x: 11px;
  --navigation-motion-duration: .32s;
  --sidebar-width: 196px;
  --view-exit-duration: .12s;
  --view-enter-duration: .20s;
  font-family: "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
}

/* D-112: one order, one current action, independently verified milestones. */
.purchase-flow { margin: 12px 0 20px; padding: 20px; border-radius: 12px; background: var(--action-softer); }
.purchase-flow-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.purchase-flow-heading h3 { margin: 0; font-size: 19px; line-height: 1.5; overflow-wrap: anywhere; }
.purchase-flow-heading button { flex-shrink: 0; }
.purchase-flow-steps { padding: 0; margin: 20px 0; display: flex; list-style: none; gap: 16px; }
.purchase-flow-steps li { flex: 1; padding: 8px 0; border-bottom: 2px solid var(--control-border); }
.purchase-flow-steps li.is-done { border-color: var(--green); }
.purchase-flow-steps span, .purchase-flow-steps small { display: block; }
.purchase-flow-steps small { margin-top: 4px; color: var(--muted); }
.purchase-flow-steps .is-done small { color: var(--green); }
.purchase-flow-facts { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 24px; }
.purchase-flow-facts div { min-width: 0; }
.purchase-flow-facts dt { color: var(--muted); font-size: 12px; margin-bottom: 6px; }
.purchase-flow-facts dd { margin: 0; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.purchase-flow-pending { color: var(--amber); line-height: 1.7; }
.purchase-flow-next { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.purchase-flow-next p { margin: 0; max-width: 64ch; color: var(--ink); line-height: 1.7; }
.purchase-flow-actions { display: flex; flex-wrap: wrap; flex-shrink: 0; gap: 8px; }
.order-detail-dialog .detail-header h2 { overflow-wrap: anywhere; }
@media (max-width: 700px) {
  .purchase-flow { padding: 16px; }
  .purchase-flow-heading { align-items: flex-start; }
  .purchase-flow-heading h3 { font-size: 17px; }
  .purchase-flow-steps { gap: 10px; font-size: 12px; }
  .purchase-flow-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; }
  .purchase-flow-next { flex-direction: column; align-items: stretch; gap: 14px; }
  .purchase-flow-actions { flex-shrink: 1; }
  .purchase-flow-actions button { min-height: 40px; }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; min-height: 100%; background: var(--canvas); color: var(--ink); }
body.booting > #login-screen, body.booting > #app-shell { visibility: hidden; }
button, input, select { font: inherit; }
button { color: inherit; transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
button:active:not(:disabled) { transform: translateY(1px); }
button:disabled { cursor: not-allowed; opacity: .55; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline: 2px solid rgba(40,103,158,.72); outline-offset: 2px; }
::selection { background: #cfe6f8; color: var(--navy-950); }
* { scrollbar-width: thin; scrollbar-color: #9db2c6 #edf2f6; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: #edf2f6; }
*::-webkit-scrollbar-thumb { border: 2px solid #edf2f6; border-radius: 8px; background: #9db2c6; }
*::-webkit-scrollbar-thumb:hover { background: #7692ac; }
.app-shell { min-height: 100vh; display: grid; grid-template: 68px 1fr / var(--sidebar-width) minmax(0, 1fr); transition: grid-template-columns var(--navigation-motion-duration) cubic-bezier(.22,.61,.36,1); }
body:not([data-role="owner"]) .owner-only { display: none !important; }
body:not([data-role="coach"]) .coach-only { display: none !important; }
body[data-role="owner"] .staff-only { display: none !important; }
body:not([data-role="manager"]) .manager-only { display: none !important; }
body[data-role="coach"] .management-only { display: none !important; }

.login-screen { min-height: 100vh; display: grid; place-items: center; padding: 24px; overflow: auto; background: radial-gradient(circle at 78% 18%, rgba(238,180,46,.13), transparent 30%), linear-gradient(145deg, var(--navy-950), var(--navy-800)); }
.login-stage { display: grid; width: min(520px, 100%); gap: 16px; justify-items: center; }
.login-card { width: min(420px, 100%); display: grid; gap: 18px; padding: 30px; border-radius: 16px; background: white; box-shadow: 0 24px 80px rgba(0,0,0,.28); }
.login-card h1 { margin: 5px 0 0; font-size: 27px; }
.login-card p { margin: 8px 0 0; color: var(--muted); line-height: 1.7; font-size: 13px; }
.login-card small { color: var(--muted); line-height: 1.6; }
.login-remember { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.login-remember input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--blue); flex: 0 0 auto; }
.login-remember-copy { display: grid; gap: 2px; }
.login-remember-copy strong { color: var(--ink); font-size: 13px; }
.login-remember-copy small { font-size: 11px; }
.login-logo { width: 52px; height: 52px; }
.login-logo img { width: 52px; height: 52px; }
.initialization-card { width: min(520px, 100%); }
.initialization-confirm { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; color: var(--ink); font-size: 13px; line-height: 1.6; }
.initialization-confirm input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--action); }
.login-legal { display: grid; justify-items: center; gap: 7px; color: white; font-size: 12px; text-align: center; }
.login-legal strong { color: white; font-size: 13px; letter-spacing: .01em; }
.login-legal nav { display: flex; align-items: center; justify-content: center; gap: 4px 18px; flex-wrap: wrap; }
.login-legal a { min-height: 32px; display: inline-flex; align-items: center; color: var(--gold-bright); font-weight: 700; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.login-legal a:hover { color: white; }
.login-legal p { margin: 0; color: white; font-variant-numeric: tabular-nums; }

.legal-page { min-height: 100vh; background: var(--canvas); color: var(--ink); line-height: 1.75; }
.legal-page ::selection { background: var(--gold-bright); color: var(--navy-950); }
.legal-header { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px max(24px, calc((100vw - 960px) / 2)); background: var(--navy-900); color: white; border-bottom: 1px solid var(--gold); }
.legal-brand { min-width: 0; display: flex; align-items: center; gap: 11px; color: white; text-decoration: none; }
.legal-brand img { width: 46px; height: 46px; flex: none; object-fit: contain; }
.legal-brand span { min-width: 0; display: grid; }
.legal-brand strong { font-size: 16px; line-height: 1.35; }
.legal-brand small { color: white; font-size: 11px; }
.legal-back { min-height: 40px; display: inline-flex; flex: none; align-items: center; padding: 0 14px; border: 1px solid var(--action); border-radius: var(--control-radius); color: white; font-size: 13px; font-weight: 700; text-decoration: none; }
.legal-back:hover { border-color: var(--gold); background: var(--navy-800); color: white; }
.legal-main { width: min(960px, calc(100% - 32px)); margin: 0 auto; padding: 32px 0 48px; }
.legal-status { display: grid; grid-template-columns: minmax(220px, auto) minmax(0, 1fr); align-items: center; gap: 8px 24px; margin-bottom: 18px; padding: 14px 18px; border: 1px solid var(--gold); border-radius: 16px; background: var(--amber-soft); color: var(--amber); }
.legal-status strong { font-size: 14px; }
.legal-status span { color: var(--amber); font-size: 13px; }
.legal-document { padding: clamp(24px, 5vw, 56px); border-radius: 16px; background: white; box-shadow: var(--shadow); }
.legal-title { max-width: 72ch; margin-bottom: 34px; }
.legal-title h1 { margin: 0 0 12px; color: var(--navy-900); font-size: clamp(30px, 5vw, 44px); line-height: 1.18; letter-spacing: -.025em; }
.legal-title p { margin: 0; color: var(--muted); font-size: 15px; }
.legal-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 38px; border-block: 1px solid var(--line); }
.legal-facts div { min-width: 0; padding: 14px 0; }
.legal-facts div:nth-child(odd) { padding-right: 24px; }
.legal-facts dt { color: var(--muted); font-size: 12px; font-weight: 700; }
.legal-facts dd { margin: 3px 0 0; color: var(--ink); font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }
.legal-document section { max-width: 72ch; margin-top: 34px; }
.legal-document h2 { margin: 0 0 10px; color: var(--navy-800); font-size: 19px; line-height: 1.45; }
.legal-document p { margin: 0; color: var(--ink); font-size: 15px; }
.legal-document ul { margin: 0; padding-left: 1.35em; color: var(--ink); font-size: 15px; }
.legal-document li + li { margin-top: 8px; }
.legal-document section p + p,
.legal-document ul + p { margin-top: 12px; }
.legal-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 22px max(24px, calc((100vw - 960px) / 2)); background: var(--navy-950); color: white; font-size: 12px; font-variant-numeric: tabular-nums; }

.topbar {
  grid-column: 1 / -1; display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 610px) auto;
  align-items: center; min-width: 0; background: radial-gradient(ellipse at 67% -70%, #123b63 0, #082645 36%, transparent 66%), linear-gradient(90deg, #03142c, var(--navy-900) 58%, #03152b); color: white;
  border-bottom: 1px solid rgba(238,180,46,.68); position: sticky; top: 0; z-index: 20; overflow: hidden;
  transition: grid-template-columns var(--navigation-motion-duration) cubic-bezier(.22,.61,.36,1);
}
.topbar { grid-row: 1; }
.topbar-clouds { position: absolute; z-index: 0; top: 0; right: 158px; width: min(45vw, 650px); height: 68px; color: var(--gold-bright); opacity: .34; pointer-events: none; }
.topbar-clouds .cloud-haze { stroke-width: 1; opacity: .6; }
.topbar-clouds .cloud-core { stroke-width: 1.65; }
.topbar-clouds .cloud-spiral { stroke-width: 1.85; }
.topbar-clouds .cloud-fold { stroke-width: 1.25; opacity: .86; }
.topbar-clouds .cloud-wave { stroke-width: 1.45; }
.topbar-clouds .wave-2 { opacity: .86; }
.topbar-clouds .wave-3 { opacity: .68; }
.topbar-clouds .wave-4 { opacity: .48; }
.topbar-clouds .wave-5 { opacity: .3; }
.brand, .global-search, .top-actions { position: relative; z-index: 1; }
.brand { height: 68px; display: flex; align-items: center; gap: 9px; padding: 0 13px; color: white; text-decoration: none; }
.brand-logo { width: 42px; height: 42px; display: block; flex: none; }
.brand-logo img { width: 100%; height: 100%; display: block; object-fit: contain; }
.brand-copy { min-width: 0; }
.brand-copy strong { display: block; font-size: 15px; line-height: 1.15; letter-spacing: .01em; }
.brand-copy small { display: block; margin-top: 3px; color: #d8e2ed; font-size: 9px; line-height: 1.2; }
.global-search { margin-left: 15px; height: 42px; display: flex; align-items: center; gap: 9px; padding: 0 13px; border: 1px solid #385675; border-radius: 9px; background: rgba(255,255,255,.075); color: #dbe6f3; backdrop-filter: blur(3px); box-shadow: inset 0 1px 0 rgba(255,255,255,.035); }
.global-search:focus-within { border-color: #6ea8d5; box-shadow: 0 0 0 3px rgba(90,151,199,.2); }
.global-search { min-width: 0; }
.global-search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: white; }
.global-search input::placeholder { color: #aeb9c9; }
.top-actions { justify-self: end; height: 100%; display: flex; align-items: center; gap: 7px; padding-right: 14px; }
.account-button { border: 0; background: transparent; color: white; cursor: pointer; }
.logout-button { min-height: 32px; padding: 0 9px; border: 1px solid rgba(143,174,204,.58); border-radius: 6px; background: rgba(2,13,29,.22); color: #e8eef6; cursor: pointer; }
.logout-button:hover { border-color: #8ec1e8; background: rgba(91,154,204,.14); color: white; }
.account-button:hover { background: rgba(255,255,255,.08); }
.account-button { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 9px; border-radius: 8px; font-weight: 600; }
.account-identity { display: grid; gap: 1px; min-width: 0; text-align: left; }
.account-identity strong { color: white; font-size: 13px; line-height: 1.15; white-space: nowrap; }
.account-identity small { color: #aebed0; font-size: 9px; font-weight: 500; line-height: 1.1; white-space: nowrap; }
.avatar { width: 29px; height: 29px; border-radius: 50%; display: grid; place-items: center; background: var(--orange); color: white; }
.chevron { color: #9fb0c4; }

.sidebar { grid-column: 1; grid-row: 2; position: sticky; top: 68px; align-self: start; height: calc(100vh - 68px); height: calc(100dvh - 68px); min-height: 0; overflow-y: auto; background: linear-gradient(180deg, var(--navy-900), #04172d); border-right: 1px solid #173b5c; padding: 8px 7px; display: flex; flex-direction: column; color: #d7e0eb; }
.collapse-button { height: 34px; border: 0; border-radius: 4px; background: rgba(255,255,255,.035); display: flex; align-items: center; justify-content: space-between; padding: 0 11px; cursor: pointer; color: #b8c5d4; font-size: 13px; font-weight: 600; }
.collapse-button:hover { background: rgba(255,255,255,.075); color: white; }
#side-navigation { margin-top: 5px; }
.nav-main { position: relative; width: 100%; min-height: 40px; display: grid; grid-template-columns: 29px 1fr; align-items: center; text-align: left; padding: 0 54px 0 8px; border: 0; border-radius: 0 5px 5px 0; background: transparent; color: #d2dce8; cursor: pointer; font-size: 14px; font-weight: 500; }
.nav-main:hover { background: rgba(255,255,255,.06); color: white; }
.nav-main.is-current { background: rgba(40,103,158,.28); color: #b8dcff; font-weight: 600; }
.nav-main.is-current::before { content: ""; position: absolute; left: -8px; top: 5px; bottom: 5px; width: 3px; border-radius: 0 3px 3px 0; background: #62a8df; box-shadow: 0 0 10px rgba(98,168,223,.35); }
.nav-icon { width: 23px; height: 23px; border: 1px solid #6f87a0; border-radius: 50%; color: #c3d0de; display: grid; place-items: center; font-size: 10px; }
.nav-main.is-current .nav-icon { border-color: #72b5e8; color: #9bcdf4; }
.nav-main em { position: absolute; right: 25px; top: 50%; transform: translateY(-50%); min-width: 22px; padding: 2px 6px; border-radius: 10px; background: var(--red); color: white; font-size: 11px; font-style: normal; text-align: center; }
.nav-main i { position: absolute; right: 9px; top: 50%; transform: translateY(-50%); color: #8fa4ba; font-style: normal; transition: transform .58s cubic-bezier(.22,1,.36,1); }
.nav-group.is-open .nav-main i { transform: translateY(-50%) rotate(180deg); }
.nav-status { color: #91a5ba; font-size: 10px; font-weight: 400; white-space: nowrap; }
.mobile-product-nav { display: none; }
.nav-children { position: relative; display: grid; grid-template-rows: 0fr; opacity: 0; visibility: hidden; overflow: hidden; margin: 0 0 3px 15px; padding-left: 14px; border-left: 1px solid #36536f; transform: translateY(-4px); transition: grid-template-rows .58s cubic-bezier(.22,1,.36,1), opacity .42s ease, transform .58s cubic-bezier(.22,1,.36,1), visibility 0s linear .58s; }
.nav-children-inner { min-height: 0; display: grid; overflow: hidden; padding: 2px 0; }
.nav-group.is-open .nav-children { grid-template-rows: 1fr; opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }
.nav-children button { min-height: 32px; border: 0; border-radius: 4px; background: transparent; text-align: left; padding: 0 10px; color: #aebdcd; cursor: pointer; position: relative; font-size: 13px; font-weight: 400; }
.nav-children button:hover { color: white; background: rgba(255,255,255,.045); }
.nav-children button::before { content: ""; position: absolute; left: -20px; width: 6px; height: 6px; border-radius: 50%; background: #58728f; }
.nav-children button.is-current { color: #b8dcff; background: rgba(40,103,158,.25); font-weight: 600; }
.nav-children button.is-current::before { background: #72b5e8; box-shadow: 0 0 0 3px rgba(114,181,232,.15); }
.sidebar-note { margin: auto 5px 3px; padding: 7px 8px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.06); border-radius: 3px; color: #8fa3b8; font-size: 10px; line-height: 1.4; }
.sidebar-note strong { display: none; }
.sidebar-note span { display: block; }

.content { grid-column: 2; grid-row: 2; min-width: 0; padding: 14px clamp(16px, 1.8vw, 24px) 32px; }
.content.is-view-leaving { animation: view-page-release var(--view-exit-duration) ease-in both; pointer-events: none; }
.content.is-view-entering { animation: view-page-arrive var(--view-enter-duration) cubic-bezier(.16,1,.3,1) both; pointer-events: none; }
@keyframes view-page-release { from { opacity: 1; } to { opacity: 0; } }
@keyframes view-page-arrive { from { opacity: 0; } to { opacity: 1; } }
.breadcrumbs { display: none; }
.breadcrumbs b { font-weight: 400; color: #bcc4ce; }
.page-heading { min-height: 36px; display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin: 0 0 8px; }
.page-heading > div:first-child:not(.row-actions) { display: none; }
.page-heading h1 { margin: 0; font-size: 28px; letter-spacing: -.02em; }
.page-heading p { margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.page-error { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: -8px 0 16px; padding: 13px 15px; border: 1px solid #efb4b4; border-radius: 8px; background: var(--red-soft); box-shadow: inset 0 3px 0 var(--red); }
.page-error[hidden] { display: none; }
.page-error strong { color: #8e2828; }
.page-error p { margin: 3px 0 0; color: #8e4b4b; font-size: 12px; }
.primary-button, .secondary-button, .text-button, .refresh-button { min-height: var(--control-height); border-radius: var(--control-radius); padding: 0 var(--control-padding-x); border: 1px solid transparent; cursor: pointer; font-size: var(--control-font-size); font-weight: 600; line-height: 1.2; }
.primary-button { background: var(--action); color: white; box-shadow: 0 2px 6px rgba(23,77,122,.16); }
.primary-button:hover { background: var(--action-dark); box-shadow: 0 4px 10px rgba(23,77,122,.2); }
.secondary-button { background: white; border-color: var(--control-border); }
.secondary-button:hover { border-color: var(--action); color: var(--action-dark); background: var(--action-softer); }
.caution-button { border-color: #d3b8b8; color: #8a3d3d; background: #fff; }
.caution-button:hover { border-color: #bb7777; color: #762c2c; background: #fff6f6; }
.export-button { display: inline-flex; min-width: 64px; align-items: center; justify-content: center; color: var(--action-dark); border-color: #aebfd0; background: #fff; }
.text-button { background: transparent; color: #657285; }

.summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)); gap: 12px; margin-bottom: 16px; }
.summary-grid article { min-height: 92px; padding: 13px 15px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 4px 14px rgba(23,38,58,.035); }
.summary-grid article:first-child { border-top: 2px solid rgba(242,106,19,.68); }
.summary-grid article > span { display: block; color: var(--muted); font-size: 13px; }
.summary-grid strong { display: block; margin: 6px 0 2px; font-size: 21px; font-variant-numeric: tabular-nums; }
.summary-grid small { color: #8994a3; }
.ui-secondary-summary { display: none !important; }
.approval-summary-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.approval-summary-strip article { min-height: 61px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.approval-summary-strip article:first-child { border-top: 2px solid rgba(242,106,19,.68); }
.approval-summary-strip article > span { display: block; color: var(--muted); font-size: 12px; white-space: nowrap; }
.approval-summary-strip strong { display: block; margin-top: 3px; font-size: 18px; line-height: 1; font-variant-numeric: tabular-nums; }
.approval-summary-strip small { display: none; }

.workspace-card, .detail-panel { background: var(--surface); border: 1px solid #d4dde7; border-radius: 6px; box-shadow: 0 2px 8px rgba(23,38,58,.025); }
.toolbar { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border-bottom: 2px solid var(--gold-bright); background: #fff; }
.business-toolbar { gap: 18px; }
.business-toolbar-left, .business-toolbar-right { min-width: 0; display: flex; align-items: center; gap: 10px; }
.business-toolbar-left { flex: 1 1 auto; justify-content: flex-start; }
.business-toolbar-right { flex: 0 0 auto; justify-content: flex-end; }
.business-toolbar-left .table-search { width: min(300px, 24vw); }
.table-section-title { flex: 0 0 auto; color: #26384d; font-size: 13px; font-weight: 700; white-space: nowrap; }
.table-section-note { color: #708196; font-size: 12px; }
#member-offer-config { margin-top: 16px; }
.date-range-controls { display: flex; align-items: center; gap: 7px; color: #687587; font-size: 12px; white-space: nowrap; }
.date-range-controls label { display: flex; align-items: center; gap: 7px; }
.date-range-controls b { font-weight: 400; }
.date-range-controls input { width: 132px; height: 36px; padding: 0 8px; border: 1px solid #ccd4dd; border-radius: 7px; background: white; color: var(--ink); }
.date-range-controls input:focus { border-color: var(--action); outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.date-range-trigger, .month-range-trigger { min-width: 210px; height: 36px; padding: 0 34px 0 11px; border: 1px solid #ccd4dd; border-radius: 7px; background: #fff; color: #34465b; cursor: pointer; font: inherit; text-align: left; position: relative; }
.date-range-trigger.is-placeholder, .month-range-trigger.is-placeholder { color: #8793a2; }
.date-range-trigger::after, .month-range-trigger::after { content: "▾"; position: absolute; right: 11px; color: #748195; }
.date-range-trigger:hover, .month-range-trigger:hover { border-color: #aebdca; }
.date-range-trigger:focus, .date-range-trigger:focus-visible, .month-range-trigger:focus, .month-range-trigger:focus-visible { outline: 0; box-shadow: none; }
.date-range-trigger[aria-expanded="true"], .month-range-trigger[aria-expanded="true"] { border-color: #d69a22; box-shadow: none; }
.approval-card-header { min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 7px 12px; border-bottom: 1px solid var(--line); }
.approval-filter-grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 8px 10px; width: 100%; padding: 9px 12px; border-bottom: 2px solid var(--gold-bright); background: #fff; }
.approval-filter-group { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; min-width: 0; }
.approval-search-group { width: 398px; }
.approval-date-group { width: 378px; }
.approval-type-group { width: 394px; }
#approval-subject-filter { width: 230px; }
#approval-applicant-filter { width: 160px; }
.approval-date-group .date-range-controls, .approval-date-group .date-range-trigger { width: 210px; min-width: 210px; }
.approval-date-group .inline-month-field { width: 160px; }
.approval-type-group .approval-select-field:first-child { width: 170px; }
.approval-type-group .approval-select-field:nth-child(2) { width: 150px; }
.approval-search-field, .approval-select-field { display: block; color: #687587; font-size: 11px; }
.approval-filter-grid label > span:not(.visually-hidden) { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: nowrap; }
.approval-filter-grid .date-range-controls { align-items: center; }
.approval-filter-grid .date-range-trigger { width: 210px; min-width: 210px; }
.approval-filter-grid .date-range-controls label { display: grid; gap: 4px; }
.approval-filter-grid .date-range-controls input { width: 132px; }
.approval-filter-grid .date-range-controls b { display: grid; height: 36px; place-items: center; }
.attendance-toolbar label > span:not(.visually-hidden) { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip: auto; white-space: nowrap; border: 0; }
.approval-search-field input, .approval-select-field input, .approval-select-field select { height: 36px; padding: 0 9px; border: 1px solid #ccd4dd; border-radius: 6px; background: white; color: var(--ink); outline: 0; }
.approval-search-field input:focus, .approval-select-field input:focus, .approval-select-field select:focus { border-color: #aebdca; outline: 0; box-shadow: none; }
.approval-search-field, .approval-select-field { min-width: 0; }
.clearable-filter-field { position: relative; }
.clearable-filter-field select { padding-right: 32px !important; }
.filter-clear-button { position: absolute; z-index: 2; top: 50%; right: 28px; width: 12px; height: 12px; display: grid; place-items: center; padding: 0; transform: translateY(-50%); border: 0; border-radius: 50%; background: transparent; color: #aeb8c3; cursor: pointer; font-size: 9px; line-height: 1; opacity: 0; pointer-events: none; transition: opacity 120ms ease-out, color 120ms ease-out, background-color 120ms ease-out; }
.clearable-filter-field:hover .filter-clear-button:not([hidden]), .clearable-filter-field:focus-within .filter-clear-button:not([hidden]) { opacity: 1; pointer-events: auto; }
.filter-clear-button:hover, .filter-clear-button:focus-visible { background: #edf1f5; color: var(--action-dark); }
.filter-clear-button:active:not(:disabled) { transform: translateY(-50%); }
.approval-select-field.inline-month-field { position: relative; display: flex; align-items: center; height: 36px; padding-left: 69px; border: 1px solid #ccd4dd; border-radius: 6px; background: #fff; cursor: pointer; }
.approval-filter-grid .approval-select-field.inline-month-field > span { position: absolute; left: 10px; color: #687587; font-size: 12px; pointer-events: none; }
.approval-select-field.inline-month-field > input { height: 32px; min-width: 0; padding: 0 7px 0 0; border: 0; background: transparent; box-shadow: none; cursor: pointer; }
.approval-select-field.inline-month-field:focus-within { border-color: #aebdca; box-shadow: none; }
.approval-search-button { min-width: 58px; min-height: var(--control-height); height: var(--control-height); padding: 0 var(--control-padding-x); }
.filter-select-native { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.filter-select-trigger { position: relative; display: flex; width: 100%; height: 36px; align-items: center; justify-content: space-between; gap: 10px; padding: 0 30px 0 11px; border: 1px solid #ccd4dd; border-radius: var(--control-radius); background: #fff; color: #34465b; cursor: pointer; font-size: var(--control-font-size); font-weight: 400; text-align: left; }
.filter-select-trigger::after { content: "▾"; position: absolute; right: 10px; color: #748195; transition: transform .36s cubic-bezier(.22,1,.36,1); }
.filter-select-trigger.is-placeholder { color: #8793a2; }
.filter-select-trigger:hover { border-color: #aebdca; }
.filter-select-trigger:focus, .filter-select-trigger:focus-visible { outline: 0; box-shadow: none; }
.filter-select-trigger[aria-expanded="true"] { border-color: #d69a22; box-shadow: none; }
.filter-select-trigger[aria-expanded="true"]::after { transform: rotate(180deg); }
.compact-filter-field .filter-select-trigger { min-width: 142px; height: 34px; border: 0; background: transparent; }
.period-control .filter-select-trigger { width: 138px; }
.clearable-filter-field .filter-select-trigger { padding-right: 46px; }
.filter-select-popover { position: fixed; z-index: 130; max-height: min(300px, calc(100vh - 24px)); overflow-y: auto; padding: 4px; border: 1px solid #cbd6e1; border-radius: 7px; background: #fff; box-shadow: 0 14px 34px rgba(8,24,42,.16); opacity: 0; visibility: hidden; transform: translateY(-6px); pointer-events: none; transform-origin: top center; transition: opacity .24s ease, transform .36s cubic-bezier(.22,1,.36,1), visibility 0s linear .36s; }
.filter-select-popover[hidden] { display: none; }
.filter-select-popover.is-open { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; transition-delay: 0s; }
.filter-select-option { display: flex; width: 100%; min-height: 34px; align-items: center; padding: 0 10px; border: 0; border-radius: 4px; background: transparent; color: #34465b; cursor: pointer; font-size: 12px; font-weight: 400; text-align: left; }
.filter-select-option:hover, .filter-select-option:focus-visible { outline: 0; background: #f0f4f8; }
.filter-select-option.is-selected { background: #e8f2fa; color: var(--action-dark); font-weight: 700; }
.toolbar .table-search:focus-within, .approval-filter-grid .table-search:focus-within { border-color: #aebdca; box-shadow: none; }
.toolbar .table-search input:focus, .toolbar .table-search input:focus-visible,
.approval-filter-grid input:focus, .approval-filter-grid input:focus-visible,
.attendance-toolbar input:focus, .attendance-toolbar input:focus-visible { outline: 0; box-shadow: none; }
.approval-action-cell { overflow: visible; text-align: center; vertical-align: middle; }
.approval-action-cell .approval-view-application { display: inline-flex; min-width: 54px; align-items: center; justify-content: center; margin: 0 auto; }
.approval-table { min-width: 1320px; }
.approval-table th:nth-child(1) { width: 10%; }
.approval-table th:nth-child(2) { width: 16%; }
.approval-table th:nth-child(3) { width: 20%; }
.approval-table th:nth-child(4) { width: 12%; }
.approval-table th:nth-child(5) { width: 9%; }
.approval-table th:nth-child(6) { width: 9%; }
.approval-table th:nth-child(7) { width: 17%; }
.approval-table th:nth-child(8) { width: 7%; }
.approval-info-cell { overflow-wrap: anywhere; color: var(--muted); }
.approval-detail-grid { display: grid; gap: 0; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.approval-detail-grid > div { display: grid; grid-template-columns: 128px 1fr; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.approval-detail-grid > div:last-child { border-bottom: 0; }
.approval-detail-grid > div > span { color: var(--muted); font-size: 12px; }
.approval-detail-grid > div > strong { color: var(--ink); font-size: 13px; font-weight: 600; white-space: pre-wrap; }
.approval-timeline { display: grid; gap: 0; margin-top: 14px; padding: 2px 0; }
.approval-timeline div { position: relative; display: grid; grid-template-columns: 18px 86px 1fr; gap: 8px; min-height: 48px; align-items: start; }
.approval-timeline div:not(:last-child)::after { content: ""; position: absolute; left: 6px; top: 15px; bottom: -2px; width: 1px; background: #cfd8e2; }
.approval-timeline i { width: 13px; height: 13px; border: 3px solid #fff; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 1px #e6a374; }
.approval-timeline span { color: var(--muted); font-size: 12px; }
.approval-timeline strong { font-size: 12px; line-height: 1.55; }
.table-search { height: 36px; width: min(300px, 34vw); border: 1px solid #ccd4dd; border-radius: var(--control-radius); display: flex; align-items: center; gap: 7px; padding: 0 var(--control-padding-x); color: #68788b; font-size: var(--control-font-size); }
.table-search:focus-within { border-color: var(--action); box-shadow: 0 0 0 3px var(--focus-ring); }
.table-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: var(--control-font-size); }
.table-search input::placeholder { color: #7b8999; opacity: 1; }
.filter-pills { display: flex; gap: 3px; padding: 3px; background: #f2f4f6; border-radius: 7px; }
.filter-pills button { min-height: 30px; border: 0; border-radius: 5px; background: transparent; padding: 5px 10px; color: #667386; cursor: pointer; font-size: var(--control-font-size); }
.filter-pills button.is-active { background: white; color: var(--ink); box-shadow: 0 1px 4px rgba(24,34,50,.09); font-weight: 700; }
.visually-hidden, .attendance-toolbar label > span.visually-hidden, .approval-filter-grid label > span.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.compact-filter-select { height: 36px; min-width: 138px; padding: 0 30px 0 var(--control-padding-x); border: 1px solid #ccd4dd; border-radius: var(--control-radius); background: #fff; color: #34465b; font-size: var(--control-font-size); }
.compact-filter-select option { font-size: var(--control-font-size); }
.compact-filter-select:focus { border-color: var(--action); outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.compact-filter-field { display: flex; align-items: center; height: 36px; border: 1px solid #ccd4dd; border-radius: var(--control-radius); background: #fff; }
.compact-filter-field { position: relative; transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease; }
.compact-filter-field:hover { border-color: #9dacbd; background: #fbfdff; }
.compact-filter-field:focus-within { border-color: var(--action); box-shadow: 0 0 0 3px var(--focus-ring); }
.compact-filter-field .compact-filter-select { min-width: 142px; height: 34px; padding: 0 36px 0 12px; border: 0; border-radius: inherit; appearance: none; background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2350657a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-position: right 12px center; background-repeat: no-repeat; box-shadow: none; color: #26384d; font: inherit; font-weight: 650; cursor: pointer; outline: 0; }
.compact-filter-field .compact-filter-select.is-placeholder { color: #8793a2; }
.compact-filter-field .compact-filter-select option { color: #26384d; }
.member-toolbar { justify-content: flex-start; flex-wrap: wrap; gap: 8px 10px; }
.member-toolbar .table-search { width: min(300px, 28vw); }
.member-toolbar .export-button { margin-left: auto; }
.member-toolbar .refresh-button { margin-left: 0; }
.member-result-count { color: #536277; font-size: 12px; font-weight: 650; white-space: nowrap; font-variant-numeric: tabular-nums; }
.member-filter-help { padding: 7px 12px; border-bottom: 1px solid #e2e8ee; background: #fbfcfd; color: #657285; font-size: 11px; }
.member-filter-help summary { width: max-content; color: #52657a; cursor: pointer; font-weight: 650; }
.member-filter-help p { max-width: 1100px; margin: 7px 0 2px; line-height: 1.65; }
.operations-settings-form { display: block; padding: 12px; }
.settings-field-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.settings-field-group { min-width: 0; display: grid; align-content: start; gap: 10px; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fbfcfd; }
.settings-field-group.is-single { grid-template-columns: minmax(0, 1fr); }
.settings-field-group.is-double { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-field-group.is-triple { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.settings-field-group legend { grid-column: 1 / -1; padding: 0 5px; color: var(--ink); font-size: 13px; font-weight: 700; }
.settings-field-group label, .settings-action-bar label { min-width: 0; display: grid; grid-template-columns: auto minmax(64px, 1fr) auto; gap: 8px; align-items: center; color: var(--muted); font-size: 12px; }
.settings-field-group input, .settings-field-group select, .settings-action-bar input { min-width: 0; width: 100%; height: 34px; padding: 0 9px; border: 1px solid #ccd4dd; border-radius: 6px; color: var(--ink); background: #fff; }
.settings-field-group input:focus, .settings-field-group select:focus, .settings-action-bar input:focus { border-color: var(--action); outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.settings-field-group .field-help { grid-column: 1 / -1; margin: -2px 0 0; color: #708095; font-size: 11px; line-height: 1.5; }
.settings-action-bar { display: grid; grid-template-columns: minmax(150px, 1fr) auto; gap: 12px; align-items: end; margin: 12px -12px -12px; padding: 10px 12px; border-top: 1px solid var(--line); background: #fbfcfd; }
.settings-action-bar .primary-button { justify-self: end; }
.settings-action-message { min-height: 0; margin: 0; align-self: center; }
.card-expiry-reminder-card { margin-bottom: 14px; }
.card-expiry-reminder-card .toolbar { justify-content: flex-start; }
.card-expiry-reminder-card .toolbar > strong { flex: 0 0 auto; }
#card-expiry-reminder-policy-meta { min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.expiry-reminder-policy-details { position: relative; flex: 0 0 auto; color: var(--muted); font-size: 11px; }
.expiry-reminder-policy-details summary { padding: 5px 8px; border-radius: 5px; color: var(--action-dark); cursor: pointer; font-weight: 650; list-style: none; }
.expiry-reminder-policy-details summary::-webkit-details-marker { display: none; }
.expiry-reminder-policy-details[open] > span { position: absolute; z-index: 8; top: calc(100% + 7px); right: 0; width: min(380px, 70vw); padding: 10px 12px; border: 1px solid #cbd6e1; border-radius: 6px; box-shadow: 0 8px 22px rgba(6, 26, 52, .13); background: #fff; color: #46586d; line-height: 1.55; }
.expiry-reminder-settings-form { display: block; padding: 12px; }
.expiry-reminder-fields { display: grid; grid-template-columns: minmax(170px, 1fr) repeat(3, minmax(150px, .85fr)); gap: 12px; align-items: end; }
.expiry-reminder-fields > label:not(.expiry-reminder-switch) { display: grid; grid-template-columns: auto minmax(64px, 1fr) auto; gap: 7px; align-items: center; color: var(--muted); font-size: 12px; }
.expiry-reminder-settings-form input[type="number"], .expiry-reminder-settings-form input[type="text"], .expiry-reminder-settings-form .expiry-reminder-reason input { min-width: 0; width: 100%; height: 34px; padding: 0 9px; border: 1px solid #ccd4dd; border-radius: 6px; color: var(--ink); background: #fff; }
.expiry-reminder-settings-form input:focus { border-color: var(--action); outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.expiry-reminder-switch { min-height: 34px; display: flex; align-items: center; gap: 9px; color: var(--ink); cursor: pointer; }
.expiry-reminder-switch input { width: 17px; height: 17px; accent-color: var(--action); }
.expiry-reminder-switch span, .expiry-reminder-switch strong, .expiry-reminder-switch small { display: block; }
.expiry-reminder-switch strong { font-size: 12px; }
.expiry-reminder-switch small { margin-top: 2px; color: var(--muted); font-size: 12px; font-weight: 400; }
.renewal-policy-help { margin: 0; color: #607287; font-size: 12px; line-height: 1.5; }
.expiry-reminder-reason { grid-template-columns: auto minmax(120px, 1fr) !important; }
.expiry-reminder-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fbfcfd; }
.expiry-reminder-summary[hidden] { display: none; }
.expiry-reminder-summary > span { min-height: 54px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; padding: 8px 12px; border-right: 1px solid var(--line); }
.expiry-reminder-summary > span:last-child { border-right: 0; }
.expiry-reminder-summary small { color: var(--muted); font-size: 11px; }
.expiry-reminder-summary strong { color: var(--ink); font-size: 19px; font-variant-numeric: tabular-nums; }
.expiry-reminder-table { min-width: 860px; table-layout: fixed; }
.expiry-reminder-table th:nth-child(1) { width: 22%; }
.expiry-reminder-table th:nth-child(2) { width: 15%; }
.expiry-reminder-table th:nth-child(3) { width: 20%; }
.expiry-reminder-table th:nth-child(4) { width: 35%; }
.expiry-reminder-table th:nth-child(5) { width: 8%; }
.system-backup-compact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .65fr) auto; gap: 14px; align-items: center; padding: 12px 14px; }
.system-backup-current { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 12px; align-items: baseline; }
.system-backup-current > span { color: var(--muted); font-size: 11px; }
.system-backup-current > strong { min-width: 0; overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
.system-backup-current > small { grid-column: 2; color: var(--muted); line-height: 1.45; overflow-wrap: anywhere; }
.system-backup-compact .form-message { min-height: 0; margin: 0; }
.dialog-error-message:not(:empty) { min-height: auto; padding: 10px 12px; border: 1px solid #efc4bd; border-radius: 6px; background: #fff5f3; color: #9f2f25; font-weight: 650; line-height: 1.5; }
.refresh-button { background: transparent; color: #657285; white-space: nowrap; }
.refresh-button:hover { color: var(--action-dark); background: var(--action-softer); }
.app-view, .workspace-card { min-width: 0; max-width: 100%; }
.table-wrap { min-width: 0; max-width: 100%; min-height: 0; overflow-x: auto; overscroll-behavior-inline: contain; }
.table-row-page-hidden { display: none !important; }
.table-pagination { position: sticky; left: 0; min-width: 100%; width: max-content; display: flex; align-items: center; justify-content: flex-end; gap: 18px; min-height: 48px; padding: 8px 12px; border-top: 1px solid var(--line); color: #657285; font-size: 12px; }
.table-pagination[hidden] { display: none !important; }
.table-pagination > div { display: flex; align-items: center; gap: 9px; }
.table-pagination strong { color: #34465b; font-weight: 650; font-variant-numeric: tabular-nums; }
.table-pagination button { min-width: 62px; height: 30px; padding: 0 10px; border: 1px solid #c8d4df; border-radius: 5px; background: #fff; color: var(--action-dark); cursor: pointer; }
.table-pagination button:hover:not(:disabled) { border-color: #83a9c8; background: var(--action-softer); }
.performance-totals { position: sticky; left: 0; min-width: 100%; width: max-content; display: flex; justify-content: flex-end; align-items: center; gap: 12px; min-height: 72px; padding: 14px 18px; border-top: 1px solid var(--line); color: #667589; font-size: 12px; }
.performance-totals span { display: inline-flex; align-items: baseline; gap: 6px; }
.performance-totals strong { color: #22344a; font-size: 15px; font-variant-numeric: tabular-nums; }
.performance-totals .performance-total { color: var(--orange-dark); font-size: 17px; }
.performance-totals b { color: #9aa6b4; font-weight: 500; }
.performance-totals .refund-note { color: #b34b43; }
.performance-totals .deferred-note { color: #80642a; }
.performance-totals .deferred-note strong { color: #80642a; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 760px; }
.col-member { width: 16%; } .col-course { width: 15%; } .col-coach { width: 9%; } .col-transaction-time { width: 13%; } .col-money { width: 12%; } .col-payment { width: 16%; } .col-entitlement { width: 13%; } .col-action { width: 6%; }
#sales-view .table-wrap > table { min-width: 1220px; }
th { height: 42px; background: #f7f9fb; text-align: center; padding: 0 10px; color: #5f6f81; font-size: 12px; font-weight: 600; white-space: nowrap; border-right: 1px solid #d9e1e9; }
td { height: 54px; padding: 9px 10px; border-top: 1px solid #dfe6ed; border-right: 1px solid #dfe6ed; text-align: center; vertical-align: middle; font-size: 12px; line-height: 1.5; overflow: hidden; }
th:last-child, td:last-child { border-right: 0; }
tbody tr { cursor: default; transition: background-color .15s ease; }
tbody tr:nth-child(even) { background: var(--table-stripe); }
tbody tr:hover { background: var(--table-hover); }
.cell-title { display: block; font-weight: 600; color: #263247; }
.cell-subtitle { display: block; margin-top: 4px; color: #8792a1; font-size: 11px; }
.product-meta-line { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.money { text-align: center; font-variant-numeric: tabular-nums; }
.finance-date-range { margin-left: auto; }
.finance-table { min-width: 980px; table-layout: fixed; }
.finance-table th, .finance-table td { text-align: center; vertical-align: middle; }
.finance-table .money { text-align: center; }
.store-expense-table { min-width: 980px; table-layout: fixed; }
.store-expense-table th, .store-expense-table td { text-align: center; vertical-align: middle; }
.finance-result-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.finance-result-panel { margin: 0; }
.finance-result-toolbar > div { display: flex; align-items: center; gap: 10px; }
.finance-result-toolbar .cell-subtitle { margin-top: 0; }
.finance-result-status { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 8px; border-radius: 5px; background: var(--amber-soft); color: var(--amber); font-size: 11px; font-weight: 600; }
.finance-result-status.is-complete { background: var(--green-soft); color: var(--green); }
.finance-calculation { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)) minmax(205px, 1.2fr); align-items: stretch; gap: 25px; padding: 18px; }
.finance-calculation-term { position: relative; min-width: 0; display: grid; align-content: center; gap: 8px; padding: 8px 10px; }
.finance-calculation-term:not(.finance-calculation-total)::after { content: "−"; position: absolute; top: 50%; right: -18px; color: #8c99a8; font-size: 22px; font-weight: 500; line-height: 1; transform: translateY(-50%); }
.finance-calculation-before-total::after { content: "="; color: var(--action); font-weight: 700; }
.finance-calculation-term > span { color: var(--muted); font-size: 12px; line-height: 1.4; }
.finance-calculation-term > strong { color: var(--navy-900); font-size: clamp(17px, 1.25vw, 21px); font-variant-numeric: tabular-nums; line-height: 1.2; white-space: nowrap; }
.finance-calculation-total { min-height: 76px; padding: 11px 16px; border: 1px solid #c9ddec; border-radius: 6px; background: var(--action-softer); box-shadow: inset 3px 0 0 var(--action); }
.finance-calculation-total > span { color: var(--action-dark); font-weight: 600; }
.finance-calculation-total > strong { color: var(--action-dark); font-size: clamp(20px, 1.55vw, 25px); }
.finance-result-note { margin: 0 18px 15px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.finance-expense-breakdown { margin-top: 16px; }
.finance-expense-breakdown .toolbar > div { display: flex; align-items: baseline; gap: 10px; }
.finance-expense-breakdown table { min-width: 620px; }
.finance-expense-breakdown tbody tr:last-child td { font-weight: 700; color: var(--navy); }
.expense-period-preview { display: block; margin: -2px 0 14px; padding: 10px 12px; border-radius: 8px; background: var(--action-softer); color: var(--muted); font-size: 12px; line-height: 1.55; }
.status { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 5px; font-size: 12px; white-space: nowrap; }
.status.unpaid { background: #f1f3f5; color: #596577; }
.status.partially_paid, .status.waiting { background: var(--amber-soft); color: var(--amber); }
.status.paid, .status.available { background: var(--green-soft); color: var(--green); }
.status.inactive { background: var(--red-soft); color: var(--red); }
.status.none { background: #f3f4f6; color: #758091; }
.row-action { display: inline-flex; min-height: 30px; align-items: center; justify-content: center; padding: 4px 9px; border: 1px solid #b9ccdc; border-radius: var(--control-radius); background: var(--action-softer); color: var(--action-dark); cursor: pointer; font-size: 11px; font-weight: 600; line-height: 1.2; }
.row-action:hover { border-color: var(--action); background: var(--action-soft); color: var(--action-dark); box-shadow: 0 2px 6px rgba(40,103,158,.1); }
.row-action:disabled { border-color: #d9dfe6; background: #f0f2f5; color: #9aa3af; cursor: not-allowed; box-shadow: none; }
.row-action-group { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; }
.inline-action { padding: 2px 5px; border: 0; background: transparent; color: var(--action); cursor: pointer; font-size: 12px; font-weight: 700; }
.inline-action:hover { color: var(--action-dark); text-decoration: underline; }
.empty-state { min-height: 58px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 13px 18px; border-top: 1px solid #dfe6ed; color: #8893a1; }
.empty-state[hidden] { display: none; }
.empty-icon, .empty-state p, .empty-state .secondary-button { display: none; }
.empty-state h2 { margin: 0; font-size: 12px; font-weight: 400; }

.detail-panel { margin-top: 12px; padding: 15px 17px; }
.order-detail-dialog { width: min(1120px, calc(100vw - 48px)); padding: 18px 20px; }
.detail-header { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding-right: 38px; }
.eyebrow { color: var(--orange-dark); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.detail-header h2, .dialog-heading h2 { margin: 3px 0; font-size: 17px; line-height: 1.3; }
.detail-header p, .dialog-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.dialog-close { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; cursor: pointer; color: #748195; font-size: 22px; line-height: 1; }
.dialog-close:hover { border-color: #b8cadb; background: var(--action-soft); color: var(--action-dark); }
.order-detail-close { position: absolute; top: 0; right: 0; }
.detail-context { display: flex; align-items: center; gap: 7px; margin-top: 8px; color: var(--muted); font-size: 12px; }
.detail-context > span:not(.status) { padding-right: 8px; border-right: 1px solid var(--line); }
.detail-header-actions { display: flex; align-items: center; gap: 7px; flex: none; }
.detail-header-actions .primary-button, .detail-header-actions .secondary-button { min-height: var(--control-height); padding: 0 var(--control-padding-x); }
.detail-tabs { display: flex; gap: 20px; margin-top: 11px; border-bottom: 1px solid var(--line); }
.detail-tabs button { padding: 10px 2px; border: 0; border-bottom: 2px solid transparent; background: transparent; cursor: pointer; color: #6b7788; }
.detail-tabs button.is-active { color: var(--action-dark); border-bottom-color: var(--action); font-weight: 700; }
.tab-panel { padding: 11px 2px 2px; }
.timeline { list-style: none; padding: 0; margin: 0; }
.timeline li { display: grid; grid-template-columns: 130px 105px 1fr; gap: 12px; padding: 9px 6px; border-bottom: 1px solid #edf0f3; align-items: baseline; }
.timeline li:last-child { border-bottom: 0; }
.timeline time { color: #667386; font-variant-numeric: tabular-nums; }
.timeline strong { font-variant-numeric: tabular-nums; }
.timeline span { color: #6f7b8c; }
.notice-panel { padding: 15px; border-radius: 8px; background: #f7f8f9; color: #596678; line-height: 1.7; }
.notice-panel strong { color: var(--ink); }

dialog { width: min(720px, calc(100vw - 32px)); max-height: calc(100vh - 42px); border: 1px solid #d8dee6; border-radius: 8px; padding: 0; color: var(--ink); font-size: 13px; box-shadow: 0 20px 54px rgba(7,17,30,.22); overflow: auto; }
dialog::backdrop { background: rgba(8,17,31,.42); backdrop-filter: blur(1px); }
dialog form { padding: 0 20px 16px; }
.small-dialog { width: min(560px, calc(100vw - 32px)); }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
dialog form > .dialog-heading { margin: 0 -20px 16px; padding: 16px 18px 13px 20px; border-bottom: 1px solid #e2e7ed; background: #fbfcfd; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; }
.form-section-title { display: flex; align-items: baseline; gap: 9px; margin-top: 3px; padding: 3px 0 7px; border-bottom: 1px solid #d8e2eb; }
.form-section-title strong { color: #26364a; font-size: 14px; font-weight: 700; }
.form-section-title span { color: var(--muted); font-size: 11px; font-weight: 400; }
.checkbox-field { display:flex!important; flex-direction:row!important; align-items:center; gap:9px!important; align-self:end; min-height:42px; }
.checkbox-field input { width:18px!important; height:18px!important; margin:0; }
.form-grid .checkbox-field[hidden], .form-grid > label[hidden], .stacked-field[hidden] { display:none!important; }
.leave-history-card { margin-top:16px; }
.leave-card-table,.leave-table { min-width:920px; }
.form-grid > label, .stacked-field { display: grid; gap: 6px; }
#gift-card-form .gift-card-entitlement-field { align-content: start; }
.form-readonly-field { display: grid; gap: 6px; align-content: start; }
.form-readonly-field > span { color: #465367; font-size: 12px; font-weight: 600; }
.form-readonly-field > strong { min-height: 38px; display: flex; align-items: center; padding: 0 10px; border: 1px solid #d8e0e8; border-radius: 4px; background: #f7f9fb; color: #25364a; font-size: 13px; font-weight: 600; }
.form-linkage-field { display: grid; gap: 6px; }
.form-linkage-field > span { color: #465367; font-size: 12px; font-weight: 600; }
.form-linkage-summary { min-height: 58px; display: grid; align-content: center; gap: 4px; padding: 9px 11px; border: 1px solid #d8e0e8; border-radius: 4px; background: #f7f9fb; }
.form-linkage-summary strong { color: #25364a; font-size: 13px; font-weight: 600; line-height: 1.45; }
.form-linkage-summary small { color: var(--muted); font-size: 11px; line-height: 1.55; }
.order-installment-field { display: grid; gap: 7px; }
.order-installment-field[hidden] { display: none; }
.form-grid label > span, .stacked-field > span { color: #465367; font-size: 12px; font-weight: 600; }
.member-current-phone { display: grid; grid-template-columns: 72px 1fr auto; align-items: center; gap: 10px; min-height: 38px; padding: 0 2px; border-bottom: 1px solid var(--line); }
.member-current-phone > span { color: #465367; font-size: 12px; font-weight: 600; }
.member-current-phone > strong { font-size: 13px; font-weight: 600; }
.member-current-phone .text-button, .member-edit-profile-switch { min-height: 30px; padding-inline: 6px; color: var(--action-dark); }
.member-edit-profile-switch { justify-self: start; }
.form-grid label > span i { color: #8b96a4; font-size: 11px; font-weight: 400; font-style: normal; }
.form-grid input, .form-grid select, .stacked-field input, .stacked-field select { width: 100%; height: 38px; border: 1px solid #cbd3dd; border-radius: 4px; padding: 0 10px; outline: 0; background: white; }
.form-grid input:focus, .form-grid select:focus, .stacked-field input:focus, .stacked-field select:focus { border-color: var(--action); box-shadow: 0 0 0 3px var(--focus-ring); }
.form-grid select:disabled { background: #f2f4f6; color: #7d8898; }
.field-help { color: var(--muted); font-size: 11px; font-weight: 400; }
.deposit-commitment { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr); align-items: end; gap: 14px; padding: 12px 14px; border: 1px solid #d9e1e9; border-radius: 5px; background: #f7f9fb; }
.deposit-commitment[hidden] { display: none; }
.deposit-commitment p { margin: 0 0 7px; color: #526174; font-size: 12px; line-height: 1.6; }
.deposit-commitment label { margin: 0; }
@media (max-width: 680px) { .deposit-commitment { grid-template-columns: 1fr; align-items: stretch; } }
.member-table { min-width: 1080px; table-layout: auto; }
.member-table th:nth-child(1) { width: 10rem; }
.member-table th:nth-child(2) { width: 10rem; }
.member-table th:nth-child(3) { width: 7.5rem; }
.member-table th:nth-child(4) { width: 8rem; }
.member-table th:nth-child(5) { width: auto; }
.member-table th:nth-child(6) { width: 10rem; }
.member-table th:nth-child(7) { width: 10.5rem; }
.member-list-person { display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding-left: 8px; text-align: left; }
.member-list-person .member-link { text-align: left; }
.table-row-actions { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; }
.table-row-actions a.row-action { text-decoration: none; }
.product-table th:nth-child(1) { width: 23%; }
.product-table th:nth-child(2) { width: 12%; }
.product-table th:nth-child(3) { width: 21%; }
.product-table th:nth-child(4) { width: 15%; }
.product-table th:nth-child(5) { width: 13%; }
.product-table th:nth-child(6) { width: 16%; }
.attendance-table { table-layout: fixed; }
.attendance-appointment-table { width: 100%; min-width: 1040px; table-layout: auto; }
.attendance-appointment-table col { width: auto; }
.attendance-appointment-table col:first-child { width: 44px; }
.attendance-col-sequence { width: 44px; } .attendance-col-member { width: 96px; } .attendance-col-course { width: auto; } .attendance-col-entitlement { width: 100px; } .attendance-col-coach { width: 84px; } .attendance-col-time { width: auto; } .attendance-col-created { width: auto; } .attendance-col-status { width: 104px; } .attendance-col-actions { width: 160px; }
.attendance-appointment-table td:nth-child(3) .cell-title { max-width: 220px; margin-inline: auto; white-space: normal; overflow-wrap: anywhere; }
.attendance-appointment-table th:nth-child(1), .attendance-appointment-table td:nth-child(1), .attendance-appointment-table th:nth-child(5), .attendance-appointment-table td:nth-child(5), .attendance-appointment-table th:nth-child(6), .attendance-appointment-table td:nth-child(6), .attendance-appointment-table th:nth-child(7), .attendance-appointment-table td:nth-child(7), .attendance-appointment-table th:nth-child(8), .attendance-appointment-table td:nth-child(8) { white-space: nowrap; }
.attendance-appointment-table td:nth-child(6), .attendance-appointment-table td:nth-child(7) { font-variant-numeric: tabular-nums; }
.attendance-appointment-table td:nth-child(2) { white-space: nowrap; }
.attendance-class-table { min-width: 1480px; }
.class-col-sequence { width: 54px; } .class-col-member { width: 105px; } .class-col-course { width: 260px; } .class-col-entitlement { width: 190px; } .class-col-coach { width: 90px; } .class-col-time { width: 150px; } .class-col-method { width: 108px; } .class-col-duration { width: 86px; } .class-col-status { width: 82px; } .class-col-actions { width: 224px; }
.attendance-appointment-table th:nth-child(4), .attendance-appointment-table td:nth-child(4), .attendance-class-table th:nth-child(4), .attendance-class-table td:nth-child(4) { white-space: nowrap; font-variant-numeric: tabular-nums; }
.sequence-cell { color: #667386; font-variant-numeric: tabular-nums; font-weight: 650; }
.attendance-table .row-action-group { flex-wrap: nowrap; white-space: nowrap; gap: 5px; }
.attendance-table .row-action { min-width: 62px; padding-inline: 8px; }
.attendance-appointment-table .row-action-group { flex-wrap: wrap; }
.attendance-table td:nth-child(2), .attendance-table td:nth-child(3), .attendance-table td:nth-child(4), .attendance-table td:nth-child(5) { overflow-wrap: anywhere; }
.attendance-appointment-table td:nth-child(4) { white-space: normal; }
@media (min-width: 761px) {
  .attendance-table th:last-child, .attendance-table td:last-child { position: sticky; right: 0; z-index: 1; border-left: 1px solid var(--line); background: var(--surface); }
  .attendance-table th:last-child { background: #f7f9fb; }
  .attendance-table tbody tr:nth-child(even) td:last-child { background: var(--table-stripe); }
  .attendance-table tbody tr:hover td:last-child { background: var(--table-hover); }
  .attendance-table .attendance-row-highlight td:last-child { animation: attendance-action-highlight .85s cubic-bezier(.2,.7,.2,1); }
}
@keyframes attendance-action-highlight { from { background: #dceffc; } }
.row-actions { display: flex; gap: 8px; align-items: center; }
td.row-actions { display: table-cell; overflow: visible; text-align: center; vertical-align: middle; }
td.row-actions > button { margin: 2px; }
td.row-actions > span { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; }
.full-row { grid-column: 1 / -1; }
.payment-arrangement { min-width: 0; margin: 0; padding: 0; border: 0; }
.payment-arrangement legend { margin-bottom: 7px; color: #465367; font-size: 13px; font-weight: 700; }
.installment-plans { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 2px 2px 4px; border: 0; background: transparent; }
.installment-plans[hidden], .installment-amount-grid[hidden] { display: none; }
.installment-amount-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.installment-amount-grid label { display: grid; gap: 7px; }
.installment-amount-grid label > span { color: #465367; font-size: 12px; font-weight: 700; }
.installment-plans-heading, .installment-plan-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.installment-plans-heading h3 { margin: 0; color: #152d47; font-size: 16px; font-weight: 800; }
.installment-plans-heading p { margin: 4px 0 0; color: #607086; font-size: 12px; }
#installment-plan-editors { display: grid; gap: 0; }
.installment-plan-editor { display: grid; gap: 11px; padding: 14px 0; border-top: 1px solid #dce4ec; }
.installment-plan-editor-heading label { display: flex; align-items: center; gap: 8px; color: #465367; font-size: 12px; font-weight: 700; }
.installment-plan-editor-heading select { width: 92px; height: 36px; border: 1px solid #cbd3dd; border-radius: 5px; padding: 0 8px; background: #fff; }
.installment-plan-editor input { width: 100%; height: 40px; border: 1px solid #cbd3dd; border-radius: 5px; padding: 0 10px; outline: 0; background: #fff; }
.installment-plan-editor input:focus, .installment-plan-editor select:focus { border-color: var(--action); box-shadow: 0 0 0 3px var(--focus-ring); }
.product-form-layout { display: grid; gap: 16px; }
#product-dialog { width: min(920px, calc(100vw - 32px)); }
.product-form-section { min-width: 0; padding: 0 16px 18px; border: 1px solid #ccd8e4; border-radius: 8px; background: #fff; overflow: hidden; }
.product-form-section-heading { display: flex; align-items: center; min-height: 64px; margin: 0 -16px 18px; padding: 11px 16px 10px; border-bottom: 1px solid #ccd8e4; background: #f2f5f8; }
.product-form-section-heading h3 { margin: 0; color: #152d47; font-size: 16px; font-weight: 800; line-height: 1.3; }
.product-form-section-heading h3::after { content: ""; display: block; width: 28px; height: 2px; margin-top: 7px; border-radius: 1px; background: var(--action); }
.product-form-section-heading p { margin: 5px 0 0; color: #607086; font-size: 12px; line-height: 1.45; }
.confirmation-body { padding: 18px 20px 8px; }
.confirmation-body:not(:has(> :not([hidden]))) { display: none; }
.product-section-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px 18px; }
.product-section-grid > label { display: grid; gap: 6px; }
.product-section-grid label > span { color: #465367; font-size: 12px; font-weight: 600; }
.product-section-grid input, .product-section-grid select { width: 100%; height: 40px; border: 1px solid #cbd3dd; border-radius: 5px; padding: 0 10px; outline: 0; background: white; }
.product-section-grid input:focus, .product-section-grid select:focus { border-color: var(--action); box-shadow: 0 0 0 3px var(--focus-ring); }
.product-section-grid input[type="file"] { height: auto; min-height: 44px; padding: 7px 9px; color: #24384f; font-size: 14px; line-height: 1.5; }
.product-section-grid input[type="file"]::file-selector-button { min-height: 30px; margin-right: 10px; border: 1px solid #9fb5ca; border-radius: 5px; padding: 0 12px; background: #f3f7fb; color: #174a78; font: inherit; font-weight: 700; cursor: pointer; }
.contract-template-field { padding: 12px; border: 1px solid #d5e0ea; border-radius: 6px; background: #f8fafc; }
.contract-template-field.is-disabled { opacity: .62; }
.contract-template-field > .text-button { display: block; width: fit-content; margin: 6px 0; }
.contract-template-field > .field-help, .contract-template-field > .contract-template-status { display: block; }
.contract-template-status { color: #1c4f79; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.contract-template-field > .field-label { color: #465367; font-size: 12px; font-weight: 600; }
.contract-file-picker { display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: center; min-height: 44px; border: 1px solid #cbd3dd; border-radius: 5px; padding: 6px; background: #fff; }
.contract-file-picker input[type="file"][hidden] { display: none !important; }
.contract-file-select-button { min-height: 32px; border: 1px solid #9fb5ca; border-radius: 5px; padding: 0 13px; background: #f3f7fb; color: #174a78; font: inherit; font-weight: 700; cursor: pointer; }
.contract-file-select-button:hover { border-color: #6e91b1; background: #eaf2f9; }
.contract-file-select-button:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.contract-file-select-button:disabled { cursor: not-allowed; opacity: .55; }
.contract-file-name { min-width: 0; padding: 0 10px; color: #24384f; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contract-template-status.is-selected { color: #17643a; animation: contract-file-confirm 220ms cubic-bezier(.16,1,.3,1); }
@keyframes contract-file-confirm { from { transform: translateY(2px); opacity: .55; } to { transform: translateY(0); opacity: 1; } }
.fixed-requirement { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fixed-requirement > span { display: grid; gap: 3px; padding: 11px 12px; border: 1px solid #d5e0ea; border-radius: 6px; background: #f8fafc; }
.fixed-requirement strong { color: #24384f; font-size: 13px; }
.fixed-requirement small { color: #607086; font-size: 12px; }
.member-requirement-grid .checkbox-field.is-disabled { opacity: .55; }
.platform-connection-list { display: grid; }
.online-platform-settings-card { max-width: 1120px; }
.platform-connection-row { display: grid; grid-template-columns: minmax(240px, 320px) max-content minmax(180px, 1fr) max-content; align-items: center; gap: 16px; padding: 12px 16px; border-bottom: 1px solid #dbe3eb; }
.platform-connection-row:has(> button:nth-of-type(2)) { grid-template-columns: minmax(240px, 320px) max-content minmax(180px, 1fr) max-content max-content; }
.platform-connection-row:last-child { border-bottom: 0; }
.platform-connection-row > div { display: grid; gap: 4px; }
.platform-connection-row > div strong { color: #193653; font-size: 15px; }
.platform-connection-row > div small, .platform-connection-row > p { margin: 0; color: #607086; font-size: 12px; line-height: 1.45; }
.platform-connection-message { min-height: 22px; margin: 0; padding: 0 14px 12px; }
.platform-offer-workspace { min-width: 0; }
.platform-offer-toolbar .table-search { width: min(320px, 35vw); }
.platform-offer-toolbar .compact-filter-field { min-width: 148px; }

#settings-view > .page-heading { min-height: 52px; justify-content: space-between; }
#settings-view > .page-heading > div:first-child { display: block; }
#settings-view > .page-heading h1 { font-size: 20px; letter-spacing: 0; }
#settings-view > .page-heading p { margin-top: 3px; font-size: 12px; }
.settings-category-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #d4dde7; border-radius: 6px; background: #f5f7fa; }
.settings-category-nav button { position: relative; min-width: 0; min-height: 56px; padding: 8px 14px; border: 0; background: transparent; color: #516176; cursor: pointer; font: inherit; text-align: left; transition: background-color 160ms ease-out, color 160ms ease-out, box-shadow 220ms cubic-bezier(.16,1,.3,1); }
.settings-category-nav button + button { border-left: 1px solid #dce3eb; }
.settings-category-nav button:hover { background: #eef3f7; color: #20364f; }
.settings-category-nav button:focus-visible { z-index: 1; outline: 2px solid var(--action); outline-offset: -3px; }
.settings-category-nav button.is-active { background: #fff; color: var(--action-dark); box-shadow: inset 0 -3px var(--gold-bright); }
.settings-category-nav strong, .settings-category-nav small { display: block; }
.settings-category-nav strong { font-size: 14px; line-height: 1.35; }
.settings-category-nav small { margin-top: 4px; color: #748296; font-size: 11px; line-height: 1.4; }
.settings-category-nav button.is-active small { color: #5d7086; }
.settings-category-context { display: flex; min-height: 58px; align-items: center; margin-bottom: 12px; padding: 10px 14px; border: 1px solid #d4dde7; border-top: 0; border-radius: 0 0 6px 6px; background: #fff; }
.settings-category-context h2 { margin: 0; color: #20364f; font-size: 15px; line-height: 1.35; }
.settings-category-context p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.settings-accessible-context { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#settings-view .workspace-card > .toolbar { min-height: 44px; }
#settings-view .form-message:empty { display: none; }
.settings-category-item:not([hidden]) { margin-top: 12px; }
.settings-category-item[hidden] { display: none; }

.public-content-settings-card { overflow: hidden; }
.public-content-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.public-content-form { min-width: 0; padding: 16px; }
.public-content-form + .public-content-form { border-left: 1px solid var(--line); }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.section-heading h2 { margin: 0 0 4px; color: var(--ink); font-size: 15px; line-height: 1.35; }
.section-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.public-content-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.public-content-fields label, .public-profile-review-item label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; }
.public-content-fields > .is-wide { grid-column: 1 / -1; }
.public-content-fields > label { align-content: start; }
.employee-profile-panel { padding: 20px; scroll-margin-top: 85px; }
.employee-table .row-actions { flex-wrap: wrap; justify-content: flex-start; }
.employee-table .row-action, #public-profile-review-count { white-space: nowrap; }
.employee-profile-panel fieldset { min-width: 0; margin: 14px 0; padding: 14px; border: 1px solid var(--line); border-radius: var(--control-radius); }
.employee-profile-panel legend { padding: 0 6px; font-weight: 700; }
.employee-profile-panel textarea { width: 100%; font: inherit; resize: vertical; }
.employee-profile-panel fieldset > button { margin-top: 12px; }
.employee-profile-panel .inline-check { display: inline-flex; gap: 8px; align-items: center; }
.employee-profile-panel .inline-check input { width: auto; }
.employee-profile-photo { display: block; max-width: min(160px, 100%); max-height: 180px; object-fit: contain; margin: 12px 0; }
.store-location-field { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: var(--control-radius); }
.store-location-field legend { color: var(--ink); font-size: 12px; font-weight: 600; padding: 0 4px; }
.store-location-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 10px 0; }
.public-content-fields .store-location-confirm { display: flex; align-items: flex-start; gap: 8px; line-height: 1.6; }
.public-content-fields .store-location-confirm input { width: 16px; height: 16px; padding: 0; margin: 2px 0; flex-shrink: 0; accent-color: var(--action); }
.store-location-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 8px; }
.store-location-footer p { flex: 1; min-width: 160px; margin: 0; }
.store-location-footer button { min-height: 32px; }
.public-content-fields input, .public-content-fields select, .public-content-fields textarea, .public-profile-review-item input { min-width: 0; width: 100%; border: 1px solid #ccd4dd; border-radius: var(--control-radius); background: #fff; color: var(--ink); font: inherit; }
.public-content-fields input, .public-content-fields select, .public-profile-review-item input { height: 36px; padding: 0 10px; }
.public-content-fields textarea { resize: vertical; min-height: 76px; padding: 9px 10px; line-height: 1.55; }
.public-content-fields input:focus, .public-content-fields select:focus, .public-content-fields textarea:focus, .public-profile-review-item input:focus { border-color: var(--action); outline: 0; box-shadow: 0 0 0 3px var(--focus-ring); }
.business-hours-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.business-hours-field legend { margin-bottom: 6px; color: var(--muted); font-size: 12px; }
.business-hours-range { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: 8px; }
.business-hours-range label { gap: 4px; }
.business-hours-range label span { color: var(--muted); font-size: 11px; }
.business-hours-range input { font-variant-numeric: tabular-nums; }
.business-hours-separator { align-self: end; min-height: 36px; display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.business-hours-field .field-help { margin: 6px 0 0; }
.public-wechat-qr-field { display: grid; gap: 10px; padding-block: 2px; }
.public-wechat-qr-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.public-wechat-qr-heading strong { color: var(--ink); font-size: 12px; }
.public-wechat-qr-heading p, .public-wechat-qr-actions p { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.public-wechat-qr-manager { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; align-items: center; min-width: 0; padding: 12px; border: 1px solid #d5dde6; border-radius: 8px; background: #f8fafc; }
.public-wechat-qr-preview { display: grid; width: 112px; aspect-ratio: 1; place-items: center; overflow: hidden; border: 1px solid #d5dde6; border-radius: 7px; background: #fff; }
.public-wechat-qr-preview img { width: 100%; height: 100%; object-fit: contain; }
.public-wechat-qr-preview > div { display: grid; gap: 5px; padding: 12px; text-align: center; }
.public-wechat-qr-preview > div strong { color: #526276; font-size: 11px; }
.public-wechat-qr-preview > div span { color: #788697; font-size: 10px; line-height: 1.45; }
.public-wechat-qr-actions { min-width: 0; }
.public-wechat-qr-actions > strong { color: var(--ink); font-size: 13px; overflow-wrap: anywhere; }
.public-wechat-qr-actions .row-actions { justify-content: flex-start; margin-top: 11px; }
.public-wechat-qr-actions button { min-height: 34px; }
.public-wechat-qr-field.is-pending .public-wechat-qr-manager { border-color: #8eaecb; background: #f3f8fc; }
.public-content-form > .primary-button { display: block; margin-left: auto; }

/* Scoped desktop operation surfaces: identity -> details; contact -> hours -> WeChat. */
#employee-list-page { display: grid; gap: 16px; }
.employee-mobile-link-card { display: grid; gap: 14px; padding: 20px; }
.employee-mobile-link-heading { margin: 0; align-items: flex-start; }
.employee-mobile-link-heading h2 { margin: 0 0 5px; font-size: 18px; }
.employee-mobile-link-heading p { margin: 0; color: var(--muted); line-height: 1.6; }
.employee-mobile-link-controls { display: grid; grid-template-columns: minmax(240px, 420px) auto; align-items: end; gap: 14px 20px; }
.employee-mobile-link-controls label { display: grid; gap: 7px; font-size: 14px; font-weight: 700; }
.employee-mobile-link-controls select { width: 100%; min-height: 40px; padding: 8px 34px 8px 12px; border: 1px solid var(--line); border-radius: var(--control-radius); background: var(--surface); color: var(--ink); font: inherit; }
.employee-mobile-link-actions { align-items: center; justify-content: flex-start; flex-wrap: wrap; }
.employee-mobile-link-actions button { min-height: 40px; margin: 0; }
.employee-mobile-link-card .field-help, .employee-mobile-link-card .form-message { margin: 0; }
@media (max-width: 820px) {
  .employee-mobile-link-controls { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .employee-mobile-link-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .employee-mobile-link-actions button { width: 100%; }
}
.employee-profile-panel { padding: 24px; }
.employee-profile-panel h1 { margin: 0; font-size: 22px; color: var(--ink); }
.employee-detail-identity { margin: 12px 0 20px; color: var(--muted); line-height: 1.6; }
.employee-profile-panel .public-content-fields { gap: 16px 24px; }
.employee-profile-panel .public-content-fields label { font-size: 14px; }
.employee-profile-panel .public-content-fields input[type=month] { max-width: 200px; }
.employee-profile-panel .primary-button { width: auto; min-height: 40px; margin-top: 16px; }
.employee-publication-toggle { display: inline-flex; gap: 8px; align-items: center; min-height: 40px; cursor: pointer; white-space: nowrap; }
.employee-publication-toggle input { width: 18px; height: 18px; accent-color: var(--action); }
.employee-publication-toggle:has(input:disabled) { cursor: default; color: var(--muted); }
.employee-publication-reason { display: block; max-width: 18em; margin: 2px auto 0; color: #58697d; font-size: 12px; line-height: 1.5; white-space: normal; }
.employee-profile-panel fieldset { margin: 20px 0 0; padding: 0; border: 0; }
.employee-profile-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 320px); align-items: start; gap: 32px; }
.employee-profile-main { display: grid; gap: 24px; min-width: 0; }
.employee-profile-main > label { display: grid; gap: 8px; color: var(--ink); font-size: 14px; }
.employee-profile-start input { width: 190px; max-width: 100%; }
.employee-profile-main input, .employee-profile-main textarea { min-width: 0; min-height: 40px; padding: 9px 12px; border: 1px solid #ccd4dd; border-radius: 6px; font: inherit; color: var(--ink); background: var(--surface); }
.employee-profile-main input:focus, .employee-profile-main textarea:focus { outline: 2px solid var(--action); outline-offset: 2px; }
.employee-items-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.employee-profile-panel h2 { margin: 0; color: var(--ink); font-size: 15px; }
.employee-items-heading > span, .employee-profile-panel .field-help { color: #58697d; font-size: 12px; line-height: 1.6; }
.employee-item-editor .field-help { margin: 6px 0 10px; }
.employee-item-editor[data-profile-items=specialties] { max-width: 480px; }
.employee-item-editor [data-item-rows] { display: grid; gap: 8px; }
.employee-item-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.employee-item-row input { width: 100%; font-size: 14px; }
.employee-profile-panel .employee-item-remove, .employee-profile-panel .employee-item-add { min-height: 40px; padding: 8px 12px; }
.employee-item-add { margin-top: 6px; }
.employee-profile-save { padding-top: 4px; }
.employee-profile-save .primary-button { margin-top: 8px; white-space: normal; }
.employee-photo-editor { min-width: 0; padding-left: 24px; border-left: 1px solid var(--line); }
.employee-photo-frame { display: grid; place-items: center; aspect-ratio: 3 / 4; margin: 12px 0; overflow: hidden; border-radius: 8px; background: var(--canvas); }
.employee-photo-frame .employee-profile-photo { grid-area: 1 / 1; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; margin: 0; }
#employee-photo-placeholder { grid-area: 1 / 1; display: grid; gap: 8px; padding: 16px; text-align: center; color: #58697d; }
#employee-photo-placeholder small { font-size: 12px; }
.employee-photo-choose { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 140px; min-height: 40px; }
.employee-photo-choose svg { width: 18px; height: 18px; }
.employee-photo-editor .field-help { margin: 10px 0 0; overflow-wrap: anywhere; }
.employee-avatar-preview { display: flex; gap: 12px; align-items: center; margin: 16px 0; color: #58697d; font-size: 12px; }
.employee-avatar-frame { flex: 0 0 72px; width: 72px; height: 72px; overflow: hidden; background: var(--canvas); border-radius: 8px; }
.employee-avatar-frame img { display: block; width: 100%; height: auto; }
#edit-employee-photo { min-height: 40px; margin-bottom: 8px; }
.employee-photo-crop-dialog { width: min(920px, calc(100vw - 32px)); }
.employee-photo-crop-dialog > .dialog-heading { margin: 0; padding: 20px; border-bottom: 1px solid var(--line); }
.employee-photo-crop-dialog .dialog-heading h2 { margin: 0; font-size: 20px; }
#employee-photo-crop-file { margin: 6px 0 0; color: var(--muted); overflow-wrap: anywhere; }
.employee-photo-crop-layout { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 24px; padding: 20px; }
.employee-photo-crop-workspace, .employee-photo-crop-previews { min-width: 0; }
.employee-photo-crop-mode { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; font-size: 14px; }
.employee-photo-crop-mode select { width: 180px; max-width: 100%; min-height: 44px; padding: 0 10px; border: 1px solid #ccd4dd; border-radius: 6px; font: inherit; color: var(--ink); background: var(--surface); }
#employee-photo-crop-canvas { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; background: #e9edf2; border-radius: 6px; }
#employee-photo-crop-canvas[data-mode=crop] { cursor: move; touch-action: none; }
#employee-photo-crop-canvas:focus-visible, .employee-photo-crop-mode select:focus-visible { outline: 2px solid var(--action); outline-offset: 3px; }
.employee-photo-crop-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.employee-photo-crop-toolbar output { min-width: 6em; text-align: center; font-variant-numeric: tabular-nums; font-size: 13px; }
.employee-photo-crop-dialog button { min-height: 44px; }
.employee-photo-crop-dialog .field-help { margin: 12px 0 0; color: #58697d; font-size: 12px; line-height: 1.7; }
.employee-photo-crop-previews h3 { margin: 0 0 16px; font-size: 15px; }
.employee-photo-crop-portrait-frame { position: relative; width: 100%; max-width: 220px; aspect-ratio: 3 / 4; overflow: hidden; background: var(--canvas); border-radius: 6px; }
.employee-photo-crop-portrait-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.employee-photo-crop-previews > p { margin: 8px 0 16px; font-size: 13px; line-height: 1.6; }
.employee-photo-crop-dialog > .form-message { margin: 0 20px; }
.employee-photo-crop-dialog > .dialog-actions { margin: 16px 0 0; padding: 16px 20px; border-top: 1px solid var(--line); }
@media (max-width: 760px) {
  .employee-photo-crop-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 16px; }
  .employee-photo-crop-previews { border-top: 1px solid var(--line); padding-top: 20px; }
  .employee-photo-crop-portrait-frame { max-width: 180px; }
}
#member-operations-settings-form .settings-field-groups { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 16px; }
#member-operations-settings-form .settings-field-group { min-width: 0; max-width: none; padding: 0; border: 0; background: transparent; }
#member-operations-settings-form .settings-field-group.is-single { width: auto; }
#member-operations-settings-form .settings-field-group.settings-qr-safety { width: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
#member-operations-settings-form .settings-field-group.is-double { width: auto; gap: 12px 24px; }
#member-operations-settings-form .settings-field-group.settings-reservation-rules { display: flex; flex-wrap: wrap; gap: 12px 24px; }
#member-operations-settings-form .settings-field-group legend { margin-bottom: 10px; padding: 0; }
#member-operations-settings-form .settings-field-group label { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13px; }
#member-operations-settings-form .settings-field-group.is-double:not(.settings-reservation-rules) label { flex-direction: column; align-items: flex-start; gap: 6px; }
#member-operations-settings-form .settings-reservation-rules .field-help { flex-basis: 100%; }
#member-operations-settings-form input[type=number], #member-operations-settings-form select { flex: 0 0 auto; width: 92px; min-height: 40px; }
#member-operations-settings-form .settings-value-with-unit { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; }
#member-operations-settings-form .settings-value-with-unit i { font-style: normal; font-size: 12px; }
#member-operations-settings-form .field-help { margin: 2px 0 0; color: #58697d; font-size: 12px; line-height: 1.6; white-space: normal; word-break: normal; }
.attendance-slot-occupancy { margin: 0; padding: 12px 14px; border: 1px solid #b7dfd1; border-radius: 12px; background: var(--green-soft); color: var(--green); font-size: 13px; line-height: 1.55; }
.attendance-slot-occupancy.is-full { border-color: #e7b7b7; background: var(--red-soft); color: var(--red); }
#card-expiry-reminder-form .expiry-reminder-fields { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; }
#card-expiry-reminder-form .expiry-reminder-fields > label:not(.expiry-reminder-switch) { grid-template-columns: auto 92px auto; }
#card-expiry-reminder-form input[type=number] { min-height: 40px; }
#card-expiry-reminder-form .renewal-policy-help { flex: 1 1 320px; max-width: 84ch; margin: 0; }
@media (max-width: 1000px) {
  .employee-profile-columns { grid-template-columns: minmax(0, 1fr); }
  .employee-photo-editor { max-width: 360px; width: 100%; padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 650px) {
  .employee-profile-panel { padding: 16px; }
}
@media (max-width: 420px) {
  #member-operations-settings-form .settings-field-group.is-double { grid-template-columns: minmax(0, 1fr); }
}
#public-content-settings-card .public-content-settings-grid { align-items: start; grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr); background: var(--canvas); }
#public-content-settings-card .public-content-form { padding: 16px; background: var(--surface); container: public-form / inline-size; }
#public-content-settings-card .public-content-fields label { font-size: 13px; }
#public-content-settings-card .short-public-input { max-width: 220px; }
#store-public-profile-form > .public-content-fields { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 12px 20px; }
.store-name-field input { max-width: 300px; }
.store-phone-field input { max-width: 200px; }
#public-content-settings-card .business-hours-field { max-width: 300px; }
#public-content-settings-card .public-wechat-label { margin-top: 0; }
#public-content-settings-card .store-location-field { padding: 8px 12px; }
#public-content-settings-card .store-location-field > .field-help { margin: 4px 0 8px; }
#public-content-settings-card .store-location-inputs { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 8px 0; }
#public-content-settings-card .store-location-inputs label { display: flex; align-items: center; gap: 8px; }
#public-content-settings-card .store-location-inputs input { width: 156px; max-width: 100%; }
#public-content-settings-card .store-location-footer { margin-top: 4px; }
#public-content-settings-card .public-content-form > .primary-button { margin-top: 12px; }
#public-content-settings-card button { width: auto; min-height: 38px; flex: 0 0 auto; }
#public-content-settings-card .public-wechat-qr-manager { align-items: start; padding: 0; border: 0; background: transparent; }
#public-content-settings-card .public-wechat-qr-preview { width: 112px; }
#public-content-settings-card .public-wechat-qr-heading p,
#public-content-settings-card .public-wechat-qr-actions p { font-size: 12px; }
.activity-schedule-fields { display: flex; align-items: start; flex-wrap: wrap; gap: 12px 16px; }
.activity-schedule-fields > label { width: 176px; max-width: 100%; }
.activity-schedule-fields > .activity-product-field { width: 280px; }
#public-activity-form input[name=title] { max-width: 480px; }
#public-activity-form textarea { max-width: 680px; }
.activity-poster-manager { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.activity-poster-manager h3 { margin: 0; font-size: 16px; }
.activity-poster-manager .row-actions { justify-content: flex-start; flex-wrap: wrap; }
.activity-poster-manager .form-message { line-height: 1.6; }
.activity-poster-layout { display: grid; grid-template-columns: 140px minmax(0, 1fr); align-items: start; gap: 16px; }
.activity-poster-preview-box { display: grid; place-items: center; width: 140px; height: 180px; border: 1px solid var(--line); border-radius: 6px; background: var(--canvas); overflow: hidden; }
.activity-poster-preview-box > span { grid-area: 1 / 1; padding: 8px; color: var(--muted); font-size: 12px; text-align: center; }
.activity-poster-preview-box:has(img:not([hidden])) > span { display: none; }
#activity-poster-preview { grid-area: 1 / 1; display: block; width: 100%; height: 100%; max-height: 180px; object-fit: contain; margin: 0; }
.activity-poster-actions .field-help { margin: 0 0 12px; }
@container public-form (max-width: 480px) {
  #store-public-profile-form > .public-content-fields { grid-template-columns: minmax(0, 1fr); }
}
@container public-form (max-width: 340px) {
  .activity-poster-layout { grid-template-columns: 100px minmax(0, 1fr); gap: 12px; }
  .activity-poster-preview-box { width: 100px; height: 140px; }
  #activity-poster-preview { max-height: 140px; }
}
@media (max-width: 1100px) {
  #public-content-settings-card .public-content-settings-grid { grid-template-columns: minmax(0, 1fr); }
  #public-content-settings-card .public-content-form + .public-content-form { border-left: 0; border-top: 1px solid var(--line); }
}
.inline-check { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; color: var(--ink); font-size: 12px; font-weight: 650; white-space: nowrap; cursor: pointer; }
.inline-check input { width: 16px; height: 16px; accent-color: var(--action); }
.public-projection-note { margin: 12px 0 0; padding: 10px 12px; border-radius: 7px; background: var(--action-softer); color: var(--muted); font-size: 12px; line-height: 1.55; }
.public-projection-note.is-active { background: var(--green-soft); color: var(--green); }
.public-projection-note.is-upcoming { background: var(--amber-soft); color: var(--amber); }
.public-projection-note.is-disabled, .public-projection-note.is-expired { background: var(--red-soft); color: var(--red); }
.public-profile-review-section { padding: 16px; }
.public-coach-status-section { margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.public-coach-status-list { border-block: 1px solid var(--line); }
.public-coach-status-row { display: grid; grid-template-columns: minmax(110px, .7fr) auto minmax(220px, 2fr); align-items: center; gap: 12px; min-height: 48px; padding: 8px 2px; border-bottom: 1px solid var(--line); }
.public-coach-status-row:last-child { border-bottom: 0; }
.public-coach-status-row strong { color: var(--ink); font-size: 13px; }
.public-coach-status-row p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.public-profile-review-heading { margin-top: 0; }
.public-profile-review-list { display: grid; gap: 12px; }
.public-profile-review-item { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfd; }
.public-profile-review-item > img { width: 116px; height: 146px; border-radius: 8px; object-fit: cover; background: #e8edf2; }
.review-item-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.review-item-heading strong { color: var(--ink); font-size: 14px; }
.public-profile-review-item dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0 0 12px; }
.public-profile-review-item dl div { min-width: 0; }
.public-profile-review-item dt { color: var(--muted); font-size: 11px; }
.public-profile-review-item dd { margin: 3px 0 0; color: var(--ink); line-height: 1.5; overflow-wrap: anywhere; }
.compact-empty-state { padding: 18px; border: 1px dashed #cdd6df; border-radius: 8px; background: #fbfcfd; color: var(--muted); text-align: center; }
.platform-offer-table { min-width: 1080px; }
.platform-binding-preview { padding: 13px 14px; border: 1px solid #cfddea; border-radius: 7px; background: #f4f8fc; }
.platform-binding-preview > p { margin: 0; color: #607086; font-size: 13px; }
.platform-binding-preview dl { display: grid; gap: 8px; margin: 0; }
.platform-binding-preview dl > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; }
.platform-binding-preview dt { color: #607086; font-size: 12px; }
.platform-binding-preview dd { margin: 0; color: #24384f; font-size: 13px; font-weight: 600; }
.product-section-grid .checkbox-field { align-self: start; justify-self: stretch; min-height: 44px; padding: 0 11px; border: 1px solid #d8e1ea; border-radius: 6px; background: #f8fafc; }
.refund-policy-editor { display: grid; gap: 12px; margin-top: 2px; padding: 15px; border: 1px solid #cfddea; border-radius: 7px; background: #f4f8fc; color: #526174; }
.refund-policy-editor > strong { color: #28384d; font-size: 13px; }
.refund-policy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px 16px; }
.refund-policy-grid label { display: grid; gap: 5px; }
.choice-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.choice-cards label { position: relative; min-height: 72px; border: 1px solid #cbd3dd; border-radius: 8px; padding: 12px 12px 10px 38px; cursor: pointer; }
.choice-cards input { position: absolute; left: 12px; top: 15px; width: auto; height: auto; accent-color: var(--action); }
.choice-cards label:has(input:checked) { border-color: var(--action); background: var(--action-soft); }
.choice-cards b, .choice-cards small { display: block; }
.choice-cards small { margin-top: 4px; color: #7b8798; font-size: 11px; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
dialog form > .dialog-actions { margin: 16px -20px -16px; padding: 12px 20px; border-top: 1px solid #e2e7ed; background: #fbfcfd; }
.form-message { min-height: 20px; margin-top: 8px; color: var(--red); font-size: 12px; }
.form-message:empty { min-height: 0; margin-top: 0; }
.form-message.is-success { color: #1b6a50; }
.form-message.is-error { color: var(--red); }
.form-message.is-pending { color: #667589; }
.field-error { display: block; margin-top: 6px; color: var(--red); font-size: 12px; font-weight: 600; line-height: 1.4; }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--red); box-shadow: 0 0 0 2px rgba(192, 57, 43, .12); }
.payment-overview { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 17px; border: 1px solid var(--line); border-radius: 8px; }
.payment-overview div { padding: 12px 14px; border-right: 1px solid var(--line); }
.payment-overview div:last-child { border: 0; }
.payment-overview span { display: block; color: var(--muted); font-size: 11px; }
.payment-overview strong { display: block; margin-top: 4px; font-variant-numeric: tabular-nums; }
.installment-due { display: flex; align-items: baseline; gap: 6px; margin: -5px 0 12px; padding: 9px 11px; border-radius: 6px; background: #edf4fa; color: #32465e; font-size: 12px; line-height: 1.5; }
.installment-due[hidden] { display: none; }
.installment-due strong { color: #173d64; font-size: 15px; font-variant-numeric: tabular-nums; }
.installment-due span { color: #607086; }
.stacked-field { margin-top: 13px; }
.info-copy { color: #536074; line-height: 1.7; }
.info-copy strong { color: var(--ink); }
.member-link { border: 0; padding: 0; background: transparent; color: var(--action); cursor: pointer; font-weight: 800; text-align: center; }
.member-detail-page { min-height: calc(100vh - 116px); border: 1px solid #d7dfe8; background: #fff; }
.member-detail-page-heading { min-height: 92px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 11px 24px 12px; border-bottom: 1px solid var(--line); }
.member-detail-heading-main { display: grid; gap: 12px; min-width: 0; }
.member-detail-back { justify-self: start; min-height: 28px; padding: 0; color: #536277; }
.member-detail-overview { display: flex; align-items: center; gap: 14px; }
.member-detail-identity h1 { margin: 0 0 4px; font-size: 19px; }
.member-detail-identity p { margin: 0; color: var(--muted); font-size: 12px; }
.member-detail-actions { display: flex; align-items: center; gap: 8px; }
.member-detail-tabs { margin: 0; padding: 0 24px; gap: 26px; background: #fbfcfd; }
.member-detail-tabs button span { color: #8995a5; font-size: 11px; font-weight: 500; }
.member-course-list { padding: 0; }
.member-detail-panel { padding-top: 14px; }
.member-detail-panel[hidden] { display: none; }
.member-detail-panel:not([hidden]) { animation: panel-enter .18s ease-out both; }
@keyframes panel-enter { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.member-record-list { padding: 18px 24px 24px; }
.member-profile-sheet { display: grid; gap: 10px; margin: 12px 24px 0; padding: 14px 16px; border-top: 2px solid var(--gold-bright); background: #fbfcfd; }
.member-profile-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.member-profile-section-heading h2 { margin: 0; font-size: 15px; font-weight: 650; }
.member-profile-section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.member-profile-section-heading .text-button { min-height: 28px; padding: 0 5px; color: var(--action-dark); }
.member-account-actions { display: flex; gap: 8px; }
.member-profile-sheet dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; margin: 0; border-top: 1px solid var(--line); }
.member-profile-sheet dl div { display: grid; grid-template-columns: 96px 1fr; align-items: center; min-height: 38px; border-bottom: 1px solid var(--line); }
.member-profile-sheet dt { color: var(--muted); font-size: 12px; }
.member-profile-sheet dd { margin: 0; font-size: 13px; font-weight: 500; }
.member-course-section { margin: 14px 24px 24px; padding-top: 14px; border-top: 1px solid var(--line); }
.member-section-heading { display: flex; align-items: end; gap: 8px; margin-bottom: 10px; }
.member-section-heading h2 { margin: 0; font-size: 15px; }
.member-section-heading h2 span { margin-left: 3px; color: var(--muted); font-size: 12px; font-weight: 500; }
.member-section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.member-detail-table { min-width: 1420px; }
.member-detail-table th:nth-child(1) { width: 14%; }
.member-detail-table th:nth-child(2) { width: 8%; }
.member-detail-table th:nth-child(3) { width: 10%; }
.member-detail-table th:nth-child(4) { width: 14%; }
.member-detail-table th:nth-child(5) { width: 11%; }
.member-detail-table th:nth-child(6) { width: 10%; }
.member-detail-table th:nth-child(7) { width: 12%; }
.member-detail-table th:nth-child(8) { width: 14%; }
.member-detail-table th:nth-child(9) { width: 7%; }
.member-record-table { min-width: 880px; }
.member-record-table th:nth-child(1) { width: 24%; }
.member-record-table th:nth-child(2) { width: 24%; }
.member-record-table th:nth-child(3) { width: 52%; }
.member-edit-history-table { min-width: 980px; }
.member-edit-history-table th:nth-child(1) { width: 16%; }
.member-edit-history-table th:nth-child(2) { width: 14%; }
.member-edit-history-table th:nth-child(3), .member-edit-history-table th:nth-child(4) { width: 21%; }
.member-edit-history-table th:nth-child(5) { width: 13%; }
.member-edit-history-table th:nth-child(6) { width: 15%; }
.member-edit-history-table td { overflow-wrap: anywhere; }
.member-history-toolbar { min-height: 50px; display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.member-history-toolbar > strong { align-self: center; color: #26384d; font-size: 14px; }
.member-attendance-table { min-width: 1120px; }
.member-attendance-table th:nth-child(1) { width: 18%; }
.member-attendance-table th:nth-child(2) { width: 10%; }
.member-attendance-table th:nth-child(3), .member-attendance-table th:nth-child(4), .member-attendance-table th:nth-child(5) { width: 15%; }
.member-attendance-table th:nth-child(6) { width: 12%; }
.member-attendance-table th:nth-child(7) { width: 15%; }
.member-phone-row { display: inline-flex; align-items: center; gap: 10px; }
.member-phone-row .text-button { padding: 2px 6px; }
.course-card-heading-actions { display: flex; align-items: flex-start; gap: 8px; }
.member-course-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin: 0; }
.anchored-action-menu { position: fixed; z-index: 60; opacity: 0; transform: translateY(-5px) scale(.98); pointer-events: none; transition: opacity .14s ease, transform .16s cubic-bezier(.22,.61,.36,1); transform-origin: top right; }
.anchored-action-menu.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.member-card-actions-popover { width: min(120px, calc(100vw - 16px)); max-height: min(420px, calc(100vh - 16px)); overflow: auto; padding: 4px; border: 1px solid #cfd9e3; border-radius: 6px; background: #fff; box-shadow: 0 10px 26px rgba(8,24,42,.16); }
.member-card-action-list { display: grid; gap: 2px; }
.member-card-action-list .row-action, .member-card-action-list .status { width: 100%; min-height: 28px; justify-content: center; border: 0; background: transparent; text-align: center; }
.member-card-action-list .row-action:hover { background: var(--action-soft); box-shadow: none; }
.period-control { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 500; }
.period-control input, .period-control select { width: 138px; height: 36px; padding: 0 8px; border: 1px solid var(--line); border-radius: 4px; background: white; color: var(--ink); }
.attendance-toolbar { justify-content: flex-start; flex-wrap: nowrap; overflow: visible; }
.attendance-toolbar .attendance-export-action { margin-left: auto; border-color: #b8cadb; background: #fff; color: var(--action-dark); }
.attendance-toolbar .refresh-button { margin-left: 0; }
.attendance-page-heading { min-height: 48px; justify-content: space-between; align-items: center; }
.attendance-page-heading > div:first-child:not(.row-actions) { display: block; }
.attendance-page-heading h1 { font-size: 18px; letter-spacing: 0; }
.attendance-page-heading p { margin: 3px 0 0; font-size: 12px; }
.attendance-page-actions { display: flex; align-items: center; gap: 8px; }
.attendance-empty-state { min-height: 58px; justify-content: flex-start; text-align: left; }
.attendance-empty-state p { display: block; margin: 0; color: var(--muted); font-size: 12px; }
.attendance-pane-enter { animation: attendance-pane-enter .22s cubic-bezier(.2,.7,.2,1) both; }
.attendance-row-highlight { animation: attendance-row-highlight .85s cubic-bezier(.2,.7,.2,1) both; }
@keyframes attendance-pane-enter { from { opacity: .72; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes attendance-row-highlight { 0% { background: #dceffc; box-shadow: inset 0 0 0 1px #8ec4eb; } 100% { background: transparent; box-shadow: inset 0 0 0 1px transparent; } }
.date-range-popover, .month-range-popover { position: fixed; z-index: 120; width: min(680px, calc(100vw - 24px)); padding: 12px; border: 1px solid #cfd8e2; border-radius: 10px; background: #fff; box-shadow: 0 18px 44px rgba(8,24,42,.2); opacity: 0; visibility: hidden; transform: translateY(-7px); pointer-events: none; transform-origin: top center; transition: opacity .24s ease, transform .36s cubic-bezier(.22,1,.36,1), visibility 0s linear .36s; }
.date-range-popover[hidden], .month-range-popover[hidden] { display: none; }
.date-range-popover.is-open, .month-range-popover.is-open { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; transition-delay: 0s; }
.date-range-popover-head, .date-range-popover-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.date-range-popover-head button { width: 32px; height: 32px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--action-dark); cursor: pointer; font-size: 22px; }
.date-range-popover-head button:hover, .date-range-popover-head button:focus-visible { border-color: #b8cadb; background: var(--action-soft); outline: 0; }
.range-calendars { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 10px 0 12px; }
.range-calendar h3 { margin: 0 0 8px; color: #2d4056; font-size: 13px; text-align: center; }
.range-calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.range-calendar-grid span { display: grid; height: 24px; place-items: center; color: #7a8796; font-size: 11px; }
.range-day { height: 31px; border: 0; border-radius: 5px; background: transparent; color: #35475b; cursor: pointer; font-size: 12px; }
.range-day:hover, .range-day:focus-visible { background: var(--action-soft); outline: 2px solid var(--action); outline-offset: -2px; }
.range-day.is-in-range, .range-day.is-in-preview { border-radius: 0; background: #eaf4fb; }
.range-day.is-preview-boundary { background: #d9eaf7; font-weight: 700; }
.range-day.is-boundary { border-radius: 50%; background: var(--action); color: #fff; font-weight: 700; }
.range-day.is-outside { color: #b2bac4; }
.date-range-popover-actions { justify-content: flex-end; border-top: 1px solid var(--line); padding-top: 10px; }
.month-range-controls { display: flex; align-items: center; gap: 7px; color: #687587; font-size: 12px; white-space: nowrap; }
.month-range-trigger { min-width: 230px; }
.month-range-years { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
.month-range-year { min-width: 0; }
.month-range-year h3 { margin: 0 0 8px; text-align: center; font-size: 13px; color: var(--ink); }
.month-range-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.range-month { min-height: 36px; border: 1px solid transparent; border-radius: 7px; background: #f6f8fa; color: #34465b; cursor: pointer; font: inherit; }
.range-month:hover, .range-month:focus-visible { border-color: #9fb5c9; background: var(--action-soft); outline: 0; }
.range-month.is-in-range, .range-month.is-in-preview { background: #e8f1f8; border-color: #d4e2ee; }
.range-month.is-boundary { background: var(--action); border-color: var(--action); color: #fff; font-weight: 700; }
.status-note { display: inline-flex; min-height: 30px; align-items: center; padding: 0 10px; border-radius: 4px; background: #f1f3f5; color: #687587; font-size: 12px; font-weight: 600; }
dialog[open] { animation: dialog-enter .26s cubic-bezier(.22,.61,.36,1) both; }
@keyframes dialog-enter { from { opacity: 0; transform: translateY(10px) scale(.988); } to { opacity: 1; transform: translateY(0) scale(1); } }
.current-row { background: #edf6fd; }
.member-summary, .coach-summary { display: none; }
.zt-report-toolbar { border-top: 2px solid var(--orange); }
.coach-performance-table { min-width: 1380px; table-layout: auto; }
.coach-performance-table th, .coach-performance-table td { text-align: center; border-right: 1px solid var(--line); }
.coach-performance-table th:first-child, .coach-performance-table td:first-child { text-align: left; min-width: 130px; }
.coach-performance-table .store-total-row { background: #fff1e7; border-top: 2px solid var(--orange); font-weight: 800; }
.coach-performance-table .current-row { background: #fff8f3; }
.report-payroll-cost-status { margin-left: auto; color: var(--navy-800); font-weight: 700; }
.payroll-toolbar { align-items: center; }
.payroll-toolbar-copy { min-width: 0; display: grid; gap: 3px; }
.payroll-toolbar-copy > span { color: var(--muted); font-size: 11px; }
.payroll-standards { margin: 14px 12px 12px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 6px; background: #f7f9fb; }
.payroll-standards > div:first-child { display: flex; align-items: baseline; gap: 10px; color: #5d6b7c; font-size: 11px; }
.payroll-standards > div:first-child strong { color: #445368; font-size: 12px; }
.payroll-rule-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 14px; margin-top: 8px; }
.payroll-rule-strip section { padding-left: 9px; border-left: 2px solid #ccd7e2; }
.payroll-rule-strip strong { display: block; color: #4b5b6e; font-size: 10px; }
.payroll-rule-strip ul { margin: 4px 0 0; padding-left: 14px; color: #687789; font-size: 10px; line-height: 1.55; }
.payroll-table { min-width: 1500px; table-layout: auto; }
.payroll-table th, .payroll-table td { text-align: center; vertical-align: middle; }
.payroll-table th:nth-child(1) { min-width: 100px; text-align: left; }
.payroll-table td:first-child { text-align: left; }
.payroll-table th { min-width: 86px; }
.payroll-table th:nth-child(3), .payroll-table th:nth-child(4), .payroll-table th:nth-child(9), .payroll-table th:nth-child(10), .payroll-table th:nth-child(11), .payroll-table th:nth-child(12) { min-width: 108px; }
.payroll-confirmation-note { margin: 7px 0 0; padding-top: 7px; border-top: 1px solid var(--line); color: #758397; font-size: 10px; }
.payroll-blockers { margin-top: 12px; padding: 11px 13px; border: 1px solid #efb4b4; border-radius: 6px; background: var(--red-soft); }
.payroll-blockers p { margin: 5px 0; font-size: 12px; }
.payroll-blockers small { color: #80534e; font-size: 10px; }
.contract-unavailable { color: var(--muted); font-size: 12px; }
.order-contract-dialog { width: min(620px, calc(100vw - 32px)); }
.order-contract-content { line-height: 1.7; overflow-wrap: anywhere; }
.order-contract-content dl { display: grid; gap: 4px; margin: 16px 0; }
.order-contract-content dt { color: var(--muted); font-size: 12px; }
.order-contract-content dd { margin: 0; font-size: 14px; }
#order-contract-note { white-space: pre-line; }
.order-contract-dialog .dialog-actions { flex-wrap: wrap; }
.order-contract-dialog .dialog-actions > * { min-height: 40px; }
#order-contract-template { display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; text-decoration: none; }
#order-contract-template:focus-visible { outline: 2px solid var(--action); outline-offset: 3px; }
.order-contract-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0 20px 16px; }
.order-contract-summary p { flex: 1 1 260px; margin: 0; line-height: 1.6; overflow-wrap: anywhere; }
.order-contract-summary button { min-height: 40px; flex: 0 0 auto; }
.leave-day-preview { display: flex; align-items: center; justify-content: space-between; min-height: 38px; padding: 0 11px; border: 1px solid #d7e1ea; border-radius: 5px; background: #f7f9fb; }
.leave-day-preview span { color: var(--muted); font-size: 12px; }
.leave-day-preview strong { color: var(--action-dark); font-size: 14px; }
.leave-day-preview.is-invalid strong { color: var(--red); font-size: 11px; }
.payroll-status { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.payroll-status.ready { color: #17623e; background: #e9f6ef; }
.payroll-status.blocked { color: #9a3d28; background: #fff0eb; }
.payroll-status.confirmed { color: #075985; background: #e0f2fe; }
.payroll-status.stale { color: #92400e; background: #fef3c7; }
.employee-table { min-width: 900px; }
.employee-table th:nth-child(1) { width: 20%; }
.employee-table th:nth-child(2) { width: 12%; }
.employee-table th:nth-child(3) { width: 10%; }
.employee-table th:nth-child(4) { width: 12%; }
.employee-table th:nth-child(5) { width: 13%; }
.employee-table th:nth-child(6) { width: 12%; }
.employee-table th:nth-child(7) { width: 21%; }
.employee-table td { padding-top: 12px; padding-bottom: 12px; }
.employee-table .row-action { min-height: 36px; }
.employee-table .row-actions .cell-subtitle { flex-basis: 100%; }
.toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 25px); padding: 11px 16px; border-radius: 7px; background: var(--navy-950); color: white; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: .2s ease; z-index: 100; font-size: 13px; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (min-width: 761px) {
.app-shell.is-collapsed { grid-template-columns: 68px minmax(0, 1fr); }
.app-shell.is-collapsed .topbar { grid-template-columns: 68px minmax(0, 610px) auto; }
.app-shell.is-collapsed .brand { padding: 0 15px; }
.app-shell.is-collapsed .brand-logo { width: 38px; height: 38px; }
.app-shell.is-collapsed .brand-logo img { width: 38px; height: 38px; object-fit: contain; }
.app-shell.is-collapsed .brand-copy, .app-shell.is-collapsed .collapse-button span, .app-shell.is-collapsed .nav-main > span:not(.nav-icon), .app-shell.is-collapsed .nav-main em, .app-shell.is-collapsed .nav-main i, .app-shell.is-collapsed .nav-children, .app-shell.is-collapsed .sidebar-note { display: none; }
.app-shell.is-collapsed .nav-main { grid-template-columns: 1fr; justify-items: center; padding: 0; }
.app-shell.is-collapsed .collapse-button { justify-content: center; }
}

.refund-dialog { width: min(760px, calc(100vw - 32px)); }
.refund-date-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.refund-date-fields input, #refund-form [name="proposed_refund"] { width: 12rem; max-width: 100%; }
.refund-calculation > .field-help { margin: 10px 14px; }
.refund-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 12px 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--line); }
.refund-fact { display: grid; grid-template-columns: 98px minmax(0, 1fr); gap: 10px; align-items: center; min-height: 42px; padding: 9px 12px; background: #fff; }
.refund-fact span { color: var(--muted); font-size: 12px; }
.refund-fact strong { color: var(--ink); font-size: 13px; overflow-wrap: anywhere; }
.refund-calculation { margin: 14px 0 10px; overflow: hidden; border: 1px solid #bfd5ea; border-radius: 8px; background: #f6faff; }
.refund-calculation-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; border-bottom: 1px solid #d8e6f2; background: #eaf4fc; color: #314b64; }
.refund-calculation-header span { font-size: 13px; font-weight: 600; }
.refund-calculation-header strong { color: var(--action); font-size: 20px; }
.refund-calculation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.refund-calculation-grid > div { display: grid; gap: 4px; padding: 11px 14px; border-bottom: 1px solid #e1eaf2; }
.refund-calculation-grid > div:nth-child(odd) { border-right: 1px solid #e1eaf2; }
.refund-calculation-grid span { color: var(--muted); font-size: 11px; }
.refund-calculation-grid strong { color: var(--ink); font-size: 13px; }
.refund-formula { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 14px; color: #526477; }
.refund-formula strong { color: var(--ink); font-size: 14px; }
.refund-calculation-loading { padding: 18px 14px; color: #536a80; text-align: center; }
.refund-calculation-loading.is-error { color: var(--danger); background: #fff8f7; }
.refund-guidance { padding: 10px 12px; border-radius: 6px; background: #f7f8fa; font-size: 12px; }
.manager-operator-field { padding: 11px 12px; border: 1px solid #cbdbea; border-radius: 7px; background: #f7fbff; }
.manager-operator-field > span::after { content: " · 店长公共账号必选"; color: #7c8da0; font-weight: 400; }
.manager-operator-field.is-required { border-color: #d99a19; box-shadow: 0 0 0 3px rgba(217,154,25,.12); }
.shared-session-note { margin-top: 12px; padding: 10px 12px; border-radius: 6px; background: #f6f8fa; font-size: 12px; }
.analytics-view { min-width: 0; }
.analytics-page-heading { min-height: 52px; align-items: center; justify-content: space-between; }
.analytics-page-heading > div:first-child:not(.row-actions) { display: block; min-width: 240px; }
.analytics-page-heading h1 { font-size: 20px; letter-spacing: 0; }
.analytics-page-heading p { margin: 3px 0 0; font-size: 12px; }
.analytics-heading-actions { display: flex; min-width: 0; align-items: flex-end; flex-direction: column; gap: 4px; }
.analytics-heading-actions .row-actions { justify-content: flex-end; flex-wrap: wrap; }
.analytics-refresh-feedback { color: #a53c32; font-size: 11px; }
.analytics-coach-filter-control select { width: 150px; }
.analytics-section-tabs { display: flex; min-width: 0; margin: 0 0 10px; overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.analytics-section-tabs button { min-height: 34px; flex: 0 0 auto; padding: 0 15px; border: 0; border-right: 1px solid #e5ebf0; background: transparent; color: #4f6175; cursor: pointer; font-size: 12px; }
.analytics-section-tabs button:hover, .analytics-section-tabs button:focus-visible { background: var(--action-softer); color: var(--action-dark); }
.analytics-metric-ribbon { display: grid; grid-template-columns: 1.2fr repeat(4, minmax(0, 1fr)); margin: 0 0 10px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: #fff; box-shadow: 0 4px 16px rgba(23,38,58,.04); }
.analytics-metric-ribbon article { min-width: 0; min-height: 78px; padding: 10px 13px; border-right: 1px solid var(--line); }
.analytics-metric-ribbon article:last-child { border-right: 0; }
.analytics-metric-ribbon .analytics-metric-primary { border-top: 2px solid var(--orange); background: linear-gradient(135deg, #fff8f3, #fff); }
.analytics-metric-ribbon span, .analytics-metric-ribbon small { display: block; color: #69788a; font-size: 11px; line-height: 1.45; }
.analytics-metric-ribbon strong { display: block; margin: 5px 0 2px; color: #19324d; font-size: clamp(20px, 1.8vw, 27px); line-height: 1.1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.analytics-metric-ribbon .analytics-metric-primary strong { color: var(--orange-dark); }
.analytics-grid-main { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: 10px; margin-bottom: 10px; align-items: start; }
.analytics-coach-detail-grid { grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); }
.analytics-store-secondary-grid { grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); }
.analytics-panel { min-width: 0; margin: 0 0 10px; overflow: hidden; scroll-margin-top: 82px; }
.analytics-grid-main .analytics-panel { margin-bottom: 0; }
.analytics-panel-heading { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.analytics-panel-heading h2 { margin: 0; color: #20364e; font-size: 16px; }
.analytics-panel-heading p { margin: 4px 0 0; color: #738194; font-size: 11px; line-height: 1.5; }
.analytics-series-control { flex: 0 0 auto; }
.analytics-chart-wrap { min-width: 0; padding: 4px 8px 0; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-line-chart { display: block; width: auto; min-width: 100%; height: 168px; font-variant-numeric: tabular-nums; }
.analytics-chart-grid { stroke: #e5ebf0; stroke-width: 1; }
.analytics-chart-zero { stroke: #b8c5d1; stroke-width: 1.2; }
.analytics-chart-line { fill: none; stroke: var(--action); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.analytics-chart-point { fill: #fff; stroke: var(--orange); stroke-width: 2.5; }
.analytics-chart-axis-label, .analytics-chart-month { fill: #66778a; font-size: 12px; }
.analytics-chart-value { fill: #28425e; font-size: 12px; font-weight: 700; }
.analytics-chart-hint { margin: 0; padding: 0 14px 10px; color: #8a96a4; font-size: 10px; text-align: right; }
.analytics-member-structure { display: flex; flex-direction: column; }
.analytics-member-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 13px 7px; }
.analytics-member-total span { color: var(--muted); font-size: 12px; }
.analytics-member-total strong { color: #20364e; font-size: 25px; font-variant-numeric: tabular-nums; }
.analytics-stacked-bar { display: block; width: calc(100% - 26px); height: 9px; margin: 0 13px 9px; overflow: hidden; border-radius: 999px; }
.analytics-bar-track { fill: #edf1f4; }
.analytics-bar-private { fill: #2f7aae; }
.analytics-bar-self { fill: #34a780; }
.analytics-bar-none { fill: #b9c4ce; }
.analytics-structure-list { display: grid; gap: 0; margin: 0; padding: 0 13px; }
.analytics-structure-list > div { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid #e8edf2; }
.analytics-structure-list dt { display: flex; min-width: 0; align-items: center; gap: 7px; color: #5b6b7e; font-size: 12px; }
.analytics-structure-list dd { margin: 0; color: #263a50; font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; white-space: nowrap; }
.analytics-swatch { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; }
.analytics-swatch-private { background: #2f7aae; }
.analytics-swatch-self { background: #34a780; }
.analytics-swatch-none { background: #b9c4ce; }
.analytics-panel-note { margin: 0; padding: 7px 11px; border-top: 1px solid var(--line); background: #f8fafb; color: #6f7e8f; font-size: 10px; line-height: 1.5; }
.analytics-growth-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.analytics-growth-summary article { min-width: 0; min-height: 88px; padding: 10px 13px; border-right: 1px solid var(--line); background: #fff; }
.analytics-growth-summary article:last-child { border-right: 0; }
.analytics-growth-summary h3 { margin: 0; color: #20364e; font-size: 16px; font-weight: 750; line-height: 1.4; }
.analytics-growth-summary small, .analytics-growth-summary p { display: block; color: #68788a; font-size: 11px; line-height: 1.55; }
.analytics-growth-summary strong { display: block; margin: 4px 0 2px; color: #203b57; font-size: clamp(21px, 2vw, 28px); font-variant-numeric: tabular-nums; }
.analytics-growth-summary small { color: #43586f; font-weight: 700; font-variant-numeric: tabular-nums; }
.analytics-growth-summary p { margin: 4px 0 0; }
.analytics-growth-summary article:first-child strong { color: var(--action-dark); }
.analytics-growth-grid { grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); }
.analytics-growth-grid.is-all-coaches, .analytics-coach-detail-grid.is-all-coaches { grid-template-columns: minmax(0, 1fr); }
.analytics-rate-chart { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 6px; padding: 6px 8px 2px; }
.analytics-rate-scale { display: flex; justify-content: space-between; flex-direction: column; padding: 21px 0 34px; color: #8a96a4; font-size: 9px; font-variant-numeric: tabular-nums; text-align: right; }
.analytics-rate-bars { display: grid; grid-auto-columns: 90px; grid-auto-flow: column; width: max-content; max-width: 100%; justify-self: center; gap: 5px; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-rate-column { display: grid; min-width: 90px; grid-template-rows: 18px 72px minmax(30px, auto); align-items: end; justify-items: center; padding: 2px 5px 4px; border: 0; border-bottom: 2px solid transparent; background: #fff; color: inherit; text-align: center; font: inherit; cursor: pointer; }
.analytics-rate-column:hover, .analytics-rate-column:focus-visible, .analytics-rate-column.is-selected { border-bottom-color: var(--action); background: #f2f8fc; }
.analytics-rate-column:focus-visible { outline: 2px solid var(--action); outline-offset: -2px; }
.analytics-rate-coach { min-width: 0; align-self: start; padding-top: 3px; }
.analytics-rate-coach strong, .analytics-rate-coach small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.analytics-rate-coach strong { color: #294159; font-size: 11px; }
.analytics-rate-coach small { margin-top: 2px; color: #758496; font-size: 9px; font-variant-numeric: tabular-nums; }
.analytics-rate-track { display: block; width: 24px; height: 72px; align-self: end; overflow: visible; }
.analytics-rate-track-svg { display: block; width: 24px; height: 72px; overflow: visible; }
.analytics-rate-track-bg { fill: #e8eef3; }
.analytics-rate-fill { fill: var(--action); }
.analytics-rate-reference-marker { stroke: #53677b; stroke-width: .55; }
.analytics-rate-column b { color: #263e56; font-size: 12px; font-variant-numeric: tabular-nums; }
.analytics-rate-reference { margin: 0; padding: 6px 10px 7px; border-top: 1px solid var(--line); color: #617286; font-size: 10px; text-align: right; font-variant-numeric: tabular-nums; }
.analytics-rate-attribution-note { margin: 0; padding: 0 11px 8px; color: #876124; font-size: 10px; line-height: 1.5; }
.analytics-rate-empty { margin: 0; padding: 14px 10px; color: #7b8897; font-size: 11px; text-align: center; }
.analytics-rate-store-line, .analytics-rate-coach-line { fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.analytics-rate-store-line { stroke: #78899a; stroke-dasharray: 5 5; }
.analytics-rate-coach-line { stroke: var(--action); }
.analytics-rate-store-line-point { fill: #fff; stroke: #78899a; stroke-width: 2; }
.analytics-rate-coach-line-point { fill: #fff; stroke: var(--orange); stroke-width: 2.4; }
.analytics-chart-legend { display: flex; justify-content: flex-end; gap: 14px; padding: 0 14px 11px; color: #6d7c8e; font-size: 10px; }
.analytics-chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.analytics-chart-legend i { display: inline-block; width: 16px; height: 2px; background: var(--action); }
.analytics-chart-legend .analytics-legend-store { height: 1px; background: repeating-linear-gradient(90deg, #78899a 0 5px, transparent 5px 8px); }
.analytics-customer-results { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.analytics-customer-results.is-five-column { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.analytics-customer-results > * { min-width: 0; min-height: 84px; padding: 10px 12px; border: 0; border-right: 1px solid var(--line); background: #fff; text-align: left; font: inherit; }
.analytics-customer-results > *:last-child { border-right: 0; }
.analytics-customer-results span, .analytics-customer-results small { display: block; color: #6f7d8e; font-size: 10px; line-height: 1.45; }
.analytics-customer-results strong { display: block; margin: 4px 0 2px; color: #263a50; font-size: 19px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.analytics-customer-result { position: relative; cursor: pointer; transition: background-color 140ms ease, box-shadow 140ms ease; }
.analytics-customer-result i { display: block; margin-top: 4px; color: var(--action); font-size: 10px; font-style: normal; font-weight: 700; }
.analytics-customer-result:hover:not(:disabled), .analytics-customer-result:focus-visible { z-index: 1; background: var(--action-softer); box-shadow: inset 0 -2px 0 var(--action); }
.analytics-customer-result:disabled { cursor: default; }
.analytics-customer-results .analytics-renewal-result { background: var(--action-softer); }
.analytics-customer-results .analytics-renewal-result strong { color: var(--action-dark); }
.analytics-panel-footer { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 11px; border-top: 1px solid var(--line); background: #fbfcfd; }
.analytics-panel-footer span { color: #627286; font-size: 11px; }
.analytics-composition-bars { display: grid; grid-auto-columns: 88px; grid-auto-flow: column; width: max-content; max-width: 100%; align-items: end; gap: 6px; margin-inline: auto; padding: 7px 10px 6px; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-composition-column { display: grid; min-width: 88px; grid-template-rows: 17px 54px minmax(22px, auto); align-items: end; justify-items: center; gap: 2px; text-align: center; }
.analytics-composition-column span { align-self: start; color: #53677d; font-size: 12px; line-height: 1.35; }
.analytics-composition-column strong { color: #293e55; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.analytics-composition-track { display: block; width: 22px; height: 54px; overflow: visible; border-radius: 4px; }
.analytics-composition-track-bg { fill: #edf1f4; }
.analytics-composition-fill { fill: var(--action); }
.analytics-composition-fill.is-negative { fill: var(--red); }
.analytics-composition-zero { stroke: #8b9bad; stroke-width: 1; vector-effect: non-scaling-stroke; }
.analytics-coach-comparison { min-width: 0; }
.analytics-panel-title-row { display: flex; min-width: 0; align-items: center; gap: 9px; }
.analytics-status-chip { display: inline-flex; min-height: 24px; align-items: center; padding: 0 8px; border-radius: 999px; background: #fff2d9; color: #986413; font-size: 11px; font-weight: 750; white-space: nowrap; }
.analytics-status-chip.is-final { background: #e8f6ef; color: #257354; }
.coach-analysis-table { min-width: 1160px; table-layout: auto; }
.coach-analysis-table th, .coach-analysis-table td { text-align: center; vertical-align: middle; }
.coach-analysis-table th:first-child, .coach-analysis-table td:first-child, .coach-analysis-table th:nth-child(2), .coach-analysis-table td:nth-child(2), .coach-analysis-table th:nth-child(3), .coach-analysis-table td:nth-child(3), .coach-analysis-table th:nth-child(4), .coach-analysis-table td:nth-child(4) { text-align: left; }
.coach-analysis-table td { padding-block: 9px; }
.coach-analysis-table .analytics-rate-cell-value { color: #21415f; font-variant-numeric: tabular-nums; }
.coach-analysis-table tbody tr.is-selected { background: #edf6fd; box-shadow: inset 3px 0 0 var(--action); }
.analytics-coach-trend-matrix { min-width: 0; padding: 0 10px 7px; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-coach-trend-axis, .analytics-coach-trend-row { display: grid; min-width: 650px; grid-template-columns: minmax(130px, 170px) minmax(500px, 1fr); gap: 12px; }
.analytics-coach-trend-axis { align-items: end; padding: 7px 9px 4px; color: #788698; font-size: 9px; }
.analytics-coach-trend-axis > div { display: grid; align-items: center; text-align: center; }
.analytics-coach-trend-axis > div span:first-child { text-align: left; }
.analytics-coach-trend-axis > div span:last-child { text-align: right; }
.analytics-coach-trend-row { width: 100%; align-items: center; padding: 5px 9px; border: 0; border-top: 1px solid #e8edf2; background: #fff; color: inherit; text-align: left; font: inherit; cursor: pointer; }
.analytics-coach-trend-row:hover, .analytics-coach-trend-row:focus-visible { background: #f2f8fc; }
.analytics-coach-trend-row:focus-visible { outline: 2px solid var(--action); outline-offset: -2px; }
.analytics-coach-trend-name strong, .analytics-coach-trend-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.analytics-coach-trend-name strong { color: #263e56; font-size: 12px; }
.analytics-coach-trend-name small { margin-top: 3px; color: #6b7b8e; font-size: 10px; font-variant-numeric: tabular-nums; }
.analytics-coach-sparkline { display: block; width: 100%; height: 48px; overflow: visible; }
.analytics-coach-spark-zero { stroke: #c7d1da; stroke-width: 1; vector-effect: non-scaling-stroke; }
.analytics-coach-spark-line { fill: none; stroke: var(--action); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.analytics-coach-spark-point { fill: #fff; stroke: var(--orange); stroke-width: 2; vector-effect: non-scaling-stroke; }
.analytics-coach-trend-empty { margin: 0; padding: 18px 10px; color: #7b8897; font-size: 11px; text-align: center; }
.analytics-course-counts { grid-template-columns: 1fr; padding-bottom: 8px; }
.analytics-course-counts > div:first-child { border-top: 0; }
.customer-analysis-heading { min-height: 48px; justify-content: space-between; }
.customer-analysis-heading > div.customer-analysis-title-block:first-child { display: flex; min-width: 0; align-items: flex-start; gap: 13px; }
.customer-analysis-title-block > div { min-width: 0; }
.customer-analysis-back { min-height: 32px; flex: 0 0 auto; padding: 0 9px; border: 1px solid #c8d5e0; border-radius: 6px; background: #fff; color: var(--action-dark); cursor: pointer; font-size: 11px; font-weight: 700; }
.customer-analysis-back:hover, .customer-analysis-back:focus-visible { border-color: var(--action); background: var(--action-softer); }
.customer-analysis-heading h1 { font-size: 18px; letter-spacing: 0; }
.customer-analysis-heading p { margin: 3px 0 0; font-size: 12px; }
.customer-analysis-actions { display: flex; align-items: flex-end; flex-direction: column; gap: 4px; }
.customer-analysis-refresh-feedback { color: #a53c32; font-size: 11px; }
.customer-analysis-context-bar { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 6px 18px; margin: 0 0 10px; padding: 9px 12px; border: 1px solid #d5e1eb; border-radius: 7px; background: #f5f9fc; }
.customer-analysis-context-bar strong { color: #304b65; font-size: 12px; line-height: 1.5; }
.customer-analysis-context { margin: 0; color: #617286; font-size: 11px; line-height: 1.5; }
.customer-analysis-detail { min-width: 0; }
.customer-analysis-toolbar { align-items: flex-start; }
.customer-analysis-toolbar > div:first-child { min-width: 220px; }
.customer-analysis-filters { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 8px; }
.customer-analysis-filters .filter-pills { flex: 0 0 auto; }
.customer-analysis-filters .filter-pills button { white-space: nowrap; }
.customer-analysis-table { min-width: 780px; table-layout: fixed; }
.customer-analysis-table th, .customer-analysis-table td { text-align: center; vertical-align: middle; }
.customer-analysis-table th:nth-child(1) { width: 15%; }
.customer-analysis-table th:nth-child(2) { width: 20%; }
.customer-analysis-table th:nth-child(3) { width: 20%; }
.customer-analysis-table th:nth-child(4) { width: 45%; }
.customer-analysis-result-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.customer-analysis-fact-list { display: grid; gap: 8px; text-align: left; }
.customer-analysis-fact-list > div + div { padding-top: 8px; border-top: 1px solid #e7ebef; }
@media (max-width: 1500px) {
  .approval-filter-grid { justify-content: flex-start; }
  .approval-filter-group { flex: 0 0 auto; }
  .attendance-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) max-content max-content max-content; gap: 9px 12px; }
  .attendance-toolbar .table-search { width: 100%; }
  .attendance-toolbar .filter-pills { grid-column: 1 / 3; justify-self: start; }
  .attendance-toolbar .attendance-export-action { grid-column: 3; justify-self: end; margin-left: 0; }
  .attendance-toolbar .refresh-button { grid-column: 4; }
}
@media (max-width: 1260px) {
  .settings-field-groups { grid-template-columns: 1fr; }
}
@media (min-width: 761px) and (max-width: 1400px) {
  :root { --sidebar-width: 168px; }
  .brand { gap: 8px; padding-inline: 10px; }
  .brand-logo { width: 36px; height: 36px; }
  .nav-main:not([aria-expanded]) { padding-right: 28px; }
  .content { padding-inline: 16px; }
}
@media (max-width: 1100px) {
  .settings-category-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-category-nav button:nth-child(3) { border-left: 0; }
  .settings-category-nav button:nth-child(n + 3) { border-top: 1px solid #dce3eb; }
  .public-content-settings-grid { grid-template-columns: 1fr; }
  .public-content-form + .public-content-form { border-top: 1px solid var(--line); border-left: 0; }
  .analytics-metric-ribbon { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-metric-ribbon article:nth-child(3) { border-right: 0; }
  .analytics-metric-ribbon article:nth-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .analytics-grid-main, .analytics-coach-detail-grid, .analytics-store-secondary-grid { grid-template-columns: 1fr; }
  .analytics-growth-grid, .analytics-growth-grid.is-all-coaches, .analytics-coach-detail-grid.is-all-coaches { grid-template-columns: 1fr; }
  .analytics-customer-results { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-customer-results > *:nth-child(3) { border-right: 0; }
  .analytics-customer-results > *:nth-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .customer-analysis-toolbar { align-items: stretch; flex-direction: column; }
  .customer-analysis-filters { justify-content: flex-start; }
  .finance-calculation { gap: 19px; padding-inline: 13px; }
  .finance-calculation-term { padding-inline: 7px; }
  .finance-calculation-term:not(.finance-calculation-total)::after { right: -14px; }
  .expiry-reminder-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-action-bar { grid-template-columns: 1fr auto; }
  .settings-action-message { grid-column: 1 / -1; }
  .system-backup-compact { grid-template-columns: 1fr auto; }
  .system-backup-compact .form-message { grid-column: 1; }
  .summary-grid { grid-template-columns: repeat(2, 1fr); }
  .approval-summary-strip { grid-template-columns: repeat(3, 1fr); }
  .approval-filter-grid { align-items: flex-start; }
  .approval-filter-group { flex-wrap: wrap; }
  .approval-search-button { flex: 0 0 auto; }
  .global-search { width: auto; margin-left: 10px; }
  .attendance-toolbar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .attendance-toolbar .table-search { grid-column: 1 / -1; }
  .attendance-toolbar .filter-pills { grid-column: 2; }
  .attendance-toolbar .attendance-export-action { grid-column: 1; justify-self: start; }
  .attendance-toolbar .refresh-button { grid-column: 2; justify-self: end; }
  .attendance-toolbar .period-control, .attendance-toolbar .date-range-controls { min-width: 0; }
  .attendance-toolbar .date-range-trigger, .attendance-toolbar .period-control select, .attendance-toolbar .filter-select-trigger { width: 100%; min-width: 0; }
  .topbar-clouds { right: 98px; width: 46vw; opacity: .22; }
  .business-toolbar { align-items: stretch; flex-direction: column; }
  .business-toolbar-left, .business-toolbar-right { flex-wrap: wrap; justify-content: flex-start; }
  .business-toolbar-left .table-search { width: min(420px, 100%); }
  .member-toolbar { flex-wrap: wrap; }
  .member-toolbar .refresh-button { margin-left: 0; }
}
@media (max-width: 900px) {
  .finance-calculation { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 10px 18px 16px; }
  .finance-calculation-term { min-height: 64px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
  .finance-calculation-term:nth-child(odd):not(.finance-calculation-total) { border-right: 1px solid var(--line); }
  .finance-calculation-term:not(.finance-calculation-total)::after { display: none; }
  .finance-calculation-total { grid-column: 1 / -1; margin-top: 12px; border-bottom: 1px solid #c9ddec; }
}
@media (max-width: 760px) {
  .settings-category-nav { display: flex; overflow-x: auto; border-radius: 6px 6px 0 0; scrollbar-color: #b8c4d0 #eef2f6; scrollbar-width: thin; }
  .settings-category-nav button { flex: 0 0 190px; min-height: 62px; }
  .settings-category-nav button:nth-child(n) { border-top: 0; }
  .settings-category-nav button + button { border-left: 1px solid #dce3eb; }
  .settings-category-context { align-items: flex-start; }
  .public-content-fields, .public-profile-review-item dl { grid-template-columns: 1fr; }
  .public-content-fields label.is-wide { grid-column: auto; }
  .business-hours-range { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  .public-wechat-qr-field.is-wide { grid-column: auto; }
  .public-wechat-qr-manager { grid-template-columns: 1fr; }
  .public-wechat-qr-preview { width: min(140px, 100%); justify-self: center; }
  .public-wechat-qr-actions .row-actions { flex-wrap: wrap; }
  .public-profile-review-item { grid-template-columns: 1fr; }
  .public-profile-review-item > img { width: 100%; height: 260px; }
  .public-coach-status-row { grid-template-columns: minmax(0, 1fr) auto; align-items: start; padding-block: 10px; }
  .public-coach-status-row p { grid-column: 1 / -1; }
  .platform-offer-toolbar .compact-filter-field, .platform-offer-toolbar .compact-filter-select { width: 100%; }
  .analytics-page-heading { align-items: stretch; }
  .analytics-heading-actions { width: 100%; align-items: stretch; }
  .analytics-heading-actions .row-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .analytics-heading-actions .period-control { min-width: 0; align-items: stretch; flex-direction: column; gap: 4px; }
  .analytics-heading-actions .period-control input, .analytics-heading-actions .period-control select { width: 100%; min-width: 0; }
  .analytics-heading-actions .secondary-button { width: 100%; min-width: 0; min-height: 40px; padding-inline: 7px; white-space: nowrap; }
  .analytics-refresh-feedback { text-align: right; }
  .analytics-section-tabs button { min-height: 40px; padding-inline: 12px; }
  .analytics-series-control button { min-height: 40px; }
  .analytics-metric-ribbon { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-metric-ribbon article, .analytics-metric-ribbon article:nth-child(3) { min-height: 88px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 12px; }
  .analytics-metric-ribbon .analytics-metric-primary { grid-column: 1 / -1; min-height: 102px; border-right: 0; }
  .analytics-metric-ribbon article:nth-child(3), .analytics-metric-ribbon article:nth-child(5) { border-right: 0; }
  .analytics-metric-ribbon:not(.analytics-coach-ribbon) article:nth-last-child(-n + 2) { border-bottom: 0; }
  .analytics-coach-ribbon article:nth-child(4) { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
  .analytics-metric-ribbon strong { font-size: 20px; }
  .analytics-panel-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .analytics-series-control { max-width: 100%; }
  .analytics-customer-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-customer-results.is-five-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-customer-results > *, .analytics-customer-results > *:nth-child(3) { min-height: 100px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 11px 12px; }
  .analytics-customer-results > *:nth-child(even) { border-right: 0; }
  .analytics-customer-results > *:nth-last-child(-n + 2) { border-bottom: 0; }
  .analytics-panel-footer { align-items: stretch; flex-direction: column; }
  .analytics-panel-footer .secondary-button { width: 100%; }
  .analytics-growth-summary { grid-template-columns: 1fr; }
  .analytics-growth-summary article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .analytics-growth-summary article:last-child { border-bottom: 0; }
  .analytics-rate-chart { grid-template-columns: 28px minmax(0, 1fr); gap: 6px; padding-inline: 8px; }
  .analytics-rate-scale { margin: 0; padding-block: 25px 42px; }
  .analytics-rate-bars { grid-auto-columns: 84px; }
  .analytics-rate-column { min-width: 84px; padding-inline: 4px; }
  .analytics-rate-coach strong, .analytics-rate-coach small { white-space: normal; }
  .analytics-rate-reference { text-align: left; }
  .analytics-composition-bars { grid-auto-columns: 82px; padding-inline: 7px; }
  .analytics-composition-column { min-width: 82px; }
  .analytics-chart-wrap { overflow-x: auto; }
  .analytics-coach-comparison .table-wrap { overflow: visible; }
  .coach-analysis-table, .coach-analysis-table tbody, .coach-analysis-table tr, .coach-analysis-table td { display: block; width: 100%; }
  .coach-analysis-table { min-width: 0; }
  .coach-analysis-table thead { display: none; }
  .coach-analysis-table tbody { padding: 9px; }
  .coach-analysis-table tr { margin-bottom: 9px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
  .coach-analysis-table tr:last-child { margin-bottom: 0; }
  .coach-analysis-table td, .coach-analysis-table td:first-child, .coach-analysis-table td:nth-child(6) { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 9px; padding: 8px 0; border-bottom: 1px solid #edf1f4; text-align: left; }
  .coach-analysis-table td:last-child { border-bottom: 0; }
  .coach-analysis-table td::before { content: attr(data-label); color: #768597; font-size: 11px; font-weight: 700; }
  .coach-analysis-table tbody tr:hover { background: #fff; }
  .coach-analysis-table tbody tr.is-selected { background: #edf6fd; }
  .analytics-member-total { padding-top: 14px; }
  .customer-analysis-title-block { align-items: flex-start; flex-direction: column; gap: 8px; }
  .customer-analysis-back { min-height: 40px; }
  .customer-analysis-heading .row-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; min-width: 0; }
  .customer-analysis-heading .period-control { grid-column: 1 / -1; min-width: 0; }
  .customer-analysis-heading .period-control input { flex: 1 1 auto; width: auto; min-width: 0; }
  .customer-analysis-heading .secondary-button { min-width: 0; width: 100%; padding-inline: 8px; white-space: nowrap; }
  .customer-analysis-actions { width: 100%; min-width: 0; max-width: 100%; align-items: stretch; }
  .customer-analysis-refresh-feedback { text-align: right; }
  .customer-analysis-context-bar { align-items: flex-start; flex-direction: column; }
  .customer-analysis-filters { align-items: stretch; flex-direction: column; }
  .customer-analysis-filters .filter-pills { flex: 1 1 auto; max-width: 100%; }
  .customer-analysis-filters .filter-pills button { flex: 0 0 auto; }
  .settings-field-group.is-double, .settings-field-group.is-triple { grid-template-columns: 1fr; }
  .expiry-reminder-fields { grid-template-columns: 1fr; }
  .settings-action-bar, .system-backup-compact { grid-template-columns: 1fr; align-items: stretch; }
  .settings-action-message, .system-backup-compact .form-message { grid-column: auto; }
  .settings-action-bar button, .system-backup-compact button { width: 100%; }
  .system-backup-current { grid-template-columns: 1fr; }
  .system-backup-current > small { grid-column: 1; }
  .expiry-reminder-summary { grid-template-columns: 1fr 1fr; }
  .expiry-reminder-summary > span:nth-child(2) { border-right: 0; }
  .expiry-reminder-summary > span:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  html, body { max-width: 100%; overflow-x: hidden; }
  .app-shell { grid-template: 58px auto 1fr / minmax(0, 1fr); }
  .topbar { grid-column: 1; grid-template-columns: 1fr auto; height: 58px; }
  .brand { height: 58px; }
  .topbar-clouds { display: none; }
  .global-search, .account-button > span:not(.avatar) { display: none; }
  .sidebar { grid-row: 2; position: static; top: auto; align-self: stretch; height: auto; min-height: auto; overflow-y: visible; border-right: 0; border-bottom: 1px solid #173654; padding: 7px; }
  .collapse-button, .sidebar-note { display: none; }
  #side-navigation { display: flex; align-items: flex-start; overflow-x: auto; overflow-y: visible; margin: 0; gap: 4px; }
  .nav-main { width: auto; min-width: max-content; grid-template-columns: 25px auto; padding: 0 9px; }
  .nav-main em, .nav-main i { display: none !important; }
  .nav-group .nav-children { width: 170px; margin-left: 8px; padding-left: 10px; }
  .mobile-product-nav { display: grid; }
  .content { grid-column: 1; grid-row: 3; padding: 18px 14px 35px; }
  .workspace-card, .detail-panel, .toolbar, .table-wrap { min-width: 0; max-width: 100%; }
  .table-wrap { overflow-x: auto; overscroll-behavior-inline: contain; }
  .page-heading { align-items: stretch; flex-direction: column; }
  .page-error { align-items: stretch; flex-direction: column; }
  .summary-grid { grid-template-columns: 1fr 1fr; }
  .finance-result-grid { grid-template-columns: 1fr; }
  .finance-result-toolbar > div { align-items: flex-start; flex-direction: column; gap: 5px; }
  .finance-calculation { grid-template-columns: 1fr; }
  .finance-calculation-term:nth-child(odd):not(.finance-calculation-total) { border-right: 0; }
  .finance-calculation-total { grid-column: 1; }
  .approval-summary-strip { grid-template-columns: repeat(3, minmax(82px, 1fr)); overflow-x: auto; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .business-toolbar-left, .business-toolbar-right { align-items: stretch; flex-direction: column; }
  .date-range-controls { flex-wrap: wrap; }
  .date-range-trigger, .month-range-trigger { width: 100%; min-width: 0; }
  .month-range-controls { width: 100%; }
  .month-range-years { grid-template-columns: 1fr; max-height: min(62vh, 520px); overflow-y: auto; }
  .attendance-page-actions { flex-wrap: wrap; }
  .attendance-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .attendance-toolbar > *, .attendance-toolbar .filter-pills { grid-column: 1 / -1; }
  .attendance-toolbar .attendance-export-action { grid-column: 1; }
  .attendance-toolbar .refresh-button { grid-column: 2; }
  .attendance-toolbar .filter-pills { flex-wrap: wrap; }
  .range-calendars { grid-template-columns: 1fr; }
  .range-calendar:nth-child(2) { display: none; }
  .approval-card-header { align-items: center; }
  .approval-filter-grid { display: flex; }
  .approval-filter-group { width: 100%; }
  .approval-search-group .approval-search-field, .approval-date-group .date-range-controls, .approval-date-group .inline-month-field, .approval-type-group .approval-select-field { flex: 1 1 180px; width: auto; }
  .approval-filter-grid .date-range-trigger { width: 100%; min-width: 0; }
  .approval-search-group input { width: 100% !important; }
  .approval-search-button { width: 100%; }
  .table-search { width: 100%; }
  .member-toolbar .compact-filter-field { width: 100%; }
  .member-toolbar .compact-filter-select { width: 100%; }
  .member-toolbar .export-button { margin-left: 0; }
  .member-result-count { width: 100%; }
  .filter-pills { overflow-x: auto; }
  .detail-header { align-items: flex-start; flex-direction: column; }
  .detail-header-actions { width: 100%; flex-wrap: wrap; }
  .order-detail-close { top: 0; right: 0; }
  .detail-context { flex-wrap: wrap; }
  .form-grid, .product-section-grid, .choice-cards, .payment-overview, .installment-amount-grid { grid-template-columns: 1fr; }
  .fixed-requirement { grid-template-columns: 1fr; }
  .platform-connection-row { grid-template-columns: 1fr max-content; align-items: start; }
  .platform-connection-row > p { grid-column: 1 / -1; }
  .platform-connection-row > button { justify-self: start; }
  .platform-offer-toolbar .business-toolbar-left { align-items: stretch; flex-direction: column; }
  .platform-offer-toolbar .table-search { width: 100%; }
  .payment-overview div { border-right: 0; border-bottom: 1px solid var(--line); }
  .timeline li { grid-template-columns: 1fr; gap: 4px; }
  .member-course-meta { grid-template-columns: 1fr; }
  .member-detail-page-heading { grid-template-columns: 1fr; gap: 12px; }
  .member-detail-actions { justify-content: flex-start; }
  .member-detail-tabs { overflow-x: auto; }
  .member-history-toolbar { align-items: stretch; flex-direction: column; }
  .member-profile-sheet { margin: 12px; padding: 20px; }
  .member-course-section { margin: 12px; }
  .member-profile-section-heading { flex-direction: column; }
  .member-profile-sheet dl { grid-template-columns: 1fr; }
  .payroll-rule-strip, .contract-summary-sheet dl { grid-template-columns: 1fr; }
  .member-card-action-list { grid-template-columns: 1fr; }
  .refund-policy-note { grid-template-columns: 1fr; }
  .refund-facts, .refund-calculation-grid { grid-template-columns: 1fr; }
  .refund-date-fields { grid-template-columns: 1fr; gap: 0; }
  .refund-fact { grid-template-columns: 88px minmax(0, 1fr); }
  .refund-calculation-grid > div:nth-child(odd) { border-right: 0; }
  .refund-formula { align-items: flex-start; flex-direction: column; gap: 4px; }
}
/* v74 compact store and coach analytics */
.analytics-compact-page { min-width: 0; }
.analytics-compact-panel { min-width: 0; margin: 0 0 10px; overflow: hidden; }
.analytics-compact-head,
.analytics-subhead { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 7px 11px; border-bottom: 1px solid var(--line); }
.analytics-compact-head h2,
.analytics-subhead strong { margin: 0; color: #20364e; font-size: 15px; line-height: 1.35; }
.analytics-inline-tools,
.analytics-range-tools { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.analytics-inline-period { min-width: 0; gap: 5px; }
.analytics-inline-period span { font-size: 12px; white-space: nowrap; }
.analytics-inline-period input { width: 128px; min-width: 0; height: 32px; padding: 4px 7px; font-size: 12px; }
.analytics-range-separator { color: #8090a1; font-size: 11px; }
.analytics-count-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.analytics-count-strip article { min-width: 0; padding: 8px 11px; border-right: 1px solid var(--line); background: #fff; }
.analytics-count-strip article:last-child { border-right: 0; }
.analytics-count-strip article.is-primary { box-shadow: inset 0 2px 0 var(--orange); background: #fff9f4; }
.analytics-count-strip span,
.analytics-count-strip small { display: block; color: #607287; font-size: 12px; line-height: 1.4; }
.analytics-count-strip strong { display: block; margin: 3px 0 1px; color: #203b57; font-size: 22px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.analytics-count-strip .is-primary strong { color: var(--orange-dark); }
.analytics-store-month-grid { display: grid; grid-template-columns: minmax(420px, max-content) minmax(520px, 1fr); align-items: start; }
.analytics-month-chart-area { min-width: 420px; border-right: 1px solid var(--line); }
.analytics-month-chart-area h3 { margin: 0; padding: 8px 11px 0; color: #334b63; font-size: 13px; }
.analytics-composition-bars-large { grid-auto-columns: 92px; padding-block: 8px; }
.analytics-composition-bars-large .analytics-composition-column { min-width: 92px; grid-template-rows: 17px 70px minmax(22px, auto); }
.analytics-composition-bars-large .analytics-composition-track { height: 70px; }
.analytics-store-side { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(260px, 1fr)); align-items: start; }
.analytics-mini-card { min-width: 0; background: #fff; }
.analytics-mini-card + .analytics-mini-card { border-left: 1px solid var(--line); }
.analytics-mini-card > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 11px; border-bottom: 1px solid #e8edf2; }
.analytics-mini-card > header strong { color: #334b63; font-size: 13px; }
.analytics-mini-card > header small { color: #6c7c8d; font-size: 12px; }
.analytics-rate-summary-compact { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.analytics-rate-summary-compact article { min-width: 0; padding: 8px 9px; border-right: 1px solid #e8edf2; }
.analytics-rate-summary-compact article:last-child { border-right: 0; }
.analytics-rate-summary-compact span,
.analytics-rate-summary-compact small { display: block; color: #5f7084; font-size: 12px; line-height: 1.4; }
.analytics-rate-summary-compact strong { display: block; margin: 3px 0 2px; color: #203b57; font-size: 19px; font-variant-numeric: tabular-nums; }
.analytics-coach-table-panel .table-wrap { max-height: none; }
.coach-analysis-table { min-width: 1040px; }
.coach-analysis-table th,
.coach-analysis-table td,
.coach-analysis-table th:nth-child(2),
.coach-analysis-table td:nth-child(2),
.coach-analysis-table th:nth-child(3),
.coach-analysis-table td:nth-child(3),
.coach-analysis-table th:nth-child(4),
.coach-analysis-table td:nth-child(4) { text-align: center; }
.coach-analysis-table th:first-child,
.coach-analysis-table td:first-child { text-align: left; }
.analytics-coach-workspace-head { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 7px 12px; padding: 8px 11px; border-bottom: 1px solid var(--line); }
.analytics-coach-workspace-head h2 { margin: 0; color: #20364e; font-size: 15px; }
.analytics-coach-metrics { max-width: 100%; justify-self: end; overflow-x: auto; }
.analytics-coach-selector-row { display: flex; min-width: 0; grid-column: 1 / -1; align-items: center; gap: 6px; color: #637386; font-size: 12px; }
.analytics-coach-selector { display: flex; min-width: 0; flex: 1 1 auto; gap: 5px; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-coach-chip { display: inline-flex; min-height: 30px; flex: 0 0 auto; align-items: center; gap: 5px; padding: 0 9px; border: 1px solid #d2dde7; border-radius: 999px; background: #fff; color: #4e6277; font: inherit; font-size: 12px; white-space: nowrap; cursor: pointer; }
.analytics-coach-chip i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; }
.analytics-coach-chip:hover,
.analytics-coach-chip:focus-visible { border-color: var(--action); background: var(--action-softer); }
.analytics-coach-chip.is-active { border-color: #91bad8; background: #eef7fd; color: #1f5d8e; font-weight: 700; }
.analytics-coach-chart-grid { display: grid; min-width: 0; grid-template-columns: minmax(380px, max-content) minmax(520px, 1fr); align-items: start; }
.analytics-coach-monthly-chart { min-width: 380px; border-right: 1px solid var(--line); }
.analytics-coach-range-chart { min-width: 0; }
.analytics-coach-bars { display: grid; width: max-content; max-width: 100%; grid-auto-flow: column; grid-auto-columns: 82px; justify-content: start; gap: 6px; padding: 8px 10px; overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-coach-bar { display: grid; min-width: 82px; grid-template-rows: 18px 72px minmax(22px, auto); align-items: end; justify-items: center; gap: 2px; text-align: center; }
.analytics-coach-bar > strong { color: #293e55; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.analytics-coach-bar > span:last-child { width: 100%; align-self: start; overflow: hidden; color: #53677d; font-size: 12px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.analytics-coach-bar-track { display: block; width: 24px; height: 72px; overflow: visible; border-radius: 4px; }
.analytics-coach-bar-track-bg { fill: #edf1f4; }
.analytics-coach-bar-fill { fill: var(--analytics-series-color); }
.analytics-coach-bar-fill.is-negative { fill: var(--red); }
.analytics-coach-bar-zero { stroke: #9cabb9; stroke-width: 1.4; }
.analytics-coach-bar-missing { stroke: #8b9bad; stroke-dasharray: 3 2; stroke-width: 1.4; }
.analytics-chart-empty { margin: 0; padding: 18px 10px; color: #788697; font-size: 11px; text-align: center; }
.analytics-multi-series-line { fill: none; stroke: var(--analytics-series-color); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.analytics-multi-series-point { fill: #fff; stroke: var(--analytics-series-color); stroke-width: 2.2; vector-effect: non-scaling-stroke; }
.analytics-multi-legend { display: flex; min-height: 24px; align-items: center; justify-content: flex-end; gap: 5px 12px; flex-wrap: wrap; padding: 2px 10px 8px; color: #5f7084; font-size: 12px; }
.analytics-multi-legend span { display: inline-flex; align-items: center; gap: 5px; }
.analytics-multi-legend i { display: inline-block; width: 14px; height: 2px; flex: 0 0 auto; }
.analytics-coach-chip i,
.analytics-multi-legend i { background: var(--analytics-series-color); }
.analytics-coach-color-0 { --analytics-series-color: #28679e; }
.analytics-coach-color-1 { --analytics-series-color: #ef6b24; }
.analytics-coach-color-2 { --analytics-series-color: #2c9270; }
.analytics-coach-color-3 { --analytics-series-color: #7357ad; }
.analytics-coach-color-4 { --analytics-series-color: #c04f64; }
.analytics-coach-color-5 { --analytics-series-color: #7b91a8; }
.analytics-coach-color-6 { --analytics-series-color: #8a6a34; }

@media (max-width: 1260px) {
  .analytics-store-month-grid,
  .analytics-coach-chart-grid { grid-template-columns: 1fr; }
  .analytics-month-chart-area,
  .analytics-coach-monthly-chart { min-width: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .analytics-store-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .analytics-count-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-count-strip article:nth-child(3n) { border-right: 0; }
  .analytics-count-strip article:nth-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .analytics-coach-workspace-head { grid-template-columns: 1fr; }
  .analytics-coach-metrics { width: 100%; justify-self: stretch; }
  .analytics-coach-selector-row { grid-column: auto; }
}
@media (max-width: 760px) {
  .analytics-compact-head,
  .analytics-subhead { align-items: stretch; flex-direction: column; }
  .analytics-inline-tools,
  .analytics-range-tools { width: 100%; justify-content: flex-start; }
  .analytics-inline-period { flex: 1 1 126px; }
  .analytics-inline-period input { width: 100%; }
  .analytics-count-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-count-strip article,
  .analytics-count-strip article:nth-child(3n) { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .analytics-count-strip article:nth-child(even) { border-right: 0; }
  .analytics-count-strip article:nth-last-child(-n + 2) { border-bottom: 0; }
  .analytics-store-side { grid-template-columns: 1fr; }
  .analytics-mini-card + .analytics-mini-card { border-top: 1px solid var(--line); border-left: 0; }
  .analytics-rate-summary-compact { grid-template-columns: 1fr; }
  .analytics-rate-summary-compact article { border-right: 0; border-bottom: 1px solid #e8edf2; }
  .analytics-rate-summary-compact article:last-child { border-bottom: 0; }
  .analytics-coach-selector-row { align-items: flex-start; flex-wrap: wrap; }
  .analytics-coach-selector { width: 100%; flex-basis: 100%; }
  .analytics-coach-chart-grid { grid-template-columns: 1fr; }
  .coach-analysis-table td,
  .coach-analysis-table td:first-child,
  .coach-analysis-table td:nth-child(2),
  .coach-analysis-table td:nth-child(3),
  .coach-analysis-table td:nth-child(4),
  .coach-analysis-table td:nth-child(6) { text-align: left; }
}

.member-retention { margin-block: 16px 24px; padding-block: 12px; border-block: 1px solid var(--line); }
.member-retention summary { cursor: pointer; min-height: 44px; padding-block: 12px; font-weight: 700; }
.member-retention form { max-width: 760px; }
.member-retention input[type="date"] { max-width: 190px; }
.member-retention .checkbox-row, #offline-account-form .checkbox-row { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.member-retention .checkbox-row input, #offline-account-form .checkbox-row input { flex: 0 0 auto; width: 18px; height: 18px; }
.member-retention button, #offline-account-form button { min-height: 44px; }
.member-retention summary:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; }
.member-retention p, #offline-account-form p { line-height: 1.7; }
@media (max-width: 600px) {
  .member-retention .form-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .login-screen { place-items: start center; padding: 18px 14px; }
  .login-card { gap: 16px; padding: 22px; }
  .login-card h1 { font-size: 24px; }
  .login-card input:not([type="checkbox"]), .login-card button { min-height: 44px; }
  .login-legal { padding-bottom: 8px; }
  .login-legal a { min-height: 44px; }
  .legal-header { min-height: 64px; gap: 12px; padding: 9px 16px; }
  .legal-brand img { width: 40px; height: 40px; }
  .legal-brand strong { font-size: 14px; }
  .legal-brand small { display: none; }
  .legal-back { min-height: 44px; padding: 0 11px; }
  .legal-main { width: min(100% - 20px, 960px); padding: 16px 0 28px; }
  .legal-status { grid-template-columns: 1fr; gap: 4px; padding: 13px 14px; }
  .legal-document { padding: 24px 18px 30px; border-radius: 14px; }
  .legal-title { margin-bottom: 26px; }
  .legal-title h1 { font-size: 30px; }
  .legal-facts { grid-template-columns: 1fr; margin-bottom: 30px; }
  .legal-facts div:nth-child(odd) { padding-right: 0; }
  .legal-facts div + div { border-top: 1px solid var(--line); }
  .legal-document section { margin-top: 28px; }
  .legal-document h2 { font-size: 18px; }
  .legal-footer { align-items: flex-start; flex-direction: column; padding: 18px 16px; }
}

#installment-release-form select { max-width: 220px; min-height: 44px; }
#installment-release-form textarea { width: 100%; min-height: 76px; font: inherit; padding: 10px; border: 1px solid var(--line); border-radius: 4px; }
#installment-release-form button { min-height: 44px; }
#installment-release-form p { line-height: 1.6; }
.refund-calculation-details { margin-block: 18px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--text); }
.refund-calculation-details h4, .refund-calculation-details h5 { margin: 0 0 8px; font-size: 14px; }
#refund-preview-info > .refund-calculation-details { padding-inline: 16px; }
.refund-calculation-basis { margin: 0 0 12px; }
.refund-calculation-periods { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr)); gap: 16px 24px; }
.refund-calculation-period { min-width: 0; }
.refund-calculation-details p { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 14px; margin: 6px 0; line-height: 1.6; overflow-wrap: anywhere; }
.refund-calculation-details p > span { flex-shrink: 0; }
.refund-calculation-details p > strong { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.refund-calculation-total { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 8px; }
.refund-record-details { margin-block: 10px; }
.refund-record-details summary { cursor: pointer; min-height: 44px; padding-block: 10px; }
#approval-detail-body > .refund-calculation-details { grid-column: 1 / -1; margin: 0; padding: 14px; }
@media (max-width: 600px) {
  .refund-calculation-details p { flex-direction: column; gap: 2px; }
  .refund-calculation-details p > strong { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* D-110: one independently saved booking policy. */
.settings-operations-layout { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 12px; margin-bottom: 12px; }
.settings-operations-layout > .workspace-card { min-width: 0; margin: 0; }
.booking-policy-card { container: booking-panel / inline-size; }
.member-operations-settings-card { container: operating-panel / inline-size; }
.booking-policy-form, #member-operations-settings-form { padding: 16px; }
.booking-policy-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 24px; }
.booking-policy-form > .booking-policy-fields, .booking-policy-form > .field-help { grid-column: 1 / -1; }
.booking-policy-form > .field-help { margin: 0; }
#booking-policy-message.is-success { color: var(--green); }
.booking-policy-fields { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 16px 32px; }
.booking-policy-fields fieldset { min-width: 0; padding: 0; border: 0; margin: 0; flex: 0 1 auto; }
.booking-policy-fields legend { margin-bottom: 10px; font-weight: 700; font-size: 14px; }
.booking-policy-fields label { display: flex; align-items: center; justify-content: flex-start; gap: 12px; margin-bottom: 8px; font-size: 13px; }
.booking-policy-fields fieldset:nth-child(2) label > span:first-child { min-width: 9em; }
.booking-policy-fields fieldset:last-child { flex: 1 1 380px; max-width: 650px; display: flex; flex-wrap: wrap; align-content: start; gap: 8px 24px; }
.booking-policy-fields fieldset:last-child .field-help { flex-basis: 100%; margin: 0; }
.booking-policy-fields input[type=number] { width: 88px; min-height: 40px; padding: 0 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); font: inherit; }
.booking-policy-fields input[type=number]:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; }
.booking-policy-fields .settings-value-with-unit { display: inline-flex; align-items: center; gap: 8px; }
.booking-policy-fields i { min-width: 2em; font-size: 12px; font-style: normal; }
.booking-policy-fields .booking-policy-toggle { justify-content: flex-start; min-height: 40px; }
.booking-policy-toggle input { width: 20px; height: 20px; accent-color: var(--action); }
.booking-policy-summary { align-self: center; margin: 0; font-size: 13px; color: var(--muted); line-height: 1.6; }
.settings-operations-layout .settings-action-bar { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; margin: 12px 0 0; padding: 0; border: 0; background: transparent; }
.booking-policy-form > .settings-action-bar { margin: 0; }
.booking-policy-form:has(.settings-action-message:not(:empty)) > .settings-action-bar { grid-column: 1 / -1; }
.settings-operations-layout .settings-action-message { flex: 1 1 180px; margin-right: auto; }
.settings-operations-layout .settings-action-message:empty { display: none; }
@container operating-panel (min-width: 1000px) {
  #member-operations-settings-form .settings-field-groups { grid-template-columns: minmax(300px, 380px) minmax(340px, 460px) minmax(220px, 280px); gap: 32px; }
  #member-operations-settings-form .settings-reservation-rules { gap: 8px; }
  #member-operations-settings-form .settings-field-group.is-double:not(.settings-reservation-rules) { grid-template-columns: 140px minmax(180px, 1fr); }
}
@container operating-panel (min-width: 1350px) {
  #member-operations-settings-form .settings-field-groups { grid-template-columns: 400px 620px minmax(220px, 280px); }
  #member-operations-settings-form .settings-field-group.is-double:not(.settings-reservation-rules) { grid-template-columns: 124px 180px 124px 124px; gap: 12px 16px; }
}
@container booking-panel (min-width: 1350px) {
  .booking-policy-fields fieldset:not(:last-child) { display: flex; flex-wrap: wrap; gap: 0 20px; }
  .booking-policy-fields fieldset:nth-child(2) label > span:first-child { min-width: 0; }
  .booking-policy-fields fieldset:last-child { flex: 1 1 380px; }
}
@container booking-panel (max-width: 650px) {
  .booking-policy-form { grid-template-columns: minmax(0, 1fr); }
  .booking-policy-fields fieldset:last-child { flex-basis: 100%; }
}
#card-expiry-reminder-form { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 12px 16px; }
#card-expiry-reminder-form .expiry-reminder-fields { flex: 1 1 740px; }
#card-expiry-reminder-form .settings-action-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: end; margin: 0 0 0 auto; padding: 0; border: 0; background: transparent; }
@media (max-width: 1000px) { .platform-connection-row, .platform-connection-row:has(> button:nth-of-type(2)) { grid-template-columns: minmax(0, 1fr) max-content; align-items: start; } .platform-connection-row > p { grid-column: 1 / -1; } }
@media (max-width: 700px) {
  .settings-operations-layout .settings-action-bar button, #card-expiry-reminder-form .settings-action-bar button { width: auto; min-height: 40px; }
  .booking-policy-form, #member-operations-settings-form { padding: 12px; }
}
.employee-wechat-status { font-weight: 700; }
.employee-binding-qr { margin: 18px 0; text-align: center; }
.employee-binding-qr canvas { display: block; width: min(280px, 100%); height: auto; margin: 0 auto; image-rendering: pixelated; }
.employee-binding-qr p { margin: 8px 0; color: var(--ink); }
.employee-binding-password { width: 100%; max-width: 320px; }
#employee-wechat-dialog textarea { box-sizing: border-box; width: 100%; min-height: 72px; padding: 9px 10px; border: 1px solid var(--control-border); border-radius: var(--control-radius); font: inherit; color: var(--ink); background: var(--surface); resize: vertical; }
#employee-wechat-dialog textarea:focus { outline: 2px solid var(--action); outline-offset: 2px; }
#employee-wechat-dialog .dialog-actions { flex-wrap: wrap; }
