@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&display=swap');

/* VALORANT 品牌字体 */
@font-face {
  font-family: 'VALORANT';
  src: local('DIN Condensed'), local('Tungsten'), local('Bahnschrift Condensed');
  font-weight: 700;
  font-style: normal;
  font-stretch: condensed;
}

:root {
  --bg: #eff1f5;
  --sidebar-bg: #e4e7ec;
  --accent: #d63b49;
  --accent2: #b87a25;
  --text: #1e293b;
  --text-dim: #64748b;
  --card: #e9ecf0;
  --hover: #dde1e8;
  --border: #d2d6de;
  --role-duelist: #ff4655;
  --role-initiator: #3b82f6;
  --role-controller: #22c55e;
  --role-sentinel: #f59e0b;
  /* 辉光效果变量 */
  --glow-accent: rgba(255,70,85,0.5);
  --glow-accent2: rgba(232,166,64,0.5);
  --glow-red: rgba(255,70,85,0.6);
  --glow-blue: rgba(59,130,246,0.5);
  --glow-green: rgba(34,197,94,0.5);
  --glow-orange: rgba(245,158,11,0.5);
  /* 字体族 */
  --font-display: 'Oswald', 'DIN Condensed', 'Tungsten', sans-serif;
  /* 动画时长 */
  --t-fast: 0.15s;
  --t-base: 0.25s;
  --t-slow: 0.4s;
  --t-celebration: 0.7s;
  /* z-index */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 110;
  --z-overlay: 120;
  --z-modal: 9999;
}

.theme-dark {
  --bg: #0f1923;
  --sidebar-bg: #1a242d;
  --accent: #ff4655;
  --accent2: #e8a640;
  --text: #e0e7ee;
  --text-dim: #7b8a9b;
  --card: #1e2d3d;
  --hover: #2a3f52;
  --border: #2a3a48;
  --glow-accent: rgba(255,70,85,0.6);
  --glow-accent2: rgba(232,166,64,0.6);
  --glow-red: rgba(255,70,85,0.7);
  --glow-blue: rgba(59,130,246,0.6);
  --glow-green: rgba(34,197,94,0.6);
  --glow-orange: rgba(245,158,11,0.6);
}
.theme-dark main::after{background:rgba(15,25,35,.55);}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
body{
  font-family: 'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  background:var(--bg);color:var(--text);
  display:flex;min-height:100vh;overflow-x:hidden;
  overscroll-behavior:none;
  scrollbar-gutter:stable both-edges;
}

/* 暗色模式氛围背景：噪点+网格纹理 */
.theme-dark body {
  background-image:
    radial-gradient(ellipse at 20% 50%, rgba(255,70,85,0.04) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(59,130,246,0.03) 0%, transparent 50%);
}

/* 暗色模式细微网格 */
.theme-dark main::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.015) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
  z-index: 0;
}
.sidebar{
  width:220px;min-width:220px;background:var(--sidebar-bg);
  display:flex;flex-direction:column;border-right:1px solid var(--border);
  padding:24px 0;z-index:10;
  position:relative;
  transition:all .3s ease;
}
/* VALORANT 风格侧边栏底部斜切装饰 */
.sidebar::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
}
.sidebar-logo{
  padding:0 20px 24px;border-bottom:1px solid var(--border);margin-bottom:12px;
  display:flex;align-items:center;gap:10px;
}
.logo-mark{
  width:36px;height:36px;border-radius:4px;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:20px;
  flex-shrink:0;
}
.logo-text h1{
  font-size:16px;font-weight:700;color:var(--accent);
  font-family:var(--font-display);text-transform:uppercase;letter-spacing:2px;
  line-height:1.1;
}
.logo-text span{font-size:11px;color:var(--text-dim);display:block;margin-top:2px;}
.nav-list{list-style:none;flex:1}
.nav-item{
  display:flex;align-items:center;gap:10px;
  padding:12px 20px;cursor:pointer;transition:all .2s;
  font-size:14px;color:var(--text-dim);
  border-left:3px solid transparent;
  position:relative;
  font-weight:500;
}
.nav-item:hover{background:var(--hover);color:var(--text);}
.nav-item.active{
  background:color-mix(in srgb, var(--accent) 10%, transparent);color:var(--accent);
  border-left-color:var(--accent);font-weight:600;
}
.nav-lock{font-size:11px;margin-left:auto;opacity:.5}
.sidebar-footer{
  padding:16px 20px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  font-size:11px;color:var(--text-dim);
}
.footer-ver{opacity:0.6;}
.sidebar-feedback-link{
  color:var(--accent);text-decoration:none;transition:opacity .2s;
}
.sidebar-feedback-link:hover{opacity:.8;text-decoration:underline;}

/* ===== 侧边栏玩家卡片 ===== */
.sidebar-player{
  margin:0 12px 12px;padding:10px 12px;
  border-radius:8px;
  background:color-mix(in srgb,var(--accent) 8%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 20%,var(--border));
  display:flex;align-items:center;gap:8px;
}
.player-avatar{
  width:32px;height:32px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:14px;
  flex-shrink:0;
}
.player-info{flex:1;min-width:0;}
.player-name{font-size:12px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.player-rank{font-size:11px;color:var(--accent);font-weight:600;}
.player-actions{display:flex;gap:4px;}
.player-rankedit,.player-logout{
  width:28px;height:28px;border:none;border-radius:4px;
  background:transparent;color:var(--text-dim);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;transition:all .15s;
}
.player-rankedit:hover,.player-logout:hover{
  background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);
}

/* ===== 主区域 ===== */
main{
  flex:1;position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;
  background-size:cover;background-position:center;
  background-image:url(https://cmsassets.rgpub.io/sanity/images/dsfx7636/news_live/c07f29d903296e00ab9462d7515d7b8d38f53903-1920x1080.jpg);
  transition:background-image .6s ease;
  background-color:var(--bg);
}
main::after{
  content:'';position:absolute;inset:0;
  background:rgba(15,25,35,.45);
  z-index:0;pointer-events:none;
  transition:background .6s ease;
}
  /* 模块切换过渡动画 */
.content-layer{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;
  width:100%;
  max-width:1300px;
  animation:moduleFadeIn .35s ease;
}
.content-layer.home-hero{max-width:none!important;flex:1;align-self:stretch;display:flex;align-items:center;justify-content:center;}
@keyframes moduleFadeIn{
  0%{opacity:0;transform:translateY(12px);}
  100%{opacity:1;transform:translateY(0);}
}
/* 首页 hero 不需要上浮动画 */
.home-hero{animation:none;}
.module-title{
  font-size:22px;font-weight:700;margin-bottom:8px;color:var(--accent);
  font-family:var(--font-display);text-transform:uppercase;letter-spacing:3px;
}
.module-sub{font-size:13px;color:var(--text-dim);margin-bottom:32px;}

/* ===== 抽奖主按钮 ===== */
.btn-spin{
  margin-top:36px;padding:14px 56px;
  font-size:18px;font-weight:700;letter-spacing:2px;
  background:var(--accent);color:#fff;border:none;border-radius:6px;
  cursor:pointer;transition:all .25s cubic-bezier(.25,.8,.25,1);
  text-transform:uppercase;font-family:var(--font-display);
  position:relative;overflow:hidden;
}
.btn-spin::after{
  content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.15),transparent);
  transition:left .5s;
}
.btn-spin:hover:not(:disabled){
  filter:brightness(1.08);transform:translateY(-3px);
  box-shadow:0 8px 30px var(--glow-accent);
}
.btn-spin:hover:not(:disabled)::after{left:100%;}
.btn-spin:disabled{opacity:.5;cursor:not-allowed;}

/* ===== 地图抽奖模块 ===== */
.map-count{margin-bottom:20px;display:flex;align-items:center;gap:6px;justify-content:center;flex-wrap:wrap;}
.map-count span{font-size:13px;color:var(--text-dim);}
.mc-btn{
  width:32px;height:32px;border-radius:50%;border:1px solid var(--border);
  background:var(--card);color:var(--text-dim);font-size:14px;font-weight:600;
  cursor:pointer;transition:all .2s;font-family:inherit;
}
.mc-btn:hover:not(:disabled){color:var(--text);border-color:var(--text-dim);}
.mc-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.mc-btn:disabled{opacity:0.5;cursor:not-allowed;}
#btnResetBan{padding:4px 12px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text-dim);font-size:12px;cursor:pointer;font-family:inherit;transition:all .2s;}
#btnResetBan:hover{color:var(--text);border-color:var(--text-dim);}

