@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-arabic-400-normal.e0c1f86d03.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}
@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-arabic-600-normal.5230c084e3.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}
@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-arabic-700-normal.cc70fda83e.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}
@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-latin-400-normal.7664b676c7.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-latin-600-normal.0c2238d522.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Readex Pro';src:url(/a/readex-pro-latin-700-normal.d47d4c818f.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Tektur';src:url(/a/tektur-latin-600-normal.f1c690d48f.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Tektur';src:url(/a/tektur-latin-800-normal.4855f878ca.woff2) format('woff2');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'JetBrains Mono';src:url(/a/jetbrains-mono-latin-400-normal.3ae6215182.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'JetBrains Mono';src:url(/a/jetbrains-mono-latin-600-normal.081a377d6a.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;}
:root{--navy:#0B1B3F;--panel:#13254F;--deep:#071230;--silver:#C7CCD1;--dsilver:#8A929B;--pink:#E8175D;--pinkd:#B0104A;--yellow:#FFC93C;--teal:#2EC4B6;--teald:#0E6E66;--stamp:#1B3A8C;
--paper:#F3F5F8;--card:#FFFFFF;--ink:#0B1B3F;--muted:#56627A;--line:#D6DCE4;--soft:#E9EDF2;--ok:#0E8A5F;--okbg:#E6F6EF;--bad:#C0263F;--badbg:#FDECEF;--wait:#8A6100;--waitbg:#FFF4D6;
--ar:'Readex Pro',system-ui,'Segoe UI',Tahoma,sans-serif;--en:'Readex Pro',system-ui,'Segoe UI',sans-serif;--disp:'Tektur','Readex Pro',sans-serif;--mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
--barh:58px;--r:12px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--barh) + 14px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--ar);font-size:16.5px;line-height:1.8}
html[data-lang=en] body{line-height:1.62}
html[data-lang=ar] .en,html[data-lang=en] .ar{display:none!important}
a{color:var(--pinkd);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--pink)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;border-radius:4px}
code,pre,kbd,.ui{font-variant-ligatures:none;font-feature-settings:'liga' 0,'calt' 0}
code{font-family:var(--mono);font-size:.86em;background:var(--soft);padding:.08em .38em;border-radius:5px;unicode-bidi:isolate;white-space:normal;overflow-wrap:anywhere}
kbd{font-family:var(--mono);font-size:.82em;border:1px solid var(--line);border-bottom-width:3px;border-radius:6px;padding:0 .4em;background:#fff;unicode-bidi:isolate}
.ui{font-family:var(--mono);font-size:.8em;font-weight:600;background:var(--navy);color:#fff;padding:.12em .5em;border-radius:5px;unicode-bidi:isolate;white-space:nowrap}
.n{white-space:nowrap;unicode-bidi:isolate}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* ---------- top bar */
.bar{position:sticky;top:0;z-index:40;height:var(--barh);background:var(--navy);color:#fff;display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:3px solid var(--pink)}
.lockup{display:inline-flex;align-items:center;gap:8px;direction:ltr;unicode-bidi:isolate;color:inherit;text-decoration:none}
.lockup .wm{font-family:var(--disp);font-weight:800;line-height:1;font-size:22px;letter-spacing:.01em}
.bar .ttl{flex:1;min-width:0;font-size:.92rem;color:var(--silver);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar .ttl b{color:#fff;font-weight:600}
.bar .tools{display:flex;align-items:center;gap:6px}
.bar button,.bar .bb{border:1px solid #33467A;background:var(--panel);color:#fff;border-radius:8px;padding:5px 11px;font-size:.84rem;cursor:pointer;line-height:1.4;text-decoration:none}
.bar button[aria-pressed=true]{background:var(--pink);border-color:var(--pink)}
.bar .goto{display:flex;align-items:center;background:var(--panel);border:1px solid #33467A;border-radius:8px;padding:0 4px 0 8px}
.bar .goto input{width:86px;background:transparent;border:0;color:#fff;font:600 .86rem var(--mono);padding:5px 4px;outline:0}
.bar .goto input::placeholder{color:#8EA0C8;font-family:var(--ar);font-weight:400}
.bar .goto button{border:0;background:transparent;padding:4px 6px}
.bar .menu{display:none}
/* ---------- layout: top bar, horizontal page bar, one centred column */
.bar .back{display:inline-flex;align-items:center;gap:6px;border:1px solid #33467A;background:var(--panel);color:#fff;border-radius:8px;padding:5px 10px;font-size:.86rem;cursor:pointer;flex:none}
.bar .back[disabled]{opacity:.4;cursor:default}
.bar .lic{display:inline-flex;align-items:center;gap:6px}
.bar .lic .lic-ic{font-weight:800}
.bar .menu{display:inline-block}
nav.tabs{position:sticky;top:var(--barh);z-index:39;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 2px 10px rgba(11,27,63,.05)}
nav.tabs .in{display:flex;gap:4px;overflow-x:auto;padding:7px 14px;max-width:1080px;margin:0 auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
nav.tabs a{flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:999px;color:var(--ink);text-decoration:none;font-size:.9rem;white-space:nowrap;line-height:1.4}
nav.tabs a:hover{background:var(--soft);color:var(--ink)}
nav.tabs a.on{background:var(--navy);color:#fff}
nav.tabs a .ic{font-size:.95rem}
nav.tabs a .chip{padding:0 7px;font-size:.72rem}
.shell{max-width:1080px;margin:0 auto;padding:0 18px}
main{min-width:0;padding:22px 0 40px;max-width:900px;margin:0 auto}
footer.foot{max-width:900px;margin:0 auto 90px;padding:16px 0 0;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
footer.foot b{color:var(--ink)}
footer.foot .lnk{border:0;background:none;color:var(--pinkd);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.pages a{display:grid;grid-template-columns:28px 1fr;gap:2px 8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);background:#fff}
.pages a:hover{border-color:var(--navy);color:var(--ink)}
.pages a .ic{grid-row:span 2;font-size:1.2rem}
.pages a b{font-size:.95rem}
.pages a span.d{font-size:.8rem;color:var(--muted);line-height:1.45}
@media (max-width:980px){
 .bar .ttl{display:none}
 .shell{padding:0 12px}
 main{padding-top:16px}
}
@media (max-width:560px){
 .bar{gap:6px;padding:0 8px}
 .bar .goto{display:none}
 .bar .back .bl,.bar .lic .lic-t{display:none}
 .bar button,.bar .bb{padding:5px 9px}
 .lockup .wm{font-size:18px}
 nav.tabs .in{padding:6px 8px}
 nav.tabs a{padding:6px 11px;font-size:.86rem}
}
/* ---------- cards & headings */
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:0 0 18px}
@media (max-width:640px){.card{padding:18px 15px;border-radius:13px}}
h1.pg{font-size:1.6rem;line-height:1.35;margin:4px 0 6px}
html[data-lang=en] h1.pg{font-family:var(--disp);font-weight:800}
.pgsub{color:var(--muted);margin:0 0 16px}
.card h2{font-size:1.25rem;margin:0 0 10px;line-height:1.4}
html[data-lang=en] .card h2{font-family:var(--disp);font-weight:700}
h3{font-size:1.12rem;margin:26px 0 8px;line-height:1.45}
h4{font-size:1rem;margin:18px 0 6px}
p{margin:.5em 0 .85em;max-width:72ch}
ul,ol{padding-inline-start:1.4em;margin:.4em 0 1em}
li{margin:.25em 0}
.muted{color:var(--muted)}
.small{font-size:.88rem}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:700px){.grid2,.grid3{grid-template-columns:1fr}}
/* ---------- buttons, inputs, chips */
.btn{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:10px;padding:9px 16px;font-weight:600;font-size:.93rem;cursor:pointer;text-decoration:none;line-height:1.35;background:var(--navy);color:#fff}
.btn:hover{background:var(--panel);color:#fff}
.btn.pink{background:var(--pink)}.btn.pink:hover{background:var(--pinkd)}
.btn.teal{background:var(--teal);color:var(--navy)}.btn.teal:hover{background:#25A99D}
.btn.wa{background:#1FA855}.btn.wa:hover{background:#178a45}
.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}.btn.ghost:hover{background:var(--soft)}
.btn.sm{padding:5px 11px;font-size:.85rem;border-radius:8px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
label.f{display:block;font-weight:600;font-size:.92rem;margin:12px 0 4px}
.inp,select.inp,textarea.inp{width:100%;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:#fff;font-size:.95rem}
textarea.inp{min-height:96px;resize:vertical;line-height:1.6}
textarea.code{font:14px/1.55 var(--mono);direction:ltr;text-align:left;min-height:150px;tab-size:4;white-space:pre;background:#0E1B3D;color:#EAF0F6;border-color:#22325E}
.inp:focus{outline:2px solid var(--yellow);border-color:var(--yellow)}
.chip{display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:1px 10px;font-size:.8rem;font-weight:600;white-space:nowrap;background:var(--soft);color:var(--muted);line-height:1.6}
.chip.ok{background:var(--okbg);color:var(--ok)}
.chip.bad{background:var(--badbg);color:var(--bad)}
.chip.wait{background:var(--waitbg);color:var(--wait)}
.chip.info{background:#E7ECF7;color:var(--stamp)}
.chip.pink{background:#FFE3EC;color:#9C0E40}
.chip.lock{background:#ECEFF3;color:#7A8597}
.code-badge{font:700 .82rem var(--mono);background:var(--navy);color:#fff;border-radius:7px;padding:2px 8px;direction:ltr;unicode-bidi:isolate}
/* ---------- progress */
.pbar{height:9px;background:var(--soft);border-radius:9px;overflow:hidden}
.pbar>i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--pink));border-radius:9px}
html[dir=rtl] .pbar>i{margin-inline-start:0}
.ring{--p:0;width:86px;height:86px;border-radius:50%;background:conic-gradient(var(--pink) calc(var(--p)*1%),var(--soft) 0);display:grid;place-items:center;flex:none}
.ring b{width:68px;height:68px;border-radius:50%;background:#fff;display:grid;place-items:center;font:800 .95rem/1.15 var(--disp);text-align:center}
/* ---------- lesson content */
.lesson-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:4px}
.crumb{font-size:.86rem;color:var(--muted)}
.lmeta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.86rem;color:var(--muted);margin:6px 0 14px}
.goals{background:#F0FBFA;border:1px solid #CDEFEB;border-radius:12px;padding:10px 16px;margin:10px 0 18px}
.goals b{display:block;font-size:.88rem;color:var(--teald)}
.goals ul{margin:4px 0 0}
.lbody>*:first-child{margin-top:0}
ol.steps{list-style:none;padding:0;margin:.6em 0 1.2em;counter-reset:st}
ol.steps>li{position:relative;padding:10px 0;padding-inline-start:44px;border-bottom:1px dashed var(--line);margin:0;counter-increment:st}
ol.steps>li::before{content:counter(st);position:absolute;inset-inline-start:0;top:11px;width:30px;height:30px;border-radius:50%;background:var(--pink);color:#fff;font-weight:700;display:grid;place-items:center;font-size:.9rem}
ol.steps>li:last-child{border-bottom:0}
.tw{overflow-x:auto;margin:12px 0 18px;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:.93rem;line-height:1.55}
th,td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:start;vertical-align:top}
thead th{background:var(--navy);color:#fff;font-weight:600;border-bottom:0}
tbody tr:nth-child(even) td{background:#F8FAFC}
.call{border-radius:12px;padding:11px 15px;margin:14px 0;border:1px solid var(--line);background:#F7F9FB;border-inline-start:5px solid var(--dsilver)}
.call .cl{display:block;font-size:.83rem;margin-bottom:2px}
.call.warn{border-inline-start-color:var(--pink);background:#FFF4F7}.call.warn .cl{color:var(--pinkd)}
.call.tip{border-inline-start-color:var(--teal);background:#F0FBFA}.call.tip .cl{color:var(--teald)}
.call.idea{border-inline-start-color:var(--yellow);background:#FFFBEF}.call.idea .cl{color:var(--wait)}
.call.safe{border-inline-start-color:var(--stamp);background:#EEF2FB}.call.safe .cl{color:var(--stamp)}
.call.fact{border-inline-start-color:var(--navy);background:#F4F6FA}
.cmd{margin:10px 0 14px}
.cmd .where{font-size:.82rem;color:var(--muted);margin-bottom:4px}
.cb{position:relative;background:var(--panel);border-radius:10px}
.cb pre{margin:0;padding:14px 16px;padding-right:80px;color:#EAF0F6;font:14px/1.6 var(--mono);overflow-x:auto;white-space:pre;text-align:left}
.cb pre code{background:none;padding:0;color:inherit;font-size:inherit;white-space:pre}
.copy{position:absolute;top:8px;right:8px;font:600 .78rem var(--ar);background:var(--yellow);color:var(--navy);border:0;border-radius:7px;padding:4px 10px;cursor:pointer}
.out{margin-top:6px;border:1px dashed var(--dsilver);border-radius:10px;padding:8px 12px;background:#FBFCFD}
.out .ol{font-size:.8rem;color:var(--muted)}
.out pre{margin:4px 0 0;font:13px/1.55 var(--mono);white-space:pre;overflow-x:auto;text-align:left}
.fig{margin:16px 0 20px}
.fig img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:zoom-in}
.fig figcaption{font-size:.88rem;color:var(--muted);margin-top:6px;line-height:1.55}
.fig .cr{display:block;font-size:.76rem;color:var(--dsilver)}
.fig.svg svg{display:block;width:100%;height:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
svg{direction:ltr}
.slot{display:flex;gap:14px;border:2px dashed var(--pink);border-radius:12px;padding:12px 16px;margin:12px 0 16px;background:#FFF8FA;font-size:.92rem;line-height:1.55}
.slot-ic{color:var(--pink);flex:none}
.slot .fn{font-size:.84rem;color:var(--muted);margin-top:4px}
.win{border-radius:10px;overflow:hidden;border:1px solid #9AA6B5;margin:12px 0 4px;font:13.5px/1.55 var(--mono);text-align:left}
.wbar{display:flex;align-items:center;gap:10px;background:#E6E9EE;color:#222;padding:5px 10px;font:12.5px var(--en)}
.wbar .dots{display:flex;gap:5px}.wbar .dots i{width:10px;height:10px;border-radius:50%;background:#C4CAD3}
.wbar .wt{flex:1}
.wbody{padding:12px 14px;white-space:pre-wrap;word-break:break-word}
.win.ps .wbody{background:#012456;color:#EEEDF0}
.win.ubuntu .wbody{background:#300A24;color:#F2F2F2}
.win.light .wbody{background:#fff;color:#1d1d1d;font-family:var(--en);white-space:normal}
.win .hl{outline:3px solid var(--pink);outline-offset:3px;border-radius:4px}
.wnote{font-size:.85rem;color:var(--muted);margin-bottom:12px}
.resbox{margin:22px 0 8px;border:1px solid var(--line);border-radius:12px;padding:12px 16px;background:#FBFCFE}
.resbox .rh{font-weight:700;font-size:.92rem}
ul.res{list-style:none;padding:0;margin:6px 0 0}
ul.res li{display:grid;grid-template-columns:auto auto 1fr;gap:2px 10px;align-items:start;padding:8px 0;border-bottom:1px solid var(--soft);margin:0}
ul.res li:last-child{border-bottom:0}
.rk{font-size:.74rem;font-weight:600;border-radius:5px;padding:1px 7px;background:var(--soft);white-space:nowrap}
.rk.video{background:#FFE3EC;color:#9C0E40}.rk.course{background:#DDF4F2;color:var(--teald)}.rk.doc{background:#E7ECF7;color:var(--stamp)}.rk.interactive{background:#FFF1CC;color:#7A5600}.rk.tool{background:#EDE7F7;color:#4B2C8A}
.rl{font-family:var(--mono);font-size:.72rem;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:0 5px}
ul.res a{font-weight:600;word-break:break-word}
.rd{font-size:.87rem;color:var(--muted)}
.gl{border-bottom:2px dotted var(--teal);cursor:help}
.qc{border:1px solid #F1DFA6;background:#FFFCF2;border-radius:12px;padding:10px 14px;margin:14px 0}
.qc .qh{font-size:.8rem;font-weight:700;color:var(--wait)}
.qc .qq{font-weight:600;margin:2px 0 8px}
.qos{display:flex;flex-wrap:wrap;gap:8px}
.qo{border:1px solid var(--line);background:#fff;border-radius:9px;padding:6px 12px;cursor:pointer;font-size:.92rem}
.qo.right{background:var(--okbg);border-color:var(--ok);color:var(--ok);font-weight:600}
.qo.wrong{background:var(--badbg);border-color:var(--bad);color:var(--bad)}
.qx{margin-top:8px;font-size:.92rem}
.template{background:#F8FAFC;border:1px solid var(--line);border-radius:10px;padding:12px 14px;white-space:pre-line;font-size:.93rem}
/* ---------- tasks */
.task{border:1px solid var(--line);border-radius:16px;background:#fff;margin:22px 0;overflow:hidden}
.task>header{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;background:var(--navy);color:#fff;padding:11px 16px}
.task>header .tt{font-weight:700;flex:1;min-width:180px}
.task>header .chip{background:rgba(255,255,255,.14);color:#fff}
.task>header .chip.ok{background:var(--teal);color:var(--navy)}
.task>header .chip.wait{background:var(--yellow);color:var(--navy)}
.task>header .chip.bad{background:var(--pink);color:#fff}
.task .tb{padding:14px 18px 18px}
.task .why{font-size:.9rem;color:var(--muted);margin:0 0 10px}
.titem{border-top:1px dashed var(--line);padding:14px 0 6px}
.titem:first-of-type{border-top:0;padding-top:4px}
.titem .q{font-weight:600;margin-bottom:8px}
.titem .qn{font:700 .8rem var(--mono);color:var(--pink);margin-inline-end:6px}
.opts{display:grid;gap:7px}
.opt{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;cursor:pointer;background:#fff;line-height:1.5}
.opt input{margin-top:5px;accent-color:var(--pink)}
.opt:has(input:checked){border-color:var(--navy);background:#F4F6FB}
.fb{margin-top:8px;font-size:.9rem;border-radius:9px;padding:7px 11px}
.fb.ok{background:var(--okbg);color:var(--ok)}
.fb.bad{background:var(--badbg);color:var(--bad)}
.fb.wait{background:var(--waitbg);color:var(--wait)}
.howto{margin:14px 0 4px;border:1px solid #CDEFEB;border-radius:12px;background:#F4FCFB}
.howto summary{cursor:pointer;padding:8px 14px;font-weight:600;color:var(--teald)}
.howto ol{margin:0 0 10px}
.tact{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border-top:1px solid var(--line);margin-top:14px;padding-top:14px}
.tstat{font-size:.88rem;color:var(--muted);flex:1;min-width:180px}
.locked{position:relative}
.lockbox{border:2px dashed var(--line);border-radius:14px;padding:22px;text-align:center;color:var(--muted);background:#fff}
.lockbox .big{font-size:2rem}
.att{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.att .af{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:9px;padding:4px 10px;font-size:.85rem;background:#FBFCFE}
.att .af img{width:38px;height:38px;object-fit:cover;border-radius:6px}
/* ---------- term + python */
.term{background:#300A24;color:#F2F2F2;border-radius:12px;font:14px/1.55 var(--mono);padding:10px 12px;min-height:220px;max-height:360px;overflow:auto;direction:ltr;text-align:left}
.term .pr{color:#8AE234;font-weight:600}.term .pa{color:#729FCF;font-weight:600}
.term .ln{white-space:pre-wrap;word-break:break-word}
.term input{background:transparent;border:0;outline:0;color:#fff;font:inherit;width:60%;caret-color:#fff}
.pyout{background:#0E1B3D;color:#DDE6F3;border-radius:10px;padding:10px 12px;font:13.5px/1.55 var(--mono);white-space:pre-wrap;direction:ltr;text-align:left;min-height:44px;margin-top:8px}
.pyout .err{color:#FF8FA9}
/* ---------- dialogs, toasts */
dialog.dlg{border:0;border-radius:18px;padding:0;max-width:min(560px,94vw);width:100%;box-shadow:0 20px 60px rgba(7,18,48,.35)}
dialog.dlg::backdrop{background:rgba(7,18,48,.6)}
dialog.dlg .dh{background:var(--navy);color:#fff;padding:14px 18px;display:flex;align-items:center;gap:10px;border-bottom:3px solid var(--pink)}
dialog.dlg .dh b{flex:1}
dialog.dlg .dh button{background:transparent;border:0;color:#fff;font-size:1.3rem;cursor:pointer;line-height:1}
dialog.dlg .db{padding:16px 20px 20px;max-height:76vh;overflow:auto}
dialog.lb{border:0;padding:0;background:transparent;max-width:96vw;max-height:94vh}
dialog.lb::backdrop{background:rgba(11,27,63,.88)}
dialog.lb img{max-width:96vw;max-height:88vh;display:block;border-radius:10px;background:#fff}
dialog.lb button{position:fixed;top:14px;right:14px;font:600 1rem var(--ar);background:var(--yellow);border:0;border-radius:8px;padding:6px 14px;cursor:pointer}
.toast{position:fixed;bottom:24px;left:0;right:0;margin:0 auto;width:max-content;max-width:calc(100vw - 32px);background:var(--navy);color:#fff;padding:10px 18px;border-radius:12px;z-index:60;box-shadow:0 8px 30px rgba(7,18,48,.3);font-size:.92rem;text-align:center}
.gpop{position:absolute;z-index:55;max-width:300px;background:var(--navy);color:#fff;border-radius:12px;padding:10px 14px;font-size:.88rem;line-height:1.55;box-shadow:0 8px 30px rgba(7,18,48,.3)}
.gpop b{color:var(--yellow);display:block}
/* ---------- license */
.lic-card{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center}
.lic-card .nm{font-family:var(--disp);font-weight:800;font-size:1.3rem;color:var(--navy);direction:ltr;text-align:start}
.lic-card .ct{font-family:var(--mono);font-size:.86rem;direction:ltr;text-align:start}
html[dir=rtl] .lic-card .nm,html[dir=rtl] .lic-card .ct{text-align:right}
.lic-card .role{color:var(--muted)}
.lic-card .rights{font-size:.82rem;color:var(--muted);margin-top:10px;border-top:1px solid var(--soft);padding-top:8px}
@media (max-width:520px){.lic-card{grid-template-columns:1fr;justify-items:start}}
/* ---------- print */
@media print{
 .bar,nav.tabs,footer.foot,.tact,.copy,.noprint{display:none!important}
 body{background:#fff;font-size:12pt}
 .shell{display:block;padding:0}
 main{padding:0;max-width:none}
 .card,.task{break-inside:avoid;border-color:#bbb}
}
/* course-specific layout pieces */
.hero h1.pg{font-size:1.75rem;margin-top:14px}
.orbit{margin:8px 0 18px}
.orbit svg{display:block;width:100%;height:auto}
.stages{display:grid;gap:8px}
.stg{display:grid;grid-template-columns:34px 1fr 110px auto;gap:10px;align-items:center;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:#fff}
.stg .sn{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font:800 .95rem var(--disp);background:var(--soft);color:var(--muted)}
.stg.open .sn{background:var(--pink);color:#fff}
.stg.done .sn{background:var(--teal);color:var(--navy)}
.stg.lock{opacity:.7}
.stg .stt{font-weight:600;line-height:1.4}
@media (max-width:560px){.stg{grid-template-columns:30px 1fr;}.stg .pbar,.stg .small{grid-column:2}}
.sess{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line)}
.sess:last-of-type{border-bottom:0}
.sess .sd{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--navy);color:#fff;border-radius:10px;padding:4px 0;line-height:1.3;font-size:.86rem}
.sess .sd b{font-size:.8rem;color:var(--yellow)}
.sess.clinic .sd{background:var(--soft);color:var(--muted)}.sess.clinic .sd b{color:var(--muted)}.sess.review .sd{background:var(--teald)}.sess.launch .sd{background:var(--pinkd)}
.sess.physics .sd{background:var(--stamp)}.sess.exam .sd{background:var(--pink)}
.past{opacity:.55}
.gate{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:7px 0;border-bottom:1px dashed var(--line)}
.gate:last-child{border-bottom:0}
.gate .gn{width:30px;height:30px;border-radius:50%;border:3px solid var(--pink);display:grid;place-items:center;font:800 .85rem var(--disp);color:var(--pink);background:#fff}
.lrow{display:flex;align-items:center;gap:10px;padding:9px 6px;border-bottom:1px solid var(--soft);text-decoration:none;color:var(--ink);flex-wrap:wrap}
.lrow:hover{background:#F8FAFC}
.lrow .lt{flex:1;min-width:150px;line-height:1.45}
.lrow.dis{color:var(--muted)}
.lrow .ic{width:22px;text-align:center}
.chh{font-size:.8rem;font-weight:700;color:var(--teald);margin:14px 0 2px;padding-inline-start:6px}
.stage-card.focus{border-color:var(--pink);box-shadow:0 0 0 2px #FFE3EC}
.lessons{margin-top:6px}
.lnav{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 18px}
.card.next{border:2px solid var(--pink)}
.card.next h2{color:var(--pinkd)}
.card.sent{border:2px solid #1FA855}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:8px 0 14px}
.kv dt{font-weight:600}.kv dd{margin:0}
.gro{padding:8px 0;border-bottom:1px solid var(--soft)}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:700px){.twocol{grid-template-columns:1fr}}
/* v1 compatibility (reference pages built from the v1 guides) */
ol.steps>li .sn{display:none}
ol.chain{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:14px 0 18px}
ol.chain li{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0;display:flex;gap:10px;align-items:flex-start;font-size:.93rem;line-height:1.5}
.cn{flex:none;width:26px;height:26px;border-radius:7px;background:var(--teal);color:var(--navy);font-weight:700;display:grid;place-items:center;font-size:.85rem}
.fig .zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.fig .credit{display:block;font-size:.76rem;color:var(--dsilver)}
.fig.narrow{max-width:420px}
.svgfig svg{display:block;width:100%;height:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
.svgfig{overflow-x:auto}
@media (max-width:640px){.svgfig svg.kmap{min-width:620px}}
svg .tl-d{font:600 21px var(--disp);fill:var(--navy)}
svg .tl-g{font:700 15px var(--disp);fill:var(--pink)}
svg .tl-l{font:500 15px var(--en);fill:var(--muted)}
svg .ax{font:13px var(--mono);fill:var(--muted)}
svg .axl{font:600 14px var(--mono);fill:var(--navy)}
svg .mk{font:700 15px var(--mono);fill:var(--pink)}
svg .mt{font:600 16px var(--ar);fill:var(--navy)}
svg .sl{font:700 15px var(--mono);fill:#0E6E66}
svg .sp{font:700 16px var(--mono);fill:var(--pink)}
svg .th{font:600 17px var(--ar);fill:var(--navy)}
svg .tdv{font:400 17px var(--ar);fill:var(--ink)}
.kleg{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.86rem;color:var(--muted);margin-top:6px}
.kleg i{display:inline-block;width:13px;height:13px;margin-inline-end:6px;vertical-align:-2px}
.lg-dock{background:var(--yellow);border:1.5px solid var(--navy);border-radius:3px}
.lg-start{background:var(--pink);border-radius:50%}
.lg-mk{background:var(--navy);box-shadow:inset 0 0 0 4px var(--navy),inset 0 0 0 7px #fff}
.sph{display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:18px;align-items:center}
.sph svg{border:0!important}
@media (max-width:640px){.sph{grid-template-columns:1fr}}
.kt{font-weight:600;font-size:.9rem;margin:6px 0 4px}
.tool{border:1px solid var(--line);border-inline-start:5px solid var(--teal);border-radius:12px;padding:14px 16px;margin:14px 0;background:#fff}
.tool header{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:6px}
.tool h4{margin:0;font-family:var(--disp);font-weight:600;font-size:1.05rem}
.tool .kind{font-size:.82rem;color:var(--muted);background:var(--soft);border-radius:6px;padding:1px 8px}
.tool .links{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.tool .links .btn{padding:5px 11px;font-size:.84rem}
.tl{font-size:.83rem;font-weight:700;color:var(--pink);margin:12px 0 2px}
.wcap{font-size:.8rem;color:var(--dsilver);margin-bottom:12px}
.win .cbx{display:inline-block;width:14px;height:14px;border:2px solid #333;border-radius:3px;vertical-align:-2px;margin-right:6px}
.win .cbx.on{background:#0067C0;border-color:#0067C0;box-shadow:inset 0 0 0 2px #fff}
.win .wbtnm{display:inline-block;border:1px solid #888;border-radius:5px;padding:4px 14px;margin:6px 6px 0 0;background:#F3F3F3}
.win.installer .wbody,.win.browser .wbody,.win.dialog .wbody{background:#fff;color:#1d1d1d;font-family:var(--en);white-space:normal}
.win.ubuntu .pr{color:#8AE234;font-weight:600}.win.ubuntu .pa{color:#729FCF;font-weight:600}
.wbtn{width:22px;text-align:center;color:#555}
table.gloss td:first-child{white-space:nowrap}
.mono td{font-family:var(--mono);font-size:.86rem}
/* lesson illustrations */
.icards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:12px 0 18px}
.icard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;line-height:1.55}
.icard .ii{font-size:1.9rem;line-height:1;margin-bottom:6px}
.icard b{display:block;margin-bottom:2px}
ol.flow{list-style:none;padding:0;margin:12px 0 18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;counter-reset:fl}
ol.flow li{counter-increment:fl;position:relative;background:var(--navy);color:#fff;border-radius:12px;padding:12px 12px 12px;margin:0;font-size:.9rem;line-height:1.45}
ol.flow li::before{content:counter(fl);position:absolute;top:8px;inset-inline-end:10px;font:800 .8rem var(--disp);color:var(--yellow)}
ol.flow .fi{display:block;font-size:1.4rem;margin-bottom:4px}
pre.tree{background:#0E1B3D;color:#EAF0F6;border-radius:10px;padding:12px 16px;font:14px/1.6 var(--mono);text-align:left;overflow-x:auto;margin:8px 0}
.pathparts{display:flex;flex-wrap:wrap;align-items:center;gap:2px;font:600 .95rem var(--mono);margin:10px 0 2px;direction:ltr}
.pathparts .pp{background:var(--soft);border-radius:6px;padding:3px 8px}
.pathparts .pp.d{background:#E7ECF7;color:var(--stamp)}.pathparts .pp.u{background:#FFF1CC;color:#7A5600}.pathparts .pp.k{background:#DDF4F2;color:var(--teald)}.pathparts .pp.f{background:#FFE3EC;color:#9C0E40}
.pathparts .ps{color:var(--muted);padding:0 2px}
/* ---------- «رحلتي» */
.jstrip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:12px}
.jstrip a{display:flex;flex-direction:column;gap:2px;padding:8px 8px;border-radius:12px;border:1px solid var(--line);text-decoration:none;color:var(--ink);background:#fff;line-height:1.3;min-width:0}
.jstrip a b{font:800 1.1rem var(--disp)}
.jstrip a span{font-size:.78rem;overflow:hidden;text-overflow:ellipsis}
.jstrip a.done{background:var(--okbg);border-color:#BFE6D3}
.jstrip a.cur{background:var(--navy);color:#fff;border-color:var(--navy)}
.jstrip a.cur .small{color:var(--silver)}
@media (max-width:700px){.jstrip{grid-template-columns:repeat(4,minmax(0,1fr))}}
.jstage.cur{border:2px solid var(--pink)}
ul.jdo{margin:4px 0 10px;padding-inline-start:20px}
ul.jdo li{margin:3px 0}
.sess.opt{opacity:.92}
.sess .row .btn{margin-top:4px}
details.fq{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:0 0 8px;background:#fff}
details.fq summary{cursor:pointer;font-weight:600;line-height:1.5}
details.fq[open]{border-color:var(--navy)}
details.fq div{margin:8px 0}
.card.jlink{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--ink);border:2px solid var(--teal)}
.card.jlink:hover{color:var(--ink);background:#F0FBFA}
/* consoles: manager + supervisor */
body.console .bar{border-bottom-color:var(--yellow)}
body.console.sup .bar{border-bottom-color:var(--teal)}
.rolebadge{font:700 .74rem var(--mono);letter-spacing:.02em;border-radius:6px;padding:2px 8px;background:var(--yellow);color:var(--navy);white-space:nowrap}
body.sup .rolebadge{background:var(--teal)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:14px}
.kpi{display:flex;flex-direction:column;gap:2px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 14px;text-decoration:none;color:var(--ink)}
.kpi:hover{border-color:var(--navy);color:var(--ink)}
.kpi b{font:800 1.7rem/1.1 var(--disp);direction:ltr;unicode-bidi:isolate;text-align:start}
.kpi span{font-size:.84rem;color:var(--muted);line-height:1.4}
.drop{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;border:2px dashed var(--dsilver);border-radius:14px;padding:22px 14px;background:#FAFBFD;cursor:pointer}
.drop.over,.drop:hover{border-color:var(--pink);background:#FFF4F7}
.drop .big{font-size:2rem;line-height:1}
.card.sheet.done{opacity:.72}
.srow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--soft)}
.srow .lt{flex:1;min-width:160px;line-height:1.45}
.srow .acts{display:flex;gap:4px}
.srow .acts .btn{padding:4px 9px}
.gatebox{border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:#FAFBFD}
.gatebox>b{font:700 .95rem var(--mono)}
table.matrix{font-size:.86rem}
table.matrix th{white-space:nowrap;font-size:.78rem}
table.matrix td{text-align:center;white-space:nowrap}
table.matrix td:first-child{text-align:start}
table.matrix td.cell.ok{background:var(--okbg)}table.matrix td.cell.redo,table.matrix td.cell.late{background:var(--badbg)}table.matrix td.cell.recv{background:var(--waitbg)}
table.matrix td.mc{background:color-mix(in srgb,var(--teal) calc(var(--v) * .45%),#fff);font-weight:600}
.tlwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
svg.gantt{min-width:720px;width:100%;height:auto;display:block}
svg.gantt .tl{font:700 15px var(--mono);fill:var(--ink)}
svg.gantt .tm{font:600 12px var(--mono);fill:var(--muted)}
.sheetview section{border-bottom:1px dashed var(--line);padding:8px 0}
.sheetview .qh{font-weight:600}
.sheetview pre{direction:ltr;text-align:left;background:var(--navy);color:#EAF0F6;border-radius:8px;padding:8px 10px;white-space:pre-wrap;font:13px/1.5 var(--mono)}
.sheetview img{max-width:100%;border-radius:8px;border:1px solid var(--line)}
.sheetview .ok{color:var(--ok)}.sheetview .bad{color:var(--bad)}
.sheetview table td{border:1px solid var(--soft);padding:3px 8px}
.guide h2{font-size:1.3rem}
.guide .sec{margin:0}
.guide .secn{display:inline-block;font:800 .9rem var(--disp);background:var(--navy);color:#fff;border-radius:7px;padding:1px 8px;margin-inline-end:8px;vertical-align:middle}
.flowmap{display:grid;gap:10px;margin:14px 0}
.flowmap .fl{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}
.flowmap .fl .k{font:800 1rem var(--disp);background:var(--navy);color:#fff;border-radius:8px;text-align:center;line-height:30px;height:30px}
.flowmap .fl .w{font-size:.8rem;color:var(--muted)}
.permtbl td:nth-child(2),.permtbl td:nth-child(3){text-align:center;font-size:1.05rem}
.memwarn{background:var(--waitbg);color:var(--wait);border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:.9rem}
@media (max-width:560px){.kpi b{font-size:1.4rem}.srow .acts{width:100%;justify-content:flex-end}}
.cmd.msg pre{font-family:var(--ar);font-size:.93rem;line-height:1.75;font-variant-ligatures:normal;font-feature-settings:normal}
svg.gantt{direction:ltr}
.card.sheet .chip{white-space:normal;max-width:100%}
.cmd.msg pre{overflow-wrap:anywhere;word-break:break-word}
.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:start}
@media (max-width:1000px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.board{grid-template-columns:1fr}}
.board .col{background:var(--soft);border-radius:14px;padding:10px;min-width:0}
.board .col h3{margin:2px 4px 6px;font-size:1rem}
.pcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;margin:0 0 8px;display:flex;flex-direction:column;gap:4px;min-width:0;overflow-wrap:anywhere}
.pcard.pend{border-inline-start:4px solid var(--yellow)}
.pcard .row{gap:6px}
select.inp.sm,.inp.sm{padding:5px 8px;font-size:.85rem;width:auto;max-width:100%}
.note{border-bottom:1px dashed var(--line);padding:8px 0}
.note.private{opacity:.9}
details.tech{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-top:12px;background:#FAFBFD}
details.tech>summary{cursor:pointer;font-weight:700}
.vcard.done{border-color:#BFE6D3;background:#FBFEFC}
ol.vsteps{margin:6px 0 8px;padding-inline-start:22px}
ol.vsteps li{margin:3px 0}
.orbit .node circle{fill:#fff;stroke:#0B1B3F;stroke-width:3}.orbit .node .nn{font:800 22px Tektur,sans-serif;fill:#0B1B3F}.orbit .node .nd{font:600 15px 'JetBrains Mono',monospace;fill:#56627A}
.orbit .node.done circle{fill:#2EC4B6;stroke:#2EC4B6}.orbit .node.cur circle{fill:#E8175D;stroke:#E8175D}.orbit .node.cur .nn{fill:#fff}/* platform additions: sign-in, saving state, read-only banner, team board */
.center-card{max-width:560px;margin-inline:auto}
.code-in{font:600 1.35rem 'JetBrains Mono',monospace;letter-spacing:.08em;text-align:center;text-transform:uppercase}
.hp{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;border:0!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.savest{font-size:.82rem;padding:3px 10px;border-radius:999px;background:var(--line,#E9EDF2);color:var(--muted,#56627A)}
.savest[data-k="ok"]{background:#E3F8F5;color:#0E7C70}
.savest[data-k="bad"]{background:#FDE7EE;color:#B0124A}
.robar{position:sticky;top:0;z-index:5}
tr.me td{background:#FFF8E1}
.chip.sm{font-size:.72rem;padding:1px 7px}
label.busy{opacity:.55;pointer-events:none}
#who .chip{font-family:'JetBrains Mono',monospace}
.kv dd{word-break:break-word}
.att img[data-sp]{min-width:40px;min-height:30px;background:#E9EDF2}
.board .pcard .code{font:600 1rem 'JetBrains Mono',monospace;letter-spacing:.06em}
.codebox{font:700 1.5rem 'JetBrains Mono',monospace;letter-spacing:.1em;text-align:center;padding:14px;border:2px dashed #E8175D;border-radius:12px;background:#FFF5F8;direction:ltr;user-select:all}
.tbl-wrap{overflow-x:auto}
/* phones: keep the language switch on one line inside the bar */
.bar .langs{display:inline-flex;flex:none;white-space:nowrap}
.bar .lockup-link{min-width:0;flex:0 1 auto;overflow:hidden}
@media (max-width:420px){.bar{gap:4px;padding:0 6px}.bar .tools{gap:4px;flex:none}.bar button,.bar .bb{padding:5px 7px}.bar .langs button{padding:5px 6px}.rolebadge{padding:2px 5px}}
/* practice terminal (stage 2) */
.tw{display:grid;gap:8px}
.tw .term{min-height:240px;max-height:420px;cursor:text;padding:10px 12px 12px}
.tw .term .ln{min-height:1.55em}
.tw .term .er{color:#FF9DB3}.tw .term .arc{color:#EF5B5B;font-weight:600}.tw .term .mu{color:#B9A2B4;font-style:italic}
.tw .tin{display:flex;align-items:baseline;margin:0;white-space:pre}
.tw .tin .tp{flex:none;white-space:pre}
.tw .tin input{flex:1;min-width:40px;width:auto;padding:0}
.tw .tkeys{display:flex;flex-wrap:wrap;gap:6px}
.tw .tkeys button{font:600 .9rem var(--mono);min-width:44px;min-height:36px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--navy);cursor:pointer}
.tw .tkeys button:active{background:var(--line)}
.tw .tside{display:grid;gap:8px}
.tw .tgoals{border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:#FBFCFE}
.tw .tgoals ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.tw .tgoals li{color:var(--muted)}.tw .tgoals li.ok{color:var(--ok);font-weight:600}
.tw .tmap summary{cursor:pointer;font-weight:600}
.tw .tmap pre{font:13px/1.45 var(--mono);background:#F4F6FA;border-radius:10px;padding:8px 12px;margin:6px 0 0;overflow:auto;direction:ltr;text-align:left}
.tw .ttip{background:#FFF8E1;border-radius:10px;padding:8px 12px;font-size:.92rem}
@media (min-width:900px){.tw{grid-template-columns:minmax(0,1fr) 260px;align-items:start}.tw .term{grid-column:1}.tw .tkeys{grid-column:1;grid-row:2}.tw .tside{grid-column:2;grid-row:1/span 2}}
@media (max-width:600px){.tw .term{font-size:13px;min-height:200px;max-height:340px}.tw .tin input{font-size:16px}}
/* Python editor helpers and the "try it" boxes inside lessons */
.pykeys{display:inline-flex;gap:6px}
.pyplay{border:1px solid var(--line);border-radius:14px;padding:12px;margin:14px 0;background:#FBFCFE}
.pyplay .pyh{font-weight:600;font-size:.92rem;margin-bottom:6px}
.pyplay textarea.code{min-height:0}

/* dashboard tiles: two per row on phones instead of one long column */
@media (max-width:480px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.savest-g{position:fixed;top:8px;left:0;right:0;margin:0 auto;width:max-content;max-width:calc(100vw - 24px);background:#FDE7EE;color:#8A0E3A;border:1px solid #F5B5C8;padding:8px 14px;border-radius:12px;z-index:55;font-size:.88rem;line-height:1.5;box-shadow:0 6px 20px rgba(7,18,48,.15)}
.savest-g[hidden]{display:none}
/* server-graded tests */
.exbar{position:sticky;top:8px;z-index:20;display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;justify-content:space-between;padding:10px 14px}
.exbar b.bad,.exbar .bad{color:#B0124A}
.exq{padding:12px 0;border-bottom:1px solid var(--line,#E9EDF2)}
.exq:last-of-type{border-bottom:0}
.exq p{margin:0 0 8px}
.exq.ok{border-inline-start:4px solid #0E9F8E;padding-inline-start:10px}
.exq.bad{border-inline-start:4px solid #D63A6A;padding-inline-start:10px}
.exq .inp{max-width:260px}
pre.exc{direction:ltr;text-align:left;background:var(--navy,#0E1B3D);color:#EAF0F6;border-radius:8px;padding:10px 12px;margin:8px 0;white-space:pre;overflow-x:auto;font:14px/1.6 var(--mono,monospace);tab-size:4}
.exq code[dir=ltr]{unicode-bidi:isolate}
/* the certificate: A4 landscape, DexLab identity (navy, silver, the sun's yellow), prints edge to edge */
body.certmode #tabs,body.certmode .crumbs{display:none}
.cert-tools{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:12px auto;max-width:1123px}
.cert{width:min(100%,1123px);aspect-ratio:297/210;margin:0 auto 24px;background:#0B1B3F;color:#fff;border-radius:6px;position:relative;overflow:hidden;font-family:var(--ar);
  -webkit-print-color-adjust:exact;print-color-adjust:exact;container-type:inline-size}
.cert::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 12%,rgba(255,201,60,.22),transparent 28%),radial-gradient(circle at 8% 92%,rgba(46,196,182,.14),transparent 30%)}
.cert-frame{position:absolute;inset:2.4cqw;border:.25cqw solid #C7CCD1;border-radius:.8cqw;padding:3cqw 4.5cqw;display:flex;flex-direction:column;align-items:center;text-align:center}
.cert-head{width:100%;display:flex;justify-content:space-between;align-items:center}
.cert-logo svg{width:4.2cqw;height:4.2cqw}.cert-logo .wm{font-size:3.4cqw!important}
.cert-prog{font-family:var(--disp);font-size:1.5cqw;letter-spacing:.12em;color:#C7CCD1}
.cert-kicker{margin:3.2cqw 0 .4cqw;font-size:1.9cqw;color:#C7CCD1}
.cert-name{margin:0;font-size:4.6cqw;font-weight:700;line-height:1.25;color:#fff}
.cert[lang=en] .cert-name{font-family:var(--disp);letter-spacing:.02em}
.cert-body{margin:1.4cqw auto 0;max-width:62cqw;font-size:1.65cqw;line-height:1.7;color:#E4E8EE}
.cert-title{margin:1.8cqw 0 0;font-size:2.5cqw;font-weight:700;color:#FFC93C;line-height:1.3}
.cert[lang=en] .cert-title{font-family:var(--disp)}
.cert-foot{margin-top:auto;width:100%;display:grid;grid-template-columns:1fr 1.3fr auto auto;gap:2.2cqw;align-items:end;font-size:1.25cqw}
.cert-meta,.cert-sign,.cert-qr{display:flex;flex-direction:column;gap:.2cqw;color:#C7CCD1}
.cert-meta b,.cert-sign b{color:#fff;font-size:1.5cqw}
.cert-sign i{display:block;height:.15cqw;background:#C7CCD1;margin-bottom:.6cqw;width:80%;align-self:center}
.cert-seal{width:11cqw;aspect-ratio:1;background:#F3F5F8;border-radius:50%;display:grid;place-items:center}.cert-seal .stamp{width:96%;height:auto;display:block}
.cert-qr{align-items:center}.qrbox{background:#fff;border-radius:.6cqw;padding:.4cqw;width:9cqw}.qrbox svg{display:block;width:100%;height:auto}
.cert-qr b{font-family:'JetBrains Mono',monospace;font-size:1.15cqw;color:#fff;letter-spacing:.04em}
.cert-void{position:absolute;inset:0;display:grid;place-items:center;font-size:10cqw;font-weight:800;color:rgba(232,23,93,.55);transform:rotate(-14deg);pointer-events:none}
@media print{
  @page{size:A4 landscape;margin:0}
  html,body{background:#0B1B3F!important}
  body.certmode header:not(.cert-head),body.certmode nav,body.certmode #tabs,.cert-tools,.toast,#savest-g,footer:not(.cert-foot){display:none!important}
  body.certmode #main{padding:0!important;margin:0!important;max-width:none!important}
  .cert{width:297mm;height:210mm;aspect-ratio:auto;margin:0;border-radius:0;page-break-after:avoid}
}
.nb{white-space:nowrap}