/* الخط مستضاف على الموقع نفسه (أسرع من Google Fonts ولا يعيق العرض) — IBM Plex Sans Arabic, SIL OFL 1.1 */
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-arabic-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/plex-arabic-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-arabic-600.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plex-arabic-700.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/plex-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plex-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#f6f4ee;--surface:#fff;--surface2:#fbfaf6;--ink:#17211c;--muted:#5f6862;--line:#e4e0d4;
  --accent:#0f6e56;--accent-2:#0b5a46;--accent-ink:#fff;--accent-soft:#e3f1ec;--gold:#a87b23;--gold-ink:#7d5a14;--gold-soft:#f6ecd6;
  --danger:#a5402f;--danger-soft:#f8e3df;--radius:16px;--shadow:0 1px 2px rgb(20 30 25/.05),0 6px 24px -12px rgb(20 30 25/.18);
  --c-islamic:#0f6e56;--c-salary:#3a63a6;--c-finance:#a87b23;--c-health:#b2445e;--c-datetime:#6a4fa3;--c-math:#2c8584;--c-business:#b5612a;--c-pregnancy:#c2507a;--c-education:#3d5fb8;--c-home:#5d7d2e;--c-converters:#4a5a6a;--c-text:#7a4a2a;--c-random:#c0392b;--c-design:#8e44ad;--c-images:#1f7a8c;--c-docs:#2f6f9f;--c-paper:#5b6abf;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#101614;--surface:#18201c;--surface2:#1c2520;--ink:#e7ece8;--muted:#9aa59e;--line:#2a3530;
  --accent:#42b08d;--accent-2:#5cc4a1;--accent-ink:#06140f;--accent-soft:#1a3029;--gold:#d8ae5b;--gold-ink:#d8ae5b;--gold-soft:#332a17;
  --danger:#ec8b7a;--danger-soft:#3a201b;--shadow:none;
  --c-islamic:#42b08d;--c-salary:#7c9fe0;--c-finance:#d8ae5b;--c-health:#e07a92;--c-datetime:#a58ae0;--c-math:#5cc0bf;--c-business:#e39a63;--c-pregnancy:#ea8db0;--c-education:#8aa6ee;--c-home:#9cc26a;--c-converters:#a3b1bf;--c-text:#d9a27a;--c-random:#ee8577;--c-design:#c39be0;--c-images:#6cc4d6;--c-docs:#7fb4dd;--c-paper:#9aa6ec;
}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 "IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--accent)}
img,svg{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:8px;top:8px;background:var(--surface);padding:6px 10px;border-radius:8px;z-index:9}
.ic{width:1.2em;height:1.2em;flex:none}
.muted{color:var(--muted)}.small{font-size:.85rem}

/* header */
.top{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.nav{display:flex;align-items:center;gap:20px;min-height:62px}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.2rem;color:var(--ink);text-decoration:none}
.brand .ic{color:var(--accent);width:28px;height:28px}
.links{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}
.links a{color:var(--muted);text-decoration:none;padding:6px 10px;border-radius:8px;white-space:nowrap;font-size:.93rem}
.links a:hover{background:var(--accent-soft);color:var(--accent)}
.lang{margin-inline-start:auto;border:1px solid var(--line);border-radius:999px;padding:5px 14px;text-decoration:none;color:var(--ink);font-size:.9rem;white-space:nowrap}
.lang:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:900px){.links{display:none}}

/* hero */
.hero{text-align:center;padding:48px 0 28px}
.hero h1{font-size:clamp(1.7rem,4.5vw,2.6rem);line-height:1.3;margin:0 0 10px}
.hero p{color:var(--muted);max-width:640px;margin:0 auto 22px}
.hero.small{padding:28px 0 18px}
.search{display:flex;align-items:center;gap:10px;max-width:620px;margin:0 auto;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:4px 16px;box-shadow:var(--shadow)}
.search:focus-within{border-color:var(--accent)}
.search .ic{color:var(--muted)}
.search input{flex:1;border:0;outline:0;background:transparent;font:inherit;padding:12px 0;color:var(--ink);min-width:0}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 14px;text-decoration:none;color:var(--ink);font-size:.9rem}
.chip:hover{border-color:var(--accent)}

