/*
 * Biomass ANVA Public Experience — Tahap 21.3
 * Total Public UI Application.
 *
 * Cumulative marker retained for Tahap 21.1 Total Public Universal UI Application.
 *
 * Public surface hierarchy:
 * L0 canvas
 * L1 section / hero plane
 * L2 actual entity / listing / result card
 * L3 flat row / chip / metadata
 *
 * This file is the single owner for all .home-* public presentation.
 * It consumes ANVA semantic tokens and does not create a second token system.
 */

@layer project {
  .home-body[data-public-application="stage21.3"] {
    --public-header-h: 72px;
    --public-card-radius: 16px;
    --public-accent: var(--color-biomass);
    --public-accent-soft: var(--color-biomass-soft);
    min-width: 0;
    color: var(--color-text);
    background: var(--color-canvas);
  }

  .home-body[data-public-application="stage21.3"] .anva-container {
    width: min(100% - (var(--layout-edge) * 2), var(--layout-content-max));
    max-width: none;
    margin-inline:auto;
    padding-inline:var(--space-0);
  }

  .home-page {
    min-height: 100dvh;
    overflow: clip;
    background:
      radial-gradient(circle at 86% 4%, color-mix(in srgb, var(--public-accent) 5%, transparent), transparent 31rem),
      var(--color-canvas);
  }

  .home-page main { min-width: 0; }
  .home-page a { text-underline-offset: 3px; }

  /* ---------- Public shell ---------- */
  .home-topbar {
    position: sticky;
    z-index: 80;
    top: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 86%, transparent);
    background: color-mix(in srgb, var(--color-canvas) 90%, transparent);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }

  .home-topbar[data-scrolled="true"] {
    background: color-mix(in srgb, var(--color-surface) 94%, transparent);
    box-shadow: 0 8px 24px color-mix(in srgb, var(--color-text) 4%, transparent);
  }

  .home-topbar-inner {
    min-height: var(--public-header-h);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap:var(--space-6);
    align-items: center;
  }

  .home-brand {
    display: inline-flex;
    align-items: center;
    gap:var(--space-2);
    color: var(--color-text);
    text-decoration: none;
    min-width: 0;
  }

  .home-brand-mark {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 12px;
    color: var(--color-text-inverse);
    background: var(--public-accent);
    font-size:var(--type-body-sm);
    font-weight: var(--weight-heavy);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--public-accent) 16%, transparent);
  }

  .home-brand > span:last-child { display: grid; gap:1px; line-height:var(--leading-section); }
  .home-brand strong { font-size:var(--type-body-sm); font-weight: var(--weight-bold); }
  .home-brand small { color: var(--color-text-muted); font-size:var(--type-caption); }

  .home-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap:var(--space-1);
    min-width: 0;
  }

  .home-nav a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding:var(--space-2) var(--space-2);
    border-radius: 10px;
    color: var(--color-text-muted);
    text-decoration: none;
    font-size:var(--type-caption);
    font-weight: var(--weight-medium);
    white-space: nowrap;
  }

  .home-nav a:hover { color: var(--color-text); background: var(--color-surface-subtle); }
  .home-nav a[aria-current="page"] { color: var(--color-text); background: var(--color-surface); box-shadow: inset 0 0 0 1px var(--color-border); }

  .home-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap:var(--space-2);
  }

  .home-header-actions .anva-button { white-space: nowrap; }
  .home-account-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding:var(--space-2) var(--space-2);
    color: var(--color-text);
    text-decoration: none;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .home-install-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap:var(--space-2);
    border: 1px solid var(--color-border);
    border-radius: 11px;
    padding:var(--space-2) var(--space-2) var(--space-2) var(--space-2);
    color: var(--color-text);
    background: var(--color-surface);
    cursor: pointer;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .home-install-button[hidden] { display: none; }
  .home-install-button-mark {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--public-accent);
    background: var(--public-accent-soft);
    font-size:var(--type-caption);
    font-weight: var(--weight-heavy);
  }

  .home-menu-button {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: var(--color-surface);
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap:var(--space-1);
    cursor: pointer;
  }

  .home-menu-button span {
    width: 17px;
    height: 1.5px;
    border-radius: 2px;
    background: var(--color-text);
  }

  .home-mobile-menu {
    border-top: 1px solid var(--color-border);
    background: var(--color-surface);
  }

  .home-mobile-menu[hidden] { display: none; }
  .home-mobile-menu-inner {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:var(--space-2);
    padding-block:var(--space-3) var(--space-4);
  }

  .home-mobile-menu-inner a {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding:var(--space-2) var(--space-2);
    border-radius: 10px;
    color: var(--color-text);
    background: var(--color-surface-subtle);
    text-decoration: none;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .home-bottom-nav { display: none; }

  /* ---------- Shared public typography ---------- */
  .home-kicker,
  .home-card-label {
    display: inline-flex;
    align-items: center;
    gap:var(--space-2);
    color: var(--public-accent);
    font-size:var(--type-caption);
    line-height:var(--leading-tight);
    font-weight: var(--weight-bold);
    letter-spacing:var(--tracking-label);
    text-transform: uppercase;
  }

  .home-kicker::before {
    content: "";
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
  }

  .home-section {
    position: relative;
    padding-block:var(--layout-space-major);
  }

  .home-section + .home-section { border-top: 1px solid color-mix(in srgb, var(--color-border) 72%, transparent); }

  .home-section-soft { background: color-mix(in srgb, var(--color-surface-subtle) 72%, transparent); }
  .home-section-dark {
    color: var(--color-text-inverse);
    background: var(--color-surface-inverse);
    border-top: 0;
  }

  .home-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap:var(--space-6);
    margin-bottom:var(--space-8);
  }

  .home-section-head > div:first-child{min-width:0;max-inline-size:none}

  .home-section-head h2,
  .home-impact h2,
  .home-trace-band h2,
  .home-cta h2 {
    margin-top:var(--space-2);
    color: inherit;
    font-size:var(--type-page-title);
    line-height:var(--leading-page);
    letter-spacing:var(--tracking-title);
    text-wrap: balance;
  }

  .home-section-head p,
  .home-impact p,
  .home-trace-band p {
    margin-top:var(--space-2);
    color: var(--color-text-muted);
    max-inline-size:var(--measure-body);
    font-size:var(--type-body-sm);
    line-height:var(--leading-body);
  }

  .home-section-dark .home-section-head p { color: color-mix(in srgb, var(--color-text-inverse) 70%, transparent); }
  .home-section-dark .home-kicker { color: color-mix(in srgb, var(--color-text-inverse) 76%, var(--public-accent)); }

  .home-text-link,
  .home-back-link {
    color: inherit;
    text-decoration: none;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .home-text-link:hover,
  .home-back-link:hover { text-decoration: underline; }

  /* ---------- Hero: L1 plane, no outer card ---------- */
  .home-hero {
    padding:var(--space-16) var(--space-0) var(--space-16);
    border-bottom: 1px solid var(--color-border);
  }

  .home-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(420px, .94fr);
    align-items: center;
    gap:var(--space-16);
  }

  .home-hero-copy { min-width: 0; }
  .home-hero-copy h1 {
    max-inline-size:var(--measure-display);
    margin-top:var(--space-3);
    color: var(--color-text);
    font-size:var(--type-display);
    line-height:var(--leading-display);
    letter-spacing:var(--tracking-display);
    font-weight: var(--weight-heavy);
    text-wrap: balance;
  }

  .home-hero-copy h1 span { color: var(--public-accent); }
  .home-hero-lead {
    max-inline-size:var(--measure-body);
    margin-top:var(--space-5);
    color: var(--color-text-muted);
    font-size:var(--type-body);
    line-height:var(--leading-body);
  }

  .home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap:var(--space-2);
    margin-top:var(--space-6);
  }

  .home-hero-notes {
    display: flex;
    flex-wrap: wrap;
    gap:var(--space-2) var(--space-3);
    margin-top:var(--space-5);
  }

  .home-hero-notes span {
    display: inline-flex;
    align-items: center;
    gap:var(--space-2);
    color: var(--color-text-muted);
    font-size:var(--type-caption);
  }

  .home-hero-notes span::before {
    content: "✓";
    color: var(--color-success);
    font-weight: var(--weight-bold);
  }

  .home-install-note,
  .home-user-strip {
    margin-top:var(--space-5);
    padding:var(--space-3) var(--space-0) var(--space-0) var(--space-3);
    border: 0;
    border-left: 2px solid var(--public-accent);
    background: transparent;
  }

  .home-install-note { display: grid; gap:var(--space-1); }
  .home-install-note strong,
  .home-user-strip strong { color: var(--color-text); font-size:var(--type-caption); }
  .home-install-note span,
  .home-user-strip small { color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-install-note a,
  .home-user-strip a { color: var(--public-accent); text-decoration: none; font-size:var(--type-caption); font-weight: var(--weight-bold); }

  .home-user-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:var(--space-3);
  }

  /* Actual L2 visual explainer. */
  .home-chain-card {
    min-width: 0;
    padding:var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--color-surface) 90%, var(--public-accent-soft));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--color-text) 6%, transparent);
  }

  .home-chain-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap:var(--space-3);
    padding-bottom:var(--space-4);
    border-bottom: 1px solid var(--color-border);
  }

  .home-chain-head > div { display: grid; gap:var(--space-1); }
  .home-chain-head small { color: var(--color-text-muted); font-size:var(--type-caption); text-transform: uppercase; letter-spacing:var(--tracking-label); }
  .home-chain-head strong { color: var(--color-text); font-size:var(--type-label); }
  .home-chain-head > span {
    padding:var(--space-1) var(--space-2);
    border-radius: var(--radius-pill);
    color: var(--color-success);
    background: var(--color-success-soft);
    font-size:var(--type-caption);
    font-weight: var(--weight-bold);
    letter-spacing:var(--tracking-label);
  }

  .home-chain-visual {
    display: grid;
    grid-template-columns: repeat(9, auto);
    align-items: center;
    justify-content: space-between;
    gap:var(--space-1);
    padding:var(--space-5) var(--space-0);
  }

  .home-chain-node {
    min-width: 0;
    display: grid;
    gap:var(--space-1);
    padding:var(--space-0);
    border: 0;
    background: transparent;
  }

  .home-chain-node b {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--color-text-muted);
    background: var(--color-surface-subtle);
    font-size:var(--type-caption);
  }

  .home-chain-node.is-source b,
  .home-chain-node.is-destination b { color: var(--color-text-inverse); background: var(--public-accent); }
  .home-chain-node span { color: var(--color-text); font-size:var(--type-caption); font-weight: var(--weight-semibold); }
  .home-chain-node small { max-inline-size:none; color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-chain-visual > i { color: var(--color-text-subtle); font-size:var(--type-caption); font-style: normal; }

  .home-chain-status {
    display: flex;
    flex-wrap: wrap;
    gap:var(--space-2) var(--space-3);
    padding-top:var(--space-3);
    border-top: 1px solid var(--color-border);
  }

  .home-chain-status span {
    display: inline-flex;
    align-items: center;
    gap:var(--space-1);
    color: var(--color-text-muted);
    font-size:var(--type-caption);
  }
  .home-chain-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--color-success); }

  /* ---------- Metrics: editorial, no metric-card wall ---------- */
  .home-live-stats { background: var(--color-surface); border-bottom: 1px solid var(--color-border); }
  .home-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .home-stats-grid article {
    min-width: 0;
    padding:var(--space-6) var(--space-6);
    border-left: 1px solid var(--color-border);
  }
  .home-stats-grid article:first-child { border-left: 0; padding-left:var(--space-0); }
  .home-stats-grid article:last-child { padding-right:var(--space-0); }

  .home-stats-grid span { display: block; color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-stats-grid strong {
    display: block;
    margin-top:var(--space-2);
    color: var(--color-text);
    font-size:var(--type-page-title);
    line-height:var(--leading-display);
    letter-spacing:var(--tracking-title);
    font-variant-numeric: tabular-nums;
  }
  .home-stats-grid small { display: block; margin-top:var(--space-2); color: var(--color-text-subtle); font-size:var(--type-caption); line-height:var(--leading-compact); }

  /* ---------- Actions: L3 rows, not six cards ---------- */
  .home-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap:var(--space-8);
    border-top: 1px solid var(--color-border);
  }

  .home-action-card {
    min-height: 96px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap:var(--space-3);
    padding:var(--space-4) var(--space-1);
    border: 0;
    border-bottom: 1px solid var(--color-border);
    border-radius: 0;
    color: var(--color-text);
    background: transparent;
    box-shadow: none;
    text-decoration: none;
  }

  .home-action-card:hover { background: color-mix(in srgb, var(--public-accent-soft) 44%, transparent); }
  .home-action-card b { color: var(--public-accent); font-size:var(--type-caption); }
  .home-action-card > div { display: grid; gap:var(--space-1); min-width: 0; }
  .home-action-card strong { font-size:var(--type-body-sm); }
  .home-action-card span { color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-action-card i { color: var(--color-text-subtle); font-style: normal; transition: transform .18s ease; }
  .home-action-card:hover i { transform: translateX(3px); }

  /* ---------- Search/filter surface ---------- */
  .home-searchbar {
    min-height: 58px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap:var(--space-2);
    padding:var(--space-2) var(--space-2) var(--space-2) var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: 15px;
    background: var(--color-surface);
    box-shadow: 0 10px 28px color-mix(in srgb, var(--color-text) 4%, transparent);
  }

  .home-searchbar > span { color: var(--color-text-subtle); font-size:var(--type-body); }
  .home-searchbar input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--color-text);
    background: transparent;
    font-size:var(--type-label);
  }

  .home-searchbar input::placeholder { color: var(--color-text-subtle); }
  .home-searchbar button,
  .home-searchbar > a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 11px;
    padding:var(--space-2) var(--space-3);
    color: var(--color-text-inverse);
    background: var(--color-action);
    text-decoration: none;
    cursor: pointer;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }
  .home-searchbar > a { color: var(--color-text); background: var(--color-surface-subtle); }

  .home-searchbar-page { margin-bottom:var(--space-8); }

  /* ---------- Bank directory / entities ---------- */
  .home-bank-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:var(--layout-space-card);
    margin-top:var(--space-6);
  }

  .home-bank-card {
    min-width: 0;
    overflow: hidden;
    display: grid;
    grid-template-rows: 160px 1fr;
    border: 1px solid var(--color-border);
    border-radius: var(--public-card-radius);
    background: var(--color-surface);
    box-shadow: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  }

  .home-bank-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--public-accent) 24%, var(--color-border));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--color-text) 6%, transparent);
  }

  .home-bank-cover {
    min-width: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--public-accent);
    background: linear-gradient(145deg, var(--public-accent-soft), var(--color-surface-subtle));
    text-decoration: none;
  }

  .home-bank-cover img { width: 100%; height: 100%; object-fit: cover; }
  .home-bank-cover > span { font-size:var(--type-page-title); font-weight: var(--weight-heavy); }
  .home-bank-body { display: flex; flex-direction: column; gap:var(--space-3); padding:var(--space-4); }
  .home-bank-body h3 { margin-top:var(--space-1); font-size:var(--type-body); letter-spacing:var(--tracking-title); }
  .home-bank-body h3 a { color: var(--color-text); text-decoration: none; }
  .home-bank-body p { margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-compact); }

  .home-chip-row,
  .home-material-list {
    display: flex;
    flex-wrap: wrap;
    gap:var(--space-1);
  }

  .home-chip-row span,
  .home-material-list span {
    padding:var(--space-1) var(--space-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    color: var(--color-text-muted);
    background: var(--color-surface-subtle);
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .home-card-meta {
    margin-top:auto;
    padding-top:var(--space-2);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-muted);
    font-size:var(--type-caption);
  }

  .home-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap:var(--space-2);
  }
  .home-card-actions a {
    color: var(--color-text);
    text-decoration: none;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }
  .home-card-actions a:first-child { color: var(--public-accent); }

  /* ---------- Process / actors: editorial numbered lists ---------- */
  .home-process {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    border-top: 1px solid var(--color-border);
  }

  .home-process article {
    min-width: 0;
    padding:var(--space-4) var(--space-3) var(--space-0);
    border-left: 1px solid var(--color-border);
  }
  .home-process article:first-child { border-left: 0; padding-left:var(--space-0); }
  .home-process b { display: block; color: var(--public-accent); font-size:var(--type-caption); }
  .home-process span { display: block; margin-top:var(--space-5); color: var(--color-text); font-size:var(--type-label); font-weight: var(--weight-bold); }
  .home-process p { margin-top:var(--space-2); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-body); }

  .home-actor-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--color-border);
  }

  .home-actor-grid article {
    position: relative;
    min-height: 145px;
    padding:var(--space-5) var(--space-5) var(--space-5) var(--space-10);
    border-bottom: 1px solid var(--color-border);
  }
  .home-actor-grid article:not(:nth-child(3n + 1)) { border-left: 1px solid var(--color-border); }
  .home-actor-grid b { position: absolute; left: 4px; top: 22px; color: var(--public-accent); font-size:var(--type-caption); }
  .home-actor-grid strong { display: block; font-size:var(--type-body-sm); }
  .home-actor-grid p { margin-top:var(--space-2); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-body); }


  .home-section-head-light { color: var(--color-text-inverse); }
  .home-market-grid-light { align-items: stretch; }
  .home-trace-form-page { position: sticky; top: calc(var(--public-header-h) + 20px); }

  /* ---------- Marketplace ---------- */
  .home-market-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:var(--layout-space-card);
  }

  .home-market-card {
    min-width: 0;
    display: flex;
    min-height: 265px;
    flex-direction: column;
    padding:var(--space-4);
    border: 1px solid color-mix(in srgb, var(--color-text-inverse) 14%, transparent);
    border-radius: var(--public-card-radius);
    color: var(--color-text-inverse);
    background: color-mix(in srgb, var(--color-text-inverse) 4%, transparent);
    box-shadow: none;
  }

  .home-market-card-light {
    color: var(--color-text);
    border-color: var(--color-border);
    background: var(--color-surface);
  }

  .home-market-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:var(--space-2);
  }
  .home-market-top span { font-size:var(--type-caption); font-weight: var(--weight-bold); letter-spacing:var(--tracking-label); }
  .home-market-top b {
    padding:var(--space-1) var(--space-2);
    border-radius: var(--radius-pill);
    color: var(--color-warning);
    background: var(--color-warning-soft);
    font-size:var(--type-caption);
  }
  .home-market-top b.is-pass { color: var(--color-success); background: var(--color-success-soft); }
  .home-market-card h3 { margin-top:var(--space-5); font-size:var(--type-card-title); letter-spacing:var(--tracking-title); }
  .home-market-card > p { margin-top:var(--space-2); color: currentColor; opacity: .68; font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-stock { margin-top:var(--space-6); }
  .home-stock small { display: block; opacity: .62; font-size:var(--type-caption); }
  .home-stock strong { display: block; margin-top:var(--space-1); font-size:var(--type-title-sm); letter-spacing:var(--tracking-title); font-variant-numeric: tabular-nums; }
  .home-market-footer {
    display: grid;
    gap:var(--space-2);
    margin-top:auto;
    padding-top:var(--space-4);
    border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  }
  .home-market-footer span { opacity: .58; font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-market-footer a { color: inherit; text-decoration: none; font-size:var(--type-caption); font-weight: var(--weight-bold); }

  .home-market-page .home-market-card:not(.home-market-card-light) {
    color: var(--color-text);
    border-color: var(--color-border);
    background: var(--color-surface);
  }
  .home-market-page .home-market-card:not(.home-market-card-light) .home-market-footer {
    border-color: var(--color-border);
  }

  /* ---------- Impact ---------- */
  .home-impact { background: var(--color-surface); }
  .home-impact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .7fr);
    align-items: center;
    gap:var(--space-16);
  }
  .home-impact-grid > div:first-child{max-inline-size:none}
  .home-impact-grid .anva-button { margin-top:var(--space-5); }

  .home-impact-flow {
    display: grid;
    gap:var(--space-2);
    border-left: 1px solid var(--color-border);
    padding-left:var(--space-8);
  }
  .home-impact-flow > div { padding:var(--space-2) var(--space-0); }
  .home-impact-flow strong { display: block; color: var(--color-text); font-size:var(--type-section-title); letter-spacing:var(--tracking-title); }
  .home-impact-flow span { display: block; margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-impact-flow i { color: var(--color-text-subtle); font-style: normal; font-size:var(--type-caption); }
  .home-impact-flow .is-final strong { color: var(--public-accent); }

  /* ---------- Trace band / trace page ---------- */
  .home-trace-band { background: color-mix(in srgb, var(--public-accent-soft) 45%, var(--color-canvas)); }
  .home-trace-grid,
  .home-trace-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, .78fr);
    gap:var(--space-16);
    align-items: start;
  }

  .home-trace-form {
    padding:var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: var(--public-card-radius);
    background: var(--color-surface);
    box-shadow: none;
  }
  .home-trace-form > label { display: block; color: var(--color-text); font-size:var(--type-caption); font-weight: var(--weight-semibold); }
  .home-trace-form > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap:var(--space-2);
    margin-top:var(--space-2);
  }
  .home-trace-form input {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    border: 1px solid var(--color-border);
    border-radius: 11px;
    padding:var(--space-2) var(--space-3);
    outline: 0;
    color: var(--color-text);
    background: var(--color-surface);
    font-size:var(--type-label);
    font-family: var(--font-mono);
  }
  .home-trace-form input:focus { border-color: var(--color-action); box-shadow: 0 0 0 3px var(--color-action-soft); }
  .home-trace-form button {
    min-height: 46px;
    border: 0;
    border-radius: 11px;
    padding:var(--space-2) var(--space-4);
    color: var(--color-text-inverse);
    background: var(--color-action);
    cursor: pointer;
    font-size:var(--type-caption);
    font-weight: var(--weight-semibold);
  }
  .home-trace-form small { display: block; margin-top:var(--space-2); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-compact); }

  .home-trace-error {
    margin-top:var(--space-3);
    padding:var(--space-3) var(--space-0) var(--space-0) var(--space-3);
    border-left: 2px solid var(--color-danger);
  }
  .home-trace-error strong { color: var(--color-danger); font-size:var(--type-caption); }
  .home-trace-error p { margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); }

  .home-trace-result {
    min-width: 0;
    padding:var(--space-0) var(--space-0) var(--space-0) var(--space-6);
    border-left: 1px solid var(--color-border);
  }

  .home-trace-result-head {
    display: flex;
    justify-content: space-between;
    gap:var(--space-4);
    align-items: flex-start;
    padding-bottom:var(--space-4);
    border-bottom: 1px solid var(--color-border);
  }
  .home-trace-result-head span { color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-trace-result-head h2 { margin-top:var(--space-1); font-size:var(--type-card-title); font-family: var(--font-mono); letter-spacing:var(--tracking-title); }
  .home-trace-result-head p { margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-trace-status {
    padding:var(--space-2) var(--space-2);
    border-radius: var(--radius-pill);
    color: var(--color-info);
    background: var(--color-info-soft);
    font-size:var(--type-caption);
    font-weight: var(--weight-bold);
  }

  .home-trace-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:1px;
    margin:var(--space-4) var(--space-0);
    background: var(--color-border);
  }
  .home-trace-summary > div { min-width: 0; padding:var(--space-3); background: var(--color-surface); }
  .home-trace-summary span { display: block; color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-trace-summary strong { display: block; margin-top:var(--space-1); color: var(--color-text); font-size:var(--type-caption); overflow-wrap: anywhere; }

  .home-public-timeline { display: grid; gap:var(--space-0); }
  .home-public-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap:var(--space-3);
    min-height: 64px;
    padding-bottom:var(--space-3);
  }
  .home-public-timeline article:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 31px;
    bottom: 0;
    width: 1px;
    background: var(--color-border);
  }
  .home-public-timeline-marker {
    position: relative;
    z-index: 1;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    color: var(--color-text-subtle);
    background: var(--color-surface);
    font-size:var(--type-caption);
    font-weight: var(--weight-bold);
  }
  .home-public-timeline article > div:last-child { padding-top:var(--space-1); }
  .home-public-timeline strong { display: block; color: var(--color-text); font-size:var(--type-caption); }
  .home-public-timeline span { display: block; margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-public-timeline article.state-done .home-public-timeline-marker { color: var(--color-success); border-color: color-mix(in srgb, var(--color-success) 28%, var(--color-border)); background: var(--color-success-soft); }
  .home-public-timeline article.state-active .home-public-timeline-marker { color: var(--color-info); border-color: color-mix(in srgb, var(--color-info) 28%, var(--color-border)); background: var(--color-info-soft); }

  .home-trace-final {
    display: flex;
    justify-content: space-between;
    gap:var(--space-4);
    margin-top:var(--space-4);
    padding:var(--space-3) var(--space-0);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
  }
  .home-trace-final span { color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-trace-final strong { color: var(--public-accent); font-size:var(--type-caption); }
  .home-trace-privacy { margin-top:var(--space-3); color: var(--color-text-subtle); font-size:var(--type-caption); line-height:var(--leading-compact); }

  .home-trace-help {
    padding:var(--space-2) var(--space-0) var(--space-0) var(--space-5);
    border-left: 1px solid var(--color-border);
  }
  .home-trace-help h2 { margin-top:var(--space-2); font-size:var(--type-title-sm); letter-spacing:var(--tracking-title); }
  .home-trace-help p { margin-top:var(--space-2); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-body); }
  .home-trace-help > div { display: flex; flex-wrap: wrap; gap:var(--space-2); margin-top:var(--space-4); color: var(--color-text-muted); font-size:var(--type-caption); }

  /* ---------- Subpage pagehead: L1, never card ---------- */
  .home-subhero {
    padding:var(--space-16) var(--space-0) var(--space-8);
    border-bottom: 1px solid var(--color-border);
  }
  .home-subhero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap:var(--space-8);
  }
  .home-subhero-inner > div:first-child{max-inline-size:none}
  .home-subhero h1 {
    margin-top:var(--space-2);
    font-size:var(--type-page-title);
    line-height:var(--leading-display);
    letter-spacing:var(--tracking-display);
    text-wrap: balance;
  }
  .home-subhero p { margin-top:var(--space-3); max-inline-size:var(--measure-body); color: var(--color-text-muted); font-size:var(--type-label); line-height:var(--leading-body); }
  .home-subhero-count {
    min-width: 150px;
    padding:var(--space-1) var(--space-0) var(--space-1) var(--space-4);
    border-left: 2px solid var(--public-accent);
  }
  .home-subhero-count strong { display: block; font-size:var(--type-section-title); letter-spacing:var(--tracking-title); }
  .home-subhero-count span { display: block; margin-top:var(--space-1); color: var(--color-text-muted); font-size:var(--type-caption); }

  /* ---------- Seller entity detail ---------- */
  .home-seller-hero {
    padding:var(--space-8) var(--space-0) var(--space-10);
    border-bottom: 1px solid var(--color-border);
  }
  .home-back-link { display: inline-flex; margin-bottom:var(--space-5); color: var(--color-text-muted); }
  .home-seller-hero-card {
    display: grid;
    grid-template-columns: minmax(320px, .72fr) minmax(0, 1.28fr);
    gap:var(--space-10);
    align-items: center;
    padding:var(--space-0);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .home-seller-cover {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: 18px;
    color: var(--public-accent);
    background: linear-gradient(145deg, var(--public-accent-soft), var(--color-surface-subtle));
  }
  .home-seller-cover img { width: 100%; height: 100%; object-fit: cover; }
  .home-seller-cover span { font-size:var(--type-page-title); font-weight: var(--weight-heavy); }
  .home-seller-info h1 { margin-top:var(--space-2); font-size:var(--type-page-title); line-height:var(--leading-display); letter-spacing:var(--tracking-display); }
  .home-seller-info > p { margin-top:var(--space-3); color: var(--color-text-muted); font-size:var(--type-label); line-height:var(--leading-body); }
  .home-seller-buttons { display: flex; flex-wrap: wrap; gap:var(--space-2); margin-top:var(--space-5); }

  .home-seller-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
    gap:var(--space-12);
    align-items: start;
  }
  .home-seller-main,
  .home-seller-side { display: grid; gap:var(--space-0); }
  .home-seller-side { border-left: 1px solid var(--color-border); padding-left:var(--space-8); }

  .home-info-panel {
    padding:var(--space-5) var(--space-0);
    border: 0;
    border-bottom: 1px solid var(--color-border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .home-info-panel:first-child { padding-top:var(--space-0); }
  .home-info-panel h2 { margin-top:var(--space-2); font-size:var(--type-card-title); letter-spacing:var(--tracking-title); }
  .home-info-panel > p { margin-top:var(--space-2); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-body); }
  .home-info-panel > span:not(.home-kicker) { display: block; color: var(--color-text-muted); font-size:var(--type-caption); }
  .home-info-panel > strong { display: block; margin-top:var(--space-1); color: var(--color-text); font-size:var(--type-caption); line-height:var(--leading-compact); }
  .home-info-panel.is-action { padding:var(--space-5); border: 0; border-radius: 15px; background: var(--public-accent-soft); }
  .home-info-panel.is-action p { color: var(--color-text-muted); }

  /* ---------- Empty states ---------- */
  .home-empty-inline,
  .home-empty-dark,
  .home-empty-large {
    display: grid;
    justify-items: start;
    gap:var(--space-2);
    padding:var(--space-8) var(--space-0);
    border: 0;
    border-top: 1px solid var(--color-border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .home-empty-dark { border-color: color-mix(in srgb, var(--color-text-inverse) 18%, transparent); }
  .home-empty-large { min-height: 280px; align-content: center; justify-items: center; text-align: center; }
  .home-empty-large > div { color: var(--public-accent); font-size:var(--type-title-sm); font-weight: var(--weight-heavy); }
  .home-empty-inline strong,
  .home-empty-dark strong,
  .home-empty-large h2,
  .home-empty-large h1 { color: inherit; font-size:var(--type-card-title); letter-spacing:var(--tracking-title); }
  .home-empty-inline span,
  .home-empty-dark span,
  .home-empty-large p { max-inline-size:var(--measure-body); color: var(--color-text-muted); font-size:var(--type-caption); line-height:var(--leading-body); }
  .home-empty-dark span { color: color-mix(in srgb, var(--color-text-inverse) 66%, transparent); }
  .home-empty-large .anva-button { margin-top:var(--space-2); }

  /* ---------- CTA / footer ---------- */
  .home-cta {
    padding:var(--space-16) var(--space-0);
    color: var(--color-text-inverse);
    background: var(--color-surface-inverse);
  }
  .home-cta-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap:var(--space-10);
  }
  .home-cta-inner > div:first-child{min-width:0;max-inline-size:none}
  .home-cta span { color: color-mix(in srgb, var(--color-text-inverse) 62%, transparent); font-size:var(--type-caption); }
  .home-cta h2{max-inline-size:var(--measure-section-title);margin-top:var(--space-2)}
  .home-cta-inner > div:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; gap:var(--space-2); }

  .home-footer {
    padding:var(--space-16) var(--space-0) var(--space-6);
    color: var(--color-text-muted);
    background: var(--color-canvas);
    border-top: 1px solid var(--color-border);
  }
  .home-footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(150px, .45fr) minmax(150px, .45fr);
    gap:var(--space-12);
  }
  .home-brand-footer { margin-bottom:var(--space-3); }
  .home-footer-grid > div:first-child > p { max-inline-size:var(--measure-body); font-size:var(--type-caption); line-height:var(--leading-body); }
  .home-footer-grid > div:not(:first-child) { display: grid; align-content: start; gap:var(--space-2); }
  .home-footer-grid > div:not(:first-child) strong { color: var(--color-text); font-size:var(--type-caption); }
  .home-footer-grid a { color: var(--color-text-muted); text-decoration: none; font-size:var(--type-caption); }
  .home-footer-grid a:hover { color: var(--color-text); }
  .home-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap:var(--space-5);
    margin-top:var(--space-10);
    padding-top:var(--space-4);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-subtle);
    font-size:var(--type-caption);
  }

  /* ---------- Desktop explicit composition ---------- */
  @media (min-width: 960px) {
    .home-body[data-public-application="stage21.3"] {
    }
    .home-market-page { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .home-bank-grid-directory { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

  /* ---------- Tablet explicit composition ---------- */
  @media (min-width:640px) and (max-width:959px) {
    .home-body[data-public-application="stage21.3"] {
      --public-header-h: 66px;
    }

    .home-topbar-inner { grid-template-columns: auto 1fr auto; gap:var(--space-3); }
    .home-nav { display: none; }
    .home-menu-button { display: flex; }
    .home-header-actions { margin-left:auto; }
    .home-header-actions > .anva-button { display: none; }

    .home-mobile-menu-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .home-hero { padding:var(--space-12) var(--space-0) var(--space-12); }
    .home-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(300px, .78fr); gap:var(--space-8); }
    .home-hero-copy h1 { font-size:var(--type-page-title); }
    .home-hero-lead { font-size:var(--type-body-sm); }
    .home-chain-card { padding:var(--space-4); border-radius: 17px; }
    .home-chain-visual { grid-template-columns: repeat(5, minmax(0, 1fr)); gap:var(--space-2); }
    .home-chain-visual > i { display: none; }
    .home-chain-node small { display: none; }

    .home-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-stats-grid article { padding:var(--space-5); border-bottom: 1px solid var(--color-border); }
    .home-stats-grid article:nth-child(odd) { border-left: 0; padding-left:var(--space-0); }
    .home-stats-grid article:nth-child(even) { padding-right:var(--space-0); }

    .home-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap:var(--space-6); }
    .home-bank-grid,
    .home-bank-grid-directory,
    .home-market-grid,
    .home-market-page { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .home-process { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap:var(--space-8); }
    .home-process article:nth-child(5) { border-left: 0; padding-left:var(--space-0); }
    .home-actor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-actor-grid article:not(:nth-child(3n + 1)) { border-left: 0; }
    .home-actor-grid article:nth-child(even) { border-left: 1px solid var(--color-border); }

    .home-trace-form-page { position: static; }
    .home-impact-grid { grid-template-columns: 1fr 1fr; gap:var(--space-10); }
    .home-trace-grid,
    .home-trace-page-grid { grid-template-columns: 1fr 1fr; gap:var(--space-8); }

    .home-subhero { padding:var(--space-12) var(--space-0) var(--space-8); }
    .home-seller-hero-card { grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap:var(--space-8); }
    .home-seller-detail-grid { grid-template-columns: minmax(0, 1.25fr) minmax(240px, .75fr); gap:var(--space-8); }
  }

  /* ---------- Mobile explicit composition ---------- */
  @media (max-width:639px) {
    .home-body[data-public-application="stage21.3"] {
      --public-header-h: 60px;
    }

    .home-topbar {
      border-bottom: 1px solid var(--color-border);
      background: color-mix(in srgb, var(--color-surface) 96%, transparent);
    }
    .home-topbar-inner { grid-template-columns: minmax(0, 1fr) auto; gap:var(--space-2); }
    .home-brand small { display: none; }
    .home-brand-mark { width: 34px; height: 34px; border-radius: 10px; }
    .home-brand strong { font-size:var(--type-label); }
    .home-nav,
    .home-menu-button { display: none; }
    .home-account-link {
      min-height: 36px;
      padding:var(--space-1) var(--space-2);
      font-size:var(--type-caption);
    }
    .home-header-actions { gap:var(--space-1); }
    .home-header-actions > .anva-button { display: none; }
    .home-install-button { min-height: 36px; padding:var(--space-1) var(--space-2) var(--space-1) var(--space-1); }
    .home-install-button-mark { width: 22px; height: 22px; }

    .home-mobile-menu { display: none; }

    .home-bottom-nav {
      position: fixed;
      z-index: 100;
      left: 10px;
      right: 10px;
      bottom: 8px;
      min-height: calc(64px + env(safe-area-inset-bottom));
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap:var(--space-1);
      padding:var(--space-1) var(--space-2) calc(var(--space-1) + env(safe-area-inset-bottom));
      border: 1px solid color-mix(in srgb, var(--color-border) 90%, transparent);
      border-radius: 22px;
      background: color-mix(in srgb, var(--color-surface) 96%, transparent);
      box-shadow: 0 16px 44px color-mix(in srgb, var(--color-text) 14%, transparent);
      backdrop-filter: blur(22px);
      -webkit-backdrop-filter: blur(22px);
    }

    .home-bottom-nav > a {
      min-width: 0;
      min-height: 52px;
      display: grid;
      place-items: center;
      align-content: center;
      gap:var(--space-1);
      border-radius: 15px;
      color: var(--color-text-muted);
      text-decoration: none;
    }
    .home-bottom-nav > a.is-active { color: var(--public-accent); background: var(--public-accent-soft); }
    .home-bottom-nav-icon { width: 20px; height: 20px; display: grid; place-items: center; }
    .home-bottom-nav-icon svg { width: 20px; height: 20px; }
    .home-bottom-nav small {
      max-width: 100%;
      overflow: hidden;
      font-size:var(--type-caption);
      font-weight: var(--weight-semibold);
      line-height:var(--leading-section);
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    .home-section { padding-block:var(--layout-space-major); }
    .home-section-head { grid-template-columns: 1fr; gap:var(--space-3); margin-bottom:var(--space-5); }
    .home-section-head h2,
    .home-impact h2,
    .home-trace-band h2,
    .home-cta h2 { font-size:var(--type-section-title); }
    .home-section-head p,
    .home-impact p,
    .home-trace-band p { font-size:var(--type-caption); line-height:var(--leading-body); }
    .home-text-link { justify-self: start; }

    .home-hero { padding:var(--space-10) var(--space-0) var(--space-10); }
    .home-hero-grid { grid-template-columns: 1fr; gap:var(--space-8); }
    .home-hero-copy h1 { font-size:var(--type-page-title); line-height:var(--leading-display); }
    .home-hero-lead { margin-top:var(--space-4); font-size:var(--type-label); }
    .home-hero-actions { display: grid; grid-template-columns: 1fr 1fr; margin-top:var(--space-5); }
    .home-hero-actions .anva-button { width: 100%; justify-content: center; }
    .home-hero-notes { display: grid; gap:var(--space-2); margin-top:var(--space-4); }
    .home-user-strip { align-items: flex-start; }

    .home-chain-card { padding:var(--space-4); border-radius: 16px; box-shadow: none; }
    .home-chain-head > div strong { font-size:var(--type-caption); }
    .home-chain-visual { grid-template-columns: 1fr; gap:var(--space-0); padding:var(--space-3) var(--space-0); }
    .home-chain-visual > i { display: none; }
    .home-chain-node {
      position: relative;
      grid-template-columns: 30px minmax(0, 1fr);
      gap:1px var(--space-2);
      min-height: 54px;
      align-items: start;
      padding-bottom:var(--space-2);
    }
    .home-chain-node:not(:last-of-type)::after {
      content: "";
      position: absolute;
      left: 14px;
      top: 30px;
      bottom: 0;
      width: 1px;
      background: var(--color-border);
    }
    .home-chain-node b { grid-row: 1 / span 2; }
    .home-chain-node span { padding-top:var(--space-1); font-size:var(--type-caption); }
    .home-chain-node small { max-width: none; font-size:var(--type-caption); }
    .home-chain-status { display: none; }

    .home-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-stats-grid article { padding:var(--space-4) var(--space-3); border-bottom: 1px solid var(--color-border); }
    .home-stats-grid article:nth-child(odd) { border-left: 0; padding-left:var(--space-0); }
    .home-stats-grid article:nth-child(even) { padding-right:var(--space-0); }
    .home-stats-grid strong { font-size:var(--type-title-sm); }
    .home-stats-grid small { font-size:var(--type-caption); }

    .home-action-grid { grid-template-columns: 1fr; column-gap:var(--space-0); }
    .home-action-card { min-height: 82px; grid-template-columns: 28px minmax(0, 1fr) auto; padding:var(--space-3) 1px; }
    .home-action-card strong { font-size:var(--type-label); }
    .home-action-card span { font-size:var(--type-caption); }

    .home-searchbar {
      min-height: 54px;
      grid-template-columns: auto minmax(0, 1fr) auto;
      padding:var(--space-2) var(--space-2) var(--space-2) var(--space-3);
      border-radius: 14px;
      box-shadow: none;
    }
    .home-searchbar input { font-size:var(--type-body); }
    .home-searchbar button { min-height: 40px; padding-inline:var(--space-3); }
    .home-searchbar > a { grid-column: 2 / -1; justify-self: start; min-height: 32px; padding:var(--space-1) var(--space-2); }
    .home-searchbar-page { margin-bottom:var(--space-5); }

    .home-bank-grid,
    .home-bank-grid-directory,
    .home-market-grid,
    .home-market-page { grid-template-columns: 1fr; gap:var(--layout-space-card); }
    .home-bank-card { grid-template-columns: 92px minmax(0, 1fr); grid-template-rows: 1fr; border-radius: 14px; }
    .home-bank-cover { min-height: 100%; border-radius: 0; }
    .home-bank-body { gap:var(--space-2); padding:var(--space-3); }
    .home-bank-body h3 { font-size:var(--type-body-sm); }
    .home-card-meta { padding-top:var(--space-2); }

    .home-process { grid-template-columns: 1fr; border-top: 0; }
    .home-process article,
    .home-process article:first-child,
    .home-process article:nth-child(5) {
      min-height: 0;
      display: grid;
      grid-template-columns: 28px 72px minmax(0, 1fr);
      gap:var(--space-2);
      padding:var(--space-3) var(--space-0);
      border: 0;
      border-bottom: 1px solid var(--color-border);
    }
    .home-process b,
    .home-process span,
    .home-process p { margin:var(--space-0); }
    .home-process span { font-size:var(--type-caption); }
    .home-process p { font-size:var(--type-caption); }

    .home-actor-grid { grid-template-columns: 1fr; border-top: 1px solid var(--color-border); }
    .home-actor-grid article,
    .home-actor-grid article:nth-child(even),
    .home-actor-grid article:not(:nth-child(3n + 1)) {
      min-height: 0;
      padding:var(--space-4) var(--space-0) var(--space-4) var(--space-8);
      border: 0;
      border-bottom: 1px solid var(--color-border);
    }
    .home-actor-grid b { left: 0; top: 16px; }
    .home-actor-grid strong { font-size:var(--type-label); }

    .home-market-card { min-height: 230px; padding:var(--space-4); border-radius: 14px; }
    .home-market-card h3 { margin-top:var(--space-4); font-size:var(--type-body); }
    .home-stock { margin-top:var(--space-5); }
    .home-stock strong { font-size:var(--type-title-sm); }

    .home-trace-form-page { position: static; }

    .home-impact-grid,
    .home-trace-grid,
    .home-trace-page-grid,
    .home-seller-detail-grid { grid-template-columns: 1fr; gap:var(--space-8); }
    .home-impact-flow { padding-left:var(--space-4); }
    .home-trace-form { padding:var(--space-4); border-radius: 14px; }
    .home-trace-form > div { grid-template-columns: 1fr auto; }
    .home-trace-result { padding:var(--space-0); border-left: 0; }
    .home-trace-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-trace-help { padding:var(--space-4) var(--space-0) var(--space-0); border-left: 0; border-top: 1px solid var(--color-border); }

    .home-subhero { padding:var(--space-10) var(--space-0) var(--space-6); }
    .home-subhero-inner { grid-template-columns: 1fr; gap:var(--space-4); }
    .home-subhero h1 { font-size:var(--type-page-title); }
    .home-subhero p { font-size:var(--type-caption); }
    .home-subhero-count { min-width: 0; justify-self: start; }
    .home-subhero-count strong { font-size:var(--type-title-sm); }

    .home-seller-hero { padding:var(--space-6) var(--space-0) var(--space-8); }
    .home-back-link { margin-bottom:var(--space-4); }
    .home-seller-hero-card { grid-template-columns: 1fr; gap:var(--space-5); }
    .home-seller-cover { aspect-ratio: 16 / 9; border-radius: 14px; }
    .home-seller-info h1 { font-size:var(--type-page-title); }
    .home-seller-side { border-left: 0; padding-left:var(--space-0); border-top: 1px solid var(--color-border); padding-top:var(--space-4); }
    .home-info-panel.is-action { padding:var(--space-4); border-radius: 14px; }

    .home-empty-large { min-height: 220px; padding:var(--space-8) var(--space-0); }

    .home-cta { padding:var(--space-12) var(--space-0); }
    .home-cta-inner { grid-template-columns: 1fr; gap:var(--space-6); }
    .home-cta-inner > div:last-child { justify-content: flex-start; }
    .home-cta-inner .anva-button { flex: 1 1 auto; }

    .home-footer { padding:var(--space-10) var(--space-0) var(--space-6); }
    .home-footer-grid { grid-template-columns: 1fr 1fr; gap:var(--space-8) var(--space-4); }
    .home-footer-grid > div:first-child { grid-column: 1 / -1; }
    .home-footer-bottom { margin-top:var(--space-8); }
  }

  @media (max-width:390px) {
    .home-hero-actions { grid-template-columns: 1fr; }
    .home-stats-grid { grid-template-columns: 1fr; }
    .home-stats-grid article,
    .home-stats-grid article:nth-child(odd),
    .home-stats-grid article:nth-child(even) { padding:var(--space-4) var(--space-0); border-left: 0; }
    .home-trace-form > div { grid-template-columns: 1fr; }
    .home-trace-form button { width: 100%; }
    .home-footer-grid { grid-template-columns: 1fr; }
    .home-footer-grid > div:first-child { grid-column: auto; }
  }

  /* Motion preferences */
  @media (prefers-reduced-motion: reduce) {
    .home-bank-card,
    .home-action-card i { transition: none; }
  }
}


/* Stage 20.9.2 cumulative public-PWA contract markers retained by the Stage 21.3 owner. */
.home-install-button[hidden]{display:none}
@media(max-width:639px){
  .home-page{padding-bottom:calc(var(--space-16) + env(safe-area-inset-bottom))}
  .home-bottom-nav{display:grid}
}

  .home-stats-grid strong{font-size:var(--type-metric)}

  .home-stock strong{font-size:var(--type-metric)}

  .home-impact-flow strong{font-size:var(--type-metric)}

  .home-subhero-count strong{font-size:var(--type-metric)}

  .home-hero-copy h1{font-size:var(--type-display);line-height:var(--leading-display);letter-spacing:var(--tracking-display);max-inline-size:var(--measure-display)}
  .home-subhero h1,.home-seller-info h1{font-size:var(--type-page-title);line-height:var(--leading-page);letter-spacing:var(--tracking-display)}
  .home-section-head h2,.home-impact h2,.home-trace-band h2,.home-cta h2{font-size:var(--type-section-title);line-height:var(--leading-section);letter-spacing:var(--tracking-title)}
  .home-hero-lead{font-size:var(--type-body-lg);line-height:var(--leading-body);max-inline-size:var(--measure-body)}
  .home-section-head p,.home-impact p,.home-trace-band p,.home-subhero p{font-size:var(--type-body);line-height:var(--leading-body);max-inline-size:var(--measure-body)}


/* Tahap 21.4 — Premium public visual language.
 * All icon geometry, typography and spacing consume foundation tokens.
 */
[data-anva-public-icon]{
  width:var(--icon-md);
  height:var(--icon-md);
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:currentColor;
}
[data-anva-public-icon] svg{width:100%;height:100%}

.home-icon-tile,
.home-action-icon,
.home-process-icon{
  display:grid;
  place-items:center;
  color:var(--public-accent);
  background:var(--public-accent-soft);
  border:1px solid color-mix(in srgb,var(--public-accent) 16%,var(--color-border));
  box-shadow:none;
}
.home-icon-tile{
  width:var(--space-10);
  height:var(--space-10);
  border-radius:var(--radius-md);
}
.home-icon-tile [data-anva-public-icon]{width:var(--icon-sm);height:var(--icon-sm)}
.home-action-icon{
  width:var(--space-10);
  height:var(--space-10);
  border-radius:var(--radius-md);
}
.home-action-icon [data-anva-public-icon]{width:var(--icon-md);height:var(--icon-md)}
.home-process-icon{
  width:var(--space-8);
  height:var(--space-8);
  border-radius:var(--radius-sm);
}
.home-process-icon [data-anva-public-icon]{width:var(--icon-sm);height:var(--icon-sm)}

.home-market-kind,
.home-info-label,
.home-label-icon{
  display:inline-flex;
  align-items:center;
  gap:var(--space-2);
}
.home-market-kind [data-anva-public-icon],
.home-info-label [data-anva-public-icon],
.home-label-icon [data-anva-public-icon],
.home-kicker [data-anva-public-icon]{
  width:var(--icon-sm);
  height:var(--icon-sm);
}
.home-search-icon{
  width:var(--icon-md);
  height:var(--icon-md);
  color:var(--color-text-subtle);
}
.home-meta-icon{
  width:var(--icon-sm);
  height:var(--icon-sm);
  color:var(--color-text-subtle);
}
.home-card-meta{
  display:flex;
  align-items:center;
  gap:var(--space-2);
}
.home-empty-visual{
  min-width:var(--space-16);
  min-height:var(--space-16);
  display:grid;
  grid-template-columns:auto auto;
  place-items:center;
  align-items:center;
  gap:var(--space-2);
  padding:var(--space-4);
  border-radius:var(--radius-xl);
  color:var(--public-accent);
  background:linear-gradient(145deg,var(--public-accent-soft),var(--color-surface-subtle));
}
.home-empty-visual [data-anva-public-icon]{
  width:var(--icon-xl);
  height:var(--icon-xl);
}
.home-empty-visual strong{
  font-size:var(--type-card-title);
  letter-spacing:var(--tracking-title);
}

/* Visual journey: connector belongs to composition, nodes remain flat. */
.home-process article{position:relative}
.home-process article::after{
  content:"";
  position:absolute;
  top:calc(var(--space-4) + (var(--space-8) / 2));
  left:calc(50% + var(--space-5));
  right:calc(-50% + var(--space-5));
  height:1px;
  background:linear-gradient(90deg,var(--color-border),color-mix(in srgb,var(--public-accent) 34%,var(--color-border)));
}
.home-process article:last-child::after{display:none}
.home-process-icon{position:relative;z-index:1}

/* Meaningful section art direction without decorative image dependencies. */
.home-chain-card{
  background:
    radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--public-accent) 9%,transparent),transparent 34%),
    color-mix(in srgb,var(--color-surface) 92%,var(--public-accent-soft));
}
.home-market-card{
  position:relative;
  overflow:hidden;
}
.home-market-card::after{
  content:"";
  position:absolute;
  width:var(--space-20);
  height:var(--space-20);
  right:calc(var(--space-8) * -1);
  bottom:calc(var(--space-8) * -1);
  border:1px solid color-mix(in srgb,currentColor 10%,transparent);
  border-radius:50%;
  pointer-events:none;
}
.home-seller-cover::after{
  content:"";
  position:absolute;
  inset:auto var(--space-4) var(--space-4) auto;
  width:var(--space-12);
  height:var(--space-12);
  border:1px solid color-mix(in srgb,var(--public-accent) 18%,transparent);
  border-radius:50%;
}
.home-seller-cover{position:relative}

