/* ないおと S3 試作の器と本文の上書き。v3.src.css から build.py が作る。選択子の頭は全部 body.nai-v3。
   値は 00-tokens.css の変数。 */
body.nai-v3 { --v3-gut: var(--gut-sp); --nai-font-jp: var(--ff-body); --nai-font-latin: var(--ff-body); --nai-font-mono: var(--ff-ui); --nai-v2-serif: var(--ff-body); --nai-v2-display: var(--ff-body); --nai-v2-mono: var(--ff-ui); --nai-serif: var(--ff-body); --nai-disp: var(--ff-body); --nai-mono: var(--ff-ui); --nai-meta-2: var(--c-meta); --nai-ink-3: var(--c-ink-2); --nai-ink-pale: var(--c-ink-2); --nai-v2-ink-2: var(--c-ink-2); margin: 0; background: var(--c-page); color: var(--c-ink); font: var(--fs-m)/var(--lh-ui) var(--ff-body); letter-spacing: var(--ls-body); }
@media (min-width: 768px) {
body.nai-v3 { --v3-gut: var(--sp-3); }
}
body.nai-v3 *,
body.nai-v3 *::before,
body.nai-v3 *::after { box-sizing: border-box; }
body.nai-v3 :where(h1, h2, h3, p, ol, ul):not([data-nai-body] *) { margin: 0; padding: 0; }
body.nai-v3 :where(ol, ul):not([data-nai-body] *) { list-style: none; }
body.nai-v3 :where(a):not([data-nai-body] *) { color: inherit; text-decoration: none; }
body.nai-v3 .v3-chip,
body.nai-v3 .v3-kick,
body.nai-v3 .v3-nav a,
body.nai-v3 .v3-lh__s a,
body.nai-v3 .v3-tags a,
body.nai-v3 .v3-404__nav a,
body.nai-v3 .v3-pager a,
body.nai-v3 .v3-pager span,
body.nai-v3 .v3-search input,
body.nai-v3 .v3-search button,
body.nai-v3 .v3-toc summary,
body.nai-v3 .v3-pnx__k,
body.nai-v3 [data-nai-body] :is(input[type="text"], input[type="email"], input[type="url"], select, textarea),
body.nai-v3 [data-nai-body] input[type="submit"] { border-radius: var(--r-1); }
body.nai-v3 .v3-cover svg,
body.nai-v3 .v3-chev { display: block; }
body.nai-v3 .v3-chip { display: inline-flex; align-items: center; padding: 2px var(--sp-1); border: 1px solid var(--gc, var(--c-meta)); color: var(--gc, var(--c-meta)); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); white-space: nowrap; }
body.nai-v3 .v3-chip.is-jazz { --gc: var(--c-jazz); }
body.nai-v3 .v3-chip.is-ambient { --gc: var(--c-ambient); }
body.nai-v3 .v3-chip.is-audio { --gc: var(--c-audio); }
body.nai-v3 .v3-chip.is-alt { --gc: var(--c-alt); }
body.nai-v3 .v3-chip.is-shoegaze { --gc: var(--c-shoegaze); }
body.nai-v3 .v3-chip.is-postrock { --gc: var(--c-postrock); }
body.nai-v3 .v3-chip.is-classical { --gc: var(--c-classical); }
body.nai-v3 .v3-kick { display: inline-flex; align-items: center; padding: 2px var(--sp-1); border: 1px solid var(--c-ink); background: var(--c-ink); color: var(--c-on-dark); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); white-space: nowrap; }
body.nai-v3 .v3-date { font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); white-space: nowrap; }
body.nai-v3 .v3-cover { display: block; aspect-ratio: var(--cover-ar); overflow: hidden; border: 1px solid var(--c-rule-mid); background: var(--c-paper); }
body.nai-v3 .v3-cover svg { width: 100%; height: 100%; }
body.nai-v3 .v3-n { font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); color: var(--c-meta); }
body.nai-v3 .v3-num { font-family: var(--ff-ui); }
body.nai-v3 .v3-hd { border-bottom: 1px solid var(--c-rule); background: var(--c-page); }
body.nai-v3 .v3-hd__in { max-width: var(--w-content); margin: 0 auto; padding: var(--sp-2) var(--v3-gut); }
body.nai-v3 .v3-hd__name { font-size: var(--fs-xl); line-height: var(--lh-head); letter-spacing: var(--ls-head); text-align: center; }
body.nai-v3 .v3-hd__name a { display: inline-flex; align-items: center; min-height: var(--tap); }
body.nai-v3 .v3-hd__romaji { font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); text-align: center; margin-top: var(--sp-0); }
body.nai-v3 .v3-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-1); margin-top: var(--sp-2); }
body.nai-v3 .v3-nav a { display: inline-flex; align-items: center; gap: var(--sp-0); min-height: var(--tap); padding: 0 var(--sp-1); border: 1px solid var(--c-rule-mid); font: var(--fs-s)/var(--lh-ui) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink); }
body.nai-v3 .v3-nav a[aria-current="page"] { color: var(--c-accent); border-color: var(--c-accent); }
body.nai-v3 .v3-chev { flex: none; }
@media (min-width: 768px) {
body.nai-v3 .v3-hd__name a { min-height: 0; }
body.nai-v3 .v3-hd__in { padding-top: var(--sp-3); padding-bottom: 0; }
body.nai-v3 .v3-hd__name { font-size: var(--fs-2xl); }
body.nai-v3 .v3-nav { gap: var(--sp-3); margin-top: var(--sp-1); }
body.nai-v3 .v3-nav a { min-height: 48px; padding: 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; margin-bottom: -1px; font-size: var(--fs-m); }
body.nai-v3 .v3-nav a[aria-current="page"] { border-bottom-color: var(--c-accent); }
}
body.nai-v3 .v3-cols { display: grid; grid-template-columns: minmax(0, 1fr); max-width: var(--w-content); margin: 0 auto; padding: var(--sp-3) var(--v3-gut) var(--sp-4); }
body.nai-v3 .v3-main { min-width: 0; }
body.nai-v3 .v3-side { padding-top: var(--sp-4); }
body.nai-v3 .v3-sec + .v3-sec { margin-top: var(--sp-4); }
body.nai-v3 .v3-cols--one { max-width: var(--measure); }
@media (min-width: 768px) {
body.nai-v3 .v3-cols { padding-top: var(--sp-4); padding-bottom: var(--sp-5); }
}
@media (min-width: 1024px) {
body.nai-v3 .v3-cols { grid-template-columns: minmax(0, 1fr) var(--w-side); column-gap: var(--sp-5); }
body.nai-v3 .v3-cols--post { grid-template-columns: minmax(0, 760px) var(--w-side); justify-content: center; }
body.nai-v3 .v3-cols--one { grid-template-columns: minmax(0, 1fr); }
body.nai-v3 .v3-side { padding-top: 0; }
}
body.nai-v3 .v3-sec-h { font-size: var(--fs-xl); line-height: var(--lh-head); letter-spacing: var(--ls-head); border-top: 2px solid var(--c-rule); padding-top: var(--sp-1); margin-bottom: var(--sp-2); }
body.nai-v3 .v3-side-h { font-size: var(--fs-l); line-height: var(--lh-head); letter-spacing: var(--ls-head); border-top: 2px solid var(--c-rule); padding-top: var(--sp-1); margin-bottom: var(--sp-1); }
body.nai-v3 .v3-lh { margin-bottom: var(--sp-2); }
body.nai-v3 .v3-lh__k { margin-bottom: var(--sp-1); }
body.nai-v3 .v3-lh__t { font-size: var(--fs-xl); line-height: var(--lh-head); letter-spacing: var(--ls-head); border-top: 2px solid var(--c-rule); padding-top: var(--sp-1); text-wrap: balance; }
body.nai-v3 .v3-lh__n { font: var(--fs-s)/var(--lh-ui) var(--ff-ui); color: var(--c-meta); margin-top: var(--sp-0); }
body.nai-v3 .v3-lh__d { font: var(--fs-s)/var(--lh-body) var(--ff-body); color: var(--c-ink-2); margin-top: var(--sp-1); max-width: var(--measure); }
body.nai-v3 .v3-lh__b a,
body.nai-v3 .v3-hint a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--c-accent); text-decoration: underline; text-underline-offset: 3px; }
body.nai-v3 .v3-lh__s { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-1); }
body.nai-v3 .v3-lh__s a,
body.nai-v3 .v3-tags a,
body.nai-v3 .v3-404__nav a { display: inline-flex; align-items: center; gap: var(--sp-0); min-height: var(--tap); padding: 0 var(--sp-1); border: 1px solid var(--c-rule-mid); background: var(--c-paper); font: var(--fs-s)/var(--lh-ui) var(--ff-ui); color: var(--c-ink); }
body.nai-v3 .v3-ph { margin-bottom: var(--sp-2); }
body.nai-v3 .v3-empty { font: var(--fs-m)/var(--lh-body) var(--ff-body); color: var(--c-ink-2); padding: var(--sp-3) 0 var(--sp-1); }
body.nai-v3 .v3-hint { font: var(--fs-m)/var(--lh-body) var(--ff-body); color: var(--c-ink-2); }
@media (min-width: 768px) {
body.nai-v3 .v3-lh__t { font-size: var(--fs-2xl); }
body.nai-v3 .v3-tags a,
body.nai-v3 .v3-lh__s a { min-height: var(--tap-min); }
}
body.nai-v3 .v3-crumb { display: flex; flex-wrap: wrap; align-items: center; font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); margin-bottom: var(--sp-2); }
body.nai-v3 .v3-crumb a { display: inline-flex; align-items: center; min-width: var(--tap); justify-content: center; min-height: var(--tap); color: var(--c-meta); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--c-rule-mid); }
body.nai-v3 .v3-crumb > span { margin: 0 var(--sp-1); }
@media (min-width: 768px) {
body.nai-v3 .v3-crumb a { min-width: 0; min-height: var(--tap-min); }
body.nai-v3 .v3-crumb { margin-bottom: var(--sp-3); }
}
body.nai-v3 .v3-list > li { padding: var(--sp-1) 0; border-bottom: 1px solid var(--c-rule-mid); }
body.nai-v3 .v3-list > li:first-child { padding-top: 0; }
body.nai-v3 .v3-entry { display: grid; grid-template-columns: 120px minmax(0, 1fr); column-gap: var(--sp-1); align-items: start; }
body.nai-v3 .v3-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-1); }
body.nai-v3 .v3-entry .v3-meta { flex-direction: column; align-items: flex-start; gap: var(--sp-0); }
body.nai-v3 .v3-entry__t,
body.nai-v3 .v3-drow__t,
body.nai-v3 .v3-pnx__t,
body.nai-v3 .v3-ah__h1,
body.nai-v3 .v3-lh__t,
body.nai-v3 .v3-sec-h,
body.nai-v3 .v3-side-h { word-break: auto-phrase; }
body.nai-v3 .v3-entry__t,
body.nai-v3 .v3-drow__t,
body.nai-v3 .v3-pnx__t { font: 600 var(--fs-l)/var(--lh-head) var(--ff-body); letter-spacing: var(--ls-body); text-wrap: balance; }
body.nai-v3 .v3-entry__t { font-size: var(--fs-m); margin-top: var(--sp-0); }
body.nai-v3 .v3-entry__t a,
body.nai-v3 .v3-drow__t a { display: block; min-height: var(--tap); }
body.nai-v3 .v3-entry__ex { display: none; }
body.nai-v3 .v3-entry--s .v3-entry__ex { display: none; }
@media (min-width: 768px) {
body.nai-v3 .v3-list > li { padding: var(--sp-2) 0; }
body.nai-v3 .v3-entry { grid-template-columns: 280px minmax(0, 1fr); column-gap: var(--sp-2); }
body.nai-v3 .v3-entry .v3-meta { flex-direction: row; align-items: center; gap: var(--sp-1); }
body.nai-v3 .v3-entry__t { font-size: var(--fs-xl); margin-top: var(--sp-1); }
body.nai-v3 .v3-entry__t a,
body.nai-v3 .v3-drow__t a { min-height: var(--tap-min); }
body.nai-v3 .v3-entry__ex { display: -webkit-box; font: var(--fs-s)/var(--lh-body) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink-2); margin-top: var(--sp-1); -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-wrap: pretty; }
body.nai-v3 .v3-entry--s { grid-template-columns: 160px minmax(0, 1fr); }
body.nai-v3 .v3-entry--s .v3-entry__t { font-size: var(--fs-l); }
}
body.nai-v3 .v3-pager { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-3); }
body.nai-v3 .v3-pager a,
body.nai-v3 .v3-pager span { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); min-height: var(--tap); padding: 0 var(--sp-1); border: 1px solid var(--c-rule-mid); font: var(--fs-m)/var(--lh-ui) var(--ff-ui); color: var(--c-ink); }
body.nai-v3 .v3-pager .v3-pager__dots { border-color: transparent; color: var(--c-meta); }
body.nai-v3 .v3-pager .v3-pager__cur { background: var(--c-ink); border-color: var(--c-ink); color: var(--c-on-dark); }
body.nai-v3 .v3-pager .v3-pager__wide { padding: 0 var(--sp-2); }
body.nai-v3 .v3-search { display: flex; gap: var(--sp-0); }
body.nai-v3 .v3-search input { flex: 1; min-width: 0; height: var(--tap); padding: 0 var(--sp-1); border: 1px solid var(--c-meta); background: var(--c-paper); color: var(--c-ink); font: var(--fs-m)/var(--lh-ui) var(--ff-ui); }
body.nai-v3 .v3-search input::placeholder { color: var(--c-meta); }
body.nai-v3 .v3-search button { height: var(--tap); padding: 0 var(--sp-2); border: 0; background: var(--c-ink); color: var(--c-on-dark); font: 600 var(--fs-s)/1 var(--ff-ui); cursor: pointer; }
body.nai-v3 .v3-about { font: var(--fs-s)/var(--lh-body) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink-2); }
body.nai-v3 .v3-about a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--c-accent); border-bottom: 1px solid var(--c-accent); font-family: var(--ff-ui); font-size: var(--fs-s); }
body.nai-v3 .v3-drow { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: var(--sp-1); align-items: start; }
body.nai-v3 .v3-drow__t { font-size: var(--fs-s); }
body.nai-v3 .v3-drow__txt .v3-date { display: block; margin-top: var(--sp-0); }
body.nai-v3 .v3-slist > li { padding: var(--sp-1) 0; border-bottom: 1px solid var(--c-rule-mid); }
body.nai-v3 .v3-slist > li:first-child { padding-top: 0; }
body.nai-v3 .v3-cats > li { border-bottom: 1px solid var(--c-rule-mid); }
body.nai-v3 .v3-cats a { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-1); min-height: var(--tap); padding: var(--sp-0) 0; font: var(--fs-s)/var(--lh-ui) var(--ff-body); color: var(--c-ink); }
body.nai-v3 .v3-cats__sub { padding-left: var(--sp-2); padding-bottom: var(--sp-0); }
body.nai-v3 .v3-cats__sub a { font-size: var(--fs-xs); color: var(--c-ink-2); }
body.nai-v3 .v3-tags { display: flex; flex-wrap: wrap; gap: var(--sp-0); }
body.nai-v3 .v3-plain li { border-bottom: 1px solid var(--c-rule-mid); }
body.nai-v3 .v3-plain a { display: flex; align-items: center; min-height: var(--tap); padding: var(--sp-0) 0; font: var(--fs-s)/var(--lh-ui) var(--ff-body); }
@media (min-width: 768px) {
body.nai-v3 .v3-drow--n { grid-template-columns: 80px minmax(0, 1fr); }
body.nai-v3 .v3-cats a { min-height: var(--tap-min); }
body.nai-v3 .v3-about a { min-height: var(--tap-min); }
body.nai-v3 .v3-plain a { min-height: var(--tap-min); }
}
body.nai-v3 .v3-ft { background: var(--c-page); border-top: 1px solid var(--c-rule); }
body.nai-v3 .v3-ft__in { max-width: var(--w-content); margin: 0 auto; padding: var(--sp-2) var(--v3-gut) var(--sp-3); }
body.nai-v3 .v3-ft__disc { font: var(--fs-m)/var(--lh-body) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink-2); }
body.nai-v3 .v3-ft__links { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--sp-2); margin-top: var(--sp-1); }
body.nai-v3 .v3-ft__links a { display: flex; align-items: center; min-height: var(--tap); border-bottom: 1px solid var(--c-rule-thin); font: var(--fs-s)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-ink); }
body.nai-v3 .v3-ft__id { margin-top: var(--sp-2); }
body.nai-v3 .v3-ft__name { font: 600 var(--fs-l)/var(--lh-head) var(--ff-body); letter-spacing: var(--ls-head); }
body.nai-v3 .v3-ft__romaji,
body.nai-v3 .v3-ft__copy { display: inline-block; margin-right: var(--sp-1); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); }
@media (min-width: 768px) {
body.nai-v3 .v3-ft__in { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "id disc" "id links"; column-gap: var(--sp-4); row-gap: var(--sp-0); align-items: center; padding-top: var(--sp-3); padding-bottom: var(--sp-3); }
body.nai-v3 .v3-ft__id { grid-area: id; margin-top: 0; }
body.nai-v3 .v3-ft__disc { grid-area: disc; justify-self: end; }
body.nai-v3 .v3-ft__links { grid-area: links; display: flex; flex-wrap: wrap; justify-content: flex-end; column-gap: var(--sp-2); margin-top: 0; }
body.nai-v3 .v3-ft__links a { min-height: var(--tap-min); border-bottom: 0; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--c-rule-mid); }
body.nai-v3 .v3-ft__romaji,
body.nai-v3 .v3-ft__copy { display: block; margin: var(--sp-0) 0 0; }
}
body.nai-v3 .v3-ah { padding-top: 0; }
body.nai-v3 .v3-ah__chip { min-height: var(--tap); padding: 0 var(--sp-2); }
body.nai-v3 .v3-ah__h1 { font-size: var(--fs-xl); line-height: var(--lh-head); letter-spacing: var(--ls-head); margin-top: var(--sp-1); text-wrap: balance; }
body.nai-v3 .v3-dates { display: flex; flex-wrap: wrap; column-gap: var(--sp-2); margin-top: var(--sp-1); color: var(--c-meta); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); }
body.nai-v3 .v3-cover--post { margin-top: var(--sp-2); }
body.nai-v3 .v3-ans { margin-top: var(--sp-2); padding: var(--sp-2); background: var(--c-paper-2); border-top: 2px solid var(--c-accent); }
body.nai-v3 .v3-ans__t { font: var(--fs-m)/var(--lh-body) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink); }
body.nai-v3 .v3-ans__t + .v3-ans__t { margin-top: var(--sp-1); }
body.nai-v3 .v3-pc { display: none; }
body.nai-v3 .v3-toc { margin: var(--sp-2) 0; }
body.nai-v3 .v3-toc summary { display: flex; align-items: center; justify-content: space-between; min-height: var(--tap); padding: 0 var(--sp-2); border: 1px solid var(--c-rule-mid); font: 600 var(--fs-m)/var(--lh-ui) var(--ff-body); list-style: none; cursor: pointer; }
body.nai-v3 .v3-toc summary::-webkit-details-marker { display: none; }
body.nai-v3 .v3-toc a { display: flex; align-items: center; min-height: var(--tap); padding: var(--sp-0) var(--sp-1); font: var(--fs-s)/var(--lh-ui) var(--ff-ui); color: var(--c-ink); border-bottom: 1px solid var(--c-rule-thin); }
@media (min-width: 768px) {
body.nai-v3 .v3-ah__chip { min-height: 0; padding: 2px var(--sp-1); }
body.nai-v3 .v3-ah__h1 { font-size: var(--fs-3xl); margin-top: var(--sp-2); }
body.nai-v3 .v3-dates { column-gap: var(--sp-3); margin-top: var(--sp-2); }
body.nai-v3 .v3-cover--post { margin-top: var(--sp-3); }
body.nai-v3 .v3-ans { margin-top: var(--sp-3); padding: var(--sp-2) var(--sp-3); }
body.nai-v3 .v3-ans__t { font-size: var(--fs-l); }
body.nai-v3 .v3-pc { display: block; }
body.nai-v3 .v3-sp { display: none; }
body.nai-v3 .v3-tocbox { margin-top: var(--sp-3); border: 1px solid var(--c-rule-mid); padding: var(--sp-2) var(--sp-3); }
body.nai-v3 .v3-tocbox__h { font: 600 var(--fs-m)/var(--lh-head) var(--ff-body); letter-spacing: var(--ls-head); }
body.nai-v3 .v3-tocbox ol { margin-top: var(--sp-1); }
body.nai-v3 .v3-tocbox li + li { margin-top: var(--sp-0); }
body.nai-v3 .v3-tocbox a { display: block; padding: var(--sp-0) 0; font: var(--fs-s)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-ink); }
}
body.nai-v3 .v3-rel { margin-top: var(--sp-4); }
body.nai-v3 .v3-pnx { margin-top: var(--sp-4); padding-top: var(--sp-2); border-top: 2px solid var(--c-rule); }
body.nai-v3 .v3-pnx__a { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: var(--sp-1); align-items: center; min-height: var(--tap); padding: var(--sp-1) 0; }
body.nai-v3 .v3-pnx__a + .v3-pnx__a { border-top: 1px solid var(--c-rule-mid); }
body.nai-v3 .v3-pnx__txt { display: block; }
body.nai-v3 .v3-pnx__k { display: inline-flex; align-items: center; padding: 2px var(--sp-1); border: 1px solid var(--c-rule-mid); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-ink-2); }
body.nai-v3 .v3-pnx__t { display: block; margin-top: var(--sp-0); font-size: var(--fs-s); }
@media (min-width: 768px) {
body.nai-v3 .v3-rel { margin-top: var(--sp-5); }
body.nai-v3 .v3-pnx { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--sp-3); margin-top: var(--sp-5); }
body.nai-v3 .v3-pnx__a { grid-template-columns: 112px minmax(0, 1fr); align-items: start; }
body.nai-v3 .v3-pnx__a + .v3-pnx__a { border-top: 0; }
body.nai-v3 .v3-pnx__t { font-size: var(--fs-m); margin-top: var(--sp-1); }
}
body.nai-v3 .v3-404 { padding: var(--sp-3) 0 var(--sp-4); }
body.nai-v3 .v3-404__p { font: var(--fs-m)/var(--lh-body) var(--ff-body); color: var(--c-ink-2); margin: var(--sp-2) 0; }
body.nai-v3 .v3-404__nav { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin: var(--sp-2) 0 var(--sp-4); }
body.nai-v3 [data-nai-body] { display: block; font: var(--fs-m)/var(--lh-body) var(--ff-body); letter-spacing: var(--ls-body); color: var(--c-ink); min-width: 0; padding: var(--sp-1) 0 0; overflow-wrap: anywhere; }
@media (min-width: 768px) {
body.nai-v3 [data-nai-body] { font-size: var(--fs-body-pc); max-width: var(--measure); padding-top: var(--sp-2); }
}
body.nai-v3 [data-nai-body] p { margin: 0 0 var(--sp-2); text-wrap: pretty; }
body.nai-v3 [data-nai-body] p:first-of-type::first-letter { float: none; font: inherit; padding: 0; }
body.nai-v3 [data-nai-body] strong,
body.nai-v3 [data-nai-body] b { font-weight: 700; }
body.nai-v3 [data-nai-body] a:not([class]) { color: var(--c-accent); text-decoration: underline; text-underline-offset: 3px; border-bottom: 0; }
body.nai-v3 [data-nai-body] p + p { margin-top: 0; }
body.nai-v3 [data-nai-body] h2 { font: 600 var(--fs-xl)/var(--lh-head) var(--ff-body); letter-spacing: var(--ls-head); border: 0; border-top: 2px solid var(--c-rule); background: none; padding: var(--sp-2) 0 0; margin: var(--sp-5) 0 var(--sp-2); }
body.nai-v3 [data-nai-body] h2::before,
body.nai-v3 [data-nai-body] h2::after { content: none; }
body.nai-v3 [data-nai-body] > h2:first-child { margin-top: var(--sp-4); }
body.nai-v3 [data-nai-body] h3 { font: 600 var(--fs-l)/var(--lh-head) var(--ff-body); letter-spacing: var(--ls-head); border: 0; background: none; padding: 0; margin: var(--sp-4) 0 var(--sp-1); }
body.nai-v3 [data-nai-body] h3::before,
body.nai-v3 [data-nai-body] h3::after { content: none; }
body.nai-v3 [data-nai-body] h4 { font: 600 var(--fs-m)/var(--lh-head) var(--ff-body); margin: var(--sp-3) 0 var(--sp-1); }
body.nai-v3 [data-nai-body] ul,
body.nai-v3 [data-nai-body] ol { margin: 0 0 var(--sp-2); padding-left: 1.4em; line-height: var(--lh-body); }
body.nai-v3 [data-nai-body] ul { list-style: disc; }
body.nai-v3 [data-nai-body] ol { list-style: decimal; }
body.nai-v3 [data-nai-body] li { margin-bottom: var(--sp-0); }
body.nai-v3 [data-nai-body] img { max-width: 100%; height: auto; }
body.nai-v3 [data-nai-body] iframe { max-width: 100%; }
body.nai-v3 [data-nai-body] figure { margin: var(--sp-4) 0; }
body.nai-v3 [data-nai-body] figcaption { font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); margin-top: var(--sp-1); text-align: left; }
body.nai-v3 [data-nai-body] figcaption a { color: var(--c-meta); }
body.nai-v3 [data-nai-body] blockquote { margin: 0 0 var(--sp-2); }
/* 素の引用(class の無い blockquote・掲示板まとめ 1261・1263・1265・1267 と EN の写し)に罫と字下げを付け、地の文と分ける。
   旧版も無装飾だった。設計された引用(blockquote.nai-t-quote__text)は 50-type-layers.css:163 のまま(2026-10-25) */
