/* tenroin-top/article.css — READING LIFE 誌面（トップ記事セクション＋記事リーダー）
   colors_and_type.css（TENRO-IN DS）と styles.css（誌面キット）の上に載る差分だけを書く */

/* ═══ トップ：本誌 — READING LIFE セクション ═══ */
.arts{ padding: clamp(72px,9vw,120px) 0; }
.arts-lead{ font-family:var(--font-serif); font-size:clamp(14px,1.6vw,16px); line-height:2.1; color:var(--fg-soft,#4A5A60); max-width:640px; margin:18px 0 34px; }
.arts-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr)); gap:18px; }
.art-card{ display:flex; flex-direction:column; gap:12px; background:var(--paper-000,#FCFBF6); border:1px solid var(--border,#DCD3C1); border-top:3px solid var(--acc,#C2A052);
  padding:26px 26px 20px; text-decoration:none; color:inherit; transition:transform .25s ease, box-shadow .25s ease; overflow:hidden; }
.ac-ph{ margin:-26px -26px 4px; aspect-ratio:16/9.6; overflow:hidden; background:var(--night-900,#121E24); }
.ac-ph img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.001); transition:transform .8s cubic-bezier(.22,.61,.36,1); }
.art-card:hover .ac-ph img{ transform:scale(1.055); }
.art-card:hover{ transform:translateY(-4px); box-shadow:0 18px 44px rgba(22,36,43,.12); }
.ac-kick{ display:flex; justify-content:space-between; align-items:baseline; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.24em; color:var(--acc,#C2A052); text-transform:uppercase; }
.ac-pg{ color:var(--fg-mute,#8C8676); letter-spacing:.14em; }
.ac-title{ font-family:var(--font-display,'Klee One',serif); font-size:clamp(19px,2.3vw,23px); font-weight:600; line-height:1.6; letter-spacing:.04em; margin:0; }
.ac-lede{ font-family:var(--font-serif); font-size:13px; line-height:2; color:var(--fg-soft,#4A5A60); margin:0;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ac-foot{ margin-top:auto; display:flex; align-items:baseline; gap:14px; border-top:1px solid var(--border-soft,#E6DECF); padding-top:12px;
  font-family:var(--font-sans); font-size:11px; color:var(--fg-mute,#8C8676); }
.ac-ai{ color:var(--gold-700,#93702F); }
.ac-ai.dim{ color:var(--fg-mute,#8C8676); }
.ac-arrow{ margin-left:auto; color:var(--acc,#C2A052); transition:transform .2s; }
.art-card:hover .ac-arrow{ transform:translateX(4px); }
.arts-note{ margin-top:26px; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.2em; color:var(--fg-mute,#8C8676); text-align:right; }

/* ═══ 写真見開き（フルブリード・ヒーロー） ═══ */
.art-photo-hero{ position:relative; width:100vw; margin-left:calc(50% - 50vw); height:clamp(440px,74vh,780px); overflow:hidden; margin-top:26px; background:var(--night-900,#121E24); }
.aph-img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.045); animation:aphIn 2.4s cubic-bezier(.22,.61,.36,1) forwards; }
@keyframes aphIn{ to{ transform:scale(1); } }
@media (prefers-reduced-motion:reduce){ .aph-img{ animation:none; transform:none; } }
.aph-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,
  rgba(10,16,20,.5) 0%, rgba(10,16,20,.16) 16%, rgba(10,16,20,0) 32%,
  rgba(10,16,20,0) 42%, rgba(10,16,20,.14) 54%, rgba(10,16,20,.38) 66%,
  rgba(10,16,20,.66) 78%, rgba(10,16,20,.86) 90%, rgba(10,16,20,.93) 100%); }
.aph-in,.aph-top{ z-index:3; }
.aph-in{ position:absolute; left:0; right:0; bottom:0; padding:0 0 clamp(30px,5.5vh,58px); }
.aph-in-narrow{ max-width:860px; margin:0 auto; padding:0 clamp(20px,4vw,32px); }
.art-kick.light{ color:var(--gold-400,#D6BC7E); }
.art-kick.light .ak-pg{ color:rgba(252,251,246,.72); }
.art-kick.light .ak-proof{ color:#F0BFAF; }
.art-title.light{ color:#FCFBF6; margin:14px 0 0; text-shadow:0 2px 34px rgba(0,0,0,.5); font-size:clamp(30px,5.2vw,52px); }
.aph-credit{ position:absolute; right:clamp(10px,1.6vw,20px); bottom:14px; writing-mode:vertical-rl; font-family:var(--font-label,'Jost',sans-serif); font-size:9px; letter-spacing:.32em; color:rgba(252,251,246,.62); }
.art-head .art-lede{ margin-top:30px; }

/* 本文の図版（誌面プルアウト＝本文段より一回り広く） */
.artb-fig{ width:min(880px,94vw); margin:3em 0 3em 50%; transform:translateX(-50%); }
/* 🔴2026/9/23＝会員の写真は小さいことがある（実測 299x400 が 880px に伸びて粗く出ていた）。
   実寸を超えて拡大しない＝小さい一枚はそのまま中央に、大きい一枚はこれまでどおり器いっぱい。 */
.artb-fig img{ max-width:100%; width:auto; height:auto; display:block; margin:0 auto; }
.artb-fig figcaption{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.22em; color:var(--fg-mute,#8C8676); border-bottom:1px solid var(--border-soft,#E6DECF); padding:10px 2px; }

/* ═══ 扉の誌面一式（写真上のタイポグラフィ） ═══ */
.aph-top{ position:absolute; top:0; left:0; right:0; z-index:3; display:flex; align-items:baseline; gap:20px;
  padding:clamp(16px,2.8vh,28px) clamp(20px,3.6vw,48px); }
.aph-mag{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(15px,1.8vw,21px); letter-spacing:.24em; color:#FCFBF6; }
.aph-no{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.3em; color:rgba(252,251,246,.72); }
.aph-cat{ margin-left:auto; display:flex; align-items:baseline; gap:14px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.26em; color:var(--gold-400,#D6BC7E); text-transform:uppercase; text-align:right; }
.aph-cat.solo{ margin-left:0; }
.aph-cat em{ font-style:normal; color:rgba(252,251,246,.68); letter-spacing:.16em; }
.aph-cat i{ font-style:normal; font-size:9.5px; letter-spacing:.2em; color:#F0BFAF; border:1px solid currentColor; border-radius:3px; padding:2px 8px; }
.aph-lede{ font-family:var(--font-serif); font-size:clamp(12.5px,1.45vw,14.5px); line-height:2.05; color:rgba(252,251,246,.92);
  max-width:560px; margin:16px 0 0; }
.aph-author{ margin-top:16px; display:flex; align-items:center; gap:12px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.28em; color:var(--gold-400,#D6BC7E); }
.aa-line{ width:46px; height:1px; background:var(--gold-400,#D6BC7E); }

/* 欄の札（書き手の欄・CTO 2026/9/7 17:10）── 署名の脇に小さく。
   ★出す／出さないを決めるのは articles.jsx の columnLabel。ここは姿だけを持つ。
   ⚠️並びの子の床を外し、器が折れるようにしてある ── 札の分だけ行が伸びるので、
     狭い幅では折り返させないと署名ごと器を押し広げる（今日 .rack-item で踏んだのと同じ型）。 */
/* 🔴札が在るときだけ折り返す。素で当てると**今日から**丈が変わる
     （実測 2026/9/7＝37 → 50px・320/360/375/390/414 の全幅で。札は今日 0件なのに器だけ動いていた）。
   ⚠️`:has()` を解さない古い機では**この一行が丸ごと捨てられる**＝いまと同じ姿に戻るだけ
     （札が出る日にだけ、その機で署名が一行に詰まる）。安全側に倒れる。 */
.aph-author:has(.aa-col){ flex-wrap:wrap; }
/* ══ 落款 ── 記事の第一層（スキル）の印（代表 2026/9/9・色は金） ══
   主＝陽刻（金地に紙の字）／副＝陰刻（枠だけ）。**既にある金の階調だけ**を使う
   ＝新しい色を足していない（意匠体系に朱が無いため、代表裁定で金に決まった）。

   🔴**すべて `.rl-seals` の子として書く**（詳細度 0,2,0）。
     素の `.rl-seal`（0,1,0）だと、置いた先の体系の規則に負ける ──
     書庫の一覧には `.mgz-arch-list span`（0,1,1）が在り、実測で**字の色が地に沈み
     （比 1.13:1）、書体も別のものに化けた**。絵を見るまで数では気づけなかった。
   ★札を持つ記事が出るまで、この規則は一度も当たらない（器ごと描かれないため）。 */
.rl-seals{ display:inline-flex; align-items:center; gap:3px; flex:none; vertical-align:middle; }
.rl-seals .rl-seal{ display:inline-flex; align-items:center; justify-content:center; flex:none;
  font-family:'Klee One','Hiragino Mincho ProN',var(--font-jp-serif,serif); font-weight:600;
  line-height:1; border-radius:2px; letter-spacing:0; text-decoration:none; }
/* 濃いほうの金を採る ── 紙色の字との見え方の比を実測して選んだ（2026/9/9）：
   gold-500 2.40 ／ gold-600 3.10 ／ **gold-700 4.41**（AA の目安 4.50・部品は 3.00）。
   ★体系に在る値だけ＝新しい色は足していない。 */
.rl-seals .rl-seal-main{ width:22px; height:22px; font-size:13px;
  background:var(--gold-700,#93702F); color:var(--paper-000,#FCFBF6); }
.rl-seals .rl-seal-sub{ width:17px; height:17px; font-size:10px; background:transparent;
  color:var(--gold-700,#93702F); border:1.5px solid var(--gold-700,#93702F); }
/* 八つのうち「AI」だけ漢字一文字ではない（実測 2026/9/9・8つ中7つが漢字一文字）。
   代表裁定＝二字を小さく組む（漢字を新しく当てない＝名を二重にしない）。器の寸法は変えない。 */
.rl-seals .rl-seal-w{ font-family:var(--font-label,'Jost',sans-serif); font-weight:700; letter-spacing:.01em; }
.rl-seals .rl-seal-main.rl-seal-w{ font-size:9.5px; }
.rl-seals .rl-seal-sub.rl-seal-w{ font-size:7.5px; }
/* 署名の行に落款が並ぶときは、狭い幅で折り返せるようにする（.aa-col と同じ流儀）。 */
.aph-author:has(.rl-seals){ flex-wrap:wrap; }
/* 記事の頭の署名の行は**暗い扉の上**に在る（体系が既にそう扱っている＝この行の字は gold-400）。
   実測（2026/9/9・地は扉の暗色）：
     主の地  gold-700 4.60／gold-600 6.55／gold-500 8.44 ── ただし**中の紙色の字**は
             gold-700 4.41／gold-600 3.10／gold-500 2.40 と逆に落ちる
             ＝ **両方が読めるのは gold-700 だけ**なので、暗地でも主は変えない。
     副（枠だけ） gold-700 4.60 ／ **gold-400 11.35**（＝署名の字と同じ見え方）
   ＝ 副だけ、暗地用の金に振る。紙の上（書庫の一覧）では gold-400 は薄すぎるので振らない。 */
.aph-author .rl-seals .rl-seal-sub{ color:var(--gold-400,#D6BC7E); border-color:var(--gold-400,#D6BC7E); }

/* 書庫の一覧は**主だけ・小さめ**にする（実測 2026/9/9・内幅1458・三列 366px）。
   ★理由＝棚は minmax(280px,1fr) の格子で、落款が横幅を取ると**題が一行ぶん余計に折れる**。
     棚の丈 236px（落款なし）→ 281px（主22＋副17）→ **259px（主16のみ）**。
     主16のみなら行の丈が 85 で揃う（落款なしは 63 と 85 が混ざる）＝棚が整う。
   ★副は記事の頭で読める＝一覧で二顆まで出す必要がない。 */
.mgz-arch-list .rl-seals{ margin-right:2px; }
.mgz-arch-list .rl-seals .rl-seal-sub{ display:none; }
.mgz-arch-list .rl-seals .rl-seal-main{ width:16px; height:16px; font-size:10px; }
.mgz-arch-list .rl-seals .rl-seal-main.rl-seal-w{ font-size:7px; }

/* ══ 年の帯 ── 書庫が積み上がってきた形を、一目で（代表 2026/9/12・年は西暦）══
   棒の高さ＝その年に書かれた本数。書いていない年も細い線で残す（空白も歴史のうち）。
   ★色は既にある金と罫の階調だけ。新しい色は作っていない。 */
.mgz-years{ display:flex; align-items:flex-end; gap:clamp(3px,.9vw,10px);
  margin:22px 0 6px; padding:0 0 12px; border-bottom:1px solid var(--line,#DCD3C1);
  overflow-x:auto; }
.mgz-yr{ flex:1 1 0; min-width:26px; display:flex; flex-direction:column; align-items:center;
  gap:5px; text-decoration:none; color:inherit; }
/* 🔴台の箱は敷かない ── 敷くと箱のほうが目立ち、金の棒が下線に見えて
   積み上がりが読めなかった（実測 2026/9/12・絵を見て気づいた）。
   床の罫だけを引き、棒そのものを主役にする。 */
.myr-bar{ width:100%; height:56px; display:flex; align-items:flex-end;
  border-bottom:1px solid var(--line,#DCD3C1); }
.myr-bar>span{ display:block; width:100%; min-height:3px;
  background:var(--gold-600,#B08A3D); border-radius:1px 1px 0 0; }
.myr-n{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.06em;
  color:var(--warm-600,#6F6A5E); font-variant-numeric:tabular-nums; }
.myr-y{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.06em;
  color:var(--warm-500,#8C8676); font-variant-numeric:tabular-nums; }
a.mgz-yr:hover .myr-bar>span{ background:var(--gold-700,#93702F); }
a.mgz-yr:hover .myr-y,a.mgz-yr:focus-visible .myr-y{ color:var(--gold-700,#93702F); }
/* 書いていない年＝棒の代わりに床の細い線だけ */
/* 書いていない年＝棒そのものが無い（床の罫は同じ）。 */
.mgz-yr.is-none .myr-n,.mgz-yr.is-none .myr-y{ color:var(--line-strong,#C7BCA6); }
@media(max-width:560px){ .myr-bar{ height:40px } .myr-n{ font-size:9px } .myr-y{ font-size:8.5px } }

/* 年ごとの棚 */
.mgz-yrsec{ margin-top:26px; scroll-margin-top:80px; }
.mgz-yrh{ display:flex; align-items:baseline; gap:12px; padding-bottom:6px;
  border-bottom:1px solid var(--line-soft,#E6DECF); }
.myh-y{ font-family:var(--font-label,'Jost',sans-serif); font-size:15px; letter-spacing:.14em;
  color:var(--gold-700,#93702F); font-variant-numeric:tabular-nums; }
.myh-n{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.14em;
  color:var(--warm-500,#8C8676); }
.mgz-yrsec .mgz-arch-list{ margin-top:2px; }
.aa-col{ min-width:0; font-size:9px; letter-spacing:.2em; padding:3px 8px; border-radius:2px;
  border:1px solid currentColor; opacity:.8; white-space:nowrap; }
/* 台帳の作（会員・受講生）の側。誌面の欄の名の隣に並ぶので、少しだけ間を空ける。 */
.rlm-kind{ margin-left:8px; vertical-align:middle; }

/* ═══ シネマティック・ベール（写真の裾が溶けて沈む＝可読性の保証を写真的に） ═══ */
.photo-veil{ position:absolute; inset:0; z-index:2; pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg, transparent 50%, rgba(0,0,0,.8) 76%, #000 100%);
  mask-image:linear-gradient(180deg, transparent 50%, rgba(0,0,0,.8) 76%, #000 100%);
  backdrop-filter:blur(14px) brightness(.9); -webkit-backdrop-filter:blur(14px) brightness(.9); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .photo-veil{ background:linear-gradient(180deg, transparent 50%, rgba(10,16,20,.45) 78%, rgba(10,16,20,.6) 100%); }
}

/* 白文字直置き＝二層シャドウ（近接の輪郭＋遠景の沈み） */
.art-title.light{ text-shadow:0 1px 2px rgba(0,0,0,.42), 0 10px 44px rgba(0,0,0,.5); }
.aph-lede{ text-shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 30px rgba(0,0,0,.5); }
.aph-author,.aph-mag,.aph-no,.aph-cat{ text-shadow:0 1px 14px rgba(0,0,0,.5); }

/* ═══ 本誌マストヘッド（目次と切り分けた誌面の顔） ═══ */
.arts{ padding:0; background:var(--night-900,#121E24); }
.arts-head{ padding-top:clamp(48px,6vw,76px); }
.arts-lead{ font-family:var(--font-jp-serif); font-size:clamp(15px,1.5vw,18px); line-height:2.05;
  color:rgba(248,245,238,.82); max-width:48ch; margin:0 0 8px; }

/* ═══ 生きている表紙 ═══ */
.book{ position:relative; display:flex; justify-content:center; overflow:hidden;
  padding:clamp(28px,4.5vh,60px) clamp(16px,3vw,48px); perspective:2600px; }
.bk-ambient{ position:absolute; inset:-8%; z-index:0; pointer-events:none; }
.bk-ambient img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
  transition:opacity 1.8s ease; filter:blur(72px) brightness(.34) saturate(1.15); transform:scale(1.16); }
.bk-ambient img.is-act{ opacity:.85; }
.bk-ambient::after{ content:''; position:absolute; inset:0;
  background:radial-gradient(92% 84% at 50% 46%, transparent 28%, rgba(10,16,20,.78) 100%); }
.bk-ghost{ position:absolute; right:clamp(8px,3.6vw,64px); bottom:clamp(0px,1.6vh,18px); z-index:0; pointer-events:none;
  font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(130px,17vw,300px); line-height:.8;
  letter-spacing:.02em; color:rgba(252,251,246,.05); user-select:none; }
.bk-spread{ position:relative; z-index:1; height:min(94vh,930px); aspect-ratio:364/257; /* B5見開き */
  transform:translateX(-25%); transition:transform 1.05s cubic-bezier(.22,.75,.22,1); transform-style:preserve-3d; }
/* 3D体＝背表紙・裏板・小口・落ち影（閉じた一冊の厚み30px） */
.bk-body3d{ position:absolute; right:0; top:0; width:50%; height:100%; z-index:0; transform-style:preserve-3d; pointer-events:none; }
.bk-board{ position:absolute; inset:0; transform:translateZ(-30px); background:#0d171c; border-radius:2px 5px 5px 2px; }
.bk-spine{ position:absolute; left:0; top:0; bottom:0; width:30px; transform-origin:left center; transform:rotateY(90deg);
  display:flex; align-items:center; justify-content:center; border-radius:2px 0 0 2px;
  background:linear-gradient(90deg, #0c1519, #1c2d35 55%, #0c1519); }
.bk-spine span{ writing-mode:vertical-rl; font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.32em;
  color:rgba(214,188,126,.9); white-space:nowrap; }
.bk-fore{ position:absolute; right:0; top:3px; bottom:3px; width:30px; transform-origin:right center; transform:rotateY(-90deg);
  border-radius:0 2px 2px 0; background:repeating-linear-gradient(90deg, #EAE3D3 0 2px, #CFC5AE 2px 3.2px); }
.bk-shadow{ position:absolute; left:50%; right:-2%; bottom:-30px; height:38px; transform:translateZ(-32px); pointer-events:none;
  background:radial-gradient(50% 100% at 50% 0%, rgba(0,0,0,.55), transparent 74%); filter:blur(9px);
  transition:left 1.05s cubic-bezier(.22,.75,.22,1); }
.book.is-open .bk-shadow{ left:-2%; }
.book.is-open .bk-spread{ transform:translateX(0); }
@media (min-width:1141px){
  .bk-spread{ opacity:0; filter:blur(16px); }
  .book.is-in .bk-spread{ opacity:1; filter:blur(0);
    transition:opacity 1.15s ease, filter 1.5s cubic-bezier(.2,.7,.2,1), transform 1.05s cubic-bezier(.22,.75,.22,1); }
}
.book.is-toc .bk-spread{ filter:brightness(.55); }
.bk-cover{ position:absolute; right:0; top:0; width:50%; height:100%; z-index:2;
  transform-origin:left center; transform:rotateY(0deg); transform-style:preserve-3d;
  transition:transform 1.05s cubic-bezier(.22,.75,.22,1); }
.book.is-open .bk-cover{ transform:rotateY(-180deg); }
@media (min-width:1141px){
  .book:not(.is-open) .bk-cover{ cursor:pointer; }
  .book:not(.is-open) .bk-cover:hover{ transform:rotateY(-9deg); }
}
.bk-face{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; overflow:hidden; }
.bk-front{ border-radius:2px 5px 5px 2px;
  box-shadow:-18px 30px 70px -16px rgba(0,0,0,.62), 0 1px 0 rgba(0,0,0,.35); }
.bk-front::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:14px; z-index:5; pointer-events:none;
  border-radius:2px 0 0 2px; background:linear-gradient(90deg, rgba(0,0,0,.34), rgba(0,0,0,.06) 60%, transparent); }
.bk-front::after{ content:''; position:absolute; right:0; top:0; bottom:0; width:7px; z-index:6; pointer-events:none;
  background:repeating-linear-gradient(90deg, rgba(252,251,246,.15) 0 1px, rgba(10,16,20,.3) 1px 2.4px); }
.bk-back{ transform:rotateY(180deg); background:var(--night-900,#121E24); cursor:pointer; box-shadow:0 34px 90px rgba(0,0,0,.5); }
.bk-plate{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .8s ease; }
.bk-plate.is-act{ opacity:1; }
.bk-plate-shade{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(10,16,20,.04), rgba(10,16,20,.4) 97%), linear-gradient(180deg, transparent 70%, rgba(10,16,20,.55)); }
.bk-plate-cap{ position:absolute; left:18px; right:18px; bottom:16px; font-family:var(--font-serif); font-size:11.5px; letter-spacing:.08em;
  color:rgba(252,251,246,.85); text-shadow:0 1px 10px rgba(0,0,0,.6); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bk-plate-cap span{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.3em; color:var(--gold-400,#D6BC7E); margin-right:10px; }
.bk-contents{ position:absolute; right:0; top:0; width:50%; height:100%; background:var(--paper-050,#F8F5EE);
  border-radius:2px 5px 5px 2px; box-shadow:0 30px 80px rgba(0,0,0,.5); padding:clamp(22px,3.2vh,40px) clamp(20px,2.4vw,36px);
  display:flex; flex-direction:column; gap:13px; overflow:hidden; }
.bk-contents::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:34px; pointer-events:none; z-index:1;
  background:linear-gradient(90deg, rgba(10,16,20,.13), transparent); }
.cs-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.24em; color:var(--gold-700,#93702F); }
.cs-word{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(32px,3.2vw,50px); line-height:1; letter-spacing:.06em;
  color:var(--fg,#26333B); border-bottom:1px solid var(--fg,#26333B); padding-bottom:12px; }
.cs-rows{ border-top:1px solid var(--border-soft,#E6DECF); padding-top:4px; }
.cs-row{ appearance:none; -webkit-appearance:none; background:none; border:none; width:100%; cursor:pointer; display:flex; align-items:center; gap:10px;
  padding:9px 2px; text-align:left; font-family:var(--font-serif); font-size:12.5px; color:var(--fg-soft,#4A5A60);
  border-bottom:1px solid var(--border-soft,#E6DECF); transition:color .25s; }
.cs-row:hover{ color:var(--gold-700,#93702F); }
.cs-row .ar-arrow{ margin-left:auto; }
.twl-dot.sm{ width:7px; height:7px; }
.bk-close{ appearance:none; -webkit-appearance:none; align-self:flex-start; background:none; border:1px solid var(--border,#DCD3C1); border-radius:999px;
  padding:8px 16px; font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.2em; color:var(--fg-soft,#4A5A60); cursor:pointer; transition:.25s; }
.bk-close:hover{ color:var(--gold-700,#93702F); border-color:var(--gold-500,#C2A052); }
.bk-front.cvr{ position:absolute; inset:0; height:auto; background:var(--night-900,#121E24); }
.cvr-pub{ position:absolute; left:0; right:0; bottom:clamp(16px,2.6vh,26px); z-index:4;
  display:flex; justify-content:center; }
.cp-logo{ width:clamp(64px,7.4vh,84px); height:auto; display:block;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.4)) drop-shadow(0 6px 24px rgba(0,0,0,.55)); }
.cp-line{ flex:1; height:1px; background:rgba(252,251,246,.18); }
.cp-txt{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.24em; color:rgba(252,251,246,.6); white-space:nowrap; }
.cvr-ink{ background:radial-gradient(120% 100% at 50% 30%, #1c2d35, var(--night-900,#121E24) 70%) !important; }
.cvr-feat.vol-static{ pointer-events:none; }
@media (max-width:640px){ .cp-txt{ display:none; } }

/* ═══ 本棚（選んで、机の上でひらく） ═══ */
.shelf{ position:relative; z-index:1; margin-top:clamp(6px,1.4vh,18px); padding-bottom:clamp(40px,5vh,64px); }
.shf-kick{ display:flex; align-items:baseline; gap:14px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px;
  letter-spacing:.28em; color:var(--gold-400,#D6BC7E); margin-bottom:16px; }
.shf-kick span{ font-size:8.5px; letter-spacing:.2em; color:rgba(252,251,246,.45); }
.shf-scroll{ overflow-x:auto; overscroll-behavior-x:contain; margin:0 -10px; padding:8px 10px; }
.shf-scroll::-webkit-scrollbar{ height:6px; }
.shf-scroll::-webkit-scrollbar-track{ background:rgba(252,251,246,.06); border-radius:3px; }
.shf-scroll::-webkit-scrollbar-thumb{ background:rgba(214,188,126,.35); border-radius:3px; }
.shf-scroll{ scrollbar-width:thin; scrollbar-color:rgba(214,188,126,.35) rgba(252,251,246,.06); }
.shf-grid{ display:grid; grid-template-columns:repeat(4, max-content); width:max-content; min-width:100%;
  column-gap:clamp(22px,2.8vw,46px); align-items:end; }
.gp{ position:absolute; inset:0; overflow:hidden; background:var(--night-900,#121E24); }
.gp-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.9; }
.gp::after{ content:''; position:absolute; inset:0; background:radial-gradient(110% 90% at 50% 40%, transparent 40%, rgba(8,13,17,.55) 100%); }
.gp-in{ position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; padding:clamp(24px,4vh,42px) clamp(22px,2.6vw,38px); }
.gp-head{ display:flex; flex-direction:column; gap:6px; border-bottom:1px solid rgba(214,188,126,.4); padding-bottom:clamp(10px,1.8vh,16px); }
.gp-en{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.34em; color:var(--gold-400,#D6BC7E); }
.gp-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(26px,4.2vh,40px); letter-spacing:.14em; color:#FCFBF6;
  text-shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 30px rgba(0,0,0,.45); }
.gp-main{ flex:1; display:flex; flex-direction:column; justify-content:center; margin:clamp(12px,2vh,20px) 0;
  border:1px solid rgba(214,188,126,.32); padding:clamp(14px,2.4vh,24px) clamp(14px,1.8vw,22px);
  background:rgba(10,16,20,.36); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
.gp-label{ display:flex; align-items:baseline; gap:10px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px;
  letter-spacing:.26em; color:var(--gold-400,#D6BC7E); margin-bottom:clamp(12px,2vh,18px); }
.gp-label i{ font-style:normal; font-size:8px; letter-spacing:.18em; color:rgba(252,251,246,.45); }
.gp-rows{ display:flex; flex-direction:column; gap:clamp(12px,2.2vh,22px); }
.gp-row{ display:flex; align-items:baseline; gap:14px; opacity:.58; min-width:0; }
.gp-row.is-top{ opacity:1; }
.gp-row b{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(18px,2.4vh,24px); color:rgba(252,251,246,.6); flex-shrink:0; }
.gp-row.is-top b{ color:var(--gold-400,#D6BC7E); text-shadow:0 0 18px rgba(214,188,126,.35); }
.gp-name{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(15px,2.2vh,22px); line-height:1.5;
  letter-spacing:.04em; color:#FCFBF6; min-width:0; }
.gp-row.is-top .gp-name{ font-size:clamp(18px,2.8vh,27px); }
.gp-t{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.18em; color:rgba(252,251,246,.5); flex-shrink:0; }
.gp-row.is-top .gp-t{ color:var(--gold-700,#93702F); }
.gp-subs{ display:flex; align-items:stretch; margin-bottom:clamp(10px,1.8vh,16px); }
.gp-sub{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; padding:0 clamp(8px,1vw,14px); }
.gp-sub + .gp-sub{ border-left:1px dotted rgba(252,251,246,.28); }
.gs-l{ font-family:var(--font-label,'Jost',sans-serif); font-size:8px; letter-spacing:.2em; color:rgba(252,251,246,.5); white-space:nowrap; }
.gp-sub b{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(13px,1.9vh,17px); color:var(--gold-400,#D6BC7E);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gs-t{ font-family:var(--font-label,'Jost',sans-serif); font-size:7.5px; letter-spacing:.16em; color:rgba(252,251,246,.42); }
.gp-note{ font-family:var(--font-serif); font-size:10.5px; line-height:1.9; color:rgba(252,251,246,.6);
  border-top:1px solid rgba(252,251,246,.16); padding-top:10px; }
.ci-soon{ opacity:.55; cursor:default; }
.ti a.shf-spine{ background-image:none; }
.sp-link{ cursor:pointer; text-decoration:none; }
.sp-link em{ color:rgba(214,188,126,.7); }
.shf-sec{ position:relative; display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
.shf-sec.is-div::before{ content:''; position:absolute; left:calc(-1 * clamp(11px,1.4vw,23px)); top:6px; bottom:0;
  border-left:1px dotted rgba(252,251,246,.3); }
.shf-tag{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.26em; color:rgba(252,251,246,.5); }
.shf-etc{ display:flex; align-items:flex-end; gap:clamp(14px,1.8vw,24px); }
.shf-plank2-placeholder{ display:none; }
.shf-vol{ appearance:none; -webkit-appearance:none; background:none; border:none; cursor:pointer; text-align:left;
  display:block; flex-shrink:0; width:118px; padding:0; }
.sv-cover{ position:relative; display:block; width:118px; aspect-ratio:182/257; overflow:hidden; border-radius:1px 3px 3px 1px;
  background:var(--night-800,#16242B); box-shadow:-6px 10px 24px -8px rgba(0,0,0,.6), 0 1px 0 rgba(0,0,0,.4);
  transition:transform .35s ease, box-shadow .35s ease; }
.sv-cover::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:7px; z-index:2;
  background:linear-gradient(90deg, rgba(0,0,0,.34), rgba(0,0,0,.05) 60%, transparent); }
.sv-ph{ width:100%; height:100%; object-fit:cover; display:block; }
.sv-logo{ position:absolute; top:7px; left:8px; right:8px; width:calc(100% - 16px); height:auto;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.5)); }
.sv-ink{ display:flex; align-items:center; justify-content:center; }
.sv-ink i{ font-style:normal; writing-mode:vertical-rl; font-family:var(--font-display,'Klee One',serif); font-weight:600;
  font-size:15px; letter-spacing:.3em; color:rgba(252,251,246,.88); }
.shf-vol:hover .sv-cover{ transform:translateY(-6px); box-shadow:-9px 16px 34px -8px rgba(0,0,0,.7), 0 1px 0 rgba(0,0,0,.4); }
.shf-vol.is-sel .sv-cover{ outline:1px solid var(--gold-500,#C2A052); outline-offset:3px; }
.sv-t{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:11.5px; letter-spacing:.05em; color:rgba(252,251,246,.9); line-height:1.5; }
.sv-s{ font-family:var(--font-label,'Jost',sans-serif); font-size:8px; letter-spacing:.16em; color:rgba(252,251,246,.45); }
.shf-vol.is-sel .sv-t{ color:var(--gold-400,#D6BC7E); }
.shf-spines{ display:flex; gap:3px; align-self:flex-end; margin-left:clamp(10px,1.4vw,22px); }
.shf-spine{ flex-shrink:0; width:26px; aspect-ratio:26/166; align-self:flex-end; border-radius:2px; cursor:default;
  transition:transform .3s ease;
  background:linear-gradient(90deg, #0d171c, #1e3038 45%, #0d171c); box-shadow:-4px 8px 18px -6px rgba(0,0,0,.6);
  display:flex; flex-direction:column; align-items:center; justify-content:space-between; padding:12px 0 10px; }
.shf-spine b{ writing-mode:vertical-rl; font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:11px;
  letter-spacing:.3em; color:rgba(252,251,246,.55); }
.shf-spine em{ font-style:normal; writing-mode:vertical-rl; font-family:var(--font-label,'Jost',sans-serif); font-size:7px;
  letter-spacing:.24em; color:rgba(214,188,126,.5); }
.shf-spine:hover{ transform:translateY(-4px); }
.sp-tip{ position:absolute; bottom:calc(100% + 14px); left:50%; transform:translateX(-50%) translateY(6px);
  width:224px; padding:13px 15px; background:rgba(13,22,27,.97); border:1px solid rgba(214,188,126,.35);
  border-left:2px solid var(--gold-500,#C2A052); box-shadow:0 18px 44px rgba(0,0,0,.5);
  opacity:0; pointer-events:none; transition:opacity .28s ease, transform .28s ease; z-index:7; }
.shf-spine:hover .sp-tip, .shf-spine:focus .sp-tip{ opacity:1; transform:translateX(-50%) translateY(0); }
.sp-tip b{ display:block; writing-mode:horizontal-tb; font-family:var(--font-display,'Klee One',serif); font-weight:600;
  font-size:11.5px; letter-spacing:.06em; color:var(--gold-400,#D6BC7E); margin-bottom:6px; }
.sp-tip span{ display:block; writing-mode:horizontal-tb; font-family:var(--font-serif); font-size:11px; line-height:1.9;
  letter-spacing:.02em; color:rgba(252,251,246,.78); }
.shf-plank{ grid-column:1 / -1; height:10px; margin-top:0; border-radius:2px;
  background:linear-gradient(180deg, #2a231a, #17130d); box-shadow:0 14px 30px rgba(0,0,0,.5), inset 0 1px 0 rgba(252,251,246,.08); }
.shf-desc{ margin-top:13px; max-width:250px; align-self:start; }
.shf-desc b{ display:block; font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:12px;
  letter-spacing:.05em; color:var(--gold-400,#D6BC7E); margin-bottom:5px; }
.shf-desc span{ font-family:var(--font-serif); font-size:11.5px; line-height:1.9; letter-spacing:.02em; color:rgba(252,251,246,.62); }

.bk-open-cta{ position:absolute; right:clamp(14px,2vw,26px); bottom:58px; z-index:5; appearance:none; -webkit-appearance:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:9px; background:rgba(10,16,20,.4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(252,251,246,.3); border-radius:999px; padding:10px 16px;
  font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.22em; color:rgba(252,251,246,.92); transition:border-color .3s, color .3s; }
.bk-open-cta:hover{ border-color:var(--gold-400,#D6BC7E); color:var(--gold-400,#D6BC7E); }
.bo-fold{ width:12px; height:12px; flex-shrink:0; background:linear-gradient(135deg, transparent 49%, rgba(252,251,246,.85) 50%); }
.bk-vignette{ position:absolute; inset:0; z-index:3; pointer-events:none;
  background:radial-gradient(120% 100% at 60% 38%, transparent 52%, rgba(6,10,13,.44) 100%); }
.bk-grain{ position:absolute; inset:-50%; z-index:3; pointer-events:none; opacity:.08; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px; animation:bkGrain 1.2s steps(3) infinite; }
@keyframes bkGrain{ 0%{ transform:translate(0,0); } 33%{ transform:translate(-4%,2%); } 66%{ transform:translate(3%,-3%); } 100%{ transform:translate(0,0); } }
.bk-frame{ position:absolute; inset:13px; z-index:3; pointer-events:none; border:1px solid rgba(252,251,246,.15); }
.bk-back .bk-grain{ opacity:.07; }
.bk-contents::after{ content:''; position:absolute; inset:0; pointer-events:none; opacity:.05; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:160px 160px; }
.cvr{ position:relative; height:clamp(580px,92vh,860px); overflow:hidden; }
.cvr-bg{ position:absolute; inset:0; opacity:0; transition:opacity 1.1s ease; }
.cvr-bg.is-act{ opacity:1; }
.cvr-bg img{ width:100%; height:100%; object-fit:cover; display:block; }
.cvr-bg.is-act img{ animation:cvrKb 15s ease-out forwards; }
@keyframes cvrKb{ from{ transform:scale(1.055); } to{ transform:scale(1); } }
.cvr-veil{ position:absolute; inset:0; z-index:1; background:
  linear-gradient(180deg, rgba(10,16,20,.6) 0%, rgba(10,16,20,.22) 18%, rgba(10,16,20,.05) 34%, rgba(10,16,20,.05) 46%, rgba(10,16,20,.28) 60%, rgba(10,16,20,.6) 74%, rgba(10,16,20,.85) 88%, rgba(10,16,20,.94) 100%),
  linear-gradient(90deg, rgba(10,16,20,.32), rgba(10,16,20,0) 38%, rgba(10,16,20,0) 58%, rgba(10,16,20,.44) 100%); }
.cvr .photo-veil{ z-index:2; }
.cvr-mast{ position:absolute; top:clamp(22px,4.4vh,48px); left:clamp(20px,3.8vw,54px); right:clamp(20px,3.8vw,54px); z-index:4; }
.cvr .cm-word{ margin:0; }
.cvr .cm-word img{ display:block; width:min(82%,560px); height:auto;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35)) drop-shadow(0 8px 30px rgba(0,0,0,.45)); }
.aph-mag img{ display:block; height:12px; width:auto; filter:drop-shadow(0 1px 8px rgba(0,0,0,.45)); }
.cm-issue{ margin-top:14px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.3em; color:rgba(252,251,246,.76); text-shadow:0 1px 14px rgba(0,0,0,.5); }
.cvr-feat{ position:absolute; left:clamp(20px,3.8vw,54px); bottom:clamp(64px,10vh,96px); z-index:4; max-width:min(58%,620px);
  display:flex; flex-direction:column; gap:12px; text-decoration:none; animation:cfIn .75s cubic-bezier(.19,.8,.22,1); }
@keyframes cfIn{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
.cf-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(23px,3.3vw,40px); line-height:1.62; letter-spacing:.05em; color:#FCFBF6; text-shadow:0 1px 2px rgba(0,0,0,.42), 0 10px 44px rgba(0,0,0,.5); }
.cf-by{ display:flex; align-items:center; gap:12px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.28em; color:var(--gold-400,#D6BC7E); text-shadow:0 1px 12px rgba(0,0,0,.5); }
.cvr-index{ display:flex; flex-direction:column; gap:7px; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; padding:4px 0;
  -webkit-mask-image:linear-gradient(180deg, #000 calc(100% - 24px), transparent 100%);
  mask-image:linear-gradient(180deg, #000 calc(100% - 24px), transparent 100%); }
.bk-contents .ci-item{ border-left-color:var(--border,#DCD3C1); }
.bk-contents .ci-item.is-act{ border-left-color:var(--gold-500,#C2A052); background:linear-gradient(90deg, rgba(194,160,82,.12), transparent); }
.bk-contents .ci-no{ color:var(--fg-mute,#8C8676); }
.bk-contents .ci-item.is-act .ci-no{ color:var(--gold-700,#93702F); }
.bk-contents .ci-title{ color:var(--fg-soft,#4A5A60); }
.bk-contents .ci-item.is-act .ci-title{ color:var(--fg,#26333B); }
.bk-contents .ci-pg{ color:var(--fg-mute,#8C8676); }
.bk-contents .ci-all{ border-top-color:var(--border-soft,#E6DECF); }
.cvr-index::-webkit-scrollbar{ display:none; }
.ci-item{ display:flex; align-items:baseline; gap:14px; padding:10px 14px; text-decoration:none;
  border-left:2px solid rgba(252,251,246,.18); transition:border-color .35s, background .35s; }
.ci-item.is-act{ border-left-color:var(--gold-400,#D6BC7E); background:linear-gradient(90deg, rgba(10,16,20,.46), rgba(10,16,20,0)); }
.ci-no{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:22px; line-height:1; color:rgba(252,251,246,.38); transition:color .35s; }
.ci-item.is-act .ci-no{ color:var(--gold-400,#D6BC7E); }
.ci-main{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.ci-title{ font-family:var(--font-display,'Klee One',serif); font-size:13.5px; font-weight:600; letter-spacing:.04em; line-height:1.6; color:rgba(252,251,246,.78); transition:color .35s; }
.ci-item.is-act .ci-title{ color:#FCFBF6; }
.ci-pg{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.22em; color:rgba(252,251,246,.44); text-transform:uppercase; }
.cvr-ticker{ position:absolute; left:0; right:0; bottom:0; z-index:4; overflow:hidden;
  border-top:1px solid rgba(252,251,246,.15); background:rgba(10,16,20,.38); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.ct-track{ display:flex; white-space:nowrap; width:max-content; animation:tickMove 40s linear infinite; }
.ct-seg{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.34em; color:rgba(252,251,246,.55); padding:12px 0; }
@keyframes tickMove{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){
  .ct-track{ animation:none; }
  .cvr-bg.is-act img{ animation:none; }
  .cvr-feat{ animation:none; }
  .bk-cover,.bk-spread{ transition:none; }
  .bk-grain{ animation:none; }
  .bk-spread{ opacity:1 !important; filter:none !important; }
}
/* ═══ 目次オーバーレイ（表紙をめくると目次） ═══ */

.toc-ov{ position:fixed; inset:0; z-index:1200; background:var(--paper-050,#F8F5EE);
  transform:perspective(1600px) translateX(103%) rotateY(-7deg); transform-origin:left center;
  transition:transform .85s cubic-bezier(.19,.75,.22,1); overflow-y:auto; overscroll-behavior:contain;
  box-shadow:-40px 0 90px rgba(10,16,20,.4), inset 28px 0 36px -20px rgba(10,16,20,.12); }
.toc-ov::after{ content:''; position:absolute; inset:0; pointer-events:none; z-index:2; opacity:0;
  background:linear-gradient(105deg, transparent 30%, rgba(255,255,255,.5) 46%, rgba(214,188,126,.16) 53%, transparent 68%); }
.toc-ov.is-on{ transform:perspective(1600px) translateX(0) rotateY(0); }
.toc-ov.is-on::after{ animation:tocSheen 1.15s .2s ease-out forwards; }
@keyframes tocSheen{ from{ opacity:.9; transform:translateX(-55%); } to{ opacity:0; transform:translateX(65%); } }
.toc-ov .tocv-in > *{ opacity:0; transform:translateY(16px); transition:opacity .55s ease, transform .55s cubic-bezier(.19,.75,.22,1); }
.toc-ov.is-on .tocv-in > *{ opacity:1; transform:none; }
.toc-ov.is-on .tocv-in > *:nth-child(1){ transition-delay:.3s; }
.toc-ov.is-on .tocv-in > *:nth-child(2){ transition-delay:.4s; }
.toc-ov.is-on .tocv-in > *:nth-child(3){ transition-delay:.5s; }
.toc-ov.is-on .tocv-in > *:nth-child(4){ transition-delay:.58s; }
.toc-ov.is-on .tocv-in > *:nth-child(5){ transition-delay:.66s; }
.toc-ov.is-on .tocv-in > *:nth-child(n+6){ transition-delay:.74s; }
.tocv-close{ position:fixed; top:18px; right:22px; z-index:5; background:none; border:1px solid var(--border,#DCD3C1); border-radius:999px;
  padding:9px 18px; font-family:var(--font-label,'Jost',sans-serif); font-size:11px; letter-spacing:.2em; color:var(--fg-soft,#4A5A60); cursor:pointer; transition:.25s; }
.tocv-close:hover{ color:var(--gold-700,#93702F); border-color:var(--gold-500,#C2A052); }
.tocv-in{ max-width:880px; margin:0 auto; padding:clamp(48px,8vh,84px) clamp(20px,4vw,32px) 72px; }
.tocv-kick{ display:flex; align-items:center; gap:10px; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.34em; color:var(--gold-700,#93702F); }
.tk-logo{ height:14px; width:auto; display:block; }
.tocv-word{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(44px,7vw,84px); line-height:1.05; letter-spacing:.06em; color:var(--fg,#26333B); margin:8px 0 14px; border-bottom:1px solid var(--fg,#26333B); padding-bottom:18px; }
.tocv-week{ margin-top:30px; }
.tw-line{ font-family:var(--font-serif); font-size:13.5px; line-height:2.1; color:var(--fg-soft,#4A5A60); margin:4px 0 8px; max-width:640px; }
.tw-line b{ font-family:var(--font-display,'Klee One',serif); font-size:1.25em; color:var(--fg,#26333B); margin-right:10px; letter-spacing:.08em; }
.tw-links{ display:flex; flex-direction:column; }
.ta-p{ font-family:var(--font-serif); font-size:12.5px; line-height:2.05; color:var(--fg-soft,#4A5A60); margin:6px 0 10px; max-width:640px; }
.ta-ser{ font-family:var(--font-label,'Jost',sans-serif); font-size:9px; letter-spacing:.22em; color:var(--gold-700,#93702F); margin-right:12px; white-space:nowrap; }
.tocv-arch{ border-top:1px solid var(--fg,#26333B); padding-top:22px; margin-top:46px; }
.ta-shelf{ margin:16px 0 22px; }
.ta-shelf-h{ font-family:var(--font-serif); font-size:13px; color:var(--fg,#26333B); margin-bottom:4px; }
.ta-date{ font-family:var(--font-label,'Jost',sans-serif); font-size:9px; letter-spacing:.14em; color:var(--fg-mute,#8C8676); margin-right:14px; white-space:nowrap; }
.ta-t{ flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.tocv-issue{ margin-top:34px; }
.tocv-issue-h{ display:flex; align-items:baseline; gap:16px; margin-bottom:6px; }
.tocv-issue-h .ti-no{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:24px; color:var(--gold-700,#93702F); }
.tocv-issue-h .ti-meta{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.26em; color:var(--fg-mute,#8C8676); }
.tocv-foot{ margin-top:44px; padding-top:16px; border-top:1px solid var(--border-soft,#E6DECF); font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.22em; color:var(--fg-mute,#8C8676); }
.cvr-toc-tab{ position:absolute; right:0; top:50%; transform:translateY(-50%); z-index:5; writing-mode:vertical-rl;
  background:rgba(10,16,20,.42); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(252,251,246,.22); border-right:none;
  border-radius:8px 0 0 8px; color:rgba(252,251,246,.85); font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.3em;
  padding:18px 9px; cursor:pointer; transition:.3s; }
.cvr-toc-tab:hover{ color:var(--gold-400,#D6BC7E); border-color:rgba(214,188,126,.5); }
.ci-all .ci-no{ font-size:13px; letter-spacing:.14em; }
.ci-all{ appearance:none; -webkit-appearance:none; background:none; cursor:pointer; text-align:left; border:none; border-top:1px solid rgba(252,251,246,.14); margin-top:4px; }
.ta-year{ margin-top:20px; }
.ta-year-h{ display:flex; align-items:baseline; gap:12px; padding-bottom:6px; border-bottom:1px solid var(--fg,#26333B); }
.ta-year-h b{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:26px; line-height:1; letter-spacing:.04em; color:var(--gold-700,#93702F); }
.ta-year-h i{ font-style:normal; font-family:var(--font-label,'Jost',sans-serif); font-size:9px; letter-spacing:.24em; color:var(--fg-mute,#8C8676); }

/* ═══ 週刊READING LIFE（番組） ═══ */
.tw-live{ margin:14px 0 4px; padding:16px 20px; max-width:640px;
  background:var(--night-800,#16242B); border-left:3px solid var(--gold-500,#C2A052); }
.twl-dot{ width:9px; height:9px; border-radius:50%; background:var(--gold-400,#D6BC7E); flex-shrink:0;
  animation:twPulse 2.2s ease-out infinite; }
@keyframes twPulse{ 0%{ box-shadow:0 0 0 0 rgba(214,188,126,.45); } 70%{ box-shadow:0 0 0 12px rgba(214,188,126,0); } 100%{ box-shadow:0 0 0 0 rgba(214,188,126,0); } }
.twl-main{ flex:1; min-width:0; }
.twl-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.3em; color:var(--gold-400,#D6BC7E); }
.twl-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:15.5px; line-height:1.7; color:#FCFBF6; margin-top:4px; }
.twl-date{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.22em; color:rgba(252,251,246,.6); margin-top:5px; }
.twl-soon{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.2em; color:rgba(252,251,246,.55);
  border:1px solid rgba(252,251,246,.25); border-radius:999px; padding:8px 14px; white-space:nowrap; }
@media (max-width:640px){ .twl-row{ flex-wrap:wrap; } .twl-soon{ margin-left:23px; } }
@media (prefers-reduced-motion:reduce){ .twl-dot{ animation:none; } }

.wk-player{ margin:38px auto 0; max-width:760px; }
.wk-frame{ position:relative; padding-top:56.25%; background:var(--night-900,#121E24); box-shadow:0 18px 50px rgba(10,16,20,.18); }
.wk-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.wk-empty{ display:flex; align-items:center; justify-content:center; gap:14px; padding:44px 20px;
  background:var(--night-800,#16242B); border-left:3px solid var(--gold-500,#C2A052);
  font-family:var(--font-serif); font-size:13.5px; letter-spacing:.05em; color:rgba(252,251,246,.82); }
.ta-more{ background:none; cursor:pointer; text-align:left; width:100%; font:inherit;
  appearance:none; -webkit-appearance:none; border:none; border-bottom:1px solid var(--border-soft,#E6DECF);
  color:var(--gold-700,#93702F); }
.ta-more:hover{ color:var(--gold-500,#C2A052); }
.ta-ep{ display:flex; align-items:center; gap:12px; }
.ta-ep .ar-link{ flex:1; min-width:0; }
.ta-play{ appearance:none; -webkit-appearance:none; background:none; border:1px solid var(--gold-500,#C2A052); border-radius:999px;
  color:var(--gold-700,#93702F); font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.14em;
  padding:7px 14px; cursor:pointer; white-space:nowrap; transition:background .25s, color .25s; }
.ta-play:hover{ background:var(--gold-500,#C2A052); color:#FCFBF6; }
.ta-inline-player{ margin:12px 0 18px; max-width:640px; }
.twl-row{ display:flex; align-items:center; gap:18px; }
.twl-frame{ margin-top:14px; }
@media (prefers-reduced-motion:reduce){
  .toc-ov,.cvr,.toc-ov .tocv-in > *{ transition:none; }
  .toc-ov .tocv-in > *{ opacity:1; transform:none; }
  .toc-ov.is-on::after{ animation:none; }
}

.bk-mob-pager{ display:none; }
@media (max-width:1140px){
  .book{ display:flex; flex-direction:column; align-items:center; gap:14px; padding:26px 14px 34px; perspective:none; overflow:visible; }
  .bk-ambient,.bk-ghost,.bk-body3d,.bk-shadow{ display:none; }
  .shelf{ padding:0 16px 34px; }
  .shf-desc{ max-width:210px; }
  /* B5一冊のまま・開いたら片ページずつ（左=口絵/番付 ⇄ 右=目次） */
  .bk-spread{ aspect-ratio:182/257; width:min(94vw,440px); height:auto; transform:none; transition:none; opacity:1; filter:none; }
  .bk-cover{ position:absolute; inset:0; width:auto; height:auto; transform:none !important; cursor:default; }
  .bk-face{ position:absolute; inset:0; }
  .bk-front{ transition:opacity .45s ease; }
  .book.is-open .bk-front{ opacity:0; pointer-events:none; }
  .book.is-open.mp-toc .bk-cover{ pointer-events:none; }
  .bk-back{ display:block; opacity:0; pointer-events:none; cursor:default; box-shadow:none;
    transform:translateX(-6%); transition:opacity .45s ease, transform .45s ease; }
  .bk-contents{ position:absolute; inset:0; width:auto; display:flex; opacity:0; pointer-events:none;
    transform:translateX(6%); transition:opacity .45s ease, transform .45s ease; }
  .book.is-open.mp-toc .bk-contents{ opacity:1; pointer-events:auto; transform:none; }
  .book.is-open.mp-plate .bk-back{ opacity:1; pointer-events:auto; transform:none; }
  .bk-front.cvr{ position:absolute; inset:0; height:auto; }
  .book.is-open .bk-mob-pager{ display:flex; }
  .bk-mob-pager{ align-items:center; gap:8px; }
  .bk-mob-pager button{ appearance:none; -webkit-appearance:none; background:none; cursor:pointer;
    border:1px solid rgba(252,251,246,.3); border-radius:999px; padding:9px 16px;
    font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.18em; color:rgba(252,251,246,.7); transition:.25s; }
  .bk-mob-pager button.is-on{ border-color:var(--gold-500,#C2A052); color:var(--gold-400,#D6BC7E); }
  .bk-mob-pager .bkm-close{ margin-left:8px; opacity:.7; }
}
@media (max-width:880px){
  .cvr-toc-tab{ display:none; }
  .cvr-feat{ max-width:80%; }
}
.arts .art-card{ background:var(--paper-000,#FCFBF6); }
.arts-more{ display:flex; align-items:center; gap:20px; margin:clamp(46px,6.4vw,80px) 0 28px; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.32em; color:var(--fg-mute,#8C8676); white-space:nowrap; }
.am2-line{ flex:1; height:1px; background:var(--border,#DCD3C1); }
.arts-masthead{ max-width:1160px; margin:0 auto clamp(30px,4vw,48px); padding:0 clamp(20px,4vw,32px); }
.am-rule{ height:1px; background:linear-gradient(90deg, var(--fg,#26333B), rgba(38,51,59,.12)); margin-bottom:20px; }
.am-word{ font-family:'Cormorant Garamond','EB Garamond',serif; font-weight:600; font-size:clamp(40px,7vw,84px); line-height:1.02; letter-spacing:.05em; color:var(--fg,#26333B); }
.am-sub{ margin-top:10px; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.28em; color:var(--fg-mute,#8C8676); }

/* ═══ 見開きスプレッド（開いた雑誌） ═══ */
.spread{ max-width:1160px; margin:0 auto; padding:0 clamp(16px,3vw,32px); display:grid; grid-template-columns:1.12fr 1fr;
  filter:drop-shadow(0 30px 64px rgba(22,36,43,.22)); perspective:1800px; position:relative; }

/* ── 誌名：一文字ずつベースラインから ── */
.am-word{ overflow:hidden; }
.amw-ch{ display:inline-block; transform:translateY(112%); transition:transform .9s cubic-bezier(.19,.8,.22,1); transition-delay:calc(var(--i)*42ms); }
.arts-masthead.is-in .amw-ch{ transform:none; }

/* ── 右ページがノドから開く ── */
.sp-right{ transform-origin:left center; backface-visibility:hidden; }
@media (min-width:881px){
  .spread:not(.is-open) .sp-right{ transform:rotateY(-84deg); }
  .spread.is-open .sp-right{ transform:rotateY(0deg); transition:transform 1.35s cubic-bezier(.19,.75,.22,1) .12s; }
  .sp-right::before{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,16,20,.55), rgba(10,16,20,.25)); opacity:1; transition:opacity 1.1s ease .4s; pointer-events:none; z-index:6; }
  .spread.is-open .sp-right::before{ opacity:0; }
}

/* ── 表紙の文字がせり上がる ── */
.sp-mast{ opacity:0; transition:opacity .9s ease .5s; }
.spread.is-open .sp-mast{ opacity:1; }
.sp-cover-in > *{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s cubic-bezier(.19,.8,.22,1); }
.spread.is-open .sp-cover-in > *{ opacity:1; transform:none; }
.spread.is-open .sp-cover-in > *:nth-child(1){ transition-delay:.55s; }
.spread.is-open .sp-cover-in > *:nth-child(2){ transition-delay:.68s; }
.spread.is-open .sp-cover-in > *:nth-child(3){ transition-delay:.82s; }
.spread.is-open .sp-cover-in > *:nth-child(4){ transition-delay:.96s; }

/* ── 開き切った刹那、紙の艶が一度走る ── */
.sp-left::after{ content:''; position:absolute; inset:0; z-index:4; pointer-events:none;
  background:linear-gradient(105deg, transparent 40%, rgba(255,253,245,.2) 50%, transparent 60%); transform:translateX(-130%); }
.spread.is-open .sp-left::after{ animation:spSheen 1.5s 1.05s cubic-bezier(.3,.5,.2,1) forwards; }
@keyframes spSheen{ to{ transform:translateX(130%); } }

@media (prefers-reduced-motion:reduce){
  .amw-ch{ transform:none; transition:none; }
  .spread:not(.is-open) .sp-right{ transform:none; }
  .sp-right::before{ display:none; }
  .sp-mast,.sp-cover-in > *{ opacity:1; transform:none; transition:none; }
  .spread.is-open .sp-left::after{ animation:none; }
}
.sp-left{ position:relative; display:block; overflow:hidden; min-height:clamp(440px,58vh,600px); background:var(--night-900,#121E24);
  text-decoration:none; box-shadow:inset -28px 0 40px -26px rgba(10,16,20,.6); }
.sp-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.001); transition:transform 1.4s cubic-bezier(.22,.61,.36,1); }
.sp-left:hover .sp-img{ transform:scale(1.045); }
.sp-mast{ position:absolute; top:0; left:0; right:0; z-index:3; display:flex; align-items:baseline; gap:18px; padding:22px 26px; }
.sp-cover-in{ position:absolute; left:0; right:0; bottom:0; z-index:3; padding:0 26px 34px; }
.sp-left .alf-title{ font-size:clamp(21px,2.5vw,30px); margin:12px 0 8px; color:#FCFBF6; }
.sp-left .alf-lede{ font-size:12.5px; -webkit-line-clamp:2; margin-bottom:14px; }
.sp-pgno{ position:absolute; bottom:11px; font-family:var(--font-label,'Jost',sans-serif); font-size:9px; letter-spacing:.32em; z-index:4; }
.sp-pgno.l{ left:18px; color:rgba(252,251,246,.62); }
.sp-pgno.r{ right:18px; color:var(--fg-mute,#8C8676); }
.sp-right{ position:relative; background:var(--paper-000,#FCFBF6); border:1px solid var(--border,#DCD3C1); border-left:none;
  box-shadow:inset 30px 0 40px -28px rgba(22,36,43,.22); padding:30px 30px 46px 38px; display:flex; flex-direction:column; }
.spr-head{ display:flex; align-items:baseline; gap:16px; border-bottom:1px solid var(--fg,#26333B); padding-bottom:12px;
  font-family:'Cormorant Garamond',serif; font-weight:600; font-size:21px; letter-spacing:.24em; color:var(--fg,#26333B); }
.sprh-jp{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.32em; color:var(--fg-mute,#8C8676); }
.spr-list{ display:flex; flex-direction:column; }
.spr-item{ display:flex; align-items:center; gap:16px; padding:15px 4px; border-bottom:1px solid var(--border-soft,#E6DECF); text-decoration:none; color:inherit; transition:background .25s; }
.spr-item:hover{ background:rgba(194,160,82,.07); border-bottom-color:var(--gold-500,#C2A052); }
.spr-pg{ font-family:'Cormorant Garamond',serif; font-size:13.5px; letter-spacing:.12em; color:var(--acc,#C2A052); min-width:46px; }
.spr-th{ width:66px; height:46px; overflow:hidden; flex-shrink:0; }
.spr-th img{ width:100%; height:100%; object-fit:cover; display:block; }
.spr-main{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.spr-cat{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.24em; color:var(--acc,#C2A052); text-transform:uppercase; }
.spr-title{ font-family:var(--font-display,'Klee One',serif); font-size:15.5px; font-weight:600; letter-spacing:.04em; line-height:1.55; color:var(--fg,#26333B); }
.spr-by{ font-family:var(--font-sans); font-size:10.5px; color:var(--fg-mute,#8C8676); }
.spr-ar{ margin-left:auto; color:var(--acc,#C2A052); transition:transform .2s; }
.spr-item:hover .spr-ar{ transform:translateX(4px); }
.spr-foot{ margin-top:auto; padding-top:18px; font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.22em; color:var(--fg-mute,#8C8676); border-top:1px solid var(--border-soft,#E6DECF); }
@media (max-width:880px){
  .spread{ grid-template-columns:1fr; }
  .sp-left{ min-height:400px; box-shadow:none; }
  .sp-right{ border-left:1px solid var(--border,#DCD3C1); border-top:none; box-shadow:none; padding:26px 22px 40px; }
}

/* ═══ 巻頭リード・フィーチャー（大判） ═══ */
.art-lead-feature{ position:relative; display:block; max-width:1160px; margin:0 auto; overflow:hidden;
  height:clamp(420px,62vh,640px); text-decoration:none; background:var(--night-900,#121E24); }
.alf-img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.001); transition:transform 1.4s cubic-bezier(.22,.61,.36,1); }
.art-lead-feature:hover .alf-img{ transform:scale(1.045); }
.alf-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,
  rgba(10,16,20,.42) 0%, rgba(10,16,20,.12) 16%, rgba(10,16,20,0) 30%,
  rgba(10,16,20,0) 40%, rgba(10,16,20,.16) 52%, rgba(10,16,20,.42) 64%,
  rgba(10,16,20,.7) 78%, rgba(10,16,20,.88) 92%, rgba(10,16,20,.94) 100%); }
.sp-mast,.sp-cover-in{ z-index:3; }
.alf-in{ position:absolute; left:0; right:0; bottom:0; padding:0 clamp(22px,4vw,52px) clamp(26px,4.4vh,46px); max-width:760px; }
.alf-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(24px,3.6vw,40px); line-height:1.6; letter-spacing:.05em; color:#FCFBF6; margin:12px 0 10px; text-shadow:0 2px 30px rgba(0,0,0,.5); }
.alf-lede{ font-family:var(--font-serif); font-size:13.5px; line-height:2; color:rgba(252,251,246,.82); margin:0 0 16px; max-width:560px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.alf-read{ display:inline-flex; align-items:center; gap:12px; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.34em; color:var(--gold-400,#D6BC7E); }
.alf-read-line{ width:52px; height:1px; background:var(--gold-400,#D6BC7E); transition:width .4s cubic-bezier(.22,.61,.36,1); }
.art-lead-feature:hover .alf-read-line{ width:84px; }

/* カードのREAD */
.ac-ph{ position:relative; }
.ac-read{ margin-left:auto; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.26em; color:var(--acc,#C2A052); }

/* ═══ 寄稿者プロフィール（MY READING LIFE・夜色の編集ページ） ═══ */
.contrib{ position:relative; max-width:860px; margin:64px auto 0; background:var(--night-800,#16242B);
  display:grid; grid-template-columns:minmax(230px,300px) 1fr; overflow:hidden; }
.contrib::before{ content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--vermilion,#A8503F); z-index:3; }
.ct-photo{ position:relative; min-height:380px; }
.ct-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.05) brightness(.96); }
.ct-photo::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(22,36,43,0) 52%, rgba(22,36,43,.92) 100%); }
.ct-main{ position:relative; padding:38px 40px 34px 30px; }
.ct-file{ font-family:'Cormorant Garamond',serif; font-size:13px; letter-spacing:.26em; color:var(--gold-400,#D6BC7E); }
.ct-name{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(28px,4vw,40px); letter-spacing:.1em;
  color:#FCFBF6; margin:12px 0 2px; position:relative; z-index:2; }
.ct-en{ font-family:'Cormorant Garamond',serif; font-size:12px; letter-spacing:.44em; color:rgba(248,245,238,.6); margin:2px 0 16px; }
.ct-title{ font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.26em; color:#E8A093; margin-bottom:12px; }
.ct-bio{ font-family:var(--font-serif); font-size:13px; line-height:2.1; color:rgba(248,245,238,.82); margin:0 0 18px; max-width:420px; }
.ct-links{ display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.contrib .melt-cta{ color:var(--gold-400,#D6BC7E); }
.ct-soon{ font-family:var(--font-sans); font-size:11px; letter-spacing:.12em; color:rgba(248,245,238,.55); border:1px dashed rgba(248,245,238,.3); border-radius:999px; padding:6px 14px; }
.ct-stamp{ position:absolute; top:22px; right:22px; writing-mode:vertical-rl; font-family:var(--font-display,'Klee One',serif);
  font-size:13px; font-weight:600; letter-spacing:.3em; color:#E8A093; border:1.5px solid rgba(232,160,147,.75); border-radius:4px;
  padding:9px 4px; transform:rotate(-4deg); }
@media (max-width:640px){
  .contrib{ grid-template-columns:1fr; }
  .ct-photo{ min-height:0; aspect-ratio:16/10; }
  .ct-photo::after{ background:linear-gradient(180deg, rgba(22,36,43,0) 52%, rgba(22,36,43,.94) 100%); }
  .ct-main{ padding:18px 24px 28px; }
}

/* ═══ 記事リーダー ═══ */
.art-body-wrap{ padding: 46px 0 40px; background:var(--bg,#F8F5EE); }
.art-head{ margin:38px 0 8px; }
.art-kick{ display:flex; align-items:baseline; gap:16px; font-family:var(--font-label,'Jost',sans-serif); font-size:11px; letter-spacing:.26em; color:var(--acc,#C2A052); text-transform:uppercase; }
.ak-pg{ color:var(--fg-mute,#8C8676); letter-spacing:.14em; }
.ak-proof{ font-size:10px; letter-spacing:.2em; color:var(--vermilion,#A8503F); border:1px solid currentColor; border-radius:3px; padding:2px 8px; }
.art-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(28px,4.6vw,44px); line-height:1.55; letter-spacing:.05em; margin:16px 0 18px; color:var(--fg,#26333B); }
.art-lede{ font-family:var(--font-serif); font-size:clamp(14.5px,1.7vw,16.5px); line-height:2.15; color:var(--fg-soft,#4A5A60); max-width:660px; margin:0 0 20px; }
.art-meta{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; font-family:var(--font-sans); font-size:12px; color:var(--fg-mute,#8C8676); border-top:1px solid var(--border,#DCD3C1); border-bottom:1px solid var(--border-soft,#E6DECF); padding:12px 2px; }
.am-dot{ opacity:.6; }

.art-body{ max-width:660px; margin:40px auto 0; }
.artb-p{ font-family:var(--font-serif); font-size:clamp(15px,1.75vw,16.5px); line-height:2.3; letter-spacing:.02em; color:var(--fg,#26333B); margin:0 0 1.9em; }
.artb-h{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:clamp(19px,2.4vw,23px); letter-spacing:.06em; line-height:1.7; margin:2.4em 0 1.1em; color:var(--fg,#26333B); position:relative; padding-left:18px; }
.artb-h::before{ content:''; position:absolute; left:0; top:.35em; bottom:.35em; width:3px; background:var(--acc,#C2A052); }
.artb-q{ font-family:var(--font-serif); font-size:clamp(16px,2vw,18.5px); line-height:2.1; letter-spacing:.04em; color:var(--gold-700,#93702F);
  margin:2.2em 0; padding:0 0 0 22px; border-left:2px solid var(--gold-500,#C2A052); }
.artb-hr{ text-align:center; margin:2.6em 0; color:var(--gold-500,#C2A052); font-size:11px; letter-spacing:1em; padding-left:1em; }

/* 旧記事本文（アーカイブ）＝誌面組版へのマッピング */
.art-html{ max-width:660px; margin:40px auto 0; font-family:var(--font-serif); font-size:clamp(15px,1.75vw,16.5px); line-height:2.3; letter-spacing:.02em; color:var(--fg,#26333B); overflow-wrap:break-word; }
.art-html p{ margin:0 0 1.9em; }
.art-html img{ max-width:100%; height:auto; display:block; margin:2.4em auto; }
.art-html h1,.art-html h2,.art-html h3,.art-html h4{ font-family:var(--font-display,'Klee One',serif); font-weight:600; line-height:1.7; letter-spacing:.06em; margin:2.4em 0 1.1em; color:var(--fg,#26333B); }
.art-html h2,.art-html h3{ font-size:clamp(19px,2.4vw,23px); position:relative; padding-left:18px; }
.art-html h2::before,.art-html h3::before{ content:''; position:absolute; left:0; top:.35em; bottom:.35em; width:3px; background:var(--gold-500,#C2A052); }
.art-html a{ color:var(--gold-700,#93702F); }
.art-html blockquote{ margin:2.2em 0; padding:0 0 0 22px; border-left:2px solid var(--gold-500,#C2A052); color:var(--gold-700,#93702F); }
.art-html iframe,.art-html video{ max-width:100%; }
.art-html hr{ border:0; border-top:1px solid var(--border-soft,#E6DECF); margin:2.6em 0; }
.art-html table{ max-width:100%; overflow-x:auto; display:block; }

/* ═══ 言問の袋とじ（対話ウォール） ═══ */
.fkt{ max-width:660px; margin:56px auto 0; }
.fkt-kick{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:10px;
  font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.28em; color:var(--gold-700,#93702F); }
.fkt-no{ color:var(--fg-mute,#8C8676); letter-spacing:.2em; }
.fkt-pouch{ position:relative; background:var(--paper-100,#F1ECE1); border:1px solid var(--border,#DCD3C1);
  padding:26px 26px 24px; overflow:hidden; }
.fkt-pouch::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:14px;
  background:repeating-linear-gradient(180deg, var(--border,#DCD3C1) 0 10px, transparent 10px 20px); opacity:.55; }
.fkt-pouch::after{ content:''; position:absolute; right:0; top:0; width:46px; height:46px;
  background:linear-gradient(225deg, var(--paper-050,#F8F5EE) 49%, rgba(10,16,20,.1) 50%, var(--paper-100,#F1ECE1) 58%); }
.fkt-ghost{ font-family:var(--font-serif); font-size:14.5px; line-height:2.3; color:var(--fg-soft,#4A5A60);
  filter:blur(3.2px); user-select:none; pointer-events:none; max-height:100px; overflow:hidden; margin-left:16px;
  -webkit-mask-image:linear-gradient(180deg,#000 30%,transparent); mask-image:linear-gradient(180deg,#000 30%,transparent); }
.fkt-seal{ margin:16px 0 0 16px; }
.fkt-q{ font-family:var(--font-serif); font-size:13.5px; line-height:2.1; color:var(--fg,#26333B); margin:0 0 12px; }
.fkt-q b{ display:block; font-family:var(--font-label,'Jost',sans-serif); font-weight:500; font-size:9.5px; letter-spacing:.3em; color:var(--gold-700,#93702F); margin-bottom:6px; }
.fkt-ans{ width:100%; box-sizing:border-box; background:var(--paper-000,#FCFBF6); border:1px solid var(--border,#DCD3C1);
  padding:12px 14px; font-family:var(--font-serif); font-size:14px; line-height:1.9; color:var(--fg,#26333B); resize:vertical; }
.fkt-ans:focus{ outline:none; border-color:var(--gold-500,#C2A052); }
.fkt-err{ font-family:var(--font-serif); font-size:12px; color:#A8503F; margin:8px 0 0; }
.fkt-doors{ display:flex; align-items:center; gap:18px; margin-top:14px; flex-wrap:wrap; }
.fkt-cut{ appearance:none; -webkit-appearance:none; background:var(--night-800,#16242B); color:#FCFBF6; border:none; cursor:pointer;
  font-family:var(--font-jp-sans,'Zen Kaku Gothic New',sans-serif); font-size:13px; letter-spacing:.14em; padding:12px 26px;
  transition:background .3s, opacity .3s; }
.fkt-cut:hover{ background:var(--gold-700,#93702F); }
.fkt-cut:disabled{ opacity:.45; cursor:default; }
.ti a.fkt-knife{ background-image:none; }
.fkt-knife{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.16em; color:var(--gold-700,#93702F);
  border:1px solid var(--gold-500,#C2A052); border-radius:999px; padding:9px 16px; text-decoration:none; transition:background .25s,color .25s; }
.fkt-knife:hover{ background:var(--gold-500,#C2A052); color:#FCFBF6; }
.fkt.is-tearing .fkt-pouch{ animation:fktTear .95s cubic-bezier(.6,.05,.28,.99) forwards; }
@keyframes fktTear{
  0%{ clip-path:inset(0 0 0 0); transform:none; opacity:1; }
  30%{ transform:translateX(3px) rotate(.4deg); }
  100%{ clip-path:inset(0 0 100% 0); transform:translateY(-10px); opacity:.15; }
}
.fkt-edge{ height:13px; background:var(--paper-100,#F1ECE1); border:1px solid var(--border,#DCD3C1); border-bottom:none;
  clip-path:polygon(0 0, 3% 100%, 7% 20%, 11% 90%, 15% 30%, 19% 100%, 24% 25%, 28% 85%, 33% 15%, 37% 95%, 42% 35%, 46% 100%, 51% 20%, 55% 80%, 60% 30%, 64% 100%, 69% 15%, 73% 90%, 78% 25%, 82% 95%, 87% 20%, 91% 100%, 95% 40%, 100% 0); }
.fkt-inner{ background:var(--paper-000,#FCFBF6); border:1px solid var(--border,#DCD3C1); border-top:none; padding:8px 28px 26px; animation:fktIn .8s .1s both; }
@keyframes fktIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.fkt-henrei{ margin-top:26px; border-left:3px solid #A8503F; padding:4px 0 4px 18px; }
.fh-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.3em; color:#A8503F; margin-bottom:8px; }
.fkt-henrei p{ font-family:var(--font-serif); font-size:15px; line-height:2.3; color:var(--fg,#26333B); margin:0; }
.fh-sign{ margin-top:10px; font-family:var(--font-display,'Klee One',serif); font-size:12.5px; color:var(--fg-soft,#4A5A60); letter-spacing:.14em; text-align:right; }
@media (prefers-reduced-motion:reduce){ .fkt.is-tearing .fkt-pouch{ animation:none; } .fkt-inner{ animation:none; } }

/* ═══ AIコンシェルジュ（リッチ肖像＋右下フロート） ═══ */
.aid-face.has-video{ width:88px; height:88px; border-radius:50%; overflow:hidden; flex-shrink:0;
  border:2px solid var(--gold-500,#C2A052); box-shadow:0 10px 30px rgba(10,16,20,.2);
  animation:aidFloat 5.4s ease-in-out infinite; background:var(--night-800,#16242B); }
.aid-face.has-video video{ width:100%; height:100%; object-fit:cover; display:block; }
@keyframes aidFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
.aid-talk{ appearance:none; -webkit-appearance:none; background:var(--night-800,#16242B); color:#FCFBF6; border:none; cursor:pointer;
  font-family:var(--font-jp-sans,'Zen Kaku Gothic New',sans-serif); font-size:12.5px; letter-spacing:.1em; padding:11px 18px; transition:background .3s; }
.aid-talk:hover{ background:var(--gold-700,#93702F); }

.ccg{ position:fixed; right:clamp(14px,2.4vw,30px); bottom:clamp(14px,3vh,28px); z-index:900;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px; }
.ccg-fab{ appearance:none; -webkit-appearance:none; border:none; background:none; cursor:pointer; position:relative; width:62px; height:62px; padding:0; }
.ccg-fab img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block;
  border:2px solid var(--gold-500,#C2A052); box-shadow:0 10px 30px rgba(10,16,20,.35); transition:border-color .3s, transform .3s; }
.ccg-fab:hover img{ border-color:var(--gold-400,#D6BC7E); transform:scale(1.05); }
.ccg-fab-ring{ position:absolute; inset:-3px; border-radius:50%; border:1px solid rgba(214,188,126,.6); animation:ccgPulse 2.6s ease-out infinite; }
@keyframes ccgPulse{ 0%{ transform:scale(1); opacity:.8; } 70%{ transform:scale(1.4); opacity:0; } 100%{ transform:scale(1.4); opacity:0; } }
.ccg-fab.is-open .ccg-fab-ring{ animation:none; opacity:0; }
.ccg-panel{ width:min(376px, calc(100vw - 28px)); background:var(--night-800,#16242B);
  border:1px solid rgba(214,188,126,.3); border-left:3px solid var(--gold-500,#C2A052);
  box-shadow:0 24px 70px rgba(10,16,20,.5); display:flex; flex-direction:column; overflow:hidden;
  animation:ccgIn .35s cubic-bezier(.19,.8,.22,1); }
@keyframes ccgIn{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.ccg-head{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-bottom:1px solid rgba(252,251,246,.12); }
.ccg-face{ width:44px; height:44px; border-radius:50%; object-fit:cover; border:1px solid var(--gold-500,#C2A052); flex-shrink:0; }
.ccg-who{ flex:1; min-width:0; }
.ccg-who b{ display:block; font-family:var(--font-display,'Klee One',serif); font-size:15px; letter-spacing:.08em; color:#FCFBF6; }
.ccg-who span{ font-family:var(--font-label,'Jost',sans-serif); font-size:8.5px; letter-spacing:.18em; color:rgba(252,251,246,.55); }
.ccg-close{ appearance:none; -webkit-appearance:none; background:none; border:none; color:rgba(252,251,246,.6); cursor:pointer; font-size:13px; padding:6px; }
.ccg-close:hover{ color:#FCFBF6; }
.ccg-body{ max-height:min(46vh,380px); min-height:120px; overflow-y:auto; overscroll-behavior:contain; padding:14px; display:flex; flex-direction:column; gap:10px; }
.ccg-hint{ font-family:var(--font-serif); font-size:12.5px; line-height:2; color:rgba(252,251,246,.66); margin:0; }
.ccg-m{ margin:0; font-family:var(--font-serif); font-size:13.5px; line-height:2; max-width:88%; overflow-wrap:break-word; }
.ccg-m.is-u{ align-self:flex-end; color:var(--gold-400,#D6BC7E); text-align:right; }
.ccg-m.is-a{ align-self:flex-start; color:#FCFBF6; }
.ccg-typing{ opacity:.5; }
.ccg-note{ font-family:var(--font-serif); font-size:11.5px; color:var(--gold-400,#D6BC7E); margin:0; padding:0 14px 8px; }
.ccg-in{ display:flex; gap:8px; padding:12px 14px; border-top:1px solid rgba(252,251,246,.12); }
.ccg-in input{ flex:1; min-width:0; background:rgba(252,251,246,.06); border:1px solid rgba(252,251,246,.2); color:#FCFBF6;
  font-family:var(--font-serif); font-size:13.5px; padding:10px 12px; }
.ccg-in input:focus{ outline:none; border-color:var(--gold-500,#C2A052); }
.ccg-in input::placeholder{ color:rgba(252,251,246,.35); }
.ccg-in button{ appearance:none; -webkit-appearance:none; border:none; background:var(--gold-500,#C2A052); color:#16242B;
  font-family:var(--font-jp-sans,'Zen Kaku Gothic New',sans-serif); font-size:12.5px; letter-spacing:.1em; padding:0 18px; cursor:pointer; transition:background .25s; }
.ccg-in button:hover{ background:var(--gold-400,#D6BC7E); }
.ccg-in button:disabled{ opacity:.4; cursor:default; }
@media (max-width:640px){ .ccg-body{ max-height:38vh; } }
@media (prefers-reduced-motion:reduce){ .ccg-fab-ring{ animation:none; } .aid-face.has-video{ animation:none; } .ccg-panel{ animation:none; } }

/* 有料袋とじ（会員の鍵） */
.fkt-paid .fkt-pouch{ border-color:var(--gold-500,#C2A052); }
.fkt-paid .fkt-pouch::before{ background:repeating-linear-gradient(180deg, var(--gold-500,#C2A052) 0 10px, transparent 10px 20px); opacity:.4; }
.ti a.fkt-knife.gold{ background-image:none; }
.fkt-knife.gold{ background:var(--gold-500,#C2A052); color:#FCFBF6; border-color:var(--gold-500,#C2A052); font-size:11px; padding:11px 20px; }
.fkt-knife.gold:hover{ background:var(--gold-700,#93702F); border-color:var(--gold-700,#93702F); color:#FCFBF6; }
.fkt-soon{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.16em; color:var(--fg-mute,#8C8676); display:block; margin-top:10px; line-height:1.9; }
.fkt-buy{ background:var(--gold-500,#C2A052); color:#16242B; font-weight:600; }
.fkt-buy:hover{ background:var(--gold-400,#D6BC7E); }
.fkt-knife-mark{ margin-top:24px; padding-top:14px; border-top:1px solid var(--border-soft,#E6DECF);
  font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.22em; color:var(--gold-700,#93702F); }

/* ═══ ひろめる（SHARE） ═══ */
.shr{ max-width:660px; margin:46px auto 0; }
.shr-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.28em; color:var(--gold-700,#93702F); margin-bottom:12px; }
.shr-row{ display:flex; flex-wrap:wrap; gap:10px; }
.shr-btn{ appearance:none; -webkit-appearance:none; display:inline-flex; align-items:center; gap:8px;
  background:none; border:1px solid var(--border,#DCD3C1); border-radius:999px; padding:10px 18px; cursor:pointer; text-decoration:none;
  font-family:var(--font-jp-sans,'Zen Kaku Gothic New',sans-serif); font-size:12px; letter-spacing:.08em; color:var(--fg-soft,#4A5A60);
  transition:border-color .25s, color .25s; }
.shr-btn:hover{ border-color:var(--gold-500,#C2A052); color:var(--gold-700,#93702F); }
.shr-btn svg{ width:14px; height:14px; flex-shrink:0; }
.ti a.shr-btn{ background-image:none; }

/* ═══ UPXカード（AIの下・次の一歩） ═══ */
.upx{ max-width:660px; margin:18px auto 0; }
.ti a.upx-card{ background-image:none; }
.upx-card{ display:flex; background:var(--paper-000,#FCFBF6); border:1px solid var(--border,#DCD3C1); text-decoration:none; overflow:hidden;
  transition:border-color .3s, box-shadow .3s, transform .3s; }
.upx-card:hover{ border-color:var(--gold-500,#C2A052); box-shadow:0 14px 40px rgba(10,16,20,.12); transform:translateY(-2px); }
.upx-th{ flex:0 0 172px; min-height:152px; overflow:hidden; background:var(--night-900,#121E24); }
.upx-th img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.upx-card:hover .upx-th img{ transform:scale(1.045); }
.upx-main{ flex:1; min-width:0; padding:18px 20px 15px; display:flex; flex-direction:column; gap:7px; }
.upx-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.24em; color:var(--gold-700,#93702F); }
.upx-title{ font-family:var(--font-display,'Klee One',serif); font-weight:600; font-size:17px; line-height:1.6; color:var(--fg,#26333B); }
.upx-desc{ font-family:var(--font-serif); font-size:12.5px; line-height:1.95; color:var(--fg-soft,#4A5A60); }
.upx-foot{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:4px; }
.upx-foot b{ font-family:var(--font-display,'Klee One',serif); font-size:14px; letter-spacing:.04em; color:var(--fg,#26333B); }
.upx-foot i{ font-style:normal; font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.16em; color:var(--gold-700,#93702F); }
@media (max-width:560px){ .upx-card{ flex-direction:column; } .upx-th{ flex:none; aspect-ratio:16/7; min-height:0; } }

/* AIドック */
.ai-dock{ max-width:660px; margin:52px auto 0; display:flex; gap:20px; background:var(--paper-000,#FCFBF6); border:1px solid var(--gold-200,#EBDCB6); border-radius:4px; padding:24px 26px; position:relative; }
.ai-dock::before{ content:'AI'; position:absolute; top:-9px; left:22px; font-family:var(--font-label,'Jost',sans-serif); font-size:9.5px; letter-spacing:.34em; color:var(--gold-700,#93702F); background:var(--paper-000,#FCFBF6); padding:0 10px; }
.aid-face{ flex-shrink:0; width:58px; height:58px; border-radius:50%; border:1.5px solid var(--gold-500,#C2A052); color:var(--gold-700,#93702F);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display,'Klee One',serif); font-size:24px; font-weight:600;
  background:radial-gradient(circle at 32% 28%, rgba(194,160,82,.18), transparent 62%); }
.aid-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.3em; color:var(--fg-mute,#8C8676); }
.aid-name{ font-family:var(--font-display,'Klee One',serif); font-size:19px; font-weight:600; letter-spacing:.06em; margin:4px 0 6px; color:var(--fg,#26333B); }
.aid-name small{ font-size:12px; color:var(--fg-mute,#8C8676); margin-left:8px; letter-spacing:.1em; }
.aid-name.dim{ color:var(--fg-mute,#8C8676); }
.aid-quote{ font-family:var(--font-serif); font-size:13.5px; line-height:2; color:var(--fg-soft,#4A5A60); margin:0 0 14px; }
.aid-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.aid-soon{ font-family:var(--font-sans); font-size:11.5px; letter-spacing:.1em; color:var(--fg-mute,#8C8676); border:1px dashed var(--border,#DCD3C1); border-radius:999px; padding:7px 16px; }

/* 関連リンク */
.art-rel{ max-width:660px; margin:40px auto 0; }
.ar-kick,.ao-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.3em; color:var(--fg-mute,#8C8676); margin-bottom:12px; }
.ar-link{ display:flex; align-items:baseline; gap:10px; font-family:var(--font-serif); font-size:14.5px; color:var(--fg,#26333B); text-decoration:none;
  border-bottom:1px solid var(--border-soft,#E6DECF); padding:11px 2px; }
.ar-link:hover{ color:var(--gold-700,#93702F); border-bottom-color:var(--gold-500,#C2A052); }
.ar-arrow{ margin-left:auto; color:var(--gold-500,#C2A052); }

/* 一本橋（クラブへの橋） */
.bridge{ max-width:660px; margin:56px auto 0; background:var(--night-800,#16242B); color:var(--paper-050,#F8F5EE); padding:34px 32px; text-align:center; border-radius:4px; }
.br-kick{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.3em; color:var(--gold-400,#D6BC7E); margin-bottom:10px; }
.bridge .br-h{ font-family:var(--font-display,'Klee One',serif); font-size:clamp(18px,2.4vw,22px); font-weight:600; letter-spacing:.05em; line-height:1.8; margin:0 0 10px; color:#F8F5EE !important; }
.br-p{ font-family:var(--font-serif); font-size:13px; line-height:2.1; color:rgba(248,245,238,.82); max-width:480px; margin:0 auto 18px; }
.bridge .melt-cta{ color:var(--gold-400,#D6BC7E); }

/* この号のほかの記事 */
.art-others{ max-width:860px; margin:52px auto 0; }

/* 奥付 */
.art-colo{ max-width:660px; margin:56px auto 0; border-top:1px solid var(--fg,#26333B); padding-top:18px; }
.artc-strip{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; font-family:var(--font-label,'Jost',sans-serif); font-size:10.5px; letter-spacing:.3em; color:var(--fg-mute,#8C8676); margin-bottom:14px; }
.artc-logo{ height:11px; width:auto; display:block; }
.evpf-logo{ width:min(62vw,250px); height:auto; display:block; margin:0 auto; opacity:.94; }
.artc-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); gap:10px 24px; margin:0; }
.artc-list > div{ display:flex; gap:12px; align-items:baseline; }
.artc-list dt{ font-family:var(--font-label,'Jost',sans-serif); font-size:10px; letter-spacing:.24em; color:var(--gold-700,#93702F); white-space:nowrap; }
.artc-list dd{ font-family:var(--font-serif); font-size:12.5px; color:var(--fg-soft,#4A5A60); margin:0; }
.artc-list dd a{ color:inherit; text-decoration:none; border-bottom:1px solid var(--gold-200,#EBDCB6); }
.artc-list dd a:hover{ color:var(--gold-700,#93702F); }

@media (max-width:640px){
  .ai-dock{ flex-direction:column; }
  .art-meta{ font-size:11px; }
}

/* DSの汎用下線（.ti a＝background-position:0 1.15em）は、パディング付きの行型リンクでは
   「文字の上に伸びる線」になる → 誌面の行型アンカーでは抑止（.head-link/.melt-ctaと同じ流儀） */
.ti a.ar-link, .ti a.spr-item, .ti a.ci-item, .ti a.art-card, .ti a.cvr-feat{ background-image:none; }
.ti a.spr-item{ transition:background .25s; }
.ti a.ci-item{ transition:border-color .35s, background .35s; }
.ti a.art-card{ transition:transform .25s ease, box-shadow .25s ease; }

/* ══════════ 会員の記事（あなたの欄）── 日刊READING LIFE ══════════
   2026/9/4 リーディングライフ担当α。記事リーダーの型をそのまま使い、
   足りない部品（題字・欄名・奥付・通報）だけを colors_and_type のトークンで足す。 */
.rlm-head { margin-bottom: var(--space-6); }
.rlm-kick {
  font-family: var(--font-jp-sans); font-size: var(--fs-caption);
  letter-spacing: .08em; color: var(--fg-faint); margin: 0 0 var(--space-3);
}
.rlm-no { color: var(--accent-ink); }
.rlm-by {
  font-family: var(--font-jp-sans); font-size: var(--fs-caption); color: var(--fg-muted);
  margin: var(--space-3) 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline;
}
.rlm-sep { color: var(--line-strong); }
.rlm-cno { font-size: var(--fs-label); color: var(--fg-faint); }
.rlm-teaser {
  font-family: var(--font-jp-serif); font-size: var(--fs-lead); line-height: var(--lh-body);
  color: var(--fg); margin: var(--space-5) 0;
}
.rlm-gate {
  font-family: var(--font-jp-display); font-size: var(--fs-h3); color: var(--fg-strong);
  margin: var(--space-8) 0 var(--space-5); line-height: 1.5;
}
/* 打消し・断りは本文と同じ大きさ（景表法の原則） */
.rlm-note { font-size: var(--fs-body); line-height: var(--lh-snug); color: var(--fg-muted); margin: var(--space-4) 0 0; }
.rlm-cta { margin: var(--space-5) 0; }
.rlm-cta a {
  font-family: var(--font-jp-sans); font-size: var(--fs-small); color: var(--brand-ink);
  border-bottom: 1px solid var(--accent); padding-bottom: 2px; text-decoration: none;
}
.rlm-colophon { margin-top: var(--space-8); padding-top: var(--space-5); border-top: 1px solid var(--border); }
.rlm-praise {
  background: var(--paper-100); border-left: 2px solid var(--gold-500);
  padding: var(--space-4) var(--space-5); margin: 0 0 var(--space-5);
}
.rlm-praise-by {
  display: block; font-family: var(--font-jp-sans); font-size: var(--fs-label);
  letter-spacing: var(--tracking-caps); color: var(--gold-700); margin-bottom: 6px;
}
.rlm-praise-t { font-family: var(--font-jp-serif); font-size: var(--fs-small); line-height: var(--lh-body); color: var(--fg); }
.rlm-meta {
  font-family: var(--font-jp-sans); font-size: var(--fs-caption); color: var(--fg-faint);
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 var(--space-5);
}
.rlm-meta a { color: var(--fg-muted); text-decoration: none; border-bottom: 1px solid var(--border); }
/* 通報＝目立たせないが、必ず見つかる場所に（削除の申出の入口） */
.rlm-report { margin: var(--space-5) 0; }
.rlm-report-open, .rlm-report-act button {
  appearance: none; background: transparent; border: 0; border-bottom: 1px solid var(--border);
  font-family: var(--font-jp-sans); font-size: var(--fs-caption); color: var(--fg-faint);
  padding: 6px 0; cursor: pointer; min-height: 44px;
}
.rlm-report-open:hover { color: var(--fg-muted); }
.rlm-report-form { border: 1px solid var(--border); padding: var(--space-4); background: var(--paper-000); }
.rlm-report-lead { font-size: var(--fs-caption); color: var(--fg-muted); margin: 0 0 var(--space-3); line-height: 1.8; }
.rlm-report-sel, .rlm-report-ta, .rlm-report-in {
  font-family: var(--font-jp-serif); font-size: var(--fs-small); width: 100%;
  padding: 8px 10px; border: 1px solid var(--border); background: var(--paper-050);
  margin-bottom: var(--space-3); box-sizing: border-box;
}
.rlm-report-err { color: var(--danger); font-size: var(--fs-caption); margin: 0 0 var(--space-3); }
.rlm-report-act { display: flex; gap: var(--space-4); justify-content: flex-end; }
.rlm-report-act button:last-child { color: var(--brand-ink); border-bottom-color: var(--accent); }
.rlm-report-done { font-size: var(--fs-small); color: var(--success); margin: var(--space-5) 0; }

/* ══════════════════════════════════════════════════════════════════
   トップ00 ── 誌面の棚（三誌が並ぶ書店の棚）
   出典＝意匠手帳「誌面の棚」（設計書30 起草ログ・代表 E8 で決定）。
   組みと値は手帳から写した。近似を作らない。
   ★書体だけ差し替えている ── 手帳は Shippori Mincho B1 を読むが、この頁は読まない。
     この頁が持つ重い明朝（--font-jp-serif）に置いた。ほかの値は手帳のまま。
   ★色は手帳の生値ではなく、同じ色を指すこの頁のトークンで書く（体系を二つにしない）。
   ══════════════════════════════════════════════════════════════════ */
.rack{ background:var(--paper-050); color:var(--slate-800); border:1px solid var(--line); padding:26px 30px 24px; }
.rack-mast{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap;
  border-bottom:1px solid var(--slate-800); padding-bottom:10px; }
.rack-mast b{ font-family:var(--font-jp-display); font-weight:600; font-size:20px; letter-spacing:.14em; }
.rack-mast span{ font-family:var(--font-label); font-size:11px; letter-spacing:.26em; color:var(--warm-600); }
.rack-shelf{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:20px 0 16px;
  border-bottom:1px solid var(--line); }
.rack-item{ display:grid; gap:8px;
  /* 🔴格子の子は `min-width:auto` なので、中身（表紙の字）の min-content が床になり、
     狭い器では列が器より広くなる（実測 2026/9/7 17:1x・枠300 で 棚205 対 札236＝+31px）。
     新サービスLP担当 17:03 が本番で見つけた 20px のはみ出しがこれ。
     ★`min-width:0` で床を外す。器の幅にそのまま従う（対で確認＝236 → 205 → 236）。 */
  min-width:0;
  /* 🔴三つの箱の中身がずれて見えた（代表 2026/9/7 21:4x「週刊の箱だけ少し上」）。
     正体は「`<a>` だから」ではなく **格子の余りが行に等分されていた**こと ──
     箱の丈は棚の行で 652 に揃うが、中身の量（本文と注記の行数）が三つで違うので、
     余りが auto の行へ等しく配られ、札と表紙の丈が箱ごとにばらけていた。
     実測（1920・直す前）＝ 札の丈 24／16／20 ・ 表紙の丈 542／532／537
       ＝ 表紙の上端が最大 7px、下端が最大 18px ずれる（**三つとも違った**）。
     ★`align-content:start` で余りを下へ寄せる＝行は中身の丈のまま。
       対で確認＝差 7／18／8 → **0／0／0**（札 16・表紙 532 で三つとも一致）。 */
  align-content:start; }
.rack-item h4{ margin:0; font-family:var(--font-label); font-weight:400; font-size:10.5px;
  letter-spacing:.3em; color:var(--gold-700); }
.rack-cover{ aspect-ratio:3/4; background:var(--paper-200) center/cover no-repeat;
  border:1px solid var(--line-strong); position:relative; display:grid; align-content:end; padding:12px; }
.rack-cover.text{ background:var(--paper-000); align-content:start; }
.rack-cover.text .rc-t{ font-family:var(--font-jp-serif); font-weight:600; font-size:22px; line-height:1.3;
  letter-spacing:.06em; color:var(--night-900); }
.rack-cover.text .rc-s{ font-size:12px; color:var(--warm-600); margin-top:6px; }
.rack-cover .rc-mast{ position:absolute; top:10px; left:12px; font-family:var(--font-jp-display); font-weight:600;
  font-size:12px; letter-spacing:.12em; color:var(--paper-050); text-shadow:0 1px 3px rgba(0,0,0,.6); }
.rack-cover .rc-title{ font-family:var(--font-jp-display); font-weight:600; font-size:16px; line-height:1.3;
  color:var(--paper-050); text-shadow:0 1px 6px rgba(0,0,0,.6); }
.rack-cover .rc-play{ position:absolute; left:50%; top:44%; transform:translate(-50%,-50%); width:44px; height:44px;
  border-radius:50%; border:1.5px solid var(--paper-050); display:grid; place-items:center;
  color:var(--paper-050); background:rgba(15,26,31,.35); }
.rack-item p{ margin:0; font-size:12.5px; line-height:1.6; color:var(--warm-700); }
.rack-item p b{ font-weight:600; color:var(--slate-900); }
.rack-doors{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding-top:14px; }
.rack-doors > *{ display:grid; gap:4px; font-size:13px; color:inherit; text-decoration:none;
  min-width:0; }   /* 同じ型の床を、戸口にも先に外しておく（いまは差 0・実測） */
.rack-doors span{ font-family:var(--font-label); font-size:10.5px; letter-spacing:.3em; color:var(--gold-700); }
.rack-doors b{ font-family:var(--font-jp-display); font-weight:600; font-size:15px; color:var(--slate-900); }
.rack-doors small{ color:var(--warm-600); }
.rack-doors a:hover b{ text-decoration:underline; text-underline-offset:3px; }
.rack-foot{ margin-top:14px; padding-top:8px; border-top:1px solid var(--line); font-size:12px;
  color:var(--warm-600); display:flex; gap:16px; flex-wrap:wrap; }
@media (max-width:860px){
  .rack-shelf,.rack-doors{ grid-template-columns:1fr; }
}
@media (max-width:480px){
  .rack{ padding:20px 16px; }
}
/* 棚は節の頭に置く（暗い地の上の、紙の一枚）。上下の間だけここで持つ。 */
.rl-rack-wrap{ padding-bottom:clamp(28px,4vw,56px); }

/* ── `/magazine` の一枚（D'・2026/9/7 CTO 12:12 → 15:33 で紙の一枚に）──
   代表 15:33「上に READING LIFE・誌面の棚と書いた黒い頁の中に、紙の棚が浮いている。
   **その紙の箱がこの頁そのもの**でしょう。見出しも黒い地も要らない」
   ＝ 意匠手帳の「誌面の棚」は紙の上の一枚。手帳どおりに戻す。
   ★眉・大見出し・前書き（`.mgz-head`）は落とした。棚の帯（`.rack-mast`）が頁の題字。
   ★番付（`.gp` の暗い絵）だけは、紙の上の額として残す。 */
.mgz-body{ background:var(--paper-050,#F8F5EE); color:var(--slate-800,#29363A); }
.mgz{ display:block; padding:clamp(20px,3.6vw,44px) 0 clamp(40px,6vw,80px); }
/* 🔴左右の余白を殺さない（代表 2026/9/7 22:3x「狭くすると溢れて見える」の正体）。
   前は `padding:0 0 …` で `.wrap` の `padding:0 44px` を上書きしており、
   **320 では字が左右の縁に貼り付いて、題字の一文字目が切れて見えていた**（絵で確認）。
   ⚠️当席の「横スクロール 0」は正しかったが、**余白が 0 であることを見ていなかった**。
   ★下だけを足す形にして、`.wrap` の左右はそのまま生かす。 */
.mgz-sec{ padding-bottom:clamp(14px,2.4vw,26px); }
/* この頁では棚が頁そのもの＝浮いた箱に見える枠と余白を外す（中の組みは手帳のまま） */
.mgz .rack{ border:0; box-shadow:none; background:transparent; padding:0; }

/* ══ ヒーロー（月替わり・代表指示 2026/9/7 19:2x）══
   ★白い紙面のまま。黒い地にしない（9/7 代表）。絵は誌面の写真として置き、字は紙に刷る。
   ⚠️絵が無い日（is-plain）は、題字だけの静かな一枚になる ── 壊れた枠を出さない。
   ⚠️丈は幅に連れる（固定 px の床を作らない＝今日 .rack-item で踏んだ型）。 */
.mgz-hero{ position:relative; margin:0 0 clamp(28px,4vw,44px); }
.mgz-hero-art{ position:relative; width:100%; aspect-ratio:16/7; overflow:hidden;
  background:var(--paper-100,#F2ECE0); border-radius:2px; }
.mgz-hero-art img{ width:100%; height:100%; object-fit:cover; display:block; }
/* 字を載せる側だけ、写真の裾をわずかに沈める（可読性の保証・紙の色で）。 */
.mgz-hero-art::after{ content:''; position:absolute; inset:auto 0 0 0; height:62%;
  background:linear-gradient(180deg, rgba(248,245,238,0) 0%, rgba(248,245,238,.86) 72%, var(--paper-050,#F8F5EE) 100%); }
/* 🔴引き上げは**上限つき**にする。`-14%` は幅の割合なので、広い画面では
     字の塊の丈を超え、**器が絵より低くなって下の節が絵に重なる**
     （実測 2026/9/7・1440 で 器 567 対 絵 623＝12px 重なっていた）。
   ⚠️不変条件＝**器の丈 ≧ 絵の丈**。幅を掃くときはこれを見る。 */
/* 🔴字は「下の誌名の塊」と左端を揃える（CTO 2026/9/7 21:30 の①）。
   ヒーローは全幅の器で、棚は `.wrap`（max-width:1240px）の中に在る。
   ⚠️この頁では `.mgz-sec` が `.wrap` の左右余白を **0 に上書き**している（実測＝棚の字の左は器の縁）。
     ＝ だから写すのは **max-width と中央寄せだけ**。左右の余白を足すと、その分だけずれる
     （当席は一度 44px を足して、44px ずれたまま「直った」と読みかけた）。
   ＝ 揃えないと **1920 で 314px、1440 で 74px** ずれる（実測・字だけが器の外に取り残される）。
   ★`.wrap` の寸法をそのまま写す（近似を作らない）。⚠️絵は全幅のまま。 */
.mgz-hero-in{ position:relative; z-index:1;
  margin:calc(-1 * clamp(16px, 7%, 84px)) auto 0;
  max-width:1240px; padding:0 44px; }
/* ⚠️狭い幅の 22px は `styles.css` の `@media (max-width:680px)` に合わせる（写した値） */
@media (max-width:680px){ .mgz-hero-in{ padding:0 22px; } }
.mgz-hero.is-plain .mgz-hero-in{ margin-top:0; padding-top:clamp(18px,4vw,36px); }
.mgz-hero-mast{ margin:0 0 10px; font-family:var(--font-label,'Jost',sans-serif);
  font-size:clamp(11px,1.4vw,13px); letter-spacing:.34em; color:var(--gold-700,#93702F); }
.mgz-hero-line{ margin:0; font-family:var(--font-jp-display,'Klee One',serif); font-weight:600;
  font-size:clamp(21px,3.4vw,38px); line-height:1.5; color:var(--slate-900,#1B2A2F);
  max-width:24ch; }
/* 🔴`text-wrap:balance` を落とした（CTO 2026/9/7 21:13 の語中折れの正体）。
   balance は**行の長さを揃えようとして塊の中を割る**ので、読点で折る作法と当たる
   （実測＝塊に分けても「クリエイター／のため」で割れ、3行になっていた）。
   落とすと素直に前から詰める＝読点の後で折れ、2行に収まる。 */
/* 題の折り返し（CTO 2026/9/7 21:13）。`.lp-seg`／`.nf-seg` の作法を写した二段構え。
   ⚠️塊には `nowrap` を当てない ── 一段目が 19字あり、狭い幅で器から溢れるため
   （折れる場所が在れば読点の後が選ばれ、無ければ塊の中で折れる＝溢れない側）。
   ✅折れないのは鉤括弧の中だけ（固有名の中では折らない）。 */
.mgz-hero-line .mgz-seg{ display:inline-block; }
.mgz-hero-line .mgz-nb{ white-space:nowrap; }
@media (max-width:520px){ .mgz-hero-art{ aspect-ratio:4/3; }
  .mgz-hero-in{ margin-top:calc(-1 * clamp(16px, 9%, 46px)); } }
/* 番付は `position:absolute; inset:0` なので、一枚の頁では器が丈を持つ */
.rl-gp-frame{ position:relative; height:clamp(520px,72vh,760px); overflow:hidden;
  border:1px solid var(--line-strong,#C7BCA6); }
.mgz-foot{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-top:clamp(16px,2.6vw,28px); border-top:1px solid var(--line,#DCD3C1);
  font-size:12px; color:var(--warm-600,#6F6A5E); }
.mgz-foot a{ color:var(--gold-700,#93702F); text-decoration:none; }
.mgz-foot a:hover{ text-decoration:underline; text-underline-offset:3px; }
/* 棚から `/magazine` の一枚へ渡る戸口（一行だけ・CTO 2026/9/7 12:12 ⑤） */
.rl-rack-more{ padding:0 0 clamp(20px,3vw,36px); }
.rl-rack-more a{ font-family:var(--font-jp-display); font-size:14px; letter-spacing:.06em;
  color:var(--gold-400,#D6BC7E); text-decoration:none; border-bottom:1px solid rgba(214,188,126,.5);
  padding-bottom:3px; }
.rl-rack-more a::after{ content:' →'; }
.rl-rack-more a:hover{ color:var(--paper-000,#FCFBF6); border-bottom-color:var(--paper-000,#FCFBF6); }
/* 書庫の戸口（`/magazine` の奥付の隣・CTO 2026/9/7 13:06 ③）
   ⚠️2026/9/7 15:33 で頁の地が紙になったので、色を紙の上へ反転した（読めない対比を残さない）。 */
.mgz-arch-h{ font-family:var(--font-jp-display); font-weight:600; font-size:clamp(17px,2.2vw,21px);
  letter-spacing:.08em; color:var(--slate-900,#1F2A2E); margin:0; }
.mgz-arch-lead{ font-size:12.5px; color:var(--warm-600,#6F6A5E); margin:8px 0 14px; }
.mgz-arch-list{ list-style:none; margin:0; padding:0; display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:2px 26px; }
.mgz-arch-list li{ display:flex; justify-content:space-between; gap:14px; align-items:baseline;
  border-top:1px solid var(--line,#DCD3C1); padding:9px 0; min-width:0; }
.mgz-arch-list a{ font-family:var(--font-jp-serif); font-size:13px; line-height:1.7;
  color:var(--slate-800,#29363A); text-decoration:none; min-width:0; }
.mgz-arch-list a:hover{ color:var(--gold-700,#93702F); text-decoration:underline; text-underline-offset:3px; }
.mgz-arch-list span{ font-family:var(--font-label); font-size:10.5px; letter-spacing:.14em;
  color:var(--warm-500,#8C8676); white-space:nowrap; }
/* 誌面の頭の一行と、各誌の一〜二行（`/magazine` の一枚だけ・CTO 2026/9/7 15:36 ①＋15:37）
   ⚠️トップの節の棚には出ない（`rich` を渡さないため）。 */
.rack-lead{ padding:16px 0 4px; border-bottom:1px solid var(--line,#DCD3C1); margin-bottom:4px; }
.rack-lead p{ margin:0; font-family:var(--font-jp-serif); font-size:13.5px; line-height:2;
  color:var(--warm-700,#4A463D); max-width:64ch; }
.rack-lead p + p{ margin-top:8px; }
.rack-lead-open{ font-family:var(--font-jp-display) !important; font-size:15px !important;
  color:var(--slate-900,#1F2A2E) !important; letter-spacing:.04em; }
.rack-lead b{ font-weight:600; color:var(--slate-900,#1F2A2E); }
.rack-note{ margin:0; font-size:12px; line-height:1.75; color:var(--warm-600,#6F6A5E); }

/* ══════════════════════════════════════════════════════════════════
   週刊READING LIFE ── 放送局の頁（`/magazine/weekly`・CTO 2026/9/7 15:36 ②）
   出典＝意匠手帳「放送局 ── READING LIFE 局の編成表」（第十二の型）。
   値は手帳のまま写した。近似を作らない。
   ★色は手帳の夜色の直値のまま（この型だけの世界。頁のトークンに翻訳すると別の色になる）。
   ★書体だけ、この頁が持つ体系へ差し替えた（手帳の --mincho/--klee/--label は本番に無い）。
   ⚠️手帳に在って**写さなかった**もの＝再生の丸（`.st-play`）と朱の ON AIR の点。
     押す先も、いま流れている番組も無いため（配信URLは台帳に 0件）。
   ══════════════════════════════════════════════════════════════════ */
.wk-body{ margin:0; background:#0F1A1F; }
.station{ background:#0F1A1F; color:#F8F5EE; border:1px solid #1E2F37;
  font-family:var(--font-jp-serif); display:block; min-height:100vh; }
.st-bar{ display:flex; align-items:center; gap:14px; padding:10px 24px;
  border-bottom:1px solid #1E2F37; font-family:var(--font-label); font-size:11px;
  letter-spacing:.26em; color:#A9B6B8; flex-wrap:wrap; }
.st-bar .brand{ font-family:var(--font-jp-display); font-weight:600; font-size:15px;
  letter-spacing:.14em; color:#F8F5EE; margin-right:auto; }
.st-bar .next{ color:#F8F5EE; }
.st-bar .clock{ color:#D6BC7E; }
.st-main{ display:grid; grid-template-columns:1.55fr 1fr; gap:0; }
.st-hero{ position:relative; aspect-ratio:16/9; background:#1E2F37 center/cover no-repeat;
  border-right:1px solid #1E2F37; }
.st-hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(15,26,31,0) 40%,rgba(15,26,31,.85) 100%); }
.st-hero-text{ position:absolute; left:22px; right:22px; bottom:18px; z-index:1; display:grid; gap:6px; }
.st-kicker{ font-family:var(--font-label); font-size:10.5px; letter-spacing:.3em; color:#D6BC7E; }
.st-hero-title{ font-family:var(--font-jp-display); font-weight:600;
  font-size:clamp(20px,1.8vw + 10px,30px); line-height:1.3; margin:0;
  text-shadow:0 2px 10px rgba(0,0,0,.5); color:#F8F5EE; }
.st-hero-meta{ font-family:var(--font-label); font-size:11px; letter-spacing:.16em; color:#C4CFD1; }
/* 手帳に無い一行＝押せる釦を置かない代わりの但し書き */
.st-hero-note{ font-size:12px; color:#A9B6B8; }
.st-guide{ padding:18px 22px; display:grid; gap:0; align-content:start; }
.st-guide h4{ margin:0 0 8px; font-family:var(--font-label); font-weight:400; font-size:10.5px;
  letter-spacing:.34em; color:#D6BC7E; }
.st-guide > div{ display:grid; grid-template-columns:6.4em 1fr; gap:12px; padding:9px 0;
  border-top:1px solid #1E2F37; font-size:13px; line-height:1.5; }
.st-guide > div:last-child{ border-bottom:1px solid #1E2F37; }
.st-guide .t{ font-family:var(--font-label); font-size:11.5px; letter-spacing:.14em;
  color:#A9B6B8; padding-top:2px; }
.st-guide b{ font-family:var(--font-jp-display); font-weight:600; font-size:14px; display:block; }
.st-guide span{ color:#A9B6B8; font-size:12px; }
.st-rows{ display:grid; grid-template-columns:1.4fr 1.1fr 1fr; gap:0; border-top:1px solid #1E2F37; }
.st-col{ padding:16px 22px 18px; border-right:1px solid #1E2F37; display:grid; gap:10px;
  align-content:start; min-width:0; }
.st-col:last-child{ border-right:0; }
.st-col h4{ margin:0; font-family:var(--font-label); font-weight:400; font-size:10.5px;
  letter-spacing:.34em; color:#D6BC7E; }
.st-daily{ display:grid; gap:12px; align-items:start; }
.st-daily b{ font-family:var(--font-jp-display); font-weight:600; font-size:15px; display:block;
  line-height:1.35; }
.st-daily span{ font-size:12px; color:#A9B6B8; display:block; margin-top:4px; }
.st-vids{ display:grid; gap:8px; }
.st-vids a{ display:grid; grid-template-columns:64px 1fr; gap:10px; align-items:center;
  font-size:12.5px; text-decoration:none; color:inherit; min-width:0; }
.st-vids .th{ width:64px; height:38px; background:#1E2F37 center/cover no-repeat; border-radius:2px; }
.st-vids b{ font-weight:500; display:block; color:#F8F5EE; line-height:1.45; }
.st-vids small{ color:#A9B6B8; }
.st-vids a:hover b{ color:#D6BC7E; text-decoration:underline; text-underline-offset:3px; }
.st-note{ margin:0; font-size:12px; color:#A9B6B8; line-height:1.7; }
.st-note a{ color:#D6BC7E; text-decoration:none; border-bottom:1px solid rgba(214,188,126,.5); }
.st-note a:hover{ color:#F8F5EE; border-bottom-color:#F8F5EE; }
.st-empty{ margin:0; font-size:12.5px; color:#A9B6B8; }
.st-list{ display:grid; gap:7px; font-size:12.5px; color:#C4CFD1; }
.st-list a{ display:flex; justify-content:space-between; gap:10px; border-bottom:1px dotted #2A3B43;
  padding-bottom:6px; text-decoration:none; color:inherit; }
.st-list a:hover span{ color:#F8F5EE; text-decoration:underline; text-underline-offset:3px; }
.st-list em{ font-style:normal; font-family:var(--font-label); font-size:11px; letter-spacing:.1em;
  color:#D6BC7E; white-space:nowrap; }
.st-foot{ padding:10px 24px 14px; border-top:1px solid #1E2F37; font-family:var(--font-label);
  font-size:11px; letter-spacing:.14em; color:#A9B6B8; display:flex; gap:18px; flex-wrap:wrap; }
@media (max-width:860px){
  .st-main{ grid-template-columns:1fr; }
  .st-hero{ border-right:0; border-bottom:1px solid #1E2F37; }
  .st-rows{ grid-template-columns:1fr; }
  .st-col{ border-right:0; border-bottom:1px solid #1E2F37; }
  .st-col:last-child{ border-bottom:0; }
}
@media (max-width:480px){
  .st-bar{ padding:10px 16px; }
  .st-col{ padding:14px 16px; }
  .st-foot{ padding:10px 16px 14px; }
}
/* 棚の週刊の表紙は放送局の頁への戸口（CTO 2026/9/7 15:36 ②）。見た目は表紙のまま。 */
a.rack-cover{ text-decoration:none; color:inherit; }
