/* Openings · Onboarding e Ajuda Contextual 1.1.0
   Namespace oon-* to avoid changing Grappling 3D, existing page layouts and video players. */
.oon-ui,.oon-ui *,.oon-floating-help,.oon-nav-help,.oon-floating-help *,.oon-nav-help * {box-sizing:border-box}
:root {
 --oon-bg:#ffffff;--oon-ink:#112338;--oon-muted:#526377;--oon-stroke:#dfe7f0;
 --oon-primary:#1d5ed4;--oon-soft:#edf4ff;--oon-shadow:0 20px 90px rgba(12,26,49,.27);
}
.oon-floating-help, .oon-nav-help, .oon-dialog {font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;}
.oon-floating-help,.oon-nav-help {
 border:1px solid #bfd3f3!important; background:#ffffff!important; color:#124caa!important;
 cursor:pointer; display:inline-flex; justify-content:center; align-items:center; gap:6px;
 font-size:13px; font-weight:730; letter-spacing:0; line-height:1.25;
 border-radius:50px; padding:10px 16px; min-height:40px;
 box-shadow:0 4px 18px rgba(14,42,80,.13); text-decoration:none;
}
.oon-floating-help:before,.oon-nav-help:before {content:'?'; background:#1d5ed4; color:white; width:21px; height:21px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-weight:900; font-size:13px; flex-shrink:0}
.oon-floating-help:hover,.oon-nav-help:hover {background:#edf4ff!important; border-color:#9fbef0!important}
.oon-floating-help:focus-visible,.oon-nav-help:focus-visible,.oon-btn:focus-visible {outline:3px solid #94bdfb!important; outline-offset:3px!important}
.oon-floating-help {position:fixed;z-index:6000;bottom:24px;right:24px}
.oon-nav-help {box-shadow:none!important;min-height:40px;padding:8px 12px;white-space:nowrap}
.oon-floating-help[hidden],.oon-nav-help[hidden],.oon-ui [hidden] {display:none!important}
.oon-overlay {position:fixed;inset:0;z-index:2147483000;background:rgba(12,24,44,.68);backdrop-filter:blur(1px)}
.oon-overlay.oon-guided {background:transparent;backdrop-filter:none}
.oon-spotlight {position:fixed;z-index:2147483002;pointer-events:none;border:3px solid #ffffff;border-radius:12px;box-shadow:0 0 0 9999px rgba(12,24,44,.64),0 0 0 4px rgba(45,121,236,.84);transition:left .13s ease,top .13s ease,width .13s ease,height .13s ease}
.oon-dialog {
 --oon-w:410px; position:fixed;left:50%;top:50%;z-index:2147483005;
 width:min(var(--oon-w),calc(100vw - 28px));max-height:min(86vh,680px);overflow:auto;
 background:var(--oon-bg);color:var(--oon-ink);border:1px solid var(--oon-stroke);
 border-radius:19px;padding:27px 25px 23px;box-shadow:var(--oon-shadow);
 transform:none;line-height:1.5;text-align:left;font-size:14px;
}
.oon-dialog.oon-center,.oon-dialog.oon-help-panel,.oon-dialog.oon-offer-panel {left:50%!important;top:50%!important;right:auto!important;transform:translate(-50%,-50%)}
.oon-dialog.oon-help-panel,.oon-dialog.oon-offer-panel {--oon-w:530px}
.oon-dialog .oon-eyebrow {font-size:11px;letter-spacing:.09em;color:var(--oon-primary);text-transform:uppercase;font-weight:850;margin:0 30px 9px 0}
.oon-dialog .oon-title {font-size:clamp(21px,3vw,26px);line-height:1.2;letter-spacing:-.025em;font-weight:800;color:var(--oon-ink);margin:0 26px 12px 0}
.oon-dialog .oon-summary {font-size:14px;line-height:1.7;color:var(--oon-muted);margin:0 0 15px}
.oon-dialog .oon-helper-note {font-size:12px;color:var(--oon-muted);margin:12px 0 2px}
.oon-dialog .oon-close {position:absolute;top:14px;right:14px;border:1px solid var(--oon-stroke);width:32px;height:32px;border-radius:10px;background:#f5f8fd;color:var(--oon-ink);display:grid;place-items:center;cursor:pointer;font-size:23px;line-height:1}
.oon-help-list {padding:0 0 0 21px;margin:16px 0 6px;color:var(--oon-ink);display:grid;gap:11px}
.oon-help-list li {padding-left:5px;font-size:14px;line-height:1.65}
.oon-help-list li::marker {color:var(--oon-primary);font-weight:800}
.oon-progress {width:100%;height:5px;border-radius:20px;background:#e9eef7;overflow:hidden;margin:14px 0 4px}
.oon-progress-bar {display:block;height:100%;border-radius:20px;background:var(--oon-primary);transition:width .15s}
.oon-footer {margin-top:21px;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.oon-btn {border:1px solid transparent;cursor:pointer;border-radius:10px;min-height:40px;padding:9px 14px;font-weight:720;font-size:13px;line-height:1.25;background:#f0f4fb;color:#25405e;font-family:inherit}
.oon-btn:hover {filter:brightness(.97)}
.oon-btn-primary {color:#fff;background:var(--oon-primary);border-color:var(--oon-primary)}
.oon-btn-quiet {background:transparent;color:#5c6877;padding-inline:10px}
.oon-btn-secondary {background:#edf4ff;border-color:#bfd3f3;color:#124caa}
@media(max-width:650px) {
  .oon-floating-help {right:13px;bottom:calc(75px + env(safe-area-inset-bottom,0px));padding:10px 13px;font-size:12px}
  .oon-nav-help {font-size:12px;padding:7px 10px}
  .oon-dialog {border-radius:17px;max-height:calc(100dvh - 26px);padding:23px 18px 17px}
  .oon-dialog.oon-tour-step:not(.oon-center),.oon-dialog.oon-bottom {position:fixed;left:12px!important;right:12px!important;top:auto!important;bottom:calc(13px + env(safe-area-inset-bottom,0px))!important;width:calc(100vw - 24px)!important;max-height:min(65dvh,490px);transform:none!important}
  .oon-help-panel .oon-footer {gap:6px}
  .oon-dialog .oon-title {font-size:22px}
  .oon-btn {min-height:40px}
}
@media(max-width:365px) {
  .oon-btn {font-size:12px;padding:8px 10px}
  .oon-dialog .oon-footer {justify-content:stretch}
  .oon-footer .oon-btn {flex:1}
}
@media(prefers-reduced-motion:reduce){.oon-spotlight,.oon-progress-bar{transition:none}}
/* Respect either explicit app theme or operating system dark mode without affecting the application. */
html[data-theme="dark"] .oon-ui,html.dark .oon-ui,html[data-theme="dark"] ~ body .oon-ui,html.dark body .oon-ui {
 --oon-bg:#16243a;--oon-ink:#ecf3ff;--oon-muted:#b9c5d6;--oon-stroke:#35465d;--oon-primary:#86b5ff;
}
@media(prefers-color-scheme:dark){
 html:not([data-theme="light"]):not(.light) .oon-ui {
  --oon-bg:#16243a;--oon-ink:#ecf3ff;--oon-muted:#b9c5d6;--oon-stroke:#35465d;--oon-primary:#86b5ff;
 }
}
/* Dark help layers: primary CTA needs a dedicated legible surface when text color is dark-blue. */
html[data-theme="dark"] .oon-dialog .oon-btn-primary,html.dark .oon-dialog .oon-btn-primary {background:#2563eb;border-color:#2563eb;color:#fff}

@media(prefers-color-scheme:dark) {html:not([data-theme="light"]):not(.light) .oon-dialog .oon-btn-primary {background:#2563eb;border-color:#2563eb;color:#fff}}