/* =================================================================
   長崎ITクリニック — デザインシステム v2「Aerra」（ds.css）
   使うページ：トップ（index.html）・IT健康診断（shindan.html）・科のページ（dept.html）・専門家の一覧（doctors.html）・
   出張講座（kouza.html）・講座の案内のLINE受け取り（kouza-line.html）・予約（yoyaku.html）・
   長崎ITスキルLab.（lab.html・lab-student.html）・専門家の申請（doctor-apply.html）・
   精密検査（shindan-data.html・shindan-infra.html）・提供事業者（provider.html）・プライバシーポリシー（privacy.html）・
   学びの冒険の外枠（game.html）・LP の入口（lp/index.html）。
   第3弾（2026-09-29）で切り替えを終えた。移さないページ（lp/ のほかの LP・院内ツアー・komine-project・admin・
   security-free・security-kit・doctor-ai）は今のまま（style.css だけ）。

   ■ 決まり
   ・色：ブランドのまま（紺とクリニカルブルー）。新しい色は足さない。
         使うのは style.css のトークンと、半透明の白・黒・紺のトークンだけ。
   ・書体：見出しは明朝（Shippori Mincho）、本文は Noto Sans JP、数字は Figtree。書体を足さない。
   ・文字の大きさ：決められた段（xs・sm・base・md・lg・xl・2xl・num・display）だけを使う。
         強弱は大きさで付け、太さに頼らない。
   ・余白：決められた段（8・12・16・24・32・48・64・96px と、画面の端・節の上下）だけを使う。
   ・角：0・6px・8px・10px だけ。丸い端は、押せるボタンだけ。
   ・線：区切りは 1px の細い線（黒10%）。紺の地の上は白の薄い線。色の太い帯は使わない。
   ・影：使わない。指を乗せても浮かせない（変えるのは色と線だけ）。
   ・面：浮いた部品は「すりガラス」（.ds-glass）。ぼかしが使えない端末と
         「透明度を下げる」設定では、不透明な白にする。
   ・写真：写真が主役。暗くするのは写真（スクリム）で、紺の帯は作らない。
         写真の上の文字は平行移動させず、ぼかしから澄んで現れる。
   ・動き：長さは fast（0.15秒）・base（0.24秒）・slow（0.6秒）、緩急は ease。秒数を直接書かない。
         「動きを減らす」設定では、すぐに最後の状態にして揺れを止める。
         ずっと続く動きは、木漏れ日の影だけ。
   ・使わないもの：カードの格子・アイコンの台座・丸数字・ピル型の札・英字の小見出し・
         グラデーション（写真のスクリムを除く）・光る演出・絵文字・文字の矢印・イラスト・キャラクター。

   ■ 書き方
   ・規則はすべて body.ds から書き始める（ほかのページに漏らさないため）。
   ・新しい部品の名前は ds- で始める。動き（@keyframes）の名前も ds- で始める。
   ・トークンはこのファイルで定義し直さない（トークンは style.css の冒頭の定義だけ）。
     このファイルの中だけで使う変数は、名前を ds- で始める。
   ・学びの冒険（game.html）と共有するクラス（レーダー・簡易処方箋など）は、#shindan-app の中だけに効く書き方にする。
   ・JS が描く中身と、その入れ物には .reveal を付けない（描いたあとで見えないまま残らないように）。
   ・第2弾のページの部品は、そのページの入れ物の id（#kouza-list・#event-apply・#booking・#kl-card・#apply-form・#lab-status-list など）か、
     新しい ds- の部品で絞って書く（トップと第1弾のページに漏らさない）。
   ・フォームの .quiz-card・.quiz-wrap は、クラス名ではなくフォームや入れ物の id で指す（.quiz- を書くのは #shindan-app・#shindan-data-app・#shindan-infra-app と #soudan だけ）。
   ・第3弾のページの部品は、ページの目印（body.ds.ds-seimitsu・.ds-legal・.ds-provider・.ds-game・.ds-lp）か、
     入れ物の id（#shindan-data-app・#shindan-infra-app など）で絞って書く（ほかのページに漏らさない）。
   ・学びの冒険の中（#game-root・重ね画面・知らせ）には ds の見た目を当てない。当たってしまう所は、
     body.ds.ds-game とゲームの入れ物で絞った「今の見た目に戻す」規則だけで打ち消す（技術ブリーフ O-5）。
   ・学びの冒険（game.html）の外枠は body.ds.ds-game で書く。ゲームの中を今の見た目に戻す規則は、
     body.ds.ds-game とゲームの入れ物（#game-root・.game-modal・.g-toast）の両方で絞り、
     値は style.css・game.css の今の値をそのまま写す（tests/ds-pages3-game.test.mjs が照合する）。

   ■ ほかのページを切り替える手順
   1. そのページの body に class="ds" を付ける。
   2. head で style.css の直後に ds.css を読む（lp/ など下のフォルダのページは /assets/css/ds.css）。
   3. 英字の小見出しを和文の小見出し（.ds-kicker）に、カードの並びを罫線の行・段組みに置き換える。
   4. 写真を足すときは tools/ の変換スクリプトで WebP（1枚 500KB 以下）にする。
   5. そのページのテストに、この決まり（影・グラデーション・英字・イラストが無いこと）を足す。
   ================================================================= */

/* 画面の幅の決め方（技術ブリーフ UI-3）
   N＝写真の節を縦長の組み方にする：(max-width: 760px), (orientation: portrait), (max-height: 520px)
   T＝左右の分割を1列にする：(max-width: 1024px)
   M＝一覧を縦に積む：(max-width: 760px)
   NAV＝ナビをボタンで開閉する：(max-width: 1240px), (max-width: 77.5em)
        （77.5em は既定の文字の大きさ 16px で 1240px。文字を大きくする設定では、もっと広い画面でも畳んで1行に保つ）
   本文の列は最大 1440px。ヘッダーの院名・ヒーローの見出し・各節の左端を同じ線にそろえる。 */

/* ---------- 土台 ---------- */
body.ds { background: var(--color-surface); letter-spacing: .02em; word-break: auto-phrase; }
body.ds h1, body.ds h2, body.ds h3, body.ds h4 {
  font-family: var(--font-display); font-weight: 600; letter-spacing: .04em; line-height: 1.45;
  font-feature-settings: "palt"; word-break: auto-phrase;
}
body.ds main [id], body.ds #news { scroll-margin-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-5)); }
body.ds .skip-link { z-index: var(--z-skip); }
body.ds .container { max-width: 1440px; padding-inline: calc(var(--sp-edge) + var(--sp-4)); }

/* ---------- 節の枠 ---------- */
body.ds .ds-section { padding-block: var(--sp-section); }
body.ds .ds-section--tint { background: var(--color-background); }
body.ds .ds-section--ruled { padding-top: 0; }
body.ds .ds-section--ruled > .container > :first-child { border-top: 1px solid var(--glass-line); padding-top: var(--sp-section); }

/* ---------- 小見出し（2桁の番号＋細い線＋和文） ---------- */
body.ds .ds-kicker {
  display: flex; align-items: baseline; gap: var(--sp-3);
  margin: 0 0 var(--sp-4);
  font-size: var(--fs-xs); letter-spacing: .12em; line-height: 1.6; color: var(--color-muted-fg);
}
body.ds .ds-kicker__no { font-family: var(--font-head); font-variant-numeric: tabular-nums; letter-spacing: .08em; color: var(--color-accent-strong); }
body.ds .ds-kicker__no::after {
  content: ""; display: inline-block; vertical-align: middle;
  width: var(--sp-5); height: 1px; margin-left: var(--sp-3); background: currentColor;
}

/* ---------- 見出しと文字 ---------- */
body.ds .ds-head { max-width: var(--w-copy); margin-bottom: var(--sp-7); }
body.ds .ds-head--wide { max-width: none; }
body.ds .ds-head--wide .ds-lead { max-width: var(--w-copy); }
body.ds .ds-split > .ds-head, body.ds .ds-flow__body > .ds-head { margin-bottom: 0; }
body.ds .ds-h1 { font-size: var(--fs-display); line-height: 1.35; }
body.ds .ds-h2, body.ds #news .h-section { font-size: var(--fs-xl); line-height: 1.4; }
body.ds .ds-h3 { font-size: var(--fs-lg); }
body.ds .ds-lead, body.ds #news .lead { font-size: var(--fs-md); line-height: 1.9; margin-top: var(--sp-4); word-break: auto-phrase; }
body.ds .ds-lead { color: var(--color-muted-fg); }
body.ds #news .lead { color: var(--color-border-strong); }
body.ds .ds-lead strong { color: var(--color-primary); font-weight: 700; }
body.ds .ds-note { margin-top: var(--sp-3); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg); }
body.ds .ds-actions { margin-top: var(--sp-6); }

/* ---------- 文字のリンク ---------- */
body.ds .ds-link {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-link:hover { color: var(--color-primary); }

/* ---------- 左右の分割（4｜8・5｜7） ---------- */
body.ds .ds-split { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--sp-7) var(--sp-8); align-items: start; }
body.ds .ds-split--5-7 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }

/* ---------- すりガラス（院内ツアーと同じ面） ---------- */
body.ds .ds-glass {
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  border: 1px solid var(--glass-line);
  border-radius: var(--r-glass);
}

/* =================================================================
   ボタン：影・浮き・光沢を打ち消す。指を乗せたときは色と線だけ変える
   ================================================================= */
body.ds .btn, body.ds .btn:hover, body.ds .btn:focus-visible { box-shadow: none; transform: none; }
body.ds .btn {
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-base); letter-spacing: .04em;
  border-width: 1px; text-align: center;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
body.ds .btn-lg { font-size: var(--fs-base); }
body.ds .btn-primary:hover { transform: none; box-shadow: none; }
body.ds .btn-ghost:hover { background: transparent; border-color: var(--color-accent); color: var(--color-accent-strong); }
body.ds .ds-btn-glass {
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  border: 1px solid var(--glass-line);
  border-radius: var(--r-pill);
  color: var(--color-primary);
}
body.ds .ds-btn-glass:hover { border-color: var(--color-accent); color: var(--color-accent-strong); }
body.ds .ds-btn-on-photo { background: var(--color-surface); color: var(--color-primary); border-color: var(--color-surface); }
body.ds .ds-btn-on-photo:hover { background: var(--color-accent-soft); color: var(--color-primary); border-color: var(--color-accent-soft); }
body.ds .ds-btn-outline-on-photo { background: transparent; color: var(--color-surface); border: 1px solid var(--line-on-photo); }
body.ds .ds-btn-outline-on-photo:hover { background: transparent; color: var(--color-surface); border-color: var(--color-surface); }
body.ds .ds-btn-line { background: var(--color-line-aa); color: var(--color-surface); border-color: var(--color-line-aa); }
body.ds .ds-btn-line:hover { background: var(--color-line-aa-strong); color: var(--color-surface); border-color: var(--color-line-aa-strong); }

/* =================================================================
   ヘッダー：浮いたすりガラスのナビ（院名は CSS の十字＋明朝）
   ================================================================= */
body.ds .site-header {
  position: fixed; inset: var(--sp-3) var(--sp-edge) auto; z-index: var(--z-header);
  background: transparent; border: 0;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
body.ds .site-header .nav {
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  border: 1px solid var(--glass-line);
  border-radius: var(--r-glass);
  position: relative;
  max-width: calc(1440px - var(--sp-edge) - var(--sp-edge));
  min-height: var(--nav-h); height: auto;
  padding-inline: var(--sp-4);
  gap: var(--sp-4);
}
body.ds .brand { min-height: 44px; min-width: 0; gap: var(--sp-2); color: var(--color-primary); }
body.ds .brand-name {
  font-size: var(--fs-md); font-weight: 600; letter-spacing: .06em; line-height: 1.2;
  font-feature-settings: "palt";
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.ds .ds-brand-cross { position: relative; flex: none; width: 16px; height: 16px; }
body.ds .ds-brand-cross::before, body.ds .ds-brand-cross::after { content: ""; position: absolute; background: var(--color-accent); border-radius: 0; }
body.ds .ds-brand-cross::before { left: 33%; top: 0; width: 34%; height: 100%; }
body.ds .ds-brand-cross::after { top: 33%; left: 0; width: 100%; height: 34%; }
/* 院の印（本物のロゴ assets/img/logo/mark.png・96×96 を 28px で見せる）。ヘッダーとフッターで同じ大きさ。紺の地の上でも色を変えない */
body.ds .ds-brand-mark { flex: none; width: 28px; height: 28px; }

body.ds .ds-nav { display: flex; align-items: center; gap: var(--sp-2); }
body.ds .nav-links { gap: 0; }
body.ds .nav-links a:not(.btn) {
  display: inline-flex; align-items: center; min-height: 44px;
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--fs-sm); font-weight: 500; color: var(--color-primary);
  border-radius: var(--r-xs);
  transition: color var(--t-fast) var(--ease);
}
body.ds .nav-links a:not(.btn):hover { background: transparent; color: var(--color-accent-strong); }
body.ds .nav-cta { margin-left: var(--sp-3); }
body.ds .nav-links .nav-cta .btn { min-height: 44px; padding: 0 var(--sp-4); font-size: var(--fs-sm); border-radius: var(--r-pill); }
body.ds .nav-links .nav-cta .btn:hover { background: var(--color-accent-strong); color: var(--color-surface); }
body.ds .ds-nav-quick { display: none; }
body.ds .nav-toggle {
  width: 44px; height: 44px;
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-sm);
  color: var(--color-primary);
}

/* =================================================================
   ヒーロー（写真を全面に・左に見出し・右に診断票・下に数字のレール）
   ================================================================= */
body.ds .hero {
  position: relative; overflow: hidden; display: grid;
  background: var(--color-surface-2);
  min-height: max(40rem, min(100vh, 56.25vw));
  min-height: max(40rem, min(100svh, 56.25vw));
}
body.ds .ds-hero__media { position: absolute; inset: 0; z-index: var(--z-media); pointer-events: none; }
body.ds .ds-hero__photo {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: 0% 50%;
}
/* 木漏れ日の影（院内ツアーと同じ画像・同じ強さ）。窓の側には落とさない */
body.ds .ds-hero__shade {
  --ds-shade-flip: -1;
  --ds-shade-op: .4;
  position: absolute; inset: -6%; z-index: var(--z-shade); pointer-events: none;
  mix-blend-mode: multiply; opacity: var(--ds-shade-op);
  background: center / cover no-repeat url("../img/tour/komorebi-wide.webp");
  -webkit-mask-image: linear-gradient(90deg, transparent 28%, black 50%);
  mask-image: linear-gradient(90deg, transparent 28%, black 50%);
  transform: scaleX(var(--ds-shade-flip));
  will-change: transform, opacity;
  animation: ds-shade-sway var(--t-sway) var(--ease-sway) infinite alternate, ds-shade-breathe var(--t-breathe) var(--ease-sway) infinite alternate;
}
@media (orientation: portrait) {
  body.ds .ds-hero__shade {
    background-image: url("../img/tour/komorebi-tall.webp");
    --ds-shade-op: .35;
    -webkit-mask-image: none; mask-image: none;
  }
}
@keyframes ds-shade-sway {
  0% { transform: scaleX(var(--ds-shade-flip)) translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: scaleX(var(--ds-shade-flip)) translate3d(-1.2%, .6%, 0) rotate(.6deg) skewX(.8deg); }
  100% { transform: scaleX(var(--ds-shade-flip)) translate3d(.8%, -.4%, 0) rotate(-.4deg); }
}
@keyframes ds-shade-breathe {
  from { opacity: var(--ds-shade-op); }
  to { opacity: calc(var(--ds-shade-op) * .8); }
}

body.ds .ds-hero__inner {
  position: relative; z-index: var(--z-content);
  display: grid;
  grid-template-columns: min(40vw, var(--w-copy)) 1fr;
  grid-template-rows: 1fr auto;
  column-gap: var(--sp-7); row-gap: var(--sp-6);
  width: 100%; max-width: 1440px; margin-inline: auto;
  padding: calc(var(--nav-h) + var(--sp-3) + var(--sp-7)) calc(var(--sp-edge) + var(--sp-4)) var(--sp-6);
}
body.ds .ds-hero__main { grid-column: 1; grid-row: 1; align-self: center; }
body.ds .ds-hero__copy { animation: ds-clear-in var(--t-slow) var(--ease) both; }
body.ds .ds-hero__label {
  display: flex; align-items: center; gap: var(--sp-3);
  margin: 0 0 var(--sp-5);
  font-size: var(--fs-sm); letter-spacing: .12em; color: var(--color-primary);
}
body.ds .ds-hero__label::before { content: ""; flex: none; width: var(--sp-5); height: 1px; background: currentColor; }
body.ds .hero .ds-h1 { color: var(--color-primary); }
/* 見出しの文節（.nowrap）は、1行に入る間はまとまりを保ち、入らない（文字を大きくした）ときは中で折り返す */
body.ds .ds-h1 .nowrap { display: inline-block; max-width: 100%; white-space: normal; }
body.ds .ds-hero__lead {
  max-width: 30em; margin-top: var(--sp-5);
  font-size: var(--fs-md); line-height: 1.9; color: var(--color-primary);
}
body.ds .ds-hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }

/* 数字のレール（数字が上・説明が下。読み上げは説明 → 数字） */
body.ds .ds-hero__rail {
  grid-column: 1; grid-row: 2;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0; padding-top: var(--sp-4);
  border-top: 1px solid var(--glass-line);
  color: var(--color-primary);
  animation: ds-clear-in var(--t-slow) var(--ease) var(--t-base) both;
}
body.ds .ds-rail__item { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--sp-2); min-width: 0; }
body.ds .ds-rail__item + .ds-rail__item { border-left: 1px solid var(--glass-line); padding-left: var(--sp-4); }
body.ds .ds-rail__label { font-size: var(--fs-xs); letter-spacing: .06em; line-height: 1.5; }
body.ds .ds-rail__value {
  margin: 0;
  font-family: var(--font-head); font-size: var(--fs-num); font-weight: 500;
  font-variant-numeric: tabular-nums; letter-spacing: 0; line-height: 1.1;
}
body.ds .ds-rail__unit { margin-left: var(--sp-2); font-family: var(--font-body); font-size: var(--fs-sm); font-weight: 400; letter-spacing: .06em; }

/* 診断票（カルテの見本）：罫線と数字だけ */
body.ds .ds-hero__card {
  grid-column: 2; grid-row: 1 / span 2; align-self: end; justify-self: end;
  width: min(100%, 20rem); padding: var(--sp-5);
  color: var(--color-primary);
  animation: ds-fade-in var(--t-slow) var(--ease) var(--t-base) both;
}
body.ds .ds-chart__head {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0 var(--sp-3);
  padding-bottom: var(--sp-3); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-xs); letter-spacing: .06em; line-height: 1.6; color: var(--color-muted-fg);
}
body.ds .ds-chart__no { font-family: var(--font-head); font-variant-numeric: tabular-nums; }
body.ds .ds-chart__verdict {
  display: flex; align-items: baseline; gap: var(--sp-3);
  margin: var(--sp-4) 0;
  font-family: var(--font-display); font-size: var(--fs-md); font-weight: 600; letter-spacing: .08em; line-height: 1.4;
}
body.ds .ds-chart__key { font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 400; letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds .ds-chart__rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-chart__rows li {
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-3);
  padding-block: var(--sp-2); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-sm); line-height: 1.5;
}
body.ds .ds-chart__val { font-family: var(--font-head); font-size: var(--fs-lg); font-variant-numeric: tabular-nums; letter-spacing: 0; line-height: 1.2; }
body.ds .ds-chart__foot { margin-top: var(--sp-3); font-size: var(--fs-xs); letter-spacing: .06em; color: var(--color-muted-fg); }

@keyframes ds-clear-in {
  from { opacity: 0; filter: blur(var(--blur-reveal)); }
  to { opacity: 1; filter: none; }
}
@keyframes ds-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* =================================================================
   お知らせ（#news・紺の帯。中身は news.js が描く。見た目だけ変える）
   ================================================================= */
body.ds #news { padding-block: var(--sp-section); }
body.ds #news .ds-kicker { color: var(--color-border-strong); }
body.ds #news .ds-kicker__no { color: var(--color-teal); }
body.ds #news .news-list, body.ds #news .news-more-btn { max-width: none; margin-inline: 0; }
body.ds #news .news-empty {
  text-align: left; padding: var(--sp-5) 0;
  border-top: 1px solid var(--line-on-ink); border-bottom: 1px solid var(--line-on-ink);
  color: var(--color-border-strong);
}
body.ds #news .news-item { padding-block: var(--sp-5); border-top-color: var(--line-on-ink); }
body.ds #news .news-list:has(.news-item) { border-bottom-color: var(--line-on-ink); }
body.ds #news .news-item.is-hidden { display: none; }
body.ds #news .news-meta { gap: var(--sp-2) var(--sp-3); margin-bottom: var(--sp-2); }
body.ds #news .news-tag, body.ds #news .news-new {
  padding: 0 var(--sp-2);
  background: transparent; border: 1px solid var(--line-on-photo); border-radius: var(--r-xs);
  color: var(--color-border);
  font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 500; letter-spacing: .06em; line-height: 1.8;
}
body.ds #news .news-tag.is-important { color: var(--c-severe-bg); border-color: var(--c-severe); }
body.ds #news .news-date { font-size: var(--fs-sm); letter-spacing: .06em; }
body.ds #news .news-title { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6; }
body.ds #news .news-title-link { display: inline-flex; align-items: center; min-height: 44px; text-decoration-thickness: 1px; }
body.ds #news .news-body { font-size: var(--fs-sm); }
body.ds #news .news-link {
  display: inline-flex; align-items: center; min-height: 44px; margin-top: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm);
  text-decoration-thickness: 1px;
}
body.ds #news .news-link > span[aria-hidden="true"] { display: none; }
body.ds #news .news-body-toggle { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); text-decoration-thickness: 1px; }
body.ds #news .news-more-btn {
  margin-top: var(--sp-5); border-width: 1px;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); letter-spacing: .04em;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
@media (min-width: 761px) {
  body.ds #news .news-item { display: grid; grid-template-columns: 9rem minmax(0, 1fr); column-gap: var(--sp-5); }
  body.ds #news .news-meta { grid-column: 1; grid-row: 1 / span 6; flex-direction: column; align-items: flex-start; margin-bottom: 0; }
  body.ds #news .news-item > :not(.news-meta) { grid-column: 2; }
}

/* =================================================================
   症状と回復の台帳（#symptoms）：番号｜こんな症状｜回復後の姿
   ================================================================= */
