:root{--background: hsl(220 20% 97%);--foreground: hsl(220 25% 10%);--card: hsl(0 0% 100%);--muted: hsl(220 10% 50%);--border: hsl(220 16% 88%);--primary: hsl(152 60% 42%);--primary-fg: #fff;--ring: hsl(152 60% 42%);--error: hsl(0 72% 45%)}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:Inter,system-ui,sans-serif;background:var(--background);color:var(--foreground);display:flex;align-items:center;justify-content:center;padding:16px}.wrap{width:100%;max-width:24rem}.brand{text-align:center;margin-bottom:2rem}.brand img{width:64px;height:64px;border-radius:16px;margin:0 auto 1rem;display:block}h1{font-size:1.5rem;margin:0}.sub{margin:4px 0 0;font-size:.875rem;color:var(--muted)}form{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:24px;display:grid;gap:16px;box-shadow:0 10px 30px #0f172a14}label{font-size:.875rem;font-weight:500;display:block;margin-bottom:6px}input{width:100%;height:40px;border:1px solid var(--border);border-radius:8px;padding:0 12px;font:inherit;background:#fff}input:focus{outline:2px solid var(--ring);outline-offset:1px}.pass{position:relative}.pass button{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);cursor:pointer;padding:4px}.btn{height:40px;border:0;border-radius:8px;background:var(--primary);color:var(--primary-fg);font:inherit;font-weight:600;cursor:pointer}.btn:disabled{opacity:.6;cursor:wait}.msg{min-height:1.25rem;font-size:.8rem;color:var(--error);text-align:center}