.crumb{max-width:var(--wrap);margin:0 auto;padding:var(--s-4) var(--s-5) 0}
.crumb ol{display:flex;flex-wrap:wrap;gap:6px;font-size:var(--t-xs);color:var(--ink-faint);list-style:none;margin:0;padding:0}
.crumb li:not(:last-child)::after{content:'/';margin-left:6px;color:var(--line)}
.crumb li[aria-current]{color:var(--fg);font-weight:600}
.crumb a:hover{color:var(--red)}

.pg{max-width:920px;margin:0 auto;padding:var(--s-5) var(--s-5) var(--s-7)}
.pg--wide{max-width:var(--wrap)}

.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--s-5) var(--s-4)}
@media (max-width:768px){.cat-grid{grid-template-columns:repeat(2,1fr);gap:var(--s-4) var(--s-3)}}
.pg__title{font-size:var(--t-3xl);font-weight:800;letter-spacing:-.01em;margin-bottom:var(--s-3)}
.pg__lead{color:var(--ink-soft);font-size:var(--t-lg);margin-bottom:var(--s-6)}

.pg h2{font-size:var(--t-xl);font-weight:700;margin:var(--s-6) 0 var(--s-3)}
.pg h3{font-size:var(--t-lg);font-weight:700;margin:var(--s-5) 0 var(--s-2)}
.pg p{color:var(--ink-soft);margin-bottom:var(--s-3);line-height:1.7}
.pg ul:not(.pg__plain){margin:0 0 var(--s-4) 1.1rem;list-style:disc}
.pg ul:not(.pg__plain) li{color:var(--ink-soft);margin-bottom:.55rem;line-height:1.65}
.pg a:not(.btn){color:var(--red);text-decoration:underline;text-underline-offset:2px}
.pg strong{color:var(--fg);font-weight:700}

.pg__updated{font-size:var(--t-sm);color:var(--ink-faint);margin-bottom:var(--s-5)}

.pg404{text-align:center;padding:var(--s-6) 0}
.pg404__code{font-family:var(--f-head);font-size:clamp(72px,14vw,140px);font-weight:800;line-height:1;color:var(--line);margin-bottom:var(--s-3)}
.pg404 .pg__lead{margin-inline:auto;max-width:440px}
.pg404__actions{display:flex;justify-content:center;gap:var(--s-3);flex-wrap:wrap;margin:var(--s-5) 0}
.pg404__actions .btn--solid{border-radius:var(--r-sm)}
.pg404__help{color:var(--ink-faint);font-size:var(--t-sm)}

.pg__cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--s-4);margin-bottom:var(--s-6)}
.pg__card{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-4);background:var(--paper)}
.pg__card h3{margin:0 0 var(--s-2);font-size:var(--t-base)}
.pg__card p{margin:0;font-size:var(--t-sm)}

.pg__form{display:grid;gap:var(--s-4);max-width:560px}
.pg__form label{display:block;font-size:var(--t-sm);font-weight:600;margin-bottom:.4rem}
.pg__form input,.pg__form textarea,.pg__form select{
  width:100%;padding:11px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  background:var(--paper);color:var(--fg);font:inherit;font-size:var(--t-sm);
  transition:border-color var(--d-fast) linear,box-shadow var(--d-fast) linear}
.pg__form input:focus,.pg__form textarea:focus,.pg__form select:focus{
  outline:none;border-color:var(--red);box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 12%,transparent)}
.pg__form textarea{min-height:132px;resize:vertical}
.pg__note{font-size:var(--t-xs);color:var(--ink-faint)}

.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{padding:var(--s-4) 0;cursor:pointer;font-family:var(--f-head);font-weight:600;
  font-size:var(--t-base);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--s-4)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:1.35rem;color:var(--red);flex:none;line-height:1;transition:transform var(--d-fast) var(--e-out)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--red)}
.faq details > *:not(summary){padding-bottom:var(--s-4)}

.pg__tablewrap{overflow-x:auto;margin-bottom:var(--s-5);border:1px solid var(--line);border-radius:var(--r-md)}
.pg__table{border-collapse:collapse;width:100%;min-width:460px;font-size:var(--t-sm)}
.pg__table th,.pg__table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.pg__table th{background:var(--surface);font-family:var(--f-head);font-weight:700;font-size:var(--t-xs);letter-spacing:.03em}
.pg__table tr:last-child td{border-bottom:0}

@media (max-width:640px){
  .pg{padding-inline:var(--s-3)}
}