/* ventures + experiments screens — layout only; color, radius, shadow and type come from app.css tokens */

/* ---------- venture card (L1) ---------- */
a.card.v-card { gap: 0; align-content: start; }
.v-card-img { aspect-ratio: 16 / 9; }
.v-card-body { padding: 14px 16px 16px; gap: 8px; }
.v-card-name { margin: 0; }
.v-evidence { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }

/* ---------- stopped / archive ---------- */
.v-archive { display: grid; gap: 8px; }
.v-archive-sub { max-width: 560px; }

/* ---------- venture detail hero (L4 allowed) ---------- */
.v-hero { margin: -4px calc(var(--pad) * -1) 0; min-height: 300px; display: flex; flex-direction: column; justify-content: space-between; }
.v-hero.venture-image > img { position: absolute; inset: 0; }
.v-hero-top, .v-hero-body { position: relative; z-index: 1; padding: 8px var(--pad); }
.v-hero-body { display: grid; gap: 10px; padding-bottom: 20px; max-width: 760px; }
.v-hero.stopped { min-height: 240px; padding: 0; }
.v-back { width: 40px; height: 40px; border-radius: var(--r-md); }
.v-basis { display: inline-flex; align-items: center; gap: 4px; cursor: help; border-bottom: 1px dotted var(--text-disabled); }
@media (min-width: 1024px) {
  .v-hero { margin: 0; min-height: 340px; border-radius: var(--r-lg); border: 1px solid var(--border-quiet); }
  .v-hero.stopped { min-height: 260px; padding: 0; }
  .v-hero-top, .v-hero-body { padding-left: 32px; padding-right: 32px; }
  .v-hero-top { padding-top: 16px; }
  .v-hero-body { padding-bottom: 28px; }
}

.v-status { gap: 16px; }
.v-st { display: flex; gap: 12px; align-items: flex-start; }
.v-econ { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.v-econ .stat { min-height: 0; }
.v-ul { margin: 0; padding-left: 18px; }

.v-actions { position: sticky; bottom: calc(var(--bottom-nav-h) + var(--safe-b) + 12px); z-index: 10; padding: 8px; border-radius: var(--r-md); }
@media (min-width: 1024px) { .v-actions { position: static; max-width: 520px; margin-left: auto; padding: 0; background: none; border: 0; backdrop-filter: none; -webkit-backdrop-filter: none; } }

/* ---------- experiments ---------- */
a.card.x-card { gap: 12px; align-content: start; }
.x-card-title { margin: 0; }
.x-criteria { display: grid; gap: 8px; }
.x-crit { display: grid; grid-template-columns: 128px 1fr; gap: 12px; align-items: start; padding: 12px 14px; border-radius: var(--r-md); background: rgba(255, 255, 255, .025); border: 1px solid var(--border-card); border-left: 2px solid var(--tone); }
.x-crit-l { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 12.5px; }
.x-crit-t { color: var(--text-1); font-size: 13px; }
@media (max-width: 420px) { .x-crit { grid-template-columns: 1fr; gap: 4px; } }

.x-funnel { gap: 12px; }
.x-funnel .funnel-row { grid-template-columns: 120px 1fr 74px; row-gap: 4px; }
.x-funnel .x-fl { font-weight: 500; }
.x-funnel .x-fv { text-align: right; font-weight: 600; }
.x-funnel .x-fv.tag-unknown { font-weight: 400; }
.x-funnel .x-fbasis { grid-column: 2 / -1; font-size: 11px; color: var(--text-3); }
.x-funnel .funnel-row.off .x-fbasis { color: var(--text-disabled); }
@media (max-width: 420px) { .x-funnel .funnel-row { grid-template-columns: 92px 1fr 62px; } .x-funnel .x-fbasis { grid-column: 1 / -1; } }

.x-note { display: flex; gap: 6px; align-items: flex-start; color: var(--text-2); }
.x-note .ico { margin-top: 1px; }