:root {
  --ivory: #fffaf8;
  --rose-50: #fbf0f2;
  --rose-100: #f4dfe4;
  --rose-300: #d8aab4;
  --rose-500: #b97886;
  --rose-700: #7d4653;
  --brown: #3a292d;
  --gold: #c6a56c;
  --gold-light: #eadbbe;
  --line: rgba(125, 70, 83, .14);
  --shadow: 0 18px 50px rgba(91, 54, 63, .13);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", Georgia, serif;
  color: var(--brown);
  background: var(--ivory);
}
* { box-sizing: border-box; }
html { background: #eadde0; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #fff 0, var(--rose-50) 40%, #eee2e4 100%); }
button, input { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.screen { min-height: 100vh; }
.loading-screen { display: grid; place-content: center; text-align: center; gap: 18px; color: var(--rose-700); }
.brand-mark { width: 52px; height: 52px; border: 1px solid var(--gold); border-radius: 50%; display: grid; place-items: center; margin: auto; color: var(--gold); font-size: 24px; }
.brand-mark.large { width: 78px; height: 78px; font-size: 34px; }
.login-screen { display: grid; place-items: center; padding: 28px 18px; }
.login-panel { width: min(100%, 430px); background: rgba(255,250,248,.9); border: 1px solid var(--line); border-radius: 28px; padding: 38px 28px; box-shadow: var(--shadow); text-align: center; backdrop-filter: blur(14px); }
.eyebrow { margin: 0 0 6px; letter-spacing: .18em; font-size: 11px; color: var(--rose-500); }
h1,h2,h3,p { overflow-wrap: anywhere; }
.login-panel h1, .topbar h1 { margin: 0; letter-spacing: .16em; font-size: 23px; font-weight: 500; }
.login-copy { margin: 18px 0 28px; color: #765f65; font-size: 14px; }
label { display: block; text-align: left; margin: 0 0 17px; }
label span { display: block; margin-bottom: 7px; font-size: 12px; color: #755c63; }
input { width: 100%; height: 52px; padding: 0 15px; border: 1px solid var(--line); border-radius: 13px; background: #fff; outline: none; }
input:focus { border-color: var(--rose-500); box-shadow: 0 0 0 3px rgba(185,120,134,.12); }
.form-error { min-height: 20px; color: #a43e55; font-size: 12px; text-align: left; }
.primary-button, .secondary-button { width: 100%; min-height: 52px; border-radius: 14px; letter-spacing: .11em; }
.primary-button { border: 0; color: #fff; background: linear-gradient(135deg, var(--rose-500), #c78e99); box-shadow: 0 10px 24px rgba(185,120,134,.25); }
.primary-button:disabled { opacity: .6; cursor: wait; }
.primary-button.muted { margin-top: 17px; background: linear-gradient(135deg, #d7b1b9, #c795a0); }
.primary-button small { display: block; font-size: 9px; margin-top: 3px; letter-spacing: .04em; }
.secondary-button { border: 1px solid var(--line); background: #fff; color: var(--rose-700); }
.text-button { border: 0; background: none; color: var(--rose-700); margin: 15px 0 4px; text-decoration: underline; font-size: 12px; }
.support-note { font-size: 11px; color: #947f84; }
.app-screen { width: min(100%, 520px); margin: 0 auto; background: var(--ivory); box-shadow: 0 0 60px rgba(74,45,52,.18); padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
.topbar { min-height: 82px; padding: max(18px, env(safe-area-inset-top)) 20px 14px; display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(255,250,248,.9); backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 5; }
.icon-button { border: 0; background: transparent; color: var(--rose-700); font-size: 25px; padding: 6px 9px; }
.view { display: none; padding: 20px; }
.view.active { display: block; }
.member-card { min-height: 268px; border-radius: 23px; padding: 23px; color: #fff8f4; position: relative; overflow: hidden; box-shadow: 0 20px 45px rgba(60,35,42,.26); border: 1px solid rgba(235,212,166,.65); }
.member-card::before { content:""; position:absolute; width:360px; height:180px; right:-120px; bottom:-80px; border-radius:50%; border:1px solid rgba(234,219,190,.35); box-shadow: 0 0 0 17px rgba(234,219,190,.05), 0 0 0 36px rgba(234,219,190,.04); transform: rotate(-12deg); }
.rank-member { background: linear-gradient(145deg,#cbaeb5,#a57d87); }
.rank-silver { background: linear-gradient(145deg,#a9a4a7,#696368); }
.rank-gold { background: linear-gradient(145deg,#5a303a,#261b1f 68%); }
.rank-platinum { background: linear-gradient(145deg,#737174,#3f3c40); }
.rank-black { background: linear-gradient(145deg,#262125,#080708); }
.card-header { display:flex; justify-content:space-between; align-items:center; font-size:11px; letter-spacing:.17em; color:var(--gold-light); }
.mini-emblem { width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--gold); border-radius:50%; font-size:18px; }
.member-card h2 { font-size:43px; font-weight:500; margin:17px 0 13px; letter-spacing:.06em; color:var(--gold-light); }
.member-name { font-size:18px; letter-spacing:.13em; margin:0 0 5px; }
.member-since { margin:0; font-size:12px; opacity:.78; }
.points-row { position:absolute; bottom:24px; left:23px; display:flex; align-items:baseline; gap:9px; color:var(--gold-light); }
.points-row strong { font-size:39px; font-weight:400; }
.points-row span { font-size:11px; letter-spacing:.12em; }
.surface { background:#fff; border:1px solid var(--line); border-radius:19px; box-shadow:0 10px 28px rgba(93,59,67,.07); }
.next-status { margin-top:18px; padding:20px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:15px; }
.section-heading h3 { margin:0; font-size:19px; font-weight:500; }
.rank-badge { width:44px; height:44px; border:1px solid var(--gold); border-radius:50%; display:grid; place-items:center; color:var(--gold); font-size:17px; }
.progress-track { height:7px; background:#eee8e6; border-radius:99px; margin:16px 0 12px; overflow:hidden; }
.progress-fill { height:100%; width:0; background:linear-gradient(90deg,var(--rose-500),var(--gold)); transition: width .5s ease; }
.detail-list { margin:0; }
.detail-list div { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-top:1px solid var(--line); }
.detail-list dt { color:#836e74; font-size:11px; }
.detail-list dd { margin:0; text-align:right; font-size:12px; }
.page-title { margin:5px 0 18px; text-align:center; }
.page-title h2 { margin:0; font-weight:500; letter-spacing:.08em; }
.calendar-card { padding:16px; }
.calendar-header { display:flex; align-items:center; justify-content:space-between; }
.calendar-header h3 { margin:0; font-weight:500; }
.weekdays, .calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; }
.weekdays { margin:15px 0 7px; color:#a18d92; font-size:10px; }
.calendar-day { aspect-ratio:1; display:grid; place-items:center; border-radius:50%; position:relative; font-size:13px; }
.calendar-day.empty { visibility:hidden; }
.calendar-day.visit { color:var(--rose-700); border:1px solid var(--gold); background:linear-gradient(135deg,#fff,#f7e9ec); font-weight:600; }
.calendar-day.visit::after { content:""; position:absolute; inset:3px; border:1px dotted rgba(198,165,108,.7); border-radius:50%; }
.entry-list { display:grid; gap:12px; margin-top:16px; }
.entry-card { background:#fff; border:1px solid var(--line); border-radius:17px; padding:16px; display:flex; justify-content:space-between; align-items:center; gap:14px; box-shadow:0 8px 23px rgba(93,59,67,.06); }
.entry-card .entry-title { margin:3px 0; font-size:15px; }
.entry-card .entry-meta { margin:0; font-size:10px; color:#99868b; }
.entry-points { white-space:nowrap; color:var(--gold); font-size:19px; }
.empty-state { padding:28px 18px; text-align:center; color:#937f84; background:#fff; border:1px dashed var(--line); border-radius:17px; }
.rank-table { margin-top:18px; padding:16px 18px; }
.rank-table > p { text-align:center; }
.rank-table > div { display:flex; justify-content:space-between; padding:13px 8px; border-top:1px solid var(--line); font-size:12px; }
.rank-table > div.current { background:linear-gradient(90deg,transparent,var(--rose-100),transparent); color:var(--rose-700); font-weight:700; }
.profile-card { padding:28px; text-align:center; margin-bottom:16px; }
.profile-emblem { width:70px; height:70px; margin:0 auto 14px; display:grid; place-items:center; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font-size:30px; }
.profile-card h3 { margin:0 0 7px; }
.profile-card p { margin:5px 0; font-size:12px; color:#8a747a; }
.bottom-nav { position:fixed; z-index:10; bottom:0; left:50%; transform:translateX(-50%); width:min(100%,520px); min-height:72px; padding:8px 10px calc(8px + env(safe-area-inset-bottom)); display:grid; grid-template-columns:repeat(4,1fr); background:rgba(255,250,248,.94); backdrop-filter:blur(15px); border-top:1px solid var(--line); }
.nav-button { border:0; background:none; color:#938086; display:grid; justify-items:center; gap:3px; }
.nav-button span { font-size:21px; }
.nav-button small { font-size:9px; letter-spacing:.05em; }
.nav-button.active { color:var(--rose-500); }
.toast { position:fixed; left:50%; bottom:95px; transform:translate(-50%,25px); width:max-content; max-width:calc(100% - 40px); padding:12px 17px; border-radius:12px; color:#fff; background:#48363b; opacity:0; pointer-events:none; transition:.25s; z-index:30; font-size:12px; }
.toast.show { opacity:1; transform:translate(-50%,0); }
@media (min-width: 700px) { body { padding:24px 0; } .app-screen { min-height:calc(100vh - 48px); border-radius:28px; overflow:hidden; } .bottom-nav { bottom:24px; border-radius:0 0 28px 28px; } }


/* Staff desk */
.staff-screen { width:min(100%,620px); margin:0 auto; background:var(--ivory); box-shadow:0 0 60px rgba(74,45,52,.18); }
.staff-topbar { min-height:82px; padding:max(18px,env(safe-area-inset-top)) 22px 14px; display:flex; align-items:flex-end; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,250,248,.92); backdrop-filter:blur(12px); }
.staff-topbar h1 { margin:0; letter-spacing:.16em; font-size:23px; font-weight:500; }
.staff-content { padding:25px 20px 44px; }
.staff-title { margin-bottom:22px; }
.staff-email { margin:7px 0 0; color:#8e777d; font-size:11px; }
.staff-panel { padding:22px; }
.staff-guide { margin:0 0 20px; color:#765f65; font-size:13px; line-height:1.8; }
.checkin-result { margin-top:18px; padding:24px; text-align:center; border-color:rgba(198,165,108,.45); background:linear-gradient(145deg,#fff,#fff8f7); }
.checkin-result h3 { margin:5px 0 0; font-size:22px; font-weight:500; }
.result-points { margin:20px 0 12px; display:grid; gap:3px; color:var(--gold); }
.result-points span { font-size:39px; }
.result-points small { color:#8f7a80; font-size:10px; letter-spacing:.08em; }
.staff-note { margin:18px 8px 0; color:#9a858a; font-size:10px; line-height:1.8; text-align:center; }
@media (min-width:700px) { .staff-screen { min-height:calc(100vh - 48px); border-radius:28px; overflow:hidden; } }


/* QR check-in */
.member-qr-panel { margin-top:18px; padding:22px; text-align:center; border-color:rgba(198,165,108,.45); background:linear-gradient(145deg,#fff,#fff6f6); }
.member-qr-panel h3 { margin:6px 0 10px; font-size:21px; font-weight:500; }
.member-qr-panel > p:not(.eyebrow):not(.form-error) { color:#7f6970; font-size:12px; line-height:1.8; }
.member-qr-result { display:grid; gap:2px; margin-top:17px; padding-top:16px; border-top:1px solid var(--line); color:var(--gold); }
.member-qr-result span { font-size:34px; }
.member-qr-result small { color:#8f7a80; }
.checkin-guide { margin-top:16px; padding:14px; text-align:center; font-size:11px; color:#8c777d; border:1px dashed var(--line); border-radius:15px; }
.qr-panel { margin-bottom:20px; text-align:center; }
.qr-panel h3 { margin:5px 0 10px; font-size:21px; font-weight:500; }
.qr-display { display:grid; justify-items:center; gap:10px; margin-top:18px; padding:18px; border:1px solid var(--gold-light); border-radius:17px; background:#fffaf8; }
.qr-display canvas { width:min(100%,260px)!important; height:auto!important; border-radius:8px; }
.qr-display strong { color:var(--rose-700); font-size:14px; letter-spacing:.08em; }
.qr-display.expired { opacity:.55; filter:grayscale(.4); }
.qr-url { max-width:100%; margin:0; color:#a08b90; font-size:9px; overflow-wrap:anywhere; }
.staff-divider { display:flex; align-items:center; gap:12px; margin:22px 4px; color:#a18b91; font-size:10px; letter-spacing:.12em; }
.staff-divider::before,.staff-divider::after { content:""; height:1px; flex:1; background:var(--line); }


/* Member registration */
.member-create-panel h3 { margin:5px 0 10px; font-size:21px; font-weight:500; }
.member-create-form { display:grid; gap:15px; }
.member-create-form label { display:grid; gap:7px; }
.member-create-form label > span { color:#765f65; font-size:11px; }
.member-create-form input,
.member-create-form select { width:100%; min-height:48px; padding:0 14px; border:1px solid var(--line); border-radius:12px; background:#fffdfc; color:#4d3d41; font:inherit; box-sizing:border-box; }
.form-grid-two { display:grid; grid-template-columns:1fr 1.35fr; gap:12px; }
.member-create-result { margin:18px 0 20px; padding:24px; text-align:center; border-color:rgba(198,165,108,.45); background:linear-gradient(145deg,#fff,#fff8f7); }
.member-create-result h3 { margin:5px 0 16px; font-size:22px; font-weight:500; }
.temporary-password { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-weight:700; letter-spacing:.06em; overflow-wrap:anywhere; }
.compact-button { margin-top:14px; }
@media (max-width:430px) { .form-grid-two { grid-template-columns:1fr; } }

.onboarding-guide { margin:0 0 18px; padding:12px 14px; border:1px solid rgba(185,120,134,.28); border-radius:14px; background:#fff7f8; color:var(--rose-700); font-size:13px; line-height:1.7; }
.registration-login-qr { display:grid; justify-items:center; gap:10px; margin-top:18px; padding-top:18px; border-top:1px solid rgba(198,165,108,.35); }
.registration-login-qr canvas { width:min(100%,220px)!important; height:auto!important; border-radius:10px; background:#fff; padding:8px; box-shadow:0 10px 28px rgba(76,46,54,.08); }

/* v4.3 — membership card spacing fix */
.member-card {
  display: flex;
  flex-direction: column;
  min-height: 310px;
}
.member-card > * {
  position: relative;
  z-index: 1;
}
.points-row {
  position: static;
  left: auto;
  bottom: auto;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(234, 219, 190, .25);
}
.points-row strong {
  line-height: 1;
}

@media (max-width: 600px) {
  .member-card {
    min-height: 0;
    padding: 20px 20px 22px;
  }
  .member-card h2 {
    font-size: 38px;
    line-height: 1.05;
    margin: 18px 0 20px;
  }
  .member-name {
    font-size: 17px;
    line-height: 1.45;
    margin-bottom: 4px;
  }
  .member-since {
    line-height: 1.5;
  }
  .points-row {
    margin-top: 20px;
    padding-top: 16px;
    gap: 9px;
  }
  .points-row strong {
    font-size: 36px;
  }
  .points-row span {
    font-size: 10px;
    line-height: 1.25;
  }
}


/* Password reset */
.reset-password-notice {
  margin: 14px 0 10px;
  padding: 14px 16px;
  border: 1px solid rgba(198,165,108,.42);
  border-radius: 14px;
  background: linear-gradient(145deg,#fff,#fff7f8);
  color: #765f65;
  text-align: left;
  font-size: 12px;
  line-height: 1.7;
}
.reset-password-notice p { margin: 0; }
.reset-password-notice .eyebrow { margin-bottom: 6px; }
.mypage-logout-button { margin-top: 12px; }

/* v4.5 — custom password reset */
.reset-panel { max-width: 460px; }
.reset-account-email { margin: -8px 0 22px; color: #8a747a; font-size: 12px; overflow-wrap: anywhere; }
.password-rule { margin: -8px 0 14px; color: #9b878c; font-size: 11px; text-align: left; }
.reset-back-link { display: inline-block; margin-top: 18px; color: var(--rose-700); font-size: 12px; text-decoration: underline; }


/* v4.6 — check-in correction */
.member-create-form textarea {
  width: 100%;
  min-height: 92px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fffdfc;
  color: #4d3d41;
  font: inherit;
  line-height: 1.7;
  resize: vertical;
  box-sizing: border-box;
  outline: none;
}
.member-create-form textarea:focus {
  border-color: var(--rose-500);
  box-shadow: 0 0 0 3px rgba(185,120,134,.12);
}
.cancellation-panel h3 { margin: 5px 0 10px; font-size: 21px; font-weight: 500; }
.correction-button {
  border-color: rgba(125,70,83,.30);
  color: #7d4653;
  background: linear-gradient(145deg,#fff,#fbf0f2);
  font-weight: 600;
}
.correction-button:hover { background: #f8e8ec; }
.cancellation-result {
  margin-top: 18px;
  padding: 24px;
  text-align: center;
  border-color: rgba(185,120,134,.38);
  background: linear-gradient(145deg,#fff,#fff6f7);
}
.cancellation-result h3 { margin: 5px 0 0; font-size: 22px; font-weight: 500; }
.cancellation-points { color: var(--rose-700); }
.cancelled-entry { opacity: .58; }
.cancelled-entry .entry-title,
.cancelled-entry .entry-points { text-decoration: line-through; }


/* v4.7 Staff member selection */
.member-selector-panel h3 { margin:5px 0 10px; font-size:21px; font-weight:500; }
.member-select { width:100%; min-height:52px; padding:0 42px 0 14px; border:1px solid var(--line); border-radius:13px; background:#fffdfc; color:#4d3d41; font:inherit; appearance:auto; }
.member-select:focus { border-color:var(--rose-500); box-shadow:0 0 0 3px rgba(185,120,134,.12); outline:none; }
.member-refresh-button { margin:0 0 8px; }
.selected-member-preview { margin-top:12px; padding:16px; border:1px solid rgba(198,165,108,.42); border-radius:16px; background:linear-gradient(145deg,#fff,#fff7f8); display:flex; justify-content:space-between; align-items:center; gap:16px; }
.selected-member-preview > div:first-child { display:grid; gap:5px; }
.selected-member-preview strong { font-size:16px; font-weight:600; }
.selected-member-preview span { color:#8c747b; font-size:11px; }
.selected-member-status { display:grid; justify-items:end; gap:3px; white-space:nowrap; }
.selected-member-status span { color:var(--rose-700); letter-spacing:.08em; }
.selected-member-status strong { color:var(--gold); font-size:19px; }
.selected-member-reference { margin:0; padding:12px 14px; border-radius:12px; background:var(--rose-50); color:#765f65; font-size:12px; line-height:1.6; }
@media (max-width:430px) { .selected-member-preview { align-items:flex-start; } .selected-member-status { justify-items:start; } }


/* v4.8 — staff operation audit log */
.audit-panel h3 { margin:5px 0 0; font-size:21px; font-weight:500; }
.audit-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:12px; }
.audit-title-row .eyebrow { margin-bottom:0; }
.audit-count { flex:0 0 auto; min-width:52px; padding:7px 10px; border:1px solid rgba(198,165,108,.42); border-radius:999px; color:var(--gold); background:#fffaf5; font-size:11px; text-align:center; }
.audit-filters { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:10px; }
.audit-filters label { display:grid; gap:7px; }
.audit-filters label > span { color:#765f65; font-size:10px; }
.audit-filters input,
.audit-filters select { width:100%; min-height:46px; padding:0 12px; border:1px solid var(--line); border-radius:12px; background:#fffdfc; color:#4d3d41; font:inherit; font-size:12px; outline:none; }
.audit-filters input:focus,
.audit-filters select:focus { border-color:var(--rose-500); box-shadow:0 0 0 3px rgba(185,120,134,.12); }
.audit-toolbar { display:flex; justify-content:flex-end; margin:10px 0 2px; }
.audit-log-list { display:grid; gap:11px; margin-top:14px; }
.audit-entry { position:relative; overflow:hidden; padding:15px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 7px 20px rgba(93,59,67,.05); }
.audit-entry::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--gold); }
.audit-entry.is-cancellation::before { background:var(--rose-700); }
.audit-entry.is-registration::before { background:var(--rose-300); }
.audit-entry-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.audit-entry-head time { color:#9a858a; font-size:9px; white-space:nowrap; }
.audit-action-badge { display:inline-flex; align-items:center; min-height:24px; padding:4px 9px; border-radius:999px; color:#765f65; background:var(--rose-50); font-size:9px; letter-spacing:.05em; }
.is-checkin .audit-action-badge { color:#8a6b38; background:#fff8e9; }
.is-cancellation .audit-action-badge { color:var(--rose-700); background:#f9e8ec; }
.audit-entry-main { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-top:11px; }
.audit-entry-main h4 { margin:0 0 4px; font-size:15px; font-weight:600; }
.audit-entry-main p { margin:0; color:#947f85; font-size:10px; line-height:1.6; }
.audit-points { color:var(--gold); font-size:18px; white-space:nowrap; }
.is-cancellation .audit-points { color:var(--rose-700); }
.audit-entry-meta { display:flex; flex-wrap:wrap; gap:5px 12px; margin-top:11px; padding-top:10px; border-top:1px solid var(--line); color:#8a747a; font-size:9px; line-height:1.6; }
.audit-reason { margin:9px 0 0; padding:9px 11px; border-radius:10px; background:#fbf2f4; color:#765f65; font-size:10px; line-height:1.7; }
.audit-footnote { margin:14px 2px 0; color:#a18d92; font-size:9px; line-height:1.7; text-align:center; }
.audit-empty { margin-top:0; }
@media (max-width:560px) {
  .audit-filters { grid-template-columns:1fr; }
  .audit-title-row { align-items:center; }
  .audit-entry-head { align-items:flex-start; }
  .audit-entry-head time { white-space:normal; text-align:right; }
}

/* v4.9 — role-based access control and staff management */
.role-hidden { display:none !important; }
.staff-identity-row { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:12px; }
.staff-identity-row > div { min-width:0; }
.staff-identity-row strong { display:block; font-size:15px; font-weight:600; }
.staff-identity-row .staff-email { margin-top:4px; }
.staff-role-badge { flex:0 0 auto; display:inline-flex; align-items:center; min-height:30px; padding:6px 11px; border:1px solid var(--line); border-radius:999px; font-size:10px; letter-spacing:.06em; }
.staff-role-badge.is-admin { color:#8a6b38; border-color:rgba(198,165,108,.45); background:#fff8e9; }
.staff-role-badge.is-staff { color:var(--rose-700); border-color:rgba(185,120,134,.32); background:var(--rose-50); }
.staff-management-panel h3 { margin:5px 0 0; font-size:21px; font-weight:500; }
.staff-management-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:12px; }
.staff-create-form { margin-top:18px; padding:18px; border:1px solid rgba(198,165,108,.28); border-radius:16px; background:#fffdf9; }
.staff-create-result { margin:14px 0 18px; padding:17px; border:1px solid rgba(198,165,108,.36); border-radius:16px; background:linear-gradient(145deg,#fff,#fff8ea); }
.staff-create-result > strong { display:block; margin:3px 0 8px; font-size:17px; }
.staff-management-list { display:grid; gap:12px; margin-top:18px; }
.staff-access-card { padding:16px; border:1px solid var(--line); border-radius:17px; background:#fff; box-shadow:0 8px 24px rgba(93,59,67,.05); }
.staff-access-card.is-inactive { opacity:.68; background:#fbf7f8; }
.staff-access-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.staff-access-head strong { display:block; margin-bottom:4px; font-size:15px; }
.staff-access-head p { margin:0; color:#927d83; font-size:10px; line-height:1.6; }
.staff-status-badge { flex:0 0 auto; display:inline-flex; min-width:44px; justify-content:center; padding:5px 8px; border-radius:999px; font-size:9px; }
.staff-status-badge.is-active { color:#7b6538; background:#fff5d9; }
.staff-status-badge.is-stopped { color:#7d4653; background:#f6e7eb; }
.staff-access-fields { display:grid; grid-template-columns:1.35fr 1fr; gap:10px; margin-top:14px; }
.staff-access-fields label { display:grid; gap:6px; }
.staff-access-fields label > span { color:#765f65; font-size:10px; }
.staff-access-fields input,
.staff-access-fields select { width:100%; min-height:44px; padding:0 11px; border:1px solid var(--line); border-radius:11px; background:#fffdfc; color:#4d3d41; font:inherit; font-size:12px; outline:none; }
.staff-access-fields input:focus,
.staff-access-fields select:focus { border-color:var(--rose-500); box-shadow:0 0 0 3px rgba(185,120,134,.12); }
.staff-access-fields input:disabled,
.staff-access-fields select:disabled { background:#f5f1f2; color:#9b8e92; }
.staff-access-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:13px; padding-top:12px; border-top:1px solid var(--line); }
.staff-active-control { display:inline-flex; align-items:center; gap:8px; color:#765f65; font-size:10px; }
.staff-active-control input { width:17px; height:17px; accent-color:var(--rose-700); }
.staff-self-note,
.staff-auth-warning { margin:10px 0 0; padding:9px 11px; border-radius:10px; color:#7d4653; background:#fbf0f2; font-size:9px; line-height:1.65; }
.audit-entry.is-staff-management::before { background:#876fa0; }
.is-staff-management .audit-action-badge { color:#655174; background:#f3edf7; }
.is-staff-management .audit-points { color:#876fa0; }
@media (max-width:560px) {
  .staff-management-title-row { align-items:center; }
  .staff-access-fields { grid-template-columns:1fr; }
  .staff-access-actions { align-items:flex-start; flex-direction:column; }
  .staff-access-actions .compact-button { width:100%; }
}


/* v5.0 — member status management */
.member-status-panel h3 { margin:5px 0 0; font-size:21px; font-weight:500; }
.member-status-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:12px; }
.member-status-selector { display:grid; grid-template-columns:1fr 1.35fr; gap:12px; margin-top:16px; }
.member-status-selector label { display:grid; gap:7px; }
.member-status-selector label > span { color:#765f65; font-size:10px; }
.member-status-selector input,
.member-status-selector select { width:100%; min-height:48px; padding:0 13px; border:1px solid var(--line); border-radius:12px; background:#fffdfc; color:#4d3d41; font:inherit; font-size:12px; outline:none; box-sizing:border-box; }
.member-status-selector input:focus,
.member-status-selector select:focus { border-color:var(--rose-500); box-shadow:0 0 0 3px rgba(185,120,134,.12); }
.member-status-preview { margin-top:17px; padding:17px; border:1px solid rgba(198,165,108,.33); border-radius:17px; background:linear-gradient(145deg,#fff,#fffaf5); }
.member-status-preview-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.member-status-preview-head strong { display:block; margin-bottom:5px; font-size:16px; }
.member-status-preview-head p { margin:0; color:#927d83; font-size:10px; line-height:1.65; overflow-wrap:anywhere; }
.member-status-badge { flex:0 0 auto; display:inline-flex; min-width:48px; justify-content:center; padding:6px 10px; border-radius:999px; font-size:10px; letter-spacing:.05em; }
.member-status-badge.is-active { color:#6f6538; background:#fff4ce; border:1px solid rgba(198,165,108,.32); }
.member-status-badge.is-paused { color:#735c41; background:#f6eee1; border:1px solid rgba(164,132,84,.22); }
.member-status-badge.is-withdrawn { color:#7d4653; background:#f6e7eb; border:1px solid rgba(185,120,134,.24); }
.member-status-details { margin:14px 0 0; }
.member-status-form { margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }
.member-status-warning { margin:0; padding:11px 13px; border-radius:11px; background:#fbf0f2; color:#7d4653; font-size:10px; line-height:1.7; }
.member-status-result { margin-top:14px; padding:16px; border:1px solid rgba(198,165,108,.38); border-radius:16px; background:linear-gradient(145deg,#fff,#fff8e9); text-align:center; }
.member-status-result strong { display:block; margin:4px 0 7px; font-size:16px; }
.member-status-result p:last-child { margin:0; color:var(--rose-700); font-size:13px; font-weight:600; }
.audit-entry.is-member-status::before { background:#9a7c55; }
.is-member-status .audit-action-badge { color:#725a3e; background:#f7efe4; }
.is-member-status .audit-points { color:#9a7c55; }

@media (max-width:560px) {
  .member-status-title-row { align-items:center; }
  .member-status-selector { grid-template-columns:1fr; }
  .member-status-preview-head { align-items:flex-start; }
}

/* v5.1 — status expiry warning and automatic reset */
.status-expiry-notice {
  margin: 0 0 14px;
  padding: 15px 16px;
  border: 1px solid rgba(198,165,108,.36);
  border-radius: 16px;
  background: linear-gradient(145deg,#fffaf0,#fffdf9);
  color: #745c3c;
  box-shadow: 0 8px 22px rgba(93,59,67,.05);
}
.status-expiry-notice.is-critical {
  border-color: rgba(185,120,134,.42);
  background: linear-gradient(145deg,#fff,#fbf0f2);
  color: #7d4653;
}
.status-expiry-notice strong { display:block; margin-bottom:5px; font-size:14px; }
.status-expiry-notice p { margin:0; font-size:10px; line-height:1.7; }
.selected-member-expiry { font-size:9px; line-height:1.4; color:#9a858a; }
.selected-member-expiry.warning { color:#8a6b38; }
.selected-member-expiry.critical,
.selected-member-expiry.expired { color:#9a4f61; font-weight:600; }

.expiry-management-panel h3 { margin:5px 0 0; font-size:21px; font-weight:500; }
.expiry-management-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:12px; }
.expiry-summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }
.expiry-summary-card { display:flex; align-items:baseline; justify-content:center; gap:5px; padding:15px 12px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.expiry-summary-card span { margin-right:auto; font-size:10px; color:#806d72; }
.expiry-summary-card strong { font-size:27px; font-weight:500; }
.expiry-summary-card small { font-size:10px; color:#927d83; }
.expiry-summary-card.is-critical { border-color:rgba(185,120,134,.34); background:#fff7f8; color:#8e4e5e; }
.expiry-summary-card.is-warning { border-color:rgba(198,165,108,.36); background:#fffaf0; color:#8a6b38; }
.expiry-sweep-result { min-height:18px; margin:11px 2px 0; color:var(--rose-700); font-size:10px; line-height:1.6; }
.expiry-warning-list { display:grid; gap:9px; margin-top:13px; }
.expiry-member-row { width:100%; display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 14px; border:1px solid var(--line); border-radius:14px; background:#fff; color:#4d3d41; text-align:left; cursor:pointer; font:inherit; }
.expiry-member-row:hover { transform:translateY(-1px); box-shadow:0 8px 18px rgba(93,59,67,.06); }
.expiry-member-row span:first-child { min-width:0; display:grid; gap:4px; }
.expiry-member-row strong { font-size:13px; font-weight:600; }
.expiry-member-row small { color:#927d83; font-size:9px; line-height:1.5; }
.expiry-member-row.is-critical { border-color:rgba(185,120,134,.32); background:#fff9fa; }
.expiry-member-row.is-warning { border-color:rgba(198,165,108,.3); background:#fffdf8; }
.expiry-days-badge { flex:0 0 auto; min-width:62px; padding:6px 8px; border-radius:999px; background:#f9edf0; color:#8d4e5d; font-size:9px; text-align:center; }
.is-warning .expiry-days-badge { background:#fff4dc; color:#806231; }
.audit-entry.is-status-expiry::before { background:#b06b7b; }
.is-status-expiry .audit-action-badge { color:#854b59; background:#f8e9ed; }
.is-status-expiry .audit-points { color:#9a4f61; }

@media (max-width:560px) {
  .expiry-management-title-row { align-items:flex-start; flex-direction:column; }
  .expiry-management-title-row .text-button { align-self:flex-end; }
  .expiry-summary-grid { grid-template-columns:1fr 1fr; }
  .expiry-summary-card { padding:13px 10px; }
  .expiry-summary-card span { font-size:9px; }
  .expiry-member-row { align-items:flex-start; }
}


/* v5.2 — iPhone Home Screen / PWA install experience */
.topbar-actions { display:flex; align-items:center; gap:8px; }
.app-install-chip {
  min-height:36px; padding:0 12px; border:1px solid rgba(198,165,108,.45); border-radius:999px;
  background:rgba(255,250,248,.84); color:#7d4653; font:inherit; font-size:9px; letter-spacing:.12em;
  box-shadow:0 6px 18px rgba(93,59,67,.06); cursor:pointer;
}
.app-install-chip:hover { background:#fff; transform:translateY(-1px); }
.install-app-link {
  width:100%; display:flex; align-items:center; gap:12px; margin-top:18px; padding:12px 14px;
  border:1px solid rgba(198,165,108,.34); border-radius:15px; background:linear-gradient(145deg,#fff,#fff9ed);
  color:#57454a; text-align:left; cursor:pointer; font:inherit;
}
.install-app-link:hover { transform:translateY(-1px); box-shadow:0 8px 22px rgba(93,59,67,.06); }
.install-app-link > span:last-child { display:grid; gap:3px; }
.install-app-link strong { font-size:11px; font-weight:600; }
.install-app-link small { color:#927d83; font-size:9px; }
.install-mini-icon {
  flex:0 0 auto; width:38px; height:38px; display:grid; place-items:center; border-radius:11px;
  background:linear-gradient(145deg,#d7a5b0,#7d4653); color:#fffaf8; font-family:Georgia,"Times New Roman",serif;
  font-size:22px; box-shadow:inset 0 0 0 1px rgba(235,219,190,.5);
}

.install-app-card {
  position:relative; display:grid; grid-template-columns:auto 1fr; gap:12px 14px; align-items:center;
  margin:0 0 15px; padding:16px 42px 16px 16px; border:1px solid rgba(198,165,108,.42); border-radius:18px;
  background:linear-gradient(135deg,#fff,#fff8ec); box-shadow:0 10px 28px rgba(93,59,67,.07); overflow:hidden;
}
.install-app-card::after {
  content:""; position:absolute; right:-38px; bottom:-52px; width:145px; height:145px; border-radius:50%;
  border:1px solid rgba(198,165,108,.18); pointer-events:none;
}
.install-card-close {
  position:absolute; right:10px; top:8px; width:30px; height:30px; border:0; background:transparent;
  color:#a18d92; font-size:20px; cursor:pointer;
}
.install-app-emblem {
  grid-row:1 / span 2; width:54px; height:54px; display:grid; place-items:center; border-radius:16px;
  background:linear-gradient(145deg,#d7a5b0,#7d4653); color:#fffaf8; font-family:Georgia,"Times New Roman",serif;
  font-size:31px; box-shadow:inset 0 0 0 2px rgba(235,219,190,.48),0 8px 18px rgba(93,59,67,.14);
}
.install-app-copy { min-width:0; }
.install-app-copy .eyebrow { margin:0 0 4px; }
.install-app-copy strong { display:block; color:#4d3d41; font-size:13px; font-weight:600; }
.install-app-copy p:last-child { margin:5px 0 0; color:#88747a; font-size:9px; line-height:1.65; }
.install-app-primary {
  grid-column:2; justify-self:start; min-height:36px; padding:0 14px; border:0; border-radius:999px;
  background:#7d4653; color:#fff; font:inherit; font-size:9px; letter-spacing:.04em; cursor:pointer;
}
.install-app-primary:hover { background:#6d3b47; transform:translateY(-1px); }

body.modal-open { overflow:hidden; }
.install-guide-modal { position:fixed; inset:0; z-index:1000; display:flex; align-items:flex-end; justify-content:center; }
.install-guide-backdrop { position:absolute; inset:0; border:0; background:rgba(45,30,34,.46); backdrop-filter:blur(3px); }
.install-guide-sheet {
  position:relative; z-index:1; width:min(100%,520px); max-height:92vh; overflow:auto; padding:14px 24px calc(24px + env(safe-area-inset-bottom));
  border-radius:26px 26px 0 0; background:#fffaf8; box-shadow:0 -18px 60px rgba(45,30,34,.22); text-align:center;
  animation:installSheetIn .28s ease-out both;
}
@keyframes installSheetIn { from { transform:translateY(24px); opacity:0; } to { transform:translateY(0); opacity:1; } }
.install-guide-handle { width:42px; height:4px; margin:0 auto 14px; border-radius:999px; background:#decfd2; }
.install-guide-close { position:absolute; right:16px; top:14px; width:36px; height:36px; border:0; background:transparent; color:#9a858a; font-size:24px; cursor:pointer; }
.install-guide-app-icon {
  width:76px; height:76px; display:grid; place-items:center; margin:2px auto 14px; border-radius:21px;
  background:linear-gradient(145deg,#d7a5b0,#7d4653); color:#fffaf8; font-family:Georgia,"Times New Roman",serif;
  font-size:43px; box-shadow:inset 0 0 0 2px rgba(235,219,190,.58),0 10px 24px rgba(93,59,67,.18);
}
.install-guide-sheet h2 { margin:5px 0 18px; color:#4d3d41; font-size:22px; font-weight:500; }
.install-guide-steps { display:grid; gap:10px; margin:0; padding:0; list-style:none; text-align:left; }
.install-guide-steps li { display:flex; align-items:flex-start; gap:12px; padding:13px 14px; border:1px solid var(--line); border-radius:15px; background:#fff; color:#655359; font-size:12px; line-height:1.65; }
.install-step-number { flex:0 0 auto; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:#f4e5e8; color:#7d4653; font-size:10px; font-weight:700; }
.share-symbol { display:inline-block; margin-left:6px; color:#3f7bd9; font-size:16px; font-weight:600; }
.install-guide-note { margin:15px 4px 18px; color:#8b777d; font-size:10px; line-height:1.7; }
.is-standalone-app .app-install-chip,
.is-standalone-app .install-app-card,
.is-standalone-app .install-app-link { display:none !important; }

@media (max-width:560px) {
  .install-app-card { grid-template-columns:auto 1fr; padding:15px 38px 15px 14px; }
  .install-app-emblem { width:50px; height:50px; border-radius:14px; font-size:28px; }
  .install-app-copy strong { font-size:12px; }
  .install-guide-sheet { padding-left:18px; padding-right:18px; }
}

/* v5.3 — in-app QR scanner and device-neutral camera wording */
.member-qr-launch {
  margin-top:16px;
  padding:15px;
  border:1px dashed rgba(185,120,134,.28);
  border-radius:16px;
  background:rgba(255,250,248,.72);
  text-align:center;
}
.member-qr-launch > p {
  margin:0 0 12px;
  color:#8c777d;
  font-size:11px;
  line-height:1.75;
}
.qr-scan-button {
  width:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:10px 16px;
  border:1px solid rgba(198,165,108,.38);
  border-radius:15px;
  background:linear-gradient(145deg,#fff,#fff7ed);
  color:#57454a;
  font:inherit;
  text-align:left;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(93,59,67,.06);
}
.qr-scan-button:hover { transform:translateY(-1px); box-shadow:0 11px 28px rgba(93,59,67,.09); }
.qr-scan-button > span:last-child { display:grid; gap:3px; }
.qr-scan-button strong { font-size:12px; font-weight:600; }
.qr-scan-button small { color:#927d83; font-size:9px; }
.qr-scan-icon {
  position:relative;
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:10px;
  background:linear-gradient(145deg,#d7a5b0,#7d4653);
  box-shadow:inset 0 0 0 1px rgba(235,219,190,.55);
}
.qr-scan-icon::before,
.qr-scan-icon::after {
  content:"";
  position:absolute;
  inset:8px;
  border:2px solid #fffaf8;
}
.qr-scan-icon::after {
  inset:13px;
  border-width:0 2px 2px 0;
}

.qr-scanner-modal {
  position:fixed;
  inset:0;
  z-index:1100;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.qr-scanner-backdrop {
  position:absolute;
  inset:0;
  border:0;
  background:rgba(33,22,25,.66);
  backdrop-filter:blur(4px);
}
.qr-scanner-sheet {
  position:relative;
  z-index:1;
  width:min(100%,520px);
  max-height:96vh;
  overflow:auto;
  padding:14px 20px calc(22px + env(safe-area-inset-bottom));
  border-radius:26px 26px 0 0;
  background:#fffaf8;
  box-shadow:0 -18px 60px rgba(35,22,26,.3);
  text-align:center;
  animation:installSheetIn .26s ease-out both;
}
.qr-scanner-handle { width:42px; height:4px; margin:0 auto 14px; border-radius:999px; background:#decfd2; }
.qr-scanner-close {
  position:absolute;
  right:14px;
  top:12px;
  width:38px;
  height:38px;
  border:0;
  background:transparent;
  color:#9a858a;
  font-size:26px;
  cursor:pointer;
}
.qr-scanner-sheet h2 { margin:5px 0 7px; color:#4d3d41; font-size:21px; font-weight:500; }
.qr-scanner-copy { margin:0 0 14px; color:#88747a; font-size:10px; line-height:1.7; }
.qr-camera-stage {
  position:relative;
  width:100%;
  aspect-ratio:3 / 4;
  max-height:56vh;
  overflow:hidden;
  border-radius:20px;
  background:#241a1d;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 12px 30px rgba(45,30,34,.18);
}
.qr-camera-stage video {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.qr-camera-mask {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:linear-gradient(rgba(22,13,16,.34),rgba(22,13,16,.34));
  pointer-events:none;
}
.qr-camera-mask::before {
  content:"";
  width:min(67vw,270px);
  height:min(67vw,270px);
  max-width:74%;
  max-height:74%;
  border-radius:22px;
  box-shadow:0 0 0 999px rgba(22,13,16,.43);
}
.qr-camera-mask span {
  position:absolute;
  width:min(67vw,270px);
  height:min(67vw,270px);
  max-width:74%;
  max-height:74%;
  border:2px solid rgba(255,255,255,.9);
  border-radius:22px;
  box-shadow:0 0 22px rgba(255,255,255,.16);
}
.qr-camera-mask span::after {
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent,#f0cbd3,transparent);
  box-shadow:0 0 10px #e6aab7;
  animation:qrScanLine 2.1s ease-in-out infinite;
}
@keyframes qrScanLine {
  0%,100% { transform:translateY(-88px); opacity:.55; }
  50% { transform:translateY(88px); opacity:1; }
}
.qr-camera-waiting {
  position:absolute;
  inset:0;
  z-index:3;
  display:grid;
  place-items:center;
  padding:24px;
  background:linear-gradient(145deg,#3a2b30,#21171a);
  color:#f8edf0;
  font-size:11px;
  line-height:1.7;
}
.qr-scanner-message {
  min-height:38px;
  margin:12px 3px 10px;
  color:#7f6970;
  font-size:10px;
  line-height:1.7;
}
.qr-scanner-message.is-success { color:#765f36; font-weight:600; }
.qr-photo-button {
  width:100%;
  min-height:44px;
  border:1px solid rgba(185,120,134,.33);
  border-radius:14px;
  background:#fff;
  color:#7d4653;
  font:inherit;
  font-size:10px;
  cursor:pointer;
}
.qr-photo-button:hover { background:#fff7f8; }
.qr-scanner-note { margin:9px 5px 0; color:#9a858a; font-size:9px; line-height:1.65; }

@media (min-width:700px) {
  .qr-camera-stage { aspect-ratio:4 / 3; }
}


/* v5.4 — persistent sign-in UX */
.login-persistence-note {
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:7px;
  margin:12px auto 4px;
  max-width:330px;
  color:#887177;
  font-size:11px;
  line-height:1.65;
  text-align:left;
}
.login-persistence-note > span:first-child {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:17px;
  height:17px;
  margin-top:1px;
  border:1px solid rgba(185,120,134,.35);
  border-radius:50%;
  color:var(--rose-700);
  background:#fff8f9;
  font-size:10px;
  font-weight:700;
}


/* v5.5 — compact staff operations dashboard */
.staff-tool-menu {
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid rgba(198,165,108,.30);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,247,245,.92));
  box-shadow: 0 14px 34px rgba(91,57,65,.07);
}
.staff-tool-menu-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.staff-tool-menu-heading h3 { margin:4px 0 0; font-size:19px; font-weight:500; }
.staff-tool-menu-heading > small { color:#9b878c; font-size:9px; letter-spacing:.04em; }
.staff-tool-launcher-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.staff-tool-launcher {
  min-width:0;
  min-height:76px;
  padding:13px;
  display:flex;
  align-items:center;
  gap:11px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fffdfc;
  color:#5d474d;
  font:inherit;
  cursor:pointer;
  box-shadow:0 7px 18px rgba(91,57,65,.045);
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.staff-tool-launcher:hover { transform:translateY(-1px); border-color:rgba(185,120,134,.44); box-shadow:0 10px 24px rgba(91,57,65,.08); }
.staff-tool-launcher.is-active { border-color:rgba(198,165,108,.58); background:linear-gradient(145deg,#fffaf4,#fff5f5); box-shadow:0 10px 26px rgba(178,126,92,.10); }
.staff-tool-launcher-icon {
  flex:0 0 36px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(198,165,108,.36);
  border-radius:12px;
  background:#fff8ee;
  color:#9b7440;
  font-size:14px;
  line-height:1;
}
.staff-tool-launcher > span:last-child { min-width:0; display:grid; gap:4px; }
.staff-tool-launcher strong { font-size:12px; font-weight:600; line-height:1.35; }
.staff-tool-launcher small { color:#9b878c; font-size:8px; line-height:1.45; }
.staff-tool-accordion-list { display:grid; gap:12px; }
.staff-tool-accordion {
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fffdfc;
  box-shadow:0 10px 28px rgba(91,57,65,.055);
}
.staff-tool-accordion > summary {
  min-height:72px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  gap:12px;
  list-style:none;
  cursor:pointer;
  user-select:none;
  background:linear-gradient(145deg,#fffdfc,#fff9f8);
}
.staff-tool-accordion > summary::-webkit-details-marker { display:none; }
.staff-tool-accordion[open] > summary { border-bottom:1px solid var(--line); background:linear-gradient(145deg,#fff9f4,#fff5f5); }
.staff-tool-summary-copy { min-width:0; flex:1; display:grid; gap:4px; }
.staff-tool-summary-copy small { color:#b28b58; font-size:8px; letter-spacing:.13em; }
.staff-tool-summary-copy strong { color:#554147; font-size:15px; font-weight:600; }
.staff-tool-chevron { flex:0 0 auto; color:#a48b91; font-size:20px; transform:rotate(0deg); transition:transform .2s ease; }
.staff-tool-accordion[open] .staff-tool-chevron { transform:rotate(180deg); }
.staff-tool-accordion > summary .audit-count { margin-left:auto; }
.staff-tool-body { padding:20px; }
.staff-tool-body > .staff-panel {
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.staff-tool-body > .staff-panel + .staff-panel { margin-top:18px; }
.staff-tool-body > .checkin-result,
.staff-tool-body > .member-create-result,
.staff-tool-body > .cancellation-result { margin-top:18px; }
.staff-tool-inner-divider { display:flex; align-items:center; gap:11px; margin:22px 0; color:#9f898f; font-size:9px; letter-spacing:.08em; }
.staff-tool-inner-divider::before,.staff-tool-inner-divider::after { content:""; height:1px; flex:1; background:var(--line); }
.staff-manual-checkin-panel { padding-top:18px !important; border-top:1px dashed var(--line) !important; }
.staff-tool-body .member-status-title-row,
.staff-tool-body .expiry-management-title-row,
.staff-tool-body .staff-management-title-row { align-items:center; }
.staff-tool-body .member-status-title-row > .staff-guide,
.staff-tool-body .expiry-management-title-row > .staff-guide,
.staff-tool-body .staff-management-title-row > .staff-guide { margin:0; flex:1; }
@media (min-width:700px) {
  .staff-tool-launcher-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:430px) {
  .staff-tool-menu { padding:15px; border-radius:19px; }
  .staff-tool-menu-heading { align-items:flex-start; }
  .staff-tool-menu-heading > small { display:none; }
  .staff-tool-launcher { min-height:70px; padding:11px; gap:9px; }
  .staff-tool-launcher-icon { flex-basis:32px; width:32px; height:32px; border-radius:10px; }
  .staff-tool-launcher strong { font-size:11px; }
  .staff-tool-launcher small { font-size:7.5px; }
  .staff-tool-accordion > summary { min-height:66px; padding:14px 16px; }
  .staff-tool-body { padding:17px; }
  .staff-tool-body .member-status-title-row,
  .staff-tool-body .expiry-management-title-row,
  .staff-tool-body .staff-management-title-row { align-items:flex-start; flex-direction:column; }
}