/* DEBUNK theme
   白地・ダークモードなし。チャンネル色は「面」に、線には暗色版を使う。

   4世代（旧シンプル版 → A/B案 → Milk Road型 → リッチ版）が1枚に堆積していたので統合した。
   守るルール:
     - 文字サイズは10段だけ  10 / 11 / 12.5 / 13.5 / 15 / 17 / 19 / 23 / 26 / 34
     - 角丸は3段だけ         --r-s / --r-m / --r-l
     - 見出しは3段だけ       ページタイトル(serif 34) / セクション(sans 26) / 小見出し(15)
     - ブレークポイントは3本 1180(目次) / 1080(段数) / 760(1カラム)
     - 英字キャプションは .cap 1クラスに集約
   ============================================================ */

:root{
  color-scheme:light only;
  --paper:#FFFFFF;
  --paper-2:#F7F6F3;
  --paper-3:#FCFBF9;
  --ink:#1A1A1C;
  --ink-2:#5A574F;
  --ink-3:#6E6858;
  --ink-4:#77715F;          /* 白地で約4.6:1。11px の文字にも使えるところまで暗くした */
  --rule:#E6E3DC;
  --rule-2:#F0EEE9;
  --crypto:#FFEF00;
  --ai:#75DB9C;
  --crypto-line:#8A7F00;    /* 黄は白地で約1.2:1。線とインジケータには暗色版を使う */
  --ai-line:#1E7A4C;
  --track:var(--ink);
  --track-line:var(--ink);
  --r-s:4px; --r-m:8px; --r-l:12px;
  --head-h:66px;
  /* --gh-font-* は管理画面 Design → Fonts で選んだときだけ Ghost が定義する。未選択なら日本語スタックのまま */
  --sans:var(--gh-font-body,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium","Yu Gothic","Noto Sans JP",-apple-system,"Segoe UI",Roboto,sans-serif);
  --serif:var(--gh-font-heading,"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",Georgia,serif);
  --mono:ui-monospace,"SF Mono","Menlo","Consolas",monospace;
}
body.tag-crypto,.t-crypto{--track:var(--crypto);--track-line:var(--crypto-line)}
body.tag-ai,.t-ai{--track:var(--ai);--track-line:var(--ai-line)}
body.tag-crypto.tag-ai{--track:var(--ink);--track-line:var(--ink)}

*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;font-feature-settings:"palt" 1}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.wrap.read{max-width:740px}
.wrap.wide{max-width:1280px}

/* 英字キャプション。旧 .eyebrow / .mc-en / .is-kind / .ns-kind / .g-kind を1つに畳んだ */
.cap,.share .lb,.tagrow .lb,.toc .lb,.mc-more,.sc-count{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--ink-3);
  display:block;text-transform:uppercase}
.mc-more,.share .lb,.tagrow .lb,.sc-count{display:inline-block}
.mc-more:hover{color:var(--ink)}

/* ---------- ヘッダー ---------- */
.progress{display:none;position:fixed;top:0;left:0;height:3px;width:0;
  background:var(--track-line);z-index:50;transition:width .1s linear}
.masthead{border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(12px);
  transition:transform .25s ease}
.masthead .wrap{display:flex;align-items:center;gap:14px;height:var(--head-h)}
.brand{display:flex;align-items:center;gap:11px}
/* ロゴは3枚出しておいて、<head> で決めた data-track に応じてCSSで出し分ける */
.brand .logo{height:21px;width:auto;display:none}
.brand .lg-all{display:block}
[data-track="crypto"] .brand .lg-all,[data-track="ai"] .brand .lg-all{display:none}
[data-track="crypto"] .brand .lg-c{display:block}
[data-track="ai"] .brand .lg-a{display:block}
.brand .tagline{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--ink-4);
  padding-left:11px;border-left:1px solid var(--rule);white-space:nowrap}
.spacer{flex:1}
.tracks{display:flex;gap:2px}
.tk{font-family:var(--mono);font-size:11px;letter-spacing:.1em;font-weight:600;
  color:var(--ink-3);padding:7px 12px;position:relative}
.tk:hover,.tk[aria-current="page"]{color:var(--ink)}
.tk[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;
  height:2px;background:var(--dot,var(--ink))}
.tk.c{--dot:var(--crypto-line)}
.tk.a{--dot:var(--ai-line)}
.icon-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;
  border:1px solid var(--rule);border-radius:50%;background:transparent;color:var(--ink-3);
  cursor:pointer;transition:all .18s ease}
.icon-btn:hover{border-color:var(--ink);color:var(--ink)}

