/* قاعدة أولى قبل كل شي: العنصر المخبّى بينخبّى فعلاً.
   بلاها، أي `display:flex` بكلاس بيغلب [hidden] وبيضل العنصر ظاهر، وهي غلطة
   صارت معنا كذا مرة بكذا مكان. مرة وحدة هون، وخلصنا منها لكل التطبيق. */
[hidden] { display:none !important; }

/* خط الواجهة: IBM Plex Sans Arabic، محمّل من عندنا مو من الإنترنت،
   حتى يشتغل بلا نت ومن ملف محلي. عربي ولاتيني كل وزن بملف لحاله. */
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-ar-400.woff2") format("woff2");
  font-weight:400; font-display:swap; unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF; }
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-ar-600.woff2") format("woff2");
  font-weight:600; font-display:swap; unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF; }
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-ar-700.woff2") format("woff2");
  font-weight:700; font-display:swap; unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF; }
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-la-400.woff2") format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-la-600.woff2") format("woff2"); font-weight:600; font-display:swap; }
@font-face { font-family:"Lamma Sans"; src:url("assets/fonts/ipsa-la-700.woff2") format("woff2"); font-weight:700; font-display:swap; }

:root { --ink:#f6f1ff; --muted:#b6afc1; --panel:#25212e; --panel-2:#302a3d; --line:#40384e; --accent:#e7ff70; --accent-ink:#202600; --danger:#ff9385; --field:#18151f;
  /* أسطح القشرة: كانت ألوان مكتوبة بالإيد فما كانت تتبدّل مع الثيم الفاتح */
  --rail:#201c28; --rail-hover:#2c2735; --rail-active:#332d3f; --raised:#292430; --raised-hover:#342e40; --sunken:#211d29;
  color-scheme:dark; }