body.nai-v3 [data-nai-body] blockquote:not([class]) { padding-left: var(--sp-2); border-left: 1px solid var(--c-rule-mid); color: var(--c-ink-2); }
body.nai-v3 [data-nai-body] blockquote:not([class]) > :last-child { margin-bottom: 0; }
body.nai-v3 [data-nai-body] hr { border: 0; border-top: 1px solid var(--c-rule-mid); margin: var(--sp-3) 0; }
body.nai-v3 [data-nai-body] small { font-size: var(--fs-xs); }
body.nai-v3 [data-nai-body] :is(figcaption, figcaption a, .nai-cta__label, .nai-cta__artist, .toc_toggle_button, .toc_toggle_button span, .post-page-numbers, .ref-line, .ref-line a, .source-credit, .source-credit a, .nai-t-band span, .nai-t-kicker, .nai-t-personnel__inst, .nai-t-personnel__rec, .nai-t-disco__tag, .nai-t-disco__year, .nai-t-disco__arrow, .nai-t-sources__no, .nai-t-sources__url, .nai-t-genre, .nai-t-album__meta, .nai-t-rig__h, .nai-t-rig__cond, .nai-t-rig__price, .nai-t-rig__note, .nai-t-unfit__tag, .nai-t-scale__k, .nai-t-scale__u, .nai-t-order__k, .nai-t-notentry__y, .nai-cta__btn, .nai-t-sources__item > span, .nai-t-rig__li > span, .nai-t-people__r, .nai-t-people__n, .nai-t-limit__tag, .nai-t-badge, .nai-t-quote__src, .nai-t-quote__editor b, .nai-t-ask__cta, .nai-t-spec__cite, .nai-t-spec__na, .nai-t-links__title, .nai-t-links__count, .nai-t-links__desc, .nai-t-next__no, .nai-t-sources__line, .res-date, .res-id, .res-op, .res-anchor, .admin-comment-title, .section-title, .nai-sec-head small) { font-family: var(--ff-ui) !important; font-size: var(--fs-xs) !important; line-height: var(--lh-ui); letter-spacing: var(--ls-body) !important; text-transform: none; }
body.nai-v3 [data-nai-body] :is(figcaption, .ref-line, .source-credit, .nai-t-disco__arrow, .nai-t-tracks__no, .nai-t-sources__no, .nai-t-scale__k, .nai-t-disco__tag, .nai-t-disco__year) { color: var(--c-meta) !important; }
body.nai-v3 [data-nai-body] :is(.nai-t-album__meta, .nai-t-rig__price, .nai-t-rig__cond, .nai-t-rig__note, .nai-t-personnel__inst, .nai-t-personnel__rec) { color: var(--c-ink-2); }
body.nai-v3 [data-nai-body] :is(.nai-t-tracks__no, .nai-t-next__no) { font-family: var(--ff-ui); color: var(--c-meta); }
body.nai-v3 [data-nai-body] [style*="font-size:0.8em"] { font-size: var(--fs-xs) !important; color: var(--c-meta) !important; }
body.nai-v3 [data-nai-body] [style*="color:#999"],
body.nai-v3 [data-nai-body] [style*="color:#888"],
body.nai-v3 [data-nai-body] [style*="color:#777"],
body.nai-v3 [data-nai-body] [style*="color:#666"] { color: var(--c-meta) !important; }
body.nai-v3 [data-nai-body] .listen-links,
body.nai-v3 [data-nai-body] .listen-link { font: var(--fs-m)/var(--lh-body) var(--ff-body); color: var(--c-ink-2); }
body.nai-v3 [data-nai-body] > .nai-capsule,
body.nai-v3 [data-nai-body] .nai-capsule { position: static; width: auto; max-width: none; margin: 0 0 var(--sp-3); padding: var(--sp-2); background: var(--c-paper-2); border: 0; border-top: 2px solid var(--c-accent); }
body.nai-v3 [data-nai-body] .nai-capsule::before { content: none; }
body.nai-v3 [data-nai-body] .nai-capsule p:not(.nai-capsule__k) { font: var(--fs-m)/var(--lh-body) var(--ff-body); margin: 0; }
body.nai-v3 [data-nai-body] > .nai-capsule + h2 { margin-top: var(--sp-4); }
body.nai-v3 [data-nai-body] .nai-pull { border-left: 0; padding-left: 0; font-size: var(--fs-m); line-height: var(--lh-body); }
/* 固定ページの奥付(本文の section.nai-colophon・制定日と改定日)。旧版は 60-pages-v2.css:785・817 が組んでいたが、V3 は 60 を読まないので
   本文と同じ字で最終節に続いていた(2026-10-25) */
