/* Business Ideas Library — public pages on the studio "build" tokens.
   Grammar follows community.css: .bil-* blocks, raw theme tokens
   (--surface/--ink/--accent/...), color-mix for tints, .lw-btn reused for
   buttons. No Memphis. */

/* ---------------------------------------------------------------- hero -- */
.bil-hero { padding: 3.5rem 0 2rem; }
.bil-hero__kicker {
    display: inline-flex; align-items: center; gap: .5rem;
    font-size: .8rem; font-weight: 600; letter-spacing: .08em;
    text-transform: uppercase; color: var(--accent);
}
.bil-hero__title {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4.5vw, 3.1rem);
    line-height: 1.1; color: var(--ink); margin: .5rem 0 1rem;
}
.bil-hero__lede { color: var(--muted); max-width: 46rem; font-size: 1.08rem; }

.bil-stats { display: flex; flex-wrap: wrap; gap: 2.2rem; margin-top: 1.6rem; }
.bil-stats__item { display: flex; flex-direction: column; }
.bil-stats__num {
    font-family: var(--font-display); font-size: 1.6rem;
    font-weight: 700; color: var(--ink);
}
.bil-stats__label { font-size: .82rem; color: var(--muted); }

/* ------------------------------------------------------------- filters -- */
.bil-filters {
    display: flex; flex-wrap: wrap; align-items: center; gap: .6rem;
    padding: .9rem 0; border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line); margin-bottom: 1.6rem;
}
.bil-filters__search {
    flex: 1 1 14rem; max-width: 22rem;
    padding: .5rem .9rem; font-size: .92rem;
    background: var(--surface); color: var(--ink);
    border: 1px solid var(--line); border-radius: var(--radius-pill);
}
.bil-filters__search:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent) 60%, var(--line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.bil-filters__select {
    padding: .5rem 2rem .5rem .9rem; font-size: .92rem;
    background: var(--surface); color: var(--ink);
    border: 1px solid var(--line); border-radius: var(--radius-pill);
}
.bil-filters__spacer { flex: 1 1 auto; }

.bil-chip {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .4rem .85rem; font-size: .85rem; font-weight: 600;
    color: color-mix(in srgb, var(--ink) 82%, var(--accent));
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
    border-radius: var(--radius-pill); text-decoration: none;
    transition: background .15s ease, border-color .15s ease;
}
.bil-chip:hover { background: color-mix(in srgb, var(--accent) 18%, transparent); }
.bil-chip.is-active {
    background: var(--accent); color: #fff; border-color: var(--accent);
}
.bil-chip--rising { --tag: var(--signal); }
.bil-chip--declining { --tag: var(--danger); }

/* --------------------------------------------------------- browse strips -- */
.bil-strip { margin: 1.2rem 0 1.6rem; }
.bil-strip__label {
    font-size: .78rem; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--muted); margin-bottom: .55rem;
}
.bil-strip__row { display: flex; flex-wrap: wrap; gap: .45rem; }
.bil-strip__row .bil-chip { font-size: .8rem; padding: .3rem .7rem; }

/* ----------------------------------------------------------------- grid -- */
.bil-grid {
    display: grid; gap: 1.1rem;
    grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
    margin-bottom: 2rem;
}