body.ds .ds-ledger-wrap {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr) minmax(0, 1fr);
  column-gap: var(--sp-6);
}
body.ds .ds-ledger-wrap > .ds-head, body.ds .ds-ledger__cols, body.ds .ds-ledger { grid-column: 1 / -1; }
body.ds .ds-ledger-wrap > .ds-summit, body.ds .ds-ledger-wrap > .ds-actions { grid-column: 3; }
body.ds .ds-ledger__cols {
  display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) minmax(0, 1fr);
  column-gap: var(--sp-6); align-items: end;
}
body.ds .ds-ledger__col { margin: 0; }
body.ds .ds-ledger__col img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-ledger__label { margin-top: var(--sp-3); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds .ds-ledger { list-style: none; margin: var(--sp-6) 0 0; padding: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-ledger__row {
  display: grid; grid-template-columns: 3.5rem minmax(0, 1fr);
  column-gap: var(--sp-6); align-items: baseline;
  padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line);
}
body.ds .ds-ledger__pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--sp-6); margin: 0; }
body.ds .ds-ledger__cell { position: relative; min-width: 0; }
body.ds .ds-ledger__no {
  font-family: var(--font-head); font-size: var(--fs-sm); font-variant-numeric: tabular-nums;
  letter-spacing: .08em; color: var(--color-accent-strong);
}
/* 「こんな症状」「回復後の姿」の札：広い画面では列の見出し（写真の下）が兼ねるので、読み上げだけに残す */
body.ds .ds-ledger__key {
  position: absolute; width: 1px; height: 1px; margin: 0; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
body.ds .ds-ledger dd { margin: 0; font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-ledger dd strong {
  display: block; margin-bottom: var(--sp-2);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6;
  font-feature-settings: "palt"; color: var(--color-primary);
}
body.ds .ds-ledger__cell--after dd strong { color: var(--color-accent-strong); }
body.ds .ds-summit { max-width: var(--w-copy); margin-top: var(--sp-7); }
body.ds .ds-summit p { margin-top: var(--sp-3); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-summit .ds-summit__line {
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.7;
  font-feature-settings: "palt"; word-break: auto-phrase; color: var(--color-primary);
}
body.ds .ds-summit p + .ds-summit__line { margin-top: var(--sp-5); }

/* =================================================================
   院長の想い（#mvv）：写真｜明朝の一節と全文。その下に使命・目指す未来・大切にすること
   ================================================================= */
body.ds .ds-statement__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
body.ds .ds-statement__grid > * { min-width: 0; }
body.ds .ds-statement__portrait { margin: 0; }
body.ds .ds-statement__portrait img {
  width: 100%; height: auto; max-width: 24rem; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: 50% 30%;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-statement__q { font-size: var(--fs-sm); letter-spacing: .06em; color: var(--color-muted-fg); }
body.ds .ds-quote { margin: var(--sp-4) 0 0; }
body.ds .ds-quote blockquote { margin: 0; }
body.ds .ds-quote p {
  max-width: 14em;
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-2xl); letter-spacing: .06em; line-height: 1.6;
  font-feature-settings: "palt"; word-break: auto-phrase; color: var(--color-primary);
}
body.ds .ds-signature { margin-top: var(--sp-4); font-size: var(--fs-sm); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds .ds-statement__text { max-width: var(--w-narrow); }
body.ds .ds-statement__text p { margin: 0 0 var(--sp-5); font-size: var(--fs-base); line-height: 2; color: var(--color-secondary); }
body.ds .ds-statement__text strong { font-weight: 700; color: var(--color-primary); }
body.ds .ds-statement__text .ds-statement__close {
  margin: var(--sp-6) 0 0; padding-top: var(--sp-5);
  border-top: 1px solid var(--glass-line);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 2;
  font-feature-settings: "palt"; color: var(--color-primary);
}
body.ds .ds-statement__close strong { font-weight: 600; color: var(--color-accent-strong); }

body.ds .ds-values { margin-top: var(--sp-8); border-top: 1px solid var(--glass-line); }
body.ds .ds-values__row {
  display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: var(--sp-6); align-items: baseline;
  padding-block: var(--sp-6); border-bottom: 1px solid var(--glass-line);
}
body.ds .ds-values__label { font-size: var(--fs-sm); letter-spacing: .12em; line-height: 1.9; color: var(--color-accent-strong); }
body.ds .ds-values__body { max-width: var(--w-copy); }
body.ds .ds-values__body p { line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-values__body .ds-values__lead {
  margin-bottom: var(--sp-3);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.6;
  font-feature-settings: "palt"; color: var(--color-primary);
}
body.ds .ds-values__list { list-style: none; margin: 0; padding: 0; }
body.ds .ds-values__list li { padding-block: var(--sp-3); border-top: 1px solid var(--glass-line); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-values__list li:first-child { padding-top: 0; border-top: 0; }
body.ds .ds-values__list strong {
  display: block;
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em;
  font-feature-settings: "palt"; color: var(--color-primary);
}

/* =================================================================
   出張IT講座（#Off-site-Lecture）：左に文字・右に写真
   ================================================================= */
body.ds #Off-site-Lecture { background: none; }
body.ds .ds-feature { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-8); align-items: center; }
body.ds .ds-feature__photo { margin: 0; }
body.ds .ds-feature__photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}

/* =================================================================
   診療の流れ（#flow）：写真2枚（段違い）｜3つの段
   ================================================================= */
body.ds .ds-flow { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-7); }
body.ds .ds-flow > * { min-width: 0; }
body.ds .ds-flow__photos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
body.ds .ds-flow__photo {
  width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; object-position: 50% 0%;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-flow__photo--low { margin-top: var(--sp-7); }
body.ds .ds-steps { list-style: none; margin: var(--sp-6) 0 0; padding: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-steps__item {
  display: grid; grid-template-columns: 3.5rem minmax(0, 1fr);
  column-gap: var(--sp-4); row-gap: var(--sp-2); align-items: baseline;
  padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line);
}
body.ds .ds-steps__no {
  grid-column: 1; grid-row: 1 / span 2;
  font-family: var(--font-head); font-size: var(--fs-sm); font-variant-numeric: tabular-nums;
  letter-spacing: .08em; color: var(--color-accent-strong);
}
body.ds .ds-steps__item > h3, body.ds .ds-steps__item > p { grid-column: 2; }
body.ds .ds-steps__item > p { line-height: 1.9; color: var(--color-secondary); }

/* =================================================================
   開閉式の行（IT疾患図鑑・よくある質問）
   ================================================================= */
body.ds .ds-acc-list { border-top: 1px solid var(--glass-line); }
body.ds .ds-acc { border-bottom: 1px solid var(--glass-line); }
body.ds .ds-acc__q {
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-4);
  min-height: 44px; padding: var(--sp-5) 0;
  list-style: none; cursor: pointer;
}
body.ds .ds-acc__q::-webkit-details-marker { display: none; }
body.ds .ds-disease .ds-acc__q { align-items: center; }
body.ds .ds-acc__head { display: flex; flex-direction: column; gap: var(--sp-2); min-width: 0; }
body.ds .ds-acc__tag { font-size: var(--fs-xs); letter-spacing: .08em; line-height: 1.6; color: var(--color-muted-fg); }
body.ds .ds-acc__title {
  font-family: var(--font-display); font-weight: 600; letter-spacing: .04em; line-height: 1.6;
  font-feature-settings: "palt"; color: var(--color-primary);
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-disease .ds-acc__title { font-size: var(--fs-lg); }
body.ds .ds-faq .ds-acc__title { font-size: var(--fs-md); }
body.ds .ds-acc__alias { font-size: var(--fs-sm); line-height: 1.6; color: var(--color-muted-fg); }
body.ds .ds-acc__q:hover .ds-acc__title { color: var(--color-accent-strong); }
body.ds .ds-acc__icon {
  position: relative; flex: none;
  width: var(--sp-4); height: var(--sp-4); margin-top: var(--sp-2);
  color: var(--color-accent-strong);
}
body.ds .ds-disease .ds-acc__icon { margin-top: 0; }
body.ds .ds-acc__icon::before, body.ds .ds-acc__icon::after {
  content: ""; position: absolute; inset: 0; margin: auto;
  width: 100%; height: 1px; background: currentColor;
}
body.ds .ds-acc__icon::after { transform: rotate(90deg); transition: transform var(--t-base) var(--ease); }
body.ds .ds-acc[open] > .ds-acc__q .ds-acc__icon::after { transform: rotate(0deg); }
body.ds .ds-acc__a { padding: 0 var(--sp-6) var(--sp-5) 0; font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-acc__a strong { color: var(--color-primary); }
body.ds .ds-acc__sub { margin-bottom: var(--sp-2); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds .ds-disease__symptoms { margin: 0; padding-left: var(--sp-5); }
body.ds .ds-disease__symptoms li + li { margin-top: var(--sp-2); }

/* =================================================================
   診療科目（#departments）：写真つきの科の一覧＋準備中の科（文字だけ）
   ================================================================= */
body.ds .ds-dept-group + .ds-dept-group { margin-top: var(--sp-8); }
body.ds .ds-dept-group__title {
  margin-bottom: var(--sp-6); padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-lg);
}
body.ds .ds-depts {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 20rem)); justify-content: start;
  gap: var(--sp-7) var(--sp-6);
}
body.ds .ds-dept { position: relative; }
body.ds .ds-dept__photo {
  width: 100%; height: auto; max-width: 20rem; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-dept__name { margin-top: var(--sp-4); font-size: var(--fs-md); }
body.ds .ds-dept__link {
  color: var(--color-primary);
  text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-dept__link::after { content: ""; position: absolute; inset: 0; }
body.ds .ds-dept:hover .ds-dept__link { color: var(--color-accent-strong); text-decoration: underline; }
body.ds .ds-dept__desc { margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg); }
body.ds .ds-dept__more {
  display: inline-block; margin-top: var(--sp-3);
  font-size: var(--fs-xs); letter-spacing: .08em; color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .3em;
}
body.ds .ds-soon {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2) var(--sp-5);
  margin-top: var(--sp-6);
}
body.ds .ds-soon__title { flex: none; font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds .ds-soon__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-6); }
body.ds .ds-soon__name { font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds .ds-soon__state { margin-left: var(--sp-2); font-size: var(--fs-xs); color: var(--color-muted-fg); }
body.ds .ds-recruit {
  display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--sp-4);
  margin-top: var(--sp-7); padding-top: var(--sp-5);
  border-top: 1px solid var(--glass-line);
  color: var(--color-secondary);
}

/* =================================================================
   専門家（#doctors）：2人の縦長の写真（同じ枠・同じ大きさ）
   ================================================================= */
body.ds .ds-people {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 16rem)); gap: var(--sp-6);
}
body.ds .ds-person__photo {
  width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-person__photo--ikeda { object-position: 50% 30%; }
body.ds .ds-person__photo--yagura { object-position: 48% 40%; }
body.ds .ds-person__name { margin-top: var(--sp-3); font-size: var(--fs-lg); }
body.ds .ds-person__name a {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--color-primary);
  text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-person__name a:hover { color: var(--color-accent-strong); text-decoration: underline; }
body.ds .ds-person__title, body.ds .ds-person__dept { font-size: var(--fs-sm); line-height: 1.7; color: var(--color-muted-fg); }

/* =================================================================
   院内ツアーの帯：受付の写真＋すりガラスの小さなカード
   ================================================================= */
body.ds .ds-tourband { padding-block: var(--sp-7); }
body.ds .ds-tourband__frame {
  position: relative; overflow: hidden; aspect-ratio: 16 / 7;
  border-radius: var(--r-glass); background: var(--color-surface-2);
}
body.ds .ds-tourband__photo {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: 50% 35%;
}
body.ds .ds-tourband__card {
  position: absolute; right: var(--sp-5); bottom: var(--sp-5);
  width: min(24rem, 45%); padding: var(--sp-5);
  display: grid; gap: var(--sp-3); justify-items: start;
  color: var(--color-primary);
}
body.ds .ds-tourband__title { font-size: var(--fs-lg); }
body.ds .ds-tourband__card p { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }

/* =================================================================
   最後の案内（#contact）：夕方の長崎港の写真。暗いのは写真のスクリム
   ================================================================= */
body.ds .ds-cta {
  position: relative; overflow: hidden;
  padding-block: var(--sp-section);
  background: var(--color-primary); color: var(--color-surface);
}
body.ds .ds-cta__media { position: absolute; inset: 0; z-index: var(--z-media); pointer-events: none; }
body.ds .ds-cta__photo {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: 50% 50%;
}
body.ds .ds-cta__scrim {
  position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(90deg, var(--scrim-strong) 0%, var(--scrim-strong) 55%, var(--scrim-soft) 85%, var(--scrim-soft) 100%);
}
body.ds .ds-cta .container { position: relative; z-index: var(--z-content); }
body.ds .ds-cta__inner { max-width: min(50vw, var(--w-copy)); }
body.ds .ds-cta h2, body.ds .ds-cta .ds-lead, body.ds .ds-cta .ds-note { color: var(--color-surface); }
body.ds .ds-cta .ds-kicker { color: var(--color-border); }
body.ds .ds-cta .ds-kicker__no { color: var(--color-accent-soft); }
body.ds .ds-cta__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
body.ds .ds-cta__visit { display: grid; gap: var(--sp-2); justify-items: start; margin-top: var(--sp-5); }
body.ds .ds-cta :focus-visible { outline-color: var(--color-accent-soft); }

/* =================================================================
   メール相談（#soudan）：フォームの中身は変えず、見た目だけ
   ================================================================= */
body.ds #soudan .quiz-wrap { max-width: none; margin-inline: 0; }
body.ds #soudan .quiz-card {
  box-shadow: none; border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  padding: var(--sp-6);
}
body.ds #soudan .form-field label, body.ds #soudan .consent { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); }
body.ds #soudan .form-field input, body.ds #soudan .dock-select, body.ds #soudan .dock-textarea {
  border: 1px solid var(--color-faint-fg); border-radius: var(--r-sm);
}
body.ds #soudan .form-field input:focus, body.ds #soudan .dock-select:focus, body.ds #soudan .dock-textarea:focus {
  box-shadow: none; outline: 3px solid var(--color-accent); outline-offset: 2px; border-color: var(--color-accent);
}
body.ds #soudan .form-field input.invalid, body.ds #soudan .dock-select.invalid, body.ds #soudan .dock-textarea.invalid { border-color: var(--color-destructive); }
body.ds #soudan .sent-banner { border-color: var(--glass-line); border-radius: var(--r-glass); }
body.ds #soudan .sent-banner svg { display: none; }
body.ds #soudan .sent-banner .receipt-no { border-color: var(--glass-line); border-radius: var(--r-xs); }
body.ds #soudan .sent-banner.fade-out { transform: none; }

/* =================================================================
   フッター（紺でページを締める）
   ================================================================= */
body.ds .site-footer .brand { color: var(--color-surface); }
body.ds .site-footer .brand-name { font-size: var(--fs-md); }
body.ds .site-footer .ds-brand-cross::before, body.ds .site-footer .ds-brand-cross::after { background: var(--color-teal); }
body.ds .ds-footer__head { margin-bottom: var(--sp-3); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-border); }
body.ds .site-footer .footer-grid ul { gap: 0; }
body.ds .site-footer .footer-grid a { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--fs-sm); transition: color var(--t-fast) var(--ease); }
body.ds .site-footer .footer-about { font-size: var(--fs-sm); }
body.ds .ds-footer__hours { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--fs-sm); color: var(--color-border-strong); }
body.ds .site-footer .footer-bottom { border-top-color: var(--line-on-ink); font-size: var(--fs-xs); letter-spacing: .04em; color: var(--color-border-strong); }
body.ds .site-footer :focus-visible { outline-color: var(--color-teal); }

/* =================================================================
   第1弾：診断・科・専門家のページ（shindan.html・dept.html・doctors.html）
   トップには無いクラスと id（.ds-pagehead・.ds-label・#shindan-app・#dept-main・#doctors-grid など）だけに当てる
   ================================================================= */

/* ---------- ページの頭（ヒーローの無いページ）：浮いたヘッダーの下から始める ---------- */
body.ds .ds-pagehead {
  padding-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-6)); padding-bottom: var(--sp-7);
  background: var(--color-surface);
}
body.ds .ds-pagehead.ds-shindan { padding-bottom: var(--sp-section); }
body.ds .ds-pagehead > .container > .ds-head { margin-bottom: 0; }
body.ds .ds-pagehead.ds-notice { padding-bottom: var(--sp-section); }
body.ds .ds-notice__inner { max-width: var(--w-copy); }

/* ---------- 線つきの和文のラベル（ページや塊の頭） ---------- */
body.ds .ds-label {
  display: flex; align-items: center; gap: var(--sp-3);
  margin: 0 0 var(--sp-4);
  font-size: var(--fs-sm); font-weight: 500; letter-spacing: .12em; line-height: 1.6; color: var(--color-primary);
}
body.ds .ds-label::before { content: ""; flex: none; width: var(--sp-5); height: 1px; background: currentColor; }

/* ---------- パンくず（区切りは細い縦線。読み上げない） ---------- */
body.ds .ds-breadcrumb { display: block; margin: 0 0 var(--sp-4); font-size: var(--fs-xs); color: var(--color-muted-fg); }
body.ds .ds-breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0; }
body.ds .ds-breadcrumb__list li { display: inline-flex; align-items: center; min-width: 0; }
body.ds .ds-breadcrumb__list li + li::before {
  content: ""; display: inline-block; flex: none;
  width: 1px; height: var(--sp-3); margin: 0 var(--sp-3);
  background: var(--color-border-strong);
}
body.ds .ds-breadcrumb a {
  display: inline-flex; align-items: center; min-width: 44px; min-height: 44px;
  color: var(--color-muted-fg);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-breadcrumb a:hover { color: var(--color-accent-strong); }
body.ds .ds-breadcrumb [aria-current] { color: var(--color-primary); font-weight: 500; }

/* ---------- ナビの現在地（下線と色） ---------- */
body.ds .nav-links a[aria-current="page"]:not(.btn) {
  color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .35em;
}

/* ---------- 締めの案内（淡い地と罫線）・ボタンの並び ---------- */
body.ds .ds-closing__inner { max-width: var(--w-copy); }
body.ds .ds-closing__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }

/* LINE の枠のボタン（白地に濃い緑の文字と枠。白地で 5.05:1） */
body.ds .ds-btn-line-outline { background: var(--color-surface); color: var(--color-line-aa); border: 1px solid var(--color-line-aa); }
body.ds .ds-btn-line-outline:hover { background: var(--color-surface-2); color: var(--color-line-aa-strong); border-color: var(--color-line-aa-strong); }

/* =================================================================
   IT健康診断（shindan.html）：問診と結果は #shindan-app の中、連絡先のモーダルは #lead-modal。
   学びの冒険と共有するクラス（レーダー・簡易処方箋など）も、必ず #shindan-app を付けて書く
   ================================================================= */
/* 右の列いっぱいに使う（見出しの列と左端をそろえる） */
body.ds .ds-shindan .ds-split__body > * { max-width: none; margin-inline: 0; }

/* ---------- 入口と問診 ---------- */
body.ds #shindan-app .quiz-card {
  padding: var(--sp-6);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none;
}
body.ds #shindan-app .quiz-intro { text-align: left; }
body.ds #shindan-app .quiz-intro .h-section { font-size: var(--fs-xl); line-height: 1.45; }
body.ds #shindan-app .quiz-intro .lead { margin-top: var(--sp-4); font-size: var(--fs-md); line-height: 1.9; color: var(--color-muted-fg); }
body.ds #shindan-app .intro-meta {
  list-style: none; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: baseline; gap: var(--sp-2) var(--sp-5);
  margin: var(--sp-5) 0 var(--sp-6); padding: var(--sp-3) 0;
  border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-sm); color: var(--color-secondary);
}
body.ds #shindan-app .intro-meta .ds-num { font-family: var(--font-head); font-size: var(--fs-md); font-variant-numeric: tabular-nums; letter-spacing: 0; color: var(--color-primary); }
body.ds #shindan-app .disclaimer { margin-top: var(--sp-4); font-size: var(--fs-xs); line-height: 1.7; color: var(--color-muted-fg); }

body.ds #shindan-app .progress-head { font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #shindan-app .progress-track { height: 4px; background: var(--color-surface-2); border-radius: 0; }
body.ds #shindan-app .progress-bar { background: var(--color-accent); border-radius: 0; transition: width var(--t-base) var(--ease); }
body.ds #shindan-app .q-cat {
  display: block; margin: var(--sp-6) 0 var(--sp-2);
  font-family: var(--font-body); font-size: var(--fs-sm); font-weight: 500; letter-spacing: .04em; color: var(--color-accent-strong);
}
body.ds #shindan-app .q-text { font-size: var(--fs-lg); line-height: 1.6; }
/* 次の設問へフォーカスが移って画面が動くとき、設問の上の「質問 N / 12」と科名もヘッダーの下に見えるようにする */
body.ds #shindan-app #q-text { scroll-margin-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-5) + var(--sp-9) + var(--sp-2)); }
body.ds #shindan-app .q-help { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #shindan-app .q-prompt { margin-top: var(--sp-5); font-size: var(--fs-sm); font-weight: 500; }
body.ds #shindan-app .q-prompt span { margin-left: var(--sp-2); font-size: var(--fs-xs); font-weight: 400; color: var(--color-muted-fg); }

/* 選択肢：色分けしない。選んだ印は「角の四角の塗りと白いチェック・枠の色・淡い地」の3つ */
body.ds #shindan-app .options { gap: var(--sp-3); margin-top: var(--sp-4); }
body.ds #shindan-app .option {
  gap: var(--sp-4); min-height: 56px; padding: var(--sp-4);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-sm);
  box-shadow: none; transform: none;
  font-size: var(--fs-base); font-weight: 500; color: var(--color-primary);
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
body.ds #shindan-app .option:hover, body.ds #shindan-app .option:active { background: var(--color-surface); border-color: var(--color-accent); transform: none; }
body.ds #shindan-app .option .dot {
  width: 20px; height: 20px;
  background: var(--color-surface); border: 1px solid var(--color-muted-fg); border-radius: var(--r-xs);
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
body.ds #shindan-app .option .dot svg { width: 14px; height: 14px; color: var(--color-surface); opacity: 0; transition: opacity var(--t-fast) var(--ease); }
body.ds #shindan-app .option.selected, body.ds #shindan-app .option[aria-checked="true"] {
  background: var(--color-accent-soft); border-color: var(--color-accent); box-shadow: none;
}
body.ds #shindan-app .option.selected .dot, body.ds #shindan-app .option[aria-checked="true"] .dot { background: var(--color-accent); border-color: var(--color-accent); }
body.ds #shindan-app .option.selected .dot svg, body.ds #shindan-app .option[aria-checked="true"] .dot svg { opacity: 1; }
body.ds #shindan-app .opt-text { min-width: 0; }
body.ds #shindan-app .opt-label { font-weight: 500; line-height: 1.5; color: var(--color-primary); }
body.ds #shindan-app .opt-sub { font-size: var(--fs-xs); font-weight: 400; color: var(--color-muted-fg); }
body.ds #shindan-app .quiz-nav .btn { min-height: 44px; }
body.ds #shindan-app .quiz-nav .btn-ghost[disabled] {
  opacity: 1; cursor: not-allowed;
  background: var(--color-surface-2); border-color: var(--glass-line); color: var(--color-muted-fg);
}

/* ---------- 結果の頭：判定（小さな四角の印＋文字）・病名（明朝）・点数（Figtree の大きな数字） ---------- */
body.ds #shindan-app .ds-result__head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-4) var(--sp-6); align-items: end;
  padding: var(--sp-5) 0;
  border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line);
}
body.ds #shindan-app .ds-result__head > * { min-width: 0; }
body.ds #shindan-app .ds-result__verdict {
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: var(--fs-sm); font-weight: 500; letter-spacing: .06em; color: var(--color-primary);
}
body.ds #shindan-app .ds-result__mark { flex: none; width: 10px; height: 10px; border-radius: 0; background: var(--color-muted-fg); }
body.ds #shindan-app .result[data-sev="healthy"] .ds-result__mark { background: var(--c-healthy); }
body.ds #shindan-app .result[data-sev="mild"] .ds-result__mark { background: var(--c-mild); }
body.ds #shindan-app .result[data-sev="watch"] .ds-result__mark { background: var(--c-watch); }
body.ds #shindan-app .result[data-sev="treat"] .ds-result__mark { background: var(--c-treat); }
body.ds #shindan-app .result[data-sev="severe"] .ds-result__mark { background: var(--c-severe); }
body.ds #shindan-app .ds-result__label { margin-top: var(--sp-5); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds #shindan-app .ds-result__name { margin-top: var(--sp-2); font-size: var(--fs-2xl); line-height: 1.4; color: var(--color-primary); }
body.ds #shindan-app .ds-result__alias { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #shindan-app .ds-result__score { text-align: right; }
body.ds #shindan-app .ds-result__num {
  font-family: var(--font-head); font-size: var(--fs-display); font-weight: 500; line-height: 1;
  font-variant-numeric: tabular-nums; letter-spacing: 0; color: var(--color-primary);
}
body.ds #shindan-app .ds-result__num b { font-weight: 500; }
body.ds #shindan-app .ds-result__score-label { margin-top: var(--sp-2); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }

