/* 採用14｜RT-03 宣言文テキストスクラブ（読めた分だけ明るくなる）（shimairoパターン sp-14）
   書き方の決まり：library/shimairo-patterns/README.md「3.」。すべて .sp-14 の中だけに効く。
   RT シリーズで共有していた .rt-wrap と --rt-… は、.sp-14 .rt-wrap と --sp14-… にした（12〜31 が同じ名前を使うため）。
   .is-ready（script.js が付ける）がないとき：文は全部濃いまま読める。

   Noppo camera テーマ 1.7.0 で入れたとき（型の保管庫 claude/shimairo-patterns 0700ba6 から。mock/patterns/README.md「司令塔が決めたこと」）
   - 色：--sp14-* と中の色を、テーマの :root の変数（--ink・--muted・--line・--wash・--accent・--white）に替えた
   - 外側の .rt-wrap の地は透明に（テーマの地 --paper の上で、白い四角が角丸の枠の外に出ないように）
   - 文の大きさ・太さ・書体は、テーマの想いの本文（15px・行の高さ 2.2・太さ 400・--sans）に合わせた。強く見せるのは .rt-w-accent の1か所（太字）
   - まだ読んでいない文の濃さ：0.16 → 0.68（白地で文字と地のコントラスト 4.5:1 前後。読める濃さ）
   - 読了の線・「読了 %」・「読み終わりました」は HTML に入れない（下の書き方は型のまま残してある）
   - 1.7.2：並びを 白い箱（本文）→ 署名 → LINEで相談 に（v5 と同じ。CEO「案A」）。ボタンの色づきは兄弟の書き方で残す（いちばん下）
   - 1.14.0：トップの黄色に合わせて、白い箱を薄い黄色の地（--y-tint・線 --y-line-soft）に、ボタンの線を --y-line に、読み終わった後のボタンの地を黒から --y-btn（文字は --ink）に（CEO ボードQ79 A） */
/* テーマの要素の書き方を、型の中ではブラウザの標準に戻す（README.md「3-2.」。いちばん上に置く） */
.sp-14 :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, blockquote, figure, figcaption, table, caption, th, td, hr, img, a, button, input, select, textarea, label, fieldset, legend, small, strong, em, details, summary):where(:not([data-slot] *)) { all: revert; }
/* 元は body の指定がなく、ブラウザの標準の余白（8px）・文字の値で見えていた。どのページに置いても同じ見た目になるように、型に持たせる
   （README.md「3-2.」）。中の行の高さは .rt-wrap の 1.75（元のまま） */
