/* 原石工房 / つなぎびと ── Logic9 の配色をそのまま使う
   生成り70 #F8F5EE ／ 墨25 #3E3B39 ／ 萌黄5 #A9D159（罫線一本だけ）／ 常磐 #006428
   光沢・グラデーション・冷たい直線・蛍光色は使わない */

:root{
  --kinari:#F8F5EE;
  --kinari-fuka:#F2EEE4;   /* ごく浅い差。面を分けるときだけ */
  --sumi:#3E3B39;
  --sumi-usu:#6E6A66;
  --moegi:#A9D159;
  --tokiwa:#006428;
  --maxw:780px;            /* 文字を大きくした分だけ広げる。1行の字数は変えない */
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;overflow-x:hidden;}

body{
  margin:0;
  background:var(--kinari);
  color:var(--sumi);
  font-family:"Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight:300;
  font-size:19px;
  line-height:2.05;          /* 間をとる */
  letter-spacing:.04em;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block;}
/* 長いメールアドレス・URLで横スクロールが出ないようにする */
body{overflow-wrap:anywhere;word-break:normal;}
a{color:var(--sumi);text-decoration:none;border-bottom:1px solid rgba(62,59,57,.25);transition:border-color .3s;}
a:hover{border-bottom-color:var(--tokiwa);}

/* ---- 見出し。Yuji Boku は要所だけ（本人：控えめにして要所でのみ） ----
   ラテン文字は筆書体だと字形が崩れて読めないので、明朝に逃がす
   （06_道具箱/CLAUDE.md「AIなどのラテン文字はかすれにしない」と同じ扱い） */
@font-face{
  font-family:"FudeAscii";
  src:local("Hiragino Mincho ProN"), local("HiraMinProN-W3"), local("Yu Mincho"),
      local("YuMincho"), local("MS PMincho"), local("Times New Roman"), local("Georgia");
  unicode-range:U+0020-024F, U+2000-206F, U+FF01-FF5E;
}
.fude{font-family:"FudeAscii", "Yuji Boku", serif;font-weight:400;letter-spacing:.10em;line-height:1.7;}

/* ---- ヘッダー：滞在させない門なので、極力静か ---- */
header.gate{
  position:sticky;top:0;z-index:10;
  background:rgba(248,245,238,.92);
  backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 6vw;
}
header.gate .sign img{width:230px;opacity:.9;}
header.gate nav{display:flex;gap:1.9em;font-size:15.5px;letter-spacing:.08em;}
header.gate nav a{border-bottom:none;color:var(--sumi-usu);}
header.gate nav a:hover,header.gate nav a[aria-current="page"]{color:var(--sumi);}
header.gate .sign{border-bottom:none;}   /* ロゴの下にリンクの下線を出さない */

/* 言語の切り替え（2026-09-03 試験導入）。案内の末尾に小さく置く。いまの言語だけ墨 */
header.gate nav .lang{font-size:13.5px;letter-spacing:.12em;color:var(--sumi-usu);white-space:nowrap;}
header.gate nav .lang .sep{margin:0 .5em;opacity:.45;}
header.gate nav .lang a.on{color:var(--sumi);}

/* 英語ページ：ラテン文字は字間を詰め、少し太らせて読みやすく */
html[lang="en"] body{letter-spacing:0;line-height:1.9;font-weight:400;}
html[lang="en"] .fude{letter-spacing:.04em;}
html[lang="en"] .hitokoto{font-size:clamp(22px,3.2vw,32px);line-height:1.8;}
html[lang="en"] .iriguchi h3{letter-spacing:.04em;}

/* ---- 画面。1画面1要素・余白6割 ---- */
section{
  padding:19vh 6vw;
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
}
section > *{max-width:var(--maxw);}

.hero{min-height:92vh;justify-content:center;padding-top:8vh;}
.hero img{width:min(640px,82vw);}

