@import url('https://fonts.googleapis.com/css2?family=Lalezar&family=Tajawal:wght@500;700;800&family=Montserrat:wght@600;700;800&display=swap');

:root{
  --p:#470D43; --p2:#5E1A55; --pd:#2E0828; --c:#FAF3E0; --c2:#F1E6CF; --o:#E39A2E; --l:#D9BCDB;
  --ok:#2F7D4F; --bad:#B23A3A; --muted:#8a6a86;
  --r:22px;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--c);color:var(--p);font-family:'Tajawal',system-ui,sans-serif}
body{min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}
.lal{font-family:'Lalezar','Tajawal',sans-serif;font-weight:400}
.mon{font-family:'Montserrat',sans-serif}
.hidden{display:none !important}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 26px;border-radius:999px;border:0;background:var(--p);color:var(--c);font-weight:800;font-size:18px;cursor:pointer;text-decoration:none;transition:transform .12s ease,opacity .12s}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--p);border:2px solid var(--p)}
.btn.orange{background:var(--o);color:var(--p)}
.btn.small{min-height:44px;padding:8px 18px;font-size:16px}
.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--o);outline-offset:3px}

.field{display:flex;flex-direction:column;gap:6px}
.field label{font-weight:800;font-size:15px}
.field input,.field select,.field textarea{min-height:50px;border:2px solid #e3d6bf;border-radius:16px;background:#fff;padding:10px 14px;font-size:17px}
.field textarea{min-height:80px;resize:vertical}

.card{background:#fff;border-radius:var(--r);box-shadow:0 8px 24px rgba(71,13,67,.08)}
.err{color:var(--bad);font-weight:700;font-size:15px;min-height:20px}

.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:var(--p);color:var(--c)}
.topbar img{height:44px;width:auto}
.topbar .who{font-size:14px;opacity:.85}

.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:var(--p)}
.login{width:100%;max-width:400px;padding:30px 26px;display:flex;flex-direction:column;gap:16px}
.login img{width:180px;margin:0 auto 4px;display:block}
.login h1{margin:0;text-align:center;font-size:30px}
.login .switch{background:none;border:0;color:var(--p);text-decoration:underline;cursor:pointer;font-weight:700;min-height:44px}