/* Actual Fluent UI Blazor 5.0.1 controls own sizing, card surfaces and MessageBox presentation.
   Generated rules below are copied from Web by tools/sync-auth-presentation.py. */
/* BEGIN GENERATED WEB ACCOUNT PRESENTATION */
/* BEGIN SHARED FLUENT ACCOUNT DESIGN — sync with tools/sync-auth-presentation.py. */
:root, .public-site {
    --fontFamilyBase: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --fontSizeBase900: clamp(calc(20rem / 9), 4.5vw, calc(32rem / 9));
    --lineHeightBase900: 1.15;
    --fontSizeBase800: clamp(2rem, 1.5rem + 1.5vw, calc(8rem / 3));
    --lineHeightBase800: 1.2;
    --fontSizeBase700: clamp(1.75rem, 1.5rem + 1vw, calc(20rem / 9));
    --lineHeightBase700: 1.25;
    --fontSizeBase600: clamp(1.5rem, 1.25rem + .75vw, calc(16rem / 9));
    --lineHeightBase600: 1.25;
    --fontSizeBase500: clamp(1.125rem, 1rem + .3vw, calc(4rem / 3));
    --lineHeightBase500: 1.4;
    --fontSizeBase400: var(--fontSizeBase300);
    --lineHeightBase400: 1.4;
    --fontSizeBase300: 1rem;
    --lineHeightBase300: 1.6;
    --fontSizeBase200: .85rem;
    --lineHeightBase200: 1.5;
    --fontWeightRegular: 400;
    --fontWeightMedium: 500;
    --fontWeightSemibold: 600;
}
:root { font-family: var(--fontFamilyBase); font-size: 112.5%; }
* { box-sizing: border-box; }
body { margin: 0; line-height: var(--lineHeightBase300, 1.6); }
h1 { font-size: var(--fontSizeBase800, calc(8rem / 3)); line-height: var(--lineHeightBase800, 1.2); font-weight: var(--fontWeightMedium, 500); letter-spacing: -.025em; }
h2 { font-size: var(--fontSizeBase600, calc(16rem / 9)); line-height: var(--lineHeightBase600, 1.25); font-weight: var(--fontWeightMedium, 500); letter-spacing: -.015em; margin-block: var(--spacingVerticalM, .75rem); }
h3 { font-size: var(--fontSizeBase500, calc(4rem / 3)); line-height: var(--lineHeightBase500, 1.4); font-weight: var(--fontWeightSemibold, 600); letter-spacing: -.015em; }
p { line-height: inherit; }
label { font-size: var(--fontSizeBase300, 1rem); line-height: var(--lineHeightBase300, 1.6); }
button, input, select, textarea, fluent-button, fluent-anchor-button { font: inherit; }
button, fluent-button, fluent-anchor-button { font-weight: var(--fontWeightRegular, 400); }
/* Fluent button typography is set inside its shadow root through these tokens. */
:is(fluent-button, fluent-anchor-button):not(.representative-confirmations *) {
    --fontSizeBase300: .9rem;
    --fontWeightSemibold: var(--fontWeightRegular, 400);
    font-size: var(--fontSizeBase300);
}
fluent-link:focus-visible, button:not([slot="control"]):focus-visible { outline: 3px solid #0b4d86; outline-offset: 3px; }
fluent-link { text-decoration-line: none; }
fluent-link:hover { text-decoration-line: underline; }
code, pre { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; }
p, li, label, fluent-link, h1, h2, h3, code { overflow-wrap: anywhere; }
[id] { scroll-margin-block: 24px; }
.site-skip-link { position: fixed; top: 12px; left: 20px; z-index: 30; transform: translateY(calc(-100% - 24px)); padding: 12px 18px; background: #fff; border: 2px solid #0b4d86; line-height: 1.4; }
.site-skip-link:focus-within { transform: translateY(0); }
.validation-summary-errors { font-size: var(--fontSizeBase200, .85rem); line-height: var(--lineHeightBase200, 1.5); color: var(--colorPaletteRedForeground1, #bc2f32); border: 2px solid var(--colorPaletteRedForeground1, #bc2f32); padding: 16px 20px; margin-block: 20px; }
.validation-summary-errors:focus { outline: 3px solid #0b4d86; outline-offset: 4px; }
.validation-summary-valid, .field-validation-valid { display: none; }
.field-validation-error { display: block; margin-block: -8px 16px; }
.field-message, .field-validation-error, .fluent-validation-message { color: var(--colorPaletteRedForeground1, #bc2f32); font-size: var(--fontSizeBase200, .85rem); line-height: var(--lineHeightBase200, 1.5); }
.field-message { margin-block: var(--spacingVerticalXS, .25rem) var(--spacingVerticalM, .75rem); }
.field-message[slot="message"] { margin: 0; }
.field-message:empty { display: none; }
.field-help { color: var(--colorNeutralForeground2, #424242); font-size: var(--fontSizeBase300, 1rem); line-height: var(--lineHeightBase300, 1.6); margin-block: var(--spacingVerticalXS, .25rem) var(--spacingVerticalM, .75rem); }
.fluent-validation-message :is(svg, fluent-icon) { display: none; }
@media (forced-colors: active) {
    button, input, select, textarea { border: 1px solid ButtonText; }
    fluent-link:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline-color: Highlight; }
}

/* Restore Fluent's default 14/20px font scale locally; the site root is 18px at default browser settings.
   Relative values preserve browser text-size preferences and zoom. Native Fluent controls retain their own typography. */
.representative-confirmations {
    --fontSizeBase300: calc(14rem / 18);
    --lineHeightBase300: calc(20rem / 18);
    --fontSizeBase500: calc(20rem / 18);
    --lineHeightBase500: calc(28rem / 18);
    font-size: var(--fontSizeBase300);
    line-height: var(--lineHeightBase300);
}

/* Fluent owns button sizing and states; only destructive semantic colours are remapped. */
:is(.passkey-remove-button, .passkey-confirmations) {
    --colorBrandBackground: var(--colorPaletteRedBackground3, #c50f1f);
    --colorBrandBackgroundHover: var(--colorPaletteRedForeground2, #b10e1c);
    --colorBrandBackgroundPressed: var(--colorPaletteRedForeground1, #960b18);
}

/* One frame for all entry fields. Inset focus weight preserves the control dimensions. */
:is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea, fluent-text-input, fluent-text-area, fluent-number-input, fluent-dropdown) {
    --entry-border-color: var(--colorNeutralStrokeAccessible, #616161);
    --entry-focus-shadow: none;
}
:is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea, fluent-text-input, fluent-text-area, fluent-number-input, fluent-dropdown):focus-within {
    --entry-border-color: var(--entry-error-color, var(--colorBrandStroke1, #0f6cbd));
    --entry-focus-shadow: inset 0 0 0 2px var(--entry-border-color);
    outline: none;
}
:is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea, fluent-text-input, fluent-text-area, fluent-number-input, fluent-dropdown):is([aria-invalid="true"], .input-validation-error) {
    --entry-error-color: var(--colorPaletteRedForeground1, #bc2f32);
    --entry-border-color: var(--entry-error-color);
}
:is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea) {
    border: 1px solid var(--entry-border-color);
    border-radius: var(--borderRadiusMedium, .25rem);
    box-shadow: var(--entry-focus-shadow);
}
:is(fluent-text-input, fluent-text-area, fluent-number-input)::part(root) {
    border: 1px solid var(--entry-border-color);
    box-shadow: var(--entry-focus-shadow);
    outline: none;
}
:is(fluent-text-input, fluent-text-area, fluent-number-input)::part(root)::after { display: none; }
fluent-checkbox[aria-invalid="true"] { border: 2px solid var(--colorPaletteRedForeground1, #bc2f32); }
.field-validation-slot::part(message) { display: block; min-height: 2.7rem; }
@media (forced-colors: active) {
    :is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea, fluent-text-input, fluent-text-area, fluent-number-input, fluent-dropdown):focus-within { outline: 2px solid Highlight; outline-offset: 2px; }
}

/* END SHARED FLUENT ACCOUNT DESIGN */

.public-site {
    color-scheme: light;
    --colorBrandBackground: #0f6cbd;
    --colorBrandBackgroundHover: #115ea3;
    --colorBrandBackground2: #ebf3fc;
    --colorNeutralBackground1: #fff;
    --colorNeutralBackground2: #fafafa;
    --colorNeutralForeground1: #242424;
    --colorNeutralForeground2: #424242;
    --colorPaletteDarkOrangeForeground1: #b6480e;
    --colorPaletteGreenForeground1: #107c10;
    --site-blue: var(--colorBrandBackground, #0f6cbd);
    --site-blue-dark: var(--colorBrandBackgroundHover, #115ea3);
    --site-ink: #242424;
    --site-muted: #424242;
    --site-line: #e4eaf2;
    --site-max-width: 1240px;
    --site-gutter: clamp(20px, 3vw, 40px);
    color: var(--site-ink);
    background: #fff;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    font-family: var(--fontFamilyBase);
    font-size: 1rem;
    line-height: 1.6;
}
.public-site fluent-link { color: var(--site-blue); text-underline-offset: 4px; }
.public-site fluent-link:focus-visible, .public-site button:not([slot="control"]):focus-visible, .public-site summary:focus-visible { outline: 3px solid #0f6cbd; outline-offset: 5px; }
.public-site .site-header { display: block; padding: 0; background: #fff; border-bottom: 0; }
.landing-hero, .getting-started { width: 100%; max-width: var(--site-max-width); margin-inline: auto; padding-inline: var(--site-gutter); }
.hero-help { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; padding-block: 8px; line-height: 1.5; }
.public-site .site-main { display: block; max-width: none; min-height: 0; margin: 0; padding: 0; flex: 1; }
.landing-hero { margin-bottom: 24px; padding-block: 52px 48px; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); align-items: center; background: var(--colorBrandBackground2, #ebf3fc); border-radius: var(--borderRadiusXLarge, 8px); }
.hero-copy { padding-bottom: 8px; }
.hero-eyebrow, .welcome-eyebrow, .section-eyebrow, .information-eyebrow { font-size: var(--fontSizeBase200, .85rem); line-height: var(--lineHeightBase200, 1.5); font-weight: var(--fontWeightSemibold, 600); letter-spacing: .1em; text-transform: uppercase; }
.hero-eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 26px; color: #37688e; }
.hero-eyebrow > span { width: 21px; height: 2px; background: #5a9bd0; }
.hero-copy h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: var(--fontSizeBase900, calc(32rem / 9)); line-height: var(--lineHeightBase900, 1.15); letter-spacing: -.01em; font-weight: var(--fontWeightRegular, 400); }
.hero-copy h1 > span { display: block; margin-top: 6px; color: var(--colorPaletteDarkOrangeForeground1); }
.hero-copy h1[tabindex="-1"]:focus { outline: none; }
.hero-description { max-width: 475px; margin: 25px 0 23px; color: var(--site-muted); font-size: var(--fontSizeBase500, calc(4rem / 3)); line-height: 1.5; }
.hero-help { gap: 8px; font-size: 0.89rem; font-weight: 650; }
.public-site .welcome-card { min-width: 0; }
.welcome-eyebrow { margin: 0 0 10px; color: #526178; }
.welcome-card h2 { margin: 0 0 12px; font-size: var(--fontSizeBase700, calc(20rem / 9)); letter-spacing: -.025em; line-height: var(--lineHeightBase700, 1.25); font-weight: var(--fontWeightMedium, 500); color: var(--colorNeutralForeground1, #242424); }
.welcome-description { margin: 0 0 24px; color: var(--site-muted); font-size: var(--fontSizeBase300, 1rem); line-height: var(--lineHeightBase300, 1.6); }
.account-action-form { margin: 0 0 10px; }
.public-site .account-action { display: flex; justify-content: flex-start; width: 100%; margin: 0; }
.public-site [hidden] { display: none; }
.welcome-security { display: flex; align-items: flex-start; gap: 9px; margin-top: 25px; padding-top: 20px; border-top: 1px solid #edf0f5; }
.welcome-security svg { flex: 0 0 1.33rem; width: 1.33rem; height: 1.33rem; margin-top: calc((1lh - 1.33rem) / 2); color: var(--colorPaletteGreenForeground1); }
.welcome-security p { margin: 0; font-size: 0.89rem; font-weight: 600; line-height: 1.8; color: #57687e; }
.welcome-security p span { color: #526178; font-weight: 400; }
.welcome-card > fluent-link:last-child { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; margin: 15px 0 0 calc(1.33rem + 9px); padding-block: 8px; font-size: 0.89rem; font-weight: 550; line-height: 1.5; }
.account-unavailable { color: #596579; font-size: 0.89rem; }
.section-eyebrow { margin: 0; color: #526178; }
.information-eyebrow { margin: 0; color: var(--site-blue); }
@media (max-width: 1100px) {
    .landing-hero { padding-block: 42px 40px; }
}
@media (max-width: 750px) {
    .landing-hero { grid-template-columns: 1fr; gap: 30px; padding-block: 32px; }
    .hero-copy { padding: 0; }
    .hero-eyebrow { margin-bottom: 21px; }
    .hero-description { max-width: 550px; margin-top: 18px; }
    .public-site .welcome-card { max-width: 560px; }
}
@media (prefers-reduced-motion: reduce) {
    .public-site .account-action { transition: none; }
}
.hero-copy, .account-action > span { min-width: 0; }
.workspace { max-width: var(--site-max-width); margin-inline: auto; padding: 2rem var(--site-gutter) 3rem; }
.workspace-intro { margin-bottom: 2rem; }
.workspace-intro h1 { margin: .7rem 0; }
.workspace-intro > p:not(.information-eyebrow) { font-size: var(--fontSizeBase500, calc(4rem / 3)); line-height: 1.5; }
.workspace-intro p:last-child, .workspace-muted { color: var(--colorNeutralForeground2, #424242); }
.workspace h3 { margin: .7rem 0; }
.workspace-card { min-width: 0; }
.passkey-preview { display: grid; gap: var(--spacingVerticalL, 1rem); }
.passkey-preview-card { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--spacingHorizontalL, 1rem); padding-block: var(--spacingVerticalL, 1rem); border-bottom: 1px solid var(--colorNeutralStroke2, #e0e0e0); }
.passkey-preview-card:last-child { border-bottom: 0; }
.passkey-preview-icon { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 50%; color: var(--colorBrandForeground1, #0f548c); background: var(--colorBrandBackground2, #ebf3fc); }
.passkey-preview-icon svg { width: 1.5rem; height: 1.5rem; }
.passkey-preview-card h2 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacingHorizontalS, .5rem); margin-top: 0; font-size: var(--fontSizeBase500, calc(4rem / 3)); line-height: var(--lineHeightBase500, 1.4); font-weight: var(--fontWeightSemibold, 600); }
.passkey-preview-card dl { display: grid; gap: var(--spacingVerticalS, .5rem); }
.passkey-preview-card dl div { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: var(--spacingHorizontalM, .75rem); }
.passkey-preview-card dt { color: var(--colorNeutralForeground2, #424242); }
.passkey-preview-card dd { margin: 0; }
.passkey-preview-card fluent-button.passkey-remove-button { margin-top: var(--spacingVerticalM, .75rem); }
.passkey-preview-add { margin-top: var(--spacingVerticalXL, 1.25rem); }
@media (max-width: 480px) {
    .passkey-preview-card { grid-template-columns: 1fr; }
    .passkey-preview-card dl div { grid-template-columns: 1fr; gap: 0; }
}
/* END GENERATED WEB ACCOUNT PRESENTATION */

/* Auth-only review navigation and ceremony status layout. */
.preview-panel { width: 100%; max-width: var(--site-max-width); margin-inline: auto; padding: var(--spacingVerticalM, .75rem) var(--site-gutter) var(--spacingVerticalXXL, 1.5rem); }
.preview-panel p { margin: 0 0 var(--spacingVerticalS, .5rem); font-size: var(--fontSizeBase200, .85rem); }
.preview-panel nav { display: flex; flex-wrap: wrap; gap: var(--spacingVerticalS, .5rem) var(--spacingHorizontalXXL, 1.5rem); }
.preview-panel fluent-link { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--fontSizeBase200, .85rem); }
#management-status { margin-block: var(--spacingVerticalL, 1rem); color: var(--colorNeutralForeground2, #424242); }