/* 一行だけ置く画面 */
.hitokoto{font-size:clamp(24px,3.6vw,36px);line-height:2.2;}

h1.fude,h2.fude{font-size:clamp(25px,3.1vw,33px);margin:0 0 1.6em;}
.hero-h1{margin:0;line-height:0;}          /* トップの h1 はロゴ画像そのもの */
.hero-h1 img{width:min(640px,82vw);}
main{display:block;}
p{margin:0 0 1.5em;}
p:last-child{margin-bottom:0;}

/* 萌黄の罫線は1ページに一本だけ。「見つけてもらう色」 */
.rule{width:56px;height:0;border-top:2px solid var(--moegi);margin:0 auto 3.2em;}

/* 次へ行く案内。ボタンにしない（門に商品棚を置かない） */
.michi{margin-top:2.8em;font-size:17px;letter-spacing:.09em;}
.michi a{border-bottom:1px solid rgba(62,59,57,.3);padding-bottom:.25em;}

/* 3つの入口 */
.iriguchi{display:flex;flex-wrap:wrap;gap:3.4em;justify-content:center;max-width:var(--maxw);}
.iriguchi div{flex:1 1 190px;}
.iriguchi h3{font-family:"FudeAscii","Yuji Boku",serif;font-weight:400;font-size:22px;letter-spacing:.1em;margin:0 0 .8em;}
.iriguchi p{font-size:16.5px;line-height:1.95;color:var(--sumi-usu);}

/* 本文が続くページ（プロフィール等）は左寄せに戻し、行頭を揃える
   （flexのままだと段落ごとに幅が変わって、行頭が段ごとにずれる） */
.fumi{text-align:left;}
.fumi > *{width:100%;}       /* flexで中央に寄る。幅の上限は section > * の720px */
.fumi h2.fude{text-align:center;}
.fumi .rule{width:56px;}     /* 罫線だけは短いまま中央に */
.fumi h2.fude{text-align:center;}
.fumi h3{font-size:17px;font-weight:500;letter-spacing:.08em;margin:2.4em 0 .8em;}
.fumi dl{margin:0;}
.fumi dt{font-size:15.5px;letter-spacing:.1em;color:var(--sumi-usu);margin-top:2.4em;}
.fumi dd{margin:.5em 0 0;}
.fumi ul{padding-left:1.2em;margin:0;}
.fumi li{margin-bottom:.5em;}

/* 発信の一覧。表を使わず、縦に並べる */
.mado{width:100%;max-width:var(--maxw);text-align:left;}
.mado a.item{
  display:block;border-bottom:1px solid rgba(62,59,57,.14);
  padding:1.7em 0;
}
.mado a.item:hover{border-bottom-color:var(--tokiwa);}
.mado .name{font-size:19.5px;font-weight:500;letter-spacing:.06em;}
.mado .note{display:block;font-size:16px;color:var(--sumi-usu);margin-top:.55em;line-height:1.9;}

/* ---- 表札（フッター）＝ここが身分証。Googleが読む場所 ---- */
footer.hyousatsu{
  background:var(--kinari-fuka);
  padding:11vh 6vw 7vh;
  font-size:15.5px;line-height:2.1;color:var(--sumi-usu);
}
footer.hyousatsu .inner{max-width:var(--maxw);margin:0 auto;}
footer.hyousatsu img.mark{width:260px;opacity:.85;margin-bottom:2.6em;}
footer.hyousatsu .nap div{margin-bottom:.2em;}
footer.hyousatsu .nap .yago{color:var(--sumi);font-size:17px;letter-spacing:.06em;}
footer.hyousatsu .sameas{margin-top:2.8em;display:flex;flex-wrap:wrap;gap:.7em 1.6em;}
footer.hyousatsu .sameas a{border-bottom:none;color:var(--sumi-usu);}
footer.hyousatsu .sameas a:hover{color:var(--tokiwa);}
footer.hyousatsu .hou{margin-top:3.4em;font-size:14.5px;}
footer.hyousatsu .hou a{border-bottom:none;margin-right:1.4em;}
footer.hyousatsu .copy{margin-top:2.4em;font-size:13.5px;letter-spacing:.06em;}