body.nai-v3 [data-nai-body] .nai-colophon { margin-top: var(--sp-5); padding: var(--sp-2) 0; border-top: 1px solid var(--c-rule); border-bottom: 1px solid var(--c-rule); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-ink-2); }
body.nai-v3 .easyLink-box { max-width: none !important; display: grid !important; grid-template-columns: 88px minmax(0, 1fr) !important; grid-template-areas: "img name" "btn btn" "note note" !important; gap: var(--sp-1) !important; margin: var(--sp-4) 0 !important; padding: var(--sp-2) var(--sp-1) var(--sp-1) !important; border: 1px solid var(--c-rule-mid) !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
body.nai-v3 .easyLink-box::before { content: none !important; }
body.nai-v3 .easyLink-box::after { grid-area: note; margin: 0 !important; padding: var(--sp-1) 0 0 !important; border-top: 1px solid var(--c-rule-thin); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui) !important; letter-spacing: var(--ls-body) !important; color: var(--c-meta) !important; }
body.nai-v3 .easyLink-box:not(:has(a[href*="moshimo"], a[href*="amazon.co.jp/dp"], a[href*="amazon.co.jp/gp"], a[href*="amzn.to"], a[href*="rakuten"]))::after,
body.nai-v3 .easyLink-box.is-subsc::after { content: none !important; display: none !important; }
body.nai-v3 .easyLink-box.is-subsc { grid-template-columns: 80px minmax(0, 1fr) !important; grid-template-areas: "img name" "btn btn" !important; align-items: center !important; gap: var(--sp-1) !important; padding: var(--sp-2) !important; }
body.nai-v3 .easyLink-img { grid-area: img; margin: 0; }
body.nai-v3 div.easyLink-box div.easyLink-img { position: relative; }
body.nai-v3 div.easyLink-box div.easyLink-img p.easyLink-img-box { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; margin: 0; }
body.nai-v3 div.easyLink-box div.easyLink-img p.easyLink-img-box span > img { max-width: 100% !important; max-height: 100% !important; }
body.nai-v3 .easyLink-img .easyLink-img-pht { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border: 1px solid var(--c-rule-mid); background: var(--c-paper-2); }
body.nai-v3 .easyLink-info { display: contents; }
body.nai-v3 .easyLink-info-maker,
body.nai-v3 .easyLink-info-model { display: none; }
body.nai-v3 .easyLink-info-name { grid-area: name; margin: 0; }
body.nai-v3 .easyLink-info-name,
body.nai-v3 .easyLink-info-name a { word-break: auto-phrase !important; overflow-wrap: anywhere !important; }
body.nai-v3 .easyLink-info-name,
body.nai-v3 .easyLink-info-name a { font: 600 var(--fs-l)/var(--lh-head) var(--ff-body) !important; letter-spacing: var(--ls-head); color: var(--c-ink); text-decoration: none; }
body.nai-v3 .easyLink-box.is-subsc .easyLink-subsc-artist { display: block; margin-top: 3px; font: 400 var(--fs-xs)/var(--lh-ui) var(--ff-ui) !important; color: var(--c-ink-2) !important; letter-spacing: 0.02em !important; }
body.nai-v3 .easyLink-info-btn { grid-area: btn; display: flex; flex-wrap: wrap; gap: var(--sp-1); margin: 0 !important; position: relative; }
body.nai-v3 .easyLink-info-btn > img { position: absolute; width: 1px; height: 1px; opacity: 0; }
body.nai-v3 .easyLink-info-btn a { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; min-height: var(--tap); padding: 0 var(--sp-2) !important; border-radius: var(--r-1) !important; background: var(--c-ink) !important; color: var(--c-on-dark) !important; font: 600 var(--fs-s)/var(--lh-ui) var(--ff-ui) !important; letter-spacing: var(--ls-body) !important; text-decoration: none; }
body.nai-v3 .easyLink-info-btn a.easyLink-info-btn-custom::before { content: none; }
@media (min-width: 768px) {
body.nai-v3 .easyLink-box { grid-template-columns: 120px minmax(0, 1fr) !important; grid-template-areas: "img name" "img btn" "note note" !important; gap: var(--sp-1) var(--sp-2) !important; padding: var(--sp-2) !important; }
body.nai-v3 .easyLink-box.is-subsc { grid-template-columns: 108px minmax(0, 1fr) !important; grid-template-areas: "img name" "img btn" !important; grid-template-rows: auto auto !important; align-content: center !important; align-items: center !important; gap: 12px var(--sp-2) !important; padding: var(--sp-2) !important; }
body.nai-v3 .easyLink-box.is-subsc .easyLink-info-name { align-self: end !important; }
body.nai-v3 .easyLink-info-btn { align-content: flex-start; }
body.nai-v3 .easyLink-info-btn a { flex: 0 0 auto; }
body.nai-v3 .easyLink-box.is-subsc .easyLink-info-btn { align-self: start !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; width: 100% !important; }
body.nai-v3 .easyLink-box.is-subsc .easyLink-info-btn a { width: 100% !important; min-height: 42px !important; padding: 0 12px !important; font-size: var(--fs-xs) !important; white-space: nowrap !important; }
}
body.nai-v3 [data-nai-body] table { display: table !important; width: 100% !important; min-width: 0 !important; max-width: 100%; border-collapse: collapse; table-layout: auto; margin: 0 0 var(--sp-2); background: transparent; font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); }
body.nai-v3 [data-nai-body] :is(th, td) { padding: var(--sp-0); text-align: left; vertical-align: top; text-align: left !important; overflow-wrap: anywhere; word-break: normal; line-break: strict; border-bottom: 1px solid var(--c-rule-thin); font: var(--fs-xs)/var(--lh-ui) var(--ff-ui) !important; letter-spacing: var(--ls-body); color: var(--c-ink); white-space: normal !important; background: transparent; } /* 長い英語の語も折る(anywhere は表の最小幅を縮める。break-word は縮めず、2026-10-25 に EN の表が 768 で 135px はみ出した) */
body.nai-v3 [data-nai-body] thead th { background: var(--c-ink); color: var(--c-on-dark); font-weight: 600 !important; }
body.nai-v3 [data-nai-body] tbody th { font-weight: 600 !important; }
body.nai-v3 [data-nai-body] tbody tr:nth-child(even) :is(th, td) { background: var(--c-paper-2); }
@media (min-width: 768px) {
body.nai-v3 [data-nai-body] :is(th, td) { padding: var(--sp-1); font-size: var(--fs-s) !important; }
}
@media (max-width: 767px) {
body.nai-v3 [data-nai-body] table:has(> thead) { display: block !important; }
body.nai-v3 [data-nai-body] table:has(> thead) :is(tbody, tr) { display: block; }
body.nai-v3 [data-nai-body] table:has(> thead) thead { display: none; }
body.nai-v3 [data-nai-body] table:has(> thead) tr { padding: var(--sp-1) 0; border-bottom: 1px solid var(--c-rule-mid); }
body.nai-v3 [data-nai-body] table:has(> thead) tbody tr:nth-child(even) :is(th, td) { background: transparent; }
body.nai-v3 [data-nai-body] table:has(> thead) :is(th, td) { display: grid; grid-template-columns: 6em minmax(0, 1fr); column-gap: var(--sp-1); padding: 2px 0; border: 0; background: transparent; }
body.nai-v3 [data-nai-body] table:has(> thead) :is(th, td)::before { content: var(--v3-label); font-weight: 600; color: var(--c-ink-2); }
}
body.nai-v3 [data-nai-body] :is(input[type="text"], input[type="email"], input[type="url"], select, textarea) { display: block; width: 100%; min-height: var(--tap); padding: 0 var(--sp-1); border: 1px solid var(--c-meta); background: var(--c-paper); color: var(--c-ink); font: var(--fs-m)/var(--lh-ui) var(--ff-ui); }
body.nai-v3 [data-nai-body] textarea { min-height: 160px; padding: var(--sp-1); }
body.nai-v3 [data-nai-body] input[type="submit"] { min-height: var(--tap); padding: 0 var(--sp-3); border: 0; background: var(--c-ink); color: var(--c-on-dark); font: 600 var(--fs-m)/var(--lh-ui) var(--ff-ui); cursor: pointer; }
body.nai-v3 [data-nai-body] label { display: block; font: var(--fs-m)/var(--lh-body) var(--ff-body); }
body.nai-v3 [data-nai-body] fieldset { border: 1px solid var(--c-rule-mid); margin: 0 0 var(--sp-2); padding: var(--sp-1); }
/* 61-art-v2.css:162 の .nai-article a の下線が、詳細度で 61-art-v2.css:220 の .nai-cta__btn の text-decoration: none に勝っていた(2026-10-25) */
body.nai-v3 [data-nai-body] .nai-cta__btn { min-height: var(--tap); text-decoration: none; }
body.nai-v3 [data-nai-body] .nai-t-sources__url { display: block; min-height: var(--tap-min); }
body.nai-v3 [data-nai-body] .articleBody { font: inherit; letter-spacing: inherit; }
body.nai-v3 .easyLink-info-name { font-size: var(--fs-m) !important; }
@media (max-width: 767px) {
body.nai-v3 [data-nai-body][data-nai-body][data-nai-body] p { font-size: var(--fs-m) !important; line-height: var(--lh-body) !important; }
body.nai-v3 [data-nai-body][data-nai-body][data-nai-body] .nai-t-order__num { font-size: var(--fs-m) !important; line-height: var(--lh-body) !important; } /* 上の p と同じに(雛形の番号は p・改稿の番号は div。2026-10-25) */
body.nai-v3 .easyLink-info-name,
body.nai-v3 .easyLink-info-name a { font-size: var(--fs-m) !important; line-height: var(--lh-body) !important; }
}
body.nai-v3 .v3-entry,
body.nai-v3 .v3-drow { position: relative; }
body.nai-v3 .v3-entry__t a::after,
body.nai-v3 .v3-drow__t a::after { content: ""; position: absolute; inset: 0; }
body.nai-v3 [data-nai-body] .toc ol li a { display: inline-flex; align-items: center; min-height: var(--tap-min); }
body.nai-v3 .easyLink-info-name a { display: block; min-height: var(--tap-min); }
body.nai-v3 [data-nai-body] :is(p, li) > a:not([class*="easyLink"]):not([class*="btn"]):not([class*="cta"]) { padding-block: var(--sp-0); }
body.nai-v3 a:focus-visible,
body.nai-v3 button:focus-visible,
body.nai-v3 input:focus-visible,
body.nai-v3 select:focus-visible,
body.nai-v3 textarea:focus-visible,
body.nai-v3 summary:focus-visible { outline: 2px solid var(--c-accent) !important; outline-offset: 2px; }
body.nai-v3 .easyLink-box :is(a, img) { transition: none !important; }
@media (max-width: 767px) {
body.nai-v3 .v3-main:has(> .v3-cover--post) { display: flex; flex-direction: column; }
body.nai-v3 .v3-main:has(> .v3-cover--post) > * { min-width: 0; }
body.nai-v3 .v3-main:has(> .v3-cover--post) > .v3-crumb { order: -2; }
body.nai-v3 .v3-main:has(> .v3-cover--post) > .v3-cover--post { order: -1; margin-top: 0; }
body.nai-v3 .v3-main:has(> .v3-cover--post) > .v3-ah { margin-top: var(--sp-2); }
}
body.nai-v3.single,
body.nai-v3.page { background: var(--c-paper); }
body.nai-v3 [data-nai-body] fieldset.hidden-fields-container { display: none; }

