@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,600;1,700;1,800&display=swap');

/* Champion Leads — Cuckoo 品牌主题(酒红 + 干净白底 + 粗体 Montserrat) */
:root{
  --bg:#F4F5F6;            /* 干净浅灰白底 */
  --bg-2:#FFFFFF;          /* 纯白 — 列表 / 面板背景 */
  --panel:#FFFFFF;
  --panel-solid:#ffffff;
  --border:rgba(20,20,20,0.11);
  --text:#181818;          /* 近黑 */
  --text-dim:#565656;
  --text-faint:#9A9A9A;

  --accent:#B0122A;        /* Cuckoo 酒红 — 主操作色 */
  --accent-2:#8A0C1E;      /* 深红 hover */
  --accent-3:#C8162E;      /* 亮红 强调 */
  --gold:#B0122A;          /* 旧「金色」重定向为品牌红 */
  --purple:#B0122A;
  --coral:#C8162E;

  --warn:#C0392B;
  --sunken:rgba(20,20,20,0.045);
  --shadow-sm:0 1px 2px rgba(20,20,20,.05),0 1px 3px rgba(20,20,20,.05);
  --shadow:0 2px 14px rgba(20,20,20,.09);
  --shadow-lg:0 24px 60px rgba(20,20,20,.18);
  --glow:var(--shadow);
  --radius:10px;
  --grad:linear-gradient(135deg,#C8162E,#8E0E20);
  --font:"Montserrat","PingFang SC","Microsoft YaHei","Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --serif:"Montserrat","PingFang SC","Microsoft YaHei","Noto Sans SC",-apple-system,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--font);font-weight:500;background:var(--bg);color:var(--text);
  background-image:linear-gradient(180deg,#FAFAFB 0%,#F1F2F3 100%);
  background-attachment:fixed;-webkit-font-smoothing:antialiased;}
a{color:var(--accent);text-decoration:none;font-weight:600}

/* 粗体标题系统(无细衬线) */
h1,h2,h3{font-family:var(--font);font-weight:800;letter-spacing:-0.01em;color:var(--text)}
h1 em,h2 em,h3 em{font-style:normal;color:var(--accent);font-weight:800}
/* 红色 eyebrow 小标签 */
.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:700;
  display:flex;align-items:center;gap:10px}
.eyebrow::after{content:'';flex:1;max-width:32px;height:2px;background:var(--accent)}

/* 线条图标系统 (Feather/Lucide 风格,内联 SVG) */
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}
.ico-sm{width:14px;height:14px;stroke-width:2.1}
.ico-lg{width:22px;height:22px}
/* 在线/离线状态点 */
.statusdot{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0;background:var(--text-faint)}
.statusdot.on{background:var(--accent);box-shadow:0 0 0 3px rgba(176,18,42,.18)}

/* 顶栏 — Cuckoo 干净白栏 + 红色粗体字标 */
.topbar{height:58px;background:#FFFFFF;
  border-bottom:1px solid var(--border);box-shadow:0 1px 3px rgba(20,20,20,.04);
  display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:30}
.topbar .t,.topbar .b{font-family:var(--font);font-weight:800;letter-spacing:-.01em;
  display:flex;align-items:center;gap:9px;font-size:20px;color:var(--text)}
.topbar .t .g,.topbar .b .g{color:var(--accent)}
.topbar .t .ico{width:20px;height:20px;color:var(--accent)}
.topbar .links{display:flex;align-items:center;position:absolute;left:50%;transform:translateX(-50%)}
.topbar .links a{margin-left:2px;font-size:13.5px;font-weight:600;color:var(--text-dim);transition:.2s;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:8px}
.topbar .links a .ico,.topbar .links a svg{width:17px;height:17px}
.topbar .links a:hover,.topbar .links a.active{color:var(--accent);background:rgba(176,18,42,.07)}
.langtoggle{margin-left:10px;font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--accent);
  background:transparent;border:1.5px solid rgba(176,18,42,.35);border-radius:8px;padding:5px 11px;transition:.18s;cursor:pointer}
.langtoggle:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.tb-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.tb-right .langtoggle{margin-left:0}
.logout-btn,.wl-lang,#logout{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--accent);background:transparent;
  border:1.5px solid rgba(176,18,42,.35);border-radius:8px;padding:6px 12px;cursor:pointer;transition:.18s}
.logout-btn:hover,.wl-lang:hover,#logout:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.topbar .right{display:flex;align-items:center;gap:10px;margin-left:auto}
/* 登出钮只在客户自助模式(html.self)显示;admin god-view 不显示 */
html:not(.self) .self-only{display:none}

/* 按钮 / 表单 */
button{cursor:pointer;border:0;border-radius:9px;font-weight:700;font-family:var(--font);transition:.2s;
  display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn-primary,.btn-connect{background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(176,18,42,.26);font-weight:700}
.btn-primary:hover,.btn-connect:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(176,18,42,.36);color:#fff}
input,select,textarea{background:#fff;border:1px solid var(--border);color:var(--text);
  border-radius:9px;padding:9px 12px;font-size:14px;font-family:var(--font);font-weight:500;outline:none;transition:.2s}
input::placeholder,textarea::placeholder{color:var(--text-faint)}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(176,18,42,.15)}

/* 玻璃/面板(改为干净实心白卡) */
.glass{background:var(--panel-solid);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}

