:root{--ink:#0c2e49;--muted:#60758a;--green:#22a83a;--green-dark:#15872c;--line:#d8e5ec;--paper:#f4f8fb;--white:#fff;--red:#c94b4b;--amber:#b67416}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 Inter,system-ui,sans-serif}
.help-header{background:linear-gradient(135deg,#07375e,#0a527c);color:#fff;padding:0 24px 56px}
.help-header.compact{padding-bottom:12px}
.help-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(1080px,100%);margin:auto;padding:18px 0}
.help-brand{display:flex;align-items:center;gap:10px;color:#fff!important;font-weight:800;font-size:16px;text-decoration:none}
.help-brand img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:10px;padding:4px}
.help-nav>div{display:flex;gap:18px}
.help-nav a{color:#dcecf6;font-weight:700;text-decoration:none}
.help-nav a:hover{text-decoration:underline}
.help-hero{width:min(760px,100%);margin:54px auto 0;text-align:center}
.help-hero p,.status-heading p,.help-contact p{margin:0 0 8px;color:#68dc7a;font-size:10px;font-weight:900;letter-spacing:.14em}
.help-hero h1,.status-heading h1{margin:0;font-size:clamp(34px,6vw,54px);line-height:1.08}
.help-hero span{display:block;margin-top:13px;color:#d7e7f1;font-size:15px}
.help-shell,.status-shell{width:min(920px,calc(100% - 32px));margin:0 auto;padding:34px 0 60px}
.help-topics{display:flex;gap:8px;overflow:auto;margin-top:-58px;margin-bottom:28px;padding:12px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 14px 38px rgba(7,55,94,.11)}
.help-topics a{flex:0 0 auto;border-radius:10px;padding:9px 12px;color:var(--ink);font-size:11px;font-weight:800;text-decoration:none}
.help-topics a:hover{background:#edf7f0;color:var(--green-dark)}
.help-section{scroll-margin-top:18px;margin-bottom:28px}
.help-section-title{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.help-section-title>span{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:#e8f6ec;color:var(--green-dark);font-weight:900}
.help-section-title h2{margin:0;font-size:22px}
.help-section-title p{margin:1px 0 0;color:var(--muted);font-size:11px}
.help-section details{border:1px solid var(--line);border-radius:13px;background:#fff;margin-bottom:9px;overflow:hidden}
.help-section summary{cursor:pointer;list-style:none;padding:16px 48px 16px 18px;font-weight:800;position:relative}
.help-section summary::-webkit-details-marker{display:none}
.help-section summary:after{content:'+';position:absolute;right:18px;color:var(--green);font-size:19px;line-height:1}
.help-section details[open] summary:after{content:'−'}
.help-section details>div{border-top:1px solid var(--line);padding:4px 18px 16px}
.help-section p,.help-section li{color:var(--muted)}
.help-section ol{padding-left:20px}
.help-contact{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:36px;border-radius:18px;background:#0b3b64;color:#fff;padding:26px}
.help-contact h2{margin:0 0 4px;font-size:24px}
.help-contact span{color:#cfe0ec;font-size:11px}
.help-contact>div:last-child{display:flex;gap:8px;flex:0 0 auto}
.help-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid #88a9be;border-radius:10px;color:#fff;padding:10px 14px;font-size:11px;font-weight:800;text-decoration:none}
.help-button.primary{border-color:var(--green);background:var(--green)}
.help-footer{display:flex;justify-content:space-between;gap:20px;width:min(920px,calc(100% - 32px));margin:0 auto;padding:20px 0 30px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}
.help-footer nav{display:flex;gap:15px}
.help-footer a{color:var(--green-dark);font-weight:800;text-decoration:none}
.status-shell{max-width:780px}
.status-heading{margin:30px 0}
.status-heading h1{font-size:clamp(30px,5vw,44px)}
.status-heading>span{color:var(--muted)}
.status-summary{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:20px}
.status-dot{width:13px;height:13px;border-radius:50%;background:#93a7b4;box-shadow:0 0 0 6px #edf2f5}
.status-summary strong,.status-summary small{display:block}
.status-summary strong{font-size:17px}
.status-summary small{color:var(--muted);font-size:10px}
.status-summary.healthy{border-color:#bfe5c7;background:#f6fcf7}
.status-summary.healthy .status-dot{background:var(--green);box-shadow:0 0 0 6px #daf2df}
.status-summary.degraded{border-color:#f0d9b6;background:#fffaf1}
.status-summary.degraded .status-dot{background:var(--amber);box-shadow:0 0 0 6px #faecd4}
.status-components{display:grid;gap:9px;margin:14px 0}
.status-components article{display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:15px 17px}
.status-components strong,.status-components small{display:block}
.status-components small{color:var(--muted);font-size:9px}
.component-status{border-radius:999px;background:#edf2f5;color:#647985;padding:6px 9px;font-size:9px;font-weight:900;text-transform:uppercase}
.component-status.healthy{background:#e2f4e6;color:var(--green-dark)}
.component-status.degraded{background:#fff0ee;color:var(--red)}
.status-meta{color:var(--muted);font-size:10px;text-align:right}
.status-scope{border:1px solid var(--line);border-radius:13px;background:#fff;padding:15px 17px}
.status-scope p{margin:5px 0 0;color:var(--muted);font-size:10px}
.status-page .help-contact{margin-top:24px}
@media(max-width:680px){.help-header{padding-left:16px;padding-right:16px}
.help-nav{align-items:flex-start}
.help-nav>div{align-items:flex-end;flex-direction:column;gap:4px}
.help-contact{align-items:flex-start;flex-direction:column}
.help-contact>div:last-child{width:100%}
.help-button{flex:1}
.help-footer{align-items:flex-start;flex-direction:column}
.help-topics{margin-top:-48px}
.status-components article{align-items:flex-start;flex-direction:column}
.status-meta{text-align:left}
}

/* WCAG AA: texto funcional e secundário mantém contraste mínimo. */
:root{--muted:#566d81;--green:#087b38;--green-dark:#087b38;--red:#a83232;--amber:#8a570c}
.component-status{color:#4f6672}
.status-heading>p{color:#087b38}
a:focus-visible,summary:focus-visible{outline:3px solid #68dc7a;outline-offset:3px}