/* 見出しの書体(Shippori Mincho の対象。text= の字は build.py が同じ並びで数える) */
body.nai-v3 .v3-hd__name,
body.nai-v3 h1,
body.nai-v3 .v3-sec-h,
body.nai-v3 .v3-side-h,
body.nai-v3 .v3-entry__t,
body.nai-v3 .v3-drow__t,
body.nai-v3 .v3-pnx__t,
body.nai-v3 [data-nai-body][data-nai-body][data-nai-body] h2,
body.nai-v3 [data-nai-body][data-nai-body][data-nai-body] h3,
body.nai-v3 [data-nai-body][data-nai-body][data-nai-body] h4 { font-family: var(--ff-head); font-weight: 600; }

/* ---- 本番の実装での足し(PLAN.md 第4版 §1・§2。試作の v3.css には無い規則。選択子の頭は全部 body.nai-v3) ---- */

/* 広告表記 #naioto-footer-disclosure(naioto-hooks.php:267 の JS が最初の footer.footer の先頭に差し込む・
   inline の style を上書きするので !important)。フッターの中身と同じ幅・左寄せ・字は本文以上の色 */
body.nai-v3 #naioto-footer-disclosure {
  font-size: var(--fs-m) !important;
  color: var(--c-ink-2) !important;
  max-width: var(--w-content) !important;
  margin: 0 auto !important;
  padding: var(--sp-2) var(--v3-gut) 0 !important;
  text-align: left !important;
  border: 0 !important;
  background: none !important;
  text-wrap: balance;      /* 390px で「す。」だけが2行目に落ちていた(2026-10-25)。文節で割り、2行の長さをそろえる */
  word-break: auto-phrase;
}

