/* ============================================================
   视觉对齐补丁 —— 加载在 save-app.css 之后
   把主色/强调色换成对方那套（深蓝 #1e4fb0 + 琥珀 #c2410c），
   保持布局结构不变，只换视觉语言。
   ============================================================ */

:root {
  --brand:        #1e4fb0;   /* 主蓝：按钮、链接、选中态 */
  --brand-hover:  #1a4296;
  --brand-soft:   #eef4ff;   /* 浅蓝底 */
  --brand-line:   #bfdbfe;
  --brand-ink:    #1a3a80;

  --amber:        #c2410c;   /* 琥珀：城市按钮、提示 */
  --amber-soft:   #fff8ed;
  --amber-line:   #f4d8b0;
  --amber-ink:    #9a6a2f;

  --paper:        #f5f7f8;
  --card:         #ffffff;
  --line:         #dfe3e8;
  --line-soft:    #edf0f2;
  --ink:          #17202d;
  --ink2:         #596273;
  --ink3:         #7c8595;
  --ok:           #166534;
  --ok-soft:      #ecfdf3;
  --ok-line:      #bbf7d0;
  --danger:       #b42318;
}

/* ---- 按钮 ---- */
.button.primary {
  color: #fff;
  background: var(--brand);
  border-color: var(--brand);
}
.button.primary:hover { background: var(--brand-hover); }

.button.secondary {
  color: var(--ink);
  background: #fff;
  border-color: #cfd5dc;
}

.button.danger {
  color: #fff;
  background: var(--danger);
  border-color: var(--danger);
}

.button.star-fill {
  color: var(--ok);
  background: var(--ok-soft);
  border-color: var(--ok-line);
}
.button.star-fill:hover { background: #dcfce7; }

/* ---- 顶部 eyebrow 小标签 ---- */
.eyebrow {
  color: var(--brand);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 800;
}

/* ---- 会员徽章 ---- */
.access-badge {
  color: #92400e;
  background: #fffbeb;
  border-color: #fde68a;
}
.access-badge.member {
  color: var(--ok);
  background: var(--ok-soft);
  border-color: var(--ok-line);
}

/* ---- 模式切换（闯关 / 全关卡解锁）---- */
.mode-switch {
  background: #f1f5f9;
  border-color: var(--line);
}
.mode-option { color: var(--ink2); }
.mode-option:hover:not(:disabled) { color: var(--brand); }
.mode-option.is-active {
  color: var(--brand-ink);
  background: var(--brand-soft);
  box-shadow: 0 4px 12px rgba(30, 79, 176, .16);
}

/* ---- 城市按钮（琥珀底）---- */
.city-button {
  color: var(--ink);
  background: var(--amber-soft);
  border-color: var(--amber-line);
  border-radius: 12px;
  box-shadow: 0 2px 7px rgba(154, 106, 47, .06);
}
.city-button:hover {
  border-color: #9fd8c7;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .08);
}
.city-progress { color: var(--amber-ink); }
.city-button-arrow { color: var(--brand); }

/* ---- 状态小气泡 ---- */
.status-bubble {
  color: var(--ok);
  background: var(--ok-soft);
  border-color: var(--ok-line);
}
.challenge-bubble {
  color: var(--brand-ink);
  background: var(--brand-soft);
  border-color: var(--brand-line);
}

/* ---- 卡片 ---- */
.identity-card,
.lookup-form,
.editor-section {
  background: var(--card);
  border-color: var(--line);
  border-radius: 10px;
}

.identity-card h1 { color: var(--ink); }
.identity-card p,
.lookup-intro p,
.section-title p { color: var(--ink3); }

/* ---- 输入框焦点 ---- */
input:focus,
textarea:focus,
select:focus { border-color: var(--brand); }
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(30, 79, 176, .22);
}

/* ---- 返回链接 ---- */
.back-link { color: var(--brand); }

/* ---- 弹窗 ---- */
.city-dialog {
  background: #fff;
  border-color: var(--line);
  border-radius: 12px;
}
.city-dialog h2 { color: var(--ink); }
.city-dialog-summary { color: var(--ink3); }

/* ---- 资源输入 ---- */
.resource-field { color: var(--ink2); }
.resource-field input,
.progress-input,
.challenge-level-editor input {
  border-color: #cfd5dc;
  border-radius: 6px;
}
.resource-field input:focus,
.progress-input:focus,
.challenge-level-editor input:focus { border-color: var(--brand); }