/* ============================================================
   黄昏口袋主题（商店购买「黄昏口袋主题」后生效）
   作用域：<html class="theme-sunset">（登录页 + 大厅 + 弹窗 + 桌宠）
   原则：位置 / 尺寸 / 文字一律不动，只换配色 / 字体 / 边框 / 圆角 / 阴影
   像素街机原样式在 hall.css / login.css / horn-bar.css，本文件按更高优先级覆盖
   风格：宝可梦黄昏 × 暖橙游戏机配色——奶油底、暖橙主键、天蓝辅助、圆胖卡通风
   ============================================================ */

/* —— 黄昏口袋设计变量（暖橙 + 天蓝 + 奶油纸）—— */
.theme-sunset {
  --sd-ink: #4a3a2e;          /* 暖棕墨（正文）*/
  --sd-ink-soft: #93826f;     /* 浅暖灰（次要文字）*/
  --sd-cream: #fdf6e8;        /* 奶油底 */
  --sd-cream2: #fffdf4;       /* 卡片纸 */
  --sd-cream3: #f7ecd8;       /* 深一档奶油 */
  --sd-line: #ecd9b8;         /* 奶油细线 */
  --sd-orange: #f2a04c;       /* 暖橙（主键）*/
  --sd-orange-deep: #d17a24;  /* 深橙（文字/阴影）*/
  --sd-blue: #58a8e8;         /* 天蓝（辅助）*/
  --sd-blue-deep: #2f6ea8;    /* 深蓝（文字用）*/
  --sd-red: #e8635a;          /* 精灵球红 */
  --sd-red-deep: #b83f38;     /* 深红 */
  --sd-yellow: #ffd166;       /* 黄昏黄 */
  --sd-yellow-deep: #a5771d;  /* 深黄（文字用）*/
  --sd-green: #7bc86c;        /* 草绿 */
  --sd-green-deep: #4e8f43;   /* 深草绿 */
  --sd-font: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif;
  --sd-radius: 16px;
  --sd-radius-lg: 22px;
  --sd-hero: linear-gradient(135deg, #f2a04c 0%, #e8635a 100%);
  --sd-shadow: 0 4px 14px rgba(120, 90, 50, .16);
}

/* ===== 基础：黄昏奶油底 ===== */
.theme-sunset body {
  font-family: var(--sd-font);
  color: var(--sd-ink);
  background:
    radial-gradient(ellipse 110% 46% at 50% 112%, rgba(242, 160, 76, .22) 0%, transparent 62%),
    radial-gradient(ellipse 70% 36% at 88% -6%, rgba(88, 168, 232, .14) 0%, transparent 58%),
    linear-gradient(180deg, #fdf6e8 0%, #f9edd6 100%);
}

.theme-sunset #hallBgVideo {
  opacity: .2;
  filter: saturate(1.15) sepia(.12);
}

/* ===== 顶栏：黄昏游戏机 ===== */
.theme-sunset header {
  background: linear-gradient(180deg, #fffbef 0%, #fdf2da 100%);
  border-bottom: 3px solid var(--sd-orange);
  box-shadow: 0 3px 0 rgba(209, 122, 36, .35), 0 8px 24px rgba(120, 90, 50, .15);
}

.theme-sunset .brand {
  color: var(--sd-orange-deep);
  text-shadow: 0 2px 0 rgba(255, 209, 102, .55);
  animation: none;
}

.theme-sunset .online-num {
  color: var(--sd-green-deep);
  border-color: var(--sd-green);
  background: rgba(123, 200, 108, .12);
  box-shadow: none;
  text-shadow: none;
  border-radius: 999px;
}

.theme-sunset .user-box .name {
  color: var(--sd-blue-deep);
  text-shadow: none;
}

.theme-sunset .coin-balance {
  border-radius: 999px;
}

.theme-sunset .menu-btn {
  border-radius: 12px;
}

.theme-sunset .pixel-btn {
  border-radius: var(--sd-radius);
  background: linear-gradient(180deg, #7db9f2 0%, #58a8e8 100%);
  color: #fdfeff;
  text-shadow: 0 1px 0 rgba(47, 110, 168, .5);
  box-shadow: 0 3px 0 #2f6ea8;
}

.theme-sunset .checkin-btn {
  background: var(--sd-hero);
  color: #fffaf0;
  text-shadow: 0 1px 0 rgba(177, 90, 20, .45);
  box-shadow: 0 3px 0 #b8651e;
}

.theme-sunset .logout-btn {
  background: linear-gradient(180deg, #ef8a80 0%, #e8635a 100%);
  color: #fff;
  box-shadow: 0 3px 0 #b83f38;
}

.theme-sunset .music-btn {
  background: linear-gradient(180deg, #ffd98c 0%, #ffd166 100%);
  color: #6b4c12;
  box-shadow: 0 3px 0 #d9a13c;
}

.theme-sunset .music-btn.off {
  background: linear-gradient(180deg, #d9d2c2 0%, #bdb5a2 100%);
  color: #6f6a5c;
  box-shadow: 0 3px 0 #98917e;
}

.theme-sunset .nav-btn {
  background: linear-gradient(180deg, #7db9f2 0%, #58a8e8 100%);
  color: #fdfeff;
  border-color: #2f6ea8;
  border-radius: var(--sd-radius);
  text-shadow: 0 1px 0 rgba(47, 110, 168, .5);
  box-shadow: 0 4px 0 #2f6ea8;
}

.theme-sunset .nav-btn.active {
  background: var(--sd-hero);
  color: #fffaf0;
  border-color: #b8651e;
  text-shadow: 0 1px 0 rgba(177, 90, 20, .45);
  box-shadow: 0 4px 0 #b8651e, 0 0 16px rgba(242, 160, 76, .5);
}

/* ===== 主区：圆胖卡通卡片 ===== */
.theme-sunset .section-title {
  color: var(--sd-orange-deep);
  text-shadow: 0 1px 0 rgba(255, 209, 102, .5);
}

.theme-sunset .section-title::before {
  color: var(--sd-red);
  text-shadow: none;
}

.theme-sunset .card {
  background: var(--sd-cream2);
  border: 3px solid var(--sd-line);
  border-radius: var(--sd-radius-lg);
  box-shadow: var(--sd-shadow);
}

.theme-sunset .card:hover {
  border-color: var(--sd-orange);
  box-shadow: 0 8px 22px rgba(120, 90, 50, .2);
}

.theme-sunset .screen {
  border-color: var(--sd-line);
  border-radius: var(--sd-radius);
  box-shadow: inset 0 0 16px rgba(120, 90, 50, .1);
}

.theme-sunset .detail .enter {
  background: var(--sd-hero);
  color: #fffaf0;
  border-radius: 999px;
  text-shadow: 0 1px 0 rgba(177, 90, 20, .4);
  box-shadow: 0 4px 0 #b8651e;
}

/* ===== 弹窗：奶油圆胖面板 ===== */
.theme-sunset .board-mask {
  background: rgba(74, 58, 46, .42);
}

.theme-sunset .board-panel {
  background: var(--sd-cream2);
  border: 3px solid var(--sd-orange);
  border-radius: var(--sd-radius-lg);
  box-shadow: 0 14px 36px rgba(120, 90, 50, .26);
}

.theme-sunset .board-title {
  color: var(--sd-orange-deep);
  text-shadow: 0 1px 0 rgba(255, 209, 102, .55);
}

.theme-sunset .board-sub {
  color: var(--sd-ink-soft);
}

.theme-sunset .board-send {
  background: var(--sd-hero);
  color: #fffaf0;
  border-radius: var(--sd-radius);
  text-shadow: 0 1px 0 rgba(177, 90, 20, .4);
  box-shadow: 0 3px 0 #b8651e;
}

.theme-sunset .shop-item {
  background: var(--sd-cream2);
  border: 3px solid var(--sd-line);
  border-radius: var(--sd-radius);
  box-shadow: var(--sd-shadow);
}

.theme-sunset .si-name {
  color: var(--sd-ink);
}

.theme-sunset .si-desc {
  color: var(--sd-ink-soft);
}

.theme-sunset .si-price {
  color: var(--sd-yellow-deep);
  text-shadow: none;
}

.theme-sunset .shop-tab.active {
  background: var(--sd-hero);
  color: #fffaf0;
  border-radius: 999px;
  box-shadow: 0 0 12px rgba(242, 160, 76, .45);
}

/* ===== 转盘：黄昏轮盘 ===== */
.theme-sunset .ck-lottery-title {
  color: var(--sd-orange-deep);
  text-shadow: 0 1px 0 rgba(255, 209, 102, .55);
}

.theme-sunset .ck-lottery-go,
.theme-sunset .wheel-go {
  background: var(--sd-hero);
  color: #fffaf0;
  border-radius: 999px;
  box-shadow: 0 3px 0 #b8651e;
}

.theme-sunset .wheel-box {
  border-color: var(--sd-orange);
  border-radius: 999px;
  box-shadow: 0 0 22px rgba(242, 160, 76, .4), inset 0 0 16px rgba(255, 209, 102, .3);
  background: radial-gradient(circle at 50% 42%, #fffdf4 0%, #f7ecd8 84%);
}

.theme-sunset .wheel-pointer {
  border-bottom-color: var(--sd-red);
  filter: none;
}

/* ===== 留言板 / 任务 / 杂项 ===== */
.theme-sunset .msg-item {
  border-color: var(--sd-line);
  background: var(--sd-cream2);
  border-radius: var(--sd-radius);
}

.theme-sunset .ck-task-item {
  border-color: var(--sd-line);
  background: var(--sd-cream2);
  border-radius: var(--sd-radius);
}

.theme-sunset .tag-cell {
  background: var(--sd-cream2);
  border-color: var(--sd-line);
  border-radius: var(--sd-radius);
}

.theme-sunset .bh-item,
.theme-sunset .ah-item {
  background: var(--sd-cream3);
  border-color: var(--sd-line);
  border-radius: 12px;
}

.theme-sunset .bh-item.using,
.theme-sunset .ah-item.using {
  border-color: var(--sd-green);
  background: rgba(123, 200, 108, .12);
}

.theme-sunset .more-menu {
  background: var(--sd-cream2);
  border-color: var(--sd-orange);
  border-radius: var(--sd-radius-lg);
  box-shadow: 0 12px 30px rgba(120, 90, 50, .28);
}

.theme-sunset .mm-item {
  color: var(--sd-ink);
  border-radius: 12px;
}

.theme-sunset .mm-item:hover {
  background: rgba(242, 160, 76, .14);
  border-color: rgba(242, 160, 76, .45);
}

.theme-sunset .mm-item.mm-danger {
  color: var(--sd-red-deep);
}

/* ===== F7 主题适配 · 新界面（转盘弹窗/十连卡片/每日任务进度条）===== */
.theme-sunset .wheel-panel {
  background: var(--sd-cream2);
  border: 3px solid var(--sd-orange);
}

.theme-sunset .wheel-ticket-num {
  color: var(--sd-yellow-deep);
  text-shadow: none;
}

.theme-sunset .rc-card {
  background: var(--sd-cream2);
  color: var(--sd-ink);
}

.theme-sunset .rc-card .rc-amt {
  text-shadow: none;
}

.theme-sunset .dt-track {
  background: var(--sd-cream3);
  border-color: var(--sd-line);
}

.theme-sunset .dt-node.done .dt-dot {
  background: var(--sd-hero);
  border-color: #fff;
  box-shadow: 0 0 10px rgba(242, 160, 76, .6);
}

.theme-sunset .dt-fill {
  background: linear-gradient(90deg, #ffd166, #f2a04c, #e8635a);
}

/* 排行榜 */
.theme-sunset .lb-row.top1 .lb-rank { color: var(--sd-yellow-deep); text-shadow: none; }
.theme-sunset .lb-row.top2 .lb-rank { color: #9a938a; text-shadow: none; }
.theme-sunset .lb-row.top3 .lb-rank { color: var(--sd-orange-deep); text-shadow: none; }

.theme-sunset .lb-row {
  border-color: var(--sd-line);
}

/* Toast */
.theme-sunset .toast-wrap .toast {
  background: rgba(74, 58, 46, .96);
  border-color: var(--sd-orange);
  color: #fdf6e8;
}