/* ボタンは1流派。角丸は --r-s、ホバーは浮上＋影 */
.sub-btn,.gate .btn,.ft-form button,.subs-form button,.nl-form button,.is-form button{
  border:0;background:var(--ink);color:var(--paper);font-weight:700;font-size:13.5px;
  padding:11px 20px;border-radius:var(--r-s);cursor:pointer;font-family:inherit;
  white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease;display:inline-block}
.sub-btn:hover,.gate .btn:hover,.ft-form button:hover,.subs-form button:hover,
.nl-form button:hover,.is-form button:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(0,0,0,.16)}

/* ---------- セクション帯 ---------- */
.catbar{border-bottom:1px solid var(--rule);background:var(--paper);position:sticky;
  top:var(--head-h);z-index:15}
.catbar .wrap{display:flex;overflow-x:auto;scrollbar-width:none;gap:2px;
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 94%,transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 94%,transparent 100%)}
.catbar .wrap::-webkit-scrollbar{display:none}
.cat{display:flex;align-items:center;padding:12px 14px;white-space:nowrap;font-size:13px;
  font-weight:600;color:var(--ink-2);position:relative}
.cat:first-child{padding-left:0}
.cat .en{display:none}
.cat:hover{color:var(--ink)}
.cat[aria-current="page"]{color:var(--ink);font-weight:700}
.cat[aria-current="page"]::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;
  height:2px;background:var(--track-line)}
.cat.home{color:var(--ink-4)}

/* ---------- 見出し3段 ---------- */
.banner{border-bottom:1px solid var(--rule);padding:34px 0 30px}
.banner h1,.nl-hero h1{font-family:var(--serif);font-size:34px;font-weight:600;
  margin:8px 0 10px;line-height:1.4;text-wrap:balance;word-break:auto-phrase}
.banner p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.9;max-width:58ch}
.stripe{display:inline-block;height:3px;width:36px;background:var(--track);
  margin-bottom:12px;vertical-align:middle}

.mc-head h2,.mc-head-row h2,.subs-head h2,.sec-head h2{
  font-family:var(--sans);font-size:26px;font-weight:800;margin:0;letter-spacing:-.01em;
  line-height:1.3}
.mc-head{margin-bottom:2px}
.mc-head-row,.sec-head{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.mc-head-row .cap,.sec-head .cap{margin-bottom:0}
.sec-head .more{margin-left:auto;font-size:12.5px;color:var(--ink-3)}
.sec-head .more a:hover{color:var(--ink)}

/* ---------- カルーセル / グリッド ---------- */
.mc,.section{padding:34px 0;border-bottom:1px solid var(--rule)}
.mc:last-of-type,.section:last-of-type{border-bottom:0}

.mc-bar{display:flex;align-items:center;gap:16px;margin:16px 0 18px;
  border-bottom:1px solid var(--rule)}
.mc-bar.simple{justify-content:flex-end;border-bottom:0;margin-bottom:10px}
.mc-tabs{display:flex;gap:4px}
.mc-tabs button{position:relative;border:0;background:transparent;cursor:pointer;
  font-family:inherit;font-size:13.5px;color:var(--ink-3);padding:11px 13px;
  transition:color .18s ease;min-height:44px}
.mc-tabs button:hover{color:var(--ink)}
.mc-tabs button.on{color:var(--ink);font-weight:700}
.mc-tabs button.on::after{content:"";position:absolute;left:13px;right:13px;bottom:-1px;
  height:2px;background:var(--ink);border-radius:2px}
.mc-ctl{margin-left:auto;display:flex;align-items:center;gap:6px;padding-bottom:5px}
.mc-more{margin-right:6px}
.mc-arrow{width:32px;height:32px;border-radius:50%;border:1px solid var(--rule);
  background:var(--paper);color:var(--ink-2);cursor:pointer;display:flex;
  align-items:center;justify-content:center;transition:all .18s ease}
.mc-arrow:hover:not(:disabled){border-color:var(--ink);color:var(--ink);
  transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.07)}
.mc-arrow:disabled{opacity:.28;cursor:default}

.mc-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x proximity;
  scroll-behavior:smooth;scrollbar-width:none;padding:4px 0 8px;
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 96%,transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 96%,transparent 100%)}
.mc-track::-webkit-scrollbar{display:none}
.mc-grid,.mc-grid.four{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 22px;
  padding:4px 0 8px}