/* ---------- 次の一歩・共有 ---------- */
body.ds #shindan-app .dx-next {
  max-width: none; margin: var(--sp-6) 0 0; padding: var(--sp-6) 0 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0; box-shadow: none;
  text-align: left;
}
/* 判定の下の罫線が、次の一歩の上の線を兼ねる（線を二重にしない） */
body.ds #shindan-app .ds-result__head + .dx-next { padding-top: 0; border-top: 0; }
body.ds #shindan-app .dx-next-eyebrow { font-weight: 500; }
body.ds #shindan-app .dx-next h3 { margin: 0; font-size: var(--fs-lg); line-height: 1.6; }
body.ds #shindan-app .dx-next-story { margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--glass-line); }
body.ds #shindan-app .dx-next-story p, body.ds #shindan-app .dx-next > p:not(.dx-next-eyebrow):not(.dx-next-note) {
  margin-top: var(--sp-3); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #shindan-app .dx-next-story p:first-child { margin-top: 0; }
body.ds #shindan-app .dx-next-btns { justify-content: flex-start; gap: var(--sp-3); margin-top: var(--sp-5); }
body.ds #shindan-app .dx-next-note { margin-top: var(--sp-3); font-size: var(--fs-xs); color: var(--color-muted-fg); }

body.ds #shindan-app .share-row {
  justify-content: flex-start; gap: var(--sp-3) var(--sp-5);
  margin: var(--sp-6) 0 0; padding: var(--sp-4) 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #shindan-app .share-label { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary); }
body.ds #shindan-app .share-btns { gap: var(--sp-2); }
body.ds #shindan-app .share-btn {
  justify-content: center; min-width: 44px; min-height: 44px; padding: 0 var(--sp-4);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-pill);
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary);
  box-shadow: none; transform: none;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
body.ds #shindan-app .share-btn:hover { background: var(--color-surface); border-color: var(--color-accent); color: var(--color-accent-strong); box-shadow: none; transform: none; }

/* ---------- レーダー・簡易処方箋・学びの冒険（学びの冒険と同じクラス。#shindan-app の中だけ） ---------- */
body.ds #shindan-app .it-game { margin-top: var(--sp-7); }
body.ds #shindan-app .game-intro { margin: 0 0 var(--sp-5); padding: 0; background: transparent; border: 0; border-radius: 0; }
body.ds #shindan-app .game-kicker { display: block; font-size: var(--fs-lg); line-height: 1.6; color: var(--color-primary); }
body.ds #shindan-app .game-intro p, body.ds #shindan-app .rx-self-head p { margin-top: var(--sp-3); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds #shindan-app .radar-wrap {
  padding: var(--sp-5) 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none;
}
body.ds #shindan-app .radar-grid, body.ds #shindan-app .radar-spoke { stroke: var(--color-border); }
body.ds #shindan-app .radar-label { font-family: var(--font-body); letter-spacing: 0; fill: var(--color-secondary); }
body.ds #shindan-app .radar-bench { stroke: var(--color-primary); opacity: 1; }
body.ds #shindan-app .radar-cur { fill: var(--color-accent-soft); fill-opacity: .7; stroke: var(--color-accent); }
body.ds #shindan-app .radar-legend li { font-size: var(--fs-sm); }
body.ds #shindan-app .radar-legend .lg-bench { opacity: 1; }

body.ds #shindan-app .rx-self { margin-top: var(--sp-7); padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
body.ds #shindan-app .cl-group { margin-top: var(--sp-5); }
body.ds #shindan-app .cl-cat { margin-bottom: var(--sp-2); font-size: var(--fs-md); }
body.ds #shindan-app .cl-cat::before { display: none; }
body.ds #shindan-app .cl-list { gap: 0; border-top: 1px solid var(--glass-line); }
body.ds #shindan-app .cl-item {
  gap: var(--sp-3); min-height: 44px; padding: var(--sp-3) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  transition: color var(--t-fast) var(--ease);
}
body.ds #shindan-app .cl-item:hover { background: transparent; border-color: var(--glass-line); }
body.ds #shindan-app .cl-item:hover .cl-todo { color: var(--color-accent-strong); }
body.ds #shindan-app .cl-box {
  width: 20px; height: 20px;
  background: var(--color-surface); border: 1px solid var(--color-muted-fg); border-radius: var(--r-xs);
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
body.ds #shindan-app .cl-item.checked .cl-box { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-surface); }
body.ds #shindan-app .cl-todo { font-weight: 500; font-size: var(--fs-base); }
body.ds #shindan-app .cl-why { font-size: var(--fs-xs); color: var(--color-muted-fg); }
body.ds #shindan-app .rx-buy {
  margin-top: var(--sp-5); padding: var(--sp-4) 0 0; text-align: left;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #shindan-app .rx-buy-note { font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds #shindan-app .cl-buy svg { display: none; }
body.ds #shindan-app .rx-soon { margin-top: var(--sp-4); text-align: left; font-size: var(--fs-xs); color: var(--color-muted-fg); }

/* 学びの冒険の案内：講座の写真と文字（キャラクターの絵は使わない） */
body.ds #shindan-app .ds-adventure {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-5) var(--sp-6); align-items: center;
  margin-top: var(--sp-7); padding-top: var(--sp-6);
  border-top: 1px solid var(--glass-line);
  text-align: left;
}
body.ds #shindan-app .ds-adventure > * { min-width: 0; }
body.ds #shindan-app .ds-adventure__photo { margin: 0; }
body.ds #shindan-app .ds-adventure__photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds #shindan-app .ds-adventure__title { font-size: var(--fs-lg); }
body.ds #shindan-app .adventure-note { margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg); }
body.ds #shindan-app .ds-adventure__action { margin-top: var(--sp-4); }

/* ---------- IT無関心症（併発）：上の赤い細線と見出しの文字で知らせる。箱や帯は使わない ---------- */
body.ds #shindan-app .literacy-dx {
  margin: var(--sp-7) 0 0; padding: var(--sp-6) 0;
  background: transparent; border: 0; border-top: 1px solid var(--c-severe); border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none;
}
body.ds #shindan-app .literacy-dx-head { text-align: left; }
body.ds #shindan-app .literacy-dx-badge {
  display: flex; align-items: center; gap: var(--sp-3);
  margin: 0 0 var(--sp-4); padding: 0;
  background: transparent; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); letter-spacing: .12em; line-height: 1.6; color: var(--c-severe);
}
body.ds #shindan-app .literacy-dx-badge::before { content: ""; flex: none; width: var(--sp-5); height: 1px; background: currentColor; }
body.ds #shindan-app .literacy-dx-head h3 { margin-top: 0; font-size: var(--fs-xl); color: var(--color-primary); }
body.ds #shindan-app .literacy-dx-alias { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #shindan-app .literacy-dx-lead {
  max-width: var(--w-copy); margin: var(--sp-4) 0 0;
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #shindan-app .literacy-dx-lead strong { color: var(--color-primary); }
body.ds #shindan-app .literacy-dx-cols { gap: 0 var(--sp-6); margin-top: var(--sp-6); }
body.ds #shindan-app .literacy-dx-box { padding: var(--sp-4) 0; background: transparent; border-top: 1px solid var(--glass-line); border-radius: 0; }
body.ds #shindan-app .literacy-dx-box h4 { margin-bottom: var(--sp-3); font-size: var(--fs-md); color: var(--color-primary); }
body.ds #shindan-app .literacy-dx-box.danger h4 { color: var(--c-severe); }
body.ds #shindan-app .lit-list { gap: 0; margin: 0; padding: 0; }
body.ds #shindan-app .lit-list li { padding: var(--sp-2) 0; font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #shindan-app .lit-list li + li { border-top: 1px solid var(--glass-line); }
body.ds #shindan-app .literacy-flow { margin-top: var(--sp-6); padding-top: 0; border-top: 0; }
body.ds #shindan-app .literacy-flow > h4 { justify-content: flex-start; margin-bottom: var(--sp-4); text-align: left; font-size: var(--fs-md); color: var(--color-primary); }
body.ds #shindan-app .lit-steps {
  list-style: none; margin: 0; padding: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0;
  border-top: 1px solid var(--glass-line);
}
body.ds #shindan-app .lit-step { min-width: 0; padding: var(--sp-4) var(--sp-4) var(--sp-4) 0; background: transparent; border-radius: 0; }
body.ds #shindan-app .lit-step + .lit-step { padding-left: var(--sp-4); border-left: 1px solid var(--glass-line); }
body.ds #shindan-app .lit-step-no { font-family: var(--font-head); font-size: var(--fs-xs); font-weight: 500; color: var(--color-accent-strong); }
body.ds #shindan-app .lit-step h5 {
  margin: var(--sp-2) 0 var(--sp-3);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.5;
  color: var(--color-primary);
}
body.ds #shindan-app .lit-step li { font-size: var(--fs-sm); line-height: 1.8; }
body.ds #shindan-app .literacy-flow-cta { margin-top: var(--sp-5); text-align: left; font-size: var(--fs-sm); }
body.ds #shindan-app .literacy-flow-cta a { font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }

/* ---------- 結果のゲート・解除のあとの帯 ---------- */
body.ds #shindan-app .result-gate { margin: var(--sp-6) 0; }
body.ds #shindan-app .gate-card {
  max-width: none; margin: 0; padding: var(--sp-6); text-align: left;
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none;
}
body.ds #shindan-app .gate-card h3 { font-size: var(--fs-lg); line-height: 1.6; }
body.ds #shindan-app .gate-card p { max-width: var(--w-copy); margin: var(--sp-3) 0 var(--sp-5); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds #shindan-app .gate-card .btn { box-shadow: none; }
body.ds #shindan-app .gate-card .gate-note { margin: var(--sp-3) 0 0; font-size: var(--fs-xs); line-height: 1.7; color: var(--color-muted-fg); }
body.ds #shindan-app .gate-card .gate-or {
  display: flex; align-items: center; gap: var(--sp-3);
  max-width: none; margin: var(--sp-5) 0 var(--sp-3);
  font-size: var(--fs-xs); color: var(--color-muted-fg);
}
body.ds #shindan-app .gate-or::before, body.ds #shindan-app .gate-or::after { content: ""; flex: 1; height: 1px; background: var(--glass-line); }
/* メールと LINE の2つのボタンは同じ形（広い画面では文字の幅・狭い画面では横いっぱい） */
body.ds #shindan-app .gate-line-btn { width: auto; max-width: 100%; }
body.ds #shindan-app #gate-line-err { margin-top: var(--sp-2); }
body.ds #shindan-app .sent-banner {
  max-width: none; margin: 0; padding: var(--sp-5);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
}
body.ds #shindan-app .sent-banner svg { display: none; }
body.ds #shindan-app .sent-banner strong {
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6;
  color: var(--color-primary);
}
body.ds #shindan-app .sent-banner span { margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #shindan-app .sent-banner .receipt-no {
  margin: var(--sp-2) 0 0; padding: 0 var(--sp-2);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-xs);
  font-size: var(--fs-sm); color: var(--color-primary);
}
body.ds #shindan-app .sent-banner.fade-out { transform: none; }

/* ---------- 連絡先のモーダル（背景と重なり順は style.css のまま） ---------- */
body.ds #lead-modal .modal-card {
  max-width: 30rem; padding: var(--sp-6);
  border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none; transform: none;
}
body.ds #lead-modal .modal-close {
  top: var(--sp-3); right: var(--sp-3); width: 44px; height: 44px;
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-sm);
  color: var(--color-primary);
}
body.ds #lead-modal .modal-close:hover { background: var(--color-surface); border-color: var(--color-accent); color: var(--color-primary); }
body.ds #lead-modal .lead-modal__title { padding-right: var(--sp-8); font-size: var(--fs-lg); line-height: 1.6; }
body.ds #lead-modal .lead-modal__lead { margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #lead-modal .form-field label, body.ds #lead-modal .consent { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); }
body.ds #lead-modal .form-field input { font-size: var(--fs-base); border: 1px solid var(--color-faint-fg); border-radius: var(--r-sm); }
body.ds #lead-modal .form-field input:focus {
  box-shadow: none; outline: 3px solid var(--color-accent); outline-offset: 2px; border-color: var(--color-accent);
}
body.ds #lead-modal .form-field input.invalid { border-color: var(--color-destructive); }
body.ds #lead-modal .lead-modal__note { margin-top: var(--sp-3); text-align: center; font-size: var(--fs-xs); color: var(--color-muted-fg); }

/* ---------- ぼかしの中の詳細 ---------- */
body.ds #shindan-app .result-block { margin-top: var(--sp-7); }
/* 見出しの下の罫線が、下の一覧の上の線を兼ねる（線を二重にしない） */
body.ds #shindan-app .result-block h3 { margin-bottom: 0; padding-bottom: var(--sp-3); border-bottom: 1px solid var(--glass-line); font-size: var(--fs-lg); line-height: 1.6; }
body.ds #shindan-app .result-summary, body.ds #shindan-app .result-advice, body.ds #shindan-app .sym-risk {
  margin-top: var(--sp-3); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #shindan-app .result-advice strong, body.ds #shindan-app .sym-risk strong { color: var(--color-primary); }
body.ds #shindan-app .cat-bars { gap: 0; }
body.ds #shindan-app .cat-bar-link {
  display: block; margin: 0; padding: var(--sp-3) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  transform: none; transition: color var(--t-fast) var(--ease);
}
body.ds #shindan-app .cat-bar-link:hover, body.ds #shindan-app .cat-bar-link:focus-visible { background: transparent; border-color: var(--glass-line); transform: none; }
body.ds #shindan-app .cat-bar-link:hover .cname { color: var(--color-accent-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
body.ds #shindan-app .cat-bar .top { margin-bottom: var(--sp-2); }
body.ds #shindan-app .cat-bar .cname { font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary); }
body.ds #shindan-app .cat-bar .cval { font-family: var(--font-head); font-size: var(--fs-md); font-weight: 500; color: var(--color-primary); }
body.ds #shindan-app .cat-bar .track { height: 6px; background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: 0; }
body.ds #shindan-app .cat-bar .fill { background: var(--color-muted-fg); border-radius: 0; transition: width var(--t-slow) var(--ease); }
body.ds #shindan-app .cat-bar[data-level="healthy"] .fill { background: var(--c-healthy); }
body.ds #shindan-app .cat-bar[data-level="watch"] .fill { background: var(--c-watch); }
body.ds #shindan-app .cat-bar[data-level="treat"] .fill { background: var(--c-treat); }
body.ds #shindan-app .cat-bar[data-level="severe"] .fill { background: var(--c-severe); }
body.ds #shindan-app .comorbid-line { margin-top: var(--sp-4); text-align: left; }
body.ds #shindan-app .sym-grid { gap: 0; margin: 0; padding: 0; }
body.ds #shindan-app .sym-grid li {
  display: block; padding: var(--sp-3) 0;
  background: transparent; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #shindan-app .sym-dept { margin-top: var(--sp-3); }
/* 文と太字の科名が1つの文として流れるように inline-block（inline-flex だと塊に分かれる）。上下の余白で押せる高さ 44px を保つ */
body.ds #shindan-app .sym-dept-link {
  display: inline-block; min-height: 44px; margin: 0; padding: var(--sp-2) 0;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; transform: none;
  font-weight: 400; line-height: 1.8; color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds #shindan-app .sym-dept-link:hover, body.ds #shindan-app .sym-dept-link:focus-visible { color: var(--color-primary); box-shadow: none; transform: none; }
body.ds #shindan-app .rx-list { gap: 0; }
body.ds #shindan-app .rx {
  display: block; padding: var(--sp-4) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #shindan-app .rx h4 { margin: 0 0 var(--sp-2); font-size: var(--fs-md); }
body.ds #shindan-app .rx .rx-tools { margin-bottom: var(--sp-2); font-size: var(--fs-sm); font-weight: 500; color: var(--color-accent-strong); }
body.ds #shindan-app .rx p { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg); }
/* 補助金の注記：上の処方箋の最後の罫線の下に続ける（線を二重にしない） */
body.ds #shindan-app .subsidy-note {
  display: block; margin-top: 0; padding: var(--sp-4) 0 0;
  background: transparent; border: 0; border-radius: 0;
}
body.ds #shindan-app .subsidy-note p { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #shindan-app .subsidy-note strong { color: var(--color-primary); }

/* ---------- 相談の案内（解除のあと）：淡い地と罫線。紺の地は作らない ---------- */
body.ds #shindan-app .result-cta {
  margin-top: var(--sp-7); padding: var(--sp-6);
  background: var(--color-background); border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line);
  text-align: left;
}
body.ds #shindan-app .result-cta h2 { font-size: var(--fs-xl); line-height: 1.45; color: var(--color-primary); }
body.ds #shindan-app .referral-line {
  display: block; margin-top: var(--sp-5); padding: 0;
  background: transparent; border-radius: 0;
  font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary);
}
body.ds #shindan-app .result-cta__review { margin-top: var(--sp-2); }
body.ds #shindan-app .line-receive { margin-top: var(--sp-6); padding-top: var(--sp-5); border-top: 1px solid var(--glass-line); }
body.ds #shindan-app .line-receive__title { font-size: var(--fs-md); line-height: 1.6; }
body.ds #shindan-app .line-receive__lead { margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #shindan-app .line-receive__steps {
  list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-5);
  margin: var(--sp-4) 0 0; padding: 0;
}
body.ds #shindan-app .line-receive__step { display: flex; align-items: center; gap: var(--sp-3); min-width: 0; }
body.ds #shindan-app .line-receive__no {
  flex: none; font-family: var(--font-head); font-size: var(--fs-lg); font-variant-numeric: tabular-nums; line-height: 1;
  color: var(--color-line-aa);
}
body.ds #shindan-app .line-receive__code { margin-top: var(--sp-4); font-size: var(--fs-xs); line-height: 1.8; color: var(--color-muted-fg); }
body.ds #shindan-app .line-receive__code strong { font-family: var(--font-head); color: var(--color-primary); }

/* =================================================================
   科のページ（dept.html）：中身は dept-page.js が #dept-main の中に描く
   ================================================================= */
/* 小見出しの番号：見えている節だけを数える（hidden の節は箱を作らないので数えない） */
body.ds #dept-main { counter-reset: ds-sec; }
/* 文字を大きくする設定で、長い語句（科名・処方箋の名前・具体例）が枠からはみ出さないよう、入りきらない語句だけ途中で折り返す。
   ふつうの大きさで行に収まる所の折り返しは変わらない */
body.ds #dept-main, body.ds #doctors-grid { overflow-wrap: anywhere; }
body.ds #dept-main .ds-kicker__no::before { counter-increment: ds-sec; content: counter(ds-sec, decimal-leading-zero); }
body.ds #dept-main .ds-h2 .nowrap, body.ds #dept-main .ds-lead .nowrap { display: inline-block; max-width: 100%; white-space: normal; }

/* ---------- ヒーロー：見出しとボタン → 部屋の写真 → 専門分野・概要・主な疾患。写真の上に文字を置かない ---------- */
body.ds .ds-depthero { max-width: none; }
body.ds .ds-depthero.has-photo {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  grid-template-areas: "main photo" "facts photo";
  gap: var(--sp-6) var(--sp-8); align-items: start;
}
body.ds .ds-depthero__main { grid-area: main; min-width: 0; }
body.ds .ds-depthero__photo { grid-area: photo; min-width: 0; margin: 0; }
body.ds .ds-depthero__photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 50%;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds .ds-depthero__facts { grid-area: facts; min-width: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-depthero:not(.has-photo) .ds-depthero__facts { max-width: var(--w-copy); margin-top: var(--sp-6); }
body.ds .ds-depthero__title { font-size: var(--fs-2xl); line-height: 1.35; color: var(--color-primary); }
body.ds .ds-depthero__catch {
  margin-top: var(--sp-4);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.8;
  font-feature-settings: "palt"; color: var(--color-accent-strong);
}
body.ds .ds-depthero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
body.ds .ds-depthero__facts > p {
  margin: 0; padding-block: var(--sp-3);
  border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary);
}
body.ds .ds-depthero__facts > .ds-depthero__summary { font-size: var(--fs-base); line-height: 1.9; }
body.ds .ds-depthero__disease strong { font-family: var(--font-display); font-weight: 600; letter-spacing: .04em; color: var(--color-primary); }
body.ds .ds-depthero__alias { display: block; margin-top: var(--sp-2); font-size: var(--fs-xs); color: var(--color-muted-fg); }

/* ---------- 症状・回復・診療の特徴と得られること ---------- */
body.ds .ds-symptoms { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-symptoms li {
  padding-block: var(--sp-4); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds .ds-symptoms__note { margin-top: var(--sp-5); }
body.ds .ds-symptoms__note:empty { display: none; }
body.ds .ds-symptoms__note a { color: var(--color-accent-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
body.ds .ds-symptoms__note strong { color: var(--color-primary); }
body.ds #dept-recovery .ds-steps { margin-top: 0; }
body.ds #dept-recovery .ds-h3 { font-size: var(--fs-md); }
body.ds .ds-infolist { border-top: 1px solid var(--glass-line); }
body.ds .ds-infolist__row { padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line); }
body.ds .ds-infolist__title { font-size: var(--fs-md); }
body.ds .ds-infolist__desc { margin-top: var(--sp-2); line-height: 1.9; color: var(--color-secondary); }

/* ---------- 処方箋一覧：カードの格子をやめ、罫線の行（左に名前・右に中身） ---------- */
body.ds #dept-main .ds-levels { margin-bottom: var(--sp-7); }
body.ds #dept-main .ds-levels:empty { display: none; }
body.ds .ds-rx-list { border-top: 1px solid var(--glass-line); }
body.ds .ds-rx-list:empty { display: none; }
body.ds #dept-main .rx-cards { display: block; }
body.ds #dept-main .rx-card {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--sp-4) var(--sp-8);
  padding-block: var(--sp-7); border-bottom: 1px solid var(--glass-line);
}
body.ds #dept-main .rx-card > * { min-width: 0; }
body.ds #dept-main .rx-card > .rx-card-head { grid-column: 1; grid-row: 1 / span 3; }
body.ds #dept-main .rx-card > :not(.rx-card-head) { grid-column: 2; }
body.ds #dept-main .rx-card-headtext { min-width: 0; }
body.ds #dept-main .rx-card-headtext h3 { font-size: var(--fs-lg); line-height: 1.6; }
body.ds #dept-main .rx-card-lead { margin-top: var(--sp-2); font-size: var(--fs-sm); font-weight: 500; line-height: 1.8; color: var(--color-accent-strong); }
body.ds #dept-main .rx-card-examples { gap: 0; border-top: 1px solid var(--glass-line); }
body.ds #dept-main .rx-ex {
  gap: var(--sp-2); padding-block: var(--sp-4); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #dept-main .rx-ex.subtle { padding-left: 0; font-style: normal; color: var(--color-muted-fg); }
body.ds #dept-main .rx-ex-tag {
  display: block; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-xs); letter-spacing: .08em; color: var(--color-accent-strong);
}
/* 「今の仕組み → その結果の事故」は、字下げと細い縦線で示す（読み上げでは「その結果、」） */
body.ds #dept-main .rx-ex-accident {
  display: block; margin-top: var(--sp-2); padding-left: var(--sp-4);
  border-left: 1px solid currentColor; color: var(--c-severe);
}
body.ds #dept-main .data-rx-detail-toggle {
  display: inline-flex; align-items: center; gap: var(--sp-2); min-height: 44px; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds #dept-main .data-rx-detail-toggle:hover { background: transparent; border-color: transparent; color: var(--color-primary); }