/* ----------------------------------------------------------------- card -- */
.bil-card {
    display: flex; flex-direction: column; gap: .65rem;
    padding: 1.25rem 1.25rem 1.1rem;
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius); box-shadow: var(--shadow-sm);
    text-decoration: none; position: relative;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.bil-card:hover {
    transform: translateY(-3px); box-shadow: var(--shadow);
    border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
}
.bil-card__top { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.bil-card__category {
    font-size: .72rem; font-weight: 700; letter-spacing: .05em;
    text-transform: uppercase; color: var(--accent);
}
.bil-card__title {
    font-family: var(--font-display); font-size: 1.12rem; line-height: 1.3;
    color: var(--ink); margin: 0;
}
.bil-card__excerpt { font-size: .9rem; color: var(--muted); line-height: 1.5; }
.bil-card__meta {
    display: flex; align-items: center; gap: .9rem; margin-top: auto;
    padding-top: .6rem; border-top: 1px solid var(--line);
    font-size: .78rem; color: var(--muted);
}
.bil-card__lock {
    position: absolute; top: .9rem; right: .9rem;
    display: inline-flex; align-items: center; gap: .3rem;
    font-size: .72rem; font-weight: 600; color: var(--muted);
    background: var(--surface-2); border: 1px solid var(--line);
    border-radius: var(--radius-pill); padding: .18rem .55rem;
}

.bil-score {
    display: inline-flex; align-items: baseline; gap: .15rem;
    font-family: var(--font-display); font-weight: 700; color: var(--ink);
}
.bil-score__of { font-size: .7em; color: var(--muted); font-weight: 500; }
.bil-score--good { color: #15803d; }
.bil-score--mid { color: #a16207; }

.bil-trend { display: inline-flex; align-items: center; gap: .3rem; font-weight: 600; }
.bil-trend--rising { color: #15803d; }
.bil-trend--declining { color: var(--danger); }
.bil-trend--stable { color: var(--muted); }

/* ----------------------------------------------------------------- gate -- */
.bil-gate { position: relative; margin: 0 0 2.5rem; }
.bil-gate__ghosts {
    display: grid; gap: 1.1rem;
    grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
    filter: blur(3px); opacity: .55; pointer-events: none; user-select: none;
    mask-image: linear-gradient(to bottom, black 0%, transparent 92%);
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 92%);
}
.bil-ghost {
    height: 11.5rem; border-radius: var(--radius);
    border: 1px solid var(--line);
    background: linear-gradient(
        135deg,
        var(--surface) 0%,
        color-mix(in srgb, var(--accent) 7%, var(--surface)) 100%
    );
}
.bil-gate__cta {
    position: absolute; inset: 0; display: flex;
    align-items: center; justify-content: center; padding: 1rem;
}

.bil-upgrade {
    max-width: 34rem; width: 100%; text-align: center;
    padding: 2rem 2.2rem;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line));
    border-radius: var(--radius); box-shadow: var(--shadow);
}
.bil-upgrade__icon {
    width: 3rem; height: 3rem; margin: 0 auto .9rem;
    display: flex; align-items: center; justify-content: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    color: var(--accent);
}
.bil-upgrade__title {
    font-family: var(--font-display); font-size: 1.3rem;
    color: var(--ink); margin-bottom: .5rem;
}
.bil-upgrade__copy { font-size: .95rem; color: var(--muted); margin-bottom: 1.2rem; }
.bil-upgrade__actions {
    display: flex; gap: .7rem; justify-content: center; flex-wrap: wrap;
}
.bil-upgrade__hint { margin-top: .9rem; font-size: .8rem; color: var(--muted); }

/* ----------------------------------------------------------- pagination -- */
.bil-pagination {
    display: flex; align-items: center; justify-content: center;
    gap: .4rem; margin: 1rem 0 2.5rem; flex-wrap: wrap;
}
.bil-pagination__link {
    min-width: 2.3rem; padding: .45rem .7rem; text-align: center;
    font-size: .9rem; font-weight: 600; color: var(--ink);
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius-sm); text-decoration: none;
}
.bil-pagination__link:hover {
    border-color: color-mix(in srgb, var(--accent) 50%, var(--line));
}
.bil-pagination__link.is-current {
    background: var(--accent); border-color: var(--accent); color: #fff;
}
.bil-pagination__gap { color: var(--muted); padding: 0 .2rem; }

/* --------------------------------------------------------------- detail -- */
.bil-breadcrumb {
    display: flex; align-items: center; gap: .45rem; flex-wrap: wrap;
    font-size: .82rem; color: var(--muted); padding: 1.4rem 0 0;
}
.bil-breadcrumb a { color: var(--muted); text-decoration: none; }
.bil-breadcrumb a:hover { color: var(--accent); }

.bil-detail-head { padding: 1.2rem 0 1.8rem; }
.bil-detail-head__chips {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
    margin-bottom: .9rem;
}
.bil-detail-head__title {
    font-family: var(--font-display);
    font-size: clamp(1.7rem, 3.6vw, 2.6rem); line-height: 1.15;
    color: var(--ink); margin-bottom: 1rem;
}
.bil-detail-head__desc {
    color: var(--muted); font-size: 1.05rem; line-height: 1.65; max-width: 46rem;
}

