/* ============================================================
   実務メモ エディトリアル版（body.ys-ed のページだけに効く）
   2026-10-25 /insights/runway-video-prototyping/ で試行 → 同日 実務メモ全17本の共通テンプレートに拡張（insights_ed.py）
   - 記事固有の装飾は body の修飾クラスで切り替える（ed-theme-film＝Runway）
   - 共通の ys.css / ys-legacy.css / structure-notes.css は変更しない
   - すべてのセレクタを .ys-ed 配下に閉じる
   - 色は ys.css の役割変数（--c-navy / --c-mist / --g-hero-short 等）だけを使う
   ============================================================ */

.ys-ed{
  --ed-col:720px;                 /* 本文の行幅（約42字） */
  --ed-toc:232px;
  --ed-gap:clamp(40px,5.6vw,96px);
  --ed-line:rgba(23,23,22,.12);
  --ed-blue:#2c5f8f;              /* ネイビーとミストの間。明るい面で読める青 */
  --ed-ease:cubic-bezier(.2,.7,.1,1);
}

/* ---------- 1. ヒーロー ---------- */
.ys-ed .ed-hero{background:var(--g-hero-short);color:#fff;overflow:hidden;isolation:isolate;
  padding:calc(var(--hd-h) + clamp(28px,5vh,64px)) var(--gx) 0;--c-hl:var(--c-mist)}
.ys-ed .ed-hero::before{content:"";position:absolute;right:-8vw;top:0;width:min(46vw,680px);height:100%;z-index:-1;
  background:linear-gradient(180deg,rgba(40,39,52,.9),rgba(25,53,80,.95));clip-path:polygon(38% 0,100% 0,100% 100%,0 100%);opacity:.55}
.ys-ed .ed-hero__grain{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.22;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='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
/* 撮影フレームの四隅 */
.ys-ed .ed-hero__frame{position:absolute;left:calc(var(--gx) - 28px);right:calc(var(--gx) - 28px);top:calc(var(--hd-h) + 12px);bottom:16px;pointer-events:none;z-index:-1;
  background:linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) left top/40px 1.5px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) left top/1.5px 40px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) right top/40px 1.5px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) right top/1.5px 40px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) left bottom/40px 1.5px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) left bottom/1.5px 40px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) right bottom/40px 1.5px,linear-gradient(rgba(177,190,203,.42),rgba(177,190,203,.42)) right bottom/1.5px 40px;background-repeat:no-repeat}
.ys-ed .ed-hero .container{max-width:none;position:relative}
.ys-ed .ed-hero .crumb{color:rgba(255,255,255,.66);margin-bottom:clamp(28px,3.4vw,52px)}
.ys-ed .ed-hero .crumb a{color:rgba(255,255,255,.82)}
.ys-ed .ed-hero__top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:clamp(20px,2.4vw,36px)}
.ys-ed .ed-hero .ia-cat{margin:0;color:var(--c-mist)}
.ys-ed .ed-hero__rec{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-en);font-size:11px;font-weight:500;letter-spacing:.2em;color:rgba(177,190,203,.8)}
.ys-ed .ed-hero__rec i{width:8px;height:8px;border-radius:50%;background:var(--c-mist);box-shadow:0 0 0 4px rgba(177,190,203,.14)}
.ys-ed .ed-hero h1{font-size:clamp(34px,5.4vw,78px);font-weight:700;line-height:1.14;letter-spacing:-.05em;max-width:none;color:#fff}
.ys-ed .ed-hero h1 .ed-l{display:inline-block}
/* 改行位置を文節で決める（対応ブラウザのみ）。長い題（29字以上）は一段小さく */
.ys-ed .ed-hero h1{word-break:auto-phrase}
.ys-ed .ed-hero--long h1{font-size:clamp(32px,4.1vw,60px);line-height:1.2}
/* 2行目以降をわずかに右へ（非対称） */
@media (min-width:1024px){ .ys-ed .ed-hero h1{padding-right:12vw} }

.ys-ed .ed-hero .ia-meta{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 40px;margin-top:clamp(28px,3vw,44px);padding-top:20px;border-top:1px solid var(--c-line-inv);color:#fff}
.ys-ed .ed-meta{display:flex;flex-wrap:wrap;gap:14px clamp(24px,3.4vw,56px);margin:0}
.ys-ed .ed-meta div{display:grid;gap:4px}
.ys-ed .ed-meta dt{font-family:var(--f-ja);font-size:11px;font-weight:500;letter-spacing:.12em;color:rgba(177,190,203,.86)}
.ys-ed .ed-meta dd{margin:0;font-family:var(--f-mix);font-size:clamp(15px,1.2vw,18px);font-weight:600;letter-spacing:.01em}
.ys-ed .ed-hero .ia-tag{border-color:var(--c-line-inv);color:rgba(255,255,255,.9)}

/* 章レール＝時間軸（本文への入口） */
.ys-ed .ed-rail{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:end;gap:clamp(24px,3vw,48px);margin-top:clamp(28px,3vw,44px);padding:0 0 clamp(28px,3vw,40px)}
.ys-ed .ed-rail__start{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 24px 0 26px;border-radius:999px;background:#fff;color:var(--c-ink-0);
  font-size:15px;font-weight:700;letter-spacing:.02em;transition:background .3s,color .3s}
.ys-ed .ed-rail__start svg{width:16px;height:16px;transition:transform .4s var(--ed-ease)}
.ys-ed .ed-rail__start:hover{background:var(--c-mist)}
.ys-ed .ed-rail__start:hover svg{transform:translateY(3px)}
.ys-ed .ed-rail__track{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--ed-n,7),minmax(0,1fr));position:relative;
  background:repeating-linear-gradient(90deg,rgba(177,190,203,.38) 0 1px,transparent 1px 12px) left top/100% 8px no-repeat}