body.ds #dept-main .data-rx-detail-toggle .chev { transition: transform var(--t-base) var(--ease); }
/* 相談のボタンは文字の幅のまま並べる（狭い画面では style.css のとおり縦に積んで横いっぱい） */
body.ds #dept-main .data-pkg-cta { gap: var(--sp-3); }
body.ds #dept-main .data-pkg-cta .btn { flex: 0 1 auto; }
body.ds #dept-main .data-rx-detail-body { gap: 0; margin-top: var(--sp-3); border-top: 1px solid var(--glass-line); }
body.ds #dept-main .data-rx-line, body.ds #dept-main .data-rx-block, body.ds #dept-main .rx-card-line {
  padding: var(--sp-3) 0;
  background: transparent; border-bottom: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #dept-main .data-rx-label, body.ds #dept-main .rx-card-label {
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; color: var(--color-accent-strong);
}
body.ds #dept-main .data-rx-line p, body.ds #dept-main .rx-card-line p { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #dept-main .data-rx-deliv, body.ds #dept-main .data-rx-step { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #dept-main .data-rx-deliv.subtle { padding-left: 0; font-style: normal; color: var(--color-muted-fg); }
body.ds #dept-main .data-rx-deliv-tag {
  margin-top: 0; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-size: var(--fs-xs); color: var(--color-accent-strong);
}
/* 外部の道具の紹介（処方箋とは別物）：淡い地で分ける。上の線は前の行の罫線が兼ねる（線を二重にしない） */
body.ds #dept-main .rx-tool-card {
  display: grid; gap: var(--sp-3); margin-block: var(--sp-5); padding: var(--sp-6);
  background: var(--color-background); border: 0; border-radius: 0;
  box-shadow: none;
}
body.ds #dept-main .rx-tool-card > * { min-width: 0; }
body.ds #dept-main .rx-tool-badge {
  display: block; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-xs); letter-spacing: .08em; color: var(--color-accent-strong);
}
body.ds #dept-main .rx-tool-headtext h3 { font-size: var(--fs-lg); line-height: 1.6; }
body.ds #dept-main .rx-tool-tagline { margin-top: var(--sp-2); font-size: var(--fs-sm); font-weight: 500; color: var(--color-accent-strong); }
body.ds #dept-main .rx-tool-body { font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds #dept-main .rx-tool-disclaimer { font-size: var(--fs-xs); line-height: 1.7; color: var(--color-muted-fg); }
body.ds #dept-main .rx-tool-cta { justify-self: start; }
/* 別の科への誘導：前の行の罫線の下に続ける（線を二重にしない） */
body.ds #dept-main .rx-referral {
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-3);
  padding: var(--sp-5) 0; text-align: left;
  background: transparent; border: 0; border-radius: 0;
}
body.ds #dept-main .rx-referral p { font-weight: 500; line-height: 1.8; color: var(--color-secondary); }
/* 処方箋が文字だけの科（AI活用科など） */
body.ds #dept-main .ds-rx-list--simple .svc-card {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--sp-2) var(--sp-8);
  padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line);
}
body.ds #dept-main .ds-rx-list--simple .svc-card > * { min-width: 0; }
body.ds #dept-main .svc-card__title { grid-column: 1; grid-row: 1 / span 2; margin: 0; font-size: var(--fs-md); line-height: 1.6; }
body.ds #dept-main .svc-tools {
  grid-column: 2; justify-self: start; margin: 0; padding: 0;
  background: transparent; border-radius: 0;
  font-size: var(--fs-sm); color: var(--color-accent-strong);
}
body.ds #dept-main .svc-card__desc { grid-column: 2; line-height: 1.9; color: var(--color-secondary); }

/* ---------- レベル別の処方箋（データ活用・マーケティング科／IT体制・情報インフラ科） ---------- */
body.ds #dept-main .data-level-banner, body.ds #dept-main .data-level-cta {
  gap: var(--sp-5); margin-bottom: var(--sp-5); padding: var(--sp-5) 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #dept-main .data-level-text { min-width: 0; }
body.ds #dept-main .data-level-badge {
  min-width: 0; padding: 0;
  background: transparent; border-radius: 0;
  font-family: var(--font-head); font-size: var(--fs-num); font-weight: 500; line-height: 1.1; color: var(--color-accent-strong);
}
body.ds #dept-main .data-level-title { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6; }
body.ds #dept-main .data-level-meaning, body.ds #dept-main .data-pkg-lead { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg); }
body.ds #dept-main .data-pkg-lead b { color: var(--color-primary); }
body.ds #dept-main .data-pkg-list { gap: 0; border-top: 1px solid var(--glass-line); }
body.ds #dept-main .data-pkg {
  display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: var(--sp-4);
  padding: var(--sp-5) var(--sp-3);
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none; opacity: 1;
}
body.ds #dept-main .data-pkg.is-soft { opacity: 1; }
body.ds #dept-main .data-pkg > * { min-width: 0; }
body.ds #dept-main .data-pkg-lv {
  display: block; width: auto; height: auto; min-width: 0; padding: 0;
  background: transparent; border-radius: 0;
  font-family: var(--font-head); font-size: var(--fs-lg); font-weight: 500; line-height: 1.4; color: var(--color-accent-strong);
}
/* 現在地（いまここ）＝淡い地と内側の細い枠と文字。次の一歩＝紺の点線と文字。着地＝紺の外枠 */
body.ds #dept-main .data-pkg.is-mine { background: var(--color-accent-soft); outline: 1px solid var(--color-accent); outline-offset: -1px; box-shadow: none; }
body.ds #dept-main .data-pkg.is-next { outline: 1px dashed var(--color-primary); outline-offset: -1px; box-shadow: none; }
body.ds #dept-main .data-pkg:target { outline: 1px solid var(--color-primary); outline-offset: var(--sp-2); }
body.ds #dept-main .data-pkg-name {
  gap: var(--sp-2) var(--sp-3);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6; color: var(--color-primary);
}
body.ds #dept-main .data-pkg-you, body.ds #dept-main .data-pkg-next {
  padding: 0; background: transparent; border-radius: 0;
  font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em;
}
body.ds #dept-main .data-pkg-you { color: var(--color-accent-strong); }
body.ds #dept-main .data-pkg-next { color: var(--color-primary); }
body.ds #dept-main .data-pkg-note {
  padding: 0; background: transparent; border-radius: 0;
  font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 500; color: var(--color-muted-fg);
}
body.ds #dept-main .data-pkg-target { font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #dept-main .data-pkg-what { font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #dept-main .data-pkg-catch { font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds #dept-main .data-pkg-gate { font-size: var(--fs-xs); border-left: 1px solid var(--color-border-strong); }
body.ds #dept-main .data-pkg-gate.warn {
  background: transparent; border-left-color: var(--c-watch); border-radius: 0;
  font-weight: 500; color: var(--color-primary);
}
body.ds #dept-main .data-pkg-purpose {
  background: transparent; border-left: 1px solid var(--color-accent); border-radius: 0;
  font-size: var(--fs-sm); font-weight: 500;
}
body.ds #dept-main .data-pkg-foot { font-size: var(--fs-xs); line-height: 1.8; color: var(--color-muted-fg); }

/* ---------- 担当の専門家（写真は同じ縦横比の枠。顔を切らない） ---------- */
body.ds #dept-doctor { display: block; max-width: none; margin: 0; border-top: 1px solid var(--glass-line); }
body.ds #dept-doctor .dept-doctor-card {
  display: block; padding-block: var(--sp-6); overflow: visible;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none;
}
body.ds #dept-doctor .dept-doctor-head { display: flex; align-items: flex-end; gap: var(--sp-5); padding: 0; }
body.ds #dept-doctor .dept-doctor-headinfo { min-width: 0; }
body.ds #dept-doctor .dept-doctor-photo {
  flex: none; width: 10rem; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: 50% 30%;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds #dept-doctor .dept-doctor-name { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-xl); line-height: 1.45; }
body.ds #dept-doctor .dept-doctor-kana {
  display: block; margin: var(--sp-2) 0 0; white-space: normal;
  font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 400; letter-spacing: .08em; color: var(--color-muted-fg);
}
body.ds #dept-doctor .dept-doctor-role { margin: var(--sp-2) 0 0; font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds #dept-doctor .dept-doctor-body { max-width: var(--w-copy); padding: var(--sp-5) 0 0; }
body.ds #dept-doctor .dept-doctor-msg-label {
  margin: var(--sp-5) 0 var(--sp-2); padding-top: var(--sp-3);
  border-top: 1px solid var(--glass-line);
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .12em; color: var(--color-accent-strong);
}
body.ds #dept-doctor .dept-doctor-body > :first-child { margin-top: 0; }
body.ds #dept-doctor .dept-doctor-msg-label::before { display: none; }
body.ds #dept-doctor .dept-doctor-msg, body.ds #dept-doctor .dept-doctor-list { font-size: var(--fs-base); }
/* 実績の数：縦線は使わず間隔で分ける（折り返したとき行末に線が残らないように） */
body.ds #dept-doctor .dept-doctor-stats { flex-wrap: wrap; gap: var(--sp-3) var(--sp-6); margin: var(--sp-5) 0; }
body.ds #dept-doctor .dept-doctor-stat {
  display: inline-flex; align-items: baseline; gap: var(--sp-2);
  margin: 0; padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-size: var(--fs-sm);
}
body.ds #dept-doctor .dept-doctor-stat b { font-family: var(--font-head); font-size: var(--fs-num); font-weight: 500; color: var(--color-primary); }
/* 上の線は見出し（主要導入実績）の線が兼ねる */
body.ds #dept-doctor .dept-doctor-cases { gap: 0; }
body.ds #dept-doctor .dept-doctor-cases li {
  padding: var(--sp-3) 0;
  background: transparent; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  font-size: var(--fs-sm);
}
body.ds #dept-doctor .dept-doctor-case-tag {
  display: block; margin: 0;
  font-family: var(--font-body); font-weight: 700; font-size: var(--fs-xs); color: var(--color-accent-strong);
}
body.ds #dept-doctor .dept-doctor-case-tag + .dept-doctor-case-text { display: block; margin-top: var(--sp-2); }
body.ds #dept-doctor .dept-doctor-case-text:empty { display: none; }
body.ds #dept-doctor .dept-doctor-more { margin-top: var(--sp-4); text-align: left; }
body.ds #dept-doctor .is-preparing .dept-doctor-name { font-size: var(--fs-lg); color: var(--color-secondary); }

/* ---------- ほかの診療科（総合診療・専門外来の区分ごとに、文字の一覧） ---------- */
body.ds .ds-others__group + .ds-others__group { margin-top: var(--sp-6); }
body.ds .ds-others__title {
  margin-bottom: var(--sp-2); padding-bottom: var(--sp-2);
  border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-md);
}
body.ds .ds-others__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--sp-6);
}
body.ds .ds-others__item { display: flex; flex-wrap: wrap; align-items: center; min-width: 0; min-height: 44px; border-bottom: 1px solid var(--glass-line); }
body.ds .ds-others__link {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--color-primary);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .ds-others__link:hover { color: var(--color-accent-strong); }

/* =================================================================
   専門家の一覧（doctors.html）：人物ごとに罫線の行。左に写真と名前（広い画面では止まる）・右に本文
   ================================================================= */
/* 一覧の上の線は .person-grid が引く（節の罫線と二重にしない） */
body.ds #doctors-grid { padding-top: 0; border-top: 0; }
body.ds #doctors-grid .person-grid { display: block; max-width: none; margin: 0; border-top: 1px solid var(--glass-line); }
body.ds #doctors-grid .person-card {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--sp-8);
  padding-block: var(--sp-7); overflow: visible;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none;
}
body.ds #doctors-grid .person-card > * { min-width: 0; }
/* 着地した人：細い枠と氏名の色（白地で 5.9:1） */
body.ds #doctors-grid .person-card:target { box-shadow: none; outline: 1px solid var(--color-accent); outline-offset: var(--sp-3); }
body.ds #doctors-grid .person-card:target .person-card-name { color: var(--color-accent-strong); }
body.ds #doctors-grid .person-card-head { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-4); padding: 0; }
body.ds #doctors-grid .person-card-headinfo { width: 100%; min-width: 0; }
body.ds #doctors-grid .person-card-photo {
  width: 100%; max-width: 16rem; height: auto; aspect-ratio: 4 / 5;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds #doctors-grid .person-card-photo > img { object-position: 50% 30%; }
body.ds #doctors-grid .person-card-name { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-xl); line-height: 1.45; }
body.ds #doctors-grid .person-card-kana {
  display: block; margin: var(--sp-2) 0 0; white-space: normal;
  font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 400; letter-spacing: .08em; color: var(--color-muted-fg);
}
body.ds #doctors-grid .person-card-title { margin: var(--sp-2) 0 0; font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds #doctors-grid .person-card-depts-label { margin: var(--sp-4) 0 var(--sp-2); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg); }
body.ds #doctors-grid .person-card-depts { display: block; border-top: 1px solid var(--glass-line); }
body.ds #doctors-grid .person-card-depts li { border-bottom: 1px solid var(--glass-line); }
body.ds #doctors-grid .dept-chip {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0;
  background: transparent; border: 0; border-radius: 0; transform: none;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm);
}
body.ds #doctors-grid a.dept-chip {
  color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds #doctors-grid a.dept-chip:hover { background: transparent; color: var(--color-primary); transform: none; }
body.ds #doctors-grid span.dept-chip { color: var(--color-secondary); text-decoration: none; }
body.ds #doctors-grid .person-card-body { padding: 0; }
body.ds #doctors-grid .person-card-body > :first-child { margin-top: 0; }
body.ds #doctors-grid .person-card-catch {
  margin: 0 0 var(--sp-5);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.7;
  font-feature-settings: "palt"; color: var(--color-primary);
}
body.ds #doctors-grid .person-card-msg-label {
  display: block; margin: var(--sp-6) 0 var(--sp-2); padding-top: var(--sp-4);
  border-top: 1px solid var(--glass-line);
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .12em; color: var(--color-accent-strong);
}
body.ds #doctors-grid .person-card-msg-label::before { display: none; }
body.ds #doctors-grid .person-card-msg, body.ds #doctors-grid .person-card-list { font-size: var(--fs-base); color: var(--color-secondary); }
/* SNS・関連リンク：押せる高さ 44px を保ち、長い URL は枠の中で折り返す */
body.ds #doctors-grid .person-card-list a { display: inline-flex; align-items: center; max-width: 100%; min-height: 44px; overflow-wrap: anywhere; }
body.ds #doctors-grid .person-grid-empty { text-align: left; }

/* =================================================================
   第2弾：講座・予約・Lab.・専門家の申請のページ
   （kouza.html・kouza-line.html・yoyaku.html・lab.html・lab-student.html・doctor-apply.html）
   ページの入れ物の id か、第2弾で足した ds- の部品で絞る。トップと第1弾の4ページには当てない
   ================================================================= */

/* ---------- ページの頭（写真つき）：左に見出しと本文・右に写真。狭い画面では 本文 → 写真 ---------- */
body.ds .ds-pagehero__grid {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--sp-6) var(--sp-8); align-items: center;
}
body.ds .ds-pagehero__grid > * { min-width: 0; }
body.ds .ds-pagehero__main { overflow-wrap: anywhere; }
body.ds .ds-pagehero__main .ds-lead { max-width: var(--w-copy); }
body.ds .ds-pagehero__photo { margin: 0; }
body.ds .ds-pagehero__photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 50%;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
/* 相談室の写真（横長 16:9）は、女性とテーブルを残して 3:2 に切る */
body.ds .ds-pagehero__photo--soudan img { object-position: 30% 50%; }
/* 見出しの中の強調（白地で 7.6:1）と、スクールの名前（英字は固有名詞なので残す） */
body.ds .ds-h1__em { color: var(--color-accent-strong); }
body.ds .ds-h1__sub {
  display: block; margin-top: var(--sp-2);
  font-family: var(--font-head); font-size: var(--fs-md); font-weight: 500; letter-spacing: .06em; line-height: 1.6;
  color: var(--color-accent-strong);
}
body.ds .ds-pagehero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
body.ds .ds-pagehero__alt { margin-top: var(--sp-3); }

/* ---------- 横の写真（講座の申込の節の見出しの列。2列になる広い画面だけ） ---------- */
body.ds .ds-side-photo { margin: var(--sp-6) 0 0; }
body.ds .ds-side-photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}

/* ---------- フォーム（講座の申込・開催相談・予約・Lab. の2つ）：中身は変えず、見た目だけ ---------- */
body.ds #event-apply-wrap, body.ds #kouza-form-wrap, body.ds #lab-sponsor-form-wrap, body.ds #lab-student-form-wrap,
body.ds #booking .ds-form-wrap { max-width: none; margin-inline: 0; }
body.ds #event-apply-form, body.ds #kouza-form, body.ds #booking-form, body.ds #lab-sponsor-form, body.ds #lab-student-form {
  padding: var(--sp-6); overflow-wrap: anywhere;
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none;
}
body.ds #event-apply-form .form-field label, body.ds #event-apply-form .consent,
body.ds #kouza-form .form-field label, body.ds #kouza-form .consent,
body.ds #booking-form .form-field label, body.ds #booking-form .consent,
body.ds #lab-sponsor-form .form-field label, body.ds #lab-sponsor-form .consent,
body.ds #lab-student-form .form-field label, body.ds #lab-student-form .consent {
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary);
}
/* 同意の文：文字を大きくする設定で、長い語句（プライバシーポリシー）が枠を押し広げないように */
body.ds #event-apply-form .consent > span, body.ds #kouza-form .consent > span, body.ds #booking-form .consent > span,
body.ds #lab-sponsor-form .consent > span, body.ds #lab-student-form .consent > span { min-width: 0; }
/* 同意のチェック：ラベル全体が押せる所なので、1行に収まる広い画面でも高さ 44px を保つ */
body.ds #event-apply-form .consent, body.ds #kouza-form .consent, body.ds #booking-form .consent,
body.ds #lab-sponsor-form .consent, body.ds #lab-student-form .consent, body.ds #apply-form .da-consent { min-height: 44px; }
/* 入力欄の枠は --color-faint-fg（白地で 4.76:1） */
body.ds #event-apply-form .form-field input, body.ds #event-apply-form .dock-select, body.ds #event-apply-form .dock-textarea,
body.ds #kouza-form .form-field input, body.ds #kouza-form .dock-textarea,
body.ds #booking-form .form-field input, body.ds #booking-form .dock-textarea,
body.ds #lab-sponsor-form .form-field input, body.ds #lab-sponsor-form .dock-select,
body.ds #lab-student-form .form-field input, body.ds #lab-student-form .dock-select {
  font-size: var(--fs-base); border: 1px solid var(--color-faint-fg); border-radius: var(--r-sm);
}
body.ds #event-apply-form .form-field input:focus, body.ds #event-apply-form .dock-select:focus, body.ds #event-apply-form .dock-textarea:focus,
body.ds #kouza-form .form-field input:focus, body.ds #kouza-form .dock-textarea:focus,
body.ds #booking-form .form-field input:focus, body.ds #booking-form .dock-textarea:focus,
body.ds #lab-sponsor-form .form-field input:focus, body.ds #lab-sponsor-form .dock-select:focus,
body.ds #lab-student-form .form-field input:focus, body.ds #lab-student-form .dock-select:focus {
  box-shadow: none; outline: 3px solid var(--color-accent); outline-offset: 2px; border-color: var(--color-accent);
}
/* 誤りの枠（上の指定が強いので書き直す） */
body.ds #event-apply-form .form-field input.invalid, body.ds #event-apply-form .dock-select.invalid, body.ds #event-apply-form .dock-textarea.invalid,
body.ds #kouza-form .form-field input.invalid, body.ds #kouza-form .dock-textarea.invalid,
body.ds #booking-form .form-field input.invalid, body.ds #booking-form .dock-textarea.invalid,
body.ds #lab-sponsor-form .form-field input.invalid, body.ds #lab-sponsor-form .dock-select.invalid,
body.ds #lab-student-form .form-field input.invalid, body.ds #lab-student-form .dock-select.invalid { border-color: var(--color-destructive); }
body.ds #event-apply-form .form-error, body.ds #kouza-form .form-error, body.ds #booking-form .form-error,
body.ds #lab-sponsor-form .form-error, body.ds #lab-student-form .form-error { text-align: left; }
body.ds #event-apply-form .btn-block, body.ds #kouza-form .btn-block, body.ds #booking-form .btn-block,
body.ds #lab-sponsor-form .btn-block, body.ds #lab-student-form .btn-block { margin-top: var(--sp-5); }
body.ds #event-apply-form .ev-photo-note { font-size: var(--fs-sm); }
body.ds .ds-form-note { margin-top: var(--sp-2); text-align: center; font-size: var(--fs-xs); color: var(--color-muted-fg); }
/* 欄の下の小さな説明（Lab. のメールと緊急連絡先） */
body.ds #lab-sponsor-form .disclaimer, body.ds #lab-student-form .disclaimer { margin-top: var(--sp-2); font-size: var(--fs-xs); line-height: 1.7; color: var(--color-muted-fg); }

/* ---------- 完了の帯（送ったあとに JS が描く）：白地と細い枠。チェックの絵は出さない ---------- */
body.ds #event-apply-wrap .sent-banner, body.ds #kouza-form-wrap .sent-banner, body.ds #booking .sent-banner,
body.ds #lab-sponsor-form-wrap .sent-banner, body.ds #lab-student-form-wrap .sent-banner, body.ds #apply-form-wrap .sent-banner {
  max-width: none; margin: 0; padding: var(--sp-5);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  text-align: left;
}
body.ds #event-apply-wrap .sent-banner svg, body.ds #kouza-form-wrap .sent-banner svg, body.ds #booking .sent-banner svg,
body.ds #lab-sponsor-form-wrap .sent-banner svg, body.ds #lab-student-form-wrap .sent-banner svg, body.ds #apply-form-wrap .sent-banner svg { display: none; }
body.ds #event-apply-wrap .sent-banner strong, body.ds #kouza-form-wrap .sent-banner strong, body.ds #booking .sent-banner strong,
body.ds #lab-sponsor-form-wrap .sent-banner strong, body.ds #lab-student-form-wrap .sent-banner strong, body.ds #apply-form-wrap .sent-banner strong {
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6;
  color: var(--color-primary);
}
body.ds #event-apply-wrap .sent-banner span, body.ds #kouza-form-wrap .sent-banner span, body.ds #booking .sent-banner span,
body.ds #lab-sponsor-form-wrap .sent-banner span, body.ds #lab-student-form-wrap .sent-banner span, body.ds #apply-form-wrap .sent-banner span {
  margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary);
}
body.ds #event-apply-wrap .sent-banner .receipt-no, body.ds #kouza-form-wrap .sent-banner .receipt-no, body.ds #booking .sent-banner .receipt-no,
body.ds #lab-sponsor-form-wrap .sent-banner .receipt-no, body.ds #lab-student-form-wrap .sent-banner .receipt-no, body.ds #apply-form-wrap .sent-banner .receipt-no {
  margin: var(--sp-2) 0 0; padding: 0 var(--sp-2);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-xs);
  font-size: var(--fs-sm); color: var(--color-primary);
}
body.ds #event-apply-wrap .sent-banner .receipt-no b, body.ds #kouza-form-wrap .sent-banner .receipt-no b, body.ds #booking .sent-banner .receipt-no b,
body.ds #lab-sponsor-form-wrap .sent-banner .receipt-no b, body.ds #lab-student-form-wrap .sent-banner .receipt-no b, body.ds #apply-form-wrap .sent-banner .receipt-no b {
  font-family: var(--font-head);
}

