:root{--blue:#0084bd;--deep:#00618c;--ink:#182e3a;--grey:#748995;--cream:#e3e0d2;--line:#dce6ec;--paper:#fff;--soft:#f3f8fb;--success:#126e55;--warn:#8c5a1a;font-family:Tahoma,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#f5f8fa;font-size:16px;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;line-height:1.85}button,select{font:inherit}button,select,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #edaa35;outline-offset:4px}[hidden]{display:none!important}.shell{max-width:1220px;padding:0 32px;margin:auto}.masthead{display:flex;justify-content:space-between;align-items:center;padding:25px 0;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px}.brand strong{font-size:1.2rem;display:block}.brand div>span{display:block;font-size:.875rem;color:#526875}.brand-icon{display:grid;place-items:center;background:var(--blue);color:white;width:44px;height:48px;border-radius:13px 13px 13px 3px;font-size:1.6rem}.training-tag{font-size:.875rem;color:var(--deep);background:#e3f1f8;border:1px solid #cee6f1;border-radius:20px;padding:3px 13px}.intro{padding:27px 0 26px}.intro h1{font-size:clamp(1.25rem,2.5vw,1.65rem);margin:0 0 4px;letter-spacing:0}.intro p{color:#526875;margin:0}.layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:26px;align-items:start}.index{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 12px}.index-head{display:flex;justify-content:space-between;padding:0 8px 12px;align-items:center}.index-head span{font-size:.875rem;color:#536a76}#topic-list{max-height:640px;overflow:auto;scrollbar-width:thin;padding:0 4px}.group-title{font-size:.875rem;color:#586e7a;margin:19px 10px 6px;font-weight:normal}.topic-button{width:100%;border:0;background:none;text-align:right;display:flex;gap:10px;align-items:center;padding:8px 10px;min-height:44px;border-radius:9px;color:#3d5461;font-size:.92rem;line-height:1.65;margin:2px 0}.topic-button:hover{background:#f2f7fa}.topic-button[aria-current="true"]{background:#e4f2fa;color:#00567e;font-weight:bold;box-shadow:inset -3px 0 var(--blue)}.topic-number{font-size:.8rem;min-width:18px;color:#58727f}.topic-button .done{margin-inline-start:auto;color:var(--success)}.learning-progress{border-top:1px solid var(--line);margin:20px 8px 0;padding-top:14px;font-size:.875rem;color:#536a76}progress{width:100%;height:6px;border:0;border-radius:10px;display:block;margin-top:8px;overflow:hidden;appearance:none}progress::-webkit-progress-bar{background:#e9eff3}progress::-webkit-progress-value{background:var(--blue)}progress::-moz-progress-bar{background:var(--blue)}.mobile-label,#topic-select{display:none}.workspace{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;min-width:0;box-shadow:0 8px 40px #18394906}.topic-header{padding:27px 32px 22px}.eyebrow{margin:0 0 7px;font-size:.875rem;color:var(--deep)}h2{font-size:1.8rem;line-height:1.5;margin:0 0 8px}h3{font-size:1.06rem;margin:0 0 8px}.meaning{margin:0;color:#526875;max-width:650px}.tabs{display:grid;grid-template-columns:repeat(4,1fr);padding:0 24px;border-bottom:1px solid var(--line);gap:7px}.tabs button{background:none;border:0;border-bottom:3px solid transparent;border-radius:8px 8px 0 0;color:#536a76;padding:13px 4px;min-height:54px;font-weight:bold;display:flex;gap:9px;justify-content:center;align-items:center}.tabs button span{background:#f0f4f6;width:24px;height:24px;border-radius:50%;font-size:.8rem;display:grid;place-items:center;line-height:1}.tabs button[aria-selected="true"]{border-bottom-color:var(--blue);color:var(--deep);background:#f5fafd}.tabs button[aria-selected="true"] span{background:var(--blue);color:white}.panel{padding:30px 32px;min-height:355px}.section-label{font-size:.875rem;color:#536a76;margin:0 0 9px}.conversation,.scenario{border:1px solid #d5e9f3;border-radius:15px;background:linear-gradient(120deg,#f7fbfd,#edf7fc);padding:21px 24px}.speaker{display:inline-block;font-size:.875rem;color:var(--deep);margin-bottom:3px}.conversation p{margin:0;font-size:1.4rem;line-height:1.9}.followup{padding:23px 0 19px}.followup p{margin:0;color:#37515f;font-size:1.08rem}.takeaway{display:flex;gap:14px;background:#faf9f4;border:1px solid #ece8db;padding:15px 18px;border-radius:12px}.takeaway>span{font-size:1.4rem;color:#756b48}.takeaway strong{font-size:.875rem;color:#6b623f}.takeaway p{margin:3px 0 0;font-size:.95rem}.muted{color:#536a76}.panel>.muted{margin:0 0 18px}.evidence-list{list-style:none;padding:0;margin:0 0 23px;display:grid;gap:8px}.evidence-list li{padding:11px 15px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:baseline;gap:13px}.evidence-list li::before{content:"▤";color:var(--blue)}.verification ul{margin:6px 0 16px;padding-inline-start:23px}.verification li{margin-bottom:6px}.gentle-note{background:#f2f7fa;border-inline-start:3px solid #85b9d2;padding:12px 16px;border-radius:6px;font-size:.95rem;margin:0}.result-buttons{display:flex;gap:8px;margin-bottom:17px;flex-wrap:wrap}.result-buttons button{border:1px solid #cbdde6;background:#fff;border-radius:10px;min-height:46px;padding:7px 19px;color:var(--deep)}.result-buttons button[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:#fff}.record-help{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:21px}.record-help p{margin:0 0 11px}.record-help p:last-child{margin-bottom:0}.template{padding:13px 15px;background:white;border-radius:8px;border:1px dashed #bed1dd;white-space:pre-line;line-height:2}.template-label{font-size:.875rem;font-weight:bold;color:var(--deep);margin:12px 0 7px!important}.mini-details{border-top:1px solid var(--line);font-size:.95rem}.mini-details summary{min-height:48px;padding:12px 0;cursor:pointer;color:var(--deep)}.mini-details>div{padding:0 6px 10px}.mini-details p{margin:5px 0 13px}.practice-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.practice-title h3{margin:0}.practice-title>span{font-size:.875rem;color:#68764e;background:#f4f4e9;padding:2px 9px;border-radius:5px}.scenario p{margin:0;font-size:1.08rem}.quiz-question{font-weight:bold;margin:20px 0 11px}.quiz-options{display:grid;gap:9px}.quiz-options button{background:white;border:1px solid #cedee7;border-radius:11px;text-align:right;padding:12px 16px;line-height:1.8;display:flex;gap:12px;color:var(--ink);min-height:54px}.quiz-options button:hover:not(:disabled){border-color:var(--blue);background:#f7fbfd}.quiz-options button:disabled{opacity:1}.quiz-options button span{color:#637c8a}.quiz-options button.chosen{border:2px solid var(--blue);padding:11px 15px;background:#eef7fc}.feedback{padding:15px 18px;border-radius:10px;margin-top:15px;background:#fff8ec;color:#74511f;border:1px solid #e6cc9f}.feedback.correct{background:#edf8f3;border-color:#b2dacc;color:#155f4b}.feedback strong{display:block}.feedback p{margin:3px 0 0}.text-button{background:none;border:none;color:var(--deep);text-decoration:underline;text-underline-offset:4px;padding:10px 2px;min-height:44px}.workspace-footer{padding:19px 32px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line)}.workspace-footer>span{font-size:.875rem;color:#536a76}.primary,.secondary{border:1px solid var(--line);border-radius:10px;padding:9px 18px;min-height:46px;font-weight:bold}.primary{background:var(--deep);border-color:var(--deep);color:white}.primary:hover{background:#004e74}.secondary{background:white;color:var(--deep)}.source-details{border-top:1px solid var(--line);background:#fafcfd}.source-details summary{padding:12px 32px;min-height:48px;font-size:.875rem;color:#526c7b;cursor:pointer}.source-content{padding:0 32px 17px;font-size:.875rem}.source-content ul{padding-inline-start:22px}.source-content p{margin:10px 0}.source-content #official-title{font-weight:bold;color:var(--deep)}.page-footer{margin:24px auto 30px;text-align:center;color:#536a76;font-size:.875rem;max-width:800px}.page-footer p{margin:4px 0}.page-footer #storage-note{font-size:.8rem}.skip{position:absolute;top:-80px;padding:12px;background:white;color:var(--deep);z-index:10}.skip:focus{top:5px}button,summary{transition:background .15s,border-color .15s}p,li,h1,h2,h3,button{overflow-wrap:anywhere}
@media(min-width:901px){.index{position:sticky;top:18px}}
@media(max-width:900px){.shell{padding:0 20px}.layout{grid-template-columns:1fr;gap:17px}.index{padding:14px 17px;border-radius:13px}.index-head{display:none}#topic-list{display:none}.mobile-label{display:block;font-size:.875rem;color:#536a76;margin-bottom:5px}#topic-select{display:block;width:100%;min-height:48px;border:1px solid #bcd2df;border-radius:8px;padding:8px 12px;background:#fff;color:var(--ink);text-overflow:ellipsis}.learning-progress{border:0;margin:10px 0 0;padding:0;display:flex;align-items:center;gap:15px;font-size:.8rem}.learning-progress progress{flex:1;margin:0;max-width:160px}.intro{padding:21px 0}.topic-header{padding:22px 26px}.panel{padding:24px 26px;min-height:330px}.workspace-footer{padding:18px 26px}}
@media(max-width:520px){.shell{padding:0 13px}.masthead{padding:17px 0}.brand strong{font-size:1.05rem}.brand-icon{width:38px;height:42px}.brand div>span{font-size:.8rem}.training-tag{font-size:.8rem;padding:3px 10px}.intro h1{font-size:1.15rem}.intro p{font-size:.93rem}.topic-header{padding:20px 19px}h2{font-size:1.45rem}.meaning{font-size:.95rem}.tabs{padding:0 10px;gap:3px}.tabs button{font-size:.95rem;gap:5px}.tabs button span{width:21px;height:21px}.panel{padding:23px 19px;min-height:0}.conversation,.scenario{padding:17px}.conversation p{font-size:1.19rem}.followup p{font-size:1rem}.takeaway{padding:12px;gap:10px}.result-buttons{gap:6px}.result-buttons button{padding:7px 10px;font-size:.92rem;flex:1;white-space:nowrap}.workspace-footer{padding:16px 19px;gap:8px}.workspace-footer>span{display:none}.primary,.secondary{font-size:.95rem;padding:9px 14px}.source-details summary{padding:13px 19px}.source-content{padding:0 19px 15px}.page-footer{font-size:.8rem}.quiz-options button{padding:11px 12px}.quiz-options button.chosen{padding:10px 11px}.practice-title{align-items:flex-start}.practice-title>span{white-space:nowrap}.workspace{border-radius:16px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Keep Arabic tab labels whole, including on 320px screens. */
.tabs{grid-template-columns:repeat(auto-fit,minmax(min(100%,4.1rem),1fr))}
.tabs button{white-space:nowrap;overflow-wrap:normal;min-width:0}
.tabs button span{flex-shrink:0}
.best-result-note{font-size:.875rem;border-top:1px solid currentColor;padding-top:8px;margin-top:10px!important}
@media(max-width:380px){.tabs button span{display:none}.tabs button{gap:0}}
.role-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none;white-space:nowrap}
.role-link:hover{background:#d5eaf5}
/* Let controls reflow when the reader increases text size, without splitting
   Arabic words or changing the four-tab layout at the normal font size. */
.masthead{flex-wrap:wrap;gap:12px}
.brand{min-width:0;max-width:100%}.brand>div{min-width:0}.brand-icon{flex-shrink:0}
.practice-title{flex-wrap:wrap}
.quiz-options button span{color:#526875}
.quiz-options button .option-text{color:var(--ink)}
.storage-alert{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:#fff8ec;border-bottom:1px solid #e6cc9f;color:#74511f;font-size:.9rem}
.storage-alert p{margin:0}.storage-alert button{flex-shrink:0}
@media(max-width:520px){.storage-alert{align-items:flex-start;flex-direction:column}}