/* ct-core-strip.css — Hortus Soni Core landing page (circle picker)
   Nothing is removed here: this page is navigation (Thirds / Infinity /
   Time). Linked only so FIX (b) (pressed buttons: brightness/shadow only)
   is consistent across the app. */
/* ---------------------------------------------------------------
   FIX (b) PRESSED-BUTTON JUMP
   The shared rule ":is(#app, #root, body) button:not(:disabled):active { transform:
   translateY(1px) scale(0.98) }" REPLACED each button's own transform.
   Circle pitch buttons are centred with transform:translate(-50%,-50%),
   so pressing one dropped that centring and the letter jumped ~half a
   button right+down (the ~45 degree jump). ct-core-strip.js strips every
   transform/translate/rotate/scale declaration out of :active rules at
   runtime; the rules below make the pressed feedback brightness/shadow
   only and restore the centring transform as a CSS fallback.
   --------------------------------------------------------------- */
:is(#app, #root, body) button:not(:disabled):active,
:is(#app, #root, body) [role="button"]:not([aria-disabled="true"]):active,
:is(#app, #root, body) [data-mode]:active {
  translate: none !important;
  rotate: none !important;
  scale: none !important;
  filter: brightness(0.86) !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,0.18), 0 0 10px rgba(255,255,255,0.12) !important;
  transition: filter 70ms, box-shadow 70ms !important;
}
/* Buttons whose resting transform is the centring translate keep it. */
:is(#app, #root, body) .circle-note:active, :is(#app, #root, body) .circle-third:active,
:is(#app, #root, body) .source-circle > .tone:active, :is(#app, #root, body) .sculpt-circle-stage .tone:active,

:is(#app, #root, body) .suite-stage-2 [data-ct-generate-pool]:active,
:is(#app, #root, body) .circle-scale-name:active {
  transform: translate(-50%, -50%) !important;
}

/* BUILD 190: opening screen note names — dark and solid (were pale grey). */
.ct-fifths-names em b { color: #141418 !important; }

/* BUILD 190 (George, revised: 1.5 letter heights): opening screen only — lift the grey ring and the 12
   note names UP by 1.5 letter heights (Georgia cap height = .69 x the letter
   font size; 1.5 x .69 = 1.035 x font size). Deliberately NOT
   done on .ct-note-lights itself: its transform is owned by the !important
   ctOrbitHeart heartbeat and its geometry is shared (copied) with the Thirds /
   Infinity / Time curtain wheels. Only the ring (::before) and the names layer
   move, via top/bottom; the colour flashes, fish/infinity/heart, title and
   PLAY/SKIP stay exactly where they were. This file loads only on the landing
   page, so no other screen is affected. */
.ct-curtain[aria-label="Hortus Soni opening"] > .ct-note-lights:not(.ct-heart-beats) {
  --ct-letter-lift: calc(clamp(14px, 1.65vw, 21px) * 1.035);
}
.ct-curtain[aria-label="Hortus Soni opening"] > .ct-note-lights:not(.ct-heart-beats)::before {
  top: calc(9% - var(--ct-letter-lift)) !important;
  bottom: calc(9% + var(--ct-letter-lift)) !important;
}
.ct-curtain[aria-label="Hortus Soni opening"] > .ct-note-lights:not(.ct-heart-beats) > .ct-fifths-names {
  top: calc(0px - var(--ct-letter-lift)) !important;
  bottom: var(--ct-letter-lift) !important;
}
@media (max-width: 700px) {
  .ct-curtain[aria-label="Hortus Soni opening"] > .ct-note-lights:not(.ct-heart-beats) {
    --ct-letter-lift: calc(12px * 1.035);
  }
}