/* ============================================================
   ريفاي فلو — نظام التصميم
   لون واحد (بنفسجي ريف فاليو) + ألوان الحالات فقط · فاتح · Cairo · RTL أولاً
   الهيكل: قائمة جانبية يمين (سطح المكتب) / شريط سفلي (جوال)
   ============================================================ */
:root{
  --accent:#5400A8; --accent-2:#6b14c9; --accent-soft:#f0e8fb; --accent-ink:#3d007a;
  --gold:#A89048; --gold-soft:#f7f1de;
  --bg:#f4f5f8; --card:#fff; --line:#e9eaef; --field:#f6f6f9; --hover:#f8f6fc;
  --ink:#2a2438; --muted:#8b8698; --faint:#b9b5c4;
  --red:#d94a4a; --red-soft:#fbeaea; --amber:#c98a12; --amber-soft:#fcf2dc;
  --green:#2c9e63; --green-soft:#e5f4ec; --blue:#3d7fd9; --blue-soft:#e9f1fc;
  --r:12px; --r-lg:16px; --shadow:0 2px 10px rgba(42,36,56,.05); --shadow-lg:0 12px 40px rgba(42,36,56,.16);
  --sidebar:236px; --topbar:60px; --bottomnav:62px;
}
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.7 Cairo,system-ui,sans-serif;min-height:100vh}
a{color:var(--accent);text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:#fff;outline:0;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea{min-height:90px;resize:vertical}
label{display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:4px}
.field{margin-bottom:12px}
.row{display:flex;gap:12px;flex-wrap:wrap} .row>.field{flex:1;min-width:180px}
::placeholder{color:var(--faint)}
[hidden]{display:none!important}
svg.ic{width:18px;height:18px;flex:none;vertical-align:-4px}

/* ---- الأزرار ---- */
.btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:10px;padding:8px 16px;font-weight:700;cursor:pointer;background:var(--accent);color:#fff;white-space:nowrap;transition:filter .15s,transform .05s}
.btn:hover{filter:brightness(1.08)} .btn:active{transform:translateY(1px)}
.btn.ghost{background:var(--accent-soft);color:var(--accent)}
.btn.light{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.danger{background:var(--red-soft);color:var(--red)}
.btn.sm{padding:5px 11px;font-size:13px;border-radius:8px}
.btn.icon{padding:7px;border-radius:9px}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ---- الهيكل ---- */
.app{display:grid;grid-template-columns:var(--sidebar) 1fr;min-height:100vh}
.sidebar{background:#fff;border-left:1px solid var(--line);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:16px 12px}
.brand{display:flex;align-items:center;gap:10px;padding:6px 8px 16px}
.brand .logo{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px}
.brand .logo img{width:36px;height:36px;border-radius:11px;object-fit:cover}
.brand b{display:block;font-size:16px;line-height:1.2} .brand small{color:var(--muted);font-size:12px}
.nav{display:flex;flex-direction:column;gap:2px;flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;margin:0 -4px;padding:0 4px}
.nav .sec{font-size:11px;color:var(--faint);font-weight:700;letter-spacing:.5px;padding:12px 10px 4px}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;color:var(--ink);font-weight:600;font-size:14px}
.nav a:hover{background:var(--hover)} .nav a.on{background:var(--accent-soft);color:var(--accent)}
.nav a .cnt{margin-inline-start:auto;background:var(--red);color:#fff;border-radius:999px;font-size:11px;padding:0 7px;min-width:20px;text-align:center}
.nav a.soon{opacity:.45;pointer-events:none} .nav a.soon .cnt{background:var(--line);color:var(--muted)}
/* مجموعات قابلة للطي + أقسام فرعية */
.nav .grp .ghead{cursor:pointer;user-select:none}
.nav .grp .ghead .chev{margin-inline-start:auto;display:inline-flex;color:var(--faint);transition:transform .18s;transform:rotate(90deg)}
html[dir="ltr"] .nav .grp .ghead .chev{transform:rotate(-90deg)}
.nav .grp .ghead .cnt{margin-inline-start:auto} .nav .grp .ghead .cnt + .chev{margin-inline-start:6px}
.nav .grp.open .ghead .chev{transform:none!important}
.nav .grp.has-on > .ghead{color:var(--accent)}
.nav .grp .sub{display:none;flex-direction:column;gap:1px;margin:2px 0 6px;margin-inline-start:21px;padding-inline-start:10px;border-inline-start:1.5px solid var(--line)}
.nav .grp.open .sub{display:flex}
.nav .sub a{padding:6px 10px;font-size:13px;font-weight:600;color:var(--muted);gap:8px}
.nav .sub a::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.45;flex:none}
.nav .sub a.on{background:var(--accent-soft);color:var(--accent)} .nav .sub a.on::before{opacity:1}
/* زر الطي: دائرة خفيفة على حافة القائمة في منتصفها — يظهر أوضح عند التحويم */
.sidebar .collapse{position:absolute;top:50%;inset-inline-end:-13px;width:26px;height:26px;margin:-13px 0 0;padding:0;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:0 2px 10px rgba(42,36,56,.10);display:grid;place-items:center;cursor:pointer;color:var(--muted);opacity:.55;z-index:40;transition:opacity .2s,color .2s,box-shadow .2s,transform .2s}
.sidebar:hover .collapse,.sidebar .collapse:focus-visible{opacity:1}
.sidebar .collapse:hover{color:var(--accent);box-shadow:0 4px 14px rgba(84,0,168,.22);transform:scale(1.08)}
.sidebar .collapse svg{transition:transform .32s cubic-bezier(.4,0,.2,1)}
html[dir="ltr"] .sidebar .collapse svg{transform:rotate(180deg)}
.app{transition:grid-template-columns .32s cubic-bezier(.4,0,.2,1)}
.app.navanim .sidebar .nav a > span:not(.cnt),.app.navanim .sidebar .ghead > span:not(.cnt),.app.navanim .brand .wm{animation:navfade .32s ease}
@keyframes navfade{from{opacity:0}to{opacity:1}}
.sidebar .foot{font-size:11.5px;color:var(--faint);padding:10px 8px 0}
.main{display:flex;flex-direction:column;min-height:100vh} .main .content{flex:1}
.app-footer{text-align:center;border-top:1px solid var(--line);margin:24px 22px 0;padding:22px 12px 26px;max-width:1236px}
.app-footer .fl-brand{display:inline-block;text-decoration:none;margin-bottom:8px} .app-footer .fl-logo{height:34px;object-fit:contain;opacity:.9}
.app-footer .fl-wm{display:inline-flex;align-items:center;gap:8px} .app-footer .fl-wm img{height:22px;opacity:.9}
.app-footer .fl-name{margin:0 0 4px;font-size:13px;font-weight:700;color:var(--ink)} .app-footer .fl-name span{color:var(--accent)}
.app-footer .fl-small{margin:3px 0;font-size:11.5px;color:var(--muted)} .app-footer .fl-small a{color:var(--muted);text-decoration:none} .app-footer .fl-small a:hover{color:var(--accent)}
.app-footer .fl-powered{opacity:.6;margin-top:8px}
.app-footer .fl-note{margin-top:6px}
.fprev .app-footer{margin:0;border-top:0;padding:10px 0;background:var(--bg);border-radius:12px}
.topbar .iconbtn.lang{font-weight:800;font-size:12px;letter-spacing:.5px;width:auto;padding:0 10px;border:1px solid var(--line);border-radius:999px;color:var(--accent)}
/* وضع الأيقونات فقط (طيّ القائمة): الأقسام الفرعية تظهر كقائمة منبثقة عند التحويم */
.app.mini{--sidebar:72px}
.mini .sidebar{padding:16px 10px}
.mini .brand{justify-content:center;padding:6px 0 14px} .mini .brand > div:last-child{display:none}
.mini .nav{overflow-y:auto;overflow-x:hidden;scrollbar-width:none;margin:0;padding:0} .mini .nav::-webkit-scrollbar{display:none}
.mini .nav .sec{display:none}
.mini .nav > a,.mini .nav .ghead{justify-content:center;padding:10px 0;position:relative}
.mini .nav > a > span:not(.cnt),.mini .ghead > span:not(.cnt){display:none}
.mini .nav .cnt{position:absolute;top:2px;inset-inline-start:8px;font-size:10px;min-width:16px;padding:0 4px}
.mini .ghead .chev{display:none!important}
.mini .grp{position:relative}
.mini .grp .sub{display:none;position:absolute;top:0;inset-inline-end:100%;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);min-width:200px;padding:6px;margin:0;z-index:60}
.mini .grp .sub::before{content:attr(data-label);display:block;font-weight:800;font-size:13px;padding:6px 10px 4px;color:var(--ink)}
.mini .grp .sub a span{display:inline}
.mini .sidebar .collapse svg{transform:rotate(180deg)} html[dir="ltr"] .mini .sidebar .collapse svg{transform:none}
.navfly{position:fixed;z-index:300;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 34px rgba(42,36,56,.16);min-width:190px;padding:6px;display:none;flex-direction:column;gap:1px;opacity:0;transform:translateX(6px);transition:opacity .14s,transform .14s}
html[dir="ltr"] .navfly{transform:translateX(-6px)}
.navfly.show{display:flex;opacity:1;transform:none}
.navfly .fh{font-weight:800;font-size:13px;padding:6px 10px 4px;color:var(--ink)}
.navfly a{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;color:var(--muted);font-weight:600;font-size:13px;text-decoration:none}
.navfly a::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.45;flex:none}
.navfly a.solo{color:var(--ink);font-weight:700} .navfly a.solo::before{display:none}
.navfly a:hover{background:var(--hover);color:var(--accent)} .navfly a.on{background:var(--accent-soft);color:var(--accent)}
.navfly a .cnt{margin-inline-start:auto;background:var(--red);color:#fff;border-radius:999px;font-size:11px;padding:0 7px}
.mini .sidebar .foot{display:none}
/* عمود الإجراءات (Paces) · مكدّس الصور · الشعار · مبدّل القسم · الأدوار · لوحة المشاريع */
.actbar{display:inline-flex;gap:4px} .act{width:30px;height:30px;border:1px solid var(--line);border-radius:8px;display:inline-grid;place-items:center;color:var(--muted);background:#fff;cursor:pointer;padding:0;transition:.12s} .act:hover{color:var(--accent);border-color:var(--accent)} .act.danger:hover{color:var(--red);border-color:var(--red)} th.acts,td.acts{white-space:nowrap;text-align:end;width:1%}
.avstack{display:inline-flex;align-items:center} .avstack > *{margin-inline-start:-8px;box-shadow:0 0 0 2px #fff;border-radius:50%} .avstack > *:first-child{margin-inline-start:0} .avstack .avmore{width:28px;height:28px;display:inline-grid;place-items:center;background:var(--accent);color:#fff;font-size:11px;font-weight:800}
.brand .wm{display:flex;flex-direction:column;gap:2px;min-width:0} .brand .wmrow{display:flex;align-items:center;gap:8px} .brand .wordmark{height:22px;width:auto} .chip.flow{background:var(--accent);color:#fff;font-weight:800;font-size:11px;padding:1px 9px;border-radius:999px;letter-spacing:.5px;line-height:18px} .brand .logo.mini-only{display:none}
.mini .brand .wm{display:none} .mini .brand .logo.mini-only{display:grid}
.deptsw{display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:0 4px 0 12px;height:38px;border:1px solid transparent} .deptsw:hover{border-color:var(--accent)} .deptsw .dot{width:10px;height:10px;border-radius:50%;flex:none} .deptsw select.dept{border:0;background:transparent;color:var(--accent);font-weight:700;height:36px;padding:0 28px 0 8px;margin:0;box-shadow:none;min-width:120px;width:auto}
.role-card .ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff;flex:none} .role-card .plist{list-style:none;padding:0;margin:12px 0 8px} .role-card .plist li{display:flex;gap:8px;align-items:center;padding:3px 0;font-size:13.5px} .role-card .plist li svg{color:var(--green);flex:none}
.permgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px} .permgrid label{display:flex;gap:8px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:13.5px} .permgrid label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)} .permgrid label input{width:16px;height:16px;margin:0;flex:none}
.dash{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .dash .card{margin:0;min-width:0} .rings{display:flex;gap:16px;align-items:center;flex-wrap:wrap} .legend{display:flex;flex-direction:column;gap:6px;font-size:13.5px} .legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-inline-end:6px} .bars{display:flex;flex-direction:column;gap:8px} .bars .row{display:grid;grid-template-columns:90px 1fr 40px;gap:8px;align-items:center;font-size:13px}
.grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:900px){.dash{grid-template-columns:1fr} .grid.c2{grid-template-columns:1fr}}
/* قائمة مسطّحة · بلاطات الالتقاط · أدوات التصدير */
.mtime{display:flex;flex-direction:column;align-items:center;min-width:54px;padding:2px 8px;border-inline-end:2px solid var(--accent-soft)} .mtime b{font-size:15px;color:var(--accent)} .mtime .meta{font-size:11px}
.joinbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding:12px;background:var(--accent-soft);border-radius:12px}
.invitees{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px;max-height:200px;overflow:auto} .invitees label{display:flex;gap:6px;align-items:center;padding:6px 8px;border:1px solid var(--line);border-radius:9px;cursor:pointer;font-size:13.5px} .invitees label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)} .invitees input{width:15px;height:15px;margin:0}
.envbar{background:#fbbf24;color:#2a1a00;text-align:center;font-weight:800;font-size:12.5px;padding:5px 10px;display:flex;gap:6px;justify-content:center;align-items:center}
details.more{margin:6px 0 2px;border-top:1px dashed var(--line);padding-top:8px} details.more summary{cursor:pointer;color:var(--accent);font-weight:700;font-size:13.5px;margin-bottom:6px;list-style:none} details.more summary::before{content:'+ '} details.more[open] summary::before{content:'− '}
.nav .navdiv{height:1px;background:var(--line);margin:8px 12px}
.mtiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px} .mtile{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:12px;display:flex;align-items:center;gap:10px;border:2px solid transparent;cursor:pointer;text-align:start;font-family:inherit} .mtile.on{border-color:var(--accent)} .mtile .lbl{font-weight:800;flex:1;font-size:14px} .mtile .cnt{font-size:12px;font-weight:800;color:var(--muted);background:var(--bg);border-radius:999px;padding:2px 9px} .mtile .cnt.hot{background:var(--red-soft);color:var(--red)}
.icontile{width:36px;height:36px;min-width:36px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent)} .icontile.idea{background:var(--amber-soft);color:var(--amber)} .icontile.note{background:var(--blue-soft);color:var(--blue)} .icontile.moved{background:var(--green-soft);color:var(--green)}
.card.cap{border-inline-start:4px solid var(--accent)} .mitem{gap:12px}
.tbl{position:relative} .tbltools{display:flex;gap:4px;justify-content:flex-end;padding:8px 10px 0} .tbltools .act{width:auto;padding:0 10px;gap:4px;font-size:11.5px;font-weight:700} .tbltools .act span{margin-inline-start:2px}
@media (max-width:900px){ .mtiles{grid-template-columns:repeat(2,1fr)} }
/* اليوم (صفحة البداية) · أنا · بصمة الوجه */
.home .hero{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;padding:20px 22px} .home .hero h1{margin:2px 0 0;font-size:22px;color:#fff} .home .hero .meta{color:rgba(255,255,255,.82)} .home .hero .clock{text-align:center;min-width:200px} .home .big{font-size:36px;font-weight:800;line-height:1.1;margin-bottom:4px} .home .big small{font-size:14px;font-weight:600}
.btn.xl{font-size:16px;padding:12px 24px;border-radius:14px;min-height:48px} .hero .btn.xl{background:#fff;color:var(--accent);box-shadow:0 6px 18px rgba(0,0,0,.15)} .hero .btn.xl.ghost{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.6);box-shadow:none;margin-top:8px}
.hgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px} .hgrid > .card{margin:0} .hgrid .card + .card,.hgrid #dailyCard + .card{margin-top:14px} .hh{display:flex;align-items:center;gap:8px} .hh .meta{margin-inline-start:auto;font-weight:600} .empty.small{padding:14px;font-size:13px}
.tile-link{display:flex;gap:12px;align-items:center;margin:0;color:inherit} .tile-link:hover{box-shadow:var(--shadow-lg)} .tile-link .ico{width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.facebox{position:relative;width:min(100%,340px);aspect-ratio:1;margin:0 auto;border-radius:50%;overflow:hidden;background:#111} .facebox video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)} .facebox .ring{position:absolute;inset:0;border-radius:50%;border:5px solid rgba(255,255,255,.55);transition:.2s;pointer-events:none} .facebox .ring.ok{border-color:var(--green);box-shadow:0 0 0 4px rgba(22,163,74,.25) inset}
/* زر المتابعة · قوائم اختيار البطاقة */
.btn.fol.on{background:var(--gold-soft);color:var(--gold);border-color:var(--gold)}
.toolbar select.pick{max-width:280px}
.crumbs select.inline{display:inline-block;width:auto;max-width:320px;padding:2px 26px 2px 8px;font-size:13px;height:auto;vertical-align:middle}

.main{min-width:0;display:flex;flex-direction:column}
.topbar{height:var(--topbar);background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 20px;position:sticky;top:0;z-index:20}
.topbar .search{flex:1;max-width:380px;position:relative}
.topbar .search input{padding-inline-start:36px;background:var(--field);border-color:transparent}
.topbar .search svg{position:absolute;inset-inline-start:11px;top:11px;color:var(--faint)}
.topbar .dept{max-width:220px;background:var(--field);border-color:transparent;font-weight:700;padding:7px 12px}
.topbar .spacer{flex:1}
.iconbtn{position:relative;border:0;background:transparent;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.iconbtn:hover{background:var(--hover);color:var(--ink)}
.iconbtn .dot{position:absolute;top:6px;inset-inline-end:6px;background:var(--red);color:#fff;font-size:10px;border-radius:999px;padding:0 5px;min-width:17px;line-height:17px;text-align:center}
.userchip{display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 6px;border-radius:10px}
.userchip:hover{background:var(--hover)}
.userchip .n{font-weight:700;font-size:13px;line-height:1.2;white-space:nowrap} .userchip .r{font-size:11.5px;color:var(--muted);white-space:nowrap;max-width:160px;overflow:hidden;text-overflow:ellipsis}
.content{padding:20px 22px 40px;max-width:1280px;width:100%}
.bottomnav{display:none}

/* ---- رأس الصفحة ---- */
.page-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.page-head h1{margin:0;font-size:20px;font-weight:800}
.page-head .sub{color:var(--muted);font-size:13px}
.page-head .actions{display:flex;gap:8px;flex-wrap:wrap}
.crumbs{font-size:12.5px;color:var(--muted)} .crumbs a{color:var(--muted)}

/* ---- البطاقات والشبكات ---- */
.card{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:16px 18px}
.card+.card{margin-top:14px}
.card h3{margin:0 0 10px;font-size:15px;font-weight:800}
.grid{display:grid;gap:14px} .grid.c2{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))} .grid.c3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.tile{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:12px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;border:2px solid transparent}
.tile.on{border-color:var(--accent)}
a.tile{color:inherit;text-decoration:none} .tile{position:relative;transition:box-shadow .15s,transform .15s,border-color .15s} .tile.static{cursor:default}
.tile.go:hover{box-shadow:var(--shadow-lg,0 8px 24px rgba(42,36,56,.12));transform:translateY(-2px)} .tile.go:hover b{color:var(--accent)}
.tile .tgo{position:absolute;top:10px;inset-inline-end:10px;color:var(--faint);opacity:0;transition:opacity .15s} .tile.go:hover .tgo{opacity:1}
html[dir="ltr"] .tile .tgo svg{transform:rotate(180deg)} .tile .tgo svg{transform:none}
[data-f][hidden]{display:none!important}
.tfilter-note{display:flex;align-items:center;gap:8px;background:var(--accent-soft);color:var(--accent);border-radius:10px;padding:7px 12px;margin:0 0 10px;font-size:13px;font-weight:600}
.tfilter-note a{margin-inline-start:auto;display:inline-flex;align-items:center;gap:4px;color:var(--accent)}
.tile .ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.tile.red .ico{background:var(--red-soft);color:var(--red)} .tile.amber .ico{background:var(--amber-soft);color:var(--amber)}
.tile.green .ico{background:var(--green-soft);color:var(--green)} .tile.blue .ico{background:var(--blue-soft);color:var(--blue)}
.tile b{display:block;font-size:22px;line-height:1.1} .tile span{color:var(--muted);font-size:12.5px}

/* ---- الشارات والحالات ---- */
.badge{display:inline-flex;align-items:center;border-radius:999px;padding:1px 10px;font-size:12px;font-weight:700;white-space:nowrap;line-height:1.6}
.b-late,.b-urgent{background:var(--red-soft);color:var(--red)} .b-esc{background:var(--red);color:#fff}
.b-today,.b-high,.b-review{background:var(--amber-soft);color:var(--amber)}
.b-open,.b-normal,.b-todo{background:var(--blue-soft);color:var(--blue)} .b-doing{background:var(--accent-soft);color:var(--accent)}
.b-done,.b-active{background:var(--green-soft);color:var(--green)} .b-low,.b-cancelled,.b-muted{background:var(--line);color:var(--muted)}
.b-lead{background:var(--gold-soft);color:#7a6520} .b-member{background:var(--blue-soft);color:var(--blue)} .b-viewer{background:var(--line);color:var(--muted)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:inline-grid;place-items:center;font-weight:800;font-size:13px;flex:none;overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover} .avatar.lg{width:56px;height:56px;font-size:20px;border-radius:16px} .avatar.xl{width:84px;height:84px;font-size:30px;border-radius:22px}
.who{display:inline-flex;align-items:center;gap:8px} .who small{color:var(--muted);display:block;line-height:1.2}
.meta{color:var(--muted);font-size:12.5px} .muted{color:var(--muted)} .small{font-size:13px}
.empty{color:var(--muted);text-align:center;padding:26px 12px;border:1px dashed var(--line);border-radius:var(--r);font-size:14px}
.empty svg{width:32px;height:32px;color:var(--faint);display:block;margin:0 auto 6px}
.progress{height:6px;background:var(--line);border-radius:999px;overflow:hidden} .progress i{display:block;height:100%;background:var(--accent);border-radius:999px}
.progress.green i{background:var(--green)} .progress.red i{background:var(--red)} .progress.amber i{background:var(--amber)}

/* ---- القوائم والجداول ---- */
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar input,.toolbar select{width:auto;min-width:130px;background:#fff}
.toolbar .search{min-width:200px;flex:1;max-width:320px}
.seg{display:inline-flex;background:var(--field);border-radius:10px;padding:3px}
.seg button{border:0;background:transparent;padding:5px 11px;border-radius:8px;cursor:pointer;color:var(--muted);font-weight:700;display:flex;gap:4px;align-items:center}
.seg button.on{background:#fff;color:var(--accent);box-shadow:var(--shadow)}
.tbl{overflow-x:auto;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:11px 12px;text-align:right;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;color:var(--muted);font-weight:700;white-space:nowrap;background:#fafafc}
tr:last-child td{border-bottom:0} tbody tr{cursor:pointer} tbody tr:hover td{background:var(--hover)}
td .t{font-weight:700} td .s{display:block;color:var(--muted);font-size:12px;font-weight:400}
.list{display:flex;flex-direction:column;gap:8px}
.item{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:10px 14px;display:flex;align-items:center;gap:12px;cursor:pointer;border-inline-start:4px solid transparent}
.item:hover{background:var(--hover)}
.item .body{flex:1;min-width:0} .item .ttl{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .item .sub{color:var(--muted);font-size:12.5px}
.item.late,.item.esc{border-color:var(--red)} .item.today{border-color:var(--amber)} .item.done{opacity:.7}
.chips{display:flex;gap:6px;flex-wrap:wrap} .chip{background:var(--field);border-radius:999px;padding:0 9px;font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none} .tabs::-webkit-scrollbar{display:none}
.tabs button{border:0;background:transparent;padding:8px 14px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;display:flex;gap:6px;align-items:center}
.tabs button.on{color:var(--accent);border-color:var(--accent)}
.tabs .cnt{background:var(--accent-soft);color:var(--accent);border-radius:999px;font-size:11px;padding:0 7px}

/* ---- التفاصيل: محتوى + عمود جانبي ثابت ---- */
.detail{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start;min-width:0}
.detail .mainc{min-width:0}
.detail .side{position:sticky;top:calc(var(--topbar) + 16px)}
.side .card{padding:14px 16px} .side .card+.card{margin-top:12px}
.kv{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:13.5px} .kv:last-child{border:0}
.kv span:first-child{color:var(--muted)}
.desc{white-space:pre-wrap;line-height:1.8}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:12px 0}
.facts div small{display:block;color:var(--muted);font-size:11.5px;font-weight:700;text-transform:uppercase} .facts div b{font-size:14px}
.check{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line)} .check input{width:20px;height:20px;margin:0}
.check.done span{text-decoration:line-through;color:var(--muted)} .check .x{margin-inline-start:auto;color:var(--faint);cursor:pointer}
.comment{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)} .comment:last-child{border:0}
.comment .bubble{flex:1;background:var(--field);border-radius:12px;padding:8px 12px} .comment .bubble b{font-size:13px} .comment .bubble time{color:var(--muted);font-size:11.5px;margin-inline-start:8px}
.comment.followup .bubble{background:var(--gold-soft)}
.composer{display:flex;gap:8px;align-items:flex-end;margin-top:10px} .composer textarea{min-height:44px;flex:1}
.filerow{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px} .filerow:last-child{border:0} .filerow .sz{color:var(--muted);font-size:12px;margin-inline-start:auto}

/* ---- الكانبان ---- */
.kanban{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px;align-items:start}
.kcol{background:var(--field);border-radius:var(--r-lg);padding:10px;min-height:200px}
.kcol .kh{display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:14px;padding:2px 6px 10px} .kcol .kh .cnt{background:#fff;border-radius:999px;padding:0 9px;font-size:12px;color:var(--muted)}
.kcol.over{outline:2px dashed var(--accent)}
.kcard{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:10px 12px;margin-bottom:8px;cursor:grab;display:flex;flex-direction:column;gap:6px}
.kcard:active{cursor:grabbing} .kcard .ttl{font-weight:700;font-size:14px;line-height:1.5}
.kcard .foot{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px} .kcard .foot .cnt{display:inline-flex;align-items:center;gap:3px}
.kcard .foot .who{margin-inline-end:auto}

/* ---- سجل النشاط ---- */
.stream{display:flex;flex-direction:column}
.stream .ev{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px dashed var(--line);font-size:13.5px} .stream .ev:last-child{border:0}
.stream .ev time{color:var(--muted);font-size:12px;white-space:nowrap;min-width:118px;display:flex;flex-direction:column;line-height:1.35} .stream .ev time b{color:var(--ink);font-weight:700;font-size:12px} .stream .ev time small{font-size:11px;color:var(--faint)}
.act{display:inline-block;border-radius:6px;padding:0 8px;font-size:11.5px;font-weight:700;min-width:58px;text-align:center}
.act-create,.act-upload{background:var(--blue-soft);color:var(--blue)} .act-update,.act-assign{background:var(--amber-soft);color:var(--amber)}
.act-done{background:var(--green-soft);color:var(--green)} .act-move,.act-comment{background:var(--accent-soft);color:var(--accent)}
.act-delete,.act-delete_file,.act-followup{background:var(--red-soft);color:var(--red)}

/* ---- الأشخاص ---- */
.person{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:16px;cursor:pointer}
.person .head{display:flex;gap:12px;align-items:center;margin-bottom:10px} .person .head b{display:block} .person .head small{color:var(--muted)}
.person .nums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center;margin:8px 0}
.person .nums b{display:block;font-size:18px;line-height:1.1} .person .nums span{font-size:11px;color:var(--muted)}
.person .nums .red b{color:var(--red)} .person .nums .green b{color:var(--green)}
.wa{background:#f6fbf7;border:1px solid #d9efe0;border-radius:var(--r);padding:10px 12px}
.wa textarea{background:#fff;font-size:13.5px;min-height:170px}
.wa .bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-weight:700;font-size:13px}

/* ---- الوارد ---- */
.inbox-tabs .cnt{min-width:22px}
.notif{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:var(--r);background:#fff;box-shadow:var(--shadow);cursor:pointer}
.notif.unread{border-inline-start:4px solid var(--accent)} .notif .k{width:34px;height:34px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.notif time{display:block;color:var(--muted);font-size:12px}

/* ---- الدخول ---- */
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(160deg,#f7f3fd,var(--bg))}
.login .box{background:#fff;border-radius:22px;box-shadow:var(--shadow-lg);padding:32px 30px;width:100%;max-width:400px}
.login .brand{justify-content:center;padding-bottom:10px} .login h2{text-align:center;margin:0 0 4px;font-size:18px} .login p{text-align:center;color:var(--muted);margin:0 0 18px;font-size:13.5px}
.login .btn{width:100%;justify-content:center;padding:11px}
.err{background:var(--red-soft);color:var(--red);border-radius:10px;padding:8px 12px;font-size:13.5px;margin-bottom:12px}

/* ---- النوافذ والتنبيهات ---- */
.overlay{position:fixed;inset:0;background:rgba(30,20,50,.35);z-index:50;display:grid;place-items:center;padding:16px}
.modal{background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);padding:20px 22px;width:100%;max-width:560px;max-height:92vh;overflow:auto}
.modal h3{margin:0 0 12px;font-size:16px}
.modal .foot{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.toasts{position:fixed;bottom:20px;inset-inline-start:20px;z-index:99;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--ink);color:#fff;border-radius:12px;padding:9px 16px;font-size:13.5px;box-shadow:var(--shadow-lg);animation:up .2s}
.toast.err{background:var(--red)} .toast.ok{background:var(--green)}
@keyframes up{from{transform:translateY(8px);opacity:0}}
.pop{position:absolute;top:calc(100% + 6px);inset-inline-end:0;background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);width:360px;max-height:70vh;overflow:auto;z-index:30;padding:8px}
.pop .hd{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;font-weight:800;font-size:14px}
.menu a{display:block;padding:8px 12px;border-radius:8px;color:var(--ink)} .menu a:hover{background:var(--hover)}
.loading{text-align:center;color:var(--muted);padding:30px}
.spin{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:sp .8s linear infinite;margin:0 auto 8px}
@keyframes sp{to{transform:rotate(360deg)}}
kbd{background:var(--field);border-radius:5px;padding:0 6px;font-size:12px;border:1px solid var(--line)}
.note{background:var(--gold-soft);border-radius:var(--r);padding:12px 14px;font-size:14px}

/* ---- الجوال ---- */
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .sidebar{display:none}
  .content{padding:14px 14px calc(var(--bottomnav) + 24px)}
  .topbar{padding:0 12px;gap:8px} .topbar .search{display:none} .topbar .dept{max-width:150px;font-size:13px} .userchip .r{display:none} .userchip .n{max-width:90px;overflow:hidden;text-overflow:ellipsis}
  .detail{grid-template-columns:1fr} .detail .side{position:static}
  .kanban{display:flex;overflow-x:auto;scroll-snap-type:x mandatory} .kcol{min-width:82vw;scroll-snap-align:start}
  .bottomnav{display:flex;position:fixed;bottom:0;inset-inline:0;height:var(--bottomnav);background:#fff;border-top:1px solid var(--line);z-index:40;justify-content:space-around;align-items:center;padding-bottom:env(safe-area-inset-bottom)}
  .bottomnav a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--muted);font-weight:700;position:relative;padding:4px 10px}
  .bottomnav a.on{color:var(--accent)} .bottomnav a .cnt{position:absolute;top:0;inset-inline-end:2px;background:var(--red);color:#fff;font-size:10px;border-radius:999px;padding:0 5px}
  .bottomnav a.plus{background:var(--accent);color:#fff;border-radius:16px;padding:8px 14px;margin-top:-22px;box-shadow:0 6px 18px rgba(84,0,168,.3)}
  input,select,textarea{font-size:16px}
  .pop{position:fixed;inset-inline:10px;top:66px;width:auto}
  .person .nums{grid-template-columns:repeat(4,1fr)}
  .page-head h1{font-size:18px}
  .app-footer{margin:16px 12px calc(var(--bottomnav) + 10px);padding:16px 8px}
  /* راحة الجوال: أعمدة واحدة · بلاطات اثنتان · نوافذ كأوراق سفلية · أهداف لمس أكبر */
  .hgrid,.grid.c2,.grid.c3,.dash{grid-template-columns:1fr} .tiles{grid-template-columns:repeat(2,1fr)} .home .hero{padding:16px} .home .hero .clock{width:100%} .hero .btn.xl{width:100%;justify-content:center}
  .page-head,.page-head .actions,.toolbar{flex-wrap:wrap} .toolbar .search{flex:1 1 100%} .toolbar select.pick{max-width:100%}
  .overlay{align-items:end;justify-items:stretch;padding:0} .modal{border-radius:18px 18px 0 0;max-width:100%;max-height:94vh}
  .btn{min-height:40px} .act{width:34px;height:34px} .userchip .n{display:none} #clock .meta{display:none} .deptsw select.dept{max-width:150px;min-width:100px}
  .permgrid{grid-template-columns:1fr} .facebox{width:min(100%,280px)}
}
@media print{.sidebar,.topbar,.bottomnav,.btn,.toolbar{display:none!important} .app{display:block} .content{padding:0}}

/* مفاتيح الإظهار/الإخفاء (تذييل وغيره) */
.switch{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;color:var(--muted);margin:0;position:relative;user-select:none}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch i{width:36px;height:20px;border-radius:999px;background:#d9d6e0;position:relative;transition:background .2s;flex:none}
.switch i::after{content:'';position:absolute;top:2px;inset-inline-start:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:inset-inline-start .2s}
.switch input:checked + i{background:var(--accent)} .switch input:checked + i::after{inset-inline-start:18px}
.switch input:focus-visible + i{outline:2px solid var(--accent);outline-offset:2px}
.frow{padding:10px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;transition:background .2s}
.frow-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px} .frow-h > b{font-size:13px}
.frow.off{background:var(--bg)} .frow.off input[type=text],.frow.off textarea{opacity:.4;pointer-events:none}
.frow.solo .frow-h{margin:0}
/* رابط الاجتماع في صفحة التفاصيل */
.mlink{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:linear-gradient(135deg,#f6f0ff,#fff);border:1px solid #e6dafa;border-radius:14px;padding:12px 14px;flex:1;min-width:260px}
.mlink-i{width:44px;height:44px;border-radius:12px;background:var(--accent);color:#fff;display:grid;place-items:center;flex:none}
.mlink.empty .mlink-i{background:var(--accent-soft);color:var(--accent)}
.mlink-b{flex:1;min-width:180px;display:flex;flex-direction:column;gap:2px} .mlink-b a{font-size:13px;color:var(--accent);word-break:break-all} .mlink-b input{margin-top:4px}
.mlink-a{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.item .act.join{margin-inline-start:6px;background:var(--accent);color:#fff;border-color:var(--accent)} .item .act.join:hover{background:var(--accent-2,#6b14c9);color:#fff}
/* نافذة تذكير الاجتماع */
.remind-ov{z-index:400;backdrop-filter:blur(2px)}
.modal.remind{max-width:440px;text-align:center;padding:26px 24px 20px;animation:rmpop .28s cubic-bezier(.2,.9,.3,1.2)}
@keyframes rmpop{from{transform:scale(.9);opacity:0}to{transform:none;opacity:1}}
.remind .rm-bell{width:64px;height:64px;margin:0 auto 10px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;animation:rmring 1.2s ease-in-out 2}
@keyframes rmring{0%,100%{transform:rotate(0)}15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}75%{transform:rotate(2deg)}}
.remind .rm-kick{font-size:12px;font-weight:800;color:var(--accent);letter-spacing:.4px}
.remind h3{margin:4px 0 8px;font-size:19px}
.remind .rm-when{display:inline-flex;align-items:center;gap:6px;background:var(--amber-soft);color:var(--amber);border-radius:999px;padding:4px 12px;font-weight:700;font-size:13px;margin-bottom:6px}
.remind .rm-when.soon{background:var(--red-soft);color:var(--red)}
.remind .rm-acts{display:flex;flex-direction:column;gap:8px;margin-top:16px} .remind .rm-acts .btn{justify-content:center;width:100%}
.remind .rm-perm{display:inline-flex;gap:4px;align-items:center;margin-top:12px}
/* الإملاء الصوتي */
#capMic.rec{background:var(--red);color:#fff;border-color:var(--red);animation:micpulse 1.2s infinite}
@keyframes micpulse{0%{box-shadow:0 0 0 0 rgba(217,74,74,.45)}70%{box-shadow:0 0 0 10px rgba(217,74,74,0)}100%{box-shadow:0 0 0 0 rgba(217,74,74,0)}}

/* ---------- إنجاز اليوم ---------- */
.dhero{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center;background:linear-gradient(135deg,#5400A8 0%,#7a2fd6 60%,#9c6ae6 100%);color:#fff;border-radius:20px;padding:22px 24px;margin-bottom:16px;position:relative;overflow:hidden}
.dhero::after{content:'';position:absolute;inset-inline-end:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%);pointer-events:none}
.dh-kick{display:inline-flex;align-items:center;gap:6px;font-size:13px;opacity:.9;font-weight:600}
.dhero h1{margin:4px 0 6px;font-size:24px;font-weight:800;color:#fff}
.dh-sub{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13.5px;opacity:.95}
.dh-state{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 11px;font-weight:700;font-size:12.5px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28)}
.dh-state.s-done{background:#e7f8ee;color:#16803c;border-color:transparent} .dh-state.s-late{background:#fff4dc;color:#a36a00;border-color:transparent}
.dh-review{margin-top:10px;background:rgba(255,255,255,.14);border-radius:12px;padding:8px 12px;font-size:13px;max-width:520px}
.dh-side{display:flex;gap:14px;align-items:center;flex-wrap:wrap;position:relative;z-index:1}
.dh-ring{position:relative;width:92px;height:92px;display:grid;place-items:center;text-align:center}
.dh-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.dh-ring circle{fill:none;stroke-width:6} .dh-ring .bg{stroke:rgba(255,255,255,.22)} .dh-ring .fg{stroke:#f4d98a;stroke-linecap:round;transition:stroke-dashoffset .5s cubic-bezier(.4,0,.2,1)}
.dh-ring b{font-size:19px;line-height:1;margin-top:10px} .dh-ring small{font-size:9.5px;opacity:.85;margin-top:-14px;max-width:62px;line-height:1.2}
.dh-streak{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:8px 14px;text-align:center;min-width:86px}
.dh-streak b{display:block;font-size:26px;line-height:1.1;color:#f4d98a} .dh-streak span{display:inline-flex;gap:4px;align-items:center;font-size:11.5px;opacity:.9}
.dh-day{display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--ink);border-radius:12px;padding:4px 10px;margin:0;cursor:pointer}
.dh-day input{border:0;padding:4px 0;width:auto;background:transparent;font:inherit;color:inherit}
.dgrid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:start}
.dform{display:flex;flex-direction:column;gap:12px}
.dstep{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px 16px;border:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.dstep:focus-within{border-color:#d9c6f5;box-shadow:0 6px 22px rgba(84,0,168,.08)}
.ds-h{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px} .ds-h b{display:inline-flex;align-items:center;gap:6px;font-size:14.5px} .ds-h small{display:block;color:var(--muted);font-size:12px;margin-top:1px}
.ds-n{width:26px;height:26px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:800;font-size:13px;flex:none}
.dstep.warn .ds-n{background:var(--amber-soft);color:var(--amber)}
.dstep textarea{width:100%;min-height:64px;resize:vertical;border-radius:12px} #dSum{min-height:150px;font-size:15px;line-height:1.8}
.ds-chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.chip.add{cursor:pointer;border:1px dashed #cdb8ef;background:#faf6ff;color:var(--accent);font-family:inherit} .chip.add:hover{background:var(--accent-soft)} .chip.add.used{opacity:.45;border-style:solid}
.dpair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dmood{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.dmood button{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 4px 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;font-family:inherit;font-weight:700;font-size:12.5px;color:var(--muted);transition:.15s}
.dmood button i{width:30px;height:6px;border-radius:999px;background:linear-gradient(90deg,currentColor calc(var(--lv) * 20%),var(--line) 0)}
.dmood button:hover{border-color:currentColor}
.dmood .m-green{color:var(--green)} .dmood .m-blue{color:var(--blue)} .dmood .m-muted{color:#8b8698} .dmood .m-amber{color:var(--amber)} .dmood .m-red{color:var(--red)}
.dmood button.on{border-color:currentColor;background:color-mix(in srgb,currentColor 10%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,currentColor 14%,transparent)}
.dhours{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px} .dhours label{display:inline-flex;gap:6px;align-items:center;font-weight:700;font-size:13px;margin:0} .dhours input{width:110px}
.ddrop{display:flex;flex-direction:column;align-items:center;gap:4px;border:2px dashed #d9c6f5;border-radius:14px;padding:18px;text-align:center;color:var(--accent);cursor:pointer;background:#fcfaff;transition:.15s;margin:0}
.ddrop small{color:var(--muted);font-size:12px} .ddrop.over{background:var(--accent-soft);border-color:var(--accent)} .ddrop.busy{opacity:.6;pointer-events:none}
#dFiles:not(:empty){margin-top:10px}
.dsave{position:sticky;bottom:10px;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:rgba(255,255,255,.94);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:16px;padding:10px 12px;box-shadow:0 8px 26px rgba(42,36,56,.10)}
.dside .card{margin-bottom:12px}
.dstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.dstats div{background:var(--bg);border-radius:12px;padding:10px 4px} .dstats b{display:block;font-size:22px;color:var(--accent);line-height:1.1} .dstats span{font-size:11.5px;color:var(--muted)}
.dtime{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:13px;color:var(--muted)} .dtime b{margin-inline-start:auto;color:var(--ink)}
.dweek{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.dweek a{display:flex;flex-direction:column;align-items:center;gap:5px;text-decoration:none;color:var(--muted);font-size:11px;font-weight:700;padding:6px 0;border-radius:10px}
.dweek a:hover{background:var(--hover)} .dweek a.sel{background:var(--accent-soft);color:var(--accent)}
.dweek i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line);background:#fff}
.dweek a.ok i{background:var(--green);border-color:var(--green);color:#fff} .dweek a.miss i{border-color:#f2c4c4;color:var(--red)} .dweek a.now i{border-color:var(--accent);border-style:dashed}
.dlinks{display:flex;flex-direction:column;gap:6px} .dlinks .btn{justify-content:center;width:100%}
@media (max-width:980px){.dgrid{grid-template-columns:1fr} .dside{order:-1}}
@media (max-width:640px){.dhero{padding:18px;border-radius:16px} .dhero h1{font-size:20px} .dpair{grid-template-columns:1fr} .dmood{gap:5px} .dmood button{font-size:11px;padding:8px 2px} .dh-ring{width:78px;height:78px} .dsave{bottom:calc(var(--bottomnav) + 8px)} .dsave .btn{flex:1;justify-content:center}}

/* ---------- بصمة الوجه v2 ---------- */
.fhead{display:flex;gap:12px;align-items:center;margin-bottom:12px} .fhead h3{margin:0} .fbadge{width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.facebox.v2{border-radius:50%;background:#1a1426;box-shadow:0 10px 40px rgba(84,0,168,.18)}
.facebox.v2 .fprog{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none;z-index:2}
.facebox.v2 .fprog circle{fill:none;stroke-width:3.2} .facebox.v2 .fprog .bg{stroke:rgba(255,255,255,.28)} .facebox.v2 .fprog .fg{stroke:#b98cff;stroke-linecap:round;transition:stroke-dashoffset .35s ease,stroke .3s}
.facebox.v2.seen .fprog .bg{stroke:rgba(185,140,255,.45)}
.facebox.v2.ok .fprog .fg{stroke:#22c55e}
.facebox.v2 .fscan{position:absolute;inset:0;border-radius:50%;background:linear-gradient(180deg,transparent 0%,rgba(185,140,255,.0) 40%,rgba(185,140,255,.35) 50%,rgba(185,140,255,0) 60%,transparent 100%);background-size:100% 220%;animation:fscan 2.2s linear infinite;pointer-events:none;opacity:0;transition:opacity .3s}
.facebox.v2.seen .fscan{opacity:1} .facebox.v2.ok .fscan{opacity:0}
@keyframes fscan{from{background-position:0 -110%}to{background-position:0 110%}}
.facebox.v2 .fdone{position:absolute;inset:0;display:grid;place-items:center;background:rgba(22,163,74,.55);color:#fff;opacity:0;transform:scale(.8);transition:.3s;z-index:3;border-radius:50%} .facebox.v2 .fdone.show{opacity:1;transform:none}
.fsteps{display:flex;justify-content:center;gap:6px;margin-top:12px;flex-wrap:wrap}
.fsteps span{font-size:12px;font-weight:700;color:var(--muted);background:var(--bg);border-radius:999px;padding:3px 12px;transition:.2s}
.fsteps span.on{background:var(--accent-soft);color:var(--accent)} .fsteps span.ok{background:#e7f8ee;color:#16803c}
.fmsg{text-align:center;margin-top:10px;font-weight:700;font-size:14.5px;min-height:24px;color:var(--ink)}
.fmsg.warn{color:var(--amber)} .fmsg.bad{color:var(--red)} .fmsg.good{color:#16803c}
.fface{flex-wrap:wrap}
.facefeat{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}
.facefeat div{background:#fff;border-radius:14px;box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:4px}
.facefeat span{width:34px;height:34px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center} .facefeat b{font-size:13.5px} .facefeat small{color:var(--muted);font-size:11.5px;line-height:1.5}
@media (max-width:980px){.facefeat{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- الدوام بفترتين ---------- */
.shifts td{vertical-align:middle} .shifts .tpair{display:inline-flex;align-items:center;gap:6px} .shifts input[type=time]{width:118px}
.shifts tr:not(.split) td.p2 .tpair{opacity:.3;pointer-events:none}
.shifts tr.split td.p2 .tpair{opacity:1}
.pdots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.pdots > span{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 10px;background:var(--bg);color:var(--muted)}
.pdots > span.now{background:var(--accent-soft);color:var(--accent)} .pdots > span.on{background:var(--amber-soft);color:var(--amber)} .pdots > span.ok{background:#e7f8ee;color:#16803c}
