:root {
      --bg: #0b1020;
      --bg-soft: #121831;
      --card: #151c3b;
      --text: #e8ecf6;
      --muted: #a9b3c9;
      --accent: #7aa2ff;
      --accent-2: #9ae6b4;
      --danger: #ff6b6b;
      --ring: rgba(122, 162, 255, .5);
      --border-soft: rgba(232,236,246,.12);
    }
    @media (prefers-color-scheme: light) {
      :root {
        --bg: #f7f9ff;
        --bg-soft: #eef2ff;
        --card: #ffffff;
        --text: #0c1222;
        --muted: #475069;
        --accent: #315efb;
        --accent-2: #0ea5a5;
        --danger: #e11d48;
        --ring: rgba(49,94,251,.25);
        --border-soft: rgba(12,18,34,.12);
      }
    }
    * { box-sizing: border-box; }
    html, body { height: 100%; }
    body {
      margin: 0;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
      color: var(--text);
      background: var(--bg);
      line-height: 1.5;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    @supports (background: radial-gradient(circle at 50% 50%, red, blue)) {
      body {
        background: radial-gradient(1200px 800px at 10% -20%, var(--bg-soft), transparent),
                    radial-gradient(800px 600px at 110% 10%, rgba(122,162,255,.08), transparent),
                    var(--bg);
      }
    }
    .container { max-width: 1100px; margin: 0 auto; padding: 24px; }
    header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 0 24px; }
    .brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
    .brand img { height:48px; width:auto; display:block; }
    .brand h1 { font-size:1.15rem; margin:0; letter-spacing:.2px; }

    .card {
      background: var(--card);
      border: 1px solid var(--border-soft);
      border-radius: 20px;
      padding: 28px;
      box-shadow: 0 20px 60px rgba(0,0,0,.25);
      backdrop-filter: blur(6px);
    }
    @supports (background: color-mix(in srgb, #000 10%, #fff)) {
      .card { background: color-mix(in srgb, var(--card) 96%, transparent); border: 1px solid color-mix(in srgb, var(--text) 10%, transparent); }
    }
    .grid { display:grid; gap:24px; grid-template-columns:1.2fr 1fr; }
    @media (max-width: 900px) { .grid { grid-template-columns:1fr; } }

    .hero h2 { font-size: clamp(1.6rem, 2.4vw + 1rem, 2.2rem); margin:0 0 10px; }
    .hero p { color: var(--muted); margin:0 0 18px; }
    .bullets { display:grid; gap:10px; margin:18px 0; }
    .bullet { display:flex; align-items:center; gap:10px; color: var(--text); }
    .badge { font-size:.85rem; padding:6px 10px; border-radius:999px; background:rgba(122,162,255,.2); border:1px solid rgba(122,162,255,.35); color:var(--text); }

    form { display:grid; gap:14px; }
    label { font-weight:600; font-size:.95rem; }
    .hint { color:var(--muted); font-size:.9rem; }

    .field { display:grid; gap:6px; }
    .input { background:rgba(255,255,255,.02); border:1px solid var(--border-soft); border-radius:12px; color:var(--text); padding:12px 14px; outline:none; transition:border-color .15s, box-shadow .15s, transform .02s; }
    @supports (background: color-mix(in srgb, #000 10%, #fff)) { .input { background: color-mix(in srgb, var(--card) 80%, transparent); } }
    .input:focus { border-color:var(--accent); box-shadow:0 0 0 4px var(--ring); }
    .input[aria-invalid="true"] { border-color: var(--danger); }

    .row { display:grid; gap:12px; grid-template-columns:1fr 1fr; }
    @media (max-width: 640px) { .row { grid-template-columns:1fr; } }

    .actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
    button[type="submit"] { border:0; cursor:pointer; border-radius:12px; padding:12px 16px; font-weight:700; background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#0b1020; box-shadow:0 8px 20px rgba(0,0,0,.25); transition: transform .06s ease, box-shadow .2s ease, filter .2s ease; }
    button[type="submit"]:hover { transform: translateY(-1px); filter: brightness(1.03); }
    button[type="submit"]:active { transform: translateY(0); }
    button[disabled] { opacity:.7; cursor:not-allowed; }

    .legal { font-size:.9rem; color:var(--muted); }
    .legal a { color:inherit; }

    .status { font-size:.95rem; }
    .status.success { color: var(--accent-2); }
    .status.error { color: var(--danger); }

    .hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

    footer { margin-top:36px; color:var(--muted); font-size:.9rem; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
    footer a { color:inherit; }

    .no-js { display:none; }
    noscript .no-js { display:block; color:var(--danger); margin-top:8px; }