/* _content/TheWick.MarketingWaitList/Components/Layout/WaitlistLayout.razor.rz.scp.css */
.wl-layout[b-7bj1igi8rv] {
    min-height: 100vh;
}

/* Pre-launch compliance disclosure — sits in normal flow above the nav,
   so it can wrap to any height (esp. on mobile) without the nav needing a
   hardcoded offset. Scrolls away; the nav below it sticks to the top. */
.pre-strip[b-7bj1igi8rv] {
    position: relative;
    z-index: 101;
    background: #0d0d0d;
    border-bottom: 1px solid var(--border);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .2px;
    color: var(--muted);
    line-height: 1.4;
    padding: 8px 24px;
    text-align: center;
}

.wl-nav[b-7bj1igi8rv] {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    height: 48px;
    background: rgba(10, 10, 10, .92);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
    font-family: var(--mono);
}

[b-7bj1igi8rv] .nav-logo {
    text-decoration: none;
    display: flex;
    align-items: center;
}

[b-7bj1igi8rv] .nav-logo img {
    height: 20px;
    width: auto;
    display: block;
}

/* Nav links — right-aligned group next to the CTA (mock layout: logo left, everything else right) */
[b-7bj1igi8rv] .nav-links {
    display: flex;
    gap: 22px;
    align-items: center;
    margin-left: auto;
    margin-right: 22px;
}

[b-7bj1igi8rv] .nav-link {
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    text-decoration: none;
    padding: 0;
    transition: color .15s;
    letter-spacing: .5px;
    text-transform: uppercase;
    font-family: var(--mono);
    background: none;
    border: none;
    cursor: pointer;
}

[b-7bj1igi8rv] .nav-link:hover {
    color: var(--green);
}

[b-7bj1igi8rv] .nav-link--active {
    color: var(--green);
}

/* Resources dropdown */
[b-7bj1igi8rv] .nav-dropdown {
    position: relative;
}

[b-7bj1igi8rv] .dropdown-trigger {
    display: flex;
    align-items: center;
    gap: 4px;
}

[b-7bj1igi8rv] .dropdown-arrow {
    transition: transform .2s;
}

[b-7bj1igi8rv] .dropdown-arrow.open {
    transform: rotate(180deg);
}

[b-7bj1igi8rv] .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    padding-top: 8px;
    z-index: 200;
}

[b-7bj1igi8rv] .dropdown-menu.show {
    display: block;
}

/* Desktop hover-open (pointer devices only) — replaces the old JS mouseenter/mouseleave,
   which on touch fired a synthetic hover that cancelled the first tap. (hover: hover)
   keeps this off touch screens, so mobile relies solely on the click toggle (.show). */
@media (hover: hover) and (min-width: 701px) {
    [b-7bj1igi8rv] .nav-dropdown:hover .dropdown-menu { display: block; }
    [b-7bj1igi8rv] .nav-dropdown:hover .dropdown-arrow { transform: rotate(180deg); }
}

[b-7bj1igi8rv] .dropdown-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: var(--muted);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    font-family: var(--mono);
    letter-spacing: .5px;
    text-transform: uppercase;
    white-space: nowrap;
    transition: all .15s;
    background: rgba(10, 10, 10, .97);
    border: 1px solid var(--border);
    border-bottom: none;
}

[b-7bj1igi8rv] .dropdown-menu .dropdown-item:first-child {
    border-radius: 8px 8px 0 0;
}

[b-7bj1igi8rv] .dropdown-menu .dropdown-item:last-child {
    border-bottom: 1px solid var(--border);
    border-radius: 0 0 8px 8px;
}

[b-7bj1igi8rv] .dropdown-menu .dropdown-item:hover {
    color: #fff;
    background: var(--surface2);
}

[b-7bj1igi8rv] .dropdown-menu .dropdown-item svg {
    color: var(--green);
    flex-shrink: 0;
}

/* Hamburger */
.nav-hamburger[b-7bj1igi8rv] {
    display: none;
    flex-direction: column;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    z-index: 101;
}

.nav-hamburger span[b-7bj1igi8rv] {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--text);
    border-radius: 1px;
    transition: all .2s;
}

.nav-hamburger--open span:nth-child(1)[b-7bj1igi8rv] {
    transform: rotate(45deg) translate(4px, 4px);
}

.nav-hamburger--open span:nth-child(2)[b-7bj1igi8rv] {
    opacity: 0;
}

.nav-hamburger--open span:nth-child(3)[b-7bj1igi8rv] {
    transform: rotate(-45deg) translate(4px, -4px);
}

[b-7bj1igi8rv] .nav-cta {
    font-size: 12px;
    font-weight: 700;
    padding: 6px 16px;
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: .3px;
    text-transform: uppercase;
    transition: all .15s;
}

[b-7bj1igi8rv] .nav-cta:hover {
    box-shadow: 0 0 20px rgba(0, 255, 136, .3);
    transform: translateY(-1px);
}

main[b-7bj1igi8rv] {
    /* The sticky nav occupies normal flow, so no top padding offset is needed. */
}

/* Team strip */
/* Footer */
.wl-footer[b-7bj1igi8rv] {
    border-top: 1px solid var(--border);
    padding: 32px 24px;
    font-family: var(--mono);
}

.footer-inner[b-7bj1igi8rv] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

[b-7bj1igi8rv] .footer-logo {
    font-size: 20px;
    letter-spacing: 1.5px;
}

.footer-links[b-7bj1igi8rv] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.footer-links > a[b-7bj1igi8rv] {
    color: var(--dim);
    text-decoration: none;
    font-size: 11px;
    font-family: var(--mono);
}

.footer-links > a:hover[b-7bj1igi8rv] { color: var(--muted); }

.footer-socials[b-7bj1igi8rv] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding-right: 14px;
    border-right: 1px solid var(--border);
}

.footer-social[b-7bj1igi8rv] {
    color: var(--dim);
    display: inline-flex;
    align-items: center;
    transition: color 0.15s;
}

.footer-social:hover[b-7bj1igi8rv] { color: var(--green); }

.footer-copy[b-7bj1igi8rv] {
    font-size: 12px;
    color: var(--dim);
    width: 100%;
    text-align: center;
    margin-top: 16px;
}

.footer-copy__disclaimer[b-7bj1igi8rv] {
    margin: 16px 0 0;
    line-height: 1.6;
}

.footer-tagline[b-7bj1igi8rv] { color: var(--green); }

@media (max-width: 700px) {
    .wl-nav[b-7bj1igi8rv] { padding: 0 16px; }

    /* The open menu is position:absolute (out of flow). Push the CTA (and the hamburger
       after it in the DOM) to the right so the bar reads: logo … [join waitlist] [☰]. */
    [b-7bj1igi8rv] .nav-cta { margin-left: auto; }
    .nav-hamburger[b-7bj1igi8rv] { display: flex; margin-left: 10px; }

    [b-7bj1igi8rv] .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        margin: 0; /* cancel the desktop margin-left:auto/margin-right so the panel spans edge-to-edge */
        /* solid — a translucent panel over stacked page content reads as bleed-through,
           and backdrop-filter compositing is unreliable on some mobile browsers */
        background: #0a0a0a;
        flex-direction: column;
        padding: 16px 24px;
        border-bottom: 1px solid var(--border);
        gap: 4px;
    }

    [b-7bj1igi8rv] .nav-links--open {
        display: flex;
    }

    [b-7bj1igi8rv] .nav-link {
        width: 100%;
        padding: 12px 16px;
        font-size: 13px;
    }

    /* Mobile dropdown: stack items inline instead of absolute popover */
    [b-7bj1igi8rv] .nav-dropdown {
        width: 100%;
    }

    [b-7bj1igi8rv] .dropdown-trigger {
        width: 100%;
        padding: 12px 16px;
        font-size: 13px;
        justify-content: flex-start;
    }

    [b-7bj1igi8rv] .dropdown-menu {
        position: static;
        transform: none;
        padding-top: 0;
    }

    [b-7bj1igi8rv] .dropdown-menu .dropdown-item {
        padding-left: 36px;
        font-size: 12px;
        background: transparent;
        border: none;
        border-radius: 0;
    }

    [b-7bj1igi8rv] .dropdown-menu .dropdown-item:first-child,
    [b-7bj1igi8rv] .dropdown-menu .dropdown-item:last-child {
        border: none;
        border-radius: 0;
    }

    .footer-inner[b-7bj1igi8rv] { justify-content: center; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/About.razor.rz.scp.css */
/* Screen reader only */
.sr-only[b-cuofl8z403] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ABOUT — VIDEO HERO */
.ab-hero[b-cuofl8z403] {
    position: relative;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 80px;
    overflow: hidden;
}

.ab-hero__bg[b-cuofl8z403] {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.ab-hero__poster[b-cuofl8z403] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
    display: block;
}

.ab-hero__overlay[b-cuofl8z403] {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(10,10,10,.3) 0%, rgba(10,10,10,.1) 35%, rgba(10,10,10,.7) 65%, var(--bg) 100%);
    pointer-events: none;
    transition: opacity .6s ease, background .6s ease;
}

.ab-hero__overlay.playing[b-cuofl8z403] {
    background: linear-gradient(to bottom, transparent 0%, transparent 60%, var(--bg) 100%);
}

/* video element — hidden until play */
#brandVideo[b-cuofl8z403] {
    display: none;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.ab-hero__play[b-cuofl8z403] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    background: rgba(0,0,0,.55);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 40px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    font-family: var(--mono);
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s, box-shadow .2s,
                opacity .8s ease, transform .8s ease;
    backdrop-filter: blur(8px);
    z-index: 4;
}

.ab-hero__play:hover[b-cuofl8z403] {
    background: rgba(0,0,0,.75);
    border-color: rgba(0,255,136,.5);
    color: var(--green);
    box-shadow: 0 0 30px rgba(0,255,136,.15);
}

.ab-hero__play.hidden[b-cuofl8z403] {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(.85);
}

/* close button — fades + scales in once video is playing */
.ab-hero__close[b-cuofl8z403] {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 6;
    background: rgba(0,0,0,.55);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #fff;
    backdrop-filter: blur(8px);
    opacity: 0;
    pointer-events: none;
    transform: scale(.8);
    transition: opacity .3s ease, transform .3s ease, border-color .15s, color .15s;
}

.ab-hero__close.visible[b-cuofl8z403] {
    opacity: 1;
    pointer-events: all;
    transform: scale(1);
}

.ab-hero__close:hover[b-cuofl8z403] {
    border-color: rgba(0,255,136,.5);
    color: var(--green);
}

.ab-hero__content[b-cuofl8z403] {
    position: relative;
    z-index: 3;
    text-align: center;
    transition: opacity .9s ease, transform .9s ease;
}

.ab-hero__content.hidden[b-cuofl8z403] {
    opacity: 0;
    transform: translateY(12px);
}

.ab-hero__title[b-cuofl8z403] {
    font-size: clamp(52px, 9vw, 100px);
    font-weight: 900;
    letter-spacing: -0.05em;
    font-family: 'Inter', sans-serif;
    line-height: .88;
    color: #fff;
    text-shadow: 0 2px 40px rgba(0,0,0,.5);
}

.ab-hero__title em[b-cuofl8z403] { font-style: normal; color: var(--green); }

.ab-hero__scroll[b-cuofl8z403] {
    position: absolute;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    font-size: 20px;
    color: rgba(255,255,255,.3);
    cursor: pointer;
    animation: bounce-down-b-cuofl8z403 1.8s ease-in-out infinite;
    transition: color .2s, opacity .4s;
    background: none;
    border: none;
}

.ab-hero__scroll:hover[b-cuofl8z403] { color: var(--green); }

.ab-hero__scroll.hidden[b-cuofl8z403] {
    opacity: 0;
    pointer-events: none;
}

@keyframes bounce-down-b-cuofl8z403 {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(6px); }
}

/* ── CUSTOM CONTROLS ── */
.ab-hero__controls[b-cuofl8z403] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 5;
    padding: 20px 28px 28px;
    background: linear-gradient(to top, rgba(0,0,0,.7) 0%, transparent 100%);
    display: flex;
    align-items: center;
    gap: 14px;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .45s ease, transform .45s ease;
    pointer-events: none;
}

.ab-hero__controls.visible[b-cuofl8z403] {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
}

.ctrl-playpause[b-cuofl8z403] {
    background: none;
    border: none;
    cursor: pointer;
    color: #fff;
    padding: 4px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color .15s;
}

.ctrl-playpause:hover[b-cuofl8z403] { color: var(--green); }

.ctrl-progress[b-cuofl8z403] {
    flex: 1;
    height: 3px;
    background: rgba(255,255,255,.2);
    border-radius: 2px;
    position: relative;
    cursor: pointer;
    overflow: visible;
}

.ctrl-progress__fill[b-cuofl8z403] {
    height: 100%;
    background: var(--green);
    border-radius: 2px;
    width: 0%;
    pointer-events: none;
    position: relative;
    transition: width .1s linear;
}

.ctrl-progress__fill[b-cuofl8z403]::after {
    content: '';
    position: absolute;
    right: -5px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    background: var(--green);
    border-radius: 50%;
    opacity: 0;
    transition: opacity .15s;
}

.ctrl-progress:hover .ctrl-progress__fill[b-cuofl8z403]::after { opacity: 1; }

.ctrl-time[b-cuofl8z403] {
    font-family: var(--mono);
    font-size: 11px;
    color: rgba(255,255,255,.55);
    white-space: nowrap;
    flex-shrink: 0;
}

.ctrl-volume[b-cuofl8z403] {
    background: none;
    border: none;
    cursor: pointer;
    color: rgba(255,255,255,.55);
    padding: 4px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color .15s;
}

.ctrl-volume:hover[b-cuofl8z403] { color: var(--green); }

.ctrl-quality[b-cuofl8z403] {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--dim);
    border: 1px solid var(--border);
    padding: 2px 6px;
    border-radius: 3px;
    flex-shrink: 0;
}

.ctrl-fullscreen[b-cuofl8z403] {
    background: none;
    border: none;
    cursor: pointer;
    color: rgba(255,255,255,.55);
    padding: 4px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color .15s;
}

.ctrl-fullscreen:hover[b-cuofl8z403] { color: var(--green); }

/* Pulse dot animation (manifesto + founder eyebrows) */
@keyframes pdot-b-cuofl8z403 { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }

/* ABOUT — MANIFESTO ("we exist for the trader") */
.ab-manifesto[b-cuofl8z403] {
    max-width: 760px;
    margin: 0 auto;
    padding: 120px 48px 40px;
    text-align: center;
}
.ab-manifesto__eyebrow[b-cuofl8z403] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--green);
    font-family: var(--mono);
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.ab-manifesto__eyebrow[b-cuofl8z403]::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot-b-cuofl8z403 2s infinite;
}
.ab-manifesto__title[b-cuofl8z403] {
    font-size: clamp(44px, 7vw, 76px);
    font-weight: 900;
    letter-spacing: -0.0395em;
    font-family: 'Inter', sans-serif;
    line-height: .95;
    color: #fff;
    margin-bottom: 48px;
}
.ab-manifesto__title em[b-cuofl8z403] { font-style: normal; color: var(--green); }
.ab-manifesto__body[b-cuofl8z403] {
    max-width: 560px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.ab-manifesto__body p[b-cuofl8z403] {
    font-size: clamp(15px, 1.7vw, 17px);
    line-height: 1.65;
    color: var(--muted);
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 400;
}
.ab-manifesto__body p strong[b-cuofl8z403] { color: var(--text); font-weight: 600; }
.ab-manifesto__body p em[b-cuofl8z403] { font-style: normal; color: var(--green); font-weight: 600; }

/* ABOUT — FOUNDER'S NOTE */
.ab-founder[b-cuofl8z403] {
    max-width: 680px;
    margin: 0 auto;
    padding: 80px 48px 60px;
    position: relative;
}
.ab-founder__eyebrow[b-cuofl8z403] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--green);
    font-family: var(--mono);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.ab-founder__eyebrow[b-cuofl8z403]::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot-b-cuofl8z403 2s infinite;
}
.ab-founder__title[b-cuofl8z403] {
    font-size: clamp(36px, 5.5vw, 56px);
    font-weight: 900;
    letter-spacing: -0.0357em;
    font-family: 'Inter', sans-serif;
    line-height: .95;
    color: #fff;
    margin-bottom: 36px;
}
.ab-founder__title em[b-cuofl8z403] { font-style: normal; color: var(--green); }
.ab-founder__letter[b-cuofl8z403] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 36px;
}
.ab-founder__letter p[b-cuofl8z403] {
    font-size: 16px;
    line-height: 1.65;
    color: var(--muted);
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 400;
    margin: 0;
}
.ab-founder__letter p strong[b-cuofl8z403] { color: var(--text); font-weight: 600; }
.ab-founder__letter p em[b-cuofl8z403] { font-style: normal; color: var(--green); font-weight: 600; }
.ab-founder__sign[b-cuofl8z403] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 28px;
    border-top: 1px solid var(--border);
}
.ab-founder__sig[b-cuofl8z403] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.ab-founder__name[b-cuofl8z403] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 18px;
    color: #fff;
    letter-spacing: -.3px;
}
.ab-founder__role[b-cuofl8z403] {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 700;
    color: var(--dim);
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.ab-founder__linkedin[b-cuofl8z403] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 6px;
    background: rgba(0,255,136,.06);
    border: 1px solid rgba(0,255,136,.2);
    color: var(--green);
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    transition: all .15s;
}
.ab-founder__linkedin:hover[b-cuofl8z403] {
    background: rgba(0,255,136,.12);
    border-color: var(--green);
    transform: translateY(-1px);
}

@media (max-width: 600px) {
    .ab-manifesto[b-cuofl8z403] { padding: 80px 24px 32px; }
    .ab-founder[b-cuofl8z403] { padding: 60px 24px 48px; }
    .ab-founder__sign[b-cuofl8z403] { flex-wrap: wrap; }
}

/* ABOUT — BELIEF */
.ab-belief[b-cuofl8z403] {
    padding: 20px 48px 100px;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.ab-belief__text[b-cuofl8z403] {
    font-size: clamp(52px, 10vw, 96px);
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    letter-spacing: -0.0521em;
    line-height: .88;
    color: #fff;
    margin-bottom: 40px;
}

.ab-belief__text em[b-cuofl8z403] { font-style: normal; color: var(--green); }

.ab-belief__btn[b-cuofl8z403] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 32px;
    background: var(--green);
    color: #000;
    font-size: 14px;
    font-weight: 800;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: -.2px;
    transition: all .2s;
}

.ab-belief__btn:hover[b-cuofl8z403] {
    box-shadow: 0 0 40px rgba(0,255,136,.35);
    transform: translateY(-2px);
}

@media (max-width: 700px) {
    .ab-hero[b-cuofl8z403] { height: 70vh; padding-bottom: 40px; }
    .ab-hero__poster[b-cuofl8z403] { object-position: center center; }
}

