/* /Components/Component/MarginalReturnsCard.razor.rz.scp.css */
/* The window-sensitivity strip. Specific to this card, so it stays scoped — the shared tile
   styles it sits beneath live in app.css. */

.roiic-ladder[b-qw1c7pju0b] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .roiic-ladder li[b-qw1c7pju0b] {
        display: grid;
        /* Years and range are fixed so the values form a column the eye can run down; that
           comparison is the entire reason the strip exists. */
        grid-template-columns: 4.5rem 1fr auto;
        align-items: baseline;
        gap: 0.5rem;
        padding: 0.3125rem 0.5rem;
        border-radius: var(--radius-sm);
    }

    .roiic-ladder li + li[b-qw1c7pju0b] {
        margin-top: 0.125rem;
    }

.roiic-ladder-years[b-qw1c7pju0b] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.roiic-ladder-range[b-qw1c7pju0b] {
    font-size: 0.75rem;
    color: var(--text-light);
    font-variant-numeric: tabular-nums;
}

.roiic-ladder-value[b-qw1c7pju0b] {
    font-family: var(--font-mono);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

/* The rung the headline figure came from. Marked rather than merely listed, because the headline
   is one of these rows and a reader should be able to see which — otherwise the strip looks like
   three alternatives to the number above it instead of an expansion of it. */
.roiic-ladder-current[b-qw1c7pju0b] {
    background: var(--surface-light);
    box-shadow: inset 2px 0 0 0 var(--primary-blue);
}

/* The header's help affordance. A link-styled button rather than an icon-only anchor so it is
   focusable and announced, and muted so it never competes with the figures. */
.roiic-help-toggle[b-qw1c7pju0b] {
    color: var(--text-light);
    line-height: 1;
    text-decoration: none;
}

    .roiic-help-toggle:hover[b-qw1c7pju0b],
    .roiic-help-toggle:focus[b-qw1c7pju0b] {
        color: var(--primary-blue);
    }

/* The formula, set apart from the prose around it. */
.roiic-formula[b-qw1c7pju0b] {
    font-family: var(--font-mono);
    font-size: 0.8125rem;
    background: var(--surface-light);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    padding: 0.625rem 0.75rem;
    /* Long on a phone, and breaking a formula mid-term is worse than scrolling it. */
    overflow-x: auto;
    white-space: nowrap;
}

/* The same formula with this company's years substituted in. Subordinate to the general form
   above it, so it is quieter and carries no border of its own. */
.roiic-formula-applied[b-qw1c7pju0b] {
    background: none;
    border: none;
    padding: 0.125rem 0.75rem 0;
    color: var(--text-light);
}

/* The clause naming the result an annual rate. It sits directly under the table it qualifies,
   so it is pulled up against it rather than floating between two blocks. */
.roiic-working-caption[b-qw1c7pju0b] {
    margin-top: -0.5rem;
}

/* The worked example. Its whole job is to let someone add the column up, so the figures are
   monospaced and right-aligned and the subtotals are the only emphasis. */
.roiic-working td.numeric[b-qw1c7pju0b],
.roiic-working th.numeric[b-qw1c7pju0b] {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.roiic-working .roiic-working-head th[b-qw1c7pju0b] {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-light);
    border-bottom-width: 1px;
    padding-top: 1rem;
}

.roiic-working .roiic-working-total td[b-qw1c7pju0b] {
    font-weight: 600;
    border-top: 1px solid var(--border-light);
}

/* The debt/equity/cash line under an invested-capital row: it shows the total is a sum, so it
   belongs with that row rather than as a row of its own. */
.roiic-working-detail[b-qw1c7pju0b] {
    display: block;
    font-size: 0.75rem;
    color: var(--text-light);
}

.roiic-help-notes li + li[b-qw1c7pju0b] {
    margin-top: 0.5rem;
}
/* /Components/Component/PageHeader.razor.rz.scp.css */
.page-header[b-nw8vm2qw05] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.page-header-text[b-nw8vm2qw05] {
    min-width: 0;
}

.page-header-title[b-nw8vm2qw05] {
    font-size: 1.75rem;
    line-height: 1.2;
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.page-header-icon[b-nw8vm2qw05] {
    color: var(--primary-blue);
    font-size: 1.5rem;
}

.page-header-subtitle[b-nw8vm2qw05] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin-bottom: 0;
}

.page-header-actions[b-nw8vm2qw05] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .page-header-title[b-nw8vm2qw05] {
        font-size: 1.5rem;
    }
}
/* /Components/Component/ReportView.razor.rz.scp.css */
/* Only the opt-in variant (the sample-report page) is a size container, so the
   container query below only ever fires there — modals have no container ancestor,
   so their contents always stay as the collapsible top block regardless of width. */
.report-view--sidebar[b-kup9x4vuot] {
    container-type: inline-size;
}

.report-grid[b-kup9x4vuot] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.report-main[b-kup9x4vuot] {
    min-width: 0;
}

/* Muted label above the (untouched) Google Search grounding chip. */
.grounding-label[b-kup9x4vuot] {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-secondary, #6b7280);
    margin: 0 0 0.75rem;
}

/* ---- Table of contents ---- */
.report-toc-list[b-kup9x4vuot] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.report-toc-list li[b-kup9x4vuot] {
    margin: 0;
}

.report-toc-list a[b-kup9x4vuot] {
    display: block;
    padding: 0.3rem 0 0.3rem 0.75rem;
    font-size: 0.85rem;
    line-height: 1.35;
    color: var(--text-secondary, #6b7280);
    text-decoration: none;
    border-left: 2px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.report-toc-list a:hover[b-kup9x4vuot] {
    color: var(--primary-blue, #1a56db);
    border-left-color: var(--primary-blue, #1a56db);
}

.report-toc-title[b-kup9x4vuot] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-secondary, #6b7280);
    margin-bottom: 0.6rem;
    padding-left: 0.75rem;
}

/* Default (narrow / modal): collapsible block at the top; sidebar hidden. */
.report-toc-mobile[b-kup9x4vuot] {
    margin-bottom: 1.5rem;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
}

.report-toc-mobile summary[b-kup9x4vuot] {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text-primary, #111827);
}

.report-toc-mobile .report-toc-list[b-kup9x4vuot] {
    margin-top: 0.5rem;
}

.report-toc-desktop[b-kup9x4vuot] {
    display: none;
}

/* Promote to a sticky sidebar when the report column is wide enough to hold the
   reading column plus a left-gutter sidebar. The sample-report column is ~69rem at
   full desktop width (72rem max minus container padding), so the threshold sits just
   below that. Only applies inside .report-view--sidebar (the only container). */
@container (min-width: 66rem) {
    .report-toc-mobile[b-kup9x4vuot] {
        display: none;
    }

    .report-grid[b-kup9x4vuot] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 44rem) minmax(0, 1fr);
        column-gap: 2rem;
    }

    .report-toc-desktop[b-kup9x4vuot] {
        display: block;
        grid-column: 1;
        justify-self: end;
        width: 100%;
        max-width: 15rem;
        position: sticky;
        /* Clear the sticky landing top bar so the first entries aren't tucked under it. */
        top: 5rem;
        align-self: start;
        max-height: calc(100vh - 6.5rem);
        overflow-y: auto;
    }

    .report-main[b-kup9x4vuot] {
        grid-column: 2;
    }
}
/* /Components/Component/ValuationChart.razor.rz.scp.css */
/* Readout strip under the chart: the same facts the lines show, in words, for anyone who wants
   the number rather than the shape. */

.valuation-readout[b-yc45aek626] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem 0.25rem;
    font-size: 0.875rem;
}

