/* premium.css — 高級感のあるテーマ層（画面のみ）。style.css / quick.css の後に読み込む。
   配色A（既定）：深緑と金。配色B：html[data-theme="navy"] で深紺と金。
   文言・並び・入力の流れ・印刷（@media print）には触れない。 */
@media screen {

/* ---------- 1. 配色と書体の変数 ---------- */
:root {
  color-scheme: light;
  --p-primary: #144a41;        /* 主色：深い緑 */
  --p-primary-deep: #0f3a34;   /* いちばん深い緑（結果の板） */
  --p-primary-light: #1c5e53;  /* ボタンの上端・ホバー */
  --p-primary-rgb: 20, 74, 65;         /* 影・光のための主色（配色Bで差し替え） */
  --p-primary-deep-rgb: 15, 58, 52;
  --p-rule-long: 72px;                 /* 金の飾り線：ヘッダー・フッター */
  --p-rule: 40px;                      /* 金の飾り線：カードの中 */
  --p-tint: #e9efe9;           /* 主色のごく淡い地 */
  --p-tint-strong: #dbe6de;    /* 選択中の地 */
  --p-paper: #f8f5ee;          /* 生成りの紙 */
  --p-card: #fffdf9;           /* カードの地 */
  --p-ink: #1f2a27;            /* 墨色の本文 */
  --p-muted: #5b665f;          /* 補足の文字（4.5:1 以上） */
  --p-line: #ddd6c6;           /* 薄い罫線 */
  --p-line-soft: #e9e3d5;
  --p-gold: #b8955a;           /* 金（線・飾り・✓ のみ。小さな文字には使わない） */
  --p-gold-line: #cbb27f;
  --p-gold-deep: #7a5c26;      /* 文字に使うときの金（5.7:1） */
  --p-gold-soft: #faf3e3;      /* 金の淡い地（注意書き） */
  --p-gold-soft-line: #d9c79a;
  --p-tax: #9b2f38;            /* 税金の色（落ち着いた臙脂） */
  --p-tax-soft: #fbf3f1;
  --p-tax-line: #e6d3d1;
  --p-shadow: 0 1px 2px rgba(31, 42, 39, .04), 0 12px 32px rgba(31, 42, 39, .06);
  --p-shadow-strong: 0 2px 4px rgba(31, 42, 39, .05), 0 18px 44px rgba(31, 42, 39, .09);
  --p-serif: "Hiragino Mincho ProN", "Yu Mincho Demibold", "Yu Mincho", "Noto Serif CJK JP", "Noto Serif JP", "Source Han Serif JP", "MS Mincho", serif;
  --p-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;

  /* 既存の変数を差し替える */
  --ink: var(--p-ink);
  --muted: var(--p-muted);
  --green: var(--p-primary);
  --green-dark: var(--p-primary-deep);
  --sage: var(--p-tint);
  --ivory: var(--p-paper);
  --line: var(--p-line);
  --orange: var(--p-tax);
  --tax: var(--p-tax);
  --error: #a4362c;
  --shadow: var(--p-shadow);
  --white: var(--p-card);
  background: var(--p-paper);
}

html[data-theme="navy"] {
  --p-primary: #16284a;
  --p-primary-deep: #10203b;
  --p-primary-light: #22396a;
  --p-primary-rgb: 22, 40, 74;
  --p-primary-deep-rgb: 16, 32, 59;
  --p-tint: #e9ecf2;
  --p-tint-strong: #dde3ee;
}

html, body { background: var(--p-paper); color: var(--p-ink); }

body {
  font-family: var(--p-sans);
  font-size: 16px;
  line-height: 1.85;
  background:
    linear-gradient(180deg, rgba(var(--p-primary-rgb), .035) 0, rgba(var(--p-primary-rgb), 0) 360px),
    var(--p-paper);
}

h1, h2, h3, dialog h2,
.brand > span:not(.brand-monogram),
.hero-points-title,
.frame-cards > h4,
.frame-card h5,
.deemed-card h5,
.comparison h4,
.next-checks h4 {
  font-family: var(--p-serif);
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--p-ink);
}

