/* ===== 业务统一看板 v1 - 全局样式 ===== */
:root {
  --primary: #07c160;
  --primary-dark: #06ad56;
  --danger: #fa5151;
  --warning: #ffc300;
  --info: #10aeff;
  --bg: #f5f5f5;
  --card-bg: #ffffff;
  --text: #333333;
  --text-secondary: #888888;
  --border: #e8e8e8;
  --tab-height: 56px;
  --nav-height: 44px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html, body {
  height: 100%;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

/* ===== 登录页 ===== */
.login-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  padding: 32px;
  background: linear-gradient(135deg, #07c160 0%, #059e4d 100%);
}
.login-box {
  width: 100%;
  max-width: 320px;
  background: #fff;
  border-radius: 16px;
  padding: 40px 24px 32px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
.login-logo {
  text-align: center;
  margin-bottom: 24px;
}
.login-logo h1 {
  font-size: 22px;
  color: var(--primary);
  margin-bottom: 4px;
}
.login-logo p {
  font-size: 13px;
  color: var(--text-secondary);
}
.login-input {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 16px;
  outline: none;
  transition: border-color 0.2s;
  margin-bottom: 16px;
}
.login-input:focus {
  border-color: var(--primary);
}
.login-btn {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}
.login-btn:active { background: var(--primary-dark); }
.login-error {
  color: var(--danger);
  font-size: 13px;
  text-align: center;
  margin-top: 12px;
  display: none;
}

/* ===== 主布局 ===== */
.app-container {
  display: flex;
  flex-direction: column;
  height: 100vh;
  max-width: 480px;
  margin: 0 auto;
  background: var(--bg);
}

/* ===== 顶部栏 ===== */
.app-header {
  height: var(--nav-height);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--card-bg);
  border-bottom: 1px solid var(--border);
  position: relative;
  flex-shrink: 0;
}
.app-header h1 {
  font-size: 17px;
  font-weight: 600;
}
.app-header .header-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  font-size: 13px;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 6px 10px;
}

/* ===== 内容区 ===== */
.app-content {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 8px;
}
.app-content::-webkit-scrollbar { display: none; }

/* ===== Tab 内容面板 ===== */
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* ===== 底部导航 ===== */
.app-tabs {
  height: var(--tab-height);
  display: flex;
  background: var(--card-bg);
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.tab-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: color 0.2s;
  border: none;
  background: none;
  padding: 4px 0;
  -webkit-tap-highlight-color: transparent;
}
.tab-item .tab-icon {
  font-size: 22px;
  line-height: 1.2;
  margin-bottom: 2px;
}
.tab-item.active { color: var(--primary); }

/* ===== 卡片 ===== */
.card {
  background: var(--card-bg);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.card-title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 12px;
  color: var(--text);
}

/* ===== 毛利面板 ===== */
.profit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.profit-item {
  text-align: center;
  padding: 12px 4px;
  border-radius: 8px;
  background: #f8f9fa;
}
.profit-item .label {
  font-size: 11px;
  color: var(--text-secondary);
  margin-bottom: 4px;
}
.profit-item .value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
}
.profit-item .value.green { color: var(--primary); }
.profit-item .value.orange { color: #f5a623; }
.profit-item .value.blue { color: var(--info); }

.period-selector {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.period-btn {
  flex: 1;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card-bg);
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
}
.period-btn.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.profit-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.profit-table th {
  text-align: left;
  padding: 8px 4px;
  color: var(--text-secondary);
  font-weight: 500;
  border-bottom: 1px solid var(--border);
}
.profit-table td {
  padding: 8px 4px;
  border-bottom: 1px solid var(--border);
}
.profit-table tr:last-child td { border-bottom: none; }
.profit-table .num { text-align: right; font-variant-numeric: tabular-nums; }

.refresh-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  color: var(--text-secondary);
  margin-top: 4px;
}
.refresh-bar .refresh-btn {
  color: var(--info);
  cursor: pointer;
  border: none;
  background: none;
  font-size: 12px;
  padding: 4px 8px;
}

/* ===== 天气面板 ===== */
.weather-now {
  text-align: center;
  padding: 20px 0 12px;
}
.weather-icon {
  font-size: 64px;
  line-height: 1;
  margin-bottom: 8px;
}
.weather-temp {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
}
.weather-desc {
  font-size: 16px;
  color: var(--text-secondary);
  margin-top: 4px;
}
.weather-detail {
  display: flex;
  justify-content: center;
  gap: 24px;
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 8px;
}