/* cards */
.cat{margin:26px 0}
.cat-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cat-h h2{font-size:1.25rem;margin:0 0 12px}
.cat-h a{font-size:.9rem;text-decoration:none}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.card{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s}
.card:hover{border-color:var(--accent);transform:translateY(-1px)}
.card b{display:block;font-weight:600;line-height:1.4}
.card small{display:block;color:var(--muted);font-size:.85rem;line-height:1.5;margin-top:3px}
.cic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;flex:none;color:var(--cc);background:color-mix(in srgb,var(--cc) 13%,transparent)}
.cic .ic{width:22px;height:22px}
.cic.big{width:60px;height:60px;margin:0 auto 8px;border-radius:18px}.cic.big .ic{width:32px;height:32px}
.c-islamic{--cc:var(--c-islamic)}.c-business{--cc:var(--c-business)}.c-pregnancy{--cc:var(--c-pregnancy)}.c-education{--cc:var(--c-education)}.c-home{--cc:var(--c-home)}.c-converters{--cc:var(--c-converters)}.c-salary{--cc:var(--c-salary)}.c-finance{--cc:var(--c-finance)}.c-health{--cc:var(--c-health)}.c-datetime{--cc:var(--c-datetime)}.c-math{--cc:var(--c-math)}.c-text{--cc:var(--c-text)}.c-random{--cc:var(--c-random)}.c-design{--cc:var(--c-design)}.c-images{--cc:var(--c-images)}.c-docs{--cc:var(--c-docs)}.c-paper{--cc:var(--c-paper)}
.empty{text-align:center;color:var(--muted);padding:30px}

/* calculator page */
.crumbs{display:flex;flex-wrap:wrap;gap:6px;font-size:.88rem;color:var(--muted);padding-top:18px}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--accent)}
.ph h1{font-size:clamp(1.5rem,4vw,2.1rem);line-height:1.35;margin:10px 0 6px}
.lead{color:var(--muted);margin:0 0 18px;max-width:760px}
.calc{display:grid;gap:16px;grid-template-columns:1fr;align-items:start;margin-bottom:28px}
@media(min-width:900px){.calc{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.calc.wide{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.panel>h2,.panel>h3{margin:0 0 12px;font-size:1.05rem}
.out{background:var(--surface2)}
@media(min-width:900px){.out{position:sticky;top:78px}}

/* form */
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld{display:flex;flex-direction:column;gap:5px;grid-column:span 2;min-width:0}
.fld.half{grid-column:span 1}
@media(max-width:420px){.fld.half{grid-column:span 2}}
.fld>label,.fld>.lbl{font-size:.9rem;font-weight:500}
.fld .help{font-size:.8rem;color:var(--muted)}
.inp{display:flex;align-items:center;background:var(--bg);border:1.5px solid var(--line);border-radius:11px;overflow:hidden}
.inp:focus-within{border-color:var(--accent)}
.inp input,.inp select{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;padding:10px 12px}
.inp select{cursor:pointer}
.inp .sfx{padding:0 12px;color:var(--muted);font-size:.85rem;white-space:nowrap}
input[type=date]{min-height:46px}
.seg{display:flex;flex-wrap:wrap;gap:4px;background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:4px}
.seg button{flex:1 1 auto;border:0;background:transparent;color:var(--ink);font:inherit;font-size:.92rem;padding:7px 10px;border-radius:8px;cursor:pointer;white-space:nowrap}
.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);font-weight:600}
.chk{display:flex;align-items:center;gap:8px;font-size:.92rem;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--accent)}
.sep{grid-column:span 2;font-size:.85rem;font-weight:600;color:var(--gold-ink);border-bottom:1px dashed var(--line);padding-bottom:4px;margin-top:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--accent);color:var(--accent-ink);border:0;border-radius:11px;padding:10px 18px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}