.bil-layout {
    display: grid; gap: 1.4rem; align-items: start;
    grid-template-columns: minmax(0, 1fr);
    padding-bottom: 3rem;
}
@media (min-width: 1024px) {
    .bil-layout { grid-template-columns: minmax(0, 1fr) 20rem; }
    .bil-sidebar { position: sticky; top: 5.5rem; }
}

.bil-panel {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius); box-shadow: var(--shadow-sm);
    padding: 1.5rem; margin-bottom: 1.4rem;
}
.bil-panel__title {
    font-family: var(--font-display); font-size: 1.15rem;
    color: var(--ink); margin-bottom: 1rem;
}
.bil-panel__note { font-size: .8rem; color: var(--muted); margin-top: .9rem; }

/* verdict card (sidebar) */
.bil-verdict { text-align: center; }
.bil-verdict__score {
    font-family: var(--font-display); font-size: 3.2rem; font-weight: 700;
    line-height: 1; color: var(--ink);
}
.bil-verdict__of { font-size: 1rem; color: var(--muted); }
.bil-verdict__rows { margin-top: 1.1rem; text-align: left; }
.bil-verdict__row {
    display: flex; justify-content: space-between; gap: .8rem;
    padding: .5rem 0; border-top: 1px solid var(--line);
    font-size: .88rem;
}
.bil-verdict__row dt { color: var(--muted); }
.bil-verdict__row dd { color: var(--ink); font-weight: 600; text-align: right; }

/* score bars */
.bil-bars { display: flex; flex-direction: column; gap: .85rem; }
.bil-bar__head {
    display: flex; justify-content: space-between;
    font-size: .88rem; margin-bottom: .3rem;
}
.bil-bar__label { font-weight: 600; color: var(--ink); }
.bil-bar__value { color: var(--muted); font-weight: 600; }
.bil-bar__track {
    height: .55rem; border-radius: 999px;
    background: color-mix(in srgb, var(--ink) 7%, var(--surface));
    overflow: hidden;
}
.bil-bar__fill {
    height: 100%; border-radius: 999px;
    background: linear-gradient(90deg, var(--accent), var(--accent-2, var(--accent)));
}

/* analysis cards */
.bil-analysis { display: flex; flex-direction: column; gap: 1.1rem; }
.bil-analysis__dim {
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    padding: 1rem 1.1rem;
}
.bil-analysis__head {
    display: flex; align-items: center; gap: .6rem; margin-bottom: .45rem;
}
.bil-analysis__name { font-weight: 700; color: var(--ink); }
.bil-analysis__score {
    font-size: .78rem; font-weight: 700; color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border-radius: var(--radius-pill); padding: .15rem .6rem;
}
.bil-analysis__reasoning { font-size: .92rem; color: var(--muted); line-height: 1.6; }
.bil-analysis__citations { margin-top: .6rem; display: flex; flex-direction: column; gap: .3rem; }
.bil-analysis__citation {
    font-family: var(--font-mono, ui-monospace, monospace); font-size: .76rem;
    color: var(--muted);
    background: var(--surface-2); border-radius: var(--radius-sm);
    padding: .35rem .6rem;
}

/* evidence tables */
.bil-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.bil-table th {
    text-align: left; font-size: .75rem; font-weight: 700;
    letter-spacing: .05em; text-transform: uppercase; color: var(--muted);
    padding: .45rem .6rem; border-bottom: 1px solid var(--line);
}
.bil-table td {
    padding: .5rem .6rem; color: var(--ink);
    border-bottom: 1px solid color-mix(in srgb, var(--ink) 6%, transparent);
}
.bil-table td.is-num {
    text-align: right; font-variant-numeric: tabular-nums; color: var(--muted);
}
.bil-table-scroll { overflow-x: auto; }

/* competitors */
.bil-competitor { padding: .9rem 0; border-bottom: 1px solid var(--line); }
.bil-competitor:last-child { border-bottom: 0; padding-bottom: 0; }
.bil-competitor__head {
    display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
    margin-bottom: .3rem;
}
.bil-competitor__name { font-weight: 700; color: var(--ink); }
.bil-competitor__domain { font-size: .82rem; color: var(--accent); text-decoration: none; }
.bil-competitor__domain:hover { text-decoration: underline; }
.bil-competitor__stat {
    font-size: .75rem; font-weight: 600; color: var(--muted);
    background: var(--surface-2); border-radius: var(--radius-pill);
    padding: .15rem .55rem;
}
.bil-competitor__desc { font-size: .9rem; color: var(--muted); }

