/* "? Como usar esta tela" + atalho do guia dos Pergaminhos (public/upgrade/como-usar.js) */
/* ciano do Upgrade também na janelinha (ela fica fora de #page-upgrade, onde --or é laranja) */
.cu-grupo,.aj-corpo .cu-passos,.aj-corpo .cu-guia{--cu:#20D3E0}
.cu-grupo{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sc-cabeca:has(.cu-grupo) .sc-nomes{margin-right:0}
.sc-cabeca:has(.cu-grupo) .sc-salvo{margin-left:auto}
.calc-title-row .cu-grupo{margin-left:14px}
.cu-como,.cu-guia{display:inline-flex;align-items:center;gap:8px;border:1px solid color-mix(in srgb,var(--cu) 35%,transparent);background:color-mix(in srgb,var(--cu) 8%,transparent);color:var(--cu);font:600 13px var(--body,inherit);cursor:pointer;text-decoration:none;white-space:nowrap}
.cu-como{border-radius:999px;padding:6px 13px}
.cu-guia{border-radius:10px;padding:6px 13px;font-weight:700}
.cu-como:hover,.cu-guia:hover{background:color-mix(in srgb,var(--cu) 16%,transparent)}
.cu-q{width:18px;height:18px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center;font:800 11px var(--mono,monospace)}
/* dentro da janelinha */
.cu-passos{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:cu}
.cu-passos li{display:grid;grid-template-columns:28px 1fr;gap:10px}
.cu-passos li::before{counter-increment:cu;content:counter(cu);width:26px;height:26px;border-radius:50%;border:2px solid var(--cu);color:var(--cu);display:grid;place-items:center;font:800 12px var(--mono,monospace)}
.cu-passos b{color:var(--t-hi,#f0f3f7)}
.aj-corpo .cu-guia{justify-self:start;font-size:14px;padding:8px 13px}
.cu-rod{font-size:12.5px;color:var(--t-low,#6b7686);border-top:1px solid var(--border,#29313d);padding-top:10px}
