/* =========================================================================
   VNJ COMPONENTS  —  確定コンポーネントのスタイル
   すべて vnj-tokens.css の変数を参照。クラスは vnj- プレフィックスで
   SWELL本体と衝突しないようにしています。カスタム領域は <div class="vnj">…</div>
   で包むとさらに安全です。
   ========================================================================= */

.vnj{color:var(--vnj-text);font-family:var(--vnj-ff-body);line-height:1.7}
.vnj *{box-sizing:border-box}
/* 実アイキャッチ画像（カバー）。.th / .img などの相対配置枠を埋める */
.vnj .vnj-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vnj .vnj-cover-ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--vnj-faint);font-family:var(--vnj-ff-mono);font-size:11px}

/* 任意：背景の雰囲気（赤/シアンのグロー）。bodyやラッパーに付与 */
.vnj-atmos{position:relative}
.vnj-atmos::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background:radial-gradient(1100px 600px at 80% -10%,rgba(255,70,85,.10),transparent 60%),
             radial-gradient(900px 500px at -10% 110%,rgba(24,229,196,.06),transparent 60%)}

/* ---------- 見出し（記事タイトル型・確定） ---------- */
.vnj .vnj-heading{display:flex;flex-direction:column}
.vnj .vnj-heading .cat{align-self:flex-start;font-family:var(--vnj-ff-disp);font-weight:600;font-size:10px;
  letter-spacing:.16em;color:var(--vnj-on);background:var(--vnj-red);padding:4px 11px;clip-path:var(--vnj-clip-tab)}
.vnj .vnj-heading h1,.vnj .vnj-heading h2{font-family:var(--vnj-ff-head);font-weight:900;font-size:clamp(22px,3vw,28px);
  line-height:1.22;margin:13px 0 10px;letter-spacing:-.01em}
.vnj .vnj-heading .meta{display:flex;gap:14px;font-family:var(--vnj-ff-mono);font-size:10px;color:var(--vnj-faint);
  letter-spacing:.1em;text-transform:uppercase}
.vnj .vnj-heading .meta a{color:inherit;text-decoration:none;transition:color .2s}
.vnj .vnj-heading .meta a:hover{color:var(--vnj-red)}

/* ---------- セクション見出し（キッカー＋細罫） ---------- */
.vnj .vnj-mh{margin:0 0 14px}
.vnj .vnj-mh .kicker{font-family:var(--vnj-ff-mono);font-size:10px;letter-spacing:.3em;color:var(--vnj-red);text-transform:uppercase}
.vnj .vnj-mh .row{display:flex;align-items:center;gap:12px;margin-top:6px}
.vnj .vnj-mh h3{font-family:var(--vnj-ff-head);font-weight:700;font-size:18px;letter-spacing:.01em}
.vnj .vnj-mh .ln{height:1px;background:var(--vnj-line-strong);flex:1}
.vnj .vnj-mh .more{font-family:var(--vnj-ff-mono);font-size:9px;letter-spacing:.18em;color:var(--vnj-dim);flex:none}

/* ---------- LIVE ティッカー（ミニマル・スコアは等幅） ---------- */
.vnj .vnj-ticker{display:flex;align-items:stretch;border-top:1px solid var(--vnj-line);border-bottom:1px solid var(--vnj-line);background:transparent;overflow:hidden;margin-bottom:22px}
.vnj .vnj-ticker .badge{display:flex;align-items:center;gap:7px;font-family:var(--vnj-ff-mono);font-size:9px;letter-spacing:.2em;color:var(--vnj-red);padding:0 14px;flex:none}
.vnj .vnj-ticker .badge i{width:6px;height:6px;border-radius:50%;background:var(--vnj-red);animation:vnj-blink 1.4s infinite}
/* ドラッグ可のカルーセル軌道（スクロールバー非表示） */
.vnj .vnj-ticker__track{display:flex;align-items:center;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;cursor:grab;scroll-behavior:smooth}
.vnj .vnj-ticker__track::-webkit-scrollbar{display:none}
.vnj .vnj-ticker__track.dragging{cursor:grabbing;scroll-behavior:auto}
.vnj .vnj-ticker .tk{display:flex;align-items:center;gap:8px;padding:9px 16px;border-left:1px solid var(--vnj-line);flex:none;
  font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;white-space:nowrap;color:var(--vnj-dim);user-select:none}
.vnj .vnj-ticker .tk b{color:var(--vnj-text)}
.vnj .vnj-ticker .tk .d{font-family:var(--vnj-ff-mono);font-weight:500;font-size:10px;letter-spacing:.04em;color:var(--vnj-faint)}
.vnj .vnj-ticker .tk .d.live{color:var(--vnj-red)}
.vnj .vnj-ticker .tk .vs{font-family:var(--vnj-ff-mono);font-weight:500;font-size:10px;color:var(--vnj-faint)}
.vnj .vnj-ticker .tk .sc{font-family:var(--vnj-ff-mono);font-weight:500;font-size:12px;letter-spacing:.05em;color:var(--vnj-text)}
.vnj .vnj-ticker .tk.live .sc{color:var(--vnj-red);animation:vnj-blink 1.4s infinite}
/* スケジュールページへのリンク（右端固定） */
/* スケジュールボタン＝控えめ（通常文字色＋赤い矢印だけアクセント・ホバーで文字も赤） */
.vnj .vnj-ticker__more{display:flex;align-items:center;gap:6px;flex:none;padding:0 16px;border-left:1px solid var(--vnj-line);background:var(--vnj-bg);font-family:var(--vnj-ff-mono);font-size:10px;letter-spacing:.12em;color:var(--vnj-text);text-decoration:none;white-space:nowrap;transition:color .2s}
.vnj .vnj-ticker__more span{color:var(--vnj-red);font-size:14px;line-height:1;transition:transform .2s}
.vnj .vnj-ticker__more:hover{color:var(--vnj-red)}
.vnj .vnj-ticker__more:hover span{transform:translateX(3px)}
@keyframes vnj-blink{0%,100%{opacity:1}50%{opacity:.25}}

