/* PBN マイページ v2（/my/ のみで読み込む）。トークンは body.pm-app（:has 対応ブラウザでは :root も）に定義し、値の直書きはしない。
   面を持つのは「次の予定」カードだけ。ほかは 1px 罫のリスト。角丸は 8px の1種類。影なし。 */
:root:has(body.pm-app),
body.pm-app {
	--pm-paper: #f6f3ed;
	--pm-white: #fff;
	--pm-ink: #0f2a43;
	--pm-ink-hover: #1b3f60;
	--pm-ink-press: #0a1d2f;
	--pm-text: #1e2b33;
	--pm-muted: #5a6472;
	--pm-line: #dfe6e0;
	--pm-control: #6f7b87;
	--pm-tint: #eef2ef;
	--pm-press: #e0e7e2;
	--pm-green: #2e7d5b;
	--pm-lime: #c8e64c;
	--pm-court: #1f4e79;
	--pm-danger: #9c3314;
	--pm-danger-bg: #fbefea;
	--pm-focus: #1f4e79;
	--pm-s1: 8px;
	--pm-s2: 16px;
	--pm-s3: 24px;
	--pm-s4: 32px;
	--pm-s6: 48px;
	--pm-s8: 64px;
	--pm-fs-small: 14px;
	--pm-lh-small: 24px;
	--pm-fs-body: 16px;
	--pm-lh-body: 28px;
	--pm-fs-lead: 18px;
	--pm-lh-lead: 28px;
	--pm-fs-h2: 22px;
	--pm-lh-h2: 32px;
	--pm-fs-h1: 28px;
	--pm-lh-h1: 40px;
	--pm-fs-date: 40px;
	--pm-lh-date: 48px;
	--pm-radius: 8px;
	--pm-tap: 48px;
	--pm-nav-h: 64px;
	--pm-rule: 1px;
	--pm-bar: 3px;
	--pm-accent: 4px;
	--pm-ring: 3px;
	--pm-knob: 24px;
	--pm-ease: 150ms;
	--pm-side: 240px;
	--pm-content: 720px;
	--pm-font: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
}
@media (prefers-reduced-motion: reduce) {
	:root:has(body.pm-app), body.pm-app { --pm-ease: 0ms; }
}
:root:has(body.pm-app) {
	scroll-padding-bottom: calc(var(--pm-nav-h) + env(safe-area-inset-bottom) + var(--pm-s2));
	background: var(--pm-paper);
}

body.pm-app { margin: 0; background: var(--pm-paper); color: var(--pm-text); font-family: var(--pm-font); font-size: var(--pm-fs-body); line-height: var(--pm-lh-body); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body.pm-app:not(.is-guest) { padding-bottom: calc(var(--pm-nav-h) + var(--pm-rule) + env(safe-area-inset-bottom)); }
.pm-app *, .pm-app *::before, .pm-app *::after { box-sizing: border-box; }
.pm-app h1, .pm-app h2, .pm-app h3, .pm-app h4, .pm-app legend { font-family: var(--pm-font); color: var(--pm-ink); }
.pm-app img { max-width: 100%; height: auto; }
.pm-app a, .pm-app button, .pm-app label, .pm-app summary, .pm-app select, .pm-app input { touch-action: manipulation; }
.pm-app :focus-visible { outline: var(--pm-ring) solid var(--pm-focus); outline-offset: 2px; }
.pm-app strong { color: var(--pm-ink); }

.pm-skip { position: absolute; left: var(--pm-s2); top: calc(-1 * var(--pm-s8)); z-index: 20; display: inline-flex; align-items: center; min-height: var(--pm-tap); padding: 0 var(--pm-s2); background: var(--pm-white); color: var(--pm-ink); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); }
.pm-skip:focus { top: var(--pm-s1); }
.pm-icon { width: var(--pm-knob); height: var(--pm-knob); flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* トップバー（LIFF 内では出さない） */
.pm-top { display: flex; align-items: center; justify-content: space-between; gap: var(--pm-s2); min-height: var(--pm-nav-h); padding: var(--pm-s1) var(--pm-s2); border-bottom: var(--pm-rule) solid var(--pm-line); }
body[data-liff="1"] .pm-top { display: none; }
.pm-logo { display: inline-flex; align-items: center; gap: var(--pm-s1); min-height: var(--pm-tap); color: var(--pm-ink); font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); font-weight: 700; text-decoration: none; }
.pm-logo img { width: var(--pm-s4); height: var(--pm-s4); border-radius: var(--pm-radius); }
.pm-me { display: inline-flex; align-items: center; gap: var(--pm-s1); min-height: var(--pm-tap); padding: 0 var(--pm-s1); border-radius: var(--pm-radius); color: var(--pm-ink); font-weight: 700; text-decoration: none; }
.pm-me:hover { background: var(--pm-tint); }
.pm-me:active { background: var(--pm-press); }
.pm-avatar { display: inline-grid; place-items: center; width: var(--pm-s4); height: var(--pm-s4); border-radius: var(--pm-radius); background: var(--pm-ink); color: var(--pm-white); font-size: var(--pm-fs-body); line-height: 1; }