@media(max-width:959px){
  .home-process article::after{display:none}
}
@media(max-width:639px){
  .home-action-card{grid-template-columns:var(--space-10) minmax(0,1fr) auto}
  .home-process article,
  .home-process article:first-child,
  .home-process article:nth-child(5){
    grid-template-columns:var(--space-8) minmax(var(--space-16),auto) minmax(0,1fr);
  }
}


/* Historical public contracts — non-runtime, superseded by foundation semantic spacing:
.home-page{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
--public-gap-page: 88px
--public-gap-page: 64px
--public-gap-page: 46px
*/

.home-section-head h2{max-inline-size:var(--measure-section-title)}

/* Tahap 21.5 — Public button placement consumes canonical button component; only layout is owned here. */
.home-header-actions .anva-button,.home-cta .anva-button{position:relative;z-index:1;text-decoration:none}
.home-header-actions .anva-button-primary,.home-cta .anva-button-primary{color:var(--color-text-inverse)}
.home-header-actions .anva-button-secondary,.home-cta .anva-button-secondary{color:var(--color-text)}
.home-cta-inner>div:last-child{min-width:0;align-items:center}

/* Tahap 21.5 — Process geometry repair: one visual track, seven aligned semantic nodes. */
@media(min-width:960px){
  .home-process{position:relative;isolation:isolate;border-top:0;align-items:start}
  .home-process::before{content:"";position:absolute;z-index:0;top:calc((var(--space-8) / 2) + var(--space-4));left:calc(100% / 14);right:calc(100% / 14);height:1px;background:var(--color-border)}
  .home-process article,.home-process article:first-child{position:relative;z-index:1;display:grid;justify-items:center;text-align:center;align-content:start;padding:var(--space-4) var(--space-3) var(--space-0);border:0;min-width:0}
  .home-process article::after{display:none}
  .home-process-icon{width:var(--space-8);height:var(--space-8);background:var(--color-canvas);box-shadow:0 0 0 var(--space-2) var(--color-canvas)}
  .home-process span{margin-top:var(--space-4);font-size:var(--type-body);line-height:var(--leading-tight)}
  .home-process p{margin-top:var(--space-2);max-inline-size:var(--measure-process-note);font-size:var(--type-body-sm);line-height:var(--leading-compact)}
}