/* 旧い表の包み .nai-table-wrap(10-base.css:31 の横送り・枠線・余白)の打ち消し。naioto.js は OFF と同じ DOM にするため
   V3 でも読む。表の見せ方は上の [data-nai-body] table の規則(767px 以下は積み・768px 以上は幅に収める)が受け持つ */
body.nai-v3 .nai-table-wrap { overflow: visible; border: 0; margin: 0; padding: 0; background: none; }
/* 61-art-v2.css:735 の表の上の隙間(24px)は子結合子なので、包みが付くと当たらない。包みの側に同じ隙間を当てる */
body.nai-v3 .nai-article > .nai-table-wrap:has(> table:not([class*="nai-t-"])) { margin-top: var(--sp-3); }

/* 検索語の強調(nai_v2_search_title が題に付ける mark.nai-mark)。旧版は 60-pages-v2.css:174 が組んでいたが、V3 は 60 を読まないので
   ブラウザの既定の黄の地になっていた(2026-10-25)。60 と同じ形(地なし・朱の下線)にする */
body.nai-v3 mark.nai-mark { background: none; color: inherit; border-bottom: 1px solid var(--c-accent); padding-bottom: 1px; }

/* 言語切替(日本語 / English)・ヘッダーの右上(2026-10-24・D188) */
body.nai-v3 .v3-hd__in { position: relative; }
body.nai-v3 .v3-lang { position: absolute; top: 10px; right: var(--v3-gut); margin: 0; font: var(--fs-xs)/var(--lh-ui) var(--ff-ui); letter-spacing: var(--ls-body); color: var(--c-meta); }
body.nai-v3 .v3-lang a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 4px; } /* 押せる高さ 24px [§9] 3(2026-10-25 に 22px だった) */
body.nai-v3 .v3-lang a[aria-current] { color: var(--c-ink); text-decoration: underline; text-underline-offset: 3px; }
body.nai-v3 .v3-lang a:hover { text-decoration: underline; }
@media (max-width: 767px) { body.nai-v3 .v3-lang { position: static; text-align: right; margin: 0 0 var(--sp-0); } body.nai-v3 .v3-lang a { min-height: var(--tap); } } /* SP は 44px [§9] 3 */

