:root {
        --ink: #f2f5f7;
        --muted: #aebac3;
        --line: rgba(210, 226, 235, .17);
        --card: rgba(12, 25, 36, .78);
        --accent: #67d1ff;
        --accent-dark: #1595c7;
        --good: #8cddaa;
      }
      * { box-sizing: border-box; }
      body {
        min-height: 100vh; margin: 0; color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        background: #0c1924; overflow-x: hidden;
      }
      .backdrop { position: fixed; inset: 0; z-index: -2; background:
        linear-gradient(105deg, rgba(5,14,21,.82), rgba(10,29,43,.34)),
        radial-gradient(circle at 72% 10%, rgba(66,133,166,.34), transparent 32%),
        linear-gradient(130deg, #111e27 0%, #1c3641 47%, #07131c 100%); }
      .house { position: fixed; inset: 0; z-index: -1; opacity: .3; filter: blur(1px); }
      .house:before { content: ""; position:absolute; width: 68vw; height: 51vh; right: -3vw; bottom: -9vh; background: linear-gradient(142deg, transparent 27%, rgba(9,16,20,.9) 27.2% 58%, transparent 58.3%), linear-gradient(90deg, transparent 15%, rgba(4,11,16,.9) 15.2% 18%, transparent 18.2% 46%, rgba(4,11,16,.9) 46.2% 49%, transparent 49.2%); }
      .app { width: min(1160px, calc(100% - 48px)); margin: 0 auto; padding: 30px 0 24px; min-height: 100vh; display: flex; flex-direction: column; }
      header { display:flex; align-items:center; justify-content:space-between; }
      .brand { display:flex; align-items:center; gap:11px; letter-spacing:.02em; }
      .mark { width:38px; height:38px; border:1px solid rgba(103,209,255,.75); border-radius:11px; display:grid; place-items:center; color:var(--accent); }
      .brand b { font-size:16px; font-weight:650; } .brand span { color:var(--muted); font-weight:400; }
      .status { display:flex; gap:9px; align-items:center; color:#c8d9e1; font-size:12px; }
      .dot { height:8px; width:8px; background:var(--good); border-radius:50%; box-shadow:0 0 12px var(--good); }
      main { flex:1; display:grid; place-items:center; padding:48px 0; }
      .panel { width:min(430px, 100%); border:1px solid var(--line); background:var(--card); border-radius:20px; padding:38px; box-shadow:0 28px 70px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(14px); }
      .eyebrow { color:var(--accent); font-size:11px; text-transform:uppercase; letter-spacing:.16em; font-weight:700; }
      h1 { margin:10px 0 10px; font-size:30px; line-height:1.15; letter-spacing:-.035em; }
      .intro { color:var(--muted); margin:0 0 28px; line-height:1.55; font-size:14px; }
      form { display:grid; gap:15px; }
      label { display:grid; gap:7px; color:#cfdae0; font-size:12px; font-weight:600; }
      input { width:100%; padding:13px 14px; color:var(--ink); background:rgba(2,11,18,.57); border:1px solid rgba(216,237,247,.18); border-radius:9px; outline:0; font:inherit; font-size:14px; transition:.2s; }
      input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(103,209,255,.12); }
      .options { display:flex; align-items:center; justify-content:space-between; margin:2px 0 5px; font-size:12px; color:var(--muted); }
      .check { display:flex; align-items:center; gap:8px; cursor:pointer; } .check input { width:14px; height:14px; accent-color:var(--accent); }
      a { color:#a9dff6; text-decoration:none; } a:hover { color:white; }
      button { border:0; border-radius:9px; padding:14px; background:linear-gradient(100deg, var(--accent-dark), var(--accent)); color:#06202c; font-weight:750; font-size:14px; cursor:pointer; transition:transform .2s, filter .2s; }
      button:hover { transform:translateY(-1px); filter:brightness(1.06); } button:active { transform:translateY(0); }
      .notice { min-height:18px; margin:16px 0 0; font-size:12px; color:var(--muted); text-align:center; }
      .divider { height:1px; margin:27px 0 17px; background:var(--line); }
      .support { display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:12px; }
      footer { display:flex; justify-content:space-between; color:#8d9ca7; font-size:11px; }
      @media (max-width: 520px) { .app { width:min(100% - 32px, 1160px); padding-top:20px; } .status { font-size:10px; } main { padding:26px 0; } .panel { padding:28px 23px; border-radius:16px; } h1 { font-size:27px; } footer { gap:10px; } }
