*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    :root {
      --bg:#0c0d10; --surface:#13151a; --surface-2:#1a1d24; --surface-3:#1e2230;
      --border:#22252e; --border-h:#2e3340;
      --text:#e2e4eb; --text-2:#8891a4; --text-3:#4d5568;
      --accent:#5865f2; --accent-soft:rgba(88,101,242,0.12);
      --green:#3ecf8e; --green-soft:rgba(62,207,142,0.1); --green-border:rgba(62,207,142,0.2);
      --red:#f87171; --red-soft:rgba(248,113,113,0.1); --red-border:rgba(248,113,113,0.25);
      --yellow:#fbbf24; --yellow-soft:rgba(251,191,36,0.1); --yellow-border:rgba(251,191,36,0.25);
      --purple:#a78bfa; --purple-soft:rgba(167,139,250,0.1); --purple-border:rgba(167,139,250,0.25);
    }
    ::-webkit-scrollbar { width:8px; height:8px; }
    ::-webkit-scrollbar-track { background:#1a1d24; border-radius:99px; }
    ::-webkit-scrollbar-thumb { background:#2e3340; border-radius:99px; border:2px solid #1a1d24; }
    ::-webkit-scrollbar-thumb:hover { background:#404760; }
    * { scrollbar-width:thin; scrollbar-color:#2e3340 #1a1d24; }

    body { font-family:'Manrope',sans-serif; background:var(--bg); color:var(--text);
      min-height:100dvh; display:flex; flex-direction:column; }
    .page { flex:1; display:flex; align-items:flex-start; justify-content:center;
      padding:40px 16px 48px; position:relative; z-index:1; }
    @media(min-width:600px) { .page { align-items:center; } }
    .container { width:100%; max-width:480px; }

    /* Brand bar */
    .brand-bar { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:24px; }
    .brand { display:flex; align-items:center; gap:8px; text-decoration:none; }
    .brand-mark {
      width:28px; height:28px; border-radius:8px; background:var(--accent);
      display:flex; align-items:center; justify-content:center; flex-shrink:0;
    }
    .brand-name { font-size:15px; font-weight:800; color:#fff; letter-spacing:-.3px; }

    /* Header */
    .header { margin-bottom:20px; }
    .header-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 12px;
      border-radius:99px; font-size:11px; font-weight:700; letter-spacing:.06em;
      text-transform:uppercase; margin-bottom:14px; }
    .header-badge.purple { background:var(--purple-soft); border:1px solid var(--purple-border); color:var(--purple); }
    .header-badge.active { background:var(--green-soft); border:1px solid var(--green-border); color:var(--green); }
    .header-badge.error { background:var(--red-soft); border:1px solid var(--red-border); color:var(--red); }
    .badge-dot { width:5px; height:5px; border-radius:50%; }
    .badge-dot.purple { background:var(--purple); animation:pulse 2.5s ease-in-out infinite; }
    .badge-dot.green { background:var(--green); }
    .badge-dot.red { background:var(--red); animation:none; }
    @keyframes pulse { 0%,100%{opacity:1}50%{opacity:.4} }
    .header h1 { font-size:clamp(18px,4vw,22px); font-weight:800; color:#fff; letter-spacing:-.3px; margin-bottom:5px; }
    .header p { font-size:13px; color:var(--text-2); line-height:1.6; }

    /* Card */
    .card { background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; }
    @media(max-width:400px) { .card { border-radius:12px; } }
    .card-head { padding:14px 18px; border-bottom:1px solid var(--border); display:flex;
      align-items:center; justify-content:space-between; gap:8px; }
    @media(max-width:400px) { .card-head { padding:12px 14px; } }
    .card-title { font-size:12px; font-weight:700; color:var(--text-2); letter-spacing:.04em;
      text-transform:uppercase; display:flex; align-items:center; gap:7px; }
    .card-body { padding:20px; }
    @media(max-width:400px) { .card-body { padding:16px; } }

    .err-msg { font-size:14px; color:var(--red); margin-bottom:14px; text-align:center; line-height:1.5; }

    /* Form */
    .field { margin-bottom:16px; }
    .field label { display:block; font-size:12px; font-weight:700; color:var(--text-2);
      text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px; }
    .field input { width:100%; padding:10px 14px; border-radius:10px; border:1px solid var(--border);
      background:var(--surface-2); color:var(--text); font-family:'JetBrains Mono',monospace;
      font-size:14px; font-weight:600; outline:none; transition:border-color .15s; }
    .field input:focus { border-color:var(--accent); }
    .field input::placeholder { color:var(--text-3); }
    .hint { font-size:11px; color:var(--text-3); margin-top:5px; line-height:1.5; }

    .submit-btn { display:flex; align-items:center; justify-content:center; gap:8px;
      width:100%; padding:12px 20px; border-radius:10px;
      background:var(--accent); border:none; color:#fff;
      font-family:'Manrope',sans-serif; font-size:14px; font-weight:700;
      cursor:pointer; transition:all .15s; }
    .submit-btn:hover { background:#4752c4; transform:translateY(-1px); box-shadow:0 4px 16px rgba(88,101,242,.25); }
    .submit-btn:active { transform:translateY(0) scale(.98); }
    .submit-btn:disabled { opacity:.5; pointer-events:none; }
    @keyframes btn-spin { to { transform:rotate(360deg); } }
    .btn-spinner { width:14px; height:14px; border:2px solid rgba(255,255,255,.3);
      border-top-color:#fff; border-radius:50%; animation:btn-spin .6s linear infinite;
      display:inline-block; }

    /* Success box */
    .success-box {
      text-align:center; padding:24px 20px;
      background:linear-gradient(135deg, rgba(62,207,142,0.06), rgba(62,207,142,0.02));
      border:1px solid var(--green-border); border-radius:14px; margin-bottom:16px;
    }
    @media(max-width:400px) { .success-box { padding:18px 14px; border-radius:10px; } }
    .success-icon { width:48px; height:48px; border-radius:12px; margin:0 auto 14px;
      display:flex; align-items:center; justify-content:center;
      background:var(--green-soft); border:1px solid var(--green-border); color:var(--green); }
    .success-title { font-size:17px; font-weight:800; color:var(--green); margin-bottom:6px; }
    .success-desc { font-size:13px; color:var(--text-2); line-height:1.6; }

    /* Cooldown box */
    .cooldown-box {
      text-align:center; padding:24px 20px;
      background:linear-gradient(135deg, rgba(251,191,36,0.06), rgba(251,191,36,0.02));
      border:1px solid var(--yellow-border); border-radius:14px; margin-bottom:16px;
    }
    .cooldown-icon { width:48px; height:48px; border-radius:12px; margin:0 auto 14px;
      display:flex; align-items:center; justify-content:center;
      background:var(--yellow-soft); border:1px solid var(--yellow-border); color:var(--yellow); }
    .cooldown-title { font-size:17px; font-weight:800; color:var(--yellow); margin-bottom:6px; }
    .cooldown-desc { font-size:13px; color:var(--text-2); line-height:1.6; }
    .cooldown-timer { font-family:'JetBrains Mono',monospace; font-size:22px; font-weight:700;
      color:var(--yellow); margin-top:10px; }

    /* Back link */
    .back-link { display:flex; align-items:center; gap:6px; margin-top:16px;
      font-size:13px; font-weight:600; color:var(--text-2); text-decoration:none;
      transition:color .15s; justify-content:center; }
    .back-link:hover { color:var(--accent); }

    /* HWID info */
    .hwid-info { font-size:11px; color:var(--text-3); margin-top:16px; font-family:'JetBrains Mono',monospace;
      word-break:break-all; text-align:center; padding:10px 14px; background:var(--surface-2);
      border:1px solid var(--border); border-radius:10px; }
    .hwid-info span { color:var(--text-2); font-weight:600; }

    /* Footer */
    .footer { border-top:1px solid var(--border); padding:16px; text-align:center;
      font-size:12px; color:var(--text-3); margin-top:20px; }
    .footer a { color:var(--purple); text-decoration:none; font-weight:600; }
    .footer a:hover { text-decoration:underline; }

    /* Toast */
    .toast-wrap {
      position:fixed; bottom:20px; right:20px; z-index:999;
      display:flex; flex-direction:column; gap:8px; max-width:calc(100vw - 40px);
    }
    @media(max-width:480px) { .toast-wrap { bottom:16px; right:16px; left:16px; max-width:calc(100vw - 32px); } }
    .toast {
      display:flex; align-items:center; gap:10px;
      background:var(--surface); border:1px solid var(--border);
      border-radius:11px; padding:12px 14px; font-size:13px; font-weight:600; color:var(--text);
      box-shadow:0 8px 32px rgba(0,0,0,0.4); animation:toast-in .25s ease; min-width:180px;
    }
    @media(max-width:480px) { .toast { min-width:auto; } }
    .toast.success { border-color:rgba(62,207,142,0.3); }
    .toast.error { border-color:rgba(248,113,113,0.3); }
    .toast-icon { flex-shrink:0; }
    .toast.success .toast-icon { color:var(--green); }
    .toast.error .toast-icon { color:var(--red); }
    @keyframes toast-in { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }