/* ── 工具 ──────────────────────────────────────────────── */
[hidden],
.hidden { display: none !important; }

/* ── 响应式 ─────────────────────────────────────────────── */
@media (max-width: 640px) {
  .hd-inner { height: 58px; padding: 0 var(--layout-gutter-mobile); gap: 10px; }
  .hd-emblem { width: 30px; height: 30px; border-radius: 9px; }
  .hd-sub { display: none; }
  .hd-title { font-size: 14px; }
  .hd-nav a { padding: 7px 9px; }
  .hd-nav a span { display: none; }
  .hd-user-menu > summary { padding: 3px; }
  .hd-menu-chevron { display: none; }
  .wrap { padding: 24px var(--layout-gutter-mobile) 130px; }
  .hero { flex-direction: column; align-items: flex-start; }
  .hero-quota { text-align: left; width: 100%; }
  .hero-quota-bar { margin-left: 0; width: 100%; }
  .hero-actions { width: 100%; flex-wrap: wrap; }
  .auth-board { grid-template-columns: 1fr; }
  .auth-copy { min-height: auto; padding: 24px; }
  .fgrid, .pgrid { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: 1fr; }
  .step-tbl-body { grid-template-columns: 1fr 1fr; }
  .step-cell:nth-child(2n) { border-right: none; }
  .step-cell:nth-child(1), .step-cell:nth-child(2) { border-bottom: 1px solid var(--border); }
  .sticky { padding: 10px 0; }
  .sticky-inner { padding: 0 var(--layout-gutter-mobile); }
  .stp-lbl { display: none; }
  .card-desc { display: none; }
  .usage-table { display: block; overflow-x: auto; white-space: nowrap; }
  .history-item { grid-template-columns: 1fr; }
  .history-item .btn-secondary { width: 100%; }
  .auth-actions { flex-direction: column; }
  .auth-actions .btn-secondary { width: 100%; }
}

@media (max-width: 400px) {
  .hd-brand { display: none; }
  .hd-nav { gap: 1px; }
  .hd-nav a { padding-right: 7px; padding-left: 7px; }
}

/* ── 入场动画 ─────────────────────────────────────────── */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.hero, .stepper, .card, .metric-grid, .auth-board {
  animation: fade-up 0.35s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.stepper { animation-delay: 0.05s; }
.card:nth-of-type(1) { animation-delay: 0.10s; }
.card:nth-of-type(2) { animation-delay: 0.15s; }
.card:nth-of-type(3) { animation-delay: 0.20s; }
.card:nth-of-type(4) { animation-delay: 0.25s; }
