/* Keep the overview spacing local to this screen. */
#wrap.portal-wide-layout #container > .inner:has(.portal-overview) { padding-top: 28px; padding-bottom: 120px; }
#container > .inner:has(.portal-overview) > .breadcrumb-wrap { margin-bottom: 0; }
.portal-overview { color: #1e293b; padding-bottom: 0; }
.portal-overview * { box-sizing: border-box; }
.portal-overview section { margin: 0; padding: 0; }
.portal-overview .page-title { font-size: 31px; font-weight: 700; line-height: 41px; margin: 30px 0 46px; text-align: center; }
.portal-overview .stack60 { display: flex; flex-direction: column; gap: 60px; }
.portal-overview .stack16 { display: flex; flex-direction: column; gap: 16px; }
.portal-overview .stack24 { display: flex; flex-direction: column; gap: 24px; }
.portal-overview .form-head { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; padding: 0 0 0 10px; border: 0; }
.portal-overview .stack24 > .form-head--plain { margin-bottom: -14px; }
.portal-overview .form-head__bullet { width: 8px; height: 8px; border-radius: 50%; background: #2f6ee5; flex-shrink: 0; }
.portal-overview .form-head__title { margin: 0; font-size: 21px; font-weight: 700; line-height: 1.5; color: #1e293b; }
.portal-overview .diagram { background: #fff; border: 1px solid #ced6dd; border-radius: 12px; overflow: hidden; }
.portal-overview .diagram__bar { margin: 0; padding: 23px 28px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; font-size: 26px; font-weight: 600; line-height: 1.5; text-align: center; word-break: keep-all; }
.portal-overview .dg-b { color: #1a46ac; }
.portal-overview .diagram__bar { text-wrap: pretty; }
.portal-overview .dg-r { color: #e30425; }
.portal-overview .figure { position: relative; margin: 0; padding: 28px; }
.portal-overview .figure img { display: block; width: 100%; height: auto; }
.portal-overview .figure__zoom { position: absolute; top: 16px; right: 16px; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; border: 1px solid #ced6dd; background: #fff; color: #64748b; cursor: pointer; }
.portal-overview .figure__zoom:hover { border-color: #256ef4; color: #256ef4; }
.portal-overview button:focus-visible { outline: 2px solid #256ef4; outline-offset: 3px; }
.portal-overview .overview-zoom { position: fixed; inset: 0; width: min(1400px, 94vw); max-width: 94vw; max-height: 90vh; margin: auto; padding: 56px 24px 24px; border: 0; border-radius: 12px; background: #fff; overflow: auto; }
.portal-overview .overview-zoom::backdrop { background: rgba(15, 23, 42, .75); }
.portal-overview .overview-zoom img { display: block; width: 100%; min-width: 700px; height: auto; }
.portal-overview .overview-zoom-close { position: absolute; right: 12px; top: 8px; width: 40px; height: 40px; font-size: 30px; border: 0; background: #fff; color: #33404f; cursor: pointer; }
@media (max-width: 767px) {
    .portal-overview .page-title { font-size: 26px; line-height: 34px; margin: 24px 0 32px; }
    .portal-overview .stack60 { gap: 36px; }
    .portal-overview .form-head__title { font-size: 20px; }
    .portal-overview .diagram__bar { font-size: 18px; padding: 18px 20px; }
    .portal-overview .figure { padding: 16px; }
}