/* Le toucher de l'éditeur (assets/feel.js) : enfoncement court, retour en ressort, titre large qui se resserre. */
.ed { --spring: cubic-bezier(.34, 1.56, .64, 1); --collapse: 0; }

/* le retour : un ressort léger (dépasse de 2 % puis revient), comme un bouton d'iOS */
.ed .released { transition: transform .46s var(--spring), background-color .3s ease, box-shadow .3s ease !important; }
/* l'enfoncement : presque immédiat */
.ed .pressing { transition: transform .08s ease-out, background-color .08s ease-out, box-shadow .08s ease-out !important; transform: scale(.955); }
.ed .e-cta.pressing { transform: scale(.975); }
.ed .e-row.pressing { transform: none; background: #F6EFE4; }
.ed .e-row.pressing .e-thumb { transform: scale(.92); }
.ed .e-key.pressing { transform: scale(.93); background: var(--soft); }
.ed .e-tab.pressing { transform: scale(.9); }
.ed .e-theme.pressing { transform: scale(.965); }
/* sans le JS (souris d'ordinateur), les :active d'origine restent */

/* grand titre : il se resserre et l'étiquette au-dessus s'efface quand la liste défile */
.ed .e-title { transform-origin: 0 100%; transform: scale(calc(1 - .2 * var(--collapse))); will-change: transform; }
.ed .e-eyebrow { opacity: calc(1 - var(--collapse)); transform: translateY(calc(6px * var(--collapse))); }
.ed .e-top { padding-bottom: calc(12px - 4px * var(--collapse)); }

/* champs : l'anneau de focus arrive en douceur, le curseur est rouge ketchup */
.ed .e-input, .ed .e-search { transition: box-shadow .22s ease, background-color .22s ease; }
.ed input, .ed textarea { caret-color: var(--red); }

/* le « c'est parti » du message en bas : une coche qui se trace */
.e-ok { flex: none; width: 26px; height: 26px; margin-left: -4px; border-radius: 50%; background: var(--ok, #2E8452); display: grid; place-items: center; }
.e-ok svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.e-ok path { stroke-dasharray: 20; stroke-dashoffset: 20; animation: e-ok-draw .42s .12s cubic-bezier(.65, 0, .35, 1) forwards; }
@keyframes e-ok-draw { to { stroke-dashoffset: 0; } }

@media (prefers-reduced-motion: reduce) {
  .ed .e-title, .ed .e-eyebrow { transform: none; }
  .e-ok path { animation: none; stroke-dashoffset: 0; }
}

/* carte « Mon menu sur l'écran d'accueil » (assets/install.js) */
.e-install { position: absolute; z-index: 9; left: 12px; right: 12px; bottom: calc(var(--tab-h, 72px) + 10px); display: grid; grid-template-columns: 48px 1fr; gap: 12px 14px;
  padding: 14px; border-radius: 20px; background: var(--card, #fff); color: var(--ink, #1B1612); box-shadow: 0 0 0 1px var(--line, #ECE4D8), 0 18px 40px -12px rgba(22, 16, 12, .35);
  opacity: 0; transform: translate3d(0, 24px, 0) scale(.97); transition: opacity .25s ease-out, transform .5s var(--spring); }
.e-install.on { opacity: 1; transform: none; }
.e-install-ic { width: 48px; height: 48px; border-radius: 11px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .06); }
.e-install-t b { display: block; font-size: 15.5px; font-weight: 750; line-height: 1.25; }
.e-install-t span { display: block; margin-top: 4px; font-size: 14px; line-height: 1.45; color: var(--ink-2, #6A6057); }
.e-install .k { display: inline-grid; place-items: center; width: 24px; height: 24px; margin: 0 1px; vertical-align: -6px; border-radius: 6px; background: var(--soft, #F3EDE4); }
.e-install .k svg { width: 16px; height: 16px; fill: none; stroke: #0A64D8; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.e-install-b { grid-column: 1 / -1; display: flex; gap: 8px; justify-content: flex-end; }
.e-install-b button { height: 44px; padding: 0 18px; border-radius: 12px; font-size: 15px; font-weight: 750; }
.e-install-go { background: var(--red, #C8261C); color: #fff; }
.e-install-no { background: var(--soft, #F3EDE4); color: var(--ink, #1B1612); }

/* la pile de cartes d'iOS : quand une fiche monte, l'écran derrière recule, s'arrondit et s'assombrit */
.ed { transition: background-color .45s ease; }
.e-stage { flex: 1; min-height: 0; display: flex; flex-direction: column; position: relative; background: var(--bg);
  transform-origin: 50% 0; transition: transform .55s cubic-bezier(.32, .72, 0, 1), border-radius .55s cubic-bezier(.32, .72, 0, 1); will-change: transform; }
.ed.stack { background: #0E0B09; }
.ed.stack .e-stage { transform: translate3d(0, calc(var(--st) + 10px), 0) scale(.92); border-radius: 18px; overflow: hidden; }
.ed.in-phone.stack .e-stage { border-radius: 26px; }
@media (prefers-reduced-motion: reduce) { .ed.stack .e-stage { transform: none; border-radius: 0; } }
.ed.stack .e-install { opacity: 0; transform: translate3d(0, 24px, 0) scale(.97); pointer-events: none; }