:root{--ink:#1d2733;--muted:#5b6877;--faint:#8a96a3;--line:#dde3ea;--surface:#f4f6f9;--card:#fff;--steel:#2f6fb5;--steel-dark:#1c4f87;--steel-light:#e6f1fb;--comp:#1d9e75;--comp-light:#e1f5ee;--amber:#ba7517;--amber-light:#faf3e3;--ten:#d85a30;--ten-light:#fdecea;--purple:#6a5cd0;--purple-light:#eeedfe}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--surface);color:var(--ink);min-height:100vh;font-family:IBM Plex Sans Arabic,Segoe UI,Tahoma,sans-serif;line-height:1.85}.topbar{z-index:50;background:var(--steel-dark);color:#fff;justify-content:space-between;align-items:center;padding:11px 22px;display:flex;position:sticky;top:0;box-shadow:0 2px 8px #0000001f}.topbar .brand{letter-spacing:.2px;font-size:18px;font-weight:700}.langtoggle{gap:8px;display:flex}.langtoggle button{color:#fff;cursor:pointer;background:0 0;border:1px solid #ffffff8c;border-radius:8px;padding:6px 16px;font-family:inherit;font-size:13.5px;font-weight:700;transition:all .15s}.langtoggle button:hover{background:#ffffff26}.langtoggle button.on{color:var(--steel-dark);background:#fff;border-color:#fff}.hero{color:#fff;text-align:center;background:linear-gradient(135deg,#1c4f87 0%,#2f6fb5 50%,#1d9e75 100%);padding:64px 24px 56px;position:relative;overflow:hidden}.hero:before{content:"";background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");position:absolute;inset:0}.hero-inner{max-width:700px;margin:0 auto;position:relative}.logo{letter-spacing:3px;opacity:.7;direction:ltr;margin-bottom:16px;font-size:13px;font-weight:500}.hero h1{margin-bottom:14px;font-size:36px;font-weight:700;line-height:1.35}.hero h1 span{opacity:.75;font-weight:400}.hero p{opacity:.85;max-width:500px;margin:0 auto 28px;font-size:17px}.hero-tags{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.hero-tag{background:#ffffff26;border:1px solid #ffffff40;border-radius:999px;padding:5px 16px;font-size:13px}.search-wrap{z-index:10;max-width:500px;margin:-24px auto 0;padding:0 20px;position:relative}.search-box{direction:rtl;border:none;border-radius:14px;outline:none;width:100%;padding:14px 20px;font-family:inherit;font-size:15px;box-shadow:0 4px 24px #00000024}html[lang=en] .search-box{direction:ltr}.search-box:focus{box-shadow:0 4px 24px #2f6fb54d}.wrap{max-width:900px;margin:0 auto;padding:40px 20px 80px}.section-title{letter-spacing:.5px;color:var(--steel);align-items:center;gap:10px;margin:40px 0 16px;font-size:13px;font-weight:700;display:flex}.section-title:after{content:"";background:var(--line);flex:1;height:1px}.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;display:grid}.card{background:var(--card);border:1px solid var(--line);color:inherit;border-radius:16px;flex-direction:column;gap:10px;padding:22px;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;position:relative;overflow:hidden}.card:hover{border-color:var(--steel);transform:translateY(-3px);box-shadow:0 8px 28px #0000001a}.card-accent{border-radius:0 16px 16px 0;width:4px;height:100%;position:absolute;top:0;right:0}.card-icon{margin-bottom:2px;font-size:28px}.card-series{letter-spacing:.5px;color:var(--faint);font-size:11.5px;font-weight:700}.card-title{font-size:16px;font-weight:700;line-height:1.4}.card-desc{color:var(--muted);flex:1;font-size:13.5px;line-height:1.7}.card-footer{align-items:center;gap:8px;margin-top:4px;display:flex}.card-level{border-radius:999px;padding:2px 12px;font-size:11.5px;font-weight:600}.lvl-1{background:var(--comp-light);color:var(--comp)}.lvl-2{background:var(--steel-light);color:var(--steel-dark)}.lvl-3{background:var(--amber-light);color:var(--amber)}.card-time{color:var(--faint);direction:ltr;margin-right:auto;font-size:11.5px}.card-new{background:var(--ten-light);color:var(--ten);border-radius:999px;padding:1px 10px;font-size:11px;font-weight:700}.card.soon{opacity:.55;pointer-events:none}.card.soon .card-title:after{content:" — قريباً";color:var(--faint);font-weight:400}html[lang=en] .card.soon .card-title:after{content:" — Soon"}.progress-strip{background:var(--card);border:1px solid var(--line);border-radius:14px;flex-wrap:wrap;align-items:center;gap:20px;margin-bottom:32px;padding:18px 22px;display:flex}.progress-strip .label{color:var(--muted);min-width:120px;font-size:13px}.prog-bar{background:var(--surface);border-radius:999px;flex:1;min-width:140px;height:8px;overflow:hidden}.prog-fill{background:linear-gradient(90deg,var(--steel),var(--comp));border-radius:999px;height:100%;transition:width .4s}.prog-count{color:var(--ink);white-space:nowrap;direction:ltr;font-size:13px;font-weight:700}footer{text-align:center;color:var(--faint);border-top:1px solid var(--line);padding:32px 20px;font-size:13px}footer a{color:var(--steel);text-decoration:none}footer strong{color:var(--ink)}@media (max-width:500px){.hero h1{font-size:26px}.cards{grid-template-columns:1fr}}.hh-byline{color:#fff;opacity:.8;white-space:nowrap;font-size:12.5px;font-weight:600}.hh-byline .cr-sep{opacity:.6}.hh-byline .cr-en,html[lang=en] .hh-byline .cr-ar{display:none}html[lang=en] .hh-byline .cr-en{display:inline}@media (max-width:640px){.hh-byline{display:none}}.topbar,nav{direction:ltr}.au-en,html[lang=en] .au-ar{display:none}html[lang=en] .au-en{display:block}.bi-en,html[lang=en] .bi-ar{display:none}html[lang=en] .bi-en{display:block}.calc-wrap{max-width:1100px;margin:0 auto;padding:28px 20px 80px}.calc-grid{grid-template-columns:340px 1fr;align-items:start;gap:20px;display:grid}@media (max-width:860px){.calc-grid{grid-template-columns:1fr}}.panel{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}.panel h2{color:var(--steel-dark);margin-bottom:14px;font-size:15px;font-weight:700}.num-row{align-items:center;gap:10px;margin-bottom:10px;display:flex}.num-row label{color:var(--muted);flex:1;font-size:13.5px}.num-row input{border:1px solid var(--line);text-align:right;direction:ltr;border-radius:9px;outline:none;width:110px;padding:7px 10px;font-family:inherit;font-size:14px}.num-row input:focus{border-color:var(--steel);box-shadow:0 0 0 3px var(--steel-light)}.num-row .unit{color:var(--faint);direction:ltr;min-width:38px;font-size:12px}.result-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;display:grid}.result-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px}.result-card .rc-label{color:var(--faint);margin-bottom:4px;font-size:12px}.result-card .rc-value{color:var(--ink);direction:ltr;font-size:18px;font-weight:700}.result-card .rc-unit{color:var(--muted);margin-inline-start:4px;font-size:12px}.shape-tabs{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.shape-tabs button{border:1px solid var(--line);background:var(--card);color:var(--muted);cursor:pointer;border-radius:999px;padding:7px 14px;font-family:inherit;font-size:13px;font-weight:600;transition:all .15s}.shape-tabs button:hover{border-color:var(--steel)}.shape-tabs button.on{background:var(--steel-dark);border-color:var(--steel-dark);color:#fff}.formula-block{background:var(--surface);direction:ltr;border-radius:10px;margin:10px 0;padding:10px 14px;overflow-x:auto}.lesson-prose{max-width:820px;margin:0 auto;padding:32px 20px 60px;font-size:16px}.lesson-prose h1{margin:18px 0 10px;font-size:28px;line-height:1.4}.lesson-prose h2{color:var(--steel-dark);margin:28px 0 10px;font-size:21px}.lesson-prose p{margin:10px 0}.lesson-prose ul,.lesson-prose ol{margin:10px 24px}