.valuation-readout-row[b-yc45aek626] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem;
}

/* Ties each row to its line without relying on the reader remembering which colour was which. */
.valuation-swatch[b-yc45aek626] {
    width: 0.75rem;
    height: 0.2rem;
    border-radius: 1px;
    align-self: center;
    flex: 0 0 auto;
}

.valuation-swatch-normal[b-yc45aek626] {
    background-color: #215FA6;
}

.valuation-swatch-fair[b-yc45aek626] {
    background-color: #EA580C;
}

/* The context bars. A block rather than the thin rule the line series use, so the key matches the
   mark on the chart — and so the pair of them reads as the legend for the two bar shades. */
.valuation-swatch-bar[b-yc45aek626],
.valuation-swatch-bar-ttm[b-yc45aek626] {
    width: 0.5rem;
    height: 0.7rem;
    border-radius: 1px;
}

.valuation-swatch-bar[b-yc45aek626] {
    background-color: #94A3B8;
}

.valuation-swatch-bar-ttm[b-yc45aek626] {
    background-color: #CBD5E1;
}

/* The user's own DCF: its own hue, dashed to match how the line is drawn. */
.valuation-swatch-live[b-yc45aek626] {
    background: repeating-linear-gradient(to right, #7C3AED 0 3px, transparent 3px 6px);
}

/* Deliberately ink, not green/red: below fair value is not a buy signal, and colouring it as one
   would be advice this product does not give. */
.valuation-verdict[b-yc45aek626] {
    font-weight: 600;
    color: var(--text-primary);
}

.valuation-method[b-yc45aek626] {
    padding: 0 0.75rem 0.5rem;
    font-size: 0.8125rem;
    color: var(--text-secondary);
}

.valuation-method summary[b-yc45aek626] {
    cursor: pointer;
    color: var(--primary-blue);
}

/* The currency-conversion and annual-basis notes. Same padding and scale as .valuation-method
   below the readout, and deliberately NOT an alert: neither reports a fault, and dressing a
   normal, handled case in amber is how a reader learns to skip amber. */
.valuation-basis-note[b-yc45aek626] {
    padding: 0 0.75rem;
    font-size: 0.8125rem;
    color: var(--text-secondary);
}
/* /Components/Layout/ContextBar.razor.rz.scp.css */
.context-bar[b-2ifalpkal3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-width: 0;
    font-size: 0.9rem;
}

/* Origin-aware back link, pinned at the far left and never truncated. */
.context-back[b-2ifalpkal3] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
    color: var(--primary-blue);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.context-back:hover[b-2ifalpkal3] {
    color: var(--primary-blue-hover);
    text-decoration: underline;
}

/* Divider between the back link and the trail. */
.context-back[b-2ifalpkal3]::after {
    content: "";
    width: 1px;
    height: 1.25rem;
    background: var(--border-light);
    margin-left: 0.45rem;
}

.context-trail[b-2ifalpkal3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    list-style: none;
    margin: 0;
    padding: 0;
    min-width: 0;
    overflow: hidden;
}

.context-crumb[b-2ifalpkal3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
    white-space: nowrap;
}

.context-crumb:not(:first-child)[b-2ifalpkal3]::before {
    content: "\203A"; /* › */
    color: var(--text-secondary);
    flex-shrink: 0;
}

.context-crumb a[b-2ifalpkal3] {
    color: var(--text-secondary);
    text-decoration: none;
}

.context-crumb a:hover[b-2ifalpkal3] {
    color: var(--primary-blue);
    text-decoration: underline;
}

/* The current (last) crumb is the one that absorbs any width pressure and ellipsises. */
.context-crumb.current[b-2ifalpkal3] {
    min-width: 0;
    overflow: hidden;
}

.context-crumb.current span[b-2ifalpkal3] {
    display: block;
    color: var(--text-primary);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Layout/LandingLayout.razor.rz.scp.css */
/* ============================================
   LANDING LAYOUT — public marketing shell
   Self-contained: does not depend on the global .site-footer / sidebar rules
   so it renders correctly at every breakpoint on its own.
   ============================================ */

.landing-shell[b-fmiccmvdei] {
    --brass: #B0863C;
    --ink: #0A1929;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #FBFCFE;
}

/* --- Top bar --- */
.landing-topbar[b-fmiccmvdei] {
    position: sticky;
    top: 0;
    z-index: 50;
    background-color: rgba(251, 252, 254, 0.85);
    backdrop-filter: saturate(180%) blur(8px);
    border-bottom: 1px solid var(--border-light);
}

.landing-topbar-inner[b-fmiccmvdei] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0.75rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.landing-brand[b-fmiccmvdei] {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}

.landing-brand img[b-fmiccmvdei] {
    height: 34px;
    width: auto;
}

.landing-topbar-actions[b-fmiccmvdei] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Secondary nav anchors (How it works / Sample report) — hidden on narrow
   viewports so Log in / Get started always stay visible in the topbar. */
.landing-topbar-links[b-fmiccmvdei] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

@media (max-width: 640px) {
    .landing-topbar-links[b-fmiccmvdei] {
        display: none;
    }
}

.landing-navlink[b-fmiccmvdei] {
    color: var(--text-primary);
    font-weight: 500;
    font-size: 0.9375rem;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-sm);
    transition: color 0.15s ease, background-color 0.15s ease;
}

.landing-navlink:hover[b-fmiccmvdei] {
    color: var(--primary-blue);
    background-color: var(--primary-light);
}

/* --- Buttons (shared with the page body) ---
   ::deep is required: these pages are rendered as @Body content of this layout, a
   different component scope, so a plain selector here would never reach them. */
[b-fmiccmvdei] .landing-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    border-radius: var(--radius-md);
    border: 1px solid transparent;
    padding: 0.7rem 1.35rem;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease,
                background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

[b-fmiccmvdei] .landing-btn-sm {
    padding: 0.5rem 1rem;
    font-size: 0.9375rem;
}

[b-fmiccmvdei] .landing-btn-primary {
    color: #fff;
    background-color: var(--primary-blue);
    border-color: var(--primary-blue);
    box-shadow: var(--shadow-sm);
}

[b-fmiccmvdei] .landing-btn-primary:hover {
    color: #fff;
    background-color: var(--primary-blue-hover);
    border-color: var(--primary-blue-hover);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* Secondary/outline variant — same weight and footprint as the primary button,
   for the "See a full example report" pairing next to "Create your account". */
[b-fmiccmvdei] .landing-btn-outline {
    color: var(--primary-blue);
    background-color: transparent;
    border-color: var(--primary-blue);
}

[b-fmiccmvdei] .landing-btn-outline:hover {
    color: #fff;
    background-color: var(--primary-blue);
    border-color: var(--primary-blue);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* --- Main fills remaining height so the footer sits at the bottom --- */
.landing-main[b-fmiccmvdei] {
    flex: 1 0 auto;
}

/* --- Footer --- */
.landing-footer[b-fmiccmvdei] {
    flex-shrink: 0;
    border-top: 1px solid var(--border-light);
    background-color: var(--surface-gray);
}

.landing-footer-inner[b-fmiccmvdei] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 1.75rem 1.5rem;
}

.landing-footer-disclaimer[b-fmiccmvdei] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background-color: #FFFBEB;
    border-left: 3px solid var(--accent-amber);
    border-radius: var(--radius-sm);
    padding: 0.7rem 0.9rem;
    color: var(--text-secondary);
    font-size: 0.82rem;
    line-height: 1.55;
    margin-bottom: 1.1rem;
}

.landing-footer-disclaimer .bi[b-fmiccmvdei] {
    color: var(--accent-amber);
    margin-top: 0.1rem;
}

.landing-footer-links[b-fmiccmvdei] {
    margin-bottom: 0.5rem;
}

.landing-footer-links a[b-fmiccmvdei] {
    font-size: 0.82rem;
    color: var(--primary-blue);
}

.landing-footer-links a:hover[b-fmiccmvdei] {
    color: var(--primary-blue-hover);
    text-decoration: underline;
}

.landing-footer-sep[b-fmiccmvdei] {
    color: var(--text-light);
    margin: 0 0.55rem;
}

.landing-footer-legal[b-fmiccmvdei] {
    margin: 0;
    font-size: 0.76rem;
    color: var(--text-light);
}

@media (max-width: 480px) {
    .landing-brand img[b-fmiccmvdei] {
        height: 28px;
    }

    .landing-navlink[b-fmiccmvdei] {
        padding: 0.5rem 0.4rem;
    }
}

/* Respect reduced-motion preferences for the button lift. */
@media (prefers-reduced-motion: reduce) {
    [b-fmiccmvdei] .landing-btn {
        transition: none;
    }

    [b-fmiccmvdei] .landing-btn-primary:hover,
    [b-fmiccmvdei] .landing-btn-outline:hover {
        transform: none;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-7ujhwz5stt] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-7ujhwz5stt] {
    flex: 1;
    min-width: 0; /* CRITICAL: This is the magic property that stops flex children from growing past the screen width */
    max-width: 100%; /* Ensures it never pushes past the viewport minus sidebar */
}

/* Modern dark sidebar with subtle gradient */
.sidebar[b-7ujhwz5stt] {
    background: linear-gradient(180deg, #0A1929 0%, #1E293B 100%);
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
}

/* Top bar — ContextBar (breadcrumb + origin-aware back) on the left, brand on the right. */
.top-row[b-7ujhwz5stt] {
    background-color: #FFFFFF;
    border-bottom: 1px solid #E2E8F0;
    justify-content: flex-start;
    gap: 1rem;
    height: 4rem;
    display: flex;
    align-items: center;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

/* Brand pinned to the far right. margin-left:auto rather than space-between so it
   stays right-aligned even when the ContextBar renders nothing (signed-out pages,
   unlabelled routes). It's the constant brand anchor: the sidebar wordmark is hidden
   behind the drawer on mobile and gone when the sidebar is collapsed. */
.top-row-brand[b-7ujhwz5stt] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: auto;
}

.top-row-brand img[b-7ujhwz5stt] {
    height: 2.5rem;
    transition: transform 0.2s ease;
}

.top-row-brand img:hover[b-7ujhwz5stt] {
    transform: scale(1.05);
}

@media (max-width: 640.98px) {
    .top-row[b-7ujhwz5stt] {
        height: 3.5rem;
        gap: 0.75rem;
    }

    .top-row-brand img[b-7ujhwz5stt] {
        height: 2rem;
    }
}

@media (min-width: 641px) {
    .page[b-7ujhwz5stt] {
        flex-direction: row;
    }

    /* Sidebar is a flex column so its children (.top-row inside NavMenu,
       .nav-scrollable, .user-profile) stack vertically and fill 100vh cleanly.
       overflow:hidden clips the width transition and prevents any overflow from
       the 64px collapsed rail spilling into the content area. */
    .sidebar[b-7ujhwz5stt] {
        display: flex;
        flex-direction: column;
        width: 260px;
        height: 100vh;
        position: sticky;
        top: 0;
        overflow: hidden;
    }

    .top-row[b-7ujhwz5stt] {
        position: sticky;
        top: 0;
        z-index: 100;
    }

    .top-row[b-7ujhwz5stt], article[b-7ujhwz5stt] {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}

/* Enhanced error UI */
#blazor-error-ui[b-7ujhwz5stt] {
    color-scheme: light only;
    background: linear-gradient(135deg, #FFF3E0 0%, #FFE0B2 100%);
    bottom: 0;
    box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 1rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-top: 3px solid #FFA000;
    font-weight: 500;
    color: #1E293B;
}

#blazor-error-ui .dismiss[b-7ujhwz5stt] {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 0.875rem;
    font-size: 1.25rem;
    color: #64748B;
    transition: color 0.2s ease;
}

#blazor-error-ui .dismiss:hover[b-7ujhwz5stt] {
    color: #1E293B;
}

#blazor-error-ui .reload[b-7ujhwz5stt] {
    color: var(--primary-blue);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: border-color 0.2s ease;
}

