/* =============================================================================
   PayLater Developer Documentation — design system
   Pure CSS. No framework. Brand: PayLater Brandbook V1.5.
   Palette · Neon Cyan #60c4d1 · Cloud #eeecf8 · Lilac #806aea · Violet #4b3293
            · Indigo #3f3793 · Midnight #1f1744
   Type · Aspekta (self-hosted woff2 below) with Inter / system fallback.
   ========================================================================== */

/* ---- Aspekta (real brand typeface) ------------------------------------- */
@font-face { font-family:'Aspekta'; font-weight:200; font-style:normal; font-display:swap; src:url('fonts/Aspekta-200.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:300; font-style:normal; font-display:swap; src:url('fonts/Aspekta-300.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:400; font-style:normal; font-display:swap; src:url('fonts/Aspekta-400.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:500; font-style:normal; font-display:swap; src:url('fonts/Aspekta-500.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:600; font-style:normal; font-display:swap; src:url('fonts/Aspekta-600.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:700; font-style:normal; font-display:swap; src:url('fonts/Aspekta-700.woff2') format('woff2'); }
@font-face { font-family:'Aspekta'; font-weight:800; font-style:normal; font-display:swap; src:url('fonts/Aspekta-800.woff2') format('woff2'); }

/* ---- Tokens: light ----------------------------------------------------- */
:root {
  --cyan:#60c4d1; --cyan-strong:#31b1c3; --cyan-soft:#9cdde6; --cyan-pale:#ddf3f6;
  --cloud:#eeecf8; --lilac:#806aea; --purple:#5a33ea; --violet:#4b3293;
  --indigo:#3f3793; --midnight:#1f1744; --midnight-deep:#15102e;

  --gradient: linear-gradient(120deg,#806aea 0%,#5a33ea 36%,#3f3793 66%,#60c4d1 132%);
  --gradient-text: linear-gradient(92deg,#5a33ea 0%,#6a3fd6 45%,#31b1c3 100%);

  --bg:#ffffff;
  --surface:#ffffff;
  --surface-alt:#f7f6fd;
  --surface-tint:#f3f1fc;
  --border:#e8e4f7;
  --border-strong:#d7d0ef;
  --text:#2b2547;
  --heading:#3a2a86;
  --muted:#6b6398;
  --link:#5a33ea;
  --link-hover:#4a26d6;
  --primary:#5a33ea;

  --nav-h:4rem;
  --sidebar-w:280px;
  --toc-w:236px;
  --maxw:1480px;
  --radius:14px;

  --font: 'Aspekta','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono: 'JetBrains Mono',ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;

  --shadow-sm: 0 2px 8px -4px rgba(31,23,68,.25);
  --shadow-md: 0 14px 40px -28px rgba(31,23,68,.55);
  --shadow-lg: 0 30px 70px -40px rgba(31,23,68,.6);

  /* code tokens (light) */
  --code-bg:#f6f5fd;
  --tok-comment:#8a82b8; --tok-punct:#6b6398; --tok-key:#6a3fd6;
  --tok-string:#1f9e8f; --tok-num:#c2410c; --tok-fn:#1d7e95; --tok-del:#c5304a;
}

/* ---- Tokens: dark ------------------------------------------------------ */
:root[data-theme='dark'] {
  --bg:#15102e;
  --surface:#241c4d;
  --surface-alt:#1b1540;
  --surface-tint:#211a49;
  --border:rgba(255,255,255,.09);
  --border-strong:rgba(255,255,255,.16);
  --text:#e7e3fb;
  --heading:#f4f2fe;
  --muted:#a79fce;
  --link:#60c4d1;
  --link-hover:#9cdde6;
  --primary:#9a82f2;

  --shadow-sm: 0 2px 8px -4px rgba(0,0,0,.5);
  --shadow-md: 0 16px 44px -28px rgba(0,0,0,.7);
  --shadow-lg: 0 30px 70px -40px rgba(0,0,0,.75);

  --code-bg:#120d28;
  --tok-comment:#6f6796; --tok-punct:#a9a2d4; --tok-key:#c4a6ff;
  --tok-string:#7fe0c4; --tok-num:#ffb86b; --tok-fn:#5fd0de; --tok-del:#ff7a96;
}

/* ---- Reset / base ------------------------------------------------------ */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 1rem); -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body {
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font); font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  font-feature-settings:'cv05' 1,'ss01' 1;
}
a { color:var(--link); text-decoration:none; }
a:hover { color:var(--link-hover); }
img { max-width:100%; }
::selection { background:rgba(96,196,209,.28); }

.skip-link {
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--purple); color:#fff; padding:.6rem 1rem; border-radius:0 0 8px 0;
}
.skip-link:focus { left:0; }

/* ---- Navbar ------------------------------------------------------------ */
.pl-navbar {
  position:sticky; top:0; z-index:100; height:var(--nav-h);
  display:flex; align-items:center; gap:1.5rem;
  padding:0 1.5rem;
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter:saturate(180%) blur(16px); -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--border);
}
.pl-navbar__brand { display:flex; align-items:center; gap:.6rem; flex:0 0 auto; }
.pl-navbar__brand img { height:40px; width:auto; }
.pl-logo-dark { display:none; }
:root[data-theme='dark'] .pl-logo-light { display:none; }
:root[data-theme='dark'] .pl-logo-dark { display:block; }
.pl-navbar__links { display:flex; align-items:center; gap:.35rem; }
.pl-navbar__link {
  color:var(--text); font-weight:500; font-size:.94rem;
  padding:.45rem .7rem; border-radius:8px;
}
.pl-navbar__link:hover { color:var(--primary); background:var(--surface-alt); }
.pl-navbar__link.is-active { color:var(--primary); }
.pl-navbar__spacer { flex:1 1 auto; }
.pl-navbar__actions { display:flex; align-items:center; gap:.5rem; flex:0 0 auto; }

.pl-iconbtn {
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px; cursor:pointer;
  background:transparent; border:1px solid transparent; color:var(--muted);
}
.pl-iconbtn:hover { background:var(--surface-alt); color:var(--primary); border-color:var(--border); }
.pl-iconbtn svg { width:20px; height:20px; }

.pl-search-btn {
  display:inline-flex; align-items:center; gap:.55rem;
  height:38px; padding:0 .7rem 0 .8rem; cursor:pointer;
  background:var(--surface-alt); border:1px solid var(--border);
  border-radius:999px; color:var(--muted); font-size:.86rem; font-family:var(--font);
  min-width:200px;
}
.pl-search-btn:hover { border-color:var(--border-strong); }
.pl-search-btn svg { width:16px; height:16px; }
.pl-search-btn .kbd { margin-left:auto; }
.kbd {
  font-family:var(--mono); font-size:.7rem; color:var(--muted);
  background:var(--surface); border:1px solid var(--border); border-bottom-width:2px;
  border-radius:6px; padding:.08rem .35rem;
}

.pl-cta {
  display:inline-flex; align-items:center; height:38px; padding:0 1.05rem;
  color:#fff; font-weight:600; font-size:.9rem; border-radius:999px;
  background:var(--gradient); box-shadow:0 8px 20px -8px rgba(90,51,234,.65);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.pl-cta:hover { color:#fff; transform:translateY(-1px); filter:brightness(1.06);
  box-shadow:0 12px 26px -8px rgba(90,51,234,.75); }

.pl-hamburger { display:none; }

/* ---- Shell / layout ---------------------------------------------------- */
.pl-shell {
  display:grid; grid-template-columns:var(--sidebar-w) minmax(0,1fr);
  max-width:var(--maxw); margin:0 auto; align-items:start;
}
.pl-sidebar {
  position:sticky; top:var(--nav-h); align-self:start;
  height:calc(100vh - var(--nav-h)); overflow-y:auto;
  border-right:1px solid var(--border);
  padding:1.4rem .85rem 3rem;
}
.pl-main {
  display:grid; grid-template-columns:minmax(0,1fr) var(--toc-w); gap:2.6rem;
  padding:2.2rem 2.6rem 5rem;
}
.pl-article { min-width:0; max-width:54rem; }
.pl-toc {
  position:sticky; top:calc(var(--nav-h) + 1.4rem); align-self:start;
  max-height:calc(100vh - var(--nav-h) - 3rem); overflow:auto;
  font-size:.82rem;
}

/* ---- Sidebar nav ------------------------------------------------------- */
.pl-sidebar__section { margin-bottom:1.35rem; }
.pl-sidebar__label {
  font-size:.72rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); padding:0 .7rem; margin-bottom:.45rem;
}
.pl-sidebar__link {
  display:block; position:relative; color:var(--text); font-size:.9rem;
  padding:.42rem .7rem; border-radius:8px; margin:1px 0;
  transition:background .12s ease, color .12s ease;
}
.pl-sidebar__link:hover { background:var(--surface-alt); color:var(--text); }
.pl-sidebar__link.is-active {
  background:linear-gradient(90deg, rgba(96,196,209,.16), rgba(128,106,234,.14));
  color:var(--heading); font-weight:600;
}
.pl-sidebar__link.is-active::before {
  content:''; position:absolute; left:-.1rem; top:.42rem; bottom:.42rem; width:3px;
  border-radius:3px; background:var(--gradient);
}

/* ---- TOC --------------------------------------------------------------- */
.pl-toc__title {
  font-size:.72rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.6rem;
}
.pl-toc a { display:block; color:var(--muted); padding:.22rem 0 .22rem .8rem;
  border-left:2px solid var(--border); line-height:1.4; }
.pl-toc a:hover { color:var(--text); }
.pl-toc a.is-active { color:var(--primary); border-left-color:var(--primary); font-weight:600; }
.pl-toc a.lvl-3 { padding-left:1.5rem; font-size:.78rem; }

/* ---- Prose / typography ------------------------------------------------ */
.prose { font-size:1rem; }
/* page titles only (direct child) — never the nested hero title */
.prose > h1 { font-size:2.4rem; font-weight:500; line-height:1.12; letter-spacing:-.025em;
  color:var(--heading); margin:.2rem 0 1rem; }
.prose h2 { font-size:1.55rem; font-weight:600; letter-spacing:-.015em; color:var(--heading);
  margin:2.8rem 0 1rem; padding-bottom:.45rem; border-bottom:1px solid var(--border); }
.prose h3 { font-size:1.2rem; font-weight:600; letter-spacing:-.01em; color:var(--heading);
  margin:2rem 0 .7rem; }
.prose h4 { font-size:.82rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); margin:1.6rem 0 .6rem; }
.prose p { margin:.9rem 0; }
.prose ul,.prose ol { margin:.9rem 0; padding-left:1.4rem; }
.prose li { margin:.35rem 0; }
.prose strong { font-weight:600; color:var(--heading); }
.prose a { font-weight:500; text-decoration:none; }
/* Underline-on-hover for inline TEXT links only — never anchor "boxes" (cards, pager,
   buttons), whose own borders must not be overridden by a blanket border-bottom. */
.prose p a, .prose li a, .prose td a, .prose .lead a, .prose blockquote a { border-bottom:1px solid transparent; }
.prose p a:hover, .prose li a:hover, .prose td a:hover, .prose .lead a:hover, .prose blockquote a:hover { border-bottom-color:currentColor; }
.prose hr { border:none; border-top:1px solid var(--border); margin:2.4rem 0; }
.prose blockquote { margin:1.2rem 0; padding:.4rem 1.1rem; border-left:3px solid var(--lilac);
  color:var(--muted); }
.prose .lead { font-size:1.16rem; line-height:1.6; color:var(--muted); margin:.4rem 0 1.4rem; }

.anchor { color:var(--muted); opacity:0; margin-left:.4rem; font-weight:400; text-decoration:none; }
.prose h2:hover .anchor,.prose h3:hover .anchor { opacity:1; }

.eyebrow {
  display:inline-block; font-size:.74rem; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--purple); margin-bottom:.5rem;
}
:root[data-theme='dark'] .eyebrow { color:var(--cyan); }

