@font-face{font-family:Kalam;src:url(fonts/kalam-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Kalam;font-weight:700;src:url(fonts/kalam-latin-700-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Patrick Hand";src:url(fonts/patrick-hand-latin-400-normal.woff2) format("woff2");font-display:swap}
:root{--bg:#f5f3ff;--card:#fff;--tx:#1e1b3a;--mut:#6b6890;--pri:#4c3bcf;--pri2:#7c3aed;--ok:#12b886;--bad:#fa5252;--line:#e6e3f5;--sh:0 2px 10px #4c3bcf14}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth}
body{margin:0;font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari",sans-serif;background:var(--bg);color:var(--tx);padding-bottom:78px}
header{position:sticky;top:0;z-index:20;display:flex;gap:8px;align-items:center;padding:10px 12px;background:linear-gradient(120deg,#4c3bcf,#7c3aed 60%,#c2255c);color:#fff;box-shadow:0 2px 12px #0002}
.logo{color:#fff;text-decoration:none;font-weight:800;white-space:nowrap}.logo span{font-size:.95em}
#q{flex:1;min-width:0;padding:8px 12px;border-radius:20px;border:0;font-size:15px;background:#ffffffe6}
.ib{background:#ffffff26;color:#fff;border:0;border-radius:18px;padding:6px 10px;font-size:15px;font-weight:700}
main{max-width:780px;margin:auto;padding:14px 12px;animation:fd .25s ease}@keyframes fd{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
h1{font-size:1.4em;margin:.3em 0 .5em;line-height:1.25}h2{font-size:1.12em;margin:1.2em 0 .5em}h4{margin:.8em 0 .2em}
a{color:var(--pri)}.mut{color:var(--mut);font-size:.88em}
.hero{background:linear-gradient(135deg,#4c3bcf,#7c3aed);color:#fff;border-radius:20px;padding:18px;box-shadow:var(--sh);margin-bottom:14px}.hero a{color:#fff}.hero .mut{color:#e9e5ff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.pc{display:block;text-decoration:none;color:var(--tx);background:var(--card);border-radius:18px;padding:14px;box-shadow:var(--sh);border-top:6px solid var(--c);transition:transform .15s}.pc:active{transform:scale(.97)}
.pc .ic{font-size:30px;width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--c) 15%,transparent)}
.pc b{display:block;margin-top:8px;color:var(--c)}.pc .nm{font-weight:700;font-size:.95em;line-height:1.3}
.bar{height:7px;background:var(--line);border-radius:4px;margin-top:8px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),#40c057);border-radius:4px}
.card{background:var(--card);border-radius:16px;padding:14px;box-shadow:var(--sh);margin:10px 0}
.tl{list-style:none;padding:0;margin:0}.tl li a{display:flex;gap:10px;align-items:center;background:var(--card);border-radius:14px;padding:12px;margin:8px 0;text-decoration:none;color:var(--tx);box-shadow:var(--sh)}
.tl .n{flex:0 0 32px;height:32px;border-radius:50%;background:var(--c,#4c3bcf);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85em}.tl .ok{background:var(--ok)}
.tabs{display:flex;gap:6px;overflow-x:auto;position:sticky;top:56px;z-index:10;background:var(--bg);padding:6px 0;scrollbar-width:none}.tabs a{flex:0 0 auto;padding:7px 13px;border-radius:18px;background:var(--card);text-decoration:none;color:var(--tx);font-weight:600;font-size:.9em;box-shadow:var(--sh)}.tabs a.on{background:var(--pri);color:#fff}
.box{background:var(--card);border-radius:16px;padding:14px;margin:12px 0;box-shadow:var(--sh);overflow-x:auto;border-left:6px solid var(--bc,#4c3bcf)}
.box>h3{margin:0 0 6px;font-size:1em}.s{--bc:#1c7ed6}.a{--bc:#12b886}.d{--bc:#f08c00}.x{--bc:#7c3aed}.w{--bc:#fa5252}.k{--bc:#e8590c}
table{border-collapse:collapse;font-size:.88em;width:100%}td,th{border:1px solid var(--line);padding:5px 7px;vertical-align:top}th{background:#efeafe}
code,pre{background:#f1effb;border-radius:6px;padding:1px 4px;font-size:.88em}pre{padding:10px;overflow-x:auto}
.btn{display:inline-block;border:0;background:var(--pri);color:#fff;padding:11px 16px;border-radius:12px;font-weight:700;text-decoration:none;font-size:.95em;margin:4px 4px 4px 0;cursor:pointer}.btn.g{background:var(--ok)}.btn.o{background:#f08c00}.btn.l{background:var(--card);color:var(--pri);box-shadow:var(--sh)}
.vid{margin:10px 0}.vb{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;cursor:pointer}.vb img{width:100%;height:100%;object-fit:cover;opacity:.85}
.vb .pl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.vb .pl i{width:64px;height:46px;background:#f03;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-style:normal;font-size:22px;box-shadow:0 4px 12px #0006}
iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:14px}.vm{font-size:.9em;margin:6px 2px}.lg{font-size:.72em;font-weight:700;padding:2px 7px;border-radius:8px;background:#ffe3e3;color:#c92a2a;margin-right:4px}.wf{background:#fff3bf;color:#a15c00}
.opt{display:block;width:100%;text-align:left;margin:6px 0;padding:11px 12px;border:2px solid var(--line);background:var(--card);border-radius:12px;font-size:.95em;color:var(--tx);transition:background .15s}
.opt.r{background:#d3f9d8;border-color:var(--ok)}.opt.wr{background:#ffe3e3;border-color:var(--bad)}.ex{background:#f1effb;padding:8px 10px;border-radius:10px;font-size:.92em}
.flow{display:flex;flex-direction:column}.fs{background:#efeafe;border-radius:12px;padding:9px 12px}.fs b{display:inline-flex;width:24px;height:24px;border-radius:50%;background:var(--pri);color:#fff;align-items:center;justify-content:center;font-size:.8em;margin-right:6px}.fa{text-align:center;color:var(--pri);font-weight:800}
.fc{min-height:150px;border-radius:18px;padding:18px;background:linear-gradient(135deg,#fff9db,#ffe8cc);box-shadow:var(--sh);cursor:pointer;font-size:1.05em;color:#3b2a00}.fc .bk{margin-top:12px;border-top:2px dashed #e8b36d;padding-top:10px}
.warn{background:#fff3bf;border-radius:12px;padding:10px 12px;font-size:.9em;color:#5c3c00}
nav.bn{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;justify-content:space-around;background:var(--card);box-shadow:0 -2px 12px #0001;padding:6px 0 calc(6px + env(safe-area-inset-bottom))}
nav.bn a{color:var(--mut);text-decoration:none;font-size:.72em;text-align:center;font-weight:600}nav.bn a b{display:block;font-size:1.45em}nav.bn a.on{color:var(--pri)}
.sk{height:90px;border-radius:16px;margin:12px 0;background:linear-gradient(90deg,#ece9fb,#f8f7ff,#ece9fb);background-size:200%;animation:sk 1s infinite}@keyframes sk{to{background-position:-200% 0}}
.step{display:flex;gap:10px;align-items:flex-start;margin:8px 0}.step i{font-style:normal;flex:0 0 34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#efeafe}
.nav2{display:flex;justify-content:space-between;gap:8px;margin:16px 0 30px}
/* handwritten notes */
.hw{font-family:Kalam,"Patrick Hand",cursive;font-size:19px;line-height:32px;color:#1d2a6b;background:#fffef6 repeating-linear-gradient(transparent 0 31px,#b9d3f5 31px 32px);background-position:0 8px;padding:8px 14px 20px 52px;border-radius:6px;box-shadow:0 3px 14px #0002;position:relative;margin:12px 0}
.hw:before{content:"";position:absolute;left:38px;top:0;bottom:0;border-left:2px solid #f5a3a3}
.hw h2{font-family:Kalam;font-weight:700;color:#c2255c;font-size:26px;line-height:32px;margin:0 0 0;text-decoration:underline wavy #f783ac 2px;text-underline-offset:5px}
.hw h3{font-family:Kalam;font-weight:700;color:#1864ab;font-size:21px;line-height:32px;margin:0}
.hw mark{background:linear-gradient(transparent 40%,#ffec99cc 40%);color:inherit;padding:0 2px}
.hw .bx{border:2.5px solid #e8590c;border-radius:10px 4px 12px 6px;padding:0 10px;margin:4px 0;background:#fff4e6aa}
.hw .ar{color:#c2255c;font-weight:700}.hw ul{margin:0;padding-left:22px}.hw li{margin:0}.hw p{margin:0}
.hw table{font-family:"Patrick Hand",Kalam;font-size:17px}.hw td,.hw th{border:1.5px solid #1d2a6b88}.hw th{background:#e7f5ff}
.hw .fl{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px}.hw .fl span{border:2px solid #1864ab;border-radius:14px;padding:0 8px;line-height:28px;background:#e7f5ff}
.hw .star{color:#e8590c}
body.dark{--bg:#121022;--card:#1d1a33;--tx:#ebe9fa;--mut:#a7a3c9;--line:#2f2b4d}body.dark th{background:#2a2550}body.dark code,body.dark pre,body.dark .ex,body.dark .fs{background:#2a2550}body.dark #q{background:#ffffffd0}body.dark .opt.r{background:#1b4332}body.dark .opt.wr{background:#5c1d1d}body.dark .tabs{background:var(--bg)}
@media print{header,nav.bn,.tabs,.noprint{display:none!important}body{background:#fff;padding:0}main{max-width:none;padding:0}.hw{box-shadow:none;break-inside:auto;page-break-after:always}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.ring{float:right;width:46px;height:46px;border-radius:50%;background:conic-gradient(var(--c) calc(var(--v)*1%),#0002 0);display:grid;place-items:center}.ring b{background:var(--bg,#fff);color:inherit;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-size:11px}
.box.sum{border-left:6px solid #12b886;background:#e6fcf5}.box.ef{border-left:6px solid #f08c00;background:#fff4e6}.dark .box.sum,.dark .box.ef{background:#222}
.df{font-size:11px;padding:1px 7px;border-radius:9px;color:#fff;vertical-align:middle}.df.easy{background:#2f9e44}.df.medium{background:#f08c00}.df.hard{background:#e03131}
.opt.r{animation:pop .35s}.opt.wr{animation:shk .35s}@keyframes pop{50%{transform:scale(1.04)}}@keyframes shk{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.sc{border-top:2px dashed #aaa;margin-top:8px}