/* ---------- ヒーロー ---------- */
.vnj .vnj-hero{position:relative;background:linear-gradient(135deg,var(--vnj-panel-2),var(--vnj-bg-2));
  border:1px solid var(--vnj-line);overflow:hidden;display:flex;align-items:flex-end;padding:22px;aspect-ratio:16/8;
  /* アイキャッチ(背景画像)を枠線の内側で止める。border-box(既定)だと半透明な枠線の下に元画像が描画され、
     暗いグラデーション(::before inset:0=padding box)が枠線部分を覆わないため、下端に元画像が約1pxはみ出して見える。
     padding-box でグラデーションと背景描画域を一致させて解消。 */
  background-clip:padding-box}
.vnj .vnj-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 60%),linear-gradient(120deg,transparent 55%,rgba(255,70,85,.18))}
.vnj .vnj-hero .cap{position:relative;z-index:2}
.vnj .vnj-hero .cap .cat{font-family:var(--vnj-ff-disp);font-weight:600;font-size:10px;letter-spacing:.16em;color:var(--vnj-red);background:rgba(0,0,0,.4);padding:3px 9px;display:inline-block;margin-bottom:8px}
.vnj .vnj-hero .cap h2{font-family:var(--vnj-ff-head);font-weight:700;font-size:clamp(16px,2.1vw,20px);line-height:1.2;color:#fff;max-width:90%}

/* ---------- 固定記事（ヒーロー下・3枠） ---------- */
.vnj .vnj-pin-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}
.vnj .vnj-pin{background:var(--vnj-panel);border:1px solid var(--vnj-line);overflow:hidden;position:relative;transition:transform .2s,border-color .2s}
.vnj .vnj-pin:hover{transform:translateY(-2px);border-color:var(--vnj-red)}
.vnj .vnj-pin.is-pr{border-top:2px solid var(--vnj-gold)}
.vnj .vnj-pin .img{aspect-ratio:16/9;background:linear-gradient(135deg,var(--vnj-panel-2),var(--vnj-bg-2));position:relative}
/* 画像上のバッジ＝常に暗地に明色（テーマ非依存）。--vnj-text だとライトで濃地に濃文字になり読めないため固定色に */
.vnj .vnj-pin .flag{position:absolute;top:8px;left:8px;display:flex;align-items:center;gap:5px;font-family:var(--vnj-ff-mono);font-size:8px;letter-spacing:.14em;color:#fff;background:rgba(11,19,28,.72);padding:3px 8px}
.vnj .vnj-pin.is-pr .flag{color:#E6B450}
.vnj .vnj-pin .m{padding:12px 13px 15px}
.vnj .vnj-pin .m h4{font-family:var(--vnj-ff-head);font-weight:700;font-size:13px;line-height:1.4}

/* ---------- 最新ニュース：CLASSIC ROW（確定・横長） ---------- */
.vnj .vnj-feed .vnj-row{display:flex;gap:18px;padding:16px 0;border-bottom:1px solid var(--vnj-line);align-items:flex-start;position:relative}
.vnj .vnj-feed .vnj-row::before{content:"";position:absolute;left:-26px;top:16px;bottom:16px;width:3px;background:var(--vnj-red);opacity:0;transition:opacity .2s}
.vnj .vnj-feed .vnj-row:hover::before{opacity:1}
.vnj .vnj-row .th{width:208px;aspect-ratio:16/9;flex:none;background:linear-gradient(135deg,var(--vnj-panel-2),var(--vnj-bg-2));position:relative;overflow:hidden}
.vnj .vnj-row .b{flex:1;min-width:0}
/* カテゴリー＝色付きタグ（カテゴリー色の薄い背景ピル）。背景は currentColor のティント＝inlineの --cat-* に追従 */
.vnj .vnj-row .th{position:relative}
.vnj .vnj-row .c{position:absolute;top:8px;left:8px;z-index:2;font-family:var(--vnj-ff-disp);font-weight:700;font-size:9px;letter-spacing:.08em;text-transform:uppercase;line-height:1;color:var(--vnj-on);background:var(--vnj-red);padding:3px 11px 3px 8px;clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.vnj .vnj-row h4{font-family:var(--vnj-ff-article);font-weight:700;font-size:calc(16px*var(--vnj-fs));line-height:1.4;margin:0 0 7px;transition:color .2s}
.vnj .vnj-row:hover h4{color:var(--vnj-red)}
.vnj .vnj-row h4 a{color:var(--vnj-text);text-decoration:none;transition:color .2s}
.vnj .vnj-row:hover h4 a{color:var(--vnj-red)}
.vnj .vnj-row .ex{font-family:var(--vnj-ff-article);font-size:12px;color:var(--vnj-dim);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vnj .vnj-row .meta{display:flex;flex-wrap:wrap;align-items:center;gap:7px 13px;font-family:var(--vnj-ff-mono);font-size:9px;letter-spacing:.1em;color:var(--vnj-faint);margin-top:9px;text-transform:uppercase}
.vnj .vnj-row .meta .tag{color:var(--vnj-dim)}
.vnj .vnj-row .meta .cat{font-family:var(--vnj-ff-disp);font-weight:700;font-size:9px;letter-spacing:.08em;line-height:1;padding:3px 9px 3px 8px;text-decoration:none;clip-path:var(--vnj-clip-tab);transition:filter .15s}
.vnj .vnj-row .meta .cat:hover{filter:brightness(1.12)}

/* もっと読む → ページネーション（ハイブリッド） */
.vnj .vnj-loadmore{display:flex;justify-content:center;margin-top:20px}
.vnj .vnj-loadmore button{font-family:var(--vnj-ff-disp);font-weight:600;font-size:12px;letter-spacing:.18em;color:var(--vnj-text);
  display:inline-flex;align-items:center;justify-content:center;line-height:1;
  background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);padding:16px 38px 12px;cursor:pointer;text-transform:uppercase;clip-path:var(--vnj-clip-btn)}
.vnj .vnj-loadmore button:hover{border-color:var(--vnj-red);color:var(--vnj-red)}
.vnj .vnj-pager{display:flex;gap:6px;justify-content:center;margin-top:20px}
.vnj .vnj-pager a{font-family:var(--vnj-ff-disp);font-weight:600;font-size:12px;min-width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--vnj-line-strong);color:var(--vnj-dim);cursor:pointer;text-decoration:none}
.vnj .vnj-pager a.on{background:var(--vnj-red);color:var(--vnj-on);border-color:var(--vnj-red)}
.vnj .vnj-pager a:hover:not(.on){border-color:var(--vnj-red);color:var(--vnj-red)}

/* ---------- 広告枠 ---------- */
.vnj .vnj-ad{border:1px dashed var(--vnj-line-strong);background:repeating-linear-gradient(45deg,transparent,transparent 9px,rgba(136,155,168,.05) 9px,rgba(136,155,168,.05) 18px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--vnj-faint)}
.vnj .vnj-ad::before{content:"広告 / AD";font-family:var(--vnj-ff-disp);font-weight:700;font-size:11px;letter-spacing:.22em}
.vnj .vnj-ad span{font-family:var(--vnj-ff-mono);font-size:9px;letter-spacing:.1em}
.vnj .vnj-ad.lead{height:90px}
.vnj .vnj-ad.rect{aspect-ratio:300/250}
.vnj .vnj-ad.box{min-height:120px}
/* 実広告（AdSense等）の入れ物。コード無しの枠は出力されないので空き対策も */
.vnj .vnj-ad-slot{margin:0 0 18px;text-align:center}
.vnj .vnj-ad-slot:empty{display:none}
/* AdSense の ins は幅・高さを縛らない（レスポンシブ/全幅を妨げないため）。画像広告だけ枠内に収める */
.vnj .vnj-ad-slot img{max-width:100%;height:auto}
/* 記事内（In-article）＝本文中央に。CLS防止に高さ予約 */
.vnj .vnj-ad.inart,.vnj .vnj-ad-slot.inart{max-width:336px;min-height:250px;margin:26px auto}
/* サイドバー＝サンプルは300×600想定／実広告は最低250px予約。PCでは追従(sticky) */
.vnj .vnj-ad.side{min-height:600px;max-width:300px;margin-left:auto;margin-right:auto}
.vnj .vnj-ad-slot.side{min-height:250px}
@media(min-width:861px){.vnj .vnj-sidebar .vnj-ad.side,.vnj .vnj-sidebar .vnj-ad-slot.side{position:sticky;top:80px}}
.vnj .vnj-pv-ads2:empty{display:none}
/* 記事内・コメント下＝PCはリーダーボード(横長)、SPは矩形（レスポンシブ広告想定の高さ予約） */
.vnj .vnj-ad.lb,.vnj .vnj-ad-slot.lb{min-height:90px}
@media(max-width:600px){.vnj .vnj-ad.lb,.vnj .vnj-ad-slot.lb{min-height:250px}}
/* 上部(lead)・矩形(rect)の実広告にも高さを予約＝広告の遅延読み込みでページが下にずれて
   「押した要素が動いてタップが外れる」現象（CLS）を防ぐ。スマホの上部広告は実測250pxなので合わせる。 */
.vnj .vnj-ad-slot.lead{min-height:100px}
.vnj .vnj-ad-slot.rect{min-height:250px}
@media(max-width:600px){.vnj .vnj-ad-slot.lead{min-height:250px}}
/* サイドバー広告はスマホでは非表示（追従枠がコメント下に出るのを防止） */
@media(max-width:860px){.vnj .vnj-sidebar .vnj-ad,.vnj .vnj-sidebar .vnj-ad-slot{display:none}}
/* スマホ：全幅レスポンシブ広告(data-full-width-responsive)が枠のoverflow:hidden＋幅キャップで右側が見切れる対策。
   はみ出しを切らない＋ins幅キャップ解除で、AdSenseの全幅広告が画面端まで正しく表示されるようにする。
   ※サイドバー広告(.side)はスマホ非表示なので影響なし。 */
@media(max-width:600px){.vnj .vnj-ad-slot{overflow:visible}.vnj .vnj-ad-slot ins.adsbygoogle{max-width:none}}

/* ---------- サイドバー ウィジェット ---------- */
.vnj .vnj-widget{background:var(--vnj-panel);border:1px solid var(--vnj-line);padding:16px}
.vnj .vnj-widget .wh{display:flex;align-items:center;gap:8px;font-family:var(--vnj-ff-disp);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:13px}
.vnj .vnj-widget .wh::before{content:"";width:4px;height:13px;background:var(--vnj-red)}
.vnj .vnj-widget .wh s{margin-left:auto;font-family:var(--vnj-ff-mono);font-size:8px;color:var(--vnj-cyan);text-decoration:none;letter-spacing:.1em;cursor:pointer}
.vnj .vnj-rank{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--vnj-line);align-items:center}
.vnj .vnj-rank:last-child{border:0}
.vnj .vnj-rank b{font-family:var(--vnj-ff-num);font-size:17px;color:var(--vnj-red);width:18px;line-height:.8}
.vnj .vnj-rank span{font-family:var(--vnj-ff-head);font-weight:500;font-size:11px;line-height:1.35}
/* ランダム・プロ使用デバイス */
.vnj .vnj-rnddev .img{aspect-ratio:16/10;background:linear-gradient(135deg,var(--vnj-panel-2),var(--vnj-bg-2));border:1px solid var(--vnj-line-strong);margin-bottom:10px}
.vnj .vnj-rnddev .pl{font-family:var(--vnj-ff-head);font-weight:700;font-size:14px}
.vnj .vnj-rnddev .dv{font-family:var(--vnj-ff-mono);font-size:10px;color:var(--vnj-dim);margin-top:4px}
.vnj .vnj-rnddev .dv b{color:var(--vnj-cyan)}
/* セール */
.vnj .vnj-deal{display:flex;align-items:center;gap:11px;padding:8px 0;border-bottom:1px solid var(--vnj-line)}
.vnj .vnj-deal:last-child{border:0}
.vnj .vnj-deal .img{width:36px;height:36px;background:var(--vnj-panel-2);border:1px solid var(--vnj-line-strong);flex:none}
.vnj .vnj-deal .n{font-family:var(--vnj-ff-head);font-weight:500;font-size:11px;line-height:1.3}
.vnj .vnj-deal .p{margin-left:auto;text-align:right}
.vnj .vnj-deal .p .off{font-family:var(--vnj-ff-num);font-size:19px;color:var(--vnj-red);line-height:.8}
.vnj .vnj-deal .p .px{font-family:var(--vnj-ff-mono);font-size:9px;color:var(--vnj-faint)}

/* ---------- 記事ページ（COMMERCE SIDE：シェアレール＋本文＋サイド） ---------- */
.vnj .vnj-article{display:grid;grid-template-columns:46px 1fr 300px;gap:20px}
.vnj .vnj-share-rail{display:flex;flex-direction:column;gap:10px;align-items:center}
.vnj .vnj-share-rail .sb{width:38px;height:38px;border:1px solid var(--vnj-line-strong);display:grid;place-items:center;color:var(--vnj-dim);font-size:14px;cursor:pointer}
.vnj .vnj-share-rail .sb:hover{border-color:var(--vnj-red);color:var(--vnj-red)}
.vnj .vnj-share-rail .lbl{font-family:var(--vnj-ff-mono);font-size:8px;letter-spacing:.2em;color:var(--vnj-faint);writing-mode:vertical-rl;margin-top:4px}
.vnj .vnj-sidebar{display:flex;flex-direction:column;gap:16px}
/* 記事サイドバーは本文の高さまで伸ばす＝最下部の追従広告(side_sticky)がスクロールで動ける余地を作る（.vnj-pv-cols は align-items:start のため明示） */
@media(min-width:861px){.vnj .vnj-pv-cols--article .vnj-sidebar{align-self:stretch}}
/* 目次＝SWELL標準（.p-toc）をVNJデザインに。SWELLは空の .p-toc + .p-toc__ttl だけ出力し、
   本文が .vnj-pv-abody（SWELLのJSが拾えない）なので single.php のインラインJSが
   見出しから .p-toc__list を生成する。下のレベル別インデントもそのJS出力に対応。 */
.vnj .p-toc{background:var(--vnj-panel);border:1px solid var(--vnj-line);border-radius:0;padding:16px 20px 14px;margin:8px 0 30px;font-family:var(--vnj-ff-body);box-shadow:none}
.vnj .p-toc__ttl{display:flex;align-items:center;gap:8px;writing-mode:horizontal-tb;font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--vnj-text2,var(--vnj-dim));margin:0 0 9px;padding:0;border:0;background:none}
.vnj .p-toc__ttl::before{content:"";width:4px;height:14px;border-radius:0;background:var(--vnj-red);flex:none}
.vnj .p-toc ol,.vnj .p-toc ul{margin:0;padding:0;list-style:none;counter-reset:none}
.vnj .p-toc li{margin:0;padding:0;background:none}
.vnj .p-toc li::before,.vnj .p-toc li::marker{content:none;display:none}
.vnj .p-toc a,.vnj .p-toc__link{display:block;font-size:12px;font-weight:400;color:var(--vnj-dim);padding:6px 0 6px 14px;border-left:2px solid var(--vnj-line);text-decoration:none;line-height:1.5;transition:color .15s,border-color .15s}
.vnj .p-toc a:hover,.vnj .p-toc__link:hover{color:var(--vnj-text);border-left-color:var(--vnj-red)}
.vnj .p-toc__item.is-h3 .p-toc__link{padding-left:26px;font-size:11.5px}
.vnj .p-toc__item.is-h4 .p-toc__link{padding-left:40px;font-size:11.5px}
.vnj .p-toc__item.is-h3 .p-toc__link::before,.vnj .p-toc__item.is-h4 .p-toc__link::before{content:"\2013\00a0";color:var(--vnj-faint)}
.vnj .p-toc a.is-active,.vnj .p-toc__link.is-active{color:var(--vnj-red);border-left-color:var(--vnj-red)}
.vnj .p-toc__expand{color:var(--vnj-faint);background:none}

