/* ============================================================================
   圆圆糖水 · Design System  v4.0   ( ui.css )
   ----------------------------------------------------------------------------
   设计定位：纯白 / 高级 / 极简 / 现代 / 轻科技感 企业级 SaaS
   视觉关键词：PURE WHITE · MINIMAL · PREMIUM · MODERN · CLEAN · LIGHT TECH

   加载策略（重要，勿改）：
     本文件以 <link> 形式**排在页面内联 <style> 之后**加载，
     同优先级规则后者胜出 → 用它统一覆盖/重绘旧视觉，
     页面内联样式与业务 JS 一行都不删。
     因此：这里只做「视觉层覆盖」，绝不涉及业务逻辑。

   配色：白 90% + 品牌绿点睛。绿只用于品牌/主按钮/选中/重点数据/成功。
   ========================================================================== */

/* ---------------------------------------------------------------------------
   0. 设计令牌
   ------------------------------------------------------------------------ */
:root{
  /* 品牌色 · 高级绿 */
  --rs-brand:#22A06B;
  --rs-brand-hover:#1E8F5F;
  --rs-brand-active:#187A51;
  --rs-brand-50:#F2FAF6;
  --rs-brand-100:#E4F5EC;
  --rs-brand-200:#C9EBD9;
  --rs-brand-ink:#12603F;

  /* 中性色 */
  --rs-text-1:#111827;
  --rs-text-2:#6B7280;
  --rs-text-3:#9CA3AF;
  --rs-line:#E5E7EB;
  --rs-line-soft:#F0F0F0;
  --rs-line-hair:#F3F4F6;
  --rs-bg:#FFFFFF;
  --rs-bg-soft:#F8FAFC;
  --rs-bg-hover:#FAFAFA;

  /* 语义色（低饱和，克制） */
  --rs-danger:#DC2626;   --rs-danger-soft:#FEF2F2;  --rs-danger-line:#FECACA;
  --rs-warn:#B45309;     --rs-warn-soft:#FFFBEB;    --rs-warn-line:#FDE68A;
  --rs-info:#2563EB;     --rs-info-soft:#EFF6FF;    --rs-info-line:#BFDBFE;
  --rs-ok:#15803D;       --rs-ok-soft:#F0FDF4;      --rs-ok-line:#BBF7D0;
  --rs-violet:#6D28D9;   --rs-violet-soft:#F5F3FF;

  /* 圆角 */
  --rs-r-xs:6px; --rs-r-sm:8px; --rs-r:10px; --rs-r-lg:12px; --rs-r-xl:16px;

  /* 阴影（非常轻，靠边框和留白做层次） */
  --rs-sh-xs:0 1px 2px rgba(16,24,40,.04);
  --rs-sh-sm:0 1px 3px rgba(16,24,40,.06);
  --rs-sh:0 4px 20px rgba(0,0,0,.04);
  --rs-sh-md:0 8px 28px rgba(16,24,40,.07);
  --rs-sh-lg:0 20px 60px rgba(0,0,0,.08);

  /* 节奏 */
  --rs-t-fast:150ms; --rs-t:200ms; --rs-t-slow:300ms;
  --rs-ease:cubic-bezier(.4,0,.2,1);
  --rs-sidebar-w:244px;
  --rs-header-h:64px;

  --rs-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",
            "Hiragino Sans GB","Microsoft YaHei",sans-serif;
}

/* --- 覆盖旧页面的历史令牌（同名变量，靠加载顺序取胜） --------------------- */
:root{
  /* finance.html 旧令牌 */
  --primary:var(--rs-brand); --primary-hover:var(--rs-brand-hover); --primary-light:var(--rs-brand-50);
  --success:#15803D; --success-light:#F0FDF4;
  --warning:#B45309; --warning-light:#FFFBEB;
  --danger:#DC2626; --danger-light:#FEF2F2;
  --info:#2563EB; --info-light:#EFF6FF;
  --text-1:#111827; --text-2:#6B7280; --text-3:#9CA3AF;
  --bg:#F8FAFC; --bg-elevated:#fff;
  --border:#E5E7EB; --border-strong:#D1D5DB;
  --radius:10px; --radius-lg:12px; --radius-xl:16px;
  --shadow-sm:var(--rs-sh-xs); --shadow:var(--rs-sh-sm); --shadow-lg:var(--rs-sh-md);
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
}

/* ---------------------------------------------------------------------------
   1. 基础
   ------------------------------------------------------------------------ */
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--rs-font);
  background:var(--rs-bg);
  color:var(--rs-text-1);
  font-size:14px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%}