#blazor-error-ui .reload:hover[b-7ujhwz5stt] {
    border-bottom-color: var(--primary-blue);
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler-button[b-6oyi6ml10p] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
    padding: 0;
    border-radius: 4px;
}

.navbar-toggler-button:hover[b-6oyi6ml10p] {
    background-color: rgba(255, 255, 255, 0.3);
}

.top-row[b-6oyi6ml10p] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-6oyi6ml10p] {
    font-size: 1.1rem;
}

.bi[b-6oyi6ml10p] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

/* The sidebar draws its own icons via background-image (above), and several of
   these reuse real Bootstrap Icons class names. Suppress the icon-font glyph so
   nav icons don't render twice now that bootstrap-icons is loaded globally. */
.bi[b-6oyi6ml10p]::before {
    content: none !important;
}

.bi-house-door-fill-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-lock-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.bi-bookmark-star-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-bookmark-star-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 15.5a.5.5 0 0 1-.5-.5V2a.5.5 0 0 1 .5-.5h12a.5.5 0 0 1 .5.5v13a.5.5 0 0 1-.777.416L8 13.101l-5.723 2.815A.5.5 0 0 1 2 15.5zm6-12a.5.5 0 0 0-.474.342l-.858 2.645H4a.5.5 0 0 0-.294.909l2.2 1.598-.841 2.597a.5.5 0 0 0 .769.557L8 10.513l2.166 1.635a.5.5 0 0 0 .769-.557l-.841-2.597 2.2-1.598A.5.5 0 0 0 12 6.987H9.332l-.858-2.645A.5.5 0 0 0 8 3.5z'/%3E%3C/svg%3E");
}

.bi-file-earmark-text[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-file-earmark-text' viewBox='0 0 16 16'%3E%3Cpath d='M5.5 7a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1h-5zM5 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5z'/%3E%3Cpath d='M9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.5L9.5 0zm0 1v2A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z'/%3E%3C/svg%3E");
}

