/* ==========================================================================
   polish.css — 主页 / 出征准备 / 省资源（最后加载，覆盖前面的样式）
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 省资源：一直在跑的动画只用 opacity / transform（交给合成器，不重绘）
   -------------------------------------------------------------------------- */
/* 瞄准线：只在真正拖出箭头时流动（原来空路径也一直 60 帧重算样式） */
.targeting-curve { animation: none !important; }
.targeting-curve.curve-attack, .targeting-curve.curve-move, .targeting-curve.curve-neutral { animation: dash-flow .8s linear infinite !important; }

/* 结束回合按钮：静态金色内光（不再逐帧改阴影；伪元素在未定位的按钮上会铺满整屏，故不用） */
.btn-end-turn.state-active { animation: none !important; box-shadow: inset 0 0 0 2px rgba(255,226,150,.9), 0 0 12px rgba(240,201,120,.45) !important; }
@keyframes glowFade { 0%, 100% { opacity: .15; } 50% { opacity: 1; } }

/* 可行动单位：静态金边 + 伪元素透明度呼吸 */
.board-unit.status-can-act { animation: none !important; }
.board-unit.status-can-act::before {
  content: ""; position: absolute; inset: -3px; border-radius: 10px; pointer-events: none; z-index: 0;
  box-shadow: 0 0 14px 2px rgba(243,216,146,.6);
  animation: glowFade 2.2s ease-in-out infinite;
}
body.tactic-targeting .board-unit.status-can-act::before,
body.choice-active .board-unit.status-can-act::before { display: none; }

/* 可攻击目标：静态红光 + 伪元素闪烁（不再逐帧改 box-shadow） */
.legal-attack-target { animation: none !important; box-shadow: 0 0 12px rgba(229,62,62,.8) !important; }

/* 水域波纹：平移图层代替改 background-position */
.frontline-zone.terrain-water::after {
  right: -60px !important; background-size: auto !important;
  animation: waterShift 2.4s linear infinite !important;
}
@keyframes waterShift { from { transform: translateX(0); } to { transform: translateX(-52.8px); } }

/* 主页 / 后台时停掉持续动画（只点名这几个，避免通配选择器拖慢每次样式计算） */
body.at-home .frontline-zone.terrain-water::after, body.page-hidden .frontline-zone.terrain-water::after,
body.at-home .board-unit.status-can-act::before, body.page-hidden .board-unit.status-can-act::before { animation: none !important; }

