/* できるモーション 会員システム — 会員向け画面 */

.dkm-form, .dkm-app, .dkm-card, .dkm-note {
  --dkm-bg: #FBFAF6;
  --dkm-surface: #FFFFFF;
  --dkm-ink: #2E3A38;
  --dkm-soft: #56605E;
  --dkm-faint: #636F6C;
  --dkm-primary: #348279;
  --dkm-primary-dark: #2A6C64;
  --dkm-primary-soft: #E3F0ED;
  --dkm-accent: #EE9E45;
  --dkm-accent-soft: #FDF0DF;
  --dkm-danger: #B04E36;
  --dkm-danger-soft: #FBEAE5;
  --dkm-line: #E8E3D8;
  font-family: "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;
  color: var(--dkm-ink);
  line-height: 1.85;
}

.dkm-form, .dkm-app { max-width: 640px; margin: 0 auto; }

.dkm-card {
  background: var(--dkm-surface);
  border-radius: 20px;
  padding: 24px 22px;
  margin-bottom: 18px;
  box-shadow: 0 2px 14px rgba(46,58,56,.06);
}
.dkm-narrow { max-width: 460px; margin-left: auto; margin-right: auto; }

.dkm-card h2 { font-size: 19px; margin: 0 0 6px; line-height: 1.5; }
.dkm-card h3 { font-size: 16px; margin: 0 0 10px; }
.dkm-lead { color: var(--dkm-soft); font-size: 14px; margin: 0 0 18px; }
.dkm-eyebrow { font-size: 12px; letter-spacing: .14em; color: var(--dkm-faint); font-weight: 700; margin: 0; }
.dkm-hint { font-size: 13px; color: var(--dkm-faint); margin: 4px 0 0; line-height: 1.7; }
.dkm-center { text-align: center; }
.dkm-hr { border: none; border-top: 1px solid var(--dkm-line); margin: 20px 0; }
.dkm-links { margin-top: 14px; font-size: 14px; }

