.cg-flash-wrap { position: sticky; top: 0; z-index: 60; }
.cg-flash {
  --ok: #16a34a;
  --ok-bg: #ecfdf5;
  --err: #b91c1c;
  --err-bg: #fef2f2;
  --ink: #0f172a;
  --muted: #64748b;
  --stroke: #e5e7eb;
  max-width: 1100px;
  margin: 10px auto 0;
  padding: 0 16px;
}
.cg-flash .box {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  border: 1px solid var(--stroke);
  border-radius: 14px;
  padding: .85rem 1rem;
  box-shadow: 0 10px 30px rgba(2, 6, 23, .06);
  background: #fff;
}
.cg-flash.success .box { border-color: #bbf7d0; background: var(--ok-bg); }
.cg-flash.error .box { border-color: #fecaca; background: var(--err-bg); }
.cg-flash .ico { font-size: 20px; line-height: 1; margin-top: .05rem; }
.cg-flash.success .ico { color: var(--ok); }
.cg-flash.error .ico { color: var(--err); }
.cg-flash .msg { color: var(--ink); }
.cg-flash .msg small { display: block; color: var(--muted); margin-top: .25rem; }
.cg-flash .close {
  margin-left: auto;
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  color: #334155;
  padding: .25rem;
  border-radius: 8px;
}
.cg-flash .close:hover { background: rgba(15, 23, 42, .06); }
.cg-flash.hide {
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .25s ease, transform .25s ease;
}