:root{--bg:#fff8e7;--card:#fff;--ink:#1d2a4d;--sub:#5b6788;--sun:#ffb300;--sun2:#ff7a00;--blue:#2a5bd7;--line:#f1e2b8;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#121a33;--card:#1b2547;--ink:#f3f5ff;--sub:#aab4d6;--line:#2c3866}}
:root[data-theme="dark"]{--bg:#121a33;--card:#1b2547;--ink:#f3f5ff;--sub:#aab4d6;--line:#2c3866}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Tahoma,Arial,sans-serif;min-height:100vh}
nav{position:fixed;top:0;right:0;left:0;z-index:10;display:flex;gap:6px;justify-content:center;padding:calc(8px + env(safe-area-inset-top,0px)) 10px 8px;background:linear-gradient(90deg,var(--sun2),var(--sun));box-shadow:0 3px 14px #0003}
nav .nl{border:0;background:#ffffff33;color:#fff;font:600 15px inherit;padding:8px 14px;border-radius:30px;cursor:pointer;display:flex;gap:6px;align-items:center}
nav .nl:hover,nav .nl.on{background:#fff;color:var(--sun2)}
main{max-width:900px;margin:0 auto;padding:84px 16px 40px}
.hero{text-align:center;padding:30px 10px}
.sun{font-size:84px;animation:spin 14s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
h1{font-size:clamp(30px,8vw,52px);margin:6px 0;background:linear-gradient(90deg,var(--sun2),var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.tag{color:var(--sub);font-size:19px;margin:0 0 26px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.tile{background:var(--card);border:2px solid var(--line);border-radius:20px;padding:20px 10px;text-align:center;cursor:pointer;font:700 17px inherit;color:var(--ink);transition:.2s}
.tile:hover{transform:translateY(-4px);border-color:var(--sun);box-shadow:0 8px 20px #ffb30040}
.tile .ic{font-size:42px;display:block;margin-bottom:6px}
.tile small{display:block;color:var(--sub);font-weight:400;margin-top:4px;font-size:13px}
.box{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:22px;max-width:440px;margin:0 auto}
.box h2,h2{margin-top:0}
label{display:block;margin:12px 0 4px;font-weight:600;font-size:14px}
input{width:100%;padding:12px;border-radius:12px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font-size:16px}
input:focus{outline:0;border-color:var(--sun)}
.btn{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff;border:0;padding:12px 20px;border-radius:30px;font:700 16px inherit;cursor:pointer;margin-top:16px;width:100%}
.btn.alt{background:var(--blue)}
.msg{margin-top:10px;font-weight:600;min-height:20px}.err{color:#d93025}.ok{color:#1e8e3e}
.back{background:none;border:0;color:var(--blue);font:600 15px inherit;cursor:pointer;margin-bottom:10px}
.read{font-size:21px;line-height:2.1;direction:ltr;text-align:left;background:var(--card);border:2px solid var(--line);border-radius:18px;padding:16px}
.w{cursor:pointer;border-radius:6px;padding:0 2px}.w:hover{background:#ffb30055}
.pop{position:sticky;bottom:12px;background:var(--blue);color:#fff;border-radius:16px;padding:12px 16px;margin-top:12px;display:none}
.big{font-size:70px;text-align:center}
.q{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:14px;margin:10px 0}
.q button{display:block;width:100%;text-align:left;direction:ltr;margin:6px 0;padding:10px;border-radius:10px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font-size:16px;cursor:pointer}
.q button.good{background:#c8f2d4;color:#0b5a25}.q button.bad{background:#fdd;color:#8a1a1a}
.tile small{display:block;color:var(--sub);font-weight:400;font-size:12px;margin-top:4px}
.crumb{color:var(--sub);font-size:14px;margin-bottom:6px}

/* ===== v2: professional nav + photo hero ===== */
nav{justify-content:space-between;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px;background:rgba(14,22,48,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:2px solid var(--sun);box-shadow:0 4px 20px #0005}
nav .brand{display:flex;align-items:center;gap:8px;color:#fff;font-weight:800;font-size:17px;cursor:pointer;white-space:nowrap}
nav .brand i{font-style:normal;font-size:26px;line-height:1}
nav .links{display:flex;gap:6px}
nav .nl{font-family:inherit;font-size:14px;font-weight:600;background:transparent;color:#e9eefc;padding:8px 14px;border-radius:12px;gap:7px;transition:.2s}
nav .nl svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
nav .nl:hover{background:#ffffff1f;color:#fff}
nav .nl.on{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff}
@media(max-width:480px){nav{padding-inline:10px}nav .brand span{display:none}nav .nl{padding:8px 10px;font-size:13px;gap:5px}nav .nl svg{width:16px;height:16px}}
main.home{max-width:none;padding:0}
.heroX{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;color:#fff;padding:96px 18px 28px;background:linear-gradient(to top,rgba(10,16,40,.97) 0%,rgba(10,16,40,.86) 34%,rgba(10,16,40,.25) 62%,rgba(10,16,40,.1) 100%),#0e1630}
.heroX .badge{font-size:46px;line-height:1;filter:drop-shadow(0 4px 12px #ffb30090)}
.heroX h1{font-size:clamp(34px,9vw,60px);margin:8px 0 2px;line-height:1.2;background:none;-webkit-background-clip:initial;background-clip:initial;color:#fff;text-shadow:0 3px 18px #000a}
.heroX h1 span{display:block;font-size:.62em;color:var(--sun);letter-spacing:2px;font-weight:700}
.heroX .tagline{margin:6px 0 22px;font-size:clamp(16px,4.2vw,21px);color:#dfe6ff;display:flex;align-items:center;gap:10px}
.heroX .tagline:before,.heroX .tagline:after{content:"";width:34px;height:2px;background:var(--sun);border-radius:2px}
.cta-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;max-width:460px}
.cta{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px;border-radius:20px;border:1.5px solid #ffffff40;background:#ffffff1c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:700 17px inherit;font-family:inherit;cursor:pointer;transition:.25s}
.cta:hover{transform:translateY(-4px);background:#ffffff30;border-color:var(--sun)}
.cta .ci{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 6px 16px #ff7a0066}
.cta.adm .ci{background:linear-gradient(135deg,#2a5bd7,#5b8cff);box-shadow:0 6px 16px #2a5bd766}
.cta .ci svg{width:28px;height:28px;stroke:#fff;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cta small{font-weight:400;font-size:12.5px;color:#cfd8f5}
.stats{display:flex;justify-content:center;gap:clamp(14px,5vw,38px);margin-top:22px;color:#dfe6ff;font-size:13px}
.stats b{display:block;color:var(--sun);font-size:20px}
select,textarea{width:100%;padding:10px;border-radius:12px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:15px}

/* ===== PHP version extras ===== */
a{color:inherit}
a.tile,a.cta,a.nl,a.brand,a.back{text-decoration:none}
a.tile{display:block}
nav .nl{display:flex;align-items:center;cursor:pointer;color:#e9eefc;font-size:14px;font-weight:600;padding:8px 14px;border-radius:12px}
nav .nl.on{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff}
.back{display:inline-block;color:var(--blue)}
.box.wide{max-width:none;margin-bottom:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.flash{position:fixed;top:calc(66px + env(safe-area-inset-top,0px));left:12px;right:12px;z-index:20;padding:12px;border-radius:12px;color:#fff;font-weight:700;text-align:center}
.flash.ok{background:#1e8e3e}.flash.err{background:#d93025}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.nl2{padding:8px 14px;border-radius:12px;background:var(--card);border:2px solid var(--line);text-decoration:none;font-weight:600;color:var(--ink)}
.nl2.on{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff;border-color:transparent}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:8px;border-bottom:1px solid var(--line);text-align:right}
.btn{display:block}
form.box .btn{width:100%}
@media(max-width:480px){nav .nl{padding:8px 9px;font-size:12px;gap:4px}}

.tile.locked{opacity:.78;border-style:dashed}
form.tile .btn{width:auto}

.chip{border:2px solid var(--line);background:var(--bg);color:var(--ink);border-radius:10px;padding:4px 8px;cursor:pointer;font:inherit;font-size:13px;display:inline-block}
.chip.on{background:#c8f2d4;color:#0b5a25;border-color:#1e8e3e}
.tile.paid{border-color:#1e8e3e;box-shadow:0 0 0 3px #1e8e3e33 inset}
.tick{font-size:.38em;background:#1e8e3e;color:#fff;border-radius:50%;padding:2px 5px;margin-inline-start:4px;vertical-align:top}

.spk{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:50%;width:38px;height:38px;cursor:pointer;font-size:18px;line-height:1;flex:none;display:inline-flex;align-items:center;justify-content:center;padding:0;margin:8px auto 0}
.spk:hover{border-color:var(--sun)}
.q button.spk{display:inline-flex;width:38px;margin:0;padding:0;text-align:center;border-radius:50%}
.tile[data-word]{cursor:pointer}
.exrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0}
.exrow .spk{margin:0}
.qh{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vid{position:relative;padding-top:56.25%;border-radius:14px;overflow:hidden;background:#000}
.vid iframe,.vid video{position:absolute;inset:0;width:100%;height:100%;border:0}

.goals{margin:8px 0 0;padding-inline-start:22px;line-height:1.9}
label.act{display:flex;gap:10px;align-items:flex-start;margin:10px 0;font-weight:400;font-size:15px;line-height:1.7}
label.act input{width:auto;margin-top:6px}
.badge-new{background:#d93025;color:#fff;border-radius:10px;padding:1px 8px;font-size:12px}
.badge-ok{background:#1e8e3e;color:#fff;border-radius:10px;padding:1px 8px;font-size:12px}
.msgcard{border-inline-start:5px solid var(--line)}
.msgcard.new{border-inline-start-color:#d93025}
.reply{background:var(--bg);border-radius:12px;padding:10px;margin-top:8px;white-space:pre-wrap}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:14px 0}
.gallery img{width:100%;border-radius:16px;border:2px solid var(--line);display:block}
.thumbs{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0}
.thumbs label{display:block;width:96px;font-size:12px;text-align:center;margin:0}
.thumbs img{width:96px;height:72px;object-fit:cover;border-radius:10px;border:2px solid var(--line);display:block}

.vid.tiktok{padding-top:0;max-width:340px;margin:0 auto;aspect-ratio:9/16;height:auto}
.vid.tiktok iframe{position:static;width:100%;height:100%}

.lesson-nav{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 8px}.lesson-nav .btn{flex:1;min-width:150px;margin:0;text-align:center;text-decoration:none}

.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.vcard{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px;cursor:pointer;font:inherit;color:var(--ink)}
.vcard:hover{border-color:var(--sun)}
.vcard img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px}
.vcard .vic{font-size:38px;line-height:1.6}
.vcard .vt{font-size:13px;font-weight:700;text-align:center;line-height:1.4}
.vmodal{position:fixed;inset:0;background:rgba(10,16,40,.75);z-index:50;display:flex;align-items:center;justify-content:center;padding:14px}
.vmodal[hidden]{display:none}
.vbox{background:var(--card);border-radius:18px;padding:16px;width:100%;max-width:720px;max-height:92vh;overflow:auto;position:relative}
.vclose{position:absolute;top:8px;left:8px;border:0;background:var(--bg);border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:16px;color:var(--ink)}
.ptile{display:block;margin-bottom:14px;border-color:var(--blue)}
.qtag{font-size:12px;color:var(--sub);margin-bottom:6px}
label.opt{display:flex;gap:8px;align-items:center;margin:6px 0;padding:10px;border:2px solid var(--line);border-radius:10px;font-weight:400;cursor:pointer}
label.opt input{width:auto}
.result .cefr{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff;border-radius:10px;padding:2px 12px}
.bar{display:grid;grid-template-columns:70px 1fr 50px;gap:8px;align-items:center;margin:6px 0;font-size:14px}
.bar div{background:var(--bg);border-radius:8px;height:12px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--sun2),var(--sun))}
.live{color:#1e8e3e;font-weight:700;font-size:12px}
.mailline{background:var(--bg);border-radius:12px;padding:10px}
.price{color:#1e8e3e;font-weight:700}

.spkq .mic{width:auto;margin:0;display:inline-block}
.mic.rec{background:#d93025;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.6}}
.spkres{margin-top:10px;font-size:14px;line-height:1.8}
.spkres.ok{color:#0b5a25}.spkres.err{color:#8a1a1a}
.spkwords{margin:6px 0;font-size:17px}
.spkwords .good{color:#1e8e3e;font-weight:700}.spkwords .bad{color:#d93025;text-decoration:underline}

/* ===== v3 polish ===== */
.tile{box-shadow:0 2px 0 var(--line);transition:transform .2s, box-shadow .2s, border-color .2s}
.tile:hover{box-shadow:0 10px 24px rgba(255,122,0,.18)}
.box{box-shadow:0 2px 12px rgba(29,42,77,.06)}
h2{letter-spacing:.2px}
.read{box-shadow:inset 0 0 0 1px rgba(255,179,0,.15)}
.w.sel{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff;border-radius:6px}
.pop{line-height:1.8}.pop .ctxm{background:#fff3;border-radius:8px;padding:4px 8px;margin:4px 0;font-weight:700}.pop .othm{font-size:13px;opacity:.9}
.statsbar{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 12px}
.sb{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px 6px;text-align:center;text-decoration:none;color:var(--ink)}
.sb b{display:block;font-size:20px}.sb small{color:var(--sub);font-size:12px}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}.badge{background:linear-gradient(90deg,#fff6db,#ffe8c2);color:#7a4a00;border-radius:20px;padding:4px 10px;font-size:13px;font-weight:700}
.gallery figure{margin:0}.gallery figcaption{font-size:11px;color:var(--sub);text-align:center;margin-top:4px}
.fcbox{max-width:420px}
.fc{perspective:900px;height:220px;cursor:pointer;margin:18px 0}
.fc-in{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d}
.fc.flip .fc-in{transform:rotateY(180deg)}
.fc-front,.fc-back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:18px;font-size:30px;font-weight:800;backface-visibility:hidden;padding:12px;text-align:center}
.fc-front{background:linear-gradient(135deg,var(--sun2),var(--sun));color:#fff}
.fc-back{background:linear-gradient(135deg,#2a5bd7,#5b8cff);color:#fff;transform:rotateY(180deg)}
.fc-nav{display:flex;gap:10px;align-items:center;justify-content:space-between}.fc-nav .btn{width:auto;margin:0}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:99;overflow:hidden}
.confetti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:fall 2.6s linear forwards}
@keyframes fall{to{transform:translateY(105vh) rotate(720deg)}}
.pxgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:10px}
.pxitem{border:2px solid var(--line);border-radius:12px;padding:4px;background:var(--card);cursor:pointer;color:var(--ink);font:inherit}
.pxitem img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px}.pxitem small{font-size:11px}
.formlist li{margin:8px 0;line-height:1.7}
@media(max-width:480px){.statsbar{grid-template-columns:repeat(2,1fr)}}

.matchq .mcols{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.matchq .mcol{display:flex;flex-direction:column;gap:6px}
.matchq .mitem{background:var(--bg);border:2px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px;line-height:1.5;text-align:left}
.matchq .mitem b{display:inline-block;min-width:22px;color:var(--sun2)}
.matchq .manswers{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.matchq .mans{display:flex;align-items:center;gap:4px;margin:0;font-weight:700}
.matchq .mans select{width:auto;padding:6px 10px}
.matchq select.good{border-color:#1e8e3e;background:#e8f7ed}.matchq select.bad{border-color:#d93025;background:#fdecea}
.matchq .mhint{color:#d93025;font-weight:700}
@media(max-width:480px){.matchq .mcols{grid-template-columns:1fr}}

.trbox{margin:12px 0}.trbox textarea{width:100%;min-height:90px;font-size:15px;line-height:1.8}
.trans{display:none;background:var(--card);border:2px solid #1e8e3e;border-radius:14px;padding:12px 14px;margin-top:10px;white-space:pre-line;line-height:2;font-size:16px}
.trans.show{display:block}.trans b{color:#1e8e3e}

.grid.mini{grid-template-columns:repeat(auto-fit,minmax(68px,1fr));gap:6px}
.grid.mini .tile{padding:6px 4px;font-size:14px;min-height:0;border-radius:10px;line-height:1.3}
.grid.mini .tile .ic{font-size:18px;margin-bottom:0}
.grid.mini .tile small{font-size:11px}
.adm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:6px}
.adm-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;background:var(--card);border:2px solid var(--line);border-radius:18px;padding:16px 10px;text-decoration:none;color:var(--ink);cursor:pointer;font:inherit;box-shadow:0 4px 14px rgba(20,30,60,.06);transition:transform .15s,border-color .15s}
.adm-tile:hover{transform:translateY(-2px);border-color:var(--sun)}
.adm-tile .ai{font-size:30px;line-height:1.3}
.adm-tile b{font-size:15px}.adm-tile small{font-size:12px;color:var(--sub);line-height:1.5}
.adm-badge{position:absolute;top:8px;left:8px;background:#d93025;color:#fff;border-radius:999px;font-size:12px;padding:1px 8px}
.adm-head{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:8px 12px;margin-bottom:12px;position:sticky;top:64px;z-index:5}
.adm-head h3{margin:0;font-size:17px}
.adm-close{background:#d93025;color:#fff;border:0;border-radius:10px;padding:6px 14px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}

.forgot-home{text-align:center;margin:14px 0 0}.forgot-home a{display:inline-block;background:rgba(255,255,255,.92);color:#1d4ed8;font-weight:800;padding:8px 16px;border-radius:999px;text-decoration:none;font-size:15px}
.forgot-btn{display:block;text-align:center;margin-top:10px;padding:10px;border:2px dashed #1d4ed8;border-radius:12px;color:#1d4ed8;font-weight:800;text-decoration:none}

.en-tag{display:block;font-family:"Segoe UI",Arial,sans-serif;font-weight:800;letter-spacing:.5px;color:var(--sun2,#e8590c);font-size:15px;direction:ltr;margin-bottom:2px}
.work textarea{width:100%;font-size:16px;line-height:1.7}
.assess{margin-top:12px;border:2px solid var(--line);border-radius:14px;padding:12px;background:var(--card)}
.as-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:700}
.as-score{color:#fff;border-radius:12px;padding:6px 14px;font-size:20px;font-weight:800}
.assess h4{margin:12px 0 4px}.assess ul{margin:0;padding-inline-start:20px;line-height:1.9}
.as-good li::marker{color:#1e8e3e}.as-bad li::marker{color:#d93025}
.as-corr div{padding:4px 0;border-bottom:1px dashed var(--line)}.as-corr s{color:#d93025}.as-corr b{color:#1e8e3e}
.as-tip{background:var(--bg);border-radius:10px;padding:8px 10px;margin:10px 0 0}
.as-note{font-size:12px;color:var(--sub);margin:8px 0 0}
.subs-prev{margin-top:12px;font-size:13px}.subs-prev summary{cursor:pointer;font-weight:700}

.guide details{border:2px solid var(--line);border-radius:12px;padding:8px 12px;margin:8px 0;background:var(--card)}
.guide summary{cursor:pointer;font-weight:800;font-size:16px}
.guide ol{line-height:2;margin:8px 0 0;padding-inline-start:22px}
.gnote{background:var(--bg);border-radius:10px;padding:8px 10px;font-size:14px}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 12px;text-align:center;font-size:13px}
.steps3 div{background:var(--bg);border-radius:12px;padding:8px 4px}
.steps3 b{display:block;margin:0 auto 4px;width:28px;height:28px;line-height:28px;border-radius:50%;background:var(--sun2,#e8590c);color:#fff;font-size:15px}
@media print{nav,.adm-head,.adm-close,header{display:none!important}.guide details{break-inside:avoid}.guide details:not([open]) ol{display:block}}

/* ===== أيقونات لوحة الإدارة: ألوان متدرجة وخط غامق ===== */
.adm-grid{gap:14px}
.adm-tile{--c1:#2a5bd7;--c2:#5b8cff;background:linear-gradient(145deg,var(--c1),var(--c2));border:0;border-radius:22px;padding:18px 10px 16px;color:#fff;gap:6px;box-shadow:0 8px 20px -6px var(--c1),inset 0 1px 0 rgba(255,255,255,.35);text-shadow:0 1px 2px rgba(0,0,0,.25)}
.adm-tile:hover{transform:translateY(-3px);box-shadow:0 12px 26px -6px var(--c1),inset 0 1px 0 rgba(255,255,255,.35)}
.adm-tile:active{transform:scale(.97)}
.adm-tile .ai{display:grid;place-items:center;width:58px;height:58px;font-size:30px;line-height:1;background:rgba(255,255,255,.94);border-radius:50%;box-shadow:0 4px 10px rgba(0,0,0,.18);text-shadow:none;margin-bottom:4px}
.adm-tile b{font-size:17px;font-weight:900;color:#fff;letter-spacing:.2px}
.adm-tile small{font-size:12.5px;font-weight:700;color:rgba(255,255,255,.92)}
.adm-tile .adm-badge{top:10px;left:10px;background:#fff;color:#d93025;font-weight:900;font-size:13px;padding:2px 9px;box-shadow:0 2px 6px rgba(0,0,0,.25);text-shadow:none}
.adm-editor{--c1:#e8590c;--c2:#ffa94d}
.adm-students{--c1:#1c7ed6;--c2:#4dabf7}
.adm-requests{--c1:#d9480f;--c2:#ff8787}
.adm-messages{--c1:#7048e8;--c2:#b197fc}
.adm-works{--c1:#0ca678;--c2:#63e6be}
.adm-videos{--c1:#c2255c;--c2:#f783ac}
.adm-books{--c1:#5f3dc4;--c2:#9775fa}
.adm-forms{--c1:#2b8a3e;--c2:#8ce99a}
.adm-audio{--c1:#0b7285;--c2:#3bc9db}
.adm-settings{--c1:#495057;--c2:#868e96}
.adm-update{--c1:#e67700;--c2:#fcc419}
.adm-guide{--c1:#1864ab;--c2:#74c0fc}

/* ===== بطاقات المستويات والوحدات والدروس: ألوان مميزة ===== */
.tile.ct{--c1:#2a5bd7;--c2:#5b8cff;background:linear-gradient(145deg,var(--c1),var(--c2));border:0;border-radius:22px;padding:18px 10px 16px;color:#fff;font-weight:900;text-shadow:0 1px 2px rgba(0,0,0,.25);box-shadow:0 8px 20px -8px var(--c1),inset 0 1px 0 rgba(255,255,255,.35)}
.tile.ct:hover{transform:translateY(-4px);box-shadow:0 14px 26px -8px var(--c1),inset 0 1px 0 rgba(255,255,255,.35)}
.tile.ct:active{transform:scale(.97)}
.tile.ct .ic{display:grid;place-items:center;width:66px;height:66px;margin:0 auto 8px;font-size:34px;line-height:1;background:rgba(255,255,255,.95);border-radius:50%;box-shadow:0 4px 10px rgba(0,0,0,.2);text-shadow:none;position:relative}
.tile.ct .ic .tick{position:absolute;top:-4px;right:-4px;background:#1e8e3e;color:#fff;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:13px;line-height:1}
.tile.ct .en-tag{color:#fff;font-size:15px;font-weight:900;opacity:.95;letter-spacing:.6px}
.tile.ct small{color:rgba(255,255,255,.95);font-weight:700;font-size:13px}
.tile.ct.locked{filter:saturate(.3) brightness(.97);opacity:1;border:0}
.tile.ct.paid{box-shadow:0 0 0 4px #1e8e3e,0 8px 20px -8px var(--c1)}
.c0{--c1:#e8590c;--c2:#ffa94d}
.c1{--c1:#1c7ed6;--c2:#4dabf7}
.c2{--c1:#2b8a3e;--c2:#8ce99a}
.c3{--c1:#7048e8;--c2:#b197fc}
.c4{--c1:#c2255c;--c2:#f783ac}
.c5{--c1:#0b7285;--c2:#3bc9db}
.c6{--c1:#e67700;--c2:#fcc419}
.c7{--c1:#d9480f;--c2:#ff8787}
.c8{--c1:#5f3dc4;--c2:#9775fa}
.c9{--c1:#0ca678;--c2:#63e6be}

/* ===== إصدار 2026-10-11.7: تقييم بالكتابة/الصورة/المحادثة وقواعد النطق وألوان أوضح ===== */
.w-modes{display:flex;gap:6px;margin:6px 0 10px;flex-wrap:wrap}
.w-modes button{flex:1;min-width:90px;border:2px solid var(--line);background:var(--card);border-radius:12px;padding:8px 6px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink)}
.w-modes button.on{border-color:var(--sun2,#e8590c);background:#fff4e6;color:#b45309}
.w-pane[hidden]{display:none}
.w-cam{display:block;text-align:center;border:2px dashed var(--line);border-radius:14px;padding:18px;cursor:pointer;font-weight:800}
.w-thumb{max-width:100%;max-height:260px;border-radius:12px;margin-top:8px;display:block}
.w-rec{width:100%;padding:14px;border-radius:14px;border:0;font:inherit;font-weight:800;font-size:17px;background:#d93025;color:#fff;cursor:pointer}
.w-rec.on{background:#1e293b;animation:pulse 1.2s infinite}
@keyframes pulse{50%{opacity:.75}}
.w-timer{font-size:13px;color:var(--sub);margin:6px 0;text-align:center}
.w-tr{background:var(--bg);border-radius:12px;padding:10px;min-height:48px;direction:ltr;text-align:left;line-height:1.7;white-space:pre-wrap}
.phon-box{border-color:#7c3aed33}
.ph-title{font-weight:800;font-size:17px;margin-bottom:6px;direction:ltr;text-align:right}
.ph-x div{margin:4px 0;line-height:1.9}
.ph-pairs,.ph-words{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.ph-pair{display:inline-flex;direction:ltr;align-items:center;gap:4px;background:var(--bg);border-radius:12px;padding:4px}
.ph-w{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:5px 9px;font:inherit;cursor:pointer;color:var(--ink)}
.ph-tag{display:inline-block;background:var(--bg);border-radius:999px;padding:2px 10px;margin:2px;font-size:13px}
.ph-prac{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px}
.phq{margin:8px 0}.phq-t{font-weight:700;margin-bottom:4px}
.phq-os{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.phq-o{border:2px solid var(--line);background:var(--card);border-radius:10px;padding:8px;font:inherit;cursor:pointer;color:var(--ink)}
.phq-o.ok{border-color:#1e8e3e;background:#e8f7ed}.phq-o.bad{border-color:#d93025;background:#fdecea}

/* ألوان أوضح: صناديق النصوص بالأزرق السماوي، ونصوص القراءة بالأخضر الفاتح، وخطوط أغمق */
:root{--card:#e6f3fc;--line:#b3d8f0;--ink:#0a1430;--sub:#2c3a58}
body{font-weight:500}
.box,.q,.tile,.assess,.phon-box{color:var(--ink)}
small,.as-note{color:var(--sub)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .read{background:#e5f6e9;border-color:#a9dbb6;color:#06120a}}
:root[data-theme="light"] .read{background:#e5f6e9;border-color:#a9dbb6;color:#06120a}
.read{font-weight:600}

/* لوحة الإدارة بألوانها السابقة (أبيض وكريمي) */
body.adm{--card:#fff;--line:#f1e2b8;--ink:#1d2a4d;--sub:#5b6788;font-weight:400}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body.adm{--card:#1b2547;--ink:#f3f5ff;--sub:#aab4d6;--line:#2c3866}}
:root[data-theme="dark"] body.adm{--card:#1b2547;--ink:#f3f5ff;--sub:#aab4d6;--line:#2c3866}

.upd-link{background:var(--bg);border:2px solid var(--line);border-radius:14px;padding:12px;margin:8px 0}

/* شارة «نشط الآن» الخضراء بجانب اسم الطالب */
.live-badge{display:inline-flex;align-items:center;gap:5px;background:#1e8e3e;color:#fff;font-size:12px;font-weight:800;line-height:1;padding:4px 10px;border-radius:999px;white-space:nowrap;vertical-align:middle}
.live-badge i{width:7px;height:7px;border-radius:50%;background:#b9f6ca;animation:livepulse 1.6s infinite}
@keyframes livepulse{50%{opacity:.35}}

/* ===== نشاط الكلمات، تقييم القراءة، وسم الأنشطة ===== */
.sp-tag{display:inline-block;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:1px 8px;font-size:12px;font-weight:700;margin-inline-start:4px;white-space:nowrap}
.ws-row{margin:10px 0}.ws-w{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.ws-w b{font-size:17px}
.ws-in{width:100%;direction:ltr;text-align:left;font-size:16px}
.ws-res{display:grid;gap:8px}.ws-card{border:2px solid var(--line);border-radius:12px;padding:8px 10px;background:var(--card)}
.ws-card.good{border-color:#1e8e3e;background:#e8f7ed;color:#06250f}.ws-card.bad{border-color:#d97706;background:#fff4e0;color:#3d2300}
.ws-card small{display:block;margin-top:4px;color:inherit;opacity:.9}
.rd-stats{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.rd-stats span{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:14px}
.rd-marked{background:var(--bg);border-radius:12px;padding:10px;line-height:2;text-align:left;font-size:16px}
.rd-ok{color:#1e8e3e;font-weight:600}.rd-miss{color:#fff;background:#d93025;border-radius:6px;padding:0 5px;font-weight:700}
.readq .w-rec{margin-top:4px}

/* ===== ضبط العرض: كمبيوتر / جوال ===== */
.vsw{display:inline-flex;gap:4px;margin-inline-start:6px;padding-inline-start:8px;border-inline-start:2px solid #ffffff33}
nav .nl.vbtn{padding:7px 9px;border:2px solid transparent;background:transparent;color:#e9eefc}
nav .nl.vbtn svg{width:20px;height:20px}
nav .nl.vbtn.vsel{background:linear-gradient(90deg,var(--sun2),var(--sun));color:#fff;border-color:#ffffff66}
nav .nl.vbtn:hover{background:#ffffff1f}
nav .nl.vbtn.vsel:hover{background:linear-gradient(90deg,var(--sun2),var(--sun))}

/* عرض الكمبيوتر: صفحة عريضة، شبكات أوسع، خط أكبر قليلاً */
html[data-view="desktop"] body{font-size:17px}
html[data-view="desktop"] main{max-width:1180px;padding:92px 32px 48px}
html[data-view="desktop"] main.home{max-width:none;padding:0}
html[data-view="desktop"] nav{padding-inline:clamp(16px,5vw,64px)}
html[data-view="desktop"] .grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}
html[data-view="desktop"] .grid.mini{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
html[data-view="desktop"] .adm-grid{grid-template-columns:repeat(4,1fr)}
html[data-view="desktop"] .box:not(.wide){max-width:560px}
html[data-view="desktop"] .box.wide{padding:26px}
html[data-view="desktop"] .read{font-size:19px;line-height:2.1}
html[data-view="desktop"] .q button{font-size:16px}
html[data-view="desktop"] .cta-row{max-width:620px}

/* عرض الجوال: عمود واحد بعرض هاتف، أزرار كبيرة وسهلة اللمس */
html[data-view="mobile"] body{font-size:16.5px;max-width:480px;margin:0 auto;box-shadow:0 0 0 1px var(--line);min-height:100vh}
html[data-view="mobile"] nav{left:50%;right:auto;width:100%;max-width:480px;transform:translateX(-50%);padding-inline:10px}
html[data-view="mobile"] nav .brand span{display:none}
html[data-view="mobile"] nav .nl{padding:8px 9px;font-size:12px;gap:4px}
html[data-view="mobile"] nav .nl svg{width:16px;height:16px}
html[data-view="mobile"] nav .nl.vbtn svg{width:19px;height:19px}
html[data-view="mobile"] .vsw{margin-inline-start:2px;padding-inline-start:4px}
html[data-view="mobile"] main{max-width:none;padding:84px 12px 36px}
html[data-view="mobile"] main.home{padding:0}
html[data-view="mobile"] .grid{grid-template-columns:repeat(2,1fr);gap:10px}
html[data-view="mobile"] .adm-grid{grid-template-columns:repeat(2,1fr);gap:10px}
html[data-view="mobile"] .box,html[data-view="mobile"] .box.wide{max-width:none;padding:16px;border-radius:18px}
html[data-view="mobile"] .btn,html[data-view="mobile"] .q button,html[data-view="mobile"] .chip{min-height:46px}
html[data-view="mobile"] input,html[data-view="mobile"] select,html[data-view="mobile"] textarea{font-size:16px}
html[data-view="mobile"] .read{font-size:17px}
html[data-view="mobile"] .matchq .mcols{grid-template-columns:1fr}
html[data-view="mobile"] .cta-row{grid-template-columns:1fr 1fr;max-width:none}
html[data-view="mobile"] table{display:block;overflow-x:auto;white-space:nowrap}
html[data-view="mobile"] .phq-os{grid-template-columns:1fr}

/* الشريط العلوي على الشاشات الضيقة: لا كسر للكلمات ولا فيضان أفقي */
nav .nl{white-space:nowrap}
@media(max-width:480px){nav .links{gap:2px}nav .nl{padding:7px 7px;font-size:11.5px;gap:3px}nav .nl svg{width:15px;height:15px}nav .nl.vbtn{padding:6px 6px}nav .nl.vbtn svg{width:18px;height:18px}.vsw{margin-inline-start:2px;padding-inline-start:3px;gap:2px}nav{gap:6px}}
html[data-view="mobile"] nav .links{gap:2px}
html[data-view="mobile"] nav .nl{padding:7px 7px;font-size:11.5px}

/* على الجوال: أيقونات فقط، ويبقى اسم الصفحة الحالية ظاهراً */
@media(max-width:560px){nav .nl:not(.on) .lb{display:none}nav .nl:not(.vbtn){padding:8px 9px}nav .brand span{display:none}}
html[data-view="mobile"] nav .nl:not(.on) .lb{display:none}
html[data-view="mobile"] nav .nl:not(.vbtn){padding:8px 9px}

/* ===== الشريط العلوي: ترتيب احترافي وأيقونات أكبر ===== */
nav#nav{min-height:68px;padding:8px clamp(12px,3vw,32px) 8px;gap:12px;align-items:center;justify-content:space-between;background:rgba(14,22,48,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:3px solid var(--sun);box-shadow:0 6px 24px #0006}
nav#nav .brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;color:#fff;flex:none}
nav#nav .brand i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--sun),var(--sun2));font-size:26px;line-height:1;box-shadow:0 4px 14px -4px var(--sun2)}
nav#nav .links{display:flex;align-items:center;gap:6px}
nav#nav .nl{flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:70px;height:56px;padding:6px 12px;border:0;border-radius:16px;font-size:12.5px;font-weight:700;line-height:1.1;background:transparent;color:#dfe6ff;transition:.18s}
nav#nav .nl svg{width:27px;height:27px;stroke-width:1.9}
nav#nav .nl:hover{background:#ffffff22;color:#fff;transform:translateY(-1px)}
nav#nav .nl.on{background:linear-gradient(135deg,var(--sun2),var(--sun));color:#fff;box-shadow:0 5px 14px -5px var(--sun2)}
nav#nav .nl[href*="p=logout"]{color:#ffb4ab}
nav#nav .nl[href*="p=logout"]:hover{background:#d9302533;color:#fff}
nav#nav .vsw{display:inline-flex;align-items:center;gap:4px;margin-inline:6px 0;padding-inline-start:10px;border-inline-start:2px solid #ffffff2e}
nav#nav .nl.vbtn{min-width:48px;width:48px;height:48px;padding:0;border:2px solid transparent;border-radius:14px}
nav#nav .nl.vbtn svg{width:24px;height:24px}
nav#nav .nl.vbtn.vsel{background:#ffffff1f;border-color:var(--sun);color:#fff;box-shadow:none}
nav#nav .nl.vbtn.vsel:hover{background:#ffffff2e}
/* الجوال والشاشات المتوسطة: أيقونات فقط بحجم لمس مريح */
@media(max-width:760px){
  nav#nav{min-height:62px;gap:8px}
  nav#nav .brand span{display:none}
  nav#nav .nl{min-width:46px;width:46px;height:46px;padding:0;border-radius:14px}
  nav#nav .nl .lb{display:none!important}
  nav#nav .nl svg{width:25px;height:25px}
  nav#nav .nl.vbtn{width:42px;min-width:42px;height:42px}
  nav#nav .nl.vbtn svg{width:22px;height:22px}
  nav#nav .links{gap:3px}
  nav#nav .vsw{margin-inline-start:4px;padding-inline-start:6px;gap:2px}
}
@media(max-width:380px){
  nav#nav{padding-inline:8px;gap:4px}
  nav#nav .brand i{width:36px;height:36px;font-size:22px;border-radius:12px}
  nav#nav .nl{width:40px;min-width:40px;height:42px}
  nav#nav .nl svg{width:23px;height:23px}
  nav#nav .nl.vbtn{width:36px;min-width:36px;height:38px}
  nav#nav .nl.vbtn svg{width:20px;height:20px}
  nav#nav .links{gap:2px}
  nav#nav .vsw{margin-inline-start:2px;padding-inline-start:4px;gap:1px}
}
html[data-view="mobile"] nav#nav .brand span{display:none}
html[data-view="mobile"] nav#nav .nl{min-width:46px;width:46px;height:46px;padding:0}
html[data-view="mobile"] nav#nav .nl .lb{display:none!important}
html[data-view="mobile"] nav#nav .nl.vbtn{width:42px;min-width:42px;height:42px}
/* الشريط أطول قليلاً: نزيح المحتوى */
main:not(.home),html[data-view="mobile"] main:not(.home),html[data-view="desktop"] main:not(.home){padding-top:98px}
.heroX{padding-top:106px}
.flash{top:calc(82px + env(safe-area-inset-top,0px))}
.adm-head{top:80px}

/* ===== سعر المستوى المغلق على الأيقونة ===== */
.tile.ct.locked{filter:none;--c1:#59627a;--c2:#8b93aa}
.tile.ct.locked .ic{margin-bottom:20px;overflow:visible}
.pbadge{position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);white-space:nowrap;background:linear-gradient(135deg,#f59f00,#ffd43b);color:#3b2600;font-size:13px;font-weight:900;line-height:1;padding:6px 12px;border-radius:999px;box-shadow:0 3px 8px rgba(0,0,0,.28);text-shadow:none;border:2px solid #fff}

/* ضبط دقيق: شاشات 340px فأقل، وموضع شارة السعر تحت دائرة الأيقونة */
@media(max-width:340px){
  nav#nav{padding-inline:6px;gap:3px}
  nav#nav .brand i{width:32px;height:32px;font-size:19px;border-radius:10px}
  nav#nav .nl{width:36px;min-width:36px;height:40px;border-radius:12px}
  nav#nav .nl svg{width:21px;height:21px}
  nav#nav .nl.vbtn{width:32px;min-width:32px;height:36px}
  nav#nav .nl.vbtn svg{width:18px;height:18px}
  nav#nav .vsw{margin-inline-start:1px;padding-inline-start:3px;gap:0}
}
.tile.ct.locked .ic{margin-bottom:28px}
.pbadge{bottom:-18px}
@media(max-width:340px){nav#nav .nl{width:34px;min-width:34px}nav#nav .nl.vbtn{width:30px;min-width:30px}nav#nav .links{gap:1px}}
@media(max-width:310px){nav#nav .brand{display:none}nav#nav{justify-content:center}}

/* ===== العرض التلقائي: الجهاز يحدّد الشكل (جوال أقل من 900px، وكمبيوتر فوق ذلك) ===== */
html[data-view="mobile"] body{max-width:760px}
html[data-view="mobile"] nav,html[data-view="mobile"] nav#nav{max-width:760px}
@media(max-width:310px){nav#nav .brand{display:flex}}   /* شعار الأسد يظهر دائماً أعلى اليمين */
nav#nav .brand i{flex:none}
nav#nav{direction:rtl}

/* ===== أيقونات الأقسام: التفاصيل تظهر داخل الصفحة ===== */
.secbar{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin:14px 0 6px}
.secb{border:2px solid var(--line);background:var(--card);border-radius:18px;padding:12px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font:inherit;cursor:pointer;color:var(--ink);transition:.15s;min-height:84px}
.secb .si{font-size:30px;line-height:1}
.secb b{font-size:13px;line-height:1.3;text-align:center}
.secb:hover{transform:translateY(-2px);border-color:var(--sun)}
.secb.on{background:linear-gradient(135deg,var(--sun2),var(--sun));color:#fff;border-color:transparent;box-shadow:0 6px 16px -6px var(--sun2)}
.sec{scroll-margin-top:92px}
html.js .sec{display:none}
html.js .sec.open{display:block;animation:secin .22s ease}
@keyframes secin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sec>h3:first-child{margin-top:8px}

/* ===== حالة تشغيل الصوت: الأيقونة تتحول إلى إيقاف حتى يضغط الطالب عليها ===== */
.playing{animation:sndpulse 1.2s infinite}
.btn.playing{background:#d93025!important;color:#fff!important}
.spk.playing,.ph-w.playing{background:#d93025!important;color:#fff!important;border-color:#d93025!important}
@keyframes sndpulse{50%{box-shadow:0 0 0 7px #d9302533}}

/* حقل الفخ للبرامج الآلية: مخفي دون إخراجه خارج الصفحة (الإزاحة -5000px كانت توسّع الصفحة على الجوال إلى 5390px) */
.hp{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;margin:0;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);opacity:0;pointer-events:none}
/* شعار الأسد يبقى في أقصى اليمين حتى على أضيق الشاشات */
@media(max-width:310px){nav#nav{justify-content:space-between}}
html,body{overflow-x:clip}
.adm-audit{--c1:#374151;--c2:#9ca3af}

.newmsg-alert{display:flex;align-items:center;gap:10px;margin:12px 0;padding:10px 14px;border-radius:14px;background:#fdecea;border:2px solid #d93025;color:#a50e0e;font-weight:800;text-decoration:none}
.newmsg-alert:hover{background:#fbd9d5}
.nm-dot{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 7px;border-radius:999px;background:#d93025;color:#fff;font-weight:900;font-size:15px;animation:nmpulse 1.6s infinite}
@keyframes nmpulse{0%{box-shadow:0 0 0 0 rgba(217,48,37,.6)}70%{box-shadow:0 0 0 10px rgba(217,48,37,0)}100%{box-shadow:0 0 0 0 rgba(217,48,37,0)}}
.adm-tile .adm-badge{background:#d93025!important;color:#fff!important;border:2px solid #fff;min-width:26px;text-align:center;font-size:14px!important;animation:nmpulse 1.6s infinite}

.msgcard.sentok{border-inline-start-color:#1e8e3e;background:#f1fbf4}
.sent-banner{background:#1e8e3e;color:#fff;font-weight:800;border-radius:10px;padding:8px 12px;margin-bottom:8px}
.btn.sent{background:#1e8e3e!important;color:#fff!important;border-color:#1e8e3e!important}

.reqcard{display:flex;flex-direction:column;gap:10px;border:2px solid var(--line);border-radius:14px;padding:12px;margin:12px 0;background:var(--card)}
.reqpay{display:flex;gap:6px 14px;flex-wrap:wrap;background:#eef4ff;border-radius:10px;padding:8px 10px}
.reqwarn{background:#fff4e0;border:1px solid #d97706;border-radius:10px;padding:8px 10px;color:#7a4a00}
img.rcp{max-width:100%;max-height:260px;border-radius:10px;border:1px solid var(--line);display:block}

/* نافذة التأكيد */
.esdlg-ov{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(14,22,48,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .16s}
.esdlg-ov.on{opacity:1}
.esdlg{width:100%;max-width:400px;text-align:center;background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:26px;padding:26px 22px 20px;box-shadow:0 24px 60px -12px rgba(0,0,0,.45);transform:translateY(14px) scale(.96);transition:transform .2s cubic-bezier(.2,.9,.3,1.2)}
.esdlg-ov.on .esdlg{transform:none}
.esdlg-ic{width:64px;height:64px;margin:-52px auto 10px;display:grid;place-items:center;font-size:32px;border-radius:50%;background:linear-gradient(135deg,var(--sun),var(--sun2));box-shadow:0 8px 18px -4px var(--sun2),0 0 0 6px var(--card)}
.esdlg.danger .esdlg-ic{background:linear-gradient(135deg,#ff6b5e,#d93025);box-shadow:0 8px 18px -4px #d93025,0 0 0 6px var(--card)}
.esdlg h3{margin:6px 0 8px;font-size:20px;font-weight:900}
.esdlg p{margin:0 0 18px;font-size:15.5px;line-height:1.9;color:var(--sub)}
.esdlg-bt{display:flex;gap:10px}
.esdlg-bt button{flex:1;min-height:48px;border:0;border-radius:14px;font:800 16px inherit;font-family:inherit;cursor:pointer;transition:transform .12s,filter .12s}
.esdlg-bt button:active{transform:scale(.97)}
.esdlg-no{background:var(--bg);color:var(--ink);border:2px solid var(--line)!important}
.esdlg-ok{color:#fff;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 6px 14px -4px var(--sun2)}
.esdlg.danger .esdlg-ok{background:linear-gradient(135deg,#e5483b,#c5221f);box-shadow:0 6px 14px -4px #c5221f}
.esdlg-bt button:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
@media (max-width:480px){.esdlg-ov{align-items:flex-end;padding:12px}.esdlg{max-width:none;border-radius:26px 26px 22px 22px}}
@media (prefers-reduced-motion:reduce){.esdlg,.esdlg-ov{transition:none}}

.adm-ai{--c1:#6741d9;--c2:#22b8cf}
details.aiprov{border:2px solid var(--line);border-radius:14px;padding:10px 12px;margin-top:10px;background:var(--card)}
details.aiprov summary{cursor:pointer;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.aires{margin-top:12px;border-radius:12px;padding:12px;border:2px solid}
.aires.ok{background:#f1fbf4;border-color:#1e8e3e;color:#14341f}.aires.bad{background:#fdecea;border-color:#d93025;color:#a50e0e}

.expl-row{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 12px}.expl-row .btn{flex:1 1 210px;width:auto;margin:0}

.mrow{display:flex;gap:6px 8px;align-items:baseline;flex-wrap:wrap;padding:6px 0;border-top:1px solid var(--line)}

details.expl-tx{margin:4px 0 12px;border:2px solid var(--line);border-radius:14px;padding:8px 12px;background:var(--card)}
details.expl-tx summary{cursor:pointer;font-weight:800}
.expl-body{line-height:2;max-height:320px;overflow:auto;margin-top:6px}
.expl-body p{margin:4px 0}.expl-body p.en{color:var(--blue);font-weight:700;text-align:left}

.adm-kb{--c1:#2f9e44;--c2:#94d82d}

/* أيقونتا الفيديو والصوت في محرر المحتوى */
.edtools{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
details.edtool{border:2px solid var(--line);border-radius:18px;background:var(--card);overflow:hidden}
details.edtool[open]{grid-column:1/-1;border-color:var(--sun2)}
details.edtool.has{border-color:#1e8e3e}
details.edtool>summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 10px;text-align:center}
details.edtool>summary::-webkit-details-marker{display:none}
details.edtool .ti{display:grid;place-items:center;width:60px;height:60px;font-size:30px;border-radius:50%;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 6px 14px -4px var(--sun2)}
details.edtool:nth-of-type(2) .ti{background:linear-gradient(135deg,#0b7285,#3bc9db);box-shadow:0 6px 14px -4px #0b7285}
details.edtool>summary b{font-size:16px}details.edtool>summary small{color:var(--sub);font-size:12.5px}
details.edtool.has>summary small{color:#1e8e3e;font-weight:700}
.edbody{padding:4px 14px 14px;border-top:1px solid var(--line)}
.recbox{margin:10px 0}
@media (max-width:480px){.edtools{grid-template-columns:1fr 1fr;gap:8px}details.edtool>summary{padding:12px 6px}details.edtool>summary b{font-size:14px}}

/* ===== صفحات الدخول: تصميم عصري ===== */
.auth{max-width:440px;margin:0 auto;padding:4px 0 24px}
.auth-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:28px;padding:54px 22px 22px;margin-top:44px;box-shadow:0 18px 44px -18px rgba(29,42,77,.28);text-align:right}
.auth-badge{position:absolute;top:-38px;left:50%;transform:translateX(-50%);width:76px;height:76px;display:grid;place-items:center;font-size:38px;border-radius:50%;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 10px 22px -6px var(--sun2),0 0 0 7px var(--bg)}
.auth-card h2{margin:0 0 4px;text-align:center;font-size:23px;font-weight:900}
.auth-sub{margin:0 0 18px;text-align:center;color:var(--sub);font-size:14.5px;line-height:1.7}
.auth-card label{display:block;margin:14px 2px 6px;font-weight:800;font-size:14px}
.auth .field{display:flex;align-items:center;gap:8px;background:var(--bg);border:2px solid var(--line);border-radius:16px;padding:0 12px;transition:border-color .15s,box-shadow .15s}
.auth .field:focus-within{border-color:var(--sun2);box-shadow:0 0 0 4px rgba(255,122,0,.16)}
.auth .field .fi{font-size:17px;opacity:.75}
.auth .field input{flex:1;min-width:0;width:auto;margin:0;padding:15px 4px;border:0;background:transparent;box-shadow:none;outline:0;font-size:16px;color:var(--ink)}
.auth .field input::placeholder{color:var(--sub);opacity:.55}
.pw-toggle{flex:none;border:0;background:transparent;cursor:pointer;font-size:19px;line-height:1;padding:8px 4px;border-radius:10px;opacity:.75}
.pw-toggle:hover,.pw-toggle[aria-pressed=true]{opacity:1}
.auth-row{text-align:left;margin:8px 2px 0}
.auth-row a,.auth-alt a{color:var(--blue);font-weight:800;text-decoration:none}
.auth-row a{font-size:13.5px}.auth-row a:hover,.auth-alt a:hover{text-decoration:underline}
.auth-go{width:100%;margin:18px 0 0;padding:15px;font-size:17px;border-radius:16px;box-shadow:0 10px 20px -8px var(--blue)}
.auth-alt{text-align:center;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line);font-size:14.5px;color:var(--sub)}
.auth-err{background:#fdecea;border:1.5px solid #d93025;color:#a50e0e;border-radius:14px;padding:10px 12px;font-weight:800;font-size:14px;margin:0 0 4px;text-align:center}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .auth-err{background:#3a1a1c;color:#ffb4ab;border-color:#d93025}}
:root[data-theme="dark"] .auth-err{background:#3a1a1c;color:#ffb4ab;border-color:#d93025}
/* بوابة الطالب */
.auth-card.gate{padding-bottom:20px}
.gate-opt{display:flex;align-items:center;gap:14px;padding:15px 16px;margin-top:12px;border:2px solid var(--line);border-radius:20px;background:var(--bg);color:var(--ink);text-decoration:none;transition:transform .15s,border-color .15s,box-shadow .15s}
.gate-opt:hover{transform:translateY(-2px);border-color:var(--sun2);box-shadow:0 10px 22px -12px var(--sun2)}
.gate-opt .go-ic{flex:none;width:52px;height:52px;display:grid;place-items:center;font-size:26px;border-radius:16px;background:linear-gradient(135deg,var(--blue),#5b8cff)}
.gate-opt .go-tx{flex:1;display:flex;flex-direction:column;gap:2px;text-align:right}
.gate-opt b{font-size:17px}.gate-opt small{color:var(--sub);font-size:13px}
.gate-opt i{font-style:normal;font-size:26px;opacity:.5}
.gate-opt.primary{background:linear-gradient(135deg,var(--sun2),var(--sun));border-color:transparent;color:#fff;box-shadow:0 12px 24px -10px var(--sun2)}
.gate-opt.primary .go-ic{background:rgba(255,255,255,.95)}.gate-opt.primary small{color:rgba(255,255,255,.92)}.gate-opt.primary i{opacity:.9}
@media (max-width:420px){.auth-card{padding:50px 16px 18px;border-radius:24px}}

/* الصفحة الرئيسية: صورة الطلاب بدل الصورة الخلفية */
.heroX{background:radial-gradient(circle at 50% 36%,rgba(255,150,0,.30),rgba(255,150,0,0) 54%),linear-gradient(180deg,#17254f 0%,#0e1630 58%,#0a1028 100%)}
.hero-art{position:relative;display:flex;justify-content:center;width:100%;margin:0 0 4px}
.hero-art:before{content:"";position:absolute;bottom:6%;left:50%;transform:translateX(-50%);width:min(300px,64vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#ffd54a,#ff9a1a 62%,#ff7a00);opacity:.92;filter:blur(.5px)}
.hero-art img{position:relative;display:block;height:auto;width:auto;max-width:min(300px,68vw);max-height:34svh;max-height:34vh;object-fit:contain;filter:drop-shadow(0 16px 20px rgba(0,0,0,.45))}
@supports (height:1svh){.hero-art img{max-height:34svh}}
@media (min-width:900px){.hero-art img{max-height:33svh}.hero-art:before{width:min(250px,30vw)}.heroX{padding-top:92px}}

/* أيقونة شرح الفيديو داخل الشرح */
.vidcard{margin:6px 0 14px}
.vid-open{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border:0;border-radius:20px;cursor:pointer;color:#fff;text-align:right;font-family:inherit;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 12px 24px -10px var(--sun2);transition:transform .15s}
.vid-open:hover{transform:translateY(-2px)}
.vid-open .vi{flex:none;width:54px;height:54px;display:grid;place-items:center;font-size:28px;border-radius:50%;background:rgba(255,255,255,.95)}
.vid-open .vt{flex:1;display:flex;flex-direction:column;gap:2px}.vid-open b{font-size:18px;font-weight:900}.vid-open small{font-size:13px;opacity:.95}
.vid-open .va{font-style:normal;font-size:22px;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.22)}
.vidcard.on .va{transform:rotate(90deg)}
.vid-holder{margin-top:12px}
.vid-slides{display:inline-block;margin-top:10px;padding:10px 16px;border:2px solid var(--line);border-radius:14px;background:var(--card);color:var(--blue);font-weight:800;text-decoration:none}
.vid-slides:hover{border-color:var(--sun2)}
.sld{margin-top:10px;outline:0}
.sld .sld-open{background:linear-gradient(135deg,#3a7bd5,#2a5fa8);box-shadow:0 12px 24px -10px #2a5fa8}
.sld.on .va{transform:rotate(90deg)}
.sld-view{margin-top:10px}
.sld-msg{text-align:center;margin:12px 0}
.sld-stage{display:flex;justify-content:center;background:#1d2433;border-radius:14px;padding:6px;overflow:hidden}
.sld-stage canvas{display:block;max-width:100%;border-radius:8px;cursor:pointer;touch-action:pan-y;background:#fff}
.sld-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:8px}
.sld-num{font-weight:800;min-width:60px;text-align:center;direction:ltr}
.sld.fs{position:fixed;inset:0;z-index:9999;margin:0;background:#111;padding:8px;display:flex;flex-direction:column;justify-content:center}
.sld.fs .sld-open{display:none}
.sld.fs .sld-stage{background:#111;padding:0;flex:1;align-items:center}
.sld.fs .sld-num{color:#fff}
.sld-stage{position:relative}
.sld-stage.wait::after{content:"";position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:4px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:sldspin .8s linear infinite}
@keyframes sldspin{to{transform:rotate(360deg)}}
body.sld-lock{overflow:hidden}

/* حالة الرفع: لون الزر يتبدّل من الأزرق إلى الأخضر بحسب النسبة، وشريط تقدّم تحته */
.btn.uploading{--p:0%;background:linear-gradient(90deg,#1e8e3e var(--p),#2a5bd7 var(--p))!important;color:#fff!important;cursor:progress;opacity:1!important;transition:background .15s}
.btn.uploading.upfin{background:#1e8e3e!important}
.upbar{position:relative;height:22px;margin:8px 0 2px;border-radius:999px;background:var(--line);overflow:hidden}
.upbar i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#2a5bd7,#1e8e3e);transition:width .15s}
.upbar span{position:relative;display:block;text-align:center;font-size:12px;font-weight:800;line-height:22px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45);direction:ltr}

/* صفحة الدرس: صفحة القسم وحده مع زر رجوع إلى الأيقونات */
.secbar[hidden]{display:none!important}
.sec-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 12px;padding:8px 10px;border:2px solid var(--line);border-radius:16px;background:var(--card)}
.sec-back{border:0;border-radius:12px;padding:9px 14px;font:800 14px inherit;font-family:inherit;color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--sun2),var(--sun));box-shadow:0 6px 14px -6px var(--sun2)}
.sec-back:active{transform:scale(.97)}
.sec-name{font-weight:900;font-size:16px}

/* تسجيل طالب جديد: خطوات + حقل الرمز */
.steps{display:flex;justify-content:center;gap:6px;list-style:none;margin:0 0 14px;padding:0}
.steps li{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--sub);padding:5px 10px;border-radius:999px;background:var(--bg);border:1.5px solid var(--line)}
.steps li i{font-style:normal;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--line);color:var(--ink);font-size:11px}
.steps li.on{color:#fff;background:linear-gradient(135deg,var(--sun2),var(--sun));border-color:transparent}.steps li.on i{background:#fff;color:var(--sun2)}
.steps li.done{color:#1e8e3e;border-color:#1e8e3e}.steps li.done i{background:#1e8e3e;color:#fff}
.codein{display:block;width:100%;margin:6px 0 0;padding:14px 8px;border:2px solid var(--line);border-radius:16px;background:var(--bg);color:var(--ink);text-align:center;font:900 30px "DejaVu Sans Mono",Menlo,monospace;letter-spacing:.5em;text-indent:.5em;outline:0}
.codein:focus{border-color:var(--sun2);box-shadow:0 0 0 4px rgba(255,122,0,.16)}
.auth-two{display:flex;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.auth-two form{margin:0}.link-btn{border:0;background:transparent;color:var(--blue);font:800 14px inherit;font-family:inherit;cursor:pointer;padding:6px 2px}.link-btn:disabled{color:var(--sub);cursor:default}
.auth-hint{font-size:13px;color:var(--sub);text-align:center;margin:10px 0 0}.auth-hint a{color:var(--blue);font-weight:800}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* الصفحة الرئيسية: صورة الخريجين داخل إطار مقوّس بلون المنصة */
.hero-art:before{display:none}
.hero-art img{width:auto;height:min(33svh,320px);max-width:none;max-height:none;aspect-ratio:4/5;object-fit:cover;object-position:center 35%;border-radius:50% 50% 22px 22px/34% 34% 22px 22px;border:4px solid var(--sun);box-shadow:0 18px 40px -12px rgba(0,0,0,.65),0 0 0 10px rgba(255,179,0,.16);filter:none}


.lesson-nav[hidden]{display:none}

.sec-nav .btn{font-size:14px;line-height:1.5;padding:13px 6px;min-width:0}

.sec-nav .btn{text-wrap:balance}

/* قائمة الأنشطة: أيقونات الكتابة والكاميرا والمايك بدل مربع العلامة */
div.act{display:flex;gap:10px;align-items:center;justify-content:space-between;margin:10px 0;padding:10px 12px;border:2px solid var(--line);border-radius:14px;background:#fff8;font-size:15px;line-height:1.7}
.acttx{flex:1;min-width:0}
.actgo{display:flex;gap:6px;flex:none}
.actgo button{width:42px;height:42px;border-radius:50%;border:2px solid var(--line);background:var(--card);font-size:19px;line-height:1;cursor:pointer;padding:0}
.actgo button:active{transform:scale(.92);border-color:var(--sun2,#e8590c);background:#fff4e6}
.xw{cursor:pointer;border-bottom:1px dotted var(--sub);border-radius:3px}.xw:hover{background:#ffb30055}

.cq{margin:14px 0}.cq-q{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:14px;margin:10px 0}
.cq-q button{display:block;width:100%;text-align:left;direction:ltr;margin:6px 0;padding:10px;border-radius:10px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font-size:16px;cursor:pointer}
.cq-q button.good{background:#c8f2d4;color:#0b5a25}.cq-q button.bad{background:#fdd;color:#8a1a1a}
.cq-res{font-weight:700;color:var(--brand,#0b3a6e);margin-top:8px}
html[data-view="mobile"] .cq-q button{min-height:46px}

/* ===== غرفة الحوار ===== */
.room-q{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;background:#fff4d6;border:2px solid #ffd27a;border-radius:16px;padding:12px 14px;margin:10px 0}
.room-who{font-weight:700;font-size:13px;flex-basis:100%}
.room-qt{flex:1;min-width:0;font-size:19px;font-weight:700;line-height:1.5}
.room-prog{font-weight:700;color:#8a5a00;margin-bottom:4px}
.room-ar{font-size:14px;color:#555;margin:0 0 8px}
.room-score{text-align:center;margin:8px 0}.room-big{font-size:38px}
.room-list{padding:0 18px;line-height:2}.room-list span{display:inline-block;min-width:44px;font-weight:700;color:#8a5a00}
.room .room-next,.room .room-again{margin-top:12px}
.room [hidden]{display:none!important}
.room-note{margin-top:18px;padding-top:14px;border-top:2px dashed #b9d4ee}.room-note h4{margin:0 0 6px}.room-note p{margin:0 0 8px;font-size:14px}
.room-note textarea{width:100%;box-sizing:border-box}.room-note-r{margin-top:8px;font-size:14px;line-height:1.7}.room-note-r.ok{color:#0b5a25}.room-note-r.err{color:#8a1a1a}
.msender{background:#eef5ff;border:1px solid #c9dcf5;border-radius:10px;padding:6px 10px;margin:8px 0 0;font-size:13px;line-height:1.7}
.spkres .myvoice{width:auto;margin:8px 0 0;display:inline-block}
.room-av{width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#eaf6ff,#cfe6fb);border:3px solid #fff;box-shadow:0 2px 8px #0002;overflow:hidden;flex:0 0 auto}
.room-av .av-svg{width:100%;height:100%;display:block}
.room-av.talking .av-svg{animation:avbob .5s ease-in-out infinite}
.av-eyes{transform-box:fill-box;transform-origin:center;animation:avblink 4.2s infinite}
@keyframes avblink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
@keyframes avbob{50%{transform:translateY(1.2px)}}
@media (prefers-reduced-motion:reduce){.av-eyes,.room-av.talking .av-svg{animation:none}}
.room-q{align-items:center}.room-av + .room-who{display:none}

/* الشرح بالإنجليزية + الإملاء والنسخ */
.xe-row{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}
.xe-row .btn{width:auto;margin:0}
.xe-box{line-height:1.9;text-align:left}
.xe-box p{margin:8px 0;font-size:17px}
.xe-tr{background:#fff8ec;border-right:4px solid var(--blue)}
.xe-tr .xe-tr-h{display:block;margin-bottom:6px;color:var(--blue)}
.dict .dict-btns{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.dict .dict-btns .btn{width:auto;margin:0}
.dict .dict-src{font-size:18px;line-height:2;background:#fff;border-radius:12px;padding:10px 12px;text-align:left}
.dict .dict-in{width:100%;box-sizing:border-box;font-size:18px;line-height:1.7;border:2px solid #cfd8e6;border-radius:12px;padding:10px;text-align:left;font-family:inherit}
.dict [hidden]{display:none!important}
.dict-score{font-size:34px;font-weight:800;text-align:center;border-radius:14px;padding:8px;margin:12px 0 4px}
.dict-score.good{background:#e4f7ea;color:#16794a}.dict-score.mid{background:#fff3d6;color:#9a6200}.dict-score.low{background:#fde6e6;color:#b3261e}
.dict-msg{font-weight:700;text-align:center;margin:4px 0}
.dict-stat{font-size:14px;text-align:center;margin:4px 0}
.dict-line{background:#fff;border-radius:12px;padding:10px 12px;line-height:2.2;font-size:18px;text-align:left}
.dict-line .dw.ok{color:#16794a}.dict-line .dw.typo{color:#b3261e;font-weight:700;text-decoration:underline wavy}.dict-line .dw.missing{color:#8a6d00;background:#fff3d6;border-radius:6px;padding:0 4px}
.dict-fix{list-style:none;padding:0;margin:8px 0;display:flex;gap:8px;flex-wrap:wrap}
.dict-fix li{background:#fff;border-radius:10px;padding:4px 10px}
.dict-fix .bad{color:#b3261e}.dict-fix .good{color:#16794a}
.dict-note{font-size:14px;margin:6px 0}
.dict-best{font-size:14px;margin:8px 0 0}

/* ألوان المستويات الثلاثة: المستويات برتقالية، الوحدات زرقاء، الدروس خضراء */
.tile.ct.t-lv:not(.locked){--c1:#e8590c;--c2:#ffa94d}
.tile.ct.t-un{--c1:#1c7ed6;--c2:#4dabf7}
.tile.ct.t-ls{--c1:#2b8a3e;--c2:#69db7c}
/* شعار الأسد: صورة ذهبية على خلفية داكنة لتبرز فوق الشريط البرتقالي */
nav#nav .brand i{background:#0e1630;overflow:hidden}
nav#nav .brand i img,.esdlg-ic img{width:88%;height:88%;object-fit:contain;display:block}
.heroX .badge img{width:120px;height:120px;display:block;margin:0 auto}
.auth-badge{background:#0e1630}
.auth-badge img{width:84%;height:84%;object-fit:contain;display:block}
.esdlg:not(.danger) .esdlg-ic{background:#0e1630}

/* ===== هوية باسل: ذهبي وكحلي (تتناسق مع شعار الأسد) — الأيقونات كما هي ===== */
:root{--sun:#d4af37;--sun2:#a8801f;--gold-lt:#f0d27a;--navy:#0e1630;--bg:#f7f4ec;--card:#ffffff;--line:#e4d6aa;--ink:#0e1630;--sub:#4a5470}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0b1226;--card:#141d3a;--ink:#f3f5ff;--sub:#aab4d6;--line:#3a3a2a}}
:root[data-theme="dark"]{--bg:#0b1226;--card:#141d3a;--ink:#f3f5ff;--sub:#aab4d6;--line:#3a3a2a}
h1{background:linear-gradient(90deg,var(--navy),var(--sun2));-webkit-background-clip:text;background-clip:text}
/* الأزرار والعناصر المفعّلة: ذهبي بنص كحلي ليبقى مقروءاً */
.btn,nav .nl.on,nav#nav .nl.on,.nl2.on,.w.sel,.fc-front,.result .cefr,nav .nl.vbtn.vsel{background:linear-gradient(135deg,var(--gold-lt),var(--sun) 55%,var(--sun2));color:var(--navy)}
nav#nav .nl.on svg,nav .nl.on svg{stroke:var(--navy)}
nav#nav .nl.on{box-shadow:0 5px 14px -5px rgba(212,175,55,.7)}
.btn:hover{filter:brightness(1.05)}
nav#nav{border-bottom-color:var(--sun)}
.tile:hover{box-shadow:0 8px 20px rgba(212,175,55,.28)}
/* البوابة */
.heroX{background:radial-gradient(circle at 50% 36%,rgba(212,175,55,.22),rgba(212,175,55,0) 54%),linear-gradient(180deg,#17254f 0%,#0e1630 58%,#0a1028 100%)}
.heroX .badge{background:var(--navy)!important;border:2px solid var(--sun);filter:drop-shadow(0 6px 16px rgba(212,175,55,.35))}
.hero-art img{border-color:var(--sun);box-shadow:0 18px 40px -12px rgba(0,0,0,.65),0 0 0 10px rgba(212,175,55,.14)}
.cta .ci{background:linear-gradient(135deg,var(--gold-lt),var(--sun) 55%,var(--sun2));box-shadow:0 6px 16px rgba(212,175,55,.4)}
.cta .ci svg{stroke:var(--navy)}
.cta.adm .ci{background:linear-gradient(135deg,#1d2b5c,#2f4590);box-shadow:0 6px 16px rgba(29,43,92,.5);border:1.5px solid var(--sun)}
.cta.adm .ci svg{stroke:var(--gold-lt)}
.cta:hover{border-color:var(--sun)}
.auth-badge{box-shadow:0 10px 22px -6px rgba(212,175,55,.6),0 0 0 7px var(--bg)}
.auth-go{box-shadow:0 10px 20px -8px rgba(168,128,31,.7)}
.gate-opt.primary{background:linear-gradient(135deg,var(--gold-lt),var(--sun) 55%,var(--sun2));color:var(--navy);border-color:transparent}
.gate-opt.primary b,.gate-opt.primary small,.gate-opt.primary:after{color:var(--navy)}
.back,.auth-alt a,.auth a{color:#1d2b5c}
/* الحاسوب: صورة البوابة أعرض (الجوال يبقى بالقوس العمودي) */
@media (min-width:900px){.hero-art img{height:min(31svh,300px);aspect-ratio:3/2;object-position:center 22%;border-radius:120px 120px 22px 22px/90px 90px 22px 22px}}

/* ===== مسابقات المستويات ===== */
.ct-wrap{max-width:760px;margin:0 auto}
.ct-head{text-align:center;margin:6px 0 18px}.ct-head h2{margin:4px 0}.ct-head p{color:var(--sub);margin:6px auto;max-width:560px}
.ct-cup{font-size:44px;display:block;filter:drop-shadow(0 6px 14px rgba(212,175,55,.45))}.ct-cup.big{font-size:64px;text-align:center}
.ct-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:8px 0 12px;flex-wrap:wrap}
.ct-title{font-weight:800;font-size:clamp(18px,4.6vw,24px);color:var(--ink)}
.ct-music{border:2px solid var(--sun);background:var(--card);color:var(--ink);border-radius:999px;padding:7px 14px;font-weight:700;font-size:14px;font-family:inherit;cursor:pointer}
.ct-music[aria-pressed="false"]{opacity:.7}
.ct-card{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:20px;margin-bottom:16px;box-shadow:0 10px 30px -18px rgba(14,22,48,.5)}
.ct-intro{text-align:center}.ct-rules{text-align:right;line-height:2;padding-inline-start:18px;margin:12px auto;max-width:560px}
.ct-mine{background:var(--bg);border:1px dashed var(--sun);border-radius:12px;padding:8px 12px;text-align:center}
.ct-start{max-width:340px;margin:14px auto 0;font-size:19px;padding:14px}
.ct-play{position:relative;overflow:hidden;background:linear-gradient(180deg,#17254f,#0e1630);color:#fff;border-color:var(--sun)}
.ct-top{display:flex;justify-content:space-between;font-weight:800}
.ct-count{background:#ffffff1c;border-radius:999px;padding:4px 12px}.ct-score{color:var(--gold-lt);font-size:18px}
.ct-timer{height:8px;background:#ffffff22;border-radius:8px;margin:12px 0 14px;overflow:hidden}
.ct-timer i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gold-lt),var(--sun));border-radius:8px}
.ct-timer i.warn{background:linear-gradient(90deg,#ff8787,#d93025)}
.ct-tag{display:inline-block;background:#d4af3726;color:var(--gold-lt);border:1px solid #d4af3780;border-radius:999px;padding:3px 12px;font-size:13px;font-weight:700}
.ct-q{font-size:clamp(19px,5vw,25px);margin:12px 0;line-height:1.5;color:#fff;unicode-bidi:plaintext}
.ct-say{border:0;border-radius:14px;padding:10px 18px;font-weight:700;font-size:16px;cursor:pointer;margin-bottom:12px;background:linear-gradient(135deg,var(--gold-lt),var(--sun) 55%,var(--sun2));color:var(--navy);font-family:inherit}
.ct-opts{display:grid;gap:10px}
.ct-opt{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;border-radius:16px;border:2px solid #ffffff33;background:#ffffff12;color:#fff;font-weight:600;font-size:clamp(17px,4.4vw,20px);font-family:inherit;cursor:pointer;text-align:start;transition:transform .12s,background .15s,border-color .15s}
.ct-opt:hover:not(:disabled){transform:translateY(-2px);border-color:var(--sun);background:#ffffff1f}
.ct-opt .ct-l{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d4af3733;color:var(--gold-lt);font-weight:800}
.ct-opt .ct-t{unicode-bidi:plaintext}
.ct-opt.picked{border-color:var(--gold-lt)}
.ct-opt.right{background:#1e8e3e;border-color:#7ee2a0;color:#fff;animation:ctPop .45s}
.ct-opt.right .ct-l{background:#ffffff33;color:#fff}
.ct-opt.wrong{background:#b3261e;border-color:#ff8787;animation:ctShake .4s}
.ct-opt:disabled{cursor:default}
.ct-fb{min-height:46px;margin-top:14px;text-align:center;font-size:24px;font-weight:900;opacity:0}
.ct-fb.ok{color:#7ee2a0;opacity:1;animation:ctPop .5s}.ct-fb.bad{color:#ffb4ab;opacity:1;animation:ctShake .4s}
.ct-fb small{font-size:15px;color:var(--gold-lt);margin-inline-start:6px}
@keyframes ctPop{0%{transform:scale(.85)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes ctShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
.ct-end{text-align:center}
.ct-res{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.ct-res div{background:var(--bg);border:2px solid var(--line);border-radius:16px;padding:12px 6px}
.ct-res b{display:block;font-size:26px;color:var(--sun2)}.ct-res small{color:var(--sub)}
.ct-board h3{margin-top:0}
.ct-table{width:100%;border-collapse:collapse;font-size:15px}
.ct-table th,.ct-table td{padding:9px 6px;border-bottom:1px solid var(--line);text-align:center}
.ct-table th{color:var(--sub);font-weight:700}
.ct-table tr.me td{background:#d4af3722;font-weight:800}
.ct-empty{text-align:center;color:var(--sub)}
.ct-tile .ic{filter:drop-shadow(0 4px 10px rgba(212,175,55,.5))}
.tile.ct-tile{background:linear-gradient(135deg,#17254f,#0e1630);color:#fff;border:2px solid var(--sun)}
.tile.ct-tile small{color:var(--gold-lt)}

/* ===== المرحلة 1: الترحيب الذكي ===== */
.wl{max-width:820px;margin:0 auto}
.wl-hero{text-align:center;margin:8px 0 14px}.wl-hero img{border-radius:22px;background:var(--navy);border:2px solid var(--sun);padding:6px}
.wl-hero h2{margin:10px 0 4px}.wl-hero p{color:var(--sub);margin:0 auto;max-width:560px}
.wl-step{border:0;margin:0 0 18px;padding:0}
.wl-step legend{font-weight:800;font-size:18px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.wl-step legend small{font-weight:400;color:var(--sub)}
.wl-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt),var(--sun2));color:var(--navy);font-size:15px}
.wl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.wl-cards.wl-3{grid-template-columns:repeat(3,1fr)}
.wl-card{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:14px 10px;border-radius:18px;background:var(--card);border:2px solid var(--line);cursor:pointer;transition:transform .12s,border-color .12s,box-shadow .12s}
.wl-card:hover{transform:translateY(-2px);border-color:var(--sun)}
.wl-card input{position:absolute;opacity:0;pointer-events:none}
.wl-card:has(input:checked){border-color:var(--sun);box-shadow:0 0 0 4px rgba(212,175,55,.25);background:linear-gradient(180deg,#fffaf0,var(--card))}
.wl-card:has(input:checked):after{content:"✓";position:absolute;top:8px;inset-inline-start:10px;width:22px;height:22px;border-radius:50%;background:var(--sun);color:var(--navy);font-weight:900;display:grid;place-items:center;font-size:13px}
.wl-card:has(input:focus-visible){outline:3px solid var(--sun2);outline-offset:2px}
.wl-ic{font-size:32px}.wl-card b{font-size:15px}.wl-card small{color:var(--sub);font-size:12.5px}
.wl-go{max-width:360px;margin:6px auto 0;font-size:19px;padding:14px}
@media (max-width:520px){.wl-cards{grid-template-columns:1fr 1fr}.wl-cards.wl-3{grid-template-columns:1fr 1fr 1fr}.wl-cards.wl-3 .wl-card{padding:10px 4px}.wl-cards.wl-3 small{display:none}}

/* ===== لوحة الطالب: مشترك ===== */
.dash{margin:4px 0 18px}
.dash-h{margin:16px 0 8px;font-size:17px}
.dash-recs{display:grid;gap:8px}
.dash-rec{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:var(--card);border:2px solid var(--line);color:var(--ink);text-decoration:none;transition:transform .12s,border-color .12s}
.dash-rec:hover{transform:translateY(-2px);border-color:var(--sun)}
.dash-rec b{flex:1}.dash-rec small{color:var(--sub);font-size:12.5px;white-space:nowrap}
.dash-go{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold-lt),var(--sun2));color:var(--navy);font-size:13px}
.dash-links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.dash-edit{color:var(--sub);font-size:14px}
.lv-title{margin-top:8px}

/* ===== وضع الصغار: ألوان زاهية وشخصية الأسد ===== */
body.mode-kids{--bg:#fff7e0;--line:#ffd98a}
body.mode-kids main{font-size:17px}
.dash.kids{background:linear-gradient(160deg,#fff1c1,#ffe0ef 55%,#d8f0ff);border:3px solid #ffd166;border-radius:28px;padding:18px;box-shadow:0 14px 30px -18px #ff9f1c}
.kd-hero{display:flex;align-items:center;gap:12px}
.kd-lion{position:relative;flex:none}.kd-lion img{border-radius:24px;background:var(--navy);border:3px solid #ffd166;animation:kdBob 2.6s ease-in-out infinite}
.kd-crown{position:absolute;top:-14px;inset-inline-end:-8px;font-size:30px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.25))}
@keyframes kdBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.kd-bubble{position:relative;flex:1;background:#fff;border-radius:20px;padding:12px 14px;box-shadow:0 6px 16px -8px rgba(0,0,0,.25);display:flex;flex-direction:column;gap:4px}
.kd-bubble:before{content:"";position:absolute;inset-inline-start:-10px;top:24px;border:10px solid transparent;border-inline-end-color:#fff}
.kd-bubble b{font-size:19px;color:#e85d04}
.kd-tier{margin:14px 0 8px}.kd-tier-t{font-size:15px;margin-bottom:6px}
.kd-bar{height:16px;background:#fff;border-radius:12px;overflow:hidden;border:2px solid #ffd166}
.kd-bar i{display:block;height:100%;background:linear-gradient(90deg,#ff9f1c,#ffd166,#06d6a0);border-radius:10px}
.kd-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.kd-stats div{background:#fff;border-radius:18px;padding:10px 4px;text-align:center;box-shadow:0 4px 10px -6px rgba(0,0,0,.2)}
.kd-stats span{font-size:26px;display:block}.kd-stats b{font-size:22px;color:#e85d04;display:block}.kd-stats small{color:#6b5a3a}
.dash.kids .dash-rec{background:#fff;border-color:#ffd166;border-radius:20px}
.dash.kids .dash-go{background:linear-gradient(135deg,#06d6a0,#118ab2);color:#fff}
.kd-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}
.kd-badges span{display:flex;flex-direction:column;align-items:center;background:#fff;border-radius:16px;padding:8px 10px;font-size:26px;min-width:74px}
.kd-badges small{font-size:11.5px;color:#6b5a3a}
.dash.kids .dash-edit{color:#8a6d3b}

/* ===== الوضع الاحترافي: هادئ ومؤشرات أداء ===== */
.dash.pro .pd-head h2{margin:0 0 2px}.dash.pro .pd-head p{margin:0;color:var(--sub)}.dash.pro .pd-head a{color:var(--sun2);font-weight:700}
.pd-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.pd-kpis div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;text-align:center}
.pd-kpis b{display:block;font-size:24px;color:var(--navy)}.pd-kpis small{color:var(--sub);font-size:12.5px}
@media (max-width:560px){.pd-kpis{grid-template-columns:repeat(2,1fr)}}
.pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:700px){.pd-grid{grid-template-columns:1fr}}
.pd-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.pd-card h3{margin:0 0 10px;font-size:16px}
.pd-lv{display:flex;align-items:center;gap:8px;margin:7px 0;font-size:13.5px}
.pd-lv span{width:28px;font-weight:800;color:var(--navy)}.pd-lv small{width:46px;text-align:end;color:var(--sub)}
.pd-bar{flex:1;height:9px;background:#eee6cf;border-radius:9px;overflow:hidden}.pd-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--navy),var(--sun));border-radius:9px}
.pd-week{display:flex;justify-content:space-between;gap:4px}
.pd-week span{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}
.pd-week i{width:100%;max-width:34px;height:34px;border-radius:10px;background:#eee6cf}
.pd-week span.on i{background:linear-gradient(135deg,var(--gold-lt),var(--sun2))}
.pd-week small{font-size:11px;color:var(--sub)}
.pd-note{color:var(--sub);font-size:13px;margin:8px 0 0}
.pd-certs{margin-top:12px}
.pd-cert{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;border:1px solid var(--line);margin-top:8px;text-decoration:none;color:var(--ink)}
.pd-cert span{font-size:24px}.pd-cert b{flex:1}.pd-cert small{color:var(--sun2);font-weight:700}
.pd-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.pd-badges span{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:4px 10px;font-size:13px}

/* ===== الشهادة ===== */
.cert-wrap{max-width:860px;margin:0 auto}
.cert{background:linear-gradient(135deg,var(--sun2),var(--gold-lt) 40%,var(--sun2));padding:10px;border-radius:20px;box-shadow:0 20px 40px -20px rgba(14,22,48,.6)}
.cert-in{background:#fffdf6;border:2px solid var(--sun);border-radius:14px;padding:28px 20px;text-align:center;color:#0e1630}
.cert-logo{border-radius:20px;background:var(--navy);padding:6px}
.cert-org{font-weight:700;color:var(--sun2);margin-top:8px;letter-spacing:.5px}
.cert-t{font-size:clamp(26px,6vw,40px);margin:10px 0 0;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--navy)}
.cert-en{font-family:Georgia,serif;font-style:italic;color:#7a6a3a;font-size:18px}
.cert-p{margin:14px 0 4px;color:#4a5470}
.cert-name{font-size:clamp(26px,7vw,42px);font-weight:900;color:var(--navy);border-bottom:2px solid var(--sun);display:inline-block;padding:0 18px 6px}
.cert-badges{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.cert-badges span{background:var(--navy);color:var(--gold-lt);border-radius:999px;padding:6px 14px;font-weight:700}
.cert-code{font-size:13px;color:#4a5470}
.cert-verify{text-align:center;color:#1e8e3e;font-weight:700}
.cert-actions{display:grid;gap:10px;max-width:420px;margin:0 auto}
.cert-actions .btn{margin:0}
.cert-li{background:#0a66c2!important;color:#fff!important;text-align:center;text-decoration:none}
.cert-link{width:100%;font-size:13px}
@media print{nav,#nav,.cert-actions,.cert-verify,footer,.back{display:none!important}body{background:#fff}main{padding:0}.cert{box-shadow:none}}
/* نص الدرس: كل فقرة بزر صوت خاص بها */
.read-btns{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}.read-btns .btn{margin:0;width:auto;flex:1;min-width:150px}
.read .rl{display:flex;align-items:flex-start;gap:10px;margin:0 0 12px;line-height:1.8}.read .rl:last-child{margin-bottom:0}
.read .rl-t{flex:1;min-width:0}
.read .rl-spk{flex:none;width:34px;height:34px;min-height:0;padding:0;font-size:16px;line-height:1;display:grid;place-items:center;margin:3px 0 0}
/* ملاءمة الدروس للعمر */
.aud-tag{display:inline-block;margin-top:4px;font-size:11.5px;font-weight:700;opacity:.92}
.aud-note{text-align:center;color:var(--sub);font-size:14px;margin:12px 0}.aud-note a{color:var(--sun2);font-weight:700}
.tile.aud-dim{opacity:.7}
/* التخصص */
.wl-form:has(input[name=age][value=kid]:checked) .wl-field{display:none}
.wl-cards.wl-fields{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.wl-fields .wl-card{padding:10px 6px}.wl-fields .wl-ic{font-size:26px}
.pd-field{margin-top:12px}.pd-field h3 small{font-weight:400;color:var(--sub);font-size:12.5px}
.fw-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.fw{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer;text-align:start;font-family:inherit}
.fw:hover{border-color:var(--sun)}.fw b{font-size:16px}.fw small{color:var(--sub);font-size:12.5px}
.fw.playing{border-color:var(--sun2);background:#d4af3722}
.wl-form{counter-reset:wlstep}.wl-step{counter-increment:wlstep}.wl-n:before{content:counter(wlstep)}
.rel-tag{display:inline-block;margin:4px 2px 0;font-size:11.5px;font-weight:700;background:#d4af3726;border:1px solid #d4af3766;border-radius:999px;padding:1px 8px}

/* ===== «في مجالك»: بطاقة المجال في آخر كل وحدة من المستوى الأول ===== */
.fc-card{background:linear-gradient(135deg,#0f1f3d,#1b3360);color:#fff;border-radius:18px;padding:18px;box-shadow:0 8px 24px #0f1f3d33;border:1px solid #d4af37}
.fc-t{font-size:20px;font-weight:800;color:#f3d27a;margin-bottom:4px}
.fc-scene{margin:0 0 12px;opacity:.9;font-size:15px}
.fc-lines{display:grid;gap:8px}
.fc-line{display:flex;gap:10px;align-items:center;background:#ffffff14;border-radius:12px;padding:8px 10px}
.fc-line b{display:block;text-align:left;font-size:17px;color:#fff}.fc-line small{display:block;color:#dbe4f5;font-size:14px}
.fc-scene{color:#e8eefc}
.fc-line .spk{flex:0 0 auto}
.fc-words{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.fc-words .fw{background:#d4af37;color:#0f1f3d;border:0;border-radius:12px;padding:6px 12px;font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center}
.fc-words .fw small{font-size:12px}
.fc-q{background:#fff;color:var(--ink,#1a1a1a);border-radius:12px;padding:10px}
.fc-tease{margin-top:12px;border:2px dashed #d4af37;border-radius:16px;padding:14px;background:#fffaf0;color:#3a2a00}
.fc-tease p{margin:0 0 10px;font-weight:700;line-height:1.8}
.fc-prog{display:flex;align-items:center;gap:8px;font-size:13px}.fc-prog .pd-bar{flex:1}
.fc-empty{text-align:center}.fc-empty .btn{display:inline-block;width:auto;margin-top:8px;text-decoration:none}
.fc-task{margin-top:10px;background:#ffffff14;border-radius:12px;padding:10px;color:#f3d27a}
.fc-q+.fc-q{margin-top:8px}

/* ===== ترحيب المستوى واختيار المجال (المستوى الثاني فصاعداً) ===== */
.lv-welcome{background:linear-gradient(135deg,#0f1f3d,#1b3360);color:#fff;border:1px solid #d4af37;border-radius:18px;padding:16px;margin:10px 0 16px;box-shadow:0 8px 24px #0f1f3d26}
.lvw-head{display:flex;gap:12px;align-items:flex-start}.lvw-ic{font-size:34px}
.lvw-head b{font-size:19px;color:#f3d27a}.lvw-head p{margin:4px 0 0;color:#e8eefc;line-height:1.8}
.lvw-field{display:flex;gap:10px;align-items:center;margin-top:12px;background:#ffffff14;border-radius:12px;padding:10px}
.lvw-field>span{font-size:28px}.lvw-field b{color:#fff}.lvw-field small{display:block;color:#dbe4f5;line-height:1.7;margin-top:2px}
.lvw-change{margin-inline-start:auto;background:#d4af37;color:#0f1f3d;white-space:nowrap;font-weight:800;border-radius:10px;padding:6px 10px;text-decoration:none}
.lvw-ask{margin:12px 0 8px;color:#fff;line-height:1.8}
.lvw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-top:10px}
.lvw-opt{background:#fff;color:#0f1f3d;border:2px solid transparent;border-radius:12px;padding:10px 8px;font:inherit;font-weight:700;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px}
.lvw-opt span{font-size:24px}.lvw-opt.on,.lvw-opt:hover{border-color:#d4af37;background:#fffaf0}
body.mode-kids .lv-welcome{background:linear-gradient(135deg,#ff9f43,#ffc93c);border-color:#fff;color:#3a2200}
body.mode-kids .lvw-head b{color:#5a1e00}body.mode-kids .lvw-head p{color:#3a2200;font-weight:600}
.fc-banner{display:flex;align-items:center;gap:10px;width:100%;margin:10px 0;background:linear-gradient(135deg,#0f1f3d,#1b3360);color:#fff;border:1px solid #d4af37;border-radius:14px;padding:12px 14px;font:inherit;cursor:pointer;text-align:start}
.fc-banner span{font-size:24px}.fc-banner b{flex:1;color:#f3d27a}.fc-banner i{font-style:normal;color:#f3d27a;font-weight:800}
/* ===== مراجعة اليوم ===== */
.rv-wrap{max-width:640px;margin:0 auto}.rv-sub{color:var(--sub);line-height:1.9}
.rv-stats{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.rv-stats span{background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;padding:6px 10px;font-size:14px}
.rv-bar{height:10px;background:#eee6cf;border-radius:10px;overflow:hidden;margin:10px 0}.rv-bar i{display:block;height:100%;background:linear-gradient(90deg,#0f1f3d,#d4af37);transition:width .3s}
.rv-card{background:var(--card,#fff);border:1px solid var(--line);border-radius:18px;padding:18px;text-align:center;box-shadow:0 6px 18px #0001}
.rv-type{font-weight:800;color:#b8860b;margin-bottom:10px}.rv-prompt{font-size:24px;font-weight:800;margin:10px 0}.rv-ar{direction:rtl}.rv-hint{color:var(--sub)}
.rv-big{font-size:34px;width:72px;height:72px}
.rv-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.rv-o{border:2px solid var(--line);background:var(--card,#fff);border-radius:12px;padding:12px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink)}
.rv-o.ok{border-color:#1e8e3e;background:#e8f7ed}.rv-o.bad{border-color:#d93025;background:#fdecea}
.rv-fb{margin-top:12px;padding:10px;border-radius:12px;line-height:2}.rv-fb.ok{background:#e8f7ed}.rv-fb.err{background:#fff4e5}
.rv-fb .rv-next{display:block;width:100%;margin-top:8px}.rv-show{margin-top:10px}
.rv-end .rv-big-ic{font-size:56px}.rv-end .btn{display:inline-block;width:auto;margin:6px 4px;text-decoration:none}.rv-empty{text-align:center;line-height:2}
.dash-review{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#0f1f3d,#1b3360);color:#fff;border-radius:16px;padding:14px;margin:12px 0;text-decoration:none;border:1px solid #d4af37}
.dash-review span{font-size:30px}.dash-review b{color:#f3d27a;display:block}.dash-review small{color:#dbe4f5}.dash-review i{margin-inline-start:auto;font-style:normal;background:#d4af37;color:#0f1f3d;border-radius:10px;padding:6px 10px;font-weight:800}
/* ===== لائحة الدرجات ===== */
.gr-wrap{max-width:760px;margin:0 auto}.gr-sub{line-height:1.9;color:var(--sub)}
.gr-table{width:100%;border-collapse:collapse;background:var(--card,#fff);border-radius:14px;overflow:hidden;margin:10px 0}
.gr-table th{background:#0f1f3d;color:#f3d27a;padding:8px;text-align:start}.gr-table td{padding:8px;border-top:1px solid var(--line);vertical-align:top;line-height:1.7}
.gr-w{font-weight:800;color:#b8860b;white-space:nowrap}.gr-rules{line-height:1.9}
.gr-card{background:var(--card,#fff);border:1px solid var(--line);border-radius:16px;padding:14px;margin:12px 0}
.gr-head{display:flex;gap:12px;align-items:center;margin-bottom:10px}.gr-head small{display:block;color:var(--sub)}
.gr-total{width:78px;height:78px;border-radius:50%;border:5px solid #d8cfb5;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 auto}
.gr-total b{font-size:24px;line-height:1}.gr-total.pass{border-color:#1e8e3e}
.gr-lab{display:block;font-weight:700;color:#b8860b}
.gr-row{display:grid;grid-template-columns:150px 1fr 110px;gap:8px;align-items:center;margin:6px 0;font-size:14px}
.gr-tip{background:#fff8e6;border-radius:10px;padding:8px 10px;margin:10px 0 0;line-height:1.8}
@media (max-width:520px){.gr-row{grid-template-columns:1fr 90px}.gr-row .pd-bar{grid-column:1/-1;grid-row:2}}
html[data-view="mobile"] .gr-row{grid-template-columns:1fr 90px}html[data-view="mobile"] .gr-row .pd-bar{grid-column:1/-1;grid-row:2}
.warm-q{background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;padding:10px}.warm-q .phq-t span{font-size:19px}.warm-ex{display:block;color:var(--sub);font-weight:400;margin-top:4px}
.ex-say{margin:0 0 10px;padding:0;border:0;background:none;text-align:start}.ex-say .mic{width:auto;font-size:13px;padding:4px 10px}.ex-say .spkres:empty{display:none}
.gr-table{table-layout:fixed}.gr-table td{overflow-wrap:anywhere}
@media (max-width:520px){.gr-table thead{display:none}.gr-table tr{display:grid;grid-template-columns:1fr auto;border-top:1px solid var(--line)}.gr-table td{border:0;padding:6px 10px}.gr-table td:nth-child(3){grid-column:1/-1;padding-top:0;color:var(--sub);font-size:14px}}
@media (max-width:520px){.gr-table,.gr-table tbody{display:block;width:100%}.gr-table td{min-width:0;white-space:normal}}
/* ===== في يومك + عباراتي أينما كنت ===== */
.life-card{background:var(--card,#fff);border:2px solid #d4af37;border-radius:16px;padding:14px}
.life-places{display:flex;gap:6px;flex-wrap:wrap}.life-places span{background:#fff8e6;border-radius:20px;padding:3px 10px;font-size:13px}
.life-m{line-height:1.9;margin:10px 0 4px;font-size:17px}
.life-say{display:flex;align-items:center;gap:10px;background:#f6f8fc;border-radius:12px;padding:8px 10px;margin-top:8px}
.life-say>div{flex:1}.life-say b{display:block;text-align:left}.life-say small{display:block;color:var(--sub)}
.life-note{width:100%;margin-top:10px}.life-ok{margin-top:8px}.life-done{margin-top:10px;background:#e8f7ed;border-radius:10px;padding:8px 10px}
.ph-wrap{max-width:720px;margin:0 auto}.ph-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.ph-tab{border:1px solid var(--line);background:var(--card,#fff);border-radius:20px;padding:6px 12px;text-decoration:none;color:var(--ink)}.ph-tab.on{background:#0f1f3d;color:#f3d27a;border-color:#0f1f3d}
.ph-from{font-size:12px;opacity:.75;text-align:left}.ph-item{border-bottom:1px dashed var(--line);padding-bottom:4px}
.gr-tiers{display:grid;gap:4px;margin:12px 0}.gr-tier{background:var(--card,#fff);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
.gr-tier>b{display:block;color:#0f1f3d;margin-bottom:6px}.gr-arrow{text-align:center}
.gr-li{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:4px 0;border-top:1px dashed var(--line)}.gr-li>b{color:#b8860b}.gr-li small{grid-column:1/-1;color:var(--sub)}
.gr-uh{margin:14px 0 6px}.gr-unit{border:1px solid var(--line);border-radius:12px;margin:6px 0;background:#fffdf7}
.gr-unit summary{display:grid;grid-template-columns:1fr 90px 36px;gap:8px;align-items:center;padding:8px 10px;cursor:pointer}
.gr-ls{width:100%;border-collapse:collapse;font-size:13px}.gr-ls th,.gr-ls td{padding:5px 6px;border-top:1px solid var(--line);text-align:center}.gr-ls td:first-child{text-align:left}
.ls-grade{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fffaf0;border:1px solid #d4af37;border-radius:14px;padding:8px 12px;margin:8px 0;text-decoration:none;color:var(--ink)}
.ls-grade b{font-size:20px;color:#0f1f3d}.ls-grade b small{font-size:12px;color:var(--sub)}.ls-grade i{font-style:normal;display:flex;gap:8px;margin-inline-start:auto;font-size:13px}.ls-grade em{font-style:normal;background:#fff;border-radius:8px;padding:2px 6px}
.ug-tag{display:inline-block;margin-top:4px;background:#ffffff33;border-radius:10px;padding:2px 8px;font-weight:700}