@media (max-width: 600px) {
    .ab-pairs[b-cuofl8z403] { padding: 60px 24px 40px; }
    .ab-belief[b-cuofl8z403] { padding: 20px 24px 80px; }
    .ab-pair[b-cuofl8z403] { grid-template-columns: 1fr 28px 1fr; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/Activate.razor.rz.scp.css */
.activate-shell[b-90eue9wnu3] {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.activate-card[b-90eue9wnu3] {
    width: 100%;
    max-width: 420px;
    background: var(--surface-1, #18181b);
    border: 1px solid var(--outline, #3f3f46);
    border-radius: 14px;
    padding: 2rem 1.75rem;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
}

.activate-mark[b-90eue9wnu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--fg-1, #e4e4e7);
    margin-bottom: 1.25rem;
}

.wick-pulse[b-90eue9wnu3] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--wick-green, #00ff88);
    box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.6);
    animation: wick-pulse-b-90eue9wnu3 1.8s infinite;
}

@keyframes wick-pulse-b-90eue9wnu3 {
    0% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.5); }
    70% { box-shadow: 0 0 0 8px rgba(0, 255, 136, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0); }
}

.activate-title[b-90eue9wnu3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--fg-1, #e4e4e7);
    margin: 0 0 0.5rem;
}

.activate-sub[b-90eue9wnu3] {
    color: var(--fg-2, #a1a1aa);
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0 0 1.5rem;
}

.activate-phone[b-90eue9wnu3] {
    display: block;
    margin-top: 0.35rem;
    color: var(--fg-3, #71717a);
    font-size: 0.85rem;
}

/* EditForm/InputText/ValidationMessage are child components — their rendered elements don't carry
   this component's CSS-isolation attribute, so everything inside the wrapper styles via ::deep. */
.activate-form-wrap[b-90eue9wnu3] {
    margin-top: 0.25rem;
}

.activate-form-wrap[b-90eue9wnu3]  .activate-form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activate-form-wrap[b-90eue9wnu3]  .activate-label {
    font-size: 0.8rem;
    text-transform: lowercase;
    color: var(--fg-2, #a1a1aa);
}

.activate-form-wrap[b-90eue9wnu3]  .activate-input {
    width: 100%;
    box-sizing: border-box;
    background: var(--bg-0, #0a0a0a);
    border: 1px solid var(--outline, #3f3f46);
    border-radius: 8px;
    padding: 0.7rem 0.85rem;
    color: var(--fg-1, #e4e4e7);
    font-size: 1rem;
    font-family: inherit;
}

.activate-form-wrap[b-90eue9wnu3]  .activate-input:focus {
    outline: none;
    border-color: var(--wick-green, #00ff88);
    box-shadow: 0 0 0 3px rgba(0, 255, 136, 0.15);
}

.activate-form-wrap[b-90eue9wnu3]  .activate-btn {
    margin-top: 0.75rem;
    background: var(--wick-green, #00ff88);
    color: #0a0a0a;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    cursor: pointer;
    transition: filter 0.15s ease;
}

.activate-form-wrap[b-90eue9wnu3]  .activate-btn:hover {
    filter: brightness(1.08);
}

.activate-form-wrap[b-90eue9wnu3]  .activate-validation {
    color: var(--wick-red, #ff3b3b);
    font-size: 0.8rem;
}

.activate-error[b-90eue9wnu3] {
    background: rgba(255, 59, 59, 0.12);
    border: 1px solid rgba(255, 59, 59, 0.4);
    color: #fca5a5;
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

.activate-fine[b-90eue9wnu3] {
    margin-top: 1.25rem;
    color: var(--fg-3, #71717a);
    font-size: 0.75rem;
    line-height: 1.45;
}
/* _content/TheWick.MarketingWaitList/Components/Pages/AlgoTrading101.razor.rz.scp.css */
/* Algo Trading 101 Layout */
.algo101-container[b-2zhoksznbz] {
    min-height: calc(100vh - 48px);
}

/* Sidebar — fixed to left edge of viewport so it stays visible on scroll */
.algo101-sidebar[b-2zhoksznbz] {
    position: fixed;
    top: 48px;
    left: 0;
    width: 260px;
    height: calc(100vh - 48px);
    background-color: var(--surface2);
    border-right: 1px solid var(--border);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    z-index: 50;
}

.algo101-sidebar[b-2zhoksznbz]::-webkit-scrollbar {
    width: 3px;
}

.algo101-sidebar[b-2zhoksznbz]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.1);
}

.sidebar-header[b-2zhoksznbz] {
    padding: 18px 16px 14px;
    border-bottom: 1px solid var(--border);
}

.sidebar-label[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--muted);
    letter-spacing: 0.8px;
    text-transform: uppercase;
    margin-bottom: 4px;
    font-family: monospace;
}

.sidebar-name[b-2zhoksznbz] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
    line-height: 1.3;
}

.sidebar-nav[b-2zhoksznbz] {
    padding: 4px 0 20px;
}

.nav-section[b-2zhoksznbz] {
    margin-bottom: 4px;
}

.nav-section-header[b-2zhoksznbz] {
    padding: 12px 16px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.nav-section-number[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    letter-spacing: 0.5px;
    flex-shrink: 0;
    font-family: monospace;
}

.nav-section-title[b-2zhoksznbz] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.2px;
    line-height: 1.2;
}

.nav-item[b-2zhoksznbz] {
    display: block;
    padding: 8px 16px 8px 28px;
    font-size: 13px;
    font-weight: 500;
    color: var(--muted);
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s;
    border-left: 2px solid transparent;
    line-height: 1.3;
}

.nav-item:hover[b-2zhoksznbz] {
    color: var(--text);
    background: rgba(255, 255, 255, 0.03);
}

.nav-item.active[b-2zhoksznbz] {
    color: var(--green);
    background: rgba(0, 255, 136, 0.06);
    border-left-color: var(--green);
    font-weight: 600;
}

/* Main Content — offset by sidebar width so fixed sidebar doesn't overlap */
.algo101-content[b-2zhoksznbz] {
    margin-left: 260px;
    min-width: 0;
}

/* Module Hero */
.m-hero[b-2zhoksznbz] {
    position: relative;
    padding: 72px 64px 56px;
    overflow: hidden;
    border-bottom: 1px solid var(--border);
    max-width: 760px;
}

.m-hero[b-2zhoksznbz]::after {
    content: '';
    position: absolute;
    top: -80px;
    left: 50%;
    transform: translateX(-50%);
    width: 700px;
    height: 400px;
    background: radial-gradient(ellipse, rgba(0, 255, 136, 0.05) 0%, transparent 65%);
    pointer-events: none;
}

.m-chapter[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: monospace;
}

.m-chapter[b-2zhoksznbz]::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--green);
}

.m-title[b-2zhoksznbz] {
    font-size: 52px;
    font-weight: 900;
    line-height: 0.96;
    letter-spacing: -0.0481em;
    color: var(--text);
    margin-bottom: 14px;
}

.m-title em[b-2zhoksznbz] {
    font-style: normal;
    color: var(--green);
}

.m-sub[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.6;
    max-width: 480px;
    font-family: monospace;
}

/* Module Body */
.m-body[b-2zhoksznbz] {
    padding: 48px 64px 72px;
    max-width: 760px;
}

.m-body > * + *[b-2zhoksznbz] {
    margin-top: 28px;
}

/* Eyebrow */
.eyebrow[b-2zhoksznbz] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 48px;
    margin-bottom: 8px;
    font-family: monospace;
}

.eyebrow[b-2zhoksznbz]::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot-b-2zhoksznbz 2s infinite;
}

@keyframes pdot-b-2zhoksznbz {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* Section Heading */
.s-head[b-2zhoksznbz] {
    font-size: 22px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -0.5px;
    line-height: 1.1;
    margin-top: 4px;
    margin-bottom: 12px;
}

/* Prose */
.prose[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--text);
    line-height: 1.85;
}

.prose strong[b-2zhoksznbz] {
    color: #fff;
    font-weight: 600;
}

/* AKA Strip */
.aka-strip[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.aka-label[b-2zhoksznbz] {
    font-size: 10px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    flex-shrink: 0;
    font-family: monospace;
}

.aka-tag[b-2zhoksznbz] {
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--muted);
    letter-spacing: 0.2px;
    font-family: monospace;
}

/* VS Grid */
.vs-grid[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 28px 0;
}

.vs-card[b-2zhoksznbz] {
    border-radius: 12px;
    padding: 24px;
    border: 1px solid;
}

.vs-card.bad[b-2zhoksznbz] {
    background: rgba(255, 59, 59, 0.06);
    border-color: rgba(255, 59, 59, 0.12);
}

.vs-card.good[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    border-color: rgba(0, 255, 136, 0.2);
}

.vs-tag[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 12px;
    font-family: monospace;
}

.vs-card.bad .vs-tag[b-2zhoksznbz] {
    color: #FF3B3B;
}

.vs-card.good .vs-tag[b-2zhoksznbz] {
    color: var(--green);
}

.vs-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 12px;
}

.vs-list[b-2zhoksznbz] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.vs-list li[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--muted);
    padding: 4px 0 4px 16px;
    position: relative;
    line-height: 1.5;
}

.vs-list li[b-2zhoksznbz]::before {
    position: absolute;
    left: 0;
    font-size: 11px;
}

.vs-card.bad .vs-list li[b-2zhoksznbz]::before {
    content: '\2715';
    color: #FF3B3B;
    opacity: 0.7;
}

.vs-card.good .vs-list li[b-2zhoksznbz]::before {
    content: '\2713';
    color: var(--green);
}

/* Workflow */
.workflow[b-2zhoksznbz] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 32px 0;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
}

.wf-item[b-2zhoksznbz] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    transition: background 0.15s;
    position: relative;
}

.wf-item:last-child[b-2zhoksznbz] {
    border-bottom: none;
}

.wf-item:hover[b-2zhoksznbz] {
    background: rgba(255, 255, 255, 0.03);
}

.wf-item.on-wick[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    border-left: 2px solid var(--green);
}

.wf-num[b-2zhoksznbz] {
    font-size: 22px;
    font-weight: 900;
    color: var(--muted);
    line-height: 1;
    flex-shrink: 0;
    width: 28px;
    padding-top: 2px;
    letter-spacing: -1px;
}

.wf-item.on-wick .wf-num[b-2zhoksznbz] {
    color: var(--green);
}

.wf-body[b-2zhoksznbz] {
    flex: 1;
}

.wf-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 4px;
}

.wf-desc[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--muted);
    line-height: 1.6;
}

.wf-badge[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 3px;
    white-space: nowrap;
    margin-left: auto;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 3px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-family: monospace;
}

.wf-badge.wick[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, 0.2);
}

.wf-badge.standard[b-2zhoksznbz] {
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted);
    border: 1px solid var(--border);
}

/* Build Example */
.build-example[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    margin: 20px 0;
}

.build-ex-label[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 10px 18px;
    border-bottom: 1px solid var(--border);
    background: rgba(0, 255, 136, 0.06);
    font-family: monospace;
}

.build-ex-body[b-2zhoksznbz] {
    padding: 16px 18px;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.65;
}

.build-rule[b-2zhoksznbz] {
    display: flex;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
}

.build-rule:last-child[b-2zhoksznbz] {
    border-bottom: none;
}

.build-rule-n[b-2zhoksznbz] {
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    width: 140px;
    flex-shrink: 0;
    padding-top: 1px;
    font-family: monospace;
}

.build-rule-v[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--text);
}

/* Pull Statement */
.pull-statement[b-2zhoksznbz] {
    font-size: 22px;
    font-weight: 800;
    color: var(--text);
    line-height: 1.3;
    letter-spacing: -0.5px;
    margin: 32px 0;
    padding: 0;
}

/* Stat Callout */
.stat-callout[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px 24px;
    margin: 24px 0;
}

.stat-callout.right[b-2zhoksznbz] {
    flex-direction: row-reverse;
    text-align: right;
}

.stat-n[b-2zhoksznbz] {
    font-size: 48px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.0417em;
    flex-shrink: 0;
    color: var(--green);
}

.stat-body[b-2zhoksznbz] {
    flex: 1;
}

.stat-label[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--text);
    line-height: 1.5;
    font-weight: 500;
}

.stat-source[b-2zhoksznbz] {
    font-size: 9px;
    color: var(--muted);
    margin-top: 5px;
    letter-spacing: 0.3px;
    font-family: monospace;
}

/* Pull Quote */
.pull[b-2zhoksznbz] {
    border-left: 2px solid var(--green);
    padding: 16px 22px;
    background: rgba(0, 255, 136, 0.06);
    border-radius: 0 8px 8px 0;
    margin: 28px 0;
}

.pull-text[b-2zhoksznbz] {
    font-size: 19px;
    font-weight: 300;
    color: var(--text);
    line-height: 1.5;
    font-style: italic;
}

.pull-src[b-2zhoksznbz] {
    font-size: 9px;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-top: 8px;
    font-family: monospace;
}

/* Two-Truth Grid */
.two-truth[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    gap: 0;
    margin: 32px 0;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
}

.truth-item[b-2zhoksznbz] {
    padding: 28px 32px;
}

.truth-divider[b-2zhoksznbz] {
    background: var(--border);
}

.truth-n[b-2zhoksznbz] {
    font-family: var(--mono);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    line-height: 1;
    margin-bottom: 12px;
}

.truth-n.green[b-2zhoksznbz] {
    color: var(--green);
}

.truth-n.purple[b-2zhoksznbz] {
    color: #A855F7;
}

.truth-txt[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--text);
    line-height: 1.7;
    margin-bottom: 16px;
}

.truth-list[b-2zhoksznbz] {
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: var(--mono);
}

.truth-list li[b-2zhoksznbz] {
    font-size: 11px;
    color: var(--dim);
    padding: 4px 0 4px 18px;
    position: relative;
    line-height: 1.8;
}

.truth-list li[b-2zhoksznbz]::before {
    content: '\2713';
    position: absolute;
    left: 0;
    font-size: 11px;
}

.truth-item:first-child .truth-list li[b-2zhoksznbz]::before {
    color: var(--green);
}

.truth-item:last-child .truth-list li[b-2zhoksznbz]::before {
    color: #A855F7;
}

.truth-list li.warn[b-2zhoksznbz]::before {
    content: '\26A0';
    color: #FACC15;
}

/* Callout Boxes */
.callout[b-2zhoksznbz] {
    border-radius: 14px;
    padding: 20px 22px;
    margin: 28px 0;
    border: 1px solid;
}

.callout-lbl[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 6px;
    font-family: monospace;
}

.callout-txt[b-2zhoksznbz] {
    font-size: 15px;
    line-height: 1.7;
}

.callout-txt strong[b-2zhoksznbz] {
    font-weight: 600;
}

.callout.info[b-2zhoksznbz] {
    background: rgba(56, 189, 248, 0.06);
    border-color: rgba(56, 189, 248, 0.2);
}

.callout.info .callout-lbl[b-2zhoksznbz] {
    color: #38BDF8;
}

.callout.info .callout-txt[b-2zhoksznbz] {
    color: #BAE6FD;
}

.callout.warn[b-2zhoksznbz] {
    background: rgba(255, 59, 59, 0.06);
    border-color: rgba(255, 59, 59, 0.12);
}

.callout.warn .callout-lbl[b-2zhoksznbz] {
    color: #FF3B3B;
}

.callout.warn .callout-txt[b-2zhoksznbz] {
    color: #FECACA;
}

.callout.ok[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    border-color: rgba(0, 255, 136, 0.2);
}

.callout.ok .callout-lbl[b-2zhoksznbz] {
    color: var(--green);
}

.callout.ok .callout-txt[b-2zhoksznbz] {
    color: #D1FAE5;
}

/* Honest Box */
.honest-box[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 28px 32px;
    margin: 24px 0;
    position: relative;
    overflow: hidden;
}

.honest-box[b-2zhoksznbz]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 255, 136, 0.4), transparent);
}

.honest-box p[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--muted);
    line-height: 1.75;
    margin: 0 0 12px;
}

.honest-box p:last-child[b-2zhoksznbz] {
    margin-bottom: 0;
    color: var(--text);
}

.honest-lbl[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 16px;
    font-family: monospace;
}

/* FAQ Section */
.faq-section[b-2zhoksznbz] {
    margin: 48px 0 0;
}

.faq-eyebrow[b-2zhoksznbz] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-family: monospace;
}

.faq-eyebrow[b-2zhoksznbz]::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
}

.faq-title[b-2zhoksznbz] {
    font-size: 22px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -0.5px;
    margin-bottom: 4px;
}

.faq-sub[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--muted);
    margin-bottom: 24px;
}

.faq-item[b-2zhoksznbz] {
    border: 1px solid var(--border);
    border-radius: 14px;
    margin-bottom: 8px;
    overflow: hidden;
    background: var(--surface2);
    transition: border-color 0.2s;
}

.faq-item.open[b-2zhoksznbz] {
    border-color: var(--muted);
}

.faq-q[b-2zhoksznbz] {
    font-size: 16px;
    font-weight: 700;
    color: var(--text);
    padding: 18px 20px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    user-select: none;
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    font-family: inherit;
}

.faq-q[b-2zhoksznbz]::after {
    content: '\25B8';
    color: var(--muted);
    transition: transform 0.2s;
    font-size: 12px;
    flex-shrink: 0;
}

.faq-item.open .faq-q[b-2zhoksznbz]::after {
    transform: rotate(90deg);
    color: var(--green);
}

.faq-a[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--muted);
    line-height: 1.75;
    padding: 0 20px 18px;
    display: none;
}

.faq-item.open .faq-a[b-2zhoksznbz] {
    display: block;
}

/* Deploy Table */
.deploy-table[b-2zhoksznbz] {
    margin: 28px 0;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
}

.deploy-table-label[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 10px 18px;
    border-bottom: 1px solid var(--border);
    background: rgba(0, 255, 136, 0.06);
    font-family: monospace;
}

.deploy-row[b-2zhoksznbz] {
    display: flex;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    transition: background 0.15s;
}

.deploy-row:last-child[b-2zhoksznbz] {
    border-bottom: none;
}

.deploy-row:hover[b-2zhoksznbz] {
    background: rgba(255, 255, 255, 0.03);
}

.deploy-row.is-wick[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    border-left: 2px solid var(--green);
}

.deploy-name[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 2px;
}

.deploy-examples[b-2zhoksznbz] {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
    font-family: monospace;
}

.deploy-desc[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.6;
}

.deploy-tags[b-2zhoksznbz] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.deploy-tag[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-family: monospace;
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted);
    border: 1px solid var(--border);
}

.deploy-tag.wick[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.06);
    color: var(--green);
    border-color: rgba(0, 255, 136, 0.2);
}

.deploy-capital[b-2zhoksznbz] {
    font-size: 11px;
    color: var(--muted);
    margin-top: 6px;
    font-family: monospace;
}

/* Strategy Type Cards (6-card grid) */
.type-grid[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 28px 0;
}

.type-card[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px 26px;
    transition: border-color 0.2s;
}

.type-card:hover[b-2zhoksznbz] {
    border-color: var(--muted);
}

.type-card-tag[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 8px;
    font-family: var(--mono);
}

.type-card-tag.green[b-2zhoksznbz] { color: var(--green); }
.type-card-tag.blue[b-2zhoksznbz] { color: #38BDF8; }
.type-card-tag.purple[b-2zhoksznbz] { color: #A855F7; }
.type-card-tag.yellow[b-2zhoksznbz] { color: #FACC15; }
.type-card-tag.orange[b-2zhoksznbz] { color: #F97316; }
.type-card-tag.red[b-2zhoksznbz] { color: #FF3B3B; }

.type-card-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 8px;
}

.type-card-desc[b-2zhoksznbz] {
    font-size: 15px;
    color: var(--text);
    line-height: 1.7;
    margin-bottom: 8px;
}

.type-card-examples[b-2zhoksznbz] {
    font-size: 10px;
    color: var(--dim);
    font-family: var(--mono);
    margin-top: 10px;
    line-height: 1.8;
}

/* Metric Grid */
.metric-grid[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 28px 0;
}

.metric-card[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px;
}

.metric-card-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 4px;
}

.metric-card-aka[b-2zhoksznbz] {
    font-size: 10px;
    color: var(--muted);
    margin-bottom: 10px;
    font-family: monospace;
}

.metric-card-desc[b-2zhoksznbz] {
    font-size: 14px;
    color: #c4c4c8;
    line-height: 1.7;
}

/* Control Grid */
.control-grid[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 28px 0;
}

.control-card[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px;
}

.control-card-icon[b-2zhoksznbz] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    font-size: 18px;
}

.control-card-icon.red[b-2zhoksznbz] {
    background: rgba(255, 59, 59, 0.1);
    color: #FF3B3B;
}

.control-card-icon.yellow[b-2zhoksznbz] {
    background: rgba(250, 204, 21, 0.1);
    color: #FACC15;
}

.control-card-icon.purple[b-2zhoksznbz] {
    background: rgba(168, 85, 247, 0.1);
    color: #A855F7;
}

.control-card-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 8px;
}

.control-card-desc[b-2zhoksznbz] {
    font-size: 14px;
    color: #c4c4c8;
    line-height: 1.7;
}

/* Step Grid */
.step-grid[b-2zhoksznbz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 28px 0;
}

.step-card[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px;
}

.step-card-icon[b-2zhoksznbz] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 700;
}

