:root{--roxo:#9200d0;--roxo-50:#f4e6fa;--roxo-800:#5e0087;--laranja:#f2762e;--amarelo:#f2c029;
 --n0:#fff;--n50:#fdfdfd;--n100:#f8f9fa;--n200:#f1f2f6;--n300:#eaeaea;--n600:#666;--n700:#555;--n800:#333;--n900:#1c1c1c;
 --ok:#16a34a;--ok-bg:#f0fdf4;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,-apple-system,sans-serif;background:var(--n50);color:var(--n800);line-height:1.6;padding-bottom:90px}
.wrap{max-width:800px;margin:0 auto;padding:0 20px}
header{background:var(--n0);border-bottom:1px solid var(--n300);padding:38px 0 30px}
.marca{font-family:'Montserrat',sans-serif;font-weight:900;font-size:13px;letter-spacing:.04em;
 background:linear-gradient(90deg,var(--roxo),var(--amarelo));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px}
h1{font-family:'Montserrat',sans-serif;font-weight:900;font-size:clamp(1.5rem,4.4vw,2.1rem);line-height:1.16;letter-spacing:-.02em;color:var(--n900)}
.intro{margin-top:13px;color:var(--n600);font-size:15px}
.progresso{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(9px);
 border-bottom:1px solid var(--n300);padding:11px 0}
.pbar{display:flex;align-items:center;gap:12px;max-width:800px;margin:0 auto;padding:0 20px;font-size:13px;color:var(--n600)}
.pbar .trilho{flex:1;height:7px;background:var(--n200);border-radius:99px;overflow:hidden}
.pbar .trilho i{display:block;height:100%;background:linear-gradient(90deg,var(--roxo),var(--laranja));width:0;transition:width .35s}
.pbar b{color:var(--n900);font-variant-numeric:tabular-nums;white-space:nowrap}
.q{background:var(--n0);border:1px solid var(--n300);border-radius:14px;padding:20px 21px;margin-top:16px;transition:border-color .2s}
.q.feito{border-color:var(--ok);background:var(--ok-bg)}
.qnum{font-family:var(--mono);font-size:11.5px;color:#9aa0a6;margin-bottom:7px}
.q h2{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.06rem;line-height:1.32;color:var(--n900);letter-spacing:-.01em}
.ctx{margin-top:9px;font-size:14px;color:var(--n700)}
.ctx code{font-family:var(--mono);font-size:12.5px;background:var(--n200);padding:1px 6px;border-radius:5px}
.ctx a{color:var(--roxo);font-weight:600}
.opcoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.op{font-family:inherit;font-size:14px;font-weight:600;padding:10px 16px;border-radius:10px;
 border:1.5px solid var(--n300);background:var(--n0);color:var(--n700);cursor:pointer;transition:.15s;text-align:left}
.op:hover{border-color:var(--roxo);color:var(--roxo)}
.op.on{background:var(--roxo);border-color:var(--roxo);color:#fff}
.obs{width:100%;margin-top:11px;font-family:inherit;font-size:14px;padding:10px 13px;border:1.5px solid var(--n300);
 border-radius:10px;resize:vertical;min-height:44px;color:var(--n800);background:var(--n0)}
.obs:focus{outline:none;border-color:var(--roxo)}
.salvo{font-size:12.5px;color:var(--ok);font-weight:600;margin-top:9px;display:none}
.q.feito .salvo{display:block}
.fim{margin-top:26px;padding:20px;background:var(--roxo-50);border-radius:14px;text-align:center}
.fim p{font-size:14.5px;color:var(--roxo-800)}
footer{margin-top:34px;font-size:12px;color:#9aa0a6;text-align:center}
@media(max-width:560px){.op{width:100%}}