:root {
  color-scheme: dark;
  --bg: #070b10;
  --card: #0b1220;
  --line: rgba(103, 232, 249, 0.18);
  --text: #e8eef6;
  --muted: #8ea0b5;
  --accent: #67e8f9;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: "PingFang SC", "Noto Sans SC", sans-serif; }
main { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.card { width: min(440px, 100%); border: 1px solid var(--line); background: var(--card); padding: 28px; }
.kicker { color: var(--accent); font-size: 13px; letter-spacing: 0.04em; }
h1 { margin: 8px 0 0; font-size: 28px; }
.hint { margin: 10px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
label { display: block; margin-top: 16px; font-size: 13px; color: #c5d4e6; }
input { width: 100%; margin-top: 6px; height: 44px; border: 1px solid #1f2a3a; background: #070b10; color: white; padding: 0 12px; font-size: 16px; }
input:focus { outline: none; border-color: var(--accent); }
.err { margin-top: 12px; border: 1px solid rgba(244, 63, 94, 0.4); background: rgba(76, 5, 25, 0.45); color: #ffe4e6; padding: 8px 10px; font-size: 13px; }
button, .link {
  display: block; width: 100%; margin-top: 18px; height: 44px; border: 0; background: var(--accent); color: #082f36;
  font-size: 15px; font-weight: 700; cursor: pointer; text-decoration: none; text-align: center; line-height: 44px;
}
button:disabled { opacity: 0.6; cursor: wait; }
button.ghost, .ghost { background: transparent; border: 1px solid #334155; color: #dbeafe; }
.who { color: var(--muted); font-size: 14px; margin-top: 8px; }
.stack { display: grid; gap: 10px; margin-top: 18px; }
.item { border: 1px solid var(--line); padding: 14px 16px; color: inherit; text-decoration: none; background: #071018; cursor: pointer; text-align: left; }
.item small { display: block; margin-top: 4px; color: var(--muted); font-weight: 400; }