/* ---- スマホ（〜600px）---- */
@media(max-width:600px){
  body{font-size:18px;line-height:2.0;}
  section{padding:11vh 7vw;}

  /* ヘッダー：ロゴと案内を上下2段にして、横に詰め込まない */
  header.gate{flex-direction:column;align-items:center;gap:.9em;padding:14px 5vw 12px;}
  header.gate .sign img{width:170px;}
  header.gate nav{width:100%;gap:1em;font-size:14px;flex-wrap:wrap;justify-content:center;}

  .hero{min-height:82vh;}
  .hitokoto{line-height:2.1;}

  /* 3つの入口は横に並べず、縦に積む */
  .iriguchi{flex-direction:column;gap:2.8em;}
  .iriguchi div{flex:1 1 auto;}

  .mado .name{font-size:18.5px;}
  .mado .note{font-size:15.5px;}
  footer.hyousatsu{padding:9vh 7vw 6vh;font-size:15px;}
  footer.hyousatsu .sameas{gap:.5em 1.2em;}
}

/* 横幅の狭い端末（〜370px。iPhone SE など）*/
@media(max-width:370px){
  body{font-size:17px;}
  header.gate nav{font-size:13px;gap:.85em;}
  .hero img{width:80vw;}
}

/* 内側のページの1画面目。書き出しの一拍は残しつつ、空きすぎないように */
section.haji{padding-top:12vh;}
@media(max-width:600px){section.haji{padding-top:9vh;}}

/* 略歴・定義文（AI対策 2026-09-03）。三人称の一段落。地を少しだけ変えて区切る */
.ryakureki{background:var(--kinari-fuka);padding:1.4em 1.6em;font-size:16.5px;line-height:1.95;
           color:var(--sumi-usu);margin:0 0 2.4em;}
/* よく聞かれること：問いを見出し扱いに */
.toi dt{font-size:19px;color:var(--sumi);letter-spacing:.05em;margin-top:2.6em;}
.toi dd{margin:.6em 0 0;}
.toi dd p{color:var(--sumi-usu);font-size:17.5px;line-height:1.95;}
@media(max-width:600px){ .ryakureki{padding:1.2em 1.2em;font-size:15.5px;} .toi dt{font-size:18px;} }

/* ---- 肖像（プロフィール）。円く抜く。2026-09-03 本人指示で一回り大きく ---- */
.portrait{
  width:190px;height:190px;
  border-radius:50%;
  object-fit:cover;
  margin:0 auto 3.4em;
  /* 生成りの地に馴染ませる。枠線は引かない（冷たい直線を避ける） */
  box-shadow:0 0 0 1px rgba(62,59,57,.06);
}
@media(max-width:600px){ .portrait{width:150px;height:150px;margin-bottom:2.4em;} }