/* trends */
.bil-spark { width: 100%; height: auto; display: block; margin-top: .5rem; }
.bil-spark polyline {
    fill: none; stroke: var(--accent); stroke-width: 2.5;
    stroke-linecap: round; stroke-linejoin: round;
}

/* tech stack */
.bil-stack__summary { font-size: .95rem; color: var(--muted); line-height: 1.6; margin-bottom: .9rem; }
.bil-stack__row { display: flex; flex-wrap: wrap; gap: .45rem; }

/* free-preview banner on detail */
.bil-preview-note {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; flex-wrap: wrap;
    padding: .9rem 1.2rem; margin: 1.2rem 0;
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--accent) 9%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
    font-size: .9rem; color: var(--ink);
}

/* related */
.bil-related { padding: 1rem 0 3rem; }
.bil-related__title {
    font-family: var(--font-display); font-size: 1.3rem;
    color: var(--ink); margin-bottom: 1rem;
}

/* paywall page */
.bil-paywall { max-width: 44rem; margin: 0 auto; padding: 3rem 0 4rem; text-align: center; }
.bil-paywall__category {
    font-size: .78rem; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--accent);
}
.bil-paywall__title {
    font-family: var(--font-display); font-size: clamp(1.6rem, 3.4vw, 2.3rem);
    color: var(--ink); margin: .6rem 0 .8rem;
}
.bil-paywall__excerpt { color: var(--muted); margin-bottom: 1.6rem; }

/* ------------------------------------------------- member validator (P6) -- */
.bil-val-intro { padding: 3rem 0 1.4rem; max-width: 46rem; }