.step-card-icon.do[b-2zhoksznbz] {
    background: rgba(0, 255, 136, 0.15);
    color: var(--green);
}

.step-card-icon.dont[b-2zhoksznbz] {
    background: rgba(255, 59, 59, 0.15);
    color: #FF3B3B;
}

.step-card-title[b-2zhoksznbz] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 8px;
}

.step-card-desc[b-2zhoksznbz] {
    font-size: 14px;
    color: #c4c4c8;
    line-height: 1.7;
}

/* Timeline — v3 course: bare nodes with absolute-positioned number dots in a
   -52px gutter, connected by a vertical line (see .tl-node/.tl-dot). The old
   card chrome (background/border/overflow:hidden) clipped the dots. */
.timeline[b-2zhoksznbz] {
    position: relative;
    margin: 28px 0;
    padding-left: 52px;
}

.timeline-item[b-2zhoksznbz] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    background: rgba(0, 255, 136, 0.06);
    border-left: 2px solid var(--green);
}

.timeline-item:last-child[b-2zhoksznbz] {
    border-bottom: none;
}

.timeline-num[b-2zhoksznbz] {
    font-size: 22px;
    font-weight: 900;
    color: var(--green);
    line-height: 1;
    flex-shrink: 0;
    width: 28px;
    padding-top: 2px;
    letter-spacing: -1px;
}

.timeline-body[b-2zhoksznbz] {
    flex: 1;
}

.timeline-title[b-2zhoksznbz] {
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 4px;
}

.timeline-desc[b-2zhoksznbz] {
    font-size: 16px;
    color: var(--muted);
    line-height: 1.6;
}

/* Key Takeaway — mock-style: green left border + green-tinted background */
.m-takeaway[b-2zhoksznbz] {
    margin: 52px 0 0;
    border-left: 2px solid var(--green);
    padding: 18px 22px;
    background: rgba(0, 255, 136, 0.06);
    border-radius: 0 8px 8px 0;
}

.takeaway-lbl[b-2zhoksznbz] {
    font-family: var(--mono);
    font-size: 9px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.takeaway-txt[b-2zhoksznbz] {
    font-family: 'Space Grotesk', 'Inter', sans-serif;
    font-size: 17px;
    color: var(--text);
    line-height: 1.7;
}

/* Legacy Key Takeaway (unused; kept for compatibility) */
.key-takeaway[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 28px 32px;
    margin: 48px 0 0;
    position: relative;
    overflow: hidden;
}

.key-takeaway[b-2zhoksznbz]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--green), transparent);
}

.key-takeaway-lbl[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
    font-family: monospace;
}

.key-takeaway-txt[b-2zhoksznbz] {
    font-size: 18px;
    font-weight: 500;
    color: var(--text);
    line-height: 1.5;
    font-style: italic;
}

/* Content Divider */
.c-divider[b-2zhoksznbz] {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border), transparent);
    margin: 40px 0;
}

/* Chapter Link */
.ch-link[b-2zhoksznbz] {
    color: var(--green);
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 255, 136, 0.3);
    cursor: pointer;
    transition: border-color 0.15s;
}

.ch-link:hover[b-2zhoksznbz] {
    border-color: var(--green);
}

/* Article Navigation */
.article-nav[b-2zhoksznbz] {
    display: flex;
    justify-content: space-between;
    margin-top: 48px;
    padding-top: 24px;
    border-top: 1px solid var(--border);
}

.nav-prev[b-2zhoksznbz],
.nav-next[b-2zhoksznbz] {
    display: flex;
    flex-direction: column;
    padding: 16px 20px;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 8px;
    text-decoration: none;
    transition: border-color 0.2s;
    max-width: 280px;
    cursor: pointer;
}

.nav-prev:hover[b-2zhoksznbz],
.nav-next:hover[b-2zhoksznbz] {
    border-color: var(--green);
}

.nav-prev[b-2zhoksznbz] {
    align-items: flex-start;
}

.nav-next[b-2zhoksznbz] {
    align-items: flex-end;
    text-align: right;
}

.nav-prev span[b-2zhoksznbz],
.nav-next span[b-2zhoksznbz] {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 4px;
}

.nav-prev strong[b-2zhoksznbz],
.nav-next strong[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--text);
}

/* Responsive */
@media (max-width: 1024px) {
    .algo101-sidebar[b-2zhoksznbz] {
        display: none;
    }

    .algo101-content[b-2zhoksznbz] {
        margin-left: 0;
    }

    .m-hero[b-2zhoksznbz] {
        padding: 40px 24px 32px;
    }

    .m-body[b-2zhoksznbz] {
        padding: 24px;
    }

    .m-title[b-2zhoksznbz] {
        font-size: 36px;
        letter-spacing: -1.5px;
    }
}

@media (max-width: 768px) {
    .vs-grid[b-2zhoksznbz],
    .type-grid[b-2zhoksznbz],
    .metric-grid[b-2zhoksznbz],
    .control-grid[b-2zhoksznbz],
    .step-grid[b-2zhoksznbz] {
        grid-template-columns: 1fr;
    }

    .two-truth[b-2zhoksznbz] {
        grid-template-columns: 1fr;
    }

    .truth-divider[b-2zhoksznbz] {
        height: 1px;
        width: 100%;
    }

    .article-nav[b-2zhoksznbz] {
        flex-direction: column;
        gap: 12px;
    }

    .nav-prev[b-2zhoksznbz],
    .nav-next[b-2zhoksznbz] {
        max-width: 100%;
    }

    .stat-callout[b-2zhoksznbz] {
        flex-direction: column;
        text-align: center;
    }

    .stat-callout.right[b-2zhoksznbz] {
        flex-direction: column;
    }
}

/* ─── Regulatory compliance notice (Chapter 1) ─────────────────────────── */
.compliance-notice[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid rgba(250, 204, 21, 0.22);
    border-radius: 14px;
    padding: 20px 24px;
    margin: 0 0 28px;
}

.compliance-head[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.compliance-pip[b-2zhoksznbz] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--yellow);
    flex-shrink: 0;
}

.compliance-lbl[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--yellow);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: monospace;
}

.compliance-body p[b-2zhoksznbz] {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.7;
    margin: 0 0 10px;
}

.compliance-body p:last-child[b-2zhoksznbz] {
    margin-bottom: 0;
}

.compliance-body strong[b-2zhoksznbz] {
    color: var(--text);
    font-weight: 600;
}

/* ─── Prose note — muted caveat / aside ────────────────────────────────── */
.prose-note[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.75;
    border-left: 2px solid var(--border);
    padding-left: 16px;
    margin: 16px 0;
}

/* ─── Forward-looking note (Chapter 8) ─────────────────────────────────── */
.forward-note[b-2zhoksznbz] {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.75;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px 20px;
    margin: 0 0 28px;
}

.forward-note strong[b-2zhoksznbz] {
    color: var(--text);
    font-weight: 600;
}

/* ─── Strategy-type color key / legend (Chapter 2) ─────────────────────── */
.color-key[b-2zhoksznbz] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    margin: 16px 0 28px;
    padding: 14px 18px;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 10px;
}

.color-key-lbl[b-2zhoksznbz] {
    font-size: 9px;
    color: var(--dim);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    flex-shrink: 0;
    font-family: monospace;
}

.color-key-item[b-2zhoksznbz] {
    font-size: 10px;
    font-family: monospace;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 6px;
}

.color-key-item[b-2zhoksznbz]::before {
    content: '\25CF';
    font-size: 9px;
}

/* Shared strategy-type accent colors */
.type-card-tag.cyan[b-2zhoksznbz],
.build-rule-n.cyan[b-2zhoksznbz],
.color-key-item.cyan[b-2zhoksznbz]::before { color: #06B6D4; }

.type-card-tag.teal[b-2zhoksznbz],
.build-rule-n.teal[b-2zhoksznbz],
.color-key-item.teal[b-2zhoksznbz]::before { color: #14B8A6; }

.build-rule-n.green[b-2zhoksznbz],
.color-key-item.green[b-2zhoksznbz]::before { color: var(--green); }

.build-rule-n.blue[b-2zhoksznbz],
.color-key-item.blue[b-2zhoksznbz]::before { color: var(--blue); }

.build-rule-n.purple[b-2zhoksznbz],
.color-key-item.purple[b-2zhoksznbz]::before { color: var(--purple); }

.build-rule-n.yellow[b-2zhoksznbz],
.color-key-item.yellow[b-2zhoksznbz]::before { color: var(--yellow); }

.build-rule-n.orange[b-2zhoksznbz],
.color-key-item.orange[b-2zhoksznbz]::before { color: #F97316; }

.build-rule-n.red[b-2zhoksznbz],
.color-key-item.red[b-2zhoksznbz]::before { color: var(--red); }

/* ─── "Institutional only" badge on a strategy-type card ───────────────── */
.type-card-tag-row[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.type-card-tag-row .type-card-tag[b-2zhoksznbz] {
    margin-bottom: 0;
}

.type-card-badge[b-2zhoksznbz] {
    font-size: 9px;
    font-weight: 700;
    color: var(--dim);
    background: var(--surface3);
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 2px 7px;
    letter-spacing: 0.6px;
    font-family: monospace;
    text-transform: none;
}

/* ─── Hypothetical-performance disclosure (Chapter 3) ──────────────────── */
.hypo-disclosure[b-2zhoksznbz] {
    background: rgba(250, 204, 21, 0.04);
    border: 1px solid rgba(250, 204, 21, 0.22);
    border-radius: 12px;
    padding: 18px 22px;
    margin: 20px 0;
}

.hypo-head[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.hypo-pip[b-2zhoksznbz] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--yellow);
    flex-shrink: 0;
}

.hypo-lbl[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--yellow);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-family: monospace;
}

.hypo-body[b-2zhoksznbz] {
    font-size: 12px;
    color: var(--muted);
    line-height: 1.7;
    margin: 0;
}

.hypo-list[b-2zhoksznbz] {
    margin: 12px 0 0;
}

.hypo-list dt[b-2zhoksznbz] {
    font-size: 12px;
    font-weight: 700;
    color: var(--text);
    margin-top: 10px;
}

.hypo-list dd[b-2zhoksznbz] {
    font-size: 12px;
    color: var(--muted);
    line-height: 1.7;
    margin: 2px 0 0;
}

/* ─── Equity-curve comparison block (Chapter 5) ────────────────────────── */
.dd-wrap[b-2zhoksznbz] {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 14px;
    margin: 28px 0;
    overflow: hidden;
}

.dd-hd[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
}

.dd-title[b-2zhoksznbz] {
    font-size: 10px;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-family: monospace;
}

.dd-legend[b-2zhoksznbz] {
    display: flex;
    gap: 16px;
}

.dd-leg[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    color: var(--muted);
    font-family: monospace;
}

.dd-leg-line[b-2zhoksznbz] {
    width: 14px;
    height: 2px;
    display: inline-block;
    border-radius: 2px;
}

.dd-leg-line.green[b-2zhoksznbz] { background: var(--green); }
.dd-leg-line.red[b-2zhoksznbz] { background: var(--red); }

/* ─── Inline aside / non-compensation disclosure (Chapter 8 timeline) ───── */
.tl-aside[b-2zhoksznbz] {
    color: var(--dim);
    font-size: 12px;
}

.dd-svg[b-2zhoksznbz] {
    display: block;
    width: 100%;
    height: 160px;
    background: linear-gradient(180deg, rgba(0, 255, 136, 0.02), transparent);
}

/* ══ v3-FINAL course additions (2026-07-06) ══
   The mock authors rules against short vars (--g, --mt, --dm, --br, …) and the
   content markup uses them in inline styles too, so alias them once here —
   custom properties inherit to all descendants regardless of CSS scoping. */
.algo101-container[b-2zhoksznbz] {
    --bg: #0a0a0a; --s1: var(--surface); --s2: var(--surface2); --s3: var(--surface3); --s4: #1c1c1c;
    --g: var(--green); --g1: rgba(0,255,136,.06); --g2: rgba(0,255,136,.12); --g3: rgba(0,255,136,.2);
    --p: var(--purple); --p1: rgba(168,85,247,.06); --p2: rgba(168,85,247,.12);
    --r: var(--red); --r1: rgba(255,59,59,.06); --r2: rgba(255,59,59,.12);
    --y: var(--yellow); --b: var(--blue);
    --tx: var(--text); --mt: var(--muted); --dm: var(--dim); --br: #3f3f46;
    --inter: 'Inter', sans-serif; --grotesk: 'Space Grotesk', sans-serif;
}

.sc-metric-val.pos[b-2zhoksznbz] {color:var(--g)}
.ctrl-grid[b-2zhoksznbz] {display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:28px 0}
.ctrl-card[b-2zhoksznbz] {background:var(--s2);border:1px solid var(--br);border-radius:12px;padding:20px;transition:border-color .2s;cursor:default;position:relative;overflow:hidden}
.ctrl-card[b-2zhoksznbz]::before {content:'';position:absolute;top:0;left:0;right:0;height:2px}
.ctrl-card.kill[b-2zhoksznbz]::before {background:var(--r)}
.ctrl-card.pos[b-2zhoksznbz]::before {background:var(--y)}
.ctrl-card.stop[b-2zhoksznbz]::before {background:var(--p)}
.ctrl-card.div[b-2zhoksznbz]::before {background:var(--b)}
.ctrl-icon[b-2zhoksznbz] {width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.ctrl-card.kill .ctrl-icon[b-2zhoksznbz] {background:var(--r1);border:1px solid var(--r2)}
.ctrl-card.pos .ctrl-icon[b-2zhoksznbz] {background:rgba(250,204,21,.08);border:1px solid rgba(250,204,21,.15)}
.ctrl-card.stop .ctrl-icon[b-2zhoksznbz] {background:var(--p1);border:1px solid var(--p2)}
.ctrl-card.div .ctrl-icon[b-2zhoksznbz] {background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.15)}
.ctrl-icon svg[b-2zhoksznbz] {width:16px;height:16px;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;fill:none}
.ctrl-card.kill .ctrl-icon svg[b-2zhoksznbz] {stroke:var(--r)}
.ctrl-card.pos .ctrl-icon svg[b-2zhoksznbz] {stroke:var(--y)}
.ctrl-card.stop .ctrl-icon svg[b-2zhoksznbz] {stroke:var(--p)}
.ctrl-card.div .ctrl-icon svg[b-2zhoksznbz] {stroke:var(--b)}
.ctrl-name[b-2zhoksznbz] {font-family:var(--inter);font-size:14px;font-weight:700;color:var(--tx);margin-bottom:5px}
.ctrl-desc[b-2zhoksznbz] {font-family:var(--grotesk);font-size:12px;color:#A1A1AA;line-height:1.55}
.ctrl-desc strong[b-2zhoksznbz] {color:var(--tx)}
.step-n[b-2zhoksznbz] {font-family:var(--inter);font-size:22px;font-weight:900;color:var(--g);opacity:.4;line-height:1;flex-shrink:0;margin-right:12px}
.step-body[b-2zhoksznbz] {flex:1}
.step-title[b-2zhoksznbz] {font-family:var(--inter);font-size:14px;font-weight:700;color:var(--tx);margin-bottom:10px;display:flex;align-items:center;gap:12px}
.step-desc[b-2zhoksznbz] {font-family:var(--grotesk);font-size:13px;color:#C4C4C8;line-height:1.65}
.metric-name[b-2zhoksznbz] {font-family:var(--inter);font-size:14px;font-weight:700;color:var(--tx);margin-bottom:8px}
.metric-aka[b-2zhoksznbz] {font-family:var(--mono);font-size:9px;color:var(--dm);font-weight:400;display:block;margin-top:2px;text-transform:uppercase;letter-spacing:.4px}
.metric-desc[b-2zhoksznbz] {font-family:var(--grotesk);font-size:14px;color:#C4C4C8;line-height:1.7}
.tl-node[b-2zhoksznbz] {position:relative;margin-bottom:28px}
.tl-node:last-child[b-2zhoksznbz] {margin-bottom:0}
.tl-node:not(:last-child)[b-2zhoksznbz]::before {content:'';position:absolute;left:-34px;top:36px;bottom:-28px;width:1px;background:var(--br)}
.tl-dot[b-2zhoksznbz] {position:absolute;left:-52px;width:36px;height:36px;border-radius:50%;border:1px solid var(--br);background:var(--s2);display:flex;align-items:center;justify-content:center}
.tl-dot.on[b-2zhoksznbz] {border-color:var(--g);background:var(--g1)}
.tl-dot span[b-2zhoksznbz] {font-family:var(--mono);font-size:9px;font-weight:700;color:var(--mt)}
.tl-dot.on span[b-2zhoksznbz] {color:var(--g)}
.tl-title[b-2zhoksznbz] {font-family:var(--inter);font-size:15px;font-weight:700;color:var(--tx);margin-bottom:4px}
.tl-desc[b-2zhoksznbz] {font-family:var(--grotesk);font-size:14px;color:#A1A1AA;line-height:1.6}
.m-nav[b-2zhoksznbz] {display:flex;justify-content:space-between;align-items:center;padding:24px 64px 32px;border-top:1px solid var(--br);max-width:760px}
.mnav-btn[b-2zhoksznbz] {cursor:pointer;transition:opacity .15s}
.mnav-btn:hover[b-2zhoksznbz] {opacity:.7}
.mnav-dir[b-2zhoksznbz] {font-family:var(--mono);font-size:9px;color:var(--dm);text-transform:uppercase;letter-spacing:.6px;margin-bottom:4px}
.mnav-title[b-2zhoksznbz] {font-family:var(--grotesk);font-size:13px;font-weight:500;color:var(--tx);display:flex;align-items:center;gap:6px}
.mnav-arrow[b-2zhoksznbz] {color:var(--g)}
.mnav-btn.right[b-2zhoksznbz] {text-align:right}

/* Chapter byline (published-by + last-updated, above the content) */
.m-byline[b-2zhoksznbz] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 32px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
    font-family: var(--mono);
    font-size: 10px;
    color: var(--dim);
    text-transform: uppercase;
    letter-spacing: .6px;
}

.m-byline strong[b-2zhoksznbz] { color: var(--muted); }
/* _content/TheWick.MarketingWaitList/Components/Pages/Dashboard.razor.rz.scp.css */
.dash-loading[b-lwt4mf665d], .dash-error[b-lwt4mf665d] {
    max-width: 680px;
    margin: 0 auto;
    padding: 80px 24px;
    text-align: center;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 14px;
}

.dash-error h2[b-lwt4mf665d] {
    font-size: 24px;
    font-weight: 900;
    color: var(--text);
    font-family: 'Inter', sans-serif;
    margin-bottom: 12px;
}

.dash-error a[b-lwt4mf665d] { color: var(--green); text-decoration: none; }
.dash-error a:hover[b-lwt4mf665d] { text-decoration: underline; }

.confirm-wrap[b-lwt4mf665d] {
    max-width: 680px;
    margin: 0 auto;
    padding: 48px 24px 60px;
    -webkit-user-select: none;
    user-select: none;
}

.confirm-eyebrow[b-lwt4mf665d] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
    font-family: var(--mono);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.confirm-eyebrow[b-lwt4mf665d]::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.confirm-title[b-lwt4mf665d] {
    font-size: clamp(36px, 6vw, 64px);
    font-weight: 900;
    letter-spacing: -0.0625em;
    font-family: 'Inter', sans-serif;
    line-height: .9;
    margin-bottom: 10px;
}

.confirm-title em[b-lwt4mf665d] { font-style: normal; color: var(--green); }

.confirm-sub[b-lwt4mf665d] {
    font-size: 15px;
    color: var(--muted);
    font-family: var(--mono);
    line-height: 1.6;
    margin-bottom: 40px;
}

/* Stats Grid */
.confirm-stats[b-lwt4mf665d] {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 16px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--border);
    padding-bottom: 28px;
}

.cstat__label[b-lwt4mf665d] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--dim);
    font-family: var(--mono);
    margin-bottom: 4px;
}

.cstat__val[b-lwt4mf665d] {
    font-size: clamp(36px, 5vw, 52px);
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    letter-spacing: -0.05em;
    line-height: 1;
    color: #fff;
    animation: countUp .6s ease both;
}

.cstat__val--green[b-lwt4mf665d] {
    color: var(--green);
    text-shadow: 0 0 24px rgba(0, 255, 136, .25);
}

.cstat__sub[b-lwt4mf665d] {
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
    margin-top: 4px;
}

/* Referral Box */
.ref-box[b-lwt4mf665d] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
}

.ref-box__label[b-lwt4mf665d] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muted);
    font-family: var(--mono);
    margin-bottom: 12px;
}