/* results */
.hl{background:var(--accent);color:var(--accent-ink);border-radius:14px;padding:16px 18px;margin-bottom:12px}
.hl small{display:block;opacity:.85;font-size:.88rem}
.hl b{display:block;font-size:clamp(1.6rem,5vw,2.1rem);line-height:1.25;font-weight:700;word-break:break-word}
.hl>span{display:block;font-size:.88rem;opacity:.9;margin-top:4px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-width:0}
.stat small{display:block;color:var(--muted);font-size:.8rem}
.stat b{display:block;font-size:1.08rem;word-break:break-word}
.rows{margin:12px 0 0;padding:0;list-style:none}
.rows li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:.95rem}
.rows li:last-child{border-bottom:0}
.rows li b{white-space:nowrap}
.rows li.tot{font-weight:700;border-top:1.5px solid var(--ink);border-bottom:0}
.msg{border-radius:12px;padding:10px 14px;font-size:.9rem;margin-top:10px;background:var(--gold-soft)}
.msg.bad{background:var(--danger-soft);color:var(--danger)}
.msg.ok{background:var(--accent-soft)}
.badge{display:inline-block;font-size:.75rem;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.badge.warn{background:var(--gold-soft);color:var(--gold-ink)}.badge.bad{background:var(--danger-soft);color:var(--danger)}
.tbl-wrap{overflow-x:auto;margin-top:12px;border:1px solid var(--line);border-radius:12px}
table.tbl{width:100%;border-collapse:collapse;font-size:.88rem;font-variant-numeric:tabular-nums}
.tbl th,.tbl td{padding:8px 10px;text-align:start;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl th{background:var(--surface2);font-weight:600;position:sticky;top:0}
.tbl tr:last-child td{border-bottom:0}
details.more{margin-top:12px}
details.more summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:.92rem}
.bar{display:flex;height:14px;border-radius:999px;overflow:hidden;margin:12px 0 6px;background:var(--line)}
.bar span{height:100%}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.82rem;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:5px;vertical-align:-1px}
.fr{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;line-height:1.05;font-weight:700;direction:ltr;font-size:.95em}
.fr i{font-style:normal;border-bottom:1.5px solid currentColor;padding:0 2px}
.fr i+i{border:0}

/* content */
.content{max-width:780px}
.content section{margin:28px 0}
.content h2{font-size:1.3rem;margin:0 0 10px}
.content h3{font-size:1.05rem;margin:18px 0 6px}
.content ul,.content ol{padding-inline-start:22px}
.content li{margin:4px 0}
.content table{border-collapse:collapse;width:100%;font-size:.92rem;margin:10px 0}
.content td,.content th{border:1px solid var(--line);padding:7px 10px;text-align:start}
.content th{background:var(--surface2)}
.content code,.formula{direction:ltr;unicode-bidi:isolate;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:var(--surface2);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.formula{display:block;padding:10px 12px;margin:10px 0;text-align:left;overflow-x:auto;white-space:pre}
.notice{background:var(--gold-soft);border-radius:12px;padding:12px 16px;font-size:.93rem;margin:16px 0}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.faq summary{cursor:pointer;padding:12px 16px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary::after{content:"+";color:var(--accent);font-size:1.2rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details>div{padding:0 16px 12px;color:var(--muted)}
.page{padding-bottom:30px}.page .big{font-size:1.2rem}
.related{margin:30px 0}
.related h2{font-size:1.2rem}

/* steppers (inheritance) */
.heirs .grp{margin-bottom:6px}
.heirs h3,.heirs h4{font-size:.85rem;color:var(--gold-ink);margin:12px 0 4px;border-bottom:1px dashed var(--line);padding-bottom:3px}
.hrow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 8px;border-radius:9px}
.hrow.on{background:var(--accent-soft)}
.step{display:flex;align-items:center;gap:6px}
.step button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.1rem;line-height:1;cursor:pointer}
.step output{min-width:22px;text-align:center;font-weight:700}
.heir{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:8px;background:var(--surface);border-inline-start:4px solid var(--hc,var(--accent))}
.heir.off{opacity:.7;border-inline-start-color:var(--muted)}
.heir .t{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-weight:600}
.heir .n{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:6px;margin-top:6px;font-size:.82rem;color:var(--muted)}
.heir .n b{display:block;color:var(--ink);font-size:.98rem}
.heir .w{font-size:.85rem;color:var(--muted);margin-top:4px}
.ex{display:flex;flex-wrap:wrap;gap:6px}
.ex button{border:1px solid var(--line);background:var(--gold-soft);color:var(--ink);border-radius:999px;padding:4px 12px;font:inherit;font-size:.82rem;cursor:pointer}

/* footer */
.foot{background:var(--surface);border-top:1px solid var(--line);margin-top:40px;padding:30px 0 18px;font-size:.92rem}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}
@media(max-width:700px){.fgrid{grid-template-columns:1fr 1fr}.fgrid>div:first-child{grid-column:span 2}}
.foot h3,.foot .fh{font-size:.95rem;margin:0 0 8px}
.foot ul{list-style:none;padding:0;margin:0}.foot li{margin:4px 0}
.foot a{color:var(--muted);text-decoration:none}.foot a:hover{color:var(--accent)}
.foot p{color:var(--muted)}
.copy{color:var(--muted);font-size:.82rem;border-top:1px solid var(--line);margin-top:18px;padding-top:14px}
@media print{.top,.foot,.related,.crumbs,.search{display:none}.panel{box-shadow:none}}
.calc>*,.panel,.fields>*,.content{min-width:0}
body{overflow-x:hidden}