.ys-ed .ed-rail__track::before{content:"";position:absolute;left:0;right:0;top:8px;height:1px;background:var(--c-line-inv)}
.ys-ed .ed-rail__track li{min-width:0}
.ys-ed .ed-rail__track a{display:grid;gap:6px;padding:20px 12px 4px 0;border-left:1px solid rgba(177,190,203,.5);padding-left:10px;color:rgba(255,255,255,.78);transition:color .3s}
.ys-ed .ed-rail__track b{font-family:var(--f-en);font-size:12px;font-weight:600;letter-spacing:.12em;color:var(--c-mist)}
.ys-ed .ed-rail__track span{font-size:12.5px;line-height:1.5;font-weight:500}
/* 章数が多い記事（9章以上）：2段に折り返し、各段の上に罫線を引く。見出しは3行で省略（全文は目次と本文にある） */
.ys-ed .ed-rail__track span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.ys-ed .ed-rail--dense .ed-rail__track{row-gap:18px;background:none}
.ys-ed .ed-rail--dense .ed-rail__track::before{display:none}
.ys-ed .ed-rail--dense .ed-rail__track li{border-top:1px solid var(--c-line-inv)}
/* 8章の記事：1024〜1279px では2段に折り返す（1段だと見出しが2〜3文字で切れるため） */
@media (min-width:1024px) and (max-width:1279px){
  .ys-ed .ed-rail--wrap-md .ed-rail__track{grid-template-columns:repeat(var(--ed-n2),minmax(0,1fr));row-gap:18px;background:none}
  .ys-ed .ed-rail--wrap-md .ed-rail__track::before{display:none}
  .ys-ed .ed-rail--wrap-md .ed-rail__track li{border-top:1px solid var(--c-line-inv)}
}
.ys-ed .ed-rail__track a:hover{color:#fff}
.ys-ed .ed-rail__track a:hover b{color:#fff}
@media (max-width:1023px){
  .ys-ed .ed-rail{grid-template-columns:1fr}
  .ys-ed .ed-rail__track{display:none}
  .ys-ed .ed-rail__start{justify-self:start}
}
@media (max-width:767px){
  .ys-ed .ed-hero__frame{display:none}
  .ys-ed .ed-hero::before{width:70vw;right:-30vw;-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 70%);mask-image:linear-gradient(180deg,#000 0%,transparent 70%)}
  .ys-ed .ed-hero .crumb span:last-child{max-width:14em}
  .ys-ed .ed-hero__rec{display:none}
  .ys-ed .ed-hero h1{font-size:clamp(30px,8.6vw,40px);line-height:1.24;letter-spacing:-.04em}
  .ys-ed .ed-meta{display:grid;grid-template-columns:1fr 1fr;width:100%}
}

/* ---------- 2. 本文レイアウト（目次＋本文） ---------- */
.ys-ed .insights-article-body.ed-root{max-width:none;margin:0;font-size:16px}
.ys-ed .ed-layout{display:grid;grid-template-columns:var(--ed-toc) minmax(0,var(--ed-col)) minmax(0,1fr);column-gap:var(--ed-gap);
  padding:clamp(72px,8vw,128px) var(--gx) clamp(72px,8vw,120px)}
.ys-ed .ed-main{grid-column:2;min-width:0}

/* 目次 */
.ys-ed .ed-toc{grid-column:1;grid-row:1;position:relative}
.ys-ed .ed-toc__box{position:sticky;top:calc(var(--hd-h) + 24px)}
.ys-ed .ed-toc__sum{list-style:none;display:flex;align-items:center;gap:12px;cursor:default;font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--c-ink);padding-bottom:16px;border-bottom:1px solid var(--c-ink)}
.ys-ed .ed-toc__sum::-webkit-details-marker{display:none}
.ys-ed .ed-toc__now,.ys-ed .ed-toc__ico{display:none}
.ys-ed .ed-toc__nav ol{list-style:none;margin:0;padding:0;position:relative}
.ys-ed .ed-toc__nav li{margin:0;padding:0;border:0}
.ys-ed .ed-toc__nav li::before{content:none}
.ys-ed .ed-toc__nav a{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:4px;padding:11px 0 11px 14px;font-size:13px;line-height:1.6;color:var(--c-mute);border-left:1px solid var(--ed-line);transition:color .25s,border-color .25s}
.ys-ed .ed-toc__nav a b{font-family:var(--f-en);font-size:11px;font-weight:600;letter-spacing:.08em;padding-top:2px}
.ys-ed .ed-toc__nav a:hover{color:var(--c-ink)}
.ys-ed .ed-toc__nav a[aria-current="true"]{color:var(--c-ink);font-weight:700;border-left:3px solid var(--c-navy);padding-left:12px}
.ys-ed .ed-toc__nav a[aria-current="true"] b{color:var(--c-navy)}
.ys-ed .ed-toc__nav .is-check a b{letter-spacing:.02em}
.ys-ed .ed-toc__bar{margin-top:18px;height:2px;background:var(--ed-line);position:relative;overflow:hidden}
.ys-ed .ed-toc__bar i{position:absolute;inset:0;background:var(--c-navy);transform:scaleX(var(--ed-p,0));transform-origin:left}

@media (max-width:1180px){
  .ys-ed{--ed-toc:200px;--ed-gap:48px}
  .ys-ed .ed-layout{grid-template-columns:var(--ed-toc) minmax(0,1fr)}
}
/* タブレット・スマートフォン：開閉式の目次（画面上部に固定） */
@media (max-width:1023px){
  .ys-ed .ed-layout{display:block;padding-top:0}
  .ys-ed .ed-toc{position:sticky;top:var(--ed-hd,0px);z-index:150;margin:0 calc(-1 * var(--gx)) 0}
  .ys-ed .ed-toc__box{position:relative;top:auto;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--ed-line)}
  .ys-ed .ed-toc__sum{cursor:pointer;min-height:52px;padding:0 var(--gx);border:0;letter-spacing:.1em}
  .ys-ed .ed-toc__now{display:block;flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;letter-spacing:0;color:var(--c-ink-2)}
  .ys-ed .ed-toc__ico{display:block;width:12px;height:12px;flex:none;position:relative}
  .ys-ed .ed-toc__ico::before,.ys-ed .ed-toc__ico::after{content:"";position:absolute;left:0;top:5px;width:12px;height:1.5px;background:currentColor;transition:transform .3s}
  .ys-ed .ed-toc__ico::after{transform:rotate(90deg)}
  .ys-ed .ed-toc__box[open] .ed-toc__ico::after{transform:rotate(0)}
  .ys-ed .ed-toc__nav{max-height:min(62vh,520px);overflow:auto;overscroll-behavior:contain;padding:4px var(--gx) 18px;border-top:1px solid var(--ed-line)}
  .ys-ed .ed-toc__nav a{padding-top:12px;padding-bottom:12px;font-size:14px}
  .ys-ed .ed-toc__bar{margin:0;position:absolute;left:0;right:0;bottom:-1px;height:2px}
  .ys-ed .ed-main{padding-top:clamp(48px,8vw,72px)}
}

/* ---------- 3. 章の見出し ---------- */
.ys-ed .ed-h2no{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ys-ed .article-section.ed-ch{margin:0;padding-top:clamp(72px,8vw,120px);scroll-margin-top:24px}
.ys-ed .ed-overview{scroll-margin-top:24px}
@media (max-width:1023px){ .ys-ed .article-section.ed-ch,.ys-ed .ed-overview,.ys-ed .ed-first{scroll-margin-top:calc(var(--hd-h) + 60px)} }
.ys-ed .ed-chno{display:flex;align-items:baseline;gap:14px;padding-top:22px;border-top:1px solid var(--c-ink);margin-bottom:clamp(16px,2vw,26px);position:relative}
.ys-ed .ed-chno b{font-family:var(--f-en);font-size:clamp(56px,6.4vw,104px);font-weight:600;line-height:.9;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.2px var(--c-navy)}
.ys-ed .ed-chno span{font-family:var(--f-en);font-size:13px;font-weight:500;letter-spacing:.14em;color:var(--c-mute)}
.ys-ed .ed-chno::after{content:"";position:absolute;left:0;top:-1px;height:3px;width:72px;background:var(--c-navy);transform-origin:left;transition:transform 1.1s var(--ed-ease) .1s}
html.ed-js .ys-ed .ed-ch:not(.is-in) .ed-chno::after{transform:scaleX(0)}
.ys-ed .article-section.ed-ch h2{font-size:clamp(26px,2.9vw,42px)!important;font-weight:700!important;line-height:1.42!important;letter-spacing:-.035em!important;
  margin:0 0 clamp(28px,3vw,44px);padding:0;color:var(--c-ink)}
.ys-ed .article-section.ed-ch h2::after{content:none}
.ys-ed .article-section p{font-size:16.5px;line-height:2.05;color:#3c3b38;margin-bottom:26px}
.ys-ed .article-section p strong,.ys-ed .article-section p .hl{color:var(--c-ink)}
.ys-ed .article-section li{font-size:15.5px;color:#3c3b38}
.ys-ed .article-section h3{font-size:clamp(18px,1.5vw,21px);line-height:1.6;border-left:0;padding-left:0;margin:48px 0 14px;letter-spacing:-.02em}
.ys-ed .article-section h3 .h3-en{display:inline-block;margin:0 12px 0 0;font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--c-navy);vertical-align:2px}
@media (max-width:767px){
  .ys-ed .article-section.ed-ch h2{font-size:clamp(23px,6.4vw,28px)!important;line-height:1.45!important}
  .ys-ed .article-section p{font-size:15.5px;line-height:2}
  .ys-ed .article-section li{font-size:14.5px}
  .ys-ed .article-section h3{font-size:17px!important}
}

/* ---------- 4. 概要（導入文・判断できること・要点） ---------- */
.ys-ed .ed-kicker{display:flex;align-items:center;gap:14px;font-family:var(--f-en);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--c-mute);margin-bottom:18px}
.ys-ed .ed-kicker span{color:var(--c-navy)}
.ys-ed .ed-kicker::after{content:"";flex:1;height:1px;background:var(--ed-line)}
.ys-ed .ed-overview__t{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--c-ink);margin:0 0 clamp(20px,2.4vw,32px)}
.ys-ed .ed-lead{margin:0;font-size:clamp(18px,1.55vw,22px);line-height:2;font-weight:500;letter-spacing:.005em;color:var(--c-ink)}
.ys-ed .sn-decide{margin:clamp(48px,5vw,72px) 0 0;padding:0;border:0}
.ys-ed .sn-decide-label{font-size:13px;letter-spacing:.14em;padding-bottom:16px;margin-bottom:0;border-bottom:1px solid var(--c-ink)}
.ys-ed .sn-decide li{grid-template-columns:clamp(56px,6vw,88px) minmax(0,1fr);row-gap:8px;padding:26px 0;border-top:0;border-bottom:1px solid var(--ed-line)}
.ys-ed .sn-decide li::before{grid-row:1 / span 2;font-family:var(--f-en);font-size:clamp(30px,3vw,44px);font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--c-navy);padding:0}
.ys-ed .sn-decide .q{font-size:clamp(17px,1.4vw,20px);line-height:1.55}
.ys-ed .sn-decide .a{font-size:15px;line-height:1.95;color:#3c3b38}
.ys-ed .key-points{margin:clamp(40px,4vw,56px) 0 0;padding:clamp(24px,2.6vw,36px);background:var(--c-paper-2);border-left:0;border-top:3px solid var(--c-navy)}
.ys-ed .key-points .kp-label{font-family:var(--f-ja);font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--c-ink)}
.ys-ed .key-points li{font-size:15px;line-height:1.85;padding-left:30px}
.ys-ed .key-points li::before{color:var(--c-navy)}

