:root{--bg:#F3F5F9;--card:#fff;--ink:#0A1324;--ink2:#3E4A5E;--mute:#738099;--line:#E2E7EF;--blue:#1D4EF5;--blue-d:#0A2B8F;--blue-l:#EAF0FF;--green:#0C8A4F;--green-l:#E5F5EC;--amber:#A35F00;--amber-l:#FFF2DC;--red:#C93636;--red-l:#FDEBEB;--r:16px;--sh:0 1px 2px rgba(10,19,36,.05),0 8px 24px -12px rgba(10,19,36,.12);--disp:'Alexandria','IBM Plex Sans Arabic',sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:manipulation;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;font-size:15.5px;line-height:1.65}
a,button,label,summary,[role=button],[onclick]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
@supports (-webkit-touch-callout:none){input,select,textarea{font-size:max(16px,1em)!important}}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer}
input,select,textarea{font:inherit;color:var(--ink)}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:12px;border:1px solid transparent;background:var(--blue);color:#fff;font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap;transition:background .15s,transform .1s}
.btn:active{transform:scale(.98)}
.btn:hover{background:var(--blue-d)}
.btn.ghost{background:var(--card);color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:#F7F9FC}
.btn.soft{background:var(--blue-l);color:var(--blue-d)}
.btn.soft:hover{background:#DCE6FF}
.btn.dark{background:var(--ink)}
.btn.dark:hover{background:#1C2A44}
.btn.danger{background:var(--red-l);color:var(--red)}
.btn.sm{height:36px;padding:0 14px;font-size:14px;border-radius:10px}
.btn[disabled]{opacity:.45;pointer-events:none}
.ic{width:18px;height:18px;flex:none}
.demo-strip{background:var(--ink);color:#DDE5F5;font-size:13px;text-align:center;padding:7px 16px;line-height:1.5}
.demo-strip b{color:#fff;font-weight:600}
.demo-strip a{color:#9DB6FF;text-decoration:none;margin-inline-start:6px;white-space:nowrap}
.toast{position:fixed;inset-inline:16px;bottom:calc(20px + env(safe-area-inset-bottom));margin:auto;max-width:420px;background:var(--ink);color:#fff;padding:13px 18px;border-radius:14px;font-size:14.5px;box-shadow:0 12px 30px -10px rgba(0,0,0,.4);z-index:90;transform:translateY(150%);transition:transform .25s;text-align:center}
.toast:not(.on){visibility:hidden;transition:transform .25s,visibility 0s .25s}
.toast.on{transform:none}
.toast.err{background:var(--red)}
