/* ZOLVEX M7 — shared visual surface layer. Layout-neutral by design. */
:root{
  --zvx-surface:rgba(7,12,11,.88);
  --zvx-surface-strong:rgba(8,14,13,.95);
  --zvx-surface-soft:rgba(9,15,14,.72);
  --zvx-line:rgba(212,235,228,.105);
  --zvx-line-strong:rgba(212,235,228,.175);
  --zvx-text:#eaf3f0;
  --zvx-muted:#8d9c98;
  --zvx-accent:#47d55d;
}
body[data-zvx-visual="m6-ambient"]::selection{background:rgba(71,213,93,.23);color:#f4fffb}
body[data-zvx-visual="m6-ambient"] .hero{
  background:linear-gradient(180deg,rgba(5,9,8,.52),rgba(5,9,8,.18));
  border-bottom-color:var(--zvx-line)!important;
}
body[data-zvx-visual="m6-ambient"] :is(.panel,.card,.box,.utility-card,.session-card,.clock-card,.product,.tool-form,.tool-results,.callout,.channel,.method-box,.firm-card,.program-block,.size-card,.search-shell,.notes-grid,.table-wrap){
  border-color:var(--zvx-line)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.075);
}
body[data-zvx-visual="m6-ambient"] :is(.panel,.card,.box,.utility-card,.session-card,.clock-card,.product,.channel,.method-box,.size-card){
  background-color:var(--zvx-surface)!important;
}
body[data-zvx-visual="m6-ambient"] :is(.tool-form,.tool-results,.callout,.program-block,.search-shell,.notes-grid,.table-wrap){
  background-color:var(--zvx-surface-soft)!important;
}
body[data-zvx-visual="m6-ambient"] :is(.panel,.card,.utility-card,.session-card,.product,.channel,.method-box,.size-card){
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
body[data-zvx-visual="m6-ambient"] :is(.lead,.section-lead,.card p,.panel p,.utility-card p,.session-card p,.channel p){
  color:var(--zvx-muted);
}
body[data-zvx-visual="m6-ambient"] .btn{
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
body[data-zvx-visual="m6-ambient"] .btn:hover{
  border-color:rgba(71,213,93,.34)!important;
  background:rgba(71,213,93,.055)!important;
}
body[data-zvx-visual="m6-ambient"] :focus-visible{
  outline:2px solid var(--zvx-accent)!important;
  outline-offset:3px!important;
}
body[data-zvx-area="propfirms"] .firm-card,
body[data-zvx-area="tools"] :is(.utility-card,.tool-form,.tool-results),
body[data-zvx-area="research"] :is(.card,.panel,.search-shell,.notes-grid),
body[data-zvx-area="stream"] :is(.panel,.card){
  background-image:linear-gradient(145deg,rgba(71,213,93,.014),transparent 36%)!important;
}
@media(prefers-reduced-motion:reduce){
  body[data-zvx-visual="m6-ambient"] .btn{transition:none!important;transform:none!important}
}


/* ZOLVEX M18I — site-wide content-surface readability and hierarchy.
   Goal: text-containing surfaces read as deliberate information panels without
   hiding the living background or changing page geometry. */
:root{
  --zvx-surface:rgba(7,11,11,.94);
  --zvx-surface-strong:rgba(8,12,12,.975);
  --zvx-surface-soft:rgba(8,13,12,.88);
  --zvx-line:rgba(212,235,228,.155);
  --zvx-line-strong:rgba(212,235,228,.235);
  --zvx-muted:#a8b6b2;
  --zvx-muted-strong:#bec9c6;
  --zvx-surface-accent:rgba(71,213,93,.26);
  --zvx-surface-red:rgba(180,24,35,.24);
  --zvx-surface-amber:rgba(215,164,70,.24);
}

/* Shared information surfaces: slightly stronger body, clearer edge and depth. */
body[data-zvx-visual="m6-ambient"] :is(
  .panel,.card,.box,.utility-card,.session-card,.clock-card,.product,.tool-form,.tool-results,
  .callout,.channel,.method-box,.firm-card,.program-block,.size-card,.search-shell,.notes-grid,.table-wrap,
  .z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,
  .m13-deep,.m13-home-card,.m13-stream-card,.m13-compare-shell
){
  border-color:var(--zvx-line)!important;
  box-shadow:
    0 18px 52px rgba(0,0,0,.12),
    inset 0 1px 0 rgba(255,255,255,.018);
}

body[data-zvx-visual="m6-ambient"] :is(
  .panel,.card,.utility-card,.session-card,.clock-card,.product,.channel,.method-box,.firm-card,.size-card,
  .z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,
  .m13-deep,.m13-home-card,.m13-stream-card
){
  background-color:var(--zvx-surface)!important;
  background-image:
    linear-gradient(145deg,rgba(255,255,255,.018),transparent 34%),
    linear-gradient(180deg,rgba(71,213,93,.010),transparent 46%)!important;
}

body[data-zvx-visual="m6-ambient"] :is(
  .tool-form,.tool-results,.program-block,.search-shell,.notes-grid,.table-wrap,.m13-compare-shell
){
  background-color:var(--zvx-surface-soft)!important;
}

/* Stronger typographic hierarchy inside text surfaces. */
body[data-zvx-visual="m6-ambient"] :is(
  .panel,.card,.utility-card,.session-card,.product,.channel,.method-box,.firm-card,.size-card,
  .z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,
  .m13-deep,.m13-home-card,.m13-stream-card
) :is(h2,h3,strong){
  color:#edf5f2;
}

body[data-zvx-visual="m6-ambient"] :is(
  .panel,.card,.utility-card,.session-card,.product,.channel,.method-box,.firm-card,.size-card,
  .z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,
  .m13-deep,.m13-home-card,.m13-stream-card
) :is(p,li){
  color:var(--zvx-muted)!important;
}

body[data-zvx-visual="m6-ambient"] :is(
  .z2-meta,.card-code,.utility-card .code,.z2-path-num,.z2-detail .code,
  .m13-zvx-label,.m13-live-meta,.m13-compare-path
){
  color:#8f9f9a;
}

/* A quiet left-edge cue makes the reading direction obvious without turning every card neon. */
body[data-zvx-visual="m6-ambient"] :is(
  .z2-path,.z2-detail,.z2-stream-card,.z2-teaser,.utility-card,.card,.panel,.m13-home-card,.m13-stream-card
){
  position:relative;
}
body[data-zvx-visual="m6-ambient"] :is(
  .z2-path,.z2-detail,.z2-stream-card,.z2-teaser,.utility-card,.card,.panel,.m13-home-card,.m13-stream-card
)::after{
  content:"";
  position:absolute;
  left:-1px;
  top:18px;
  bottom:18px;
  width:2px;
  background:linear-gradient(180deg,transparent,var(--zvx-surface-accent) 22%,rgba(71,213,93,.08) 78%,transparent);
  pointer-events:none;
  opacity:.72;
}

/* Semantic market/state surfaces become more self-explanatory at a glance. */
body[data-zvx-visual="m6-ambient"] .z2-market:has(.z2-chip.live){
  border-color:rgba(71,213,93,.24)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.12),inset 0 2px 0 rgba(71,213,93,.22)!important;
}
body[data-zvx-visual="m6-ambient"] .z2-market:has(.z2-chip.building){
  border-color:rgba(215,164,70,.22)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.12),inset 0 2px 0 var(--zvx-surface-amber)!important;
}
body[data-zvx-visual="m6-ambient"] .z2-market:has(.z2-chip.research){
  border-color:rgba(208,57,62,.20)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.12),inset 0 2px 0 rgba(208,57,62,.20)!important;
}