/* ---------- 5. 事実／見解／要確認のラベル ---------- */
.ys-ed .ed-badge{display:inline-flex;align-items:center;gap:10px;margin:0;font-family:var(--f-ja);font-size:12px!important;font-weight:500;line-height:1.4!important;letter-spacing:.04em;color:var(--c-ink-2)}
.ys-ed .ed-badge span,.ys-ed .sn-fig-head .ed-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:2px;font-size:11.5px;font-weight:700;letter-spacing:.08em}
.ys-ed .ed-badge--fact span{background:var(--c-navy);color:#fff}
.ys-ed .ed-badge--view span,.ys-ed .sn-fig-head .ed-badge--view{background:transparent;color:var(--c-ink);box-shadow:inset 0 0 0 1px var(--c-ink)}
.ys-ed .ed-badge--todo span{background:transparent;color:var(--c-navy);box-shadow:inset 0 0 0 1px var(--c-navy);border-style:dashed}
.ys-ed .sn-fig-head .ed-badge{margin-left:auto;font-family:var(--f-ja);text-transform:none}

.ys-ed .ed-fact{margin:32px 0 36px;padding:clamp(22px,2.4vw,32px) clamp(20px,2.4vw,32px) 22px;border:1px solid var(--ed-line);border-left:3px solid var(--c-navy);background:#fff}
.ys-ed .ed-fact > p:not(.ed-badge):not(.sn-source){margin:16px 0 8px}
.ys-ed .ed-fact ul{margin-bottom:0}
.ys-ed .ed-note-view{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-size:15px!important;color:var(--c-ink-2)!important}
.ys-ed .ed-note-view .ed-badge{color:var(--c-ink)}
/* 出典・注記 */
.ys-ed .sn-source{display:block;margin:20px 0 0;padding:14px 16px;border:0;border-top:1px dashed rgba(23,23,22,.28);background:var(--c-paper-2);font-size:12.5px!important;line-height:1.9!important;color:var(--c-ink-2)}
.ys-ed .sn-source b{display:inline-block;margin-right:12px;padding:1px 8px;font-family:var(--f-ja);font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff;background:var(--c-ink-2)}
.ys-ed .sn-source a{color:var(--c-ink)}

/* ---------- 6. 2章：4つの場面＝カード ---------- */
.ys-ed .ed-scenes{display:grid;gap:clamp(16px,1.6vw,24px);margin-top:32px;counter-reset:scene}
.ys-ed .ed-scene{position:relative;padding:clamp(24px,2.6vw,36px);background:#fff;border:1px solid var(--ed-line);transition:border-color .3s,box-shadow .3s}
.ys-ed .ed-scene::before{content:"";position:absolute;left:-1px;top:-1px;width:24px;height:24px;border-left:2px solid var(--c-navy);border-top:2px solid var(--c-navy)}
.ys-ed .ed-scene::after{content:"";position:absolute;right:-1px;bottom:-1px;width:24px;height:24px;border-right:2px solid var(--c-navy);border-bottom:2px solid var(--c-navy)}
.ys-ed .ed-scene:hover{border-color:rgba(25,53,80,.35);box-shadow:0 18px 40px -28px rgba(11,14,19,.45)}
.ys-ed .ed-scene h3{margin:0 0 12px;font-size:clamp(19px,1.6vw,23px)!important}
.ys-ed .ed-scene h3 .h3-en{display:block;margin:0 0 10px;font-size:12px;letter-spacing:.16em}
.ys-ed .ed-scene h3 .h3-en::before{content:"SCENE ";}
.ys-ed .ed-scene > p{margin-bottom:18px}
.ys-ed .ed-dl{display:grid;gap:10px;margin:0!important}
.ys-ed .ed-dl li{padding:14px 16px!important;border:0!important;background:var(--c-paper-2);line-height:1.85!important}
.ys-ed .ed-dl li::before{content:none!important}
.ys-ed .ed-dl li strong{display:block;margin-bottom:4px;font-size:12.5px;letter-spacing:.06em;color:var(--c-ink)}
.ys-ed .ed-dl li.is-check{background:#eef3f8;box-shadow:inset 3px 0 0 var(--c-navy)}
.ys-ed .ed-dl li.is-check strong{color:var(--c-navy)}
.ys-ed .ed-scene__warn{margin:18px 0 0!important;padding-top:16px;border-top:1px solid var(--ed-line);font-size:15px!important}

/* ---------- 7. 3章：先に決める4点＝チェックリスト ---------- */
.ys-ed .ed-checklist{counter-reset:none;margin:28px 0 36px!important;border-top:1px solid var(--c-ink)}
.ys-ed .ed-checklist > li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;padding:24px 0!important;border-bottom:1px solid var(--ed-line)!important}
.ys-ed .ed-checklist > li::before{content:""!important;position:static!important;grid-row:1 / span 2;width:26px;height:26px;margin-top:2px;border:1.5px solid var(--c-navy);border-radius:3px;
  background:linear-gradient(var(--c-navy),var(--c-navy)) center/0 0 no-repeat}
.ys-ed .ed-checklist > li::after{content:"";position:absolute;left:8px;top:31px;width:11px;height:6px;border-left:2px solid var(--c-navy);border-bottom:2px solid var(--c-navy);transform:rotate(-45deg)}
.ys-ed .ed-checklist h3{margin:0 0 6px!important}
.ys-ed .ed-checklist p{margin:0!important}

/* ---------- 8. 5章：確認したい5論点＝番号付きリスト ---------- */
.ys-ed .ed-numlist{margin:12px 0 36px!important}
.ys-ed .ed-numlist > li{display:grid;grid-template-columns:clamp(64px,7vw,96px) minmax(0,1fr);column-gap:clamp(12px,2vw,28px);padding:30px 0 26px!important;border-bottom:1px solid var(--ed-line)!important}
.ys-ed .ed-numlist > li::before{content:counter(oli,decimal-leading-zero)!important;position:static!important;grid-row:1 / span 2;font-family:var(--f-en)!important;font-size:clamp(40px,4.4vw,64px)!important;font-weight:600!important;line-height:.9;letter-spacing:-.05em!important;color:var(--c-navy)!important}
.ys-ed .ed-numlist h3{margin:0 0 10px!important}
.ys-ed .ed-numlist h3 .h3-en,.ys-ed .ed-checklist h3 .h3-en{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ys-ed .ed-numlist p{margin:0!important}
.ys-ed .ed-pull{position:relative;margin:clamp(36px,4vw,56px) 0 0!important;padding:4px 0 4px clamp(20px,2.4vw,32px);border-left:3px solid var(--c-navy);font-size:clamp(17px,1.4vw,20px)!important;line-height:1.95!important}
.ys-ed .ed-pull .hl{font-weight:700}

/* ---------- 9. 図解（FIG.01〜03） ---------- */
.ys-ed .ed-fig{margin:40px 0 48px;background:#fff;border-color:var(--ed-line)}
.ys-ed .ed-fig::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c-navy)}
/* 映像制作の記事だけ：フィルム送り穴の帯（body.ed-theme-film） */
.ys-ed.ed-theme-film .ed-fig::before{height:6px;background:repeating-linear-gradient(90deg,var(--c-navy) 0 14px,transparent 14px 22px);opacity:.85}
@media (min-width:1320px){ .ys-ed .sn-fig--wide.ed-fig{margin-right:calc(-1 * min(18vw,240px))} }
.ys-ed .sn-fig-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:12px}
.ys-ed .sn-map > div::before,.ys-ed .sn-legend,.ys-ed .sn-fig-read,.ys-ed .sn-fig-note,.ys-ed .sn-phase-when,.ys-ed .sn-first-label{font-size:12px!important}
.ys-ed .sn-fig-title{font-size:clamp(18px,1.6vw,22px)!important;line-height:1.55!important}
.ys-ed .sn-map p{font-size:13.5px!important;line-height:1.8!important}
.ys-ed .sn-map h4{font-size:15px!important}
.ys-ed .sn-table th,.ys-ed .sn-table td{font-size:14.5px;line-height:1.8}
/* スマートフォン：表を行ごとのカードに組み替えて、横スクロールなしで読ませる */
@media (max-width:640px){
  .ys-ed .ed-fig{padding:26px 18px 20px}
  .ys-ed .sn-table-wrap:has(.ed-stack){overflow:visible}
  .ys-ed .sn-table.ed-stack{min-width:0!important;width:100%;border:0}
  .ys-ed .sn-table.ed-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ys-ed .sn-table.ed-stack,.ys-ed .sn-table.ed-stack tbody,.ys-ed .sn-table.ed-stack tr,.ys-ed .sn-table.ed-stack th,.ys-ed .sn-table.ed-stack td{display:block}
  .ys-ed .sn-table.ed-stack tr{margin-bottom:12px;border:1px solid var(--ed-line);background:#fff}
  .ys-ed .sn-table.ed-stack th[scope="row"]{padding:10px 14px;background:var(--c-ink-0);color:#fff;font-size:15px;border:0}
  .ys-ed .sn-table.ed-stack td{padding:10px 14px;border:0;border-top:1px solid var(--ed-line);font-size:14.5px;white-space:normal}
  .ys-ed .sn-table.ed-stack td::before{content:attr(data-th);display:block;margin-bottom:2px;font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--c-navy)}
  .ys-ed .sn-table.ed-stack td:last-child{background:#eef3f8}
  .ys-ed .sn-table-wrap:has(.ed-stack) + .sn-scroll-hint{display:none!important}
}

/* ---------- 10. 公開前チェック（暗い面・右へ張り出す） ---------- */
.ys-ed .ed-first{margin:clamp(80px,9vw,128px) 0 0;padding:clamp(36px,4vw,64px);background:var(--g-hero-short);scroll-margin-top:24px}
@media (min-width:1024px){ .ys-ed .ed-first{margin-right:calc(-1 * var(--gx));padding-right:calc(var(--gx) + 24px)} }
@media (min-width:1320px){ .ys-ed .ed-first{margin-right:calc(-1 * min(18vw,240px) - var(--gx))} }
.ys-ed .ed-first h2{font-size:clamp(22px,2.3vw,32px)!important;line-height:1.5!important;margin-bottom:28px}
.ys-ed .ed-first .sn-first-label{font-family:var(--f-en);font-size:12px;color:var(--c-mist)}
.ys-ed .ed-first li strong{font-size:16.5px}
.ys-ed .ed-first li{font-size:14.5px;color:rgba(255,255,255,.82)}
.ys-ed .ed-first li small{color:rgba(177,190,203,.92);font-size:12.5px}
@media (max-width:1023px){ .ys-ed .ed-first{margin-left:calc(-1 * var(--gx));margin-right:calc(-1 * var(--gx));padding:44px var(--gx)} }

/* ---------- 11. 7章：事実／見解の台帳 ---------- */
.ys-ed .ed-ledger{display:grid;grid-template-columns:1fr;gap:16px}
.ys-ed .ed-ledger__col,.ys-ed .ed-todo{padding:clamp(22px,2.4vw,32px);border:1px solid var(--ed-line);background:#fff}
.ys-ed .ed-ledger__col--fact{border-top:3px solid var(--c-navy)}
.ys-ed .ed-ledger__col--view{border-top:3px solid var(--c-ink);background:repeating-linear-gradient(135deg,rgba(23,23,22,.025) 0 2px,transparent 2px 9px),#fff}
.ys-ed .ed-todo{margin-top:16px;border:1px dashed rgba(25,53,80,.5)}
.ys-ed .ed-ledger h3,.ys-ed .ed-todo h3,.ys-ed .ed-refs h3{margin:14px 0 10px!important;font-size:17px!important}
.ys-ed .ed-ledger ul,.ys-ed .ed-todo ul{margin-bottom:0}
.ys-ed.ed-theme-film .ed-ch > p:last-of-type{margin-top:28px}
.ys-ed .ed-refs{margin-top:36px;padding-top:6px;border-top:1px solid var(--c-ink)}
.ys-ed .ed-refs li a{color:var(--c-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.ys-ed .ed-refs li a::after{content:" ↗";font-family:var(--f-en);font-size:.85em;color:var(--c-mute)}

/* ---------- 12. 記事末尾（相談・問い合わせ・関連記事） ---------- */
.ys-ed .ed-end{background:var(--c-paper-2);padding:clamp(72px,8vw,128px) var(--gx) clamp(80px,9vw,140px)}
.ys-ed .ed-end__inner{max-width:1200px;margin:0 auto}
.ys-ed .ed-end .ask-ai{max-width:var(--ed-col);margin:0 0 clamp(56px,6vw,88px)}
.ys-ed .ed-end .article-cta-stack{margin:0}
.ys-ed .ed-end .acta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:32px;padding:clamp(36px,5vw,80px);border:0;border-radius:0;
  background:var(--g-hero-short);color:#fff;position:relative;overflow:hidden;transition:transform .5s var(--ed-ease)}
.ys-ed .ed-end .acta::before{content:"";position:absolute;right:-10%;top:0;width:44%;height:100%;background:linear-gradient(180deg,var(--c-violet),var(--c-navy));clip-path:polygon(40% 0,100% 0,60% 100%,0 100%);opacity:.6;transition:transform .8s var(--ed-ease)}
.ys-ed .ed-end .acta:hover{transform:none;border:0}
.ys-ed .ed-end .acta:hover::before{transform:translateX(-4%)}
.ys-ed .ed-end .acta-body{position:relative}
.ys-ed .ed-end .acta-label{display:inline-flex;margin-bottom:22px;padding:6px 14px;border-radius:999px;background:#fff;color:var(--c-ink-0);font-family:var(--f-ja);font-size:13px;font-weight:700;letter-spacing:.06em}
.ys-ed .ed-end .acta-ttl{max-width:22em;font-size:clamp(24px,3vw,44px);font-weight:700;line-height:1.45;letter-spacing:-.04em;color:#fff}
.ys-ed .ed-end .acta-desc{max-width:44em;margin-top:20px;font-size:15px;line-height:2;color:rgba(255,255,255,.82)}
.ys-ed .ed-end .acta-arrow{position:relative;display:grid;place-items:center;width:clamp(64px,7vw,104px);height:clamp(64px,7vw,104px);border-radius:50%;background:#fff;color:var(--c-ink-0);font-size:clamp(22px,2.4vw,34px);transition:transform .5s var(--ed-ease)}
.ys-ed .ed-end .acta:hover .acta-arrow{transform:rotate(45deg);color:var(--c-ink-0)}
.ys-ed .ed-end .acta:focus-visible{outline:3px solid var(--c-navy);outline-offset:4px}
@media (max-width:767px){ .ys-ed .ed-end .acta{grid-template-columns:1fr;padding:36px 22px} .ys-ed .ed-end .acta-arrow{justify-self:start} }

.ys-ed .ed-end .related-articles{margin-top:clamp(64px,7vw,104px);padding-top:0}
.ys-ed .ed-end .related-articles::before{content:none}
.ys-ed .ed-end .ra-label{font-family:var(--f-ja);font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--c-ink);padding-bottom:16px;margin-bottom:0;border-bottom:1px solid var(--c-ink)}
.ys-ed .ed-end .ra-grid{display:block}
.ys-ed .ed-end .ra-card{display:grid;grid-template-columns:minmax(0,1fr) 160px 40px;align-items:center;gap:24px;padding:clamp(24px,2.6vw,36px) 0;border:0;border-bottom:1px solid var(--ed-line);border-radius:0;background:transparent;position:relative;transition:padding .45s var(--ed-ease)}
.ys-ed .ed-end .ra-card::after{content:"↗";font-family:var(--f-en);font-size:22px;justify-self:end;transition:transform .4s var(--ed-ease)}
.ys-ed .ed-end .ra-card .ra-ttl{grid-column:1;grid-row:1;font-size:clamp(18px,1.9vw,28px);font-weight:700;line-height:1.5;letter-spacing:-.03em;color:var(--c-ink)}
.ys-ed .ed-end .ra-card .ra-cat{grid-column:2;grid-row:1;justify-self:end;margin:0;font-size:12.5px;color:var(--c-ink-2)}
.ys-ed .ed-end .ra-card:hover{transform:none;padding-left:16px}
.ys-ed .ed-end .ra-card:hover::after{transform:translate(3px,-3px)}
@media (max-width:767px){ .ys-ed .ed-end .ra-card{grid-template-columns:minmax(0,1fr) 28px;gap:8px 12px} .ys-ed .ed-end .ra-card .ra-cat{grid-column:1;grid-row:2;justify-self:start} .ys-ed .ed-end .ra-card::after{grid-column:2;grid-row:1 / span 2} }
.ys-ed .ed-back{margin:48px 0 0;text-align:left}
.ys-ed .ed-back a{display:inline-block;padding:12px 0;border-bottom:1px solid var(--c-ink);font-size:14px;font-weight:600;color:var(--c-ink)}

/* ---------- 13. フォーカス表示 ---------- */
.ys-ed .ed-root a:focus-visible,.ys-ed .ed-hero a:focus-visible,.ys-ed .ed-toc__sum:focus-visible,.ys-ed .sn-table-wrap:focus-visible{outline:2px solid var(--c-navy);outline-offset:3px}
.ys-ed .ed-hero a:focus-visible{outline-color:#fff}
.ys-ed .ed-ch h2:focus,.ys-ed .ed-overview__t:focus,.ys-ed .ed-first h2:focus{outline:none}

/* ---------- 14. 読み込み時の段階リビール（ヒーローのみ） ---------- */
@media (prefers-reduced-motion:no-preference){
  .ys-ed .ed-hero h1 .ed-l{animation:ed-rise .9s var(--ed-ease) both}
  .ys-ed .ed-hero h1 .ed-l:nth-of-type(2){animation-delay:.08s}
  .ys-ed .ed-hero h1 .ed-l:nth-of-type(3){animation-delay:.14s}
  .ys-ed .ed-hero h1 .ed-l:nth-of-type(4){animation-delay:.22s}
  .ys-ed .ed-hero h1 .ed-l:nth-of-type(5){animation-delay:.28s}
  .ys-ed .ed-hero h1 .ed-l:nth-of-type(6){animation-delay:.36s}
  .ys-ed .ed-hero .ia-meta,.ys-ed .ed-rail{animation:ed-fade .9s var(--ed-ease) .45s both}
  .ys-ed .ed-rail__track{animation:ed-wipe 1.4s var(--ed-ease) .6s both}
  .ys-ed .ed-hero__rec i{animation:ed-blink 2.4s ease-in-out infinite}
}
@keyframes ed-rise{from{opacity:0;transform:translateY(.45em)}to{opacity:1;transform:none}}
@keyframes ed-fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ed-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes ed-blink{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){
  .ys-ed .ed-chno::after{transition:none}
  html.ed-js .ys-ed .ed-ch:not(.is-in) .ed-chno::after{transform:none}
  .ys-ed .ed-scene,.ys-ed .ed-end .acta,.ys-ed .ed-end .acta::before,.ys-ed .ed-end .acta-arrow,.ys-ed .ed-end .ra-card,.ys-ed .ed-toc{transition:none}
}

@media print{
  .ys-ed .ed-toc,.ys-ed .ed-rail{display:none}
  .ys-ed .ed-layout{display:block}
}