/* nav menu */
.links{display:flex;align-items:center;gap:6px;flex:1;overflow:visible}
.menu{position:relative}
.menu>summary{list-style:none;cursor:pointer;padding:6px 12px;border-radius:9px;color:var(--ink);font-weight:500;font-size:.95rem;user-select:none}
.menu>summary::-webkit-details-marker{display:none}
.menu>summary:hover,.menu[open]>summary{background:var(--accent-soft);color:var(--accent)}
.menu-panel{position:absolute;top:calc(100% + 8px);inset-inline-start:0;z-index:20;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 40px -10px rgb(0 0 0/.25);padding:8px;display:grid;grid-template-columns:repeat(2,minmax(210px,1fr));gap:2px;width:max-content;max-width:calc(100vw - 32px)}
.menu-panel a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--ink);white-space:normal}
.menu-panel a:hover{background:var(--surface2);color:var(--ink)}
.menu-panel .cic{width:34px;height:34px;border-radius:10px}.menu-panel .cic .ic{width:18px;height:18px}
.menu-panel small{display:block;color:var(--muted);font-size:.78rem}
.nsearch{display:inline-flex;align-items:center;gap:6px}
@media(max-width:900px){.links{display:flex}.nsearch span{display:none}}
@media(max-width:560px){.menu-panel{grid-template-columns:1fr;position:fixed;top:62px;inset-inline:16px;width:auto;max-height:calc(100vh - 80px);overflow:auto}}
.more-l{text-align:center;margin:14px 0 0}

/* repeatable rows */
.rws{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.rrow{display:grid;grid-template-columns:var(--cols);gap:6px;align-items:center}
.rrow.rhead{font-size:.78rem;color:var(--muted)}
.rrow .inp input,.rrow .inp select{padding:8px 9px}
.rdel{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:1.1rem;cursor:pointer}
.rdel:hover{color:var(--danger);border-color:var(--danger)}
.btn.sm{padding:6px 12px;font-size:.88rem;font-weight:500;align-self:flex-start}
.big-num{font-size:2.2rem;font-weight:700;line-height:1.2;direction:ltr;unicode-bidi:isolate}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;direction:ltr;unicode-bidi:isolate;word-break:break-all}
.compass{display:block;margin:10px auto;max-width:240px}
.ptimes{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-top:10px}
.ptimes div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}
.ptimes div.now{border-color:var(--accent);background:var(--accent-soft)}
.ptimes small{display:block;color:var(--muted);font-size:.82rem}.ptimes b{font-size:1.25rem;direction:ltr;display:block}
/* narrow phones */
@media(max-width:480px){.nav{gap:8px}.brand{font-size:1.05rem}.brand .ic{width:24px;height:24px}.menu>summary{padding:6px 8px}.lang{padding:5px 10px;font-size:.85rem}.nsearch{display:none}}
.rows li>span{min-width:0}
.rows li>b{white-space:normal;text-align:end;overflow-wrap:anywhere;max-width:62%}
.hl b,.hl>span{overflow-wrap:anywhere}