/* ナビ: スマホは下固定4項目（下部固定UIはこれ1つ）、PCは左 240px */
.pm-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; background: var(--pm-white); border-top: var(--pm-rule) solid var(--pm-line); padding-bottom: env(safe-area-inset-bottom); }
.pm-nav__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.pm-nav__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; min-height: var(--pm-nav-h); padding: 0 var(--pm-s1); color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); text-decoration: none; transition: background-color var(--pm-ease); }
.pm-nav__item:hover { background: var(--pm-tint); }
.pm-nav__item:active { background: var(--pm-press); }
.pm-nav__item[aria-current="page"] { color: var(--pm-ink); font-weight: 700; box-shadow: inset 0 var(--pm-bar) 0 var(--pm-green); }
.pm-nav__account { display: none; }

.pm-main { display: block; width: 100%; max-width: var(--pm-content); margin: 0 auto; padding: var(--pm-s3) var(--pm-s2) var(--pm-s6); }
.pm-main:focus { outline: none; }

@media (min-width: 960px) {
	body.pm-app:not(.is-guest) { padding-bottom: 0; }
	:root:has(body.pm-app) { scroll-padding-bottom: var(--pm-s2); }
	.pm-top { padding: var(--pm-s1) var(--pm-s4); }
	.pm-shell { display: grid; grid-template-columns: var(--pm-side) minmax(0, 1fr); gap: var(--pm-s6); max-width: calc(var(--pm-side) + var(--pm-content) + var(--pm-s6) * 2); margin: 0 auto; padding: 0 var(--pm-s4); }
	.pm-shell--guest { display: block; }
	.pm-nav { position: static; padding: var(--pm-s3) 0; background: none; border: 0; }
	.pm-nav__list { grid-template-columns: 1fr; gap: var(--pm-s1); }
	.pm-nav__item { flex-direction: row; justify-content: flex-start; gap: var(--pm-s2); min-height: var(--pm-tap); padding: 0 var(--pm-s2); border-radius: var(--pm-radius); font-size: var(--pm-fs-body); line-height: var(--pm-lh-body); }
	.pm-nav__item[aria-current="page"] { background: var(--pm-white); box-shadow: inset var(--pm-bar) 0 0 var(--pm-green); }
	.pm-nav__account { display: flex; margin-top: var(--pm-s3); border-top: var(--pm-rule) solid var(--pm-line); border-radius: 0; padding-top: var(--pm-s1); padding-bottom: var(--pm-s1); }
	.pm-main { margin: 0; padding: var(--pm-s4) 0 var(--pm-s8); }
	.pm-shell--guest .pm-main { margin: 0 auto; }
}

/* 見出し・区切り */
.pm-head { margin: 0 0 var(--pm-s3); }
.pm-head h1 { margin: 0; font-size: var(--pm-fs-h1); line-height: var(--pm-lh-h1); font-weight: 700; }
.pm-head p { margin: var(--pm-s1) 0 0; color: var(--pm-muted); }
.pm-sec { margin: var(--pm-s6) 0 0; }
.pm-sec__head { display: flex; align-items: center; justify-content: space-between; gap: var(--pm-s2); flex-wrap: wrap; margin: 0 0 var(--pm-s1); }
.pm-sec__head h2, .pm-sec__h, .pm-finder h2, .pm-empty h2 { margin: 0; font-size: var(--pm-fs-h2); line-height: var(--pm-lh-h2); font-weight: 700; }
.pm-sec__h { margin-bottom: var(--pm-s1); }
.pm-count { color: var(--pm-muted); font-weight: 400; }

