/**
 * mg-topskin — 「ガジェット情報局」意匠システム v7（22.26.0 / SIGNAL DESK）
 *
 * 責務範囲（運用者指示 2026-07-11）: スキンが着せ替えるのは**コンテンツ領域のみ**。
 * ヘッダー/フッター/グローバルnav = SWELL の領分（色はカスタマイザーで運用者が管理）
 * であり、本CSSは .l-header / .l-footer 系に一切触れない。
 * 配色は設定ベース3値（既定=ダーク固定・先進性重視）:
 *   .mg-tsk-dark  = インク基調（基底トークンそのもの）
 *   .mg-tsk-light = 紙面基調（真っ白ではなく温かみのあるペーパー・白すぎ是正）
 *   .mg-tsk-auto  = OS 設定連動（dark 基底 + OS light でペーパーへ）
 * マストヘッド（パルスバー＋アイデンティティ帯）は配色に依らず常にインク＝題字ゾーン。
 * 全効果 prefers-reduced-motion 尊重。スコープ外(スキンOFF)には一切影響しない。
 */

/* ═══ トークン（ダーク=基底・既定）
   闇はブルーブラックでなく菫インク: SWELL素のクローム(#0E003D/#220063)と同族の
   紫みを帯びた黒=ヘッダー→紙面が一つのブランド世界として繋がる(統一感・P9.9)。 ═══ */