/* 状态徽章 — 分类色(保留多彩,品牌红用于主色) */
.badge{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700}
.s0{background:#FCE8EC;color:#A0122A}                 /* 品牌红 tint */
.s1{background:#F3ECDD;color:#8A6B2E}                 /* 金/琥珀 */
.s2{background:#EEECFF;color:#5B4DD6}                 /* 紫 */
.s3{background:#EEECFF;color:#5B4DD6}
.s4{background:#E6F5EE;color:#1F7A4E}                 /* 绿 */
.s5{background:#FCEAF1;color:#B23A78}                 /* 粉 */
.s6{background:#FEF0EB;color:#C24A24}                 /* 珊瑚 */
.s7{background:var(--sunken);color:var(--text-faint)} /* 无效 */
.b-connected{background:#E6F5EE;color:#1F7A4E}
.b-qr{background:#F3ECDD;color:#8A6B2E}
.b-reconnecting,.b-starting{background:#FEF0EB;color:#C24A24}
.b-logged_out{background:#FCE8EC;color:#A0122A}
.b-idle{background:var(--sunken);color:var(--text-faint)}

/* 滚动条 */
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(20,20,20,.16);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(20,20,20,.28)}
::-webkit-scrollbar-track{background:transparent}
.muted{color:var(--text-dim)}

/* ===== Auth help center (signup / login pages) ===== */
.help{margin-top:22px;border-top:1px solid var(--border);padding-top:14px}
.help>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:14px;font-weight:700;color:var(--accent);background:rgba(176,18,42,.06);
  border:1px solid rgba(176,18,42,.22);border-radius:10px;padding:13px 14px;transition:background .15s,border-color .15s}
.help>summary::-webkit-details-marker{display:none}
.help>summary .hlabel{display:flex;align-items:center;gap:8px}
.help>summary .ico{width:17px;height:17px;color:var(--accent)}
.help>summary .chev{color:var(--accent);transition:transform .2s}
.help[open]>summary .chev{transform:rotate(180deg)}
.help[open]>summary{margin-bottom:6px}
.help>summary:hover{background:rgba(176,18,42,.12);border-color:rgba(176,18,42,.4)}
.help-intro{font-size:12.5px;color:var(--text-faint);margin:2px 2px 6px}
.help-q{border-top:1px solid var(--border)}
.help-q:first-of-type{border-top:0}
.help-q>summary{list-style:none;cursor:pointer;display:flex;gap:10px;align-items:flex-start;
  font-size:13.5px;font-weight:700;color:var(--text);padding:11px 2px;line-height:1.45}
.help-q>summary::-webkit-details-marker{display:none}
.help-q>summary:hover{color:var(--accent)}
.help-q>summary .qx{flex:1}
.help-q>summary .qplus{color:var(--accent);font-size:18px;line-height:1.2;flex-shrink:0;transition:transform .2s}
.help-q[open]>summary .qplus{transform:rotate(45deg)}
.help-q .ans{font-size:13px;color:var(--text-dim);line-height:1.62;margin:0;padding:0 2px 13px}
.help-q .ans a{font-weight:700}
.help-wa{margin-top:16px;background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:16px}
.help-wa .hw-lead{font-size:12.5px;color:var(--text-dim);line-height:1.55;margin:0 0 12px}
.help-wa .hw-lead b{color:var(--text)}
.help-wa-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;
  background:#25D366;color:#fff;font-size:14.5px;font-weight:700;padding:12px;border-radius:10px;
  box-shadow:0 6px 16px rgba(37,211,102,.28);transition:.18s}
.help-wa-btn:hover{filter:brightness(1.04);transform:translateY(-1px);color:#fff}
.help-hours{display:flex;align-items:flex-start;gap:8px;margin-top:11px;font-size:11.5px;color:var(--text-faint);line-height:1.5}
.help-hours .statusdot{margin-top:4px}
.help-hours .hw-live{color:var(--text-dim);font-weight:700}

/* ===== 页脚 promo(内部工具已隐藏,保留样式兼容) ===== */
.app-promo{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  background:var(--bg-2);border:1px solid rgba(176,18,42,.24);border-radius:14px;padding:22px 24px}
.app-promo .ap-eyebrow{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);font-weight:800;margin-bottom:9px}
.app-promo .ap-line{font-family:var(--font);font-weight:700;font-size:19px;line-height:1.35;color:var(--text);max-width:46ch}
.app-promo .ap-line em{font-style:normal;color:var(--accent)}
.app-promo .ap-cta{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  background:transparent;color:var(--accent);border:1.5px solid var(--accent);
  padding:12px 22px;border-radius:10px;font-weight:700;font-size:14.5px;font-family:var(--font);transition:.18s}
.app-promo .ap-cta:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-1px)}
.foot-ig{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:11px}
.foot-ig a{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);font-size:12px}
.foot-ig a:hover{color:var(--accent)}
.foot-ig svg{width:15px;height:15px}
@media(max-width:560px){
  .app-promo{flex-direction:column;align-items:flex-start;gap:16px}
  .app-promo .ap-cta{width:100%;justify-content:center}
}

/* ===== 手机:底部 tab 导航 + 顶栏自适应(共用) ===== */
.mnav{display:none}
@media(max-width:680px){
  .topbar{padding:0 16px}
  .topbar .t,.topbar .b{font-size:18px}
  .topbar .links a{display:none}
  .topbar .links .langtoggle{margin-left:0}
  .mnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:#FFFFFF;border-top:1px solid var(--border);
    padding-bottom:env(safe-area-inset-bottom)}
  .mnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
    padding:8px 2px 7px;color:var(--text-faint);font-size:11px;font-weight:700;
    text-decoration:none;transition:.15s;-webkit-tap-highlight-color:transparent}
  .mnav a .ico{width:23px;height:23px}
  .mnav a.active{color:var(--accent)}
  .mnav a:active{background:rgba(176,18,42,.06)}
  body.mnav-on:not(.mnav-fixed){padding-bottom:62px}
}