:root{
  --blue:#2f6fed;
  --purple:#6b45d6;
  --text:#1f2937;
  --muted:#6b7280;
  --bg:#f5f7fb;
  --card:#ffffff;
  --border:#e5e7eb;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --radius:16px;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--text);background:var(--bg);}
a{color:var(--blue);text-decoration:none}
.container{max-width:980px;margin:0 auto;padding:18px;}
.header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;background:var(--card);border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:10;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:800}
.brand .logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--blue),var(--purple));display:inline-block}
.lang-pill{display:flex;align-items:center;gap:10px}
select{padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:#fff}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 14px;border-radius:12px;border:1px solid transparent;
  cursor:pointer;font-weight:700
}
.btn.primary{background:var(--blue);color:#fff}
.btn.ghost{background:#fff;border-color:var(--border);color:var(--text)}
.grid{display:grid;gap:14px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card .pad{padding:18px}
.h1{font-size:26px;margin:6px 0 12px;font-weight:900;text-align:center}
.muted{color:var(--muted)}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.kpi{
  border-radius:16px;color:#fff;padding:18px;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  display:flex;align-items:center;justify-content:space-between;gap:14px
}
.kpi .big{font-size:34px;font-weight:900}
.kpi .label{opacity:.9;font-weight:700}
.slider{width:100%}
.range-wrap{margin:10px 0 18px}
.range-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:6px}
.features{grid-template-columns:repeat(3,1fr)}
.feature{border:1px solid var(--border);border-radius:16px;padding:14px;background:#fff}
.feature img{width:40px;height:40px}
.feature .t{font-weight:900;margin-top:8px}
.feature .d{color:var(--muted);font-size:13px;margin-top:6px;line-height:1.35}
@media (max-width:840px){.features{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.features{grid-template-columns:1fr}.kpi{flex-direction:column;align-items:flex-start}}
.form{display:grid;gap:12px}
.input{display:grid;gap:6px}
.input label{font-size:13px;color:var(--muted);font-weight:700}
input,textarea{
  padding:12px 12px;border:1px solid var(--border);border-radius:12px;background:#fff;
  outline:none
}
input:focus,textarea:focus{border-color:rgba(47,111,237,.5);box-shadow:0 0 0 4px rgba(47,111,237,.12)}
hr{border:none;border-top:1px solid var(--border);margin:16px 0}
.notice{padding:12px;border-radius:12px;border:1px dashed rgba(47,111,237,.5);background:rgba(47,111,237,.06);color:#1f3b8a}
.err{padding:12px;border-radius:12px;border:1px dashed rgba(220,38,38,.5);background:rgba(220,38,38,.06);color:#7f1d1d}
.footer{padding:28px 0;color:var(--muted);font-size:13px;text-align:center}

/* Floating CS button */
.cs-float{
  position:fixed;right:18px;bottom:18px;z-index:50;
  width:56px;height:56px;border-radius:18px;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  box-shadow:0 16px 34px rgba(0,0,0,.18);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;border:none;color:#fff;font-weight:900
}
.cs-panel{
  position:fixed;right:18px;bottom:86px;z-index:51;
  width:min(360px,calc(100vw - 36px));
  background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);
  display:none
}
.cs-panel.show{display:block}
.cs-panel .head{padding:12px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.cs-panel .body{padding:14px;display:grid;gap:10px}

/* salesmartly-hide-old-cs */
.cs-float,.cs-panel{display:none !important;}

/* ===== Home background (finance) ===== */
body{
  background-image: url("/assets/img/bg-finance.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center top;
}
/* 让内容区域更清晰 */
.container, .card{
  backdrop-filter: blur(2px);
}

/* ===== Feature images ===== */
.feature .icon-img{
  width:42px;height:42px;display:block;
}
.feature .icon-wrap{
  width:54px;height:54px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background: rgba(47,111,237,0.08);
  border:1px solid rgba(47,111,237,0.12);
}

/*__MOBILE_HEADER_TIGHT_V1__*/
@media (max-width: 520px){
  html, body { margin:0 !important; padding:0 !important; }

  /* header 上下留白缩小 */
  .header{
    padding: 8px 10px !important;
    margin: 0 !important;
    min-height: 0 !important;
  }

  /* brand 区域更紧凑 */
  .header .brand{
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1.1 !important;
  }

  /* 站点标题（Home Credit）别撑太高 */
  .header .brand span,
  .header .brand .name,
  .header .brand .title{
    font-size: 16px !important;
    line-height: 1.1 !important;
  }

  /* 语言下拉变小 */
  #langSelect, select#langSelect, .langSelect, .lang select, select{
    font-size: 12px !important;
    padding: 6px 8px !important;
    height: 32px !important;
    border-radius: 10px !important;
  }

  /* 登录按钮也收一收（如果有这个 class） */
  .header .btn, .header button{
    font-size: 12px !important;
    padding: 6px 10px !important;
    height: 32px !important;
    border-radius: 10px !important;
  }
}

/*__MOBILE_HEADER_TIGHT_V2__*/
@media (max-width: 520px){

  /* 1) header 上下留白再缩一点 */
  .header{
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  /* 有些模板在 header 外层还包了一层 topbar/container，会撑高 */
  .topbar, .navbar, .header-wrap, .headerContainer, .container, .wrap{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 2) 语言下拉框更窄 */
  #langSelect,
  select#langSelect,
  .langSelect,
  .lang select,
  .header select{
    width: 78px !important;        /* 关键：固定宽度 */
    min-width: 78px !important;
    max-width: 78px !important;
    padding: 4px 18px 4px 8px !important; /* 右侧留给箭头 */
    height: 28px !important;
    font-size: 12px !important;
  }

  /* 下拉框右侧箭头如果是 background/icon，这个能让它别把宽度撑大 */
  #langSelect{
    background-position: right 6px center !important;
    background-size: 10px 10px !important;
  }

  /* 3) 登录按钮也收一点，整体更紧凑 */
  .header .btn, .header button{
    height: 28px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
  }

  /* 4) logo/标题行更紧凑（避免撑高） */
  .header .brand{
    gap: 6px !important;
  }
}

/*__UI_TWEAKS_V6__*/
:root{ --brand-blue:#2f6bff; }

/* 顶部更紧凑（电脑端留白减少） */
.header{
  padding: 12px 18px !important;
  margin: 0 0 10px 0 !important;
}
.header .brand{ gap:10px !important; }

/* 语言下拉框：显示蓝色（你圈的第1个） */
#langSelect,
.header select{
  border: 1px solid var(--brand-blue) !important;
  color: var(--brand-blue) !important;
  background: #fff !important;
  border-radius: 12px !important;
  padding: 6px 10px !important;
  min-width: 92px !important;
}
#langSelect:focus,
.header select:focus{
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(47,107,255,.18) !important;
}

/* 滑块圆点：更大 + 蓝色（你圈的两个圆点） */
input[type="range"]{ accent-color: var(--brand-blue); }

input[type="range"]::-webkit-slider-runnable-track{
  height: 6px !important;
  border-radius: 999px !important;
}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance: none;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: var(--brand-blue) !important;
  border: 3px solid #fff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.18) !important;
  margin-top: -8px !important; /* 对齐 6px track */
}

/* Firefox */
input[type="range"]::-moz-range-track{
  height: 6px !important;
  border-radius: 999px !important;
}
input[type="range"]::-moz-range-thumb{
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: var(--brand-blue) !important;
  border: 3px solid #fff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.18) !important;
}

/* 手机端：顶部别太高 + 让蓝色背景露一点出来（你圈的蓝色区域） */
@media (max-width: 520px){
  .header{
    padding: 8px 10px !important;
    margin-bottom: 14px !important; /* 让 header 下方露出一点蓝色背景 */
  }
  #langSelect,
  .header select{
    min-width: 78px !important;
    padding: 5px 8px !important;
    border-radius: 10px !important;
  }

  /* 让卡片离 header 稍微下去一点，蓝底就能露出来 */
  .card, .calculator-card, .panel, .container > .box{
    margin-top: 10px !important;
  }

  /* 手机端滑块圆点再大一点 */
  input[type="range"]::-webkit-slider-thumb{
    width: 24px !important;
    height: 24px !important;
    margin-top: -9px !important;
  }
  input[type="range"]::-moz-range-thumb{
    width: 24px !important;
    height: 24px !important;
  }
}