:root { --bg:#f2f5fb; --card:#ffffff; --line:#d8e0ef; --ink:#0f1c2e; --muted:#607089; --brand:#1d4ed8; }
    html, body { max-width:100%; overflow-x:hidden; }
    body { margin:0; min-height:100vh; display:grid; place-items:center; background:radial-gradient(circle at 12% 15%, #d8e8ff 0%, #f2f5fb 40%, #eef2fb 100%); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color:var(--ink); }
    .card { width:min(92vw, 420px); background:var(--card); border:1px solid var(--line); border-radius:16px; padding:1rem; box-shadow:0 14px 40px rgba(15,28,46,.08); }
    .brand { display:flex; align-items:center; gap:.6rem; margin-bottom:.8rem; font-weight:700; }
    .brand img { width:18px; height:18px; border-radius:5px; }
    .muted { color:var(--muted); font-size:.92rem; margin:0 0 .8rem 0; }
    label { display:block; font-size:.85rem; color:var(--muted); margin-top:.6rem; }
    input, button { width:100%; box-sizing:border-box; padding:.72rem .75rem; margin-top:.3rem; border-radius:12px; border:1px solid var(--line); font-size:.96rem; }
    button { background:var(--brand); color:#fff; border-color:var(--brand); cursor:pointer; }
    .pw-wrap { display:flex; align-items:center; gap:.35rem; }
    .pw-wrap input { margin-top:.3rem; }
    .pw-wrap button { width:auto; white-space:nowrap; padding:.55rem .7rem; margin-top:.3rem; background:#fff; color:var(--ink); border:1px solid var(--line); }