@import url('/assets/product.css');
.prose{position:relative;z-index:1;padding-top:24px;padding-bottom:24px}
.prose h1{display:block;font-size:clamp(26px,7.2vw,44px);line-height:1.4}
.prose h2{font-family:var(--disp);font-weight:400;font-size:clamp(18px,4.8vw,24px);line-height:1.4;margin:24px 0 12px}
.prose h3{font-size:16px;margin:16px 0 8px}
.prose p,.prose li{font-size:16px;line-height:1.65;overflow-wrap:anywhere}
.prose ul,.prose ol{padding-left:24px}
.prose blockquote{margin:16px 0;padding:12px 16px;background:var(--panel);border-left:4px solid var(--acc2)}
.table-scroll{overflow:visible}
.prose table.rec{table-layout:fixed}
@media (max-width:600px){
  .prose table.rec,.prose table.rec tbody,.prose table.rec tr,.prose table.rec td{display:block;width:100%}
  .prose table.rec thead{display:none}
  .prose table.rec tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .prose table.rec td{padding:8px 0;border:0;white-space:normal;overflow-wrap:anywhere}
  .prose table.rec td::before{content:attr(data-label);display:block;font-size:12px;line-height:1.65;color:var(--mut);font-weight:700;margin-bottom:4px}
}

/* style guide 0.7 §4: 文中と足元の短いリンク */
.disc a,.note a,footer a{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}

/* style guide 0.7 §9: Brain への導線（10/12）— /method/・/about/ には帯も紹介ボタンも無い。足す規則は無し（product.css を @import しているので、そちらの塊の選ぶ子はこの 2 ページには当たらない） */
/* style guide 0.8 ⑤: 評価方法の表（スマホ） */
/* 全部 #method（評価方法の <main>）で始める。601px 以上は今と同じ見た目（前置き・ol・点の付け方を inline、li を display:contents にして、元の 1 段落と同じ字の並びに戻す） */
#method table.rec td .crit{margin:0;padding:0;list-style:none}
#method table.rec td .crit-lead,#method table.rec td .crit,#method table.rec td .scale{display:inline;margin:0;padding:0;font-size:1em;line-height:inherit;overflow-wrap:inherit}
#method table.rec td .crit li{display:contents;font-size:1em;line-height:inherit;overflow-wrap:inherit}
@media (max-width:600px){
  /* 表の 1 行 = 1 枚のカード（地は --glass・線は --line・角丸は radius-lg の 12px＝パネルと同じ・余白とカードの間は spacing-lg の 12px） */
  #method table.rec tr{background:var(--glass);border:1px solid var(--line);border-radius:12px;padding:12px;margin:0 0 12px}
  #method table.rec td{padding:0}
  #method table.rec td+td{margin-top:12px}
  /* 1 列目（軸の名前・判定語）はカードの見出し。欄の名前は出さない。言葉の途中では折らない（0.7 §4 の短いラベルと同じ） */
  #method table.rec td:first-child{font-weight:700;line-height:1.5;padding-bottom:8px;border-bottom:1px solid var(--line);word-break:keep-all;line-break:strict;overflow-wrap:anywhere}
  #method table.rec td:first-child::before{content:none;display:none}
  /* 2 列目以降の欄の名前（小さな見出し）も言葉の途中では折らない */
  #method table.rec td::before{word-break:keep-all;line-break:strict}
  /* 点（表 2 の 3 列目）は「点 3」と 1 行に */
  #method table.rec td[data-label="点"]{display:flex;align-items:baseline;gap:8px}
  #method table.rec td[data-label="点"]::before{margin-bottom:0}
  /* 表 1 の項目: 前置き → (a)〜(d) を 1 項目 1 行 → 点の付け方 */
  #method table.rec td .crit-lead{display:block;margin-bottom:4px;line-break:strict}
  #method table.rec td .crit{display:block}
  #method table.rec td .crit li{display:block;padding-left:1.7em;text-indent:-1.7em;margin-top:4px;line-break:strict}
  #method table.rec td .crit li:first-child{margin-top:0}
  #method table.rec td .crit .crit-sep{display:none}
  #method table.rec td .scale{display:block;margin-top:12px}
  #method table.rec td .scale .crit-sep{display:none}
  #method table.rec td .scale .scale-pt{word-break:keep-all;line-break:strict;white-space:nowrap}
  #method table.rec td .scale .scale-pt{display:inline-block;padding:0 8px;margin:4px 6px 4px 0;border:1px solid var(--line);border-radius:999px;background:var(--glass-2)}
  /* Chromium だけ: 箇条書きと前置きの折り返しを文節にそろえる（試験用・overflow-wrap:anywhere とは組まない） */
  @supports (word-break:auto-phrase){
    #method table.rec td .crit li,#method table.rec td .crit-lead{word-break:auto-phrase;overflow-wrap:normal}
  }
}