/* 手机：关掉毛玻璃（backdrop-filter 每帧重采样整屏，最耗 GPU）和持续动画 */
@media (hover: none), (pointer: coarse) {
  .modal-overlay, .tactical-drawer, .home-panel { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .frontline-zone.terrain-water::after { animation: none !important; }
  .board-unit.status-can-act::before { animation: none; opacity: .75; }
  .home-gallery { filter: none !important; opacity: .16 !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* --------------------------------------------------------------------------
   2. 主页 —— 新中式平面：墨底、朱砂日、竖排大字、细金线、四势力色条
   -------------------------------------------------------------------------- */
.home-screen.hm {
  --ink: #12100d; --paper: #efe6d2; --paper-dim: #a99c80; --cinnabar: #c33b2b; --gold-line: rgba(217,179,106,.28);
  --hm-serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Noto Serif SC", "Source Han Serif SC", "SimSun", serif;
  display: grid !important; place-items: stretch; align-items: stretch; justify-items: stretch;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 420px); grid-template-rows: 1fr auto;
  column-gap: clamp(24px, 6vw, 96px);
  padding: max(28px, env(safe-area-inset-top)) clamp(24px, 7vw, 120px) max(22px, env(safe-area-inset-bottom));
  background: var(--ink) !important; color: var(--paper); overflow: hidden !important; box-sizing: border-box;
}
.home-screen.hm::before { display: none !important; }
.home-screen.hm.hidden { display: none !important; }
.hm > * { position: relative; z-index: 1; }
.hm-sun {
  position: absolute !important; z-index: 0 !important; pointer-events: none;
  width: min(62vh, 44vw); aspect-ratio: 1; border-radius: 50%; background: var(--cinnabar);
  left: clamp(10px, 20vw, 360px); top: 50%; transform: translateY(-58%);
}
.hm-grid-lines {
  position: absolute !important; inset: 0; z-index: 0 !important; pointer-events: none;
  background:
    linear-gradient(var(--gold-line), var(--gold-line)) 0 78% / 100% 1px no-repeat;
}
.hm-stripes { position: absolute !important; left: 0; right: 0; bottom: 0; height: 6px; display: flex; z-index: 2 !important; }
.hm-stripes i { flex: 1; }
.hm-stripes .s-wei { background: #2f5d86; } .hm-stripes .s-shu { background: #a0352a; } .hm-stripes .s-wu { background: #2e6b3d; } .hm-stripes .s-lb { background: #5a3a78; }

.hm-brand { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: clamp(14px, 3vw, 40px); min-height: 0; }
.hm-title {
  margin: 0; display: flex; flex-direction: column; line-height: .92;
  font-family: var(--hm-serif); font-weight: 900; color: var(--paper);
  font-size: clamp(96px, 30vh, 280px); letter-spacing: 0;
}
.hm-title span:last-child { margin-left: .42em; }
.hm-side { display: flex; flex-direction: column; gap: 18px; align-self: center; padding-top: 8vh; }
.hm-seal {
  display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px;
  border: 2px solid var(--paper); color: var(--paper); font-family: var(--hm-serif); font-weight: 900;
  font-size: 18px; line-height: 1.05; letter-spacing: 2px; text-align: center; border-radius: 3px;
}
.hm-en { margin: 0; font: 600 12px/1.5 Georgia, "Times New Roman", serif; letter-spacing: 4px; color: var(--paper-dim); }
.hm-en b { display: block; font-size: 30px; letter-spacing: 10px; color: var(--paper); font-weight: 400; }
.hm-tag { margin: 0; font-size: 13px; line-height: 1.8; letter-spacing: 4px; color: var(--paper-dim); }

.hm-menu { grid-column: 2; grid-row: 1; align-self: center; display: flex; flex-direction: column; }
.hm-item {
  display: grid; grid-template-columns: 44px 1fr 20px; align-items: center; gap: 10px; width: 100%;
  padding: 18px 12px 18px 4px; background: transparent; color: var(--paper); text-align: left; cursor: pointer;
  border: 0; border-top: 1px solid rgba(239,230,210,.18); border-radius: 0;
  transition: background .18s, color .18s, padding .18s;
}
.hm-item:last-of-type { border-bottom: 1px solid rgba(239,230,210,.18); }
.hm-item em { font-style: normal; font-family: var(--hm-serif); font-weight: 900; font-size: 22px; color: var(--cinnabar); text-align: center; }
.hm-it { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hm-it b { font-family: var(--hm-serif); font-weight: 900; font-size: 24px; letter-spacing: 6px; }
.hm-it small { font-size: 12px; letter-spacing: 1px; color: var(--paper-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-arrow { width: 16px; height: 1px; background: currentColor; position: relative; opacity: .7; }
.hm-arrow::after { content: ""; position: absolute; right: 0; top: -4px; width: 8px; height: 8px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); }
#home-btn-eve.hm-item, #home-btn-pvp.hm-item { background: transparent !important; border-color: rgba(239,230,210,.18) !important; box-shadow: none !important; }
#home-btn-eve.hm-item:hover, #home-btn-pvp.hm-item:hover { background: var(--paper) !important; }
.hm-item:hover, .hm-item:focus-visible { background: var(--paper); color: var(--ink); padding-left: 12px; outline: none; }
.hm-item:hover small, .hm-item:focus-visible small { color: #5b5140; }
.hm-item.hm-primary { background: var(--paper); color: var(--ink); border-top-color: var(--paper); padding-left: 12px; }
.hm-item.hm-primary small { color: #5b5140; }
.hm-item.hm-primary:hover { background: #fff7e6; }
.hm-links { display: flex; gap: 0; margin-top: 18px; }
.hm-link {
  flex: 1 1 0; min-width: 0; padding: 10px 0; background: transparent; border: 0; border-left: 1px solid rgba(239,230,210,.18);
  color: var(--paper-dim); font-size: 13px; letter-spacing: 3px; cursor: pointer; border-radius: 0;
}
.hm-link:first-child { border-left: 0; }
.hm-link:hover { color: var(--paper); }
.hm-link.is-off { text-decoration: line-through; }
.hm-touch-only { display: none; }
@media (pointer: coarse) { .hm-touch-only { display: block; } body.is-standalone .hm-touch-only { display: none; } }
.hm-foot { grid-column: 1 / -1; grid-row: 2; margin: 0; font-size: 11px; letter-spacing: 3px; color: rgba(169,156,128,.6); }

/* 竖屏：上方大字 + 朱砂日，下方菜单 */
@media (max-aspect-ratio: 4/5), (max-width: 640px) and (orientation: portrait) {
  .home-screen.hm { grid-template-columns: 1fr; grid-template-rows: 1fr auto auto; padding: max(24px, env(safe-area-inset-top)) 22px max(20px, env(safe-area-inset-bottom)); }
  .hm-sun { width: 64vw; left: auto; right: -12vw; top: 7vh; transform: none; }
  .hm-grid-lines { background: linear-gradient(var(--gold-line), var(--gold-line)) 0 44% / 100% 1px no-repeat, linear-gradient(var(--gold-line), var(--gold-line)) 18% 0 / 1px 100% no-repeat; }
  .hm-brand { grid-column: 1; grid-row: 1; align-items: flex-start; padding-top: 4vh; }
  .hm-title { font-size: min(34vw, 25vh); }
  .hm-side { padding-top: 2vh; gap: 12px; }
  .hm-en { letter-spacing: 2px; font-size: 10px; }
  .hm-en b { font-size: 24px; letter-spacing: 7px; }
  .hm-menu { grid-column: 1; grid-row: 2; align-self: end; }
  .hm-item { padding: 14px 10px 14px 2px; }
  .hm-item.hm-primary { padding-left: 10px; }
  .hm-it b { font-size: 21px; letter-spacing: 4px; }
  .hm-foot { grid-row: 3; margin-top: 14px; text-align: center; }
}
/* 横屏手机（矮屏）：压缩字号与间距 */
@media (max-height: 520px) and (orientation: landscape) {
  .home-screen.hm { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); padding: max(12px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) 14px max(28px, env(safe-area-inset-left)); column-gap: 28px; }
  .hm-title { font-size: 34vh; }
  .hm-side { padding-top: 4vh; gap: 10px; }
  .hm-seal { width: 42px; height: 42px; font-size: 14px; }
  .hm-en b { font-size: 22px; letter-spacing: 7px; }
  .hm-tag { display: none; }
  .hm-item { padding: 9px 10px 9px 2px; }
  .hm-item.hm-primary { padding-left: 10px; }
  .hm-it b { font-size: 19px; letter-spacing: 4px; }
  .hm-it small { font-size: 11px; }
  .hm-links { margin-top: 8px; }
  .hm-link { padding: 6px 0; }
  .hm-foot { display: none; }
}

/* --------------------------------------------------------------------------
   3. 出征准备（选势力 / 卡组 / 主城）
   -------------------------------------------------------------------------- */
.hq-pick-box { width: min(600px, calc(100vw - 20px)) !important; text-align: left !important; }
.hq-pick-title { text-align: center; }
.hqp-grid { display: grid; grid-template-columns: auto 1fr; gap: 10px 12px; align-items: center; margin: 14px 0 6px; }
.hqp-label { font-size: 12px; color: #bfae86; letter-spacing: 2px; white-space: nowrap; text-align: right; }
.hqp-field { min-width: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hqp-field .enemy-chip { min-width: 40px; padding: 5px 12px; font-size: 15px; transition: background .15s, border-color .15s; }
.hqp-seg { display: inline-flex; border: 1px solid rgba(217,179,106,.45); border-radius: 18px; overflow: hidden; }
.hqp-seg .enemy-chip { border: 0; border-radius: 0; background: transparent; font-size: 13px; padding: 5px 14px; }
.hqp-seg .enemy-chip.active { background: #8e2a20; }
.hqp-field .enemy-chip.k-wei.active { background: #2f5d86; border-color: #8fc0ec; }
.hqp-field .enemy-chip.k-shu.active { background: #8a2f22; border-color: #f0a58f; }
.hqp-field .enemy-chip.k-wu.active { background: #2e6b3d; border-color: #9fd6a8; }
.hqp-field .enemy-chip.k-lb.active { background: #5a3a78; border-color: #c7a6e6; }
.hqp-decks { flex: 1; min-width: 0; display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.hqp-deck {
  flex: 0 0 auto; width: 150px; scroll-snap-align: start; text-align: left;
  display: flex; flex-direction: column; gap: 3px; padding: 7px 9px; border-radius: 10px;
  border: 1px solid rgba(217,179,106,.3); background: #1d150d; color: #efe0bb; cursor: pointer;
}
.hqp-deck.active { border-color: #f0cf6a; background: linear-gradient(180deg, #4a3418, #2a1d0f); box-shadow: 0 0 0 1px #f0cf6a inset; }
.hqp-deck-name { font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hqp-deck-meta { font-size: 11px; color: #bfae86; white-space: nowrap; }
.hqp-deck-tag { display: inline-block; margin-right: 4px; padding: 0 5px; border-radius: 5px; font-size: 10px; background: rgba(217,179,106,.2); color: #f3d892; vertical-align: 1px; }
.hqp-deck-empty { font-size: 12px; color: #ffae8f; padding: 6px 0; }
.hqp-manage { flex: none; align-self: stretch; padding: 4px 10px !important; font-size: 12px !important; }
.hq-pick-sub { text-align: center; margin: 10px 0 8px !important; }
@media (max-width: 520px) {
  .hqp-grid { grid-template-columns: 1fr; gap: 4px; }
  .hqp-label { text-align: left; margin-top: 6px; }
  .hqp-deck { width: 136px; }
}
@media (max-height: 520px) and (orientation: landscape) {
  .hq-pick-box { width: min(760px, calc(100vw - 16px)) !important; }
  .hqp-grid { margin: 6px 0 2px; gap: 5px 10px; }
  .hqp-field .enemy-chip { padding: 3px 10px; font-size: 13px; }
  .hqp-deck { width: 132px; padding: 4px 8px; }
  .hqp-deck-meta { display: none; }
  .hq-pick-sub { display: none; }
}

/* --------------------------------------------------------------------------
   4. 卡组编辑器：手机筛选改为下拉，卡池“选中 → 下方加减”
   -------------------------------------------------------------------------- */
.db-fselects { display: none; }
.db-fselects select, .db-fselects input {
  min-width: 0; background: #1d150d; color: #f0e2bf; border: 1px solid rgba(217,179,106,.4); border-radius: 16px;
  padding: 5px 8px; font-size: 13px; -webkit-appearance: none; appearance: none;
}
.db-fselects select { padding-right: 18px; background-image: linear-gradient(45deg, transparent 50%, #d9b36a 50%), linear-gradient(135deg, #d9b36a 50%, transparent 50%); background-position: calc(100% - 11px) 55%, calc(100% - 7px) 55%; background-size: 4px 4px; background-repeat: no-repeat; }
.db-fselects select.set { border-color: #f0cf6a; color: #fff3cf; background-color: #3a2a18; }
.db-tile.selected { outline: 3px solid #f0cf6a; outline-offset: 2px; border-radius: 8px; }
.db-tile.has .db-tile-badge { background: #6b440c; color: #fff3cf; }
.db-selbar {
  display: none; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px;
  border: 1px solid #f0cf6a; background: linear-gradient(180deg, #3a2a18, #22180e); box-shadow: 0 -6px 18px rgba(0,0,0,.45);
}
.db-selbar.show { display: flex; }
.db-selbar .db-sb-name { flex: 1; min-width: 0; display: flex; flex-direction: column; font-weight: 700; color: #fff0c8; }
.db-selbar .db-sb-name small { font-weight: 400; font-size: 11px; color: #bfae86; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-selbar .db-sb-step { display: flex; align-items: center; gap: 0; border: 1px solid rgba(217,179,106,.5); border-radius: 20px; overflow: hidden; }
.db-selbar .db-sb-step button { width: 44px; height: 38px; font-size: 22px; line-height: 1; background: #2a1f14; color: #f3e2b5; border: 0; cursor: pointer; touch-action: manipulation; }
.db-selbar .db-sb-step button:disabled { opacity: .35; }
.db-selbar .db-sb-n { min-width: 52px; text-align: center; font: 700 16px var(--font-mono-numbers, monospace); color: #fff3cf; }
.db-selbar .db-sb-n small { font-size: 11px; color: #bfae86; }
.db-selbar .db-sb-x { width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(217,179,106,.4); background: transparent; color: #d9c89f; font-size: 16px; }
.db-selbar .db-sb-info { padding: 6px 10px; font-size: 12px; }
@media (max-width: 1000px), (max-height: 520px) {
  .db-editor .db-filters .db-fgroup, .db-editor .db-filters .db-search { display: none !important; }
  .db-editor .db-fselects { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.4fr); gap: 6px; width: 100%; }
  .db-editor .db-filters { padding: 0 !important; overflow: visible !important; }
}
@media (max-width: 460px) {
  .db-editor .db-fselects { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .db-editor .db-fselects .db-search2 { grid-column: 1 / -1; }
}
/* 卡组列表页：模式页签 + 势力筛选合成一行，手机上横向滑动而不是换行占高 */
.db-list-view .db-listbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.db-list-view .db-listbar .db-mode-tabs { flex: none; }
.db-list-view .db-listbar .db-kfilter { flex: 1; min-width: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.db-list-view .db-listbar .db-kfilter::-webkit-scrollbar { display: none; }
.db-list-view .db-seg { display: inline-flex; border: 1px solid rgba(217,179,106,.45); border-radius: 18px; overflow: hidden; }
.db-list-view .db-seg .db-tab { border: 0; border-radius: 0; padding: 6px 14px; background: transparent; }
.db-list-view .db-seg .db-tab.active { background: #6b440c; }
.db-list-view .db-kfilter .db-chip { flex: none; }
@media (max-width: 520px) {
  .db-list-view .db-listbar { flex-direction: column; align-items: stretch; gap: 6px; }
  .db-list-view .db-seg { display: grid; grid-template-columns: 1fr 1fr; }
  .db-list-view .db-seg .db-tab { text-align: center; padding: 6px 4px; }
  .db-list-view .db-head-actions .db-btn { padding: 6px 9px; }
  .db-deck-grid { gap: 8px !important; }
  .db-deck-card { padding: 8px 10px !important; gap: 4px !important; }
  .db-deck-mid .db-curve { width: 84px; height: 26px; }
}
/* 矮屏：选中卡牌时，选中条代替底部状态条（顶部仍有“保存”） */
@media (max-height: 520px) { .db-selbar.show + .db-statusbar { display: none; } .db-selbar { padding: 4px 8px; } .db-selbar .db-sb-step button { height: 32px; } }
/* 横屏手机：倒计时 + 回合总时长并排显示，不再被右边裁掉 */
body.m-land:not(.m-port) #player-dock #turn-timer.dock-timer { min-width: 0; overflow: hidden; }
body.m-land:not(.m-port) #player-dock #turn-timer .turn-timer-chip { width: auto !important; flex: 0 0 auto; min-width: 0; flex-direction: row !important; white-space: nowrap; gap: 3px; line-height: 1; }
body.m-land:not(.m-port) #player-dock #turn-timer .turn-timer-total { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: clip; white-space: nowrap; }
body.m-land:not(.m-port) #player-dock #turn-timer.dock-timer { gap: 4px !important; }
body.m-land:not(.m-port) #player-dock #turn-timer .turn-timer-chip { font-size: 11px !important; padding: 1px 6px !important; overflow: hidden; text-overflow: clip; }
body.m-land:not(.m-port) #player-dock #turn-timer .turn-timer-total { font-size: 9.5px !important; letter-spacing: -.2px; }
/* 手牌放不下时整体缩小（不叠压）；选中的牌放大浮起便于阅读 */
body.m-land #player-dock .hand-card-fan { gap: 3px; }
body.m-land #player-dock .hand-card-fan .card-hand { margin-left: 0 !important; }
body.m-land #player-dock #hand-tray.hand-fan-tray.hand-tray-scroll { touch-action: pan-x !important; justify-content: flex-start !important; overflow-x: auto !important; overflow-y: hidden !important; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
body.m-land #player-dock #hand-tray.hand-tray-scroll::-webkit-scrollbar { display: none; }
body.m-land #player-dock .hand-card-fan.hand-scroll { justify-content: flex-start !important; padding: 0 4px; }
body.m-land #player-dock .hand-card-fan.hand-scroll .card-hand { touch-action: pan-x !important; }
body.m-land #player-dock .hand-card-fan.hand-scroll .card-hand.selected { transform: none !important; }
/* 阵亡残影：快速淡出缩小，不和补位上来的单位叠在一起 */
.bfx-ghost-wrap.bfx-dying { animation: bfxDieFast .55s ease-out forwards !important; }
@keyframes bfxDieFast {
  0% { opacity: .95; transform: none; filter: brightness(1.5) saturate(0); }
  100% { opacity: 0; transform: scale(.6) translateY(-10px); filter: grayscale(1) brightness(.5); }
}
/* 卡组编辑器 / 工坊里的卡牌只是展示：允许在卡牌上直接上下滑动（对局手牌的 touch-action:none 不影响这里） */
.deck-builder .card-hand, .deck-builder .db-tile, .deck-builder .db-tile-card, .deck-builder .db-tile * { touch-action: pan-y !important; }
.deck-builder .db-pool { touch-action: pan-y; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
/* 工坊积木：两行 + 自动说明 */
.ws-ab { display: flex; flex-direction: column; gap: 4px; padding: 6px !important; border: 1px solid rgba(217,179,106,.18); }
.ws-ab-more { font-size: 12px; }
.ws-ab-more select, .ws-ab-more input { font-size: 12px !important; padding: 3px 5px !important; flex: 0 1 auto !important; min-width: 0; }
.ws-ab-more .ab-f-badge, .ws-ab-more .ab-f-kw { width: 64px; }
.ws-ab-more .ab-c-val { width: 52px; }
.ws-ab-lbl { color: #9d8d6c; font-size: 11px; }
.ws-ab-desc { font-size: 12px; color: #f3d892; padding-left: 2px; }
.ws-form optgroup { color: #d9b36a; font-style: normal; }

/* 公孙瓒（白马银灰）势力配色 */
.card-hand.faction-gsz { border-color: #a39d8a !important; }
.card-hand.faction-gsz .card-header-bar { background: linear-gradient(180deg, #6f6a5c, #34312a) !important; }
.board-unit.faction-gsz { border-color: #bdb6a0 !important; }
.board-unit.faction-gsz .unit-header-bar { background: linear-gradient(180deg, rgba(100,95,82,.97), rgba(52,49,42,.85)) !important; }
.faction-emblem.faction-gsz { background: radial-gradient(circle at 35% 30%, #b3ac98, #3e3a31) !important; border-color: #e6e0cd !important; }
.card-hidden.faction-gsz .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #4a463c, #1c1a16) !important; }
.card-inspector-tooltip .inspector-card.faction-gsz { border-color: #bdb6a0; }
.seal-gsz { background: #7a7362; }
.hm-stripes .s-gsz { background: #9a927c; }
.hqp-field .enemy-chip.k-gsz.active { background: #7a7362; border-color: #e6e0cd; }

/* 卡组主页：图鉴 / 系统预设 / 我的卡组 */
.db-hub { overflow: hidden; }
.db-hub-tabs { display: flex; gap: 0; border-bottom: 1px solid rgba(217,179,106,.3); flex: none; }
.db-hub-tab { flex: 0 0 auto; padding: 9px 18px; background: transparent; border: 0; border-bottom: 2px solid transparent; color: #bfae86; font-size: 15px; letter-spacing: 3px; cursor: pointer; font-family: var(--font-serif-calligraphy); }
.db-hub-tab.active { color: #fff3cf; border-bottom-color: #f0cf6a; }
.db-hub-body { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding-top: 6px; -webkit-overflow-scrolling: touch; }
.db-codex-bar { display: flex; flex-direction: column; gap: 6px; position: sticky; top: 0; z-index: 3; background: linear-gradient(#1c140c 85%, transparent); padding-bottom: 6px; }
.db-codex-bar .db-kfilter { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.db-codex-bar .db-kfilter::-webkit-scrollbar { display: none; }
.db-kchip { display: inline-flex; align-items: center; gap: 6px; flex: none; padding: 3px 12px 3px 3px; font-size: 13px; }
.db-kchip .db-seal { width: 22px; height: 22px; font-size: 12px; }
.db-codex-filters { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.6fr); gap: 6px; }
.db-codex-count { margin: 0; font-size: 12px; color: #9d8d6c; }
.db-codex-grid { overflow: visible !important; flex: none !important; min-height: auto !important; }
.db-codex-tile { cursor: zoom-in; }
.db-tile-src.fill { background: rgba(80,110,160,.8) !important; }
.db-groups { display: flex; flex-direction: column; gap: 14px; }
.db-group-title { display: flex; align-items: center; gap: 8px; margin: 4px 0 6px; font-family: var(--font-serif-calligraphy); font-size: 17px; color: #f3d892; letter-spacing: 2px; }
.db-group-title small { font-family: inherit; font-size: 12px; color: #9d8d6c; letter-spacing: 0; }
.db-deck-note { font-size: 12px; color: #bfae86; line-height: 1.5; }
.db-hub .db-listbar .db-kfilter .db-chip { flex: none; }
@media (max-width: 520px) {
  .db-hub-tab { flex: 1 1 0; padding: 8px 4px; font-size: 14px; letter-spacing: 1px; }
  .db-codex-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .db-codex-filters .db-search2 { grid-column: 1 / -1; }
  .db-head-actions .db-btn { padding: 6px 9px; }
}
.db-hub .db-listbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.db-hub .db-seg { display: inline-flex; border: 1px solid rgba(217,179,106,.45); border-radius: 18px; overflow: hidden; }
.db-hub .db-seg .db-tab { border: 0; border-radius: 0; padding: 6px 14px; background: transparent; }
.db-hub .db-seg .db-tab.active { background: #6b440c; }
.db-hub .db-listbar .db-kfilter { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
@media (max-width: 520px) { .db-hub .db-seg { display: grid; grid-template-columns: 1fr 1fr; width: 100%; } .db-hub .db-seg .db-tab { text-align: center; } }
.hm-repo { color: #d9c69c; text-decoration: none; border-bottom: 1px solid rgba(217,179,106,.5); }
.hm-repo:hover { color: #fff3cf; }
@media (max-height: 520px) and (orientation: landscape) { .hm-foot { display: block !important; grid-column: 1 / -1; font-size: 10px; margin-top: 4px; } }
.rule-repo { margin: 0 0 12px; padding: 8px 10px; border: 1px dashed rgba(217,179,106,.45); border-radius: 8px; font-size: 13px; line-height: 1.7; color: #e6d6b3; }
.rule-repo a { color: #f3d892; word-break: break-all; }
.rule-repo code { background: rgba(0,0,0,.35); padding: 0 4px; border-radius: 4px; }
body.deck-builder-open #modal-card-inspector { z-index: 1700 !important; }
/* 多个主动技按钮 */
.skill-activate-wrap { position: fixed; z-index: 975; display: flex; flex-direction: column; gap: 4px; align-items: stretch; }
.skill-activate-wrap .skill-activate-btn { position: static !important; }
/* 工坊：技能块 */
.ws-skill { display: flex; flex-direction: column; gap: 6px; padding: 8px; border: 1px solid rgba(217,179,106,.35); border-radius: 10px; background: rgba(255,255,255,.03); margin-bottom: 8px; }
.ws-skill-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ws-skill-no { color: #f3d892; font-family: var(--font-serif-calligraphy); letter-spacing: 1px; min-width: 42px; }
.ws-skill-head .ab-trigger { flex: 1 1 140px; }
.ws-skill-head .ab-name { flex: 0 1 110px; }
.ws-efs { display: flex; flex-direction: column; gap: 6px; padding-left: 10px; border-left: 2px solid rgba(217,179,106,.3); }
.ws-ef { display: flex; flex-direction: column; gap: 3px; padding: 5px; border-radius: 8px; background: rgba(0,0,0,.2); }
.ws-ef .ws-row > select, .ws-ef .ws-row > input { flex: 1 1 90px; }
.ws-ef .ab-amount { flex: 0 0 56px !important; }
.ws-ef .ab-keyword { flex: 0 1 80px !important; }
.ws-skill-foot { display: flex; align-items: flex-start; gap: 8px; }
.ws-skill-foot .ws-add-ef { flex: none; padding: 3px 10px; font-size: 12px; }
.ws-skill-foot .ws-ab-desc { flex: 1; }
.ws-sub-btns { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ws-badge-chips .db-chip.active { background: #6b440c; border-color: #f0cf6a; color: #fff3cf; }
.ws-badge-hint { margin-top: -2px; font-size: 11px; }
.card-hand .card-name-banner.name-long { font-size: 11px !important; letter-spacing: 0 !important; text-overflow: clip !important; }

/* ---- 袁绍 / 黄巾 / 董卓 / 西凉 / 刘表 ---- */
.card-hand.faction-ys { border-color: #c9822a !important; }
.card-hand.faction-ys .card-header-bar { background: linear-gradient(180deg, #c9822a, #6e4410) !important; }
.board-unit.faction-ys { border-color: #f0c98a !important; }
.board-unit.faction-ys .unit-header-bar { background: linear-gradient(180deg, #c9822af7, #6e4410d9) !important; }
.faction-emblem.faction-ys { background: radial-gradient(circle at 35% 30%, #f0c98a, #6e4410) !important; border-color: #f0c98a !important; }
.card-hidden.faction-ys .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #c9822a, #6e4410) !important; }
.card-inspector-tooltip .inspector-card.faction-ys { border-color: #f0c98a; }
.seal-ys { background: #c9822a; }
.hm-stripes .s-ys { background: #c9822a; }
.hqp-field .enemy-chip.k-ys.active { background: #c9822a; border-color: #f0c98a; }
.card-hand.faction-hj { border-color: #b8962a !important; }
.card-hand.faction-hj .card-header-bar { background: linear-gradient(180deg, #b8962a, #5e4a0c) !important; }
.board-unit.faction-hj { border-color: #efdc8e !important; }
.board-unit.faction-hj .unit-header-bar { background: linear-gradient(180deg, #b8962af7, #5e4a0cd9) !important; }
.faction-emblem.faction-hj { background: radial-gradient(circle at 35% 30%, #efdc8e, #5e4a0c) !important; border-color: #efdc8e !important; }
.card-hidden.faction-hj .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #b8962a, #5e4a0c) !important; }
.card-inspector-tooltip .inspector-card.faction-hj { border-color: #efdc8e; }
.seal-hj { background: #b8962a; }
.hm-stripes .s-hj { background: #b8962a; }
.hqp-field .enemy-chip.k-hj.active { background: #b8962a; border-color: #efdc8e; }
.card-hand.faction-dz { border-color: #4a4346 !important; }
.card-hand.faction-dz .card-header-bar { background: linear-gradient(180deg, #4a4346, #1e1a1c) !important; }
.board-unit.faction-dz { border-color: #b9b0b3 !important; }
.board-unit.faction-dz .unit-header-bar { background: linear-gradient(180deg, #4a4346f7, #1e1a1cd9) !important; }
.faction-emblem.faction-dz { background: radial-gradient(circle at 35% 30%, #b9b0b3, #1e1a1c) !important; border-color: #b9b0b3 !important; }
.card-hidden.faction-dz .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #4a4346, #1e1a1c) !important; }
.card-inspector-tooltip .inspector-card.faction-dz { border-color: #b9b0b3; }
.seal-dz { background: #4a4346; }
.hm-stripes .s-dz { background: #4a4346; }
.hqp-field .enemy-chip.k-dz.active { background: #4a4346; border-color: #b9b0b3; }
.card-hand.faction-xl { border-color: #5f86b8 !important; }
.card-hand.faction-xl .card-header-bar { background: linear-gradient(180deg, #5f86b8, #26405e) !important; }
.board-unit.faction-xl { border-color: #c5d8f0 !important; }
.board-unit.faction-xl .unit-header-bar { background: linear-gradient(180deg, #5f86b8f7, #26405ed9) !important; }
.faction-emblem.faction-xl { background: radial-gradient(circle at 35% 30%, #c5d8f0, #26405e) !important; border-color: #c5d8f0 !important; }
.card-hidden.faction-xl .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #5f86b8, #26405e) !important; }
.card-inspector-tooltip .inspector-card.faction-xl { border-color: #c5d8f0; }
.seal-xl { background: #5f86b8; }
.hm-stripes .s-xl { background: #5f86b8; }
.hqp-field .enemy-chip.k-xl.active { background: #5f86b8; border-color: #c5d8f0; }
.card-hand.faction-lbiao { border-color: #6f9e3a !important; }
.card-hand.faction-lbiao .card-header-bar { background: linear-gradient(180deg, #6f9e3a, #33501a) !important; }
.board-unit.faction-lbiao { border-color: #cfe6a8 !important; }
.board-unit.faction-lbiao .unit-header-bar { background: linear-gradient(180deg, #6f9e3af7, #33501ad9) !important; }
.faction-emblem.faction-lbiao { background: radial-gradient(circle at 35% 30%, #cfe6a8, #33501a) !important; border-color: #cfe6a8 !important; }
.card-hidden.faction-lbiao .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #6f9e3a, #33501a) !important; }
.card-inspector-tooltip .inspector-card.faction-lbiao { border-color: #cfe6a8; }
.seal-lbiao { background: #6f9e3a; }
.hm-stripes .s-lbiao { background: #6f9e3a; }
.hqp-field .enemy-chip.k-lbiao.active { background: #6f9e3a; border-color: #cfe6a8; }
.card-hand.faction-yshu { border-color: #8a6a3c !important; }
.card-hand.faction-yshu .card-header-bar { background: linear-gradient(180deg, #8a6a3c, #3e2c14) !important; }
.board-unit.faction-yshu { border-color: #e0c89a !important; }
.board-unit.faction-yshu .unit-header-bar { background: linear-gradient(180deg, #8a6a3cf7, #3e2c14d9) !important; }
.faction-emblem.faction-yshu { background: radial-gradient(circle at 35% 30%, #e0c89a, #3e2c14) !important; border-color: #e0c89a !important; }
.card-hidden.faction-yshu .card-back-pattern { background: radial-gradient(circle at 50% 50%, rgba(217,179,106,.25), transparent 60%), repeating-linear-gradient(45deg, rgba(217,179,106,.08) 0 2px, transparent 2px 9px), linear-gradient(180deg, #8a6a3c, #3e2c14) !important; }
.card-inspector-tooltip .inspector-card.faction-yshu { border-color: #e0c89a; }
.seal-yshu { background: #8a6a3c; }
.hm-stripes .s-yshu { background: #8a6a3c; }
.hqp-field .enemy-chip.k-yshu.active { background: #8a6a3c; border-color: #e0c89a; }

/* 明牌 */
.opp-known-cards { display: flex; align-items: center; gap: 4px; max-width: 34vw; overflow-x: auto; scrollbar-width: none; }
.opp-known-cards .okc-label { font-size: 11px; color: #e8c877; letter-spacing: 1px; flex: none; }
.opp-known-cards .okc-chip { flex: none; font-size: 11px; line-height: 1; padding: 4px 7px; border-radius: 10px; border: 1px solid rgba(232,200,119,.55); background: rgba(40,28,14,.85); color: #f3e3bd; cursor: pointer; white-space: nowrap; }
.card-hand.card-known::after { content: '明'; position: absolute; left: 4px; bottom: 4px; font-size: 10px; line-height: 1; padding: 2px 3px; border-radius: 3px; background: rgba(180,60,40,.9); color: #fff; pointer-events: none; z-index: 5; }
/* 图鉴/卡池：卡牌内部元素（费用、标签等）自成层叠上下文，滚动时不再压过顶部导航与筛选栏 */
.db-pool .db-tile, .db-deck-grid > * { isolation: isolate; position: relative; z-index: 0; }
.db-codex-bar { z-index: 20; }
.db-hub-tabs { position: relative; z-index: 21; }
.db-codex-bar { top: -6px; padding-top: 6px; background: #1c140c; box-shadow: 0 8px 10px -4px #1c140c; }
/* 无插画卡：名字首字印章 */
.card-art-placeholder:not(.has-art)[data-glyph], .unit-portrait-mini:not(.has-art)[data-glyph] { position: relative; }
.card-art-placeholder:not(.has-art)[data-glyph]::before, .unit-portrait-mini:not(.has-art)[data-glyph]::before {
  content: attr(data-glyph); position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none;
  font-family: var(--font-serif-calligraphy, serif); font-size: 44px; font-weight: 700; color: rgba(255, 236, 190, .82);
  text-shadow: 0 2px 6px rgba(0,0,0,.55); background: radial-gradient(circle at 50% 45%, rgba(255,220,150,.14), transparent 62%);
}
.unit-portrait-mini:not(.has-art)[data-glyph]::before { font-size: 26px; }
/* 势力下拉抽屉 */
.faction-picker { position: relative; display: inline-block; max-width: 100%; }
.faction-picker .fp-trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 12px 4px 5px; border-radius: 20px; border: 1px solid rgba(217,179,106,.55); background: rgba(38,26,12,.92); color: #f5e6c3; font-size: 14px; cursor: pointer; max-width: 100%; }
.faction-picker .fp-trigger:hover, .faction-picker.open .fp-trigger { border-color: #f0cf6a; background: rgba(60,40,16,.95); }
.faction-picker .fp-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: 1px; }
.faction-picker .fp-caret { width: 0; height: 0; margin-left: 2px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #e8c877; transition: transform .15s; flex: none; }
.faction-picker.open .fp-caret { transform: rotate(180deg); }
.faction-picker .fp-panel { position: absolute; top: calc(100% + 6px); left: 0; z-index: 2000; display: none; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; width: min(560px, calc(100vw - 32px)); max-height: min(60vh, 380px); overflow-y: auto; padding: 10px; border-radius: 12px; border: 1px solid rgba(217,179,106,.5); background: #1e150b; box-shadow: 0 12px 30px rgba(0,0,0,.6); }
.faction-picker.open .fp-panel { display: grid; animation: fpIn .14s ease-out; }
@keyframes fpIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.faction-picker .fp-opt { display: flex; align-items: center; gap: 7px; padding: 6px 8px; border-radius: 9px; border: 1px solid rgba(217,179,106,.22); background: rgba(255,240,200,.04); color: #ecdcb6; font-size: 13px; cursor: pointer; text-align: left; }
.faction-picker .fp-opt:hover { border-color: rgba(240,207,106,.7); background: rgba(255,240,200,.1); }
.faction-picker .fp-opt.active { border-color: #f0cf6a; background: rgba(107,68,12,.75); color: #fff3cf; }
.faction-picker .fp-seal { flex: none; }
.fp-seal.seal-RANDOM { background: #5b5347; }
.hqp-field .faction-picker .fp-panel { width: min(420px, calc(100vw - 100px)); }
@media (max-width: 560px) { .faction-picker .fp-panel { grid-template-columns: repeat(2, 1fr); } }

/* ---- 技能提示/战报浮条：画面正中 ---- */
.toast-stack, body.m-land .toast-stack, body.m-port .toast-stack {
  left: 50% !important; right: auto !important; top: 40% !important; bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(460px, calc(100vw - 32px)) !important; align-items: center !important; z-index: 950 !important;
}
.toast-stack .toast-item { text-align: center; font-size: 13px !important; padding: 6px 14px !important; border-radius: 10px !important; background: rgba(20,14,8,.9); }
body.at-home .toast-stack { top: 30% !important; }

/* ---- 详情浮窗压在“取消”、选择条之上 ---- */
.card-inspector-tooltip { z-index: 985 !important; }

/* ---- 顶部与底部都留出手机系统区域（刘海/状态栏/底部横条） ---- */
body.m-port #game-app.game-container, body.m-land #game-app.game-container {
  box-sizing: border-box;
  padding-top: calc(env(safe-area-inset-top, 0px) + 6px) !important;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 4px) !important;
  padding-left: env(safe-area-inset-left, 0px) !important; padding-right: env(safe-area-inset-right, 0px) !important;
}

/* ---- 竖屏：我方状态栏重新排版 ---- */
body.m-port #game-app.game-container { grid-template-rows: 36px minmax(0, 1fr) 50px 104px; }
body.m-port #player-dock .player-hq-meta { grid-column: 1 / 3 !important; margin: 4px 2px 4px 4px !important; padding: 4px 6px !important; min-width: 0; overflow: hidden; }
body.m-port #player-dock .player-hq-meta .hq-status-group { width: 100% !important; min-width: 0; }
body.m-port #player-dock .player-hq-meta .hq-label { display: none !important; }
body.m-port #player-dock .player-hq-meta .hq-label-row { justify-content: center !important; margin: 0 0 3px !important; }
body.m-port #player-dock .player-hq-meta .hq-hp-numeric { font-size: 13px !important; letter-spacing: -.5px; white-space: nowrap; }
body.m-port #player-dock .player-hq-meta .hq-hp-bar { height: 5px !important; }
body.m-port #player-dock .player-resources { grid-column: 3 / 9 !important; padding: 4px 8px !important; gap: 10px !important; }
body.m-port #player-dock .granary-cluster, body.m-port #player-dock .prestige-cluster { display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 3px !important; }
body.m-port #player-dock .granary-cluster { flex: 1 1 auto !important; }
body.m-port #player-dock .prestige-cluster { flex: 0 0 auto !important; }
body.m-port #player-dock .granary-header, body.m-port #player-dock .prestige-header { display: flex !important; justify-content: flex-start !important; align-items: center !important; gap: 4px !important; }
body.m-port #player-dock .granary-title, body.m-port #player-dock .prestige-title { font-size: 0 !important; flex: none; }
body.m-port #player-dock .granary-title::before, body.m-port #player-dock .prestige-title::before { font-size: 13px; }
body.m-port #player-dock .granary-numbers, body.m-port #player-dock .prestige-numbers { font-size: 13px !important; }
body.m-port #player-dock .granary-pips-row { gap: 2px !important; }
body.m-port #player-dock .granary-pips-row .grain-pip { width: 8px !important; height: 8px !important; }
body.m-port #player-dock #turn-timer.dock-timer { grid-column: 9 / 10 !important; margin: 4px 1px !important; }
body.m-port #player-dock #turn-timer .turn-timer-chip { font-size: 11px !important; }
body.m-port #player-dock .player-deck-actions { grid-column: 10 / 13 !important; }
body.m-port #player-dock #btn-end-turn { font-size: 12px !important; white-space: nowrap !important; overflow: hidden; padding: 0 2px !important; }
body.m-port #player-dock #btn-end-turn .seal-text { white-space: nowrap; }
body.m-port #player-dock .granary-cluster, body.m-port #player-dock .prestige-cluster { width: auto !important; }
body.m-port #player-dock .granary-cluster { flex: 1 1 0 !important; }
body.m-port #player-dock .prestige-cluster { padding-left: 8px; border-left: 1px solid rgba(217,179,106,.25); }
/* 竖屏：提示贴在卡牌详情上方 */
.toast-alert.toast-near-info { transform: translateY(-100%) !important; bottom: auto !important; max-width: none !important; box-sizing: border-box; border-radius: 10px 10px 0 0; z-index: 990 !important; }
.toast-alert.toast-near-info.toast-show { transform: translateY(-100%) !important; }
/* 竖屏倒计时：居中、不换行 */
body.m-port #player-dock #turn-timer.dock-timer { display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; overflow: hidden; }
body.m-port #player-dock #turn-timer .turn-timer-chip { width: 100%; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center; white-space: nowrap; }
body.m-port #player-dock #turn-timer #turn-timer-text { white-space: nowrap; word-break: keep-all; display: block; text-align: center; min-width: 2.2em; }
body.m-port #player-dock #turn-timer .turn-timer-fill, body.m-port #player-dock #turn-timer .turn-timer-track { display: none; }
/* 弹窗整体避开手机状态栏/底部横条（规则、菜单等的关闭按钮不再被遮挡） */
.modal-overlay { box-sizing: border-box; padding: calc(env(safe-area-inset-top, 0px) + 8px) calc(env(safe-area-inset-right, 0px) + 8px) calc(env(safe-area-inset-bottom, 0px) + 8px) calc(env(safe-area-inset-left, 0px) + 8px); }
.modal-overlay > .modal-box { max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px) !important; }
.rulebook-box { display: flex; flex-direction: column; overflow: hidden !important; }
.rulebook-box .modal-header { flex: none; position: sticky; top: 0; z-index: 2; }
.rulebook-box .rulebook-content-scroll { flex: 1 1 auto; min-height: 0; }
.toast-alert.toast-near-info { font-size: 14px !important; line-height: 1.45; padding: 7px 12px !important; background: rgba(120,40,24,.96) !important; border-color: rgba(240,180,120,.6) !important; border-bottom: 0 !important; }