.ref-link-row[b-lwt4mf665d] { display: flex; gap: 8px; align-items: center; }

.ref-link[b-lwt4mf665d] {
    flex: 1;
    background: rgba(0, 0, 0, .4);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 11px 14px;
    font-size: 12px;
    font-family: var(--mono);
    color: var(--green);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: text;
    -webkit-user-select: all;
    user-select: all;
}

.ref-link[b-lwt4mf665d]::selection {
    background: rgba(0, 255, 136, .2);
    color: var(--green);
}

.ref-copy[b-lwt4mf665d] {
    padding: 11px 18px;
    background: transparent;
    border: 1px solid var(--green);
    border-radius: 8px;
    color: var(--green);
    font-size: 11px;
    font-weight: 700;
    font-family: var(--mono);
    cursor: pointer;
    transition: all .2s;
    white-space: nowrap;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.ref-copy:hover[b-lwt4mf665d] { background: var(--green); color: #000; }
.ref-copy.copied[b-lwt4mf665d] { background: var(--green); color: #000; }
.ref-copy:disabled[b-lwt4mf665d] { opacity: .6; cursor: not-allowed; }

.ref-box__note[b-lwt4mf665d] {
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
    margin-top: 10px;
    line-height: 1.6;
}

.ref-box__note strong[b-lwt4mf665d] { color: var(--muted); }

/* Share icon squares (inside ref box) */
.share-icons[b-lwt4mf665d] {
    display: flex;
    gap: 8px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.share-ico[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: rgba(0, 0, 0, .3);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--muted);
    text-decoration: none;
    transition: border-color .15s, color .15s, transform .15s;
}

.share-ico:hover[b-lwt4mf665d] {
    border-color: var(--muted);
    color: var(--text);
    transform: translateY(-1px);
}

/* Nudge / Boost Code */
.nudge[b-lwt4mf665d] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 18px 20px;
    font-family: var(--mono);
    margin-bottom: 24px;
}

.nudge__icon[b-lwt4mf665d] { font-size: 18px; margin-bottom: 8px; }
.nudge__title[b-lwt4mf665d] { font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.nudge__title--purple[b-lwt4mf665d] { color: var(--purple); }
.nudge__body[b-lwt4mf665d] { font-size: 12px; color: var(--muted); line-height: 1.6; margin-bottom: 12px; }

.quant-code-row[b-lwt4mf665d] { display: flex; gap: 8px; align-items: center; }

.quant-input[b-lwt4mf665d] { background: rgba(0, 0, 0, .4) !important; }

.quant-applied[b-lwt4mf665d] {
    font-size: 11px;
    color: var(--green);
    font-family: var(--mono);
    margin-top: 8px;
}

.quant-msg[b-lwt4mf665d] {
    font-size: 12px;
    font-family: var(--mono);
    margin-top: 8px;
    min-height: 16px;
}

.quant-msg--ok[b-lwt4mf665d] { color: var(--green); }
.quant-msg--err[b-lwt4mf665d] { color: var(--red); }

.wl-input[b-lwt4mf665d] {
    flex: 1;
    background: rgba(0, 0, 0, .5);
    border: 1px solid #3f3f46;
    border-radius: 8px;
    padding: 11px 14px;
    font-size: 12px;
    color: var(--text);
    font-family: var(--mono);
    outline: none;
    transition: all .2s;
    min-width: 0;
    width: 100%;
    -webkit-user-select: text;
    user-select: text;
}

.wl-input[b-lwt4mf665d]::placeholder { color: var(--muted); }
.wl-input:focus[b-lwt4mf665d] { border-color: rgba(0, 255, 136, .4); box-shadow: 0 0 0 3px rgba(0, 255, 136, .06); }

/* How do referrals work? (expandable) */
.refhow[b-lwt4mf665d] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    margin-bottom: 24px;
    overflow: hidden;
}

.refhow__head[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px;
    cursor: pointer;
}

.refhow__title[b-lwt4mf665d] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -.3px;
    color: #fff;
}

.refhow__chev[b-lwt4mf665d] { font-size: 10px; color: var(--green); }

.refhow__body[b-lwt4mf665d] { padding: 0 20px 20px; }

.refhow__intro[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    line-height: 1.7;
    margin-bottom: 16px;
}

.refhow__ways[b-lwt4mf665d] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 20px;
}

.refhow__way[b-lwt4mf665d] {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.refhow__way-badge[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: 6px;
    padding: 8px 0;
    width: 140px;
    text-align: center;
    box-sizing: border-box;
    white-space: nowrap;
    flex-shrink: 0;
}

.refhow__way-badge--green[b-lwt4mf665d] {
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, .35);
    background: rgba(0, 255, 136, .05);
}

.refhow__way-badge--purple[b-lwt4mf665d] {
    color: var(--purple);
    border: 1px solid rgba(168, 85, 247, .4);
    background: rgba(168, 85, 247, .06);
}

.refhow__way-desc[b-lwt4mf665d] {
    flex: 1;
    min-width: 200px;
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    line-height: 1.7;
}

.refhow__way-desc strong[b-lwt4mf665d] { color: var(--text); }

/* Milestones */
.milestones[b-lwt4mf665d] {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 14px;
}

.milestones__head[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 16px;
    background: rgba(0, 255, 136, .04);
    border-bottom: 1px solid var(--border);
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.milestones__head-title[b-lwt4mf665d] { color: var(--green); }
.milestones__head-note[b-lwt4mf665d] { color: var(--dim); }

.milestone-row[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.milestone-row:last-child[b-lwt4mf665d] { border-bottom: none; }

.milestone-row__count[b-lwt4mf665d] { width: 110px; flex-shrink: 0; }

.milestone-row__n[b-lwt4mf665d] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 18px;
    color: #fff;
}

.milestone-row__unit[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--dim);
}

.milestone-row__track[b-lwt4mf665d] {
    flex: 1;
    height: 5px;
    background: rgba(255, 255, 255, .08);
    border-radius: 3px;
    overflow: hidden;
}

.milestone-row__fill[b-lwt4mf665d] {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, rgba(0, 255, 136, .5), var(--green));
    border-radius: 3px;
}

.milestone-row__bonus[b-lwt4mf665d] {
    width: 74px;
    flex-shrink: 0;
    text-align: right;
    line-height: 1.2;
}

.milestone-row__spots[b-lwt4mf665d] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 16px;
    color: var(--green);
}

.refhow__foot[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--dim);
    line-height: 1.7;
}

.refhow__foot-hl[b-lwt4mf665d] { color: var(--muted); }

/* While you wait */
.wait-card[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 18px 20px;
    text-decoration: none;
    margin-bottom: 32px;
    transition: border-color .15s;
}

.wait-card:hover[b-lwt4mf665d] { border-color: rgba(0, 255, 136, .4); }

.wait-card__label[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--dim);
    margin-bottom: 6px;
}

.wait-card__title[b-lwt4mf665d] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -.3px;
    color: #fff;
}

.wait-card__cta[b-lwt4mf665d] {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 800;
    font-size: 13px;
    color: var(--green);
    white-space: nowrap;
}

/* Footer row */
.confirm-foot[b-lwt4mf665d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.confirm-foot__back[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    text-decoration: none;
    transition: color .15s;
}

.confirm-foot__back:hover[b-lwt4mf665d] { color: var(--green); }

.confirm-foot__bookmark[b-lwt4mf665d] {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--dim);
}

@media (max-width: 700px) {
    .confirm-stats[b-lwt4mf665d] { grid-template-columns: 1fr 1fr; }
    .quant-code-row[b-lwt4mf665d] { flex-direction: column; align-items: stretch; }
    .milestone-row[b-lwt4mf665d] { gap: 10px; }
    .milestone-row__count[b-lwt4mf665d] { width: 84px; }
    .wait-card[b-lwt4mf665d] { flex-direction: column; align-items: flex-start; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/Glossary.razor.rz.scp.css */
/* Glossary Container */
.glossary-container[b-fb7i1rsape] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 40px 24px 80px;
}

/* Header */
.glossary-header[b-fb7i1rsape] {
    text-align: center;
    margin-bottom: 32px;
}

.glossary-header h1[b-fb7i1rsape] {
    font-size: 36px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 8px 0;
}

.glossary-header p[b-fb7i1rsape] {
    font-size: 16px;
    color: var(--muted);
    margin: 0 0 24px 0;
}

/* Search */
.glossary-search[b-fb7i1rsape] {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}

.glossary-search svg[b-fb7i1rsape] {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted);
}

.glossary-search input[b-fb7i1rsape] {
    width: 100%;
    padding: 14px 44px;
    background-color: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    font-size: 16px;
    font-family: inherit;
}

.glossary-search input[b-fb7i1rsape]::placeholder {
    color: var(--muted);
}

.glossary-search input:focus[b-fb7i1rsape] {
    outline: none;
    border-color: var(--green);
}

.clear-search[b-fb7i1rsape] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--muted);
    cursor: pointer;
    padding: 4px;
}

.clear-search:hover[b-fb7i1rsape] {
    color: var(--text);
}

/* Alphabet Navigation */
.alphabet-nav[b-fb7i1rsape] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    padding: 20px 0;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 64px;
    background-color: var(--bg);
    z-index: 10;
}

.alphabet-nav a[b-fb7i1rsape] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 14px;
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
    border-radius: 6px;
    transition: color 0.2s, background-color 0.2s;
}

.alphabet-nav a:hover:not(.disabled)[b-fb7i1rsape] {
    color: var(--text);
    background-color: rgba(255, 255, 255, 0.05);
}

.alphabet-nav a.disabled[b-fb7i1rsape] {
    color: var(--border);
    cursor: default;
}

/* No Results */
.no-results[b-fb7i1rsape] {
    text-align: center;
    padding: 60px 20px;
}

.no-results svg[b-fb7i1rsape] {
    color: var(--border);
    margin-bottom: 16px;
}

.no-results p[b-fb7i1rsape] {
    color: var(--muted);
    margin-bottom: 16px;
}

.no-results button[b-fb7i1rsape] {
    padding: 8px 16px;
    background-color: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-size: 14px;
    cursor: pointer;
    transition: border-color 0.2s;
}

.no-results button:hover[b-fb7i1rsape] {
    border-color: var(--green);
}

/* Glossary Section */
.glossary-section[b-fb7i1rsape] {
    margin-bottom: 48px;
}

.section-letter[b-fb7i1rsape] {
    font-size: 32px;
    font-weight: 700;
    color: var(--green);
    margin: 0 0 20px 0;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--green);
}

/* Terms List */
.terms-list[b-fb7i1rsape] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Term Card */
.term-card[b-fb7i1rsape] {
    padding: 24px;
    background-color: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 8px;
    transition: border-color 0.2s;
}

.term-card:hover[b-fb7i1rsape] {
    border-color: rgba(0, 255, 135, 0.3);
}

.term-name[b-fb7i1rsape] {
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
    margin: 0 0 8px 0;
}

.term-category[b-fb7i1rsape] {
    display: inline-block;
    padding: 4px 10px;
    background-color: rgba(0, 255, 135, 0.1);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    color: var(--green);
    margin-bottom: 12px;
}

.term-definition[b-fb7i1rsape] {
    font-size: 15px;
    line-height: 1.7;
    color: var(--muted);
    margin: 0 0 16px 0;
}

.term-example[b-fb7i1rsape],
.term-formula[b-fb7i1rsape] {
    padding: 12px 16px;
    background-color: rgba(255, 255, 255, 0.02);
    border-radius: 6px;
    margin-bottom: 12px;
    font-size: 14px;
    color: var(--muted);
}

.term-example strong[b-fb7i1rsape],
.term-formula strong[b-fb7i1rsape] {
    color: var(--text);
    margin-right: 8px;
}

.term-formula code[b-fb7i1rsape] {
    font-family: 'Monaco', 'Menlo', monospace;
    background-color: rgba(0, 255, 135, 0.1);
    padding: 2px 6px;
    border-radius: 4px;
    color: var(--green);
}

.related-terms[b-fb7i1rsape] {
    font-size: 13px;
    color: var(--muted);
}

.related-terms strong[b-fb7i1rsape] {
    color: var(--text);
    margin-right: 8px;
}

.related-terms a[b-fb7i1rsape] {
    color: var(--green);
    text-decoration: none;
    margin-right: 8px;
}

.related-terms a:hover[b-fb7i1rsape] {
    text-decoration: underline;
}

.related-terms a[b-fb7i1rsape]::after {
    content: ",";
    color: var(--muted);
}

.related-terms a:last-child[b-fb7i1rsape]::after {
    content: "";
}

/* Back to Top */
.back-to-top[b-fb7i1rsape] {
    position: fixed;
    bottom: 24px;
    right: 24px;
}

.back-to-top a[b-fb7i1rsape] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background-color: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--muted);
    font-size: 13px;
    text-decoration: none;
    transition: border-color 0.2s, color 0.2s;
}

.back-to-top a:hover[b-fb7i1rsape] {
    border-color: var(--green);
    color: var(--text);
}

/* Responsive */
@media (max-width: 768px) {
    .glossary-container[b-fb7i1rsape] {
        padding: 24px 16px 80px;
    }

    .glossary-header h1[b-fb7i1rsape] {
        font-size: 28px;
    }

    .alphabet-nav[b-fb7i1rsape] {
        gap: 2px;
    }

    .alphabet-nav a[b-fb7i1rsape] {
        width: 28px;
        height: 28px;
        font-size: 12px;
    }

    .term-card[b-fb7i1rsape] {
        padding: 16px;
    }

    .term-name[b-fb7i1rsape] {
        font-size: 16px;
    }

    .back-to-top[b-fb7i1rsape] {
        bottom: 16px;
        right: 16px;
    }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/HowItWorks.razor.rz.scp.css */
/* ══ How It Works (marketing-v3) ══ */

.hl-green[b-i86ptsk2ex] { color: var(--green); }

/* ── Hero ── */
.hiw-hero[b-i86ptsk2ex] {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 88px 24px 80px;
}

.hiw-hero__glow[b-i86ptsk2ex] {
    position: absolute;
    left: 50%;
    top: -160px;
    transform: translateX(-50%);
    width: 900px;
    height: 640px;
    background: radial-gradient(ellipse 55% 55% at 50% 40%, rgba(0, 255, 136, .10) 0%, transparent 62%);
    pointer-events: none;
}

.hiw-hero__content[b-i86ptsk2ex] { position: relative; }

.hiw-hero__eyebrow[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.hiw-hero__dot[b-i86ptsk2ex] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
}

.hiw-hero__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    letter-spacing: -3.5px;
    line-height: .94;
    color: #fff;
    font-size: clamp(56px, 8vw, 104px);
    margin: 26px 0 0;
}

.hiw-hero__title em[b-i86ptsk2ex] {
    font-style: normal;
    color: var(--green);
}

.hiw-hero__sub[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 15px;
    color: var(--muted);
    margin: 26px 0 0;
    line-height: 1.6;
}

.hiw-hero__ctas[b-i86ptsk2ex] {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 36px;
    flex-wrap: wrap;
}

.hiw-btn[b-i86ptsk2ex] {
    border-radius: 8px;
    padding: 14px 26px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    cursor: pointer;
    transition: all .2s;
}

.hiw-btn--primary[b-i86ptsk2ex] {
    background: var(--green);
    color: #000;
    border: none;
    font-weight: 800;
    box-shadow: 0 0 32px rgba(0, 255, 136, .25);
}

.hiw-btn--primary:hover[b-i86ptsk2ex] { box-shadow: 0 0 20px rgba(0, 255, 136, .4); transform: translateY(-1px); }

.hiw-btn--ghost[b-i86ptsk2ex] {
    background: transparent;
    color: var(--text);
    border: 1px solid #3f3f46;
    font-weight: 700;
}

.hiw-btn--ghost:hover[b-i86ptsk2ex] { border-color: var(--muted); }

/* ── Steps ── */
.step[b-i86ptsk2ex] { border-top: 1px solid var(--border); }

.step--surface[b-i86ptsk2ex] { background: var(--surface); }

.step__inner[b-i86ptsk2ex] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 96px 24px;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 56px;
    align-items: center;
}

.step__inner--flip[b-i86ptsk2ex] { grid-template-columns: 1.1fr 1fr; }

.step__num[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--green);
}

.step__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    letter-spacing: -2px;
    line-height: 1.0;
    color: #fff;
    font-size: clamp(34px, 4.2vw, 54px);
    margin: 16px 0 0;
}

.step__title em[b-i86ptsk2ex] { font-style: normal; color: var(--green); }

.step__sub[b-i86ptsk2ex] {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 16px;
    color: var(--muted);
    max-width: 460px;
    margin: 20px 0 0;
    line-height: 1.6;
}

.step__points[b-i86ptsk2ex] {
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 11px;
    max-width: 460px;
    font-family: var(--mono);
    font-size: 13px;
    color: var(--muted);
    line-height: 1.65;
}

.step__point[b-i86ptsk2ex] { display: flex; gap: 11px; }

.step__caret[b-i86ptsk2ex] { color: var(--green); flex-shrink: 0; }

.step__point--hl[b-i86ptsk2ex] { color: var(--green); font-weight: 700; }

/* ── Tooltips (tested / in the lab) ── */
.tip-wrap[b-i86ptsk2ex] {
    position: relative;
    cursor: help;
    font-weight: 600;
}

.tip-wrap--green[b-i86ptsk2ex] {
    color: var(--green);
    border-bottom: 1px dotted rgba(0, 255, 136, .5);
}

.tip-wrap--purple[b-i86ptsk2ex] {
    color: var(--purple);
    border-bottom: 1px dotted rgba(168, 85, 247, .55);
}

.tip-wrap .tip[b-i86ptsk2ex] {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    width: 240px;
    background: #131313;
    border: 1px solid #3f3f46;
    border-radius: 8px;
    padding: 10px 12px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .3px;
    text-transform: none;
    line-height: 1.65;
    color: var(--muted);
    font-weight: 400;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity .15s, transform .15s;
    pointer-events: none;
    z-index: 10;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .6);
    white-space: normal;
}

.tip-wrap:hover .tip[b-i86ptsk2ex] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.tip__hl--green[b-i86ptsk2ex] { color: var(--green); }
.tip__hl--purple[b-i86ptsk2ex] { color: var(--purple); }

