body{padding-left:212px}
 .prail{position:fixed;left:0;top:0;bottom:0;width:212px;box-sizing:border-box;
   background:var(--surface);border-right:1px solid var(--line);
   display:flex;flex-direction:column;z-index:40;overflow-y:auto;font-size:13.5px}
 .prail .pbrand{padding:16px 16px 14px;border-bottom:1px solid var(--line)}
 .prail .pbrand b{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em}
 .prail .pbrand span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
   color:var(--ink-3);margin-top:3px}
 .prail .pitems{padding:10px;display:flex;flex-direction:column;gap:2px;flex:1}
 /* collapsible sections, after the Collapsible Tree pattern: rotating chevron,
    a page-count pill, a guide rail on the open branch; rows open 0 -> height */
 .nsech{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:6px;width:100%;
   padding:7px 10px;border-radius:8px;cursor:pointer;font-size:10.5px;font-weight:600;
   letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
 .nsech:hover{color:var(--ink);background:var(--inset)}
 .nsech:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
 .nsech svg{flex:none;transition:transform .34s cubic-bezier(.22,1,.36,1)}
 .nsec.open .nsech svg{transform:rotate(90deg)}
 .ncount{margin-left:auto;font-size:10.5px;letter-spacing:0;line-height:16px;padding:0 6px;
   border-radius:999px;background:var(--inset);border:1px solid var(--line)}
 .nsec.open .ncount{color:var(--accent-ink);background:var(--accent-soft);border-color:var(--accent-line)}
 .nsecb{display:grid;grid-template-rows:0fr;transition:grid-template-rows .34s cubic-bezier(.22,1,.36,1)}
 .nsec.open .nsecb{grid-template-rows:1fr}
 .nsecb>div{overflow:hidden;min-height:0;margin-left:15px;padding-left:5px;border-left:1px solid transparent;
   visibility:hidden;transition:visibility 0s .34s,border-color .34s}
 .nsec.open .nsecb>div{visibility:visible;transition-delay:0s;border-left-color:var(--accent-line)}
 .nsecb .ngrp{padding:1px 0 6px}
 .nsecb .nlab{padding:6px 10px 3px}
 .pfind{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;margin:10px 10px 0;
   padding:7px 10px;border:1px solid var(--line-strong);border-radius:8px;font-size:12.5px;color:var(--ink-3);
   cursor:pointer;background:var(--surface)}
 .pfind:hover{color:var(--ink);background:var(--inset)}
 .pfind:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
 .pfind kbd{margin-left:auto;font:600 10.5px var(--sans);padding:1px 5px;border-radius:5px;border:1px solid var(--line)}
 dialog.pcmd{width:min(560px,calc(100vw - 32px));max-height:min(460px,80vh);padding:0;margin:12vh auto auto;
   border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);box-shadow:var(--sh-pop);
   overflow:hidden;display:flex;flex-direction:column}
 dialog.pcmd:not([open]){display:none}
 dialog.pcmd::backdrop{background:color-mix(in srgb,var(--bg) 55%,transparent);backdrop-filter:blur(2px)}
 dialog.pcmd input{all:unset;box-sizing:border-box;width:100%;padding:14px 16px;font-size:14.5px;
   border-bottom:1px solid var(--line)}
 dialog.pcmd ul{list-style:none;margin:0;padding:6px;overflow:auto}
 dialog.pcmd li{display:flex;align-items:baseline;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer}
 dialog.pcmd li b{font-weight:500;font-size:13.5px}
 dialog.pcmd li span{font-size:12px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 dialog.pcmd li[aria-selected="true"]{background:var(--accent-soft)}
 dialog.pcmd li.none{color:var(--ink-3);cursor:default}
 @media(max-width:860px){.pfind{display:none}}
 .nbadge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:999px;
   display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;
   font-variant-numeric:tabular-nums;color:var(--attn-ink);background:var(--attn-bg);border:1px solid var(--attn-line);
   animation:nbadge-in .28s cubic-bezier(.22,1,.36,1)}
 @keyframes nbadge-in{from{transform:scale(.6);opacity:0}}
 html:not(.navready) .nsecb,html:not(.navready) .nsech svg,html:not(.navready) .nsecb>div{transition:none}
 .prail .nfoot{margin-top:auto}
 /* the group label is the thing that turns a list into a map */
 .ngrp{display:flex;flex-direction:column;gap:1px}
 .nlab{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
   color:var(--ink-3);padding:0 10px 5px}
 .prail .ni{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;
   color:var(--ink-2);text-decoration:none;min-height:34px;line-height:1.2}
 .prail .ni svg{flex:0 0 auto}
 .prail .ni:hover{background:var(--inset);color:var(--ink)}
 .prail .ni.on{background:var(--rdy-bg);color:var(--rdy-ink);font-weight:600;box-shadow:inset 2px 0 0 var(--accent)}
 /* The sidebar IS the way back now, so the ad-hoc back-links go. Plain .back
    rather than a sibling combinator: the rail is appended last, so nothing
    follows it and `.prail ~ *` matched nothing. This style block only ships on
    pages that receive the rail, so it cannot reach a page that still needs one. */
 .back,a.back{display:none}
 /* Radix's scroll lock zeroes body padding while a dropdown is open, and the
    rail's gutter IS body padding - the whole page jumped 212px under the rail. */
 body[data-scroll-locked]{padding-left:212px!important}
 /* No page transition or page fade-in: pages carry their stylesheets in the
    body, so a cross-document view transition captured the new page unstyled
    and faded into a white blank. Plain navigation holds the old page until
    the new one paints. */
 /* The page list is a popover so a phone gets a Menu button with outside-tap and
    Escape dismissal for free; on a desktop it is pinned open in the rail. */
 .prail .pitems[popover]{position:static;inset:auto;margin:0;border:0;width:auto;height:auto;
   overflow:visible;background:none;color:inherit}
 .pmenu-btn{display:none}
 @media(min-width:861px){.prail .pitems[popover]{display:flex}}
 @media(max-width:860px){
   body{padding-left:0} body[data-scroll-locked]{padding-left:0!important}
   /* a bar pinned to the bottom of the screen, in thumb reach; Menu opens the page grid above it */
   .prail{position:sticky;top:auto;bottom:0;width:auto;height:auto;border-right:0;overflow:visible;
     border-top:1px solid var(--line);flex-direction:row;align-items:center;gap:8px;padding-right:10px}
   .prail .pbrand{border-bottom:0;flex:1;padding:10px 14px}
   .pmenu-btn{display:inline-flex;align-items:center;gap:6px;font:600 13px var(--sans);padding:7px 12px;
     border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);cursor:pointer}
   .prail .theme-toggle{width:auto!important;margin:0!important;padding:7px 10px}
   .prail .theme-toggle span{display:none}
   .prail .pitems:not(:popover-open){display:none}
   .prail .pitems:popover-open{position:fixed;inset:auto 10px 66px 10px;max-height:calc(100vh - 80px);
     overflow:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px;
     background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-pop)}
   .prail .pitems:popover-open .ngrp,.prail .pitems:popover-open .nsec,
   .prail .pitems:popover-open .nsecb,.prail .pitems:popover-open .nsecb>div{display:contents;visibility:visible}
   .prail .pitems:popover-open .nsech{display:none}
   .prail .pitems .nlab{display:none}
   .prail .pitems:popover-open .ni{flex-direction:column;justify-content:center;text-align:center;
     gap:6px;min-height:66px;padding:8px 4px;font-size:12px}
 }