.bi-arrow-repeat[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-repeat' viewBox='0 0 16 16'%3E%3Cpath d='M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41zm-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9z'/%3E%3Cpath fill-rule='evenodd' d='M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5.002 5.002 0 0 0 8 3zM3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9H3.1z'/%3E%3C/svg%3E");
}

.bi-funnel-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-funnel-fill' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5z'/%3E%3C/svg%3E");
}

.bi-newspaper[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-newspaper' viewBox='0 0 16 16'%3E%3Cpath d='M0 2.5A1.5 1.5 0 0 1 1.5 1h11A1.5 1.5 0 0 1 14 2.5v10.528c0 .3-.05.654-.238.972h.738a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 1 1 0v9a1.5 1.5 0 0 1-1.5 1.5H1.5A1.5 1.5 0 0 1 0 13.028V2.5zm1 0v10.528c0 .27.187.472.5.472h11c.313 0 .5-.201.5-.472V2.5a.5.5 0 0 0-.5-.5h-11a.5.5 0 0 0-.5.5z'/%3E%3C/svg%3E");
}

.bi-bar-chart-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-bar-chart-fill' viewBox='0 0 16 16'%3E%3Cpath d='M1 11a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-3zm5-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V7zm5-5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1V2z'/%3E%3C/svg%3E");
}

.bi-toggles[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-toggles' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 9a3.5 3.5 0 1 0 0 7h7a3.5 3.5 0 1 0 0-7h-7zm7 6a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5zm-7-14a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zm2.45 0A3.49 3.49 0 0 1 8 3.5 3.49 3.49 0 0 1 6.95 6h4.55a2.5 2.5 0 0 0 0-5H6.95zM4.5 0h7a3.5 3.5 0 1 1 0 7h-7a3.5 3.5 0 1 1 0-7z'/%3E%3C/svg%3E");
}

.bi-list-ul[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-ul' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm-3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
}

.nav-item[b-6oyi6ml10p] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-6oyi6ml10p] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-6oyi6ml10p] {
        padding-bottom: 1rem;
    }

    .nav-item[b-6oyi6ml10p]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-6oyi6ml10p]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-6oyi6ml10p]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

/* User profile + logout pinned to the bottom of the sidebar. These links sit
   outside .nav-item, so restate the nav-link styling here: a readable colour on
   the dark sidebar and flex centring so the icons line up with their text. */
.user-profile[b-6oyi6ml10p]  .nav-link {
    color: #d7d7d7;
    background: none;
    border: none;
    border-radius: 4px;
    width: 100%;
    padding: 0.5rem 0.5rem;
    font-size: 0.9rem;
    text-align: left;
}

.user-profile[b-6oyi6ml10p]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

/* Mobile: hamburger-driven slide-down. Hidden by default; .open shows it. */
.nav-scrollable[b-6oyi6ml10p] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.nav-scrollable.open[b-6oyi6ml10p] {
    max-height: 100vh;
    overflow-y: auto;
}

/* The inner nav must be a single unwrapped column so the user-profile doesn't
   reflow into a second column when the menu is very tall. */
.nav-scrollable > nav[b-6oyi6ml10p] {
    flex: 1;
    min-height: 0;  /* completes the constraint chain: sidebar → nav-scrollable → nav → nav-items-scroll */
    flex-wrap: nowrap;
}

@media (min-width: 641px) {
    .navbar-toggler-button[b-6oyi6ml10p] {
        display: none;
    }

    /* Desktop: fill the sidebar's remaining flex height.
       overflow:hidden here is intentional — .nav-items-scroll below handles
       the actual scrolling. This stops overflow-y:auto from implicitly setting
       overflow-x:auto, which in the 64px collapsed rail would create a
       horizontal scrollbar that steals width and hides the icons. */
    .nav-scrollable[b-6oyi6ml10p] {
        flex: 1;
        min-height: 0;
        max-height: none;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        transition: none;
    }

    /* Only the nav items scroll; the user-profile stays pinned below this
       region and is always visible regardless of scroll position. */
    .nav-items-scroll[b-6oyi6ml10p] {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
    }
}

.bi-calculator-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-calculator-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2zm2 .5v2a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 .5-.5v-2a.5.5 0 0 0-.5-.5h-7a.5.5 0 0 0-.5.5zm3 4a.5.5 0 0 0-1 0v1h-1a.5.5 0 0 0 0 1h1v1a.5.5 0 0 0 1 0V8h1a.5.5 0 0 0 0-1H7V6.5zM11 7a.5.5 0 0 0 0 1h1a.5.5 0 0 0 0-1h-1zm0 3a.5.5 0 0 0 0 1h1a.5.5 0 0 0 0-1h-1zm-5 0a.5.5 0 0 0-1 0v.5H5a.5.5 0 0 0 0 1h.5v.5a.5.5 0 0 0 1 0V12H7a.5.5 0 0 0 0-1h-.5V10zm5 2a.5.5 0 0 0 0 1h1a.5.5 0 0 0 0-1h-1z'/%3E%3C/svg%3E");
}

.bi-table[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-table' viewBox='0 0 16 16'%3E%3Cpath d='M0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm15 2h-4V2h4v2zm0 5h-4V7h4v2zm0 5h-4v-2h4v2zM4 2v10h2V2H4zm3 0v10h2V2H7zm3 0v10h2V2h-2z'/%3E%3C/svg%3E");
}

.bi-collection-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-collection-fill' viewBox='0 0 16 16'%3E%3Cpath d='M0 13a1.5 1.5 0 0 0 1.5 1.5h13A1.5 1.5 0 0 0 16 13V6a1.5 1.5 0 0 0-1.5-1.5h-13A1.5 1.5 0 0 0 0 6zM2 3a.5.5 0 0 0 .5.5h11a.5.5 0 0 0 0-1h-11A.5.5 0 0 0 2 3m2-2a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 0-1h-7A.5.5 0 0 0 4 1'/%3E%3C/svg%3E");
}

.bi-person-circle[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-circle' viewBox='0 0 16 16'%3E%3Cpath d='M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath fill-rule='evenodd' d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z'/%3E%3C/svg%3E");
}

.bi-people-fill[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-people-fill' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6'/%3E%3Cpath d='M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E%3C/svg%3E");
}

.bi-exclamation-triangle[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-exclamation-triangle' viewBox='0 0 16 16'%3E%3Cpath d='M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.146.146 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.163.163 0 0 1-.054.06.116.116 0 0 1-.066.017H1.146a.115.115 0 0 1-.066-.017.163.163 0 0 1-.054-.06.176.176 0 0 1 .002-.183L7.884 2.073a.147.147 0 0 1 .054-.057zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z'/%3E%3Cpath d='M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0z'/%3E%3C/svg%3E");
}