/* ---------- 準備中の案内（Lab. の申込）：上下の細い線と文字だけ ---------- */
body.ds .ds-prep { overflow-wrap: anywhere; padding: var(--sp-5) 0; border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line); }
body.ds .ds-prep__title { font-size: var(--fs-lg); }
body.ds .ds-prep > p { margin-top: var(--sp-2); line-height: 1.9; color: var(--color-secondary); }

/* ---------- Lab. の物語（本文・箇条・強調・章の結論）と経営者の声 ---------- */
body.ds .ds-story { max-width: var(--w-copy); overflow-wrap: anywhere; }
body.ds .ds-story > p { margin-top: var(--sp-4); line-height: 2; color: var(--color-secondary); }
body.ds .ds-story > p:first-child { margin-top: 0; }
body.ds .ds-story__list { list-style: none; margin: var(--sp-5) 0 0; padding: 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-story__list li {
  position: relative; padding: var(--sp-3) 0 var(--sp-3) var(--sp-5);
  border-bottom: 1px solid var(--glass-line);
  line-height: 1.8; color: var(--color-secondary);
}
/* 箇条の頭は短い横線（1行目の中ほど） */
body.ds .ds-story__list li::before {
  content: ""; position: absolute; left: 0; top: calc(var(--sp-3) + .9em);
  width: var(--sp-3); height: 1px; background: var(--color-accent-strong);
}
body.ds .ds-story > .ds-story__emphasis {
  margin-top: var(--sp-6); padding-top: var(--sp-5);
  border-top: 1px solid var(--glass-line);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.8;
  font-feature-settings: "palt"; color: var(--color-primary);
}
/* 箇条のすぐ後の強調は、箇条の最後の線が上の線を兼ねる（線を二重にしない） */
body.ds .ds-story > .ds-story__list + .ds-story__emphasis { padding-top: 0; border-top: 0; }
body.ds .ds-story__emphasis strong { font-weight: 600; color: var(--color-accent-strong); }
/* 章の結論：紺の帯をやめ、上に紺の細い線＋明朝の大きな文字 */
body.ds .ds-story > .ds-story__key {
  margin-top: var(--sp-7); padding-top: var(--sp-5);
  border-top: 1px solid var(--color-primary);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-xl); letter-spacing: .04em; line-height: 1.7;
  font-feature-settings: "palt"; word-break: auto-phrase; color: var(--color-primary);
}
body.ds .ds-voices { margin: var(--sp-6) 0; border-top: 1px solid var(--glass-line); }
body.ds .ds-voices__quote {
  margin: 0; padding: var(--sp-4) 0;
  border-bottom: 1px solid var(--glass-line);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.7;
  font-feature-settings: "palt"; color: var(--color-primary);
}

/* ---------- Lab. のコース：罫線の行の2列（カードの格子をやめる） ---------- */
body.ds .ds-courses {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--sp-8);
  border-top: 1px solid var(--glass-line);
  overflow-wrap: anywhere;
}
body.ds .ds-courses__item { min-width: 0; padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line); }
/* 詳しい形（高校生向け）：申込のボタンを行の下にそろえる */
body.ds .ds-courses--detail .ds-courses__item { display: flex; flex-direction: column; align-items: flex-start; }
body.ds .ds-courses__name { font-size: var(--fs-lg); }
/* 「スポット開催」の札：角 6px の細い枠（ピル型にしない） */
body.ds .ds-courses__tag {
  display: inline-block; margin-top: var(--sp-2); padding: 0 var(--sp-2);
  border: 1px solid var(--color-accent-strong); border-radius: var(--r-xs);
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .06em; line-height: 1.8; color: var(--color-accent-strong);
}
body.ds .ds-courses__desc { margin-top: var(--sp-2); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-courses__points { list-style: none; margin: var(--sp-3) 0 0; padding: 0; }
body.ds .ds-courses__points li { position: relative; padding-left: var(--sp-5); font-size: var(--fs-sm); line-height: 1.9; color: var(--color-secondary); }
body.ds .ds-courses__points li::before {
  content: ""; position: absolute; left: 0; top: .95em;
  width: var(--sp-3); height: 1px; background: currentColor;
}
body.ds .ds-courses__action { margin-top: var(--sp-4); }
body.ds .ds-courses--detail .ds-courses__action { margin-top: auto; padding-top: var(--sp-4); }
body.ds #sponsor .ds-values, body.ds #about .ds-values { margin-top: 0; overflow-wrap: anywhere; }
body.ds #about .ds-values__body strong { color: var(--color-primary); }

/* ---------- 出張講座の一覧（#kouza-list。中身は kouza.js が描く）：罫線の行。左に札・右に本文 ---------- */
body.ds #kouza-list { max-width: none; margin: 0; overflow-wrap: anywhere; }
body.ds #kouza-list .kouza-loading, body.ds #kouza-list .kouza-empty { text-align: left; padding: var(--sp-5) 0; color: var(--color-muted-fg); }
body.ds #kouza-list .kouza-line-link { display: inline-flex; align-items: center; min-height: 44px; }
/* 状況行（写しを見せているとき・読み込めないとき）：上下の細い線と文字 */
body.ds #kouza-status.is-kept { max-width: none; margin: 0 0 var(--sp-4); }
body.ds #kouza-status:not(:empty) {
  max-width: none; margin: 0 0 var(--sp-4); padding: var(--sp-3) 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line); border-radius: 0;
  font-size: var(--fs-sm); line-height: 1.7; color: var(--color-secondary);
}
/* 群れ（これからの予定・これまでの開催）：見出しの下の線が、最初の行の上の線を兼ねる */
body.ds #kouza-list .kouza-group + .kouza-group { margin-top: var(--sp-8); }
body.ds #kouza-list .kouza-group-head {
  display: flex; align-items: baseline; gap: var(--sp-3);
  margin: 0; padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--glass-line);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; color: var(--color-primary);
}
body.ds #kouza-list .kouza-group-count {
  padding: 0; background: transparent; border-radius: 0;
  font-family: var(--font-head); font-weight: 500; font-size: var(--fs-sm); color: var(--color-muted-fg);
}
body.ds #kouza-list .kouza-group-list { display: block; }
/* 1回ぶんの行：実施済みも薄くしない（札の文字で分かる） */
body.ds #kouza-list .kouza-item {
  display: grid; grid-template-columns: 9rem minmax(0, 1fr);
  column-gap: var(--sp-6); row-gap: var(--sp-2); align-items: start;
  padding: var(--sp-6) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none; opacity: 1;
}
body.ds #kouza-list .kouza-item.is-done { opacity: 1; }
/* 「さらに表示」で隠している行（上の grid より強く書き直す） */
body.ds #kouza-list .kouza-item.is-hidden { display: none; }
body.ds #kouza-list .kouza-item > * { min-width: 0; }
body.ds #kouza-list .kouza-item-status, body.ds #kouza-list .kouza-item-type, body.ds #kouza-list .kouza-item-seats { grid-column: 1; justify-self: start; }
body.ds #kouza-list .kouza-item-body { grid-column: 2; grid-row: 1 / span 4; }
/* 札：ピル型をやめ、角 6px の細い枠（状態）と文字（種類・残席） */
body.ds #kouza-list .kouza-item-status {
  padding: 0 var(--sp-2);
  background: transparent; border: 1px solid var(--color-primary); border-radius: var(--r-xs);
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .06em; line-height: 1.8; color: var(--color-primary);
  white-space: normal; /* シートに長い状態の文字が入っても、左の列の中で折り返す */
}
body.ds #kouza-list .kouza-item.is-fixed .kouza-item-status { background: transparent; border-color: var(--color-accent-strong); color: var(--color-accent-strong); }
body.ds #kouza-list .kouza-item.is-done .kouza-item-status { background: transparent; border-color: var(--glass-line); color: var(--color-muted-fg); }
body.ds #kouza-list .kouza-item-type {
  padding: 0; background: transparent; border-radius: 0;
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .06em; color: var(--color-secondary);
}
body.ds #kouza-list .kouza-item-seats {
  padding: 0; background: transparent; border-radius: 0;
  font-size: var(--fs-sm); font-weight: 500; color: var(--color-primary);
}
body.ds #kouza-list .kouza-item-seats b { font-family: var(--font-head); font-size: var(--fs-md); font-weight: 500; font-variant-numeric: tabular-nums; }
body.ds #kouza-list .kouza-item-seats.is-full { color: var(--c-severe); }
body.ds #kouza-list .kouza-item-seats.is-closed, body.ds #kouza-list .kouza-item-seats.is-pending { color: var(--color-muted-fg); }
/* 本文：テーマは明朝（見出しにはしない）・日時と場所は1行に並べる。飾りのアイコンは出さない */
body.ds #kouza-list .kouza-item-theme {
  margin: 0 0 var(--sp-3);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); letter-spacing: .04em; line-height: 1.6;
  font-feature-settings: "palt"; color: var(--color-primary);
}
body.ds #kouza-list .kouza-item-meta { gap: var(--sp-2) var(--sp-5); font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds #kouza-list .kouza-item-meta svg { display: none; }
body.ds #kouza-list .kouza-item-date { font-family: var(--font-head); font-variant-numeric: tabular-nums; }
body.ds #kouza-list .kouza-item-fee {
  padding: 0; background: transparent; border-radius: 0;
  font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary);
}
body.ds #kouza-list .kouza-item-map {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
}
body.ds #kouza-list .kouza-item-map-tag {
  margin-left: var(--sp-2); padding: 0 var(--sp-2);
  background: transparent; border: 1px solid currentColor; border-radius: var(--r-xs);
  font-size: var(--fs-xs); font-weight: 500; color: inherit;
}
body.ds #kouza-list .kouza-item-detail {
  max-width: var(--w-copy); margin: var(--sp-3) 0 0;
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds #kouza-list .kouza-item-reco {
  max-width: var(--w-copy); margin: var(--sp-4) 0 0; padding: 0;
  background: transparent; border-left: 0; border-radius: 0;
}
body.ds #kouza-list .kouza-item-reco-head { font-size: var(--fs-sm); font-weight: 500; color: var(--color-accent-strong); }
body.ds #kouza-list .kouza-item-reco-body { font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
/* 長い本文の続きの印：行の地と同じ白い帯と、上に青い点線（ぼかしは使わない）。最後まで読むと消える（style.css）。
   帯の外側の白い縁で、点線のすぐ上の文字を少し隠す（点線が最後の行の下線に見えないように） */
body.ds #kouza-list .kouza-item-detail.is-scroll::after, body.ds #kouza-list .kouza-item-reco-body.is-scroll::after {
  outline: var(--sp-3) solid var(--color-surface); outline-offset: 0;
  background: var(--color-surface); border-top: 1px dashed var(--color-accent);
}
body.ds #kouza-list .kouza-item-reco-body.is-scroll::-webkit-scrollbar-track { background: var(--color-surface); }
/* ボタン：色と丸い端は style.css のまま。影を消し、押せる高さを 44px に */
body.ds #kouza-list .kouza-item-cta {
  min-height: 44px; padding: 0 var(--sp-5);
  box-shadow: none;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm);
}
/* 「さらに表示」：下線の文字ボタン */
body.ds #kouza-list .kouza-more {
  display: inline-flex; align-items: center; width: auto; min-height: 44px;
  margin-top: var(--sp-4); padding: 0;
  background: transparent; border: 0; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds #kouza-list .kouza-more:hover { background: transparent; color: var(--color-primary); }
/* 画像の前後のボタン（四角）と、拡大表示の閉じる・前後のボタン */
body.ds #kouza-list .kouza-gallery-nav { flex-wrap: wrap; justify-content: flex-start; }
body.ds #kouza-list .kouza-gallery-btn { border-radius: var(--r-sm); }
body.ds #kouza-list .kouza-gallery-btn:hover:not(:disabled) { background: var(--color-surface); border-color: var(--color-accent); }
body.ds .kouza-viewer .kouza-viewer-close, body.ds .kouza-viewer .kouza-gallery-btn { border-radius: var(--r-sm); }

/* ---------- 講座の申込（#event-apply）：選んだ回の要約・完了のあとの支払いと LINE ---------- */
body.ds #event-apply { scroll-margin-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-5)); }
body.ds #ev-summary {
  margin-top: var(--sp-4); padding: 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0;
  font-size: var(--fs-sm); line-height: 1.85; color: var(--color-secondary);
}
body.ds #ev-summary .ev-summary-title {
  display: block; margin: var(--sp-3) 0 var(--sp-2);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; line-height: 1.6;
  color: var(--color-primary);
}
body.ds #ev-summary .ev-summary-row {
  display: grid; grid-template-columns: 6em minmax(0, 1fr); gap: var(--sp-3);
  padding-block: var(--sp-2); border-bottom: 1px solid var(--glass-line);
}
body.ds #ev-summary .ev-summary-label { font-weight: 500; color: var(--color-muted-fg); }
body.ds #ev-summary .ev-summary-note { padding-top: var(--sp-3); font-weight: 500; color: var(--color-primary); }
body.ds #event-apply-wrap .ev-empty { padding: var(--sp-5) 0; text-align: left; }
body.ds #event-apply-wrap .ev-pay {
  min-height: 44px; box-shadow: none;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-base);
}
body.ds #event-apply-wrap .ev-line {
  max-width: none; margin: var(--sp-4) 0 0; padding: var(--sp-5);
  border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  text-align: left;
}
body.ds #event-apply-wrap .ev-line-lead { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); letter-spacing: .04em; }
body.ds #event-apply-wrap .ev-line-how { font-size: var(--fs-sm); color: var(--color-secondary); }
body.ds #event-apply-wrap .ev-line-btns { justify-content: flex-start; gap: var(--sp-3); }
body.ds #event-apply-wrap .ev-line-add, body.ds #event-apply-wrap .ev-line-recv {
  min-height: 44px; border-width: 1px;
  font-family: var(--font-body); font-weight: 500;
}
/* LINE の印は出さない（文字で分かる。読み上げはもとから無し） */
body.ds #event-apply-wrap .ev-line-add svg { display: none; }

/* ---------- 講座の一覧と申込の組（.ds-kouza-pair）：広い画面は 左に一覧・右に申込、狭い画面は 一覧 → 申込 の順に積む ---------- */
body.ds .ds-kouza-pair__grid > * { min-width: 0; }
/* 申込ボタン（#kouza-jump。受付中の回があるときだけ kouza.js が hidden を外す）。画面の下に留める帯は狭い画面の規則で付ける */
body.ds .ds-kouza-pair #kouza-jump { margin: var(--sp-6) 0 0; }
body.ds .ds-kouza-pair #kouza-jump .btn { width: 100%; min-height: 48px; padding: var(--sp-2) var(--sp-4); }

/* ---------- 過去の回（#kouza-list の details.kouza-past。kouza.js が描く）：日付・種類・題名の1行に畳み、押すと今のカードを開く。
   罫線の行と、右端の ＋／− の印（トップのよくある質問 .ds-acc と同じ、細い2本の線。開いたら縦の線を縮めて − にする） ---------- */
body.ds #kouza-list .kouza-past { border-bottom: 1px solid var(--glass-line); }
body.ds #kouza-list .kouza-past.is-hidden { display: none; }
body.ds #kouza-list .kouza-past-sum {
  display: grid; grid-template-columns: 9rem minmax(3rem, auto) minmax(0, 1fr) calc(var(--sp-4) + 1px);
  column-gap: var(--sp-4); row-gap: var(--sp-2); align-items: baseline;
  min-height: 44px; padding: var(--sp-4) 0;
  list-style: none; cursor: pointer;
}
body.ds #kouza-list .kouza-past-sum::-webkit-details-marker { display: none; }
body.ds #kouza-list .kouza-past-date {
  grid-column: 1; grid-row: 1;
  font-family: var(--font-head); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; letter-spacing: .04em; color: var(--color-secondary);
}
body.ds #kouza-list .kouza-past-kind { grid-column: 2; grid-row: 1; font-size: var(--fs-xs); font-weight: 500; letter-spacing: .06em; color: var(--color-secondary); }
body.ds #kouza-list .kouza-past-theme {
  grid-column: 3; grid-row: 1;
  font-size: var(--fs-base); font-weight: 500; line-height: 1.7; color: var(--color-primary);
  transition: color var(--t-fast) var(--ease);
}
body.ds #kouza-list .kouza-past-sum:hover .kouza-past-theme { color: var(--color-accent-strong); }
body.ds #kouza-list .kouza-past-sum::before, body.ds #kouza-list .kouza-past-sum::after {
  content: ""; grid-column: 4; grid-row: 1; align-self: center; justify-self: center;
  background: var(--color-accent-strong);
}
body.ds #kouza-list .kouza-past-sum::before { width: calc(var(--sp-4) + 1px); height: 1px; }
body.ds #kouza-list .kouza-past-sum::after { width: 1px; height: calc(var(--sp-4) + 1px); transition: height var(--t-base) var(--ease); }
body.ds #kouza-list .kouza-past[open] > .kouza-past-sum::after { height: 0; }
/* 開いた中身は今のカードの規則のまま。行の下の線は details が引くので、カードの線は重ねない */
body.ds #kouza-list .kouza-past > .kouza-item { padding-top: var(--sp-2); border-bottom: 0; }

/* ---------- 予約（#booking。空き枠と完了は booking.js が描く） ---------- */
body.ds #booking { overflow-wrap: anywhere; }
/* 読みやすい幅に収める（節の罫線はページの幅のまま） */
body.ds #booking > *, body.ds .bk-alt { max-width: 56rem; }
body.ds #booking .bk-step { margin-bottom: 0; }
body.ds #booking .bk-step + .bk-step { margin-top: var(--sp-7); padding-top: var(--sp-6); border-top: 1px solid var(--glass-line); }
body.ds #booking .bk-step-h { align-items: baseline; gap: var(--sp-3); margin-bottom: var(--sp-4); font-size: var(--fs-lg); }
/* 手順の番号：丸い台座をやめ、Figtree の数字だけ（読み上げは「手順1、」） */
body.ds #booking .bk-num {
  display: inline; width: auto; height: auto;
  background: transparent; border-radius: 0;
  font-family: var(--font-head); font-weight: 500; font-size: var(--fs-md); font-variant-numeric: tabular-nums;
  color: var(--color-accent-strong);
}
/* 相談方法：選んだ印は「ラジオの印・枠・淡い地」の3つ */
body.ds #booking .bk-methods { gap: var(--sp-3); }
body.ds #booking .bk-method {
  gap: var(--sp-3); min-height: 44px; padding: var(--sp-4);
  background: var(--color-surface); border: 1px solid var(--color-faint-fg); border-radius: var(--r-sm);
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
body.ds #booking .bk-method:hover { background: var(--color-surface); border-color: var(--color-accent); }
body.ds #booking .bk-method:has(input:checked) { background: var(--color-accent-soft); border-color: var(--color-accent); box-shadow: none; }
body.ds #booking .bk-method strong { font-weight: 500; color: var(--color-primary); }
body.ds #booking .bk-method small { font-size: var(--fs-xs); color: var(--color-muted-fg); }
/* 日時の枠：カードの格子をやめ、日ごとの罫線の行（左に日付・右に時間） */
body.ds #booking .bk-loading { color: var(--color-muted-fg); }
body.ds #booking .bk-days { display: block; border-top: 1px solid var(--glass-line); }
body.ds #booking .bk-day {
  display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: var(--sp-2) var(--sp-5); align-items: start;
  padding: var(--sp-4) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
}
body.ds #booking .bk-day-h {
  display: flex; align-items: center; min-height: 44px; margin: 0;
  font-family: var(--font-head); font-weight: 500; font-size: var(--fs-sm); color: var(--color-primary);
}
body.ds #booking .bk-slot-row { gap: var(--sp-2); }
/* 時間のボタン：四角（角 6px）。文字の色は style.css のまま（選ぶと白） */
body.ds #booking .bk-slot {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 4.5rem; min-height: 44px; padding: 0 var(--sp-3);
  background: var(--color-surface); border: 1px solid var(--color-accent); border-radius: var(--r-xs);
  font-family: var(--font-head); font-size: var(--fs-sm); font-weight: 500; font-variant-numeric: tabular-nums;
  transition: background-color var(--t-fast) var(--ease);
}
body.ds #booking .bk-slot:hover { background: var(--color-accent-soft); }
body.ds #booking .bk-slot.is-on, body.ds #booking .bk-slot[aria-pressed="true"] { background: var(--color-accent-strong); border-color: var(--color-accent-strong); }
body.ds #booking .bk-slot.is-off { background: var(--color-surface-2); border-color: transparent; color: var(--color-muted-fg); }
/* 「選択中：…」（選んだあとにフォーカスが移る）。上の線は日の最後の行の線が兼ねる */
body.ds #booking .bk-chosen { margin-top: 0; padding-top: var(--sp-3); font-weight: 500; font-size: var(--fs-base); color: var(--color-primary); }
body.ds #booking .bk-done-wrap > p { margin-top: var(--sp-3); line-height: 1.9; color: var(--color-secondary); }
/* 日程が合わないとき（メール・LINE）。文の途中のリンクなので下線の文字 */
body.ds .bk-alt { margin-top: var(--sp-6); text-align: left; line-height: 1.9; color: var(--color-secondary); }
body.ds .bk-alt a { color: var(--color-accent-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }

/* ---------- Lab. の開催状況（#lab-status-list。lab.js が描く）：罫線の行と文字の札 ---------- */
body.ds #lab-status-list { display: block; border-top: 1px solid var(--glass-line); overflow-wrap: anywhere; }
body.ds #lab-status-list .status-card {
  padding: var(--sp-5) 0;
  background: transparent; border: 0; border-bottom: 1px solid var(--glass-line); border-radius: 0;
  box-shadow: none;
}
body.ds #lab-status-list .status-card-head { justify-content: flex-start; align-items: baseline; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin-bottom: var(--sp-3); }
body.ds #lab-status-list .status-card-head h3 { font-size: var(--fs-lg); }
body.ds #lab-status-list .status-badge {
  padding: 0 var(--sp-2);
  background: transparent; border: 1px solid currentColor; border-radius: var(--r-xs);
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-xs); line-height: 1.8;
}
body.ds #lab-status-list .status-badge.is-open { background: transparent; color: var(--color-accent-strong); }
body.ds #lab-status-list .status-badge.is-live { background: transparent; color: var(--color-primary); }
body.ds #lab-status-list .status-badge.is-full { background: transparent; color: var(--c-severe); }
body.ds #lab-status-list .status-badge.is-prep { background: transparent; color: var(--color-muted-fg); }
body.ds #lab-status-list .status-row {
  display: grid; grid-template-columns: 6em minmax(0, 1fr); gap: var(--sp-3);
  margin: 0; padding-block: var(--sp-2);
  font-size: var(--fs-sm); color: var(--color-secondary);
}
body.ds #lab-status-list .status-row span { width: auto; color: var(--color-muted-fg); }
body.ds #lab-status-list .status-note { font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds #lab-status-list #lab-status-fallback { padding: var(--sp-4) 0; font-size: var(--fs-sm); color: var(--color-muted-fg); }

