:root{
  --bg:#ffffff;
  --surface:#f6f7f8;
  --text:#0f172a;
  --muted:#475569;
  --border:#e5e7eb;
  --link:#0b57d0;
  --link-hover:#0842a0;
  --badge-bg:#f1f5f9;
  --badge-text:#334155;
  --code-bg:#f8fafc;
  --code-border:#e2e8f0;
  --font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  --text-base:16px;
  --text-sm:14px;
  --text-lg:18px;
  --lh:1.7;
  --lh-tight:1.25;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --radius-sm:8px;
  --radius-md:12px;
  --content-max:820px;
  --content-pad:20px;
  --header-h:60px;
}

/* SYS-A typography */
h1, h2, h3, .pm-page-title{
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.px-content{max-width:var(--content-max);margin:0 auto;padding:0 var(--content-pad);}
.px-body{background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--lh);}
.px-muted{color:var(--muted);}
.px-divider{border-top:1px solid var(--border);}
.px-badge{display:inline-block;font-size:var(--text-sm);padding:2px 10px;border:1px solid var(--border);border-radius:999px;background:var(--badge-bg);color:var(--badge-text);}
.px-link{color:var(--link);text-decoration:underline;text-underline-offset:3px;}
.px-link:hover{color:var(--link-hover);}
.px-code{font-family:var(--font-mono);background:var(--code-bg);border:1px solid var(--code-border);border-radius:var(--radius-sm);padding:var(--space-3);overflow:auto;}
/* SYS-A v1.7.1: system-ui headings + brand padding (desktop) */
h1, h2, h3, .pm-brand, .pm-page-title{
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
@media (min-width: 960px){
  }


/* SYS-A classic nav behavior (v1.7.1j) */
.pm-nav { display:none !important; flex-direction:column; gap:var(--space-3); }
.pm-nav.is-open { display:flex !important; }
.pm-nav-toggle { display:inline-flex; align-items:center; justify-content:center; }

@media (min-width: 960px) {
  .pm-header-inner { padding-top: calc(var(--space-3) * 0.9); }
  .pm-nav { display:flex !important; flex-direction:row; }
  .pm-nav-toggle { display:none !important; }
  .pm-brand { padding-top: 6px; display:inline-block; }
}

.px-content{
  font-size:16px;
  line-height:1.55;
}
.px-content h2{
  font-size:22px;
  font-weight:400;
  margin:32px 0 16px;
}
.px-content h3{
  font-size:18px;
  font-weight:500;
  margin:24px 0 12px;
}
.px-content p{
  margin:0 0 16px;
}
.px-content ul,
.px-content ol{
  margin:0 0 16px;
  padding-left:1.1rem !important;
  list-style-position:inside;
}
.px-content li{
  margin:0 0 12px;
  padding-left:0;
}

@media (min-width: 960px) {
  .pm-header-inner { padding-top: calc(var(--space-3) * 0.9); }
  .pm-header-inner { padding-bottom: 24px !important;padding-top: 16px !important; }
  .pm-toprow { padding-bottom: 12px !important; } 
  .pm-nav { display:flex !important; flex-direction:row; }
  .pm-nav-toggle { display:none !important; }
  .pm-brand { height:20px !important; padding-top: 6px; display:inline-block; }
   h2 { font-weight:500 !important; }
  a.px-link { font-size: 15px !important; }
}

/* Sticky header (site-wide) */
.pm-header{
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--bg-white, #ffffff);
}
.pm-brand img { height: 24px !important; display:block;}
.px-content ul, .px-content ol { list-style-position: outside; padding-left: 0.9rem; }
h2 { font-weight:500 !important; }

.pm-nav-toggle {  
	border: 1px solid var(--border) !important;
    background: var(--surface) !important;
    color: var(--text) !important;
    border-radius: 8px !important;
    padding: 6px 10px 9px 10px !important;
    font-size: 1.4rem !important;
    line-height: 1 !important;
	min-width: 44px !important;
	min-height: 44px !important;
}

.pm-nav { padding-bottom: 16px; }

.px-link { font-size: 16px !important; }

/* Always show vertical scrollbar, prevent horizontal */
html {
  overflow-y: scroll;   /* or: overflow-y: auto; overflow-x: hidden; */
  overflow-x: hidden;
}


