  :root { --latar:#14161a; --kartu:#1f232a; --teks:#e8eaed; --redup:#9aa0a6; --aksen:#4f8cff; --tombol:#2563eb; --garis:#2c313a; --bad:#ff7b72; color-scheme:dark; }
  html[data-tema="light"] { --latar:#f4f5f7; --kartu:#ffffff; --teks:#1f2328; --redup:#5f6670; --aksen:#2f6fed; --tombol:#1d5bd6; --garis:#d8dce2; --bad:#c62828; color-scheme:light; }
  * { box-sizing: border-box; }
  body { margin:0; background:var(--latar); color:var(--teks); font:16px/1.5 system-ui,sans-serif; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:16px; }
  form { width:100%; max-width:340px; background:var(--kartu); border:1px solid var(--garis); border-radius:12px; padding:20px; display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
  h1 { font-size:1.1rem; margin:0; }
  label { display:block; font-size:.9rem; color:var(--redup); margin-bottom:4px; }
  .kolom { display:flex; gap:8px; min-width:0; }
  input { flex:1; min-width:0; background:var(--latar); color:var(--teks); border:1px solid var(--garis); border-radius:8px; padding:12px; min-height:44px; font:inherit; }
  input:focus-visible, button:focus-visible { outline:2px solid var(--aksen); outline-offset:2px; }
  button { background:var(--tombol); color:#fff; border:0; border-radius:8px; padding:12px 14px; min-height:44px; font:inherit; cursor:pointer; }
  button.intip { flex:none; width:44px; padding:0; display:flex; align-items:center; justify-content:center; background:transparent; color:var(--redup); border:1px solid var(--garis); }
  .mata { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
  .intip .tutup { display:none; }
  .intip[aria-pressed="true"] .buka { display:none; }
  .intip[aria-pressed="true"] .tutup { display:inline; }
  button:disabled { opacity:.5; cursor:default; }
  #pesan { color:var(--bad); font-size:.9rem; min-height:1.3em; }
  .profil { display:grid; gap:10px; justify-items:center; text-align:center; }
  .profil img { width:112px; height:112px; object-fit:contain; }
  .profil h1 { font-size:1.25rem; font-weight:500; margin:0; }
