:root{--bg:#f3f5fa;--card:#fff;--text:#1d2433;--muted:#6b7488;--pri:#2f5bea;--pri2:#1f43b8;--line:#e3e7f0;--ok:#188a52;--err:#c92a3a}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Cairo',Tahoma,Arial,sans-serif;line-height:1.7;min-height:100vh}
.card{background:var(--card);max-width:420px;width:calc(100% - 32px);margin:24px auto;padding:32px 28px;border-radius:18px;box-shadow:0 10px 40px rgba(30,50,110,.1);text-align:center}
.logo{font-size:44px}
h1{margin:.2em 0 .4em;font-size:1.5rem}h2{margin:0 0 14px;font-size:1.15rem}
.muted{color:var(--muted)}
label{display:block;text-align:start;font-weight:600;margin:12px 0 4px;font-size:.92rem}
input{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;font:inherit;background:#fff}
input:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px rgba(47,91,234,.15)}
input[type=file]{padding:7px}
.btn{display:inline-block;background:var(--pri);color:#fff;border:0;padding:10px 22px;border-radius:10px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;margin-top:16px;transition:.15s}
.btn:hover{background:var(--pri2)}
.btn.ghost{background:#e8edfb;color:var(--pri)}.btn.ghost:hover{background:#d9e1f8}
.btn.danger{background:#fde8ea;color:var(--err)}.btn.danger:hover{background:#fbd3d7}
.btn.sm{padding:4px 12px;margin:0;font-size:.85rem}
.link{display:block;margin-top:18px;color:var(--muted);font-size:.9rem}
.alert{padding:10px 14px;border-radius:10px;margin:14px 0;background:#fff6e0;color:#8a6100}
.alert.err{background:#fde8ea;color:var(--err)}.alert.ok{background:#e3f6ec;color:var(--ok)}
.info{background:#f3f6fe;border-radius:12px;padding:14px;margin:14px 0;display:flex;flex-direction:column}
.info span{color:var(--muted);font-size:.9rem}
.wrap{max-width:1000px;margin:0 auto;padding:20px 16px 50px}
.bar{display:flex;justify-content:space-between;align-items:center}
.bar .link{margin:0}
.panel{background:var(--card);border-radius:16px;padding:22px;margin:16px 0;box-shadow:0 4px 18px rgba(30,50,110,.06)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 16px;align-items:end}
.actions{display:flex;gap:8px}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.row input{width:220px}
.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:640px}
th,td{padding:10px;border-bottom:1px solid var(--line);text-align:start;vertical-align:middle}
th{background:#f6f8fd;font-size:.88rem;color:var(--muted)}
.inline{display:inline}
.acts{white-space:nowrap}
.tag{font-size:.8rem;padding:2px 10px;border-radius:20px;margin-inline-end:6px}
.tag.ok{background:#e3f6ec;color:var(--ok)}.tag.no{background:#f0f1f5;color:var(--muted)}

/* ===== واجهة الأستاذ: تحسينات الهاتف ===== */
main.card .btn{width:100%;min-height:50px;font-size:1.05rem;display:flex;align-items:center;justify-content:center;gap:8px}
main.card input{min-height:50px;font-size:16px;text-align:center;letter-spacing:.05em}
main.card .link{padding:12px;min-height:44px}
input,button{-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.98)}
@media (max-width:480px){
  body{background:#fff}
  body>main.card{margin:0;width:100%;max-width:none;border-radius:0;box-shadow:none;
    padding:24px 20px calc(24px + env(safe-area-inset-bottom)) 20px}
  .logo{font-size:56px}
  h1{font-size:1.35rem}
  .info{padding:16px;margin:18px 0;text-align:start}
  .info b{font-size:1.1rem}
}
.sub{margin:0 0 14px;font-size:1.1rem;font-weight:600;color:var(--pri)}

/* صفحات الدخول: توسيط بدون تمرير */
body:has(>main.card){display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;overflow-x:hidden}
body:has(>main.card)>main.card{margin:0 auto}

/* ===== تصميم لوحة الإدارة ===== */
.top{background:linear-gradient(135deg,#1f43b8,#2f5bea 60%,#4f7bff);color:#fff;padding:18px 16px 70px}
.top-in{max-width:1000px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.top h1{font-size:1.3rem;margin:0}.top span{opacity:.85;font-size:.9rem}
.top-act{display:flex;gap:8px}
.btn.light{background:rgba(255,255,255,.18);color:#fff}.btn.light:hover{background:rgba(255,255,255,.3)}
.top ~ .wrap{margin-top:-52px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat{background:#fff;border-radius:14px;padding:14px 16px;box-shadow:0 4px 18px rgba(30,50,110,.08);display:flex;flex-direction:column;border-inline-start:4px solid var(--pri)}
.stat b{font-size:1.7rem;line-height:1.2}.stat span{color:var(--muted);font-size:.85rem}
.stat.good{border-color:var(--ok)}.stat.good b{color:var(--ok)}
.stat.warn{border-color:#e0900b}.stat.warn b{color:#c47a00}
.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.search{flex:1;min-width:200px}.search input{border-radius:30px;padding:9px 16px;background:#f6f8fd}
.chips{display:flex;gap:6px}
.chip{padding:6px 14px;border-radius:30px;background:#f0f2f8;color:var(--muted);text-decoration:none;font-size:.88rem;font-weight:600}
.chip.on{background:var(--pri);color:#fff}
.btn.add{background:var(--ok);padding:8px 18px;font-size:.95rem}.btn.add:hover{background:#12703f}
.who{display:flex;align-items:center;gap:10px}
.av{width:36px;height:36px;border-radius:50%;background:#e8edfb;color:var(--pri);display:grid;place-items:center;font-weight:700;flex:none}
.mono{font-variant-numeric:tabular-nums;text-align:start}
tr:hover td{background:#fafbfe}
.empty{text-align:center;color:var(--muted);padding:36px 10px}
a.tag{text-decoration:none}
.acts{display:flex;gap:6px;align-items:center;border-bottom:0}
td.acts{display:table-cell;white-space:nowrap}
.alert{font-weight:600}
/* النوافذ */
dialog{border:0;border-radius:18px;padding:0;width:min(520px,calc(100% - 24px));box-shadow:0 20px 60px rgba(20,30,70,.35);color:var(--text);font-family:inherit}
dialog::backdrop{background:rgba(20,30,60,.5);backdrop-filter:blur(2px)}
.dlg{padding:22px}
.dlg-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.dlg-h h2{margin:0}
.x{border:0;background:#f0f2f8;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:1rem}
.dlg textarea{width:100%;padding:12px;border:1.5px solid var(--line);border-radius:12px;font:inherit;line-height:1.9;resize:vertical;min-height:170px}
.dlg textarea:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px rgba(47,91,234,.15)}
.dlg code{background:#eef1fa;padding:1px 8px;border-radius:6px;font-size:.88rem}
.cnt{margin-top:8px;font-size:.9rem;color:var(--ok);font-weight:600;min-height:1.6em}
.dlg-f{display:flex;gap:8px;margin-top:6px}
.dlg-f .btn{flex:1}
@media (max-width:640px){.stats{gap:8px}.stat{padding:10px 12px}.stat b{font-size:1.35rem}.stat span{font-size:.75rem}}
.alert.fix{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.alert.fix .btn{background:#c47a00}

/* ===== متابعة الاطلاع ===== */
.stats{grid-template-columns:repeat(4,1fr)}
.stat.seen{border-color:#7a3fd0}.stat.seen b{color:#7a3fd0}
.stat.unseen{border-color:#c92a3a}.stat.unseen b{color:var(--err)}
.tag.seen{background:#efe6fb;color:#6a2fc0}
.tag.unseen{background:#fde8ea;color:var(--err)}
.mini{border:0;background:#f0f2f8;border-radius:50%;width:24px;height:24px;cursor:pointer;color:var(--muted);font-size:.9rem;line-height:1}
.mini:hover{background:#e0e4f0;color:var(--text)}
.sub2{font-size:.76rem;color:var(--muted);margin-top:3px}
@media (max-width:640px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ===== عرض 90% ===== */
.wrap,.top-in{width:90%;max-width:none}
.stats{grid-template-columns:repeat(5,1fr)}
.tag,th,td.acts,.mono{white-space:nowrap}
@media (max-width:900px){.stats{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.wrap,.top-in{width:96%}.stats{grid-template-columns:repeat(2,1fr)}.stats .stat:last-child{grid-column:1/-1}}