/* テキストリンク（下線）・補助文 */
.pm-link { color: var(--pm-ink); text-decoration: underline; text-decoration-thickness: var(--pm-rule); text-underline-offset: var(--pm-accent); }
.pm-link:hover { text-decoration-thickness: 2px; }
.pm-sec__head .pm-link, .pm-links .pm-link, .pm-line .pm-link, .pm-back .pm-link, .pm-more .pm-link, .pm-operator .pm-link { display: inline-flex; align-items: center; min-height: var(--pm-tap); }
.pm-links { display: flex; flex-wrap: wrap; gap: 0 var(--pm-s3); margin: var(--pm-s1) 0 0; }
.pm-back, .pm-more, .pm-line { margin: 0; }
.pm-quiet { margin: var(--pm-s1) 0 0; color: var(--pm-muted); }
.pm-note { margin: var(--pm-s1) 0 0; color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); }
.pm-sub { margin: var(--pm-s1) 0 0; color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); overflow-wrap: anywhere; }
.pm-sub:empty { display: none; }
.pm-status { margin: 0 0 var(--pm-s2); padding: var(--pm-s1) var(--pm-s2); border-left: var(--pm-accent) solid var(--pm-green); background: var(--pm-white); color: var(--pm-ink); }
.pm-live:empty, [data-pbn-liff-status][hidden] { display: none; }
.pm-alert { margin: var(--pm-s1) 0 0; padding: var(--pm-s1) var(--pm-s2); border-left: var(--pm-accent) solid var(--pm-danger); background: var(--pm-danger-bg); color: var(--pm-danger); font-weight: 700; }
.pm-req, .pm-opt { margin-left: var(--pm-s1); font-size: var(--pm-fs-small); font-weight: 400; color: var(--pm-muted); }
.pm-req { color: var(--pm-danger); }

/* ボタン: 主（ネイビー地）は1画面1つ、副は罫線 */
.pm-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--pm-s1); min-height: var(--pm-tap); padding: 0 var(--pm-s2); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font: inherit; font-weight: 700; line-height: var(--pm-lh-small); text-align: center; text-decoration: none; cursor: pointer; transition: background-color var(--pm-ease), opacity var(--pm-ease); }
.pm-btn:hover { background: var(--pm-tint); }
.pm-btn:active { background: var(--pm-press); }
.pm-btn:disabled { opacity: .5; cursor: not-allowed; }
.pm-btn[aria-busy="true"] { opacity: .8; cursor: progress; }
.pm-btn--primary { background: var(--pm-ink); border-color: var(--pm-ink); color: var(--pm-white); }
.pm-btn--primary:hover { background: var(--pm-ink-hover); }
.pm-btn--primary:active { background: var(--pm-ink-press); }
.pm-btn--danger { border-color: var(--pm-danger); color: var(--pm-danger); }
.pm-btn--danger:hover { background: var(--pm-danger-bg); }
.pm-btn--wide { width: 100%; }
.pm-btn[aria-pressed="true"] .pm-icon { fill: currentColor; }
.pm-actions { display: flex; flex-wrap: wrap; gap: var(--pm-s1); margin: var(--pm-s2) 0 0; }
.pm-actions:empty { display: none; }
.pm-actions .pm-btn { flex: 1 1 auto; }

