:root {
    color-scheme: light;
    font-family: "Segoe UI", system-ui, sans-serif;
    --portal-ink: var(--colorNeutralForeground1, #17233c);
    --portal-muted: var(--colorNeutralForeground2, #5b6475);
    --portal-line: var(--colorNeutralStroke2, #dfe4ec);
    --portal-paper: var(--colorNeutralBackground1, #ffffff);
    --portal-canvas: var(--colorNeutralBackground2, #f5f7fb);
    --portal-subtle: var(--colorNeutralBackground3, #f8faff);
    --portal-hover: var(--colorSubtleBackgroundHover, #edf4ff);
    --portal-accent: var(--colorBrandBackground, #175cd3);
    --portal-accent-dark: var(--colorBrandBackgroundHover, #1147a5);
    --portal-on-accent: var(--colorNeutralForegroundOnBrand, #ffffff);
    --portal-success-background: var(--colorStatusSuccessBackground1, #ecf8f1);
    --portal-success-border: var(--colorStatusSuccessBorder1, #a6d9ba);
    --portal-success-accent: var(--colorStatusSuccessBackground3, #107c41);
    --portal-info-background: var(--colorBrandBackground2, #f1f6ff);
    --portal-info-border: var(--colorBrandStroke2, #b8cae8);
}

fluent-checkbox {
    min-width: 24px;
}

html, body { margin: 0; min-height: 100%; }
body { background: var(--portal-canvas); color: var(--portal-ink); overflow: auto; }
body[data-theme="dark"] { color-scheme: dark; }
a { color: var(--portal-accent); }

.portal-theme-toggle { flex: 0 0 auto; margin-left: auto; }
.portal-header-menu { box-sizing: border-box; justify-content: space-between; padding-inline: .75rem; }
.portal-header-menu__name { font-size: 1rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-brand { align-items: center; color: var(--portal-ink); display: inline-flex; gap: .7rem; text-decoration: none; }
.portal-brand__mark { align-items: center; background: var(--portal-accent); border-radius: .7rem; color: var(--portal-on-accent); display: inline-flex; font-size: 1.35rem; font-weight: 700; height: 2.65rem; justify-content: center; width: 2.65rem; }
.portal-brand strong, .portal-brand small { display: block; }
.portal-brand small, .portal-header__secure { color: var(--portal-muted); font-size: .78rem; }
.portal-main { box-sizing: border-box; margin: 0 auto; max-width: 76rem; padding: clamp(1.25rem, 4vw, 3rem); width: 100%; }
.portal-footer { align-items: center; border-top: 1px solid var(--portal-line); color: var(--portal-muted); display: flex; font-size: .8rem; gap: 1rem; justify-content: space-between; padding: 1.1rem clamp(1rem, 4vw, 3rem); }
.portal-page-heading { margin-bottom: 1.4rem; max-width: 48rem; }
.portal-page-heading--compact { margin-bottom: .75rem; }
.portal-page-heading h1, .portal-auth-intro h1, .portal-state h1 { font-size: clamp(1.65rem, 4vw, 2.5rem); letter-spacing: -.035em; margin: .15rem 0 .55rem; }
.portal-page-heading p, .portal-auth-intro p, .portal-state p { color: var(--portal-muted); line-height: 1.55; }
.portal-eyebrow { color: var(--portal-accent) !important; font-size: .76rem; font-weight: 700; letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.portal-auth-intro { padding-top: 1rem; }
.portal-state { background: var(--portal-paper); border: 1px solid var(--portal-line); border-radius: .9rem; box-shadow: 0 .5rem 2rem rgba(23,35,60,.06); margin: 8vh auto; max-width: 38rem; padding: clamp(1.25rem, 4vw, 2.5rem); }
.portal-link-button { background: var(--portal-accent); border-radius: .45rem; color: var(--portal-on-accent); display: inline-block; font-weight: 600; padding: .7rem 1rem; text-decoration: none; }
.portal-link-button:hover, .portal-link-button:focus-visible { background: var(--portal-accent-dark); }

@media (max-width: 44rem) {
    .portal-header__secure { display: none; }
    .portal-main { padding: 1rem; }
    .portal-auth-shell { grid-template-columns: minmax(0, 1fr); margin-top: 1rem; }
    .portal-footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}


.my-3-o {
    margin-bottom: 0px;
    margin-top: 0px;
}
