/* ============================================================
   royal.css — "Knight" royal reskin (cream / metallic gold / royal red)
   Layered AFTER base.css + reskin.css + game.css. Pure theming:
   no layout changes, no JS touched. Reversible by removing the <link>.

   Palette (from the red-throne wallpaper):
     cream / ivory   #fdf6e9  #f6e8cb  #f1ddbb
     parchment grad  linear-gradient(165deg,#fdf6e9,#f1ddbb)
     metallic gold   #fbe9b4 -> #e8c466 -> #c79a3c -> #a87f2f
     gold line       #bd9436
     royal red       #a3122a   deep #7d0f20   bright #c4283f
     red gradient    linear-gradient(180deg,#c4283f,#931024)
     ink / body text #5e3a2a (warm brown)   header #8e1322 (royal red)
   ============================================================ */

/* Surrounding letterbox behind the phone frame: regal burgundy. */
body.reskin-active {
  background:
    radial-gradient(ellipse at 50% -10%, #5a1622 0%, #380d16 55%, #240810 100%) !important;
}

/* ====================================================================
   1. HOME HUD — name card, XP card, Lv pill, star, gear, stat pills
   ==================================================================== */

body.reskin-active .reskin-name-card,
body.reskin-active .reskin-xp-card {
  background: linear-gradient(180deg, #fdf7ea, #f6e8cb) !important;
  background-image: linear-gradient(180deg, #fdf7ea, #f6e8cb) !important;
  border: 1px solid #d6b25a !important;
  box-shadow:
    0 7px 16px rgba(70,30,20,0.22),
    inset 0 1px 0 rgba(255,255,255,0.85),
    inset 0 0 0 1px rgba(255,243,210,0.6) !important;
}

body.reskin-active #pet-name-label {
  color: #3f2418 !important;
}

/* Level badge — shiny metallic gold coin-pill with deep-red text. */
body.reskin-active .reskin-lv-pill {
  background: linear-gradient(180deg, #fbeab8 0%, #ecc66c 42%, #cb9f3f 72%, #b1862f 100%) !important;
  background-image: linear-gradient(180deg, #fbeab8 0%, #ecc66c 42%, #cb9f3f 72%, #b1862f 100%) !important;
  color: #7d1320 !important;
  border: 1px solid #a07a2a !important;
  box-shadow:
    inset 0 1px 0 rgba(255,250,230,0.85),
    inset 0 -2px 3px rgba(140,100,30,0.4),
    0 3px 7px rgba(120,80,20,0.28) !important;
  text-shadow: 0 1px 0 rgba(255,245,210,0.55) !important;
}

/* XP star — gold disc, royal-red star glyph. */
body.reskin-active .reskin-star {
  background: linear-gradient(180deg, #fbeab8 0%, #e8c163 55%, #c49a3c 100%) !important;
  color: #7d1320 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,250,230,0.8),
    0 3px 7px rgba(120,80,20,0.28) !important;
}

body.reskin-active .reskin-xp-label { color: #6b4326 !important; }

/* XP fill — molten gold sweep. */
body.reskin-active .xp-bar-fill {
  background: linear-gradient(90deg, #c89234, #f1d27a 60%, #e8c163) !important;
  background-image: linear-gradient(90deg, #c89234, #f1d27a 60%, #e8c163) !important;
  box-shadow: 0 0 8px rgba(210,160,50,0.55), inset 0 1px 0 rgba(255,255,255,0.5) !important;
}
body.reskin-active .xp-bar-bg {
  background: rgba(90,40,20,0.16) !important;
}

/* Settings cog — cream/gold to match. */
body.reskin-active #settings-cog-btn {
  background: linear-gradient(180deg, #fdf7ea, #f0ddb6) !important;
  color: #9a3320 !important;
  border: 1px solid #d6b25a !important;
  box-shadow:
    0 4px 9px rgba(120,70,20,0.2),
    inset 0 1px 0 rgba(255,255,255,0.9) !important;
}

/* Stat pills (icon + slim bar) — cream capsules with thin gold edge.
   Fill colours (hunger/clean/happy) are intentionally LEFT as-is. */
body.reskin-active #stats-bar .reskin-stat {
  background: linear-gradient(180deg, rgba(253,247,234,0.97), rgba(246,232,203,0.97)) !important;
  border: 1px solid rgba(196,156,70,0.7) !important;
  box-shadow:
    0 2px 8px rgba(80,40,15,0.16),
    inset 0 1px 0 rgba(255,255,255,0.8) !important;
}

/* ====================================================================
   2. DRAWERS (wardrobe / herb / settings) + section chrome
   ==================================================================== */

body.reskin-active .drawer {
  background: linear-gradient(168deg, #fdf6e9 0%, #f3e0bf 100%) !important;
  border-top: 2px solid #c79a3c !important;
  box-shadow:
    0 -14px 32px rgba(70,30,15,0.28),
    inset 0 2px 0 rgba(255,248,225,0.7) !important;
}
body.reskin-active .drawer-header {
  background: #fdf6e9 !important;
}
/* Drawer titles use a gradient text-clip in base.css — reset and recolour. */
body.reskin-active .drawer-header span {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #8e1322 !important;
  color: #8e1322 !important;
}
body.reskin-active .drawer-header button {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}

/* Pill toggle buttons (wardrobe tabs etc.) */
body.reskin-active .g-btn.active {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  border-color: #d8b25a !important;
  color: #fff8e6 !important;
  box-shadow: 0 2px 6px rgba(120,20,30,0.4), inset 0 1px 0 rgba(255,255,255,0.25) !important;
}

/* 采药 herb-menu action buttons */
body.reskin-active #herb-drawer .herb-menu-counts { color: #8e1322 !important; }
body.reskin-active #herb-drawer .herb-menu-game {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.25) !important;
}
body.reskin-active #herb-drawer .herb-menu-game.soon {
  background: #efe2c6 !important;
  color: #a98a5e !important;
}

/* ====================================================================
   3. CARE SHEET (inline-styled in screen.js) + generic modal-x
   ==================================================================== */

body.reskin-active #care-sheet {
  background: linear-gradient(165deg, #fdf6e9, #f3e0bf) !important;
  border: 3px solid #d6b25a !important;
  box-shadow: 0 12px 30px rgba(70,30,15,0.32), inset 0 1px 0 rgba(255,248,225,0.7) !important;
}
body.reskin-active #care-sheet > div:first-of-type,
body.reskin-active #care-sheet > div { color: #8e1322 !important; }
body.reskin-active #care-feed-btn {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1px solid #bd9436 !important;
  color: #7d3a10 !important;
}
body.reskin-active #care-clean-btn {
  background: linear-gradient(180deg, #eaf3ff, #d4e7fb) !important;
  border: 1px solid #9cc1e6 !important;
  color: #2f5a86 !important;
}

/* Generic close button used by market/tasks/battle modals. */
body.reskin-active .modal-x {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}

/* ====================================================================
   4. LOOT / LEVEL-UP / TASKS modals (cream-gold cards already)
   ==================================================================== */

body.reskin-active #loot-overlay .loot-card,
body.reskin-active #levelup-overlay .levelup-card,
body.reskin-active #tasks-card {
  background: linear-gradient(165deg, #fdf6e9, #f1ddbb) !important;
  border: 4px solid #ddbe72 !important;
  box-shadow: 0 16px 40px rgba(60,25,12,0.4), inset 0 2px 0 rgba(255,248,225,0.8) !important;
}
body.reskin-active #loot-overlay .loot-title,
body.reskin-active #loot-overlay .loot-row-amount,
body.reskin-active #levelup-overlay .levelup-title,
body.reskin-active #tasks-card .tasks-title { color: #8e1322 !important; }

body.reskin-active #loot-overlay .loot-row,
body.reskin-active #tasks-card .tk-item {
  background: #fffaf0 !important;
  border: 1px solid rgba(196,156,70,0.55) !important;
}
body.reskin-active #loot-overlay .loot-row-name,
body.reskin-active #tasks-card .tk-name { color: #5a3a28 !important; }
body.reskin-active #loot-overlay .loot-row-sub,
body.reskin-active #tasks-card .tk-sub { color: #b08a3e !important; }

/* Icon-less loot rows (only the battle-win XP reward) — show the ✨ in the
   first column so it lines up with the image icons of the other rows. */
body.reskin-active #loot-overlay .loot-row-icon:empty {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 26px !important;
  line-height: 1 !important;
}
body.reskin-active #loot-overlay .loot-row-icon:empty::before {
  content: "\2728";
}

/* Primary / secondary buttons across these modals. */
body.reskin-active #loot-overlay .loot-btn-primary,
body.reskin-active #levelup-overlay .levelup-btn {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  box-shadow: 0 6px 14px rgba(120,20,30,0.42), inset 0 1px 0 rgba(255,255,255,0.22) !important;
}
body.reskin-active #loot-overlay .loot-btn-secondary {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  color: #8e1322 !important;
  border: 1.5px solid #bd9436 !important;
}

