:root{
      --blue:#5b93ce; --cream:#ffeec4; --mint:#bad5c9; --coral:#e77a7e;
      --ink:#0f172a; --r:18px; --shadow:0 14px 40px rgba(15,23,42,.12);
    }
    *{box-sizing:border-box}
    body{
      margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
      font-family:Avenir,"Avenir Next",system-ui,sans-serif; color:var(--ink);
      background:
        radial-gradient(1000px 500px at 10% 0%, rgba(91,147,206,.25), transparent 60%),
        radial-gradient(900px 500px at 90% 10%, rgba(231,122,126,.20), transparent 60%),
        radial-gradient(900px 500px at 50% 95%, rgba(186,213,201,.30), transparent 60%),
        linear-gradient(180deg, var(--cream), #fff 55%);
    }
    .card{
      max-width:560px; width:100%;
      background:rgba(255,255,255,.86);
      border-radius:var(--r);
      padding:26px;
      border:1px solid rgba(15,23,42,.10);
      box-shadow:var(--shadow);
    }
    .brand{display:flex; gap:12px; align-items:center; font-weight:900}
    .ml{
      width:42px; height:42px; border-radius:16px;
      background:linear-gradient(180deg,var(--coral),rgba(231,122,126,.92));
      display:flex; align-items:center; justify-content:center;
      color:#fff; font-weight:900; letter-spacing:.2px;
      box-shadow:0 12px 22px rgba(231,122,126,.22);
    }
    h1{margin:16px 0 10px; font-size:30px; letter-spacing:-.3px}
    p{margin:0 0 16px; line-height:1.6; font-size:15px; opacity:.95}
    .box{background:#fff; border-radius:16px; padding:18px; border:1px solid rgba(15,23,42,.10)}
    label{display:block; font-weight:900; font-size:13px; margin:0 0 8px}
    input{
      width:100%;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid rgba(15,23,42,.15);
      font-size:15px; font-weight:700;
    }
    button{
      width:100%;
      margin-top:12px;
      padding:12px 14px;
      border-radius:14px;
      border:0;
      background:linear-gradient(180deg,var(--blue),rgba(91,147,206,.88));
      color:#fff; font-weight:900; font-size:15px;
      cursor:pointer;
    }
    .err{margin-top:10px; color:var(--coral); font-weight:900; display:none}
.err.is-visible{display:block}
    .small{margin-top:14px; font-size:12px; opacity:.75}