:root {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #172033;
  background: linear-gradient(180deg, #f7f9fe 0%, #eef3fb 100%);
  --text: #172033;
  --muted: #637083;
  --line: #e1e8f3;
  --card: #ffffff;
  --primary: #172033;
  --soft: #edf2fb;
  --green: #2f7d46;
  --yellow: #8a6d00;
  --red: #a52222;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
a { color: inherit; }
button, input, select { font: inherit; }
main { max-width: 1160px; margin: 0 auto; padding: 24px; }
.header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; }
h1 { margin: 0; font-size: clamp(26px, 4vw, 34px); letter-spacing: .02em; }
h2 { margin: 0 0 8px; font-size: 20px; }
p { line-height: 1.6; }
.subtitle { color: var(--muted); margin: 6px 0 0; }
.card, .notice-bar { background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 22px; padding: 18px; box-shadow: 0 12px 32px rgba(22,32,51,.07); margin-bottom: 16px; }
.notice-bar { background: #f8fbff; color: #28415f; }
.grid { display: grid; gap: 14px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.seats { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.stack { display: grid; gap: 12px; }
.input, .select { width: 100%; padding: 13px 14px; border: 1px solid #c9d4e7; border-radius: 14px; background: #fff; outline: none; }
.input:focus, .select:focus { border-color: #7f91b8; box-shadow: 0 0 0 4px rgba(127,145,184,.18); }
.button { border: 0; border-radius: 14px; padding: 12px 18px; min-height: 46px; background: var(--primary); color: white; cursor: pointer; text-decoration: none; display: inline-flex; justify-content: center; align-items: center; gap: 8px; font-weight: 700; }
.button.secondary { background: #e8edf6; color: var(--text); }
.button.danger { background: #ba1a1a; }
.button:disabled { opacity: .46; cursor: not-allowed; }
.notice, .error { padding: 12px 14px; border-radius: 14px; margin-bottom: 12px; }
.notice { background: #eef6ff; color: #174a77; border: 1px solid #cfe6ff; }
.error { background: #fff0f0; color: #9a1b1b; border: 1px solid #ffd2d2; }
.section-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.compact-head { margin-bottom: 8px; }
.store-switcher { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.store-switcher .button { width: 100%; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.stat-card { border: 1px solid var(--line); border-radius: 16px; padding: 12px; background: #fbfcff; }
.stat-card strong { display: block; font-size: 24px; line-height: 1; margin-top: 4px; }
.stat-card span { color: var(--muted); font-size: 13px; }
.legend { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 13px; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.dot { width: 12px; height: 12px; border-radius: 999px; display: inline-block; border: 1px solid rgba(0,0,0,.08); }
.dot.available { background: #ecf8ef; }
.dot.reserved { background: #fff3bd; }
.dot.checked_in { background: #ffdada; }
.seat { min-height: 112px; border: 1px solid #d5deec; border-left-width: 8px; border-radius: 18px; padding: 13px; background: #fff; cursor: pointer; text-align: left; transition: transform .12s ease, box-shadow .12s ease; }
.seat:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(22,32,51,.10); }
.seat.available { border-left-color: #4caf62; }
.seat.reserved { background: #fff8da; border-left-color: #e2bd32; }
.seat.checked_in { background: #ffe7e7; border-left-color: #df5c5c; }
.seat.own { box-shadow: 0 0 0 3px rgba(23,32,51,.12); }
.seat-code { font-size: 21px; font-weight: 800; }
.seat-status { font-size: 13px; color: #596579; margin-top: 5px; }
.status-pill { display: inline-flex; padding: 6px 10px; border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.status-pill.neutral { background: #eef2f8; color: #46556b; }
.status-pill.available { background: #e8f7ec; color: var(--green); }
.status-pill.reserved { background: #fff4c8; color: var(--yellow); }
.status-pill.checked_in { background: #ffe2e2; color: var(--red); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { padding: 10px; border-bottom: 1px solid #e8edf4; text-align: left; white-space: nowrap; }
th { color: #546179; font-size: 13px; background: #f8fafc; }
.hidden { display: none !important; }
.full-width { grid-column: 1 / -1; }
@media (max-width: 760px) {
  main { padding: 14px; }
  .grid.two, .grid.three { grid-template-columns: 1fr; }
  .grid.seats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .header, .section-head { align-items: flex-start; flex-direction: column; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .button { width: 100%; }
}
@media (min-width: 900px) { .seat { min-height: 124px; } }


/* v14 店舗別レイアウト表示 */
.view-toggle { margin-top: 14px; }
.button.compact { padding: 8px 12px; min-height: 36px; border-radius: 10px; font-size: 13px; }
.seat-map-wrap { margin-top: 16px; }
.seat-map-card { background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 22px; padding: 16px; box-shadow: 0 12px 32px rgba(22,32,51,.07); overflow-x: auto; }
.seat-map-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.seat-map { position: relative; min-width: 760px; border: 1px solid #d9e1ee; border-radius: 18px; background: linear-gradient(135deg, #f8fafc, #eef3fb); overflow: hidden; }
.seat-map::before { content: ""; position: absolute; inset: 12px; border: 2px dashed rgba(99,112,131,.20); border-radius: 14px; pointer-events: none; }
.map-label { position: absolute; z-index: 1; padding: 5px 9px; border-radius: 999px; background: rgba(255,255,255,.86); border: 1px solid rgba(99,112,131,.22); color: var(--muted); font-size: 12px; font-weight: 700; }
.map-label.entrance { left: 3%; bottom: 4%; }
.map-label.aisle { right: 3%; top: 4%; }
.seat-position { position: absolute; z-index: 2; }
.seat.layout-seat { width: 100%; height: 100%; min-height: 0; padding: 6px; border-left-width: 0; border-width: 2px; border-radius: 12px; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2px; overflow: hidden; }
.seat.layout-seat .seat-code { font-size: clamp(12px, 1.4vw, 17px); line-height: 1.1; }
.seat.layout-seat .seat-status { font-size: 11px; margin-top: 0; }
.seat.layout-seat:not(:disabled):hover { transform: scale(1.03); }
@media (max-width: 760px) {
  .seat-map-card { padding: 12px; }
  .seat-map { min-width: 680px; }
}

/* v16 ログイン中の利用番号表示 */
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.login-identity { display: inline-flex; align-items: center; gap: 7px; padding: 10px 13px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: 0 8px 20px rgba(22,32,51,.06); white-space: nowrap; }
.login-identity-label { color: var(--muted); font-size: 12px; font-weight: 700; }
.login-identity strong { font-size: 14px; }
.login-display-name { color: var(--muted); font-size: 13px; }
@media (max-width: 760px) {
  .header-actions { width: 100%; justify-content: space-between; }
  .login-identity { flex: 1 1 auto; }
  .header-actions .button { width: auto; }
}


/* v17: 会員自身のパスワード変更 */
.account-settings summary { cursor: pointer; font-weight: 800; font-size: 18px; }
.account-settings[open] summary { margin-bottom: 12px; }
.account-password-form { max-width: 560px; margin-top: 14px; }

.password-change-notice { font-weight: 800; }

/* v18: ACT Excel忠実レイアウト + 満席時のみ予備席 */
.overflow-message { margin: 9px 0 0; padding: 9px 11px; border-radius: 12px; background: #f3f5f8; border: 1px solid #d9e1ea; color: #566274; font-size: 13px; font-weight: 800; }
.overflow-message.usable { background: #eef9f1; border-color: #bfe7c8; color: #1f6f3c; }
.seat.overflow-unavailable { opacity: .72; }
.seat.overflow-seat:not(.faithful-seat) { border-style: dashed; }
.seat-map.faithful-map { background-color: #fff; background-origin: border-box; border-radius: 8px; }
.seat-map.faithful-map::before { display: none; }
.seat.faithful-seat { position: relative; width: 100%; height: 100%; min-height: 0; padding: 0; border: 3px solid transparent; border-radius: 3px; background: transparent !important; box-shadow: none; overflow: visible; }
.seat.faithful-seat .seat-code,
.seat.faithful-seat .seat-status { display: none; }
.seat.faithful-seat.available:not(:disabled):hover { transform: none; border-color: #1677ff; box-shadow: 0 0 0 2px rgba(22,119,255,.16); }
.seat.faithful-seat.reserved { border-color: #f2a900; background: rgba(255,244,200,.18) !important; }
.seat.faithful-seat.checked_in { border-color: #d9363e; background: rgba(255,226,226,.18) !important; }
.seat.faithful-seat.own { box-shadow: 0 0 0 3px rgba(23,32,51,.22); }
.seat.faithful-seat.reserved::after,
.seat.faithful-seat.checked_in::after,
.seat.faithful-seat.overflow-unavailable::after { position: absolute; right: 1px; top: 1px; padding: 2px 4px; border-radius: 4px; color: #fff; font-size: 9px; line-height: 1.15; font-weight: 900; white-space: nowrap; }
.seat.faithful-seat.reserved::after { content: "予約"; background: #d88700; }
.seat.faithful-seat.checked_in::after { content: "利用中"; background: #c92f35; }
.seat.faithful-seat.overflow-unavailable::after { content: "満席時のみ"; background: #657286; }
.seat.faithful-seat:disabled { cursor: not-allowed; }

/* v19: 女性専用席 */
.seat.female-restricted:not(.faithful-seat) { opacity: .68; border-style: dashed; }
.seat.faithful-seat.female-restricted::after { position:absolute; right:1px; top:1px; padding:2px 4px; border-radius:4px; color:#fff; font-size:9px; line-height:1.15; font-weight:900; white-space:nowrap; content:"女性専用"; background:#c46a00; }

.seat.assigned-restricted:not(.faithful-seat) { opacity: .68; border-style: dashed; }
.seat.faithful-seat.assigned-restricted::after { position:absolute; right:1px; top:1px; padding:2px 4px; border-radius:4px; color:#fff; font-size:9px; line-height:1.15; font-weight:900; white-space:nowrap; content:"指定席"; background:#8a2e91; }

/* v32: 指定席契約会員は指定店舗内で自分の指定席以外を選択不可 */
.seat.assigned-plan-restricted:not(.faithful-seat) { opacity: .58; border-style: dashed; }
.seat.faithful-seat.assigned-plan-restricted::after { position:absolute; right:1px; top:1px; padding:2px 4px; border-radius:4px; color:#fff; font-size:9px; line-height:1.15; font-weight:900; white-space:nowrap; content:"選択不可"; background:#6b4b78; }


/* v33 現地受付 */
.onsite-reception-card { border: 2px solid #dbe7f5; }
.onsite-code-form { display: grid; grid-template-columns: minmax(180px, 260px) auto; gap: 12px; align-items: end; margin-top: 12px; }
.onsite-code-form label { font-weight: 700; }
.onsite-code-input { font-size: 32px; letter-spacing: .28em; text-align: center; font-variant-numeric: tabular-nums; }
.onsite-target { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; padding: 12px 14px; background: #f7faff; border: 1px solid #dbe7f5; border-radius: 12px; }
.onsite-target span { color: #5d6b80; }
.onsite-status.success-state { background: #edf9f2; border-color: #bfe6ce; color: #17613b; font-weight: 700; }
.onsite-status.alert-state { background: #fff0f0; border-color: #f3c3c3; color: #9a1b1b; font-weight: 800; }
@media (max-width: 640px) { .onsite-code-form { grid-template-columns: 1fr; } .onsite-code-input { font-size: 28px; } }

/* v34 plan permissions */
.seat.plan-restricted, .seat.lite-capacity-restricted { opacity: .48; cursor: not-allowed; }
#loginPlanBadge { margin-left: 6px; }

/* v36: マイページ化 */
.member-nav { display:flex; gap:10px; flex-wrap:nowrap; overflow-x:auto; padding:12px; position:sticky; top:8px; z-index:20; }
.member-nav .button { min-width:128px; white-space:nowrap; }
.member-tab-panel { animation: member-tab-in .12s ease-out; }
@keyframes member-tab-in { from { opacity:.45; transform:translateY(2px); } to { opacity:1; transform:none; } }
.home-summary-card { min-height:220px; }
.summary-list { display:grid; gap:10px; margin:14px 0; }
.summary-list > div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid #edf1f7; }
.summary-list > div:last-child { border-bottom:0; }
.summary-list span { color:var(--muted); }
.summary-list strong { text-align:right; }
.notice-list, .request-list { display:grid; gap:10px; }
.notice-item, .request-item { padding:14px; border:1px solid var(--line); border-radius:16px; background:#fbfcff; }
.notice-item-head, .request-item-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.notice-item-head time, .request-item small { color:var(--muted); font-size:12px; }
.notice-item p, .request-item p { margin:8px 0 0; }
.compact-request { padding:10px 12px; }
.admin-note { padding:8px 10px; border-radius:10px; background:#eef6ff; color:#174a77; }
.member-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:end; }
.member-form label { display:grid; gap:6px; color:#3c4656; font-size:14px; }
.member-form .full-width { grid-column:1 / -1; }
.member-form .form-actions { display:flex; align-items:end; }
.textarea { min-height:112px; resize:vertical; }
.checkbox-label { display:flex !important; flex-direction:row; align-items:center; gap:8px; min-height:46px; }
.checkbox-label input { width:18px; height:18px; }
.status-placeholder { margin-top:16px; padding:20px; border:1px dashed #c9d4e7; border-radius:16px; color:var(--muted); text-align:center; background:#f9fbfe; font-weight:700; }
.compact-notice { margin:12px 0 0; }
.danger-zone { border-color:#f0caca; }
@media (max-width:760px) {
  .member-nav { top:0; margin-left:-2px; margin-right:-2px; }
  .member-nav .button { width:auto; min-width:112px; }
  .member-form { grid-template-columns:1fr; }
  .summary-list > div { flex-direction:column; gap:4px; }
  .summary-list strong { text-align:left; }
}


/* v37: Square保存カード更新 */
.card-update-panel { margin-top:16px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fbfcff; }
.member-square-card { min-height:96px; margin-bottom:12px; padding:12px; border:1px solid #d9e1ee; border-radius:14px; background:#fff; }
.card-update-consent { margin:10px 0; padding:12px; border-radius:12px; background:#f3f7fd; }
#cardUpdateMessage .error { margin-top:12px; }
#cardUpdateMessage .notice, #cardUpdateMessage .success { margin-top:12px; }
.button.is-busy { cursor:wait; pointer-events:none; }
.button.is-busy::before { content:""; width:.9em; height:.9em; margin-right:.5em; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:member-spin .75s linear infinite; }
@keyframes member-spin { to { transform:rotate(360deg); } }


/* v38: OFFPEAK利用可否の明確化 + 予約画面の縦幅圧縮 */
#selectedStoreText { margin-top: 8px; font-weight: 800; color: #46556b; }
.offpeak-availability { display:flex; align-items:center; gap:12px; padding:11px 14px; margin:-2px 0 10px; border:1px solid; border-radius:14px; background:#fff; }
.offpeak-availability strong { font-size:15px; }
.offpeak-availability span { font-size:13px; }
.offpeak-availability.available { background:#edf9f2; border-color:#bfe6ce; color:#17613b; }
.offpeak-availability.allowance { background:#fff8df; border-color:#efda8e; color:#6e5600; }
.offpeak-availability.unavailable { background:#fff0f0; border-color:#ffd2d2; color:#9a1b1b; }

.operational-compact-card { padding:12px 14px; margin-bottom:10px; }
.onsite-compact-head { align-items:center; margin-bottom:7px; }
.onsite-compact-head h2, .seat-status-card h2 { margin:0; font-size:18px; white-space:nowrap; }
.onsite-compact-row { display:flex; align-items:center; gap:10px; }
.onsite-target-compact { flex:0 1 360px; padding:8px 10px; min-height:44px; border-radius:10px; }
.onsite-code-form-compact { flex:1 1 460px; display:grid; grid-template-columns:minmax(185px,230px) minmax(180px,1fr); gap:18px; align-items:end; margin-top:0; }
.onsite-compact-row .onsite-code-form-compact { width:100%; }
.onsite-code-label { display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center; white-space:nowrap; }
.onsite-code-input { height:44px; padding:7px 10px; font-size:24px; letter-spacing:.22em; border-radius:10px; }
.onsite-code-form-compact .button { min-height:44px; padding:8px 14px; border-radius:10px; }
.onsite-status { margin:8px 0 0; padding:8px 10px; }

.seat-status-card { padding-top:10px; padding-bottom:10px; }
.seat-status-bar { display:flex; align-items:center; gap:14px; min-height:40px; }
.seat-stats-compact { display:flex; align-items:center; flex-wrap:wrap; gap:0; color:#536075; font-size:13px; }
.seat-stat-item { display:inline-flex; align-items:baseline; gap:4px; padding:0 10px; border-left:1px solid #dfe6f0; }
.seat-stat-item:first-child { border-left:0; padding-left:0; }
.seat-stat-item strong { color:#172033; font-size:18px; line-height:1; }
.seat-status-bar .view-toggle { margin:0 0 0 auto; flex-wrap:nowrap; }
.reservation-lock-compact { margin:8px 0 0 !important; padding:8px 10px; }
#homeMemberTab .seat-map-wrap { margin-top:10px; }

@media (max-width: 760px) {
  .offpeak-availability { align-items:flex-start; flex-direction:column; gap:2px; }
  .onsite-compact-row { flex-direction:column; align-items:stretch; }
  .onsite-target-compact { flex:auto; width:100%; }
  .onsite-code-form-compact { width:100%; grid-template-columns:minmax(135px,42%) 1fr; }
  .onsite-code-label { grid-template-columns:1fr; gap:3px; }
  .onsite-code-form-compact .button { width:100%; }
  .seat-status-bar { align-items:flex-start; flex-wrap:wrap; gap:8px 12px; }
  .seat-stats-compact { order:2; flex:1 1 100%; }
  .seat-status-bar .view-toggle { order:3; margin-left:0; width:100%; }
  .seat-status-bar .view-toggle .button { width:auto; flex:1; }
}
\n\n/* v40: Q&Aタブ + 利用方法ガイド */\n.qna-guide-card { overflow:hidden; }\n.qna-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:14px; }\n.qna-step { display:flex; gap:11px; align-items:flex-start; min-height:132px; padding:14px; border:1px solid var(--line); border-radius:16px; background:#fbfcff; }\n.qna-step-number { flex:0 0 28px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:#17233a; color:#fff; font-weight:900; font-size:13px; }\n.qna-step strong { display:block; margin:3px 0 7px; font-size:15px; }\n.qna-step p { margin:0; color:var(--muted); font-size:13px; line-height:1.65; }\n.qna-shortcuts { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }\n.faq-groups { display:grid; gap:22px; margin-top:12px; }\n.faq-group h3 { margin:0 0 10px; font-size:16px; color:#25334a; }\n.faq-item { border:1px solid var(--line); border-radius:14px; background:#fff; overflow:hidden; }\n.faq-item + .faq-item { margin-top:8px; }\n.faq-item summary { position:relative; padding:14px 42px 14px 15px; cursor:pointer; font-weight:800; list-style:none; user-select:none; }\n.faq-item summary::-webkit-details-marker { display:none; }\n.faq-item summary::after { content:"＋"; position:absolute; right:15px; top:50%; transform:translateY(-50%); color:#5a6b83; font-size:20px; line-height:1; }\n.faq-item[open] summary::after { content:"−"; }\n.faq-item[open] summary { background:#f7f9fd; border-bottom:1px solid var(--line); }\n.faq-answer { padding:14px 15px 16px; color:#46556b; line-height:1.75; font-size:14px; }\n@media (max-width:900px) { .qna-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } }\n@media (max-width:560px) { .qna-steps { grid-template-columns:1fr; } .qna-step { min-height:0; } .faq-item summary { padding-top:13px; padding-bottom:13px; } }\n

/* v41: Q&Aの見栄え改善 + プラン別利用ガイド */
.qna-guide-card { overflow: hidden; }
.plan-guide-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(280px,.9fr); gap:16px; margin-top:14px; }
.plan-guide-hero-main, .plan-guide-hero-side {
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  background:#fff;
}
.plan-guide-hero-main {
  background:linear-gradient(135deg, #f8fbff 0%, #eef4ff 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.plan-guide-kicker { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background:#e7eefb; color:#38507c; font-size:12px; font-weight:800; }
.plan-guide-hero-main h3 { margin:12px 0 8px; font-size:24px; line-height:1.3; }
.plan-guide-lead { margin:0; color:#41516a; font-size:14px; line-height:1.75; }
.plan-guide-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.plan-guide-chip { display:inline-flex; align-items:center; min-height:32px; padding:7px 11px; border-radius:999px; background:#fff; border:1px solid #d8e2f2; color:#233652; font-size:13px; font-weight:700; }
.plan-guide-hero-side h4 { margin:0 0 12px; font-size:16px; }
.plan-guide-summary-list { display:grid; gap:10px; }
.plan-guide-summary-item { display:grid; gap:4px; padding:11px 12px; border-radius:14px; background:#f8fbff; border:1px solid #e3ebf7; }
.plan-guide-summary-item span { color:#68788d; font-size:12px; font-weight:700; }
.plan-guide-summary-item strong { font-size:15px; line-height:1.5; }
.qna-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:16px; }
.qna-step { display:flex; gap:14px; align-items:flex-start; min-height:0; padding:16px; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 6px 16px rgba(22,32,51,.04); }
.qna-step-number { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#17233a; color:#fff; font-weight:900; font-size:14px; }
.qna-step-body { display:grid; gap:6px; }
.qna-step-label { color:#6a7a90; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.qna-step strong { display:block; margin:0; font-size:16px; }
.qna-step p { margin:0; color:var(--muted); font-size:14px; line-height:1.72; }
.qna-step-note { margin-top:2px; color:#233652; font-size:12px; font-weight:700; }
.plan-guide-tips { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px; }
.plan-tip-card { padding:14px 15px; border:1px solid #dce6f5; border-radius:16px; background:#fbfcff; }
.plan-tip-card strong { display:block; margin-bottom:6px; font-size:14px; }
.plan-tip-card p { margin:0; color:#55657a; font-size:13px; line-height:1.7; }
.faq-plan-notice { margin-top:12px; padding:12px 14px; border-radius:14px; background:#f8fbff; border:1px solid #dce6f5; color:#355076; font-size:13px; }
@media (max-width: 900px) {
  .plan-guide-hero { grid-template-columns:1fr; }
  .plan-guide-tips { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .qna-steps { grid-template-columns:1fr; }
  .plan-guide-hero-main h3 { font-size:20px; }
  .qna-step { padding:14px; }
}


/* v42: ACT 新SVG座席マップ（ACTのみ試験導入） */
.seat-map.modern-svg-map {
  min-width: calc(980px * var(--seat-map-display-scale, 1));
  border: 1px solid #dbe3ef;
  background-color: #fff;
  background-origin: border-box;
  box-shadow: inset 0 0 0 1px rgba(23,32,51,.02);
}
.seat.modern-map-seat {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 2px;
  border: 1px solid rgba(17,70,96,.28);
  border-radius: 5px;
  background: rgba(74,184,226,.88) !important;
  color: #fff;
  box-shadow: 0 2px 6px rgba(19,65,86,.12);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1px;
  overflow: hidden;
  text-align: center;
  transition: filter .12s ease, box-shadow .12s ease, transform .12s ease;
}
.seat.modern-map-seat .seat-code {
  display: block;
  font-size: clamp(10px, 1.18vw, 17px);
  font-weight: 900;
  line-height: 1;
  color: inherit;
}
.seat.modern-map-seat .seat-status.seat-desk-label {
  display: block;
  margin: 1px 0 0;
  font-size: clamp(6px, .58vw, 9px);
  font-weight: 800;
  line-height: 1;
  color: rgba(255,255,255,.96);
  white-space: nowrap;
}
.seat.modern-map-seat.available:not(:disabled):hover {
  transform: scale(1.045);
  filter: brightness(1.04);
  box-shadow: 0 0 0 3px rgba(23,119,255,.22), 0 5px 12px rgba(23,32,51,.18);
  z-index: 4;
}
.seat.modern-map-seat.kind-standing.available {
  background: rgba(103,190,86,.90) !important;
  border-color: rgba(45,120,48,.40);
}
.seat.modern-map-seat.female-seat.available,
.seat.modern-map-seat.female-restricted.available {
  background: rgba(235,145,80,.91) !important;
  border-color: rgba(160,83,29,.42);
}
.seat.modern-map-seat.assigned-seat.available,
.seat.modern-map-seat.assigned-restricted.available,
.seat.modern-map-seat.assigned-plan-restricted.available {
  background: rgba(190,91,188,.90) !important;
  border-color: rgba(113,47,119,.42);
}
.seat.modern-map-seat.reserved {
  background: rgba(232,177,48,.94) !important;
  border-color: #a97808;
  color: #fff;
}
.seat.modern-map-seat.checked_in {
  background: rgba(215,76,76,.94) !important;
  border-color: #9f2e2e;
  color: #fff;
}
.seat.modern-map-seat.own {
  box-shadow: 0 0 0 3px #17233a, 0 0 0 6px rgba(23,32,51,.16);
  z-index: 5;
}
.seat.modern-map-seat:disabled {
  cursor: not-allowed;
}
.seat.modern-map-seat.plan-restricted,
.seat.modern-map-seat.lite-capacity-restricted,
.seat.modern-map-seat.overflow-unavailable,
.seat.modern-map-seat.assigned-restricted,
.seat.modern-map-seat.assigned-plan-restricted,
.seat.modern-map-seat.female-restricted {
  opacity: .46;
}
.seat-map-modern-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  margin: 10px 2px 0;
  color: #526176;
  font-size: 12px;
  font-weight: 700;
}
.seat-map-modern-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.legend-swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  border: 1px solid rgba(23,32,51,.16);
  display: inline-block;
}
.legend-swatch.free { background: rgba(74,184,226,.88); }
.legend-swatch.standing { background: rgba(103,190,86,.90); }
.legend-swatch.female { background: rgba(235,145,80,.91); }
.legend-swatch.assigned { background: rgba(190,91,188,.90); }
.legend-swatch.reserved { background: rgba(232,177,48,.94); }
.legend-swatch.occupied { background: rgba(215,76,76,.94); }
@media (max-width:760px) {
  .seat-map.modern-svg-map { min-width: calc(920px * var(--seat-map-display-scale, 1)); }
  .seat-map-modern-legend { font-size: 11px; gap: 7px 11px; }
}


/* v44: 3店舗SVGマップ - SVG本来の縦横比をそのまま使用 */
.seat-map-background {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 0;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}


/* v46: SVG座席オーバーレイ座標を新レイアウトへ再調整。背景SVGは元の縦横比のまま表示する。 */


/* v47: 店舗別表示微調整（予備席位置 / ACTⅡ斜め席 / 江戸川橋縮小） */
.seat-map-visual-layer {
  position: relative;
  width: 100%;
  transform: scale(var(--map-scale, 1));
  transform-origin: center center;
}
.seat-position.rotated-seat-position {
  transform: rotate(var(--seat-rotation, 0deg));
  transform-origin: center center;
}
.seat-position.rotated-seat-position .seat-map-label-stack {
  transform: rotate(var(--seat-counter-rotation, 0deg));
  transform-origin: center center;
}
.seat-map-label-stack {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  width:100%;
  line-height:1;
}
.seat-map-label-stack .seat-code,
.seat-map-label-stack .seat-desk-label {
  display:block;
  width:100%;
  margin:0;
  text-align:center;
  white-space:nowrap;
}

/* v49: ACT左上席/予備席・江戸川橋の残り座標を実画面に合わせて微調整 */


/* v50: ACTはユーザー確認済みの基準画像比率で固定し、背景と座席レイヤーを同一座標系にする */
.seat-map-visual-layer.fixed-canvas-aspect {
  position: relative;
  width: 100%;
}
.seat-map-visual-layer.fixed-canvas-aspect > .seat-map-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
}


/* v51: ACT II - 色は机の天板だけに載せる */
.seat-map.desk-surface-map .seat.modern-map-seat {
  border-radius: 0;
  box-shadow: none;
  padding: 1px;
}
.seat-map.desk-surface-map .seat.modern-map-seat.available:not(:disabled):hover {
  transform: none;
  filter: brightness(1.04);
  box-shadow: inset 0 0 0 2px rgba(23,119,255,.34);
}
.seat-map.desk-surface-map .seat.modern-map-seat.own {
  box-shadow: inset 0 0 0 3px #17233a;
}


/* v53: ACTも机の天板だけに色を載せる。v51のACT II調整は維持。 */

/* v53: ACT座席オーバーレイを実画面に再整列。16番は90cm幅に補正。 */


/* v69: v55座席マップCSSを維持しつつ、v68の会員画面追加スタイルを保持 */
.reservation-important-notice { margin-bottom:10px; padding:10px 13px; border-radius:14px; background:#fff8e8; border-color:#efd59d; color:#5b4313; box-shadow:none; }
.reservation-important-notice-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:3px; }
.reservation-important-notice-label { font-size:13px; font-weight:900; }
.reservation-important-notice-time { color:#866b35; font-size:11px; }
.reservation-important-notice-title { display:block; font-size:14px; }
.reservation-important-notice-body p { margin:3px 0 0; line-height:1.55; font-size:13px; }
.qna-simple-guide { margin-top:14px; padding:14px 16px; border:1px solid #dfe7f3; border-radius:18px; background:#fbfcff; }
.qna-simple-guide-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.qna-simple-guide-head > strong { font-size:16px; }
.qna-simple-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:12px; }
.qna-simple-step { display:flex; align-items:center; gap:8px; min-height:50px; padding:9px 10px; border-radius:13px; background:#fff; border:1px solid #e3eaf4; }
.qna-simple-step span { flex:0 0 25px; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:#17233a; color:#fff; font-size:12px; font-weight:900; }
.qna-simple-step strong { font-size:12px; line-height:1.5; }
.qna-simple-guide > p { margin:10px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
.qna-detail-heading { display:flex; align-items:baseline; gap:10px; margin:20px 2px 0; }
.qna-detail-heading strong { font-size:17px; }
.qna-detail-heading span { color:var(--muted); font-size:13px; }
.account-edit-divider { height:1px; background:var(--line); margin:18px 0; }
.account-edit-title { margin:0 0 10px; font-size:17px; }
.account-profile-form { margin-top:0; }
.account-profile-note { color:var(--muted); font-size:12px; line-height:1.6; }
#accountProfileUpdateMessage .notice, #accountProfileUpdateMessage .error { margin-top:12px; }
@media (max-width:760px) {
  .qna-simple-flow { grid-template-columns:1fr; }
  .qna-detail-heading { align-items:flex-start; flex-direction:column; gap:2px; }
}


/* v71: 公式HPトーンに合わせたマイページUIテーマ
   座席マップ固有CSSは変更せず、全体UIのみを上書きする。 */
:root {
  color: #132019;
  background: #f3f7f2;
  --text: #132019;
  --muted: #68776f;
  --line: #d9e4da;
  --card: #ffffff;
  --primary: #2f6c53;
  --soft: #edf4ee;
  --green: #2f6c53;
  --yellow: #876c19;
  --red: #ad3c36;
}
body {
  background:
    radial-gradient(circle at 8% 13%, rgba(111,157,126,.08) 0 115px, transparent 116px),
    radial-gradient(circle at 92% 34%, rgba(111,157,126,.06) 0 150px, transparent 151px),
    linear-gradient(180deg, #f7faf6 0%, #f1f6f0 100%);
  color: var(--text);
}
main { max-width: 1260px; padding: 22px 28px 60px; }
.header { margin-bottom: 18px; padding: 6px 2px 2px; }
h1 { color:#101b15; font-weight:900; line-height:1.08; letter-spacing:-.015em; }
h1::before {
  content:"ACT STUDY ROOM / MEMBER";
  display:block;
  margin-bottom:7px;
  color:#2f6c53;
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
}
h2 { color:#101b15; font-weight:850; letter-spacing:-.01em; }
h3, h4 { color:#15221b; }
.subtitle { color:#6c7a72; }

.card, .notice-bar {
  background:rgba(255,255,255,.96);
  border:1px solid #d9e4da;
  border-radius:18px;
  box-shadow:0 8px 26px rgba(31,65,47,.055);
}
.card { padding:20px; }
.notice-bar { box-shadow:none; }

.header-actions { gap:8px; }
.login-identity {
  border:1px solid #d7e2d8;
  border-radius:999px;
  box-shadow:none;
  background:#fff;
  padding:9px 12px;
}
.login-identity-label { color:#6d7b73; }

.member-nav.card {
  padding:8px;
  gap:7px;
  border-radius:16px;
  background:rgba(248,250,247,.94);
  border-color:#dce6dd;
  box-shadow:none;
}
.member-nav .button {
  min-height:40px;
  min-width:120px;
  border-radius:999px;
  padding:9px 16px;
  background:#2f6c53;
  color:#fff;
  border:1px solid #2f6c53;
  box-shadow:none;
  transition:background .16s ease, border-color .16s ease, transform .16s ease;
}
.member-nav .button:not(.secondary):hover { background:#255b45; border-color:#255b45; transform:translateY(-1px); }
.member-nav .button.secondary {
  background:#ffffff;
  color:#26382f;
  border:1px solid #cbd9cf;
}
.member-nav .button.secondary:hover {
  background:#eaf2ec;
  border-color:#9fb8a7;
}

.button {
  background:#2f6c53;
  border-radius:999px;
  box-shadow:none;
}
.button:hover:not(:disabled) { background:#275d47; }
.button.secondary { background:#edf2ed; color:#27372f; }
.button.secondary:hover:not(:disabled) { background:#e2ebe4; }
.button.danger { background:#a93d38; }
.button.danger:hover:not(:disabled) { background:#92342f; }
.button.compact { border-radius:999px; }

.input, .select {
  border:1px solid #cedace;
  border-radius:12px;
  background:#fff;
}
.input:focus, .select:focus {
  border-color:#6e9b80;
  box-shadow:0 0 0 4px rgba(74,124,92,.12);
}

.status-pill { border-radius:999px; }
.status-pill.neutral { background:#eff3ef; color:#526159; }
.status-pill.available { background:#e6f3e9; color:#2f6c53; }
.status-pill.reserved { background:#f7f0d7; color:#80661a; }
.status-pill.checked_in { background:#f7e7e5; color:#a33a35; }

.summary-list { margin-top:16px; }
.summary-list > div { border-bottom-color:#e7eee8; }
.summary-list span { color:#748078; }
.summary-list strong { color:#17231c; }

.section-head { align-items:center; }
.section-head .subtitle { margin-top:4px; }

/* ホーム操作エリア */
.operational-compact-card { border-radius:16px; }
.onsite-reception-card { border:1px solid #d6e2d7; background:#fff; }
.onsite-code-input { background:#fbfdfb; border-color:#cbd9cd; }
.onsite-status.alert-state { background:#fff0ee; border-color:#edc2bd; color:#9b332f; }
.onsite-status.success-state { background:#e9f5ec; border-color:#c3dfca; color:#2c694a; }
.offpeak-availability.available { background:#eaf5ec; border-color:#c2dfc8; color:#2e6b4d; }
.offpeak-availability.allowance { background:#f8f2dc; border-color:#e5d79c; color:#725b18; }
.offpeak-availability.unavailable { background:#fff0ee; border-color:#efc4c0; color:#9c3530; }

/* Q&A / 利用ガイド */
.qna-guide-card { background:#fff; }
.qna-simple-guide {
  background:#f0f5f0;
  border-color:#d7e3d8;
  border-radius:16px;
}
.plan-guide-kicker {
  background:#e7f0e9;
  color:#2f6c53;
  letter-spacing:.04em;
}
.qna-simple-step {
  background:#fff;
  border-color:#dce7dd;
  border-radius:12px;
}
.qna-simple-step span,
.qna-step-number { background:#1f5942; }
.qna-detail-heading strong { color:#17231c; }
.plan-guide-hero-main, .plan-guide-hero-side { border-color:#d8e4da; border-radius:16px; }
.plan-guide-hero-main {
  background:linear-gradient(135deg, #f5f8f4 0%, #eaf2eb 100%);
  box-shadow:none;
}
.plan-guide-lead { color:#53645b; }
.plan-guide-chip { border-color:#d3e0d5; color:#294c3b; }
.plan-guide-summary-item { background:#f6f9f6; border-color:#dfe8e0; }
.plan-guide-summary-item span { color:#6a7a71; }
.qna-step { border-color:#dce6dd; border-radius:16px; box-shadow:none; }
.qna-step-label { color:#62806f; }
.qna-step-note { color:#315a46; }
.plan-tip-card { border-color:#dbe6dc; background:#f7faf7; }
.plan-tip-card p { color:#5e6e65; }
.faq-group h3 { color:#274436; }
.faq-item { border-color:#dce5dd; border-radius:12px; }
.faq-item[open] summary { background:#f1f6f2; border-bottom-color:#dce5dd; }
.faq-item summary::after { color:#3d6b54; }
.faq-answer { color:#56665d; }
.faq-plan-notice { background:#eff5f0; border-color:#d7e3d9; color:#315f48; }

/* お知らせ */
.reservation-important-notice {
  background:#f3f6ee;
  border-color:#dde6cf;
  color:#455b36;
}
.reservation-important-notice-label { color:#2f6c53; letter-spacing:.03em; }
.reservation-important-notice-time { color:#78836f; }
.notice-item, .request-item { border-color:#dde6df; background:#fbfdfb; }

/* 契約・アカウント */
.account-edit-divider { background:#dfe8e0; }
.account-edit-title { color:#20392d; }
.account-profile-note { color:#6d7b72; }
.card-update-panel { border-color:#dbe5dc; background:#f8faf8; }
.member-square-card { border-color:#d4dfd6; }
.card-update-consent { background:#edf4ee; }

/* 座席マップ外枠のみ公式HPトーンへ。座席位置・色レイヤーは変更しない。 */
.seat-map-card { border-color:#d9e4da; box-shadow:none; background:#fff; }
.seat-map-modern-legend { color:#5f6e66; }
.seat-status-card { background:#fff; }

@media (max-width:760px) {
  main { padding:14px 12px 42px; }
  .member-nav.card { border-radius:14px; }
  .member-nav .button { min-width:106px; }
  h1::before { font-size:9px; }
}

/* v75: 一覧表示に机幅・特殊席情報を表示 */
.seat-list-meta { display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin-top:8px; margin-bottom:2px; }
.seat-list-width { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:999px; background:#f4f6f2; border:1px solid #d9e3db; color:#405348; font-size:12px; font-weight:800; line-height:1; }
.seat-list-badge { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:900; line-height:1; white-space:nowrap; }
.seat-list-badge.standing { background:#eaf7ec; border:1px solid #b9dfbf; color:#276d38; }
.seat-list-badge.female { background:#fff1e7; border:1px solid #f3c8a7; color:#a45220; }
.seat:not(.modern-map-seat) .seat-status { margin-top:6px; }
@media (max-width:760px) {
  .seat-list-meta { gap:4px; }
  .seat-list-width, .seat-list-badge { padding:3px 6px; font-size:10px; }
}

/* v76: 契約・決済情報は初期状態で閉じる */
.contract-disclosure-grid { align-items:start; }
.contract-disclosure { padding:0; overflow:hidden; }
.contract-disclosure > summary { list-style:none; }
.contract-disclosure > summary::-webkit-details-marker { display:none; }
.contract-disclosure-summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:92px;
  padding:20px 22px;
  cursor:pointer;
  user-select:none;
}
.contract-disclosure-summary:hover { background:#f6faf6; }
.contract-disclosure-summary h2 { margin:0 0 4px; }
.contract-disclosure-summary .subtitle { margin:0; font-size:13px; }
.contract-disclosure-toggle {
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid #d6e1d8;
  background:#f2f6f2;
  position:relative;
}
.contract-disclosure-toggle::before,
.contract-disclosure-toggle::after {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:2px;
  border-radius:999px;
  background:#2f6c53;
  transform:translate(-50%,-50%);
}
.contract-disclosure-toggle::after { transform:translate(-50%,-50%) rotate(90deg); transition:transform .16s ease, opacity .16s ease; }
.contract-disclosure[open] .contract-disclosure-toggle::after { opacity:0; transform:translate(-50%,-50%) rotate(90deg) scaleX(0); }
.contract-disclosure[open] .contract-disclosure-summary { border-bottom:1px solid #e3ebe4; background:#fbfdfb; }
.contract-disclosure-body { padding:4px 22px 22px; }
.payment-privacy-note { margin-top:14px; }
@media (max-width:760px) {
  .contract-disclosure-summary { min-height:78px; padding:16px; }
  .contract-disclosure-body { padding:2px 16px 18px; }
  .contract-disclosure-toggle { flex-basis:30px; width:30px; height:30px; }
}

/* v77: マナー評価ランクと現在の特典 */
.manner-tier-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:12px;
  font-weight:900;
  letter-spacing:.03em;
  white-space:nowrap;
}
.manner-tier-badge.manner-MEMBER { background:#e9f5ec; border-color:#bfdec7; color:#2f7048; }
.manner-tier-badge.manner-GOOD { background:#eaf2fb; border-color:#bfd3ea; color:#2d5f92; }
.manner-tier-badge.manner-TRUST { background:#fbf3d8; border-color:#e8d391; color:#7b5c09; }
.manner-benefit-panel {
  margin:16px 0 14px;
  padding:16px;
  border:1px solid #d9e4da;
  border-radius:16px;
  background:#f8fbf8;
}
.manner-benefit-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.manner-benefit-head h3 { margin:2px 0 0; font-size:17px; }
.manner-benefit-kicker { color:#44715c; font-size:10px; font-weight:900; letter-spacing:.14em; }
.manner-benefit-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.manner-benefit-item { padding:12px 13px; border:1px solid #dfe8e0; border-radius:13px; background:#fff; }
.manner-benefit-item strong { display:block; margin-bottom:4px; font-size:13px; color:#20392d; }
.manner-benefit-item span { display:block; color:#5f6e66; font-size:12px; line-height:1.6; }
.manner-benefit-note { margin:10px 0 0; color:#728078; font-size:11px; }
@media (max-width:760px) {
  .manner-benefit-list { grid-template-columns:1fr; }
  .manner-benefit-head { align-items:flex-start; }
}
.manner-benefit-subtitle {
  margin:6px 0 0;
  color:#698074;
  font-size:12px;
  line-height:1.5;
}
.manner-rank-progress-card {
  margin:0 0 14px;
  padding:14px;
  border:1px solid #dbe5de;
  border-radius:16px;
  background:#ffffff;
}
.manner-rank-pill-row {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}
.manner-rank-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 12px;
  border:1px solid #cddad0;
  border-radius:999px;
  background:#f7faf7;
  color:#5c6c64;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  white-space:nowrap;
}
.manner-rank-pill.is-passed {
  background:#eef6f0;
  border-color:#c7dbc9;
  color:#3c6f52;
}
.manner-rank-pill.is-current {
  background:#2f6f53;
  border-color:#2f6f53;
  color:#fff;
  box-shadow:0 6px 14px rgba(47,111,83,.16);
}
.manner-rank-meter {
  position:relative;
  height:14px;
  border-radius:999px;
  overflow:hidden;
  background:
    repeating-linear-gradient(
      to right,
      rgba(255,255,255,.58) 0,
      rgba(255,255,255,.58) 12px,
      rgba(255,255,255,.08) 12px,
      rgba(255,255,255,.08) 16px
    ),
    linear-gradient(
      to right,
      #e9f5ec 0%,
      #e9f5ec 50%,
      #eaf2fb 50%,
      #eaf2fb 80%,
      #fbf3d8 80%,
      #fbf3d8 100%
    );
  border:1px solid #d8e2da;
}
.manner-rank-meter::before,
.manner-rank-meter::after {
  content:"";
  position:absolute;
  top:-1px;
  bottom:-1px;
  width:2px;
  background:rgba(54,77,64,.52);
  z-index:3;
}
.manner-rank-meter::before { left:50%; }
.manner-rank-meter::after { left:80%; }
.manner-rank-meter-fill {
  position:absolute;
  inset:0 auto 0 0;
  width:0%;
  z-index:2;
  border-radius:999px;
  background:linear-gradient(90deg,#2d6d51 0%, #3f8462 52%, #74b98a 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.manner-rank-threshold-labels {
  position:relative;
  height:18px;
  margin-top:4px;
}
.manner-threshold-label {
  position:absolute;
  top:0;
  transform:translateX(-50%);
  color:#65776d;
  font-size:10px;
  font-weight:900;
  letter-spacing:.03em;
  white-space:nowrap;
}
.manner-threshold-good { left:50%; }
.manner-threshold-trust { left:80%; }
.manner-rank-progress-foot {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin-top:10px;
}
.manner-rank-progress-label {
  color:#6c7d73;
  font-size:12px;
}
.manner-rank-progress-text {
  color:#214132;
  font-size:14px;
}
@media (max-width:760px) {
  .manner-rank-progress-card { padding:12px; }
  .manner-rank-pill-row { gap:8px; }
  .manner-rank-pill { min-height:32px; padding:6px 10px; font-size:11px; }
  .manner-rank-progress-foot { flex-direction:column; align-items:flex-start; gap:4px; }
}

@media (max-width:760px) {
  .manner-threshold-label { font-size:9px; }
}

/* v79: 公式HPデザイン統一（マイページ全体） */
:root {
  --act-green:#1f5d43;
  --act-green-2:#2f7355;
  --act-green-soft:#e9f1eb;
  --act-cream:#f6f6ef;
  --act-ink:#132019;
  --act-border:#d7e1d8;
}
body {
  background:#f6f6ef;
}
main { max-width:1280px; padding-top:18px; }
.header {
  position:relative;
  padding:22px 24px;
  margin-bottom:14px;
  border-radius:22px;
  background:linear-gradient(135deg,#173f30 0%,#245f46 68%,#2f7254 100%);
  color:#fff;
  overflow:hidden;
}
.header::after {
  content:"";
  position:absolute;
  width:250px;
  height:250px;
  right:-110px;
  top:-145px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  box-shadow:0 0 0 38px rgba(255,255,255,.025),0 0 0 76px rgba(255,255,255,.018);
  pointer-events:none;
}
.header > * { position:relative; z-index:1; }
.header h1 { color:#fff; font-size:clamp(27px,3.4vw,38px); }
.header h1::before { color:#cfe2d5; letter-spacing:.2em; }
.header .subtitle { color:#dce9e0; }
.header-actions { align-items:center; }
.login-identity {
  background:rgba(255,255,255,.11);
  border-color:rgba(255,255,255,.2);
  color:#fff;
  backdrop-filter:blur(6px);
}
.login-identity-label,.login-display-name { color:#dce9e0; }
.header-actions > .button.secondary {
  background:#fff;
  color:#214f3b;
  border:1px solid rgba(255,255,255,.45);
}
.role-shortcuts { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.role-switch-link {
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:7px 12px;
  border-radius:999px;
  text-decoration:none;
  font-size:12px;
  font-weight:850;
  background:rgba(255,255,255,.12);
  color:#fff;
  border:1px solid rgba(255,255,255,.25);
}
.role-switch-link:hover { background:rgba(255,255,255,.2); }
.member-nav.card {
  top:8px;
  background:#fff;
  border:1px solid var(--act-border);
  border-radius:18px;
  padding:8px;
  box-shadow:0 6px 20px rgba(31,70,50,.05);
}
.member-nav .button {
  background:var(--act-green);
  border-color:var(--act-green);
  color:#fff;
  font-weight:850;
}
.member-nav .button.secondary {
  background:#fff;
  color:#425148;
  border-color:#d3ddd5;
}
.member-nav .button.secondary:hover { background:#eff4ef; color:#234c39; }
.card,.notice-bar {
  border:1px solid var(--act-border);
  border-radius:20px;
  box-shadow:0 5px 18px rgba(35,69,50,.045);
}
.card { padding:22px; }
.card > h2:first-child,
.section-head h2 { position:relative; }
.card > h2:first-child::after,
.section-head h2::after {
  content:"";
  display:block;
  width:34px;
  height:3px;
  margin-top:7px;
  border-radius:999px;
  background:#6c9b7e;
}
.section-head.compact-head h2::after { margin-top:5px; }
.button { background:var(--act-green); }
.button:hover:not(:disabled) { background:#184b36; }
.button.secondary { background:#edf2ed; color:#2b4236; }
.button.secondary:hover:not(:disabled) { background:#e2ebe4; }
.input,.select { border-color:#ccd8ce; background:#fff; }
.input:focus,.select:focus { border-color:#67957a; box-shadow:0 0 0 4px rgba(65,118,82,.11); }
.summary-list > div { padding:11px 0; }
.summary-list strong { font-weight:800; }
.notice { background:#edf4ee; border-color:#d2e2d5; color:#315c45; }
.error { background:#fff0ef; border-color:#efc9c6; color:#963732; }
.reservation-important-notice { background:#f3f4e8; border-color:#dfe2bd; }
.contract-disclosure { background:#fff; }
.contract-disclosure-summary { min-height:88px; }
.contract-disclosure-summary:hover { background:#f3f7f3; }
.qna-simple-guide,.plan-guide-hero-main,.plan-guide-summary-item,.plan-tip-card { background:#f4f7f3; }
.faq-item[open] summary { background:#edf3ee; }
.request-item,.notice-item { background:#fcfdfb; }
.danger-zone { border-color:#e8c9c6; }
/* 座席レイアウト内部の座標・色レイヤーは変更しない */
.seat-map-card { border-radius:20px; }
@media (max-width:760px) {
  main { padding:10px 10px 38px; }
  .header { padding:18px 16px; border-radius:18px; align-items:stretch; }
  .header-actions { align-items:flex-start; }
  .login-identity { border-radius:15px; white-space:normal; }
  .role-shortcuts { width:100%; }
  .role-switch-link { flex:1 1 auto; justify-content:center; }
  .member-nav.card { top:0; border-radius:14px; }
  .card { padding:17px; border-radius:17px; }
}


/* v102: mobile onsite reception whitespace fix */
@media (max-width: 768px) {
  #onsiteReceptionCard {
    display:block !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    padding:17px !important;
    margin-bottom:10px !important;
    align-self:start !important;
    overflow:visible !important;
  }
  #onsiteReceptionCard .onsite-compact-row {
    display:block !important;
    min-height:0 !important;
    height:auto !important;
  }
  #onsiteReceptionCard #onsiteReceptionForm { margin:0 !important; }
  #onsiteReceptionCard #onsiteReceptionStatus:not(.hidden) { margin-top:10px !important; }
}


/* v103: mobile onsite reception flex-basis height bug fix */
@media (max-width: 768px) {
  #onsiteReceptionCard .onsite-compact-row {
    display:block !important;
    height:auto !important;
    min-height:0 !important;
  }
  #onsiteReceptionCard #onsiteReceptionForm,
  #onsiteReceptionCard .onsite-code-form-compact {
    flex:none !important;
    flex-grow:0 !important;
    flex-shrink:0 !important;
    flex-basis:auto !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
  }
  #onsiteReceptionCard .onsite-code-label {
    height:auto !important;
    min-height:0 !important;
  }
  #onsiteReceptionCard {
    height:auto !important;
    min-height:0 !important;
  }
}

/* v109: v105の店舗別座席表表示倍率を、v107マナー表示と共存させて復元。
   ACT=1.00 / ACTⅡ=0.70 / 江戸川橋=0.59 */

/* v111: Q&A plan-aware simple usage + FAQ filtering */
.qna-basic-mode { margin-top:14px; padding:12px; border:1px solid #d8e4da; border-radius:14px; background:#f9fbf9; }
.qna-basic-mode + .qna-basic-mode { margin-top:10px; }
.qna-basic-mode-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:2px; }
.qna-basic-mode-head > strong { font-size:13px; color:#263b30; }
.qna-basic-mode-label { display:inline-flex; align-items:center; justify-content:center; min-width:76px; min-height:28px; padding:5px 12px; border-radius:999px; background:#e7f0e9; color:#2f6c53; font-size:12px; font-weight:900; }
.qna-basic-mode-label.reservation { background:#eaf2fb; color:#2d5f92; }
.qna-basic-mode .qna-simple-flow { margin-top:10px; }
.faq-item.hidden, .faq-group.hidden { display:none !important; }
@media (max-width:760px) {
  .qna-basic-mode { padding:10px; }
  .qna-basic-mode-label { min-width:70px; }
}


/* v121: responsive Edogawabashi seat-map sizing */
@media (min-width:761px) and (max-width:1199px) {
  .seat-map.modern-svg-map {
    width: var(--seat-map-tablet-width, auto);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-width:1200px) {
  .seat-map.modern-svg-map {
    width: var(--seat-map-desktop-width, auto);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}


/* v129: login recovery */
.login-recovery-toggle {
  margin-top: 14px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--primary);
  font: inherit;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}
.login-recovery-panel {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
}
.login-recovery-intro p,
.login-recovery-box p { margin: 6px 0 0; color: var(--muted); line-height: 1.65; }
.login-recovery-box {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfcfb;
}
.login-recovery-box h3 { margin: 0; font-size: 17px; }
.login-recovery-box .compact-stack { margin-top: 12px; gap: 10px; }
.login-recovery-box .button.secondary { width: fit-content; }
.login-recovery-note { background: #f4f8f5; }
.login-identity-recovery-form { margin-top: 12px; }
@media (max-width: 760px) {
  .login-recovery-box { padding: 13px; }
  .login-recovery-box .button.secondary { width: 100%; }
  .login-identity-recovery-form { grid-template-columns: 1fr; }
}


/* v131: public ACT homepage link on logged-out screen */
.login-help-links {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.login-help-links .login-recovery-toggle { margin-top: 0; }
.login-public-home-link {
  color: var(--primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.login-public-home-link:hover { opacity: .78; }
@media (max-width:760px) {
  .login-help-links { gap: 10px 16px; }
  .login-public-home-link { width: 100%; }
}


/* v135: 無料体験の自動割当席表示 */
.seat{position:relative;}
.trial-seat-hold-badge{position:absolute;right:2px;top:2px;z-index:8;display:inline-flex;align-items:center;justify-content:center;min-width:28px;padding:2px 4px;border-radius:999px;font-size:8px;line-height:1.1;font-weight:900;white-space:nowrap;color:#725300;background:#fff3bd;border:1px solid rgba(190,137,0,.45);pointer-events:none;}
.trial-seat-hold-badge.blocked{color:#fff;background:#d99b00;border-color:#b67e00;}
.seat.trial-hold-upcoming{box-shadow:inset 0 0 0 2px rgba(217,155,0,.36);}


/* v142: マイページFAQを公式HP風のカテゴリ切替デザインへ */
.faq-category-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:20px 0 18px;
}
.faq-category-button{
  appearance:none;
  border:1px solid #d8e2da;
  background:#fff;
  color:#26382f;
  border-radius:999px;
  min-height:42px;
  padding:10px 18px;
  font:inherit;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.faq-category-button:hover{
  background:#f4f8f4;
  border-color:#bfcfc2;
  transform:translateY(-1px);
}
.faq-category-button.active{
  background:#1f644d;
  border-color:#1f644d;
  color:#fff;
}

.homepage-faq-style{
  display:block;
  margin-top:0;
}
.homepage-faq-style .faq-group{
  display:none;
  padding:10px 28px 8px;
  border:1px solid #d8e2da;
  border-radius:24px;
  background:#fff;
  overflow:hidden;
}
.homepage-faq-style .faq-group.faq-category-active{
  display:block;
}
.homepage-faq-style .faq-group > h3{
  margin:4px 0 8px;
  padding:10px 2px 14px;
  text-align:right;
  font-size:25px;
  line-height:1.2;
  color:#1f2b25;
}
.homepage-faq-style .faq-item{
  margin:0 !important;
  border:0;
  border-radius:0;
  border-top:1px solid #dce5dd;
  background:transparent;
  overflow:visible;
}
.homepage-faq-style .faq-item:first-of-type{
  border-top:0;
}
.homepage-faq-style .faq-item summary{
  min-height:66px;
  display:flex;
  align-items:center;
  padding:18px 48px 18px 2px;
  font-size:15px;
  line-height:1.55;
  background:transparent !important;
  border:0 !important;
}
.homepage-faq-style .faq-item summary::after{
  content:"+";
  right:2px;
  color:#2b6b52;
  font-size:26px;
  font-weight:300;
}
.homepage-faq-style .faq-item[open] summary::after{
  content:"−";
}
.homepage-faq-style .faq-item[open] summary{
  color:#1f644d;
}
.homepage-faq-style .faq-answer{
  padding:0 44px 20px 2px;
  color:#56665d;
  font-size:14px;
  line-height:1.9;
}

@media(max-width:640px){
  .faq-category-tabs{
    gap:8px;
    margin-top:16px;
  }
  .faq-category-button{
    min-height:38px;
    padding:8px 13px;
    font-size:12px;
  }
  .homepage-faq-style .faq-group{
    padding:8px 18px 6px;
    border-radius:18px;
  }
  .homepage-faq-style .faq-group > h3{
    text-align:left;
    font-size:20px;
    padding-bottom:10px;
  }
  .homepage-faq-style .faq-item summary{
    min-height:58px;
    padding:15px 40px 15px 0;
    font-size:14px;
  }
  .homepage-faq-style .faq-answer{
    padding:0 32px 16px 0;
  }
}


/* v143: FAQパネル内の重複カテゴリ見出しを非表示 */
.homepage-faq-style .faq-group > .faq-group-heading{
  display:none;
}
.homepage-faq-style .faq-group{
  padding-top:8px;
}

/* v147: 会員・受付・管理で座席表の描画基準を共通化 */
.unified-seat-map.modern-svg-map {
  width:min(100%, var(--seat-map-desktop-width, 1068px));
  min-width:calc(980px * var(--seat-map-display-scale, 1));
  margin-left:auto;
  margin-right:auto;
  border:1px solid #dbe3ef;
  border-radius:8px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(23,32,51,.02);
}
.unified-seat-map-visual-layer {
  position:relative;
  width:100%;
  transform:scale(var(--map-scale,1));
  transform-origin:center center;
}
.unified-seat-position { position:absolute; z-index:2; }
.unified-seat-position.rotated-seat-position {
  transform:rotate(var(--seat-rotation,0deg));
  transform-origin:center center;
}
.unified-map-seat.modern-map-seat {
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  padding:2px;
  border:1px solid rgba(17,70,96,.28);
  border-radius:5px;
  background:rgba(74,184,226,.88) !important;
  color:#fff;
  box-shadow:0 2px 6px rgba(19,65,86,.12);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  text-align:center;
  transition:filter .12s ease,box-shadow .12s ease,transform .12s ease;
}
.unified-map-seat.modern-map-seat.kind-standing.available { background:rgba(103,190,86,.90) !important; border-color:rgba(45,120,48,.40); }
.unified-map-seat.modern-map-seat.female-seat.available,
.unified-map-seat.modern-map-seat.female-restricted.available { background:rgba(235,145,80,.91) !important; border-color:rgba(160,83,29,.42); }
.unified-map-seat.modern-map-seat.assigned-seat.available,
.unified-map-seat.modern-map-seat.assigned-restricted.available,
.unified-map-seat.modern-map-seat.assigned-plan-restricted.available { background:rgba(190,91,188,.90) !important; border-color:rgba(113,47,119,.42); }
.unified-map-seat.modern-map-seat.reserved { background:rgba(232,177,48,.94) !important; border-color:#a97808; color:#fff; }
.unified-map-seat.modern-map-seat.checked_in { background:rgba(215,76,76,.94) !important; border-color:#9f2e2e; color:#fff; }
.desk-surface-map .unified-map-seat.modern-map-seat { border-radius:0; box-shadow:none; padding:1px; }
@media (max-width:760px) {
  .unified-seat-map.modern-svg-map { width:auto; min-width:calc(920px * var(--seat-map-display-scale,1)); }
}

/* v150: 座席オーバーレイを全画面共通で約8%拡大。中心位置は維持し、背景SVGとの見た目を補正。 */
.unified-seat-position {
  transform: scale(1.08);
  transform-origin: center center;
}
.unified-seat-position.rotated-seat-position {
  transform: rotate(var(--seat-rotation,0deg)) scale(1.08);
  transform-origin: center center;
}

/* 2026-09-15: 既存会員向けGOLD体験バッジ */
.gold-trial-badge {
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#fbf3d8;
  border:1px solid #e8d391;
  color:#7b5c09;
  font-size:13px;
  font-weight:850;
  white-space:nowrap;
}
.header .gold-trial-badge {
  background:rgba(255,231,154,.96);
  border-color:rgba(255,241,188,.95);
  color:#665000;
}