.map-cards{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:960px;margin-bottom:24px;}
.map-card{
  width:120px;height:80px;border-radius:8px;background-size:cover;background-position:center;
  background-color:#1e2d3d;
  position:relative;overflow:hidden;border:2px solid var(--border);
  cursor:default;transition:all .2s;
  display:flex;align-items:flex-end;justify-content:center;
}
.map-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(transparent 40%,rgba(15,25,35,.85));
  z-index:0;
}
.map-card .mc-label{position:relative;z-index:1;font-size:13px;font-weight:700;color:#fff;padding:4px 0;text-shadow:0 1px 4px rgba(0,0,0,.7);white-space:nowrap;}
.map-card:hover{
  border-color:var(--accent);
  box-shadow:0 0 20px var(--glow-accent);
  transform:scale(1.05);
}
.map-card.highlight{border-color:var(--accent);transform:scale(1.08);z-index:2;box-shadow:0 0 24px color-mix(in srgb, var(--accent) 50%, transparent);animation:cardPop .25s ease;}
@keyframes cardPop{0%{transform:scale(1);opacity:.5}50%{transform:scale(1.12)}100%{transform:scale(1.08);opacity:1}}

/* Ban 图状态 */
.map-card.banned{filter:grayscale(80%) brightness(0.65);border-color:#8a1f2d;position:relative;}
.map-card.banned::after{
  content:'🚫';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-size:28px;z-index:2;filter:drop-shadow(0 0 6px rgba(0,0,0,.7));
}
.map-card{cursor:pointer;}

.map-results{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:8px;min-height:100px;align-items:center;}
.map-result-card{
  width:220px;height:140px;border-radius:10px;background-size:cover;background-position:center;
  background-color:#1e2d3d;
  position:relative;overflow:hidden;border:2px solid var(--accent);
  opacity:0;transform:scale(.8);
  transition:all .4s cubic-bezier(.25,.8,.25,1);
  display:flex;align-items:flex-end;justify-content:center;
  box-shadow:0 0 30px var(--glow-accent);
}
.map-result-card.show{opacity:1;transform:scale(1);}
@keyframes resultGlow{
  0%{box-shadow:0 0 20px var(--glow-accent);}
  100%{box-shadow:0 0 40px var(--glow-accent),0 0 60px rgba(255,70,85,0.3);}
}
.map-result-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(transparent 50%,rgba(15,25,35,.9));
}
.map-result-card .mr-label{position:relative;z-index:1;font-size:15px;font-weight:800;color:var(--accent2);padding:8px 0;text-shadow:0 1px 6px rgba(0,0,0,.8);}

/* ===== 首页 Hero ===== */
.home-hero{
  flex:1;align-self:stretch;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.hero-content{
  position:relative;z-index:2;
  text-align:center;
  padding:40px 20px;
  max-width:900px;
  width:100%;
  min-width:0;
}
.hero-badge{
  display:inline-block;
  padding:4px 16px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  border-radius:999px;
  font-size:12px;
  color:var(--text-dim);
  margin-bottom:16px;
  background:color-mix(in srgb,var(--accent) 5%,transparent);
  font-family:var(--font-display);
  letter-spacing:1px;
}
.hero-title{
  font-family:var(--font-display);
  font-size:48px;
  font-weight:700;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:4px;
  margin-bottom:12px;
  text-shadow:0 0 40px rgba(255,70,85,0.3);
  line-height:1.1;
}
.hero-desc{
  font-size:16px;
  color:rgba(255,255,255,0.7);
  margin-bottom:40px;
}
.hero-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:16px;
  max-width:800px;
  width:100%;
  min-width:0;
  margin:0 auto;
}
.hero-card{
  background:color-mix(in srgb,var(--card) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--border) 30%,transparent);
  border-radius:12px;
  padding:24px 16px;
  text-align:center;
  cursor:pointer;
  transition:all .3s cubic-bezier(.25,.8,.25,1);
  backdrop-filter:blur(8px);
  position:relative;
  overflow:hidden;
  min-width:0;
  min-height:0;
}
.hero-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,transparent 50%,rgba(255,70,85,0.08));
  pointer-events:none;
}
.hero-card:hover{
  background:color-mix(in srgb,var(--card) 20%,transparent);
  border-color:var(--accent);
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 16px 48px rgba(255,70,85,0.25);
}
.hero-card-icon{
  width:48px;height:48px;
  margin:0 auto 12px;
  color:var(--accent);
  opacity:0.9;
  transition:all .3s;
}
.hero-card:hover .hero-card-icon{
  opacity:1;
  filter:drop-shadow(0 0 8px var(--glow-accent));
  transform:scale(1.1);
}
.hero-card-title{
  font-family:var(--font-display);
  font-size:16px;
  font-weight:700;
  color:#fff;
  margin-bottom:6px;
  letter-spacing:1px;
}
.hero-card-desc{
  font-size:12px;
  color:rgba(255,255,255,0.6);
  margin-bottom:12px;
}
.hero-card-preview{
  display:flex;gap:6px;justify-content:center;flex-wrap:wrap;
}
.preview-tag{
  font-size:10px;
  padding:2px 8px;
  border-radius:4px;
  background:color-mix(in srgb,var(--accent) 15%,transparent);
  color:var(--accent);
  font-weight:600;
}

/* ===== 随机特工模块 ===== */
.agent-filters{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px;}
/* 角色筛选按钮 - 角色色辉光 */
.af-btn{
  padding:6px 14px;border-radius:16px;border:1px solid var(--border);
  background:var(--card);color:var(--text-dim);font-size:13px;
  cursor:pointer;transition:all .25s;font-family:inherit;
  position:relative;
}
.af-btn:hover{color:var(--text);border-color:var(--text-dim);}
.af-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600;}
.af-btn[data-role="决斗者"].active{background:var(--role-duelist);border-color:var(--role-duelist);box-shadow:0 0 16px var(--glow-red);}
.af-btn[data-role="先锋"].active{background:var(--role-initiator);border-color:var(--role-initiator);box-shadow:0 0 16px var(--glow-blue);}
.af-btn[data-role="控场者"].active{background:var(--role-controller);border-color:var(--role-controller);box-shadow:0 0 16px var(--glow-green);}
.af-btn[data-role="哨卫"].active{background:var(--role-sentinel);border-color:var(--role-sentinel);box-shadow:0 0 16px var(--glow-orange);}

.agent-count{display:flex;align-items:center;gap:6px;justify-content:center;margin-bottom:16px;flex-wrap:wrap;}
.agent-count span{font-size:13px;color:var(--text-dim);}
.ac-btn{
  width:32px;height:32px;border-radius:50%;border:1px solid var(--border);
  background:var(--card);color:var(--text-dim);font-size:14px;font-weight:600;
  cursor:pointer;transition:all .2s;font-family:inherit;
}
.ac-btn:hover:not(:disabled){color:var(--text);border-color:var(--text-dim);}
.ac-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.ac-btn:disabled{opacity:0.5;cursor:not-allowed;}
.ac-mode-btn{
  height:32px;padding:0 14px;border-radius:16px;border:1px solid var(--border);
  background:var(--card);color:var(--text-dim);font-size:12px;font-weight:600;
  cursor:pointer;transition:all .2s;font-family:inherit;white-space:nowrap;
}
.ac-mode-btn:hover:not(:disabled){color:var(--text);border-color:var(--text-dim);}
.ac-mode-btn.active{background:var(--accent2);color:#fff;border-color:var(--accent2);}
.ac-mode-btn:disabled{opacity:0.5;cursor:not-allowed;}

#module-agent .agent-grid{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;
  max-width:900px;margin-bottom:20px;
}
.agent-card{
  width:72px;text-align:center;padding:6px 4px;border-radius:8px;
  background:var(--card);border:2px solid transparent;
  cursor:default;transition:all .2s;position:relative;
}
.agent-card::after{
  content:'';position:absolute;inset:-2px;border-radius:10px;
  opacity:0;transition:opacity .2s;
  box-shadow:0 0 16px var(--glow-accent);
  pointer-events:none;
}
.agent-card:hover{
  border-color:var(--accent);
  transform:scale(1.08);
}
.agent-card:hover::after{opacity:0.7;}
.agent-card.highlight{
  border-color:var(--accent);background:color-mix(in srgb, var(--accent) 20%, transparent);
  transform:scale(1.12);z-index:2;box-shadow:0 0 20px color-mix(in srgb, var(--accent) 40%, transparent);
  animation:agentPop .3s ease;
}
@keyframes agentPop{0%{transform:scale(1);opacity:.5}50%{transform:scale(1.2)}100%{transform:scale(1.12);opacity:1}}
.agent-card img{width:48px;height:48px;border-radius:50%;object-fit:cover;background:var(--bg);}
.agent-card .agent-name{font-size:11px;margin-top:4px;color:var(--text);line-height:1.2;}
.agent-role-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:3px;vertical-align:middle;}

