/* CwC Tokyo 2026 — 予習教材 共通スタイル (R1a)
   デザイントークンはセッションプランナー(index.html)から移植し、視覚トーンを統一する。 */
:root{
  --bg:#ffffff;--sf:#f7f6f3;--sf2:#f0efe9;--sf3:#e9e7df;
  --tx:#181816;--tx2:#5a5955;--tx3:#9a9890;
  --bd:rgba(0,0,0,0.10);--bd2:rgba(0,0,0,0.18);
  --teal:#1D9E75;--teal-l:#E1F5EE;--teal-d:#085041;--teal-m:#0F6E56;
  --purple:#7F77DD;--purple-l:#EEEDFE;--purple-d:#3C3489;--purple-m:#534AB7;
  --coral:#D85A30;--coral-l:#FAECE7;--coral-d:#712B13;--coral-m:#993C1D;
  --r:10px;
  --shadow:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#161614;--sf:#202020;--sf2:#282826;--sf3:#323230;
    --tx:#eeede6;--tx2:#b0aea6;--tx3:#6c6a62;
    --bd:rgba(255,255,255,0.09);--bd2:rgba(255,255,255,0.18);
    --shadow:0 1px 3px rgba(0,0,0,0.3);
  }
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--bg);color:var(--tx);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,system-ui,sans-serif;
  line-height:1.7;-webkit-font-smoothing:antialiased;
}
a{color:var(--coral-m);}
.tier-must{--c:var(--coral);--cl:var(--coral-l);--cd:var(--coral-d);--cm:var(--coral-m);}
.tier-high{--c:var(--teal);--cl:var(--teal-l);--cd:var(--teal-d);--cm:var(--teal-m);}
.tier-opt{--c:var(--purple);--cl:var(--purple-l);--cd:var(--purple-d);--cm:var(--purple-m);}

/* ---- top nav ---- */
.nav{
  position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 18px;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:0.5px solid var(--bd);
}
.nav a.navlink{
  display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;text-decoration:none;
  color:var(--tx2);padding:6px 11px;border-radius:8px;border:0.5px solid var(--bd);background:var(--sf);
  min-height:32px;transition:all .12s;
}
.nav a.navlink:hover{background:var(--sf2);color:var(--tx);}
.nav .nav-sp{flex:1;}
.nav .ti{font-size:15px;}

/* ---- layout ---- */
.wrap{max-width:760px;margin:0 auto;padding:26px 20px 64px;}
.eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cm,var(--coral-m));display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.badge{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--cl,var(--coral-l));color:var(--cd,var(--coral-d));letter-spacing:.02em;text-transform:none;}
h1.page-t{font-size:25px;line-height:1.3;font-weight:700;margin:12px 0 6px;letter-spacing:-0.01em;}
.lead{font-size:14px;color:var(--tx2);margin:0 0 8px;}

.sec{margin-top:30px;}
.sec-h{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:700;margin:0 0 12px;padding-bottom:8px;border-bottom:2px solid var(--bd);}
.sec-h .ti{font-size:18px;color:var(--coral-m);}
.sec-h .mini{margin-left:auto;font-size:11px;font-weight:600;color:var(--tx3);display:inline-flex;align-items:center;gap:4px;border:0.5px solid var(--bd);border-radius:20px;padding:2px 9px;}
.intro p{font-size:14.5px;line-height:1.85;margin:0 0 12px;color:var(--tx);}
.intro strong{font-weight:700;color:var(--coral-d);}

