/* Read pages in the pcdev world: legal pages, guides and command references.
   Loaded after pcd-world.css. A comfortable measure, ruled sections, clear headings.
   The same file ships in astro-panel and pcdev-panel; keep the copies identical. */

.doc{padding-top:clamp(48px,8vw,96px);padding-bottom:clamp(72px,10vw,128px)}
.doc h1{font-size:clamp(2.75rem,6vw,5rem);line-height:.98;letter-spacing:-.04em;font-weight:700;max-width:16ch}
.doc .updated{margin-top:18px;font:500 0.8125rem/1.4 var(--mono);color:var(--ink-3);letter-spacing:.02em}
.doc .lede{margin-top:22px;max-width:60ch;color:var(--ink-2);font-size:clamp(1.0625rem,1.3vw,1.1875rem);line-height:1.6}
.doc-body{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:clamp(24px,5vw,72px);margin-top:clamp(40px,6vw,72px);
  border-top:1px solid var(--rule);align-items:start}
.toc{position:sticky;top:82px;display:grid;padding-top:22px}
.toc a{display:block;padding:7px 0;font-size:0.875rem;color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--rule-3);transition:color .2s var(--w-ease),border-color .2s var(--w-ease),opacity .2s var(--w-ease)}
.toc a:hover,.toc a.on,.toc a[aria-current]{color:var(--ink)}
.toc a[aria-current]{border-bottom-color:var(--ink-3)}
.toc a:active{opacity:.6;transition-duration:var(--w-press)}
.prose{max-width:70ch;color:var(--ink-2);font-size:1.03125rem;line-height:1.7}
.prose h2{color:var(--ink);font-size:clamp(1.375rem,2vw,1.625rem);line-height:1.15;letter-spacing:-.035em;font-weight:700;
  padding-top:28px;margin-top:40px;border-top:1px solid var(--rule-2);scroll-margin-top:80px}
.prose h2:first-child{margin-top:0;border-top:0}
.prose h3{color:var(--ink);font-size:1.125rem;line-height:1.3;letter-spacing:-.02em;font-weight:600;margin-top:26px}
.prose p,.prose ul,.prose ol,.prose table{margin-top:14px}
.prose ul,.prose ol{padding-left:0;list-style:none;display:grid;gap:8px}
.prose ul li{padding-left:18px;position:relative}
.prose ul li::before{content:"";position:absolute;left:0;top:.85em;width:8px;height:1px;background:var(--ink-3)}
.prose ol{counter-reset:n}
.prose ol li{padding-left:28px;position:relative;counter-increment:n}
.prose ol li::before{content:counter(n);position:absolute;left:0;font:500 0.8125rem/1.9 var(--mono);color:var(--ink-3)}
.prose strong,.prose b{color:var(--ink);font-weight:600}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(255,255,255,.3)}
.prose a:hover{text-decoration-color:var(--ink)}
.prose code{font:500 .88em var(--mono);color:var(--ink)}
.prose table{width:100%;border-collapse:collapse;font-size:0.9375rem;border-top:1px solid var(--rule)}
.prose th{text-align:left;font-weight:500;font-size:0.8125rem;letter-spacing:.01em;color:var(--ink-3);padding:10px 12px 10px 0;border-bottom:1px solid var(--rule)}
.prose td{padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-2);vertical-align:top}
.prose blockquote{margin-top:14px;padding-left:16px;border-left:1px solid var(--rule)}
@media (max-width:860px){
  .doc-body{grid-template-columns:1fr;border-top:0}
  .toc{position:static;padding-top:0;border-top:1px solid var(--rule);grid-template-columns:1fr 1fr;column-gap:20px}
  .prose{border-top:1px solid var(--rule);padding-top:8px}
}

/* ---------------------------------------------------------------- command reference */
.ref{padding-top:clamp(48px,8vw,96px);padding-bottom:clamp(48px,8vw,96px)}
.ref h1{font-size:clamp(2.75rem,6vw,5rem);line-height:.98;letter-spacing:-.04em;font-weight:700}
.ref .lede{margin-top:22px;max-width:62ch;color:var(--ink-2);font-size:clamp(1rem,1.25vw,1.125rem);line-height:1.65}
.ref .lede code{font:500 .9em var(--mono);color:var(--ink)}
.ref .search{position:relative;margin-top:36px;max-width:640px}
.ref .search input{width:100%;height:52px;background:var(--bg-2);border:1px solid var(--rule);border-radius:2px;color:var(--ink);
  font:1rem var(--sans);padding:0 16px 0 46px;transition:border-color .2s var(--w-ease)}
.ref .search input:focus{outline:none;border-color:var(--ink)}
.ref .search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink-3);pointer-events:none}
.ref .count{margin-top:12px;font:500 0.8125rem/1.4 var(--mono);color:var(--ink-3)}
.ref .jump{display:flex;flex-wrap:wrap;gap:4px 20px;margin-top:28px;padding:16px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.ref .jump a{font-size:0.875rem;color:var(--ink-2);text-decoration:none;padding:4px 0;transition:color .2s var(--w-ease),opacity .2s var(--w-ease)}
.ref .jump a:hover,.ref .jump a[aria-current]{color:var(--ink)}
.ref .jump a[aria-current]{text-decoration:underline;text-underline-offset:.4em}
.ref .jump a:active{opacity:.6;transition-duration:var(--w-press)}
.ref section{margin-top:clamp(48px,6vw,72px);scroll-margin-top:76px}
.ref h2{display:flex;align-items:baseline;gap:12px;font-size:clamp(1.625rem,2.8vw,2.25rem);letter-spacing:-.035em;line-height:1.05;font-weight:700;
  padding-bottom:16px;border-bottom:1px solid var(--rule)}
.ref h2 svg{display:none}
.ref h2 .n{font:500 0.8125rem var(--mono);color:var(--ink-3);letter-spacing:0;margin-left:auto}
.ref .grid{display:block}
.ref .cmd{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:6px clamp(16px,3vw,40px);padding:14px 0;border-bottom:1px solid var(--rule-2);
  align-items:baseline;transition:background-color .2s var(--w-ease)}
.ref .cmd:hover{background:rgba(255,255,255,.018)}
.ref .ct{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.ref .ct code{font:500 0.9375rem var(--mono);color:var(--ink)}
.ref .args{font:0.8125rem var(--mono);color:var(--ink-2)}
.ref .al{flex-basis:100%;font-size:0.8125rem;letter-spacing:.01em;color:var(--ink-3)}
.ref .al::before{content:"also "}
.ref .cmd p{color:var(--ink-2);font-size:0.9375rem}
.ref .none{display:none;padding:32px 0;color:var(--ink-2)}
.ref .band{margin-top:clamp(64px,8vw,104px);padding:clamp(40px,6vw,72px) 0 0;border-top:1px solid var(--rule);
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:24px clamp(24px,4vw,56px);align-items:end}
.ref .band h3{font-size:clamp(2rem,4.2vw,3.5rem);line-height:1;letter-spacing:-.04em;font-weight:700}
.ref .band p{color:var(--ink-2);margin-top:14px;max-width:52ch}
.ref .band .w-btn{justify-self:start}
@media (max-width:760px){
  .ref .cmd{grid-template-columns:1fr}
  .ref .band{grid-template-columns:1fr}
}