/* [N3] Guia de instalação do Niiu: uma ação por tela, fases com vitória, alvo desenhado e pulsando. */
.niiu-install-guide{box-sizing:border-box;width:min(420px,calc(100% - 20px));max-height:calc(100dvh - 20px);padding:0;border:1px solid #677091;border-radius:26px;background:#120c24;color:#f6f1ff;font:16px/1.45 Figtree,"Segoe UI",system-ui,sans-serif;box-shadow:0 20px 80px #0009;overflow:hidden}
.niiu-install-guide::backdrop{background:#06040ec8;backdrop-filter:blur(4px)}
.niiu-install-guide *{box-sizing:border-box}
.niiu-install-guide [hidden]{display:none!important}
.niiu-guide-top{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px 6px 18px}
.niiu-guide-brand{font-size:11px;letter-spacing:.13em;color:#5cf2b4;font-weight:750}
.niiu-guide-tools{display:flex;gap:2px;align-items:center}
.niiu-guide-listen,.niiu-guide-close{min-height:44px;min-width:44px;background:transparent;border:0;border-radius:14px;color:#cbc1e4;padding:8px 10px;font:700 14px Figtree,"Segoe UI",system-ui,sans-serif;cursor:pointer}
.niiu-guide-listen[aria-pressed=true]{color:#5cf2b4}
.niiu-guide-phases{display:flex;gap:6px;padding:0 16px 4px}
.niiu-guide-phase{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:6px 4px;border-radius:12px;background:#1b1233;color:#8b81a6;font-size:13px;font-weight:700;border:1px solid transparent;white-space:nowrap}
.niiu-guide-phase b{display:grid;place-items:center;flex:0 0 20px;height:20px;border-radius:50%;background:#2c2348;color:#cbc1e4;font-size:11px}
.niiu-guide-phase.is-now{background:#173126;color:#9df7d3;border-color:#2d6b52}
.niiu-guide-phase.is-now b{background:#5cf2b4;color:#06321f}
.niiu-guide-phase.is-done{color:#9df7d3}
.niiu-guide-phase.is-done b{background:#235c45;color:#9df7d3}
.niiu-guide-count{font-size:11px;font-weight:800;color:#5cf2b4;background:#0f2a1f;border-radius:8px;padding:1px 6px}
.niiu-guide-count.is-bump{animation:niiu-bump .6s ease-out}
.niiu-guide-voicenote{margin:6px 18px 0;padding:8px 12px;border-radius:12px;background:#22183e;color:#cbc1e4;font-size:13px}
.niiu-guide-body{max-height:calc(100dvh - 150px);overflow:auto;padding:14px 22px 22px;outline:none}
.niiu-guide-body h2{font-size:clamp(24px,7vw,30px);line-height:1.1;margin:6px 0 6px;letter-spacing:-.03em}
.niiu-guide-caption{margin:0 0 4px;color:#cbc1e4;font-size:15px}
.niiu-guide-note{margin:0 0 10px;padding:9px 12px;border-radius:12px;background:#2a2112;border:1px solid #6b5326;color:#ffd49a;font-size:14px}
.niiu-guide-action{display:block;width:100%;min-height:56px;padding:16px;margin-top:16px;border:0;border-radius:24px;background:linear-gradient(90deg,#5cf2b4,#22d8ff);color:#0b0716;font:800 18px/1.2 Figtree,"Segoe UI",system-ui,sans-serif;text-align:center;text-decoration:none;cursor:pointer;box-shadow:0 6px 22px #22d8ff38}
.niiu-guide-action:active,.niiu-guide-confirm:active,.niiu-guide-choice:active{transform:translateY(1px)}
.niiu-guide-confirm{display:block;width:100%;min-height:52px;padding:14px;margin-top:10px;border:1.5px solid #5cf2b4;border-radius:24px;background:transparent;color:#f6f1ff;font:750 16px/1.2 Figtree,"Segoe UI",system-ui,sans-serif;cursor:pointer}
.niiu-guide-escape{display:block;width:100%;min-height:44px;margin-top:10px;padding:10px;background:transparent;border:0;color:#a69cc6;font:600 14px Figtree,"Segoe UI",system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.niiu-guide-action:focus-visible,.niiu-guide-confirm:focus-visible,.niiu-guide-escape:focus-visible,.niiu-guide-choice:focus-visible,.niiu-guide-listen:focus-visible,.niiu-guide-close:focus-visible{outline:3px solid #ffb547;outline-offset:2px}
/* Telas do Android desenhadas: um aviso, uma barra de download, e o alvo pulsando. */
.niiu-guide-figure{margin:14px auto 2px;max-width:300px}
.niiu-guide-figure figcaption{font-size:10px;text-align:center;color:#8f85b0;margin-top:7px}
.niiu-guide-screen{position:relative;border-radius:20px;padding:16px;background:#f9faff;color:#263244;box-shadow:0 12px 26px #0004}
.niiu-guide-screen.is-sheet{border-radius:22px 22px 14px 14px;border-top:5px solid #c9cdd8}
.niiu-guide-sheet-title{display:block;font-size:17px;margin-bottom:4px}
.niiu-guide-sheet-line{display:block;font-size:14px;color:#526374;margin-bottom:14px}
.niiu-guide-sheet-buttons{display:flex;justify-content:space-around;align-items:center;gap:8px}
.niiu-guide-plain{color:#526374;font-weight:650;padding:10px 12px}
.niiu-guide-screen.is-toast{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#2b2f38;color:#fff;border-radius:14px;padding:12px 12px 12px 16px}
.niiu-guide-toast-line{font-size:14px}
.niiu-guide-screen.is-toast .niiu-guide-target{background:#fff;color:#1d3fb0;white-space:nowrap}
.niiu-guide-target{display:inline-grid;place-items:center;min-height:38px;padding:8px 14px;border-radius:12px;background:#e8eeff;color:#1d3fb0;font-weight:800;outline:4px solid #a228e6;outline-offset:3px;box-shadow:0 0 0 9px #ae35ef26;animation:niiu-pulse 1.7s ease-in-out infinite}
/* Os toques de um caso, numerados, cada um com o seu desenho. */
.niiu-guide-strip{list-style:none;margin:14px 0 2px;padding:0;counter-reset:niiu-tap;display:grid;gap:10px}
.niiu-guide-strip li{counter-increment:niiu-tap;display:grid;grid-template-columns:28px 1fr;grid-template-areas:"n pic" "n label";column-gap:12px;align-items:center}
.niiu-guide-strip li:before{content:counter(niiu-tap);grid-area:n;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#5cf2b4;color:#06321f;font-weight:800;font-size:14px}
.niiu-guide-strip-pic{grid-area:pic;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:8px 12px;border-radius:14px;background:#f9faff;color:#263244;font-size:13px;font-weight:650}
.niiu-guide-strip-pic .niiu-guide-target{min-height:32px;padding:5px 12px;outline-width:3px;box-shadow:0 0 0 6px #ae35ef26}
.niiu-guide-strip-pic:has(> .niiu-guide-target:only-child){justify-content:center}
.niiu-guide-target.is-glyph{min-width:42px;font-size:22px;line-height:1;padding:4px 8px}
.niiu-guide-strip-label{grid-area:label;font-size:14px;color:#e6dff8;margin-top:4px}
.niiu-guide-switch{flex:0 0 46px;height:26px;padding:0!important;background:#b8bcc7;border-radius:18px;position:relative;display:block!important}
.niiu-guide-switch:after{content:"";position:absolute;width:20px;height:20px;top:3px;left:3px;background:#fff;border-radius:50%}
.niiu-guide-switch.is-on{background:#219977}.niiu-guide-switch.is-on:after{left:23px}
/* Escolher o que apareceu: cartões grandes, um toque. */
.niiu-guide-choice{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;margin-top:10px;padding:12px 14px;border:1px solid #3a2f5c;border-radius:18px;background:#1b1233;color:#f6f1ff;text-align:left;cursor:pointer;font:inherit}
.niiu-guide-choice-glyph{flex:0 0 40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#2c2348;font-size:22px}
.niiu-guide-choice-words strong{display:block;font-size:16px}
.niiu-guide-choice-words span{display:block;font-size:13px;color:#b5aad6}
/* Vitórias. */
.niiu-guide-celebrate{text-align:center;padding:26px 6px 14px;cursor:pointer}
.niiu-guide-celebrate h2{font-size:28px}
.niiu-guide-badge{display:grid;place-items:center;width:88px;height:88px;margin:4px auto 14px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#5cf2b4,#22a97f);color:#06321f;font-size:44px;box-shadow:0 10px 30px #22d8ff33;animation:niiu-pop .5s ease-out}
.niiu-guide-portrait{position:relative;width:76px;height:76px;margin:6px auto 12px;border-radius:24px;background:radial-gradient(circle at 30% 22%,#e6acff,#b030ea 55%,#7622bc);box-shadow:0 6px 0 #512581,0 8px 26px #b52eff40;transform:rotate(-5deg)}
.niiu-guide-portrait:before,.niiu-guide-portrait:after{content:"";position:absolute;top:30px;width:7px;height:19px;border-radius:4px;background:#fff}
.niiu-guide-portrait:before{left:24px}.niiu-guide-portrait:after{right:24px}
@keyframes niiu-pulse{0%,100%{outline-color:#a228e6;box-shadow:0 0 0 9px #ae35ef22}50%{outline-color:#7c14c3;box-shadow:0 0 0 14px #ae35ef45}}
@keyframes niiu-pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
@keyframes niiu-bump{0%{transform:scale(1)}40%{transform:scale(1.45)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.niiu-guide-target,.niiu-guide-badge,.niiu-guide-count{animation:none!important}}
@media(max-height:620px){.niiu-guide-body{max-height:calc(100dvh - 128px);padding:10px 18px 16px}.niiu-guide-figure{margin-top:8px}.niiu-guide-portrait{display:none}.niiu-guide-action{margin-top:12px}}
/* [N4] A ativação inteira (connect): no celular ocupa a tela toda, a primeira tela espera um instante, o botão espera o link,
   e cada vitória solta confete. */
.niiu-install-guide:not([open]){display:none}
@media(max-width:540px){.niiu-install-guide[open]{display:flex;flex-direction:column;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;border:0;border-radius:0;background:radial-gradient(ellipse at 50% 0,#3a1f6a 0,transparent 60%),#120c24}
 .niiu-install-guide[open] .niiu-guide-body{flex:1;min-height:0;max-height:none;display:flex;flex-direction:column;justify-content:safe center;padding:18px 24px 28px}
 .niiu-install-guide[open] .niiu-guide-top{padding-top:max(10px,env(safe-area-inset-top))}
 .niiu-install-guide[open] .niiu-guide-body>h2,.niiu-install-guide[open] .niiu-guide-body>.niiu-guide-caption{text-align:center}}
.niiu-guide-spinner{width:34px;height:34px;margin:22px auto 0;border-radius:50%;border:4px solid #2c2348;border-top-color:#5cf2b4;animation:niiu-spin .9s linear infinite}
.niiu-guide-action.is-waiting,.niiu-guide-action:disabled{background:#2c2348;color:#cbc1e4;box-shadow:none;cursor:progress}
.niiu-guide-portrait.is-hopping{animation:niiu-hop 1.4s ease-in-out infinite}
.niiu-guide-badge.is-warn{background:radial-gradient(circle at 50% 35%,#ffd58a,#e39a2c);color:#3a2300;font-weight:900}
.niiu-guide-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:3}
.niiu-guide-confetti i{position:absolute;top:34%;left:50%;width:8px;height:13px;border-radius:2px;background:var(--c);opacity:0;animation:niiu-confetti 1.25s cubic-bezier(.15,.75,.3,1) var(--d) forwards}
@keyframes niiu-spin{to{transform:rotate(360deg)}}
@keyframes niiu-hop{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(-5deg) translateY(-9px)}}
@keyframes niiu-confetti{0%{opacity:1;transform:translate(-50%,-50%) rotate(0)}80%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y) + 60px)) rotate(var(--r))}}
@media(prefers-reduced-motion:reduce){.niiu-guide-spinner,.niiu-guide-portrait.is-hopping{animation:none!important}.niiu-guide-confetti{display:none}}
/* Lembrete de voltar à ativação (centro da tela, deixa o menu de baixo livre). */
.niiu-restore-reminder{box-sizing:border-box;position:fixed;z-index:2147483646;left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;width:min(360px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:30px 24px 24px;background:radial-gradient(ellipse at 50% 0,#5a328e70,transparent 68%),#18102d;border:1px solid #9b83ca;border-radius:28px;box-shadow:0 22px 80px #06040ea8,0 0 0 7px #b560ff0c;font:16px/1.4 Figtree,"Segoe UI",system-ui,sans-serif;text-align:center;color:#f6f1ff}
.niiu-restore-portrait{position:relative;display:block;width:64px;height:64px;margin-bottom:18px;border-radius:22px;background:radial-gradient(circle at 28% 20%,#e6acff,#b030ea 52%,#7622bc);box-shadow:0 5px 0 #512581,0 7px 25px #b52eff35;transform:rotate(-5deg)}
.niiu-restore-eyes:before,.niiu-restore-eyes:after{content:"";position:absolute;top:26px;width:6px;height:16px;border-radius:3px;background:#fff}
.niiu-restore-eyes:before{left:20px}.niiu-restore-eyes:after{right:20px}
.niiu-restore-portrait:after{content:"";position:absolute;left:23px;bottom:-12px;width:22px;height:4px;border-radius:50%;background:#5cf2b4}
.niiu-restore-kicker{font-size:10px;font-weight:800;letter-spacing:.13em;color:#5cf2b4;margin-top:5px}
.niiu-restore-title{font-size:27px;line-height:1.12;letter-spacing:-.035em;margin:10px 0;color:#fff}
.niiu-restore-copy{font-size:15px;line-height:1.4;color:#cbc1e4;margin:0 0 22px;max-width:260px}
.niiu-restore-action{box-sizing:border-box;font:750 16px/1.25 Figtree,"Segoe UI",system-ui,sans-serif;padding:16px 18px;min-height:54px;width:100%;text-align:center;cursor:pointer;border:0;border-radius:23px;background:linear-gradient(90deg,#5cf2b4,#22d8ff);color:#0b0716;box-shadow:0 5px 18px #70ffdf19}
.niiu-restore-action:active{transform:translateY(1px)}
.niiu-restore-dismiss{position:absolute;right:9px;top:9px;border:0;border-radius:50%;background:#ffffff12;color:#cbc1e4;font:24px Figtree,"Segoe UI",system-ui,sans-serif;min-width:44px;min-height:44px;cursor:pointer}
.niiu-restore-reminder button:focus-visible{outline:3px solid #ffb547;outline-offset:3px}
@media(max-height:420px){.niiu-restore-reminder{padding:20px 24px}.niiu-restore-portrait{display:none}.niiu-restore-title{font-size:23px}.niiu-restore-copy{margin-bottom:12px}}
