/* ===== HISTORY 固有 ===== */

  /* ============ HISTORY ページ固有（2026の作法・トークンに準拠） ============ */

  /* ---- HERO（fv の作法を踏襲） ---- */
  .hist-hero{ position:relative; overflow:hidden; text-align:center;
    padding: clamp(96px,13vw,160px) 0 clamp(44px,6vw,72px); }
  .hist-hero .eyebrow{ justify-content:center; }
  .hist-hero__title{ margin-top:24px; font-weight:900; letter-spacing:.01em;
    font-size:clamp(26px,5.6vw,60px); line-height:1.18; overflow-wrap:break-word; }         /* = fv__title 相当 */
  .hist-hero__title .accent{ display:inline; word-break:keep-all; overflow-wrap:break-word;
    background:linear-gradient(90deg,var(--mag),var(--cyn));
    -webkit-background-clip:text; background-clip:text; color:transparent; }
  .hist-hero__lead{ margin:26px auto 0; max-width:min(600px,100%); padding-inline:8px;
    box-sizing:border-box; color:var(--muted); overflow-wrap:break-word;
    font-size:clamp(15px,2vw,18px); }                             /* = fv__lead 相当 */

  /* HEROのMemphis装飾（fv と同じ配置ルール） */
  .hist-hero .deco--dots{ top:8%; left:-40px; }
  .hist-hero .deco--ring{ bottom:6%; right:8%; opacity:.9; }
  .hist-hero .deco--bar { top:16%; right:12%; width:220px; height:22px; opacity:.85; }
  .hist-hero .hd-triangle{ bottom:10%; left:6%; width:115px; height:100px;
    clip-path:polygon(50% 0%,0% 100%,100% 100%); background:var(--grn);
    transform:rotate(10deg); opacity:.18; }
  .hist-hero .hd-plus{ top:14%; left:9%; width:100px; height:100px; opacity:.16;
    background:
      linear-gradient(var(--mag),var(--mag)) center/100% 28% no-repeat,
      linear-gradient(var(--mag),var(--mag)) center/28% 100% no-repeat; }
  @media (max-width:767px){
    .hist-hero .deco--bar,.hist-hero .deco--ring,.hist-hero .hd-triangle,.hist-hero .hd-plus{ display:none; }
    .hist-hero .deco--dots{ width:140px; height:140px; top:4%; left:-30px; }
    .hist-hero .container{ padding-inline:20px; box-sizing:border-box; }
  }

  /* ---- TIMELINE セクション（.section の余白を継承、装飾を散らす） ---- */
  .tl-section{ position:relative; overflow:hidden;
    padding-block: clamp(24px,4vw,56px) clamp(64px,9vw,120px); }
  .tl{ position:relative; max-width:980px; margin:0 auto; padding:16px 24px 24px; z-index:2; }
  .tl::before{ content:""; position:absolute; top:0; bottom:118px; left:50%;
    transform:translateX(-50%); width:3px; border-radius:2px;
    background:linear-gradient(var(--mag),var(--cyn)); opacity:.28; }

  /* タイムライン背景のMemphis装飾（各色・低透明度で散らす） */
  .tl-section .tld{ position:absolute; pointer-events:none; z-index:0; }
  .tld-ring-m { top:6%;  right:-46px; width:200px; height:200px; border:24px solid var(--mag); border-radius:50%; opacity:.13; }
  .tld-ring-c { bottom:22%; left:-40px; width:165px; height:165px; border:20px solid var(--cyn); border-radius:50%; opacity:.12; }
  .tld-bar-c  { top:20%; left:-60px; width:340px; height:26px; background:var(--cyn);   transform:rotate(-12deg); border-radius:4px; opacity:.10; }
  .tld-bar-g  { bottom:12%; right:-50px; width:360px; height:26px; background:var(--grn); transform:rotate(-9deg);  border-radius:4px; opacity:.10; }
  .tld-tri-y  { top:12%; left:4%;  width:110px; height:95px; clip-path:polygon(50% 0%,0% 100%,100% 100%); background:var(--yel);  transform:rotate(15deg);  opacity:.16; }
  .tld-tri-m  { bottom:28%; right:5%; width:100px; height:87px; clip-path:polygon(50% 0%,0% 100%,100% 100%); background:var(--mag); transform:rotate(-8deg); opacity:.10; }
  .tld-dots-y { top:34%; right:2%; width:220px; height:220px; background-image:radial-gradient(var(--yel) 22%,transparent 23%); background-size:26px 26px; opacity:.16; }
  .tld-dots-g { bottom:4%; left:3%; width:200px; height:200px; background-image:radial-gradient(var(--grn) 22%,transparent 23%); background-size:24px 24px; opacity:.14; }
  .tld-plus-c { top:52%; left:6%; width:90px; height:90px; opacity:.14;
    background:
      linear-gradient(var(--cyn),var(--cyn)) center/100% 28% no-repeat,
      linear-gradient(var(--cyn),var(--cyn)) center/28% 100% no-repeat; }
  @media (max-width:767px){ .tl-section .tld{ display:none; } }

  .tl-item{ position:relative; width:50%; padding:0 52px; margin-bottom:60px; z-index:2; }
  .tl-item--l{ left:0; text-align:right; }
  .tl-item--r{ left:50%; text-align:left; }

  /* 年号ノード */
  .tl-node{ position:absolute; top:10px; width:76px; height:76px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; background:#fff;
    border:3px solid var(--cyn); box-shadow:0 0 0 6px var(--paper), var(--sh-m); z-index:3; }
  .tl-item--l .tl-node{ right:-38px; }
  .tl-item--r .tl-node{ left:-38px; }
  .tl-node__y{ font-family:var(--en); font-weight:800; font-size:18px; color:var(--ink); letter-spacing:.01em; }

  /* 展示カード */
  .tl-card{ display:inline-block; text-align:left; width:100%; background:#fff;
    border:1px solid var(--line); border-radius:var(--r-l); overflow:hidden;
    box-shadow:var(--sh-m); transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
  .tl-card:hover{ transform:translateY(-5px); box-shadow:var(--sh-l); }

  .tl-figure{ position:relative; aspect-ratio:16/10; display:flex; align-items:center; justify-content:center;
    background:
      radial-gradient(rgba(255,255,255,.6) 20%, transparent 21%) 0 0/22px 22px,
      linear-gradient(135deg, var(--f1,#e6f4fb), var(--f2,#f6e6f1)); }
  .tl-figure__cap{ font-family:var(--en); font-size:12px; font-weight:800; letter-spacing:.16em;
    text-transform:uppercase; color:rgba(22,22,26,.42); }
  .tl-figure__wm{ position:absolute; right:16px; bottom:8px; font-family:var(--en);
    font-weight:900; font-size:44px; color:rgba(255,255,255,.65); letter-spacing:.02em; }

  .tl-body{ padding:22px 26px 26px; min-width:0; overflow-wrap:break-word; }
  .tl-cat{ display:inline-block; font-family:var(--en); font-size:11px; font-weight:800;
    letter-spacing:.14em; text-transform:uppercase; padding:5px 12px; border-radius:var(--pill);
    background:var(--soft); color:var(--muted); margin-bottom:12px; }
  .tl-title{ font-size:clamp(20px,2.4vw,26px); font-weight:800; line-height:1.3; letter-spacing:.01em;
    overflow-wrap:break-word; word-break:break-word; min-width:0; }
  .tl-date{ display:inline-block; margin-top:12px; font-weight:800; font-size:14px; letter-spacing:.04em;
    color:#fff; background:#111; border-radius:12px; padding:9px 16px; }
  .tl-time{ margin-top:8px; font-size:12.5px; font-weight:700; color:var(--muted); letter-spacing:.02em; overflow-wrap:break-word; }
  .tl-venue{ margin-top:10px; font-size:13px; font-weight:700; color:var(--ink); overflow-wrap:break-word; }
  .tl-venue::before{ content:"📍"; margin-right:4px; }
  .tl-stats{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
  .tl-chip{ display:inline-flex; align-items:baseline; gap:6px; padding:7px 14px; border-radius:var(--pill);
    background:var(--soft); border:1px solid var(--line); font-size:13px; }
  .tl-chip b{ font-family:var(--en); font-weight:800; font-size:16px; color:var(--cyn); }
  .tl-chip span{ color:var(--muted); font-size:12px; font-weight:700; }
  .tl-tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
  .tl-tag{ font-size:12px; font-weight:700; color:var(--ink); background:#fff;
    border:1.5px solid var(--line); border-radius:var(--pill); padding:5px 11px; }
  .tl-tag--c{ border-color:var(--cyn); color:var(--cyn); }
  .tl-tag--m{ border-color:var(--mag); color:var(--mag); }
  .tl-desc{ margin-top:16px; font-size:14px; color:var(--muted); line-height:1.95; }
  .tl-link{ display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-weight:800; font-size:13px; color:var(--ink); }
  .tl-link .arrow{ transition:transform .25s var(--ease); }
  .tl-link:hover .arrow{ transform:translateX(4px); }
  .tl-link:hover{ color:var(--mag); }

  /* 最新回（開催予定）＝マゼンタ強調 */
  .tl-item--next .tl-node{ border-color:var(--mag); box-shadow:0 0 0 6px var(--paper),0 10px 26px rgba(235,0,135,.28); }
  .tl-item--next .tl-node__y{ color:var(--mag); }
  .tl-item--next .tl-card{ border-color:var(--mag); box-shadow:0 22px 48px rgba(235,0,135,.16); }
  .tl-cat--next{ background:var(--mag); color:#fff; }
  .tl-item--next .tl-chip b{ color:var(--mag); }

  /* 準備中ゴースト（資料DL中の年） */
  .tl-item--wip .tl-card{ background:transparent; border:2px dashed var(--line); box-shadow:none;
    display:flex; align-items:center; justify-content:center; min-height:120px; text-align:center; }
  .tl-item--wip .tl-card:hover{ transform:none; box-shadow:none; }
  .tl-item--wip .tl-node{ border-color:var(--muted); border-style:dashed; }
  .tl-item--wip .tl-node__y{ color:var(--muted); }
  .tl-wip{ padding:24px; color:var(--muted); font-size:13.5px; line-height:1.8; }
  .tl-wip b{ display:block; font-family:var(--en); font-size:22px; color:var(--muted); font-weight:800; margin-bottom:4px; }

  /* 現在地マーカー */
  .tl-now{ position:relative; z-index:2; text-align:center; margin-top:4px; }
  .tl-now__dot{ width:16px; height:16px; border-radius:50%; margin:0 auto 12px;
    background:var(--mag); box-shadow:0 0 0 6px rgba(235,0,135,.14); }
  .tl-now__t{ font-weight:800; font-size:15px; letter-spacing:.08em; color:var(--muted); }

  /* RESPONSIVE：スマホは1カラム */
  @media (max-width:767px){
    .tl{ padding:8px 10px 20px; box-sizing:border-box; }
    .tl::before{ left:27px; bottom:96px; }
    .tl-item, .tl-item--l, .tl-item--r{ width:100%; left:0; text-align:left; padding:0 0 0 64px; margin-bottom:40px; box-sizing:border-box; min-width:0; }
    .tl-item--l .tl-node, .tl-item--r .tl-node{ left:-9px; right:auto; width:58px; height:58px; top:4px; }
    .tl-node__y{ font-size:15px; }
  }
  .hist-foot{ text-align:center; padding:8px 24px 72px; color:var(--muted); font-size:13px; letter-spacing:.06em; }


  .tl-figure--img{ background:#eef1f5; }
  .tl-figure--img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; }
  .tl-src{ display:inline-block; margin-left:8px; font-size:11px; font-weight:700; color:var(--muted);
    background:var(--soft); border:1px solid var(--line); border-radius:var(--pill); padding:3px 10px; }
  /* --- 注意事項フッター＆モーダル --- */
  .disc-foot{ text-align:center; padding:32px 24px 80px; }
  .disc-open{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:13px; cursor:pointer;
    color:var(--ink); background:#fff; border:2px solid var(--ink); border-radius:var(--pill); padding:11px 22px;
    transition:background .2s var(--ease), color .2s var(--ease); }
  .disc-open:hover{ background:var(--ink); color:#fff; }
  .disc-note{ margin-top:14px; font-size:12px; color:var(--muted); line-height:1.9; max-width:640px; margin-inline:auto; }
  .disc-overlay{ position:fixed; inset:0; z-index:2000; display:none; align-items:center; justify-content:center;
    background:rgba(22,22,26,.55); padding:20px; }
  .disc-overlay.is-open{ display:flex; }
  .disc-modal{ background:#fff; border-radius:var(--r-l); max-width:640px; width:100%; max-height:86vh; overflow:auto;
    box-shadow:var(--sh-l); position:relative; }
  .disc-modal__head{ position:sticky; top:0; background:#fff; border-bottom:1px solid var(--line);
    padding:20px 24px; display:flex; align-items:center; justify-content:space-between; }
  .disc-modal__title{ font-size:18px; font-weight:800; letter-spacing:.01em; }
  .disc-modal__title .bar{ display:inline-block; width:22px; height:4px; border-radius:2px; margin-right:10px; vertical-align:middle;
    background:linear-gradient(90deg,var(--mag),var(--cyn)); }
  .disc-close{ border:0; background:var(--soft); width:34px; height:34px; border-radius:50%; cursor:pointer;
    font-size:18px; line-height:1; color:var(--muted); }
  .disc-close:hover{ background:var(--line); }
  .disc-modal__body{ padding:22px 26px 28px; }
  .disc-modal__lead{ font-size:13.5px; color:var(--ink); font-weight:700; margin-bottom:14px; }
  .disc-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
  .disc-list li{ position:relative; padding-left:26px; font-size:13px; color:var(--muted); line-height:1.85; }
  .disc-list li::before{ content:""; position:absolute; left:0; top:7px; width:14px; height:14px; border-radius:4px;
    background:linear-gradient(135deg,var(--mag),var(--cyn)); opacity:.9; }
  .disc-agree{ margin-top:18px; padding:14px 16px; background:var(--soft); border-radius:12px;
    font-size:12.5px; font-weight:700; color:var(--ink); line-height:1.8; }
  .disc-modal__foot{ padding:0 26px 24px; }
  .disc-ok{ width:100%; border:0; border-radius:var(--pill); background:var(--mag); color:#fff;
    font-weight:800; font-size:14px; padding:13px; cursor:pointer; box-shadow:var(--sh-m); }
  .disc-ok:hover{ box-shadow:var(--sh-l); }

  /* --- 2026 カード＝ボタン化 --- */
  .tl-item--warp{ cursor:pointer; }
  .tl-item--warp .tl-card{ transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
  .tl-item--warp:hover .tl-card, .tl-item--warp:focus-visible .tl-card{
    transform:translateY(-8px) scale(1.015); box-shadow:0 30px 64px rgba(235,0,135,.30); }
  .tl-item--warp:focus-visible{ outline:none; }
  .tl-link--warp{ color:var(--mag); }

  /* --- ワープ演出：ハイパースペース（虹色・高密度・セクション中心から発火）--- */
  .hist-root{ transform-origin:50% 50%; }
  .hist-root.is-warping{ animation:w-fade 1.45s cubic-bezier(.55,0,.8,.4) forwards; }
  @keyframes w-fade{
    0%{opacity:1; transform:scale(1); filter:blur(0);}
    40%{opacity:.9; transform:scale(1.14); filter:blur(1px);}
    100%{opacity:0; transform:scale(1.6); filter:blur(10px);}
  }

  .warp{ position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:0; overflow:hidden; background:transparent; }
  .warp.is-on{ opacity:1; pointer-events:auto; transition:opacity .18s ease; }
  .warp__canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }

  /* 最後に画面を覆う白フラッシュ（次ページへシームレスに） */
  .warp__flash{ position:absolute; inset:0; background:#fff; opacity:0; }
  .warp.is-on .warp__flash{ animation:w-flash 1.45s ease-in forwards; }
  @keyframes w-flash{ 0%,80%{opacity:0;} 100%{opacity:1;} }

  @media (prefers-reduced-motion: reduce){
    .hist-root.is-warping{ animation:none; opacity:.2; }
    .warp__flash{ animation:none !important; opacity:.9; }
  }