/* ヘッダーのサブジャンルの一覧(2026-10-24 編集部「マウスを重ねたときのサブジャンルが出ない」)。PC だけ開く */
body.nai-v3 .v3-nav__item { position: relative; display: inline-flex; }
body.nai-v3 .v3-nav__sub { display: none; }
body.nai-v3 .v3-nav .v3-nav__item.is-closed > .v3-nav__sub { display: none; } /* Esc で閉じた印(naioto.js)。開く規則より詳細度を上げて順に依らない(2026-10-25) */
@media (min-width: 768px) {
body.nai-v3 .v3-nav__item:hover > .v3-nav__sub,
body.nai-v3 .v3-nav__item:focus-within > .v3-nav__sub { display: block; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); z-index: 50; min-width: 12em; padding: var(--sp-0) 0; background: var(--c-page); border: 1px solid var(--c-rule-mid); box-shadow: 0 6px 16px rgba(0, 0, 0, .08); text-align: left; }
body.nai-v3 .v3-nav .v3-nav__sub a { display: block; min-height: 0; margin: 0; padding: 8px var(--sp-2); border: 0; font-size: var(--fs-s); white-space: nowrap; }
body.nai-v3 .v3-nav .v3-nav__sub a:hover,
body.nai-v3 .v3-nav .v3-nav__sub a:focus-visible { color: var(--c-accent); }
}
/* 768〜1069px はナビの7項目(2026-10-25 の I-13 の前)を1段に収め、両端の項目のサブジャンルの箱を画面の内に寄せる(2026-10-25)。
   間が 24px だと JA は 788px 要り、768 の 720px に入らず「議論・雑談」だけが2段目に落ちていた。
   箱は項目の真ん中に置くので、先頭の「ジャズ」の箱が 768 と 900 で左へ 10〜12px はみ出していた */
