.page-help-trigger { display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:8px 12px; border:1px solid #b7cee3; border-radius:9px; background:#fff; color:#145d91; font-family:inherit; font-size:14px; font-weight:700; line-height:1.3; cursor:pointer; white-space:nowrap; }
.page-help-trigger>span:first-child { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#e4f2ff; font-weight:800; }
.page-help-login { position:fixed; inset:20px 188px auto auto; z-index:10; }
.page-help-open { overflow:hidden; }
.page-help-dialog { width:min(940px,calc(100vw - 28px)); max-width:none; height:fit-content; max-height:calc(100dvh - 28px); margin:auto; padding:0; box-sizing:border-box; border:1px solid #ccdceb; border-radius:18px; color:#183349; background:white; box-shadow:0 24px 100px #0c274b55; overflow:hidden; }
.page-help-dialog[open] { display:flex; flex-direction:column; }
.page-help-dialog::backdrop { background:#082138a6; }
.page-help-header,.page-help-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; flex-shrink:0; }
.page-help-header { border-bottom:1px solid #e1eaf2; background:#f5faff; }
.page-help-header span { color:#4c6b87; font-size:14px; }
.page-help-header h2 { margin:4px 0 0; font-size:clamp(20px,2.2vw,26px); line-height:1.25; overflow-wrap:anywhere; }
.page-help-close { flex-shrink:0; width:38px; height:38px; border-radius:9px; border:1px solid #b7cee3; background:#fff; color:#145d91; font-size:26px; cursor:pointer; }
.page-help-body { padding:22px 24px; overflow:auto; overscroll-behavior:contain; min-height:0; }
.page-help-body h3 { margin:0 0 9px; font-size:17px; line-height:1.4; }
.page-help-body p { margin:0; font-size:16px; line-height:1.65; overflow-wrap:anywhere; }
.page-help-overview { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:24px; align-items:center; margin-bottom:22px; }
.page-help-overview figure { margin:0; }
.page-help-overview img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; border-radius:12px; background:#f5faff; }
.page-help-overview figcaption { margin-top:5px; font-size:12px; color:#526f87; text-align:center; }
.page-help-steps { list-style:none; padding:0; margin:0 0 22px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.page-help-steps li { border:1px solid #d7e6f3; border-radius:12px; padding:16px; background:#fbfdff; }
.page-help-step-mark { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.page-help-step-icon { width:40px; height:40px; display:grid; place-items:center; border-radius:10px; background:#e3f2ff; color:#0874c5; }
.page-help-step-icon svg { width:24px; height:24px; stroke:currentColor; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.page-help-step-mark b { font-size:22px; color:#46769c; }
.page-help-note { border-inline-start:4px solid #db9c24; border-radius:8px; background:#fff9ed; padding:16px; }
.page-help-note p { color:#654d24; }
.page-help-footer { border-top:1px solid #e1eaf2; justify-content:flex-end; }
.page-help-footer .primary-button,.page-help-footer .secondary-button { font-size:14px; }
.page-help-dialog :focus-visible,.page-help-trigger:focus-visible { outline:3px solid #0787da; outline-offset:3px; }
@media(max-width:650px) {
 .page-help-overview { grid-template-columns:1fr; gap:12px; }
 .page-help-overview figure { width:180px; justify-self:center; }
 .page-help-steps { grid-template-columns:1fr; }
 .page-help-steps li { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; }
 .page-help-step-mark { flex-direction:column; gap:7px; justify-content:flex-start; margin:0; }
 .page-help-header,.page-help-footer,.page-help-body { padding:16px; }
 .page-help-footer { flex-wrap:wrap; gap:8px; }
 .topbar .page-help-trigger { padding:7px; font-size:12px; gap:4px; }
 .topbar .breadcrumbs { min-width:0; flex:1; }
 .topbar .breadcrumbs strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .page-help-login { inset:12px auto auto 12px; }
 .login-screen .login-logo { margin-top:52px; }
}