.mg-topskin-on{
  --tsk-bg:#0d0b26;
  --tsk-card:#161139;
  --tsk-card-2:#120e2e;
  --tsk-text:#e7eaf6;
  --tsk-text-2:#9aa3bf;
  --tsk-line:rgba(255,255,255,.09);
  --tsk-ghost:rgba(255,255,255,.07);
  --tsk-signal:#ffd60a; --tsk-signal:oklch(88% .16 98);
  --tsk-data:#6f92ff;   --tsk-data:oklch(70% .14 262);
  --tsk-serif:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;
  --tsk-thumb-filter:saturate(.78) brightness(.9) contrast(1.02);
  --tsk-nl-btn-text:#04120a;
  background:var(--tsk-bg);
  color:var(--tsk-text);
}
/* ライトトークン=温かみのあるペーパー（2箇所同期: .mg-tsk-light / .mg-tsk-auto+OS light） */
.mg-topskin-on.mg-tsk-light{
  --tsk-bg:#f2efe8;
  --tsk-card:#faf8f2;
  --tsk-card-2:#e9e5da;
  --tsk-text:#20222e;
  --tsk-text-2:#5d6070;
  --tsk-line:rgba(50,45,28,.14);
  --tsk-ghost:rgba(50,45,28,.10);
  --tsk-signal:#a16207; --tsk-signal:oklch(55% .12 80);
  --tsk-data:#2f5fe0;   --tsk-data:oklch(52% .18 262);
  --tsk-thumb-filter:saturate(.86) contrast(1.01);
  --tsk-nl-btn-text:#fff;
}
@media (prefers-color-scheme: light){
  .mg-topskin-on.mg-tsk-auto{
    --tsk-bg:#f2efe8;
    --tsk-card:#faf8f2;
    --tsk-card-2:#e9e5da;
    --tsk-text:#20222e;
    --tsk-text-2:#5d6070;
    --tsk-line:rgba(50,45,28,.14);
    --tsk-ghost:rgba(50,45,28,.10);
    --tsk-signal:#a16207; --tsk-signal:oklch(55% .12 80);
    --tsk-data:#2f5fe0;   --tsk-data:oklch(52% .18 262);
    --tsk-thumb-filter:saturate(.86) contrast(1.01);
    --tsk-nl-btn-text:#fff;
  }
}
body:has(.mg-topskin-on){background:#0d0b26}
body:has(.mg-topskin-on.mg-tsk-light){background:#f2efe8}
@media (prefers-color-scheme: light){body:has(.mg-topskin-on.mg-tsk-auto){background:#f2efe8}}
.mg-topskin-on{min-height:100vh}

/* 回路レール: ページ左余白を縦走する配線+スクロールで走る信号灯（scroll-timeline対応環境のみ・
   デスクトップ余白限定・cloudsモジュールOFF/reduced-motionで消灯）— 基盤意匠を中盤後半まで貫く背骨 */
@supports (animation-timeline: scroll()) {
  @media (min-width: 1240px) {
    body:has(.mg-topskin-on:not(.mg-tsk-off-clouds))::before{
      content:"";position:fixed;left:20px;top:11vh;height:78vh;width:6px;z-index:2;pointer-events:none;
      background:
        radial-gradient(circle 3px at 50% 0, rgba(255,214,10,.95) 40%, rgba(255,214,10,0) 72%),
        linear-gradient(rgba(160,150,255,.16), rgba(160,150,255,.16));
      background-size:6px 6px, 2px 100%;
      background-repeat:no-repeat;
      background-position:50% 0%, 50% 50%;
      animation:tskRail linear both;
      animation-timeline:scroll(root);
    }
    body:has(.mg-topskin-on.mg-tsk-light:not(.mg-tsk-off-clouds))::before{
      background:
        radial-gradient(circle 3px at 50% 0, rgba(161,98,7,.9) 40%, rgba(161,98,7,0) 72%),
        linear-gradient(rgba(50,45,28,.22), rgba(50,45,28,.22));
      background-size:6px 6px, 2px 100%;
      background-repeat:no-repeat;
      background-position:50% 0%, 50% 50%;
    }
  }
}
@keyframes tskRail{from{background-position:50% 0%, 50% 50%}to{background-position:50% 100%, 50% 50%}}
@media(prefers-reduced-motion:reduce){body:has(.mg-topskin-on)::before{content:none}}

/* ═══ 背景アニメーション（漂う色雲・ダーク基底+ライト変種） ═══ */
.mg-topskin-on::before,.mg-topskin-on::after{content:"";position:fixed;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(70px);opacity:.55}
.mg-topskin-on::before{width:56vw;height:56vw;left:-14vw;top:-18vw;background:radial-gradient(circle at 40% 40%,rgba(111,146,255,.13),transparent 65%);animation:tskDriftA 46s ease-in-out infinite alternate}
.mg-topskin-on::after{width:48vw;height:48vw;right:-12vw;bottom:-16vw;background:radial-gradient(circle at 55% 55%,rgba(255,214,10,.10),transparent 65%);animation:tskDriftB 58s ease-in-out infinite alternate}
.mg-topskin-on.mg-tsk-light::before{background:radial-gradient(circle at 40% 40%,rgba(47,95,224,.10),transparent 65%)}
.mg-topskin-on.mg-tsk-light::after{background:radial-gradient(circle at 55% 55%,rgba(161,98,7,.09),transparent 65%)}
@media (prefers-color-scheme: light){
  .mg-topskin-on.mg-tsk-auto::before{background:radial-gradient(circle at 40% 40%,rgba(47,95,224,.10),transparent 65%)}
  .mg-topskin-on.mg-tsk-auto::after{background:radial-gradient(circle at 55% 55%,rgba(161,98,7,.09),transparent 65%)}
}
@keyframes tskDriftA{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(9vw,7vh,0) scale(1.15)}}
@keyframes tskDriftB{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-8vw,-6vh,0) scale(.95)}}
@media(prefers-reduced-motion:reduce){.mg-topskin-on::before,.mg-topskin-on::after{animation:none}}

/* ヘッダー/フッターは SWELL の領分（運用者指示 2026-07-11）— 本CSSは一切触れない */

/* ═══ ページ骨格 ═══ */
.mg-topskin-on .l-content,
.mg-topskin-on .l-mainContent,
.mg-topskin-on .l-article{margin-top:0!important;padding-top:0!important;background:transparent}
.mg-topskin-on .p-mainVisual{display:none}
.mg-topskin-on .post_content>*:first-child{margin-top:0}
.mg-topskin-on .swell-block-fullWide{background:transparent!important}
.mgv2-sec{padding:52px 0 40px}
.mgv2-sec:not(.mgv2-id):not(.mgv2-pulse) .swell-block-fullWide__inner{position:relative}
.mgv2-sec:not(.mgv2-id):not(.mgv2-pulse) .swell-block-fullWide__inner::before{content:"";position:absolute;top:-52px;left:0;right:0;border-top:1px solid var(--tsk-line)}
.mg-topskin-on .post_content p.mgv2-eyebrow{font-size:11.5px;letter-spacing:.22em;color:var(--tsk-signal);font-weight:800;margin:0 0 4px}
.mg-topskin-on .post_content h2.mgv2-h{font-family:var(--tsk-serif);font-size:clamp(24px,2.6vw,31px);font-weight:700;letter-spacing:.01em;margin:0 0 22px;border:none;padding:0;background:transparent;color:var(--tsk-text);box-shadow:none;border-radius:0;text-wrap:balance}
.mg-topskin-on .post_content h2.mgv2-h::before,.mg-topskin-on .post_content h2.mgv2-h::after{content:none}
.mg-topskin-on .post_content h3.mgv2-h3{font-size:15.5px;margin:0 0 14px;padding:0 0 9px;background:transparent;color:var(--tsk-text-2);letter-spacing:.04em;border:none;border-bottom:1px solid var(--tsk-line);box-shadow:none}
.mg-topskin-on .post_content h3.mgv2-h3::before,.mg-topskin-on .post_content h3.mgv2-h3::after{content:none}
.mg-topskin-on .post_content p{text-wrap:pretty;color:var(--tsk-text-2)}
.mg-topskin-on .post_content .mgv2-atlas h2.mgv2-h b{color:var(--tsk-data)}

/* ═══ ゴースト章番号（scroll-driven パララックス） ═══ */
.mgv2-sec:not(.mgv2-id):not(.mgv2-pulse) .swell-block-fullWide__inner::after{
 font-family:var(--tsk-serif);font-weight:700;font-size:clamp(84px,11.5vw,150px);line-height:1;
 position:absolute;top:-10px;right:12px;z-index:-1;pointer-events:none;letter-spacing:-.04em;
 color:transparent;-webkit-text-stroke:1px var(--tsk-ghost)}
.mgv2-journal .swell-block-fullWide__inner::after{content:"01"}
.mgv2-wire .swell-block-fullWide__inner::after{content:"02"}
.mgv2-atlas .swell-block-fullWide__inner::after{content:"03"}
.mgv2-cta .swell-block-fullWide__inner::after{content:"04"}
@supports (animation-timeline: view()) {
  .mgv2-sec:not(.mgv2-id):not(.mgv2-pulse) .swell-block-fullWide__inner::after{
   animation:mgv2Ghost linear both;animation-timeline:view();animation-range:entry 0% cover 60%}
  @keyframes mgv2Ghost{from{transform:translateY(46px)}to{transform:translateY(-16px)}}
}
@media(prefers-reduced-motion:reduce){.mgv2-sec .swell-block-fullWide__inner::after{animation:none}}

/* ═══ マストヘッド（パルスバー＋アイデンティティ帯・両テーマ共通インク） ═══ */
.mg-topskin-on .mgv2-pulse,.mg-topskin-on .mgv2-id,
.mg-topskin-on .swell-block-fullWide.mgv2-pulse,.mg-topskin-on .swell-block-fullWide.mgv2-id{
  --tsk-text:#e7eaf6; --tsk-text-2:#9aa3bf; --tsk-line:rgba(255,255,255,.1);
  --tsk-signal:#ffd60a; --tsk-signal:oklch(88% .16 98);
  --tsk-data:#6f92ff; --tsk-data:oklch(70% .14 262);
  background:#0f0b2d!important;color:var(--tsk-text)}
.mgv2-pulse{padding:0}
.mgv2-pulse .swell-block-fullWide__inner{padding:0}
.mgv2-pulse .mg-newsTicker{margin:0;padding:8px 0;border-bottom:1px solid var(--tsk-line)}
.mgv2-id{position:relative;overflow:hidden;padding:0}
.mgv2-id::before{content:"";position:absolute;inset:-30% -10%;pointer-events:none;background:
 radial-gradient(38% 55% at 22% 38%,rgba(255,214,10,.24),transparent 68%),
 radial-gradient(42% 60% at 76% 30%,rgba(79,110,235,.38),transparent 70%);
 filter:blur(16px);animation:mgv2Aurora 16s ease-in-out infinite alternate}
@keyframes mgv2Aurora{from{transform:translate3d(-2.5%,-2%,0) rotate(-1.6deg)}to{transform:translate3d(2.5%,2%,0) rotate(1.6deg) scale(1.06)}}
@media(prefers-reduced-motion:reduce){.mgv2-id::before{animation:none}}
.mgv2-id .mg-tsk-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.mgv2-id .swell-block-fullWide__inner{position:relative;z-index:1;padding-top:52px;padding-bottom:46px}
.mg-topskin-on .post_content .mgv2-id p{margin:0}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__tag{color:var(--tsk-signal);font-size:12px;letter-spacing:.24em;font-weight:800}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__lead{font-family:var(--tsk-serif);color:#fff;font-size:clamp(27px,3.9vw,40px);font-weight:700;line-height:1.4;margin:10px 0 8px;text-wrap:balance}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__sub{color:var(--tsk-text-2);font-size:14.5px;max-width:56ch;margin-bottom:14px}
.mgv2-pulse+.mgv2-id .swell-block-fullWide__inner{padding-top:46px}
/* 言語スイッチャー: 素の白バーが題字ゾーンで浮く+ワードマークを覆うため、
   インクに溶けるコンパクトなピル列へ（左寄せ=右側をブランド銘へ明け渡す） */
.mg-topskin-on .mgv2-id .gsm-lang{display:inline-flex;width:auto;gap:4px;justify-content:flex-start;
  background:color-mix(in oklab,#fff 7%,transparent);border:1px solid var(--tsk-line);border-radius:999px;padding:4px 6px;margin-top:14px}
.mg-topskin-on .mgv2-id .gsm-lang .gsm-lang__code{color:var(--tsk-text-2);background:transparent;border-radius:999px;padding:3px 12px;text-decoration:none;font-size:12.5px;font-weight:700}
.mg-topskin-on .mgv2-id .gsm-lang .gsm-lang__code:hover{color:var(--tsk-text)}
.mg-topskin-on .mgv2-id .gsm-lang .gsm-lang__code.is-active{background:color-mix(in oklab,var(--tsk-signal) 22%,transparent);color:#fff}

/* ═══ mg-tps: 記事カード（単一DNA・トークン追従） ═══ */
.mg-tps{display:grid;gap:18px}
.mg-tps--card{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.mg-tps--card[data-cols="2"]{grid-template-columns:repeat(2,1fr)}
.mg-tps--row,.mg-tps--hero{grid-template-columns:1fr;gap:0}
.mg-tps__item{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;border-radius:14px;transition:transform .28s cubic-bezier(.2,.7,.3,1)}
.mg-tps__item:hover{transform:translateY(-4px)}
.mg-tps__media{position:relative;display:block;aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid var(--tsk-line);background:var(--tsk-card-2)}
.mg-tps__media img{width:100%;height:100%;object-fit:cover;display:block;filter:var(--tsk-thumb-filter);transition:transform .45s cubic-bezier(.2,.7,.3,1),filter .35s ease}
.mg-tps__item:hover .mg-tps__media img{transform:scale(1.045);filter:none}
.mg-tps__noimg{position:absolute;inset:0;background:
 radial-gradient(60% 90% at 20% 20%,rgba(255,214,10,.10),transparent 60%),
 radial-gradient(70% 90% at 85% 80%,rgba(47,95,224,.12),transparent 65%),
 var(--tsk-card-2)}
.mg-tps__chip{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.05em;color:var(--tsk-text);border:1px solid color-mix(in oklab,var(--tsk-text) 28%,transparent);border-radius:999px;padding:1.5px 9px;background:color-mix(in oklab,var(--tsk-text) 6%,transparent)}
.mg-tps__body{display:flex;flex-direction:column;gap:6px;padding:0 2px}
.mg-tps__title{font-size:15px;font-weight:700;line-height:1.5;color:var(--tsk-text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
 background-image:linear-gradient(var(--tsk-signal),var(--tsk-signal));background-repeat:no-repeat;background-size:0% 1.5px;background-position:0 100%;
 transition:color .2s ease,background-size .35s cubic-bezier(.2,.7,.3,1)}
.mg-tps__item:hover .mg-tps__title{color:var(--tsk-signal);background-size:100% 1.5px}
.mg-tps__meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--tsk-text-2);font-variant-numeric:tabular-nums}
.mg-tps__more{margin-top:18px;text-align:right}
.mg-tps__more a{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--tsk-text-2);text-decoration:none;border:1px solid var(--tsk-line);border-radius:999px;padding:7px 18px;transition:color .2s ease,border-color .2s ease,gap .2s ease}
.mg-tps__more a:hover{color:var(--tsk-signal);border-color:var(--tsk-signal);gap:12px}

/* hero（特集・タイトルはスクリム上＝両テーマ共通で白） */
.mg-tps--hero .mg-tps__item{position:relative;display:block}
.mg-tps--hero .mg-tps__media{aspect-ratio:16/8.4;border-radius:18px}
.mg-tps--hero .mg-tps__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,30,0) 28%,rgba(10,8,30,.58) 60%,rgba(10,8,30,.94) 100%)}
.mg-tps--hero .mg-tps__body{position:absolute;left:0;right:0;bottom:0;padding:22px 24px;z-index:1}
.mg-tps--hero .mg-tps__title{font-family:var(--tsk-serif);font-size:clamp(20px,2.6vw,29px);font-weight:700;line-height:1.5;-webkit-line-clamp:3;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.55),0 4px 18px rgba(0,0,0,.35)}
.mg-tps--hero .mg-tps__item:hover .mg-tps__title{color:#fff}
.mg-tps--hero .mg-tps__meta{color:rgba(231,234,246,.78)}
.mg-tps--hero .mg-tps__chip{color:rgba(231,234,246,.9);border-color:rgba(255,255,255,.35)}

/* row（順位リスト） */
.mg-tps--row .mg-tps__item{flex-direction:row;align-items:center;gap:14px;padding:11px 8px;border-radius:12px;border-bottom:1px solid var(--tsk-line)}
.mg-tps--row .mg-tps__item:hover{transform:none;background:color-mix(in oklab,var(--tsk-signal) 7%,transparent)}
.mg-tps--row .mg-tps__media{flex:0 0 106px;aspect-ratio:16/10;border-radius:10px}
.mg-tps--row .mg-tps__title{font-size:14px;-webkit-line-clamp:2}
.mg-tps__rank{flex:0 0 auto;min-width:1.4em;font-size:21px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;text-align:center;background:linear-gradient(150deg,var(--tsk-signal),var(--tsk-data));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ヒーロー右列のベント・ミニタイル */
.mgv2-journal .wp-block-columns:first-of-type .wp-block-column:last-child .mg-tps--row .mg-tps__item{
 border:1px solid var(--tsk-line);border-radius:12px;background:var(--tsk-card);margin-bottom:10px;padding:10px}
.mgv2-journal .wp-block-columns:first-of-type .wp-block-column:last-child .mg-tps--row .mg-tps__item:hover{border-color:color-mix(in oklab,var(--tsk-signal) 45%,transparent);background:color-mix(in oklab,var(--tsk-signal) 6%,var(--tsk-card))}
.mgv2-journal .wp-block-columns:first-of-type .wp-block-column:last-child .mg-tps--row .mg-tps__media{flex-basis:84px}

/* ═══ ニュース・ティッカー（マストヘッド内） ═══ */
.mg-newsTicker{display:flex;align-items:center;gap:12px;padding:9px 0 12px;overflow:hidden}
.mg-newsTicker__live{flex-shrink:0;background:var(--tsk-signal);color:#04120a;font-weight:800;font-size:11px;letter-spacing:.12em;padding:2px 10px;border-radius:4px;position:relative}
.mg-newsTicker__live::after{content:"";position:absolute;inset:0;border-radius:4px;box-shadow:0 0 0 0 rgba(255,214,10,.6);animation:mgv2Pulse 2.4s ease-out infinite}
@keyframes mgv2Pulse{to{box-shadow:0 0 0 10px rgba(255,214,10,0)}}
.mg-newsTicker__viewport{display:flex;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.mg-newsTicker__track{display:flex;gap:34px;list-style:none;margin:0;padding:0 17px 0 0;flex-shrink:0;min-width:100%;animation:mgv2Marquee 42s linear infinite}
.mg-newsTicker:hover .mg-newsTicker__track{animation-play-state:paused}
@keyframes mgv2Marquee{to{transform:translateX(-100%)}}
.mg-newsTicker__item{white-space:nowrap;font-size:13.5px}
.mg-newsTicker__item a{color:var(--tsk-text-2);text-decoration:none}
.mg-newsTicker__item a:hover{color:var(--tsk-signal)}
.mg-newsTicker__item time{color:#5b6584;font-size:12px;font-variant-numeric:tabular-nums;margin-right:4px}
@media(prefers-reduced-motion:reduce){.mg-newsTicker__track{animation:none}.mg-newsTicker__track[aria-hidden]{display:none}.mg-newsTicker__viewport{mask-image:none;-webkit-mask-image:none}}

/* ═══ ATLAS ═══ */
.mg-topskin-on .post_content .mgv2-quick{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 8px}
.mg-topskin-on .post_content .mgv2-quick a{background:var(--tsk-card);border:1px solid color-mix(in oklab,var(--tsk-text) 22%,transparent);border-radius:999px;padding:4px 14px;color:var(--tsk-text);font-size:13px;text-decoration:none;transition:transform .2s ease,border-color .2s ease,color .2s ease}
.mg-topskin-on .post_content .mgv2-quick a:hover{border-color:var(--tsk-data);color:var(--tsk-data);transform:translateY(-2px)}
.mgv2-stats{gap:12px}
.mg-topskin-on .mgv2-stats .wp-block-column{background:var(--tsk-card);border:1px solid var(--tsk-line);border-radius:12px;padding:16px 8px;text-align:center;transition:transform .25s ease,border-color .25s ease}
.mg-topskin-on .mgv2-stats .wp-block-column:hover{transform:translateY(-3px);border-color:color-mix(in oklab,var(--tsk-data) 45%,transparent)}
.mg-topskin-on .post_content .mgv2-stat__n{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;margin:0;line-height:1.2;background:linear-gradient(120deg,var(--tsk-signal),var(--tsk-data));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.mg-topskin-on .post_content .mgv2-stat__l{color:var(--tsk-text-2);font-size:11.5px;letter-spacing:.08em;margin:2px 0 0}
.mg-topskin-on .mgv2-atlas .wp-block-search{max-width:520px}
.mg-topskin-on .mgv2-atlas .wp-block-search .wp-block-search__input{background:var(--tsk-card);border:1px solid var(--tsk-line);border-right:0;color:var(--tsk-text);border-radius:999px 0 0 999px;padding:11px 18px}
.mg-topskin-on .mgv2-atlas .wp-block-search .wp-block-search__input::placeholder{color:var(--tsk-text-2)}
.mg-topskin-on .mgv2-atlas .wp-block-search .wp-block-search__input:focus{outline:none;border-color:var(--tsk-data);box-shadow:0 0 0 3px color-mix(in oklab,var(--tsk-data) 25%,transparent)}
.mg-topskin-on .mgv2-atlas .wp-block-search .wp-block-search__button{border-radius:0 999px 999px 0;background:var(--tsk-data);color:#fff;border:1px solid var(--tsk-data);font-weight:700}

/* ═══ フォローハブ ═══ */
.mg-tps-follow{display:grid;gap:14px}
.mg-tps-follow__tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.mg-tps-follow__tile{display:flex;flex-direction:column;gap:4px;text-decoration:none;border:1px solid var(--tsk-line);border-radius:14px;padding:18px 18px 16px;background:var(--tsk-card);transition:transform .25s cubic-bezier(.2,.7,.3,1),border-color .25s ease,background .25s ease}
.mg-tps-follow__tile:hover{transform:translateY(-4px);border-color:var(--tsk-signal);background:color-mix(in oklab,var(--tsk-signal) 6%,var(--tsk-card))}
.mg-tps-follow__mark{font-family:var(--tsk-serif);font-weight:700;font-size:26px;line-height:1;background:linear-gradient(140deg,var(--tsk-signal),var(--tsk-data));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:6px}
.mg-tps-follow__label{color:var(--tsk-text);font-weight:700;font-size:14px}
.mg-tps-follow__hint{color:var(--tsk-text-2);font-size:12px;line-height:1.6}
.mg-tps-follow__letter{border:1px solid var(--tsk-line);border-radius:14px;padding:8px 20px 14px;background:var(--tsk-card)}
.mg-topskin-on .mg-newsletter-form,
.mg-topskin-on .mg-newsletter-form__inner{background:transparent!important;border-color:var(--tsk-line)!important;color:var(--tsk-text-2)}
.mg-topskin-on .mg-newsletter-form__title{color:var(--tsk-text)!important}
.mg-topskin-on .mg-newsletter-form__desc,.mg-topskin-on .mg-newsletter-form__note{color:var(--tsk-text-2)!important}
.mg-topskin-on .mg-newsletter-form input[type="email"]{background:var(--tsk-card-2)!important;border:1px solid var(--tsk-line)!important;color:var(--tsk-text)!important;border-radius:8px}
.mg-topskin-on .mg-newsletter-form input[type="email"]::placeholder{color:var(--tsk-text-2)}
.mg-topskin-on .mg-newsletter-form button{background:var(--tsk-signal)!important;color:var(--tsk-nl-btn-text)!important;border:0!important;font-weight:700;border-radius:8px}
@media(max-width:959px){.mg-tps-follow__tiles{grid-template-columns:1fr}}

/* ═══ 2026 baseline ═══ */
@view-transition{navigation:auto}
::view-transition-old(root){animation:mgv2VtOut .18s ease both}
::view-transition-new(root){animation:mgv2VtIn .26s ease both}
@keyframes mgv2VtOut{to{opacity:0;transform:translateY(-6px)}}
@keyframes mgv2VtIn{from{opacity:0;transform:translateY(8px)}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}
@supports (animation-timeline: view()) {
  .mgv2-sec .l-container>*{animation:mgv2FadeUp both;animation-timeline:view();animation-range:entry 0% entry 38%}
  .mgv2-pulse .l-container>*{animation:none}
  .mgv2-stats .wp-block-column{animation:mgv2Pop both;animation-timeline:view();animation-range:entry 0% entry 55%}
  .mgv2-stats .wp-block-column:nth-child(2){animation-range:entry 5% entry 60%}
  .mgv2-stats .wp-block-column:nth-child(3){animation-range:entry 10% entry 65%}
  .mgv2-stats .wp-block-column:nth-child(4){animation-range:entry 15% entry 70%}
}
@keyframes mgv2FadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes mgv2Pop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.mgv2-sec .l-container>*,.mgv2-stats .wp-block-column{animation:none}}
.mgv2-reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.3,1)}
.mgv2-reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.mgv2-reveal{opacity:1;transform:none;transition:none}}

@media(max-width:959px){
  .mgv2-sec{padding:36px 0 30px}
  .mg-topskin-on .post_content h2.mgv2-h{font-size:22px}
  .mgv2-id .swell-block-fullWide__inner{padding-top:38px;padding-bottom:34px}
  .mg-tps--card{grid-template-columns:repeat(2,1fr);gap:12px}
  .mg-tps--row .mg-tps__media{flex-basis:92px}
  .mg-tps--hero .mg-tps__media{aspect-ratio:16/10}
  .mg-tps--hero .mg-tps__body{padding:14px 16px}
}

/* ═══ モジュールOFFゲート（設定画面と連動・body class 方式） ═══ */
.mg-tsk-off-clouds.mg-topskin-on::before,.mg-tsk-off-clouds.mg-topskin-on::after{display:none}
.mg-tsk-off-canvas .mg-tsk-canvas{display:none}
.mg-tsk-off-ghost .mgv2-sec .swell-block-fullWide__inner::after{content:none}
.mg-tsk-off-filter .mg-tps__media img{filter:none}
.mg-tsk-off-motion .mgv2-sec .l-container>*,
.mg-tsk-off-motion .mgv2-stats .wp-block-column,
.mg-tsk-off-motion .mgv2-sec .swell-block-fullWide__inner::after{animation:none!important;opacity:1!important;transform:none!important}
.mg-tsk-off-motion .mgv2-id::before{animation:none}

/* ═══ v5: 中盤〜終盤の演出（上だけ豪華の解消） ═══ */
/* 02 速報: レーダースイープ（ニュース=走査の隠喩・超低輝度） */
.mgv2-wire .swell-block-fullWide__inner{overflow:visible}
.mgv2-wire{position:relative;overflow:hidden}
.mgv2-wire::before{content:"";position:absolute;inset:-30% -10%;pointer-events:none;
 background:conic-gradient(from 0deg at 78% 18%,transparent 0 84%,color-mix(in oklab,var(--tsk-signal) 14%,transparent) 92%,transparent 100%);
 animation:tskRadar 14s linear infinite}
@keyframes tskRadar{to{transform:rotate(1turn)}}
.mgv2-wire .swell-block-fullWide__inner{position:relative;z-index:1}
/* NEWS チップに生きている印（点滅ドット） */
.mgv2-wire .mg-tps__chip::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--tsk-signal);margin-right:6px;vertical-align:1px;animation:tskBlink 2.2s ease-in-out infinite}
@keyframes tskBlink{0%,100%{opacity:1}50%{opacity:.25}}

/* 03 調査局: 統計カードの3Dチルト+クイックチップの遊び */
.mgv2-stats .wp-block-column{perspective:600px}
.mgv2-stats .wp-block-column:hover{transform:translateY(-3px) rotateX(4deg)}
.post_content .mgv2-quick a:active{transform:scale(.94)}

/* 04 FOLLOW: ホバーで回転グラデ枠（conic border） */
.mg-tps-follow__tile{position:relative}
.mg-tps-follow__tile::before{content:"";position:absolute;inset:-1px;border-radius:15px;padding:1px;
 background:conic-gradient(from var(--tsk-angle,0deg),var(--tsk-signal),var(--tsk-data),var(--tsk-signal));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
 opacity:0;transition:opacity .3s ease}
@property --tsk-angle{syntax:"<angle>";inherits:false;initial-value:0deg}
.mg-tps-follow__tile:hover::before{opacity:1;animation:tskSpin 2.6s linear infinite}
@keyframes tskSpin{to{--tsk-angle:360deg}}

/* カードのstagger（グリッド内で波打つ出現） */
@supports (animation-timeline: view()) {
  .mg-tps--card .mg-tps__item:nth-child(2){animation-range:entry 4% entry 42%}
  .mg-tps--card .mg-tps__item:nth-child(3){animation-range:entry 8% entry 46%}
}

/* ═══ v5: ユーザビリティ ═══ */
.mg-newsTicker:focus-within .mg-newsTicker__track{animation-play-state:paused}
.mg-tps__item:focus-visible,.mg-tps-follow__tile:focus-visible,.mg-tps__more a:focus-visible{outline:2px solid var(--tsk-data);outline-offset:3px;border-radius:14px}
.mg-topskin-on .mg-newsletter-form input[type="email"]{font-size:16px} /* iOSズーム防止 */
@media(max-width:959px){.mg-tps__more a{display:flex;justify-content:center}}

/* ═══ v5: アーカイブ/固定ページの豪華化（スコープONで発動する備え） ═══ */
/* アーカイブ見出し: ARCHIVE アイブロウ+セリフ大 */
.mg-topskin-on.archive .c-pageTitle,.mg-topskin-on.blog .c-pageTitle{font-family:var(--tsk-serif);font-size:clamp(24px,3vw,34px);color:var(--tsk-text)}
.mg-topskin-on.archive .c-pageTitle::before,.mg-topskin-on.blog .c-pageTitle::before{content:"ARCHIVE";display:block;font-family:-apple-system,sans-serif;font-size:11px;letter-spacing:.22em;color:var(--tsk-signal);font-weight:800;margin-bottom:4px}
/* SWELL 標準リストへ tps カードDNA を移植（アーカイブは PostListSkin 非経由のため CSS で統一） */
.mg-topskin-on.archive .p-postList__item,.mg-topskin-on.blog .p-postList__item{border:1px solid var(--tsk-line);border-radius:14px;overflow:hidden;background:var(--tsk-card);transition:transform .28s cubic-bezier(.2,.7,.3,1),border-color .25s ease}
.mg-topskin-on.archive .p-postList__item:hover,.mg-topskin-on.blog .p-postList__item:hover{transform:translateY(-4px);border-color:color-mix(in oklab,var(--tsk-signal) 45%,transparent)}
.mg-topskin-on.archive .p-postList__thumb img,.mg-topskin-on.blog .p-postList__thumb img{filter:var(--tsk-thumb-filter);transition:filter .35s ease,transform .45s cubic-bezier(.2,.7,.3,1)}
.mg-topskin-on.archive .p-postList__item:hover .p-postList__thumb img,.mg-topskin-on.blog .p-postList__item:hover .p-postList__thumb img{filter:none;transform:scale(1.04)}
.mg-topskin-on.archive .p-postList__title,.mg-topskin-on.blog .p-postList__title{color:var(--tsk-text)}
.mg-topskin-on.archive .p-postList__body,.mg-topskin-on.blog .p-postList__body{padding:12px 14px}
@supports (animation-timeline: view()) {
  .mg-topskin-on.archive .p-postList__item,.mg-topskin-on.blog .p-postList__item{animation:mgv2FadeUp both;animation-timeline:view();animation-range:entry 0% entry 32%}
}

/* ═══ v5: 隠し機能の視覚（overdrive中はLIVEが虹脈動） ═══ */
.mg-tsk-overdrive .mg-newsTicker__live{animation:tskHue 1s linear infinite}
@keyframes tskHue{to{filter:hue-rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.mgv2-wire::before,.mgv2-wire .mg-tps__chip::before,.mg-tps-follow__tile::before{animation:none}}

/* ═══ v6: キャッチコピー・ローテータ（行はブロック=翻訳対象・JSが巡回表示） ═══
   grid積層(全行を1/1へ重ね)=コンテナ高さが最長行に自動追従。
   旧: absolute+min-height固定は行が折り返すと下の要素へ被った(SP実バグ・P9.8根治)。 */
.mg-topskin-on .post_content .mgv2-id .mgv2-id__rotator{margin:2px 0 6px}
/* 行の直親がgridになる必要がある(wp:groupは__inner-containerを挟む) */
.mg-topskin-on .post_content .mgv2-id :is(.mgv2-id__rotator,.mgv2-id__rotator>.wp-block-group__inner-container){display:grid}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__line{grid-area:1/1;margin:0;opacity:0;transform:translateY(8px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1);color:var(--tsk-signal);font-size:15.5px;font-weight:700;letter-spacing:.02em;pointer-events:none}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__line.is-live{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.mg-topskin-on .post_content .mgv2-id .mgv2-id__line{opacity:1;transform:none;display:none}
.mg-topskin-on .post_content .mgv2-id .mgv2-id__line:first-child{display:block}}

/* ═══ v7: セクション色面のリズム（JR Hello Osaka 参考=色面交代で中盤後半に呼吸を作る）
   02=信号緑の微気配 / 03=データ青の青写真面 / 04=信号面。全てトークン経由=両配色対応。
   .swell-block-fullWide{transparent!important} より特異度で勝たせる。 ═══ */
.mg-topskin-on .swell-block-fullWide.mgv2-wire{background:color-mix(in oklab,var(--tsk-signal) 3%,var(--tsk-bg))!important}
.mg-topskin-on .swell-block-fullWide.mgv2-atlas{background:color-mix(in oklab,var(--tsk-data) 5%,var(--tsk-bg))!important}
.mg-topskin-on .swell-block-fullWide.mgv2-cta{background:color-mix(in oklab,var(--tsk-signal) 4%,var(--tsk-bg))!important}

/* 03 調査局: 統計カードに基盤シルクスクリーン風のコーナーブラケット */
.mg-topskin-on .mgv2-stats .wp-block-column::before{content:"";position:absolute;inset:5px;pointer-events:none;border-radius:9px;opacity:.5;
 background:
  linear-gradient(var(--tsk-data) 0 0) left 0 top 0/12px 1px,
  linear-gradient(var(--tsk-data) 0 0) left 0 top 0/1px 12px,
  linear-gradient(var(--tsk-data) 0 0) right 0 top 0/12px 1px,
  linear-gradient(var(--tsk-data) 0 0) right 0 top 0/1px 12px,
  linear-gradient(var(--tsk-data) 0 0) left 0 bottom 0/12px 1px,
  linear-gradient(var(--tsk-data) 0 0) left 0 bottom 0/1px 12px,
  linear-gradient(var(--tsk-data) 0 0) right 0 bottom 0/12px 1px,
  linear-gradient(var(--tsk-data) 0 0) right 0 bottom 0/1px 12px;
 background-repeat:no-repeat}

/* 04 FOLLOW: ブランド銘のゴーストエコー（JRの「ロゴ反復アンカー」= 題字ゾーンの銘と首尾呼応） */
.mgv2-cta::before{content:"MISTERGADGET";position:absolute;right:8px;bottom:2px;z-index:0;pointer-events:none;
 font-family:var(--tsk-serif);font-weight:700;font-size:clamp(38px,7.2vw,96px);line-height:1;letter-spacing:.01em;
 color:transparent;-webkit-text-stroke:1px var(--tsk-ghost)}
.mg-tsk-off-ghost .mgv2-cta::before{content:none}

/* ═══ v6: 03 調査局=青写真グリッドが漂う / 04 FOLLOW=信号ビーム ═══ */
.mgv2-atlas{position:relative;overflow:hidden}
.mgv2-atlas::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
 background-image:linear-gradient(color-mix(in oklab,var(--tsk-data) 14%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklab,var(--tsk-data) 14%,transparent) 1px,transparent 1px);
 background-size:44px 44px;animation:tskBlueprint 36s linear infinite;
 mask-image:radial-gradient(90% 80% at 70% 20%,#000 0%,transparent 75%);-webkit-mask-image:radial-gradient(90% 80% at 70% 20%,#000 0%,transparent 75%)}
@keyframes tskBlueprint{to{background-position:44px 44px}}
.mgv2-atlas .swell-block-fullWide__inner{position:relative;z-index:1}
.mgv2-cta{position:relative;overflow:hidden}
.mgv2-cta::after{content:"";position:absolute;inset:-40%;pointer-events:none;opacity:.35;
 background:repeating-linear-gradient(115deg,transparent 0 90px,color-mix(in oklab,var(--tsk-signal) 9%,transparent) 90px 92px,transparent 92px 220px);
 animation:tskBeam 22s linear infinite}
@keyframes tskBeam{to{transform:translateX(240px)}}
.mgv2-cta .swell-block-fullWide__inner{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.mgv2-atlas::before,.mgv2-cta::after{animation:none}}
.mg-tsk-off-clouds .mgv2-atlas::before,.mg-tsk-off-clouds .mgv2-cta::after,.mg-tsk-off-clouds .mgv2-wire::before{display:none}

/* FOLLOW: pushタイル(button) */
button.mg-tps-follow__tile{font:inherit;text-align:left;cursor:pointer;appearance:none}

/* ═══ v7: 固定ページ/汎用コンテンツの可読性（pages/archives スコープ） ═══ */
/* パンくず: コンテンツ領域内の要素なのでトークン追従（ヘッダー/フッターは不干渉のまま） */
.mg-topskin-on .p-breadcrumb{background:transparent;color:var(--tsk-text-2)}
.mg-topskin-on .p-breadcrumb a,.mg-topskin-on .p-breadcrumb__text{color:var(--tsk-text-2)}
.mg-topskin-on .p-breadcrumb a:hover{color:var(--tsk-signal)}
/* 自前の明色背景を保つ箱（SWELLアイコン段落/useful-blocks/明示背景色）は元の墨色文字へ戻す */
.mg-topskin-on .post_content p:is([class*="is-style-icon_"],.has-background){color:#333}
.mg-topskin-on .post_content :is(.pb-iconbox,.pb-comBox,.pb-pointbox){color:#333}
.mg-topskin-on .post_content :is(.pb-iconbox,.pb-comBox,.pb-pointbox) p{color:inherit}
/* snow-monkey-forms: ラベル/説明はページ地（ダーク）に載るためトークンへ */
.mg-topskin-on :is(.smf-item__label,.smf-item__col--label,.smf-label,.smf-checkboxes-control__label,.smf-radio-buttons-control__label){color:var(--tsk-text)}
.mg-topskin-on .smf-item__description{color:var(--tsk-text-2)}
/* SWELL タブ/ページネーション: 濃紫既定がダーク地で沈むためトークン調律 */
.mg-topskin-on .c-tabList .c-tabList__button{color:var(--tsk-text-2)}
.mg-topskin-on .c-tabList .c-tabList__button[aria-selected="true"]{color:var(--tsk-text)}
.mg-topskin-on .c-tabList .c-tabList__button::after{background:var(--tsk-signal)}
.mg-topskin-on .c-pagination .page-numbers{background:var(--tsk-card);color:var(--tsk-text);border:1px solid var(--tsk-line)}
.mg-topskin-on .c-pagination a.page-numbers:hover{border-color:var(--tsk-signal);color:var(--tsk-signal)}
.mg-topskin-on .c-pagination .page-numbers.current{background:var(--tsk-signal);color:var(--tsk-nl-btn-text);border-color:var(--tsk-signal)}

/* レール・ガジェボット（JSが生成・desktop余白限定） */
.mg-tsk-railbot{position:fixed;left:6px;top:0;width:34px;height:100vh;pointer-events:none;z-index:2}
@media(max-width:1239px){.mg-tsk-railbot{display:none}}
.mg-tsk-off-clouds .mg-tsk-railbot,.mg-tsk-off-clouds~.mg-tsk-railbot{display:none}
@media(prefers-reduced-motion:reduce){.mg-tsk-railbot{display:none}}

/* ═══ 核アーカイブの統一ヘッダー（カテゴリ/タグ/ブランド共通・ArchiveHeaderが出力） ═══ */
.mg-tsk-archHeader{margin:2px 0 22px}
.mg-tsk-archHeader__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 8px}
.mg-tsk-archHeader__count{font-size:12px;font-weight:700;color:var(--tsk-text);border:1px solid color-mix(in oklab,var(--tsk-text) 28%,transparent);border-radius:999px;padding:2px 12px;background:color-mix(in oklab,var(--tsk-text) 6%,transparent);font-variant-numeric:tabular-nums}
.mg-tsk-archHeader__desc{color:var(--tsk-text-2);font-size:14px;line-height:1.9;max-width:64ch;margin:0}
.mg-tsk-archHeader__chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 0}
.mg-tsk-archHeader__chips a{background:var(--tsk-card);border:1px solid color-mix(in oklab,var(--tsk-text) 22%,transparent);border-radius:999px;padding:4px 14px;color:var(--tsk-text);font-size:13px;text-decoration:none;transition:transform .2s ease,border-color .2s ease,color .2s ease}
.mg-tsk-archHeader__chips a:hover{border-color:var(--tsk-signal);color:var(--tsk-signal);transform:translateY(-2px)}