.pd10-root{
  --ink:#17253b;--muted:#6c7d92;--line:#dce5f0;--soft:#f7f9fd;
  --blue:#2b62c8;--blue2:#194b9f;--violet:#7051e7;--teal:#168d93;
  --ok:#157354;--okbg:#eaf8f1;--bad:#a7433c;--badbg:#fff1ef;
  font-family:"Manrope","Segoe UI",Arial,sans-serif;color:var(--ink);font-size:17px;line-height:1.6;
  max-width:1060px;margin:0 auto;padding:0 14px;
}
.pd10-root *{box-sizing:border-box}.pd10-root button,.pd10-root input{font:inherit}.pd10-root button{cursor:pointer}.pd10-root button:disabled{opacity:.45;cursor:not-allowed}
.pd10-root button:focus-visible,.pd10-root input:focus-visible,.pd10-root summary:focus-visible{outline:3px solid #f1b42f;outline-offset:2px}
.pd10-dashboard[hidden],.pd10-player[hidden]{display:none!important}

.pd10-hero{padding:30px 4px 24px}.pd10-kicker{display:block;color:var(--blue);font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.pd10-hero h1{margin:7px 0 8px;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.1;letter-spacing:-.035em}.pd10-hero p{margin:0;color:var(--muted);font-size:.98rem}.pd10-overall{margin-top:20px}.pd10-overall-meta{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;color:#52647c}.pd10-track,.pd10-mini-track{height:10px;background:#e9eef5;border-radius:999px;overflow:hidden}.pd10-track{margin-top:7px}.pd10-track span,.pd10-mini-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--violet),var(--teal));border-radius:999px;transition:width .2s}
.pd10-lessons{display:grid;gap:13px;padding:6px 0 28px}.pd10-lesson{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:stretch;border:1px solid var(--line);border-radius:20px;background:#fff;padding:17px 18px;box-shadow:0 8px 24px rgba(22,48,86,.04)}.pd10-lesson-num{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#eef4ff;color:var(--blue2);font-weight:800}.pd10-lesson.is-active .pd10-lesson-num{background:linear-gradient(135deg,var(--blue),var(--violet));color:#fff}.pd10-lesson.is-complete .pd10-lesson-num{background:var(--ok);color:#fff}.pd10-lesson-main{min-width:0}.pd10-lesson-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}.pd10-lesson-head h2{margin:0;color:#183454;font-size:1.08rem;line-height:1.3}.pd10-lesson-head span{white-space:nowrap;border-radius:999px;background:#f2f4f7;color:#69788b;padding:4px 8px;font-size:.72rem;font-weight:700}.pd10-mini-track{height:8px;margin:11px 0}.pd10-lesson-foot{display:flex;justify-content:space-between;align-items:center;gap:14px}.pd10-lesson-foot small{color:var(--muted);font-size:.8rem;font-weight:700}

.pd10-primary,.pd10-btn,.pd10-step,.pd10-option,.pd10-token,.pd10-icon{border-radius:13px;min-height:46px;font-weight:700}.pd10-primary{border:0;background:linear-gradient(135deg,var(--blue),var(--violet));color:#fff;padding:11px 18px;box-shadow:0 4px 0 #19427f}.pd10-primary.compact{min-height:42px;padding:8px 14px}.pd10-primary:active{transform:translateY(1px);box-shadow:0 2px 0 #19427f}.pd10-btn,.pd10-step,.pd10-token,.pd10-icon{border:1px solid #cdd8e6;background:#fff;color:#274a70;padding:9px 14px}.pd10-btn.listen{color:var(--teal)}.pd10-step.done{background:var(--okbg);border-color:#a7d9c3;color:var(--ok)}

.pd10-topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:46px minmax(0,1fr) 46px;gap:12px;align-items:center;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);padding:12px 0;border-bottom:1px solid var(--line)}.admin-bar .pd10-topbar{top:32px}.pd10-icon{width:44px;height:44px;padding:0;font-size:1.05rem}.pd10-progress-wrap{min-width:0}.pd10-progress-meta{display:flex;justify-content:space-between;gap:12px;color:#65768b;font-size:.77rem;font-weight:700}.pd10-app{padding:28px 0 68px}.pd10-stage{max-width:780px;margin:0 auto}.pd10-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}.pd10-stage h1{margin:0;color:#173250;font-size:clamp(1.55rem,3.8vw,2.15rem);line-height:1.15;letter-spacing:-.025em}.pd10-badge{display:inline-block;border-radius:999px;background:#eef3f8;color:#5f7187;padding:6px 10px;font-size:.75rem;font-weight:800}.pd10-card{border:1px solid var(--line);border-radius:22px;background:#fff;padding:24px;box-shadow:0 10px 28px rgba(21,47,84,.05);position:relative;overflow:hidden}.pd10-card:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--blue),var(--violet),var(--teal))}.pd10-card>p:first-child{margin-top:0}.pd10-fr{font-size:clamp(1.22rem,3vw,1.55rem);font-weight:600;line-height:1.48;color:#1c2e43;margin:16px 0}.pd10-fr.prompt{font-size:1.2rem}.pd10-fr.correction{font-size:1.06rem}.pd10-fr.mask{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.pd10-ar{direction:rtl;text-align:right;background:#f3f7fc;border:1px solid #e4ebf4;border-radius:14px;padding:13px 15px;font-family:"Noto Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif;font-size:1.15rem;line-height:1.9;margin:12px 0}.pd10-note{color:var(--muted);font-size:.84rem}.pd10-card details{margin-top:10px;color:#607188;font-size:.86rem}.pd10-card summary{cursor:pointer;color:#355d89;font-weight:700}.pd10-tip{background:#f3f6fb;border-left:4px solid var(--violet);padding:12px 14px;border-radius:10px;color:#42566f;margin:13px 0}.pd10-actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}.pd10-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.pd10-two .pd10-step{min-height:54px}.pd10-nav{display:grid;grid-template-columns:minmax(150px,.35fr) minmax(220px,1fr);gap:12px;margin-top:18px}.pd10-nav .pd10-primary,.pd10-nav .pd10-btn{width:100%;min-height:52px}.pd10-input{width:100%;min-height:54px;border:1px solid #b9c9db;border-radius:13px;padding:12px 14px;font-size:1rem;margin-top:8px}
.pd10-options{display:grid;gap:10px;margin:14px 0}.pd10-option{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;text-align:left;border:1px solid #c7d4e4;background:#fff;color:#243f5f;padding:11px 13px;min-height:55px}.pd10-option>span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#f2f5f9;color:#62758b;font-size:.8rem}.pd10-option[lang=ar]{direction:rtl;text-align:right}.pd10-option.good{background:var(--okbg);border-color:#9bd6bc;color:var(--ok)}
.pd10-built,.pd10-bank{display:flex;gap:8px;flex-wrap:wrap;border:1px dashed #bccce0;border-radius:13px;padding:11px;min-height:56px;margin:12px 0;align-items:center}.pd10-built{background:#f7f9fc}.pd10-token{min-height:42px;padding:8px 11px}.pd10-blank{display:inline-block;min-width:.7em;text-align:center;border-bottom:2px solid var(--blue)}
.pd10-feedback{margin-top:15px;padding:13px 15px;border-radius:13px;border-left:4px solid var(--blue);background:#eef4ff}.pd10-feedback.ok{background:var(--okbg);border-color:var(--ok);color:var(--ok)}.pd10-feedback.bad{background:var(--badbg);border-color:var(--bad);color:#873a34}.pd10-live{min-height:1.2em;color:#61738a;font-size:.84rem}

@media(max-width:782px){.admin-bar .pd10-topbar{top:46px}}
@media(max-width:600px){.pd10-root{font-size:16px;padding:0 10px}.pd10-hero{padding-top:22px}.pd10-hero h1{font-size:1.85rem}.pd10-lesson{grid-template-columns:42px minmax(0,1fr);padding:14px 13px}.pd10-lesson-num{width:38px;height:38px}.pd10-lesson-head{display:block}.pd10-lesson-head span{display:inline-block;margin-top:6px}.pd10-lesson-foot{align-items:stretch;flex-direction:column}.pd10-primary.compact{width:100%}.pd10-app{padding-top:20px}.pd10-card{padding:18px 15px;border-radius:18px}.pd10-stage h1{font-size:1.48rem}.pd10-fr{font-size:1.22rem}.pd10-ar{font-size:1.08rem}.pd10-two{grid-template-columns:1fr}.pd10-nav{grid-template-columns:1fr 1.6fr}.pd10-option{grid-template-columns:31px minmax(0,1fr)}.pd10-progress-meta{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.pd10-track span,.pd10-mini-track span{transition:none}}