/* 自ドメインのサブセット配信（2026-08-30。実ページの使用字だけ・fontTools subset・計534KB） */
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.core.b1fb8d4b.woff2) format('woff2');unicode-range:U+20,U+26,U+2c-2e,U+30-39,U+40-45,U+47-49,U+4b-4c,U+4f-57,U+59,U+61-69,U+6b-70,U+72-76,U+79,U+a9,U+b2,U+fa,U+203a,U+3001-3002,U+3007,U+300c-3011,U+301c,U+3042,U+3044,U+3046,U+3048,U+304a-304d,U+304f-3055,U+3057-305b,U+305d,U+305f-3061,U+3063-306b,U+306d-3070,U+3073,U+3076,U+3078-3079,U+307b,U+307e-3082,U+3084,U+3087-308d,U+308f,U+3092-3093,U+30a1-30a4,U+30a6-30a8,U+30ab,U+30ad,U+30af-30b1,U+30b3-30bb,U+30bf-30c1,U+30c3-30c4,U+30c6-30cd,U+30cf-30d1,U+30d3,U+30d5-30d7,U+30d9-30da,U+30dd-30df,U+30e1-30e2,U+30e5-30e7,U+30e9-30ed,U+30ef,U+30f3,U+30fb-30fc,U+33a1,U+ff01,U+ff08-ff09,U+ff0f,U+ff1a,U+ff1d,U+ff1f}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.k00.02d036f0.woff2) format('woff2');unicode-range:U+4e00,U+4e0a-4e0b,U+4e3b,U+4e8b,U+4eba,U+4ecb,U+4ed8,U+4ee5,U+4f1a,U+4f4f,U+4f53,U+4f7f,U+4fa1,U+4fdd,U+500b,U+5148,U+5165,U+516c,U+5185,U+51fa,U+52d5,U+533f,U+53ce,U+53d6-53d7,U+5404,U+5408,U+540c-540d,U+544a,U+55b6,U+5730,U+57fa,U+5831,U+5834,U+5916,U+5b9f,U+5bb3,U+5bb9,U+5bfe,U+5e83,U+5f0f,U+5f53,U+60c5,U+6210,U+6240,U+6271,U+63b2,U+6570,U+6587,U+6599,U+65b9,U+66f8,U+672c,U+67a0,U+6848,U+696d,U+69cb,U+6b63,U+6c17,U+6e96,U+7363,U+7406,U+7531,U+7533,U+7684,U+76ee,U+77e5,U+78ba,U+793a,U+793e,U+79fb,U+7a2e,U+7a4d,U+7b87,U+7d39,U+7d61,U+8005,U+866b,U+8868,U+898b,U+8a02,U+8a18,U+8a8d,U+8aad,U+8abf,U+8acb,U+8c61,U+8f09,U+8fbc,U+901a,U+9023,U+904b,U+9078,U+91d1,U+958b,U+9593,U+9664,U+99c6}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.k01.a7bdb7b7.woff2) format('woff2');unicode-range:U+4ef6,U+4f5c,U+4f9d,U+5024,U+50cf,U+5168,U+5186,U+5199,U+5206,U+5236,U+5247,U+524d,U+52a9,U+533a,U+539f,U+53e3,U+53ef,U+56de,U+56f2,U+56fd,U+57df,U+5909,U+591a,U+5927,U+5b58,U+5b9a,U+5bb6,U+5c01,U+5e74,U+5ea6,U+5f62,U+5fdc,U+610f,U+62c5,U+6355,U+6383,U+63a1,U+652f,U+65bd,U+65e5,U+6642,U+6700,U+671f,U+672b,U+6761,U+6771,U+679c,U+682a,U+6839,U+6a4b,U+6a5f,U+6abb,U+6b21,U+6b62,U+6c0f,U+6c11,U+6c42,U+6cbb,U+6cd5,U+6ce8,U+6d3b,U+6e05,U+7121,U+7269,U+7372,U+751f,U+7528,U+753b,U+7570,U+76f4,U+76f8,U+7701,U+771f,U+7814,U+7a0e,U+7a76,U+7a93,U+7b56,U+7ba1,U+7bc4,U+7d4c,U+7f6e,U+81ea,U+884c,U+88ab,U+88dc,U+8981,U+898f,U+89e6,U+8a31,U+8a3c,U+8ca0,U+8cc7,U+9001,U+916c,U+9332,U+9762,U+983c,U+985e,U+9ad8}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.k02.3324c911.woff2) format('woff2');unicode-range:U+4e16,U+4e26,U+4e2d,U+4e5d,U+4ed5,U+4ee4,U+4efb,U+4f1d,U+4f55,U+4fb5,U+4fe1,U+4fee,U+5009,U+5019,U+501f,U+5065,U+5143,U+5178,U+51ac,U+5272,U+52b9,U+5317,U+5343,U+5371,U+5375,U+53c2,U+53e4,U+542b,U+5439,U+548c,U+54e1,U+554f,U+5584,U+56e3,U+56f3,U+57cb,U+585e,U+5883,U+58eb,U+590f,U+59d4,U+5b66,U+5b85,U+5bbf,U+5c4b,U+5c5e,U+5dde,U+5de3,U+5df1,U+5e02,U+5e1d,U+5e2f,U+5e8a,U+5e9c,U+5eb7,U+5f84,U+5f8b-5f8c,U+6027,U+614b,U+624b,U+62bc,U+62e0,U+63a8,U+63f4,U+6539,U+653f,U+6577,U+6709,U+6790,U+691c,U+6c7a,U+6e2c,U+6ede,U+7167,U+754c,U+7aef,U+7d22,U+7d44,U+89a7,U+89e3,U+8a9e,U+8ab0,U+8ac7,U+8b77,U+8cb8,U+8cbb,U+8fb2,U+8fba,U+9045,U+9055,U+914d,U+9396,U+95a2,U+9805-9806,U+984d,U+9a13,U+9ce5}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.k03.e0207f5a.woff2) format('woff2');unicode-range:U+4e21,U+4f0f,U+4f4d-4f4e,U+505c,U+518d,U+5207,U+5225,U+524a,U+5728,U+5fc5,U+60f3,U+623b,U+6255,U+627f,U+639b,U+65b0,U+65e9,U+662d,U+66f4,U+6708,U+671d,U+6751,U+679a,U+67fb,U+6982,U+6c5f,U+6ca2,U+6d77,U+6e0b,U+6e7f-6e80,U+70b9,U+7247,U+72d9,U+72ed,U+7387,U+7389,U+73fe,U+74b0,U+7523,U+7530,U+753a,U+756a,U+75c7,U+76e3,U+770c,U+7720,U+7981,U+79f0,U+7a74,U+7acb,U+7b2c,U+7bb1,U+7d04,U+7d20,U+7d42,U+7d50,U+7d9a,U+7dd2,U+7e3e,U+7f60,U+7fa4,U+7fa9,U+805e,U+80ba,U+8239,U+8449,U+85e4,U+8702,U+88cf,U+8a00,U+8a17,U+8a2d,U+8a66,U+8a71-8a72,U+8aa4,U+8ab2,U+8b72,U+8c37,U+8cac,U+8db3,U+8fd1,U+8ffd,U+9053,U+907f,U+90e8,U+90fd,U+91cd,U+9577,U+9632,U+9650,U+9662,U+9699,U+96a3,U+96fb,U+990c,U+9ce9}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.k04.a319eb7e.woff2) format('woff2');unicode-range:U+4e0d,U+4eac,U+4eca,U+4fc2,U+5175,U+5229,U+529b,U+5354,U+5358,U+53e5,U+5426,U+5473,U+559a,U+5668,U+576a,U+5948,U+5b57,U+5b89,U+5c0f,U+5c3e,U+5c4a,U+5c71,U+5de5,U+5e81,U+5eab,U+5f15,U+5f37,U+6295,U+629c,U+6319,U+63a2,U+63cf,U+63db,U+6483,U+6765,U+677f,U+6a21,U+6b04,U+6b4c,U+6bb5,U+6bd4,U+6cbf,U+6dfb,U+6e21,U+6f14,U+72b6,U+757f,U+767a,U+7a3f,U+7b97,U+7d1a,U+7d75,U+7e2e,U+7fbd,U+7fc5,U+8170,U+826f,U+8857,U+8907,U+897f,U+89d2,U+8a08,U+8a73,U+8cfc,U+8d77,U+8f03,U+8fd4,U+95b2,U+962a,U+968e,U+96c6,U+984c,U+98df}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/sub/noto-400.rest.9c8c1981.woff2) format('woff2');unicode-range:U+21-25,U+27-2b,U+2f,U+3a-3f,U+46,U+4a,U+4d-4e,U+58,U+5a-60,U+6a,U+71,U+77-78,U+7a-7e,U+3041,U+3043,U+3045,U+3047,U+3049,U+304e,U+3056,U+305c,U+305e,U+3062,U+306c,U+3071-3072,U+3074-3075,U+3077,U+307a,U+307c-307d,U+3083,U+3085-3086,U+308e,U+3090-3091,U+3094-3096,U+3099-30a0,U+30a5,U+30a9-30aa,U+30ac,U+30ae,U+30b2,U+30bc-30be,U+30c2,U+30c5,U+30ce,U+30d2,U+30d4,U+30d8,U+30db-30dc,U+30e0,U+30e3-30e4,U+30e8,U+30ee,U+30f0-30f2,U+30f4-30fa,U+4f8b,U+5ba2,U+5bf8,U+5ddd,U+5efa,U+611b,U+6238,U+63a7,U+68a8,U+795e,U+9031,U+97f3,U+ff02-ff07,U+ff0a-ff0e,U+ff10-ff19,U+ff1b-ff1c,U+ff1e,U+ff20-ff5f}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/sub/noto-700.core.8766f309.woff2) format('woff2');unicode-range:U+20,U+30-34,U+37-38,U+41,U+43,U+50,U+52,U+57,U+61-66,U+69,U+6c-6f,U+72-75,U+79,U+b2,U+3001,U+300c-300d,U+3042,U+3044,U+3046,U+3048,U+304a-304d,U+304f-3055,U+3057,U+3059,U+305b,U+305f-3060,U+3063-306b,U+306e-3070,U+3073,U+3076,U+3078-3079,U+307e,U+3080-3082,U+3084,U+3089-308c,U+308f,U+3092-3093,U+30a2,U+30a4,U+30a6,U+30ad,U+30af-30b0,U+30b3,U+30b5-30bb,U+30bf,U+30c1,U+30c3,U+30c8-30c9,U+30cc-30cd,U+30cf-30d0,U+30d3,U+30d5,U+30da,U+30de-30df,U+30e1-30e2,U+30e9-30ed,U+30f3,U+30fb-30fc,U+ff08-ff09,U+ff0f,U+ff1f}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/sub/noto-700.k00.a91d570a.woff2) format('woff2');unicode-range:U+4e0a,U+4ef6,U+4f1a,U+4f4d-4f4e,U+4f53,U+4f5c,U+4fb5,U+4fe1,U+501f,U+5148,U+5165,U+516c,U+5178,U+5185,U+51fa,U+5206,U+5225,U+5247,U+524a,U+524d,U+52a9,U+52d5,U+5343,U+5358,U+539f,U+53d6,U+53e3-53e4,U+53ef,U+540d,U+5439,U+548c,U+55b6,U+56de,U+5730,U+57fa,U+5834,U+585e,U+5883,U+5927,U+5948,U+5bb3,U+5bf8,U+5bfe,U+5c4b,U+5c71,U+5ddd,U+5de3,U+5e02,U+5e8a,U+5e9c,U+5efa,U+5f0f,U+611b,U+6238,U+6240,U+6355,U+63b2,U+6599,U+65b9,U+65e5,U+662d,U+66f8,U+6700,U+6708,U+671f,U+672c,U+6761,U+679a,U+6848,U+696d,U+6b63,U+6c0f,U+6c17,U+78ba,U+793a,U+793e,U+7d61,U+8005,U+8868,U+8981,U+898b,U+8a02,U+8a18,U+8a8d,U+8acb,U+8f09,U+8fd4,U+9001,U+9023,U+904b,U+9078,U+91d1,U+958b,U+9593,U+9664,U+99c6}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/sub/noto-700.k01.9c413034.woff2) format('woff2');unicode-range:U+4e0d,U+4e2d,U+4e3b,U+4e8b,U+4ee5,U+4efb,U+4f1d,U+4f4f,U+4f55,U+4f7f,U+4f8b,U+4fee,U+505c,U+518d,U+53ce,U+5408,U+544a,U+554f,U+56f3,U+57df,U+5831,U+5bb9,U+5e83,U+5f53,U+5f62,U+5f8c,U+5fdc,U+60c5,U+614b,U+63a7,U+6642,U+6765,U+6790,U+67fb,U+6839,U+68a8,U+69cb,U+6a4b,U+6a5f,U+6abb,U+6b62,U+6c42,U+6ca2,U+6cbb,U+6cd5,U+6e96,U+6ede,U+7121,U+7269,U+7363,U+7372,U+73fe,U+7406,U+7528,U+7530-7531,U+7533,U+753a,U+7684,U+76ee,U+770c,U+77e5,U+795e,U+79f0,U+7a4d,U+7d50,U+7fbd,U+81ea,U+8239,U+8449,U+85e4,U+866b,U+8857,U+88cf,U+88dc,U+89d2,U+89e3,U+8a31,U+8abf,U+8c61,U+8cac,U+8cb8,U+8fbc,U+901a,U+9031,U+9045,U+9577,U+95a2,U+962a,U+9632,U+9699,U+9762,U+97f3,U+9805,U+984d}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/sub/noto-700.k02.09cc2994.woff2) format('woff2');unicode-range:U+6271,U+67a0,U+76e3,U+7f6e}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/sub/noto-700.rest.4bc9ef5b.woff2) format('woff2');unicode-range:U+21-2f,U+35-36,U+39-40,U+42,U+44-4f,U+51,U+53-56,U+58-60,U+67-68,U+6a-6b,U+70-71,U+76-78,U+7a-7e,U+3041,U+3043,U+3045,U+3047,U+3049,U+304e,U+3056,U+3058,U+305a,U+305c-305e,U+3061-3062,U+306c-306d,U+3071-3072,U+3074-3075,U+3077,U+307a-307d,U+307f,U+3083,U+3085-3088,U+308d-308e,U+3090-3091,U+3094-3096,U+3099-30a1,U+30a3,U+30a5,U+30a7-30ac,U+30ae,U+30b1-30b2,U+30b4,U+30bc-30be,U+30c0,U+30c2,U+30c4-30c7,U+30ca-30cb,U+30ce,U+30d1-30d2,U+30d4,U+30d6-30d9,U+30db-30dd,U+30e0,U+30e3-30e8,U+30ee-30f2,U+30f4-30fa,U+4eba,U+4ecb,U+4ed5,U+4ed8,U+4fc2,U+500b,U+5199,U+53d7,U+5b57,U+5ba2,U+5bb6,U+5f37,U+6255,U+652f,U+6570,U+6c7a,U+771f,U+7acb,U+7bb1,U+7d39,U+7d44,U+8ab0,U+9806,U+983c,U+ff1a}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/sub/plex-500.rest.6a13732b.woff2) format('woff2');unicode-range:U+20-7e}