/* numbers like 4.48 / 5 keep LTR order inside RTL */
.hl b,.stat b,.rows li>b,.heir .n b,.tbl td,.ptimes b,.legend span{unicode-bidi:plaintext}
[dir=rtl] .hl b,[dir=rtl] .stat b,[dir=rtl] .tbl td,[dir=rtl] .heir .n b{text-align:right}
[dir=ltr] .hl b,[dir=ltr] .stat b,[dir=ltr] .tbl td,[dir=ltr] .heir .n b{text-align:left}
[dir=rtl] .rows li>b{text-align:left}
[dir=ltr] .rows li>b{text-align:right}
.hl small,.hl>span{unicode-bidi:plaintext}
[dir=rtl] .hl small,[dir=rtl] .hl>span{text-align:right}

/* ===== tools: text, design, images ===== */
.ta{width:100%;min-height:120px;resize:vertical;background:var(--bg);color:var(--ink);border:1.5px solid var(--line);border-radius:11px;padding:10px 12px;font:inherit;line-height:1.7;outline:0}
.ta:focus{border-color:var(--accent)}
.ta.mono,.out .ta.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.86rem;line-height:1.55;direction:ltr;text-align:left}
.out .ta{background:var(--surface)}
.inp.clr{padding:4px;gap:6px}
.inp.clr input[type=color]{flex:0 0 46px;width:46px;height:36px;padding:0;border:0;border-radius:8px;background:none;cursor:pointer}
.inp.clr.sm input[type=color]{flex:1;width:100%;height:30px}
input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:1px solid var(--line);border-radius:7px}
input[type=color]::-moz-color-swatch{border:1px solid var(--line);border-radius:7px}
.inp.clr .mono{padding:8px 6px;text-transform:lowercase}
.rng{width:100%;accent-color:var(--accent);margin:6px 0 2px}
.fld>label output{font-weight:700;color:var(--accent);margin-inline-start:4px;unicode-bidi:plaintext}
.drop{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;border:2px dashed var(--line);border-radius:14px;padding:22px 14px;cursor:pointer;background:var(--bg);transition:border-color .15s,background .15s}
.drop:hover,.drop.over{border-color:var(--accent);background:var(--accent-soft)}
.drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.drop-ic{font-size:1.5rem;color:var(--accent)}
.drop small{color:var(--muted);font-size:.8rem}
.drop-name{font-size:.82rem;color:var(--accent);font-weight:600;overflow-wrap:anywhere}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.btn.cpy.done{border-color:var(--accent);color:var(--accent)}
.out.busy{position:relative}
.out.busy::after{content:"";position:absolute;inset:0;border-radius:var(--radius);background:color-mix(in srgb,var(--surface2) 55%,transparent)}
.out.busy::before{content:"";position:absolute;z-index:2;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pv{display:block;max-width:100%;max-height:440px;margin:0 auto;border-radius:10px;background:repeating-conic-gradient(#ccc 0 25%,#fff 0 50%) 0 0/16px 16px}
.pv-wrap{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:10px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:6px 12px;font:inherit;font-size:.92rem;cursor:pointer;direction:ltr;unicode-bidi:isolate}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.big-out{font-size:clamp(1.05rem,3.4vw,1.35rem);font-weight:600;line-height:1.5;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;word-break:break-all;direction:ltr;text-align:left;unicode-bidi:isolate}
.pw-list{display:flex;flex-direction:column;gap:8px}
.pw-row{display:flex;gap:8px;align-items:stretch}.pw-row .big-out{flex:1;min-width:0}
.meter{height:8px;border-radius:999px;background:var(--line);overflow:hidden;margin:10px 0 4px}.meter i{display:block;height:100%;border-radius:999px}
/* colors */
.sw-strip{display:flex;height:140px;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.sw-strip button{flex:1;border:0;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:8px 2px;font:600 .78rem ui-monospace,Menlo,monospace;min-width:0}
.swatch-lg{height:110px;border-radius:14px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;margin-bottom:12px}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85rem;direction:ltr;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;white-space:pre-wrap;word-break:break-all;margin:10px 0 0}
.stage{min-height:220px;border-radius:14px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:28px;overflow:hidden}
.stage-box{width:min(220px,70%);height:150px;display:flex;align-items:center;justify-content:center;font-weight:600}
.grad-pv{height:200px;border-radius:14px;border:1px solid var(--line)}
/* image tools */
.crop-stage{position:relative;display:inline-block;max-width:100%;touch-action:none;user-select:none;line-height:0;margin:0 auto}
.crop-stage img{max-width:100%;max-height:520px;display:block}
.crop-wrap{text-align:center;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px}
.crop-box{position:absolute;border:2px solid #fff;box-shadow:0 0 0 9999px rgb(0 0 0/.5);cursor:move;outline:1px solid rgb(0 0 0/.4)}
.crop-box::before,.crop-box::after{content:"";position:absolute;inset:33.33% 0;border-top:1px dashed rgb(255 255 255/.6);border-bottom:1px dashed rgb(255 255 255/.6);pointer-events:none}
.crop-box::after{inset:0 33.33%;border:0;border-left:1px dashed rgb(255 255 255/.6);border-right:1px dashed rgb(255 255 255/.6)}
.crop-box i{position:absolute;width:16px;height:16px;background:#fff;border:2px solid var(--accent);border-radius:50%;z-index:1}
.crop-box i[data-h=nw]{left:-9px;top:-9px;cursor:nwse-resize}.crop-box i[data-h=ne]{right:-9px;top:-9px;cursor:nesw-resize}
.crop-box i[data-h=sw]{left:-9px;bottom:-9px;cursor:nesw-resize}.crop-box i[data-h=se]{right:-9px;bottom:-9px;cursor:nwse-resize}
.crop-box i[data-h=n]{left:50%;top:-9px;margin-left:-8px;cursor:ns-resize}.crop-box i[data-h=s]{left:50%;bottom:-9px;margin-left:-8px;cursor:ns-resize}
.crop-box i[data-h=w]{top:50%;left:-9px;margin-top:-8px;cursor:ew-resize}.crop-box i[data-h=e]{top:50%;right:-9px;margin-top:-8px;cursor:ew-resize}
.flist{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.fitem{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px}
.fitem img{width:56px;height:56px;object-fit:cover;border-radius:8px}
.fitem small{display:block;color:var(--muted);font-size:.8rem;unicode-bidi:plaintext}
.fitem b{display:block;font-size:.9rem;overflow-wrap:anywhere}
.fav-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;margin-top:10px}
.fav-row figure{margin:0;text-align:center;font-size:.75rem;color:var(--muted)}
.fav-row img{display:block;margin:0 auto 4px;image-rendering:auto;border:1px solid var(--line);background:repeating-conic-gradient(#ddd 0 25%,#fff 0 50%) 0 0/8px 8px}
.tabmock{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:10px 10px 0 0;padding:8px 12px;max-width:260px;font-size:.85rem;margin-top:12px}
.tabmock img{width:16px;height:16px}
/* drawing pad */
.dp{display:flex;flex-direction:column;gap:10px}
.dp-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dp-bar .seg{flex:0 1 auto}
.dp-bar label{display:flex;align-items:center;gap:6px;font-size:.88rem}
.dp-bar input[type=range]{width:110px;accent-color:var(--accent)}
.dp-cols{display:flex;gap:4px;flex-wrap:wrap}
.dp-cols button{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0}
.dp-cols button[aria-pressed=true]{border-color:var(--ink);transform:scale(1.12)}
.dp-canvas{position:relative;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:repeating-conic-gradient(#e6e6e6 0 25%,#fff 0 50%) 0 0/20px 20px;line-height:0}
.dp-canvas canvas{width:100%;height:auto;touch-action:none;cursor:crosshair;display:block}
/* markdown */
.md{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:6px 18px;overflow-wrap:anywhere;unicode-bidi:plaintext}
.md h1,.md h2,.md h3{line-height:1.35}.md h1{font-size:1.6rem}.md h2{font-size:1.3rem}.md h3{font-size:1.1rem}
.md pre{background:var(--bg);border-radius:10px;padding:12px;overflow:auto;direction:ltr;text-align:left}
.md code{font-family:ui-monospace,Menlo,monospace;font-size:.88em;background:var(--bg);padding:1px 5px;border-radius:5px}
.md pre code{background:none;padding:0}
.md blockquote{margin:10px 0;padding:4px 14px;border-inline-start:4px solid var(--accent);color:var(--muted);background:var(--surface2)}
.md table{border-collapse:collapse;margin:10px 0;display:block;overflow-x:auto}.md th,.md td{border:1px solid var(--line);padding:6px 10px}
.md img{max-width:100%}.md hr{border:0;border-top:1px solid var(--line)}
.md li.task{list-style:none}.md li.task input{margin-inline-end:6px}
mark.hit{background:#ffe066;color:#000;border-radius:3px;padding:0 1px}
.hlview{white-space:pre-wrap;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;max-height:320px;overflow:auto;unicode-bidi:plaintext;overflow-wrap:anywhere}
/* dice */
.dice{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:6px 0 12px}
.die{width:64px;height:64px;border-radius:14px;background:var(--surface);border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;direction:ltr}
.die svg{width:100%;height:100%}
.die.roll{animation:roll .5s ease-out}
@keyframes roll{0%{transform:rotate(-200deg) scale(.6);opacity:.3}100%{transform:none;opacity:1}}
.winner{font-size:clamp(1.4rem,5vw,2.2rem);font-weight:700;text-align:center;padding:18px 10px;background:var(--accent);color:var(--accent-ink);border-radius:14px;margin-bottom:10px;overflow-wrap:anywhere}
.winner.spin{opacity:.75}
.teams{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.teams div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.teams b{display:block;margin-bottom:4px;color:var(--accent)}
.teams ol{margin:0;padding-inline-start:20px}
/* معاينة المستندات */
.docpv{display:flex;flex-direction:column;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:6px;max-height:820px;overflow:auto}
.docpg{display:block;width:100%;max-width:640px;height:auto;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12),0 6px 20px rgba(0,0,0,.08);border-radius:2px}
.docpn{font-size:.8rem;color:var(--muted);align-self:center}
.sigpv{background:#fff;color:#111;border:1px solid var(--line);border-radius:12px;padding:18px;margin-top:6px;overflow-x:auto}
.tt td{min-width:104px;vertical-align:top;white-space:normal;line-height:1.35}
.seg.tplg{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}
.seg.tplg button{display:flex;align-items:center;gap:8px;justify-content:flex-start;text-align:start;white-space:normal;line-height:1.2;font-size:.85rem;padding:7px 8px;border:1px solid var(--line);background:var(--surface)}
.seg.tplg .sw{flex:0 0 22px;height:22px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.seg.tplg button[aria-pressed=true]{border-color:var(--accent);color:var(--ink,inherit);background:var(--surface);box-shadow:0 0 0 2px var(--accent) inset;font-weight:700}

/* أدوات المعاينة على سطح المكتب: النموذج في جهة والورقة في الجهة الأخرى (تتبع اتجاه الصفحة تلقائياً) */
@media (min-width:1000px){
  .calc.split,.calc.split.wide{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  .calc.split>.out{position:sticky;top:76px;max-height:calc(100vh - 92px);overflow:auto;overscroll-behavior:contain}
  .calc.split .docpv{max-height:none}
  .calc.split .docpg{max-width:100%}
  .calc.split .sigpv{max-width:100%}
}
@media (min-width:1300px){.calc.split,.calc.split.wide{grid-template-columns:minmax(0,4fr) minmax(0,5fr)}}

/* كلمات البحث */
.tags h2{font-size:1rem}
.kw{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.kw li{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px 11px;font-size:.84rem;color:var(--muted)}
.langs{display:flex;gap:6px}
.langs{margin-inline-start:auto}.langs .lang{margin:0}
@media (max-width:480px){.langs{gap:4px}.langs .lang{padding:4px 8px;font-size:.8rem}}

/* شريط الإعلان والأدوات المميّزة */
.announce{background:#e7f2ee;color:#0b4f3e;border-bottom:1px solid #cfe5dc}
.announce.a-warn{background:#fff4dc;color:#6b4a00;border-color:#f1dfb2}
.announce.a-ok{background:#e9f4ff;color:#0b3c66;border-color:#cfe3f7}
.announce .wrap{display:flex;align-items:center;gap:10px;padding-block:9px}
.announce p{margin:0;flex:1;font-size:.93rem;line-height:1.5}
.announce a{color:inherit;font-weight:700;text-decoration:underline}
.ann-x{background:none;border:0;font-size:1.3rem;line-height:1;cursor:pointer;color:inherit;padding:4px 8px;opacity:.7}
.featsec{margin-top:26px}
.featsec .cat-h{display:flex;align-items:center;justify-content:space-between}
@media (prefers-color-scheme:dark){.announce{background:#12352c;color:#bfe9d9;border-color:#1f4a3d}.announce.a-warn{background:#3a2c0d;color:#f3d9a0;border-color:#4d3a12}.announce.a-ok{background:#0f2a40;color:#bcdcf5;border-color:#1b3e5a}}
/* المفضّلة، الإبلاغ، التضمين، التثبيت */
.ph-t{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ph-t h1{flex:1 1 auto;min-width:0}
.fav{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:99px;padding:6px 14px;font:inherit;font-size:.88rem;color:var(--ink);cursor:pointer}
.fav[aria-pressed=true]{border-color:var(--gold);color:var(--gold-ink);background:var(--gold-soft)}
.fav [aria-hidden]{font-size:1.1rem;line-height:1}
.calc-tools{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end;margin:10px 2px 0}
.linkish{background:none;border:0;padding:4px 0;font:inherit;font-size:.88rem;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.linkish:hover{color:var(--accent)}
.dlg{border:1px solid var(--line);border-radius:var(--radius);padding:22px;max-width:min(560px,calc(100vw - 32px));width:100%;background:var(--surface);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.25)}
.dlg::backdrop{background:rgba(10,20,15,.45)}
.dlg h2{margin:0 0 12px;font-size:1.15rem}
.dlg form,.dlg>div{display:grid;gap:12px}
.dlg label{display:grid;gap:6px;font-size:.92rem;font-weight:500}
.dlg textarea,.dlg input[type=email]{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:inherit;width:100%;box-sizing:border-box}
.dlg label.chk{display:flex;align-items:flex-start;gap:8px;font-weight:400;font-size:.88rem}
.rep-kinds{display:flex;flex-wrap:wrap;gap:8px}
.rep-kinds label{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:5px 12px;font-size:.86rem;cursor:pointer}
.rep-kinds label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.rep-msg{margin:0;font-size:.9rem}.rep-msg:empty{display:none}
.rep-msg.ok{color:var(--accent)}.rep-msg.bad{color:#b42318}
.dlg-b{display:flex;gap:8px;flex-wrap:wrap}
.emb-code{font:13px/1.5 ui-monospace,Menlo,Consolas,monospace;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:inherit;width:100%;box-sizing:border-box;resize:vertical}
.mine .cat-h{display:flex;align-items:center;justify-content:space-between}
.cat-intro{max-width:760px;margin:10px auto 0;color:var(--muted)}
.cat-intro p{margin:6px 0}
.install{margin-inline-start:10px;background:var(--accent);color:var(--accent-ink);border:0;border-radius:99px;padding:5px 14px;font:inherit;font-size:.85rem;cursor:pointer}
body.embed{background:var(--bg)}
.emb-main{padding:12px}
.emb-by{text-align:center;font-size:.85rem;color:var(--muted);margin:14px 0 4px}
.emb-by a{color:var(--accent);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.emb-by .ic{width:16px;height:16px}
@media print{.calc-tools,.fav,.dlg,.install{display:none!important}}
.calc[style*="--hm"]:not(.live){min-height:var(--hm)}
@media(min-width:900px){.calc[style*="--hd"]:not(.live){min-height:var(--hd)}}