.agent-results{
  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;
  margin-top:8px;min-height:82px;align-items:center;
}
.agent-result-card{
  display:flex;align-items:center;gap:10px;
  background:var(--card);border:1px solid var(--border);border-radius:12px;
  padding:10px 16px;opacity:0;transform:translateY(10px);
  transition:all .35s ease;
}
.agent-result-card.show{opacity:1;transform:translateY(0);}
.agent-result-card img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--accent);}
.agent-result-card .ar-name{font-size:15px;font-weight:700;color:var(--accent2);}
.agent-result-card .ar-role{font-size:12px;color:var(--text-dim);}
.agent-result-card .ar-meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:2px;}

/* 全局toast */
#globalToast{
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%);
  background:var(--accent); color:white; padding:10px 24px;
  border-radius:40px; font-size:14px; font-weight:500;
  z-index:1000; opacity:0; transition:opacity 0.2s ease;
  white-space:nowrap; box-shadow:0 4px 12px rgba(0,0,0,0.3);
  cursor:pointer; pointer-events:auto;
  display:flex;align-items:center;gap:8px;
  padding-right:16px;
}
/* ===== 移动端:侧边栏→侧滑抽屉 ===== */
@media(max-width:768px){
  body{
    flex-direction:column!important;
    overflow-y:auto;
    overflow-x:hidden;
    min-height:100dvh!important;
  }
  #navHamburger{display:flex;}
  .sidebar{
    position:fixed!important;
    top:0!important;bottom:0!important;left:0!important;
    width:260px!important;min-width:260px!important;
    flex-direction:column!important;
    padding:24px 0!important;
    border-right:1px solid var(--border)!important;
    border-top:none!important;
    z-index:100!important;
    transform:translateX(-100%);
    transition:transform .3s cubic-bezier(.25,.8,.25,1)!important;
    box-shadow:4px 0 24px rgba(0,0,0,.25);
  }
  body.drawer-open .sidebar{transform:translateX(0) !important;}
  .sidebar-logo,.sidebar-footer{display:flex;}
  .nav-list{
    display:block;
    flex:1;
    flex-direction:column;
    justify-content:flex-start;
    align-items:stretch;
    height:auto;
    padding:0;
  }
  .nav-item{
    flex-direction:row;padding:12px 20px;
    border-left:3px solid transparent;
    border-top:none;
    gap:10px;font-size:14px;min-width:0;flex:0 0 auto;
    justify-content:flex-start;
    text-align:left;
  }
  .nav-item.active{
    border-left-color:var(--accent);
    border-top-color:transparent;
  }
  .nav-item span{display:inline;}

  main{
    padding:20px 12px;
    min-height:100dvh;
    padding-top:64px;
  }
  .content-layer{max-width:100%;}
  /* 修复 ID 优先级覆盖：确保这两个模块在移动端不超过视口宽度 */
  #module-teamsplit{max-width:100%;}
  .challenge-machine{max-width:100%;}
  /* 修复 hero-cards 移动端溢出：缩小 minmax 并加 min-width:0 */
  .hero-cards{
    grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
    gap:10px;
    max-width:100%;
    min-width:0;
  }
  .hero-card{padding:12px 6px;min-width:0;}
  .hero-card-icon{width:30px;height:30px;margin-bottom:8px;}
  .hero-card-title{font-size:11px;}
  .hero-card-desc{font-size:9px;line-height:1.3;}
  .preview-tag{font-size:8px;padding:1px 4px;}
  .hero-content{padding:20px 8px;}
  .hero-title{font-size:22px;letter-spacing:2px;}
  .hero-badge{margin-left:auto;margin-right:auto;padding:6px 16px;font-size:11px;}
  .hero-desc{font-size:12px;margin-bottom:16px;}

  .home-hero{flex:1;align-self:stretch;}
  .module-title{font-size:18px;text-align:center;width:100%;}
  .module-sub{font-size:12px;margin-bottom:20px;text-align:center;width:100%;}

  /* 内鬼模式入口卡片：固定宽度改为自适应 */
  .spy-entry-cards{flex-direction:column;gap:10px;width:100%;align-items:stretch;}
  .spy-entry-card{width:100%;max-width:100%;padding:18px 14px;box-sizing:border-box;text-align:center;display:flex;flex-direction:column;align-items:center;}
  .spy-entry-icon{font-size:34px;margin-bottom:8px;}
  .spy-entry-title{font-size:15px;}
  .spy-entry-desc{font-size:12px;}
  #spyStandaloneEntry{max-width:100%;width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
  /* 内鬼 Lobby 大厅 */
  .spy-setup-card{padding:16px 12px;}
  .spy-setup-head{font-size:15px;flex-wrap:wrap;gap:8px;}
  .spy-setup-input-row{flex-direction:column;gap:8px;}
  .spy-player-row{font-size:13px;padding:6px 10px;flex-wrap:wrap;gap:6px;}
  .spy-team-btn{width:44px;height:44px;font-size:14px;}
  .spy-team-col{padding:10px;}
  .spy-team-member{font-size:12px;padding:4px 10px;}
  .spy-team-label{font-size:13px;}
  .spy-drag-area{grid-template-columns:1fr;}
  .spy-playing-layout{grid-template-columns:1fr;}
  .spy-team-preview{grid-template-columns:1fr;}
  .spy-reveal-teams{grid-template-columns:1fr;}
  .spy-init-icon{font-size:42px;}
  .spy-reveal-icon{font-size:42px;}
  .spy-card-body{padding:14px;}
  .spy-task-card{padding:10px;}
  .spy-task-icon{font-size:20px;}
  .spy-task-title{font-size:14px;}
  .spy-warning{font-size:11px;}
  .spy-reveal-card{padding:20px 14px;}
  .spy-reveal-row{font-size:12px;gap:6px;padding:4px 8px;}
  .spy-reveal-row-name{min-width:40px;}
  .spy-reveal-row-task{font-size:11px;}

  .map-cards{gap:8px;}
  .map-card{width:80px;height:56px;}
  .map-card .mc-label{font-size:11px;}
  .map-result-card{width:150px;height:100px;}
  .map-result-card .mr-label{font-size:13px;}

  .btn-spin{margin-top:24px;padding:12px 40px;font-size:16px;min-height:44px;}

  .agent-card{width:60px;}
  .agent-card img{width:40px;height:40px;}

  .btn-machine{padding:10px 28px;font-size:15px;}

  #globalToast{bottom:24px;}
  /* 加入房间视图：移动端更友好 */
  #spyJoinRoomView{max-width:100%;width:100%;}
  #spyJoinRoomView .spy-setup-card{padding:20px 16px;}
  #spyJoinRoomView .spy-setup-input-row{flex-direction:column;gap:10px;}
  #spyJoinRoomView .teamsplit-input{width:100%;font-size:15px;min-height:48px;letter-spacing:2px;text-align:center;}
  #spyJoinRoomView .btn-machine{width:100%;min-height:48px;font-size:15px;}
  #spyJoinRoomView .spy-setup-input-row{flex-direction:column;gap:10px;}
  #spyJoinRoomView .teamsplit-input{width:100%;font-size:15px;min-height:48px;letter-spacing:2px;text-align:center;}
  #spyJoinRoomView .btn-machine{width:100%;min-height:48px;font-size:15px;}
  /* 内战转盘：移动端容器自适应 */
  .challenge-machine{gap:14px;max-width:100%;}
  .machine-frame{padding:20px 16px;}
  .machine-text{font-size:17px;}
  .machine-text.result{font-size:19px;}
  .machine-text.idle{font-size:14px;}
  .btn-machine{padding:10px 24px;font-size:14px;}
  #module-stats .module-sub{margin-bottom:20px;}
}
@media(max-width:420px){
  main{padding:16px 8px;padding-top:64px;}
  .module-title{font-size:16px;}
  .module-sub{font-size:11px;margin-bottom:16px;}
  .map-card{width:64px;height:46px;}
  .map-card .mc-label{font-size:10px;white-space:normal;line-height:1.1;padding:2px 0;}
  .map-result-card{width:130px;height:88px;}
  .map-result-card .mr-label{font-size:12px;}
  .btn-spin{padding:10px 28px;font-size:14px;margin-top:14px;}
  /* 420px 下 hero-cards 固定两列避免溢出 */
  .hero-cards{grid-template-columns:repeat(2,1fr);gap:8px;min-width:0;width:100%;}
  .hero-card{padding:10px 4px;min-width:0;}
  .hero-card-icon{width:24px;height:24px;margin-bottom:6px;}
  .hero-card-title{font-size:10px;}
  .hero-card-desc{font-size:9px;line-height:1.3;}
  .preview-tag{font-size:7px;padding:1px 3px;}
  .hero-title{font-size:20px;letter-spacing:1px;}
  .hero-desc{font-size:11px;margin-bottom:12px;}
  .hero-badge{padding:5px 12px;font-size:10px;}
  .agent-card{width:52px;padding:4px 2px;}
  .agent-card img{width:34px;height:34px;}
  .agent-card .agent-name{font-size:10px;}
  .af-btn{padding:5px 10px;font-size:12px;}
  .ac-mode-btn{height:28px;padding:0 10px;font-size:11px;}
  .mc-btn{width:44px;height:44px;font-size:14px;}
  .ac-btn{width:44px;height:44px;font-size:14px;}
  .ac-mode-btn{height:44px;padding:0 14px;font-size:13px;}
  .btn-machine{padding:10px 22px;font-size:14px;}
  .teamsplit-kick-btn{width:44px;height:44px;font-size:18px;}
}
/* ===== 内战分队模块 ===== */
#module-teamsplit{
  max-width:860px;
  width:100%;
  min-width:0;
  overflow:hidden;
}
.teamsplit-rank-icon{
  width:22px;
  height:22px;
  flex-shrink:0;
  margin-right:-2px;
  image-rendering:crisp-edges;
}
.teamsplit-room{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  width:100%;
  max-width:100%;
  min-width:0;
}
.teamsplit-panel{
  width:100%;
  max-width:100%;
  min-width:0;
  padding:28px;
  border-radius:18px;
  background:color-mix(in srgb,var(--sidebar-bg) 78%,rgba(10,16,24,.78));
  border:1px solid color-mix(in srgb,var(--accent) 16%,var(--border));
  box-shadow:0 20px 50px rgba(0,0,0,.2);
  backdrop-filter:blur(14px);
  overflow:hidden;
}
.teamsplit-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  width:100%;
  min-width:0;
  margin-bottom:18px;
}
.teamsplit-panel-title{
  font-size:24px;
  font-weight:800;
  color:var(--text);
}
.teamsplit-panel-sub{
  margin-top:6px;
  font-size:14px;
  line-height:1.5;
  color:var(--text-dim);
}
.teamsplit-create{
  display:flex;
  flex-direction:column;
}
.teamsplit-create-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);
  gap:16px;
  width:100%;
  align-items:stretch;
}
.teamsplit-join-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:12px;
  min-width:0;
  padding:18px;
  border-radius:14px;
  background:color-mix(in srgb,var(--card) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--border) 80%,transparent);
}
.teamsplit-join-label{
  font-size:13px;
  font-weight:700;
  color:var(--text-dim);
}
.teamsplit-join-row,
.teamsplit-lobby-controls,
.teamsplit-action-row,
.teamsplit-action-stack{
  display:flex;
  gap:12px;
  width:100%;
  min-width:0;
  align-items:center;
}
.teamsplit-action-stack{
  flex-direction:column;
  margin-top:14px;
}
.teamsplit-input{
  flex:1;
  height:48px;
  padding:0 16px;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb,var(--card) 88%,transparent);
  color:var(--text);
  font-size:14px;
  font-family:inherit;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
  min-width:0;
}
.teamsplit-input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent);
  background:var(--card);
}
.teamsplit-input::placeholder{color:var(--text-dim);}
.teamsplit-join-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.teamsplit-select{
  height:48px;
  padding:0 36px 0 14px;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb,var(--card) 88%,transparent);
  color:var(--text);
  font-size:14px;
  font-family:inherit;
  cursor:pointer;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  min-width:100px;
}
.teamsplit-select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent);
  background:var(--card);
}
.teamsplit-primary-btn{
  margin-top:0;
  min-height:56px;
  width:100%;
}
.teamsplit-primary-btn:disabled{
  background:color-mix(in srgb,var(--card) 72%,var(--accent));
  opacity:.72;
  box-shadow:none;
}
.teamsplit-inline-btn,
.teamsplit-secondary-btn{
  min-height:48px;
  white-space:nowrap;
}
.teamsplit-lobby,
.teamsplit-result{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.teamsplit-count-badge{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:116px;
  height:42px;
  padding:0 14px;
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 14%,var(--card));
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));
  color:var(--text);
  font-size:14px;
  font-weight:700;
}
.teamsplit-room-code{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:12px 18px;
  border-radius:14px;
  background:#18263a;
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));
  color:#b9c7d8;
  font-size:14px;
  font-weight:700;
  min-width:0;
  width:100%;
}
.teamsplit-room-code span{
  font-size:32px;
  line-height:1;
  letter-spacing:4px;
  color:var(--accent);
}
.teamsplit-player-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-start;
  min-height:68px;
  width:100%;
  padding:16px;
  border-radius:16px;
  background:color-mix(in srgb,var(--card) 84%,transparent);
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
}
.teamsplit-player-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 16px;
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 10%,var(--card));
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));
  font-size:14px;
  font-weight:700;
  color:var(--text);
}
.teamsplit-player-chip.self{
  border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 18%,var(--card));
}
.teamsplit-host-badge{
  display:inline-flex;
  align-items:center;
  height:20px;
  padding:0 8px;
  border-radius:999px;
  background:var(--accent2);
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
}
.teamsplit-kick-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  margin-left:2px;
  padding:0;
  border:none;
  border-radius:50%;
  background:rgba(255,70,85,.15);
  color:var(--accent);
  font-size:16px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  transition:all .15s;
  font-family:inherit;
}
.teamsplit-kick-btn:hover{
  background:var(--accent);
  color:#fff;
  transform:scale(1.15);
}
.teamsplit-kick-btn:active{
  transform:scale(.95);
}
.teamsplit-lobby-controls{
  margin-top:16px;
}
.teamsplit-result-head{
  margin-bottom:20px;
}
.teamsplit-teams{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  gap:16px;
  align-items:stretch;
  width:100%;
  min-width:0;
}
.teamsplit-team{
  min-width:0;
  background:color-mix(in srgb,var(--card) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
  border-radius:16px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.teamsplit-team-header{
  font-size:17px;
  font-weight:800;
  text-align:center;
  padding:10px;
  border-radius:12px;
  color:#fff;
}
.teamsplit-team-header.team-a{background:linear-gradient(135deg,#ff4655,#c8303d);}
.teamsplit-team-header.team-b{background:linear-gradient(135deg,#3b82f6,#2563eb);}
.teamsplit-vs{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-weight:900;
  color:var(--text-dim);
}
.teamsplit-team-players{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.teamsplit-player-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:0 12px;
  border-radius:12px;
  background:var(--bg);
  font-size:14px;
  font-weight:600;
}
.teamsplit-player-row .agent-role-dot{flex-shrink:0;}
.teamsplit-rank-tag{
  font-size:11px;
  font-weight:700;
  color:var(--accent);
  background:color-mix(in srgb,var(--accent) 16%,transparent);
  padding:2px 8px;
  border-radius:999px;
  margin-left:4px;
}
.spy-rank-tag{
  font-size:11px;
  font-weight:700;
  color:var(--accent);
  background:color-mix(in srgb,var(--accent) 16%,transparent);
  padding:2px 8px;
  border-radius:999px;
  margin-left:6px;
}
.teamsplit-empty-hint{
  font-size:13px;
  color:var(--text-dim);
  text-align:center;
  padding:20px;
}
.teamsplit-status{
  font-size:13px;
  color:var(--text-dim);
  text-align:left;
}
.teamsplit-status.error{color:#ef4444;}
.teamsplit-status.success{color:#22c55e;}
@media(max-width:640px){
  #module-teamsplit{
    max-width:100%;
  }
  .teamsplit-panel{
    padding:18px;
    border-radius:16px;
  }
  .teamsplit-panel-head,
  .teamsplit-create-grid,
  .teamsplit-join-row,
  .teamsplit-lobby-controls,
  .teamsplit-action-row{
    grid-template-columns:none;
    flex-direction:column;
    align-items:stretch;
  }
  .teamsplit-create-grid{
    display:flex;
  }
  /* 内联 flex 行（段位/随机分队两个大按钮）在移动端改为纵向，避免横排溢出 */
  #module-teamsplit .teamsplit-action-stack > div{flex-direction:column;gap:10px;}
  .teamsplit-count-badge{
    width:100%;
    min-width:0;
  }
  .teamsplit-room-code{
    width:100%;
    justify-content:space-between;
    margin-bottom:14px;
  }
  .teamsplit-room-code span{
    font-size:24px;
    letter-spacing:2px;
  }
  .teamsplit-teams{
    grid-template-columns:minmax(0,1fr);
  }
  .teamsplit-vs{
    min-height:24px;
  }
  .teamsplit-input,
  .teamsplit-inline-btn,
  .teamsplit-secondary-btn,
  .teamsplit-primary-btn,
    #btnResetSplit{
      width:100%;
    }
    #module-teamsplit{max-width:100%;}
  /* 内战转盘：640px 收紧 */
  .challenge-machine{gap:14px;}
  .machine-text.idle{font-size:14px;}
  .teamsplit-panel{padding:16px 12px;}
  .teamsplit-room-code span{font-size:20px;letter-spacing:1px;}
  .teamsplit-room-code{padding:10px 14px;font-size:13px;}
}
/* ===== 主题切换按钮 ===== */
#themeToggle {
  position: fixed;
  right: 16px;
  top: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  cursor: pointer;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
  transition: all .25s cubic-bezier(.25,.8,.25,1);
}
#themeToggle svg {
  width: 22px;
  height: 22px;
}
#themeToggle:hover {
  transform: scale(1.1) rotate(15deg);
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2), 0 0 20px var(--glow-accent);
}
#themeToggle:active {
  transform: scale(.95) rotate(0deg);
}

/* ===== 内战转盘模块 ===== */
.challenge-machine{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;max-width:520px;min-width:0;}
.machine-frame{
  width:100%;
  max-width:100%;
  min-width:0;
  background:linear-gradient(145deg,color-mix(in srgb,var(--card) 90%,#000),var(--card));
  border:2px solid color-mix(in srgb,var(--accent) 40%,var(--border));
  border-radius:16px;padding:24px 20px;position:relative;overflow:hidden;
  box-shadow:0 0 40px color-mix(in srgb,var(--accent) 15%,transparent);
}
.machine-frame::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--accent),var(--accent2),var(--accent),transparent);
  box-shadow:0 0 15px var(--glow-accent);
}
.machine-label{text-align:center;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:16px;opacity:.85;}
.machine-display{
  background:color-mix(in srgb,#000 70%,var(--card));
  border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  border-radius:10px;padding:20px 24px;min-height:80px;min-width:0;
  display:flex;align-items:center;justify-content:center;
  text-align:center;position:relative;overflow:hidden;
  box-shadow:inset 0 0 30px rgba(255,70,85,0.08);
}
.machine-display::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.015) 2px,rgba(255,255,255,.015) 4px);pointer-events:none;}
.machine-text{font-size:20px;font-weight:700;color:var(--text);line-height:1.5;position:relative;z-index:1;transition:color .2s;min-width:0;word-break:break-word;}
.machine-text.idle{color:var(--text-dim);font-weight:500;font-size:16px;}
.machine-text.spinning{color:var(--accent2);font-size:18px;animation:textFlicker .1s infinite;}
.machine-text.result{color:var(--accent);font-size:22px;text-shadow:0 0 20px color-mix(in srgb,var(--accent) 40%,transparent);}
@keyframes textFlicker{0%,100%{opacity:1;}50%{opacity:.7;}}
.machine-controls{display:flex;justify-content:center;margin-top:16px;}
/* 按钮通用 VALORANT 风格 */
.btn-machine{
  position:relative;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));
  color:#fff;border:none;border-radius:10px;padding:12px 36px;font-size:16px;font-weight:700;
  cursor:pointer;transition:all .25s cubic-bezier(.25,.8,.25,1);letter-spacing:1px;overflow:hidden;
  font-family:var(--font-display);text-transform:uppercase;
}
.btn-machine:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px var(--glow-accent);}
.btn-machine:active:not(:disabled){transform:translateY(0);}
.btn-machine:disabled{opacity:.5;cursor:not-allowed;}
.btn-machine::after{
  content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;
  background:linear-gradient(transparent,rgba(255,255,255,.1),transparent);
  transform:rotate(45deg);transition:all .6s;pointer-events:none;}