.weather-hourly {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
}
.weather-hourly::-webkit-scrollbar { display: none; }
.hourly-list {
  display: flex;
  gap: 12px;
  min-width: max-content;
}
.hourly-item {
  text-align: center;
  min-width: 48px;
}
.hourly-item .h-time { font-size: 11px; color: var(--text-secondary); }
.hourly-item .h-icon { font-size: 20px; margin: 4px 0; }
.hourly-item .h-precip { font-size: 11px; color: var(--info); }
.hourly-item .h-precip.rain { color: var(--danger); }

.weather-daily-list { display: flex; flex-direction: column; gap: 8px; }
.weather-day {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.weather-day:last-child { border-bottom: none; }
.weather-day .w-date { width: 40px; font-size: 13px; }
.weather-day .w-icon { font-size: 20px; width: 28px; text-align: center; }
.weather-day .w-desc { flex: 1; font-size: 13px; color: var(--text-secondary); }
.weather-day .w-temp { font-size: 13px; font-variant-numeric: tabular-nums; }
.weather-day .w-temp .low { color: var(--text-secondary); }
.weather-day .w-temp .high { color: var(--text); }

.city-selector {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.city-btn {
  padding: 6px 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--card-bg);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.city-btn.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

/* ===== 占位面板 ===== */
.placeholder-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  color: var(--text-secondary);
}
.placeholder-icon { font-size: 48px; margin-bottom: 12px; }
.placeholder-text { font-size: 14px; }

/* ===== 管理后台 ===== */
.admin-section { margin-bottom: 20px; }
.admin-section h3 {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.admin-field {
  margin-bottom: 12px;
}
.admin-field label {
  display: block;
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 4px;
}
.admin-field input,
.admin-field select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  outline: none;
}
.admin-field input:focus { border-color: var(--primary); }
.admin-field .hint {
  font-size: 11px;
  color: var(--text-secondary);
  margin-top: 4px;
}
.admin-save-btn {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 8px;
}
.admin-save-btn:active { background: var(--primary-dark); }
.admin-status {
  text-align: center;
  font-size: 13px;
  margin-top: 12px;
  display: none;
}
.admin-status.success { color: var(--primary); }
.admin-status.error { color: var(--danger); }

/* ===== iOS Weather 样式 ===== */
.ios-weather-hero {
  text-align: center;
  padding: 30px 20px 32px;
  color: #fff;
  background: linear-gradient(180deg, #4a90e2 0%, #67b8f7 50%, #a8d5f5 100%);
  border-radius: 16px;
  margin: 8px 8px 16px;
  box-shadow: 0 4px 16px rgba(74, 144, 226, 0.25);
  transition: background 0.6s ease;
}
.ios-weather-hero.theme-sunny {
  background: linear-gradient(180deg, #4a90e2 0%, #5ba9f2 50%, #fdbb2d 100%);
  box-shadow: 0 4px 20px rgba(253, 187, 45, 0.4);
}
.ios-weather-hero.theme-cloudy {
  background: linear-gradient(180deg, #6b8aa8 0%, #95b3c9 50%, #c8d6e0 100%);
  box-shadow: 0 4px 16px rgba(107, 138, 168, 0.3);
}
.ios-weather-hero.theme-overcast {
  background: linear-gradient(180deg, #5a6b7c 0%, #7c8a96 50%, #9ba8b3 100%);
  box-shadow: 0 4px 16px rgba(90, 107, 124, 0.3);
}
.ios-weather-hero.theme-rain {
  background: linear-gradient(180deg, #3a4f5e 0%, #4a6580 50%, #5a7590 100%);
  box-shadow: 0 4px 20px rgba(58, 79, 94, 0.5);
}
.ios-weather-hero.theme-storm {
  background: linear-gradient(180deg, #1f2630 0%, #2d3540 50%, #3d4555 100%);
  box-shadow: 0 4px 24px rgba(31, 38, 48, 0.7);
}
.ios-weather-hero.theme-snow {
  background: linear-gradient(180deg, #6b8aa8 0%, #a8c0d0 50%, #d8e3ec 100%);
  box-shadow: 0 4px 16px rgba(168, 192, 208, 0.4);
  color: #2c3e50;
}
.ios-weather-hero.theme-snow .ios-weather-temp { text-shadow: 0 2px 6px rgba(255,255,255,0.4); }
.ios-weather-hero.theme-snow .ios-weather-city,
.ios-weather-hero.theme-snow .ios-weather-desc,
.ios-weather-hero.theme-snow .ios-weather-hl { text-shadow: 0 1px 2px rgba(255,255,255,0.3); }
.ios-weather-hero.theme-fog {
  background: linear-gradient(180deg, #9aa8b3 0%, #b3c0c8 50%, #c8d2d8 100%);
  box-shadow: 0 4px 16px rgba(154, 168, 179, 0.3);
}

/* ===== 天气动画（伪元素 + keyframes） ===== */
.ios-weather-hero { position: relative; overflow: hidden; }

/* 雨滴（雨+雷暴共用） */
.ios-weather-hero.theme-rain,
.ios-weather-hero.theme-storm { overflow: hidden; }

.rain-drops {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}
.rain-drops .drop {
  position: absolute;
  width: 1.5px;
  height: 16px;
  background: linear-gradient(180deg, transparent, rgba(190,220,255,0.65));
  border-radius: 1px;
  animation: rainFall linear infinite;
}
@keyframes rainFall {
  0% { transform: translateY(-10px); }
  100% { transform: translateY(350px); }
}

/* 雪花 */
.ios-weather-hero.theme-snow::before {
  content: '';
  position: absolute;
  top: -20px; left: 0; right: 0; bottom: 0;
  background-image:
    radial-gradient(2px 2px at 10% 50%, rgba(255,255,255,0.8) 50%, transparent 50%),
    radial-gradient(3px 3px at 30% 30%, rgba(255,255,255,0.7) 50%, transparent 50%),
    radial-gradient(2px 2px at 50% 60%, rgba(255,255,255,0.8) 50%, transparent 50%),
    radial-gradient(2px 2px at 70% 20%, rgba(255,255,255,0.6) 50%, transparent 50%),
    radial-gradient(3px 3px at 90% 70%, rgba(255,255,255,0.7) 50%, transparent 50%);
  background-size: 100% 100%;
  animation: snowFall 3s linear infinite;
  pointer-events: none;
  z-index: 1;
}
@keyframes snowFall {
  0% { transform: translateY(-30px) rotate(0deg); }
  100% { transform: translateY(100%) rotate(15deg); }
}

/* 雪花 */
.snow-flakes {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}
.snow-flakes .flake {
  position: absolute;
  width: 4px;
  height: 4px;
  background: rgba(255,255,255,0.85);
  border-radius: 50%;
  animation: snowFall linear infinite;
  box-shadow: 0 0 2px rgba(255,255,255,0.5);
}
@keyframes snowFall {
  0% { transform: translateY(-10px) rotate(0); }
  100% { transform: translateY(calc(100vh)) rotate(360deg); }
}

/* 雷暴 */
.lightning {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  background: white;
  opacity: 0;
  animation: lightningFlash 5s infinite;
}
@keyframes lightningFlash {
  0%, 92%, 100% { opacity: 0; }
  93% { opacity: 0.6; }
  94% { opacity: 0; }
  95% { opacity: 0.85; }
  96% { opacity: 0; }
}
.ios-weather-hero.theme-storm {
  animation: stormFlash 4s ease infinite;
}
@keyframes stormFlash {
  0%, 92%, 100% { filter: brightness(1); }
  93% { filter: brightness(2.2); }
  95% { filter: brightness(0.8); }
  96% { filter: brightness(2.5); }
  97% { filter: brightness(1); }
}

/* 晴 - 温暖光晕脉冲 */
.ios-weather-hero.theme-sunny {
  animation: sunGlow 4s ease-in-out infinite alternate;
}
@keyframes sunGlow {
  0% { box-shadow: 0 4px 20px rgba(253, 187, 45, 0.4); }
  100% { box-shadow: 0 4px 40px rgba(253, 187, 45, 0.6); }
}
.ios-weather-city {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.ios-weather-temp {
  font-size: 84px;
  font-weight: 200;
  line-height: 1;
  margin: 8px 0;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.ios-weather-desc {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 4px;
  color: #fff;
  opacity: 0.95;
}
.ios-weather-hl {
  font-size: 15px;
  color: #fff;
  opacity: 0.85;
  margin-top: 4px;
}

.ios-weather-card {
  padding: 14px 16px !important;
  margin-bottom: 12px;
  border-radius: 12px !important;
}
.ios-card-title {
  font-size: 13px;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 10px;
  font-weight: 600;
}

.ios-hourly-list {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 4px 0 8px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 16px;
}
.ios-hourly-list::-webkit-scrollbar { display: none; }
.ios-hourly-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 50px;
  flex: 0 0 auto;
  padding: 6px 0;
  scroll-snap-align: start;
}
.ios-h-time {
  font-size: 12px;
  color: #888;
  margin-bottom: 4px;
}
.ios-h-icon {
  font-size: 20px;
  margin-bottom: 2px;
}
.ios-h-precip {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
}
.ios-h-precip.empty { color: #b0bec5; font-weight: 400; }
.ios-h-temp {
  font-size: 14px;
  font-weight: 600;
  margin-top: 2px;
}

.ios-daily-list {
  display: flex;
  flex-direction: column;
}
.ios-daily-item {
  display: flex;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
}
.ios-daily-item:last-child { border-bottom: none; }
.ios-d-label {
  flex: 0 0 80px;
  font-size: 16px;
  font-weight: 500;
  color: #37474f;
}
.ios-d-icon {
  flex: 0 0 32px;
  font-size: 20px;
  text-align: center;
}
.ios-d-temp {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  font-size: 16px;
  color: #37474f;
}
.ios-d-low {
  color: #b0bec5;
  min-width: 40px;
  text-align: right;
}
.ios-d-high { font-weight: 600; min-width: 40px; }
.ios-d-bar {
  display: inline-block;
  width: 60px;
  height: 4px;
  border-radius: 2px;
  background: linear-gradient(90deg, #ffc107 0%, #ff5722 100%);
  margin: 0 6px;
}


.view-tabs {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--card-bg);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin: 0 0 12px;
  padding: 6px 12px;
  user-select: none;
  touch-action: pan-y;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.view-tabs-inner {
  position: relative;
  display: flex;
  background: #f5f5f5;
  border-radius: 10px;
  padding: 3px;
}
.view-tab {
  flex: 1;
  padding: 10px 0;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #888;
  border-radius: 8px;
  cursor: pointer;
  z-index: 2;
  transition: color 0.25s;
}
.view-tab.active {
  color: #fff;
}
.view-tab-indicator {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc((100% - 8px) / 3);
  background: var(--primary);
  border-radius: 7px;
  z-index: 1;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.view-tab[data-view="me"].active ~ .view-tab-indicator { transform: translateX(0); }
.view-tab[data-view="all"].active ~ .view-tab-indicator { transform: translateX(100%); }
.view-tab[data-view="group"].active ~ .view-tab-indicator { transform: translateX(200%); }

/* 天气 Tab 3 个（顺序：全国/本地/历史）*/
.view-tab[data-wv="national"].active ~ .view-tab-indicator { transform: translateX(0); }
.view-tab[data-wv="local"].active ~ .view-tab-indicator { transform: translateX(100%); }
.view-tab[data-wv="history"].active ~ .view-tab-indicator { transform: translateX(200%); }

/* 理赔 Tab 3 个（清单/总览/分类）— 通过 JS 动态控制 indicator 位置 */
#claimsTabs .view-tab-indicator {
  width: calc((100% - 8px) / 3);
}

/* ===== 理赔样式 ===== */
.claims-item {
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
}
.claims-item:last-child { border-bottom: none; }
.claims-main { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.claims-label { font-size: 15px; font-weight: 600; color: #37474f; }
.claims-sub { font-size: 13px; color: #78909c; }
.claims-count { font-size: 12px; color: #888; background: #e8f0fe; padding: 2px 8px; border-radius: 10px; }
.claims-tag { font-size: 11px; color: #1565c0; background: #e3f2fd; padding: 1px 6px; border-radius: 4px; }
.claims-extra { font-size: 12px; color: #888; margin-top: 2px; }
.payout-tag { padding: 1px 6px; border-radius: 4px; font-size: 11px; }
.payout-tag.green { color: #2e7d32; background: #e8f5e9; }
.payout-tag.gray { color: #616161; background: #f5f5f5; }
.payout-tag.red { color: #c62828; background: #ffebee; }
.payout-tag.orange { color: #e65100; background: #fff3e0; }

/* ===== 理赔 — 清单卡片 ===== */
.claims-refresh-btn {
  padding: 8px 16px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
}
.claims-refresh-btn:disabled { opacity: 0.6; }
.claims-summary-card {
  background: linear-gradient(135deg, #fef9e7, #fdebd0);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.cs-row { display: flex; justify-content: space-around; text-align: center; }
.cs-item { flex: 1; }
.cs-num { font-size: 22px; font-weight: 700; color: var(--text); font-family: Consolas, monospace; }
.cs-num.cs-red { color: #e74c3c; }
.cs-num.cs-green { color: #27ae60; }
.cs-num.cs-orange { color: #f39c12; }
.cs-lbl { font-size: 11px; color: #888; margin-top: 2px; }
.claims-card-item {
  background: var(--card-bg);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  border: 1px solid #f0f0f0;
}
.cci-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cci-name { font-size: 15px; font-weight: 600; color: #37474f; }
.cci-sub { font-size: 12px; color: #78909c; }
.cci-tag { font-size: 11px; color: #1565c0; background: #e3f2fd; padding: 1px 6px; border-radius: 4px; }
.cci-money { font-size: 12px; color: #888; margin-top: 4px; }

/* ===== 理赔 — 省份分布 ===== */
.prov-group { margin-bottom: 12px; }
.prov-group-label { font-size: 12px; color: #888; margin-bottom: 6px; font-weight: 500; }
.prov-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; }
.prov-cell {
  border-radius: 8px;
  padding: 8px 4px;
  text-align: center;
  cursor: default;
  transition: transform 0.15s;
  border: 1px solid #e8e8e8;
}
.prov-cell:active { transform: scale(0.95); }
.prov-cell.prov-empty { background: #f9f9f9; color: #bbb; font-size: 11px; }
.prov-name { font-size: 12px; font-weight: 600; }
.prov-count { font-size: 16px; font-weight: 700; margin: 2px 0; }
.prov-amount { font-size: 10px; color: #5d4037; }
.prov-rank-item { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #f0f0f0; }
.prov-rank-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.pr-row { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 3px; }
.pr-name { font-weight: 600; color: #37474f; }
.pr-count { color: #e65100; font-weight: 600; }
.pr-bar-wrap { height: 6px; background: #f5efe6; border-radius: 3px; margin: 2px 0 4px; overflow: hidden; }
.pr-bar { height: 100%; border-radius: 3px; transition: width 0.3s; }
.pr-sub { font-size: 11px; color: #888; }

/* ===== 理赔 — 分类统计 ===== */
.cat-tab {
  flex: 1;
  padding: 8px 6px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card-bg);
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
}
.cat-tab.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.cat-group-item {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f0f0;
}
.cat-group-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.cg-row { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 3px; }
.cg-name { font-weight: 600; color: #37474f; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cg-count { color: #e65100; font-weight: 600; white-space: nowrap; margin-left: 8px; }
.cg-bar-wrap { height: 5px; background: #f5efe6; border-radius: 3px; margin: 3px 0 5px; overflow: hidden; }
.cg-bar { height: 100%; border-radius: 3px; }
.cg-sub { font-size: 11px; color: #888; }
.cg-sub span { flex: 1; text-align: center; }

/* ===== 省份明细弹窗 ===== */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 999;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.modal-content {
  background: var(--card-bg);
  border-radius: 16px 16px 0 0;
  width: 100%;
  max-width: 480px;
  max-height: 80vh;
  overflow-y: auto;
  padding: 16px 16px 24px;
  animation: slideUp 0.25s ease;
}
@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  position: relative;
}
.modal-back {
  font-size: 15px;
  color: var(--primary);
  cursor: pointer;
  padding: 4px 8px;
  font-weight: 500;
  flex: 0 0 auto;
}
.modal-title {
  font-size: 18px;
  font-weight: 700;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.modal-close {
  font-size: 18px;
  color: #888;
  cursor: pointer;
  padding: 4px 8px;
  flex: 0 0 auto;
}
.modal-body { font-size: 13px; }

/* ===== 过滤器栏 ===== */
.filter-bar {
  display: flex;
  gap: 6px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.filter-select {
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
  background: var(--card-bg);
  flex: 1;
  min-width: 0;
}

/* ===== 今日卡片 ===== */
.card-today {
  background: #e8f5e9;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 10px;
}
.card-today .lbl { font-size: 13px; color: #388e3c; margin-bottom: 6px; }
.card-today .r1 { display: flex; gap: 12px; justify-content: space-around; text-align: center; }
.card-today .r1 .item { flex: 1; }
.card-today .r2 { text-align: center; margin-top: 8px; padding-top: 8px; border-top: 1px dashed #c8e6c9; font-size: 12px; color: #555; }
.card-today .item .num { font-size: 20px; font-weight: 700; color: #2e7d32; font-family: Consolas,monospace; }
.card-today .item .tag { font-size: 11px; color: #666; margin-top: 2px; }

/* ===== 月度卡片 ===== */
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.card .lbl { font-size: 13px; color: #888; margin-bottom: 1px; }
.card .val { font-size: 22px; font-weight: 700; line-height: 1.2; font-family: Consolas,monospace; }
.card .val.green { color: #0f9d58; }
.card .val.orange { color: #e37400; }
.card .extra { font-size: 13px; color: #999; margin-top: 5px; }
.card .est { font-size: 17px; color: #7c3aed; font-weight: 600; margin-top: 6px; padding-top: 6px; border-top: 1px dashed #e0e0e0; }
.card .est-lbl { font-size: 11px; color: #7c3aed; }

/* ===== 图表 ===== */
.charts { display: grid; gap: 10px; margin-bottom: 10px; }
.cbox { background: var(--card-bg); border-radius: 10px; padding: 12px; }
.cbox h3 { font-size: 14px; color: #555; margin-bottom: 8px; }
.cbox canvas { max-height: 200px; max-width: 100%; }

/* ===== 每日明细表 ===== */
.tsection { background: var(--card-bg); border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.tsection h3 { font-size: 14px; color: #555; margin-bottom: 8px; }
.tw { overflow-x: auto; }
.tw table { font-size: 12px; width: 100%; border-collapse: collapse; }
.tw th { background: #f8f9fa; padding: 7px 6px; text-align: right; font-weight: 600; color: #555; border-bottom: 2px solid #e8eaed; white-space: nowrap; }
.tw th:first-child { text-align: left; }
.tw td { padding: 7px 6px; text-align: right; border-bottom: 1px solid #f0f0f0; font-family: Consolas,'PingFang SC',sans-serif; white-space: nowrap; color: #37474f; }
.tw td:first-child, .tw th:first-child { text-align: left; font-weight: 500; white-space: nowrap; font-family: Consolas, monospace; min-width: 88px; }
.tw td.num { font-variant-numeric: tabular-nums; }

/* 涨跌箭头 */
.arrow { display: inline-block; font-size: 9px; margin-right: 3px; vertical-align: 1px; }
.arrow.up { color: #e74c3c; }
.arrow.down { color: #26a69a; }
.arrow.flat { color: #b0bec5; }
.diff-na { color: #b0bec5; font-size: 12px; }

/* 单列内同时显示今日数据 + 变化（箭头+差值），2行布局，箭头居中 */
.tw td.num { font-variant-numeric: tabular-nums; line-height: 1.4; font-weight: 600; }
.diff-line { display: block; font-size: 11px; color: #888; font-weight: 400; }
.tw td.today-cell { white-space: nowrap; }
.tw tr.est td { font-weight: 700; border-top: 2px dashed #7c3aed; background: #f5f3ff; color: #7c3aed; }

/* 周末/节假日背景色 */
.tw tr.holiday-wk td { background: #fef8e7; }      /* 周末：淡黄 */
.tw tr.holiday-fest td { background: #ffeded; }    /* 法定假：淡红 */
.tw tr.holiday-wk td:first-child { background: #fef8e7; }
.tw tr.holiday-fest td:first-child { background: #ffeded; }

.day-tag { color: #999; font-size: 11px; margin-left: 2px; }
.fest-tag { color: #e37400; font-weight: 600; margin-left: 2px; }
.day-hint { font-size: 12px; color: #888; font-weight: 400; margin-left: 8px; }
.order-btn {
  float: right;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--card-bg);
  font-size: 12px;
  color: var(--info);
  cursor: pointer;
}
.swatch { display: inline-block; width: 12px; height: 12px; border-radius: 2px; vertical-align: -2px; margin-right: 4px; }
.sw-wk { background: #fef8e7; border: 1px solid #f0d97c; }
.sw-fest { background: #ffeded; border: 1px solid #f0a0a0; }

/* ===== 计算公式 ===== */
.fbox {
  background: var(--card-bg);
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 10px;
}
.fbox h3 { font-size: 14px; color: #555; margin-bottom: 10px; }
.formula { font-size: 13px; line-height: 2.2; color: #444; }
.f-term { display: inline-block; min-width: 80px; font-weight: 600; }
.f-val {
  display: inline-block;
  background: #f0f4ff;
  padding: 1px 8px;
  border-radius: 4px;
  color: #1a73e8;
  font-family: Consolas, monospace;
  font-size: 13px;
  margin: 0 2px;
}
.f-result { display: inline-block; min-width: 80px; font-weight: 700; color: #0f9d58; }

/* ===== 映射管理卡片 ===== */
.mapping-card {
  background: #f8f9fa;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 10px;
}
.mapping-input {
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  outline: none;
}
.mapping-input:focus { border-color: var(--primary); }

/* 二级页面顶部固定返回条 */
.subpage-wrap { padding-top: 0; }
.topbar-back {
  position: sticky;
  top: 0;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 10px 4px;
  font-size: 14px;
  color: var(--info);
  font-weight: 500;
  cursor: pointer;
  z-index: 10;
  border-bottom: 1px solid var(--border);
  margin: 0 -12px 8px;
  padding-left: 14px;
}
.topbar-back:active { opacity: 0.6; }

/* 管理后台页面菜单 */
.admin-menu-page { margin-bottom: 12px; }
.admin-menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  margin-bottom: 8px;
  transition: all 0.15s;
}
.admin-menu-item:active { background: #e8f5e9; border-color: var(--primary); }
.admin-menu-icon { font-size: 20px; }
.admin-menu-text { flex: 1; font-size: 15px; font-weight: 500; color: var(--text); }
.admin-menu-arrow { color: #bbb; font-size: 20px; }
.back-link { 
  display: inline-block; 
  font-size: 14px; 
  color: var(--info); 
  text-decoration: none; 
  padding: 4px 0;
  margin-bottom: 4px;
}
.back-link:active { opacity: 0.7; }

/* 分组管理：以组为主的展示 */
.group-block {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 12px;
  padding: 10px 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.group-block-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--border);
}
.gr-name-input {
  flex: 1;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  background: #f0f4ff;
}
.gr-del-btn {
  background: #fa5151;
  color: #fff;
  border: none;
  border-radius: 6px;
  width: 28px;
  height: 28px;
  cursor: pointer;
  font-size: 14px;
}
.group-block-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  font-size: 12px;
  color: #888;
}
.gr-lbl { width: 18px; }
.gr-date {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
  width: 90px;
}
.group-block-members { margin: 6px 0; }
.gr-empty { padding: 8px; color: #b0bec5; font-size: 12px; text-align: center; }
.gr-member {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  border-bottom: 1px solid #f5f5f5;
}
.gr-member:last-child { border-bottom: none; }
.gr-mname { width: 120px; font-size: 13px; }
.gr-mwecom {
  flex: 1;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
}
.gr-mdel {
  background: #ffebee;
  color: #fa5151;
  border: none;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.group-block-add {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed #f0f0f0;
}
.gr-add-select {
  flex: 1;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
}
.gr-add-btn, .gr-add-new-btn {
  padding: 5px 10px;
  background: var(--info);
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
}
.gr-add-new-btn { background: #0f9d58; }
.gr-new-mem {
  width: 120px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
}
.admin-add-btn {
  width: 100%;
  padding: 10px;
  border: 1px dashed var(--primary);
  border-radius: 8px;
  background: transparent;
  color: var(--primary);
  font-size: 14px;
  cursor: pointer;
  margin-bottom: 10px;
}
.group-list { margin-bottom: 6px; }
.group-row { display: flex; gap: 4px; margin-bottom: 4px; }
.group-input {
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
  outline: none;
}
.group-input:focus { border-color: var(--info); }

/* ===== 加载提示 ===== */
.loading {
  text-align: center;
  padding: 40px;
  color: var(--text-secondary);
  font-size: 14px;
}
.loading::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin-right: 8px;
  vertical-align: middle;
}
@keyframes spin { to { transform: rotate(360deg); } }

.toast {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0,0,0,0.8);
  color: #fff;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  z-index: 999;
  display: none;
  max-width: 80%;
  text-align: center;
}