/* ── Step 01: leaderboard mock card ── */
.lb-card[b-i86ptsk2ex] {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #0a0a0a;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
    overflow: hidden;
}

.lb-card__head[b-i86ptsk2ex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.lb-card__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -.3px;
    color: #fff;
}

.lb-card__live[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    color: var(--green);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.lb-card__live-dot[b-i86ptsk2ex] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.lb-card__cols[b-i86ptsk2ex] {
    display: grid;
    grid-template-columns: 1.5fr 1fr .8fr .8fr .7fr;
    gap: 10px;
    padding: 10px 18px;
    border-bottom: 1px solid var(--border);
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--dim);
}

.lb-card__row[b-i86ptsk2ex] {
    display: grid;
    grid-template-columns: 1.5fr 1fr .8fr .8fr .7fr;
    gap: 10px;
    align-items: center;
    padding: 13px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .04);
    transition: background .15s;
}

.lb-card__row:last-child[b-i86ptsk2ex] { border-bottom: none; }

.lb-card__row:hover[b-i86ptsk2ex] { background: rgba(255, 255, 255, .02); }

.lb-card__name[b-i86ptsk2ex] {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
}

.lb-badge[b-i86ptsk2ex] {
    justify-self: start;
    font-family: var(--mono);
    font-size: 8px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    padding: 3px 7px;
    border-radius: 4px;
    white-space: nowrap;
}

.lb-badge--green[b-i86ptsk2ex] {
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, .3);
    background: rgba(0, 255, 136, .05);
}

.lb-badge--purple[b-i86ptsk2ex] {
    color: var(--purple);
    border: 1px solid rgba(168, 85, 247, .35);
    background: rgba(168, 85, 247, .06);
}

.lb-card__ret[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 12px;
    color: var(--green);
}

.lb-card__dd[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 12px;
    color: var(--muted);
}

.lb-card__price[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--text);
}

/* ── Step 02: account card ── */
.acct-card[b-i86ptsk2ex] {
    max-width: 440px;
    margin: 0 auto;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #0a0a0a;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
}

.acct-card__head[b-i86ptsk2ex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.acct-card__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -.3px;
    color: #fff;
}

.acct-card__time[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    color: var(--dim);
}

.acct-card__steps[b-i86ptsk2ex] { padding: 8px 18px 0; }

.acct-step[b-i86ptsk2ex] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.acct-step--last[b-i86ptsk2ex] { border-bottom: none; }

.acct-step__check[b-i86ptsk2ex] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    flex-shrink: 0;
    font-family: var(--mono);
}

.acct-step__check--done[b-i86ptsk2ex] {
    background: rgba(0, 255, 136, .12);
    border: 1px solid rgba(0, 255, 136, .4);
    color: var(--green);
}

.acct-step__check--now[b-i86ptsk2ex] {
    border: 1px solid var(--green);
    color: var(--green);
    font-size: 9px;
    box-shadow: 0 0 12px rgba(0, 255, 136, .3);
}

.acct-step__label[b-i86ptsk2ex] {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
}

.acct-step__status[b-i86ptsk2ex] {
    margin-left: auto;
    font-family: var(--mono);
    font-size: 9px;
    color: var(--muted);
}

.acct-step__status--done[b-i86ptsk2ex] { color: var(--green); }

.acct-why[b-i86ptsk2ex] {
    margin: 12px 18px 18px;
    border: 1px solid rgba(0, 255, 136, .25);
    background: rgba(0, 255, 136, .04);
    border-radius: 8px;
    padding: 14px 16px;
}

.acct-why__label[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    color: var(--green);
    margin-bottom: 10px;
}

.acct-why__items[b-i86ptsk2ex] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-family: var(--mono);
    font-size: 11px;
    color: var(--muted);
    line-height: 1.5;
}

/* ── Step 03: running algo card ── */
.run-card-col[b-i86ptsk2ex] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.run-card[b-i86ptsk2ex] {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #0a0a0a;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
    font-family: var(--mono);
}

.run-card__head[b-i86ptsk2ex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.run-card__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -.3px;
    color: #fff;
}

.run-card__running[b-i86ptsk2ex] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 10px;
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, .3);
    background: rgba(0, 255, 136, .06);
    border-radius: 999px;
    padding: 4px 11px;
}

.run-card__running-dot[b-i86ptsk2ex] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.run-card__pnl[b-i86ptsk2ex] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 22px 18px 0;
}

.run-card__pnl-val[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 36px;
    letter-spacing: -1px;
    color: var(--green);
    text-shadow: 0 0 24px rgba(0, 255, 136, .35);
}

.run-card__pnl-pct[b-i86ptsk2ex] { font-size: 12px; color: var(--green); }

.run-card__chart[b-i86ptsk2ex] {
    height: 140px;
    margin: 14px 0 0;
    position: relative;
}

.run-card__chart canvas[b-i86ptsk2ex] { display: block; width: 100%; height: 100%; }

.run-card__tiles[b-i86ptsk2ex] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    padding: 14px 18px 0;
}

.run-tile[b-i86ptsk2ex] {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    padding: 10px 11px;
}

.run-tile__label[b-i86ptsk2ex] {
    font-size: 8px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--dim);
}

.run-tile__val[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 15px;
    color: #fff;
    margin-top: 5px;
    white-space: nowrap;
}

.run-card__feed[b-i86ptsk2ex] {
    height: 172px;
    margin: 14px 18px 0;
    border: 1px solid var(--border);
    border-radius: 10px 10px 0 0;
    border-bottom: none;
    background: var(--surface);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.run-card__feed-head[b-i86ptsk2ex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 13px;
    border-bottom: 1px solid var(--border);
}

.run-card__feed-title[b-i86ptsk2ex] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 9px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    color: var(--green);
}

.run-card__feed-dot[b-i86ptsk2ex] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.run-card__feed-live[b-i86ptsk2ex] { font-size: 9px; color: var(--dim); }

.run-card__feed-body[b-i86ptsk2ex] { flex: 1; overflow: hidden; padding: 4px 0; }

.run-card__controls[b-i86ptsk2ex] {
    padding: 12px 18px 16px;
    background: #0a0a0a;
    border-top: 1px solid var(--border);
    display: flex;
    gap: 10px;
}

.run-card__pause[b-i86ptsk2ex] {
    flex: 1;
    border: 1px solid #3f3f46;
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    font-size: 11px;
    color: var(--muted);
    font-weight: 700;
    letter-spacing: .5px;
}

.run-card__kill[b-i86ptsk2ex] {
    flex: 1;
    border: 1px solid rgba(255, 59, 59, .5);
    background: rgba(255, 59, 59, .08);
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    font-size: 11px;
    color: var(--red);
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* ── Final CTA (same treatment as home) ── */
.cta-sec[b-i86ptsk2ex] { padding: 0 24px 96px; }

.cta-card[b-i86ptsk2ex] {
    max-width: 1240px;
    margin: 0 auto;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    padding: 56px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
}

.cta-card__glow[b-i86ptsk2ex] {
    position: absolute;
    left: -120px;
    top: -160px;
    width: 520px;
    height: 420px;
    background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(0, 255, 136, .08) 0%, transparent 65%);
    pointer-events: none;
}

.cta-card__copy[b-i86ptsk2ex] { position: relative; }

.cta-card__title[b-i86ptsk2ex] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: clamp(28px, 3.4vw, 44px);
    letter-spacing: -1.5px;
    color: #fff;
    line-height: 1.05;
}

.cta-card__title em[b-i86ptsk2ex] { font-style: normal; color: var(--green); }

.cta-card__sub[b-i86ptsk2ex] {
    font-family: var(--mono);
    font-size: 13px;
    color: var(--muted);
    margin-top: 12px;
    line-height: 1.6;
}

.cta-card__btn[b-i86ptsk2ex] {
    position: relative;
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    padding: 15px 30px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 800;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
    transition: box-shadow .2s, transform .2s;
}

.cta-card__btn:hover[b-i86ptsk2ex] { box-shadow: 0 0 20px rgba(0, 255, 136, .3); transform: translateY(-1px); }

/* ── Responsive ── */
@media (max-width: 980px) {
    .step__inner[b-i86ptsk2ex],
    .step__inner--flip[b-i86ptsk2ex] {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    /* keep copy above visual when the flipped grid stacks */
    .step__inner--flip .step__visual[b-i86ptsk2ex] { order: 2; }
    .step__inner--flip .step__copy[b-i86ptsk2ex] { order: 1; }
}

@media (max-width: 700px) {
    .hiw-hero[b-i86ptsk2ex] { padding: 64px 16px 56px; }
    .step__inner[b-i86ptsk2ex] { padding: 64px 16px; }

    /* Tooltips: on narrow screens the 240px popover anchored to the inline word
       overflows the viewport and gets cut off. Re-anchor it to the whole bullet
       row (nearest positioned ancestor) so it spans the row's width instead. */
    .step__point[b-i86ptsk2ex] { position: relative; }
    .tip-wrap[b-i86ptsk2ex] { position: static; }
    .tip-wrap .tip[b-i86ptsk2ex] { left: 0; right: 0; width: auto; }
    .cta-sec[b-i86ptsk2ex] { padding: 0 16px 72px; }
    .cta-card[b-i86ptsk2ex] { padding: 40px 24px; }
    .lb-card__cols[b-i86ptsk2ex], .lb-card__row[b-i86ptsk2ex] { grid-template-columns: 1.4fr 1fr .8fr .7fr; }
    .lb-card__cols span:nth-child(4)[b-i86ptsk2ex], .lb-card__row .lb-card__dd[b-i86ptsk2ex] { display: none; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/Landing.razor.rz.scp.css */
/* ══ Marketing-v3 home ══ */

/* ── Hero ── */
.hero-wrap[b-vacmaltszl] {
    position: relative;
    overflow: hidden;
}

.hero-glow[b-vacmaltszl] {
    position: absolute;
    right: 0;
    top: -60px;
    width: 820px;
    height: 700px;
    background: radial-gradient(ellipse 55% 55% at 62% 45%, rgba(0, 255, 136, .09) 0%, transparent 62%);
    pointer-events: none;
}

.hero-grid[b-vacmaltszl] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 64px 24px 56px;
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.hero-h1[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    letter-spacing: -3px;
    line-height: .92;
    color: #fff;
    font-size: clamp(52px, 6.4vw, 96px);
    margin: 0;
}

.hero-h1__kicker[b-vacmaltszl] {
    display: block;
    font-size: .42em;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.05;
    color: var(--text);
    margin-bottom: .18em;
    white-space: nowrap;
}

.hero-h1 em[b-vacmaltszl] {
    font-style: normal;
    color: var(--green);
}

.hero-sub[b-vacmaltszl] {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 17px;
    color: var(--muted);
    max-width: 470px;
    margin: 24px 0 0;
    line-height: 1.55;
}

/* ── Phone mockup ── */
.hero-phone-col[b-vacmaltszl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

@keyframes phoneFloat-b-vacmaltszl {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.phone-float[b-vacmaltszl] {
    animation: phoneFloat-b-vacmaltszl 7s ease-in-out infinite;
}

.phone-shell[b-vacmaltszl] {
    width: 300px;
    height: 640px;
    position: relative;
    border-radius: 48px;
    background: linear-gradient(160deg, #43464c 0%, #17181a 38%, #101113 62%, #33363b 100%);
    padding: 10px;
    box-shadow: 0 40px 100px rgba(0, 0, 0, .7), 0 0 90px rgba(0, 255, 136, .10);
}

.phone-screen[b-vacmaltszl] {
    height: 100%;
    border-radius: 40px;
    background: #0a0a0a;
    box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .06);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding-top: 40px;
    font-family: var(--mono);
    position: relative;
}

/* notch */
.phone-screen[b-vacmaltszl]::before {
    content: '';
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: 84px;
    height: 22px;
    border-radius: 12px;
    background: #000;
}

.ph-appbar[b-vacmaltszl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 10px;
}

.ph-logo[b-vacmaltszl] { height: 15px; display: block; width: auto; }

.ph-running[b-vacmaltszl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, .3);
    background: rgba(0, 255, 136, .06);
    border-radius: 999px;
    padding: 3px 9px;
}

.ph-running__dot[b-vacmaltszl] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.ph-algo-name[b-vacmaltszl] {
    padding: 4px 16px 0;
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 18px;
    letter-spacing: -.5px;
    color: #fff;
}

.ph-pnl[b-vacmaltszl] {
    display: flex;
    align-items: baseline;
    gap: 9px;
    padding: 12px 16px 0;
}

.ph-pnl__val[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 31px;
    letter-spacing: -1px;
    color: var(--green);
    text-shadow: 0 0 24px rgba(0, 255, 136, .35);
}

.ph-pnl__pct[b-vacmaltszl] { font-size: 11px; color: var(--green); }

.ph-chart[b-vacmaltszl] {
    height: 116px;
    margin: 10px 0 0;
    position: relative;
}

.ph-chart canvas[b-vacmaltszl] { display: block; width: 100%; height: 100%; }

.ph-tiles[b-vacmaltszl] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 7px;
    padding: 10px 16px 0;
}

.ph-tile[b-vacmaltszl] {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    padding: 8px 9px;
}

.ph-tile__label[b-vacmaltszl] {
    font-size: 7px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--dim);
}

.ph-tile__val[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 12px;
    color: #fff;
    margin-top: 4px;
    white-space: nowrap;
}

.ph-feed[b-vacmaltszl] {
    flex: 1;
    min-height: 0;
    margin: 10px 14px 0;
    border: 1px solid var(--border);
    border-radius: 10px 10px 0 0;
    border-bottom: none;
    background: var(--surface);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.ph-feed__head[b-vacmaltszl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 11px;
    border-bottom: 1px solid var(--border);
}

.ph-feed__title[b-vacmaltszl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 8px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    color: var(--green);
}

.ph-feed__dot[b-vacmaltszl] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.ph-feed__live[b-vacmaltszl] { font-size: 8px; color: var(--dim); }

.ph-feed__body[b-vacmaltszl] { flex: 1; overflow: hidden; padding: 3px 0; }

.ph-controls[b-vacmaltszl] {
    padding: 10px 14px 22px;
    background: #0a0a0a;
    border-top: 1px solid var(--border);
    display: flex;
    gap: 9px;
}

.ph-pause[b-vacmaltszl] {
    flex: 1;
    border: 1px solid #3f3f46;
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    font-size: 10px;
    color: var(--muted);
    font-weight: 700;
    letter-spacing: .5px;
}

.ph-kill[b-vacmaltszl] {
    flex: 1;
    border: 1px solid rgba(255, 59, 59, .5);
    background: rgba(255, 59, 59, .08);
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    font-size: 10px;
    color: var(--red);
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* ── Sections ── */
.sec[b-vacmaltszl] {
    border-top: 1px solid var(--border);
}

.sec--surface[b-vacmaltszl] { background: var(--surface); }

.sec__inner[b-vacmaltszl] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 104px 24px 96px;
}

.sec__eyebrow[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--green);
    display: flex;
    align-items: center;
    gap: 9px;
}

.sec__eyebrow-dot[b-vacmaltszl] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--green);
}

.sec__title[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    letter-spacing: -2.5px;
    line-height: .96;
    color: #fff;
    font-size: clamp(42px, 5.6vw, 76px);
    margin: 20px 0 0;
}

.sec__title em[b-vacmaltszl] {
    font-style: normal;
    color: var(--green);
}

.sec__sub[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 14px;
    color: var(--muted);
    max-width: 600px;
    margin: 22px 0 0;
    line-height: 1.6;
}

.sec__sub--wide[b-vacmaltszl] { max-width: 640px; line-height: 1.7; }

.hl-green[b-vacmaltszl] { color: var(--green); }

/* ── What you get: shelf cards ── */
.shelf-grid[b-vacmaltszl] {
    margin-top: 44px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.shelf-card[b-vacmaltszl] {
    background: var(--surface);
    border-radius: 10px;
    padding: 28px 28px 26px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.shelf-card--tested[b-vacmaltszl] { border: 1px solid rgba(0, 255, 136, .35); }
.shelf-card--lab[b-vacmaltszl] { border: 1px solid rgba(168, 85, 247, .4); }

.shelf-card__eyebrow[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: var(--green);
    display: flex;
    align-items: center;
    gap: 9px;
}

.shelf-card__eyebrow--purple[b-vacmaltszl] { color: var(--purple); }

.shelf-card__dot[b-vacmaltszl] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--green);
    animation: pdot 2s infinite;
}

.shelf-card__dot--purple[b-vacmaltszl] { background: var(--purple); }

.shelf-card__title[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 23px;
    letter-spacing: -.5px;
    color: #fff;
    line-height: 1.2;
}

.shelf-card__body[b-vacmaltszl] {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.6;
}

.shelf-card__tags[b-vacmaltszl] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: auto;
    padding-top: 8px;
}

/* ── Tags (shared) ── */
.tag[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 4px;
    align-self: flex-start;
}

.tag--green[b-vacmaltszl] {
    color: var(--green);
    border: 1px solid rgba(0, 255, 136, .3);
    background: rgba(0, 255, 136, .05);
}

.tag--purple[b-vacmaltszl] {
    color: var(--purple);
    border: 1px solid rgba(168, 85, 247, .35);
    background: rgba(168, 85, 247, .06);
}

/* ── Gauntlet (how it's tested) ── */
.gauntlet[b-vacmaltszl] {
    margin-top: 44px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(0, 0, 0, .35);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    overflow: hidden;
}

.gauntlet__cell[b-vacmaltszl] {
    padding: 30px 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.gauntlet__cell:not(:last-child)[b-vacmaltszl] { border-right: 1px solid var(--border); }

.gauntlet__title[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 19px;
    letter-spacing: -.4px;
    color: #fff;
    line-height: 1.25;
}

.gauntlet__body[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    line-height: 1.7;
}

/* ── Capacity viz ── */
.cap-viz[b-vacmaltszl] {
    margin-top: 48px;
    max-width: 760px;
}

.cap-viz__labels[b-vacmaltszl] {
    display: flex;
    justify-content: space-between;
    font-family: var(--mono);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--dim);
    margin-bottom: 13px;
}

.cap-viz__label--filled[b-vacmaltszl] { color: rgba(0, 255, 136, 0.8); }

.cap-viz__bar[b-vacmaltszl] {
    display: flex;
    align-items: stretch;
    gap: 4px;
    height: 62px;
}

.cap-seg[b-vacmaltszl] {
    flex: 1;
    border-radius: 2px;
}

.cap-seg--filled[b-vacmaltszl] {
    background: rgba(0, 255, 136, 0.2);
    border: 1px solid rgba(0, 255, 136, 0.55);
}

.cap-seg--fade1[b-vacmaltszl] {
    background: rgba(0, 255, 136, 0.13);
    border: 1px solid rgba(0, 255, 136, 0.4);
}

.cap-seg--fade2[b-vacmaltszl] {
    background: rgba(0, 255, 136, 0.09);
    border: 1px solid rgba(0, 255, 136, 0.28);
}

.cap-seg--fade3[b-vacmaltszl] {
    background: rgba(0, 255, 136, 0.06);
    border: 1px solid rgba(0, 255, 136, 0.2);
}

.cap-seg--empty[b-vacmaltszl] {
    background: transparent;
    border: 1px solid var(--border);
}

.cap-viz__line[b-vacmaltszl] {
    width: 2px;
    background: var(--green);
    box-shadow: 0 0 10px rgba(0, 255, 136, .6);
    margin: 0 5px;
    border-radius: 2px;
    flex: none;
}

.cap-viz__foot[b-vacmaltszl] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-family: var(--mono);
    font-size: 11px;
    color: var(--muted);
    margin-top: 13px;
    line-height: 1.5;
}

.cap-viz__foot-hl[b-vacmaltszl] { color: var(--green); white-space: nowrap; }

/* ── FAQ ── */
.faq-col[b-vacmaltszl] { max-width: 860px; margin: 0 auto; }

