/* Holon — shell chrome layered over app.css (loaded after it, so these win).
   Only app.css tokens are used here, so light and dark stay in lockstep.
   Scope: the topbar LINGO chip, the read-only demo note, the standards bar. */

/* The shell grows a third row so the standards bar sits below the content
   area — part of the layout, never fixed or floating over a view. */
.app{grid-template-rows:var(--bar) 1fr auto;
  grid-template-areas:"side bar" "side main" "side foot"}

/* ---- LINGO chip -----------------------------------------------------------
   The balance comes from the Stage D simulated ledger. That has to be legible
   without hovering, so the label rides inline instead of in a title. */
.lingo-chip .sim{font-weight:600;font-size:.68rem;letter-spacing:.02em;
  opacity:.68;white-space:nowrap}
/* app.css sets display:inline-flex on the chip, which outranks the UA rule for
   [hidden] — without this the hidden attribute is inert and the chip leaks onto
   the marketplace and Verify screens. */
.lingo-chip[hidden]{display:none}

/* ---- sidebar, public read-only deployment --------------------------------
   No local Pod to configure and no wallet to connect, so the demo says what it
   is in one line rather than showing shell commands nobody can run. */
.demo-note{font-size:.72rem;line-height:1.5;color:var(--on-surface-variant);
  background:var(--surface-1);border:1px solid var(--outline-variant);
  border-radius:14px;padding:11px 12px}

/* ---- standards bar --------------------------------------------------------
   Five standards this build actually runs; each one links into Verify, where
   the on-chain evidence for it lives. */
.stdbar{grid-area:foot;display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px;
  padding:7px 18px;background:var(--surface);
  border-top:1px solid var(--outline-variant);z-index:4}
.stdbar .std{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;
  border-radius:999px;text-decoration:none;white-space:nowrap;
  font-size:.72rem;line-height:1.2;color:var(--on-surface-variant);
  transition:.18s var(--ease)}
.stdbar .std:hover{background:color-mix(in srgb,var(--on-surface) 7%,transparent);
  color:var(--on-surface)}
.stdbar .std:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.stdbar .std svg{width:14px;height:14px;flex:none;opacity:.7}
.stdbar .std:hover svg{opacity:1}
.stdbar .std b{font-weight:700;letter-spacing:-.01em;color:var(--on-surface)}
.stdbar .std .sep{opacity:.4}

@media (max-width:1180px){
  .stdbar{padding:6px 12px}
  .stdbar .std{padding:4px 8px;font-size:.68rem;gap:6px}
}

/* ---- marketplace mode -----------------------------------------------------
   The public build is judged as an agent marketplace: the topbar names it on
   one line, with the product credit beside — not a personal greeting. */
[data-mode=marketplace] .greet{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
[data-mode=marketplace] .greet .greet-sub{margin-top:0}

/* Escape hatch out of marketplace mode, local instances only. */
.mode-back{display:flex;align-items:center;gap:8px;width:100%;padding:9px 12px;
  border-radius:12px;font-size:.8rem;font-weight:600;text-align:left;
  color:var(--on-surface-variant);border:1px solid var(--outline-variant);
  background:var(--surface-1);transition:.18s var(--ease)}
.mode-back:hover{background:var(--surface-2);color:var(--on-surface)}
.mode-back:focus-visible{outline:2px solid var(--primary);outline-offset:2px}