/* Shared visual language for the public site and signed-in workspace. */
:root {
    /* One palette for the sidebar, primary controls and Tailwind utilities. */
    --eif-primary-rgb: 30 27 58;
    --eif-primary-hover-rgb: 46 40 73;
    --eif-primary: rgb(var(--eif-primary-rgb));
    --eif-primary-hover: rgb(var(--eif-primary-hover-rgb));
    --eif-primary-soft: #eef0ff;
    --eif-ink: #1e1b3a;
    --eif-muted: #6b6880;
    --eif-page: #f7f7fb;
    --eif-line: #e7e6f0;
    --eif-neutral: #f1f0f7;
    --eif-neutral-ink: #4b4867;
    --eif-done: #dcfce7;
    --eif-done-ink: #166534;
    --eif-pending: #fef3c7;
    --eif-pending-ink: #92400e;
    --eif-alert: #ffe4e6;
    --eif-alert-ink: #be123c;
    --eif-welcome: linear-gradient(110deg, #eef0ff, #fce7f3 60%, #ffedd5);
    --eif-font: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
/* Also cover prebuilt vendor utilities; keep page-specific and disabled rules stronger. */
:where(.eif-app, .eif-public) .bg-indigo-600 { background-color: rgb(var(--eif-primary-rgb) / var(--tw-bg-opacity, 1)); }
:where(.eif-app, .eif-public) .bg-indigo-700 { background-color: rgb(var(--eif-primary-hover-rgb) / var(--tw-bg-opacity, 1)); }
:where(.eif-app, .eif-public) .hover\:bg-indigo-600:hover:where(:not(:disabled):not([aria-disabled="true"])) { background-color: rgb(var(--eif-primary-rgb) / var(--tw-bg-opacity, 1)); }
:where(.eif-app, .eif-public) .hover\:bg-indigo-700:hover:where(:not(:disabled):not([aria-disabled="true"])) { background-color: rgb(var(--eif-primary-hover-rgb) / var(--tw-bg-opacity, 1)); }
body.eif-app, body.eif-public {
    font-family: var(--eif-font);
    color: var(--eif-ink);
    background: var(--eif-page);
}
body.eif-public { display: flex; flex-direction: column; min-height: 100vh; }
.eif-public > main { flex: 1; min-width: 0; }
.eif-public footer.footer { background: var(--eif-ink); }
.eif-public .hero { background: var(--eif-welcome); }
.eif-public .hero h1 { color: var(--eif-ink); }
.eif-public .hero .highlight { color: var(--eif-primary); }
.eif-public .cta-primary { background: var(--eif-primary); border-radius: 8px; }
.eif-public .cta-primary:hover { background: var(--eif-primary-hover); }

.eif-onboarding { width: 100%; max-width: 960px; margin: 0 auto; padding: 0 16px 16px; font-size: 14px; line-height: 1.5; }
.eif-onboarding h2 { font-size: 20px; font-weight: 800; line-height: 1.3; letter-spacing: -.02em; }
.eif-onboarding h3 { font-size: 14px; font-weight: 600; }
.eif-onboarding p { margin: 0; }
.eif-onboarding a { text-underline-offset: 3px; }
.eif-onboarding :is(a, button, input, summary):focus-visible { outline: 3px solid var(--eif-primary); outline-offset: 3px; }
.eif-onboarding .eif-welcome { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 110px; padding: 18px 20px; margin-bottom: 14px; border-radius: 14px; background: var(--eif-welcome); color: var(--eif-ink); }
.eif-onboarding .eif-welcome p { margin-top: 4px; color: var(--eif-neutral-ink); font-size: 12px; }
.eif-eyebrow { display: block; margin-bottom: 4px; color: var(--eif-muted); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.eif-onboarding .eif-card { background: #fff; border: 1px solid var(--eif-line); border-radius: 14px; margin-bottom: 14px; }
.eif-card-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--eif-line); }
.eif-card-title span, .eif-helper { color: var(--eif-muted); font-size: 12px; }
.eif-onboarding .eif-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 7px 12px; border: 1px solid var(--eif-line); border-radius: 8px; background: #fff; color: var(--eif-primary); font-size: 12px; font-weight: 600; line-height: 1.4; text-decoration: none; cursor: pointer; }
.eif-onboarding .eif-button:hover { background: var(--eif-primary-soft); border-color: var(--eif-primary); }
.eif-onboarding .eif-button-primary { border-color: var(--eif-primary); background: var(--eif-primary); color: #fff; }
.eif-onboarding .eif-button-primary:hover { border-color: var(--eif-primary-hover); background: var(--eif-primary-hover); }
.eif-onboarding .eif-button:disabled { background: var(--eif-neutral); color: var(--eif-muted); border-color: var(--eif-line); cursor: not-allowed; }
.eif-onboarding .eif-link { border: 0; background: transparent; padding: 7px 4px; min-height: 36px; display: inline-flex; align-items: center; color: var(--eif-muted); font-size: 12px; text-decoration: none; }
.eif-onboarding .eif-link:hover { color: var(--eif-primary); text-decoration: underline; }
.eif-journey { display: flex; list-style: none; padding: 0; margin: 0 0 14px; gap: 8px; }
.eif-journey li { flex: 1; min-width: 0; color: var(--eif-muted); font-size: 11px; }
.eif-journey li::before { content: ""; display: block; height: 3px; border-radius: 4px; background: var(--eif-line); margin-bottom: 6px; }
.eif-journey li.is-done::before, .eif-journey li[aria-current="step"]::before { background: var(--eif-primary); }
.eif-journey li[aria-current="step"] { color: var(--eif-ink); font-weight: 600; }
.eif-progress { width: 200px; max-width: 100%; flex-shrink: 0; font-size: 12px; }
.eif-progress-track { height: 6px; margin-top: 8px; overflow: hidden; border-radius: 8px; background: rgb(30 27 58 / .1); }
.eif-progress-track > div { height: 100%; border-radius: inherit; background: var(--eif-primary); }
.eif-help { display: inline-block; position: relative; vertical-align: middle; font-size: 12px; font-weight: 400; }
.eif-help > summary { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 1px solid var(--eif-line); border-radius: 50%; color: var(--eif-primary); cursor: pointer; list-style: none; }
.eif-help > summary::-webkit-details-marker { display: none; }
.eif-help > .eif-help-content { position: absolute; z-index: 45; top: calc(100% + 6px); left: 0; width: min(260px, 75vw); padding: 10px 12px; border-radius: 8px; background: var(--eif-ink); color: #fff; box-shadow: 0 5px 20px #1e1b3a26; line-height: 1.5; }
.eif-help-content p + p { margin-top: 6px; }
.eif-status { display: inline-flex; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 500; color: var(--eif-neutral-ink); background: var(--eif-neutral); }
.eif-status-pending { color: var(--eif-pending-ink); background: var(--eif-pending); }
.eif-status-alert { color: var(--eif-alert-ink); background: var(--eif-alert); }
.eif-onboarding .eif-error { color: var(--eif-alert-ink); font-size: 12px; }
.eif-onboarding .eif-notice { padding: 10px 14px; margin-bottom: 14px; border: 1px solid var(--eif-line); border-radius: 8px; background: #fff; font-size: 12px; }
.eif-onboarding .eif-notice-success { background: var(--eif-done); color: var(--eif-done-ink); }
.eif-onboarding .eif-notice-error { background: var(--eif-alert); color: var(--eif-alert-ink); }
.eif-onboarding input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]) { width: 100%; min-height: 38px; border: 1px solid var(--eif-line); border-radius: 8px; padding: 8px 10px; background: #fff; color: var(--eif-ink); font-size: 14px; font-weight: 400; }
.eif-onboarding input[aria-invalid="true"] { border-color: var(--eif-alert-ink) !important; }
.eif-onboarding input:focus { border-color: var(--eif-primary); }
.eif-onboarding input[type="radio"] { accent-color: var(--eif-primary); color: var(--eif-primary); }
.eif-onboarding-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid var(--eif-line); border-radius: 14px; background: #fff; font-size: 12px; }
.eif-onboarding-banner p { margin: 2px 0 0; color: var(--eif-muted); }
.eif-onboarding-banner a { flex-shrink: 0; border: 1px solid var(--eif-line); border-radius: 8px; padding: 8px 12px; color: var(--eif-primary); background: #fff; font-weight: 600; }
.eif-onboarding-banner a:hover { background: var(--eif-primary-soft); }
@media (max-width: 640px) {
    .eif-onboarding { padding: 0 10px 16px; }
    .eif-onboarding .eif-welcome { flex-direction: column; align-items: stretch; padding: 16px; }
    .eif-progress { width: 100%; }
    .eif-help > .eif-help-content { position: static; margin-top: 6px; width: auto; }
    .eif-journey { gap: 5px; }
    .eif-journey li { font-size: 10px; }
    .eif-onboarding-banner { flex-wrap: wrap; }
}
@media (pointer: coarse) {
    .eif-onboarding :is(.eif-button, .eif-link), .eif-help > summary { min-height: 44px; }
    .eif-help > summary { min-width: 44px; }
}