/* くらべどき v2 プロトタイプ — トークンは 01_ビジュアル言語.md が正本 */
:root{
  --paper:#FCFCFA;
  --paper-2:#F0F3F1;
  --canvas:#17201D;
  --canvas-2:#26332F;      /* canvas上の面 */
  --ink:#17201D;
  --body:#37413D;
  --mute:#5D6762;
  --on-canvas:#F2F7F6;
  --on-canvas-mute:#9FB4B2;
  --action:#006B70;
  --action-deep:#004F53;
  --action-text:#006B70;
  --action-soft:#DCEBEC;
  --cv:#006B70; --cv-hover:#004F53;
  --rule:#D7DDDA;
  --border:#7D8984;
  --warn:#B3382A; --warn-soft:#F8E9E6;
  --marker:#FFE486;
  --market:#2C5F72;        /* 札幌の市場色。ページ側で上書き */
  --shadow-1:0 2px 8px rgba(12,60,56,.08);
  --shadow-2:0 8px 24px rgba(12,60,56,.12);
  --font-display:"Helvetica Neue","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  --font-body:"Noto Sans JP","Hiragino Sans","Yu Gothic Medium",Meiryo,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-return:cubic-bezier(.34,1.36,.64,1);
  --t-quick:150ms; --t-fast:250ms; --t-slow:400ms;
  --read:46rem; --wide:76rem;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--body);
  font-family:var(--font-body); font-size:16px; line-height:1.8;
  font-feature-settings:"palt";
  /* 和文の禁則。行頭に小書きのかな・長音を置かない（9/24。ハブで「ヌ／ートリア」）。
     区画（_build/guide/style.css）に9/24付けたのと同じ指定 */
  line-break:strict;
}
h1,h2,h3{color:var(--ink); text-wrap:balance; margin:0}
p{margin:0; text-wrap:pretty}
a{color:var(--action-text)}
a:focus-visible,button:focus-visible{outline:3px solid var(--action); outline-offset:2px; border-radius:4px}
img,svg{max-width:100%}
.wrap{max-width:var(--wide); margin-inline:auto; padding-inline:32px}
.read{max-width:var(--read)}
.num{font-variant-numeric:tabular-nums}

