:root,:root[data-tema=dark]{--background: hsl(222.2 84% 4.9%);--foreground: hsl(210 40% 98%);--card: hsl(224 71% 6%);--primary: hsl(210 40% 98%);--primary-foreground: hsl(222.2 47.4% 11.2%);--secondary: hsl(217.2 32.6% 17.5%);--muted-foreground: hsl(215 20.2% 65.1%);--accent: hsl(217.2 32.6% 17.5%);--destructive: hsl(0 62.8% 50%);--success: hsl(142 71% 45%);--border: hsl(217.2 32.6% 17.5%);--input: hsl(217.2 32.6% 17.5%);--ring: hsl(217 91% 60%);--brand: hsl(217 91% 60%);--shadow: 0 10px 40px hsl(0 0% 0% / .5);--radius: .5rem;color-scheme:dark}:root[data-tema=light]{--background: hsl(210 40% 98%);--foreground: hsl(222.2 84% 4.9%);--card: hsl(0 0% 100%);--primary: hsl(222.2 47.4% 11.2%);--primary-foreground: hsl(210 40% 98%);--secondary: hsl(210 40% 96.1%);--muted-foreground: hsl(215.4 16.3% 46.9%);--accent: hsl(210 40% 96.1%);--destructive: hsl(0 72% 45%);--success: hsl(142 71% 35%);--border: hsl(214.3 31.8% 91.4%);--input: hsl(214.3 31.8% 91.4%);--ring: hsl(221 83% 53%);--brand: hsl(221 83% 53%);--shadow: 0 10px 40px hsl(215 25% 27% / .12);color-scheme:light}svg{width:1em;height:1em;flex-shrink:0}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--background);color:var(--foreground);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}.layar{min-height:100%;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(60rem 40rem at 50% -10%,hsl(217 91% 60% / .1),transparent 70%),var(--background)}.kartu{width:100%;max-width:23rem;background:var(--card);border:1px solid var(--border);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow);padding:1.75rem 1.5rem 1.5rem;animation:masuk .22s cubic-bezier(.2,.8,.2,1) both}@keyframes masuk{0%{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}.merek{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin-bottom:1.5rem}.merek img{width:2.75rem;height:2.75rem;border-radius:calc(var(--radius) + 1px)}.merek h1{font-size:1rem;font-weight:650;margin:0;letter-spacing:-.015em;line-height:1.3}.merek p{margin:.25rem 0 0;font-size:.8rem;color:var(--muted-foreground);text-align:center;line-height:1.5;max-width:17rem}form{display:flex;flex-direction:column;gap:.95rem}label.field{display:flex;flex-direction:column;gap:.4rem;font-size:.8rem;font-weight:500}input[type=text],input[type=password]{height:2.5rem;background:transparent;border:1px solid var(--input);color:var(--foreground);padding:0 .75rem;border-radius:calc(var(--radius) - 2px);font-size:.875rem;font-family:inherit;width:100%;transition:border-color .12s,box-shadow .12s}input:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px #3c83f62e}input:disabled{opacity:.6}.kotak-sandi{position:relative;display:flex;align-items:center}.kotak-sandi input{padding-right:2.5rem}.lihat-sandi{position:absolute;right:.3rem;width:1.9rem;height:1.9rem;background:none;border:none;padding:0;color:var(--muted-foreground);cursor:pointer;border-radius:calc(var(--radius) - 3px);display:inline-flex;align-items:center;justify-content:center;transition:background .12s,color .12s}.lihat-sandi:hover{background:var(--accent);color:var(--foreground)}.lihat-sandi svg{width:1rem;height:1rem}label.check{display:flex;align-items:center;gap:.55rem;font-size:.82rem;font-weight:400;color:var(--muted-foreground);cursor:pointer;-webkit-user-select:none;user-select:none}label.check input{accent-color:var(--brand);cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:2.5rem;border:1px solid transparent;border-radius:calc(var(--radius) - 2px);font-family:inherit;font-size:.875rem;font-weight:550;padding:0 1rem;cursor:pointer;text-decoration:none;transition:opacity .12s,background .12s,transform .06s}.btn svg{width:1rem;height:1rem}.btn:active:not(:disabled){transform:translateY(.5px)}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover:not(:disabled){opacity:.92}.btn-outline{background:transparent;border-color:var(--border);color:var(--foreground)}.btn-outline:hover{background:var(--accent)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-blok{width:100%}.btn:focus-visible,.lihat-sandi:focus-visible,.tema-tombol:focus-visible,label.check input:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.spinner{width:.9rem;height:.9rem;border-radius:50%;border:2px solid hsl(0 0% 100% / .35);border-top-color:#fff;animation:putar .7s linear infinite}@keyframes putar{to{transform:rotate(360deg)}}.alert{border:1px solid var(--border);border-radius:calc(var(--radius) - 2px);padding:.65rem .8rem;font-size:.82rem;line-height:1.5;display:flex;gap:.55rem;align-items:flex-start}.alert svg{width:.95rem;height:.95rem;flex-shrink:0;margin-top:.12rem}.alert-error{border-color:#db242466;background:#db24241a;color:var(--destructive)}.alert-ok{border-color:#21c45d66;background:#21c45d1a;color:var(--success)}.alert-info{background:var(--secondary);color:var(--muted-foreground);border-color:var(--border)}.kaki{margin-top:1.35rem;padding-top:.95rem;border-top:1px solid var(--border);font-size:.73rem;color:var(--muted-foreground);text-align:center;line-height:1.6}.kaki a{color:inherit}.tema-tombol{position:fixed;top:1rem;right:1rem;background:none;border:1px solid var(--border);border-radius:calc(var(--radius) - 2px);color:var(--muted-foreground);padding:.4rem;cursor:pointer;display:inline-flex}.tema-tombol:hover{background:var(--accent);color:var(--foreground)}.tema-tombol{width:2rem;height:2rem;padding:0;align-items:center;justify-content:center;transition:background .12s,color .12s}.tema-tombol svg{width:1rem;height:1rem}.pusat{text-align:center}.tunggu{display:grid;place-items:center;gap:.8rem;padding:2rem 0;color:var(--muted-foreground);font-size:.85rem}.tunggu .spinner{width:1.4rem;height:1.4rem;border-width:2.5px;border-color:var(--border);border-top-color:var(--brand)}@media (prefers-reduced-motion: reduce){.kartu{animation:none}.spinner{animation-duration:2s}}