/* ============================================================
 * certificate.css - 页面级补充样式（判定 / 证书分享 / 成绩分享 / 脱富学院）
 * 通用组件见 components.css，此处只收 SPA 专属视图样式。
 * ============================================================ */

/* ---- 判定页：审核加载 ---- */
#verdict-loading { text-align: center; padding: var(--sp-2xl) 0; }
.seal-spinner {
  width: 56px; height: 56px;
  margin: 0 auto var(--sp-md);
  border: 4px solid var(--line);
  border-top-color: var(--red);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.verdict-tip { font-size: var(--fs-sm); color: var(--ink-light); letter-spacing: 1px; }

/* ---- 成绩单：等级章（斜盖右上角，复用 sealIn 盖章动画） ---- */
.doc-score-card { position: relative; }
.doc-stamp {
  --seal-angle: 12deg;
  position: absolute; top: 10px; right: 6px;
  display: inline-block; padding: 5px 12px;
  border: 3px solid var(--red); border-radius: 6px;
  color: var(--red); font-size: var(--fs-lg); font-weight: 800; letter-spacing: 2px;
  animation: sealIn var(--dur-slow) var(--ease) .5s both;
}
/* 钞能力成绩单：金章 */
.doc-stamp--gold { border-color: var(--gold-deep); color: var(--gold-deep); }

/* ---- 证书署名：两个输入框的间距 ---- */
#name-input { margin-bottom: 0; }

/* ---- 证书分享页（/cert/:no） ---- */
.share-head { margin-bottom: 16px; text-align: center; font-size: var(--fs-sm); line-height: 1.7; color: var(--ink-light); letter-spacing: .5px; min-height: 1.6em; }
/* 查证失败态：提示语放大突出（上下间距对称）；入场动画与其他元素同款 rise，
   加 is-error 类的瞬间自动播放（错误文案是加载后才出现的，需要自己的入场感） */
.share-head.is-error { margin: 48px 0; font-size: var(--fs-xl); font-weight: 700; color: var(--red); animation: rise var(--dur-slow) var(--ease); }
/* 失败态按钮区：切单列，唯一按钮沿用全站通栏惯例（与 404 页「返回首页」一致） */
.cert-actions.is-error { grid-template-columns: 1fr; }
.cert-img {
  width: 100%; max-width: 320px; margin: 0 auto;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
}