.bi-envelope-paper[b-6oyi6ml10p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-envelope-paper' viewBox='0 0 16 16'%3E%3Cpath d='M4 0a2 2 0 0 0-2 2v1.133l-.941.502A2 2 0 0 0 0 5.4V14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V5.4a2 2 0 0 0-1.059-1.765L14 3.133V2a2 2 0 0 0-2-2zm10 4.267.47.25A1 1 0 0 1 15 5.4v.817l-1 .6zm-1 3.15-3.75 2.25L8 8.917l-1.25.75L3 7.417V2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1zm-11-.6-1-.6V5.4a1 1 0 0 1 .53-.882L2 4.267zm13 .566v5.734l-4.778-2.867zm-.035 6.88A1 1 0 0 1 14 15H2a1 1 0 0 1-.965-.738L8 10.083zM1 13.116V7.383l4.778 2.867L1 13.117Z'/%3E%3C/svg%3E");
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* Non-blocking indicator — shown only when the user acts while disconnected.
   pointer-events:none guarantees it never blocks a click (it's informational only). */
#reconnect-toast[b-l9cshe66eh] {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 1080;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    max-width: min(90vw, 22rem);
    padding: 0.6rem 0.95rem;
    background-color: #1f2937;
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.2;
    border-radius: 0.5rem;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
    pointer-events: none;
    opacity: 0;
    transform: translateY(0.5rem);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

#reconnect-toast.reconnect-toast-visible[b-l9cshe66eh] {
    opacity: 1;
    transform: translateY(0);
}

.reconnect-toast-spinner[b-l9cshe66eh] {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: reconnect-toast-spin-b-l9cshe66eh 0.8s linear infinite;
}

@keyframes reconnect-toast-spin-b-l9cshe66eh {
    to { transform: rotate(360deg); }
}

/* Prominent, blocking prompt — only opened (via showModal) for terminal states:
   reconnect failed, session paused, or resume failed. Never shown for transient drops. */
#components-reconnect-modal[b-l9cshe66eh] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
}

#components-reconnect-modal[b-l9cshe66eh]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
}

.components-reconnect-container[b-l9cshe66eh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-l9cshe66eh] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-l9cshe66eh] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

#components-reconnect-modal button:hover[b-l9cshe66eh] {
    background-color: #3b6ea2;
}

#components-reconnect-modal button:active[b-l9cshe66eh] {
    background-color: #6b9ed2;
}

/* Per-state content visibility. The framework toggles the state class on the dialog;
   only the terminal states have any visible content now, since transient drops never
   open the dialog. */
.components-reconnect-failed-visible[b-l9cshe66eh],
.components-pause-visible[b-l9cshe66eh],
.components-resume-failed-visible[b-l9cshe66eh] {
    display: none;
}

#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-l9cshe66eh],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-l9cshe66eh],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-l9cshe66eh] {
    display: block;
}
/* /Components/Pages/AdminTickers.razor.rz.scp.css */
/* A receipt ratio is a small round number — 1, 8, 10 — so the box is sized for one rather than
   taking a full column's width in an already wide admin table. */
.adr-ratio[b-z70gmfrfwp] {
    width: 5.5rem;
}
/* /Components/Pages/DcfCalculator.razor.rz.scp.css */
/* Bear / base / bull headline band, each case showing its own EV build-up workings.
   Wide screens: three columns, base emphasised in the middle.
   Narrow screens: one case at a time (base by default), arrows sliding to bear/bull. */

.scenario-band[b-p4oza24tsv] {
    text-align: center;
}

/* ── Wide screens: three columns side by side ─────────────────────────────── */
.scenario-cols[b-p4oza24tsv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
    gap: 1rem;
}

.scenario-col[b-p4oza24tsv] {
    padding: 0.25rem 0.75rem;
    text-align: center;
}

.scenario-col.base[b-p4oza24tsv] {
    border-inline: 1px solid var(--bs-border-color, #dee2e6);
}

.scenario-label[b-p4oza24tsv] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--bs-secondary-color, #6c757d);
}

.scenario-value[b-p4oza24tsv] {
    font-weight: 600;
    font-size: 1.35rem;
    line-height: 1.2;
}

/* The flanking cases in the value-driver mode, where red/green would assert which of them is the
   good one — a claim that inverts below the discount rate, since more reinvestment is worth less
   when new capital earns under what it costs. Muted rather than coloured; see ScenarioLowLabel. */
.scenario-flank-neutral[b-p4oza24tsv] {
    color: var(--bs-body-color, #212529);
}

/* The base value stays the clear hero without stealing width from the side tables. */
.scenario-base-value[b-p4oza24tsv] {
    font-weight: 700;
    font-size: 2rem;
}

.scenario-caption[b-p4oza24tsv] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color, #6c757d);
}

/* The no-growth strip under the band: today's business beside the growth on top of it. Neutral
   colour on purpose - neither figure is good or bad news on its own. */
.no-growth-strip[b-p4oza24tsv] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 0.5rem 2.5rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bs-border-color, #dee2e6);
}

.no-growth-value[b-p4oza24tsv] {
    font-weight: 600;
    font-size: 1.15rem;
}

.no-growth-note[b-p4oza24tsv] {
    flex-basis: 100%;
    max-width: 46rem;
    margin: 0.25rem auto 0;
    font-size: 0.85rem;
    color: var(--bs-secondary-color, #6c757d);
}

/* Each case's workings: a compact table, block-centred but left-aligned inside. */
.ev-table[b-p4oza24tsv] {
    display: inline-block;
    margin-top: 0.75rem;
    max-width: 100%;
}

/* Constrain to the column so the long first-column label wraps instead of overflowing
   into the neighbouring case at the narrow end of the three-column range. */
.ev-table table[b-p4oza24tsv] {
    max-width: 100%;
}

/* ── Narrow screens: one case at a time ───────────────────────────────────── */
.scenario-mobile[b-p4oza24tsv] {
    display: none;
}

.scenario-switch[b-p4oza24tsv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    margin-bottom: 0.5rem;
}

.scenario-arrow[b-p4oza24tsv] {
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
}

.scenario-arrow:disabled[b-p4oza24tsv] {
    opacity: 0.4;
}

.scenario-dots[b-p4oza24tsv] {
    display: inline-flex;
    gap: 0.4rem;
}

.scenario-dots .dot[b-p4oza24tsv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--bs-border-color, #ced4da);
}

.scenario-dots .dot.on[b-p4oza24tsv] {
    background: var(--bs-primary, #0d6efd);
}

/* Below the lg breakpoint three financial tables can't sit side by side, so switch
   to the single-case view. This also guarantees the arrows are visible on mobile. */
@media (max-width: 991.98px) {
    .scenario-cols[b-p4oza24tsv] {
        display: none;
    }

    .scenario-mobile[b-p4oza24tsv] {
        display: block;
    }

    .scenario-mobile .scenario-base-value[b-p4oza24tsv] {
        font-size: 2.5rem;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.home-auth-buttons[b-ssf14ev21u] {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

aside[b-ssf14ev21u] {
    display: block;
    margin-top: 2rem;
    padding: 0.75rem 1rem;
    border-left: 4px solid var(--border-medium);
    background-color: var(--surface-light);
    font-size: 0.85rem;
    color: var(--text-secondary);
}

/* ---- Quick actions ---- */
.quick-actions[b-ssf14ev21u] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.quick-action[b-ssf14ev21u] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem 1rem;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--surface-white);
    color: var(--text-primary);
    text-decoration: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.quick-action:hover[b-ssf14ev21u] {
    border-color: var(--primary-blue);
    box-shadow: var(--shadow-sm);
    color: var(--text-primary);
    transform: translateX(2px);
}

.quick-action-icon[b-ssf14ev21u] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    background: var(--primary-light);
    color: var(--primary-blue);
    font-size: 1.125rem;
}

.quick-action-text[b-ssf14ev21u] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex-grow: 1;
}

.quick-action-title[b-ssf14ev21u] {
    font-weight: 600;
}

.quick-action-desc[b-ssf14ev21u] {
    font-size: 0.85rem;
    color: var(--text-secondary);
}

.quick-action-chevron[b-ssf14ev21u] {
    color: var(--text-light);
    flex-shrink: 0;
}

/* ---- Watchlist ---- */
.watchlist[b-ssf14ev21u] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    max-height: 320px;
    overflow-y: auto;
}

.watchlist-item[b-ssf14ev21u] {
    display: flex;
    align-items: baseline;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    border-radius: var(--radius-sm);
    text-decoration: none;
    color: var(--text-primary);
    transition: background-color 0.15s ease;
}

.watchlist-item:hover[b-ssf14ev21u] {
    background-color: var(--primary-light);
    color: var(--text-primary);
}

.watchlist-symbol[b-ssf14ev21u] {
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--primary-blue);
    flex-shrink: 0;
    min-width: 3.5rem;
}

