:root{--brand:#5c3cfc;--bg:#f8f9fc;--surface:#fff;--fg:#0f172a;--muted:#64748b;--line:#e7e9f2;--bad:#dc2626;--bad-bg:#fee2e2;--ok:#15803d;--ok-bg:#dcfce7;--soft:#efebff}
@media (prefers-color-scheme:dark){:root{--brand:#7b62ff;--bg:#0f1121;--surface:#171a2d;--fg:#e8eaf6;--muted:#9aa0bf;--line:#2a2e48;--bad:#f87171;--bad-bg:#3a1618;--ok:#4ade80;--ok-bg:#123220;--soft:#262047}}
*{box-sizing:border-box}html,body{margin:0;min-height:100%}
body{background:radial-gradient(1000px 420px at 85% -10%,var(--soft),transparent),var(--bg);color:var(--fg);font-family:"IBM Plex Sans Arabic",system-ui,"Segoe UI",Tahoma,sans-serif;font-size:15px;line-height:1.6}
.wrap{min-height:100vh;display:grid;align-content:center;gap:18px;width:min(440px,100% - 32px);margin:0 auto;padding:28px 0}
.logo{display:flex;align-items:center;gap:14px}
.logo b{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#7b62ff,#4327e6);color:#fff;font-size:18px}
.logo h1{margin:0;font-size:22px}.logo p{margin:2px 0 0;color:var(--muted);font-size:13px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:0 1px 2px rgba(18,20,33,.04),0 14px 34px rgba(18,20,33,.08);display:flex;flex-direction:column;gap:14px}
.card h2{margin:0;font-size:19px}.card p{margin:0;color:var(--muted)}
label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px}
input{width:100%;border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:12px;padding:11px 13px;font:inherit}
input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--soft)}
.btn{width:100%;border:0;background:var(--brand);color:#fff;font:inherit;font-weight:700;padding:12px;border-radius:12px;cursor:pointer}
.btn:hover{filter:brightness(1.08)}
.link{background:none;border:0;color:var(--brand);font:inherit;font-weight:600;cursor:pointer;padding:0;text-decoration:none;text-align:center}
.msg{border-radius:12px;padding:10px 14px;font-weight:500}.msg.bad{background:var(--bad-bg);color:var(--bad)}.msg.ok{background:var(--ok-bg);color:var(--ok)}
.foot{text-align:center;color:var(--muted);font-size:12px;margin:0}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px}
.hint{font-size:12.5px;color:var(--muted)}
.pw{position:relative}.pw input{padding-inline-end:64px}.pw button{position:absolute;inset-inline-end:8px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--brand);font:inherit;font-weight:600;cursor:pointer;padding:6px}

.logo.imglogo{flex-direction:column;align-items:flex-start;gap:6px}.logo.imglogo img{max-width:260px;max-height:90px;object-fit:contain}