body.fluid-page { background: #f4f5f2; --panel-width: 248px; --panel-inset: 5%; --panel-gap: 32px; }
.fluid-page main { min-height: 990px; }
.fluid-page .chord-controls { right: var(--panel-inset); width: var(--panel-width); }
.fluid-page .chord-stage { right: calc(var(--panel-inset) + var(--panel-width) + var(--panel-gap)); overflow: hidden; }
.fluid-actions { display: flex; align-items: center; justify-content: space-between; padding-top: 12px; border-top: 1px solid var(--chord-line); }
.fluid-actions .toggle { margin: 0; }
.fluid-actions button { color: inherit; font: inherit; font-size: 11px; border: 1px solid var(--chord-line); background: transparent; padding: 7px 14px; cursor: pointer; }
.fluid-actions button:hover { background: #e1e7dc; }
.fluid-page.no-webgl .chord-controls { display: none; }
.fluid-page .webgl-fallback { z-index: 3; }
@media (min-width: 701px) and (max-width: 1000px) { body.fluid-page { --panel-width: 224px; --panel-inset: 24px; } }
@media (max-width: 700px) {
  body.fluid-page main { min-height: 1150px; }
  .fluid-page .chord-stage { right: 0; }
  .fluid-page .chord-controls { left: 24px; right: 24px; width: auto; }
}