a{color:var(--rs-brand);text-decoration:none}
a:hover{color:var(--rs-brand-hover)}
h1,h2,h3,h4{font-weight:650;letter-spacing:-.01em}
::selection{background:var(--rs-brand-100);color:var(--rs-brand-ink)}
/* 细滚动条，减少视觉噪音 */
*{scrollbar-width:thin;scrollbar-color:#D8DEE6 transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#DDE3EA;border-radius:99px;border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:#C7D0DA;background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}

/* 焦点可见性（可访问性：键盘 Tab 有品牌色描边） */
:focus-visible{outline:2px solid var(--rs-brand);outline-offset:2px}
/* 屏幕阅读器专用 */
.rs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------------------------------------------------------------------------
   2. 图标（Lucide 几何，内联 SVG —— 不外链 CDN，内网/断网也稳定）
   ------------------------------------------------------------------------ */
.rs-i{
  width:1em;height:1em;display:inline-block;vertical-align:-.14em;
  fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  flex:none;overflow:visible;
}
.rs-i-lg{width:20px;height:20px;stroke-width:1.75}
.rs-i-sm{width:14px;height:14px;stroke-width:2.2}

/* ---------------------------------------------------------------------------
   3. 粒子背景（Canvas 2D + rAF，运行时由 ui.js 驱动）
   ------------------------------------------------------------------------ */
.rs-particles{
  position:fixed;inset:0;width:100%;height:100%;
  pointer-events:none;z-index:0;display:block;
}
/* 登录页粒子在最底层，内容层浮起 */
.rs-particles-host{position:relative;z-index:1}

/* ---------------------------------------------------------------------------
   4. 登录 / 注册（左品牌 + 右表单；<768px 单栏）
   ------------------------------------------------------------------------ */
.rs-auth{
  min-height:100vh;min-height:100dvh;display:flex;
  background:var(--rs-bg);overflow-x:hidden;
}
/* —— 左：品牌展示 —— */
.rs-auth-brand{
  position:relative;flex:0 0 55%;max-width:55%;
  display:flex;flex-direction:column;justify-content:center;
  padding:56px 8% 56px 7%;
  background:
    radial-gradient(120% 80% at 0% 0%, #F4FBF7 0%, rgba(244,251,247,0) 58%),
    radial-gradient(90% 70% at 88% 100%, #F3F8FF 0%, rgba(243,248,255,0) 55%),
    var(--rs-bg);
  border-right:1px solid var(--rs-line-soft);
  overflow:hidden;
}
/* 细线几何装饰（极淡） */
.rs-auth-brand::before,
.rs-auth-brand::after{
  content:"";position:absolute;border-radius:50%;pointer-events:none;
}
.rs-auth-brand::before{
  width:520px;height:520px;left:-160px;top:-140px;
  border:1px solid rgba(34,160,107,.10);
  box-shadow:0 0 0 60px rgba(34,160,107,.035);
}
.rs-auth-brand::after{
  width:340px;height:340px;right:-120px;bottom:-120px;
  border:1px solid rgba(37,99,235,.08);
}
.rs-brand-inner{position:relative;z-index:1;max-width:560px}
.rs-brand-logo{display:flex;align-items:center;gap:11px;margin-bottom:52px}
.rs-brand-logo>span:last-child{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.rs-brand-mark{
  width:40px;height:40px;border-radius:12px;flex:none;
  background:linear-gradient(150deg,var(--rs-brand) 0%,#1B8A5C 100%);
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 6px 18px rgba(34,160,107,.22);
}
.rs-brand-mark .rs-i{width:22px;height:22px;stroke-width:1.8}
.rs-brand-name{font-size:17px;font-weight:700;letter-spacing:-.01em}
.rs-brand-tag{font-size:12px;color:var(--rs-text-3);margin-top:1px}
.rs-hero-title{
  font-size:clamp(28px,3.2vw,42px);line-height:1.28;font-weight:700;letter-spacing:-.02em;
  color:var(--rs-text-1);margin:0 0 18px;
}
.rs-hero-title em{font-style:normal;color:var(--rs-brand)}
.rs-hero-desc{font-size:14.5px;color:var(--rs-text-2);line-height:1.85;margin:0 0 40px;max-width:430px}
.rs-feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:520px}
.rs-feat{
  background:rgba(255,255,255,.72);border:1px solid var(--rs-line);
  border-radius:var(--rs-r-lg);padding:15px 14px;
  backdrop-filter:blur(6px);
}
.rs-feat .rs-fi{
  width:32px;height:32px;border-radius:9px;background:var(--rs-brand-50);
  color:var(--rs-brand);display:flex;align-items:center;justify-content:center;margin-bottom:10px;
}
.rs-feat .rs-fi .rs-i{width:17px;height:17px}
.rs-feat .rs-ft{font-size:13.5px;font-weight:600;color:var(--rs-text-1)}
.rs-feat .rs-fd{font-size:12px;color:var(--rs-text-3);margin-top:3px;line-height:1.5}

/* —— 右：表单 —— */
.rs-auth-form{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:40px 28px;position:relative;
}
.rs-auth-card{
  width:100%;max-width:412px;
  background:#fff;border:1px solid var(--rs-line-soft);border-radius:var(--rs-r-xl);
  box-shadow:0 20px 60px rgba(0,0,0,.04);
  padding:34px 32px 26px;
}
.rs-auth-head{text-align:center;margin-bottom:26px}
.rs-auth-head .rs-ah-logo{
  width:48px;height:48px;border-radius:14px;margin:0 auto 14px;
  background:linear-gradient(150deg,var(--rs-brand) 0%,#1B8A5C 100%);
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 8px 22px rgba(34,160,107,.24);
}
.rs-auth-head .rs-ah-logo .rs-i{width:26px;height:26px;stroke-width:1.8}
.rs-auth-head h1{font-size:22px;font-weight:700;color:var(--rs-text-1);margin:0 0 6px;letter-spacing:-.015em}
.rs-auth-head p{font-size:13px;color:var(--rs-text-3);margin:0}

.rs-field{margin-bottom:15px}
.rs-field label{display:block;font-size:12.5px;font-weight:550;color:var(--rs-text-2);margin-bottom:7px}
.rs-input-wrap{position:relative;display:flex;align-items:center}
.rs-input-wrap>.rs-i{position:absolute;left:13px;width:16px;height:16px;color:var(--rs-text-3);pointer-events:none}
.rs-input-wrap input{padding-left:38px}
.rs-input-wrap .rs-eye{
  position:absolute;right:6px;width:32px;height:32px;border:0;background:none;cursor:pointer;
  color:var(--rs-text-3);display:flex;align-items:center;justify-content:center;border-radius:8px;
}
.rs-input-wrap .rs-eye:hover{color:var(--rs-text-2);background:var(--rs-bg-soft)}
.rs-input-wrap .rs-eye .rs-i{width:16px;height:16px}

button,.btn,input,select,textarea{font-family:inherit}
input[type=text],input[type=password],input[type=tel],input[type=number],input[type=date],
input[type=email],select,textarea{
  width:100%;height:44px;padding:0 13px;
  border:1px solid var(--rs-line);border-radius:var(--rs-r);
  background:#fff;color:var(--rs-text-1);font-size:14px;outline:none;
  transition:border-color var(--rs-t-fast) var(--rs-ease),box-shadow var(--rs-t-fast) var(--rs-ease);
}
textarea{height:auto;padding:11px 13px;line-height:1.6;resize:vertical}
input::placeholder,textarea::placeholder{color:var(--rs-text-3)}
input:hover:not(:focus),select:hover:not(:focus),textarea:hover:not(:focus){border-color:#D8DEE6}
input:focus,select:focus,textarea:focus{
  border-color:var(--rs-brand);
  box-shadow:0 0 0 3px rgba(34,160,107,.12);
}
input.bad,input.invalid{border-color:var(--rs-danger)!important;box-shadow:0 0 0 3px rgba(220,38,38,.10)!important}
input:disabled,select:disabled,textarea:disabled{background:var(--rs-bg-soft);color:var(--rs-text-3);cursor:not-allowed}

.rs-btn{
  height:46px;width:100%;border:0;border-radius:var(--rs-r);
  background:var(--rs-brand);color:#fff;font-size:15px;font-weight:600;letter-spacing:.01em;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  transition:background var(--rs-t-fast) var(--rs-ease),box-shadow var(--rs-t-fast) var(--rs-ease),transform 100ms var(--rs-ease);
}
.rs-btn:hover:not(:disabled){background:var(--rs-brand-hover);box-shadow:0 6px 18px rgba(34,160,107,.24)}
.rs-btn:active:not(:disabled){background:var(--rs-brand-active);transform:translateY(1px);box-shadow:none}
.rs-btn:disabled{opacity:.55;cursor:not-allowed}
.rs-btn .rs-spin{
  width:15px;height:15px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;
  border-radius:50%;animation:rsSpin .7s linear infinite;
}
@keyframes rsSpin{to{transform:rotate(360deg)}}

.rs-auth-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0 4px;font-size:13px}
.rs-auth-row .rs-link{color:var(--rs-brand);cursor:pointer;font-weight:550}
.rs-auth-row .rs-link:hover{color:var(--rs-brand-hover);text-decoration:underline;text-underline-offset:3px}
.rs-auth-row .rs-link-mute{color:var(--rs-text-3);cursor:pointer}
.rs-auth-row .rs-link-mute:hover{color:var(--rs-text-2)}
.rs-auth-msg{
  min-height:20px;font-size:12.5px;color:var(--rs-danger);text-align:center;margin-top:12px;
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.rs-auth-msg.ok{color:var(--rs-ok)}
.rs-auth-msg .rs-i{width:14px;height:14px}
.rs-auth-tip{
  font-size:12.5px;color:var(--rs-text-2);background:var(--rs-bg-soft);border:1px solid var(--rs-line);
  border-radius:var(--rs-r-sm);padding:9px 12px;margin-top:12px;text-align:center;line-height:1.6;
}
.rs-auth-ver{
  font-size:11.5px;color:#C3C9D2;text-align:center;margin-top:18px;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
}
.rs-auth-hint{font-size:12px;color:var(--rs-text-3);margin-top:6px;line-height:1.55}

.rs-auth-foot-note{
  display:flex;align-items:center;justify-content:center;gap:7px;
  font-size:12px;color:var(--rs-text-3);margin-top:20px;
}
.rs-auth-foot-note .rs-i{width:13px;height:13px}

/* 单栏时显示的品牌头（桌面隐藏） */
.rs-auth-mobile-brand{display:none;text-align:center;margin-bottom:22px}
.rs-auth-mobile-brand .rs-brand-mark{margin:0 auto 10px;width:44px;height:44px}
.rs-auth-mobile-brand .n{font-size:19px;font-weight:700}
.rs-auth-mobile-brand .t{font-size:12.5px;color:var(--rs-text-3);margin-top:2px}

/* 弹窗（实名） */
.rs-modal-mask{
  position:fixed;inset:0;background:rgba(15,23,42,.25);z-index:200;
  display:none;align-items:center;justify-content:center;padding:20px;
  -webkit-backdrop-filter:saturate(140%) blur(2px);backdrop-filter:saturate(140%) blur(2px);
}
.rs-modal-mask.show{display:flex;animation:rsFadeIn var(--rs-t) var(--rs-ease)}
.rs-modal{
  width:100%;max-width:412px;background:#fff;border-radius:var(--rs-r-xl);
  box-shadow:var(--rs-sh-lg);padding:28px 26px 24px;animation:rsPopIn var(--rs-t-slow) var(--rs-ease);
}
.rs-modal h2{font-size:18px;font-weight:700;text-align:center;margin:0 0 6px}
.rs-modal .rs-modal-sub{font-size:12.5px;color:var(--rs-text-3);text-align:center;margin:0 0 20px;line-height:1.65}
@keyframes rsFadeIn{from{opacity:0}to{opacity:1}}
@keyframes rsPopIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}

@media (max-width:900px){
  .rs-auth-brand{padding:44px 5%}
  .rs-hero-title{font-size:30px}
  .rs-feats{grid-template-columns:1fr;gap:10px}
  .rs-feat{display:flex;align-items:center;gap:12px;padding:12px}
  .rs-feat .rs-fi{margin-bottom:0}
}
@media (max-width:767.98px){
  .rs-auth{display:block}
  .rs-auth-brand{display:none}            /* 硬性要求：<768 隐藏左侧品牌区 */
  .rs-auth-form{padding:24px 20px 32px;min-height:100vh;min-height:100dvh;align-items:flex-start}
  .rs-auth-card{
    max-width:420px;margin:0 auto;border:0;box-shadow:none;padding:26px 4px 0;background:transparent;
  }
  .rs-auth-mobile-brand{display:block}
  .rs-auth-head{display:none}
}

/* ---------------------------------------------------------------------------
   5. 后台：白色 Sidebar（覆盖 finance.html 的深色侧栏）
   ------------------------------------------------------------------------ */
.sidebar{
  width:var(--rs-sidebar-w);
  background:#fff;
  border-right:1px solid var(--rs-line);
  box-shadow:none;
  color:var(--rs-text-2);
  display:flex;flex-direction:column;
  position:fixed;left:0;top:0;bottom:0;z-index:60;
  transition:transform var(--rs-t) var(--rs-ease);
}
.sidebar .logo{
  height:var(--rs-header-h);flex:none;
  display:flex;align-items:center;gap:10px;
  padding:0 18px;border-bottom:1px solid var(--rs-line-soft);
  color:var(--rs-text-1);font-size:15.5px;font-weight:700;letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;
}
/* logo 图标：伪元素画一个品牌水滴方块，替代 😋 emoji（emoji 已由 JS 移除） */
.sidebar .logo .rs-brandmark{
  width:32px;height:32px;border-radius:10px;flex:none;
  background:linear-gradient(150deg,var(--rs-brand) 0%,#1B8A5C 100%);
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 4px 12px rgba(34,160,107,.20);
}
.sidebar .logo .rs-brandmark .rs-i{width:17px;height:17px;stroke-width:1.9}
.sidebar .logo .lgtxt{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.sidebar .logo .sub{
  font-size:11px;font-weight:500;color:var(--rs-text-3);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sidebar .ver{
  padding:0 18px 8px;font-size:10.5px;color:#C3C9D2;border:0;background:none;
  font-variant-numeric:tabular-nums;
}
.sidebar .nav{flex:1;padding:12px 12px 16px;overflow-y:auto;overflow-x:hidden}
.sidebar .nav-head{
  padding:16px 10px 6px;font-size:11px;font-weight:600;color:var(--rs-text-3);
  letter-spacing:.06em;text-transform:none;
}
.sidebar .nav-head:first-child{padding-top:4px}
.sidebar .nav-item{
  position:relative;display:flex;align-items:center;gap:11px;
  min-height:42px;padding:9px 11px;margin-bottom:2px;
  border-radius:var(--rs-r-sm);cursor:pointer;
  font-size:13.5px;font-weight:500;color:var(--rs-text-2);
  transition:background var(--rs-t-fast) var(--rs-ease),color var(--rs-t-fast) var(--rs-ease);
  user-select:none;
}
.sidebar .nav-item .ico{
  width:18px;height:18px;font-size:0;display:flex;align-items:center;justify-content:center;
  color:var(--rs-text-3);flex:none;
  transition:color var(--rs-t-fast) var(--rs-ease);
}
.sidebar .nav-item .ico .rs-i{width:17px;height:17px;stroke-width:1.8}
.sidebar .nav-item:hover{background:var(--rs-bg-soft);color:var(--rs-text-1)}
.sidebar .nav-item:hover .ico{color:var(--rs-text-2)}
.sidebar .nav-item.on{
  background:var(--rs-brand-50);color:var(--rs-brand-ink);font-weight:600;
}
.sidebar .nav-item.on .ico{color:var(--rs-brand)}
/* Active 左侧细微品牌色标识 */
.sidebar .nav-item.on::before{
  content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);
  width:3px;height:18px;border-radius:0 3px 3px 0;background:var(--rs-brand);
  animation:rsBarIn var(--rs-t) var(--rs-ease);
}
@keyframes rsBarIn{from{height:0;opacity:0}to{height:18px;opacity:1}}
.sidebar .nav-item .badge{
  margin-left:auto;background:var(--rs-danger);color:#fff;
  font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:99px;
  min-width:18px;text-align:center;line-height:16px;
}
.sidebar .nav-item.on .badge{background:var(--rs-brand);color:#fff}
.sidebar .foot{
  flex:none;padding:14px 16px 16px;border-top:1px solid var(--rs-line-soft);
  font-size:12.5px;color:var(--rs-text-2);line-height:1.7;background:#fff;
}
.sidebar .foot .logout{
  color:var(--rs-text-3);cursor:pointer;display:inline-flex;align-items:center;gap:5px;
  margin-top:6px;transition:color var(--rs-t-fast) var(--rs-ease);
}
.sidebar .foot .logout:hover{color:var(--rs-danger)}
.sidebar .foot .logout .rs-i{width:13px;height:13px}

/* ---------------------------------------------------------------------------
   6. 后台：Main / Header
   ------------------------------------------------------------------------ */
.main{
  margin-left:var(--rs-sidebar-w);
  padding:0 28px 56px;
  max-width:1600px;
  position:relative;z-index:1;
  transition:margin var(--rs-t) var(--rs-ease);
}
/* Header：纯白、吸顶、底部 1px 发丝线 */
.topbar{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  height:var(--rs-header-h);
  margin:0 -28px 20px;padding:0 28px;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:saturate(180%) blur(12px);backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--rs-line-soft);
}
.topbar .title{
  flex:1;min-width:0;
  font-size:19px;font-weight:680;letter-spacing:-.015em;color:var(--rs-text-1);
  display:flex;align-items:center;gap:9px;
}
.topbar .title::before{
  content:"";width:3px;height:16px;border-radius:2px;background:var(--rs-brand);flex:none;
}
.topbar .user{
  font-size:12.5px;color:var(--rs-text-3);display:flex;align-items:center;gap:8px;
  border:1px solid var(--rs-line);border-radius:99px;padding:6px 13px;background:#fff;
  max-width:46vw;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
}
.topbar .user b{color:var(--rs-text-1);font-weight:600}

/* 汉堡按钮（<768 显示） */
.rs-burger{
  display:none;width:38px;height:38px;flex:none;align-items:center;justify-content:center;
  border:1px solid var(--rs-line);border-radius:var(--rs-r-sm);background:#fff;
  color:var(--rs-text-2);cursor:pointer;
}
.rs-burger:hover{background:var(--rs-bg-soft);color:var(--rs-text-1)}
.rs-burger .rs-i{width:18px;height:18px}
/* 抽屉遮罩 */
.rs-scrim{
  position:fixed;inset:0;background:rgba(15,23,42,.25);z-index:59;
  opacity:0;visibility:hidden;transition:opacity var(--rs-t) var(--rs-ease),visibility var(--rs-t);
}
.rs-scrim.show{opacity:1;visibility:visible}

/* 门店条（后台） */
.storebar{margin-bottom:16px}
.storebar .sb-btn{
  min-height:38px;padding:0 14px;border:1px solid var(--rs-line);border-radius:var(--rs-r-sm);
  background:#fff;font-size:13px;color:var(--rs-text-2);box-shadow:none;
}
.storebar .sb-btn:hover{border-color:var(--rs-brand);color:var(--rs-text-1)}
.storebar .sb-hint{color:var(--rs-text-3);font-size:12px}
.sb-menu{border-radius:var(--rs-r-lg);box-shadow:var(--rs-sh-md);border-color:var(--rs-line)}
.sb-menu .item{font-size:13.5px}
.sb-menu .item:hover{background:var(--rs-brand-50)}

/* 移动端横向 tab（已被抽屉取代，保留 DOM 但不再展示） */
.mtabs{display:none!important}

/* ---------------------------------------------------------------------------
   7. 通用组件：卡片 / 区块 / 页标题
   ------------------------------------------------------------------------ */
/* 安全网：任何情况下整页都不出现横向滚动条。
   overflow-x:clip 不会创建滚动容器，因此不会破坏 topbar / thead 的 position:sticky；
   不支持的旧浏览器会忽略该声明，退回到原有的可见行为（不影响功能）。 */
html{overflow-x:clip}
body{overflow-x:clip}

.section{
  background:#fff;border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  padding:18px 20px;margin-bottom:16px;box-shadow:var(--rs-sh-xs);
  /* 业务表格字段多：滚动容器只包住这一块，整页不横滚（老板硬性要求） */
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
}
.section>.head{margin-bottom:14px}
.section .head .t{
  font-size:14.5px;font-weight:650;color:var(--rs-text-1);
  display:flex;align-items:center;gap:8px;
}
.section .head .more{
  font-size:12.5px;color:var(--rs-brand);cursor:pointer;font-weight:550;
  display:inline-flex;align-items:center;gap:3px;
}
.section .head .more:hover{color:var(--rs-brand-hover)}

/* 覆盖 finance 旧 .card（白卡 + 细边框 + 极轻阴影） */
.card{
  background:#fff;border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  box-shadow:var(--rs-sh-xs);padding:16px;
}
.card .label{font-size:12px;color:var(--rs-text-3);margin-bottom:6px;font-weight:500}
.card .val{
  font-size:25px;font-weight:700;color:var(--rs-text-1);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.15;
}
.card .val small{font-size:13px;font-weight:600;color:var(--rs-text-3);margin-left:2px}
.card .hint{font-size:12px;color:var(--rs-text-3);margin-top:5px}
/* 重点卡：白底 + 品牌环，取代旧橙色渐变块（不使用大面积彩色） */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:16px}
.card.orange{
  background:#fff;border-color:var(--rs-brand-200);color:var(--rs-text-1);
  box-shadow:0 4px 20px rgba(34,160,107,.08);
}
.card.orange .label,.card.orange .hint{color:var(--rs-text-3)}
.card.orange .val{color:var(--rs-brand)}
.card .badge-dot{background:var(--rs-danger);animation:rsBlink 1.6s infinite}
@keyframes rsBlink{50%{opacity:.25}}

.note{
  background:var(--rs-bg-soft);border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  padding:13px 16px;font-size:12.8px;color:var(--rs-text-2);line-height:1.7;margin-bottom:16px;
}
.notice,.alertbar{
  background:var(--rs-warn-soft);border:1px solid var(--rs-warn-line);border-radius:var(--rs-r-sm);
  padding:10px 14px;font-size:12.8px;color:var(--rs-warn);margin-bottom:12px;
}
.empty-state .es-ico{font-size:0;color:var(--rs-text-3);display:flex;justify-content:center;margin-bottom:14px}
.empty-state .es-ico .rs-i{width:34px;height:34px;stroke-width:1.5}
.todo-card{box-shadow:var(--rs-sh-xs);border-radius:var(--rs-r-lg);transition:box-shadow var(--rs-t) var(--rs-ease),border-color var(--rs-t) var(--rs-ease)}
.todo-card:hover{box-shadow:var(--rs-sh-md);border-color:#D8DEE6}
.pcard{box-shadow:var(--rs-sh-xs);border-radius:var(--rs-r-lg)}
.prec{border-radius:var(--rs-r);background:var(--rs-bg-soft)}
.bg-acc,.bg-account{
  background:var(--rs-warn-soft);border:1px solid var(--rs-warn-line);border-radius:var(--rs-r-lg);
}
.bg-acc .amt,.bg-account .amt{color:var(--rs-warn)}
.bg-acc .warn,.bg-account .warn{color:var(--rs-danger)}

/* 页面切换：淡入 + 轻微上浮 */
.page{display:none}
.page.active{display:block;animation:rsPageIn var(--rs-t-slow) var(--rs-ease)}
@keyframes rsPageIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------------------------------------------------------------------------
   8. 筛选工具栏
   ------------------------------------------------------------------------ */
.filters{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  background:#fff;border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  padding:13px 14px;margin-bottom:14px;box-shadow:var(--rs-sh-xs);
  row-gap:10px;
}
.filters>*{margin:0}
.filters select,.filters input:not([type=checkbox]):not([type=radio]),
.filters .f-input{
  height:38px;padding:0 11px;font-size:13px;border-radius:var(--rs-r-sm);
  border:1px solid var(--rs-line);background:#fff;width:auto;min-width:0;
}
.filters input[type=date]{width:142px}
.filters .btn{height:38px;padding:0 16px;display:inline-flex;align-items:center;gap:6px;font-size:13px}
.filters .sep{color:var(--rs-text-3);font-size:12px}
.sup-filters{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;
}
.sup-filters select,.sup-filters input{height:38px;font-size:13px;border-radius:var(--rs-r-sm)}
.sup-filters label.ck{min-height:38px;border-radius:var(--rs-r-sm);font-size:13px}
.sup-filters label.ck:hover{border-color:var(--rs-brand)}

/* ---------------------------------------------------------------------------
   9. 按钮（统一）
   ------------------------------------------------------------------------ */
/* 注意：这里只能写 .btn，不能写 button.btn —— 后者特异性 (0,1,1) 会压过
   .btn-ghost (0,1,0) 的 border-color，导致「取消」这类按钮边框变成透明 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:38px;padding:0 15px;border:1px solid transparent;border-radius:var(--rs-r-sm);
  font-size:13px;font-weight:550;letter-spacing:0;cursor:pointer;
  background:#fff;color:var(--rs-text-1);
  transition:background var(--rs-t-fast) var(--rs-ease),border-color var(--rs-t-fast) var(--rs-ease),
             box-shadow var(--rs-t-fast) var(--rs-ease),color var(--rs-t-fast) var(--rs-ease);
}
.btn .rs-i{width:15px;height:15px;stroke-width:1.9}
.btn-primary{background:var(--rs-brand);border-color:var(--rs-brand);color:#fff}
.btn-primary:hover:not(:disabled){background:var(--rs-brand-hover);border-color:var(--rs-brand-hover);box-shadow:0 4px 14px rgba(34,160,107,.22)}
/* V3.56 修复：shop.html 自带 .btn-row .btn{background:#fff}（0,2,0）压过 .btn-primary（0,1,0），
   导致修改密码等弹窗「确认修改」白底白字看不见。这里用 (0,3,0) 抢回来。 */
.btn-row .btn.btn-primary,.btn-row .btn.btn-green{
  background:var(--rs-brand);border-color:var(--rs-brand);color:#fff;
}
.btn-row .btn.btn-primary:hover:not(:disabled),.btn-row .btn.btn-green:hover:not(:disabled){
  background:var(--rs-brand-hover);border-color:var(--rs-brand-hover);
}
.btn-row .btn.btn-red,.btn-row .btn.btn-danger{
  background:var(--rs-danger-soft);border-color:var(--rs-danger-line);color:var(--rs-danger);
}
.btn-green{background:var(--rs-brand);border-color:var(--rs-brand);color:#fff}
.btn-green:hover:not(:disabled){background:var(--rs-brand-hover);border-color:var(--rs-brand-hover)}
.btn-gray,.btn-ghost,.btn-secondary{
  background:#fff;border-color:var(--rs-line);color:var(--rs-text-1);
}
.btn-gray:hover:not(:disabled),.btn-ghost:hover:not(:disabled),.btn-secondary:hover:not(:disabled){
  background:var(--rs-bg-soft);border-color:#D8DEE6;
}
.btn-red,.btn-danger{background:var(--rs-danger-soft);border-color:var(--rs-danger-line);color:var(--rs-danger)}
.btn-red:hover:not(:disabled),.btn-danger:hover:not(:disabled){background:#FDE8E8;border-color:#FCA5A5}
.btn-ghost{color:var(--rs-brand);border-color:var(--rs-brand-200);background:var(--rs-brand-50)}
.btn-ghost:hover:not(:disabled){background:var(--rs-brand-100)}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn:disabled,.btn.disabled{opacity:.5;cursor:not-allowed;box-shadow:none!important}
/* 点按反馈：转圈（保留旧机制，仅换配色） */
.btn.loading,button.loading{color:transparent!important;pointer-events:none}
.btn.loading::before,button.loading::before{
  border-color:rgba(255,255,255,.45);border-top-color:#fff;
}
.btn-gray.loading::before,.btn-ghost.loading::before,.btn-red.loading::before,
.btn-secondary.loading::before,.btn-danger.loading::before{
  border-color:rgba(34,160,107,.3);border-top-color:var(--rs-brand);
}
.btn-sm{height:auto;min-height:40px;padding:9px 12px;font-size:13px;border-radius:var(--rs-r-sm)}
.btn-weak{background:var(--rs-bg-soft);border-color:var(--rs-line-hair);color:var(--rs-text-3)}
.cf-x{border:1px solid var(--rs-line);background:#fff;color:var(--rs-text-2);border-radius:var(--rs-r-sm)}
.cf-x:hover{background:var(--rs-bg-soft)}
.clickable{color:var(--rs-brand);font-weight:600}
.clickable:hover{color:var(--rs-brand-hover)}

/* ---------------------------------------------------------------------------
   10. 表格（现代数据表）
   ------------------------------------------------------------------------ */
.section table,.item-table,table.rs-table{width:100%;border-collapse:separate;border-spacing:0}
table{font-size:13.5px}
thead th,th{
  background:var(--rs-bg-soft);color:var(--rs-text-2);
  font-size:12px;font-weight:600;letter-spacing:.01em;
  text-align:left;padding:12px 12px;border:0;border-bottom:1px solid var(--rs-line);
  white-space:nowrap;
}
thead th:first-child,th:first-child{padding-left:18px;border-top-left-radius:var(--rs-r-lg)}
thead th:last-child,th:last-child{padding-right:18px;border-top-right-radius:var(--rs-r-lg)}
tbody td,td{
  padding:14px 12px;border:0;border-bottom:1px solid var(--rs-line-hair);
  font-size:13.5px;color:var(--rs-text-1);vertical-align:middle;
}
tbody td:first-child,td:first-child{padding-left:18px}
tbody td:last-child,td:last-child{padding-right:18px}
tbody tr:last-child td{border-bottom:0}
tbody tr{transition:background var(--rs-t-fast) var(--rs-ease)}
tbody tr:hover td,tr:hover td{background:var(--rs-bg-hover)}
table tbody td a,td a{color:var(--rs-brand)}
/* 金额：等宽数字 + 适度突出 */
td.amount,.num,.item-table .num{font-variant-numeric:tabular-nums}
td.amount,.item-table .money,.amount{font-weight:650;color:var(--rs-text-1)}
.item-table thead th{background:var(--rs-bg-soft);color:var(--rs-text-2);font-weight:600}
.item-table .name{font-size:14px;font-weight:600}
.item-table .raw-name{color:var(--rs-text-3)}
.item-table .pill{background:var(--rs-brand-50);color:var(--rs-brand-ink);border-radius:6px}
/* 表格容器：只让表格横向滚动，整页不横滚 */
.table-scroll,.section[style*="overflow-x"]{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rowthumb{border-radius:var(--rs-r-xs);border-color:var(--rs-line)}
.rowthumb:hover{border-color:var(--rs-brand);box-shadow:0 2px 8px rgba(34,160,107,.18)}
.tc-thumb{border-radius:var(--rs-r-sm);background:var(--rs-bg-soft)}
.tc-money b{font-variant-numeric:tabular-nums}
.tc-btn{border-radius:var(--rs-r-sm);font-weight:550;font-size:13px;min-height:38px}
.tc-diff{background:var(--rs-bg-soft);border-radius:var(--rs-r-xs)}

/* ---------------------------------------------------------------------------
   11. 标签 / 徽章 / 状态
   ------------------------------------------------------------------------ */
.tag,.badge{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:99px;
  border:1px solid transparent;white-space:nowrap;line-height:1.6;
}
.tag.ok,.badge.ok{background:var(--rs-ok-soft);color:var(--rs-ok);border-color:var(--rs-ok-line)}
.tag.wait,.badge.wait{background:var(--rs-warn-soft);color:var(--rs-warn);border-color:var(--rs-warn-line)}
.tag.fail,.badge.fail{background:var(--rs-danger-soft);color:var(--rs-danger);border-color:var(--rs-danger-line)}
.tag.audit{background:var(--rs-violet-soft);color:var(--rs-violet);border-color:#DDD6FE}
.tag.partial{background:var(--rs-warn-soft);color:var(--rs-warn);border-color:var(--rs-warn-line)}
.badge.pay{background:var(--rs-ok-soft);color:var(--rs-ok);border-color:var(--rs-ok-line)}
.badge.credit,.badge.ship{background:var(--rs-info-soft);color:var(--rs-info);border-color:var(--rs-info-line)}
.badge.lock{background:#F3F4F6;color:var(--rs-text-2);border-color:var(--rs-line)}
.submit-badge{background:var(--rs-info-soft);color:var(--rs-info);font-weight:600}
.submit-badge.adm{background:var(--rs-violet-soft);color:var(--rs-violet)}
.pill{border-radius:99px;font-weight:600}
.pill.rec{background:var(--rs-brand-50);color:var(--rs-brand-ink);border-color:var(--rs-brand-200)}
.conf-track{background:var(--rs-line-hair)}
.conf-fill.hi{background:var(--rs-brand)}.conf-fill.mid{background:#E0A21B}.conf-fill.low{background:#E05555}
.risk-tip{border-radius:var(--rs-r-sm)}
.loglist{border-radius:var(--rs-r-sm)}
.unit-tag{background:var(--rs-bg-soft);border-color:var(--rs-line);border-radius:99px;font-size:12px;color:var(--rs-text-2)}
.unit-tag .x:hover{color:var(--rs-danger)}
.scope-row,.pform .f select,.pform .f input,.cf-fld input,.cf-fld select,.cf-fld textarea{
  border-radius:var(--rs-r-sm);border-color:var(--rs-line);
}

/* ---------------------------------------------------------------------------
   12. 弹窗 / 抽屉 / 图片查看器
   ------------------------------------------------------------------------ */
.modal{background:rgba(15,23,42,.25);-webkit-backdrop-filter:saturate(140%) blur(2px);backdrop-filter:saturate(140%) blur(2px)}
.modal.show{animation:rsFadeIn var(--rs-t) var(--rs-ease)}
.mbody{
  background:#fff;border-radius:var(--rs-r-xl);border:0;
  width:620px;max-width:min(620px,calc(100vw - 32px));
  max-height:86vh;padding:24px;box-shadow:var(--rs-sh-lg);
  animation:rsPopIn var(--rs-t-slow) var(--rs-ease);
}
/* V3.37 修复：基础 .mbody 的 max-width:620px 会把 cf-wide 卡死在 620px，
   导致核对弹窗内部横向滚动（商品明细一行放不下）。cf-wide 必须同时放开 max-width。 */
.mbody.cf-wide{width:min(960px,calc(100vw - 32px));max-width:min(960px,calc(100vw - 32px))}
/* V3.38 订单详情弹窗（含商品明细表）加宽，避免长规格挤爆表格 */
.mbody:has(.item-table){width:min(880px,calc(100vw - 32px));max-width:min(880px,calc(100vw - 32px))}
/* 桌面端：规格列单行截断（悬停 title 看全文，由 ui.js 补），不再一列竖排；
   手机端 item-table 本就是块级堆叠，保持自动换行不动 */
@media (min-width:769px){
  .mbody .item-table tbody td:nth-child(3){
    max-width:280px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
    font-size:12.5px;color:var(--rs-text-2);
    position:relative;padding-right:64px; /* 右侧留出「展开」按钮位，文本省略号让位 */
  }
}
/* V3.39 规格列「展开/收起」：截断时 ui.js 注入小胶囊按钮，点开铺全文 */
.mbody .item-table tbody td:nth-child(3).spec-open{
  white-space:normal;overflow:visible;text-overflow:clip;word-break:break-all;
}
.mbody .rs-spec-toggle{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  padding:2px 10px;font-size:11px;line-height:18px;font-weight:600;
  color:var(--rs-brand);background:var(--rs-brand-50,#EAF7F1);
  border:1px solid transparent;border-radius:999px;cursor:pointer;z-index:2;
}
.mbody .rs-spec-toggle:hover{border-color:var(--rs-brand)}
/* 展开态：按钮回归文档流，跟在全文后面 */
.mbody .item-table tbody td:nth-child(3).spec-open .rs-spec-toggle{
  position:static;transform:none;display:inline-block;margin-left:6px;
}
/* 商品明细行：名称列允许收缩，窄屏下宁可挤也不横向溢出 */
.mbody .cf-row{grid-template-columns:minmax(0,1fr) 64px 72px 80px 90px 32px}
/* V3.37 手机端：固定列收窄 + 行区内部滚动，弹窗本身不出现横向滚动条 */
@media (max-width:768px){
  .mbody .cf-row{grid-template-columns:minmax(0,1fr) 46px 58px 64px 72px 28px;gap:4px}
  .mbody #cfRows{overflow-x:auto;overflow-y:hidden}
  .mbody .cf-row{min-width:300px}
}
.mbody h3{font-size:16.5px;font-weight:680;margin-bottom:16px}
.mbody .btn-row{gap:10px;margin-top:18px}
.mbody .btn-row .btn{height:42px}
.drawer{background:#fff;box-shadow:-8px 0 40px rgba(16,24,40,.08);transition:transform var(--rs-t-slow) var(--rs-ease)}
.drawer-mask{background:rgba(15,23,42,.25);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}
.drawer-head{border-bottom:1px solid var(--rs-line);font-size:15px;font-weight:650;padding:16px 18px}
.mask{align-items:center;justify-content:center;background:rgba(15,23,42,.25);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}
.sheet{border-radius:var(--rs-r-xl);max-width:min(520px,calc(100vw - 32px));box-shadow:var(--rs-sh-lg);padding:20px 20px 22px}
/* 弹层已改为居中卡片，不再是底部抽屉，拖拽把手不再需要 */
.sheet .grab{display:none}
.lightbox{background:rgba(10,12,16,.9)}
.popconfirm{border-radius:var(--rs-r-lg);box-shadow:var(--rs-sh-md);border:1px solid var(--rs-line);padding:14px 16px}
.pc-btn{border-radius:var(--rs-r-xs);font-size:12.5px;height:32px;padding:0 13px;border-color:var(--rs-line)}
.pc-btn.danger{background:var(--rs-danger);border-color:var(--rs-danger);color:#fff}

/* ---------------------------------------------------------------------------
   13. Toast（现代 SaaS 提示：顶部居中，白卡 + 图标 + 极轻阴影）
   ------------------------------------------------------------------------ */
#toast,.toast{
  position:fixed;left:50%;top:18px;bottom:auto;
  transform:translateX(-50%) translateY(-10px);
  display:flex;align-items:center;gap:9px;
  background:#fff;color:var(--rs-text-1);
  border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  box-shadow:0 12px 34px rgba(16,24,40,.10);
  padding:11px 15px;font-size:13px;font-weight:500;line-height:1.5;
  max-width:min(560px,calc(100vw - 28px));
  opacity:0;visibility:hidden;pointer-events:none;z-index:9999;
  transition:opacity var(--rs-t) var(--rs-ease),transform var(--rs-t) var(--rs-ease),visibility var(--rs-t);
}
#toast.show,.toast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
#toast::before,.toast::before{
  content:"";width:16px;height:16px;flex:none;background:currentColor;
  -webkit-mask:var(--rs-toast-ico,var(--rs-mask-info)) center/contain no-repeat;
  mask:var(--rs-toast-ico,var(--rs-mask-info)) center/contain no-repeat;
  color:var(--rs-text-3);
}
#toast.rs-ok::before,.toast.rs-ok::before{color:var(--rs-brand)}
#toast.rs-warn::before,.toast.rs-warn::before{color:#E0A21B}
#toast.rs-err::before,.toast.rs-err::before{color:var(--rs-danger)}
#toast.rs-ok,#toast.rs-warn,#toast.rs-err{border-color:var(--rs-line)}
.rs-toast-close{
  margin-left:4px;width:20px;height:20px;flex:none;border:0;background:none;cursor:pointer;
  color:var(--rs-text-3);display:flex;align-items:center;justify-content:center;border-radius:6px;
}
.rs-toast-close:hover{background:var(--rs-bg-soft);color:var(--rs-text-1)}

/* ---------------------------------------------------------------------------
   14. 采购端（shop.html）局部精修
   ------------------------------------------------------------------------ */
/* 顶部条 */
.shop-topbar{
  background:rgba(255,255,255,.88);color:var(--rs-text-1);
  height:56px;padding:0 16px;gap:10px;
  border-bottom:1px solid var(--rs-line-soft);box-shadow:none;
  -webkit-backdrop-filter:saturate(180%) blur(12px);backdrop-filter:saturate(180%) blur(12px);
}
.shop-topbar h1{
  font-size:16px;font-weight:680;letter-spacing:-.01em;flex:none;white-space:nowrap;
  display:flex;align-items:center;gap:8px;color:var(--rs-text-1);
}
.shop-topbar h1 .rs-i{width:18px;height:18px;color:var(--rs-brand);stroke-width:1.9}
.shop-topbar #verLabel{
  font-size:10px;color:var(--rs-text-3);font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
  max-width:22vw;flex:none;  /* V3.59 兜底：版本号再长也自己截断，不挤压门店名 */
}
.shop-topbar .logout{
  font-size:12.5px;color:var(--rs-text-2);border:1px solid var(--rs-line);
  border-radius:99px;padding:5px 12px;background:#fff;flex:none;
  max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.shop-topbar .logout:hover{background:var(--rs-bg-soft);color:var(--rs-text-1)}
/* 底部导航 */
.tabbar{
  background:rgba(255,255,255,.94);border-top:1px solid var(--rs-line);
  height:62px;box-shadow:0 -1px 12px rgba(16,24,40,.04);
  -webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);
}
.tab{color:var(--rs-text-3);font-size:11px;gap:3px;transition:color var(--rs-t-fast) var(--rs-ease)}
.tab.on{color:var(--rs-brand);font-weight:600}
.tab .ico{font-size:0;display:flex;align-items:center;justify-content:center;height:22px}
.tab .ico .rs-i{width:21px;height:21px;stroke-width:1.7}
.tab.center .plus{
  background:var(--rs-brand);font-size:0;
  box-shadow:0 6px 18px rgba(34,160,107,.32);
  display:flex;align-items:center;justify-content:center;
}
.tab.center .plus .rs-i{width:24px;height:24px;stroke-width:2;color:#fff}
.tab.center>span:last-child{color:var(--rs-brand);font-weight:600}
/* 金额头卡：白底 + 品牌数字（替代大块橙色渐变） */
.hero{
  background:linear-gradient(150deg,var(--rs-brand-50) 0%,#fff 72%);
  color:var(--rs-text-1);border:1px solid var(--rs-brand-200);
  border-radius:var(--rs-r-lg);padding:18px;margin-bottom:14px;box-shadow:var(--rs-sh-xs);
}
.hero .n{font-size:12px;color:var(--rs-text-2);opacity:1}
.hero .m{
  font-size:28px;font-weight:700;color:var(--rs-brand-ink);margin:5px 0;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.hero .s{font-size:11.5px;color:var(--rs-text-3);opacity:1}
/* 上传入口卡
   ⚠️ display:block 必须保留：<label> 默认是 inline，内含块级 <div> 时边框会被
   拆成一条条碎片（只画出左边的小括号），桌面端 + 手机端都复现 */
.hero-btn{
  display:block;width:100%;box-sizing:border-box;
  background:#fff;border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  padding:22px 18px;margin-bottom:10px;box-shadow:var(--rs-sh-xs);
  transition:border-color var(--rs-t) var(--rs-ease),box-shadow var(--rs-t) var(--rs-ease),transform var(--rs-t) var(--rs-ease);
}
.hero-btn:hover{border-color:var(--rs-brand-200);box-shadow:0 6px 22px rgba(34,160,107,.10);transform:translateY(-1px)}
.hero-btn:active{transform:translateY(0)}
.hero-btn .cam{font-size:0;display:flex;justify-content:center;margin-bottom:8px}
.hero-btn .cam .rs-i{width:30px;height:30px;color:var(--rs-brand);stroke-width:1.6}
.hero-btn .t{font-size:15.5px;font-weight:650;color:var(--rs-text-1);margin-top:0}
.hero-btn .h{font-size:11.5px;color:var(--rs-text-3);margin-top:4px;line-height:1.5}
/* 采购端卡片/按钮密度 */
.shop .card,.shop-body .card{padding:15px;border-radius:var(--rs-r-lg)}
.btn-row .btn{
  background:#fff;border:1px solid var(--rs-line);font-size:13.5px;font-weight:550;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;
}
.btn-row .btn:hover{background:var(--rs-bg-soft);border-color:#D8DEE6}
.btn-row .btn .rs-i{width:16px;height:16px;color:var(--rs-text-2)}
/* chips */
.chip{
  border:1px solid var(--rs-line);border-radius:99px;font-size:13px;color:var(--rs-text-2);
  background:#fff;padding:8px 14px;transition:all var(--rs-t-fast) var(--rs-ease);
}
.chip:hover{border-color:var(--rs-brand-200);color:var(--rs-text-1)}
.chip.on{background:var(--rs-brand-50);color:var(--rs-brand-ink);border-color:var(--rs-brand);font-weight:600}
/* 门店条 bug 修复：shop.html 原 `.store-bar{` 选择器被上一行误吞，
   导致整条门店切换条样式失效（裸声明被丢弃）。这里补回。 */
.store-bar{
  display:flex;align-items:center;gap:8px;min-height:44px;padding:10px 14px;
  background:#fff;border:1px solid var(--rs-line);border-radius:var(--rs-r-lg);
  font-size:14px;cursor:pointer;box-shadow:var(--rs-sh-xs);
}
.store-bar:hover{border-color:var(--rs-brand-200)}
.store-bar:active{background:var(--rs-bg-soft)}
.store-bar .name{flex:1;min-width:0}
.store-menu .opt.on{background:var(--rs-brand-50);color:var(--rs-brand-ink)}
.store-menu{border-radius:var(--rs-r-lg);box-shadow:var(--rs-sh-md)}
/* 底部导航 + 中间凸起上传球的总高度补偿（避免遮住最后一张卡片） */
@media (max-width:1023.98px){ html body{padding-bottom:92px} }

/* 识别进度条 */
.hero-btn .t,.up-panel{color:var(--rs-text-1)}
#progBar{background:var(--rs-brand)!important}

/* ---------------------------------------------------------------------------
   15. 响应式
   ------------------------------------------------------------------------ */
/* 平板 */
@media (max-width:1180px){
  .main{padding:0 20px 48px}
  .topbar{margin:0 -20px 18px;padding:0 20px}
  .cards{grid-template-columns:repeat(2,1fr)}
}
/* 后台抽屉化 */
@media (max-width:767.98px){
  .sidebar{
    width:270px;border-right:1px solid var(--rs-line);
    transform:translateX(-100%);box-shadow:none;
  }
  .sidebar.open{transform:none;box-shadow:0 10px 44px rgba(16,24,40,.14)}
  .main{margin-left:0;padding:0 14px 40px;max-width:none}
  .topbar{margin:0 -14px 16px;padding:0 14px;height:58px}
  .topbar .title{font-size:17px}
  .topbar .user{display:none}
  .rs-burger{display:inline-flex}
  .cards{grid-template-columns:1fr 1fr;gap:10px}
  .card .val{font-size:20px}
  .section{padding:14px 12px;border-radius:var(--rs-r-lg)}
  .filters{padding:11px 11px;gap:8px}
  .filters select,.filters input:not([type=checkbox]):not([type=radio]),
  .filters .f-input{width:100%;flex:1 1 100%}
  /* 操作按钮两两一行，避免单个按钮独占整行 */
  .filters .btn{width:auto;flex:1 1 calc(50% - 5px);min-width:0;white-space:nowrap;padding:0 12px}
  .filters .sep{display:none}
  .filters input[type=date]{width:100%}
  .sup-filters select,.sup-filters input,.sup-filters label.ck{width:100%;flex:1 1 100%}
  .storebar .sb-btn{width:100%;justify-content:flex-start}
  .storebar .sb-hint{width:100%}
  .sb-menu{min-width:0;width:100%;left:0;right:0}
  .mbody{padding:20px 16px;max-height:90vh;border-radius:var(--rs-r-xl)}
  .mbody.cf-wide{width:calc(100vw - 24px)}
  .drawer{width:min(420px,92vw)}
  #toast,.toast{top:12px;font-size:12.5px;padding:10px 13px}
  thead th,th{padding:10px 10px}
  tbody td,td{padding:12px 10px}
  /* 手机端给单元格一个最小宽度，避免「未来门店」这类短字段被压成每行一个字；
     表格整体在 .section 里横向滚动（老板要求：只让表格滚，不让整页滚） */
  thead th,th,tbody td,td{min-width:80px}
  thead th:first-child,th:first-child,tbody td:first-child,td:first-child{padding-left:14px}
  thead th:last-child,th:last-child,tbody td:last-child,td:last-child{padding-right:14px}
  /* 筛选/表格区域允许独立横向滚动，整页绝不横滚 */
  .section[style*="overflow-x"],.table-scroll{max-width:100%}
}
@media (max-width:400px){
  .cards{grid-template-columns:1fr}
  .meta-cards{grid-template-columns:1fr 1fr!important}
}
/* 桌面恢复常规密度 */
@media (min-width:768px) and (max-width:1023.98px){
  .sidebar{transform:none}
}

/* ---------------------------------------------------------------------------
   16. 动效与可访问性
   ------------------------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rs-particles{display:none}
}
@media print{
  .sidebar,.topbar,.rs-particles,.filters,.tabbar,.rs-burger{display:none!important}
  .main{margin:0;padding:0}
}

/* ---------------------------------------------------------------------------
   17. 备用金汇总卡片移动端修正（V3.57，老板手机截图实锤）
   shared_petty.js 渲染的「门店备用金总额 + 本人备用金余额」双卡网格：
   ① 部分手机浏览器（含第三方 Chromium 壳）的字体自动放大 font boosting 只命中
      左卡的长数字「¥-11669.32」，右卡短数字「¥0.00」不被放大 → 左大右小。
      max-height + text-size-adjust:100% 是关停 boosting 的标准手段。
   ② 刷新按钮绝对定位在网格右上角，正好压住右卡「本人备用金余额」标签 →
      给右卡右侧留出 46px 避让区，标签完整显示、不再被圆钮遮字。
------------------------------------------------------------------------ */
div[style*="repeat(2,1fr)"][style*="position:relative"] div,
div[style*="minmax(0,1fr)"][style*="position:relative"] div{
  max-height:999999px;                 /* 关停移动端 font boosting，左右金额恢复同尺寸 */
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
}
div[style*="repeat(2,1fr)"][style*="position:relative"] div[style*="font-size:26px"],
div[style*="minmax(0,1fr)"][style*="position:relative"] div[style*="font-size:clamp"]{
  font-size:clamp(15px,5.2vw,26px)!important;  /* 窄屏自适应缩小，长金额不溢出不换行 */
  white-space:nowrap;
}
/* V3.59：刷新钮移到网格上方右侧（「我的备用金」标题行空白处），完全不遮挡金额 */
button[title="刷新备用金"]{
  top:-38px!important;bottom:auto!important;right:0!important;
  width:30px!important;height:30px!important;font-size:14px!important;
}

/* 工具类 */
.rs-flex{display:flex;align-items:center;gap:8px}
.rs-num{font-variant-numeric:tabular-nums}
.rs-muted{color:var(--rs-text-3)}
.rs-right{margin-left:auto}
.rs-hide{display:none!important}
.rs-nowrap{white-space:nowrap}
.rs-wrap{word-break:break-word;overflow-wrap:anywhere}

/* ---------------------------------------------------------------------------
   V3.57 手机端顶栏：版本号让位，右上角门店名完整可见
   （老板反馈：手机端右上角门店名显示不全/显示不出来 —— "汉中汉台区：陕理工店 · 退出"
     被 30vw 截断，中间还夹着长版本号。≤767px 隐藏版本号、门店胶囊放宽到 62vw。）
   ------------------------------------------------------------------------ */
@media (max-width:767.98px){
  .shop-topbar #verLabel{display:none}
  .shop-topbar .logout{max-width:62vw;font-size:12px;padding:5px 10px}
}

/* ------------------------------------------------------------------------
   V3.60 销量看板（dining）：KPI + 5 张 ECharts 卡 + 分类筛选 chips
   ------------------------------------------------------------------------ */
.dining-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dining-chart{width:100%;height:300px}
.dining-chip{display:inline-block;padding:5px 14px;border-radius:99px;border:1px solid var(--rs-line,#E5E7EB);
  font-size:13px;color:var(--rs-text-2,#6B7280);cursor:pointer;user-select:none;
  transition:var(--rs-t-fast,150ms) var(--rs-ease,ease)}
.dining-chip:hover{border-color:var(--rs-brand,#22A06B);color:var(--rs-brand,#22A06B)}
.dining-chip.on{background:var(--rs-brand,#22A06B);border-color:var(--rs-brand,#22A06B);color:#fff;font-weight:600}
@media (max-width:768px){
  .dining-grid{grid-template-columns:1fr}
  .dining-chart{height:260px}
}

/* ------------------------------------------------------------------------
   V3.62 桌码生成：弹窗内二维码卡片网格
   ------------------------------------------------------------------------ */
.qr-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-height:52vh;overflow-y:auto;padding:4px}
.qr-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 8px;border:1px solid var(--rs-line,#E5E7EB);border-radius:var(--rs-r-lg,12px);background:var(--rs-bg,#FFF)}
.qr-card .qr-box{width:140px;height:140px;background:#fff}
.qr-card .qr-box img,.qr-card .qr-box canvas{width:140px!important;height:140px!important}
.qr-card b{font-size:14px;color:var(--rs-text-1,#111827)}
.qr-card a{font-size:12px;color:var(--rs-brand,#22A06B);cursor:pointer}
@media (max-width:768px){ .qr-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ------------------------------------------------------------------------
   V3.82 店员接单大屏（KDS）
   ------------------------------------------------------------------------ */
.kds-tabs{display:flex;gap:8px;flex-wrap:wrap}
.kds-tab{padding:8px 18px;border-radius:10px;background:#F3F4F6;color:#374151;font-size:14px;font-weight:600;cursor:pointer;user-select:none}
.kds-tab.on{background:var(--rs-brand,#22A06B);color:#fff}
.kds-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.kds-card{border:1px solid var(--rs-line,#E5E7EB);border-radius:14px;padding:14px 16px;background:var(--rs-bg,#FFF);display:flex;flex-direction:column;gap:8px}
.kds-head{display:flex;justify-content:space-between;align-items:center}
.kds-no{font-size:30px;font-weight:800;color:var(--rs-text-1,#111827);line-height:1.1}
.kds-badge{padding:3px 12px;border-radius:99px;font-size:13px;font-weight:700;white-space:nowrap}
.kds-time{font-size:12px;color:#6B7280}
.kds-items{border-top:1px dashed var(--rs-line,#E5E7EB);padding-top:8px;display:flex;flex-direction:column;gap:4px}
.kds-item{font-size:14px;color:var(--rs-text-1,#111827)}
.kds-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--rs-line,#E5E7EB);padding-top:8px;font-weight:700;font-size:16px}
@media (max-width:768px){ .kds-grid{grid-template-columns:1fr} .kds-no{font-size:24px} }

/* ===== V4.5 手机端横向滚动补强（老板 09-18 两张截图）： =====
   ① 上传确认页商品编辑表 #cfItemsList（6 列固定 grid 约 440px，390px 屏撑破）→ 局部横向滚动
   ② 采购记录详情「商品明细」表（section 内联 overflow:hidden 压缩 7 列，规格列显示不全）
      → 用 !important 抢回横向滚动，表格给足最小宽，后面的列滚动可见（shop 1 处 / finance 9 处同规则受益） */
@media (max-width:768px){
  #cfItemsList{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  #cfItemsList>div{min-width:440px}
  .section[style*="overflow:hidden"]{overflow-x:auto !important;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .section[style*="overflow:hidden"] table{min-width:680px}
}

/* ===== V4.7 菜单防闪现（FOUC）：业务 init() 按角色裁剪菜单完成前，侧栏菜单先不可见（占位不跳动）===== */
html.rs-menu-wait .sidebar .nav-item,
html.rs-menu-wait .sidebar .nav-head { visibility:hidden }