/* 入力欄 */
.dkm-field { margin-bottom: 18px; }
.dkm-label {
  display: flex; align-items: center; gap: 8px;
  font-weight: 700; font-size: 15px; margin-bottom: 6px;
}
.dkm-req, .dkm-any {
  font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
}
.dkm-req { background: var(--dkm-danger-soft); color: var(--dkm-danger); }
.dkm-any { background: #F2EEE5; color: var(--dkm-faint); }

.dkm-input {
  width: 100%; box-sizing: border-box;
  min-height: 52px; padding: 12px 14px;
  border: 1.5px solid var(--dkm-line); border-radius: 12px;
  background: #fff; font-size: 16px; /* 16px未満だとスマホで拡大されます */
  font-family: inherit; color: inherit;
}
textarea.dkm-input { min-height: 0; line-height: 1.8; }
.dkm-input:focus {
  outline: none; border-color: var(--dkm-primary);
  box-shadow: 0 0 0 3px var(--dkm-primary-soft);
}

.dkm-readonly {
  background: #F5F2EA; border-radius: 12px; padding: 14px 16px; margin-bottom: 18px;
}
.dkm-readonly .dkm-label { display: block; font-size: 13px; color: var(--dkm-soft); margin-bottom: 2px; }

/* チェックボックス */
.dkm-check {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 14px; border: 1.5px solid var(--dkm-line); border-radius: 12px;
  cursor: pointer; font-size: 14px; background: #fff;
}
.dkm-check + .dkm-check { margin-top: 10px; }
.dkm-check input { width: 22px; height: 22px; margin: 2px 0 0; flex: none; accent-color: var(--dkm-primary); }
.dkm-check:hover { border-color: var(--dkm-primary); }
.dkm-check .dkm-hint { display: block; margin-top: 2px; }
.dkm-consents { margin-bottom: 22px; }

/* ボタン */
.dkm-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 0 26px; border-radius: 999px;
  font-weight: 700; font-size: 16px; text-decoration: none;
  border: none; cursor: pointer; font-family: inherit; transition: .15s;
}
.dkm-btn-full { width: 100%; }
.dkm-btn-primary { background: var(--dkm-primary); color: #fff; }
.dkm-btn-primary:hover { background: var(--dkm-primary-dark); color: #fff; }
.dkm-btn-outline { background: #fff; color: var(--dkm-primary); box-shadow: inset 0 0 0 2px var(--dkm-primary); }
.dkm-btn-outline:hover { background: var(--dkm-primary-soft); color: var(--dkm-primary-dark); }
.dkm-btn-ghost { background: #F2EEE5; color: var(--dkm-ink); }
.dkm-btn:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: 3px; }
.dkm-actions .dkm-btn + .dkm-btn { margin-top: 10px; }
/* 第32弾：ボタンのすぐ下の注意書き（三鷹市団体構成員登録）と、その次のボタンの間 */
.dkm-actions .dkm-btn + .dkm-hint { margin-top: 6px; }
.dkm-actions .dkm-hint + .dkm-btn { margin-top: 12px; }

/* 通知 */
.dkm-note {
  border-radius: 16px; padding: 16px 18px; margin: 0 auto 18px;
  max-width: 640px; font-size: 15px;
}
.dkm-note ul { margin: 8px 0 0; padding-left: 1.3em; }
.dkm-note-ok { background: var(--dkm-primary-soft); color: var(--dkm-primary-dark); }
.dkm-note-err { background: var(--dkm-danger-soft); color: var(--dkm-danger); }
.dkm-note-info { background: var(--dkm-accent-soft); color: #8F5A15; }

.dkm-done { text-align: center; }
.dkm-done h2 { margin-bottom: 12px; }

.dkm-childrow {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid #F2EEE5; gap: 12px; flex-wrap: wrap;
}
.dkm-childrow:last-child { border-bottom: none; }
.dkm-childrow .dkm-hint { margin: 0; }

/* WordPress標準のログインフォームを整える */
#dkm-login-form p { margin-bottom: 16px; }
#dkm-login-form label { display: block; font-weight: 700; font-size: 15px; margin-bottom: 6px; }
#dkm-login-form input[type="text"],
#dkm-login-form input[type="password"] {
  width: 100%; box-sizing: border-box; min-height: 52px; padding: 12px 14px;
  border: 1.5px solid var(--dkm-line); border-radius: 12px; font-size: 16px;
}
#dkm-login-form .login-remember label { display: flex; align-items: center; gap: 8px; font-weight: 400; }
#dkm-login-form .login-remember input { width: 20px; height: 20px; accent-color: var(--dkm-primary); }
#dkm-login-form input[type="submit"] {
  width: 100%; min-height: 54px; border: none; border-radius: 999px;
  background: var(--dkm-primary); color: #fff; font-weight: 700; font-size: 16px; cursor: pointer;
}
#dkm-login-form input[type="submit"]:hover { background: var(--dkm-primary-dark); }

/* 迷惑投稿よけ（人には見せない） */
.dkm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 600px) {
  .dkm-card { padding: 20px 16px; border-radius: 16px; }
  .dkm-card h2 { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .dkm-btn { transition: none; }
}

/* ============================================================
 * 第2弾：開催・予約・ポイント
 * ============================================================ */

.dkm-app { --dkm-gym:#9B5F1D; --dkm-gym-icon:#D98A33; --dkm-gym-soft:#FBEEDC;
           --dkm-swim:#3B7290; --dkm-swim-icon:#4A8FB4; --dkm-swim-soft:#E4F0F6;
           --dkm-bike:#537742; --dkm-bike-icon:#6F9E58; --dkm-bike-soft:#EAF3E4;
           --dkm-other:#4A4F55; --dkm-other-icon:#6E747C; --dkm-other-soft:#ECEEF0; }

.dkm-block { margin-bottom: 20px; }
.dkm-block-h { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
.dkm-block-h h2 { font-size: 20px; margin: 0; }
.dkm-block-h h3 { font-size: 16px; margin: 0; }
.dkm-block-h a { margin-left: auto; font-size: 13px; color: var(--dkm-primary); font-weight: 700; }
.dkm-month { font-size: 13px; color: var(--dkm-faint); font-weight: 700; margin: 22px 0 8px; }
.dkm-back { font-size: 14px; margin: 0 0 12px; }

/* 残高 */
.dkm-balance {
  background: linear-gradient(150deg, var(--dkm-primary) 0%, #3F9A8F 100%);
  color: #fff; border-radius: 20px; padding: 24px 22px; margin-bottom: 18px;
}
.dkm-balance-l { font-size: 12px; letter-spacing: .14em; color: rgba(255,255,255,.75); font-weight: 700; margin: 0; }
.dkm-balance-n { display: flex; align-items: baseline; gap: 8px; margin: 6px 0 0; font-weight: 700; }
.dkm-balance-n .n { font-size: 46px; line-height: 1; }
.dkm-balance-n .u { font-size: 16px; color: rgba(255,255,255,.86); }
.dkm-balance-exp {
  margin: 12px 0 0; padding-top: 12px; font-size: 13px;
  border-top: 1px solid rgba(255,255,255,.24); color: rgba(255,255,255,.85);
}
.dkm-balance-row { display: flex; gap: 10px; margin-top: 16px; }
.dkm-balance-row .dkm-btn { flex: 1; background: #fff; color: var(--dkm-primary-dark); }
.dkm-balance-row .dkm-btn-sec { background: rgba(255,255,255,.18); color: #fff; }
.dkm-btn-sm { min-height: 46px; font-size: 15px; padding: 0 18px; }

/* プログラムの名札（色＋アイコン＋文字） */
.dkm-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 11px 4px 9px; border-radius: 999px;
  font-size: 13px; font-weight: 700; white-space: nowrap;
}
.dkm-chip svg { width: 15px; height: 15px; flex: none; }
.dkm-chip-gym  { background: var(--dkm-gym-soft);  color: var(--dkm-gym); }
.dkm-chip-gym svg  { color: var(--dkm-gym-icon); }
.dkm-chip-swim { background: var(--dkm-swim-soft); color: var(--dkm-swim); }
.dkm-chip-swim svg { color: var(--dkm-swim-icon); }
.dkm-chip-bike { background: var(--dkm-bike-soft); color: var(--dkm-bike); }
.dkm-chip-bike svg { color: var(--dkm-bike-icon); }
/* 第34弾：自由に入力して足した内容（体育館・水泳・自転車のどれでもないもの） */
.dkm-chip-other { background: var(--dkm-other-soft); color: var(--dkm-other); }
.dkm-chip-other svg { color: var(--dkm-other-icon); }

.dkm-state { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.dkm-state-open      { background: var(--dkm-primary-soft); color: var(--dkm-primary-dark); }
.dkm-state-few       { background: var(--dkm-accent-soft);  color: #8F5A15; }
.dkm-state-full      { background: #F2EEE5; color: var(--dkm-soft); }
.dkm-state-wl        { background: #E3F1C4; color: #3D6612; }   /* 第43弾：満員・講師追加希望（黄緑） */
.dkm-state-closed    { background: #F2EEE5; color: var(--dkm-faint); }
.dkm-state-cancelled { background: var(--dkm-danger-soft); color: var(--dkm-danger); }

/* カレンダー */
.dkm-day { display: flex; gap: 14px; margin-bottom: 14px; }
.dkm-day-head {
  flex: none; width: 44px; text-align: center; padding-top: 14px;
  font-weight: 700; line-height: 1.2;
}
.dkm-day-head .d { display: block; font-size: 22px; }
.dkm-day-head .w { display: block; font-size: 11px; color: var(--dkm-faint); }
.dkm-day-head.dkm-sun .w, .dkm-day-head.dkm-sun .d { color: #C4593F; }
.dkm-day-head.dkm-sat .w, .dkm-day-head.dkm-sat .d { color: #4A8FB4; }
.dkm-day-body { flex: 1; min-width: 0; display: grid; gap: 10px; }

.dkm-slot {
  display: block; background: #fff; border-radius: 16px; padding: 14px 16px;
  box-shadow: 0 2px 14px rgba(46,58,56,.06); text-decoration: none; color: inherit;
  transition: .15s;
}
.dkm-slot:hover { background: var(--dkm-primary-soft); }
.dkm-slot-full, .dkm-slot-closed, .dkm-slot-cancelled { opacity: .72; }
.dkm-slot-wl { opacity: 1; }   /* 第43弾：講師追加待ちに登録できる満員の回は、薄くしない */
.dkm-slot-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.dkm-slot-time { display: block; font-weight: 700; font-size: 16px; }
.dkm-slot-meta { display: block; font-size: 13px; color: var(--dkm-soft); margin-top: 2px; }

/* 直近の予約 */
.dkm-resv {
  display: flex; gap: 14px; align-items: center; text-decoration: none; color: inherit;
  background: #fff; border-radius: 16px; padding: 16px 18px; margin-bottom: 10px;
  box-shadow: 0 2px 14px rgba(46,58,56,.06);
}
.dkm-resv:hover { background: var(--dkm-primary-soft); }
.dkm-resv-date { flex: none; width: 52px; text-align: center; line-height: 1.2; }
.dkm-resv-date .m { display: block; font-size: 11px; color: var(--dkm-faint); font-weight: 700; }
.dkm-resv-date .d { display: block; font-size: 25px; font-weight: 700; }
.dkm-resv-date .w { display: block; font-size: 11px; color: var(--dkm-faint); }
.dkm-resv-meta { flex: 1; min-width: 0; }
.dkm-resv-meta .nm { display: block; font-weight: 700; font-size: 15px; margin-top: 6px; }
.dkm-resv-meta .sm { display: block; font-size: 13px; color: var(--dkm-soft); margin-top: 2px; }

/* 定義表 */
.dkm-deflist { width: 100%; border-collapse: collapse; font-size: 15px; margin-top: 14px; }
.dkm-deflist th, .dkm-deflist td { text-align: left; vertical-align: top; padding: 12px 0; border-bottom: 1px solid #F2EEE5; }
.dkm-deflist th { width: 38%; font-weight: 700; font-size: 14px; color: var(--dkm-soft); padding-right: 12px; }
.dkm-deflist tr:last-child th, .dkm-deflist tr:last-child td { border-bottom: none; }

/* 注意事項（最後まで読むとチェックできる） */
.dkm-notes {
  max-height: 240px; overflow-y: auto; background: #F5F2EA; border-radius: 14px;
  padding: 18px 20px; margin: 18px 0; font-size: 14px; line-height: 1.9;
}
.dkm-notes:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: 2px; }
.dkm-notes h4 { margin: 0 0 10px; font-size: 15px; }
.dkm-notes p { margin: 0 0 10px; }
.dkm-check-lock { opacity: .55; }
.dkm-check-lock:hover { border-color: var(--dkm-line); }

/* 予約内容の確認 */
.dkm-summary { background: #F5F2EA; border-radius: 14px; padding: 16px 18px; margin-bottom: 16px; }
.dkm-summary p { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 8px; font-size: 15px; }
.dkm-summary p:last-child { margin-bottom: 0; }
.dkm-summary span { color: var(--dkm-soft); }

/* 履歴の行 */
.dkm-histrow {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 14px;
  padding: 12px 0; border-bottom: 1px solid #F2EEE5;
}
.dkm-histrow:last-of-type { border-bottom: none; }
/* 第43弾：講師追加待ち */
.dkm-wl-card { border-left: 4px solid var(--dkm-accent); }
.dkm-wl-form h3 { margin-top: 0; }
.dkm-histrow .dkm-hint { display: block; margin: 2px 0 0; }
.dkm-delta { font-weight: 700; white-space: nowrap; }
.dkm-plus  { color: var(--dkm-primary); }
.dkm-minus { color: var(--dkm-soft); }

.dkm-ul { margin: 0 0 8px; padding-left: 1.3em; font-size: 14px; color: var(--dkm-soft); }
.dkm-ul li { margin-bottom: 6px; }
.dkm-inline-form { margin: 14px 0 0; }

@media (max-width: 600px) {
  .dkm-balance { padding: 20px 18px; border-radius: 16px; }
  .dkm-balance-n .n { font-size: 40px; }
  .dkm-deflist th { width: 42%; font-size: 13px; }
}

/* 会員ページ共通のナビゲーション */
.dkm-nav {
  display: flex; gap: 4px; background: #F2EEE5; border-radius: 999px;
  padding: 4px; margin: 0 0 18px; overflow-x: auto;
}
.dkm-nav a {
  flex: 1; text-align: center; white-space: nowrap;
  padding: 10px 14px; border-radius: 999px;
  font-size: 14px; font-weight: 700; text-decoration: none; color: var(--dkm-soft);
  transition: .15s;
}
.dkm-nav a:hover { color: var(--dkm-primary-dark); }
.dkm-nav a.on { background: #fff; color: var(--dkm-ink); box-shadow: 0 2px 10px rgba(46,58,56,.08); }
.dkm-nav a:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: 2px; }

@media (max-width: 420px) {
  .dkm-nav a { padding: 10px 10px; font-size: 13px; }
}

/* お知らせ */
.dkm-nav-badge {
  display: inline-block; margin-left: 5px; min-width: 18px; padding: 0 5px;
  border-radius: 999px; background: var(--dkm-danger); color: #fff;
  font-size: 11px; line-height: 18px; text-align: center; font-weight: 700;
}
.dkm-newsrow {
  display: block; background: #fff; border-radius: 16px; padding: 16px 18px;
  margin-bottom: 10px; box-shadow: 0 2px 14px rgba(46,58,56,.06);
  text-decoration: none; color: inherit; transition: .15s;
}
.dkm-newsrow:hover { background: var(--dkm-primary-soft); }
.dkm-newsrow.is-unread { box-shadow: inset 0 0 0 2px var(--dkm-primary), 0 2px 14px rgba(46,58,56,.06); }
.dkm-newsrow-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.dkm-newsrow-title { display: block; font-weight: 700; font-size: 15px; line-height: 1.7; }
.dkm-unread {
  display: inline-block; padding: 2px 9px; border-radius: 999px;
  background: var(--dkm-primary); color: #fff; font-size: 11px; font-weight: 700;
}
.dkm-news-body { margin-top: 16px; font-size: 15px; line-height: 1.9; }

/* ポイントの購入（第3弾） */
.dkm-buy-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0 18px;
}
.dkm-buy-opt {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 14px 10px; border-radius: 14px; cursor: pointer;
  background: #F5F2EA; box-shadow: inset 0 0 0 2px transparent;
  transition: .15s;
}
.dkm-buy-opt:hover { background: var(--dkm-primary-soft); }
/* ラジオは隠さずに残します。:has() が使えない環境でも、どれを選んだか分かるようにするためです */
.dkm-buy-opt input { width: 18px; height: 18px; margin: 0 0 2px; accent-color: var(--dkm-primary); }
.dkm-buy-opt:has(input:checked) {
  background: var(--dkm-primary-soft);
  box-shadow: inset 0 0 0 2px var(--dkm-primary);
}
.dkm-buy-pt { font-weight: 700; font-size: 16px; }
.dkm-buy-yen { font-size: 13px; color: var(--dkm-soft); }
.dkm-buy-total {
  margin: 4px 0 16px; padding: 14px 16px; border-radius: 14px;
  background: #F5F2EA; text-align: center; font-size: 15px;
}
.dkm-buy-total strong { font-size: 20px; }

@media (min-width: 560px) {
  .dkm-buy-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ============================================================
   参加の記録と、講師からのおたより（第10弾）／1.43.1 から「プランノート」
   ============================================================ */

.dkm-rec h3 { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.dkm-rec-sum {
  margin:10px 0 4px; padding:10px 14px; border-radius:12px;
  background:var(--dkm-primary-soft,#E3F0ED); color:var(--dkm-primary-dark,#2A6C64);
  font-size:.95rem;
}
.dkm-rec-sum strong { font-size:1.35rem; margin:0 2px; }
.dkm-rec-h {
  margin:22px 0 10px; padding-bottom:6px; font-size:1rem;
  border-bottom:2px solid var(--dkm-primary-soft,#E3F0ED);
  color:var(--dkm-primary-dark,#2A6C64);
}

/* 講師からのおたより */
.dkm-fb {
  position:relative; margin:0 0 12px; padding:14px 16px 14px 18px;
  background:var(--dkm-accent-soft,#FDF0DF); border-radius:12px;
}
.dkm-fb::before {
  content:""; position:absolute; left:0; top:10px; bottom:10px; width:4px;
  border-radius:99px; background:var(--dkm-accent,#EE9E45);
}
.dkm-fb-d { font-size:.8rem; color:var(--dkm-soft,#56605E); margin-bottom:6px; }
.dkm-fb-b { line-height:1.9; }

/* 1.43.1：プランノート（おたよりがページの中心。いちばん上に置く） */
.dkm-rec-main { margin:6px 0 18px; }
.dkm-rec-h.dkm-rec-h-main { margin-top:12px; font-size:1.1rem; }
.dkm-fb.is-new { box-shadow:0 0 0 2px var(--dkm-accent,#EE9E45) inset; }
.dkm-fb.is-new .dkm-fb-b { font-size:1.05rem; }
.dkm-fb-new {
  display:inline-block; margin-left:8px; padding:1px 9px; border-radius:999px;
  background:var(--dkm-accent,#EE9E45); color:#3B2A12; font-size:.75rem; font-weight:700;
  white-space:nowrap;
}
.dkm-fb-more { margin:4px 0 0; }
.dkm-fb-more > summary {
  cursor:pointer; padding:10px 4px; min-height:44px; box-sizing:border-box;
  color:var(--dkm-primary-dark,#2A6C64); font-weight:700;
}
.dkm-fb-more[open] > summary { margin-bottom:8px; }

/* 参加した回の表 */
.dkm-rec-t { width:100%; }
.dkm-rec-date { white-space:nowrap; }
.dkm-att {
  display:inline-block; padding:3px 11px; border-radius:999px;
  font-size:.82rem; font-weight:700; white-space:nowrap;
}
.dkm-att-ok     { background:var(--dkm-primary-soft,#E3F0ED); color:var(--dkm-primary-dark,#2A6C64); }
.dkm-att-absent { background:#F1EFE9; color:var(--dkm-soft,#56605E); }
.dkm-att-cancel { background:var(--dkm-danger-soft,#FBEAE5); color:var(--dkm-danger,#B04E36); }
.dkm-att-none   { background:#F5F3EE; color:var(--dkm-faint,#636F6C); }

@media (max-width:560px) {
  .dkm-rec-t thead { display:none; }
  .dkm-rec-t tr { display:block; padding:10px 0; border-bottom:1px solid var(--dkm-line,#E8E3D8); }
  .dkm-rec-t td { display:inline-block; border:0; padding:2px 10px 2px 0; }
  .dkm-rec-date { display:block !important; font-weight:700; }
}
.dkm-recmini-n { font-size:.95rem; color:var(--dkm-soft,#56605E); margin-bottom:12px; }
.dkm-recmini-n strong { font-size:1.35rem; color:var(--dkm-primary-dark,#2A6C64); margin:0 3px; }

/* 引き継ぎの同意欄・これまでご利用の方への案内 */
.dkm-consent-migrate {
  margin-top: 16px; padding: 14px 16px; border-radius: 12px;
  background: var(--dkm-accent-soft, #FDF0DF); border: 1px solid #F0D9B5;
}
.dkm-consent-migrate .dkm-hint { margin-top: 8px; }
.dkm-movelead { border-left: 5px solid var(--dkm-primary, #348279); }
.dkm-movelead p + p { margin-top: 12px; }

/* 二段階認証：確認コードの入力欄（第12弾） */
.dkm-code-input{
  width:100%;
  font-size:1.9rem;
  letter-spacing:.5em;
  text-align:center;
  padding:.6em .2em;
  font-variant-numeric:tabular-nums;
}

/* 二段階認証：送り直しは「押せる文字」。ボタンにするとログインと押し間違える */
.dkm-resend{ text-align:center; margin:.2rem 0 .1rem; }
.dkm-linkbtn{
  display:inline-block;
  background:none;
  border:0;
  padding:.35em .4em;
  font: inherit;
  font-size:.92rem;
  color:var(--dkm-primary);
  text-decoration:underline;
  text-underline-offset:.2em;
  cursor:pointer;
}
.dkm-linkbtn:hover, .dkm-linkbtn:focus-visible{ color:var(--dkm-primary-dark); }
.dkm-hint.dkm-center{ text-align:center; margin-top:0; }

/* ============================================================
   第14弾：入力を楽にする
   ============================================================ */

/* 押して選ぶ欄（学年・手帳）。プルダウンより指で選びやすい */
.dkm-choice{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.dkm-choice-item{
  position:relative;
  display:inline-flex;
}
.dkm-choice-item input{
  position:absolute;
  opacity:0;
  width:100%;
  height:100%;
  margin:0;
  cursor:pointer;
}
.dkm-choice-item span{
  display:inline-block;
  padding:.7em 1.1em;
  border:1.5px solid var(--dkm-line);
  border-radius:999px;
  background:var(--dkm-surface);
  color:var(--dkm-soft);
  font-size:.97rem;
  line-height:1.3;
  transition:background .15s, border-color .15s, color .15s;
  user-select:none;
}
.dkm-choice-item input:checked + span{
  background:var(--dkm-primary);
  border-color:var(--dkm-primary);
  color:#fff;
  font-weight:600;
}
.dkm-choice-item input:focus-visible + span{
  outline:2px solid var(--dkm-primary);
  outline-offset:2px;
}
@media (hover:hover){
  .dkm-choice-item input:not(:checked):hover + span{
    border-color:var(--dkm-primary);
    color:var(--dkm-primary);
  }
}

/* 郵便番号から住所が入ったときの合図 */
.dkm-zip-note:empty{ display:none; }
.dkm-input.dkm-filled{
  background:var(--dkm-primary-soft);
  transition:background .6s;
}

/* ============================================================
 * お知らせ掲示板（第19弾・どなたでも見られるもの）
 * テーマの色を使い、無いときは無難な色に落とします。
 * ============================================================ */
.dkm-board{ display:flex; flex-direction:column; gap:0; }
.dkm-board-item{
  padding:20px 0;
  border-top:1px solid var(--line, #E8E3D8);
}
.dkm-board-item:first-child{ border-top:0; }
.dkm-board-meta{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:.86rem; color:var(--ink-faint, #636F6C);
}
.dkm-board-tag{
  display:inline-block; padding:2px 10px; border-radius:999px;
  background:var(--accent-soft, #FDF0DF); color:var(--gym, #9B5F1D);
  font-size:.78rem; font-weight:700;
}
.dkm-board-title{
  margin:6px 0 8px; font-size:1.08rem; line-height:1.5;
  color:var(--ink, #2E3A38);
}
.dkm-board-body{ color:var(--ink-soft, #56605E); line-height:1.9; }
.dkm-board-body p{ margin:0 0 .8em; }
.dkm-board-body p:last-child{ margin-bottom:0; }
.dkm-board-item.is-important{
  background:var(--accent-soft, #FDF0DF);
  border-radius:var(--r-sm, 10px);
  padding:20px; margin:8px 0; border-top:0;
}
.dkm-board-item.is-important + .dkm-board-item{ border-top:0; }
.dkm-board-more{ margin-top:18px; }
.dkm-board-more a{ color:var(--primary, #348279); font-weight:700; }
.dkm-board-nav{
  display:flex; align-items:center; justify-content:center; gap:18px;
  margin-top:24px; font-size:.92rem;
}
.dkm-board-nav a{ color:var(--primary, #348279); font-weight:700; }
.dkm-board-nav span{ color:var(--ink-faint, #636F6C); }
@media (max-width:600px){
  .dkm-board-title{ font-size:1rem; }
}

/* ============================================================
 * お子さまの欄（兄弟をまとめて登録する）— 第22弾
 * ============================================================ */

/* Enterキーで「＋ お子さまを追加」が押されないようにするための、
   見えない送信ボタン。画面の外に置くだけで、機能は生きています。 */
.dkm-defsubmit{
  position:absolute; left:-9999px; width:1px; height:1px;
  padding:0; border:0; overflow:hidden;
}

.dkm-kidhead{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:12px; margin-bottom:6px;
}
.dkm-kidhead h2{ margin:0; }
.dkm-kidno{
  display:inline-block; margin-left:8px; padding:2px 10px; border-radius:999px;
  background:var(--dkm-primary-soft, #E3F0ED); color:var(--dkm-primary-dark, #26635C);
  font-size:.72rem; font-weight:700; vertical-align:middle;
}
.dkm-kiddel{ flex:none; font-size:.85rem; }
.dkm-kidadd{ text-align:center; }
.dkm-kidadd .dkm-hint{ margin-top:10px; }
.dkm-kidno-line{ margin:14px 0 2px; color:var(--dkm-soft, #56605E); }

/* ============================================================
 * 水泳・自転車のお申し込み（受注型）— 第23弾
 * ============================================================ */

.dkm-orderlead{ border-left:4px solid var(--dkm-accent, #EE9E45); }
.dkm-orderlead h3{ margin-top:0; }

.dkm-reqhead{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:8px;
}
.dkm-reqhead h3{ margin:0; }

.dkm-offer{ width:100%; border-collapse:collapse; margin:12px 0; }
.dkm-offer th{
  width:5.5em; text-align:left; vertical-align:top; padding:10px 8px 10px 0;
  color:var(--dkm-soft, #56605E); font-weight:700; font-size:.9rem;
  border-top:1px solid var(--dkm-line, #E8E3D8);
}
.dkm-offer td{
  padding:10px 0; border-top:1px solid var(--dkm-line, #E8E3D8); line-height:1.7;
}
.dkm-offer tr:first-child th, .dkm-offer tr:first-child td{ border-top:0; }

/* いまの目標（保護者にも見せる欄） */
.dkm-goal{
  background:var(--dkm-primary-soft, #E3F0ED);
  border-radius:10px; padding:14px 16px; margin:12px 0;
}
.dkm-goal-l{
  margin:0 0 4px; font-size:.8rem; font-weight:700;
  color:var(--dkm-primary-dark, #2A6C64);
}
.dkm-goal-b{ margin:0; line-height:1.8; }
.dkm-reqrow{ padding:10px 0; border-top:1px solid var(--dkm-line, #E8E3D8); }
.dkm-reqrow:first-child{ border-top:0; padding-top:0; }
.dkm-reqrow-t{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dkm-reqrow .dkm-hint{ margin:4px 0 0; }
.dkm-offer tr.is-off td, .dkm-offer tr.is-off th{ color:var(--dkm-faint, #636F6C); }
.dkm-offer tr.is-off strong{ text-decoration:line-through; font-weight:400; }

/* 第44弾：お試しポイント（残高のカードの内訳） */
.dkm-balance-trial{ font-size:.85rem; opacity:.9; }

/* ============================================================
 * 第45弾：運営チャット
 * ============================================================ */

/* 会員ページのボタン */
.dkm-chatbtn {
  display: block; background: var(--dkm-primary-soft); border: 1.5px solid var(--dkm-primary);
  border-radius: 18px; padding: 16px 18px; margin: 0 0 18px;
  text-decoration: none; color: var(--dkm-ink);
}
.dkm-chatbtn:hover { background: #D8E9E5; color: var(--dkm-ink); }
.dkm-chatbtn-t { display: block; font-weight: 700; font-size: 16px; color: var(--dkm-primary-dark); }
.dkm-chatbtn-s { display: block; font-size: 13px; color: var(--dkm-soft); margin-top: 2px; }
.dkm-chatbtn.is-unread { background: var(--dkm-accent-soft); border-color: var(--dkm-accent); }

/* やりとりの並び */
.dkm-chat { margin: 0 0 14px; }
.dkm-chat-intro { padding-bottom: 18px; }
.dkm-chat-day { text-align: center; margin: 16px 0 10px; }
.dkm-chat-day span {
  display: inline-block; background: #EDE8DC; color: var(--dkm-faint);
  border-radius: 999px; padding: 2px 12px; font-size: 12px; font-weight: 700;
}
.dkm-msg { max-width: 86%; margin: 0 0 12px; }
.dkm-msg-you { margin-right: auto; }
.dkm-msg-me { margin-left: auto; }
.dkm-msg-who { font-size: 12px; color: var(--dkm-faint); margin: 0 0 3px; font-weight: 700; }
.dkm-msg-me .dkm-msg-who { text-align: right; }
.dkm-msg-b {
  background: #fff; border: 1.5px solid var(--dkm-line); border-radius: 18px;
  padding: 12px 15px; box-shadow: 0 2px 10px rgba(46,58,56,.05);
}
.dkm-msg-me .dkm-msg-b { background: var(--dkm-primary-soft); border-color: var(--dkm-primary-soft); }
.dkm-msg-auto .dkm-msg-b { background: #F6F4EC; }
.dkm-msg-x { margin: 0; line-height: 1.85; word-break: break-word; }
.dkm-msg-tag {
  margin: 0 0 6px; font-size: 12px; font-weight: 700; color: var(--dkm-primary-dark);
  background: #fff; border: 1px solid var(--dkm-primary); border-radius: 999px;
  display: inline-block; padding: 1px 10px;
}
.dkm-msg-link { margin: 8px 0 0; font-size: 13px; }
.dkm-msg-t { font-size: 11px; color: var(--dkm-faint); margin: 3px 2px 0; }
.dkm-msg-me .dkm-msg-t { text-align: right; }
.dkm-chat-more { text-align: center; font-size: 14px; margin: 0 0 12px; }
.dkm-chat-newbar {
  position: sticky; bottom: 8px; text-align: center; font-size: 14px; font-weight: 700;
  background: var(--dkm-accent-soft); border: 1.5px solid var(--dkm-accent);
  border-radius: 999px; padding: 8px 14px; margin: 0 0 12px;
}
.dkm-chat-form textarea { min-height: 110px; }
.dkm-chat-form .dkm-btn { margin-top: 12px; }
.dkm-request-chatnote { margin: 0 0 14px; line-height: 1.8; }

/* ============================================================
 * 第46弾：開催カレンダーの「月の表」（運営管理のカレンダーと同じ形）
 *   札の色と言葉は、下の一覧の札（.dkm-state-*）と同じ意味。どの札にも文字を添える（色だけに頼らない）
 * ============================================================ */

/* 読み上げ専用（画面には出さない） */
.dkm-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.dkm-mcal { margin: 0 0 8px; scroll-margin-top: 80px; }   /* 上に固定の見出し（ヘッダー）があるため */
.dkm-day { scroll-margin-top: 80px; }                        /* 「ほか N 件」の飛び先（下の一覧のその日） */
/* 第三者チェック：キーボードで戻ったとき、札が固定の見出しの下に隠れないように（この画面だけ）。
   :has が使えるブラウザでは、ページ全体に余白を持たせ、飛び先ごとの余白は外す（二重にならないように） */
@supports selector(:has(*)) {
  html:has(.dkm-mcal) { scroll-padding-top: 80px; }
  .dkm-mcal, .dkm-day { scroll-margin-top: 0; }
}
.dkm-mcal-bar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  gap: 8px; margin: 0 0 8px;
}
.dkm-mcal-prev { justify-self: start; }
.dkm-mcal-next { justify-self: end; }
.dkm-mcal-bar .dkm-btn-sm { min-height: 44px; padding: 0 16px; font-size: 14px; white-space: nowrap; }
.dkm-mcal-title { margin: 0; font-size: 18px; text-align: center; white-space: nowrap; }
.dkm-mcal-empty {
  margin: 0 0 8px; padding: 10px 14px; border-radius: 12px; font-size: 14px; line-height: 1.7;
  background: var(--dkm-accent-soft); color: #7A4A0E;
}
.dkm-mcal-empty a { margin-left: 6px; font-weight: 700; color: var(--dkm-primary-dark); }

/* 表（とても狭い画面では、読めないほど縮めずに横へすべらせる） */
.dkm-mcal-scroll { overflow-x: auto; }
.dkm-mcal-t {
  width: 100%; min-width: 280px; table-layout: fixed; border-collapse: separate; border-spacing: 4px;
  line-height: 1.3; margin: 0;
}
.dkm-mcal-t th {
  font-size: 12px; font-weight: 700; color: var(--dkm-faint); text-align: center;
  padding: 0 0 1px; background: none; border: 0;
}
.dkm-mcal-t th.sun { color: #B04E36; }
.dkm-mcal-t th.sat { color: #3B7290; }
.dkm-mcal-t td {
  vertical-align: top; height: 78px; padding: 3px; box-sizing: border-box;
  background: #fff; border: 1px solid var(--dkm-line); border-radius: 10px;
  font-size: 12px; overflow: hidden;
  word-break: normal; overflow-wrap: anywhere; text-wrap: wrap;   /* テーマの word-break:auto-phrase（td）で、せまい欄からはみ出さないように */
}
.dkm-mcal-t td.is-empty { background: transparent; border-color: transparent; }
.dkm-mcal-t td.is-past { background: #F6F4EE; border-color: #EFEBE2; }
.dkm-mcal-t td.is-past .n { font-weight: 400; color: var(--dkm-faint); }
/* 今日：枠は outline で（Windows のハイコントラストでも消えない） */
.dkm-mcal-t td.is-today { background: #F3FAF8; border-color: var(--dkm-primary); outline: 2px solid var(--dkm-primary); outline-offset: -2px; }
.dkm-mcal-t .n { display: block; font-weight: 700; font-size: 13px; line-height: 1.2; color: var(--dkm-ink); }
.dkm-mcal-t td.sun .n { color: #B04E36; }
.dkm-mcal-t td.sat .n { color: #3B7290; }

/* 回の札（押すと開催の詳細へ） */
.dkm-mcal-p {
  display: block; margin: 3px 0 0; padding: 2px 4px; border-radius: 6px;
  border: 1px solid transparent; font-size: 12px; font-weight: 700; line-height: 1.35;
  text-decoration: none; color: var(--dkm-ink);
}
.dkm-mcal-p .pt, .dkm-mcal-p .pn { white-space: nowrap; }   /* 「運/動」のように言葉の途中で折り返さない（折り返すなら時刻と内容のあいだ） */
.dkm-mcal-p .pn { display: inline-block; font-weight: 400; }   /* 時刻とのあいだは空白1つ（折り返したときに字下げにならない） */
.dkm-mcal-p .ps { display: block; }
.dkm-mcal-p .ps-s { display: none; }
a.dkm-mcal-p:hover { text-decoration: underline; }
a.dkm-mcal-p:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: -2px; }
.dkm-mcal-p.is-open      { background: #E3F0ED; color: #1F5A53; border-color: #B5D9D2; }
.dkm-mcal-p.is-few       { background: #FDF0DF; color: #7A4A0E; border-color: #F2C992; }
.dkm-mcal-p.is-full      { background: #F2EEE5; color: #4A5351; border-color: #D8D0BE; }
/* 講師追加待ちに登録できる満員の回（黄緑）：色のほかに点線の枠でも見分ける。第58弾から言葉は「A枠 満員／B枠 残りN」、スマホは「B残N」 */
.dkm-mcal-p.is-wl        { background: #E3F1C4; color: #35590F; border: 1px dashed #5E8A22; }
.dkm-mcal-p.is-closed    { background: #ECEEEE; color: #525C5A; border-color: #D3D8D7; }
.dkm-mcal-p.is-cancelled { background: #FBEAE5; color: #9A3F2B; border-color: #EDBBAE; }
/* 「ほか N 件」：押しやすい高さ（24px）にし、キーボードの枠が欄で切れないよう内側に描く */
.dkm-mcal-more {
  display: flex; flex-wrap: wrap; align-content: center; justify-content: center; min-height: 24px; margin: 4px 0 0; padding: 0 2px;
  border-radius: 6px; font-size: 11px; font-weight: 700; line-height: 1.2; color: var(--dkm-primary-dark);
}
.dkm-mcal-more > span { white-space: nowrap; }   /* 折り返すなら「ほか／1件」（「ほか1／件」にしない） */
.dkm-mcal-more:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: -3px; }

/* 色の見かた */
.dkm-mcal-lgh { margin: 10px 0 0; font-size: 12px; font-weight: 700; color: var(--dkm-faint); }
.dkm-mcal-legend { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 4px 0 0; }
.dkm-mcal-legend li { margin: 0; }
.dkm-mcal-legend .dkm-mcal-p { display: inline-block; margin: 0; padding: 1px 8px; font-size: 12px; border-radius: 3px; }
.dkm-mcal .dkm-hint { margin-top: 6px; }

/* 下の「日にちごとの一覧」 */
.dkm-mcal-listh { font-size: 16px; margin: 28px 0 0; padding-top: 18px; border-top: 1px solid var(--dkm-line); }
.dkm-mcal-listr { margin: 2px 0 0; }
.dkm-mcal-listr + .dkm-month { margin-top: 12px; }

/* スマホ（と、640px より狭い画面）：7列に収めるため、札は「時刻・内容・状態」を縦に並べ、状態は短い言葉にする
   （第三者チェック：561〜639px で「のこり1／名」のように言葉の途中で折れていたので、切り替えを 639px に） */
@media (max-width: 639px) {
  .dkm-mcal-bar .dkm-btn-sm { padding: 0 12px; font-size: 13px; }
  .dkm-mcal-title { font-size: 16px; }
  .dkm-mcal-t { border-spacing: 2px; }
  .dkm-mcal-t th { font-size: 11px; }
  .dkm-mcal-t td { height: 62px; padding: 2px; border-radius: 7px; }
  .dkm-mcal-t .n { font-size: 12px; padding-left: 1px; }
  .dkm-mcal-p { padding: 2px 0; font-size: 11px; line-height: 1.28; text-align: center; letter-spacing: -.02em; border-radius: 5px; }
  .dkm-mcal-p .pt, .dkm-mcal-p .pn { display: block; margin: 0; }
  .dkm-mcal-p .ps-l { display: none; }
  .dkm-mcal-p .ps-s { display: block; }
  .dkm-mcal-more { font-size: 10.5px; }
  .dkm-mcal-legend .dkm-mcal-p { font-size: 11.5px; }
}
@media (max-width: 389px) {
  .dkm-mcal-p { font-size: 10.5px; }
}
/* とても狭い画面（iPhone SE の第1世代・拡大表示・ページの拡大）：すき間を詰め、文字を少し小さく */
@media (max-width: 340px) {
  .dkm-mcal-t { border-spacing: 1px; }
  .dkm-mcal-t td { padding: 1px; border-radius: 6px; }
  .dkm-mcal-p { font-size: 9.5px; letter-spacing: -.04em; }
  .dkm-mcal-more { font-size: 9.5px; }
  .dkm-mcal-bar { gap: 4px; }
  .dkm-mcal-bar .dkm-btn-sm { padding: 0 8px; }
}
/* さらに狭いとき：月のボタンが並ばないので、月の名前を上の段に */
@media (max-width: 300px) {
  .dkm-mcal-bar { grid-template-columns: 1fr 1fr; }
  .dkm-mcal-title { grid-column: 1 / -1; grid-row: 1; }
}

/* ============================================================
   第47弾：開催の詳細の「内容」「持ち物」「服装」（長い文の行）
   スマホの幅では、見出しの列（42%）に押し込まれて1行11字ほどになるので、見出しを上・文を下の全幅にする。
   表（table）のままだと、1つの行だけ見出しと文を縦に並べられない（列が合わなくなり、表が画面からはみ出す）ので、
   この幅では表をやめて、ふつうの行は「見出し 42%｜文」の横並び、長い文の行は縦並びにする（この表は開催の詳細だけで使う）
   ============================================================ */
.dkm-deflist tr.is-long td { line-height: 1.8; }
@media (max-width: 560px) {
  .dkm-deflist, .dkm-deflist tbody { display: block; width: 100%; }
  .dkm-deflist tr { display: flex; align-items: flex-start; border-bottom: 1px solid #F2EEE5; }
  .dkm-deflist tr:last-child { border-bottom: none; }
  .dkm-deflist th, .dkm-deflist td { border-bottom: none; }
  .dkm-deflist th { flex: 0 0 42%; width: auto; }
  .dkm-deflist td { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
  .dkm-deflist tr.is-long { display: block; }
  .dkm-deflist tr.is-long th, .dkm-deflist tr.is-long td { display: block; width: auto; }
  .dkm-deflist tr.is-long th { padding: 12px 0 2px; }
  .dkm-deflist tr.is-long td { padding: 0 0 12px; }
}

/* 第48弾（1.41.0）：お申し込みの流れ（ご提案・確定・取り消し）の吹き出し */
.dkm-msg-flow .dkm-msg-b { border-color: var(--dkm-primary); }
.dkm-msg-flow .dkm-msg-x { font-size: 14.5px; }

/* ============================================================
   第49弾：運営管理から移されてきたログインの画面（need=staff）では、上の帯の「会員ログイン」「新規会員申請」を出さない
   ============================================================ */
.dkm-need-staff .site-head .head-actions { display: none; }

/* ============================================================
   第50弾：水泳・自転車のお申し込み — 回数・カレンダー・使いたい施設（order.js が描く）
   灰色＝先生の都合がつかない（押せない）。橙＝選んだ候補。
   ============================================================ */
.dkm-order [hidden] { display: none !important; }
.dkm-order-mhead { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 6px 0 8px; }
.dkm-order-mhead strong { font-size: 16px; }
.dkm-order-nav {
  min-height: 44px; min-width: 76px; padding: 6px 10px; font: inherit; font-size: 14px;
  border: 1.5px solid var(--dkm-line); border-radius: 12px; background: #fff; color: var(--dkm-ink); cursor: pointer;
}
.dkm-order-nav:disabled { opacity: .35; cursor: default; }
.dkm-order-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.dkm-order-dow { text-align: center; font-size: 12px; color: var(--dkm-faint); }
.dkm-order-dow.is-sun { color: #C0392B; } .dkm-order-dow.is-sat { color: #2F6DB5; }
.dkm-order-day {
  position: relative; min-height: 48px; padding: 4px 0; border-radius: 10px;
  border: 1.5px solid var(--dkm-line); background: #fff; color: var(--dkm-ink);
  font: inherit; font-size: 15px; line-height: 1.2; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.dkm-order-day .s { font-size: 11px; color: var(--dkm-primary-dark); margin-top: 2px; letter-spacing: -.02em; }
.dkm-order-day.is-sun { color: #C0392B; } .dkm-order-day.is-sat { color: #2F6DB5; }
.dkm-order-day.is-off { background: #ECEEEC; border-color: #ECEEEC; color: #9AA29F; cursor: default; }
.dkm-order-day.is-off .s { color: #9AA29F; }
.dkm-order-day.is-sel { box-shadow: inset 0 0 0 3px var(--dkm-primary); }
.dkm-order-day:focus-visible, .dkm-order-slot:focus-visible, .dkm-order-nav:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: 2px; }
.dkm-order-day .dot {
  position: absolute; top: 3px; right: 4px; min-width: 16px; height: 16px; padding: 0 3px;
  border-radius: 8px; background: var(--dkm-accent); color: #fff; font-size: 10px; line-height: 16px;
}
.dkm-order-blank { display: block; }
.dkm-order-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--dkm-faint); margin: 8px 0 0; }
.dkm-order-legend i { display: inline-block; width: 13px; height: 13px; border-radius: 4px; vertical-align: -2px; margin-right: 4px; border: 1px solid var(--dkm-line); }
.dkm-order-legend .k-ok { background: #fff; } .dkm-order-legend .k-off { background: #ECEEEC; border-color: #ECEEEC; }
.dkm-order-legend .k-dot { background: var(--dkm-accent); border-color: var(--dkm-accent); border-radius: 7px; }
.dkm-order-dayp { margin-top: 12px; padding: 14px 12px; border: 1.5px solid var(--dkm-line); border-radius: 14px; background: #FDFCF9; }
.dkm-order-dayp:focus { outline: none; }
.dkm-order-dayp h4 { margin: 0 0 8px; font-size: 15px; }
.dkm-order-bar { position: relative; height: 26px; border-radius: 8px; background: #ECEEEC; overflow: hidden; }
.dkm-order-bar .f { position: absolute; top: 0; bottom: 0; background: #CBE6DF; }
.dkm-order-bar .p { position: absolute; top: 0; bottom: 0; background: var(--dkm-accent); opacity: .9; }
.dkm-order-ax { display: flex; justify-content: space-between; gap: 6px; font-size: 11px; color: var(--dkm-faint); margin-top: 2px; }
.dkm-order-ax .lg { text-align: center; }
.dkm-order-lead { font-size: 14px; margin: 10px 0 6px; }
.dkm-order-hrow { display: grid; grid-template-columns: 40px repeat(4, minmax(0, 1fr)); gap: 5px; margin-bottom: 5px; align-items: center; }
.dkm-order-hrow .h { font-size: 14px; font-weight: 700; text-align: right; padding-right: 4px; }
.dkm-order-slot {
  min-height: 44px; padding: 6px 0; border-radius: 10px; border: 1.5px solid var(--dkm-line);
  background: #fff; color: var(--dkm-ink); font: inherit; font-size: 14px; cursor: pointer;
}
.dkm-order-slot.is-off { background: #ECEEEC; border-color: #ECEEEC; color: #9AA29F; text-decoration: line-through; cursor: default; }
.dkm-order-slot.is-on { border-color: var(--dkm-accent); background: var(--dkm-accent-soft); font-weight: 700; }
.dkm-order-none { display: block; }
.dkm-order-mine { font-size: 14px; margin: 8px 0 0; }
.dkm-order-picked { margin-top: 12px; }
.dkm-order-sum { background: var(--dkm-primary-soft); border-radius: 12px; padding: 10px 12px; font-size: 14px; }
.dkm-order-sum strong { font-size: 16px; }
.dkm-order-warn, .dkm-order-msg { margin: 8px 0 0; font-size: 14px; }
.dkm-order-list { list-style: none; margin: 8px 0 0; padding: 0; }
.dkm-order-list li { display: flex; align-items: center; gap: 8px; border: 1.5px solid var(--dkm-line); border-radius: 12px; padding: 6px 10px; margin-bottom: 6px; background: #fff; }
.dkm-order-list .lab { flex: none; font-size: 12px; background: var(--dkm-accent); color: #fff; border-radius: 6px; padding: 1px 7px; }
.dkm-order-list .t { flex: 1; font-size: 14px; }
.dkm-order-rm {
  flex: none; min-height: 40px; padding: 4px 12px; font: inherit; font-size: 13px; border-radius: 10px;
  border: 1.5px solid var(--dkm-line); background: #fff; color: var(--dkm-soft); cursor: pointer;
}
.dkm-order-rm:focus-visible, .dkm-order-back:focus-visible { outline: 3px solid var(--dkm-accent); outline-offset: 2px; }
.dkm-order-back {
  display: block; width: 100%; min-height: 44px; margin-top: 10px; font: inherit; font-size: 14px; border-radius: 12px;
  border: 1.5px solid var(--dkm-line); background: #fff; color: var(--dkm-primary-dark); cursor: pointer;
}
.dkm-order-sticky {
  position: sticky; bottom: 8px; z-index: 5; margin: 10px 0 0; padding: 8px 12px; border-radius: 12px;
  background: var(--dkm-primary-dark); color: #fff; font-size: 14px; font-weight: 700; text-align: center;
  box-shadow: 0 4px 14px rgba(46,58,56,.18);
}
.dkm-order-soft { margin: 6px 0 0; }
.dkm-order-pnote { color: var(--dkm-primary-dark); font-weight: 700; }
.dkm-order-count .dkm-choice { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.dkm-order-count .dkm-choice-item { margin: 0; }
.dkm-order-count .dkm-choice-item span { display: block; width: 100%; text-align: center; padding-left: .2em; padding-right: .2em; white-space: nowrap; }
.dkm-order-sent { margin: 8px 0 0; font-size: 14px; }
.dkm-order-sent summary { cursor: pointer; color: var(--dkm-primary-dark); min-height: 44px; display: flex; align-items: center; }
.dkm-order-sent p { margin: 4px 0 0; padding: 10px 12px; background: #FBFAF6; border-radius: 10px; }
.dkm-order-other { margin-top: 8px; }
.dkm-order-mnote { margin-top: 6px; }
.dkm-order-dayp { padding-bottom: 18px; margin-bottom: 52px; }   /* 画面の下のまとめの帯に、いちばん下の時刻が隠れないように */

/* 1.43.1：スマホの「追加希望」（4文字）を語の途中で折らない（ほかの短い言葉は3文字まで） */
.dkm-mcal-p.is-wl .ps-s { white-space: nowrap; font-size: .84em; letter-spacing: -.06em; }

/* 1.43.2：お申し込みのカレンダーの注意書き（先生の都合は1か月前に確認したもの） */
.dkm-order-caution {
  margin: 8px 0 12px; padding: 12px 14px 12px 16px;
  background: var(--dkm-accent-soft, #FDF0DF); border: 1.5px solid var(--dkm-accent, #EE9E45);
  border-left-width: 6px; border-radius: 12px; color: #5A3A0E; line-height: 1.75;
}
.dkm-order-caution p { margin: 0; }
.dkm-order-caution .dkm-order-caution-h { font-weight: 700; color: #8F5A15; margin-bottom: 4px; }
.dkm-order-caution-h::before { content: "！"; content: "！" / ""; display: inline-block; margin-right: 6px; width: 1.4em; height: 1.4em; line-height: 1.4em;
  text-align: center; border-radius: 50%; background: var(--dkm-accent, #EE9E45); color: #3B2A12; font-size: .85em; }
.dkm-order-caution strong { color: #7A4A0E; }
@media (max-width: 420px) {
  .dkm-order-caution { font-size: 14.5px; padding: 10px 12px 10px 13px; }
}

/* ============================================================
 * 第55弾（1.44.0）：保護者の画面のチャットにも、送り主の名札（運営 ◯◯・講師 ◯◯）
 *   運営の画面（staff.css）と同じ見た目。かっこは読み上げ用（.dkm-sr）
 * ============================================================ */
.dkm-msg-who-staff { font-size: 13px; color: var(--dkm-ink); margin: 0 0 4px; font-weight: 400; }
.dkm-msg-who-staff .dkm-msg-role { color: var(--dkm-faint); font-weight: 700; margin-right: 6px; }
.dkm-msg-who-staff .dkm-msg-by {
  display: inline-block; padding: 1px 10px; border-radius: 999px;
  background: #2f6f4f; color: #fff; font-weight: 700; line-height: 1.7; font-size: 12px;
}
.dkm-msg-who-staff .dkm-msg-by.is-auto { background: #EFE8D2; color: #5b4a17; }

/* ============================================================
 * 第56弾（1.45.0）：会員メニューを 4列×2段のマス目に（運営のメニュー .dkm-nav-staff は変えない）
 *   会員ページの幅は 640px まで（.dkm-app）。1マス約150px なので、アイコンを上・文字を下に置く
 *   パソコン：文字は1行（13px）
 *   スマホ（640px 以下）：12px。長い名前は決めた所（<wbr>）でだけ2行に（keep-all）
 * ============================================================ */
.dkm-nav.dkm-nav-member {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px;
  border-radius: 22px; padding: 6px; overflow: visible;
}
.dkm-nav.dkm-nav-member a {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 62px; padding: 8px 4px; border-radius: 14px; white-space: nowrap;
  font-size: 13px; line-height: 1.3; text-align: center; min-width: 0;
}
.dkm-nav.dkm-nav-member a:hover { background: rgba(255,255,255,.6); }
.dkm-nav.dkm-nav-member a.on { background: #fff; color: var(--dkm-primary); }
.dkm-nav-member .dkm-nav-i {
  width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.dkm-nav-member .dkm-nav-badge { position: absolute; top: 4px; right: 6px; margin-left: 0; }
@media (max-width: 640px) {
  .dkm-nav.dkm-nav-member { gap: 4px; padding: 5px; border-radius: 18px; }
  .dkm-nav.dkm-nav-member a {
    gap: 3px; min-height: 62px; padding: 7px 2px;
    font-size: 12px; white-space: normal; word-break: keep-all; overflow-wrap: normal; letter-spacing: -.02em;
  }
  .dkm-nav-member .dkm-nav-badge { top: 2px; right: 2px; }
}
/* とても狭いスマホ（374px 以下。1マス約64px）：「プランノート」が1行に入るよう、すき間と字を少し詰める */
@media (max-width: 374px) {
  .dkm-nav.dkm-nav-member { gap: 3px; padding: 4px; }
  .dkm-nav.dkm-nav-member a { padding: 7px 0; font-size: 11px; letter-spacing: -.06em; }
}

/* 第56弾：運動療育以外の支援 */
.dkm-support h3 { margin-top: 0; }
.dkm-support p { line-height: 1.9; margin: 0 0 .9em; }
.dkm-support p:last-child { margin-bottom: 0; }

/* 第57弾（1.45.1）：運営のご紹介 — 埋め込んだお知らせ */
.dkm-support-news-l { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--dkm-primary); }
.dkm-support-news .dkm-news-body { line-height: 1.9; overflow-wrap: anywhere; }
.dkm-support-h { margin-top: 28px; }

/* 第58弾（1.46.0）：A枠・B枠（B枠＝講師追加）
   - 月の表：「A枠 満員／」「B枠 残り3」は折り返すならその間で。スマホは「B残3」「A残2」（短いので 1.43.1 の縮めは戻す） */
.dkm-mcal-p .ps-ab { display: inline-block; white-space: nowrap; }
.dkm-mcal-p.is-wl .ps-s { font-size: inherit; letter-spacing: inherit; }
.dkm-mcal-ab { margin: 8px 0 0; padding: 10px 12px; background: #FBFAF6; border-radius: 10px; font-size: 13px; line-height: 1.7; }
.dkm-mcal-ab p { margin: 0 0 4px; }
.dkm-mcal-ab p:last-child { margin-bottom: 0; }
/* 開催のページの「空き状況」：A枠とB枠を1行ずつ */
.dkm-ab-cell .dkm-ab-line { display: block; }
.dkm-wl-bleft { margin: 6px 0; padding: 8px 12px; background: #E3F1C4; color: #35590F; border: 1px dashed #5E8A22; border-radius: 10px; font-size: 15px; }

/* 1.46.1：B枠（講師追加待ち）の図（依頼者が作った図をそのまま出す） */
.dkm-wlg { margin: 14px 0 0; }
.dkm-wlg-a { display: block; border-radius: 14px; overflow: hidden; border: 1px solid var(--dkm-line); background: #fff; }
.dkm-wlg-img { display: block; width: 100%; height: auto; }
.dkm-wlg-cap { margin: 6px 0 0; font-size: 13px; text-align: right; }
.dkm-wlg-add { margin: 8px 0 0; padding: 8px 12px; border-radius: 10px; background: var(--dkm-primary-soft); font-size: 13.5px; line-height: 1.7; color: var(--dkm-ink); }
.dkm-wl-form .dkm-wlg { margin: 10px 0 12px; }