/* pnew-help.css — generated by tools/build_css.sh, do not edit (the help center only) */
/* src-css/help/help.css → app/assets/css/pnew-help.css (tools/build_css.sh): the help center (templates/help.php,
   lib/help.php). Loaded only by the help pages (pnew_head_css_add), so pnew.css and the guest bundles stay as they are.
   Sleek: tonal panels with the 1 px grey-50 % line, compact controls (40 desktop / 44 phone), sentence case, one pink key
   per view (the search button of the home). The reading frame (hero, TOC, prose, rail) is the guides' own. Role tokens
   only (the light theme follows). */

.pn-help__hero .pn-gd-hero__wrap{grid-template-columns:minmax(0,1fr)}
.pn-help__hero .pn-gd-hero__copy{max-width:820px}
.pn-help--article .pn-help__h1,.pn-help--cat .pn-help__h1{font-size:var(--fs-m);line-height:var(--lh-head)}
.pn-help__aud{margin-left:8px}
/* crumbs: Help center > category > article wrap on a phone instead of running out of the hero */
.pn-help .pn-gcrumbs .pn-crumbs{flex-wrap:wrap;row-gap:4px}
.pn-help .pn-gcrumbs .pn-crumbs li,.pn-help .pn-gcrumbs .pn-crumbs li:last-child{flex:0 1 auto}
.pn-help .pn-gcrumbs .pn-crumbs a,.pn-help .pn-gcrumbs .pn-crumbs [aria-current]{white-space:normal;overflow:visible}

/* search: the field with its key, the instant results under it */
.pn-help__search{position:relative;display:flex;gap:8px;margin-top:24px;max-width:640px}
.pn-help__searchbox{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:10px;height:var(--control-field);padding:0 14px;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface);color:var(--ink-2);cursor:text}
.pn-help__searchbox:focus-within{outline:2px solid var(--focus-ring);outline-offset:2px;color:var(--ink)}
.pn-help__q{flex:1 1 auto;min-width:0;height:100%;border:0;background:transparent;color:var(--ink);font:500 16px/1.2 var(--font-sans);outline:0;appearance:none}
.pn-help__q::placeholder{color:var(--ink-3)}
.pn-help__q::-webkit-search-cancel-button{appearance:none}
.pn-help__go{flex:none}
.pn-help__suggest{position:absolute;z-index:5;top:calc(100% + 6px);left:0;right:0;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface);box-shadow:var(--sh-frame);overflow:hidden}
.pn-help__sug{display:grid;gap:2px;padding:12px 14px;color:var(--ink);text-decoration:none}
.pn-help__sug + .pn-help__sug,.pn-help__sugall{border-top:1px solid var(--line)}
.pn-help__sug b{font:700 15px/1.3 var(--font-sans)}
.pn-help__sug span{font:500 13px/1.4 var(--font-sans);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pn-help__sug:hover,.pn-help__sug:focus-visible,.pn-help__sugall:hover,.pn-help__sugall:focus-visible{background:var(--sunken);outline:0}
.pn-help__sugall{display:block;padding:12px 14px;font:600 13px/1.2 var(--font-label);color:var(--ink);text-decoration:none}
.pn-help__sugnone{margin:0;padding:14px;font:500 14px/1.4 var(--font-sans);color:var(--ink-2)}

/* body */
.pn-help__body{padding:40px 0 72px}
.pn-help__body > .pc-wrap > * + *{margin-top:48px}
.pn-help__h{margin:0;font:700 var(--fs-section)/var(--lh-sub) var(--font-display);letter-spacing:var(--tr-head);color:var(--ink)}
.pn-help__sechead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px}
.pn-help__n{font:600 13px/1.2 var(--font-label);color:var(--ink-2);font-variant-numeric:tabular-nums}
.pn-help__cats > .pn-help__h,.pn-help__popular > .pn-help__h{margin-bottom:14px}

/* category cards */
.pn-help__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pn-help__cat{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 14px;align-content:start;height:100%;padding:18px;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface);color:var(--ink);text-decoration:none}
.pn-help__cat:hover,.pn-help__cat:focus-visible{background:var(--surface-2)}
.pn-help__ico{grid-row:1 / span 3;display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-icon);background:var(--sunken);color:var(--ink)}
.pn-help__cat b{font:700 16px/1.25 var(--font-sans)}
.pn-help__cat span{font:500 14px/1.45 var(--font-sans);color:var(--ink-2)}
.pn-help__cat i{font:600 12px/1.2 var(--font-label);font-style:normal;color:var(--ink-3);font-variant-numeric:tabular-nums;margin-top:4px}