.btn-machine:hover::after{left:100%;}
.challenge-count{font-size:13px;color:var(--text-dim);text-align:center;min-width:0;width:100%;}
.challenge-history{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:520px;width:100%;min-width:0;}
.history-chip{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:8px 14px;font-size:13px;color:var(--text-dim);opacity:0;transform:translateY(8px);transition:all .3s ease;}
.history-chip.show{opacity:1;transform:translateY(0);}
.history-chip.latest{border-color:var(--accent);color:var(--accent);font-weight:700;background:color-mix(in srgb,var(--accent) 10%,var(--card));}
.history-chip.latest::before{content:'🎉 ';}
.machine-deco{display:flex;justify-content:center;gap:6px;margin-bottom:4px;}
.machine-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);opacity:.5;animation:dotPulse 1.5s ease infinite;}
.machine-dot:nth-child(2){animation-delay:.3s;}
.machine-dot:nth-child(3){animation-delay:.6s;}
@keyframes dotPulse{0%,100%{opacity:.3;transform:scale(.8);}50%{opacity:1;transform:scale(1.1);}}
@media(max-width:640px){.machine-frame{padding:16px 14px;}.machine-text{font-size:18px;}.machine-text.result{font-size:20px;}.btn-machine{padding:10px 28px;font-size:15px;}}
@media(max-width:420px){.machine-display{padding:14px 16px;min-height:60px;}.machine-text{font-size:16px;}.machine-text.result{font-size:18px;}.history-chip{padding:6px 10px;font-size:12px;}
  .spy-entry-card{padding:16px 10px;}
  .spy-entry-icon{font-size:28px;}
  .spy-entry-title{font-size:14px;}
  .spy-entry-desc{font-size:11px;}
  .spy-setup-card{padding:12px 8px;}
  .spy-player-row{font-size:12px;padding:5px 8px;}
  .spy-team-btn{width:28px;height:26px;font-size:11px;}
  .spy-team-label{font-size:11px;}
  .spy-task-icon{font-size:18px;}
  .spy-task-title{font-size:13px;}
  .teamsplit-panel{padding:14px 8px;}
  .teamsplit-room-code{padding:10px 12px;font-size:13px;}
  .teamsplit-room-code span{font-size:18px;letter-spacing:1px;}
  .teamsplit-code-display{font-size:20px;}
  .teamsplit-player-row{padding:8px 10px;font-size:12px;}
  .teamsplit-input,.teamsplit-select{min-height:42px;font-size:13px;}
  /* 内战转盘：极窄屏收紧 */
  .challenge-machine{gap:12px;}
  .machine-frame{padding:14px 10px;}
  .machine-text{font-size:15px;}
  .machine-text.idle{font-size:13px;}
  .machine-text.result{font-size:17px;}
  .btn-machine{padding:10px 20px;font-size:13px;}
  /* 覆盖 inline 样式：强制分段按钮在极窄屏纵向排列 */
  #module-teamsplit .teamsplit-action-stack > div{flex-direction:column!important;gap:8px;}
}

