:root{--paper:#f3f5f4;--card:#fff;--ink:#16212b;--mute:#52606b;--line:#d3dad9;--teal:#0e7c7b;--teal-d:#0a5f5e;--amber:#b86a00;--amber-bg:#fff4e0;--danger:#b3261e;--r:6px;
--font:"Segoe UI","Noto Sans Arabic","Noto Sans",Tahoma,system-ui,-apple-system,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--font);min-height:100vh;display:flex;flex-direction:column}
main:focus,main:focus-visible{outline:0}
main{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:24px 16px 56px;outline:0}
a{color:var(--teal-d)}
h1{font-size:1.75rem;line-height:1.3;margin:0 0 12px}
h2{font-size:1.2rem;margin:0 0 10px}
h3{font-size:1.05rem;margin:4px 0}
h3 a{color:var(--ink);text-decoration:none}h3 a:hover{text-decoration:underline}
p{margin:0 0 10px}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:8px;top:8px;background:#fff;padding:6px 10px;z-index:99}

#hdr{background:var(--ink);color:#fff}
.bar{max-width:1120px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:700;font-size:1.1rem}
.brand svg{color:#5fd0cd}
#hdr nav{display:flex;gap:4px;flex:1}
#hdr nav a{color:#d9e3e2;text-decoration:none;padding:6px 12px;border-radius:var(--r);border-block-end:2px solid transparent}
#hdr nav a:hover{background:#243342}
#hdr nav a[aria-current]{color:#fff;border-block-end-color:#5fd0cd}
.tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#hdr .btn{background:transparent;color:#fff;border-color:#4a5b6b}
#hdr .btn.primary{background:var(--teal);border-color:var(--teal)}
#hdr .btn:hover{background:#243342}#hdr .btn.primary:hover{background:var(--teal-d)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);font:inherit;font-size:.95rem;text-decoration:none;cursor:pointer;min-height:40px}
.btn:hover{background:#eef2f1}
.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff}.btn.primary:hover{background:var(--teal-d)}
.btn.big{padding:10px 20px;font-weight:600}
.btn.sm{padding:4px 10px;min-height:32px;font-size:.88rem}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.danger-o{color:var(--danger);border-color:#e2b5b2}.btn.danger-o:hover{background:#fdeceb}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.actions.end{justify-content:flex-end;margin-block-start:14px}

.page-h,.sec-h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-block-end:12px}
.sec-h h2{margin:0}
.count{color:var(--mute);margin:8px 0 14px}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-block-end:32px}
.door{display:block;padding:28px 24px;background:var(--ink);color:#fff;text-decoration:none;border-radius:10px;border-inline-start:8px solid #5fd0cd}
.door.alt{border-inline-start-color:#f0a63a}
.door h2{font-size:1.6rem;margin:0 0 6px}.door p{color:#c9d6d5;margin:0 0 14px}
.door strong{display:inline-block;background:#243342;padding:4px 12px;border-radius:99px;font-weight:600}
.door:hover{background:#1e2c39}
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin-block-end:24px}
.stack{display:flex;flex-direction:column;gap:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}

.card,.dl,.panel{background:var(--card);border:1px solid var(--line);border-radius:8px}
.panel{padding:18px;margin-block-end:16px}
.card{overflow:hidden;display:flex;flex-direction:column}
.card .thumb{width:100%;height:160px;object-fit:cover;background:#e5ebea}
.card .body{padding:14px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .actions{margin-block-start:auto;padding-block-start:8px}
.tag{align-self:flex-start;background:#dff1f0;color:var(--teal-d);padding:1px 10px;border-radius:99px;font-size:.82rem;font-weight:600}
.dl{padding:14px 16px;display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;border-inline-start:4px solid #f0a63a}
.dl-main{flex:1;min-width:240px}.dl-act{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.dl-act .big{background:var(--amber);border-color:var(--amber)}.dl-act .big:hover{background:#9b5900}
.chips{list-style:none;display:flex;gap:6px;flex-wrap:wrap;margin:6px 0;padding:0}
.chips li{background:var(--amber-bg);color:#6f4000;padding:0 9px;border-radius:4px;font-size:.84rem;font-weight:600}
.meta{display:flex;gap:6px 18px;flex-wrap:wrap;margin:6px 0;font-size:.86rem;color:var(--mute)}
.meta div{display:flex;gap:5px}.meta dt{font-weight:600}.meta dd{margin:0}
.meta dt::after{content:":"}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-block-end:8px}
.filters input[type=search]{flex:1;min-width:200px}
input,select{font:inherit;padding:8px 10px;border:1px solid #9aa8a7;border-radius:var(--r);background:#fff;color:var(--ink);min-height:40px;max-width:100%}
input:not([type=checkbox]),select{width:100%}
.filters input,.filters select{width:auto}
label{display:block;font-weight:600;margin:12px 0 4px;font-size:.93rem}
.hint{color:var(--mute);font-size:.86rem;margin:4px 0 0}
.row3,.row4{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}.row4{grid-template-columns:repeat(4,1fr);align-items:end}.self-end{align-self:end}
.panel form .btn.primary{margin-block-start:14px}.row4 .btn.primary{margin:0}
.pw{display:flex;gap:8px}.pw .btn{flex:none}

.detail{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:24px;max-width:860px}
.detail .lead{font-size:1.1rem;color:var(--mute)}
.back{display:inline-block;margin-block-end:10px}
.prose{overflow-wrap:anywhere}
.prose img{max-width:100%;height:auto;border-radius:4px;margin:8px 0}
.prose h1,.prose h2,.prose h3{margin:18px 0 8px}
.prose ul,.prose ol{padding-inline-start:1.4em}
.prose blockquote{margin:10px 0;padding:4px 14px;border-inline-start:4px solid var(--line);color:var(--mute)}
.prose pre,.prose code{background:#eef2f1;border-radius:4px;direction:ltr;text-align:left}.prose pre{padding:10px;overflow:auto}
.toolbar{display:flex;gap:6px;flex-wrap:wrap;padding:8px;background:#eef2f1;border:1px solid #9aa8a7;border-block-end:0;border-radius:var(--r) var(--r) 0 0}
.editor{min-height:260px;padding:12px;background:#fff;border:1px solid #9aa8a7;border-radius:0 0 var(--r) var(--r)}

.login{max-width:420px;margin:24px auto}.login h1{text-align:center}.logo-lg{text-align:center;color:var(--teal)}.logo-lg svg{width:48px;height:48px}
.login .big{width:100%;margin-block-start:14px}
.form-err{color:var(--danger);font-weight:600;margin-block-start:10px}
.notice{background:var(--amber-bg);border:1px solid #f0c987;padding:8px 12px;border-radius:var(--r)}

.tabs{display:flex;gap:2px;flex-wrap:wrap;border-block-end:2px solid var(--line);margin-block-end:18px}
.tabs a{padding:8px 14px;text-decoration:none;color:var(--mute);border-block-end:3px solid transparent;margin-block-end:-2px}
.tabs a[aria-current]{color:var(--ink);font-weight:700;border-block-end-color:var(--teal)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 20px}
.stat{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 14px}.stat dt{color:var(--mute);font-size:.88rem}.stat dd{margin:0;font-size:1.7rem;font-weight:700}
.plain{list-style:none;margin:0;padding:0}.plain li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-block-end:1px solid var(--line);flex-wrap:wrap}.plain li:last-child{border:0}
.plain li span:last-child{color:var(--mute);font-size:.88rem}
.tablewrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:8px}
table{width:100%;border-collapse:collapse;min-width:640px}
th,td{padding:9px 12px;text-align:start;border-block-end:1px solid var(--line);vertical-align:middle}
th{background:#eef2f1;font-size:.88rem}tr:last-child td{border:0}
.pill{padding:1px 10px;border-radius:99px;font-size:.82rem;font-weight:600}.pill.on{background:#dff1e4;color:#1d6b35}.pill.off{background:#eee;color:#555}
.pager{display:flex;justify-content:space-between;align-items:center;margin-block-start:20px}
.empty{text-align:center;padding:36px 16px;color:var(--mute);background:#fff;border:1px dashed var(--line);border-radius:8px}
.loading{padding:40px;text-align:center;color:var(--mute)}
footer{text-align:center;color:var(--mute);padding:18px;font-size:.88rem;border-block-start:1px solid var(--line)}

dialog{border:0;border-radius:10px;padding:20px;max-width:440px;width:calc(100% - 32px);box-shadow:0 12px 40px rgba(0,0,0,.3);color:var(--ink)}
dialog::backdrop{background:rgba(10,20,30,.55)}
#toasts{position:fixed;inset-block-end:16px;inset-inline-start:16px;display:flex;flex-direction:column;gap:8px;z-index:50}
.toast{background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r);border-inline-start:4px solid #5fd0cd;max-width:340px}.toast.err{border-inline-start-color:#ff8a80}

@media (max-width:760px){.doors,.split,.row3,.row4{grid-template-columns:1fr}.bar{gap:10px}#hdr nav{order:3;flex-basis:100%}h1{font-size:1.4rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}