/* 店の夜(#330、2026-10-26 店主「Aで」= 行灯: 焦げ茶の地に生成りの字)。html.shop-night で効く。
 * 付け外しは theme-init.js(描く前)と settings.js(切り替え)。案はキャンバス「棋楽軒 店の昼と夜」と
 * design/shop-night/。紙・墨の札(tokens.css の --shop-paper* と --shop-ink*)を入れ替えるのが芯で、
 * 濃い地の上の字は --shop-cream(変えない)。地に直書きの色は、ここで一つずつ夜に合わせる。
 * 札・牌・賽・駒など手に取る物と、もとから暗い入口の名札は、物の上で昼の値に戻す(下の「手に取る物」)。 */
html.shop-night {
  --shop-paper: #2a2119;
  --shop-paper-deep: #1f1812;
  --shop-paper-light: #352a20;
  --shop-paper-line: rgba(236, 225, 200, 0.16);
  --shop-ink: #ece1c8;
  --shop-ink-soft: #c2b393;
  --shop-seal: #e0705f;
  --shop-seal-deep: #f08a78;
  --night-ground: #1b140e;
  --night-glow: rgba(255, 214, 150, 0.10);
}
html.shop-night {
  color-scheme: dark;
  --shop-paper-grain:
    repeating-linear-gradient(115deg,
      rgba(255, 240, 210, 0.025) 0px, rgba(255, 240, 210, 0.025) 1px,
      transparent 1px, transparent 5px);
  --shop-wara-ground:
    radial-gradient(ellipse 70% 50% at 50% 0, var(--night-glow), transparent 70%),
    linear-gradient(var(--shop-paper-light), var(--shop-paper) 30%);
  --shop-sheet-rule: rgba(224, 112, 95, 0.45);
  --shop-sheet-rule-outer: rgba(224, 112, 95, 0.25);
}
html.shop-night body {
  background-color: var(--night-ground);
  color: var(--shop-ink);
}

/* ---- 店の中 ---- */
html.shop-night .shop-page .eyebrow,
html.shop-night .eyebrow { color: var(--shop-brass-light); }
html.shop-night .shop-note-date { border-color: var(--shop-ink-soft); outline-color: var(--shop-ink-soft); color: var(--shop-ink); }
html.shop-night .house-card,
html.shop-night .again-card,
html.shop-night .store-now > div[class*="card"] { background: color-mix(in srgb, var(--shop-paper-light) 85%, transparent); }
html.shop-night .week-heat-cell:not([class*="level-"]) { background: rgba(255, 240, 210, 0.07); }
html.shop-night .badge-menu-item.logout:hover { background: rgba(255, 240, 210, 0.08); }
/* 濃い地の釦の字は、紙の色の札ではなく生成りのまま(夜に紙が暗くなっても)。 */
html.shop-night :is(.cta-primary, .primary-btn) { color: var(--shop-cream); }
html.shop-night :is(.cta-outline, .secondary-btn) { color: var(--shop-brass-light); border-color: var(--shop-brass); }

/* ---- 手に取る物(札・牌・賽・駒)は夜でも昼の色のまま ----
 * 札の中の字や地は紙・墨の札から引いているので、物の上で昼の値に戻す(下の子にもそのまま継がれる)。 */
/* 箱の絵・遊び方の図・名札の絵(SVG)も、紙と墨の札で描いているので昼の値に戻す(白黒が入れ替わらないように、
 * 2026-10-26 店主「SVGの白黒は反転しない方がいいかも」)。 */
html.shop-night :is(.cover, .cover-art, .fuda-art, .sampler-cover, .game-popup-cover, .room-game-cover, .again-cover,
  .detail-cover, .doc-cover, .rules-diagram, .doc-figure, .werewolf-plate-art, .rt-art),
html.shop-night :is(.entry-card, .mj-seat, .daifugo-card, .koikoi-card, .werewolf-card, .kf-card, .kl-card, .rx-card, .sg-card,
  .dealer-card, .game-fx-deal-card, .babanuki-draw-card, .mj-tile, .ms-tile, .yacht-die, .cc-die, .liarsdice-dice, .rt-dice,
  .chess-piece, .shogi-piece, .gomoku-stone, .reversi-disc, .nf-fuda) {
  --shop-paper: #ece1c8;
  --shop-paper-deep: #ded0aa;
  --shop-paper-light: #f7f1e1;
  --shop-paper-line: rgba(42, 36, 28, 0.14);
  --shop-ink: #2a241c;
  --shop-ink-soft: #55493a;
  --shop-seal: #a8352b;
  --shop-seal-deep: #7d2119;
  --shop-paper-grain:
    repeating-linear-gradient(115deg,
      rgba(42, 36, 28, 0.03) 0px, rgba(42, 36, 28, 0.03) 1px,
      transparent 1px, transparent 5px);
  color: var(--shop-ink);
}