.watchlist-name[b-ssf14ev21u] {
    color: var(--text-secondary);
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---- Empty watchlist ---- */
.empty-watchlist[b-ssf14ev21u] {
    text-align: center;
    padding: 1.5rem 1rem;
}

.empty-watchlist-icon[b-ssf14ev21u] {
    font-size: 2rem;
    color: var(--border-medium);
    display: block;
    margin-bottom: 0.5rem;
}
/* /Components/Pages/Landing.razor.rz.scp.css */
/* ============================================
   LANDING PAGE
   All-sans, matching the app's own type — a natural extension of the
   product UI — with a single restrained brass accent used only for
   eyebrows and the citation motif.
   ============================================ */

.l-page[b-b2guc3aims] {
    --brass: #B0863C;
    --ink: #0A1929;
    color: var(--text-primary);
}

.l-container[b-b2guc3aims] {
    max-width: 1120px;
    margin: 0 auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

/* --- Shared display type --- */
.l-display[b-b2guc3aims] {
    color: var(--ink);
    font-weight: 750;
    letter-spacing: -0.03em;
    line-height: 1.08;
}

.l-display-accent[b-b2guc3aims] {
    color: var(--brass);
    font-weight: 750;
}

.l-eyebrow[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brass);
    margin-bottom: 1rem;
}

.l-eyebrow[b-b2guc3aims]::before {
    content: "";
    width: 1.75rem;
    height: 1px;
    background-color: var(--brass);
}

/* ============================================
   HERO
   ============================================ */
.l-hero[b-b2guc3aims] {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
    background:
        radial-gradient(120% 120% at 85% 0%, rgba(33, 95, 166, 0.06) 0%, rgba(33, 95, 166, 0) 55%),
        #FBFCFE;
}

.l-hero-grid[b-b2guc3aims] {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 3rem;
    align-items: center;
}

.l-hero-copy h1[b-b2guc3aims] {
    margin: 0 0 1.1rem;
}

.l-display[b-b2guc3aims] {
    font-size: 2.75rem;
}

.l-lede[b-b2guc3aims] {
    font-size: 1.15rem;
    line-height: 1.6;
    color: var(--text-secondary);
    max-width: 34rem;
    margin: 0 0 0.85rem;
}

.l-hero-features[b-b2guc3aims] {
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--text-light);
    max-width: 34rem;
    margin: 0 0 1.75rem;
}

.l-cta-row[b-b2guc3aims] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.l-cta-center[b-b2guc3aims] {
    justify-content: center;
}

.l-textlink[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 600;
    color: var(--primary-blue);
}

.l-textlink:hover[b-b2guc3aims] {
    color: var(--primary-blue-hover);
}

.l-textlink .bi[b-b2guc3aims] {
    font-size: 0.85em;
}

.l-cta-note[b-b2guc3aims] {
    margin: 1.1rem 0 0;
    font-size: 0.85rem;
    color: var(--text-light);
}

/* --- Signature: self-citing report excerpt --- */
.l-excerpt[b-b2guc3aims] {
    margin: 0;
    background: var(--surface-white);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.l-excerpt-head[b-b2guc3aims] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.85rem 1.25rem;
    border-bottom: 1px solid var(--border-light);
    background-color: var(--surface-light);
}

.l-excerpt-tag[b-b2guc3aims] {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-light);
}

.l-pipeline[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--font-mono);
    font-size: 0.72rem;
    color: var(--text-secondary);
}

.l-pipeline .bi[b-b2guc3aims] {
    font-size: 0.65rem;
    color: var(--brass);
}

.l-excerpt-body[b-b2guc3aims] {
    font-size: 1.05rem;
    line-height: 1.65;
    color: var(--ink);
    margin: 0;
    padding: 1.5rem 1.25rem;
}

/* The figure + its footnote-style citation chip: the recurring signature motif */
.l-figure[b-b2guc3aims] {
    font-weight: 700;
    white-space: nowrap;
}

.l-cite[b-b2guc3aims] {
    font-family: var(--font-mono);
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--brass);
    vertical-align: super;
    margin-left: 0.15rem;
    padding: 0.1rem 0.3rem;
    border: 1px solid rgba(176, 134, 60, 0.4);
    border-radius: 4px;
    cursor: default;
    text-decoration: none;
}

.l-excerpt-foot[b-b2guc3aims] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.8rem 1.25rem;
    border-top: 1px solid var(--border-light);
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.l-excerpt-foot .bi[b-b2guc3aims] {
    color: var(--accent-green);
}

/* ============================================
   HONEST POSITIONING (Built for / Not built for)
   ============================================ */
.l-fit[b-b2guc3aims] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
    border-top: 1px solid var(--border-light);
}

.l-fit-title[b-b2guc3aims] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0 0 0.9rem;
}

.l-fit-yes[b-b2guc3aims] {
    color: var(--accent-green);
}

.l-fit-no[b-b2guc3aims] {
    color: var(--text-light);
}

.l-fit-list[b-b2guc3aims] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.l-fit-list li[b-b2guc3aims] {
    position: relative;
    padding-left: 1rem;
    margin-bottom: 0.55rem;
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.5;
}

.l-fit-list li[b-b2guc3aims]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: var(--border-medium);
}

/* ============================================
   PILLARS
   ============================================ */
.l-pillars[b-b2guc3aims] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding-top: 3rem;
    padding-bottom: 3.5rem;
}

.l-pillar[b-b2guc3aims] {
    background: var(--surface-white);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: 1.75rem;
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.l-pillar:hover[b-b2guc3aims] {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.l-pillar-icon[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--radius-md);
    background-color: var(--primary-light);
    color: var(--primary-blue);
    font-size: 1.25rem;
    margin-bottom: 1.1rem;
}

.l-pillar-title[b-b2guc3aims] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.01em;
    margin: 0 0 0.6rem;
}

.l-pillar-body[b-b2guc3aims] {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.6;
}

/* ============================================
   SHOWCASE (real product screenshots)
   ============================================ */