/* ── スキップ・ブランド帯 ── */
.skip{position:absolute; left:-999px; top:8px; background:var(--paper); color:var(--action-text); padding:8px 16px; border-radius:999px; z-index:99}
.skip:focus-visible{left:8px}
.brandbar{background:rgba(252,252,250,.96); border-bottom:1px solid var(--rule)}
.brandbar .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; height:50px}
.brandbar a{display:inline-flex; align-items:center; gap:8px; color:var(--ink); text-decoration:none; font-size:13px; font-weight:700}
.brandbar .list{font-weight:400; text-decoration:underline; text-underline-offset:3px; color:var(--action-text)}

/* ── ヒーロー（canvas面） ── */
/* 2026-09-05: 濃緑の帯をやめて白地に（各市場のハブと同じ骨格。第一画面が丸ごと暗いのは上位の比較メディアに例が無い） */
.hero{background:var(--paper); color:var(--ink); position:relative; overflow:hidden; border-bottom:1px solid var(--rule)}
.hero .wrap{position:relative; z-index:1; padding-block:30px 30px}
.hero .eyebrow{font-size:12px; letter-spacing:.12em; color:var(--mute); font-weight:700}
.hero h1{
  font-family:var(--font-display); font-weight:700; color:var(--ink);
  font-size:clamp(30px,4.6vw,44px); line-height:1.35; letter-spacing:.01em;
  margin-top:14px;
}
.hero .lede{margin-top:20px; max-width:38em; font-size:16px; line-height:1.9; color:var(--body-ink,#3C4B4F)}
.hero .stats{margin-top:22px; font-size:14px; color:var(--mute)}
.hero .stats b{color:var(--ink); font-weight:700; font-size:18px}
/* H1の行リビール（初期非表示は html.js のときだけ＝JS無効でも読める） */
.reveal-line{display:block; overflow:hidden}
.reveal-line>span{display:inline-block;
  transition:transform 500ms var(--ease), opacity 500ms var(--ease), filter 500ms var(--ease)}
/* 2026-09-05: 初期非表示の演出をやめる（JSが止まると見出しと数字が永久に消える。全画面描画でも薄いまま写った） */
html.js .reveal-line>span{transform:none; opacity:1; filter:none}
html.js .is-init .reveal-line>span{transform:none; opacity:1; filter:none}
.reveal-line:nth-child(2)>span{transition-delay:60ms}

/* ── 相場の風景 ── */
.landscape{margin-top:40px; display:grid; gap:14px; max-width:46em}
.ls-row{display:grid; grid-template-columns:11em 1fr; align-items:center; gap:16px; text-decoration:none; color:var(--on-canvas); border-radius:8px}
.ls-row:hover .ls-name{text-decoration:underline; text-underline-offset:3px}
.ls-name{font-size:14px; font-weight:400}
.ls-name small{display:block; color:var(--on-canvas-mute); font-size:12px; font-weight:400}
.ls-track{position:relative; height:34px; background:var(--canvas-2); border-radius:6px; overflow:hidden}
.ls-bar{position:absolute; inset:6px auto 6px 0; border-radius:4px; background:linear-gradient(90deg,#006B70,#35A79B);
  transform-origin:left; transition:transform 400ms var(--ease)}
html.js .ls-bar{transform:scaleX(0)}
html.js .in .ls-bar{transform:scaleX(1)}
.ls-val{position:absolute; right:10px; top:50%; translate:0 -50%; font-size:13px; font-weight:700; color:#FFFFFF; transition:opacity 300ms var(--ease) 300ms}
html.js .ls-val{opacity:0}
html.js .in .ls-val{opacity:1}
.ls-note{font-size:13px; color:var(--on-canvas-mute); align-self:center}
.in .ls-row:nth-child(1) .ls-bar{transition-delay:0ms}
.in .ls-row:nth-child(2) .ls-bar{transition-delay:40ms}
.in .ls-row:nth-child(3) .ls-bar{transition-delay:80ms}
.in .ls-row:nth-child(4) .ls-bar{transition-delay:120ms}
.in .ls-row:nth-child(5) .ls-bar{transition-delay:160ms}

/* ── セクション ── */
.sec{padding-block:72px}
.sec-tint{background:var(--paper-2)}
.sec h2{font-family:var(--font-display); font-size:28px; font-weight:700; letter-spacing:.04em; line-height:1.5}
.sec .sec-lede{margin-top:16px; max-width:var(--read)}
.sec-head{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap}

/* ── ボタン・チップ ── */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:52px; padding:0 32px;
  border-radius:999px; font-size:16px; font-weight:700; text-decoration:none; transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), background var(--t-fast) var(--ease)}
.btn-primary{background:var(--action); color:#FFFFFF}
.btn-primary:hover{background:var(--action-text)}
.btn-primary:active{transform:translateY(1px)}
.btn-sub{background:var(--paper); color:var(--action-text); border:1.5px solid var(--action)}
.btn-sub:hover{background:var(--action-soft)}
.btn .arw{transition:translate var(--t-fast) var(--ease)}
.btn:hover .arw{translate:4px 0}
.chip{display:inline-flex; align-items:center; gap:6px; border-radius:999px; background:var(--paper-2); color:var(--mute); font-size:12px; padding:4px 12px}
.hero .chip{background:var(--surface,#F3F8F7); color:var(--mute)}
.marker{background:linear-gradient(transparent 58%, var(--marker) 58%, var(--marker) 86%, transparent 86%)}
.hero .marker{color:var(--ink); background:linear-gradient(transparent 62%, rgba(255,228,134,.38) 62%, rgba(255,228,134,.38) 88%, transparent 88%)}

/* ── カード共通・出現 ── */
.appear{transition:opacity 600ms var(--ease), transform 600ms var(--ease)}
html.js .appear{opacity:1; transform:none}
html.js .appear.in{opacity:1; transform:none}
.stagger>*{transition:opacity 600ms var(--ease), transform 600ms var(--ease)}
html.js .stagger>*{opacity:0; transform:translateY(16px)}
html.js .stagger.in>*{opacity:1; transform:none}
.stagger.in>*:nth-child(2){transition-delay:60ms}
.stagger.in>*:nth-child(3){transition-delay:120ms}
.stagger.in>*:nth-child(4){transition-delay:180ms}
.stagger.in>*:nth-child(5){transition-delay:240ms}

/* ── サイトカード（ルート） ── */
.sites{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:40px; padding:0; list-style:none}
.site-card{background:var(--paper); border-radius:4px; border:1px solid var(--rule); box-shadow:none; padding:28px;
  display:flex; flex-direction:column; gap:12px;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease)}
.site-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); transition-timing-function:var(--ease-return)}
.site-card .region{display:flex; align-items:center; gap:10px; font-size:12px; color:var(--mute)}
.site-card .region svg{color:var(--mc,var(--action))}
.site-card h3{font-size:20px; line-height:1.5}
.site-card h3 a{color:var(--ink); text-decoration:none}
.site-card h3 a:hover{color:var(--action-text); text-decoration:underline; text-underline-offset:3px}
.site-card .q{font-family:var(--font-display); font-size:17px; font-weight:700; color:var(--ink); line-height:1.7}
.site-card .fact{font-size:14px; color:var(--body)}
.site-card .fact b{font-size:17px; color:var(--ink)}
.site-card .act{margin-top:auto; display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding-top:8px}

/* ── 状況カード ── */
.situations{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:40px}
.sit{background:var(--paper); border-radius:4px; border:1px solid var(--rule); border-top:3px solid var(--market); box-shadow:none; padding:26px 28px; display:flex; flex-direction:column; gap:10px}
.sit svg{color:var(--market)}
.sit h3{font-family:var(--font-display); font-size:18px; font-weight:700; line-height:1.6}
.sit p{font-size:14px; line-height:1.9}
.sit a{font-size:14px; margin-top:auto; padding-top:6px}

/* ── ステッパー ── */
.steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:40px; padding:0; list-style:none; counter-reset:step}
.steps li{position:relative; padding-top:8px}
.steps li::before{counter-increment:step; content:counter(step);
  display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:999px;
  background:var(--action); color:#FFFFFF; font-weight:700; font-size:16px; margin-bottom:14px}
.steps li:not(:last-child)::after{content:""; position:absolute; top:25px; left:52px; right:-16px; height:1px; background:var(--rule)}
.steps b{display:block; color:var(--ink); font-size:16px; margin-bottom:6px}
.steps p{font-size:14px}

/* ── 価格バンド（相場の全景） ── */
.band{margin-top:48px}
.band+.band{margin-top:56px}
.band h3{font-family:var(--font-display); font-size:20px; font-weight:700}
.band h3 small{font-family:var(--font-body); font-size:13px; color:var(--mute); font-weight:400; margin-left:12px}
.pp{display:grid; gap:10px; margin-top:18px}
.pp-row{display:grid; grid-template-columns:13em 1fr 11em; align-items:center; gap:14px}
.pp-name{font-size:14px; text-decoration:none; color:var(--action-text)}
.pp-name:hover{text-decoration:underline; text-underline-offset:3px}
.pp-track{position:relative; height:12px; background:#E9F0EF; border-radius:999px; overflow:hidden}
.pp-fill{position:absolute; inset:0 auto 0 0; border-radius:999px; background:var(--market);
  transform-origin:left; transition:transform 400ms var(--ease)}
html.js .pp-fill{transform:scaleX(0)}
html.js .in .pp-fill{transform:scaleX(1)}
.pp-val{font-size:14px; font-weight:700; color:var(--ink); text-align:right; white-space:nowrap}
.pp-val small{font-weight:400; color:var(--mute)}
.pp .pp-row:nth-child(1) .pp-fill{transition-delay:0ms}
.pp .pp-row:nth-child(2) .pp-fill{transition-delay:40ms}
.pp .pp-row:nth-child(3) .pp-fill{transition-delay:80ms}
.pp .pp-row:nth-child(4) .pp-fill{transition-delay:120ms}
.pp .pp-row:nth-child(5) .pp-fill{transition-delay:160ms}
.pp .pp-row:nth-child(6) .pp-fill{transition-delay:200ms}
.pp .pp-row:nth-child(7) .pp-fill{transition-delay:240ms}
.pp .pp-row:nth-child(8) .pp-fill{transition-delay:280ms}

/* ── 証拠バー・会社カード ── */
.evidence{display:flex; align-items:center; gap:16px; flex-wrap:wrap; background:var(--paper-2); border-radius:8px; padding:12px 20px; font-size:14px; color:var(--mute); margin-top:40px}
.evidence b{color:var(--ink); font-weight:400}
.oplist{display:grid; gap:24px; margin-top:24px}
.op{background:var(--paper); border-radius:4px; border:1px solid var(--rule); box-shadow:none; padding:28px;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease)}
.op:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); transition-timing-function:var(--ease-return)}
.op-head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
.op-head h3{font-size:18px}
.op-head h3 a{color:var(--ink); text-decoration:none}
.op-head h3 a:hover{color:var(--action-text); text-decoration:underline; text-underline-offset:3px}
.op-meta{font-size:13px; color:var(--mute)}
.op-price{display:flex; gap:32px; flex-wrap:wrap; background:var(--paper-2); border-radius:8px; padding:18px 22px; margin-top:16px}
.op-price div{display:flex; flex-direction:column; gap:2px}
.op-price dt{font-size:12px; color:var(--mute)}
.op-price dd{margin:0; font-size:15px; color:var(--ink)}
.op-price dd b{font-size:28px; font-weight:700; letter-spacing:.01em}
.op-price dd.none{font-size:14px; color:var(--mute); align-self:center; padding-top:10px}
.op-note{margin-top:12px; font-size:13px; color:var(--warn); background:var(--warn-soft); border-radius:6px; padding:8px 14px}
.op-chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; padding:0; list-style:none}
.op-chips li{border-radius:999px; background:var(--paper-2); font-size:12px; color:var(--body); padding:3px 12px}
.op-chips li.assoc{background:var(--action-soft); color:var(--action-text); font-weight:400}
.op-act{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:20px}
.op-act .tel{font-size:18px; font-weight:700; color:var(--ink); text-decoration:none}
.op-act .tel small{display:block; font-size:12px; color:var(--mute); font-weight:400}