/* ---- 解説ページ ---- */
html.shop-night .doc-nav a { color: #ded0aa; }
html.shop-night .doc-nav a:hover { color: var(--shop-brass-light); }
html.shop-night .manners { background-color: color-mix(in srgb, var(--shop-paper-deep) 70%, transparent); }

/* ---- 窓・品書きの紙 ---- */
html.shop-night .game-popup-tagline { color: var(--shop-seal); }
/* 遊びの詳しい紙の題の下の一行は、箱の地の色ごとに濃い字。夜は真鍮に揃える。 */
html.shop-night .detail-hero .tagline,
html.shop-night .detail-hero[class*="tone-"] .tagline { color: var(--shop-brass-light); }
/* ルールの例(.rx)の小さな見出し。 */
html.shop-night .rx-label { color: var(--shop-brass-light); }
html.shop-night .rx { background: rgba(255, 240, 210, 0.06); }

/* ---- 卓の頭・道具 ---- */
html.shop-night { --night-pine-text: #9cc7a8; }
html.shop-night .room-state-phase.mine { color: var(--night-pine-text); }
html.shop-night .room-state-phase.mine::before { background: var(--night-pine-text); }

/* ---- チンチロ: 座敷(畳と名札)は灯りの下の部屋なので、夜も昼の色のまま ---- */
html.shop-night .chinchiro-container {
  --shop-paper: #ece1c8;
  --shop-paper-deep: #ded0aa;
  --shop-paper-light: #f7f1e1;
  --shop-paper-line: rgba(42, 36, 28, 0.14);
  --shop-ink: #2a241c;
  --shop-ink-soft: #55493a;
  --shop-seal: #a8352b;
  --shop-seal-deep: #7d2119;
  color: var(--shop-ink);
}

/* ---- すごろく: 紙の上に出ている字(帯の宿場の名・手番の一行・絵巻の切り替え)。帳面(この先の宿・道中記)は昼の紙のまま ---- */
html.shop-night :is(.sg-strip-labels, .sg-follow, .sg-turn-line, .sg-other-line, .sg-skip-note) { color: var(--shop-ink-soft); }
html.shop-night .sg-turn-line strong { color: var(--shop-ink); }

/* ---- 押せない釦(出す・前後の送り) ---- 昼は薄い紙に灰の字。夜は地に溶かして字を薄く。 */
html.shop-night :is(#daifugo-container, #doubt-container, #pageone-container, #sevens-container, #poker-container,
  #blackjack-container, #highlow-container, #liarsdice-container) .daifugo-actions :is(.primary-btn, .secondary-btn):disabled,
html.shop-night .liarsdice-log-step:disabled {
  background: rgba(255, 240, 210, 0.05);
  color: rgba(236, 225, 200, 0.42);
}

/* ---- 人狼 ---- */
html.shop-night .werewolf-role-big { color: var(--night-pine-text); }
html.shop-night .werewolf-role-big.wolf { color: var(--shop-seal); }
html.shop-night .werewolf-guide .werewolf-guide-head { color: var(--shop-brass-light); }

/* ---- ヨット: 点取帳の小計の帯と段の添え書き ---- */
html.shop-night { --yacht-band-tint: #3a2d21; }
html.shop-night .yacht-band-note { color: var(--shop-ink-soft); }
html.shop-night .yacht-band-name { color: var(--shop-brass-light); }

/* ---- 隠し札: 店の者の一言の札は、生成りの紙のまま(札と同じく手に取る紙) ---- */
html.shop-night .kf-hint {
  --shop-ink: #2a241c;
  --shop-ink-soft: #55493a;
  color: var(--shop-ink);
}
html.shop-night .required { color: var(--shop-seal); }

/* ---- 道具の札 ---- 選んでいる段は胡桃の地では沈むので、真鍮の地に墨の字。 */
html.shop-night .tools-seg-btn[aria-pressed="true"] { background: var(--shop-brass-light); color: var(--shop-walnut-deep); }

/* ---- 解説ページ(/games): スクリプトを読まない(#137)ので、端末が暗い画面の設定のときだけ夜にする ----
 * 店で選んだ昼・夜は届かない(店は localStorage、こちらは CSS だけ)。札の値は上の html.shop-night と同じ。 */
@media screen and (prefers-color-scheme: dark) {
  html:has(.doc-header) {
    color-scheme: dark;
    --shop-paper: #2a2119;
    --shop-paper-deep: #1f1812;
    --shop-paper-light: #352a20;
    --shop-paper-line: rgba(236, 225, 200, 0.16);
    --shop-ink: #ece1c8;
    --shop-ink-soft: #c2b393;
    --shop-seal: #e0705f;
    --shop-seal-deep: #f08a78;
    --shop-paper-grain:
      repeating-linear-gradient(115deg,
        rgba(255, 240, 210, 0.025) 0px, rgba(255, 240, 210, 0.025) 1px,
        transparent 1px, transparent 5px);
  }
  html:has(.doc-header) body { background-color: #1b140e; color: var(--shop-ink); }
  html:has(.doc-header) .doc-nav a { color: #ded0aa; }
  html:has(.doc-header) .doc-nav a:hover { color: var(--shop-brass-light); }
  html:has(.doc-header) .rx-label { color: var(--shop-brass-light); }
  html:has(.doc-header) .rx { background: rgba(255, 240, 210, 0.06); }
  /* ヨットの点数表(#402)の小計・合計の行と罫。 */
  html:has(.doc-header) .ys-sum { background: #3a2d21; }
  html:has(.doc-header) .ys-total { background: #46362a; }
  html:has(.doc-header) :is(.ys-table, .ys-table th, .ys-table td, .ys-p) { border-color: rgba(236, 225, 200, 0.18); }
  html:has(.doc-header) :is(.ys-name, .ys-in):focus { background: #3a2d21; }
  html:has(.doc-header) :is(.rx-card, .daifugo-card, .koikoi-card, .mj-tile, .yacht-die, .doc-cover, .doc-figure, .cover-art) {
    --shop-paper: #ece1c8;
    --shop-paper-light: #f7f1e1;
    --shop-ink: #2a241c;
    --shop-ink-soft: #55493a;
    --shop-seal: #a8352b;
    color: var(--shop-ink);
  }
}

/* ---- 濃い色の字(松葉・臙脂・胡桃・墨・真鍮の濃い方)は夜の地に沈むので、明るい同じ系統の色に ----
 * 2026-10-26 店主「(卓の一覧の観戦する)ボタンが見にくい」。各 CSS で color: var(--shop-pine-deep) などと書いている所を
 * 拾って並べた(明るい地の釦や、手に取る物の中の字は外した)。 */
html.shop-night .doc-close .doc-cta-ghost,
html.shop-night .doc-close .doc-cta-ghost:hover,
html.shop-night .doc-shop-link a,
html.shop-night .nf-text .doc-cta-ghost,
html.shop-night .nf-text .doc-cta-ghost:hover,
html.shop-night .shopkeeper-date,
html.shop-night #room-player-list li .standin-tag,
html.shop-night #room-player-list li .cpu-level-tag,
html.shop-night .shop-note-link a,
html.shop-night .room-status-pill.cpu { color: var(--shop-ink); }
html.shop-night .doc-shop-pr,
html.shop-night .doc-index-head .doc-eyebrow,
html.shop-night .babanuki-last-mark,
html.shop-night .babanuki-last-arrow,
html.shop-night .daifugo-turn-order-badge,
html.shop-night .daifugo-transfer-mark,
html.shop-night .daifugo-recent-ago,
html.shop-night .daifugo-recent-toggle-label,
html.shop-night .liarsdice-bid-slip-label,
html.shop-night .liarsdice-log-label,
html.shop-night .liarsdice-log-sep,
html.shop-night .cpu-level-rules summary,
html.shop-night .poker-step-btn,
html.shop-night .poker-result-award-label,
html.shop-night .shop-note-pr-tag,
html.shop-night .all-games-group h3,
html.shop-night .manners-number,
html.shop-night .werewolf-truth-tag,
html.shop-night .yacht-col-total { color: var(--shop-brass-light); }
html.shop-night .bj-hand.result-win .bj-hand-result,
html.shop-night .bj-hand.result-blackjack .bj-hand-result,
html.shop-night .dealer-ledger-delta.plus,
html.shop-night .hl-last-delta.plus,
html.shop-night .liarsdice-log-verdict.true,
html.shop-night .invite-link-copied,
html.shop-night #room-player-list li .host-tag,
html.shop-night .chat-line.own .chat-who,
html.shop-night .top-game:hover,
html.shop-night .top-game:focus-visible,
html.shop-night .room-status-pill.waiting,
html.shop-night .room-ledger .row-cta,
html.shop-night .detail-rules-link a:hover,
html.shop-night .credits-list a:hover,
html.shop-night .werewolf-panel-title.village,
html.shop-night .werewolf-log-row.me .werewolf-log-who,
html.shop-night .yacht-score-btn { color: var(--night-pine-text); }
html.shop-night .daifugo-lock-note,
html.shop-night .daifugo-revolution-note,
html.shop-night .paper-modal .error-text,
html.shop-night .paper-modal .required,
html.shop-night .invite-link-warning,
html.shop-night #room-player-list li .disconnected-tag,
html.shop-night #room-player-list li .cpu-remove-btn,
html.shop-night .rules-modal-head .eyebrow,
html.shop-night .game-popup .detail-cpu-error,
html.shop-night .room-status-pill.playing,
html.shop-night .detail-cpu-error { color: var(--shop-seal); }
/* 卓の一覧の「観戦する」「入室する」の枠も松葉の明るい方に。 */
html.shop-night .room-ledger .row-cta { border-color: var(--night-pine-text); }
html.shop-night .room-ledger .row-cta:hover { background: var(--shop-pine); color: var(--shop-cream); }
