/* データ・ツールのページ共通（/tools.html と /data/・/tools/・/glossary/ など）
   文字の下限：本文16px／補足14px／バッジ13px（html は 62.5% なので 1.6rem＝16px） */
[hidden]{display:none !important}
.dt-wrap{max-width:112rem; margin:0 auto; padding:2.4rem 2.4rem 9.6rem}
.dt-wrap.narrow{max-width:84rem}
.dt-crumb{font-size:1.4rem; color:var(--sub); padding:0 0 2rem}
.dt-crumb a{color:var(--sub); text-decoration:underline; text-underline-offset:.2em}

/* 見出しブロック */
.dt-head{margin:0 0 3.2rem}
.dt-kicker{display:inline-flex; align-items:center; gap:.6rem; font-size:1.4rem; font-weight:700; color:var(--brand-d)}
.dt-kicker::before{content:""; width:.8rem; height:.8rem; border-radius:50%; background:currentColor}
.dt-head h1{font-size:clamp(2.6rem,2rem + 1.8vw,3.6rem); font-weight:800; line-height:1.35; letter-spacing:-.01em; margin:1rem 0 1.4rem}
.dt-lede{font-size:1.7rem; line-height:1.85; color:#2b2d31; margin:0 0 1.2rem; max-width:46em}
.dt-meta{font-size:1.4rem; color:var(--sub); margin:0}
.dt-meta b{color:var(--ink); font-weight:700}

/* データ・ツール間の切り替え */
.dt-nav{display:flex; gap:.8rem; flex-wrap:wrap; margin:0 0 2.8rem; padding:0 0 1.6rem; border-bottom:1px solid var(--line)}
.dt-nav a{display:inline-flex; align-items:center; min-height:4rem; padding:0 1.4rem; border:1px solid var(--line); border-radius:var(--radius); font-size:1.4rem; font-weight:600; color:var(--ink); background:#fff}
.dt-nav a:hover{border-color:var(--ink); opacity:1}
.dt-nav a[aria-current="page"]{background:var(--ink); border-color:var(--ink); color:#fff}

/* 数字のまとめ */
.dt-stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); gap:1.2rem; list-style:none; padding:0; margin:0 0 3.2rem}
.dt-stats li{border:1px solid var(--line); border-top:2px solid var(--ink); padding:1.6rem 1.8rem; background:#fff}
.dt-stats .n{display:block; font-family:"Outfit",sans-serif; font-size:3.4rem; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums}
.dt-stats .l{display:block; font-size:1.4rem; color:var(--sub); margin-top:.4rem}

/* 絞り込みのチップ */
.dt-filters{display:flex; flex-wrap:wrap; gap:.8rem; margin:0 0 2.4rem}
.chip{display:inline-flex; align-items:center; gap:.6rem; min-height:4rem; padding:0 1.4rem; border:1px solid var(--line); border-radius:999px; background:#fff; font:inherit; font-size:1.4rem; font-weight:600; color:var(--ink); cursor:pointer}
.chip i{width:.9rem; height:.9rem; border-radius:50%; flex:none}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink); border-color:var(--ink); color:#fff}
.chip:focus-visible,.dt-nav a:focus-visible,.dt-btn:focus-visible{outline:2px solid var(--brand); outline-offset:2px}

/* セクション */
.dt-sec{margin:0 0 5.6rem}
.dt-sec > h2{font-size:clamp(2.1rem,1.8rem + .8vw,2.6rem); font-weight:800; line-height:1.45; margin:0 0 1.2rem; padding:0 0 1rem; border-bottom:2px solid var(--ink)}
.dt-sec > h2 small{display:inline-block; margin-left:1rem; font-size:1.4rem; font-weight:500; color:var(--sub)}
.dt-sec > p{font-size:1.6rem; line-height:1.85; margin:0 0 1.6rem}
.dt-sec h3{font-size:1.9rem; font-weight:700; line-height:1.5; margin:3.2rem 0 1.2rem}

/* 見やすい表（readable-tables のルール） */
.rt{width:100%; border-collapse:collapse; font-size:1.6rem; line-height:1.7; background:#fff}
.rt thead th{white-space:nowrap; background:var(--bg2); font-size:1.4rem; font-weight:700; color:#3a3d42; border-bottom:1px solid var(--ink)}
.rt th,.rt td{text-align:left; vertical-align:top; padding:1.6rem 1.8rem; border-bottom:1px solid var(--line)}
.rt tbody th{font-weight:700}
.rt .col-name{min-width:14em; width:28%}
.rt .col-short{white-space:nowrap; width:1%}
.rt .num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.rt td ul{margin:0; padding-left:1.1em}
.rt td li + li{margin-top:.6rem}
.rt .sub{display:block; font-size:1.4rem; color:var(--sub); font-weight:400; line-height:1.6; margin-top:.4rem}
.rt a{text-decoration:underline; text-underline-offset:.2em}
@media (max-width:720px){
  .rt thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  .rt,.rt tbody,.rt tr,.rt th,.rt td{display:block; width:100%}
  .rt tr{padding:1.6rem 0; border-top:1px solid var(--ink)}
  .rt tbody tr:first-child{border-top:2px solid var(--ink)}
  .rt th,.rt td{border-bottom:0; padding:.8rem 0 0}
  .rt th[scope="row"]{padding:0 0 .6rem; font-size:1.7rem}
  .rt td::before{content:attr(data-label); display:block; font-size:1.3rem; font-weight:700; color:var(--sub); margin-bottom:.2rem}
  .rt .col-short,.rt .num{white-space:normal; text-align:left; width:auto}
}

/* バッジ */
.badge{display:inline-flex; align-items:center; gap:.4rem; font-size:1.3rem; font-weight:700; line-height:1.4; padding:.2rem .8rem; border-radius:var(--radius); border:1px solid currentColor; white-space:nowrap}
.badge.ok{color:#1d7a45} .badge.ng{color:#b3261e} .badge.warn{color:#a8690a} .badge.mute{color:var(--sub)}
.badge.fill{background:var(--ink); border-color:var(--ink); color:#fff}
.area-tag{display:inline-flex; align-items:center; gap:.5rem; font-size:1.3rem; font-weight:700; color:var(--c,#6b7280)}
.area-tag::before{content:""; width:.8rem; height:.8rem; border-radius:50%; background:currentColor}

/* カード一覧（ハブ） */
.dt-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(30rem,1fr)); gap:1.6rem}
.dt-card{display:flex; flex-direction:column; gap:.8rem; padding:2.2rem 2.2rem 2rem; background:#fff; border:1px solid var(--line); border-top:2px solid var(--ink); color:var(--ink); min-height:100%}
.dt-card:hover{border-color:var(--ink); opacity:1}
.dt-card b{font-size:1.9rem; line-height:1.45}
.dt-card span{font-size:1.5rem; line-height:1.75; color:#44474d}
.dt-card .go{margin-top:auto; padding-top:.8rem; font-size:1.4rem; font-weight:700; color:var(--ink)}
.dt-card:hover .go{text-decoration:underline; text-underline-offset:.2em}

/* よくある質問 */
.dt-faq details{border-bottom:1px solid var(--line); padding:1.6rem 0}
.dt-faq summary{cursor:pointer; font-size:1.7rem; font-weight:700; line-height:1.6; list-style:none; display:flex; justify-content:space-between; gap:1.6rem}
.dt-faq summary::-webkit-details-marker{display:none}
.dt-faq summary::after{content:"＋"; flex:none; color:var(--sub)}
.dt-faq details[open] summary::after{content:"－"}
.dt-faq details p{font-size:1.6rem; line-height:1.85; margin:1.2rem 0 0; color:#2b2d31}

/* 注意書き・関連 */
.dt-note{font-size:1.4rem; line-height:1.8; color:var(--sub); margin:2.4rem 0 0}
.dt-box{background:var(--bg2); border-left:3px solid var(--ink); padding:2rem 2.4rem; margin:0 0 3.2rem; font-size:1.6rem; line-height:1.85}
.dt-box h2,.dt-box h3{margin:0 0 .8rem; font-size:1.7rem; font-weight:800; border:0; padding:0}
.dt-box ul{margin:0; padding-left:1.2em}
.dt-box li + li{margin-top:.4rem}
.dt-related{display:grid; grid-template-columns:repeat(auto-fill,minmax(26rem,1fr)); gap:1rem; list-style:none; padding:0; margin:0}
.dt-related a{display:block; padding:1.4rem 1.6rem; border:1px solid var(--line); font-size:1.5rem; font-weight:600; line-height:1.6; color:var(--ink); background:#fff}
.dt-related a:hover{border-color:var(--ink); opacity:1}

/* フォーム（計算ツール・診断） */
.dt-form{display:grid; gap:2rem; padding:2.4rem; border:1px solid var(--line); border-top:2px solid var(--ink); background:#fff; margin:0 0 2.4rem}
.dt-field{display:grid; gap:.6rem}
.dt-field > label,.dt-field > .lbl{font-size:1.6rem; font-weight:700}
.dt-field .hint{font-size:1.4rem; color:var(--sub); line-height:1.6}
.dt-input,.dt-select{font:inherit; font-size:1.6rem; min-height:4.8rem; padding:0 1.4rem; border:1px solid #c9cbcf; border-radius:var(--radius); background:#fff; color:var(--ink); width:100%; max-width:32rem}
.dt-input:focus,.dt-select:focus{outline:2px solid var(--ink); outline-offset:1px}
.dt-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(22rem,1fr)); gap:2rem}
.dt-btn{display:inline-flex; align-items:center; justify-content:center; gap:.8rem; min-height:4.8rem; padding:0 2.4rem; border:0; border-radius:var(--radius); background:var(--ink); color:#fff; font:inherit; font-size:1.6rem; font-weight:700; cursor:pointer}
.dt-btn:hover{background:#000}
.dt-btn.ghost{background:#fff; color:var(--ink); border:1px solid var(--ink)}
.dt-result{border:2px solid var(--ink); padding:2.4rem; margin:0 0 3.2rem; background:#fff}
.dt-result .big{font-family:"Outfit","Noto Sans JP",sans-serif; font-size:clamp(3rem,2.6rem + 1.2vw,4rem); font-weight:800; line-height:1.2; font-variant-numeric:tabular-nums}
.dt-result .big small{font-size:.45em; font-weight:700; margin-left:.3rem}
.dt-result .cap{font-size:1.5rem; color:var(--sub); margin:.4rem 0 0}
.dt-result-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(22rem,1fr)); gap:2.4rem 3.2rem}

@media (max-width:640px){
  .dt-wrap{padding:1.6rem 1.6rem 7.2rem}
  .dt-form,.dt-result{padding:1.8rem}
  .dt-input,.dt-select{max-width:none}
}

/* 台帳・カレンダーの表の中身 */
.rt-title{display:block; margin-top:.4rem; font-size:1.7rem; line-height:1.55}
.rt-date{font-weight:700; font-variant-numeric:tabular-nums}
.rt .sub-wrap{white-space:normal; min-width:12em}

/* カレンダー */
.cal-sub p{margin:0 0 1.4rem}
.cal-sub-btns{display:flex; flex-wrap:wrap; gap:1.2rem}
.cal-list{list-style:none; margin:0; padding:0}
.cal-item{display:grid; grid-template-columns:7.2rem 1fr; gap:2rem; padding:2rem 0; border-bottom:1px solid var(--line)}
.cal-date{text-align:center; border:1px solid var(--ink); padding:.8rem 0; align-self:start; background:#fff}
.cal-date b{display:block; font-family:"Outfit",sans-serif; font-size:2.2rem; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums}
.cal-date span{display:block; font-size:1.4rem; color:var(--sub)}
.cal-tags{display:flex; flex-wrap:wrap; align-items:center; gap:.8rem}
.cal-title{font-size:1.8rem; font-weight:700; line-height:1.55; margin:.6rem 0 .4rem}
.cal-when{font-size:1.5rem; font-weight:600; margin:0}
.cal-note{font-size:1.5rem; line-height:1.75; color:#44474d; margin:.6rem 0 0}
.cal-links{display:flex; flex-wrap:wrap; gap:.4rem 1.6rem; font-size:1.4rem; color:var(--sub); margin:.8rem 0 0}
.cal-links a{text-decoration:underline; text-underline-offset:.2em}
.cal-past summary{cursor:pointer; font-size:1.7rem; font-weight:700; padding:1.4rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.cal-item.is-past{opacity:.75}
@media (max-width:560px){
  .cal-item{grid-template-columns:5.6rem 1fr; gap:1.4rem}
  .cal-date b{font-size:1.8rem}
  .cal-sub-btns .dt-btn{width:100%}
}

/* 料金比較 */
.pl-svc{margin:0 0 4rem}
.pl-svc h3{display:flex; align-items:baseline; gap:1.2rem; font-size:2rem; margin:3.2rem 0 1.2rem}
.pl-svc h3 small{font-size:1.4rem; font-weight:500; color:var(--sub)}
.dt-related a .sub{display:block; font-size:1.4rem; font-weight:400; color:var(--sub); margin-top:.2rem}

/* 用語集 */
.gl-jump{display:flex; flex-wrap:wrap; gap:.8rem; margin:0 0 3.2rem}
.gl-jump a{display:inline-flex; align-items:center; gap:.8rem; min-height:4rem; padding:0 1.4rem; border:1px solid var(--line); font-size:1.5rem; font-weight:600; background:#fff}
.gl-jump a span{font-size:1.3rem; color:var(--sub)}
.gl-jump a:hover{border-color:var(--ink); opacity:1}
.gl-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(32rem,1fr)); gap:0 3.2rem; margin:0}
.gl-item{padding:1.6rem 0; border-bottom:1px solid var(--line)}
.gl-item dt{font-size:1.8rem; font-weight:700; line-height:1.5}
.gl-item dt a{text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.25em}
.gl-en{margin-left:.8rem; font-size:1.4rem; font-weight:500; color:var(--sub)}
.gl-item dd{margin:.4rem 0 0; font-size:1.5rem; line-height:1.75; color:#44474d}
.gl-short{border:2px solid var(--ink); padding:2rem 2.4rem; margin:0 0 4rem; background:#fff}
.gl-label{display:inline-block; font-size:1.4rem; font-weight:700; color:var(--brand-d); margin-bottom:.6rem}
.gl-short p{margin:0; font-size:1.9rem; font-weight:700; line-height:1.7}
.gl-body p{font-size:1.7rem; line-height:1.95}
.gl-caution{margin:0}

/* 削減効果シミュレーター */
.roi-tasks{border:0; padding:0; margin:0; display:grid; gap:1.4rem}
.roi-tasks legend{font-size:1.6rem; font-weight:700; padding:0; margin-bottom:.4rem}
.roi-tasks .hint{margin:0}
.roi-row{display:grid; grid-template-columns:minmax(18rem,2fr) repeat(3,minmax(10rem,1fr)) auto; gap:1.2rem; align-items:end; padding:1.6rem 0; border-top:1px solid var(--line)}
.roi-row .dt-field label{font-size:1.4rem}
.roi-row .dt-input,.roi-row .dt-select{max-width:none}
.roi-del{font:inherit; font-size:1.4rem; min-height:4.8rem; padding:0 1.4rem; border:1px solid var(--line); border-radius:var(--radius); background:#fff; color:var(--sub); cursor:pointer}
.roi-del:hover{border-color:var(--ink); color:var(--ink)}
.roi-h{font-size:1.8rem; font-weight:800; margin:0 0 1.6rem}
#roi-add{justify-self:start}
@media (max-width:760px){
  .roi-row{grid-template-columns:1fr 1fr}
  .roi-row .dt-field:first-child{grid-column:1 / -1}
  .roi-del{grid-column:1 / -1}
}
.cal-date.is-month b{font-size:1.9rem}
.rt.wide-name .col-name{width:46%}
.rt.wide-name .col-short{min-width:13em}
@media (max-width:720px){
  .dt-nav{flex-wrap:nowrap; overflow-x:auto; margin-inline:-1.6rem; padding-inline:1.6rem; scrollbar-width:none}
  .dt-nav::-webkit-scrollbar{display:none}
  .dt-nav a{flex:none}
}

/* 診断 */
.sd-form{gap:3.2rem}
.sd-q{border:0; margin:0; padding:0}
.sd-q legend{display:flex; align-items:baseline; flex-wrap:wrap; gap:.8rem; font-size:1.8rem; font-weight:800; line-height:1.5; padding:0; margin:0 0 1.2rem}
.sd-q legend small{font-size:1.4rem; font-weight:500; color:var(--sub)}
.sd-no{font-family:"Outfit",sans-serif; font-size:1.6rem; color:var(--brand-d)}
.sd-opts{display:grid; grid-template-columns:repeat(auto-fill,minmax(20rem,1fr)); gap:.8rem}
.sd-opts.col1{grid-template-columns:1fr}
.sd-opt{display:flex; align-items:center; gap:1rem; min-height:4.8rem; padding:.8rem 1.4rem; border:1px solid #c9cbcf; border-radius:var(--radius); background:#fff; font-size:1.6rem; line-height:1.5; cursor:pointer}
.sd-opt input{width:1.8rem; height:1.8rem; accent-color:var(--ink); flex:none; margin:0}
.sd-opt:has(input:checked){border-color:var(--ink); background:var(--bg2); font-weight:700}
.sd-opt:has(input:disabled){opacity:.45; cursor:not-allowed}
.sd-opt:has(input:focus-visible){outline:2px solid var(--brand); outline-offset:2px}
.sd-submit{justify-self:start; min-width:24rem}
.sd-result{margin:0 0 4.8rem; outline:none}
.sd-rh{font-size:clamp(2.2rem,1.9rem + .8vw,2.8rem); font-weight:800; margin:0 0 1.6rem; padding:0 0 1rem; border-bottom:2px solid var(--ink)}
.sd-list{list-style:none; margin:0 0 3.2rem; padding:0; display:grid; gap:1.6rem}
.sd-card{display:grid; grid-template-columns:5.6rem 1fr; gap:1.8rem; border:1px solid var(--line); border-top:2px solid var(--ink); padding:2.2rem; background:#fff}
.sd-rank{font-family:"Outfit",sans-serif; font-size:4rem; font-weight:800; line-height:1; color:var(--brand)}
.sd-body h3{font-size:2rem; font-weight:800; margin:0 0 .8rem}
.sd-body p{font-size:1.6rem; line-height:1.85; margin:0 0 1rem}
.sd-why{margin:0 0 1.2rem; padding-left:1.2em; font-size:1.5rem; color:#44474d}
.sd-step{background:var(--bg2); padding:1.2rem 1.6rem}
.sd-step b{display:block; font-size:1.4rem; color:var(--brand-d); margin-bottom:.2rem}
.sd-links{display:flex; flex-wrap:wrap; gap:.6rem 2rem; font-size:1.5rem; font-weight:700}
.sd-links a{text-decoration:underline; text-underline-offset:.2em}
.sd-result .dt-box h3{font-size:1.7rem; margin:0 0 .6rem}
.sd-result .dt-box p{margin:0}
.sd-result .dt-box a{text-decoration:underline; text-underline-offset:.2em}
@media (max-width:560px){ .sd-card{grid-template-columns:1fr; gap:.8rem; padding:1.8rem} .sd-rank{font-size:3.2rem} .sd-submit{width:100%} }
.wa-price{display:flex; flex-wrap:wrap; align-items:center; gap:.8rem 1.2rem; font-size:1.7rem !important; font-weight:700}
.tl-desc{margin:0 0 .8rem; font-size:1.5rem; line-height:1.75}

/* プロンプト集・雛形 */
.pr-box{border:2px solid var(--ink); background:#fff; margin:0 0 4rem}
.pr-head{display:flex; align-items:center; justify-content:space-between; gap:1.2rem; padding:1.2rem 1.6rem; border-bottom:1px solid var(--line); background:var(--bg2)}
.pr-head h2{margin:0; font-size:1.7rem; font-weight:800}
.pr-head .dt-btn{min-height:4.4rem}
.pr-text{margin:0; padding:2rem 2.2rem; white-space:pre-wrap; word-break:break-word; font-family:inherit; font-size:1.6rem; line-height:1.9; max-height:60rem; overflow:auto}
.pr-fill,.pr-steps{font-size:1.6rem; line-height:1.85; padding-left:1.4em; margin:0}
.pr-fill li + li,.pr-steps li + li{margin-top:.6rem}
.tp-btns{display:flex; flex-wrap:wrap; gap:.8rem}
.tp-body{padding:2rem 2.4rem; font-size:1.6rem; line-height:1.9}
.tp-body h3{font-size:1.9rem; font-weight:800; margin:2.8rem 0 1rem; padding-bottom:.6rem; border-bottom:1px solid var(--line)}
.tp-body h3:first-child{margin-top:0}
.tp-body h4{font-size:1.7rem; font-weight:700; margin:2rem 0 .8rem}
.tp-body p{margin:0 0 1.2rem}
.tp-body ul,.tp-body ol{margin:0 0 1.4rem; padding-left:1.4em}
.tp-body li + li{margin-top:.4rem}
.tp-body .tp-check{list-style:none; padding-left:0}
.tp-body .tp-check li{display:flex; gap:1rem; align-items:flex-start}
.tp-body .tp-check .box{flex:none; width:1.8rem; height:1.8rem; border:2px solid var(--ink); margin-top:.5rem}
.tp-fill{background:#fff48e; color:inherit; padding:0 .1em}
.tp-table{overflow-x:auto; margin:0 0 1.6rem}
.tp-table table{border-collapse:collapse; width:100%; font-size:1.5rem; min-width:48rem}
.tp-table th,.tp-table td{border:1px solid var(--line); padding:1rem 1.2rem; text-align:left; vertical-align:top}
.tp-table th{background:var(--bg2); white-space:nowrap}
@media (max-width:640px){ .pr-head{flex-direction:column; align-items:stretch} .tp-btns .dt-btn{flex:1} .tp-body{padding:1.6rem} }
.gy-tasks{list-style:none; padding:0; margin:0; counter-reset:gy}
.gy-tasks li{counter-increment:gy; position:relative; padding:1.8rem 0 1.8rem 5.2rem; border-bottom:1px solid var(--line)}
.gy-tasks li::before{content:counter(gy); position:absolute; left:0; top:1.6rem; font-family:"Outfit",sans-serif; font-size:3rem; font-weight:800; line-height:1; color:var(--brand)}
.gy-tasks h3{margin:0 0 .4rem !important; font-size:1.8rem}
.gy-tasks p{margin:0 0 .6rem; font-size:1.6rem; line-height:1.8}
.tp-btns .dt-btn{white-space:nowrap; padding:0 1.4rem}
.dt-sec > p a,.dt-lede a,.dt-note a,.dt-box a{text-decoration:underline; text-underline-offset:.2em}

/* 週刊まとめ */
.wk-list{list-style:none; margin:0; padding:0}
.wk-list a{display:flex; flex-direction:column; gap:.4rem; padding:1.8rem 0; border-bottom:1px solid var(--line); color:var(--ink)}
.wk-list a:hover{opacity:1} .wk-list a:hover b{text-decoration:underline; text-underline-offset:.2em}
.wk-list b{display:flex; flex-wrap:wrap; align-items:center; gap:1rem; font-size:1.9rem}
.wk-list span{font-size:1.5rem; color:#44474d}
.wk-list .wk-top{font-size:1.4rem; color:var(--sub)}
.wk-news{list-style:none; margin:0; padding:0}
.wk-news li{padding:1.8rem 0; border-bottom:1px solid var(--line)}
.wk-news b{font-size:1.8rem; line-height:1.55}
.wk-news a:hover b{text-decoration:underline}
.wk-news p{margin:.6rem 0 .4rem; font-size:1.5rem; line-height:1.8; color:#44474d}
.wk-news time{font-size:1.4rem; color:var(--sub)}
.wk-pager{display:flex; justify-content:space-between; gap:1.6rem; padding:2.4rem 0; border-top:1px solid var(--ink); font-size:1.5rem; font-weight:700}
.wk-pager a{text-decoration:underline; text-underline-offset:.2em}

/* 導入事例 */
.cs-n{font-size:1.3rem; opacity:.7}
.cs-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(32rem,1fr)); gap:1.6rem}
.cs-card{display:flex; flex-direction:column; border:1px solid var(--line); border-top:2px solid var(--ink); padding:2rem 2.2rem; background:#fff}
.cs-meta{display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; font-size:1.4rem; color:var(--sub); margin:0 0 1rem}
.cs-card h3{font-size:1.9rem; font-weight:800; line-height:1.45; margin:0 0 1.2rem}
.cs-card h3 span{display:block; font-size:1.5rem; font-weight:600; color:#44474d; margin-top:.2rem}
.cs-dl{display:grid; grid-template-columns:auto 1fr; gap:.6rem 1.2rem; margin:0 0 1.2rem; font-size:1.5rem; line-height:1.75}
.cs-dl dt{font-weight:700; color:var(--sub); white-space:nowrap; font-size:1.4rem; padding-top:.1rem}
.cs-dl dd{margin:0}
.cs-effect{font-weight:700}
.cs-src{margin:auto 0 0; padding-top:.4rem; font-size:1.4rem; color:var(--sub)}
.cs-src + .cs-src{margin-top:0}
.cs-src a{text-decoration:underline; text-underline-offset:.2em}
@media (max-width:420px){ .cs-grid{grid-template-columns:1fr} .cs-card{padding:1.6rem} }
.sc-price{display:block; min-width:12em; white-space:normal; font-size:1.5rem; font-weight:700; line-height:1.6}