/* ===== 阶段二：核心体验动效 ===== */

/* --- 抽地图仪式：聚光灯 + 揭晓 --- */
@keyframes spotlightPulse {
  0%, 100% { box-shadow: 0 0 30px var(--glow-accent); }
  50% { box-shadow: 0 0 60px var(--glow-accent), 0 0 100px rgba(255,70,85,0.4); }
}
@keyframes mapWinnerReveal {
  0% { transform: scale(0.3) rotateY(90deg); opacity: 0; }
  50% { transform: scale(1.15) rotateY(-5deg); opacity: 1; }
  100% { transform: scale(1) rotateY(0deg); opacity: 1; }
}
@keyframes mapLoserFade {
  0% { opacity: 1; }
  100% { opacity: 0.2; filter: brightness(0.4); }
}
.map-card.spotlight {
  animation: spotlightPulse 0.6s ease infinite;
  z-index: 10;
  transform: scale(1.1);
}
.map-card.loser-fade {
  animation: mapLoserFade 0.5s ease forwards;
}
.map-result-card.animate-in {
  animation: mapWinnerReveal 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.map-result-card::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 13px;
  background: linear-gradient(45deg, var(--accent), var(--accent2), var(--accent));
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s;
}
.map-result-card.animate-in::after {
  opacity: 1;
  animation: borderRotate 2s linear infinite;
}
@keyframes borderRotate {
  0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}