/* ---------- 専門家の申請（doctor-apply.html）：募集の説明と、罫線で区切ったフォーム ---------- */
body.ds .da-recruit { max-width: var(--w-copy); overflow-wrap: anywhere; }
body.ds .da-recruit > p { margin-top: var(--sp-4); line-height: 1.9; color: var(--color-secondary); }
body.ds .da-recruit > p:first-child { margin-top: 0; font-size: var(--fs-md); color: var(--color-primary); }
body.ds .da-form { overflow-wrap: anywhere; }
/* 読みやすい幅に収める（節の罫線はページの幅のまま） */
body.ds .da-form > * { max-width: 48rem; }
body.ds .da-form .apply-note {
  margin-bottom: var(--sp-6); padding: var(--sp-4) var(--sp-5);
  background: var(--color-background); border-radius: var(--r-sm);
  font-size: var(--fs-sm); line-height: 1.9; color: var(--color-secondary);
}
body.ds .da-form .apply-note b { color: var(--color-primary); }
body.ds #apply-form .da-sec {
  margin: 0; padding: var(--sp-6) 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0;
}
/* 同意の塊（div.da-sec）は下の余白を持たない（同意と送信ボタンを離しすぎない） */
body.ds #apply-form div.da-sec { padding-bottom: 0; }
body.ds #apply-form .da-sec > h2 { display: flex; align-items: baseline; gap: var(--sp-3); margin: 0 0 var(--sp-5); font-size: var(--fs-lg); }
body.ds #apply-form .da-sec .no { font-family: var(--font-head); font-weight: 500; font-size: var(--fs-md); font-variant-numeric: tabular-nums; color: var(--color-accent-strong); }
/* 欄の並び：広い画面では2列。狭い画面・文字を大きくしたときは自然に1列 */
body.ds #apply-form .da-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16em), 1fr));
  gap: var(--sp-4) var(--sp-5); margin-bottom: var(--sp-4);
}
body.ds #apply-form .da-grid:last-child { margin-bottom: 0; }
body.ds #apply-form .da-field { margin-bottom: var(--sp-4); }
body.ds #apply-form .da-field:last-child, body.ds #apply-form .da-grid > .da-field { margin-bottom: 0; }
body.ds #apply-form .da-field > label {
  display: block; margin-bottom: var(--sp-2);
  font-weight: 500; font-size: var(--fs-sm); line-height: 1.6; color: var(--color-primary);
}
/* 欄の説明（白地で 7.5:1） */
body.ds #apply-form .da-field .hint { display: block; margin-top: var(--sp-2); font-weight: 400; font-size: var(--fs-sm); line-height: 1.7; color: var(--color-muted-fg); }
body.ds #apply-form .req { margin-left: var(--sp-2); font-size: var(--fs-xs); }
body.ds #apply-form .da-field input, body.ds #apply-form .da-field textarea {
  width: 100%; min-height: 44px; padding: var(--sp-3);
  font-family: inherit; font-size: var(--fs-base); line-height: 1.6; color: var(--color-foreground);
  background: var(--color-surface); border: 1px solid var(--color-faint-fg); border-radius: var(--r-sm);
}
/* 例文が3行ある欄でも切れない高さ */
body.ds #apply-form .da-field textarea { min-height: 7em; resize: vertical; line-height: 1.7; }
/* 書き換えられない欄（運営が科を指定したとき）でも、フォーカスの枠は消さない */
body.ds #apply-form .da-field input:focus, body.ds #apply-form .da-field textarea:focus {
  box-shadow: none; outline: 3px solid var(--color-accent); outline-offset: 2px; border-color: var(--color-accent);
}
body.ds #apply-form .da-field input[readonly] {
  background: var(--color-surface-2); border-style: dashed;
  font-weight: 500; color: var(--color-secondary); cursor: not-allowed;
}
body.ds #apply-form .da-field input.invalid, body.ds #apply-form .da-field textarea.invalid { border-color: var(--color-destructive); }
body.ds #apply-form .da-note { margin: 0 0 var(--sp-4); font-size: var(--fs-sm); line-height: 1.7; color: var(--color-muted-fg); }
body.ds #apply-form .da-consent > span { min-width: 0; }
body.ds #apply-form .da-consent { display: flex; align-items: flex-start; gap: var(--sp-3); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary); }
body.ds #apply-form .da-consent input { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--color-accent); }
body.ds #apply-form .da-consent a { color: var(--color-accent-strong); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
body.ds #apply-form .form-error { margin-top: var(--sp-4); text-align: left; }
body.ds #apply-form-wrap { margin-top: var(--sp-5); text-align: left; }

/* ---------- 簡易ヘッダー（予約・LINE の受け取り）：ボタンの縦ずれを直し、押せる高さを 44px に ---------- */
body.ds .nav--simple > .nav-cta { margin: 0 0 0 var(--sp-3); min-height: 44px; padding: 0 var(--sp-4); font-size: var(--fs-sm); }

/* ---------- 講座の案内の LINE 受け取り（kouza-line.html。中身は kouza-line.js が描く） ---------- */
body.ds .kl-section.ds-pagehead { padding-bottom: var(--sp-8); }
body.ds #kl-card {
  padding: var(--sp-6);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none; overflow-wrap: anywhere;
}
body.ds #kl-card .kl-eyebrow {
  display: flex; align-items: center; gap: var(--sp-3);
  margin: 0 0 var(--sp-4);
  font-size: var(--fs-sm); font-weight: 500; letter-spacing: .06em; line-height: 1.6; color: var(--color-primary);
}
body.ds #kl-card .kl-eyebrow::before { content: ""; flex: none; width: var(--sp-5); height: 1px; background: currentColor; }
body.ds #kl-card .kl-title { font-size: var(--fs-xl); line-height: 1.45; }
body.ds #kl-card .kl-body { font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); }
body.ds #kl-card .kl-actions { gap: var(--sp-3); }
body.ds #kl-card .ev-line-add { border-width: 1px; font-family: var(--font-body); font-weight: 500; }
body.ds #kl-card .kl-help {
  margin-top: var(--sp-5); padding: var(--sp-4) 0 0;
  background: transparent; border-top: 1px solid var(--glass-line); border-radius: 0;
  font-size: var(--fs-sm);
}
body.ds .kl-footer { align-items: center; margin-top: 0; padding-top: 0; border-top: 0; }
body.ds .kl-footer a { display: inline-flex; align-items: center; min-height: 44px; }

/* =================================================================
   第3弾：精密検査・提供事業者・プライバシーポリシー・学びの冒険の外枠・LP の入口
   （shindan-data.html・shindan-infra.html・provider.html・privacy.html・game.html・lp/index.html）
   ページの目印（body.ds.ds-seimitsu・.ds-legal・.ds-provider・.ds-game・.ds-lp）か、入れ物の id か、
   第3弾で足した ds- の部品で絞る。トップと第1弾・第2弾のページには当てない
   並び：共通 → 精密検査 → 提供事業者・プライバシーポリシー → 学びの冒険の外枠 → 学びの冒険の中を今の見た目に戻す → LP の入口
   ================================================================= */

/* ---------- 共通：フッターの下の段の法務リンク（紺の地の上。明るい灰の文字と下線。押せる高さを 44px に） ---------- */
body.ds.ds-seimitsu .site-footer .footer-bottom, body.ds.ds-legal .site-footer .footer-bottom,
body.ds.ds-game .site-footer .footer-bottom, body.ds.ds-lp .site-footer .footer-bottom { align-items: center; }
body.ds .site-footer .ds-footer-legal { display: flex; flex-wrap: wrap; gap: 0 var(--sp-4); }
body.ds .site-footer .ds-footer-legal a {
  display: inline-flex; align-items: center; min-height: 44px; color: var(--color-border-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
  transition: color var(--t-fast) var(--ease);
}
body.ds .site-footer .ds-footer-legal a:hover { color: var(--color-border); }

/* ---------- 精密検査（shindan-data.html・shindan-infra.html）：問診と結果は #shindan-data-app・#shindan-infra-app の中。
   2つの入れ物は必ず同じ規則に並べて書く（2ページを同じ見た目に保つ）。第1弾の #shindan-app の規則を見本にする ---------- */
/* 頭：左に見出しと本文と部屋の写真・右に問診。写真は2列の広い画面だけ（狭い画面は問診を先に見せる） */
body.ds.ds-seimitsu .ds-pagehead .ds-head { min-width: 0; overflow-wrap: anywhere; }
body.ds.ds-seimitsu .ds-seimitsu-photo { margin: var(--sp-6) 0 0; }
body.ds.ds-seimitsu .ds-seimitsu-photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}

/* 問診：白地と細い枠の札。進み具合は「科名」と Figtree の「N / 11」、細い棒 */
body.ds.ds-seimitsu #shindan-data-app, body.ds.ds-seimitsu #shindan-infra-app { overflow-wrap: anywhere; }
body.ds.ds-seimitsu #shindan-data-app .quiz-card, body.ds.ds-seimitsu #shindan-infra-app .quiz-card {
  padding: var(--sp-6);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  box-shadow: none;
}
body.ds.ds-seimitsu #shindan-data-app .progress-head, body.ds.ds-seimitsu #shindan-infra-app .progress-head {
  flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); margin-bottom: var(--sp-2);
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); color: var(--color-muted-fg);
}
body.ds.ds-seimitsu #shindan-data-app .progress-head span + span, body.ds.ds-seimitsu #shindan-infra-app .progress-head span + span {
  font-family: var(--font-head); font-variant-numeric: tabular-nums; letter-spacing: 0; color: var(--color-primary);
}
body.ds.ds-seimitsu #shindan-data-app .progress-track, body.ds.ds-seimitsu #shindan-infra-app .progress-track { height: 4px; background: var(--color-surface-2); border-radius: 0; }
body.ds.ds-seimitsu #shindan-data-app .progress-bar, body.ds.ds-seimitsu #shindan-infra-app .progress-bar {
  background: var(--color-accent); border-radius: 0; transition: width var(--t-base) var(--ease);
}
/* 設問：小さな区分（はじめに・レベルN の確認）と明朝の問い */
body.ds.ds-seimitsu #shindan-data-app .q-cat, body.ds.ds-seimitsu #shindan-infra-app .q-cat {
  display: block; margin: var(--sp-6) 0 var(--sp-2);
  font-family: var(--font-body); font-size: var(--fs-sm); font-weight: 500; letter-spacing: .04em; color: var(--color-accent-strong);
}
body.ds.ds-seimitsu #shindan-data-app .q-text, body.ds.ds-seimitsu #shindan-infra-app .q-text { font-size: var(--fs-lg); line-height: 1.6; }
/* 次の設問へフォーカスが移って画面が動くとき、設問の上の進み具合と科名もヘッダーの下に見えるようにする */
body.ds.ds-seimitsu #shindan-data-app #ka-q-text, body.ds.ds-seimitsu #shindan-infra-app #ka-q-text {
  scroll-margin-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-5) + var(--sp-9) + var(--sp-2));
}
body.ds.ds-seimitsu #shindan-data-app .q-help, body.ds.ds-seimitsu #shindan-infra-app .q-help {
  margin-top: var(--sp-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--color-muted-fg);
}
/* 選択肢：信号色で色分けしない。選んだ印は「角の四角の塗りと白いチェック・枠の色・淡い地」の3つ */
body.ds.ds-seimitsu #shindan-data-app .options, body.ds.ds-seimitsu #shindan-infra-app .options { gap: var(--sp-3); margin-top: var(--sp-5); }
body.ds.ds-seimitsu #shindan-data-app .option, body.ds.ds-seimitsu #shindan-infra-app .option {
  gap: var(--sp-4); min-height: 56px; padding: var(--sp-4);
  background: var(--color-surface); border: 1px solid var(--glass-line); border-radius: var(--r-sm);
  box-shadow: none; transform: none;
  font-size: var(--fs-base); font-weight: 500; color: var(--color-primary);
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
body.ds.ds-seimitsu #shindan-data-app .option:hover, body.ds.ds-seimitsu #shindan-infra-app .option:hover,
body.ds.ds-seimitsu #shindan-data-app .option:active, body.ds.ds-seimitsu #shindan-infra-app .option:active {
  background: var(--color-surface); border-color: var(--color-accent); transform: none;
}
body.ds.ds-seimitsu #shindan-data-app .option .dot, body.ds.ds-seimitsu #shindan-infra-app .option .dot {
  width: 20px; height: 20px;
  background: var(--color-surface); border: 1px solid var(--color-muted-fg); border-radius: var(--r-xs);
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
body.ds.ds-seimitsu #shindan-data-app .option .dot svg, body.ds.ds-seimitsu #shindan-infra-app .option .dot svg { opacity: 0; transition: opacity var(--t-fast) var(--ease); }
body.ds.ds-seimitsu #shindan-data-app .option.selected, body.ds.ds-seimitsu #shindan-infra-app .option.selected,
body.ds.ds-seimitsu #shindan-data-app .option[aria-checked="true"], body.ds.ds-seimitsu #shindan-infra-app .option[aria-checked="true"] {
  background: var(--color-accent-soft); border-color: var(--color-accent); box-shadow: none;
}
body.ds.ds-seimitsu #shindan-data-app .option.selected .dot, body.ds.ds-seimitsu #shindan-infra-app .option.selected .dot,
body.ds.ds-seimitsu #shindan-data-app .option[aria-checked="true"] .dot, body.ds.ds-seimitsu #shindan-infra-app .option[aria-checked="true"] .dot {
  background: var(--color-accent); border-color: var(--color-accent);
}
body.ds.ds-seimitsu #shindan-data-app .option.selected .dot svg, body.ds.ds-seimitsu #shindan-infra-app .option.selected .dot svg,
body.ds.ds-seimitsu #shindan-data-app .option[aria-checked="true"] .dot svg, body.ds.ds-seimitsu #shindan-infra-app .option[aria-checked="true"] .dot svg { opacity: 1; }
body.ds.ds-seimitsu #shindan-data-app .opt-text, body.ds.ds-seimitsu #shindan-infra-app .opt-text { min-width: 0; }
body.ds.ds-seimitsu #shindan-data-app .opt-label, body.ds.ds-seimitsu #shindan-infra-app .opt-label { font-weight: 500; line-height: 1.5; color: var(--color-primary); }
body.ds.ds-seimitsu #shindan-data-app .opt-sub, body.ds.ds-seimitsu #shindan-infra-app .opt-sub { font-size: var(--fs-xs); font-weight: 400; color: var(--color-muted-fg); }
/* 前にもどる・もう一度・処方箋・相談のボタン：押せる高さを 44px に */
body.ds.ds-seimitsu #shindan-data-app .ds-ka-nav, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-nav { margin-top: var(--sp-5); }
body.ds.ds-seimitsu #shindan-data-app .ds-ka-nav .btn, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-nav .btn,
body.ds.ds-seimitsu #shindan-data-app .ds-ka-retake .btn, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-retake .btn,
body.ds.ds-seimitsu #shindan-data-app .ka-rx-btn, body.ds.ds-seimitsu #shindan-infra-app .ka-rx-btn,
body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta .btn, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta .btn { min-height: 44px; }

/* 結果の頭：足切りの一言・「レベルN」・明朝のレベルの名前・意味。左にそろえる */
body.ds.ds-seimitsu #shindan-data-app .ka-result-head, body.ds.ds-seimitsu #shindan-infra-app .ka-result-head { margin-bottom: 0; text-align: left; }
body.ds.ds-seimitsu #shindan-data-app .ds-ka-gatenote, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-gatenote {
  margin: 0 0 var(--sp-4); padding-bottom: var(--sp-3); border-bottom: 1px solid var(--glass-line);
  font-size: var(--fs-sm); line-height: 1.8; color: var(--color-secondary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-level-no, body.ds.ds-seimitsu #shindan-infra-app .ka-level-no {
  font-size: var(--fs-sm); font-weight: 500; letter-spacing: .06em; color: var(--color-accent-strong);
}
body.ds.ds-seimitsu #shindan-data-app .ka-level-name, body.ds.ds-seimitsu #shindan-infra-app .ka-level-name {
  margin-top: var(--sp-2);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-2xl); line-height: 1.4; color: var(--color-primary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-level-meaning, body.ds.ds-seimitsu #shindan-infra-app .ka-level-meaning {
  max-width: var(--w-copy); margin: var(--sp-3) 0 0;
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-muted-fg);
}
/* 階段の図：達成＝accent の塗りと白いチェック・現在地＝紺と「Lv.N」と「いまここ」・これから＝白地の枠と「Lv.N」（薄くしない）。
   達成と現在地の白い文字は style.css のまま（.ka-stair-lv の色は is-todo だけに書く。id の強さで白を消さないため） */
body.ds.ds-seimitsu #shindan-data-app .ka-stairs, body.ds.ds-seimitsu #shindan-infra-app .ka-stairs {
  gap: var(--sp-2); margin-top: var(--sp-6); padding-top: var(--sp-6); border-bottom: 1px solid var(--color-border-strong);
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair, body.ds.ds-seimitsu #shindan-infra-app .ka-stair { gap: var(--sp-2); }
body.ds.ds-seimitsu #shindan-data-app .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-bar {
  background: var(--color-surface); border: 1px solid var(--color-border-strong); border-bottom: 0;
  border-top-left-radius: var(--r-xs); border-top-right-radius: var(--r-xs); border-bottom-right-radius: 0; border-bottom-left-radius: 0;
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-done .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-done .ka-stair-bar {
  background: var(--color-accent); border-color: var(--color-accent);
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-current .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-current .ka-stair-bar {
  background: var(--color-primary); border-color: var(--color-primary); box-shadow: none;
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-todo .ka-stair-lv, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-todo .ka-stair-lv { color: var(--color-muted-fg); }
body.ds.ds-seimitsu #shindan-data-app .ka-stair-lv, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-lv { font-weight: 500; font-size: var(--fs-xs); }
body.ds.ds-seimitsu #shindan-data-app .ka-stair-phase, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-phase {
  font-family: var(--font-body); font-weight: 400; font-size: var(--fs-xs); line-height: 1.5; color: var(--color-muted-fg);
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-current .ka-stair-phase, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-current .ka-stair-phase {
  font-weight: 500; color: var(--color-primary);
}
/* 「いまここ」：紺の吹き出しをやめ、紺の文字だけ（▼の三角も出さない） */
body.ds.ds-seimitsu #shindan-data-app .ka-stair-flag, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-flag {
  background: transparent; color: var(--color-primary); padding: 0; border-radius: 0; box-shadow: none;
  font-size: var(--fs-xs); font-weight: 500; letter-spacing: .04em;
}
body.ds.ds-seimitsu #shindan-data-app .ka-stair-flag::after, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-flag::after { content: none; }

/* ストーリー：箱をやめ、上の罫線と本文。レベルの写真（データ活用科だけ）は最初の段落の前に1枚。
   最後の段落（次の未来）は、明朝と上の罫線で示す（点線・帯は使わない） */
body.ds.ds-seimitsu #shindan-data-app .ka-story, body.ds.ds-seimitsu #shindan-infra-app .ka-story {
  margin: var(--sp-7) 0 0; padding: var(--sp-6) 0 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0; box-shadow: none;
}
body.ds.ds-seimitsu #shindan-data-app .ds-ka-photo, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-photo { max-width: var(--w-copy); margin: 0 0 var(--sp-6); }
body.ds.ds-seimitsu #shindan-data-app .ds-ka-photo img, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-photo img {
  width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--r-sm); background: var(--color-surface-2);
}
body.ds.ds-seimitsu #shindan-data-app .ka-story-p, body.ds.ds-seimitsu #shindan-infra-app .ka-story-p {
  max-width: var(--w-copy); margin: 0 0 var(--sp-4);
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-story-p strong, body.ds.ds-seimitsu #shindan-infra-app .ka-story-p strong { font-weight: 700; color: var(--color-primary); }
body.ds.ds-seimitsu #shindan-data-app .ka-story-p.is-future, body.ds.ds-seimitsu #shindan-infra-app .ka-story-p.is-future {
  margin-top: var(--sp-6); padding-top: var(--sp-5); border-top: 1px solid var(--glass-line);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); line-height: 1.8; color: var(--color-primary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-story-p.is-future strong, body.ds.ds-seimitsu #shindan-infra-app .ka-story-p.is-future strong { color: var(--color-accent-strong); }
/* 呼ばれない3つの塊の経路の保険：丸い台座のアイコンは出さない */
body.ds.ds-seimitsu #shindan-data-app .ka-block-icon, body.ds.ds-seimitsu #shindan-infra-app .ka-block-icon { display: none; }

/* 前後の図：箱をやめ、上の罫線。色は fill・stroke をトークンで決める。
   前と後は、左右の位置・図の中の線・点線か実線か・文字の濃さの4つで分かる（色だけにしない） */
body.ds.ds-seimitsu #shindan-data-app .ka-ba, body.ds.ds-seimitsu #shindan-infra-app .ka-ba {
  margin: var(--sp-7) 0 0; padding: var(--sp-5) 0 0;
  background: transparent; border-top: 1px solid var(--glass-line); border-radius: 0; text-align: left;
}
body.ds.ds-seimitsu #shindan-data-app .ka-ba-svg, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-svg { max-width: 30rem; margin: 0; }
body.ds.ds-seimitsu #shindan-data-app .ka-ba-before, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-before { fill: var(--color-border-strong); }
body.ds.ds-seimitsu #shindan-data-app .ka-ba-mid, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-mid { stroke: var(--color-muted-fg); }
body.ds.ds-seimitsu #shindan-data-app .ka-ba-after, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-after { stroke: var(--color-accent); }
body.ds.ds-seimitsu #shindan-data-app .ka-ba-bars, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-bars { fill: var(--color-accent); }
body.ds.ds-seimitsu #shindan-data-app .ka-ba-caps, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-caps {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-4);
  max-width: 30rem; margin-top: var(--sp-3);
}
body.ds.ds-seimitsu #shindan-data-app .ka-ba-cap, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-cap {
  min-width: 0; padding: var(--sp-2) 0 0; background: transparent; border-radius: 0;
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); line-height: 1.7;
}
body.ds.ds-seimitsu #shindan-data-app .ka-ba-cap.before, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-cap.before {
  border-top: 1px dashed var(--color-border-strong); color: var(--color-muted-fg);
}
body.ds.ds-seimitsu #shindan-data-app .ka-ba-cap.after, body.ds.ds-seimitsu #shindan-infra-app .ka-ba-cap.after {
  border-top: 1px solid var(--color-accent); color: var(--color-primary);
}

