:root{
  --bg:#eef7f4; --bg2:#f8fbff; --panel:#ffffff; --panel2:#f5fffc; --text:#102a43; --muted:#64748b;
  --brand:#0f766e; --brand2:#14b8a6; --accent:#f59e0b; --danger:#ef4444; --ok:#16a34a; --line:#dbeafe;
  --shadow:0 24px 70px rgba(15, 118, 110, .15); --soft-shadow:0 10px 30px rgba(15, 23, 42, .08);
  --radius:26px; --radius2:18px; --font:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --urdu:"Noto Nastaliq Urdu", serif;
}
[data-theme="dark"]{
  --bg:#061b21; --bg2:#092b30; --panel:#0f2d35; --panel2:#123941; --text:#e8f7f5; --muted:#a8c7c5;
  --brand:#2dd4bf; --brand2:#0f766e; --accent:#fbbf24; --line:#1f4d57; --shadow:0 24px 70px rgba(0,0,0,.35); --soft-shadow:0 10px 30px rgba(0,0,0,.25);
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:radial-gradient(circle at top left,var(--panel2),var(--bg) 42%,var(--bg2));color:var(--text);font-family:var(--font);line-height:1.65;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}img{max-width:100%}
body.ur{font-family:var(--urdu);font-size:1.08rem;line-height:2.05} body.ur input,body.ur button,body.ur select{font-family:var(--urdu)} body.ur .latin,body.ur code{font-family:var(--font)}
body.ur h1,body.ur h2,body.ur h3,body.ur .topbar h1,body.ur .hero-panel h2,body.ur .stat-card strong{letter-spacing:0;line-height:1.65}
body.ur .topbar h1{font-size:clamp(1.45rem,3.8vw,2.45rem)}
body.ur .hero-panel h2{font-size:clamp(1.75rem,4.6vw,3.35rem)}
body.ur .hero-panel p,body.ur .article-view p,body.ur .article-view li,body.ur .feedback-box{font-size:1.12rem;line-height:2.15}
body.ur .nav-link,body.ur .chip,body.ur .primary-btn,body.ur .ghost-btn,body.ur .danger-btn,body.ur .mini-btn,body.ur .answer-btn{font-size:1.05rem;line-height:1.9}
body.ur .learn-card h3,body.ur .panel-title h2,body.ur .question-card h2,body.ur .location-card h3,body.ur .sign-card h3{font-size:1.16rem;line-height:1.85}
body.ur .learn-card p,body.ur .sign-card p,body.ur .location-card p,body.ur .sidebar-card p,body.ur .muted{font-size:1rem;line-height:2}
body.ur .article-view th,body.ur .article-view td{font-size:1.05rem;line-height:2.05}
body.ur .badge,body.ur .eyebrow{letter-spacing:0;line-height:1.7}
.app-shell{display:grid;grid-template-columns:310px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:22px;background:linear-gradient(180deg,rgba(15,118,110,.98),rgba(15,76,82,.98));color:white;overflow:auto;box-shadow:8px 0 40px rgba(15,23,42,.14);z-index:20}.brand{display:flex;gap:14px;align-items:center;margin-bottom:22px}.brand-mark{width:52px;height:52px;border-radius:18px;background:white;color:var(--brand);display:grid;place-items:center;font-weight:900;font-size:1.5rem;box-shadow:0 12px 24px #002b2b44}.brand strong{display:block;font-size:1.18rem}.brand span{display:block;color:#d9fffb;font-size:.86rem}.search-box{display:flex;align-items:center;gap:8px;background:#ffffff1f;border:1px solid #ffffff35;border-radius:18px;padding:10px 13px;margin-bottom:18px}.search-box input{width:100%;background:transparent;border:0;outline:0;color:white}.search-box input::placeholder{color:#d9fffb}.main-nav{display:grid;gap:8px}.nav-link{border:0;text-align:start;color:white;background:transparent;padding:13px 14px;border-radius:16px;display:flex;gap:10px;align-items:center;transition:.2s}.nav-link:hover,.nav-link.active{background:#ffffff24;transform:translateX(3px)}.sidebar-card{margin-top:22px;padding:16px;border:1px solid #ffffff30;border-radius:20px;background:#ffffff16}.sidebar-card span{font-weight:800;color:#fff}.sidebar-card p{margin:.4rem 0 0;color:#e7fffc;font-size:.92rem}
.workspace{padding:24px;min-width:0}.topbar{display:flex;align-items:center;gap:16px;margin-bottom:18px}.topbar h1{margin:0;font-size:clamp(1.6rem,3vw,2.8rem);letter-spacing:-.04em}.eyebrow{margin:0;color:var(--brand);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem}.top-actions{margin-inline-start:auto;display:flex;gap:10px}.chip,.icon-button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:999px;padding:10px 14px;box-shadow:var(--soft-shadow)}.menu-button{display:none}.hero-panel{display:grid;grid-template-columns:1fr 210px;align-items:center;gap:28px;background:linear-gradient(135deg,var(--brand),#134e4a);color:white;border-radius:var(--radius);padding:30px;margin-bottom:22px;box-shadow:var(--shadow);overflow:hidden;position:relative}.hero-panel:before{content:"";position:absolute;inset:auto -60px -80px auto;width:260px;height:260px;border-radius:50%;background:#ffffff16}.hero-panel h2{font-size:clamp(2rem,4vw,4.2rem);line-height:1.05;margin:.5rem 0;letter-spacing:-.06em}.hero-panel p{max-width:760px;color:#e7fffc;font-size:1.08rem}.badge{display:inline-flex;background:#ffffff22;border:1px solid #ffffff45;padding:7px 12px;border-radius:999px;font-weight:800}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}.primary-btn,.ghost-btn,.danger-btn{border:0;border-radius:16px;padding:12px 18px;font-weight:800;box-shadow:0 14px 30px #002b2b33}.primary-btn{background:var(--accent);color:#201300}.ghost-btn{background:#ffffff20;color:white;border:1px solid #ffffff45}.danger-btn{background:var(--danger);color:white}.progress-orb{position:relative;width:190px;height:190px;display:grid;place-items:center;justify-self:center}.progress-orb svg{position:absolute;inset:0;transform:rotate(-90deg)}.progress-orb circle{fill:none;stroke:#ffffff2b;stroke-width:10}.progress-orb circle+circle{stroke:var(--accent);stroke-dasharray:327;stroke-dashoffset:327;stroke-linecap:round;transition:.5s}.progress-orb div{text-align:center}.progress-orb strong{display:block;font-size:2.1rem}.progress-orb span{color:#dffdf8}.content-area{display:grid;gap:20px}.stats-grid,.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.stat-card,.learn-card,.panel,.question-card,.sign-card,.location-card{background:color-mix(in srgb,var(--panel),transparent 0%);border:1px solid var(--line);border-radius:var(--radius2);box-shadow:var(--soft-shadow)}.stat-card{padding:20px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;right:-30px;bottom:-50px;width:120px;height:120px;border-radius:50%;background:color-mix(in srgb,var(--brand),transparent 86%)}.stat-card span{color:var(--muted);font-weight:700}.stat-card strong{display:block;font-size:2.1rem;letter-spacing:-.05em}.learn-card{padding:18px;text-align:start;border:1px solid var(--line);color:var(--text);transition:.2s}.learn-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.learn-card h3{margin:.2rem 0 .4rem;color:var(--brand)}.learn-card p{color:var(--muted);margin:0}.panel{padding:22px}.panel-title{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.panel-title h2{margin:0;font-size:1.35rem}.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.toolbar input,.toolbar select{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:var(--panel);color:var(--text)}.mini-btn{border:1px solid var(--line);background:var(--panel);color:var(--text);padding:9px 13px;border-radius:12px;font-weight:700}.mini-btn.active{background:var(--brand);color:white;border-color:var(--brand)}.article-view h2,.article-view h3{color:var(--brand)}.article-view p,.article-view li{font-size:1.04rem}.article-view ul{background:var(--panel2);border:1px solid var(--line);border-radius:18px;padding:18px 26px}.article-view table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:var(--soft-shadow)}.article-view th,.article-view td{padding:13px;border-bottom:1px solid var(--line);vertical-align:top}.article-view th{background:color-mix(in srgb,var(--brand),transparent 86%);color:var(--brand);text-align:start}.article-view tr:last-child th,.article-view tr:last-child td{border-bottom:0}.table-scroll{overflow:auto}.article-image{margin:22px 0;text-align:center}.article-image img{border-radius:18px;background:white;border:1px solid var(--line);box-shadow:var(--soft-shadow)}.article-image figcaption,.muted{color:var(--muted)}.sign-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}.sign-card{padding:16px;text-align:center;display:grid;gap:8px;position:relative;overflow:hidden}.sign-card img{width:128px;height:128px;object-fit:contain;margin:auto;background:white;border:1px solid #e2e8f0;border-radius:20px;padding:10px}.sign-card h3{margin:0;color:var(--brand);font-size:1rem}.sign-card p{margin:0;color:var(--muted);font-size:.9rem}.bookmark{position:absolute;top:10px;right:10px;border:0;background:color-mix(in srgb,var(--panel),transparent 12%);border-radius:999px;padding:7px}.bookmark.saved{color:var(--accent)}.quiz-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px}.quiz-list{display:grid;gap:12px}.question-card{padding:22px}.question-top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.question-card h2{margin:.2rem 0 1rem;font-size:1.28rem}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer-btn{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:18px;padding:18px;font-weight:900;font-size:1.15rem}.answer-btn:hover{border-color:var(--brand)}.answer-btn.correct{background:color-mix(in srgb,var(--ok),transparent 82%);border-color:var(--ok)}.answer-btn.wrong{background:color-mix(in srgb,var(--danger),transparent 82%);border-color:var(--danger)}.feedback-box{margin-top:14px;padding:14px;border-radius:16px;background:var(--panel2);border:1px solid var(--line)}.quiz-side{display:grid;gap:14px;align-content:start}.meter{height:12px;background:var(--panel2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}.meter span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand),var(--accent));transition:.35s}.number-pad{display:flex;flex-wrap:wrap;gap:6px}.number-pad button{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:800}.number-pad button.done{background:var(--brand);color:white}.number-pad button.current{outline:3px solid color-mix(in srgb,var(--accent),transparent 40%)}.location-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.location-card{padding:16px}.location-card h3{margin:.1rem 0;color:var(--brand)}.location-card a{color:var(--brand);font-weight:800}.empty-state{text-align:center;padding:50px;background:var(--panel);border:1px dashed var(--line);border-radius:var(--radius2)}.empty-state div{font-size:3rem}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#102a43;color:white;padding:12px 18px;border-radius:999px;box-shadow:var(--shadow);z-index:100}.modal-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.62);display:grid;place-items:center;padding:20px;z-index:80}.modal{width:min(760px,100%);max-height:88vh;overflow:auto;background:var(--panel);border-radius:26px;padding:22px;box-shadow:var(--shadow)}.modal-head{display:flex;justify-content:space-between;gap:14px}.modal-head button{border:0;background:var(--panel2);color:var(--text);border-radius:12px;padding:8px 12px}.kbd{display:inline-grid;place-items:center;min-width:28px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);padding:2px 7px;font-family:var(--font);font-size:.8rem}.highlight{background:color-mix(in srgb,var(--accent),transparent 70%);border-radius:5px;padding:0 3px}
@media(max-width:980px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;inset:0 auto 0 0;width:min(330px,88vw);transform:translateX(-105%);transition:.25s}.sidebar.open{transform:translateX(0)}.menu-button{display:inline-flex}.hero-panel{grid-template-columns:1fr}.progress-orb{display:none}.quiz-layout{grid-template-columns:1fr}.workspace{padding:16px}.topbar{align-items:flex-start}.top-actions{margin-inline-start:0}.topbar{flex-wrap:wrap}}@media(max-width:620px){.answer-grid{grid-template-columns:1fr}.hero-panel{padding:22px}.hero-panel h2{font-size:2.2rem}.panel-title{align-items:flex-start;flex-direction:column}.toolbar input,.toolbar select{width:100%}.top-actions{width:100%;justify-content:flex-end}.stats-grid,.card-grid{grid-template-columns:1fr}.sign-grid{grid-template-columns:repeat(auto-fit,minmax(145px,1fr))}.sign-card img{width:96px;height:96px}.workspace{padding:12px}}
@media(max-width:620px){body.ur{font-size:1.05rem;line-height:2.05}body.ur .hero-panel h2{font-size:1.78rem;line-height:1.7}body.ur .hero-panel p,body.ur .article-view p,body.ur .article-view li,body.ur .feedback-box{font-size:1.06rem;line-height:2.1}body.ur .nav-link,body.ur .chip,body.ur .primary-btn,body.ur .ghost-btn,body.ur .danger-btn,body.ur .mini-btn,body.ur .answer-btn{font-size:1rem;line-height:1.85}body.ur .question-card h2{font-size:1.08rem;line-height:1.9}}
.hero-panel:before{pointer-events:none}
@media(max-width:980px){.sidebar{pointer-events:none;visibility:hidden}.sidebar.open{pointer-events:auto;visibility:visible}}
[dir="rtl"] .nav-link{text-align:right}[dir="rtl"] .nav-link:hover,[dir="rtl"] .nav-link.active{transform:translateX(-3px)}[dir="rtl"] .bookmark{right:auto;left:10px}[dir="rtl"] .sidebar{right:0;left:auto}@media(max-width:980px){[dir="rtl"] .sidebar{transform:translateX(105%)}[dir="rtl"] .sidebar.open{transform:translateX(0)}}
.app-shell{grid-template-columns:1fr}
.sidebar{display:none}
.workspace{width:min(1180px,100%);margin:0 auto}
.menu-button{display:none!important}
.home-search-panel{display:grid;gap:12px}
.home-search-label{font-weight:800;color:var(--brand)}
.home-search-input{width:100%;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--text);padding:14px 16px;font-size:1.05rem;box-shadow:var(--soft-shadow)}
.home-shortcuts{display:flex;flex-wrap:wrap;gap:10px}
.home-shortcut{border:1px solid var(--line);border-radius:999px;background:var(--panel2);color:var(--text);padding:10px 14px;font-weight:800;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.home-shortcut:hover,.home-link:hover{border-color:var(--brand);box-shadow:var(--shadow)}
.guide-content{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius2);box-shadow:var(--soft-shadow);padding:22px;margin-bottom:22px}
.guide-content h2{margin:0 0 10px;color:var(--brand);font-size:1.35rem;line-height:1.35}
.guide-content p{margin:0;color:var(--muted)}
.guide-faq{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:16px}
.guide-faq article{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px}
.guide-faq h3{margin:0 0 6px;color:var(--text);font-size:1rem;line-height:1.4}
.guide-content>h3{margin:18px 0 6px;color:var(--text);font-size:1.08rem}
.guide-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:16px}
.share-links{display:flex;flex-wrap:wrap;gap:8px}
.share-links a,.resource-links a{color:var(--brand);font-weight:800}
.share-links a{border:1px solid var(--line);background:var(--panel2);border-radius:999px;padding:8px 12px;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.share-links img{width:18px;height:18px;display:block}
.resource-links{margin:0;padding-inline-start:20px}
.resource-links li{margin:5px 0}
body.ur .guide-content h2,body.ur .guide-faq h3{line-height:1.9;letter-spacing:0}
body.ur .guide-content p{font-size:1.04rem;line-height:2.05}
.site-footer{margin-top:24px;padding:26px 0 12px;color:var(--text)}
.footer-intro,.footer-grid,.footer-note{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius2);box-shadow:var(--soft-shadow);padding:20px;margin-bottom:16px}
.site-footer h2,.site-footer h3{margin:0 0 8px;color:var(--brand);line-height:1.35}
.site-footer p{margin:0 0 12px;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.site-footer ul{margin:0;padding-inline-start:20px}
.site-footer li{margin:6px 0}
.site-footer a{color:var(--brand);font-weight:800;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
body.ur .site-footer h2,body.ur .site-footer h3{line-height:1.9;letter-spacing:0}
body.ur .site-footer p,body.ur .site-footer li{line-height:2.05}
.home-columns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:20px;align-items:start}
.home-list-panel{display:grid;gap:14px}
.home-link-list{display:grid;gap:10px}
.home-link{width:100%;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--text);padding:14px;text-align:start;display:flex;align-items:center;gap:12px;box-shadow:var(--soft-shadow);transition:.2s;text-decoration:none}
.home-link-icon{width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--brand),transparent 88%);display:grid;place-items:center;flex:0 0 auto}
.home-link-main{display:grid;gap:2px;min-width:0}
.home-link-main strong{color:var(--brand);font-size:1.02rem;line-height:1.4}
.home-link-main small{color:var(--muted);font-size:.9rem;line-height:1.45}
.home-quiz-link{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.home-quiz-link>a{border:0;background:transparent;color:inherit;padding:0;text-align:start;display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none}
body.ur .home-search-input{font-size:1.06rem;line-height:2}
body.ur .home-link-main strong{font-size:1.08rem;line-height:1.9}
body.ur .home-link-main small{font-size:.98rem;line-height:1.9}
@media(max-width:760px){.workspace{padding:12px}.hero-panel{padding:20px}.home-columns{grid-template-columns:1fr}.home-link,.home-quiz-link{border-radius:14px}.home-quiz-link{grid-template-columns:1fr;gap:12px}.home-quiz-link .mini-btn{width:100%}.home-shortcut{flex:1 1 140px;justify-content:center}}