/* /Components/Layout/Footer.razor.rz.scp.css */
.hx-footer[b-atjd90ejg7] {
    border-top: 1px solid var(--hx-border);
    background: var(--hx-surface-1);
    margin-top: 3rem;
}

.hx-footer__inner[b-atjd90ejg7] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    padding-block: 1.5rem;
}

/* Brand */
.hx-footer__brand[b-atjd90ejg7] {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
}
.hx-footer__wordmark[b-atjd90ejg7] {
    font-family: var(--hx-font-display);
    font-size: 1.35rem;
    letter-spacing: 0.06em;
    color: var(--hx-gold);
    line-height: 1;
}
.hx-footer__tag[b-atjd90ejg7] {
    font-family: var(--hx-font-mono);
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    color: var(--hx-text-caption);
}

/* Links */
.hx-footer__links[b-atjd90ejg7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.25rem;
}
.hx-footer__link[b-atjd90ejg7] {
    font-size: 0.85rem;
    color: var(--hx-text-muted);
    text-decoration: none;
    transition: color 0.15s;
}
.hx-footer__link:hover[b-atjd90ejg7] { color: var(--hx-gold-hover); }

/* Legal + version */
.hx-footer__meta[b-atjd90ejg7] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    text-align: right;
}
.hx-footer__legal[b-atjd90ejg7] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--hx-text-caption-2);
}
.hx-footer__version[b-atjd90ejg7] {
    margin: 0;
    font-family: var(--hx-font-mono);
    font-size: 0.7rem;
    color: var(--hx-text-faint);
}

/* Mobile: stack, left-align. */
@media (max-width: 640px) {
    .hx-footer__inner[b-atjd90ejg7] { justify-content: flex-start; }
    .hx-footer__meta[b-atjd90ejg7] { align-items: flex-start; text-align: left; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* #blazor-error-ui styles live in app.css */

.hx-main[b-ufp39mu4tj] {
    min-height: calc(100dvh - var(--hx-nav-h));
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ── Nav bar ──────────────────────────────────────────────── */
.hx-nav[b-ol0do8vzsg] {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(8,8,7,.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(232,196,108,.16);
}

.hx-nav__inner[b-ol0do8vzsg] {
    max-width: var(--hx-max-app);
    margin: 0 auto;
    padding: 0 clamp(16px,4vw,40px);
    height: var(--hx-nav-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* ── Wordmark ─────────────────────────────────────────────── */
.hx-nav__wordmark[b-ol0do8vzsg] {
    font-family: var(--hx-font-display);
    font-size: 26px;
    color: var(--hx-gold);
    letter-spacing: .06em;
    text-decoration: none;
    line-height: 1;
    flex-shrink: 0;
    transition: color var(--hx-t);
}

.hx-nav__wordmark:hover[b-ol0do8vzsg] {
    color: var(--hx-gold-hover);
}

/* ── Left cluster ─────────────────────────────────────────── */
.hx-nav__left[b-ol0do8vzsg] {
    display: flex;
    align-items: center;
    gap: 26px;
    min-width: 0;
}

/* ── Primary nav links (desktop) ─────────────────────────── */
.hx-nav__links[b-ol0do8vzsg] {
    display: flex;
    align-items: center;
    gap: 22px;
}

/* NavLink renders <a> — use ::deep to pierce the component boundary */
.hx-nav__links[b-ol0do8vzsg]  a {
    font-size: 13px;
    font-weight: 600;
    color: var(--hx-text-muted);
    text-decoration: none;
    transition: color var(--hx-t);
    white-space: nowrap;
}

.hx-nav__links[b-ol0do8vzsg]  a:hover,
.hx-nav__links[b-ol0do8vzsg]  a.is-active {
    color: var(--hx-gold);
}

/* ── Grouped dropdowns (doc 18, Phase 1) — headers are pure containers ── */
.hx-nav__group[b-ol0do8vzsg] { position: relative; }

.hx-nav__group-btn[b-ol0do8vzsg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--hx-font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--hx-text-muted);
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    white-space: nowrap;
    transition: color var(--hx-t);
}

.hx-nav__group:hover .hx-nav__group-btn[b-ol0do8vzsg],
.hx-nav__group:focus-within .hx-nav__group-btn[b-ol0do8vzsg] { color: var(--hx-gold); }

.hx-nav__caret[b-ol0do8vzsg] { font-size: 9px; transition: transform var(--hx-t); }
.hx-nav__group:hover .hx-nav__caret[b-ol0do8vzsg],
.hx-nav__group:focus-within .hx-nav__caret[b-ol0do8vzsg] { transform: rotate(180deg); }

.hx-nav__menu[b-ol0do8vzsg] {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    min-width: 170px;
    background: var(--hx-surface-1);
    border: 1px solid var(--hx-border-mid);
    border-radius: var(--hx-r-sm);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    box-shadow: 0 8px 24px rgba(0,0,0,.5);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--hx-t), transform var(--hx-t), visibility var(--hx-t);
    z-index: 60;
}

/* Invisible bridge so the cursor can cross the gap from header to menu without dropping :hover. */
.hx-nav__menu[b-ol0do8vzsg]::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
}

.hx-nav__group:hover .hx-nav__menu[b-ol0do8vzsg],
.hx-nav__group:focus-within .hx-nav__menu[b-ol0do8vzsg] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

.hx-nav__menu[b-ol0do8vzsg]  a {
    display: block;
    padding: 8px 12px;
    font-size: .85rem;
    font-weight: 500;
    color: var(--hx-text-2);
    border-radius: 6px;
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--hx-t), color var(--hx-t);
}

.hx-nav__menu[b-ol0do8vzsg]  a:hover,
.hx-nav__menu[b-ol0do8vzsg]  a.is-active {
    background: var(--hx-fill-gold-subtle);
    color: var(--hx-gold);
}

/* ── Right cluster ────────────────────────────────────────── */
.hx-nav__right[b-ol0do8vzsg] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.hx-nav__signin[b-ol0do8vzsg] {
    font-size: .8rem !important;
    padding: .45em 1.1em !important;
    min-height: 36px !important;
}

/* ── Avatar ───────────────────────────────────────────────── */
.hx-nav__avatar-wrap[b-ol0do8vzsg] {
    position: relative;
}

/* Account button = @handle + initial glyph (so you can tell profiles apart at a glance). */
.hx-nav__account[b-ol0do8vzsg] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
}

.hx-nav__handle[b-ol0do8vzsg] {
    font-family: var(--hx-font-mono);
    font-size: 12.5px;
    color: var(--hx-gold);
    max-width: min(40vw, 12rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color var(--hx-t);
}

.hx-nav__avatar[b-ol0do8vzsg] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    transition: transform var(--hx-t);
}

.hx-nav__account:hover .hx-nav__avatar[b-ol0do8vzsg] {
    transform: scale(1.06);
}
.hx-nav__account:hover .hx-nav__handle[b-ol0do8vzsg] { color: var(--hx-gold-hover); }

/* ── Avatar dropdown ──────────────────────────────────────── */
.hx-nav__dropdown[b-ol0do8vzsg] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 160px;
    background: var(--hx-surface-1);
    border: 1px solid var(--hx-border-mid);
    border-radius: var(--hx-r-sm);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    box-shadow: 0 8px 24px rgba(0,0,0,.5);
}

.hx-nav__dropdown a[b-ol0do8vzsg],
.hx-nav__dropdown button[b-ol0do8vzsg] {
    display: block;
    width: 100%;
    padding: 8px 12px;
    text-align: left;
    font-size: .85rem;
    font-weight: 500;
    color: var(--hx-text-2);
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: background var(--hx-t), color var(--hx-t);
    font-family: var(--hx-font-body);
}

.hx-nav__dropdown a:hover[b-ol0do8vzsg],
.hx-nav__dropdown button:hover[b-ol0do8vzsg] {
    background: var(--hx-fill-gold-subtle);
    color: var(--hx-gold);
}

.hx-nav__dropdown-divider[b-ol0do8vzsg] {
    height: 1px;
    background: var(--hx-border);
    margin: 4px 6px;
}

/* ── Hamburger (mobile only) ──────────────────────────────── */
.hx-nav__hamburger[b-ol0do8vzsg] {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid var(--hx-border-mid);
    border-radius: var(--hx-r-sm);
    cursor: pointer;
    padding: 0;
    transition: border-color var(--hx-t);
}

.hx-nav__hamburger:hover[b-ol0do8vzsg] {
    border-color: var(--hx-border-gold);
}

.hx-nav__hamburger span[b-ol0do8vzsg] {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--hx-text-muted);
    border-radius: 2px;
    transition: transform var(--hx-t), opacity var(--hx-t), background var(--hx-t);
    transform-origin: center;
}

.hx-nav__hamburger.is-open span:nth-child(1)[b-ol0do8vzsg] { transform: translateY(7px) rotate(45deg); background: var(--hx-gold); }
.hx-nav__hamburger.is-open span:nth-child(2)[b-ol0do8vzsg] { opacity: 0; }
.hx-nav__hamburger.is-open span:nth-child(3)[b-ol0do8vzsg] { transform: translateY(-7px) rotate(-45deg); background: var(--hx-gold); }

/* ── Mobile drawer ────────────────────────────────────────── */
.hx-nav__mobile[b-ol0do8vzsg] {
    border-top: 1px solid var(--hx-border);
    padding: 8px clamp(16px,4vw,40px) 16px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: var(--hx-max-app);
    margin: 0 auto;
}

.hx-nav__mobile[b-ol0do8vzsg]  a {
    display: flex;
    align-items: center;
    padding: 11px 10px;
    font-size: .95rem;
    font-weight: 600;
    /* Neutral off-white so links read as links — gold is reserved for headers, hover & active. */
    color: var(--hx-text-heading, #f6efdd);
    text-decoration: none;
    border-radius: var(--hx-r-sm);
    transition: background var(--hx-t), color var(--hx-t);
    min-height: 44px;
}

.hx-nav__mobile[b-ol0do8vzsg]  a:hover,
.hx-nav__mobile[b-ol0do8vzsg]  a.is-active {
    color: var(--hx-gold);
    background: var(--hx-fill-gold-subtle);
}

/* Each group = header + its links, chunked by a divider line above. */
.hx-nav__m-section[b-ol0do8vzsg] {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid var(--hx-border);
}

/* Grouped links sit indented UNDER their header, a touch smaller — clearly subordinate. */
.hx-nav__m-section[b-ol0do8vzsg]  a {
    padding-left: 28px;
    font-size: .9rem;
}

/* Group headers (doc 18) — labels, not links. Gold + uppercase + spaced = the group anchor. */
.hx-nav__mobile-group[b-ol0do8vzsg] {
    display: block;
    padding: 4px 10px 6px;
    font-family: var(--hx-font-mono);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--hx-gold);
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 700px) {
    .hx-nav__links[b-ol0do8vzsg] {
        display: none;
    }

    .hx-nav__hamburger[b-ol0do8vzsg] {
        display: flex;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-t4a3fpxj24],
.components-reconnect-repeated-attempt-visible[b-t4a3fpxj24],
.components-reconnect-failed-visible[b-t4a3fpxj24],
.components-pause-visible[b-t4a3fpxj24],
.components-resume-failed-visible[b-t4a3fpxj24],
.components-rejoining-animation[b-t4a3fpxj24] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-retrying[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-failed[b-t4a3fpxj24],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-t4a3fpxj24] {
    display: block;
}


#components-reconnect-modal[b-t4a3fpxj24] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-t4a3fpxj24 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-t4a3fpxj24 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-t4a3fpxj24 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-t4a3fpxj24]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-t4a3fpxj24 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-t4a3fpxj24 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-t4a3fpxj24 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-t4a3fpxj24 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-t4a3fpxj24] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-t4a3fpxj24] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-t4a3fpxj24] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-t4a3fpxj24] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-t4a3fpxj24] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-t4a3fpxj24] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-t4a3fpxj24] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-t4a3fpxj24 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-t4a3fpxj24] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-t4a3fpxj24 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin/CatalogReview.razor.rz.scp.css */
.cr[b-ce2f0qk2zr] { padding: 2rem 1rem 4rem; }

.cr__head[b-ce2f0qk2zr] { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cr__eyebrow[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.16em; color: var(--hx-gold, #e8c46c); margin: 0; }
.cr__title[b-ce2f0qk2zr] { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem, 5vw, 3rem); margin: 0.1rem 0 0; color: var(--hx-text-heading, #f6efdd); }
.cr__head-actions[b-ce2f0qk2zr] { display: flex; align-items: center; gap: 0.9rem; }
.cr__count[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-2, #cbc3b0); white-space: nowrap; }

.cr__flash[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.8rem; color: #6cbf7a; background: rgba(108,191,122,0.08); border: 1px solid rgba(108,191,122,0.3); border-radius: 8px; padding: 0.6rem 0.9rem; margin: 1rem 0 0; }

.cr__filters[b-ce2f0qk2zr] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 1.25rem 0 0.75rem; }
.cr__filter[b-ce2f0qk2zr] { padding: 6px 14px; border-radius: 999px; border: none; background: rgba(255,255,255,.04); color: var(--hx-text-muted, #9a927e); font-family: var(--hx-font-body); font-size: 12px; font-weight: 600; cursor: pointer; }
.cr__filter.is-active[b-ce2f0qk2zr] { background: transparent; color: var(--hx-gold, #e8c46c); box-shadow: inset 0 0 0 1px rgba(232,196,108,.7); }

/* Within-status narrowing: category dropdown + name/brand search (the queue grows without bound). */
.cr__subfilters[b-ce2f0qk2zr] { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin: 0 0 1.25rem; }
.cr__cat-select[b-ce2f0qk2zr], .cr__search[b-ce2f0qk2zr] {
    font-family: 'Space Mono', monospace; font-size: 0.78rem;
    color: var(--hx-text-heading, #f6efdd);
    background: var(--hx-surface-1, #14110c);
    border: 1px solid var(--hx-border, #2a2820); border-radius: 8px;
    padding: 7px 12px;
}
.cr__cat-select[b-ce2f0qk2zr] { cursor: pointer; }
.cr__search[b-ce2f0qk2zr] { flex: 1 1 220px; min-width: 0; }
.cr__search[b-ce2f0qk2zr]::placeholder { color: var(--hx-text-muted, #9a927e); }
.cr__cat-select:focus[b-ce2f0qk2zr], .cr__search:focus[b-ce2f0qk2zr] { outline: none; border-color: rgba(232,196,108,.6); }
.cr__result-count[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.68rem; color: var(--hx-text-muted, #9a927e); white-space: nowrap; }
@media (min-width: 560px) { .cr__cat-select[b-ce2f0qk2zr] { max-width: 260px; } }

.cr__layout[b-ce2f0qk2zr] { display: grid; grid-template-columns: minmax(0, 340px) 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 820px) { .cr__layout[b-ce2f0qk2zr] { grid-template-columns: 1fr; } }

.cr__queue[b-ce2f0qk2zr] { display: flex; flex-direction: column; gap: 0.5rem; }
.cr__empty[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #9a927e); }

/* Gated-queue prompt — shown until the reviewer picks a category or searches. */
.cr__prompt[b-ce2f0qk2zr] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: var(--hx-text-2, #cbc3b0);
    background: rgba(255,255,255,.02);
    border: 1px dashed var(--hx-border, #2a2820);
    border-radius: 10px;
    padding: 1.6rem 1.25rem;
    text-align: center;
    line-height: 1.5;
}
.cr__prompt-sub[b-ce2f0qk2zr] {
    display: block;
    margin-top: 0.4rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    color: var(--hx-text-muted, #9a927e);
}
.cr__item[b-ce2f0qk2zr] { text-align: left; width: 100%; cursor: pointer; padding: 0.7rem 0.85rem; border-radius: 10px; background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820); transition: border-color .15s; }
.cr__item:hover[b-ce2f0qk2zr] { border-color: rgba(232,196,108,.4); }
.cr__item.is-selected[b-ce2f0qk2zr] { border-color: var(--hx-gold, #e8c46c); }
.cr__item-top[b-ce2f0qk2zr] { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.cr__item-name[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; color: var(--hx-text-heading, #f6efdd); }
.cr__item-meta[b-ce2f0qk2zr] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.35rem; font-family: 'Space Mono', monospace; font-size: 0.62rem; color: var(--hx-text-2, #cbc3b0); }

.cr__cat[b-ce2f0qk2zr] { color: var(--hx-text-2, #cbc3b0); text-transform: lowercase; }
.cr__src--user[b-ce2f0qk2zr] { color: #8fc2ff; }
.cr__verify[b-ce2f0qk2zr] { color: #ffb02e; }
.cr__status[b-ce2f0qk2zr] { color: var(--hx-text-muted, #9a927e); }
.cr__conf[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.6rem; padding: 2px 7px; border-radius: 999px; }
.cr__conf--high[b-ce2f0qk2zr] { color: #6cbf7a; border: 1px solid rgba(108,191,122,.5); }
.cr__conf--medium[b-ce2f0qk2zr] { color: #ffb02e; border: 1px solid rgba(255,176,46,.5); }
.cr__conf--low[b-ce2f0qk2zr] { color: #ff8f8f; border: 1px solid rgba(255,120,120,.5); }

.cr__detail[b-ce2f0qk2zr] { background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820); border-radius: 14px; padding: 1.4rem; }
.cr__d-title[b-ce2f0qk2zr] { font-family: 'Bebas Neue', sans-serif; font-size: 1.9rem; margin: 0; color: var(--hx-text-heading, #f6efdd); }
.cr__d-badges[b-ce2f0qk2zr] { display: flex; gap: 0.6rem; flex-wrap: wrap; margin: 0.5rem 0 1rem; font-family: 'Space Mono', monospace; font-size: 0.65rem; align-items: center; }
.cr__warn[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; color: #ffb02e; background: rgba(255,176,46,.07); border: 1px solid rgba(255,176,46,.3); border-radius: 8px; padding: 0.5rem 0.75rem; margin: 0.4rem 0; }

.cr__chars[b-ce2f0qk2zr] { background: rgba(255,255,255,.02); border: 1px solid var(--hx-border, #2a2820); border-radius: 10px; padding: 0.8rem 1rem; margin: 0.8rem 0; }
.cr__chars-label[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.1em; color: var(--hx-gold, #e8c46c); }
.cr__char[b-ce2f0qk2zr] { display: flex; justify-content: space-between; gap: 1rem; padding: 0.3rem 0; border-bottom: 1px solid rgba(255,255,255,.05); font-family: 'Space Mono', monospace; font-size: 0.78rem; }
.cr__char span:first-child[b-ce2f0qk2zr] { color: var(--hx-text-muted, #9a927e); }
.cr__char span:last-child[b-ce2f0qk2zr] { color: var(--hx-text-heading, #f6efdd); text-align: right; }

.cr__source-link[b-ce2f0qk2zr] { display: block; font-family: 'Space Mono', monospace; font-size: 0.68rem; color: #8fc2ff; word-break: break-all; margin: 0.4rem 0 1rem; }
.cr__label[b-ce2f0qk2zr] { display: block; font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.06em; color: var(--hx-text-2, #cbc3b0); margin: 0.7rem 0 0.25rem; }
.cr__label-hint[b-ce2f0qk2zr] { color: var(--hx-text-muted, #9a927e); text-transform: none; letter-spacing: 0; }
.cr__fields[b-ce2f0qk2zr] { display: flex; flex-direction: column; gap: 0.4rem; }
.cr__field[b-ce2f0qk2zr] { display: grid; grid-template-columns: 8rem 1fr; align-items: center; gap: 0.6rem; }
.cr__field-key[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-muted, #9a927e); }
/* Empty field = amber highlight for quick-reference enrichment (clears live as it's filled). */
.cr__field--missing .hx-input[b-ce2f0qk2zr] { border-color: rgba(255,176,46,.55); background: rgba(255,176,46,.05); }
.cr__field--missing .cr__field-key[b-ce2f0qk2zr] { color: #ffb02e; }
.cr__field--missing .cr__field-key[b-ce2f0qk2zr]::after { content: " •"; }
.cr__raw[b-ce2f0qk2zr] { margin: 0.7rem 0 0; }
.cr__raw summary[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.66rem; color: var(--hx-text-muted, #9a927e); cursor: pointer; }
.cr__json[b-ce2f0qk2zr] { font-family: 'Space Mono', monospace; font-size: 0.75rem; width: 100%; margin-top: 0.4rem; }
.cr__save-row[b-ce2f0qk2zr] { display: flex; align-items: center; gap: 0.7rem; margin-top: 0.7rem; }
.cr__save[b-ce2f0qk2zr] { margin-top: 0; }
/* Immediate, local save confirmation beside the button (operator, 2026-07-18). */
.cr__saved[b-ce2f0qk2zr] {
    font-family: 'Space Mono', monospace; font-size: 0.78rem;
    color: #6cbf7a;
    animation: cr-saved-in-b-ce2f0qk2zr 0.15s ease-out;
}
@keyframes cr-saved-in-b-ce2f0qk2zr { from { opacity: 0; transform: translateX(-4px); } to { opacity: 1; transform: none; } }

/* Live-product note (shown instead of the publish/reject actions once Approved). */
.cr__live-note[b-ce2f0qk2zr] {
    margin: 1.2rem 0 0.6rem; padding: 0.7rem 0.9rem;
    border: 1px solid rgba(108,191,122,.3); border-radius: 8px; background: rgba(108,191,122,.06);
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; color: #b0a890; line-height: 1.4;
}
.cr__live-note b[b-ce2f0qk2zr] { color: #f6efdd; }

.cr__actions[b-ce2f0qk2zr] { display: flex; gap: 0.6rem; flex-wrap: wrap; margin: 1.2rem 0 0.6rem; }
.cr__merge[b-ce2f0qk2zr] { display: flex; gap: 0.6rem; align-items: center; margin-top: 0.4rem; }
.cr__error[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; color: #e0a05a; margin: 0.8rem 0 0; }

/* ── Near-duplicate verify panel (doc 23) ─────────────────── */
.cr__dup[b-ce2f0qk2zr] {
    margin-top: 0.9rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid rgba(224, 160, 90, 0.55);
    border-left: 3px solid #e0a05a;
    border-radius: 8px;
    background: rgba(224, 160, 90, 0.08);
}
.cr__dup-title[b-ce2f0qk2zr] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1rem;
    letter-spacing: 0.04em;
    color: #f0b070;
    margin: 0 0 0.35rem;
}
.cr__dup-body[b-ce2f0qk2zr] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.86rem;
    line-height: 1.45;
    color: #d8d2c4;
    margin: 0 0 0.6rem;
}
.cr__dup-list[b-ce2f0qk2zr] {
    list-style: none;
    margin: 0 0 0.9rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.cr__dup-list li[b-ce2f0qk2zr] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
}
.cr__dup-name[b-ce2f0qk2zr] { color: var(--hx-fg, #fff); font-weight: 600; }
.cr__dup-id[b-ce2f0qk2zr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
}
.cr__dup-actions[b-ce2f0qk2zr] { display: flex; gap: 0.6rem; flex-wrap: wrap; }

/* Review trail — append-only, attributed, multi-pass history (doc 23 §7) */
.cr__trail[b-ce2f0qk2zr] { margin: 1.1rem 0 0.4rem; border-top: 1px solid var(--hx-border, #2a2820); padding-top: 0.9rem; }
.cr__trail-empty[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: var(--hx-text-muted, #9a927e); font-style: italic; margin: 0.3rem 0 0.6rem; }
.cr__trail-list[b-ce2f0qk2zr] { list-style: none; margin: 0.3rem 0 0.7rem; padding: 0; display: flex; flex-direction: column; gap: 0.55rem; }
.cr__trail-item[b-ce2f0qk2zr] { border-left: 2px solid var(--hx-border, #2a2820); padding: 0.1rem 0 0.1rem 0.7rem; }
.cr__trail-meta[b-ce2f0qk2zr] { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: baseline; font-family: 'Space Mono', monospace; font-size: 0.62rem; }
.cr__trail-who[b-ce2f0qk2zr] { color: var(--hx-text-2, #cbc3b0); }
.cr__trail-when[b-ce2f0qk2zr] { color: var(--hx-text-muted, #9a927e); }
.cr__trail-note[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; color: var(--hx-text-heading, #f6efdd); margin: 0.25rem 0 0; white-space: pre-wrap; }
.cr__trail-kind[b-ce2f0qk2zr] { letter-spacing: 0.04em; color: var(--hx-text-muted, #9a927e); }
.cr__trail-kind--published[b-ce2f0qk2zr] { color: #6cbf7a; }
.cr__trail-kind--rejected[b-ce2f0qk2zr] { color: #ff8f8f; }
.cr__trail-kind--merged[b-ce2f0qk2zr] { color: #8fc2ff; }
.cr__trail-kind--markedreviewing[b-ce2f0qk2zr] { color: #ffb02e; }
.cr__trail-add[b-ce2f0qk2zr] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; width: 100%; margin: 0.2rem 0 0.5rem; resize: vertical; }
/* /Components/Pages/Admin/ShowdownBooth.razor.rz.scp.css */
.sb[b-e8p7qhj4i7] { padding-block: 2rem 4rem; }

.sb__head[b-e8p7qhj4i7] { margin-bottom: 1.5rem; }
.sb__title[b-e8p7qhj4i7] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2rem;
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0;
}
.sb__sub[b-e8p7qhj4i7] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: var(--hx-muted);
    margin: 0.25rem 0 0;
}

.sb__flash[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.85rem;
    padding: 0.7rem 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    border: 1px solid transparent;
}
.sb__flash--ok[b-e8p7qhj4i7]  { color: #7bd88f; border-color: rgba(123, 216, 143, 0.4); background: rgba(123, 216, 143, 0.08); }
.sb__flash--err[b-e8p7qhj4i7] { color: #e6a15a; border-color: rgba(230, 161, 90, 0.4);  background: rgba(230, 161, 90, 0.08); }

.sb__actions-top[b-e8p7qhj4i7] { margin-bottom: 1.5rem; }

/* ── Create/edit form ─────────────────────────────── */
.sb__form[b-e8p7qhj4i7] {
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 2rem;
}
.sb__form-title[b-e8p7qhj4i7] {
    font-family: 'Bebas Neue', sans-serif;
    letter-spacing: 0.08em;
    font-size: 1.25rem;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 1rem;
}
.sb__grid[b-e8p7qhj4i7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}
.sb__field[b-e8p7qhj4i7] { display: flex; flex-direction: column; gap: 0.3rem; }
.sb__field--wide[b-e8p7qhj4i7] { grid-column: 1 / -1; }
.sb__field > span[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--hx-muted);
}
.sb__field > span em[b-e8p7qhj4i7] { font-style: italic; text-transform: none; opacity: 0.8; }
.sb__input[b-e8p7qhj4i7] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.95rem;
    padding: 0.55rem 0.7rem;
    background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #333);
    border-radius: 8px;
    color: var(--hx-fg, #fff);
}
.sb__input:focus[b-e8p7qhj4i7] { outline: none; border-color: var(--hx-gold, #e8c46c); }
.sb__check[b-e8p7qhj4i7] { flex-direction: row; align-items: center; gap: 0.5rem; }
.sb__check span[b-e8p7qhj4i7] { text-transform: none; font-size: 0.9rem; color: #d8cdb6; font-family: 'Hanken Grotesk', sans-serif; letter-spacing: 0; }

.sb__form-issue[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace; font-size: 0.8rem;
    color: #e6a15a; margin: 1rem 0 0;
}
.sb__form-actions[b-e8p7qhj4i7] { display: flex; gap: 0.75rem; margin-top: 1.25rem; }

/* ── List ─────────────────────────────────────────── */
.sb__empty[b-e8p7qhj4i7] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-muted); }
.sb__list[b-e8p7qhj4i7] { display: flex; flex-direction: column; gap: 0.75rem; }
.sb__row[b-e8p7qhj4i7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 10px;
    padding: 1rem 1.2rem;
}
.sb__row-main[b-e8p7qhj4i7] { min-width: 0; flex: 1 1 320px; }
.sb__row-name[b-e8p7qhj4i7] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.25rem;
    letter-spacing: 0.03em;
    color: var(--hx-fg, #fff);
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.sb__status[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    border: 1px solid var(--hx-border, #333);
    color: var(--hx-muted);
}
.sb__status--1[b-e8p7qhj4i7] { color: #9db4d0; border-color: rgba(157, 180, 208, 0.4); }   /* Upcoming */
.sb__status--2[b-e8p7qhj4i7] { color: #7bd88f; border-color: rgba(123, 216, 143, 0.4); }   /* Taking entries */
.sb__status--3[b-e8p7qhj4i7] { color: var(--hx-gold, #e8c46c); border-color: rgba(232, 196, 108, 0.5); }  /* Live */
.sb__status--4[b-e8p7qhj4i7] { color: var(--hx-muted); }                                    /* Closed (finished) */
.sb__status--cancelled[b-e8p7qhj4i7] {                                                       /* Called off */
    color: #e6a15a;
    border-color: rgba(230, 161, 90, 0.4);
    text-decoration: line-through;
}
.sb__mode[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.08em;
    color: var(--hx-muted);
}
.sb__row-meta[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.74rem;
    color: var(--hx-muted);
    margin-top: 0.4rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}
.sb__hopper--full[b-e8p7qhj4i7] { color: #7bd88f; }
.sb__voting[b-e8p7qhj4i7] { color: var(--hx-gold, #e8c46c); }

.sb__row-actions[b-e8p7qhj4i7] { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.sb__confirm[b-e8p7qhj4i7] {
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    color: #e6a15a;
    margin-right: 0.15rem;
}
.sb__btn-sm[b-e8p7qhj4i7] { padding: 0.4rem 0.8rem; font-size: 0.8rem; }
.sb__btn-danger[b-e8p7qhj4i7] { color: #e6a15a; border-color: rgba(230, 161, 90, 0.4); }

@media (max-width: 640px) {
    .sb__row[b-e8p7qhj4i7] { flex-direction: column; align-items: stretch; }
    .sb__row-actions[b-e8p7qhj4i7] { justify-content: flex-start; }
}
/* /Components/Pages/Blueprints/BlueprintBuilder.razor.rz.scp.css */
.bpb[b-3r8rsjw2ew] {
    max-width: 720px;
    margin: 0 auto;
    padding: var(--hx-space-6) var(--hx-space-4) var(--hx-space-9);
}

/* ── Header ────────────────────────────────────────────────────── */
.bpb__eyebrow[b-3r8rsjw2ew] {
    font-family: var(--hx-font-mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--hx-gold);
    margin: 0 0 var(--hx-space-2);
}

.bpb__headline[b-3r8rsjw2ew] {
    font-family: var(--hx-font-display);
    font-size: clamp(2.6rem, 7vw, 4.2rem);
    line-height: 0.95;
    color: var(--hx-text-heading);
    margin: 0 0 var(--hx-space-4);
    letter-spacing: 0.01em;
}

.bpb__sub[b-3r8rsjw2ew] {
    font-size: 14px;
    color: var(--hx-text-muted);
    line-height: 1.55;
    margin: 0 0 var(--hx-space-7);
}

.bpb__loading[b-3r8rsjw2ew] { color: var(--hx-text-muted); padding: var(--hx-space-6) 0; }

/* ── Sections ──────────────────────────────────────────────────── */
.bpb__section[b-3r8rsjw2ew] {
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-radius-md);
    background: var(--hx-surface-1);
    padding: var(--hx-space-5);
    margin-bottom: var(--hx-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--hx-space-5);
}

.bpb__section-head[b-3r8rsjw2ew] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.bpb__section-title[b-3r8rsjw2ew] {
    font-family: var(--hx-font-display);
    font-size: 1.5rem;
    letter-spacing: 0.02em;
    /* Section titles gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}

.bpb__count[b-3r8rsjw2ew] {
    font-family: var(--hx-font-mono);
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-gold);
}

/* ── Fields ────────────────────────────────────────────────────── */
.bpb__field label[b-3r8rsjw2ew] {
    display: block;
    font-family: var(--hx-font-mono);
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-text-muted);
    margin-bottom: var(--hx-space-2);
}

.bpb__req[b-3r8rsjw2ew] { color: var(--hx-gold); }
.bpb__optional[b-3r8rsjw2ew] { color: var(--hx-text-muted); opacity: 0.6; font-size: 10px; }

.bpb__light-sun[b-3r8rsjw2ew] {
    font-size: 13px;
    color: var(--hx-text-2);
    margin: 0;
    line-height: 1.5;
}

.bpb__hint[b-3r8rsjw2ew] {
    font-size: 13px;
    color: var(--hx-text-muted);
    margin: 0;
    line-height: 1.55;
}

/* ── Chips ─────────────────────────────────────────────────────── */
.bpb__chips[b-3r8rsjw2ew] { display: flex; flex-wrap: wrap; gap: var(--hx-space-2); }

.bpb__chip[b-3r8rsjw2ew] {
    padding: 7px 18px;
    border: 1px solid var(--hx-border);
    border-radius: 999px;
    background: transparent;
    color: var(--hx-text-2);
    font-family: var(--hx-font-body);
    font-size: 13px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    line-height: 1;
}

.bpb__chip:hover[b-3r8rsjw2ew] { border-color: rgba(212, 175, 55, 0.4); color: var(--hx-text-heading); }
.bpb__chip.is-active[b-3r8rsjw2ew] { border-color: var(--hx-gold); background: rgba(212, 175, 55, 0.1); color: var(--hx-gold); }

/* ── Pick controls (search + category) ─────────────────────────── */
.bpb__pick-controls[b-3r8rsjw2ew] { display: flex; gap: var(--hx-space-2); flex-wrap: wrap; }
.bpb__search[b-3r8rsjw2ew] { flex: 1 1 60%; min-width: 0; }
.bpb__cat[b-3r8rsjw2ew] { flex: 1 1 30%; color-scheme: dark; }

/* ── Pick list ─────────────────────────────────────────────────── */
.bpb__picklist[b-3r8rsjw2ew] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 340px;
    overflow-y: auto;
    padding-right: 2px;
}

.bpb__pick[b-3r8rsjw2ew] {
    display: flex;
    align-items: center;
    gap: var(--hx-space-3);
    width: 100%;
    text-align: left;
    padding: 9px 12px;
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-radius-md);
    background: var(--hx-surface-2);
    cursor: pointer;
    transition: border-color 0.12s, background 0.12s;
}

.bpb__pick:hover[b-3r8rsjw2ew] { border-color: rgba(212, 175, 55, 0.4); }
.bpb__pick.is-on[b-3r8rsjw2ew] { border-color: var(--hx-gold); background: rgba(212, 175, 55, 0.08); }

.bpb__pick-check[b-3r8rsjw2ew] {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border: 1px solid var(--hx-border);
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--hx-gold);
    line-height: 1;
}

.bpb__pick.is-on .bpb__pick-check[b-3r8rsjw2ew] { border-color: var(--hx-gold); background: rgba(212, 175, 55, 0.15); }

.bpb__pick-glyph[b-3r8rsjw2ew] { flex: 0 0 auto; font-size: 18px; line-height: 1; }

.bpb__pick-info[b-3r8rsjw2ew] { display: flex; flex-direction: column; gap: 1px; min-width: 0; }

.bpb__pick-name[b-3r8rsjw2ew] {
    color: var(--hx-text-heading);
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bpb__pick-sub[b-3r8rsjw2ew] {
    font-family: var(--hx-font-mono);
    font-size: 11px;
    color: var(--hx-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bpb__empty[b-3r8rsjw2ew] {
    font-size: 13px;
    color: var(--hx-text-muted);
    line-height: 1.5;
    margin: var(--hx-space-2) 0;
}

/* ── Search-to-add: pinned rows + result matches (operator, 2026-07-18) ── */
.bpb__chosen[b-3r8rsjw2ew] { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--hx-space-2); }
.bpb__chosen-row[b-3r8rsjw2ew] {
    display: flex; align-items: center; gap: var(--hx-space-3);
    padding: 8px 12px;
    border: 1px solid var(--hx-gold); border-radius: 8px;
    background: rgba(212, 175, 55, 0.08);
}
.bpb__chosen-name[b-3r8rsjw2ew] { flex: 1 1 auto; min-width: 0; color: var(--hx-text-heading); font-size: 14px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bpb__chosen-sub[b-3r8rsjw2ew] { flex: 0 0 auto; font-family: var(--hx-font-mono); font-size: 11px; color: var(--hx-text-muted); }
.bpb__chosen-x[b-3r8rsjw2ew] {
    flex: 0 0 auto; background: none; border: 0; cursor: pointer;
    color: var(--hx-text-muted); font-size: 13px; line-height: 1; padding: 4px 6px;
}
.bpb__chosen-x:hover[b-3r8rsjw2ew] { color: #e0863c; }

.bpb__results[b-3r8rsjw2ew] {
    display: flex; flex-direction: column; gap: 6px;
    max-height: 300px; overflow-y: auto; padding-right: 2px; margin-top: 6px;
}
.bpb__result[b-3r8rsjw2ew] {
    display: flex; align-items: center; gap: var(--hx-space-3);
    width: 100%; text-align: left; padding: 9px 12px;
    border: 1px solid var(--hx-border); border-radius: 8px;
    background: var(--hx-surface-2, #14100b); color: inherit; cursor: pointer;
    transition: border-color 0.12s;
}
.bpb__result:hover[b-3r8rsjw2ew] { border-color: rgba(212, 175, 55, 0.4); }
.bpb__result-add[b-3r8rsjw2ew] { margin-left: auto; flex: 0 0 auto; font-family: var(--hx-font-mono); font-size: 11px; color: var(--hx-gold); }
.bpb__empty a[b-3r8rsjw2ew] { color: var(--hx-gold); }

/* Build (left) + Edit (right) share one row, opposite ends. */
.bpb__recipe-edit[b-3r8rsjw2ew] {
    font-family: var(--hx-font-body); font-size: 13px; color: var(--hx-gold); text-decoration: none;
}
.bpb__recipe-edit:hover[b-3r8rsjw2ew] { color: var(--hx-gold-hover); text-decoration: underline; }

/* ── "Your Super Soils" browser (recipe mode) ──────────────────── */
.bpb__soil-view[b-3r8rsjw2ew] {
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-radius-md);
    background: var(--hx-surface-2, #14100b);
    padding: var(--hx-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--hx-space-3);
}
.bpb__soil-view-head[b-3r8rsjw2ew] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--hx-space-3);
}
.bpb__soil-view-name[b-3r8rsjw2ew] {
    font-family: var(--hx-font-display);
    font-size: 1.25rem;
    letter-spacing: 0.02em;
    color: var(--hx-text-heading);
    margin: 0;
}
.bpb__soil-items[b-3r8rsjw2ew] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.bpb__soil-items li[b-3r8rsjw2ew] { display: flex; align-items: center; gap: var(--hx-space-3); }

/* ── Actions ───────────────────────────────────────────────────── */
.bpb__error[b-3r8rsjw2ew] {
    color: #e5847b;
    font-size: 13px;
    margin: 0 0 var(--hx-space-3);
}

/* Why the save button is disabled — blue, because this is a nudge toward a better kit, not an error. */
.bpb__gate[b-3r8rsjw2ew] {
    color: #b8d4de;
    background: rgba(111, 168, 189, 0.06);
    border: 1px solid rgba(111, 168, 189, 0.4);
    border-radius: 4px;
    padding: 0.7rem 0.9rem;
    font-size: 13px;
    line-height: 1.55;
    margin: 0 0 var(--hx-space-3);
}
.bpb__gate-link[b-3r8rsjw2ew] { color: #6fa8bd; }

.bpb__actions[b-3r8rsjw2ew] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--hx-space-3);
    justify-content: flex-end;
    margin-top: var(--hx-space-4);
}

@media (max-width: 560px) {
    .bpb__actions[b-3r8rsjw2ew] { flex-direction: column-reverse; }
    .bpb__actions .hx-btn[b-3r8rsjw2ew] { width: 100%; }
}
/* /Components/Pages/Blueprints/BlueprintView.razor.rz.scp.css */
/* Read-only Blueprint view (planning doc 31, Slice 3) — the deep-link target from a plant's
   "Blueprint: <name>" listing. Marquee headline + Space Mono labels, per the design system. */

.bpv[b-40lcmwbnj1] {
    max-width: var(--hx-max-focused);
    /* padding-block only — preserve .hx-container's padding-inline (the shorthand's `0` zeroed it). */
    padding-block: 2rem 4rem;
}

.bpv__back[b-40lcmwbnj1] {
    background: none;
    border: none;
    color: var(--hx-text-muted);
    font-family: var(--hx-font-mono);
    font-size: .8rem;
    letter-spacing: .04em;
    cursor: pointer;
    padding: 0;
    margin-bottom: var(--hx-space-6);
    transition: color var(--hx-t);
}
.bpv__back:hover[b-40lcmwbnj1] { color: var(--hx-gold); }

.bpv__eyebrow[b-40lcmwbnj1] {
    font-family: var(--hx-font-mono);
    font-size: .8rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--hx-gold);
    margin: 0 0 var(--hx-space-2);
}

.bpv__headline[b-40lcmwbnj1] {
    font-family: var(--hx-font-display);
    font-size: clamp(2.4rem, 6vw, 3.6rem);
    line-height: .95;
    letter-spacing: .01em;
    color: var(--hx-text-heading);
    margin: 0 0 var(--hx-space-3);
}

.bpv__desc[b-40lcmwbnj1] {
    font-size: 15px;
    color: var(--hx-text-muted);
    line-height: 1.55;
    margin: 0 0 var(--hx-space-6);
}

.bpv__section[b-40lcmwbnj1] {
    border-top: 1px solid var(--hx-border);
    padding-top: var(--hx-space-5);
    margin-top: var(--hx-space-6);
}

.bpv__section-title[b-40lcmwbnj1] {
    font-family: var(--hx-font-mono);
    font-size: .78rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--hx-text-caption);
    margin: 0 0 var(--hx-space-4);
}

.bpv__rows[b-40lcmwbnj1] {
    display: grid;
    grid-template-columns: minmax(0, 120px) 1fr;
    gap: var(--hx-space-3) var(--hx-space-5);
    margin: 0;
}
.bpv__rows dt[b-40lcmwbnj1] {
    font-family: var(--hx-font-mono);
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--hx-text-muted);
}
.bpv__rows dd[b-40lcmwbnj1] {
    margin: 0;
    font-size: 15px;
    color: var(--hx-text-body);
}

.bpv__list[b-40lcmwbnj1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--hx-space-2);
}
.bpv__list li[b-40lcmwbnj1] {
    font-size: 14px;
    color: var(--hx-text-body);
    line-height: 1.4;
}
.bpv__item-glyph[b-40lcmwbnj1] { margin-right: .4em; }
.bpv__item-name[b-40lcmwbnj1] { color: var(--hx-text-body); }
.bpv__item-sub[b-40lcmwbnj1]  { color: var(--hx-text-caption); margin-left: .35em; }

.bpv__loading[b-40lcmwbnj1] { color: var(--hx-text-muted); }
/* /Components/Pages/Dashboard.razor.rz.scp.css */
/* ── Greeting ──────────────────────────────────────────── */
.db-greeting[b-upc4sir9e9] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    padding-top: clamp(28px, 4vw, 44px);
    padding-bottom: 0;
}

.db-greeting__date[b-upc4sir9e9] {
    margin-bottom: 8px;
}

.db-greeting__headline[b-upc4sir9e9] {
    font-size: clamp(38px, 6vw, 58px);
    margin: 0;
}

.db-greeting__handle[b-upc4sir9e9] {
    color: var(--hx-gold);
}

.db-greeting__sub[b-upc4sir9e9] {
    font-size: 15px;
    color: var(--hx-text-caption);
    margin: 8px 0 0;
}

.db-greeting__sub strong[b-upc4sir9e9] {
    color: var(--hx-gold);
    font-weight: 600;
}

.db-greeting__actions[b-upc4sir9e9] {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

/* ── Stat strip ────────────────────────────────────────── */
.db-stats[b-upc4sir9e9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1px;
    background: rgba(255,255,255,.07);
    border: 1px solid var(--hx-border-mid);
    border-radius: var(--hx-r-sm);
    overflow: hidden;
    margin-top: clamp(24px, 3vw, 32px);
}

.db-stat[b-upc4sir9e9] {
    background: #0d0e0f;
    padding: 20px 22px;
    text-align: center;
}

.db-stat__val[b-upc4sir9e9] {
    font-family: var(--hx-font-display);
    font-size: 34px;
    color: var(--hx-text-heading);
    line-height: .9;
}

.db-stat__val--gold[b-upc4sir9e9] {
    color: var(--hx-gold);
}

.db-stat__label[b-upc4sir9e9] {
    font-family: var(--hx-font-mono);
    font-size: 10px;
    color: var(--hx-text-caption-2);
    letter-spacing: .1em;
    margin-top: 6px;
}

/* ── Body layout ───────────────────────────────────────── */
.db-body[b-upc4sir9e9] {
    display: flex;
    gap: clamp(20px, 3vw, 32px);
    flex-wrap: wrap;
    align-items: flex-start;
    padding-top: clamp(28px, 4vw, 40px);
    padding-bottom: 80px;
}

.db-main[b-upc4sir9e9] {
    flex: 1;
    min-width: 300px;
}

.db-sidebar[b-upc4sir9e9] {
    width: 320px;
    flex: 1 1 280px;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ── Section headers ───────────────────────────────────── */
.db-section-head[b-upc4sir9e9] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 18px;
}

.db-section-title[b-upc4sir9e9] {
    font-size: clamp(28px, 4vw, 38px);
    margin: 0;
    /* Section titles are gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
}

/* ── Tab filter ────────────────────────────────────────── */
.db-tabs[b-upc4sir9e9] {
    display: flex;
    gap: 8px;
}

.db-tab[b-upc4sir9e9] {
    padding: 7px 16px;
    border-radius: var(--hx-r-pill);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    background: rgba(255,255,255,.04);
    color: var(--hx-text-muted);
    font-family: var(--hx-font-body);
    transition: background var(--hx-t), color var(--hx-t);
    min-height: 36px;
}

/* Inverse of the filled-gold CTAs: the selected filter is a gold OUTLINE, so page controls read
   distinct from "main" actions (filled gold). Inset box-shadow avoids a layout shift vs the borderless off-state. */
.db-tab.is-active[b-upc4sir9e9] {
    background: transparent;
    color: var(--hx-gold);
    box-shadow: inset 0 0 0 1px rgba(232,196,108,.7);
}

.db-tab:not(.is-active):hover[b-upc4sir9e9] {
    background: rgba(255,255,255,.08);
    color: var(--hx-text-body);
}

/* ── Grows grid ────────────────────────────────────────── */
.db-grows-grid[b-upc4sir9e9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 16px;
    margin-bottom: 44px;
}

/* ── Empty state ───────────────────────────────────────── */
.db-grows-empty[b-upc4sir9e9] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 56px 24px;
    background: rgba(255,255,255,.02);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r);
    text-align: center;
}

/* Filter yielded nothing (grows exist, none match the pill) — a compact single-line notice. */
.db-grows-empty--filter[b-upc4sir9e9] { padding: 32px 24px; }
.db-grows-empty--filter .db-grows-empty__sub[b-upc4sir9e9] { margin: 0; max-width: none; }

.db-grows-empty__art[b-upc4sir9e9] {
    width: 80px;
    height: 80px;
    border-radius: var(--hx-r-sm);
    opacity: .5;
}

.db-grows-empty__title[b-upc4sir9e9] {
    font-family: var(--hx-font-display);
    font-size: 28px;
    color: var(--hx-text-heading);
    letter-spacing: .03em;
}

.db-grows-empty__sub[b-upc4sir9e9] {
    font-size: 14px;
    color: var(--hx-text-caption);
    max-width: 340px;
    margin: 0 0 18px;
    line-height: 1.55;
}

.db-grows-empty__link[b-upc4sir9e9] {
    color: var(--hx-gold);
    text-decoration: none;
}
.db-grows-empty__link:hover[b-upc4sir9e9] { text-decoration: underline; }

.db-grows-empty__actions[b-upc4sir9e9] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

/* ── Grow card ─────────────────────────────────────────── */
.db-run-card[b-upc4sir9e9] {
    display: block;
    background: rgba(255,255,255,.02);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm);
    overflow: hidden;
    color: inherit;
    text-decoration: none;
    transition: border-color var(--hx-t);
}

.db-run-card:hover[b-upc4sir9e9] {
    border-color: rgba(232,196,108,.45);
}

.db-run-card__thumb[b-upc4sir9e9] {
    position: relative;
}

.db-run-card__photo[b-upc4sir9e9] {
    aspect-ratio: 3 / 2;
}

/* Cover image variant — the run's latest plant photo fills the thumb (doc 17). */
img.db-run-card__photo[b-upc4sir9e9] {
    width: 100%;
    object-fit: cover;
    display: block;
}

/* No real cover photo (missing or a demo placeholder) — center the plant glyph, never a broken image. */
.db-run-card__photo--glyph[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    opacity: 0.5;
}

/* Status + logging pills sit in the card body (below the photo) — one row above the run name, pushed to the
   two edges (status left, logging right) to mirror the old photo-corner layout. A lone status pill stays left. */
.db-run-card__tags[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.db-run-card__status-badge[b-upc4sir9e9] {
    padding: 4px 10px;
    border-radius: var(--hx-r-pill);
    font-family: var(--hx-font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.db-run-card__status-badge.active[b-upc4sir9e9] {
    background: rgba(8,7,5,.7);
    border: 1px solid rgba(232,196,108,.5);
    color: var(--hx-gold);
}

.db-run-card__status-badge.on-floor[b-upc4sir9e9] {
    background: var(--hx-gold);
    color: var(--hx-gold-on);
}

.db-run-card__status-badge.harvested[b-upc4sir9e9] {
    background: rgba(255,255,255,.1);
    color: var(--hx-text-3);
}

/* Ended = a run that didn't make it — closed but kept. A warm "retired" red, distinct from the neutral
   harvested/complete grey. Solid enough to read on the card body (it was invisible as a photo overlay). */
.db-run-card__status-badge.ended[b-upc4sir9e9] {
    background: rgba(217,122,90,.2);
    border: 1px solid rgba(217,122,90,.55);
    color: #eaa892;
}

.db-run-card__body[b-upc4sir9e9] {
    padding: 15px 16px 16px;
}

.db-run-card__name-row[b-upc4sir9e9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.db-run-card__name[b-upc4sir9e9] {
    font-weight: 700;
    font-size: 17px;
    color: var(--hx-text-heading);
}

.db-run-card__submeta[b-upc4sir9e9] {
    font-size: 12px;
    color: var(--hx-text-caption);
    margin-top: 2px;
}

.db-run-card__score[b-upc4sir9e9] {
    text-align: right;
    flex-shrink: 0;
}

.db-run-card__score-val[b-upc4sir9e9] {
    font-family: var(--hx-font-display);
    font-size: 24px;
    color: var(--hx-gold);
    line-height: .9;
}

/* Logging tag sits beside the status badge in the body tags row; colour carries the state. */
.db-run-card__health-tag[b-upc4sir9e9] {
    padding: 4px 10px;
    border-radius: var(--hx-r-pill);
    background: rgba(8,7,5,.7);
    border: 1px solid transparent;
    font-family: var(--hx-font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}
/* Done = green (score/optimal register). */
.db-run-card__health-tag.is-logged[b-upc4sir9e9] { border-color: rgba(116,213,154,.55); color: #9fe3b6; }
/* To-do = blue "gentle nudge" register (an invitation, not a warning). */
.db-run-card__health-tag.is-todo[b-upc4sir9e9]   { border-color: rgba(74,158,255,.6);   color: #8fc2ff; }

.db-run-card__harvest-row[b-upc4sir9e9] {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.db-run-card__yield[b-upc4sir9e9] {
    padding: 6px 11px;
    background: var(--hx-fill-gold);
    color: var(--hx-gold-2);
    border-radius: 6px;
    font-family: var(--hx-font-mono);
    font-size: 11px;
}

.db-run-card__days[b-upc4sir9e9] {
    padding: 6px 11px;
    background: rgba(255,255,255,.04);
    color: var(--hx-text-caption);
    border-radius: 6px;
    font-family: var(--hx-font-mono);
    font-size: 11px;
}

.db-run-card__footer[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--hx-border);
}

/* Journal CTA = the filled-gold primary button (matches "+ Start new grow"), kept fully rounded (pill).
   Hovering anywhere on the card deepens it, since the whole tile is the link. */
.db-run-card__open[b-upc4sir9e9] {
    border-radius: var(--hx-r-pill);
    padding: .5em 1.2em;
    font-size: .75rem;
    min-height: 0;   /* release the 44px hx-btn tap-target floor so it can shrink on the card */
}
.db-run-card:hover .db-run-card__open.hx-btn-primary[b-upc4sir9e9] {
    background: var(--hx-gold-hover);
}

/* ── Activity feed ─────────────────────────────────────── */
.db-activity[b-upc4sir9e9] {
    background: rgba(255,255,255,.02);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm);
    overflow: hidden;
}

.db-activity__empty[b-upc4sir9e9] {
    padding: 28px 18px;
    font-size: 14px;
    color: var(--hx-text-faint);
    text-align: center;
}

.db-activity__row[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 15px 18px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}

.db-activity__row:last-child[b-upc4sir9e9] {
    border-bottom: none;
}

.db-activity__dot[b-upc4sir9e9] {
    width: 8px;
    height: 8px;
    border-radius: 99px;
    flex-shrink: 0;
}

.db-activity__dot.gold[b-upc4sir9e9]  { background: var(--hx-gold); }
.db-activity__dot.green[b-upc4sir9e9] { background: var(--hx-green); }
.db-activity__dot.muted[b-upc4sir9e9] { background: var(--hx-text-faint); }

.db-activity__text[b-upc4sir9e9] {
    flex: 1;
    font-size: 14px;
    color: var(--hx-text-2);
}

.db-activity__time[b-upc4sir9e9] {
    font-family: var(--hx-font-mono);
    font-size: 11px;
    color: var(--hx-text-faint);
    flex-shrink: 0;
}

/* ── Sidebar shared card ───────────────────────────────── */
.db-side-card[b-upc4sir9e9] {
    background: rgba(255,255,255,.02);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm);
    padding: 20px;
}

.db-side-card__eyebrow[b-upc4sir9e9] {
    display: block;
    margin-bottom: 10px;
    /* Card eyebrow headers: gold + bold (the mono label is thin, so bold gives it presence). */
    color: var(--hx-gold, #e8c46c);
    font-weight: 700;
}

/* ── Grower's Pass (mini) ──────────────────────────────────
   A one-line signpost to /pass, where the full Free/Premier comparison lives. The whole card is the link. */
/* Purple tint — the app's premium/special signal (shared with Cure mode, #926ec4 / rgba(146,110,196,…)).
   Sets the Grower's Pass apart from the gold Belt card above it. */
.db-pass-mini[b-upc4sir9e9] {
    display: block;
    background: linear-gradient(135deg, rgba(146,110,196,.16), rgba(146,110,196,.03));
    border: 1px solid rgba(146,110,196,.4);
    border-radius: var(--hx-r-sm);
    padding: 14px 16px;
    text-decoration: none;
    color: inherit;
    transition: border-color .18s ease, background .18s ease;
}

.db-pass-mini:hover[b-upc4sir9e9] {
    border-color: #926ec4;
    background: linear-gradient(135deg, rgba(146,110,196,.24), rgba(146,110,196,.07));
}

.db-pass-mini__head[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.db-pass-mini__eyebrow[b-upc4sir9e9] { color: #b79ae0; }

.db-pass-mini__body[b-upc4sir9e9] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.db-pass-mini__tier[b-upc4sir9e9] {
    font-size: 24px;
    line-height: 1;
}

/* Mirrors .db-belt-card__more — hx-label carries the mono/uppercase register for both minis. */
.db-pass-mini__cta[b-upc4sir9e9] { color: #b79ae0; white-space: nowrap; }

/* ── Showcase standing ─────────────────────────────────── */
.db-standing[b-upc4sir9e9] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-top: 4px;
}

.db-standing__rank[b-upc4sir9e9] {
    font-size: 54px;
    color: var(--hx-gold);
    line-height: .85;
}

.db-standing__plant[b-upc4sir9e9] {
    font-size: 13px;
    color: var(--hx-text-2);
    font-weight: 600;
}

.db-standing__count[b-upc4sir9e9] {
    font-size: 12px;
    color: var(--hx-text-caption-2);
    margin-top: 2px;
}

.db-standing__cta[b-upc4sir9e9] {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 16px;
}

.db-standing-empty[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 6px 0;
}

.db-standing-empty__dash[b-upc4sir9e9] {
    font-size: 54px;
    color: var(--hx-text-divider);
    line-height: .85;
}

.db-standing-empty__text[b-upc4sir9e9] {
    font-size: 13px;
    color: var(--hx-text-faint);
    margin: 0;
}

/* ── To Do Today ───────────────────────────────────────── */
.db-todo-head[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.db-todo-empty[b-upc4sir9e9] {
    font-size: 13px;
    color: var(--hx-text-faint);
    margin: 0;
}

.db-todo-list[b-upc4sir9e9] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.db-todo-item[b-upc4sir9e9] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 0;
    font-family: var(--hx-font-body);
    min-height: 44px;
}

/* The checkbox toggles "done" (not navigation) — a bare button. */
.db-todo-item__check[b-upc4sir9e9] {
    flex-shrink: 0;
    display: flex;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
}

/* The label + meta + ⚡ are one deep-link to the grow — the whole row is clickable. */
.db-todo-item__body[b-upc4sir9e9] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}
.db-todo-item__body:hover .db-todo-item__label[b-upc4sir9e9] { color: var(--hx-gold); }
.db-todo-item__body:hover .db-todo-item__go[b-upc4sir9e9] { transform: scale(1.15); }

.db-todo-item__go[b-upc4sir9e9] {
    flex-shrink: 0;
    color: var(--hx-gold);
    transition: transform var(--hx-t);
}

.db-todo-item__box[b-upc4sir9e9] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    border-radius: 5px;
    border: 1.5px solid rgba(232,196,108,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--hx-gold-on);
    transition: background var(--hx-t), border-color var(--hx-t);
}

.db-todo-item__box.is-done[b-upc4sir9e9] {
    background: var(--hx-gold);
    border-color: var(--hx-gold);
}

.db-todo-item__label[b-upc4sir9e9] {
    font-size: 14px;
    color: var(--hx-text-body);
    transition: color var(--hx-t);
}

.db-todo-item__label.is-done[b-upc4sir9e9] {
    color: var(--hx-text-faint);
    text-decoration: line-through;
}

.db-todo-item__meta[b-upc4sir9e9] {
    margin-top: 2px;
    color: var(--hx-text-faint);
}

/* ── Your Belt (HaxPoints · earned) — doc 25 ───────────────── */
.db-belt-card[b-upc4sir9e9] {
    display: block;
    text-decoration: none;
    color: inherit;
    background: linear-gradient(135deg, rgba(232,196,108,.16), rgba(232,196,108,.03));
    border: 1px solid rgba(232,196,108,.35);
    border-radius: var(--hx-r-sm);
    padding: 20px;
    transition: border-color var(--hx-t-slow), transform var(--hx-t-slow);
}
.db-belt-card:hover[b-upc4sir9e9] {
    border-color: var(--hx-gold);
    transform: translateY(-1px);
}
.db-belt-card__head[b-upc4sir9e9] { margin-bottom: 12px; }
.db-belt-card__belt[b-upc4sir9e9] { display: flex; align-items: center; gap: 10px; }
.db-belt-card__chip[b-upc4sir9e9] { width: 34px; height: 10px; border-radius: 3px; border: 1px solid rgba(255,255,255,.25); flex-shrink: 0; }
.db-belt-card__name[b-upc4sir9e9] { font-size: 30px; line-height: 1; }
.db-belt-card__pts[b-upc4sir9e9] { display: flex; align-items: baseline; gap: 8px; margin-top: 12px; }
.db-belt-card__pts-val[b-upc4sir9e9] { font-family: var(--hx-font-display); font-size: 30px; color: var(--hx-gold); line-height: 1; }
.db-belt-card__pts-unit[b-upc4sir9e9] { font-size: 12px; color: var(--hx-text-caption-2); }
.db-belt-card__bar-track[b-upc4sir9e9] { height: 8px; border-radius: 99px; background: rgba(0,0,0,.3); overflow: hidden; margin: 12px 0 8px; }
.db-belt-card__bar-fill[b-upc4sir9e9] { height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--hx-gold-3, #b8912f), var(--hx-gold)); transition: width var(--hx-t-slow); }
/* The progress line carries the deep-link CTA on its right (the ladder + "earned only" foot are gone). */
.db-belt-card__next[b-upc4sir9e9] {
    color: var(--hx-text-caption-2);
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
}
.db-belt-card__next strong[b-upc4sir9e9] { color: var(--hx-gold); }
.db-belt-card__next--black[b-upc4sir9e9] { color: var(--hx-gold); }
.db-belt-card__more[b-upc4sir9e9] { color: var(--hx-gold); white-space: nowrap; }
.db-belt-card__chip--white[b-upc4sir9e9]  { background: #f2ecda; }
.db-belt-card__chip--yellow[b-upc4sir9e9] { background: #e8c46c; }
.db-belt-card__chip--orange[b-upc4sir9e9] { background: #e0863c; }
.db-belt-card__chip--green[b-upc4sir9e9]  { background: #6cbf7a; }
.db-belt-card__chip--blue[b-upc4sir9e9]   { background: #6ba8d8; }
.db-belt-card__chip--brown[b-upc4sir9e9]  { background: #9c6b3f; }
.db-belt-card__chip--black[b-upc4sir9e9]  { background: #2b2b2b; }
/* /Components/Pages/GrowBelt/GrowBelt.razor.rz.scp.css */
/* Grow Belt — the HaxPoints ledger surface (planning doc 25 §6b). */

.gb[b-5f861ykgil] { padding-block: 24px 64px; max-width: 860px; }

.gb__back[b-5f861ykgil] {
    display: inline-block;
    color: var(--hx-text-caption-2);
    text-decoration: none;
    margin-bottom: 20px;
    transition: color var(--hx-t-slow);
}
.gb__back:hover[b-5f861ykgil] { color: var(--hx-gold); }

.gb__loading[b-5f861ykgil] { color: var(--hx-text-caption-2); }

/* ── HERO ─────────────────────────────────────────────────── */
.gb-hero[b-5f861ykgil] {
    background: linear-gradient(135deg, rgba(232,196,108,.16), rgba(232,196,108,.03));
    border: 1px solid rgba(232,196,108,.35);
    border-radius: var(--hx-r-md, 14px);
    padding: 28px;
    margin-bottom: 28px;
}
.gb-hero__id[b-5f861ykgil] { display: flex; align-items: center; gap: 16px; }
.gb-hero__chip[b-5f861ykgil] {
    width: 56px; height: 16px; border-radius: 4px;
    border: 1px solid rgba(255,255,255,.25); flex-shrink: 0;
}

/* ── Belt colors — the hero chip and the ladder dot share one palette ── */
.gb-hero__chip--white[b-5f861ykgil],  .gb-climb__dot--white[b-5f861ykgil]  { background: #ece7d6; }
.gb-hero__chip--yellow[b-5f861ykgil], .gb-climb__dot--yellow[b-5f861ykgil] { background: #e9cf4e; }
.gb-hero__chip--orange[b-5f861ykgil], .gb-climb__dot--orange[b-5f861ykgil] { background: #e08a3c; }
.gb-hero__chip--green[b-5f861ykgil],  .gb-climb__dot--green[b-5f861ykgil]  { background: #52a95f; }
.gb-hero__chip--blue[b-5f861ykgil],   .gb-climb__dot--blue[b-5f861ykgil]   { background: #4f83d1; }
.gb-hero__chip--brown[b-5f861ykgil],  .gb-climb__dot--brown[b-5f861ykgil]  { background: #7d5432; }
/* Black needs a lighter border to read on the dark surface. */
.gb-hero__chip--black[b-5f861ykgil],  .gb-climb__dot--black[b-5f861ykgil]  { background: #15130f; border-color: rgba(255,255,255,.4); }
.gb-hero__eyebrow[b-5f861ykgil] { color: var(--hx-gold); display: block; }
.gb-hero__name[b-5f861ykgil] { font-size: 44px; line-height: 1; margin-top: 4px; }

.gb-hero__pts[b-5f861ykgil] { display: flex; align-items: baseline; gap: 10px; margin-top: 22px; }
.gb-hero__pts-val[b-5f861ykgil] {
    font-family: var(--hx-font-display);
    font-size: 52px; line-height: 1; color: var(--hx-gold);
}
.gb-hero__pts-unit[b-5f861ykgil] { color: var(--hx-text-caption-2); }

.gb-hero__bar-track[b-5f861ykgil] {
    height: 10px; border-radius: 99px;
    background: rgba(0,0,0,.3); overflow: hidden; margin: 18px 0 10px;
}
.gb-hero__bar-fill[b-5f861ykgil] {
    height: 100%; border-radius: 99px;
    background: linear-gradient(90deg, var(--hx-gold-3, #b8912f), var(--hx-gold));
    transition: width var(--hx-t-slow);
}
/* Small inline swatch beside the "…to <Next> Belt" label — colour comes from the shared
   gb-hero__chip--<belt> rules; this just sizes it for inline use. */
.gb-hero__next-chip[b-5f861ykgil] {
    display: inline-block; width: 16px; height: 10px; border-radius: 3px;
    border: 1px solid rgba(255,255,255,.25); vertical-align: middle; margin: 0 5px 2px;
}
.gb-hero__next[b-5f861ykgil] { color: var(--hx-text-caption-2); }
.gb-hero__next strong[b-5f861ykgil] { color: var(--hx-gold); }
.gb-hero__next--black[b-5f861ykgil] { color: var(--hx-gold); }

/* ── BLOCKS ───────────────────────────────────────────────── */
.gb-block[b-5f861ykgil] { margin-bottom: 32px; }
.gb-block__title[b-5f861ykgil] {
    color: var(--hx-gold);
    font-size: 13px; letter-spacing: .12em;
    padding-bottom: 10px; margin-bottom: 16px;
    border-bottom: 1px solid var(--hx-border);
}

/* ── THE CLIMB (ladder) ───────────────────────────────────── */
.gb-climb[b-5f861ykgil] { list-style: none; margin: 0; padding: 0; }
.gb-climb__rung[b-5f861ykgil] {
    display: flex; align-items: center; gap: 12px;
    padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.04);
}
.gb-climb__rung:last-child[b-5f861ykgil] { border-bottom: none; }
.gb-climb__dot[b-5f861ykgil] {
    width: 22px; height: 8px; border-radius: 3px;
    border: 1px solid rgba(255,255,255,.25); flex-shrink: 0;
}
.gb-climb__name[b-5f861ykgil] {
    font-family: var(--hx-font-mono);
    text-transform: uppercase; font-size: 12px; letter-spacing: .06em;
    color: var(--hx-text-faint);
}
.gb-climb__floor[b-5f861ykgil] { margin-left: auto; color: var(--hx-text-faint); }
.gb-climb__here[b-5f861ykgil] {
    color: var(--hx-gold); margin-left: 12px;
    background: rgba(232,196,108,.12);
    border: 1px solid var(--hx-gold);
    border-radius: 99px; padding: 2px 8px;
}
.gb-climb__rung.is-done .gb-climb__name[b-5f861ykgil] { color: var(--hx-text-caption); }
.gb-climb__rung.is-done .gb-climb__dot[b-5f861ykgil] { opacity: .75; }
.gb-climb__rung.is-current .gb-climb__name[b-5f861ykgil] { color: var(--hx-text-heading); font-weight: 700; }
.gb-climb__rung.is-locked[b-5f861ykgil] { opacity: .5; }
.gb-climb__note[b-5f861ykgil] {
    margin-top: 14px; color: var(--hx-text-caption-2);
    line-height: 1.5; text-transform: none; letter-spacing: 0;
}

/* ── PILLARS ──────────────────────────────────────────────── */
.gb-pillars[b-5f861ykgil] {
    display: grid; gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.gb-pillar[b-5f861ykgil] {
    background: var(--hx-surface-2);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm, 10px);
    padding: 14px;
}
.gb-pillar.is-empty[b-5f861ykgil] { opacity: .55; }
.gb-pillar__head[b-5f861ykgil] {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
}
.gb-pillar__name[b-5f861ykgil] {
    font-family: var(--hx-font-mono); font-size: 11px;
    text-transform: uppercase; letter-spacing: .05em; color: var(--hx-text-caption);
}
.gb-pillar__pts[b-5f861ykgil] {
    font-family: var(--hx-font-display); font-size: 22px;
    color: var(--hx-text-heading); line-height: 1;
}
.gb-pillar__bar-track[b-5f861ykgil] {
    height: 5px; border-radius: 99px; background: rgba(0,0,0,.3);
    overflow: hidden; margin: 10px 0 8px;
}
.gb-pillar__bar-fill[b-5f861ykgil] { height: 100%; border-radius: 99px; background: var(--pillar-color, var(--hx-gold)); }
.gb-pillar__count[b-5f861ykgil] { color: var(--hx-text-faint); }

/* Pillar accent colors — foliage/earth/stage palette (reference-svg-palette). */
.gb-pillar--milestones[b-5f861ykgil]  { --pillar-color: #e8c46c; }
.gb-pillar--growing[b-5f861ykgil]     { --pillar-color: #6cbf7a; }
.gb-pillar--showcase[b-5f861ykgil]    { --pillar-color: #d87a9c; }
.gb-pillar--community[b-5f861ykgil]   { --pillar-color: #6ba8d8; }
.gb-pillar--consistency[b-5f861ykgil] { --pillar-color: #c98a4b; }

/* ── THE RECORD (ledger) ──────────────────────────────────── */
.gb-empty[b-5f861ykgil] {
    background: var(--hx-surface-2);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm, 10px);
    padding: 28px; text-align: center;
}
.gb-empty__lead[b-5f861ykgil] { color: var(--hx-text-heading); font-size: 17px; margin-bottom: 6px; }
.gb-empty__sub[b-5f861ykgil] { color: var(--hx-text-caption-2); }

.gb-day[b-5f861ykgil] { margin-bottom: 20px; }
.gb-day__date[b-5f861ykgil] {
    color: var(--hx-text-faint); margin-bottom: 8px;
}
.gb-day__list[b-5f861ykgil] { list-style: none; margin: 0; padding: 0; }

.gb-entry[b-5f861ykgil] {
    display: flex; align-items: center; gap: 14px;
    padding: 12px 14px;
    background: var(--hx-surface-2);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm, 10px);
    margin-bottom: 8px;
}
.gb-entry__glyph[b-5f861ykgil] {
    width: 10px; height: 10px; border-radius: 99px; flex-shrink: 0;
    background: var(--pillar-color, var(--hx-gold));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--pillar-color, var(--hx-gold)) 18%, transparent);
}
.gb-entry__glyph--milestones[b-5f861ykgil]  { --pillar-color: #e8c46c; }
.gb-entry__glyph--growing[b-5f861ykgil]     { --pillar-color: #6cbf7a; }
.gb-entry__glyph--showcase[b-5f861ykgil]    { --pillar-color: #d87a9c; }
.gb-entry__glyph--community[b-5f861ykgil]   { --pillar-color: #6ba8d8; }
.gb-entry__glyph--consistency[b-5f861ykgil] { --pillar-color: #c98a4b; }

.gb-entry__body[b-5f861ykgil] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gb-entry__label[b-5f861ykgil] { color: var(--hx-text-heading); font-weight: 600; }
.gb-entry__blurb[b-5f861ykgil] { color: var(--hx-text-caption-2); font-size: 13px; }
.gb-entry__pts[b-5f861ykgil] {
    margin-left: auto; flex-shrink: 0;
    font-family: var(--hx-font-display); font-size: 22px;
    color: var(--hx-gold); line-height: 1;
}

@media (max-width: 560px) {
    .gb-hero[b-5f861ykgil] { padding: 20px; }
    .gb-hero__name[b-5f861ykgil] { font-size: 34px; }
    .gb-hero__pts-val[b-5f861ykgil] { font-size: 42px; }
    .gb-entry__blurb[b-5f861ykgil] { display: none; }
}
/* /Components/Pages/HarvestCure/HarvestCure.razor.rz.scp.css */
/* Harvest & Cure (planning doc 26). Gold = grow time; PURPLE = cure time (the mode signal). */

.hc[b-gq09s43h86] { padding-block: 24px 64px; max-width: 900px; }
.hc__loading[b-gq09s43h86] { color: var(--hx-text-caption-2); }
.hc__back[b-gq09s43h86] {
    display: inline-block; color: var(--hx-text-caption-2);
    text-decoration: none; margin-bottom: 20px; transition: color var(--hx-t-slow);
}
.hc__back:hover[b-gq09s43h86] { color: var(--hx-gold); }

.hc__notyet[b-gq09s43h86] { text-align: center; padding: 40px 0; }
.hc__notyet p[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: 12px 0 20px; }

/* ── Header ── */
.hc__head[b-gq09s43h86] { margin-bottom: 16px; }
.hc__eyebrow[b-gq09s43h86] { color: var(--hx-gold); display: block; }
.hc__title[b-gq09s43h86] { font-size: 40px; line-height: 1; margin-top: 4px; }
.hc__plant-eyebrow[b-gq09s43h86] { display: flex; align-items: center; gap: 7px; margin-top: 8px; color: var(--hx-text-caption); font-family: var(--hx-font-mono); font-size: 12px; }
.hc__plant-dot[b-gq09s43h86] { width: 8px; height: 8px; border-radius: 99px; background: #6cbf7a; }

/* ── Per-plant selector — the standard Plant card (matches Run Journal) ── */
.hc__plantsel-lead[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: 0 0 12px; font-size: 14px; }
.hc__plantcards[b-gq09s43h86] { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-bottom: 26px; }
.hc__plantcard[b-gq09s43h86] {
    display: flex; align-items: center; gap: 14px; width: 100%; cursor: pointer;
    text-align: left; font: inherit; color: inherit;
    background: var(--hx-surface-1); border: 1px solid var(--hx-border); border-radius: 10px; padding: 15px 18px;
    transition: border-color var(--hx-t-slow), background var(--hx-t-slow), box-shadow var(--hx-t-slow), transform var(--hx-t-slow);
}
.hc__plantcard:hover:not(:disabled)[b-gq09s43h86] { border-color: var(--hx-gold); transform: translateY(-1px); }
.hc__plantcard.is-selected[b-gq09s43h86] { border-color: var(--hx-gold); background: rgba(232,196,108,.08); box-shadow: inset 0 0 0 1px rgba(232,196,108,.4); }
.hc__plantcard.is-locked[b-gq09s43h86] { opacity: .5; cursor: not-allowed; }
.hc__plantcard-info[b-gq09s43h86] { flex: 1; min-width: 0; }
.hc__plantcard-name[b-gq09s43h86] { font-weight: 600; font-size: 17px; color: var(--hx-text-heading); }
.hc__plantcard-stage[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--hx-gold); margin-top: 3px; }
.hc__plantcard-strain[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 12px; color: var(--hx-text-caption-2); margin-top: 3px; }
.hc__plantcard-score[b-gq09s43h86] { flex-shrink: 0; }

/* ── Stage timeline ── */
.hc__timeline[b-gq09s43h86] {
    display: flex; gap: 8px; list-style: none; margin: 0 0 24px; padding: 0;
    flex-wrap: wrap;
}
.hc__tl[b-gq09s43h86] {
    flex: 1; min-width: 120px; display: flex; flex-direction: column; gap: 3px;
    font-family: var(--hx-font-mono); font-size: 11px; letter-spacing: .05em; text-transform: uppercase;
    color: var(--hx-text-faint); padding: 12px 14px;
    border: 1px solid var(--hx-border); border-radius: var(--hx-r-sm, 10px); background: var(--hx-surface-2);
}
.hc__tl-mark[b-gq09s43h86] { font-size: 13px; }
.hc__tl-sub[b-gq09s43h86] { color: var(--hx-text-caption-2); font-size: 10px; }
/* A completed phase KEEPS its purple tint (operator, 2026-08-02) — the lifecycle colour marks "this happened",
   so a finished stage shouldn't fade back to an untouched-looking card. Slightly softer than the active one. */
.hc__tl.is-done[b-gq09s43h86] { color: var(--hx-text-heading); border-color: rgba(146,110,196,.5); background: rgba(146,110,196,.09); }
.hc__tl.is-done .hc__tl-mark[b-gq09s43h86] { color: #b48ee0; }
/* The ACTIVE phase keeps the purple field but takes a GOLD border — with every completed stage now tinted,
   purple alone no longer says "you are here". Gold is the app's focus/brand accent. */
.hc__tl.is-now[b-gq09s43h86] { color: var(--hx-text-heading); border-color: var(--hx-gold, #e8c46c); background: rgba(146,110,196,.16); }
.hc__tl.is-now .hc__tl-mark[b-gq09s43h86] { color: #b48ee0; }

/* ── Stats ── */
.hc__stats[b-gq09s43h86] {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 12px; margin-bottom: 28px;
}
.hc__stat[b-gq09s43h86] {
    background: var(--hx-surface-2); border: 1px solid var(--hx-border);
    border-radius: var(--hx-r-sm, 10px); padding: 16px; text-align: center;
}
.hc__stat-val[b-gq09s43h86] { display: block; font-family: var(--hx-font-display); font-size: 30px; color: var(--hx-text-heading); line-height: 1; }
.hc__stat-unit[b-gq09s43h86] { font-size: 15px; color: var(--hx-text-caption-2); }
.hc__stat-label[b-gq09s43h86] { color: var(--hx-text-faint); margin-top: 6px; display: block; }

/* ── Blocks ── */
.hc__block[b-gq09s43h86] { margin-bottom: 30px; }
.hc__block-title[b-gq09s43h86] { color: var(--hx-gold); font-size: 13px; letter-spacing: .12em; }

/* ── Cure progress ── */
.hc__cure-head[b-gq09s43h86] { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.hc__cure-day[b-gq09s43h86] { color: var(--hx-text-caption-2); }
.hc__cure-track[b-gq09s43h86] { height: 10px; border-radius: 99px; background: rgba(0,0,0,.3); overflow: hidden; }
.hc__cure-fill[b-gq09s43h86] { height: 100%; border-radius: 99px; background: linear-gradient(90deg, #6a4b96, #b48ee0); transition: width var(--hx-t-slow); }
.hc__cure-note[b-gq09s43h86] { color: var(--hx-text-caption-2); font-size: 13px; margin-top: 10px; }

/* ── The Curing Shelf ── */
.hc__shelf-head[b-gq09s43h86], .hc__cure-head[b-gq09s43h86] { display: flex; justify-content: space-between; align-items: center; }
.hc__block-title[b-gq09s43h86] { padding-bottom: 10px; border-bottom: 1px solid var(--hx-border); display: block; margin-bottom: 16px; flex: 1; }
.hc__shelf-head .hc__block-title[b-gq09s43h86], .hc__cure-head .hc__block-title[b-gq09s43h86] { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.hc__shelf-head[b-gq09s43h86] { margin-bottom: 16px; border-bottom: 1px solid var(--hx-border); padding-bottom: 10px; }

.hc__addjar[b-gq09s43h86] { background: none; border: 1px solid var(--hx-gold); color: var(--hx-gold); border-radius: 99px; padding: 5px 12px; font-family: var(--hx-font-mono); font-size: 11px; cursor: pointer; }
.hc__addjar:hover[b-gq09s43h86] { background: rgba(232,196,108,.12); }
.hc__addjar-row[b-gq09s43h86] { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.hc__shelf-empty[b-gq09s43h86] { color: var(--hx-text-caption-2); }
.hc__shelf-ref[b-gq09s43h86] { color: var(--hx-text-faint); margin: -6px 0 14px; }

.hc__shelf[b-gq09s43h86] { position: relative; padding: 10px 0 0; }
.hc__shelf-jars[b-gq09s43h86] { display: flex; flex-wrap: wrap; gap: 22px; padding: 0 8px 16px; }
.hc__shelf-board[b-gq09s43h86] { height: 10px; border-radius: 3px; background: linear-gradient(180deg, #6b4a2e, #4a3220); box-shadow: 0 6px 14px rgba(0,0,0,.35); }

.hc__jar[b-gq09s43h86] {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    background: none; border: none; cursor: pointer; padding: 4px; width: 89px;
}
.hc__jar-glyph[b-gq09s43h86] {
    width: 53px; height: 67px; border-radius: 10px 10px 12px 12px;
    border: 2px solid var(--jar-color, #8a836f);
    background: linear-gradient(180deg, color-mix(in srgb, var(--jar-color, #8a836f) 22%, transparent), color-mix(in srgb, var(--jar-color, #8a836f) 8%, transparent));
    position: relative; transition: transform var(--hx-t-slow), box-shadow var(--hx-t-slow);
}
.hc__jar-glyph[b-gq09s43h86]::before { /* lid */
    content: ""; position: absolute; top: -7px; left: 50%; transform: translateX(-50%);
    width: 41px; height: 8px; border-radius: 3px; background: var(--jar-color, #8a836f);
}
.hc__jar:hover .hc__jar-glyph[b-gq09s43h86] { transform: translateY(-3px); box-shadow: 0 6px 16px color-mix(in srgb, var(--jar-color, #8a836f) 30%, transparent); }
.hc__jar.is-selected .hc__jar-glyph[b-gq09s43h86] { box-shadow: 0 0 0 3px color-mix(in srgb, var(--jar-color, #8a836f) 45%, transparent); }
.hc__jar-name[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 12px; color: var(--hx-text-caption); text-align: center; line-height: 1.2; }
.hc__jar-rh[b-gq09s43h86] { font-family: var(--hx-font-display); font-size: 18px; color: var(--jar-color, var(--hx-text-heading)); }
.hc__jar-temp[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 12px; color: var(--hx-text-caption-2); }

.is-perfect[b-gq09s43h86] { --jar-color: #74d59a; }
.is-moist[b-gq09s43h86]   { --jar-color: #e8c46c; }
.is-dry[b-gq09s43h86]     { --jar-color: #b0a890; }
.is-unknown[b-gq09s43h86] { --jar-color: #8a836f; }

/* ── Jar detail ── */
.hc__jardetail[b-gq09s43h86] { margin-top: 16px; padding: 16px; background: var(--hx-surface-2); border: 1px solid var(--hx-border); border-radius: var(--hx-r-sm, 10px); }
.hc__jardetail-head[b-gq09s43h86] { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.hc__jardetail-name[b-gq09s43h86] { font-family: var(--hx-font-display); font-size: 20px; color: var(--hx-text-heading); }
.hc__jardetail-meta[b-gq09s43h86] { color: var(--hx-text-caption-2); }
.hc__jardetail-close[b-gq09s43h86] { margin-left: auto; background: none; border: none; color: var(--hx-text-faint); cursor: pointer; font-size: 15px; }

/* Cure Zone — two axes (RH + temp), each: ideal band · min–max swing · current marker */
.hc__zone[b-gq09s43h86] { margin-bottom: 16px; padding: 12px 14px; background: rgba(146,110,196,.05); border: 1px solid rgba(146,110,196,.18); border-radius: var(--hx-r-sm, 10px); }
.hc__zone-head[b-gq09s43h86] { color: var(--hx-text-caption-2); margin-bottom: 10px; }
.hc__axis[b-gq09s43h86] { display: flex; align-items: center; gap: 10px; margin: 9px 0; }
.hc__axis-name[b-gq09s43h86] { width: 36px; color: var(--hx-text-faint); flex-shrink: 0; }
.hc__bar-end[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 10px; color: var(--hx-text-faint); flex-shrink: 0; }
.hc__bar-track[b-gq09s43h86] { position: relative; flex: 1; min-width: 120px; height: 10px; border-radius: 99px; background: rgba(0,0,0,.3); }
.hc__bar-band[b-gq09s43h86] { position: absolute; top: 0; bottom: 0; background: rgba(116,213,154,.25); border-radius: 2px; }   /* the ideal band */
.hc__bar-range[b-gq09s43h86] { position: absolute; top: 50%; height: 4px; transform: translateY(-50%); background: rgba(255,255,255,.45); border-radius: 99px; }  /* the swing */
.hc__bar-marker[b-gq09s43h86] { position: absolute; top: 50%; width: 12px; height: 12px; border-radius: 99px; transform: translate(-50%, -50%); background: var(--jar-color, #fff); border: 2px solid var(--hx-bg); z-index: 1; }  /* current */
.hc__bar-cur[b-gq09s43h86] { width: 54px; text-align: right; font-family: var(--hx-font-mono); font-size: 12px; color: var(--jar-color, var(--hx-text-caption)); flex-shrink: 0; }

.hc__jaractions[b-gq09s43h86] { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.hc__jarhint[b-gq09s43h86] { color: var(--hx-text-faint); margin: 8px 0 0; }
.hc__rhinput[b-gq09s43h86] { width: 90px; }
.hc__jarlog[b-gq09s43h86] { list-style: none; margin: 14px 0 0; padding: 0; }
.hc__jarlog li[b-gq09s43h86] { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 13px; color: var(--hx-text-caption); }
.hc__jarlog-time[b-gq09s43h86] { color: var(--hx-text-faint); font-family: var(--hx-font-mono); font-size: 11px; }

/* ── Cure heat map (PURPLE) ── */
.hc__heatmap[b-gq09s43h86] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.hc__cell[b-gq09s43h86] { width: 20px; height: 20px; border-radius: 4px; background: rgba(146,110,196,.10); border: 1px solid rgba(146,110,196,.15); }
.hc__cell--l0[b-gq09s43h86] { background: rgba(146,110,196,.10); }
.hc__cell--l1[b-gq09s43h86] { background: rgba(146,110,196,.45); }
.hc__cell--l3[b-gq09s43h86] { background: #926ec4; }
.hc__cell.is-today[b-gq09s43h86] { box-shadow: 0 0 0 2px var(--hx-gold); }
.hc__heatmap-key[b-gq09s43h86] { display: flex; gap: 16px; flex-wrap: wrap; color: var(--hx-text-faint); align-items: center; }
.hc__heatmap-key span[b-gq09s43h86] { display: inline-flex; align-items: center; gap: 5px; }
.hc__heatmap-key .hc__cell[b-gq09s43h86] { width: 12px; height: 12px; }

/* ── Burp schedule ── */
.hc__sched[b-gq09s43h86] { list-style: none; margin: 0; padding: 0; }
.hc__sched-row[b-gq09s43h86] { display: grid; grid-template-columns: 20px 1fr; gap: 4px 10px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.05); color: var(--hx-text-faint); }
.hc__sched-row:last-child[b-gq09s43h86] { border-bottom: none; }
.hc__sched-mark[b-gq09s43h86] { grid-row: span 2; color: var(--hx-text-faint); }
.hc__sched-label[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; }
.hc__sched-guide[b-gq09s43h86] { font-size: 13px; color: var(--hx-text-caption-2); }
.hc__sched-row.is-now[b-gq09s43h86] { color: var(--hx-text-heading); }
.hc__sched-row.is-now .hc__sched-mark[b-gq09s43h86], .hc__sched-row.is-now .hc__sched-label[b-gq09s43h86] { color: #b48ee0; }
.hc__sched-row.is-done .hc__sched-mark[b-gq09s43h86] { color: #74d59a; }

/* ── Dry log form ── */
.hc__form[b-gq09s43h86] { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.hc__field[b-gq09s43h86] { display: flex; flex-direction: column; gap: 5px; }
.hc__field label[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--hx-text-caption); }
.hc__optional[b-gq09s43h86] { color: var(--hx-text-faint); text-transform: none; }
.hc__form-actions[b-gq09s43h86] { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.hc__saved[b-gq09s43h86] { color: #74d59a; }

/* ── Cure complete ── */
.hc__complete[b-gq09s43h86] {
    text-align: center; padding: 28px; margin-bottom: 28px;
    background: linear-gradient(135deg, rgba(146,110,196,.18), rgba(146,110,196,.04));
    border: 1px solid rgba(146,110,196,.5); border-radius: var(--hx-r-md, 14px);
}
.hc__complete-crown[b-gq09s43h86] { font-size: 34px; color: var(--hx-gold); }
.hc__complete p[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: 8px 0 18px; }
.hc__complete strong[b-gq09s43h86] { color: var(--hx-gold); }

/* ── Mark done ── */
.hc__markdone[b-gq09s43h86] { text-align: center; padding: 24px; border: 1px dashed var(--hx-border); border-radius: var(--hx-r-sm, 10px); }
.hc__markdone-lead[b-gq09s43h86] { font-family: var(--hx-font-display); font-size: 22px; color: var(--hx-text-heading); }
.hc__markdone-sub[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: 6px 0 16px; }
.hc__markdone-hint[b-gq09s43h86] { color: var(--hx-text-faint); margin-top: 10px; }

/* ── Drying phase ── */
.hc__phase-lead[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: -6px 0 16px; }
.hc__hint[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 10px; color: var(--hx-text-faint); }
.hc__weigh[b-gq09s43h86] { margin-top: -12px; }
.hc__weigh-row[b-gq09s43h86] { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 8px; align-items: flex-end; }
.hc__weigh-input[b-gq09s43h86] { max-width: 240px; }
.hc__weigh-preview[b-gq09s43h86] { margin-top: 12px; color: var(--hx-text-caption-2); }
.hc__weigh-preview strong[b-gq09s43h86] { color: var(--hx-gold); }

/* ── Labelled field inside an action row (the weigh row, the mark-complete row). A placeholder disappears the
   moment you type and can't say "optional"; a date input can't carry one at all. Rows bottom-align so the
   labels ride above and the button still sits on the inputs' baseline. ── */
/* flex-basis + min-width:0 so the fields SHARE the row and shrink together. Without it each one sizes to its
   control's intrinsic width — a native date picker and a <select> resolve differently — and with
   align-items:flex-end their labels then sit at different heights, which is what made the row look broken on
   a phone (operator, 2026-08-07). */
.hc__rowfield[b-gq09s43h86] { display: flex; flex-direction: column; gap: 4px; text-align: left; flex: 1 1 150px; min-width: 0; max-width: 240px; }
.hc__rowfield .hx-label[b-gq09s43h86] { color: var(--hx-text-faint); }
.hc__rowfield .hx-input[b-gq09s43h86] { width: 100%; }
.hc__markdone-row[b-gq09s43h86] { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; align-items: flex-end; }
.hc__burpdate[b-gq09s43h86] { width: 150px; color: var(--hx-text-caption); }
/* Explains the one field whose meaning isn't self-evident from its label. */
.hc__weigh-hint[b-gq09s43h86] { color: var(--hx-text-faint); font-size: 13px; margin: 12px auto 0; max-width: 60ch; }

/* ── Weekly heat-map cells (clickable, like the grow heat map) ── */
.hc__wkcell[b-gq09s43h86] { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; background: none; border: none; padding: 0; cursor: pointer; }
.hc__wkcell .hc__cell[b-gq09s43h86] { width: 44px; height: 44px; border-radius: 8px; transition: box-shadow var(--hx-t-slow), transform var(--hx-t-slow); }
.hc__wkcell:hover:not(:disabled) .hc__cell[b-gq09s43h86] { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(146,110,196,.6); }
.hc__wkcell-label[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 11px; color: var(--hx-text-faint); }
.hc__wkcell.is-now .hc__cell[b-gq09s43h86] { box-shadow: 0 0 0 2px var(--hx-gold); }
.hc__wkcell.is-now .hc__wkcell-label[b-gq09s43h86] { color: var(--hx-gold); }
.hc__wkcell.is-selected .hc__cell[b-gq09s43h86] { box-shadow: 0 0 0 2px #b48ee0; }
.hc__wkcell.is-next[b-gq09s43h86] { cursor: default; opacity: .4; }              /* on-deck — dimmed, not clickable */
.hc__wkcell.is-next .hc__cell[b-gq09s43h86] { border-style: dashed; }

/* Selected-week detail (mirrors clicking a day in the grow heat map) */
.hc__weekdetail[b-gq09s43h86] { margin-top: 14px; padding: 14px 16px; background: rgba(146,110,196,.06); border: 1px solid rgba(146,110,196,.2); border-radius: var(--hx-r-sm, 10px); }
.hc__weekdetail-head[b-gq09s43h86] { color: #b48ee0; margin-bottom: 8px; }
.hc__weekdetail-empty[b-gq09s43h86] { color: var(--hx-text-caption-2); margin: 0; }
.hc__weekdetail-list[b-gq09s43h86] { list-style: none; margin: 0; padding: 0; }
.hc__weekdetail-list li[b-gq09s43h86] { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid rgba(146,110,196,.1); color: var(--hx-text-caption); font-size: 14px; }
.hc__weekdetail-list li:last-child[b-gq09s43h86] { border-bottom: none; }
.hc__weekdetail-rh[b-gq09s43h86] { color: var(--hx-text-heading); font-family: var(--hx-font-mono); font-size: 12px; }

/* ── Weekly cure log ── */
.hc__weeklog[b-gq09s43h86] { list-style: none; margin: 16px 0 0; padding: 0; }
.hc__weeklog-row[b-gq09s43h86] { display: flex; align-items: baseline; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(146,110,196,.12); }
.hc__weeklog-row:last-child[b-gq09s43h86] { border-bottom: none; }
.hc__weeklog-wk[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #b48ee0; min-width: 64px; }
.hc__weeklog-detail[b-gq09s43h86] { color: var(--hx-text-caption); font-size: 14px; }

/* ── Dry summary ── */
.hc__drylist[b-gq09s43h86] { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.hc__drylist dt[b-gq09s43h86] { font-family: var(--hx-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--hx-text-faint); margin-bottom: 3px; }
.hc__drylist dd[b-gq09s43h86] { margin: 0; color: var(--hx-text-heading); }

@media (max-width: 560px) {
    .hc__title[b-gq09s43h86] { font-size: 30px; }
    .hc__stat-val[b-gq09s43h86] { font-size: 24px; }
    .hc__wkcell .hc__cell[b-gq09s43h86] { width: 38px; height: 38px; }

    /* One control per line on a phone. Side-by-side labelled fields need ~150px each plus the gap; below
       that they wrap into a cramped, misaligned row rather than degrading gracefully. Stacking is the
       honest answer at this width — these are the two rows that COMMIT something (start the cure, close
       it), so they should be unhurried and full-thumb-width, not squeezed. */
    .hc__weigh-row[b-gq09s43h86],
    .hc__markdone-row[b-gq09s43h86] {
        flex-direction: column;
        align-items: stretch;
    }
    /* flex: 0 0 auto is load-bearing, not tidying. The row-width basis above (`flex: 1 1 150px`) is measured
       along the MAIN axis — so the moment the container stacks, that 150px becomes each field's HEIGHT and
       flex-grow stretches it further, spacing the controls hugely apart. Height must come from the content. */
    .hc__weigh-row .hc__rowfield[b-gq09s43h86],
    .hc__markdone-row .hc__rowfield[b-gq09s43h86] {
        flex: 0 0 auto;
        max-width: none;
        width: 100%;
    }
    .hc__weigh-input[b-gq09s43h86] { max-width: none; width: 100%; }
    .hc__weigh-row .hx-btn[b-gq09s43h86],
    .hc__markdone-row .hx-btn[b-gq09s43h86] { width: 100%; }
}
/* /Components/Pages/Insights.razor.rz.scp.css */
/* ── Insights — ins__ namespace (planning doc 30) ─────────────
   Existing app.css tokens only. Gold stays the accent; no new palette, and none of the reserved
   tints (purple = premium/cure, blue = privacy) appear here. */

.ins[b-92xcoxen19] { padding-bottom: 4rem; }

/* ⚠ Vertical padding ONLY. This element also carries .hx-container for its gutters, and scoped CSS
   out-specifies app.css — so a `padding:` shorthand here silently zeroes the container's left/right and
   the headline goes flush to the screen edge on mobile. Never use the shorthand on an element that wears
   a layout utility: the sides you didn't mention are the ones it overwrites. */
.ins__head[b-92xcoxen19] {
    padding-top: 2.25rem;
    padding-bottom: 1.5rem;
}

.ins__headline[b-92xcoxen19] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.2rem, 6vw, 3.2rem);
    letter-spacing: 0.06em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0;
}

.ins__sub[b-92xcoxen19] {
    font-size: 0.95rem;
    color: var(--hx-text-caption, #9a927e);
    margin: 0.35rem 0 0;
}

.ins__loading[b-92xcoxen19] {
    color: var(--hx-text-faint, #6f6857);
    padding: 2rem 0;
}

/* ── Headline stats ───────────────────────────────────────── */
/* Grid so the count of columns is the only thing that changes at a breakpoint — a flex row that flips to
   a column silently reinterprets align-items, which is the axis-flip trap this app has already paid for. */
.ins__stats[b-92xcoxen19] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.85rem;
    margin-bottom: 2.5rem;
}

.ins__stat[b-92xcoxen19] {
    padding: 1.1rem 1.15rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border-gold, rgba(232,196,108,.3));
    border-radius: var(--hx-r, 12px);
}

.ins__stat-val[b-92xcoxen19] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(1.7rem, 4.5vw, 2.3rem);
    line-height: 1;
    letter-spacing: 0.03em;
    color: var(--hx-gold, #e8c46c);
}

.ins__stat-key[b-92xcoxen19] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.11em;
    color: var(--hx-text-faint, #6f6857);
    margin-top: 0.4rem;
}

/* ── Panels ───────────────────────────────────────────────── */
.ins__panel[b-92xcoxen19] {
    margin-bottom: 2.25rem;
    padding: 1.35rem 1.4rem 1.25rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: var(--hx-r, 12px);
}

.ins__panel-head[b-92xcoxen19] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.9rem;
    margin-bottom: 1.15rem;
}

.ins__panel-title[b-92xcoxen19] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}

.ins__panel-meta[b-92xcoxen19],
.ins__panel-empty[b-92xcoxen19] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    color: var(--hx-text-faint, #6f6857);
}
.ins__panel-empty[b-92xcoxen19] { font-family: 'Hanken Grotesk', system-ui, sans-serif; font-size: 0.85rem; margin: 0; }

/* ── Strains ──────────────────────────────────────────────── */
.ins__strains[b-92xcoxen19] { display: flex; flex-direction: column; gap: 0.15rem; }

.ins__strain[b-92xcoxen19] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    align-items: center;
    gap: 0.9rem;
    padding: 0.6rem 0;
    border-top: 1px solid var(--hx-border, rgba(255,255,255,.06));
}
.ins__strain:first-child[b-92xcoxen19] { border-top: none; }

.ins__strain-name[b-92xcoxen19] {
    font-size: 0.92rem;
    color: var(--hx-text-body, #efe9da);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* One dot per weighed harvest — the count IS the sample size, shown rather than stated. */
.ins__strain-dots[b-92xcoxen19] { display: flex; gap: 3px; }
.ins__strain-dot[b-92xcoxen19] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--hx-gold, #e8c46c);
    opacity: 0.85;
}

.ins__strain-range[b-92xcoxen19] {
    font-family: 'Space Mono', monospace;
    font-size: 0.76rem;
    color: var(--hx-gold, #e8c46c);
    white-space: nowrap;
}

.ins__strain-n[b-92xcoxen19] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-text-faint, #6f6857);
    white-space: nowrap;
}

/* Sample-size honesty sits WITH the data it qualifies, not in a footer nobody reads. */
.ins__caveat[b-92xcoxen19] {
    margin: 1.15rem 0 0;
    padding-top: 0.9rem;
    border-top: 1px dashed var(--hx-border, rgba(255,255,255,.06));
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--hx-text-caption, #9a927e);
}

.ins__footnote[b-92xcoxen19] {
    font-size: 0.78rem;
    color: var(--hx-text-faint, #6f6857);
    margin: 0;
}

/* ── Empty state ──────────────────────────────────────────── */
.ins__empty[b-92xcoxen19] {
    text-align: center;
    padding: 3rem 1rem 3.5rem;
    border: 1px dashed var(--hx-border, rgba(255,255,255,.06));
    border-radius: var(--hx-r, 12px);
}
.ins__empty-glyph[b-92xcoxen19] { font-size: 2rem; display: block; margin-bottom: 0.75rem; }
.ins__empty-title[b-92xcoxen19] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    letter-spacing: 0.06em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0 0 0.5rem;
}
.ins__empty-sub[b-92xcoxen19] {
    max-width: 46ch;
    margin: 0 auto 1.4rem;
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--hx-text-caption, #9a927e);
}

/* ── Mobile ───────────────────────────────────────────────── */
@media (max-width: 720px) {
    .ins__stats[b-92xcoxen19] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    /* Name and range stay; the dot row and the grow count drop to a second line rather than squeezing
       the strain name to an ellipsis stub. */
    .ins__strain[b-92xcoxen19] {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.35rem 0.75rem;
    }
    .ins__strain-dots[b-92xcoxen19] { grid-column: 1; }
    .ins__strain-n[b-92xcoxen19] { grid-column: 2; text-align: right; }
}
/* /Components/Pages/Inventory/InventoryPage.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────
   Equipment Inventory — inv__ namespace
   ────────────────────────────────────────────────────────── */

.inv__loading[b-3tbj3by4cv] {
    padding: 5rem 1.5rem;
    text-align: center;
}

.inv__loading-text[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    color: var(--hx-muted);
}

/* ── Header ──────────────────────────────────────────────── */
.inv__header[b-3tbj3by4cv] {
    background: var(--hx-surface-1, #0f0f0f);
    border-bottom: 1px solid var(--hx-border, #222);
    padding-bottom: 2rem;
    margin-bottom: 0;
}

.inv__header-inner[b-3tbj3by4cv] {
    padding-top: 2rem;
}

.inv__eyebrow[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.2em;
    margin-bottom: 0.5rem;
}

.inv__headline[b-3tbj3by4cv] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.4rem, 6vw, 4rem);
    letter-spacing: 0.02em;
    line-height: 0.95;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.6rem;
}

.inv__subhead[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.95rem;
    color: var(--hx-muted, #888);
    max-width: 540px;
    margin: 0 0 1.5rem;
    line-height: 1.5;
}

/* ── Stats bar ───────────────────────────────────────────── */
.inv__stats-bar[b-3tbj3by4cv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 1px;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
    overflow: hidden;
    max-width: 480px;
}

.inv__stat[b-3tbj3by4cv] {
    background: var(--hx-surface-1, #0d0e0f);
    padding: 1rem 1.25rem;
}

.inv__stat-val[b-3tbj3by4cv] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.9rem;
    line-height: 0.9;
    color: var(--hx-fg, #fff);
}

.inv__stat-val--gold[b-3tbj3by4cv] { color: var(--hx-gold, #d4af37); }

.inv__stat-label[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: var(--hx-muted, #666);
    letter-spacing: 0.08em;
    margin-top: 0.3rem;
}

/* ── Featured Partner ────────────────────────────────────── */
.inv__partner[b-3tbj3by4cv] {
    position: relative;
    margin-top: 1.5rem;
    border-radius: 10px;
    background: linear-gradient(120deg, #1c1607, #0f0c06);
    border: 1px solid rgba(212, 175, 55, 0.4);
    display: flex;
    gap: clamp(1.25rem, 3vw, 2.25rem);
    flex-wrap: wrap;
    align-items: center;
    padding: clamp(1.25rem, 3vw, 2rem);
    overflow: hidden;
}

.inv__partner-badge[b-3tbj3by4cv] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    padding: 0.25rem 0.65rem;
    background: rgba(212,175,55,0.16);
    color: var(--hx-gold, #d4af37);
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
}

.inv__partner-img[b-3tbj3by4cv] {
    width: clamp(100px, 14vw, 160px);
    flex-shrink: 0;
    aspect-ratio: 1;
    border-radius: 8px;
    background: repeating-linear-gradient(48deg, #241d10, #241d10 12px, #191307 12px, #191307 24px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.inv__partner-img-placeholder[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: #5a5040;
}

.inv__partner-body[b-3tbj3by4cv] { flex: 1; min-width: 200px; }

.inv__partner-eyebrow[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.15em;
    margin-bottom: 0.5rem;
}

.inv__partner-name[b-3tbj3by4cv] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    letter-spacing: 0.02em;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.5rem;
}

.inv__partner-desc[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.875rem;
    color: var(--hx-muted, #999);
    line-height: 1.55;
    max-width: 400px;
    margin: 0 0 1rem;
}

.inv__partner-btn[b-3tbj3by4cv] { font-size: 0.875rem; }

/* ── Controls ────────────────────────────────────────────── */
.inv__controls[b-3tbj3by4cv] {
    padding-top: 1.75rem;
    padding-bottom: 0;
}

.inv__search-row[b-3tbj3by4cv] {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;   /* keep SORT controls pinned right as the search box narrows */
    margin-bottom: 1rem;
}

.inv__search[b-3tbj3by4cv] {
    flex: 0 1 340px;                  /* single-word searches don't need much width (operator, 2026-07-24) */
    max-width: 340px;
    min-width: 180px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    color: var(--hx-fg, #efe9da);
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.875rem;
    padding: 0.75rem 1rem;
    transition: border-color 0.15s;
}

.inv__search:focus[b-3tbj3by4cv] {
    outline: none;
    border-color: rgba(212, 175, 55, 0.5);
}

/* ── Category filter ─────────────────────────────────────── */
/* 16 categories is too many pills — they wrapped to several rows and littered the floor (worse on
   mobile), so a compact dropdown is the filter at ALL widths. The old .inv__cats / .inv__cat-pill
   are retired. */
/* The category filter — a compact dropdown at every width (replaces the old 16-pill row). Capped on
   desktop so it reads as a tidy control; goes full-width on mobile (see @media below). */
.inv__cat-select[b-3tbj3by4cv] {
    display: block;
    width: 100%;
    max-width: 300px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
}

/* Empty-grid fallback message (default "Recently added" view returned nothing, or a picked category is empty). */
.inv__prompt[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: #cbc3b0;
    background: rgba(255,255,255,.02);
    border: 1px dashed rgba(255,255,255,.12);
    border-radius: 12px;
    padding: 2rem 1.25rem;
    text-align: center;
    line-height: 1.5;
}
.inv__prompt-sub[b-3tbj3by4cv] {
    display: block;
    margin-top: 0.4rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-muted, #8a8270);
}

/* ── Body layout ─────────────────────────────────────────── */
.inv__body[b-3tbj3by4cv] {
    display: flex;
    gap: clamp(1.25rem, 3vw, 2rem);
    align-items: flex-start;
    padding-top: 1.5rem;
    padding-bottom: 5rem;
}

.inv__main[b-3tbj3by4cv] { flex: 1; min-width: 0; }

/* ── Grid ────────────────────────────────────────────────── */
.inv__grid[b-3tbj3by4cv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

.inv__empty[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.8rem;
    color: var(--hx-muted, #6f6857);
    padding: 3.5rem 1rem;
    text-align: center;
}

/* ── Card ────────────────────────────────────────────────── */
.inv__card[b-3tbj3by4cv] {
    border-radius: 10px;
    overflow: hidden;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.08);
    transition: border-color 0.18s;
}

.inv__card.is-selected[b-3tbj3by4cv] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.06);
}

.inv__card.is-sponsored[b-3tbj3by4cv] {
    border-color: rgba(212, 175, 55, 0.35);
}

.inv__card-thumb[b-3tbj3by4cv] {
    position: relative;
    aspect-ratio: 16 / 10;
    background: repeating-linear-gradient(48deg, #1a1610, #1a1610 10px, #14100b 10px, #14100b 20px);
}
/* Placeholder glyph until a licensed product image exists (doc 23 §5a). */
.inv__card-glyph[b-3tbj3by4cv] {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.75rem; opacity: 0.45; pointer-events: none;
}

.inv__card-cat-badge[b-3tbj3by4cv] {
    position: absolute;
    top: 0.6rem;
    left: 0.6rem;
    padding: 0.25rem 0.65rem;
    background: rgba(8,7,5,0.72);
    border: 1px solid rgba(255,255,255,0.12);
    color: var(--hx-muted, #b0a890);
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.06em;
}

.inv__card-sponsor-badge[b-3tbj3by4cv] {
    position: absolute;
    top: 0.6rem;
    right: 0.6rem;
    padding: 0.25rem 0.6rem;
    background: var(--hx-gold, #d4af37);
    color: #16120a;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.inv__card-body[b-3tbj3by4cv] {
    padding: 0.9rem 1rem 1rem;
}

.inv__card-top[b-3tbj3by4cv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.inv__card-info[b-3tbj3by4cv] { min-width: 0; }

.inv__card-name[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--hx-fg, #f6efdd);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inv__card-brand[b-3tbj3by4cv] {
    font-size: 0.75rem;
    color: var(--hx-muted, #8a8270);
    margin-top: 0.1rem;
}

.inv__card-spec[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-muted, #9a927e);
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

/* ── Usage bar ───────────────────────────────────────────── */
.inv__card-usage[b-3tbj3by4cv] { margin-bottom: 0.75rem; }

.inv__card-usage-row[b-3tbj3by4cv] {
    display: flex;
    justify-content: space-between;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: var(--hx-muted, #8a8270);
    margin-bottom: 0.3rem;
}

.inv__usage-track[b-3tbj3by4cv] {
    height: 4px;
    border-radius: 99px;
    background: rgba(255,255,255,0.07);
    overflow: hidden;
}

.inv__usage-fill[b-3tbj3by4cv] {
    height: 100%;
    border-radius: 99px;
    background: var(--hx-gold, #c89b62);
    transition: width 0.3s ease;
}

/* ── Add button ──────────────────────────────────────────── */
.inv__add-btn[b-3tbj3by4cv] {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0.625rem;
    border-radius: 2px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    background: transparent;
    color: var(--hx-gold, #d4af37);
    border: 1px solid rgba(212, 175, 55, 0.4);
    transition: background 0.15s, color 0.15s;
}

.inv__add-btn.is-in-gear[b-3tbj3by4cv] {
    background: var(--hx-gold, #d4af37);
    color: #1a1407;
    border-color: var(--hx-gold, #d4af37);
}

.inv__add-btn:not(.is-in-gear):hover[b-3tbj3by4cv] {
    background: rgba(212, 175, 55, 0.1);
}

/* ── Submit Missing Item ─────────────────────────────────── */
.inv__submit-eyebrow[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.15em;
    margin-bottom: 0.5rem;
}

.inv__submit-title[b-3tbj3by4cv] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.6rem;
    letter-spacing: 0.04em;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.5rem;
}

.inv__submit-desc[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.875rem;
    color: var(--hx-muted, #999);
    margin: 0 0 1.5rem;
    line-height: 1.5;
}

.inv__submit-form[b-3tbj3by4cv] { display: flex; flex-direction: column; gap: 1rem; }

.inv__submit-row[b-3tbj3by4cv] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.inv__submit-field[b-3tbj3by4cv] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    flex: 1;
    min-width: 180px;
}

.inv__submit-label[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-muted, #888);
    letter-spacing: 0.08em;
}

.inv__submit-input[b-3tbj3by4cv] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    color: var(--hx-fg, #efe9da);
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.875rem;
    padding: 0.65rem 0.875rem;
    transition: border-color 0.15s;
}

.inv__submit-input:focus[b-3tbj3by4cv] {
    outline: none;
    border-color: rgba(212, 175, 55, 0.5);
}

.inv__submit-select[b-3tbj3by4cv] {
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}

.inv__submit-select option[b-3tbj3by4cv] { background: #1a1a1a; }

.inv__submit-error[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: #ff6b6b;
}

.inv__submit-success[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    color: #6bcf7f;
    padding: 1rem;
    background: rgba(107, 207, 127, 0.1);
    border: 1px solid rgba(107, 207, 127, 0.25);
    border-radius: 6px;
}

.inv__submit-btn[b-3tbj3by4cv] { align-self: flex-start; font-size: 0.875rem; }

/* Submit + Cancel side by side (Cancel = ghost/outline, closes the modal like the ×). */
.inv__submit-actions[b-3tbj3by4cv] { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.inv__cancel-btn[b-3tbj3by4cv] { font-size: 0.875rem; }

/* ── "Item not found?" toolbar trigger ─────────────────────── */
.inv__missing-btn[b-3tbj3by4cv] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.7rem 1.1rem;
    border-radius: 8px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.08);
    border: 1px solid rgba(212, 175, 55, 0.4);
    transition: background 0.15s, border-color 0.15s;
}
.inv__missing-btn:hover[b-3tbj3by4cv] {
    background: rgba(212, 175, 55, 0.16);
    border-color: rgba(212, 175, 55, 0.7);
}
.inv__missing-btn-plus[b-3tbj3by4cv] { font-size: 1.05rem; line-height: 1; }

/* ── Submit-a-missing-item modal ───────────────────────────── */
.inv__modal-backdrop[b-3tbj3by4cv] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(1rem, 6vh, 5rem) 1rem;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(3px);
    overflow-y: auto;
    animation: inv-modal-fade-b-3tbj3by4cv 0.15s ease-out;
}
.inv__modal[b-3tbj3by4cv] {
    position: relative;
    width: 100%;
    max-width: 640px;
    padding: 2rem;
    background: #14110c;               /* solid so the blurred backdrop doesn't bleed through */
    border: 1px solid rgba(255,255,255,0.1);
    border-left: 3px solid var(--hx-gold, #d4af37);
    border-radius: 10px;
    box-shadow: 0 24px 60px rgba(0,0,0,0.55);
    animation: inv-modal-rise-b-3tbj3by4cv 0.18s ease-out;
}
.inv__modal-close[b-3tbj3by4cv] {
    position: absolute;
    top: 0.6rem;
    right: 0.75rem;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    color: var(--hx-muted, #999);
    background: none;
    border: none;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}
.inv__modal-close:hover[b-3tbj3by4cv] { background: rgba(255,255,255,0.08); color: var(--hx-fg, #fff); }

@keyframes inv-modal-fade-b-3tbj3by4cv { from { opacity: 0; } to { opacity: 1; } }
@keyframes inv-modal-rise-b-3tbj3by4cv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ── Sidebar ─────────────────────────────────────────────── */
.inv__sidebar[b-3tbj3by4cv] {
    width: 300px;
    flex-shrink: 0;
    position: sticky;
    top: 80px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.inv__my-gear-card[b-3tbj3by4cv] {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: 10px;
    padding: 1.25rem;
}

.inv__my-gear-head[b-3tbj3by4cv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.inv__my-gear-title[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.12em;
}

.inv__my-gear-list[b-3tbj3by4cv] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    /* Cap the list so a big kit scrolls inside the card instead of stretching the
       page down (operator, 2026-07-20). ~5 rows visible, the rest one scroll away. */
    max-height: 17rem;
    overflow-y: auto;
    padding-right: 0.25rem;
}
.inv__my-gear-list[b-3tbj3by4cv]::-webkit-scrollbar { width: 6px; }
.inv__my-gear-list[b-3tbj3by4cv]::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.3);
    border-radius: 3px;
}

.inv__my-gear-item[b-3tbj3by4cv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.75rem;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 6px;
}

.inv__my-gear-item-info[b-3tbj3by4cv] { flex: 1; min-width: 0; }

.inv__my-gear-item-name[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--hx-fg, #efe9da);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inv__my-gear-item-cat[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    color: var(--hx-muted, #8a8270);
    margin-top: 0.1rem;
}

.inv__my-gear-remove[b-3tbj3by4cv] {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 99px;
    color: var(--hx-muted, #8a8270);
    background: transparent;
    cursor: pointer;
    font-size: 0.9rem;
    line-height: 1;
    transition: border-color 0.15s, color 0.15s;
}

.inv__my-gear-remove:hover[b-3tbj3by4cv] {
    border-color: var(--hx-gold, #d4af37);
    color: var(--hx-gold, #d4af37);
}

.inv__my-gear-empty[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.8rem;
    color: var(--hx-muted, #8a8270);
    line-height: 1.5;
    margin: 0 0 0.75rem;
}

.inv__my-gear-note[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.72rem;
    color: var(--hx-muted, #6f6857);
    line-height: 1.5;
    margin: 0;
    padding-top: 0.875rem;
    border-top: 1px solid rgba(255,255,255,0.06);
}

/* ── Nutrient link card ──────────────────────────────────── */
.inv__nutrient-link-card[b-3tbj3by4cv] {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 1.25rem;
}

.inv__nutrient-link-eyebrow[b-3tbj3by4cv] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: var(--hx-muted, #666);
    letter-spacing: 0.12em;
    margin-bottom: 0.3rem;
}

.inv__nutrient-link-title[b-3tbj3by4cv] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.06em;
    /* Cross-link card title gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
    margin-bottom: 0.4rem;
}

.inv__nutrient-link-desc[b-3tbj3by4cv] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.78rem;
    color: var(--hx-muted, #8a8270);
    line-height: 1.4;
    margin: 0 0 0.875rem;
}

.inv__nutrient-link-btn[b-3tbj3by4cv] {
    display: block;
    text-align: center;
    font-size: 0.8rem;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 900px) {
    /* Filter dropdown fills the width on a phone. */
    .inv__cat-select[b-3tbj3by4cv] { max-width: none; }

    .inv__body[b-3tbj3by4cv] {
        flex-direction: column;
        /* align-items is CROSS-axis: the base `flex-start` aligns tops in a row, but once stacked it means
           "don't stretch horizontally" and the flex:1 main column collapses to its content width. */
        align-items: stretch;
    }

    .inv__sidebar[b-3tbj3by4cv] {
        width: 100%;
        position: static;
    }

    .inv__partner[b-3tbj3by4cv] {
        flex-direction: column;
        /* The base `center` vertically centres the image against the copy in the ROW — worth keeping there,
           but stacked it becomes a HORIZONTAL rule and `.inv__partner-body` (flex: 1, no explicit width)
           would size to fit-content instead of filling. Today that is masked: the description's max-content
           width exceeds the container, so fit-content clamps to the full width anyway. Shorten the copy or
           swap the promo for a short headline and it would silently shrink and centre. Make it explicit. */
        align-items: stretch;
    }

    .inv__partner-img[b-3tbj3by4cv] {
        width: 100%;
        aspect-ratio: 3 / 1;
    }
}
/* /Components/Pages/Landing.razor.rz.scp.css */
/* ── Landing — lp__ namespace (planning doc 37) ──────────────
   Built entirely from the existing tokens in app.css — no new palette, no new type (§6).
   Reserved accents stay reserved: purple = premium/cure, blue = privacy. Neither appears here. */

.lp[b-xxxvxjrgx6] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    padding: 4rem 0 5rem;
    text-align: center;
}

/* Holds the viewport steady while an authenticated visitor is being routed onward, so a member never
   glimpses the stranger's page on the way to their dashboard. */
.lp__wait[b-xxxvxjrgx6] { min-height: 60vh; }

.lp__inner[b-xxxvxjrgx6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
}

.lp__eyebrow[b-xxxvxjrgx6] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.22em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}

/* The hero owns the spotlight so the glow sits behind the wordmark rather than the whole column.
   isolation + a -1 layer keeps the gradient under the type without needing a stacking hack. */
.lp__hero[b-xxxvxjrgx6] {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem 0 0.5rem;
}

/* THE one marquee effect this page gets (doc 37 §5): a spotlight. No chasing bulbs, no pulsating
   border — those belong to moments a grower earns. Purely decorative, so it never traps a click. */
.lp__hero[b-xxxvxjrgx6]::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -10%;
    left: 50%;
    transform: translateX(-50%);
    width: min(680px, 120%);
    aspect-ratio: 1.6;
    background: radial-gradient(ellipse at center,
                rgba(232, 196, 108, 0.13) 0%,
                rgba(232, 196, 108, 0.05) 42%,
                transparent 72%);
    pointer-events: none;
}

.lp__headline[b-xxxvxjrgx6] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(3rem, 11vw, 6rem);
    letter-spacing: 0.06em;
    line-height: 0.95;
    /* Gold wordmark (§6) — this is the brand's own name, the one place it outranks the heading colour. */
    color: var(--hx-gold, #e8c46c);
    text-shadow: 0 0 28px rgba(232, 196, 108, 0.28);
    margin: 0;
}

/* The positioning line — the one sentence a stranger actually reads. Body face, not the display face,
   so it reads as a statement rather than more marquee. */
.lp__lede[b-xxxvxjrgx6] {
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: clamp(1rem, 2.4vw, 1.18rem);
    line-height: 1.55;
    color: var(--hx-text-body, #efe9da);
    max-width: 34ch;
    margin: 0;
    text-wrap: balance;
}

.lp__actions[b-xxxvxjrgx6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    margin-top: 0.75rem;
}

.lp__cta[b-xxxvxjrgx6] { padding: 0.85rem 1.6rem; font-size: 0.95rem; }

/* The member's way back in — quiet on purpose. The primary CTA stays the only loud thing on the page
   (doc 37 §5.2); a second competing button would split a stranger's attention. */
.lp__signin[b-xxxvxjrgx6] {
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    color: var(--hx-text-caption, #9a927e);
    text-decoration: none;
    border-bottom: 1px dotted var(--hx-border-gold, rgba(232,196,108,.3));
    padding-bottom: 1px;
    transition: color 0.15s, border-color 0.15s;
}
.lp__signin:hover[b-xxxvxjrgx6] {
    color: var(--hx-gold, #e8c46c);
    border-bottom-color: var(--hx-gold, #e8c46c);
}

/* ── The three pillars ─────────────────────────────────────
   GRID, not flex-column-that-becomes-a-row: this is the axis-flip trap the 2026-08-07 audit chased across
   six surfaces (a media query flipping flex-direction silently reinterprets align-items and flex). A grid
   changes only its track count between breakpoints, so there is no cross-axis meaning to reinterpret.
   ⚠ width:100% is load-bearing — .lp__inner is a centred flex column, so without it this block would size
   to its content and sit narrower than the page, which is exactly how that bug family presents. */
.lp__pillars[b-xxxvxjrgx6] {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.9rem;
    margin-top: 2.75rem;
    text-align: left;
}

/* Gold borders per §6 ("cards --hx-surface-1, borders --hx-border-gold"), and --hx-r is the app's card
   radius — there is no --hx-r-card token, so naming one would have quietly fallen back forever. */
.lp__pillar[b-xxxvxjrgx6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.35rem 1.25rem 1.45rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border-gold, rgba(232, 196, 108, 0.3));
    border-radius: var(--hx-r, 12px);
    text-decoration: none;
    transition: border-color 0.18s, transform 0.18s, background 0.18s;
}
.lp__pillar:hover[b-xxxvxjrgx6] {
    border-color: rgba(232, 196, 108, 0.55);
    transform: translateY(-2px);
}

.lp__pillar-glyph[b-xxxvxjrgx6] { font-size: 1.5rem; line-height: 1; }

.lp__pillar-title[b-xxxvxjrgx6] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 0.09em;
    color: var(--hx-gold, #e8c46c);
}

.lp__pillar-copy[b-xxxvxjrgx6] {
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--hx-text-caption, #9a927e);
    /* Two concise lines, not a paragraph (§3) — this is a scan, not a read. */
    text-wrap: pretty;
}

/* SHOWCASE carries the weight (§3): TRACK is table stakes, the floor is the emotional peak and the thing
   nobody else has. One step brighter — a warmer border and a faint lift — NOT a second marquee effect. */
.lp__pillar--feature[b-xxxvxjrgx6] {
    border-color: var(--hx-border-gold, rgba(232, 196, 108, 0.4));
    background:
        linear-gradient(180deg, rgba(232, 196, 108, 0.06) 0%, transparent 60%),
        var(--hx-surface-1, #0f0d0a);
}
.lp__pillar--feature:hover[b-xxxvxjrgx6] { border-color: var(--hx-gold, #e8c46c); }

.lp__micro[b-xxxvxjrgx6] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    color: var(--hx-text-faint, #6f6857);
    margin: 2rem 0 0;
}

/* Mobile is the default view (CLAUDE.md), so the stacked order IS the journey order: learn, track, show. */
@media (max-width: 760px) {
    .lp__pillars[b-xxxvxjrgx6] { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .lp[b-xxxvxjrgx6] { padding: 2.5rem 0 3.5rem; }
    .lp__pillar[b-xxxvxjrgx6] { padding: 1.15rem 1.1rem 1.25rem; }
}

/* The lift is decoration; anyone who asked for less motion keeps the colour cue and loses the movement. */
@media (prefers-reduced-motion: reduce) {
    .lp__pillar[b-xxxvxjrgx6] { transition: border-color 0.18s, background 0.18s; }
    .lp__pillar:hover[b-xxxvxjrgx6] { transform: none; }
}
/* /Components/Pages/Learn/GrowSchool.razor.rz.scp.css */
.gs[b-0lq2cw7xyw] {
    background: #080807;
    min-height: 100vh;
    color: #efe9da;
}

/* ── Hero ─────────────────────────────────────────────────── */
.gs__hero[b-0lq2cw7xyw] {
    padding: clamp(44px, 6vw, 76px) 0 clamp(24px, 3vw, 36px);
    background: radial-gradient(110% 80% at 50% -10%, rgba(232,196,108,.15), rgba(8,8,7,0) 58%);
}
.gs__eyebrow[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #e8c46c;
    letter-spacing: .24em;
    margin: 0 0 12px;
}
.gs__headline[b-0lq2cw7xyw] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(44px, 8vw, 82px);
    line-height: .88;
    margin: 0 0 16px;
    color: #f6efdd;
    letter-spacing: .02em;
}
.gs__sub[b-0lq2cw7xyw] {
    font-size: clamp(15px, 2vw, 17px);
    color: #b0a890;
    max-width: 620px;
    line-height: 1.6;
    margin: 0 0 28px;
}

/* ── Progress ─────────────────────────────────────────────── */
.gs__progress[b-0lq2cw7xyw] {
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(232,196,108,.2);
    border-radius: 12px;
    padding: 20px 22px;
    max-width: 620px;
}
.gs__progress-top[b-0lq2cw7xyw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}
.gs__progress-count[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #e8c46c;
    letter-spacing: .1em;
}
.gs__progress-pct[b-0lq2cw7xyw] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 24px;
    color: #f6efdd;
    line-height: 1;
}
.gs__progress-track[b-0lq2cw7xyw] {
    height: 8px;
    border-radius: 99px;
    background: rgba(255,255,255,.08);
    overflow: hidden;
}
.gs__progress-fill[b-0lq2cw7xyw] {
    height: 100%;
    border-radius: 99px;
    background: linear-gradient(90deg, #c89b62, #e8c46c);
    transition: width .4s;
}
.gs__progress-note[b-0lq2cw7xyw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 14px;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: #9a927e;
}
.gs__skip[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #8a8270;
    letter-spacing: .04em;
    transition: color .15s;
}
.gs__skip:hover[b-0lq2cw7xyw] { color: #e8c46c; }

/* ── Body / lesson rail ───────────────────────────────────── */
/* padding-block only — preserve .hx-container's padding-inline. The shorthand's `0` was zeroing it, so the
   lesson step-number dots sat flush against the screen edge on mobile (operator, 2026-08-10). */
.gs__body[b-0lq2cw7xyw] { padding-block: 18px 80px; }

.gs__lesson[b-0lq2cw7xyw] {
    display: flex;
    gap: clamp(14px, 2.5vw, 22px);
    align-items: stretch;
}

/* rail */
.gs__rail[b-0lq2cw7xyw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: none;
}
.gs__dot[b-0lq2cw7xyw] {
    width: 42px;
    height: 42px;
    border-radius: 99px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: #8a8270;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 20px;
    cursor: pointer;
    flex: none;
    transition: .2s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gs__dot:hover[b-0lq2cw7xyw] { border-color: rgba(232,196,108,.5); color: #e8c46c; }
.gs__dot.is-done[b-0lq2cw7xyw] {
    background: #e8c46c;
    color: #1a1407;
    border-color: #e8c46c;
    box-shadow: 0 0 18px rgba(232,196,108,.35);
    font-size: 18px;
    font-weight: 700;
}
.gs__rail-line[b-0lq2cw7xyw] {
    flex: 1;
    width: 2px;
    background: rgba(255,255,255,.08);
    margin: 6px 0;
    min-height: 18px;
}
.gs__lesson.is-done .gs__rail-line[b-0lq2cw7xyw] { background: rgba(232,196,108,.4); }

/* card */
.gs__card[b-0lq2cw7xyw] {
    flex: 1;
    min-width: 0;
    margin-bottom: 18px;
    border-radius: 12px;
    padding: clamp(18px, 3vw, 28px);
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.08);
    transition: .2s;
}
.gs__lesson.is-done .gs__card[b-0lq2cw7xyw] {
    background: rgba(255,255,255,.015);
    border-color: rgba(255,255,255,.06);
    opacity: .82;
}

.gs__card-meta[b-0lq2cw7xyw] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.gs__phase[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .12em;
}
.gs__meta-dot[b-0lq2cw7xyw] {
    width: 3px; height: 3px;
    border-radius: 99px;
    background: #4a4438;
}
.gs__lesson-n[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    letter-spacing: .06em;
}
.gs__done-tag[b-0lq2cw7xyw] {
    margin-left: auto;
    padding: 3px 10px;
    background: rgba(232,196,108,.14);
    color: #e8c46c;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.gs__lesson-headline[b-0lq2cw7xyw] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(28px, 4vw, 40px);
    margin: 0 0 8px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: 1;
}
.gs__hook[b-0lq2cw7xyw] {
    font-size: 15px;
    color: #e8c46c;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 16px;
}
.gs__para[b-0lq2cw7xyw] {
    font-size: 14px;
    color: #cbb98e;
    line-height: 1.65;
    margin: 0 0 14px;
}

/* numbers table */
.gs__numbers-label[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    letter-spacing: .14em;
    margin: 20px 0 10px;
}
.gs__table-wrap[b-0lq2cw7xyw] {
    overflow-x: auto;
    border: 1px solid rgba(232,196,108,.16);
    border-radius: 10px;
    margin-bottom: 20px;
}
.gs__table[b-0lq2cw7xyw] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
}
.gs__table th[b-0lq2cw7xyw] {
    text-align: left;
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .06em;
    padding: 10px 14px;
    background: rgba(232,196,108,.06);
    white-space: nowrap;
}
.gs__table td[b-0lq2cw7xyw] {
    padding: 9px 14px;
    color: #d8cdb6;
    border-top: 1px solid rgba(255,255,255,.06);
    white-space: nowrap;
}
.gs__td-key[b-0lq2cw7xyw] {
    color: #efe9da;
    font-weight: 600;
}

/* watch out */
.gs__watch[b-0lq2cw7xyw] {
    background: rgba(224,92,92,.05);
    border: 1px solid rgba(224,92,92,.18);
    border-radius: 10px;
    padding: 14px 18px;
    margin-bottom: 18px;
}
.gs__watch-label[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e0857a;
    letter-spacing: .12em;
    margin-bottom: 8px;
}
.gs__watch-list[b-0lq2cw7xyw] {
    margin: 0;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.gs__watch-list li[b-0lq2cw7xyw] {
    font-size: 13px;
    color: #cbb0a6;
    line-height: 1.5;
}

.gs__card-foot[b-0lq2cw7xyw] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.gs__action[b-0lq2cw7xyw] {
    font-size: 14px;
    font-weight: 700;
    color: #e8c46c;
    transition: color .15s;
}
.gs__action:hover[b-0lq2cw7xyw] { color: #f1d488; }
.gs__mark[b-0lq2cw7xyw] {
    background: none;
    border: none;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #e8c46c;
    cursor: pointer;
    padding: 0;
    transition: color .15s;
}
.gs__mark.is-done[b-0lq2cw7xyw] { color: #8a8270; }
.gs__mark:hover[b-0lq2cw7xyw] { color: #f1d488; }

.gs__sources[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #6f6857;
    letter-spacing: .02em;
    line-height: 1.5;
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,.05);
}

/* ── Payoff ───────────────────────────────────────────────── */
.gs__payoff[b-0lq2cw7xyw] {
    display: flex;
    gap: clamp(14px, 2.5vw, 22px);
    align-items: flex-start;
    margin-top: 8px;
}
.gs__payoff-crown[b-0lq2cw7xyw] {
    width: 42px;
    height: 42px;
    flex: none;
    border-radius: 99px;
    background: rgba(232,196,108,.12);
    border: 1px solid rgba(232,196,108,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #e8c46c;
}
.gs__payoff-inner[b-0lq2cw7xyw] {
    flex: 1;
    min-width: 0;
    padding: clamp(20px, 3vw, 30px);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(232,196,108,.08), rgba(255,255,255,.02));
    border: 1px solid rgba(232,196,108,.28);
}
.gs__payoff-title[b-0lq2cw7xyw] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(28px, 4vw, 40px);
    margin: 0 0 8px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: 1;
}
.gs__payoff-sub[b-0lq2cw7xyw] {
    font-size: 14px;
    color: #b0a890;
    line-height: 1.6;
    margin: 0 0 22px;
    max-width: 560px;
}

.gs__q[b-0lq2cw7xyw] { margin-bottom: 18px; }
.gs__q-label[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    letter-spacing: .14em;
    margin-bottom: 10px;
}
.gs__pills[b-0lq2cw7xyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.gs__pill[b-0lq2cw7xyw] {
    padding: 9px 16px;
    border-radius: 99px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.03);
    color: #b0a890;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: .15s;
}
.gs__pill:hover[b-0lq2cw7xyw] { border-color: rgba(232,196,108,.5); color: #efe9da; }
.gs__pill.is-on[b-0lq2cw7xyw] {
    background: #e8c46c;
    color: #1a1407;
    border-color: #e8c46c;
}

.gs__payoff-hint[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #6f6857;
    letter-spacing: .04em;
    margin: 20px 0 0;
}

.gs__result[b-0lq2cw7xyw] {
    margin-top: 22px;
    padding: 22px;
    border-radius: 10px;
    background: rgba(232,196,108,.06);
    border: 1px solid rgba(232,196,108,.3);
}
.gs__result-eyebrow[b-0lq2cw7xyw] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .14em;
    margin-bottom: 8px;
}
.gs__result-name[b-0lq2cw7xyw] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(30px, 5vw, 44px);
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: .95;
    margin-bottom: 12px;
}
.gs__result-tip[b-0lq2cw7xyw] {
    font-size: 13.5px;
    color: #cbb98e;
    line-height: 1.55;
    margin: 0 0 10px;
}
.gs__result-note[b-0lq2cw7xyw] {
    font-size: 13px;
    color: #e0a55a;
    line-height: 1.55;
    background: rgba(224,140,60,.08);
    border: 1px solid rgba(224,140,60,.22);
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 16px;
}
/* "What to look for" — the shape, in the grower's own shopping terms (doc 36). Body face, not display:
   these are read as instructions, not chanted as a headline. */
.gs__result-list[b-0lq2cw7xyw] {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    text-align: left;
}
.gs__result-list li[b-0lq2cw7xyw] {
    position: relative;
    font-size: 13.5px;
    color: #e6dcc4;
    line-height: 1.55;
    padding: 0 0 0 20px;
    margin-bottom: 7px;
}
.gs__result-list li[b-0lq2cw7xyw]::before {
    content: "▸";
    position: absolute;
    left: 2px;
    color: var(--hx-gold, #e8c46c);
}

/* The generic escape hatch — quiet, and only meaningful once they're in the picker. */
.gs__result-hint[b-0lq2cw7xyw] {
    font-size: 12.5px;
    color: #a99b7c;
    line-height: 1.5;
    margin: 10px 0 0;
}
.gs__result-hint strong[b-0lq2cw7xyw] { color: var(--hx-gold, #e8c46c); font-weight: 600; }

.gs__result-cta[b-0lq2cw7xyw] { margin-top: 4px; }
.gs__result-guide[b-0lq2cw7xyw] {
    display: inline-block;
    margin-top: 14px;
    font-family: 'Space Mono', monospace;
    font-size: 12.5px;
    color: #e8c46c;
    text-decoration: none;
    border-bottom: 1px dashed rgba(232,196,108,.5);
}
.gs__result-guide:hover[b-0lq2cw7xyw] { border-bottom-style: solid; }

/* Consumables, separated from the kit by a rule so it reads as a second errand with its own
   destination rather than more of the Blueprint checklist (operator, 2026-08-09). */
.gs__result-stock[b-0lq2cw7xyw] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(232,196,108,.18);
}
.gs__result-stock .gs__result-list[b-0lq2cw7xyw] { margin-bottom: 0; }

/* ── Mobile ───────────────────────────────────────────────── */
@media (max-width: 640px) {
    .gs__rail[b-0lq2cw7xyw] { display: none; }
    .gs__card[b-0lq2cw7xyw] { margin-bottom: 14px; }
    .gs__payoff-crown[b-0lq2cw7xyw] { display: none; }
}
/* /Components/Pages/Nutrients/NutrientsPage.razor.rz.scp.css */
.ns[b-fmj9z8l2u0] {
    background: #080807;
    min-height: 100vh;
    color: #efe9da;
}

/* Header */
.ns__header[b-fmj9z8l2u0] {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(8,8,7,.9);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(232,196,108,.16);
}
.ns__header-inner[b-fmj9z8l2u0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 14px;
    padding-bottom: 14px;
}
.ns__breadcrumb-label[b-fmj9z8l2u0] {
    font-size: 13px;
    color: #e8c46c;
}
.ns__link-gear[b-fmj9z8l2u0] {
    font-size: 13px;
    color: #b0a890;
    transition: color .15s;
}
.ns__link-gear:hover[b-fmj9z8l2u0] { color: #e8c46c; }

/* Title block */
.ns__title-block[b-fmj9z8l2u0] {
    padding: clamp(28px,4vw,44px) 0 0;
}
.ns__eyebrow[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #e8c46c;
    letter-spacing: .2em;
    margin: 0 0 8px;
}
.ns__headline[b-fmj9z8l2u0] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(38px,6vw,58px);
    margin: 0 0 8px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: .95;
}
.ns__sub[b-fmj9z8l2u0] {
    font-size: 15px;
    color: #9a927e;
    margin: 0;
    max-width: 560px;
}

/* Stats bar */
.ns__stats[b-fmj9z8l2u0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px,1fr));
    gap: 1px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 10px;
    overflow: hidden;
    margin-top: 24px;
}
.ns__stat-cell[b-fmj9z8l2u0] {
    background: #0d0e0f;
    padding: 18px 20px;
}
.ns__stat-val[b-fmj9z8l2u0] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 30px;
    color: #f6efdd;
    line-height: .9;
}
.ns__stat-val--gold[b-fmj9z8l2u0] { color: #e8c46c; }
.ns__stat-key[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    letter-spacing: .08em;
    margin-top: 5px;
}

/* Featured partner */
.ns__featured[b-fmj9z8l2u0] {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(120deg,#1c1607,#0f0c06);
    border: 1px solid rgba(232,196,108,.4);
    display: flex;
    gap: clamp(20px,3vw,36px);
    flex-wrap: wrap;
    align-items: center;
    padding: clamp(22px,3vw,32px);
    margin-top: clamp(20px,3vw,28px);
}
.ns__featured-badge[b-fmj9z8l2u0] {
    position: absolute;
    top: 14px;
    right: 16px;
    padding: 4px 10px;
    background: rgba(232,196,108,.16);
    color: #e8c46c;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    letter-spacing: .12em;
}
.ns__featured-thumb[b-fmj9z8l2u0] {
    width: clamp(100px,14vw,140px);
    flex: none;
    aspect-ratio: 1;
    border-radius: 10px;
    background: repeating-linear-gradient(48deg,#241d10,#241d10 12px,#191307 12px,#191307 24px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #6c6450;
}
.ns__featured-body[b-fmj9z8l2u0] { flex: 1; min-width: 220px; }
.ns__featured-label[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .16em;
    margin: 0 0 8px;
}
.ns__featured-title[b-fmj9z8l2u0] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(24px,4vw,38px);
    margin: 0 0 8px;
    color: #f6efdd;
    letter-spacing: .02em;
}
.ns__featured-desc[b-fmj9z8l2u0] {
    font-size: 14px;
    color: #b0a890;
    line-height: 1.55;
    margin: 0 0 16px;
    max-width: 440px;
}
.ns__featured-highlight[b-fmj9z8l2u0] { color: #e8c46c; font-weight: 700; }
.ns__featured-cta[b-fmj9z8l2u0] { font-size: 13px; }

/* Controls */
.ns__controls[b-fmj9z8l2u0] { padding-top: clamp(24px,3vw,32px); }

/* Search + "Item not found?" trigger on one row, matching the Gear page. */
.ns__search-row[b-fmj9z8l2u0] {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 1rem;
}
.ns__search[b-fmj9z8l2u0] {
    flex: 0 1 340px;                  /* same compact width as the Gear search (operator, 2026-07-24) */
    max-width: 340px;
    min-width: 180px;
    box-sizing: border-box;
    margin-bottom: 0;
}

/* "Item not found?" toolbar trigger — opens the submit modal (gold outline, matches Gear). */
.ns__missing-btn[b-fmj9z8l2u0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.7rem 1.1rem;
    border-radius: 8px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    color: #e8c46c;
    background: rgba(232, 196, 108, 0.08);
    border: 1px solid rgba(232, 196, 108, 0.4);
    transition: background 0.15s, border-color 0.15s;
}
.ns__missing-btn:hover[b-fmj9z8l2u0] {
    background: rgba(232, 196, 108, 0.16);
    border-color: rgba(232, 196, 108, 0.7);
}
.ns__missing-btn-plus[b-fmj9z8l2u0] { font-size: 1.05rem; line-height: 1; }

/* Category filter — a compact dropdown (replaces the scrolling pill row), capped on desktop and
   full-width on mobile (see @media). */
.ns__cat-select[b-fmj9z8l2u0] {
    display: block;
    width: 100%;
    max-width: 300px;
    font-size: 0.9rem;
}

/* Gated-grid prompt — shown until the grower searches or picks a filter. */
.ns__prompt[b-fmj9z8l2u0] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: #cbc3b0;
    background: rgba(255,255,255,.02);
    border: 1px dashed rgba(255,255,255,.12);
    border-radius: 12px;
    padding: 2rem 1.25rem;
    text-align: center;
    line-height: 1.5;
    margin-top: 8px;
}
.ns__prompt-sub[b-fmj9z8l2u0] {
    display: block;
    margin-top: 0.4rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: #8a8270;
}

/* Body layout */
.ns__body[b-fmj9z8l2u0] {
    display: flex;
    gap: clamp(20px,3vw,32px);
    flex-wrap: wrap;
    align-items: flex-start;
    padding-top: clamp(20px,3vw,28px);
    padding-bottom: 80px;
}
.ns__grid-col[b-fmj9z8l2u0] { flex: 1; min-width: 300px; }

/* Card grid */
.ns__card-grid[b-fmj9z8l2u0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px,1fr));
    gap: 16px;
}
.ns__empty[b-fmj9z8l2u0] {
    text-align: center;
    padding: 60px 20px;
    color: #6f6857;
    font-family: 'Space Mono', monospace;
    font-size: 13px;
}

.ns__card[b-fmj9z8l2u0] {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.02);
    transition: border-color .18s;
}
.ns__card.is-on-shelf[b-fmj9z8l2u0] {
    border-color: #e8c46c;
    background: rgba(232,196,108,.08);
}
.ns__card.is-sponsored[b-fmj9z8l2u0] {
    border-color: rgba(232,196,108,.4);
    background: rgba(232,196,108,.03);
}

.ns__card-thumb[b-fmj9z8l2u0] {
    position: relative;
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(48deg,#1a1610,#1a1610 10px,#14100b 10px,#14100b 20px);
}
/* Placeholder glyph until a licensed product image exists (doc 23 §5a). */
.ns__card-glyph[b-fmj9z8l2u0] {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.75rem; opacity: 0.45; pointer-events: none;
}
.ns__card-cat-pill[b-fmj9z8l2u0] {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 4px 10px;
    background: rgba(8,7,5,.72);
    border: 1px solid rgba(255,255,255,.12);
    color: #b0a890;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 9px;
}
.ns__card-partner-badge[b-fmj9z8l2u0] {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 4px 9px;
    background: #e8c46c;
    color: #16120a;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .08em;
}

.ns__card-body[b-fmj9z8l2u0] { padding: 15px 16px 16px; }
.ns__card-top[b-fmj9z8l2u0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}
.ns__card-info[b-fmj9z8l2u0] { min-width: 0; }
.ns__card-name[b-fmj9z8l2u0] { font-weight: 700; font-size: 15px; color: #f6efdd; }
.ns__card-brand[b-fmj9z8l2u0] { font-size: 12px; color: #8a8270; margin-top: 2px; }
.ns__card-spec[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #9a927e;
    margin-top: 10px;
}
.ns__card-usage[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    margin-top: 8px;
}
.ns__usage-track[b-fmj9z8l2u0] {
    height: 3px;
    background: rgba(255,255,255,.08);
    border-radius: 99px;
    margin-top: 6px;
    overflow: hidden;
}
.ns__usage-fill[b-fmj9z8l2u0] {
    height: 100%;
    background: #e8c46c;
    border-radius: 99px;
    transition: width .3s ease;
}
.ns__add-btn[b-fmj9z8l2u0] {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 13px;
    padding: 10px;
    border-radius: 2px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid rgba(232,196,108,.4);
    background: transparent;
    color: #e8c46c;
    transition: background .15s, color .15s;
}
.ns__add-btn:hover[b-fmj9z8l2u0] { background: rgba(232,196,108,.12); }
.ns__add-btn.is-on-shelf[b-fmj9z8l2u0] { background: #e8c46c; color: #1a1407; border-color: #e8c46c; }
.ns__add-btn.is-on-shelf:hover[b-fmj9z8l2u0] { background: #f1d488; }

/* Submit section */
.ns__submit-title[b-fmj9z8l2u0] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 22px;
    color: #f6efdd;
    margin: 0 0 4px;
    letter-spacing: .02em;
}
.ns__submit-desc[b-fmj9z8l2u0] { font-size: 13px; color: #8a8270; margin: 0 0 16px; }
.ns__submit-form[b-fmj9z8l2u0] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 420px;
}
/* Role + Type pickers on the submission form — labeled rows sharing the same label style. */
.ns__submit-role[b-fmj9z8l2u0] { display: flex; align-items: center; gap: 0.6rem; }
.ns__submit-role-select[b-fmj9z8l2u0] { flex: 1 1 auto; }
.ns__submit-type[b-fmj9z8l2u0] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.ns__submit-type-label[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.06em;
    text-transform: uppercase; color: #8a8270; margin-right: 0.15rem;
}
.ns__submit-radio[b-fmj9z8l2u0] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.35rem 0.75rem; border: 1px solid rgba(255,255,255,.12); border-radius: 8px;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: #b0a890; cursor: pointer;
    transition: border-color 0.12s, color 0.12s, background 0.12s;
}
.ns__submit-radio:hover[b-fmj9z8l2u0] { border-color: #ccc; }
.ns__submit-radio.is-active[b-fmj9z8l2u0] { border-color: #e8c46c; color: #f6efdd; background: rgba(232,196,108,.08); }
.ns__submit-radio input[b-fmj9z8l2u0] { accent-color: #e8c46c; margin: 0; cursor: pointer; }
.ns__submit-type-clear[b-fmj9z8l2u0] {
    background: none; border: 0; color: #8a8270; cursor: pointer;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.74rem; text-decoration: underline; padding: 0;
}
.ns__submit-type-clear:hover[b-fmj9z8l2u0] { color: #e0863c; }

.ns__submit-error[b-fmj9z8l2u0] { font-size: 13px; color: #e05c5c; margin: 0; }
.ns__submit-ok[b-fmj9z8l2u0] { font-size: 13px; color: #6bcf8c; margin: 0; }

/* Submit + Cancel side by side (Cancel = ghost/outline, closes the modal like the ×). */
.ns__submit-actions[b-fmj9z8l2u0] { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 4px; }

/* ── Submit-a-missing-product modal (mirrors the Gear page) ─── */
.ns__modal-backdrop[b-fmj9z8l2u0] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(1rem, 6vh, 5rem) 1rem;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(3px);
    overflow-y: auto;
    animation: ns-modal-fade-b-fmj9z8l2u0 0.15s ease-out;
}
.ns__modal[b-fmj9z8l2u0] {
    position: relative;
    width: 100%;
    max-width: 560px;
    padding: 2rem;
    background: #14110c;               /* solid so the blurred backdrop doesn't bleed through */
    border: 1px solid rgba(255,255,255,0.1);
    border-left: 3px solid #e8c46c;
    border-radius: 10px;
    box-shadow: 0 24px 60px rgba(0,0,0,0.55);
    animation: ns-modal-rise-b-fmj9z8l2u0 0.18s ease-out;
}
.ns__modal-close[b-fmj9z8l2u0] {
    position: absolute;
    top: 0.6rem;
    right: 0.75rem;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    color: #8a8270;
    background: none;
    border: none;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}
.ns__modal-close:hover[b-fmj9z8l2u0] { background: rgba(255,255,255,0.08); color: #f6efdd; }

@keyframes ns-modal-fade-b-fmj9z8l2u0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes ns-modal-rise-b-fmj9z8l2u0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* Shelf sidebar */
.ns__shelf-sidebar[b-fmj9z8l2u0] {
    width: 300px;
    flex: 1 1 260px;
    max-width: 340px;
    position: sticky;
    top: 80px;
}
.ns__shelf-card[b-fmj9z8l2u0] {
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(232,196,108,.22);
    border-radius: 10px;
    padding: 20px;
}
.ns__shelf-label[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .12em;
    margin: 0 0 14px;
}
.ns__shelf-empty[b-fmj9z8l2u0] { font-size: 13px; color: #8a8270; line-height: 1.5; margin: 8px 0 0; }
.ns__shelf-list[b-fmj9z8l2u0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    /* Cap the shelf so a big lineup scrolls inside the card instead of stretching the
       page (operator, 2026-07-20; mirrors the Inventory "My Gear" list). */
    max-height: 17rem;
    overflow-y: auto;
    padding-right: 0.25rem;
}
.ns__shelf-list[b-fmj9z8l2u0]::-webkit-scrollbar { width: 6px; }
.ns__shelf-list[b-fmj9z8l2u0]::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.3);
    border-radius: 3px;
}
.ns__shelf-row[b-fmj9z8l2u0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 8px;
}
.ns__shelf-row-info[b-fmj9z8l2u0] { flex: 1; min-width: 0; }
.ns__shelf-row-name[b-fmj9z8l2u0] { font-size: 13px; font-weight: 600; color: #efe9da; }
.ns__shelf-row-cat[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    margin-top: 1px;
}
.ns__shelf-remove[b-fmj9z8l2u0] {
    width: 24px;
    height: 24px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 99px;
    background: transparent;
    color: #8a8270;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    transition: border-color .15s, color .15s;
}
.ns__shelf-remove:hover[b-fmj9z8l2u0] { border-color: #e8c46c; color: #e8c46c; }
.ns__shelf-hint[b-fmj9z8l2u0] {
    font-size: 12px;
    color: #6f6857;
    line-height: 1.5;
    margin: 14px 0 0;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.06);
}

/* Reciprocal cross-link card to the Gear page (mirrors Inventory's "Also manage: Nutrient Shelf"). */
.ns__gear-link-card[b-fmj9z8l2u0] {
    margin-top: 16px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 1.25rem;
}
.ns__gear-link-eyebrow[b-fmj9z8l2u0] {
    font-family: 'Space Mono', monospace; font-size: 0.62rem;
    color: #8a8270; letter-spacing: 0.12em; margin-bottom: 0.3rem;
}
.ns__gear-link-title[b-fmj9z8l2u0] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: 0.06em;
    /* Cross-link card title gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c); margin-bottom: 0.4rem;
}
.ns__gear-link-desc[b-fmj9z8l2u0] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.78rem;
    color: #8a8270; line-height: 1.4; margin: 0 0 0.875rem;
}
.ns__gear-link-btn[b-fmj9z8l2u0] { display: block; text-align: center; font-size: 0.8rem; }

/* Responsive */
@media (max-width: 900px) {
    /* align-items is CROSS-axis: the base `flex-start` aligns tops in a row, but once stacked it means
       "don't stretch horizontally" and the flex:1 main column collapses to its content width. */
    .ns__body[b-fmj9z8l2u0] { flex-direction: column; align-items: stretch; }
    .ns__shelf-sidebar[b-fmj9z8l2u0] {
        width: 100%;
        max-width: 100%;
        position: static;
    }
    .ns__search[b-fmj9z8l2u0] { flex-basis: 100%; max-width: none; }
    .ns__cat-select[b-fmj9z8l2u0] { max-width: none; }
}
/* /Components/Pages/Onboarding/ClaimIdentity.razor.rz.scp.css */
.ci[b-7og02yl33e] {
    min-height: calc(100vh - var(--hx-nav-h, 0px));
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 3rem 1.25rem 4rem;
}
.ci__inner[b-7og02yl33e] { width: min(560px, 100%); }
.ci__loading[b-7og02yl33e] { color: var(--hx-muted); font-family: 'Hanken Grotesk', sans-serif; }

.ci__head[b-7og02yl33e] { margin-bottom: 1.6rem; }
.ci__eyebrow[b-7og02yl33e] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.16em;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.5rem;
}
.ci__headline[b-7og02yl33e] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.2rem, 6vw, 3rem);
    letter-spacing: 0.02em;
    line-height: 1;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.6rem;
}
.ci__sub[b-7og02yl33e] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #d8d2c4;
    margin: 0;
}

.ci__card[b-7og02yl33e] {
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 10px;
    padding: 1.5rem 1.5rem 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.ci__field[b-7og02yl33e] { display: flex; flex-direction: column; gap: 0.35rem; }
.ci__field-label[b-7og02yl33e] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-muted);
}
.ci__input[b-7og02yl33e] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.98rem;
    color: var(--hx-fg, #fff);
    background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #222);
    border-radius: 8px;
    padding: 0.65rem 0.8rem;
    transition: border-color 0.12s ease;
    width: 100%;
}
.ci__input:focus[b-7og02yl33e] { outline: none; border-color: var(--hx-gold, #e8c46c); }
.ci__input--error[b-7og02yl33e] { border-color: #d1544f; }

.ci__handle-wrap[b-7og02yl33e] { position: relative; display: flex; align-items: center; }
.ci__handle-at[b-7og02yl33e] {
    position: absolute;
    left: 0.8rem;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.98rem;
    color: var(--hx-muted);
    pointer-events: none;
}
.ci__input--handle[b-7og02yl33e] { padding-left: 1.7rem; }

.ci__field-hint[b-7og02yl33e] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.78rem;
    line-height: 1.4;
    color: var(--hx-muted);
}
.ci__field-hint strong[b-7og02yl33e] { color: #e8c46c; font-weight: 600; }
.ci__url[b-7og02yl33e] {
    font-family: 'Space Mono', monospace;
    font-size: 0.74rem;
    color: #d8d2c4;
}
.ci__field-error[b-7og02yl33e] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.78rem;
    color: #e08a86;
}

.ci__avatar[b-7og02yl33e] { padding-top: 0.2rem; }

.ci__actions[b-7og02yl33e] { margin-top: 1.5rem; display: flex; justify-content: flex-end; }
.ci__continue[b-7og02yl33e] { min-width: 10rem; }

@media (max-width: 640px) {
    .ci[b-7og02yl33e] { padding-top: 2rem; }
    .ci__actions[b-7og02yl33e] { justify-content: stretch; }
    .ci__continue[b-7og02yl33e] { width: 100%; }
}
/* /Components/Pages/Pass/GrowersPass.razor.rz.scp.css */
/* ── Grower's Pass (stub — doc 19). gp-pass__ namespace ── */
.gp-pass__head[b-prts230btn] { padding-block: 2.5rem 1.25rem; }   /* not `padding` shorthand — preserve .hx-container padding-inline */
.gp-pass__eyebrow[b-prts230btn] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}
.gp-pass__headline[b-prts230btn] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2.4rem;
    letter-spacing: 0.02em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0.25rem 0 0;
}
.gp-pass__sub[b-prts230btn] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.92rem;
    color: var(--hx-text-muted, #b0a890);
    margin: 0.4rem 0 1.25rem;
    max-width: 52ch;
}

.gp-pass__notice[b-prts230btn] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    background: rgba(232, 196, 108, 0.06);
    border: 1px dashed rgba(232, 196, 108, 0.35);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.85rem;
    color: var(--hx-text-2, #d8cdb6);
    line-height: 1.5;
    max-width: 60ch;
}
.gp-pass__notice-tag[b-prts230btn] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232, 196, 108, 0.4);
    border-radius: 999px;
    padding: 0.15rem 0.5rem;
    white-space: nowrap;
}

.gp-pass__body[b-prts230btn] { padding-bottom: 4rem; }

.gp-pass__tiers[b-prts230btn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.gp-pass__tier[b-prts230btn] {
    display: flex;
    flex-direction: column;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: 10px;
    padding: 1.25rem;
    position: relative;
}
.gp-pass__tier.is-current[b-prts230btn] { border-color: var(--hx-gold, #e8c46c); }
/* Paid tier accent (doc 19 §5 — two-tier Free | Premier; gates buy capability, never prestige) */
.gp-pass__tier--premier[b-prts230btn] { box-shadow: inset 0 2px 0 rgba(232, 196, 108, 0.7); }

.gp-pass__tier-head[b-prts230btn] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}
.gp-pass__tier-name[b-prts230btn] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    letter-spacing: 0.03em;
    color: var(--hx-text-heading, #f6efdd);
}
.gp-pass__tier-price[b-prts230btn] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-text-muted, #b0a890);
}
.gp-pass__tier-badge[b-prts230btn] {
    align-self: flex-start;
    margin-top: 0.35rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.06em;
    color: #17130a;
    background: var(--hx-gold, #e8c46c);
    border-radius: 999px;
    padding: 0.12rem 0.5rem;
}

.gp-pass__feats[b-prts230btn] {
    list-style: none;
    margin: 1rem 0 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}
.gp-pass__feats li[b-prts230btn] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.85rem;
    color: var(--hx-text-2, #d8cdb6);
    line-height: 1.4;
    padding-left: 1.2rem;
    position: relative;
}
.gp-pass__feats li[b-prts230btn]::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--hx-gold, #e8c46c);
    font-size: 0.8rem;
}

.gp-pass__cta[b-prts230btn] { width: 100%; opacity: 0.7; cursor: not-allowed; }

.gp-pass__firewall[b-prts230btn] {
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: 10px;
    padding: 1.25rem 1.4rem;
    max-width: 60ch;
}
.gp-pass__firewall-title[b-prts230btn] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.03em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0 0 0.5rem;
}
.gp-pass__firewall p[b-prts230btn] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--hx-text-muted, #b0a890);
    margin: 0;
}
/* /Components/Pages/Plans/PlansPage.razor.rz.scp.css */
.gp[b-rxnofijaob] {
    background: #080807;
    min-height: 100vh;
    color: #efe9da;
}

/* Hero */
.gp__hero[b-rxnofijaob] {
    padding: clamp(48px,7vw,80px) 0 clamp(28px,4vw,44px);
    background: radial-gradient(110% 80% at 50% -10%, rgba(232,196,108,.14), rgba(8,8,7,0) 60%);
}
.gp__eyebrow[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #e8c46c;
    letter-spacing: .22em;
    margin: 0 0 12px;
}
.gp__headline[b-rxnofijaob] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(44px,8vw,80px);
    margin: 0 0 12px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: .9;
}
.gp__sub[b-rxnofijaob] {
    font-size: 15px;
    color: #9a927e;
    max-width: 580px;
    margin: 0;
    line-height: 1.6;
}
.gp__hero-ctas[b-rxnofijaob] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}
.gp__hero-cta[b-rxnofijaob] { display: inline-block; }

.gp__recipe-block[b-rxnofijaob] { margin-top: 22px; }
.gp__recipe-block .gp__line-title[b-rxnofijaob] { color: #e8c46c; }

/* Your Blueprints */
.gp__section-title[b-rxnofijaob] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(26px, 4vw, 34px);
    /* Section titles gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
    letter-spacing: .02em;
    margin: 8px 0 18px;
}
.gp__mine[b-rxnofijaob] { margin-bottom: 40px; }

/* Owner actions on an owned Blueprint's detail view */
.gp__owner-actions[b-rxnofijaob] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}
.gp__del-confirm[b-rxnofijaob] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: #b0a890;
}
.gp__del-yes[b-rxnofijaob] {
    border-color: rgba(210, 110, 100, .55) !important;
    color: #e5847b !important;
}
.gp__card--mine[b-rxnofijaob] {
    border-color: rgba(232, 196, 108, .35);
    background: rgba(232, 196, 108, .04);
}
.gp__card--mine .gp__card-category[b-rxnofijaob] { color: #e8c46c; }

/* Body */
.gp__body[b-rxnofijaob] { padding-bottom: 80px; }
.gp__loading[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 13px;
    color: #8a8270;
    /* padding-block only — preserve .hx-container's padding-inline. */
    padding-block: 60px;
}

/* Back button */
.gp__back[b-rxnofijaob] {
    background: none;
    border: none;
    color: #b0a890;
    font-size: 13px;
    font-family: 'Hanken Grotesk', sans-serif;
    cursor: pointer;
    padding: 0;
    margin-bottom: 28px;
    transition: color .15s;
}
.gp__back:hover[b-rxnofijaob] { color: #e8c46c; }

/* Plan grid */
.gp__grid[b-rxnofijaob] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    padding-top: 16px;
}

/* Empty state — reachable since the four system starter kits were retired (doc 36). Explains what a
   Blueprint IS before asking for one, and offers both routes: build it, or be walked through it. */
.gp__empty[b-rxnofijaob] {
    text-align: center;
    max-width: 560px;
    margin: 28px auto 8px;
    padding: 32px 24px;
    background: rgba(255, 255, 255, .02);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 14px;
}
.gp__empty-glyph[b-rxnofijaob] { font-size: 34px; line-height: 1; margin-bottom: 12px; }
.gp__empty-title[b-rxnofijaob] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(26px, 4vw, 34px);
    color: var(--hx-gold, #e8c46c);
    letter-spacing: .02em;
    margin: 0 0 10px;
}
.gp__empty-sub[b-rxnofijaob] {
    font-size: 14px;
    color: #cbb98e;
    line-height: 1.6;
    margin: 0 auto 20px;
}
.gp__empty-ctas[b-rxnofijaob] { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.gp__empty-link[b-rxnofijaob] { font-size: 13px; color: #a99b7c; text-decoration: none; }
.gp__empty-link:hover[b-rxnofijaob] { color: var(--hx-gold, #e8c46c); }

.gp__card[b-rxnofijaob] {
    text-align: left;
    border-radius: 14px;
    padding: 28px 24px;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.1);
    color: inherit;
    cursor: pointer;
    transition: border-color .18s, transform .18s;
    display: flex;
    flex-direction: column;
    gap: 0;
    font-family: 'Hanken Grotesk', sans-serif;
}
.gp__card:hover[b-rxnofijaob] {
    border-color: rgba(232,196,108,.5);
    transform: translateY(-3px);
}

.gp__card-top[b-rxnofijaob] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gp__card-category[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .14em;
}
.gp__card-diff[b-rxnofijaob] {
    padding: 4px 10px;
    border-radius: 99px;
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    background: rgba(255,255,255,.06);
    color: #9a927e;
}
.gp__card-diff.is-beginner[b-rxnofijaob] { background: rgba(108,207,140,.14); color: #6bcf8c; }
.gp__card-diff.is-intermediate[b-rxnofijaob] { background: rgba(232,196,108,.14); color: #e8c46c; }
.gp__card-diff.is-advanced[b-rxnofijaob] { background: rgba(224,92,92,.14); color: #e05c5c; }

.gp__card-name[b-rxnofijaob] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(30px,4vw,40px);
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: .92;
    margin: 0 0 12px;
}
.gp__card-desc[b-rxnofijaob] {
    font-size: 13px;
    color: #b0a890;
    line-height: 1.55;
    margin: 0 0 16px;
    flex: 1;
}
.gp__card-chips[b-rxnofijaob] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.gp__card-chip[b-rxnofijaob] {
    padding: 4px 10px;
    border-radius: 99px;
    background: rgba(255,255,255,.05);
    color: #9a927e;
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    letter-spacing: .06em;
}
.gp__card-counts[b-rxnofijaob] {
    display: flex;
    gap: 14px;
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #8a8270;
    margin-bottom: 18px;
}
.gp__card-cta[b-rxnofijaob] {
    font-size: 14px;
    font-weight: 700;
    color: #e8c46c;
}

/* Detail view */
.gp__detail[b-rxnofijaob] {
    max-width: 780px;
}
.gp__detail-header[b-rxnofijaob] {
    margin-bottom: 32px;
}
.gp__detail-title[b-rxnofijaob] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(36px,6vw,58px);
    margin: 0 0 10px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: .9;
}
.gp__detail-desc[b-rxnofijaob] {
    font-size: 15px;
    color: #b0a890;
    line-height: 1.6;
    margin: 0 0 20px;
    max-width: 580px;
}
.gp__detail-meta[b-rxnofijaob] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.gp__meta-chip[b-rxnofijaob] {
    padding: 6px 14px;
    border-radius: 99px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    color: #b0a890;
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: .06em;
}

/* Detail columns */
.gp__detail-cols[b-rxnofijaob] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-bottom: 32px;
}
@media (max-width: 640px) {
    .gp__detail-cols[b-rxnofijaob] { grid-template-columns: 1fr; }
}

.gp__line-section[b-rxnofijaob] {
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 10px;
    padding: 20px;
}
.gp__line-title[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: #e8c46c;
    letter-spacing: .12em;
    margin: 0 0 16px;
}
.gp__line-list[b-rxnofijaob] { display: flex; flex-direction: column; gap: 10px; }
.gp__line-row[b-rxnofijaob] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.gp__line-qty[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #e8c46c;
    flex: none;
    min-width: 22px;
    margin-top: 2px;
}
.gp__line-glyph[b-rxnofijaob] { flex: none; font-size: 16px; line-height: 1.2; }
.gp__line-info[b-rxnofijaob] { flex: 1; min-width: 0; }
.gp__line-name[b-rxnofijaob] { font-size: 13px; font-weight: 600; color: #efe9da; display: block; }
.gp__line-brand[b-rxnofijaob] { font-size: 11px; color: #8a8270; margin-top: 1px; display: block; }
.gp__line-opt[b-rxnofijaob] {
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    color: #6f6857;
    padding: 2px 7px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 99px;
    flex: none;
    margin-top: 2px;
}

/* Apply CTA */
.gp__apply-btn[b-rxnofijaob] { margin-bottom: 10px; }
.gp__apply-hint[b-rxnofijaob] { font-size: 12px; color: #6f6857; margin: 0; }
.gp__apply-ok[b-rxnofijaob] {
    font-size: 14px;
    color: #6bcf8c;
    background: rgba(108,207,140,.08);
    border: 1px solid rgba(108,207,140,.2);
    border-radius: 8px;
    padding: 16px 18px;
    margin-bottom: 12px;
    line-height: 1.55;
}
.gp__apply-link[b-rxnofijaob] { color: #e8c46c; }
.gp__apply-error[b-rxnofijaob] { font-size: 13px; color: #e05c5c; margin: 0 0 12px; }
/* /Components/Pages/Profile/Community.razor.rz.scp.css */
/* ── Community — merged Watching + Explore (doc 14). cm__ = shell; fav__ = follows; xp__ = discover ── */

.cm__head[b-h7x26tgtrc] { padding-block: 2.5rem 1.25rem; }   /* not `padding` shorthand — preserve .hx-container padding-inline */
.cm__eyebrow[b-h7x26tgtrc] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}
.cm__headline[b-h7x26tgtrc] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2.4rem;
    letter-spacing: 0.02em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0.25rem 0 0;
}
.cm__sub[b-h7x26tgtrc] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.92rem;
    color: var(--hx-text-muted, #b0a890);
    margin: 0.4rem 0 1.1rem;
}

/* Segmented toggle: Your Growers | Discover */
.cm__toggle[b-h7x26tgtrc] {
    display: inline-flex;
    gap: 0.3rem;
    padding: 0.25rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: 999px;
}
.cm__toggle-btn[b-h7x26tgtrc] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.03em;
    padding: 0.4rem 0.95rem;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--hx-text-muted, #b0a890);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.cm__toggle-btn:hover[b-h7x26tgtrc] { color: var(--hx-text-heading, #f6efdd); }
.cm__toggle-btn.is-on[b-h7x26tgtrc] {
    background: var(--hx-gold, #e8c46c);
    color: #17130a;
}
.cm__toggle-count[b-h7x26tgtrc] {
    font-size: 0.72rem;
    opacity: 0.85;
}
.cm__toggle-btn.is-on .cm__toggle-count[b-h7x26tgtrc] { opacity: 1; }

.cm__body[b-h7x26tgtrc] { padding-bottom: 4rem; }
.cm__search[b-h7x26tgtrc] { margin-bottom: 1.75rem; }

/* ── Your Growers (follows) ───────────────────────────── */
.fav__loading[b-h7x26tgtrc] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-muted); }

.fav__empty[b-h7x26tgtrc] { text-align: center; padding: 3rem 1rem; max-width: 30rem; margin: 0 auto; }
.fav__empty-glyph[b-h7x26tgtrc] { font-size: 2.5rem; opacity: 0.7; }
.fav__empty-title[b-h7x26tgtrc] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    color: var(--hx-fg, #fff);
    margin: 0.75rem 0 0.5rem;
}
.fav__empty-sub[b-h7x26tgtrc] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    color: var(--hx-muted);
    line-height: 1.5;
    margin: 0 0 1.5rem;
}

.fav__grid[b-h7x26tgtrc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
}
.fav__card[b-h7x26tgtrc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.35rem;
    padding: 1.5rem 1rem;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, transform 0.1s ease;
}
.fav__card:hover[b-h7x26tgtrc] { border-color: rgba(232, 196, 108, 0.5); transform: translateY(-2px); }
.fav__card[b-h7x26tgtrc]  .ga { margin-bottom: 0.3rem; }
.fav__name[b-h7x26tgtrc] { font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; font-size: 0.98rem; color: var(--hx-fg, #fff); }
.fav__handle[b-h7x26tgtrc] { font-family: 'Space Mono', monospace; font-size: 0.74rem; color: var(--hx-gold, #e8c46c); }
.fav__runs[b-h7x26tgtrc] { font-family: 'Space Mono', monospace; font-size: 0.7rem; color: var(--hx-muted); margin-top: 0.15rem; }

/* ── Discover (search + floor) ────────────────────────── */
.xp__search[b-h7x26tgtrc] {
    display: flex; align-items: center; gap: 0.5rem;
    max-width: 30rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border-mid, rgba(255,255,255,.09));
    border-radius: 8px;
    padding: 0.15rem 0.75rem;
}
.xp__search-icon[b-h7x26tgtrc] { opacity: 0.7; }
.xp__search-input[b-h7x26tgtrc] { border: none; background: transparent; flex: 1; }
.xp__search-input:focus[b-h7x26tgtrc] { outline: none; box-shadow: none; }

.xp__section[b-h7x26tgtrc] { margin-bottom: 2.5rem; }
.xp__section-title[b-h7x26tgtrc] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.08em;
    color: var(--hx-text-heading, #f6efdd);
    margin: 0 0 1rem;
}
.xp__count[b-h7x26tgtrc] { color: var(--hx-text-muted, #b0a890); }
.xp__hint[b-h7x26tgtrc] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #b0a890); font-size: 0.9rem; }

/* The Discover search narrows the floor itself (operator, 2026-08-29) — there is no separate
   GROWERS result list any more, so its card styles went with it. */

/* Header row: identity link + Follow button as siblings. The button must NOT be inside the anchor. */
/* Follow is a full-width BAR between the identity and the teaser, not an inline button beside the
   name (operator, 2026-08-29) — at card width an inline button truncates the name and handle. Flush
   to the card edges (no radius) so it reads as a band, and it doubles as the divider the header used
   to draw. */
.xp__floor-follow[b-h7x26tgtrc] {
    display: block; width: 100%;
    padding: 0.4rem 1rem; border: none; border-radius: 0;
    background: var(--hx-gold, #e8c46c); color: var(--hx-gold-on, #1a1610);
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.xp__floor-follow:hover:not(:disabled)[b-h7x26tgtrc] { background: var(--hx-gold-hover, #f0d189); }
.xp__floor-follow:disabled[b-h7x26tgtrc] { opacity: 0.4; cursor: not-allowed; }
/* Already following: recede to a quiet confirmation so the gold CTA never competes with itself
   across a grid of cards the viewer has already acted on. */
.xp__floor-follow.is-following[b-h7x26tgtrc] {
    background: var(--hx-surface-2, #16120d); color: var(--hx-text-2, #d8cdb6);
    box-shadow: inset 0 -1px 0 var(--hx-border, rgba(255,255,255,.06));
}
.xp__floor-follow.is-following:hover:not(:disabled)[b-h7x26tgtrc] { background: var(--hx-surface-1, #0f0d0a); color: var(--hx-text-heading, #f6efdd); }

/* A button that reads as a link — used inside the no-match copy, where the action is a sentence,
   not a control. Keeps keyboard focus and semantics correct without looking like a button. */
.xp__linkbtn[b-h7x26tgtrc] {
    background: none; border: none; padding: 0; cursor: pointer;
    font: inherit; color: var(--hx-gold, #e8c46c); text-decoration: underline;
}
.xp__linkbtn:hover[b-h7x26tgtrc] { color: var(--hx-text-heading, #f6efdd); }

.xp__floor-head[b-h7x26tgtrc] { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.xp__sorts[b-h7x26tgtrc] { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.xp__sort[b-h7x26tgtrc] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem;
    padding: 0.3rem 0.6rem; border-radius: 99px;
    background: var(--hx-surface-1, #0f0d0a); border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    color: var(--hx-text-2, #d8cdb6); cursor: pointer;
}
.xp__sort:hover:not(:disabled)[b-h7x26tgtrc] { border-color: var(--hx-border-gold-strong, rgba(232,196,108,.6)); }
.xp__sort.is-on[b-h7x26tgtrc] { border-color: var(--hx-gold, #e8c46c); color: var(--hx-gold, #e8c46c); background: rgba(232,196,108,.08); }

/* ── The floor: one card per GROWER (operator, 2026-08-29) ────────────────
   Two independent link targets share the card — the identity header goes to
   the profile, the teaser goes to the run — so each gets its own hover tell.
   The card itself only reacts at the border; it never lifts as a whole, which
   would imply a single destination. */
.xp__floor-grid[b-h7x26tgtrc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; }
.xp__floor-card[b-h7x26tgtrc] {
    display: block; padding: 0; overflow: hidden;
    background: var(--hx-surface-1, #0f0d0a); border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: 10px; color: inherit;
    transition: border-color 0.15s ease;
}
.xp__floor-card:hover[b-h7x26tgtrc] { border-color: var(--hx-border-gold-strong, rgba(232,196,108,.6)); }

.xp__floor-id[b-h7x26tgtrc] {
    /* The Follow bar below draws the separation now, so no border here. */
    display: flex; align-items: center; gap: 0.8rem;
    padding: 0.9rem 1rem;
    min-width: 0;
    text-decoration: none; color: inherit;
}
.xp__floor-id-text[b-h7x26tgtrc] { min-width: 0; }
.xp__floor-name[b-h7x26tgtrc] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.35rem; line-height: 1.05; letter-spacing: 0.04em;
    color: var(--hx-text-heading, #f6efdd);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    transition: color 0.15s ease;
}
.xp__floor-id:hover .xp__floor-name[b-h7x26tgtrc] { color: var(--hx-gold, #e8c46c); }
.xp__floor-handle[b-h7x26tgtrc] {
    font-family: 'Space Mono', monospace; font-size: 0.74rem;
    color: var(--hx-gold, #e8c46c);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.xp__floor-stats[b-h7x26tgtrc] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.76rem;
    color: var(--hx-text-muted, #b0a890); margin-top: 0.35rem;
}
.xp__floor-stats strong[b-h7x26tgtrc] { color: var(--hx-text-heading, #f6efdd); font-weight: 700; }
.xp__floor-stat-gap[b-h7x26tgtrc] { display: inline-block; width: 0.9rem; }

.xp__run-teaser[b-h7x26tgtrc] { display: block; text-decoration: none; color: inherit; }
.xp__run-cover[b-h7x26tgtrc] { position: relative; }
.xp__run-cover-img[b-h7x26tgtrc] {
    width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block;
    transition: opacity 0.15s ease;
}
.xp__run-teaser:hover .xp__run-cover-img[b-h7x26tgtrc] { opacity: 0.82; }
.xp__run-stage-pill[b-h7x26tgtrc] {
    position: absolute; bottom: 8px; right: 8px;
    background: rgba(0,0,0,0.66); color: #f0ead9;
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.03em;
    padding: 0.18rem 0.44rem; border-radius: var(--hx-r-pill, 999px);
}
.xp__run-body[b-h7x26tgtrc] { padding: 0.9rem 1rem 1.1rem; }
.xp__run-eyebrow[b-h7x26tgtrc] {
    font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.12em;
    color: var(--hx-text-muted, #b0a890); margin-bottom: 0.3rem;
}
.xp__run-name[b-h7x26tgtrc] {
    font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; font-size: 1.05rem;
    color: var(--hx-text-heading, #f6efdd); transition: color 0.15s ease;
}
.xp__run-teaser:hover .xp__run-name[b-h7x26tgtrc] { color: var(--hx-gold, #e8c46c); }
.xp__run-theme[b-h7x26tgtrc] { font-family: 'Hanken Grotesk', sans-serif; font-style: italic; font-size: 0.82rem; color: var(--hx-text-3, #cbb98e); margin-top: 0.2rem; }
.xp__run-meta[b-h7x26tgtrc] { font-family: 'Space Mono', monospace; font-size: 0.7rem; color: var(--hx-text-muted, #b0a890); margin-top: 0.55rem; }

.xp__empty[b-h7x26tgtrc] { text-align: center; padding: 2.5rem 1rem; max-width: 30rem; margin: 0 auto; }
.xp__empty-glyph[b-h7x26tgtrc] { font-size: 2.2rem; opacity: 0.7; }
.xp__empty-sub[b-h7x26tgtrc] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #b0a890); font-size: 0.9rem; line-height: 1.5; margin-top: 0.5rem; }
/* /Components/Pages/Profile/GrowerProfile.razor.rz.scp.css */
.gp__loading[b-zhpjwbxmg8], .gp__missing[b-zhpjwbxmg8] {
    padding-block: 4rem;   /* not `padding` shorthand — would clobber .hx-container's padding-inline */
    text-align: center;
}
.gp__loading-text[b-zhpjwbxmg8], .gp__missing-sub[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: var(--hx-muted);
    margin: 0 0 1.5rem;
}

/* ── Header ─────────────────────────────────────────── */
.gp__header[b-zhpjwbxmg8] {
    background: var(--hx-surface-1, #111);
    border-bottom: 1px solid var(--hx-border, #222);
    padding: 2.5rem 0;
}
.gp__header-inner[b-zhpjwbxmg8] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.gp__avatar[b-zhpjwbxmg8] {
    flex: 0 0 auto;
    /* subtle ring so a dark identity hue still separates from the page background */
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.08);
}

.gp__id[b-zhpjwbxmg8] { flex: 1 1 260px; min-width: 0; }
.gp__name[b-zhpjwbxmg8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2.25rem;
    letter-spacing: 0.02em;
    color: var(--hx-fg, #fff);
    margin: 0;
    line-height: 1.05;
}
.gp__handle[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.85rem;
    color: var(--hx-gold, #e8c46c);
    margin: 0.15rem 0 0;
}
.gp__location[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    color: var(--hx-muted);
    margin: 0.5rem 0 0;
}
.gp__bio[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.92rem;
    color: #d8cdb6;
    margin: 0.65rem 0 0;
    max-width: 46ch;
}
.gp__stats[b-zhpjwbxmg8] {
    display: flex;
    gap: 1.5rem;
    margin-top: 1rem;
}
.gp__stat[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    color: var(--hx-muted);
}
.gp__stat strong[b-zhpjwbxmg8] { color: var(--hx-fg, #fff); font-size: 1.05rem; margin-right: 0.15rem; }

.gp__actions[b-zhpjwbxmg8] { flex: 0 0 auto; }
.gp__follow[b-zhpjwbxmg8] { min-width: 8rem; }

/* ── Body / public grows ────────────────────────────── */
.gp__body[b-zhpjwbxmg8] { padding-block: 2rem 4rem; }   /* padding-block only — preserve .hx-container padding-inline */
.gp__section-title[b-zhpjwbxmg8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    color: var(--hx-fg, #fff);
    margin: 0 0 1.25rem;
}
.gp__count[b-zhpjwbxmg8] { color: var(--hx-muted); }
.gp__empty[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: var(--hx-muted);
    font-size: 0.9rem;
}

/* Spectator self-view orientation — the "what you can do" card on an empty floor. */
.gp__orient[b-zhpjwbxmg8] {
    max-width: 34rem;
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 10px;
    background: var(--hx-surface-1, #0f0d0a);
    padding: 1.5rem 1.6rem 1.7rem;
}
.gp__orient-eyebrow[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.6rem;
}
.gp__orient-lead[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #d8d2c4;
    margin: 0 0 1.2rem;
}
.gp__orient-list[b-zhpjwbxmg8] {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.gp__orient-list li[b-zhpjwbxmg8] {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--hx-muted);
}
.gp__orient-list strong[b-zhpjwbxmg8] { color: var(--hx-fg, #fff); font-weight: 600; }
.gp__orient-list a[b-zhpjwbxmg8] { color: var(--hx-gold, #e8c46c); text-decoration: none; }
.gp__orient-list a:hover[b-zhpjwbxmg8] { text-decoration: underline; }
.gp__orient-glyph[b-zhpjwbxmg8] {
    flex-shrink: 0;
    font-size: 1.1rem;
    line-height: 1.2;
}
.gp__orient-cta[b-zhpjwbxmg8] { display: inline-block; }

/* Each grow, with its public plants beneath (doc 16) — collapsible accordion (single-open). */
.gp__grow[b-zhpjwbxmg8] { margin-bottom: 2rem; }
.gp__grow-head[b-zhpjwbxmg8] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
    width: 100%;
    margin-bottom: 0.8rem;
    padding: 0 0 0.5rem;
    border: 0;
    border-bottom: 1px solid var(--hx-border, #222);
    background: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
/* Down-triangle signals "expandable"; flips up when the run is open. */
.gp__grow-caret[b-zhpjwbxmg8] {
    flex-shrink: 0;
    color: var(--hx-gold, #e8c46c);
    font-size: 1rem;
    line-height: 1;
    transition: transform 0.15s ease;
}
.gp__grow.is-open .gp__grow-caret[b-zhpjwbxmg8] { transform: rotate(180deg); }
.gp__grow-name[b-zhpjwbxmg8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 0.03em;
    color: var(--hx-fg, #fff);
    text-decoration: none;
}
.gp__grow-head:hover .gp__grow-name[b-zhpjwbxmg8] { color: var(--hx-gold, #e8c46c); }
.gp__grow-plantcount[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    color: var(--hx-muted);
}
.gp__grow-theme[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-style: italic;
    font-size: 0.85rem;
    color: #c9bfa6;
}
.gp__grow-status[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    border: 1px solid var(--hx-border, #333);
    color: var(--hx-muted);
    margin-left: auto;
}
.gp__run-status--1[b-zhpjwbxmg8] { color: #7bd88f; border-color: rgba(123, 216, 143, 0.4); }
.gp__run-status--2[b-zhpjwbxmg8] { color: var(--hx-gold, #e8c46c); border-color: rgba(232, 196, 108, 0.4); }

.gp__plants[b-zhpjwbxmg8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.85rem;
}
.gp__plant-card[b-zhpjwbxmg8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.2rem;
    padding: 1.1rem 0.85rem;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, transform 0.1s ease;
}
.gp__plant-card:hover[b-zhpjwbxmg8] { border-color: rgba(232, 196, 108, 0.5); transform: translateY(-2px); }
/* Square thumbnail box — the glyph sits centered as the base; the photo overlays it when present. */
.gp__plant-thumb[b-zhpjwbxmg8] {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    margin-bottom: 0.45rem;
    background: var(--hx-surface-2, #1a1a1a);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.gp__plant-glyph[b-zhpjwbxmg8] {
    font-size: 2.4rem;
    line-height: 1;
}
/* Cover thumbnail — this plant's latest photo, overlays the glyph; onerror removes it → glyph shows (doc 17). */
.gp__plant-photo[b-zhpjwbxmg8] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.gp__plant-name[b-zhpjwbxmg8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: var(--hx-fg, #fff);
}
.gp__plant-stage[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--hx-gold, #e8c46c);
}
.gp__plant-strain[b-zhpjwbxmg8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
}

@media (max-width: 640px) {
    .gp__header-inner[b-zhpjwbxmg8] { gap: 1rem; }
    .gp__name[b-zhpjwbxmg8] { font-size: 1.8rem; }
    .gp__actions[b-zhpjwbxmg8] { flex-basis: 100%; }
    .gp__follow[b-zhpjwbxmg8] { width: 100%; }
}
/* /Components/Pages/Runs/AddPlant.razor.rz.scp.css */
/* ── AddPlant — ap__ namespace ───────────────────────────── */

.ap[b-ntv31e0ctr] {
    max-width: 560px;
    padding-top: 2rem;
    padding-bottom: 4rem;
}

.ap__back[b-ntv31e0ctr] {
    display: inline-block;
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    text-decoration: none;
    letter-spacing: 0.05em;
    margin-bottom: 1.5rem;
}

.ap__back:hover[b-ntv31e0ctr] { color: var(--hx-gold, #d4af37); }

.ap__headline[b-ntv31e0ctr] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.5rem, 6vw, 3.5rem);
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.25rem;
}

.ap__sub[b-ntv31e0ctr] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    color: var(--hx-muted);
    margin: 0 0 1rem;
}

.ap__note[b-ntv31e0ctr] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--hx-muted);
    background: rgba(232, 196, 108, 0.07);
    border-left: 2px solid rgba(232, 196, 108, 0.5);
    border-radius: 6px;
    padding: 0.7rem 0.85rem;
    margin: 0 0 2.5rem;
}

.ap__note strong[b-ntv31e0ctr] { color: var(--hx-text); }

.ap__seed-note[b-ntv31e0ctr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
    margin: 0.4rem 0 0;
}

/* Encouragement deep link inside a note ("build your own →", "add to your Seed List →"). */
.ap__inline-link[b-ntv31e0ctr] {
    color: var(--hx-gold, #e8c46c);
    text-decoration: none;
    white-space: nowrap;
}
.ap__inline-link:hover[b-ntv31e0ctr] { text-decoration: underline; }

/* "What you're growing" — the read-only card shown in place of the manual strain/type/source fields
   once a seed is picked (its strain/type/source come from the lot). */
.ap__seedcard[b-ntv31e0ctr] {
    /* Purple tint — the "what you're growing" card reads as a distinct, premium confirmation
       (operator, 2026-07-19; accent-tints convention: PURPLE #926ec4). */
    border: 1px solid rgba(146, 110, 196, 0.4);
    background: rgba(146, 110, 196, 0.07);
    border-radius: var(--hx-r, 12px);
    padding: 0.9rem 1.1rem;
}
.ap__seedcard-eyebrow[b-ntv31e0ctr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #b79ae0;
    margin: 0 0 0.35rem;
}
.ap__seedcard-strain[b-ntv31e0ctr] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.6rem;
    letter-spacing: 0.01em;
    color: var(--hx-text-heading, #f6efdd);
    line-height: 1.05;
}
.ap__seedcard-meta[b-ntv31e0ctr] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--hx-text-muted, #b0a890);
    margin-top: 0.25rem;
}
.ap__seedcard-note[b-ntv31e0ctr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-text-caption, #9a927e);
    margin: 0.7rem 0 0;
    line-height: 1.5;
}

.ap__form[b-ntv31e0ctr] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.ap__field[b-ntv31e0ctr] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.ap__label[b-ntv31e0ctr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hx-muted);
}

.ap__required[b-ntv31e0ctr] { color: var(--hx-gold, #d4af37); }
.ap__optional[b-ntv31e0ctr] { color: var(--hx-muted); font-size: 0.65rem; }

.ap__chips[b-ntv31e0ctr] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ap__chip[b-ntv31e0ctr] {
    padding: 0.45rem 1rem;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #2a2a2a);
    border-radius: 100px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.85rem;
    color: var(--hx-muted);
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.ap__chip:hover[b-ntv31e0ctr] {
    border-color: var(--hx-fg, #ccc);
    color: var(--hx-fg, #fff);
}

.ap__chip.is-active[b-ntv31e0ctr] {
    border-color: var(--hx-gold, #d4af37);
    color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.08);
}

/* Grow-level visibility (doc 16) — the blue "gentle nudge" register, mirroring the run-surface
   per-plant privacy control (#6fa8bd) for consistency. */
.ap__vis-field[b-ntv31e0ctr] {
    padding: 1.1rem 1.2rem;
    background: rgba(111, 168, 189, 0.06);
    border: 1px solid rgba(111, 168, 189, 0.4);
    border-radius: 10px;
}
.ap__chip--vis:hover[b-ntv31e0ctr] { border-color: rgba(111, 168, 189, 0.55); }
.ap__chip--vis.is-active[b-ntv31e0ctr] {
    border-color: #6fa8bd;
    color: var(--hx-text-heading, #f6efdd);
    background: rgba(111, 168, 189, 0.14);
}

.ap__actions[b-ntv31e0ctr] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding-top: 0.5rem;
}

.ap__error[b-ntv31e0ctr] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: #ff453a;
}
/* /Components/Pages/Runs/Compare.razor.rz.scp.css */
.cmp[b-iyyp31brx7] { padding-block: 1.25rem 4rem; }
/* padding-block only — preserve .hx-container's padding-inline. */
.cmp__loading[b-iyyp31brx7] { padding-block: 3rem; color: var(--hx-text-muted, #9a927e); font-family: 'Hanken Grotesk', sans-serif; }

.cmp__header[b-iyyp31brx7] { margin-bottom: 1.1rem; }
.cmp__back[b-iyyp31brx7] {
    font-family: 'Space Mono', monospace; font-size: 0.8rem; color: var(--hx-gold, #e8c46c);
    text-decoration: none;
}
.cmp__back:hover[b-iyyp31brx7] { text-decoration: underline; }
.cmp__title[b-iyyp31brx7] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem, 8vw, 3rem); letter-spacing: 0.05em;
    color: var(--hx-fg, #fff); margin: 0.25rem 0 0.15rem;
}
.cmp__sub[b-iyyp31brx7] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; color: var(--hx-text-muted, #9a927e); margin: 0; }

/* ── Shared type filter ─────────────────────────────── */
.cmp__filters[b-iyyp31brx7] { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1.1rem; }
.cmp__filter[b-iyyp31brx7] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.03em;
    padding: 0.4rem 0.7rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-2, #cbc3b0);
    border: 1px solid var(--hx-border, #2a2820);
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.cmp__filter:hover[b-iyyp31brx7] { border-color: var(--hx-gold, #e8c46c); }
.cmp__filter.is-on[b-iyyp31brx7] {
    background: rgba(232, 196, 108, 0.12); color: var(--hx-gold, #e8c46c);
    border-color: var(--hx-gold, #e8c46c);
}
.cmp__filter-ico[b-iyyp31brx7] { font-size: 0.9rem; }

/* ── Two panes — side by side even on a phone (the comparison IS the value) ── */
.cmp__panes[b-iyyp31brx7] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
@media (min-width: 640px) { .cmp__panes[b-iyyp31brx7] { gap: 1rem; } }

.cmp__pane[b-iyyp31brx7] { min-width: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.cmp__pane-head[b-iyyp31brx7] { display: flex; }
.cmp__day-select[b-iyyp31brx7] {
    width: 100%; font-family: 'Space Mono', monospace; font-size: 0.75rem;
    padding: 0.45rem 0.5rem; border-radius: 8px;
    background: var(--hx-surface-2, #0c0c0c); color: var(--hx-fg, #fff);
    border: 1px solid var(--hx-border, #333);
}

.cmp__frame[b-iyyp31brx7] {
    position: relative; width: 100%; aspect-ratio: 3 / 4; overflow: hidden;
    border-radius: 12px; background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #2a2820);
    display: flex; align-items: center; justify-content: center;
}
.cmp__img[b-iyyp31brx7] { width: 100%; height: 100%; object-fit: cover; display: block; }
.cmp__frame-demo[b-iyyp31brx7] { font-size: 2.5rem; opacity: 0.5; }
.cmp__frame-empty[b-iyyp31brx7] {
    display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
    padding: 1rem; text-align: center;
}
.cmp__frame-empty > span:first-child[b-iyyp31brx7] { font-size: 2.5rem; opacity: 0.4; }
.cmp__frame-empty-txt[b-iyyp31brx7] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.02em;
    color: var(--hx-text-muted, #9a927e);
}

.cmp__frame-cap[b-iyyp31brx7] {
    font-family: 'Space Mono', monospace; font-size: 0.68rem; letter-spacing: 0.04em;
    color: var(--hx-gold, #e8c46c); text-align: center;
}

/* Multi-photo strip within a day */
.cmp__strip[b-iyyp31brx7] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.cmp__thumb[b-iyyp31brx7] {
    width: 40px; height: 40px; padding: 0; overflow: hidden; cursor: pointer;
    border-radius: 6px; background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #333);
    display: flex; align-items: center; justify-content: center;
}
.cmp__thumb img[b-iyyp31brx7] { width: 100%; height: 100%; object-fit: cover; }
.cmp__thumb.is-on[b-iyyp31brx7] { border-color: var(--hx-gold, #e8c46c); box-shadow: 0 0 0 1px var(--hx-gold, #e8c46c); }

/* ── Empty state ─────────────────────────────────────── */
.cmp__empty[b-iyyp31brx7] {
    text-align: center; padding: 3rem 1rem; color: var(--hx-text-muted, #9a927e);
    font-family: 'Hanken Grotesk', sans-serif;
}
.cmp__empty-ico[b-iyyp31brx7] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; opacity: 0.6; }
.cmp__empty-hint[b-iyyp31brx7] { font-size: 0.8rem; margin-top: 0.25rem; }
/* /Components/Pages/Runs/DayView.razor.rz.scp.css */
/* ── DayView — dv__ namespace ─────────────────────────────── */

.dv__loading-text[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    color: var(--hx-muted);
    font-size: 0.85rem;
    padding: 4rem 0;
}

/* ── Header ──────────────────────────────────────────────── */
.dv__header[b-e28tujeo5c] {
    padding-top: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--hx-border, #222);
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.dv__back[b-e28tujeo5c] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    text-decoration: none;
    letter-spacing: 0.05em;
    flex-basis: 100%;
    margin-bottom: 0.25rem;
}

.dv__back:hover[b-e28tujeo5c] { color: var(--hx-gold, #d4af37); }

/* Day-to-day navigation. Grid with a fixed-content column each side and the date taking the middle, so the
   headline stays optically centred whether a neighbour is "Aug 8" or "First day" — a flex row would shift
   the date sideways as the labels change length, which reads as the page jittering between days. */
.dv__daynav[b-e28tujeo5c] {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
}

.dv__daynav-step[b-e28tujeo5c] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    justify-self: start;
    font-family: 'Space Mono', monospace;
    font-size: 0.74rem;
    letter-spacing: 0.04em;
    color: var(--hx-gold, #e8c46c);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.15s;
}
.dv__daynav-step--next[b-e28tujeo5c] { justify-self: end; }
.dv__daynav-step:hover[b-e28tujeo5c] { color: var(--hx-text-heading, #f6efdd); }

.dv__daynav-arrow[b-e28tujeo5c] { font-size: 1.05rem; line-height: 1; }

/* The edge of the record. Kept visible rather than removed: "there is nothing before this" is information,
   and a vanishing control makes the layout shift as you walk into it. */
.dv__daynav-step.is-edge[b-e28tujeo5c] {
    color: var(--hx-text-faint, #6f6857);
    cursor: default;
}
.dv__daynav-step.is-edge:hover[b-e28tujeo5c] { color: var(--hx-text-faint, #6f6857); }

@media (max-width: 560px) {
    /* The labels are the first thing to go — the arrows still say which way, and the date stays whole. */
    .dv__daynav-label[b-e28tujeo5c] { display: none; }
    .dv__daynav[b-e28tujeo5c] { gap: 0.4rem; }
}

.dv__edit-btn[b-e28tujeo5c] {
    margin-left: auto;
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-gold, #d4af37);
    text-decoration: none;
    letter-spacing: 0.08em;
    padding: 0.3rem 0.8rem;
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: 4px;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
    align-self: center;
}

.dv__edit-btn:hover[b-e28tujeo5c] {
    background: rgba(212, 175, 55, 0.1);
    border-color: rgba(212, 175, 55, 0.6);
}

.dv__headline[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2rem, 5vw, 3rem);
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0;
}

/* .dv__date removed — the date IS the headline now, so a second muted copy of it beside the day number
   had nothing left to say. The day number moved to each plant (.dv__plant-day). */

.dv__edit-btn[b-e28tujeo5c] {
    margin-left: auto;
}

/* ── Body layout ─────────────────────────────────────────── */
.dv__body[b-e28tujeo5c] {
    display: flex;
    gap: 2.5rem;
    align-items: flex-start;
    padding-top: 2rem;
    padding-bottom: 3rem;
}

.dv__main[b-e28tujeo5c] {
    flex: 1;
    min-width: 0;
}

/* ── Plant section ───────────────────────────────────────── */
.dv__plant-section[b-e28tujeo5c] {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--hx-border, #1e1e1e);
}

.dv__plant-name[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2rem;
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0 0 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

/* This plant's own day number, in the gold "stats" register — a fact ABOUT the grow, sitting with the grow
   it describes (doc 34; the page header can't carry it, since each plant is a different age on one date). */
.dv__plant-day[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.09em;
    color: var(--hx-gold, #e8c46c);
    border: 1px solid var(--hx-border-gold, rgba(232, 196, 108, 0.3));
    border-radius: 3px;
    padding: 0.1rem 0.45rem;
    white-space: nowrap;
    align-self: center;
}

/* A logged entry that recorded nothing. One honest line beats three empty slots pretending to be content. */
.dv__plant-blank[b-e28tujeo5c] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.9rem;
    padding: 1rem 1.15rem;
    border: 1px dashed var(--hx-border, rgba(255, 255, 255, 0.06));
    border-radius: var(--hx-r-sm, 8px);
    background: var(--hx-surface-1, #0f0d0a);
}
.dv__plant-blank-text[b-e28tujeo5c] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--hx-text-caption, #9a927e);
}
.dv__plant-blank-cta[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    color: var(--hx-gold, #e8c46c);
    text-decoration: none;
    border-bottom: 1px dotted var(--hx-border-gold, rgba(232, 196, 108, 0.3));
}
.dv__plant-blank-cta:hover[b-e28tujeo5c] { border-bottom-style: solid; }

/* Stage-transition pill — same tinted purple build as Week View's, so one fact keeps one look across
   surfaces. Sits inside the flex .dv__plant-name; Edit still claims the right edge via margin-left:auto. */
.dv__stage-pill[b-e28tujeo5c] {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    border-radius: 3px;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.07em;
    white-space: nowrap;
    background: rgba(146, 110, 196, 0.2);
    border: 1px solid rgba(146, 110, 196, 0.45);
    color: #cdb4ee;
    align-self: center;
}

.dv__plant-dot[b-e28tujeo5c] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hx-gold, #d4af37);
    flex-shrink: 0;
}

.dv__plant-row[b-e28tujeo5c] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}

/* ── Photo ───────────────────────────────────────────────── */
.dv__photo-side[b-e28tujeo5c] {
    flex-shrink: 0;
    width: 320px;
}

/* Gallery: primary photo full-width, extras in a 2-up row below (doc 17). */
.dv__photo-gallery[b-e28tujeo5c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.dv__photo-fig[b-e28tujeo5c] {
    margin: 0;
    position: relative;
}

/* The primary shot spans both columns — it's the headline image. */
.dv__photo-fig.is-primary[b-e28tujeo5c] {
    grid-column: 1 / -1;
}

.dv__photo[b-e28tujeo5c] {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid var(--hx-border, #333);
    display: block;
}

/* The headline shot follows the PHOTO rather than a fixed ratio — same rule as the Week View
   gallery stage. The 2-up extras below stay cropped to a uniform 3/4 tile, because that strip
   has to line up; only the primary is ever shown whole. */
.dv__photo-fig.is-primary .dv__photo[b-e28tujeo5c] {
    aspect-ratio: auto;
    width: auto;
    max-width: 100%;
    max-height: 60vh;
    margin: 0 auto;
    border-color: var(--hx-gold, #e8c46c);
}

.dv__photo-fig.is-primary .dv__photo-cap[b-e28tujeo5c] { justify-content: center; }

.dv__photo-cap[b-e28tujeo5c] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.64rem;
    letter-spacing: 0.03em;
    color: var(--hx-muted);
    margin-top: 0.3rem;
}

.dv__photo-star[b-e28tujeo5c] { color: var(--hx-gold, #e8c46c); }

/* Quick jump to the Log Day editor to add/manage this day's shots (doc 17). */
.dv__photo-add-link[b-e28tujeo5c] {
    display: block;
    margin-top: 0.6rem;
    padding: 0.5rem 0.75rem;
    border: 1px dashed var(--hx-border, #333);
    border-radius: 6px;
    text-align: center;
    text-decoration: none;
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    color: var(--hx-muted);
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.dv__photo-add-link:hover[b-e28tujeo5c] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.05);
    color: var(--hx-gold, #e8c46c);
}

.dv__photo-placeholder[b-e28tujeo5c] {
    width: 320px;
    aspect-ratio: 3 / 4;
    border-radius: 6px;
    border: 1px solid var(--hx-border, #333);
    background: var(--hx-surface-1, #111);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.dv__photo-placeholder--empty[b-e28tujeo5c] {
    opacity: 0.4;
}

.dv__photo-icon[b-e28tujeo5c] {
    font-size: 2rem;
    line-height: 1;
}

.dv__photo-hint[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-muted);
    letter-spacing: 0.04em;
}

/* ── Note ────────────────────────────────────────────────── */
.dv__plant-notes[b-e28tujeo5c] {
    flex: 1;
    min-width: 0;
    padding-top: 0.25rem;
}

.dv__note-text[b-e28tujeo5c] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--hx-fg, #fff);
    white-space: pre-wrap;
    margin: 0;
}

.dv__note-empty[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.8rem;
    color: var(--hx-muted);
    margin: 0;
}

/* ── Sections ────────────────────────────────────────────── */
.dv__section[b-e28tujeo5c] {
    margin-bottom: 2rem;
}

/* Per-plant actions, under that plant's observation. Separated by a rule rather than a card so the plant
   section still reads as one block — the note and what you did to it are the same story. */
.dv__plant-actions[b-e28tujeo5c] {
    margin-top: 1.4rem;
    padding-top: 1.1rem;
    border-top: 1px solid var(--hx-border, #222);
}

.dv__plant-actions .dv__chip-row:last-child[b-e28tujeo5c] { margin-bottom: 0; }

.dv__section-title[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1rem;
    letter-spacing: 0.1em;
    color: var(--hx-muted);
    margin: 0 0 0.85rem;
}

/* ── Action chips ────────────────────────────────────────── */
.dv__chip-row[b-e28tujeo5c] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.dv__chip[b-e28tujeo5c] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.85rem;
    background: rgba(212, 175, 55, 0.08);
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: 100px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    color: var(--hx-gold, #d4af37);
}

/* ── Water detail ────────────────────────────────────────── */
.dv__water-row[b-e28tujeo5c] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    background: var(--hx-surface-1, #0e0e0e);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 0.85rem 1rem;
}

.dv__stat[b-e28tujeo5c] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.dv__stat-label[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-muted);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.dv__stat-value[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
}

/* ── Environment sidebar ─────────────────────────────────── */
.dv__env[b-e28tujeo5c] {
    width: 240px;
    flex-shrink: 0;
}

.dv__env-card[b-e28tujeo5c] {
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 1.25rem;
}

/* This surface's one gold header (the per-plant Actions titles stay muted). */
.dv__env-title[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1rem;
    letter-spacing: 0.1em;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.25rem;
}

.dv__env-note[b-e28tujeo5c] {
    font-size: 0.72rem;
    color: var(--hx-muted);
    line-height: 1.45;
    margin: 0.25rem 0 1rem;
}

/* Readouts, not inputs — this is a review surface. Styled like Log Day's number+unit pair so the same
   figures look the same in both places, but they're plain text: nothing here is editable. */
.dv__env-fields[b-e28tujeo5c] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.25rem;
}

.dv__env-field[b-e28tujeo5c] {
    flex: 1;
    min-width: 0;
}

.dv__env-flabel[b-e28tujeo5c] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-muted);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.35rem;
}

.dv__env-readout[b-e28tujeo5c] {
    display: flex;
    align-items: stretch;
}

.dv__env-num[b-e28tujeo5c] {
    flex: 1;
    min-width: 2.5rem;
    display: flex;
    align-items: center;
    height: 2.4rem;
    padding: 0 0.6rem;
    background: var(--hx-surface-2, #1a1a1a);
    border: 1px solid var(--hx-border, #333);
    border-radius: 4px 0 0 4px;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.3rem;
    letter-spacing: 0.04em;
    color: var(--hx-fg, #fff);
}

.dv__env-unit[b-e28tujeo5c] {
    display: flex;
    align-items: center;
    height: 2.4rem;
    padding: 0 0.6rem;
    background: var(--hx-surface-2, #1a1a1a);
    border: 1px solid var(--hx-border, #333);
    border-left: none;
    border-radius: 0 4px 4px 0;
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    white-space: nowrap;
}

/* ── VPD gauge — mirrors Log Day's, reading the shared VpdGauge in Core ── */
.dv__vpd[b-e28tujeo5c] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    border-radius: 4px;
    margin: 0.75rem 0 1rem;
    border: 1px solid var(--hx-border, #333);
}

.dv__vpd-value[b-e28tujeo5c] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    letter-spacing: 0.04em;
}

.dv__vpd-unit[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
}

.dv__vpd-label[b-e28tujeo5c] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    margin-left: auto;
    text-align: right;
}

.dv__vpd--blank[b-e28tujeo5c] {
    border-style: dashed;
    border-color: rgba(255,255,255,0.14);
    color: var(--hx-muted, #8a8270);
    opacity: 0.85;
}
.dv__vpd--blank .dv__vpd-value[b-e28tujeo5c] { color: var(--hx-muted, #8a8270); }

.dv__vpd-learn[b-e28tujeo5c] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: #8a8270;
    text-decoration: none;
    margin: -0.5rem 0 1rem;
    letter-spacing: 0.02em;
    line-height: 1.4;
    transition: color 0.15s;
}
.dv__vpd-learn:hover[b-e28tujeo5c] { color: #e8c46c; }

/* The gauge scale — the one place red is intended: red (fix it) → amber (caution) → green (dialled in).
   Duplicated from Log Day because scoped CSS can't be shared; the LOGIC lives once, in Core's VpdGauge. */
.vpd-good[b-e28tujeo5c]    { border-color: #6bcf7f55; color: #6bcf7f; background: rgba(107,207,127,0.06); }
.vpd-caution[b-e28tujeo5c] { border-color: #ffb02e66; color: #ffb02e; background: rgba(255,176,46,0.06); }
.vpd-danger[b-e28tujeo5c]  { border-color: #ff453a66; color: #ff453a; background: rgba(255,69,58,0.07); }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 800px) {
    /* align-items is CROSS-axis: the base `flex-start` aligns tops in a row, but once stacked it means
       "don't stretch horizontally" and the flex:1 main column collapses to its content width. The sidebar
       escaped it only by setting an explicit width. */
    .dv__body[b-e28tujeo5c] { flex-direction: column; align-items: stretch; }
    .dv__env[b-e28tujeo5c]  { width: 100%; }

    .dv__plant-row[b-e28tujeo5c] {
        flex-direction: column;
        align-items: stretch;   /* same reason — .dv__plant-notes is flex:1, which is the MAIN axis */
    }

    /* The side is the gallery CONTAINER, not an image — pinning it to 4/3 squeezed the whole
       strip into a landscape box and clipped a tall primary. Only the empty-state placeholder
       needs a ratio of its own. */
    .dv__photo-side[b-e28tujeo5c] {
        width: 100%;
    }

    .dv__photo-placeholder[b-e28tujeo5c] {
        width: 100%;
        aspect-ratio: 4 / 3;
    }
}
/* /Components/Pages/Runs/Gallery.razor.rz.scp.css */
/* The Grow Gallery (planning doc 38) — the grow's whole photographic record, undated.
   Reads as a wall of photos, not a form: the grid is the page, everything else recedes. */

.gal[b-h0a2bh5cib] { padding-block: 1.25rem 4rem; }
/* padding-block only — preserve .hx-container's padding-inline. */
.gal__loading[b-h0a2bh5cib] { padding-block: 3rem; color: var(--hx-text-muted, #9a927e); font-family: 'Hanken Grotesk', sans-serif; }

.gal__header[b-h0a2bh5cib] { margin-bottom: 1.1rem; }
.gal__back[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.8rem; color: var(--hx-gold, #e8c46c);
    text-decoration: none;
}
.gal__back:hover[b-h0a2bh5cib] { text-decoration: underline; }
.gal__title[b-h0a2bh5cib] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem, 8vw, 3rem); letter-spacing: 0.05em;
    color: var(--hx-fg, #fff); margin: 0.25rem 0 0.15rem;
}
.gal__sub[b-h0a2bh5cib] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem;
    color: var(--hx-text-muted, #9a927e); margin: 0;
}

/* ── Add panel (owner only) ─────────────────────────── */
.gal__add[b-h0a2bh5cib] {
    margin-bottom: 1.25rem; padding: 0.85rem;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 12px;
}
.gal__add-head[b-h0a2bh5cib] {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem; margin-bottom: 0.65rem;
}
.gal__add-title[b-h0a2bh5cib] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1.05rem; letter-spacing: 0.06em;
    color: var(--hx-gold, #e8c46c);
}
.gal__add-hint[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.03em;
    color: var(--hx-text-muted, #9a927e);
}

.gal__tray[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.gal__add-tile[b-h0a2bh5cib] {
    position: relative; width: 96px; aspect-ratio: 3 / 4;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.15rem;
    padding: 0.35rem; text-align: center; cursor: pointer;
    border: 1px dashed var(--hx-border, #3a382e); border-radius: 10px;
    background: var(--hx-surface-2, #0c0c0c);
    transition: border-color 0.15s ease;
}
.gal__add-tile:hover[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); }
.gal__add-icon[b-h0a2bh5cib] { font-size: 1.3rem; }
.gal__add-label[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.03em;
    color: var(--hx-text-2, #cbc3b0);
}
.gal__add-spec[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.52rem; line-height: 1.35;
    color: var(--hx-text-muted, #9a927e);
}

/* A picked-but-not-yet-added photo. Same footprint as the add tile so the tray doesn't reflow. */
.gal__stage[b-h0a2bh5cib] {
    position: relative; width: 96px; aspect-ratio: 3 / 4; overflow: hidden;
    border-radius: 10px; border: 1px solid var(--hx-border, #2a2820);
    background: var(--hx-surface-2, #0c0c0c);
}
.gal__stage-img[b-h0a2bh5cib] { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal__stage-x[b-h0a2bh5cib], .gal__tile-x[b-h0a2bh5cib] {
    position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; padding: 0;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    font-size: 0.65rem; line-height: 1; border-radius: 50%;
    background: rgba(0, 0, 0, 0.72); color: #fff; border: none;
}
.gal__stage-x:hover:not(:disabled)[b-h0a2bh5cib], .gal__tile-x:hover:not(:disabled)[b-h0a2bh5cib] { background: var(--hx-red, #e05555); }
.gal__stage-type[b-h0a2bh5cib], .gal__tile-typesel[b-h0a2bh5cib] {
    position: absolute; left: 0; right: 0; bottom: 0; width: 100%;
    font-family: 'Space Mono', monospace; font-size: 0.58rem;
    padding: 0.2rem 0.15rem; border: none; border-top: 1px solid var(--hx-border, #2a2820);
    background: rgba(0, 0, 0, 0.78); color: var(--hx-text-2, #cbc3b0); cursor: pointer;
}

.gal__add-actions[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }

.gal__btn-danger[b-h0a2bh5cib] {
    background: rgba(224, 85, 85, 0.14); color: var(--hx-red, #e05555);
    border: 1px solid var(--hx-red, #e05555);
}
.gal__btn-danger:hover:not(:disabled)[b-h0a2bh5cib] { background: rgba(224, 85, 85, 0.26); }

.gal__error[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.7rem; line-height: 1.45;
    color: var(--hx-red, #e05555); margin: 0.6rem 0 0;
}
.gal__error--float[b-h0a2bh5cib] { margin-top: 1rem; }

/* ── The pinned set: what the grower put out front ─── */
/* Read-only for everyone, including the owner — editing lives behind "Pick what judges see". */
.gal__pinned[b-h0a2bh5cib] {
    margin-bottom: 1.25rem; padding: 0.85rem;
    background: rgba(232, 196, 108, 0.06); border: 1px solid rgba(232, 196, 108, 0.3);
    border-radius: 12px;
}
.gal__pinned-title[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 0.25rem;
}
.gal__pinned-sub[b-h0a2bh5cib] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.8rem;
    color: var(--hx-text-muted, #9a927e); margin: 0 0 0.7rem;
}
/* One scrolling row, not a wrapping grid: ten is a sequence the grower ordered, and a row keeps that
   reading left-to-right instead of re-flowing into arbitrary lines. */
.gal__pinned-strip[b-h0a2bh5cib] {
    display: flex; gap: 0.45rem; overflow-x: auto; padding-bottom: 0.3rem;
    scroll-snap-type: x proximity;
}
.gal__pinned-item[b-h0a2bh5cib] {
    position: relative; flex: 0 0 auto; width: 104px; aspect-ratio: 3 / 4;
    overflow: hidden; cursor: zoom-in; scroll-snap-align: start;
    border-radius: 10px; border: 1px solid var(--hx-border, #2a2820);
    background: var(--hx-surface-2, #0c0c0c);
    display: flex; align-items: center; justify-content: center;
}
.gal__pinned-item:hover[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); }
.gal__pinned-item.is-hero[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); box-shadow: 0 0 0 1px var(--hx-gold, #e8c46c); }
.gal__pinned-img[b-h0a2bh5cib] { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal__pinned-demo[b-h0a2bh5cib] { font-size: 1.8rem; opacity: 0.45; }
.gal__pinned-hero-tag[b-h0a2bh5cib] {
    position: absolute; top: 3px; left: 3px;
    font-family: 'Space Mono', monospace; font-size: 0.46rem; letter-spacing: 0.08em;
    padding: 0.1rem 0.28rem; border-radius: 3px;
    background: var(--hx-gold, #e8c46c); color: #111;
}
@media (min-width: 640px) { .gal__pinned-item[b-h0a2bh5cib] { width: 132px; } }

/* The same photo, spotted while scrolling the wall below. */
.gal__tile-star[b-h0a2bh5cib] {
    position: absolute; top: 4px; right: 4px;
    display: flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; border-radius: 50%; font-size: 0.6rem;
    background: rgba(0, 0, 0, 0.68); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232, 196, 108, 0.45);
}

/* ── Selection mode: picking what judges lead with ─── */
/* Gold, because this is a Showcase surface — the grower is dressing their act for the floor. */
.gal__pick[b-h0a2bh5cib] {
    margin-bottom: 1.25rem; padding: 0.85rem;
    background: rgba(232, 196, 108, 0.06); border: 1px solid rgba(232, 196, 108, 0.35);
    border-radius: 12px;
}
.gal__pick-head[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem; }
.gal__pick-count[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.75rem; letter-spacing: 0.05em;
    color: var(--hx-text-2, #cbc3b0);
}
.gal__pick-hint[b-h0a2bh5cib], .gal__pick-empty[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.64rem; letter-spacing: 0.03em;
    color: var(--hx-text-muted, #9a927e);
}
.gal__pick-empty[b-h0a2bh5cib] { margin: 0.6rem 0 0; line-height: 1.5; }

.gal__pick-strip[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.7rem; }
.gal__pick-item[b-h0a2bh5cib] {
    position: relative; width: 76px; aspect-ratio: 3 / 4; overflow: hidden;
    border-radius: 8px; border: 1px solid var(--hx-border, #2a2820);
    background: var(--hx-surface-2, #0c0c0c);
}
.gal__pick-item.is-hero[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); box-shadow: 0 0 0 1px var(--hx-gold, #e8c46c); }
.gal__pick-img[b-h0a2bh5cib] { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal__pick-hero-tag[b-h0a2bh5cib] {
    position: absolute; top: 3px; left: 3px;
    font-family: 'Space Mono', monospace; font-size: 0.45rem; letter-spacing: 0.08em;
    padding: 0.1rem 0.25rem; border-radius: 3px;
    background: var(--hx-gold, #e8c46c); color: #111;
}
.gal__pick-order[b-h0a2bh5cib] {
    position: absolute; left: 0; right: 0; bottom: 0; display: flex;
    background: rgba(0, 0, 0, 0.78); border-top: 1px solid var(--hx-border, #2a2820);
}
.gal__pick-order button[b-h0a2bh5cib] {
    flex: 1; padding: 0.18rem 0; border: none; background: none; cursor: pointer;
    font-size: 0.6rem; color: var(--hx-text-2, #cbc3b0);
}
.gal__pick-order button:hover:not(:disabled)[b-h0a2bh5cib] { color: var(--hx-gold, #e8c46c); }
.gal__pick-order button:disabled[b-h0a2bh5cib] { opacity: 0.3; cursor: default; }

.gal__pick-actions[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.85rem; }
/* Shown only when leaving would destroy work. Wears the reserved consequential tint rather than gold —
   this is the one moment on this surface that can cost the grower something. "Discard them" takes the
   ghost treatment and "Keep editing" the solid one, so the SAFE way out stays the easy one to hit. */
.gal__pick-discard[b-h0a2bh5cib] {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
    margin-top: 0.6rem; padding: 0.6rem 0.75rem;
    border: 1px solid rgba(201, 138, 106, 0.5); border-radius: 8px;
    background: rgba(201, 138, 106, 0.08);
}
.gal__pick-discard-q[b-h0a2bh5cib] {
    flex: 1 1 100%; margin: 0;
    font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.04em;
    color: #c98a6a;
}

/* The pick badge replaces the subject glyph while curating — same corner, one job at a time. */
.gal__tile-pick[b-h0a2bh5cib] {
    position: absolute; top: 4px; left: 4px;
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; border-radius: 50%;
    font-family: 'Space Mono', monospace; font-size: 0.62rem;
    background: rgba(0, 0, 0, 0.68); color: var(--hx-text-muted, #9a927e);
    border: 1px solid var(--hx-border, #3a382e);
}
.gal__tile-pick.is-on[b-h0a2bh5cib] {
    background: var(--hx-gold, #e8c46c); color: #111; border-color: var(--hx-gold, #e8c46c);
}
.gal__tile.is-picked[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); }

/* ── Subject filter ─────────────────────────────────── */
.gal__filters[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.9rem; }
.gal__filter[b-h0a2bh5cib] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.03em;
    padding: 0.4rem 0.7rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-2, #cbc3b0);
    border: 1px solid var(--hx-border, #2a2820);
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.gal__filter:hover[b-h0a2bh5cib] { border-color: var(--hx-gold, #e8c46c); }
.gal__filter.is-on[b-h0a2bh5cib] {
    background: rgba(232, 196, 108, 0.12); color: var(--hx-gold, #e8c46c);
    border-color: var(--hx-gold, #e8c46c);
}
.gal__filter-ico[b-h0a2bh5cib] { font-size: 0.9rem; }

.gal__count[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.68rem; letter-spacing: 0.05em;
    color: var(--hx-text-muted, #9a927e); margin: 0 0 0.6rem;
}
.gal__count-n[b-h0a2bh5cib] { color: var(--hx-gold, #e8c46c); }

/* ── The wall ───────────────────────────────────────── */
/* auto-fill so a phone gets 3 up and a desktop gets as many as fit — the grid IS the page. */
.gal__grid[b-h0a2bh5cib] {
    display: grid; gap: 0.4rem;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
}
@media (min-width: 640px) {
    .gal__grid[b-h0a2bh5cib] { gap: 0.6rem; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); }
}

.gal__tile[b-h0a2bh5cib] {
    position: relative; aspect-ratio: 3 / 4; overflow: hidden; cursor: pointer;
    border-radius: 10px; background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #2a2820);
    display: flex; align-items: center; justify-content: center;
}
/* A log photo is read-only here (doc 38 §6.2) — the muted border says "this one lives somewhere else". */
.gal__tile.is-log[b-h0a2bh5cib] { border-color: rgba(42, 40, 32, 0.55); }
.gal__tile:hover[b-h0a2bh5cib] { border-color: rgba(232, 196, 108, 0.45); }
.gal__tile-img[b-h0a2bh5cib] { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal__tile-demo[b-h0a2bh5cib] { font-size: 2rem; opacity: 0.45; }

.gal__tile-type[b-h0a2bh5cib] {
    position: absolute; top: 4px; left: 4px;
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; border-radius: 50%; font-size: 0.7rem;
    background: rgba(0, 0, 0, 0.62);
}

.gal__tile-day[b-h0a2bh5cib] {
    position: absolute; right: 4px; bottom: 4px;
    font-family: 'Space Mono', monospace; font-size: 0.55rem; letter-spacing: 0.06em;
    padding: 0.15rem 0.35rem; border-radius: 999px; text-decoration: none;
    background: rgba(0, 0, 0, 0.72); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232, 196, 108, 0.35);
}
.gal__tile-day:hover[b-h0a2bh5cib] { background: rgba(232, 196, 108, 0.2); }
/* Mid-curation the day badge is a label, not a link — don't invite a tap that discards unsaved picks. */
.gal__tile-day.is-static[b-h0a2bh5cib] { color: var(--hx-text-muted, #9a927e); border-color: var(--hx-border, #3a382e); }

.gal__more[b-h0a2bh5cib] { display: flex; justify-content: center; margin-top: 1.1rem; }

/* ── Empty ──────────────────────────────────────────── */
.gal__empty[b-h0a2bh5cib] {
    display: flex; flex-direction: column; align-items: center; gap: 0.4rem;
    padding: 2.5rem 1rem; text-align: center;
    border: 1px dashed var(--hx-border, #2a2820); border-radius: 12px;
}
.gal__empty-ico[b-h0a2bh5cib] { font-size: 2.4rem; opacity: 0.4; }
.gal__empty p[b-h0a2bh5cib] {
    margin: 0; font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem; color: var(--hx-text-2, #cbc3b0);
}
.gal__empty-hint[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace !important; font-size: 0.68rem !important;
    color: var(--hx-text-muted, #9a927e) !important;
}

/* ── Overlays: lightbox + delete confirm ────────────── */
.gal__overlay[b-h0a2bh5cib] {
    position: fixed; inset: 0; z-index: 60; cursor: zoom-out;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem;
    padding: 1.25rem; background: rgba(0, 0, 0, 0.88);
}
.gal__zoom-img[b-h0a2bh5cib] {
    max-width: 100%; max-height: 82vh; object-fit: contain; border-radius: 10px;
}
.gal__zoom-cap[b-h0a2bh5cib] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.05em;
    color: var(--hx-gold, #e8c46c);
}

.gal__confirm[b-h0a2bh5cib] {
    cursor: default; max-width: 22rem; width: 100%; padding: 1.1rem;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 14px;
}
.gal__confirm-title[b-h0a2bh5cib] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: 0.04em;
    color: var(--hx-fg, #fff); margin: 0 0 0.4rem;
}
.gal__confirm-body[b-h0a2bh5cib] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; line-height: 1.5;
    color: var(--hx-text-2, #cbc3b0); margin: 0 0 0.9rem;
}
.gal__confirm-actions[b-h0a2bh5cib] { display: flex; flex-wrap: wrap; gap: 0.5rem; }
/* /Components/Pages/Runs/LogDay.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────
   LogDay — ld__ namespace
   ────────────────────────────────────────────────────────── */

.ld__loading[b-pweotox1zd] {
    padding: 4rem 1.5rem;
}

.ld__loading-text[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    color: var(--hx-muted);
    font-size: 0.85rem;
}

/* ── Header ──────────────────────────────────────────────── */
.ld__header[b-pweotox1zd] {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--hx-border, #222);
    margin-bottom: 0;
}

.ld__back[b-pweotox1zd] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    text-decoration: none;
    margin-bottom: 0.75rem;
    letter-spacing: 0.05em;
}

.ld__back:hover[b-pweotox1zd] { color: var(--hx-gold, #d4af37); }

.ld__title-row[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

/* Day-by-day navigator — arrows flanking the date picker (mirrors WeekView's week nav). */
.ld__day-nav[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}
.ld__day-nav-btn[b-pweotox1zd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--hx-border, #333);
    border-radius: 4px;
    background: var(--hx-surface-1, #111);
    color: var(--hx-fg, #fff);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color 0.15s, color 0.15s;
}
.ld__day-nav-btn:hover:not(:disabled)[b-pweotox1zd] { border-color: var(--hx-gold, #d4af37); color: var(--hx-gold, #d4af37); }
.ld__day-nav-btn:disabled[b-pweotox1zd] { opacity: 0.25; cursor: default; }

.ld__headline[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2rem, 5vw, 3rem);
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0;
    flex: 1;
}

.hx-input--sm[b-pweotox1zd] {
    padding: 0.35rem 0.65rem;
    font-size: 0.85rem;
}

/* ── Momentum bar ────────────────────────────────────────── */
.ld__momentum[b-pweotox1zd] {
    padding-top: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--hx-border, #222);
    margin-bottom: 2rem;
}

.ld__momentum-bar-track[b-pweotox1zd] {
    height: 4px;
    background: var(--hx-surface-2, #1a1a1a);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.ld__momentum-bar-fill[b-pweotox1zd] {
    height: 100%;
    background: var(--hx-gold, #d4af37);
    border-radius: 2px;
    transition: width 0.3s ease;
}

.ld__momentum-meta[b-pweotox1zd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ld__momentum-label[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
    letter-spacing: 0.03em;
}

.ld__momentum-pct[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 0.95rem;
    letter-spacing: 0.08em;
    color: var(--hx-gold, #d4af37);
}

/* ── Edit-mode banner ────────────────────────────────────── */
.ld__edit-banner[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: rgba(100, 180, 255, 0.06);
    border: 1px solid rgba(100, 180, 255, 0.22);
    border-radius: 4px;
    padding: 0.65rem 1rem;
    margin-bottom: 1.5rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: #7bc8f0;
}

.ld__edit-icon[b-pweotox1zd] {
    font-size: 1rem;
    color: #7bc8f0;
}

/* ── Growth stage strip ──────────────────────────────────── */
.ld__stage[b-pweotox1zd] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--hx-border, #222);
}
.ld__stage-head[b-pweotox1zd] {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
}
.ld__stage-eyebrow[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
    color: var(--hx-muted, #8a8270);
}
.ld__stage-now[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 0.02em;
    color: #f6efdd;
    line-height: 1;
}
/* Purple tint (operator, 2026-07-28) — the standard tinted-card recipe: faint same-hue gradient fill, a
   #926ec4 border, #b79ae0 for text on dark. Marks the stage change as a lifecycle-transition control rather
   than one more gold action competing with the page's brand accents. */
.ld__stage-actions[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-left: auto;
    background: linear-gradient(135deg, rgba(146,110,196,.16), rgba(146,110,196,.03));
    border: 1px solid rgba(146,110,196,.4);
    border-radius: 4px;
    padding: 0.7rem 0.9rem;
    transition: border-color .15s;
}
.ld__stage-actions:hover[b-pweotox1zd] { border-color: #926ec4; }

.ld__stage-advance[b-pweotox1zd] {
    background: rgba(146,110,196,.12);
    border: 1px solid rgba(146,110,196,.4);
    color: #b79ae0;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    border-radius: 2px;
    padding: 0.5rem 0.9rem;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.ld__stage-advance:hover[b-pweotox1zd] { background: rgba(146,110,196,.24); border-color: #926ec4; }
.ld__stage-switch[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.ld__stage-switch-label[b-pweotox1zd] {
    font-size: 0.72rem;
    color: var(--hx-muted, #8a8270);
}
/* Same purple tint as .ld__stage-actions — this is the same slot mid-flow (the "when did it happen?" step),
   so it must not change colour underneath the grower. */
.ld__stage-confirm[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-left: auto;
    background: linear-gradient(135deg, rgba(146,110,196,.16), rgba(146,110,196,.03));
    border: 1px solid rgba(146,110,196,.4);
    border-radius: 4px;
    padding: 0.7rem 0.9rem;
}
.ld__stage-confirm-msg[b-pweotox1zd] {
    font-size: 0.82rem;
    color: #d8cdb6;
    max-width: 34rem;
}
.ld__stage-confirm-actions[b-pweotox1zd] {
    display: flex;
    gap: 0.5rem;
}
.ld__stage-when[b-pweotox1zd] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.ld__stage-when-label[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hx-muted, #8a8270);
}
.ld__stage-when .hx-input[b-pweotox1zd] { max-width: 11rem; }
.ld__stage-when-hint[b-pweotox1zd] {
    font-size: 0.74rem;
    color: var(--hx-muted, #8a8270);
    max-width: 22rem;
}
/* Stage-phased Blueprint pick (doc 31 Slice 3) — mirrors the "when did it happen?" field beside it. */
.ld__stage-tent[b-pweotox1zd] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.ld__stage-tent-label[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hx-muted, #8a8270);
}
.ld__stage-tent .hx-input[b-pweotox1zd] { max-width: 14rem; }
.ld__stage-tent-hint[b-pweotox1zd] {
    font-size: 0.74rem;
    color: var(--hx-muted, #8a8270);
    max-width: 22rem;
}
/* Third state of the same slot ("moving to X when you save") — same purple tint, so the stage control keeps
   one identity from offer → confirm → pending. */
.ld__stage-pending[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-left: auto;
    font-size: 0.85rem;
    color: #b79ae0;
    background: linear-gradient(135deg, rgba(146,110,196,.16), rgba(146,110,196,.03));
    border: 1px solid rgba(146,110,196,.4);
    border-radius: 4px;
    padding: 0.7rem 0.9rem;
}
.ld__stage-pending strong[b-pweotox1zd] { color: #f6efdd; }
.ld__stage-pending-tent[b-pweotox1zd] { color: #d8cdb6; }
.ld__stage-undo[b-pweotox1zd] {
    background: none;
    border: none;
    color: var(--hx-muted, #8a8270);
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.78rem;
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
}
.ld__stage-undo:hover[b-pweotox1zd] { color: #b79ae0; }

/* ── Body layout ─────────────────────────────────────────── */
.ld__body[b-pweotox1zd] {
    display: flex;
    gap: 2.5rem;
    align-items: flex-start;
    padding-bottom: 6rem; /* space for sticky submit bar */
}

.ld__main[b-pweotox1zd] {
    flex: 1;
    min-width: 0;
}

/* ── Sections ────────────────────────────────────────────── */
.ld__section[b-pweotox1zd] {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--hx-border, #1e1e1e);
}

.ld__section:last-child[b-pweotox1zd] {
    border-bottom: none;
}

.ld__section-title[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1rem;
    letter-spacing: 0.1em;
    /* Section headers gold, app-wide header treatment (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ld__sub-title[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hx-muted);
    margin: 1.25rem 0 0.75rem;
}

/* Fed: Liquid | Dry toggle — flips the dose unit + hides water/runoff for a dry top-dress. */
/* Feed type — a clean radio group (operator, 2026-07-17: the emoji segmented buttons read as jarring). */
.ld__feed-type[b-pweotox1zd] { display: inline-flex; gap: 0.5rem; margin-bottom: 0.85rem; }
.ld__feed-radio[b-pweotox1zd] {
    display: inline-flex; align-items: center; gap: 0.45rem;
    padding: 0.4rem 0.85rem;
    border: 1px solid var(--hx-border, #333); border-radius: 8px;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem;
    color: var(--hx-muted); cursor: pointer;
    transition: border-color 0.12s, color 0.12s, background 0.12s;
}
.ld__feed-radio:hover[b-pweotox1zd] { border-color: var(--hx-fg, #ccc); }
.ld__feed-radio.is-active[b-pweotox1zd] {
    border-color: var(--hx-gold, #e8c46c);
    color: var(--hx-fg, #f6efdd);
    background: rgba(232, 196, 108, 0.08);
}
.ld__feed-radio input[b-pweotox1zd] { accent-color: var(--hx-gold, #e8c46c); margin: 0; cursor: pointer; }

/* Nutrients fed — a dropdown of matching-form nutes; each pick drops in as a dose row (operator, 2026-07-18,
   scales to a 10-20 item shelf where a checklist would be a wall). */
.ld__feed-empty[b-pweotox1zd] { font-size: 0.85rem; color: var(--hx-text-2, #d8cdb6); margin: 0 0 0.5rem; }
.ld__feed-link[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); }
.ld__feed-add[b-pweotox1zd] { max-width: 22rem; margin-bottom: 0.85rem; cursor: pointer; }
.ld__feed-lines[b-pweotox1zd] { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: 0.85rem; }
/* Each nute is its own feeding block — product header + its pour/runoff (or grams for dry). */
.ld__feed-block[b-pweotox1zd] {
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--hx-border, #2a2a2a); border-radius: 8px;
    background: rgba(232, 196, 108, 0.05);
}
.ld__feed-block-head[b-pweotox1zd] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.6rem; }
.ld__feed-product-select[b-pweotox1zd] { flex: 1 1 auto; min-width: 0; cursor: pointer; }
.ld__feed-product[b-pweotox1zd] { min-width: 0; font-size: 0.9rem; font-weight: 600; color: var(--hx-fg, #f6efdd); }
.ld__feed-x[b-pweotox1zd] {
    flex: 0 0 auto; background: none; border: 0; cursor: pointer;
    color: var(--hx-muted, #8a8270); font-size: 0.8rem; line-height: 1; padding: 0.2rem 0.3rem;
}
.ld__feed-x:hover[b-pweotox1zd] { color: #e0863c; }

/* ── Plant section ───────────────────────────────────────── */
.ld__plant-name[b-pweotox1zd] {
    font-size: 2rem;
    color: var(--hx-fg, #fff);
}

.ld__plant-dot[b-pweotox1zd] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hx-gold, #d4af37);
    flex-shrink: 0;
}

/* ── Fields ──────────────────────────────────────────────── */
.ld__field[b-pweotox1zd] {
    margin-bottom: 1rem;
}

.ld__field:last-child[b-pweotox1zd] { margin-bottom: 0; }

.ld__label[b-pweotox1zd] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hx-muted);
    margin-bottom: 0.4rem;
}

.ld__field-row[b-pweotox1zd] {
    display: flex;
    gap: 1rem;
}

.ld__field-row .ld__field[b-pweotox1zd] {
    flex: 1;
}

.ld__input-unit[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0;
}

.ld__input-unit .hx-input[b-pweotox1zd] {
    border-radius: 4px 0 0 4px;
    flex: 1;
    min-width: 3rem;
}

/* The unit chip (°F, %, in…) already labels these fields, so the native
   number spinners are redundant — and they overlap/clip the value in the
   narrow two-column rows. Hide them so the number gets the full width. */
.ld__input-unit .hx-input[b-pweotox1zd]::-webkit-outer-spin-button,
.ld__input-unit .hx-input[b-pweotox1zd]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.ld__input-unit .hx-input[type="number"][b-pweotox1zd] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* A unit the grower PICKS rather than reads — sits where the static .ld__unit chip would, so the field keeps
   its shape whether the unit is fixed (°F, mS) or chosen (mL/L/gal). */
.ld__unit-select[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-fg, #f6efdd);
    background: var(--hx-surface-2, #1a1a1a);
    border: 1px solid var(--hx-border, #333);
    border-left: none;
    padding: 0 0.4rem;
    height: 2.4rem;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
}
.ld__unit-select:hover[b-pweotox1zd] { border-color: var(--hx-gold, #e8c46c); }

.ld__unit[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    background: var(--hx-surface-2, #1a1a1a);
    border: 1px solid var(--hx-border, #333);
    border-left: none;
    padding: 0 0.6rem;
    height: 2.4rem;
    display: flex;
    align-items: center;
    border-radius: 0 4px 4px 0;
    white-space: nowrap;
}

.ld__note[b-pweotox1zd] {
    resize: vertical;
    min-height: 13rem;
}

.ld__env-note[b-pweotox1zd] {
    font-size: 0.72rem;
    color: var(--hx-muted);
    line-height: 1.45;
    margin: 0.25rem 0 1rem;
}

.ld__plant-eyebrow[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-family: 'Space Mono', monospace;
    /* Plant name eyebrow bumped up for presence (operator, 2026-07-26) — was 0.72rem. */
    font-size: 1rem;
    letter-spacing: 0.08em;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.35rem;
}

/* ── Optional environment group (doesn't count toward 100%) ── */
.ld__env-optional[b-pweotox1zd] {
    margin-top: 1rem;
    padding: 0.85rem 0.9rem 0.95rem;
    background: rgba(255, 255, 255, 0.025);
    border: 1px dashed rgba(255, 255, 255, 0.12);
    border-radius: 8px;
}
.ld__env-optional-head[b-pweotox1zd] {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.7rem;
}
.ld__env-optional-tag[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: #8a8270;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 3px;
    padding: 0.15rem 0.45rem;
}
.ld__env-optional-hint[b-pweotox1zd] {
    font-size: 0.72rem;
    color: var(--hx-muted, #8a8270);
}

/* Per-field note inside OPTIONAL — reassures that a blank field costs nothing (e.g. height under LST). */
.ld__field-hint[b-pweotox1zd] {
    font-size: 0.68rem;
    color: var(--hx-muted, #8a8270);
    line-height: 1.45;
    margin: 0.35rem 0 0;
}

.ld__note-tools[b-pweotox1zd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 0.4rem;
}

.ld__char-count[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    color: var(--hx-muted);
    text-align: right;
    margin: 0;
}

/* ── Auto comment quick-fill ─────────────────────────────── */
.ld__autocomment[b-pweotox1zd] {
    position: relative;
}
.ld__autocomment-btn[b-pweotox1zd] {
    background: rgba(255,255,255,.03);
    border: 1px solid var(--hx-border, #333);
    color: #b0a890;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
    border-radius: 4px;
    padding: 0.4rem 0.7rem;
    cursor: pointer;
    transition: border-color .15s, color .15s;
    white-space: nowrap;
}
.ld__autocomment-btn:hover[b-pweotox1zd] {
    border-color: rgba(232,196,108,.5);
    color: #e8c46c;
}
.ld__autocomment-menu[b-pweotox1zd] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 20;
    min-width: 12rem;
    background: #14130f;
    border: 1px solid rgba(232,196,108,.25);
    border-radius: 6px;
    padding: 0.3rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 24px rgba(0,0,0,.5);
}
.ld__autocomment-item[b-pweotox1zd] {
    background: none;
    border: none;
    text-align: left;
    color: #d8cdb6;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.85rem;
    padding: 0.5rem 0.6rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background .12s, color .12s;
}
.ld__autocomment-item:hover[b-pweotox1zd] {
    background: rgba(232,196,108,.12);
    color: #f6efdd;
}

/* ── Action chips ────────────────────────────────────────── */
.ld__action-chips[b-pweotox1zd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Pill wrapper = the frame (chip + optional ✕ as one unit). Active/focused state lives here. */
.ld__action-pill[b-pweotox1zd] {
    display: inline-flex;
    align-items: center;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #2a2a2a);
    border-radius: 100px;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.ld__action-pill:hover[b-pweotox1zd] { border-color: var(--hx-fg, #ccc); }
.ld__action-pill.is-active[b-pweotox1zd] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.08);
}
/* The one whose detail box is currently open — a stronger ring so you know where your fields belong. */
.ld__action-pill.is-focused[b-pweotox1zd] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.16);
    box-shadow: inset 0 0 0 1px rgba(212, 175, 55, 0.5);
}

.ld__action-chip[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.85rem;
    background: transparent;
    border: 0;
    border-radius: 100px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    color: var(--hx-muted);
    cursor: pointer;
    transition: color 0.15s;
    white-space: nowrap;
}
.ld__action-pill:hover .ld__action-chip[b-pweotox1zd] { color: var(--hx-fg, #fff); }
.ld__action-pill.is-active .ld__action-chip[b-pweotox1zd] { color: var(--hx-gold, #d4af37); }

/* Remove — the deliberate uncheck. A plain tap on the pill only ever checks + focuses. */
.ld__action-x[b-pweotox1zd] {
    background: transparent;
    border: 0;
    color: var(--hx-muted, #8a8270);
    cursor: pointer;
    font-size: 0.72rem;
    line-height: 1;
    padding: 0.5rem 0.7rem 0.5rem 0.15rem;
}
.ld__action-x:hover[b-pweotox1zd] { color: #e0863c; }

.ld__action-icon[b-pweotox1zd] {
    font-size: 0.85rem;
    line-height: 1;
}

.ld__actions-hint[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.78rem;
    color: var(--hx-muted, #8a8270);
    margin: 0 0 0.75rem;
}

/* Caption under a stable sub-title (e.g. the liquid panel's "covers…" line). */
.ld__sub-note[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.76rem;
    color: var(--hx-muted, #8a8270);
    margin: 0 0 0.9rem;
}

/* ── Water detail panel ──────────────────────────────────── */
.ld__water-detail[b-pweotox1zd] {
    background: var(--hx-surface-1, #0e0e0e);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 1rem;
    margin-top: 1rem;
}

/* ── Environment sidebar ─────────────────────────────────── */
.ld__env[b-pweotox1zd] {
    width: 280px;
    flex-shrink: 0;
}

.ld__env-card[b-pweotox1zd] {
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 1.25rem;
    margin-bottom: 0;
    border-bottom: none;
}

/* ── VPD display ─────────────────────────────────────────── */
.ld__vpd[b-pweotox1zd] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    border-radius: 4px;
    margin: 0.75rem 0 1rem;
    border: 1px solid var(--hx-border, #333);
}

.ld__vpd-value[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    letter-spacing: 0.04em;
}

.ld__vpd-unit[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
}

.ld__vpd-label[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    margin-left: auto;
}

/* Always-visible blank state — VPD sits waiting for temp + humidity, so
   beginners learn it matters (and that both values feed it) before they
   ever fill it in. */
.ld__vpd--blank[b-pweotox1zd] {
    border-style: dashed;
    border-color: rgba(255,255,255,0.14);
    color: var(--hx-muted, #8a8270);
    opacity: 0.85;
}
.ld__vpd--blank .ld__vpd-value[b-pweotox1zd] { color: var(--hx-muted, #8a8270); }

.ld__vpd-learn[b-pweotox1zd] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: #8a8270;
    text-decoration: none;
    margin: -0.5rem 0 1rem;
    letter-spacing: 0.02em;
    line-height: 1.4;
    transition: color 0.15s;
}
.ld__vpd-learn:hover[b-pweotox1zd] { color: #e8c46c; }

/* VPD gauge scale — the one place red is intended: red (fix it) → amber (caution) → green (dialed in).
   A diagnostic, not a celebration surface, so it speaks the universal grower language, not the brand gold. */
.vpd-good[b-pweotox1zd]    { border-color: #6bcf7f55; color: #6bcf7f; background: rgba(107,207,127,0.06); }
.vpd-caution[b-pweotox1zd] { border-color: #ffb02e66; color: #ffb02e; background: rgba(255,176,46,0.06); }
.vpd-danger[b-pweotox1zd]  { border-color: #ff453a66; color: #ff453a; background: rgba(255,69,58,0.07); }

/* ── Submit bar ──────────────────────────────────────────── */
.ld__submit-bar[b-pweotox1zd] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--hx-bg, #000);
    border-top: 1px solid var(--hx-border, #222);
    padding: 0.85rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    z-index: 50;
}

.ld__submit-actions[b-pweotox1zd] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

.ld__error[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: #ff453a;
    text-align: right;
    margin: 0;
}

/* ── Photo upload (multi-photo, doc 17) ──────────────────── */
.ld__photo-col[b-pweotox1zd] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}

.ld__photo-side[b-pweotox1zd] {
    flex-shrink: 0;
    width: 320px;
}

.ld__label-hint[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    color: var(--hx-muted);
    letter-spacing: 0.04em;
    text-transform: none;
}

.ld__photos-grid[b-pweotox1zd] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.6rem;
    margin-top: 0.35rem;
}

/* Each slot: thumbnail + type picker below, star + remove overlaid. */
.ld__photo-slot[b-pweotox1zd] {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--hx-border, #333);
    background: rgba(255,255,255,0.02);
}

.ld__photo-slot.is-primary[b-pweotox1zd] {
    border-color: var(--hx-gold, #e8c46c);
    box-shadow: 0 0 0 1px var(--hx-gold, #e8c46c);
}

.ld__photo-thumb[b-pweotox1zd] {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    cursor: pointer;
}

.ld__photo-star[b-pweotox1zd],
.ld__photo-x[b-pweotox1zd] {
    position: absolute;
    top: 0.3rem;
    background: rgba(0,0,0,0.62);
    border: none;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    line-height: 1;
    padding: 0.22rem 0.36rem;
}

.ld__photo-star[b-pweotox1zd] {
    left: 0.3rem;
    font-size: 0.95rem;
    color: #d8d2c4;
}

.ld__photo-star.is-on[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); }

.ld__photo-x[b-pweotox1zd] {
    right: 0.3rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
}

.ld__photo-x:hover[b-pweotox1zd] { background: rgba(255,69,58,0.85); }

.ld__photo-type[b-pweotox1zd] {
    width: 100%;
    border: none;
    border-top: 1px solid var(--hx-border, #333);
    background: rgba(0,0,0,0.35);
    color: var(--hx-fg, #fff);
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.02em;
    padding: 0.34rem 0.4rem;
    cursor: pointer;
}

/* Add tile — mirrors slot dimensions so the grid stays even. */
.ld__photo-add[b-pweotox1zd] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    aspect-ratio: 1 / 1;
    border: 1px dashed var(--hx-border, #333);
    border-radius: 6px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    text-align: center;
}

.ld__photo-add:hover[b-pweotox1zd] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.04);
}

.ld__photo-add-icon[b-pweotox1zd] { font-size: 1.5rem; line-height: 1; }

.ld__photo-add-label[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.75rem;
    color: var(--hx-fg, #fff);
}

/* Quiet spec line under the label — guidance, not an instruction. Sits in the technical
   monospace register and stays well below the label in contrast so the tile still reads
   as one button. Drops out on the narrowest tiles, where it would crowd the icon. */
.ld__photo-add-spec[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.58rem;
    line-height: 1.45;
    letter-spacing: 0.02em;
    color: var(--hx-muted, #8a8377);
    opacity: 0.75;
    padding: 0 0.35rem;
}

@media (max-width: 380px) {
    .ld__photo-add-spec[b-pweotox1zd] { display: none; }
}

.ld__photo-error[b-pweotox1zd] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: #ff453a;
    margin-top: 0.4rem;
}

/* ── Larger photo preview — a modest centered card (doc 17) ── */
.ld__zoom[b-pweotox1zd] {
    position: fixed;
    inset: 0;
    z-index: 300;
    background: rgba(4, 4, 3, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.ld__zoom-card[b-pweotox1zd] {
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 10px;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    max-width: min(520px, 92vw);
}

.ld__zoom-head[b-pweotox1zd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.ld__zoom-cap[b-pweotox1zd] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.74rem;
    letter-spacing: 0.03em;
    color: #d8d2c4;
}

.ld__zoom-star[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); }

/* Scaled-up view of the same photo — whole image, comfortably larger than the thumbnail. */
.ld__zoom-img[b-pweotox1zd] {
    width: 100%;
    max-height: 60vh;
    object-fit: contain;
    border-radius: 6px;
    display: block;
}

.ld__zoom-close[b-pweotox1zd] {
    flex-shrink: 0;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 6px;
    color: #fff;
    font-size: 0.85rem;
    line-height: 1;
    padding: 0.35rem 0.5rem;
    cursor: pointer;
    transition: background 0.15s;
}

.ld__zoom-close:hover[b-pweotox1zd] { background: rgba(255,255,255,0.14); }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 800px) {
    .ld__body[b-pweotox1zd] {
        flex-direction: column;
        /* align-items is CROSS-axis: the base `flex-start` aligns tops in a row, but once stacked it means
           "don't stretch horizontally" and the flex:1 main column collapses to its content width. */
        align-items: stretch;
    }

    .ld__env[b-pweotox1zd] {
        width: 100%;
    }

    .ld__submit-actions[b-pweotox1zd] {
        justify-content: stretch;
        flex-direction: column-reverse;
    }

    .ld__submit-actions .hx-btn[b-pweotox1zd] {
        width: 100%;
        text-align: center;
    }

    .ld__photo-col[b-pweotox1zd] {
        flex-direction: column;
        align-items: stretch;
    }

    .ld__photo-side[b-pweotox1zd] {
        width: 100%;
    }

    .ld__photos-grid[b-pweotox1zd] {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ── Progression card (doc 24): the slot-style payoff after a new log lands ──────────── */
.ld__progress-overlay[b-pweotox1zd] {
    position: fixed; inset: 0; z-index: 60;
    display: flex; align-items: center; justify-content: center;
    padding: 1.25rem;
    background: rgba(8, 6, 3, 0.72);
    -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
    animation: ld-progress-fade-b-pweotox1zd 0.25s ease;
}
.ld__progress-card[b-pweotox1zd] {
    width: 100%; max-width: 26rem;
    display: flex; flex-direction: column; align-items: center; gap: 1rem;
    text-align: center;
    padding: 2rem 1.6rem 1.7rem;
    border-radius: 18px;
    background: radial-gradient(ellipse at 50% -10%, rgba(108,191,122,0.16), transparent 60%), var(--hx-surface-1, #14110c);
    border: 1px solid var(--hx-border, #2a2820);
    box-shadow: 0 24px 60px rgba(0,0,0,0.55), 0 0 40px rgba(108,191,122,0.12);
    animation: ld-progress-pop-b-pweotox1zd 0.3s cubic-bezier(0.2, 0.8, 0.3, 1.2);
}
.ld__progress-eyebrow[b-pweotox1zd] {
    font-family: 'Space Mono', monospace; font-size: 0.8rem; letter-spacing: 0.16em;
    color: var(--hx-green, #6cbf7a); margin: 0;
}
.ld__progress-line[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 1rem; color: var(--hx-text-2, #cbc3b0); margin: 0.2rem 0 0;
}
.ld__progress-next[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem; color: var(--hx-text-2, #cbc3b0);
    background: rgba(232,196,108,0.08); border: 1px solid rgba(232,196,108,0.25);
    border-radius: 10px; padding: 0.7rem 0.9rem; margin: 0.1rem 0 0;
}
.ld__progress-next-label[b-pweotox1zd] {
    display: block; font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.1em;
    color: var(--hx-gold, #e8c46c); margin-bottom: 0.2rem;
}
.ld__progress-actions[b-pweotox1zd] { width: 100%; display: flex; flex-direction: column; gap: 0.55rem; margin-top: 0.4rem; }
.ld__progress-btn[b-pweotox1zd] { width: 100%; }
.ld__progress-cta[b-pweotox1zd] { width: 100%; }
/* On a beat with a CTA, the continue control reads as the quiet secondary. */
.ld__progress-actions .ld__progress-btn:not(.hx-btn-primary)[b-pweotox1zd] {
    background: transparent; color: var(--hx-text-2, #cbc3b0);
    font-size: 0.85rem; padding-top: 0.35rem; padding-bottom: 0.35rem;
}

/* Beat cards — non-floor beats (climb, maxed, stage-up), styled by magnitude. */
/* ── The default win scene: any beat without a bespoke set-piece ──────────── */
.ld__win[b-pweotox1zd] { display: flex; flex-direction: column; align-items: center; gap: 0.15rem; }

/* Celebratory eyebrow — the "this is a reward" cue the plain fallback was missing. */
.ld__win-eyebrow[b-pweotox1zd] {
    font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.18em;
    color: var(--hx-gold, #e8c46c); opacity: 0.85; margin: 0;
}
/* Names the kind of win at a glance. Gentle float — celebration, not an alert. */
.ld__win-glyph[b-pweotox1zd] {
    font-size: 2.6rem; line-height: 1; margin: 0.35rem 0 0.1rem;
    filter: drop-shadow(0 0 18px rgba(232,196,108,0.35));
    animation: ld-win-pop-b-pweotox1zd 0.5s cubic-bezier(.2,1.4,.4,1) both;
}
@keyframes ld-win-pop-b-pweotox1zd {
    from { transform: scale(0.4) rotate(-12deg); opacity: 0; }
    to   { transform: scale(1) rotate(0); opacity: 1; }
}

.ld__beat-title[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.2rem, 9vw, 3rem); letter-spacing: 0.03em;
    line-height: 1; margin: 0.3rem 0 0; color: var(--hx-green, #6cbf7a);
    text-shadow: 0 0 26px rgba(108,191,122,0.3);
}
/* Body face, not Bebas: this line carries a full sentence of teaching, and a paragraph set in condensed
   display caps reads as a system notice rather than praise (operator, 2026-07-28). */
.ld__beat-detail[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.95rem; line-height: 1.55;
    letter-spacing: 0; text-transform: none;
    color: var(--hx-text-muted, #b8b0a0); margin: 0.5rem 0 0; max-width: 30rem;
}

@media (prefers-reduced-motion: reduce) {
    .ld__win-glyph[b-pweotox1zd] { animation: none; }
}
/* Magnitude → colour + intensity: Small = green, Medium/Jackpot = gold; Jackpot glows. */
.ld__progress-card--medium .ld__beat-title[b-pweotox1zd],
.ld__progress-card--jackpot .ld__beat-title[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); text-shadow: 0 0 30px rgba(232,196,108,0.4); }
.ld__progress-card--jackpot[b-pweotox1zd] {
    border-color: var(--hx-gold, #e8c46c);
    background: radial-gradient(ellipse at 50% -10%, rgba(232,196,108,0.24), transparent 62%), var(--hx-surface-1, #14110c);
    box-shadow: 0 24px 60px rgba(0,0,0,0.55), 0 0 46px rgba(232,196,108,0.3);
}

/* Queue position dots. */
.ld__progress-dots[b-pweotox1zd] { display: flex; gap: 0.4rem; margin-bottom: 0.1rem; }
.ld__progress-dot[b-pweotox1zd] { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--hx-border, #2a2820); transition: background 0.2s; }
.ld__progress-dot.is-on[b-pweotox1zd] { background: var(--hx-gold, #e8c46c); }

/* ── The stage-transition scene (doc 24 §3b): a stage-up rendered as a marquee level-up ── */
.ld__scene[b-pweotox1zd] { display: flex; flex-direction: column; align-items: center; gap: 0.6rem; width: 100%; }
.ld__scene-eyebrow[b-pweotox1zd] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.22em;
    color: var(--hx-gold, #e8c46c); margin: 0;
    animation: ld-scene-flash-b-pweotox1zd 1.4s ease-in-out infinite;
}
.ld__scene-glyph[b-pweotox1zd] {
    font-size: 3.4rem; line-height: 1; margin: 0.1rem 0 0;
    filter: drop-shadow(0 0 22px rgba(232,196,108,0.5));
    animation: ld-scene-rise-b-pweotox1zd 0.5s cubic-bezier(0.2, 0.8, 0.3, 1.3) both;
}
.ld__scene-title[b-pweotox1zd] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.4rem, 10vw, 3.4rem); letter-spacing: 0.03em;
    line-height: 1; margin: 0; color: var(--hx-gold, #e8c46c); text-shadow: 0 0 32px rgba(232,196,108,0.45);
}
/* The stage rail — nodes fill up to the one just reached, which pulses. */
.ld__scene-track[b-pweotox1zd] { display: flex; align-items: flex-start; justify-content: center; gap: 0; width: 100%; margin: 0.3rem 0 0.1rem; }
.ld__scene-node[b-pweotox1zd] { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ld__scene-node[b-pweotox1zd]::before {
    content: ""; position: absolute; top: 0.34rem; right: 50%; width: 100%; height: 2px;
    background: var(--hx-border, #2a2820);
}
.ld__scene-node:first-child[b-pweotox1zd]::before { display: none; }
.ld__scene-node.is-on[b-pweotox1zd]::before { background: var(--hx-gold, #e8c46c); }
.ld__scene-node-dot[b-pweotox1zd] {
    position: relative; z-index: 1; width: 0.72rem; height: 0.72rem; border-radius: 50%;
    background: var(--hx-border, #2a2820); border: 2px solid var(--hx-surface-1, #14110c);
}
.ld__scene-node.is-on .ld__scene-node-dot[b-pweotox1zd] { background: var(--hx-gold, #e8c46c); }
.ld__scene-node.is-now .ld__scene-node-dot[b-pweotox1zd] {
    box-shadow: 0 0 0 4px rgba(232,196,108,0.28); animation: ld-scene-pulse-b-pweotox1zd 1.3s ease-in-out infinite;
}
.ld__scene-node-label[b-pweotox1zd] {
    font-family: 'Space Mono', monospace; font-size: 0.6rem; letter-spacing: 0.06em;
    color: var(--hx-text-2, #cbc3b0);
}
.ld__scene-node.is-now .ld__scene-node-label[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); }
.ld__scene-blurb[b-pweotox1zd] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.95rem; line-height: 1.4;
    color: var(--hx-text-2, #cbc3b0); margin: 0.2rem 0 0;
}

@keyframes ld-progress-fade-b-pweotox1zd { from { opacity: 0; } }
@keyframes ld-progress-pop-b-pweotox1zd { from { opacity: 0; transform: translateY(12px) scale(0.96); } }
@keyframes ld-scene-flash-b-pweotox1zd { 0%, 100% { opacity: 0.55; } 50% { opacity: 1; } }
@keyframes ld-scene-rise-b-pweotox1zd { from { opacity: 0; transform: translateY(14px) scale(0.7); } }
@keyframes ld-scene-pulse-b-pweotox1zd { 0%, 100% { box-shadow: 0 0 0 4px rgba(232,196,108,0.28); } 50% { box-shadow: 0 0 0 7px rgba(232,196,108,0.12); } }
@media (prefers-reduced-motion: reduce) {
    .ld__progress-overlay[b-pweotox1zd], .ld__progress-card[b-pweotox1zd],
    .ld__scene-eyebrow[b-pweotox1zd], .ld__scene-glyph[b-pweotox1zd], .ld__scene-node.is-now .ld__scene-node-dot[b-pweotox1zd] { animation: none; }
}

/* ── Harvest/Cure — the daily log is closed after harvest (doc 09 terminal) ── */
.ld__harvest-closed[b-pweotox1zd] {
    max-width: 34rem;
    margin: 2.5rem auto;
    padding: 2.5rem 2rem;
    text-align: center;
    border: 1px solid var(--hx-border, #2a2820);
    border-radius: 1rem;
    background: radial-gradient(ellipse at 50% -20%, rgba(232,196,108,0.10), transparent 60%), var(--hx-surface-1, #14110c);
}
.ld__harvest-icon[b-pweotox1zd]  { font-size: 2.6rem; display: block; }
.ld__harvest-title[b-pweotox1zd] {
    font-family: var(--hx-font-display, 'Bebas Neue'), sans-serif;
    font-size: clamp(1.7rem, 5vw, 2.4rem);
    letter-spacing: 0.04em;
    color: var(--hx-gold, #e8c46c);
    margin: 0.6rem 0 0.9rem;
}
.ld__harvest-msg[b-pweotox1zd] { color: var(--hx-text, #e8e4d8); line-height: 1.6; margin: 0 0 0.75rem; }
.ld__harvest-sub[b-pweotox1zd] { color: var(--hx-text-dim, #9a9484); font-size: 0.9rem; margin: 0 0 1.5rem; }
.ld__harvest-back[b-pweotox1zd] { display: inline-block; }

/* ── HaxPoints finale tally beat (doc 25) ─────────────────── */
.ld__hax[b-pweotox1zd] { text-align: center; padding: 0.4rem 0; }
.ld__hax-eyebrow[b-pweotox1zd] { font-family: 'Space Mono', monospace; font-size: 0.65rem; letter-spacing: 0.18em; color: var(--hx-gold, #e8c46c); margin: 0 0 0.4rem; }
.ld__hax-amount[b-pweotox1zd] { font-family: 'Bebas Neue', sans-serif; font-size: 3.4rem; line-height: 1; color: var(--hx-gold, #e8c46c); }
/* Itemized "what earned it" receipt — so +85 reads as "30-day streak + 14-day + 7-day", not mystery points. */
.ld__hax-breakdown[b-pweotox1zd] { list-style: none; margin: 0.9rem auto 0; padding: 0; max-width: 260px; text-align: left; }
.ld__hax-line[b-pweotox1zd] { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 0.28rem 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.ld__hax-line:last-child[b-pweotox1zd] { border-bottom: none; }
.ld__hax-line-label[b-pweotox1zd] { font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.02em; color: var(--hx-text-caption-2, #b8b09a); }
.ld__hax-line-pts[b-pweotox1zd] { font-family: 'Bebas Neue', sans-serif; font-size: 1.05rem; color: var(--hx-gold, #e8c46c); flex-shrink: 0; }
.ld__hax-breakdown--onbelt[b-pweotox1zd] { margin-top: 0.7rem; }
.ld__hax-breakdown--onbelt .ld__hax-line[b-pweotox1zd] { border-color: rgba(255,255,255,.1); }

.ld__hax-belt[b-pweotox1zd] { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 0.6rem; font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: 0.04em; color: var(--hx-text-heading, #f6efdd); }
.ld__hax-chip[b-pweotox1zd] { width: 2rem; height: 0.6rem; border-radius: 3px; border: 1px solid rgba(255,255,255,.25); }
.ld__hax-bar[b-pweotox1zd] { height: 8px; border-radius: 99px; background: rgba(255,255,255,.1); overflow: hidden; margin: 0.9rem auto 0.4rem; max-width: 240px; }
.ld__hax-bar-fill[b-pweotox1zd] { height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--hx-gold-3, #b8912f), var(--hx-gold, #e8c46c)); }
.ld__hax-next[b-pweotox1zd] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-muted, #9a927e); margin: 0; }
.ld__hax-next strong[b-pweotox1zd] { color: var(--hx-gold, #e8c46c); }
.ld__hax-chip--white[b-pweotox1zd]  { background: #f2ecda; }
.ld__hax-chip--yellow[b-pweotox1zd] { background: #e8c46c; }
.ld__hax-chip--orange[b-pweotox1zd] { background: #e0863c; }
.ld__hax-chip--green[b-pweotox1zd]  { background: #6cbf7a; }
.ld__hax-chip--blue[b-pweotox1zd]   { background: #6ba8d8; }
.ld__hax-chip--brown[b-pweotox1zd]  { background: #9c6b3f; }
.ld__hax-chip--black[b-pweotox1zd]  { background: #2b2b2b; }

/* ── Belt-up marquee (doc 25 §7) — the "Whoa!" ceremony when a log crosses a belt ─── */
.ld__beltup[b-pweotox1zd] { text-align: center; padding: 0.6rem 0; animation: ld-beltup-glow-b-pweotox1zd 2.4s ease-in-out infinite; }
@keyframes ld-beltup-glow-b-pweotox1zd { 0%,100% { filter: drop-shadow(0 0 0 rgba(232,196,108,0)); } 50% { filter: drop-shadow(0 0 18px rgba(232,196,108,.55)); } }
.ld__beltup-eyebrow[b-pweotox1zd] { font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.25em; color: var(--hx-gold, #e8c46c); margin: 0 0 0.6rem; }
.ld__beltup-chip[b-pweotox1zd] { display: block; width: 4.5rem; height: 1rem; border-radius: 4px; margin: 0 auto 0.7rem; border: 1px solid rgba(255,255,255,.3); }
.ld__beltup-title[b-pweotox1zd] { font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; line-height: 1; letter-spacing: 0.03em; color: var(--hx-gold, #e8c46c); margin: 0; text-shadow: 0 0 20px rgba(232,196,108,.4); }
.ld__beltup-amount[b-pweotox1zd] { font-family: 'Space Mono', monospace; font-size: 0.85rem; color: var(--hx-text-heading, #f6efdd); margin-top: 0.7rem; }
.ld__beltup-ladder[b-pweotox1zd] { display: flex; justify-content: center; gap: 0.4rem; margin-top: 1rem; }
.ld__beltup-rung[b-pweotox1zd] { width: 12px; height: 12px; border-radius: 99px; border: 1px solid var(--hx-border, #2a2820); display: flex; align-items: center; justify-content: center; opacity: 0.35; }
.ld__beltup-rung.is-on[b-pweotox1zd] { opacity: 1; }
.ld__beltup-rung.is-now[b-pweotox1zd] { transform: scale(1.5); box-shadow: 0 0 10px rgba(232,196,108,.7); }
.ld__beltup-dot[b-pweotox1zd] { width: 8px; height: 8px; border-radius: 99px; }
.ld__beltup-dot--white[b-pweotox1zd]  { background: #f2ecda; }
.ld__beltup-dot--yellow[b-pweotox1zd] { background: #e8c46c; }
.ld__beltup-dot--orange[b-pweotox1zd] { background: #e0863c; }
.ld__beltup-dot--green[b-pweotox1zd]  { background: #6cbf7a; }
.ld__beltup-dot--blue[b-pweotox1zd]   { background: #6ba8d8; }
.ld__beltup-dot--brown[b-pweotox1zd]  { background: #9c6b3f; }
.ld__beltup-dot--black[b-pweotox1zd]  { background: #2b2b2b; }
.ld__beltup-chip--white[b-pweotox1zd]  { background: #f2ecda; }
.ld__beltup-chip--yellow[b-pweotox1zd] { background: #e8c46c; }
.ld__beltup-chip--orange[b-pweotox1zd] { background: #e0863c; }
.ld__beltup-chip--green[b-pweotox1zd]  { background: #6cbf7a; }
.ld__beltup-chip--blue[b-pweotox1zd]   { background: #6ba8d8; }
.ld__beltup-chip--brown[b-pweotox1zd]  { background: #9c6b3f; }
.ld__beltup-chip--black[b-pweotox1zd]  { background: #2b2b2b; }
@media (prefers-reduced-motion: reduce) { .ld__beltup[b-pweotox1zd] { animation: none; } }
/* /Components/Pages/Runs/NewRun.razor.rz.scp.css */
.nrw[b-h9f7stugjr] {
    max-width: 600px;
    margin: 0 auto;
    padding: var(--hx-space-10) var(--hx-space-5) var(--hx-space-10);
}

/* ── Blueprint pre-fill banner ─────────────────────────────────── */
.nrw__plan-banner[b-h9f7stugjr] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: linear-gradient(180deg, rgba(232,196,108,.09), rgba(255,255,255,.02));
    border: 1px solid rgba(232,196,108,.32);
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: var(--hx-space-6);
}
.nrw__plan-banner-text[b-h9f7stugjr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}
.nrw__plan-banner-eyebrow[b-h9f7stugjr] {
    font-family: 'Space Mono', monospace;
    font-size: 12px;
    color: #e8c46c;
    letter-spacing: .16em;
}
.nrw__plan-banner-name[b-h9f7stugjr] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 26px;
    color: #f6efdd;
    letter-spacing: .02em;
    line-height: 1;
}
.nrw__plan-banner-hint[b-h9f7stugjr] {
    font-size: 13.5px;
    color: #b0a890;
    line-height: 1.5;
    margin-top: 2px;
}
.nrw__plan-banner-clear[b-h9f7stugjr] {
    flex: none;
    background: none;
    border: none;
    color: #8a8270;
    font-size: 15px;
    cursor: pointer;
    padding: 2px 4px;
    line-height: 1;
    transition: color .15s;
}
.nrw__plan-banner-clear:hover[b-h9f7stugjr] { color: #e8c46c; }

/* ── Progress dots ─────────────────────────────────────────────── */
.nrw__progress[b-h9f7stugjr] {
    display: flex;
    gap: 10px;
    margin-bottom: var(--hx-space-8);
}

.nrw__dot[b-h9f7stugjr] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--hx-surface-2);
    transition: background 0.25s, transform 0.25s;
}

.nrw__dot.is-done[b-h9f7stugjr]  { background: rgba(212, 175, 55, 0.35); }
.nrw__dot.is-active[b-h9f7stugjr] { background: var(--hx-gold); transform: scale(1.4); }

/* ── Step header ───────────────────────────────────────────────── */
.nrw__step-label[b-h9f7stugjr] {
    font-family: var(--hx-font-mono);
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--hx-gold);
    margin: 0 0 var(--hx-space-2);
}

.nrw__headline[b-h9f7stugjr] {
    font-family: var(--hx-font-display);
    font-size: clamp(2.8rem, 7vw, 4.5rem);
    line-height: 0.95;
    color: var(--hx-text-heading);
    margin: 0 0 var(--hx-space-7);
    letter-spacing: 0.01em;
}

.nrw__sub[b-h9f7stugjr] {
    font-size: 15px;
    color: var(--hx-text-muted);
    margin: calc(-1 * var(--hx-space-4)) 0 var(--hx-space-6);
}

/* ── Form fields ───────────────────────────────────────────────── */
.nrw__body[b-h9f7stugjr] {
    display: flex;
    flex-direction: column;
    gap: var(--hx-space-6);
    margin-bottom: var(--hx-space-8);
}

.nrw__field label[b-h9f7stugjr] {
    display: block;
    font-family: var(--hx-font-mono);
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-text-muted);
    margin-bottom: var(--hx-space-2);
}

.nrw__required[b-h9f7stugjr] { color: var(--hx-gold); }
.nrw__optional[b-h9f7stugjr] { color: var(--hx-text-muted); opacity: 0.6; font-size: 12px; }

.nrw__hint[b-h9f7stugjr] {
    font-size: 13.5px;
    color: var(--hx-text-muted);
    margin: var(--hx-space-2) 0 0;
    line-height: 1.5;
}

/* Outdoor light = the sun; a friendly note stands in for the fixture picker. */
.hx-input--date[b-h9f7stugjr] { color-scheme: dark; }

/* ── Chip selectors ────────────────────────────────────────────── */
.nrw__chips[b-h9f7stugjr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--hx-space-2);
}

.nrw__chip[b-h9f7stugjr] {
    padding: 7px 18px;
    border: 1px solid var(--hx-border);
    border-radius: 999px;
    background: transparent;
    color: var(--hx-text-secondary);
    font-family: var(--hx-font-body);
    font-size: 14px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    line-height: 1;
}

.nrw__chip:hover[b-h9f7stugjr] {
    border-color: rgba(212, 175, 55, 0.4);
    color: var(--hx-text-heading);
}

.nrw__chip.is-active[b-h9f7stugjr] {
    border-color: var(--hx-gold);
    background: rgba(212, 175, 55, 0.1);
    color: var(--hx-gold);
}

.nrw__chip-hint[b-h9f7stugjr] {
    font-size: 11px;
    opacity: 0.7;
}

/* ── Goal cards ────────────────────────────────────────────────── */
.nrw__goals[b-h9f7stugjr] {
    display: flex;
    flex-direction: column;
    gap: var(--hx-space-3);
    margin-bottom: var(--hx-space-6);
}

.nrw__goal[b-h9f7stugjr] {
    padding: var(--hx-space-5) var(--hx-space-5);
    border: 1px solid var(--hx-border);
    border-radius: var(--hx-radius-md);
    background: var(--hx-surface-1);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
    text-align: left;
    width: 100%;
    position: relative;
}

.nrw__goal:hover[b-h9f7stugjr] {
    border-color: rgba(212, 175, 55, 0.4);
    background: var(--hx-surface-2);
    transform: translateY(-1px);
}

.nrw__goal.is-active[b-h9f7stugjr] {
    border-color: var(--hx-gold);
    background: rgba(212, 175, 55, 0.07);
}

.nrw__goal-name[b-h9f7stugjr] {
    font-family: var(--hx-font-display);
    font-size: 2rem;
    line-height: 1;
    color: var(--hx-text-heading);
    margin-bottom: var(--hx-space-2);
    transition: color 0.15s;
}

.nrw__goal.is-active .nrw__goal-name[b-h9f7stugjr] {
    color: var(--hx-gold);
}

.nrw__goal-desc[b-h9f7stugjr] {
    font-size: 13px;
    color: var(--hx-text-muted);
    line-height: 1.6;
}

/* ── Navigation ────────────────────────────────────────────────── */
.nrw__nav[b-h9f7stugjr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--hx-space-3);
}

.nrw__error[b-h9f7stugjr] {
    margin-top: var(--hx-space-4);
    font-size: 13px;
    color: #f87171;
}

/* ── Mobile ────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .nrw[b-h9f7stugjr] {
        padding: var(--hx-space-6) var(--hx-space-4) var(--hx-space-8);
    }

    .nrw__headline[b-h9f7stugjr] {
        font-size: 2.8rem;
    }
}
/* /Components/Pages/Runs/RunJournal.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────
   RunJournal — rj__ namespace
   ────────────────────────────────────────────────────────── */

/* ── Loading / Not Found ─────────────────────────────────── */
.rj__loading[b-sr9r9oypb8] {
    padding: 4rem 1.5rem;
    text-align: center;
}

.rj__loading-text[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    color: var(--hx-muted);
    font-size: 0.85rem;
    letter-spacing: 0.05em;
}

.rj__not-found[b-sr9r9oypb8] {
    padding: 4rem 1.5rem;
}

/* ── Header ──────────────────────────────────────────────── */
.rj__header[b-sr9r9oypb8] {
    background: var(--hx-surface-1, #0f0f0f);
    border-bottom: 1px solid var(--hx-border, #222);
    padding-bottom: 2rem;
    margin-bottom: 2.5rem;
}

.rj__header-inner[b-sr9r9oypb8] {
    padding-top: 1.5rem;
}

/* Stacked into distinct rows — breadcrumb, then the watching/follow line, then the chips —
   so the header reads as a sequence instead of one bloated wrapping row (operator, 2026-07-20).
   Works the same on mobile: it's already a column. */
.rj__header-meta[b-sr9r9oypb8] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.7rem;
    margin-bottom: 1.25rem;
}

.rj__back[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    text-decoration: none;
    letter-spacing: 0.05em;
    transition: color 0.15s;
}

.rj__back:hover[b-sr9r9oypb8] {
    color: var(--hx-gold, #d4af37);
}

.rj__chips-row[b-sr9r9oypb8] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.rj__chip[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.25rem 0.65rem;
    border: 1px solid var(--hx-border, #333);
    border-radius: 2px;
    color: var(--hx-muted);
}

.rj__chip--stage[b-sr9r9oypb8] {
    border-color: var(--hx-gold, #d4af37);
    color: var(--hx-gold, #d4af37);
}

.rj__chip--goal-1[b-sr9r9oypb8] { border-color: #4a9eff; color: #4a9eff; }
.rj__chip--goal-2[b-sr9r9oypb8] { border-color: #6bcf7f; color: #6bcf7f; }
.rj__chip--goal-3[b-sr9r9oypb8] {
    border-color: var(--hx-gold, #d4af37);
    color: var(--hx-gold, #d4af37);
    background: rgba(212, 175, 55, 0.08);
}

.rj__run-name[b-sr9r9oypb8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.5rem, 7vw, 4.5rem);
    letter-spacing: 0.04em;
    line-height: 1;
    color: var(--hx-fg, #fff);
    margin: 0 0 0.5rem;
}

.rj__theme[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.8rem;
    color: var(--hx-muted);
    margin: 0 0 1rem;
    font-style: italic;
}

/* Two aligned pills — a filled-gold DAY badge + an outlined date. Each glyph is centered in its own
   box (align-items:center + line-height:1), so the Bebas/Mono baseline mismatch no longer shows.
   `stretch` makes the date pill match the (taller) DAY pill's height exactly. */
/* Day/date badge + the run-level "+ Add grow" action share a row, so Add grow reads as a run metric. */
.rj__day-row[b-sr9r9oypb8] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.rj__day-badge[b-sr9r9oypb8] {
    display: flex;
    align-items: stretch;
    gap: 0.4rem;
}

/* Nudge the moved button to sit a touch off the date box (the row gap already spaces them). */
.rj__day-add[b-sr9r9oypb8] {
    align-self: center;
}

/* The grow's day count, beside its name (moved out of the run header, operator 2026-08-02 — the value is
   per-plant, so it can't live among run-level facts). Keeps the filled-gold treatment it had: it's still the
   grow's headline number, just correctly attached. "RAN N DAYS" once harvested — a total, not a position. */
.rj__grow-day[b-sr9r9oypb8] {
    display: inline-flex;
    align-items: center;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.05rem;
    letter-spacing: 0.06em;
    line-height: 1;
    padding: 0.3rem 0.66rem;
    border-radius: 8px;
    background: var(--hx-gold, #d4af37);
    color: var(--hx-gold-on, #1a1407);
    white-space: nowrap;
    flex-shrink: 0;
}

.rj__day-date[b-sr9r9oypb8] {
    display: flex;
    align-items: center;
    font-family: 'Space Mono', monospace;
    font-size: 0.8rem;
    line-height: 1;
    padding: 0.34rem 0.72rem;
    border-radius: 8px;
    background: transparent;
    border: 1px solid var(--hx-border-mid, rgba(232,196,108,0.35));
    color: var(--hx-text-2, #cbc3b0);
}

/* ── Body layout ─────────────────────────────────────────── */
.rj__body[b-sr9r9oypb8] {
    display: flex;
    gap: 2.5rem;
    align-items: flex-start;
}

.rj__main[b-sr9r9oypb8] {
    flex: 1;
    min-width: 0;
}

/* Plants + heatmap sit side by side on wide screens — kills the dead space to the right of the
   (narrow) heatmap. Mobile-first: stacked; two columns only when there's genuinely room. */
.rj__run-layout[b-sr9r9oypb8] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;

    /* The heat map's width cap, declared ONCE here because two things must agree on it: the grid itself and
       the spectator hint, whose ⇩ only lands on W1 while both share a cap. Two literals would drift.

       It is width-dependent, and the mobile case is the one that was wrong: below 1100px the layout is a
       single full-width column, but the cap stayed at the 330px tuned for the fixed 360px desktop rail — so
       the squares shrank on the viewport with the MOST room (operator, 2026-08-07). At 330px a cell is ~38px,
       under the 44px touch-target floor.

       Expressed as the GRID, not as a guessed container width — the thing actually worth capping is the CELL.
       A flat 460px was a guess, and it under-served the tablet band: an iPad mini gives a ~720px column in
       portrait and ~636px in landscape, so the map stopped well short of the room in both. This says "the
       label track, the eight gutters, and seven cells of at most 80px", which fills that band and still
       can't produce comically large squares. Below it the map simply takes 100% of whatever it is given. */
    --rj-heat-max: calc(34px + (8 * 4px) + (7 * 80px));   /* = 626px */
}
@media (min-width: 1100px) {
    .rj__run-layout[b-sr9r9oypb8] {
        grid-template-columns: minmax(0, 1fr) 360px;   /* plants flex left · heatmap fixed right */
        gap: 2rem;
        align-items: start;
        --rj-heat-max: 330px;                          /* tightened to fit that 360px rail */
    }
}
.rj__run-layout .rj__section[b-sr9r9oypb8] { margin-bottom: 0; }

/* ── Sections ────────────────────────────────────────────── */
.rj__section[b-sr9r9oypb8] {
    margin-bottom: 2.5rem;
}

.rj__section-header[b-sr9r9oypb8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.rj__section-title[b-sr9r9oypb8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.1rem;
    letter-spacing: 0.08em;
    /* Section/card headers are gold, matching the SOL name header (operator, 2026-07-26). */
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 1rem;
}
/* Focused-plant name heading the HaxScore block — larger + gold, the star of the section. */
.rj__section-title--plant[b-sr9r9oypb8] {
    font-size: 1.9rem;
    color: var(--hx-gold, #e8c46c);
}
/* "Put it on the floor" — the call to compete, on a harvested plant. */
.rj__floor-cta[b-sr9r9oypb8] {
    display: inline-block; margin-top: 0.85rem;
    font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: 0.03em;
    color: #17140e; background: var(--hx-gold, #e8c46c);
    padding: 0.5rem 1.1rem; border-radius: 6px; text-decoration: none;
    transition: background 0.15s;
}
.rj__floor-cta:hover[b-sr9r9oypb8] { background: var(--hx-gold-hover, #f1d488); }
.rj__floor-cta--secondary[b-sr9r9oypb8] {
    margin-left: 0.6rem; color: var(--hx-gold, #e8c46c);
    background: transparent; border: 1px solid var(--hx-gold, #e8c46c);
}
.rj__floor-cta--secondary:hover[b-sr9r9oypb8] { background: rgba(232,196,108,.12); }

.rj__count[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    margin-left: 0.35rem;
}

.rj__link[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-gold, #d4af37);
    text-decoration: none;
    letter-spacing: 0.05em;
    /* also used on <button> (All public / All private) — strip default button chrome */
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}
.rj__link:hover[b-sr9r9oypb8] { color: var(--hx-gold-hover, #f1d488); text-decoration: underline; }
/* Primary action — a solid gold button that stands apart from the utility links */
.rj__link--add[b-sr9r9oypb8] {
    background: var(--hx-gold, #e8c46c);
    color: #17140e;
    padding: 0.35rem 0.75rem;
    border-radius: 5px;
    font-weight: 700;
}
.rj__link--add:hover[b-sr9r9oypb8] { background: var(--hx-gold-hover, #f1d488); color: #17140e; text-decoration: none; }

.rj__link:hover[b-sr9r9oypb8] { text-decoration: underline; }

/* ── Plant Cards ─────────────────────────────────────────── */
.rj__plant-cards[b-sr9r9oypb8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));   /* 1-up when narrow, 2-up when the column has room */
    gap: 1rem;
}

/* Zero-plant empty state (doc 31 — a run is created before any grow is added) */
.rj__plants-empty[b-sr9r9oypb8] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.4rem;
    padding: 2rem 1.25rem;
    border: 1px dashed var(--hx-border, #2a2820);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.02);
}
.rj__plants-empty-glyph[b-sr9r9oypb8] { font-size: 1.8rem; opacity: 0.9; }
.rj__plants-empty-title[b-sr9r9oypb8] { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; letter-spacing: 0.03em; color: var(--hx-text-1, #f3eede); margin: 0; }
.rj__plants-empty-sub[b-sr9r9oypb8] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem; color: var(--hx-text-muted, #9a927e); margin: 0 0 0.6rem; }
.rj__plants-empty-cta[b-sr9r9oypb8] { align-self: center; }

/* Per-plant visibility toggle (doc 16) — owner only, under each plant card */
/* A grow's card and its pills are ONE object (operator, 2026-07-17): the Blueprint and visibility pills are
   that grow's own metadata, not loose siblings. So the frame wraps the whole slot and the button inside
   carries no border of its own — one box per grow, never a box inside a box. */
.rj__plant-slot[b-sr9r9oypb8] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.5rem;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 10px;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.rj__plant-slot:hover[b-sr9r9oypb8] {
    border-color: var(--hx-gold, #d4af37);
}

/* Selected grow — the heatmap below is filtered to it, so the whole group lights up. */
.rj__plant-slot:has(.rj__plant-card.is-selected)[b-sr9r9oypb8] {
    border-color: var(--hx-gold, #d4af37);
    background: rgba(232, 196, 108, 0.08);
    box-shadow: inset 0 0 0 1px rgba(232, 196, 108, 0.4);
}
.rj__plants-actions[b-sr9r9oypb8] {
    display: flex;
    gap: 0.85rem;
    align-items: center;
}
/* At-a-glance visibility badge under each plant card (control lives in the sidebar) */
.rj__plant-badge[b-sr9r9oypb8] {
    align-self: flex-start;
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.03em;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    border: 1px solid var(--hx-border, #222);
    color: var(--hx-text-muted, #b0a890);
}
.rj__plant-badge--public[b-sr9r9oypb8]   { color: var(--hx-gold, #e8c46c);  border-color: rgba(232, 196, 108, 0.45); }
.rj__plant-badge--unlisted[b-sr9r9oypb8] { color: #9bb8c4;                  border-color: rgba(111, 168, 189, 0.4); }
.rj__plant-badge--private[b-sr9r9oypb8]  { color: var(--hx-text-muted, #b0a890); }

/* Per-plant Blueprint listing — deep-links to the read-only blueprint view (doc 31 Slice 3). */
.rj__vis-note[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.74rem;
    color: var(--hx-text-muted, #b0a890);
    margin: 0 0 0.75rem;
}

/* Spectator signpost — the photos/notes live in the weeks (doc 16) */
.rj__heatmap-hint[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    color: var(--hx-text-2, #d8cdb6);
    background: rgba(232, 196, 108, 0.06);
    border-left: 2px solid rgba(232, 196, 108, 0.45);
    border-radius: 6px;
    padding: 0.5rem 0.7rem;
    margin: 0 0 0.9rem;
}
.rj__heatmap-hint strong[b-sr9r9oypb8] { color: var(--hx-gold, #e8c46c); }

/* Spectator wayfinding — the ONLY live control on their heat map is the W# column, so the hint points at it
   literally. Drops the panel treatment (background/border/padding) on purpose: the arrow has to sit in the
   same 34px track the week labels occupy, and padding would push it off. Text steps up from .82 to .95rem —
   it's the primary affordance on this surface for a follower, not a footnote. */
.rj__heatmap-hint--spectator[b-sr9r9oypb8] {
    display: grid;
    grid-template-columns: 34px 1fr;   /* mirrors .rj__heatmap-row's week-label column */
    gap: 4px;                          /* and its gutter */
    align-items: center;
    max-width: var(--rj-heat-max, 330px);   /* SAME cap as .rj__heatmap, or the ⇩ stops landing on W1 */
    background: none;
    border: 0;
    padding: 0;
    margin: 0 0 0.6rem;
    font-size: 0.95rem;
    line-height: 1.45;
    color: var(--hx-text-2, #d8cdb6);
}
.rj__heatmap-hint-arrow[b-sr9r9oypb8] {
    justify-self: center;
    font-size: 1.7rem;
    line-height: 1;
    color: var(--hx-gold, #e8c46c);
    animation: rj-hint-bob-b-sr9r9oypb8 1.9s ease-in-out infinite;
}
@keyframes rj-hint-bob-b-sr9r9oypb8 {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(4px); }
}
@media (prefers-reduced-motion: reduce) {
    .rj__heatmap-hint-arrow[b-sr9r9oypb8] { animation: none; }
}

/* Borderless — the frame lives on .rj__plant-slot, which wraps this button and its pills as one unit. */
.rj__plant-card[b-sr9r9oypb8] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: transparent;
    border: 0;
    border-radius: 6px;
    padding: 0.55rem 0.85rem;
    width: 100%;
    cursor: pointer;
    /* button reset */
    text-align: left;
    font: inherit;
    color: inherit;
}

/* Keyboard affordance — the slot's hover frame is mouse-only, so don't strand tab users. */
.rj__plant-card:focus-visible[b-sr9r9oypb8] {
    outline: 2px solid var(--hx-gold, #d4af37);
    outline-offset: 2px;
}

.rj__plant-img[b-sr9r9oypb8] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--hx-surface-2, #1a1a1a);
    flex-shrink: 0;
    border: 1px solid var(--hx-border, #2a2a2a);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    line-height: 1;
}

.rj__plant-info[b-sr9r9oypb8] {
    flex: 1;
    min-width: 0;   /* let the name use the space freed by dropping the glyph */
}

.rj__plant-name[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--hx-fg, #fff);
}

.rj__plant-stage[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--hx-gold, #e8c46c);
    margin-top: 0.15rem;
}

.rj__plant-strain[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    color: var(--hx-muted);
    margin-top: 0.15rem;
}

.rj__plant-hint[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--hx-muted);
    margin: 0.4rem 0 0.9rem;
    letter-spacing: 0.02em;
    width: 100%;          /* stretch in the flex-column plants section so center actually centers */
    align-self: stretch;
    text-align: center;   /* sits above the plant cards — "tap a plant" reads next to them */
}

/* ── Heatmap ─────────────────────────────────────────────── */
.rj__heatmap-head[b-sr9r9oypb8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.rj__streak[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.04em;
    color: var(--hx-text-2, #cbc3b0); white-space: nowrap;
    background: rgba(232,196,108,0.08); border: 1px solid rgba(232,196,108,0.25);
    border-radius: 999px; padding: 0.25rem 0.6rem;
}
.rj__streak strong[b-sr9r9oypb8] { color: var(--hx-gold, #d4af37); font-weight: 700; }
/* Collapsed run of logless weeks. Deliberately quiet — it stands for absence, so it must not compete
   with the real day cells; it reads as a seam in the grid, not a control demanding attention. */
.rj__heatmap-gap[b-sr9r9oypb8] {
    display: block;
    width: 100%;
    text-align: left;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.03em;
    color: var(--hx-muted, #8a8577);
    background: rgba(255, 255, 255, 0.02);
    border: 0;
    border-left: 2px solid rgba(255, 255, 255, 0.07);
    border-radius: 4px;
    padding: 0.35rem 0.6rem;
    margin: 0.15rem 0;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.rj__heatmap-gap:hover[b-sr9r9oypb8] {
    background: rgba(255, 255, 255, 0.045);
    color: var(--hx-text-2, #d8cdb6);
}
.rj__heatmap-gap strong[b-sr9r9oypb8] { color: var(--hx-gold, #e8c46c); font-weight: 600; }

.rj__heatmap-legend[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.rj__legend-dot[b-sr9r9oypb8] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    vertical-align: middle;
}

/* Stage key — carries the marker's own hairline (and no border-radius) so the swatch looks like the thing
   it stands for, rather than a purple sibling of the momentum shades. Those key one scale; this keys a
   different fact entirely. */
.rj__legend-dot--stage[b-sr9r9oypb8] {
    background: #a888d6;
    border-radius: 0;
    box-shadow: 0 0 0 1px rgba(8, 6, 4, 0.7);
}

/* Weeks-as-rows: a fixed 7-wide grid that grows DOWNWARD for long runs, so
   it never scrolls sideways regardless of grow length (a 125-day run is the
   same width as a 7-day one). Squares are responsive — they fill the row up
   to the container cap, so they're big on mobile and sane on desktop. */
.rj__heatmap[b-sr9r9oypb8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: var(--rj-heat-max, 330px);   /* width-dependent — see .rj__run-layout. Guarantees no h-scroll. */
    padding-bottom: 0.5rem;
}

/* No grow on the run yet — the grid is a preview only: greyed out, no hover, no clicks
   (operator, 2026-07-20). */
.rj__heatmap--disabled[b-sr9r9oypb8] {
    opacity: 0.4;
    filter: saturate(0.4);
    pointer-events: none;
}
.rj__heatmap--disabled .rj__heatmap-day:hover[b-sr9r9oypb8] { transform: none; }

/* `align-items: start`, NOT `stretch` — this is what actually made the squares look "squished" on a phone
   and tablet (operator, 2026-08-07). `stretch` gave each day cell a DEFINITE height (the row's, set by the
   week label), and `aspect-ratio: 1` then derived the cell's WIDTH from that height — so a cell rendered at
   ~38px no matter how wide its 1fr column was, leaving the rest of the column empty. The wider the map, the
   bigger the gaps, which is why widening the container made it worse rather than better, and why the 330px
   desktop rail looked fine: there a column happens to be ~38px, so width and height coincided.
   With `start` the height is auto, so the cell fills its column and aspect-ratio derives the height from it —
   the direction the layout actually wants. The label opts back into stretching so it still matches the row. */
.rj__heatmap-row[b-sr9r9oypb8] {
    display: grid;
    grid-template-columns: 34px repeat(7, 1fr);
    gap: 4px;
    align-items: start;
}

.rj__heatmap-day[b-sr9r9oypb8] {
    aspect-ratio: 1;
    border-radius: 5px;
    cursor: default;
    transition: transform 0.1s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rj__heatmap-day:hover[b-sr9r9oypb8] {
    transform: scale(1.15);
    z-index: 2;
}

/* Read-only cells (spectator / no-plant): quiet DATA, not a button. Keep the momentum shade
   but drop the button cues so nothing invites a dead click. Dimmed hard so the cells read as
   inert backdrop and the clickable W# labels clearly own the interaction (operator: 0.8 too
   subtle 07-21 → 0.7 → 0.45 on 07-22; still leaves the momentum pattern legible). */
.rj__heatmap-day--static[b-sr9r9oypb8] { cursor: default; opacity: 0.45; }
.rj__heatmap-day--static:hover[b-sr9r9oypb8] { transform: none; z-index: auto; }

/* Spectator: day cells are inert, so the clickable W# labels are the ONLY control — accentuate
   them (brighter fill + border) so it's obvious what to tap (operator, 2026-07-21). Targets the
   <a> only, so fully-future --ondeck week <span>s stay inert. */
.rj__heatmap--spectator a.rj__week-label[b-sr9r9oypb8] {
    background: rgba(232, 196, 108, 0.34);
    border-color: rgba(232, 196, 108, 0.7);
    color: #f6efdd;
}
.rj__heatmap--spectator a.rj__week-label:hover[b-sr9r9oypb8] {
    background: rgba(232, 196, 108, 0.5);
    border-color: #e8c46c;
}

/* Per-square day label — the at-a-glance "which day" for mobile (where
   tooltips don't show). Sits inside the box so the grid stays intact;
   clicks pass through to the square. */
.rj__heatmap-dx[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
    color: rgba(240, 230, 200, 0.7); /* light ink for dark / low-momentum squares */
    pointer-events: none;
    user-select: none;
}

/* Bright gold squares need dark ink to stay readable */
.rj__heatmap-day.m3 .rj__heatmap-dx[b-sr9r9oypb8],
.rj__heatmap-day.m4 .rj__heatmap-dx[b-sr9r9oypb8],
.rj__heatmap-day.m5 .rj__heatmap-dx[b-sr9r9oypb8] {
    color: rgba(20, 16, 7, 0.75);
}

/* Momentum levels — 0=no log, 5=fully complete */
.rj__heatmap-day.m0[b-sr9r9oypb8],
.rj__legend-dot.m0[b-sr9r9oypb8] { background: var(--hx-surface-2, #1a1a1a); }

.rj__heatmap-day.m1[b-sr9r9oypb8],
.rj__legend-dot.m1[b-sr9r9oypb8] { background: rgba(212, 175, 55, 0.15); }

.rj__heatmap-day.m2[b-sr9r9oypb8],
.rj__legend-dot.m2[b-sr9r9oypb8] { background: rgba(212, 175, 55, 0.30); }

.rj__heatmap-day.m3[b-sr9r9oypb8],
.rj__legend-dot.m3[b-sr9r9oypb8] { background: rgba(212, 175, 55, 0.50); }

.rj__heatmap-day.m4[b-sr9r9oypb8],
.rj__legend-dot.m4[b-sr9r9oypb8] { background: rgba(212, 175, 55, 0.75); }

.rj__heatmap-day.m5[b-sr9r9oypb8],
.rj__legend-dot.m5[b-sr9r9oypb8] { background: var(--hx-gold, #d4af37); }

/* On deck — tomorrow's slot: visible but not loggable yet. Dashed, dim, inert. */
.rj__heatmap-day--ondeck[b-sr9r9oypb8] {
    background: transparent;
    border: 1px dashed rgba(232, 196, 108, 0.35);
    cursor: default;
    opacity: 0.55;
}
.rj__heatmap-day--ondeck:hover[b-sr9r9oypb8] { transform: none; }
.rj__heatmap-day--ondeck .rj__heatmap-dx[b-sr9r9oypb8] { color: rgba(232, 196, 108, 0.7); }

/* Today, not yet logged — the "log me" cell. Gold ring + gentle pulse pulls the tap here,
   not to tomorrow's on-deck slot. This is the daily-log affordance now the CTA button is gone. */
.rj__heatmap-day--today-log[b-sr9r9oypb8] {
    box-shadow: 0 0 0 1.5px var(--hx-gold, #e8c46c), 0 0 10px rgba(232, 196, 108, 0.5);
    animation: rj-today-pulse-b-sr9r9oypb8 2.4s ease-in-out infinite;
}
@keyframes rj-today-pulse-b-sr9r9oypb8 {
    0%, 100% { box-shadow: 0 0 0 1.5px var(--hx-gold, #e8c46c), 0 0 7px rgba(232, 196, 108, 0.35); }
    50%      { box-shadow: 0 0 0 1.5px var(--hx-gold, #e8c46c), 0 0 15px rgba(232, 196, 108, 0.65); }
}
@media (prefers-reduced-motion: reduce) {
    .rj__heatmap-day--today-log[b-sr9r9oypb8] { animation: none; }
}

/* A growth stage began on this day — a purple ring around the square (operator, 2026-08-03: the compromise
   between the original corner dot, too quiet, and a full purple fill, which overwrote the momentum shade the
   legend depends on). The ring reads at a glance across the whole grid and leaves the fill saying what it
   always said.
   `outline`, NOT `border` (which would shift the box) and NOT `box-shadow` (already owned by the today-log
   ring, so the two would overwrite each other). A negative offset seats it inside the square, so it can't
   crowd its neighbours across the 4px grid gap. */
.rj__heatmap-day--stage[b-sr9r9oypb8] { position: relative; }

/* A purple SQUARE in the corner (operator, 2026-08-03), after a 2px ring proved too thin to read against a
   bright gold fill. A square packs noticeably more area than the circle it replaces at the same nominal size.
   Kept on a ::after so it composes with BOTH the momentum fill (background) and the today-log ring
   (box-shadow) — neither of which it may disturb, which is what ruled out a full purple fill. The dark
   hairline is what makes one colour work on every momentum shade, dim to bright. */
.rj__heatmap-day--stage[b-sr9r9oypb8]::after {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: 9px;
    height: 9px;
    background: #a888d6;
    box-shadow: 0 0 0 1px rgba(8, 6, 4, 0.7);
    pointer-events: none;
}

.rj__week-label[b-sr9r9oypb8] {
    /* The row is `align-items: start` so the day cells can size themselves from their column width; the
       label has no intrinsic height worth having, so it opts back in and matches the row. */
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    font-weight: 700;
    color: #e8c46c;
    background: rgba(232, 196, 108, 0.14);
    border: 1px solid rgba(232, 196, 108, 0.22);
    border-radius: 5px;
    text-decoration: none;
    letter-spacing: 0.01em;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.rj__week-label:hover[b-sr9r9oypb8] {
    background: rgba(232, 196, 108, 0.26);
    border-color: rgba(232, 196, 108, 0.5);
    color: #f6efdd;
}

/* Fully-future week (only the on-deck day) — inert, matches the dim preview. */
.rj__week-label--ondeck[b-sr9r9oypb8] {
    background: transparent;
    border: 1px dashed rgba(232, 196, 108, 0.22);
    opacity: 0.55;
}

.rj__heatmap-empty[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
    margin-top: 0.75rem;
}

/* ── Sidebar ─────────────────────────────────────────────── */
.rj__sidebar[b-sr9r9oypb8] {
    width: 300px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.rj__sidebar-card[b-sr9r9oypb8] {
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 1.25rem;
}
/* Plant privacy panel — its own blue/teal zone (privacy = trust), distinct from HaxScore green. */
.rj__sidebar-card--privacy[b-sr9r9oypb8] {
    background: rgba(111, 168, 189, 0.06);
    border-color: rgba(111, 168, 189, 0.4);
}

/* Growth stage — the purple lifecycle-transition tint (operator, 2026-07-28). Uses the canonical purple
   card recipe rather than the flat fill above, so it reads as the same treatment as Log Day's stage
   control: one concept, one colour, across both surfaces. */
.rj__sidebar-card--stage[b-sr9r9oypb8] {
    background: linear-gradient(135deg, rgba(146, 110, 196, 0.16), rgba(146, 110, 196, 0.03));
    border-color: rgba(146, 110, 196, 0.4);
}

.rj__sidebar-title[b-sr9r9oypb8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 0.9rem;
    letter-spacing: 0.1em;
    /* Sidebar card headers (THIS GROW / RUN SETUP / WHO CAN WATCH / GROWTH STAGE) are gold too. */
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 1rem;
}

/* A second section header inside the same card (THIS GROW / RUN SETUP) — extra top gap + a hairline
   divider so the two levels read as distinct groups, not one list. */
.rj__sidebar-title--sub[b-sr9r9oypb8] {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--hx-border, #2a2820);
}

/* "Saved ✓" flash — quiet confirmation that a live visibility change stuck (doc 16/17). */
.rj__vis-saved[b-sr9r9oypb8] {
    margin-left: 0.5rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.04em;
    color: #7ad17a;
    animation: rj-vis-saved-in-b-sr9r9oypb8 0.15s ease-out;
}

@keyframes rj-vis-saved-in-b-sr9r9oypb8 {
    from { opacity: 0; transform: translateY(-2px); }
    to   { opacity: 1; transform: none; }
}

/* Gentle stage nudge (doc 09 §5) — suggestion, never a demand */
.rj__stage-nudge[b-sr9r9oypb8] {
    margin: 0.9rem 0 0;
    padding: 0.65rem 0.75rem;
    background: rgba(232, 196, 108, 0.07);
    border-left: 2px solid rgba(232, 196, 108, 0.45);
    border-radius: 6px;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.82rem;
    line-height: 1.45;
    color: #d8cdb6;
}

/* Spectator "watching" banner + follow (doc 13 / 14) */
.rj__watching-row[b-sr9r9oypb8] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}
.rj__watching[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.78rem;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}
.rj__watching strong[b-sr9r9oypb8] { color: var(--hx-fg, #fff); }
.rj__follow[b-sr9r9oypb8] { min-width: 6.5rem; }

/* Visibility selector (doc 13) */
.rj__vis[b-sr9r9oypb8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.rj__vis-opt[b-sr9r9oypb8] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    text-align: left;
    padding: 0.6rem 0.75rem;
    background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    color: var(--hx-fg, #fff);
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.rj__vis-opt:hover:not(:disabled)[b-sr9r9oypb8] { border-color: rgba(111, 168, 189, 0.55); }
.rj__vis-opt:disabled[b-sr9r9oypb8] { opacity: 0.6; cursor: default; }
.rj__vis-opt.is-selected[b-sr9r9oypb8] {
    border-color: #6fa8bd;
    background: rgba(111, 168, 189, 0.1);
}
.rj__vis-label[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
}
.rj__vis-hint[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
}

.rj__details[b-sr9r9oypb8] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 1rem;
    margin: 0;
}

.rj__details dt[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-top: 0.05rem;
}

.rj__details dd[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.85rem;
    color: var(--hx-fg, #fff);
    margin: 0;
}

/* Deep-links out of the details list — the Blueprint and the Seed List lot behind this grow. */
.rj__details-link[b-sr9r9oypb8] {
    color: var(--hx-gold, #e8c46c);
    font-weight: 600;
    text-decoration: none;
}
.rj__details-link:hover[b-sr9r9oypb8] { text-decoration: underline; }

.rj__details-none[b-sr9r9oypb8] { color: var(--hx-text-muted, #8a8270); }
/* The current backfilled-starter value shown before a "Select →" (medium picker) — muted, it's just a default. */
.rj__details-default[b-sr9r9oypb8] { color: var(--hx-text-muted, #8a8270); }

/* Ended grow (didn't make it) — dimmed tombstone on the plant card + its badge. */
.rj__plant-card.is-ended[b-sr9r9oypb8] { opacity: 0.55; }
.rj__plant-card.is-ended:hover[b-sr9r9oypb8] { opacity: 0.75; }
.rj__plant-ended[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.06em;
    text-transform: uppercase; color: #c98a6a; margin-top: 2px;
}

/* Grow lifecycle control (end / reactivate) in the THIS GROW panel. */
.rj__lifecycle[b-sr9r9oypb8] { margin: 0.5rem 0 1.2rem; display: flex; flex-direction: column; gap: 0.5rem; align-items: flex-start; }
.rj__lifecycle-note[b-sr9r9oypb8] { font-size: 0.8rem; color: var(--hx-text-muted, #8a8270); }
.rj__lifecycle-btn[b-sr9r9oypb8] {
    background: none; border: 0; padding: 0; cursor: pointer; text-align: left;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: var(--hx-text-muted, #8a8270);
}
.rj__lifecycle-btn:hover[b-sr9r9oypb8] { color: var(--hx-text-heading, #f6efdd); text-decoration: underline; }
/* Every "didn't make it" end link — per-grow ("End this grow") AND run-level ("End this run") — shares the
   app's muted "consequential" red by default, so the two read as the same kind of action. */
.rj__lifecycle-btn--end[b-sr9r9oypb8] { color: #c47a72; }
.rj__lifecycle-btn--end:hover[b-sr9r9oypb8] { color: #ea8b81; }
.rj__end-confirm[b-sr9r9oypb8] {
    border: 1px solid rgba(217,122,90,.35); border-radius: 8px; background: rgba(217,122,90,.06);
    padding: 0.7rem 0.8rem; display: flex; flex-direction: column; gap: 0.6rem;
}
.rj__end-confirm p[b-sr9r9oypb8] { margin: 0; font-size: 0.82rem; color: var(--hx-text-2, #b0a890); line-height: 1.45; }
.rj__end-confirm-actions[b-sr9r9oypb8] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* ── Run lifecycle — close a run that didn't make it / reopen it ──────────── */
.rj__runlife[b-sr9r9oypb8] { display: flex; flex-direction: column; gap: 0.6rem; align-items: flex-start; }
.rj__runlife--nudge[b-sr9r9oypb8], .rj__runlife--closed[b-sr9r9oypb8] {
    border-radius: var(--hx-r-sm, 8px);
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.25rem;
}
/* Red is the app's ONE reserved "consequential action" tint — introduced here on purpose, because closing
   a whole run is heavyweight and hard-feeling to walk back. Loud enough to warrant a pause, not an error. */
.rj__runlife--nudge[b-sr9r9oypb8] {
    border: 1px solid rgba(224,87,79,.40);
    background: linear-gradient(180deg, rgba(224,87,79,.11), rgba(255,255,255,.012));
}
/* Closed state — reopening is safe, so it stays a calm muted "kept, not gone" card (no red). */
.rj__runlife--closed[b-sr9r9oypb8] {
    border: 1px solid var(--hx-border, #333);
    background: rgba(255,255,255,.03);
}
.rj__runlife-title[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif; font-weight: 700;
    font-size: 1.02rem; color: var(--hx-text-heading, #f6efdd);
}
.rj__runlife-sub[b-sr9r9oypb8] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.86rem;
    color: var(--hx-text-caption, #b0a890); line-height: 1.5; margin: 0; max-width: 40rem;
}
/* In the prominent banners the buttons read as real actions (pills), not the plain text link the sidebar uses. */
.rj__runlife--nudge .rj__lifecycle-btn--end[b-sr9r9oypb8],
.rj__runlife--closed .rj__lifecycle-btn[b-sr9r9oypb8] {
    border-radius: var(--hx-r-pill, 999px); padding: 0.4rem 0.95rem; font-weight: 600;
}
/* Close this run = red. */
.rj__runlife--nudge .rj__lifecycle-btn--end[b-sr9r9oypb8] {
    border: 1px solid rgba(224,87,79,.55); color: #ea8b81;
}
.rj__runlife--nudge .rj__lifecycle-btn--end:hover[b-sr9r9oypb8] { background: rgba(224,87,79,.14); color: #f2a79e; text-decoration: none; }
/* Reactivate = calm gold. */
.rj__runlife--closed .rj__lifecycle-btn[b-sr9r9oypb8] {
    border: 1px solid rgba(232,196,108,.4); color: var(--hx-gold, #e8c46c);
}
.rj__runlife--closed .rj__lifecycle-btn:hover[b-sr9r9oypb8] { color: var(--hx-gold, #e8c46c); background: rgba(232,196,108,.08); text-decoration: none; }
/* The whole run-close flow carries the red — the confirm box too (scoped so the per-plant "End this grow"
   confirm elsewhere keeps its own coral). */
.rj__runlife .rj__end-confirm[b-sr9r9oypb8] {
    border-color: rgba(224,87,79,.42); background: rgba(224,87,79,.08);
}
/* Sidebar variant — quiet, separated from RUN SETUP above by a hairline. The link inherits the shared
   muted-red --end color, so the caution reads even in this low-key path. */
.rj__runlife--aside[b-sr9r9oypb8] { margin-top: 1rem; padding-top: 0.85rem; border-top: 1px solid var(--hx-border, #2a2a2a); width: 100%; }

/* Collapsed adopt affordance — reads like a deep link; expands into the picker on click. */
.rj__details-set[b-sr9r9oypb8] {
    background: none; border: 0; padding: 0; cursor: pointer;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; font-weight: 600;
    color: var(--hx-gold, #e8c46c);
}
.rj__details-set:hover[b-sr9r9oypb8] { text-decoration: underline; }

/* "Set Blueprint" adopt picker — shown in the details when a grow has no Blueprint yet. */
.rj__bp-adopt[b-sr9r9oypb8] { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; }
.rj__bp-adopt .hx-input[b-sr9r9oypb8] { flex: 1 1 auto; min-width: 0; }
.rj__bp-set[b-sr9r9oypb8] { flex: 0 0 auto; padding: 0.35rem 0.9rem; font-size: 0.8rem; }

/* Takes the whole second row of the wrapping flex line, so the note reads as a consequence of the picker
   rather than crowding the Set/Cancel pair. Muted: it explains, it doesn't ask for anything. */
.rj__bp-note[b-sr9r9oypb8] {
    flex: 1 1 100%;
    margin: 0.15rem 0 0;
    font-size: 0.72rem;
    color: var(--hx-text-muted, #8a8270);
}

/* Cancel sits beside Set but reads as the way out, not a second action — plain text, muted, no button
   chrome. Set keeps the only button treatment so the committing choice stays the obvious one. */
.rj__bp-cancel[b-sr9r9oypb8] {
    flex: 0 0 auto;
    background: none;
    border: none;
    padding: 0.35rem 0.4rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.75rem;
    color: var(--hx-muted);
    cursor: pointer;
    transition: color 0.15s;
}
.rj__bp-cancel:hover:not(:disabled)[b-sr9r9oypb8] { color: var(--hx-fg, #fff); }
.rj__bp-cancel:disabled[b-sr9r9oypb8] { opacity: 0.4; cursor: default; }

/* "Set Seed" adopt picker — keeps any free-text strain visible above the link dropdown. */
.rj__seed-adopt[b-sr9r9oypb8] { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; }
.rj__seed-current[b-sr9r9oypb8] { font-size: 0.85rem; color: var(--hx-fg, #fff); }

/* ── Stage Track ─────────────────────────────────────────── */
.rj__stage-name[b-sr9r9oypb8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    color: var(--hx-gold, #d4af37);
    margin-bottom: 1rem;
}

.rj__stage-track[b-sr9r9oypb8] {
    display: flex;
    gap: 0;
    position: relative;
}

.rj__stage-track[b-sr9r9oypb8]::before {
    content: '';
    position: absolute;
    top: 7px;
    left: 7px;
    right: 7px;
    height: 1px;
    background: var(--hx-border, #333);
}

.rj__stage-node[b-sr9r9oypb8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    position: relative;
    z-index: 1;
}

.rj__stage-dot[b-sr9r9oypb8] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--hx-surface-2, #1a1a1a);
    border: 1px solid var(--hx-border, #333);
    transition: background 0.2s, border-color 0.2s;
}

.rj__stage-node.is-past .rj__stage-dot[b-sr9r9oypb8] {
    background: rgba(212, 175, 55, 0.3);
    border-color: var(--hx-gold, #d4af37);
}

.rj__stage-node.is-current .rj__stage-dot[b-sr9r9oypb8] {
    background: var(--hx-gold, #d4af37);
    border-color: var(--hx-gold, #d4af37);
    box-shadow: 0 0 6px rgba(212, 175, 55, 0.5);
}

.rj__stage-label[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.55rem;
    color: var(--hx-muted);
    text-align: center;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.rj__stage-node.is-current .rj__stage-label[b-sr9r9oypb8] {
    color: var(--hx-gold, #d4af37);
}

/* Skipped stages (e.g. a clone that started at Veg) — dashed, dimmed */
.rj__stage-node.is-skipped .rj__stage-dot[b-sr9r9oypb8] {
    background: transparent;
    border-style: dashed;
    border-color: var(--hx-border, #333);
    opacity: 0.6;
}
.rj__stage-node.is-skipped .rj__stage-label[b-sr9r9oypb8] {
    opacity: 0.5;
}

.rj__stage-date[b-sr9r9oypb8] {
    font-family: 'Space Mono', monospace;
    font-size: 0.5rem;
    color: var(--hx-muted);
    letter-spacing: 0.02em;
    white-space: nowrap;
}
.rj__stage-node.is-current .rj__stage-date[b-sr9r9oypb8] {
    color: var(--hx-gold, #d4af37);
}

/* ── Harvest terminal state ──────────────────────────────── */
.rj__harvest[b-sr9r9oypb8] {
    background: linear-gradient(180deg, rgba(212,175,55,.1), rgba(255,255,255,.02));
    border: 1px solid rgba(212,175,55,.3);
    border-radius: var(--hx-r-sm, 8px);
    padding: 1.5rem 1.75rem;
}
.rj__harvest-title[b-sr9r9oypb8] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.6rem;
    color: #f6efdd;
    letter-spacing: 0.02em;
    margin-bottom: 0.4rem;
}
.rj__harvest-sub[b-sr9r9oypb8] {
    font-size: 0.9rem;
    color: var(--hx-text-caption, #b0a890);
    line-height: 1.55;
    margin: 0;
    max-width: 40rem;
}
.rj__harvest-cta[b-sr9r9oypb8] { margin-top: 1rem; align-self: flex-start; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 860px) {
    .rj__body[b-sr9r9oypb8] {
        flex-direction: column;

        /* `align-items: flex-start` (set for the desktop ROW, where it aligns tops) controls the CROSS axis —
           so the moment this stacks, it stops meaning "align tops" and starts meaning "don't stretch
           horizontally". `.rj__main` then shrank to its content width, leaving a bare strip down the whole
           right side beside the plant cards and the heat map. `.rj__sidebar` escaped it only because it sets
           `width: 100%` explicitly, which is exactly why the sections below LOOKED right while these didn't
           (operator, 2026-08-07). Back to the default so the main column fills the width. */
        align-items: stretch;
    }

    .rj__sidebar[b-sr9r9oypb8] {
        width: 100%;
    }

    .rj__plant-card[b-sr9r9oypb8] {
        max-width: 100%;
    }
}
/* /Components/Pages/Runs/WeekView.razor.rz.scp.css */
/* ── WeekView — wv__ namespace ─────────────────────────── */

.wv__loading-text[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    color: var(--hx-muted);
    font-size: 0.85rem;
    padding: 4rem 0;
}

/* ── Header ──────────────────────────────────────────────── */
.wv__header[b-h7ybpglt7z] {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--hx-border, #222);
}

.wv__back[b-h7ybpglt7z] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
    text-decoration: none;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}
.wv__back:hover[b-h7ybpglt7z] { color: var(--hx-gold, #d4af37); }

.wv__eyebrow[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    /* Eyebrow bumped up for presence (operator, 2026-07-26) — was 0.72rem. */
    font-size: 0.9rem;
    color: var(--hx-muted);
    letter-spacing: 0.08em;
    margin: 0 0 0.4rem;
}

.wv__title-row[b-h7ybpglt7z] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.wv__headline[b-h7ybpglt7z] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.5rem, 6vw, 4rem);
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0;
    flex-shrink: 0;
}

/* ── Week navigation ─────────────────────────────────────── */
.wv__nav[b-h7ybpglt7z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: auto;
}

.wv__nav-btn[b-h7ybpglt7z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--hx-border, #333);
    border-radius: 4px;
    background: var(--hx-surface-1, #111);
    color: var(--hx-fg, #fff);
    font-size: 1.1rem;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
    flex-shrink: 0;
}
.wv__nav-btn:hover[b-h7ybpglt7z] { border-color: var(--hx-gold, #d4af37); color: var(--hx-gold, #d4af37); }
.wv__nav-btn--disabled[b-h7ybpglt7z] { opacity: 0.25; cursor: default; pointer-events: none; }

.wv__nav-range[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
    letter-spacing: 0.04em;
    white-space: nowrap;
}

/* ── Stats bar ───────────────────────────────────────────── */
.wv__stats-bar[b-h7ybpglt7z] {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    padding: 1.25rem 1.5rem;
    margin: 1.5rem 0;
}

.wv__stat[b-h7ybpglt7z] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    text-align: center;
}

.wv__stat-divider[b-h7ybpglt7z] {
    width: 1px;
    height: 2.5rem;
    background: var(--hx-border, #2a2a2a);
    flex-shrink: 0;
}

.wv__stat-value[b-h7ybpglt7z] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.8rem;
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    line-height: 1;
}

.wv__stat-value--perfect[b-h7ybpglt7z]   { color: #4ade80; }

.wv__stat-label[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    color: var(--hx-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ── 7-day grid ──────────────────────────────────────────── */
.wv__scroll-wrap[b-h7ybpglt7z] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.5rem;
    margin-bottom: 1.25rem;
}

.wv__day-grid[b-h7ybpglt7z] {
    display: grid;
    grid-template-columns: repeat(7, minmax(130px, 1fr));
    gap: 0.5rem;
    min-width: 910px;
    margin-bottom: 2rem;
}

/* ── Day card ────────────────────────────────────────────── */
.wv__day-card[b-h7ybpglt7z] {
    display: flex;
    flex-direction: column;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 6px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    position: relative;
    transition: border-color 0.15s;
}
.wv__day-card:hover[b-h7ybpglt7z] { border-color: rgba(212, 175, 55, 0.5); }
.wv__day-card--today[b-h7ybpglt7z] { border-color: var(--hx-gold, #d4af37); }
/* Spectator read-only day cards — no click affordance (doc 13) */
.wv__day-card--readonly[b-h7ybpglt7z] { cursor: default; }
.wv__day-card--readonly:hover[b-h7ybpglt7z] { border-color: var(--hx-border, #222); }
.wv__day-card--readonly.wv__day-card--today:hover[b-h7ybpglt7z] { border-color: var(--hx-gold, #d4af37); }
.wv__day-card--empty[b-h7ybpglt7z] { opacity: 0.65; }
.wv__day-card--empty:hover[b-h7ybpglt7z] { opacity: 1; }

/* Future day — on deck, not loggable yet by anyone. Dashed, dim, inert (mirrors the heatmap on-deck cell). */
.wv__day-card--ondeck[b-h7ybpglt7z] { border: 1px dashed rgba(232, 196, 108, 0.35); opacity: 0.5; cursor: default; }
.wv__day-card--ondeck:hover[b-h7ybpglt7z] { opacity: 0.5; border-color: rgba(232, 196, 108, 0.35); }

/* After harvest — the daily log is closed for this plant (Harvest/Cure mode, doc 09). Dimmed + inert. */
.wv__day-card--after-harvest[b-h7ybpglt7z] { opacity: 0.4; cursor: default; }
.wv__day-card--after-harvest:hover[b-h7ybpglt7z] { opacity: 0.4; }

/* Spectator day card WITH photos — a <button> that opens the read-only gallery (doc 17). */
.wv__day-card--viewable[b-h7ybpglt7z] {
    cursor: pointer;
    font: inherit;
    text-align: inherit;
    padding: 0;
    width: 100%;
}
.wv__day-card--readonly.wv__day-card--viewable:hover[b-h7ybpglt7z] { border-color: rgba(212, 175, 55, 0.5); }

.wv__day-header[b-h7ybpglt7z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.5rem 0.3rem;
}

.wv__day-dow[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.73rem;
    color: var(--hx-muted);
    letter-spacing: 0.04em;
}

.wv__day-num[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.67rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.04em;
}

/* ── TODAY badge ─────────────────────────────────────────── */
.wv__today-badge[b-h7ybpglt7z] {
    position: absolute;
    top: 2rem;
    left: 0.4rem;
    background: var(--hx-gold, #d4af37);
    color: #000;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
    z-index: 1;
}

/* ── Photo area ──────────────────────────────────────────── */
.wv__day-photo[b-h7ybpglt7z] {
    position: relative;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    flex-shrink: 0;
}

.wv__photo-img[b-h7ybpglt7z] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* "+N photos" badge — signals the day detail holds more shots (doc 17). */
.wv__photo-more[b-h7ybpglt7z] {
    position: absolute;
    bottom: 0.3rem;
    right: 0.3rem;
    background: rgba(0,0,0,0.68);
    color: #f0ead9;
    font-family: 'Space Mono', monospace;
    font-size: 0.67rem;
    letter-spacing: 0.03em;
    padding: 0.14rem 0.34rem;
    border-radius: 4px;
}

.wv__photo-empty[b-h7ybpglt7z] {
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        45deg,
        #181818,
        #181818 4px,
        #0e0e0e 4px,
        #0e0e0e 10px
    );
}

.wv__photo-empty--logged[b-h7ybpglt7z] {
    /* logged but no photo — slightly lighter hatch */
    background: repeating-linear-gradient(
        45deg,
        #1e1e1e,
        #1e1e1e 4px,
        #141414 4px,
        #141414 10px
    );
}

/* Substitute glyph when a logged day's photo can't be shown (missing/placeholder file). */
.wv__photo-glyph[b-h7ybpglt7z] {
    display: flex;
    align-items: center;
    justify-content: center;
}
.wv__photo-glyph span[b-h7ybpglt7z] {
    font-size: 2.46rem;
    opacity: 0.5;
    filter: grayscale(0.2);
}

/* ── Day footer (below photo) ────────────────────────────── */
.wv__day-footer[b-h7ybpglt7z] {
    padding: 0.5rem 0.5rem 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}


.wv__chips[b-h7ybpglt7z] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
}

.wv__chip[b-h7ybpglt7z] {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

/* Action-type chip colors */
.wv__chip--1[b-h7ybpglt7z] { background: rgba(59,130,246,0.2);  color: #93c5fd; border: 1px solid rgba(59,130,246,0.4); }
.wv__chip--2[b-h7ybpglt7z] { background: rgba(34,197,94,0.2);   color: #86efac; border: 1px solid rgba(34,197,94,0.4); }
.wv__chip--3[b-h7ybpglt7z] { background: rgba(103,232,249,0.2); color: #67e8f9; border: 1px solid rgba(103,232,249,0.4); }
.wv__chip--4[b-h7ybpglt7z] { background: rgba(212,175,55,0.15); color: #d4af37; border: 1px solid rgba(212,175,55,0.35); }
.wv__chip--5[b-h7ybpglt7z] { background: rgba(168,85,247,0.2);  color: #d8b4fe; border: 1px solid rgba(168,85,247,0.4); }
.wv__chip--6[b-h7ybpglt7z] { background: rgba(249,115,22,0.2);  color: #fdba74; border: 1px solid rgba(249,115,22,0.4); }
.wv__chip--7[b-h7ybpglt7z] { background: rgba(234,179,8,0.2);   color: #fde047; border: 1px solid rgba(234,179,8,0.4); }
.wv__chip--8[b-h7ybpglt7z] { background: rgba(22,163,74,0.2);   color: #6ee7b7; border: 1px solid rgba(22,163,74,0.4); }

/* Stage-transition pill — "the plant became this here". Same tinted build as an action chip (operator,
   2026-08-03), in the accent purple #926ec4 rather than the chip palette's violet. It stays distinguishable
   from the purple "Trained" chip (.wv__chip--5) by TYPOGRAPHY instead of fill: uppercase and wider-tracked
   against the chips' sentence case. */
.wv__stage-pill[b-h7ybpglt7z] {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    border-radius: 3px;
    font-family: 'Space Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.07em;
    white-space: nowrap;
    background: rgba(146, 110, 196, 0.2);
    border: 1px solid rgba(146, 110, 196, 0.45);
    color: #cdb4ee;
}

/* Leads the footer (the pills follow), so the flex gap owns the spacing — no stray margin on top. */
.wv__day-date[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.67rem;
    color: var(--hx-muted);
    letter-spacing: 0.03em;
}

/* ── Week in Review ──────────────────────────────────────── */
.wv__review[b-h7ybpglt7z] {
    border-left: 3px solid var(--hx-gold, #d4af37);
    padding: 1rem 1.25rem;
    background: rgba(212, 175, 55, 0.04);
    border-radius: 0 6px 6px 0;
    margin-bottom: 3rem;
}

.wv__review-title[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-gold, #d4af37);
    letter-spacing: 0.1em;
    margin: 0 0 0.75rem;
}

.wv__review-note[b-h7ybpglt7z] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--hx-fg, #eee);
    margin: 0 0 0.5rem;
}

.wv__review-note:last-child[b-h7ybpglt7z] { margin-bottom: 0; }

.wv__review-day[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-muted);
    margin-right: 0.4rem;
}

/* Owner's hook into the whole-day view. Quiet by default — it sits at the head of every line, so anything
   louder would turn the review into a column of links and pull attention off the notes. */
.wv__review-day--link[b-h7ybpglt7z] {
    text-decoration: none;
    border-bottom: 1px dotted rgba(232, 196, 108, 0.35);
    transition: color 0.15s, border-color 0.15s;
}
.wv__review-day--link:hover[b-h7ybpglt7z] {
    color: var(--hx-gold, #e8c46c);
    border-bottom-color: var(--hx-gold, #e8c46c);
}

/* The day's action pills, inline ahead of its note. Reuses .wv__chip so the colours/labels match the day
   card exactly; this only handles the inline grouping. margin-right separates them from the note text.
   inline-flex + baseline keeps them sitting on the note's first line rather than pushing it down. */
.wv__review-chips[b-h7ybpglt7z] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.2rem;
    margin-right: 0.45rem;
    vertical-align: baseline;
}

/* Preserve the line breaks the grower typed into the observation (pre-wrap, not pre — still wraps long
   lines). Scoped to the note text so the Razor source's own indentation doesn't leak in. */
.wv__review-text[b-h7ybpglt7z] { white-space: pre-wrap; }

/* ── Read-only day gallery (doc 17) — same gentle card language as Log Day ── */
.wv__lightbox[b-h7ybpglt7z] {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(4, 4, 3, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.wv__lightbox-panel[b-h7ybpglt7z] {
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 10px;
    width: min(560px, 92vw);
    max-height: 90vh;   /* a portrait stage is taller than the old 4/3 one — give it the room */
    overflow-y: auto;
    padding: 1rem 1.1rem 1.3rem;
}

.wv__lightbox-head[b-h7ybpglt7z] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.wv__lightbox-eyebrow[b-h7ybpglt7z] {
    font-family: 'Space Mono', monospace;
    font-size: 0.64rem;
    letter-spacing: 0.08em;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.15rem;
}

.wv__lightbox-title[b-h7ybpglt7z] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.5rem;
    letter-spacing: 0.02em;
    margin: 0;
    color: var(--hx-fg, #fff);
}

.wv__lightbox-close[b-h7ybpglt7z] {
    flex-shrink: 0;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--hx-border, #2a2620);
    border-radius: 6px;
    color: var(--hx-fg, #fff);
    font-size: 0.85rem;
    line-height: 1;
    padding: 0.4rem 0.55rem;
    cursor: pointer;
    transition: background 0.15s;
}
.wv__lightbox-close:hover[b-h7ybpglt7z] { background: rgba(255,255,255,0.12); }

/* Staged (large) shot — the current selection; tapping a thumbnail swaps it in.
   The frame follows the PHOTO rather than a fixed ratio. Grow shots are overwhelmingly tall
   phone captures, and the old 4/3 `cover` crop cut the top and bottom off the plant — exactly
   what the viewer opened the gallery to see. Bounded by the panel width and the viewport
   height so the thumbnail strip and the day's note stay on screen underneath. */
.wv__lightbox-stage[b-h7ybpglt7z] {
    margin: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.wv__lightbox-img[b-h7ybpglt7z] {
    max-width: 100%;
    max-height: 56vh;
    border-radius: 6px;
    border: 1px solid var(--hx-border, #2a2620);
    display: block;
}
.wv__lightbox-stage.is-primary .wv__lightbox-img[b-h7ybpglt7z] { border-color: var(--hx-gold, #e8c46c); }

/* Thumbnail strip — one per photo; the active one is ringed. */
.wv__lightbox-thumbs[b-h7ybpglt7z] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.7rem;
}

.wv__lightbox-thumb[b-h7ybpglt7z] {
    position: relative;
    width: 68px;
    height: 68px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 6px;
    background: none;
    cursor: pointer;
    overflow: hidden;
    opacity: 0.6;
    transition: opacity 0.15s, border-color 0.15s, transform 0.15s;
}
.wv__lightbox-thumb:hover[b-h7ybpglt7z] { opacity: 0.85; transform: translateY(-1px); }
.wv__lightbox-thumb.is-active[b-h7ybpglt7z] {
    opacity: 1;
    border-color: var(--hx-gold, #e8c46c);
}

.wv__lightbox-thumb-img[b-h7ybpglt7z] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 3px;
}

.wv__lightbox-thumb-star[b-h7ybpglt7z] {
    position: absolute;
    top: 2px;
    right: 3px;
    font-size: 0.6rem;
    color: var(--hx-gold, #e8c46c);
    text-shadow: 0 0 3px rgba(0,0,0,0.8);
}

.wv__lightbox-cap[b-h7ybpglt7z] {
    display: flex;
    align-items: center;
    justify-content: center;   /* tracks the centred stage image, not the panel edge */
    gap: 0.3rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.03em;
    color: var(--hx-muted);
    margin-top: 0.3rem;
}
.wv__lightbox-star[b-h7ybpglt7z] { color: var(--hx-gold, #e8c46c); }

.wv__lightbox-note[b-h7ybpglt7z] {
    margin: 1.1rem 0 0;
    padding-top: 0.9rem;
    border-top: 1px solid var(--hx-border, #2a2620);
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.9rem;
    line-height: 1.5;
    color: #d8d2c4;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 640px) {
    .wv__stats-bar[b-h7ybpglt7z] { gap: 0; padding: 1rem; }
    .wv__stat-value[b-h7ybpglt7z] { font-size: 1.4rem; }
    .wv__nav-range[b-h7ybpglt7z] { display: none; }
}
/* /Components/Pages/Seeds/Seeds.razor.rz.scp.css */
.sl[b-ucygwxgica] { padding-block: 1.5rem 4rem; }

/* Breadcrumb back to whatever sent the grower here on a "add a seed" detour (?ret). */
.sl__back[b-ucygwxgica] {
    display: inline-block; font-family: 'Space Mono', monospace; font-size: 0.75rem;
    color: var(--hx-text-muted, #9a927e); text-decoration: none; letter-spacing: 0.05em;
    margin-bottom: 1.25rem;
}
.sl__back:hover[b-ucygwxgica] { color: var(--hx-gold, #d4af37); }

.sl__header[b-ucygwxgica] { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.sl__title[b-ucygwxgica] { font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem, 7vw, 2.6rem); letter-spacing: 0.05em; color: var(--hx-fg, #fff); margin: 0; }
.sl__sub[b-ucygwxgica] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.85rem; color: var(--hx-text-muted, #9a927e); margin: 0.15rem 0 0; max-width: 42ch; }

.sl__flash[b-ucygwxgica] {
    font-family: 'Space Mono', monospace; font-size: 0.78rem; padding: 0.55rem 0.8rem;
    border-radius: 8px; border: 1px solid; margin-bottom: 1rem;
}
.sl__flash--ok[b-ucygwxgica]  { color: #7bd88f; border-color: rgba(123, 216, 143, 0.4); background: rgba(123, 216, 143, 0.08); }
.sl__flash--err[b-ucygwxgica] { color: #e6a15a; border-color: rgba(230, 161, 90, 0.4);  background: rgba(230, 161, 90, 0.08); }

/* ── Form ─────────────────────────────────────────────── */
.sl__form[b-ucygwxgica] {
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 14px; padding: 1.25rem; margin-bottom: 1.5rem;
}
.sl__form-title[b-ucygwxgica] { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; letter-spacing: 0.06em; color: var(--hx-gold, #e8c46c); margin: 0 0 1rem; }
.sl__grid[b-ucygwxgica] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; }
@media (min-width: 720px) { .sl__grid[b-ucygwxgica] { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sl__field[b-ucygwxgica] { display: flex; flex-direction: column; gap: 0.3rem; }
.sl__field > span[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--hx-text-2, #cbc3b0); }
.sl__field em[b-ucygwxgica] { color: var(--hx-text-muted, #9a927e); font-style: normal; text-transform: none; }
.sl__field--wide[b-ucygwxgica] { grid-column: 1 / -1; }
@media (min-width: 720px) { .sl__field--wide[b-ucygwxgica] { grid-column: span 2; } .sl__field--num[b-ucygwxgica] { grid-column: span 1; } }
.sl__input[b-ucygwxgica] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem; padding: 0.5rem 0.6rem;
    border-radius: 8px; background: var(--hx-surface-2, #0c0c0c); color: var(--hx-fg, #fff);
    border: 1px solid var(--hx-border, #333); width: 100%;
}
.sl__form-issue[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.78rem; color: #e6a15a; margin: 1rem 0 0; }
.sl__form-actions[b-ucygwxgica] { display: flex; gap: 0.75rem; margin-top: 1.25rem; }

/* ── Toolbar ──────────────────────────────────────────── */
.sl__toolbar[b-ucygwxgica] { display: flex; justify-content: flex-end; margin-bottom: 0.75rem; }
.sl__toggle[b-ucygwxgica] { display: inline-flex; align-items: center; gap: 0.4rem; font-family: 'Space Mono', monospace; font-size: 0.75rem; color: var(--hx-text-2, #cbc3b0); cursor: pointer; }

/* ── List ─────────────────────────────────────────────── */
.sl__empty[b-ucygwxgica] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #9a927e); text-align: center; padding: 2.5rem 0; }
.sl__list[b-ucygwxgica] { display: flex; flex-direction: column; gap: 0.6rem; }
.sl__row[b-ucygwxgica] {
    display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 12px; padding: 0.85rem 1rem;
}
.sl__row.is-hidden[b-ucygwxgica] { opacity: 0.5; }
/* "I love this, but I'm out" — the orange restock accent from the grower's Legend. */
.sl__row.is-restock[b-ucygwxgica] { border-color: rgba(232, 140, 60, 0.55); box-shadow: inset 3px 0 0 rgba(232, 140, 60, 0.9); }
.sl__row-main[b-ucygwxgica] { flex: 1 1 12rem; min-width: 0; }
.sl__row-name[b-ucygwxgica] { display: flex; align-items: center; gap: 0.5rem; }
.sl__code[b-ucygwxgica] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; line-height: 1; color: var(--hx-surface-2, #0c0c0c);
    background: var(--hx-gold, #e8c46c); border-radius: 5px; padding: 0.1rem 0.4rem; min-width: 1.4rem; text-align: center;
}
.sl__strain[b-ucygwxgica] { font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; font-size: 1rem; color: var(--hx-fg, #fff); }
.sl__badge[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.55rem; letter-spacing: 0.1em; color: var(--hx-text-muted, #9a927e); border: 1px solid var(--hx-border, #333); border-radius: 999px; padding: 0.1rem 0.45rem; }
.sl__fav-star[b-ucygwxgica] { color: var(--hx-gold, #e8c46c); font-size: 0.9rem; line-height: 1; }
.sl__tag[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.55rem; letter-spacing: 0.1em; border-radius: 999px; padding: 0.1rem 0.5rem; }
.sl__tag--restock[b-ucygwxgica] { color: #e88c3c; border: 1px solid rgba(232, 140, 60, 0.6); background: rgba(232, 140, 60, 0.1); }
.sl__tag--out[b-ucygwxgica] { color: var(--hx-text-muted, #9a927e); border: 1px solid var(--hx-border, #333); }

/* Like (★) toggle */
.sl__star[b-ucygwxgica] {
    background: none; border: none; cursor: pointer; padding: 0.2rem 0.35rem;
    font-size: 1.1rem; line-height: 1; color: var(--hx-text-muted, #6a6357);
}
.sl__star:hover:not(:disabled)[b-ucygwxgica] { color: var(--hx-gold, #e8c46c); }
.sl__star.is-on[b-ucygwxgica] { color: var(--hx-gold, #e8c46c); }
.sl__star:disabled[b-ucygwxgica] { cursor: default; opacity: 0.6; }
.sl__row-meta[b-ucygwxgica] { display: flex; flex-wrap: wrap; gap: 0.4rem; font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-muted, #9a927e); margin-top: 0.25rem; }

/* The "grows sown from this seed" nav dropdown (doc 29) — the live "Run" column. */
.sl__grows[b-ucygwxgica] {
    margin-top: 0.45rem; font-family: 'Space Mono', monospace; font-size: 0.72rem;
    padding: 0.3rem 0.5rem; border-radius: 8px; max-width: 100%;
    background: var(--hx-surface-2, #0c0c0c); color: var(--hx-gold, #e8c46c);
    border: 1px solid var(--hx-border, #333); cursor: pointer;
}

/* Edit panel: link existing grows to this seed */
.sl__links[b-ucygwxgica] { margin-top: 1.25rem; border-top: 1px solid var(--hx-border, #2a2820); padding-top: 1rem; }
.sl__links-title[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--hx-text-2, #cbc3b0); }
.sl__links-empty[b-ucygwxgica] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: var(--hx-text-muted, #9a927e); margin: 0.5rem 0 0; }
.sl__links-list[b-ucygwxgica] { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }
.sl__link-item[b-ucygwxgica] {
    display: inline-flex; align-items: center; gap: 0.4rem; cursor: pointer;
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: var(--hx-text-2, #cbc3b0);
    padding: 0.35rem 0.6rem; border-radius: 999px;
    background: var(--hx-surface-2, #0c0c0c); border: 1px solid var(--hx-border, #333);
}
.sl__link-item.is-on[b-ucygwxgica] { border-color: var(--hx-gold, #e8c46c); color: var(--hx-fg, #fff); }
.sl__link-note[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.6rem; color: var(--hx-text-muted, #9a927e); }

.sl__qty[b-ucygwxgica] { display: flex; align-items: center; gap: 0.5rem; }
.sl__qty-btn[b-ucygwxgica] {
    width: 30px; height: 30px; border-radius: 8px; cursor: pointer; font-size: 1.1rem; line-height: 1;
    background: var(--hx-surface-2, #0c0c0c); color: var(--hx-fg, #fff); border: 1px solid var(--hx-border, #333);
    display: flex; align-items: center; justify-content: center;
}
.sl__qty-btn:hover:not(:disabled)[b-ucygwxgica] { border-color: var(--hx-gold, #e8c46c); }
.sl__qty-btn:disabled[b-ucygwxgica] { opacity: 0.4; cursor: default; }
.sl__qty-val[b-ucygwxgica] { font-family: 'Space Mono', monospace; font-size: 0.95rem; color: var(--hx-fg, #fff); min-width: 3rem; text-align: center; }
.sl__qty-total[b-ucygwxgica] { color: var(--hx-text-muted, #9a927e); font-size: 0.8rem; }

.sl__row-actions[b-ucygwxgica] { display: flex; align-items: center; gap: 0.4rem; }
.sl__btn-sm[b-ucygwxgica] { font-size: 0.78rem; padding: 0.35rem 0.7rem; }
.sl__btn-muted[b-ucygwxgica] { color: var(--hx-text-muted, #9a927e); }
/* /Components/Pages/Settings/Settings.razor.rz.scp.css */
.st[b-6ynvncebjb] { padding-block: 2.5rem 4rem; max-width: 44rem; }   /* padding-block only — preserve .hx-container padding-inline */

.st__head[b-6ynvncebjb] { margin-bottom: 1.75rem; }
.st__eyebrow[b-6ynvncebjb] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}
.st__headline[b-6ynvncebjb] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2.4rem;
    letter-spacing: 0.02em;
    color: var(--hx-fg, #fff);
    margin: 0.15rem 0 0;
}
.st__loading[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    color: var(--hx-muted);
}

.st__card[b-6ynvncebjb] {
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #222);
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
}
.st__card-title[b-6ynvncebjb] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.15rem;
    letter-spacing: 0.06em;
    color: var(--hx-fg, #fff);
    margin: 0;
}
.st__card-sub[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.86rem;
    color: var(--hx-muted);
    line-height: 1.45;
    margin: 0.35rem 0 1.1rem;
}

.st__opts[b-6ynvncebjb] {
    display: flex;
    gap: 0.65rem;
    flex-wrap: wrap;
}
.st__opt[b-6ynvncebjb] {
    flex: 1 1 140px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    text-align: left;
    padding: 0.75rem 0.9rem;
    background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #222);
    border-radius: 8px;
    color: var(--hx-fg, #fff);
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.st__opt:hover:not(:disabled)[b-6ynvncebjb] { border-color: rgba(232, 196, 108, 0.5); }
.st__opt:disabled[b-6ynvncebjb] { opacity: 0.6; cursor: default; }
.st__opt.is-selected[b-6ynvncebjb] {
    border-color: var(--hx-gold, #e8c46c);
    background: rgba(232, 196, 108, 0.08);
}
.st__opt-label[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-weight: 600;
    font-size: 0.92rem;
}
.st__opt-hint[b-6ynvncebjb] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-muted);
}

.st__saved[b-6ynvncebjb] {
    font-family: 'Space Mono', monospace;
    font-size: 0.82rem;
    color: #7bd88f;
    margin: 0.5rem 0 0;
}

/* ── Profile card (identity — doc 33; pickers live in <AvatarPicker>) ─────── */
.st__profile-fields[b-6ynvncebjb] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-width: 0;
}
.st__profile-fields--wide[b-6ynvncebjb] { margin-bottom: 1.3rem; }
.st__avatar-picker[b-6ynvncebjb] { margin-bottom: 1.3rem; }
.st__field[b-6ynvncebjb] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.st__field-label[b-6ynvncebjb] {
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-muted);
}
.st__input[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.95rem;
    color: var(--hx-fg, #fff);
    background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #222);
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    transition: border-color 0.12s ease;
}
.st__input:focus[b-6ynvncebjb] { outline: none; border-color: var(--hx-gold, #e8c46c); }
.st__input--error[b-6ynvncebjb] { border-color: #d1544f; }
/* The handle is rendered text, not a disabled input (operator, 2026-08-29). Gold monospace is how a
   handle reads everywhere else in the app, so it looks like an identity rather than a dead field.
   Padding-block only, and no inline padding, so it sits flush with the label above it. */
.st__handle[b-6ynvncebjb] {
    font-family: 'Space Mono', monospace;
    font-weight: 700;
    font-size: 1rem;
    color: var(--hx-gold, #e8c46c);
    margin: 0.25rem 0 0;
    word-break: break-all;
    /* Indent to the same optical line as the Display name TEXT above it (operator, 2026-08-29).
       That field's text starts at .st__input's inline padding (0.8rem) plus its 1px border, so
       matching those two values keeps the column aligned. ⚠ If .st__input's padding or border
       changes, this must change with it — it is a deliberate copy, not a coincidence. */
    padding-left: calc(0.8rem + 1px);
}
.st__field-hint[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.75rem;
    color: var(--hx-muted);
    line-height: 1.35;
}
.st__field-error[b-6ynvncebjb] {
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 0.76rem;
    color: #e08a86;
}

/* Page footer (operator, 2026-08-29): the saved note sits immediately LEFT of the Save button, both
   anchored right. justify-content:flex-end keeps them together as a pair, so the confirmation reads
   as belonging to the action rather than floating at the far side of the page. */
.st__footer[b-6ynvncebjb] {
    display: flex; align-items: center; justify-content: flex-end; gap: 1rem;
    margin-top: 0.5rem;
}
/* /Components/Pages/Showcase/ShowcaseArena.razor.rz.scp.css */
/* THE ARENA — browse carousel (planning doc 20 §7.2). Mobile-first; slide internals flex & auto-arrange. */
.arena__hero[b-6h36lggskj] { text-align: center; padding: 2.5rem 1rem 1.25rem; background: radial-gradient(ellipse at 50% -20%, rgba(232,196,108,0.14), transparent 60%); }
.arena__eyebrow[b-6h36lggskj] { font-family: 'Space Mono', monospace; font-size: 0.78rem; letter-spacing: 0.28em; color: var(--hx-gold, #e8c46c); margin: 0 0 0.5rem; }
.arena__title[b-6h36lggskj] { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.8rem, 10vw, 6rem); letter-spacing: 0.04em; line-height: 0.9; margin: 0; color: var(--hx-text-heading, #f6efdd); text-shadow: 0 0 40px rgba(232,196,108,0.25); }
.arena__sub[b-6h36lggskj] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); margin: 0.6rem 0 0; }
.arena__loading[b-6h36lggskj] { text-align: center; font-family: 'Space Mono', monospace; color: var(--hx-text-muted, #9a927e); padding: 3rem 0; }

.arena__dark[b-6h36lggskj] { text-align: center; padding: 4rem 1rem; }
.arena__dark-emoji[b-6h36lggskj] { font-size: 3.5rem; opacity: 0.7; }
.arena__dark-title[b-6h36lggskj] { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--hx-text-heading, #f6efdd); margin: 0.5rem 0 0.4rem; }
.arena__dark-sub[b-6h36lggskj] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #9a927e); margin: 0; }

.arena__filters[b-6h36lggskj] { display: flex; flex-wrap: wrap; gap: 0.45rem; justify-content: center; margin: 0.5rem 0 1.5rem; }
.arena__filter[b-6h36lggskj] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
    padding: 0.35rem 0.8rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-3, #b0a890);
    border: 1px solid var(--hx-border, #2a2820); transition: all 0.15s;
}
.arena__filter:hover[b-6h36lggskj] { border-color: rgba(232,196,108,0.5); color: var(--hx-text-heading, #f6efdd); }
.arena__filter.is-active[b-6h36lggskj] { background: var(--hx-gold, #e8c46c); color: #17140e; border-color: var(--hx-gold, #e8c46c); }
.arena__empty[b-6h36lggskj] { text-align: center; font-family: 'Space Mono', monospace; color: var(--hx-text-muted, #9a927e); padding: 2rem 0; }

/* Carousel — one big centered card with arrows OUTSIDE it (beside), so a mis-aim can't click the card.
   Flex row: [‹] [viewport/card] [›], the whole group centered. CSS-animated slide, no scrollbar. */
.arena__carousel[b-6h36lggskj] { display: flex; align-items: center; justify-content: center; gap: 0.75rem; }
.arena__viewport[b-6h36lggskj] { flex: 0 1 760px; min-width: 0; overflow: hidden; }
.arena__track[b-6h36lggskj] { display: flex; transition: transform 0.4s ease; }
.arena__cell[b-6h36lggskj] { flex: 0 0 100%; display: flex; justify-content: center; padding: 0.5rem 0.15rem 1rem; }

.arena__nav[b-6h36lggskj] {
    flex: 0 0 auto;
    width: 2.6rem; height: 2.6rem; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem; line-height: 1; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232,196,108,0.5); transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
}
.arena__nav:hover:not(:disabled)[b-6h36lggskj] { background: var(--hx-gold, #e8c46c); color: #17140e; border-color: var(--hx-gold, #e8c46c); }
.arena__nav:disabled[b-6h36lggskj] { opacity: 0.2; cursor: default; }

/* Slide card — big and centered; internals flex-column so they auto-arrange & wrap on mobile.
   Arrows live outside now, so the card gets normal padding. */
.arena__slide[b-6h36lggskj] {
    width: 100%; max-width: 760px;
    display: flex; flex-direction: column; gap: 0.9rem;
    min-height: 380px; padding: 2rem 2.1rem 1.9rem;
    border-radius: 18px; text-decoration: none;
    background: radial-gradient(ellipse at 50% -10%, rgba(232,196,108,0.13), transparent 65%), var(--hx-surface-1, #14110c);
    border: 1px solid var(--hx-border, #2a2820);
    transition: border-color 0.15s, transform 0.12s;
}
@media (min-width: 768px) {
    .arena__slide[b-6h36lggskj] { min-height: 440px; padding: 2.6rem 2.8rem 2.4rem; }
}
.arena__slide:hover[b-6h36lggskj] { border-color: rgba(232,196,108,0.45); }
.arena__slide--on-now[b-6h36lggskj] { border-color: rgba(108,191,122,0.4); background: radial-gradient(ellipse at 50% -10%, rgba(108,191,122,0.14), transparent 65%), var(--hx-surface-1, #14110c); }

.arena__ribbon[b-6h36lggskj] { align-self: flex-start; font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.22em; padding: 0.25rem 0.7rem; border-radius: 999px; border: 1px solid var(--hx-border, #2a2820); color: var(--hx-text-3, #b0a890); }
.arena__ribbon--on-now[b-6h36lggskj] { color: var(--hx-green, #6cbf7a); border-color: rgba(108,191,122,0.4); background: rgba(108,191,122,0.08); }
.arena__ribbon--entries[b-6h36lggskj] { color: var(--hx-gold, #e8c46c); border-color: rgba(232,196,108,0.4); background: rgba(232,196,108,0.08); }
.arena__ribbon--results[b-6h36lggskj] { color: var(--hx-gold, #e8c46c); border-color: rgba(232,196,108,0.5); background: rgba(232,196,108,0.12); }

.arena__slide-name[b-6h36lggskj] { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.4rem, 7vw, 4rem); letter-spacing: 0.02em; line-height: 0.96; color: var(--hx-gold, #e8c46c); margin: 0; }
.arena__slide-desc[b-6h36lggskj] { font-family: 'Hanken Grotesk', sans-serif; font-size: 1.05rem; color: var(--hx-text-2, #cbc3b0); margin: 0; }
.arena__slide-reqs[b-6h36lggskj] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.arena__req[b-6h36lggskj] { font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.03em; padding: 0.2rem 0.5rem; border-radius: 6px; background: rgba(255,255,255,0.03); border: 1px solid var(--hx-border, #2a2820); color: var(--hx-text-3, #b0a890); }
.arena__req--mode[b-6h36lggskj] { background: rgba(232,196,108,0.08); border-color: rgba(232,196,108,0.25); color: var(--hx-gold, #e8c46c); }

/* Footer pinned to the bottom (margin-top:auto) and wrapping so nothing overflows on a phone. */
.arena__slide-foot[b-6h36lggskj] { margin-top: auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0.4rem 0.8rem; padding-top: 0.7rem; }
.arena__when[b-6h36lggskj] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-muted, #9a927e); }
.arena__go[b-6h36lggskj] { font-family: 'Space Mono', monospace; font-size: 0.78rem; color: var(--hx-gold, #e8c46c); white-space: nowrap; }

/* Dots — the classic carousel position indicator (click to jump). */
.arena__dots[b-6h36lggskj] { display: flex; justify-content: center; gap: 0.5rem; margin: 0.5rem 0 3rem; }
.arena__dot[b-6h36lggskj] { width: 0.6rem; height: 0.6rem; border-radius: 50%; cursor: pointer; padding: 0; border: none; background: var(--hx-border, #2a2820); transition: background 0.15s, transform 0.15s; }
.arena__dot:hover[b-6h36lggskj] { background: var(--hx-text-3, #b0a890); }
.arena__dot.is-active[b-6h36lggskj] { background: var(--hx-gold, #e8c46c); transform: scale(1.3); }
/* /Components/Pages/Showcase/ShowcaseFloor.razor.rz.scp.css */
.floor__hero[b-5g5nagiqso] {
    text-align: center;
    padding: 3rem 1rem 1.5rem;
    background: radial-gradient(ellipse at 50% -20%, rgba(232,196,108,0.14), transparent 60%);
}
.floor__eyebrow[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.8rem; letter-spacing: 0.28em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 0.5rem;
}
.floor__headline[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(3rem, 9vw, 6rem);
    letter-spacing: 0.04em; line-height: 0.9; margin: 0; color: var(--hx-text-heading, #f6efdd);
    text-shadow: 0 0 40px rgba(232,196,108,0.25);
}
/* The show name is the star of the bill — promoted to the hero headline, in gold. */
.floor__showname-hero[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.8rem, 8vw, 5.5rem);
    letter-spacing: 0.03em; line-height: 0.92; margin: 0.1rem 0 0; color: var(--hx-gold, #e8c46c);
    text-shadow: 0 0 44px rgba(232,196,108,0.3);
}
.floor__loading[b-5g5nagiqso] { text-align: center; font-family: 'Space Mono', monospace; color: var(--hx-text-muted, #9a927e); padding: 3rem 0; }

/* Marquee dark (empty state) */
.floor__dark[b-5g5nagiqso] { text-align: center; padding: 4rem 1rem; }
.floor__dark-emoji[b-5g5nagiqso] { font-size: 3.5rem; opacity: 0.7; }
.floor__dark-title[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--hx-text-heading, #f6efdd); margin: 0.5rem 0 0.4rem; }
.floor__dark-sub[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-muted, #9a927e); margin: 0; }

/* Show picker */
.floor__tabs[b-5g5nagiqso] { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; margin: 0 0 1.5rem; }
.floor__tab[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1rem; letter-spacing: 0.04em;
    padding: 0.4rem 0.9rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-3, #b0a890);
    border: 1px solid var(--hx-border, #2a2820); transition: all 0.15s;
}
.floor__tab:hover[b-5g5nagiqso] { border-color: rgba(232,196,108,0.5); color: var(--hx-text-heading, #f6efdd); }
.floor__tab.is-active[b-5g5nagiqso] { background: var(--hx-gold, #e8c46c); color: #17140e; border-color: var(--hx-gold, #e8c46c); }

.floor__showhead[b-5g5nagiqso] { text-align: center; margin-bottom: 2rem; }
.floor__showname[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; letter-spacing: 0.03em; color: var(--hx-gold, #e8c46c); margin: 0; }
.floor__showdesc[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-size: 1.15rem; color: var(--hx-text-2, #cbc3b0); margin: 0.6rem 0 0; }
.floor__mode[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.78rem; color: var(--hx-text-muted, #9a927e); margin: 0.6rem 0 0; }
.floor__voted[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.82rem; color: var(--hx-gold, #e8c46c); margin: 0.7rem 0 0; }
.floor__voted strong[b-5g5nagiqso] { color: var(--hx-text-heading, #f6efdd); }
.floor__vote-hint[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.82rem; color: var(--hx-text-muted, #9a927e); margin: 0.7rem 0 0; }
.floor__vote-hint strong[b-5g5nagiqso] { color: var(--hx-text-2, #cbc3b0); }

/* Section divider above the lineup. */
.floor__section[b-5g5nagiqso] {
    text-align: center;
    font-family: 'Space Mono', monospace; font-size: 0.8rem; letter-spacing: 0.28em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 1.5rem;
}

/* View toggle — Grid (compare + quick pick) vs Spotlight reel (savor one at a time). */
.floor__view-toggle[b-5g5nagiqso] { display: flex; justify-content: center; gap: 0.4rem; margin: 0 0 1.5rem; }
.floor__view-btn[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.06em;
    padding: 0.35rem 0.85rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-3, #b0a890);
    border: 1px solid var(--hx-border, #2a2820); transition: all 0.15s;
}
.floor__view-btn:hover[b-5g5nagiqso] { border-color: rgba(232,196,108,0.5); color: var(--hx-text-heading, #f6efdd); }
.floor__view-btn.is-active[b-5g5nagiqso] { background: var(--hx-gold, #e8c46c); color: #17140e; border-color: var(--hx-gold, #e8c46c); }

/* Spotlight reel — one act, centered, arrows OUTSIDE the card (it's a link); JS-free CSS-transform slide. */
.floor__reel[b-5g5nagiqso] { display: flex; align-items: center; justify-content: center; gap: 0.6rem; padding-bottom: 0.5rem; }
.floor__reel-nav[b-5g5nagiqso] {
    flex: 0 0 auto; width: 2.6rem; height: 2.6rem; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem; line-height: 1; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232,196,108,0.5); transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
}
.floor__reel-nav:hover:not(:disabled)[b-5g5nagiqso] { background: var(--hx-gold, #e8c46c); color: #17140e; }
.floor__reel-nav:disabled[b-5g5nagiqso] { opacity: 0.25; cursor: default; }
.floor__reel-viewport[b-5g5nagiqso] { flex: 0 1 460px; min-width: 0; overflow: hidden; }
.floor__reel-track[b-5g5nagiqso] { display: flex; transition: transform 0.4s ease; }
.floor__reel-cell[b-5g5nagiqso] { flex: 0 0 100%; display: flex; justify-content: center; padding: 0.4rem 0.3rem 0.8rem; }
.floor__reel .floor__act[b-5g5nagiqso] { width: 100%; max-width: 440px; }
.floor__reel-dots[b-5g5nagiqso] { display: flex; justify-content: center; gap: 0.45rem; margin: 0.2rem 0 3rem; }
.floor__reel-dot[b-5g5nagiqso] { width: 0.55rem; height: 0.55rem; border-radius: 50%; cursor: pointer; padding: 0; border: none; background: var(--hx-border, #2a2820); transition: background 0.15s, transform 0.15s; }
.floor__reel-dot:hover[b-5g5nagiqso] { background: var(--hx-text-3, #b0a890); }
.floor__reel-dot.is-active[b-5g5nagiqso] { background: var(--hx-gold, #e8c46c); transform: scale(1.25); }

/* Acts — a deliberate board (doc 21 §4): 2-up on mobile, a 1×5 / 2×5 lineup on desktop. */
.floor__acts[b-5g5nagiqso] {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.85rem;
    padding-bottom: 4rem;
}
@media (min-width: 768px) {
    .floor__acts[b-5g5nagiqso] { grid-template-columns: repeat(5, 1fr); gap: 1.25rem; }
}
.floor__act[b-5g5nagiqso] {
    position: relative;   /* anchors the judge-set badge over the act image */
    display: flex; flex-direction: column; overflow: hidden;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 12px; transition: border-color 0.15s, transform 0.1s;
}
/* "the grower picked these" (doc 38) — a quiet gold chip, not a second call to action. It sits ABOVE the
   card link in z-order so its own tap opens the gallery instead of the grow. */
.floor__act-set[b-5g5nagiqso] {
    position: absolute; top: 0.4rem; right: 0.4rem; z-index: 2; cursor: pointer;
    font-family: 'Space Mono', monospace; font-size: 0.6rem; letter-spacing: 0.04em;
    padding: 0.2rem 0.45rem; border-radius: 999px; text-decoration: none;
    background: rgba(0, 0, 0, 0.74); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232, 196, 108, 0.45);
}
.floor__act-set:hover[b-5g5nagiqso] { background: rgba(232, 196, 108, 0.24); color: #fff; }

/* The same badge on a closed show's standing — smaller, since the tier row is a compact ladder. */
.floor__tier-set[b-5g5nagiqso] {
    cursor: pointer; align-self: flex-end;
    font-family: 'Space Mono', monospace; font-size: 0.6rem; letter-spacing: 0.04em;
    padding: 0.15rem 0.4rem; border-radius: 999px;
    background: rgba(0, 0, 0, 0.5); color: var(--hx-gold, #e8c46c);
    border: 1px solid rgba(232, 196, 108, 0.45);
}
.floor__tier-set:hover[b-5g5nagiqso] { background: rgba(232, 196, 108, 0.24); color: #fff; }

/* ── The judge-set viewer: the grower's picks, without leaving the show ── */
.floor__setview[b-5g5nagiqso] {
    position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center;
    padding: 1rem; background: rgba(0, 0, 0, 0.9);
}
.floor__setview-panel[b-5g5nagiqso] {
    width: 100%; max-width: 34rem; max-height: 92vh; overflow-y: auto; padding: 1rem;
    background: var(--hx-surface-1, #14110c); border: 1px solid rgba(232, 196, 108, 0.35);
    border-radius: 14px;
}
.floor__setview-head[b-5g5nagiqso] { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; }
.floor__setview-eyebrow[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.6rem; letter-spacing: 0.14em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 0.15rem;
}
.floor__setview-name[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: 0.04em;
    color: var(--hx-text-1, #f3eede); margin: 0;
}
.floor__setview-x[b-5g5nagiqso] {
    flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; cursor: pointer;
    background: rgba(255, 255, 255, 0.07); color: var(--hx-text-2, #cbc3b0); border: none;
}
.floor__setview-x:hover[b-5g5nagiqso] { background: rgba(232, 196, 108, 0.22); color: #fff; }
.floor__setview-loading[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-muted, #9a927e);
    padding: 2rem 0; text-align: center;
}

/* No forced aspect ratio: the stage sizes to the PHOTO. A fixed 3/4 box suits portrait grow shots and
   letterboxes everything else — a canopy or tent shot floated in dead bands top and bottom. The image caps
   itself instead, so each one fills its own shape. Trade accepted: the panel height shifts a little as you
   page between a portrait and a landscape frame. min-height keeps the loading state and the ‹ › from
   collapsing onto a one-line box. */
.floor__setview-stage[b-5g5nagiqso] {
    position: relative; margin-top: 0.75rem; overflow: hidden; min-height: 11rem;
    border-radius: 10px; background: var(--hx-surface-2, #0c0c0c);
    display: flex; align-items: center; justify-content: center;
}
.floor__setview-img[b-5g5nagiqso] {
    display: block; width: auto; height: auto;
    max-width: 100%; max-height: 56vh; object-fit: contain;
}
.floor__setview-demo[b-5g5nagiqso] { font-size: 3rem; opacity: 0.45; }
.floor__setview-nav[b-5g5nagiqso] {
    position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer;
    width: 34px; height: 44px; font-size: 1.4rem; line-height: 1; border: none;
    background: rgba(0, 0, 0, 0.55); color: var(--hx-gold, #e8c46c);
}
.floor__setview-nav:hover[b-5g5nagiqso] { background: rgba(232, 196, 108, 0.28); color: #fff; }
.floor__setview-nav.is-prev[b-5g5nagiqso] { left: 0; border-radius: 0 8px 8px 0; }
.floor__setview-nav.is-next[b-5g5nagiqso] { right: 0; border-radius: 8px 0 0 8px; }

.floor__setview-cap[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.05em;
    color: var(--hx-text-muted, #9a927e); text-align: center; margin: 0.5rem 0 0;
}
.floor__setview-strip[b-5g5nagiqso] { display: flex; gap: 0.3rem; overflow-x: auto; margin-top: 0.5rem; padding-bottom: 0.2rem; }
.floor__setview-thumb[b-5g5nagiqso] {
    flex: 0 0 auto; width: 44px; height: 56px; padding: 0; overflow: hidden; cursor: pointer;
    border-radius: 6px; background: var(--hx-surface-2, #0c0c0c);
    border: 1px solid var(--hx-border, #2a2820);
    display: flex; align-items: center; justify-content: center;
}
.floor__setview-thumb img[b-5g5nagiqso] { width: 100%; height: 100%; object-fit: cover; }
.floor__setview-thumb-demo[b-5g5nagiqso] { font-size: 1rem; opacity: 0.45; }
.floor__setview-thumb.is-on[b-5g5nagiqso] { border-color: var(--hx-gold, #e8c46c); box-shadow: 0 0 0 1px var(--hx-gold, #e8c46c); }

.floor__setview-actions[b-5g5nagiqso] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.9rem; }
.floor__act:hover[b-5g5nagiqso] { transform: translateY(-2px); border-color: rgba(232,196,108,0.4); }
.floor__act.is-mine[b-5g5nagiqso] { border-color: var(--hx-green, #6cbf7a); box-shadow: 0 0 0 1px rgba(108,191,122,0.4); }
/* The act this viewer cheered — gold (their pick), distinct from the green "that's you" owner border. */
.floor__act.is-pick[b-5g5nagiqso] { border-color: var(--hx-gold, #e8c46c); box-shadow: 0 0 0 1px rgba(232,196,108,0.5), 0 0 26px rgba(232,196,108,0.18); }

/* The clickable review link — wraps image + info, drills into the read-only run (doc 13). Cheer stays outside it. */
.floor__act-view[b-5g5nagiqso] { display: flex; flex-direction: column; text-decoration: none; color: inherit; }

.floor__act-img[b-5g5nagiqso] {
    aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center;
    background: radial-gradient(ellipse at center, rgba(108,191,122,0.12), rgba(20,17,12,0.6));
    overflow: hidden;
}
.floor__act-img img[b-5g5nagiqso] { width: 100%; height: 100%; object-fit: cover; }
.floor__act-glyph[b-5g5nagiqso] { font-size: 3rem; opacity: 0.55; }

.floor__act-body[b-5g5nagiqso] { padding: 0.9rem 1rem 0.5rem; display: flex; flex-direction: column; gap: 0.3rem; }
.floor__act-top[b-5g5nagiqso] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.floor__act-plant[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 1.25rem; letter-spacing: 0.02em; color: var(--hx-text-heading, #f6efdd); line-height: 1.05; }
.floor__act-score[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-weight: 700; font-size: 1.3rem; color: var(--hx-green, #6cbf7a); display: inline-flex; align-items: baseline; gap: 0.25rem; white-space: nowrap; }
.floor__act-score-label[b-5g5nagiqso] { font-size: 0.52rem; letter-spacing: 0.04em; color: var(--hx-gold, #e8c46c); }
.floor__act-grower[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.8rem; color: var(--hx-gold, #e8c46c); }
.floor__act-you[b-5g5nagiqso] { font-size: 0.62rem; color: var(--hx-green, #6cbf7a); margin-left: 0.35rem; letter-spacing: 0.05em; }
.floor__act-strain[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: var(--hx-text-muted, #9a927e); }
.floor__act-see[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.68rem; letter-spacing: 0.04em; color: var(--hx-text-muted, #9a927e); margin-top: 0.35rem; transition: color 0.15s; }
.floor__act:hover .floor__act-see[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }

.floor__act-cheer[b-5g5nagiqso] { margin-top: auto; padding: 0.5rem 1rem 1rem; }
/* The hero action — big, full-width, gold, inviting. Cheering is the whole point of the Floor. */
.floor__cheer[b-5g5nagiqso] {
    display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; cursor: pointer;
    padding: 0.85rem 1rem; border-radius: 12px;
    background: linear-gradient(180deg, rgba(232,196,108,0.24), rgba(232,196,108,0.12));
    border: 1.5px solid var(--hx-gold, #e8c46c);
    color: var(--hx-gold, #e8c46c);
    font-family: 'Bebas Neue', sans-serif; font-size: 1.35rem; letter-spacing: 0.07em;
    box-shadow: 0 0 0 3px rgba(232,196,108,0.08);
    animation: floor-cheer-invite-b-5g5nagiqso 2.2s ease-in-out infinite;
    transition: transform 0.12s, background 0.12s, box-shadow 0.12s, color 0.12s;
}
.floor__cheer:hover:not(:disabled)[b-5g5nagiqso] {
    background: var(--hx-gold, #e8c46c); color: #1a1400; transform: translateY(-2px) scale(1.02);
    box-shadow: 0 10px 28px rgba(232,196,108,0.4); animation: none;
}
/* Your pick — gold, celebratory (the act you spent your cheer on). Non-interactive span. */
.floor__cheer.is-cheered[b-5g5nagiqso] {
    background: var(--hx-gold, #e8c46c); color: #1a1400; border-color: var(--hx-gold, #e8c46c);
    cursor: default; pointer-events: none; animation: none;
}
/* Every other act once your cheer is spent — muted, locked. */
.floor__cheer.is-spent[b-5g5nagiqso] { opacity: 0.4; cursor: default; pointer-events: none; animation: none; }
.floor__cheer-emoji[b-5g5nagiqso] { font-size: 1.5rem; line-height: 1; }
.floor__applause-num[b-5g5nagiqso] { font-weight: 700; }
.floor__cheer-label[b-5g5nagiqso] { font-size: 1.35rem; letter-spacing: 0.07em; }
@keyframes floor-cheer-invite-b-5g5nagiqso { 0%, 100% { box-shadow: 0 0 0 3px rgba(232,196,108,0.08); } 50% { box-shadow: 0 0 22px 3px rgba(232,196,108,0.28); } }
@media (prefers-reduced-motion: reduce) { .floor__cheer[b-5g5nagiqso] { animation: none; } }
.floor__applause[b-5g5nagiqso] { font-family: 'Space Mono', monospace; color: var(--hx-text-3, #b0a890); font-size: 0.9rem; }
.floor__applause .floor__applause-num[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }

/* The judging/voting countdown shown while cheering's open — how long you've got left to weigh in.
   A prominent clock: a small label over a big gold mm:ss so the deadline reads at a glance. */
.floor__voting-clock[b-5g5nagiqso] {
    text-align: center; font-family: 'Space Mono', monospace; font-size: 0.8rem;
    letter-spacing: 0.12em; text-transform: uppercase; color: var(--hx-text-muted, #9a927e);
    margin: 0 0 1.5rem;
}
.floor__voting-clock strong[b-5g5nagiqso] {
    display: block; margin-top: 0.15rem;
    font-family: 'Bebas Neue', sans-serif; font-weight: 400;
    font-size: clamp(2.6rem, 11vw, 4rem); line-height: 1; letter-spacing: 0.03em;
    color: var(--hx-gold, #e8c46c); text-shadow: 0 0 24px rgba(232,196,108,0.3);
    font-variant-numeric: tabular-nums;
}

/* First-timer "how to vote" cue — a mini sample button + plain-language instruction (dogfood 2026-07-12). */
.floor__how[b-5g5nagiqso] {
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.6rem;
    margin: 0 auto 1.25rem; padding: 0.6rem 1rem; max-width: 520px;
    background: rgba(232,196,108,0.06); border: 1px dashed var(--hx-border-gold, rgba(232,196,108,0.4)); border-radius: 12px;
}
.floor__how-sample[b-5g5nagiqso] {
    display: inline-flex; align-items: center; gap: 0.35rem; flex: 0 0 auto;
    padding: 0.35rem 0.7rem; border-radius: 999px;
    background: linear-gradient(180deg, rgba(232,196,108,0.24), rgba(232,196,108,0.12));
    border: 1.5px solid var(--hx-gold, #e8c46c); color: var(--hx-gold, #e8c46c);
    font-family: 'Bebas Neue', sans-serif; font-size: 1rem; letter-spacing: 0.06em;
}
.floor__how-emoji[b-5g5nagiqso] { font-size: 1.15rem; line-height: 1; }
.floor__how-text[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.95rem; color: var(--hx-text-2, #cbc3b0); }
.floor__how-text strong[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }

/* ── The Playbill: filter chips + posters (doc 20 §7.2) ── */
.floor__filters[b-5g5nagiqso] { display: flex; flex-wrap: wrap; gap: 0.45rem; justify-content: center; margin: 0 0 2rem; }
.floor__filter[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
    padding: 0.35rem 0.8rem; border-radius: 999px; cursor: pointer;
    background: var(--hx-surface-1, #14110c); color: var(--hx-text-3, #b0a890);
    border: 1px solid var(--hx-border, #2a2820); transition: all 0.15s;
}
.floor__filter:hover[b-5g5nagiqso] { border-color: rgba(232,196,108,0.5); color: var(--hx-text-heading, #f6efdd); }
.floor__filter.is-active[b-5g5nagiqso] { background: var(--hx-gold, #e8c46c); color: #17140e; border-color: var(--hx-gold, #e8c46c); }

.floor__posters[b-5g5nagiqso] {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem;
    margin: 0 0 2.5rem;
}
.floor__poster[b-5g5nagiqso] {
    display: flex; flex-direction: column; gap: 0.6rem;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    border-radius: 12px; padding: 1.1rem 1.15rem 1.2rem;
    transition: border-color 0.15s, transform 0.1s;
}
.floor__poster:hover[b-5g5nagiqso] { transform: translateY(-2px); border-color: rgba(232,196,108,0.35); }
.floor__poster--open[b-5g5nagiqso] { border-color: rgba(232,196,108,0.35); }   /* taking entries — a touch of gold */

.floor__poster-top[b-5g5nagiqso] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.6rem; }
.floor__poster-name[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem; letter-spacing: 0.02em; color: var(--hx-gold, #e8c46c); line-height: 1.05; margin: 0; }
.floor__poster-when[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.68rem; color: var(--hx-text-muted, #9a927e); white-space: nowrap; }
.floor__poster-desc[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem; color: var(--hx-text-2, #cbc3b0); margin: 0; }

.floor__poster-reqs[b-5g5nagiqso] { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.15rem; }
.floor__req[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.03em;
    padding: 0.2rem 0.5rem; border-radius: 6px;
    background: rgba(255,255,255,0.03); border: 1px solid var(--hx-border, #2a2820); color: var(--hx-text-3, #b0a890);
}
.floor__req--mode[b-5g5nagiqso] { background: rgba(232,196,108,0.08); border-color: rgba(232,196,108,0.25); color: var(--hx-gold, #e8c46c); }
.floor__poster-cta[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-3, #b0a890); margin: 0.2rem 0 0; }

/* ── Show detail (a show's Floor) — back link, status ribbon, dormant standby ── */
.floor__back[b-5g5nagiqso] {
    display: inline-block; font-family: 'Space Mono', monospace; font-size: 0.75rem; letter-spacing: 0.08em;
    color: var(--hx-text-muted, #9a927e); text-decoration: none; margin-bottom: 0.8rem;
}
.floor__back:hover[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }

.floor__ribbon[b-5g5nagiqso] {
    display: inline-block; font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.24em;
    padding: 0.25rem 0.75rem; border-radius: 999px; margin: 0 0 0.5rem;
    border: 1px solid var(--hx-border, #2a2820); color: var(--hx-text-3, #b0a890);
}
.floor__ribbon--on-now[b-5g5nagiqso]  { color: var(--hx-green, #6cbf7a); border-color: rgba(108,191,122,0.4); background: rgba(108,191,122,0.08); }
.floor__ribbon--entries[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c);  border-color: rgba(232,196,108,0.4); background: rgba(232,196,108,0.08); }

.floor__standby[b-5g5nagiqso] { text-align: center; padding: 1.5rem 0 4rem; display: flex; flex-direction: column; align-items: center; gap: 1.1rem; }
.floor__countdown[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem, 5vw, 2.8rem); letter-spacing: 0.05em; color: var(--hx-gold, #e8c46c); margin: 0; }
.floor__standby-reqs[b-5g5nagiqso] { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: center; }
.floor__standby-cta[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); max-width: 32rem; margin: 0.2rem auto 0; }

/* ── The final standing — a pyramid revealed bottom-up to the champion (doc 21 §6) ──
   Every act on it already won the draw: NO red, NO "last place". Placement, never defeat. */
.floor__pyramid[b-5g5nagiqso] { display: flex; flex-direction: column; align-items: center; gap: 0.7rem; padding-bottom: 4rem; }
.floor__tier[b-5g5nagiqso] {
    width: 100%; max-width: calc(20rem + var(--rank, 1) * 3rem);   /* wider toward the base, narrow gold apex */
    display: flex; align-items: center; gap: 0.9rem;
    padding: 0.85rem 1.1rem; border-radius: 12px;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
    opacity: 0; transform: translateY(14px);
    animation: floor-tier-in-b-5g5nagiqso 0.55s ease forwards;
    animation-delay: calc(var(--reveal, 0) * 0.7s);   /* bottom rung first, champion last */
    transition: box-shadow 0.45s ease;   /* so the ceremony spotlight glides off as it moves down the standing */
}
@keyframes floor-tier-in-b-5g5nagiqso { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .floor__tier[b-5g5nagiqso] { animation: none; opacity: 1; transform: none; }
}
.floor__tier.is-champ[b-5g5nagiqso] {
    max-width: 24rem; padding: 1.1rem 1.2rem;
    border-color: var(--hx-gold, #e8c46c);
    background: radial-gradient(ellipse at 50% -40%, rgba(232,196,108,0.22), transparent 70%), var(--hx-surface-1, #14110c);
    box-shadow: 0 0 32px rgba(232,196,108,0.22);
}
.floor__tier-badge[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; color: var(--hx-text-3, #b0a890); min-width: 2rem; text-align: center; }
.floor__tier.is-champ .floor__tier-badge[b-5g5nagiqso] { font-size: 1.9rem; }
.floor__tier-body[b-5g5nagiqso] { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.floor__tier-name[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 1.25rem; letter-spacing: 0.02em; line-height: 1.05; color: var(--hx-text-heading, #f6efdd); }
.floor__tier.is-champ .floor__tier-name[b-5g5nagiqso] { font-size: 1.75rem; color: var(--hx-gold, #e8c46c); }
.floor__tier-body:hover .floor__tier-name[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }
.floor__tier-grower[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.03em; color: var(--hx-text-muted, #9a927e); }
.floor__tier.is-champ .floor__tier-grower[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }
.floor__tier-meta[b-5g5nagiqso] { display: flex; flex-direction: column; align-items: flex-end; gap: 0.15rem; white-space: nowrap; }
.floor__tier-applause[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.85rem; color: var(--hx-text-2, #cbc3b0); }
.floor__tier-hax[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-weight: 700; font-size: 1rem; color: var(--hx-green, #6cbf7a); display: inline-flex; align-items: baseline; gap: 0.2rem; }
.floor__tier-haxlabel[b-5g5nagiqso] { font-size: 0.5rem; letter-spacing: 0.04em; color: var(--hx-gold, #e8c46c); }

/* ── The Results Ceremony (doc 21 §6a) — the draw's twin, counting up to the champion ─────────── */
/* The announcer's cue, held while placements fall into place worst-first. Pulses like the draw eyebrow
   but at headline weight — "I PRESENT THE WINNERS OF <show>…". */
.floor__results-cue[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(1.5rem, 6vw, 2.6rem); letter-spacing: 0.04em; line-height: 1.05;
    color: var(--hx-gold, #e8c46c); text-align: center;
    text-shadow: 0 0 24px rgba(232, 196, 108, 0.38);
    animation: floor-pulse-b-5g5nagiqso 1.6s ease-in-out infinite;
}
/* Spotlight on the placement that just landed — a gold halo that glides down the standing (via the
   base tier's box-shadow transition) as the next act arrives, so the eye follows the countdown. */
.floor__tier.is-newest[b-5g5nagiqso] {
    box-shadow: 0 0 0 2px rgba(232, 196, 108, 0.35), 0 12px 34px rgba(232, 196, 108, 0.14);
}
@media (prefers-reduced-motion: reduce) {
    .floor__results-cue[b-5g5nagiqso] { animation: none; }
}

/* ── The live draw ceremony (doc 20 §5c) — mobile-first ─────────────────────── */
.floor__draw[b-5g5nagiqso] { text-align: center; padding-block: 1rem 2.5rem; }
.floor__draw-eyebrow[b-5g5nagiqso] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem; letter-spacing: 0.22em; text-transform: uppercase;
    color: var(--hx-gold, #e8c46c);
    margin: 0 0 0.5rem;
    animation: floor-pulse-b-5g5nagiqso 1.4s ease-in-out infinite;
}
.floor__draw-title[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(1.4rem, 5vw, 2.2rem); letter-spacing: 0.05em;
    color: var(--hx-text-2, #cbc3b0); margin: 0 0 0.15rem;
}
/* The announcer's headline — the just-called grower's name, slammed in. The star of each beat. */
.floor__announce-name[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(2.4rem, 11vw, 4.5rem); letter-spacing: 0.02em; line-height: 1;
    color: var(--hx-gold, #e8c46c); margin: 0 0 1rem;
    text-shadow: 0 0 26px rgba(232, 196, 108, 0.4);
    animation: floor-announce-b-5g5nagiqso 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.25);
}
.floor__draw-next[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.85rem; color: var(--hx-text-2, #cbc3b0); margin: 0 0 1.5rem; }
.floor__draw-next strong[b-5g5nagiqso] { color: var(--hx-gold, #e8c46c); }

/* The pre-show countdown clock. */
.floor__clock[b-5g5nagiqso] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(3.5rem, 16vw, 6.5rem); line-height: 1; letter-spacing: 0.04em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 1.5rem;
    text-shadow: 0 0 30px rgba(232, 196, 108, 0.35);
    font-variant-numeric: tabular-nums;
}

/* Pre-show sponsor slot — tasteful, restrained (sponsor the WAIT, never the show). A slim "brought to
   you by" card, muted so it doesn't compete with the ceremony; it disappears the instant the reveal starts. */
.floor__sponsor[b-5g5nagiqso] {
    position: relative;
    max-width: 440px; margin: 0 auto 1.75rem;
    padding: 1rem 1.1rem; display: flex; align-items: center; gap: 1rem;
    background: var(--hx-surface-1, #111);
    border: 1px solid var(--hx-border, #262626); border-radius: 12px;
    text-align: left;
}
.floor__sponsor-badge[b-5g5nagiqso] {
    position: absolute; top: -0.55rem; left: 1rem;
    font-family: 'Space Mono', monospace; font-size: 0.55rem; letter-spacing: 0.14em;
    color: var(--hx-text-muted, #9a927e);
    background: var(--hx-surface-2, #0c0c0c); border: 1px solid var(--hx-border, #333);
    border-radius: 999px; padding: 0.12rem 0.5rem;
}
.floor__sponsor-img[b-5g5nagiqso] {
    flex: 0 0 auto; width: 64px; height: 64px; border-radius: 8px;
    background: var(--hx-surface-2, #0c0c0c); border: 1px dashed var(--hx-border, #333);
    display: flex; align-items: center; justify-content: center;
}
.floor__sponsor-img span[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.55rem; letter-spacing: 0.08em; color: var(--hx-text-muted, #9a927e); }
.floor__sponsor-body[b-5g5nagiqso] { min-width: 0; text-align: left; }
.floor__sponsor-eyebrow[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--hx-text-muted, #9a927e); }
.floor__sponsor-name[b-5g5nagiqso] { font-family: 'Bebas Neue', sans-serif; font-size: 1.35rem; letter-spacing: 0.03em; color: var(--hx-text-2, #cbc3b0); line-height: 1.1; }
.floor__sponsor-desc[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.78rem; color: var(--hx-text-muted, #9a927e); margin-top: 0.15rem; }

/* The stage — every seat visible from the start (empty), filling one by one. 2-up on a phone. */
.floor__stage[b-5g5nagiqso] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem; max-width: 640px; margin: 0 auto 1.25rem;
}
.floor__seat[b-5g5nagiqso] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 0.2rem; padding: 0.85rem 0.6rem; min-height: 132px;
    border-radius: 12px; border: 1px solid var(--hx-border, #333);
    background: var(--hx-surface-2, #0c0c0c);
    transition: border-color 0.2s ease;
}
.floor__seat.is-empty[b-5g5nagiqso] { border-style: dashed; opacity: 0.5; }
.floor__seat.is-filled[b-5g5nagiqso] { border-color: var(--hx-gold, #e8c46c); background: var(--hx-surface-1, #111); }
/* The card that just landed fades + pops into its seat. */
.floor__seat.is-newest[b-5g5nagiqso] {
    animation: floor-seat-in-b-5g5nagiqso 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.2);
    box-shadow: 0 0 0 3px rgba(232, 196, 108, 0.18), 0 10px 30px rgba(0, 0, 0, 0.5);
}
.floor__seat-img[b-5g5nagiqso] { width: 68px; height: 68px; border-radius: 10px; overflow: hidden; background: var(--hx-surface-2, #1a1a1a); display: flex; align-items: center; justify-content: center; }
.floor__seat-img img[b-5g5nagiqso] { width: 100%; height: 100%; object-fit: cover; }
.floor__seat-glyph[b-5g5nagiqso] { font-size: 2rem; }
.floor__seat-name[b-5g5nagiqso] { font-family: 'Hanken Grotesk', sans-serif; font-weight: 700; font-size: 0.9rem; color: var(--hx-fg, #fff); text-align: center; line-height: 1.1; }
.floor__seat-grower[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-gold, #e8c46c); }
.floor__seat-ticket[b-5g5nagiqso] { font-size: 1.6rem; opacity: 0.6; }
.floor__seat-wait[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.62rem; letter-spacing: 0.06em; color: var(--hx-text-muted, #9a927e); text-transform: uppercase; }
.floor__draw-foot[b-5g5nagiqso] { font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--hx-text-muted, #9a927e); margin: 0; }

@keyframes floor-seat-in-b-5g5nagiqso { from { opacity: 0; transform: scale(0.85) translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes floor-announce-b-5g5nagiqso { from { opacity: 0; transform: scale(1.15); letter-spacing: 0.2em; } to { opacity: 1; transform: none; } }
@keyframes floor-pulse-b-5g5nagiqso { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }

@media (prefers-reduced-motion: reduce) {
    .floor__draw-eyebrow[b-5g5nagiqso], .floor__announce-name[b-5g5nagiqso], .floor__seat.is-newest[b-5g5nagiqso] { animation: none; }
}

/* Give each seat its own column on wider screens (up to 5-up, then wrap). */
@media (min-width: 560px) {
    .floor__stage[b-5g5nagiqso] { grid-template-columns: repeat(auto-fit, minmax(110px, 140px)); justify-content: center; }
}
/* /Components/Pages/Showcase/ShowcaseSubmit.razor.rz.scp.css */
.sub[b-zy81rmsbz9] { max-width: 720px; padding: 2.5rem 1rem 4rem; }
.sub__loading[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; color: var(--hx-text-muted, #9a927e); }

.sub__back[b-zy81rmsbz9] {
    display: inline-block; margin-bottom: 1.5rem;
    font-family: 'Space Mono', monospace; font-size: 0.8rem;
    color: var(--hx-text-3, #9a927e); text-decoration: none;
}
.sub__back:hover[b-zy81rmsbz9] { color: var(--hx-gold, #e8c46c); }

.sub__eyebrow[b-zy81rmsbz9] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.18em;
    color: var(--hx-gold, #e8c46c); margin: 0 0 0.4rem;
}
.sub__headline[b-zy81rmsbz9] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.02; color: var(--hx-text-heading, #f6efdd); margin: 0;
}
.sub__plant[b-zy81rmsbz9] { color: var(--hx-gold, #e8c46c); }
.sub__sub[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); margin: 0.75rem 0 0; line-height: 1.55; }

.sub__head[b-zy81rmsbz9] { margin-bottom: 1.75rem; }
.sub__score[b-zy81rmsbz9] { display: inline-flex; align-items: baseline; gap: 0.4rem; margin-top: 1rem; }
.sub__score-num[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-weight: 700; font-size: 1.9rem; color: var(--hx-green, #6cbf7a); }
.sub__score-label[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.05em; color: var(--hx-gold, #e8c46c); }

.sub__intro[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); margin: 0 0 1rem; }

.sub__showdowns[b-zy81rmsbz9] { display: flex; flex-direction: column; gap: 0.7rem; margin-bottom: 1.5rem; }
.sub__showdown[b-zy81rmsbz9] {
    display: flex; align-items: flex-start; gap: 0.8rem; width: 100%; text-align: left; cursor: pointer;
    padding: 1rem 1.1rem; background: var(--hx-surface-1, #14110c);
    border: 1px solid var(--hx-border, #2a2820); border-radius: 8px;
    transition: border-color 0.15s, background 0.15s;
}
.sub__showdown:hover[b-zy81rmsbz9] { border-color: rgba(108,191,122,0.5); }
.sub__showdown.is-selected[b-zy81rmsbz9] { border-color: var(--hx-green, #6cbf7a); background: rgba(108,191,122,0.08); }
.sub__showdown-check[b-zy81rmsbz9] { color: var(--hx-green, #6cbf7a); font-size: 1.1rem; line-height: 1.4; }
.sub__showdown-body[b-zy81rmsbz9] { display: flex; flex-direction: column; gap: 0.15rem; }
.sub__showdown-name[b-zy81rmsbz9] { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; letter-spacing: 0.03em; color: var(--hx-text-heading, #f6efdd); }
.sub__showdown-desc[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.86rem; color: var(--hx-text-muted, #9a927e); }

.sub__go[b-zy81rmsbz9] { margin-top: 0.5rem; }

.sub__confirm[b-zy81rmsbz9] {
    margin-top: 0.5rem; padding: 1.25rem; border-radius: 8px;
    background: rgba(232,196,108,0.06); border: 1px solid var(--hx-border-gold, rgba(232,196,108,0.4));
}
.sub__confirm-q[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); margin: 0 0 1rem; line-height: 1.5; }
.sub__actions[b-zy81rmsbz9] { display: flex; flex-wrap: wrap; gap: 0.7rem; }
.sub__error[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; color: #e0a05a; margin: 1rem 0 0; }

.sub__gate[b-zy81rmsbz9] {
    padding: 1.25rem; border-radius: 8px; margin-bottom: 1.5rem;
    background: var(--hx-surface-1, #14110c); border: 1px solid var(--hx-border, #2a2820);
}
.sub__gate p[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; color: var(--hx-text-2, #cbc3b0); margin: 0; line-height: 1.55; }

/* ── Shows this grow is already on the floor at (multi-show entry) ── */
.sub__entered[b-zy81rmsbz9] { margin: 1.5rem 0 0.5rem; padding: 1rem 1.1rem; border: 1px solid rgba(212, 175, 55, 0.35); border-radius: 8px; background: rgba(212, 175, 55, 0.06); }
.sub__entered-title[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.14em; color: var(--hx-gold, #d4af37); margin: 0 0 0.35rem; }
.sub__entered-sub[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.86rem; color: var(--hx-text-muted, #9a927e); margin: 0 0 0.6rem; }
.sub__entered-row[b-zy81rmsbz9] { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.55rem 0; border-top: 1px solid rgba(212, 175, 55, 0.18); text-decoration: none; }
.sub__entered-row:first-of-type[b-zy81rmsbz9] { border-top: none; }
.sub__entered-name[b-zy81rmsbz9] { font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: 0.03em; color: var(--hx-text-1, #f3eede); }
.sub__entered-go[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-size: 0.74rem; letter-spacing: 0.06em; color: var(--hx-gold, #d4af37); flex: 0 0 auto; }
/* Which grow holds this slot, when it isn't the one you're staging. Recessive — it's an explanation. */
.sub__entered-who[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-size: 0.66rem; letter-spacing: 0.04em; color: var(--hx-text-muted, #9a927e); flex: 1 1 auto; }
.sub__entered-row:hover .sub__entered-go[b-zy81rmsbz9] { text-decoration: underline; }

/* Judge set (doc 38): dressing your act, offered right after the marquee and beside every open entry. */
.sub__curate[b-zy81rmsbz9] { margin: 1.25rem 0; padding: 0.9rem 1rem; border: 1px solid rgba(212, 175, 55, 0.35); border-radius: 8px; background: rgba(212, 175, 55, 0.06); }
.sub__curate-q[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.88rem; line-height: 1.5; color: var(--hx-text-2, #cbc3b0); margin: 0 0 0.7rem; }
.sub__entered-curate[b-zy81rmsbz9] { display: inline-block; font-family: 'Space Mono', monospace; font-size: 0.7rem; letter-spacing: 0.05em; color: var(--hx-gold, #d4af37); text-decoration: none; padding: 0 0 0.55rem; }
.sub__entered-curate:hover[b-zy81rmsbz9] { text-decoration: underline; }

.sub__locked[b-zy81rmsbz9] { margin-top: 2.5rem; }
.sub__locked-title[b-zy81rmsbz9] { font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.14em; color: var(--hx-text-muted, #9a927e); margin: 0 0 0.75rem; }
.sub__locked-row[b-zy81rmsbz9] { display: flex; justify-content: space-between; gap: 1rem; padding: 0.6rem 0; border-bottom: 1px solid var(--hx-border, #2a2820); }
.sub__locked-name[b-zy81rmsbz9] { font-family: 'Bebas Neue', sans-serif; font-size: 1.05rem; letter-spacing: 0.03em; color: var(--hx-text-3, #b0a890); flex: 0 0 auto; }
.sub__locked-reason[b-zy81rmsbz9] { font-family: 'Hanken Grotesk', sans-serif; font-size: 0.84rem; color: var(--hx-text-muted, #9a927e); text-align: right; }

/* ── The "you're on the floor" ceremony — a theatre marquee lighting up (doc 14 emotional peak) ── */
.sub__done[b-zy81rmsbz9] { text-align: center; padding: 1.25rem 0 0.5rem; }
.sub__done .sub__actions[b-zy81rmsbz9] { justify-content: center; margin-top: 1.75rem; }
.sub__done .sub__sub[b-zy81rmsbz9] { max-width: 30rem; margin-left: auto; margin-right: auto; }

.sub__marquee[b-zy81rmsbz9] {
    position: relative; overflow: hidden;
    max-width: 30rem; margin: 0 auto;
    padding: 1.2rem 1.3rem 1.5rem; border-radius: 16px;
    background: radial-gradient(ellipse at 50% 0%, rgba(232,196,108,0.16), transparent 66%), var(--hx-surface-1, #14110c);
    border: 1px solid var(--hx-border-gold, rgba(232,196,108,0.45));
    /* Entrance pop, then the whole sign breathes — a pulsating gold border/glow. */
    animation: sub-marquee-in-b-zy81rmsbz9 0.45s ease both, sub-border-pulse-b-zy81rmsbz9 2.6s ease-in-out 0.45s infinite;
}

/* Bulb rails top & bottom — the chasing lights of a theatre sign. */
.sub__bulbs[b-zy81rmsbz9] { display: flex; justify-content: space-between; padding: 0 0.25rem; }
.sub__bulb[b-zy81rmsbz9] {
    width: 0.5rem; height: 0.5rem; border-radius: 50%;
    background: var(--hx-gold, #e8c46c); box-shadow: 0 0 9px rgba(232,196,108,0.85);
    animation: sub-bulb-b-zy81rmsbz9 1s ease-in-out infinite;
    animation-delay: calc(var(--i) * 0.08s);
}

.sub__stage[b-zy81rmsbz9] { position: relative; padding: 1rem 0 0.3rem; }
/* A slow spotlight sweep behind the name. */
.sub__spotlight[b-zy81rmsbz9] {
    position: absolute; top: -1.2rem; left: 50%; width: 150%; height: 150%;
    transform: translateX(-50%); pointer-events: none; z-index: 0;
    background: conic-gradient(from 180deg at 50% 0%, transparent 43%, rgba(232,196,108,0.12) 50%, transparent 57%);
    animation: sub-sweep-b-zy81rmsbz9 6.5s ease-in-out infinite;
}
.sub__stage > *:not(.sub__spotlight)[b-zy81rmsbz9] { position: relative; z-index: 1; }

.sub__ticket[b-zy81rmsbz9] {
    font-size: 3rem; margin-bottom: 0.3rem;
    filter: drop-shadow(0 0 16px rgba(232,196,108,0.6));
    animation: sub-pop-b-zy81rmsbz9 0.5s cubic-bezier(0.2, 0.8, 0.3, 1.4) both;
}
.sub__eyebrow--lit[b-zy81rmsbz9] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; letter-spacing: 0.18em;
    color: var(--hx-gold, #e8c46c); text-shadow: 0 0 14px rgba(232,196,108,0.65);
    margin: 0 0 0.35rem; animation: sub-flash-b-zy81rmsbz9 1.7s ease-in-out infinite;
}
.sub__marquee-name[b-zy81rmsbz9] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.3rem, 8vw, 3.4rem); line-height: 1;
    margin: 0.15rem 0 0; color: var(--hx-text-heading, #f6efdd);
    text-shadow: 0 0 28px rgba(246,239,221,0.4);
}
.sub__marquee-at[b-zy81rmsbz9] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.9rem;
    color: var(--hx-text-2, #cbc3b0); margin: 0.35rem 0;
}
.sub__won--lit[b-zy81rmsbz9] {
    font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.9rem, 6vw, 2.7rem); line-height: 1;
    margin: 0; color: var(--hx-gold, #e8c46c); text-shadow: 0 0 32px rgba(232,196,108,0.6);
}

@keyframes sub-marquee-in-b-zy81rmsbz9 { from { opacity: 0; transform: translateY(10px) scale(0.98); } }
/* The whole sign breathing — a pulsating gold border + glow (an alternative to / companion for the bulbs). */
@keyframes sub-border-pulse-b-zy81rmsbz9 {
    0%, 100% { border-color: rgba(232,196,108,0.35); box-shadow: 0 0 34px rgba(232,196,108,0.12), inset 0 0 45px rgba(232,196,108,0.04); }
    50%      { border-color: rgba(232,196,108,0.90); box-shadow: 0 0 72px rgba(232,196,108,0.38), inset 0 0 55px rgba(232,196,108,0.09); }
}
@keyframes sub-bulb-b-zy81rmsbz9 { 0%, 100% { opacity: 1; } 50% { opacity: 0.22; } }
@keyframes sub-sweep-b-zy81rmsbz9 { 0%, 100% { transform: translateX(-50%) rotate(-7deg); } 50% { transform: translateX(-50%) rotate(7deg); } }
@keyframes sub-pop-b-zy81rmsbz9 { from { opacity: 0; transform: scale(0.6); } }
@keyframes sub-flash-b-zy81rmsbz9 { 0%, 100% { opacity: 0.7; } 50% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
    .sub__marquee[b-zy81rmsbz9], .sub__ticket[b-zy81rmsbz9], .sub__eyebrow--lit[b-zy81rmsbz9], .sub__bulb[b-zy81rmsbz9] { animation: none; }
    .sub__spotlight[b-zy81rmsbz9] { display: none; }
}
/* /Components/Shared/AvatarPicker.razor.rz.scp.css */
.ap[b-op0i9pjbiz] {
    display: flex;
    gap: 1.4rem;
    align-items: flex-start;
    flex-wrap: wrap;
}
.ap__preview[b-op0i9pjbiz] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
}
.ap__preview-cap[b-op0i9pjbiz] {
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--hx-muted);
}
.ap__fields[b-op0i9pjbiz] {
    flex: 1 1 260px;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    min-width: 0;
}
.ap__pick[b-op0i9pjbiz] { }
.ap__label[b-op0i9pjbiz] {
    display: block;
    font-family: 'Space Mono', monospace;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hx-muted);
    margin-bottom: 0.6rem;
}

.ap__swatches[b-op0i9pjbiz] { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.ap__swatch[b-op0i9pjbiz] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 2px solid transparent;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
    cursor: pointer;
    padding: 0;
    transition: transform 0.1s ease, border-color 0.12s ease;
}
.ap__swatch:hover[b-op0i9pjbiz] { transform: scale(1.08); }
.ap__swatch.is-selected[b-op0i9pjbiz] { border-color: #fff; }

.ap__glyphs[b-op0i9pjbiz] { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.ap__glyph[b-op0i9pjbiz] {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid var(--hx-border, #222);
    background: var(--hx-surface-2, #0c0c0c);
    color: var(--hx-fg, #fff);
    cursor: pointer;
    padding: 0;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.ap__glyph:hover[b-op0i9pjbiz] { border-color: rgba(232, 196, 108, 0.5); }
.ap__glyph.is-selected[b-op0i9pjbiz] {
    border-color: var(--hx-gold, #e8c46c);
    background: rgba(232, 196, 108, 0.1);
}
.ap__glyph svg[b-op0i9pjbiz] { width: 60%; height: 60%; }
.ap__glyph--initial[b-op0i9pjbiz] {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    line-height: 1;
}
/* /Components/Shared/GrowerAvatar.razor.rz.scp.css */
.ga[b-c1sdof8l4j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    overflow: hidden;
    line-height: 1;
    color: #fff;   /* glyph + initial ink; disc background is the identity color */
}

.ga__img[b-c1sdof8l4j] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ga__glyph[b-c1sdof8l4j] {
    width: 58%;
    height: 58%;
    display: block;
}

.ga__initial[b-c1sdof8l4j] {
    font-family: 'Bebas Neue', sans-serif;
    letter-spacing: 0.01em;
    color: #fff;
    /* subtle lift so the letter reads on lighter palette hues */
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
/* /Components/Shared/RoleLegend.razor.rz.scp.css */
.rl[b-sixpb8v0we] { margin: 0.15rem 0; }
.rl summary[b-sixpb8v0we] {
    font-family: 'Space Mono', monospace; font-size: 0.72rem; color: #e8c46c;
    cursor: pointer; list-style: none; width: fit-content;
}
.rl summary[b-sixpb8v0we]::before { content: "▸ "; }
.rl[open] summary[b-sixpb8v0we]::before { content: "▾ "; }
.rl summary:hover[b-sixpb8v0we] { color: #f1d488; }
.rl__list[b-sixpb8v0we] {
    list-style: none; margin: 0.5rem 0 0; padding: 0.7rem 0.9rem;
    border: 1px solid rgba(255,255,255,.08); border-radius: 8px; background: rgba(255,255,255,.02);
    display: flex; flex-direction: column; gap: 0.4rem;
}
.rl__list li[b-sixpb8v0we] {
    font-family: 'Hanken Grotesk', sans-serif; font-size: 0.82rem; color: #b0a890; line-height: 1.35;
}
.rl__list b[b-sixpb8v0we] { color: #f6efdd; font-family: 'Space Mono', monospace; font-size: 0.76rem; }
.rl__list em[b-sixpb8v0we] { color: #8a8270; font-style: italic; }
/* /Components/Shared/TimingStrip.razor.rz.scp.css */
/* ── Timing strip — ts__ namespace (planning doc 30) ──────────
   One row per run, one dot per plant. Built from app.css tokens; no new palette. */

.ts[b-bg6jse6a64] {
    margin-bottom: 2.25rem;
    padding: 1.35rem 1.4rem 1.15rem;
    background: var(--hx-surface-1, #0f0d0a);
    border: 1px solid var(--hx-border, rgba(255,255,255,.06));
    border-radius: var(--hx-r, 12px);
}

/* ── Tints ────────────────────────────────────────────────
   Same gradient + border recipe the app's tinted cards already use (Dashboard's premium card, the Cure
   surface), so these read as the established treatment rather than a new one — only the hue differs.
   ⚠ Both hues are reserved elsewhere (purple = premium/cure · blue = privacy) and are used here purely to
   separate two adjacent strips. Deliberate; see TimingStrip.Tint. */
.ts--purple[b-bg6jse6a64] {
    background: linear-gradient(135deg, rgba(146,110,196,.12), rgba(146,110,196,.02));
    border-color: rgba(146,110,196,.4);
}
.ts--blue[b-bg6jse6a64] {
    background: linear-gradient(135deg, rgba(111,168,189,.12), rgba(111,168,189,.02));
    border-color: rgba(111,168,189,.4);
}

/* The sticky label mask has to match the card it sits on, or a tinted strip shows a dark rectangle
   sliding under the run names when it scrolls. */
.ts--purple .ts__row-label[b-bg6jse6a64] { background: #16121c; }
.ts--blue   .ts__row-label[b-bg6jse6a64] { background: #101619; }

.ts__head[b-bg6jse6a64] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.9rem;
    margin-bottom: 1.35rem;
}

/* Gold section header — the app-wide treatment for a panel title. */
.ts__title[b-bg6jse6a64] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    color: var(--hx-gold, #e8c46c);
    margin: 0;
}

/* Slightly under the cap height so the glyph sits WITH the condensed caps rather than towering over them —
   emoji render larger than their font-size against a display face. */
.ts__glyph[b-bg6jse6a64] {
    font-size: 0.95rem;
    line-height: 1;
}

.ts__meta[b-bg6jse6a64] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    color: var(--hx-text-faint, #6f6857);
}

.ts__empty[b-bg6jse6a64],
.ts__legend[b-bg6jse6a64] {
    font-size: 0.82rem;
    color: var(--hx-text-faint, #6f6857);
    margin: 0;
}
.ts__legend[b-bg6jse6a64] { margin-top: 1rem; }

/* Wide content scrolls INSIDE its own box; the page body never scrolls sideways. */
.ts__scroll[b-bg6jse6a64] {
    overflow-x: auto;
    /* Room for the dot's focus ring and the last tick label, which both sit outside the track. */
    padding-bottom: 0.35rem;
}

.ts__plot[b-bg6jse6a64] { min-width: 420px; }

/* Grid, not flex: the run label, the track and the range read as three aligned columns, and the axis row
   inherits the same columns so a tick label lands under the position it names rather than near it. */
.ts__row[b-bg6jse6a64] {
    display: grid;
    grid-template-columns: 5.5rem 1fr 5.5rem;
    align-items: center;
    gap: 0.75rem;
    min-height: 2rem;
}

/* Pinned to the left edge while the strip scrolls sideways, so a run's identity never leaves the screen —
   without it you scroll right to read a late day and lose which row you're on, which is the one thing the
   labels exist to tell you. Sticky resolves against .ts__scroll, the nearest scrolling ancestor.
     · stretch + flex so the wrapper fills the row HEIGHT and masks dots passing beneath it
     · an opaque surface background, or the dots would show through
     · the hairline reads as an edge, so a dot sliding under looks like it passes behind rather than
       colliding with the text */
.ts__row-label[b-bg6jse6a64] {
    position: sticky;
    left: 0;
    z-index: 2;
    align-self: stretch;
    display: flex;
    align-items: center;
    min-width: 0;                 /* lets the inner text actually ellipsis inside a grid/flex item */
    padding-right: 0.45rem;
    background: var(--hx-surface-1, #0f0d0a);
    box-shadow: 1px 0 0 var(--hx-border, rgba(255,255,255,.06));
    text-decoration: none;
}

.ts__row-label-text[b-bg6jse6a64] {
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--hx-text-caption, #9a927e);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.15s;
}
.ts__row-label:hover .ts__row-label-text[b-bg6jse6a64] { color: var(--hx-gold, #e8c46c); }

.ts__row-range[b-bg6jse6a64] {
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    color: var(--hx-text-faint, #6f6857);
    text-align: right;
    white-space: nowrap;
}

.ts__track[b-bg6jse6a64] {
    position: relative;
    height: 2rem;
}

.ts__rule[b-bg6jse6a64] {
    position: absolute;
    left: 0; right: 0; top: 50%;
    height: 1px;
    background: var(--hx-border, rgba(255,255,255,.06));
    pointer-events: none;
}

/* The dot is 10px of ink inside a 30px tap target — a mark small enough to show a cluster honestly, with a
   target big enough to hit on a phone. The ring is the surface colour, so overlapping dots stay countable
   instead of merging into one blob. */
.ts__dot[b-bg6jse6a64] {
    position: absolute;
    top: 50%;
    width: 30px;
    height: 30px;
    margin: -15px 0 0 -15px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.ts__dot[b-bg6jse6a64]::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hx-gold, #e8c46c);
    box-shadow: 0 0 0 2px var(--hx-surface-1, #0f0d0a);
    transition: transform 0.12s;
}
/* The separating ring is the CARD's colour, not a fixed one — on a tinted strip the default dark ring
   would draw a visible halo around every dot. */
.ts--purple .ts__dot[b-bg6jse6a64]::before { box-shadow: 0 0 0 2px #16121c; }
.ts--blue   .ts__dot[b-bg6jse6a64]::before { box-shadow: 0 0 0 2px #101619; }
.ts__dot:hover[b-bg6jse6a64]::before,
.ts__dot:focus-visible[b-bg6jse6a64]::before { transform: scale(1.45); }

/* Several grows on one day. The mark carries the COUNT rather than being merely bigger: size alone is
   guessed at (is that three or four?), a numeral is read. It also keeps the position honest — the mark
   still sits exactly on its day, so the axis reading doesn't shift to make room for the label. */
.ts__dot--multi[b-bg6jse6a64]::before {
    width: 18px;
    height: 18px;
}
.ts__dot--multi:hover[b-bg6jse6a64]::before,
.ts__dot--multi:focus-visible[b-bg6jse6a64]::before { transform: scale(1.2); }

.ts__dot-count[b-bg6jse6a64] {
    position: absolute;
    font-family: 'Space Mono', monospace;
    font-size: 0.6rem;
    line-height: 1;
    font-weight: 700;
    color: var(--hx-gold-on, #1a1407);   /* ink ON a gold fill */
    pointer-events: none;
}

/* Identity for a screen reader; the visual carries it as position + title. */
.ts__dot-sr[b-bg6jse6a64] {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.ts__row--axis[b-bg6jse6a64] { min-height: 1.4rem; margin-top: 0.35rem; }

.ts__ticks[b-bg6jse6a64] {
    position: relative;
    height: 1rem;
}

.ts__tick[b-bg6jse6a64] {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    font-family: 'Space Mono', monospace;
    font-size: 0.64rem;
    color: var(--hx-text-faint, #6f6857);
    white-space: nowrap;
}

@media (max-width: 560px) {
    .ts[b-bg6jse6a64] { padding: 1.1rem 1rem 1rem; }
    /* The range column is the first thing to go — the dots and the axis still carry the story, and each
       dot keeps its own value on tap. */
    .ts__row[b-bg6jse6a64] { grid-template-columns: 4.25rem 1fr; }
    .ts__row-range[b-bg6jse6a64] { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ts__dot[b-bg6jse6a64]::before { transition: none; }
    .ts__dot:hover[b-bg6jse6a64]::before,
    .ts__dot:focus-visible[b-bg6jse6a64]::before,
    .ts__dot--multi:hover[b-bg6jse6a64]::before,
    .ts__dot--multi:focus-visible[b-bg6jse6a64]::before { transform: none; }
}