/* Shared finishing layer: keep content compact, give controls enough room. */
.search-row>*{min-width:0}
.search-box input{font-size:16px;min-height:48px}
.sort-label select{font-size:16px;min-height:48px;width:100%}
.search-box:focus-within{border-color:#c9a353;box-shadow:0 0 0 2px #c9a35355}
.search-box input:focus-visible{outline:2px solid #986d20;outline-offset:1px}
main :is(a,button,input,select,summary):focus-visible,
.header :is(a,button):focus-visible,
.compare-bar button:focus-visible{outline:3px solid #c59a43;outline-offset:4px}
.article :is(h2,h3,h4){overflow-wrap:anywhere;text-wrap:pretty}
.article :is(p,li,dd){overflow-wrap:break-word}
.article :is(h2,h3,h4)[id]{scroll-margin-top:24px}
.footer-links{row-gap:16px}
.footer-links a{line-height:1.8}
.compare-bar{bottom:max(12px,env(safe-area-inset-bottom))}
.compare-bar-inner>div:first-child{min-width:0;flex:1}
#selected-names{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:5px}
.selected-name{font-size:14px;color:#f1dfb6;line-height:1.5;margin:0;max-width:none;gap:5px}
.remove-selected{min-width:32px;min-height:32px;justify-content:center;color:#f1dfb6}
.remove-selected .icon{width:14px;height:14px}
.compare-actions .button,.compare-actions .text-button{font-size:14px;min-height:44px}
.compare-actions{flex-shrink:0}
body.has-comparison{padding-bottom:125px}
.toast{font-size:15px;line-height:1.7;bottom:160px}
.compare-dialog{overscroll-behavior:contain;scrollbar-gutter:stable}
.quick-table-scroll{overscroll-behavior-x:contain;scrollbar-color:#a78845 #eee9dc}
@media(max-width:760px){
  .header nav.is-open{max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);overflow-y:auto;overscroll-behavior:contain;align-items:stretch}
  .header nav.is-open>a{padding:9px 4px;min-height:44px;display:flex;align-items:center}
  .header nav.is-open .nav-compare{justify-content:center;min-height:46px}
}
@media(max-width:640px){
  .search-row{flex-direction:column;gap:10px}
  .search-box{width:100%;flex:auto;min-height:50px}
  .sort-label{width:100%;max-width:none}
  .sort-label select{height:48px}
  .compare-bar{padding:11px 13px;width:calc(100% - 20px)}
  .compare-bar-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 9px}
  .compare-bar-inner>div:first-child{display:contents;max-width:none}
  .compare-bar-inner>div:first-child>b{grid-column:1;grid-row:1;font-size:14px;line-height:1.6}
  .compare-actions{grid-column:2;grid-row:1;gap:9px}
  .compare-actions .button{font-size:14px;padding:9px 12px;min-height:44px;gap:6px}
  .compare-actions .text-button{font-size:14px;padding:5px 0}
  #selected-names{grid-column:1/-1;grid-row:2;flex-wrap:nowrap;overflow-x:auto;max-height:none;margin:0;padding-bottom:3px;scrollbar-width:thin;scrollbar-color:#b59657 #302a20}
  .selected-name{flex:0 0 auto;white-space:nowrap;max-width:none;font-size:14px;padding-left:9px;border:1px solid #76623c;background:#322b20;border-radius:3px}
  .remove-selected{min-height:34px;min-width:34px}
  body.has-comparison{padding-bottom:145px}
  .toast{bottom:165px}
  .comparison-transfer .button{white-space:normal;text-align:center}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{body.has-comparison{padding-bottom:0}}

/* 紹介文は意味で段落を分け、画面幅に合わせて自然に折り返す。 */
.portal-intro .portal-intro-copy{max-width:48em}
.portal-intro .portal-intro-copy p{margin:0;font-size:15px;line-height:1.85;overflow-wrap:break-word}
.portal-intro .portal-intro-copy p+p{margin-top:9px}
.portal-intro .portal-intro-copy b{font-weight:750}
/* ランキング：条件・日付を小さな余白で整理し、文字の濃さを確保する。 */
.ranking-card .ranking-context{margin:0 0 8px;font-size:14px;line-height:1.6;color:#655b48;min-width:0}
.ranking-context .ranking-record{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 8px;margin:0 0 3px}
.ranking-context .ranking-record b{font-size:14px;line-height:1.6;color:#514124}
.ranking-card .ranking-context .ranking-scope{margin:0;color:#655b48;font-size:14px;line-height:1.6;overflow-wrap:break-word}
.ranking-context .ranking-dates{display:flex;flex-wrap:wrap;gap:2px 14px;margin:6px 0 0;padding:0;font-size:14px;line-height:1.6;color:#655b48}
.ranking-dates>div{display:flex;align-items:baseline;gap:6px;min-width:0;max-width:100%}
.ranking-dates dt{margin:0;font-weight:500;color:#796943;flex-shrink:0}
.ranking-dates dd{margin:0;overflow-wrap:break-word;font-variant-numeric:tabular-nums}
@media(max-width:620px){
 .ranking-card{padding:12px}
 .ranking-card .ranking-card-head{grid-template-columns:38px 66px minmax(0,1fr);gap:9px}
 .ranking-card .ranking-badge{min-height:46px;padding:4px 3px}
 .ranking-card .ranking-badge b{font-size:22px}
 .ranking-card .ranking-site-image{width:66px;height:48px}
 .ranking-card h3{font-size:18px;line-height:1.5}
 .ranking-card .ranking-primary{margin:9px 0 7px;padding:5px 0}
 .ranking-card .ranking-primary strong{font-size:29px;line-height:1.3}
 .ranking-card .ranking-secondary{margin:0 0 7px;gap:8px}
 .ranking-card .ranking-secondary dt{font-size:14px;line-height:1.5}
 .ranking-card .ranking-secondary dd{margin-top:1px;font-size:17px;line-height:1.5}
 .ranking-card .ranking-actions{padding-top:8px;gap:8px}
 .ranking-card .ranking-actions .select-button,.ranking-card .ranking-actions .detail-link{min-height:42px;font-size:13px;padding:6px 10px}
 .ranking-card .ranking-dates{gap:2px 12px;margin-top:4px}
}
@media(max-width:360px){
 .ranking-card .ranking-card-head{grid-template-columns:34px 58px minmax(0,1fr);gap:8px}
 .ranking-card .ranking-site-image{width:58px;height:44px}
 .ranking-card h3{font-size:17px}
 .ranking-card .ranking-secondary dd{font-size:16px}
}