/* RotaBip · estilo dos guias de uso (mesmas cores do app). © 2026 RotaBip · Todos os direitos reservados */
:root{--bg:#0b1020;--card:#141a2a;--card2:#1d2537;--line:#253049;--txt:#eef2f8;--muted:#98a3b9;--brand:#1d4ed8;--brandB:#0ea5e9;--laranja:#f97316;--ok:#34d399;--aviso:#fbbf24}
@media (prefers-color-scheme: light){:root{--bg:#f3f6fb;--card:#fff;--card2:#eef2f8;--line:#e1e7f0;--txt:#0f172a;--muted:#5b6578;--ok:#16935a;--aviso:#b26a00}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--txt);font:16px/1.55 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header{background:radial-gradient(circle at 96% -40%,rgba(249,115,22,.55) 0,transparent 42%),linear-gradient(135deg,var(--brand),var(--brandB));
  color:#fff;padding:22px 16px 26px;border-radius:0 0 24px 24px;text-align:center}
header .marca{font:800 28px 'Baloo 2',Inter,sans-serif;letter-spacing:-.3px}
header .marca b{color:#fb923c}
header h1{margin:6px 0 4px;font-size:22px}
header p{margin:0;opacity:.9;font-size:14px}
main{max-width:720px;margin:0 auto;padding:18px 16px 60px}
nav.indice{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;margin-bottom:22px}
nav.indice b{display:block;margin-bottom:6px}
nav.indice ol{margin:0;padding-left:22px}
nav.indice a{color:var(--brandB);text-decoration:none}
section{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px 16px 6px;margin-bottom:18px}
section h2{margin:0 0 10px;font-size:20px;display:flex;align-items:center;gap:8px}
section h2 .n{background:var(--laranja);color:#fff;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:15px;flex:0 0 30px}
ol.passos{padding-left:22px;margin:8px 0}
ol.passos li{margin-bottom:6px}
figure{margin:12px auto 16px;max-width:300px;text-align:center}
figure img{width:100%;border-radius:20px;border:5px solid #111;box-shadow:0 8px 22px rgba(0,0,0,.25);display:block}
figcaption{color:var(--muted);font-size:13px;margin-top:6px}
.dica,.atencao{border-radius:14px;padding:10px 12px;margin:10px 0 14px;font-size:15px}
.dica{background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.35)}
.atencao{background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.4)}
.botao{display:inline-block;background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:1px 8px;font-weight:600;white-space:nowrap}
.laranja{background:var(--laranja);color:#fff;border-color:var(--laranja)}
.verde{background:#16a34a;color:#fff;border-color:#16a34a}
.voltar{display:block;text-align:right;font-size:13px;margin:-4px 0 10px}
.voltar a{color:var(--muted)}
footer{text-align:center;color:var(--muted);font:12px ui-monospace,Consolas,monospace;padding:10px 16px 30px}
footer a{color:var(--brandB)}