/* カードは1種類だけ。カルーセルでもグリッドでも同じ部品 */
.mc-card{display:flex;flex-direction:column;transition:transform .22s cubic-bezier(.2,.7,.3,1)}
.mc-track .mc-card{flex:0 0 296px;scroll-snap-align:start}
.mc-card[hidden]{display:none}
.mc-card:hover{transform:translateY(-4px)}
/* カバー画像はタイトルを焼き込んだOG比の素材が多い。1.91:1＋上寄せで上端が切れないようにする */
.mc-thumb{border-radius:var(--r-l);overflow:hidden;aspect-ratio:1.91/1;background:var(--paper-2);
  margin-bottom:12px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.mc-thumb img{width:100%;height:100%;object-fit:cover;object-position:center top;
  transition:transform .45s cubic-bezier(.2,.7,.3,1)}
.mc-card:hover .mc-thumb img{transform:scale(1.05)}
.mc-card:hover .mc-thumb{box-shadow:0 8px 22px rgba(0,0,0,.11)}
.mc-card h4{font-size:15px;line-height:1.6;font-weight:700;margin:0 0 7px;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.mc-card:hover h4{text-decoration:underline;text-underline-offset:3px}
.mc-card p{margin:0 0 12px;font-size:12.5px;line-height:1.75;color:var(--ink-3);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.mc-foot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:auto;
  font-size:11px;color:var(--ink-4)}
.mc-foot .when{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.mc-foot .who{color:var(--ink-3)}

/* カバー画像が無い記事の受け皿。ロゴマークを敷いてブランドを立てる */
.mc-ph{width:100%;height:100%;border:1px solid var(--rule-2);
  background-color:var(--paper-2);
  background-image:url("../images/logomark.png");
  background-repeat:no-repeat;background-position:center;background-size:34px auto}
.mc-ph.big{background-size:56px auto}
.t-crypto .mc-ph{background-color:#FFFDF0;background-image:url("../images/logomark-crypto.png")}
.t-ai .mc-ph{background-color:#F3FCF6;background-image:url("../images/logomark-ai.png")}
.mc-empty,.mc-none{font-size:12.5px;color:var(--ink-4);padding:26px 0;
  border:1px dashed var(--rule);border-radius:var(--r-m);text-align:center}

/* チップ。チャンネル色はここで「面」として使う。文字は濃色でコントラスト約10:1 */
.chip{font-family:var(--mono);font-size:10px;letter-spacing:.1em;font-weight:600;
  padding:3px 7px;border-radius:var(--r-s);white-space:nowrap;display:inline-block}
.chip.crypto{background:var(--crypto);color:#3A3400}
.chip.ai{background:var(--ai);color:#0C3A22}
.chip.plain{border:1px solid var(--rule);color:var(--ink-3)}
.chip.paid{background:var(--ink);color:var(--paper)}

/* ---------- トップのリード ---------- */
.lead{border-bottom:1px solid var(--rule);padding:30px 0 34px}
.lead-i{display:grid;grid-template-columns:1.05fr 1fr;gap:34px;align-items:center}
.lead-img{border-radius:var(--r-l);overflow:hidden;aspect-ratio:1.91/1;background:var(--paper-2)}
.lead-img img{width:100%;height:100%;object-fit:cover;object-position:center top;
  transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.lead-i:hover .lead-img img{transform:scale(1.03)}
.lead-txt h1{font-family:var(--serif);font-size:34px;line-height:1.42;font-weight:600;
  margin:10px 0 13px;text-wrap:balance;word-break:auto-phrase}
.lead-txt p{margin:0 0 14px;font-size:15px;line-height:1.95;color:var(--ink-2);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.lead-i:hover h1{text-decoration:underline;text-underline-offset:4px}

/* ---------- 用語チップ / 事業導線 ---------- */
.gloss{display:flex;flex-wrap:wrap;gap:7px}
.term{border:1px solid var(--rule);border-radius:var(--r-s);padding:9px 13px;
  display:flex;flex-direction:column;gap:2px;transition:border-color .18s ease}
.term b{font-size:13.5px;font-weight:700}
.term span{font-size:11px;color:var(--ink-3);max-width:22ch;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.term:hover{border-color:var(--ink)}

/* ---------- 記事 ---------- */
.crumb{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-3);flex-wrap:wrap}
.crumb a:hover{color:var(--ink)}
.art-head{padding:26px 0 0}
.page-top{padding-top:26px;padding-bottom:16px}
.art-head .crumb{padding:0 0 16px}
.chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.art h1{font-family:var(--serif);font-size:34px;line-height:1.45;font-weight:600;
  margin:0 0 16px;text-wrap:balance;word-break:auto-phrase}
.art-dek{font-size:17px;line-height:2;color:var(--ink-2);margin:0 0 22px;
  padding-left:15px;border-left:3px solid var(--track-line)}
.byline{display:flex;align-items:center;gap:12px;padding:15px 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.av{width:34px;height:34px;border-radius:50%;background:var(--track);flex:none;
  display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;
  color:var(--ink);overflow:hidden}
.av img{width:100%;height:100%;object-fit:cover}
.av.lg{width:54px;height:54px;font-size:19px}
.byline .who{font-size:13.5px;font-weight:700}
.byline .meta{font-size:11px;color:var(--ink-4);font-variant-numeric:tabular-nums}
.by-share{margin-left:auto;display:flex;gap:6px}
.by-share .ib{font-size:12.5px;font-weight:600;color:var(--ink-3);border:1px solid var(--rule);
  background:transparent;border-radius:var(--r-s);padding:11px 13px;cursor:pointer;
  font-family:inherit;transition:all .18s ease;min-height:44px;display:flex;align-items:center}
.by-share .ib:hover{border-color:var(--ink);color:var(--ink)}
.art-cover{margin:26px 0 0;border-radius:var(--r-l);overflow:hidden}
.art-cover img{width:100%;display:block}
.art-cover figcaption{font-size:12.5px;color:var(--ink-3);padding:9px 2px 0;line-height:1.8}

/* 目次。1180px 以上では本文の左外側に浮かせて追従、それ以下は details で畳む */
.art-body{padding:30px 0 0}
.art-body .wrap.read{position:relative}
.toc{border:1px solid var(--rule);border-radius:var(--r-m);padding:14px 16px;margin:0 0 30px;
  font-size:13.5px;line-height:1.7;background:var(--paper-2)}
.toc>.lb{cursor:pointer;margin-bottom:8px}
.toc a{display:block;padding:5px 0 5px 11px;color:var(--ink-2);border-left:2px solid transparent}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ink);font-weight:700;border-left-color:var(--track-line)}
.toc a.lv3{padding-left:24px;font-size:12.5px}

/* ---------- 記事本文 ---------- */
.content{counter-reset:h2}
.content p{font-size:17px;line-height:1.95;margin:0 0 1.45em;letter-spacing:.012em}
.content>p:first-of-type{font-size:19px;line-height:2}

.content h2{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.5;
  margin:3.2em 0 1.1em;padding-bottom:.55em;position:relative;display:flex;
  align-items:baseline;gap:16px}
/* 章番号はチャンネル色で大きく。長い記事で「いま何章か」を数えられるようにする */
.content h2::before{counter-increment:h2;content:counter(h2,decimal-leading-zero);
  font-family:var(--mono);font-size:19px;font-weight:700;color:var(--track-line);
  flex:none;padding-top:.18em}
.content h2::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--track-line) 0,var(--track-line) 84px,var(--rule) 84px)}
.content h3{font-family:var(--serif);font-size:19px;font-weight:600;margin:2.2em 0 .8em;
  line-height:1.6;padding-left:13px;border-left:3px solid var(--rule)}
/* 小見出しは本文と同じ17px。地の文の太字に埋もれないよう、頭に色の縦線を立てる。
   （原稿では ◼️ を手で打っていたが、投入時に落として CSS 側で描く） */
.content h4{font-size:17px;font-weight:700;margin:2.4em 0 .7em;line-height:1.7;
  padding-left:13px;position:relative}
.content h4::before{content:"";position:absolute;left:0;top:.3em;bottom:.3em;width:3px;
  background:var(--track-line);border-radius:2px}

.content ul,.content ol{font-size:17px;line-height:1.95;padding-left:0;margin:0 0 1.45em;
  list-style:none}
.content ul li,.content ol li{position:relative;padding-left:1.5em;margin-bottom:.5em}
.content ul>li::before{content:"";position:absolute;left:.3em;top:.85em;width:6px;height:6px;
  border-radius:50%;background:var(--track);box-shadow:0 0 0 1px var(--track-line) inset}
.content ol{counter-reset:li}
.content ol>li::before{counter-increment:li;content:counter(li);position:absolute;left:0;
  top:.15em;font-family:var(--mono);font-size:12.5px;color:var(--ink-3);width:1.3em;text-align:right}
.content li>ul,.content li>ol{margin:.5em 0 0}

.content blockquote{font-family:var(--serif);font-size:17px;line-height:2;margin:2em 0;
  padding:22px 24px 22px 54px;background:var(--paper-2);border-radius:var(--r-m);
  position:relative;color:var(--ink);border-left:0}
.content blockquote::before{content:"\201C";position:absolute;left:18px;top:10px;font-size:44px;
  line-height:1;color:var(--ink-4);font-family:Georgia,serif}
.content blockquote p{font-size:inherit;margin-bottom:.9em}
.content blockquote p:last-child{margin-bottom:0}

.content hr{border:0;height:auto;margin:2.4em 0;text-align:center;overflow:visible}
.content hr::before{content:"\25C6 \25C6 \25C6";font-size:8px;letter-spacing:.7em;color:var(--rule)}

.tbl-scroll{overflow-x:auto;margin:0 0 1.9em;border:1px solid var(--rule);
  border-radius:var(--r-m);scrollbar-width:thin}
.content table{width:100%;border-collapse:collapse;font-size:13.5px;margin:0;min-width:520px}
.content thead th{background:var(--paper-2);font-weight:700;font-size:12.5px;white-space:nowrap}
.content td,.content th{border-top:1px solid var(--rule-2);padding:11px 14px;text-align:left;
  line-height:1.85;vertical-align:top}
.content tbody tr:nth-child(even){background:var(--paper-3)}
.content thead th:first-child,.content td:first-child{padding-left:16px}

.content a{border-bottom:1px solid var(--ink-4);transition:border-color .15s ease}
.content a:hover{border-color:var(--ink);background:linear-gradient(transparent 82%,var(--track) 82%)}
.content a.ext::after{content:"\2197";font-size:.72em;color:var(--ink-4);margin-left:2px;
  vertical-align:.15em}
.content strong{font-weight:700}
.content mark{background:linear-gradient(transparent 58%,var(--track) 58%);padding:0 1px}
.content code{font-family:var(--mono);font-size:.86em;background:var(--paper-2);
  border:1px solid var(--rule-2);border-radius:var(--r-s);padding:2px 5px}
.content pre{background:#1A1A1C;color:#F2F0EA;border-radius:var(--r-m);padding:18px 20px;
  overflow-x:auto;font-size:13.5px;line-height:1.8;margin:0 0 1.9em}
.content pre code{background:transparent;border:0;padding:0;color:inherit;font-size:inherit}
.content figure{margin:2.4em 0}
.content img,.content figure img{border-radius:var(--r-m)}
.content figcaption{font-size:12.5px;color:var(--ink-3);padding:0 0 0 10px;line-height:1.8;
  border-left:2px solid var(--rule);margin-top:9px}
.content iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;margin:0 0 1.9em;
  border-radius:var(--r-m)}

/* ---------- 記事末 ---------- */
.inline-sub{border:1px solid var(--ink);border-radius:var(--r-m);padding:22px 24px;margin:2.4em 0;
  display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:center}
.inline-sub b{display:block;font-size:17px;line-height:1.6;margin:7px 0 6px}
.inline-sub p{margin:0;font-size:13.5px;line-height:1.85;color:var(--ink-2)}
/* トピックが1つも無い記事では TOPICS 行を出さない（見出しだけ残るのを防ぐ） */
.tagrow:not(:has(a)){display:none}
.share,.tagrow{display:flex;align-items:center;gap:8px;padding:22px 0;
  border-top:1px solid var(--rule);flex-wrap:wrap}
.share .lb,.tagrow .lb{margin-right:4px}
.share button,.share a{font-size:12.5px;font-weight:600;font-family:inherit;
  border:1px solid var(--rule);background:transparent;border-radius:var(--r-s);padding:11px 14px;
  color:var(--ink-2);cursor:pointer;min-height:44px;display:flex;align-items:center}
.share button:hover,.share a:hover{border-color:var(--ink);color:var(--ink)}
/* 共有ボタンはアイコンの丸ボタン（SNS のリンクと同じ見た目）。タップしやすいよう 40px */
.share .ic,.by-share .ic{width:40px;height:40px;min-height:0;padding:0;border-radius:50%;
  justify-content:center}
.share .ic svg,.by-share .ic svg{display:block}
.share .ic.done,.by-share .ic.done{border-color:var(--ink);color:var(--ink);background:var(--paper-2,#f0efe9)}
.tg{font-size:12.5px;border:1px solid var(--rule);border-radius:var(--r-s);padding:7px 12px;
  color:var(--ink-2)}
.tg::before{content:"#";color:var(--ink-4);margin-right:2px}
.tg:hover{border-color:var(--ink);color:var(--ink)}
.tg.pri{border-color:var(--ink-3);color:var(--ink)}
.authorbox{display:flex;gap:16px;padding:24px 0;border-top:1px solid var(--rule);
  align-items:flex-start}
.ab-name{display:flex;align-items:baseline;gap:12px;font-size:15px;font-weight:700;margin-bottom:7px}
.ab-more{font-size:12.5px;font-weight:400;color:var(--ink-3)}
.ab-more:hover{color:var(--ink)}
.authorbox p{margin:0;font-size:13.5px;line-height:1.9;color:var(--ink-2);max-width:56ch}

.gate{border:1px solid var(--rule);border-top:3px solid var(--track);border-radius:var(--r-m);
  padding:30px 24px;text-align:center;margin:2em 0}
.gate .cap{display:inline-block;margin-bottom:10px}
.gate h3{font-family:var(--serif);font-size:19px;margin:0 0 9px;font-weight:600}
.gate .g-lead,.content .gate .g-lead{font-size:13.5px;line-height:1.9;color:var(--ink-2);margin:0 auto 16px;
  max-width:44ch;letter-spacing:0}
.content .gate h3{font-family:var(--serif);font-size:19px;margin:0 0 9px;font-weight:600;padding:0;border:0}
.content .gate h3::before{content:none}
.content .gate a.btn{display:inline-block;color:var(--paper);text-decoration:none;border-bottom:0}
.content .gate a.btn:hover{background:var(--ink)}
.gate .g-note{font-size:11px;color:var(--ink-4);padding-top:12px}
.gate .g-note a{border-bottom:1px solid var(--ink-4)}

/* 次に読む。トピックの段が埋まっていればセクションの段は出さない（partials/nextread.hbs） */
.nextread:has(.nr-topic .mc-card) .nr-sec{display:none}

/* ---------- ニュースレター ---------- */
.subs{border-top:1px solid var(--rule);background:var(--paper-2);padding:44px 0 48px}
.subs-head{text-align:center;margin-bottom:26px}
.subs-head .cap{display:inline-block}
.subs-head p{margin:8px 0 0;font-size:13.5px;color:var(--ink-2)}
.subs-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:820px;margin:0 auto 26px}
.sc{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--track);
  border-radius:var(--r-m);padding:22px;transition:box-shadow .2s ease,transform .2s ease}
.sc:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.07)}
.sc-top{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.sc-top b{font-size:17px}
.sc>p{margin:0 0 14px;font-size:13.5px;line-height:1.9;color:var(--ink-2)}
.sc-list{margin:0 0 14px;padding:0;list-style:none;font-size:12.5px;line-height:1.95;
  color:var(--ink-2)}
.sc-list li{padding-left:16px;position:relative}
.sc-list li::before{content:"";position:absolute;left:2px;top:.75em;width:5px;height:5px;
  border-radius:50%;background:var(--track);box-shadow:0 0 0 1px var(--track-line) inset}
.sc-count{padding-top:12px;border-top:1px solid var(--rule-2);width:100%}
.sc-go{display:inline-block;font-size:12.5px;color:var(--ink-3);margin-top:8px}
.sc-go:hover{color:var(--ink)}

.ft-form,.subs-form,.nl-form,.is-form{display:flex;gap:8px;flex-wrap:wrap}
.ft-form input,.subs-form input,.nl-form input,.is-form input{flex:1;min-width:190px;
  border:1px solid var(--rule);border-radius:var(--r-s);padding:12px 14px;font-family:inherit;
  font-size:13.5px;background:var(--paper);color:var(--ink);transition:border-color .18s ease}
.ft-form input:focus,.subs-form input:focus,.nl-form input:focus,.is-form input:focus{
  outline:0;border-color:var(--ink)}
.subs-form{max-width:460px;margin:0 auto}
.subs-note,.ft-note,.nl-note{font-size:11px;color:var(--ink-3);line-height:1.9}
.subs-note{max-width:56ch;margin:12px auto 0;text-align:center}
.ft-note,.nl-note{padding-top:9px}

.nl-hero{border-bottom:1px solid var(--rule);padding:36px 0 40px}
.nl-hero .wrap{display:grid;grid-template-columns:1fr 400px;gap:44px;align-items:start}
.nl-lead{font-size:15px;line-height:2;color:var(--ink-2);margin:0 0 18px;max-width:48ch}
.nl-meta{display:flex;gap:20px;padding:14px 0;margin-bottom:18px;font-size:11px;
  color:var(--ink-3);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  flex-wrap:wrap;align-items:baseline}
.nl-meta b{color:var(--ink);font-size:13.5px}
.nl-sample{display:block;border:1px solid var(--rule);border-radius:var(--r-l);padding:16px;
  background:var(--paper);transition:transform .2s ease,box-shadow .2s ease}
.nl-sample:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.09)}
.ns-img{border-radius:var(--r-m);overflow:hidden;aspect-ratio:1.91/1;margin:10px 0 12px;
  background:var(--paper-2)}
.ns-img img{width:100%;height:100%;object-fit:cover;object-position:center top}
.nl-sample h3{font-size:15px;line-height:1.6;font-weight:700;margin:0 0 7px}
.nl-sample p{margin:0 0 10px;font-size:12.5px;line-height:1.8;color:var(--ink-3)}

/* ---------- トピック / 著者 / ページャ ---------- */
.cloud{display:flex;flex-wrap:wrap;gap:7px}
.cl{display:inline-flex;align-items:baseline;gap:7px;border:1px solid var(--rule);
  border-radius:var(--r-s);padding:9px 13px}
.cl:hover{border-color:var(--ink)}
.cl b{font-size:13.5px;font-weight:700}
.cl span{font-family:var(--mono);font-size:10px;color:var(--ink-4)}
.cl.s1 b{font-size:17px}
.cl.s2 b{font-size:15px}
.author-hero{display:flex;gap:18px;align-items:flex-start}
.author-hero .bio{font-size:13.5px;line-height:1.9;color:var(--ink-2);max-width:58ch;margin:0 0 8px}
.pager{display:flex;justify-content:center;gap:14px;padding:26px 0 0;font-size:12.5px;
  color:var(--ink-3)}
.pager a:hover{color:var(--ink)}
.pager .cur{color:var(--ink);font-variant-numeric:tabular-nums}
.empty{font-size:13.5px;color:var(--ink-3);padding:26px 0;text-align:center}
.utility{display:flex;gap:14px;padding:16px 0 0;font-size:11px;color:var(--ink-3)}
.utility a:hover{color:var(--ink)}

/* ---------- フッター ---------- */
.foot{border-top:1px solid var(--rule);padding:0 0 40px;color:var(--ink-3);font-size:12.5px;
  line-height:1.9}
.foot-top{background:var(--paper-2);border-bottom:1px solid var(--rule);padding:40px 0;
  margin-bottom:34px}
.foot-top .wrap{display:grid;grid-template-columns:1fr 420px;gap:48px;align-items:center}
.ft-logo{height:22px;width:auto;display:block;margin-bottom:14px}
.ft-l h3{font-family:var(--serif);font-size:23px;font-weight:600;margin:0 0 10px;
  line-height:1.5;color:var(--ink)}
.ft-l p{margin:0;font-size:13.5px;line-height:1.9;color:var(--ink-2);max-width:46ch}
.ft-stat{display:flex;gap:18px;padding-top:14px;font-size:11px;color:var(--ink-3);flex-wrap:wrap}
/* トップは直前に購読ブロックがあるので、フッターのフォームまで出すと2つ続けて並ぶ */
.home-template .ft-form,.home-template .ft-note{display:none}
.home-template .ft-stat{padding-top:0}
.ft-stat b{color:var(--ink);font-size:13.5px}
.foot .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:22px}
.foot h5{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--ink);
  margin:0 0 9px;font-weight:700;display:flex;align-items:center;gap:7px}