.l-showcase[b-b2guc3aims] {
    padding-top: 0.5rem;
    padding-bottom: 3.5rem;
}

.l-showcase-head[b-b2guc3aims] {
    text-align: center;
    max-width: 40rem;
    margin: 0 auto 2.25rem;
}

.l-showcase-lede[b-b2guc3aims] {
    color: var(--text-secondary);
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}

.l-showcase-grid[b-b2guc3aims] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

.l-showcase-item[b-b2guc3aims] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

/* Minimal CSS "browser window" frame around each screenshot */
.l-frame[b-b2guc3aims] {
    background: var(--surface-white);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.l-frame-bar[b-b2guc3aims] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 0.75rem;
    background-color: var(--surface-light);
    border-bottom: 1px solid var(--border-light);
}

.l-frame-dot[b-b2guc3aims] {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background-color: var(--border-medium);
}

/* Screenshots arrive at different native aspect ratios (a scrolling report
   modal vs. a wide DCF card grid) — force a shared ratio so the two framed
   shots line up evenly, cropping from the top down since the top of each
   shot is the important part. */
.l-frame img[b-b2guc3aims] {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.85;
    object-fit: cover;
    object-position: top;
}

.l-showcase-caption[b-b2guc3aims] {
    text-align: center;
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

/* ============================================
   MOAT (dark band)
   ============================================ */
.l-moat[b-b2guc3aims] {
    background-color: var(--ink);
    padding-top: 4rem;
    padding-bottom: 4rem;
    scroll-margin-top: 4.5rem;
    background-image:
        radial-gradient(80% 120% at 100% 0%, rgba(33, 95, 166, 0.28) 0%, rgba(33, 95, 166, 0) 60%);
}

.l-eyebrow-invert[b-b2guc3aims] {
    color: var(--brass);
}

.l-moat-title[b-b2guc3aims] {
    color: #fff;
    font-size: 2.25rem;
    max-width: 22ch;
    margin: 0 0 1rem;
}

.l-moat-lede[b-b2guc3aims] {
    color: rgba(226, 232, 240, 0.75);
    font-size: 1.1rem;
    line-height: 1.6;
    max-width: 44rem;
    margin: 0 0 2.5rem;
}

.l-moat-grid[b-b2guc3aims] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.l-moat-card[b-b2guc3aims] {
    background-color: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-lg);
    padding: 1.75rem;
}

.l-moat-flow[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 1.1rem;
}

.l-moat-flow .bi[b-b2guc3aims] {
    color: var(--brass);
    font-size: 0.8rem;
}

.l-flow-step[b-b2guc3aims] {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #fff;
    padding: 0.3rem 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
}

.l-flow-chip[b-b2guc3aims] {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 700;
    color: #fff;
    padding: 0.3rem 0.65rem;
    border: 1px solid rgba(176, 134, 60, 0.55);
    border-radius: 999px;
    white-space: nowrap;
}

.l-flow-cite[b-b2guc3aims] {
    font-size: 0.6rem;
    color: var(--brass);
    vertical-align: super;
    margin-left: 0.25rem;
}

.l-moat-card-title[b-b2guc3aims] {
    font-size: 1.15rem;
    color: #fff;
    font-weight: 700;
    margin: 0 0 0.55rem;
}

.l-moat-card-body[b-b2guc3aims] {
    margin: 0;
    color: rgba(226, 232, 240, 0.72);
    font-size: 0.95rem;
    line-height: 1.6;
}

/* ============================================
   SIGN-UP STEPS
   ============================================ */
.l-steps[b-b2guc3aims] {
    padding-top: 3rem;
    padding-bottom: 1rem;
    text-align: center;
}

.l-steps-grid[b-b2guc3aims] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 0.5rem;
}

.l-step[b-b2guc3aims] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.l-step-num[b-b2guc3aims] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background-color: var(--primary-light);
    color: var(--primary-blue);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 0.9rem;
}

.l-step-title[b-b2guc3aims] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--ink);
    margin: 0 0 0.4rem;
}

.l-step-body[b-b2guc3aims] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    line-height: 1.55;
    max-width: 20rem;
    margin: 0;
}

/* ============================================
   FINAL CTA
   ============================================ */
.l-final[b-b2guc3aims] {
    text-align: center;
    padding-top: 4rem;
    padding-bottom: 4.5rem;
}

.l-final-title[b-b2guc3aims] {
    font-size: 2.25rem;
    margin: 0 0 0.75rem;
}

.l-final-lede[b-b2guc3aims] {
    color: var(--text-secondary);
    font-size: 1.1rem;
    margin: 0 auto 1.75rem;
    max-width: 34rem;
}

.l-final-disclaimer[b-b2guc3aims] {
    margin: 1.5rem auto 0;
    max-width: 30rem;
    font-size: 0.8rem;
    color: var(--text-light);
}

.l-final-disclaimer a[b-b2guc3aims] {
    color: var(--primary-blue);
    text-decoration: none;
}

.l-final-disclaimer a:hover[b-b2guc3aims] {
    text-decoration: underline;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 900px) {
    .l-hero-grid[b-b2guc3aims] {
        grid-template-columns: 1fr;
        gap: 2.25rem;
    }

    .l-display[b-b2guc3aims] {
        font-size: 2.5rem;
    }

    .l-pillars[b-b2guc3aims] {
        grid-template-columns: 1fr;
    }

    .l-showcase-grid[b-b2guc3aims] {
        grid-template-columns: 1fr;
        gap: 2.25rem;
    }

    .l-steps-grid[b-b2guc3aims] {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }

    .l-moat-grid[b-b2guc3aims] {
        grid-template-columns: 1fr;
    }

    .l-moat-title[b-b2guc3aims],
    .l-final-title[b-b2guc3aims] {
        font-size: 1.9rem;
    }
}

