/* ============================================================
   夜の配色（2026-10-10、ユーザー指示。店舗管理画面の全体に効かせる）
   ============================================================
   ・<html> に is-dark が付いているときだけ効きます。付け外しは admin-theme.js（この端末に覚える）だけが行います。
   ・このファイルは index.php と legal/index.php で【最後】に読みます。ほかのスタイルシートの直書きの色を上書きするためです。
   ・色の決め方は2段です。
     1. 色の変数（--ink・--card など）を夜の値に切り替える。変数で色を取っている所は、これだけで夜になります。
     2. 変数を使わずに色を直書きしている所（明るい背景・濃い文字・明るい枠線）と、
        変数を逆向きに使っている所（background: var(--ink) に白文字＝選択中の白抜き など）を、1か所ずつ上書きする。
   ・★上書きは :where(:root.is-dark) <元のセレクタ> と書きます。:where() は詳細度を足さないので、元の規則と同じ強さになり、
     後から読むこちらが元の規則にだけ勝ちます。:root.is-dark を素で頭に付けると、選択中・チェック済みなど
     「本来は勝つはずの状態の規則」にまで勝ってしまい、夜だけ選んだ印が消えます。
   ・★上書きは元のファイル順・元の書き順に並べ、元が @media の中なら同じ @media で包みます（同じ強さの規則どうしの勝ち負けを、昼と同じにするため）。
   ・★明るい色を直書きした面・濃い色を直書きした文字を、ほかのスタイルシートに足したら、ここにも上書きを足してください。
     足し忘れは tests/Frontend/ShopAdminDarkThemeCoverageTest.php が落とします。
   ・夜でも白のままにするもの: QRコードの画像（読み取りのため）、スイッチのつまみ、商品写真、黄色の帯の上の濃い文字。
   ・印刷は常に昼の配色です（下の色はすべて @media screen の中。売上の window.print() もこの画面から印刷します）。
   ・明細書 /shop-admin/invoice/・テーブルQR印刷 /shop-admin/table-qr/ は紙の見本なので、このファイルを読みません。 */

/* ---- 切替ボタン（ヘッダー。index.php の .theme-toggle）。形は昼夜共通です ----
   561px以上はアイコンだけ（テキストのボタンが5つ並ぶと、561〜730pxでヘッダーが2段に折り返すため）。
   560px以下はハンバーガーの中（admin.css の .header-menu）なので、文字も出します。読み上げ用の名前は aria-label です。 */
.theme-toggle {
    gap: 8px;
}

.theme-toggle svg {
    flex: none;
    height: 20px;
    width: 20px;
}

.theme-toggle-sun,
:root.is-dark .theme-toggle-moon {
    display: none;
}

:root.is-dark .theme-toggle-sun {
    display: block;
}

@media (min-width: 561px) {
    .theme-toggle {
        padding: 12px;
    }

    .theme-toggle-label {
        clip-path: inset(50%);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
        width: 1px;
    }
}