/* 折りたたみ（開閉 150ms のみ） */
.pm-fold > summary { display: inline-flex; align-items: center; gap: var(--pm-s1); min-height: var(--pm-tap); margin: var(--pm-s1) 0 0; padding: 0 var(--pm-s2); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font-weight: 700; cursor: pointer; list-style: none; transition: background-color var(--pm-ease); }
.pm-fold > summary::-webkit-details-marker { display: none; }
.pm-fold > summary::after { content: ""; width: var(--pm-s1); height: var(--pm-s1); border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform var(--pm-ease); }
.pm-fold[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.pm-fold > summary:hover { background: var(--pm-tint); }
.pm-fold > summary:active { background: var(--pm-press); }
.pm-cancel > summary { border-color: transparent; background: none; padding: 0; color: var(--pm-danger); text-decoration: underline; text-underline-offset: var(--pm-accent); }
.pm-cancel > summary:hover, .pm-cancel > summary:active { background: none; text-decoration-thickness: 2px; }
.pm-cancel form, .pm-cancel > p { margin: var(--pm-s1) 0 0; padding: var(--pm-s2) 0 0 var(--pm-s2); border-left: var(--pm-rule) solid var(--pm-line); }
.pm-cancel form p { margin: 0 0 var(--pm-s1); }
.pm-past { margin-top: var(--pm-s4); }
.pm-past > summary { display: flex; width: 100%; justify-content: space-between; min-height: var(--pm-s8); margin: 0; padding: 0; border: 0; border-top: var(--pm-rule) solid var(--pm-line); border-radius: 0; background: none; }
.pm-past > summary:hover, .pm-past > summary:active { background: none; }
.pm-past > summary .pm-sec__h { margin: 0; }
.pm-past > summary .pm-count { margin-left: auto; }
.pm-past .pm-list { border-top: 0; }
.pm-add { margin-top: var(--pm-s3); }
.pm-add[open] > summary { margin-bottom: var(--pm-s2); }

/* リスト（コートラインのような 1px 罫） */
.pm-list { margin: 0; padding: 0; list-style: none; border-top: var(--pm-rule) solid var(--pm-line); }
.pm-row { display: flex; align-items: flex-start; gap: var(--pm-s2); padding: var(--pm-s2) 0; border-bottom: var(--pm-rule) solid var(--pm-line); }
.pm-row__body { flex: 1; min-width: 0; }
.pm-row--court { align-items: center; }
.pm-date { flex: 0 0 calc(var(--pm-s8) + var(--pm-s1)); width: calc(var(--pm-s8) + var(--pm-s1)); display: flex; flex-direction: column; margin: 0; color: var(--pm-ink); }
.pm-date__md { font-size: var(--pm-fs-h2); line-height: var(--pm-lh-h2); font-weight: 700; }
.pm-date__wd { color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); }
.pm-title { margin: 0; font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); font-weight: 700; overflow-wrap: anywhere; }
.pm-title a { color: inherit; text-decoration: underline; text-decoration-thickness: var(--pm-rule); text-underline-offset: var(--pm-accent); }
.pm-title a:hover { text-decoration-thickness: 2px; }
.pm-detail[open] { padding-bottom: var(--pm-s1); }
.pm-fav { margin: var(--pm-s1) 0 0; }
.pf-removed { margin: var(--pm-s1) 0 0; color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); }

/* 状態チップ（色だけにせず文字で状態を書く） */
.pm-chip { display: inline-flex; align-items: center; min-height: var(--pm-s4); margin: var(--pm-s1) var(--pm-s1) 0 0; padding: 0 var(--pm-s1); border: var(--pm-rule) solid var(--pm-line); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); font-weight: 700; vertical-align: middle; }
.pm-chip.is-ok { background: var(--pm-green); border-color: var(--pm-green); color: var(--pm-white); }
.pm-chip.is-wait { border-color: var(--pm-ink); }
.pm-chip.is-off { background: var(--pm-paper); color: var(--pm-muted); }