/* breadcrumbs */
.pl-breadcrumbs { font-size:.82rem; color:var(--muted); margin-bottom:1rem; }
.pl-breadcrumbs a { color:var(--muted); }
.pl-breadcrumbs a:hover { color:var(--primary); }
.pl-breadcrumbs span { margin:0 .35rem; opacity:.6; }

/* ---- Inline code + code blocks ----------------------------------------- */
code { font-family:var(--mono); font-size:.85em; }
:not(pre) > code {
  background:var(--surface-alt); border:1px solid var(--border); border-radius:6px;
  padding:.12rem .36rem; color:var(--heading);
}
.pl-code {
  position:relative; margin:1.3rem 0; border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; background:var(--code-bg);
  box-shadow:var(--shadow-md);
}
.pl-code__title {
  display:flex; align-items:center; gap:.5rem;
  padding:.5rem .9rem; font-family:var(--mono); font-size:.76rem; color:var(--muted);
  background:var(--surface-alt); border-bottom:1px solid var(--border);
}
.pl-code pre { margin:0; padding:1rem 1.1rem; overflow:auto; font-size:.84rem; line-height:1.6; }
.pl-code pre code { font-size:inherit; background:none; border:none; padding:0; }
.pl-copy {
  position:absolute; top:.5rem; right:.5rem; z-index:2;
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.72rem; font-weight:600; font-family:var(--font); cursor:pointer;
  color:var(--muted); background:color-mix(in srgb,var(--surface) 80%,transparent);
  border:1px solid var(--border); border-radius:8px; padding:.28rem .5rem;
  opacity:0; transition:opacity .15s ease, color .15s ease, border-color .15s ease;
}
.pl-code:hover .pl-copy,.pl-copy:focus-visible { opacity:1; }
.pl-copy:hover { color:var(--primary); border-color:var(--border-strong); }
.pl-copy.is-done { color:var(--cyan-strong); border-color:var(--cyan); }
.pl-code__title + .pl-copy { top:2.6rem; }