/* article rows (popular answers, a category, the results) */
.pn-help__list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface);overflow:hidden}
.pn-help__list li + li{border-top:1px solid var(--line)}
.pn-help__row{display:flex;align-items:center;gap:14px;min-height:56px;padding:14px 16px;color:var(--ink);text-decoration:none}
.pn-help__row:hover,.pn-help__row:focus-visible{background:var(--surface-2)}
.pn-help__rowmain{flex:1 1 auto;min-width:0;display:grid;gap:3px}
.pn-help__rowmain b{font:700 15px/1.3 var(--font-sans)}
.pn-help__rowmain span{font:500 14px/1.45 var(--font-sans);color:var(--ink-2)}
.pn-help__row .pn-chev{flex:none;color:var(--ink-3)}
.pn-help__row .pn-help__aud{flex:none;margin-left:0}

/* no result, "Still need help?" */
.pn-help__none{display:grid;gap:10px;justify-items:start;padding:22px;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface)}
.pn-help__none p{margin:0;max-width:var(--measure-lede);font:500 15px/1.5 var(--font-sans);color:var(--ink-2)}
.pn-help__more{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface)}
.pn-help__more p{margin:6px 0 0;font:500 15px/1.5 var(--font-sans);color:var(--ink-2)}

/* a category: the list and the other topics */
.pn-help__split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.pn-help__main > * + *{margin-top:32px}
.pn-help__main > .pn-help__sechead{margin-bottom:-18px}
.pn-help__side ul{list-style:none;margin:10px 0 0;padding:0}
.pn-help__side li{border-bottom:1px dashed var(--line)}
.pn-help__side li:last-child{border-bottom:0}
.pn-help__side li a{display:flex;justify-content:space-between;gap:10px;padding:12px 0;font:700 14px/1.3 var(--font-sans);color:var(--ink);text-decoration:none}
.pn-help__side li a:hover{text-decoration:underline}

/* an article: prose details and the vote */
.pn-help__col{min-width:0}
.pn-help__prose > :first-child{margin-top:0}
.pn-help__prose h2{scroll-margin-top:calc(var(--sticky-top) + 12px)}
.pn-help__prose ol,.pn-help__prose ul{padding-left:1.25em}
.pn-help__prose li + li{margin-top:6px}
.pn-help__prose .pn-help-note{padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-rules);background:var(--sunken)}
.pn-help__vote{margin-top:40px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r-box);background:var(--surface);scroll-margin-top:calc(var(--sticky-top) + 12px)}
.pn-help__voteform{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.pn-help__voteform[hidden],.pn-help__voted[hidden],.pn-help__votedno[hidden]{display:none}
.pn-help__voteq{margin:0;font:700 var(--fs-subhead)/var(--lh-sub) var(--font-sans);color:var(--ink)}
.pn-help__votebtns{display:flex;gap:8px}
.pn-help__votebtns .pc-btn{min-width:84px}
.pn-help__voted{display:flex;align-items:center;gap:10px;margin:0;font:600 15px/1.4 var(--font-sans);color:var(--ink)}
.pn-help__votedno{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.pn-help__votedno b{font:700 var(--fs-subhead)/var(--lh-sub) var(--font-sans);color:var(--ink)}
.pn-help__votedno p{margin:4px 0 0;font:500 14px/1.45 var(--font-sans);color:var(--ink-2)}

@media (max-width:1100px){
  .pn-help__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pn-help__split{grid-template-columns:minmax(0,1fr);gap:32px}
}
@media (max-width:700px){
  .pn-help__search{margin-top:20px}
  .pn-help__body{padding:28px 0 48px}
  .pn-help__body > .pc-wrap > * + *{margin-top:36px}
  .pn-help__grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .pn-help__cat{padding:14px}
  .pn-help__row{padding:14px}
  .pn-help__row .pn-help__aud{display:none}
  .pn-help__more .pc-btn,.pn-help__none .pc-btn,.pn-help__votedno .pc-btn{width:100%}
  .pn-help__votebtns{width:100%}
  .pn-help__votebtns .pc-btn{flex:1 1 0}
  .pn-help__suggest{position:static;margin-top:6px;flex-basis:100%}
  .pn-help__search{flex-wrap:wrap}
}