.faq-list[b-vacmaltszl] {
    border-top: 1px solid var(--border);
    margin-top: 40px;
}

.faq-item[b-vacmaltszl] { border-bottom: 1px solid var(--border); }

.faq-q[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    padding: 16px 2px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    transition: color .15s;
}

.faq-q:hover[b-vacmaltszl] { color: var(--green); }

.faq-item.open .faq-q[b-vacmaltszl] { color: var(--green); }

.faq-chev[b-vacmaltszl] {
    font-size: 10px;
    color: var(--dim);
    transition: transform .2s;
    flex-shrink: 0;
}

.faq-item.open .faq-chev[b-vacmaltszl] { transform: rotate(180deg); color: var(--green); }

.faq-a[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 12px;
    line-height: 1.6;
    color: var(--muted);
    padding: 4px 2px 20px;
    max-width: 620px;
}

/* ── Final CTA ── */
.cta-sec[b-vacmaltszl] { padding: 0 24px 96px; }

.cta-card[b-vacmaltszl] {
    max-width: 1240px;
    margin: 0 auto;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    padding: 56px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
}

.cta-card__glow[b-vacmaltszl] {
    position: absolute;
    left: -120px;
    top: -160px;
    width: 520px;
    height: 420px;
    background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(0, 255, 136, .08) 0%, transparent 65%);
    pointer-events: none;
}

.cta-card__copy[b-vacmaltszl] { position: relative; }

.cta-card__title[b-vacmaltszl] {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: clamp(28px, 3.4vw, 44px);
    letter-spacing: -1.5px;
    color: #fff;
    line-height: 1.05;
}

.cta-card__title em[b-vacmaltszl] { font-style: normal; color: var(--green); }

.cta-card__sub[b-vacmaltszl] {
    font-family: var(--mono);
    font-size: 13px;
    color: var(--muted);
    margin-top: 12px;
    line-height: 1.6;
}

.cta-card__btn[b-vacmaltszl] {
    position: relative;
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    padding: 15px 30px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 800;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
    transition: box-shadow .2s, transform .2s;
}

.cta-card__btn:hover[b-vacmaltszl] { box-shadow: 0 0 20px rgba(0, 255, 136, .3); transform: translateY(-1px); }

/* ── Responsive ── */
@media (max-width: 1020px) {
    .hero-grid[b-vacmaltszl] { grid-template-columns: 1fr; gap: 56px; }
    .hero-h1__kicker[b-vacmaltszl] { white-space: normal; }
}

@media (max-width: 900px) {
    .shelf-grid[b-vacmaltszl] { grid-template-columns: 1fr; }
    .gauntlet[b-vacmaltszl] { grid-template-columns: 1fr; }
    .gauntlet__cell:not(:last-child)[b-vacmaltszl] {
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
}

@media (max-width: 700px) {
    .hero-grid[b-vacmaltszl] { padding: 40px 16px 48px; }
    .sec__inner[b-vacmaltszl] { padding: 72px 16px 64px; }
    .cta-sec[b-vacmaltszl] { padding: 0 16px 72px; }
    .cta-card[b-vacmaltszl] { padding: 40px 24px; }
    .cap-viz__foot[b-vacmaltszl] { flex-direction: column; gap: 6px; }
    .phone-shell[b-vacmaltszl] { width: 272px; height: 580px; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/ResourceDetail.razor.rz.scp.css */
.rd-page[b-bs7zxl0d7d] {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 24px;
}

/* Loading */
.rd-loading[b-bs7zxl0d7d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 80px 24px;
}

.rd-spinner[b-bs7zxl0d7d] {
    width: 36px;
    height: 36px;
    border: 3px solid var(--border);
    border-top-color: var(--green);
    border-radius: 50%;
    animation: spin-b-bs7zxl0d7d .8s linear infinite;
    margin-bottom: 14px;
}

@keyframes spin-b-bs7zxl0d7d { to { transform: rotate(360deg); } }

.rd-loading p[b-bs7zxl0d7d] {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 13px;
}

/* Not Found */
.rd-notfound[b-bs7zxl0d7d] {
    text-align: center;
    padding: 80px 24px;
}

.rd-notfound h2[b-bs7zxl0d7d] {
    font-size: 24px;
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    margin-bottom: 10px;
}

.rd-notfound p[b-bs7zxl0d7d] {
    color: var(--muted);
    font-family: var(--mono);
    font-size: 14px;
    margin-bottom: 24px;
}

.rd-back-btn[b-bs7zxl0d7d] {
    display: inline-block;
    padding: 10px 22px;
    background: var(--green);
    color: #000;
    border-radius: 6px;
    font-weight: 700;
    font-size: 13px;
    text-decoration: none;
    font-family: 'Space Grotesk', sans-serif;
}

/* Header */
.rd-header[b-bs7zxl0d7d] { margin-bottom: 32px; }

.rd-back[b-bs7zxl0d7d] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--dim);
    text-decoration: none;
    font-size: 13px;
    font-family: var(--mono);
    margin-bottom: 24px;
    transition: color .15s;
}

.rd-back:hover[b-bs7zxl0d7d] { color: var(--green); }

.rd-meta[b-bs7zxl0d7d] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.rd-tags-inline[b-bs7zxl0d7d] { display: flex; gap: 8px; }

.rd-tag[b-bs7zxl0d7d] {
    padding: 3px 10px;
    background: rgba(0, 255, 136, .08);
    border: 1px solid var(--green);
    border-radius: 100px;
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-decoration: none;
    text-transform: uppercase;
    font-family: var(--mono);
    letter-spacing: .5px;
    transition: all .15s;
}

.rd-tag:hover[b-bs7zxl0d7d] {
    background: var(--green);
    color: #000;
}

.rd-date[b-bs7zxl0d7d] {
    font-size: 13px;
    color: var(--dim);
    font-family: var(--mono);
}

.rd-title[b-bs7zxl0d7d] {
    font-size: clamp(28px, 5vw, 40px);
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.05em;
    font-family: 'Inter', sans-serif;
    color: #fff;
    margin-bottom: 16px;
}

.rd-info[b-bs7zxl0d7d] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--dim);
    font-family: var(--mono);
}

.rd-author[b-bs7zxl0d7d] { font-weight: 600; color: var(--muted); }
.rd-sep[b-bs7zxl0d7d] { opacity: .4; }

/* Featured Image */
.rd-featured-img[b-bs7zxl0d7d] {
    margin-bottom: 32px;
    border-radius: 8px;
    overflow: hidden;
}

.rd-featured-img img[b-bs7zxl0d7d] {
    width: 100%;
    height: auto;
    display: block;
}

/* Article Content */
.rd-content[b-bs7zxl0d7d] {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text);
    font-family: var(--mono);
}

.rd-content h2[b-bs7zxl0d7d] {
    font-size: 24px;
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    letter-spacing: -1px;
    margin-top: 36px;
    margin-bottom: 14px;
    color: #fff;
}

.rd-content h3[b-bs7zxl0d7d] {
    font-size: 20px;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
    margin-top: 28px;
    margin-bottom: 10px;
    color: var(--text);
}

.rd-content p[b-bs7zxl0d7d] { margin-bottom: 18px; }
.rd-content a[b-bs7zxl0d7d] { color: var(--green); text-decoration: none; }
.rd-content a:hover[b-bs7zxl0d7d] { text-decoration: underline; }

.rd-content ul[b-bs7zxl0d7d], .rd-content ol[b-bs7zxl0d7d] {
    margin-bottom: 18px;
    padding-left: 22px;
}

.rd-content li[b-bs7zxl0d7d] { margin-bottom: 6px; }

.rd-content blockquote[b-bs7zxl0d7d] {
    border-left: 3px solid var(--green);
    padding-left: 18px;
    margin: 24px 0;
    font-style: italic;
    color: var(--muted);
}

.rd-content code[b-bs7zxl0d7d] {
    background: var(--surface2);
    padding: 2px 7px;
    border-radius: 4px;
    font-size: .9em;
}

.rd-content pre[b-bs7zxl0d7d] {
    background: var(--surface2);
    padding: 18px;
    border-radius: 8px;
    overflow-x: auto;
    margin-bottom: 18px;
}

.rd-content pre code[b-bs7zxl0d7d] { background: none; padding: 0; }

/* Footer */
.rd-footer[b-bs7zxl0d7d] {
    margin-top: 40px;
    padding-top: 28px;
    border-top: 1px solid var(--border);
}

.rd-share[b-bs7zxl0d7d] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.rd-share-label[b-bs7zxl0d7d] {
    font-size: 12px;
    color: var(--dim);
    font-family: var(--mono);
}

.rd-share-btn[b-bs7zxl0d7d] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--muted);
    transition: all .15s;
}

.rd-share-btn:hover[b-bs7zxl0d7d] {
    border-color: var(--green);
    color: var(--green);
}

.rd-tags-footer[b-bs7zxl0d7d] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.rd-tags-label[b-bs7zxl0d7d] {
    font-size: 12px;
    color: var(--dim);
    font-family: var(--mono);
}

.rd-tag-link[b-bs7zxl0d7d] {
    padding: 5px 12px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 100px;
    font-size: 12px;
    color: var(--muted);
    text-decoration: none;
    font-family: var(--mono);
    transition: all .15s;
}

.rd-tag-link:hover[b-bs7zxl0d7d] {
    border-color: var(--green);
    color: var(--green);
}

/* CTA */
.rd-cta[b-bs7zxl0d7d] {
    margin-top: 40px;
    padding: 36px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    text-align: center;
}

.rd-cta__title[b-bs7zxl0d7d] {
    font-size: 24px;
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    letter-spacing: -1px;
    color: #fff;
    margin-bottom: 8px;
}

.rd-cta__title em[b-bs7zxl0d7d] { font-style: normal; color: var(--green); }

.rd-cta__sub[b-bs7zxl0d7d] {
    font-size: 14px;
    color: var(--muted);
    font-family: var(--mono);
    margin-bottom: 20px;
}

.rd-cta__btn[b-bs7zxl0d7d] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: var(--green);
    color: #000;
    font-size: 13px;
    font-weight: 800;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Space Grotesk', sans-serif;
    transition: all .2s;
}

.rd-cta__btn:hover[b-bs7zxl0d7d] {
    box-shadow: 0 0 30px rgba(0, 255, 136, .3);
    transform: translateY(-2px);
}

@media (max-width: 700px) {
    .rd-page[b-bs7zxl0d7d] { padding: 32px 16px; }
    .rd-info[b-bs7zxl0d7d] { flex-wrap: wrap; }
    .rd-content[b-bs7zxl0d7d] { font-size: 14px; }
    .rd-share[b-bs7zxl0d7d] { flex-direction: column; align-items: flex-start; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/Resources.razor.rz.scp.css */
.res-landing[b-4dvirsv8xq] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 24px;
}

.res-header[b-4dvirsv8xq] {
    text-align: center;
    margin-bottom: 48px;
}

.res-header__eyebrow[b-4dvirsv8xq] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
    font-family: var(--mono);
    margin-bottom: 12px;
}

.res-header__title[b-4dvirsv8xq] {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    letter-spacing: -0.0536em;
    font-family: 'Inter', sans-serif;
    color: #fff;
    margin-bottom: 12px;
}

.res-header__sub[b-4dvirsv8xq] {
    font-size: 15px;
    color: var(--muted);
    font-family: var(--mono);
    max-width: 500px;
    margin: 0 auto;
}

/* Loading */
.res-loading[b-4dvirsv8xq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 80px 24px;
}

.res-spinner[b-4dvirsv8xq] {
    width: 36px;
    height: 36px;
    border: 3px solid var(--border);
    border-top-color: var(--green);
    border-radius: 50%;
    animation: spin-b-4dvirsv8xq .8s linear infinite;
    margin-bottom: 14px;
}

@keyframes spin-b-4dvirsv8xq { to { transform: rotate(360deg); } }

.res-loading p[b-4dvirsv8xq] {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 13px;
}

/* Tag Filter */
.res-tags[b-4dvirsv8xq] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-bottom: 40px;
}

.res-tag-pill[b-4dvirsv8xq] {
    padding: 6px 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 100px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    font-family: var(--mono);
    cursor: pointer;
    transition: all .15s;
    text-transform: lowercase;
}

.res-tag-pill:hover[b-4dvirsv8xq] {
    border-color: var(--green);
    color: var(--green);
}

.res-tag-pill.active[b-4dvirsv8xq] {
    background: var(--green);
    border-color: var(--green);
    color: #000;
}

/* Featured */
.res-featured[b-4dvirsv8xq] { margin-bottom: 32px; }

/* Grid */
.res-grid[b-4dvirsv8xq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

/* Empty */
.res-empty[b-4dvirsv8xq] {
    text-align: center;
    padding: 80px 24px;
}

.res-empty p[b-4dvirsv8xq] {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 14px;
}

/* Pagination */
.res-pagination[b-4dvirsv8xq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.res-page-btn[b-4dvirsv8xq] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
    font-family: var(--mono);
    cursor: pointer;
    transition: all .15s;
}

.res-page-btn:hover:not(:disabled)[b-4dvirsv8xq] {
    border-color: var(--green);
    color: var(--green);
}

.res-page-btn:disabled[b-4dvirsv8xq] {
    opacity: .4;
    cursor: not-allowed;
}

.res-page-info[b-4dvirsv8xq] {
    font-size: 12px;
    color: var(--dim);
    font-family: var(--mono);
}

@media (max-width: 700px) {
    .res-landing[b-4dvirsv8xq] { padding: 32px 16px; }
    .res-grid[b-4dvirsv8xq] { grid-template-columns: 1fr; }
    .res-pagination[b-4dvirsv8xq] { flex-direction: column; gap: 12px; }
}
/* _content/TheWick.MarketingWaitList/Components/Pages/WaitlistFaq.razor.rz.scp.css */
/* Waitlist FAQ — ported from the approved standalone mock (Wick Waitlist FAQ).
   The mock uses design-system token names; map them locally so the rules port
   verbatim. Dark-only surface (the marketing site has no light theme). */
.fq-page[b-ay13d7pfsj] {
    --wick-green: #00ff88;
    --font-mono: 'JetBrains Mono', 'Space Mono', ui-monospace, monospace;
    --font-impact: 'Inter', system-ui, -apple-system, sans-serif;
    --font-body: 'Space Grotesk', 'Inter', system-ui, sans-serif;
    --text: #e4e4e7;
    --muted: #a1a1aa;
    --dim: #71717a;
    --border: #1e1e1e;
    --surface: #0d0d0d;
    --surface2: #141414;
    --surface3: #1a1a1a;
    --r-md: 6px;
    --r-lg: 8px;
    --r-2xl: 16px;
    --dur-base: .2s;
    --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px;
    --s-6: 24px; --s-7: 32px; --s-8: 40px; --s-9: 48px; --s-10: 64px;
}

/* ── Hero ── */
.hero[b-ay13d7pfsj] { max-width: 1080px; margin: 0 auto; padding: var(--s-10) var(--s-7) 0; }
.eyebrow[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--wick-green); display: inline-flex; align-items: center; gap: var(--s-2); margin-bottom: var(--s-4); }
.eyebrow[b-ay13d7pfsj]::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--wick-green); animation: pdot 2s infinite; }
.hero__title[b-ay13d7pfsj] { font-family: var(--font-impact); font-size: clamp(36px, 6vw, 60px); font-weight: 900; line-height: .95; letter-spacing: -0.05em; color: var(--text); margin-bottom: var(--s-5); }
.hero__title em[b-ay13d7pfsj] { font-style: normal; color: var(--wick-green); }
.hero__sub[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 14px; line-height: 1.7; color: var(--muted); max-width: 560px; }

/* ── Layout ── */
/* Bottom margin so the trailing "need a human?" CTA clears the site footer
   instead of bumping against it (the .cta is the last child and has no bottom margin). */
.layout[b-ay13d7pfsj] { max-width: 1080px; margin: var(--s-9) auto var(--s-10); padding: 0 var(--s-7); display: grid; grid-template-columns: 212px 1fr; gap: var(--s-10); align-items: start; }

/* ── Topics rail ── */
.rail[b-ay13d7pfsj] { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 2px; }
.rail__head[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--dim); margin-bottom: var(--s-4); padding-left: var(--s-4); }
.rail__item[b-ay13d7pfsj] { text-align: left; text-decoration: none; background: transparent; border: none; border-left: 2px solid var(--border); cursor: pointer; padding: var(--s-3) var(--s-4); display: flex; flex-direction: column; gap: 3px; transition: .15s; font-family: inherit; }
.rail__item:hover[b-ay13d7pfsj] { border-left-color: var(--muted); background: rgba(255, 255, 255, .02); }
.rail__item--active[b-ay13d7pfsj] { border-left-color: var(--wick-green); }
.rail__item--active .rail__k[b-ay13d7pfsj] { color: var(--wick-green); }
.rail__k[b-ay13d7pfsj] { font-family: var(--font-impact); font-weight: 800; font-size: 15px; letter-spacing: -.3px; color: var(--text); text-transform: lowercase; }
.rail__b[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 11px; color: var(--dim); line-height: 1.3; }

/* ── Groups ── */
.grp[b-ay13d7pfsj] { margin-bottom: var(--s-9); scroll-margin-top: 108px; }
.grp:last-of-type[b-ay13d7pfsj] { margin-bottom: var(--s-8); }
.grp__head[b-ay13d7pfsj] { display: flex; align-items: baseline; gap: var(--s-3); margin-bottom: var(--s-5); padding-bottom: var(--s-4); border-bottom: 1px solid var(--border); }
.grp__n[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--wick-green); }
.grp__t[b-ay13d7pfsj] { font-family: var(--font-impact); font-size: clamp(22px, 3vw, 30px); font-weight: 800; letter-spacing: -1px; color: var(--text); text-transform: lowercase; line-height: 1; }
.grp__b[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 11px; color: var(--dim); margin-left: auto; text-transform: uppercase; letter-spacing: 1px; }