/* ---------- コメント（A THREADED） ---------- */
.vnj .vnj-comments .cm-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.vnj .vnj-comments .cm-head .b{width:5px;height:20px;background:var(--vnj-red);clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 6px))}
.vnj .vnj-comments .cm-head h3{font-family:var(--vnj-ff-disp);font-weight:700;font-size:17px;letter-spacing:.08em;text-transform:uppercase;color:var(--vnj-text);padding-left:13px;border-left:3px solid var(--vnj-red);line-height:1.25}
.vnj .vnj-comments .cm-head .cnt{font-family:var(--vnj-ff-mono);font-size:11px;color:var(--vnj-dim);letter-spacing:.05em}
.vnj .vnj-comments .sort{margin-left:auto;display:flex;gap:2px;border:1px solid var(--vnj-line);padding:3px}
.vnj .vnj-comments .sort button{font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;color:var(--vnj-dim);background:none;border:none;padding:6px 12px;cursor:pointer}
.vnj .vnj-comments .sort button.on{background:var(--vnj-red);color:var(--vnj-on)}

.vnj .vnj-av{flex:none;width:40px;height:40px;display:grid;place-items:center;font-family:var(--vnj-ff-disp);font-weight:700;font-size:17px;color:#fff;clip-path:polygon(0 0,100% 0,100% 78%,78% 100%,0 100%)}

.vnj .vnj-comments .cmt{display:grid;grid-template-columns:40px 1fr;gap:13px;padding:22px 0;border-bottom:1px solid var(--vnj-line)}
.vnj .vnj-comments .replies{grid-column:1/-1;margin-top:10px;padding-left:clamp(9px,2.8vw,16px);border-left:1px solid var(--vnj-line-strong)}
/* 4段目以降はインデントも縦線も足さない＝深い返信チェーンでも窮屈にしない（関係は ↳@相手名 で示す） */
.vnj .vnj-comments .replies .replies .replies .replies{padding-left:0;border-left:none}
.vnj .vnj-comments .replies .cmt{padding:15px 0;border-bottom:0;grid-template-columns:30px 1fr;gap:11px}
.vnj .vnj-comments .replies .vnj-av{width:30px;height:30px;font-size:13px}
.vnj .vnj-comments .cmt-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.vnj .vnj-comments .cmt-h .name{font-family:var(--vnj-ff-head);font-weight:700;font-size:13px}
.vnj .vnj-comments .uid{font-family:var(--vnj-ff-mono);font-size:9.5px;color:var(--vnj-faint);cursor:pointer;border-bottom:1px dotted var(--vnj-faint)}
.vnj .vnj-comments .uid:hover{color:var(--vnj-cyan);border-color:var(--vnj-cyan)}
.vnj .vnj-comments .cmt.hl{background:rgba(24,229,196,.05);background:color-mix(in srgb,var(--vnj-cyan) 5%,transparent)}
/* ジャンプ時の一瞬フラッシュ（color-mix 非対応は rgba フォールバック・色はテーマの --vnj-cyan に追従） */
@keyframes vnj-flash{0%{background:rgba(24,229,196,.16);background:color-mix(in srgb,var(--vnj-cyan) 16%,transparent)}100%{background:transparent}}
/* 固有IDジャンプ＝発光後そのまま常光(.hl=5%)に着地（途中で消えて再点灯しない／着地色もテーマ追従） */
@keyframes vnj-flash-hold{0%{background:rgba(24,229,196,.16);background:color-mix(in srgb,var(--vnj-cyan) 16%,transparent)}100%{background:rgba(24,229,196,.05);background:color-mix(in srgb,var(--vnj-cyan) 5%,transparent)}}
.vnj .vnj-comments .cmt.flash{animation:vnj-flash 1.4s ease-out;border-radius:3px}
.vnj .vnj-comments .cmt.hl.flash{animation:vnj-flash-hold 1.4s ease-out}
.vnj .vnj-comments .time{font-family:var(--vnj-ff-mono);font-size:9px;color:var(--vnj-faint);margin-left:auto}
.vnj .vnj-comments .reply-ref{display:inline-flex;align-items:center;gap:4px;max-width:100%;margin-bottom:6px;padding:0;background:none;border:none;clip-path:none;font-family:var(--vnj-ff-disp);font-size:11px;line-height:1.3;color:var(--vnj-dim);cursor:pointer}
.vnj .vnj-comments .reply-ref .nm{flex:none;font-weight:700;color:var(--vnj-cyan)}
.vnj .vnj-comments .reply-ref:hover .nm{text-decoration:underline}
/* 頭打ち以降は返信先を引用（名前＋本文抜粋）で明示＝匿名が多くても誰宛か分かる */
.vnj .vnj-comments .reply-ref--quote{display:flex;gap:5px;padding:5px 9px;background:var(--vnj-panel-2);border-left:2px solid var(--vnj-cyan);clip-path:var(--vnj-clip-btn);font-family:var(--vnj-ff-body);font-size:10.5px}
.vnj .vnj-comments .reply-ref--quote:hover{background:var(--vnj-panel)}
.vnj .vnj-comments .reply-ref--quote:hover .nm{text-decoration:none}
.vnj .vnj-comments .reply-ref--quote .ex{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--vnj-dim);font-family:var(--vnj-ff-body)}
.vnj .vnj-comments .cmt-text{font-size:calc(13.5px*var(--vnj-fs));line-height:1.75;word-break:break-word}
.vnj .vnj-comments .cmt-text p{margin:0 0 6px}.vnj .vnj-comments .cmt-text p:last-child{margin:0}
.vnj .vnj-comments .cmt-text .cm-link{color:var(--vnj-cyan);text-decoration:none;border-bottom:1px solid rgba(24,229,196,.4)}
.vnj .vnj-comments .hidden-mask{display:flex;align-items:center;gap:8px;justify-content:center;padding:11px 14px;background:var(--vnj-panel-2);border:1px dashed var(--vnj-faint);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;color:var(--vnj-dim);cursor:pointer}
/* フラグ */
.vnj .vnj-flair{font-family:var(--vnj-ff-disp);font-weight:600;font-size:9px;letter-spacing:.06em;color:#fff;padding:2px 7px}
.vnj .vnj-agflair{display:inline-flex;align-items:center;gap:5px;font-family:var(--vnj-ff-disp);font-weight:600;font-size:10px;padding:1px 8px 1px 2px;border-radius:11px;border:1px solid}
.vnj .vnj-agflair .dot{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:8px;font-weight:700;color:#fff}
/* 編集部（公式）マーク：丸シール＋チェック。モノトーン＝テーマ追従（ダーク白/ライト黒/blaze赤） */
.vnj .vnj-comments .vnj-edbadge{display:inline-flex;flex:none;width:14px;height:14px;line-height:0}
.vnj .vnj-comments .vnj-edbadge svg{width:14px;height:14px;display:block}
.vnj .vnj-comments .vnj-edbadge circle{fill:var(--vnj-red)}
.vnj .vnj-comments .vnj-edbadge path{stroke:var(--vnj-on)}
/* リアクション */
.vnj .vnj-rxbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:9px}
.vnj .vnj-rx{display:flex;align-items:center;gap:5px;background:var(--vnj-panel-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-dim);font-family:var(--vnj-ff-mono);font-size:12px;padding:3px 9px;cursor:pointer;border-radius:2px}
.vnj .vnj-rx span{font-size:10px}.vnj .vnj-rx:hover{border-color:var(--vnj-cyan)}
.vnj .vnj-rx.mine{border-color:var(--vnj-red);color:var(--vnj-text);background:rgba(255,70,85,.1)}
.vnj .vnj-rx-add{width:26px;height:24px;display:grid;place-items:center;background:none;border:1px dashed var(--vnj-line-strong);color:var(--vnj-faint);cursor:pointer;font-size:14px;border-radius:2px}
.vnj .vnj-rx-add:hover{border-color:var(--vnj-cyan);color:var(--vnj-cyan)}
.vnj .vnj-comments .cmt-act{display:flex;align-items:center;gap:16px;margin-top:8px}
.vnj .vnj-comments .cmt-act button{display:flex;align-items:center;gap:5px;background:none;border:none;color:var(--vnj-dim);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;line-height:1;cursor:pointer}
.vnj .vnj-comments .cmt-act .rep{position:relative;top:1.5px}
.vnj .vnj-comments .cmt-act .rep:hover{color:var(--vnj-cyan)}
.vnj .vnj-comments .cmt-act .report{margin-left:auto;color:var(--vnj-faint)}
.vnj .vnj-comments .cmt-act .report:hover{color:var(--vnj-red)}
.vnj .vnj-comments .cmt-act .react{padding:0;color:var(--vnj-dim)}
.vnj .vnj-comments .cmt-act .react svg{width:16px;height:16px;display:block}
.vnj .vnj-comments .cmt-act .react:hover{color:var(--vnj-cyan)}
.vnj .vnj-comments .cmt-act .report.reported{color:var(--vnj-faint);opacity:.7;cursor:default}
.vnj .vnj-comments .cmt-act .report{position:relative;top:1.5px}
.vnj .vnj-comments .reply-form{display:none;margin-top:10px}
.vnj .vnj-comments .reply-form.show{display:block}
.vnj .vnj-comments .reply-form .vnj-composer{margin-bottom:0}
.vnj .vnj-comments .reply-form textarea{width:100%;min-height:54px;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-family:var(--vnj-ff-body);font-size:13px;padding:9px 11px;outline:none;resize:vertical}
.vnj .vnj-comments .reply-form .rcancel{background:none;border:none;color:var(--vnj-faint);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;cursor:pointer}
.vnj .vnj-comments .reply-form .rcancel:hover{color:var(--vnj-red)}

/* ---------- 入力フォーム（AVATAR COMPOSER：装飾なし＋絵文字＋埋め込み） ---------- */
.vnj .vnj-composer{background:var(--vnj-panel);border:1px solid var(--vnj-line);padding:16px;margin-bottom:8px}
.vnj .vnj-composer .top{display:grid;grid-template-columns:40px 1fr;gap:12px}
.vnj .vnj-composer .name{background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-family:var(--vnj-ff-body);font-size:12.5px;padding:7px 11px;outline:none;width:100%;max-width:400px;margin-bottom:9px}
.vnj .vnj-composer .name:focus{border-color:var(--vnj-red)}
.vnj .vnj-composer .name:disabled{opacity:.45;cursor:not-allowed}
/* 投稿者アイデンティティ行（アバター＋名前＋🎲） */
.vnj .vnj-composer .idrow{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.vnj .vnj-composer .idrow .idav{flex:none;display:inline-flex}
.vnj .vnj-composer .idrow .name{flex:1;max-width:none;margin-bottom:0}
.vnj .vnj-composer .dice{flex:none;width:36px;height:36px;display:grid;place-items:center;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-dim);font-size:16px;line-height:1;cursor:pointer}
.vnj .vnj-composer .dice:hover{border-color:var(--vnj-cyan);color:var(--vnj-cyan)}
.vnj .vnj-composer .dice{touch-action:manipulation}
/* 匿名ボタン（サイコロの隣・空欄＝匿名にするショートカット） */
.vnj .vnj-composer .anon{flex:none;height:36px;padding:3px 13px 0;display:grid;place-items:center;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-dim);font-family:var(--vnj-ff-disp);font-weight:600;font-size:12px;line-height:1;cursor:pointer;touch-action:manipulation}
.vnj .vnj-composer .anon:hover{border-color:var(--vnj-cyan);color:var(--vnj-cyan)}
/* コメントの操作ボタン（返信・通報・リアクション）をモバイルでも確実にタップできるように */
.vnj .vnj-comments .cmt-act button{touch-action:manipulation;min-height:32px}
/* 匿名・ランダム名の共通アバター＝人型シルエット（全員同一・色変化なし） */
.vnj .vnj-anonav{background:var(--vnj-panel-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-faint)}
.vnj .vnj-anonav svg{display:block;width:60%;height:60%}
/* 投稿プレビューのラベル（▶ はシアン） */
.vnj .vnj-composer .cz-prevbox{margin-top:14px;border:1px dashed var(--vnj-line-strong);background:var(--vnj-bg-2);padding:13px}
.vnj .vnj-composer .cz-prevlabel{display:flex;align-items:center;gap:6px;margin:0 0 9px;font-family:var(--vnj-ff-mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--vnj-faint)}
.vnj .vnj-composer .cz-prevlabel .mk{color:var(--vnj-cyan)}
.vnj .vnj-composer .toolbar{display:flex;gap:6px;margin-bottom:9px}
.vnj .vnj-composer .toolbar button{height:34px;display:flex;align-items:center;gap:6px;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-dim);cursor:pointer;font-size:11px;font-family:var(--vnj-ff-disp);font-weight:600;padding:0 12px}
.vnj .vnj-composer .toolbar button:hover{border-color:var(--vnj-cyan);color:var(--vnj-cyan)}
.vnj .vnj-composer textarea{width:100%;min-height:80px;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-family:var(--vnj-ff-body);font-size:13.5px;line-height:1.7;padding:12px;outline:none;resize:vertical}
.vnj .vnj-composer textarea:focus{border-color:var(--vnj-red)}
.vnj .vnj-composer .flair{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px;align-items:center}
.vnj .vnj-seg{display:flex;border:1px solid var(--vnj-line-strong)}
.vnj .vnj-seg button{font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;color:var(--vnj-dim);background:none;border:none;padding:6px 11px;cursor:pointer;border-right:1px solid var(--vnj-line-strong)}
.vnj .vnj-seg button:last-child{border-right:0}.vnj .vnj-seg button.on{background:var(--vnj-red);color:var(--vnj-on)}
.vnj .vnj-composer .flair::before{content:"推しフラグ";font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;letter-spacing:.04em;color:var(--vnj-faint);margin-right:2px}
/* チーム選択・エージェント選択は同じ <select> UI に統一 */
.vnj .vnj-composer .agent,.vnj .vnj-composer .teaminput{background-color:var(--vnj-bg-2);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%238B9BA8' stroke-width='1.6'><path d='M1 1l4 4 4-4'/></svg>");background-repeat:no-repeat;background-position:right 10px center;border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;letter-spacing:.02em;padding:6px 28px 6px 11px;cursor:pointer;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.vnj .vnj-composer .agent:focus,.vnj .vnj-composer .teaminput:focus{border-color:var(--vnj-red)}
.vnj .vnj-composer .agent optgroup{background:var(--vnj-panel);color:var(--vnj-faint)}
.vnj .vnj-composer .agent option,.vnj .vnj-composer .teaminput option{background:var(--vnj-panel);color:var(--vnj-text)}
/* チーム検索コンボボックス（見た目はセレクト風＋入力で絞り込みドロップダウン） */
.vnj .vnj-composer .vnj-tcb{position:relative;display:inline-block}
.vnj .vnj-composer .vnj-tcb .teaminput{width:184px;max-width:100%}
.vnj .vnj-composer .vnj-tcb__list{position:absolute;left:0;top:calc(100% + 4px);z-index:6;min-width:100%;max-height:206px;overflow:auto;background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);box-shadow:0 14px 34px -16px var(--vnj-shadow);clip-path:var(--vnj-clip-btn);padding:4px}
.vnj .vnj-composer .vnj-tcb__list[hidden]{display:none}
.vnj .vnj-composer .vnj-tcb__opt{display:block;width:100%;text-align:left;background:none;border:none;color:var(--vnj-text);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;letter-spacing:.02em;padding:7px 10px;cursor:pointer}
.vnj .vnj-composer .vnj-tcb__opt:hover,.vnj .vnj-composer .vnj-tcb__opt.on{background:var(--vnj-bg-2);color:var(--vnj-red)}
.vnj .vnj-composer .vnj-tcb__empty{padding:7px 10px;color:var(--vnj-faint);font-size:11px}
.vnj .vnj-tcb__group{padding:8px 10px 4px;font-family:var(--vnj-ff-disp);font-weight:700;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--vnj-dim);border-top:1px solid var(--vnj-line);margin-top:3px;pointer-events:none}
.vnj .vnj-tcb__group:first-child{border-top:none;margin-top:0}
.vnj .vnj-composer .post{display:inline-block;text-align:center;line-height:1;font-family:var(--vnj-ff-disp);font-weight:700;font-size:12px;letter-spacing:.12em;color:var(--vnj-on);background:var(--vnj-red);border:none;padding:12px 24px 8px;cursor:pointer;text-transform:uppercase;clip-path:var(--vnj-clip-btn)}
.vnj .vnj-composer .post:disabled{opacity:.4;cursor:not-allowed}
.vnj .vnj-composer .reply-target{display:none}
.vnj .vnj-composer .reply-target.show{display:flex;align-items:center;gap:8px;margin-bottom:11px;padding:7px 11px;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);border-left:3px solid var(--vnj-red);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;color:var(--vnj-dim)}
.vnj .vnj-composer .reply-target b{color:var(--vnj-cyan)}
.vnj .vnj-composer .reply-target .cancel{margin-left:auto;background:none;border:none;color:var(--vnj-faint);cursor:pointer;font-size:13px;line-height:1}
.vnj .vnj-composer .reply-target .cancel:hover{color:var(--vnj-red)}