@media screen {

    /* ---- 1. 色の変数 ----
       面は 2026-10-07 の「注文・予約」の夜の配色と同じ値です（地 #101514・面 #182120・線 #2a3634・文字 #e9eeec・薄い文字 #a7b6b1）。
       --brand は主ボタンの地と枠に使うのでそのまま。文字に使っている所だけ、下の「4. 細かい所」で明るい緑にします。
       --brand-dark・--danger は文字に多く使うので明るくし、地に使っている所は 2 の上書きで値を持ちます。
       color-scheme: dark で、日付欄・プルダウン・スクロールバーなどブラウザが描く部品も暗くなります。 */
    :root.is-dark {
        color-scheme: dark;
        --ink: #e9eeec;
        --muted: #a7b6b1;
        --brand-dark: #6fd3b8;
        --paper: #101514;
        --card: #182120;
        --line: #2a3634;
        --danger: #f28b82;
        --warning: #e6b450;
        --shadow: 0 12px 30px rgba(0, 0, 0, .45);
    }

    /* ---- 2. 直書きの色の上書き（元のファイル順・元の書き順） ----
       白・灰の面 → 面 var(--card)／一段沈んだ面 #121918／一段浮いた面 #22302d。入力欄は #0f1413、ボタンは #1f2a28。
       色味のある面は、色相ごとに 地／枠／文字 をそろえます。
         緑 #0f2a23／#2e6b5a／#7fe0c4・琥珀 #2b2210／#7a5a1c／#f2c46b・赤 #2e1616／#7a3030／#f4a3a3
         紫 #221a33／#5a4785／#c9b5f2・青 #13213a／#34558a／#a9c8f5・灰の文字 #c3cfcb（ラベル）／#a7b6b1（薄い文字）
       選択中の白抜き（昼は濃い地に白文字）は、明るい地 #e9eeec に暗い文字 #101514 へ反転します。
       赤を地に使う所は #c23b3b、濃い緑を地に使う所は #075b4e（どちらも白文字のまま）。 */

    /* ---- admin.css ---- */
    :where(:root.is-dark) .app-header {
        background: rgba(24, 33, 32, .96);
    }

    :where(:root.is-dark) .badge {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .badge.on {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .badge.off {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) button,
    :where(:root.is-dark) .button-link {
        background: #22302d;
        color: #8fdcc6;
    }

    :where(:root.is-dark) .primary:hover {
        background: #075b4e;
    }

    :where(:root.is-dark) .ghost {
        background: #1f2a28;
        border-color: #364441;
    }

    :where(:root.is-dark) .danger {
        background: #2e1616;
    }

    :where(:root.is-dark) .tabs button.active {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .channel-card {
        background: var(--card);
    }

    :where(:root.is-dark) .channel-card.master {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) label {
        color: #c3cfcb;
    }

    :where(:root.is-dark) input,
    :where(:root.is-dark) select,
    :where(:root.is-dark) textarea {
        border-color: #3d4b48;
        background: #0f1413;
    }

    :where(:root.is-dark) .product-image {
        background: #22302d;
    }

    :where(:root.is-dark) .mode-box {
        background: #121918;
    }

    :where(:root.is-dark) .message {
        background: #2b2210;
        color: #f2c46b;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .billing-banner {
        border-color: #7a3030;
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .billing-card-note {
        color: #f4a3a3;
    }

    :where(:root.is-dark) .contract-menu>summary {
        background: #1f2a28;
    }

    :where(:root.is-dark) .contract-status {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .contract-status.good {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .contract-status.warn {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .contract-status.stop {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .contract-note {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .table-order-summary {
        background: #121918;
    }

    :where(:root.is-dark) .table-order-summary-label {
        color: #c3cfcb;
    }

    :where(:root.is-dark) button.table-order-summary {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) button.table-order-summary:hover {
        background: #0f2a23;
    }

    :where(:root.is-dark) .table-orders-summary div {
        background: #121918;
    }

    :where(:root.is-dark) .table-orders-summary span {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .table-order-card.is-unpaid {
        border-color: #7a5a1c;
        background: #2b2210;
    }

    :where(:root.is-dark) .table-order-payment.is-unpaid {
        color: #f2c46b;
    }

    :where(:root.is-dark) .table-settle-box {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) .table-settle-box>strong {
        color: #7fe0c4;
    }

    :where(:root.is-dark) .square-review-banner {
        border-color: #2e6b5a;
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .order-sound-bar {
        border-color: #7a5a1c;
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .publication-bar {
        border-color: #7a5a1c;
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .publication-bar.is-unsaved {
        border-color: #7a3030;
        background: #2e1616;
        color: #f4a3a3;
    }

    /* 鈴の赤い点。夜の --danger は文字用に明るいピンクなので、点は赤の地の色を持ちます。 */
    :where(:root.is-dark) .publication-bell.is-unsaved .publication-bell-dot {
        background: #c23b3b;
    }

    :where(:root.is-dark) .publication-bar.is-clear {
        border-color: var(--line);
        background: var(--card);
        color: var(--ink);
    }

    :where(:root.is-dark) .tab-badge {
        background: #c23b3b;
    }

    @media(min-width:761px) {
        :where(:root.is-dark) body.has-side-nav .side-nav {
            background: rgba(24, 33, 32, .96);
        }
    }

    @media(min-width:761px) {
        :where(:root.is-dark) body.has-side-nav.side-nav-collapsed :is(.tabs button,.side-nav-toggle):is(:hover,:focus-visible) .tab-label {
            background: #e9eeec;
            color: #101514;
        }
    }

    /* 全画面の引き出しの後ろの幕（2026-10-14）。夜は地が暗いので、幕を濃くしないと引き出しとの境目が見えません。 */
    :where(:root.is-dark) .fullscreen-scrim {
        background: rgba(0, 0, 0, .55);
    }

    /* ---- admin-hours.css ---- */
    :where(:root.is-dark) .hours-row.is-disabled {
        background: #121918;
    }

    :where(:root.is-dark) .hours-day-status.open {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .hours-day-status.closed {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .hours-day-status.warning {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .special-row.is-closed {
        background: #121918;
        border-color: #7a3030;
    }

    :where(:root.is-dark) .hours-note {
        background: #0f2a23;
        border-color: #2e6b5a;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .time-range.is-invalid input[type="time"] {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    /* ---- admin-settings.css ---- */
    /* ポップアップの土台（.confirm-dialog）は背景を指定しておらず、ブラウザ既定の色になるので明示します。
       ::backdrop は var() を受け取らない Safari があるので、色は値で書きます。 */
    :where(:root.is-dark) .confirm-dialog {
        background: var(--card);
        box-shadow: 0 24px 70px rgba(0, 0, 0, .6);
    }

    :where(:root.is-dark) .confirm-dialog::backdrop {
        background: rgba(0, 0, 0, .66);
    }

    :where(:root.is-dark) .slot-group {
        background: #121918;
    }

    :where(:root.is-dark) .slot-group-head > span {
        background: #0f2a23;
    }

    :where(:root.is-dark) .slot-notes {
        background: #0f2a23;
    }

    :where(:root.is-dark) .slot-notes li {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .legal-gate-note {
        background: #2b2210;
    }

    :where(:root.is-dark) .legal-gate-note p {
        color: #f2c46b;
    }

    :where(:root.is-dark) .legal-checklist .is-done {
        background: #0f2a23;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .field-wide textarea {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .legal-preview {
        background: #121918;
    }

    :where(:root.is-dark) .policy-note {
        background: #0f2a23;
    }

    :where(:root.is-dark) .policy-note li {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .legal-summary-list {
        background: #1f2a28;
    }

    :where(:root.is-dark) .legal-edit {
        background: #121918;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .legal-edit-lead {
        background: var(--card);
    }

    :where(:root.is-dark) .legal-disclosure-choice {
        background: #1f2a28;
    }

    :where(:root.is-dark) .legal-disclosure-option {
        background: #1f2a28;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .legal-disclosure-option:has(input:checked) {
        background: #0f2a23;
    }

    :where(:root.is-dark) .confirm-dialog .confirm-note {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .legal-gate-note.is-downgraded {
        background: #2e1616;
    }

    :where(:root.is-dark) .legal-gate-note .legal-gate-downgraded {
        border-bottom-color: #7a3030;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .invoice-number-prefix {
        background: #121918;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .postal-candidate-field {
        background: #121918;
    }

    :where(:root.is-dark) .order-page-link input {
        background: #0f1413;
        border-color: #3d4b48;
        color: #e9eeec;
    }

    :where(:root.is-dark) .information-alerts {
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .information-alert-list li {
        background: #2b2210;
    }

    :where(:root.is-dark) .information-alert-list li p {
        color: #f2c46b;
    }

    :where(:root.is-dark) .information-alert-list.is-seen li {
        background: #121918;
        border-left-color: #3d4b48;
    }

    :where(:root.is-dark) .channel-card.is-unavailable {
        background: #121918;
    }

    :where(:root.is-dark) .role-launcher-choice {
        background: #1f2a28;
    }

    /* ---- admin-catalog.css ---- */
    :where(:root.is-dark) .exclusive-price-field {
        background: #121918;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .selling-price-field {
        background: #121918;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .product-categories {
        background: #121918;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .price-input > span {
        background: #0f2a23;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .selling-price-field {
        background: var(--card);
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .option-choice-row {
        background: #121918;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .product-options {
        background: #121918;
        border-color: #34558a;
    }

    :where(:root.is-dark) .subtabs {
        background: #22302d;
    }

    :where(:root.is-dark) .subtabs button[aria-selected="true"] {
        background: #33423f;
    }

    :where(:root.is-dark) .sold-out-restored {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .menu-channel-default {
        background: #0f2a23;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .pricing-policy .badge.warn {
        background: #2b2210;
    }

    :where(:root.is-dark) .pricing-choice legend {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .pricing-migration-notice {
        background: #2b2210;
        border-color: #7a5a1c;
        color: #f2c46b;
    }

    :where(:root.is-dark) .pricing-change-table thead th {
        background: #121918;
    }

    :where(:root.is-dark) .acc-thumb {
        background: #22302d;
    }

    :where(:root.is-dark) .acc-mark {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .acc-row.is-open {
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .qa-steps li {
        background: #121918;
    }

    :where(:root.is-dark) .qa-step-number {
        background: var(--card);
    }

    :where(:root.is-dark) .qa-steps li.is-done {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .qa-group {
        background: var(--card);
    }

    :where(:root.is-dark) .qa-fieldset legend {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .qa-course-row {
        background: var(--card);
    }

    :where(:root.is-dark) .qa-course-row.is-picked {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) .qa-new-option {
        border-color: #2e6b5a;
        background: #1f2a28;
    }

    :where(:root.is-dark) .qa-error {
        background: #2e1616;
    }

    :where(:root.is-dark) .qa-result {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) .qa-result.is-error {
        border-color: #7a5a1c;
        background: #2b2210;
    }

    :where(:root.is-dark) .qa-warning {
        border-color: #7a5a1c;
        background: #2b2210;
    }

    :where(:root.is-dark) .qa-restricted-note {
        background: #2e1616;
    }

    :where(:root.is-dark) .qa-image img {
        background: #22302d;
    }

    :where(:root.is-dark) .qa-preview-card {
        background: var(--card);
    }

    :where(:root.is-dark) .qa-preview-card img {
        background: #22302d;
    }

    :where(:root.is-dark) .ba-row.is-error input {
        background: #2e1616;
    }

    :where(:root.is-dark) .ba-new {
        background: #0f2a23;
        color: #7fe0c4;
    }

    /* ---- admin-sort.css ---- */
    :where(:root.is-dark) .sort-row {
        background: var(--card);
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .sort-row.is-sold-out {
        background: #2e1616;
        border-color: #7a3030;
    }

    :where(:root.is-dark) .sort-row.is-sold-out .sort-label,
    :where(:root.is-dark) .sort-row.is-sold-out .acc-label {
        color: #f2c46b;
    }

    /* ---- admin-boards.css ---- */
    :where(:root.is-dark) .board-warning {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .board-selection {
        background: #0f2a23;
        border-color: #2e6b5a;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .board-count,
    :where(:root.is-dark) .board-badge,
    :where(:root.is-dark) .board-mark {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .board-count.is-empty,
    :where(:root.is-dark) .board-badge.warn {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .board-mark.sold-out {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .board-handle[aria-pressed="true"] {
        background: #075b4e;
        box-shadow: 0 0 0 3px #2e6b5a;
    }

    :where(:root.is-dark) .board-card.is-unlinked {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .board-remove {
        background: #2e1616;
    }

    :where(:root.is-dark) .board-drag-tip {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .is-drop-target {
        background: #0f2a23;
    }

    :where(:root.is-dark) .is-drop-denied {
        background: #2e1616;
    }

    :where(:root.is-dark) .board-chip {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .board-course-field {
        color: #7fe0c4;
    }

    :where(:root.is-dark) .link-undo {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .board-source-card.is-picked {
        background: #0f2a23;
    }

    :where(:root.is-dark) .board-course-tool-label {
        color: #c3cfcb;
    }

    /* ---- admin-staff.css ---- */
    :where(:root.is-dark) .staff-role-badge,
    :where(:root.is-dark) .staff-status {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .staff-invite-form {
        border-color: #3d4b48;
        background: #121918;
    }

    :where(:root.is-dark) .staff-invite-form label {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .staff-invite-form input,
    :where(:root.is-dark) .staff-invite-link input {
        border-color: #3d4b48;
        background: #0f1413;
        color: #e9eeec;
    }

    :where(:root.is-dark) .staff-invite-qr,
    :where(:root.is-dark) .staff-invite-link {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) .staff-invite-qr p {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .staff-security-note,
    :where(:root.is-dark) .staff-readonly-note {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .staff-readonly-note {
        background: #121918;
    }

    :where(:root.is-dark) .staff-invite-link p {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .staff-card {
        border-color: #3d4b48;
        background: var(--card);
    }

    :where(:root.is-dark) .staff-avatar,
    :where(:root.is-dark) .staff-invite-icon {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .staff-person strong {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .staff-card.is-editing {
        border-color: #2e6b5a;
        background: #121918;
    }

    :where(:root.is-dark) .staff-rename-form {
        border-top-color: #3d4b48;
    }

    :where(:root.is-dark) .staff-rename-form label {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .staff-rename-form input {
        border-color: #3d4b48;
        background: #0f1413;
        color: #e9eeec;
    }

    :where(:root.is-dark) .staff-rename-form small {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .staff-status.expired {
        background: #121918;
        color: #a7b6b1;
    }

    :where(:root.is-dark) .staff-error {
        color: #f4a3a3;
    }

    /* ---- admin-orders.css ---- */
    :where(:root.is-dark) .order-toolbar {
        background: #121918;
    }

    :where(:root.is-dark) .order-status-filter {
        background: #121918;
    }

    :where(:root.is-dark) .order-status-chip {
        background: var(--card);
        border-color: #2e6b5a;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .order-toolbar input[type="date"] {
        background: #0f1413;
    }

    :where(:root.is-dark) .order-connection {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .order-connection.error,
    :where(:root.is-dark) .notification-failed {
        background: #2e1616 !important;
        color: #f4a3a3 !important;
    }

    :where(:root.is-dark) .order-card.is-terminal {
        background: #121918;
    }

    :where(:root.is-dark) .payment-badge.is-pay-at-store {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .payment-badge.is-paid {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .fulfillment-badge.onsite_dine_in {
        background: #221a33;
        color: #c9b5f2;
    }

    :where(:root.is-dark) .fulfillment-badge.scheduled_dine_in {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .fulfillment-badge.takeout {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .order-time-grid > div {
        background: #121918;
    }

    :where(:root.is-dark) .order-status {
        background: #121918;
    }

    :where(:root.is-dark) .order-status.is-cancelled {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .order-status.is-refund-failed {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .order-status.is-cooked {
        background: #13213a;
        color: #a9c8f5;
    }

    :where(:root.is-dark) .order-status.is-served {
        background: #121918;
    }

    :where(:root.is-dark) .order-status.is-payment-stale {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .order-alert {
        background: #2b2210;
        border-color: #7a5a1c;
        color: #f2c46b;
    }

    :where(:root.is-dark) .order-status-chip.is-money-attention {
        color: #f4a3a3;
    }

    :where(:root.is-dark) .order-menu-channel {
        background: var(--card);
        color: #c9b5f2;
    }

    :where(:root.is-dark) .order-board [data-order-column="requested"] .board-column-head {
        background: #2b2210;
    }

    :where(:root.is-dark) .order-board [data-order-column="requested"] .board-column-head h4 {
        color: #f2c46b;
    }

    :where(:root.is-dark) .order-board [data-order-column="cooked"] .board-column-head {
        background: #0f2a23;
    }

    :where(:root.is-dark) .order-board [data-order-column="cooked"] .board-column-head h4 {
        color: #7fe0c4;
    }

    :where(:root.is-dark) .order-layout-switch {
        background: var(--card);
    }

    :where(:root.is-dark) .order-layout-switch button[aria-pressed="true"] {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .order-elapsed.is-elapsed-warn {
        color: #f2c46b;
    }

    :where(:root.is-dark) .order-elapsed.is-elapsed-late {
        color: #f4a3a3;
    }

    :where(:root.is-dark) .serving-ticket {
        background: var(--card);
    }

    :where(:root.is-dark) .serving-ticket.is-band-late {
        border-color: #7a3030;
    }

    :where(:root.is-dark) .serving-fold {
        background: linear-gradient(135deg, #ffd98a 0 50%, #182120 50% 100%);
    }

    :where(:root.is-dark) .serving-destination {
        background: var(--card);
    }

    :where(:root.is-dark) .serving-destination.is-served {
        background: #121918;
        border-left-color: #2e6b5a;
    }

    :where(:root.is-dark) .serving-destination.is-served .serving-destination-label {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .serving-destination.is-served .serving-destination-items li strong,
    :where(:root.is-dark) .serving-destination.is-served .serving-quantity {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .serving-course {
        background: #121918;
    }

    :where(:root.is-dark) .order-adjustment {
        background: #121918;
    }

    :where(:root.is-dark) .order-adjustment-refund.is-refunded {
        background: #0f2a23;
        color: #7fe0c4;
    }

    :where(:root.is-dark) .order-adjustment-refund.is-failed {
        background: #2e1616;
    }

    :where(:root.is-dark) .adjust-summary {
        background: #121918;
    }

    :where(:root.is-dark) .adjust-error {
        background: #2e1616;
    }

    :where(:root.is-dark) .staff-order-product {
        background: var(--card);
    }

    :where(:root.is-dark) .staff-order-product.is-sold-out {
        background: #121918;
    }

    :where(:root.is-dark) .staff-option-rule {
        background: #0f2a23;
    }

    :where(:root.is-dark) .staff-option-choice:has(input:checked) {
        background: #0f2a23;
    }

    :where(:root.is-dark) .staff-order-notice,
    :where(:root.is-dark) .staff-order-channel {
        background: #0f2a23;
    }

    :where(:root.is-dark) .staff-order-warnings {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .staff-order-warnings h4 {
        color: #f2c46b;
    }

    :where(:root.is-dark) .staff-entry-badge {
        background: #13213a;
        color: #a9c8f5;
    }

    :where(:root.is-dark) .order-station-switch,
    :where(:root.is-dark) .order-text-switch {
        background: var(--card);
    }

    :where(:root.is-dark) .order-station-switch button[aria-pressed="true"],
    :where(:root.is-dark) .order-text-switch button[aria-pressed="true"] {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .serving-total {
        background: var(--card);
    }

    :where(:root.is-dark) .serving-total b {
        color: #f2c46b;
    }

    :where(:root.is-dark) .serving-late-count {
        background: #c23b3b;
    }

    :where(:root.is-dark) .serving-late-count.is-empty {
        background: #22302d;
    }

    :where(:root.is-dark) .staff-order-quick {
        background: #121918;
        border-color: #2e6b5a;
    }

    /* ---- admin-tables.css ---- */
    :where(:root.is-dark) .seat-summary {
        background: #121918;
    }

    :where(:root.is-dark) .seat-count {
        background: #22302d;
        color: #c3cfcb;
    }

    :where(:root.is-dark) .seat-count.is-seated {
        background: #221a33;
        color: #c9b5f2;
    }

    :where(:root.is-dark) .seat-count.is-occupied {
        background: #13213a;
        color: #a9c8f5;
    }

    :where(:root.is-dark) .seat-count.is-bill_requested {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .seat-count.is-cleaning {
        background: #22302d;
        color: #a7b6b1;
    }

    :where(:root.is-dark) .seat-card.is-vacant {
        border-color: #2e6b5a;
        background: #0f2a23;
    }

    :where(:root.is-dark) .seat-card.is-seated {
        border-color: #5a4785;
        background: #221a33;
    }

    :where(:root.is-dark) .seat-card.is-occupied {
        border-color: #34558a;
        background: #13213a;
    }

    :where(:root.is-dark) .seat-card.is-bill_requested {
        border-color: #7a5a1c;
        background: #2b2210;
    }

    :where(:root.is-dark) .seat-card.is-cleaning {
        border-color: #3d4b48;
        background: #121918;
    }

    :where(:root.is-dark) .seat-status {
        background: var(--card);
    }

    :where(:root.is-dark) .seat-card.is-seated .seat-status {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .seat-card.is-occupied .seat-status {
        color: #a9c8f5;
    }

    :where(:root.is-dark) .seat-card.is-cleaning .seat-status {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .table-bill-note {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .table-view-switch button {
        background: #1f2a28;
    }

    :where(:root.is-dark) .table-view-switch button[aria-pressed="true"] {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .floor-zone {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .floor-cell {
        background: #121918;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .floor-cell:hover {
        background: #0f2a23;
    }

    :where(:root.is-dark) .floor-table {
        background: var(--card);
    }

    :where(:root.is-dark) .floor-table .floor-pend {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .floor-table.is-vacant {
        background: #121918;
        border-color: #3d4b48;
        color: #a7b6b1;
    }

    :where(:root.is-dark) .floor-table.is-seated {
        background: #221a33;
        border-color: #5a4785;
    }

    :where(:root.is-dark) .floor-table.is-occupied {
        background: #0f2a23;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .floor-table.is-occupied.is-long {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .floor-table.is-bill_requested {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .floor-table.is-bill_requested .floor-st {
        color: #f2c46b;
    }

    :where(:root.is-dark) .floor-table.is-cleaning {
        background: #13213a;
        border-color: #34558a;
        color: #a9c8f5;
    }

    :where(:root.is-dark) .floor-table.has-call::after {
        background: #c23b3b;
        border-color: var(--card);
    }

    :where(:root.is-dark) .floor-cell.is-drop-target {
        background: #0f2a23;
    }

    :where(:root.is-dark) .floor-legend .is-seated {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .floor-legend .is-cleaning {
        color: #a9c8f5;
    }

    :where(:root.is-dark) .checkout-display {
        background: #121918;
    }

    :where(:root.is-dark) .checkout-display::backdrop {
        background: #121918;
    }

    :where(:root.is-dark) .checkout-display-items,
    :where(:root.is-dark) .checkout-display-total,
    :where(:root.is-dark) .checkout-display-thanks {
        background: var(--card);
    }

    :where(:root.is-dark) .checkout-display-total {
        background: #121918;
    }

    :where(:root.is-dark) .seat-call {
        background: #2e1616;
        border-color: #7a3030;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .seat-call button {
        background: #1f2a28;
        border-color: #7a3030;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .seat-call small {
        color: #f4a3a3;
    }

    /* ---- admin-settle.css ---- */
    :where(:root.is-dark) .settle-amounts dt {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .settle-due {
        border-top-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-methods {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-method {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-change {
        background: #121918;
    }

    :where(:root.is-dark) .settle-change.is-short {
        background: #2e1616;
        color: #f4a3a3;
    }

    /* テーブルQRのポップアップ（2026-10-15）。QRは夜でも白地のまま（黒地だとカメラが読めない）。枠だけ夜の色。 */
    :where(:root.is-dark) .qr-dialog-image img {
        background: #fff;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-keys button {
        background: #1f2a28;
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-bill {
        border-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-bill-head span {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .settle-bill-lines li {
        border-bottom-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-bill-name small {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .settle-bill-qty {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .settle-bill-breakdown {
        border-top-color: #3d4b48;
    }

    :where(:root.is-dark) .settle-bill-breakdown dt {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .settle-split {
        background: #121918;
        color: #c3cfcb;
    }

    /* ---- admin-handy.css ---- */
    :where(:root.is-dark) .hall-handy {
        background: #121918;
    }

    :where(:root.is-dark) .hall-handy::backdrop {
        background: #121918;
    }

    :where(:root.is-dark) .handy-head {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-head .handy-calls {
        background: #2e1616;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .handy-tables {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-table {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-table.is-seated {
        background: #221a33;
        border-color: #5a4785;
    }

    :where(:root.is-dark) .handy-table.is-occupied {
        background: #0f2a23;
        border-color: #2e6b5a;
    }

    :where(:root.is-dark) .handy-table.is-bill_requested {
        background: #2b2210;
        border-color: #7a5a1c;
    }

    :where(:root.is-dark) .handy-table.is-cleaning {
        background: #13213a;
        border-color: #34558a;
    }

    :where(:root.is-dark) .handy-table.is-on {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .handy-table.has-call::after {
        background: #c23b3b;
        border-color: var(--card);
    }

    :where(:root.is-dark) .handy-alert {
        background: #2e1616;
        border-color: #7a3030;
        color: #f4a3a3;
    }

    :where(:root.is-dark) .handy-alert.is-bill {
        background: #2b2210;
        border-color: #7a5a1c;
        color: #f2c46b;
    }

    :where(:root.is-dark) .handy-alert button {
        background: #1f2a28;
    }

    :where(:root.is-dark) .handy-seg button {
        background: #1f2a28;
    }

    :where(:root.is-dark) .handy-seg button[aria-selected="true"] {
        background: #e9eeec;
        color: #101514;
    }

    :where(:root.is-dark) .handy-count {
        background: #22302d;
        color: #a7b6b1;
    }

    :where(:root.is-dark) .handy-seg button[aria-selected="true"] .handy-count {
        background: #101514;
    }

    :where(:root.is-dark) .handy-error {
        background: #2e1616;
    }

    :where(:root.is-dark) .handy-notice {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .handy-item-main {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-item.is-sold-out .handy-item-main {
        background: #121918;
    }

    :where(:root.is-dark) .handy-cart,
    :where(:root.is-dark) .handy-confirm {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-warning {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .handy-carry-card {
        background: var(--card);
    }

    :where(:root.is-dark) .handy-foot {
        background: var(--card);
    }

    /* ---- admin-sales.css ---- */
    :where(:root.is-dark) .sales-total-label {
        color: #a7b6b1;
    }

    :where(:root.is-dark) .sales-table th,
    :where(:root.is-dark) .sales-table td {
        border-bottom-color: #3d4b48;
    }

    :where(:root.is-dark) .sales-difference.is-off dd,
    :where(:root.is-dark) .sales-difference-preview.is-off {
        color: #f4a3a3;
    }

    :where(:root.is-dark) .sales-detail th,
    :where(:root.is-dark) .sales-detail td {
        border-bottom-color: #3d4b48;
    }

    :where(:root.is-dark) .sales-detail th,
    :where(:root.is-dark) .sales-detail td small {
        color: #a7b6b1;
    }

    /* ---- admin-reservations.css ---- */
    :where(:root.is-dark) .resv-toolbar {
        background: #121918;
    }

    :where(:root.is-dark) .resv-toolbar input[type="date"],
    :where(:root.is-dark) .resv-dialog-times input[type="time"] {
        background: #0f1413;
    }

    :where(:root.is-dark) .resv-error {
        background: #2e1616;
    }

    :where(:root.is-dark) .resv-warning {
        border-color: #7a3030;
        background: #2e1616;
    }

    :where(:root.is-dark) .resv-restricted-note {
        background: #2b2210;
        color: #f2c46b;
    }

    :where(:root.is-dark) .resv-hour {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .resv-row.is-unassigned .resv-row-label,
    :where(:root.is-dark) .resv-row.is-unassigned .resv-track {
        background: #121918;
    }

    :where(:root.is-dark) .resv-row.is-takeout .resv-row-label,
    :where(:root.is-dark) .resv-row.is-takeout .resv-track {
        background: #2b2210;
    }

    :where(:root.is-dark) .resv-row.is-takeout .resv-row-label strong {
        color: #f2c46b;
    }

    :where(:root.is-dark) .resv-track {
        background-image: repeating-linear-gradient(to right, var(--line) 0 1px, transparent 1px calc(60 * var(--resv-ppm))),
            repeating-linear-gradient(to right, #1c2523 0 1px, transparent 1px calc(15 * var(--resv-ppm)));
    }

    :where(:root.is-dark) .resv-row.is-drop-target .resv-track {
        background: #0f2a23;
    }

    :where(:root.is-dark) .resv-bar-shape::after {
        background: #0f2a23;
    }

    :where(:root.is-dark) .resv-bar.is-overlap .resv-bar-shape::after {
        background: #2e1616;
    }

    :where(:root.is-dark) .resv-bar.is-takeout .resv-bar-shape::after {
        background: #2b2210;
    }

    :where(:root.is-dark) .resv-bar.is-takeout .resv-bar-label {
        color: #f2c46b;
    }

    :where(:root.is-dark) .resv-bar.is-onsite .resv-bar-shape::after {
        background: #221a33;
    }

    :where(:root.is-dark) .resv-bar.is-onsite .resv-bar-label {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .resv-bar.is-onsite.is-settled .resv-bar-shape::after {
        background: #121918;
    }

    :where(:root.is-dark) .resv-bar.is-onsite.is-settled .resv-bar-label {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .resv-row-label .resv-row-onsite {
        color: #c9b5f2;
    }

    :where(:root.is-dark) .resv-now {
        background: #c23b3b;
    }

    :where(:root.is-dark) .resv-dialog-facts {
        background: #121918;
    }

    :where(:root.is-dark) .resv-dialog-segment {
        background: #0f2a23;
    }

    :where(:root.is-dark) .resv-orders-summary div {
        background: #121918;
    }

    :where(:root.is-dark) .resv-orders-summary span {
        color: #c3cfcb;
    }

    :where(:root.is-dark) .resv-orders-group.is-reservation h3 {
        border-bottom-color: #2e6b5a;
    }

    /* ---- 3. 「注文・予約」のボード ----
       2026-10-07 の夜の配色（2026-10-10 まで #tab-orders.is-dark だったもの）をそのまま引き継ぎます。
       照明の強い厨房で白い画面が反射しないよう、ボードの土台を暗くします（Toast KDS の型）。
       帯の色（緑・黄・赤）はそのまま。伝票の文字は白にします。#tab-orders を含むので、上の 2 より強く効きます。 */
    :root.is-dark #tab-orders .order-monitor {
        background: #101514;
        border-color: #2a3634;
        color: #e9eeec;
    }

    :root.is-dark #tab-orders .order-toolbar {
        background: #182120;
        border-color: #2a3634;
        color: #e9eeec;
    }

    :root.is-dark #tab-orders .order-toolbar label,
    :root.is-dark #tab-orders .order-board-hint,
    :root.is-dark #tab-orders .panel-head p,
    :root.is-dark #tab-orders .serving-totals-label {
        color: #a7b6b1;
    }

    :root.is-dark #tab-orders .order-board .board-column {
        background: #182120;
        border-color: #2a3634;
    }

    :root.is-dark #tab-orders .serving-ticket,
    :root.is-dark #tab-orders .serving-destination,
    :root.is-dark #tab-orders .serving-total,
    :root.is-dark #tab-orders .order-board-card {
        background: #0f1413;
        border-color: #2f3b39;
        color: #f1f4f3;
    }

    :root.is-dark #tab-orders .serving-name strong,
    :root.is-dark #tab-orders .serving-quantity,
    :root.is-dark #tab-orders .serving-destination-label,
    :root.is-dark #tab-orders .serving-destination-items li strong,
    :root.is-dark #tab-orders .serving-total {
        color: #f1f4f3;
    }

    :root.is-dark #tab-orders .serving-options,
    :root.is-dark #tab-orders .serving-waiting,
    :root.is-dark #tab-orders .board-empty {
        color: #a7b6b1;
    }

    :root.is-dark #tab-orders .serving-destination.is-served {
        background: #141a19;
        opacity: .7;
    }

    :root.is-dark #tab-orders .serving-ticket.is-band-late {
        box-shadow: 0 0 0 2px var(--danger);
    }

    /* 新着の伝票の光（admin-orders.css の .serving-ticket.is-new）。夜は白い枠だけで光らせます。 */
    :root.is-dark .serving-ticket.is-new {
        animation-name: serving-new-flash-dark;
        box-shadow: 0 0 0 3px #fff;
    }

    @keyframes serving-new-flash-dark {
        50% { box-shadow: 0 0 0 3px transparent; }
    }

    @media (prefers-reduced-motion: reduce) {
        :root.is-dark .serving-ticket.is-new {
            animation: none;
        }
    }

    /* ---- 4. 細かい所 ---- */
    /* ロゴ。白抜き版（/assets/brand/pochi-to-get-wordmark-white.svg。全面 #ffffff）と同じ見た目になります。
       <img> の文字列は BrandLogoPlacementTest が固定しているので、画像は差し替えずに色だけ変えます。 */
    :root.is-dark .app-logo {
        filter: brightness(0) invert(1);
    }

    /* 文字に使っている --brand（主ボタンの地の緑 #087563）は、暗い地では読みにくいので明るい緑に。 */
    :where(:root.is-dark) .app-header p,
    :where(:root.is-dark) .eyebrow,
    :where(:root.is-dark) .field-label sup,
    :where(:root.is-dark) .legal-checklist .is-done > span,
    :where(:root.is-dark) .qa-steps li.is-current .qa-step-number {
        color: #4cc9a8;
    }

    /* 押したときの明るさ。昼は少し暗くしますが（brightness(.97)）、暗い地ではそれが見えないので明るくします。 */
    :where(:root.is-dark) button:hover,
    :where(:root.is-dark) .button-link:hover,
    :where(:root.is-dark) .contract-menu > summary:hover {
        filter: brightness(1.15);
    }

    /* クラスの無いリンク（課金の帯の「契約・請求ページ」など）は、ブラウザ既定の青だと暗い地で読めません。 */
    :where(:root.is-dark) a:not([class]) {
        color: #8fc7ff;
    }

    /* 「保存しました」などのトースト。昼は濃い地なので、夜は明るい地に反転して浮かせます。 */
    :where(:root.is-dark) .toast {
        background: #e9eeec;
        color: #101514;
    }

    /* スイッチの溝（OFF）。つまみは白のままです。 */
    :where(:root.is-dark) .switch span {
        background: #3a4845;
    }

    /* テーブル割当の見出しの、営業時間の細い帯。 */
    :where(:root.is-dark) .resv-open-band {
        background: #2e6b5a;
    }

    /* 「もとに戻す」（夜は明るい地）の中のキーの枠。昼の白い枠は明るい地で見えません。 */
    :where(:root.is-dark) .link-undo-key {
        border-color: rgba(16, 21, 20, .35);
    }
}