@import "https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800&display=swap";:root{color:#244b54;--blue:#62bdca;--dark:#276e79;--cream:#eee1ca;--gold:#c7a457;--white:#fff;background:#f8f6f0;font-family:Tajawal,Arial,sans-serif;line-height:1.5}*{box-sizing:border-box}body{background:radial-gradient(circle at 12% 10%,#dff5f7 0 9%,#0000 25%),radial-gradient(circle at 90% 85%,#f4e9d8 0 8%,#0000 24%),#faf9f5;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.45;cursor:not-allowed}h1,h2,h3,h4,p{margin-top:0}svg{width:21px;height:21px}.pearls{color:#cbb27b;opacity:.55;letter-spacing:3px;z-index:-1;position:fixed;top:18px;left:24px}footer{text-align:center;color:#6c8b91;padding:26px}.hero{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 75px);padding:30px;display:flex}.shell{color:#c5a764;background:linear-gradient(145deg,#fff,#daeef0);border-radius:50% 50% 45% 45%;place-items:center;width:105px;height:105px;margin-bottom:18px;font-size:72px;display:grid;box-shadow:0 15px 40px #2869761c}.eyebrow{color:#548b94;background:#e8f5f5;border-radius:99px;padding:6px 14px;font-size:14px;font-weight:700;display:inline-block}.hero h1{color:#276e79;align-items:center;gap:10px;margin:12px 0 4px;font-size:clamp(42px,7vw,76px);display:flex}.hero h1 svg{color:#d4af5a;width:42px;height:42px}.hero>p{color:#607b80;font-size:19px}.entry{gap:16px;margin:28px 0 16px;display:flex}.big{border-radius:18px;align-items:center;gap:10px;padding:18px 32px;font-size:18px;font-weight:700;transition:all .2s;display:flex;box-shadow:0 12px 25px #234f5818}.big:hover,.level:hover{transform:translateY(-4px)}.primary{color:#fff;background:linear-gradient(135deg,#68c6d2,#3b9fac);border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-weight:700;display:inline-flex}.cream{color:#6d5734;background:#eee1ca}.link,.ghost,.back{color:#367985;background:0 0;align-items:center;gap:7px;padding:10px;display:inline-flex}.center{place-items:center;min-height:calc(100vh - 60px);padding:70px 20px;display:grid;position:relative}.back{position:absolute;top:24px;right:30px}.panel{background:#fffc;border:1px solid #e7ece8;border-radius:22px;margin-bottom:22px;padding:25px;box-shadow:0 10px 35px #2d626b12}.login{text-align:center;width:min(470px,100%)}.icon{color:#2c8d99;background:#dff3f5;border-radius:50%;place-items:center;width:70px;height:70px;margin:auto;display:grid}.icon svg{width:34px;height:34px}.icon.gold{color:#a88235;background:#f4ead5}.login h2{margin:12px 0 3px;font-size:30px}.login label,.form label{text-align:right;gap:7px;margin:18px 0;font-weight:700;display:grid}input,select,textarea{color:#284f56;background:#fff;border:1px solid #d6e0df;border-radius:11px;outline:none;width:100%;padding:12px 14px}input:focus,select:focus,textarea:focus{border-color:#62bdca;box-shadow:0 0 0 3px #62bdca22}.full{width:100%;margin-top:10px}.notice,.error,.good,.bad{border-radius:12px;margin:12px 0;padding:12px}.notice{background:#faf0dc}.error,.bad{color:#a7483b;background:#fff0ed}.good{color:#25814b;background:#e8f7ed}.app{max-width:1150px;margin:auto;padding:42px 24px}.app header,.admin header{justify-content:space-between;align-items:center;margin-bottom:26px;display:flex}.app header h2{margin:10px 0 0;font-size:32px}.metric-grid{grid-template-columns:repeat(4,1fr);gap:15px;margin:20px 0 30px;display:grid}.metric{background:#fff;border:1px solid #e5eeee;border-radius:18px;grid-template-columns:auto 1fr;gap:2px 12px;padding:19px;display:grid;box-shadow:0 8px 20px #2d626b0c}.metric i{color:#348c97;background:#e6f5f6;border-radius:13px;grid-row:1/3;place-items:center;width:43px;height:43px;display:grid}.metric strong{font-size:25px}.metric span{color:#71888c;font-size:13px}.levels{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.level{text-align:right;color:#31555b;background:#fff;border:1px solid #e5eceb;border-radius:20px;padding:21px;transition:all .2s}.level>b{float:left;font-size:28px}.level>span{color:#8b9d9f;font-size:12px}.level h4{margin:14px 0 4px;font-size:18px}.challenge{color:#fff;background:linear-gradient(120deg,#347f8a,#64c4cf);border-radius:22px;justify-content:space-between;align-items:center;margin:27px 0;padding:25px 30px;display:flex}.challenge h3{margin:7px 0;font-size:28px}.challenge button{color:#287985;background:#fff;border-radius:12px;padding:13px 20px;font-weight:800}.badges{flex-wrap:wrap;gap:10px;display:flex}.badges span{background:#fff6dc;border:1px solid #ead89f;border-radius:99px;padding:10px 15px}.muted{color:#89999b}.setup{text-align:center;width:min(600px,100%)}.table-pills{flex-wrap:wrap;justify-content:center;gap:9px;margin:25px 0;display:flex}.table-pills button{color:#426c72;background:#edf3f2;border-radius:14px;width:48px;height:48px;font-weight:800}.table-pills .active{color:#fff;background:#52b5c2}.practice{max-width:850px;min-height:100vh;margin:auto;padding:25px}.practice-top{align-items:center;gap:18px;display:flex}.progress{background:#dfe9e8;border-radius:9px;flex:1;height:11px;overflow:hidden}.progress span{background:#d3ae55;height:100%;transition:all .3s;display:block}.question{text-align:center;background:#fff;border-radius:28px;max-width:600px;margin:12vh auto 0;padding:35px;box-shadow:0 18px 60px #31585f1c}.question h2{margin:30px;font-size:58px}.question input{text-align:center;max-width:260px;font-size:30px}.question.right{border:2px solid #71c792;animation:.4s pop}.question.wrong{border:2px solid #e8a095}@keyframes pop{50%{transform:scale(1.03)}}.admin{background:#f7f8f5;grid-template-columns:245px 1fr;min-height:100vh;display:grid}.admin aside{background:#fff;border-left:1px solid #e5ecea;flex-direction:column;gap:6px;padding:25px 14px;display:flex}.brand{color:#287884;padding:10px 8px 25px;font-size:19px;font-weight:800}.admin aside button{color:#60787c;text-align:right;background:0 0;border-radius:10px;gap:10px;padding:12px;display:flex}.admin aside button.on{color:#247e8a;background:#ddf1f3;font-weight:800}.admin-body{min-width:0;padding:30px}.two{grid-template-columns:1.5fr 1fr;gap:20px;display:grid}.toolbar,.inline{align-items:center;gap:10px;display:flex}.toolbar{justify-content:space-between;margin-bottom:22px}.student-list{margin-top:14px}.student-list>div{border-bottom:1px solid #edf0ed;align-items:center;gap:8px;padding:9px 0;display:flex}.student-list span{flex:1}.student-list select{width:auto}.danger{color:#b64c43;background:#ffeded;border-radius:9px;padding:10px}.summary p{border-bottom:1px solid #eee;justify-content:space-between;padding:13px;display:flex}table{border-collapse:collapse;width:100%;margin-top:18px}th,td{text-align:right;border-bottom:1px solid #e9ece9;padding:12px}th{background:#eff7f7}.status{border-radius:20px;padding:5px 10px;font-size:13px}.s1{color:#a54b3f;background:#ffebe7}.s2{color:#8a6825;background:#fff4d9}.s3{color:#277a45;background:#e5f6ea}.form{max-width:700px}.check{align-items:center;grid-template-columns:auto 1fr!important;display:flex!important}.check input{width:auto}.report-head{text-align:center;border-bottom:3px double #c4a65c;padding:15px}.sign{justify-content:space-around;margin-top:55px;font-weight:700;display:flex}.recommend{background:#f3f8f7;border-radius:14px;margin-top:20px;padding:18px}.certificate{text-align:center;background-color:#fff;background-image:radial-gradient(circle at 5% 8%,#daf0f2 0 4%,#0000 5%),radial-gradient(circle at 95% 92%,#f0e4ce 0 5%,#0000 6%);background-position:0 0;background-repeat:repeat;background-size:auto;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:9px double #c9ad67;outline:2px solid #75bbc5;flex-direction:column;justify-content:center;max-width:900px;min-height:600px;margin:25px auto;padding:60px;display:flex}.certificate h1{color:#af8937;font-size:52px}.certificate h2{color:#287985;border-bottom:1px solid #c9ad67;margin:10px auto 25px;font-size:38px;display:inline-block}.honor-title{text-align:center;margin:25px}.honor-title h1{font-size:42px}.podium{grid-template-columns:repeat(2,1fr);gap:13px;margin-top:24px;display:grid}.podium>div{background:#fff;border-radius:17px;padding:18px;box-shadow:0 7px 20px #31585f10}.podium b{float:left;font-size:28px}.empty{text-align:center;color:#809397;padding:60px}@media (width<=800px){.entry,.challenge{flex-direction:column}.metric-grid,.levels,.podium{grid-template-columns:repeat(2,1fr)}.admin{display:block}.admin aside{z-index:5;flex-direction:row;padding:8px;position:sticky;top:0;overflow:auto}.admin aside .brand{display:none}.admin aside button{white-space:nowrap}.admin-body{padding:18px}.two{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.question{margin-top:7vh}.question h2{font-size:45px}.app{padding:25px 15px}}@media (width<=460px){.metric-grid{grid-template-columns:1fr 1fr}.levels{grid-template-columns:1fr}.hero h1{font-size:39px}.big{justify-content:center;width:100%}.entry{width:100%}.question{padding:25px 16px}.inline{flex-wrap:wrap}}@media print{@page{size:A4;margin:12mm}body{background:#fff}.admin aside,.admin header,.no-print,footer,.pearls{display:none!important}.admin{display:block}.admin-body{padding:0}.panel,.certificate{box-shadow:none;border-radius:0;margin:0}.report{border:0}.certificate{max-width:none;height:270mm}.sign{margin-top:45px}}