/* ---------- 埋め込み（YouTube / X / Twitch） ---------- */
.vnj .vnj-yt{margin:10px 0;max-width:440px}
.vnj .vnj-yt .thumb{position:relative;aspect-ratio:16/9;background:var(--vnj-panel-2) center/cover no-repeat;border:1px solid var(--vnj-line-strong);cursor:pointer;overflow:hidden}
.vnj .vnj-yt .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.4),transparent 60%)}
.vnj .vnj-yt .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:36px;background:rgba(255,70,85,.92);border:none;color:#fff;font-size:15px;cursor:pointer;border-radius:7px;z-index:2;display:grid;place-items:center}
.vnj .vnj-yt .badge{position:absolute;left:10px;bottom:8px;z-index:2;font-family:var(--vnj-ff-disp);font-weight:700;font-size:9px;letter-spacing:.1em;color:#fff;background:rgba(0,0,0,.6);padding:3px 8px}
.vnj .vnj-yt .frame{position:relative;aspect-ratio:16/9}
.vnj .vnj-yt .frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vnj .vnj-emb{margin:10px 0;max-width:440px;border:1px solid var(--vnj-line-strong);background:var(--vnj-panel);overflow:hidden}
.vnj .vnj-emb .h{display:flex;align-items:center;gap:11px;padding:11px 13px}
.vnj .vnj-emb .logo{width:32px;height:32px;flex:none;display:grid;place-items:center;font-weight:700;font-size:15px;color:#fff;border-radius:5px}
.vnj .vnj-emb .logo.x{background:#0f1419}.vnj .vnj-emb .logo.tw{background:#9146FF}
.vnj .vnj-emb .t{font-family:var(--vnj-ff-head);font-weight:700;font-size:12px}
.vnj .vnj-emb .s{font-family:var(--vnj-ff-mono);font-size:10px;color:var(--vnj-faint);margin-top:2px}
.vnj .vnj-emb .b{display:block;padding:9px 13px;border-top:1px solid var(--vnj-line);font-family:var(--vnj-ff-disp);font-weight:600;font-size:11px;letter-spacing:.06em;color:var(--vnj-cyan);text-decoration:none}
.vnj .vnj-emb .b:hover{background:var(--vnj-panel-2)}

/* ---------- Tweak メニュー（右下） ---------- */
.vnj .vnj-tweak{position:fixed;right:26px;bottom:calc(26px + var(--vnj-ad-h, 0px));z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:12px;transition:bottom .25s ease}
.vnj .vnj-tweak .stack{display:flex;flex-direction:column;align-items:flex-end;gap:10px;transition:all .35s cubic-bezier(.2,.9,.3,1)}
.vnj .vnj-tweak .stack.hidden{opacity:0;transform:translateY(14px) scale(.92);pointer-events:none}
.vnj .vnj-tweak .btn{display:flex;align-items:center;height:46px;padding:0 14px;min-width:46px;background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-family:var(--vnj-ff-disp);font-weight:600;font-size:12px;letter-spacing:.08em;cursor:pointer;box-shadow:0 12px 30px -14px var(--vnj-shadow);transition:all .2s;white-space:nowrap;clip-path:var(--vnj-clip-btn)}
.vnj .vnj-tweak .btn .ic{font-size:15px;display:grid;place-items:center;width:20px}
.vnj .vnj-tweak .btn .tx{max-width:0;overflow:hidden;opacity:0;transition:all .25s;font-size:11px}
.vnj .vnj-tweak .btn:hover{border-color:var(--vnj-red);color:var(--vnj-red)}
.vnj .vnj-tweak .btn:hover .tx{max-width:150px;opacity:1;margin-left:10px}
.vnj .vnj-tweak .btn.active{border-color:var(--vnj-red);color:var(--vnj-red)}
.vnj .vnj-tweak .fab{width:58px;height:58px;border:none;cursor:pointer;background:var(--vnj-red);color:var(--vnj-on);display:grid;place-items:center;box-shadow:0 16px 40px -10px rgba(255,70,85,.6);clip-path:polygon(14px 0,100% 0,100% 86%,86% 100%,0 100%,0 14px);transition:transform .3s}
.vnj .vnj-tweak .fab:hover{transform:scale(1.05)}
.vnj .vnj-tweak.open .fab svg{transform:rotate(135deg)}
.vnj .vnj-tweak .fab svg{width:24px;height:24px;transition:transform .4s}
/* 常設「先頭へ戻る」（+の上・一番上でも常時表示） */
.vnj .vnj-tweak .vnj-totop{width:46px;height:46px;display:grid;place-items:center;background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);cursor:pointer;box-shadow:0 12px 30px -14px var(--vnj-shadow);clip-path:polygon(12px 0,100% 0,100% 88%,88% 100%,0 100%,0 12px);transition:border-color .2s,color .2s}
.vnj .vnj-tweak .vnj-totop:hover{border-color:var(--vnj-red);color:var(--vnj-red)}
.vnj .vnj-tweak .vnj-totop svg{width:20px;height:20px}
.vnj .vnj-tweak .tw-share-wrap{position:relative;display:flex;justify-content:flex-end}
.vnj .vnj-tweak .tw-share-pop{position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:12px;display:flex;gap:8px;padding:8px;background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);box-shadow:0 12px 30px -14px var(--vnj-shadow);clip-path:var(--vnj-clip-btn);transition:opacity .22s,transform .22s;z-index:2}
.vnj .vnj-tweak .tw-share-pop.hidden{opacity:0;transform:translateY(-50%) translateX(8px);pointer-events:none}
.vnj .vnj-tweak .tw-share-pop .sbtn{width:42px;height:42px;display:grid;place-items:center;background:var(--vnj-bg-2);border:1px solid var(--vnj-line-strong);color:var(--vnj-text);font-size:15px;cursor:pointer;transition:all .2s;clip-path:var(--vnj-clip-btn)}
.vnj .vnj-tweak .tw-share-pop .sbtn:hover{border-color:var(--vnj-red);color:var(--vnj-red)}
/* フォーカスモード：本文以外をフェード */
body.vnj-focus .vnj-ticker,body.vnj-focus .vnj-ad,body.vnj-focus .vnj-sidebar,
body.vnj-focus .vnj-pin-row,body.vnj-focus .vnj-rxbar{opacity:.1;filter:saturate(.25);transition:opacity .4s,filter .4s}

/* ---------- ピッカー / ポップオーバー / トースト ---------- */
.vnj-pop{position:fixed;z-index:90;background:var(--vnj-panel);border:1px solid var(--vnj-line-strong);box-shadow:0 16px 40px -16px var(--vnj-shadow);display:none}
.vnj-pop.show{display:flex}
.vnj-rxpicker{padding:7px;gap:4px;flex-wrap:wrap;width:184px}
.vnj-rxpicker button{width:32px;height:32px;background:none;border:1px solid transparent;font-size:17px;cursor:pointer;border-radius:2px}
.vnj-rxpicker button:hover{background:var(--vnj-panel-2);border-color:var(--vnj-cyan)}
.vnj .vnj-toast{position:fixed;left:50%;bottom:34px;z-index:80;background:var(--vnj-text);color:var(--vnj-bg);font-family:var(--vnj-ff-disp);font-weight:600;font-size:13px;padding:11px 20px;opacity:0;pointer-events:none;transition:all .3s;transform:translateX(-50%) translateY(20px);clip-path:var(--vnj-clip-btn)}
.vnj .vnj-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- レスポンシブ ---------- */
@media(max-width:860px){
  .vnj .vnj-article{grid-template-columns:1fr}
  .vnj .vnj-share-rail{flex-direction:row}
  /* 固定記事(PR/DEVICE)＝縦積み大カード → 横長カード（サムネ左・本文右）で占有率を下げる */
  .vnj .vnj-pin-row{grid-template-columns:1fr;gap:10px}
  .vnj .vnj-pin{display:flex;align-items:stretch}
  .vnj .vnj-pin .img{width:128px;flex:none;aspect-ratio:16/9}
  .vnj .vnj-pin .m{flex:1;min-width:0;padding:10px 13px;display:flex;flex-direction:column;justify-content:center}
  .vnj .vnj-pin .m h4{margin-top:3px}
}
/* 記事一覧は常に横長カード維持（旧:780px以下で縦積みしていたのを廃止） */
@media(max-width:780px){
  .vnj .vnj-feed .vnj-row{gap:13px;align-items:center}
  .vnj .vnj-row .th{width:120px}
}
@media(max-width:560px){
  .vnj .vnj-feed .vnj-row{padding:13px 0}
  .vnj .vnj-row .th{width:104px}
  .vnj .vnj-row .ex{display:none}
}

/* 関連記事ブロック（loos/post-link）のスタイルは assets/css/vnj-postlink.css に分離
   （フロント＋ブロックエディタ canvas の両方で読み込むため・非.vnjスコープ） */