/* --- 分队结果：对决入场 --- */
@keyframes slideInLeft {
  0% { transform: translateX(-80px); opacity: 0; }
  100% { transform: translateX(0); opacity: 1; }
}
@keyframes slideInRight {
  0% { transform: translateX(80px); opacity: 0; }
  100% { transform: translateX(0); opacity: 1; }
}
@keyframes vsReveal {
  0% { transform: scale(0.3); opacity: 0; text-shadow: none; }
  50% { transform: scale(1.4); }
  100% { transform: scale(1); opacity: 1; text-shadow: 0 0 30px var(--glow-accent); }
}
@keyframes playerStaggerIn {
  0% { transform: translateY(20px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}
.teamsplit-team.slide-left {
  animation: slideInLeft 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}
.teamsplit-team.slide-right {
  animation: slideInRight 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}
.teamsplit-vs.animate-vs {
  animation: vsReveal 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.3s forwards;
  opacity: 0;
}
.teamsplit-team-players .teamsplit-player-row {
  opacity: 0;
  animation: playerStaggerIn 0.4s ease forwards;
}
.teamsplit-player-row:nth-child(1) { animation-delay: 0.5s; }
.teamsplit-player-row:nth-child(2) { animation-delay: 0.65s; }
.teamsplit-player-row:nth-child(3) { animation-delay: 0.8s; }
.teamsplit-player-row:nth-child(4) { animation-delay: 0.95s; }
.teamsplit-player-row:nth-child(5) { animation-delay: 1.1s; }

/* --- 内鬼揭晓：翻转 + 脉冲 --- */
@keyframes spyCardFlip {
  0% { transform: rotateY(0deg); }
  50% { transform: rotateY(90deg); }
  100% { transform: rotateY(0deg); }
}
@keyframes spyRevealGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(255,70,85,0.3); }
  50% { box-shadow: 0 0 50px rgba(255,70,85,0.6), 0 0 80px rgba(255,70,85,0.3); }
}
@keyframes warningPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}
.spy-reveal-col.reveal-animate {
  animation: spyRevealGlow 2s ease infinite;
}
.spy-reveal-name.spy-name-flash {
  animation: warningPulse 1s ease infinite, playerStaggerIn 0.6s ease forwards;
}
.spy-reveal-row.spy-row-reveal {
  opacity: 0;
  animation: playerStaggerIn 0.4s ease forwards;
}
.spy-reveal-row.spy-revealed-spy {
  animation: playerStaggerIn 0.4s ease forwards, spyRevealGlow 2s ease infinite 1.5s;
}