/* ---- vocab table → responsive cards（#3 視覚階層 / #9 モバイル圧縮）---- */
.vocab{width:100%;border-collapse:collapse;font-size:13px;}
.vocab th,.vocab td{border:0.5px solid var(--bd);padding:9px 11px;text-align:left;vertical-align:top;}
.vocab thead th{background:var(--sf2);font-weight:700;color:var(--tx2);font-size:11.5px;white-space:nowrap;}
.vocab thead th.th-sub{font-weight:600;color:var(--tx3);}
.vocab .term{font-weight:700;color:var(--tx);font-size:14px;}
.vocab .v-talk{color:var(--tx);}                  /* 主役：講演文脈での意味 */
.vocab .v-gen{color:var(--tx2);font-size:12px;}   /* 従：一般的な意味 */
.vocab .v-root{color:var(--tx3);font-size:11.5px;}/* 従：語源・由来 */
.vocab tbody tr:nth-child(odd){background:var(--sf);}
@media (max-width:720px){
  .vocab,.vocab tbody,.vocab tr,.vocab td{display:block;width:100%;}
  .vocab thead{display:none;}
  .vocab tbody tr{border:0.5px solid var(--bd);border-radius:11px;margin-bottom:9px;padding:10px 13px;background:var(--sf);}
  .vocab tbody tr:nth-child(odd){background:var(--sf);}
  .vocab td{border:none;padding:2px 0;}
  .vocab td.term-cell{font-size:16px;padding:0 0 3px;}
  .vocab td.v-talk{font-size:13.5px;color:var(--tx);}
  .vocab td.v-gen,.vocab td.v-root{font-size:11.5px;color:var(--tx3);}
  .vocab td.is-empty{display:none;}               /* 空欄はモバイルで非表示 */
  .vocab td.v-talk[data-label]:before{content:none;} /* 主役は用語直下の定義として見せる */
  .vocab td[data-label]:before{content:attr(data-label);display:block;font-size:10px;font-weight:700;color:var(--tx3);letter-spacing:.03em;margin-bottom:0;}
}

/* ---- passage / translation / sources ---- */
.passage{border:0.5px solid var(--bd);border-radius:12px;padding:16px 18px;background:var(--sf);font-size:14.5px;line-height:1.85;}
.passage.en{font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;}
.passage strong{font-weight:700;color:var(--coral-d);}
.passage-lab{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--tx3);margin:0;}
.passage.ja{margin-top:8px;background:var(--sf2);}
.passage.ja.ja-hidden{display:none;}
/* 訳トグル（#1・既定=表示） */
.ja-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 0;}
.ja-toggle{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--coral-m);background:transparent;border:0.5px solid var(--bd2);border-radius:7px;padding:4px 10px;cursor:pointer;transition:background .12s,color .12s,border-color .12s;-webkit-tap-highlight-color:transparent;}
.ja-toggle:hover{background:var(--coral-l);border-color:var(--coral);color:var(--coral-d);}
.ja-toggle .ti{font-size:14px;}
/* 出典（#5・名前リンク＋ドメインのみ＋控えめ開閉） */
.sources-wrap{margin-top:16px;}
.sources-sum{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--tx3);cursor:pointer;list-style:none;padding:6px 0;}
.sources-sum::-webkit-details-marker{display:none;}
.sources-sum .ti{font-size:14px;}
.sources-sum .sources-c{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:17px;padding:0 5px;border-radius:9px;background:var(--sf3);color:var(--tx2);font-size:10.5px;}
.sources-sum:hover{color:var(--tx2);}
.sources{list-style:none;margin:6px 0 0;padding:0;font-size:12.5px;}
.sources li{border-bottom:0.5px solid var(--bd);}
.sources li:last-child{border-bottom:none;}
.src-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;padding:8px 4px;text-decoration:none;color:var(--tx2);line-height:1.5;border-radius:6px;}
a.src-row:hover{background:var(--sf);}
a.src-row:hover .src-n{color:var(--coral-d);}
.src-n{font-weight:600;color:var(--tx);}
.src-k{font-size:10.5px;color:var(--tx3);}
.src-d{margin-left:auto;display:inline-flex;align-items:center;gap:3px;font-size:11px;color:var(--tx3);white-space:nowrap;}
.src-d .ti{font-size:12px;}