/* ── Accordion items ── */
.faq-item[b-ay13d7pfsj] { border: 1px solid var(--border); border-radius: var(--r-2xl); margin-bottom: var(--s-2); overflow: hidden; background: var(--surface2); transition: border-color var(--dur-base); }
.faq-item.open[b-ay13d7pfsj] { border-color: var(--dim); }
.faq-q[b-ay13d7pfsj] { font-family: var(--font-impact); font-size: 16px; font-weight: 700; color: var(--text); letter-spacing: -.2px; padding: var(--s-5); cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); user-select: none; }
.faq-q[b-ay13d7pfsj]::after { content: '▸'; color: var(--dim); font-size: 12px; flex-shrink: 0; transition: transform var(--dur-base), color var(--dur-base); }
.faq-item.open .faq-q[b-ay13d7pfsj]::after { transform: rotate(90deg); color: var(--wick-green); }
.faq-a[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 13px; line-height: 1.75; color: var(--muted); padding: 0 var(--s-5) var(--s-5); display: block; }
.faq-item:not(.open) .faq-a[b-ay13d7pfsj] { display: none; }
.faq-a a[b-ay13d7pfsj] { color: var(--wick-green); text-decoration: none; border-bottom: 1px solid rgba(0, 255, 136, .35); }
.faq-a a:hover[b-ay13d7pfsj] { border-color: var(--wick-green); background: rgba(0, 255, 136, .05); }
.faq-a strong[b-ay13d7pfsj] { color: #fff; font-weight: 700; }
.faq-a .fine[b-ay13d7pfsj] { color: var(--dim); font-size: 11.5px; line-height: 1.6; display: inline-block; margin-top: 6px; }
.faq-a .lede[b-ay13d7pfsj] { margin-bottom: var(--s-1); }
.ladder-note[b-ay13d7pfsj] { margin-top: var(--s-4); }

/* ── Two-ways list ── */
.ways[b-ay13d7pfsj] { list-style: none; margin: var(--s-4) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-3); }
.ways li[b-ay13d7pfsj] { display: flex; gap: var(--s-3); align-items: flex-start; }
.ways .k[b-ay13d7pfsj] { flex: 0 0 auto; font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--wick-green); background: rgba(0, 255, 136, .06); border: 1px solid rgba(0, 255, 136, .25); border-radius: var(--r-md); padding: 6px 10px; margin-top: 1px; min-width: 112px; text-align: center; }
.ways .v[b-ay13d7pfsj] { line-height: 1.7; }
.ways .v strong[b-ay13d7pfsj] { color: #fff; }

/* ── Requirements list ── */
.reqs[b-ay13d7pfsj] { list-style: none; margin: var(--s-4) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-3); }
.reqs li[b-ay13d7pfsj] { display: flex; gap: var(--s-3); align-items: center; color: var(--text); font-family: var(--font-mono); font-size: 13px; }
.reqs li[b-ay13d7pfsj]::before { content: ''; flex: 0 0 auto; width: 20px; height: 20px; border-radius: var(--r-md); border: 1px solid rgba(0, 255, 136, .3); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300ff88' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 12px no-repeat rgba(0, 255, 136, .08); }

/* ── Referral milestones ladder ── */
.ladder[b-ay13d7pfsj] { margin: var(--s-5) 0 var(--s-2); border: 1px solid var(--border); border-radius: var(--r-2xl); overflow: hidden; background: var(--surface); }
.ladder__head[b-ay13d7pfsj] { display: flex; align-items: center; justify-content: space-between; padding: var(--s-3) var(--s-5); background: rgba(0, 255, 136, .05); border-bottom: 1px solid rgba(0, 255, 136, .18); }
.ladder__title[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--wick-green); }
.ladder__hint[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 10px; color: var(--dim); letter-spacing: .5px; text-transform: uppercase; }
.ladder__row[b-ay13d7pfsj] { display: grid; grid-template-columns: 118px 1fr 84px; align-items: center; gap: var(--s-4); padding: var(--s-4) var(--s-5); border-bottom: 1px solid var(--border); }
.ladder__row:last-child[b-ay13d7pfsj] { border-bottom: none; }
.ladder__row:hover[b-ay13d7pfsj] { background: rgba(255, 255, 255, .02); }
.ladder__refs[b-ay13d7pfsj] { font-family: var(--font-impact); font-weight: 800; font-size: 16px; color: #fff; letter-spacing: -.3px; display: flex; align-items: baseline; gap: 6px; }
.ladder__refs span[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 10px; font-weight: 500; color: var(--dim); text-transform: uppercase; letter-spacing: .5px; }
.ladder__track[b-ay13d7pfsj] { height: 6px; border-radius: 3px; background: var(--surface3); overflow: hidden; }
.ladder__bar[b-ay13d7pfsj] { height: 100%; border-radius: 3px; background: linear-gradient(90deg, rgba(0, 255, 136, .35), var(--wick-green)); }
.ladder__bonus[b-ay13d7pfsj] { font-family: var(--font-impact); font-weight: 900; font-size: 19px; color: var(--wick-green); letter-spacing: -.8px; text-align: right; line-height: 1; }
.ladder__bonus small[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 9px; font-weight: 500; color: var(--dim); display: block; text-transform: uppercase; letter-spacing: .5px; margin-top: 2px; }

/* ── Contact CTA ── */
.cta[b-ay13d7pfsj] { border: 1px solid var(--border); border-radius: var(--r-2xl); background: var(--surface2); padding: var(--s-7); margin-top: var(--s-7); display: flex; align-items: center; justify-content: space-between; gap: var(--s-6); flex-wrap: wrap; position: relative; overflow: hidden; }
.cta[b-ay13d7pfsj]::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(0, 255, 136, .4), transparent); }
.cta__t[b-ay13d7pfsj] { font-family: var(--font-impact); font-weight: 900; font-size: 22px; letter-spacing: -1px; color: var(--text); }
.cta__t em[b-ay13d7pfsj] { font-style: normal; color: var(--wick-green); }
.cta__s[b-ay13d7pfsj] { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-top: 6px; }
.cta__btn[b-ay13d7pfsj] { flex: 0 0 auto; font-family: var(--font-body); font-size: 13px; font-weight: 800; background: var(--wick-green); color: #000; border: none; border-radius: var(--r-lg); padding: 13px 24px; cursor: pointer; transition: .15s; text-decoration: none; display: inline-block; }
.cta__btn:hover[b-ay13d7pfsj] { box-shadow: 0 0 30px rgba(0, 255, 136, .3); transform: translateY(-1px); }

/* ── Responsive ── */
@media (max-width: 820px) {
    .layout[b-ay13d7pfsj] { grid-template-columns: 1fr; gap: var(--s-6); }
    .rail[b-ay13d7pfsj] { position: static; flex-flow: wrap; gap: var(--s-2); }
    .rail__head[b-ay13d7pfsj] { display: none; }
    .rail__item[b-ay13d7pfsj] { border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--s-2) var(--s-4); }
    .rail__item--active[b-ay13d7pfsj] { border-color: var(--wick-green); }
    .rail__b[b-ay13d7pfsj] { display: none; }
    .grp__b[b-ay13d7pfsj] { display: none; }
    .hero[b-ay13d7pfsj] { padding-top: var(--s-8); }
    .ways li[b-ay13d7pfsj] { flex-direction: column; gap: var(--s-1); }
}
/* _content/TheWick.MarketingWaitList/Components/Shared/LeaderboardTable.razor.rz.scp.css */
/* Controls */
.lb-controls[b-f7b0dh50ax] {
    max-width: 1200px;
    margin: 20px auto 0;
    padding: 0 24px;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.lb-search[b-f7b0dh50ax] {
    flex: 1;
    min-width: 180px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 12px;
    color: var(--text);
    font-family: var(--mono);
    outline: none;
    transition: border-color .2s;
}

.lb-search[b-f7b0dh50ax]::placeholder { color: var(--muted); }
.lb-search:focus[b-f7b0dh50ax] { border-color: rgba(0, 255, 136, .4); }

.lb-filters[b-f7b0dh50ax] { display: flex; gap: 8px; flex-wrap: wrap; }

.lb-filter[b-f7b0dh50ax] {
    font-size: 11px;
    font-weight: 700;
    padding: 6px 14px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    font-family: var(--mono);
    cursor: pointer;
    transition: all .15s;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.lb-filter:hover[b-f7b0dh50ax] { border-color: var(--muted); color: var(--text); }
.lb-filter--active[b-f7b0dh50ax] { border-color: var(--green); color: var(--green); background: rgba(0, 255, 136, .05); }

/* Table */
.lb-table-wrap[b-f7b0dh50ax] {
    max-width: 1200px;
    margin: 20px auto 0;
    padding: 0 24px;
    overflow-x: auto;
    /* This wrap scrolls HORIZONTALLY only — a vertical scrollbar is never a feature here. With
       overflow-x:auto alone the computed overflow-y also becomes `auto` (CSS spec — `visible` can't
       pair with a scrolling axis), and the column tooltips (.th-info::after) — hidden via
       visibility, so they still occupy layout — extend a few hundred px below the header. On a short
       board that phantom height spawned a spurious vertical scrollbar. overflow-y:hidden makes one
       impossible; min-height keeps room so an OPEN header tooltip isn't clipped on a short board. */
    overflow-y: hidden;
    min-height: 300px;
    position: relative;
    z-index: 1;
}

.lb-table[b-f7b0dh50ax] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-family: var(--mono);
}

.lb-table thead th[b-f7b0dh50ax] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--dim);
    padding: 10px 14px;
    text-align: left;
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 0;
    background: var(--bg);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    transition: color .15s;
}

.lb-table thead th:hover[b-f7b0dh50ax] { color: var(--muted); }
.lb-table thead th.sorted[b-f7b0dh50ax] { color: var(--green); }
.lb-table thead th .arrow[b-f7b0dh50ax] { margin-left: 4px; font-size: 9px; opacity: .5; }
.lb-table thead th.sorted .arrow[b-f7b0dh50ax] { opacity: 1; color: var(--green); }
.lb-table thead th:first-child[b-f7b0dh50ax] { width: 48px; text-align: center; }
.lb-table tbody tr[b-f7b0dh50ax] { transition: all .15s; cursor: default; }
.lb-table tbody tr:hover[b-f7b0dh50ax] { background: var(--surface2); }
.lb-table tbody tr:hover .row-name[b-f7b0dh50ax] { color: var(--green); }
.lb-table tbody td[b-f7b0dh50ax] { padding: 14px; border-bottom: 1px solid var(--border); font-size: 12px; white-space: nowrap; vertical-align: middle; }

.row-rank[b-f7b0dh50ax] { text-align: center; font-size: 16px; font-weight: 900; color: var(--dim); font-family: 'Inter', sans-serif; width: 48px; }
.row-rank--1[b-f7b0dh50ax] { color: var(--yellow); font-size: 18px; text-shadow: 0 0 12px rgba(250, 204, 21, .3); }
.row-rank--2[b-f7b0dh50ax] { color: #c0c0c0; font-size: 17px; }
.row-rank--3[b-f7b0dh50ax] { color: #cd7f32; font-size: 17px; }

.row-algo[b-f7b0dh50ax] { display: flex; align-items: center; gap: 12px; min-width: 200px; }
.row-ava[b-f7b0dh50ax] { width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; border: 1px solid var(--border); }
.row-name[b-f7b0dh50ax] { font-size: 14px; font-weight: 800; color: #fff; font-family: 'Inter', sans-serif; letter-spacing: -.3px; transition: color .15s; }
/* Cap the name so a long algo name (e.g. "BTC Long/Short trend following ensemble") can't widen the
   nowrap strategy column past the 1200px table and force a horizontal scrollbar. Full name shows on
   hover via the title attribute. The badge (if any) sits after this span, unaffected. */
.row-name-text[b-f7b0dh50ax] { display: inline-block; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.row-creator[b-f7b0dh50ax] { font-size: 10px; color: var(--dim); margin-top: 2px; }

.row-badge[b-f7b0dh50ax] { font-size: 9px; font-weight: 700; padding: 2px 7px; border-radius: 3px; letter-spacing: .4px; text-transform: uppercase; margin-left: 8px; flex-shrink: 0; }
.row-badge--hot[b-f7b0dh50ax] { background: rgba(250, 204, 21, .1); color: var(--yellow); }
.row-badge--new[b-f7b0dh50ax] { background: rgba(56, 189, 248, .1); color: var(--blue); }
.row-badge--og[b-f7b0dh50ax] { background: rgba(0, 255, 136, .1); color: var(--green); }
.row-badge--top[b-f7b0dh50ax] { background: rgba(168, 85, 247, .1); color: var(--purple); }

.row-pnl[b-f7b0dh50ax] { font-size: 18px; font-weight: 900; font-family: 'Inter', sans-serif; letter-spacing: -1px; }
.row-pnl--pos[b-f7b0dh50ax] { color: var(--green); }
.row-pnl--neg[b-f7b0dh50ax] { color: var(--red); }

.row-spark[b-f7b0dh50ax] { width: 100px; height: 32px; }
.row-spark-canvas[b-f7b0dh50ax] { display: block; width: 100%; height: 100%; }

.row-dd[b-f7b0dh50ax] { color: var(--red); font-weight: 700; }
.row-sharpe[b-f7b0dh50ax] { font-weight: 700; color: var(--text); }

/* Assets column — ticker chips; overflow collapses behind a "+N" chip with a hover tooltip */
.row-assets[b-f7b0dh50ax] { display: flex; flex-wrap: wrap; gap: 4px; max-width: 150px; }

.row-asset[b-f7b0dh50ax] {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .3px;
    color: var(--muted);
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 2px 6px;
    line-height: 1.4;
}

.row-asset--more[b-f7b0dh50ax] { color: var(--dim); border-style: dashed; cursor: help; position: relative; }

.row-asset--more[b-f7b0dh50ax]::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #0f0f0f;
    border: 1px solid #2a2a2a;
    border-radius: 6px;
    padding: 6px 9px;
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .3px;
    color: var(--text);
    white-space: normal;
    max-width: 220px;
    width: max-content;
    text-align: center;
    line-height: 1.5;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s, visibility .15s;
    z-index: 50;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .6);
}

.row-asset--more:hover[b-f7b0dh50ax]::after { opacity: 1; visibility: visible; }

.row-price[b-f7b0dh50ax] { font-weight: 800; color: var(--text); font-size: 13px; }

.row-run-locked[b-f7b0dh50ax] {
    font-size: 10px;
    font-weight: 700;
    padding: 5px 14px;
    border: 1px solid var(--dim);
    border-radius: 5px;
    background: transparent;
    color: var(--dim);
    font-family: var(--mono);
    cursor: pointer;
    transition: all .15s;
    text-transform: uppercase;
    letter-spacing: .4px;
    white-space: nowrap;
}

.row-run-locked:hover[b-f7b0dh50ax] { border-color: var(--green); color: var(--green); }

.lb-fade[b-f7b0dh50ax] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 280px;
    background: linear-gradient(to bottom, transparent 0%, var(--bg) 100%);
    pointer-events: none;
    z-index: 2;
}

/* Performance data disclosure — sits between the filters and the table */
.lb-disclaimer[b-f7b0dh50ax] {
    max-width: 1200px;
    margin: 18px auto 0;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}

.lb-disclaimer__inner[b-f7b0dh50ax] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    line-height: 1.5;
}

.lb-disclaimer__inner[b-f7b0dh50ax]::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--muted);
    flex-shrink: 0;
}

.lb-disclaimer__inner strong[b-f7b0dh50ax] { color: var(--text); font-weight: 600; }

.lb-disclaimer__star[b-f7b0dh50ax] {
    color: inherit;
    margin-left: 1px;
    text-decoration: none;
    cursor: pointer;
}

.lb-disclaimer__star:hover[b-f7b0dh50ax] { color: var(--green); }

/* Full disclosures footnote — anchored by the star link above */
.lb-disclosure[b-f7b0dh50ax] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 24px 40px;
    position: relative;
    z-index: 3;
    scroll-margin-top: 64px;
}

.lb-disclosure__inner[b-f7b0dh50ax] {
    border-top: 1px solid var(--border);
    padding-top: 28px;
}

.lb-disclosure__body[b-f7b0dh50ax] {
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
    line-height: 1.8;
}

/* Column info icon + hover tooltip (CSS-only, no JS — driven by the data-tip attribute) */
.th-info[b-f7b0dh50ax] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    height: 13px;
    border: 1px solid var(--dim);
    border-radius: 50%;
    font-size: 9px;
    font-weight: 700;
    color: var(--dim);
    font-family: 'Inter', sans-serif;
    font-style: italic;
    cursor: help;
    margin-left: 6px;
    vertical-align: middle;
    position: relative;
    text-transform: none;
    letter-spacing: 0;
    line-height: 1;
    transition: all .15s;
}

.th-info:hover[b-f7b0dh50ax] { color: var(--green); border-color: var(--green); }

.th-info[b-f7b0dh50ax]::after {
    content: attr(data-tip);
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
    background: #0f0f0f;
    border: 1px solid #2a2a2a;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text);
    font-family: 'Inter', sans-serif;
    font-style: normal;
    letter-spacing: .1px;
    white-space: normal;
    width: 240px;
    text-transform: none;
    line-height: 1.5;
    text-align: left;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s, visibility .15s;
    z-index: 50;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .6);
}

.th-info[b-f7b0dh50ax]::before {
    content: '';
    position: absolute;
    top: calc(100% + 5px);
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    background: #0f0f0f;
    border-left: 1px solid #2a2a2a;
    border-top: 1px solid #2a2a2a;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .15s, visibility .15s;
    z-index: 51;
}

.th-info:hover[b-f7b0dh50ax]::after, .th-info:hover[b-f7b0dh50ax]::before { opacity: 1; visibility: visible; }

/* The last info column (price — the run-button th has no tooltip) sits near the table's right edge;
   a centered 240px tooltip would extend past it and, occupying layout even hidden, force a phantom
   horizontal scrollbar at full width. Anchor it to the right so it stays inside the table. */
.lb-table thead th:nth-last-child(2) .th-info[b-f7b0dh50ax]::after {
    left: auto;
    right: -10px;
    transform: none;
}

/* Timeframe selector — sits to the right of the category filters in the controls row */
.lb-tf[b-f7b0dh50ax] { display: flex; gap: 6px; margin-left: auto; padding-left: 12px; border-left: 1px solid var(--border); }

/* Mobile leaderboard cards — variant A "ranked rows". Hidden on desktop; CSS swaps the table for
   these below 820px so the leaderboard reads as a stacked list instead of a horizontal scroll. */
.lb-cards[b-f7b0dh50ax] { display: none; flex-direction: column; gap: 10px; max-width: 1200px; margin: 16px auto 0; padding: 0 16px; position: relative; z-index: 1; }

