/* OS の配色設定に追従する全ページ共通テーマ。各ページの CSS の後に読み込む。
   印刷にはこのテーマを適用しない。文字のアクセントと白文字ボタンの背景は分ける。 */
@media screen and (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --ink: #e9f1fc;
    --text: #e9f1fc;
    --fg: #e9f1fc;
    --ink-mid: #b6c7e1;
    --ink-soft: #9aafcb;
    --muted: #9aafcb;
    --line: #294260;
    --line-soft: #223650;
    --border: #294260;
    --paper: #0a1524;
    --bg: #0a1524;
    --paper-warm: #0f1e33;
    --card: #12233c;
    --accent: #8dbbff;
    --accent-deep: #1764be;
    --accent-soft: #14294a;
    --a: #1764be;
    --ad: #8dbbff;
    --blue: #1764be;
    --green: #4fd6bd;
    --green-deep: #087c68;
    --green-soft: #0d2b27;
    --red: #ffaaa2;
    --red-soft: #361c20;
    --err: #ffaaa2;
    --danger: #ffaaa2;
    --ok: #4fd6bd;
    --warn: #e9c565;
    --gold: #f5b733;
    --gold-soft: #31270e;
    --gold-ink: #e9c565;
    --scrim: rgba(2,6,12,.7);
    --nav-bg: rgba(13,24,40,.96);
    --dark-button: #1764be;
    --dark-link: #8dbbff;
    --dark-danger-button: #a62d27;
    --shadow: 0 10px 28px rgba(0,0,0,.25);
  }
  html, body { background: var(--bg); color: var(--ink); }
  html[data-page] :is(input, select, textarea):not(:where([type=checkbox],[type=radio],[type=range],[type=submit],[type=button],[type=hidden])) {
    color: var(--ink);
    background-color: var(--paper-warm);
    border-color: var(--line);
  }
  input, select, textarea { accent-color: var(--dark-link); }
  input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
  input:disabled, select:disabled, textarea:disabled { color: var(--muted); -webkit-text-fill-color: var(--muted); }
  :is(input, select, textarea):focus-visible { outline-color: var(--dark-link); }
  html[data-page=hospital-redirect] pre { background: var(--paper-warm); color: var(--ink); }
  #hint, .page-loading { color: var(--muted); }

  /* 規約・お知らせなどの既存ドキュメントテーマを補完 */
  html:is([data-page=terms],[data-page=privacy],[data-page=pricing],[data-page=news],[data-page=faq],[data-page=company],[data-page=contact],[data-page=disclosure],[data-page=operation-rules],[data-page="404"]) {
    --accent-deep: var(--dark-link);
  }
  .doc-header { background: var(--paper-warm); border-color: var(--line); }
  html[data-page="404"] .nf-btn { background: var(--dark-button); color: #fff; }
  html[data-page="404"] .nf-btn:hover { background: #12539f; }

  /* ログイン・転送・登録メール確認 */
  html[data-page=line-callback] .card,
  html[data-page=verify-registration] .card { background: var(--card); border-color: var(--line); }
  html[data-page=line-callback] .title { color: var(--ink); }
  html[data-page=line-callback] .msg,
  html[data-page=verify-registration] p,
  html[data-page=verify-registration] .status { color: var(--ink-mid); }
  html[data-page=verify-registration] .mark,
  html[data-page=verify-registration] .btn.secondary { background: var(--accent-soft); color: var(--dark-link); }
  html[data-page=line-callback] .btn-home,
  html[data-page=verify-registration] .btn:not(.secondary),
  html[data-page=logout] .btn { background: var(--dark-button); color: #fff; }

  /* 独立した募集・勤務履歴ページ */
  html:is([data-page=forms],[data-page=works]) :is(.head,.search,.select,.btn,.store-scope,.view-btn,.cal,.card,.btn-plain,.notice,.error,.survey-url-copy) {
    background: var(--card);
    border-color: var(--line);
  }
  html:is([data-page=forms],[data-page=works]) :is(.btn-primary,.view-btn--active,.cal-cell--selected,.cal-count),
  html[data-page=forms] .admin-switch button.active,
  html[data-page=works] .survey-url-copy.copied { background: var(--dark-button); color: #fff; }
  html:is([data-page=forms],[data-page=works]) .cal-cell--selected { background: var(--dark-button) !important; }
  html[data-page=forms] .admin-switch button { background: var(--card); }
  html:is([data-page=forms],[data-page=works]) .cal-cell--past { color: var(--muted); }
  html:is([data-page=forms],[data-page=works]) .cal-cell--selected .cal-count { background: var(--card); color: var(--dark-link); }
  html[data-page=forms] .applied-badge { background: var(--red-soft); color: var(--red); }
  html[data-page=works] :is(.btn-print,.btn-survey-url):hover { background: var(--accent-soft); }
  html[data-page=works] :is(.print-modal,.print-bar,.print-bar button,.print-foot button) { background: var(--card); color: var(--ink); border-color: var(--line); }
  html[data-page=works] .print-bar button.primary { background: var(--dark-button); color: #fff; }
  html[data-page=works] :is(.ps-grp td,.ps-sub-row td) { background: var(--paper-warm); }
  html[data-page=works] .ps-total-row td { background: var(--dark-button); color: #fff; }

  /* 旧一覧・詳細ページも直接アクセス時に同じ配色へ */
  html:is([data-page=sheet-view],[data-page=hospital-hope-view],[data-page=jobs-long]) :is(.notice,.error,.search,.btn,.empty,.tool-block,.select,.kv) {
    background: var(--card); color: var(--ink); border-color: var(--line);
  }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view],[data-page=jobs-long]) :is(.who,.count,.no-block,.job-id-text,.toggle-label,.meta) { color: var(--muted); }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view],[data-page=jobs-long]) :is(.role-label,.right-title,.v) { color: var(--ink); }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view],[data-page=jobs-long]) :is(.pill,.job-badge,.matched-badge,.tool-label) { background: var(--accent-soft); color: var(--dark-link); }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view]) .card.matched { background: var(--paper-warm); }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view]) .card.adjusting { background: var(--gold-soft); }
  html:is([data-page=sheet-view],[data-page=hospital-hope-view]) .adjusting-badge { background: var(--green-soft); color: var(--green); }
  html[data-page=sheet-view] .apply-btn { background: var(--green-deep); }
  html[data-page=mypage] :is(.card,.stat-box) { background: var(--card); }
  html[data-page=mypage] :is(.page-title,.card-label,.info-table td,.stat-label) { color: var(--ink); }
  html[data-page=mypage] :is(.info-table th,.back-link,.score-count,.score-empty) { color: var(--ink-mid); }
  html[data-page=mypage] .status-ok { background: var(--green-soft); color: var(--green); }
  html[data-page=mypage] .status-pending { background: var(--gold-soft); color: var(--gold-ink); }

  /* 在庫・備品 */
  html:is([data-page=dead-stock],[data-page=fixtures]) :is(.store-scope,.tab-btn,.search,.btn-sub,.btn-gray,.empty,.modal,.filter-chip,.like-btn) {
    background: var(--card); border-color: var(--line);
  }
  html:is([data-page=dead-stock],[data-page=fixtures]) :is(.tab-btn.active,.filter-chip.active,.btn:not(.btn-sub):not(.btn-gray)) { background: var(--dark-button); color: #fff; }
  html[data-page=dead-stock] :is(.badge-talking,.badge-exp-mid),
  html[data-page=fixtures] .mock-note { color: var(--gold-ink); }
  html[data-page=dead-stock] .badge-done { background: var(--paper-warm); }
  html[data-page=dead-stock] .badge-mine { color: var(--green); }

  /* ホームと後から挿入される SPA パネル。高詳細度の既存ルールも考慮する。 */
  html[data-page=home] :is(.big-btn,.small-btn,.tab-btn.active),
  html[data-page=home] #spa-root :is(.lp-apply-btn,.lp-view-btn--active,.lp-cal-count,.jp-apply-btn,.ch-send,.ch-create-btn),
  html[data-page=home] :is(.ch-copy-btn:not(.ch-copy-btn--ghost),.ch-modal-btn:not(.ch-modal-btn--ghost):not(.ch-modal-btn--danger)) { background: var(--dark-button); color: #fff; }
  html[data-page=home] #spa-root .lp-cal-cell--selected { background: var(--dark-button) !important; color: #fff; }
  html[data-page=home] #spa-root .lp-cal-cell--selected .lp-cal-count { background: var(--card); color: var(--dark-link); }
  html[data-page=home] #spa-root #panel-chat .ch-msg--mine .ch-bubble { background: var(--dark-button); border-color: var(--dark-button); }
  html[data-page=home] .role-badge-item--admin,
  html[data-page=home] #spa-root #panel-mypage .mp-role-badge--admin { background: var(--dark-danger-button); border-color: var(--dark-danger-button); }
  html[data-page=home] :is(.ch-menu-item--danger,.ch-retract-tag,.ch-flag),
  html[data-page=home] #panel-chat :is(.ch-retract-tag,.ch-flag),
  html[data-page=home] #spa-root .ch-err { color: var(--red); }
  html[data-page=index] .prep-chip { background: var(--paper-warm); color: var(--ink-mid); border-color: var(--line); }
  html[data-page=index] .prep-chip b,
  html[data-page=index] .prep-chip > b:first-child { color: var(--ink); }
  html[data-page=index] { --accent-deep: var(--dark-link); --green-deep: var(--green); }
  html[data-page=index] .gnav-cta { background: var(--dark-button); color: #fff; }
  html[data-page=index] .gnav-cta:hover { background: #12539f; }
  html[data-page=dead-stock] .badge-open,
  html[data-page=fixtures] :is(.badge-cat,.like-btn.liked) { color: var(--dark-link); }
  html[data-page=fixtures] .badge-price { color: var(--green); }
  html:is([data-page=dead-stock],[data-page=fixtures]) #toast { background: #22395c; color: var(--ink); }
  html[data-page=home] #spa-root #panel-list .lp-apply-btn,
  html[data-page=home] #spa-root #panel-jobs .jp-apply-btn { background: var(--dark-button); color: #fff; }
  /* 通知の確認ボタンは既存のインライン色を上書きする。 */
  html[data-page=home] #__notice_modal_ok__ { background: var(--dark-button) !important; }
}

/* Native workflow forms, including their shared confirmation and time controls. */
@media screen and (prefers-color-scheme: dark) {
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(header, .top, .survey-header) {
    background: rgba(15, 30, 51, .97);
    border-color: var(--line);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(header a, .top a, .back) { color: var(--dark-link); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.card, .survey-card) {
    background: var(--card);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.badge, .survey-preview) {
    background: var(--gold-soft);
    color: var(--gold-ink);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.spinner, .survey-spinner) {
    border-color: var(--line);
    border-top-color: var(--accent);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.summary div, .summary .wide, .slot, .condition, .term, .work-item) {
    background: var(--paper-warm);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.branch, .note, .notice, .admin-detail, .privacy-note) {
    background: var(--paper-warm);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(input, select, textarea):not(:where([type="radio"],[type="checkbox"],[type="hidden"])) {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--line);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(input, select, textarea):focus {
    outline-color: var(--accent);
    border-color: var(--accent);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(input[type="radio"], input[type="checkbox"]) { accent-color: var(--dark-button); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.choice, .reason, .confirm):has(input:checked) {
    background: var(--accent-soft);
    border-color: var(--accent);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.choice, .reason, .confirm):has(input:focus-visible) {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.secondary, .secondary-link) {
    color: var(--dark-link);
    background: var(--paper-warm);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.secondary, .secondary-link):hover { background: var(--accent-soft); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.submit, .submit-button) {
    color: #fff;
    background: var(--dark-button);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(.submit, .submit-button):hover { background: #1d70ca; }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) :is(button, a):focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }
  html[data-page="hope"] .remove { background: var(--paper-warm); }
  html[data-page="hope"] .add {
    background: var(--accent-soft);
    border-color: var(--accent);
  }
  html[data-page="hope"] .add:hover { background: #1b365a; }
  html[data-page="recruit"] .duration-notice,
  html[data-page="cancel"] .flow-note {
    color: var(--gold-ink);
    background: var(--gold-soft);
    border-color: #756329;
  }
  html[data-page="final-confirm"] :is(small, .condition span:first-child) { color: var(--muted); }
  html[data-page="final-confirm"] .status-note { color: var(--ink-mid); background: var(--accent-soft); }
  html[data-page="offer-accept"] .success { color: var(--green); }
  html[data-page="offer-accept"] button { background: var(--dark-button); }
  html[data-page="offer-accept"] button:hover { background: #1d70ca; }
  html[data-page="cancel"] .confirm {
    background: var(--red-soft);
    border-color: #83514e;
  }
  html[data-page="cancel"] .confirm:has(input:checked) { border-color: var(--red); }
  html[data-page="cancel"] button { color: #fff; background: #a13a31; }
  html[data-page="cancel"] button:hover { background: #b1453b; }
  html[data-page="survey"] {
    --survey-accent: var(--dark-button);
    --survey-accent-dark: var(--dark-link);
    --survey-bg: var(--paper);
    --survey-card: var(--card);
    --survey-line: var(--line);
    --survey-text: var(--ink);
    --survey-muted: var(--muted);
    --survey-error: var(--red);
    --survey-success: var(--green);
  }
  html[data-page="survey"] .rating-option span {
    color: var(--dark-link);
    background: var(--paper);
    border-color: var(--line);
  }
  html[data-page="survey"] .rating-option input:checked + span {
    color: #fff;
    background: var(--dark-button);
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent);
  }
  html[data-page="survey"] .rating-option input:focus-visible + span {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog {
    color: var(--ink);
    background: var(--card);
    border-color: var(--line);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog::backdrop { background: rgba(0, 0, 0, .65); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-eyebrow { color: var(--dark-link); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-description { color: var(--muted); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-slots li {
    background: var(--paper-warm);
    border-color: var(--line);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions button {
    color: var(--dark-link);
    background: var(--paper-warm);
    border-color: var(--line);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions button:hover { background: var(--accent-soft); }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions .confirm-primary {
    color: #fff;
    background: var(--dark-button);
    border-color: var(--dark-button);
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions .confirm-primary:hover { background: #1d70ca; }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions .confirm-danger {
    color: #fff;
    background: #a13a31;
    border-color: #a13a31;
  }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions .confirm-danger:hover { background: #b1453b; }
  html:is([data-page="apply"], [data-page="hope"], [data-page="recruit"], [data-page="offer-entry"], [data-page="final-confirm"], [data-page="cancel"], [data-page="offer-accept"], [data-page="survey"]) .confirm-dialog .confirm-actions button:focus-visible { outline-color: var(--accent); }

  html:is([data-page="hope"], [data-page="recruit"]) .time-select .time-select-button,
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-list {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--line);
  }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-list { box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select .time-select-button:focus-visible {
    outline-color: var(--accent);
    border-color: var(--accent);
  }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select .time-select-button[aria-invalid=true] { border-color: var(--red); }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-option { color: var(--ink); }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-option[aria-selected=true] { background: var(--accent-soft); }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-option[data-active=true] { color: #fff; background: var(--dark-button); }
  html:is([data-page="hope"], [data-page="recruit"]) .time-select-error { color: var(--red); }
}

/* Public guides and landing pages retain their blue/green brand accents. */
@media screen and (prefers-color-scheme: dark) {
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) {
    --accent-deep: var(--accent);
    --marketing-band: #0f1c2e;
    --purple: #c6b4ff;
  }
  html:is([data-page="guide-pharmacy"], [data-page="vision-pharmacy"], [data-page="lp-pharmacy-v2"]) {
    --accent: #4fd6bd;
    --accent-soft: #0d2b27;
    --dark-button: #087c68;
    --dark-link: #4fd6bd;
    --marketing-band: #0e2420;
  }

  /* Fixed navigation, dropdowns and small cards had literal white surfaces. */
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) :is(.gnav.scrolled, .cta-wrap) {
    background: rgba(15, 30, 51, .94);
    border-color: var(--line);
  }
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) :is(.pgdrop-menu, .req-item, .rule-item .tag) {
    background: var(--card);
    border-color: var(--line);
  }
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) .pgdrop-num {
    background: var(--paper-warm);
  }
  html:is([data-page="vision-hospital"], [data-page="vision-pharmacy"]) .rule-item .tag.goal {
    background: var(--dark-button);
    border-color: var(--dark-button);
    color: #fff;
  }

  /* These bands intentionally use white type over a dark brand background. */
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) :is(.marquee, .interlude, .solution-band, .gnav-cta, .last-cta-btn) {
    background: var(--marketing-band);
    color: #fff;
  }
  html[data-page="lp-hospital-v2"] .first-check {
    background: var(--marketing-band) !important;
    color: #fff;
  }
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) :is(.cta-btn, .series-now, .pgdrop-item.current b, .pgdrop-item em, .scene-soon, .badge-free, .cc-badge, .lc-head, .lc-send, .lc-row.me .lc-bub, .rl-tab.on, .dp-panel.is-us .dp-tag) {
    background: var(--dark-button);
    border-color: var(--dark-button);
    color: #fff;
  }
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) :is(.gnav-cta, .last-cta-btn, .cta-btn):hover {
    background: var(--dark-button);
    color: #fff;
  }
  html:is([data-page="guide-hospital"], [data-page="guide-pharmacy"], [data-page="vision-hospital"], [data-page="vision-pharmacy"], [data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) .cta-btn.registered {
    background: #294260;
    color: #b6c7e1;
    box-shadow: none;
  }
  html:is([data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) details[open] .q-arrow {
    background: var(--dark-button);
    border-color: var(--dark-button);
    color: #fff;
  }
  html:is([data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) .prep-chip {
    background: var(--paper-warm);
    border-color: var(--line);
    color: var(--ink-mid);
  }
  html:is([data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) .prep-chip b {
    color: var(--ink);
  }
  html:is([data-page="lp-hospital-v2"], [data-page="lp-pharmacy-v2"]) .prep-chip > b:first-child {
    color: var(--ink-soft);
  }
  html[data-page="lp-hospital-v2"] .rl-badge.open {
    background: var(--card);
  }
  html[data-page="lp-hospital-v2"] .lp-modal-close.dark {
    background: var(--line);
    color: var(--ink);
  }
  html[data-page="lp-hospital-v2"] .lp-modal-close.dark:hover {
    background: #36577d;
  }

  /* Fee revision: tabs, generated topic cards, checklists and feedback states. */
  html[data-page="fee-revision"] {
    --accent-deep: var(--accent);
  }
  html[data-page="fee-revision"] :is(.doc-header, .rev-strip, .tab-btn, .filter-chip, .card, .check-progress-card, .like-btn, .check-box) {
    background: var(--card);
    border-color: var(--line);
  }
  html[data-page="fee-revision"] :is(.tab-btn.active, .btn, .filter-chip.active) {
    background: var(--dark-button);
    border-color: var(--dark-button);
    color: #fff;
  }
  html[data-page="fee-revision"] :is(.badge-imp-mid, .mock-note) {
    background: var(--gold-soft);
    color: var(--gold-ink);
    border-color: #66532a;
  }
  html[data-page="fee-revision"] :is(.badge-imp-info, .check-bar) {
    background: var(--paper-warm);
  }
  html[data-page="fee-revision"] :is(.check-group-title, .check-item) {
    border-color: var(--line);
  }
  html[data-page="fee-revision"] .check-item:hover {
    background: var(--paper-warm);
  }
  html[data-page="fee-revision"] .check-item.done .check-box {
    background: var(--green-deep);
    border-color: var(--green);
  }
  html[data-page="fee-revision"] .like-btn.liked {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
  }
  html[data-page="fee-revision"] #toast {
    background: #22395c;
    color: var(--ink);
    border: 1px solid var(--line);
  }
}