/*
Theme Name: Gyanpoints Full Version
Theme URI: https://gyanpoints.com
Author: GyanPoints
Description: Complete self-contained education theme for Classes 8–12, CBSE, JEE, NEET, SSC & competitive exams. Built-in quiz engine, study notes, mock tests, MathJax/KaTeX equations, PWA, dark mode, EN/HI toggle, mobile-first responsive design with bottom navigation. No plugins required.
Version: 3.3.0
Requires at least: 6.3
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: gyanpoints
*/
:root{--ease:cubic-bezier(.22,1,.36,1);--gp:#16a34a;--gp-d:#12823b;--gp-l:#e8f8ee;--ink:#0f172a;--mut:#64748b;--bg:#f6f8fb;--card:#fff;--br:#e2e8f0;--red:#e11d48;--r:16px;--sh:0 1px 2px rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.06)}
html[data-theme=dark]{--ink:#e5e7eb;--mut:#94a3b8;--bg:#0b1220;--card:#131c2e;--br:#26324a;--gp-l:#10301f;--sh:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.25)}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Devanagari","Noto Sans",sans-serif;color:var(--ink);background:var(--bg);padding-bottom:64px}
img{max-width:100%;height:auto}a{color:inherit;text-decoration:none}h1,h2,h3,h4{line-height:1.25;margin:0 0 .5em;letter-spacing:-.01em}
.gp-wrap{max-width:1480px;margin:0 auto;padding:0 clamp(14px,3vw,44px)}.gp-narrow{max-width:900px}.gp-center{text-align:center}
html[data-lang=en] [data-hi],html[data-lang=hi] [data-en]{display:none!important}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px;z-index:999}
.gp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--gp);color:#fff;border:2px solid var(--gp);border-radius:12px;padding:11px 20px;font:600 15px/1.2 inherit;cursor:pointer;transition:.15s}
.gp-btn:hover{background:var(--gp-d);border-color:var(--gp-d)}.gp-btn.o{background:transparent;color:var(--gp-d)}.gp-btn.o:hover,.gp-btn.o.on{background:var(--gp-l)}.gp-btn.sm{padding:8px 14px;font-size:14px}.gp-btn.light{background:#fff;color:var(--gp-d);border-color:#fff}.gp-btn[disabled]{opacity:.45;pointer-events:none}
.gp-ib{background:none;border:0;font-size:19px;line-height:1;padding:9px;border-radius:10px;cursor:pointer;color:var(--ink)}.gp-ib:hover{background:var(--gp-l)}
#gp-lang::before{font-size:15px;font-weight:700}html[data-lang=en] #gp-lang::before{content:"हिं"}html[data-lang=hi] #gp-lang::before{content:"EN"}
/* header */
.gp-announce{background:#0f172a;color:#e2e8f0;font-size:13px;text-align:center;padding:7px 36px;position:relative}.gp-announce[hidden]{display:none}.gp-announce a{color:#5eead4;font-weight:600}.gp-announce button{position:absolute;right:8px;top:2px;background:none;border:0;color:#94a3b8;font-size:20px;cursor:pointer}
.gp-header{position:sticky;top:0;z-index:50;background:var(--card);background:color-mix(in srgb,var(--card) 92%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--br)}.gp-header.scrolled{box-shadow:var(--sh)}
.gp-hrow{display:flex;align-items:center;gap:4px;height:62px}.gp-sp{flex:1}
.gp-logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:20px;color:var(--gp-d);white-space:nowrap}.gp-logo b{background:var(--gp);color:#fff;border-radius:10px;width:34px;height:34px;display:grid;place-items:center;font-size:18px}.gp-logo img{max-height:42px;width:auto}
.gp-nav{display:none;margin-left:14px}
.gp-menu{list-style:none;margin:0;padding:0;display:flex;gap:2px}.gp-menu li{position:relative}.gp-menu a{display:block;padding:9px 13px;border-radius:10px;font-weight:600;font-size:15px;color:var(--mut)}
.gp-menu a:hover,.gp-menu .current-menu-item>a,.gp-menu .current-menu-ancestor>a{background:var(--gp-l);color:var(--gp-d)}
.gp-menu .sub-menu{visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;position:absolute;top:100%;left:0;min-width:200px;background:var(--card);border:1px solid var(--br);border-radius:12px;box-shadow:var(--sh);padding:6px;list-style:none;margin:0;z-index:60}
.gp-menu li:hover>.sub-menu,.gp-menu li:focus-within>.sub-menu{visibility:visible;opacity:1;transform:none}.gp-menu>.menu-item-has-children>a::after{content:" ▾";font-size:11px}
.gp-searchbar{border-top:1px solid var(--br);padding:12px 0;background:var(--card)}.gp-searchbar[hidden]{display:none}
.gp-search{display:flex;gap:8px;max-width:640px}.gp-search input{flex:1;min-width:0;border:1.5px solid var(--br);background:var(--card);color:var(--ink);border-radius:12px;padding:11px 14px;font:inherit}.gp-search input:focus{outline:2px solid var(--gp);border-color:transparent}
.gp-drawer{position:fixed;inset:0 auto 0 0;width:min(320px,86vw);background:var(--card);transform:translateX(-102%);transition:transform .25s;z-index:100;overflow:auto;padding:14px 12px}.nav-open .gp-drawer{transform:none}
.gp-drawer-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.gp-drawer .gp-menu{flex-direction:column;gap:2px}.gp-drawer .gp-menu a{font-size:16px;color:var(--ink)}
.gp-drawer .sub-menu{visibility:visible;opacity:1;transform:none;max-height:0;overflow:hidden;position:static;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0;transition:max-height .35s var(--ease)}.gp-drawer li.open>.sub-menu{max-height:800px}.gp-drawer .menu-item-has-children>a::after{display:none}
.sub-toggle{position:absolute;right:4px;top:5px;width:34px;height:34px;border:0;background:var(--bg);border-radius:8px;color:var(--ink);font-size:18px;cursor:pointer;transition:.2s}.open>.sub-toggle{transform:rotate(90deg)}.gp-drawer .menu-item-has-children>a{padding-right:44px}
.gp-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);opacity:0;pointer-events:none;transition:.25s;z-index:90}.nav-open .gp-overlay{opacity:1;pointer-events:auto}.nav-open{overflow:hidden}
/* hero + headers */
.gp-hero{padding:40px 0 34px;background:radial-gradient(900px 380px at 85% -10%,var(--gp-l),transparent),linear-gradient(180deg,var(--card),var(--bg))}
.gp-badge{display:inline-block;background:var(--gp-l);color:var(--gp-d);font-weight:700;font-size:13px;padding:6px 12px;border-radius:999px}
.gp-hero h1{font-size:clamp(28px,6.2vw,50px);max-width:780px;margin:14px 0 10px}.gp-sub{color:var(--mut);max-width:640px;margin:0 0 18px}
.gp-hero .gp-search{margin-bottom:6px}.gp-stats{display:flex;gap:26px;margin-top:22px}.gp-stats b{display:block;font-size:26px;line-height:1.1}.gp-stats span{color:var(--mut);font-size:13px}
.gp-phead{padding:22px 0 8px;background:var(--card);border-bottom:1px solid var(--br)}.gp-phead h1{font-size:clamp(24px,5vw,36px);margin:6px 0 8px}
.gp-crumb{font-size:13px;color:var(--mut);display:flex;flex-wrap:wrap;gap:4px;align-items:center}.gp-crumb a:hover{color:var(--gp)}.gp-crumb i{font-style:normal;opacity:.6}
.gp-chips,.gp-meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 14px;align-items:center}.gp-meta{color:var(--mut);font-size:14px}
.gp-chips{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.gp-chips::-webkit-scrollbar{display:none}
.gp-chip{flex:none;border:1.5px solid var(--br);background:var(--card);border-radius:999px;padding:7px 15px;font-weight:600;font-size:14px;transition:.15s}.gp-chip:hover,.gp-chip.on{background:var(--gp);border-color:var(--gp);color:#fff}
/* sections */
.gp-sec{padding:34px 0}.gp-sec.alt{background:var(--card);border-block:1px solid var(--br)}
.gp-sechead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:16px}.gp-sechead h2{font-size:clamp(21px,4vw,28px);margin:0}.gp-sechead h2 a:hover{color:var(--gp)}.gp-more{color:var(--gp-d);font-weight:600;font-size:14px;white-space:nowrap}
.gp-grid{display:grid;gap:16px;grid-template-columns:1fr}
.gp-card{background:var(--card);border:1px solid var(--br);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column;transition:.18s}.gp-card:hover{transform:translateY(-3px);border-color:var(--gp)}
.gp-card-bd{padding:16px;flex:1;display:block}.gp-card h3{font-size:17px;margin:8px 0 6px}.gp-card p{margin:0;color:var(--mut);font-size:14px}
.gp-card-ft{display:flex;justify-content:space-between;gap:8px;align-items:center;background:var(--bg);padding:10px 16px;font-size:13px;color:var(--mut)}.gp-go{color:var(--gp-d);font-weight:700}
.gp-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,var(--gp-l),#c7f0d6);display:grid;place-items:center;font-size:44px;font-weight:800;color:var(--gp);overflow:hidden}.gp-thumb img{width:100%;height:100%;object-fit:cover}
.gp-post .gp-card-bd{display:block}.gp-cat{color:var(--gp-d);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.gp-tags{display:flex;gap:6px}.gp-tag{font-size:11px;font-weight:800;padding:3px 9px;border-radius:6px;text-transform:uppercase}.gp-tag.live{background:#dbeafe;color:#1d4ed8}.gp-tag.free{background:#d1fae5;color:#047857}
html[data-theme=dark] .gp-tag.live{background:#1e3a8a;color:#bfdbfe}html[data-theme=dark] .gp-tag.free{background:#064e3b;color:#a7f3d0}
.gp-cgrid{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
.gp-ccard{background:var(--card);border:1px solid var(--br);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:2px;box-shadow:var(--sh);transition:.18s}.gp-ccard:hover{border-color:var(--gp);transform:translateY(-3px)}
.gp-ccard b{font-size:34px;line-height:1;color:var(--gp)}.gp-ccard span{font-weight:700}.gp-ccard small{color:var(--mut);font-size:12px}
.gp-egrid{display:grid;gap:14px;grid-template-columns:1fr}.gp-ecard{background:var(--bg);border:1px solid var(--br);border-radius:var(--r);padding:16px}.alt .gp-ecard{background:var(--bg)}
.gp-ehead{display:flex;align-items:center;gap:12px;margin-bottom:10px}.gp-ehead i{font-style:normal;width:42px;height:42px;border-radius:12px;background:var(--gp-l);display:grid;place-items:center;font-size:21px}.gp-ehead b{font-size:18px}
.gp-echips{display:flex;flex-wrap:wrap;gap:6px}.gp-echips a{background:var(--card);border:1px solid var(--br);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.gp-echips a:hover{border-color:var(--gp);color:var(--gp-d)}
.gp-stream{font-size:15px;color:var(--gp-d);margin:14px 0 0}
.gp-subjects{display:grid;gap:10px;grid-template-columns:1fr 1fr;margin-top:10px}
.gp-subjects a{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--br);border-radius:14px;padding:12px;transition:.18s}.gp-subjects a:hover{border-color:var(--gp);box-shadow:var(--sh);transform:translateY(-2px)}
.gp-subjects i{font-style:normal;width:36px;height:36px;border-radius:50%;background:var(--gp-l);display:grid;place-items:center;flex:none}.gp-subjects b{font-weight:600;font-size:15px;line-height:1.25;flex:1}.gp-subjects small{color:var(--mut);font-size:12px}
.gp-tabs{display:flex;gap:6px;margin-bottom:18px;border-bottom:1px solid var(--br);overflow-x:auto}.gp-tabs a{padding:10px 16px;font-weight:600;color:var(--mut);border-bottom:3px solid transparent;white-space:nowrap}.gp-tabs a.on{color:var(--gp-d);border-color:var(--gp)}
.gp-cta{background:linear-gradient(135deg,var(--gp),#0d9488);color:#fff;border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}.gp-cta h2{margin:0 0 4px}.gp-cta p{margin:0;opacity:.9}
.gp-empty{text-align:center;color:var(--mut);padding:36px 0}
/* article */
.gp-card-box{background:var(--card);border:1px solid var(--br);border-radius:var(--r);padding:22px;box-shadow:var(--sh)}
.gp-prose{font-size:17px;line-height:1.8;overflow-wrap:anywhere}.gp-prose h2{font-size:clamp(21px,4.5vw,28px);margin:1.6em 0 .5em}.gp-prose h3{font-size:20px;margin:1.4em 0 .4em}.gp-prose a{color:var(--gp-d);text-decoration:underline}.gp-prose img{border-radius:12px}.gp-prose table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}.gp-prose th,.gp-prose td{border:1px solid var(--br);padding:8px 10px}.gp-prose blockquote{margin:1em 0;padding:4px 16px;border-left:4px solid var(--gp);background:var(--gp-l);border-radius:0 10px 10px 0}
.gp-hero-img{width:100%;margin-bottom:14px}.gp-share{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:18px 0;font-size:14px;color:var(--mut)}.gp-share a,.gp-share button{border:1px solid var(--br);background:var(--card);color:var(--ink);border-radius:999px;padding:6px 14px;font:600 13px inherit;cursor:pointer}.gp-share a:hover,.gp-share button:hover{border-color:var(--gp);color:var(--gp-d)}
.gp-rel{margin:28px 0 14px;font-size:22px}.gp-tagsrow a{background:var(--gp-l);color:var(--gp-d);padding:3px 10px;border-radius:999px;font-size:13px;margin-right:6px}
.gp-pager{display:flex;gap:6px;justify-content:center;margin-top:26px;flex-wrap:wrap}.gp-pager .page-numbers{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--br);background:var(--card);border-radius:10px;font-weight:600;padding:0 10px}.gp-pager .current,.gp-pager .page-numbers:hover{background:var(--gp);border-color:var(--gp);color:#fff}
.gp-comments{margin-top:28px}.gp-clist{list-style:none;padding:0}.gp-clist li{background:var(--card);border:1px solid var(--br);border-radius:12px;padding:14px;margin-bottom:10px}.gp-comments input[type=text],.gp-comments input[type=email],.gp-comments input[type=url],.gp-comments textarea{width:100%}
/* forms */
.gp-form label{display:block;font-weight:600;font-size:14px;margin-bottom:14px}.gp-form input,.gp-form textarea,.gp-comments input,.gp-comments textarea{display:block;width:100%;margin-top:6px;border:1.5px solid var(--br);background:var(--card);color:var(--ink);border-radius:12px;padding:11px 14px;font:inherit}
.gp-form input:focus,.gp-form textarea:focus{outline:2px solid var(--gp);border-color:transparent}.hp{position:absolute;left:-9999px}
.gp-note{background:var(--gp-l);border:1px solid var(--gp);border-radius:12px;padding:12px 16px;margin-bottom:16px}.gp-note.bad{background:#fff1f2;border-color:var(--red);color:#9f1239}html[data-theme=dark] .gp-note.bad{background:#3b1220;color:#fecdd3}
.gp-rrow{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--br);border-radius:12px;padding:12px 16px;margin-bottom:10px}.gp-rrow:hover{border-color:var(--gp)}.gp-rrow span{color:var(--mut);font-size:13px}
/* quiz */
.qz-card{background:var(--card);border:1px solid var(--br);border-radius:var(--r);padding:18px;box-shadow:var(--sh);margin-bottom:14px}
.qz-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:10px;margin-bottom:14px}.qz-stats div{background:var(--bg);border-radius:12px;padding:10px;text-align:center}.qz-stats b{display:block;font-size:22px}.qz-stats span{font-size:12px;color:var(--mut)}.qz-stats .ok{color:var(--gp)}.qz-stats .bad{color:var(--red)}
.qz-inst{color:var(--mut);padding-left:20px;margin:0 0 16px}
.qz-top{position:sticky;top:62px;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--br);border-radius:14px;padding:8px 12px;margin-bottom:12px;box-shadow:var(--sh)}.qz-timer{font:700 20px ui-monospace,monospace;color:var(--gp-d)}.qz-prog{font-weight:600;color:var(--mut)}
.qz-q{display:flex;gap:12px;font-size:18px;font-weight:600;margin-bottom:14px;line-height:1.5}.qz-n{flex:none;width:32px;height:32px;border-radius:50%;background:var(--gp);color:#fff;display:grid;place-items:center;font-size:14px}
.qz-opts{display:grid;gap:10px}.qz-opt{display:flex;gap:12px;align-items:center;text-align:left;width:100%;border:1.5px solid var(--br);background:var(--card);color:var(--ink);border-radius:12px;padding:12px 14px;font:inherit;cursor:pointer;transition:.12s}button.qz-opt:hover{border-color:var(--gp)}
.qz-opt b{flex:none;width:28px;height:28px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font-size:13px}.qz-opt span{flex:1}.qz-opt em{font-style:normal;font-size:12px;font-weight:700}
.qz-opt.sel{border-color:var(--gp);background:var(--gp-l)}.qz-opt.sel b{background:var(--gp);color:#fff}.qz-opt.good{border-color:var(--gp);background:var(--gp-l);color:var(--gp-d)}.qz-opt.miss{border-color:var(--red);background:#fff1f2;color:#9f1239}html[data-theme=dark] .qz-opt.miss{background:#3b1220;color:#fecdd3}
.qz-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.qz-nav .gp-btn:last-child{margin-left:auto}
.qz-palh{font-weight:700;font-size:14px;margin-bottom:10px}.qz-pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:8px}.qz-pal button{height:40px;border-radius:10px;border:1.5px solid var(--br);background:var(--card);color:var(--ink);font-weight:700;cursor:pointer}
.qz-pal .vis{background:#fee2e2;border-color:#fca5a5}.qz-pal .ans{background:var(--gp);border-color:var(--gp);color:#fff}.qz-pal .mk{box-shadow:0 0 0 2.5px #f59e0b}.qz-pal .cur{outline:2.5px solid var(--ink);outline-offset:1px}
.qz-score{text-align:center;margin-bottom:16px}.qz-score span{color:var(--mut)}.qz-score b{display:block;font-size:48px;line-height:1.1}.qz-score small{font-size:20px;color:var(--mut)}.qz-bar{height:10px;background:var(--bg);border-radius:99px;overflow:hidden;margin-top:10px}.qz-bar i{display:block;height:100%;background:var(--gp)}
.qz-exp{background:var(--bg);border-radius:10px;padding:10px 12px;font-size:14px;margin:12px 0 0}.qz-na{color:var(--mut);font-size:13px;margin:10px 0 0}
/* footer + mobile nav */
.gp-footer{background:#0f172a;color:#94a3b8;margin-top:30px;padding:36px 0 0;font-size:14px}.gp-fgrid{display:grid;gap:24px}.gp-footer h4{color:#f8fafc;margin-bottom:10px}.gp-footer ul{list-style:none;margin:0;padding:0}.gp-footer li{margin:6px 0}.gp-footer a:hover{color:#5eead4}.gp-footer .gp-logo{color:#fff}
.gp-social{display:flex;gap:10px;flex-wrap:wrap}.gp-social a{border:1px solid #334155;border-radius:999px;padding:4px 12px}.gp-copy{border-top:1px solid #1e293b;margin-top:26px;padding:16px;text-align:center;font-size:13px}
.gp-bnav{position:fixed;bottom:0;left:0;right:0;z-index:60;display:flex;background:var(--card);border-top:1px solid var(--br);padding-bottom:env(safe-area-inset-bottom)}.gp-bnav a{flex:1;text-align:center;padding:7px 0 6px;font-size:11px;font-weight:600;color:var(--mut)}.gp-bnav span{display:block;font-size:19px}
.gp-top{position:fixed;right:14px;bottom:78px;z-index:55;width:42px;height:42px;border-radius:50%;border:0;background:var(--gp);color:#fff;font-size:20px;cursor:pointer;box-shadow:var(--sh);opacity:0;transform:translateY(14px) scale(.8);pointer-events:none;transition:opacity .3s var(--ease),transform .3s var(--ease)}.gp-top.show{opacity:1;transform:none;pointer-events:auto}.gp-top:hover{transform:translateY(-3px)}
/* responsive */
@media(min-width:640px){.gp-grid{grid-template-columns:1fr 1fr}.gp-cgrid{grid-template-columns:repeat(3,1fr)}.gp-egrid{grid-template-columns:1fr 1fr}.gp-subjects{grid-template-columns:repeat(3,1fr)}.gp-cta{flex-direction:row;align-items:center;justify-content:space-between}.gp-fgrid{grid-template-columns:2fr 1fr 1fr}}
@media(min-width:1280px){.gp-grid{grid-template-columns:repeat(4,1fr)}.gp-egrid{grid-template-columns:repeat(4,1fr)}.gp-subjects{grid-template-columns:repeat(5,1fr)}.qz-layout{grid-template-columns:1fr 340px}}
@media(min-width:900px){.gp-nav{display:block}.gp-burger{display:none}.gp-bnav{display:none}body{padding-bottom:0}.gp-top{bottom:20px}.gp-grid{grid-template-columns:repeat(3,1fr)}.gp-cgrid{grid-template-columns:repeat(5,1fr)}.gp-egrid{grid-template-columns:repeat(3,1fr)}.gp-subjects{grid-template-columns:repeat(4,1fr)}.gp-hero{padding:64px 0 54px}}

/* v2.1 – full width, maths, new pages */
.gp-full{max-width:none;padding:0}.gp-full>*{max-width:1480px;margin-inline:auto;padding-inline:clamp(14px,3vw,44px)}.gp-full>.alignfull,.gp-full>.wp-block-cover,.gp-full>.wp-block-group.alignfull{max-width:none;padding-inline:0}
.alignwide{max-width:1200px}.alignfull{width:100%;max-width:none}
mjx-container{max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}mjx-container[display=true]{margin:1em 0!important;padding:2px 0}.qz-opt mjx-container,.qz-q mjx-container{display:inline-block;margin:0!important;vertical-align:middle}
.gp-tiles{display:grid;gap:12px;grid-template-columns:1fr 1fr}.gp-tiles-sec{padding:20px 0 0}
.gp-tile{display:flex;flex-direction:column;gap:2px;background:var(--card);border:1px solid var(--br);border-radius:var(--r);padding:16px;box-shadow:var(--sh);transition:.18s}.gp-tile:hover{border-color:var(--gp);transform:translateY(-3px)}.gp-tile i{font-style:normal;font-size:26px}.gp-tile b{font-size:16px}.gp-tile small{color:var(--mut)}
.gp-smap{display:grid;gap:16px;grid-template-columns:1fr}.gp-smap h3{margin-bottom:8px}.gp-smap ul{margin:0;padding-left:18px}.gp-smap li{margin:5px 0}.gp-smap a:hover{color:var(--gp)}
.gp-prose details{border:1px solid var(--br);border-radius:12px;padding:12px 16px;margin:10px 0;background:var(--card)}.gp-prose summary{font-weight:700;cursor:pointer}.gp-prose details[open] summary{color:var(--gp-d);margin-bottom:6px}
.qz-layout{display:grid;gap:14px;grid-template-columns:1fr}.qz-side{order:2}.qz-rvgrid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:960px){.qz-layout{grid-template-columns:1fr 320px;align-items:start}.qz-side{position:sticky;top:130px}.qz-rvgrid{grid-template-columns:1fr 1fr}.gp-smap{grid-template-columns:repeat(4,1fr)}.gp-tiles{grid-template-columns:repeat(4,1fr)}}
.gp-narrow .qz-stats{margin-bottom:16px}

/* ===== v2.2 – Motion system (transform/opacity only; respects prefers-reduced-motion) ===== */
@view-transition{navigation:auto}
.gp-header{view-transition-name:gp-header}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes slideInL{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
@keyframes slideR{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
@keyframes slideL{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes pop{0%{transform:scale(.97)}55%{transform:scale(1.02)}100%{transform:none}}
@keyframes pulse{50%{opacity:.5}}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(-26px,22px)}}
@keyframes ripple{to{transform:scale(3.2);opacity:0}}
@keyframes fall{to{transform:translate(var(--dx),105vh) rotate(720deg);opacity:.85}}
main{animation:fadeIn .45s var(--ease) both}
/* scroll reveal – only when JS is on, so no-JS visitors always see everything */
.js .rv{opacity:0;transform:translateY(22px)}
.js .rv.in{opacity:1;transform:none;transition:opacity .65s var(--ease),transform .65s var(--ease);transition-delay:var(--d,0ms)}
/* hero entrance + floating glow */
.gp-hero{position:relative;overflow:hidden}.gp-hero>.gp-wrap{position:relative}
.gp-hero::before{content:"";position:absolute;width:460px;height:460px;right:-120px;top:-160px;border-radius:50%;background:radial-gradient(circle,var(--gp-l),transparent 68%);animation:float 10s ease-in-out infinite;pointer-events:none}
.gp-hero .gp-badge,.gp-hero h1,.gp-hero .gp-sub,.gp-hero .gp-search,.gp-hero .gp-chips,.gp-hero .gp-stats,.gp-phead h1,.gp-phead .gp-sub,.gp-phead .gp-chips,.gp-phead .gp-meta{animation:fadeUp .8s var(--ease) both}
.gp-hero h1{animation-delay:.08s}.gp-hero .gp-sub{animation-delay:.16s}.gp-hero .gp-search{animation-delay:.24s}.gp-hero .gp-chips{animation-delay:.32s}.gp-hero .gp-stats{animation-delay:.4s}.gp-phead .gp-sub,.gp-phead .gp-meta{animation-delay:.08s}.gp-phead .gp-chips{animation-delay:.14s}
/* interactions */
.gp-btn{position:relative;overflow:hidden;transition:background .2s,border-color .2s,transform .15s var(--ease),box-shadow .2s}.gp-btn:hover{box-shadow:0 6px 18px rgba(22,163,74,.28);transform:translateY(-1px)}.gp-btn:active,.gp-chip:active,.gp-ib:active{transform:scale(.96)}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.38);transform:scale(0);animation:ripple .65s ease-out forwards;pointer-events:none}.gp-btn.o .ripple{background:rgba(22,163,74,.22)}
.gp-card,.gp-ccard,.gp-tile,.gp-subjects a,.gp-ecard{transition:transform .3s var(--ease),border-color .25s,box-shadow .3s var(--ease)}
.gp-card:hover,.gp-ccard:hover,.gp-tile:hover{box-shadow:0 14px 34px rgba(15,23,42,.12)}
.gp-thumb img,.gp-thumb>span{transition:transform .6s var(--ease)}.gp-card:hover .gp-thumb img,.gp-card:hover .gp-thumb>span{transform:scale(1.07)}
.gp-go,.gp-more{display:inline-block;transition:transform .25s var(--ease)}.gp-card:hover .gp-go,.gp-more:hover{transform:translateX(5px)}
.gp-tile i,.gp-ehead i,.gp-subjects i{transition:transform .35s var(--ease)}.gp-tile:hover i,.gp-ehead:hover i,.gp-subjects a:hover i{transform:scale(1.18) rotate(-6deg)}
.gp-ccard b{transition:transform .3s var(--ease)}.gp-ccard:hover b{transform:scale(1.12)}
.gp-echips a,.gp-chip,.gp-share a,.gp-share button{transition:transform .2s var(--ease),background .2s,border-color .2s,color .2s}.gp-echips a:hover,.gp-share a:hover,.gp-share button:hover{transform:translateY(-2px)}
.gp-logo b{transition:transform .4s var(--ease)}.gp-logo:hover b{transform:rotate(-8deg) scale(1.1)}
.gp-tabs a{position:relative;transition:color .2s}.gp-tabs a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--gp);transform:scaleX(0);transition:transform .3s var(--ease)}.gp-tabs a.on::after,.gp-tabs a:hover::after{transform:scaleX(1)}.gp-tabs a{border-bottom-color:transparent!important}
.gp-search input{transition:box-shadow .25s,border-color .25s}.gp-search input:focus{box-shadow:0 0 0 4px var(--gp-l)}
.gp-searchbar:not([hidden]){animation:fadeDown .25s var(--ease)}
.gp-announce:not([hidden]){animation:fadeDown .5s var(--ease)}
.gp-header{transition:box-shadow .3s}
/* scroll progress */
.gp-progress{position:absolute;left:0;bottom:-1px;height:3px;width:100%;background:var(--gp);transform:scaleX(0);transform-origin:0 50%;opacity:0;transition:opacity .3s;pointer-events:none}.gp-progress.on{opacity:1}
/* drawer */
.gp-drawer{transition:transform .38s var(--ease)}.gp-overlay{transition:opacity .3s}
.nav-open .gp-drawer .gp-menu>li{animation:slideInL .45s var(--ease) both;animation-delay:calc(var(--i,0)*40ms + 120ms)}
.sub-toggle{transition:transform .3s var(--ease)}
/* accordion (FAQ) */
.gp-prose details>summary{list-style:none;position:relative;padding-right:28px}.gp-prose details>summary::-webkit-details-marker{display:none}
.gp-prose details>summary::after{content:"+";position:absolute;right:2px;top:-2px;font-size:22px;line-height:1.2;color:var(--gp);transition:transform .3s var(--ease)}.gp-prose details[open]>summary::after{transform:rotate(45deg)}
.gp-prose details>*:not(summary){animation:fadeDown .35s var(--ease)}
mjx-container{animation:fadeIn .4s}
/* smooth theme switch */
html.gp-theming *,html.gp-theming *::before,html.gp-theming *::after{transition:background-color .35s,color .35s,border-color .35s,fill .35s,box-shadow .35s!important}
/* quiz */
.qz-a-r{animation:slideR .38s var(--ease)}.qz-a-l{animation:slideL .38s var(--ease)}.qz-a-f{animation:fadeUp .45s var(--ease)}
.qz-opt{transition:border-color .2s,background .2s,transform .2s var(--ease),box-shadow .2s}button.qz-opt:hover{transform:translateX(4px);box-shadow:var(--sh)}.qz-opt.sel{animation:pop .32s var(--ease)}.qz-opt b{transition:background .2s,color .2s,transform .3s var(--ease)}.qz-opt.sel b{transform:scale(1.12)}
.qz-timer.warn{color:var(--red);animation:pulse 1s infinite}.qz-pal button{transition:transform .18s var(--ease),background .2s,border-color .2s}.qz-pal button:hover{transform:scale(1.1)}
.qz-bar i{transition:width 1s var(--ease)}.qz-res{animation:pop .55s var(--ease)}.qz-rv{animation:fadeUp .55s var(--ease) both;animation-delay:var(--d,0ms)}.qz-stats div{transition:transform .25s var(--ease)}.qz-stats div:hover{transform:translateY(-3px)}
.qz-confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:200}.qz-confetti i{position:absolute;top:-16px;left:var(--x);width:8px;height:14px;background:var(--c);border-radius:2px;transform:rotate(var(--r));animation:fall var(--t,2.2s) cubic-bezier(.3,.6,.5,1) forwards;animation-delay:var(--w,0s)}
/* reduced motion: everything instant, nothing hidden */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}.js .rv{opacity:1!important;transform:none!important}.gp-hero::before{display:none}@view-transition{navigation:none}}

/* ===== v2.3 – Fast notes: TOC, progressive math, chapter nav, print ===== */
/* old TOC styles removed */
@media(min-width:1100px){

}

/* Progressive math: soft placeholder until typeset */
.gp-math-pending{opacity:.55;filter:blur(.3px)}
.gp-math-ready{opacity:1;filter:none;transition:opacity .35s ease}
.gp-math-pending mjx-container{visibility:hidden}

/* Chapter prev/next */
.gp-chaptnav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0 8px}
.gp-chaptnav a{display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:var(--card);border:1px solid var(--br);border-radius:14px;box-shadow:var(--sh);transition:border-color .2s,transform .2s var(--ease);min-width:0}
.gp-chaptnav a:hover{border-color:var(--gp);transform:translateY(-2px)}
.gp-chaptnav span{font-size:12px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.03em}
.gp-chaptnav b{font-size:15px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.gp-chaptnav-next{text-align:right}
.gp-chaptnav-next span{align-self:flex-end}
@media(max-width:520px){.gp-chaptnav{grid-template-columns:1fr}}

/* Print */
@media print{
  .gp-header,.gp-footer,.gp-bnav,.gp-top,.gp-announce,.gp-share,.gp-chaptnav,.gp-rel,.gp-grid,.gp-progress,.gp-drawer,.gp-overlay,.gp-searchbar{display:none!important}
  body{padding:0;background:#fff;color:#000;font-size:12pt}
  .gp-prose,.gp-card-box{box-shadow:none;border:0;padding:0}
  .gp-toc{break-after:avoid;border:1px solid #ccc}
  a[href]::after{content:none}
  mjx-container{break-inside:avoid}
}

/* ===== Search bar + dark mode toggle (v2.3.1) ===== */
.gp-search-inline{display:none;align-items:center;gap:0;max-width:220px;margin-right:4px;border:1.5px solid var(--br);border-radius:12px;background:var(--bg);overflow:hidden;transition:border-color .2s,box-shadow .2s,max-width .25s var(--ease)}
.gp-search-inline:focus-within{border-color:var(--gp);box-shadow:0 0 0 3px var(--gp-l);max-width:280px}
.gp-search-inline input{border:0;background:transparent;padding:8px 4px 8px 12px;font-size:14px;min-width:0;width:100%;color:var(--ink);outline:none}
.gp-search-inline .gp-ib{padding:6px 10px;font-size:16px;flex-shrink:0}
.gp-search-mob{display:inline-flex}
@media(min-width:900px){
  .gp-search-inline{display:flex}
  .gp-search-mob{display:none}
}
.gp-searchbar .gp-search{max-width:720px;align-items:center}
.gp-searchbar #gp-search-close{font-size:22px;margin-left:2px;color:var(--mut)}
.gp-search-drawer{margin:8px 4px 14px;padding:0 4px}
.gp-search-drawer input{font-size:15px;padding:10px 12px}

/* Dark mode button: show moon in light theme, sun in dark */
.gp-dark-btn{position:relative;width:40px;height:40px}
.gp-dark-btn .gp-icon-moon,.gp-dark-btn .gp-icon-sun{position:absolute;inset:0;display:grid;place-items:center;font-size:18px;transition:opacity .25s,transform .25s var(--ease)}
.gp-dark-btn .gp-icon-sun{opacity:0;transform:rotate(-40deg) scale(.6)}
html[data-theme=dark] .gp-dark-btn .gp-icon-moon{opacity:0;transform:rotate(40deg) scale(.6)}
html[data-theme=dark] .gp-dark-btn .gp-icon-sun{opacity:1;transform:none}

/* ===== PWA welcome splash + install banner (v2.4) ===== */
.gp-logo-img{width:42px;height:42px;border-radius:10px;object-fit:contain;background:#fff}
.gp-logo b{display:none} /* when img logo is used via custom; keep for fallback in drawer */
.gp-logo:has(.gp-logo-img) b{display:none}

.gp-splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#fff;transition:opacity .4s ease,visibility .4s}
html[data-theme=dark] .gp-splash{background:#0b1220}
.gp-splash[hidden]{display:none}
.gp-splash-out{opacity:0;visibility:hidden}
html.gp-splash-on{overflow:hidden}
.gp-splash-inner{text-align:center;padding:24px;animation:fadeUp .6s var(--ease) both}
.gp-splash-logo{width:min(200px,55vw);height:auto;margin:0 auto 16px;display:block}
.gp-splash-title{font-size:clamp(22px,5vw,32px);color:#1e40af;margin:0 0 6px;font-weight:800}
html[data-theme=dark] .gp-splash-title{color:#93c5fd}
.gp-splash-tag{color:var(--mut);font-size:15px;margin:0;font-weight:500}

.gp-install{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:90;display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--card);border:1px solid var(--br);border-radius:16px;box-shadow:0 8px 32px rgba(15,23,42,.18);max-width:480px;margin:0 auto}
.gp-install[hidden]{display:none}
.gp-install img{border-radius:10px;flex-shrink:0}
.gp-install-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--mut)}
.gp-install-txt b{font-size:14px;color:var(--ink)}
.gp-install .gp-btn{flex-shrink:0}
.gp-install .gp-ib{flex-shrink:0;color:var(--mut)}
@media(min-width:900px){.gp-install{bottom:20px;left:auto;right:20px;width:min(420px,calc(100vw - 40px))}}
/* Hide install over mobile bottom nav */
@media(max-width:899px){.gp-install{bottom:calc(70px + env(safe-area-inset-bottom))}}

/* ===== v2.5 – Content-page speed: skip heavy motion on notes/posts ===== */
body.gp-content .gp-prose,
body.gp-content .gp-card-box,
body.gp-content .gp-phead h1,
body.gp-content .gp-phead .gp-meta {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}
body.gp-content .rv {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
/* KaTeX display */
.katex-display { overflow-x: auto; overflow-y: hidden; padding: 2px 0; margin: 0.8em 0; }
.gp-math-pending { opacity: 0.7; }
.gp-math-ready { opacity: 1; transition: opacity 0.25s ease; }
/* Faster splash – never block layout long */
.gp-splash { transition: opacity 0.25s ease; }

/* ========== Full Width Blog Posts ========== */
.gp-fullwidth{
  max-width:1280px;
  width:100%;
}
.gp-full-prose{
  max-width:100%;
}
.gp-full-prose .gp-hero-img{
  width:100%;
  max-height:480px;
  object-fit:cover;
  border-radius:16px;
  margin-bottom:1.5rem;
}
.gp-full-prose p,
.gp-full-prose li,
.gp-full-prose h2,
.gp-full-prose h3{
  max-width:100%;
}

/* ========== Professional Logo ========== */
.gp-logo img,
.gp-logo .custom-logo,
img.custom-logo{
  max-height:48px !important;
  width:auto !important;
  height:auto !important;
  display:block;
  border-radius:8px;
  object-fit:contain;
}
.gp-logo{
  gap:10px;
}
.gp-logo span{
  font-weight:800;
  font-size:1.15rem;
  color:var(--gp-d);
  letter-spacing:-0.02em;
}
@media(max-width:480px){
  .gp-logo span{display:none} /* hide text on very small screens, show only logo */
  .gp-logo img,
  .gp-logo .custom-logo{max-height:40px !important}
}

/* Sticky header enhancements */
.gp-header{
  position:sticky;
  top:0;
  z-index:100;
  transition:box-shadow .25s ease, background .25s ease;
}
.gp-header.scrolled{
  box-shadow:0 4px 20px rgba(15,23,42,.08);
}
html[data-theme=dark] .gp-header.scrolled{
  box-shadow:0 4px 20px rgba(0,0,0,.35);
}

/* Ensure mobile bottom nav doesn't overlap content */
@media(max-width:899px){
  body{padding-bottom:72px}
}

/* ========== Mobile Menu Fixes (v3.1.1) ========== */
.gp-drawer{
  position:fixed;
  top:0; left:0; bottom:0;
  width:min(320px, 88vw);
  background:var(--card);
  transform:translateX(-105%);
  transition:transform .32s cubic-bezier(.22,1,.36,1);
  z-index:200;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  padding:16px 14px 100px;
  box-shadow:4px 0 24px rgba(0,0,0,.12);
}
.nav-open .gp-drawer{transform:translateX(0)}

.gp-overlay{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .3s ease;
  z-index:190;
  backdrop-filter:blur(2px);
}
.nav-open .gp-overlay{
  opacity:1;
  pointer-events:auto;
}

/* Prevent body scroll when menu open */
body.nav-open{
  overflow:hidden !important;
  touch-action:none;
}

/* Drawer header */
.gp-drawer-h{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid var(--br);
}
.gp-drawer-h .gp-logo img{max-height:40px !important}

/* Mobile menu items */
.gp-drawer .gp-menu{
  flex-direction:column;
  gap:2px;
  margin:0;
  padding:0;
  list-style:none;
}
.gp-drawer .gp-menu > li{
  position:relative;
  border-radius:10px;
}
.gp-drawer .gp-menu a{
  display:block;
  padding:13px 14px;
  font-size:16px;
  font-weight:600;
  color:var(--ink);
  border-radius:10px;
  line-height:1.3;
}
.gp-drawer .gp-menu a:hover,
.gp-drawer .gp-menu .current-menu-item > a{
  background:var(--gp-l);
  color:var(--gp-d);
}

/* Sub-menu (accordion style) */
.gp-drawer .sub-menu{
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
  position:static !important;
  max-height:0;
  overflow:hidden;
  border:0 !important;
  box-shadow:none !important;
  padding:0 0 0 12px !important;
  min-width:0 !important;
  margin:0 !important;
  list-style:none;
  transition:max-height .35s cubic-bezier(.22,1,.36,1);
  background:transparent;
}
.gp-drawer li.open > .sub-menu{
  max-height:600px;
  padding-bottom:6px !important;
}
.gp-drawer .sub-menu a{
  font-size:15px;
  font-weight:500;
  padding:10px 12px;
  color:var(--mut);
}
.gp-drawer .menu-item-has-children > a{
  padding-right:48px;
}
.gp-drawer .menu-item-has-children > a::after{display:none !important}

/* Sub-toggle button – large touch target */
.sub-toggle{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border:0;
  background:var(--bg);
  border-radius:10px;
  color:var(--ink);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:transform .25s ease, background .2s;
  z-index:2;
}
.sub-toggle:hover{background:var(--gp-l)}
.gp-drawer li.open > .sub-toggle{
  transform:translateY(-50%) rotate(180deg);
  background:var(--gp-l);
  color:var(--gp-d);
}

/* Burger button visibility */
.gp-burger{
  display:grid;
  place-items:center;
  font-size:22px;
  width:42px;
  height:42px;
}
@media(min-width:900px){
  .gp-burger{display:none !important}
  .gp-drawer, .gp-overlay{display:none !important}
}

/* ========== Post Images Improvements ========== */

/* Card thumbnails – consistent 16:9 ratio */
.gp-thumb{
  display:block;
  aspect-ratio:16/9;
  overflow:hidden;
  background:var(--bg);
  position:relative;
}
.gp-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:transform .35s ease;
}
.gp-card:hover .gp-thumb img{
  transform:scale(1.04);
}
.gp-thumb span{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-size:2.4rem;
  background:linear-gradient(135deg, var(--gp-l), var(--bg));
  color:var(--gp-d);
  font-weight:700;
}

/* Single post hero image */
.gp-hero-img,
.gp-prose .gp-hero-img,
.gp-full-prose .gp-hero-img,
article .wp-post-image{
  width:100%;
  height:auto;
  max-height:min(420px, 55vw);
  object-fit:cover;
  object-position:center;
  border-radius:16px;
  margin:0 0 1.6rem;
  display:block;
  box-shadow:0 4px 20px rgba(15,23,42,.08);
}
@media(max-width:640px){
  .gp-hero-img,
  .gp-prose .gp-hero-img,
  article .wp-post-image{
    max-height:260px;
    border-radius:12px;
    margin-bottom:1.2rem;
  }
}

/* Images inside post content */
.gp-prose img,
.gp-full-prose img{
  max-width:100%;
  height:auto;
  border-radius:12px;
  margin:1.2em 0;
}
.gp-prose figure,
.gp-full-prose figure{
  margin:1.5em 0;
}
.gp-prose figcaption,
.gp-full-prose figcaption{
  font-size:13px;
  color:var(--mut);
  text-align:center;
  margin-top:8px;
}

/* Card image container polish */
.gp-card{
  overflow:hidden;
}
.gp-card .gp-thumb{
  border-radius:var(--r) var(--r) 0 0;
}

/* Better spacing on mobile cards */
@media(max-width:639px){
  .gp-card .gp-card-bd{padding:14px}
  .gp-card h3{font-size:16px}
}


/* ========== Professional Table of Contents ========== */
.gp-toc{
  margin:1.5rem 0 2rem;
  padding:0;
  background:var(--card);
  border:1px solid var(--br);
  border-radius:16px;
  box-shadow:var(--sh);
  overflow:hidden;
}
.gp-toc-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  background:transparent;
  border:0;
  padding:14px 16px;
  font:700 15px/1.3 inherit;
  color:var(--ink);
  cursor:pointer;
  transition:background .2s ease;
}
.gp-toc-toggle:hover{
  background:var(--bg);
}
.gp-toc-label{
  display:flex;
  align-items:center;
  gap:10px;
}
.gp-toc-icon{
  color:var(--gp);
  flex-shrink:0;
}
.gp-toc-chevron{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:8px;
  background:var(--bg);
  color:var(--mut);
  transition:transform .28s cubic-bezier(.22,1,.36,1), background .2s, color .2s;
}
.gp-toc-toggle[aria-expanded="true"] .gp-toc-chevron{
  transform:rotate(180deg);
  background:var(--gp-l);
  color:var(--gp-d);
}
.gp-toc-list{
  margin:0;
  padding:4px 12px 14px;
  list-style:none;
  font-size:14.5px;
  line-height:1.4;
  border-top:1px solid var(--br);
}
.gp-toc-list[hidden]{
  display:none !important;
}
.gp-toc-list li{
  margin:0;
  padding:0;
}
.gp-toc-list a{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:9px 10px;
  border-radius:10px;
  color:var(--mut);
  text-decoration:none;
  transition:background .15s, color .15s;
}
.gp-toc-list a:hover{
  background:var(--gp-l);
  color:var(--gp-d);
}
.gp-toc-list a.on{
  background:var(--gp-l);
  color:var(--gp-d);
  font-weight:600;
}
.gp-toc-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--br);
  margin-top:7px;
  flex-shrink:0;
  transition:background .2s, transform .2s;
}
.gp-toc-list a:hover .gp-toc-dot,
.gp-toc-list a.on .gp-toc-dot{
  background:var(--gp);
  transform:scale(1.25);
}
/* Nested H3 items */
.gp-toc-list .gp-toc-h3 a{
  padding-left:22px;
  font-size:13.5px;
  font-weight:500;
}
.gp-toc-list .gp-toc-h3 .gp-toc-dot{
  width:5px;
  height:5px;
  margin-top:8px;
}

/* Sticky TOC on larger screens when inside narrow content */
@media(min-width:1100px){
  .gp-narrow:has(.gp-toc){
    position:relative;
  }
  .gp-narrow .gp-toc{
    position:sticky;
    top:78px;
    z-index:5;
    max-height:calc(100vh - 100px);
    overflow:auto;
  }
}

/* Mobile TOC refinements */
@media(max-width:768px){
  .gp-toc{
    margin:1.1rem 0 1.5rem;
    border-radius:14px;
  }
  .gp-toc-toggle{
    padding:13px 14px;
    font-size:14.5px;
    min-height:48px; /* good touch target */
  }
  .gp-toc-list{
    padding:2px 8px 12px;
    font-size:14px;
  }
  .gp-toc-list a{
    padding:11px 10px; /* larger touch targets */
  }
  .gp-toc-list .gp-toc-h3 a{
    padding-left:20px;
  }
}

/* ========== Full-width Blog Posts (Desktop + Mobile) ========== */
.gp-fullwidth{
  max-width:100% !important;
  width:100%;
  padding-left:clamp(14px, 4vw, 48px);
  padding-right:clamp(14px, 4vw, 48px);
}
.gp-full-prose{
  max-width:100% !important;
  width:100%;
}
.gp-full-prose .gp-hero-img,
.gp-fullwidth .gp-hero-img{
  width:100%;
  max-height:min(480px, 50vw);
  object-fit:cover;
  border-radius:16px;
}
@media(max-width:640px){
  .gp-fullwidth{
    padding-left:14px;
    padding-right:14px;
  }
  .gp-full-prose .gp-hero-img,
  .gp-fullwidth .gp-hero-img{
    max-height:240px;
    border-radius:12px;
  }
}

/* Make single post page header also full width for blog posts */
body.single-post .gp-phead .gp-wrap,
body.single-post .gp-sec > .gp-wrap{
  max-width:100%;
}


/* ========== TOC – Final working styles (v3.2.1) ========== */
.gp-toc{
  margin:1.5rem 0 2rem !important;
  padding:0 !important;
  background:var(--card) !important;
  border:1px solid var(--br) !important;
  border-radius:16px !important;
  box-shadow:var(--sh);
  overflow:hidden;
}
.gp-toc-toggle{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  background:transparent !important;
  border:0 !important;
  padding:14px 16px !important;
  font:700 15px/1.3 inherit !important;
  color:var(--ink) !important;
  cursor:pointer;
  text-align:left;
}
.gp-toc-toggle:hover{background:var(--bg) !important}
.gp-toc-label{
  display:flex;
  align-items:center;
  gap:10px;
}
.gp-toc-icon{color:var(--gp);flex-shrink:0}
.gp-toc-chevron{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:8px;
  background:var(--bg);
  color:var(--mut);
  transition:transform .28s cubic-bezier(.22,1,.36,1), background .2s, color .2s;
  flex-shrink:0;
}
/* Chevron points down when open, right when collapsed */
.gp-toc-toggle[aria-expanded="true"] .gp-toc-chevron{
  transform:rotate(0deg);
  background:var(--gp-l);
  color:var(--gp-d);
}
.gp-toc-toggle[aria-expanded="false"] .gp-toc-chevron,
.gp-toc.is-collapsed .gp-toc-chevron{
  transform:rotate(-90deg);
  background:var(--bg);
  color:var(--mut);
}

/* List visibility controlled by JS + CSS */
.gp-toc-list{
  margin:0 !important;
  padding:4px 12px 14px !important;
  list-style:none !important;
  font-size:14.5px;
  line-height:1.4;
  border-top:1px solid var(--br);
  display:block;
}
.gp-toc-list[hidden],
.gp-toc.is-collapsed .gp-toc-list{
  display:none !important;
}

.gp-toc-list li{margin:0;padding:0;list-style:none !important}
.gp-toc-list a{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  padding:9px 10px;
  border-radius:10px;
  color:var(--mut);
  text-decoration:none;
  transition:background .15s, color .15s;
}
.gp-toc-list a:hover{
  background:var(--gp-l);
  color:var(--gp-d);
}
.gp-toc-list a.on{
  background:var(--gp-l);
  color:var(--gp-d);
  font-weight:600;
}
.gp-toc-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--br);
  margin-top:7px;
  flex-shrink:0;
  transition:background .2s, transform .2s;
}
.gp-toc-list a:hover .gp-toc-dot,
.gp-toc-list a.on .gp-toc-dot{
  background:var(--gp);
  transform:scale(1.25);
}
.gp-toc-list .gp-toc-h3 a{
  padding-left:22px;
  font-size:13.5px;
  font-weight:500;
}
.gp-toc-list .gp-toc-h3 .gp-toc-dot{
  width:5px;
  height:5px;
  margin-top:8px;
}