/* ===== 内鬼模式 ===== */
.teamsplit-spy{width:100%;}
.spy-init-card{text-align:center;padding:20px 0;}
.spy-init-icon{font-size:56px;margin-bottom:12px;}
.spy-init-title{font-size:20px;font-weight:800;color:var(--text);margin-bottom:8px;}
.spy-init-sub{font-size:14px;color:var(--text-dim);margin-bottom:24px;line-height:1.6;}
.spy-team-preview{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;text-align:left;}
.spy-team-col{background:color-mix(in srgb,var(--card) 86%,transparent);border-radius:12px;padding:14px;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);}
.spy-team-label{font-size:15px;font-weight:800;text-align:center;padding:8px;border-radius:8px;color:#fff;margin-bottom:10px;}
.spy-team-label.team-a{background:linear-gradient(135deg,#ff4655,#c8303d);}
.spy-team-label.team-b{background:linear-gradient(135deg,#3b82f6,#2563eb);}
.spy-team-players{display:flex;flex-direction:column;gap:6px;}
.spy-team-member{padding:6px 10px;border-radius:8px;background:var(--bg);font-size:13px;font-weight:600;color:var(--text);}
.spy-team-member.spy-self{border:2px solid var(--accent2);background:color-mix(in srgb,var(--accent2) 12%,var(--bg));}

.spy-status-card{text-align:center;padding:40px 0;}
.spy-status-icon{font-size:48px;margin-bottom:12px;animation:spyPulse 1s ease infinite;}
.spy-status-text{font-size:18px;font-weight:700;color:var(--text);}
@keyframes spyPulse{0%,100%{opacity:.6;transform:scale(1);}50%{opacity:1;transform:scale(1.08);}}

.spy-playing-layout{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;}
.spy-card{border-radius:16px;padding:20px;border:1px solid;}
.spy-card-head{font-size:17px;font-weight:800;margin-bottom:14px;}
.spy-card-body p{margin-bottom:8px;font-size:14px;line-height:1.6;color:var(--text);}
.spy-card-body p.spy-hint{color:var(--text-dim);font-size:13px;}
.spy-card-normal{border-color:color-mix(in srgb,var(--border) 80%,transparent);background:color-mix(in srgb,var(--card) 88%,transparent);}
.spy-card-normal .spy-card-head{color:var(--text);}
.spy-card-traitor{border-color:color-mix(in srgb,var(--accent2) 40%,transparent);background:color-mix(in srgb,var(--accent2) 8%,var(--card));}
.spy-card-traitor .spy-card-head{color:var(--accent2);}

.spy-identity-row{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:14px;color:var(--text);}
.spy-identity-row strong{font-size:15px;}

.spy-task-card{margin-top:16px;padding:16px;border-radius:12px;background:color-mix(in srgb,var(--accent2) 12%,transparent);border:1px dashed color-mix(in srgb,var(--accent2) 35%,transparent);}
.spy-task-label{font-size:12px;font-weight:700;color:var(--text-dim);margin-bottom:8px;text-transform:uppercase;letter-spacing:1px;}
.spy-task-main{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.spy-task-icon{font-size:28px;}
.spy-task-title{font-size:18px;font-weight:800;color:var(--accent2);}
.spy-task-desc{font-size:13px;color:var(--text-dim);line-height:1.5;}
.spy-warning{color:var(--accent2);font-size:12px;margin-top:14px;padding:8px 12px;border-radius:8px;background:color-mix(in srgb,var(--accent2) 8%,transparent);}

.spy-action-row{display:flex;justify-content:center;margin-top:20px;}

.spy-reveal-card{text-align:center;padding:20px 0;}
.spy-reveal-icon{font-size:56px;margin-bottom:12px;}
.spy-reveal-title{font-size:22px;font-weight:800;color:var(--accent);margin-bottom:20px;}
.spy-reveal-teams{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;}
.spy-reveal-col{background:color-mix(in srgb,var(--card) 88%,transparent);border-radius:14px;padding:18px;text-align:center;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);}
.spy-reveal-team{font-size:16px;font-weight:800;margin-bottom:10px;padding:8px;border-radius:8px;color:#fff;}
.spy-reveal-name{font-size:24px;font-weight:900;color:var(--accent2);margin-bottom:10px;}
.spy-reveal-task{font-size:12px;color:var(--text-dim);line-height:1.5;}
.spy-reveal-rule{font-size:13px;color:var(--text-dim);line-height:1.8;}

.btn-spy-mode{
  position:relative;background:linear-gradient(135deg,var(--accent2),color-mix(in srgb,var(--accent2) 70%,#000));
  color:#fff;border:none;border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;
  cursor:pointer;transition:all .2s;letter-spacing:1px;overflow:hidden;font-family:inherit;
  min-height:44px;white-space:nowrap;
}
.btn-spy-mode:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px color-mix(in srgb,var(--accent2) 35%,transparent);}
.btn-spy-mode:active:not(:disabled){transform:translateY(0);}
.btn-spy-mode:disabled{opacity:.5;cursor:not-allowed;}

/* ===== 独立内鬼模式 ===== */
.spy-entry-cards{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.spy-entry-card{
  background:color-mix(in srgb,var(--sidebar-bg) 78%,rgba(10,16,24,.78));
  border:1px solid color-mix(in srgb,var(--accent) 16%,var(--border));
  border-radius:18px;padding:28px 24px;width:240px;text-align:center;
  cursor:pointer;transition:all .25s;
  backdrop-filter:blur(14px);box-shadow:0 20px 50px rgba(0,0,0,.2);
}
.spy-entry-card:hover{transform:translateY(-4px);border-color:var(--accent2);box-shadow:0 12px 40px rgba(0,0,0,.35);}
.spy-entry-icon{font-size:42px;margin-bottom:12px;}
.spy-entry-title{font-size:17px;font-weight:800;color:var(--text);margin-bottom:8px;}
.spy-entry-desc{font-size:13px;color:var(--text-dim);line-height:1.5;}
.spy-entry-primary{border-color:var(--accent2);border-width:2px;position:relative;}
.spy-entry-primary::before{content:'推荐';position:absolute;top:-10px;right:16px;background:var(--accent2);color:#fff;font-size:11px;font-weight:700;padding:2px 10px;border-radius:999px;}

.spy-setup-card{
  background:color-mix(in srgb,var(--sidebar-bg) 78%,rgba(10,16,24,.78));
  border:1px solid color-mix(in srgb,var(--accent) 16%,var(--border));
  border-radius:18px;padding:28px;
  backdrop-filter:blur(14px);box-shadow:0 20px 50px rgba(0,0,0,.2);
}
.spy-setup-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:18px;font-weight:800;color:var(--text);}
.spy-setup-back{background:none;border:none;color:var(--accent);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;padding:4px 8px;border-radius:6px;transition:all .15s;}
.spy-setup-back:hover{background:color-mix(in srgb,var(--accent) 12%,transparent);}
.spy-setup-input-row{display:flex;gap:10px;margin-bottom:16px;}
.spy-setup-players{display:flex;flex-wrap:wrap;gap:10px;min-height:52px;padding:14px;border-radius:14px;background:color-mix(in srgb,var(--card) 84%,transparent);border:1px solid color-mix(in srgb,var(--border) 82%,transparent);margin-bottom:18px;}
.spy-setup-empty{font-size:13px;color:var(--text-dim);width:100%;text-align:center;padding:8px;}

/* 拖拽分队 */
.spy-drag-area{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:16px;}
.spy-drag-col{border-radius:12px;padding:10px;border:2px dashed color-mix(in srgb,var(--border) 60%,transparent);min-height:100px;transition:border-color .2s;}
.spy-drag-col.team-a{border-color:rgba(255,70,85,.3);background:rgba(255,70,85,.04);}
.spy-drag-col.team-b{border-color:rgba(40,140,255,.3);background:rgba(40,140,255,.04);}
.spy-drag-label{font-size:13px;font-weight:700;color:var(--text);text-align:center;margin-bottom:8px;padding:4px 0;}
.spy-drag-col.drag-over{border-color:var(--accent)!important;background:color-mix(in srgb,var(--accent) 10%,transparent)!important;box-shadow:0 0 20px color-mix(in srgb,var(--accent) 20%,transparent);}
.spy-drag-list{display:flex;flex-direction:column;gap:4px;min-height:40px;}
.spy-drag-card{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--card) 90%,transparent);border:1px solid var(--border);font-size:13px;font-weight:600;cursor:grab;transition:all .15s;}
.spy-drag-card:hover{background:color-mix(in srgb,var(--accent) 12%,transparent);}
.spy-drag-card:active{cursor:grabbing;opacity:.6;}
.spy-drag-card[draggable="false"]{cursor:default;opacity:.8;}
.spy-drag-card-assign{justify-content:space-between;gap:8px;padding-right:8px;}
.spy-drag-card-assign .spy-drag-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.spy-drag-card-assign .spy-team-btn-row{flex-shrink:0;}
.spy-setup-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--card));border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border));font-size:14px;font-weight:700;color:var(--text);}
.spy-setup-chip-remove{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:none;background:rgba(255,70,85,.15);color:var(--accent);font-size:14px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit;padding:0;line-height:1;}
.spy-player-row{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-radius:10px;margin-bottom:6px;background:color-mix(in srgb,var(--card) 84%,transparent);font-size:14px;}
.spy-team-btn-row{display:flex;gap:4px;}
.spy-team-btn{width:36px;height:30px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s;}
.spy-team-btn-a.active{background:rgba(255,70,85,.2);border-color:rgba(255,70,85,.5);color:#ff4655;}
.spy-team-btn-b.active{background:rgba(40,140,255,.2);border-color:rgba(40,140,255,.5);color:#288cff;}
.spy-team-btn-a:not(.active):hover{background:rgba(255,70,85,.08);}
.spy-team-btn-b:not(.active):hover{background:rgba(40,140,255,.08);}
.spy-setup-chip-remove:hover{background:var(--accent);color:#fff;}
.spy-setup-actions{display:flex;justify-content:center;}

/* 揭晓页全员任务 */
.spy-reveal-all-tasks{display:flex;flex-direction:column;gap:4px;}
.spy-reveal-row{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:8px;background:color-mix(in srgb,var(--card) 84%,transparent);font-size:13px;}
.spy-reveal-row.spy-revealed-spy{background:rgba(255,70,85,.15);border:1px solid rgba(255,70,85,.3);}
.spy-reveal-row-team{width:20px;text-align:center;flex-shrink:0;}
.spy-reveal-row-name{font-weight:700;flex-shrink:0;min-width:60px;}
.spy-reveal-row-task{color:var(--text-dim);}
.spy-setup-actions .btn-spy-mode{width:100%;max-width:320px;}
.spy-viewed{opacity:.45;filter:grayscale(60%);pointer-events:none;}

@media(max-width:640px){
  .spy-playing-layout{grid-template-columns:1fr;}
  .spy-team-preview{grid-template-columns:1fr;}
  .spy-drag-area{grid-template-columns:1fr;}
  .spy-reveal-teams{grid-template-columns:1fr;}
  .spy-init-icon{font-size:42px;}
  .spy-reveal-icon{font-size:42px;}
  /* 入口卡片垂排 */
  .spy-entry-cards{flex-direction:column;gap:10px;}
  .spy-entry-card{padding:18px 14px;}
  .spy-entry-icon{font-size:34px;margin-bottom:8px;}
  .spy-entry-title{font-size:15px;}
  .spy-entry-desc{font-size:12px;}
  /* Lobby 大厅 */
  .spy-setup-card{padding:16px 12px;}
  .spy-setup-head{font-size:15px;flex-wrap:wrap;gap:8px;}
  .spy-player-row{font-size:13px;padding:6px 10px;flex-wrap:wrap;gap:6px;}
  .spy-team-btn{width:44px;height:44px;font-size:14px;}
  .spy-team-col{padding:10px;}
  .spy-team-member{font-size:12px;padding:4px 10px;}
  .spy-team-label{font-size:13px;}
  .spy-player-list{gap:4px;}
  /* 游戏面板 */
  .spy-card-body{padding:14px;}
  .spy-task-card{padding:10px;}
  .spy-task-icon{font-size:20px;}
  .spy-task-title{font-size:14px;}
  .spy-warning{font-size:11px;}
  /* 揭晓 */
  .spy-reveal-card{padding:20px 14px;}
  .spy-reveal-row{font-size:12px;gap:6px;padding:4px 8px;}
  .spy-reveal-row-name{min-width:40px;}
  .spy-reveal-row-task{font-size:11px;}
}

/* ===== 登录注册弹窗 ===== */
.auth-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:9999;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(8px);
}
.auth-card{
  position:relative;
  background:linear-gradient(145deg,color-mix(in srgb,var(--sidebar-bg) 95%,rgba(10,16,24,.95)),var(--sidebar-bg));
  border:1px solid color-mix(in srgb,var(--accent) 20%,var(--border));
  border-radius:16px;padding:40px 36px;width:380px;max-width:92vw;
  box-shadow:0 32px 80px rgba(0,0,0,.5),0 0 60px rgba(255,70,85,0.08);
  text-align:center;
  animation:modalSlideIn .3s ease;
}
@keyframes modalSlideIn{
  0%{opacity:0;transform:translateY(20px) scale(0.98);}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
.auth-close{
  position:absolute;top:12px;right:16px;font-size:20px;color:var(--text-dim);
  cursor:pointer;line-height:1;padding:4px;border-radius:6px;transition:all .15s;
}
.auth-close:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);}
.auth-logo{
  font-size:42px;margin-bottom:8px;
  font-family:var(--font-display);color:var(--accent);
  text-shadow:0 0 20px var(--glow-accent);
}
.auth-title{
  font-family:var(--font-display);
  font-size:24px;font-weight:700;color:var(--text);margin-bottom:4px;
  text-transform:uppercase;letter-spacing:2px;
}
.auth-subtitle{font-size:13px;color:var(--text-dim);margin-bottom:24px;}
.auth-form{display:flex;flex-direction:column;gap:14px;}
.auth-input{
  height:50px;padding:0 16px;border-radius:10px;
  border:1px solid color-mix(in srgb,var(--border) 80%,transparent);
  background:color-mix(in srgb,var(--card) 60%,transparent);
  color:var(--text);font-size:15px;
  font-family:inherit;outline:none;transition:all .2s;
}
.auth-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent);}
.auth-input::placeholder{color:var(--text-dim);font-weight:400;}
.auth-error{font-size:13px;color:var(--accent);min-height:18px;text-align:left;}
.auth-btn{
  height:50px;border-radius:10px;border:none;background:var(--accent);color:#fff;
  font-size:16px;font-weight:700;cursor:pointer;font-family:var(--font-display);
  text-transform:uppercase;letter-spacing:1px;
  transition:all .2s;
  box-shadow:0 4px 16px rgba(255,70,85,0.3);
}
.auth-btn:hover:not(:disabled){
  filter:brightness(1.1);
  box-shadow:0 6px 24px rgba(255,70,85,0.4);
  transform:translateY(-1px);
}
.auth-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px rgba(255,70,85,0.3);}
.auth-btn:disabled{opacity:.6;cursor:not-allowed;}
.auth-switch{font-size:13px;color:var(--text-dim);margin-top:4px;}
.auth-switch-link{color:var(--accent);cursor:pointer;font-weight:600;}
.auth-switch-link:hover{text-decoration:underline;}
.auth-sidebar-entry{
  margin:0 16px 12px;padding:10px 16px;border-radius:10px;
  border:1px dashed color-mix(in srgb,var(--accent) 30%,var(--border));
  font-size:13px;font-weight:600;color:var(--text-dim);cursor:pointer;
  text-align:center;transition:all .15s;
}
.auth-sidebar-entry:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);border-color:var(--accent);}