@media (min-width: 768px) and (max-width: 1069px) {
body.nai-v3 .v3-nav { gap: var(--sp-1); }
body.nai-v3 .v3-nav > .v3-nav__item:first-child > .v3-nav__sub { left: 0; transform: none; }
body.nai-v3 .v3-nav > .v3-nav__item:last-child > .v3-nav__sub { left: auto; right: 0; transform: none; }
}
/* 768〜859px は JA のナビの8項目(2026-10-25 I-13 でポップスを足した)が 800px 要り、768 の 720px に入らず
   「議論・雑談」だけが2段目に落ちた(ヘッダー 143→200px)。字 15px・間 --sp-0・矢印 12px で 701px にする。860 から上は 16px のまま1段に入る。
   間は余白の段(--sp-0)に寄せる。6px と 2px では §9 の検査 18 に当たった */
@media (min-width: 768px) and (max-width: 859px) {
body.nai-v3 .v3-nav { gap: var(--sp-0); }
body.nai-v3 .v3-nav > a,
body.nai-v3 .v3-nav > .v3-nav__item > a { font-size: var(--fs-s); }
body.nai-v3 .v3-nav .v3-chev { width: 12px; height: 12px; }
}

/* ==== 2026-10-25 改善案(承認2・naioto/design-20261019/7-debug/improvements.json) ==== */
/* NAI-I-01(NAI-D-11): 768〜1069px はタッチのタブレットが多いので、768px 以上で 24px にしていた押す的を SP と同じ 44px にする。1070px 以上(マウス)は 24px のまま */
@media (min-width: 768px) and (max-width: 1069px) {
body.nai-v3 .v3-tags a,
body.nai-v3 .v3-lh__s a,
body.nai-v3 .v3-crumb a,
body.nai-v3 .v3-cats a,
body.nai-v3 .v3-about a,
body.nai-v3 .v3-plain a,
body.nai-v3 .v3-drow__t a,
body.nai-v3 .v3-ft__links a { min-height: var(--tap); }
}
/* NAI-I-02(NAI-D-14・54): 767px 以下で行ごとに積む表の見出しの列は 6em 固定で、長い見出しが語の途中で割れていた。短い見出しは 6em、長い見出しは行の 4 割まで広げる */
@media (max-width: 767px) {
body.nai-v3 [data-nai-body] table:has(> thead) :is(th, td) { grid-template-columns: fit-content(40%) minmax(0, 1fr); }
body.nai-v3 [data-nai-body] table:has(> thead) :is(th, td)::before { min-width: 6em; }
}
/* NAI-I-02(NAI-D-15): 768px 以上の4列以上の表は、1列目が 70〜88px に潰れて3〜4字ごとに割れていた。1列目に下限を置く */
@media (min-width: 768px) {
body.nai-v3 [data-nai-body] table:has(> thead th:nth-child(4)) :is(th, td):first-child { min-width: 7em; }
}
/* NAI-I-03(NAI-D-58): CF7 の検証エラーの表示。plugin 既定の赤は地との比 4.06 で 16px の 4.5 に届かず、エラーの入力欄の枠も通常と同じだった */
body.nai-v3 [data-nai-body] .wpcf7-not-valid-tip { display: block; margin-top: var(--sp-0); color: var(--c-accent); font: var(--fs-s)/var(--lh-ui) var(--ff-ui); }
body.nai-v3 [data-nai-body] :is(input, select, textarea).wpcf7-not-valid { border-color: var(--c-accent); outline: 1px solid var(--c-accent); outline-offset: 0; }
body.nai-v3 [data-nai-body] .wpcf7 form .wpcf7-response-output { margin: var(--sp-2) 0 0; padding: var(--sp-1) var(--sp-2); border: 1px solid var(--c-rule-mid); font: var(--fs-s)/var(--lh-body) var(--ff-ui); color: var(--c-ink); }
body.nai-v3 [data-nai-body] .wpcf7 form:is(.invalid, .unaccepted, .payment-required, .failed, .aborted, .spam) .wpcf7-response-output { border-color: var(--c-accent); }
/* NAI-I-04(NAI-D-16): 記事と固定ページの頭の部品(表紙・題・要約・目次・関連記事・前後の記事)を本文と同じ --measure の幅にそろえる。本文だけが 680px で、右端が 40〜80px ずれていた */
@media (min-width: 768px) {
body.nai-v3 .v3-cols--post .v3-main > * { max-width: var(--measure); }
}
/* NAI-I-04(NAI-D-17): 1024px 以上の記事と固定ページの格子は 760px と右の列を中央に寄せ、ヘッダー・フッター・言語切替の端より左右 15px ほど内側にあった。両端に寄せてそろえる */
@media (min-width: 1024px) {
body.nai-v3 .v3-cols--post { justify-content: space-between; }
}
/* NAI-I-06(NAI-D-22): 767px 以下の商品の箱。1列に積み図を 120px にしていたので1箱が約 440px あった。図を左の 72px の列に置き、ボタンの行は箱の幅いっぱいにする */
@media (max-width: 767px) {
body.nai-v3 [data-nai-body] .nai-cta { grid-template-columns: 72px minmax(0, 1fr); gap: var(--sp-1) var(--sp-2); padding: var(--sp-2); margin: var(--sp-3) 0; }
body.nai-v3 [data-nai-body] .nai-cta .nai-cover { width: 72px; }
body.nai-v3 [data-nai-body] .nai-cta__actions { margin-top: var(--sp-1); }
}