/* 次の予定カード（このページで面を持つ唯一の要素。ライムはここの1本だけ） */
.pm-plan { display: grid; grid-template-columns: minmax(0, 1fr); background: var(--pm-white); border: var(--pm-rule) solid var(--pm-line); border-radius: var(--pm-radius); overflow: hidden; }
.pm-plan__date { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--pm-s2); padding: var(--pm-s2) var(--pm-s3); background: var(--pm-court); color: var(--pm-white); border-bottom: var(--pm-accent) solid var(--pm-lime); }
.pm-plan__day { display: flex; align-items: baseline; gap: var(--pm-s1); margin: 0; }
.pm-plan__md { font-size: var(--pm-fs-date); line-height: var(--pm-lh-date); font-weight: 700; }
.pm-plan__wd { font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); font-weight: 700; }
.pm-plan__time { margin: 0; font-size: var(--pm-fs-h2); line-height: var(--pm-lh-h2); font-weight: 700; }
.pm-plan__body { padding: var(--pm-s2) var(--pm-s3) var(--pm-s3); min-width: 0; }
.pm-plan .pm-title { margin-top: var(--pm-s1); font-size: var(--pm-fs-h2); line-height: var(--pm-lh-h2); }
.pm-plan .pm-sub { font-size: var(--pm-fs-body); line-height: var(--pm-lh-body); }
@media (min-width: 600px) {
	.pm-plan { grid-template-columns: calc(var(--pm-s8) * 3) minmax(0, 1fr); }
	.pm-plan__date { flex-direction: column; align-items: flex-start; padding: var(--pm-s3); border-bottom: 0; border-right: var(--pm-accent) solid var(--pm-lime); }
	.pm-plan__time { font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); white-space: nowrap; }
	.pm-actions .pm-btn { flex: 0 1 auto; }
}
.pm-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 0 var(--pm-s2); margin: var(--pm-s2) 0 0; }
.pm-facts div { display: contents; }
.pm-facts dt { color: var(--pm-muted); }
.pm-facts dd { margin: 0; color: var(--pm-ink); font-weight: 700; overflow-wrap: anywhere; }

/* 次の予定を作る・空状態（面を持たず、上下の罫で区切る） */
.pm-finder, .pm-empty { padding: var(--pm-s3) 0; border-top: var(--pm-rule) solid var(--pm-line); border-bottom: var(--pm-rule) solid var(--pm-line); }
.pm-finder > p:not(.pm-lead), .pm-empty > p { margin: var(--pm-s1) 0 0; }
.pm-empty > .pm-btn { margin-top: var(--pm-s3); }
.pm-form.pm-finder__form { margin-top: var(--pm-s3); }
.pm-lead { margin: 0 0 var(--pm-s1); color: var(--pm-ink); font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); }
.pm-finder > .pm-lead { margin: 0 0 var(--pm-s2); }
@media (min-width: 600px) {
	.pm-finder__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; gap: var(--pm-s2); align-items: end; }
	.pm-finder__form .pm-field { margin: 0; }
}

/* フォーム */
.pm-form { margin: 0; }
.pm-field { margin: 0 0 var(--pm-s2); }
.pm-field > label { display: block; margin: 0 0 var(--pm-s1); color: var(--pm-ink); font-weight: 700; }
.pm-field input, .pm-field select { display: block; width: 100%; min-height: var(--pm-tap); padding: var(--pm-s1) var(--pm-s2); border: var(--pm-rule) solid var(--pm-control); border-radius: var(--pm-radius); background-color: var(--pm-white); color: var(--pm-text); font: inherit; font-size: var(--pm-fs-body); }
.pm-field input::placeholder { color: var(--pm-muted); }
.pm-field select:disabled { opacity: .5; }
.pm-form > .pm-btn--primary, .pm-finder__form .pm-btn--primary { width: 100%; }
@media (min-width: 600px) { .pm-form > .pm-btn--primary { width: auto; min-width: calc(var(--pm-s8) * 4); } .pm-finder__form .pm-btn--primary { width: auto; } }
.pm-grid { display: grid; gap: 0 var(--pm-s2); }
@media (min-width: 600px) { .pm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pm-fieldset { min-width: 0; margin: 0 0 var(--pm-s2); padding: 0; border: 0; }
.pm-fieldset > legend { margin: 0 0 var(--pm-s1); padding: 0; font-weight: 700; }
.pm-sec .pm-form > .pm-fieldset { margin-bottom: var(--pm-s3); padding-top: var(--pm-s2); border-top: var(--pm-rule) solid var(--pm-line); }
.pm-sec .pm-form > .pm-fieldset > legend { float: left; width: 100%; margin-bottom: var(--pm-s2); font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); }
.pm-sec .pm-form > .pm-fieldset > legend + * { clear: left; }
.pm-check { display: flex; align-items: flex-start; gap: var(--pm-s1); min-height: var(--pm-tap); padding: var(--pm-s1) 0; }
.pm-check input { flex: none; width: var(--pm-knob); height: var(--pm-knob); margin: 2px 0 0; accent-color: var(--pm-green); }
.pm-check label { cursor: pointer; }
.pm-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--pm-s2); }
.pm-presets { display: flex; flex-wrap: wrap; gap: var(--pm-s1); margin: 0 0 var(--pm-s1); }
.pm-presets .pm-btn[aria-pressed="true"] { background: var(--pm-ink); color: var(--pm-white); }
.pm-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--pm-s1); }
.pm-days input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pm-days label { display: grid; place-items: center; min-height: var(--pm-tap); border: var(--pm-rule) solid var(--pm-control); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font-weight: 700; cursor: pointer; transition: background-color var(--pm-ease); }
.pm-days label:hover { background: var(--pm-tint); }
.pm-days input:checked + label { background: var(--pm-ink); border-color: var(--pm-ink); color: var(--pm-white); }
.pm-days input:focus-visible + label { outline: var(--pm-ring) solid var(--pm-focus); outline-offset: 2px; }
.pm-cond-form { padding-top: var(--pm-s2); }