.mc[b-f7b0dh50ax] { background: var(--surface2); border: 1px solid var(--border); border-radius: 14px; position: relative; overflow: hidden; transition: border-color .15s; }
.mc:active[b-f7b0dh50ax] { border-color: #2a2a2a; }
.mc-name[b-f7b0dh50ax] { font-family: 'Inter', sans-serif; font-weight: 800; font-size: 15px; color: #fff; letter-spacing: -.3px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; line-height: 1.12; }
.mc-creator[b-f7b0dh50ax] { font-family: var(--mono); font-size: 11px; color: var(--dim); margin-top: 3px; }
.mc-ret[b-f7b0dh50ax] { font-family: 'Inter', sans-serif; font-weight: 800; letter-spacing: -1px; line-height: 1; font-size: 21px; }
.mc-ret.pos[b-f7b0dh50ax] { color: var(--green); }
.mc-ret.neg[b-f7b0dh50ax] { color: var(--red); }
.mc-rl[b-f7b0dh50ax] { font-family: var(--mono); font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--dim); margin-top: 3px; }
.mc-neg[b-f7b0dh50ax] { color: var(--red); }
.mc-badge[b-f7b0dh50ax] { font-family: var(--mono); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; padding: 2px 6px; border-radius: 999px; line-height: 1.05; }
.mc-badge--hot[b-f7b0dh50ax] { background: rgba(255, 59, 59, .14); color: var(--red); }
.mc-badge--new[b-f7b0dh50ax] { background: rgba(56, 189, 248, .14); color: var(--blue); }
.mc-badge--og[b-f7b0dh50ax] { background: rgba(168, 85, 247, .16); color: var(--purple); }
.mc-badge--top[b-f7b0dh50ax] { background: rgba(250, 204, 21, .14); color: var(--yellow); }

.mc--a[b-f7b0dh50ax] { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 13px 14px; cursor: pointer; }
.mc-a-num[b-f7b0dh50ax] { font-family: 'Inter', sans-serif; font-weight: 800; font-size: 18px; color: var(--dim); min-width: 26px; text-align: center; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.mc-a-num--1[b-f7b0dh50ax] { color: #ffd34d; }
.mc-a-num--2[b-f7b0dh50ax] { color: #d4d7db; }
.mc-a-num--3[b-f7b0dh50ax] { color: #e09a5a; }
.mc-a-main[b-f7b0dh50ax] { min-width: 0; }
.mc-a-stats[b-f7b0dh50ax] { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 7px; }
.mc-a-stats span[b-f7b0dh50ax] { display: inline-flex; align-items: baseline; gap: 5px; }
.mc-a-stats i[b-f7b0dh50ax] { font-family: var(--mono); color: var(--dim); font-style: normal; text-transform: uppercase; letter-spacing: .5px; font-size: 8.5px; }
.mc-a-stats b[b-f7b0dh50ax] { color: #9b9ea2; font-weight: 600; font-family: 'Inter', sans-serif; font-size: 11px; }
.mc-a-right[b-f7b0dh50ax] { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; }
.mc-a-spark[b-f7b0dh50ax] { width: 62px; height: 22px; display: block; margin-bottom: 4px; opacity: .7; }
.mc-a-right .mc-rl[b-f7b0dh50ax] { margin-top: 1px; }

/* Below 820px: drop the horizontal-scroll table, show the stacked cards. */
@media (max-width: 820px) {
    .lb-table-wrap[b-f7b0dh50ax] { display: none; }
    .lb-cards[b-f7b0dh50ax] { display: flex; }
    .lb-tf[b-f7b0dh50ax] { margin-left: 0; padding-left: 0; border-left: none; flex-wrap: wrap; }
}

@media (max-width: 900px) {
    .lb-controls[b-f7b0dh50ax] { flex-direction: column; align-items: stretch; }
    .lb-search[b-f7b0dh50ax] { width: 100%; }
}

@media (max-width: 700px) {
    .lb-table-wrap[b-f7b0dh50ax] { padding: 0 8px; }
    .lb-table tbody td[b-f7b0dh50ax] { padding: 10px 8px; }
}

/* Empty state — a placed board exists but has no live entries yet (configured environment; demo data
   is dev-only). Honest "coming soon" panel shown in place of the table; still drives the waitlist CTA. */
.lb-empty[b-f7b0dh50ax] {
    max-width: 1200px;
    margin: 24px auto 0;
    padding: 0 24px;
}

.lb-empty__inner[b-f7b0dh50ax] {
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    padding: 56px 28px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

/* Pulse dot — the design-system "something is live right now" signal. */
.lb-empty__pulse[b-f7b0dh50ax] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 0 rgba(0, 255, 136, .5);
    animation: lb-empty-pulse-b-f7b0dh50ax 2s infinite;
}

@keyframes lb-empty-pulse-b-f7b0dh50ax {
    0%   { box-shadow: 0 0 0 0 rgba(0, 255, 136, .5); }
    70%  { box-shadow: 0 0 0 12px rgba(0, 255, 136, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0); }
}

.lb-empty__title[b-f7b0dh50ax] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -.5px;
    color: #fff;
}

.lb-empty__sub[b-f7b0dh50ax] {
    font-family: var(--mono);
    font-size: 13px;
    line-height: 1.6;
    color: var(--muted);
    max-width: 440px;
    margin: 0;
}

.lb-empty__cta[b-f7b0dh50ax] {
    margin-top: 8px;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 11px 22px;
    border-radius: 8px;
    border: 1px solid var(--green);
    background: rgba(0, 255, 136, .08);
    color: var(--green);
    cursor: pointer;
    transition: background .15s, transform .15s;
}

.lb-empty__cta:hover[b-f7b0dh50ax] { background: rgba(0, 255, 136, .16); transform: translateY(-1px); }

/* ── credibility badge (optimizer-v2 P7) ──────────────────────────── */
.row-cred[b-f7b0dh50ax] {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.05rem 0.4rem;
    border-radius: 4px;
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: lowercase;
    vertical-align: middle;
    white-space: nowrap;
}

.row-cred--verified[b-f7b0dh50ax] {
    color: var(--wick-green, #00ff88);
    border: 1px solid var(--wick-green, #00ff88);
    background: rgba(0, 255, 136, 0.08);
}

.row-cred--provisional[b-f7b0dh50ax] {
    color: var(--fg-3, #71717a);
    border: 1px solid var(--outline, #3f3f46);
}
/* _content/TheWick.MarketingWaitList/Components/Shared/ResearchPopup.razor.rz.scp.css */
/* RESEARCH POPUP (slide-up) — market-research email capture on the dashboard.
   Ported from the marketing mock. Colours use the global tokens from waitlist.css. */
.research-pop[b-4h9cbri4p4] {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 200;
    width: 360px;
    max-width: calc(100vw - 32px);
    background: linear-gradient(135deg, rgba(0, 255, 136, .16), rgba(0, 255, 136, .04)), #0d0d0d;
    border: 1px solid rgba(0, 255, 136, .45);
    border-radius: 14px;
    padding: 22px;
    font-family: var(--mono);
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .55), 0 0 36px rgba(0, 255, 136, .12);
    transform: translateY(120%);
    opacity: 0;
    pointer-events: none;
    /* Animate the reveal/dismiss (the mock toggled the classes with no transition). */
    transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .4s ease;
}

.research-pop.show[b-4h9cbri4p4] {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.research-pop.hide[b-4h9cbri4p4] {
    opacity: 0;
    transform: translateY(120%);
    pointer-events: none;
}

.research-pop[b-4h9cbri4p4]::after {
    content: '';
    position: absolute;
    right: -40px;
    top: -40px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 255, 136, .22), transparent 70%);
    pointer-events: none;
}

.research-pop__close[b-4h9cbri4p4] {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: rgba(255, 255, 255, .06);
    color: var(--muted);
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    transition: all .15s;
}

.research-pop__close:hover[b-4h9cbri4p4] {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.research-pop__h[b-4h9cbri4p4] {
    position: relative;
    font-family: 'Inter', sans-serif;
    font-size: 21px;
    font-weight: 900;
    letter-spacing: -.7px;
    color: #fff;
    line-height: 1.05;
    margin-bottom: 8px;
}

.research-pop__h em[b-4h9cbri4p4] {
    font-style: normal;
    color: var(--green);
}

.research-pop__b[b-4h9cbri4p4] {
    position: relative;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.6;
    margin-bottom: 16px;
}

.research-pop__row[b-4h9cbri4p4] {
    position: relative;
    display: flex;
    gap: 8px;
    align-items: center;
}

.research-pop__in[b-4h9cbri4p4] {
    flex: 1;
    background: rgba(0, 0, 0, .35);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 11px 14px;
    font-size: 12px;
    color: var(--text);
    font-family: var(--mono);
    outline: none;
    transition: all .2s;
}

.research-pop__in:focus[b-4h9cbri4p4] {
    border-color: rgba(0, 255, 136, .5);
    box-shadow: 0 0 0 3px rgba(0, 255, 136, .1);
}

.research-pop__in:disabled[b-4h9cbri4p4] {
    opacity: .6;
}

.research-pop__btn[b-4h9cbri4p4] {
    padding: 12px 18px;
    background: var(--green);
    border: none;
    border-radius: 8px;
    color: #000;
    font-size: 11px;
    font-weight: 800;
    font-family: var(--mono);
    cursor: pointer;
    letter-spacing: .3px;
    text-transform: uppercase;
    white-space: nowrap;
    transition: all .2s;
}

.research-pop__btn:hover[b-4h9cbri4p4] {
    box-shadow: 0 0 24px rgba(0, 255, 136, .35);
}

.research-pop__btn:disabled[b-4h9cbri4p4] {
    cursor: default;
}

.research-pop__btn.done[b-4h9cbri4p4] {
    background: var(--green);
    color: #000;
}

.research-pop__msg[b-4h9cbri4p4] {
    position: relative;
    font-size: 11px;
    font-family: var(--mono);
    margin-top: 8px;
    min-height: 14px;
}

/* The mock set these colours inline from JS; here they are class-driven. */
.research-pop__msg.ok[b-4h9cbri4p4] {
    color: var(--green);
}

.research-pop__msg.err[b-4h9cbri4p4] {
    color: var(--red);
}

@media (max-width: 560px) {
    .research-pop[b-4h9cbri4p4] {
        right: 16px;
        left: 16px;
        bottom: 16px;
        width: auto;
    }
}

/* RESEARCH LAUNCHER (minimized fab) */
.research-fab[b-4h9cbri4p4] {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 199;
    display: none;
    align-items: center;
    gap: 9px;
    padding: 12px 18px;
    background: var(--green);
    border: 1px solid rgba(0, 255, 136, .6);
    border-radius: 999px;
    color: #000;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .3px;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .5), 0 0 28px rgba(0, 255, 136, .3);
    transition: transform .2s, box-shadow .2s;
}

.research-fab:hover[b-4h9cbri4p4] {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(0, 0, 0, .55), 0 0 40px rgba(0, 255, 136, .45);
}

.research-fab.show[b-4h9cbri4p4] {
    display: inline-flex;
}

.research-fab__ic[b-4h9cbri4p4] {
    font-size: 13px;
}

@media (max-width: 560px) {
    .research-fab[b-4h9cbri4p4] {
        right: 16px;
        bottom: 16px;
    }
}
/* _content/TheWick.MarketingWaitList/Components/Shared/ResourceCard.razor.rz.scp.css */
.res-card[b-65ihdjt0c1] {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

.res-card:hover[b-65ihdjt0c1] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
    border-color: var(--green);
}

.res-card.featured[b-65ihdjt0c1] {
    grid-column: 1 / -1;
    flex-direction: row;
}

.res-card.featured .res-card__img[b-65ihdjt0c1] {
    flex: 1;
    max-width: 50%;
    height: auto;
    min-height: 280px;
}

.res-card.featured .res-card__body[b-65ihdjt0c1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.res-card.featured .res-card__title[b-65ihdjt0c1] { font-size: 26px; }
.res-card.featured .res-card__excerpt[b-65ihdjt0c1] { font-size: 15px; }

.res-card__img[b-65ihdjt0c1] {
    height: 200px;
    overflow: hidden;
    background: var(--surface2);
}

.res-card__img img[b-65ihdjt0c1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}

.res-card:hover .res-card__img img[b-65ihdjt0c1] { transform: scale(1.05); }

.res-card__img.placeholder[b-65ihdjt0c1] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--border);
}

.res-card__body[b-65ihdjt0c1] { padding: 20px; }

.res-card__meta[b-65ihdjt0c1] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.res-card__tag[b-65ihdjt0c1] {
    display: inline-block;
    padding: 3px 10px;
    background: rgba(0, 255, 136, .08);
    border: 1px solid var(--green);
    border-radius: 100px;
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    text-transform: uppercase;
    font-family: var(--mono);
    letter-spacing: .5px;
}

.res-card__date[b-65ihdjt0c1] {
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
}

.res-card__title[b-65ihdjt0c1] {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text);
    line-height: 1.35;
    font-family: 'Inter', sans-serif;
    letter-spacing: -.3px;
}

.res-card:hover .res-card__title[b-65ihdjt0c1] { color: var(--green); }

.res-card__excerpt[b-65ihdjt0c1] {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.6;
    margin-bottom: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: var(--mono);
}

.res-card__footer[b-65ihdjt0c1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
}

.res-card__author[b-65ihdjt0c1] { font-weight: 500; }

@media (max-width: 700px) {
    .res-card.featured[b-65ihdjt0c1] { flex-direction: column; }
    .res-card.featured .res-card__img[b-65ihdjt0c1] { max-width: 100%; height: 200px; min-height: 200px; }
    .res-card.featured .res-card__title[b-65ihdjt0c1] { font-size: 20px; }
    .res-card.featured .res-card__excerpt[b-65ihdjt0c1] { font-size: 13px; }
}
/* _content/TheWick.MarketingWaitList/Components/Shared/SignupForm.razor.rz.scp.css */
/* ── Compact hero signup (marketing-v3) ──
   Lives inline in the home hero's left column — no card/gate chrome. */
.wl-signup[b-172qo250y0] {
    margin-top: 36px;
    max-width: 470px;
    font-family: var(--mono);
    position: relative;
    z-index: 3;
}

.wl-signup__label[b-172qo250y0] {
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 9px;
}

.wl-form[b-172qo250y0] { position: relative; }

.wl-step--hidden[b-172qo250y0] { display: none; }

@keyframes slideUp-b-172qo250y0 {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.wl-step[b-172qo250y0] { animation: slideUp-b-172qo250y0 .25s ease both; }

/* ── Error ── */
.wl-error[b-172qo250y0] {
    font-size: 11px;
    color: var(--red);
    font-family: var(--mono);
    margin-bottom: 10px;
    text-align: left;
}

/* ── Referral Applied Pill ── */
.ref-applied-pill[b-172qo250y0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 255, 136, .08);
    border: 1px solid rgba(0, 255, 136, .2);
    border-radius: 100px;
    padding: 6px 14px;
    margin-bottom: 16px;
    font-family: var(--mono);
    font-size: 11px;
    color: var(--green);
}

.ref-applied-pill strong[b-172qo250y0] { color: #fff; margin-left: 4px; }

/* ── Phone Input Row ── */
.wl-phone-row[b-172qo250y0] { display: flex; gap: 10px; align-items: stretch; }

.wl-phone-wrap[b-172qo250y0] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 9px;
    background: rgba(0, 0, 0, .5);
    border: 1px solid #3f3f46;
    border-radius: 6px;
    padding: 0 13px;
    transition: border-color .2s, box-shadow .2s;
}

.wl-phone-wrap:focus-within[b-172qo250y0] {
    border-color: rgba(0, 255, 136, .4);
    box-shadow: 0 0 0 3px rgba(0, 255, 136, .06);
}

@keyframes shake-b-172qo250y0 {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-6px); }
    40% { transform: translateX(6px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(4px); }
}

.wl-phone-wrap.error[b-172qo250y0] {
    border-color: var(--red);
    animation: shake-b-172qo250y0 .3s ease;
}

.wl-flag[b-172qo250y0] {
    color: var(--green);
    font-size: 13px;
    font-family: var(--mono);
    cursor: default;
    white-space: nowrap;
}

.wl-input[b-172qo250y0] {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: none;
    color: var(--text);
    font-family: var(--mono);
    font-size: 13px;
    letter-spacing: .5px;
    padding: 12px 0;
    outline: none;
}

.wl-input[b-172qo250y0]::placeholder { color: var(--muted); }

/* ── Join Button ── */
.wl-btn[b-172qo250y0] {
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    padding: 0 22px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
    transition: box-shadow .2s, transform .2s;
    min-width: 88px;
}

.wl-btn:hover[b-172qo250y0] { box-shadow: 0 0 20px rgba(0, 255, 136, .3); transform: translateY(-1px); }
.wl-btn:disabled[b-172qo250y0] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

@keyframes spin-b-172qo250y0 { to { transform: rotate(360deg); } }

.wl-btn--loading[b-172qo250y0] {
    position: relative;
    color: transparent;
}

.wl-btn--loading[b-172qo250y0]::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: 16px;
    height: 16px;
    border: 2px solid #000;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin-b-172qo250y0 .7s linear infinite;
}

/* ── Optional Codes ── */
.wl-optional-fields[b-172qo250y0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, .07);
    padding-top: 14px;
}

.wl-optional-toggle[b-172qo250y0] {
    align-self: flex-start;
    background: none;
    border: none;
    padding: 0;
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .3px;
    color: var(--muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: color .15s;
}

.wl-optional-toggle:hover[b-172qo250y0] { color: var(--text); }

.wl-optional-toggle[b-172qo250y0]::before {
    content: '+';
    font-size: 15px;
    line-height: 1;
    color: var(--green);
    font-weight: 700;
    display: inline-block;
    transition: transform .2s;
}

.wl-optional-toggle.is-open[b-172qo250y0]::before { transform: rotate(45deg); }

.wl-optional-collapse[b-172qo250y0] {
    display: none;
    flex-direction: column;
    gap: 8px;
}

.wl-optional-collapse.is-open[b-172qo250y0] { display: flex; }

.wl-code-input[b-172qo250y0] {
    background: rgba(0, 0, 0, .4);
    border: 1px solid #3f3f46;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 12px;
    color: var(--text);
    font-family: var(--mono);
    outline: none;
    transition: all .2s;
    width: 100%;
}

.wl-code-input[b-172qo250y0]::placeholder { color: var(--muted); }

.wl-code-input:focus[b-172qo250y0] {
    border-color: rgba(0, 255, 136, .4);
    background: rgba(0, 0, 0, .5);
    box-shadow: 0 0 0 3px rgba(0, 255, 136, .06);
}

.wl-sms-consent[b-172qo250y0] {
    font-size: 10px;
    color: var(--dim);
    font-family: var(--mono);
    margin-top: 10px;
    line-height: 1.6;
    max-width: 440px;
}

/* ── OTP Step ── */
.otp-heading[b-172qo250y0] {
    font-size: 11px;
    color: var(--dim);
    font-family: var(--mono);
    margin-bottom: 10px;
}

.otp-heading__phone[b-172qo250y0] { color: var(--muted); }

.otp-row[b-172qo250y0] {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

.otp-digit[b-172qo250y0] {
    width: 42px;
    height: 46px;
    background: rgba(0, 0, 0, .5);
    border: 1px solid #3f3f46;
    border-radius: 6px;
    text-align: center;
    font-size: 19px;
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    outline: none;
    transition: all .2s;
    caret-color: var(--green);
    min-width: 0;
}

.otp-digit:focus[b-172qo250y0] {
    border-color: rgba(0, 255, 136, .5);
    background: rgba(0, 0, 0, .7);
    box-shadow: 0 0 0 3px rgba(0, 255, 136, .08);
}

.otp-digit.filled[b-172qo250y0] {
    border-color: rgba(0, 255, 136, .35);
    background: rgba(0, 255, 136, .04);
}

.otp-digit.error[b-172qo250y0] {
    border-color: var(--red);
    background: rgba(255, 59, 59, .04);
    animation: shake-b-172qo250y0 .3s ease;
}

.otp-verify-btn[b-172qo250y0] {
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    padding: 0 20px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
    transition: all .2s;
    white-space: nowrap;
}

.otp-verify-btn:hover[b-172qo250y0] { box-shadow: 0 0 20px rgba(0, 255, 136, .3); }
.otp-verify-btn:disabled[b-172qo250y0] { opacity: .5; cursor: not-allowed; box-shadow: none; }

.otp-verify-btn.loading[b-172qo250y0] {
    color: transparent;
    position: relative;
}

.otp-verify-btn.loading[b-172qo250y0]::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: 16px;
    height: 16px;
    border: 2px solid #000;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin-b-172qo250y0 .7s linear infinite;
}

.otp-error-msg[b-172qo250y0] {
    min-height: 16px;
    font-size: 11px;
    font-family: var(--mono);
    color: var(--red);
    margin-top: 8px;
}

/* ── Dev Hint ── */
.dev-hint[b-172qo250y0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(168, 85, 247, .08);
    border: 1px solid rgba(168, 85, 247, .2);
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 11px;
    font-family: var(--mono);
    color: var(--purple);
    margin-top: 10px;
}

.dev-hint__code[b-172qo250y0] {
    font-weight: 700;
    letter-spacing: 2px;
    color: #fff;
}

/* ── Resend + Back ── */
.otp-resend[b-172qo250y0] {
    margin-top: 10px;
    font-size: 11px;
    font-family: var(--mono);
    color: var(--dim);
}

.otp-resend-btn[b-172qo250y0] {
    background: none;
    border: none;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 11px;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    padding: 0;
    transition: color .15s;
}

.otp-resend-btn:hover[b-172qo250y0] { color: var(--green); }
.otp-resend-btn:disabled[b-172qo250y0] { color: var(--dim); cursor: not-allowed; text-decoration: none; }

.otp-countdown[b-172qo250y0] {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 11px;
}

.otp-back[b-172qo250y0] {
    background: none;
    border: none;
    color: var(--dim);
    font-family: var(--mono);
    font-size: 11px;
    cursor: pointer;
    padding: 0;
    margin-top: 10px;
    display: block;
    text-underline-offset: 2px;
    text-decoration: underline;
    transition: color .15s;
}

.otp-back:hover[b-172qo250y0] { color: var(--muted); }

/* ── Responsive ── */
@media (max-width: 700px) {
    .wl-signup[b-172qo250y0] { max-width: none; }
    .otp-row[b-172qo250y0] { flex-wrap: wrap; }
    .otp-verify-btn[b-172qo250y0] { flex: 1; padding: 12px 16px; }
    .otp-digit[b-172qo250y0] { width: 40px; height: 46px; font-size: 18px; }
}