/* 次の一歩（処方箋へ）：箱と色の帯をやめ、上の罫線・線つきのラベル・明朝の見出し・本文・ボタン */
body.ds.ds-seimitsu #shindan-data-app .ka-block, body.ds.ds-seimitsu #shindan-infra-app .ka-block {
  margin: var(--sp-7) 0 0; padding: var(--sp-6) 0 0;
  background: transparent; border: 0; border-top: 1px solid var(--glass-line); border-radius: 0; box-shadow: none; text-align: left;
}
body.ds.ds-seimitsu #shindan-data-app .ka-block-head, body.ds.ds-seimitsu #shindan-infra-app .ka-block-head {
  margin: 0;
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); line-height: 1.6; color: var(--color-primary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-block p:not(.ds-label), body.ds.ds-seimitsu #shindan-infra-app .ka-block p:not(.ds-label) {
  max-width: var(--w-copy); margin-top: var(--sp-3);
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds.ds-seimitsu #shindan-data-app .ka-rx-btn, body.ds.ds-seimitsu #shindan-infra-app .ka-rx-btn { margin-top: var(--sp-5); }

/* 相談の案内：紺の帯をやめ、淡い地と上下の罫線に、紺のボタン */
body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta {
  margin: var(--sp-7) 0 0; padding: var(--sp-6);
  background: var(--color-background); border-top: 1px solid var(--glass-line); border-bottom: 1px solid var(--glass-line);
}
body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta h2, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta h2 { font-size: var(--fs-xl); line-height: 1.45; color: var(--color-primary); }
body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta p, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta p {
  max-width: var(--w-copy); margin-top: var(--sp-3);
  font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta__actions, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta__actions {
  display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-5);
}
body.ds.ds-seimitsu #shindan-data-app .ds-ka-retake, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-retake { margin-top: var(--sp-6); }

/* ---------- 提供事業者・プライバシーポリシー（provider.html・privacy.html）：本文は .legal の中。
   読みやすい行の幅・節の頭の罫線・明朝の見出し・箇条は罫線の行と細い線の印。本文の文字は変えない ---------- */
body.ds.ds-legal .legal { max-width: var(--w-copy); overflow-wrap: anywhere; }
body.ds.ds-legal .legal h2 {
  margin: var(--sp-8) 0 var(--sp-4); padding-top: var(--sp-6); border-top: 1px solid var(--glass-line);
  font-size: var(--fs-lg);
}
body.ds.ds-legal .legal h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
/* privacy.html#photo で開いたとき、見出しが浮いたヘッダーに隠れない（ヘッダーの下の端から 48px ほど空ける） */
body.ds.ds-legal .legal h2[id] { scroll-margin-top: calc(var(--nav-h) + var(--sp-3) + var(--sp-7)); }
/* 本文と箇条の文字は rem のトークンで書く（body の 16px のままだと、ブラウザの文字の大きさの設定で本文だけ大きくならないため） */
body.ds.ds-legal .legal p { margin: var(--sp-3) 0; font-size: var(--fs-base); line-height: 1.95; color: var(--color-secondary); }
body.ds.ds-legal .legal ul { margin: var(--sp-4) 0; padding: 0; list-style: none; border-top: 1px solid var(--glass-line); }
body.ds.ds-legal .legal li {
  position: relative; margin: 0; padding: var(--sp-3) 0 var(--sp-3) var(--sp-5);
  border-bottom: 1px solid var(--glass-line); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary);
}
body.ds.ds-legal .legal li::before {
  content: ""; position: absolute; left: 0; top: calc(var(--sp-3) + .95em);
  width: var(--sp-3); height: 1px; background: var(--color-accent-strong);
}
body.ds.ds-legal .legal b, body.ds.ds-legal .legal strong { font-weight: 700; color: var(--color-primary); }
body.ds.ds-legal .legal a {
  color: var(--color-accent-strong);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; overflow-wrap: anywhere;
}
body.ds.ds-legal .legal a:hover { color: var(--color-primary); }
body.ds.ds-legal .legal .legal-meta { margin-top: var(--sp-7); font-size: var(--fs-sm); color: var(--color-muted-fg); }
/* 提供事業者の一覧：「見出し｜値」を罫線の行にする（HTML は変えない）。電話のリンクだけ押せる高さを 44px に */
body.ds.ds-provider .biz-list { margin: var(--sp-5) 0 0; border-top: 1px solid var(--glass-line); }
body.ds.ds-provider .biz-row {
  grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: var(--sp-5); align-items: baseline;
  padding: var(--sp-4) 0; border-top: 0; border-bottom: 1px solid var(--glass-line);
}
body.ds.ds-provider .biz-row:first-child { padding-top: var(--sp-4); }
body.ds.ds-provider .biz-row > dt, body.ds.ds-provider .biz-row > dd { min-width: 0; }
body.ds.ds-provider .biz-row dt {
  font-family: var(--font-body); font-weight: 500; font-size: var(--fs-sm); letter-spacing: .12em; line-height: 1.9;
  color: var(--color-accent-strong);
}
body.ds.ds-provider .biz-row dd { font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); overflow-wrap: anywhere; }
body.ds.ds-provider .biz-row dd strong { font-weight: 600; color: var(--color-primary); }
body.ds.ds-provider .biz-note { display: block; margin-top: var(--sp-2); font-size: var(--fs-sm); color: var(--color-muted-fg); }
body.ds.ds-provider .biz-row dd a[href^="tel:"] { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- 学びの冒険の外枠（game.html）：ヘッダーは浮いて流れの外に出るので、ゲームの入れ物の上にヘッダーの高さを空ける。
   ゲームの画面の組み方・1画面に収める高さ・中の位置は今のまま（JS 無効と印刷では 0 に戻す） ---------- */
body.ds.ds-game .game-shell { padding-top: var(--nav-h); }

/* ---------- 学びの冒険の中を今の見た目に戻す（技術ブリーフ O-5）：ds の文字の詰め・明朝の見出し・ボタンの形がゲームの中に当たる所だけを打ち消す。
   body.ds.ds-game とゲームの入れ物（#game-root・.game-modal・.g-toast）の両方で絞り、値は style.css・game.css の今の値をそのまま写す。
   .btn の text-align は revert（a は受け継ぎ・<button> はブラウザの既定の中央ぞろえのまま）。tests/ds-pages3-game.test.mjs が照合する ---------- */
body.ds.ds-game #game-root, body.ds.ds-game .game-modal, body.ds.ds-game .g-toast { letter-spacing: normal; word-break: normal; }
body.ds.ds-game #game-root h1, body.ds.ds-game #game-root h2, body.ds.ds-game #game-root h3, body.ds.ds-game #game-root h4,
body.ds.ds-game .game-modal h1, body.ds.ds-game .game-modal h2, body.ds.ds-game .game-modal h3, body.ds.ds-game .game-modal h4 {
  font-family: var(--font-head); font-weight: 700; letter-spacing: .01em; line-height: 1.3; font-feature-settings: normal; word-break: normal;
}
body.ds.ds-game #game-root .g-quiz-q { line-height: 1.55; }
body.ds.ds-game #game-root .btn, body.ds.ds-game .game-modal .btn {
  font-family: var(--font-head); font-weight: 700; letter-spacing: inherit; text-align: revert; border-width: 1.5px;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
body.ds.ds-game #game-root .btn-lg, body.ds.ds-game .game-modal .btn-lg { font-size: 1.06rem; }
body.ds.ds-game #game-root .btn-primary, body.ds.ds-game .game-modal .btn-primary { box-shadow: var(--sh-2); }
body.ds.ds-game #game-root .btn-primary:hover, body.ds.ds-game .game-modal .btn-primary:hover,
body.ds.ds-game #game-root .btn-line:hover, body.ds.ds-game .game-modal .btn-line:hover { box-shadow: var(--sh-3); }
body.ds.ds-game #game-root .btn-ghost:hover, body.ds.ds-game .game-modal .btn-ghost:hover { background: var(--color-accent-soft); border-color: var(--color-accent); color: var(--color-accent); }

/* ---------- LP の入口（lp/index.html。名刺の QR の着地先）：頭は第2弾の写真つきのページの頭、要点と症状は罫線の行。
   要点（#lp-points）と症状（#lp-symptoms）の中身は lp-seg.js が描く（要点は <li>文</li>・症状は li.ds-lp__symptom の「題。本文」） ---------- */
/* 見出しの中の強調「健康」（白地で 7.6:1。style.css の色は .hero .accent だけなので付け直す） */
body.ds.ds-lp #lp-h1 .accent { color: var(--color-accent-strong); }
body.ds.ds-lp .ds-lp__points { list-style: none; margin: var(--sp-5) 0 0; padding: 0; max-width: var(--w-copy); border-top: 1px solid var(--glass-line); }
body.ds.ds-lp .ds-lp__points li { padding-block: var(--sp-3); border-bottom: 1px solid var(--glass-line); font-size: var(--fs-base); line-height: 1.8; color: var(--color-secondary); }
body.ds.ds-lp .ds-lp__symptoms { list-style: none; margin: 0; padding: 0; min-width: 0; border-top: 1px solid var(--glass-line); }
body.ds.ds-lp .ds-lp__symptom { padding-block: var(--sp-5); border-bottom: 1px solid var(--glass-line); font-size: var(--fs-base); line-height: 1.9; color: var(--color-secondary); overflow-wrap: anywhere; }
body.ds.ds-lp .ds-lp__symptom strong { display: block; margin-bottom: var(--sp-2); font-family: var(--font-display); font-size: var(--fs-lg); font-weight: 600; letter-spacing: .04em; line-height: 1.5; font-feature-settings: "palt"; color: var(--color-primary); }
/* 流れ：左右の分割の中なので、症状の一覧と同じく上の余白を 0 にして見出しと頭をそろえる（科のページの #dept-recovery と同じ）。
   手順の本文は、文字を大きくする設定にも追従させる（body の 16px を受け継がない） */
body.ds.ds-lp .ds-steps { margin-top: 0; }
body.ds.ds-lp .ds-steps__item > p { font-size: var(--fs-base); }
/* lp-seg.js が動かない（JS 無効・読めない・?seg= が壊れている）ときは要点と症状が空のまま。上の線だけが浮かないように隠す */
body.ds.ds-lp .ds-lp__points:empty, body.ds.ds-lp .ds-lp__symptoms:empty { display: none; }

/* =================================================================
   スクロールで現れる（.reveal に main.js が .in を付ける）：ぼかしから澄む。平行移動しない
   すりガラス（.ds-glass）とその祖先には .reveal を付けない（背景ぼかしが壊れるため）
   ================================================================= */
body.ds .reveal {
  transform: none; filter: blur(var(--blur-reveal));
  transition: opacity var(--t-slow) var(--ease), filter var(--t-slow) var(--ease);
}
body.ds .reveal.in { opacity: 1; filter: none; }
/* 安全装置：main.js が動かず .in が1つも付かないまま 2.5 秒たったら、すべて見せる */
body.ds:not(:has(.reveal.in)) .reveal { animation: ds-failsafe-show 0s linear var(--t-failsafe) forwards; }
@keyframes ds-failsafe-show {
  to { opacity: 1; filter: none; }
}
/* 安全装置の続き：.in が付いたあとは、動きを外さずに「止める」だけにする。
   2.5 秒より前に付けば、動きは始まる前に止まり、ふつうの出現になる。
   2.5 秒より後に付けば、見せた状態（forwards）がそのまま残り、一度見えた本文がまた消えない */
body.ds:has(.reveal.in) .reveal { animation: ds-failsafe-show 0s linear var(--t-failsafe) forwards; animation-play-state: paused; }
/* :has() が使えない古いブラウザ：出現の演出をやめて、最初から全部見せる */
@supports not selector(:has(a)) {
  body.ds .reveal { opacity: 1; filter: none; }
}
/* ヒーローの目に見えない目印。最初の画面に必ずある .reveal として、正常時に安全装置を外す（大きさ0・レイアウトに影響しない） */
body.ds .ds-reveal-sentinel {
  position: absolute; top: 0; left: 0; width: 0; height: 0;
  overflow: hidden; pointer-events: none;
}

/* =================================================================
   画面の幅ごとの組み方
   ================================================================= */
/* 広い画面：見出しの列を止める・院長の写真を止める・流れを左右に */
@media (min-width: 1025px) {
  body.ds .ds-head--sticky { position: sticky; top: calc(var(--nav-h) + var(--sp-3) + var(--sp-6)); }
  body.ds .ds-statement__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-6) var(--sp-8); }
  body.ds .ds-statement__portrait {
    grid-column: 1; grid-row: 1 / span 2; align-self: start;
    position: sticky; top: calc(var(--nav-h) + var(--sp-3) + var(--sp-6));
  }
  body.ds .ds-statement__body, body.ds .ds-statement__text { grid-column: 2; }
  body.ds .ds-values__row { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-8); }
  body.ds .ds-flow { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-8); align-items: start; }
}
/* 広い画面（第1弾）：専門家の写真と名前の列を止める */
@media (min-width: 1025px) {
  body.ds #doctors-grid .person-card-head { position: sticky; top: calc(var(--nav-h) + var(--sp-3) + var(--sp-6)); align-self: start; }
}
/* 広い画面（第2弾）：講座の一覧（左・広め）と申込（右）を横に並べ、上をそろえる。申込は画面より高いので止めない。
   文字を大きくする設定（64em）では1列のまま。下に留める申込ボタンは出さない（申込がすぐ横に見えるため） */
@media (min-width: 1025px) and (min-width: 64em) {
  body.ds .ds-kouza-pair__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-7) var(--sp-8); align-items: start; }
  body.ds .ds-kouza-pair #kouza-jump { display: none; }
}
/* 768px 以上（第3弾・学びの冒険の中。game.css と同じ境目）：ステージの横で止まるレーダーを、浮いたヘッダーの下 16px で止める
   （今はヘッダーの下に潜っていた。ゲームの中で意図して変える唯一の所） */
@media (min-width: 768px) {
  body.ds.ds-game #game-root .g-stage-radar { top: calc(var(--nav-h) + var(--sp-3) + var(--sp-4)); }
}

/* T：左右の分割を1列に */
@media (max-width: 1024px) {
  body.ds .ds-split, body.ds .ds-split--5-7 { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  body.ds .ds-feature { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  body.ds .ds-flow__photos { max-width: 40rem; }
  body.ds .ds-depts { grid-template-columns: repeat(2, minmax(0, 20rem)); }
}
/* T（第1弾）：科のヒーロー・処方箋・専門家を1列に（科のヒーローは 見出し → 写真 → 専門分野 の順） */
@media (max-width: 1024px) {
  body.ds .ds-depthero.has-photo { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "photo" "facts"; gap: var(--sp-5); }
  body.ds #dept-main .rx-card, body.ds #dept-main .ds-rx-list--simple .svc-card { grid-template-columns: minmax(0, 1fr); }
  body.ds #dept-main .rx-card > .rx-card-head, body.ds #dept-main .rx-card > :not(.rx-card-head),
  body.ds #dept-main .svc-card__title, body.ds #dept-main .svc-tools, body.ds #dept-main .svc-card__desc { grid-column: 1; grid-row: auto; }
  body.ds #doctors-grid .person-card { grid-template-columns: minmax(0, 1fr); row-gap: var(--sp-5); }
}
/* T（第2弾）：写真つきのページの頭を1列に（本文 → 写真）。講座の交流会の写真は2列のときだけ */
@media (max-width: 1024px) {
  body.ds .ds-pagehero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
  body.ds .ds-side-photo { display: none; }
}
/* T（第2弾）：講座の一覧と申込を1列に積む（一覧 → 申込）。申込の頭に、節の区切りの線と余白。
   申込ボタンは、一覧を見ている間だけ画面の下に留まり、一覧の終わりで自然に止まる（fixed は使わない）。すりガラスの帯の上に横いっぱい */
@media (max-width: 1024px), (max-width: 64em) {
  body.ds .ds-kouza-pair__apply { margin-top: var(--sp-section); padding-top: var(--sp-section); border-top: 1px solid var(--glass-line); }
  body.ds .ds-kouza-pair #kouza-jump {
    position: sticky; bottom: var(--sp-3);
    padding: var(--sp-2);
    background: var(--glass-bg);
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
    backdrop-filter: blur(var(--glass-blur)) saturate(140%);
    border: 1px solid var(--glass-line); border-radius: var(--r-glass);
  }
}
/* T（第3弾）：精密検査の頭の部屋の写真は2列のときだけ（狭い画面では問診を最初の画面に近づける）。
   文字を大きくする設定（64em）の広い画面でも、見出しの列と問診を1列に積む */
@media (max-width: 1024px), (max-width: 64em) {
  body.ds.ds-seimitsu .ds-seimitsu-photo { display: none; }
  body.ds.ds-seimitsu .ds-split { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
}
/* T（第3弾）：LP の入口の頭（本文 → 写真）と症状・流れの左右の分割を1列に。
   1024px 以下は既存の規則でも1列。文字を大きくする設定（64em）の広い画面でも1列に積む */
@media (max-width: 1024px), (max-width: 64em) {
  body.ds.ds-lp .ds-split { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
  body.ds.ds-lp .ds-pagehero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); }
}

/* NAV：ナビをボタンで開閉する（main.js が #nav-links に .open を付ける）。
   文字を大きくする設定では 1240px より広くても畳む（77.5em）。ナビが2行に折り返して、ページの頭を隠さないように */
@media (max-width: 1240px), (max-width: 77.5em) {
  body.ds .nav-toggle { display: inline-flex; }
  body.ds .nav-links {
    position: absolute; top: calc(100% + var(--sp-2)); left: 0; right: 0; z-index: var(--z-menu);
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    padding: var(--sp-3);
    background: var(--glass-bg-solid); border: 1px solid var(--glass-line); border-radius: var(--r-glass);
    box-shadow: none; transform: none;
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity var(--t-fast) var(--ease), visibility 0s linear var(--t-fast);
    max-height: calc(100vh - var(--nav-h) - var(--sp-8)); overflow-y: auto;
  }
  body.ds .nav-links.open { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
  body.ds .nav-links a:not(.btn) { display: flex; font-size: var(--fs-base); padding: var(--sp-3); }
  body.ds .nav-links li + li:not(.nav-cta) { border-top: 1px solid var(--glass-line); }
  body.ds .nav-cta { margin: var(--sp-2) 0 0; }
  body.ds .nav-cta .btn { width: 100%; }
  body.ds .nav-links .nav-cta .btn { min-height: 48px; font-size: var(--fs-base); }
}
@media (max-width: 1240px) and (min-width: 360px), (max-width: 77.5em) and (min-width: 360px) {
  body.ds .ds-nav-quick { display: inline-flex; flex: none; min-height: 44px; padding: 0 var(--sp-4); font-size: var(--fs-sm); white-space: nowrap; }
}
/* 文字を大きくする設定（1行に入る字数が少ない＝幅が 22em 以下）：「無料で診断」を隠して、メニューのボタンを画面内に残す */
@media (max-width: 22em) {
  body.ds .ds-nav-quick { display: none; }
}
/* S（第3弾）：幅 320px ほどの画面では、提供事業者・プライバシーポリシーの h1 を1段小さくする
   （「プライバシーポリシー」の最後の「ー」だけが次の行へ落ちないように） */
@media (max-width: 22em) {
  body.ds.ds-legal .ds-pagehead .ds-h1 { font-size: var(--fs-xl); }
}

/* M：一覧を縦に積む */
@media (max-width: 760px) {
  body.ds .container { padding-inline: var(--sp-5); }
  body.ds .site-header { inset: var(--sp-2) var(--sp-3) auto; }
  body.ds .site-header .nav { padding-inline: var(--sp-3); gap: var(--sp-2); }
  body.ds .ds-nav-quick { padding: 0 var(--sp-3); }
  body.ds .brand-name { letter-spacing: .04em; }

  body.ds .ds-ledger-wrap { grid-template-columns: minmax(0, 1fr); }
  body.ds .ds-ledger-wrap > .ds-summit, body.ds .ds-ledger-wrap > .ds-actions { grid-column: 1; }
  body.ds .ds-ledger__cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--sp-3); }
  body.ds .ds-ledger__corner { display: none; }
  body.ds .ds-ledger__row { grid-template-columns: minmax(0, 1fr); row-gap: var(--sp-3); }
  body.ds .ds-ledger__pair { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  body.ds .ds-ledger__key {
    position: static; width: auto; height: auto; overflow: visible;
    clip: auto; clip-path: none; white-space: normal;
    margin-bottom: var(--sp-2);
    font-size: var(--fs-xs); letter-spacing: .12em; color: var(--color-muted-fg);
  }

  body.ds .ds-values__row { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }

  body.ds .ds-depts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  body.ds .ds-dept {
    display: grid; grid-template-columns: min(8.5rem, 40%) minmax(0, 1fr); column-gap: var(--sp-4); align-items: start;
    padding-block: var(--sp-4);
  }
  body.ds .ds-dept + .ds-dept { border-top: 1px solid var(--glass-line); }
  body.ds .ds-dept:first-child { padding-top: 0; }
  body.ds .ds-dept__photo { grid-column: 1; grid-row: 1 / span 3; }
  body.ds .ds-dept__name, body.ds .ds-dept__desc, body.ds .ds-dept__more { grid-column: 2; }
  body.ds .ds-dept__name { margin-top: 0; }
  body.ds .ds-dept__more { justify-self: start; }
  body.ds .ds-dept-group__title { margin-bottom: var(--sp-4); }
  body.ds .ds-soon { display: block; }
  body.ds .ds-soon__list { margin-top: var(--sp-2); gap: var(--sp-2) var(--sp-5); }

  body.ds .ds-people { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
  body.ds .ds-acc__a { padding-right: 0; }

  body.ds .ds-cta__actions .btn, body.ds .ds-cta__visit .btn { width: 100%; }
  body.ds #soudan .quiz-card { padding: var(--sp-5); }
}
/* M（第1弾）：一覧を縦に積む・ボタンを横いっぱいに・枠の内側を詰める */
@media (max-width: 760px) {
  body.ds .ds-others__list { grid-template-columns: minmax(0, 1fr); }
  body.ds .ds-depthero__actions .btn, body.ds .ds-closing__actions .btn { width: 100%; }
  body.ds #shindan-app .dx-next-btns .btn, body.ds #shindan-app .gate-card .btn { width: 100%; }
  body.ds .ds-depthero__actions .btn, body.ds .ds-closing__actions .btn,
  body.ds #shindan-app .dx-next-btns .btn, body.ds #shindan-app .gate-card .btn { padding-inline: var(--sp-4); }
  body.ds #shindan-app .quiz-card, body.ds #shindan-app .gate-card, body.ds #shindan-app .result-cta, body.ds #lead-modal .modal-card { padding: var(--sp-5); }
  body.ds #shindan-app .ds-result__head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  body.ds #shindan-app .ds-result__score { text-align: left; }
  body.ds #shindan-app .literacy-dx-cols { grid-template-columns: minmax(0, 1fr); }
  body.ds #shindan-app .lit-steps { grid-template-columns: minmax(0, 1fr); }
  body.ds #shindan-app .lit-step, body.ds #shindan-app .lit-step + .lit-step { padding: var(--sp-4) 0; }
  body.ds #shindan-app .lit-step + .lit-step { border-left: 0; border-top: 1px solid var(--glass-line); }
  body.ds #shindan-app .ds-adventure { grid-template-columns: minmax(0, 1fr); }
  body.ds #dept-main .data-level-banner, body.ds #dept-main .data-level-cta { flex-direction: column; align-items: flex-start; text-align: left; }
  body.ds #dept-main .data-pkg { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); padding-inline: var(--sp-2); }
  body.ds #dept-main .rx-tool-card { padding: var(--sp-5); }
  body.ds #dept-doctor .dept-doctor-photo { width: 7.5rem; }
  body.ds #dept-doctor .dept-doctor-name { font-size: var(--fs-lg); }
  body.ds #doctors-grid .person-card-head { flex-direction: row; align-items: flex-start; }
  body.ds #doctors-grid .person-card-photo { flex: none; width: min(8.5rem, 38%); }
  body.ds #doctors-grid .person-card-headinfo { flex: 1 1 auto; width: auto; }
}
/* M（第2弾）：2列の行を1列に積む。文字を大きくする設定（47.5em）でも積む */
@media (max-width: 760px), (max-width: 47.5em) {
  body.ds #kouza-list .kouza-item { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2) var(--sp-4); }
  body.ds #kouza-list .kouza-item-body { flex: 1 1 100%; }
  body.ds .ds-courses { grid-template-columns: minmax(0, 1fr); }
  body.ds #booking .bk-day { grid-template-columns: minmax(0, 1fr); }
  body.ds #ev-summary .ev-summary-row, body.ds #lab-status-list .status-row { display: block; }
  body.ds #ev-summary .ev-summary-label, body.ds #lab-status-list .status-row span { margin-right: var(--sp-3); }
  body.ds #booking .bk-day-h { min-height: 0; }
}
/* M（第2弾）：過去の回の1行は、1段目に 日付・種類（入らなければ折り返す）、2段目に題名。開閉の印は右端で行の高さの真ん中 */
@media (max-width: 760px), (max-width: 47.5em) {
  body.ds #kouza-list .kouza-past-sum {
    position: relative; display: flex; flex-wrap: wrap; align-items: baseline;
    gap: var(--sp-2) var(--sp-3); padding-right: calc(var(--sp-4) + var(--sp-5));
  }
  body.ds #kouza-list .kouza-past-theme { flex: 1 1 100%; }
  body.ds #kouza-list .kouza-past-sum::before, body.ds #kouza-list .kouza-past-sum::after {
    position: absolute; top: 0; bottom: 0; left: auto; margin-block: auto; align-self: auto; justify-self: auto;
  }
  body.ds #kouza-list .kouza-past-sum::before { right: 0; }
  body.ds #kouza-list .kouza-past-sum::after { right: var(--sp-2); }
}
/* M（第3弾）：精密検査の階段の図は、狭い画面と文字を大きくする設定（47.5em）で「横棒を縦に積む」形にする（レベル5が上）。
   棒の長さはレベルごとに伸び、右に段階の名前と「いまここ」 */
