.hikaku-layout { display:grid; gap:var(--sp-5); align-items:start; }
#hikaku-input-screen .page-head { padding-block:.5rem; }
#hikaku-input-screen .page-head h1 { font-size:clamp(1.3rem,3vw,2rem); line-height:1.35; margin:.3rem 0; }
#hikaku-input-screen .page-head p { margin:.25rem 0; font-size:1rem; line-height:1.4; }
#hikaku-input-screen .section { padding-block:.5rem 1rem; }
#hikaku-result-content[hidden],#hikaku-missing[hidden],#hikaku-storage-error[hidden] { display:none; }
.hikaku-form { min-width:0; }
.hikaku-fields { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:clamp(.5rem,2vw,1.5rem); margin-bottom:var(--sp-2); }
.hikaku-fields .heading-bar { margin-bottom:var(--sp-5); }
.hikaku-field { margin-bottom:var(--sp-2); }
.hikaku-field:last-child { margin-bottom:0; }
.hikaku-field label { display:block; font-size:1rem; font-weight:700; color:var(--text-strong); margin-bottom:.2rem; }
.hikaku-field__input { display:flex; align-items:center; gap:.6rem; }
.hikaku-field__input input { box-sizing:border-box; min-width:0; width:min(100%,20rem); min-height:48px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); color:var(--text); font:inherit; font-size:1.1rem; font-variant-numeric:tabular-nums; padding:.4rem .75rem; }
.hikaku-field__input input[aria-invalid="true"] { border-color:var(--error); }
.hikaku-field__help,.hikaku-field__error { margin:.1rem 0 0; font-size:14px; line-height:1.4; }
.hikaku-field__help { color:var(--text-muted); }
.hikaku-field__error { color:var(--error); }
.hikaku-check { display:flex; align-items:start; gap:.75rem; }
.hikaku-check input { flex:none; width:20px; height:20px; margin:.25rem 0 0; }
.hikaku-check label { margin:0; min-height:48px; display:flex; align-items:center; font-size:14px; white-space:nowrap; }
.hikaku-years { border:0; padding:0; margin:0; min-width:0; }
.hikaku-years legend { font-size:1rem; font-weight:700; color:var(--text-strong); margin-bottom:var(--sp-2); }
.hikaku-years__choices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.4rem; }
.hikaku-years__choices label { position:relative; min-width:0; }
.hikaku-years__choices input { position:absolute; width:100%; height:100%; margin:0; opacity:0; }
.hikaku-years__choices span { min-height:56px; display:flex; align-items:center; justify-content:center; border:2px solid var(--border); border-radius:var(--radius); background:var(--surface); color:var(--text-strong); font-size:1rem; font-weight:700; }
.hikaku-years__choices input:checked + span { border-color:var(--green-700); background:var(--green-50); color:var(--green-700); }
.hikaku-years__choices input:focus-visible + span { outline:3px solid var(--focus); outline-offset:2px; }
.hikaku-details { border:1px solid var(--border); border-radius:var(--radius-lg); margin-bottom:var(--sp-2); }
.hikaku-details summary { position:relative; cursor:pointer; min-height:56px; display:flex; flex-direction:column; justify-content:center; padding:.35rem 2rem .35rem 1rem; color:var(--green-700); font-weight:700; list-style:none; }
.hikaku-details summary::-webkit-details-marker { display:none; }
.hikaku-details summary::after { content:''; position:absolute; right:1rem; top:50%; width:0; height:0; border-inline:5px solid transparent; border-top:7px solid currentColor; transform:translateY(-50%); transition:transform .25s ease-in-out; }
.hikaku-details[open] summary::after { transform:translateY(-50%) rotate(180deg); }
.hikaku-details summary span { font-size:14px; font-weight:400; color:var(--text-muted); }
.hikaku-details__body { padding:var(--sp-3); }
.hikaku-details .hikaku-fields { margin-bottom:var(--sp-3); }
.hikaku-compare { width:100%; min-height:56px; }
.hikaku-compare[aria-disabled="true"] { opacity:.5; }
.hikaku-compare-help { font-size:14px; margin:.25rem 0 0; }
.hikaku-compare-help[hidden] { display:none; }
.hikaku-caveat { font-size:14px; margin-top:.5rem; }
.hikaku-reading { background:var(--green-50); padding:var(--sp-4); border-radius:var(--radius); }
.hikaku-summary { border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--sp-4); }
.hikaku-summary__list { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:.4rem 1rem; margin:var(--sp-3) 0; }
.hikaku-summary__list dt { font-weight:700; }
.hikaku-summary__list dd { margin:0; overflow-wrap:anywhere; }
.hikaku-page-title { margin:0; font-size:clamp(1.5rem,3vw,2rem); }
.hikaku-result-page .hikaku-summary { padding:var(--sp-3) var(--sp-4); }
.hikaku-result-page .hikaku-summary h2 { margin:0; font-size:1rem; }
.hikaku-result-page .hikaku-summary__list { margin:var(--sp-2) 0 0; gap:.2rem 1rem; font-size:14px; line-height:1.5; }
.hikaku-edit { justify-self:start; min-height:56px; }
.hikaku-differences { min-width:0; max-width:100%; }
.hikaku-differences__body { min-width:0; }
.hikaku-table-scroll { min-width:0; max-width:100%; overflow-x:auto; }
.hikaku-differences table { border-collapse:collapse; width:100%; min-width:650px; font-size:14px; }
.hikaku-differences th,.hikaku-differences td { border:1px solid var(--border); padding:.6rem; text-align:left; vertical-align:top; }
.hikaku-differences th { background:var(--green-50); }
.hikaku-next-inner > p { margin-bottom:var(--sp-5); }
.hikaku-next-grid { display:grid; gap:var(--sp-4); }
.hikaku-next__item { min-width:0; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--sp-4); }
.hikaku-next__item h3 { color:var(--green-700); }
.hikaku-next__item .offer { display:block; margin-top:var(--sp-4); }
.hikaku-next__item .offer__name,.hikaku-next__item .offer__meta { overflow-wrap:anywhere; }
.hikaku-next__item .offer .btn { display:flex; width:100%; box-sizing:border-box; white-space:normal; text-align:center; justify-content:center; margin-top:var(--sp-3); }
.hikaku-result-layout { max-width:72rem; min-width:0; }
.hikaku-result-layout .result,.hikaku-result-layout .result__head { min-width:0; }
.hikaku-result-page { min-height:100vh; }
.hikaku-result-tail { max-width:72rem; display:grid; gap:var(--sp-6); }
.hikaku-result-tail .tool-sources { margin:0; }
.hikaku-result-page .hikaku-breakdown,
.hikaku-result-page .hikaku-differences,
.hikaku-result-page .hikaku-result-tail {
  content-visibility:auto;
}
.hikaku-result-page .hikaku-breakdown { contain-intrinsic-size:auto 900px; }
.hikaku-result-page .hikaku-differences { contain-intrinsic-size:auto 700px; }
.hikaku-result-page .hikaku-result-tail { contain-intrinsic-size:auto 3000px; }
.hikaku-conclusion__note { font-size:14px; margin-top:var(--sp-3); }
#hikaku-conclusion { --conclusion-padding:var(--sp-6); padding:var(--conclusion-padding); border-top:1px solid var(--border); box-shadow:none; }
.hikaku-conclusion__header {
  margin:calc(-1 * var(--conclusion-padding)) calc(-1 * var(--conclusion-padding)) var(--sp-5);
  padding:var(--sp-4) var(--conclusion-padding);
  border-radius:calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px) 0 0;
  background:var(--green-600);
  color:#fff;
}
.hikaku-conclusion__title { font-size:1rem; font-weight:700; margin:0 0 var(--sp-2); }
.hikaku-conclusion__line { font-size:var(--fs-h2); color:inherit; margin:0; }
.hikaku-ranking { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-3); }
.hikaku-rank-card { min-width:0; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); padding:var(--sp-4); }
.hikaku-rank-card.is-first { border-top:6px solid var(--green-600); box-shadow:0 5px 16px rgba(18,61,44,.13); }
.hikaku-rank-card__badge { display:inline-block; border:1px solid var(--green-700); border-radius:99px; color:var(--green-700); font-size:14px; font-weight:700; line-height:1.4; padding:.15rem .6rem; }
.hikaku-rank-card.is-first .hikaku-rank-card__badge { background:var(--green-700); color:#fff; }
.hikaku-rank-card__name { font-size:1.25rem; margin:.65rem 0 .35rem; color:var(--text-strong); }
.hikaku-rank-card__money { display:block; color:var(--text-strong); font-family:var(--font-head); font-size:1.5rem; font-weight:700; line-height:1.25; overflow-wrap:anywhere; }
.hikaku-rank-card.is-first .hikaku-rank-card__money { font-size:clamp(2rem,3vw,2.75rem); }
.hikaku-rank-card__money small { font-size:max(14px,.48em); }
.hikaku-rank-card__minus { font-size:.7em; vertical-align:middle; }
.hikaku-rank-card__track { height:.75rem; margin-top:var(--sp-3); border-radius:99px; background:var(--green-50); overflow:hidden; }
.hikaku-rank-card__fill { display:block; height:100%; border-radius:99px; background:var(--green-100); }
.hikaku-rank-card.is-first .hikaku-rank-card__fill { background:var(--green-700); }
.hikaku-rank-card__unavailable { font-size:14px; margin:.7rem 0 0; }
.hikaku-rank-card__unavailable a { display:block; }
.hikaku-result-page #hikaku-next { background:transparent; padding:0; }
.hikaku-result-page #hikaku-next .container { width:100%; max-width:none; padding:0; }
.hikaku-result-page #hikaku-next .heading-bar { margin-bottom:var(--sp-3); }
.hikaku-result-page #hikaku-next .heading-bar > .pr-label {
  align-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  height:auto;
  min-height:0;
  font-size:var(--fs-note);
  line-height:1;
  padding:4px 8px;
}
.hikaku-next-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.hikaku-next__item.is-first { grid-column:1/-1; }
.hikaku-next__item h3 { color:var(--text-strong); }
.hikaku-next__item > h3 {
  margin:calc(-1 * var(--sp-4)) calc(-1 * var(--sp-4)) var(--sp-4);
  padding:var(--sp-3) var(--sp-4);
  border-radius:calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px) 0 0;
  background:var(--green-600);
  color:#fff;
}
.hikaku-breakdown { min-width:0; }
.hikaku-breakdown__cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-3); }
.hikaku-breakdown__card { display:flex; flex-direction:column; min-width:0; border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--sp-4); background:var(--surface); }
.hikaku-breakdown__card h3 { font-size:1.1rem; color:var(--text-strong); margin-bottom:var(--sp-3); }
.hikaku-breakdown__group { margin-bottom:var(--sp-4); }
.hikaku-breakdown__group h4 { color:var(--text-muted); font-size:14px; margin-bottom:.35rem; }
.hikaku-breakdown__line,.hikaku-breakdown__total { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.7rem; align-items:start; padding:.25rem 0; font-size:14px; }
.hikaku-breakdown__line strong,.hikaku-breakdown__total strong { color:var(--text-strong); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.hikaku-breakdown__total { background:var(--green-50); border-radius:var(--radius); margin-top:auto; padding:.7rem; font-weight:700; }
#hikaku-missing { min-height:30vh; }
#hikaku-missing .btn { min-height:56px; margin-top:var(--sp-4); }
#hikaku-ad-disclosure[hidden],.hikaku-field__error[hidden],#hikaku-differences[hidden] { display:none; }
@media (min-width:64rem) { #hikaku-input-screen .hikaku-layout { max-width:54rem; } }
@media (max-width:48rem) {
  .hikaku-ranking,.hikaku-breakdown__cards { grid-template-columns:1fr; }
  .hikaku-differences table,.hikaku-differences tbody,.hikaku-differences tr { display:block; width:100%; min-width:0; }
  .hikaku-differences thead { display:none; }
  .hikaku-differences tr { border:1px solid var(--border); border-radius:var(--radius); margin-bottom:var(--sp-3); overflow:hidden; }
  .hikaku-differences th,.hikaku-differences td { display:grid; grid-template-columns:5.5rem minmax(0,1fr); gap:.5rem; border:0; border-bottom:1px solid var(--border); }
  .hikaku-differences th { display:block; }
  .hikaku-differences td::before { content:attr(data-label); color:var(--text-muted); font-weight:700; }
}
@media (max-width:40rem) {
  #hikaku-conclusion { --conclusion-padding:var(--sp-5); }
  #hikaku-input-screen .breadcrumb { display:none; }
  .hikaku-next-grid { grid-template-columns:1fr; }
  .hikaku-next__item.is-first { grid-column:auto; }
}

/* 結果カード内の開閉。内訳はカードごとに独立して高さを変える。 */
.hikaku-ranking { align-items:start; }
.hikaku-card-details,.hikaku-more-details { overflow:hidden; }
.hikaku-card-details { margin-top:var(--sp-3); border-top:1px solid var(--border); }
.hikaku-card-details summary,.hikaku-more-details summary {
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3);
  min-height:56px; cursor:pointer; list-style:none; font-size:1rem; font-weight:700;
  color:var(--text-strong);
}
.hikaku-card-details summary::-webkit-details-marker,.hikaku-more-details summary::-webkit-details-marker { display:none; }
.hikaku-card-details summary:focus-visible,.hikaku-more-details summary:focus-visible { outline:3px solid var(--focus); outline-offset:-3px; }
.hikaku-card-details summary::after,.hikaku-more-details summary::after {
  content:''; width:0; height:0; flex:none; border-inline:5px solid transparent; border-top:7px solid var(--green-700); transition:transform .25s ease-in-out;
}
.hikaku-card-details[open] summary::after,.hikaku-more-details[open] summary::after { transform:rotate(180deg); }
.hikaku-card-details__body { padding:var(--sp-2) 0 var(--sp-3); }

/* 順位と内訳を各案のペアとして並べ、開いた内訳だけが伸びる。 */
.hikaku-option-pair {
  display:grid;
  grid-template-rows:auto auto;
  gap:var(--sp-2);
  align-content:start;
  min-width:0;
}
.hikaku-option-pair .hikaku-rank-card {
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
}
.hikaku-option-pair .hikaku-rank-card__badge { align-self:flex-start; }
.hikaku-option-pair .hikaku-rank-card__money,
.hikaku-option-pair .hikaku-rank-card__unavailable { margin-top:auto; }
.hikaku-option-pair .hikaku-rank-card__track { flex:none; width:100%; }
.hikaku-option-pair .hikaku-card-details {
  align-self:start;
  margin:0;
  padding:0 var(--sp-4);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface);
}
.hikaku-card-details__body .hikaku-breakdown__total { margin-top:var(--sp-3); }
.hikaku-result-page .hikaku-differences { content-visibility:visible; contain-intrinsic-size:none; }
.hikaku-more-details { border:1px solid var(--border); border-radius:var(--radius-lg); margin-top:var(--sp-4); }
.hikaku-more-details summary { min-height:56px; padding:var(--sp-2) var(--sp-4); }
.hikaku-differences__body { padding:0 var(--sp-4) var(--sp-4); }
.hikaku-differences__body .hikaku-reading { margin-top:var(--sp-4); }
@media (prefers-reduced-motion:reduce) {
  .hikaku-details summary::after,.hikaku-card-details summary::after,.hikaku-more-details summary::after { transition:none; }
}

/* 開いた内訳は合計を下端に揃え、閉じた本文は表示しない。 */
.hikaku-option-pair .hikaku-card-details { box-sizing:border-box; display:flex; flex-direction:column; }
.hikaku-option-pair .hikaku-card-details summary { flex:none; }
.hikaku-option-pair .hikaku-card-details:not([open]) .hikaku-card-details__body { display:none; }
.hikaku-option-pair .hikaku-card-details[open] .hikaku-card-details__body {
  display:flex;
  flex:1;
  flex-direction:column;
  box-sizing:border-box;
  min-height:var(--hikaku-detail-body-height, auto);
}
.hikaku-option-pair .hikaku-breakdown__total { margin-top:auto; }