/* Existing warning/error callouts keep their semantic color but get a more readable body. */
body[data-zvx-visual="m6-ambient"] .callout{
  background:linear-gradient(90deg,rgba(71,213,93,.045),rgba(7,11,11,.90) 24%,rgba(7,11,11,.90))!important;
  color:var(--zvx-muted-strong)!important;
}
body[data-zvx-visual="m6-ambient"] .callout.warn{
  background:linear-gradient(90deg,rgba(215,164,70,.055),rgba(7,11,11,.90) 24%,rgba(7,11,11,.90))!important;
}
body[data-zvx-visual="m6-ambient"] .callout.red{
  background:linear-gradient(90deg,rgba(180,24,35,.060),rgba(7,11,11,.90) 24%,rgba(7,11,11,.90))!important;
}

/* Detail/flow grids should feel like connected information modules, not flat dark cells. */
body[data-zvx-visual="m6-ambient"] :is(.z2-detail-grid,.z2-paths,.z2-flow,.tool-cards,.session-grid,.clock-grid,.two,.grid){
  background-color:rgba(212,235,228,.12)!important;
  border-color:var(--zvx-line)!important;
}

/* Preserve motion/performance: no new animation or expensive blur introduced. */
@media(max-width:900px){
  body[data-zvx-visual="m6-ambient"] :is(
    .z2-path,.z2-detail,.z2-stream-card,.z2-teaser,.utility-card,.card,.panel,.m13-home-card,.m13-stream-card
  )::after{top:14px;bottom:14px}
}