/* ── 落とし穴と質問 ── */
.twocol{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; margin-top:40px}
.pit{display:grid; gap:24px}
.pit article{border-left:3px solid var(--rule); padding-left:20px}
.pit b{display:block; color:var(--ink); font-size:16px; margin-bottom:6px}
.pit p{font-size:14px}
.asklist{background:var(--paper); border-radius:8px; box-shadow:var(--shadow-1); padding:28px}
.asklist h3{font-family:var(--font-display); font-size:18px; margin-bottom:16px}
.asklist ul{margin:0; padding:0; list-style:none; display:grid; gap:12px}
.asklist li{display:grid; grid-template-columns:22px 1fr; gap:10px; font-size:14px; line-height:1.8}
.asklist li::before{content:""; width:18px; height:18px; margin-top:5px; border:1.5px solid var(--border); border-radius:4px}

/* ── 定義リスト（数字の出どころ） ── */
.sahou{margin:40px 0 0; max-width:var(--read)}
.sahou dt{font-family:var(--font-display); font-size:18px; font-weight:700; color:var(--ink)}
.sahou dd{margin:8px 0 28px; font-size:15px}

/* ── フッタ ── */
.foot{background:var(--canvas); color:var(--on-canvas-mute); margin-top:96px}
.foot .wrap{padding-block:56px}
.foot ul{display:flex; gap:8px 28px; flex-wrap:wrap; margin:0 0 24px; padding:0; list-style:none}
.foot a{color:var(--on-canvas); font-size:14px; text-decoration:none}
.foot a:hover{text-decoration:underline; text-underline-offset:3px}
.foot .pr{font-size:12px; max-width:46em}
.foot .copyright{margin-top:20px; font-size:13px}
.byline{font-size:13px; color:var(--mute); margin-top:64px}

