/* =========================================================================
   ui-polish.css —— 全局 UI 统一优化 (WS-04A)
   按钮三层级 / Toast 三色 / 二次确认弹窗 / 齿轮入口 / 200ms 进入过渡
   复用现有 --amber / --cyan / --violet 等变量；不引外部字体 / 库
   （加载顺序在 base.css / ui.css / components.css 之后，做增量覆盖）
   ========================================================================= */

/* ---------- 按钮：统一三层级 + 反馈 ---------- */
.btn { transition: transform .12s, border-color .15s, background .15s, box-shadow .15s; }
.btn:hover { transform: translateY(-1px); border-color: var(--cyan); }   /* hover 上移 1px */
.btn:active { transform: translateY(1px); }                                /* active 下沉 */
.btn:disabled { transform: none; }

.btn.primary { box-shadow: 0 6px 18px rgba(245, 166, 35, .12); }
.btn.primary:hover { background: #241a0c; }

.btn.danger { border-color: var(--red); color: #ffd2d2; }
.btn.danger:hover { background: #241014; border-color: #ff7a7a; }

/* ---------- Toast：成功 / 错误 / 信息 三色 ---------- */
.toast.success { border-color: var(--green); color: #bff3d8; }
.toast.error   { border-color: var(--red);   color: #ffc9c9; }
.toast.info    { border-color: var(--violet);color: #d9ccff; }

/* ---------- 二次确认弹窗（复用 modal 造型，固定全屏覆盖） ---------- */
.confirm-bg {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: rgba(4, 8, 12, .6);
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.confirm-bg.show { display: flex; animation: fade .2s; }
.confirm-modal { max-width: 420px; text-align: left; }
.confirm-modal h3 { color: var(--amber); letter-spacing: 2px; margin: 0 0 12px; }
.confirm-msg { color: var(--ink); font-size: 14.5px; line-height: 1.7; margin: 0 0 18px; }
.confirm-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* ---------- 标题页齿轮入口（右上角，44×44 触控） ---------- */
.gear-btn {
  position: absolute;
  top: 14px; right: 14px;
  width: 44px; height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--dim);
  background: #0d1722;
  border: 1px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  z-index: 5;
  transition: transform .25s, color .15s, border-color .15s;
}
.gear-btn:hover { color: var(--amber); border-color: var(--amber); transform: rotate(30deg); }

/* ---------- 页面 / 抽屉进入过渡 200ms fade ---------- */
.title-screen, .login-screen { animation: screenFade .2s ease-out; }
@keyframes screenFade { from { opacity: 0; } to { opacity: 1; } }