a { color: var(--p-primary); text-decoration-color: var(--p-gold-line); text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { text-decoration-color: var(--p-primary); }

/* キーボード操作の見え方（紙の上で 4.5:1 以上になる濃い金） */
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--p-gold-deep);
  outline-offset: 4px;
}
.quick-calculator .choice:has(input:focus-visible),
.quick-calculator .reason-checks > label:has(input:focus-visible) { outline: 3px solid var(--p-gold-deep); outline-offset: 3px; }

::selection { background: var(--p-tint-strong); }

/* ---------- 2. ヘッダー ---------- */
.site-header { min-height: 84px; border-bottom: 1px solid var(--p-line); position: relative; }
.site-header::after {
  content: ""; position: absolute; left: 0; bottom: -1px; width: var(--p-rule-long); height: 1px; background: var(--p-gold);
}
.brand { gap: 14px; color: var(--p-ink); }
.brand > span { font-size: 22px; letter-spacing: .06em; }
.brand small, body .brand small { font-family: var(--p-sans); font-weight: 500; font-size: 14px; letter-spacing: 0; color: var(--p-muted); }
.brand > .brand-monogram, .brand-monogram {
  width: 44px; height: 44px; border-radius: 50%;
  background: linear-gradient(160deg, var(--p-primary-light), var(--p-primary-deep));
  color: #fff; font-family: var(--p-sans); font-weight: 700; font-size: 22px; letter-spacing: 0; line-height: 1;
  box-shadow: 0 0 0 2px var(--p-paper), 0 0 0 3px var(--p-gold), 0 6px 14px rgba(31, 42, 39, .14);
}
html[data-theme="navy"] .brand > .brand-monogram { box-shadow: 0 0 0 1px var(--p-paper), 0 0 0 2px var(--p-gold), 0 6px 14px rgba(31, 42, 39, .14); }
.header-link { color: var(--p-primary); letter-spacing: 0; }

/* ---------- 3. ヒーロー ---------- */
.hero { padding-block: 34px 22px; }
.hero h1 { font-size: 30px; line-height: 1.5; letter-spacing: .06em; }
.hero-lead { color: var(--p-muted); font-size: 16px; line-height: 1.9; margin-top: 10px; }
.hero-art { padding: 5px; background: var(--p-card); border: 1px solid var(--p-gold-line); border-radius: 14px; box-shadow: var(--p-shadow); }
.hero-art img { border-radius: 9px; }
.hero-points { position: relative; margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--p-line-soft); }
.hero-points::before { content: ""; position: absolute; left: 0; top: -1px; width: var(--p-rule); height: 1px; background: var(--p-gold); }
.hero-points-title { font-size: 19px; margin-bottom: 10px; }
.point-list li { font-size: 16px; color: var(--p-ink); padding-left: 28px; }
.point-list li::before { color: var(--p-gold-deep); font-family: var(--p-sans); font-weight: 700; font-size: 15px; }

/* ---------- 4. ボタン ---------- */
.button { border-radius: 12px; letter-spacing: .02em; transition: background .18s, transform .18s, box-shadow .18s; }
.button:hover { transform: translateY(-1px); }
.primary,
.example-start .try-example,
.quick-calculator .unit-suggest .chip-button,
.quick-calculator .range-result .button,
.quick-calculator .live-panel .sample-inline .button,
.quick-calculator .live-panel .add-more .button,
.blocked-result .button,
.next-sample .button.primary,
.mobile-result-bar .bar-action {
  background: var(--p-primary);
  color: #fff;
  border: 1px solid var(--p-primary-deep);
  box-shadow: 0 4px 12px rgba(var(--p-primary-deep-rgb), .16);
}
.primary:hover,
.example-start .try-example:hover,
.quick-calculator .unit-suggest .chip-button:hover,
.quick-calculator .range-result .button:hover,
.mobile-result-bar .bar-action:hover {
  background: var(--p-primary-light);
  border-color: var(--p-primary);
  box-shadow: 0 6px 16px rgba(var(--p-primary-deep-rgb), .2);
}
.example-start .try-example { border-radius: 14px; min-height: 68px; letter-spacing: .04em; }
.example-start .try-example span { opacity: .92; }
.secondary,
.quick-calculator .live-panel .button {
  background: var(--p-card); color: var(--p-primary); border-color: var(--p-primary);
  box-shadow: 0 2px 6px rgba(31, 42, 39, .05);
}
.secondary:hover, .quick-calculator .live-panel .button:hover { background: var(--p-tint); border-color: var(--p-primary); }
.text-button { color: var(--p-primary); text-decoration-color: var(--p-gold-line); }
.more-examples > summary { color: var(--p-primary); text-decoration-color: var(--p-gold-line); }
.example-links button { background: var(--p-card); border: 1px solid var(--p-line); border-radius: 12px; color: var(--p-ink); box-shadow: 0 1px 3px rgba(31, 42, 39, .04); }
.example-links button:hover { border-color: var(--p-primary); background: var(--p-tint); }
.safety-line { color: var(--p-muted); }

