@font-face{font-family:Tajawal;src:url(assets/Tajawal-Regular.ttf);font-display:swap}*{box-sizing:border-box}body{margin:0;background:#f0f5f7;color:#163849;font:18px Tajawal,Arial,sans-serif}header{display:flex;align-items:center;gap:18px;padding:24px 4%;background:#102d43;color:#fff}header img{width:60px;height:60px;object-fit:contain;background:white;border-radius:14px;padding:5px}h1{font-size:28px;margin:0}header p{margin:6px 0 0;color:#c0dce8}header a{margin-inline-start:auto;color:white}main{max-width:1660px;margin:auto;padding:28px 4%;display:grid;grid-template-columns:minmax(0,1fr) 355px;gap:25px}.viewer{min-width:0}video{display:block;width:100%;aspect-ratio:16/9;border-radius:16px;background:#081c2a}h2{font-size:26px;margin:22px 0 8px}p{line-height:1.7}.actions,.filters{display:flex;gap:8px;flex-wrap:wrap}button,input,a{font:inherit}button,.actions a{padding:11px 18px;border:1px solid #bacdd5;border-radius:9px;background:#fff;color:#163849;cursor:pointer;text-decoration:none}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #008a94;outline-offset:3px}aside{background:#fff;border:1px solid #d0e0e6;border-radius:16px;padding:18px;min-width:0}input{width:100%;padding:12px;margin:10px 0 14px;border:1px solid #a6c1cb;border-radius:8px}.filters button{flex:1;font-size:16px;padding:9px}.filters [aria-pressed=true]{background:#087f85;color:white;border-color:#087f85}#list{max-height:65vh;overflow:auto}#count,.note,#details{color:#516b79;font-size:16px}.lesson{display:flex;gap:12px;width:100%;text-align:right;border:0;border-bottom:1px solid #e1eaee;border-radius:0;padding:14px 7px;align-items:center}.lesson img{width:90px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}.lesson span{flex:1;min-width:0}.lesson b{display:block;font-size:17px;line-height:1.5}.lesson small{display:block;color:#536e7c;margin-top:5px}.lesson[aria-current=true]{background:#e4f5f1;box-shadow:inset -4px 0 #087f85}.note{border-top:1px solid #cedee4;margin-top:25px;padding-top:18px}#error{background:#fff0f0;color:#972d3a;border:1px solid #f0ccd1;border-radius:8px;padding:14px} [hidden]{display:none!important}@media(max-width:950px){main{grid-template-columns:1fr}#list{max-height:450px}}@media(max-width:500px){header{padding:18px;gap:10px;flex-wrap:wrap}header img{width:46px;height:46px}h1{font-size:23px}header p{font-size:15px}header a{font-size:15px}main{padding:16px;gap:20px}h2{font-size:23px}}