/* 指導案の共通スタイル。先生が印刷して職員室で回せることを最優先にした。
   紙は白、字は黒、A4縦。画面で読むときも同じ見た目にする（別レイアウトを作らない＝ズレが起きない）。
   ★2026-08-16 文字の基準を /enecra に合わせて全体を引き上げた（TAKURO「文字が全体的に小さい」）。
     ・ルートの拡大則も /enecra と同じ＝広い画面では文字ごと少し大きくなる
     ・スマホ側で文字を「さらに小さくする」旧指定は廃止（余白だけ詰める） */
  :root{ --ink:#1b1b1d; --sub:#5a5a60; --line:#d6d3cc; --accent:#8a6d1f; --paper:#fbfaf7; }
  *{margin:0;padding:0;box-sizing:border-box}
  html{font-size:16px;-webkit-text-size-adjust:100%}
  @media (min-width:1440px){ html{font-size:max(16px,0.6944vw)} }  /* /enecra と同じ拡大則 */
  body{font-family:"Noto Sans JP",sans-serif;color:var(--ink);background:#eeebe4;line-height:1.95;
    font-feature-settings:"palt"}
  /* rem基準＝広い画面ではルートと一緒に育つ。920pxは1行が読みやすい上限 */
  .sheet{max-width:57.5rem;margin:0 auto;background:var(--paper);padding:56px 56px 72px;
    box-shadow:0 2px 24px rgba(0,0,0,.08)}

  header{border-bottom:3px solid var(--ink);padding-bottom:22px;margin-bottom:32px}
  .kick{font-size:.85rem;letter-spacing:.3em;color:var(--accent);font-weight:700}
  h1{font-family:"Shippori Mincho",serif;font-size:1.9rem;line-height:1.5;margin:.5rem 0 .7rem;font-weight:700}
  .meta{font-size:1.0063rem;color:var(--sub);line-height:2}
  .meta b{color:var(--ink)}
  .free{display:inline-block;margin-top:14px;font-size:.9313rem;font-weight:700;letter-spacing:.08em;
    border:1px solid var(--accent);color:var(--accent);border-radius:4px;padding:4px 12px}

  /* ★2026-08-18 PDFのダウンロード。
     きっかけ＝東浦中の加藤先生が学校の業務用PCからこのページを開けなかった（後藤さん経由の報告）。
     開けた先生はその場で紙に落とせるように、開けない先生には同じPDFをメールで送れるようにする。
     ⚠ URLはASCIIにしてある。日本語ファイル名はURLでパーセント符号化されて長くなり、
        校内のプロキシ・フィルタで落ちることがある。保存されるときの名前だけ download 属性で日本語に戻す。
     ⚠ 紙には出さない（.noprint）。印刷した紙の上ではクリックできない。 */
  .pdfdl{display:inline-block;margin-top:14px;margin-left:10px;font-size:.9313rem;font-weight:700;
    letter-spacing:.05em;background:var(--ink);color:var(--paper);border-radius:4px;padding:5px 14px;
    text-decoration:none;vertical-align:top}
  .pdfdl:hover{background:var(--accent)}

  /* 一覧ページのダウンロード節。8本を1か所にまとめて置く（職員室でまとめて配れるように） */
  /* ★min(20rem,100%) にしてある。minmax(20rem,1fr) だと、画面が20remより狭い端末
     （幅320pxのスマホ＝.sheet の内寸284px）でトラックが20remのまま残り、ページごと横に
     はみ出してスクロールする。100% を下限に噛ませると、狭いときは画面幅まで縮む。 */
  .pdflist{list-style:none;margin:12px 0 0;display:grid;gap:8px;
    grid-template-columns:repeat(auto-fill,minmax(min(20rem,100%),1fr))}
  .pdflist li{margin:0}
  .pdflist a{display:block;border:1px solid var(--line);border-radius:4px;padding:9px 13px;
    background:#fff;color:var(--ink);text-decoration:none;font-size:.9688rem;font-weight:700}
  .pdflist a:hover{border-color:var(--accent);color:var(--accent)}
  .pdflist .sub{display:block;font-weight:400;font-size:.875rem;color:var(--sub)}

  /* ★2026-09-01 一覧ページの導入の呼びかけ。指導案より前に置く（＝先生が止まるのは指導案の中身より
     手前の「そもそも入れられるのか」なので、そこに先に答える）。紙にも出す＝noprintを付けない。 */
  .setupcall{border:2px solid var(--ink);border-radius:6px;padding:14px 18px;margin:26px 0 6px;background:#fdfaf1}
  /* ★「> b」で直下だけに限る。b だけだと本文中の強調まで block になり、
     「…追加費用ゼロ」で改行して次の行が読点から始まった（2026-09-01 実機で発見） */
  .setupcall > b{display:block;font-family:"Shippori Mincho",serif;font-size:1.14rem;margin-bottom:5px}
  .setupcall span{display:block;font-size:.98rem}
  .setupcall a{display:inline-block;margin-top:9px;font-weight:700;color:var(--accent)}

  h2{font-family:"Shippori Mincho",serif;font-size:1.35rem;margin:40px 0 14px;padding-left:12px;
    border-left:5px solid var(--accent);font-weight:700}
  h3{font-size:1.1rem;margin:22px 0 8px;font-weight:700}
  p{margin-bottom:12px;font-size:1.0437rem}
  ul,ol{margin:0 0 14px 1.4em;font-size:1.0437rem}
  li{margin-bottom:5px}
  .note{background:#f2efe7;border-left:3px solid var(--line);padding:12px 16px;font-size:.9688rem;
    color:var(--sub);margin:14px 0}
  .note b{color:var(--ink)}

  table{width:100%;border-collapse:collapse;margin:12px 0 18px;font-size:.9688rem}
  th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
  th{background:#efece4;font-weight:700;white-space:nowrap}
  td.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
  caption{text-align:left;font-size:.9313rem;color:var(--sub);margin-bottom:6px}

  .flow th:nth-child(1){width:5.5em}
  .flow th:nth-child(2){width:3.4em}
  .flow td:nth-child(2){text-align:center;white-space:nowrap}
  .flow td:nth-child(4){width:32%;font-size:.9375rem;color:var(--sub)}
  .q{background:#fdf6e0;border:1px solid #e6d79a;padding:10px 14px;font-weight:700;margin:10px 0}

  footer{margin-top:56px;padding-top:22px;border-top:1px solid var(--line);
    font-size:.9313rem;color:var(--sub);line-height:2}
  footer a{color:var(--accent)}
  .backlink{display:inline-block;margin-top:10px;font-weight:700}

  @media print{
    body{background:#fff}
    .sheet{box-shadow:none;max-width:none;padding:0 12mm}
    h2{page-break-after:avoid}
    table{page-break-inside:avoid}
    /* ★展開の表だけは大きすぎて1ページに入らない（2026-08-08 実測：6ページ中2ページをまたぐ）。
       avoid のままだと入らないまま次ページへ送られ、手前に大きな空白ができる。
       表としては割れてよく、割れて困るのは【行の途中】なので、そこだけ止める。 */
    table.flow{page-break-inside:auto}
    table.flow tr{page-break-inside:avoid}
    table.flow thead{display:table-header-group}   /* 各ページの先頭に見出し行を出す */
    /* 注釈の箱が2ページに割れると読めない */
    .note,.q{page-break-inside:avoid}
    .noprint{display:none}
    /* ★フッターは印刷でも残す（2026-08-08）。ここに Minecraft の表記と連絡先が入っている。
       以前は <footer class="noprint"> で、紙にすると規約の表記ごと消えていた。
       消すのは紙の上でクリックできない戻りリンクだけ。 */
    footer{margin-top:32px;padding-top:14px;page-break-inside:avoid}
    footer a{color:var(--ink);text-decoration:none}
  }
  /* スマホ＝余白だけ詰める。文字は小さくしない（2026-08-16・/enecra と同じ考え方）。
     表だけは幅が入らないので、枠の中で横スクロールできる形は各ページ側の実装に任せる */
  @media(max-width:767px){
    .sheet{padding:30px 18px 44px}
    h1{font-size:1.5rem}
    th,td{padding:6px 7px}
  }