.sp-14 {
  display: flow-root;
  padding: 0 8px;
  line-height: normal;
  font-size: 16px; font-weight: 400; font-style: normal; letter-spacing: normal; text-align: start; text-transform: none;
  /* 文字の色・書体のもと（中の .rt-wrap と同じ値。見た目は変わらない。テーマの値を受け継がないように） */
  color: var(--ink);
  font-family: var(--sans);
}
.sp-14 .rt-wrap {
  --sp14-brand: var(--ink); --sp14-ink: var(--ink); --sp14-sub: var(--muted); --sp14-line: var(--line); --sp14-soft: var(--wash);
  --sp14-accent: var(--accent); --sp14-accent2: var(--line);
  font-family: var(--sans);
  color: var(--sp14-ink);
  background: transparent;
  line-height: 1.75;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.sp-14 .rt-wrap * { box-sizing: border-box; }
/* 外側の余白：元の body の margin（8px）と同じく、中の部品の margin と重なる形（上下は .rt-wrap の margin、左右は箱の padding。README.md「3-2.」） */
.sp-14 > .rt-wrap { margin: 8px 0; }
/* 文字の要素の書体は .rt-wrap から受け継ぐ（テーマの .entry-content p{font-family} などより強く。型のクラスの指定はこの後に書く） */
.sp-14 .rt-wrap :where(h1, h2, h3, h4, h5, h6, p, li, figcaption, small, strong, label) { font-family: inherit; }
/* 見出し・段落は、テーマの書き方（フォント・太さ・行の高さ・文字の間隔・色）を受け継がない。元はブラウザの標準の見出し・段落の値で見えていた。
   :where で弱くしてあるので、下の型の書き方（大きさ・余白・色など）がそのまま勝つ */
.sp-14 .rt-wrap :where(h1, h2, h3, h4, p) { font-family: inherit; font-style: normal; letter-spacing: inherit; text-transform: none; color: inherit; }
.sp-14 .rt-wrap :where(h1, h2, h3, h4) { font-weight: 700; line-height: inherit; }
/* RT-03 テキストスクラブ */
.sp-14 .rt-scrub { border: 1px solid var(--y-line-soft); border-radius: 16px; padding: 26px 20px; background: var(--y-tint); }
/* 文：テーマの想いの本文と同じ大きさ・太さ（Noppo camera。型は 20〜28px・800） */
.sp-14 .rt-scrub-text { font-size: 15px; font-weight: 400; line-height: 2.2; letter-spacing: .035em; margin: 0; color: var(--sp14-ink); }
/* 段落の間のあき（型は margin 0。テーマの段落のあき 22px） */
.sp-14 .rt-scrub-text + .rt-scrub-text { margin-top: 22px; }
.sp-14 .rt-w { color: inherit; transition: opacity .3s ease, color .3s ease; }
/* まだ読んでいない文：読める濃さ（Noppo camera。型は .16） */
.sp-14 .rt-scrub.is-ready .rt-w { opacity: .68; }
.sp-14 .rt-scrub.is-ready .rt-w.is-lit { opacity: 1; }
.sp-14 .rt-scrub .rt-w-accent { color: inherit; font-weight: 700; }
.sp-14 .rt-scrub.is-ready .rt-w-accent.is-lit { color: var(--sp14-accent); }
.sp-14 .rt-scrub-bar { height: 4px; background: var(--sp14-line); border-radius: 999px; overflow: hidden; margin: 20px 0 0; }
.sp-14 .rt-scrub-bar i { display: block; height: 100%; width: 0; background: var(--sp14-brand); transition: width .2s ease; }
.sp-14 .rt-scrub-meta { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 10px; }
.sp-14 .rt-scrub-pct { font-size: 11px; font-weight: 800; letter-spacing: .08em; color: var(--sp14-sub); }
.sp-14 .rt-scrub-done { font-size: 11.5px; font-weight: 800; color: var(--ink); background: var(--y-btn); border-radius: 999px; padding: 4px 12px; transition: opacity .35s ease, transform .35s ease; }
.sp-14 .rt-scrub.is-ready .rt-scrub-done { opacity: 0; transform: translateY(4px); }
.sp-14 .rt-scrub.is-ready.is-complete .rt-scrub-done { opacity: 1; transform: none; }
/* リンクの見た目は型が決める（テーマの a の見た目を受け継がない） */
.sp-14 .rt-scrub-cta { display: inline-block; margin: 16px 0 0; font: inherit; font-size: 13.5px; font-weight: 800; line-height: 1.75; letter-spacing: normal; text-transform: none; color: var(--sp14-brand); background: var(--white); border: 2px solid var(--y-line); border-radius: 999px; box-shadow: none; padding: 10px 20px; text-decoration: none; transition: all .35s ease; }
.sp-14 .rt-scrub.is-complete .rt-scrub-cta { background: var(--y-btn); color: var(--ink); }
/* LINE の入口の「↗」（テーマの noppo_line_link が出す。Noppo camera） */
.sp-14 .rt-scrub-cta .ext { margin-left: .5em; }
/* 1.7.2（CEO 2026-11-04「案A」）：並びは 白い箱（本文）→ 署名 → LINEで相談（v5 と同じ）。
   ボタンは箱の外（箱の後ろの兄弟）。読み終わると色づくのは、兄弟の書き方（~）で残す。
   ボタンの上のあきは、テーマの各欄の終わりの LINE と同じ（PC 48px・スマホ 36px）。署名はテーマの .signature の見た目 */
.sp-14 .rt-wrap > .rt-scrub-cta { margin-top: 48px; }
.sp-14 .rt-scrub.is-complete ~ .rt-scrub-cta { background: var(--y-btn); color: var(--ink); }
.sp-14 .rt-wrap > .signature { color: var(--ink); }
@media (max-width: 700px) {
  .sp-14 .rt-wrap > .rt-scrub-cta { margin-top: 36px; }
}

/* 動きを控えめにする設定：文は最初から全部濃く（script.js）。残る切り替えも、その場で */
@media (prefers-reduced-motion: reduce) {
  .sp-14 .rt-w, .sp-14 .rt-scrub-bar i, .sp-14 .rt-scrub-done, .sp-14 .rt-scrub-cta { transition: none; }
}