
@font-face{font-family:'Plex';font-weight:400;font-display:swap;src:url(/fonts/plex-ar-arabic-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:'Plex';font-weight:400;font-display:swap;src:url(/fonts/plex-ar-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:'Plex';font-weight:700;font-display:swap;src:url(/fonts/plex-ar-arabic-700.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:'Plex';font-weight:700;font-display:swap;src:url(/fonts/plex-ar-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
:root{--p9:#24093f;--p8:#3b1366;--p7:#4f1d86;--p6:#6a2fb0;--p5:#8650d6;--p3:#c9b3f0;--p2:#e7dcfa;--p1:#f4effc;--bg:#faf8fd;--card:#fff;--ink:#1f1530;--ink2:#4a4060;--mut:#756c88;--line:#e8e2f1;--acc:var(--p6);--acc2:#e7dcfa;--ok:#1f8a5b;--warn:#b7791f;--r:14px;--sh:0 1px 2px rgba(36,9,63,.06),0 6px 24px rgba(36,9,63,.07);--grad:linear-gradient(135deg,#3b1366,#7a3fd0);--ui:'Plex',system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.6 var(--ui);color:var(--ink);background:var(--bg);-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--p6)}
.ic{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
.ic.sm{width:16px;height:16px}.ic.lg{width:24px;height:24px}
[dir=rtl] .flip{transform:scaleX(-1)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s,transform .05s}
.btn:hover{border-color:var(--p3);background:var(--p1)}.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 4px 14px rgba(106,47,176,.28)}.btn.primary:hover{filter:brightness(1.07)}
.btn.soft{background:var(--p1);border-color:var(--p2);color:var(--p8)}
.btn.ghost{background:transparent;border-color:transparent}.btn.ghost:hover{background:var(--p1)}
.btn.icon{width:40px;padding:0}.btn.sm{min-height:32px;padding:0 10px;font-size:13px;border-radius:10px}.btn.icon.sm{width:32px}
.btn.wide{width:100%}.btn:disabled{opacity:.55;cursor:not-allowed}
.fld{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:var(--ink2);margin-bottom:12px}
.inp,.fld input,.fld select,.fld textarea{width:100%;min-height:42px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:8px 12px;font-weight:400;font-size:15px;outline:none}
.inp:focus,.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--p5);box-shadow:0 0 0 3px var(--p2)}
textarea.inp,.fld textarea{min-height:90px;resize:vertical}
.muted{color:var(--mut)}.small{font-size:13px}.tiny{font-size:12px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;background:var(--p1);color:var(--p8);font-size:12px;font-weight:700}
.chip.ok{background:#e3f5ec;color:var(--ok)}.chip.warn{background:#fdf1dc;color:#8a5a12}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.note{padding:10px 12px;border-radius:12px;background:var(--p1);color:var(--p8);font-size:14px}
.note.warn{background:#fdf1dc;color:#7a4e0e}
.toast{position:fixed;inset-inline:0;bottom:22px;margin:auto;width:max-content;max-width:calc(100vw - 32px);background:var(--p9);color:#fff;padding:10px 16px;border-radius:12px;font-size:14px;z-index:999;opacity:0;transform:translateY(10px);transition:.2s;pointer-events:none}
.toast.on{opacity:1;transform:none}
.dlg-back{position:fixed;inset:0;background:rgba(36,9,63,.36);display:flex;align-items:center;justify-content:center;z-index:900;padding:16px;animation:fade .15s}
.dlg{background:#fff;border-radius:18px;box-shadow:0 20px 60px rgba(36,9,63,.3);width:min(480px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:20px}
.dlg.wide{width:min(720px,100%)}
.dlg h2{margin:0 0 12px;font-size:19px}.dlg .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.dlg .x{float:inline-end;margin:-6px -6px 0 0}
@media (max-width:600px){.dlg-back{align-items:flex-end;padding:0}.dlg{border-radius:20px 20px 0 0;width:100%;max-height:92dvh;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}}
@keyframes fade{from{opacity:0}}
.menu{position:fixed;z-index:950;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 40px rgba(36,9,63,.18);padding:6px;min-width:200px}
.menu button{display:flex;width:100%;align-items:center;gap:10px;padding:9px 12px;border:0;background:none;border-radius:9px;cursor:pointer;text-align:start;font-size:14px}
.menu button:hover{background:var(--p1)}
.av{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;color:#fff;background:var(--grad);flex:none;font-size:14px}
.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.sample{display:inline-flex;align-items:center;gap:6px;background:#fdf1dc;color:#7a4e0e;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:700}
.wal-pk{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.wal-pk button{border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px;text-align:start;cursor:pointer}
.wal-pk button:hover{border-color:var(--p5);background:var(--p1)}
.ai-out h3{font-size:16px;margin:14px 0 6px}.ai-out ul,.ai-out ol{padding-inline-start:20px;margin:6px 0}.ai-out p{margin:6px 0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--p5);outline-offset:2px}

[hidden]{display:none!important}