/* ---------- 5. カードと見出し番号 ---------- */
.quick-calculator .scheme-panel,
.quick-calculator .receipt-card {
  background: var(--p-card);
  border: 1px solid var(--p-line);
  border-radius: 14px;
  box-shadow: var(--p-shadow);
  padding: 26px 24px;
}
.quick-calculator .scheme-panel { margin-bottom: 22px; }
.quick-calculator #receipt-cards { gap: 20px; }
.quick-calculator .scheme-panel h3 { font-size: 21px; margin-bottom: 12px; }
.quick-calculator .entry-heading { font-size: 20px; margin: 26px 0 14px; }
body .section-number {
  width: 28px; height: 28px; flex-basis: 28px; border-radius: 50%;
  background: transparent; border: 1.5px solid var(--p-gold); color: var(--p-primary);
  font-family: var(--p-serif); font-weight: 600; font-size: 15px; margin-right: 11px;
}
.quick-calculator .live-heading .section-number { margin-right: 11px; }
.quick-calculator .receipt-heading { border-bottom: 1px solid var(--p-line-soft); padding-bottom: 12px; margin-bottom: 20px; position: relative; }
.quick-calculator .receipt-heading::after { content: ""; position: absolute; left: 0; bottom: -1px; width: var(--p-rule); height: 1px; background: var(--p-gold); }
.quick-calculator .receipt-heading h3 { font-size: 20px; }
.quick-calculator .receipt-heading button { color: var(--p-muted); text-decoration-color: var(--p-line); }
.quick-calculator .receipt-heading button:hover { color: var(--p-primary); }

/* 制度のチェック */
.quick-calculator .choice { background: var(--p-card); border: 1px solid var(--p-line); border-radius: 12px; transition: background .18s, border-color .18s, box-shadow .18s; }
.quick-calculator .choice:hover { border-color: var(--p-gold-line); }
.quick-calculator .choice:has(input:checked) { background: var(--p-tint); border-color: var(--p-primary); box-shadow: inset 0 0 0 1px var(--p-primary); }
.quick-calculator .choice input, .quick-calculator .reason-checks input, .quick-calculator .receipt-more input[type="checkbox"], .quick-calculator .option-radios input[type="radio"], .checkbox-row input { accent-color: var(--p-primary); }
.quick-calculator .choice small, body .quick-calculator .choice small, body .quick-calculator .option-radios small { color: var(--p-muted); font-size: 14px; }
.quick-calculator :is(.other-choices, .past-help, .reason-more, .receipt-help, .receipt-more, .live-tax-detail) > summary { color: var(--p-primary); }
.quick-calculator .history-reminder { border-top: 1px solid var(--p-line-soft); }