@media(min-width:1100px){
  .gp-narrow .gp-toc{
    position:sticky;
    top:78px;
    z-index:5;
    max-height:calc(100vh - 100px);
    overflow:auto;
  }
}

@media(max-width:768px){
  .gp-toc{margin:1.1rem 0 1.5rem !important;border-radius:14px !important}
  .gp-toc-toggle{padding:13px 14px !important;min-height:48px}
  .gp-toc-list{padding:2px 8px 12px !important;font-size:14px}
  .gp-toc-list a{padding:11px 10px}
}

/* ========== Live Search Dropdown ========== */
.gp-live-wrap{position:relative;width:100%}
.gp-live-inline{width:auto;max-width:280px}
.gp-live-drop{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  min-width:min(420px, 92vw);
  max-height:min(420px, 70vh);
  overflow:auto;
  background:var(--card);
  border:1px solid var(--br);
  border-radius:14px;
  box-shadow:0 12px 40px rgba(15,23,42,.14);
  z-index:120;
  padding:8px;
}
.gp-live-inline .gp-live-drop{right:auto;left:0}
.gp-searchbar .gp-live-drop{left:0;right:0;min-width:0}
.gp-live-group{margin-bottom:6px}
.gp-live-group-t{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--mut);
  padding:6px 10px 4px;
}
.gp-live-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  color:var(--ink);
  text-decoration:none;
  transition:background .12s;
}
.gp-live-item:hover,
.gp-live-item:focus{
  background:var(--gp-l);
  color:var(--gp-d);
  outline:none;
}
.gp-live-title{
  font-weight:600;
  font-size:14px;
  line-height:1.3;
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.gp-live-badge{
  flex-shrink:0;
  font-size:11px;
  font-weight:600;
  color:var(--gp-d);
  background:var(--gp-l);
  border-radius:999px;
  padding:3px 8px;
}
.gp-live-all{
  display:block;
  text-align:center;
  padding:10px;
  margin-top:4px;
  font-weight:600;
  font-size:13px;
  color:var(--gp-d);
  border-top:1px solid var(--br);
}
.gp-live-all:hover{text-decoration:underline}
.gp-live-empty{
  padding:16px;
  text-align:center;
  color:var(--mut);
  font-size:14px;
}

/* ========== Practice Generator ========== */
.gp-gen-card{
  background:var(--card);
  border:1px solid var(--br);
  border-radius:18px;
  box-shadow:var(--sh);
  padding:clamp(18px,3vw,28px);
  margin-bottom:28px;
}
.gp-gen-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin-bottom:18px;
}
@media(min-width:640px){
  .gp-gen-grid{grid-template-columns:1fr 1fr}
}
@media(min-width:960px){
  .gp-gen-grid{grid-template-columns:repeat(4,1fr)}
}
.gp-gen-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
  font-weight:600;
  color:var(--mut);
}
.gp-gen-field select{
  appearance:none;
  background:var(--bg);
  border:1.5px solid var(--br);
  border-radius:12px;
  padding:11px 14px;
  font:inherit;
  font-weight:500;
  color:var(--ink);
  cursor:pointer;
}
.gp-gen-field select:focus{
  outline:2px solid var(--gp);
  border-color:transparent;
}
.gp-gen-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.gp-gen-status{
  margin-top:16px;
  padding:12px 14px;
  background:var(--bg);
  border-radius:12px;
  color:var(--mut);
  font-size:14px;
}
.gp-gen-results{margin-top:22px}
.gp-gen-count{
  font-weight:700;
  margin-bottom:14px;
  color:var(--gp-d);
}
.gp-gen-tips{
  background:var(--bg);
  border-radius:16px;
  padding:18px 20px;
  border:1px solid var(--br);
}
.gp-gen-tips h3{margin:0 0 10px;font-size:16px}
.gp-gen-tips ul{margin:0;padding-left:18px;color:var(--mut);font-size:14px;line-height:1.7}

@media(max-width:899px){
  .gp-live-inline{display:none}
  .gp-searchbar .gp-live-drop{
    position:fixed;
    left:12px;
    right:12px;
    top:auto;
    max-height:55vh;
  }
}