:root{
  --coral:#FF5A2B; --lavender:#B69CF0; --rose:#F2879F; --mint:#12BFA0;
  --plum:#7C5BA6; --ink:#171326; --ink-2:#4A4459; --muted:#8B8399;
  --glass:rgba(255,255,255,.58); --edge:rgba(255,255,255,.75);
  /* أسطحٌ وحدودٌ كانت تُستعمل في ٣٧ تصريحاً بلا أن تُعرَّف في أي موضع،
     فتسقط تلك التصريحات بصمت ويُرسم العنصر بلا خلفيةٍ ولا حدّ. */
  --card:#FFFFFF; --chip:rgba(124,91,166,.10); --line:rgba(124,91,166,.16);
  --accent:var(--coral);
  --shadow:0 12px 40px rgba(120,80,120,.14); --r:22px;
  --toast-bg:#171326; --toast-text:#fff;
  --bg1:#FDEDEA; --bg2:#F8E7F2; --bg3:#EFE6FB; --bg4:#FBF4EE;
  --blob1:#FFB39A; --blob2:#C9AEF7; --blob3:#FFC9DA; --blob4:#9FE6D6;
}
:root.night{
  --ink:#F7F3FF; --ink-2:#D7D0E3; --muted:#A9A0B9; --glass:rgba(35,29,50,.72);
  --card:#241D32; --chip:rgba(255,255,255,.08); --line:rgba(255,255,255,.12);
  --edge:rgba(255,255,255,.13); --shadow:0 12px 40px rgba(0,0,0,.25);
  --toast-bg:#F4EEFF; --toast-text:#21182D;
}
*{box-sizing:border-box}
body{margin:0;direction:rtl;color:var(--ink);font-family:'Tajawal',system-ui,sans-serif;
  background:var(--bg4);overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s}
.night body{background:#100d16}
.night .bg{background:linear-gradient(160deg,#17121d 0%,#1b1527 48%,#102020 100%)}
.night .bg i{opacity:.26}
.night .fld-in,.night .btn.soft,.night .chip{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);color:var(--ink)}
.night .fld-in:focus,.night .btn.soft:hover,.night .chip:hover{background:rgba(255,255,255,.16)}
.night .chip[aria-pressed=true]{background:var(--lavender);color:#21182D}
.night .sheet{background:rgba(35,29,50,.96)}
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden;
  background:linear-gradient(160deg,var(--bg1) 0%,var(--bg2) 38%,var(--bg3) 72%,var(--bg4) 100%);transition:background .4s}
.bg i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55}
.b1{width:520px;height:520px;background:var(--blob1);top:-140px;right:-120px}
.b2{width:460px;height:460px;background:var(--blob2);top:34%;left:-150px}
.b3{width:420px;height:420px;background:var(--blob3);bottom:-140px;right:18%}
.b4{width:300px;height:300px;background:var(--blob4);bottom:22%;left:12%;opacity:.38}
.wrap{max-width:1180px;margin:0 auto;padding:26px 18px 90px}
.card{background:var(--glass);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  border:1px solid var(--edge);border-radius:var(--r);box-shadow:var(--shadow)}

.hero{padding:26px 28px;margin-bottom:16px}
.nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.nav .theme-btn{margin-inline-start:auto}
.view{display:none}.view.active{display:block}
.hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:22px;flex-wrap:wrap}
h1{margin:0;font-size:clamp(26px,4vw,38px);font-weight:900;letter-spacing:-1px;line-height:1.05}
h1 em{font-style:normal;color:var(--coral)}
.sub{margin:6px 0 0;font-size:14px;color:var(--muted)}
.big{text-align:left;line-height:.9}
.big b{font-family:'Tajawal';font-size:clamp(48px,9vw,76px);font-weight:800;letter-spacing:-3px;
  background:linear-gradient(115deg,var(--coral),var(--plum));-webkit-background-clip:text;
  background-clip:text;color:transparent}
.big span{display:block;font-size:12.5px;color:var(--muted);margin-top:8px;font-weight:500}
.spine{display:flex;height:12px;margin-top:20px;border-radius:99px;overflow:hidden;
  background:rgba(255,255,255,.5);box-shadow:inset 0 1px 3px rgba(120,80,120,.12)}
.spine i{transition:width .5s cubic-bezier(.4,0,.2,1);border-radius:99px;background:linear-gradient(90deg,var(--coral),var(--plum))}
[dir=rtl] .spine i{background:linear-gradient(270deg,var(--coral),var(--plum))}

.chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.chip{display:flex;align-items:center;gap:7px;padding:8px 15px;border-radius:99px;cursor:pointer;
  border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.45);
  font-family:inherit;font-size:13px;font-weight:500;color:var(--ink-2);transition:.18s}
.chip:hover{background:rgba(255,255,255,.8);transform:translateY(-1px)}
.chip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:transparent}
.chip .dot{width:8px;height:8px;border-radius:50%}
.chip b{font-family:'Tajawal';font-weight:600}

