/* RazPay 共通スタイル。ブランド色は --brand 系の変数だけ差し替えれば全体に反映される。 */
:root {
  /* RazPay reference palette（デモ: razpay-interactive-demo と同じ値） */
  --brand: #452269;
  --brand-strong: #32184f;
  --brand-soft: #f0eafa;
  --brand-ring: #b99bdf;
  --navy: #14243e;
  --accent: #1aa584;
  --bg: #f6f8fc;
  --surface: #ffffff;
  --text: #18233e;
  --text-2: #798298;
  --line: #e8ecf3;
  --line-strong: #dfe5ee;
  --ok: #209273;     --ok-bg: #eaf8f3;
  --warn: #b28222;   --warn-bg: #fff6df;
  --info: #7953ad;   --info-bg: #f0eafa;
  --danger: #d25871; --danger-bg: #fff0f2;
  --muted: #74819d;  --muted-bg: #f0f2f8;
  --radius: 11px;
  --shadow: none;
  --font: Inter, -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI", Meiryo, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font); color: var(--text); background: var(--bg); font-size: 14px; line-height: 1.7; }
a { color: var(--brand); text-decoration: none; }
.pub-main p a, .field a, .note a { text-decoration: underline; }
a:hover { color: var(--brand-strong); }
h1, h2, h3 { line-height: 1.35; margin: 0 0 .6em; }
h1 { font-size: 26px; letter-spacing: -.6px; } h2 { font-size: 16px; letter-spacing: -.2px; } h3 { font-size: 14px; }
code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; }
.muted { color: var(--text-2); }
.small { font-size: .85rem; }
.nowrap { white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 15px; min-height: 39px; border-radius: 7px; border: 1px solid var(--line-strong); background: var(--surface); color: #46506a; font: inherit; font-size: 14px; cursor: pointer; text-decoration: none; line-height: 1.4; white-space: nowrap; }
.btn:hover { background: #f1edf7; color: #46506a; }
.btn svg { width: 16px; height: 16px; }
.btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 3px solid var(--brand-ring); outline-offset: 2px; }
.btn-primary { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 3px 6px #45226918; font-weight: 600; }
.btn-primary:hover { background: var(--brand-strong); color: #fff; }
.btn-danger { background: #fff; border-color: #f3cdd4; color: #cf4358; font-weight: 600; }
.btn-danger:hover { background: var(--danger-bg); color: #b73049; }
.btn-ok { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }
.btn-ok:hover { background: var(--brand-strong); color: #fff; }
.btn-lg { padding: .8em 2em; font-size: 1.05rem; }
.btn-sm { padding: 5px 11px; min-height: 30px; font-size: 13px; }
.btn-link { background: none; border: 0; padding: 0; color: var(--brand); font: inherit; cursor: pointer; text-decoration: underline; }

/* ---------- Forms ---------- */
label { font-weight: 600; color: #4d5b73; font-size: 13px; }
input[type=text], input[type=email], input[type=tel], input[type=url], input[type=date], input[type=password], input[type=number], input[type=search], select, textarea {
  width: 100%; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 7px; background: #fff; font: inherit; color: #263654; outline: none;
}
input:focus, select:focus, textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px #45226914; }
input[type=checkbox], input[type=radio] { accent-color: var(--brand); }
textarea { min-height: 6em; resize: vertical; }
input[aria-invalid=true], select[aria-invalid=true], textarea[aria-invalid=true] { border-color: var(--danger); background: #fffafa; }
.field { margin-bottom: 1.1rem; }
.field .help { font-size: .82rem; color: var(--text-2); margin-top: .25rem; }
.field .error { font-size: .85rem; color: var(--danger); margin-top: .25rem; font-weight: 600; }
.req, .opt { display: inline-block; font-size: .72rem; font-weight: 700; padding: 0 .45em; border-radius: 4px; margin-left: .45em; vertical-align: 2px; }
.req { background: var(--danger); color: #fff; }
.opt { background: var(--muted-bg); color: var(--muted); }
.choices { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; padding-top: .2rem; }
.choices label { font-weight: 500; display: inline-flex; align-items: center; gap: .4em; cursor: pointer; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
@media (max-width: 720px) { .grid-2 { grid-template-columns: 1fr; } }

/* ---------- Alerts ---------- */
.alert { padding: .8rem 1rem; border-radius: 8px; margin-bottom: 1rem; border: 1px solid; white-space: pre-line; }
.alert-ok { background: var(--ok-bg); border-color: #b7e2c8; color: #0b5132; }
.alert-error { background: var(--danger-bg); border-color: #f5c2bd; color: #7a1a12; }
.alert-info { background: var(--info-bg); border-color: #c3d4fb; color: #173a8c; }
.alert ul { margin: .4rem 0 0; padding-left: 1.2rem; }

/* ---------- Badges ---------- */
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 5px; font-size: 12px; font-weight: 600; white-space: nowrap; line-height: 1.3; }
.badge-info { background: var(--info-bg); color: var(--info); }
.badge-warn { background: var(--warn-bg); color: var(--warn); }
.badge-ok { background: var(--ok-bg); color: var(--ok); }
.badge-danger { background: var(--danger-bg); color: var(--danger); }
.badge-muted-warn { background: #fdeee0; color: #b8672a; }
.badge-muted { background: var(--muted-bg); color: var(--muted); }

/* ---------- Cards / tables ---------- */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 23px; margin-bottom: 22px; }
.card > h2:first-child { font-size: 15px; margin-bottom: 18px; }
.card > h2:first-child, .card > h3:first-child { margin-top: 0; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.card-head h2 { margin: 0; }
.table-wrap { overflow-x: auto; }
table.table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.table th, .table td { text-align: left; padding: 14px 16px; border-bottom: 1px solid #edf0f5; vertical-align: middle; }
.table th { font-size: 12px; color: #949cad; font-weight: 500; background: #fafbfe; white-space: nowrap; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover td { background: #f7f9fe; }
.table .num { text-align: right; font-variant-numeric: tabular-nums; }
dl.kv { display: grid; grid-template-columns: 13rem 1fr; margin: 0; }
dl.kv dt, dl.kv dd { padding: .5rem .2rem; border-bottom: 1px solid var(--line); margin: 0; }
dl.kv dt { color: var(--text-2); font-size: .88rem; font-weight: 600; }
dl.kv dd { white-space: pre-wrap; word-break: break-word; }
@media (max-width: 720px) { dl.kv { grid-template-columns: 1fr; } dl.kv dt { border-bottom: 0; padding-bottom: 0; } }

/* ---------- Public site ---------- */
.pub-header { background: var(--surface); border-bottom: 1px solid var(--line); }
.pub-header .inner, .pub-main, .pub-footer .inner { max-width: 880px; margin: 0 auto; padding: 0 16px; }
.pub-header .inner { display: flex; align-items: center; justify-content: space-between; height: 74px; }
.logo { font-weight: 800; font-size: 27px; letter-spacing: -1.3px; color: #13213d; text-decoration: none; line-height: 1; }
.logo span { color: var(--brand); }
.logo:hover { color: #13213d; }
.pub-main { padding-top: 2rem; padding-bottom: 3rem; }
.pub-footer { border-top: 1px solid var(--line); background: var(--surface); color: var(--text-2); font-size: .82rem; }
.pub-footer .inner { padding: 1.2rem 16px; }
.hero { text-align: center; padding: 2.5rem 1rem 2rem; }
.hero h1 { font-size: 1.8rem; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.5rem 0; counter-reset: s; }
.steps li { list-style: none; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; counter-increment: s; }
.steps li::before { content: counter(s); display: inline-grid; place-items: center; width: 1.8em; height: 1.8em; border-radius: 50%; background: var(--brand); color: #fff; font-weight: 700; margin-right: .5em; }
@media (max-width: 720px) { .steps { grid-template-columns: 1fr; } }
.form-section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 26px 8px; margin-bottom: 20px; }
.form-section > h2 { font-size: 16px; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.form-section > h2::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: var(--brand); }
.eyebrow { text-transform: uppercase; color: var(--brand); font-size: 11px; letter-spacing: 2px; font-weight: 700; margin-bottom: 12px; }
@media (max-width: 720px) { .form-section { padding: 1.1rem 1rem .4rem; } }
.submit-bar { text-align: center; padding: 1rem 0 0; }
.doc-list { font-size: .85rem; color: var(--text-2); margin: .3rem 0 0; padding-left: 1.2rem; }
.done { text-align: center; padding: 2.5rem 1rem; }
.done .number { display: inline-block; font-size: 1.5rem; font-weight: 800; letter-spacing: .05em; background: var(--brand-soft); color: var(--brand-strong); padding: .4em 1em; border-radius: 8px; margin: .6rem 0 1rem; }
[hidden] { display: none !important; }

/* ---------- Admin（デモの Admin Console に合わせたレイアウト） ---------- */
.topbar { height: 74px; background: #fff; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 30px; position: sticky; top: 0; z-index: 20; gap: 20px; }
.topbar form { margin: 0; }
.top-right { display: flex; align-items: center; gap: 15px; }
.env-badge { font-size: 11px; font-weight: 700; letter-spacing: 1px; background: #fff6df; color: #9b7315; border: 1px solid #f5e5b7; padding: 5px 9px; border-radius: 5px; }
.avatar { display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); height: 34px; width: 34px; border-radius: 50%; font-weight: 600; flex-shrink: 0; }
.me { line-height: 1.35; font-size: 13px; }
.me small { display: block; color: var(--text-2); font-size: 11px; }
.workspace { display: flex; min-height: calc(100vh - 74px); }
.sidebar { width: 224px; flex-shrink: 0; background: linear-gradient(155deg, #101e36, #182641); color: #fff; padding: 28px 16px; display: flex; flex-direction: column; gap: 4px; }
.store { display: flex; gap: 10px; align-items: center; padding: 0 10px 22px; font-size: 13px; }
.store-icon { background: #ffffff12; width: 38px; height: 38px; border-radius: 8px; display: grid; place-items: center; font-weight: 700; }
.store small { display: block; color: #a4a8c0; font-size: 11px; }
.nav-label { font-size: 10px; letter-spacing: 1.5px; color: #8e90aa; padding: 18px 14px 8px; }
.navitem { display: flex; gap: 12px; align-items: center; padding: 11px 14px; border-radius: 7px; color: #c6c8d8; font-size: 14px; text-decoration: none; }
.navitem svg { width: 17px; height: 17px; flex-shrink: 0; }
.navitem .count { margin-left: auto; font-size: 11px; background: #ffffff14; color: #dcdcea; border-radius: 999px; padding: 0 7px; min-width: 22px; text-align: center; }
.navitem:hover { background: #ffffff15; color: #fff; }
.navitem.active { background: var(--brand); color: #fff; box-shadow: 0 4px 15px #051a3920; font-weight: 600; }
.navitem.sub { padding: 8px 14px 8px 43px; font-size: 13px; }
.navitem.disabled { opacity: .45; pointer-events: none; }
.side-bottom { margin-top: auto; padding: 26px 4px 0; }
.support-box { padding: 14px; border: 1px solid #ffffff20; border-radius: 10px; font-size: 12px; line-height: 1.8; color: #c1d2e9; }
.support-box small { color: #7898bf; display: block; }
.status-dot { display: inline-block; background: #25b78e; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 2px; }
.content { width: calc(100% - 224px); max-width: 1600px; padding: 32px 38px 45px; }
.breadcrumb { font-size: 12px; color: #8992a6; margin-bottom: 18px; }
.breadcrumb a { color: #8992a6; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 25px; }
.page-head h1 { margin: 0 0 4px; }
.page-head p { font-size: 13px; color: var(--text-2); margin: 0; }
.stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; margin-bottom: 23px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: 11px; padding: 20px 22px; text-decoration: none; color: var(--text); display: block; }
a.stat:hover { border-color: #d5c5ed; color: var(--text); background: #fdfcff; }
.stat .l { display: flex; justify-content: space-between; align-items: center; color: #747e94; font-size: 13px; margin-bottom: 14px; }
.stat .l svg { width: 16px; height: 16px; color: #95a0b7; }
.stat .n { font-size: 27px; font-weight: 650; letter-spacing: -1px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat .d { color: var(--accent); font-size: 12px; font-weight: 600; margin-top: 8px; }
.stat.dark { background: var(--navy); color: #fff; border-color: var(--navy); }
.stat.dark .l { color: #9badca; }
.stat.dark .d { color: #c5aee4; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.card-head h2 { margin: 0; font-size: 15px; }
.card-head p { margin: 4px 0 0; font-size: 12px; color: var(--text-2); }
.filter-tabs { display: flex; gap: 8px; margin-bottom: 20px; overflow-x: auto; padding-bottom: 2px; }
.filter-tabs a { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line-strong); background: #fff; color: #46506a; padding: 7px 13px; border-radius: 7px; font-size: 13px; text-decoration: none; white-space: nowrap; }
.filter-tabs a:hover { background: #f1edf7; }
.filter-tabs a.active { background: #eee7f8; color: var(--brand); border-color: #d5c5ed; font-weight: 600; }
.filter-tabs .c { font-size: 11px; color: var(--text-2); font-variant-numeric: tabular-nums; }
.filter-tabs a.active .c { color: var(--brand); }
.searchbar { display: flex; gap: 8px; max-width: 520px; width: 100%; }
.detail { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(300px, 1fr); gap: 22px; align-items: start; }
@media (max-width: 1150px) { .detail { grid-template-columns: minmax(0, 1fr); } }
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline li { position: relative; border-left: 2px solid #e8edf5; padding: 0 0 20px 22px; margin-left: 6px; }
.timeline li:last-child { border-color: transparent; padding-bottom: 0; }
.timeline li::before { content: ""; position: absolute; left: -6px; top: 5px; width: 10px; height: 10px; border-radius: 50%; background: #29b38c; }
.timeline .reason { background: #f7f4fb; border-radius: 7px; padding: 8px 11px; margin-top: 6px; white-space: pre-wrap; font-size: 13px; color: #4d5b73; }
.transition { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; background: #fff; }
.transition summary { padding: 10px 13px; cursor: pointer; font-weight: 600; font-size: 14px; list-style: none; display: flex; justify-content: space-between; align-items: center; color: #46506a; }
.transition summary::-webkit-details-marker { display: none; }
.transition summary::after { content: "›"; color: var(--text-2); font-size: 18px; transition: transform .15s; }
.transition[open] summary::after { transform: rotate(90deg); }
.transition[open] summary { border-bottom: 1px solid var(--line); }
.transition form { padding: 13px; }
.status-hero { background: var(--brand-soft); border-radius: 10px; padding: 18px 20px; margin-bottom: 16px; }
.status-hero .badge { font-size: 13px; padding: 5px 10px; }
.status-hero p { margin: 8px 0 0; font-size: 12px; color: #69518b; }
.docs { display: grid; gap: 10px; }
.doc { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; }
.doc .meta { font-size: 12px; color: var(--text-2); word-break: break-all; }
.doc-missing { border-style: dashed; color: #b73049; background: #fffafb; font-size: 13px; }
.note { background: #f5f3f9; padding: 12px 14px; border-radius: 7px; color: #69748a; font-size: 12px; line-height: 1.8; }
.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 16px; background: linear-gradient(155deg, #101e36, #182641); }
.auth-card { width: 100%; max-width: 410px; background: #fff; border-radius: 15px; padding: 34px 32px; box-shadow: 0 30px 100px #0b142a60; }
.auth-card .logo { display: block; text-align: center; margin-bottom: 6px; }
.auth-card .sub { text-align: center; font-size: 11px; letter-spacing: 2px; color: var(--brand); font-weight: 700; margin-bottom: 26px; }
.secret { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 17px; letter-spacing: .08em; background: var(--brand-soft); color: var(--brand); padding: 12px; border-radius: 8px; text-align: center; word-break: break-all; }
.pagination { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 16px; }
.pagination a, .pagination span { padding: 6px 11px; border: 1px solid var(--line-strong); border-radius: 7px; text-decoration: none; font-size: 13px; background: #fff; color: #46506a; }
.pagination .current { background: var(--brand); color: #fff; border-color: var(--brand); }
.pagination .disabled { color: #b5bccb; }
.footer-line { margin-top: 25px; display: flex; justify-content: space-between; gap: 15px; font-size: 11px; color: #9da6b7; }
@media (max-width: 1150px) { .content { padding: 25px; } .sidebar { width: 200px; } .content { width: calc(100% - 200px); } .topbar { padding: 0 20px; } }
@media (max-width: 850px) {
  .sidebar { width: 62px; padding: 20px 8px; }
  .sidebar .navitem { font-size: 0; padding: 12px; gap: 0; justify-content: center; }
  .sidebar .navitem svg { width: 20px; height: 20px; }
  .sidebar .navitem .count, .store, .nav-label, .side-bottom, .navitem.sub { display: none; }
  .content { width: calc(100% - 62px); padding: 22px 16px; }
  .me, .top-right .link-text { display: none; }
}
/* ---------- Utilities（CSPでstyle属性を禁止しているため、調整はクラスで行う） ---------- */
.inline { display: inline; }
.m0 { margin: 0; }
.mt-s { margin-top: 12px; } .mt-m { margin-top: 16px; } .mb-m { margin-bottom: 16px; }
.center { text-align: center; }
.w100 { width: 100%; }
.break { word-break: break-all; }
.h-sm { font-size: 18px; }
.mw220 { max-width: 220px; } .mw320 { max-width: 320px; } .mw520 { max-width: 520px; } .mw640 { max-width: 640px; }
.badge-lg { font-size: 13px; padding: 6px 12px; }
.empty { text-align: center; padding: 30px 0; margin: 0; color: var(--text-2); }
.doc-error { color: #b42318; font-weight: 700; }
.field > label { display: block; margin-bottom: 6px; }
.field input[type=file] { display: block; width: 100%; padding: 14px; border: 1px dashed #d5c5ed; border-radius: 8px; background: #fbf9fe; color: #69518b; font: inherit; font-size: 13px; cursor: pointer; }
.field input[type=file]::file-selector-button { font: inherit; font-size: 13px; font-weight: 600; margin-right: 12px; padding: 7px 14px; border-radius: 7px; border: 1px solid var(--brand); background: var(--brand); color: #fff; cursor: pointer; }
.field input[type=file][aria-invalid=true] { border-color: var(--danger); background: #fffafa; }
::placeholder { color: #b3bacb; }
/* ---------- Installer ---------- */
.installer-wide { max-width: 780px; }
.installer h2 { font-size: 15px; margin: 22px 0 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.installer .logo.center { text-align: center; display: block; }
.installer details.transition summary { font-size: 13px; }
.installer ul { padding-left: 1.2rem; }
/* ---------- System settings ---------- */
.stat .n.small-n { font-size: 18px; letter-spacing: -.3px; word-break: break-all; }
.inline-details { display: inline-block; margin: 0 0 0 6px; vertical-align: middle; min-width: 90px; }
.inline-details[open] { display: block; margin: 8px 0 0; white-space: normal; }
.inline-details summary { padding: 5px 11px; font-size: 13px; }
.actions-row { display: flex; gap: 10px; flex-wrap: wrap; }
.actions-row form { margin: 0; }

.footer-links { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
.footer-links a { color: var(--text-2); }
.note p + p { margin-top: 6px; }
.field > .label { display: block; font-weight: 600; color: #4d5b73; font-size: 13px; margin-bottom: .2rem; }
input[readonly] { background: var(--muted-bg); }
.grid-2 > div:has(> .field[hidden]) { display: none; }
.input-group { display: flex; gap: .5rem; }
.input-group input { flex: 1 1 auto; min-width: 0; }
.input-group .currency-select { flex: 0 0 9.5em; width: 9.5em; }
.pub-actions { display: flex; align-items: center; gap: .6rem; }
.lang-switch { display: inline-flex; border: 1px solid var(--line-strong); border-radius: 999px; padding: 2px; font-size: 12px; font-weight: 700; text-decoration: none; }
.lang-switch span { padding: 3px 9px; border-radius: 999px; color: var(--muted); }
.lang-switch span.on { background: var(--brand); color: #fff; }
.prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.log-trace { font-size: 11px; line-height: 1.5; background: #f6f8fc; border: 1px solid var(--line); border-radius: 6px; padding: 10px; overflow-x: auto; max-height: 320px; white-space: pre-wrap; word-break: break-all; }
.error-title { font-size: 1.25rem; margin: .6rem 0; }
.retained { font-size: .82rem; font-weight: 600; color: #1d7a4c; margin-top: .3rem; }
.mail-preview { border: 1px solid var(--line); border-radius: 8px; padding: 1rem; background: #fbfcfe; font-size: 13.5px; line-height: 1.7; overflow-wrap: anywhere; }
textarea.mono-text { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Noto Sans Mono CJK JP", monospace; font-size: 13px; line-height: 1.6; }
.alert-compact { white-space: normal; }
/* スマートフォン（幅の狭い iPhone）でヘッダーが右にはみ出さないようにする（2026-10-02） */
@media (max-width: 400px) {
  .pub-header .inner { gap: .5rem; }
  .pub-actions { gap: .4rem; min-width: 0; }
  .pub-actions .btn { white-space: normal; text-align: center; line-height: 1.25; padding: 5px 9px; font-size: 12px; }
}
/* 管理画面：スマートフォンで見出し横のボタンが右にはみ出さないよう折り返す（2026-10-02） */
.card-head { flex-wrap: wrap; }
.card-head > div:first-child { min-width: 0; flex: 1 1 220px; }
@media (max-width: 700px) {
  .page-head .nowrap { white-space: normal; display: flex; flex-wrap: wrap; gap: 8px; }
  .page-head > * { min-width: 0; max-width: 100%; }
}
@media (max-width: 420px) {
  .btn { white-space: normal; text-align: center; }
  .card .row-actions, .card .actions { flex-wrap: wrap; }
}
.card-head p, .page-head p, .card p { overflow-wrap: anywhere; }
/* iPhone の Safari は 16px 未満の入力欄にタッチすると自動で拡大し、画面の右側が切れて見える。スマートフォンでは 16px にする */
@media (max-width: 820px) {
  input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea { font-size: 16px; }
}
.badge-brand { background: #eee7f8; color: var(--brand); }
.note-action { border-color: #d5c5ed; background: #f6f1fc; color: var(--brand); }
.approval-tabs { margin-bottom: 10px; }
.filter-tabs a.attention { border-color: #d5c5ed; background: #f6f1fc; color: var(--brand); font-weight: 600; }
.text-brand { color: var(--brand); font-weight: 600; }
.navitem .count.count-alert { background: #c9a6f0; color: #1b1030; font-weight: 700; }
.approval-alert { display: block; margin-bottom: 18px; text-decoration: none; }
.status-hero p, .doc .meta { overflow-wrap: anywhere; }
/* 購入者の領収書（印刷） */
@media print { .no-print, .pub-header, .pub-footer { display: none !important; } .receipt-page .card { box-shadow: none; border: 0; } }
/* Merchant Console：リンクのコピー欄 */
.copy-row { display: flex; gap: 8px; align-items: center; }
.copy-row input { flex: 1; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
/* 全体売上の棒・Live Payment Map */
.bar { display: block; width: 100%; min-width: 120px; height: 8px; }
.bar .bar-bg { fill: #f1edf7; } .bar .bar-fg { fill: #4b1f6f; }
.map-card { background: #101e36; }
.map-wrap { position: relative; width: 100%; aspect-ratio: 1000 / 403; }
.map-wrap .map-bg, .map-wrap .map-dots { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-dots .dot { fill: #8aa0c8; opacity: .7; }
.map-dots .dot.live { fill: #c9a6f0; stroke: #fff; stroke-width: 1; opacity: .95; }
.map-card .muted { color: #8aa0c8; }