:root{
    --ink:#1C2420;
    --ink-soft:#4A544E;
    --ink-faint:#7C857F;
    --ground:#F4F5F3;
    --surface:#FFFFFF;
    --line:#DCE0DB;
    --deep:#2F5D50;
    --deep-soft:#8FA89E;
    --ochre:#8C6E3F;
    --ochre-soft:#EDE4D5;
    --mincho:"Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
    --gothic:"Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
    --measure:34rem;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      color-scheme:dark;
      --ink:#E8EBE7;
      --ink-soft:#AFB8B1;
      --ink-faint:#7F887F;
      --ground:#161A18;
      --surface:#1E2422;
      --line:#2E3733;
      --deep:#8FBFAE;
      --deep-soft:#4E6B60;
      --ochre:#C6A472;
      --ochre-soft:#2C2820;
    }
  }
  :root[data-theme="dark"]{
    color-scheme:dark;
    --ink:#E8EBE7;
    --ink-soft:#AFB8B1;
    --ink-faint:#7F887F;
    --ground:#161A18;
    --surface:#1E2422;
    --line:#2E3733;
    --deep:#8FBFAE;
    --deep-soft:#4E6B60;
    --ochre:#C6A472;
    --ochre-soft:#2C2820;
  }

  *{box-sizing:border-box}
  body{
    margin:0;
    background:var(--ground);
    color:var(--ink);
    font-family:var(--gothic);
    font-size:16px;
    line-height:1.9;
    -webkit-font-smoothing:antialiased;
  }
  .wrap{width:100%;max-width:64rem;margin-inline:auto;padding-inline:20px}
  a{color:inherit}
  a:focus-visible,button:focus-visible{outline:2px solid var(--deep);outline-offset:3px;border-radius:2px}

  /* ── header ── */
  .masthead{
    position:sticky;top:env(safe-area-inset-top, 0px);z-index:20;
    background:color-mix(in srgb, var(--ground) 92%, transparent);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .masthead .wrap{
    display:flex;align-items:center;justify-content:space-between;
    gap:16px;padding-block:14px;flex-wrap:wrap;
  }
  .logo{font-family:var(--mincho);font-weight:800;font-size:1.22rem;letter-spacing:.06em;text-decoration:none;line-height:1.3}
  .logo small{display:block;font-family:var(--gothic);font-weight:400;font-size:.62rem;letter-spacing:.24em;color:var(--ink-faint);margin-top:2px}
  .nav{display:flex;gap:20px;flex-wrap:wrap;font-size:.8rem;letter-spacing:.04em}
  .nav a{text-decoration:none;color:var(--ink-soft);padding-block:2px;border-bottom:1px solid transparent}
  .nav a:hover{color:var(--deep);border-bottom-color:var(--deep)}

  /* ── hero: the paper's position, not a sales banner ── */
  .creed{padding-block:76px 64px;border-bottom:1px solid var(--line)}
  .creed-grid{display:grid;grid-template-columns:1fr;gap:38px}
  @media (min-width:860px){.creed-grid{grid-template-columns:1.35fr .9fr;gap:64px;align-items:start}}
  .creed h1{
    font-family:var(--mincho);font-weight:800;
    font-size:clamp(1.72rem,5vw,2.68rem);line-height:1.62;
    margin:0 0 26px;letter-spacing:.02em;text-wrap:balance;
  }
  .creed h1 em{font-style:normal;color:var(--deep);border-bottom:2px solid var(--deep-soft);padding-bottom:1px}
  .creed p{margin:0 0 18px;max-width:var(--measure);color:var(--ink-soft);font-size:.97rem}
  .creed p.lead{color:var(--ink);font-size:1.03rem}
  .creed p:last-child{margin-bottom:0}
  .signed{margin-top:30px;font-size:.8rem;color:var(--ink-faint);letter-spacing:.06em}
  .signed b{font-family:var(--mincho);font-weight:600;color:var(--ink);font-size:.92rem;letter-spacing:.04em}

  .rules{
    background:var(--surface);border:1px solid var(--line);
    padding:26px 24px;
  }
  .rules h2{
    font-family:var(--gothic);font-size:.68rem;font-weight:700;
    letter-spacing:.22em;color:var(--ochre);margin:0 0 18px;
  }
  .rules ol{margin:0;padding:0;list-style:none;display:grid;gap:16px;counter-reset:r}
  .rules li{
    counter-increment:r;position:relative;padding-left:28px;
    font-size:.87rem;line-height:1.75;color:var(--ink-soft);
  }
  .rules li::before{
    content:counter(r);position:absolute;left:0;top:.28em;
    font-family:var(--mincho);font-size:.74rem;color:var(--deep);
    width:18px;height:18px;border:1px solid var(--deep-soft);border-radius:50%;
    display:grid;place-items:center;line-height:1;
  }
  .rules li b{color:var(--ink);font-weight:700}

  /* ── section furniture ── */
  .band{padding-block:62px;border-bottom:1px solid var(--line)}
  .band-head{display:flex;align-items:baseline;gap:14px;margin-bottom:30px;flex-wrap:wrap}
  .band-head h2{font-family:var(--mincho);font-weight:600;font-size:1.22rem;margin:0;letter-spacing:.06em}
  .band-head span{font-size:.66rem;letter-spacing:.2em;color:var(--ink-faint)}

  /* ── lead story ── */
  .feature{display:grid;grid-template-columns:1fr;gap:30px}
  @media (min-width:860px){.feature{grid-template-columns:1fr 1fr;gap:52px;align-items:center}}
  .feature-art{
    aspect-ratio:4/3;max-width:100%;border:1px solid var(--line);
    background:var(--surface);position:relative;overflow:hidden;
  }
  .feature-art canvas{display:block;width:100%;height:100%}
  .kicker{font-size:.66rem;letter-spacing:.2em;color:var(--ochre);margin-bottom:12px}
  .feature h3{
    font-family:var(--mincho);font-weight:800;
    font-size:clamp(1.35rem,3.6vw,1.86rem);line-height:1.6;margin:0 0 16px;text-wrap:balance;
  }
  .feature h3 a{text-decoration:none}
  .feature h3 a:hover{color:var(--deep)}
  .feature p{margin:0 0 18px;color:var(--ink-soft);font-size:.93rem;max-width:var(--measure)}
  .byline{font-size:.74rem;color:var(--ink-faint);letter-spacing:.06em}

  /* ── serials (not "categories") ── */
  .serials{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
  @media (min-width:760px){.serials{grid-template-columns:repeat(3,1fr)}}
  .serial{background:var(--surface);padding:28px 24px;display:flex;flex-direction:column;gap:12px}
  .serial-no{font-family:var(--mincho);font-size:.72rem;letter-spacing:.14em;color:var(--ochre)}
  .serial h3{font-family:var(--mincho);font-weight:600;font-size:1.06rem;margin:0;line-height:1.6}
  .serial p{margin:0;font-size:.84rem;color:var(--ink-soft);line-height:1.8}
  .serial .count{margin-top:auto;padding-top:14px;font-size:.7rem;color:var(--ink-faint);letter-spacing:.1em;border-top:1px solid var(--line)}

  /* ── article list ── */
  .list{display:grid;gap:0;border-top:1px solid var(--line)}
  .entry{
    display:grid;grid-template-columns:1fr;gap:6px;
    padding-block:22px;border-bottom:1px solid var(--line);
    text-decoration:none;
  }
  @media (min-width:700px){
    .entry{grid-template-columns:7.5rem 1fr;gap:26px;align-items:baseline}
  }
  .entry:hover h3{color:var(--deep)}
  .entry .meta{font-size:.7rem;color:var(--ink-faint);letter-spacing:.08em;display:flex;gap:10px;flex-wrap:wrap}
  .entry .meta i{font-style:normal;color:var(--ochre)}
  .entry h3{font-family:var(--mincho);font-weight:600;font-size:1.03rem;line-height:1.75;margin:0;text-wrap:pretty}
  .entry p{margin:6px 0 0;font-size:.82rem;color:var(--ink-soft);line-height:1.8}

  /* ── voices ── */
  .voices{display:grid;grid-template-columns:1fr;gap:24px}
  @media (min-width:760px){.voices{grid-template-columns:repeat(3,1fr)}}
  .voice{border-left:2px solid var(--deep-soft);padding:4px 0 4px 20px}
  .voice blockquote{
    margin:0 0 14px;font-family:var(--mincho);font-size:1.02rem;line-height:1.85;
  }
  .voice cite{font-style:normal;font-size:.76rem;color:var(--ink-faint);letter-spacing:.04em;line-height:1.7;display:block}
  .note{margin-top:28px;font-size:.76rem;color:var(--ink-faint);line-height:1.9;max-width:var(--measure)}

  /* ── quiet CTA ── */
  .close{padding-block:66px}
  .close-box{
    background:var(--surface);border:1px solid var(--line);
    padding:38px 28px;display:grid;gap:22px;
  }
  @media (min-width:820px){.close-box{grid-template-columns:1.25fr 1fr;gap:48px;align-items:center;padding:44px 40px}}
  .close h2{font-family:var(--mincho);font-weight:800;font-size:clamp(1.24rem,3.2vw,1.58rem);margin:0 0 14px;line-height:1.62}
  .close p{margin:0;font-size:.89rem;color:var(--ink-soft);max-width:var(--measure)}
  .ladder{display:grid;gap:0;border:1px solid var(--line)}
  .rung{display:flex;align-items:center;gap:12px;padding:12px 16px;font-size:.8rem;border-bottom:1px solid var(--line)}
  .rung:last-child{border-bottom:0}
  .rung span{font-family:var(--mincho);font-size:.68rem;color:var(--ink-faint);letter-spacing:.1em;min-width:3.4rem}
  .rung b{font-weight:500}
  .rung.on{background:var(--ochre-soft)}
  .rung.on b{font-weight:700;color:var(--ink)}
  .act{margin-top:24px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
  .act a{
    font-size:.84rem;text-decoration:none;color:var(--ground);background:var(--deep);
    padding:12px 24px;letter-spacing:.06em;
  }
  .act a:hover{opacity:.88}
  .act .alt{background:transparent;color:var(--deep);padding:12px 0;border-bottom:1px solid var(--deep-soft)}

  /* ── footer ── */
  footer{border-top:1px solid var(--line);padding-block:38px 44px;font-size:.76rem;color:var(--ink-faint)}
  .foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;line-height:2}
  .foot b{font-family:var(--mincho);color:var(--ink-soft);font-weight:600;letter-spacing:.06em}

  /* ── categories ── */
  .cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
  .cat{background:var(--surface);padding:20px 20px 18px;display:flex;flex-direction:column;gap:7px;text-decoration:none}
  .cat:hover{background:var(--ochre-soft)}
  .cat .n{font-family:var(--mincho);font-size:.66rem;letter-spacing:.14em;color:var(--ochre)}
  .cat h3{font-family:var(--mincho);font-weight:600;font-size:.99rem;margin:0;line-height:1.55}
  .cat p{margin:0;font-size:.78rem;color:var(--ink-soft);line-height:1.75}
  .cat.new h3::after{content:"新設";font-family:var(--gothic);font-size:.58rem;letter-spacing:.1em;
    color:var(--deep);border:1px solid var(--deep-soft);border-radius:2px;padding:1px 5px;margin-left:8px;vertical-align:.14em;font-weight:500}
  .promise{margin-top:26px;padding:18px 20px;border-left:2px solid var(--ochre);background:var(--ochre-soft);font-size:.83rem;line-height:1.85;color:var(--ink-soft);max-width:44rem}
  .promise b{color:var(--ink)}

  /* ── multi-page ── */
  .nav a.on{color:var(--deep);border-bottom-color:var(--deep)}
  .page[hidden]{display:none!important}
  .phead{padding-block:64px 44px;border-bottom:1px solid var(--line)}
  .phead .eyebrow{font-size:.66rem;letter-spacing:.2em;color:var(--ochre);margin-bottom:14px}
  .phead h1{font-family:var(--mincho);font-weight:800;font-size:clamp(1.6rem,4.4vw,2.3rem);line-height:1.6;margin:0 0 18px;text-wrap:balance}
  .phead p{margin:0;max-width:var(--measure);color:var(--ink-soft);font-size:.95rem}

  /* TODO / placeholder */
  .todo{border:1px dashed var(--ochre);background:var(--ochre-soft);padding:20px 22px;margin-block:26px}
  .todo h4{font-family:var(--gothic);font-size:.68rem;letter-spacing:.18em;color:var(--ochre);margin:0 0 10px;font-weight:700}
  .todo p{margin:0 0 8px;font-size:.83rem;color:var(--ink-soft);line-height:1.85;max-width:44rem}
  .todo p:last-child{margin-bottom:0}
  .todo b{color:var(--ink)}
  .todo ol{margin:10px 0 0;padding-left:1.2em;font-size:.82rem;color:var(--ink-soft);line-height:1.9}

  /* curriculum table */
  .tablewrap{overflow-x:auto;margin-block:8px 26px}
  table{border-collapse:collapse;width:100%;min-width:34rem;font-size:.84rem}
  th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.75}
  th{font-family:var(--gothic);font-weight:700;font-size:.7rem;letter-spacing:.12em;color:var(--ink-faint);white-space:nowrap}
  td b{color:var(--deep)}
  tr.flip td{background:var(--ochre-soft)}
  tr.flip td b{color:var(--ochre)}

  /* two hands */
  .hands{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-block:10px 28px}
  @media (min-width:780px){.hands{grid-template-columns:1fr 1fr}}
  .hand{background:var(--surface);padding:26px 24px}
  .hand h3{font-family:var(--mincho);font-weight:600;font-size:1.04rem;margin:0 0 4px}
  .hand .who{font-size:.68rem;letter-spacing:.14em;color:var(--ochre);margin-bottom:16px}
  .hand ul{margin:0;padding:0;list-style:none;display:grid;gap:11px;font-size:.85rem;color:var(--ink-soft);line-height:1.75}
  .hand li{padding-left:16px;position:relative}
  .hand li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:1px;background:var(--deep-soft)}
  .hand li b{color:var(--ink);font-weight:700}

  /* price */
  .price{border:1px solid var(--line);background:var(--surface);padding:26px 24px;margin-block:10px 8px;display:grid;gap:14px}
  @media (min-width:700px){.price{grid-template-columns:auto 1fr;gap:34px;align-items:center}}
  .price .fig{font-family:var(--mincho);font-size:1.9rem;font-weight:800;letter-spacing:.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
  .price .fig small{display:block;font-family:var(--gothic);font-size:.66rem;font-weight:400;letter-spacing:.16em;color:var(--ink-faint);margin-bottom:4px}
  .price p{margin:0;font-size:.85rem;color:var(--ink-soft);max-width:var(--measure)}

  /* steps */
  .steps{display:grid;gap:0;border:1px solid var(--line);margin-block:10px 28px}
  .step{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:18px 22px;border-bottom:1px solid var(--line);align-items:start}
  .step:last-child{border-bottom:0}
  .step .num{font-family:var(--mincho);font-size:.72rem;color:var(--ochre);letter-spacing:.12em;padding-top:.28em;white-space:nowrap}
  .step h4{font-family:var(--mincho);font-weight:600;font-size:.99rem;margin:0 0 4px}
  .step p{margin:0;font-size:.83rem;color:var(--ink-soft);line-height:1.8}

  /* faq */
  .faq{display:grid;gap:0;border-top:1px solid var(--line)}
  details{border-bottom:1px solid var(--line)}
  summary{cursor:pointer;padding:19px 0;font-family:var(--mincho);font-weight:600;font-size:.99rem;line-height:1.7;list-style:none;display:flex;gap:14px;align-items:baseline}
  summary::-webkit-details-marker{display:none}
  summary::before{content:"問";font-family:var(--gothic);font-size:.6rem;letter-spacing:.1em;color:var(--ochre);border:1px solid var(--deep-soft);padding:2px 5px;flex:none}
  details[open] summary{color:var(--deep)}
  details .a{padding:0 0 22px 2.1rem;font-size:.86rem;color:var(--ink-soft);line-height:1.9;max-width:46rem}
  details .a b{color:var(--ink)}

  /* profile */
  .profile{display:grid;grid-template-columns:1fr;gap:28px;margin-block:10px 8px}
  @media (min-width:800px){.profile{grid-template-columns:1fr 1.5fr;gap:48px}}
  .facts{border-left:2px solid var(--deep-soft);padding-left:20px;display:grid;gap:14px}
  .fact{font-size:.84rem;line-height:1.8}
  .fact span{display:block;font-size:.64rem;letter-spacing:.16em;color:var(--ink-faint);margin-bottom:3px}
  .bio p{margin:0 0 16px;font-size:.92rem;color:var(--ink-soft);max-width:var(--measure)}
  .bio p:last-child{margin-bottom:0}
  .bio b{color:var(--ink)}

  /* ── stories ── */
  .story{border-top:1px solid var(--line);padding-block:44px}
  .story:first-of-type{border-top:0;padding-top:8px}
  .story-head{margin-bottom:26px}
  .story-head .who{font-size:.68rem;letter-spacing:.2em;color:var(--ochre);margin-bottom:11px}
  .story-head h2{font-family:var(--mincho);font-weight:800;font-size:clamp(1.24rem,3.4vw,1.66rem);line-height:1.62;margin:0;text-wrap:balance}
  .story-body{max-width:var(--measure)}
  .story-body p{margin:0 0 1.35em;font-size:.94rem;line-height:2.05;color:var(--ink-soft)}
  .story-body p.said{font-family:var(--mincho);color:var(--ink);font-size:1.02rem;padding-left:18px;border-left:2px solid var(--deep-soft);line-height:1.95}
  .story-body p:last-child{margin-bottom:0}
  .story-body b{color:var(--ink);font-weight:700}
  .figs{display:flex;gap:26px;flex-wrap:wrap;margin:0 0 26px;padding:16px 0;border-block:1px solid var(--line)}
  .fig-i{font-size:.8rem;line-height:1.7}
  .fig-i span{display:block;font-size:.62rem;letter-spacing:.14em;color:var(--ink-faint);margin-bottom:2px}
  .fig-i b{font-family:var(--mincho);font-size:1.06rem;font-variant-numeric:tabular-nums;color:var(--deep)}

  /* ── article page ── */
  .art{max-width:44rem;margin-inline:auto}
  .art-head{padding-block:54px 34px;border-bottom:1px solid var(--line);margin-bottom:38px}
  .art-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.7rem;letter-spacing:.1em;color:var(--ink-faint);margin-bottom:16px}
  .art-meta i{font-style:normal;color:var(--ochre)}
  .art-head h1{font-family:var(--mincho);font-weight:800;font-size:clamp(1.5rem,4.2vw,2.16rem);line-height:1.58;margin:0;text-wrap:balance}
  .art-lead{margin:22px 0 0;font-size:1rem;line-height:2;color:var(--ink)}
  .art-body{font-size:.96rem;line-height:2.05}
  .art-body h2{font-family:var(--mincho);font-weight:800;font-size:1.22rem;line-height:1.6;margin:52px 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
  .art-body h3{font-family:var(--mincho);font-weight:600;font-size:1.06rem;margin:34px 0 12px;color:var(--deep)}
  .art-body p{margin:0 0 1.35em;color:var(--ink-soft)}
  .art-body b{color:var(--ink);font-weight:700}
  .art-body ul{margin:0 0 1.5em;padding-left:1.3em;color:var(--ink-soft)}
  .art-body li{margin-bottom:.6em}
  .art-body blockquote{margin:0 0 1.5em;padding:16px 20px;border-left:2px solid var(--ochre);background:var(--ochre-soft);font-size:.9rem;line-height:1.9}
  .art-body blockquote p{margin:0;color:var(--ink)}
  .art-body hr{border:0;border-top:1px solid var(--line);margin:44px 0}
  .art-note{font-size:.76rem;color:var(--ink-faint);line-height:1.8}
  .art-case{border:1px solid var(--line);background:var(--surface);padding:22px 24px;margin:0 0 1.5em}
  .art-case h4{font-family:var(--mincho);font-weight:600;font-size:.96rem;margin:0 0 10px}
  .art-case p{margin:0;font-size:.87rem}
  .art-cta{margin-top:56px;padding:32px 28px;border:1px solid var(--line);background:var(--surface);text-align:left}
  .art-cta h3{font-family:var(--mincho);font-weight:800;font-size:1.14rem;margin:0 0 12px;color:var(--ink)}
  .art-cta p{margin:0 0 20px;font-size:.88rem;color:var(--ink-soft)}
  .art-cta a{display:inline-block;font-size:.85rem;text-decoration:none;color:var(--ground);background:var(--deep);padding:13px 26px;letter-spacing:.06em}
  .art-cta a:hover{opacity:.88}
  .backlink{display:inline-block;margin-bottom:26px;font-size:.78rem;color:var(--ink-faint);text-decoration:none;letter-spacing:.06em}
  .backlink:hover{color:var(--deep)}
  .soon{color:var(--ink-faint);font-size:.68rem;border:1px solid var(--line);padding:2px 7px;margin-left:8px;letter-spacing:.08em;white-space:nowrap}
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}