/* Look borrowed from spotle.movie: deep navy, soft white text, gold glowing buttons.
   Fonts: only stacks whose first choices exist on Windows, Mac, iOS and Android.
   Don't name a font that only exists on some devices (e.g. Impact is missing on phones);
   if we want a special font later, ship the font file in the repo instead. */
:root { --bg: #060b14; --card: #0d1626; --text: #eaf0ff; --muted: #7f8bab; --accent: #f0b13f; --accent2: #d99a2b; --line: #1d2a44; --err: #ff7a7a; }
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); font: 17px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: radial-gradient(ellipse at top, #0f1c36 0%, var(--bg) 55%) fixed; min-height: 100vh; }
header { max-width: 720px; margin: 0 auto; padding: 16px 16px 8px; text-align: right; }
h1 { margin: 0; }
h1 img { display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--line); }
h2 { font: 600 1.4rem/1.2 Georgia, "Times New Roman", serif; letter-spacing: .02em; }
main { max-width: 720px; margin: 0 auto; padding: 0 16px 64px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin-bottom: 16px; }
fieldset.card { min-inline-size: 0; }
legend { font-weight: 600; padding: 0 6px; }
label { display: block; padding: 6px 0; cursor: pointer; }
label.disabled { opacity: .4; cursor: not-allowed; }
input[type=checkbox], input[type=radio] { margin-right: 8px; accent-color: var(--accent); transform: scale(1.2); }
input[type=text], input[type=email], textarea { width: 100%; background: #08101e; color: var(--text); border: 1px solid var(--line); border-radius: 10px; padding: 10px; font: inherit; margin: 4px 0; }
input:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
textarea { min-height: 90px; resize: vertical; }
button { background: linear-gradient(180deg, var(--accent), var(--accent2)); color: #1a1100; border: 0; border-radius: 12px; padding: 14px 28px; font: inherit; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; box-shadow: 0 0 22px rgba(240, 177, 63, .28); }
button:hover:not(:disabled) { filter: brightness(1.08); }
button:disabled { opacity: .5; cursor: default; box-shadow: none; }
#signout { margin-top: 10px; background: var(--card); color: var(--muted); border: 1px solid var(--line); box-shadow: none; padding: 8px 14px; font-size: .8rem; }
button.muted { background: transparent; box-shadow: none; text-transform: none; font-weight: 500; letter-spacing: 0; }
.muted { color: var(--muted); }
.error { color: var(--err); }
.hint { color: var(--muted); font-size: .9rem; }
.sign { font-style: italic; color: var(--muted); }