@media (max-width: 760px), (max-width: 47.5em) {
  body.ds.ds-seimitsu #shindan-data-app .ka-stairs, body.ds.ds-seimitsu #shindan-infra-app .ka-stairs {
    flex-direction: column-reverse; align-items: stretch; gap: var(--sp-2); padding-top: 0; border-bottom: 0;
  }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair, body.ds.ds-seimitsu #shindan-infra-app .ka-stair { flex-direction: row; align-items: center; gap: var(--sp-3); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-bar {
    flex: none; width: var(--sp-8); max-width: 50%; height: auto; min-height: var(--sp-6); align-content: center;
    padding: 0 var(--sp-2); border-bottom: 1px solid var(--color-border-strong);
    border-top-left-radius: 0; border-top-right-radius: var(--r-xs); border-bottom-right-radius: var(--r-xs); border-bottom-left-radius: 0;
  }
  /* 棒の長さ：段はレベル0から順に並ぶので、2段目（レベル1）から1段ずつ伸ばす（style 属性の --i は ds.css では使わない） */
  body.ds.ds-seimitsu #shindan-data-app .ka-stair:nth-child(2) .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair:nth-child(2) .ka-stair-bar { width: calc(var(--sp-8) + var(--sp-4)); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair:nth-child(3) .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair:nth-child(3) .ka-stair-bar { width: calc(var(--sp-8) + var(--sp-4) * 2); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair:nth-child(4) .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair:nth-child(4) .ka-stair-bar { width: calc(var(--sp-8) + var(--sp-4) * 3); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair:nth-child(5) .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair:nth-child(5) .ka-stair-bar { width: calc(var(--sp-8) + var(--sp-4) * 4); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair:nth-child(6) .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair:nth-child(6) .ka-stair-bar { width: calc(var(--sp-8) + var(--sp-4) * 5); }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair-phase, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-phase { flex: 1 1 0; min-width: 0; min-height: 0; text-align: left; }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair-flag, body.ds.ds-seimitsu #shindan-infra-app .ka-stair-flag { position: static; order: 3; transform: none; }
}
/* M（第3弾）：提供事業者の一覧の「見出し｜値」を、狭い画面と文字を大きくする設定（47.5em）で縦に積む */
@media (max-width: 760px), (max-width: 47.5em) {
  body.ds.ds-provider .biz-row { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); padding: var(--sp-3) 0; }
  body.ds.ds-provider .biz-row:first-child { padding-top: var(--sp-3); }
}
/* M（第3弾）：LP の入口の要点の行を詰め、小さなスマホ（360×640）でも「無料でIT健康診断を受ける」を最初の画面に収める */
@media (max-width: 760px), (max-width: 47.5em) {
  body.ds.ds-lp .ds-lp__points li { padding-block: var(--sp-2); }
}
/* M（第2弾）：ボタンを横いっぱいに・枠の内側を詰める */
@media (max-width: 760px) {
  body.ds .ds-pagehero__actions .btn { width: 100%; padding-inline: var(--sp-4); }
  body.ds #apply-form-wrap .btn { width: 100%; }
  body.ds #event-apply-form, body.ds #kouza-form, body.ds #booking-form, body.ds #lab-sponsor-form, body.ds #lab-student-form,
  body.ds #kl-card { padding: var(--sp-5); }
  body.ds .nav--simple > .nav-cta { padding: 0 var(--sp-3); }
  body.ds .da-form .apply-note { padding: var(--sp-4); }
}
/* M（第3弾）：精密検査の札と相談の案内の内側を詰め、処方箋と相談のボタンを横いっぱいに */
@media (max-width: 760px) {
  body.ds.ds-seimitsu #shindan-data-app .quiz-card, body.ds.ds-seimitsu #shindan-infra-app .quiz-card,
  body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta { padding: var(--sp-5); }
  body.ds.ds-seimitsu #shindan-data-app .ka-rx-btn, body.ds.ds-seimitsu #shindan-infra-app .ka-rx-btn,
  body.ds.ds-seimitsu #shindan-data-app .ds-ka-cta .btn, body.ds.ds-seimitsu #shindan-infra-app .ds-ka-cta .btn { width: 100%; padding-inline: var(--sp-4); }
}

/* N：写真の節を縦長の組み方にする */
@media (max-width: 760px), (orientation: portrait), (max-height: 520px) {
  body.ds .hero { display: block; min-height: 0; }
  body.ds .ds-hero__media { bottom: auto; height: 100vh; height: 100svh; }
  body.ds .ds-hero__inner {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(100vh, auto) auto;
    grid-template-rows: minmax(100svh, auto) auto;
    max-width: none; padding: 0; row-gap: 0;
  }
  body.ds .ds-hero__main {
    background: var(--glass-bg);
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
    backdrop-filter: blur(var(--glass-blur)) saturate(140%);
    border: 1px solid var(--glass-line);
    border-radius: var(--r-glass);
    align-self: end;
    max-width: var(--w-narrow);
    margin: calc(var(--nav-h) + var(--sp-3) + var(--sp-5)) var(--sp-edge) var(--sp-5);
    padding: var(--sp-5) var(--sp-4);
  }
  body.ds .ds-hero__label { margin-bottom: var(--sp-4); }
  body.ds .ds-hero__lead { margin-top: var(--sp-4); }
  body.ds .ds-hero__actions { margin-top: var(--sp-5); }
  body.ds .ds-hero__actions .btn { width: 100%; }
  body.ds .ds-hero__rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--sp-5);
    padding: var(--sp-5) var(--sp-edge);
    border-top: 0; background: var(--color-surface);
  }
  body.ds .ds-rail__item:nth-child(3) { border-left: 0; padding-left: 0; }
  body.ds .ds-hero__card { display: none; }

  body.ds .ds-cta__scrim { background-image: none; background-color: var(--scrim-strong); }
  body.ds .ds-cta__inner { max-width: none; }
}
/* 横向きの低い画面：写真を見出しの枠の下まで敷き（レールの白で下を隠す）、ボタンは横に並べる */
@media (orientation: landscape) and (max-height: 520px) {
  body.ds .ds-hero__media { bottom: 0; height: auto; }
  body.ds .ds-hero__actions .btn { width: auto; }
  body.ds .ds-hero__rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.ds .ds-rail__item:nth-child(3) { border-left: 1px solid var(--glass-line); padding-left: var(--sp-4); }
}
/* 狭い画面のヒーロー：すりガラスの枠をヘッダーのバーと同じ端（12px）にそろえ、見出しを2行に収める */
@media (max-width: 760px) {
  body.ds .ds-hero__main { margin: calc(var(--nav-h) + var(--sp-3) + var(--sp-5)) var(--sp-3) var(--sp-3); padding: var(--sp-5) var(--sp-3); }
  body.ds .ds-hero__rail { padding-inline: var(--sp-5); }
  body.ds .ds-hero__actions .btn { padding-inline: var(--sp-4); }
}
/* 360px 前後：院名を省略させずに「無料で診断」とメニューのボタンを並べる */
@media (max-width: 400px) {
  body.ds .site-header .nav { padding-inline: var(--sp-2); }
  body.ds .ds-nav-quick { padding: 0 var(--sp-2); }
}
/* 縦長・狭い画面の院内ツアーの帯：写真を縦に */
@media (max-width: 760px), (orientation: portrait) {
  body.ds .ds-tourband__frame { aspect-ratio: 4 / 5; }
  body.ds .ds-tourband__photo { object-position: 50% 20%; }
  body.ds .ds-tourband__card { left: var(--sp-3); right: var(--sp-3); bottom: var(--sp-3); width: auto; }
}

/* =================================================================
   JavaScript が動かない：出現の演出を省いてすべて見せる。ナビはリンクを並べる
   ================================================================= */
@media (scripting: none) {
  body.ds .reveal { opacity: 1; filter: none; }
  body.ds .nav-toggle { display: none; }
  body.ds .site-header { position: relative; inset: auto; margin: var(--sp-3) var(--sp-edge) 0; }
  body.ds .site-header .nav { flex-wrap: wrap; }
  body.ds .ds-hero__inner { padding-top: var(--sp-7); }
}
@media (scripting: none) and (max-width: 760px) {
  body.ds .site-header { margin: var(--sp-2) var(--sp-3) 0; }
}
@media (scripting: none) and (max-width: 760px), (scripting: none) and (orientation: portrait), (scripting: none) and (max-height: 520px) {
  body.ds .ds-hero__inner { padding-top: 0; grid-template-rows: auto auto; }
  body.ds .ds-hero__main { margin-top: var(--sp-5); }
}
@media (scripting: none) and (max-width: 1240px), (scripting: none) and (max-width: 77.5em) {
  body.ds .ds-nav { flex: 1 1 100%; }
  body.ds .ds-nav-quick { display: none; }
  body.ds .nav-links a:not(.btn) { font-size: var(--fs-sm); padding: var(--sp-2) var(--sp-3); }
  body.ds .nav-links {
    position: static; flex-direction: row; flex-wrap: wrap;
    padding: 0 0 var(--sp-2);
    opacity: 1; visibility: visible; pointer-events: auto;
    background: transparent; border: 0; max-height: none;
  }
  body.ds .nav-links li + li:not(.nav-cta) { border-top: 0; }
  body.ds .nav-cta .btn { width: auto; }
}
/* JS 無効（第1弾）：ヘッダーが浮かないので、ページの頭の上の余白を詰める */
@media (scripting: none) {
  body.ds .ds-pagehead { padding-top: var(--sp-6); }
}
/* JS 無効（第3弾）：ヘッダーが流れの中に戻るので、学びの冒険の入れ物の上の余白を 0 に戻す */
@media (scripting: none) {
  body.ds.ds-game .game-shell { padding-top: 0; }
}

/* =================================================================
   動きを減らす：すぐに最後の状態にして、揺れを止める（開いたまま設定を変えても追従する）
   ================================================================= */
@media (prefers-reduced-motion: reduce) {
  body.ds .reveal, body.ds .reveal.in, body.ds .ds-hero__copy, body.ds .ds-hero__rail, body.ds .ds-hero__card {
    animation: none; opacity: 1; filter: none; transition: none;
  }
  body.ds .ds-hero__shade { animation: none; transform: scaleX(var(--ds-shade-flip)); opacity: var(--ds-shade-op); }
  body.ds .btn, body.ds .nav-links, body.ds .nav-links a, body.ds .ds-acc__icon::after, body.ds .ds-acc__title,
  body.ds .ds-dept__link, body.ds .ds-link, body.ds .ds-person__name a, body.ds .news-more-btn,
  body.ds .site-footer .footer-grid a, body.ds #soudan .form-field input { transition: none; }
}
/* 動きを減らす（第1弾）：診断・科・専門家のページの色や幅の変化も、その場で切り替える */
@media (prefers-reduced-motion: reduce) {
  body.ds #shindan-app .option, body.ds #shindan-app .option .dot, body.ds #shindan-app .option .dot svg,
  body.ds #shindan-app .progress-bar, body.ds #shindan-app .cat-bar .fill, body.ds #shindan-app .cat-bar-link,
  body.ds #shindan-app .share-btn, body.ds #shindan-app .cl-item, body.ds #shindan-app .cl-box, body.ds #shindan-app .sym-dept-link,
  body.ds #dept-main .data-rx-detail-toggle, body.ds #dept-main .data-rx-detail-toggle .chev,
  body.ds .ds-others__link, body.ds .ds-breadcrumb a,
  body.ds #doctors-grid .dept-chip, body.ds #dept-doctor .ds-link, body.ds #lead-modal .form-field input { transition: none; }
}
/* 動きを減らす（第2弾）：予約の枠と方法・講座のボタンと画像の前後・フォームの入力欄の色の変化も、その場で切り替える */
@media (prefers-reduced-motion: reduce) {
  body.ds #booking .bk-slot, body.ds #booking .bk-method,
  body.ds #kouza-list .kouza-more, body.ds #kouza-list .kouza-item-cta, body.ds #kouza-list .kouza-item-map, body.ds #kouza-list .kouza-gallery-btn,
  body.ds #event-apply-form .form-field input, body.ds #kouza-form .form-field input, body.ds #booking-form .form-field input,
  body.ds #lab-sponsor-form .form-field input, body.ds #lab-student-form .form-field input { transition: none; }
  /* 送信中の回転表示も止める（style.css は遅くするだけ。doctor-apply は変更前のページ専用の規則で止めていた） */
  body.ds #event-apply-form .spinner, body.ds #kouza-form .spinner, body.ds #booking-form .spinner,
  body.ds #lab-sponsor-form .spinner, body.ds #lab-student-form .spinner, body.ds #apply-form .spinner { animation: none; }
}
/* 動きを減らす（第2弾）：過去の回の開閉の印と題名の色も、その場で切り替える */
@media (prefers-reduced-motion: reduce) {
  body.ds #kouza-list .kouza-past-sum::after, body.ds #kouza-list .kouza-past-theme { transition: none; }
}
/* 動きを減らす（第3弾）：フッターの法務リンクの色の変化も、その場で切り替える */
@media (prefers-reduced-motion: reduce) {
  body.ds .site-footer .ds-footer-legal a { transition: none; }
}
/* 動きを減らす（第3弾）：精密検査の選択肢の枠・印・チェックと、進み具合の棒の伸びも、その場で切り替える */
@media (prefers-reduced-motion: reduce) {
  body.ds.ds-seimitsu #shindan-data-app .option, body.ds.ds-seimitsu #shindan-infra-app .option,
  body.ds.ds-seimitsu #shindan-data-app .option .dot, body.ds.ds-seimitsu #shindan-infra-app .option .dot,
  body.ds.ds-seimitsu #shindan-data-app .option .dot svg, body.ds.ds-seimitsu #shindan-infra-app .option .dot svg,
  body.ds.ds-seimitsu #shindan-data-app .progress-bar, body.ds.ds-seimitsu #shindan-infra-app .progress-bar { transition: none; }
}
/* 動きを減らさない設定のときだけ（第3弾・学びの冒険の中）：今の見た目どおり、主なボタンと LINE のボタンは指を乗せると少し浮く */
@media (prefers-reduced-motion: no-preference) {
  body.ds.ds-game #game-root .btn-primary:hover, body.ds.ds-game .game-modal .btn-primary:hover,
  body.ds.ds-game #game-root .btn-line:hover, body.ds.ds-game .game-modal .btn-line:hover { transform: translateY(-2px); }
}

/* =================================================================
   すりガラスが使えない端末・「透明度を下げる」設定：不透明な白にする
   ================================================================= */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.ds .ds-glass, body.ds .site-header .nav, body.ds .ds-btn-glass { background: var(--glass-bg-solid); }
  @media (max-width: 760px), (orientation: portrait), (max-height: 520px) {
    body.ds .ds-hero__main { background: var(--glass-bg-solid); }
  }
}
/* 背景ぼかしが使えない端末（第2弾）：講座の申込ボタンの帯も白にする */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.ds .ds-kouza-pair #kouza-jump { background: var(--glass-bg-solid); }
}
@media (prefers-reduced-transparency: reduce) {
  body.ds .ds-glass, body.ds .site-header .nav, body.ds .ds-btn-glass {
    background: var(--glass-bg-solid);
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
}
@media (prefers-reduced-transparency: reduce) and (max-width: 760px), (prefers-reduced-transparency: reduce) and (orientation: portrait), (prefers-reduced-transparency: reduce) and (max-height: 520px) {
  body.ds .ds-hero__main {
    background: var(--glass-bg-solid);
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
}
/* 透明度を下げる（第2弾）：講座の画像の拡大表示の背景を不透明にする */
@media (prefers-reduced-transparency: reduce) {
  body.ds .modal-overlay.kouza-viewer { background: var(--color-primary); }
}
/* 透明度を下げる（第2弾）：講座の申込ボタンの帯は、ぼかさず不透明な白にする */
@media (prefers-reduced-transparency: reduce) {
  body.ds .ds-kouza-pair #kouza-jump { background: var(--color-surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* =================================================================
   強制色（Windows のハイコントラスト）：写真を外し、線・輪郭・フォーカス枠を見せる
   ================================================================= */
@media (forced-colors: active) {
  body.ds .ds-hero__media, body.ds .ds-hero__shade, body.ds .ds-cta__media { display: none; }
  body.ds .ds-glass, body.ds .site-header .nav, body.ds .ds-btn-glass, body.ds .ds-hero__main {
    background: Canvas; border-color: CanvasText;
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
  body.ds .ds-brand-cross::before, body.ds .ds-brand-cross::after,
  body.ds .site-footer .ds-brand-cross::before, body.ds .site-footer .ds-brand-cross::after,
  body.ds .ds-acc__icon::before, body.ds .ds-acc__icon::after,
  body.ds .ds-kicker__no::after, body.ds .ds-hero__label::before { background: CanvasText; }
}
/* 強制色（第1弾）：線・印・健康度・着地を、画面の色の設定で見えるようにする */
@media (forced-colors: active) {
  body.ds .ds-label::before, body.ds .ds-breadcrumb__list li + li::before,
  body.ds #shindan-app .gate-or::before, body.ds #shindan-app .gate-or::after,
  body.ds #shindan-app .literacy-dx-badge::before { background: CanvasText; }
  body.ds #shindan-app .option[aria-checked="true"] { border-color: Highlight; }
  body.ds #shindan-app .option[aria-checked="true"] .dot, body.ds #shindan-app .cl-item[aria-pressed="true"] .cl-box {
    forced-color-adjust: none; background: Highlight; border-color: Highlight; color: HighlightText;
  }
  body.ds #shindan-app .ds-result__mark, body.ds #shindan-app .cat-bar .fill, body.ds #shindan-app .progress-bar { forced-color-adjust: none; background: CanvasText; }
  body.ds #shindan-app .cat-bar .track, body.ds #shindan-app .progress-track { border: 1px solid CanvasText; }
  body.ds #doctors-grid .person-card:target, body.ds #dept-main .data-pkg:target,
  body.ds #dept-main .data-pkg.is-mine, body.ds #dept-main .data-pkg.is-next { outline-color: Highlight; }
}
/* 強制色（第2弾）：選んだ時間の枠・選んだ相談方法・札の枠・書き換えられない欄・箇条の線・続きの印を見えるようにする */
@media (forced-colors: active) {
  body.ds #booking .bk-slot.is-on, body.ds #booking .bk-slot[aria-pressed="true"] {
    forced-color-adjust: none; background: Highlight; border-color: Highlight; color: HighlightText;
  }
  body.ds #booking .bk-method:has(input:checked) { border-color: Highlight; }
  body.ds #kouza-list .kouza-item-status, body.ds #kouza-list .kouza-item-map-tag,
  body.ds #lab-status-list .status-badge, body.ds .ds-courses__tag { border-color: CanvasText; }
  body.ds #apply-form .da-field input[readonly] { border-color: CanvasText; border-style: dashed; }
  body.ds .ds-story__list li::before, body.ds .ds-courses__points li::before, body.ds #kl-card .kl-eyebrow::before { background: CanvasText; }
  body.ds #kouza-list .kouza-item-detail.is-scroll::after, body.ds #kouza-list .kouza-item-reco-body.is-scroll::after {
    forced-color-adjust: none; background: Canvas; outline-color: Canvas; border-top-color: CanvasText;
  }
}
/* 強制色（第2弾）：講座の申込ボタンの帯の輪郭と、過去の回の罫線・開閉の印を見えるようにする */
@media (forced-colors: active) {
  body.ds .ds-kouza-pair #kouza-jump { background: Canvas; border-color: CanvasText; -webkit-backdrop-filter: none; backdrop-filter: none; }
  body.ds .ds-kouza-pair #kouza-jump .btn { border-color: ButtonText; }
  body.ds #kouza-list .kouza-past { border-bottom-color: CanvasText; }
  body.ds #kouza-list .kouza-past-sum::before, body.ds #kouza-list .kouza-past-sum::after { background: CanvasText; }
}
/* 強制色（第3弾）：精密検査の選んだ選択肢・進み具合の棒・階段の達成と現在地を、画面の色の設定で見えるようにする
   （状態は「チェック／いまここ／Lv.N」の文字と形でも分かる） */
@media (forced-colors: active) {
  body.ds.ds-seimitsu #shindan-data-app .option[aria-checked="true"], body.ds.ds-seimitsu #shindan-infra-app .option[aria-checked="true"] { border-color: Highlight; }
  body.ds.ds-seimitsu #shindan-data-app .option[aria-checked="true"] .dot, body.ds.ds-seimitsu #shindan-infra-app .option[aria-checked="true"] .dot {
    forced-color-adjust: none; background: Highlight; border-color: Highlight; color: HighlightText;
  }
  body.ds.ds-seimitsu #shindan-data-app .progress-bar, body.ds.ds-seimitsu #shindan-infra-app .progress-bar { forced-color-adjust: none; background: CanvasText; }
  body.ds.ds-seimitsu #shindan-data-app .progress-track, body.ds.ds-seimitsu #shindan-infra-app .progress-track { border: 1px solid CanvasText; }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-done .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-done .ka-stair-bar {
    forced-color-adjust: none; background: CanvasText; border-color: CanvasText; color: Canvas;
  }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-done .ka-stair-lv, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-done .ka-stair-lv { color: Canvas; }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-current .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-current .ka-stair-bar {
    forced-color-adjust: none; background: Highlight; border-color: Highlight;
  }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-current .ka-stair-lv, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-current .ka-stair-lv { color: HighlightText; }
  body.ds.ds-seimitsu #shindan-data-app .ka-stair.is-todo .ka-stair-bar, body.ds.ds-seimitsu #shindan-infra-app .ka-stair.is-todo .ka-stair-bar { border-color: CanvasText; }
}
/* 強制色（第3弾）：提供事業者・プライバシーポリシーの箇条の細い線の印を、画面の色の設定で見えるようにする */
@media (forced-colors: active) {
  body.ds.ds-legal .legal li::before { background: CanvasText; }
}

/* =================================================================
   印刷：出現の演出を省いてすべて見せる。ヘッダーは印刷しない（style.css）ので、頭の余白を詰める
   ================================================================= */
@media print {
  body.ds .reveal { opacity: 1; filter: none; }
  body.ds .ds-pagehead { padding-top: var(--sp-5); }
}
/* 印刷（第2弾）：講座の長い本文は枠の中でスクロールさせず、全文を出す（続きの印も出さない） */
@media print {
  body.ds #kouza-list .kouza-item-detail.is-scroll, body.ds #kouza-list .kouza-item-reco-body.is-scroll { max-height: none; overflow: visible; }
  body.ds #kouza-list .kouza-item-detail.is-scroll::after, body.ds #kouza-list .kouza-item-reco-body.is-scroll::after { display: none; }
}
/* 印刷（第2弾）：画面の下に留める講座の申込ボタンは印刷しない */
@media print {
  body.ds .ds-kouza-pair #kouza-jump { display: none; }
}
/* 印刷（第3弾）：ヘッダーは印刷しないので、学びの冒険の入れ物の上の余白を 0 に戻す */
@media print {
  body.ds.ds-game .game-shell { padding-top: 0; }
}