@media (max-width: 560px) {
    .l-display[b-b2guc3aims] {
        font-size: 2.1rem;
    }

    .l-fit[b-b2guc3aims] {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }

    .l-cta-row[b-b2guc3aims] {
        gap: 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .l-pillar[b-b2guc3aims] {
        transition: none;
    }

    .l-pillar:hover[b-b2guc3aims] {
        transform: none;
    }
}
/* /Components/Pages/ReportPage.razor.rz.scp.css */
/* Give ReportView room for its left-gutter contents sidebar (which needs a ~66rem-wide
   container to promote from the collapsible block) while keeping the reading column tidy
   on ultrawide displays. ReportView itself centers the 44rem reading column within this. */
.report-page-body[b-7wp5tcgiea] {
    max-width: 72rem;
    margin: 0 auto;
}
/* /Components/Pages/SampleReport.razor.rz.scp.css */
.sr-page[b-a8pq7h5x1f] {
    color: var(--text-primary);
}

.sr-container[b-a8pq7h5x1f] {
    max-width: 44rem;
    margin: 0 auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.sr-head[b-a8pq7h5x1f] {
    padding-top: 3rem;
    padding-bottom: 1.5rem;
}

.sr-eyebrow[b-a8pq7h5x1f] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #B0863C;
    margin-bottom: 1rem;
}

.sr-eyebrow[b-a8pq7h5x1f]::before {
    content: "";
    width: 1.75rem;
    height: 1px;
    background-color: #B0863C;
}

.sr-title[b-a8pq7h5x1f] {
    color: var(--ink, #0A1929);
    font-weight: 750;
    letter-spacing: -0.03em;
    line-height: 1.08;
    font-size: 2.25rem;
    margin: 0 0 1rem;
}

.sr-lede[b-a8pq7h5x1f] {
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

.sr-body[b-a8pq7h5x1f] {
    /* Wider than the 44rem reading column so ReportView's contents sidebar has a
       left gutter; ReportView still centers the reading column at 44rem within. */
    max-width: 72rem;
    padding-bottom: 3rem;
}

.sr-footer[b-a8pq7h5x1f] {
    text-align: center;
    padding-bottom: 4rem;
    border-top: 1px solid var(--border-light);
    padding-top: 3rem;
}

.sr-cta-title[b-a8pq7h5x1f] {
    color: var(--ink, #0A1929);
    font-weight: 750;
    letter-spacing: -0.03em;
    font-size: 1.6rem;
    margin: 0 0 1.5rem;
}

.sr-cta-row[b-a8pq7h5x1f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.sr-textlink[b-a8pq7h5x1f] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 600;
    color: var(--primary-blue);
}

.sr-textlink:hover[b-a8pq7h5x1f] {
    color: var(--primary-blue-hover);
}
/* /Components/Pages/Screener.razor.rz.scp.css */
/* The collapsible column guide. Mirrors ValuationChart's .valuation-method, which is the
   established shape for "explain this surface" copy: a native <details>, no JavaScript, and a
   summary that reads as a control rather than as a heading. */

.column-guide[b-a6nvfp7eq6] {
    font-size: 0.8125rem;
}

.column-guide summary[b-a6nvfp7eq6] {
    cursor: pointer;
    color: var(--primary-blue);
    /* Comfortably tappable. The guide exists because hover does not reach touch devices, so the
       one control that opens it must not be a hairline. */
    padding: 0.25rem 0;
}

.column-guide dt[b-a6nvfp7eq6] {
    font-weight: 600;
}

/* ============================================================================
   THE MOBILE EXPLANATION PANEL
   ============================================================================
   The toggle that opens it exists only below md; above md the panel is always
   shown and the button is not rendered at all (d-md-none in the markup). */

.screen-guide-toggle[b-a6nvfp7eq6] {
    padding: 0.25rem 0;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--primary-blue);
}

/* ============================================================================
   COLUMN VISIBILITY
   ============================================================================
   These were Bootstrap's d-none d-*-table-cell utilities. They had to move here
   because d-none is `display: none !important`, which no state class can undo
   without an !important of its own — the .all-columns rules below beat these on
   specificity alone, which is the whole reason for the switch.

   Same breakpoints as before, so nothing changes at any width until the reader
   asks for it:
     sc-col-xl       CAGR, Revenue, ROIIC  hidden below 1200px
     sc-col-company  Company name       hidden below 992px
     sc-col-md       Confidence, Market cap  hidden below 768px  */

@media (max-width: 1199.98px) {
    .screener-table .sc-col-xl[b-a6nvfp7eq6] {
        display: none;
    }
}

/* The fiscal-year window under a ROIIC figure. It is qualifying detail, not a second number, so
   it drops out of the numeric scale and onto its own line — the ladder can give one row a
   seven-year reading and the next a five-year one, and the column is only honestly comparable if
   that is visible without hovering. */
/* The "not SEC-checked" marker on a screener-universe row. Deliberately quiet — an outline on
   the muted text colour, not a warning colour: the row is usable, it simply has not had the
   checks a held company's import runs. Sits on its own line under the symbol so the pinned
   column does not widen on a phone. */
/* Sized to sit level with the checkboxes beside it. app.css gives every .form-control a
   generous padding, which outranks Bootstrap's form-control-sm, so the size is set here. */
.sc-roiic-input[b-a6nvfp7eq6] {
    width: 4.5rem;
    padding: 0.125rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: var(--radius-sm);
}

.screener-table .sc-basis-badge[b-a6nvfp7eq6] {
    display: block;
    width: fit-content;
    margin-top: 0.125rem;
    padding: 0.125rem 0.375rem;
    font-size: 0.625rem;
    font-weight: 500;
    color: var(--text-secondary);
    background: transparent;
    border: 1px solid var(--border-medium);
    cursor: help;
}

.screener-table .sc-subvalue[b-a6nvfp7eq6] {
    display: block;
    font-size: 0.6875rem;
    font-weight: 400;
    color: var(--text-light);
    line-height: 1.2;
}

@media (max-width: 991.98px) {
    .screener-table .sc-col-company[b-a6nvfp7eq6] {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .screener-table .sc-col-md[b-a6nvfp7eq6] {
        display: none;
    }
}

/* "All columns": every figure a desktop reader sees. Company name is deliberately
   not restored — it is the widest column by a distance, and the Symbol next to it
   already links to the same page. */
.screener-table.all-columns .sc-col-xl[b-a6nvfp7eq6],
.screener-table.all-columns .sc-col-md[b-a6nvfp7eq6] {
    display: table-cell;
}

/* Everything .all-columns does is confined to the widths where the button that
   turns it off is rendered (it carries d-xl-none). Without this bound the state
   could be switched on at 1000px and then survive a maximise to 1400px, leaving a
   desktop table with nowrap on every cell and a pinned first column, and no
   visible control to undo it short of a reload. Above xl the class is inert: the
   display rules it overrides are no-ops there anyway. */
@media (max-width: 1199.98px) {
    /* Let the columns take their natural width and scroll, rather than wrapping
       every cell onto three lines inside a 390px viewport. .table-responsive is
       already the scroll container. */
    .screener-table.all-columns th[b-a6nvfp7eq6],
    .screener-table.all-columns td[b-a6nvfp7eq6] {
        white-space: nowrap;
    }

    /* Symbol stays put while the rest scrolls, so a row is still identifiable once
       its left edge is off-screen. Mirrors the sticky first column already used by
       the financial data table in app.css.

       Only a background-color is set, never a box-shadow: Bootstrap 5.3 paints both
       the stripe and the hover state as `box-shadow: inset 0 0 0 9999px` ON THE CELL,
       so a box-shadow here would silently replace them. A background-color sits under
       that inset shadow, which is exactly what a sticky cell needs — opaque, and
       still striped. The row-level hover in app.css is on the <tr>, which a sticky
       cell with its own background would hide, so it is restated for that cell. */
    .screener-table.all-columns thead th:first-child[b-a6nvfp7eq6] {
        position: sticky;
        left: 0;
        z-index: 3;
        border-right: 1px solid var(--border-medium);
    }

    .screener-table.all-columns tbody td:first-child[b-a6nvfp7eq6] {
        position: sticky;
        left: 0;
        z-index: 2;
        background-color: var(--surface-white);
        border-right: 1px solid var(--border-light);
    }

    .screener-table.all-columns tbody tr:hover td:first-child[b-a6nvfp7eq6] {
        background-color: var(--primary-light);
    }
}

@media (max-width: 767.98px) {
    .screener-table.all-columns th[b-a6nvfp7eq6],
    .screener-table.all-columns td[b-a6nvfp7eq6] {
        padding: 0.5rem;
        font-size: 0.8125rem;
    }
}