/* ---- talks (この講演を聞くなら覚える単語) ---- */
.talks-intro{font-size:13px;color:var(--tx2);margin:0 0 14px;}
.talks-back{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--coral-m);text-decoration:none;}
.talks-grp{margin-top:10px;border-top:0.5px solid var(--bd);}
.talks-grp:last-of-type{border-bottom:0.5px solid var(--bd);}
.talks-grp-h{list-style:none;font-size:12.5px;font-weight:700;color:var(--tx2);display:flex;align-items:center;gap:8px;padding:11px 0;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.talks-grp-h::-webkit-details-marker{display:none;}
.talks-grp-l{display:flex;align-items:center;gap:7px;min-width:0;flex:1;}
.talks-grp-l .ti{font-size:15px;color:var(--coral-m);flex-shrink:0;}/* 単色＋塗りの濃淡でスケール表現（#8） */
.talks-count{font-size:10.5px;font-weight:700;color:var(--tx3);background:var(--sf2);border:0.5px solid var(--bd);border-radius:999px;padding:1px 7px;line-height:1.5;white-space:nowrap;}
.talks-chev{font-size:15px;color:var(--tx3);transition:transform .15s;flex-shrink:0;}
.talks-grp[open] .talks-chev{transform:rotate(180deg);}
.talks-list{padding:0 0 8px;}
.talk{display:grid;grid-template-columns:minmax(112px,auto) minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 0;border-top:0.5px solid var(--bd);background:transparent;}
.talk-meta{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-width:0;}
/* 日付＋時刻：メイン数値情報として前面へ */
.talk-time{display:inline-flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums;}
.talk-date{font-size:11px;font-weight:700;color:var(--tx3);letter-spacing:.02em;}
.talk-clock{font-size:12px;font-weight:700;color:var(--tx2);}
/* ステージピル */
.talk-stg{display:inline-flex;align-items:center;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:4px;letter-spacing:.01em;white-space:nowrap;}
.stg-main  {background:var(--teal-l);color:var(--teal-d);}
.stg-brk   {background:var(--purple-l);color:var(--purple-d);}
.stg-ws    {background:var(--coral-l);color:var(--coral-d);}
.stg-rec   {background:var(--sf3);color:var(--tx2);}
/* タイトル: 主役 */
.talk-ttl{font-size:12.5px;font-weight:600;color:var(--tx);line-height:1.45;min-width:0;}
.talk-body{display:contents;}
.talk-plan{min-height:26px;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:0.5px solid var(--bd2);border-radius:7px;background:var(--bg);color:var(--tx3);font-size:10.5px;font-weight:700;line-height:1;padding:0 8px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s,border-color .12s,color .12s;white-space:nowrap;}
.talk-plan .ti{font-size:13px;}
.talk-plan:hover{background:var(--coral-l);}
.talk-plan.on{background:var(--coral);border-color:var(--coral);color:#fff;}
/* 参考録画: メタ全体を少し淡く */
.talk-rec .talk-ttl{color:var(--tx2);}
@media (max-width:720px){
  .talks-grp-h{padding:12px 0;}
  .talk{grid-template-columns:1fr auto;gap:5px 8px;padding:9px 0;}
  .talk-meta{grid-column:1 / -1;}
  .talk-clock{font-size:12.5px;}
  .talk-ttl{font-size:13px;}
  .talk-plan{grid-column:2;grid-row:2;}
}

/* ---- hub (index) ---- */
.hub-lead{font-size:14px;color:var(--tx2);margin:6px 0 4px;}
.tier{margin-top:26px;}
.tier-lab{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;margin:0 0 4px;}
.tier-lab .pill{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:20px;background:var(--cl);color:var(--cd);}
.tier-sub{font-size:12px;color:var(--tx3);margin:0 0 12px;}
.topics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.tcard{display:flex;flex-direction:column;gap:5px;border:0.5px solid var(--bd);border-left:3px solid var(--c,var(--coral));border-radius:12px;padding:14px 16px;background:var(--sf);text-decoration:none;color:inherit;box-shadow:var(--shadow);transition:transform .12s,background .12s;}
.tcard:hover{transform:translateY(-2px);background:var(--sf2);}
.tcard-no{font-size:11px;font-weight:700;color:var(--cm,var(--coral-m));letter-spacing:.04em;}
.tcard-t{font-size:15px;font-weight:700;line-height:1.35;color:var(--tx);}
.tcard-sum{font-size:12.5px;color:var(--tx2);line-height:1.55;}
@media (max-width:720px){.topics{grid-template-columns:1fr;}}

/* ---- footer ---- */
.foot{max-width:760px;margin:40px auto 0;padding:18px 20px 40px;border-top:0.5px solid var(--bd);font-size:11.5px;line-height:1.7;color:var(--tx3);}
.foot .note{display:flex;gap:7px;align-items:flex-start;margin-top:8px;}
.foot .ti{font-size:14px;flex-shrink:0;margin-top:1px;}
.foot a{color:var(--tx2);}

/* ---- 単語チェック (R1b) ---- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.th-ck{width:44px;}
.vocab td.ck-cell{width:44px;text-align:center;padding:6px;}
.vck{position:relative;width:26px;height:26px;border-radius:50%;border:1.6px solid var(--bd2);background:var(--bg);color:var(--tx3);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background .12s,border-color .12s,color .12s;-webkit-tap-highlight-color:transparent;}
.vck::after{content:"";position:absolute;inset:-9px;}/* タップ領域を44px相当へ拡張 */
.vck .ti{font-size:14px;}
.vck:hover{border-color:var(--coral);color:var(--coral-m);}
.vck.on{background:var(--coral);border-color:var(--coral);color:#fff;}/* 保存済み（#6 bookmark） */
.vocab tbody tr.ck-on{background:var(--coral-l);}
.vocab tbody tr.ck-on:nth-child(odd){background:var(--coral-l);}
.vcount{display:inline-flex;align-items:center;gap:5px;}
.vcount .ti{font-size:13px;color:var(--coral-m);}
.vcount-n{font-variant-numeric:tabular-nums;font-weight:700;color:var(--coral-d);}
.vocab-hint{font-size:12px;color:var(--tx3);margin:0 0 10px;display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.vocab-hint .ti{font-size:14px;color:var(--coral-m);}
@media (max-width:720px){
  .vocab tbody tr{position:relative;padding-right:48px;}
  .vocab td.ck-cell{position:absolute;top:9px;right:9px;width:auto;padding:0;}
  .vck{width:32px;height:32px;}
  .vck::after{inset:-6px;}
}

/* ---- ハブ進捗 ---- */
.tcard-prog{margin-top:auto;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--tx3);padding-top:4px;}
.tcard-prog .ti{font-size:13px;color:var(--cm,var(--coral-m));}
.tcard-prog .p-n{font-variant-numeric:tabular-nums;color:var(--cd,var(--coral-d));font-weight:700;}

/* ---- マイ単語 (R1b) ---- */
.mywords{margin-top:10px;}
.mw-empty{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:26px 18px;border:1px dashed var(--bd2);border-radius:12px;color:var(--tx2);font-size:13.5px;background:var(--sf);}
.mw-empty .ti{font-size:22px;color:var(--tx3);}
.mw-empty-cta{margin-top:4px;font-weight:600;}
.mw-grp{margin-top:20px;}
.mw-grp-h{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;padding-bottom:6px;border-bottom:2px solid var(--bd);}
.mw-grp-no{font-size:11px;font-weight:700;color:var(--coral-m);letter-spacing:.03em;}
.mw-grp-c{margin-left:auto;font-size:11px;font-weight:600;color:var(--tx3);}
.mw-row{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:0.5px solid var(--bd);}
.mw-main{flex:1;min-width:0;}
.mw-term{font-weight:700;font-size:14.5px;color:var(--tx);margin-right:8px;}
.mw-mean{font-size:12.5px;color:var(--tx2);}
.mw-rm{flex-shrink:0;width:30px;height:30px;border-radius:50%;border:0.5px solid var(--bd);background:var(--sf);color:var(--tx3);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .12s;-webkit-tap-highlight-color:transparent;}
.mw-rm:hover{background:var(--coral-l);color:var(--coral-d);border-color:var(--coral);}
.mw-rm .ti{font-size:16px;}
@media (max-width:720px){.mw-term{display:block;margin:0 0 2px;}}

/* ---- マイ単語 書き出し (R1c) ---- */
.mw-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px;}
.mw-btn{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--coral-d);background:var(--coral-l);border:0.5px solid var(--bd2);border-radius:9px;padding:8px 14px;min-height:38px;cursor:pointer;transition:background .12s,color .12s,border-color .12s;-webkit-tap-highlight-color:transparent;}
.mw-btn:hover:not(:disabled){background:var(--coral);border-color:var(--coral);color:#fff;}
.mw-btn:disabled{opacity:.45;cursor:not-allowed;}
.mw-btn .ti{font-size:16px;}

/* ---- 印刷 / PDF（マイ単語をきれいに紙へ）---- */
@media print{
  .nav,.mw-actions,.mw-rm,.foot .note,.eyebrow{display:none!important;}
  html,body{background:#fff!important;color:#111!important;}
  .wrap{max-width:none;margin:0;padding:6mm 4mm;}
  h1.page-t{color:#111!important;}
  .hub-lead{color:#444!important;}
  .mw-grp{break-inside:avoid;}
  .mw-grp-h{border-color:#000!important;color:#111!important;}
  .mw-grp-no{color:#8a2a12!important;}
  .mw-grp-c{color:#555!important;}
  .mw-row{border-color:#ccc!important;break-inside:avoid;}
  .mw-term{color:#111!important;}
  .mw-mean{color:#333!important;}
  .foot{border-color:#ccc!important;color:#666!important;margin-top:10mm;}
  .foot a{color:#666!important;}
}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){*{transition:none!important;}}