/* チャンネルの列だけ、見出しの頭に色の面を置く。ヘッダーのタブと同じ手がかりにする */
.col-c h5::before,.col-a h5::before{content:"";width:9px;height:9px;border-radius:2px;flex:none}
.col-c h5::before{background:var(--crypto);box-shadow:0 0 0 1px var(--crypto-line) inset}
.col-a h5::before{background:var(--ai);box-shadow:0 0 0 1px var(--ai-line) inset}
/* 縦に8行並ぶと長すぎるので、リンクは横に流して折り返す（2026-11-08） */
.foot .cols ul{margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:wrap;gap:6px 16px}
.foot li{list-style:none}
.foot a{color:var(--ink-2)}
.foot a:hover{color:var(--ink)}
.ft-legal{display:flex;gap:14px;padding-top:20px;border-top:1px solid var(--rule-2);
  font-size:11px;color:var(--ink-4);flex-wrap:wrap}
.ft-when{margin-left:auto;font-family:var(--mono);letter-spacing:.06em}

/* ============ ブレークポイント 1180 / 1080 / 760 ============ */
@media(min-width:1180px){
  .toc{position:sticky;top:calc(var(--head-h) + 54px);float:left;width:212px;
    margin-left:-268px;margin-bottom:0;max-height:calc(100vh - 170px);overflow-y:auto;
    scrollbar-width:thin;background:transparent;border:0;border-left:1px solid var(--rule);
    border-radius:0;padding:2px 0 2px 14px}
  .toc>.lb{cursor:default;list-style:none}
  .toc>.lb::-webkit-details-marker{display:none}
}
@media(max-width:1080px){
  .mc-grid,.mc-grid.four{grid-template-columns:repeat(2,1fr)}
  .foot-top .wrap,.nl-hero .wrap,.inline-sub{grid-template-columns:1fr;gap:26px}
  .foot .cols{grid-template-columns:repeat(2,1fr)}
  .subs-cards{grid-template-columns:1fr}
  .content .kg-width-wide,.content .kg-width-full{width:100%;margin-left:0;transform:none}
}
@media(max-width:760px){
  .wrap{padding:0 18px}
  /* ヘッダーが2段になるので、カテゴリ帯を sticky から外して重なりを防ぐ */
  .masthead .wrap{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:8px;gap:8px 12px}
  .brand{flex:1 1 auto}
  .brand .tagline{display:none}
  .spacer{display:none}
  .tracks{order:3;flex:1 1 100%;gap:0;border-top:1px solid var(--rule-2);padding-top:4px}
  .tk{padding:8px 12px 8px 0}
  .catbar{position:static}
  .lead-i{grid-template-columns:1fr;gap:18px}
  .lead-txt h1,.art h1,.banner h1,.nl-hero h1{font-size:26px}
  .mc-head h2,.mc-head-row h2,.subs-head h2,.sec-head h2{font-size:22px}
  .mc-grid,.mc-grid.four{grid-template-columns:1fr;gap:24px}
  .mc-track .mc-card{flex-basis:248px}
  .mc-bar{flex-wrap:wrap;gap:8px}
  .mc-ctl{margin-left:0;width:100%;justify-content:flex-end}
  .content p{font-size:16.5px}
  .content>p:first-of-type{font-size:17px}
  .content h2{font-size:20px}
  /* 読んでいる間はヘッダーごと隠し、上に戻したら出す。2段で画面の1割強を塞ぐため。
     高さを変えると下の本文が跳ねるので、transform で画面外へ送る */
  .masthead.hide{transform:translateY(-100%)}
  .art-cover{border-radius:0;margin-left:-18px;margin-right:-18px;max-width:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- Ghost エディタ（Koenig）のカード ---------- */
.content .kg-card{margin:0 0 1.8em}
.content .kg-width-wide{max-width:920px;width:100vw;margin-left:50%;transform:translateX(-50%)}
.content .kg-width-full{max-width:100%;width:100vw;margin-left:50%;transform:translateX(-50%)}
.content .kg-image{margin:0 auto;display:block}
.content .kg-image-card figcaption,.content .kg-embed-card figcaption{text-align:center;
  border-left:0;padding-left:0}
.content .kg-gallery-container{display:flex;flex-direction:column;gap:8px}
.content .kg-gallery-row{display:flex;gap:8px}
.content .kg-gallery-image{flex:1}
.content .kg-bookmark-card a{display:flex;border:1px solid var(--rule);
  border-radius:var(--r-m);overflow:hidden;text-decoration:none}
.content .kg-bookmark-content{padding:16px 18px;flex:1}
.content .kg-bookmark-title{font-weight:700;font-size:15px;margin-bottom:5px}
.content .kg-bookmark-description{font-size:13.5px;color:var(--ink-2);line-height:1.8}
.content .kg-bookmark-metadata{font-size:12.5px;color:var(--ink-3);margin-top:8px;
  display:flex;align-items:center;gap:6px}
.content .kg-bookmark-thumbnail img{width:180px;height:100%;object-fit:cover;border-radius:0}
.content .kg-bookmark-icon{width:16px;height:16px}
.content .kg-callout-card{display:flex;gap:12px;padding:16px 18px;border-radius:var(--r-m);
  background:var(--paper-2)}
.content .kg-toggle-card{border-bottom:1px solid var(--rule);padding:14px 0}
.content .kg-button-card{text-align:center}
.content .kg-btn{display:inline-block;background:var(--ink);color:var(--paper);padding:11px 24px;
  border-radius:var(--r-s);font-weight:700;font-size:13.5px;border-bottom:0}
.content .kg-header-card{padding:36px 24px;text-align:center;background:var(--paper-2);
  border-radius:var(--r-m)}

/* 記事0件のセクションは帯ごと隠す。見出しを {{#get}} の中に入れると
   パーシャル引数が解決できないため、テンプレートではなくCSSで消す */
.mc:not(:has(.mc-card)):not(:has(.gloss)){display:none}

/* SNS リンク。フッターの列内とニュースレターのトップで共用 */
.soc,.foot .soc{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;margin:14px 0 0;padding:0;
  list-style:none}
.soc a{display:inline-block;font-size:11px;border:1px solid var(--rule);border-radius:var(--r-s);
  padding:6px 10px;color:var(--ink-2);transition:all .18s ease}
.soc a:hover{border-color:var(--ink);color:var(--ink)}
.soc a.soc-i{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border-radius:50%}
.soc a.soc-i svg{display:block}
.soc-lb{align-self:center;font-size:11px;font-weight:700;letter-spacing:.06em;min-width:3.6em;color:var(--ink-2)}
.foot .soc+.soc{margin-top:6px}
.nl-soc{padding-top:16px}
.nl-soc .soc{margin-top:8px}

/* エラーページの導線。検索ボタン1つと、チャンネルへのチップ */
.err-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.err-actions .tg::before{content:none}  /* トピックではなく導線なので # は付けない */

/* ============ 更新履歴（page-updates.hbs） ============ */
.upd{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.upd li{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid var(--rule-2);flex-wrap:wrap}
.upd-d{font-family:var(--mono);font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:6.4em}
.upd-k{font-size:11px;font-weight:700;color:var(--ink-3);border:1px solid var(--rule);border-radius:var(--r-s);padding:2px 7px}
.upd-k.new{color:var(--ink);border-color:var(--ink)}
.upd-t{font-size:14.5px;font-weight:600;color:var(--ink);flex:1 1 20em}
.upd-t:hover{text-decoration:underline}
.upd-lead p{margin:6px 0 0;color:var(--ink-3)}