:root {
  color-scheme: dark;
  --bg: #06141c;
  --surface: #0d2632;
  --line: rgba(133,199,226,.24);
  --text: #eefaff;
  --muted: #a9c0ca;
  --cyan: #a7e6ff;
  --gold: #f4bd59;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: radial-gradient(circle at 80% 0, rgba(32,132,171,.16), transparent 30rem), var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.65; }
a { color: inherit; text-underline-offset: 4px; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.wrap { width: min(calc(100% - 2rem), 860px); margin-inline: auto; }
header { border-bottom: 1px solid var(--line); background: rgba(6,20,28,.82); backdrop-filter: blur(18px); }
nav { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; font-size: .95rem; font-weight: 820; letter-spacing: .1em; text-transform: uppercase; }
.brand img { width: 40px; height: 40px; object-fit: contain; }
.brand span span { color: var(--cyan); }
.back { color: var(--muted); font-size: .9rem; }
main { padding: clamp(3.5rem, 8vw, 6rem) 0; }
.label { margin: 0 0 .9rem; color: var(--gold); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(2.5rem, 7vw, 4.8rem); line-height: 1; letter-spacing: -.05em; }
.lead { max-width: 720px; margin: 1.25rem 0 2rem; color: #c4d8df; font-size: 1.08rem; }
.notice { margin: 0 0 1rem; padding: 1rem 1.1rem; border: 1px solid rgba(244,189,89,.4); border-radius: 16px; color: #ffe0a5; background: rgba(244,189,89,.07); }
.card { margin-top: 1rem; padding: clamp(1.2rem, 4vw, 2rem); border: 1px solid var(--line); border-radius: 22px; background: rgba(13,38,50,.78); }
.card h2 { margin: 0 0 .65rem; font-size: 1.25rem; }
.card p { margin: .4rem 0; color: var(--muted); }
.card ul { margin: .6rem 0 0; padding-left: 1.25rem; color: var(--muted); }
.action { display: inline-flex; margin-top: 1.5rem; padding: .7rem 1rem; border: 1px solid var(--line); border-radius: 999px; color: var(--cyan); text-decoration: none; font-weight: 750; }
footer { padding: 2rem 0 calc(2rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); color: var(--muted); font-size: .85rem; }
@media (max-width: 520px) { .wrap { width: min(calc(100% - 1.25rem), 860px); } nav { min-height: 64px; } .brand { font-size: .8rem; letter-spacing: .07em; } .brand img { width: 36px; height: 36px; } }