/* Patra · help centre: index, guide frame, callouts, settings lists, record tables, search and copy buttons.
   Loaded after /site.css on help pages only. Code uses the system monospace stack (no font download). */
.help-hero{padding-block:clamp(40px,24px + 3vw,72px) clamp(32px,24px + 2vw,48px);text-align:center}
.help-hero h1{max-width:16ch;margin-inline:auto;font:600 clamp(2.25rem,1.6rem + 2.2vw,3.5rem)/1.08 var(--font-heading);letter-spacing:-.03em;text-wrap:balance}
.help-hero .lead{max-width:600px;margin:16px auto 0}
.help-search{max-width:560px;margin:28px auto 0;text-align:left}
@media (scripting:enabled){.help-search[hidden]{display:block!important}}
.help-search label{display:block;margin-bottom:8px;font:600 14px/20px var(--font-body);text-align:center}
.help-search .field{position:relative}
.help-search .field .icon{position:absolute;left:16px;top:50%;width:20px;height:20px;margin-top:-10px;color:var(--slate)}
.help-search input{width:100%;min-height:52px;padding:0 16px 0 46px;border:1px solid rgba(23,33,43,.4);border-radius:var(--r-pill);background:var(--white);color:var(--ink);font:400 16px/1.2 var(--font-body)}
.help-search input::placeholder{color:#5F6B78}
.help-search [role=status]{min-height:22px;margin-top:8px;color:var(--slate);font-size:14px;line-height:22px;text-align:center}
.popular{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:20px}
.popular a,.host-grid a,.guide-grid a{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border-radius:var(--r-pill);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline-2);color:var(--ink);font:500 14px/1.25 var(--font-body);text-decoration:none}
.popular a:hover,.host-grid a:hover,.guide-grid a:hover{box-shadow:inset 0 0 0 1px rgba(23,33,43,.34)}
.cat-grid{display:grid;align-items:stretch;gap:16px}
.cat-card{padding:24px;border-radius:var(--r-lg);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline);scroll-margin-top:96px}
.cat-card .ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--coral-100);color:var(--coral-action)}
.cat-card .ic .icon{width:20px;height:20px}
.cat-card h2{margin-top:14px;font:600 20px/28px var(--font-heading);letter-spacing:-.01em}
.cat-card h2 a{text-decoration:none}
.cat-card h2 a:hover{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.cat-card > p{margin-top:4px;color:var(--slate);font-size:15px;line-height:22px}
.cat-card ul{display:grid;margin-top:12px}
.cat-card li a{display:flex;align-items:center;min-height:44px;padding-block:8px;border-top:1px solid var(--hairline);color:var(--ink);font:500 15px/20px var(--font-body);text-decoration:none}
.cat-card li a:hover{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.cat-card ul{column-gap:24px}
@media (min-width:40em){
  .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cat-card.full{grid-column:1/-1}
  .cat-card.full ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:40em) and (max-width:63.99em){.cat-card.md-full{grid-column:1/-1}.cat-card.md-full ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:64em){
  .cat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .cat-card.full ul{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cat-card.lg-two{grid-column:span 2}
  .cat-card.lg-two ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.help-index{width:min(1100px,100% - 2*var(--gutter))}
.help-band{margin:clamp(32px,24px + 2vw,48px) 0 0;padding:24px;border-radius:var(--r-lg);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline)}
.help-band h2{font:600 20px/28px var(--font-heading)}
.help-band > p{margin-top:6px;color:var(--slate)}
.help-band .cta-row{margin-top:20px}

/* guide frame */
.doc-page{padding-block:clamp(20px,12px + 2vw,40px) clamp(64px,48px + 3vw,112px)}
.doc-page .crumbs{justify-content:flex-start}
.doc-grid{display:grid;gap:40px;margin-top:16px}
.doc{min-width:0;max-width:720px}
.doc-head .tag{margin-bottom:14px}
.doc-head h1{font:600 clamp(2rem,1.5rem + 1.6vw,2.75rem)/1.1 var(--font-heading);letter-spacing:-.025em;text-wrap:balance}
.doc-head .lead{margin-top:14px}
.doc-head .meta{margin-top:12px;color:var(--slate);font-size:14px;line-height:20px}
.doc-toc{margin-top:28px;border-radius:var(--r-md);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline)}
.doc-toc summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding:0 20px;font:600 15px/1 var(--font-body);cursor:pointer;list-style:none}
.doc-toc summary::-webkit-details-marker{display:none}
.doc-toc summary::after{content:"";flex:none;width:8px;height:8px;margin:-4px 4px 0 0;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .3s var(--ease-out)}
.doc-toc[open] summary::after{margin-top:4px;transform:rotate(-135deg)}
.doc-toc ol{margin:0;padding:0 20px 14px 40px}
.doc-toc li{font-size:15px;line-height:22px}
.doc-toc a{display:inline-flex;align-items:center;min-height:40px;color:var(--ink)}
.doc-body h2{margin:44px 0 0;font:600 22px/30px var(--font-heading);letter-spacing:-.01em;scroll-margin-top:96px}
.doc-body h3{margin:28px 0 0;font:600 17px/26px var(--font-body)}
.doc-body p,.doc-body li,.doc-body dd{font-size:16px;line-height:1.7}
.doc-body p{margin-top:12px}
.doc-body ul,.doc-body ol{margin:12px 0 0;padding-left:22px}
.doc-body li{margin:6px 0}
.doc-body li::marker{color:var(--slate)}
.doc-body :where(p,li,td,th,dd,caption) a,.stuck p a{color:var(--teal);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.doc-body :where(p,li,td,th,dd) a:hover{text-decoration-thickness:2px}
.doc-body .tm{margin-top:24px;font-size:13px;line-height:20px}
.doc-body code,.doc-head code{padding:1px 4px;border-radius:5px;background:rgba(23,33,43,.06);font:500 .9em/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-wrap:anywhere}
.doc-steps{counter-reset:step;list-style:none;padding-left:0!important}
.doc-steps > li{position:relative;margin:12px 0;padding-left:44px;counter-increment:step}
.doc-steps > li::before{content:counter(step);position:absolute;left:0;top:1px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 1.5px var(--coral);color:var(--coral-action);font:700 13px/1 var(--font-heading)}
.doc-steps ul{margin-top:4px}
.callout{display:flex;gap:12px;margin-top:20px;padding:16px 18px;border-radius:14px}
.callout > .icon{width:20px;height:20px;margin-top:3px}
.callout p,.callout li{margin:0;font-size:15px;line-height:24px}
.callout p + p{margin-top:8px}
.callout-tip{background:var(--teal-50);box-shadow:inset 0 0 0 1px rgba(0,107,101,.2)}
.callout-tip > .icon{color:var(--teal-ink)}
.callout-warn{background:var(--warning-100);box-shadow:inset 0 0 0 1px rgba(137,91,0,.22)}
.callout-warn > .icon{color:var(--warning)}
.kv{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);margin-top:16px;border-radius:var(--r-md);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline);overflow:hidden}
.kv dt,.kv dd{padding:12px 16px;border-top:1px solid var(--hairline);font-size:15px;line-height:24px}
.kv dt:first-of-type,.kv dt:first-of-type + dd{border-top:0}
.kv dt{background:var(--paper);color:var(--slate);font-weight:600}
.kv.fields dt{color:var(--ink)}
@media (max-width:29.99em){.kv{grid-template-columns:minmax(0,1fr)}.kv dt{padding-bottom:2px;background:transparent}.kv dd{padding-top:0;border-top:0}}
.kv-sub{display:block;color:var(--slate)}
.kv-note{color:var(--slate);font-size:14px!important}
.copy{position:relative;display:inline-flex;align-items:center;min-height:32px;margin:0 2px 0 6px;padding:0 12px;border:0;border-radius:var(--r-pill);background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--hairline-2);color:var(--ink);font:600 13px/1 var(--font-body);vertical-align:middle;cursor:pointer}
.copy::before{content:"";position:absolute;inset:-6px -2px}
.copy:hover{box-shadow:inset 0 0 0 1px rgba(23,33,43,.34)}
.doc-body .table-wrap{margin:16px 0 0}
.doc-body table{width:100%;border-collapse:collapse;font-size:14px;line-height:22px;text-align:left}
.doc-body caption{padding:12px 16px;caption-side:bottom;border-top:1px solid var(--hairline);color:var(--slate);font-size:13px;line-height:20px;text-align:left}
.doc-body th,.doc-body td{padding:12px 14px;vertical-align:top;border-bottom:1px solid var(--hairline)}
.doc-body thead th{background:var(--paper-2);color:var(--slate);font-weight:600}
.doc-body tbody th{font-weight:600}
.doc-body tbody tr:last-child > *{border-bottom:0}
.doc-body td p{margin:0}
@media (max-width:39.99em){.doc-body .stack th,.doc-body .stack td{padding:4px 0;border:0}.doc-body .stack caption{display:block;border-top:0;border-bottom:1px solid var(--hairline)}}
.host-grid,.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px;padding:0!important;list-style:none}
.host-grid li,.guide-grid li{margin:0}
.host-grid a,.guide-grid a{border-radius:12px;font-weight:600;min-height:48px}
.guide-grid .icon{width:18px;height:18px;color:var(--coral-action)}
.doc-body .host-grid a,.doc-body .guide-grid a{color:var(--ink);text-decoration:none}
@media (min-width:40em){.host-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.stuck{margin-top:48px;padding:24px;border-radius:var(--r-md);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline)}
.stuck h2{font:600 20px/28px var(--font-heading);letter-spacing:-.01em}
.stuck p{margin:6px 0 16px;color:var(--slate)}
.pager{display:grid;gap:12px;margin-top:20px}
.pager a{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:var(--r-md);background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline);text-decoration:none}
.pager a:hover{box-shadow:inset 0 0 0 1px rgba(23,33,43,.34)}
.pager small{display:inline-flex;align-items:center;gap:6px;color:var(--slate);font:600 13px/18px var(--font-body)}
.pager small .icon{width:14px;height:14px}
.pager span{color:var(--ink);font:600 16px/24px var(--font-heading)}
.pager .next{align-items:flex-end;text-align:right}
@media (min-width:40em){.pager{grid-template-columns:repeat(2,minmax(0,1fr))}.pager .next:only-child{grid-column:2}}
.doc-side{display:none}
.side-h{margin-bottom:8px;color:var(--slate);font:600 13px/18px var(--font-body)}
.side-block ol,.side-block ul{display:grid;gap:2px}
.side-block a{display:block;padding:4px 10px;border-radius:8px;color:var(--ink);font-size:14px;line-height:20px;text-decoration:none}
.side-sub{margin:14px 0 6px;padding-left:10px;color:var(--slate);font:600 12px/16px var(--font-body)}
.side-block .side-cols{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:4px}
.side-block a:hover{background:var(--white)}
.side-block a[aria-current=page]{background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline-2);font-weight:600}
@media (min-width:64em){
  .doc-grid{grid-template-columns:minmax(0,1fr) 260px;gap:64px;align-items:start}
  .doc-toc{display:none}
  .doc-side{display:grid;gap:24px;position:sticky;top:96px;max-height:calc(100vh - 120px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:4px;margin-inline:-4px}
}
@media print{.doc-side,.doc-toc,.pager,.stuck,.copy{display:none}}

/* keys in running text */
kbd{display:inline-block;min-width:1.6em;padding:1px 6px;border-radius:6px;background:var(--white);box-shadow:inset 0 0 0 1px var(--hairline-2),0 1px 0 var(--hairline-2);font:600 .85em/1.4 var(--font-body);text-align:center}
/* DNS host buttons: an odd last button takes the whole row */
@media (min-width:40em){.host-grid li:last-child:nth-child(3n+1){grid-column:1/-1}}
@media (max-width:39.99em){.host-grid li:last-child:nth-child(odd){grid-column:1/-1}}