/* Prism tokens */
.token.comment,.token.prolog,.token.cdata { color:var(--tok-comment); font-style:italic; }
.token.punctuation { color:var(--tok-punct); }
.token.keyword,.token.operator,.token.atrule,.token.rule,.token.important { color:var(--tok-key); }
.token.string,.token.attr-value,.token.char,.token.inserted,.token.regex { color:var(--tok-string); }
.token.number,.token.boolean,.token.constant,.token.symbol { color:var(--tok-num); }
.token.property,.token.tag,.token.function,.token.class-name,.token.attr-name,.token.selector,.token.builtin { color:var(--tok-fn); }
.token.deleted { color:var(--tok-del); }
.token.bold { font-weight:700; } .token.italic { font-style:italic; }

/* ---- Tables ------------------------------------------------------------ */
.prose table {
  width:100%; border-collapse:separate; border-spacing:0; margin:1.4rem 0;
  border:1px solid var(--border); border-radius:12px; overflow:hidden; font-size:.92rem;
}
.prose thead { background:var(--surface-alt); }
.prose th { text-align:left; font-weight:600; color:var(--heading);
  padding:.7rem .9rem; border-bottom:1px solid var(--border); }
.prose td { padding:.7rem .9rem; border-bottom:1px solid var(--border); vertical-align:top; }
.prose tbody tr:last-child td { border-bottom:none; }
.prose tbody tr:nth-child(even) { background:var(--surface-alt); }
.pl-table-wrap { overflow-x:auto; }