.bil-val-note {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: 1rem; margin: 1.2rem 0; padding: .85rem 1.1rem;
    border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
    border-radius: .7rem; background: var(--surface);
    color: var(--muted); font-size: .92rem;
}
.bil-val-note--warn {
    border-color: color-mix(in srgb, #d97706 45%, transparent);
    background: color-mix(in srgb, #d97706 8%, var(--surface));
    color: var(--ink);
}
.bil-val-note--private {
    border-color: color-mix(in srgb, var(--accent) 40%, transparent);
    background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

/* submission form */
.bil-val-form { margin-bottom: 4rem; }
.bil-val-field { margin-bottom: 1.3rem; }
.bil-val-label {
    display: block; margin-bottom: .45rem;
    font-size: .9rem; font-weight: 600; color: var(--ink);
}
.bil-val-input {
    width: 100%; padding: .7rem .9rem;
    border: 1px solid color-mix(in srgb, var(--ink) 18%, transparent);
    border-radius: .6rem; background: var(--surface);
    color: var(--ink); font-size: .96rem; font-family: inherit;
}
.bil-val-input:focus {
    outline: none; border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.bil-val-input--area { resize: vertical; min-height: 8rem; line-height: 1.55; }
.bil-val-error { margin-top: .35rem; font-size: .85rem; color: #dc2626; }
.bil-val-form__actions {
    display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.6rem;
}
.bil-val-form__hint { font-size: .82rem; color: var(--muted); }

/* live run */
.bil-val-run { max-width: 44rem; margin: 0 auto; padding: 2rem 0 4rem; }
.bil-val-head { margin-bottom: 2rem; }
.bil-val-head__title {
    font-family: var(--font-display); font-size: clamp(1.5rem, 3.2vw, 2.1rem);
    line-height: 1.2; color: var(--ink); margin: .5rem 0 .7rem;
}
.bil-val-head__msg { color: var(--muted); }

.bil-val-steps { list-style: none; margin: 0; padding: 0; }
.bil-val-step {
    display: flex; align-items: flex-start; gap: .9rem;
    padding: .85rem 0 .85rem .15rem;
    border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.bil-val-step:last-child { border-bottom: 0; }

/* marker: a dot that fills on done, pulses while running */
.bil-val-step__marker {
    flex: 0 0 auto; width: 1.05rem; height: 1.05rem; margin-top: .18rem;
    border-radius: 50%;
    border: 2px solid color-mix(in srgb, var(--ink) 22%, transparent);
    background: transparent; position: relative;
}
.bil-val-step.is-done .bil-val-step__marker {
    border-color: var(--accent); background: var(--accent);
}
.bil-val-step.is-done .bil-val-step__marker::after {
    content: ''; position: absolute; left: .27rem; top: .1rem;
    width: .22rem; height: .45rem;
    border: solid var(--surface); border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.bil-val-step.is-active .bil-val-step__marker {
    border-color: var(--accent);
    animation: bil-val-pulse 1.4s ease-in-out infinite;
}
.bil-val-step.is-failed .bil-val-step__marker { border-color: #dc2626; background: #dc2626; }
.bil-val-step.is-held .bil-val-step__marker { border-color: #d97706; background: #d97706; }

@keyframes bil-val-pulse {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 40%, transparent); }
    50% { box-shadow: 0 0 0 .35rem color-mix(in srgb, var(--accent) 0%, transparent); }
}
@media (prefers-reduced-motion: reduce) {
    .bil-val-step.is-active .bil-val-step__marker { animation: none; }
}

.bil-val-step__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: .15rem; }
.bil-val-step__label { font-weight: 600; color: var(--ink); font-size: .95rem; }
.bil-val-step__hint { font-size: .84rem; color: var(--muted); }
.bil-val-step__state {
    flex: 0 0 auto; font-size: .78rem; font-weight: 600;
    letter-spacing: .04em; text-transform: uppercase; color: var(--muted);
}
.bil-val-step.is-done .bil-val-step__state { color: var(--accent); }
.bil-val-step.is-failed .bil-val-step__state { color: #dc2626; }
.bil-val-step.is-held .bil-val-step__state { color: #d97706; }
.bil-val-step.is-pending .bil-val-step__label,
.bil-val-step.is-pending .bil-val-step__hint { opacity: .55; }

.bil-val-outcome {
    display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem;
}

/* hub → validator entry point */
.bil-val-cta {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: 1rem; margin-top: 1.8rem; padding: .9rem 1.1rem;
    border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
    border-radius: .7rem;
    background: color-mix(in srgb, var(--accent) 6%, var(--surface));
}
.bil-val-cta__copy { color: var(--muted); font-size: .93rem; }
.bil-val-cta__copy strong { color: var(--ink); }

/* coming-soon (validator ships dark until the engine is proven in prod) */
.bil-val-cta__soon {
    flex: 0 0 auto; padding: .3rem .7rem; border-radius: 999px;
    border: 1px dashed color-mix(in srgb, var(--ink) 28%, transparent);
    font-size: .74rem; font-weight: 700; letter-spacing: .07em;
    text-transform: uppercase; color: var(--muted); white-space: nowrap;
}
.bil-soon { max-width: 44rem; margin: 0 auto; padding: 3.5rem 0 4.5rem; text-align: center; }
.bil-soon__badge {
    display: inline-block; padding: .3rem .8rem; border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
    color: var(--accent);
    font-size: .74rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
}
.bil-soon__title {
    font-family: var(--font-display); font-size: clamp(1.7rem, 3.6vw, 2.4rem);
    color: var(--ink); margin: 1rem 0 .9rem; line-height: 1.15;
}
.bil-soon__lede { color: var(--muted); font-size: 1.02rem; margin-bottom: 1rem; }
.bil-soon__note {
    color: var(--muted); font-size: .92rem; margin: 0 auto 1.8rem; max-width: 38rem;
    padding-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
}
.bil-soon__actions { display: flex; justify-content: center; gap: .8rem; flex-wrap: wrap; }

/* form-page preview of the run (rendered from progress.STEPS) */
.bil-val-preview { list-style: none; margin: 0; padding: 0; counter-reset: none; }
.bil-val-preview__item {
    display: flex; align-items: flex-start; gap: .7rem; padding: .55rem 0;
    border-bottom: 1px solid color-mix(in srgb, var(--ink) 7%, transparent);
}
.bil-val-preview__item:last-child { border-bottom: 0; }
.bil-val-preview__num {
    flex: 0 0 auto; width: 1.4rem; height: 1.4rem; margin-top: .1rem;
    display: grid; place-items: center; border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    color: var(--accent); font-size: .72rem; font-weight: 700;
}
.bil-val-preview__label {
    display: block; font-size: .88rem; font-weight: 600; color: var(--ink);
}
.bil-val-preview__hint {
    display: block; font-size: .78rem; color: var(--muted); line-height: 1.4;
}