/* ---- 文章を数える（kazoeru.html）2026-09-03 ---- */
.kazo textarea{width:100%;min-height:9em;font:inherit;font-size:17px;line-height:1.9;padding:.8em;border:1px solid rgba(62,59,57,.3);background:#fff;border-radius:2px;color:var(--sumi);}
.kazo button{font:inherit;font-size:17px;letter-spacing:.12em;padding:.55em 1.6em;background:transparent;border:1px solid var(--sumi);color:var(--sumi);cursor:pointer;margin-top:1em;border-radius:2px;}
.kazo button:hover{border-color:var(--tokiwa);color:var(--tokiwa);}
.kazo .row{margin:1.8em 0 1.2em;}
.kazo .row h4{margin:0 0 .5em;font-weight:500;font-size:17px;letter-spacing:.06em;}
.kazo .bar{display:grid;grid-template-columns:4.5em 1fr 4.5em;align-items:center;gap:.7em;font-size:15.5px;color:var(--sumi-usu);margin:.15em 0;}
.kazo .bar i{display:block;height:.65em;background:rgba(62,59,57,.22);}
.kazo .bar.you{color:var(--sumi);}
.kazo .bar.you i{background:var(--tokiwa);}
.kazo .yomi{font-size:16px;color:var(--sumi);margin:.4em 0 0;}
.kazo .card{border:1px solid rgba(62,59,57,.25);padding:1em 1.1em;margin:.8em 0;cursor:pointer;background:#fff;font-size:16px;line-height:1.9;white-space:pre-line;border-radius:2px;}
.kazo .card:hover{border-color:var(--tokiwa);}
.kazo .card.done{cursor:default;}
.kazo .card.done.me{border-color:var(--tokiwa);border-width:2px;}
.kazo .ans{font-size:15.5px;color:var(--sumi-usu);margin:.4em 0 1.6em;white-space:pre-line;}
.kazo .waku{border-top:1px solid rgba(62,59,57,.2);padding-top:1em;font-size:15.5px;color:var(--sumi-usu);}
.kazo .toi{font-size:17px;margin:1.6em 0 .2em;}
.kazo .kekka{margin-top:.6em;}
.kazo .chiisai{font-size:15px;color:var(--sumi-usu);}
/* v2：印・助言・定規・比較・共有 */
.kazo .midashi{font-size:18px;line-height:1.9;margin:1.2em 0 1em;}
.kazo .honbun{background:#fff;border:1px solid rgba(62,59,57,.2);padding:1em 1.1em;font-size:16px;line-height:2;border-radius:2px;}
.kazo mark{background:transparent;padding:0 .05em;border-bottom:3px solid;}
.kazo mark.m-A{border-color:var(--tokiwa);background:rgba(0,120,110,.14);}
.kazo mark.m-B{border-color:var(--moegi);background:rgba(169,209,89,.22);}
.kazo mark.m-C{border-color:#E0A458;background:rgba(224,164,88,.22);}
.kazo mark.m-D{border-color:rgba(62,59,57,.45);background:rgba(62,59,57,.08);}
.kazo mark.m-soft{border-color:rgba(62,59,57,.2);background:transparent;border-bottom-style:dotted;}
.kazo .adv{border-left:3px solid rgba(62,59,57,.2);padding:.2em 0 .2em 1em;margin:1.2em 0;}
.kazo .adv.c-A{border-left-color:var(--tokiwa);}
.kazo .adv.c-B{border-left-color:var(--moegi);}
.kazo .adv.c-C{border-left-color:#E0A458;}
.kazo .adv .kubun{display:inline-block;font-size:13px;color:var(--sumi-usu);letter-spacing:.08em;margin-right:.7em;border:1px solid rgba(62,59,57,.25);padding:.05em .5em;border-radius:2px;vertical-align:middle;}
.kazo .adv h4{margin:0 0 .3em;font-weight:500;font-size:17px;}
.kazo .adv p{margin:0 0 .4em;font-size:16px;line-height:1.9;}
.kazo .adv .how{color:var(--tokiwa);}
.kazo .adv .rei{font-size:15px;color:var(--sumi-usu);}
.kazo .adv .rei s{color:var(--sumi-usu);}
.kazo .ruler{margin:.6em 0 .2em;}
.kazo .ruler .r{display:grid;grid-template-columns:1fr 3em;align-items:center;gap:.5em;margin:.15em 0;}
.kazo .ruler .r i{display:block;height:.55em;background:rgba(62,59,57,.28);}
.kazo .ruler .r span{font-size:13px;color:var(--sumi-usu);}
.kazo details{margin:1.4em 0;}
.kazo ol{padding-left:1.4em;margin:0;}
.kazo ol li{margin-bottom:.9em;line-height:1.9;}
.kazo ul li{line-height:1.9;margin-bottom:.7em;}
.kazo strong{font-weight:600;}
.kazo details.mikiwake summary{color:var(--sumi);font-size:16.5px;}
.kazo summary{cursor:pointer;font-size:16px;color:var(--sumi-usu);}
.kazo .kurabe{display:flex;gap:2em;margin:.6em 0 1.2em;}
.kazo .kurabe div{flex:1;background:#fff;border:1px solid rgba(62,59,57,.2);padding:.8em 1em;border-radius:2px;}
.kazo .kurabe h4{margin:0 0 .3em;font-weight:500;font-size:16px;}
.kazo .kurabe p{font-size:16px;line-height:1.9;margin:0;}
.kazo .share{margin:1.4em 0;}
.kazo .share a{display:inline-block;font-size:16px;letter-spacing:.08em;padding:.5em 1.4em;border:1px solid var(--sumi);border-radius:2px;}
.kazo #kazo-after{display:none;margin-top:2.4em;}
.kazo #kazo-share{display:none;}

/* 文章をチェックする（kazoeru.html）2026-09-08。道具のページ＝読み物より幅を広く、最初の画面に入力欄を入れる */
section.kazo{padding-top:5vh;padding-left:4vw;padding-right:4vw;}
section.kazo > *{max-width:1240px;}
.kazo h1.fude,.kazo h2.fude{margin-bottom:.5em;}
.kazo .rule{margin-bottom:1.3em;}
.kazo .kuchi{font-size:17.5px;margin-bottom:1.1em;}
.kazo textarea{min-height:7.5em;}
@media(max-width:600px){section.kazo{padding-top:5vh;} .kazo textarea{min-height:6em;}}
/* 検証の記録（kensho.html）2026-09-04。見た目は後で変える前提の最小 */
.kensho-page h3{font-size:17px;font-weight:500;margin:2.2em 0 .6em;}
.kensho-page ul{padding-left:1.2em;font-size:16px;line-height:1.9;}
.kensho-page table.kensho{border-collapse:collapse;font-size:13.5px;line-height:1.6;width:100%;margin:.6em 0;}
.kensho-page table.kensho th,.kensho-page table.kensho td{border:1px solid rgba(62,59,57,.25);padding:.35em .5em;text-align:left;vertical-align:top;}
.kensho-page table.kensho th{background:rgba(62,59,57,.06);font-weight:500;}
@media(max-width:600px){.kensho-page table.kensho{font-size:11.5px;} .kensho-page table.kensho th,.kensho-page table.kensho td{padding:.25em .3em;}}

/* ── スライド集（2026-09-10）──
   1ページ目の画像をそのまま見せる。枠は生成りより少し深い面。ボタンは文字だけ */
.slides-page .deck{margin:0 0 4.2em;}
.slides-page .deck h3{font-size:19px;font-weight:500;letter-spacing:.06em;margin:0 0 .5em;}
.slides-page .deck-desc{margin:0 0 .4em;}
.slides-page .chiisai{font-size:14px;color:var(--sumi-usu);margin:0 0 1em;}
.slides-page .viewer{background:var(--kinari-fuka);padding:10px;border-radius:6px;}
.slides-page .viewer img{width:100%;height:auto;aspect-ratio:16/9;cursor:pointer;background:#fff;}
.slides-page .ctl{display:flex;justify-content:center;align-items:center;gap:1.6em;margin-top:.6em;font-size:15px;color:var(--sumi-usu);}
.slides-page .ctl button{background:none;border:0;color:var(--sumi);font:inherit;letter-spacing:.08em;cursor:pointer;padding:.3em .6em;}
.slides-page .ctl button:hover{color:var(--tokiwa);}
.slides-page .deck-links{margin-top:1.2em;font-size:16px;}
.slides-page .deck-links a{margin-right:1.6em;}