/* ── サイトヘッダ（比較サイト用） ── */
.sitehead{background:var(--canvas)}
.sitehead .wrap{display:flex; align-items:baseline; gap:20px; flex-wrap:wrap; padding-block:18px 0}
.sitehead .brand{font-family:var(--font-display); font-size:20px; font-weight:700; color:#FFFFFF; text-decoration:none}
.sitehead .tagline{font-size:12px; color:var(--on-canvas-mute)}
.sitenav{background:var(--canvas)}
.sitenav ul{display:flex; gap:4px 24px; flex-wrap:wrap; margin:0; padding:12px 0 0; list-style:none}
.sitenav a{color:var(--on-canvas-mute); font-size:13px; text-decoration:none; padding-bottom:10px; border-bottom:2px solid transparent}
.sitenav a[aria-current]{color:#FFFFFF; border-bottom-color:var(--action)}
.sitenav a:hover{color:#FFFFFF}
.hero-sea{display:none}

/* ── レスポンシブ ── */
@media(max-width:860px){
  .wrap{padding-inline:16px}
  .sites,.situations,.twocol{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr; gap:24px}
  .steps li:not(:last-child)::after{display:none}
  .sec{padding-block:48px}
  .hero .wrap{padding-block:32px 36px}
  .pp-row{grid-template-columns:1fr; gap:6px}
  .pp-val{text-align:left}
  .ls-row{grid-template-columns:1fr}
  .op-price{gap:20px}
}
@media(prefers-reduced-motion:reduce){
  *{transition-duration:0ms !important; animation:none !important}
  .appear,.stagger>*,.reveal-line>span{opacity:1 !important; transform:none !important; filter:none !important}
  .ls-bar,.pp-fill{transform:scaleX(1) !important}
  .ls-val{opacity:1 !important}
}

/* ══ v3追加: 条件用紙・ウィザード（Codex「依頼の下書き」移植。色相はうちのトークン） ══ */
:root{
  --font-data:"IBM Plex Mono",var(--font-body);  /* 数値だけ等幅。和文はPlexに無いので本文書体へ落とす */
  --paper-sheet:#FBFCF9;
  --shadow-sheet:0 1px 0 rgba(11,34,38,.06), 0 14px 36px rgba(11,34,38,.09);
  --shadow-sheet-lift:0 24px 70px rgba(11,34,38,.15);
  --t-compose:560ms;
}
.wiz{display:grid; grid-template-columns:minmax(0,62fr) minmax(0,38fr); gap:32px; align-items:start}
.wiz-stage{background:var(--paper); border-radius:8px; box-shadow:var(--shadow-1); padding:36px}
.wiz-q{font-family:var(--font-display); font-size:clamp(22px,3vw,30px); font-weight:700; line-height:1.5; color:var(--ink)}
.wiz-help{margin-top:12px; font-size:14px; color:var(--mute)}
.wiz-danger{background:var(--warn-soft); color:var(--warn); border-radius:8px; padding:12px 16px; font-size:14px; margin-bottom:20px}
.wiz-opts{display:flex; flex-wrap:wrap; gap:12px; margin-top:24px}
.wiz-opts button, .wiz-opts label{cursor:pointer; min-height:52px; padding:12px 24px; border-radius:8px;
  border:1.5px solid var(--border); background:var(--paper); color:var(--ink); font-size:15px; font-weight:400;
  transition:background var(--t-quick) var(--ease), border-color var(--t-quick) var(--ease), transform var(--t-quick) var(--ease)}
.wiz-opts button:hover{background:var(--action-soft); border-color:var(--action)}
.wiz-opts button:active{transform:scale(.97)}
.wiz-opts button[aria-pressed="true"]{background:var(--action-soft); border-color:var(--action); color:var(--action-text); font-weight:700}
.wiz-select{min-height:52px; border-radius:8px; border:1.5px solid var(--border); font-size:15px; padding:0 16px; background:var(--paper); color:var(--ink); max-width:20em}
.wiz-back{margin-top:28px; font-size:13px}
.wiz-fig{margin:24px 0 0; max-width:26em}
.wiz-fig svg{display:block}
.wiz-count{font-size:12px; color:var(--mute); margin-bottom:16px}
/* 条件用紙 */
.sheet{background:var(--paper-sheet); border-radius:3px; box-shadow:var(--shadow-sheet); padding:26px 28px; position:sticky; top:24px}
.sheet h2{font-size:16px; font-weight:700; color:var(--ink); font-family:var(--font-body); letter-spacing:.02em; margin:0 0 4px}
.sheet .sheet-sub{font-size:12px; color:var(--mute); margin-bottom:16px}
.sheet dl{margin:0; display:grid; gap:10px}
.sheet .row{display:grid; grid-template-columns:7.5em 1fr; gap:10px; align-items:baseline; border-bottom:1px dashed var(--rule); padding-bottom:8px}
.sheet dt{font-size:12px; color:var(--mute)}
.sheet dd{margin:0; font-size:14px; color:var(--ink); font-family:var(--font-body); font-variant-numeric:tabular-nums; font-weight:400; min-height:1.4em}
.sheet dd:empty::before{content:"　"}
.sheet dd.ask{color:var(--warn); font-family:var(--font-body); font-size:13px}
.sheet .flash{animation:sheetflash 480ms var(--ease)}
@keyframes sheetflash{0%{background:var(--action-soft)}100%{background:transparent}}
.sheet-empty{font-size:14px; color:var(--mute); line-height:1.9}
.sheet-note{margin-top:16px; font-size:12px; color:var(--mute)}
/* 語の移動（Signature） */
.fly{position:fixed; z-index:50; pointer-events:none; font-size:15px; font-weight:700; color:var(--action-text);
  transition:transform var(--t-compose) var(--ease), opacity var(--t-compose) var(--ease); will-change:transform}
/* 結果・依頼メモ */
.result{margin-top:32px; border-top:3px solid var(--action); background:var(--paper); border-radius:0 0 8px 8px; box-shadow:var(--shadow-1); padding:28px}
.result h3{font-family:var(--font-display); font-size:22px; line-height:1.5}
.result .why{font-size:13px; color:var(--mute); margin-top:8px}
.result .act{margin-top:20px; display:flex; gap:14px; flex-wrap:wrap; align-items:center}
.memo{background:var(--paper-sheet); border-radius:3px; box-shadow:var(--shadow-sheet); padding:24px 26px; margin-top:24px}
.memo h3{font-size:15px; font-family:var(--font-body); font-weight:700; margin-bottom:12px}
.memo pre{margin:0; font-family:var(--font-body); font-variant-numeric:tabular-nums; font-size:13px; line-height:2.0; white-space:pre-wrap; color:var(--ink)}
.memo .act{margin-top:16px; display:flex; gap:12px; flex-wrap:wrap}
.btn-copy{min-height:44px; padding:0 22px; border-radius:999px; border:1.5px solid var(--action); background:var(--paper);
  color:var(--action-text); font-size:14px; font-weight:700; cursor:pointer}
.btn-copy:hover{background:var(--action-soft)}
.btn-copy.done{background:var(--action); color:#fff}
/* JS無効時: フォーム全開・ウィザードUI非表示 */
html.js .nojs-form{display:none}
html:not(.js) .wiz-stage-live{display:none}
.nojs-form fieldset{border:1px solid var(--rule); border-radius:8px; padding:16px 20px; margin:0 0 16px}
.nojs-form legend{font-weight:700; font-size:15px; padding:0 8px}
.nojs-form label{display:inline-flex; gap:6px; align-items:center; margin:4px 16px 4px 0; font-size:14px}
@media(max-width:860px){
  .wiz{grid-template-columns:1fr}
  .sheet{position:static}
  .wiz-stage{padding:24px 20px; border-radius:8px}
}
@media(prefers-reduced-motion:reduce){
  .fly{display:none}
  .sheet .flash{animation:none}
}


/* ui-review 2026-08-29 対応 */
caption{display:block; text-align:left; max-width:calc(100vw - 48px); text-wrap:pretty}
h1,h2,h3{line-break:strict}
html:not(.js) .sheet{display:none}

/* 会社ページの条件適合ボックス（company-fit.js が描画） */
.kdk-fit{background:var(--paper-sheet); border-radius:3px; box-shadow:var(--shadow-sheet); padding:20px 24px; margin:24px 0}
.kdk-fit h2{font-family:var(--font-body); font-size:15px; font-weight:700; margin:0 0 10px; letter-spacing:.02em}
.kdk-fit dl{margin:0; display:grid; gap:8px}
.kdk-fit .row{display:grid; grid-template-columns:8em 1fr; gap:10px; align-items:baseline; border-bottom:1px dashed var(--rule); padding-bottom:6px}
.kdk-fit dt{font-size:12px; color:var(--mute)}
.kdk-fit dd{margin:0; font-size:14px; color:var(--ink); font-variant-numeric:tabular-nums}
.kdk-fit dd.ask, .kdk-fit .fit-line.ask{color:var(--warn)}
.kdk-fit .fit-line{font-size:14px; font-weight:700; margin:0 0 12px}
.kdk-fit .fit-note{margin-top:12px; font-size:12px; color:var(--mute)}
/* 印刷用メモ雛形（JS無効時に表示。JS有効時はウィザードが代替） */
html.js .print-memo{display:none}
.print-memo{background:var(--paper-sheet); border-radius:3px; box-shadow:var(--shadow-sheet); padding:24px 26px; margin-top:24px}
.print-memo h3{font-size:15px; font-weight:700; margin:0 0 12px}
.print-memo pre{margin:0; font-family:var(--font-body); font-size:13px; line-height:2.2; white-space:pre-wrap}
@media print{.print-memo{box-shadow:none; border:1px solid var(--rule)}}

/* 情緒市場のヒーロー写真バンド（30_アセット仕様） */
figure.band{margin:0; position:relative}
figure.band img{display:block; width:100%; height:auto}
figure.band figcaption{position:absolute; right:16px; bottom:12px; font-size:12px; color:#FFFFFF; background:rgba(11,34,38,.55); padding:2px 10px; border-radius:999px}