/* ---- Method badge ------------------------------------------------------ */
.method {
  display:inline-flex; align-items:center; font-family:var(--mono); font-size:.72rem;
  font-weight:700; letter-spacing:.05em; line-height:1; padding:.28rem .55rem;
  border-radius:7px; border:1px solid transparent; text-transform:uppercase; white-space:nowrap;
}
.method--get { color:#0e7a88; background:rgba(96,196,209,.16); border-color:rgba(96,196,209,.4); }
.method--post { color:#5226c9; background:rgba(128,106,234,.16); border-color:rgba(128,106,234,.4); }
.method--put { color:#b06a00; background:rgba(217,138,0,.15); border-color:rgba(217,138,0,.4); }
.method--patch { color:#3f3793; background:rgba(63,55,147,.14); border-color:rgba(63,55,147,.4); }
.method--delete { color:#c5304a; background:rgba(210,57,79,.14); border-color:rgba(210,57,79,.4); }
:root[data-theme='dark'] .method--get { color:#8fe6f0; }
:root[data-theme='dark'] .method--post { color:#c4b0ff; background:rgba(128,106,234,.2); }
:root[data-theme='dark'] .method--put { color:#ffce8a; }
:root[data-theme='dark'] .method--patch { color:#b9b2ee; }
:root[data-theme='dark'] .method--delete { color:#ff90a6; }

/* ---- Endpoint card ----------------------------------------------------- */
.endpoint {
  margin:1.25rem 0 1.75rem; border:1px solid var(--border); border-radius:var(--radius);
  background:var(--surface); overflow:hidden; box-shadow:var(--shadow-md);
}
.endpoint__main { display:flex; align-items:center; gap:.7rem; padding:.8rem .9rem; background:var(--surface-alt); }
.endpoint__path { flex:1 1 auto; min-width:0; font-family:var(--mono); font-size:.9rem;
  font-weight:600; color:var(--heading); overflow-x:auto; white-space:nowrap; }
.endpoint__envs { display:flex; flex-direction:column; }
.endpoint__env { display:flex; align-items:center; gap:.7rem; padding:.6rem .9rem; border-top:1px solid var(--border); }
.env-label { flex:0 0 auto; font-size:.64rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; padding:.18rem .5rem; border-radius:6px; }
.env-label--sandbox { color:#0e7a88; background:rgba(96,196,209,.16); }
.env-label--prod { color:#5226c9; background:rgba(128,106,234,.16); }
:root[data-theme='dark'] .env-label--sandbox { color:#8fe6f0; }
:root[data-theme='dark'] .env-label--prod { color:#c4b0ff; }
.endpoint__url { flex:1 1 auto; min-width:0; font-family:var(--mono); font-size:.78rem;
  color:var(--muted); overflow-x:auto; white-space:nowrap; }
.copy-pill {
  flex:0 0 auto; font-size:.72rem; font-weight:600; font-family:var(--font); cursor:pointer;
  color:var(--muted); background:var(--surface); border:1px solid var(--border);
  border-radius:999px; padding:.26rem .65rem;
}
.copy-pill:hover { color:var(--primary); border-color:var(--border-strong); }
.copy-pill.is-done { color:var(--cyan-strong); border-color:var(--cyan); }

/* ---- Parameters -------------------------------------------------------- */
.params { margin:1.25rem 0 1.75rem; border:1px solid var(--border); border-radius:var(--radius);
  background:var(--surface); overflow:hidden; }
.params__title { font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); padding:.75rem 1rem; background:var(--surface-alt); border-bottom:1px solid var(--border); }
.param { padding:.85rem 1rem; border-bottom:1px solid var(--border); }
.param:last-child { border-bottom:none; }
.param__head { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem; }
.param__name { font-family:var(--mono); font-size:.86rem; font-weight:700; color:var(--heading); }
.param__type { font-family:var(--mono); font-size:.74rem; color:var(--muted); }
.param__req { font-size:.62rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:#b34357; background:rgba(210,57,79,.12); padding:.14rem .45rem; border-radius:5px; }
:root[data-theme='dark'] .param__req { color:#ff90a6; background:rgba(210,57,79,.18); }
.param__opt { font-size:.62rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--muted); background:var(--surface-alt); border:1px solid var(--border); padding:.13rem .45rem; border-radius:5px; }
.param__body { margin-top:.4rem; color:var(--muted); font-size:.9rem; line-height:1.55; }
.param__body code { font-size:.82em; }

/* ---- Cards ------------------------------------------------------------- */
.cards { display:grid; gap:1rem; margin:1.5rem 0; grid-template-columns:repeat(2,minmax(0,1fr)); }
.cards--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.card { position:relative; display:block; padding:1.3rem 1.35rem; border:1px solid var(--border);
  border-radius:16px; background:var(--surface); color:inherit; overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.card::after { content:''; position:absolute; inset:0 0 auto 0; height:3px; background:var(--gradient);
  opacity:0; transition:opacity .18s ease; }
a.card:hover { transform:translateY(-3px); border-color:transparent; box-shadow:0 22px 48px -28px rgba(90,51,234,.55); }
a.card:hover::after { opacity:1; }
.card__icon { display:inline-flex; align-items:center; justify-content:center; width:2.5rem; height:2.5rem;
  font-size:1.3rem; border-radius:12px; margin-bottom:.85rem;
  background:linear-gradient(135deg, rgba(128,106,234,.16), rgba(96,196,209,.16)); border:1px solid var(--border); }
.card__title { font-size:1.06rem; font-weight:600; color:var(--heading); margin-bottom:.35rem; }
.card__body { font-size:.91rem; line-height:1.55; color:var(--muted); }
.card__arrow { display:inline-block; margin-top:.75rem; font-size:1.05rem; color:var(--primary);
  transition:transform .18s ease; }
a.card:hover .card__arrow { transform:translateX(5px); }

/* ---- Stats ------------------------------------------------------------- */
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1px;
  margin:1.5rem 0; border:1px solid var(--border); border-radius:16px; background:var(--border); overflow:hidden; }
.stat { padding:1.15rem 1.25rem; background:var(--surface); }
.stat__value { font-size:1.7rem; font-weight:600; letter-spacing:-.02em; line-height:1.1;
  background:var(--gradient-text); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent; }
.stat__label { margin-top:.35rem; font-size:.78rem; font-weight:500; color:var(--muted); }

/* ---- Admonitions ------------------------------------------------------- */
.admonition { margin:1.4rem 0; border:1px solid var(--border); border-left-width:3px;
  border-radius:12px; padding:.9rem 1.1rem; background:var(--surface); box-shadow:var(--shadow-sm); }
.admonition__title { display:flex; align-items:center; gap:.5rem; font-weight:700; font-size:.82rem;
  letter-spacing:.02em; text-transform:uppercase; margin-bottom:.4rem; }
.admonition__title svg { width:18px; height:18px; }
.admonition p:first-child { margin-top:0; } .admonition p:last-child { margin-bottom:0; }
.admonition--tip { border-left-color:var(--cyan-strong); }
.admonition--tip .admonition__title { color:var(--cyan-strong); }
.admonition--info { border-left-color:var(--purple); }
.admonition--info .admonition__title { color:var(--purple); }
.admonition--warning { border-left-color:#d98a00; }
.admonition--warning .admonition__title { color:#b06a00; }
.admonition--danger { border-left-color:#d2394f; }
.admonition--danger .admonition__title { color:#c5304a; }
.admonition--note { border-left-color:var(--muted); }
.admonition--note .admonition__title { color:var(--muted); }
:root[data-theme='dark'] .admonition--info .admonition__title { color:var(--lilac); }
:root[data-theme='dark'] .admonition--warning .admonition__title { color:#ffce8a; }
:root[data-theme='dark'] .admonition--danger .admonition__title { color:#ff90a6; }

/* ---- Tabs (code language switch) -------------------------------------- */
.tabs { margin:1.3rem 0; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.tabs__list { display:flex; gap:.2rem; padding:.4rem .5rem 0; background:var(--surface-alt);
  border-bottom:1px solid var(--border); overflow-x:auto; }
.tabs__btn { font-family:var(--font); font-size:.82rem; font-weight:600; cursor:pointer;
  color:var(--muted); background:transparent; border:none; border-bottom:2px solid transparent;
  padding:.5rem .8rem; white-space:nowrap; }
.tabs__btn:hover { color:var(--text); }
.tabs__btn.is-active { color:var(--primary); border-bottom-color:var(--primary); }
.tabs__panel { display:none; } .tabs__panel.is-active { display:block; }
.tabs .pl-code { margin:0; border:none; border-radius:0; box-shadow:none; }

/* ---- Hero -------------------------------------------------------------- */
.hero { position:relative; margin:0 0 2.5rem; padding:3.4rem 2.6rem 3.2rem;
  border-radius:28px; overflow:hidden; isolation:isolate;
  background:radial-gradient(120% 140% at 100% 0%, rgba(96,196,209,.12), transparent 55%),
             linear-gradient(160deg,#2a1f5b 0%,#1f1744 55%,#15102e 100%);
  border:1px solid rgba(255,255,255,.08); box-shadow:var(--shadow-lg); }
.hero__glow { position:absolute; z-index:-1; width:60%; aspect-ratio:1; top:-22%; right:-8%;
  background:conic-gradient(from 120deg,#806aea,#5a33ea,#60c4d1,#806aea);
  filter:blur(70px); opacity:.55; border-radius:50%; animation:pl-drift 16s ease-in-out infinite alternate; }
.hero__grid { position:absolute; inset:0; z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0%,#000 35%,transparent 80%);
  mask-image:radial-gradient(120% 100% at 50% 0%,#000 35%,transparent 80%); }
@keyframes pl-drift { from{ transform:translate(0,0) scale(1);} to{ transform:translate(-8%,10%) scale(1.12);} }
@media (prefers-reduced-motion: reduce){ .hero__glow{ animation:none; } }
.hero__inner { position:relative; max-width:42rem; }
.hero__eyebrow { display:inline-flex; align-items:center; gap:.5rem; font-size:.74rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:#b9f0f6; background:rgba(96,196,209,.12);
  border:1px solid rgba(96,196,209,.3); padding:.3rem .7rem; border-radius:999px; margin-bottom:1.1rem; }
.hero__title { font-size:clamp(2.2rem,4.8vw,3.4rem); font-weight:200; line-height:1.06;
  letter-spacing:-.025em; color:#fff; margin:0 0 1rem; }
.hero__subtitle { font-size:clamp(1rem,1.6vw,1.18rem); line-height:1.6; color:#cdc6ef;
  margin:0 0 1.8rem; max-width:36rem; }
.hero__ctas { display:flex; flex-wrap:wrap; gap:.8rem; }
.hero__btn { display:inline-flex; align-items:center; font-weight:600; font-size:.96rem;
  padding:.7rem 1.4rem; border-radius:999px;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease; }
.hero__btn--primary { color:#1f1744; background:linear-gradient(120deg,#9cdde6,#60c4d1);
  box-shadow:0 12px 30px -12px rgba(96,196,209,.7); }
.hero__btn--primary:hover { color:#1f1744; transform:translateY(-2px); box-shadow:0 18px 38px -14px rgba(96,196,209,.85); }
.hero__btn--ghost { color:#fff; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.22); }
.hero__btn--ghost:hover { color:#fff; transform:translateY(-2px); border-color:rgba(255,255,255,.45); background:rgba(255,255,255,.12); }

/* ---- Footer ------------------------------------------------------------ */
.pl-footer { background:var(--midnight-deep); color:#cbc4ec; border-top:1px solid rgba(255,255,255,.06);
  padding:3rem 1.5rem 2.5rem; }
.pl-footer__inner { max-width:var(--maxw); margin:0 auto; display:grid;
  grid-template-columns:1.4fr repeat(3,1fr); gap:2rem; }
.pl-footer__brand img { height:44px; }

/* ---------------------------------------------------------- Release notes */
.pl-rn-legend { display:flex; flex-wrap:wrap; gap:.5rem; margin:1.1rem 0 1.6rem; }
.pl-rn-filter { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.6rem; }
.pl-rn-chip { font-size:.82rem; font-weight:600; color:var(--muted); background:var(--surface-alt);
  border:1px solid var(--border); border-radius:999px; padding:.34rem .85rem; cursor:pointer;
  transition:color .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease; }
.pl-rn-chip:hover { color:var(--text); border-color:var(--lilac); }
.pl-rn-chip.is-active { color:#fff; background:var(--gradient); border-color:transparent;
  box-shadow:0 8px 20px -10px rgba(90,51,234,.55); }
.pl-release { position:relative; border:1px solid var(--border); border-radius:16px; background:var(--surface);
  padding:1.2rem 1.35rem; margin:0 0 1.05rem; box-shadow:var(--shadow-md); }
.pl-release__head { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem; margin-bottom:.55rem; }
.pl-release__product { font-size:.68rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  padding:.24rem .6rem; border-radius:7px; color:var(--violet); background:rgba(128,106,234,.14);
  border:1px solid rgba(128,106,234,.3); }
.pl-release__product--api { color:#5226c9; background:rgba(90,51,234,.14); border-color:rgba(90,51,234,.32); }
[data-theme='dark'] .pl-release__product { color:#c4b0ff; }
.pl-release__ver { font-family:var(--mono); font-size:1.12rem; font-weight:700; color:var(--heading); text-decoration:none; }
.pl-release__ver:hover { color:var(--primary); }
.pl-release__date { font-size:.82rem; color:var(--muted); }
.pl-release__dl { margin-left:auto; font-size:.8rem; font-weight:600; color:#fff !important; background:var(--gradient);
  border-radius:999px; padding:.42rem .9rem; text-decoration:none; box-shadow:0 8px 20px -10px rgba(90,51,234,.55);
  transition:filter .14s ease,transform .14s ease; }
.pl-release__dl:hover { filter:brightness(1.06); transform:translateY(-1px); }
.pl-release__summary { color:var(--text); margin:.1rem 0 .85rem; }
.pl-release__changes { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.55rem; }
.pl-release__changes li { display:flex; gap:.7rem; align-items:flex-start; }
.pl-change__text { color:var(--text); line-height:1.55; }
.pl-tag { flex:0 0 auto; font-size:.62rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:.24rem .5rem; border-radius:6px; min-width:78px; text-align:center; }
.pl-tag--added { color:#0e7a88; background:rgba(96,196,209,.18); }
.pl-tag--changed { color:#5226c9; background:rgba(128,106,234,.16); }
.pl-tag--fixed { color:#b06a00; background:rgba(217,138,0,.16); }
.pl-tag--deprecated { color:#6b6398; background:rgba(107,99,152,.16); }
.pl-tag--removed { color:#b34357; background:rgba(210,57,79,.14); }
.pl-tag--security { color:#c5304a; background:rgba(210,57,79,.18); }
[data-theme='dark'] .pl-tag--changed { color:#c4b0ff; }
[data-theme='dark'] .pl-tag--added { color:#8fe6f0; }
[data-theme='dark'] .pl-tag--fixed { color:#ffce8a; }
[data-theme='dark'] .pl-tag--deprecated { color:#a79fce; }
[data-theme='dark'] .pl-tag--removed,[data-theme='dark'] .pl-tag--security { color:#ff90a6; }
@media (max-width:540px){ .pl-release__dl{ margin-left:0; } .pl-release__changes li{ flex-direction:column; gap:.3rem; } .pl-tag{ min-width:0; } }

/* ---------------------------------------------------- Plugin download card */
.pl-download { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  margin:1.4rem 0 1.8rem; padding:1.1rem 1.3rem; border:1px solid var(--border); border-radius:16px;
  background:linear-gradient(120deg, rgba(128,106,234,.08), rgba(96,196,209,.08)); box-shadow:var(--shadow-md); }
.pl-download__info { display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; }
.pl-download__os { font-weight:700; color:var(--heading); font-size:1.02rem; }
.pl-download__ver { font-family:var(--mono); font-size:.8rem; font-weight:700; color:var(--violet);
  background:rgba(128,106,234,.14); border:1px solid rgba(128,106,234,.3); border-radius:6px; padding:.16rem .5rem; }
[data-theme='dark'] .pl-download__ver { color:#c4b0ff; }
.pl-download__size { font-size:.82rem; color:var(--muted); }
.pl-download__act { display:flex; align-items:center; gap:1rem; }
.pl-download__btn { font-size:.92rem; font-weight:600; color:#fff !important; background:var(--gradient);
  border-radius:999px; padding:.6rem 1.3rem; text-decoration:none; white-space:nowrap;
  box-shadow:0 10px 24px -10px rgba(90,51,234,.6); transition:filter .14s ease, transform .14s ease; }
.pl-download__btn:hover { filter:brightness(1.06); transform:translateY(-1px); }
.pl-download__rn { font-size:.86rem; font-weight:600; color:var(--link); text-decoration:none; white-space:nowrap; }
.pl-download__rn:hover { text-decoration:underline; }
@media (max-width:560px){ .pl-download{ flex-direction:column; align-items:flex-start; } .pl-download__act{ width:100%; }
  .pl-download__btn{ flex:1; text-align:center; } }

/* ---- Plugin guide: screenshots + version download list ----------------- */
.pl-figure { margin:1.5rem 0; }
.pl-figure img { display:block; max-width:100%; height:auto; border:1px solid var(--border);
  border-radius:12px; box-shadow:var(--shadow-md); background:var(--surface); }
.pl-figure figcaption { margin-top:.6rem; font-size:.85rem; color:var(--muted); text-align:center; }

.pl-dl { margin:1.25rem 0 1.9rem; border:1px solid var(--border); border-radius:14px; overflow:hidden;
  background:var(--surface); }
.pl-dl__row { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; padding:.85rem 1.1rem;
  border-bottom:1px solid var(--border); }
.pl-dl__row:last-child { border-bottom:none; }
.pl-dl__row:nth-child(even) { background:var(--surface-alt); }
.pl-dl__ver { font-family:var(--mono); font-weight:700; color:var(--heading); flex:0 0 auto; min-width:3.2rem; }
.pl-dl__notes { flex:1 1 220px; min-width:0; font-size:.9rem; color:var(--muted); }
.pl-dl__act { display:flex; align-items:center; gap:.9rem; flex:0 0 auto; margin-left:auto; }
.pl-dl__rn { font-size:.84rem; font-weight:600; color:var(--link); text-decoration:none; white-space:nowrap; }
.pl-dl__rn:hover { text-decoration:underline; }
.pl-dl__btn { font-size:.82rem; font-weight:600; color:#fff !important; background:var(--gradient);
  border-radius:999px; padding:.42rem .95rem; text-decoration:none; white-space:nowrap;
  box-shadow:0 8px 20px -10px rgba(90,51,234,.55); transition:filter .14s ease, transform .14s ease; }
.pl-dl__btn:hover { filter:brightness(1.06); transform:translateY(-1px); }
@media (max-width:560px){ .pl-dl__act{ width:100%; margin-left:0; } }
.pl-footer__tag { margin-top:.9rem; font-size:.9rem; color:#9d95c9; max-width:22rem; }
.pl-footer__col h4 { font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; margin:0 0 .8rem; }
.pl-footer__col a { display:block; color:#cbc4ec; font-size:.9rem; padding:.22rem 0; }
.pl-footer__col a:hover { color:var(--cyan); }
.pl-footer__bottom { max-width:var(--maxw); margin:2.2rem auto 0; padding-top:1.4rem;
  border-top:1px solid rgba(255,255,255,.08); font-size:.84rem; color:#9d95c9; }

/* ---- Pager (prev/next) ------------------------------------------------- */
.pl-pager { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:3rem; }
.pl-pager a { display:block; padding:1rem 1.2rem; border:1px solid var(--border); border-radius:14px;
  transition:border-color .15s ease, transform .15s ease; }
.pl-pager a:hover { border-color:var(--lilac); transform:translateY(-2px); }
.pl-pager .dir { font-size:.74rem; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.pl-pager .ttl { font-weight:600; color:var(--heading); margin-top:.2rem; }
.pl-pager .next { text-align:right; }

/* ---- Search modal ------------------------------------------------------ */
.pl-search-modal[hidden] { display:none; }
.pl-search-modal { position:fixed; inset:0; z-index:300; display:flex; align-items:flex-start;
  justify-content:center; padding-top:12vh;
  background:rgba(21,16,46,.55); backdrop-filter:blur(4px); }
.pl-search__box { width:min(620px,92vw); background:var(--bg); border:1px solid var(--border);
  border-radius:16px; box-shadow:var(--shadow-lg); overflow:hidden; }
.pl-search__input-wrap { display:flex; align-items:center; gap:.6rem; padding:.9rem 1.1rem; border-bottom:1px solid var(--border); }
.pl-search__input-wrap svg { width:20px; height:20px; color:var(--muted); flex:0 0 auto; }
.pl-search__input { flex:1; border:none; outline:none; background:transparent; color:var(--text);
  font-family:var(--font); font-size:1.05rem; }
.pl-search__results { max-height:54vh; overflow:auto; padding:.5rem; }
.pl-search__result { display:block; padding:.6rem .75rem; border-radius:10px; color:var(--text); }
.pl-search__result .sec { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.pl-search__result .ttl { font-weight:600; }
.pl-search__result .snip { font-size:.84rem; color:var(--muted); margin-top:.1rem; }
.pl-search__result.is-active,.pl-search__result:hover { background:var(--surface-alt); }
.pl-search__empty { padding:1.4rem; text-align:center; color:var(--muted); }
.pl-search__foot { display:flex; gap:1rem; padding:.6rem 1.1rem; border-top:1px solid var(--border);
  font-size:.74rem; color:var(--muted); }

/* ---- Mobile ------------------------------------------------------------ */
.pl-overlay { display:none; }
@media (max-width:1200px){
  .pl-main { grid-template-columns:minmax(0,1fr); }
  .pl-toc { display:none; }
}
@media (max-width:996px){
  .pl-shell { grid-template-columns:minmax(0,1fr); }
  .pl-sidebar { position:fixed; top:var(--nav-h); left:0; z-index:90; width:300px; max-width:86vw;
    background:var(--bg); transform:translateX(-104%); transition:transform .22s ease; box-shadow:var(--shadow-lg); }
  body.pl-nav-open .pl-sidebar { transform:translateX(0); }
  .pl-overlay { position:fixed; inset:var(--nav-h) 0 0; z-index:80; background:rgba(21,16,46,.5); }
  body.pl-nav-open .pl-overlay { display:block; }
  .pl-hamburger { display:inline-flex; }
  .pl-navbar__links { display:none; }
  .pl-search-btn { min-width:0; width:38px; padding:0; justify-content:center; }
  .pl-search-btn .label,.pl-search-btn .kbd { display:none; }
  .pl-main { padding:1.6rem 1.2rem 4rem; }
  .pl-footer__inner { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .cards,.cards--3 { grid-template-columns:1fr; }
  .pl-cta .label { display:none; }
  .hero { padding:2.4rem 1.4rem; }
  .pl-footer__inner { grid-template-columns:1fr; }
  .pl-pager { grid-template-columns:1fr; }
  .prose h1 { font-size:2rem; }
}

/* ---- Landing variant --------------------------------------------------- */
body.pl-page-landing .pl-main { grid-template-columns:minmax(0,1fr); }
body.pl-page-landing .pl-toc { display:none; }
body.pl-page-landing .pl-article { max-width:72rem; margin:0 auto; }