/* 有効/停止トグル（文字でも状態を書く） */
.pm-toggle-form { margin: var(--pm-s2) 0 0; }
.pm-switch { display: inline-flex; align-items: center; gap: var(--pm-s2); min-height: var(--pm-tap); padding: 0 var(--pm-s2) 0 var(--pm-s1); border: var(--pm-rule) solid var(--pm-control); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font: inherit; font-weight: 700; cursor: pointer; transition: background-color var(--pm-ease), opacity var(--pm-ease); }
.pm-switch:hover { background: var(--pm-tint); }
.pm-switch:active { background: var(--pm-press); }
.pm-switch:disabled { opacity: .5; cursor: not-allowed; }
.pm-switch[aria-busy="true"] { opacity: .8; cursor: progress; }
.pm-switch__track { position: relative; width: var(--pm-s6); height: var(--pm-s4); border-radius: var(--pm-radius); background: var(--pm-control); transition: background-color var(--pm-ease); }
.pm-switch__track::after { content: ""; position: absolute; top: var(--pm-accent); left: var(--pm-accent); width: var(--pm-knob); height: var(--pm-knob); border-radius: var(--pm-radius); background: var(--pm-white); transition: transform var(--pm-ease); }
.pm-switch[aria-checked="true"] .pm-switch__track { background: var(--pm-green); }
.pm-switch[aria-checked="true"] .pm-switch__track::after { transform: translateX(var(--pm-s2)); }

/* 項目と値 */
.pm-kv { margin: 0; border-top: var(--pm-rule) solid var(--pm-line); }
.pm-kv > div { display: grid; grid-template-columns: calc(var(--pm-s8) * 2) minmax(0, 1fr); gap: var(--pm-s2); padding: var(--pm-s2) 0; border-bottom: var(--pm-rule) solid var(--pm-line); }
.pm-kv dt { color: var(--pm-ink); font-weight: 700; }
.pm-kv dd { margin: 0; overflow-wrap: anywhere; }

/* 未ログイン */
.pm-benefits { margin: 0 0 var(--pm-s4); padding: 0; list-style: none; border-top: var(--pm-rule) solid var(--pm-line); }
.pm-benefits li { display: grid; gap: var(--pm-s1); padding: var(--pm-s2) 0; border-bottom: var(--pm-rule) solid var(--pm-line); }
.pm-benefits strong { font-size: var(--pm-fs-lead); line-height: var(--pm-lh-lead); }
.pm-guest .pm-fold { margin-top: var(--pm-s3); }
.pm-operator { margin: var(--pm-s6) 0 0; font-size: var(--pm-fs-small); }
@media (min-width: 600px) { .pm-guest .pm-btn--wide { width: auto; min-width: calc(var(--pm-s8) * 5); } }
[data-pbn-liff-status] { margin: 0 0 var(--pm-s2); }
[data-pbn-liff-status] p { margin: 0 0 var(--pm-s1); }
[data-pbn-liff-status] button, [data-pbn-liff-status] a { display: inline-flex; align-items: center; min-height: var(--pm-tap); margin-right: var(--pm-s2); padding: 0 var(--pm-s2); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font: inherit; font-weight: 700; text-decoration: none; }
.pm-manage { margin-top: var(--pm-s4); }

