/* —— Reset & layout —— */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Noto Sans TC',sans-serif;background:#f9fafb;color:#374151;line-height:1.6}
body{display:flex;align-items:center;justify-content:center;padding:2rem}

/* —— Card —— */
.card{max-width:420px;background:#fff;border-radius:1rem;padding:2rem;box-shadow:0 8px 24px rgba(0,0,0,.06);text-align:center;animation:fadeIn .6s ease}
h1{font-size:1.5rem;font-weight:700;margin-bottom:.75rem;color:#dc2626}
p{margin-bottom:1.25rem}
a.btn{display:inline-block;padding:.75rem 1.5rem;border-radius:.5rem;font-weight:600;text-decoration:none;background:#2563eb;color:#fff;transition:transform .15s}
a.btn:hover{transform:translateY(-2px)}
.tip{font-size:.875rem;color:#6b7280;margin-top:.75rem}

/* —— Animation —— */
@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* —— Dark mode —— */
@media (prefers-color-scheme:dark){
  html{background:#111827;color:#d1d5db}
  .card{background:#1f2937;box-shadow:0 8px 24px rgba(0,0,0,.4)}
  a.btn{background:#3b82f6}
}