* { box-sizing:border-box; margin:0; }
  body { font:16px/1.4 -apple-system,system-ui,sans-serif; background:var(--bg); color:var(--text);
         min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
  .card { background:var(--panel); border-radius:22px; padding:30px 26px; width:min(360px,100%);
          box-shadow:0 8px 30px -18px rgba(0,0,0,.35); text-align:center; animation:up .3s ease; }
  @keyframes up { from { opacity:0; transform:translateY(10px); } }
  img { width:76px; height:76px; border-radius:18px; margin-bottom:14px; }
  h1 { font-size:20px; margin-bottom:4px; }
  p { color:var(--text-muted); font-size:14px; margin-bottom:20px; }
  input { width:100%; font:inherit; color:inherit; border:1px solid var(--border); background:var(--bg);
          border-radius:12px; padding:12px 14px; outline:none; text-align:center; }
  input:focus { border-color:var(--accent); }
  button { width:100%; font:inherit; font-weight:650; border:0; background:var(--accent); color:#fff;
           border-radius:12px; padding:12px; margin-top:10px; cursor:pointer; }
  #err { color:var(--danger); font-size:13.5px; min-height:18px; margin-top:10px; }
  .shake { animation:sh .3s; }
  @keyframes sh { 25% { transform:translateX(-6px); } 75% { transform:translateX(6px); } }