/* Rising v8 title — on the canonical front-tier swell (ensemble-rising-v8.js). Every value comes from the unit system
   in docs/DESIGN-DETAIL-STANDARD.md (8u multiples; lattice R = 48, row step 28.8):
   - left edge on the page gutter (the wordmark box at --edge, the same line as the header logo and section heads)
   - see the rule block below for the type's values and the measured clearances (measure-hero-title.mjs)
   Desktop (wide plan) only; tablet and phone keep their own blocks. Loaded after ensemble-rising-v6.css. */
@container (min-width: 1000px) {
  /* One column width W = max(316u, 268px) for the wordmark AND the actions row, so their right edges are flush at every
     width (gate 50fd3f76: a ragged 18px read as an accident). 268px is the narrowest row the px-minimum action labels
     fit. Top 212u: the mark's swash keeps 32u from the crest row's lowest arcs (180.4). Then 24u → lead, 24u → actions;
     ≥ 1280 the actions end 32u+ above the zone's front crest (row 9). The "8" keeps 48u+ from the first figure (320u left it 47px). */
  .ensemble-stage.ik .ens-stage-inner {
    --title-w: max(calc(316 * var(--u)), 268px);
  }

  .ensemble-stage.ik .wm.s55-mark {
    top: calc(212 * var(--u));
    width: var(--title-w);
  }

  /* the lead follows the wordmark's actual height (W · 503 / 1933) plus 24u */
  .ensemble-stage.ik .copy {
    --cy: 313;
    top: calc(212 * var(--u) + var(--title-w) * 503 / 1933 + 24 * var(--u));
  }

  .ensemble-stage.ik .lead {
    margin-bottom: calc(24 * var(--u));
  }

  .ensemble-stage.ik .cta {
    flex-wrap: nowrap;
    justify-content: space-between;
    width: var(--title-w);
    gap: calc(12 * var(--u)) 12px;
  }
}

/* the swell's body: its own lifted tone between the night (#0d0724) and the violet tide (#250d5a), so it reads as a
   raised wave plateau carrying the title; its crest is drawn with the tide's own crest lines (the tide cresting over the
   title). Scene layer, behind the cast; the front tier (z 7) still covers the cast's feet. */
.ensemble-stage.ik .ik-waves .ik-swell-body .sg-fill {
  fill: #170d3a;
}

.ensemble-stage.ik .ik-waves .ik-swell-crest .sg-arc--outer {
  stroke: #8c6be0;
  stroke-width: 1.5;
}

.ensemble-stage.ik .ik-waves .ik-swell-crest .sg-arc--mid {
  stroke: #6e50c6;
  stroke-width: 1.2;
}

.ensemble-stage.ik .ik-waves .ik-swell-crest .sg-arc--inner {
  stroke: #5a3fb0;
}

/* one dark for the swell, the front tier and the LIVE band that continues it: a second near-identical dark showed a
   scalloped seam under the first figure's feet */
.ensemble-stage.ik .ik-waves .ik-front-tier .sg-fill {
  fill: #170d3a;
}

body.ik-plane:has(.ensemble-stage.ik) #main > .edition-live-wrap::before {
  background: #170d3a;
}