/* サークルとの会話（既存モジュールの出力を、この画面の語彙で整える） */
.pm-conv .card { margin: 0 0 var(--pm-s3); padding: var(--pm-s2) 0 0; border-top: var(--pm-rule) solid var(--pm-line); }
.pm-conv h2 { margin: 0 0 var(--pm-s1); font-size: var(--pm-fs-h2); line-height: var(--pm-lh-h2); }
.pm-conv .hint { margin: var(--pm-s1) 0 0; color: var(--pm-muted); font-size: var(--pm-fs-small); line-height: var(--pm-lh-small); }
.pm-conv .conversation-chips { display: flex; flex-wrap: wrap; gap: var(--pm-s1); }
.pm-conv .conversation-chips span { display: inline-flex; align-items: center; min-height: var(--pm-s4); padding: 0 var(--pm-s1); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); font-size: var(--pm-fs-small); font-weight: 700; color: var(--pm-ink); }
.pm-conv .conversation-filters { display: none; }
.pm-conv .chat-timeline { display: grid; gap: var(--pm-s1); margin: var(--pm-s2) 0; }
.pm-conv .chat-message { padding: var(--pm-s2); border: var(--pm-rule) solid var(--pm-line); border-radius: var(--pm-radius); background: var(--pm-white); }
.pm-conv .chat-mine { background: var(--pm-tint); }
.pm-conv .chat-meta { display: flex; flex-wrap: wrap; gap: 0 var(--pm-s1); color: var(--pm-muted); font-size: var(--pm-fs-small); }
.pm-conv .chat-message p { margin: var(--pm-s1) 0 0; overflow-wrap: anywhere; }
.pm-conv label { display: block; margin: var(--pm-s2) 0 var(--pm-s1); color: var(--pm-ink); font-weight: 700; }
.pm-conv .check-label { display: flex; gap: var(--pm-s1); font-weight: 400; }
.pm-conv textarea, .pm-conv input[type="email"] { display: block; width: 100%; min-height: var(--pm-tap); padding: var(--pm-s1) var(--pm-s2); border: var(--pm-rule) solid var(--pm-control); border-radius: var(--pm-radius); background: var(--pm-white); font: inherit; }
.pm-conv button, .pm-conv .button { display: inline-flex; align-items: center; justify-content: center; min-height: var(--pm-tap); margin-top: var(--pm-s1); padding: 0 var(--pm-s2); border: var(--pm-rule) solid var(--pm-ink); border-radius: var(--pm-radius); background: var(--pm-white); color: var(--pm-ink); font: inherit; font-weight: 700; cursor: pointer; }
.pm-conv .chat-send { display: grid; gap: var(--pm-s1); }
.pm-conv summary { display: flex; align-items: center; min-height: var(--pm-tap); color: var(--pm-ink); font-weight: 700; cursor: pointer; }

/* フッター */
.pm-foot { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 var(--pm-s3); margin-top: var(--pm-s8); padding: var(--pm-s3) var(--pm-s2) var(--pm-s4); border-top: var(--pm-rule) solid var(--pm-line); }
.pm-foot a { display: inline-flex; align-items: center; min-height: var(--pm-tap); color: var(--pm-muted); text-decoration: underline; text-underline-offset: var(--pm-accent); }
.pm-form > .pm-btn, .pm-form > .pm-check + .pm-btn { margin-top: var(--pm-s2); }
.pm-area { margin: var(--pm-s1) 0 0; color: var(--pm-text); overflow-wrap: anywhere; }
.pm-plan .pm-area { font-weight: 700; }
.pm-folds { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0 var(--pm-s3); margin: var(--pm-s1) 0 0; }
.pm-folds > details[open] { flex-basis: 100%; order: 2; }
.pm-folds > .pm-fold > summary { margin: 0; }
.pm-textfold > summary { border-color: transparent; background: none; padding: 0; text-decoration: underline; text-underline-offset: var(--pm-accent); }
.pm-textfold > summary:hover, .pm-textfold > summary:active { background: none; text-decoration-thickness: 2px; }
.pm-textfold[open] > .pm-form { padding-left: var(--pm-s2); border-left: var(--pm-rule) solid var(--pm-line); }
.pm-linkline { margin: var(--pm-s1) 0 var(--pm-s3); }
.pm-linkline .pm-btn { margin-top: var(--pm-s1); }