.grid{display:grid;grid-template-columns:320px 1fr;gap:16px;margin-bottom:16px}
.panel{padding:20px 22px}
.panel h2{margin:0 0 3px;font-size:17px;font-weight:800}
.hint{margin:0 0 16px;font-size:13px;color:var(--muted)}
.donut-wrap{display:flex;align-items:center;gap:18px}
.donut{position:relative;flex:0 0 auto}
.donut .mid{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.donut .mid b{font-family:'Tajawal';font-size:26px;font-weight:800;display:block;line-height:1}
.donut .mid span{font-size:10.5px;color:var(--muted)}
.legend{display:flex;flex-direction:column;gap:7px;font-size:13.5px;flex:1;max-width:230px}
.legend div{display:flex;align-items:center;gap:7px;color:var(--ink-2)}
.legend i{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.legend b{margin-right:auto;font-family:'Tajawal';font-weight:600;color:var(--ink)}

.bars{display:flex;align-items:flex-end;gap:5px;height:130px}
.bars .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;
  gap:5px;height:100%}
.bars .bar{width:100%;max-width:26px;border-radius:8px 8px 3px 3px;min-height:3px;
  background:linear-gradient(180deg,var(--coral),#FF8A5B);transition:.3s}
.bars .col.today .bar{background:linear-gradient(180deg,var(--plum),var(--lavender))}
.bars .col:hover .bar{filter:brightness(1.1)}
.bars .lbl{font-family:'Tajawal';font-size:9.5px;color:var(--muted)}
.bars .num{font-family:'Tajawal';font-size:11px;font-weight:600;color:var(--ink-2);height:14px}

.pbars{display:flex;flex-direction:column;gap:12px}
.pbar{display:grid;grid-template-columns:1fr 48px;gap:8px;align-items:center;font-size:14px}
.pbar .track{grid-column:1/-1;height:8px;border-radius:99px;background:rgba(255,255,255,.65);overflow:hidden}
.pbar .fill{height:100%;border-radius:99px;transition:width .4s}
.pbar .nm{font-weight:500;color:var(--ink-2);display:flex;align-items:center;gap:7px}
.pbar .nm i{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.pbar .vl{text-align:left;font-family:'Tajawal';font-weight:600;font-size:12.5px}
.calendar-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.calendar-head h2{margin:0}
.calendar-nav{display:flex;gap:6px;direction:ltr}
.calendar-nav .btn{width:34px;height:34px;padding:0;justify-content:center;font-size:18px}
.cal-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.cal-filter{border:1px solid rgba(255,255,255,.7);border-radius:99px;background:rgba(255,255,255,.42);color:var(--ink-2);padding:6px 11px;font:500 12px 'Tajawal';cursor:pointer}
.cal-filter[aria-pressed=true]{background:var(--ink);color:#fff;border-color:transparent}
.night .cal-filter{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);color:var(--ink-2)}
.night .cal-filter[aria-pressed=true]{background:var(--lavender);color:#21182D}
.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal-weekday{text-align:center;color:var(--muted);font-size:11px;font-weight:700;padding:5px 2px}
.cal-day{min-height:94px;padding:8px;border:1px solid rgba(140,120,160,.13);border-radius:12px;background:rgba(255,255,255,.28);overflow:hidden}
.cal-day.muted{opacity:.4}
.cal-day.today{border-color:var(--coral);box-shadow:inset 0 0 0 1px var(--coral)}
.cal-num{font-family:'Tajawal';font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:5px}
.cal-task{display:block;width:100%;border:0;border-right:3px solid var(--task-color);border-radius:5px;background:var(--task-bg);color:var(--ink-2);padding:3px 5px;margin-top:3px;text-align:right;font:inherit;font-size:10px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.cal-task:hover{filter:brightness(.96);transform:translateX(-1px)}
.cal-task.hidden{opacity:.55;text-decoration:line-through}
.cal-more{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.night .cal-day{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.12)}
.night .cal-task{color:#F7F3FF}
.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}
.profile-stat{padding:11px 13px;border-radius:12px;background:color-mix(in srgb,var(--lavender) 12%,transparent);color:var(--ink-2);font-size:12px}
.profile-stat b{display:block;color:var(--ink);font-size:14px;margin-top:4px}
.profile-notes{padding:14px;border-radius:14px;background:rgba(255,255,255,.48);color:var(--ink-2);line-height:1.9;font-size:13px;white-space:pre-wrap}
.profile-link{display:inline-flex;color:var(--coral);font-size:13px;word-break:break-all;margin-top:12px}
.attachments{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.attachment{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.48);font-size:12px;color:var(--ink-2)}
.attachment a{color:var(--coral);text-decoration:none;white-space:nowrap}
.attachment a:hover{text-decoration:underline}
.editor-row{display:flex;gap:7px;align-items:center;margin-top:7px}
.editor-row .fld-in{flex:1;min-width:0}
.remove-item{width:28px;height:28px;border:0;border-radius:8px;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);cursor:pointer;font-size:17px;line-height:1}
.remove-item:hover{background:color-mix(in srgb,var(--coral) 22%,transparent)}
.add-item{margin-top:8px}
.step-row{display:grid;grid-template-columns:30px 130px 1fr 28px;gap:7px;align-items:center;margin-top:7px}
.step-row .fld-in{min-width:0}
.profile-timeline{position:relative;margin-top:16px;padding-right:20px;border-right:2px solid var(--lavender)}
.profile-step{position:relative;padding:0 0 16px;color:var(--ink-2);font-size:13px;line-height:1.7}
.profile-step:before{content:'';position:absolute;right:-27px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px var(--glass)}
.profile-step time{display:block;color:var(--muted);font-size:11px;font-family:'Tajawal'}
.night .profile-notes,.night .attachment{background:rgba(255,255,255,.07)}
.night .sheet h3,.night #profileTitle,.night .profile-stat b{color:#FFFFFF}
.night .profile-stat,.night .profile-notes,.night .profile-step{color:#F1ECF8}
.night .profile-step time{color:#C8BCD8}
.night .profile-link{color:#FFB39A}
.priority-tag{font-weight:700}
.drag-handle{cursor:grab;color:var(--muted);font-size:18px;line-height:1;padding:4px}
.drag-handle:active{cursor:grabbing}
.item.dragging{opacity:.45}
.item.drop-target{outline:2px dashed var(--lavender);outline-offset:3px}
@media(max-width:620px){.profile-grid{grid-template-columns:1fr}}

.bar-tools{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:14px;padding:12px 14px}
input,select,textarea,button{font-family:inherit}
.fld-in{background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);
  border-radius:14px;padding:10px 14px;font-size:13.5px;color:var(--ink);transition:.18s}
.fld-in::placeholder{color:#A9A2B8}
.fld-in:focus{outline:none;border-color:var(--lavender);background:#fff;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--lavender) 22%,transparent)}
.grow{flex:1;min-width:150px}
.btn{border:0;border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600;cursor:pointer;
  background:var(--ink);color:#fff;transition:.18s;display:inline-flex;align-items:center;gap:7px}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(23,19,38,.22)}
.btn.accent{background:linear-gradient(115deg,var(--coral),color-mix(in srgb,var(--coral) 82%,white))}
.btn.soft{background:rgba(255,255,255,.62);color:var(--ink);border:1px solid rgba(255,255,255,.85)}
.btn.soft:hover{background:#fff}
.btn.soft[aria-pressed=true]{background:var(--lavender);color:#fff;border-color:transparent}
.btn.tiny{padding:6px 13px;font-size:12px;font-weight:500}
.icon{width:15px;height:15px;flex:0 0 auto}

.list{display:flex;flex-direction:column;gap:9px}
.list.grid-view{display:grid;grid-template-columns:repeat(var(--grid-cols),minmax(0,1fr));align-items:start;gap:16px 18px}
.grid-view .item{height:350px;padding:18px;display:flex;flex-direction:column}
.grid-view .it-top{align-items:flex-start}
.grid-view .notes{flex:1;min-height:0;overflow:auto;margin-bottom:12px;line-height:1.9;padding:14px 15px}
.grid-view .acts{height:38px;min-height:38px;margin-top:auto;flex:0 0 38px;align-items:center;direction:ltr;justify-content:flex-start}
.edit-icon{width:40px;height:34px;padding:0;justify-content:center}
.edit-icon svg{width:18px;height:18px}
.done-icon{width:34px;height:30px;padding:0;justify-content:center;color:var(--mint)}
.done-icon svg{width:18px;height:18px}
.view-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.view-tools .btn{padding:9px 12px}
.view-tools .mode-btn{width:36px;height:36px;padding:0;justify-content:center;border-radius:10px}
.view-tools .mode-btn svg{width:17px;height:17px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.grid-count{display:flex;gap:3px;align-items:center;margin-right:2px;direction:ltr}
.grid-count button{width:28px;height:28px;padding:0;border:1px solid rgba(255,255,255,.85);border-radius:8px;
  background:rgba(255,255,255,.48);color:var(--ink-2);font:600 12px 'Tajawal';cursor:pointer;transition:.18s}
.grid-count button:hover{background:rgba(255,255,255,.85)}
.grid-count button[aria-pressed=true]{background:var(--lavender);border-color:transparent;color:#fff}
.grid-count[aria-disabled=true]{opacity:.4;pointer-events:none}
.night .grid-count button{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);color:var(--ink)}
.night .grid-count button:hover{background:rgba(255,255,255,.16)}
.item{padding:15px 18px;border-radius:18px;transition:.2s}
.item:hover{background:rgba(255,255,255,.74)}
.item.hidden-t{opacity:.5}
.night .item:hover{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.night .item.hidden-t{opacity:.7}
.it-top{display:flex;justify-content:space-between;gap:12px;align-items:center}
.it-title{cursor:pointer;min-width:0}
.it-title h3{margin:0;font-size:16px;font-weight:700;line-height:1.5}
.it-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.tag{font-size:12px;padding:4px 10px;border-radius:99px;font-weight:500;
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.tag.date{background:rgba(255,255,255,.65);color:var(--ink-2);font-family:'Tajawal';font-size:11px}
/* وسمٌ بلون حالةٍ أو أولوية أو مشروع (--tc). كان النص بلون الوسم نفسه على
   خلفيته الباهتة فيهبط التباين إلى ١٫٤–٢٫٣. النص الآن نصفه اللون ونصفه حبر
   الصفحة: أسوأ تباين ٥٫٢ فاتحاً و٦٫٨ داكناً لكل ألوان النظام (المطلوب ٤٫٥) */
.tag.tint{background:color-mix(in srgb,var(--tc) 14%,transparent);color:color-mix(in srgb,var(--tc) 50%,#1D1530)}
.night .tag.tint{color:color-mix(in srgb,var(--tc) 50%,#FFFFFF)}
.night .tag.date{background:rgba(255,255,255,.12);color:#F7F3FF;border-color:rgba(255,255,255,.16)}
.it-right{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.ring{position:relative;width:38px;height:38px}
.ring span{position:absolute;inset:0;display:grid;place-content:center;font-family:'Tajawal';
  font-size:10.5px;font-weight:700}
.eye{background:none;border:0;cursor:pointer;padding:6px;border-radius:10px;color:var(--muted);
  display:grid;place-content:center;transition:.15s}
.eye:hover{background:rgba(255,255,255,.9);color:var(--ink)}
.night .eye:hover{background:rgba(255,255,255,.12);color:#F7F3FF}
.notes{margin:12px 0 0;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.6);
  font-size:14px;line-height:1.9;color:var(--ink-2)}
.night .notes{background:rgba(255,255,255,.08);color:#E8E1F2}
.acts{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}
.empty{padding:46px;text-align:center;color:var(--muted);font-size:14.5px}

.tl-scale{display:grid;font-family:'Tajawal';font-size:10px;color:var(--muted);
  padding-bottom:6px;margin-right:180px;border-bottom:1px dashed rgba(140,120,160,.25)}
.tl-scale span{text-align:center}
.tl-row{display:grid;grid-template-columns:180px 1fr;height:28px;align-items:center;border-radius:8px}
.tl-row:hover{background:rgba(255,255,255,.6)}
.tl-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  padding-left:12px;color:var(--ink-2)}
.tl-track{position:relative;height:100%}
.tl-bar{position:absolute;top:9px;height:11px;border-radius:99px;min-width:8px}
.tl-today{position:absolute;top:2px;bottom:2px;width:2px;border-radius:2px;background:var(--coral)}

dialog{border:0;padding:0;background:transparent;width:min(600px,94vw)}
dialog::backdrop{background:rgba(80,50,90,.32);backdrop-filter:blur(6px)}
.sheet{background:rgba(255,255,255,.88);backdrop-filter:blur(30px);border:1px solid var(--edge);
  border-radius:26px;padding:26px 28px;box-shadow:0 24px 60px rgba(100,60,110,.28)}
.sheet h3{margin:0 0 18px;font-size:20px;font-weight:800}
.f{margin-bottom:14px}
.f label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:500}
.f .fld-in{width:100%}
.f textarea{resize:vertical;min-height:84px;line-height:1.8}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rng{display:flex;align-items:center;gap:12px}
.rng input[type=range]{flex:1;accent-color:var(--coral)}
.rng b{font-family:'Tajawal';font-size:14px;min-width:44px}
.foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:20px;
  padding-top:16px;border-top:1px solid rgba(140,120,160,.16)}
.foot .r{display:flex;gap:8px}
.link{border:0;background:none;color:var(--muted);font-size:12.5px;cursor:pointer;padding:6px 8px}
.link:hover{color:var(--coral);text-decoration:underline}
.prow{display:grid;grid-template-columns:34px 1fr 54px;gap:10px;align-items:center;margin-bottom:9px}
.swatch{width:34px;height:34px;border-radius:12px;border:2px solid #fff;cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.12)}
.pcount{font-size:11px;color:var(--muted);text-align:center;line-height:1.5}

.toast{position:fixed;bottom:24px;right:24px;background:var(--toast-bg);color:var(--toast-text);padding:12px 20px;
  border-radius:99px;font-size:13.5px;opacity:0;transform:translateY(10px);transition:.25s;
  pointer-events:none;z-index:99;box-shadow:0 10px 30px rgba(23,19,38,.3)}
.toast.on{opacity:1;transform:none}
.theme-btn{width:42px;height:42px;padding:0;justify-content:center}
.theme-btn svg{width:19px;height:19px}

@media(max-width:900px){.grid{grid-template-columns:1fr}}
@media(max-width:620px){.tl-row{grid-template-columns:110px 1fr}.tl-scale{margin-right:110px}
  .two{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* ============================================================
   إضافات مركز إدارة المهام (نفس الهوية البصرية)
   ============================================================ */
.nav{gap:6px}
.nav .btn{padding:9px 15px}
.nav-end{margin-inline-start:auto;display:flex;gap:6px;align-items:center}
.nav .theme-btn{margin-inline-start:0}
.icon-btn{width:42px;height:42px;padding:0;justify-content:center;position:relative}
.icon-btn svg{width:19px;height:19px}
.badge{position:absolute;top:-4px;left:-4px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--coral);color:#fff;font:700 11px 'Tajawal';display:grid;place-content:center;box-shadow:0 2px 6px color-mix(in srgb,var(--coral) 40%,transparent)}
.avatar{width:34px;height:34px;border-radius:50%;display:inline-grid;place-content:center;color:#fff;font-weight:800;font-size:13px;flex:0 0 auto;overflow:hidden;background:var(--lavender);box-shadow:0 2px 8px rgba(0,0,0,.12)}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar.sm{width:24px;height:24px;font-size:10px}
.avatar.lg{width:64px;height:64px;font-size:24px}
.avatar.xl{width:96px;height:96px;font-size:36px}
.me-btn{padding:4px 12px 4px 4px;gap:9px}
.me-btn .avatar{width:32px;height:32px}
.me-btn span{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* اللون صريح: الاسم في رأس القائمة كان يرث لوناً داكناً فيختفي في الوضع الليلي */
.menu{position:absolute;z-index:40;min-width:220px;padding:8px;border-radius:18px;background:rgba(255,255,255,.94);backdrop-filter:blur(30px);border:1px solid var(--edge);box-shadow:0 24px 60px rgba(100,60,110,.25);display:none;color:var(--ink)}
.menu.on{display:block}
.menu button,.menu a{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:10px 12px;border-radius:12px;color:var(--ink);font:500 13.5px 'Tajawal';cursor:pointer;text-decoration:none;text-align:right}
.menu button:hover,.menu a:hover{background:color-mix(in srgb,var(--lavender) 16%,transparent)}
.menu .sep{height:1px;background:rgba(140,120,160,.16);margin:6px 4px}
.menu svg{width:17px;height:17px;color:var(--muted)}
.night .menu{background:rgba(35,29,50,.97)}
.night .menu button:hover,.night .menu a:hover{background:rgba(255,255,255,.1)}
.menu-anchor{position:relative}

/* مبدّل الأشخاص في الهيدر */
.people{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px;align-items:center}
.people .lbl{font-size:12px;color:var(--muted);margin-left:4px}
.pchip{display:inline-flex;align-items:center;gap:7px;padding:4px 12px 4px 4px;border-radius:99px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.45);cursor:pointer;font:500 12.5px 'Tajawal';color:var(--ink-2);transition:.18s}
.pchip:hover{background:rgba(255,255,255,.85);transform:translateY(-1px)}
.pchip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:transparent}
.pchip .avatar{width:24px;height:24px;font-size:10px}
.pchip b{font-family:'Tajawal';font-weight:600;font-size:11px;opacity:.8}
.night .pchip{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);color:var(--ink)}
.night .pchip[aria-pressed=true]{background:var(--lavender);color:#21182D}

/* شارة المالك على البطاقة */
.owner-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:99px;background:rgba(255,255,255,.65);font-size:11.5px;color:var(--ink-2)}
.owner-tag .avatar{width:20px;height:20px;font-size:9px}
.night .owner-tag{background:rgba(255,255,255,.12);color:#F7F3FF}
.tag.due{background:rgba(255,255,255,.65);color:var(--ink-2);font-family:'Tajawal';font-size:11px}
.tag.due.late{background:rgba(217,66,101,.14);color:#D94265;font-weight:700}
.tag.due.soon{background:rgba(245,166,35,.16);color:#C77F00;font-weight:700}
.tag.count{background:rgba(255,255,255,.55);color:var(--muted);font-size:11px;gap:3px}
.tag.count svg{width:12px;height:12px}
.night .tag.count,.night .tag.due{background:rgba(255,255,255,.12);color:#E8E1F2}

/* لوحة كانبان */
.board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:start}
.board-col{padding:12px;border-radius:18px;background:rgba(255,255,255,.34);border:1px solid rgba(255,255,255,.6);min-height:160px}
.board-col.drop-target{outline:2px dashed var(--lavender);outline-offset:2px}
.board-head{display:flex;align-items:center;gap:8px;font-weight:800;font-size:13.5px;margin-bottom:10px}
.board-head i{width:9px;height:9px;border-radius:50%}
.board-head b{margin-right:auto;font-family:'Tajawal';font-weight:600;color:var(--muted);font-size:12px}
.board .item{padding:11px 12px;margin-bottom:8px;cursor:grab;background:rgba(255,255,255,.62);border-radius:14px}
.board .item h3{font-size:13.5px;line-height:1.45}
.board .it-meta{margin-top:6px;gap:5px}
.board .tag{font-size:10.5px;padding:3px 8px}
.board .ring{width:32px;height:32px}.board .ring svg{width:32px;height:32px}.board .ring span{font-size:9.5px}
.board .eye{padding:4px}
.board .owner-tag{font-size:10.5px}
.board .tag.date{display:none}
.board-col{padding:10px}
.board-head{font-size:13px}
@media(max-width:1000px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
.night .board-col{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}
.night .board .item{background:rgba(255,255,255,.08)}

/* بروفايل المهمة: تعليقات ونشاط */
.section-title{margin:18px 0 8px;font-size:13px;font-weight:800;color:var(--ink-2);display:flex;align-items:center;gap:8px}
.section-title b{font-family:'Tajawal';font-weight:600;color:var(--muted);font-size:11px}
.comments{display:flex;flex-direction:column;gap:8px}
.comment{display:flex;gap:10px;align-items:flex-start}
.comment .bubble{flex:1;padding:10px 13px;border-radius:14px;background:rgba(255,255,255,.55);font-size:13px;line-height:1.75;color:var(--ink-2);white-space:pre-wrap;word-break:break-word}
.comment .who{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);margin-bottom:3px}
.comment .who b{color:var(--ink);font-weight:700}
.comment.mine .bubble{background:color-mix(in srgb,var(--lavender) 18%,transparent)}
.comment-box{display:flex;gap:8px;margin-top:10px;align-items:flex-end}
.comment-box textarea{flex:1;min-height:44px;max-height:160px;resize:vertical}
.activity{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted)}
.activity div{display:flex;gap:8px;align-items:baseline}
.activity time{font-family:'Tajawal';font-size:10.5px;flex:0 0 auto}
.activity b{color:var(--ink-2);font-weight:600}
.night .comment .bubble{background:rgba(255,255,255,.08);color:#E8E1F2}
.night .comment.mine .bubble{background:color-mix(in srgb,var(--lavender) 22%,transparent)}
.night .comment .who b{color:#fff}
.att-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:10px}
.att-card{position:relative;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7);cursor:pointer;transition:.18s}
.att-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.att-thumb{height:110px;display:grid;place-content:center;background:color-mix(in srgb,var(--lavender) 14%,transparent);overflow:hidden}
.att-thumb img{width:100%;height:110px;object-fit:cover;display:block}
.att-thumb .ext{font:800 15px 'Tajawal';color:#fff;padding:9px 13px;border-radius:12px;background:var(--plum);letter-spacing:.5px;text-transform:uppercase}
.att-body{padding:8px 10px}
.att-name{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-meta{font-size:10.5px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-meta i{font-style:normal;font-family:'Tajawal'}
.att-x{position:absolute;top:6px;left:6px;width:26px;height:26px;border:0;border-radius:8px;background:rgba(23,19,38,.6);color:#fff;cursor:pointer;font-size:15px;line-height:1;opacity:0;transition:.15s}
.att-card:hover .att-x{opacity:1}
.night .att-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12)}
.dropzone{margin-top:8px;padding:14px;border:2px dashed color-mix(in srgb,var(--lavender) 55%,transparent);border-radius:14px;text-align:center;color:var(--muted);font-size:12.5px;cursor:pointer;transition:.18s}
.dropzone:hover,.dropzone.over{background:color-mix(in srgb,var(--lavender) 12%,transparent);border-color:var(--lavender);color:var(--ink)}
.dropzone input{display:none}

/* صفحة المرفقات */
.files-page .att-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.files-page .att-thumb{height:140px}
.files-page .att-thumb img{height:140px}
.lightbox{width:min(1100px,96vw)}
.lightbox .sheet{padding:14px}
.lightbox .lb-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;font-size:13px}
.lightbox .lb-head b{font-weight:700}
.lightbox .lb-body{display:grid;place-content:center;min-height:200px;max-height:78vh;overflow:auto;border-radius:16px;background:rgba(0,0,0,.05)}
.lightbox img{max-width:100%;max-height:76vh;border-radius:12px}
.lightbox iframe{width:min(1060px,92vw);height:76vh;border:0;border-radius:12px;background:#fff}

/* صفحة الفريق */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.member{padding:18px}
.member-top{display:flex;gap:12px;align-items:center}
.member-top h3{margin:0;font-size:16px}
.member-top .role{font-size:11.5px;color:var(--muted)}
.member-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 10px}
.member-stats div{padding:9px 6px;border-radius:12px;background:rgba(255,255,255,.5);text-align:center;font-size:11px;color:var(--muted)}
.member-stats b{display:block;font:800 18px 'Tajawal';color:var(--ink);margin-bottom:2px}
.member-stats .bad b{color:#D94265}
.night .member-stats div{background:rgba(255,255,255,.07)}
.member .track{height:8px;border-radius:99px;background:rgba(255,255,255,.65);overflow:hidden;margin-bottom:12px}
.member .track i{display:block;height:100%;border-radius:99px}
.role-pill{font-size:10.5px;padding:2px 9px;border-radius:99px;background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum);font-weight:700}
.role-pill.admin{background:color-mix(in srgb,var(--coral) 14%,transparent);color:var(--coral)}
.role-pill.supervisor{background:color-mix(in srgb,var(--mint) 16%,transparent);color:#0A8F78}
.night .role-pill{background:color-mix(in srgb,var(--lavender) 22%,transparent);color:#E2D6FF}

/* صفحة الإدارة */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.table{width:100%;border-collapse:separate;border-spacing:0 6px;font-size:13px}
.table th{text-align:right;font-size:11.5px;color:var(--muted);font-weight:600;padding:4px 12px}
.table td{padding:10px 12px;background:rgba(255,255,255,.5);vertical-align:middle}
.table tr td:first-child{border-radius:0 14px 14px 0}
.table tr td:last-child{border-radius:14px 0 0 14px}
.table .name{display:flex;align-items:center;gap:10px;font-weight:700}
.table .name small{display:block;font-weight:400;color:var(--muted);font-size:11px}
.table .acts-cell{white-space:nowrap;text-align:left}
.table .acts-cell .btn{margin-inline-start:4px}
.night .table td{background:rgba(255,255,255,.07)}
.table-wrap{overflow-x:auto}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:5px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:13px;align-items:center}
.kv span{color:var(--muted);font-size:12px}
.kv code{font-family:'Tajawal',monospace;font-size:12px;word-break:break-all;background:rgba(255,255,255,.55);padding:6px 10px;border-radius:10px}
.night .kv code{background:rgba(255,255,255,.08)}
.switch{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(140,120,160,.12);font-size:13.5px}
.switch small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.switch input{width:42px;height:24px;appearance:none;background:rgba(140,120,160,.3);border-radius:99px;position:relative;cursor:pointer;transition:.2s;flex:0 0 auto}
.switch input:before{content:'';position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.switch input:checked{background:var(--mint)}
.switch input:checked:before{transform:translateX(-18px)}

/* الأداء */
.period-tabs{display:flex;gap:6px;flex-wrap:wrap}
.stat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.tile{padding:16px 18px}
.tile span{font-size:12px;color:var(--muted)}
.tile b{display:block;font:800 30px 'Tajawal';letter-spacing:-1px;line-height:1.1;margin-top:4px}
.perf-row{display:grid;grid-template-columns:200px 1fr 90px;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(140,120,160,.12)}
.perf-row:last-child{border-bottom:0}
.perf-who{display:flex;align-items:center;gap:10px;min-width:0}
.perf-who div{min-width:0}
.perf-who h4{margin:0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.perf-who small{color:var(--muted);font-size:11px}
.perf-nums{text-align:left;font-family:'Tajawal';font-size:12px;color:var(--muted);line-height:1.5}
.perf-nums b{display:block;font-size:22px;font-weight:800;color:var(--ink);line-height:1.1}
.spark{width:100%;height:46px;display:block}
.chart-svg{width:100%;height:auto;display:block}
.chart-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);margin-top:8px}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.chart-legend i{width:10px;height:10px;border-radius:3px}
@media(max-width:700px){.perf-row{grid-template-columns:1fr 80px}.perf-row .spark-wrap{grid-column:1/-1}}

/* صفحة الدخول */
.login-wrap{min-height:100vh;display:grid;place-content:center;padding:24px 16px}
.login-card{width:min(440px,92vw);padding:34px 32px}
.login-card h1{font-size:30px}
.login-card .sub{margin-bottom:24px}
.login-card .btn{width:100%;justify-content:center;padding:13px}
.login-card .link{display:block;margin:14px auto 0}
.err{background:rgba(217,66,101,.12);color:#D94265;padding:10px 14px;border-radius:12px;font-size:13px;margin-bottom:12px;display:none}
.err.on{display:block}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:13px;color:var(--muted)}
.brand i{width:36px;height:36px;border-radius:12px;background:linear-gradient(115deg,var(--coral),var(--plum));display:grid;place-content:center;color:#fff;font:800 16px 'Tajawal'}

/* الإشعارات */
.notif-list{display:flex;flex-direction:column;gap:6px;max-height:60vh;overflow:auto}
.notif{display:flex;gap:10px;padding:11px 13px;border-radius:14px;background:rgba(255,255,255,.5);cursor:pointer;transition:.15s;align-items:flex-start}
.notif:hover{background:rgba(255,255,255,.85)}
.notif.unread{background:color-mix(in srgb,var(--lavender) 18%,transparent)}
.notif .ic{width:34px;height:34px;border-radius:12px;display:grid;place-content:center;flex:0 0 auto;font-size:16px;background:rgba(255,255,255,.7)}
.notif .t{font-size:13px;font-weight:700;color:var(--ink)}
.notif .b{font-size:12px;color:var(--ink-2);margin-top:2px;line-height:1.6}
.notif time{font-family:'Tajawal';font-size:10.5px;color:var(--muted);display:block;margin-top:3px}
.night .notif{background:rgba(255,255,255,.07)}
.night .notif.unread{background:color-mix(in srgb,var(--lavender) 20%,transparent)}
.night .notif:hover{background:rgba(255,255,255,.13)}

/* عام */
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
.muted{color:var(--muted)}
.small{font-size:12px}
.mt{margin-top:14px}
.hidden{display:none!important}
.skeleton{height:120px;border-radius:18px;background:linear-gradient(90deg,rgba(255,255,255,.35),rgba(255,255,255,.7),rgba(255,255,255,.35));background-size:200% 100%;animation:sk 1.2s infinite}
@keyframes sk{to{background-position:-200% 0}}
.loading-veil{position:fixed;inset:0;display:grid;place-content:center;z-index:98;background:rgba(251,243,242,.7);backdrop-filter:blur(8px);font-size:14px;color:var(--muted)}
.night .loading-veil{background:rgba(16,13,22,.7)}
.night .table .name,.night .att-name,.night .tile b,.night .member-top h3,.night .perf-who h4,.night .notif .t{color:#F7F3FF}
.night .fld-in::placeholder{color:#8F86A3}
.night .board-head,.night .section-title{color:#E8E1F2}
.night .comment-box textarea{color:var(--ink)}
.night .kv,.night .switch{color:#E8E1F2}
.night .lightbox .lb-body{background:rgba(255,255,255,.05)}
.night .att-thumb{background:color-mix(in srgb,var(--lavender) 12%,transparent)}
.night .dropzone{border-color:color-mix(in srgb,var(--lavender) 40%,transparent)}
@media(max-width:620px){.nav .btn:not(.icon-btn):not(.me-btn){padding:8px 11px;font-size:12.5px}.me-btn span{display:none}.hero{padding:20px 18px}.board{grid-template-columns:1fr}}
.avatar svg{width:16px;height:16px;color:#fff}
@media(max-width:700px){.list.grid-view{grid-template-columns:1fr}.grid-view .item{height:auto;min-height:0}.grid-view .notes{max-height:160px}.team-grid{grid-template-columns:1fr}.stat-tiles{grid-template-columns:1fr 1fr}.grid[style]{grid-template-columns:1fr!important}}
/* سجلات الفريق وسجل النشاط */
#logsList .item{height:auto;min-height:0}
#logsList .notes{max-height:150px}
#logsList .drag-handle{display:none}
.feed{display:flex;flex-direction:column;gap:6px}
.feed-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.5)}
.feed-row .what{flex:1;font-size:13px;line-height:1.7;color:var(--ink-2)}
.feed-row .what b{color:var(--ink);font-weight:700}
.feed-row .what a{color:var(--coral);text-decoration:none;font-weight:600}
.feed-row .what a:hover{text-decoration:underline}
.feed-row time{font-family:'Tajawal';font-size:10.5px;color:var(--muted);white-space:nowrap;padding-top:4px}
.feed-row .act{display:inline-block;font-size:10.5px;padding:2px 8px;border-radius:99px;background:color-mix(in srgb,var(--lavender) 18%,transparent);color:var(--plum);margin-left:6px;font-weight:700}
.feed-day{font-size:12px;font-weight:800;color:var(--muted);margin:14px 0 4px}
.night .feed-row{background:rgba(255,255,255,.07)}
.night .feed-row .what b{color:#fff}

/* ============ تباين الوضع الليلي ============ */
:root.night{--ink-2:#E2DBEE;--muted:#B9B0CB}
.night .hint,.night .sub,.night .pcount,.night .att-meta,.night .perf-nums,.night .member-stats div,.night .tile span,.night .table th,.night .feed-row time,.night .notif time,.night .activity{color:#B9B0CB}
.night .table td,.night .feed-row .what,.night .kv,.night .switch,.night .perf-nums b,.night .member-stats b,.night .stat-tiles b,.night .comment .bubble{color:#F1ECF8}
.night .fld-in,.night select.fld-in,.night textarea.fld-in{color:#F7F3FF;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18)}
.night select.fld-in option{background:#241d33;color:#F7F3FF}
.night .tag.date,.night .tag.due,.night .tag.count,.night .owner-tag{color:#F1ECF8}
.night .tag.due.late{color:#FF8FA8}.night .tag.due.soon{color:#FFC86B}
.night .cal-num,.night .cal-weekday,.night .cal-more{color:#D7D0E3}
.night .cal-filter{color:#E2DBEE}
.night .chip{color:#E8E1F2}
.night .link{color:#C8BCD8}.night .link:hover{color:#FFB39A}
.night .empty{color:#B9B0CB}
.night .profile-stat{background:color-mix(in srgb,var(--lavender) 16%,transparent)}
.night .att-card .att-name{color:#F7F3FF}
.night .dropzone{color:#D7D0E3}
.night .board-head b,.night .section-title b{color:#B9B0CB}
.night .spine{background:rgba(255,255,255,.12)}
.night .pbar .track,.night .member .track{background:rgba(255,255,255,.12)}
.night .tl-name{color:#E2DBEE}
.night .bars .lbl,.night .bars .num{color:#D7D0E3}
.night .legend div{color:#E2DBEE}
.night .big span{color:#B9B0CB}
.night .feed-day{color:#C8BCD8}
.night .err{background:rgba(217,66,101,.25);color:#FFB3C4}
.night .role-pill.admin{background:color-mix(in srgb,var(--coral) 25%,transparent);color:#FFB39A}
.night .role-pill.supervisor{background:color-mix(in srgb,var(--mint) 25%,transparent);color:#7FE9D3}

/* ============ المرفقات ============ */
.dropzone{display:block;width:100%;margin-top:12px;padding:16px;font-weight:600}
#pAtt{margin-top:8px}
#pAtt .muted{padding:6px 2px}
@media(hover:none){.att-x{opacity:1;background:rgba(23,19,38,.75)}.drag-handle{display:none}}

/* ============ الجوال ============ */
.bottom-nav{display:none}
.fab{display:none}
.sheet{max-height:min(88vh,88dvh);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.more-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.more-grid .btn{justify-content:center;padding:13px}
.cal-day.selected{box-shadow:inset 0 0 0 2px var(--lavender);background:color-mix(in srgb,var(--lavender) 14%,transparent)}
.cal-day{cursor:pointer}
.cal-agenda .item{padding:12px 14px}
@media(max-width:700px){
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
  .wrap{padding:12px 12px 40px}
  .hero{padding:16px 16px 14px;margin-bottom:12px}
  .nav{display:none}
  .hero-top{gap:10px}
  .big b{font-size:44px;letter-spacing:-2px}
  .spine{margin-top:12px;height:9px}
  .chips{gap:6px;margin-top:12px}
  .chip{padding:7px 11px;font-size:12px}
  .grid{gap:12px;margin-bottom:12px}
  .panel{padding:16px}
  .panel h2{font-size:16px}
  .bar-tools{padding:10px;gap:7px}
  .bar-tools .fld-in{flex:1 1 45%;min-width:0}
  .bar-tools #q{flex-basis:100%}
  .bar-tools .btn{flex:1 1 auto;justify-content:center}
  #add{display:none}
  .view-tools{width:100%;justify-content:flex-start}
  .grid-count{display:none}
  .fld-in{font-size:16px;padding:12px 14px}
  .btn{padding:12px 18px;font-size:14px}
  .btn.tiny{padding:9px 14px;font-size:13px}
  .icon-btn,.theme-btn{width:44px;height:44px}
  .item{padding:14px}
  .it-title h3{font-size:15px}
  .notes{font-size:13.5px}
  .acts .done-icon{width:44px;height:38px}
  .drag-handle{display:none}
  /* التقويم: نقاط بدل النصوص + أجندة اليوم */
  .calendar{gap:3px}
  .cal-day{min-height:52px;padding:5px 4px;border-radius:9px;display:flex;flex-direction:column;align-items:center}
  .cal-num{font-size:12px;margin-bottom:3px}
  .cal-day .cal-task{width:7px;height:7px;min-height:0;padding:0;margin:2px 1px 0;border:0;border-radius:50%;background:var(--task-color);font-size:0;display:inline-block}
  .cal-day .cal-task.hidden{opacity:.4}
  .cal-more{font-size:9px;margin-top:2px}
  .calendar-head{flex-wrap:wrap}
  .cal-filters{gap:5px}.cal-filter{padding:6px 10px;font-size:11.5px}
  /* الحوارات كورقة سفلية */
  dialog{width:100%;max-width:100%;inset:auto 0 0 0;margin:0;padding:0}
  dialog::backdrop{background:rgba(40,25,50,.45)}
  .sheet{border-radius:22px 22px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));max-height:92dvh}
  .sheet h3{font-size:18px;margin-bottom:14px}
  .foot{position:sticky;bottom:calc(-20px - env(safe-area-inset-bottom));background:rgba(255,255,255,.96);margin:14px -18px -20px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));border-radius:0}
  .night .foot{background:rgba(35,29,50,.98)}
  .foot .r{flex:1;justify-content:flex-end}
  .foot .r .btn{flex:1;justify-content:center}
  .lightbox .lb-body{max-height:70dvh}
  .lightbox iframe{width:100%;height:70dvh}
  .profile-grid{grid-template-columns:1fr 1fr}
  .step-row{grid-template-columns:1fr 28px}
  .step-row .step-date{grid-column:1/-1}
  /* شريط سفلي وزر عائم */
  .bottom-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:rgba(255,255,255,.86);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid rgba(255,255,255,.8);box-shadow:0 -8px 30px rgba(120,80,120,.12)}
  .night .bottom-nav{background:rgba(28,22,40,.92);border-top-color:rgba(255,255,255,.1)}
  .bottom-nav button{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 4px;border-radius:14px;color:var(--muted);font:600 11px 'Tajawal';cursor:pointer}
  .bottom-nav button svg{width:22px;height:22px}
  .bottom-nav button[aria-pressed=true]{color:var(--coral);background:color-mix(in srgb,var(--coral) 10%,transparent)}
  .fab{display:grid;place-content:center;position:fixed;left:16px;bottom:calc(82px + env(safe-area-inset-bottom));z-index:61;width:56px;height:56px;border:0;border-radius:50%;background:linear-gradient(115deg,var(--coral),color-mix(in srgb,var(--coral) 82%,white));color:#fff;font-size:30px;line-height:1;box-shadow:0 12px 30px color-mix(in srgb,var(--coral) 40%,transparent);cursor:pointer}
  .fab:active{transform:scale(.94)}
  .toast{left:16px;right:16px;bottom:calc(86px + env(safe-area-inset-bottom));text-align:center;border-radius:16px}
  .team-grid,.stat-tiles{grid-template-columns:1fr 1fr}
  .stat-tiles{gap:8px}.tile{padding:12px 14px}.tile b{font-size:24px}
  .perf-row{grid-template-columns:1fr auto;gap:8px}.perf-row .spark-wrap{grid-column:1/-1}
  .people{gap:5px}.pchip{padding:3px 10px 3px 3px;font-size:12px}
  .table th,.table td{padding:8px}
  .files-page .att-grid{grid-template-columns:1fr 1fr;gap:10px}
  .files-page .att-thumb,.files-page .att-thumb img{height:110px}
  .menu{left:auto;right:0}
}
@media(max-width:380px){.team-grid,.stat-tiles{grid-template-columns:1fr}.files-page .att-grid{grid-template-columns:1fr}}
dialog:focus,dialog:focus-visible{outline:none}

/* ============ المشاريع ============ */
.pf-grid{display:grid;grid-template-columns:repeat(var(--pf-cols,3),minmax(0,1fr));gap:16px;align-items:start}
.pf-list{display:flex;flex-direction:column;gap:10px}
.pf-card{padding:11px 11px 15px;cursor:pointer;display:flex;flex-direction:column;transition:.2s;border-radius:18px}
.pf-card:hover,.pf-row:hover{transform:translateY(-3px);background:rgba(255,255,255,.74);box-shadow:0 18px 46px rgba(120,80,120,.18)}
.night .pf-card:hover,.night .pf-row:hover{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 18px 46px rgba(0,0,0,.35)}
.pf-cover{position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(145deg,#FFD3C2 0%,#F6D8EC 38%,#DCCBF8 72%,#C9EFE6 100%)}
.pf-cover::after{content:"";position:absolute;inset:0;background:radial-gradient(120px 90px at 22% 18%,rgba(255,255,255,.55),transparent 70%)}
.pf-cover img{width:100%;height:100%;display:block}
.pf-letter{position:relative;z-index:1;font:900 56px 'Tajawal';color:color-mix(in srgb,var(--plum) 42%,transparent);letter-spacing:-2px}
.pf-code{position:absolute;z-index:2;top:9px;inset-inline-end:10px;font:700 11px 'Tajawal';padding:3px 9px;border-radius:99px;background:rgba(255,255,255,.8);color:var(--plum);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.7)}
.pf-st{position:absolute;z-index:2;top:9px;inset-inline-start:10px;background:rgba(255,255,255,.85)!important;backdrop-filter:blur(8px);font-size:11px;border:1px solid rgba(255,255,255,.7)}
.night .pf-cover{background:linear-gradient(145deg,#3A2436 0%,#2C2140 45%,#1E2A33 100%)}
.night .pf-cover::after{background:radial-gradient(120px 90px at 22% 18%,rgba(255,255,255,.09),transparent 70%)}
.night .pf-letter{color:rgba(201,174,247,.32)}
.night .pf-code{background:rgba(20,20,30,.7);color:#F7F3FF}
.night .pf-st{background:rgba(20,20,30,.72)!important}
.pf-body{padding:13px 6px 0;display:flex;flex-direction:column;gap:8px;flex:1}
.pf-head{display:flex;align-items:flex-start;gap:8px}
.pf-head h3{margin:0;font-size:16px;font-weight:700;line-height:1.5;flex:1}
.pf-cat{font-size:11px;color:var(--muted);white-space:nowrap;padding-top:3px}
.pf-desc{margin:0;font-size:12.5px;color:var(--ink-2);line-height:1.75;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}
.pf-prog{display:flex;align-items:center;gap:10px}
.pf-prog b{font-size:12.5px;font-weight:700;min-width:34px;text-align:left}
.track{flex:1;height:8px;border-radius:99px;background:rgba(255,255,255,.65);overflow:hidden}
.track i{display:block;height:100%;border-radius:99px;transition:width .4s}
.night .track{background:rgba(255,255,255,.12)}
.pf-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:10px;border-top:1px solid rgba(140,120,160,.14)}
.pf-people{display:flex;align-items:center}
.pf-people .avatar{margin-inline-start:-7px;border:2px solid var(--glass)}
.pf-people .avatar:first-child{margin:0}
.pf-more{font:600 10.5px 'Tajawal';color:var(--muted);margin-inline-start:4px}
.pf-health{font-size:11.5px;font-weight:700;color:#C77F00}
.pf-health.bad{color:#D94265}
.pf-row{display:grid;grid-template-columns:110px 1.3fr 1.5fr 150px auto auto;gap:14px;align-items:center;padding:10px 14px;cursor:pointer}
.pf-row .pf-cover.thumb{aspect-ratio:16/10;border-radius:11px}
.pf-row .pf-cover.thumb .pf-code,.pf-row .pf-cover.thumb .pf-st{display:none}
.pf-row .pf-letter{font-size:26px}
.pf-row h3{margin:0;font-size:15px;font-weight:800}
.pf-row-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.6}
.pf-row-prog{display:flex;flex-direction:column;gap:5px}
.alerts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.alert{font-size:12.5px;padding:7px 13px;border-radius:99px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.55);font-weight:600;display:inline-flex;align-items:center;gap:7px;cursor:pointer;color:var(--ink-2);font-family:inherit;transition:.18s}
.alert::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.alert.bad{color:#D94265}.alert.warn{color:#C77F00}
.alert:hover{transform:translateY(-2px);background:rgba(255,255,255,.85)}
.night .alert{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#E2DBEE}
.night .alert.bad{color:#FF8FA8}.night .alert.warn{color:#FFC86B}
/* صفحة المشروع */
.crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:12px}
.crumb .link{padding:0}
.pf-hero{display:grid;grid-template-columns:1.3fr .9fr;gap:20px;padding:24px 26px;align-items:center;margin-bottom:16px}
.pf-hero h1{margin:14px 0 2px;font-size:clamp(24px,3.2vw,34px);font-weight:900;letter-spacing:-.8px;line-height:1.2}
.pf-hero .sub{margin:0;font-size:13.5px}
.pf-hero-img .pf-cover.big{aspect-ratio:16/10;border-radius:18px;box-shadow:var(--shadow)}
.pf-lead{margin:0;font-size:15px;line-height:1.95;color:var(--ink-2)}
.tile.bad b{color:#D94265}.tile.warn b{color:#C77F00}.tile.ok b{color:var(--mint)}
.tile span+span{display:block;margin-top:4px}
.pf-comp{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
.pf-comp-i{display:flex;align-items:center;gap:9px;padding:10px 13px;border-radius:12px;background:rgba(255,255,255,.5);font-size:13.5px;color:var(--ink-2);border:1px solid rgba(255,255,255,.6);text-decoration:none;line-height:1.6}
.pf-comp-i i{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--coral),var(--plum));flex:0 0 auto}
.pf-comp-i.link-i{color:var(--ink);font-weight:600;cursor:pointer;transition:.18s}
.pf-comp-i.link-i:hover{border-color:var(--lavender);box-shadow:0 0 0 1px var(--lavender)}
.pf-comp-i .go{margin-inline-start:auto;color:var(--muted);font-size:12px}
.night .pf-comp-i{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1);color:#E2DBEE}
.docs{display:grid;gap:9px;margin-top:6px}
.doc{display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:14px;background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.62);text-decoration:none;transition:.18s}
.doc:hover{transform:translateX(-3px);border-color:var(--lavender);box-shadow:0 0 0 1px var(--lavender)}
.doc.dim{opacity:.55}
.doc-ic{width:40px;height:40px;border-radius:12px;display:grid;place-content:center;font:800 12px 'Tajawal';color:#fff;flex:0 0 auto}
.doc-t{flex:1;min-width:0}
.doc-t b{display:block;font-size:13.5px;color:var(--ink);font-weight:700}
.doc-t small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc .go{font-size:12.5px;color:var(--coral);font-weight:700;white-space:nowrap}
.doc-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap;font-size:13px}
.doc-meta .due{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:99px;background:rgba(140,120,160,.14);color:var(--muted)}
.doc-meta .due.bad{background:rgba(217,66,101,.14);color:#D94265}
.doc-meta .due.warn{background:rgba(245,166,35,.16);color:#C77F00}
.doc-meta .due.ok{background:color-mix(in srgb,var(--mint) 14%,transparent);color:#0A8F78}
.night .doc{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.night .doc-t b{color:#F7F3FF}
.pf-sum{display:flex;flex-wrap:wrap;gap:8px 18px;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--lavender) 16%,transparent);font-size:12.5px;color:var(--plum);font-weight:700;margin-bottom:10px}
.pf-sum b{color:var(--ink)}
.night .pf-sum{color:#E2D6FF}.night .pf-sum b{color:#fff}
.pf-team{display:flex;flex-wrap:wrap;gap:7px;margin-top:6px}
.pf-rel{display:flex;flex-direction:column;gap:7px}
.pf-rel-i{display:flex;align-items:center;gap:9px;width:100%;padding:10px 12px;border-radius:13px;border:1px solid rgba(255,255,255,.62);background:rgba(255,255,255,.5);font:700 13px 'Tajawal';color:var(--ink);cursor:pointer;text-align:right;transition:.18s}
.pf-rel-i:hover{transform:translateX(-3px);border-color:var(--lavender)}
.pf-rel-i .k{font-size:10.5px;padding:2px 8px;border-radius:7px;background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum);font-weight:700}
.pf-rel-i .k.child{background:color-mix(in srgb,var(--mint) 16%,transparent);color:#0A8F78}
.pf-rel-i .k.sib{background:rgba(90,184,240,.16);color:#2A7FB8}
.night .pf-rel-i{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1);color:#F1ECF8}
.pf-miss{display:flex;flex-wrap:wrap;gap:6px}
.pf-miss span{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:99px;background:rgba(217,66,101,.12);color:#D94265}
.night .pf-miss span{background:rgba(217,66,101,.22);color:#FF9FB0}
.pf-prev{width:150px;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:color-mix(in srgb,var(--lavender) 16%,transparent);display:grid;place-items:center;flex:0 0 auto}
.pf-prev img{width:100%;height:100%;object-fit:cover}
.addon-r{display:grid;grid-template-columns:1.1fr 1.4fr 1fr 1fr 90px 130px 28px;gap:7px;align-items:center;margin-top:7px}
.addon-r .fld-in{min-width:0;font-size:12.5px;padding:8px 10px}
.doc-r{display:grid;grid-template-columns:1.1fr 1.4fr 1.4fr 130px 28px;gap:7px}
.comp-r{display:grid;grid-template-columns:1fr 1fr 28px;gap:7px}
.pick-list{display:flex;flex-wrap:wrap;gap:6px;max-height:132px;overflow:auto;padding:2px}
.pick{border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.45);border-radius:99px;padding:6px 13px;font:500 12.5px 'Tajawal';color:var(--ink-2);cursor:pointer;transition:.16s}
.pick:hover{background:rgba(255,255,255,.85)}
.pick[aria-pressed=true]{background:var(--plum);color:#fff;border-color:transparent;font-weight:700}
.night .pick{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);color:#E2DBEE}
.night .pick[aria-pressed=true]{background:var(--lavender);color:#21182D}
.tag.pf-tag{background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum);font-weight:600;cursor:pointer}
.night .tag.pf-tag{background:color-mix(in srgb,var(--lavender) 24%,transparent);color:#E2D6FF}
.grow{flex:1;min-width:0}
@media(max-width:1000px){.pf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pf-hero{grid-template-columns:1fr}.pf-hero-img{order:-1}.pf-row{grid-template-columns:88px 1fr auto}.pf-row-desc,.pf-row-prog{display:none}}
@media(max-width:700px){.pf-grid{grid-template-columns:1fr}.pf-comp{grid-template-columns:1fr}.addon-r,.doc-r,.comp-r{grid-template-columns:1fr 1fr}.addon-r .remove-item,.doc-r .remove-item,.comp-r .remove-item{grid-column:1/-1;width:100%}.pf-hero{padding:18px}.doc-meta{align-items:flex-end}}
[hidden]{display:none!important}
@media(max-width:700px){.stat-tiles>:last-child:nth-child(odd){grid-column:1/-1}}

/* ============ لوحة الفريق ============ */
.mem-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.mem{padding:16px 18px;cursor:pointer;transition:.2s;border:1px solid transparent}
.mem:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.mem.on{border-color:var(--lavender);box-shadow:0 0 0 1px var(--lavender)}
.mem:not(.on){opacity:.62}
.mem-top{display:flex;align-items:center;gap:12px}
.mem-id{flex:1;min-width:0}
.mem-id h3{margin:0;font-size:15.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mem-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 10px}
.mem-nums div{padding:9px 6px;border-radius:12px;background:rgba(255,255,255,.5);text-align:center}
.mem-nums b{display:block;font-size:19px;font-weight:800;line-height:1.1}
.mem-nums span{font-size:10.5px;color:var(--muted)}
.night .mem-nums div{background:rgba(255,255,255,.07)}
.mem-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(140,120,160,.14)}
.mem .spark{width:100%;height:34px;display:block}
/* صفحة المشروع */
.pf-cols{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;align-items:start;margin-top:16px}
.pf-hero{grid-template-columns:.85fr 1.15fr;gap:24px}
.pf-hero-num{display:flex;gap:22px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid rgba(140,120,160,.14)}
.pf-hero-num div{display:flex;flex-direction:column;gap:1px}
.pf-hero-num b{font-size:24px;font-weight:800;line-height:1.1}
.pf-hero-num span{font-size:11.5px;color:var(--muted)}
.pf-hero .pf-lead{margin-top:10px;font-size:14px;line-height:1.85}
.pf-tasks{display:flex;flex-direction:column;gap:6px}
.pf-task{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border-radius:12px;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.5);cursor:pointer;font:inherit;text-align:right;transition:.16s}
.pf-task:hover{border-color:var(--lavender);transform:translateX(-2px)}
.pf-task i{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.pf-task .t{flex:1;min-width:0;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-task b{font-size:11.5px;color:var(--muted);font-weight:700}
.night .pf-task{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.night .pf-task .t{color:#F1ECF8}
.pf-mini{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-top:10px;padding-top:10px;border-top:1px solid rgba(140,120,160,.14)}
.pf-filter-bar{padding:10px 16px;margin-bottom:12px;border-radius:14px;background:color-mix(in srgb,var(--lavender) 16%,transparent);font-size:13px;color:var(--plum);font-weight:600}
.pf-filter-bar b{color:var(--ink)}
.night .pf-filter-bar{color:#E2D6FF}.night .pf-filter-bar b{color:#fff}
/* قائمة الحساب */
.menu{min-width:238px;padding:9px;top:52px}
.menu button,.menu a{white-space:nowrap;font-size:13.5px;padding:11px 12px}
.menu svg{flex:0 0 auto}
.me-btn:focus-visible{outline:2px solid var(--lavender);outline-offset:2px}
.menu-anchor{position:relative;z-index:70}
@media(max-width:1000px){.pf-cols{grid-template-columns:1fr}.pf-hero{grid-template-columns:1fr}.pf-hero-img{order:-1}}
@media(max-width:700px){.mem-grid{grid-template-columns:1fr}.pf-hero-num{gap:16px}.pf-hero-num b{font-size:20px}#dbTasks{--grid-cols:1!important}}
/* الترويسة فوق البطاقات حتى لا تختفي قائمة الحساب خلفها */
.hero{position:relative;z-index:40}
.menu{box-shadow:0 24px 60px rgba(100,60,110,.32),0 0 0 1px rgba(140,120,160,.12)}
.night .menu{box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08)}

/* ============ حركة إنجاز المهمة ============ */
@keyframes taskDone{0%{transform:none;opacity:1}35%{transform:scale(.985)}100%{transform:translateX(-14%) scale(.94);opacity:0;max-height:0;margin:0;padding-top:0;padding-bottom:0}}
.item.completing{animation:taskDone .52s cubic-bezier(.4,0,.2,1) forwards;overflow:hidden;pointer-events:none}
.toast.undo{display:flex;align-items:center;gap:14px;padding:11px 14px 11px 20px;pointer-events:auto}
.toast .undo-btn{border:0;border-radius:99px;padding:7px 15px;background:rgba(255,255,255,.2);color:inherit;font:700 13px 'Tajawal';cursor:pointer;transition:.15s}
.toast .undo-btn:hover{background:rgba(255,255,255,.34)}
.toast .undo-bar{position:absolute;bottom:0;inset-inline-start:0;height:3px;border-radius:0 0 99px 99px;background:var(--mint);animation:undoBar 5s linear forwards}
@keyframes undoBar{from{width:100%}to{width:0}}
.toast{position:fixed;overflow:hidden}
.chip.done-chip[aria-pressed=true]{background:var(--mint);color:#0A3F35;border-color:transparent}
.chip.done-chip i{background:var(--mint)}
.today-strip{display:flex;align-items:center;gap:10px;padding:10px 15px;border-radius:14px;background:linear-gradient(115deg,color-mix(in srgb,var(--mint) 16%,transparent),color-mix(in srgb,var(--lavender) 14%,transparent));font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:14px}
.today-strip b{font-size:17px;color:var(--mint)}
.today-strip span{color:var(--muted);font-weight:500;font-size:12.5px}
.night .today-strip{background:linear-gradient(115deg,color-mix(in srgb,var(--mint) 20%,transparent),color-mix(in srgb,var(--lavender) 18%,transparent));color:#F1ECF8}

/* رأس البطاقة لا يفيض على الشاشات الضيقة */
.panel > .row > div:first-child{min-width:0;flex:1 1 190px}
.panel > .row > div:first-child .hint{white-space:normal;overflow-wrap:anywhere}

/* ============ المدونة ============ */
.notes-slider{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:14px}
.notes-slider.is-slider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;cursor:grab}
.notes-slider.is-slider::-webkit-scrollbar{display:none}
.notes-slider.is-slider.grabbing{cursor:grabbing;scroll-snap-type:none}
.notes-slider.is-slider .note{flex:0 0 296px;scroll-snap-align:start}
.note{position:relative;display:flex;flex-direction:column;gap:9px;padding:15px 16px 14px;border-radius:18px;background:rgba(255,255,255,.58);border:1px solid rgba(255,255,255,.72);box-shadow:0 8px 26px rgba(120,80,120,.09);transition:.2s;overflow:hidden}
.note::before{content:"";position:absolute;top:0;inset-inline-end:0;width:4px;height:100%;background:var(--nc,var(--lavender))}
.note:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(120,80,120,.16);background:rgba(255,255,255,.78)}
.night .note{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.11);box-shadow:0 8px 26px rgba(0,0,0,.3)}
.night .note:hover{background:rgba(255,255,255,.11)}
.note-top{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted)}
.note-top time{font-size:11px}
.note-pin{font-size:12px}
.note-ic{width:26px;height:26px;border:0;border-radius:9px;background:rgba(255,255,255,.6);color:var(--muted);cursor:pointer;font-size:13px;line-height:1;transition:.15s}
.note-ic:hover{background:var(--lavender);color:#fff}
.night .note-ic{background:rgba(255,255,255,.1);color:#D7D0E3}
.note-body{margin:0;font-size:14px;line-height:1.85;color:var(--ink);white-space:pre-wrap;word-break:break-word;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.night .note-body{color:#F1ECF8}
.note-links,.note-files{display:flex;flex-direction:column;gap:5px}
.note-links a,.note-files a{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--coral);text-decoration:none;background:color-mix(in srgb,var(--coral) 9%,transparent);padding:5px 9px;border-radius:9px;direction:ltr;justify-content:flex-end;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.note-links a i{font-style:normal;font-size:12px}
.note-files a{color:var(--plum);background:color-mix(in srgb,var(--plum) 10%,transparent);direction:rtl;justify-content:flex-start}
.night .note-links a{background:rgba(255,179,154,.14);color:#FFB39A}
.night .note-files a{background:color-mix(in srgb,var(--lavender) 16%,transparent);color:#D9C8FF}
.note-foot{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:9px;border-top:1px solid rgba(140,120,160,.12)}
.note-tag{font-size:11px;padding:4px 10px;border-radius:99px;border:0;cursor:pointer;font-family:inherit;font-weight:600;background:color-mix(in srgb,var(--plum) 13%,transparent);color:var(--plum)}
.note-tag.tk{background:rgba(90,184,240,.15);color:#2A7FB8}
.note-tag.rem{background:color-mix(in srgb,var(--mint) 14%,transparent);color:#0A8F78;cursor:default}
.note-tag.rem.late{background:rgba(217,66,101,.14);color:#D94265}
.night .note-tag{background:color-mix(in srgb,var(--lavender) 22%,transparent);color:#E2D6FF}
.night .note-tag.tk{background:rgba(90,184,240,.2);color:#9BD4F7}
.night .note-tag.rem{background:color-mix(in srgb,var(--mint) 20%,transparent);color:#7FE9D3}
.note-empty{grid-column:1/-1;align-items:center;justify-content:center;text-align:center;gap:0;padding:34px 24px 32px}
.note-empty:hover{transform:none;box-shadow:0 10px 30px rgba(120,80,120,.1)}
.note-empty .ne-mark{width:52px;height:52px;border-radius:18px;margin-bottom:16px;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--peach,#FFB9A3),var(--lavender,var(--lavender)));box-shadow:0 10px 24px rgba(150,110,180,.28)}
.note-empty .ne-mark::after{content:"";width:20px;height:20px;border-radius:3px 3px 3px 8px;border:2.5px solid #fff;border-top-width:6px}
.note-empty h4{margin:0 0 8px;text-wrap:balance;font-size:17px;font-weight:800;color:var(--ink);letter-spacing:-.2px}
.note-empty p{margin:0 0 18px;max-width:44ch;font-size:13px;line-height:2;color:var(--muted);font-weight:500;text-wrap:balance}
.note-empty p i{font-style:normal;opacity:.72;font-size:12px}
.note-empty .btn{padding:11px 22px;position:relative;z-index:1}
.note-empty .note-glow{opacity:.3;bottom:-62%}
.note-empty::before{display:none}
.slider-nav{display:flex;gap:5px;direction:ltr}
.slider-nav .btn{width:34px;height:34px;padding:0;justify-content:center;font-size:17px}
.slider-dots{display:flex;gap:6px;justify-content:center;margin-top:12px}
.slider-dots .dot{width:7px;height:7px;border-radius:99px;border:0;background:rgba(140,120,160,.3);cursor:pointer;transition:.2s;padding:0}
.slider-dots .dot.on{width:22px;background:var(--coral)}
#shareMenu{position:absolute;min-width:170px}
#shareMenu.on{display:block}

/* ============ بطاقة المدونة بتدرّجات الهوية ============ */
.note{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 18px 16px;border-radius:22px;
  background:linear-gradient(160deg,rgba(255,255,255,.76),rgba(255,255,255,.44));
  border:1px solid rgba(255,255,255,.78);box-shadow:0 10px 30px rgba(120,80,120,.1);
  overflow:hidden;isolation:isolate;transition:.24s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(14px)}
.note::before{display:none}
.note-glow{position:absolute;z-index:-1;inset-inline:-24%;bottom:-52%;height:88%;pointer-events:none;
  background:radial-gradient(58% 100% at 28% 100%,var(--nc) 0%,transparent 72%),
             radial-gradient(56% 100% at 76% 100%,var(--nc2) 0%,transparent 74%);
  filter:blur(30px);opacity:.5;transition:.3s}
.note:hover{transform:translateY(-4px);box-shadow:0 22px 52px rgba(120,80,120,.2)}
.note:hover .note-glow{opacity:.72;bottom:-44%}
.night .note{background:linear-gradient(160deg,rgba(44,36,62,.82),rgba(28,22,42,.72));border-color:rgba(255,255,255,.1);box-shadow:0 14px 36px rgba(0,0,0,.4)}
.night .note-glow{opacity:.5}
.night .note:hover{box-shadow:0 24px 58px rgba(0,0,0,.55)}

.note-top{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted)}
.note-from{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);padding:6px 9px;border-radius:10px;background:rgba(255,255,255,.5)}
.note-from b{color:var(--ink)}
.night .note-from{background:rgba(255,255,255,.08)}.night .note-from b{color:#F7F3FF}
.note-shared{display:flex;align-items:center;margin-inline-start:auto}
.note-shared .avatar{margin-inline-start:-6px;border:2px solid rgba(255,255,255,.8)}
.note-shared .avatar:first-child{margin:0}
.note-shared i{font-style:normal;font-size:10px;color:var(--muted);margin-inline-start:4px}
.note-body{font-size:14.5px;line-height:1.9;font-weight:500}
.note-ic{background:rgba(255,255,255,.7)}
.note-links a,.note-files a{backdrop-filter:blur(6px)}
.notes-slider.is-slider .note{flex:0 0 300px}

/* ============ الملف الشخصي ============ */
.prof{padding:0;overflow:hidden}
.prof-cover{position:relative;height:190px;background:linear-gradient(135deg,var(--blob1),var(--blob2) 45%,var(--blob4));overflow:hidden}
.prof-cover img{width:100%;height:100%;object-fit:cover;display:block}
.prof-cover-btn{position:absolute;bottom:12px;inset-inline-start:14px;border:0;border-radius:99px;padding:8px 16px;font:600 12.5px 'Tajawal';cursor:pointer;
  background:rgba(255,255,255,.85);color:var(--ink);backdrop-filter:blur(10px);transition:.18s}
.prof-cover-btn:hover{background:#fff;transform:translateY(-1px)}
.night .prof-cover-btn{background:rgba(20,16,30,.7);color:#F7F3FF}
.prof-head{display:flex;align-items:flex-end;gap:20px;padding:0 26px 20px;margin-top:-46px;flex-wrap:wrap}
.prof-av{position:relative;cursor:pointer;flex:0 0 auto}
.prof-av .avatar{width:112px;height:112px;font-size:40px;border:5px solid var(--glass);box-shadow:0 10px 30px rgba(100,60,110,.22)}
.night .prof-av .avatar{border-color:#1a1526}
.prof-av-edit{position:absolute;bottom:4px;inset-inline-start:4px;width:30px;height:30px;border-radius:50%;display:grid;place-content:center;
  background:var(--coral);color:#fff;font-size:13px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.prof-id{flex:1;min-width:200px;padding-bottom:4px}
.prof-id h1{margin:0;font-size:26px;font-weight:900;letter-spacing:-.6px}
.prof-id .muted{margin:4px 0 0;font-size:13px}
.prof-badges{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.prof-stats{display:flex;gap:10px;padding-bottom:6px}
.prof-stats div{text-align:center;padding:9px 16px;border-radius:14px;background:rgba(255,255,255,.55)}
.prof-stats b{display:block;font-size:20px;font-weight:800;line-height:1.1}
.prof-stats span{font-size:11px;color:var(--muted)}
.night .prof-stats div{background:rgba(255,255,255,.08)}
.prof-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 22px 22px}
.prof-nav button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 16px;border-radius:16px;cursor:pointer;text-align:right;
  border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.5);font-family:inherit;transition:.2s}
.prof-nav button:hover{transform:translateY(-2px);border-color:var(--lavender);background:rgba(255,255,255,.8)}
.prof-nav button[aria-pressed=true]{background:var(--ink);border-color:transparent}
.prof-nav button[aria-pressed=true] b,.prof-nav button[aria-pressed=true] small{color:#fff}
.prof-nav i{font-style:normal;font-size:19px;margin-bottom:4px}
.prof-nav b{font-size:14px;font-weight:800;color:var(--ink)}
.prof-nav small{font-size:11px;color:var(--muted)}
.night .prof-nav button{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.night .prof-nav button[aria-pressed=true]{background:var(--lavender)}
.night .prof-nav button[aria-pressed=true] b,.night .prof-nav button[aria-pressed=true] small{color:#21182D}
/* الثيمات */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.theme-card{border:2px solid transparent;border-radius:16px;padding:8px;background:rgba(255,255,255,.5);cursor:pointer;font-family:inherit;transition:.2s;display:block;text-align:center}
.theme-card:hover{transform:translateY(-2px)}
.theme-card.on{border-color:var(--coral);background:rgba(255,255,255,.85)}
.theme-prev{position:relative;display:block;height:74px;border-radius:11px;overflow:hidden;margin-bottom:8px}
.theme-prev i{position:absolute;width:34px;height:34px;border-radius:50%;filter:blur(9px);opacity:.75}
.theme-prev em{position:absolute;bottom:8px;inset-inline-end:8px;width:22px;height:22px;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.theme-card b{font-size:12.5px;font-weight:700;color:var(--ink)}
.night .theme-card{background:rgba(255,255,255,.07)}
.night .theme-card.on{background:rgba(255,255,255,.13)}
.color-in{width:64px;height:42px;padding:4px;cursor:pointer}
@media(max-width:900px){.prof-nav{grid-template-columns:1fr 1fr}.prof-head{margin-top:-40px;gap:14px}.prof-av .avatar{width:92px;height:92px;font-size:32px}}
@media(max-width:620px){.prof-cover{height:178px}.prof-stats{width:100%}.prof-stats div{flex:1}}
.mem{padding:0;overflow:hidden}
.mem-cover{height:64px;background-size:cover;background-position:center}
.mem-top,.mem-nums,.mem .spark,.mem-foot{margin-inline:18px}
.mem-top{margin-top:-26px;align-items:flex-end}
.mem-top .avatar{border:3px solid var(--glass)}
.night .mem-top .avatar{border-color:#1e1830}
.mem-foot{margin-bottom:16px}
.mem .spark{width:calc(100% - 36px)}
/* تصحيحات: توهّج التدوينة فوق الخلفية، وترويسة الملف الشخصي */
.note-glow{z-index:0}
.note>*:not(.note-glow){position:relative;z-index:1}
.prof-cover{height:228px}
.prof-cover-btn{inset-inline-end:14px;inset-inline-start:auto}
.prof-head{margin-top:0;padding-top:14px;align-items:flex-end}
.prof-av{margin-top:-74px}
.prof-id{padding-bottom:2px}
.prof-id h1{font-size:24px}
@media(max-width:900px){.prof-av{margin-top:-60px}}
/* توهّج أقوى وأوضح لبطاقات المدونة */
.note{background:linear-gradient(158deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.5) 55%,color-mix(in srgb,var(--nc) 16%,rgba(255,255,255,.4)) 100%)}
.note-glow{bottom:-34%;height:70%;opacity:.78;filter:blur(24px);
  background:radial-gradient(52% 100% at 26% 100%,var(--nc) 0%,transparent 70%),
             radial-gradient(52% 100% at 74% 100%,var(--nc2) 0%,transparent 72%),
             radial-gradient(70% 70% at 50% 100%,color-mix(in srgb,var(--nc) 60%,var(--nc2)) 0%,transparent 78%)}
.note:hover .note-glow{opacity:.95;bottom:-26%}
.night .note{background:linear-gradient(158deg,rgba(48,40,68,.86) 0%,rgba(30,24,46,.76) 55%,color-mix(in srgb,var(--nc) 22%,rgba(26,21,40,.8)) 100%)}
.night .note-glow{opacity:.62}


/* تدرّج أغنى يملأ نصف البطاقة */
.note-glow{bottom:-22%;height:86%;opacity:.9;filter:blur(30px)}
.note:hover .note-glow{opacity:1;bottom:-14%}
.night .note-glow{opacity:.7}
.note-body{color:var(--ink)}
.note-foot{border-top-color:rgba(140,120,160,.18)}

/* ============ بطاقة المدونة: عنوان يُضغط ============ */
.notes-slider{gap:16px}
.notes-slider.is-slider{scroll-padding-inline-start:2px;padding:2px 2px 6px}
.notes-slider.is-slider .note{flex:0 0 clamp(240px,30%,300px)}
.note{padding:0;gap:0;min-height:172px;justify-content:space-between}
.note-open{display:flex;flex-direction:column;gap:7px;align-items:stretch;text-align:right;width:100%;flex:1;
  border:0;background:none;cursor:pointer;font-family:inherit;padding:18px 18px 10px}
.note-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}
.note-dot{width:7px;height:7px;border-radius:50%;background:var(--nc);display:inline-block}
.note-by{padding:2px 8px;border-radius:99px;background:rgba(255,255,255,.55);font-size:10.5px}
.night .note-by{background:rgba(255,255,255,.12)}
.note-title{margin:0;font-size:18px;font-weight:800;line-height:1.5;color:var(--ink);letter-spacing:-.2px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.note-sub{font-size:12px;color:var(--muted);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:auto}
.night .note-title{color:#F7F3FF}
.note-foot{margin:0;padding:10px 14px 13px;border-top:0;gap:7px;align-items:center}
.note:hover .note-title{text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--nc) 60%,transparent);text-underline-offset:4px}
.note-tag{font-size:10.5px;padding:3px 9px}
.note-ic{width:28px;height:28px;font-size:12px;background:rgba(255,255,255,.62)}
/* نافذة قراءة التدوينة */
.note-view{width:min(560px,94vw)}
.note-view .sheet{padding:0;overflow:hidden}
.nv-head{position:relative;padding:22px 24px 20px;overflow:hidden;isolation:isolate}
.nv-head>*{position:relative;z-index:1}
.nv-head .note-glow{z-index:0;bottom:-60%;height:150%;opacity:.85}
.nv-head h3{margin:8px 0 0;font-size:23px;font-weight:900;line-height:1.5;color:var(--ink)}
.night .nv-head h3{color:#fff}
.nv-body{margin:0;padding:16px 24px 2px;font-size:14.5px;line-height:1.95;color:var(--ink-2);white-space:pre-wrap;word-break:break-word}
.nv-sec{padding:16px 24px 0}
.nv-sec h4{margin:0 0 8px;font-size:12px;font-weight:800;color:var(--muted)}
.note-view .foot{margin:18px 24px 20px;padding-top:14px}
.note-view .kv{gap:8px 14px;font-size:13px}
.note-view .link{padding:0;color:var(--coral)}

/* ============ خط زمني حقيقي ============ */
.tl{list-style:none;margin:0;padding:0;padding-inline-start:30px;position:relative}
.tl::before{content:"";position:absolute;top:8px;bottom:8px;inset-inline-start:8px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,var(--coral),var(--lavender) 45%,var(--mint));opacity:.55}
.tl-i{position:relative;padding-bottom:16px}
.tl-i::before{content:"";position:absolute;inset-inline-start:-27px;top:6px;width:12px;height:12px;border-radius:50%;
  background:var(--glass);border:3px solid var(--lavender);box-shadow:0 0 0 3px var(--glass)}
.tl-i.big::before{border-color:var(--coral);width:14px;height:14px;inset-inline-start:-28px;top:5px}
.tl-date{display:block;font-size:11px;font-weight:800;color:var(--coral);margin-bottom:5px}
.tl-c{padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.65)}
.tl-c p{margin:0;font-size:13.5px;line-height:1.85;color:var(--ink)}
.tl-c.small{display:flex;align-items:center;gap:9px;padding:8px 12px;background:transparent;border:0;font-size:12.5px;color:var(--muted)}
.tl-c.small b{color:var(--ink-2)}
.night .tl-c{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.night .tl-c p{color:#F1ECF8}.night .tl-c.small b{color:#E2DBEE}
.night .tl-i::before{background:#221b33;box-shadow:0 0 0 3px #221b33}
.upd-r{display:grid;grid-template-columns:150px 1fr 28px;gap:7px;margin-top:7px}
.upd-r .fld-in{min-width:0;font-size:13px;padding:8px 10px}
@media(max-width:700px){.upd-r{grid-template-columns:1fr 28px}.upd-r .u-date{grid-column:1/-1}}
/* حواف السلايدر تتلاشى بدل أن تُقطع */
.notes-slider.is-slider{-webkit-mask-image:linear-gradient(to left,#000 90%,transparent 100%);mask-image:linear-gradient(to left,#000 90%,transparent 100%)}
.notes-slider.is-slider .note{scroll-snap-align:start}
.tl::before{width:3px;inset-inline-start:7px;opacity:.4}
.tl-i::before{width:13px;height:13px;inset-inline-start:-27px;border-width:3px}
.tl-i.big::before{width:15px;height:15px;inset-inline-start:-28px}
/* ضبط نهائي للملف الشخصي */
.prof-head{padding:14px 26px 18px;gap:18px}
.prof-av{margin-inline-end:2px}
.prof-nav i{display:grid;place-content:center;width:34px;height:34px;border-radius:11px;margin-bottom:8px;
  background:color-mix(in srgb,var(--coral) 14%,transparent);color:var(--coral)}
.prof-nav i svg{width:18px;height:18px}
.prof-nav button[aria-pressed=true] i{background:rgba(255,255,255,.2);color:#fff}
.night .prof-nav button[aria-pressed=true] i{background:rgba(33,24,45,.18);color:#21182D}
.prof-nav button{min-height:104px;justify-content:flex-end}
.prof-stats div{min-width:76px}
.prof-id h1{line-height:1.35}
@media(max-width:700px){.prof-nav{grid-template-columns:1fr 1fr;gap:8px}.prof-nav button{min-height:92px;padding:12px}.prof-head{padding:12px 16px 16px}}

/* قائمة المشاركة فوق النوافذ المنبثقة */
#shareMenu{position:fixed;min-width:210px;max-height:min(60vh,380px);overflow:auto;margin:0;inset:auto;padding:8px;z-index:200;border:1px solid var(--edge)}
#shareMenu:popover-open{display:block}
#shareMenu.on{display:block}
#shareMenu button{display:flex;align-items:center;gap:10px;width:100%;justify-content:flex-start}
#shareMenu button svg{width:17px;height:17px;flex:0 0 auto;color:var(--muted)}
#shareMenu button.on{background:color-mix(in srgb,var(--mint) 18%,transparent);color:var(--ink);font-weight:700}
#shareMenu .sm-dot{width:16px;height:16px;border-radius:50%;border:2px solid rgba(140,120,160,.35);display:inline-block;flex:0 0 auto}
#shareMenu .sep{height:1px;background:rgba(140,120,160,.18);margin:6px 4px}
/* مختار اللونين */
.color-pair{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cp-prev{width:62px;height:62px;border-radius:16px;flex:0 0 auto;border:1px solid rgba(255,255,255,.7);
  background:linear-gradient(150deg,var(--c1),var(--c2));box-shadow:0 6px 18px rgba(120,80,120,.16)}
.cp-cols{display:flex;flex-direction:column;gap:8px;flex:1;min-width:220px}
.cp-cols .row{gap:6px;align-items:center}
.cp-lbl{font-size:11.5px;color:var(--muted);font-weight:700;min-width:44px}
.cp-cols .swatch{width:24px;height:24px;border-radius:8px;border:2px solid transparent;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.1)}
.cp-cols .swatch.on{border-color:var(--ink);transform:scale(1.12)}
.night .cp-cols .swatch.on{border-color:#fff}
/* الطبقة العليا: التوست وقائمة الحساب لا تختفيان خلف النوافذ */
.toast{z-index:300;margin:0;inset:auto 24px 24px auto;border:0;padding:12px 20px}
.toast:popover-open{display:block;opacity:0;transform:translateY(10px)}
.toast.on:popover-open,.toast.on{opacity:1;transform:none}
.toast:not(.on){opacity:0;pointer-events:none}
#meMenu{position:fixed;z-index:300;margin:0;inset:auto;border:1px solid var(--edge)}
#meMenu:popover-open{display:block}
.menu-anchor{z-index:auto}
@media(max-width:700px){.toast{inset:auto 16px calc(86px + env(safe-area-inset-bottom)) 16px}}


/* ============ لوحة الصلاحيات ============ */
.perm-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:12px}
.pp{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:16px 10px 13px;border-radius:18px;cursor:pointer;
  font-family:inherit;border:2px solid transparent;background:rgba(255,255,255,.5);transition:.2s}
.pp:hover{transform:translateY(-3px);background:rgba(255,255,255,.85);box-shadow:0 12px 30px rgba(120,80,120,.14)}
.pp.on{border-color:var(--coral);background:rgba(255,255,255,.92);box-shadow:0 12px 32px color-mix(in srgb,var(--coral) 18%,transparent)}
.pp .avatar{width:56px;height:56px;font-size:20px;border:3px solid rgba(255,255,255,.85)}
.pp b{font-size:13px;font-weight:800;color:var(--ink);text-align:center;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pp-role{font-size:10.5px;font-weight:700;padding:2px 10px;border-radius:99px;background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum)}
.pp-role.super{background:color-mix(in srgb,var(--coral) 15%,transparent);color:var(--coral)}
.pp-role.admin{background:color-mix(in srgb,var(--mint) 16%,transparent);color:#0A8F78}
.pp-badge{position:absolute;top:9px;inset-inline-start:9px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;
  background:var(--lavender);color:#fff;font:800 11px 'Tajawal';font-style:normal;display:grid;place-content:center}
.pp-off{position:absolute;top:11px;inset-inline-end:11px;width:9px;height:9px;border-radius:50%;background:#D94265}
.night .pp{background:rgba(255,255,255,.07)}
.night .pp:hover,.night .pp.on{background:rgba(255,255,255,.13)}
.night .pp b{color:#F7F3FF}
.night .pp .avatar{border-color:rgba(255,255,255,.14)}
/* ترويسة الشخص المختار */
.perm-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.5);margin-top:16px}
.night .perm-head{background:rgba(255,255,255,.07)}
.perm-head .avatar{width:58px;height:58px;font-size:21px}
.ph-id{flex:1;min-width:150px}
.ph-id h3{margin:0;font-size:17px;font-weight:800}
.ph-role{display:flex;flex-direction:column;gap:4px;min-width:160px}
.ph-role label{font-size:11.5px;color:var(--muted);font-weight:700}
/* شبكة المجموعات */
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;align-items:start}
.perm-card{padding:14px 15px 10px;border-radius:18px;background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.65)}
.night .perm-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.pc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.pc-top h4{margin:0;font-size:13px;font-weight:800;color:var(--plum)}
.night .pc-top h4{color:#D9C8FF}
.pc-n{font-size:11px;font-weight:700;color:var(--muted);background:rgba(140,120,160,.14);padding:2px 9px;border-radius:99px}
/* مربع الاختيار */
.pchk{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:11px;cursor:pointer;transition:.15s;position:relative}
.pchk:hover{background:rgba(255,255,255,.6)}
.night .pchk:hover{background:rgba(255,255,255,.07)}
.pchk input{position:absolute;opacity:0;width:0;height:0}
.pchk-box{width:20px;height:20px;border-radius:7px;border:2px solid rgba(140,120,160,.42);flex:0 0 auto;
  display:grid;place-content:center;transition:.16s;background:rgba(255,255,255,.6)}
.pchk-box::after{content:"";width:10px;height:5px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;
  transform:rotate(-45deg) scale(.4);opacity:0;transition:.16s;margin-top:-3px;direction:ltr}
.pchk input:checked+.pchk-box{background:var(--mint);border-color:var(--mint)}
.pchk input:checked+.pchk-box::after{opacity:1;transform:rotate(-45deg) scale(1)}
.pchk input:focus-visible+.pchk-box{outline:2px solid var(--lavender);outline-offset:2px}
.pchk-t{flex:1;font-size:13px;color:var(--ink-2);line-height:1.5}
.pchk input:checked~.pchk-t{color:var(--ink);font-weight:600}
.night .pchk-box{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.night .pchk input:checked~.pchk-t{color:#F7F3FF}
.pchk-tag{font-style:normal;font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;
  background:rgba(245,166,35,.18);color:#C77F00;cursor:pointer;flex:0 0 auto}
.pchk-tag:hover{background:#C77F00;color:#fff}
.night .pchk-tag{background:rgba(245,166,35,.24);color:#FFC86B}
.pchk.over .pchk-box{border-color:#C77F00}
@media(max-width:620px){.perm-people{grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:9px}.pp .avatar{width:46px;height:46px;font-size:17px}.perm-grid{grid-template-columns:1fr}.ph-role{width:100%}}
/* شريط حفظ الصلاحيات */
.perm-save{display:flex;align-items:center;gap:10px;position:sticky;bottom:8px;margin-top:14px;padding:11px 15px;border-radius:16px;
  background:rgba(255,255,255,.86);backdrop-filter:blur(20px);border:1px solid var(--edge);box-shadow:0 10px 30px rgba(120,80,120,.14);
  font-size:13px;color:var(--muted);transition:.2s}
.perm-save.on{background:linear-gradient(115deg,color-mix(in srgb,var(--coral) 14%,transparent),color-mix(in srgb,var(--lavender) 14%,transparent));border-color:var(--coral);color:var(--ink)}
.perm-save b{color:var(--coral);font-size:15px}
.night .perm-save{background:rgba(35,29,50,.92);border-color:rgba(255,255,255,.1);color:#D7D0E3}
.night .perm-save.on{background:linear-gradient(115deg,color-mix(in srgb,var(--coral) 20%,transparent),color-mix(in srgb,var(--lavender) 20%,transparent));color:#F7F3FF}
.pchk.dirty{background:color-mix(in srgb,var(--coral) 9%,transparent)}
.pchk.dirty .pchk-box{border-color:var(--coral)}
.night .pchk.dirty{background:color-mix(in srgb,var(--coral) 14%,transparent)}
.ph-acts{display:flex;gap:7px;flex-wrap:wrap}
@media(max-width:620px){.ph-acts{width:100%}.ph-acts .btn{flex:1;justify-content:center}.perm-save{flex-wrap:wrap}.perm-save .btn{flex:1;justify-content:center}}
/* نوافذ الجوال: ملء الشاشة بلا قصّ */
@media(max-width:700px){
  dialog .sheet{max-height:calc(100dvh - 24px)}
  .note-view .sheet,#gdlg .sheet,#pfDlg .sheet,#noteDlg .sheet,#dlg .sheet{border-radius:22px 22px 0 0}
  .two{grid-template-columns:1fr}
  .color-pair{gap:10px}.cp-prev{width:48px;height:48px}
  .cp-cols{min-width:0}
  .cp-cols .row{flex-wrap:wrap}
  .pick-list{max-height:104px}
  .att-grid{grid-template-columns:1fr 1fr}
  .theme-grid{grid-template-columns:1fr 1fr}
  .stat-tiles{gap:8px}
  .notes-slider.is-slider .note{flex:0 0 78vw}
  .prof-nav i{width:30px;height:30px}
}

/* ===== انتقال ناعم بين الصفحات: تبديل فوري مع ظهور لطيف ===== */
/* حركة دخول قصيرة: ٢٦٠ م.ث كانت تُؤخّر ظهور المحتوى في كل تنقّل */
.view.active{animation:viewIn .14s cubic-bezier(.16,.84,.44,1) both}
@keyframes viewIn{from{opacity:0;transform:translateY(5px)}}
@media (prefers-reduced-motion:reduce){.view.active{animation:none}}

/* ===== رسائل الترحيب ===== */
.greet{position:fixed;z-index:1200;bottom:24px;left:24px;max-width:min(360px,calc(100vw - 48px));
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;
  background:linear-gradient(150deg,rgba(255,255,255,.9),rgba(255,255,255,.72));
  border:1px solid rgba(255,255,255,.8);box-shadow:0 18px 44px rgba(120,80,120,.2);backdrop-filter:blur(18px);
  transform:translateY(18px) scale(.96);opacity:0;transition:.4s cubic-bezier(.2,.9,.3,1);pointer-events:none}
.greet.on{transform:none;opacity:1;pointer-events:auto}
.greet .avatar{width:42px;height:42px;font-size:15px;flex:0 0 auto}
.greet .gt{display:flex;flex-direction:column;gap:3px;min-width:0}
.greet .gt b{font-size:14.5px;font-weight:800;color:var(--ink);letter-spacing:-.2px}
.greet .gt span{font-size:12px;color:var(--muted);line-height:1.7}
.greet .gx{margin-inline-start:auto;width:24px;height:24px;flex:0 0 auto;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;font-size:12px}
.greet .gx:hover{background:rgba(140,120,160,.14)}
.night .greet{background:linear-gradient(150deg,rgba(46,38,64,.92),rgba(30,24,44,.82));border-color:rgba(255,255,255,.12);box-shadow:0 20px 50px rgba(0,0,0,.5)}
@media (max-width:560px){.greet{left:16px;right:16px;bottom:calc(86px + env(safe-area-inset-bottom));max-width:none}}
@media (prefers-reduced-motion:reduce){.greet{transition:none}}

dialog.welcome .sheet{max-width:440px;text-align:center;padding:30px 26px 20px}
.wc-art{width:74px;height:74px;margin:0 auto 18px;border-radius:26px;display:grid;place-items:center;font-size:30px;color:#fff;line-height:1;
  background:linear-gradient(140deg,var(--peach,#FFB9A3),var(--lavender,var(--lavender)));box-shadow:0 14px 34px rgba(150,110,180,.32)}
dialog.welcome h3{margin:0 0 10px;font-size:20px;font-weight:800;letter-spacing:-.3px}
dialog.welcome p{margin:0;font-size:13.5px;line-height:2;color:var(--muted);max-width:40ch;margin-inline:auto;font-weight:500}
.wc-dots{display:flex;gap:6px;justify-content:center;margin:22px 0 4px}
.wc-dots i{width:7px;height:7px;border-radius:99px;background:rgba(140,120,160,.28);transition:.24s}
.wc-dots i.on{width:22px;background:var(--coral)}
dialog.welcome .foot{margin-top:18px}
.night .wc-dots i{background:rgba(255,255,255,.2)}
.night .wc-dots i.on{background:var(--coral)}

/* ===== لوحة التحكم بشريط جانبي ===== */
.view.active.wp{display:grid;grid-template-columns:232px minmax(0,1fr);gap:16px;align-items:start}
.wp-side{position:sticky;top:16px;padding:10px;display:flex;flex-direction:column;gap:3px}
.wp-side .wp-group{font-size:10.5px;font-weight:800;color:var(--muted);padding:12px 12px 5px;letter-spacing:.2px}
.wp-side .wp-group:first-child{padding-top:6px}
.wp-side button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:12px;background:transparent;
  font:600 13.5px 'Tajawal';color:var(--ink-2);cursor:pointer;text-align:start;transition:.15s}
.wp-side button svg{width:18px;height:18px;flex:0 0 auto;opacity:.7}
.wp-side button:hover{background:rgba(255,255,255,.72);color:var(--ink)}
.wp-side button[aria-pressed=true]{background:var(--ink);color:#fff}
.wp-side button[aria-pressed=true] svg{opacity:1}
.night .wp-side button:hover{background:rgba(255,255,255,.1)}
.night .wp-side button[aria-pressed=true]{background:var(--lavender);color:#21182D}
.wp-main .stat-tiles{grid-template-columns:repeat(auto-fit,minmax(126px,1fr))}
.wp-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px;align-items:start}
.qa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.qa{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.7);
  background:rgba(255,255,255,.55);cursor:pointer;font-family:inherit;text-align:start;transition:.18s;color:var(--ink)}
.qa svg{width:18px;height:18px;color:var(--coral);margin-bottom:4px}
.qa b{font-size:13.5px;font-weight:800}
.qa small{color:var(--muted);font-size:11.5px;line-height:1.5}
.qa:hover{transform:translateY(-2px);background:rgba(255,255,255,.88);box-shadow:0 10px 24px rgba(120,80,120,.12)}
.night .qa{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.night .qa:hover{background:rgba(255,255,255,.13)}
.mem.static{opacity:1;cursor:default}
.mem.static:hover{transform:translateY(-2px)}
.mem-mail{margin:0 18px 10px;text-align:right;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mem-foot .r{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.pf-code{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:8px;background:color-mix(in srgb,var(--plum) 13%,transparent);color:var(--plum);font-family:'Tajawal'}
.swatch-in{width:34px;height:34px;border:0;padding:0;border-radius:12px;background:none;cursor:pointer;flex:0 0 auto}
.swatch-in::-webkit-color-swatch-wrapper{padding:0}
.swatch-in::-webkit-color-swatch{border-radius:12px;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.swatch-in::-moz-color-swatch{border-radius:12px;border:2px solid #fff}
.tag-in{display:flex;align-items:center;gap:6px;min-width:0}
.tag-in span{font-weight:800;color:var(--muted)}
.tag-in .fld-in{flex:1;min-width:0}
.color-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:12px}
.color-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.5);cursor:pointer}
.color-row .swatch-in{width:40px;height:40px}
.color-row b{font-size:13px;font-weight:800}
.color-row small{display:block;color:var(--muted);font-size:11px;margin-top:2px;line-height:1.5}
.night .color-row{background:rgba(255,255,255,.07)}
.page-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.page-row{display:grid;grid-template-columns:78px 1fr;gap:10px;align-items:center;padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.5)}
.page-row span{font-size:11.5px;color:var(--muted);font-weight:600}
.night .page-row{background:rgba(255,255,255,.07)}
@media(max-width:900px){
  .view.active.wp{grid-template-columns:1fr}
  .wp-side{position:static;flex-direction:row;overflow-x:auto;scrollbar-width:none;padding:8px;gap:4px;-webkit-overflow-scrolling:touch}
  .wp-side::-webkit-scrollbar{display:none}
  .wp-side .wp-group{display:none}
  .wp-side button{white-space:nowrap;width:auto;flex:0 0 auto;padding:9px 12px;font-size:12.5px}
  .wp-two{grid-template-columns:1fr}
}

/* ===== الهاشتاقات على البطاقات وفي المحرر ===== */
.tag.htag{font-weight:700;cursor:pointer}
.tag.htag:hover{filter:brightness(.92)}
.pick.htag[aria-pressed=true]{background:var(--tc,var(--plum))}

/* ===== الساعة في الرئيسية ===== */
.clock{margin:10px 0 0;font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 13px;border-radius:99px;
  background:rgba(255,255,255,.45);font-weight:500;letter-spacing:.1px}
.clock::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 3px color-mix(in srgb,var(--mint) 18%,transparent);animation:clockPulse 2.6s ease-in-out infinite}
@keyframes clockPulse{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--mint) 0%,transparent)}}
.night .clock{background:rgba(255,255,255,.08)}

/* ===== أيقونة المدونة الفارغة أصغر ===== */
.note-empty .ne-mark{width:30px;height:30px;border-radius:10px;margin-bottom:10px;box-shadow:0 6px 14px rgba(150,110,180,.22)}
.note-empty .ne-mark::after{width:11px;height:11px;border-width:1.5px;border-top-width:4px;border-radius:2px 2px 2px 5px}

/* ===== حركات دخول خفيفة للرسوم (تعمل خلال تبديل الصفحة فقط) ===== */
@keyframes barUp{from{transform:scaleY(0)}}
@keyframes fillIn{from{transform:scaleX(0)}}
@keyframes donutIn{from{transform:rotate(-60deg) scale(.86);opacity:0}}
@keyframes ringIn{from{stroke-dashoffset:100.53}}
@keyframes riseIn{from{opacity:0;transform:translateY(8px)}}
.vt .bars .bar{animation:barUp .55s cubic-bezier(.2,.8,.2,1) both;transform-origin:bottom;animation-delay:calc(var(--i,0)*22ms)}
.vt .donut svg{animation:donutIn .7s cubic-bezier(.2,.8,.2,1) both}
.vt .pbar .fill{animation:fillIn .7s cubic-bezier(.2,.8,.2,1) both;transform-origin:right}
.vt .ring circle:last-of-type{animation:ringIn .8s cubic-bezier(.2,.8,.2,1) both}
.vt .chart-svg rect,.vt .spark rect{animation:barUp .6s cubic-bezier(.2,.8,.2,1) both;transform-box:fill-box;transform-origin:bottom}
.vt .stat-tiles .tile,.vt .mem,.vt .qa,.vt .pp{animation:riseIn .4s cubic-bezier(.2,.8,.2,1) both}
.vt .stat-tiles .tile:nth-child(2),.vt .mem:nth-child(2),.vt .qa:nth-child(2){animation-delay:40ms}
.vt .stat-tiles .tile:nth-child(3),.vt .mem:nth-child(3),.vt .qa:nth-child(3){animation-delay:80ms}
.vt .stat-tiles .tile:nth-child(4),.vt .mem:nth-child(4),.vt .qa:nth-child(4){animation-delay:120ms}
.vt .stat-tiles .tile:nth-child(5),.vt .mem:nth-child(5),.vt .qa:nth-child(5){animation-delay:160ms}
.vt .stat-tiles .tile:nth-child(6),.vt .mem:nth-child(6),.vt .qa:nth-child(6){animation-delay:200ms}
.tile b{transition:color .3s}
.spine i,.pbar .fill,.track i{transition:width .5s cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){.vt *{animation:none!important}.clock::before{animation:none}}

/* ===== رأس بطاقة المرفق: النوع وما يخصّه ===== */
.att-head{display:flex;align-items:center;gap:6px;padding:7px 8px 6px;min-width:0}
.att-kind{flex:0 0 auto;font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;color:#fff;background:var(--kc,var(--plum));letter-spacing:.2px}
.att-of{flex:1;min-width:0;display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-of i{font-style:normal;flex:0 0 auto;padding:1px 6px;border-radius:6px;background:color-mix(in srgb,var(--oc,var(--lavender)) 16%,transparent);color:var(--oc,var(--plum));font-size:9.5px;font-weight:800}
.night .att-of{color:#E8E1F2}
.att-card .att-x{top:36px}

/* ===== الذكاء الاصطناعي وقياس الوقت ===== */
.mem-nums.four{grid-template-columns:repeat(4,1fr)}
.tag.ai{background:color-mix(in srgb,var(--plum) 12%,transparent);color:var(--plum);font-weight:700}
.ai-box{margin:12px 0;padding:14px 16px;border-radius:16px;background:linear-gradient(140deg,color-mix(in srgb,var(--lavender) 14%,transparent),color-mix(in srgb,var(--peach,#FFB9A3) 12%,transparent));border:1px solid color-mix(in srgb,var(--lavender) 30%,transparent)}
.night .ai-box{background:linear-gradient(140deg,rgba(182,156,240,.12),rgba(255,185,163,.08));border-color:rgba(255,255,255,.1)}
.ai-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ai-head b{font-size:13.5px;font-weight:800;color:var(--plum)}
.ai-head .btn{margin-inline-start:auto}
.ai-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-top:12px}
.ai-nums div{padding:9px 10px;border-radius:12px;background:rgba(255,255,255,.55);text-align:center}
.night .ai-nums div{background:rgba(255,255,255,.07)}
.ai-nums b{display:block;font-size:16px;font-weight:800;line-height:1.2}
.ai-nums span{display:block;font-size:10.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.ai-sum{margin:12px 0 0;font-size:13.5px;line-height:1.8;color:var(--ink-2)}
.ai-list{margin-top:10px;font-size:13px}
.ai-list b{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:700}
.ai-list ol,.ai-list ul{margin:0;padding-inline-start:20px;line-height:1.8;color:var(--ink-2)}
.ai-list.risk li::marker{color:#D94265}
.ai-time{margin-top:12px;padding-top:10px;border-top:1px dashed color-mix(in srgb,var(--plum) 22%,transparent);font-size:12.5px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ai-time > b{font-size:12px;color:var(--muted);font-weight:700}
.ai-total{font-weight:800;color:var(--plum);font-size:14px}
.ai-people{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.ai-bar{height:8px;border-radius:99px;background:rgba(140,120,160,.16);overflow:hidden;max-width:320px}
.ai-bar i{display:block;height:100%;border-radius:99px;transition:width .5s}
@media(max-width:700px){.mem-nums.four{grid-template-columns:repeat(2,1fr)}.ai-nums{grid-template-columns:1fr 1fr}}

/* ===== المرفقات المخفية ===== */
.att-hide{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;color:var(--muted);cursor:pointer;margin-inline-start:auto;flex:0 0 auto;user-select:none}
.att-hide input{width:14px;height:14px;margin:0;accent-color:var(--plum);cursor:pointer}
.att-hide.in-row{margin-inline-start:0;padding:0 6px;white-space:nowrap}
.att-hide.standalone{display:flex;margin:8px 0 0;font-size:12px;padding:8px 12px;border-radius:12px;background:color-mix(in srgb,var(--plum) 8%,transparent)}
.att-hide.standalone input{width:16px;height:16px}
.att-head.is-hidden{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--plum) 10%,transparent) 0 6px,transparent 6px 12px)}
.att-head.is-hidden .att-hide{color:var(--plum)}
.att-hidden-tag{font-style:normal;font-size:10px;font-weight:800;padding:2px 7px;border-radius:99px;background:var(--plum);color:#fff;flex:0 0 auto}
.editor-row .att-hide{order:2}

/* ===== المشاريع السرية وأسهم التنقل والفئات ===== */
.pf-locked{display:flex;align-items:center;gap:14px;padding:18px;min-height:0;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--plum) 7%,transparent) 0 8px,transparent 8px 16px),var(--glass);cursor:pointer}
.pf-locked.pf-row{grid-template-columns:none}
.pf-lock-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum);flex:0 0 auto}
.pf-lock-ic svg{width:20px;height:20px}
.pf-lock-ic.big{width:64px;height:64px;border-radius:20px;margin:0 auto 12px}
.pf-lock-ic.big svg{width:28px;height:28px}
.pf-lock-body{min-width:0}.pf-lock-body h3{margin:4px 0 2px;font-size:15px;font-weight:800}.pf-lock-body p{margin:0}
.pf-lockpage{text-align:center;max-width:560px;margin:0 auto}
.pf-lockpage h2{margin:0 0 6px}.pf-lockpage #pfUnlock{margin-inline:auto}
.pf-conf-tag{background:color-mix(in srgb,var(--plum) 14%,transparent);color:var(--plum);font-weight:700;margin-inline-start:8px;vertical-align:middle}
.pf-conf-tag svg{width:12px;height:12px}
.conf-box{padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--plum) 7%,transparent)}
.conf-box .switch{padding:4px 0;border:0}
.pf-arrows{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.pf-arrows .btn{max-width:46%;min-width:0;gap:9px;padding:8px 14px}
.pf-arrows .lbl{display:flex;flex-direction:column;align-items:flex-start;min-width:0;line-height:1.25;font-size:12.5px}
.pf-arrows .lbl small{font-size:10px;color:var(--muted);font-weight:600}
.pf-arrows .btn:last-child .lbl{align-items:flex-end}
.pf-arrows .lbl,.pf-arrows .lbl small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.pf-arrows .ar{font-size:20px;line-height:1;color:var(--coral)}
.pf-arrows .pf-pos{margin-inline:auto;font-family:'Tajawal';font-weight:700}
.meta-row{grid-template-columns:auto 1fr 64px}
.meta-row .pf-code{min-width:74px;text-align:center}
.ai-hint{margin:8px 0 0;font-size:12px;color:var(--plum);font-weight:600;line-height:1.6}
@media(max-width:620px){.pf-arrows .lbl{display:none}.pf-arrows .btn{padding:8px 12px}}

/* ===== لوحة التحكم بالمظهر الجديد: شريط أيقونات عائم + رأس ترحيب + مؤشرات ===== */
.view.active.wp{grid-template-columns:76px minmax(0,1fr);gap:18px}
.wp-side{padding:10px 8px;gap:6px;align-items:center;border-radius:26px;top:14px}
.wp-side button{width:52px;height:52px;padding:0;justify-content:center;border-radius:16px;position:relative;color:var(--muted)}
.wp-side button svg{width:21px;height:21px;opacity:.85}
.wp-side button[aria-pressed=true]{background:linear-gradient(135deg,var(--coral),color-mix(in srgb,var(--coral) 70%,var(--rose)));color:#fff;box-shadow:0 10px 22px color-mix(in srgb,var(--coral) 35%,transparent)}
.wp-side button[aria-pressed=true] svg{opacity:1}
.wp-side .rail-lbl{position:absolute;inset-inline-end:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(6px);white-space:nowrap;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:6px 11px;border-radius:10px;opacity:0;pointer-events:none;transition:.15s;z-index:5}
.wp-side button:hover .rail-lbl,.wp-side button:focus-visible .rail-lbl{opacity:1;transform:translateY(-50%)}
.wp-side .rail-sep{display:block;width:26px;height:1px;background:rgba(140,120,160,.22);margin:4px 0}
.night .wp-side button[aria-pressed=true]{color:#fff}
.night .wp-side .rail-lbl{background:#F4EEFF;color:#21182D}
body.in-admin .hero-top,body.in-admin .spine,body.in-admin #clock{display:none}
body.in-admin .hero{padding-bottom:16px}body.in-admin .nav{margin-bottom:0}
.dash-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:4px 2px 18px}
.dash-head h1{margin:0;font-size:clamp(24px,3.4vw,32px);font-weight:900;letter-spacing:-.6px}
.dash-head h1 em{font-style:normal;color:var(--coral)}
.dash-head .wave{display:inline-block;animation:wave 2.4s ease-in-out 1;transform-origin:70% 70%}
@keyframes wave{0%,60%,100%{transform:rotate(0)}10%,30%{transform:rotate(16deg)}20%,40%{transform:rotate(-8deg)}}
.dash-head .hint{margin:4px 0 0}
.dash-head-acts{display:flex;gap:8px}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.kpi{padding:18px 18px 16px;display:flex;flex-direction:column;gap:2px;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;inset-inline-end:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:color-mix(in srgb,var(--kc,var(--lavender)) 10%,transparent);pointer-events:none}
.kpi-ic{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;margin-bottom:12px;background:var(--kc,var(--lavender));color:#fff;box-shadow:0 10px 22px color-mix(in srgb,var(--kc,var(--lavender)) 35%,transparent)}
.kpi-ic svg{width:21px;height:21px}
.kpi>span:not(.kpi-ic){font-size:12px;color:var(--muted);font-weight:600}
.kpi b{font:800 30px 'Tajawal';letter-spacing:-1px;line-height:1.1;margin-top:2px}
.kpi small{font-size:11px;color:var(--muted)}
.dash-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.dash-main{display:flex;flex-direction:column;gap:16px}
.dash-side{display:flex;flex-direction:column;gap:16px}
.dash-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dash-people{display:flex;gap:10px;flex-wrap:wrap}
.dash-person{border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;font-family:inherit;width:56px}
.dash-person .avatar{width:44px;height:44px;font-size:15px;border:2px solid rgba(255,255,255,.85);transition:.18s;box-shadow:0 6px 16px rgba(120,80,120,.14)}
.dash-person:hover .avatar{transform:translateY(-3px) scale(1.05)}
.dash-person small{font-size:10.5px;color:var(--ink-2);font-weight:600;max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-person.add .avatar{background:rgba(255,255,255,.55);color:var(--coral);border:2px dashed color-mix(in srgb,var(--coral) 45%,transparent);display:grid;place-items:center;font-size:20px;font-weight:800}
.feed.compact .feed-row{padding:8px 10px}
.feed.compact .what{font-size:12.5px}
.wp-main .qa-grid{grid-template-columns:repeat(3,1fr);gap:8px}
.wp-main .dash-side .qa{padding:12px 8px;align-items:center;text-align:center;gap:6px}
.wp-main .dash-side .qa b{font-size:11.5px;font-weight:700}
.wp-main .dash-side .qa svg{margin:0;width:20px;height:20px}
@media(max-width:1000px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.dash-cols{grid-template-columns:1fr}.dash-two{grid-template-columns:1fr}}
@media(max-width:900px){
  .view.active.wp{grid-template-columns:1fr;gap:12px}
  .wp-side{border-radius:20px;padding:6px;gap:4px;justify-content:flex-start}
  .wp-side button{width:46px;height:46px;flex:0 0 auto}.wp-side .rail-lbl{display:none}.wp-side .rail-sep{width:1px;height:26px;margin:0 3px}
  .dash-head h1{font-size:22px}
}
@media(max-width:560px){.kpi-grid{gap:10px}.kpi{padding:14px}.kpi b{font-size:24px}.kpi-ic{width:38px;height:38px;border-radius:12px;margin-bottom:8px}.kpi-ic svg{width:18px;height:18px}}

/* ===== الرئيسية: الشبكة وقائمة اليوم ===== */
.home-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.todo{background:linear-gradient(150deg,color-mix(in srgb,var(--mint) 12%,var(--glass)),color-mix(in srgb,var(--lavender) 12%,var(--glass)))}
.todo-add{display:flex;align-items:center;gap:8px;margin-top:12px}
.todo-add .fld-in{flex:1;min-width:0}
.todo-plus{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:800;flex:0 0 auto}
.todo-list{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto}
.todo-it{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:14px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.8);transition:.22s;animation:riseIn .3s both}
.night .todo-it{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1)}
.todo-it.pop{transform:scale(.985)}
.todo-chk{width:24px;height:24px;border-radius:50%;border:2px solid color-mix(in srgb,var(--mint) 70%,transparent);background:transparent;cursor:pointer;display:grid;place-items:center;flex:0 0 auto;padding:0;transition:.18s}
.todo-chk i{width:10px;height:10px;border-radius:50%;background:var(--mint);transform:scale(0);transition:.18s}
.todo-it.done .todo-chk{background:var(--mint);border-color:var(--mint)}
.todo-it.done .todo-chk i{transform:scale(1);background:#fff}
.todo-txt{flex:1;min-width:0;font-size:14px;font-weight:600;cursor:text;line-height:1.5;overflow-wrap:anywhere;position:relative}
.todo-txt::after{content:"";position:absolute;inset-inline-start:0;top:52%;height:2px;width:0;background:var(--muted);transition:width .3s cubic-bezier(.2,.8,.2,1)}
.todo-it.done .todo-txt{color:var(--muted);font-weight:500}
.todo-it.done .todo-txt::after{width:100%}
.todo-acts{display:flex;gap:2px;opacity:0;transition:.15s}
.todo-it:hover .todo-acts,.todo-it:focus-within .todo-acts{opacity:1}
@media(hover:none){.todo-acts{opacity:1}}
.todo-ic{width:28px;height:28px;border:0;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer;font-size:15px;line-height:1}
.todo-ic:hover{background:rgba(255,255,255,.9);color:var(--ink)}
.night .todo-ic:hover{background:rgba(255,255,255,.14);color:#fff}
.todo-empty{padding:18px 8px;text-align:center;color:var(--muted);font-size:13px}
.todo-skel{height:42px;border-radius:14px;background:rgba(255,255,255,.4);animation:sk 1.2s infinite}
@media(max-width:900px){.home-grid{grid-template-columns:1fr}}

/* ===== المساعد الذكي ===== */
.ai-fab{position:fixed;left:24px;bottom:24px;z-index:70;width:54px;height:54px;border:0;border-radius:18px;font-size:22px;color:#fff;cursor:pointer;
  background:linear-gradient(135deg,var(--plum),var(--lavender));box-shadow:0 14px 34px color-mix(in srgb,var(--plum) 40%,transparent);transition:.2s}
.ai-fab:hover{transform:translateY(-2px) scale(1.04)}
.ai-chat{position:fixed;left:24px;bottom:90px;z-index:1300;width:min(400px,calc(100vw - 32px));height:min(560px,calc(100dvh - 120px));margin:0;padding:0;border:1px solid var(--edge);border-radius:24px;
  background:rgba(255,255,255,.9);backdrop-filter:blur(26px);box-shadow:0 28px 70px rgba(100,60,110,.3);display:none;flex-direction:column;overflow:hidden;inset:auto auto 90px 24px}
.ai-chat:popover-open,.ai-chat.on{display:flex}
.night .ai-chat{background:rgba(35,29,50,.96)}
.aic-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid rgba(140,120,160,.14)}
.aic-head b{font-size:14px;font-weight:800;display:block}.aic-head small{font-size:11px;color:var(--muted)}
.aim-ic{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--plum),var(--lavender));color:#fff;font-size:15px;flex:0 0 auto}
.aim-ic.big{width:52px;height:52px;border-radius:17px;font-size:22px;margin:0 auto 12px}
.aic-msgs{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.aim{display:flex;gap:8px;align-items:flex-end;max-width:92%}
.aim.user{flex-direction:row;margin-inline-start:auto}
.aim.assistant .aim-ic{width:26px;height:26px;border-radius:9px;font-size:12px}
.aim-b{padding:10px 13px;border-radius:16px;font-size:13.5px;line-height:1.8;background:rgba(255,255,255,.75);color:var(--ink)}
.aim.user .aim-b{background:var(--ink);color:#fff}
.night .aim-b{background:rgba(255,255,255,.1);color:#F1ECF8}.night .aim.user .aim-b{background:var(--lavender);color:#21182D}
.aim-b.typing{display:flex;gap:4px;padding:12px 14px}
.aim-b.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:dots 1s infinite}
.aim-b.typing i:nth-child(2){animation-delay:.15s}.aim-b.typing i:nth-child(3){animation-delay:.3s}
@keyframes dots{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-4px);opacity:1}}
.aim-empty{text-align:center;padding:18px 8px;margin:auto 0}
.aim-empty b{font-size:15px;font-weight:800}.aim-empty p{margin:6px 0 12px;font-size:12.5px;color:var(--muted);line-height:1.8}
.aim-sug{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.aic-form{display:flex;gap:8px;padding:12px 14px;border-top:1px solid rgba(140,120,160,.14)}
.aic-form .fld-in{flex:1;min-width:0}
@media(max-width:700px){.ai-fab{left:auto;right:16px;bottom:calc(82px + env(safe-area-inset-bottom));width:56px;height:56px;font-size:22px;border-radius:50%}
  .ai-chat{inset:auto 12px calc(90px + env(safe-area-inset-bottom)) 12px;width:auto;height:min(70dvh,560px)}}

/* ===== تقرير الأداء ===== */
dialog.report .sheet{max-width:720px}
.rep-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rep-head h3{margin:0 0 2px}
.rep-sum{font-size:14.5px;line-height:1.95;color:var(--ink-2);margin:0 0 14px;padding:14px 16px;border-radius:16px;background:color-mix(in srgb,var(--lavender) 12%,transparent)}
.rep-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rep-sec{margin-top:12px}.rep-sec h4{margin:0 0 6px;font-size:12.5px;color:var(--muted);font-weight:800}
.rep-sec ul{margin:0;padding-inline-start:18px;line-height:1.85;font-size:13.5px}
.rep-sec.good li::marker{color:var(--mint)}.rep-sec.bad li::marker{color:#D94265}.rep-sec.rec li::marker{color:var(--coral)}
.rep-members{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.rep-m{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7)}
.night .rep-m{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
.rep-m b{font-size:13.5px}.rep-m p{margin:5px 0 0;font-size:12.5px;line-height:1.7;color:var(--ink-2)}
.rep-st{display:inline-block;margin-inline-start:6px;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:99px;background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c)}
.ai-btn{background:linear-gradient(115deg,var(--plum),var(--lavender))}
@media(max-width:620px){.rep-grid{grid-template-columns:1fr}}

/* ===== بروفايل العضو وروابط الأسماء ومعاينة المدونة ===== */
.ulink{color:inherit;text-decoration:none;cursor:pointer}
.ulink:hover{color:var(--coral);text-decoration:underline}
[data-user]{cursor:pointer}
.user-nav button b{font-size:14px}
.prof-nav.user-nav{grid-template-columns:repeat(3,1fr)}
.prof-nav.user-nav button[aria-pressed=true]{background:var(--ink);color:#fff}
.prof-nav.user-nav button[aria-pressed=true] small{color:rgba(255,255,255,.75)}
.night .prof-nav.user-nav button[aria-pressed=true]{background:var(--lavender);color:#21182D}
.nv-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:14px 0 2px;padding:0 24px}
.nv-gallery a{position:relative;display:block;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.5);aspect-ratio:4/3}
.nv-gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:.25s}
.nv-gallery a:hover img{transform:scale(1.04)}
.nv-gallery .att-hidden-tag{position:absolute;top:8px;inset-inline-start:8px}
.nv-links{display:flex;flex-direction:column;gap:10px}
.nv-embed{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#000;box-shadow:0 10px 26px rgba(0,0,0,.18)}
.nv-embed iframe{width:100%;height:100%;border:0;display:block}
.nv-link{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7);text-decoration:none;color:var(--ink);transition:.18s}
.nv-link:hover{background:rgba(255,255,255,.9);transform:translateY(-1px)}
.nv-link i{font-style:normal;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);font-size:15px;flex:0 0 auto}
.nv-link span{min-width:0;display:flex;flex-direction:column}
.nv-link b{font-size:13px}.nv-link small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.night .nv-link{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1)}
@media(max-width:700px){.prof-nav.user-nav{grid-template-columns:1fr 1fr 1fr;gap:6px}.prof-nav.user-nav button{min-height:70px;padding:10px 6px}.prof-nav.user-nav small{display:none}}

/* ===== البحث المركزي ===== */
dialog.search{width:min(680px,94vw)}
dialog.search .sheet{padding:10px;max-height:min(78vh,78dvh);display:flex;flex-direction:column}
.sr-in{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 12px}
.sr-in svg{width:20px;height:20px;color:var(--muted);flex:0 0 auto}
.sr-in .fld-in{flex:1;font-size:16px;padding:12px 14px;background:rgba(255,255,255,.5)}
.sr-in kbd{font:600 11px 'Tajawal';color:var(--muted);border:1px solid rgba(140,120,160,.3);border-radius:6px;padding:2px 7px}
.sr-res{overflow:auto;padding:4px 4px 6px;min-height:80px}
.sr-hint{padding:26px 16px;text-align:center;color:var(--muted);font-size:13px}
.sr-group{font-size:11px;font-weight:800;color:var(--muted);padding:12px 12px 4px}
.sr-item{display:flex;align-items:center;gap:11px;width:100%;padding:9px 12px;border:0;border-radius:14px;background:transparent;text-align:start;font-family:inherit;cursor:pointer;color:var(--ink)}
.sr-item:hover,.sr-item.on{background:color-mix(in srgb,var(--lavender) 16%,transparent)}
.sr-item span{min-width:0;display:flex;flex-direction:column;gap:1px}
.sr-item b{font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-item small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-ic{font-style:normal;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto;font-size:14px;font-weight:800;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
#searchBtn svg{width:18px;height:18px}
.prof-nav.user-nav{grid-template-columns:repeat(4,1fr)}
@media(max-width:700px){.prof-nav.user-nav{grid-template-columns:1fr 1fr}dialog.search{width:100%}}

/* ===== قارئ التدوينة: ترويسة بأدوات، ومعاينات غنية ===== */
/* السلة في أعلى يسار البطاقة داخل التدفّق: لا تغطّي نصاً ولا يلاصقها زر آخر */
.nv-top{display:flex;align-items:center;gap:12px;margin-bottom:6px;min-height:38px}
.nv-top .note-meta{flex:1;min-width:0}
.nv-trash{flex:0 0 auto;margin-inline-start:auto;width:38px;height:38px;border-radius:13px;cursor:pointer;
  display:grid;place-items:center;border:1px solid color-mix(in srgb,#D94265 24%,transparent);
  background:color-mix(in srgb,#D94265 10%,rgba(255,255,255,.7));color:#D94265;transition:.18s;backdrop-filter:blur(8px)}
.nv-trash svg{width:18px;height:18px}
.nv-trash:hover{background:#D94265;color:#fff;border-color:#D94265;transform:translateY(-1px);box-shadow:0 8px 20px color-mix(in srgb,#D94265 34%,transparent)}
.night .nv-trash{background:color-mix(in srgb,#D94265 18%,rgba(255,255,255,.08))}
.nv-head h3{padding-inline-start:0}
.nv-shot{display:block;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.5)}
.nv-shot img{width:100%;display:block;max-height:min(40vh,300px);object-fit:contain}
.nv-embed{position:relative;border-radius:16px;overflow:hidden;background:#0d0b12;box-shadow:0 10px 26px rgba(0,0,0,.18);max-height:min(46vh,340px)}
.nv-embed iframe,.nv-embed video{width:100%;height:100%;border:0;display:block}
.nv-embed.pdf{background:rgba(255,255,255,.6)}
.nv-open{position:absolute;bottom:10px;inset-inline-start:10px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700;
  padding:6px 12px;border-radius:99px;text-decoration:none;opacity:.92}
.nv-open:hover{opacity:1}
.nv-audio{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:16px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7)}
.nv-audio audio{width:100%}
.nv-audio a{font-size:11.5px;color:var(--muted);text-decoration:none}
.night .nv-audio{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1)}
.nv-link em{font-style:normal;margin-inline-start:auto;color:var(--muted);font-size:14px;flex:0 0 auto}
#shareMenu button small{display:block;font-size:10.5px;color:var(--muted);font-weight:500;margin-top:2px;line-height:1.5}
#shareMenu button.danger{color:#D94265}
#shareMenu button.danger small{color:color-mix(in srgb,#D94265 60%,var(--muted))}

/* ===== أسهم سلايدر المدونة بجانبي البطاقات ===== */
.notes-wrap{position:relative;margin-top:14px}
.notes-wrap .notes-slider{margin-top:0}
.slide-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:40px;height:40px;border:1px solid var(--edge);
  border-radius:50%;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);color:var(--ink);font-size:20px;line-height:1;
  cursor:pointer;display:grid;place-items:center;box-shadow:0 8px 22px rgba(120,80,120,.18);transition:.18s}
.slide-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.slide-arrow.prev{inset-inline-end:-6px}
.slide-arrow.next{inset-inline-start:-6px}
.night .slide-arrow{background:rgba(40,33,56,.92);color:#F1ECF8;border-color:rgba(255,255,255,.14)}
@media(max-width:700px){.slide-arrow{width:34px;height:34px;font-size:17px}.slide-arrow.prev{inset-inline-end:-4px}.slide-arrow.next{inset-inline-start:-4px}}

/* ===== ملف المهمة: صف المرفقات متوازن ===== */
.att-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.att-row .dropzone{flex:1;min-width:180px;margin:0}
.att-row .att-hide.standalone{margin:0;flex:0 0 auto;background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7)}
.night .att-row .att-hide.standalone{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.1)}
@media(max-width:620px){.att-row{flex-direction:column;align-items:stretch}.att-row .att-hide.standalone{justify-content:center}}
.comment-box{margin-top:10px}

/* ===== مساحات لمس مريحة على الهاتف واللوحي ===== */
@media(hover:none),(max-width:820px){
  /* نقاط المهام في التقويم: مساحة لمس أكبر من حجمها المرئي */
  /* النقاط مؤشرات فقط: اللمس يختار اليوم فتظهر مهامه بطاقاتٍ كاملة في الأجندة أسفله */
  .cal-day .cal-task{width:9px;height:9px;margin:3px 2px 0;pointer-events:none}
  .cal-filter{padding:9px 14px;font-size:12.5px;min-height:36px}
  .chip{padding:9px 14px;font-size:12.5px;min-height:36px}
  .eye{padding:9px;min-width:36px;min-height:36px}
  .note-ic{width:34px;height:34px;font-size:15px}
  .att-x{width:34px;height:34px;font-size:17px;opacity:1}
  .att-hide input,.switch input[type=checkbox]:not([class]),input[type=checkbox]{width:20px;height:20px}
  .att-hide{padding:8px 10px;min-height:38px}
  .link{padding:9px 10px;min-height:36px;display:inline-flex;align-items:center}
  /* على اللمس: الزر نفسه ٣٢ بكسل هدفاً للإصبع، والنقطة المرئية تبقى صغيرة
     عبر عنصر زائف — توسيع منطقة اللمس بلا تغيير الشكل */
  /* تلتفّ ولا تتجاوز الشاشة: صفٌّ من أهداف ٣٢ بكسل كان يفيض أفقياً */
  .slider-dots{gap:0;flex-wrap:wrap;max-width:100%}
  .slider-dots .dot{width:32px;height:32px;min-width:32px;background:none;display:grid;place-items:center;padding:0}
  .slider-dots .dot::before{content:"";width:9px;height:9px;border-radius:99px;background:rgba(140,120,160,.35);transition:.2s}
  .slider-dots .dot.on{width:38px;min-width:38px;background:none}
  .slider-dots .dot.on::before{width:24px;background:var(--coral)}
  .todo-chk{width:28px;height:28px}
  .todo-ic{width:34px;height:34px}
  .nv-trash{width:42px;height:42px}
  .grid-count button{width:34px;height:34px}
  .wp-side button{width:48px;height:48px}
  .btn.tiny{min-height:36px;padding:9px 15px}
  .period-tabs .btn.tiny,.tabs .btn{min-height:36px}
  .dash-person .avatar{width:48px;height:48px}
}

/* تذييل قارئ التدوينة ثابت: «إغلاق» و«مشاركة» في المتناول دائماً، بعيداً عن السلة أعلى الزاوية */
dialog.note-view .sheet{padding-bottom:0}
dialog.note-view .foot{position:sticky;bottom:0;margin:18px 0 0;padding:14px 24px 18px;border-radius:0 0 26px 26px;
  background:color-mix(in srgb,var(--glass) 92%,#fff);backdrop-filter:blur(14px);border-top:1px solid rgba(140,120,160,.16)}
.night dialog.note-view .foot{background:rgba(35,29,50,.96)}
@media(max-width:700px){dialog.note-view .foot{margin:16px 0 0;padding:12px 18px calc(14px + env(safe-area-inset-bottom));border-radius:0}}

/* زر أيقونة برتقالي مضغوط */
.btn.accent.icon-only{width:42px;height:42px;padding:0;justify-content:center;border-radius:14px}
.btn.accent.icon-only svg{width:19px;height:19px}
@media(hover:none),(max-width:820px){.btn.accent.icon-only{width:46px;height:46px}}

/* ===== الإشارة إلى زميل (@) ===== */
.mention{color:var(--plum);background:color-mix(in srgb,var(--plum) 12%,transparent);padding:1px 6px;border-radius:7px;font-weight:700;cursor:pointer}
.mention:hover{background:color-mix(in srgb,var(--plum) 22%,transparent)}
.mention-box{position:fixed;z-index:1400;width:250px;max-height:260px;overflow:auto;padding:6px;border-radius:16px;
  background:rgba(255,255,255,.97);backdrop-filter:blur(20px);border:1px solid var(--edge);box-shadow:0 20px 50px rgba(100,60,110,.28)}
.night .mention-box{background:rgba(38,31,54,.98)}
.mention-it{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;border:0;border-radius:11px;background:none;cursor:pointer;text-align:start;font-family:inherit;color:var(--ink)}
.mention-it:hover,.mention-it.on{background:color-mix(in srgb,var(--lavender) 18%,transparent)}
.mention-it span{display:flex;flex-direction:column;min-width:0}
.mention-it b{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mention-it small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comment-box{position:relative}

/* شاشة رمز التحقق بخطوتين */
.code-in{letter-spacing:.55em;text-align:center!important;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;padding-inline:12px}
.code-in::placeholder{letter-spacing:.45em;opacity:.35;font-weight:400}
.f .rem{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13px;color:var(--muted);cursor:pointer;font-weight:500}
.f .rem input{width:17px;height:17px;accent-color:var(--accent);cursor:pointer;flex:none}

/* قسم البريد في لوحة التحكم */
.mail-help{background:color-mix(in srgb,var(--lavender) 12%,transparent);border:1px solid rgba(140,120,160,.18);border-radius:16px;padding:14px 18px;margin:0 0 16px}
.mail-help b{display:block;margin-bottom:8px;font-size:14px}
.mail-help ol{margin:0;padding-inline-start:20px;line-height:2;font-size:13.5px;color:var(--muted)}
.mail-help ol b{display:inline;margin:0;color:var(--ink)}
.mail-help .hint{margin:10px 0 0}
.mail-adv{margin:4px 0 12px;border:1px solid rgba(140,120,160,.16);border-radius:14px;padding:0 14px;background:var(--glass)}
.mail-adv summary{cursor:pointer;padding:12px 0;font-weight:600;font-size:13.5px;color:var(--muted);list-style:none}
.mail-adv summary::-webkit-details-marker{display:none}
.mail-adv summary::before{content:"▸";display:inline-block;margin-inline-end:8px;transition:.2s}
.mail-adv[open] summary::before{transform:rotate(90deg)}
.mail-adv[open]{padding-bottom:6px}
.mail-result{min-height:0;margin:6px 0 0;font-size:13.5px;font-weight:600;line-height:1.7}
.mail-result.ok{color:#17A673}
.mail-result.bad{color:#D94265}
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;font-size:12.5px;font-weight:600;background:rgba(140,120,160,.14);color:var(--muted)}
.pill.ok{background:rgba(23,166,115,.14);color:#17A673}
.pill.bad{background:rgba(217,66,101,.14);color:#D94265}

/* الفواتير */
.inv-sum{display:flex;gap:12px;flex-wrap:wrap}
.inv-stat{background:var(--glass);border:1px solid rgba(140,120,160,.16);border-radius:16px;padding:12px 18px;min-width:140px}
.inv-stat b{display:block;font-size:19px;font-weight:800;letter-spacing:-.3px}
.inv-stat span{display:block;font-size:12px;color:var(--muted);margin-top:3px}
.inv-stat.big{background:linear-gradient(135deg,color-mix(in srgb,var(--coral) 16%,transparent),color-mix(in srgb,var(--lavender) 18%,transparent));border-color:transparent}
.inv-stat.big b{font-size:24px;color:var(--coral)}
.inv-filters{flex-wrap:wrap;gap:8px}
.inv-filters .fld-in{min-width:130px}
.inv-list{display:flex;flex-direction:column;gap:2px}
.inv-row{display:flex;align-items:center;gap:14px;padding:13px 14px;border-radius:14px;cursor:pointer;transition:.15s;border:1px solid transparent}
.inv-row:hover{background:var(--glass);border-color:rgba(140,120,160,.16)}
.inv-ic{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--c,#B69CF0) 16%,transparent);color:var(--c,#B69CF0)}
.inv-ic svg{width:19px;height:19px}
.inv-main{flex:1;min-width:0}
.inv-main b{display:block;font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-main small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}
.inv-card-tag{flex:none;min-width:110px;text-align:center}
.inv-card-tag .tag{background:color-mix(in srgb,var(--c,#B69CF0) 15%,transparent);color:var(--c,#B69CF0);font-weight:600}
.inv-date{flex:none;min-width:92px;font-size:12.5px;color:var(--muted);text-align:center}
.inv-amt{flex:none;min-width:130px;text-align:end;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.inv-files{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.inv-file{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:11px;background:var(--glass);border:1px solid rgba(140,120,160,.18);font-size:12.5px;text-decoration:none;color:var(--ink)}
.inv-file svg{width:15px;height:15px;color:var(--muted)}
.card-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.card-row{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:13px;background:var(--glass);border:1px solid rgba(140,120,160,.16)}
.card-row b{display:block;font-size:14px}
.card-row small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.card-dot{width:12px;height:12px;border-radius:4px;flex:none}
@media(max-width:820px){
  .inv-card-tag,.inv-date{display:none}
  .inv-amt{min-width:0}
  .inv-filters .fld-in{min-width:0;flex:1 1 42%}
  .inv-stat{flex:1 1 44%;min-width:0;padding:11px 14px}
}

/* حالة الاتصال */
.avatar{position:relative}
.avatar .on-dot{position:absolute;inset-block-end:-1px;inset-inline-end:-1px;width:10px;height:10px;border-radius:50%;background:#17A673;border:2px solid var(--bg,#fff);box-shadow:0 0 0 1px rgba(23,166,115,.25)}
.avatar.lg .on-dot,.avatar.xl .on-dot{width:13px;height:13px;border-width:2.5px}
.avatar.sm .on-dot{width:8px;height:8px;border-width:1.5px}
.pres-line{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.pres-line.on{color:#17A673;font-weight:600}
/* أعمدة الحضور: كانت تتمدّد لعرض البطاقة فيصير عمودٌ واحد كتلةً عريضة
   تبدو كأنها تزاحم ما فوقها. الآن عرضها محدود ولها قاعدة وتسمية يوم. */
.pres-bars{display:flex;align-items:flex-end;gap:10px;margin-top:12px;padding-bottom:4px;
  border-bottom:1px solid var(--line);overflow-x:auto}
.pres-col{flex:1 1 0;min-width:0;max-width:46px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:default}
.pres-bars i{width:100%;max-width:26px;background:color-mix(in srgb,var(--lavender) 55%,transparent);
  border-radius:4px 4px 0 0;min-height:3px;transition:.15s}
.pres-col:hover i{background:color-mix(in srgb,var(--lavender) 85%,transparent)}
.pres-bars i.today{background:var(--coral)}
.pres-col em{font-style:normal;font-size:10.5px;color:var(--muted);line-height:1}

/* باني الثيمات */
.theme-card.mine{position:relative;cursor:pointer}
.theme-card small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.theme-acts{display:flex;gap:8px;justify-content:center;margin-top:6px;opacity:0;transition:.15s}
.theme-card.mine:hover .theme-acts{opacity:1}
@media(hover:none){.theme-acts{opacity:1}}
.th-swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:4px 0 14px}
.th-sw{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:14px;background:var(--glass);border:1px solid rgba(140,120,160,.16);cursor:pointer}
.th-sw input[type=color]{width:42px;height:42px;flex:none;border:0;border-radius:12px;padding:0;background:none;cursor:pointer}
.th-sw input[type=color]::-webkit-color-swatch{border:1px solid rgba(0,0,0,.12);border-radius:11px}
.th-sw input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.th-sw b{display:block;font-size:13.5px}
.th-sw small{display:block;font-size:11.5px;color:var(--muted);margin-top:1px}
.th-bgprev{position:relative;height:110px;border-radius:16px;overflow:hidden;border:1px solid rgba(140,120,160,.16)}
.th-bgprev i{position:absolute;width:90px;height:90px;border-radius:50%;filter:blur(26px);opacity:.75}
.th-bgprev i:nth-child(1){top:-20px;inset-inline-start:10px}
.th-bgprev i:nth-child(2){top:30px;inset-inline-end:20px}
.th-bgprev i:nth-child(3){bottom:-30px;inset-inline-start:40%}
.th-bgprev i:nth-child(4){top:10px;inset-inline-start:45%}

/* اختيار وضع الباني */
.th-mode{display:flex;gap:6px;background:var(--glass);border:1px solid rgba(140,120,160,.16);border-radius:14px;padding:4px;margin:0 0 14px}
.th-mode button{flex:1;border:0;background:none;padding:9px 10px;border-radius:11px;font:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;transition:.15s}
.th-mode button[aria-pressed="true"]{background:var(--coral);color:#fff}
.th-derived{display:flex;gap:10px;flex-wrap:wrap}
.th-der{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:12px;background:var(--glass);border:1px solid rgba(140,120,160,.16);font-size:12.5px}
.th-der i{width:20px;height:20px;border-radius:7px;border:1px solid rgba(0,0,0,.1)}
.th-der b{font-weight:600}
.th-derived + .hint{margin-top:10px}

/* قائمة الإعدادات — صفوف وأسهم على طريقة منصات التواصل */
.set-rows{display:flex;flex-direction:column}
.set-row{display:flex;align-items:center;gap:14px;width:100%;padding:15px 14px;border:0;background:none;border-radius:14px;
  font:inherit;text-align:start;cursor:pointer;transition:.15s;color:var(--ink)}
.set-row+.set-row{box-shadow:inset 0 1px 0 rgba(140,120,160,.14)}
.set-row:hover{background:var(--glass)}
.set-ic{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral)}
.set-ic svg{width:18px;height:18px}
.set-txt{flex:1;min-width:0}
.set-txt b{display:block;font-size:14.5px;font-weight:600}
.set-txt small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.set-arrow{flex:none;color:var(--muted);opacity:.6;display:grid;place-items:center}
.set-arrow svg{width:17px;height:17px;transform:scaleX(-1)}
.set-row:hover .set-arrow{opacity:1;color:var(--coral)}

/* من كلّفك ومن كلّفتِ */
.assign-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 7px;border-radius:99px;font-size:12px;font-weight:600;cursor:pointer;transition:.15s}
.assign-tag svg{width:14px;height:14px;flex:none;opacity:.8}
.assign-tag .avatar{width:19px;height:19px;font-size:9px;flex:none}
.assign-tag em{font-style:normal;opacity:.75;font-weight:500}
.assign-tag.from{background:rgba(124,91,166,.13);color:var(--plum)}
.assign-tag.to{background:color-mix(in srgb,var(--mint) 15%,transparent);color:var(--mint)}
.assign-tag:hover{filter:brightness(.94)}
.assign-stat{cursor:pointer}
.assign-stat .with-av{display:inline-flex;align-items:center;gap:7px}
.assign-stat .avatar{width:22px;height:22px;font-size:10px}
.chip.assigned-chip{gap:6px}
.chip.assigned-chip svg{width:14px;height:14px}
.chip.assigned-chip[aria-pressed="true"]{background:color-mix(in srgb,var(--mint) 18%,transparent);color:var(--mint)}

/* المهام المرتبطة */
.task-links{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.tlink{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:13px;background:var(--glass);border:1px solid rgba(140,120,160,.16);cursor:pointer;transition:.15s}
.tlink:hover{border-color:color-mix(in srgb,var(--coral) 40%,transparent);transform:translateX(-2px)}
.tlink-ic{width:30px;height:30px;flex:none;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--lavender) 18%,transparent);color:var(--plum)}
.tlink-ic svg{width:15px;height:15px}
.tlink-ic.follows{background:color-mix(in srgb,var(--coral) 15%,transparent);color:var(--coral)}
.tlink-ic.blocks{background:rgba(217,66,101,.14);color:#D94265}
.tlink-ic.duplicate{background:color-mix(in srgb,var(--mint) 16%,transparent);color:var(--mint)}
.tlink-txt{flex:1;min-width:0}
.tlink-txt em{font-style:normal;font-size:11.5px;color:var(--muted);display:block}
.tlink-txt b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tlink-txt small{display:block;font-size:11.5px;color:var(--muted);margin-top:1px}
.tlink-rm{flex:none;border:0;background:none;color:var(--muted);font-size:15px;cursor:pointer;padding:4px 6px;border-radius:8px;opacity:.5}
.tlink-rm:hover{opacity:1;color:#D94265;background:rgba(217,66,101,.1)}
.tl-results{max-height:300px;overflow-y:auto;margin-top:8px;display:flex;flex-direction:column;gap:4px}
.tl-opt{display:block;width:100%;text-align:start;border:0;background:var(--glass);border-radius:11px;padding:10px 12px;cursor:pointer;font:inherit;transition:.12s}
.tl-opt:hover{background:color-mix(in srgb,var(--coral) 10%,var(--glass))}
.tl-opt b{display:block;font-size:13.5px;font-weight:600}
.tl-opt small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}

/* الخطوات كقائمة قابلة للتعليم */
.step-list{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.step-item{display:flex;align-items:flex-start;gap:11px;padding:10px 12px;border-radius:12px;cursor:pointer;transition:.14s}
.step-item:hover{background:var(--glass)}
.step-item input{width:19px;height:19px;flex:none;margin-top:1px;accent-color:var(--mint);cursor:pointer}
.step-item input:disabled{cursor:default;opacity:.5}
.step-body{flex:1;min-width:0}
.step-body b{display:block;font-size:14px;font-weight:500;line-height:1.55}
.step-body small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.step-item.done .step-body b{text-decoration:line-through;color:var(--muted);font-weight:400}
.step-foot{display:flex;align-items:center;gap:11px;padding:10px 12px 2px;font-size:12.5px;color:var(--muted)}
.step-bar{flex:1;height:6px;border-radius:99px;background:rgba(140,120,160,.16);overflow:hidden}
.step-bar i{display:block;height:100%;background:var(--mint);border-radius:99px;transition:width .3s}
.step-row .step-chk{display:grid;place-items:center;cursor:pointer;margin:0}
.step-row .step-chk input{width:18px;height:18px;accent-color:var(--mint);cursor:pointer}
@media(max-width:620px){
  .step-row{grid-template-columns:30px 1fr 28px}
  .step-row .step-date{grid-column:2}
  .step-row .step-text{grid-column:1/-1}
}

/* نموذج المهمة: الأساسيات ظاهرة والباقي مطويّ */
.task-sheet .f-hero .fld-in{font-size:16.5px;font-weight:600;padding:14px 16px}
.tsec{border:1px solid rgba(140,120,160,.16);border-radius:16px;background:var(--glass);margin:0 0 10px;overflow:hidden}
.tsec summary{cursor:pointer;padding:13px 16px;list-style:none;display:flex;flex-direction:column;gap:2px;transition:.15s}
.tsec summary::-webkit-details-marker{display:none}
.tsec summary span{font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px}
.tsec summary span::before{content:"▸";font-size:12px;color:var(--muted);transition:.2s;display:inline-block}
.tsec[open] summary span::before{transform:rotate(90deg)}
.tsec summary small{font-size:12px;color:var(--muted);padding-inline-start:18px}
.tsec summary:hover{background:color-mix(in srgb,var(--coral) 6%,transparent)}
.tsec[open] summary{border-bottom:1px solid rgba(140,120,160,.14)}
.tsec > *:not(summary){padding-inline:16px}
.tsec > *:not(summary):first-of-type{padding-top:14px}
.tsec > *:not(summary):last-child{padding-bottom:14px}
.tsec .f:last-child{margin-bottom:0}
@media(max-width:700px){
  .tsec summary{padding:12px 14px}
  .tsec > *:not(summary){padding-inline:14px}
}

/* طرق عرض المستخدمين */
.uview-switch{display:flex;gap:3px;background:var(--glass);border:1px solid rgba(140,120,160,.16);border-radius:13px;padding:3px;margin-inline-end:8px}
.uview-switch button{display:flex;align-items:center;gap:6px;border:0;background:none;padding:7px 11px;border-radius:10px;font:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:.14s}
.uview-switch button svg{width:15px;height:15px}
.uview-switch button[aria-pressed="true"]{background:var(--coral);color:#fff}
@media(max-width:700px){.uview-switch button span{display:none}.uview-switch button{padding:8px}}

.umini{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.umini-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:16px 10px 13px;border-radius:16px;
  background:var(--glass);border:1px solid rgba(140,120,160,.16);cursor:pointer;transition:.16s;font:inherit;color:var(--ink)}
.umini-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--coral) 40%,transparent);box-shadow:0 10px 26px rgba(120,80,120,.12)}
.umini-card .avatar{width:52px;height:52px;font-size:18px}
.umini-card b{font-size:13px;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.umini-card small{font-size:11px;color:var(--muted)}
.umini-n{position:absolute;top:8px;inset-inline-start:8px;font-size:10.5px;font-weight:700;color:var(--mint);background:color-mix(in srgb,var(--mint) 14%,transparent);padding:2px 7px;border-radius:99px}

.urow-list{display:flex;flex-direction:column;gap:2px}
.urow{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:13px;transition:.14s}
.urow+.urow{box-shadow:inset 0 1px 0 rgba(140,120,160,.14)}
.urow:hover{background:var(--glass)}
.urow-id{flex:1;min-width:0}
.urow-id b{display:block;font-size:14px;font-weight:600}
.urow-id small{display:block;font-size:11.5px;color:var(--muted);margin-top:1px}
.urow-pres{flex:none;min-width:120px;font-size:12px;color:var(--muted)}
.urow-n{flex:none;min-width:88px;font-size:12.5px;color:var(--muted)}
.urow-n b{color:var(--mint);font-size:14px}
.urow-st{flex:none;min-width:110px}
.urow-acts{flex:none;display:flex;gap:5px}
@media(max-width:820px){.urow-pres,.urow-st{display:none}}

.utable-wrap{overflow-x:auto}
.utable{width:100%;border-collapse:collapse;font-size:13px;min-width:720px}
.utable th{text-align:start;font-weight:600;font-size:12px;color:var(--muted);padding:9px 11px;border-bottom:1px solid rgba(140,120,160,.2)}
.utable td{padding:10px 11px;border-bottom:1px solid rgba(140,120,160,.1)}
.utable tr:hover td{background:var(--glass)}
.utd-user{display:inline-flex;align-items:center;gap:8px}
.utable .avatar{width:26px;height:26px;font-size:11px}

/* ── تحديد الجزء الظاهر من الصورة ─────────────────────────── */
.fitdlg { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center;
  background: rgba(20, 14, 32, .55); backdrop-filter: blur(6px); padding: 16px; }
.fitdlg-box { background: var(--card); border: 1px solid var(--line); border-radius: 20px;
  padding: 18px; width: min(520px, 100%); box-shadow: 0 24px 60px rgba(20, 14, 32, .28); }
.fitdlg-box h3 { margin: 0 0 2px; font-size: 1.05rem; }
.fitdlg-box .sm { font-size: .82rem; margin: 0 0 12px; }
.fitdlg-frame { position: relative; overflow: hidden; border-radius: 14px; background: var(--chip);
  border: 1px solid var(--line); cursor: grab; touch-action: none; }
.fitdlg-frame.round { border-radius: 50%; max-width: 240px; margin-inline: auto; }
.fitdlg-frame.grab { cursor: grabbing; }
.fitdlg-frame img { width: 100%; height: 100%; display: block; user-select: none; -webkit-user-drag: none; }
.fitdlg-zoom { display: flex; align-items: center; gap: 10px; margin: 14px 0 4px; font-size: .88rem; color: var(--muted); }
.fitdlg-zoom input { flex: 1; accent-color: var(--accent); }
.fitdlg-acts { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.fitdlg-acts .grow { flex: 1; }
.prof-cover-acts { position: absolute; inset-block-end: 12px; inset-inline-end: 14px; display: flex; gap: 8px; }
.prof-cover-acts .prof-cover-btn { position: static; inset: auto; }
.prof-av-fit { position: absolute; inset-block-end: 4px; inset-inline-end: 4px; z-index: 2; width: 28px; height: 28px;
  border-radius: 50%; border: 2px solid var(--card); background: var(--accent); color: #fff;
  font-size: .8rem; line-height: 1; cursor: pointer; display: grid; place-items: center; }

/* ── خطّ تدويناتي في الملف الشخصي ─────────────────────────── */
.feed-head { display: flex; align-items: center; gap: 10px; }
.feed-head h2 { margin: 0; flex: 1; }
.feed-list { margin-top: 10px; border-top: 1px solid var(--line); }
.fd { display: flex; gap: 12px; padding: 14px 2px; border-bottom: 1px solid var(--line); position: relative; cursor: pointer; transition: background .15s; }
.fd::before { content: ''; position: absolute; inset-block: 0; inset-inline-start: 0; width: 3px; background: var(--nc); opacity: .55; border-radius: 3px; }
.fd:hover { background: color-mix(in srgb, var(--nc) 7%, transparent); }
.fd-av { flex: 0 0 auto; padding-inline-start: 10px; }
.fd-main { min-width: 0; flex: 1; }
.fd-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .86rem; }
.fd-top b { color: var(--ink); }
.fd-top .spacer { flex: 1; }
.fd-ic { border: 0; background: transparent; color: var(--muted); cursor: pointer; width: 26px; height: 26px;
  border-radius: 50%; font-size: .9rem; }
.fd-ic:hover { background: var(--chip); color: var(--ink); }
.fd-title { margin: 4px 0 2px; font-size: 1rem; color: var(--ink); }
.fd-body { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.75; white-space: pre-wrap;
  display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.fd-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fd-chip { font-size: .74rem; padding: 3px 9px; border-radius: 99px; background: var(--chip); color: var(--muted); }
.fd-chip.pin { background: color-mix(in srgb, var(--nc) 22%, transparent); color: var(--ink); }
.fd-chip.pf { background: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--ink); }
.fd-chip.rem { background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--ink); }

/* ── رأس صفحة الإعدادات وسهم الرجوع ───────────────────────── */
.set-head { display: flex; align-items: flex-start; gap: 12px; }
.set-head h2 { margin: 0; }
.set-head .hint { margin: 2px 0 0; }
.set-back { flex: none; width: 38px; height: 38px; margin-top: 1px; border: 1px solid var(--line);
  background: var(--glass); color: var(--ink); border-radius: 12px; cursor: pointer;
  display: grid; place-items: center; transition: .15s; }
.set-back svg { width: 18px; height: 18px; transform: scaleX(-1); }
.set-back:hover { background: color-mix(in srgb, var(--coral) 12%, transparent); color: var(--coral);
  border-color: color-mix(in srgb, var(--coral) 30%, transparent); }

/* ── مكتبة المرفقات: مجلدات ووسوم وخصوصية ─────────────────── */
.files-layout { display: grid; grid-template-columns: 232px 1fr; gap: 16px; align-items: start; }
.folder-rail { padding: 14px; position: sticky; top: 14px; }
.rail-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.fold { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; border: 0; background: none;
  border-radius: 11px; font: inherit; font-size: 13.5px; color: var(--ink); cursor: pointer; text-align: start; transition: .14s; position: relative; }
.fold:hover { background: var(--glass); }
.fold.on { background: color-mix(in srgb, var(--coral) 13%, transparent); font-weight: 600; }
.fold i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.fold span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fold em { font-style: normal; font-size: 11.5px; color: var(--muted); }
.fold-acts { display: none; gap: 4px; }
.fold:hover .fold-acts { display: flex; }
.fold-acts b { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 6px; font-size: 11px;
  color: var(--muted); font-weight: 400; }
.fold-acts b:hover { background: var(--card); color: var(--coral); }
.folder-rail .hint.sm { font-size: 11.5px; margin: 10px 2px 0; line-height: 1.6; }

.tag-rail { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.tag-chip { border: 1px solid var(--line); background: var(--card); color: var(--muted); border-radius: 99px;
  padding: 4px 11px; font: inherit; font-size: 12px; cursor: pointer; display: inline-flex; gap: 5px; align-items: center; transition: .14s; }
.tag-chip em { font-style: normal; opacity: .6; font-size: 10.5px; }
.tag-chip:hover { border-color: var(--coral); color: var(--coral); }
.tag-chip.on { background: var(--coral); border-color: var(--coral); color: #fff; }
.tag-chip.on em { opacity: .8; }

.att-acts { position: absolute; inset-block-start: 6px; inset-inline-start: 6px; display: none; gap: 4px; z-index: 2; }
.att-card:hover .att-acts { display: flex; }
.att-ic { width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(255,255,255,.9); color: var(--ink);
  font-size: 11px; cursor: pointer; display: grid; place-items: center; }
.att-ic:hover { background: var(--coral); color: #fff; }
.att-vis { font-size: 10.5px; padding: 2px 7px; border-radius: 99px; white-space: nowrap; }
.att-vis.private { background: color-mix(in srgb, #D94265 16%, transparent); color: #B0304F; }
.att-vis.shared { background: color-mix(in srgb, var(--lavender) 28%, transparent); color: var(--plum); }
.att-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.att-tag { border: 0; background: var(--chip); color: var(--muted); border-radius: 99px; padding: 2px 8px;
  font: inherit; font-size: 11px; cursor: pointer; }
.att-tag:hover { background: var(--coral); color: #fff; }

.vis-pick { display: grid; gap: 8px; }
.vis-opt { display: block; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; transition: .14s; }
.vis-opt.on { border-color: var(--coral); background: color-mix(in srgb, var(--coral) 8%, transparent); }
.vis-opt input { margin-inline-end: 6px; accent-color: var(--coral); }
.vis-opt b { font-size: 13.5px; }
.vis-opt small { display: block; color: var(--muted); font-size: 11.5px; margin-top: 2px; margin-inline-start: 20px; }
.share-pick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding: 10px; border-radius: 12px; background: var(--glass); }
.share-one { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; cursor: pointer; }
.share-one .avatar { width: 22px; height: 22px; font-size: 10px; }
.up-list { margin: 0 0 12px; padding-inline-start: 18px; font-size: 13px; color: var(--muted); max-height: 120px; overflow: auto; }
.lb-note { margin: 10px 0 0; color: var(--muted); font-size: 13.5px; white-space: pre-wrap; }
.lb-links { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; font-size: 12.5px; }
.files-page.drag { outline: 2px dashed var(--coral); outline-offset: -10px; border-radius: 18px; }
@media(max-width:860px){ .files-layout { grid-template-columns: 1fr; } .folder-rail { position: static; } }

/* ── أوزان بروفايل العضو ───────────────────────────────────
   كانت الإحصاءات شريطاً مرناً يتبع عرضُ كل صندوق طولَ نصّه، فسبعة
   أرقام تُنتج سبعة أعراض مختلفة تزاحم كتلة الاسم وتُفقد الصفّ توازنه. */
.prof-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 8px; flex: 1 1 380px; max-width: 540px; padding-bottom: 4px; }
.prof-stats div { padding: 10px 8px; min-width: 0; display: flex; flex-direction: column;
  justify-content: center; gap: 2px; }
.prof-stats b { font-size: 19px; white-space: nowrap; }
.prof-stats span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* كتلة الاسم لا تُسحق: لها نصيب ثابت قبل أن تتقاسم البقية */
.prof-id { flex: 1 1 280px; min-width: 240px; }

/* صفحة العضو: سبع إحصاءات صفّان — أربع للمهام وثلاث للوقت. الأخيرة
   تمتدّ عمودين فيُغلق الصفّ الثاني بدل أن ينتهي بفراغ معلّق. */
.prof-user .prof-stats { grid-template-columns: repeat(4, 1fr); max-width: 430px; }
.prof-user .prof-stats div { min-width: 0; }
.prof-user .prof-stats div:last-child { grid-column: span 2; }
.prof-nav.user-nav { grid-template-columns: repeat(var(--n, 4), 1fr); }

@media(max-width:1100px){ .prof-user .prof-stats { grid-template-columns: repeat(4, 1fr); max-width: none; } }
@media(max-width:900px){ .prof-user .prof-stats { grid-template-columns: repeat(3, 1fr); }
  .prof-user .prof-stats div:last-child { grid-column: auto; } }
@media(max-width:620px){ .prof-stats, .prof-user .prof-stats { grid-template-columns: repeat(2, 1fr); max-width: none; }
  .prof-user .prof-stats div:last-child { grid-column: span 2; } }
/* الصورة تتعلّق بأعلى الصفّ لا بأسفله: الصفّ يطول بطول الإحصاءات،
   فكانت الصورة تهبط معه وتنفصل عن الغلاف في صفحة العضو وحدها */
.prof-head > .prof-av { align-self: flex-start; }

/* ── مرفقات الفاتورة وحقل العملة ───────────────────────────── */
.inv-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.inv-files .hint.sm { width: 100%; margin: 0 0 2px; font-size: 11.5px; }
.inv-file { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 10px;
  background: var(--chip); font-size: 12.5px; color: var(--ink); text-decoration: none; max-width: 100%; }
.inv-file a { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; min-width: 0; }
.inv-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inv-file svg { width: 14px; height: 14px; flex: none; opacity: .7; }
.inv-file.pending { background: color-mix(in srgb, var(--coral) 14%, transparent); }
.inv-file.done { background: color-mix(in srgb, var(--mint) 16%, transparent); }
.inv-file b { cursor: pointer; opacity: .55; font-weight: 400; padding: 0 2px; }
.inv-file b:hover { opacity: 1; color: #D94265; }
.mt-xs { margin-top: 6px; }
.rate-rows { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-top: 10px; }
.rate-r { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.rate-r span { flex: 1; min-width: 0; }
.rate-r b { opacity: .6; font-weight: 500; }
.rate-r input { max-width: 96px; text-align: left; }
.cat-rows { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.cat-r { display: flex; align-items: center; gap: 8px; }
.cat-r input { flex: 1; }
.cat-r .muted { flex: none; }

/* ── أيقونة إعدادات الفواتير وقائمتها ──────────────────────── */
/* كل بطاقة تُنشئ سياق تكديس بسبب backdrop-filter، فقائمةٌ تخرج عنها
   تُرسم خلف البطاقة التالية مهما علا z-index داخلها. نرفع البطاقة نفسها
   ما دامت القائمة مفتوحة. */
.card:has(.cog-wrap.on) { position: relative; z-index: 60; }
.cog-wrap { position: relative; display: inline-flex; }
.cog-btn { width: 38px; height: 38px; padding: 0; display: grid; place-items: center; }
.cog-btn svg { width: 17px; height: 17px; }
.cog-wrap.on .cog-btn { background: var(--coral); color: #fff; border-color: transparent; }
.cog-menu { position: absolute; inset-block-start: calc(100% + 6px); inset-inline-end: 0; min-width: 196px;
  background: rgba(255, 255, 255, .95); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  border: 1px solid var(--line); border-radius: 14px; padding: 6px;
  box-shadow: 0 16px 40px rgba(20, 14, 32, .16); z-index: 70;
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  /* الانتقال على الشفافية والإزاحة وحدهما: إدراج visibility فيه يُبقيها
     عالقة على «مخفي» حين يخنق المتصفح الانتقالات (نافذة غير مرئية مثلاً) */
  transition: opacity .15s, transform .15s; }
.cog-wrap.on .cog-menu { opacity: 1; visibility: visible; transform: none; }
.cog-menu button { display: block; width: 100%; text-align: start; border: 0; background: none;
  font: inherit; color: var(--ink); padding: 9px 11px; border-radius: 10px; cursor: pointer; }
.cog-menu button:hover, .cog-menu button:focus-visible { background: var(--glass); }
.cog-menu b { display: block; font-size: 13.5px; font-weight: 600; }
.cog-menu small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 1px; }
.night .cog-menu { background: rgba(30, 23, 42, .96); }
.ts-row { display: grid; grid-template-columns: auto 1fr auto auto 92px; align-items: center; gap: 10px; }
.ts-row .pcount { text-align: start; font-size: 11.5px; line-height: 1.5; }
@media(max-width:900px){ .ts-row { grid-template-columns: auto 1fr auto; }
  .ts-row .ts-flag, .ts-row .pcount { grid-column: 2 / -1; } }
.ts-flag { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); cursor: pointer; white-space: nowrap; }
.ts-flag input { accent-color: var(--coral); }
.ts-flag span { user-select: none; }

/* ── الدفعة ٣: السحب والضمّ والشجرة ───────────────────────── */
.todo-grip { cursor: grab; color: var(--muted); opacity: .45; font-size: 13px; line-height: 1; flex: none; user-select: none; }
.todo-it:hover .todo-grip { opacity: .9; }
.todo-it.dragging { opacity: .45; }
.todo-it[draggable=true] { transition: transform .12s; }
.pick-list { max-height: 280px; overflow: auto; display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.pick-row { display: block; width: 100%; text-align: start; border: 1px solid var(--line); background: var(--card);
  border-radius: 12px; padding: 9px 12px; font: inherit; color: var(--ink); cursor: pointer; transition: .14s; }
.pick-row:hover { border-color: var(--coral); background: color-mix(in srgb, var(--coral) 7%, transparent); }
.pick-row b { display: block; font-size: 13.5px; }
.pick-row small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.lb-note b { color: var(--coral); font-weight: 600; }

/* ── مراحل المهمة داخل بطاقتها ─────────────────────────────── */
.sub-wrap { margin-top: 10px; padding-inline-start: calc(var(--d, 0) * 14px); }
.sub-head { font-size: 11.5px; color: var(--muted); margin-bottom: 5px; }
.sub-head b { color: var(--ink); font-weight: 600; }
.sub-row { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 9px;
  border-inline-start: 2px solid var(--sc, var(--lavender)); background: var(--glass); margin-bottom: 4px; }
.sub-row.done .sub-ttl { text-decoration: line-through; opacity: .55; }
.sub-chk { width: 16px; height: 16px; flex: none; border-radius: 5px; border: 1.5px solid var(--line);
  background: var(--card); cursor: pointer; padding: 0; display: grid; place-items: center; }
.sub-chk i { width: 7px; height: 7px; border-radius: 2px; background: transparent; display: block; }
.sub-row.done .sub-chk { border-color: var(--sc); background: var(--sc); }
.sub-row.done .sub-chk i { background: #fff; }
.sub-ttl { flex: 1; min-width: 0; font-size: 12.5px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sub-ttl:hover { color: var(--coral); }
.sub-pct { font-size: 11px; color: var(--muted); flex: none; }
.grid-view .item .sub-wrap { max-height: 190px; overflow: auto; }

/* ── الأجواء: المشغّل والمكتبة ──────────────────────────────── */
/* شريط زجاجي: شفافيةٌ عالية مع طمسٍ وإشباع، فما تحته يُرى من خلاله.
   والتخطيط ثلاثة أعمدة (1fr auto 1fr) ليقع زرّ التشغيل في المنتصف
   تماماً، ويُدفع زرّ الإغلاق إلى أقصى الطرف. */
.player { position: fixed; inset-inline: 0; bottom: 0; z-index: 60;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px;
  padding: 9px 16px; background: rgba(255,255,255,.55);
  backdrop-filter: blur(30px) saturate(180%); -webkit-backdrop-filter: blur(30px) saturate(180%);
  border-top: 1px solid rgba(255,255,255,.45); box-shadow: 0 -10px 40px rgba(20,14,32,.14); }
.night .player { background: rgba(26,20,38,.55); border-top-color: rgba(255,255,255,.12); }
/* فوق الفضاء الأسود لا يصلح زجاجٌ أبيض */
body.in-radio .player { background: rgba(10,16,30,.55); border-top-color: rgba(130,190,255,.18);
  box-shadow: 0 -10px 40px rgba(0,0,0,.5); }
body.in-radio .player .pl-now b { color: #EAF2FF; }
body.in-radio .player .pl-btn { background: rgba(255,255,255,.1); color: #DCE6F7; }
body.in-radio .player .pl-btn.big { background: var(--coral); color: #fff; }
.pl-side { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pl-side.end { justify-content: end; }
.pl-mid { display: flex; align-items: center; gap: 8px; }
.pl-btn { width: 32px; height: 32px; flex: none; border: 0; border-radius: 50%; background: var(--chip);
  color: var(--ink); cursor: pointer; font-size: 13px; display: grid; place-items: center; }
.pl-btn:hover { background: var(--coral); color: #fff; }
.pl-btn.big { width: 38px; height: 38px; background: var(--coral); color: #fff; font-size: 15px; }
.pl-now { min-width: 0; flex: 0 1 auto; }
.pl-now b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-now small { display: block; font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.player input[type=range] { accent-color: var(--coral); }
#plSeek { flex: 1; min-width: 60px; }
#plVol { flex: 0 0 70px; }
.pl-time { font-size: 11px; color: var(--muted); flex: none; min-width: 74px; text-align: center; }
/* نافذة بثٍّ عائمة: تُسحب وتُحجَّم وتُصغَّر وتُخفى، والبثّ لا ينقطع */
.pl-frame { position: fixed; inset-block-end: 62px; inset-inline-end: 16px; z-index: 59; width: 420px;
  max-width: calc(100vw - 32px); border-radius: 14px; overflow: hidden; background: #000;
  box-shadow: 0 20px 50px rgba(20,14,32,.35); }
.pl-frame iframe { display: block; width: 100%; height: 236px; border: 0; }
.pl-frame.audio-only iframe { height: 166px; }
.pl-frame.mini { width: 230px; }
.pl-frame.mini iframe { height: 130px; }
/* الإخفاء شفافيةٌ لا إزالة: الإطار يبقى حيّاً فيكمل البثّ */
.pl-frame.ghost { opacity: 0; pointer-events: none; }
.pl-frame-bar { display: flex; align-items: center; gap: 6px; padding: 6px 8px; cursor: grab;
  background: rgba(0,0,0,.72); color: #fff; touch-action: none; }
.pl-frame-bar:active { cursor: grabbing; }
.pl-frame-grip { opacity: .5; font-size: 12px; }
.pl-frame-bar b { flex: 1; min-width: 0; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-fb { width: 22px; height: 22px; flex: none; border: 0; border-radius: 6px; cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff; font-size: 12px; line-height: 1; display: grid; place-items: center; }
.pl-fb:hover { background: var(--coral); }
/* المقبض في الركن السفلي الأيمن فيزيائياً، فيتّفق اتجاهُ السحب مع نموّ العرض */
.pl-frame-rz { position: absolute; bottom: 0; right: 0; width: 18px; height: 18px; cursor: nwse-resize;
  touch-action: none; background: linear-gradient(135deg, transparent 52%, rgba(255,255,255,.55) 52%); }
body:has(.player:not([hidden])) { padding-bottom: 56px; }

.media-list { display: flex; flex-direction: column; }
.media-row { display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 11px; cursor: pointer; transition: .14s; }
.media-row + .media-row { box-shadow: inset 0 1px 0 rgba(140,120,160,.12); }
.media-row:hover { background: var(--glass); }
.media-row.on { background: color-mix(in srgb, var(--coral) 12%, transparent); }
.media-play { width: 32px; height: 32px; flex: none; border: 0; border-radius: 10px; background: var(--chip);
  cursor: pointer; font-size: 14px; display: grid; place-items: center; }
.media-row.on .media-play { background: var(--coral); }
.media-id { flex: 1; min-width: 0; }
.media-id b { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-id small { display: block; font-size: 11.5px; color: var(--muted); }
.media-tags { display: flex; gap: 4px; flex: none; }
.media-tags i { font-style: normal; font-size: 10.5px; background: var(--chip); color: var(--muted); padding: 2px 7px; border-radius: 99px; }
.media-by, .media-plays, .media-acts { flex: none; }
.media-ic { width: 24px; height: 24px; border: 0; background: transparent; color: var(--muted); cursor: pointer; border-radius: 50%; }
.media-ic:hover { background: var(--chip); color: var(--coral); }

.seg { display: inline-flex; gap: 4px; background: var(--chip); border-radius: 99px; padding: 3px; }
.seg button { border: 0; background: none; border-radius: 99px; padding: 5px 13px; font: inherit; font-size: 12.5px;
  color: var(--muted); cursor: pointer; }
.seg button[aria-pressed=true] { background: var(--card); color: var(--ink); font-weight: 600; }
.seg button em { font-style: normal; opacity: .6; font-size: 10.5px; }
.trash-prev { max-height: 56vh; overflow: auto; margin-top: 10px; }
.trash-prev .kv { display: flex; gap: 10px; font-size: 13px; padding: 4px 0; }
.trash-prev .kv span { color: var(--muted); min-width: 72px; }
.trash-prev .kv code { font-family: inherit; }

/* ── الأجواء: مربّعات كما في تطبيقات الموسيقى ──────────────── */
.vibe-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 16px; }
.vibe { position: relative; cursor: pointer; }
.vibe-art { position: relative; aspect-ratio: 1; border-radius: 14px; overflow: hidden;
  background: var(--chip); box-shadow: 0 6px 18px rgba(20,14,32,.12); transition: .18s; }
.vibe:hover .vibe-art { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(20,14,32,.2); }
.vibe-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vibe-ico { width: 100%; height: 100%; display: grid; place-items: center; font-size: 34px; }
.vibe-go { position: absolute; inset-block-end: 8px; inset-inline-start: 8px; width: 34px; height: 34px;
  border: 0; border-radius: 50%; background: var(--coral); color: #fff; font-size: 13px; cursor: pointer;
  opacity: 0; transform: translateY(6px); transition: .18s; display: grid; place-items: center;
  box-shadow: 0 6px 16px rgba(0,0,0,.25); }
.vibe:hover .vibe-go, .vibe.on .vibe-go { opacity: 1; transform: none; }
.vibe-lock { position: absolute; inset-block-start: 7px; inset-inline-end: 7px; font-size: 11px;
  background: rgba(0,0,0,.45); border-radius: 99px; padding: 2px 6px; font-style: normal; }
.vibe b { display: block; font-size: 13px; margin-top: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vibe small { display: block; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vibe.on b { color: var(--coral); }
.vibe-acts { position: absolute; inset-block-start: 7px; inset-inline-start: 7px; display: none; gap: 4px; }
.vibe:hover .vibe-acts { display: flex; }
.vibe-ic { width: 24px; height: 24px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92);
  color: var(--ink); font-size: 12px; cursor: pointer; }
.vibe-ic:hover { background: var(--coral); color: #fff; }

/* ── مدخل الأجواء من الرئيسية: شريط واحد، لا يأخذ مساحة ──────── */
.vibes-cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 16px;
  padding: 13px 18px; border-radius: 18px; position: relative; overflow: hidden;
  /* السكشن كلّه بدرجةٍ واحدة من لون ثيم المستخدم: الخلفية والحدّ والأزرار.
     المزج مع --glass لا --card: الأخير غير معرّف في الورقة، وأيّ color-mix
     بمتغيّرٍ مجهول يُبطل التصريح كلّه بصمت فيسقط التدرّج. */
  border: 1px solid color-mix(in srgb, var(--coral) 34%, transparent);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--coral) 14%, transparent);
  background: linear-gradient(110deg, color-mix(in srgb, var(--coral) 34%, var(--glass)) 0%,
    color-mix(in srgb, var(--coral) 16%, var(--glass)) 55%,
    color-mix(in srgb, var(--coral) 7%, var(--glass)) 100%); }
/* وميضٌ بطيء يمرّ مرّة كل ٩ ثوان: يلفت النظر بلا إزعاج */
.vibes-cta::after { content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, transparent 40%, rgba(255,255,255,.28) 50%, transparent 60%);
  transform: translateX(-100%); animation: vibeSheen 9s ease-in-out infinite; }
@keyframes vibeSheen { 0%, 78% { transform: translateX(-100%) } 92%, 100% { transform: translateX(100%) } }
@media (prefers-reduced-motion: reduce) { .vibes-cta::after { animation: none; display: none } }
.vibes-cta-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.vibes-cta-t b { font-size: 14px; }
.vibes-cta-t span { font-size: 11.5px; color: var(--muted); }
.vibes-cta-b { display: flex; gap: 8px; flex-wrap: wrap; margin-inline-start: auto; }
.vibes-cta-b button { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 12.5px;
  font-weight: 600; padding: 8px 15px; border-radius: 99px; cursor: pointer;
  color: color-mix(in srgb, var(--coral) 72%, var(--ink));
  border: 1px solid color-mix(in srgb, var(--coral) 30%, transparent);
  background: color-mix(in srgb, var(--coral) 10%, var(--glass));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--coral) 12%, transparent); transition: .16s; }
.vibes-cta-b button i { font-style: normal; font-size: 14px; }
.vibes-cta-b button:hover { background: var(--coral); color: #fff; border-color: transparent; transform: translateY(-1px); }
@media (max-width: 560px) { .vibes-cta-b { margin-inline-start: 0 } .vibes-cta-b button { flex: 1 } }

/* مجلدات قوائم التشغيل: المربّع نفسه بلون القائمة */
.pl-card { border: 0; background: none; padding: 0; text-align: start; font: inherit; color: inherit; }
.vibe-art.pl-art { background: linear-gradient(145deg, var(--pc, #7B5CD6), color-mix(in srgb, var(--pc, #7B5CD6) 42%, #140e20)); }
.pl-ico { filter: drop-shadow(0 3px 8px rgba(0,0,0,.3)); }
.pl-n { position: absolute; inset-block-end: 8px; inset-inline-end: 8px; background: rgba(0,0,0,.42); color: #fff;
  font-size: 11px; border-radius: 99px; padding: 2px 8px; }
/* شريط أدوات الأجواء يبقى سطراً واحداً: البحث لا يتمدد بلا حدّ */
#mq { min-width: 160px; max-width: 320px; }

/* ════════ راديو العالم: محطةٌ أرضية ════════════════════════════
   الطابع هنا طابعُ غرفة تحكّم: فضاءٌ أسود، أرقامٌ أحادية التباعد،
   أقواسٌ في الزوايا، وقياساتٌ تتغيّر وأنتِ تديرين الكرة. الألوان
   التفاعلية من ثيم النظام، وطقم اللوحة أزرقُ باردٌ ثابت.            */
/* الفضاء يملأ النافذة كلها ويمتدّ تحت المنيو، والمنيو يطفو فوقه. لوحاتُ
   المعلومات وحدها تُزاح إلى ما دونه بمقدار --rw-nav، وهو ارتفاع الترويسة
   مقيساً من الجافاسكربت لا مخمَّناً. و--rw-foot يُفسح لشريط المشغّل. */
.rw { --ink2: #9FB4D8; --line2: rgba(120,170,255,.22); --cy: #5FD0E8; --rw-foot: 0px;
  position: fixed; inset: 0; z-index: 0; overflow: hidden; color: #DCE6F7;
  background: #000;
  font-feature-settings: "tnum" 1; }
body.has-player .rw { --rw-foot: 74px; }
.rw canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
#rwSky { z-index: 0; }
#rwEarth { z-index: 1; }
#rwGlobe { z-index: 2; touch-action: none; cursor: grab; }
#rwGlobe:active { cursor: grabbing; }

.rw-head { position: absolute; z-index: 6; inset-block-start: 0; inset-inline: 0; display: flex; gap: 16px;
  align-items: flex-start; pointer-events: none;
  padding: calc(var(--rw-nav, 108px) + 12px) 30px 20px;
  background: linear-gradient(180deg, rgba(3,6,16,.72) 40%, transparent); }
.rw-head > * { pointer-events: auto; }
.rw-id { display: flex; align-items: center; gap: 10px; }
.rw-id b { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px;
  letter-spacing: 1.6px; color: #EAF2FF; }
.rw-id small { display: block; font-size: 11.5px; color: var(--ink2); margin-top: 3px; }
/* مؤشّر البثّ: رمادي في السكون، ينبض حين يُبثّ */
.rw-live { width: 9px; height: 9px; border-radius: 50%; background: #3B4A66; flex: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.05); }
.rw-live.on { background: var(--teal, #12BFA0); animation: rwLive 1.5s ease-in-out infinite; }
@keyframes rwLive { 0%,100% { box-shadow: 0 0 0 3px rgba(18,191,160,.14) } 50% { box-shadow: 0 0 0 8px rgba(18,191,160,0) } }

/* البحث مطويٌّ إلى عدسة في شريط الأدوات، يتمدّد بجوارها عند الطلب.
   لا نُدرج visibility في الانتقال: المتصفح يُجمّدها على hidden حين يخنق
   الانتقالات (نافذة في الخلفية) فيبقى الصندوق غائباً بعد فتحه. */
.rw-find { position: relative; flex: none; width: 0; opacity: 0; pointer-events: none;
  transition: width .24s cubic-bezier(.2,.8,.3,1), opacity .18s ease; }
.rw-find.on { width: min(260px, 48vw); opacity: 1; pointer-events: auto; }
.rw-find .fld-in { width: 100%; height: 36px; }
.rw-find .fld-in { width: 100%; background: rgba(12,20,38,.78); border: 1px solid var(--line2); color: #EAF2FF;
  border-radius: 10px; }
.rw-find .fld-in::placeholder { color: #71849F; }
.rw-find .fld-in:focus { border-color: var(--cy); box-shadow: 0 0 0 3px rgba(95,208,232,.12); }
.rw-sug { position: absolute; inset-inline-start: 0; width: min(300px, 72vw);
  inset-block-end: calc(100% + 7px); background: rgba(8,14,28,.97);
  border: 1px solid var(--line2); border-radius: 10px; overflow: hidden auto; max-height: 320px;
  box-shadow: 0 18px 44px rgba(0,0,0,.7); }
.rw-sug button { display: flex; gap: 8px; align-items: baseline; width: 100%; text-align: start; font: inherit;
  font-size: 13px; color: #DCE6F7; background: none; border: 0; padding: 9px 13px; cursor: pointer; }
.rw-sug button small { color: #7D8FAB; font-size: 11px; margin-inline-start: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.rw-sug button:hover { background: rgba(95,208,232,.12); }

/* عمود القياسات: يتغيّر وأنتِ تديرين الكرة، وهذا جوهر الإحساس */
.rw-tel { position: absolute; z-index: 5; inset-block-start: calc(var(--rw-nav, 108px) + 92px); inset-inline-start: 30px;
  display: grid; gap: 1px; pointer-events: none; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  border-inline-start: 1px solid var(--line2); padding-inline-start: 12px; }
.rw-tel div { display: flex; align-items: baseline; gap: 10px; }
.rw-tel i { font-style: normal; font-size: 9.5px; letter-spacing: 1.4px; color: #64799A; width: 38px; }
.rw-tel b { font-size: 12px; font-weight: 500; color: #CFE0F7; }
.rw-tel .live b { color: var(--teal, #12BFA0); }

.rw-tip { position: absolute; z-index: 7; pointer-events: none; background: rgba(6,12,24,.94); color: #EAF2FF;
  border: 1px solid var(--line2); border-radius: 6px; padding: 5px 10px; font-size: 12px; white-space: nowrap;
  transform: translateY(-50%); box-shadow: 0 8px 22px rgba(0,0,0,.6); }

.rw-ctl { position: absolute; z-index: 6; inset-block-end: calc(var(--rw-foot) + 20px); inset-inline-start: 30px; display: flex; gap: 8px; }
.rw-ic { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; cursor: pointer;
  border: 1px solid var(--line2); background: rgba(10,18,34,.78); color: #DCE6F7; font-size: 14px;
  backdrop-filter: blur(8px); transition: .15s; }
.rw-ic:hover { background: var(--coral); border-color: transparent; color: #fff; }

.rw-panel { position: absolute; z-index: 6; inset-inline-end: 30px; width: min(336px, 86vw);
  inset-block: calc(var(--rw-nav, 108px) + 92px) calc(var(--rw-foot) + 20px);
  display: flex; flex-direction: column; border-radius: 12px; overflow: hidden;
  background: rgba(7,12,24,.9); border: 1px solid var(--line2); backdrop-filter: blur(14px);
  box-shadow: 0 20px 56px rgba(0,0,0,.65); animation: rwIn .2s ease; }
@keyframes rwIn { from { opacity: 0; transform: translateY(8px) } }
.rw-p-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line2);
  background: linear-gradient(180deg, rgba(95,208,232,.08), transparent); }
.rw-p-head b { display: block; font-size: 15px; }
.rw-p-head small { display: block; font-size: 10.5px; color: var(--ink2); margin-top: 3px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .4px; }
.rw-p-head .rw-ic { margin-inline-start: auto; width: 28px; height: 28px; font-size: 15px; }
.rw-list { flex: 1; overflow-y: auto; padding: 7px; }
.rw-row { display: flex; align-items: center; gap: 10px; width: 100%; text-align: start; font: inherit; cursor: pointer;
  background: none; border: 0; color: #DCE6F7; padding: 9px 10px; border-radius: 8px; }
.rw-row:hover { background: rgba(95,208,232,.1); }
.rw-row.on { background: color-mix(in srgb, var(--teal, #12BFA0) 22%, transparent);
  box-shadow: inset 2px 0 0 var(--teal, #12BFA0); }
.rw-row-i { width: 32px; height: 32px; flex: none; border-radius: 6px; display: grid; place-items: center;
  overflow: hidden; background: rgba(255,255,255,.07); font-size: 14px; }
.rw-row-i img { width: 100%; height: 100%; object-fit: cover; }
.rw-row-t { min-width: 0; }
.rw-row-t b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rw-row-t small { display: block; font-size: 10.5px; color: #7D8FAB; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.rw-row-n { margin-inline-start: auto; font-size: 10px; color: #566B8C;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
/* قلب المفضّلة: باهتٌ حتى يُلمس الصفّ، ويبقى ظاهراً إن كانت مفضَّلة */
.rw-fav { margin-inline-start: auto; width: 28px; height: 28px; flex: none; border: 0; border-radius: 50%;
  background: none; color: #6E82A4; font-size: 15px; line-height: 1; cursor: pointer; opacity: 0;
  display: grid; place-items: center; transition: .15s; }
.rw-row:hover .rw-fav, .rw-row:focus-within .rw-fav, .rw-fav.on { opacity: 1; }
.rw-fav:hover { background: rgba(255,255,255,.1); color: #FF6E8A; transform: scale(1.12); }
.rw-fav.on { color: #FF5A7A; }
.rw-row .rw-row-n { margin-inline-start: 0; }
@media (hover: none) { .rw-fav { opacity: 1; } }
.rw-skel { height: 46px; margin: 6px; border-radius: 8px;
  background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(120,170,255,.14), rgba(255,255,255,.04));
  background-size: 220% 100%; animation: rwShim 1.3s linear infinite; }
@keyframes rwShim { to { background-position: -220% 0 } }
.rw-empty { padding: 18px; font-size: 12.5px; color: var(--ink2); text-align: center; }

.rw-now { position: absolute; z-index: 6; inset-block-end: calc(var(--rw-foot) + 86px); inset-inline-start: 50%; transform: translateX(50%);
  display: flex; align-items: center; gap: 12px; padding: 9px 13px; border-radius: 10px; max-width: min(420px, 84vw);
  background: rgba(7,12,24,.92); border: 1px solid var(--line2); backdrop-filter: blur(12px);
  box-shadow: 0 14px 38px rgba(0,0,0,.6); }
.rw-now-t { min-width: 0; }
.rw-now-t b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rw-now-t small { display: block; font-size: 10.5px; color: #7D8FAB; }
.rw-now .rw-ic { width: 30px; height: 30px; font-size: 12px; }
/* مُعادل الطيف زينةٌ لا تقرأ الصوت: البثّ من نطاقٍ آخر لا يُقرأ تحليله */
.rw-eq { display: flex; align-items: flex-end; gap: 2px; height: 17px; flex: none; }
.rw-eq i { width: 3px; border-radius: 1px; background: var(--teal, #12BFA0); animation: rwEq .9s ease-in-out infinite; }
.rw-eq i:nth-child(1) { height: 40%; animation-delay: -.2s }
.rw-eq i:nth-child(2) { height: 85%; animation-delay: -.5s }
.rw-eq i:nth-child(3) { height: 60%; animation-delay: -.1s }
.rw-eq i:nth-child(4) { height: 95%; animation-delay: -.7s }
@keyframes rwEq { 0%, 100% { transform: scaleY(.4) } 50% { transform: scaleY(1) } }
@media (prefers-reduced-motion: reduce) { .rw-eq i, .rw-live.on { animation: none } }

/* تتابع الإقلاع: يغطّي الصفحة لحظةً ثم ينصرف */
.rw-boot { position: absolute; z-index: 9; inset: 0; display: grid; place-items: center; background: #04060E;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: var(--cy);
  letter-spacing: 1px; transition: opacity .6s ease; }
.rw-boot.gone { opacity: 0; pointer-events: none; }
.rw-boot span::before { content: '> '; opacity: .6; }

@media (max-width: 720px) {
  .rw-head { padding: calc(var(--rw-nav, 108px) + 10px) 16px 16px; flex-direction: column; gap: 10px; }
  .rw-tel { inset-block-start: auto; inset-block-end: calc(var(--rw-foot) + 66px); inset-inline-start: 16px; font-size: 11px; }
  .rw-tel div:nth-child(n+4) { display: none; }
  .rw-panel { inset-block: auto var(--rw-foot); inset-inline: 0; width: auto; max-height: 54%; border-radius: 14px 14px 0 0; }
  .rw-ctl { inset-block-end: calc(var(--rw-foot) + 14px); inset-inline-start: 16px; }
  .rw-find.on { width: min(200px, 44vw); }
  .rw-now { inset-block-end: calc(var(--rw-foot) + 76px); }
}
/* زرّ راديو العالم يتميّز قليلاً: هو باب الصفحة الجديدة */
.vibes-cta-b button.hot { background: linear-gradient(120deg, var(--coral), color-mix(in srgb, var(--coral) 62%, #000)); color: #fff; border-color: transparent; }
.vibes-cta-b button.hot:hover { filter: brightness(1.06); }
/* ── الراديو يبتلع الصفحة ─────────────────────────────────────────
   لا ترويسةَ صفحة، ولا بطاقةً بيضاء فوق الفضاء، ولا كراتِ الخلفية
   الملوّنة: يبقى المنيو وحده طافياً فوق الكوكب.                      */
/* 100vw تشمل عرض شريط التمرير، فقد تُولّد تمريراً أفقياً حين يظهر */
body.in-radio { background: #000; overflow-x: hidden; }
/* حركةُ دخول الصفحات تترك transform ضئيلاً باقياً (fill-mode: both)، وأيُّ
   تحويلٍ غير none يجعل العنصرَ الحاضنةَ لكل fixed بداخله — فكان الفضاء
   يُحسب داخل حدود الصفحة لا النافذة. نُعفي هذه الصفحة منها وحدها. */
#radioView.active { animation: none; transform: none; }
body.in-radio .bg { display: none; }
/* زرّ المساعد يزدحم فوق الكوكب؛ يبقى في كل صفحةٍ سواها */
body.in-radio #aiFab { display: none; }
/* شريط التشغيل يحتلّ أسفل النافذة، فترتفع أيقونة المساعد فوقه */
body.has-player .ai-fab { bottom: calc(24px + 74px); }
@media (max-width: 720px) { body.has-player .ai-fab { bottom: calc(16px + 74px); } }
body.in-radio .hero-top { display: none; }
body.in-radio .hero { background: none; box-shadow: none; border-color: transparent;
  backdrop-filter: none; -webkit-backdrop-filter: none; padding: 18px 20px 0; margin-bottom: 10px; }
body.in-radio .nav { margin-bottom: 0; }
body.in-radio .wrap { padding-bottom: 0; }
/* أزرار المنيو فوق سوادٍ: حدودٌ باهتة بدل بياضٍ صارخ */
body.in-radio .nav .btn.soft { background: rgba(14,26,52,.72); color: #D7E5FA;
  border-color: rgba(120,170,255,.22); }
body.in-radio .nav .btn.soft:hover { background: rgba(28,52,96,.9); }
body.in-radio .nav .btn[aria-pressed=true] { background: var(--coral); color: #fff; border-color: transparent; }
/* شريط المشغّل ثابتٌ فوق أسفل النافذة، وصفحة الراديو بارتفاعٍ ثابت —
   فلولا هذا لبقي أسفلها (الأزرار و«يُبثّ الآن») مخفياً تحته أبداً. */


/* ── نافذة قائمة التشغيل: تسمية ولون وإضافة ────────────────── */
.pl-head { display: flex; align-items: center; gap: 12px; }
.pl-head .grow { flex: 1; min-width: 0; }
.pl-dot { width: 46px; height: 46px; flex: none; border-radius: 12px; display: grid; place-items: center;
  font-size: 22px; background: linear-gradient(145deg, var(--pc), color-mix(in srgb, var(--pc) 45%, #140e20)); }
.pl-colors { display: flex; gap: 7px; flex-wrap: wrap; }
.pl-colors button { width: 26px; height: 26px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
.pl-colors button.on { border-color: var(--ink); box-shadow: 0 0 0 2px var(--glass); }
.pl-add { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.pl-add label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.pl-pick { display: flex; flex-wrap: wrap; gap: 6px; max-height: 148px; overflow-y: auto; }
.pl-pick button { font: inherit; font-size: 12px; padding: 6px 11px; border-radius: 99px; cursor: pointer;
  border: 1px solid var(--line); background: var(--chip); color: var(--ink); max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-pick button:hover { background: var(--coral); color: #fff; border-color: transparent; }

/* معاينة ما استُنتج من الرابط قبل الحفظ */
.lk-probe { display: flex; align-items: center; gap: 11px; margin: 10px 0 4px; padding: 9px 11px;
  border: 1px solid var(--line); border-radius: 13px; background: var(--chip); }
.lk-probe .grow { flex: 1; min-width: 0; }
.lk-probe b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lk-probe small { display: block; font-size: 11px; }
.lk-art { width: 46px; height: 46px; flex: none; border-radius: 9px; overflow: hidden; display: grid;
  place-items: center; background: var(--glass); font-size: 20px; }
.lk-art img { width: 100%; height: 100%; object-fit: cover; }
.pl-cover { display: flex; gap: 6px; align-items: center; }
.pl-cover .grow { flex: 1; min-width: 0; }
.pl-dot img, .pl-art img { width: 100%; height: 100%; object-fit: cover; }
/* زرّ التكرار مُضاء حين يكون مفعَّلاً */
.pl-btn.on { background: var(--coral); color: #fff; }

/* ════════ الجوال وحده: مساحات لمسٍ وقوائم داخل الشاشة ══════════
   كل ما في هذه الكتلة محصورٌ في عرض الهاتف، فلا تتغيّر نسخة الويب.
   الإصبع ليست مؤشّراً: ما يكفي للنقر بالفأرة لا يكفي للمس.           */
@media (max-width: 720px) {
  /* القائمة المنسدلة كانت ترتكز على بطاقتها فتخرج عن الشاشة. على الجوال
     تصير ورقةً سفلية مثبّتة بالشاشة نفسها، فلا تخرج أبداً مهما كان موضع
     البطاقة التي فتحتها. */
  .cog-menu { position: fixed; inset: auto 14px calc(14px + env(safe-area-inset-bottom)) 14px;
    width: auto; min-width: 0; max-width: none; z-index: 80; }

  /* مربّعات الاختيار على بطاقات المرفقات: ٢٠ بكسل لا تُلمس */
  #filesView input[type=checkbox] { width: 30px; height: 30px; }

  /* خطوات المهام: المربّع صغير، فنُكبّر مساحة لمسه لا شكله وحده */
  .sub-chk { width: 30px; height: 30px; }
  .sub-chk i { width: 12px; height: 12px; }

  /* روابط أسماء الأعضاء في لوحة الفريق */
  .ulink { display: inline-block; min-height: 30px; line-height: 30px; }

  /* شرائح التبويب في vibes: ٢٤ بكسل ارتفاعاً أقلّ من اللازم */
  .seg button { min-height: 34px; padding-inline: 14px; }

  /* أيقونات بطاقات التدوينات في الملف الشخصي */
  .fd-ic { width: 32px; height: 32px; }
}

/* ============ الصفحات (Write Up) ============ */
/* القائمة */
.wu-list-head .hint{max-width:46ch}
.wu-filters{gap:8px;flex-wrap:wrap}
/* شريط التصفية أعرض من الجوال: يُمرَّر أفقياً في مكانه بدل أن يدفع الصفحة كلها جانباً */
.wu-filters .seg{max-width:100%;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
.wu-filters .seg::-webkit-scrollbar{display:none}
.wu-filters .seg button{flex:none;white-space:nowrap}
.wu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.wu-card{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none;box-shadow:var(--shadow);transition:transform .15s}
.wu-card:hover{transform:translateY(-2px)}
.wu-card-cover{height:56px;background:color-mix(in srgb,var(--lavender) 22%,transparent)}
.wu-card-body{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px}
.wu-card-title{font-weight:700;display:flex;gap:6px;align-items:center}
.wu-card-ex{color:var(--ink-2);font-size:13px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wu-card-meta{color:var(--muted);font-size:12px}
.wu-new{position:relative}
.wu-menu{position:absolute;inset-inline-end:0;top:calc(100% + 6px);z-index:30;min-width:220px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column}
.wu-menu button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:start;padding:10px 12px;border-radius:10px;background:none;border:0;color:var(--ink);cursor:pointer;font:inherit}
.wu-menu button:hover{background:var(--chip)}
.wu-menu small{color:var(--muted);font-size:12px}
.wu-menu .danger{color:#D94265}
/* الأغلفة المسبقة: ألوان النظام لا صور خارجية */
.cv-sunrise{background:linear-gradient(120deg,#FFB39A,#FFC9DA)!important}
.cv-lavender{background:linear-gradient(120deg,#C9AEF7,#EFE6FB)!important}
.cv-mint{background:linear-gradient(120deg,#9FE6D6,#CFF5EA)!important}
.cv-sky{background:linear-gradient(120deg,#9CCBF5,#D6E9FF)!important}
.cv-sand{background:linear-gradient(120deg,#F5D6A8,#FBF4EE)!important}
.cv-plum{background:linear-gradient(120deg,#7C5BA6,#B69CF0)!important}
.cv-ink{background:linear-gradient(120deg,#171326,#4A4459)!important}

/* الصفحة */
.wu-page{max-width:860px;margin:0 auto;padding-bottom:80px}
.wu-page.is-wide{max-width:1180px}
.wu-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0 10px}
.wu-crumbs{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.wu-crumbs a{color:var(--ink-2);text-decoration:none}
.wu-crumbs a:hover{text-decoration:underline}
.wu-status{font-size:12px;color:var(--muted);padding:4px 10px;border-radius:99px;background:var(--chip)}
.wu-status[data-s=saved]{color:#0E8F78}
.wu-status[data-s=error],.wu-status[data-s=conflict],.wu-status[data-s=denied],.wu-status[data-s=rejected]{color:#D94265;background:rgba(217,66,101,.1)}
.wu-status[data-s=dirty],.wu-status[data-s=saving]{color:#C77F00}
.wu-star[aria-pressed=true]{color:#E3A100}
.wu-menu-end{inset-inline-end:0}
.wu-banner{margin:6px 0;padding:10px 14px;border-radius:12px;background:rgba(245,166,35,.14);color:var(--ink);font-size:14px}
.wu-cover{position:relative;height:190px;border-radius:20px;background-size:cover;background-position:center var(--y,50%)}
.wu-cover.is-empty{height:44px;background:none}
.wu-cover-acts{position:absolute;inset-inline-end:12px;bottom:10px;display:flex;gap:6px;opacity:0;transition:opacity .15s}
.wu-cover:hover .wu-cover-acts,.wu-cover.is-empty .wu-cover-acts,.wu-cover-acts:focus-within{opacity:1}
.wu-cover.is-empty .wu-cover-acts{position:static;justify-content:flex-end;padding-top:6px}
.wu-cover-list{position:absolute;inset-inline-end:12px;bottom:46px;display:flex;gap:6px;padding:8px;background:var(--card);border-radius:12px;box-shadow:var(--shadow);z-index:5}
.wu-cover-list button{width:34px;height:24px;border-radius:7px;border:0;cursor:pointer}
.wu-head{position:relative;padding:0 6px}
.wu-icon-wrap{position:relative;margin-top:-28px}
.wu-cover.is-empty+.wu-head .wu-icon-wrap{margin-top:0}
.wu-icon{font-size:52px;line-height:1;background:none;border:0;cursor:pointer;padding:4px;border-radius:14px}
.wu-icon:hover:not(:disabled){background:var(--chip)}
/* منتقي الأيقونة: رموز بمجموعات وبحث، أو صورة */
.wu-ipick{position:fixed;z-index:1000;display:flex;flex-direction:column;gap:8px;padding:10px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.wu-ipick-head{display:flex;align-items:center;gap:8px}
.wu-ipick-q[hidden]{display:none}
.wu-ipick-body{overflow:auto;min-height:120px}
.wu-ipick-body h5{margin:8px 2px 4px;font-size:12px;color:var(--muted);font-weight:600}
.wu-ipick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:2px}
.wu-ipick-grid button{font-size:22px;line-height:1;height:38px;background:none;border:0;border-radius:9px;cursor:pointer}
.wu-ipick-grid button:hover,.wu-ipick-grid button:focus-visible{background:var(--chip)}
.wu-ipick-img{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:6px 2px}
.wu-ipick-none{padding:10px 4px}
/* أيقونة بصورة: مربعة بزوايا مستديرة بحجم ما حولها */
.wu-ico-img{width:1em;height:1em;object-fit:cover;border-radius:.22em;vertical-align:-.15em;display:inline-block}
.wu-icon .wu-ico-img{width:64px;height:64px;border-radius:14px;vertical-align:middle}
.wu-print-title .wu-ico-img{width:.9em;height:.9em}
.wu-title{width:100%;border:0;background:none;resize:none;overflow:hidden;font:inherit;font-size:clamp(28px,4vw,40px);font-weight:800;color:var(--ink);padding:6px 0;outline:none;line-height:1.3}
/* العنوان الفارغ: اتجاهه التلقائي يساري فيظهر «بلا عنوان» يساراً — يبدأ يميناً ما دام فارغاً */
.wu-title:placeholder-shown{direction:rtl}
/* العنوان الفرعي تحت العنوان: سطر وصف أخفّ */
.wu-subtitle{width:100%;border:0;background:none;resize:none;overflow:hidden;font:inherit;font-size:clamp(17px,2vw,20px);font-weight:500;color:var(--ink-2);padding:0 0 8px;outline:none;line-height:1.6}
.wu-subtitle::placeholder{color:var(--muted);opacity:.55}
.wu-subtitle:placeholder-shown{direction:rtl}
body.wu-printing .wu-subtitle{display:none!important}
.wu-print-title small{display:block;font-size:13pt;font-weight:500;color:#4A4459;margin-top:2mm}
.wu-sep{width:1px;height:22px;background:var(--line);margin:0 4px}
.wu-lbl{font-size:13px;color:var(--muted);margin-inline-end:6px}
.wu-a{font-weight:800;text-decoration:underline 3px var(--coral)}
/* المستند */
.wu-editor{min-height:50vh}
.wu-doc{outline:none;font-size:17px;line-height:1.95;color:var(--ink);padding:4px 6px}
.wu-doc>*+*{margin-top:.55em}
.wu-doc h1{font-size:1.75em;margin:1.1em 0 .3em}.wu-doc h2{font-size:1.4em;margin:1em 0 .25em}.wu-doc h3{font-size:1.18em;margin:.9em 0 .2em}
/* اتجاه كل كتلة من أول حرف فيها (إضافة wuAutoDir)، والكتلة بلا حروف يمينية */
.wu-doc ul,.wu-doc ol{padding-inline-start:1.6em}
.wu-doc blockquote{border-inline-start:4px solid var(--lavender);margin:0;padding:.2em 1em;color:var(--ink-2)}
.wu-doc hr{border:0;border-top:2px solid var(--line);margin:1.4em 0}
.wu-doc code{background:var(--chip);padding:.1em .35em;border-radius:6px;font-size:.92em}
.wu-doc pre{background:#171326;color:#F7F3FF;padding:12px 16px;border-radius:12px;direction:ltr;text-align:left;overflow:auto}
.wu-doc pre code{background:none;color:inherit;padding:0}
.wu-doc a{color:var(--plum);text-decoration:underline}
.wu-doc ul[data-type=taskList]{list-style:none;padding-inline-start:.3em}
/* قائمة التحقق: المربع بجانب أول سطر من النص، لا فوقه ولا تحته */
.wu-doc ul[data-type=taskList] li{display:flex;gap:.6em;align-items:flex-start}
.wu-doc ul[data-type=taskList] li>label{display:flex;align-items:center;height:1.95em;margin:0;flex:none}
.wu-doc ul[data-type=taskList] li>div{flex:1;min-width:0}
.wu-doc li>p,.wu-doc li>div>p{margin:0}
.wu-doc li+li{margin-top:.15em}
.wu-doc ul[data-type=taskList] li>label input{width:17px;height:17px;accent-color:var(--mint)}
.wu-doc ul[data-type=taskList] li[data-checked=true]>div{color:var(--muted);text-decoration:line-through}
.wu-doc [data-callout]{border-radius:14px;padding:.7em 1em;border:1px solid transparent;background:rgba(47,128,237,.08);border-color:rgba(47,128,237,.25)}
.wu-doc [data-callout][data-tone=success]{background:rgba(18,191,160,.1);border-color:rgba(18,191,160,.3)}
.wu-doc [data-callout][data-tone=warning]{background:rgba(245,166,35,.12);border-color:rgba(245,166,35,.35)}
.wu-doc [data-callout][data-tone=danger]{background:rgba(217,66,101,.09);border-color:rgba(217,66,101,.3)}
.wu-doc [data-callout][data-tone=note]{background:var(--chip);border-color:var(--line)}
/* لون حرّ للصندوق: خلفية فاتحة وحدّ من اللون نفسه */
.wu-doc [data-callout][data-color]{background:color-mix(in srgb,var(--cc) 12%,transparent);border-color:color-mix(in srgb,var(--cc) 40%,transparent)}
.wu-doc [data-type=details]{border:1px solid var(--line);border-radius:12px;padding:.4em .9em;display:flex;gap:.4em}
.wu-doc [data-type=details]>button{background:none;border:0;cursor:pointer;color:var(--muted);font-size:14px;padding:.2em}
.wu-doc [data-type=details] summary{font-weight:700;list-style:none}
.wu-doc table{border-collapse:collapse;width:100%;table-layout:fixed;margin:.6em 0;overflow:hidden;border-radius:10px}
.wu-doc td,.wu-doc th{border:1px solid var(--line);padding:.45em .7em;vertical-align:top;position:relative}
.wu-doc th{background:var(--chip);font-weight:700;text-align:start}
.wu-doc .selectedCell::after{content:'';position:absolute;inset:0;background:color-mix(in srgb,var(--lavender) 25%,transparent);pointer-events:none}
.wu-doc .column-resize-handle{position:absolute;inset-inline-end:-2px;top:0;bottom:0;width:4px;background:var(--lavender);pointer-events:none}
.wu-doc .tableWrapper{overflow-x:auto}
.wu-doc p.is-empty:first-child::before,.wu-doc .is-empty::before{content:attr(data-placeholder);color:var(--muted);float:inline-start;height:0;pointer-events:none}
/* الصور: عرض نسبي ومحاذاة وتعليق؛ المعرض شبكة؛ الملف بطاقة للتنزيل */
.wu-editor{position:relative;padding-inline-end:26px}
.wu-doc figure.wu-fig{margin:.8em 0;display:flex;flex-direction:column;align-items:center}
.wu-doc figure.wu-fig[data-align=start]{align-items:flex-start}
.wu-doc figure.wu-fig[data-align=end]{align-items:flex-end}
.wu-doc figure.wu-fig img{display:block;max-width:100%;border-radius:12px;background:var(--chip);min-height:40px}
.wu-doc figure.wu-fig[data-w="25"] img{width:25%}.wu-doc figure.wu-fig[data-w="50"] img{width:50%}
.wu-doc figure.wu-fig[data-w="75"] img{width:75%}.wu-doc figure.wu-fig[data-w="100"] img{width:100%}
.wu-doc figcaption{font-size:13.5px;color:var(--muted);margin-top:6px;text-align:center}
.wu-doc .ProseMirror-selectednode{outline:3px solid color-mix(in srgb,var(--lavender) 70%,transparent);outline-offset:3px;border-radius:12px}
.wu-doc .wu-gallery{display:grid;grid-template-columns:repeat(var(--cols,3),1fr);gap:8px;margin:.8em 0}
.wu-doc .wu-gallery[data-cols="2"]{--cols:2}.wu-doc .wu-gallery[data-cols="4"]{--cols:4}
.wu-doc .wu-gallery figure.wu-fig{margin:0}
.wu-doc .wu-gallery figure.wu-fig img{width:100%!important;aspect-ratio:4/3;object-fit:cover}
.wu-doc .wu-gallery figcaption{display:none}
.wu-doc .wu-file{display:flex;align-items:center;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card);margin:.6em 0;max-width:520px}
.wu-file-ic{font-size:26px}
.wu-file-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.wu-file-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wu-file-size{font-size:12.5px;color:var(--muted)}
.wu-doc a.wu-file-dl{text-decoration:none;font-size:13px;padding:6px 12px;border-radius:99px;background:var(--chip);color:var(--ink)}
.wu-doc a.wu-mention{display:inline-block;padding:0 .4em;border-radius:7px;background:color-mix(in srgb,var(--lavender) 22%,transparent);color:var(--plum);text-decoration:none;font-weight:600;cursor:pointer}
.wu-doc a.wu-mention.is-gone{background:var(--chip);color:var(--muted);font-weight:400;cursor:default}
/* الأعمدة: كتل جنباً إلى جنب، وخط الإفلات عند السحب إلى حافة كتلة */
.wu-doc .wu-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin:.9em 0}
.wu-doc .wu-cols[data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.wu-doc .wu-cols[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.wu-doc .wu-col{min-width:0;border-radius:10px;outline:1px dashed transparent;outline-offset:4px;transition:outline-color .15s}
.wu-doc .wu-cols:hover>.wu-col{outline-color:var(--line)}
.wu-doc .wu-col>*+*{margin-top:.55em}
.wu-doc .wu-col>:first-child{margin-top:0}
.wu-col-guide{position:absolute;width:4px;border-radius:4px;background:var(--plum);opacity:.7;pointer-events:none;z-index:20}
.wu-col-guide[hidden]{display:none}
@media (max-width:640px){.wu-doc .wu-cols,.wu-doc .wu-cols[data-n]{grid-template-columns:1fr;gap:10px}}
/* رابط صفحة فرعية داخل النص */
.wu-doc a.wu-plink{display:flex;align-items:center;gap:8px;width:fit-content;max-width:100%;margin:.3em 0;padding:4px 8px;border-radius:9px;color:var(--ink);text-decoration:none;font-weight:600;cursor:pointer}
.wu-doc a.wu-plink:hover{background:var(--chip)}
.wu-plink-ic{font-size:1.15em;line-height:1}
.wu-plink-t{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.wu-doc a.wu-plink.is-gone{color:var(--muted);font-weight:400;cursor:default}
.wu-doc .ProseMirror-selectednode.wu-plink{outline-offset:1px}
.wu-bmenu .wu-plist small{display:block;font-size:11px;color:var(--muted)}
/* مقبض السحب وشريط الصورة */
.wu-drag{display:flex;gap:1px;align-items:center;user-select:none;padding-inline-start:4px}
.wu-drag button{border:0;background:none;color:var(--muted);font:inherit;line-height:1;border-radius:6px;padding:4px 3px;cursor:pointer}
.wu-drag button:hover{background:var(--chip);color:var(--ink)}
.wu-h-add{font-size:16px}
.wu-h-grip{font-size:14px;letter-spacing:-3px;cursor:grab;color:var(--muted);padding:4px 3px;border-radius:6px}
.wu-h-grip:hover{background:var(--chip);color:var(--ink)}
/* الشريط العائم على التحديد، وأدوات الجدول، وقائمة الكتلة */
.wu-bubble,.wu-tblbar{position:absolute;z-index:30;display:flex;align-items:center;gap:1px;padding:4px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);white-space:nowrap}
.wu-bubble[hidden],.wu-tblbar[hidden]{display:none}
.wu-bb,.wu-tblbar>button{border:0;background:none;font:inherit;font-size:13.5px;color:var(--ink);min-width:30px;height:30px;padding:0 8px;border-radius:8px;cursor:pointer}
.wu-bb:hover,.wu-tblbar>button:hover{background:var(--chip)}
.wu-bb[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 30%,transparent);color:var(--plum)}
.wu-bsep{width:1px;height:20px;background:var(--line);margin:0 3px}
.wu-bpop{position:absolute;top:calc(100% + 6px);inset-inline-start:0;min-width:200px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);white-space:normal}
.wu-bpop[hidden]{display:none}
.wu-plist{display:flex;flex-direction:column}
.wu-plist-2{display:grid;grid-template-columns:1fr 1fr}
.wu-plist button{display:flex;align-items:center;gap:8px;text-align:start;border:0;background:none;font:inherit;font-size:13.5px;color:var(--ink);padding:6px 8px;border-radius:8px;cursor:pointer}
.wu-plist button:hover{background:var(--chip)}
.wu-plist button[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 25%,transparent)}
.wu-plist hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.wu-plist .wu-sg-ic{width:24px;height:24px;font-size:11px}
.wu-plist .danger{color:#D94265}
.wu-pop-h{font-size:11.5px;color:var(--muted);margin:6px 6px 3px;font-weight:600}
.wu-sws{display:flex;flex-wrap:wrap;gap:5px;padding:2px 6px 4px}
.wu-sw{width:22px;height:22px;border-radius:6px;border:1px solid var(--line);background:var(--c);cursor:pointer}
.wu-sw-none{background:var(--card);color:var(--muted);font-size:13px;line-height:1}
.wu-cc-row{align-items:center}
.wu-cc{position:relative;display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--ink-2);padding:2px 8px;border:1px dashed var(--line);border-radius:7px;cursor:pointer;height:22px}
.wu-cc input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0}
.wu-blink{display:flex;gap:6px;align-items:center}
.wu-blink input{min-width:220px}
.wu-bmenu{position:fixed;z-index:1000;width:300px;max-height:min(560px,86vh);overflow:auto;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.wu-bm-q{width:100%;margin:2px 0 4px;position:sticky;top:0;z-index:1}
.wu-bm-sec[hidden],.wu-bmenu [data-words][hidden]{display:none}
.wu-bmenu .wu-plist button>span:last-child{display:flex;flex-direction:column;min-width:0}
.wu-imgbar{position:absolute;inset-inline:0;margin:0 auto;width:max-content;max-width:100%;z-index:12;display:flex;flex-wrap:wrap;gap:3px;align-items:center;padding:5px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.wu-imgbar>button{border:0;background:none;font:inherit;font-size:13px;padding:5px 9px;border-radius:8px;cursor:pointer;color:var(--ink)}
.wu-imgbar>button:hover{background:var(--chip)}
.wu-imgbar>button[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 30%,transparent);color:var(--plum)}
.wu-imgbar .danger{color:#D94265}
.wu-ib-form{display:flex;gap:6px;width:100%;padding-top:4px}
.wu-ib-form[hidden]{display:none}
.wu-ib-form input{flex:1;min-width:180px}
/* قائمتا / و@ */
.wu-suggest{position:fixed;z-index:1000;width:270px;max-height:320px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:5px}
.wu-sg-i{display:flex;gap:10px;align-items:center;width:100%;text-align:start;border:0;background:none;padding:7px 9px;border-radius:9px;font:inherit;color:var(--ink);cursor:pointer}
.wu-sg-i[aria-selected=true],.wu-sg-i:hover{background:var(--chip)}
.wu-sg-ic{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center;font-size:13px;font-weight:700;flex:none}
.wu-sg-t{display:flex;flex-direction:column;font-size:14px}
.wu-sg-t small{color:var(--muted);font-size:12px}
.wu-sg-empty{padding:10px;color:var(--muted);font-size:13px}
.wu-sg-h{font-size:11.5px;font-weight:700;color:var(--muted);padding:8px 10px 3px}
.wu-sg-h:first-child{padding-top:3px}
.wu-sg-av{border-radius:50%;overflow:hidden;background:var(--chip)}
.wu-sg-av img{width:100%;height:100%;object-fit:cover}
.wu-doc a.wu-mention.wu-m-user{background:color-mix(in srgb,#2F80ED 14%,transparent);color:#1F5FB8}
.night .wu-doc a.wu-mention.wu-m-user{color:#8EC0FF}
/* البحث والاستبدال */
.wu-find{position:sticky;top:8px;z-index:16;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px;margin:0 0 10px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.wu-find[hidden]{display:none}
.wu-find input{flex:1;min-width:140px}
.wu-find-n{font-size:12.5px;color:var(--muted);min-width:56px}
.wu-doc .wu-hit{background:#FFF3B0;border-radius:3px}
.wu-doc .wu-hit.is-cur{background:#FFB547;box-shadow:0 0 0 2px #FFB547}
.cv-img{background-size:cover!important;background-position:center var(--y,50%)}
.wu-cover-up{width:auto!important;padding:0 10px;font:inherit;font-size:12.5px;background:var(--chip)!important;color:var(--ink)}
/* التعليقات: لوحة جانبية، والكتل المعلَّق عليها معلَّمة في الهامش */
.wu-side{position:fixed;inset-block:12px;inset-inline-end:12px;width:min(360px,92vw);z-index:40;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.wu-side[hidden]{display:none}
.wu-side-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.wu-side-head b{flex:1}
.wu-threads{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:10px}
.wu-thread{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:var(--bg,transparent)}
.wu-thread.is-new{border-color:var(--lavender)}
.wu-c-page{align-self:flex-start}
.wu-thread blockquote{margin:0 0 8px;padding:2px 10px;border-inline-start:3px solid #F5A623;color:var(--ink-2);font-size:13px;cursor:pointer;max-height:4.5em;overflow:hidden}
.wu-thread textarea{width:100%;margin-bottom:6px}
.wu-c+.wu-c{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.wu-c-h{display:flex;gap:8px;align-items:baseline;font-size:13px}
.wu-c-h time{color:var(--muted);font-size:12px;flex:1}
.wu-c-x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:16px;line-height:1}
.wu-c p{margin:4px 0 0;font-size:14px;line-height:1.75;white-space:pre-wrap}
.wu-t-foot{display:flex;gap:6px;margin-top:8px}
.wu-t-foot input{flex:1;min-width:0}
.wu-doc .wu-commented{box-shadow:inset -3px 0 0 #F5A623}
[dir=ltr] .wu-doc .wu-commented,.wu-doc [dir=ltr].wu-commented{box-shadow:inset 3px 0 0 #F5A623}
.wu-doc .wu-flash{animation:wuFlash 1.4s ease}
@keyframes wuFlash{0%,40%{background:rgba(245,166,35,.25)}100%{background:transparent}}
.wu-side-open .wu-page{margin-inline-end:min(380px,30vw)}
/* نوافذ المشاركة والنسخ والقوالب */
.wu-dlg{width:min(640px,94vw)}
.wu-dlg.wu-versions{width:min(1000px,96vw)}
.wu-h4{margin:16px 0 4px;font-size:15px}
.wu-share-scope{display:flex;flex-wrap:wrap;gap:14px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px}
.wu-share-scope label{display:flex;gap:6px;align-items:center;cursor:pointer}
.wu-share-role{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:13px}
.wu-share-role[hidden]{display:none}
.wu-shares{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.wu-share{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:12px;background:var(--chip)}
.wu-share b{flex:1;font-weight:600}
.wu-share-add{gap:8px}
.wu-ver{display:grid;grid-template-columns:240px 1fr;gap:12px;min-height:50vh}
.wu-ver-list{list-style:none;margin:0;padding:0;overflow:auto;max-height:60vh;display:flex;flex-direction:column;gap:4px}
.wu-ver-list button{width:100%;text-align:start;border:0;background:none;padding:8px 10px;border-radius:10px;cursor:pointer;font:inherit;color:var(--ink);display:flex;flex-direction:column}
.wu-ver-list button:hover{background:var(--chip)}
.wu-ver-list button[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 28%,transparent)}
.wu-ver-list small{color:var(--muted);font-size:12px}
.wu-ver-view{border:1px solid var(--line);border-radius:14px;padding:10px 14px;overflow:auto;max-height:60vh}
.wu-ver-title{margin:4px 0 8px;font-size:20px}
.wu-tpl-scope{margin-bottom:12px}
.wu-tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.wu-tpl-grid .wu-h4,.wu-tpl-note{grid-column:1/-1}
.wu-tpl{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:start;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card);cursor:pointer;font:inherit;color:var(--ink)}
.wu-tpl:hover{border-color:var(--lavender);transform:translateY(-1px)}
.wu-tpl i{font-style:normal;font-size:24px}
.wu-tpl small{color:var(--muted);font-size:12px;line-height:1.6}
.wu-banner-tpl{background:color-mix(in srgb,var(--lavender) 18%,transparent)}
/* داخل صفحة: الصفحة هي الواجهة كلها — تختفي القائمة العامة وأزرارها العائمة */
body.wu-in-page .wrap>.hero,body.wu-in-page .bottom-nav,body.wu-in-page .fab,body.wu-in-page .ai-fab,body.wu-in-page .tabbar{display:none!important}
body.wu-in-page .wu-page{padding-top:14px}
/* قائمة الأدوات الجانبية: سهم على حافة الشاشة، يفتح عموداً عند المرور أو اللمس */
.wu-rail{position:fixed;inset-inline-end:0;top:50%;transform:translateY(-50%);z-index:35;display:flex;align-items:center}
.wu-rail-tab{width:22px;height:64px;display:grid;place-items:center;border:1px solid var(--line);border-inline-end:0;border-start-start-radius:12px;border-end-start-radius:12px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ink-2);font-size:18px;cursor:pointer;box-shadow:var(--shadow);transition:opacity .15s}
.wu-rail-tab span{display:inline-block;transition:transform .2s}
.wu-rail.is-open .wu-rail-tab{opacity:0;pointer-events:none}
.wu-rail-panel{position:absolute;inset-inline-end:0;top:50%;width:196px;max-height:90vh;overflow:auto;display:flex;flex-direction:column;gap:2px;padding:10px 8px;
  background:var(--card);border:1px solid var(--line);border-inline-end:0;border-start-start-radius:16px;border-end-start-radius:16px;box-shadow:var(--shadow);
  transform:translate(var(--rail-hide,-100%),-50%);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .18s ease}
[dir=ltr] .wu-rail-panel{--rail-hide:100%}
/* لوحة التعليقات على الحافة نفسها: القائمة تتنحّى ما دامت مفتوحة */
.wu-side-open .wu-rail{display:none}
.wu-rail.is-open .wu-rail-panel{transform:translate(0,-50%);opacity:1;pointer-events:auto}
.wu-rail-info{font-size:12px;color:var(--ink-2);line-height:1.75;padding:2px 8px 6px}
.wu-rail-count{font-size:12px;color:var(--muted);line-height:1.6;padding:2px 8px 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.wu-rail-h{font-size:11.5px;font-weight:700;color:var(--muted);padding:8px 8px 2px}
.wu-r{display:flex;align-items:center;gap:10px;width:100%;text-align:start;border:0;background:none;font:inherit;font-size:13.5px;color:var(--ink);padding:8px;border-radius:10px;cursor:pointer}
.wu-r i{font-style:normal;width:20px;text-align:center;color:var(--ink-2)}
.wu-r:hover,.wu-r:focus-visible{background:var(--chip)}
.wu-r[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 30%,transparent);color:var(--plum)}
.wu-rail-row{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.wu-rail-w{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:2px 4px 6px}
.wu-rail-w button{border:1px solid var(--line);background:none;font:inherit;font-size:12.5px;color:var(--ink-2);padding:6px 0;border-radius:8px;cursor:pointer}
.wu-rail-w button[aria-pressed=true]{background:color-mix(in srgb,var(--lavender) 30%,transparent);color:var(--plum);border-color:transparent}
/* ورقة A4 على الشاشة: الصفحة كما تُطبع، وخطوط خافتة عند كل ارتفاع ورقة */
.wu-print-title{display:none}
.wu-page.is-a4{max-width:calc(210mm + 60px)}
.wu-page.is-a4 .wu-editor{width:210mm;max-width:100%;margin:0 auto;padding:22mm 20mm;min-height:297mm;background-color:#fff;border-radius:6px;box-shadow:0 10px 36px rgba(23,19,38,.13);
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(297mm - 1px),rgba(124,91,166,.28) calc(297mm - 1px),rgba(124,91,166,.28) 297mm)}
.wu-page.is-a4 .wu-doc{font-size:12pt;line-height:1.75;color:#171326}
.wu-doc .wu-pagebreak{display:flex;align-items:center;gap:10px;margin:1.2em 0;color:var(--muted);font-size:12px;user-select:none}
.wu-doc .wu-pagebreak::before,.wu-doc .wu-pagebreak::after{content:'';flex:1;border-top:2px dashed var(--line)}
/* الطباعة وPDF: الصفحة وحدها على ورق A4، والنص نصٌّ لا صورة */
@page{size:A4;margin:16mm 15mm}
@media print{
  body.wu-printing{background:#fff!important;color:#000}
  body.wu-printing>*:not(.wrap),body.wu-printing .wrap>*:not(#pagesView){display:none!important}
  body.wu-printing .wrap{padding:0!important;margin:0!important;max-width:none!important}
  body.wu-printing #pagesView{display:block!important;padding:0!important}
  body.wu-printing .wu-top,body.wu-printing .wu-bubble,body.wu-printing .wu-tblbar,body.wu-printing .wu-rail,body.wu-printing .wu-find,body.wu-printing .wu-side,
  body.wu-printing .wu-cover-acts,body.wu-printing .wu-cover-list,body.wu-printing .wu-banner,body.wu-printing .wu-imgbar,
  body.wu-printing .wu-drag,body.wu-printing .wu-icon-wrap,body.wu-printing .wu-title,body.wu-printing .wu-file-dl,body.wu-printing .wu-cover.is-empty{display:none!important}
  body.wu-printing .wu-print-title{display:block;font-size:22pt;margin:0 0 6mm;color:#171326}
  body.wu-printing .wu-page,body.wu-printing .wu-page.is-a4{max-width:none;margin:0;padding:0}
  body.wu-printing .wu-editor,body.wu-printing .wu-page.is-a4 .wu-editor{width:auto;padding:0;margin:0;min-height:0;box-shadow:none;background:none;border-radius:0}
  body.wu-printing .wu-cover{height:28mm;border-radius:4mm;margin-bottom:6mm;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.wu-printing .wu-doc{font-size:11.5pt;line-height:1.7;color:#000;padding:0}
  body.wu-printing .wu-doc h1,body.wu-printing .wu-doc h2,body.wu-printing .wu-doc h3{break-after:avoid}
  body.wu-printing .wu-doc figure,body.wu-printing .wu-doc tr,body.wu-printing .wu-doc [data-callout],body.wu-printing .wu-doc pre,body.wu-printing .wu-doc .wu-file{break-inside:avoid}
  body.wu-printing .wu-doc .wu-pagebreak{break-after:page;margin:0;height:0;visibility:hidden}
  body.wu-printing .wu-doc a.wu-mention{background:none;color:#4A3570;padding:0}
  body.wu-printing .wu-doc .wu-commented{box-shadow:none}
  body.wu-printing .wu-doc .wu-hit{background:none;box-shadow:none}
  body.wu-printing .wu-doc [data-callout],body.wu-printing .wu-doc th,body.wu-printing .wu-doc mark,body.wu-printing .wu-doc pre{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.wu-printing .wu-doc .ProseMirror-selectednode{outline:none}
}
/* وضع التركيز: الكتابة وحدها */
.wu-focus .hero,.wu-focus .nav,.wu-focus .tabbar,.wu-focus .wu-cover,.wu-focus .fab,.wu-focus #aiFab{display:none!important}
.wu-focus .wu-page{padding-top:20px}
/* التعارض */
.wu-conflict .sheet{max-width:900px;width:min(900px,94vw)}
.wu-cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.wu-cmp pre{white-space:pre-wrap;font:inherit;font-size:14px;line-height:1.8;max-height:46vh;overflow:auto;background:var(--chip);border-radius:12px;padding:10px 12px;margin:6px 0 0}
/* الداكن */
.night .wu-card,.night .wu-menu,.night .wu-ipick,.night .wu-cover-list,.night .wu-bubble,.night .wu-bmenu,.night .wu-tblbar,.night .wu-suggest,.night .wu-imgbar,.night .wu-find,.night .wu-doc .wu-file{background:#241D32}
.night .wu-side,.night .wu-tpl,.night .wu-rail-panel{background:#241D32}
.night .wu-page.is-a4 .wu-doc a.wu-mention{color:#5B3E8A}
.night .wu-doc .wu-hit{background:#6B5A00;color:#FFF}.night .wu-doc .wu-hit.is-cur{background:#B36B00}
/* الجوال: الأدوات تلتف، والمقارنة عمود واحد، ولمس مريح */
@media (max-width:640px){
  .wu-cover{height:130px;border-radius:14px}
  .wu-icon{font-size:42px}
  .wu-cmp{grid-template-columns:1fr}
  .wu-doc{font-size:16.5px}
  .wu-editor{padding-inline-end:0}
  .wu-rail-tab{width:18px;height:52px;font-size:15px}
  .wu-r{padding:10px 8px}
  .wu-side{inset:auto 0 0 0;width:100%;max-height:70vh;border-radius:18px 18px 0 0}
  .wu-side-open .wu-page{margin-inline-end:0}
  .wu-ver{grid-template-columns:1fr}
  .wu-ver-list{max-height:28vh}
  .wu-drag{display:none}
  .wu-doc .wu-gallery{grid-template-columns:repeat(2,1fr)}
  .wu-doc figure.wu-fig[data-w="25"] img{width:50%}
}
/* أيقونات الواجهة الخطّية (ic في ui.js) بحجم النص ولونه */
.ui-ic{width:1.05em;height:1.05em;vertical-align:-.17em;flex:none;display:inline-block}
/* المفضّلة الممتلئة وزر التشغيل الكبير: الأيقونة الخطّية تمتلئ */
.rw-fav.on .ui-ic,.pl-btn .ui-ic path[d^="M7 4v16"]{fill:currentColor}
.wu-file-ic{font-size:11px!important;font-weight:800;letter-spacing:.3px;padding:6px 8px;border-radius:8px;background:color-mix(in srgb,var(--lavender) 22%,transparent);color:var(--plum)}

/* مشاركة قائمة التشغيل: فرق ثم أشخاص ببحث */
.pl-share { margin-top: 8px; border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; display: grid; gap: 4px; }
.pl-sh-h { font-size: 12px; color: var(--muted); margin-top: 4px; }
.pl-sh-people { max-height: 220px; overflow-y: auto; display: grid; gap: 2px; }
.pl-sh-row { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 8px; cursor: pointer; font-size: 13px; }
.pl-sh-row:hover { background: var(--chip); }
.pl-sh-row[hidden] { display: none; }
.pl-sh-row img, .pl-sh-row .ui-ic { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; flex: none; }
.pl-share .pl-q { margin: 2px 0 4px; }
/* شعار قناة الأخبار يُعرض كاملاً على خلفية فاتحة، لا مقصوصاً كغلاف أغنية */
.vibe-logo .vibe-art img { object-fit: contain; background: #fff; }

/* ============ إحساس التطبيق على الجوال (بلا تغيير في التصميم) ============ */
@media(max-width:700px){
  /* لا وميض أزرق عند اللمس، ولا تأخير ولا تكبير بالنقر المزدوج على الأزرار */
  html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
  button,.btn,.chip,a,[role=tab],label.switch,.bottom-nav,.fab{touch-action:manipulation}
  /* أزرار التنقل لا تُحدَّد نصّاً ولا تفتح قائمة الضغط المطوّل كأنها رابط */
  .bottom-nav,.btn,.chip,.fab,.seg,.vibe-ic,.icon-btn,[role=tab]{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
  /* ضغطٌ محسوس: الزر ينضغط تحت الإصبع ثم يعود */
  .btn,.chip,.bottom-nav button,.icon-btn,.seg button,.pick-row,.vibe,.pl-card{transition:transform .12s ease}
  .btn:active,.chip:active,.icon-btn:active,.seg button:active,.pick-row:active{transform:scale(.96)}
  .bottom-nav button:active{transform:scale(.92)}
  .vibe:active,.pl-card:active,.item:active{transform:scale(.985)}
  /* الورقة السفلية: تصعد من الأسفل بمقبضٍ صغير يدلّ على أنها تُسحب */
  dialog[open] > .sheet{animation:wlSheetUp .26s cubic-bezier(.2,.8,.2,1)}
  dialog[open]::backdrop{animation:wlFade .2s ease}
  dialog > .sheet{position:relative;transition:transform .18s ease}
  dialog > .sheet::before{content:'';position:sticky;top:-12px;display:block;width:38px;height:5px;margin:-8px auto 10px;border-radius:99px;background:rgba(80,60,100,.22);z-index:2}
  .night dialog > .sheet::before{background:rgba(255,255,255,.25)}
  /* الرسالة بجوار الزر العائم لا فوقه */
  .toast,.greet{left:84px}
}
@keyframes wlSheetUp{from{transform:translateY(100%)}to{transform:none}}
@keyframes wlFade{from{opacity:0}to{opacity:1}}
@media(max-width:700px) and (prefers-reduced-motion:reduce){dialog[open] > .sheet,dialog[open]::backdrop{animation:none}}
/* مثبَّتاً على الشاشة الرئيسية: لا ارتداد للصفحة ولا سحبَ تحديثٍ كأنها موقع */
html.standalone,html.standalone body{overscroll-behavior-y:none}