/* Resultoz "Show me how" helper (2026-10-26). Used with rz-howto.js. */
.rzh-dlg{--rzh-green:#0B7A43;--rzh-green-dk:#08502B;--rzh-navy:#14213D;--rzh-soft:#F6F8FB;--rzh-yellow:#F5C451;--rzh-text:#34405A;--rzh-line:#E6EAF0;
  font-family:'Nunito',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;color:var(--rzh-navy);background:#FFFFFF;border:0;border-radius:28px;padding:0;
  width:min(720px,calc(100vw - 32px));max-width:720px;max-height:calc(100dvh - 32px);overflow:hidden;box-shadow:0 30px 80px rgba(20,33,61,.35)}
.rzh-dlg[open]{display:flex;flex-direction:column}
.rzh-dlg::backdrop{background:rgba(20,33,61,.6)}
.rzh-dlg *,.rzh-dlg *::before,.rzh-dlg *::after{box-sizing:border-box}
html.rzh-locked,html.rzh-locked body{overflow:hidden}
.rzh-top{flex:0 0 auto;display:flex;align-items:center;gap:12px;padding:16px 16px 12px 22px;border-bottom:2px solid var(--rzh-line)}
.rzh-top-ic{flex:0 0 auto;width:48px;height:48px;border-radius:16px;background:#EAF6EF;color:var(--rzh-green);display:flex;align-items:center;justify-content:center}
.rzh-top h2{flex:1 1 auto;min-width:0;margin:0;font-size:clamp(21px,4.4vw,27px);font-weight:900;line-height:1.15;overflow-wrap:anywhere}
.rzh-x{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;min-height:56px;min-width:56px;padding:0 16px;border-radius:16px;border:3px solid var(--rzh-line);background:#FFFFFF;color:var(--rzh-navy);font-family:inherit;font-size:18px;font-weight:900;cursor:pointer}
.rzh-x:hover{border-color:var(--rzh-navy)}
.rzh-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:18px 22px 24px;display:flex;flex-direction:column;gap:16px}
.rzh-body p{margin:0;font-size:18px;line-height:1.45;color:var(--rzh-text)}
.rzh-q{font-size:clamp(22px,4.6vw,28px)!important;font-weight:900;color:var(--rzh-navy)!important}
.rzh-say{font-weight:800;color:#0B5A31!important;min-height:1em}
.rzh-pick{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.rzh-pick button{width:100%;min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px 8px;border-radius:24px;border:3px solid var(--rzh-line);background:var(--rzh-soft);color:var(--rzh-navy);font-family:inherit;font-size:19px;font-weight:900;line-height:1.15;text-align:center;cursor:pointer}
.rzh-pick button:hover,.rzh-pick button.rzh-guess{border-color:var(--rzh-green);background:#EAF6EF}
.rzh-pick .rzh-logo{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#FFFFFF;font-size:24px;font-weight:900}
.rzh-card{background:var(--rzh-soft);border-radius:24px;padding:18px 18px 18px 20px;display:flex;flex-direction:column;gap:10px}
.rzh-why{display:flex;align-items:flex-start;gap:12px}
.rzh-why svg{flex:0 0 auto;margin-top:2px}
.rzh-steps{list-style:none;margin:0;padding:0;counter-reset:rzh;display:flex;flex-direction:column;gap:10px}
.rzh-steps li{counter-increment:rzh;position:relative;padding:4px 0 4px 54px;min-height:42px;font-size:18px;line-height:1.45;color:var(--rzh-navy);overflow-wrap:anywhere}
.rzh-steps li::before{content:counter(rzh);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--rzh-green);color:#FFFFFF;font-weight:900;font-size:20px;display:flex;align-items:center;justify-content:center}
.rzh-steps b{font-weight:900;background:#FFF6DB;border-radius:6px;padding:0 4px}
.rzh-note{font-size:16px!important}
.rzh-tip{display:flex;align-items:flex-start;gap:12px;background:#FFF6DB;border:2px solid var(--rzh-yellow);border-radius:18px;padding:12px 14px}
.rzh-tip svg{flex:0 0 auto;margin-top:2px}
.rzh-tip p{color:var(--rzh-navy)!important}
.rzh-btns{display:flex;flex-wrap:wrap;gap:12px}
.rzh-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:inherit;font-size:20px;font-weight:900;line-height:1.15;color:#FFFFFF;background:var(--rzh-green);border:0;border-radius:18px;padding:14px 24px;min-height:58px;cursor:pointer;text-decoration:none;text-align:center;max-width:100%}
.rzh-btn:hover{background:var(--rzh-green-dk);color:#FFFFFF}
.rzh-btn.line{background:#FFFFFF;color:#0B6B3A;border:3px solid var(--rzh-green)}
.rzh-btn.line:hover{background:#EAF6EF;color:#0B6B3A}
.rzh-btn.ghost{background:transparent;color:var(--rzh-navy);border:3px solid var(--rzh-line)}
.rzh-btn svg{flex:0 0 auto}
.rzh-help{font-size:16px;font-weight:800;color:#0B6B3A}
.rzh-help:hover{color:var(--rzh-green-dk)}
.rzh-full{background:#F2FAF5;border:3px solid #0B7A43;border-radius:24px;padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.rzh-full p{color:#14213D!important}
.rzh-full .rzh-btn{background:var(--rzh-green);color:#FFFFFF}
.rzh-full .rzh-btn:hover{background:var(--rzh-green-dk);color:#FFFFFF}
.rzh-dlg :focus-visible{outline:3px solid #F5A623;outline-offset:3px}
@media (max-width:640px){
  .rzh-dlg{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;border-radius:0;margin:0}
  .rzh-pick{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rzh-btn{width:100%}
  .rzh-body{padding:16px 16px 28px}
  .rzh-top{padding:12px 12px 10px 16px}
}
@media (prefers-reduced-motion:no-preference){.rzh-dlg[open]{animation:rzh-pop .25s ease}}
@keyframes rzh-pop{0%{transform:scale(.94);opacity:0}100%{transform:scale(1);opacity:1}}
.rzh-top h2:focus{outline:none}

/* Round 7 fixes: host pages set button{width:100%} and li padding. These rules win so the title never squeezes
   to one letter per line, Close never covers it, and the step numbers never cover words. */
.rzh-dlg .rzh-top{display:flex!important;flex-wrap:nowrap!important;align-items:center!important}
.rzh-dlg .rzh-top h2{flex:1 1 auto!important;min-width:6em!important;width:auto!important;overflow-wrap:normal!important;word-break:normal!important;writing-mode:horizontal-tb!important;text-align:left!important;padding:0!important}
.rzh-dlg .rzh-x{width:auto!important;flex:0 0 auto!important;margin:0!important;position:static!important;white-space:nowrap}
.rzh-dlg button,.rzh-dlg a{box-sizing:border-box}
.rzh-dlg .rzh-btn{width:auto}
.rzh-dlg .rzh-steps li{display:block!important;position:relative!important;padding:7px 0 7px 56px!important;margin:0!important;min-height:44px!important;background:none!important;border:0!important;text-indent:0!important;overflow-wrap:normal!important;word-break:normal!important}
.rzh-dlg .rzh-steps li::before{position:absolute!important;left:0!important;top:2px!important;width:40px!important;height:40px!important;margin:0!important}
.rzh-doit li{font-size:20px!important;font-weight:800}
.rzh-yes{font-size:22px!important;min-height:64px!important;padding:16px 30px!important}
.rzh-self{margin:0;text-align:left}
.rzh-linkbtn{width:auto!important;background:none!important;border:0!important;padding:8px 0!important;min-height:44px;font-family:inherit;font-size:16px;font-weight:800;color:#0B6B3A;text-decoration:underline;cursor:pointer}
@media (max-width:640px){.rzh-dlg .rzh-x span{display:none}.rzh-dlg .rzh-x{padding:0 12px}.rzh-dlg .rzh-btn{width:100%}}