/* 入力欄 */
.quick-calculator input:not([type="checkbox"]), .quick-calculator select,
input, select { border: 1px solid #b9b2a2; border-radius: 10px; background: #fff; color: var(--p-ink); }
input:focus, select:focus, .quick-calculator input:not([type="checkbox"]):focus, .quick-calculator select:focus { border-color: var(--p-primary); box-shadow: 0 0 0 3px rgba(var(--p-primary-rgb), .12); }
body .quick-calculator .date-controls input { color: var(--p-ink); }
.quick-calculator .core-fields input, .quick-calculator .year-block input, .quick-calculator .date-controls input { font-variant-numeric: tabular-nums lining-nums; }
.quick-calculator #comparison-event { font-size: 16px; }
.quick-calculator .field-group > label, .quick-calculator .core-fields label, .quick-calculator .field-label { color: var(--p-ink); }
.quick-calculator .label-sub { color: var(--p-muted); }
.quick-calculator .amount-readout-text { color: var(--p-primary); font-variant-numeric: tabular-nums; }
.quick-calculator .quick-period { background: var(--p-paper); border: 1px solid var(--p-line-soft); border-radius: 12px; }
.quick-calculator .period-readout { color: var(--p-primary); }
.quick-calculator .era-hint { color: var(--p-muted); }
.quick-calculator .date-pair-grid > .period-arrow { color: var(--p-gold-deep); }
.quick-calculator .summary-line { background: var(--p-paper); border: 1px solid var(--p-line-soft); border-radius: 10px; }
.quick-calculator .year-chip { background: var(--p-card); border: 1px solid #b9b2a2; border-radius: 10px; color: var(--p-ink); }
.quick-calculator .year-chip:hover { border-color: var(--p-primary); }
.quick-calculator .year-chip[aria-pressed="true"] { background: var(--p-tint); border-color: var(--p-primary); color: var(--p-primary); box-shadow: inset 0 0 0 1px var(--p-primary); }
.quick-calculator .reason-checks > label { background: var(--p-card); border: 1px solid var(--p-line); }
.quick-calculator .reason-checks > label:has(input:checked),
.quick-calculator .option-radios .reason-checks > label:has(input:checked) { background: var(--p-tint); border-color: var(--p-primary); }
.quick-calculator .option-radios .reason-checks > label { border-color: var(--p-line); }
.quick-calculator .receipt-more { border-top: 1px solid var(--p-line-soft); }
.quick-calculator .overlap-note { background: var(--p-gold-soft); border: 1px solid var(--p-gold-soft-line); }

/* 補足の注意書き（紙色＋薄い罫線。読んでほしい「説明」の金地とは分ける） */
.quick-calculator .sample-banner,
.quick-calculator .unit-suggest,
.quick-calculator .day-note,
.quick-calculator .sample-inline,
.quick-calculator .range-result,
.next-sample,
.excluded-note,
.comparison .cmp-company,
.frame-card .fc-carry {
  background: var(--p-paper); border: 1px solid var(--p-line-soft);
}
.excluded-note { border-style: dashed; border-color: var(--p-line); }
.quick-calculator .sample-banner { background: var(--p-gold-soft); border: 1px solid var(--p-gold-soft-line); border-left: 4px solid var(--p-gold); border-radius: 12px; }
.quick-calculator .sample-banner strong, .quick-calculator .confirm-note, .quick-calculator .range-result .range-label, .quick-calculator .range-result .range-sub, .quick-calculator .role-confirm-result h4 { color: #4a3a10; }
.quick-calculator .role-radios.needs-confirm { border-color: var(--p-gold); background: var(--p-gold-soft); }
.quick-calculator select.needs-day { border-color: var(--p-gold-deep); background: var(--p-gold-soft); box-shadow: 0 0 0 3px rgba(184, 149, 90, .35); }
/* 読んでほしい説明（みなし勤続年数の特例）だけ金の淡い地＋金の左罫線 */
.deemed-card, .deemed-pointer { background: var(--p-gold-soft); border: 1px solid var(--p-gold-soft-line); border-left: 4px solid var(--p-gold); }
.deemed-card .dc-p4 { background: var(--p-card); color: var(--p-primary); }
.deemed-pointer a { color: #4a3a10; display: inline; padding-block: 14px; } /* 行内のまま上下に余白＝広い画面でも指で押せる高さ（44px以上） */

/* 角丸は3段（10＝内側の小箱と入力欄／12＝ボタン・注意書き／14＝カード） */
.frame-card .fc-carry, .frame-card .fc-multi, .frame-card .fc-db, .deemed-card .dc-p4, .calc-group h4, .calc-step pre, .summary-card, .result-row .row-net, .quick-calculator .day-note, .comparison .cmp-company { border-radius: 10px; }
.next-message { border-radius: 14px; }
.quick-calculator .kind-badge { border-radius: 999px; }

/* 折りたたみの印は金に */
summary::marker { color: var(--p-gold-deep); font-size: .75em; }
summary::-webkit-details-marker { color: var(--p-gold-deep); }

/* ---------- 6. 結果パネル ---------- */
.quick-calculator .live-panel {
  background: var(--p-card);
  border: 1px solid var(--p-gold-line);
  border-top: 3px solid var(--p-gold);
  border-radius: 14px;
  box-shadow: var(--p-shadow-strong);
  padding: 24px;
}
.quick-calculator .live-heading { border-bottom: 1px solid var(--p-line-soft); }
.quick-calculator .live-heading h3 { font-size: 21px; }
.quick-calculator #live-status { background: var(--p-tint); color: #46554d; border-radius: 999px; padding: 4px 12px; }

.quick-calculator .live-total {
  position: relative;
  background: linear-gradient(160deg, var(--p-primary) 0%, var(--p-primary-deep) 100%);
  color: #fff;
  border-radius: 12px;
  border: 1px solid rgba(184, 149, 90, .5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 10px 26px rgba(var(--p-primary-deep-rgb), .18);
  padding: 24px 18px 22px;
}
.quick-calculator .live-total::before {
  content: ""; position: absolute; left: 18px; right: 18px; top: 12px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184, 149, 90, .7), transparent);
}
.quick-calculator .live-total > p { color: #e8dcc2; letter-spacing: .06em; }
.quick-calculator .live-total > strong {
  font-family: var(--p-serif); font-weight: 600; letter-spacing: .01em; color: #fff;
  font-variant-numeric: tabular-nums lining-nums; font-size: clamp(40px, 5vw, 52px); line-height: 1.5;
}
.quick-calculator .live-total strong small { font-family: var(--p-serif); font-weight: 600; color: #e8dcc2; }
.quick-calculator .live-total .live-exact { color: #d9e2dc; font-family: var(--p-serif); letter-spacing: .04em; }
.quick-calculator .live-total .net-explanation { color: #d9e2dc; }

.quick-calculator .live-flow { border: 1px solid var(--p-line); border-radius: 12px; background: var(--p-card); overflow: hidden; }
.quick-calculator .live-flow dt, body .quick-calculator .live-flow dt { color: var(--p-muted); }
.quick-calculator .live-flow dd { font-family: var(--p-serif); font-weight: 600; letter-spacing: .01em; color: var(--p-ink); font-variant-numeric: tabular-nums lining-nums; }
.quick-calculator .live-flow .tax { border-left: 1px solid var(--p-tax-line); background: var(--p-tax-soft); }
.quick-calculator .live-flow .tax dt, .quick-calculator .live-flow .tax dd, .quick-calculator .live-flow .tax small { color: var(--p-tax); }
.quick-calculator .live-bar { background: var(--p-tax); height: 10px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(31, 42, 39, .06); }
.quick-calculator .live-bar > span, .quick-calculator .live-bar > i { background: linear-gradient(90deg, var(--p-primary-deep), var(--p-primary-light)); }
.quick-calculator .live-legend { color: var(--p-muted); }
.quick-calculator .live-legend i { background: var(--p-primary); }
.quick-calculator .live-legend .tax { color: var(--p-tax); }
.quick-calculator .live-legend .tax i { background: var(--p-tax); }
.quick-calculator .live-tax-detail .tax, .quick-calculator .result-row .tax, .cash-breakdown .tax { color: var(--p-tax); }
.quick-calculator .live-tax-detail dd { font-variant-numeric: tabular-nums; }
.round-note, .flow-note, .receipt-sequence span, .frame-flow .flow-title, .frame-card .fc-note, .frame-card .fc-rule, .deemed-card .dc-p5, .deemed-card .dc-p4n, .deemed-card .dc-days, .deemed-card .dc-law, .comparison .cmp-caption, .comparison-table .cmp-same { color: var(--p-muted); }
.receipt-sequence, .add-more, .frame-card .fc-multi, .frame-card .fc-db { background: var(--p-paper); border: 1px solid var(--p-line-soft); }
.quick-calculator .pending-list li { background: var(--p-paper); border: 1px solid var(--p-line-soft); border-radius: 12px; }
.quick-calculator .pending-list span { color: var(--p-primary); }

/* 枠カード・みなしカード・次の確認 */
.frame-cards > h4 { font-size: 18px; }
.frame-card, .next-checks { background: var(--p-card); border: 1px solid var(--p-line); border-radius: 12px; box-shadow: 0 1px 3px rgba(31, 42, 39, .04); }
.frame-card h5 { font-size: 17px; }
.frame-meter { background: var(--p-tint); border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(31, 42, 39, .06); }
.frame-meter .fm-zone { background: var(--p-tint-strong); }
.frame-meter .fm-used { background: linear-gradient(90deg, var(--p-primary-deep), var(--p-primary-light)); }
.frame-meter .fm-over { background: var(--p-tax); }
.frame-meter .fm-line { background: var(--p-gold-deep); }
.frame-card .fc-frame, .frame-card .fc-rest, .comparison-table .cmp-input { color: var(--p-primary); }
.frame-flow { border-top: 1px dashed var(--p-line); }
.frame-flow p { font-variant-numeric: tabular-nums; }
.check-list li { border-top: 1px solid var(--p-line-soft); }
.check-list li::before { background: transparent; border: 1.5px solid var(--p-gold); color: var(--p-primary); font-family: var(--p-serif); font-weight: 600; }

/* 詳細の折りたたみ */
.quick-calculator .result-detail > h3 { font-size: 22px; }
.quick-calculator .result-detail > details { background: var(--p-card); border: 1px solid var(--p-line); border-radius: 12px; box-shadow: var(--p-shadow); }
body .quick-calculator .result-detail > details > summary { color: var(--p-ink); font-family: var(--p-serif); font-weight: 600; letter-spacing: .03em; font-size: 16px; }
.quick-calculator .result-detail > details[open] > summary { border-bottom: 1px solid var(--p-line-soft); margin-bottom: 8px; }
.result-row { background: var(--p-card); border: 1px solid var(--p-line-soft); border-radius: 12px; }
.result-row header { border-bottom: 1px solid var(--p-line-soft); }
.result-row dd { font-family: var(--p-serif); font-weight: 600; font-variant-numeric: tabular-nums lining-nums; color: var(--p-ink); }
.result-row .row-net dd { color: var(--p-primary); }
.summary-card, .calc-step pre { background: var(--p-paper); border: 1px solid var(--p-line-soft); }
.calc-group h4 { background: var(--p-tint); font-family: var(--p-sans); font-weight: 700; letter-spacing: 0; }
.calc-step { border-bottom: 1px dashed var(--p-line); }
.calc-step p, .calc-step .reason, .calc-step .extra, .calc-step .basis { color: var(--p-muted); }
.comparison-table thead { background: var(--p-tint); }
.comparison-table th, .comparison-table td { border-bottom: 1px solid var(--p-line-soft); }
.comparison-table tr.is-input th, .comparison-table tr.is-input td { background: var(--p-tint); }
.comparison-table tbody td { font-variant-numeric: tabular-nums; }
.quick-calculator .result-detail .comparison-table tbody td:nth-child(2) { color: var(--p-tax); }
.quick-calculator .comparison-table tr { border-color: var(--p-line-soft); }
.cash-breakdown { background: var(--p-paper); border: 1px solid var(--p-line-soft); }
.cash-net { border-top: 1px solid var(--p-line); color: var(--p-primary); }
.audit-link { color: var(--p-primary); }
.next-message { background: var(--p-tint); }

/* ---------- 7. 結果バー ---------- */
.mobile-result-bar {
  background: var(--p-card);
  color: var(--p-primary);
  border: 1px solid var(--p-gold-line);
  border-top: 3px solid var(--p-gold);
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  box-shadow: 0 -8px 28px rgba(31, 42, 39, .12);
}
.mobile-result-bar strong { color: var(--p-primary); font-family: var(--p-sans); font-weight: 700; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.mobile-result-bar[data-state="empty"] strong, .mobile-result-bar[data-state="incomplete"] strong, .mobile-result-bar[data-state="history"] strong { color: var(--p-ink); font-family: var(--p-sans); font-weight: 700; }
.mobile-result-bar[data-state="range"] strong, .mobile-result-bar[data-state="role-confirm"] strong, .mobile-result-bar[data-state="blocked"] strong, .mobile-result-bar[data-state="needs-days"] strong { color: #4a3a10; font-family: var(--p-sans); font-weight: 700; }
.mobile-result-bar .bar-action { border-radius: 10px; }

/* ---------- 8. 使い方・フッター・ダイアログ ---------- */
.help-fold { border-top: 1px solid var(--p-line); border-bottom: 1px solid var(--p-line); }
body .about .help-fold > summary { color: var(--p-ink); font-family: var(--p-serif); font-weight: 600; letter-spacing: .04em; font-size: 17px; }
.about-grid h3 { font-size: 18px; }
.about-grid p, .faq p, .disclosure > p, .disclosure > ul { color: var(--p-muted); }
.disclosure { border-bottom: 1px solid var(--p-line-soft); }
.disclosure > summary { color: var(--p-ink); }
.faq { border-top: 1px solid var(--p-line-soft); }
.site-footer { border-top: 1px solid var(--p-line); position: relative; padding-top: 30px; }
.site-footer::before { content: ""; position: absolute; left: 0; top: -1px; width: var(--p-rule-long); height: 1px; background: var(--p-gold); }
.site-footer .author-line { font-family: var(--p-serif); font-weight: 600; letter-spacing: .1em; font-size: 17px; color: var(--p-ink); }
.site-footer .fine-print, .site-footer > p { color: var(--p-muted); }
body .site-footer .verification-link { padding-block: 14px; } /* 広い画面でも押せる高さ（44px以上）。行内のままなので並びは変わらない */
dialog { background: var(--p-card); border: 1px solid var(--p-gold-line); border-top: 3px solid var(--p-gold); border-radius: 16px; box-shadow: 0 24px 80px rgba(var(--p-primary-deep-rgb), .28); }
dialog::backdrop { background: rgba(var(--p-primary-deep-rgb), .45); backdrop-filter: blur(4px); }
dialog > p { color: var(--p-muted); }
.skip-link { background: var(--p-card); border: 1px solid var(--p-gold-line); }
.noscript { background: var(--p-gold-soft); }
.no-receipts { color: var(--p-muted); }
.next-checks h4 { font-size: 18px; }

/* 太字（見出し以外）は本文の書体のまま */
.quick-calculator .empty-result strong, .quick-calculator .summary-line strong, .receipt-sequence, .frame-card .fc-status { font-family: var(--p-sans); }

/* ---------- 9. 幅ごとの調整 ---------- */
@media (max-width: 900px) {
  .mobile-result-bar { border-left: 0; border-right: 0; border-radius: 0; border-top: 3px solid var(--p-gold); }
  .mobile-result-bar span, .mobile-result-bar strong { color: var(--p-primary); }
}

@media (max-width: 650px) {
  .site-header { min-height: 72px; }
  .brand > span { font-size: 19px; }
  .brand > .brand-monogram { width: 40px; height: 40px; font-size: 21px; }
  .header-link { max-width: 5.2em; line-height: 1.5; }
  .hero { padding-block: 22px 16px; }
  .hero h1 { font-size: 23px; letter-spacing: .05em; }
  .hero-lead { font-size: 16px; }
  .hero-art { padding: 3px; border-radius: 10px; }
  .hero-art img { border-radius: 7px; }
  .hero-points-title { font-size: 18px; }
  .point-list li { font-size: 16px; }
  .quick-calculator .scheme-panel, .quick-calculator .receipt-card { padding: 20px 14px; }
  .quick-calculator .scheme-panel h3 { font-size: 19px; }
  .quick-calculator .entry-heading { font-size: 18px; }
  .quick-calculator .receipt-heading h3 { font-size: 18px; }
  .quick-calculator .live-panel { padding: 20px 16px; }
  .quick-calculator .live-heading h3 { font-size: 20px; }
  .quick-calculator .live-total { padding: 20px 12px 18px; }
  .quick-calculator .live-total > strong { font-size: 42px; }
  .quick-calculator .result-detail > h3 { font-size: 20px; }
  .frame-card h5 { font-size: 16px; }
  .result-row .row-net { background: var(--p-tint); }
  body .about .help-fold > summary { font-size: 16px; }
  .site-footer .author-line { font-size: 16px; }
}

@media (max-width: 370px) {
  .site-header { flex-wrap: wrap; padding-bottom: 6px; }
  .site-header .header-link { max-width: none; width: 100%; justify-content: flex-end; text-align: right; margin-top: -8px; }
  .hero h1 { font-size: 20px; }
  .quick-calculator .scheme-panel, .quick-calculator .receipt-card { padding: 18px 12px; }
  .quick-calculator .live-total > strong { font-size: 36px; }
  .brand > span { font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .button:hover { transform: none; }
}

}