* { box-sizing:border-box; }
body { margin:0; min-height:100dvh; color:var(--ink); background:radial-gradient(circle at 10% 0,#3f3156 0,transparent 28rem),#17151f; font-family:"Lamma Sans","IBM Plex Sans Arabic","Segoe UI",Tahoma,sans-serif;
  font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
button,input,select { font:inherit; } button { cursor:pointer; }
/* أي قائمة منسدلة ما إلها ستايل خاص بتاخد ستايل الحقل نفسه، حتى ما تطلع بيضا بالوضع الداكن */
select { min-width:0; color:var(--ink); background:var(--field); border:1px solid var(--line); border-radius:12px; padding:10px; outline:none; }
select:focus { border-color:var(--accent); }
option { color:var(--ink); background:var(--field); }
/* مربّعات الاختيار العادية (مو المفاتيح) تاخد لون الواجهة المميّز بدل الأبيض الناشف */
input[type="checkbox"]:not([role="switch"]), input[type="radio"] { width:auto; padding:0; border:0; background:transparent; accent-color:var(--accent); }
.app-shell { max-width:680px; margin:auto; padding:calc(26px + env(safe-area-inset-top)) 18px calc(42px + env(safe-area-inset-bottom)); }
header { padding:0 4px 21px; }
.eyebrow { color:var(--accent); font-size:.82rem; margin:0 0 6px; }
h1 { margin:0; font-size:2.35rem; line-height:1.35; letter-spacing:0; font-weight:700; }
h1 span { color:var(--accent); }
.subhead { color:var(--muted); margin:6px 0 0; }
.capture { background:var(--panel); padding:17px; border:1px solid var(--line); border-radius:20px; box-shadow:0 14px 36px #09070e44; } .capture label { display:block; font-weight:bold; margin-bottom:10px; }
.capture-row,.money-form { display:flex; gap:8px; }
input { min-width:0; width:100%; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--field); padding:13px; outline:none; }
input:focus { border-color:var(--accent); }
.primary { border:0; border-radius:12px; background:var(--accent); color:var(--accent-ink); font-weight:bold; padding:10px 15px; }.capture-row .primary { font-size:1.8rem; line-height:1; width:50px; }
.quick-types { display:flex; gap:7px; margin-top:12px; }
.type-button,.tab,.text-button { border:0; background:transparent; color:var(--muted); }
.type-button { border:1px solid var(--line); border-radius:999px; padding:6px 11px; font-size:.85rem; }
.type-button.selected { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }
nav { display:flex; gap:3px; margin:23px 0 15px; padding-bottom:10px; border-bottom:1px solid var(--line); overflow:auto; }
.tab { padding:8px 10px; white-space:nowrap; }
.tab.active { color:var(--ink); font-weight:bold; border-bottom:2px solid var(--accent); }
.tab span { font-size:.8rem; color:var(--accent); }
.view { display:none; }
.view.active { display:block; }
.section-heading { display:flex; justify-content:space-between; align-items:start; margin:10px 4px 14px; }
.section-heading h2 { margin:0; font-size:1.15rem; }
.section-heading p { color:var(--muted); margin:5px 0 0; font-size:.9rem; }
.text-button { color:var(--danger); padding:4px; }
.card-list { display:grid; gap:9px; }
.item { background:var(--panel); border:1px solid var(--line); padding:14px; border-radius:15px; display:flex; align-items:center; gap:11px; }
.item .body { flex:1; min-width:0; }
.item-title { margin:0; line-height:1.35; overflow-wrap:anywhere; }
.item-meta { color:var(--muted); font-size:.78rem; margin-top:5px; }
.badge { display:inline-block; padding:3px 7px; border-radius:99px; color:#dbd3e8; background:var(--panel-2); font-size:.72rem; }
.item button { flex:none; border:1px solid var(--line); color:var(--ink); background:var(--panel-2); padding:7px 9px; border-radius:9px; }
.item button.danger { color:var(--danger); }
.done .item-title { text-decoration:line-through; color:var(--muted); }
.empty-state { padding:44px 24px; text-align:center; background:var(--sunken); border-radius:18px; border:1px dashed var(--line); }
.empty-icon { width:11px; height:11px; margin:0 auto 14px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 6px #e7ff7015; }
.empty-state h3 { margin:8px 0; }
.empty-state p { color:var(--muted); margin:0; line-height:1.5; }
.money-form { display:grid; grid-template-columns:100px 1fr auto; margin-bottom:14px; }
.money-amount { color:var(--accent); font-weight:bold; white-space:nowrap; }
.small-action { border:1px solid var(--line); border-radius:9px; background:var(--panel-2); color:var(--ink); padding:7px 10px; }
.dashboard-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.stat-card,.app-card,.activity-item { font:inherit; color:var(--ink); text-align:right; border:1px solid var(--line); background:var(--panel); cursor:pointer; }
.stat-card { min-height:112px; padding:15px; border-radius:15px; }
.stat-card span,.stat-card small { display:block; color:var(--muted); font-size:.78rem; }
.stat-card strong { display:block; color:var(--accent); font-size:1.65rem; margin:9px 0 3px; }
.dashboard-section { margin-top:24px; }
.dashboard-section-head { margin:0 4px 11px; }
.dashboard-section h3 { margin:0; font-size:1rem; }
.dashboard-section p { margin:4px 0 0; color:var(--muted); font-size:.84rem; }
.app-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.app-card { min-height:135px; padding:15px; border-radius:15px; position:relative; }
.app-card:hover,.stat-card:hover,.activity-item:hover { border-color:var(--accent); }
.app-card b,.app-card span { display:block; }
.app-card b { font-size:1rem; }
.app-card span { color:var(--muted); font-size:.8rem; line-height:1.45; margin-top:7px; }
.app-card i,.activity-item i { position:absolute; left:14px; bottom:13px; color:var(--accent); font-style:normal; }
.activity-list { display:grid; gap:7px; }
.activity-item { position:relative; padding:12px 42px 12px 13px; border-radius:12px; }
.activity-item i { top:50%; bottom:auto; transform:translateY(-50%); }
.dashboard-empty { color:var(--muted); padding:16px; background:var(--panel); border:1px dashed var(--line); border-radius:12px; font-size:.9rem; }
.task-dialog { border:1px solid var(--line); border-radius:20px; width:min(430px,calc(100vw - 28px)); color:var(--ink); background:var(--panel); padding:20px; }
.task-dialog::backdrop { background:#0b0910b5; }
.task-dialog label { display:block; font-weight:bold; margin-bottom:9px; }
.task-dialog-actions { display:flex; justify-content:flex-end; margin-top:13px; }
.task-stats,.finance-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:16px; }
.task-stats div,.finance-card { padding:13px; border:1px solid var(--line); border-radius:13px; background:var(--panel); }
.task-stats span,.finance-card span,.finance-card small { display:block; color:var(--muted); font-size:.78rem; }
.task-stats strong,.finance-card strong { display:block; margin-top:7px; font-size:1.35rem; }
.finance-card.income strong,.income-amount { color:#57d5a6; }
.finance-card.expense strong { color:var(--danger); }
.finance-card.balance strong { color:var(--accent); }
.task-toolbar { display:flex; gap:9px; align-items:center; margin-bottom:12px; }
.task-toolbar input { padding:9px 11px; }
.segmented { display:flex; gap:4px; padding:4px; border:1px solid var(--line); border-radius:11px; background:var(--panel); }
.segmented button { border:0; border-radius:7px; background:transparent; color:var(--muted); padding:7px 9px; white-space:nowrap; }
.segmented button.active { background:var(--panel-2); color:var(--ink); font-weight:bold; }
.finance-tabs { width:max-content; margin-bottom:15px; }
.finance-panel { display:none; }
.finance-panel.active { display:block; }
.money-form { grid-template-columns:105px 110px 1fr auto; }
.money-form select { color:var(--ink); background:#18151f; border:1px solid var(--line); border-radius:12px; padding:10px; }
.inline-add { display:grid; grid-template-columns:1fr 130px auto; gap:8px; margin-bottom:14px; }
.budget-list { display:grid; gap:9px; }
.budget-card { position:relative; padding:14px 56px 14px 14px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.budget-card strong,.budget-card span { display:block; }
.budget-card span { margin-top:4px; color:var(--muted); font-size:.8rem; }
.budget-card button { position:absolute; left:12px; top:50%; transform:translateY(-50%); border:0; color:var(--danger); background:transparent; }
.budget-bar { height:7px; margin-top:12px; border-radius:99px; background:var(--panel-2); overflow:hidden; }
.budget-bar i { display:block; height:100%; background:var(--accent); border-radius:inherit; }
.priority-high { color:#ffd0c9; background:#603a3b; }
.priority-low { color:#bbd9ff; background:#293d59; }
.task-dialog-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.task-dialog-options label { font-size:.85rem; }
.task-dialog-options select { width:100%; margin-top:5px; padding:9px; border-radius:9px; border:1px solid var(--line); color:var(--ink); background:#18151f; }
#toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,120px); background:var(--accent); color:var(--accent-ink); border-radius:99px; padding:10px 16px; font-weight:bold; transition:.25s; box-shadow:0 8px 24px #0006; }#toast.show { transform:translate(-50%,0); }
@media(max-width:420px){ .app-shell{padding-right:12px;padding-left:12px}.money-form{grid-template-columns:90px 1fr}.money-form .primary{grid-column:1/-1}.capture{padding:14px} }
@media(max-width:520px){ .dashboard-stats,.app-grid{grid-template-columns:1fr;}.stat-card{min-height:auto;display:grid;grid-template-columns:1fr auto;align-items:center;}.stat-card strong{grid-row:1/3;grid-column:2;margin:0;}.app-card{min-height:96px;}.app-card i{top:50%;bottom:auto;transform:translateY(-50%);} }
@media(max-width:620px){ .task-stats,.finance-summary{grid-template-columns:1fr;}.task-toolbar{align-items:stretch;flex-direction:column;}.segmented{overflow:auto;}.money-form,.inline-add{grid-template-columns:1fr 1fr;}.money-form input:nth-of-type(2),.money-form .primary,.inline-add .primary{grid-column:1/-1;}.task-dialog-options{grid-template-columns:1fr;} }

/* App shell and navigation */
.layout { min-height:100dvh; display:flex; direction:rtl; }
.app-shell { flex:1; max-width:760px; margin:0 auto; }
.sidebar { width:248px; flex:none; min-height:100dvh; padding:calc(25px + env(safe-area-inset-top)) 14px 20px; background:var(--rail); border-left:1px solid var(--line); display:flex; flex-direction:column; }
/* القائمة بتلزق وبتلف لحالها: مع كل تطبيق جديد بتطول، ولولا هيك بيصير
   زر الإعدادات تحت الشاشة وما بتوصله أبداً بشاشة قصيرة. */
@media(min-width:801px){ .sidebar { position:sticky; top:0; align-self:flex-start; height:100dvh; min-height:0; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--line) transparent; } }
@media(max-width:800px){ .sidebar { overflow-y:auto; max-height:100dvh; } }
.sidebar-brand { display:flex; gap:9px; align-items:center; padding:5px 8px 26px; font-size:1.18rem; }
.logo-mark { color:var(--accent); font-size:1.35rem; }
.sidebar-label { color:#8d849b; font-size:.75rem; margin:0 9px 7px; }
.side-nav { display:grid; gap:3px; margin:0; padding:0; border:0; overflow:visible; }
.side-nav .tab { display:flex; justify-content:space-between; width:100%; padding:11px 12px; border-radius:10px; border:0; text-align:right; }
.side-nav .tab:hover { background:var(--rail-hover); }
.side-nav .tab.active { color:var(--ink); background:var(--rail-active); border:0; }
.side-nav .tab.active::before { content:""; width:3px; height:20px; background:var(--accent); border-radius:9px; position:absolute; right:0; }
.side-nav .tab { position:relative; }
.side-nav small { color:var(--accent); font-size:.75rem; }
.global-settings { display:flex; justify-content:space-between; align-items:center; width:100%; margin-top:auto; padding:10px 11px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--raised); }
.global-settings:hover { background:var(--raised-hover); }
.sidebar-foot { margin:12px 8px 3px; color:var(--muted); font-size:.75rem; }
.icon-button { border:1px solid var(--line); background:transparent; color:var(--ink); width:36px; height:36px; border-radius:10px; font-size:1.1rem; display:grid; place-items:center; }
.icon-button:hover { background:var(--panel-2); }
.topbar { display:none; }
.close-sidebar { display:none; margin-right:auto; }
.heading-actions { display:flex; align-items:center; gap:5px; }
.settings-button { margin-right:7px; }
.sidebar-backdrop { display:none; }
.settings-dialog { border:1px solid var(--line); border-radius:20px; width:min(430px,calc(100vw - 28px)); color:var(--ink); background:var(--sunken); box-shadow:0 28px 70px #000a; padding:20px; }
.settings-dialog::backdrop { background:#0b0910b5; backdrop-filter:blur(2px); }
.dialog-top { display:flex; justify-content:space-between; align-items:start; margin-bottom:18px; }
.dialog-top h2 { margin:0; }
.setting-row { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:13px 0; border-top:1px solid var(--line); }
.setting-row p { margin:3px 0 0; color:var(--muted); font-size:.84rem; }
.setting-row select { background:#17151f; color:var(--ink); border:1px solid var(--line); padding:8px; border-radius:8px; }
.setting-row button { background:transparent; color:var(--danger); border:1px solid var(--line); padding:8px 10px; border-radius:8px; }
@media(max-width:800px) { .layout { display:block; }.app-shell { max-width:680px; }.sidebar { position:fixed; z-index:5; top:0; right:0; transform:translateX(105%); transition:transform .24s ease; box-shadow:-12px 0 30px #0006; }.sidebar.open { transform:translateX(0); }.sidebar-backdrop.open { display:block; position:fixed; z-index:4; inset:0; background:#0b09109c; }.topbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }.mobile-brand { font-weight:bold; }.close-sidebar { display:grid; }.app-shell header { padding-top:0; }.app-shell { padding-top:calc(16px + env(safe-area-inset-top)); } }

/* Settings: grouped controls instead of a loose list */
.settings-dialog { max-height:min(760px,calc(100dvh - 28px)); overflow:auto; scrollbar-color:var(--line) transparent; }
.settings-subtitle { color:var(--muted); margin:-9px 0 20px; font-size:.9rem; }
.settings-group { margin:0 0 20px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#1b1822; }
.settings-group h3 { margin:0; padding:10px 13px; background:var(--raised); color:var(--ink); font-size:.82rem; }
.settings-group .setting-row { padding:13px; }
.settings-group .setting-row + .setting-row { border-top:1px solid var(--line); }
.setting-row strong { font-size:.92rem; }
.setting-row select { max-width:145px; }
.setting-input { width:130px; padding:8px 9px; border-radius:8px; font-size:.84rem; }
.switch-row input { appearance:none; flex:none; position:relative; width:42px; height:24px; margin:0; border:1px solid var(--line); border-radius:99px; background:#15121b; transition:.18s; cursor:pointer; }
.switch-row input::after { content:""; position:absolute; top:3px; right:3px; width:16px; height:16px; border-radius:50%; background:#aaa0b5; transition:.18s; }
.switch-row input:checked { background:#d8ef62; border-color:#d8ef62; }
.switch-row input:checked::after { right:20px; background:#202600; }
.danger-group { border-color:#754447; }
.danger-group h3 { color:#ffb5ad; background:#352326; }
body[data-density="compact"] .item { padding:9px 11px; }
body[data-density="compact"] .card-list { gap:6px; }
body.reduce-motion *, body.reduce-motion *::before, body.reduce-motion *::after { transition:none!important; animation:none!important; }
body[data-theme="warm"] { background:radial-gradient(circle at 10% 0,#4b332e 0,transparent 28rem),#1b1516; }
body[data-theme="oled"] { --field:#111; background:#080808; }
body[data-theme="oled"] .capture, body[data-theme="oled"] .item { background:#111; }
/* الوضع الفاتح: الليموني تبعنا ما بينقرا على أبيض (تباين 1.3:1)، فبالفاتح
   منستعمل نسخة غامقة منه ونص أبيض فوقها. نفس الهوية، بس مقروءة. */
body[data-theme="light"],body[data-theme="paper"] { color-scheme:light; --ink:#16202e; --muted:#5c6a7e; --panel:#fff; --panel-2:#eef1f5; --line:#e2e6ec; --danger:#b04437; --field:#fff; --accent:#4f6b04; --accent-ink:#fff; background:radial-gradient(circle at 10% 0,#e7ecf4 0,transparent 32rem),#f6f7f9; }
body[data-theme="paper"] { --accent:#6a5410; }
body[data-theme="light"],body[data-theme="paper"] { --rail:#fbfcfd; --rail-hover:#eef1f5; --rail-active:#e6ebf2; --raised:#f2f4f7; --raised-hover:#e9edf3; --sunken:#fafbfc; }
body[data-theme="paper"] { --rail:#fbf5eb; --rail-hover:#f4ede1; --rail-active:#efe5d4; --raised:#f6efe3; --raised-hover:#f0e7d7; --sunken:#fbf6ed; }
body[data-theme="oled"] { --rail:#0c0c0c; --rail-hover:#181818; --rail-active:#1f1f1f; --raised:#141414; --raised-hover:#1c1c1c; --sunken:#101010; }
body[data-theme="warm"] { --rail:#231b1c; --rail-hover:#2f2426; --rail-active:#382b2d; --raised:#2c2223; --raised-hover:#372a2c; --sunken:#241c1d; }
body[data-theme="paper"] { --panel:#fffdf8; --panel-2:#f4ede1; --line:#ded6c8; --field:#fffdf8; background:radial-gradient(circle at 10% 0,#f7e4b8 0,transparent 32rem),#f8f3e9; }
body[data-theme="light"] input,body[data-theme="paper"] input,body[data-theme="light"] .settings-group,body[data-theme="paper"] .settings-group { background:#fff; }
body[data-theme="paper"] .settings-group { background:#fffdf8; }
body[data-theme="light"] .settings-group h3,body[data-theme="paper"] .settings-group h3 { background:#f2eef7; }
body[data-theme="paper"] .settings-group h3 { background:#f2eadc; }
body[data-theme="light"] .global-settings,body[data-theme="paper"] .global-settings { color:var(--ink); background:#f5f1f8; }
body[data-theme="paper"] .global-settings { background:#f3ebde; }
body[data-theme="light"] .empty-state,body[data-theme="paper"] .empty-state { background:#fff9; }
.setting-block { padding:13px; }
.setting-block + .setting-block { border-top:1px solid var(--line); }
.setting-block > p { margin:3px 0 12px; color:var(--muted); font-size:.84rem; }
.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.choice-card { border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink); padding:7px; text-align:right; font-size:.75rem; }
.choice-card i { display:block; height:26px; margin-bottom:6px; border-radius:6px; background:#17151f; }
.choice-card.theme-warm i { background:linear-gradient(135deg,#4b332e,#1b1516); }
.choice-card.theme-light i { background:linear-gradient(135deg,#e8dcff,#faf8fc); }
.choice-card.theme-paper i { background:linear-gradient(135deg,#f7e4b8,#fffdf8); }
.choice-card.theme-oled i { background:#050505; }
.choice-card.selected { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.color-grid { display:flex; flex-wrap:wrap; gap:9px; }
.color-dot { width:28px; height:28px; padding:0; border:2px solid transparent; border-radius:50%; background:var(--dot); }
.color-dot.selected { border-color:var(--ink); box-shadow:0 0 0 2px var(--accent); }
.color-dot.lime{--dot:#e7ff70}
.color-dot.violet{--dot:#cbb6ff}
.color-dot.blue{--dot:#7dd3fc}
.color-dot.coral{--dot:#ff9b85}
.color-dot.rose{--dot:#f7a8d6}
.color-dot.teal{--dot:#67e8d0}
.color-dot.orange{--dot:#ffc266}
body[data-theme="light"] .setting-row select,body[data-theme="paper"] .setting-row select { color:var(--ink); background:#fff; border-color:var(--line); } body[data-theme="paper"] .setting-row select { background:#fffdf8; }
body[data-theme="light"] .money-form select,body[data-theme="paper"] .money-form select,body[data-theme="light"] .task-dialog-options select,body[data-theme="paper"] .task-dialog-options select { color:var(--ink); background:#fff; border-color:var(--line); } body[data-theme="paper"] .money-form select,body[data-theme="paper"] .task-dialog-options select { background:#fffdf8; }

/* ===== نسخة الموديولات: عناصر جديدة وتصحيحات تخطيط ===== */

/* شريط اختيار الشهر */
.month-switch { display:flex; align-items:center; gap:8px; margin:0 2px 14px; }
.month-switch strong { flex:1; font-size:1rem; }
.month-switch .icon-button { width:32px; height:32px; font-size:1rem; }

/* نموذج تسجيل الحركة: صف للأساسيات وصف للتفاصيل */
.money-form { display:grid; grid-template-columns:110px 120px 1fr; gap:8px; margin-bottom:14px; }
.money-form #money-note { grid-column:1 / 3; }
.money-form #money-date { grid-column:3; }
.money-form .primary { grid-column:1 / -1; }
.money-form select, .money-form input[type="date"] { color:var(--ink); background:#18151f; border:1px solid var(--line); border-radius:12px; padding:10px; }
.inline-add.subs-add { grid-template-columns:1fr 130px 90px auto; }

/* أزرار ثانوية داخل البطاقات */
.item button.ghost { color:var(--muted); background:transparent; }
.item button.ghost:hover { color:var(--ink); background:var(--panel-2); }
.danger-button { border:1px solid var(--danger); border-radius:9px; background:transparent; color:var(--danger); padding:8px 11px; }
.danger-button:hover { color:#fff; background:var(--danger); }

/* ميزانية متجاوزة */
.budget-card.over { border-color:var(--danger); }
.budget-card.over .budget-bar i { background:var(--danger); }
.badge.income-badge { color:#0f2d22; background:#57d5a6; }
.panel-note { margin:0 2px 12px; color:var(--muted); font-size:.85rem; }

@media (max-width:620px) {
  .money-form { grid-template-columns:1fr 1fr; }
  .money-form #money-category, .money-form #money-note, .money-form #money-date { grid-column:1 / -1; }
  .inline-add.subs-add { grid-template-columns:1fr 1fr; }
  .inline-add.subs-add .primary { grid-column:1 / -1; }
}

body[data-theme="light"] .money-form select, body[data-theme="paper"] .money-form select,
body[data-theme="light"] .money-form input[type="date"], body[data-theme="paper"] .money-form input[type="date"] { color:var(--ink); background:#fff; border-color:var(--line); }
body[data-theme="paper"] .money-form select, body[data-theme="paper"] .money-form input[type="date"] { background:#fffdf8; }

/* شارة رقم الإصدار بالزاوية اليسار السفلى */
#build-badge {
  position:fixed; left:10px; bottom:10px; z-index:9;
  padding:5px 9px; border:1px solid var(--line); border-radius:99px;
  background:#00000055; color:var(--muted);
  font-size:.7rem; font-family:Consolas,monospace; direction:ltr;
  pointer-events:none; user-select:none; backdrop-filter:blur(3px);
}
body[data-theme="light"] #build-badge, body[data-theme="paper"] #build-badge { background:#ffffff99; }
@media (max-width:800px) { #build-badge { opacity:.5; font-size:.65rem; padding:4px 8px; } }

/* حقل التاريخ تبعنا: ثلاث قوائم بدل input[type=date] */
.date-field { display:flex; gap:6px; }
.date-field select { flex:1; min-width:0; padding:9px 6px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#18151f; font-size:.88rem; }
.date-field select:focus { border-color:var(--accent); outline:none; }
.date-field select[data-part="month"] { flex:1.5; }
.date-shortcuts { display:flex; gap:6px; margin-top:7px; }
.date-shortcuts button { border:1px solid var(--line); border-radius:99px; background:transparent; color:var(--muted); font-size:.74rem; padding:4px 10px; }
.date-shortcuts button:hover { color:var(--ink); border-color:var(--accent); }
.task-dialog-options .date-label { grid-column:1 / -1; }
.money-form .date-field { grid-column:1 / -1; }
body[data-theme="light"] .date-field select, body[data-theme="paper"] .date-field select { color:var(--ink); background:#fff; border-color:var(--line); }
body[data-theme="paper"] .date-field select { background:#fffdf8; }

/* لوحة الأخطاء (تطوير) */
#error-panel { position:fixed; inset:auto 12px 12px 12px; z-index:99; max-height:45vh; overflow:auto;
  padding:14px 16px; border:1px solid #ff6b6b; border-radius:14px; background:#2a1113; color:#ffd9d4;
  font-size:.82rem; box-shadow:0 18px 40px #0009; }
#error-panel b { display:block; margin-bottom:8px; font-size:.95rem; color:#ff9d92; }
#error-panel pre { margin:0; white-space:pre-wrap; word-break:break-word; direction:ltr; text-align:left; font-family:Consolas,monospace; }
#error-close { position:absolute; top:10px; left:12px; border:0; background:transparent; color:#ffd9d4; font-size:1.2rem; cursor:pointer; }

/* ======================================================================
   ألوان الرسومات، سلّم مصنّف ثابت الترتيب، منفصل عن لون الواجهة المميّز.
   القيم الفاتحة على :root، والداكنة تحت الثيمات الداكنة.
   ====================================================================== */
:root {
  --series-1:#2a78d6; --series-2:#eb6834; --series-3:#1baf7a; --series-4:#eda100;
  --series-5:#e87ba4; --series-6:#008300; --series-7:#4a3aa7; --series-8:#e34948;
  --series-muted:#9b93a8;
}
body[data-theme="dark"], body[data-theme="warm"], body[data-theme="oled"] {
  --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70; --series-4:#c98500;
  --series-5:#d55181; --series-6:#008300; --series-7:#9085e9; --series-8:#e66767;
  --series-muted:#6f6880;
}

/* شريط التوزيع: فراغ 2px بين الأجزاء حتى تنفصل حتى بعمى الألوان */
.alloc-bar { display:flex; gap:2px; height:14px; margin:0 2px 12px; border-radius:99px; overflow:hidden; }
.alloc-bar i { display:block; min-width:3px; }
.alloc-bar.empty { background:var(--panel-2); }

.chart-legend { display:grid; gap:6px; margin:0 2px 4px; padding:0; list-style:none; }
.chart-legend li { display:flex; align-items:center; gap:9px; font-size:.85rem; }
.chart-legend .swatch { flex:none; width:11px; height:11px; border-radius:3px; }
.chart-legend .legend-label { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chart-legend .legend-share { color:var(--muted); font-variant-numeric:tabular-nums; }
.chart-legend .legend-value { min-width:90px; text-align:left; color:var(--ink); font-variant-numeric:tabular-nums; }

.meter { height:8px; margin:10px 0 6px; border-radius:99px; background:var(--panel-2); overflow:hidden; }
.meter i { display:block; height:100%; border-radius:inherit; background:var(--accent); transition:width .25s; }
.meter.over i { background:var(--danger); }

/* ترويسة واحدة لكل صفحة.
   اللوحة هي البيت، فبتضل تحمل الشعار والتحية. باقي الأقسام عنوانها هو عنوان
   القسم نفسه، بلا ما ينكتب «لَمّة» فوقه مرة تانية وتالتة. */
body:not([data-page="dashboard"]) .app-shell > header > :not(.topbar) { display:none; }
body:not([data-page="dashboard"]) .app-shell > header { padding-bottom:0; }
body:not([data-page="dashboard"]) .view.active .section-heading h2 { font-size:1.7rem; line-height:1.3; }
body[data-page="dashboard"] #view-dashboard .section-heading > div:first-child { display:none; }
body[data-page="dashboard"] #view-dashboard .section-heading { justify-content:flex-end; }

/* شارة الإصدار: جزء من القائمة، مو ملصقة فوق المحتوى */
#build-badge { position:static; margin:10px 8px 0; opacity:.55; font-size:.68rem; }

/* شارة القسم: الأرقام بين قوسين، والنقطة الوحيدة (صفحة اليوم فاضية) بتطلع
   دايرة صغيرة بلون التمييز بدل ما تبان نقطة سايبة */
.tab small { color:var(--muted); font-size:.72rem; }
.tab small:not(:empty) { opacity:.9; }
.tab.active small { color:var(--accent-ink); }

/* مفاتيح التبديل بتاخد عرض محتواها، مو عرض الشاشة كلها.
   كانت تمتد لآخر السطر فيبان الزر الفعّال بزاوية وحدة والباقي فراغ. */
.segmented { width:max-content; max-width:100%; }
.segmented.full { width:100%; }
@media(max-width:620px){ .segmented { width:100%; } .segmented button { flex:1 1 auto; } }

/* الأرقام والعملة سطر واحد: «0 $» مو «0» وتحتها «$» */
.finance-card strong, .stat-card strong, .snap-kpi strong, .calc-big strong, .calc-stat strong { white-space:nowrap; }

/* ===== الثروة ===== */
.wealth-hero { position:relative; padding:20px; margin-bottom:14px; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.wealth-hero span { display:block; color:var(--muted); font-size:.8rem; }
.wealth-hero strong { display:block; margin:8px 0 4px; font-size:2.1rem; letter-spacing:-1px; font-variant-numeric:tabular-nums; }
.wealth-hero small { color:var(--muted); font-size:.8rem; }
.wealth-alloc { margin-bottom:16px; }
.wealth-tabs { width:max-content; margin-bottom:14px; }
.wealth-panel { display:none; }
.wealth-panel.active { display:block; }
.hidden-panel { display:none !important; }

.asset-row { display:flex; align-items:center; gap:11px; padding:13px 14px; margin-bottom:8px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.asset-dot { flex:none; width:10px; height:10px; border-radius:50%; }
.asset-main { flex:1; min-width:0; }
.asset-name { margin:0; overflow-wrap:anywhere; }
.asset-meta { margin:4px 0 0; color:var(--muted); font-size:.78rem; }
.asset-value { flex:none; text-align:left; }
.asset-value strong { display:block; color:var(--accent); font-variant-numeric:tabular-nums; }
.asset-value small { color:var(--muted); font-size:.72rem; }
.asset-row .ghost, .asset-row .danger { flex:none; border:1px solid var(--line); border-radius:9px; background:var(--panel-2); padding:6px 9px; }
.asset-row .ghost { color:var(--muted); background:transparent; }
.asset-row .danger { color:var(--danger); background:transparent; }
.stale { color:var(--danger); }

.panel-actions { display:flex; gap:8px; margin-bottom:12px; }

/* ===== الادخار ===== */
.goal-form { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:14px; align-items:end; }
.goal-due-label { grid-column:1 / -1; font-size:.85rem; color:var(--muted); }
.goal-form .primary { grid-column:1 / -1; }
.goal-list { display:grid; gap:10px; }
.goal-card { padding:15px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.goal-card.done { border-color:var(--accent); }
.goal-head { display:flex; justify-content:space-between; align-items:start; gap:10px; }
.goal-head strong { display:block; }
.goal-head span { display:block; margin-top:4px; color:var(--muted); font-size:.8rem; }
.goal-head .danger { border:0; background:transparent; color:var(--danger); }
.goal-left { margin:0 0 10px; color:var(--muted); font-size:.8rem; }
.goal-actions { display:flex; gap:7px; }
.goal-actions input { flex:1; padding:8px 10px; }
.goal-actions .ghost { border:1px solid var(--line); border-radius:9px; background:transparent; color:var(--muted); padding:7px 11px; }

/* ===== اليوم: خطوات فرعية وملاحظة ===== */
.task-item { flex-direction:column; align-items:stretch; }
.task-top { display:flex; align-items:center; gap:11px; }
.item-note { margin:5px 0 0; color:var(--muted); font-size:.82rem; overflow-wrap:anywhere; }
.subtasks { margin:11px 0 0; padding:11px 0 0; border-top:1px solid var(--line); list-style:none; display:grid; gap:6px; }
.subtasks li { display:flex; align-items:center; gap:9px; font-size:.86rem; }
.subtasks li button { flex:none; width:19px; height:19px; padding:0; display:grid; place-items:center; border:1px solid var(--line); border-radius:6px; background:transparent; color:var(--accent-ink); font-size:.7rem; }
.subtasks li.done button { border-color:var(--accent); background:var(--accent); }
.subtasks li.done span { color:var(--muted); text-decoration:line-through; }

.wide-dialog { width:min(560px,calc(100vw - 28px)); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.form-grid label, .stack-label { display:block; font-size:.85rem; color:var(--muted); }
.form-grid input, .form-grid select { width:100%; margin-top:5px; padding:9px; border-radius:9px; border:1px solid var(--line); color:var(--ink); background:#18151f; }
.form-grid .span-2 { grid-column:1 / -1; }
.stack-label { margin-top:12px; }
.stack-label input { margin-top:5px; }
.subtask-block { margin-top:12px; }
.draft-subtasks { margin:8px 0; padding:0; list-style:none; display:grid; gap:6px; }
.draft-subtasks li { display:flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid var(--line); border-radius:9px; font-size:.85rem; }
.draft-subtasks li span { flex:1; }
.draft-subtasks .danger { border:0; background:transparent; color:var(--danger); }
.subtask-add { display:flex; gap:7px; }
.subtask-add input { flex:1; }

body[data-theme="light"] .form-grid input, body[data-theme="light"] .form-grid select,
body[data-theme="paper"] .form-grid input, body[data-theme="paper"] .form-grid select { color:var(--ink); background:#fff; }
body[data-theme="paper"] .form-grid input, body[data-theme="paper"] .form-grid select { background:#fffdf8; }

@media (max-width:620px) {
  .form-grid { grid-template-columns:1fr; }
  .goal-form { grid-template-columns:1fr; }
  .wealth-tabs, .finance-tabs { width:auto; overflow-x:auto; }
}

/* الأرقام مع رموز عملة لاتينية لازم تضل LTR حتى ما ينقلب ترتيبها بصفحة RTL */
.wealth-hero strong, .wealth-hero small,
.asset-value strong, .chart-legend .legend-value, .money-amount, .rate-input {
  direction:ltr; unicode-bidi:isolate;
}
.chart-legend .legend-value { text-align:left; }

/* تبويبات الادخار والثروة ما إلها علاقة بملخص الشهر */
#view-money[data-panel="wealth"] .month-switch,
#view-money[data-panel="wealth"] .finance-summary,
#view-money[data-panel="goals"] .month-switch,
#view-money[data-panel="goals"] .finance-summary,
#view-money[data-panel="subscriptions"] .month-switch { display:none; }
.field-inline { display:flex; align-items:center; gap:7px; padding:0 11px; border:1px solid var(--line); border-radius:12px; background:#18151f; color:var(--muted); font-size:.8rem; white-space:nowrap; }
.field-inline input { border:0; background:transparent; padding:11px 0; width:100%; min-width:0; }
.field-inline input:focus { outline:none; }
body[data-theme="light"] .field-inline, body[data-theme="paper"] .field-inline { background:#fff; }
body[data-theme="paper"] .field-inline { background:#fffdf8; }

/* ===== الثروة: واجهة جديدة ===== */
.wealth-hero { position:relative; }
.hero-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.hero-actions .primary { padding:9px 16px; }
.fetch-note { margin:10px 0 0; color:var(--muted); font-size:.78rem; }
.fetch-note.warn { color:var(--danger); }

.price-report { margin:0 2px 14px; padding:0; list-style:none; font-size:.82rem; }
.price-report li { padding:5px 11px; margin-bottom:5px; border-radius:9px; background:var(--panel); border:1px solid var(--line); }
.price-report li.ok { color:#57d5a6; }
.price-report li.bad { color:var(--danger); }

/* اختيار نوع الأصل: بطاقات كبيرة، كل وحدة بتقول شو بتنفع */
.kind-picker { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:6px; }
.kind-card { display:grid; gap:3px; padding:12px 9px; border:1px solid var(--line); border-radius:13px; background:transparent; color:var(--ink); text-align:center; }
.kind-card i { font-size:1.3rem; font-style:normal; }
.kind-card b { font-size:.9rem; }
.kind-card span { color:var(--muted); font-size:.7rem; line-height:1.35; }
.kind-card:hover { border-color:var(--accent); }
.kind-card.selected { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); background:var(--panel-2); }
.field-note { margin:2px 0 0; color:var(--muted); font-size:.78rem; line-height:1.5; }
.field-note code { padding:1px 5px; border-radius:5px; background:var(--panel-2); font-size:.9em; }
.price-age { color:var(--muted); }

/* العملات: حوار صغير */
@media (max-width:620px) {
  .kind-picker { grid-template-columns:repeat(2,1fr); }
}

/* ===== رسومات اللقطات ===== */
.chart-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:12px; }
.chart-toolbar select { padding:8px 10px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#18151f; font-size:.85rem; }
.chart-toolbar .small-action { margin-right:auto; }
.chart-title { margin:0 2px 12px; font-size:.9rem; font-weight:normal; color:var(--muted); }
.chart-empty { padding:26px; text-align:center; color:var(--muted); border:1px dashed var(--line); border-radius:13px; font-size:.87rem; }

.snap-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:14px; }
.snap-kpi { padding:13px; border:1px solid var(--line); border-radius:13px; background:var(--panel); }
.snap-kpi span { display:block; color:var(--muted); font-size:.75rem; }
.snap-kpi strong { display:block; margin:6px 0 3px; font-size:1.25rem; direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }
.snap-kpi strong.up { color:#57d5a6; }
.snap-kpi strong.down { color:var(--danger); }
.snap-kpi small { color:var(--muted); font-size:.72rem; }

/* الشبكة خافتة: خط شعرة بلون قريب من السطح، والقيم بلون النص الخافت */
.chart { position:relative; height:var(--chart-h,190px); margin-bottom:14px; padding:8px 54px 26px 0; }
.chart .grid { position:absolute; inset:8px 54px 26px 0; }
.chart .grid-line { position:absolute; right:0; left:0; border-top:1px solid var(--line); }
.chart .grid-line span { position:absolute; left:100%; top:-.6em; padding-left:9px; color:var(--muted); font-size:.68rem; direction:ltr; unicode-bidi:isolate; white-space:nowrap; }

.line-wrap .plot { position:absolute; inset:8px 54px 26px 0; }
.line-wrap .line-chart { display:block; width:100%; height:100%; overflow:visible; }
.line-wrap .line { stroke:var(--series-1); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.line-wrap .area { fill:var(--series-1); opacity:.1; }
.line-wrap .dots { position:absolute; inset:8px 54px 26px 0; }
.chart-dot { position:absolute; width:24px; height:24px; margin:0 0 -12px -12px; padding:0; border:0; background:transparent; cursor:pointer; }
.chart-dot::after { content:""; position:absolute; top:8px; left:8px; width:8px; height:8px; border-radius:50%; background:var(--series-1); box-shadow:0 0 0 2px var(--panel); }
.chart-dot:hover::after, .chart-dot:focus-visible::after { width:12px; height:12px; top:6px; left:6px; }
.chart-dot:focus-visible { outline:none; }
.end-label { position:absolute; left:4px; transform:translateY(50%); padding:2px 6px; border-radius:6px; background:var(--panel); color:var(--ink); font-size:.72rem; direction:ltr; unicode-bidi:isolate; }

.column-wrap .columns { position:absolute; inset:8px 54px 26px 0; display:flex; align-items:flex-end; gap:8px; }
.column-wrap .column { flex:1; min-width:0; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.column-wrap .stack { width:100%; max-width:24px; display:flex; flex-direction:column; justify-content:flex-end; gap:2px; }
.column-wrap .stack i { display:block; width:100%; }
.column-wrap .stack i:first-child { border-radius:4px 4px 0 0; }
.column-wrap .stack i:hover, .column-wrap .stack i:focus-visible { filter:brightness(1.18); outline:none; }
.col-label { position:absolute; bottom:-22px; color:var(--muted); font-size:.66rem; white-space:nowrap; }
.column-wrap .column { position:relative; }

.diverging { display:grid; gap:9px; margin-bottom:14px; }
.div-row { display:grid; grid-template-columns:80px 1fr 92px; align-items:center; gap:10px; font-size:.84rem; }
.div-label { color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.div-track { position:relative; height:18px; border-radius:5px; background:var(--panel-2); }
.div-track::before { content:""; position:absolute; top:-2px; bottom:-2px; right:50%; width:1px; background:var(--line); }
.div-track i { position:absolute; top:3px; bottom:3px; display:block; }
.div-track i.up { background:var(--series-1); border-radius:4px 0 0 4px; }
.div-track i.down { background:var(--series-8); border-radius:0 4px 4px 0; }
.div-value { text-align:left; direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }
.div-value.up { color:var(--series-1); }
.div-value.down { color:var(--series-8); }

.table-scroll { overflow-x:auto; margin-bottom:14px; }
.snap-table { width:100%; border-collapse:collapse; font-size:.82rem; white-space:nowrap; }
.snap-table th, .snap-table td { padding:9px 11px; text-align:right; border-bottom:1px solid var(--line); }
.snap-table th { color:var(--muted); font-weight:normal; font-size:.75rem; }
.snap-table th .swatch { display:inline-block; width:9px; height:9px; margin-left:5px; border-radius:2px; vertical-align:middle; }
.snap-table td { direction:ltr; unicode-bidi:isolate; text-align:left; font-variant-numeric:tabular-nums; }
.snap-table td:first-child { direction:rtl; text-align:right; }

.chart-tip { position:absolute; z-index:50; padding:7px 11px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); box-shadow:0 10px 26px #0007; pointer-events:none; font-size:.78rem; }
.chart-tip strong { display:block; direction:ltr; unicode-bidi:isolate; font-size:.92rem; }
.chart-tip span { color:var(--muted); }
.series-legend li { gap:7px; }

body[data-theme="light"] .chart-toolbar select, body[data-theme="paper"] .chart-toolbar select { color:var(--ink); background:#fff; }
body[data-theme="paper"] .chart-toolbar select { background:#fffdf8; }

@media (max-width:620px) {
  .snap-kpis { grid-template-columns:1fr; }
  .chart { padding-right:46px; padding-left:0; }
  .chart .grid, .line-wrap .plot, .line-wrap .dots, .column-wrap .columns { right:46px; left:0; }
  .div-row { grid-template-columns:64px 1fr 78px; font-size:.78rem; }
  .chart-toolbar .small-action { margin-right:0; width:100%; }
}
.manual-price { margin-top:4px; }
.manual-price summary { padding:7px 2px; color:var(--muted); font-size:.8rem; cursor:pointer; }
.manual-price summary:hover { color:var(--ink); }
.manual-price[open] summary { margin-bottom:6px; }

/* ربح وخسارة الأصل */
.asset-profit { margin:4px 0 0; font-size:.76rem; direction:ltr; unicode-bidi:isolate; text-align:right; }
.asset-profit.up { color:#57d5a6; }
.asset-profit.down { color:var(--danger); }

/* ===== الزكاة ===== */
.zakat-hero { padding:20px; margin-bottom:14px; border:1px solid var(--line); border-radius:16px; background:var(--panel); text-align:center; }
.zakat-hero span { display:block; color:var(--muted); font-size:.82rem; }
.zakat-hero strong { display:block; margin:10px 0 5px; font-size:2rem; direction:ltr; unicode-bidi:isolate; }
.zakat-hero.due strong { color:var(--accent); }
.zakat-hero.below strong { color:var(--muted); }
.zakat-hero small { color:var(--muted); font-size:.78rem; }
.zakat-rows { display:grid; gap:1px; margin-bottom:14px; border:1px solid var(--line); border-radius:13px; overflow:hidden; background:var(--line); }
.zakat-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 14px; background:var(--panel); font-size:.87rem; }
.zakat-row strong { direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }
.zakat-row.muted { color:var(--muted); font-size:.8rem; }
.zakat-row.muted strong { color:var(--muted); font-weight:normal; }
.zakat-controls { display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-bottom:12px; }
.zakat-controls select, .zakat-controls input[type="date"] { border:0; background:transparent; color:var(--ink); padding:10px 0; }
.zakat-check { display:flex; align-items:center; gap:9px; padding:9px 12px; border:1px solid var(--line); border-radius:12px; font-size:.82rem; color:var(--muted); }
.zakat-check input { appearance:none; flex:none; position:relative; width:38px; height:22px; margin:0; border:1px solid var(--line); border-radius:99px; background:#15121b; cursor:pointer; }
.zakat-check input::after { content:""; position:absolute; top:3px; right:3px; width:14px; height:14px; border-radius:50%; background:#aaa0b5; transition:.18s; }
.zakat-check input:checked { background:var(--accent); border-color:var(--accent); }
.zakat-check input:checked::after { right:19px; background:var(--accent-ink); }
.zakat-fine { margin:0; padding:12px 14px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); font-size:.78rem; line-height:1.6; }
.toast-undo { margin-right:12px; padding:3px 10px; border:0; border-radius:99px; background:var(--accent-ink); color:var(--accent); font:inherit; font-size:.85em; font-weight:bold; cursor:pointer; }
.toast-undo:hover { opacity:.85; }

/* ===== الفلوس: حسابات وتصنيفات ومتكررات ===== */
.money-top { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:14px; }
.money-top .month-switch { flex:1; min-width:200px; margin:0; }
.cash-pill { padding:9px 14px; border:1px solid var(--line); border-radius:99px; background:var(--panel); }
.cash-pill span { color:var(--muted); font-size:.72rem; }
.cash-pill strong { margin-right:8px; direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }

.filter-bar { display:grid; grid-template-columns:1fr 110px 1fr 1fr; gap:8px; margin-bottom:12px; }
.filter-bar input, .filter-bar select { padding:9px 11px; border:1px solid var(--line); border-radius:11px; color:var(--ink); background:#18151f; font-size:.85rem; }
.transfer-amount { color:var(--muted) !important; }

.account-icon { flex:none; width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:var(--panel-2); font-size:1rem; }
.asset-value strong.down { color:var(--danger); }
.inline-add.account-add { grid-template-columns:1fr 120px 130px auto; }
.inline-add.category-add { grid-template-columns:1fr 130px 80px auto; }
.inline-add.budget-add { grid-template-columns:1fr 130px auto auto; }

.category-row { display:flex; align-items:center; gap:9px; padding:9px 11px; margin-bottom:7px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.cat-swatch { flex:none; width:30px; height:30px; display:grid; place-items:center; border-radius:9px; font-size:.95rem; }
.cat-name { flex:1; min-width:0; padding:7px 9px; font-size:.88rem; }
.cat-count { flex:none; color:var(--muted); font-size:.74rem; white-space:nowrap; }
.category-row select { max-width:120px; padding:7px 9px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:transparent; font-size:.76rem; }
.category-row .danger { flex:none; border:0; background:transparent; color:var(--danger); }

.budget-card.warn { border-color:#c98500; }
.budget-card.over { border-color:var(--danger); }
.budget-state { flex:none; padding:3px 9px; border-radius:99px; font-size:.72rem; background:var(--panel-2); color:var(--muted); }
.budget-state.warn { color:#ffd08a; background:#4a3410; }
.budget-state.over { color:#ffd9d4; background:#5a2a26; }
.budget-foot { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:10px; color:var(--muted); font-size:.78rem; }
.budget-foot .danger { margin-right:auto; border:0; background:transparent; color:var(--danger); }
.mini-check { display:flex; align-items:center; gap:6px; font-size:.76rem; color:var(--muted); }
.mini-check input { width:15px; height:15px; }

.rec-form { display:grid; grid-template-columns:1fr 110px 110px 110px 1fr 1fr auto; gap:8px; margin-bottom:12px; }
.rec-form input, .rec-form select { padding:10px; border:1px solid var(--line); border-radius:11px; color:var(--ink); background:#18151f; font-size:.85rem; }
.goal-actions select { flex:none; max-width:130px; padding:8px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#18151f; font-size:.82rem; }

body[data-theme="light"] .filter-bar input, body[data-theme="light"] .filter-bar select,
body[data-theme="light"] .rec-form input, body[data-theme="light"] .rec-form select,
body[data-theme="light"] .goal-actions select, body[data-theme="light"] .category-row select,
body[data-theme="paper"] .filter-bar input, body[data-theme="paper"] .filter-bar select,
body[data-theme="paper"] .rec-form input, body[data-theme="paper"] .rec-form select,
body[data-theme="paper"] .goal-actions select, body[data-theme="paper"] .category-row select { color:var(--ink); background:#fff; }
body[data-theme="paper"] .filter-bar input, body[data-theme="paper"] .filter-bar select,
body[data-theme="paper"] .rec-form input, body[data-theme="paper"] .rec-form select { background:#fffdf8; }

@media (max-width:720px) {
  .filter-bar { grid-template-columns:1fr 1fr; }
  .rec-form { grid-template-columns:1fr 1fr; }
  .rec-form .primary { grid-column:1 / -1; }
  .inline-add.account-add, .inline-add.category-add, .inline-add.budget-add { grid-template-columns:1fr 1fr; }
  .inline-add.account-add .primary, .inline-add.budget-add .primary, .inline-add.category-add .primary { grid-column:1 / -1; }
  .category-row { flex-wrap:wrap; }
  .money-top { flex-direction:column; align-items:stretch; }
}
select.cat-swatch { flex:none; width:auto; min-width:44px; padding:6px 4px; border:0; border-radius:9px; text-align:center; font-size:.95rem; color:#111; appearance:none; cursor:pointer; }

/* ===== اليوم: مشاريع ووسوم وأجندة ===== */
.chip-bar { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:9px; }
.chip-bar:empty { display:none; }
.chip { display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border:1px solid var(--line); border-radius:99px; background:transparent; color:var(--muted); font-size:.78rem; }
.chip i { width:8px; height:8px; border-radius:50%; }
.chip b { color:var(--accent); font-weight:normal; }
.chip.on { color:var(--ink); border-color:var(--accent); background:var(--panel); }
.chip:hover { color:var(--ink); }
.chip-x { padding:0 2px; color:var(--muted); opacity:0; }
.chip:hover .chip-x { opacity:1; }
.chip-x:hover { color:var(--danger); }
.inline-add.project-add { grid-template-columns:1fr auto; margin-bottom:14px; }
.task-filters { width:max-content; max-width:100%; overflow-x:auto; margin-bottom:12px; }
.tag-badge { border:0; font:inherit; font-size:.72rem; cursor:pointer; }
.project-badge { padding-right:7px; }

.agenda-range { width:max-content; margin-bottom:14px; }
.agenda-day { margin-bottom:16px; }
.agenda-day header { display:flex; align-items:center; gap:9px; padding:0 2px 8px; border-bottom:1px solid var(--line); margin-bottom:10px; }
.agenda-day header strong { font-size:.92rem; }
.agenda-day header span { color:var(--muted); font-size:.78rem; }
.agenda-day header i { margin-right:auto; padding:2px 8px; border-radius:99px; background:var(--panel-2); color:var(--muted); font-style:normal; font-size:.72rem; }
.agenda-day.today header strong { color:var(--accent); }
.agenda-day.today header { border-color:var(--accent); }
.agenda-day.overdue header strong { color:var(--danger); }
.agenda-free { margin:0 0 4px; padding:10px 13px; border:1px dashed var(--line); border-radius:11px; color:var(--muted); font-size:.8rem; }
.agenda-day.empty { opacity:.65; }

.subtasks li .promote { margin-right:auto; border:0; background:transparent; color:var(--muted); font-size:.8rem; }
.subtasks li .promote:hover { color:var(--accent); }
.draft-subtasks li .mini { flex:none; padding:3px 7px; border:1px solid var(--line); border-radius:7px; background:transparent; color:var(--muted); font-size:.75rem; }
.draft-subtasks li .mini:disabled { opacity:.35; }
.repeat-block { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.repeat-every { display:flex; align-items:center; gap:7px; }
.repeat-every input { width:70px; }
.task-stats span small { color:var(--muted); font-size:.68rem; }

/* ===== الإحصاءات ===== */
.dash-tabs { width:max-content; margin-bottom:16px; }
.dash-panel { display:none; }
.dash-panel.active { display:block; }
.stats-toolbar { margin-bottom:18px; }
.stat-block { margin-bottom:30px; }
.stat-block h3 { margin:0 2px 14px; padding-bottom:9px; border-bottom:1px solid var(--line); font-size:1.05rem; }
.stat-kpis { grid-template-columns:repeat(3,1fr); }

/* خريطة حرارة: تدرّج لون واحد. الصفر بلون السطح حتى الفاضي يبيّن فاضي. */
:root { --heat-0:#eceaf0; --heat-1:#cde2fb; --heat-2:#86b6ef; --heat-3:#3987e5; --heat-4:#1c5cab; }
body[data-theme="dark"], body[data-theme="warm"], body[data-theme="oled"] {
  --heat-0:#2a2633; --heat-1:#184f95; --heat-2:#256abf; --heat-3:#3987e5; --heat-4:#86b6ef;
}
.heatmap { display:flex; gap:6px; margin-bottom:10px; overflow-x:auto; padding-bottom:4px; direction:ltr; }
.heat-days { display:grid; grid-template-rows:repeat(7,1fr); gap:3px; flex:none; }
.heat-days span { height:12px; color:var(--muted); font-size:.6rem; line-height:12px; white-space:nowrap; }
.heat-grid { display:flex; gap:3px; }
.heat-week { display:grid; grid-template-rows:repeat(7,1fr); gap:3px; }
.heat-cell { display:block; width:12px; height:12px; border-radius:3px; background:var(--heat-0); }
.heat-cell.empty { background:transparent; }
.heat-cell.heat-0 { background:var(--heat-0); }
.heat-cell.heat-1 { background:var(--heat-1); }
.heat-cell.heat-2 { background:var(--heat-2); }
.heat-cell.heat-3 { background:var(--heat-3); }
.heat-cell.heat-4 { background:var(--heat-4); }
.heat-cell:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.heat-scale { display:flex; align-items:center; gap:4px; margin-bottom:18px; color:var(--muted); font-size:.7rem; direction:ltr; }

/* أعمدة أفقية */
.bar-rows { display:grid; gap:8px; margin-bottom:18px; }
.bar-row { display:grid; grid-template-columns:96px 1fr 92px; align-items:center; gap:10px; font-size:.83rem; }
.bar-label { color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bar-track { height:16px; border-radius:5px; background:var(--panel-2); overflow:hidden; }
.bar-track i { display:block; height:100%; border-radius:5px 0 0 5px; }
.bar-track:hover i, .bar-track:focus-visible i { filter:brightness(1.15); }
.bar-value { text-align:left; direction:ltr; unicode-bidi:isolate; color:var(--ink); font-variant-numeric:tabular-nums; }

@media (max-width:720px) {
  .stat-kpis { grid-template-columns:1fr 1fr; }
  .bar-row { grid-template-columns:72px 1fr 78px; font-size:.76rem; }
}

/* ===== شاشة أول استخدام ===== */
#onboarding { position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:20px;
  background:#0b0910ee; backdrop-filter:blur(6px); animation:onboard-in .35s ease both; }
#onboarding.leaving { animation:onboard-out .3s ease both; }
.onboard-card { width:min(420px,100%); padding:34px 28px 24px; border:1px solid var(--line); border-radius:22px;
  background:var(--panel); text-align:center; box-shadow:0 30px 80px #000a; animation:card-in .45s cubic-bezier(.2,.8,.3,1) both; }
.onboard-icon { display:grid; place-items:center; width:62px; height:62px; margin:0 auto 18px; border-radius:20px;
  background:var(--accent); color:var(--accent-ink); font-size:1.7rem; animation:pop .5s cubic-bezier(.2,1.4,.4,1) both .1s; }
.onboard-card h2 { margin:0 0 10px; font-size:1.45rem; animation:rise .45s ease both .12s; }
.onboard-card p { margin:0 0 22px; color:var(--muted); line-height:1.7; font-size:.92rem; animation:rise .45s ease both .18s; }
.onboard-dots { display:flex; justify-content:center; gap:7px; margin-bottom:20px; }
.onboard-dots i { width:7px; height:7px; border-radius:50%; background:var(--line); transition:.3s; }
.onboard-dots i.on { width:22px; border-radius:99px; background:var(--accent); }
.onboard-card .primary { width:100%; padding:12px; font-size:.95rem; animation:rise .45s ease both .24s; }
.text-skip { display:block; width:100%; margin-top:10px; padding:8px; border:0; background:transparent; color:var(--muted); font:inherit; font-size:.82rem; }
.text-skip:hover { color:var(--ink); }

@keyframes onboard-in { from { opacity:0; } to { opacity:1; } }
@keyframes onboard-out { to { opacity:0; } }
@keyframes card-in { from { opacity:0; transform:translateY(22px) scale(.97); } to { opacity:1; transform:none; } }
@keyframes rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes pop { from { opacity:0; transform:scale(.5) rotate(-12deg); } to { opacity:1; transform:none; } }
body.reduce-motion #onboarding, body.reduce-motion .onboard-card, body.reduce-motion .onboard-card * { animation:none !important; }

/* على الشاشات الضيّقة التبويبات بتلتف على سطرين بدل ما تنجرّ أفقياً، أسهل باليد */
@media (max-width:700px) {
  .finance-tabs, .wealth-tabs, .task-filters, .dash-tabs, .agenda-range,
  .chart-toolbar .segmented, .stats-toolbar .segmented {
    display:flex; flex-wrap:wrap; width:auto; max-width:100%; overflow:visible;
  }
  .finance-tabs button, .wealth-tabs button, .task-filters button, .dash-tabs button,
  .agenda-range button, .chart-toolbar .segmented button { flex:1 1 auto; min-width:max-content; }
  .chart-toolbar { flex-wrap:wrap; }
  .chart-toolbar select { flex:1 1 120px; }
}
/* الرسومات العريضة بتنجرّ جوّا حالها؛ الكتلة ما بتدفع الصفحة لبرا */
.stat-block, #stats-body, .finance-panel, .wealth-panel { min-width:0; }
@media (max-width:700px) { .stat-block, #stats-body { overflow-x:clip; } }

/* ===== المؤقّت ===== */
.timer-tabs { width:max-content; margin-bottom:16px; }
.timer-panel { display:none; }
.timer-panel.active { display:block; }

.timer-modes { display:flex; gap:6px; justify-content:center; margin-bottom:14px; }
.timer-mode { border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--muted); padding:7px 16px; font-size:.86rem; }
.timer-mode.active { color:var(--accent-ink); background:var(--accent); border-color:var(--accent); font-weight:bold; }

.timer-lengths { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-bottom:16px; }
.timer-lengths .chip { border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--muted); padding:6px 13px; font-size:.8rem; }
.timer-lengths .chip.on { color:var(--ink); border-color:var(--accent); background:var(--panel-2); }

.timer-dial { position:relative; width:min(260px,72vw); aspect-ratio:1; margin:0 auto; }
.timer-dial svg { width:100%; height:100%; transform:rotate(-90deg); }
.ring-track { fill:none; stroke:var(--panel-2); stroke-width:10; }
.ring-value { fill:none; stroke:var(--dial); stroke-width:10; stroke-linecap:round; transition:stroke-dashoffset .25s linear; }
.timer-dial.paused .ring-value { opacity:.45; }
.timer-dial.flash .ring-value { animation:dial-flash 1s ease-in-out 3; }
@keyframes dial-flash { 50% { opacity:.2; } }
.reduce-motion .timer-dial.flash .ring-value { animation:none; }

.dial-face { position:absolute; inset:0; display:grid; place-content:center; text-align:center; gap:3px; }
.dial-mode { color:var(--muted); font-size:.82rem; }
.dial-face strong { font-size:2.9rem; font-variant-numeric:tabular-nums; letter-spacing:-1px; line-height:1.1; }
.dial-face small { color:var(--muted); font-size:.76rem; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.timer-rounds { display:flex; gap:7px; justify-content:center; margin:16px 0 4px; }
.round-dot { width:9px; height:9px; border-radius:50%; border:1px solid var(--line); background:transparent; }
.round-dot.on { background:var(--accent); border-color:var(--accent); }

.timer-actions { display:flex; gap:9px; justify-content:center; align-items:center; margin:18px 0 16px; }
.primary.big { padding:13px 40px; font-size:1.02rem; border-radius:14px; }
.primary.big[disabled] { opacity:.45; cursor:not-allowed; }
.danger-text { color:var(--danger); }

.timer-task-row { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.timer-task-row > span { font-size:.88rem; }
.timer-task-row small { color:var(--muted); font-size:.76rem; }
.timer-task-row select { max-width:200px; }

.timer-today { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:14px; }
.timer-today div { padding:13px; border:1px solid var(--line); border-radius:13px; background:var(--panel); text-align:center; }
.timer-today span { display:block; color:var(--muted); font-size:.76rem; }
.timer-today strong { display:block; margin-top:6px; font-size:1.1rem; }

.log-day + .log-day { margin-top:16px; }
.log-head { display:flex; justify-content:space-between; align-items:baseline; margin:0 4px 8px; }
.log-head span { color:var(--muted); font-size:.82rem; }
.log-row { display:flex; align-items:center; gap:10px; padding:10px 13px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.log-row + .log-row { margin-top:6px; }
.log-dot { flex:none; width:9px; height:9px; border-radius:50%; }
.log-what { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.88rem; }
.log-len { flex:none; color:var(--muted); font-size:.82rem; font-variant-numeric:tabular-nums; }
.log-row .ghost { flex:none; border:1px solid var(--line); border-radius:9px; background:var(--panel-2); color:var(--muted); padding:4px 9px; }

@media (max-width:700px) {
  .timer-today { grid-template-columns:1fr; }
  .timer-task-row { flex-direction:column; align-items:stretch; gap:8px; }
  .timer-task-row select { max-width:none; }
  .dial-face strong { font-size:2.4rem; }
}

/* شريط ساعات اليوم: 24 عمود، الساعة 0 عاليمين */
.hour-strip { display:flex; gap:2px; align-items:flex-end; height:96px; padding:0 2px; border-bottom:1px solid var(--line); }
.hour-bar { flex:1; min-width:0; height:100%; border-radius:4px; background:transparent; position:relative; }
.hour-bar:hover { background:var(--panel-2); }
.hour-bar::after { content:""; position:absolute; inset:auto 0 0 0; height:var(--fill); border-radius:4px 4px 0 0; background:var(--series-1); }
.hour-bar:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.hour-axis { position:relative; height:16px; margin-top:5px; color:var(--muted); font-size:.7rem; }
.hour-axis span { position:absolute; transform:translateX(50%); }

/* حقل الوقت */
.time-field { display:flex; align-items:center; gap:6px; margin-top:5px; }
.time-field select { flex:1; min-width:0; padding:9px 6px; font-size:.88rem; }
.time-sep { color:var(--muted); }
.time-clear { flex:none; border:1px solid var(--line); border-radius:9px; background:transparent; color:var(--muted); padding:8px 10px; font-size:.76rem; }
.time-clear:hover { color:var(--ink); border-color:var(--accent); }

/* مهمة ناطرة غيرها */
.task-item.blocked { opacity:.62; }
.task-item.blocked .item-title { color:var(--muted); }
.blocked-badge { color:#ffd9a8; background:#4a3a22; }
.time-badge { color:var(--accent); background:var(--panel-2); font-variant-numeric:tabular-nums; }
.blocked-block { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.blocker-chips { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 10px; }
.blocker-chips .chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:999px; background:var(--panel-2); color:var(--ink); padding:5px 11px; font-size:.78rem; }
.blocker-chips .chip-x { color:var(--danger); cursor:pointer; }
.field-hint { display:block; color:var(--muted); font-weight:normal; font-size:.76rem; margin-top:2px; }

/* خط اليوم الزمني */
.timeline-wrap { display:grid; gap:14px; }
.timeline { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--panel); }
.hour-row { display:flex; gap:11px; align-items:flex-start; padding:9px 13px; min-height:46px; }
.hour-row + .hour-row { border-top:1px solid var(--line); }
.hour-label { flex:none; width:66px; padding-top:8px; color:var(--muted); font-size:.76rem; font-variant-numeric:tabular-nums; }
.hour-slot { flex:1; min-width:0; display:grid; gap:7px; }
.hour-row.free .hour-slot::after { content:""; display:block; height:20px; border-radius:8px; border:1px dashed var(--line); opacity:.45; }
.hour-row.now { background:var(--panel-2); }
.hour-row.now .hour-label { color:var(--accent); font-weight:bold; }
.timeline-note { margin:0 4px 8px; color:var(--muted); font-size:.8rem; }

/* سحب وإفلات */
body.dragging-task { user-select:none; touch-action:none; }
.task-item.dragging { opacity:.35; }
.drag-ghost { position:fixed; top:0; right:auto; left:0; z-index:200; pointer-events:none;
  box-shadow:0 18px 44px #0008; transform-origin:top left; opacity:.95; }
.drop-hint { outline:2px dashed var(--accent); outline-offset:2px; border-radius:14px; }
.hour-row.drop-hint { outline-offset:-2px; }

@media (max-width:700px) {
  .hour-label { width:54px; font-size:.7rem; }
  .hour-row { padding:8px 9px; gap:7px; }
}

/* القوالب */
.inline-add.template-add { grid-template-columns:1fr auto; }
.template-list { display:grid; gap:10px; }
.template-card { padding:14px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.template-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.template-head strong { display:block; }
.template-head span { color:var(--muted); font-size:.78rem; }
.template-actions { display:flex; gap:7px; align-items:center; }
.template-actions .primary { padding:7px 15px; font-size:.84rem; border-radius:10px; }
.template-actions .danger { border:1px solid var(--line); border-radius:9px; background:var(--panel-2); color:var(--danger); padding:6px 10px; }
.template-preview { list-style:none; margin:11px 0 0; padding:0; display:grid; gap:5px; }
.template-preview li { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:.8rem; }
.template-preview span { color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* المراجعة الأسبوعية */
.review-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:16px; }
.review-kpis div { padding:12px; border:1px solid var(--line); border-radius:13px; background:var(--panel-2); text-align:center; }
.review-kpis span { display:block; color:var(--muted); font-size:.76rem; }
.review-kpis strong { display:block; margin-top:5px; font-size:1.4rem; }
.review-block + .review-block { margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }
.review-head { display:flex; align-items:baseline; gap:9px; margin-bottom:8px; }
.review-head span { flex:1; color:var(--muted); font-size:.78rem; }
.review-head i { font-style:normal; padding:2px 9px; border-radius:99px; background:var(--panel-2); color:var(--muted); font-size:.76rem; }
.review-list { list-style:none; margin:0; padding:0; display:grid; gap:5px; max-height:190px; overflow:auto; }
.review-list li { display:flex; justify-content:space-between; gap:12px; padding:7px 11px; border-radius:10px; background:var(--panel-2); font-size:.85rem; }
.review-list small { color:var(--muted); flex:none; }
.review-list li.muted { background:transparent; color:var(--muted); }
.review-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }

@media (max-width:700px) { .review-kpis { grid-template-columns:1fr 1fr; } }

/* تقسيم الحركة */
.split-block { margin-top:6px; padding-top:12px; border-top:1px solid var(--line); }
.split-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.split-status { font-size:.78rem; color:var(--muted); }
.split-status.ok { color:#57d5a6; }
.split-status.bad { color:var(--danger); }
.split-rows { display:grid; gap:7px; margin:10px 0; }
.split-row { display:grid; grid-template-columns:1fr 120px auto; gap:7px; align-items:center; }
.split-row input { margin-top:0; }
.split-row .danger { border:1px solid var(--line); border-radius:9px; background:var(--panel-2); color:var(--danger); padding:8px 11px; }
.split-badge { color:#bbd9ff; background:#293d59; }

/* تصنيفات فرعية */
.category-row.is-child { margin-right:26px; border-right:2px solid var(--line); }
.cat-parent { max-width:130px; font-size:.76rem; }

/* القواعد */
.rules-block { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.inline-add.rule-add { grid-template-columns:1fr 150px auto; }
.rule-list { display:grid; gap:6px; margin-bottom:12px; }
.rule-row { display:flex; align-items:center; gap:9px; padding:9px 12px; border:1px solid var(--line); border-radius:11px; background:var(--panel); font-size:.85rem; }
.rule-match { color:var(--ink); }
.rule-arrow { color:var(--muted); }
.rule-cat { flex:1; color:var(--muted); }
.rule-row .danger { border:0; background:transparent; color:var(--danger); }

@media (max-width:700px) {
  .split-row { grid-template-columns:1fr 90px auto; }
  .inline-add.rule-add { grid-template-columns:1fr 1fr; }
  .inline-add.rule-add .small-action { grid-column:1 / -1; }
  .category-row.is-child { margin-right:14px; }
}

/* الديون */
.inline-add.debt-add { grid-template-columns:1fr 110px 120px 130px auto; }
.debt-date-row { display:block; margin-bottom:14px; }
.debt-card { padding:15px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.debt-card + .debt-card { margin-top:10px; }
.debt-card.settled { opacity:.68; }
.debt-card.late { border-color:#7a4a44; }

/* خطة الهدف */
.goal-plan { margin:8px 0 0; font-size:.8rem; color:var(--muted); line-height:1.5; }
.goal-plan.ahead { color:#57d5a6; }
.goal-plan.late { color:var(--danger); }

/* تنبيهات الميزانية */
.budget-alerts { display:grid; gap:7px; margin-bottom:14px; }
.budget-alert { display:flex; align-items:center; gap:10px; width:100%; text-align:right; font:inherit;
  padding:11px 14px; border-radius:13px; border:1px solid var(--line); background:var(--panel); color:var(--ink); cursor:pointer; }
.budget-alert b { flex:none; }
.budget-alert span { flex:1; color:var(--muted); font-size:.82rem; }
.budget-alert.warn { border-color:#7a6a33; }
.budget-alert.over { border-color:#7a4a44; }
.budget-alert.over span { color:var(--danger); }
.budget-alert:hover { border-color:var(--accent); }

@media (max-width:700px) {
  .inline-add.debt-add { grid-template-columns:1fr 1fr; }
  .inline-add.debt-add .primary { grid-column:1 / -1; }
  .budget-alert { flex-direction:column; align-items:flex-start; gap:3px; }
}

/* مقارنة الفترات */
.compare-table { margin:10px 0 20px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--panel); }
.compare-row { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:8px; align-items:center; padding:10px 13px; font-size:.84rem; }
.compare-row + .compare-row { border-top:1px solid var(--line); }
.compare-row.head { background:var(--panel-2); color:var(--muted); font-size:.78rem; }
.compare-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.compare-now, .compare-before, .compare-delta { text-align:left; font-variant-numeric:tabular-nums; }
.compare-before { color:var(--muted); }
.compare-delta.up { color:#57d5a6; }
.compare-delta.down { color:var(--danger); }
.forecast-note { margin:10px 0 0; font-size:.85rem; }
.forecast-note.ahead { color:#57d5a6; }
.forecast-note.late { color:var(--danger); }

@media (max-width:700px) {
  .compare-row { grid-template-columns:1fr 1fr; gap:4px 8px; }
  .compare-row.head .compare-delta, .compare-row.head .compare-before { display:none; }
  .compare-before::before { content:"سابق "; color:var(--muted); }
}

/* استيراد كشف بنكي */
.import-map { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0 16px; }
.map-row { display:flex; flex-direction:column; gap:4px; font-size:.82rem; }
.map-row > span { color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.import-preview { display:grid; gap:5px; max-height:230px; overflow:auto; }
.preview-row { display:grid; grid-template-columns:90px 1fr 90px 90px auto; gap:8px; align-items:center;
  padding:8px 11px; border-radius:10px; background:var(--panel-2); font-size:.8rem; }
.preview-row.dupe { opacity:.55; }
.preview-note { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.preview-flag { color:var(--danger); font-size:.72rem; }

/* تقرير الشهر */
.report-dialog { width:min(760px,calc(100vw - 28px)); }
.report-body { color:var(--ink); }
.report-head h2 { margin:0 0 4px; }
.report-head p { margin:0 0 18px; color:var(--muted); font-size:.84rem; }
.report-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-bottom:20px; }
.report-kpis div { padding:12px; border:1px solid var(--line); border-radius:12px; text-align:center; }
.report-kpis span { display:block; color:var(--muted); font-size:.74rem; }
.report-kpis strong { display:block; margin-top:5px; font-size:1.1rem; }
.report-body h3 { margin:20px 0 9px; font-size:.98rem; }
.report-table { width:100%; border-collapse:collapse; font-size:.84rem; }
.report-table th, .report-table td { padding:8px 10px; text-align:right; border-bottom:1px solid var(--line); }
.report-table th { color:var(--muted); font-weight:normal; font-size:.78rem; }
.report-table td:not(:first-child), .report-table th:not(:first-child) { text-align:left; font-variant-numeric:tabular-nums; }
.report-total td { font-weight:bold; }

@media (max-width:700px) {
  .import-map { grid-template-columns:1fr; }
  .preview-row { grid-template-columns:1fr auto; }
  .preview-row span:nth-child(3) { display:none; }
  .report-kpis { grid-template-columns:1fr 1fr; }
}

/* الطباعة: التقرير وحده، على ورق أبيض بحبر أسود */
@media print {
  @page { margin:14mm; }
  html, body { background:#fff !important; }
  body > main, body > #toast, body > #sidebar-backdrop, body > #build-badge,
  body > dialog:not(#report-dialog), #dialogs > dialog:not(#report-dialog),
  .chart-tip, .no-print { display:none !important; }
  #dialogs { display:block !important; }

  #report-dialog {
    display:block !important; position:static !important; inset:auto !important;
    width:100% !important; max-width:none !important; height:auto !important; max-height:none !important;
    border:0 !important; padding:0 !important; margin:0 !important; box-shadow:none !important;
    background:#fff !important; color:#111 !important; overflow:visible !important;
  }
  #report-dialog::backdrop { display:none !important; }

  .report-body, .report-body * { color:#111 !important; background:transparent !important; }
  .report-head p, .report-kpis span, .report-table th { color:#555 !important; }
  .report-kpis div { border:1px solid #ccc !important; }
  .report-table th, .report-table td { border-bottom:1px solid #ddd !important; }
  .report-body h3 { border-bottom:2px solid #111; padding-bottom:4px; }
  .report-table { page-break-inside:auto; }
  .report-table tr { page-break-inside:avoid; }
  .report-body h3 { page-break-after:avoid; }
}

/* عمليات الشرا والعوائد */
.lots-block { margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.lot-rows { display:grid; gap:7px; margin:10px 0; }
.lot-row { display:grid; grid-template-columns:1fr 1fr 130px auto; gap:7px; align-items:center; }
.lot-row.income-row { grid-template-columns:120px 130px 1fr auto; }
.lot-row input { margin-top:0; }
.lot-row .danger { border:1px solid var(--line); border-radius:9px; background:var(--panel-2); color:var(--danger); padding:8px 11px; }
.asset-income { margin:4px 0 0; color:#57d5a6; font-size:.78rem; }

/* خطة التوزيع */
.plan-table { margin:12px 0 18px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--panel); }
.plan-row { display:grid; grid-template-columns:1.2fr 1fr 90px 1.3fr; gap:9px; align-items:center; padding:11px 13px; font-size:.85rem; }
.plan-row + .plan-row { border-top:1px solid var(--line); }
.plan-row.head { background:var(--panel-2); color:var(--muted); font-size:.78rem; }
.plan-actual small { display:block; color:var(--muted); font-size:.72rem; }
.plan-target { display:flex; align-items:center; gap:4px; color:var(--muted); }
.plan-target input { width:56px; padding:6px 8px; margin:0; text-align:center; }
.plan-gap { color:var(--muted); font-size:.8rem; }
.plan-gap.ok { color:#57d5a6; }
.plan-gap.add { color:var(--accent); }
.plan-gap.trim { color:#ffc266; }
.plan-bars { margin-top:6px; }
.warn-text { color:#ffc266; }

@media (max-width:700px) {
  .lot-row, .lot-row.income-row { grid-template-columns:1fr 1fr auto; }
  .lot-row input:nth-child(3) { grid-column:1 / 3; }
  .plan-row { grid-template-columns:1fr 1fr; gap:6px 9px; }
  .plan-row.head { display:none; }
}

/* لوحة الأوامر */
#palette { position:fixed; inset:0; z-index:150; display:grid; place-items:start center; padding-top:12vh; }
#palette[hidden] { display:none; }
.palette-backdrop { position:absolute; inset:0; background:#0b0910c0; backdrop-filter:blur(3px); }
.palette-card { position:relative; width:min(560px,calc(100vw - 28px)); max-height:70vh; display:flex; flex-direction:column;
  border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:0 28px 70px #000a; overflow:hidden; }
#palette-input { border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; padding:16px 18px; font-size:1rem; }
#palette-input:focus { border-color:var(--line); }
.palette-results { flex:1; overflow:auto; padding:8px; }
.palette-group + .palette-group { margin-top:6px; }
.palette-group-name { margin:6px 10px 4px; color:var(--muted); font-size:.72rem; }
.palette-item { display:flex; align-items:center; gap:10px; width:100%; padding:10px 12px; border:0; border-radius:11px;
  background:transparent; color:var(--ink); text-align:right; font:inherit; cursor:pointer; }
.palette-item:hover { background:var(--panel-2); }
.palette-item.active { background:var(--panel-2); box-shadow:inset 2px 0 0 var(--accent); }
.palette-label { flex:none; max-width:55%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.palette-hint { flex:1; color:var(--muted); font-size:.78rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.palette-trailing { flex:none; color:var(--accent); font-size:.78rem; font-variant-numeric:tabular-nums; }
.palette-empty { margin:24px; text-align:center; color:var(--muted); font-size:.88rem; }
.palette-foot { margin:0; padding:9px 14px; border-top:1px solid var(--line); color:var(--muted); font-size:.72rem; text-align:center; }

/* اختيار مدة الجلسة الحرة */
.free-picker { display:flex; align-items:center; justify-content:center; gap:9px; margin-bottom:8px; }
.free-picker.off { opacity:.45; }
.free-picker .step { width:38px; height:38px; flex:none; border:1px solid var(--line); border-radius:11px;
  background:var(--panel); color:var(--ink); font-size:1.2rem; line-height:1; display:grid; place-items:center; }
.free-picker .step:hover { border-color:var(--accent); }
.free-amount { display:flex; align-items:center; gap:7px; }
.free-amount input { width:92px; padding:9px 10px; text-align:center; font-size:1.05rem; font-variant-numeric:tabular-nums; }
.free-amount span { color:var(--muted); font-size:.84rem; }
.free-hint { margin:0 0 12px; text-align:center; color:var(--muted); font-size:.78rem; }

/* ===== الورق ===== */
.paper-alerts { display:grid; gap:7px; margin-bottom:14px; }
.paper-alert { display:flex; align-items:center; gap:11px; width:100%; text-align:right; font:inherit;
  padding:11px 14px; border-radius:13px; border:1px solid var(--line); background:var(--panel); color:var(--ink); cursor:pointer; }
.paper-alert b { flex:none; }
.paper-alert span { flex:1; color:var(--muted); font-size:.82rem; }
.paper-alert i { flex:none; font-style:normal; color:var(--accent); font-size:.8rem; }
.paper-alert.soon { border-color:#7a6a33; }
.paper-alert.over { border-color:#7a4a44; }
.paper-alert.over span { color:var(--danger); }
.paper-alert:hover { border-color:var(--accent); }

.inline-add.paper-add { grid-template-columns:1fr 150px 140px auto; }
.paper-date-row { display:block; margin-bottom:14px; }

.paper-card { display:flex; align-items:flex-start; gap:11px; padding:14px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.paper-card + .paper-card { margin-top:9px; }
.paper-card.over { border-color:#7a4a44; }
.paper-card.soon { border-color:#7a6a33; }
.paper-dot { flex:none; width:9px; height:9px; margin-top:7px; border-radius:50%; }
.paper-main { flex:1; min-width:0; }
.paper-name { margin:0; line-height:1.4; overflow-wrap:anywhere; }
.paper-meta { margin:5px 0 0; color:var(--muted); font-size:.78rem; }
.paper-ref { font-variant-numeric:tabular-nums; }
.paper-left { margin:5px 0 0; font-size:.82rem; color:var(--muted); }
.paper-left.over { color:var(--danger); }
.paper-left.soon { color:#ffc266; }
.paper-note { margin:5px 0 0; color:var(--muted); font-size:.78rem; }
.paper-state { font-size:.7rem; }
.paper-state.ok { color:#9fe7c4; background:#20402f; }
.paper-state.soon { color:#ffd9a8; background:#4a3a22; }
.paper-state.over { color:#ffd0c9; background:#603a3b; }
.paper-state.none { color:var(--muted); background:var(--panel-2); }
.paper-actions { flex:none; display:flex; align-items:center; gap:6px; }
.paper-actions .ghost, .paper-actions .danger { border:1px solid var(--line); border-radius:9px; background:var(--panel-2); padding:6px 9px; }
.paper-actions .ghost { color:var(--muted); font-size:.78rem; }
.paper-actions .danger { color:var(--danger); }

/* خط السنة الجاية */
.timeline-months { display:grid; gap:7px; margin-top:14px; }
.timeline-month { border:1px solid var(--line); border-radius:13px; background:var(--panel); padding:10px 13px; }
.timeline-month.empty { opacity:.55; padding:7px 13px; }
.timeline-month.empty .month-head { margin:0; justify-content:space-between; }
.timeline-month.over { border-color:#7a4a44; margin-bottom:12px; }
.month-head { display:flex; align-items:baseline; gap:9px; margin-bottom:7px; }
.month-head i { font-style:normal; padding:1px 8px; border-radius:99px; background:var(--panel-2); color:var(--muted); font-size:.72rem; }
.month-body { display:flex; flex-wrap:wrap; gap:6px; }
.month-chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:999px;
  background:var(--panel-2); color:var(--ink); padding:5px 11px; font:inherit; font-size:.8rem; cursor:pointer; }
.month-chip small { color:var(--muted); font-size:.72rem; }
.month-chip.soon { border-color:#7a6a33; }
.month-chip.over { border-color:#7a4a44; }
.month-chip:hover { border-color:var(--accent); }
.month-free { color:var(--muted); font-size:.78rem; }

@media (max-width:700px) {
  .inline-add.paper-add { grid-template-columns:1fr 1fr; }
  .inline-add.paper-add .primary { grid-column:1 / -1; }
  .paper-card { flex-wrap:wrap; }
  .paper-actions { width:100%; justify-content:flex-end; }
  .paper-alert { flex-direction:column; align-items:flex-start; gap:3px; }
}

/* زر «اعرض كمان»: القوائم الطويلة بتنعرض على دفعات حتى تضل الصفحة سريعة */
.load-more { display:block; width:100%; margin-top:9px; padding:12px; border:1px dashed var(--line);
  border-radius:13px; background:transparent; color:var(--muted); font:inherit; cursor:pointer; }
.load-more:hover { border-color:var(--accent); color:var(--ink); }
.load-more small { color:var(--muted); font-size:.76rem; }

/* بلاغ امتلاء التخزين */
.storage-alarm { position:fixed; inset:auto 12px 12px 12px; z-index:180; display:flex; flex-wrap:wrap;
  align-items:center; gap:10px; padding:13px 16px; border:1px solid #7a4a44; border-radius:14px;
  background:#3a2224; color:#ffe3de; box-shadow:0 18px 44px #0009; }
.storage-alarm[hidden] { display:none; }
.storage-alarm strong { flex:none; }
.storage-alarm span { flex:1; min-width:220px; font-size:.84rem; color:#f3c8c2; }
.storage-alarm .small-action { flex:none; border:1px solid #a76a63; background:#4d2c2e; color:#ffe3de; }

/* تحذير المساحة (مو فشل حفظ): نبرة أهدا، أصفر مو أحمر */
.storage-alarm.soft { border-color:#7d6a2f; background:#332d18; color:#f7ecc6; }
.storage-alarm.soft span { color:#e4d6a8; }
.storage-alarm.soft .small-action { border-color:#9a854a; background:#443c20; color:#f7ecc6; }

/* مقياس المساحة بالإعدادات */
.storage-row { flex-direction:column; align-items:stretch; gap:9px; }
.storage-meter { display:grid; gap:6px; }
.storage-track { height:8px; border-radius:99px; background:var(--panel-2); overflow:hidden; }
.storage-track i { display:block; height:100%; border-radius:inherit; background:var(--accent); }
.storage-track i.warn { background:#ffc266; }
.storage-track i.over { background:var(--danger); }
.storage-meter span { color:var(--muted); font-size:.78rem; }
.agenda-more { margin:7px 4px 0; color:var(--muted); font-size:.78rem; }

/* ===== الألعاب ===== */
.games-tabs { width:max-content; margin-bottom:16px; }
.games-panel { display:none; }
.games-panel.active { display:block; }
.stripe-defs { position:absolute; width:0; height:0; overflow:hidden; }

.game-head h3 { margin:0 0 4px; font-size:1.08rem; }
.game-hint { margin:0 0 12px; color:var(--muted); font-size:.84rem; }

/* شريط الحالة */
.rule-bar { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin:14px 0 18px; }
.rule-bar div { padding:11px; border:1px solid var(--line); border-radius:13px; background:var(--panel); text-align:center; }
.rule-bar span { display:block; color:var(--muted); font-size:.74rem; }
.rule-bar strong { display:block; margin-top:5px; font-size:1.25rem; font-variant-numeric:tabular-nums; }

/* باني البطاقة: قلب اللعبة */
.probe-builder { padding:20px; border:1px solid var(--line); border-radius:20px; background:var(--panel); text-align:center; }
.probe-card { display:grid; place-items:center; min-height:110px; margin:0 auto 8px; max-width:320px;
  border:1px solid var(--line); border-radius:18px; background:var(--panel-2);
  box-shadow:inset 0 1px 0 #ffffff0d; }
.probe-card .card-marks { animation:card-pop .18s ease-out; }
@keyframes card-pop { from { transform:scale(.9); opacity:.4; } }
.reduce-motion .probe-card .card-marks { animation:none; }
.card-marks { display:inline-flex; gap:12px; align-items:center; justify-content:center; }
.card-mark { display:block; }
.probe-name { margin:0 0 14px; color:var(--muted); font-size:.84rem; }
.cyclers { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:14px; }
.cycler { display:block; padding:10px 6px; border:1px solid var(--line); border-radius:12px;
  background:transparent; color:var(--ink); font:inherit; cursor:pointer; text-align:center; }
.cycler:hover { border-color:var(--accent); }
.cycler span { display:block; color:var(--muted); font-size:.7rem; }
.cycler strong { display:block; margin-top:3px; font-size:.88rem; }

/* كفّتا الأدلة */
.evidence { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:16px 0; }
.evidence-side { border:1px solid var(--line); border-radius:16px; background:var(--panel); overflow:hidden; }
.evidence-side header { display:flex; justify-content:space-between; align-items:center;
  padding:9px 13px; font-size:.82rem; background:var(--panel-2); }
.evidence-side header i { font-style:normal; color:var(--muted); font-size:.74rem; }
.evidence-side.yes header { color:#9fe7c4; }
.evidence-side.no header { color:#ffb5ad; }
.evidence-list { display:flex; flex-wrap:wrap; gap:7px; padding:11px; min-height:64px; align-content:flex-start; }
.evidence-card { position:relative; display:flex; align-items:center; gap:5px;
  padding:7px 9px; border:1px solid var(--line); border-radius:11px; background:var(--panel-2); }
.evidence-card .card-marks { gap:4px; }
.evidence-index { color:var(--muted); font-size:.66rem; font-variant-numeric:tabular-nums; min-width:9px; }
.evidence-empty { margin:0; padding:12px; color:var(--muted); font-size:.78rem; }

.rule-actions { display:flex; gap:9px; justify-content:center; }
.rule-actions .primary { padding:12px 30px; }

/* إعلان القانون */
.declare-list { display:grid; gap:6px; max-height:56vh; overflow:auto; }
.declare-item { display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%;
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--panel);
  color:var(--ink); font:inherit; text-align:right; cursor:pointer; }
.declare-item:hover { border-color:var(--accent); background:var(--panel-2); }
.declare-item.dead { opacity:.4; cursor:not-allowed; text-decoration:line-through; }
.declare-item i { font-style:normal; color:var(--danger); font-size:.72rem; }

/* شاشة النتيجة */
.rule-result { padding:20px; border:1px solid var(--line); border-radius:20px; background:var(--panel); }
.rule-result.won { border-color:#3f7a5c; }
.rule-result.lost { border-color:#7a4a44; }
.result-eyebrow { margin:0 0 4px; color:var(--muted); font-size:.8rem; }
.rule-result h3 { margin:0 0 12px; font-size:1.25rem; line-height:1.4; }
.result-line { margin:0 0 12px; font-size:.9rem; }
.result-score { display:flex; align-items:baseline; gap:10px; padding:13px 16px; margin-bottom:10px;
  border-radius:14px; background:var(--panel-2); }
.result-score span { color:var(--muted); font-size:.8rem; }
.result-score strong { font-size:1.9rem; color:var(--accent); font-variant-numeric:tabular-nums; }
.result-score small { color:var(--muted); font-size:.8rem; }
.result-time { margin:0 0 18px; color:var(--muted); font-size:.8rem; }
.probe-tree { display:grid; gap:5px; margin-bottom:18px; }
.tree-row { display:flex; align-items:center; gap:9px; padding:8px 11px; border-radius:11px; background:var(--panel-2); font-size:.8rem; }
.tree-row.wasted { opacity:.55; }
.tree-index { color:var(--muted); font-variant-numeric:tabular-nums; min-width:16px; }
.tree-verdict { flex:none; padding:2px 9px; border-radius:99px; font-size:.72rem; }
.tree-verdict.yes { color:#9fe7c4; background:#20402f; }
.tree-verdict.no { color:#ffd0c9; background:#4a2a2c; }
.tree-kill { flex:1; color:var(--muted); text-align:left; }
.result-actions { display:flex; gap:9px; }

/* معرض الألعاب: كل لعبة بطاقة */
.game-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px; }
.game-card { display:flex; align-items:center; gap:13px; width:100%; padding:16px;
  border:1px solid var(--line); border-radius:18px; background:var(--panel);
  color:var(--ink); font:inherit; text-align:right; cursor:pointer; }
.game-card:hover { border-color:var(--accent); }
.game-icon { flex:none; display:grid; place-items:center; width:46px; height:46px;
  border-radius:14px; background:var(--panel-2); font-size:1.5rem; }
.game-body { flex:1; min-width:0; display:block; }
.game-body b { display:block; font-size:1rem; }
.game-blurb { display:block; margin-top:3px; color:var(--muted); font-size:.8rem; line-height:1.5; }
.game-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:7px; }
.game-meta i { font-style:normal; color:var(--muted); font-size:.74rem; }
.game-best { color:var(--accent); font-size:.74rem; }
.game-go { flex:none; padding:7px 13px; border-radius:99px; background:var(--panel-2);
  color:var(--accent); font-size:.78rem; }

.game-back { display:flex; align-items:center; gap:8px; margin-bottom:14px; padding:8px 13px;
  border:1px solid var(--line); border-radius:11px; background:transparent; color:var(--muted); font:inherit; cursor:pointer; }
.game-back:hover { border-color:var(--accent); color:var(--ink); }
.game-back small { color:var(--ink); }
.game-back[hidden] { display:none; }
.game-host[hidden] { display:none; }
#games-gallery[hidden] { display:none; }

/* كيف تلعب: بطاقة لكل لعبة بتفتح وبتسكّر */
.how-list { display:grid; gap:10px; }
.how-card { border:1px solid var(--line); border-radius:18px; background:var(--panel); overflow:hidden; }
.how-card > summary { display:flex; align-items:center; gap:12px; padding:15px; cursor:pointer; list-style:none; }
.how-card > summary::-webkit-details-marker { display:none; }
.how-card > summary::after { content:"▾"; margin-right:auto; color:var(--muted); transition:transform .18s; }
.how-card[open] > summary::after { transform:rotate(180deg); }
.how-card > summary b { font-size:1rem; }
.how-card > summary .game-blurb { margin-top:2px; }
.how-card > summary > span:not(.game-icon) { flex:1; min-width:0; }
.how-body { padding:0 16px 16px; }
.how-body h3 { display:none; }
.how-steps { margin:0 0 12px; padding-right:20px; display:grid; gap:9px; font-size:.88rem; line-height:1.6; }
.how-note { margin:12px 0 0; color:var(--muted); font-size:.84rem; line-height:1.7; }
.reduce-motion .how-card > summary::after { transition:none; }

/* سجل الجولات */
.play-log { display:grid; gap:5px; }
.play-row { display:grid; grid-template-columns:1.2fr 1.6fr auto auto; gap:10px; align-items:center;
  padding:9px 12px; border-radius:11px; background:var(--panel-2); font-size:.8rem; }
.play-row.lost { opacity:.6; }
.play-result { color:var(--muted); }
.play-score { color:var(--accent); font-variant-numeric:tabular-nums; }
.play-when { color:var(--muted); font-size:.74rem; }

@media (max-width:700px) {
  .game-gallery { grid-template-columns:1fr; }
  .game-go { display:none; }
  .rule-bar { grid-template-columns:1fr 1fr; }
  .rule-bar div:last-child { grid-column:1 / -1; }
  .cyclers { grid-template-columns:1fr 1fr; }
  .evidence { grid-template-columns:1fr; }
  .play-row { grid-template-columns:1fr auto; }
  .play-row .play-when { display:none; }
  .result-actions { flex-direction:column; }
}

/* ===== ساعة الإيقاف ===== */
.stop-game { display:grid; justify-items:center; gap:14px; padding:10px 0 4px; text-align:center; }
.stop-target { display:flex; align-items:baseline; gap:8px; color:var(--muted); font-size:.9rem; }
.stop-target strong { font-size:2.1rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.stop-face { font-size:clamp(2.6rem, 12vw, 4.6rem); font-weight:bold; font-variant-numeric:tabular-nums;
  letter-spacing:.02em; line-height:1.1; min-height:1.1em; }
.stop-face.covered { color:var(--muted); letter-spacing:.14em; }
.stop-face.done { color:var(--accent); }
.stop-count { font-size:clamp(3.4rem, 18vw, 6rem); font-weight:bold; line-height:1; }
.stop-count.go { color:#7ddba2; }
.stop-count.wait { color:#f2d45f; }
.stop-count.stop { color:var(--danger); }
.stop-btn { min-width:190px; padding:15px 22px; border-radius:16px; border:1px solid var(--line);
  background:var(--panel-2); color:var(--ink); font-family:inherit; font-size:1.05rem; font-weight:bold; cursor:pointer; }
.stop-btn:hover { border-color:var(--accent); }
.stop-btn.go { background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.stop-btn.danger { background:var(--danger); color:#1a0f0d; border-color:transparent; }
.stop-toggle { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.88rem; cursor:pointer; }
.stop-toggle input { width:17px; height:17px; }
.stop-note { margin:0; max-width:34ch; }
.stop-result { display:grid; gap:3px; }
.stop-result strong { font-size:1.2rem; }
.stop-result.good strong { color:var(--accent); }
.stop-result span { color:var(--muted); font-size:.9rem; font-variant-numeric:tabular-nums; }
.stop-result small { color:var(--muted); font-size:.8rem; }
.count-go { color:#7ddba2; }
.count-wait { color:#f2d45f; }
.count-stop { color:var(--danger); }

/* Cups, grid and number games */
.cups-game, .grid-game, .number-game { display:grid; gap:16px; justify-items:center; padding:6px 0 4px; }
.cups-line { margin:0; font-size:1.05rem; font-weight:bold; text-align:center; }
.cups-line small { display:block; margin-top:4px; font-size:.78rem; font-weight:normal; color:var(--muted); }

/* Cups */
/* Shared options panel */
.game-opts { display:grid; gap:12px; width:min(520px,100%); padding:16px; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.opt-row { display:grid; grid-template-columns:1fr auto; gap:10px 14px; align-items:center; }
.opt-head { display:grid; gap:2px; }
.opt-head b { font-size:.92rem; font-weight:bold; }
.opt-head small { color:var(--muted); font-size:.75rem; line-height:1.5; }
.opt-input { display:flex; gap:8px; align-items:center; }
.opt-num .opt-input { width:min(260px,52vw); }
.opt-input input[type="range"] { flex:1; min-width:70px; accent-color:var(--accent); }
.opt-box { width:72px; padding:7px 8px; border:1px solid var(--line); border-radius:10px; background:var(--sunken,var(--panel-2)); color:var(--ink); font:inherit; text-align:center; }
.opt-box:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.opt-unit { color:var(--muted); font-size:.72rem; font-style:normal; white-space:nowrap; }
.opt-chips { grid-template-columns:1fr; }
.opt-chip-row { display:flex; gap:6px; flex-wrap:wrap; }
.opt-chip { padding:7px 12px; border:1px solid var(--line); border-radius:99px; background:var(--panel-2); color:var(--muted); font:inherit; font-size:.8rem; }
.opt-chip.on { background:var(--accent); color:var(--accent-ink); border-color:transparent; font-weight:bold; }
.opt-note { margin:2px 0 0; padding-top:10px; border-top:1px solid var(--line); color:var(--muted); font-size:.78rem; line-height:1.7; }
.cups-ask { display:inline-flex; gap:8px; align-items:center; }
.cups-swatch { width:16px; height:16px; border-radius:99px; box-shadow:0 0 0 2px #0003; }
.cups-board { position:relative; width:min(620px,100%); direction:ltr;
  height:calc(var(--rows) * var(--cup-h, 150px)); }
.cup { position:absolute; top:0; left:0; width:calc(100% / var(--cols)); height:var(--cup-h,150px);
  transform:translate(calc(var(--col) * 100%), calc(var(--row) * 100%));
  transition:transform .3s cubic-bezier(.4,0,.2,1); }
.cup-ball { position:absolute; left:50%; bottom:10px; width:26px; height:26px; margin-left:-13px; border-radius:99px;
  background:var(--ball); box-shadow:0 2px 10px #0006; opacity:0; transition:opacity .2s; }
.cup.open .cup-ball { opacity:1; }
.cup-shell { position:absolute; left:50%; bottom:4px; width:min(74px,84%); height:var(--shell-h,96px);
  border:0; padding:0; cursor:pointer; background:linear-gradient(#5c5470,#332e42);
  border-radius:10px 10px 16px 16px; clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);
  transform:translateX(-50%); transition:transform .25s, opacity .2s; }
.cup-shell:hover { transform:translateX(-50%) translateY(-5px); }
.cup.open .cup-shell { transform:translateX(-50%) translateY(calc(var(--shell-h,96px) * -.66)); }
/* كل ما زادت الأكواب صغّرنا الكوب، حتى تضل الرقعة كلها قدام عينك */
.cups-board[style*="--cols:7"], .cups-board[style*="--cols:8"] { --cup-h:120px; --shell-h:74px; }
.cups-board[style*="--cols:9"], .cups-board[style*="--cols:1"] { --cup-h:104px; --shell-h:62px; }
.cup.dim { opacity:.45; }
.cup.right .cup-shell { background:linear-gradient(#3f7d63,#26533f); }
.cup.wrong .cup-shell { background:linear-gradient(#8a4747,#5a2b2b); }
.cups-track { width:min(420px,100%); height:5px; border-radius:99px; background:var(--panel-2); overflow:hidden; }
.cups-track i { display:block; height:100%; width:0; border-radius:inherit; background:var(--accent); transition:width .2s linear; }
.cups-result, .grid-result, .number-result { display:grid; gap:5px; justify-items:center; text-align:center;
  padding:14px 18px; border:1px solid var(--line); border-radius:16px; background:var(--panel); width:min(420px,100%); }
.cups-result strong, .number-result strong { font-size:1.9rem; }
.cups-result span, .grid-result span, .number-result span { color:var(--muted); font-size:.85rem; }
.cups-result small, .grid-result small, .number-result small { color:var(--muted); font-size:.76rem; }
.cups-result.good, .grid-result.good, .number-result.good { border-color:var(--accent); }

/* Grid */
.grid-top { display:flex; gap:10px; align-items:center; justify-content:center; flex-wrap:wrap; }
.grid-level { font-weight:bold; }
.grid-rule { padding:4px 11px; border-radius:99px; font-size:.78rem; font-weight:bold; background:var(--panel-2); color:var(--ink); }
.grid-rule.back { background:#5aa9ff26; color:#5aa9ff; }
.grid-rule.noRed { background:#ff6b6b26; color:#ff6b6b; }
.grid-rule.backRed { background:#c084fc26; color:#c084fc; }
.grid-rules { display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.grid-board { display:grid; gap:8px; width:min(360px,86vw);
  grid-template-columns:repeat(var(--side),1fr); }
.grid-cell { aspect-ratio:1; border:1px solid var(--line); border-radius:12px; background:var(--panel); transition:.12s; }
.grid-cell:hover { border-color:var(--muted); }
.grid-cell.lit { background:var(--accent); border-color:transparent; transform:scale(1.04); }
.grid-cell.lit.red { background:#ff6b6b; }
.grid-cell.picked { background:var(--panel-2); border-color:var(--accent); }
.grid-cell.bad { background:#ff6b6b; border-color:transparent; }
.grid-note { text-align:center; min-height:1.2em; }
.grid-result strong { font-size:2.4rem; }

/* Number */
.number-goal { display:flex; gap:10px; align-items:center; justify-content:center; flex-wrap:wrap; }
.number-goal span { color:var(--muted); font-size:.9rem; }
.number-goal strong { font-size:2.1rem; color:var(--accent); }
.number-curb { padding:4px 10px; border-radius:99px; background:#ff6b6b22; color:#ff6b6b; font-size:.76rem; font-style:normal; font-weight:bold; }
.number-tiles { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.number-tile { min-width:72px; padding:16px 12px; border:1px solid var(--line); border-radius:16px;
  background:var(--panel); color:var(--ink); font:inherit; font-size:1.3rem; font-weight:bold; transition:.15s; }
.number-tile:hover { border-color:var(--muted); }
.number-tile.on { background:var(--accent); color:var(--accent-ink); border-color:transparent; transform:translateY(-3px); }
.number-ops { display:flex; gap:8px; }
.number-op { width:54px; height:48px; border:1px solid var(--line); border-radius:13px; background:var(--panel); color:var(--ink); font-size:1.25rem; }
.number-op.on { background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.number-op.off { opacity:.3; }
.number-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.number-actions .small-action[disabled] { opacity:.4; }
.number-steps { margin:0; padding:0 22px 0 0; display:grid; gap:6px; width:min(420px,100%); color:var(--muted); font-size:.88rem; }
@media(max-width:620px){
  .cups-board { --cup-h:118px; --shell-h:74px; }
  .opt-row { grid-template-columns:1fr; }
  .opt-num .opt-input { width:100%; }
  .opt-toggle { grid-template-columns:1fr auto; }
  .number-tile { min-width:62px; padding:13px 10px; font-size:1.15rem; }
}

/* Collapsible tuning block (rule game) */
.game-tune { width:min(520px,100%); margin:0 auto 4px; }
.game-tune > summary { cursor:pointer; padding:9px 14px; border:1px solid var(--line); border-radius:14px;
  background:var(--panel); color:var(--muted); font-size:.83rem; list-style:none; }
.game-tune > summary::-webkit-details-marker { display:none; }
.game-tune > summary::after { content:'⌄'; float:left; }
.game-tune[open] > summary { margin-bottom:10px; color:var(--ink); }
.opt-foot { display:grid; gap:6px; justify-items:start; }
.opt-foot .opt-note { border-top:1px solid var(--line); width:100%; }
.opt-foot .link-action { padding:0; font-size:.78rem; }

/* First-time intro card */
.intro-dialog { width:min(420px,calc(100vw - 28px)); }
.intro-body { display:grid; gap:12px; }
.intro-body p { margin:0; line-height:1.8; font-size:.92rem; }
.intro-body p b { color:var(--accent); }
.intro-actions { display:grid; gap:8px; margin-top:4px; }
.intro-actions .primary, .intro-actions .small-action { width:100%; }

/* Calculator: systems, dashboards and the builder */
.calc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:11px; margin-bottom:20px; }
.calc-card { position:relative; display:flex; gap:12px; align-items:flex-start; text-align:right; padding:15px;
  border:1px solid var(--line); border-radius:17px; background:var(--panel); color:var(--ink); font:inherit; }
.calc-card:hover { border-color:var(--accent); }
.calc-icon { font-size:1.5rem; line-height:1; }
.calc-card-body { display:grid; gap:4px; min-width:0; flex:1; }
.calc-card-body b { font-size:1rem; }
.calc-card-body small { color:var(--muted); font-size:.76rem; line-height:1.5; }
.calc-card-value { display:flex; gap:7px; align-items:baseline; margin-top:5px; font-size:1.25rem; font-weight:bold; color:var(--accent); }
.calc-card-value i { font-size:.74rem; font-style:normal; font-weight:normal; color:var(--muted); }
.calc-warn { position:absolute; left:10px; top:10px; min-width:20px; height:20px; border-radius:99px;
  display:grid; place-items:center; background:#ff6b6b22; color:var(--danger); font-size:.7rem; font-weight:bold; }
.preset-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:9px; }
.preset-card { display:grid; gap:4px; text-align:right; padding:13px; border:1px dashed var(--line); border-radius:15px;
  background:transparent; color:var(--ink); font:inherit; }
.preset-card:hover { border-style:solid; border-color:var(--accent); background:var(--panel); }
.preset-card span { font-size:1.2rem; }
.preset-card small { color:var(--muted); font-size:.74rem; line-height:1.5; }
.empty-note { padding:18px; border:1px dashed var(--line); border-radius:16px; color:var(--muted); margin-bottom:18px; }
.empty-note p { margin:0; }

.calc-body { display:grid; gap:15px; }
.calc-big { display:grid; gap:4px; justify-items:center; text-align:center; padding:22px 16px;
  border:1px solid var(--line); border-radius:20px; background:var(--panel); }
.calc-big strong { font-size:2.6rem; line-height:1.1; color:var(--accent); }
.calc-big span { color:var(--muted); font-size:.85rem; }
.calc-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:9px; }
.calc-stat { padding:13px; border:1px solid var(--line); border-radius:14px; background:var(--panel); display:grid; gap:5px; }
.calc-stat span { color:var(--muted); font-size:.76rem; }
.calc-stat strong { font-size:1.2rem; }
.calc-stat small { color:var(--danger); font-size:.72rem; }
.calc-stat.bad { border-color:var(--danger); }
.calc-progress { padding:15px; border:1px solid var(--line); border-radius:17px; background:var(--panel); display:grid; gap:8px; }
.calc-progress-top { display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; }
.calc-progress-top span { color:var(--muted); font-size:.82rem; }
.calc-progress-top b { font-size:1.15rem; }
.calc-progress-top i { font-size:.76rem; font-style:normal; font-weight:normal; color:var(--muted); }
.calc-progress small { color:var(--muted); font-size:.74rem; }
.calc-period { margin:0; }
.calc-actions { display:flex; gap:9px; flex-wrap:wrap; }
.calc-do { display:flex; gap:7px; align-items:center; padding:13px 20px; border:0; border-radius:15px;
  background:var(--accent); color:var(--accent-ink); font:inherit; font-size:1rem; font-weight:bold; }
.calc-do:hover { filter:brightness(1.05); }
.calc-alert { padding:13px 15px; border:1px solid var(--danger); border-radius:15px; background:#ff6b6b12; display:grid; gap:6px; }
.calc-alert b { color:var(--danger); font-size:.86rem; }
.calc-alert ul { margin:0; padding-inline-start:18px; color:var(--muted); font-size:.8rem; display:grid; gap:3px; }
.calc-alert span { color:var(--muted); font-size:.76rem; }
.calc-split { display:grid; gap:7px; }
.split-row { display:grid; grid-template-columns:minmax(80px,1fr) 3fr auto; gap:10px; align-items:center; font-size:.85rem; }
.split-row i { height:8px; border-radius:99px; background:var(--accent); min-width:3px; }
.split-row b { color:var(--muted); font-size:.78rem; font-weight:normal; }

.calc-log { display:grid; gap:8px; }
.log-row { display:flex; gap:12px; justify-content:space-between; padding:12px 14px; border:1px solid var(--line);
  border-radius:14px; background:var(--panel); }
.log-row.bad { border-color:var(--danger); }
.log-main { display:grid; gap:3px; min-width:0; }
.log-main b { font-size:.9rem; }
.log-main span { color:var(--ink); font-size:.82rem; }
.log-main small { color:var(--muted); font-size:.74rem; }
.log-side { display:grid; gap:6px; justify-items:end; text-align:left; }
.log-side time { color:var(--muted); font-size:.72rem; }
.log-tools { display:flex; gap:5px; }
.danger-text { color:var(--danger); }

.build-row { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
.build-row.wide { padding-bottom:10px; border-bottom:1px solid var(--line); }
.build-row code, .name-chips code { padding:3px 7px; border-radius:7px; background:var(--panel-2); color:var(--muted); font-size:.72rem; }
.build-row .setting-input { flex:1; min-width:110px; }
.build-row .setting-input.short, .setting-input.short { flex:none; width:86px; }
.build-row select { padding:8px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--panel-2); font:inherit; font-size:.8rem; }
.build-mini { display:flex; gap:5px; align-items:center; color:var(--muted); font-size:.74rem; }
.build-mini.switch { gap:6px; }
.build-unit { color:var(--muted); font-size:.74rem; }
.build-action { padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--panel); margin-bottom:9px; }
.build-asks { display:flex; gap:6px; align-items:center; flex-wrap:wrap; margin-bottom:9px; color:var(--muted); font-size:.78rem; }
.build-effect { display:flex; gap:7px; align-items:flex-start; margin-bottom:7px; flex-wrap:wrap; }
.build-effect > span { padding-top:9px; color:var(--muted); }
.formula-box { flex:1; min-width:180px; display:grid; gap:3px; }
.formula-box input { width:100%; font-family:ui-monospace,monospace; font-size:.82rem; direction:ltr; text-align:left; }
.formula-box small { font-size:.72rem; }
.formula-box small.ok { color:var(--muted); }
.formula-box small.bad { color:var(--danger); }
.name-chips { display:flex; gap:5px; flex-wrap:wrap; }
.name-chips code.func { color:var(--accent); }
.icon-button.small { width:28px; height:28px; font-size:1rem; }
.run-fields { display:grid; gap:11px; margin-bottom:11px; }
.run-field { display:grid; gap:5px; }
.run-field span { display:flex; gap:7px; align-items:baseline; font-size:.85rem; font-weight:bold; }
.run-field small { color:var(--muted); font-size:.72rem; font-weight:normal; }
@media(max-width:620px){
  .calc-big strong { font-size:2.1rem; }
  .log-row { flex-direction:column; }
  .log-side { justify-items:start; text-align:right; }
}
.calc-more { margin-top:8px; }
.calc-more > summary { cursor:pointer; padding:11px 15px; border:1px dashed var(--line); border-radius:15px;
  color:var(--muted); font-size:.85rem; list-style:none; }
.calc-more > summary::-webkit-details-marker { display:none; }
.calc-more > summary::after { content:'⌄'; float:left; }
.calc-more[open] > summary { margin-bottom:12px; color:var(--ink); border-style:solid; }
.calc-scratch { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:12px; color:var(--muted); font-size:.83rem; }
.chip-insert { padding:4px 9px; border:1px solid var(--line); border-radius:8px; background:var(--panel-2);
  color:var(--muted); font:inherit; font-size:.74rem; font-family:ui-monospace,monospace; direction:ltr; }
.chip-insert:hover { border-color:var(--accent); color:var(--ink); }
.chip-insert.func { color:var(--accent); }
.run-two { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:11px; }
@media(max-width:520px){ .run-two { grid-template-columns:1fr; } }

/* ===== «جرّب»: اقتراحات العادات ===== */

/* نقطة على لسان التبويب: إشارة صامتة إنو في دفعة جديدة، بلا تنبيه ولا عدّاد */
.tab-dot { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:99px;
  background:var(--accent); vertical-align:middle; }

.suggest-list { display:grid; gap:11px; }
.suggest-card { display:grid; gap:7px; padding:15px 16px; border:1px solid var(--line);
  border-radius:17px; background:var(--panel); }
.suggest-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.suggest-src { padding:4px 11px; border:1px solid var(--line); border-radius:99px;
  background:var(--panel-2); color:var(--muted); font:inherit; font-size:.73rem; cursor:pointer; }
.suggest-src:hover { color:var(--accent); border-color:var(--accent); }
.suggest-mins { color:var(--muted); font-size:.73rem; }
.suggest-text { font-size:1rem; line-height:1.5; }
.suggest-why { margin:0; color:var(--muted); font-size:.83rem; line-height:1.6; }
.suggest-actions { display:flex; gap:9px; margin-top:4px; }
.suggest-actions button { padding:10px 14px; border-radius:12px; font:inherit;
  font-size:.86rem; cursor:pointer; border:1px solid var(--line); }
.suggest-no { flex:none; background:var(--panel-2); color:var(--muted); }
.suggest-no:hover { color:var(--danger); border-color:var(--danger); }
.suggest-yes { flex:1; background:var(--accent); color:var(--accent-ink); border-color:transparent; font-weight:600; }
.suggest-yes:hover { filter:brightness(1.06); }

.suggest-bar { display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.suggest-foot { color:var(--muted); font-size:.78rem; }

.suggest-dialog-text { margin:0 0 6px; font-size:1.02rem; line-height:1.5; }
.suggest-dialog-why { margin:0 0 16px; color:var(--muted); font-size:.85rem; line-height:1.6; }

@media (max-width:620px) {
  .suggest-bar { flex-direction:column; align-items:stretch; }
  .suggest-bar .small-action { width:100%; }
}

/* قواعد display بتغلب [hidden]، فمنرجّعها صراحةً للعناصر اللي منخبّيها بالجافاسكربت */
.chip-bar[hidden], .inline-add[hidden] { display:none; }

/* سطر الأمر بلوحة الأوامر: بيبان إنو هاد تنفيذ مو مجرّد فتح صفحة */
.palette-item.is-command { background:color-mix(in srgb, var(--accent) 9%, transparent); }
.palette-item.is-command:hover, .palette-item.is-command.active { background:color-mix(in srgb, var(--accent) 16%, transparent); }
.palette-item.is-command .palette-label { font-weight:600; max-width:50%; }
.palette-run { flex:none; padding:2px 8px; border:1px solid var(--line); border-radius:7px;
  color:var(--muted); font-size:.68rem; }

/* مدخل شريط الأوامر بالقائمة الجانبية */
.command-open { margin-bottom:8px; }
.command-open .kbd { padding:2px 7px; border:1px solid var(--line); border-radius:7px;
  color:var(--muted); font-size:.68rem; letter-spacing:.02em; }

/* ===== الدفتر ===== */

.nb-tabs { margin-bottom:16px; }

.day-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px; }
.day-head h3 { margin:2px 0 0; font-size:1.15rem; }
.day-nav { display:flex; gap:6px; }
.day-nav .small-action { min-width:38px; }

.note-area { width:100%; min-height:320px; padding:16px 18px; border:1px solid var(--line);
  border-radius:16px; background:var(--panel); color:var(--ink); font:inherit; font-size:.95rem;
  line-height:1.85; resize:vertical; }
.note-area:focus { outline:none; border-color:var(--accent); }
.note-area::placeholder { color:var(--muted); line-height:1.7; }
body[data-note-font="big"] .note-area { font-size:1.08rem; line-height:1.95; }

.note-foot { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 2px 14px; }
.note-count { color:var(--muted); font-size:.78rem; }
.note-foot .small-action:first-of-type { margin-right:auto; }
.danger-text { color:var(--danger); }

.note-title-wrap { margin-bottom:10px; }
#note-title { width:100%; padding:12px 16px; border:1px solid var(--line); border-radius:14px;
  background:var(--panel); color:var(--ink); font:inherit; font-size:1.05rem; font-weight:600; }
#note-title:focus { outline:none; border-color:var(--accent); }

.note-side { margin-bottom:12px; }
.note-side-name { margin:0 2px 7px; color:var(--muted); font-size:.75rem; }
.note-side .chip.ghost { border-style:dashed; color:var(--muted); }
.note-side .chip.ghost b { color:var(--accent); font-weight:400; font-size:.7rem; }

.note-checks { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.note-checks li { display:flex; align-items:center; gap:9px; font-size:.87rem; }
.note-checks li.done span { color:var(--muted); text-decoration:line-through; }
.note-checks button { flex:none; width:20px; height:20px; border:1px solid var(--line); border-radius:6px;
  background:var(--panel-2); color:var(--accent); font-size:.72rem; cursor:pointer; }

#note-search { width:100%; margin-bottom:12px; }

.note-list { display:grid; gap:10px; }
.note-row { padding:14px 16px; border:1px solid var(--line); border-radius:15px; background:var(--panel); cursor:pointer; }
.note-row:hover { border-color:var(--accent); }
.note-row.pinned { box-shadow:inset 3px 0 0 var(--accent); }
.note-row-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.note-row-head strong { font-size:.97rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.note-row-head span { flex:none; color:var(--muted); font-size:.74rem; }
.note-preview { margin:6px 0 0; color:var(--muted); font-size:.83rem; line-height:1.6;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.note-row-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.note-row-meta i { font-style:normal; color:var(--muted); font-size:.72rem; }
.note-row-meta b { color:var(--accent); font-size:.72rem; font-weight:400; }
.note-pin-flag { opacity:.8; }

@media (max-width:620px) {
  .day-head { flex-direction:column; align-items:stretch; }
  .day-nav { justify-content:space-between; }
  .note-area { min-height:260px; padding:14px; }
}

/* ===== الرجوع بالزمن ===== */

.storage-note { display:block; margin-top:6px; color:var(--muted); font-size:.74rem; line-height:1.6; }

.snap-card { padding:14px 16px; margin-bottom:10px; border:1px solid var(--line);
  border-radius:15px; background:var(--panel); }
.snap-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.snap-card-head strong { display:block; font-size:.97rem; }
.snap-card-head span { color:var(--muted); font-size:.75rem; }
.snap-card-actions { display:flex; gap:7px; }
.snap-card-actions .primary { padding:7px 14px; font-size:.82rem; border-radius:10px; }
.snap-diff { margin:9px 0 0; color:var(--accent); font-size:.8rem; }
.snap-counts { display:flex; flex-wrap:wrap; gap:9px; margin:7px 0 0; }
.snap-counts i { font-style:normal; color:var(--muted); font-size:.73rem; }

.history-foot { display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }

@media (max-width:620px) {
  .snap-card-head { flex-direction:column; align-items:stretch; }
  .snap-card-actions { justify-content:stretch; }
  .snap-card-actions button { flex:1; }
  .history-foot { flex-direction:column; align-items:stretch; }
}

/* ===== أعمالي ===== */

.work-tabs { margin-bottom:14px; }
#work-search { width:100%; margin-bottom:10px; }
#work-filters { margin-bottom:16px; }
#work-filters .chip-bar:empty { display:none; }

.work-grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fill, minmax(258px, 1fr)); }
body[data-work-card="big"] .work-grid { grid-template-columns:repeat(auto-fill, minmax(340px, 1fr)); }
.work-grid .load-more { grid-column:1 / -1; }

.work-card { display:flex; flex-direction:column; border:1px solid var(--line); border-radius:17px;
  background:var(--panel); overflow:hidden; text-align:right; cursor:pointer; }
.work-card:hover { border-color:var(--accent); }
.work-card.pinned { box-shadow:inset 0 3px 0 var(--accent); }

.work-cover { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; background:var(--panel-2); }
.work-cover.blank { display:grid; place-items:center; font-size:2rem;
  background:linear-gradient(140deg, color-mix(in srgb, var(--tone) 26%, var(--panel-2)), var(--panel-2)); }
.work-cover.big { aspect-ratio:16/7; border-radius:16px; margin-bottom:18px; }

.work-card-body { display:flex; flex-direction:column; gap:5px; padding:14px 15px 16px; }
.work-card-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.work-kind { padding:3px 9px; border-radius:99px; font-size:.72rem;
  background:color-mix(in srgb, var(--tone) 20%, transparent); color:var(--ink); }
.work-state { font-size:.72rem; color:var(--muted); }
.work-state.soon { color:var(--accent); }
.work-state.over { color:var(--danger); }
.work-card-body strong { font-size:1rem; line-height:1.45; }
.work-client { color:var(--muted); font-size:.79rem; }
.work-summary { margin:3px 0 0; color:var(--muted); font-size:.83rem; line-height:1.6;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.work-card-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.work-card-meta i { font-style:normal; color:var(--muted); font-size:.72rem; }
.work-card-meta b { color:var(--accent); font-size:.72rem; font-weight:400; }

.work-year { margin-bottom:22px; }
.work-year-head { display:flex; align-items:baseline; gap:10px; margin-bottom:9px;
  padding-bottom:7px; border-bottom:1px solid var(--line); }
.work-year-head strong { font-size:1.1rem; font-variant-numeric:tabular-nums; }
.work-year-head span { color:var(--muted); font-size:.76rem; }
.work-year-list { display:grid; gap:5px; }
.work-line { display:flex; align-items:center; gap:10px; width:100%; padding:9px 12px;
  border:1px solid transparent; border-radius:11px; background:var(--panel);
  color:var(--ink); font:inherit; text-align:right; cursor:pointer; }
.work-line:hover { border-color:var(--accent); }
.work-line i { flex:none; width:8px; height:8px; border-radius:99px; }
.work-line-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.92rem; }
.work-line-meta { flex:none; color:var(--muted); font-size:.76rem; }
.work-line-span { flex:none; min-width:60px; color:var(--muted); font-size:.73rem; text-align:left; }

.work-detail-head h2 { margin:6px 0 4px; font-size:1.5rem; line-height:1.35; }
.work-detail-head .eyebrow { display:flex; align-items:center; gap:8px; }
.work-detail-client { margin:0; color:var(--muted); font-size:.9rem; }
.work-facts { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:9px; margin:16px 0; }
.work-facts div { padding:12px 14px; border:1px solid var(--line); border-radius:13px; background:var(--panel); }
.work-facts span { display:block; color:var(--muted); font-size:.73rem; }
.work-facts strong { display:block; margin-top:4px; font-size:.95rem; }
.work-facts a { color:var(--accent); }
.work-detail-summary { margin:0 0 14px; font-size:1rem; line-height:1.75; }
.work-detail-tools { margin-bottom:14px; }
.work-body { padding:16px 18px; border:1px solid var(--line); border-radius:15px;
  background:var(--panel); font-size:.93rem; line-height:1.85; margin-bottom:14px; }
.work-detail-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }

.work-body-area { min-height:150px; }
.kind-pick { display:grid; gap:3px; padding:11px 8px; border:1px solid var(--line); border-radius:13px;
  background:transparent; color:var(--ink); text-align:center; font:inherit; cursor:pointer; }
.kind-pick span { font-size:1.2rem; }
.kind-pick b { font-size:.8rem; font-weight:500; }
.kind-pick:hover { border-color:var(--accent); }
.kind-pick.on { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent);
  background:color-mix(in srgb, var(--tone) 16%, var(--panel-2)); }

.cover-block { margin-top:14px; }
.cover-slot { position:relative; margin-top:8px; border:1px dashed var(--line); border-radius:14px;
  overflow:hidden; min-height:96px; display:grid; place-items:center; background:var(--panel-2); }
.cover-slot img { display:block; width:100%; max-height:260px; object-fit:cover; }
.cover-hint { margin:0; padding:22px 16px; color:var(--muted); font-size:.8rem; text-align:center; }
.cover-drop { position:absolute; top:8px; left:8px; width:28px; height:28px; border:0; border-radius:99px;
  background:rgba(0,0,0,.6); color:#fff; font-size:1rem; cursor:pointer; }

@media (max-width:620px) {
  .work-grid { grid-template-columns:1fr; }
  body[data-work-card="big"] .work-grid { grid-template-columns:1fr; }
  .work-line-meta { display:none; }
  .work-detail-actions button { flex:1; }
}

/* ===== الناس ===== */

.people-tabs { margin-bottom:14px; }
#person-search { width:100%; margin-bottom:10px; }

.people-list, .due-block { display:grid; gap:9px; }
.due-block { margin-bottom:22px; }
.due-head { display:flex; align-items:baseline; gap:10px; margin-bottom:9px;
  padding-bottom:7px; border-bottom:1px solid var(--line); }
.due-head strong { font-size:1rem; }
.due-head i, .due-head span { font-style:normal; color:var(--muted); font-size:.76rem; }

.person-row { display:flex; align-items:center; gap:12px; padding:12px 14px;
  border:1px solid var(--line); border-radius:15px; background:var(--panel); cursor:pointer; text-align:right; }
.person-row:hover { border-color:var(--accent); }
.person-face { flex:none; display:grid; place-items:center; width:42px; height:42px; border-radius:99px;
  background:color-mix(in srgb, var(--tone) 28%, var(--panel-2)); color:var(--ink);
  font-size:.88rem; font-weight:600; }
.person-face.big { width:62px; height:62px; font-size:1.2rem; }
.person-body { flex:1; min-width:0; }
.person-top { display:flex; align-items:baseline; gap:9px; }
.person-top strong { font-size:.98rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.person-cadence { flex:none; color:var(--muted); font-size:.72rem; }
.person-sub { display:block; margin-top:2px; color:var(--muted); font-size:.79rem; }
.person-due { margin:5px 0 0; color:var(--muted); font-size:.8rem; }
.person-due.late { color:var(--accent); }
.person-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.person-meta b { color:var(--accent); font-size:.72rem; font-weight:400; }
.person-meta i { font-style:normal; font-size:.72rem; color:var(--muted); }
.person-meta i.owed { color:#57d5a6; }
.person-meta i.owing { color:var(--danger); }
.person-touch { flex:none; padding:7px 13px; border:1px solid var(--line); border-radius:99px;
  background:var(--panel-2); color:var(--accent); font:inherit; font-size:.78rem; cursor:pointer; }
.person-touch:hover { border-color:var(--accent); }

.person-head { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.person-head h2 { margin:0 0 3px; font-size:1.45rem; }
.person-detail-sub { margin:0; color:var(--muted); font-size:.85rem; }
.person-how { margin:0 0 14px; font-size:.95rem; line-height:1.7; }
.person-facts { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:9px; margin-bottom:14px; }
.person-facts div { padding:11px 13px; border:1px solid var(--line); border-radius:13px; background:var(--panel); }
.person-facts span { display:block; color:var(--muted); font-size:.72rem; }
.person-facts strong { display:block; margin-top:4px; font-size:.9rem; }
.person-contact { display:flex; flex-wrap:wrap; gap:9px; margin-bottom:14px; }
.person-contact span { padding:6px 12px; border:1px solid var(--line); border-radius:99px;
  background:var(--panel-2); font-size:.8rem; direction:ltr; unicode-bidi:isolate; }

.person-debts, .person-log { margin-top:18px; }
.person-debt-line { margin:0 0 5px; font-size:.9rem; }
.person-debt-line.owed { color:#57d5a6; }
.person-debt-line.owing { color:var(--danger); }
.person-debt-list { list-style:none; margin:9px 0 11px; padding:0; display:grid; gap:5px; }
.person-debt-list li { display:flex; justify-content:space-between; gap:12px; font-size:.83rem; }
.person-debt-list span { color:var(--muted); }

.touch-add { display:grid; grid-template-columns:auto 1fr auto; gap:8px; margin:10px 0 12px; }
.touch-add .primary { padding:9px 16px; border-radius:11px; font-size:.85rem; }
.touch-list { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.touch-list li { display:flex; align-items:center; gap:10px; padding:9px 12px;
  border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.touch-icon { flex:none; }
.touch-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.touch-body b { font-size:.85rem; font-weight:500; }
.touch-body span { color:var(--muted); font-size:.79rem; }
.touch-date { flex:none; color:var(--muted); font-size:.74rem; }
.person-note-area { min-height:110px; }

/* ===== الطريق ===== */

.trip-grid { display:grid; gap:14px; grid-template-columns:repeat(auto-fill, minmax(268px,1fr)); }
.trip-card { display:flex; flex-direction:column; gap:4px; padding:15px 16px;
  border:1px solid var(--line); border-radius:17px; background:var(--panel); cursor:pointer; text-align:right; }
.trip-card:hover { border-color:var(--accent); }
.trip-card.live { box-shadow:inset 0 3px 0 var(--accent); }
.trip-card.done { opacity:.72; }
.trip-card-top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; }
.trip-purpose { padding:3px 10px; border-radius:99px; font-size:.72rem;
  background:color-mix(in srgb, var(--tone) 22%, transparent); }
.trip-status { font-size:.72rem; color:var(--muted); }
.trip-status.live { color:var(--accent); }
.trip-card strong { font-size:1.05rem; }
.trip-sub { color:var(--muted); font-size:.79rem; }
.trip-when { margin:4px 0 0; color:var(--muted); font-size:.83rem; }
.trip-card-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.trip-card-meta i { font-style:normal; color:var(--muted); font-size:.72rem; }
.trip-card-meta b { color:var(--accent); font-size:.72rem; font-weight:400; }
.trip-card-meta b.trip-warn { color:var(--danger); }

.trip-head h2 { margin:5px 0 3px; font-size:1.5rem; }
.trip-head .eyebrow { display:flex; align-items:center; gap:8px; }
.trip-detail-dates { margin:0; color:var(--muted); font-size:.85rem; }
.trip-tabs { margin:16px 0 14px; }

.paper-check { margin-bottom:20px; }
.paper-check-line { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; margin:0 0 6px;
  padding:10px 13px; border:1px solid var(--line); border-radius:12px; background:var(--panel); font-size:.85rem; }
.paper-check-line.over { border-color:var(--danger); }
.paper-check-line.soon { border-color:var(--accent); }
.paper-check-line span { flex:1; color:var(--muted); font-size:.8rem; }
.paper-check-line small { color:var(--muted); font-size:.74rem; }

.booking-block { margin-bottom:18px; }
.booking-list { list-style:none; margin:0 0 10px; padding:0; display:grid; gap:6px; }
.booking-row { display:flex; align-items:center; gap:9px; padding:10px 12px;
  border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.booking-icon { flex:none; }
.booking-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.booking-body b { font-size:.88rem; font-weight:500; }
.booking-body span { color:var(--muted); font-size:.76rem; }
.booking-cost { flex:none; color:var(--accent); font-size:.78rem; }
.booking-cost.paid { color:var(--muted); }

.bag-head { display:flex; align-items:center; gap:12px; margin-bottom:12px; color:var(--muted); font-size:.82rem; }
.bag-head .meter { flex:1; }
.inline-add.bag-add { grid-template-columns:1fr auto; margin-bottom:10px; }
.bag-packs { margin-bottom:14px; }
.bag-list { list-style:none; margin:0 0 12px; padding:0; display:grid; gap:5px; }
.bag-list li { display:flex; align-items:center; gap:10px; padding:9px 12px;
  border:1px solid var(--line); border-radius:11px; background:var(--panel); font-size:.88rem; }
.bag-list li.done span { color:var(--muted); text-decoration:line-through; }
.bag-list li span { flex:1; }
.bag-check { flex:none; width:21px; height:21px; border:1px solid var(--line); border-radius:6px;
  background:var(--panel-2); color:var(--accent); font-size:.72rem; cursor:pointer; }

.inline-add.spend-add { grid-template-columns:110px 1fr auto auto; margin-bottom:6px; }
.trip-tx-list { list-style:none; margin:14px 0 10px; padding:0; display:grid; gap:5px; }
.trip-tx-list li { display:flex; align-items:baseline; gap:10px; padding:9px 12px;
  border:1px solid var(--line); border-radius:11px; background:var(--panel); font-size:.85rem; }
.trip-tx-list span { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.trip-tx-list small { color:var(--muted); font-size:.74rem; }
.trip-tx-list b { direction:ltr; unicode-bidi:isolate; }
.trip-tx-list b.up { color:#57d5a6; }

@media (max-width:620px) {
  .trip-grid { grid-template-columns:1fr; }
  .touch-add { grid-template-columns:1fr; }
  .inline-add.spend-add { grid-template-columns:1fr 1fr; }
  .inline-add.spend-add .primary, .inline-add.spend-add select { grid-column:1 / -1; }
  .person-row { flex-wrap:wrap; }
  .person-touch { width:100%; }
  .paper-check-line { flex-direction:column; gap:3px; }
}

/* ===== تقويم اليوم ===== */

.cal-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.cal-nav { display:flex; align-items:center; gap:10px; }
.cal-nav strong { min-width:130px; text-align:center; font-size:1rem; }
.cal-nav .small-action { min-width:38px; }

.cal-grid { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:5px; margin-bottom:18px; }
.cal-weekday { padding:4px 2px 7px; color:var(--muted); font-size:.73rem; text-align:center; }
.cal-cell { display:flex; flex-direction:column; gap:3px; min-height:104px; padding:6px 6px 7px;
  border:1px solid var(--line); border-radius:11px; background:var(--panel);
  color:var(--ink); font:inherit; text-align:right; cursor:pointer; overflow:hidden; position:relative; }
.cal-cell:hover { border-color:var(--accent); }
.cal-cell.outside { opacity:.42; }
.cal-cell.today { border-color:var(--accent); }
.cal-cell.today .cal-num { color:var(--accent-ink); background:var(--accent); }
.cal-cell.picked { box-shadow:0 0 0 1px var(--accent); background:var(--panel-2); }
.cal-num { align-self:flex-start; min-width:21px; padding:1px 5px; border-radius:7px;
  font-size:.76rem; font-variant-numeric:tabular-nums; text-align:center; }
.cal-chip { display:block; padding:2px 6px; border-radius:6px; background:var(--panel-2);
  color:var(--ink); font-size:.68rem; line-height:1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cal-chip i { font-style:normal; color:var(--muted); margin-left:4px; }
.cal-chip.done { color:var(--muted); text-decoration:line-through; }
.cal-chip.late { color:var(--danger); }
.cal-more { color:var(--muted); font-size:.66rem; padding-right:2px; }
.cal-count { position:absolute; top:6px; left:6px; min-width:17px; height:17px; padding:0 4px;
  border-radius:99px; background:var(--panel-2); color:var(--muted);
  font-size:.64rem; line-height:17px; text-align:center; }
#cal-day-view:not(:empty) { margin-bottom:18px; }

@media (max-width:760px) {
  .cal-grid { gap:3px; }
  .cal-cell { min-height:74px; padding:4px; }
  .cal-chip { font-size:.62rem; padding:1px 4px; }
  .cal-chip i { display:none; }
  .cal-more, .cal-count { display:none; }
  .cal-nav strong { min-width:92px; font-size:.88rem; }
}
@media (max-width:420px) {
  .cal-cell { min-height:58px; }
  .cal-chip { height:5px; padding:0; border-radius:99px; background:var(--accent); text-indent:-999px; }
  .cal-chip.done { background:var(--line); }
  .cal-chip.late { background:var(--danger); }
}

/* ===== تكرار المهمة ===== */

.repeat-every-row { display:flex; align-items:center; gap:9px; margin-bottom:12px; font-size:.88rem; }
.repeat-every-row input { width:76px; padding:8px 10px; border:1px solid var(--line); border-radius:10px;
  background:var(--field); color:var(--ink); font:inherit; }
.repeat-picks { margin-bottom:14px; }
.repeat-picks-name { display:block; margin-bottom:7px; color:var(--muted); font-size:.8rem; }
.day-picks { display:flex; flex-wrap:wrap; gap:6px; }
.day-picks.month-picks { display:grid; grid-template-columns:repeat(10, 1fr); gap:5px; }
.day-pick { padding:7px 12px; border:1px solid var(--line); border-radius:9px;
  background:var(--panel-2); color:var(--ink); font:inherit; font-size:.8rem; cursor:pointer; }
.month-picks .day-pick { padding:7px 0; text-align:center; font-variant-numeric:tabular-nums; }
.day-pick:hover { border-color:var(--accent); }
.day-pick.on { border-color:var(--accent); background:var(--accent); color:var(--accent-ink); }
.repeat-preview { margin:10px 0 0; color:var(--accent); font-size:.83rem; }

@media (max-width:620px) {
  .day-picks.month-picks { grid-template-columns:repeat(7, 1fr); }
}

/* حقل دورة التجديد المخصصة */
.paper-cycle-row { display:flex; align-items:center; gap:9px; margin-bottom:10px; font-size:.85rem; }
.paper-cycle-row input { width:92px; padding:9px 11px; border:1px solid var(--line); border-radius:10px;
  background:var(--field); color:var(--ink); font:inherit; }
#doc-cycle-wrap input { width:100%; }

/* ===== الرف ===== */

#shelf-search, #stuff-search { width:100%; margin-bottom:10px; }
.shelf-list, .stuff-list { display:grid; gap:10px; }

.shelf-card, .thing-card { display:flex; align-items:flex-start; gap:12px; padding:13px 15px;
  border:1px solid var(--line); border-radius:15px; background:var(--panel); cursor:pointer; text-align:right; }
.shelf-card:hover, .thing-card:hover { border-color:var(--accent); }
.shelf-card.doing { box-shadow:inset 3px 0 0 var(--accent); }
.shelf-card.done, .shelf-card.quit { opacity:.72; }

.shelf-icon, .thing-icon { flex:none; display:grid; place-items:center; width:40px; height:40px;
  border-radius:12px; font-size:1.25rem;
  background:color-mix(in srgb, var(--tone) 22%, var(--panel-2)); }
.shelf-icon.big, .thing-icon.big { width:58px; height:58px; font-size:1.7rem; border-radius:16px; }

.shelf-body, .thing-body { flex:1; min-width:0; }
.shelf-top, .thing-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.shelf-top strong, .thing-top strong { font-size:.97rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shelf-author, .thing-sub { display:block; margin-top:2px; color:var(--muted); font-size:.79rem; }
.shelf-state, .thing-state { flex:none; font-size:.72rem; color:var(--muted); }
.shelf-state.doing { color:var(--accent); }
.thing-state.over { color:var(--danger); }
.thing-state.soon { color:var(--accent); }
.shelf-body .meter, .shelf-detail .meter { margin-top:8px; }
.shelf-meta, .thing-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:7px; }
.shelf-meta i, .thing-meta i { font-style:normal; color:var(--muted); font-size:.72rem; }
.shelf-meta b, .thing-meta b { color:var(--accent); font-size:.72rem; font-weight:400; }
.thing-meta b.warranty.over { color:var(--danger); }
.thing-meta b.warranty.soon { color:var(--accent); }

.shelf-head, .thing-head { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.shelf-head h2, .thing-head h2 { margin:5px 0 3px; font-size:1.4rem; line-height:1.35; }
.shelf-detail-sub, .thing-detail-sub { margin:0; color:var(--muted); font-size:.87rem; }
.shelf-status, .thing-status { margin-bottom:16px; }
.shelf-status-btn { flex:1; padding:9px 6px; border:0; background:transparent; color:var(--muted);
  font:inherit; font-size:.83rem; border-radius:10px; cursor:pointer; }
.shelf-status-btn.active { background:var(--panel-2); color:var(--ink); box-shadow:inset 0 0 0 1px var(--accent); }

.inline-add.shelf-progress { grid-template-columns:1fr auto auto; align-items:center; gap:9px; margin:14px 0; }
.shelf-of { color:var(--muted); font-size:.8rem; }

.quote-block { margin-top:20px; }
.quote-add { display:grid; grid-template-columns:80px 1fr auto; gap:8px; margin:10px 0 12px; }
.quote-add .primary { padding:9px 15px; border-radius:11px; font-size:.84rem; }
.quote-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.quote-list li { padding:12px 14px; border:1px solid var(--line); border-radius:13px; background:var(--panel); }
.quote-list p { margin:0 0 7px; font-size:.9rem; line-height:1.75; }
.quote-foot { display:flex; align-items:center; justify-content:space-between; gap:10px;
  color:var(--muted); font-size:.73rem; }

/* ===== الجرد ===== */

.stuff-summary { margin-top:22px; }
.serial { direction:ltr; unicode-bidi:isolate; font-size:.85rem; }

.warranty-block { margin:18px 0; padding:14px 16px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.warranty-block.over { border-color:var(--danger); }
.warranty-block.soon { border-color:var(--accent); }
.warranty-line { margin:9px 0 11px; font-size:.9rem; }
.warranty-actions { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:10px; }
.warranty-actions .primary { padding:9px 16px; border-radius:11px; font-size:.85rem; }
.warranty-months { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.82rem; }
.warranty-months input { width:74px; padding:8px 10px; border:1px solid var(--line); border-radius:9px;
  background:var(--field); color:var(--ink); font:inherit; }

@media (max-width:620px) {
  .quote-add { grid-template-columns:1fr; }
  .inline-add.shelf-progress { grid-template-columns:1fr; }
  .shelf-status-btn { font-size:.76rem; padding:8px 3px; }
  .warranty-actions { flex-direction:column; align-items:stretch; }
}

/* ===== المنهاج ===== */

.course-page { position:relative; }

.course-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:11px; }
.course-card { display:grid; gap:9px; padding:16px; border:1px solid var(--line); border-radius:16px;
  background:var(--panel); text-align:right; cursor:pointer; }
.course-card:hover { border-color:var(--accent); }
.course-card-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.course-card-top strong { font-size:1.05rem; line-height:1.35; overflow-wrap:anywhere; }
.course-card-top span { flex:none; color:var(--muted); font-size:.76rem; }
.course-about { margin:0; color:var(--muted); font-size:.85rem; line-height:1.6;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.course-card-meta { display:flex; flex-wrap:wrap; gap:7px; }
.course-card-meta i, .course-card-meta b { font-style:normal; font-weight:500; padding:3px 8px;
  border-radius:99px; background:var(--panel-2); color:var(--muted); font-size:.72rem; }
.course-card-meta b { color:var(--accent-ink); background:var(--accent); }

.course-head { margin-bottom:14px; }
.course-head h2 { margin:5px 0 3px; font-size:1.4rem; line-height:1.35; }
.course-detail-sub { margin:0; color:var(--muted); font-size:.87rem; }

.unit-head { display:flex; align-items:center; gap:8px; margin:14px 0 11px; }
.unit-head input { padding:10px 12px; font-weight:bold; }
.unit-actions { display:flex; flex:none; gap:5px; }

.block-list { display:grid; gap:9px; }
.block-row { display:flex; align-items:center; gap:11px; padding:13px 14px;
  border:1px solid var(--line); border-radius:15px; background:var(--panel);
  text-align:right; cursor:pointer; }
.block-row:hover { border-color:var(--accent); }
.block-icon { flex:none; display:grid; place-items:center; width:38px; height:38px; border-radius:12px;
  font-size:1.15rem; background:color-mix(in srgb, var(--tone) 22%, var(--panel-2)); }
.block-body { flex:1; min-width:0; display:grid; gap:4px; }
.block-body strong { line-height:1.35; overflow-wrap:anywhere; }
.block-body span { color:var(--muted); font-size:.78rem; overflow-wrap:anywhere; }
.block-actions { display:flex; flex:none; gap:5px; }
.block-add { margin-top:12px; }
.block-tag { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:99px;
  background:color-mix(in srgb, var(--tone) 22%, var(--panel-2)); color:var(--ink); font-size:.76rem; }

.doc-edit { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
.doc-area { min-height:340px; font-size:.92rem; line-height:1.8; }
.doc-preview { min-height:340px; padding:16px 18px; border:1px solid var(--line); border-radius:15px;
  background:var(--panel); font-size:.93rem; line-height:1.85; overflow-wrap:anywhere; }
.doc-preview h3 { margin:16px 0 8px; font-size:1.08rem; }
.doc-preview h4 { margin:14px 0 7px; font-size:.96rem; color:var(--muted); }
.doc-preview p { margin:0 0 10px; }
.doc-preview ul { margin:0 0 11px; padding-inline-start:20px; }
.doc-preview li { margin-bottom:5px; }
.doc-preview code { padding:2px 6px; border-radius:6px; background:var(--panel-2); font-size:.85em; }
.doc-preview pre { margin:0 0 12px; padding:13px 15px; border-radius:12px; background:var(--field);
  overflow-x:auto; direction:ltr; text-align:left; }
.doc-preview pre code { padding:0; background:transparent; }

.video-form { margin-bottom:14px; }
.video-note { min-height:110px; }
.video-open { display:inline-block; text-decoration:none; padding:11px 20px; border-radius:12px; }

.bank-head { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin:16px 0 12px; }
.bank-head > span { font-weight:bold; }
.bank-head i { font-style:normal; padding:3px 9px; border-radius:99px; background:var(--panel-2);
  color:var(--muted); font-size:.73rem; }
.bank-head .primary { margin-inline-start:auto; padding:9px 16px; border-radius:11px; font-size:.85rem; }

.q-list { display:grid; gap:9px; }
.q-row { display:flex; align-items:flex-start; gap:11px; padding:13px 14px;
  border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.q-row.right { border-color:#57d5a6; }
.q-row.wrong { border-color:var(--danger); }
.q-num { flex:none; display:grid; place-items:center; width:28px; height:28px; border-radius:9px;
  background:var(--panel-2); color:var(--muted); font-size:.8rem; }
.q-body { flex:1; min-width:0; display:grid; gap:6px; }
.q-body strong { line-height:1.6; overflow-wrap:anywhere; }
.q-meta { display:flex; flex-wrap:wrap; gap:6px; }
.q-meta i, .q-meta b { font-style:normal; font-weight:500; color:var(--muted); font-size:.71rem; }
.q-meta i + i::before { content:"· "; opacity:.6; }
.q-meta b { color:var(--accent); }
.q-answer { margin:0; color:var(--muted); font-size:.83rem; line-height:1.6; overflow-wrap:anywhere; }
.q-explain { margin:0; color:var(--muted); font-size:.8rem; line-height:1.7; }

.quiz-setup { padding:15px 16px; border:1px solid var(--line); border-radius:16px; background:var(--panel); }
.quiz-start { display:flex; align-items:center; justify-content:space-between; gap:11px; margin-top:13px; }
.quiz-start span { color:var(--muted); font-size:.85rem; }
.quiz-start .primary { padding:11px 22px; border-radius:12px; }
.quiz-start .primary[disabled] { opacity:.45; }
.quiz-history { margin-top:22px; }
.switch-inline { display:flex; align-items:center; gap:9px; font-weight:normal; font-size:.87rem; }
.switch-inline input { flex:none; width:18px; height:18px; accent-color:var(--accent); }

.run-head { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.run-head > span { flex:none; color:var(--muted); font-size:.83rem; }
.run-head .meter { flex:1; }
.run-card { padding:20px; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.run-type { margin:0 0 9px; color:var(--muted); font-size:.75rem; }
.run-text { margin:0 0 16px; font-size:1.15rem; line-height:1.7; overflow-wrap:anywhere; }
.q-options { display:grid; gap:8px; }
.q-option { display:flex; align-items:center; gap:10px; padding:12px 14px; border:1px solid var(--line);
  border-radius:13px; background:var(--field); font-weight:normal; margin:0; cursor:pointer; }
.q-option:hover { border-color:var(--accent); }
.q-option input { flex:none; width:18px; height:18px; accent-color:var(--accent); }
.q-option span { line-height:1.5; overflow-wrap:anywhere; }
.q-input { font-size:1rem; }
.q-long { min-height:130px; }
.q-fill { margin:0; font-size:1.1rem; line-height:2.4; overflow-wrap:anywhere; }
.q-blank { display:inline-block; width:130px; margin:0 5px; padding:6px 10px; border-radius:9px;
  vertical-align:middle; font-size:.92rem; }
.q-order { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.q-order li { display:flex; align-items:center; gap:8px; padding:11px 13px; border:1px solid var(--line);
  border-radius:13px; background:var(--field); }
.q-order li span { flex:1; min-width:0; overflow-wrap:anywhere; }
.q-match-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.q-match-list li { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10px;
  padding:11px 13px; border:1px solid var(--line); border-radius:13px; background:var(--field); }
.q-match-list li span { overflow-wrap:anywhere; }
.run-hint { margin-top:14px; color:var(--muted); font-size:.85rem; }
.run-hint summary { cursor:pointer; }
.run-hint p { margin:8px 0 0; line-height:1.7; }
.run-verdict { margin-top:16px; padding:14px 15px; border-radius:14px; background:var(--panel-2);
  border:1px solid var(--line); }
.run-verdict.ok { border-color:#57d5a6; }
.run-verdict.no { border-color:var(--danger); }
.run-verdict.ok strong { color:#57d5a6; }
.run-verdict.no strong { color:var(--danger); }
.run-verdict p { margin:7px 0 0; font-size:.87rem; line-height:1.7; overflow-wrap:anywhere; }
.run-explain { color:var(--muted); }
.run-self { display:flex; flex-wrap:wrap; gap:8px; margin-top:11px; }
.run-foot { display:flex; flex-wrap:wrap; gap:9px; justify-content:flex-end; margin-top:16px; }
.run-foot .primary { padding:12px 26px; border-radius:13px; }
.run-result { padding:22px; margin-bottom:18px; border:1px solid var(--line); border-radius:18px;
  background:var(--panel); text-align:center; }
.run-result h2 { margin:6px 0 2px; font-size:1.6rem; }
.run-score { margin:6px 0 0; font-size:2.2rem; font-weight:bold; }
.run-score.up { color:#57d5a6; }
.run-score.down { color:var(--danger); }

.q-type-picker { grid-template-columns:repeat(5,1fr); gap:6px; }
.q-type-body { margin:6px 0 14px; }
.q-text-area { min-height:90px; }
.opt-list { list-style:none; margin:0 0 9px; padding:0; display:grid; gap:7px; }
.opt-list li { display:flex; align-items:center; gap:8px; }
.opt-right { flex:none; width:18px; height:18px; accent-color:var(--accent); }
.opt-text { padding:10px 12px; }
.pair-link { flex:none; color:var(--muted); }

.ink-bar { position:sticky; top:0; z-index:5; margin-bottom:12px; padding:8px 10px;
  border:1px solid var(--accent); border-radius:14px; background:var(--panel);
  box-shadow:0 6px 18px #0000002e; }
.ink-tools { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.ink-tool { padding:7px 11px; border:1px solid var(--line); border-radius:9px; background:var(--panel-2);
  color:var(--ink); font:inherit; font-size:.82rem; cursor:pointer; }
.ink-tool:hover { border-color:var(--accent); }
.ink-tool.on { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }
.ink-color { width:26px; height:26px; padding:0; border:2px solid transparent; border-radius:50%;
  box-shadow:0 0 0 1px var(--line); cursor:pointer; }
.ink-color.on { border-color:var(--ink); box-shadow:0 0 0 2px var(--accent); }
.ink-sep { width:1px; height:22px; background:var(--line); margin:0 3px; }
#ink-toggle.on { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }

.ink-canvas { position:absolute; inset:0; width:100%; height:100%; z-index:3; pointer-events:none; }
.ink-canvas.live { pointer-events:auto; touch-action:none; cursor:crosshair; }

@media (max-width:900px) {
  .doc-edit { grid-template-columns:1fr; }
  .doc-area, .doc-preview { min-height:200px; }
}

@media (max-width:620px) {
  .course-grid { grid-template-columns:1fr; }
  .q-type-picker { grid-template-columns:repeat(3,1fr); }
  .q-match-list li { grid-template-columns:1fr; gap:7px; }
  .quiz-start { flex-direction:column; align-items:stretch; }
  .bank-head .primary { margin-inline-start:0; width:100%; }
  .run-foot { flex-direction:column-reverse; }
  .run-foot .primary, .run-foot .small-action { width:100%; }
  .unit-head input { padding:9px 10px; font-size:.92rem; }
  .unit-actions .mini { width:32px; height:32px; }
  .ink-tool { font-size:.76rem; padding:6px 9px; }
  .ink-bar { padding:7px 8px; }
}

/* الحوارات الطويلة (أسئلة بخيارات كتيرة) لازم تتزحلق بدل ما تتقصّ */
.task-dialog { max-height:calc(100vh - 34px); overflow:auto; }

/* أزرار الترتيب والحذف: مربّعات متساوية، وإلا الـ × بيطلع أعرض من السهام */
.block-actions .mini, .unit-actions .mini, .opt-list .mini, .q-order .mini {
  display:grid; place-items:center; width:28px; height:28px; padding:0; font-size:.9rem; line-height:1; }
.block-actions .mini:hover, .unit-actions .mini:hover { border-color:var(--accent); color:var(--ink); }
.block-actions .mini.danger:hover, .unit-actions .mini.danger:hover,
.opt-list .mini.danger:hover { border-color:var(--danger); color:var(--danger); }
.warranty-block.none { border-style:dashed; }
.warranty-block.none .due-head i { color:var(--muted); }

/* من وين جاي رقم الثروة: أصول، حسابات، مدخر، وديون */
.wealth-parts { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; margin:12px 0 4px; }
.wealth-part { display:flex; align-items:baseline; gap:7px; padding:6px 11px; border:1px solid var(--line);
  border-radius:99px; background:var(--panel-2); font-size:.78rem; }
.wealth-part span { color:var(--muted); }
.wealth-part strong { font-size:.83rem; }
.wealth-part.minus strong { color:var(--danger); }

/* أزرار السطر: تعديل وحذف جنب بعض بنفس القياس */
.row-tools { display:flex; flex:none; gap:5px; }
.goal-head .row-tools .mini, .asset-row .mini, .rule-row .mini, .budget-foot .mini, .item .mini {
  display:grid; place-items:center; width:28px; height:28px; padding:0; font-size:.85rem; line-height:1;
  border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--muted); }
.goal-head .row-tools .mini:hover, .asset-row .mini:hover, .rule-row .mini:hover,
.budget-foot .mini:hover, .item .mini:hover { border-color:var(--accent); color:var(--ink); }
.goal-head .row-tools .mini.danger, .asset-row .mini.danger, .item .mini.danger { color:var(--danger); }
.goal-head .row-tools .mini.danger:hover { border-color:var(--danger); color:var(--danger); }

/* أزرار قدم الميزانية بتقعد بالسطر، مو مركّبة فوق بعض */
.budget-card .budget-foot button { position:static; transform:none; }
.budget-card .budget-foot .danger { display:grid; place-items:center; width:28px; height:28px;
  padding:0; border:1px solid var(--line); border-radius:7px; font-size:.85rem; line-height:1; }
.budget-foot { display:flex; flex-wrap:wrap; align-items:center; gap:9px; }
.budget-foot > span { flex:1; min-width:120px; }

/* فحص رمز السهم قبل الحفظ */
.symbol-check { display:flex; align-items:center; gap:10px; margin:-4px 0 2px; }
.symbol-check .small-action { flex:none; }
.field-note.ok { color:#57d5a6; }
.field-note.bad { color:var(--danger); }

/* ملاحظة بالإعدادات: بتقول وضعك الحالي بلا ما تسأل */
.setting-note { align-items:flex-start; }
.setting-note strong::before { content:"● "; }
.setting-note.ok strong::before { color:#57d5a6; }
.setting-note.warn strong::before { color:var(--accent); }

/* أدوات بطاقة المنهاج: تعديل وحذف */
.course-card-tools { display:flex; gap:5px; margin-inline-start:auto; }
.course-card .mini, .course-head .row-tools .mini {
  display:grid; place-items:center; width:26px; height:26px; padding:0; font-size:.82rem; line-height:1;
  border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--muted); }
.course-card .mini:hover, .course-head .row-tools .mini:hover { border-color:var(--accent); color:var(--ink); }
.course-card .mini.danger, .course-head .row-tools .mini.danger { color:var(--danger); }
.course-head-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }

/* شريط أدوات المحرّر */
.doc-tools { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:9px; }
.doc-tool { flex:none; white-space:nowrap; padding:6px 10px; border-radius:9px; border:1px solid var(--line);
  background:var(--panel-2); color:var(--text); font-size:.82rem; cursor:pointer; font-family:inherit; }
.doc-tool:hover { border-color:var(--accent); }
.doc-tool.bold { font-weight:bold; }
.doc-tool.italic { font-style:italic; }
.doc-tool.go { background:var(--accent); color:#10121a; border-color:transparent; font-weight:bold; }
.doc-tools-gap { flex:1 1 0; min-width:0; }

/* عناصر الشرح */
.doc-table-wrap { overflow-x:auto; margin:12px 0; }
.doc-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.doc-table th, .doc-table td { border:1px solid var(--line); padding:7px 10px; text-align:start; }
.doc-table thead th { background:var(--panel-2); font-weight:bold; }
.doc-hr { border:0; border-top:1px dashed var(--line); margin:16px 0; }
.work-body blockquote, .doc-preview blockquote { margin:10px 0; padding:8px 13px;
  border-inline-start:3px solid var(--accent); background:var(--panel-2); border-radius:0 11px 11px 0; color:var(--muted); }
.work-body mark, .doc-preview mark { background:var(--accent); color:#10121a; padding:0 3px; border-radius:4px; }
.doc-chart { display:grid; gap:7px; margin:12px 0; }
.doc-bar-row { display:grid; grid-template-columns:minmax(60px,26%) 1fr auto; align-items:center; gap:9px; }
.doc-bar-label { font-size:.85rem; color:var(--muted); }
.doc-bar { height:14px; border-radius:7px; background:var(--panel-2); overflow:hidden; }
.doc-bar i { display:block; height:100%; border-radius:7px; }
.doc-bar-row b { font-variant-numeric:tabular-nums; font-size:.85rem; }

/* وضع العرض */
.present { position:fixed; inset:0; z-index:120; background:var(--panel);
  display:grid; grid-template-rows:1fr auto auto; gap:14px; padding:34px 28px 18px; }
.present[hidden] { display:none; }
.present-slide { overflow:auto; align-self:center; justify-self:center; width:min(1000px, 100%);
  font-size:1.35rem; line-height:1.9; }
.present-slide h3 { font-size:2.1rem; }
.present-slide h4 { font-size:1.6rem; }
.present-bar { display:flex; align-items:center; justify-content:center; gap:12px; color:var(--muted); }
.present-dots { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.present-dot { width:9px; height:9px; border-radius:50%; border:0; cursor:pointer;
  background:var(--line); padding:0; }
.present-dot.on { background:var(--accent); }
body.presenting #sidebar, body.presenting #topbar { pointer-events:none; }

@media (max-width: 760px) {
  .present { padding:20px 14px 12px; }
  .present-slide { font-size:1.1rem; }
  .doc-tool { padding:5px 8px; font-size:.76rem; }
}

/* ===== أكتر من مؤقّت بنفس الوقت ===== */

.run-list { margin-bottom:18px; }
.run-head { display:flex; align-items:center; gap:9px; margin:0 2px 11px; }
.run-head strong { font-size:.95rem; }
.run-head i { font-style:normal; padding:2px 9px; border-radius:99px; background:var(--panel-2);
  color:var(--muted); font-size:.74rem; }
.run-head .mini { margin-inline-start:auto; display:grid; place-items:center; width:26px; height:26px;
  padding:0; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--muted); }

.run-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:10px; }
.run-timer { display:flex; align-items:center; gap:13px; padding:13px 15px;
  border:1px solid var(--line); border-radius:16px; background:var(--panel); }
.run-timer.paused { opacity:.62; }
.run-timer.flash { animation:run-flash 1.1s ease-in-out 3; }
@keyframes run-flash { 50% { border-color:var(--dial); box-shadow:0 0 0 1px var(--dial); } }

.run-dial { position:relative; flex:none; width:74px; height:74px; }
.run-dial svg { width:100%; height:100%; transform:rotate(-90deg); }
.run-dial .ring-track { fill:none; stroke:var(--panel-2); stroke-width:9; }
.run-dial .ring-value { fill:none; stroke:var(--dial); stroke-width:9; stroke-linecap:round;
  transition:stroke-dashoffset .3s linear; }
.run-dial .dial-face { position:absolute; inset:0; display:grid; place-items:center; }
.run-dial .dial-face strong { font-size:.92rem; font-variant-numeric:tabular-nums; }

.run-body { flex:1; min-width:0; }
.run-name { margin:0; font-weight:bold; line-height:1.35; overflow-wrap:anywhere; }
.run-sub { margin:4px 0 9px; color:var(--muted); font-size:.76rem; }
.run-actions { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.run-actions .small-action { padding:6px 11px; font-size:.79rem; }
.run-actions .mini { display:grid; place-items:center; width:28px; height:28px; padding:0;
  border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--danger); font-size:.9rem; }
.run-actions .mini:hover { border-color:var(--danger); }

.run-add { display:flex; justify-content:center; margin:6px 0 18px; }
.run-add .primary { padding:11px 24px; border-radius:12px; }
.timer-setup.extra { padding:15px; border:1px dashed var(--line); border-radius:18px; margin-bottom:18px; }
.timer-setup.extra .timer-dial { transform:scale(.82); margin:-16px auto; }

@media (max-width:620px) {
  .run-grid { grid-template-columns:1fr; }
  .run-timer { gap:11px; padding:12px; }
  .run-dial { width:64px; height:64px; }
}

/* ===== البطاقات وأنواع الأسئلة الجديدة ===== */

.flip-card { display:grid; gap:14px; justify-items:center; padding:22px 18px; text-align:center;
  border:1px solid var(--line); border-radius:16px; background:var(--field); min-height:150px;
  align-content:center; }
.flip-card .flip-face, .flip-card .flip-back { width:100%; font-size:1.1rem; line-height:1.8; overflow-wrap:anywhere; }
.flip-card .flip-back { color:var(--accent); }
.flip-card p { margin:0 0 8px; }
.flip-card .flip-btn { padding:9px 22px; border-radius:11px; font-size:.86rem; }

.q-answer-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.q-answer-list li { display:flex; align-items:center; gap:9px; }
.q-answer-list .q-num { flex:none; }

.q-code { min-height:150px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.88rem; line-height:1.7; direction:ltr; text-align:left; }
.q-why-label { margin-top:14px; }

.page-note { margin-bottom:18px; }
.note-edit summary { cursor:pointer; color:var(--muted); font-size:.85rem; padding:6px 0; }
.note-edit summary small { color:var(--muted); opacity:.75; }
.note-edit .doc-area { min-height:120px; margin-top:8px; }
.page-note .work-body:empty { display:none; }
.run-half { font-size:.85rem; }
.run-half.ok { color:#57d5a6; }
.run-half.no { color:var(--danger); }

/* ===== لوحة الرموز ===== */

.sym-panel { position:sticky; top:0; z-index:6; margin-bottom:14px; padding:11px 12px;
  border:1px solid var(--accent); border-radius:16px; background:var(--panel);
  box-shadow:0 6px 18px #0000002e; }
.sym-panel[hidden] { display:none; }

.sym-tabs { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:10px; }
.sym-tab { padding:6px 12px; border:1px solid var(--line); border-radius:99px; background:transparent;
  color:var(--muted); font:inherit; font-size:.8rem; cursor:pointer; }
.sym-tab:hover { border-color:var(--accent); color:var(--ink); }
.sym-tab.on { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }

.sym-build { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px;
  padding-bottom:10px; border-bottom:1px solid var(--line); }
.sym-build label { display:flex; align-items:center; gap:6px; margin:0; color:var(--muted);
  font-size:.79rem; font-weight:normal; }
.sym-build input { width:64px; padding:7px 9px; border-radius:9px; font-size:.85rem; text-align:center; }
.sym-build .small-action { padding:7px 13px; font-size:.8rem; }
.sym-build small { color:var(--muted); font-size:.74rem; }

.sym-keys { display:flex; flex-wrap:wrap; gap:5px; max-height:220px; overflow-y:auto; }
.sym-key { min-width:40px; height:40px; padding:0 8px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:10px; background:var(--field); color:var(--ink);
  font-size:1.1rem; line-height:1; cursor:pointer; }
.sym-key:hover { border-color:var(--accent); background:var(--panel-2); }
.sym-key:active { transform:translateY(1px); }
#sym-toggle.on { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }

@media (max-width:620px) {
  .sym-keys { max-height:180px; }
  .sym-key { min-width:36px; height:36px; font-size:1rem; }
  .sym-tab { font-size:.75rem; padding:5px 10px; }
  .sym-build { gap:6px; }
  .sym-build input { width:56px; }
}

/* عنوان القسم عالموبايل: الأزرار بسطر لحالها بدل ما تخنق النص */
@media (max-width:620px) {
  .section-heading { flex-direction:column; align-items:stretch; gap:11px; }
  .heading-actions { flex-wrap:wrap; }
  .heading-actions .small-action { flex:1; min-width:96px; text-align:center; }
  .heading-actions .icon-button { flex:none; }
  .settings-button { margin-right:0; }
}

/* كسر حقيقي: بسط فوق مقام وبيناتهن خط. بينرسم من نص عادي فيه شرطة الكسر U+2044 */
.frac { display:inline-flex; flex-direction:column; align-items:center; vertical-align:-0.42em;
  margin:0 .18em; line-height:1.05; }
.frac-top { padding:0 .22em; }
.frac-bot { padding:0 .22em; border-top:1.5px solid currentColor; }
.frac-top, .frac-bot { font-size:.86em; white-space:nowrap; }

/* مثلث العلاقات: فوق بسط، وتحت عاملين مضروبين */
.tri { margin:14px auto; display:grid; justify-items:center; gap:8px; max-width:300px; }
.tri-shape { position:relative; width:240px; height:190px; }
.tri-shape::before { content:""; position:absolute; inset:0;
  background:var(--panel-2); border:1.5px solid var(--line);
  clip-path:polygon(50% 0, 100% 100%, 0 100%); }
.tri-shape > * { position:absolute; transform:translate(50%, -50%); }
/* منستعمل inset-inline حتى أول اسم بتكتبه يطلع على جهة القراءة (يمين بالعربي) */
.tri-top { top:37%; inset-inline-start:50%; font-size:1.25rem; font-weight:bold; }
.tri-line { top:56%; inset-inline-start:50%; width:44%; height:2px; background:currentColor; opacity:.45; }
.tri-left { top:80%; inset-inline-start:27%; font-size:1.2rem; font-weight:bold; }
.tri-right { top:80%; inset-inline-start:73%; font-size:1.2rem; font-weight:bold; }
.tri figcaption { color:var(--muted); font-size:.82rem; text-align:center; }
.tri-bad { color:var(--muted); font-size:.85rem; }

/* أزرار الرموز العريضة (اتجاه وتخطيط) */
.sym-key.wide { width:auto; padding-inline:11px; font-size:.82rem; }
.tri-mul { top:80%; inset-inline-start:50%; color:var(--muted); font-size:.95rem; }

/* ===== التقويم كقسم مستقل ===== */

.cal-filters { margin-bottom:14px; }
.cal-filters .chip.on { border-color:var(--tone); box-shadow:inset 0 0 0 1px var(--tone);
  background:color-mix(in srgb, var(--tone) 14%, var(--panel)); color:var(--ink); }
.cal-filters .chip b { font-weight:500; opacity:.75; }

.cal-head { display:flex; align-items:center; justify-content:center; gap:14px; margin:0 0 12px; }
.cal-head strong { min-width:150px; text-align:center; font-size:1.05rem; }
.cal-head .mini { display:grid; place-items:center; width:32px; height:32px; padding:0;
  border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink); font-size:1.1rem; }
.cal-head .mini:hover { border-color:var(--accent); }

.cal-day { margin-top:18px; }
.cal-day-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.cal-day-head strong { display:block; font-size:1.05rem; }
.cal-day-head span { display:block; margin-top:3px; color:var(--muted); font-size:.82rem; }
.cal-day-head .primary { flex:none; padding:9px 16px; border-radius:11px; font-size:.84rem; }

.cal-rows { display:grid; gap:8px; }
.cal-row { display:flex; align-items:center; gap:11px; padding:11px 13px; border:1px solid var(--line);
  border-right:3px solid var(--tone); border-radius:13px; background:var(--panel);
  text-align:right; cursor:pointer; }
.cal-row:hover { border-color:var(--accent); border-right-color:var(--tone); }
.cal-row.done { opacity:.55; }
.cal-row.done strong { text-decoration:line-through; }
.cal-row.late { border-color:var(--danger); border-right-color:var(--tone); }
.cal-row-icon { flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:9px;
  background:color-mix(in srgb, var(--tone) 20%, var(--panel-2)); font-size:.95rem; }
.cal-row-body { flex:1; min-width:0; }
.cal-row-body strong { display:block; line-height:1.4; overflow-wrap:anywhere; }
.cal-row-body span { display:block; margin-top:3px; color:var(--muted); font-size:.76rem; overflow-wrap:anywhere; }
.cal-row-go { flex:none; color:var(--muted); }
.cal-row .row-tools { flex:none; }


@media (max-width:620px) {
  .cal-day-head { flex-direction:column; align-items:stretch; }
  .cal-day-head .primary { width:100%; }
  .cal-head strong { min-width:0; flex:1; }
}

/* زر إنجاز المهمة من جوّا التقويم */
.cal-row .row-tools .mini { display:grid; place-items:center; width:30px; height:30px; padding:0;
  border:1px solid var(--line); border-radius:9px; background:transparent; color:var(--muted); font-size:.9rem; }
.cal-row .row-tools .mini:hover { border-color:var(--accent); color:var(--ink); }
.cal-row .row-tools .mini.on { color:var(--accent-ink); border-color:var(--accent); background:var(--accent); }
.cal-row .row-tools .mini.danger { color:var(--danger); }

/* اليوم صار ٢٤ ساعة كاملة: منخلي الخط بيتزحلق لحاله والساعات الفاضية أنحف */
#cal-day .timeline { max-height:min(62vh, 640px); overflow-y:auto; }
#cal-day .hour-row.free { min-height:36px; padding-block:5px; }
#cal-day .hour-row.free .hour-slot::after { height:12px; }

/* صندوق «بلا موعد»: مطرح مؤقت لشي لسا ما قرّرت إيمتى تعمله */
.cal-parked { margin-top:16px; border:1px solid var(--line); border-radius:16px;
  background:var(--panel); padding:13px 15px; }
.cal-parked-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:9px; }
.cal-parked-head span { color:var(--muted); font-size:.82rem; }
.cal-parked .cal-rows { display:grid; gap:7px; }

/* القائمة وصندوق «بلا موعد» جنب بعض فوق تفاصيل اليوم */
.cal-boxes { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:16px; }
.cal-boxes .cal-parked { margin-top:0; }
.cal-boxes .cal-rows { max-height:230px; overflow-y:auto; }
@media (max-width: 760px) { .cal-boxes { grid-template-columns:1fr; } }

/* مجلدات اليوم: ترتيب داخلي لنهار واحد، بتسحب الصف وبترميه فيه */
.day-head-tools { display:flex; gap:8px; flex-wrap:wrap; }
.day-folders { display:grid; gap:10px; margin:12px 0; }
.day-folder { border:1px solid var(--line); border-radius:14px; background:var(--panel-2); padding:10px 12px; }
.day-folder-head { display:flex; align-items:center; gap:9px; margin-bottom:8px; }
.day-folder-head strong { font-size:.95rem; }
.day-folder-head span { color:var(--muted); font-size:.8rem; flex:1; }
.day-folder .cal-rows { display:grid; gap:7px; }
.day-folder.drop-hint { outline-offset:2px; }
.loose-drop { border-radius:14px; padding:2px; }

/* ربط المهمة بنظام بالحاسبة */
.link-block { margin:14px 0; padding:13px; border:1px solid var(--line); border-radius:15px; background:var(--panel); }
.link-block .stack-label { display:block; margin-bottom:9px; }
.link-block .field-note { margin:8px 0 0; color:var(--muted); font-size:.76rem; }
.link-block select { width:100%; }
.cal-linked { color:var(--accent); }

/* Account and sync */
#account-dialog { width:min(420px,calc(100vw - 28px)); }
#account-body { display:grid; gap:14px; }
.account-lead { color:var(--muted); font-size:.85rem; line-height:1.7; margin:0; }
.account-form { display:grid; gap:11px; }
.account-field { display:grid; gap:6px; }
.account-field span { font-size:.8rem; color:var(--muted); }
.account-field input { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--sunken,var(--panel)); font:inherit; }
.account-field input:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.account-form .primary { width:100%; }
.account-alt { display:grid; gap:8px; justify-items:stretch; }
.account-alt .small-action { width:100%; }
.link-action { border:0; background:transparent; color:var(--muted); font:inherit; text-decoration:underline; padding:4px; }
.link-action:hover { color:var(--ink); }
.account-error { margin:0; padding:10px 12px; border-radius:12px; color:var(--danger); background:#ff6b6b18; font-size:.83rem; }
.account-card { padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--panel); display:grid; gap:8px; }
.account-card strong { font-size:1rem; overflow-wrap:anywhere; }
.account-card p { margin:0; color:var(--muted); font-size:.82rem; }
.account-state { justify-self:start; padding:3px 10px; border-radius:99px; font-size:.75rem; font-weight:bold; background:var(--panel-2); color:var(--muted); }
.account-state.on { background:#57d5a626; color:#57d5a6; }
.account-state.connecting { background:var(--accent); color:var(--accent-ink); }
.account-state.offline { background:#ffc26626; color:#ffc266; }
.account-state.error { background:#ff6b6b22; color:var(--danger); }
.account-facts { list-style:none; margin:4px 0 0; padding:0; display:grid; gap:6px; }
.account-facts li { display:flex; justify-content:space-between; gap:10px; font-size:.82rem; }
.account-facts span { color:var(--muted); }

/* Preview mode and the no-network screen */
#preview-bar { position:fixed; inset:0 0 auto 0; z-index:90; display:flex; gap:14px; align-items:center; justify-content:center; flex-wrap:wrap; padding:10px 16px; border-bottom:1px solid var(--line); background:var(--panel); box-shadow:0 6px 24px #0004; }
#preview-bar span { font-size:.86rem; color:var(--ink); }
#preview-bar .primary { padding:8px 16px; }
body[data-mode="preview"] .layout { padding-top:52px; }
body[data-mode="preview"] #build-badge { display:none; }
#no-net { position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:20px; background:var(--bg); }
.no-net-card { display:grid; gap:12px; justify-items:center; text-align:center; max-width:360px; padding:28px; border:1px solid var(--line); border-radius:20px; background:var(--panel); }
.no-net-mark { font-size:2rem; }
.no-net-card h1 { margin:0; font-size:1.3rem; }
.no-net-card p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.7; }
@media(max-width:620px){ #preview-bar { gap:8px; padding:8px 12px; } #preview-bar span { font-size:.78rem; } body[data-mode="preview"] .layout { padding-top:70px; } }

/* The always-visible account row in the rail */
.account-row .account-who { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-row.muted-row { color:var(--muted); }
.account-dot { width:9px; height:9px; border-radius:99px; background:var(--muted); flex:none; }
.account-dot.on { background:#57d5a6; }
.account-dot.connecting { background:var(--accent); }
.account-dot.offline { background:#ffc266; }
.account-dot.error { background:var(--danger); }
.account-row { margin-bottom:14px; }

/* الخطط: نافذة «ميزة احترافية» وصفحة الخطة بالإعدادات. */

.plan-dialog { width:min(400px,calc(100vw - 28px)); }
.plan-note { margin:0 0 10px; line-height:1.7; color:var(--ink); }
.plan-calm { margin:0; font-size:.86rem; color:var(--muted); }

/* جدول المقارنة: صف لكل ميزة، وعمودين. */
.plan-table { display:grid; grid-template-columns:1fr auto auto; gap:2px 14px; align-items:center; margin-top:6px; }
.plan-table > b,
.plan-table > span { padding:7px 0; border-bottom:1px solid var(--line); font-weight:normal; }
.plan-table > .plan-head { font-weight:bold; font-size:.82rem; color:var(--muted); border-bottom-color:transparent; }
.plan-table > .plan-col { text-align:center; min-width:62px; }
.plan-now { display:inline-block; margin-bottom:10px; padding:4px 11px; border-radius:999px;
  background:var(--accent-soft,var(--panel-2,#eee)); font-size:.85rem; font-weight:bold; }

/* لقطة برّا مدى خطتك: موجودة ومحفوظة، بس مو مفتوحة. */
.snap-locked { opacity:.62; }
.snap-locked .small-action { font-weight:normal; }

.account-plan { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); }
.account-plan h3 { margin:0 0 8px; font-size:1rem; }

/* تقرير الشهر: نص مقروء، مو لوحة أرقام. */

.report-months { display:flex; gap:7px; overflow-x:auto; padding-bottom:6px; margin-bottom:14px; scrollbar-width:thin; }
.report-month { flex:0 0 auto; padding:6px 13px; border:1px solid var(--line); border-radius:999px;
  background:transparent; color:var(--muted); font:inherit; font-size:.88rem; cursor:pointer; }
.report-month:hover { color:var(--ink); }
.report-month.active { background:var(--accent); color:var(--on-accent,#141018); border-color:transparent; font-weight:bold; }

.report-lead { margin:0 0 14px; font-size:1.05rem; color:var(--muted); }

.report-blocks { display:grid; gap:14px; }
.report-block { padding:15px 17px; border:1px solid var(--line); border-radius:16px; background:var(--panel); }
.report-block h3 { margin:0 0 9px; font-size:.95rem; color:var(--muted); font-weight:bold; }
.report-block p { margin:0 0 7px; line-height:1.85; font-size:1rem; }
.report-block p:last-child { margin-bottom:0; }

.report-foot { display:flex; gap:9px; margin-top:16px; flex-wrap:wrap; }

.report-locked { padding:20px; border:1px dashed var(--line); border-radius:16px; text-align:center; }
.report-locked .report-lead { font-size:1.05rem; color:var(--ink); margin-bottom:8px; }
.report-locked .panel-note { margin:0 auto 14px; max-width:46ch; }