/* ===== 移动端: 锁图标 ===== */
@media(max-width:640px){
  /* 登录弹窗 */
  .auth-input{font-size:14px;min-height:46px;}
  /* 内战分队 */
  .teamsplit-panel{padding:18px 12px;}
  .teamsplit-room{gap:12px;}
  .teamsplit-code-display{font-size:22px;}
  .teamsplit-join-row{flex-direction:column;gap:8px;}
  .teamsplit-input,.teamsplit-select{min-height:46px;font-size:14px;width:100%;}
  .teamsplit-player-row{padding:10px 12px;font-size:13px;flex-wrap:wrap;gap:8px;}
  .teamsplit-player-row .teamsplit-rank-icon{width:18px;height:18px;}
  .teamsplit-kick-btn{width:40px;height:40px;font-size:16px;}
  /* 内战分队内鬼桥接 */
  .teamsplit-spy{padding:14px 10px;}
  .teamsplit-panel-sub{font-size:13px;}
  .teamsplit-spy .spy-team-member{padding:6px 10px;font-size:12px;}
}

/* ===== 尊重系统「减少动效」偏好（无障碍） ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .teamsplit-player-row,
  .spy-reveal-row,
  .history-chip { opacity: 1 !important; transform: none !important; animation: none !important; }
}

/* ===== 批量打磨：第三批细节 ===== */

/* --- 品牌文本选中 --- */
::selection { background: var(--accent); color: #fff; }
::-moz-selection { background: var(--accent); color: #fff; }

/* --- 自定义滚动条 --- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }

/* --- 焦点跳转链接（无障碍） --- */
.skip-link{
  position:fixed;top:-100px;left:16px;z-index:9999;
  background:var(--accent);color:#fff;padding:8px 16px;
  border-radius:0 0 8px 8px;font-size:13px;font-weight:700;
  text-decoration:none;transition:top .2s;
}
.skip-link:focus{top:0;}

/* --- 空状态 --- */
.empty-state{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;color:var(--text-dim);text-align:center;width:100%;
}
.empty-state-icon{font-size:32px;margin-bottom:12px;opacity:0.5;}
.empty-state-text{font-size:13px;line-height:1.5;}

/* --- 错误状态 --- */
.error-state{
  display:flex;flex-direction:column;align-items:center;
  padding:30px 20px;color:var(--accent);text-align:center;width:100%;
}
.error-state-icon{font-size:28px;margin-bottom:10px;}
.error-state-text{font-size:13px;line-height:1.5;}
.error-retry-btn{
  margin-top:12px;padding:8px 20px;border-radius:8px;
  border:1px solid var(--accent);background:transparent;
  color:var(--accent);cursor:pointer;font-size:13px;font-weight:600;
  transition:all .2s;font-family:inherit;
}
.error-retry-btn:hover{background:var(--accent);color:#fff;}

/* --- 骨架屏加载 --- */
.skeleton{
  background:linear-gradient(90deg,var(--card) 25%,var(--hover) 50%,var(--card) 75%);
  background-size:200% 100%;
  animation:skeletonShimmer 1.5s infinite;
  border-radius:8px;
}
@keyframes skeletonShimmer{
  0%{background-position:200% 0;}
  100%{background-position:-200% 0;}
}

/* --- 网络状态横幅 --- */
.net-status{
  position:fixed;top:0;left:0;right:0;z-index:9998;
  padding:8px 16px;text-align:center;font-size:13px;font-weight:600;
  transform:translateY(-100%);transition:transform .3s;
  background:var(--accent);color:#fff;
}
.net-status.visible{transform:translateY(0);}
.net-status.offline{background:#ef4444;}

/* --- 按钮按下态统一 --- */
.btn-spin:active:not(:disabled){transform:scale(0.98);filter:brightness(0.95);}
.btn-machine:active:not(:disabled){transform:scale(0.98);filter:brightness(0.95);}

/* --- Ban 平滑过渡 --- */
.map-card{transition:filter 0.3s ease, border-color 0.3s ease;}

/* --- 触屏设备：禁用 hover 粘滞 --- */
@media (hover: none){
  .btn-spin:hover:not(:disabled){filter:none;transform:none;box-shadow:none;}
  .hero-card:hover{transform:none;box-shadow:none;background:color-mix(in srgb,var(--card) 10%,transparent);}
  .map-card:hover{transform:none;box-shadow:none;border-color:var(--border);}
  .agent-card:hover{transform:none;}
  .agent-card:hover::after{opacity:0;}
  .btn-machine:hover:not(:disabled){transform:none;box-shadow:none;}
}

/* --- Toast 改进：支持手动关闭 --- */

/* --- 3D 透视容器 --- */
.map-results{perspective:800px;}

/* --- 页面初始化错误提示 --- */
.init-error{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:100vh;padding:40px;text-align:center;
}
.init-error h1{font-size:48px;margin-bottom:16px;}
.init-error p{font-size:16px;color:var(--text-dim);margin-bottom:24px;}
.init-error button{
  padding:12px 24px;border-radius:8px;border:none;background:var(--accent);
  color:#fff;font-size:16px;font-weight:700;cursor:pointer;
}