/* Level number — molten gold instead of pink/purple. */
body.reskin-active #levelup-overlay .levelup-lv {
  background: linear-gradient(90deg, #c89234, #f3d684, #c89234) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body.reskin-active #levelup-overlay .levelup-name { color: #9a3320 !important; }

/* Tasks tabs / checks / add button. */
body.reskin-active #tasks-card .tasks-tab {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}
body.reskin-active #tasks-card .tasks-tab.active,
body.reskin-active #tasks-card .tk-check.done,
body.reskin-active #tasks-card .tk-add-btn {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  border-color: #d8b25a !important;
  color: #fff8e6 !important;
}
body.reskin-active #tasks-card .tk-check { border-color: #bd9436 !important; }
body.reskin-active #tasks-card .tk-add input { border-color: #d8bd7e !important; background: #fffaf0 !important; color: #5a3a28 !important; }
body.reskin-active #tasks-card .tk-add input:focus { border-color: #c4283f !important; }
body.reskin-active #tasks-card .tk-del { background: #f3e3c6 !important; color: #9a5a3a !important; }

/* ====================================================================
   5. MARKET (市集)
   ==================================================================== */

body.reskin-active #market-page {
  background: linear-gradient(180deg, #fdf6e9, #f1ddbb) !important;
  box-shadow: 0 -10px 30px rgba(60,25,12,0.32) !important;
  border-top: 2px solid #c79a3c !important;
}
body.reskin-active .mk-sheet-head { background: #fdf6e9 !important; }
body.reskin-active .mk-grab { background: rgba(150,100,40,0.4) !important; }
body.reskin-active #mk-header,
body.reskin-active #mk-shop-title { color: #8e1322 !important; }

body.reskin-active .mk-shop-btn {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  border: 1px solid #d8b25a !important;
  box-shadow: 0 4px 11px rgba(120,20,30,0.3), inset 0 1px 0 rgba(255,255,255,0.22) !important;
}
body.reskin-active .mk-back {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}
body.reskin-active .mk-soon { color: #8e1322 !important; background: #fbf1da !important; }

body.reskin-active .mk-forge-row {
  background: linear-gradient(165deg, #fdf6e9, #f3e0bf) !important;
  border: 1px solid #ddbe72 !important;
  box-shadow: 0 4px 12px rgba(70,30,15,0.18) !important;
}
body.reskin-active .mk-forge-name { color: #5a3a28 !important; }
body.reskin-active .mk-forge-meta { color: #8e6a3a !important; }
body.reskin-active .mk-ing { background: #fffaf0 !important; color: #6b4326 !important; border: 1px solid rgba(196,156,70,0.5) !important; }
body.reskin-active .mk-ing.short { background: #f7dcd4 !important; color: #a32414 !important; border-color: #d99a8a !important; }
body.reskin-active .mk-rar.common { background: #ecddc0 !important; color: #8e6a3a !important; }
body.reskin-active .mk-rar.rare {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
}
body.reskin-active .mk-forge-btn {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  border: 1px solid #d8b25a !important;
}
body.reskin-active .mk-forge-btn:disabled {
  background: #d8c6a8 !important;
  border-color: #c7b48f !important;
  color: #fbf4e6 !important;
}
body.reskin-active .mk-pawn-tab {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}
body.reskin-active .mk-pawn-tab.on {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  border-color: #d8b25a !important;
  color: #fff8e6 !important;
}
body.reskin-active .mk-coin-bar { color: #8e1322 !important; }

/* ====================================================================
   6. BATTLE (战斗) — hub, modal actions, picker
   ==================================================================== */

body.reskin-active #battle-hub {
  background: linear-gradient(180deg, #fdf6e9, #f1ddbb) !important;
}
body.reskin-active #battle-hub #hub-header,
body.reskin-active .hub-sec-title,
body.reskin-active .hub-card-name { color: #8e1322 !important; }
body.reskin-active .hub-sec-sub,
body.reskin-active .hub-card-tag,
body.reskin-active .hub-empty { color: #a98a5e !important; }
body.reskin-active .hub-card-uses { color: #b07a1e !important; }

body.reskin-active .hub-hero-kicker { color: #ffd98a !important; }
body.reskin-active .hub-tab { background: rgba(154,122,74,0.14) !important; color: #9a7a5a !important; }
body.reskin-active .hub-tab-on { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .kf-title { color: #b1862f !important; }
body.reskin-active .kf-refresh { color: #8a6a2e !important; background: rgba(180,134,47,0.16) !important; }
body.reskin-active .kf-row { color: #5a4636 !important; background: #fffaf0 !important; box-shadow: 0 2px 8px rgba(150,110,40,0.12) !important; }
body.reskin-active .kf-who { color: #6b4a22 !important; }
body.reskin-active .kf-act { color: #9a8268 !important; }
body.reskin-active .kf-enemy { color: #5a4636 !important; }
body.reskin-active .kf-elite { background: rgba(43,160,92,0.13) !important; }
body.reskin-active .kf-elite .kf-enemy { color: #1c8a4a !important; }
body.reskin-active .kf-boss { background: rgba(224,125,16,0.14) !important; }
body.reskin-active .kf-boss .kf-enemy { color: #c0700a !important; }
body.reskin-active .kf-empty { color: #9a8268 !important; }
body.reskin-active .hub-enter {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  border: 1px solid #d8b25a !important;
  box-shadow: 0 8px 18px rgba(120,20,30,0.45) !important;
}
body.reskin-active .hub-section {
  background: #fffdf6 !important;
  border: 2px solid #e7cd95 !important;
  box-shadow: 0 6px 16px rgba(70,30,15,0.14) !important;
}
body.reskin-active .hub-sec-badge {
  background: #fdf2d6 !important;
  border: 1px solid #bd9436 !important;
  color: #8e1322 !important;
}
body.reskin-active .hub-card-img {
  background: linear-gradient(165deg, #fdf6e9, #f3e0bf) !important;
  border: 1.5px solid #ddbe72 !important;
}

/* Battle modal action bar. */
body.reskin-active .bt-action { color: #7d3a10 !important; background: linear-gradient(180deg,#fffaf0,#f4e6cb) !important; }
body.reskin-active .bt-action.primary {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  color: #fff8e6 !important;
  border: 1px solid #d8b25a !important;
}
body.reskin-active .bt-action.retreat {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  color: #8e1322 !important;
  border: 1.5px solid #bd9436 !important;
}
body.reskin-active .bt-bar.enemy .bt-bar-fill {
  background: linear-gradient(90deg, #e0556a, #a3122a) !important;
}
/* Item picker */
body.reskin-active .bt-picker {
  background: linear-gradient(165deg, #fdf6e9, #f3e0bf) !important;
  border: 1px solid #ddbe72 !important;
}
body.reskin-active .bt-pick-head,
body.reskin-active .bt-pick-name { color: #8e1322 !important; }
body.reskin-active .bt-pick-x {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1.5px solid #bd9436 !important;
  color: #8e1322 !important;
}
body.reskin-active .bt-pick-item { background: #fffaf0 !important; }
body.reskin-active .bt-pick-sub { color: #8e6a3a !important; }

/* ====================================================================
   7. MINI-GAMES — modal backdrops, HUD cards, overlays, buttons, 2048
   ==================================================================== */

body.reskin-active #minigame-modal,
body.reskin-active #catch-modal,
body.reskin-active #zzkp-modal,
body.reskin-active #number-track-modal,
body.reskin-active #game2048-modal {
  background: linear-gradient(180deg, #fbf1dd 0%, #f3ddc0 55%, #ecd2aa 100%) !important;
  color: #5e3a2a !important;
}
/* match-3 sits on its own room photo — give it a warm veil instead of pink. */
body.reskin-active #minigame-modal::before {
  background: linear-gradient(180deg, rgba(255,248,232,0.18) 0%, rgba(250,235,205,0.34) 100%) !important;
}

/* HUD cards (all games share the merged selector group). */
body.reskin-active #mg-hud-main,
body.reskin-active #cg-hud-main,
body.reskin-active #zzkp-hud-main,
body.reskin-active #nt-hud-main,
body.reskin-active #g2048-hud-main {
  background: linear-gradient(180deg, rgba(253,247,234,0.96), rgba(246,232,203,0.94)) !important;
  border: 1px solid rgba(196,156,70,0.7) !important;
  box-shadow: 0 10px 24px rgba(90,50,20,0.22), inset 0 2px 0 rgba(255,250,235,0.8) !important;
}
body.reskin-active .mg-hud-k,
body.reskin-active .cg-hud-k,
body.reskin-active .zzkp-hud-k,
body.reskin-active .nt-hud-item span:first-child,
body.reskin-active .g2048-hud-k { color: #a07a44 !important; }
body.reskin-active #mg-score-label,
body.reskin-active #mg-best-label,
body.reskin-active #mg-xp-label,
body.reskin-active #mg-time-label,
body.reskin-active .cg-hud-v,
body.reskin-active .zzkp-hud-v,
body.reskin-active .nt-hud-item span:last-child,
body.reskin-active .g2048-hud-v { color: #8e1322 !important; }
body.reskin-active .cg-hud-divider,
body.reskin-active .zzkp-hud-divider,
body.reskin-active .nt-hud-divider,
body.reskin-active .g2048-hud-divider {
  background: linear-gradient(180deg, transparent, rgba(196,156,70,0.8) 22%, rgba(196,156,70,0.8) 78%, transparent) !important;
}

/* Overlay cards + titles. */
body.reskin-active #mg-overlay-card,
body.reskin-active #cg-overlay-card,
body.reskin-active #zzkp-overlay-card,
body.reskin-active #nt-overlay-card,
body.reskin-active #g2048-overlay-card {
  background: linear-gradient(165deg, #fdf6e9, #f1ddbb) !important;
  border: 1px solid #ddbe72 !important;
  box-shadow: 0 16px 34px rgba(60,25,12,0.34), inset 0 2px 0 rgba(255,248,225,0.8) !important;
}
body.reskin-active #mg-overlay-title,
body.reskin-active #cg-overlay-title,
body.reskin-active #zzkp-overlay-title,
body.reskin-active #nt-overlay-title,
body.reskin-active #g2048-overlay-title { color: #8e1322 !important; }
body.reskin-active #mg-overlay-text,
body.reskin-active #cg-overlay-text,
body.reskin-active #zzkp-overlay-text,
body.reskin-active #nt-overlay-text,
body.reskin-active #g2048-overlay-text { color: #6b4326 !important; }

/* Start / close buttons. */
body.reskin-active #mg-start-btn,
body.reskin-active #cg-start-btn,
body.reskin-active #nt-start-btn,
body.reskin-active #g2048-start-btn {
  background: linear-gradient(180deg, #c4283f, #931024) !important;
  border: 1px solid #d8b25a !important;
  color: #fff8e6 !important;
  box-shadow: 0 10px 20px rgba(120,20,30,0.32), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}
body.reskin-active #zzkp-close-btn,
body.reskin-active #nt-close-btn,
body.reskin-active #g2048-close-btn,
body.reskin-active #g2048-gameover-close-btn {
  background: linear-gradient(180deg, #fdf2d6, #f0d79a) !important;
  border: 1px solid #bd9436 !important;
  color: #9a3320 !important;
  box-shadow: 0 8px 18px rgba(120,70,20,0.2), inset 0 1px 0 rgba(255,255,255,0.7) !important;
}
body.reskin-active #zzkp-guide { color: #a07a44 !important; }

/* match-3 board + cells. */
body.reskin-active #mg-board-shell {
  background: linear-gradient(180deg, rgba(253,247,233,0.9), rgba(243,224,191,0.92)) !important;
  border: 1px solid #e0c690 !important;
  box-shadow: 0 18px 42px rgba(90,50,20,0.3), inset 0 3px 0 rgba(255,250,235,0.85), inset 0 -5px 0 rgba(220,196,150,0.85) !important;
}
body.reskin-active #mg-board-shell::before {
  border: 2px solid rgba(255,245,222,0.95) !important;
  box-shadow: inset 0 0 0 1px rgba(210,178,120,0.8) !important;
}
body.reskin-active .mg-cell {
  background: linear-gradient(180deg, #fffaf0, #f4e8cf) !important;
  border: 1px solid rgba(210,180,120,0.75) !important;
  box-shadow: inset 0 2px 0 rgba(255,252,242,0.95), inset 0 -2px 0 rgba(222,200,160,0.8), 0 2px 6px rgba(150,110,50,0.16) !important;
}
body.reskin-active #mg-start-btn { color: #fff8e6 !important; }

/* number-track board + cells. */
body.reskin-active #nt-board {
  background: linear-gradient(180deg, rgba(253,246,232,0.94), rgba(243,221,189,0.95)) !important;
  border: 1px solid #e0c690 !important;
  box-shadow: 0 18px 42px rgba(90,50,20,0.26), inset 0 3px 0 rgba(255,250,235,0.85), inset 0 -5px 0 rgba(220,196,150,0.85) !important;
}
body.reskin-active .nt-cell {
  background: linear-gradient(180deg, #fffefb, #f6ecd8) !important;
  color: #5e3a2a !important;
  box-shadow: 0 6px 12px rgba(150,110,50,0.18), inset 0 2px 0 rgba(255,252,244,0.95), inset 0 -3px 0 rgba(224,200,158,0.85) !important;
}
body.reskin-active .nt-cell.done {
  background: linear-gradient(180deg, #eaf5ec, #d8ecd9) !important;
  color: #6a9b78 !important;
}
body.reskin-active .nt-cell.wrong {
  background: linear-gradient(180deg, #f7dcd4, #f0c2b4) !important;
  color: #a8341e !important;
}
body.reskin-active #nt-overlay { background: rgba(250,242,228,0.66) !important; }

/* 2048 board + tiles → treasure (gold) and ember (red) ramp. */
body.reskin-active #g2048-board {
  background: linear-gradient(180deg, rgba(253,246,232,0.94), rgba(243,221,189,0.95)) !important;
  border: 1px solid #e0c690 !important;
  box-shadow: 0 18px 42px rgba(90,50,20,0.26), inset 0 3px 0 rgba(255,250,235,0.85), inset 0 -5px 0 rgba(220,196,150,0.85) !important;
}
body.reskin-active .g2048-cell {
  color: #8e1322 !important;
  background: linear-gradient(180deg, #fffefb, #f6ecd8) !important;
  box-shadow: 0 6px 12px rgba(150,110,50,0.18), inset 0 2px 0 rgba(255,252,244,0.95), inset 0 -3px 0 rgba(224,200,158,0.85) !important;
}
body.reskin-active .g2048-cell.g2048-tile { color: #fff8e6 !important; text-shadow: 0 1px 2px rgba(90,20,20,0.3) !important; }
body.reskin-active .g2048-tile-2,
body.reskin-active .g2048-cell.g2048-tile { background: linear-gradient(180deg, #f0cf7a, #d2a64a) !important; }
body.reskin-active .g2048-tile-4 { background: linear-gradient(180deg, #ecc163, #cd9c38) !important; }
body.reskin-active .g2048-tile-8 { background: linear-gradient(180deg, #e8a35a, #cf7f33) !important; }
body.reskin-active .g2048-tile-16 { background: linear-gradient(180deg, #e07e57, #c25530) !important; }
body.reskin-active .g2048-tile-32 { background: linear-gradient(180deg, #d65a4f, #b32f2a) !important; }
body.reskin-active .g2048-tile-64 { background: linear-gradient(180deg, #cb3b46, #931024) !important; }
body.reskin-active .g2048-tile-128,
body.reskin-active .g2048-tile-256,
body.reskin-active .g2048-tile-512,
body.reskin-active .g2048-tile-1024,
body.reskin-active .g2048-tile-2048 {
  background: linear-gradient(180deg, #f3d684, #caa03c) !important;
  color: #7d1320 !important;
  text-shadow: 0 1px 0 rgba(255,250,225,0.5) !important;
  box-shadow: 0 0 14px rgba(220,170,60,0.6), inset 0 1px 0 rgba(255,252,235,0.8) !important;
}
body.reskin-active #g2048-overlay { background: rgba(250,242,228,0.55) !important; }

/* Game-over scoreboard cells (current score / best) — match the themed loot rows. */
body.reskin-active #loot-overlay .loot-sb-cell {
  background: #fffaf0 !important;
  border: 1px solid rgba(196,156,70,0.55) !important;
}
body.reskin-active #loot-overlay .loot-sb-k { color: #b08a3e !important; }
body.reskin-active #loot-overlay .loot-sb-v { color: #8e1322 !important; }

/* Bonds (羁绊) relationship sheet — royal theme */
body.reskin-active #bonds-page, body.reskin-active #lb-page { background: linear-gradient(180deg, #fdf6e9, #f1ddbb) !important; box-shadow: 0 -10px 30px rgba(60,25,12,0.32) !important; border-top: 2px solid #c79a3c !important; }
body.reskin-active .frame-up { background: linear-gradient(90deg, #c4283f, #931024) !important; }
body.reskin-active .frame-rm { border-color: #d8bd7e !important; color: #9a7a5a !important; }
body.reskin-active .frame-preview { border-color: #d8bd7e !important; background: #fdf6e9 !important; }
body.reskin-active .sheet-title { color: #8e1322 !important; }
body.reskin-active .bd-heartbroken { background: #f6e3c8 !important; color: #8e1322 !important; border: 1px solid #ddbe72 !important; }
body.reskin-active .bd-row { background: linear-gradient(165deg, #fffaf0, #f5e7c8) !important; box-shadow: 0 3px 12px rgba(70,30,15,0.16) !important; }
body.reskin-active .bd-row.bonded { box-shadow: 0 0 0 2px #c4283f, 0 4px 14px rgba(150,20,30,0.28) !important; }
body.reskin-active .bd-portrait { background: #efe0c4 !important; }
body.reskin-active .bd-name { color: #5a3a28 !important; }
body.reskin-active .bd-role { color: #8e6a3a !important; background: #f3e3c2 !important; }
body.reskin-active .bd-badge { background: #c4283f !important; color: #fff8e6 !important; }
body.reskin-active .bd-stage { color: #8e6a3a !important; }
body.reskin-active .bd-num { color: #b09060 !important; }
body.reskin-active .bd-bar { background: #e7d4ad !important; }
body.reskin-active .bd-bar-fill { background: linear-gradient(90deg, #c4283f, #e0a64b) !important; }
body.reskin-active .bd-bonus { color: #8e6a3a !important; }
body.reskin-active .bd-confess { background: linear-gradient(180deg, #c4283f, #931024) !important; border: 1px solid #d8b25a !important; }
body.reskin-active .bd-break { background: #9c5a52 !important; border: 1px solid #d8b25a !important; }
body.reskin-active .bd-hint { color: #9a7a4a !important; }


/* Keeper greeting banner + chat overlay — royal theme */
body.reskin-active .mk-keeper-card { background: linear-gradient(165deg, #fffaf0, #f5e7c8) !important; border: 1px solid #ddbe72 !important; box-shadow: 0 4px 12px rgba(70,30,15,0.16) !important; }
body.reskin-active .mk-keeper-face { background: #efe0c4 !important; }
body.reskin-active .mk-keeper-name { color: #5a3a28 !important; }
body.reskin-active .mk-keeper-stage { color: #8e6a3a !important; }
body.reskin-active .kc-card { background: linear-gradient(180deg, #fdf6e9, #f1ddbb) !important; border-top: 2px solid #c79a3c !important; }
body.reskin-active .kc-name { color: #5a3a28 !important; }
body.reskin-active .kc-face { background: #efe0c4 !important; }
body.reskin-active .kc-line { background: #fffaf0 !important; color: #5a4030 !important; box-shadow: inset 0 0 0 1px rgba(196,156,70,0.4) !important; }
body.reskin-active .kc-line.kc-good { background: #fdf0d8 !important; box-shadow: inset 0 0 0 1px rgba(196,40,63,0.3) !important; }
body.reskin-active .kc-line.kc-bad { background: #efe6dc !important; color: #9a6a52 !important; }
body.reskin-active .kc-aff { color: #c4283f !important; }
body.reskin-active .kc-cue { color: #9a6a4a !important; }
body.reskin-active .kc-opt { border-color: #ddbe72 !important; background: #fffaf0 !important; color: #5a3a28 !important; }
body.reskin-active .kc-leave { color: #9a7a4a !important; }

/* Keeper welcome (hero) + gift tray — royal theme */
body.reskin-active .mk-hero-img { background: #efe0c4 !important; }
body.reskin-active .mk-hero-name { color: #fff8e6 !important; }
body.reskin-active .mk-hero-stage { color: #f0d79a !important; }
body.reskin-active .mk-wact { border-color: #ddbe72 !important; background: #fffaf0 !important; color: #5a3a28 !important; }
body.reskin-active .mk-wact-go { background: linear-gradient(90deg, #c4283f, #931024) !important; border: 1px solid #d8b25a !important; color: #fff8e6 !important; }
body.reskin-active .mk-gift-empty { background: #fffaf0 !important; color: #8e6a3a !important; }
body.reskin-active .mk-gift-chip { border-color: #ddbe72 !important; background: #fffaf0 !important; }
body.reskin-active .mk-gift-chip span { color: #5a3a28 !important; }
body.reskin-active .mk-gift-chip em { color: #8e6a3a !important; }
body.reskin-active .mk-keeper-expand { color: #8e6a3a !important; }

/* Keeper interaction overlay — royal theme */
body.reskin-active .ix-prompt { color: #8e1322 !important; }
body.reskin-active .ix-n { color: #9a7a5a !important; }
body.reskin-active .ix-s { color: #5a4030 !important; }
body.reskin-active .ix-you { color: #b5642f !important; }
body.reskin-active .ix-aff { color: #c4283f !important; }
body.reskin-active .ix-opt { border-color: #ddbe72 !important; background: #fffaf0 !important; color: #5a3a28 !important; }
body.reskin-active .ix-opt.ix-go { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .mk-wact-love { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .mk-wact-back { color: #9a7a4a !important; }
body.reskin-active #mk-greet { color: #8e1322 !important; background: rgba(255, 248, 230, 0.7) !important; border: 1px solid #e6d3a3 !important; }
body.reskin-active #mk-welcome-msg { background: rgba(142, 19, 34, 0.92) !important; color: #fff8e6 !important; }
body.reskin-active .mk-bond-perk { background: rgba(196, 40, 63, 0.12) !important; color: #8e1322 !important; }

/* 我 page inventory/leaderboard — royal theme */
body.reskin-active .bd-tab { background: rgba(154,122,74,0.14) !important; color: #9a7a5a !important; }
body.reskin-active .bd-tab.on { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .mk-hero-couple { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .mk-quest-banner { background: linear-gradient(180deg, rgba(40,28,12,0.86), rgba(40,28,12,0.7)) !important; color: #f6e4bd !important; }
body.reskin-active .mk-quest-prog { color: #f0d79a !important; }
body.reskin-active .mk-quest-ready { background: linear-gradient(180deg, rgba(196,40,63,0.92), rgba(147,16,36,0.88)) !important; color: #fff8e6 !important; }
body.reskin-active .mk-quest-cta { background: rgba(255,248,230,0.24) !important; }
body.reskin-active .bd-coins { background: rgba(199,154,60,0.18) !important; color: #8e1322 !important; }
/* 我 page — profile / rename strip, royal theme */
body.reskin-active #bd-pf-view { background: rgba(199,154,60,0.18) !important; }
body.reskin-active .bd-pf-label { color: #8e1322 !important; }
body.reskin-active .bd-pf-name { color: #5a3a28 !important; }
body.reskin-active .bd-pf-edit,
body.reskin-active .bd-pf-ok { background: linear-gradient(90deg, #c4283f, #931024) !important; color: #fff8e6 !important; }
body.reskin-active .bd-pf-input { border-color: #c79a3c !important; color: #5a3a28 !important; }
body.reskin-active .bd-pf-cancel { border-color: #c4283f !important; background: rgba(196,40,63,0.12) !important; color: #8e1322 !important; }
/* 关卡进度 — level-progress page, royal theme */
body.reskin-active #pg-head { background: rgba(199,154,60,0.18) !important; }
body.reskin-active .pg-cur { color: #5a3a28 !important; }
body.reskin-active .pg-cur b { color: #8e1322 !important; }
body.reskin-active .pg-bar-fill,
body.reskin-active .pg-rowbar-fill { background: linear-gradient(90deg, #c4283f, #931024) !important; }
body.reskin-active .pg-row.completed .pg-rowbar-fill { background: #7fae6a !important; }
body.reskin-active .pg-lvl { color: #c79a3c !important; }
body.reskin-active .pg-name { color: #7a6048 !important; }
body.reskin-active .pg-row.completed .pg-name,
body.reskin-active .pg-row.current .pg-name { color: #5a3a28 !important; }
body.reskin-active .pg-row.completed .pg-status,
body.reskin-active .pg-row.current .pg-status { color: #2f8f57 !important; }
/* 设置 — settings sheet, royal theme */
body.reskin-active .set-row { background: rgba(199,154,60,0.18) !important; }
body.reskin-active .set-label { color: #5a3a28 !important; }
body.reskin-active .set-switch.on { background: linear-gradient(90deg, #c4283f, #931024) !important; }
body.reskin-active .set-section-title { color: #5a3a28 !important; }
body.reskin-active .about-name { color: #8e1322 !important; }
body.reskin-active .about-line,
body.reskin-active .about-disc-text { color: #7a6048 !important; }
body.reskin-active .about-disc { background: rgba(199,154,60,0.1) !important; border-color: #ddbe72 !important; }
body.reskin-active .about-disc-title { color: #b5722e !important; }