.app-loading-screen {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 24px;
  color: #f5d994;
  text-align: center;
  background:
    radial-gradient(circle at 50% 42%, rgba(167, 111, 28, 0.2), transparent 31%),
    linear-gradient(145deg, #08120f 0%, #11130e 52%, #1b1209 100%);
  opacity: 1;
  visibility: visible;
  transition: opacity 0.55s ease, visibility 0s linear 0s;
}


.app-loading-screen::before {
  content: none;
}

.app-loading-content {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 10px;
  width: min(520px, 88vw);
}

.app-loading-content strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 3vw, 2.35rem);
  letter-spacing: 0.055em;
  text-shadow: 0 2px 14px rgba(214, 157, 51, 0.3);
}

.app-loading-content p {
  margin: 0;
  color: rgba(255, 244, 211, 0.82);
  font-size: clamp(0.88rem, 1.5vw, 1.05rem);
  letter-spacing: 0.025em;
}
.app-loading-content .app-loading-patience {
  margin-top: 4px;
  color: rgba(255, 244, 211, 0.62);
  font-size: clamp(0.76rem, 1.2vw, 0.92rem);
  font-style: italic;
}

.app-loading-orbit {
  position: relative;
  width: 106px;
  height: 106px;
  margin-bottom: 8px;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 0 28px rgba(189, 126, 25, 0.17);
  animation: btm-loading-pulse 2.2s ease-in-out infinite;
}

.app-loading-compass,
.app-loading-compass::before,
.app-loading-compass::after {
  position: absolute;
  inset: 50%;
  display: block;
  content: "";
  width: 52px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #d9a845, transparent);
  transform: translate(-50%, -50%);
  transform-origin: center;
}

.app-loading-compass::before {
  transform: translate(-50%, -50%) rotate(60deg);
}

.app-loading-compass::after {
  transform: translate(-50%, -50%) rotate(-60deg);
}

.app-loading-plane {
  position: absolute;
  inset: -8px;
  color: #ffe6a8;
  font-size: 23px;
  line-height: 1;
  text-align: left;
  text-shadow: 0 0 12px rgba(255, 190, 68, 0.75);
  animation: btm-loading-orbit 2.6s linear infinite;
}

.app-loading-dots {
  display: flex;
  gap: 7px;
  min-height: 8px;
  margin-top: 8px;
}

.app-loading-dots i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d8a441;
  box-shadow: 0 0 8px rgba(220, 164, 62, 0.45);
  animation: btm-loading-dot 1.15s ease-in-out infinite;
}

.app-loading-dots i:nth-child(2) { animation-delay: 0.16s; }
.app-loading-dots i:nth-child(3) { animation-delay: 0.32s; }

html:not(.app-ready) .app-shell {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

html.app-ready .app-shell {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.38s ease;
}

html.app-ready .app-loading-screen {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.55s ease, visibility 0s linear 0.55s;
}

@keyframes btm-loading-orbit {
  to { transform: rotate(360deg); }
}

@keyframes btm-loading-pulse {
  0%, 100% { transform: scale(0.96); opacity: 0.76; }
  50% { transform: scale(1.04); opacity: 1; }
}

@keyframes btm-loading-dot {
  0%, 70%, 100% { transform: translateY(0); opacity: 0.35; }
  35% { transform: translateY(-5px); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .app-loading-orbit,
  .app-loading-plane,
  .app-loading-dots i {
    animation: none;
  }
}
:root {
  --gold: #d4af37;
  --gold-soft: #fff1b8;
  --active-design-width: min(100vw, 177.7778vh);
  --active-design-height: min(100vh, 56.25vw);
}

.app-shell,
.app-shell * {
  cursor: var(--app-cursor, default) !important;
}

.app-shell input:is([type="text"], [type="number"], [type="search"], [type="email"], [type="url"], [type="password"]),
.app-shell textarea,
.app-shell [contenteditable="true"] {
  cursor: text !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.fullscreen-toggle {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0.75rem 0;
}

.fullscreen-toggle input {
  width: 1.1rem;
  height: 1.1rem;
}

.public-fullscreen-button {
  position: static;
  z-index: 1;
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(255, 226, 164, 0.68);
  border-radius: 50%;
  padding: 9px;
  background: rgba(3, 8, 10, 0.58);
  color: var(--gold-soft);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.38);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  cursor: pointer;
}

.public-utility-controls {
  position: fixed;
  z-index: 120;
  right: max(18px, calc((100vw - var(--active-design-width)) / 2 + 18px));
  bottom: max(18px, calc((100vh - var(--active-design-height)) / 2 + 18px));
  display: inline-flex;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}

.public-utility-controls > * {
  pointer-events: auto;
}

.public-fullscreen-button:hover,
.public-fullscreen-button:focus-visible {
  border-color: #fff1bd;
  background: rgba(126, 82, 24, 0.72);
  color: #fff;
  outline: none;
}

.public-fullscreen-button svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fullscreen-exit-icon,
html.is-fullscreen .fullscreen-enter-icon {
  display: none;
}

html.is-fullscreen .fullscreen-exit-icon {
  display: inline;
}

.public-fullscreen-button[hidden],
.app-shell[data-view="admin"] .public-fullscreen-button {
  display: none !important;
}

.public-page-help-button {
  position: static;
  z-index: 1;
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(255, 226, 164, 0.68);
  border-radius: 50%;
  padding: 0;
  background: rgba(3, 8, 10, 0.58);
  color: var(--gold-soft);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.38);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.public-page-help-button > span {
  display: block;
  transform: translateY(-0.02em);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  font-style: italic;
  font-weight: 800;
  line-height: 1;
}

.public-page-help-button:hover,
.public-page-help-button:focus-visible {
  border-color: #fff1bd;
  background: rgba(126, 82, 24, 0.72);
  color: #fff;
  outline: none;
}

.public-page-help-button[hidden],
.app-shell[data-view="admin"] .public-page-help-button {
  display: none !important;
}

.public-page-help-dialog {
  width: min(700px, calc(100vw - 28px));
  max-width: none;
  max-height: min(86vh, 820px);
  overflow: visible;
  border: 1px solid rgba(231, 185, 92, 0.78);
  border-radius: 18px;
  padding: 0;
  background: transparent;
  color: #35200e;
  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.72), 0 0 35px rgba(209, 145, 43, 0.2);
}

.public-page-help-dialog::backdrop {
  background: rgba(0, 0, 0, 0.76);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.public-page-help-sheet {
  position: relative;
  max-height: min(86vh, 820px);
  overflow: auto;
  border-radius: 17px;
  padding: clamp(26px, 5vw, 46px);
  background:
    radial-gradient(circle at 88% 5%, rgba(195, 129, 38, 0.2), transparent 30%),
    linear-gradient(145deg, rgba(255, 244, 205, 0.98), rgba(226, 194, 135, 0.98));
  box-shadow: inset 0 0 0 5px rgba(94, 52, 16, 0.08);
}

.public-page-help-close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(91, 50, 17, 0.48);
  border-radius: 50%;
  padding: 0 0 2px;
  background: rgba(80, 43, 14, 0.1);
  color: #4d2a10;
  font-size: 1.65rem;
  line-height: 1;
}

.public-page-help-close:hover,
.public-page-help-close:focus-visible {
  background: #4d2a10;
  color: #fff2c4;
  outline: 3px solid rgba(164, 104, 29, 0.25);
}

.public-page-help-kicker {
  margin: 0 42px 8px 0;
  color: #8b551e;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.public-page-help-dialog h2 {
  margin: 0 42px 18px 0;
  color: #3b210d;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.7rem, 4vw, 2.7rem);
  line-height: 1.05;
}

.public-page-help-body {
  color: #4b321d;
  font-size: clamp(0.98rem, 1.7vw, 1.12rem);
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.page-help-editor {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(280px, 1.3fr);
  gap: 14px;
}

.page-help-editor label {
  display: grid;
  gap: 6px;
  color: #29433e;
  font-weight: 800;
}

.page-help-editor .page-help-body-field {
  grid-column: 1 / -1;
}

.page-help-editor select,
.page-help-editor input,
.page-help-editor textarea {
  width: 100%;
  border: 1px solid rgba(24, 60, 53, 0.3);
  border-radius: 8px;
  padding: 0.65rem 0.75rem;
  background: #fffdf7;
  color: #173f38;
}

.page-help-editor textarea {
  min-height: 210px;
  resize: vertical;
  line-height: 1.5;
}

.page-help-editor-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page-help-editor-status {
  grid-column: 1 / -1;
  min-height: 1.4em;
  margin: 0;
  color: #47645e;
}

@media (max-width: 640px) {
  .public-utility-controls { gap: 6px; }
  .public-page-help-button,
  .public-fullscreen-button,
  .page-audio-player button { width: 40px; height: 40px; flex-basis: 40px; }
  .public-page-help-sheet { padding: 28px 20px 24px; }
  .page-help-editor { grid-template-columns: 1fr; }
  .page-help-editor .page-help-body-field,
  .page-help-editor-actions,
  .page-help-editor-status { grid-column: 1; }
}

html,
body {
  overflow: hidden;
  background: #03070c;
}

.app-shell {
  display: block;
  width: 100vw;
  height: 100vh;
  padding: 0;
  background: #03070c;
}

.app-shell::before,
.ambient,
.brand-mark,
.brand-copy,
.dashboard-strip,
.side-nav,
.ticket {
  display: none !important;
}

.topbar {
  position: fixed;
  z-index: 30;
  left: 50%;
  top: 50%;
  display: block;
  width: var(--active-design-width);
  height: var(--active-design-height);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.official-stamp {
  position: absolute;
  top: 3.5%;
  right: 6.1%;
  width: 13.5%;
  aspect-ratio: 1;
  border: 0;
  background: transparent;
  opacity: 0;
  pointer-events: auto;
}

/* The hidden settings hotspot must not cover controls once settings are open. */
.app-shell[data-view="admin"] .official-stamp {
  pointer-events: none;
}

.app-shell[data-view="lettre-2036"] .official-stamp {
  pointer-events: none;
}

/* Capsule 2036: the form becomes a physical letter rather than a web panel. */
#lettre-2036 .capsule-form {
  overflow: visible;
  border: 0;
  border-radius: 6px;
  padding: 0;
  background: transparent;
  color: #342113;
  box-shadow: none;
  backdrop-filter: none;
  perspective: 1200px;
}

.capsule-envelope-cover,
.capsule-letter-sheet {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
}

.capsule-envelope-cover {
  z-index: 8;
  display: grid;
  place-content: center;
  gap: 10px;
  overflow: hidden;
  border: 1px solid #9a6735;
  border-radius: 6px;
  padding: 9% 11%;
  background: #d8b77e;
  color: #402819;
  box-shadow: 0 24px 55px rgba(0, 0, 0, 0.55), inset 0 0 45px rgba(89, 47, 17, 0.18);
  font-family: Georgia, "Times New Roman", serif;
  text-align: center;
  cursor: pointer;
  transform-origin: 50% 100%;
  transition: opacity 500ms ease, transform 700ms cubic-bezier(.2, .75, .2, 1);
}

.capsule-envelope-cover::before,
.capsule-envelope-cover::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
}

.capsule-envelope-cover::before {
  background: rgba(248, 222, 172, 0.52);
  clip-path: polygon(0 0, 50% 54%, 100% 0);
}

.capsule-envelope-cover::after {
  border: 1px solid rgba(90, 50, 20, 0.24);
  background: rgba(169, 117, 63, 0.18);
  clip-path: polygon(0 100%, 0 34%, 50% 68%, 100% 34%, 100% 100%);
}

.capsule-envelope-cover strong {
  font-size: 34px;
  font-weight: 500;
}

.capsule-envelope-cover > span:not(.capsule-envelope-postmark) {
  font-size: 17px;
  font-style: italic;
}

.capsule-envelope-cover small {
  margin-top: 14px;
  font-size: 13px;
}

.capsule-envelope-postmark {
  position: absolute;
  right: 4%;
  top: 5%;
  border: 2px solid rgba(108, 48, 31, 0.66);
  border-radius: 50%;
  padding: 14px 9px;
  color: #713d2b;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  transform: rotate(9deg);
}

.capsule-cover-seal {
  position: absolute;
  left: 50%;
  top: 70%;
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 4px double rgba(255, 205, 139, 0.55);
  border-radius: 50%;
  background: #8d261c;
  color: #e8b26c;
  box-shadow: 0 7px 12px rgba(60, 20, 12, 0.45);
  font: 700 26px Georgia, serif;
  transform: translate(-50%, -50%);
}

.capsule-letter-sheet {
  z-index: 7;
  display: grid;
  grid-template-rows: auto auto auto minmax(150px, 1fr) auto auto auto;
  align-content: stretch;
  gap: 8px;
  overflow: auto;
  border: 1px solid rgba(103, 61, 25, 0.68);
  border-radius: 3px;
  padding: 18px 22px;
  background-color: #e7c98f;
  background-image:
    linear-gradient(rgba(118, 74, 33, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(118, 74, 33, 0.025) 1px, transparent 1px);
  background-size: 27px 27px;
  color: #342113;
  box-shadow: 0 24px 55px rgba(0, 0, 0, 0.5), inset 0 0 55px rgba(103, 57, 18, 0.16);
  opacity: 1;
  transform: translateY(0) rotateX(0deg) scale(1);
  transform-origin: 50% 100%;
  transition: opacity 420ms ease 170ms, transform 680ms cubic-bezier(.2, .75, .2, 1);
  scrollbar-color: rgba(108, 62, 25, 0.55) rgba(255, 255, 255, 0.15);
}

.capsule-form.is-sealed .capsule-letter-sheet {
  opacity: 0;
  pointer-events: none;
  transform: translateY(22%) rotateX(-16deg) scale(0.82);
}

.capsule-form.is-open .capsule-envelope-cover {
  opacity: 0;
  pointer-events: none;
  transform: translateY(28%) rotateX(72deg) scale(0.88);
}

#lettre-2036 .capsule-form-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  margin: 0;
  border-bottom: 1px solid rgba(105, 63, 27, 0.38);
  padding: 0 0 8px;
}

#lettre-2036 .capsule-form-header > span {
  color: #6e321e;
  font-size: 11px;
  letter-spacing: 0;
}

.capsule-countdown {
  display: grid;
  grid-template-columns: auto auto;
  gap: 0 6px;
  color: #5b2c1e;
  text-align: right;
}

.capsule-countdown > span {
  grid-row: 1 / 3;
  align-self: center;
  font-size: 22px;
}

#lettre-2036 .capsule-countdown strong {
  color: #5b2c1e;
  font: 700 14px Georgia, serif;
}

.capsule-countdown small {
  font-size: 9px;
  text-transform: uppercase;
}

.capsule-letter-intro {
  margin: 0;
  color: rgba(55, 33, 19, 0.78);
  font: italic 14px Georgia, serif;
  text-align: center;
}

#lettre-2036 .capsule-prompts {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}

#lettre-2036 .capsule-prompts button {
  display: grid;
  min-height: 54px;
  place-items: center;
  gap: 2px;
  border: 1px solid rgba(100, 57, 24, 0.36);
  border-radius: 4px;
  padding: 5px 3px;
  background: rgba(255, 240, 202, 0.38);
  color: #4c2d18;
  font: 700 10px Georgia, serif;
  cursor: pointer;
}

#lettre-2036 .capsule-prompts button > span {
  color: #883824;
  font-size: 18px;
}

#lettre-2036 .capsule-prompts button:hover,
#lettre-2036 .capsule-prompts button:focus-visible,
#lettre-2036 .capsule-prompts button.is-selected {
  border-color: #8a3924;
  background: rgba(132, 48, 30, 0.14);
  color: #32180f;
  box-shadow: inset 0 -3px 0 rgba(124, 43, 27, 0.28);
}

.capsule-letter-writing {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(96px, 1fr) auto;
  min-height: 0;
  border: 1px solid rgba(101, 59, 25, 0.25);
  border-radius: 2px;
  padding: 10px 13px;
  background: rgba(255, 242, 208, 0.42);
}

.capsule-salutation {
  margin: 0;
  font: italic 19px Georgia, serif;
}

#lettre-2036 .capsule-letter-writing textarea {
  min-height: 96px;
  border: 0;
  border-radius: 0;
  padding: 8px 4px 4px;
  background-color: transparent;
  background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 27px, rgba(86, 53, 28, 0.24) 28px);
  background-attachment: local;
  box-shadow: none;
  color: #2c1a10;
  font: italic 16px/28px Georgia, serif;
  resize: none;
}

#lettre-2036 .capsule-letter-writing textarea:focus {
  outline: 0;
  box-shadow: inset 3px 0 0 rgba(132, 48, 30, 0.5);
}

.capsule-signature-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 9px;
}

#lettre-2036 .capsule-signature-line label {
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr);
  align-items: center;
  gap: 8px;
  margin: 0;
  font: italic 13px Georgia, serif;
}

#lettre-2036 .capsule-signature-line input {
  min-height: 30px;
  border: 0;
  border-bottom: 1px solid rgba(74, 43, 20, 0.6);
  border-radius: 0;
  padding: 3px 5px;
  background: transparent;
  box-shadow: none;
  font: italic 16px Georgia, serif;
}

#capsuleSignButton {
  min-height: 32px;
  border: 1px solid #7b3825;
  border-radius: 4px;
  padding: 5px 12px;
  background: rgba(113, 43, 28, 0.08);
  color: #632d1e;
  font: 700 11px Georgia, serif;
  cursor: pointer;
}

#capsuleSignaturePreview {
  position: absolute;
  right: 18px;
  bottom: 10px;
  color: #71321e;
  font: italic 21px Georgia, serif;
  opacity: 0;
  pointer-events: none;
  transform: rotate(-4deg) scale(0.8);
  transition: opacity 220ms ease, transform 280ms ease;
}

.capsule-form.is-signed #capsuleSignaturePreview {
  opacity: 0.82;
  transform: rotate(-4deg) scale(1);
}

.capsule-form.is-signed #capsuleSignButton {
  color: transparent;
}

.capsule-form.is-signed #capsuleSignButton::after {
  color: #632d1e;
  content: "Lettre signée";
}

.capsule-privacy {
  display: grid;
  grid-template-columns: auto 1fr 1fr;
  align-items: center;
  gap: 8px;
  margin: 0;
  border: 0;
  padding: 0;
}

.capsule-privacy legend {
  padding: 0 10px 0 0;
  font: 700 11px Georgia, serif;
}

.capsule-privacy label {
  min-width: 0;
  cursor: pointer;
}

.capsule-privacy input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.capsule-privacy span {
  display: grid;
  min-height: 30px;
  place-items: center;
  border: 1px solid rgba(96, 53, 24, 0.34);
  border-radius: 4px;
  background: rgba(255, 241, 205, 0.3);
  font-size: 10px;
  font-weight: 700;
  text-align: center;
}

.capsule-privacy input:checked + span {
  border-color: #7f3623;
  background: rgba(127, 54, 35, 0.14);
  box-shadow: inset 0 -3px 0 rgba(127, 54, 35, 0.25);
}

.capsule-extras {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 0.9fr);
  gap: 8px;
}

#lettre-2036 .capsule-object-note {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  margin: 0;
  border: 1px dashed rgba(102, 58, 25, 0.34);
  padding: 6px 8px;
  color: #442719;
}

#lettre-2036 .capsule-object-note > label {
  color: #442719;
  font-size: 10px;
}

#lettre-2036 .capsule-object-note .inline-check {
  color: #442719;
}

.capsule-object-description {
  display: none;
}

.capsule-form.has-object .capsule-object-description {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 6px;
}

#lettre-2036 .capsule-object-description input {
  min-height: 26px;
  border: 0;
  border-bottom: 1px solid rgba(74, 43, 20, 0.5);
  border-radius: 0;
  padding: 2px 4px;
  background: transparent;
  box-shadow: none;
  font-size: 11px;
}

#lettre-2036 .capsule-file.file-dropzone,
#lettre-2036 .capsule-file {
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  gap: 4px;
  min-height: 0;
  margin: 0;
  border: 1px dashed rgba(102, 58, 25, 0.34);
  border-radius: 2px;
  padding: 6px 8px;
  background: rgba(255, 240, 202, 0.22);
  color: #442719;
  font-size: 10px;
}

#lettre-2036 .capsule-file > span,
#lettre-2036 .capsule-file.file-dropzone > span {
  color: #442719;
  font-weight: 700;
}

#lettre-2036 .capsule-file.is-requested {
  border-color: #873923;
  background: rgba(135, 57, 35, 0.1);
  box-shadow: inset 0 -3px 0 rgba(135, 57, 35, 0.2);
}

#lettre-2036 .capsule-file.file-dropzone input[type="file"],
#lettre-2036 .capsule-file input[type="file"] {
  min-height: 26px;
  border: 0;
  padding: 2px;
  background: transparent;
  font-size: 9px;
}

#lettre-2036 .capsule-file input[type="file"]::file-selector-button {
  border: 1px solid rgba(90, 49, 23, 0.45);
  border-radius: 3px;
  padding: 4px 7px;
  background: rgba(255, 241, 204, 0.58);
  color: #3f2416;
  font: 700 9px Georgia, serif;
}

#lettre-2036 .capsule-submit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid rgba(103, 61, 25, 0.35);
  padding-top: 8px;
  color: rgba(57, 32, 17, 0.76);
  font: italic 11px Georgia, serif;
}

#lettre-2036 .capsule-submit-row > span strong {
  color: #7c321f;
  font-size: 18px;
}

#lettre-2036 .stamp-action {
  min-width: 190px;
  min-height: 40px;
  border: 1px solid #8e4930;
  border-radius: 4px;
  background: #702b20;
  color: #f8dfad;
  box-shadow: 0 6px 12px rgba(71, 28, 19, 0.3);
  font-family: Georgia, serif;
}

.capsule-wax-drop {
  position: absolute;
  z-index: 20;
  left: 50%;
  top: 52%;
  width: 72px;
  height: 72px;
  border: 5px double rgba(255, 196, 127, 0.38);
  border-radius: 50%;
  background: #8a2118;
  box-shadow: 0 10px 20px rgba(55, 15, 10, 0.55);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -180%) scale(0.2);
}

.capsule-form.is-sealing .capsule-wax-drop {
  animation: capsule-wax-fall 700ms cubic-bezier(.2, .8, .3, 1) both;
}

.capsule-form.is-sealing .capsule-letter-sheet {
  animation: capsule-letter-depart 900ms ease-in both;
}

#lettre-2036 .submission-stamp {
  z-index: 22;
  color: #8e271d;
  font-size: 28px;
}

@keyframes capsule-wax-fall {
  0% { opacity: 0; transform: translate(-50%, -180%) scale(0.2); }
  55% { opacity: 1; transform: translate(-50%, -50%) scale(1.18); }
  100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@keyframes capsule-letter-depart {
  0%, 62% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-18%) scale(0.72); }
}

@media (max-width: 900px) {
  .capsule-letter-sheet {
    grid-template-rows: auto auto auto minmax(160px, 1fr) auto auto auto;
    padding: 14px;
  }

  #lettre-2036 .capsule-prompts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .capsule-extras,
  .capsule-privacy {
    grid-template-columns: 1fr 1fr;
  }

  .capsule-privacy legend {
    grid-column: 1 / -1;
  }

  #lettre-2036 .capsule-submit-row {
    align-items: stretch;
    flex-direction: column;
  }

  #lettre-2036 .stamp-action {
    width: 100%;
  }
}

.stage {
  display: block;
  width: 100vw;
  height: 100vh;
}

.screen {
  position: absolute;
  inset: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background-color: #000;
  background-image: none;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  box-shadow: none;
  backdrop-filter: none;
}

.screen.hidden {
  display: none !important;
}

.screen::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 0;
  width: var(--frame-width, var(--active-design-width));
  height: var(--frame-height, var(--active-design-height));
  background: var(--screen-bg, none) center / contain no-repeat;
  filter: brightness(var(--page-background-brightness, 1));
  transform: translate(-50%, -50%);
}

.screen-design-frame {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: var(--frame-width, var(--active-design-width));
  height: var(--frame-height, var(--active-design-height));
  overflow: hidden;
  container-type: size;
  transform: translate(-50%, -50%);
}

#depart {
  --screen-bg: none;
}

#voyages {
  --screen-bg: none;
}

#voyages::before {
  display: none;
}

#voyages .screen-design-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--screen-bg, none) center / contain no-repeat;
  filter: brightness(var(--page-background-brightness, 1));
  pointer-events: none;
}

#participer {
  --screen-bg: none;
}

#studio {
  --screen-bg: none;
}

#admin {
  --screen-bg: none;
  overflow: auto;
}

.hotspot {
  position: absolute;
  z-index: 4;
  border: 1px solid rgba(255, 230, 150, 0);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.001);
  color: transparent;
  font-size: 1px;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.hotspot:hover,
.hotspot:focus-visible {
  border-color: rgba(255, 218, 122, 0.74);
  background: rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 34px rgba(212, 175, 55, 0.42), inset 0 0 22px rgba(255, 241, 184, 0.12);
  outline: none;
}

.quick-nav {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 70;
  display: block;
  width: var(--active-design-width);
  height: var(--active-design-height);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.app-shell[data-view="depart"] .quick-nav {
  display: none;
}

.quick-nav-label {
  position: absolute;
  left: 90.5%;
  top: 1.5%;
  width: 7%;
  height: 45%;
  pointer-events: none;
}

.quick-nav-label > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 8px 10px rgba(18, 7, 2, 0.34));
  pointer-events: none;
}

.quick-nav button {
  position: absolute;
  z-index: 1;
  left: 20%;
  width: 60%;
  height: 7.4%;
  min-height: 0;
  border: 0;
  border-radius: 4px;
  padding: 0 2px;
  background: transparent;
  color: #4b2411;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(9px, 0.72vw, 14px);
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(255, 232, 170, 0.72);
  box-shadow: none;
  pointer-events: auto;
}

#quickBack {
  top: 72.5%;
}

.quick-home {
  top: 81.2%;
}

.quick-nav button:hover,
.quick-nav button:focus-visible {
  color: #9c321b;
  outline: none;
  background: rgba(255, 232, 170, 0.18);
  box-shadow: 0 0 12px rgba(139, 65, 25, 0.14);
}

.depart-voyages {
  left: 22.3%;
  top: 64.5%;
  width: 27.4%;
  height: 22%;
}

.depart-participer {
  left: 51%;
  top: 64.5%;
  width: 28.8%;
  height: 22%;
}

.back-home {
  left: 1.2%;
  top: 2%;
  width: 7.4%;
  height: 11%;
}

.archive-thumbnails {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.archive-thumbnail {
  position: absolute;
  top: 20.7%;
  width: 13.3%;
  height: 21.6%;
  object-fit: cover;
  object-position: center;
}

.archive-thumbnail:not([src]) {
  display: none;
}

.archive-thumbnail-50 {
  left: 7.3%;
}

.archive-thumbnail-mariage {
  left: 24.9%;
}

.archive-thumbnail-evjf {
  left: 42.2%;
}

.archive-thumbnail-evg {
  left: 59.7%;
}

.archive-thumbnail-20ans {
  left: 77.1%;
}

.journey-timeline {
  position: absolute;
  z-index: 6;
  display: grid;
  grid-template-columns: repeat(var(--timeline-columns, 7), minmax(0, 1fr));
  align-items: start;
  color: #2c1a0c;
  font-size: var(--overlay-font-size, 0.92vw);
  text-align: center;
  text-shadow: none;
}

.journey-timeline article {
  display: grid;
  grid-template-rows: 1.25em 1.4em auto;
  gap: 0.24em;
  min-width: 0;
  padding: 0 0.25em;
}

.journey-timeline .timeline-icon {
  font-size: 1.35em;
  line-height: 1;
}

.journey-timeline strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.08em;
  line-height: 1;
}

.journey-timeline p {
  margin: 0;
  font-family: Arial, sans-serif;
  font-size: 0.82em;
  line-height: 1.2;
}

.participer-contribution,
.participer-letter,
.participer-studio {
  top: 28.2%;
  width: 15.9%;
  height: 36%;
}

.participer-contribution {
  left: 24.8%;
}

.participer-letter {
  left: 41.8%;
}

.participer-studio {
  left: 58.8%;
}

.participer-distance-live {
  position: absolute;
  z-index: 6;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.3em;
  color: #24170d;
  line-height: 1;
  text-align: center;
}

.depart-distance-live {
  position: absolute;
  z-index: 6;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.3em;
  color: var(--gold-soft);
  line-height: 1;
  text-align: center;
  text-shadow: 0 0 14px rgba(255, 221, 126, 0.45);
}

.depart-distance-live strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-number-font-size, 3.15vw);
  font-weight: 500;
  line-height: 1;
}

.depart-distance-live span {
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-unit-font-size, 1.15vw);
  line-height: 1;
}

.depart-last-activity {
  position: absolute;
  z-index: 6;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.7em;
  margin: 0;
  color: var(--gold-soft);
  font-size: var(--overlay-font-size, 1.15vw);
  line-height: 1.15;
  text-align: center;
  text-shadow:
    0 2px 0 rgba(44, 21, 2, 0.82),
    0 0 14px rgba(255, 221, 126, 0.38);
}

.depart-last-activity strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.15em;
  font-weight: 700;
}

.depart-last-activity span {
  color: rgba(255, 241, 184, 0.9);
  font-family: Arial, sans-serif;
  font-size: 0.88em;
  font-weight: 700;
}

.depart-last-activity small {
  color: rgba(255, 247, 210, 0.72);
  font-family: Arial, sans-serif;
  font-size: 0.76em;
  font-style: italic;
}

.participer-distance-live strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-number-font-size, 3.15vw);
  font-weight: 500;
  line-height: 1;
}

.participer-distance-live span {
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-unit-font-size, 1.15vw);
  line-height: 1;
}

.participer-progress-track {
  position: absolute;
  z-index: 7;
  border: 1px solid rgba(88, 57, 25, 0.78);
  background: rgba(31, 51, 43, 0.88);
  box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.6), 0 1px 0 rgba(255, 235, 176, 0.42);
  overflow: visible;
}

.participer-progress-fill {
  position: absolute;
  inset: 2px auto 2px 0;
  width: var(--journey-progress, 0%);
  max-width: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(214, 160, 61, 0.42), #d69f3b);
  transition: width 700ms ease;
}

.participer-progress-plane {
  position: absolute;
  left: var(--journey-progress, 0%);
  top: 50%;
  display: grid;
  width: 2.4em;
  height: 2.4em;
  place-items: center;
  color: #f7cf78;
  font-size: clamp(16px, 1.7vw, 30px);
  font-style: normal;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(54, 28, 5, 0.8), 0 0 10px rgba(255, 217, 122, 0.55);
  transform: translate(-50%, -50%) rotate(-8deg);
  transition: left 700ms ease;
}

.participer-progress-plane::before {
  content: "\2708";
}

.participer-next-stop-label,
.participer-next-stop-name,
.participer-next-stop-name.is-long {
  font-size: var(--overlay-font-size, 1.35vw);
  line-height: 0.78;
}

.participer-next-stop-distance {
  position: absolute;
  z-index: 6;
  margin: 0;
  color: #2b1a0e;
  text-shadow: none;
}


.participer-next-stop-label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.05vw);
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.participer-next-stop-name {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.35vw);
  font-weight: 700;
  line-height: 0.92;
  text-align: center;
  text-transform: uppercase;
  text-wrap: balance;
}

.participer-next-stop-name.is-long {
  font-size: var(--overlay-font-size, 1.35vw);
  line-height: 0.78;
}

.participer-next-stop-distance {
  display: grid;
  place-content: center;
  font-family: Arial, sans-serif;
  font-size: var(--overlay-font-size, 0.95vw);
  line-height: 1.18;
  text-align: center;
}

.participer-next-stop-distance strong {
  font-size: 1em;
}



.live-chip {
  position: absolute;
  z-index: 5;
  min-width: 0;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--gold-soft);
  text-align: center;
  text-shadow:
    0 2px 0 rgba(69, 38, 6, 0.72),
    0 0 18px rgba(255, 221, 126, 0.68),
    0 0 34px rgba(212, 175, 55, 0.42);
  backdrop-filter: none;
}

.live-chip > span {
  display: none;
}

.live-chip b {
  display: block;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: var(--overlay-font-size, 3vw);
  line-height: 0.9;
  white-space: nowrap;
}

.distance-value {
  font-size: inherit;
}

.distance-chip {
  --overlay-font-size: 7vw;
  left: 50.7%;
  top: 14.2%;
  transform: translateX(-50%);
}

.distance-number,
.distance-unit {
  display: inline-block;
  vertical-align: baseline;
}

.distance-number {
  font-size: var(--overlay-number-font-size, 7vw);
  line-height: 0.9;
}

.distance-unit {
  margin-left: 0.12em;
  font-size: var(--overlay-unit-font-size, 3vw);
  line-height: 1;
  transform: translateY(-0.04em);
}

.next-chip {
  --overlay-font-size: 3.5vw;
  left: 50%;
  top: 59.4%;
  transform: translateX(-50%);
}

.next-chip b {
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.archive-hotspots {
  position: absolute;
  z-index: 5;
  right: 7.6%;
  bottom: 9.8%;
  display: flex;
  gap: 12px;
}

.memory-50,
.memory-mariage,
.memory-evjf,
.memory-evg,
.memory-20ans {
  z-index: 5;
}

.archives-counter {
  position: absolute;
  z-index: 6;
  color: var(--gold-soft);
  text-shadow:
    0 2px 0 rgba(69, 38, 6, 0.68),
    0 0 16px rgba(255, 221, 126, 0.46);
}

.archives-counter {
  left: 74%;
  top: 13%;
  width: 18%;
  height: 10%;
  display: grid;
  place-items: center;
  font-size: var(--overlay-font-size, 2.2vw);
  text-align: center;
}

.archives-counter strong {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  line-height: 0.9;
}

.voyages-memory-card {
  z-index: 6;
  border: 1px solid rgba(226, 176, 82, 0.52) !important;
  background: rgba(255, 226, 145, 0.012) !important;
  box-shadow: inset 0 0 28px rgba(255, 218, 137, 0.06), 0 0 14px rgba(112, 62, 18, 0.18) !important;
}

.voyages-memory-card.click-cue.is-cue-active,
.voyages-memory-card:hover,
.voyages-memory-card:focus-visible {
  border-color: rgba(255, 225, 145, 0.9) !important;
  background: rgba(255, 231, 170, 0.04) !important;
  box-shadow: inset 0 0 36px rgba(255, 226, 154, 0.1), 0 0 0 1px rgba(255, 235, 174, 0.42), 0 0 28px rgba(255, 188, 74, 0.46) !important;
  filter: brightness(1.12);
}

.memory-page {
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 72px 24px 28px;
  background:
    radial-gradient(circle at 18% 12%, rgba(212, 175, 55, 0.12), transparent 30%),
    linear-gradient(145deg, #051016, #14100b 48%, #05080b);
}

.memory-page::before {
  display: none;
}

.memory-page-50 {
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 222, 154, 0.14), transparent 32%),
    linear-gradient(145deg, #061018, #15110b 48%, #05080b);
}

.memory-page-mariage {
  background:
    radial-gradient(circle at 72% 16%, rgba(255, 222, 154, 0.14), transparent 30%),
    linear-gradient(145deg, #0b1016, #1b130c 50%, #05080b);
}

.memory-page-evjf {
  background:
    radial-gradient(circle at 28% 16%, rgba(20, 184, 166, 0.14), transparent 32%),
    linear-gradient(145deg, #061016, #11180e 48%, #05080b);
}

.memory-page-evg {
  background:
    radial-gradient(circle at 74% 18%, rgba(212, 175, 55, 0.13), transparent 34%),
    linear-gradient(145deg, #050b10, #15110c 48%, #05080b);
}

.memory-page-20ans {
  background:
    radial-gradient(circle at 50% 14%, rgba(255, 222, 154, 0.13), transparent 36%),
    linear-gradient(145deg, #061016, #17110a 48%, #05080b);
}

.memory-page-panel {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(220px, 0.95fr) minmax(260px, 1fr);
  gap: 28px;
  align-items: center;
  width: min(900px, 78vw);
  margin: 58px auto 0;
  border: 1px solid rgba(212, 175, 55, 0.42);
  border-radius: 10px;
  padding: 28px;
  background: rgba(5, 10, 13, 0.76);
  color: var(--gold-soft);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.54);
  backdrop-filter: none;
}

.memory-media-slot {
  min-height: 260px;
  border: 1px dashed rgba(255, 229, 154, 0.34);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255, 241, 184, 0.08), rgba(0, 0, 0, 0.22)),
    rgba(0, 0, 0, 0.28);
}

.memory-video-slot {
  aspect-ratio: 16 / 9;
  min-height: 220px;
}

.memory-page-panel p {
  margin: 0 0 14px;
  color: rgba(255, 241, 184, 0.72);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.memory-page-panel span {
  display: block;
  color: rgba(255, 255, 255, 0.88);
  font-size: 22px;
  line-height: 1.35;
}

.glass-mini {
  min-height: 44px;
  border: 1px solid rgba(212, 175, 55, 0.38);
  border-radius: 8px;
  padding: 0 16px;
  background: rgba(0, 0, 0, 0.36);
  color: var(--gold-soft);
  font-size: 14px;
  font-weight: 900;
  backdrop-filter: blur(8px);
}

.action-screen {
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 72px 24px 28px;
  background:
    radial-gradient(circle at 18% 12%, rgba(212, 175, 55, 0.12), transparent 30%),
    linear-gradient(145deg, #061014, #15110b 48%, #05080b);
}

.action-screen::before {
  display: block;
}

.memory-page.has-custom-background::before,
.action-screen.has-custom-background::before {
  display: block;
}

.action-title {
  position: absolute;
  left: 50%;
  top: 5.8%;
  z-index: 5;
  width: min(820px, 70vw);
  color: var(--gold-soft);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 4vw, 62px);
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-shadow:
    0 2px 0 rgba(69, 38, 6, 0.72),
    0 0 26px rgba(255, 221, 126, 0.42);
  transform: translateX(-50%);
}

.journey-form {
  position: absolute;
  z-index: 6;
  left: 50%;
  bottom: 8.2%;
  width: min(760px, 52vw);
  margin: 0;
  padding: 18px 20px;
  border: 1px solid rgba(255, 229, 154, 0.42);
  border-radius: 12px;
  background: rgba(5, 10, 13, 0.48);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.42);
  backdrop-filter: none;
  transform: translateX(-50%);
}

.action-screen .journey-form {
  position: relative;
  left: auto;
  bottom: auto;
  width: min(880px, 76vw);
  margin: 58px auto 0;
  padding: 26px 28px;
  background: rgba(5, 10, 13, 0.76);
  transform: none;
}

.step-panel {
  min-height: 162px;
}

.step-panel label {
  margin-bottom: 8px;
  color: var(--gold-soft);
  font-size: 12px;
}

.step-panel input[type="text"],
.step-panel input:not([type]) {
  min-height: 46px;
  font-size: 18px;
}

.step-panel textarea {
  min-height: 92px;
  font-size: 16px;
}

.choice-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.choice-grid label {
  display: flex;
  min-height: 72px;
  align-items: center;
  padding: 10px;
  font-size: 13px;
  line-height: 1.25;
  background: rgba(255, 255, 255, 0.1);
}

.form-footer {
  padding-top: 12px;
}

.primary-action,
.secondary-action,
.admin-card button {
  min-height: 40px;
  border-radius: 8px;
  padding: 0 14px;
  font-size: 13px;
}

.studio-grid {
  position: absolute;
  z-index: 5;
  left: 20.6%;
  top: 20.6%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 16px;
  width: 58.8%;
  padding: 0;
}

.camera-box video {
  border-color: rgba(255, 229, 154, 0.5);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.44);
  box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(8px);
}

.camera-actions {
  justify-content: center;
  margin-top: 12px;
}

.gallery-panel,
.admin-card {
  border-color: rgba(212, 175, 55, 0.36);
  background: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(10px);
}

.calibrating [data-overlay-key] {
  border: 1px dashed rgba(255, 229, 154, 0.55) !important;
  background: rgba(20, 184, 166, 0.045);
  box-shadow: inset 0 0 28px rgba(255, 241, 184, 0.08);
}

/* Les noms des cadres restent visibles dans le panneau de calibrage,
   mais leur étiquette flottante est masquée pour libérer l’aperçu. */
.calibrating [data-overlay-key]::after {
  content: none;
  display: none;
}

.calibrating .selected-overlay {
  border: 2px solid rgba(255, 225, 118, 0.95) !important;
  background: rgba(212, 175, 55, 0.09);
  box-shadow: 0 0 42px rgba(212, 175, 55, 0.46), inset 0 0 28px rgba(255, 241, 184, 0.12);
}

.app-shell:not(.calibrating) [data-overlay-key].overlay-border-hidden {
  border-style: none !important;
  outline: none !important;
}

.calibration-panel {
  position: fixed;
  z-index: 80;
  right: 22px;
  bottom: 22px;
  width: min(360px, calc(100vw - 44px));
  max-height: calc(100vh - 44px);
  overflow: auto;
  border: 1px solid rgba(212, 175, 55, 0.46);
  border-radius: 10px;
  padding: 14px;
  background: rgba(2, 9, 16, 0.84);
  color: var(--gold-soft);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.52);
  backdrop-filter: blur(14px);
}

.calibration-panel[hidden] {
  display: none !important;
}

.calibration-panel header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  cursor: move;
  touch-action: none;
  user-select: none;
  background: rgba(2, 9, 16, 0.96);
}

.calibration-panel header strong {
  font-size: 15px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.calibration-panel header button,
.calibration-actions button {
  border: 1px solid rgba(212, 175, 55, 0.36);
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.28);
  color: var(--gold-soft);
  font-weight: 900;
}

.calibration-panel header button {
  width: 32px;
  height: 32px;
  font-size: 20px;
  line-height: 1;
}

.calibration-panel label {
  display: block;
  margin: 10px 0;
  color: rgba(255, 241, 184, 0.82);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.calibration-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 82px;
  gap: 8px;
  align-items: center;
}

.calibration-panel select,
.calibration-panel input[type="range"],
.calibration-panel input[type="number"] {
  margin-top: 6px;
}

.calibration-panel select,
.calibration-panel input[type="number"] {
  min-height: 36px;
  border: 1px solid rgba(212, 175, 55, 0.36);
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.42);
  color: var(--gold-soft);
  padding: 0 10px;
}

.calibration-panel select {
  width: 100%;
}

.calibration-panel input[type="range"] {
  width: 100%;
  accent-color: var(--gold);
}

.calibration-panel input[type="number"] {
  width: 82px;
}

.calibration-panel .calibration-border-toggle {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(212, 175, 55, 0.24);
  border-radius: 7px;
  padding: 10px;
  background: rgba(255, 238, 196, 0.06);
}

.calibration-border-toggle input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--gold);
}

.calibration-panel output {
  float: right;
  color: #fff;
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
}

.calibration-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 12px;
}

.calibration-actions button {
  min-height: 34px;
  padding: 0 12px;
}

.admin-screen::before {
  position: fixed;
}

.admin-screen .section-head,
.admin-grid {
  position: relative;
  z-index: 5;
}

.admin-screen .section-head {
  padding-top: 126px;
}

.admin-grid {
  max-width: 1120px;
  margin: 0 auto;
}

@media (max-width: 1100px) {
  .journey-form {
    width: min(880px, 84vw);
  }

  .choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-grid {
    left: 7vw;
    top: 20vh;
    width: 86vw;
    grid-template-columns: 1fr;
  }

  .gallery-panel {
    display: none;
  }
}

/* Admin/settings view: readable app UI, not an immersive scene. */
#admin {
  overflow: auto;
  scrollbar-gutter: stable;
  background: #f4f6f8;
  color: #182230;
}

#admin::before {
  display: none;
}

.admin-screen {
  min-height: 100vh;
  padding: 36px;
}

.admin-screen .section-head {
  max-width: 1180px;
  margin: 0 auto 22px;
  padding: 0;
}

.admin-tabs {
  position: sticky;
  top: 0;
  z-index: 34;
  display: flex;
  gap: 5px;
  max-width: 1180px;
  overflow-x: auto;
  margin: 0 auto 18px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  padding: 6px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.1);
  backdrop-filter: blur(10px);
}

.admin-tabs button {
  flex: 1 0 auto;
  min-height: 40px;
  border: 0;
  border-radius: 5px;
  padding: 0 18px;
  background: transparent;
  color: #475467;
  font-size: 13px;
  font-weight: 750;
}

.admin-tabs button:hover,
.admin-tabs button:focus-visible {
  background: #f2f4f7;
  color: #101828;
  outline: 2px solid transparent;
}

.admin-tabs button.active {
  background: #182230;
  color: #fff;
  box-shadow: 0 4px 12px rgba(16, 24, 40, 0.2);
}

.admin-screen .section-head .kicker {
  color: #667085;
}

.admin-screen .section-head h2 {
  color: #101828;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-size: clamp(34px, 4vw, 56px);
  font-weight: 800;
  letter-spacing: 0;
}

.admin-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 0 44px;
}

.admin-card {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #ffffff;
  color: #182230;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
  backdrop-filter: none;
}

.admin-card.wide {
  grid-column: 1 / -1;
}

.admin-card[hidden] {
  display: none !important;
}

.admin-card h3 {
  color: #101828;
  font-size: 18px;
}

.admin-card p {
  color: #475467;
  line-height: 1.45;
}

.admin-card button {
  border: 1px solid #98a2b3;
  border-radius: 6px;
  background: #ffffff;
  color: #182230;
}

.admin-card button:hover {
  background: #f2f4f7;
}

.background-settings,
.thumbnail-settings,
.timeline-settings {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.thumbnail-settings {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.background-settings {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.background-settings article {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.background-settings article > strong {
  color: #344054;
  font-size: 13px;
}

.background-settings img {
  width: 100%;
  aspect-ratio: 3 / 2;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #f2f4f7;
  object-fit: cover;
}

.background-settings img:not([src]) {
  background:
    linear-gradient(145deg, rgba(212, 175, 55, 0.08), transparent),
    #e4e7ec;
}

.background-settings input[type="file"] {
  width: 100%;
  color: #475467;
  font-size: 12px;
}

.thumbnail-settings label {
  display: grid;
  gap: 8px;
  min-width: 0;
  color: #344054;
  font-size: 13px;
  font-weight: 700;
}

.thumbnail-settings img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #f2f4f7;
  object-fit: cover;
}

.thumbnail-settings img:not([src]) {
  display: block;
}

.thumbnail-settings input[type="file"] {
  width: 100%;
  color: #475467;
  font-size: 12px;
}

.timeline-settings {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.timeline-setting-row {
  display: grid;
  grid-template-columns: 58px 92px minmax(0, 1fr) 38px;
  gap: 8px;
  align-items: center;
}

.timeline-setting-row input {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  padding: 0 10px;
  background: #fff;
  color: #182230;
}

.timeline-setting-row .timeline-remove {
  width: 38px;
  min-width: 38px;
  min-height: 38px;
  padding: 0;
  color: #b42318;
  font-size: 20px;
  line-height: 1;
}

.route-final-settings {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.route-final-settings label {
  display: grid;
  gap: 6px;
  color: #344054;
  font-size: 13px;
  font-weight: 700;
}

.route-final-settings input,
.route-setting-row input {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  padding: 0 10px;
  background: #fff;
  color: #182230;
}

.route-km-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: center;
}

.route-km-input b {
  color: #667085;
  text-align: center;
}

.route-status {
  margin: 14px 0;
  border-left: 3px solid #b58a32;
  padding: 10px 12px;
  background: #f9fafb;
  color: #344054;
  font-size: 14px;
}

.route-settings {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}

.route-setting-row {
  display: grid;
  grid-template-columns: 42px minmax(150px, 1fr) minmax(120px, 0.34fr) 58px 72px 72px 118px;
  gap: 8px;
  align-items: center;
}

.route-order {
  color: #667085;
  font-weight: 800;
  text-align: center;
}

.route-actions {
  display: grid;
  grid-template-columns: repeat(3, 34px);
  gap: 5px;
}

.route-actions button {
  width: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  font-size: 17px;
  line-height: 1;
}

.route-actions .route-remove {
  color: #b42318;
}

#addTimelineItem {
  margin-top: 14px;
}

.admin-stats div {
  border-color: #eaecf0;
  background: #f9fafb;
}

.admin-stats span,
.records-table,
.log-list {
  color: #475467;
}

.admin-stats strong {
  color: #101828;
}

.record-row,
.log-row {
  border-top-color: #eaecf0;
}

@media (max-width: 760px) {
  .admin-screen {
    padding: 22px 14px;
  }

  .admin-grid {
    grid-template-columns: 1fr;
  }

  .admin-tabs {
    margin-bottom: 14px;
  }

  .admin-tabs button {
    flex-basis: auto;
    padding-inline: 14px;
  }

  .background-settings,
  .thumbnail-settings,
  .timeline-settings {
    grid-template-columns: 1fr;
  }

  .route-final-settings,
  .route-setting-row {
    grid-template-columns: 1fr;
  }

  .route-order {
    text-align: left;
  }
}

/* Secondary souvenir pages and their configurable content layers */
#galerie-50 { --screen-bg: none; }
#film-mariage { --screen-bg: none; }
#galerie-evjf { --screen-bg: none; }
#galerie-evg { --screen-bg: none; }
#galerie-20ans { --screen-bg: none; }
#contribution,
#participation-en-ligne { --screen-bg: none; }
#lettre-2036 { --screen-bg: none; }

#galerie-50::before,
#film-mariage::before,
#galerie-evjf::before,
#galerie-evg::before,
#galerie-20ans::before,
#contribution::before,
#participation-en-ligne::before,
#lettre-2036::before {
  display: block;
}

.memory-page,
.action-screen {
  overflow: hidden;
  padding: 0;
  background: #090705;
}

.page-media-surface {
  position: absolute;
  z-index: 5;
  box-sizing: border-box;
  overflow: auto;
  border: 1px solid rgba(238, 191, 101, 0.58);
  border-radius: 8px;
  background: rgba(12, 7, 4, 0.68);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.42);
  scrollbar-color: rgba(214, 163, 78, 0.8) rgba(0, 0, 0, 0.2);
}

.page-media-empty {
  display: grid;
  min-height: 100%;
  margin: 0;
  place-items: center;
  color: rgba(255, 229, 166, 0.8);
  font-family: Georgia, serif;
  font-size: clamp(13px, 1.4vw, 24px);
  text-align: center;
}

.page-media-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-height: 100%;
  padding: 10px;
}

.page-media-tile {
  position: relative;
  min-width: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid rgba(255, 226, 164, 0.5);
  border-radius: 4px;
  padding: 0;
  background: #090705;
  cursor: pointer;
}

.page-media-tile img,
.page-media-tile video,
.page-media-feature > img,
.page-media-feature > video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-media-feature > video,
.page-media-feature > img {
  object-fit: contain;
}

.page-media-play {
  position: absolute;
  right: 8px;
  bottom: 8px;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(0, 0, 0, 0.76);
  color: #ffe2a0;
  font-size: 11px;
  font-weight: 800;
}

.media-viewer {
  width: min(1100px, 90vw);
  height: min(760px, 84vh);
  border: 1px solid rgba(225, 177, 88, 0.76);
  border-radius: 8px;
  padding: 46px 14px 14px;
  background: #080706;
  color: #fff;
}

.media-viewer::backdrop {
  background: rgba(0, 0, 0, 0.86);
}

.media-viewer-close {
  position: absolute;
  top: 10px;
  right: 10px;
  min-height: 30px;
  border: 1px solid rgba(225, 177, 88, 0.64);
  border-radius: 4px;
  background: #17110b;
  color: #ffe2a0;
}

#mediaViewerContent,
#mediaViewerContent > img,
#mediaViewerContent > video {
  width: 100%;
  height: 100%;
}

#mediaViewerContent > img,
#mediaViewerContent > video {
  display: block;
  object-fit: contain;
}

/* Message and capsule forms */
#lettre-2036 .journey-form {
  position: absolute;
  z-index: 6;
  box-sizing: border-box;
  left: 28%;
  top: 25%;
  bottom: auto;
  width: 44%;
  height: 62%;
  margin: 0;
  overflow: auto;
  border: 1px solid rgba(101, 57, 20, 0.54);
  border-radius: 8px;
  padding: clamp(12px, 1.5vw, 24px);
  background: rgba(231, 199, 143, 0.88);
  color: #2c1a0d;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.38);
  transform: none;
}

#lettre-2036 .journey-form {
  left: 24%;
  top: 23%;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  width: 52%;
  height: 69%;
  border-color: rgba(232, 186, 92, 0.72);
  border-radius: 6px;
  padding: clamp(14px, 1.35vw, 24px);
  background: rgba(18, 12, 8, 0.91);
  color: #f7dfad;
  box-shadow:
    inset 0 0 0 1px rgba(255, 225, 159, 0.12),
    0 22px 58px rgba(0, 0, 0, 0.58);
  backdrop-filter: blur(8px) saturate(0.82);
  scrollbar-width: thin;
  scrollbar-color: rgba(215, 166, 76, 0.72) rgba(255, 255, 255, 0.05);
}

.capsule-form-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 6px;
  border-bottom: 1px solid rgba(225, 177, 88, 0.38);
  padding-bottom: 9px;
}

.capsule-form-header span {
  color: #dba94f;
  font-size: clamp(9px, 0.7vw, 12px);
  font-weight: 800;
  text-transform: uppercase;
}

.capsule-form-header strong {
  color: #ffe1a0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(15px, 1.25vw, 22px);
  font-weight: 500;
}

.journey-form .form-intro {
  margin: 0 0 12px;
  font-family: Georgia, serif;
  font-size: clamp(13px, 1.1vw, 18px);
  line-height: 1.35;
}

#lettre-2036 .form-intro {
  margin-bottom: 10px;
  color: rgba(255, 235, 191, 0.78);
  font-size: clamp(11px, 0.82vw, 14px);
}

.journey-form > label,
.form-fields-row > label {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin-bottom: 10px;
  color: inherit;
  font-size: clamp(11px, 0.85vw, 14px);
  font-weight: 800;
}

.form-fields-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.8fr);
  gap: 12px;
  align-items: end;
}

.journey-form input:not([type="radio"]):not([type="checkbox"]),
.journey-form select,
.journey-form textarea {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid rgba(71, 42, 21, 0.5);
  border-radius: 4px;
  padding: 8px 10px;
  background: rgba(255, 248, 226, 0.78);
  color: #24150b;
  font: inherit;
}

#lettre-2036 .journey-form input:not([type="radio"]):not([type="checkbox"]),
#lettre-2036 .journey-form select,
#lettre-2036 .journey-form textarea {
  border-color: rgba(235, 190, 105, 0.44);
  background: rgba(255, 244, 213, 0.9);
}

.journey-form textarea {
  min-height: 74px;
  resize: vertical;
}

.envelope-choices,
.capsule-prompts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 12px;
}

.envelope-choices label {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(76, 43, 18, 0.38);
  border-radius: 4px;
  padding: 7px;
  background: rgba(255, 247, 221, 0.5);
  font-size: clamp(10px, 0.75vw, 13px);
  cursor: pointer;
}

.envelope-choices input,
.inline-check input {
  accent-color: #8b2e18;
}

.journey-form .inline-check {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  margin-bottom: 10px;
  text-transform: none;
}

.capsule-prompts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 10px;
}

.capsule-prompts button {
  min-height: 34px;
  border: 1px solid rgba(226, 179, 90, 0.44);
  border-radius: 4px;
  padding: 5px 7px;
  background: rgba(255, 244, 213, 0.07);
  color: #f7dfad;
  font-size: clamp(9px, 0.68vw, 12px);
  transition: border-color 150ms ease, background 150ms ease, color 150ms ease;
}

.capsule-prompts button:hover,
.capsule-prompts button:focus-visible {
  border-color: rgba(255, 216, 135, 0.9);
  background: rgba(211, 151, 57, 0.2);
  color: #fff0c7;
  outline: none;
}

#lettre-2036 .form-fields-row {
  grid-template-columns: minmax(0, 0.8fr) minmax(220px, 1.2fr);
  gap: 10px;
}

#lettre-2036 .journey-form > label,
#lettre-2036 .form-fields-row > label {
  margin-bottom: 8px;
  color: rgba(255, 229, 177, 0.88);
  font-size: clamp(10px, 0.74vw, 13px);
}

#lettre-2036 .journey-form input:not([type="radio"]):not([type="checkbox"]),
#lettre-2036 .journey-form select,
#lettre-2036 .journey-form textarea {
  min-height: 36px;
  border-color: rgba(224, 177, 88, 0.5);
  padding: 7px 9px;
  background: rgba(255, 247, 223, 0.94);
  box-shadow: inset 0 1px 2px rgba(70, 38, 14, 0.16);
}

#lettre-2036 .journey-form input:focus,
#lettre-2036 .journey-form select:focus,
#lettre-2036 .journey-form textarea:focus {
  border-color: #dca64a;
  outline: 2px solid rgba(220, 166, 74, 0.22);
  outline-offset: 1px;
}

#lettre-2036 .journey-form textarea {
  min-height: clamp(76px, 10vh, 112px);
}

.capsule-file input {
  padding: 6px;
}

#lettre-2036 .capsule-file.file-dropzone {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 42px;
  margin-bottom: 8px;
  border: 1px dashed rgba(225, 177, 88, 0.42);
  border-radius: 4px;
  padding: 5px 8px;
  background: rgba(255, 238, 196, 0.06);
  color: rgba(255, 229, 177, 0.88);
}

#lettre-2036 .capsule-file.file-dropzone input[type="file"] {
  min-height: 30px;
  padding: 3px 5px;
  font-size: 10px;
}

.capsule-submit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: clamp(10px, 0.75vw, 13px);
}

#lettre-2036 .capsule-submit-row {
  border-top: 1px solid rgba(225, 177, 88, 0.34);
  padding-top: 10px;
  color: rgba(255, 235, 192, 0.78);
}

#lettre-2036 .capsule-submit-row > span strong {
  color: #f2bc58;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45em;
}

#lettre-2036 .stamp-action {
  flex: 0 0 auto;
  min-width: 190px;
  border: 1px solid #d9a44a;
  background: #7b2d1f;
  color: #fff0c6;
  box-shadow: 0 7px 18px rgba(0, 0, 0, 0.3);
}

#lettre-2036 .stamp-action:hover,
#lettre-2036 .stamp-action:focus-visible {
  background: #963724;
  outline: 2px solid rgba(233, 187, 98, 0.35);
  outline-offset: 2px;
}

.stamp-action {
  min-height: 40px;
  border-radius: 4px;
}

.submission-stamp {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  width: max-content;
  max-width: 88%;
  border: 5px double currentColor;
  border-radius: 8px;
  padding: 10px 16px;
  color: #a12d1e;
  font-family: Georgia, serif;
  font-size: clamp(18px, 2.5vw, 42px);
  font-weight: 900;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) rotate(-8deg) scale(2.2);
}

.submission-stamp.show {
  animation: stamp-arrival 850ms ease-out both;
}

@keyframes stamp-arrival {
  0% { opacity: 0; transform: translate(-50%, -50%) rotate(-8deg) scale(2.2); }
  55% { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(0.92); }
  75%, 100% { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(1); }
}

.gift-deposit-animation,
.gift-qrcode,
.gift-deposit-confirm,
.gift-online-link,
.gift-followup,
.remote-gift-panel {
  position: absolute;
  z-index: 6;
  box-sizing: border-box;
}

.gift-deposit-animation {
  left: 24%;
  top: 24%;
  width: 55%;
  height: 44%;
  overflow: hidden;
  pointer-events: none;
}

.gift-envelope,
.gift-stamp,
.gift-plane {
  position: absolute;
  display: block;
  object-fit: contain;
  border: 0;
  background: transparent;
}

.gift-envelope {
  left: 11%;
  top: 25%;
  width: 28%;
  height: 28%;
  animation: gift-envelope-loop 7s ease-in-out infinite;
}

.gift-stamp {
  left: 27%;
  top: 40%;
  width: 25%;
  height: 18%;
  font-weight: 900;
  opacity: 0;
  transform: rotate(-9deg);
  animation: gift-stamp-loop 7s ease-in-out infinite;
}

.gift-plane {
  left: 58%;
  top: 27%;
  width: 30%;
  height: 28%;
  animation: gift-plane-loop 7s ease-in-out infinite;
}

.gift-qrcode {
  left: 83%;
  top: 42%;
  z-index: 7;
  display: block;
  width: 13%;
  height: 18%;
  object-fit: contain;
  background: transparent;
}

.gift-deposit-confirm,
.gift-online-link {
  border: 1px solid transparent;
  padding: 0;
  background: rgba(255, 255, 255, 0.001);
  color: transparent;
  cursor: pointer;
}

.gift-deposit-confirm {
  left: 29%;
  top: 72%;
  width: 42%;
  height: 11%;
}

.gift-online-link {
  left: 82%;
  top: 59%;
  width: 15.5%;
  height: 5.5%;
}

.gift-deposit-confirm:hover,
.gift-deposit-confirm:focus-visible,
.gift-online-link:hover,
.gift-online-link:focus-visible {
  border-color: rgba(255, 218, 122, 0.8);
  box-shadow: 0 0 30px rgba(228, 170, 68, 0.42);
  outline: none;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-envelope {
  animation: gift-envelope-depart var(--gift-envelope-duration, 1.7s) ease-in forwards;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  animation: gift-stamp-hit var(--gift-stamp-duration, 0.9s) var(--gift-stamp-delay, 2.05s) ease-out both;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-plane {
  animation: gift-plane-depart var(--gift-plane-duration, 1.7s) var(--gift-plane-delay, 0.3s) ease-in forwards;
}

.gift-followup {
  left: 24%;
  top: 27%;
  width: 55%;
  height: 42%;
  border: 1px solid rgba(230, 184, 93, 0.72);
  border-radius: 8px;
  padding: clamp(18px, 2vw, 32px);
  background: rgba(32, 18, 9, 0.92);
  color: #ffe7ad;
  text-align: center;
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.58);
  backdrop-filter: none;
}

.gift-followup[hidden] {
  display: none;
}

.gift-success-stamp {
  display: inline-block;
  border: 4px double #bd5131;
  padding: 7px 12px;
  color: #e17c5a;
  font-family: Georgia, serif;
  font-weight: 900;
  transform: rotate(-5deg);
}

.gift-followup h3 {
  margin: 18px 0 8px;
  font-family: Georgia, serif;
  font-size: clamp(20px, 2vw, 34px);
}

.gift-followup p {
  margin: 0 auto 18px;
  max-width: 650px;
  line-height: 1.4;
}

.gift-followup > div:last-child,
.remote-gift-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.gift-followup button,
.remote-gift-options button {
  min-height: 44px;
  border: 1px solid rgba(229, 187, 104, 0.58);
  border-radius: 5px;
  background: rgba(216, 159, 65, 0.14);
  color: #ffe7ad;
  font-weight: 800;
}

.remote-gift-panel {
  left: 27%;
  top: 20%;
  width: 46%;
  height: 62%;
  border: 1px solid rgba(225, 177, 88, 0.64);
  border-radius: 8px;
  padding: clamp(22px, 3vw, 48px);
  background: rgba(22, 13, 8, 0.9);
  color: #ffe7ad;
  text-align: center;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58);
  backdrop-filter: none;
}

.remote-gift-panel > p {
  margin: 0;
  color: #e5ae52;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.remote-gift-panel h2 {
  margin: 10px 0 26px;
  font-family: Georgia, serif;
  font-size: clamp(28px, 3vw, 50px);
}

.remote-gift-panel small {
  display: block;
  margin-top: 18px;
  color: rgba(255, 235, 190, 0.72);
}

.remote-gift-details {
  min-height: 180px;
  margin-top: 20px;
  padding: 18px;
  border: 1px solid rgba(229, 187, 104, 0.34);
  border-radius: 6px;
  background: rgba(255, 231, 173, 0.08);
  color: rgba(255, 239, 202, 0.92);
  text-align: left;
}

.remote-gift-details strong {
  display: block;
  margin-bottom: 10px;
  color: #ffe1a0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 1.6vw, 28px);
}

.remote-gift-details p {
  margin: 8px 0;
}

.remote-gift-details .missing-info {
  color: #ffcc72;
  font-weight: 900;
}

.remote-gift-details .remote-warning {
  color: #ffe8b2;
  font-style: italic;
}

.remote-gift-options button.active {
  background: rgba(229, 187, 104, 0.34);
  box-shadow: 0 0 0 1px rgba(255, 232, 170, 0.35), 0 0 20px rgba(229, 187, 104, 0.2);
}

.remote-payment-fields input {
  width: 100%;
}

@keyframes gift-envelope-loop {
  0%, 12%, 100% { transform: translateX(0) rotate(-2deg); }
  44%, 62% { transform: translateX(48%) rotate(1deg); }
}

@keyframes gift-stamp-loop {
  0%, 28%, 100% { opacity: 0; transform: rotate(-9deg) scale(1.8); }
  38%, 58% { opacity: 0.72; transform: rotate(-9deg) scale(1); }
  70% { opacity: 0; transform: rotate(-9deg) scale(1); }
}

@keyframes gift-plane-loop {
  0%, 48%, 100% { transform: translate(0, 0) rotate(-8deg); opacity: 0.82; }
  78% { transform: translate(90%, -28%) rotate(-4deg); opacity: 1; }
  90% { transform: translate(150%, -45%) rotate(-2deg); opacity: 0; }
}

@keyframes gift-envelope-depart {
  to { transform: translate(170%, -20%) scale(0.45) rotate(8deg); opacity: 0; }
}

@keyframes gift-stamp-hit {
  0% { opacity: 0; transform: rotate(-9deg) scale(2.2); }
  60%, 100% { opacity: 1; transform: rotate(-9deg) scale(1); }
}

@keyframes gift-plane-depart {
  to { transform: translate(180%, -60%) rotate(-3deg); opacity: 0; }
}

.page-content-settings {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.page-content-settings article {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  padding: 12px;
  background: #fff;
}

.page-content-settings span {
  color: #667085;
  font-size: 13px;
}

@media (max-width: 900px) {
  .page-media-grid,
  .page-content-settings {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .form-fields-row {
    grid-template-columns: 1fr;
  }

  .capsule-prompts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .page-media-grid,
  .page-content-settings,
  .envelope-choices {
    grid-template-columns: 1fr;
  }
}

/* Studio souvenir: every control is an independent calibratable overlay. */
.studio-camera-stage,
.studio-mode-toggle,
.studio-capture,
.studio-background-panel,
.studio-camera-toggle {
  position: absolute;
  z-index: 6;
  box-sizing: border-box;
  margin: 0;
}

.studio-camera-stage {
  left: 21.8%;
  top: 19%;
  width: 50.6%;
  height: 43.5%;
  overflow: hidden;
  border: 1px solid rgba(255, 222, 151, 0.62);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.76);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.48);
}

#studioBackdrop,
#cameraPreview {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  object-fit: cover;
}

#studioBackdrop {
  z-index: 0;
}

#cameraPreview {
  z-index: 1;
  background: #050505;
  transition: inset 180ms ease, width 180ms ease, height 180ms ease;
}

.studio-camera-stage.has-studio-background #cameraPreview {
  inset: 7% 5.5%;
  width: 89%;
  height: 86%;
  border: 4px solid rgba(15, 10, 7, 0.62);
  border-radius: 6px;
}

.camera-placeholder {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: grid;
  margin: 0;
  place-items: center;
  background: rgba(4, 6, 7, 0.58);
  color: rgba(255, 229, 166, 0.78);
  font-size: clamp(14px, 1.3vw, 22px);
  pointer-events: none;
}

.studio-camera-stage.camera-active .camera-placeholder {
  display: none;
}
.studio-photo-flash {
  position: absolute;
  z-index: 8;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: #fff;
}

.studio-camera-stage.studio-photo-flashing .studio-photo-flash {
  animation: studio-photo-flash 520ms ease-out both;
}

.studio-capture-feedback {
  position: absolute;
  z-index: 9;
  top: 4%;
  left: 50%;
  display: flex;
  max-width: 90%;
  align-items: center;
  gap: clamp(7px, 0.8vw, 12px);
  padding: clamp(7px, 0.7vw, 11px) clamp(12px, 1.25vw, 20px);
  border: 1px solid rgba(255, 230, 172, 0.76);
  border-radius: 999px;
  color: #fff6d8;
  background: rgba(18, 12, 9, 0.88);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.46);
  font-size: clamp(12px, 1.05vw, 18px);
  text-align: center;
  transform: translateX(-50%);
  pointer-events: none;
  backdrop-filter: blur(5px);
}

.studio-capture-feedback[hidden] {
  display: none;
}

.studio-capture-feedback strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-capture-feedback-dot {
  flex: 0 0 auto;
  width: clamp(10px, 0.9vw, 15px);
  height: clamp(10px, 0.9vw, 15px);
  border-radius: 50%;
  background: #efc05b;
  box-shadow: 0 0 12px currentColor;
}

.studio-capture-feedback[data-state="recording"] {
  border-color: rgba(255, 105, 94, 0.92);
  color: #fff;
  background: rgba(76, 8, 7, 0.91);
}

.studio-capture-feedback[data-state="recording"] .studio-capture-feedback-dot {
  color: #ff5147;
  background: currentColor;
  animation: studio-recording-dot 900ms ease-in-out infinite;
}

.studio-capture-feedback[data-state="saving"] .studio-capture-feedback-dot {
  color: #ffb938;
  background: currentColor;
  animation: studio-saving-dot 720ms ease-in-out infinite;
}

.studio-capture-feedback[data-state="success"] {
  border-color: rgba(125, 235, 159, 0.88);
  color: #effff2;
  background: rgba(12, 73, 38, 0.92);
}

.studio-capture-feedback[data-state="success"] .studio-capture-feedback-dot {
  color: #66df8c;
  background: currentColor;
}

.studio-capture-feedback[data-state="error"] {
  border-color: rgba(255, 118, 96, 0.92);
  color: #fff4ef;
  background: rgba(102, 19, 12, 0.94);
}

.studio-capture-feedback[data-state="error"] .studio-capture-feedback-dot {
  color: #ff6b58;
  background: currentColor;
}

.studio-camera-stage.studio-recording-active {
  animation: studio-recording-frame 1.2s ease-in-out infinite;
}

.studio-camera-stage.studio-recording-saving {
  box-shadow: 0 0 0 3px rgba(255, 187, 56, 0.78), 0 16px 38px rgba(0, 0, 0, 0.48);
}

@keyframes studio-photo-flash {
  0% { opacity: 0; }
  12% { opacity: 0.96; }
  34% { opacity: 0.72; }
  100% { opacity: 0; }
}

@keyframes studio-recording-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.28; transform: scale(0.72); }
}

@keyframes studio-saving-dot {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}

@keyframes studio-recording-frame {
  0%, 100% { box-shadow: 0 0 0 2px rgba(255, 68, 57, 0.88), 0 16px 38px rgba(0, 0, 0, 0.48); }
  50% { box-shadow: 0 0 0 5px rgba(255, 68, 57, 0.42), 0 0 28px rgba(255, 45, 34, 0.55), 0 16px 38px rgba(0, 0, 0, 0.48); }
}

@media (prefers-reduced-motion: reduce) {
  .studio-camera-stage.studio-photo-flashing .studio-photo-flash,
  .studio-camera-stage.studio-recording-active,
  .studio-capture-feedback[data-state="recording"] .studio-capture-feedback-dot,
  .studio-capture-feedback[data-state="saving"] .studio-capture-feedback-dot {
    animation-duration: 1ms;
    animation-iteration-count: 1;
  }
}

.studio-camera-help {
  position: absolute;
  z-index: 5;
  inset: 7%;
  overflow: auto;
  border: 1px solid rgba(255, 209, 116, 0.78);
  border-radius: 10px;
  padding: clamp(12px, 2vw, 24px);
  background: rgba(20, 14, 10, 0.94);
  color: #fff1c9;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.56);
}

.studio-camera-help[hidden] {
  display: none;
}

.studio-camera-help strong {
  display: block;
  margin-bottom: 8px;
  color: #ffd981;
  font-size: clamp(15px, 1.35vw, 21px);
}

.studio-camera-help p {
  margin: 7px 0;
  font-size: clamp(12px, 0.92vw, 16px);
  line-height: 1.4;
}

.studio-camera-help-browser {
  color: rgba(255, 239, 200, 0.78);
}

.studio-camera-help-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.studio-camera-help-actions button {
  min-height: 34px;
  border: 1px solid rgba(255, 220, 142, 0.62);
  border-radius: 7px;
  padding: 7px 14px;
  background: #7b4d20;
  color: #fff6dc;
  font-weight: 800;
  cursor: pointer;
}

.studio-camera-help-actions button:hover,
.studio-camera-help-actions button:focus-visible {
  background: #a76a29;
}

.studio-capture {
  min-height: 38px;
  border-radius: 8px;
  padding: 0 12px;
  font-size: clamp(11px, 0.85vw, 15px);
}

.studio-capture {
  left: 40.8%;
  top: 72.2%;
  width: 14.5%;
  height: 17.5%;
  min-height: 0;
  border-radius: 50%;
  padding: 0;
  background: rgba(215, 151, 57, 0.24);
  line-height: 1;
  box-shadow: inset 0 0 0 3px rgba(255, 226, 155, 0.34), 0 0 28px rgba(230, 165, 66, 0.35);
}

.studio-capture img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.studio-capture.recording {
  border-color: #f97066;
  background: #9f2d27;
  color: #fff;
}

.studio-mode-toggle {
  left: 32.5%;
  top: 64.5%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 31.5%;
  height: 6%;
  min-height: 38px;
  overflow: hidden;
  border: 1px solid rgba(229, 187, 104, 0.58);
  border-radius: 8px;
  background: rgba(5, 8, 10, 0.78);
}

.studio-mode-toggle button {
  position: relative;
  min-width: 0;
  border: 0;
  border-right: 1px solid rgba(229, 187, 104, 0.32);
  border-radius: 0;
  padding: 0 8px;
  background: transparent;
  color: rgba(255, 235, 189, 0.72);
  font-size: clamp(11px, 0.8vw, 14px);
  font-weight: 800;
}

.studio-mode-toggle button img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.studio-mode-toggle button img:not([hidden]) + span {
  opacity: 0;
}

.studio-mode-toggle button:last-child {
  border-right: 0;
}

.studio-mode-toggle button.active {
  background: rgba(206, 151, 56, 0.3);
  color: #fff0c8;
  box-shadow: inset 0 -3px #dfa94c;
}

.studio-camera-toggle {
  left: 0;
  top: 88%;
  width: 9%;
  height: 12%;
  border: 0;
  padding: 0;
  background: transparent;
  color: transparent;
  opacity: 0;
  cursor: default;
}

.studio-background-panel {
  left: 73.4%;
  top: 24%;
  width: 24.4%;
  height: 49%;
  overflow: auto;
  border: 0;
  border-radius: 8px;
  padding: 64px 18px 16px;
  background: transparent;
  color: #301909;
  backdrop-filter: none;
}

.studio-background-panel h3 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

.studio-background-upload {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(225, 177, 88, 0.54);
  border-radius: 5px;
  padding: 6px 9px;
  background: rgba(255, 242, 205, 0.72);
  color: #351b09;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.studio-background-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.studio-background-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 9px;
}

.studio-background-list article {
  position: relative;
  min-width: 0;
  aspect-ratio: 4 / 3;
  border: 1px solid transparent;
  border-radius: 4px;
}

.studio-background-list article.active {
  border-color: #f2bd5c;
  box-shadow: 0 0 0 2px rgba(242, 189, 92, 0.22);
}

.studio-background-list article > button:first-child,
.studio-background-none {
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 3px;
  padding: 0;
  background: #1c1712;
  color: #ffe7ad;
}

.capsule-object-note {
  display: grid;
  grid-template-columns: minmax(190px, 0.8fr) minmax(220px, 1fr);
  gap: 8px 14px;
  margin: 4px 0 9px;
  border-top: 1px solid rgba(225, 177, 88, 0.28);
  border-bottom: 1px solid rgba(225, 177, 88, 0.28);
  padding: 9px 2px;
  background: transparent;
}

.capsule-object-note > label {
  min-width: 0;
  margin: 0;
  color: rgba(255, 229, 177, 0.88);
  font-size: clamp(10px, 0.74vw, 13px);
  font-weight: 800;
}

.capsule-object-note .inline-check {
  min-height: 36px;
  margin: 0;
}

.capsule-object-note p {
  grid-column: 1 / -1;
  margin: 0;
  color: rgba(255, 236, 190, 0.82);
  font-size: 10px;
  line-height: 1.25;
}

@media (max-width: 900px) {
  .capsule-object-note {
    grid-template-columns: 1fr;
  }

  .capsule-object-note p {
    grid-column: 1;
  }

  #lettre-2036 .capsule-submit-row {
    align-items: stretch;
    flex-direction: column;
  }

  #lettre-2036 .stamp-action {
    width: 100%;
  }
}

.detail-page {
  --page-background-brightness: 1;
  overflow: hidden;
  background: #080604;
}

.detail-page::before {
  display: block;
}

#mariage-messages {
  --page-background-brightness: 1;
}

.detail-page-panel {
  position: absolute;
  z-index: 6;
  left: 8%;
  top: 10%;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  box-sizing: border-box;
  width: 84%;
  height: 78%;
  overflow: hidden;
  border: 1px solid rgba(232, 188, 99, 0.68);
  border-radius: 8px;
  padding: clamp(16px, 2vw, 30px);
  background: rgba(8, 6, 4, 0.82);
  color: #ffe7ad;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.58);
  backdrop-filter: none;
}

.detail-page-kicker {
  margin: 0 0 5px;
  color: rgba(239, 188, 92, 0.88);
  font-size: clamp(10px, 0.8vw, 14px);
  font-weight: 800;
  text-transform: uppercase;
}

.detail-page-panel h2 {
  margin: 0;
  color: #ffe2a0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 2.8vw, 48px);
  letter-spacing: 0;
}

.detail-page-copy {
  margin: 8px 0 16px;
  color: rgba(255, 244, 214, 0.82);
  font-size: clamp(13px, 1vw, 18px);
  line-height: 1.4;
}

.detail-page-media {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
}

.detail-page-media img,
.detail-page-media video {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 1px solid rgba(255, 226, 164, 0.46);
  border-radius: 5px;
  background: #050403;
  object-fit: contain;
}

.detail-page-media audio {
  width: 100%;
}

#mariage-film .detail-page-panel,
#mariage-messages .detail-page-panel {
  display: block;
  border: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

#mariage-messages .detail-page-panel {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#mariage-poeme .detail-page-panel {
  display: block;
  overflow: visible;
  border: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

#mariage-poeme .detail-page-kicker,
#mariage-poeme .detail-page-panel > h2,
#mariage-poeme .detail-page-media {
  display: none;
}

#mariage-poeme .detail-page-copy {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  color: #4b241c;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.28cqw);
  font-style: italic;
  line-height: 1.55;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 232, 184, 0.32);
}

#mariage-poeme .poem-page {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(18px, 2.6cqw, 52px);
  padding: 0.4cqw;
  white-space: pre-wrap;
  opacity: 0;
  transform: translateX(4%);
  transition: opacity 900ms ease, transform 900ms ease;
}

#mariage-poeme .poem-column {
  display: block;
  min-width: 0;
  white-space: pre-wrap;
}

#mariage-poeme .poem-page.active {
  opacity: 1;
  transform: translateX(0);
}

#mariage-poeme::before {
  z-index: 2;
}

#poemBouquetPhoto {
  position: absolute;
  z-index: 1;
  display: block;
  object-fit: cover;
  background: transparent;
  pointer-events: none;
}

#poemBouquetPhoto[hidden] {
  display: none;
}

.background-normalization-switch {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 14px 0 6px;
  border: 1px solid #c6d2cf;
  border-radius: 6px;
  padding: 10px 12px;
  background: #f6f9f8;
  color: #173b37;
  font-weight: 750;
}

.background-normalization-switch input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #2f6f68;
}

@media (max-width: 700px) {
  #mariage-poeme .poem-page {
    grid-template-columns: 1fr;
  }
}

#mariage-film .detail-page-kicker,
#mariage-film .detail-page-panel > h2,
#mariage-film .detail-page-copy,
#mariage-messages .detail-page-kicker,
#mariage-messages .detail-page-panel > h2,
#mariage-messages .detail-page-copy {
  display: none;
}

#mariage-film .detail-page-media,
#mariage-messages .detail-page-media {
  grid-template-columns: 1fr;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 0;
}

#mariage-messages .detail-page-media {
  position: absolute;
  inset: 0;
  display: block;
}

.studio-background-none {
  aspect-ratio: 4 / 3;
  border: 1px dashed rgba(255, 231, 173, 0.44);
  font-size: 10px;
}

.studio-background-none.active {
  border-color: #f2bd5c;
  background: rgba(218, 163, 74, 0.2);
}

.studio-background-list img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.studio-background-list [data-remove-studio-background] {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 18px;
  height: 18px;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 50%;
  padding: 0;
  background: rgba(112, 24, 18, 0.92);
  color: transparent;
}

.studio-background-list [data-remove-studio-background]::before,
.studio-background-list [data-remove-studio-background]::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 8px;
  height: 1px;
  background: #fff;
  transform: rotate(45deg);
}

.studio-background-list [data-remove-studio-background]::after {
  transform: rotate(-45deg);
}

.studio-gallery-panel .media-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.studio-gallery-panel .media-list img,
.studio-gallery-panel .media-list video {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 4px;
  object-fit: cover;
}

@media (max-width: 760px) {
  .studio-background-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Interactive editorial zones on the five memory pages. */
.experience-layer {
  position: absolute;
  z-index: 6;
  inset: 0;
  pointer-events: none;
}

.experience-hotspot {
  position: absolute;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
  pointer-events: auto;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.experience-hotspot:hover,
.experience-hotspot:focus-visible {
  border-color: rgba(255, 220, 145, 0.68);
  outline: none;
  background: rgba(255, 223, 151, 0.07);
  box-shadow: inset 0 0 34px rgba(255, 220, 145, 0.08), 0 0 18px rgba(0, 0, 0, 0.3);
}

.experience-hotspot > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.experience-action-button {
  display: grid;
  place-items: center;
  border-color: rgba(229, 180, 91, 0.68);
  padding: 5px 12px;
  background: rgba(10, 8, 5, 0.72);
  color: #ffe4a5;
  font-family: Georgia, serif;
  font-size: clamp(10px, 0.85vw, 15px);
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
}

.experience-action-button > span {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
}

.experience-viewer {
  width: min(1080px, 88vw);
  max-height: 86vh;
  overflow: auto;
  border: 1px solid rgba(218, 165, 76, 0.78);
  border-radius: 8px;
  padding: clamp(22px, 3vw, 42px);
  background:
    linear-gradient(rgba(246, 224, 181, 0.96), rgba(220, 183, 123, 0.96)),
    #e6c58e;
  color: #2f1c0d;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.72);
}

.experience-viewer::backdrop {
  background: rgba(2, 4, 5, 0.88);
  backdrop-filter: blur(5px);
}

.experience-viewer-close {
  position: absolute;
  top: 10px;
  right: 10px;
  min-height: 32px;
  border: 1px solid rgba(80, 46, 19, 0.45);
  border-radius: 4px;
  background: rgba(53, 30, 12, 0.88);
  color: #ffe6ae;
}

.experience-viewer-kicker {
  margin: 0 0 5px;
  color: #8a5420;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.experience-viewer h2 {
  margin: 0;
  font-family: Georgia, serif;
  font-size: clamp(25px, 3vw, 48px);
  letter-spacing: 0;
}

.experience-viewer-copy {
  max-width: 780px;
  margin: 12px 0 22px;
  white-space: pre-line;
  font-size: clamp(15px, 1.25vw, 20px);
  line-height: 1.5;
}

.experience-viewer-media {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.experience-viewer-media img,
.experience-viewer-media video {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 7px solid rgba(255, 248, 226, 0.88);
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 8px 18px rgba(55, 28, 7, 0.25);
}

.experience-viewer-media audio {
  width: 100%;
  align-self: center;
}

.experience-media-empty {
  grid-column: 1 / -1;
  min-height: 130px;
  border: 1px dashed rgba(87, 48, 18, 0.36);
  border-radius: 5px;
  padding: 34px;
  text-align: center;
}

.experience-locked {
  grid-column: 1 / -1;
  display: grid;
  min-height: 210px;
  place-items: center;
  align-content: center;
  gap: 12px;
  border: 3px double #9c3024;
  background: rgba(102, 25, 18, 0.08);
  color: #7f251d;
  text-align: center;
}

.experience-locked strong {
  font-size: clamp(24px, 3vw, 44px);
}

.experience-viewer-action {
  margin-top: 18px;
}

.experience-viewer-action button {
  min-height: 42px;
  border: 1px solid #7f251d;
  border-radius: 4px;
  padding: 0 18px;
  background: #7f251d;
  color: #fff1d3;
  font-weight: 900;
}

/* Small memory that follows the visitor through the public experience. */
.global-memory-module {
  position: fixed;
  z-index: 65;
  left: 2%;
  top: 88%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  box-sizing: border-box;
  width: 24%;
  height: 8%;
  min-height: 58px;
  overflow: hidden;
  border: 1px solid rgba(219, 168, 78, 0.5);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(3, 8, 10, 0.78);
  color: #fff0c6;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(8px);
}

.app-shell[data-view="admin"] .global-memory-module {
  display: none;
}

.global-memory-media:empty {
  display: none;
}

.global-memory-media img,
.global-memory-media video {
  display: block;
  width: 52px;
  height: 42px;
  border-radius: 4px;
  object-fit: cover;
}

.global-memory-media audio {
  width: 90px;
  height: 32px;
}

.global-memory-module small {
  display: block;
  color: #d8a64d;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.global-memory-module p {
  display: -webkit-box;
  margin: 2px 0 0;
  overflow: hidden;
  color: #fff0c6;
  font-family: Georgia, serif;
  font-size: var(--overlay-font-size, clamp(11px, 0.85vw, 15px));
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.global-memory-module > button {
  width: 30px;
  height: 30px;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(226, 177, 87, 0.54);
  border-radius: 50%;
  padding: 0;
  background: transparent;
  color: transparent;
}

.global-memory-module > button::before {
  content: ">";
  color: #ffe3a2;
  font-size: 18px;
}


.memory-card-settings {
  display: grid;
  gap: 14px;
}

.memory-card-layout-settings {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  padding: 12px;
  border: 1px solid #d6dedb;
  border-radius: 8px;
  background: #f7fbfa;
}

.memory-card-layout-settings label,
.memory-card-editor label {
  display: grid;
  gap: 6px;
  color: #24423c;
  font-size: 12px;
  font-weight: 900;
}

.memory-card-layout-settings input,
.memory-card-editor textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #bdcbc7;
  border-radius: 6px;
  padding: 8px;
  background: #fff;
  color: #182230;
  font: inherit;
}

.memory-card-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 12px;
}

.memory-card-editor {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid #d4ddd9;
  border-left: 4px solid #bd8d34;
  border-radius: 8px;
  padding: 12px;
  background: #fffdf8;
}

.memory-card-editor header {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
}

.memory-card-editor header strong {
  color: #183f37;
}

.memory-card-media-preview {
  min-height: 34px;
}

.memory-card-media-preview small {
  color: #667085;
}

.memory-card-media-preview .admin-media-preview {
  margin: 0;
}
/* Editorial content editor in Settings. */
.experience-settings {
  display: grid;
  gap: 10px;
}

.experience-settings details {
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #fff;
}

.experience-settings summary {
  padding: 12px 14px;
  color: #182230;
  font-weight: 900;
  cursor: pointer;
}

.experience-setting-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 12px 12px;
}

.experience-setting-list article {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid #eaecf0;
  border-radius: 6px;
  padding: 12px;
  background: #f9fafb;
}

.experience-setting-list label,
.global-memory-settings label {
  display: grid;
  gap: 5px;
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}

.experience-setting-list input[type="text"],
.experience-setting-list textarea,
.global-memory-settings textarea {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #d0d5dd;
  border-radius: 5px;
  padding: 8px;
  background: #fff;
  color: #182230;
  font: inherit;
}

.experience-setting-list span,
.global-memory-settings span {
  color: #667085;
  font-size: 12px;
}

.global-memory-settings {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr);
  gap: 12px;
  align-items: end;
}

@media (max-width: 820px) {
  .experience-viewer-media,
  .experience-setting-list,
  .global-memory-settings {
    grid-template-columns: 1fr;
  }

  .global-memory-module {
    min-width: 250px;
  }
}

/* Reusable mixed-media masonry galleries. */
.detail-page-media.masonry-media-grid,
.filtered-gallery-media.masonry-media-grid {
  display: block;
  -webkit-column-count: var(--masonry-columns, 4);
  column-count: var(--masonry-columns, 4);
  -webkit-column-gap: var(--masonry-gap, 12px);
  column-gap: var(--masonry-gap, 12px);
  min-height: 0;
  overflow: auto;
  padding: 2px 6px 2px 2px;
}

.masonry-media-tile {
  position: relative;
  display: block;
  width: 100%;
  margin: 0 0 var(--masonry-gap, 12px);
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
  page-break-inside: avoid;
  overflow: hidden;
  border: var(--masonry-border-width, 1px) solid rgba(255, 226, 164, 0.52);
  border-radius: var(--masonry-radius, 6px);
  padding: 0;
  background: #080705;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  cursor: pointer;
  transform: translateZ(0);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 180ms ease;
}

.masonry-media-tile:hover,
.masonry-media-tile:focus-visible {
  z-index: 2;
  border-color: rgba(255, 220, 138, 0.92);
  outline: none;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.5), 0 0 22px rgba(213, 157, 60, 0.2);
  transform: scale(var(--masonry-hover-scale, 1.025));
}

.detail-page-media .masonry-media-tile img,
.detail-page-media .masonry-media-tile video,
.filtered-gallery-media .masonry-media-tile img,
.filtered-gallery-media .masonry-media-tile video {
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 0;
  background: #050403;
  object-fit: cover;
}

.detail-page-media .masonry-media-tile img,
.filtered-gallery-media .masonry-media-tile img {
  aspect-ratio: auto;
}

.detail-page-media .masonry-media-tile video,
.filtered-gallery-media .masonry-media-tile video {
  aspect-ratio: 16 / 9;
}

/* Dedicated marriage players and recovered 2006 messages. */
.marriage-message-video-zone,
.marriage-message-slider-zone {
  position: absolute;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.marriage-message-video-zone > .marriage-video-player,
.marriage-message-slider-zone > .marriage-message-frame {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.marriage-video-player {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(238, 197, 112, 0.72);
  border-radius: 6px;
  background: rgba(3, 3, 3, 0.92);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);
}

.marriage-video-frame {
  position: relative;
  display: grid;
  min-height: 0;
  place-items: center;
  overflow: hidden;
  background: #050403;
}

.detail-page-media .marriage-video-frame video {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  object-fit: contain;
  transform: translate(var(--player-video-offset-x, 0%), var(--player-video-offset-y, 0%)) scale(var(--player-video-scale, 1));
  transform-origin: center;
  will-change: transform;
}

.marriage-video-status {
  position: absolute;
  left: 50%;
  bottom: 16px;
  z-index: 2;
  max-width: min(84%, 560px);
  margin: 0;
  border: 1px solid rgba(239, 190, 96, 0.52);
  border-radius: 6px;
  padding: 9px 13px;
  background: rgba(8, 7, 5, 0.82);
  color: #ffe0a1;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
  transform: translateX(-50%);
  pointer-events: none;
}

.marriage-video-status[hidden] {
  display: none;
}

.marriage-video-controls {
  display: grid;
  grid-template-columns: 42px 42px minmax(140px, 1fr) auto minmax(90px, 0.25fr) auto;
  gap: 9px;
  align-items: center;
  min-height: 54px;
  padding: 8px 10px;
  background: linear-gradient(#21170d, #0c0906);
}

.marriage-video-controls button {
  min-width: 36px;
  height: 36px;
  border: 1px solid rgba(232, 187, 95, 0.58);
  border-radius: 4px;
  padding: 0 8px;
  background: #16100a;
  color: #f5cf7c;
  font-weight: 800;
}

.marriage-video-controls button.active,
.marriage-video-controls button:hover,
.marriage-video-controls button:focus-visible {
  border-color: #f4cc72;
  background: #5b3814;
  color: #fff2c5;
}

.marriage-video-controls .video-toggle-button {
  display: grid;
  place-items: center;
}

.video-toggle-symbol {
  position: relative;
  display: block;
  color: currentColor;
}

.video-toggle-play {
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 13px solid currentColor;
  transform: translateX(2px);
}

.video-toggle-pause {
  display: none;
  width: 17px;
  height: 18px;
}

.video-toggle-pause::before,
.video-toggle-pause::after {
  content: "";
  position: absolute;
  top: 0;
  width: 5px;
  height: 18px;
  border-radius: 2px;
  background: currentColor;
}

.video-toggle-pause::before {
  left: 2px;
}

.video-toggle-pause::after {
  right: 2px;
}

.video-toggle-button.is-playing .video-toggle-play {
  display: none;
}

.video-toggle-button.is-playing .video-toggle-pause {
  display: block;
}
.marriage-video-controls input[type="range"] {
  width: 100%;
  accent-color: #d9a347;
}

.marriage-video-controls output {
  min-width: 88px;
  color: #ead8ae;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  text-align: center;
}

.video-volume-control {
  display: grid;
  grid-template-columns: auto minmax(64px, 1fr);
  gap: 6px;
  align-items: center;
  color: #e8c47b;
  font-size: 10px;
}

.video-speed-controls {
  display: grid;
  grid-template-columns: repeat(4, auto);
  gap: 4px;
}

.video-speed-controls button {
  min-width: 42px;
  font-size: 11px;
}

.marriage-message-frame {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.45em;
  min-height: 170px;
  overflow: auto;
  border: 0;
  border-radius: 0;
  padding: 0.7em 1.15em;
  background: transparent;
  box-shadow: none;
  color: rgba(67, 28, 15, 0.92);
  font-family: "Segoe Print", "Bradley Hand ITC", "Comic Sans MS", cursive;
  font-size: var(--overlay-font-size, 1.35cqw);
  line-height: 1.45;
  text-shadow: 0 1px 0 rgba(255, 233, 185, 0.45);
}

.marriage-message-frame strong {
  font: inherit;
  font-size: 1.32em;
  font-weight: 700;
  line-height: 1.1;
}

.marriage-message-frame blockquote {
  margin: 0;
  font: inherit;
  font-size: 1em;
  line-height: 1.48;
}

.marriage-message-frame small {
  font: inherit;
  font-size: 0.72em;
  opacity: 0.72;
}

.marriage-message-frame.message-changing blockquote,
.marriage-message-frame.message-changing strong,
.marriage-message-frame.message-changing small {
  animation: recovered-message-in 420ms ease both;
}

@keyframes recovered-message-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.interface-asset-settings {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.interface-asset-settings article {
  display: grid;
  gap: 8px;
  align-content: start;
  border: 1px solid #d7dde5;
  border-radius: 6px;
  padding: 10px;
  background: #fff;
}

.interface-asset-settings .admin-media-preview {
  min-height: 96px;
  margin: 0;
}

.interface-asset-settings .admin-media-preview img {
  width: 100%;
  height: 96px;
  object-fit: contain;
  background: #101317;
}

/* Settings workspace: compact, polished and resilient with long file names. */
#admin {
  background: #edf2f0;
  color: #172321;
}

.admin-screen {
  padding: clamp(22px, 3vw, 42px) clamp(16px, 4vw, 56px) 96px;
}

.admin-screen .section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 4px 24px;
  max-width: 1240px;
  margin: 0 auto 18px;
  border-bottom: 1px solid #c8d3d0;
  padding: 0 0 20px;
}

.admin-screen .section-head .kicker {
  grid-column: 1;
  margin: 0;
  color: #8b6720;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-screen .section-head h2 {
  grid-column: 1;
  margin: 0;
  color: #173b37;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1;
}

.admin-header-actions {
  grid-column: 2;
  grid-row: 1 / 3;
  display: flex;
  align-self: center;
  gap: 8px;
}

.admin-header-actions button {
  min-width: 104px;
  min-height: 40px;
  border: 1px solid #9eafab;
  border-radius: 6px;
  padding: 9px 15px;
  background: #fff;
  color: #173b37;
  font: 800 13px/1 Inter, "Segoe UI", Arial, sans-serif;
  cursor: pointer;
}

.admin-header-actions button:last-child {
  border-color: #173b37;
  background: #173b37;
  color: #fff;
}

.admin-header-actions button:hover,
.admin-header-actions button:focus-visible {
  border-color: #b7872f;
  box-shadow: 0 0 0 3px rgba(183, 135, 47, 0.14);
}

.app-shell[data-view="admin"] .quick-nav {
  display: none;
}

.admin-tabs {
  max-width: 1240px;
  border-color: #c8d3d0;
  background: rgba(250, 252, 251, 0.98);
  box-shadow: 0 8px 22px rgba(23, 59, 55, 0.08);
}

.admin-tabs button {
  color: #50635f;
}

.admin-tabs button.active {
  background: #173b37;
  color: #fff;
  box-shadow: none;
}

.admin-grid {
  max-width: 1240px;
  gap: 18px;
  padding-bottom: 0;
}

.admin-card {
  min-width: 0;
  overflow: hidden;
  border-color: #d0dad7;
  border-top: 3px solid #bd8d34;
  padding: 20px;
  box-shadow: 0 8px 24px rgba(23, 59, 55, 0.07);
}

.admin-card h3 {
  color: #173b37;
  font-size: 17px;
  overflow-wrap: anywhere;
}

.admin-card p {
  max-width: 78ch;
  color: #556763;
}

.admin-stats div {
  border-left: 3px solid #3c766e;
  background: #f5f9f8;
}

.admin-stats strong {
  color: #173b37;
}

#admin input,
#admin select,
#admin textarea,
#admin button {
  box-sizing: border-box;
  max-width: 100%;
}

#admin input[type="file"] {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  color: #667773;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#admin input[type="file"]::file-selector-button {
  margin-right: 8px;
  border: 1px solid #aab9b5;
  border-radius: 5px;
  padding: 7px 10px;
  background: #fff;
  color: #173b37;
  font-weight: 800;
  cursor: pointer;
}

.interface-asset-settings {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 14px;
}

.interface-asset-settings article.file-dropzone {
  min-width: 0;
  min-height: 154px;
  overflow: hidden;
  border: 1px solid #d0dad7;
  border-left: 4px solid #3c766e;
  border-radius: 6px;
  padding: 14px;
  background: #fbfcfc;
  box-shadow: none;
}

.interface-asset-settings article.file-dropzone:hover {
  border-color: #91aea8;
  background: #f4f9f7;
}

.interface-asset-settings article > strong {
  min-width: 0;
  min-height: 2.7em;
  color: #173b37;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.interface-asset-settings .admin-media-preview,
.interface-asset-settings .file-dropzone input[type="file"] {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.loading-screen-settings {
  display: grid;
  gap: 10px;
}

.loading-screen-settings label {
  display: grid;
  gap: 6px;
  color: #475467;
  font-weight: 700;
}

.loading-screen-settings textarea {
  width: 100%;
  min-height: 74px;
  resize: vertical;
}

.loading-screen-settings button {
  justify-self: start;
}

.loading-screen-settings small {
  color: #667085;
}
.cursor-hotspot-settings {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#admin .background-settings,
#admin .page-content-settings {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

#admin .background-settings article,
#admin .page-content-settings article,
#admin .thumbnail-settings label,
#admin .experience-setting-list article {
  min-width: 0;
  overflow: hidden;
}

#admin .page-content-text-editor {
  grid-column: span 2;
  border-left: 4px solid #bd8d34;
}

#admin .page-content-text-editor textarea {
  width: 100%;
  min-height: 240px;
  resize: vertical;
  border: 1px solid #b8c5c1;
  border-radius: 6px;
  padding: 12px;
  background: #fbfcfc;
  color: #172321;
  font: 15px/1.55 Georgia, "Times New Roman", serif;
}

#admin .page-content-settings article.is-uploading {
  border-color: #bd8d34;
  background: #fffaf0;
  box-shadow: 0 0 0 3px rgba(189, 141, 52, 0.12);
}

#admin .page-content-settings article.is-uploading [data-page-media-count] {
  color: #8b621b;
  font-weight: 800;
}

#admin .page-content-settings .local-video-picker {
  border-color: #2f6f68;
  background: #173b37;
  color: #fff;
}

#admin .page-content-settings .server-video-source {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 9px;
  border: 1px solid #cbd5d1;
  border-radius: 5px;
  background: #f2f7f5;
  color: #24433f;
  font-size: 11px;
  font-weight: 800;
}

#admin .page-content-settings .server-video-source code {
  color: #8b621b;
  font-family: inherit;
}

#admin .page-content-settings .server-video-source select {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  border: 1px solid #9bb0aa;
  border-radius: 4px;
  background: #fff;
  color: #172b28;
}

#admin .page-content-settings [data-refresh-server-videos] {
  border-color: #79928c;
  background: #fff;
  color: #24433f;
}

#admin .page-content-settings article > small {
  color: #687873;
  font-size: 11px;
  line-height: 1.35;
}

.media-file-unavailable {
  display: grid;
  width: 100%;
  min-height: 120px;
  place-items: center;
  border: 1px dashed rgba(229, 184, 96, 0.5);
  padding: 20px;
  color: #f0d08c;
  text-align: center;
}

@media (max-width: 900px) {
  .admin-screen .section-head {
    grid-template-columns: 1fr;
  }

  .admin-header-actions {
    grid-column: 1;
    grid-row: auto;
    margin-top: 14px;
  }

  .interface-asset-settings,
  #admin .page-content-settings {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .admin-header-actions {
    width: 100%;
  }

  .admin-header-actions button {
    flex: 1;
    min-width: 0;
  }

  .interface-asset-settings,
  #admin .background-settings,
  #admin .page-content-settings {
    grid-template-columns: 1fr;
  }

  #admin .page-content-text-editor {
    grid-column: 1;
  }

  .admin-card {
    padding: 16px;
  }
}

.cursor-hotspot-settings {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.cursor-hotspot-settings label {
  display: grid;
  gap: 4px;
  color: #475467;
  font-size: 11px;
}

.cursor-hotspot-settings input {
  width: 100%;
  min-width: 0;
}

.cursor-size-setting,
.cursor-size-help {
  grid-column: 1 / -1;
}

.cursor-size-setting > span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.cursor-size-setting output {
  min-width: 42px;
  color: #173b37;
  font-weight: 800;
  text-align: right;
}

.cursor-size-help {
  color: #667085;
  font-size: 10px;
  line-height: 1.35;
}

@media (max-width: 900px) {
  .marriage-video-controls {
    grid-template-columns: 38px 38px minmax(120px, 1fr) auto;
  }

  .video-volume-control,
  .video-speed-controls {
    grid-column: span 2;
  }
}

.masonry-media-tile.is-audio {
  min-height: 120px;
  background: linear-gradient(145deg, #181008, #070604);
}

.masonry-media-tile.is-audio::before {
  content: "Audio";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #f1ce83;
  font-family: Georgia, serif;
  font-size: 18px;
}

.masonry-media-badge {
  position: absolute;
  right: 8px;
  bottom: 8px;
  border: 1px solid rgba(255, 224, 153, 0.48);
  border-radius: 999px;
  padding: 5px 9px 5px 25px;
  background: rgba(4, 5, 5, 0.82);
  color: #ffe2a0;
  font-size: 11px;
  font-weight: 800;
  pointer-events: none;
}

.masonry-media-badge::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  border-width: 5px 0 5px 8px;
  border-style: solid;
  border-color: transparent transparent transparent currentColor;
  transform: translateY(-50%);
}

/* Full-screen lightbox with keyboard and slideshow controls. */
.media-viewer {
  box-sizing: border-box;
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: 64px clamp(54px, 7vw, 130px) 58px;
  background: rgba(2, 4, 5, 0.97);
  color: #fff;
}

.media-viewer::backdrop {
  background: #020405;
}

.media-viewer-toolbar {
  position: absolute;
  z-index: 4;
  top: 12px;
  right: 18px;
  left: 18px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.media-viewer-toolbar > span {
  margin-right: auto;
  color: rgba(255, 231, 177, 0.76);
  font-variant-numeric: tabular-nums;
}

.media-viewer-toolbar button {
  min-height: 36px;
  border: 1px solid rgba(225, 177, 88, 0.6);
  border-radius: 4px;
  padding: 6px 12px;
  background: #17110b;
  color: #ffe2a0;
}

.media-viewer-toolbar .media-viewer-close {
  position: static;
  inset: auto;
}

#mediaViewerSlideshow[aria-pressed="true"] {
  background: #8b5c1b;
  color: #fff5d5;
}

#mediaViewerVisibility[aria-pressed="true"] {
  border-color: #8fc9a9;
  background: #164f43;
  color: #fff;
}

#mediaViewerContent {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
}

#mediaViewerContent > img,
#mediaViewerContent > video {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  border-radius: 4px;
  object-fit: contain;
}

#mediaViewerContent > audio {
  width: min(760px, 80vw);
}

.media-viewer-nav {
  position: absolute;
  z-index: 5;
  top: 50%;
  width: 46px;
  height: 64px;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(238, 198, 117, 0.48);
  border-radius: 4px;
  padding: 0;
  background: rgba(16, 12, 8, 0.78);
  color: transparent;
  transform: translateY(-50%);
}

.media-viewer-nav::before {
  content: "";
  position: absolute;
  top: 22px;
  width: 17px;
  height: 17px;
  border-top: 3px solid #ffe2a0;
  border-right: 3px solid #ffe2a0;
}

.media-viewer-prev { left: 18px; }
.media-viewer-next { right: 18px; }
.media-viewer-prev::before { left: 17px; transform: rotate(-135deg); }
.media-viewer-next::before { right: 17px; transform: rotate(45deg); }

.media-viewer-caption {
  position: absolute;
  right: 70px;
  bottom: 16px;
  left: 70px;
  margin: 0;
  overflow: hidden;
  color: rgba(255, 235, 192, 0.8);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Admin gallery settings and universal file drop targets. */
.gallery-settings {
  display: grid;
  gap: 10px;
}

.marriage-video-settings,
.capsule-settings,
.remote-payment-settings,
.notification-settings,
.gallery-settings {
  display: grid;
  gap: 10px;
}

.gallery-settings details,
.marriage-video-settings details,
.capsule-settings details,
.remote-payment-settings details {
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #fff;
}

.gallery-settings summary,
.marriage-video-settings summary,
.capsule-settings summary,
.remote-payment-settings summary {
  padding: 11px 13px;
  color: #182230;
  font-weight: 900;
  cursor: pointer;
}

.gallery-setting-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 0 12px 12px;
}

.gallery-setting-fields label {
  display: grid;
  gap: 5px;
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}

.gallery-setting-fields input[type="number"],
.gallery-setting-fields input[type="color"],
.gallery-setting-fields select {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #d0d5dd;
  border-radius: 5px;
  padding: 8px;
}

.gallery-setting-fields .gallery-setting-check {
  display: flex;
  align-items: center;
  gap: 8px;
}

.video-player-setting-fields .gallery-setting-check {
  align-self: end;
  min-height: 36px;
}

.file-dropzone {
  position: relative;
  border: 1px dashed #98a2b3;
  border-radius: 6px;
  padding: 9px;
  background: #f8fafc;
  transition: border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

.file-dropzone.is-dragging {
  border-color: #b7791f;
  background: #fff7e6;
  box-shadow: inset 0 0 0 2px rgba(183, 121, 31, 0.2);
}

.file-dropzone input[type="file"] {
  max-width: 100%;
}

.admin-media-items {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  max-height: 240px;
  overflow: auto;
}

.admin-media-preview {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid #d0d5dd;
  border-radius: 5px;
  background: #101214;
}

.admin-media-preview img,
.admin-media-preview video {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.admin-media-preview audio {
  width: 100%;
  min-height: 76px;
}

.admin-media-preview figcaption {
  overflow: hidden;
  padding: 5px 6px 28px;
  background: #fff;
  color: #344054;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-media-preview [data-delete-media-id],
.admin-media-preview [data-clear-server-video] {
  position: absolute;
  right: 4px;
  bottom: 4px;
  min-height: 22px;
  border: 0;
  border-radius: 3px;
  padding: 3px 6px;
  background: #b42318;
  color: #fff;
  font-size: 9px;
}

@media (max-width: 1000px) {
  .detail-page-media.masonry-media-grid,
  .filtered-gallery-media.masonry-media-grid {
    -webkit-column-count: var(--masonry-tablet-columns, 3);
    column-count: var(--masonry-tablet-columns, 3);
  }

  .gallery-setting-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .detail-page-media.masonry-media-grid,
  .filtered-gallery-media.masonry-media-grid {
    -webkit-column-count: var(--masonry-mobile-columns, 2);
    column-count: var(--masonry-mobile-columns, 2);
  }

  .media-viewer {
    padding: 58px 48px 52px;
  }

  .media-viewer-nav {
    width: 38px;
    height: 54px;
  }

  .media-viewer-prev { left: 5px; }
  .media-viewer-next { right: 5px; }
  .gallery-setting-fields { grid-template-columns: 1fr; }
  .admin-media-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Final capsule overrides: keep paper controls readable after legacy form rules. */
#lettre-2036 #capsuleForm {
  overflow: visible;
  border: 0;
  padding: 0;
  background: transparent;
  color: #342113;
  box-shadow: none;
  backdrop-filter: none;
}

#lettre-2036 #capsuleForm .capsule-object-note > label,
#lettre-2036 #capsuleForm .capsule-object-note .inline-check,
#lettre-2036 #capsuleForm .capsule-file,
#lettre-2036 #capsuleForm .capsule-file > span,
#lettre-2036 #capsuleForm .capsule-submit-row {
  color: #442719;
}

#lettre-2036 #capsuleForm .capsule-object-note .inline-check {
  display: flex !important;
  margin: 0 !important;
  color: #442719 !important;
}

#lettre-2036 #capsuleForm .capsule-submit-row > span {
  color: #56311e;
}

#lettre-2036 #capsuleForm .capsule-file.file-dropzone {
  border-color: rgba(102, 58, 25, 0.34);
  background: rgba(255, 240, 202, 0.22);
  color: #442719;
}

/* Capsule direct mode: the background contains the interface, overlays stay transparent. */
#lettre-2036 {
  --screen-bg: none;
}

#lettre-2036 .capsule-direct-letter {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  pointer-events: none;
}

#lettre-2036 .capsule-direct-message,
#lettre-2036 .capsule-direct-signature {
  position: absolute;
  z-index: 8;
  box-sizing: border-box;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(70, 25, 13, 0.92);
  font-family: "Segoe Print", "Bradley Hand ITC", "Comic Sans MS", cursive;
  font-size: var(--overlay-font-size, 18px);
  font-weight: 500;
  letter-spacing: 0;
  outline: 0;
  pointer-events: auto;
  text-shadow: 0 1px 0 rgba(255, 229, 180, 0.28);
}

#lettre-2036 .capsule-direct-message {
  overflow: hidden;
  padding: 0 6px;
  line-height: var(--capsule-message-line-height, 1.88);
  resize: none;
}

#lettre-2036 .capsule-direct-signature {
  padding: 0 5px;
  line-height: 1.2;
}

#lettre-2036 .capsule-direct-message::placeholder,
#lettre-2036 .capsule-direct-signature::placeholder {
  color: rgba(76, 37, 21, 0.46);
}

#lettre-2036 .capsule-direct-message:focus,
#lettre-2036 .capsule-direct-signature:focus {
  background: rgba(255, 236, 185, 0.08) !important;
}

#lettre-2036 .capsule-idea-zones {
  position: absolute;
  inset: 0;
  z-index: 9;
  pointer-events: none;
}

#lettre-2036 .capsule-idea-zones button,
#lettre-2036 .capsule-direct-submit,
#lettre-2036 .capsule-media-add,
#lettre-2036 .capsule-studio-shortcut {
  position: absolute;
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
  pointer-events: auto;
}

#lettre-2036 .capsule-idea-zones button:hover,
#lettre-2036 .capsule-idea-zones button:focus-visible,
#lettre-2036 .capsule-idea-zones button.is-selected,
#lettre-2036 .capsule-direct-submit:hover,
#lettre-2036 .capsule-direct-submit:focus-visible,
#lettre-2036 .capsule-media-add:hover,
#lettre-2036 .capsule-media-add:focus-visible,
#lettre-2036 .capsule-studio-shortcut:hover,
#lettre-2036 .capsule-studio-shortcut:focus-visible {
  border-color: rgba(130, 63, 34, 0.38);
  background: rgba(111, 45, 27, 0.05);
  outline: none;
}

#lettre-2036 .capsule-direct-submit {
  z-index: 10;
}

#lettre-2036 .capsule-studio-shortcut {
  z-index: 10;
}

#lettre-2036 .capsule-media-add {
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(6px, 0.6vw, 12px);
  overflow: visible;
  padding: 4px 10px;
  border-color: rgba(133, 71, 25, 0.55);
  color: #5c2b17;
  background: linear-gradient(145deg, rgba(255, 229, 163, 0.9), rgba(201, 145, 55, 0.88));
  box-shadow: 0 3px 10px rgba(57, 23, 7, 0.28), inset 0 1px rgba(255, 247, 210, 0.75);
}

#lettre-2036 .capsule-media-add:hover,
#lettre-2036 .capsule-media-add:focus-visible {
  color: #421a0d;
  background: linear-gradient(145deg, #ffe7a7, #d89a39);
  box-shadow: 0 4px 14px rgba(79, 33, 7, 0.4), 0 0 12px rgba(245, 193, 76, 0.38);
}

#lettre-2036 .capsule-media-add-symbol {
  display: grid;
  flex: 0 1 auto;
  width: auto;
  height: min(80%, 46px);
  max-width: 40%;
  min-width: 0;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(91, 42, 18, 0.62);
  border-radius: 50%;
  font-family: Georgia, serif;
  font-size: clamp(12px, calc(var(--overlay-font-size, 0.78cqw) * 1.9), 36px);
  font-weight: 700;
  line-height: 1;
  color: #5d2b14;
  background: rgba(255, 238, 187, 0.82);
}

#lettre-2036 .capsule-media-add-label {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-family: Georgia, serif;
  font-size: var(--overlay-font-size, clamp(11px, 0.78vw, 15px));
  font-weight: 700;
  line-height: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.capsule-media-dialog {
  width: min(680px, calc(100vw - 28px));
  max-height: min(820px, calc(100vh - 28px));
  overflow: visible;
  padding: 0;
  border: 1px solid #b77727;
  border-radius: 18px;
  color: #3e2518;
  background: transparent;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.64);
}

.capsule-media-dialog::backdrop {
  background: rgba(5, 8, 6, 0.76);
  backdrop-filter: blur(4px);
}

.capsule-media-dialog-panel {
  position: relative;
  overflow: auto;
  max-height: min(820px, calc(100vh - 28px));
  padding: clamp(22px, 4vw, 38px);
  border-radius: inherit;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 243, 200, 0.8), transparent 36%),
    linear-gradient(145deg, #f5dfaa, #d5a85f);
}

.capsule-media-dialog-panel h3 {
  margin: 4px 36px 10px;
  font: 700 clamp(25px, 4vw, 38px)/1.1 Georgia, serif;
}

.capsule-media-dialog-kicker {
  margin: 0;
  color: #81511e;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.capsule-media-dialog-close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  padding: 0;
  border: 1px solid #7d461b;
  border-radius: 50%;
  color: #55260f;
  background: rgba(255, 239, 192, 0.75);
  font-size: 28px;
  line-height: 1;
}

.capsule-media-dropzone {
  display: grid;
  min-height: 180px;
  margin: 22px 0 14px;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 24px;
  border: 2px dashed rgba(107, 56, 20, 0.62);
  border-radius: 16px;
  cursor: pointer;
  background: rgba(255, 247, 217, 0.48);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.capsule-media-dropzone > span {
  font: 700 58px/0.8 Georgia, serif;
  color: #a8641c;
}

.capsule-media-dropzone > strong {
  font-size: 19px;
}

.capsule-media-dropzone > small {
  color: #73533d;
}

.capsule-media-dropzone:is(:hover, :focus-visible, .is-dragging) {
  border-color: #d79025;
  outline: none;
  transform: translateY(-2px);
  box-shadow: 0 0 0 4px rgba(255, 220, 125, 0.32), 0 0 24px rgba(185, 105, 22, 0.32);
}

.capsule-media-preview {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(98, 52, 23, 0.25);
  border-radius: 12px;
  background: rgba(255, 251, 230, 0.45);
}

.capsule-media-preview img {
  width: 80px;
  height: 64px;
  object-fit: cover;
  border-radius: 8px;
}

.capsule-media-preview p {
  display: grid;
  min-width: 0;
  margin: 0;
  text-align: left;
}

.capsule-media-preview strong,
.capsule-media-preview small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.capsule-media-preview-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 50%;
  color: #fff0bd;
  background: #744019;
  font-size: 28px;
}

.capsule-media-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
}

.capsule-media-dialog-actions button {
  min-height: 42px;
  padding: 8px 16px;
  border: 1px solid #85501f;
  border-radius: 999px;
  color: #4f2913;
  background: rgba(255, 241, 196, 0.8);
  font-weight: 800;
}

.capsule-media-dialog-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

.backup-policy-card {
  border-left: 4px solid #287766;
}

.backup-policy-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0 8px;
  padding: 14px;
  border: 1px solid rgba(28, 101, 84, 0.3);
  border-radius: 10px;
  background: rgba(224, 244, 237, 0.54);
  font-weight: 800;
}

.backup-policy-option input {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

.backup-policy-note {
  color: #5f6e6a;
}

@media (max-width: 620px) {
  .capsule-media-dialog-actions {
    display: grid;
  }

  .capsule-media-dialog-actions button {
    width: 100%;
  }
}

#lettre-2036 .capsule-direct-letter.is-sealing .capsule-direct-message,
#lettre-2036 .capsule-direct-letter.is-sealing .capsule-direct-signature {
  animation: capsule-ink-fade 900ms ease-in both;
}

#lettre-2036 .capsule-direct-letter .capsule-wax-drop {
  left: 35.5%;
  top: 85.2%;
}

@keyframes capsule-ink-fade {
  0%, 65% { opacity: 1; }
  100% { opacity: 0.18; }
}


/* Studio: image-based selector, clean trigger, visible camera toggle. */
#studio .studio-capture {
  border: 0 !important;
  outline: 0;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible;
}

#studio .studio-capture.recording {
  border-color: transparent;
  background: transparent !important;
  box-shadow: none !important;
}

#studio .studio-mode-toggle {
  display: block;
  grid-template-columns: none;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden;
}

#studio .studio-mode-switch {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border: 0 !important;
  outline: 0 !important;
  border-radius: inherit;
  padding: 0;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden;
  cursor: pointer;
}

#studio .studio-mode-switch img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  object-fit: contain;
  pointer-events: none;
}

#studio .studio-mode-switch span,
#studio .studio-camera-toggle span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

#studio .studio-mode-switch.active,
#studio .studio-mode-switch:focus-visible,
#studio .studio-mode-switch:hover {
  background: transparent;
  box-shadow: none;
}

#studio .studio-camera-toggle {
  left: 8.5%;
  top: 80%;
  width: 8.5%;
  height: 10%;
  min-height: 0;
  border: 0;
  border-radius: 999px;
  padding: 0;
  background: transparent;
  color: transparent;
  opacity: 1;
  cursor: pointer;
  box-shadow: none;
}

#studio .studio-camera-toggle[hidden] {
  display: none;
}

#studio .studio-camera-toggle img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}


.notification-setting-fields button {
  align-self: end;
  min-height: 37px;
  border: 1px solid #98a2b3;
  border-radius: 5px;
  background: #173b37;
  color: #fff;
  font-weight: 850;
}


#studio .studio-mode-toggle.overlay-border-hidden,
#studio .studio-mode-toggle.overlay-border-hidden .studio-mode-switch,
#studio .studio-mode-toggle.overlay-border-hidden .studio-mode-switch img {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

#studio .studio-mode-toggle::after {
  border-radius: inherit;
}


.depart-route-markers {
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
}

.depart-route-step {
  position: absolute;
  left: var(--route-x, 50%);
  top: var(--route-y, 50%);
  display: grid;
  min-width: 8.5cqw;
  justify-items: center;
  gap: 0.12cqw;
  color: rgba(255, 239, 189, 0.86);
  font-family: Georgia, "Times New Roman", serif;
  text-align: center;
  text-shadow: 0 2px 0 rgba(20, 8, 0, 0.88), 0 0 14px rgba(255, 202, 95, 0.55);
  transform: translate(-50%, -50%);
}

.depart-route-step i {
  display: grid;
  place-items: center;
  width: 1.75cqw;
  height: 1.75cqw;
  color: #fff3c3;
  font-style: normal;
  font-size: 1.25cqw;
  line-height: 1;
  filter: drop-shadow(0 0 8px rgba(255, 193, 82, 0.78));
}

.depart-route-step b {
  display: -webkit-box;
  max-width: 10.8cqw;
  overflow: hidden;
  color: rgba(255, 244, 208, 0.92);
  font-size: 0.94cqw;
  font-weight: 800;
  line-height: 1.02;
  text-align: center;
  text-overflow: clip;
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.depart-route-step.is-current i,
.depart-route-step.is-next i {
  color: #fff7d6;
  transform: scale(1.18);
}

.depart-route-step.is-current b,
.depart-route-step.is-next b {
  color: #fff7d6;
}

.depart-current-label,
.depart-current-city,
.next-chip {
  position: absolute;
  z-index: 7;
  display: grid;
  place-items: center;
  margin: 0;
  color: var(--gold-soft);
  font-family: Georgia, "Times New Roman", serif;
  text-align: center;
  text-shadow: 0 2px 0 rgba(51, 25, 3, 0.86), 0 0 18px rgba(255, 211, 112, 0.55);
  pointer-events: none;
}

.depart-current-label,
.next-chip span {
  font-size: calc(var(--overlay-font-size, 1.1cqw) * 0.72);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.depart-current-city,
.next-chip b {
  font-size: var(--overlay-font-size, 3.4cqw);
  font-weight: 800;
  line-height: 0.95;
  text-transform: uppercase;
}

.next-chip {
  gap: 0.15cqw;
}


.route-icon-input {
  text-align: center;
  font-size: 20px;
}

/* Home background layering: dynamic left photo sits behind the transparent background PNG. */
#depart::before {
  display: none;
}

#depart .screen-design-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--screen-bg, none) center / contain no-repeat;
  filter: brightness(var(--page-background-brightness, 1));
  pointer-events: none;
}

.depart-slideshow-photo {
  position: absolute;
  z-index: 1;
  left: 3.6%;
  top: 35%;
  width: 12.1%;
  height: 24.5%;
  border: 0;
  border-radius: 6px;
  object-fit: cover;
  pointer-events: none;
}

.app-shell:not(.is-ready) #depart .depart-distance-live,
.app-shell:not(.is-ready) #depart .depart-current-label,
.app-shell:not(.is-ready) #depart .depart-current-city,
.app-shell:not(.is-ready) #depart .depart-next-label,
.app-shell:not(.is-ready) #depart .depart-next-city,
.app-shell:not(.is-ready) #participer .participer-distance-live,
.app-shell:not(.is-ready) #participer .participer-next-stop-label,
.app-shell:not(.is-ready) #participer .participer-next-stop-name,
.app-shell:not(.is-ready) #participer .participer-next-stop-distance,
.app-shell:not(.is-ready) #participer .participer-dynamic-text {
  visibility: hidden;
}

.quick-nav button span {
  position: relative;
  z-index: 1;
}


.participer-dynamic-text {
  position: absolute;
  z-index: 6;
  display: grid;
  place-items: center;
  margin: 0;
  color: #2b1a0e;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.35vw);
  font-weight: 700;
  line-height: 1.18;
  text-align: center;
  text-wrap: balance;
  pointer-events: none;
}

.filtered-gallery-shell {
  position: absolute;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 0.8cqw;
  padding: 0.8cqw;
  overflow: hidden;
  border: 1px solid rgba(229, 187, 104, 0.35);
  border-radius: 8px;
  background: rgba(4, 9, 11, 0.28);
  backdrop-filter: blur(3px);
}

.filtered-gallery-shell.overlay-border-hidden {
  border-color: transparent;
  background: transparent;
  backdrop-filter: none;
}

.gallery-filter-tabs {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  column-gap: 0.45cqw;
  row-gap: var(--gallery-tab-row-gap, 7px);
  justify-content: center;
}

.gallery-filter-tabs button {
  display: inline-flex;
  align-items: center;
  border: 0;
  border-radius: 0;
  padding: 0.2em 0.45em;
  background: transparent;
  color: var(--gold-soft);
  font-size: clamp(11px, 0.86cqw, 15px);
  font-weight: 800;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
  box-shadow: none;
}

.gallery-filter-tabs button.active,
.gallery-filter-tabs button:hover,
.gallery-filter-tabs button:focus-visible {
  border: 0;
  background: transparent;
  color: #fff1bd;
  text-decoration: underline;
  text-decoration-thickness: 0.12em;
  text-underline-offset: 0.32em;
  outline: none;
  box-shadow: none;
}

.gallery-filter-tabs small {
  color: rgba(255, 244, 205, 0.78);
  font-size: 0.78em;
}

.filtered-gallery-media {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding-right: 0.3cqw;
}

.filtered-gallery-media.masonry-media-grid {
  display: grid;
  grid-template-columns: repeat(var(--masonry-effective-columns, 4), minmax(0, var(--masonry-column-width, 1fr)));
  justify-content: center;
  align-content: center;
  align-items: start;
  gap: var(--masonry-gap, 12px);
  -webkit-column-count: auto;
  column-count: auto;
  column-gap: var(--masonry-gap, 12px);
  overflow: hidden;
}

.filtered-gallery-media .masonry-column {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: var(--masonry-gap, 12px);
}

.filtered-gallery-media .masonry-column > .masonry-media-tile {
  width: 100%;
  flex: 0 0 auto;
  margin-bottom: 0;
}


.filtered-gallery-media.masonry-media-grid {
  padding-bottom: max(10px, var(--masonry-gap, 12px));
}

.filtered-gallery-media .masonry-column > .masonry-media-tile:last-child {
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
}

.filtered-gallery-media > .experience-media-empty {
  grid-column: 1 / -1;
}

.gallery-loading-error {
  grid-column: 1 / -1;
  align-self: center;
  justify-self: center;
  display: grid;
  max-width: min(520px, 90%);
  place-items: center;
  gap: 10px;
  border: 0;
  padding: 12px;
  background: transparent;
  color: #fff0bd;
  text-align: center;
}

.gallery-loading-error small {
  color: rgba(255, 240, 189, 0.82);
  font-size: clamp(11px, 0.78cqw, 14px);
  line-height: 1.35;
}

.gallery-loading-error button {
  border: 1px solid rgba(224, 169, 75, 0.78);
  border-radius: 999px;
  padding: 0.48em 1.15em;
  background: linear-gradient(180deg, #d9a84f, #9c641d);
  color: #130c04;
  font: 800 clamp(12px, 0.82cqw, 15px) Georgia, "Times New Roman", serif;
  cursor: pointer;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.34);
}

.gallery-loading-error button:hover,
.gallery-loading-error button:focus-visible {
  filter: brightness(1.12);
  transform: translateY(-1px);
}

.gallery-pagination {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 0.7cqw, 14px);
  padding-top: 0.35cqw;
  color: var(--gold-soft);
  font-size: clamp(11px, 0.78cqw, 14px);
  font-weight: 800;
  text-align: center;
}

.filtered-gallery-shell > .filtered-gallery-media {
  padding-bottom: clamp(36px, 4.2cqw, 58px);
}
.filtered-gallery-shell > .gallery-pagination[data-overlay-key] {
  position: absolute;
  z-index: 8;
  margin: 0;
  padding-top: 0.35cqw;
}
.gallery-pagination[hidden] {
  display: none;
}

.gallery-pagination button {
  min-height: 30px;
  border: 1px solid rgba(229, 187, 104, 0.58);
  border-radius: 999px;
  padding: 0.42em 0.9em;
  background: rgba(5, 8, 10, 0.7);
  color: var(--gold-soft);
  font: inherit;
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.3);
}

.gallery-pagination button:hover,
.gallery-pagination button:focus-visible {
  border-color: rgba(255, 220, 130, 0.95);
  background: rgba(166, 113, 35, 0.78);
  outline: none;
}

.gallery-pagination button:disabled {
  cursor: default;
  opacity: 0.38;
}

.gallery-filter-settings details {
  border: 1px solid rgba(20, 78, 72, 0.18);
  border-radius: 12px;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.72);
}

.gallery-filter-settings details + details {
  margin-top: 1rem;
}

.gallery-filter-manager,
.gallery-filter-media-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.85rem;
}

.gallery-filter-list {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  gap: 0.65rem;
  align-items: end;
}

.gallery-filter-list p,
.gallery-filter-media-list p {
  margin: 0;
  color: #667085;
}

.gallery-filter-media-list label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  gap: 0.75rem;
  align-items: center;
}

.gallery-filter-media-list span {
  overflow: hidden;
  color: #344054;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.participer-text-settings textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
}

#studio .studio-mode-toggle:not(.overlay-border-hidden),
#studio .studio-capture:not(.overlay-border-hidden) {
  border: 1px solid rgba(255, 222, 151, 0.62) !important;
}

#studio .studio-mode-toggle.overlay-border-hidden,
#studio .studio-capture.overlay-border-hidden {
  border: 0 !important;
  box-shadow: none !important;
}

8%, 16% {
    filter: brightness(1.18) drop-shadow(0 0 16px rgba(255, 216, 112, 0.75)) drop-shadow(0 0 32px rgba(212, 137, 42, 0.42));
  }
}
/* Dynamic overlays and click cue stability fixes. */
@keyframes clickable-cue-pulse {
  0%, 84%, 100% {
    box-shadow: var(--click-cue-base-shadow, none);
    border-color: var(--click-cue-base-border, rgba(229, 187, 104, 0.16));
    filter: none;
  }
  7%, 13% {
    box-shadow: 0 0 0 1px rgba(255, 228, 154, 0.86), 0 0 30px rgba(255, 195, 82, 0.56);
    border-color: rgba(255, 226, 148, 0.86);
    filter: brightness(1.12);
  }
}

.screen:not(.hidden) .click-cue {
  animation: clickable-cue-pulse var(--cue-cycle, 16s) ease-in-out infinite;
  animation-delay: var(--cue-delay, 0s);
}

.screen:not(.hidden) .click-cue.is-cue-paused {
  animation: none !important;
  filter: none !important;
}

.screen:not(.hidden) .click-cue:hover,
.screen:not(.hidden) .click-cue:focus-visible {
  animation: none !important;
}

#depart .depart-distance-live,
#depart .depart-current-label,
#depart .depart-current-city,
#depart .depart-next-label,
#depart .depart-next-city,
#depart .depart-last-activity,
#depart .depart-route-markers,
#participer .participer-distance-live,
#participer .participer-progress-track,
#participer .participer-next-stop-label,
#participer .participer-next-stop-name,
#participer .participer-next-stop-distance,
#participer .participer-dynamic-text {
  z-index: 12 !important;
}

#participer .participer-progress-fill,
#participer .participer-progress-plane {
  z-index: 13;
}

.screen:not(.hidden) #studio .studio-mode-toggle.click-cue,
.screen:not(.hidden) #studio .studio-capture.click-cue,
#studio .studio-mode-toggle.click-cue,
#studio .studio-capture.click-cue {
  animation: studio-control-cue-glow var(--cue-cycle, 16s) ease-in-out infinite;
  animation-delay: var(--cue-delay, 0s);
}

#studio .studio-mode-toggle.click-cue.is-cue-paused,
#studio .studio-capture.click-cue.is-cue-paused {
  animation: none !important;
  filter: none !important;
}

#studio .studio-mode-toggle.click-cue:hover,
#studio .studio-mode-toggle.click-cue:focus-visible,
#studio .studio-capture.click-cue:hover,
#studio .studio-capture.click-cue:focus-visible,
#studio .studio-camera-toggle:hover,
#studio .studio-camera-toggle:focus-visible {
  animation: none !important;
  filter: brightness(1.22) drop-shadow(0 0 18px rgba(255, 216, 112, 0.82)) drop-shadow(0 0 36px rgba(212, 137, 42, 0.48)) !important;
}

@keyframes studio-control-cue-glow {
  0%, 84%, 100% {
    filter: none;
  }
  7%, 13% {
    filter: brightness(1.18) drop-shadow(0 0 16px rgba(255, 216, 112, 0.75)) drop-shadow(0 0 32px rgba(212, 137, 42, 0.42));
  }
}
/* Home next-stop label and route calibration helpers. */
.depart-next-label {
  display: block;
}

.depart-route-step.selected-overlay {
  outline: 1px solid rgba(255, 229, 157, 0.95);
  outline-offset: 0.2cqw;
  box-shadow: 0 0 22px rgba(255, 199, 87, 0.5);
}
/* v=20260626-home-route-poem-v43 */

/* Home route overlay v43. */
.depart-next-label,
.depart-next-city {
  position: absolute;
  z-index: 12;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  margin: 0;
  color: var(--gold-soft);
  font-family: Georgia, "Times New Roman", serif;
  text-align: center;
  text-shadow: 0 2px 0 rgba(51, 25, 3, 0.86), 0 0 18px rgba(255, 211, 112, 0.55);
  pointer-events: none;
}

.depart-next-label {
  font-size: calc(var(--overlay-font-size, 1.1cqw) * 0.72);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.depart-next-city {
  font-size: var(--overlay-font-size, 2.35cqw);
  font-weight: 800;
  line-height: 0.95;
  text-transform: uppercase;
}

.depart-route-lines {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.depart-route-line-shadow,
.depart-route-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.depart-route-line-shadow {
  stroke: rgba(255, 171, 62, 0.46);
  stroke-width: 1.3;
  filter: drop-shadow(0 0 8px rgba(255, 186, 70, 0.6));
}

.depart-route-line {
  stroke: rgba(255, 247, 220, 0.92);
  stroke-width: 0.58;
  stroke-dasharray: 1.2 1.55;
}

.depart-route-step {
  z-index: 1;
}

#mariage-poeme .detail-page-panel {
  z-index: 8;
}

#mariage-poeme .detail-page-copy {
  z-index: 1;
}
/* Poem layer hardening v44. */
#mariage-poeme::before {
  z-index: 0 !important;
}

#poemBouquetPhoto {
  z-index: 1 !important;
}

#mariage-poeme .detail-page-panel {
  z-index: 20 !important;
  opacity: 1;
  pointer-events: none;
}

#mariage-poeme .detail-page-copy,
#mariage-poeme .poem-page,
#mariage-poeme .poem-column {
  position: relative;
  z-index: 21;
  opacity: 1;
  visibility: visible;
}

#mariage-poeme .poem-page {
  position: absolute;
}

#mariage-poeme .poem-page:not(.active) {
  opacity: 0;
}
/* Poem shell fallback v45. */
#mariage-poeme .detail-page-copy:empty::before {
  content: "Relisez le poème des fleurs qui accompagnait cette journée.";
  display: grid;
  min-height: 100%;
  place-items: center;
  color: #4b241c;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.28cqw);
  font-style: italic;
  line-height: 1.55;
  text-align: center;
}
.route-line-style-settings {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 12px;
  margin: 12px 0 16px;
  border: 1px solid #c6d2cf;
  border-radius: 8px;
  padding: 12px;
  background: rgba(246, 249, 248, 0.86);
}

.route-line-style-settings label {
  display: grid;
  gap: 6px;
  color: #173b37;
  font-weight: 760;
}

.route-line-style-settings input,
.route-line-style-settings select {
  width: 100%;
}

.route-line-style-settings input[type="color"] {
  min-height: 42px;
  padding: 3px;
}
/* Route line live style v46. */
.depart-route-line-shadow {
  stroke: var(--route-line-shadow-color, rgba(255, 171, 62, 0.46)) !important;
  stroke-width: var(--route-line-shadow-width, 1.3) !important;
  filter: drop-shadow(0 0 var(--route-line-glow-blur, 8px) var(--route-line-glow, rgba(255, 186, 70, 0.6))) !important;
}

.depart-route-line {
  stroke: var(--route-line-color, rgba(255, 247, 220, 0.92)) !important;
  stroke-width: var(--route-line-width, 0.58) !important;
  stroke-dasharray: var(--route-line-dasharray, 1.2 1.55) !important;
}
/* Gift stamp delay fix v47: keep the stamp hidden during the configured delay. */
.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  animation-fill-mode: both !important;
}
/* Poem manual paging arrows v49. */
.poem-page-arrow {
  position: absolute;
  z-index: 34;
  top: 52%;
  display: grid;
  place-items: center;
  width: clamp(34px, 3cqw, 54px);
  height: clamp(34px, 3cqw, 54px);
  border: 1px solid rgba(92, 46, 25, 0.22);
  border-radius: 999px;
  background: rgba(255, 237, 190, 0.2);
  color: rgba(74, 34, 20, 0.72);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(28px, 3.1cqw, 52px);
  line-height: 1;
  cursor: pointer;
  opacity: 0.72;
  transform: translateY(-50%);
  transition: opacity 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.poem-page-prev {
  left: 25.2%;
}

.poem-page-next {
  left: 68.8%;
}

.poem-page-arrow:hover,
.poem-page-arrow:focus-visible {
  opacity: 1;
  background: rgba(255, 237, 190, 0.28);
  color: rgba(74, 34, 20, 0.88);
  box-shadow: 0 0 18px rgba(255, 210, 122, 0.26);
  outline: none;
}
/* Admin studio backgrounds and route curve visibility v50. */
.admin-studio-background-upload {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border: 1px solid #9eafab;
  border-radius: 6px;
  padding: 10px 14px;
  background: #fff;
  color: #173b37;
  font: 800 13px/1 Inter, "Segoe UI", Arial, sans-serif;
  cursor: pointer;
}

.admin-studio-background-upload:hover,
.admin-studio-background-upload:focus-within {
  border-color: #bd8d34;
  box-shadow: 0 0 0 3px rgba(189, 141, 52, 0.14);
}

.admin-studio-background-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.admin-studio-background-list {
  grid-template-columns: repeat(auto-fill, minmax(116px, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.admin-studio-background-list article,
.admin-studio-background-list .studio-background-none {
  aspect-ratio: 16 / 9;
  min-height: 82px;
}

.route-line-style-settings {
  align-items: end;
}

.route-line-style-title {
  grid-column: 1 / -1;
  display: grid;
  gap: 4px;
  margin-bottom: 2px;
  color: #173b37;
}

.route-line-style-title strong {
  font-size: 16px;
}

.route-line-style-title span {
  color: #60716d;
  font-size: 13px;
}
/* Studio camera source settings v51. */
.studio-camera-source-settings {
  display: grid;
  gap: 12px;
}

.studio-camera-source-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 12px;
  align-items: end;
}

.studio-camera-source-grid label {
  display: grid;
  gap: 6px;
  color: #173b37;
  font-weight: 800;
}

.studio-camera-source-grid select {
  min-height: 40px;
  border: 1px solid #b8c8c4;
  border-radius: 6px;
  padding: 8px 10px;
  background: #fff;
  color: #173b37;
}

.studio-camera-source-grid button {
  min-height: 40px;
  border: 1px solid #173b37;
  border-radius: 6px;
  padding: 10px 14px;
  background: #173b37;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.studio-camera-source-status {
  margin: 0;
  border: 1px solid #cbd8d5;
  border-left-width: 4px;
  border-radius: 6px;
  padding: 10px 12px;
  background: #f7faf9;
  color: #435955;
  font-weight: 700;
}

.studio-camera-source-status.ok {
  border-left-color: #3c766e;
}

.studio-camera-source-status.warn {
  border-left-color: #bd8d34;
  background: #fff8e8;
  color: #5f4214;
}
/* Calibration drag handles v52. */
.app-shell.calibrating [data-overlay-key] {
  cursor: move !important;
  pointer-events: auto !important;
  touch-action: none;
  user-select: none;
}

.app-shell.calibrating #departRouteMarkers,
.app-shell.calibrating .depart-route-markers {
  pointer-events: auto !important;
}

.app-shell.calibrating.dragging-overlay,
.app-shell.calibrating.dragging-overlay * {
  cursor: grabbing !important;
  user-select: none !important;
}

.app-shell.calibrating .depart-route-step {
  cursor: move !important;
}
/* Gift validation sequencing v56: stamp starts only after plane end + configured pause. */
.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  animation: gift-stamp-hit var(--gift-stamp-duration, 0.9s) var(--gift-stamp-delay, 2.05s) ease-out both !important;
  animation-fill-mode: both !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-stamp {
  animation: none !important;
  opacity: 0;
}
/* Current route stop marker v57. */
.depart-route-step.is-current {
  z-index: 5;
  color: #ff6458;
}

.depart-route-step.is-current b {
  color: #ffe4d6;
  text-shadow: 0 2px 0 rgba(55, 7, 0, 0.9), 0 0 18px rgba(255, 65, 45, 0.72);
}

.depart-route-step.is-current.is-next b {
  color: #ffe4d6;
}

.depart-route-step .route-current-pin {
  position: relative;
  width: 1.95cqw;
  height: 1.95cqw;
  color: transparent;
  font-size: 0;
  filter: drop-shadow(0 0 8px rgba(255, 69, 47, 0.9)) drop-shadow(0 0 18px rgba(255, 171, 76, 0.55));
}

.depart-route-step .route-current-pin::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 42%;
  width: 1.18cqw;
  height: 1.18cqw;
  border: 0.13cqw solid rgba(255, 242, 196, 0.96);
  border-radius: 50% 50% 50% 0;
  background: linear-gradient(145deg, #ff7a54, #be201a 70%);
  box-shadow: inset 0 0 0 0.08cqw rgba(84, 13, 8, 0.55), 0 0 18px rgba(255, 71, 43, 0.62);
  transform: translate(-50%, -58%) rotate(-45deg);
}

.depart-route-step .route-current-pin::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 34%;
  width: 0.34cqw;
  height: 0.34cqw;
  border-radius: 999px;
  background: #fff8d8;
  box-shadow: 0 0 10px rgba(255, 247, 214, 0.9);
  transform: translate(-50%, -50%);
}
/* Timeline active focus animation v59. */
.journey-timeline article {
  opacity: 0.74;
  position: relative;
  transform: translateZ(0);
  transition:
    color 420ms ease,
    filter 420ms ease,
    opacity 420ms ease,
    transform 420ms ease;
  will-change: background-position, opacity;
}

.journey-timeline .timeline-icon {
  transition: color 420ms ease, filter 420ms ease, transform 420ms ease;
}

.journey-timeline strong {
  display: block;
  transform-origin: center;
  transition: color 420ms ease, transform 420ms ease;
}

.journey-timeline p {
  transform-origin: center top;
  transition: color 420ms ease, transform 420ms ease;
}

.journey-timeline article.is-timeline-active {
  color: #823515;
  filter: saturate(1.12);
  opacity: 1;
  transform: translateY(-0.22em) scale(1.08);
  z-index: 2;
}

.journey-timeline article.is-timeline-active .timeline-icon {
  color: #9a3e18;
  filter: drop-shadow(0 0 0.28em rgba(129, 53, 21, 0.32));
  transform: scale(1.18);
}

.journey-timeline article.is-timeline-active strong,
.journey-timeline article.is-timeline-active p {
  color: #823515;
  transform: scale(1.12);
}

@media (prefers-reduced-motion: reduce) {
  .journey-timeline article,
  .journey-timeline .timeline-icon,
  .journey-timeline strong,
  .journey-timeline p {
    transition: none;
  }
}
/* Click cue JS sequencer v60. */
.screen:not(.hidden) .click-cue {
  animation: none !important;
  transition:
    border-color 420ms ease,
    box-shadow 420ms ease,
    filter 420ms ease,
    transform 420ms ease;
}

.screen:not(.hidden) .click-cue.is-cue-active {
  border-color: rgba(255, 226, 148, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(255, 228, 154, 0.82), 0 0 30px rgba(255, 195, 82, 0.55) !important;
  filter: brightness(1.13);
  transform: translateZ(0) scale(1.018);
}

.screen:not(.hidden) .click-cue.is-cue-paused {
  animation: none !important;
}

.screen:not(.hidden) .click-cue:hover,
.screen:not(.hidden) .click-cue:focus-visible {
  border-color: rgba(255, 232, 170, 0.96) !important;
  box-shadow: 0 0 0 1px rgba(255, 236, 178, 0.86), 0 0 32px rgba(255, 196, 86, 0.58) !important;
  filter: brightness(1.15);
  transform: translateZ(0) scale(1.022);
}

#studio .studio-mode-toggle.click-cue,
#studio .studio-capture.click-cue,
#studio .studio-camera-toggle.click-cue {
  animation: none !important;
}

#studio .studio-mode-toggle.click-cue.is-cue-active,
#studio .studio-capture.click-cue.is-cue-active,
#studio .studio-camera-toggle.click-cue.is-cue-active,
#studio .studio-mode-toggle.click-cue:hover,
#studio .studio-mode-toggle.click-cue:focus-visible,
#studio .studio-capture.click-cue:hover,
#studio .studio-capture.click-cue:focus-visible,
#studio .studio-camera-toggle.click-cue:hover,
#studio .studio-camera-toggle.click-cue:focus-visible {
  filter: brightness(1.23) drop-shadow(0 0 18px rgba(255, 216, 112, 0.82)) drop-shadow(0 0 38px rgba(212, 137, 42, 0.52)) !important;
  transform: translateZ(0) scale(1.025);
}

#studio .studio-mode-toggle.overlay-border-hidden.click-cue.is-cue-active,
#studio .studio-capture.overlay-border-hidden.click-cue.is-cue-active {
  box-shadow: none !important;
  border-color: transparent !important;
}

.app-shell.calibrating .click-cue,
#admin .click-cue {
  animation: none !important;
  box-shadow: none !important;
  filter: none !important;
}
/* Gift stamp JS-triggered sequence v61. */
.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-envelope {
  animation: gift-envelope-depart var(--gift-envelope-duration, 1.7s) ease-in forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-plane {
  animation: gift-plane-depart var(--gift-plane-duration, 1.7s) var(--gift-plane-delay, 0.3s) ease-in forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  animation: none !important;
  opacity: 0 !important;
  transform: rotate(-9deg) scale(2.2);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-stamping .gift-stamp {
  animation: gift-stamp-hit var(--gift-stamp-duration, 0.9s) ease-out both !important;
  opacity: 1 !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-stamp,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-envelope,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-plane {
  animation: none !important;
}
/* Timeline active contrast v62. */
.journey-timeline article.is-timeline-active {
  color: #0f5f6a !important;
  filter: saturate(1.18) contrast(1.08);
}

.journey-timeline article.is-timeline-active .timeline-icon,
.journey-timeline article.is-timeline-active strong,
.journey-timeline article.is-timeline-active p {
  color: #0f5f6a !important;
  text-shadow:
    0 1px 0 rgba(255, 235, 176, 0.62),
    0 0 0.26em rgba(255, 227, 135, 0.42),
    0 0 0.46em rgba(15, 95, 106, 0.34);
}

.journey-timeline article.is-timeline-active .timeline-icon {
  filter: drop-shadow(0 0 0.24em rgba(255, 226, 138, 0.5)) drop-shadow(0 0 0.35em rgba(15, 95, 106, 0.32));
}
/* Gift idle scenario without stamp v63. */
.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-stamp {
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-envelope {
  animation: gift-envelope-idle-ready 6.8s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-plane {
  animation: gift-plane-idle-ready 6.8s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  visibility: visible;
}

@keyframes gift-envelope-idle-ready {
  0%, 100% { transform: translate(0, 0) rotate(-2deg) scale(1); opacity: 1; }
  18% { transform: translate(3%, -1%) rotate(-1deg) scale(1.015); }
  42% { transform: translate(12%, -2%) rotate(1deg) scale(1.02); }
  62% { transform: translate(7%, 0) rotate(-1deg) scale(1.01); }
}

@keyframes gift-plane-idle-ready {
  0%, 100% { transform: translate(0, 0) rotate(-8deg); opacity: 0.82; }
  45% { transform: translate(4%, -3%) rotate(-7deg); opacity: 0.94; }
  70% { transform: translate(1%, -1%) rotate(-8deg); opacity: 0.88; }
}
/* Gift passport travel scene v64. */
.gift-passport {
  position: absolute;
  left: 38%;
  top: 31%;
  z-index: 2;
  width: 20%;
  height: 24%;
  border: 1px solid rgba(239, 194, 94, 0.72);
  border-radius: 7% 10% 10% 7%;
  background:
    radial-gradient(circle at 50% 48%, rgba(236, 183, 67, 0.18) 0 18%, transparent 19%),
    linear-gradient(120deg, #081c2d, #12324b 48%, #061521);
  box-shadow: 0 0.65em 1.2em rgba(0, 0, 0, 0.36), inset 0 0 0 0.12em rgba(255, 217, 125, 0.17);
  opacity: 0.92;
  transform: perspective(18em) rotate(-6deg) rotateY(0deg);
  transform-origin: left center;
  pointer-events: none;
}

.gift-passport::before {
  content: "PASSEPORT";
  position: absolute;
  left: 12%;
  right: 12%;
  top: 18%;
  color: rgba(247, 205, 112, 0.92);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.68em;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  text-shadow: 0 0 0.5em rgba(255, 200, 85, 0.34);
}

.gift-passport::after {
  content: "";
  position: absolute;
  left: 31%;
  top: 42%;
  width: 38%;
  height: 28%;
  border: 1px solid rgba(247, 205, 112, 0.68);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(247, 205, 112, 0.32), 0 0 0.5em rgba(255, 205, 99, 0.18);
}

.gift-passport span {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent 0 48%, rgba(255, 229, 156, 0.12) 49% 51%, transparent 52%);
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-passport {
  animation: gift-passport-idle 6.8s ease-in-out infinite;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-envelope {
  z-index: 3;
  animation: gift-envelope-idle-ready 6.8s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-plane {
  z-index: 1;
  animation: gift-plane-idle-orbit 9.5s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-stamp {
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-passport {
  animation: gift-passport-open var(--gift-envelope-duration, 1.7s) ease-out forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating:not(.gift-taking-off) .gift-envelope {
  z-index: 3;
  animation: gift-envelope-checkin var(--gift-envelope-duration, 1.7s) ease-in-out forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating:not(.gift-taking-off) .gift-plane {
  z-index: 1;
  animation: none !important;
  opacity: 0.9;
  transform: translate(0, 0) rotate(-8deg);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  z-index: 5;
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden;
  transform: rotate(-9deg) scale(2.2);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-stamping .gift-stamp {
  animation: gift-stamp-hit var(--gift-stamp-duration, 0.9s) ease-out both !important;
  opacity: 1 !important;
  visibility: visible;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-envelope {
  z-index: 3;
  animation: gift-envelope-board-plane var(--gift-plane-duration, 1.7s) ease-in forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-plane {
  z-index: 4;
  animation: gift-plane-depart var(--gift-plane-duration, 1.7s) ease-in forwards !important;
}

@keyframes gift-passport-idle {
  0%, 100% { transform: perspective(18em) rotate(-6deg) rotateY(0deg) translateY(0); }
  45% { transform: perspective(18em) rotate(-5deg) rotateY(-7deg) translateY(-2%); }
  68% { transform: perspective(18em) rotate(-6deg) rotateY(-3deg) translateY(1%); }
}

@keyframes gift-plane-idle-orbit {
  0%, 100% { transform: translate(-8%, 6%) rotate(-8deg); opacity: 0.68; }
  35% { transform: translate(7%, -7%) rotate(-5deg); opacity: 0.96; }
  70% { transform: translate(14%, 3%) rotate(-7deg); opacity: 0.82; }
}

@keyframes gift-passport-open {
  from { transform: perspective(18em) rotate(-6deg) rotateY(0deg); }
  to { transform: perspective(18em) rotate(-3deg) rotateY(-18deg) scale(1.06); }
}

@keyframes gift-envelope-checkin {
  from { transform: translate(0, 0) rotate(-2deg) scale(1); opacity: 1; }
  to { transform: translate(48%, 11%) rotate(4deg) scale(0.9); opacity: 1; }
}

@keyframes gift-envelope-board-plane {
  from { transform: translate(48%, 11%) rotate(4deg) scale(0.9); opacity: 1; }
  42% { transform: translate(95%, -6%) rotate(2deg) scale(0.58); opacity: 0.95; }
  to { transform: translate(180%, -55%) rotate(5deg) scale(0.22); opacity: 0; }
}
/* World tour counter v66. */
.participer-world-tours {
  position: absolute;
  z-index: 12;
  margin: 0;
  color: rgba(51, 33, 12, 0.88);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 800;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 238, 183, 0.42);
}
/* Home world tour counter v67. */
.depart-world-tours {
  position: absolute;
  z-index: 12;
  display: grid;
  place-items: center;
  margin: 0;
  color: rgba(255, 231, 164, 0.92);
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 1.05cqw);
  font-weight: 800;
  line-height: 1.05;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 2px 0 rgba(51, 25, 3, 0.86), 0 0 16px rgba(255, 211, 112, 0.48);
  pointer-events: none;
}
/* Gift mini-story scene v68. */
.gift-deposit-animation {
  overflow: hidden;
  isolation: isolate;
}

.gift-deposit-animation::before {
  content: "";
  position: absolute;
  left: 24%;
  top: 70%;
  z-index: 0;
  width: 30%;
  height: 3.2%;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 126, 0.76), transparent);
  box-shadow: 0 0 1.1em rgba(255, 196, 82, 0.38), 0 0 2.4em rgba(255, 196, 82, 0.2);
  opacity: 0.34;
  transform: perspective(16em) rotateX(64deg);
}

.gift-deposit-animation::after {
  content: "";
  position: absolute;
  inset: 8% 5% 12%;
  z-index: 0;
  border-radius: 1.8em;
  background:
    radial-gradient(circle at 30% 65%, rgba(255, 198, 83, 0.16), transparent 22%),
    radial-gradient(circle at 82% 18%, rgba(255, 235, 170, 0.12), transparent 20%);
  opacity: 0;
  pointer-events: none;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-deposit-animation::after {
  animation: gift-scene-warm-flare 1.4s ease-out both;
}

.gift-deposit-confirm[data-processing="true"] {
  filter: brightness(1.16) drop-shadow(0 0 1.1em rgba(255, 207, 105, 0.45));
}

.gift-stage-message {
  position: absolute;
  left: 28%;
  top: 54%;
  z-index: 7;
  width: 44%;
  color: rgba(255, 235, 176, 0.94);
  font-family: Georgia, "Times New Roman", serif;
  text-align: center;
  text-shadow: 0 0.08em 0 rgba(60, 27, 4, 0.9), 0 0 0.9em rgba(255, 202, 92, 0.56);
  opacity: 0;
  transform: translateY(0.8em) scale(0.96);
  pointer-events: none;
}

.gift-stage-message strong {
  display: block;
  font-size: clamp(1.2rem, 2.1cqw, 2.8rem);
  line-height: 1;
  text-transform: uppercase;
}

.gift-stage-message span {
  display: block;
  margin-top: 0.45em;
  font-size: clamp(0.75rem, 0.95cqw, 1.4rem);
  line-height: 1.16;
}

.gift-deposit-page.gift-taking-off .gift-stage-message,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-stage-message {
  animation: gift-stage-message-in 0.85s ease-out both;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-envelope {
  z-index: 4;
  filter: drop-shadow(0 0.7em 0.9em rgba(0, 0, 0, 0.36)) drop-shadow(0 0 0.55em rgba(255, 208, 104, 0.28));
  animation: gift-envelope-breathe-v68 6.4s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-envelope::after {
  content: "";
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-plane {
  z-index: 1;
  opacity: 0.58;
  filter: drop-shadow(0 0 0.55em rgba(255, 226, 150, 0.34));
  animation: gift-plane-background-loop-v68 10.5s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-passport {
  z-index: 2;
  opacity: 0.78;
  animation: gift-passport-wait-v68 7.4s ease-in-out infinite !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-stamp {
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.gift-passport span::after {
  content: "BON POUR\A UNE ESCALE";
  position: absolute;
  left: 14%;
  top: 46%;
  width: 72%;
  padding: 0.25em 0.18em;
  border: 0.1em solid rgba(145, 52, 30, 0.74);
  color: rgba(133, 43, 25, 0.86);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.54em;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0.05em;
  text-align: center;
  white-space: pre;
  opacity: 0;
  transform: rotate(-8deg) scale(1.22);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-passport {
  z-index: 3;
  animation: gift-passport-open-v68 var(--gift-envelope-duration, 1.7s) ease-out forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating:not(.gift-taking-off) .gift-envelope {
  z-index: 5;
  animation: gift-envelope-slot-v68 var(--gift-envelope-duration, 1.7s) cubic-bezier(.2,.72,.2,1) forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating:not(.gift-taking-off) .gift-plane {
  z-index: 1;
  opacity: 0.72;
  animation: none !important;
  transform: translate(-2%, 6%) rotate(-7deg) scale(0.78);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  z-index: 7;
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  filter: drop-shadow(0 0.75em 0.75em rgba(0, 0, 0, 0.36)) drop-shadow(0 0 0.9em rgba(255, 202, 92, 0.3));
  transform: translate(3%, -78%) rotate(-13deg) scale(0.9);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-stamping:not(.gift-taking-off) .gift-stamp {
  visibility: visible !important;
  opacity: 1 !important;
  animation: gift-stamp-clac-v68 var(--gift-stamp-duration, 0.65s) cubic-bezier(.16,.84,.24,1) both !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-stamping .gift-passport span::after,
.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-passport span::after {
  animation: gift-passport-visa-v68 0.42s ease-out both;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-stamp,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-stamp {
  visibility: hidden !important;
  opacity: 0 !important;
  animation: none !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-envelope {
  z-index: 5;
  animation: gift-envelope-board-v68 var(--gift-plane-duration, 1.7s) cubic-bezier(.25,.72,.21,1) forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-plane {
  z-index: 6;
  opacity: 1;
  animation: gift-plane-takeoff-v68 var(--gift-plane-duration, 1.7s) cubic-bezier(.18,.78,.22,1) forwards !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-taking-off .gift-passport {
  opacity: 0.78;
  transform: perspective(18em) rotate(-3deg) rotateY(-18deg) scale(1.02);
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-envelope,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-plane {
  opacity: 0 !important;
  animation: none !important;
}

@keyframes gift-scene-warm-flare {
  0% { opacity: 0; transform: scale(0.98); }
  35% { opacity: 0.82; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.03); }
}

@keyframes gift-stage-message-in {
  from { opacity: 0; transform: translateY(0.8em) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes gift-envelope-breathe-v68 {
  0%, 100% { transform: translate(0, 0) rotate(-2.5deg) scale(1); }
  18% { transform: translate(0.5%, -2%) rotate(-1.4deg) scale(1.015); }
  22% { transform: translate(-0.3%, -1.2%) rotate(-2.8deg) scale(1.012); }
  58% { transform: translate(1.2%, 0.4%) rotate(-2deg) scale(1.006); }
}

@keyframes gift-plane-background-loop-v68 {
  0%, 100% { transform: translate(-12%, 7%) rotate(-8deg) scale(0.72); opacity: 0.46; }
  42% { transform: translate(12%, -9%) rotate(-4deg) scale(0.82); opacity: 0.72; }
  68% { transform: translate(22%, 2%) rotate(-6deg) scale(0.76); opacity: 0.56; }
}

@keyframes gift-passport-wait-v68 {
  0%, 100% { transform: perspective(18em) rotate(-6deg) rotateY(0deg) translateY(0) scale(0.94); }
  48% { transform: perspective(18em) rotate(-5deg) rotateY(-8deg) translateY(-2%) scale(0.96); }
  70% { transform: perspective(18em) rotate(-6deg) rotateY(-3deg) translateY(1%) scale(0.95); }
}

@keyframes gift-passport-open-v68 {
  0% { transform: perspective(18em) rotate(-6deg) rotateY(0deg) scale(0.94); opacity: 0.78; }
  100% { transform: perspective(18em) rotate(-2deg) rotateY(-22deg) scale(1.05); opacity: 0.94; }
}

@keyframes gift-envelope-slot-v68 {
  0% { transform: translate(0, 0) rotate(-2.5deg) scale(1); opacity: 1; }
  58% { transform: translate(16%, 18%) rotate(-1deg) scale(0.86); opacity: 1; }
  100% { transform: translate(24%, 32%) rotate(2deg) scale(0.62); opacity: 0.88; }
}

@keyframes gift-stamp-clac-v68 {
  0% { opacity: 0; transform: translate(3%, -86%) rotate(-16deg) scale(1.08); }
  34% { opacity: 1; transform: translate(1%, -14%) rotate(-10deg) scale(1.03); }
  48% { opacity: 1; transform: translate(0, 0) rotate(-8deg) scale(0.92); }
  62% { opacity: 1; transform: translate(0, -8%) rotate(-9deg) scale(0.98); }
  100% { opacity: 0; transform: translate(6%, -62%) rotate(-13deg) scale(0.86); }
}

@keyframes gift-passport-visa-v68 {
  from { opacity: 0; transform: rotate(-8deg) scale(1.28); }
  to { opacity: 1; transform: rotate(-8deg) scale(1); }
}

@keyframes gift-envelope-board-v68 {
  0% { transform: translate(24%, 32%) rotate(2deg) scale(0.62); opacity: 0.88; }
  44% { transform: translate(92%, -20%) rotate(5deg) scale(0.36); opacity: 0.92; }
  100% { transform: translate(150%, -58%) rotate(8deg) scale(0.13); opacity: 0; }
}

@keyframes gift-plane-takeoff-v68 {
  0% { transform: translate(-2%, 6%) rotate(-7deg) scale(0.78); opacity: 0.72; }
  25% { transform: translate(14%, -4%) rotate(-8deg) scale(0.86); opacity: 1; }
  100% { transform: translate(138%, -70%) rotate(-13deg) scale(0.74); opacity: 0; }
}
/* Gift configurable engine v69. */
#contribution {
  --gift-glow-rgb: 255, 209, 116;
  --gift-trail-rgb: 255, 226, 160;
  --gift-glow-color: #ffd174;
  --gift-trail-color: #ffe2a0;
  --gift-idle-duration: 8.5s;
  --gift-effect-intensity: 0.75;
  --gift-slot-opacity: 0.34;
  --gift-plane-idle-opacity: 0.58;
  --gift-shadow-alpha: 0.38;
  --gift-flash-opacity: 0.62;
}

.gift-deposit-animation::before {
  opacity: 0 !important;
}

.gift-slot,
.gift-trail,
.gift-particles {
  position: absolute;
  pointer-events: none;
}

.gift-slot {
  left: 24%;
  top: 70%;
  z-index: 1;
  width: 30%;
  height: 3.2%;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(var(--gift-glow-rgb), 0.82), transparent);
  box-shadow: 0 0 1.1em rgba(var(--gift-glow-rgb), 0.48), 0 0 2.6em rgba(var(--gift-glow-rgb), 0.24);
  opacity: var(--gift-slot-opacity, 0.34);
  transform: perspective(16em) rotateX(64deg);
}

.gift-deposit-page:not(.gift-slot-enabled) .gift-slot {
  opacity: 0 !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating.gift-slot-enabled .gift-slot {
  animation: gift-slot-open-v69 var(--gift-envelope-duration, 1.7s) ease-out both;
}

.gift-trail {
  left: 45%;
  top: 37%;
  z-index: 5;
  width: 48%;
  height: 18%;
  border-top: 0.14em dotted rgba(var(--gift-trail-rgb), 0.86);
  border-radius: 70% 40% 0 0;
  filter: drop-shadow(0 0 0.5em rgba(var(--gift-trail-rgb), 0.48));
  opacity: 0;
  transform: rotate(-14deg) scaleX(0.2);
  transform-origin: left center;
}

.gift-deposit-page.gift-taking-off.gift-trail-enabled .gift-trail {
  animation: gift-trail-flight-v69 var(--gift-plane-duration, 1.7s) ease-out both;
}

.gift-particles {
  inset: 20% 16% 24% 16%;
  z-index: 8;
  opacity: 0;
}

.gift-particles span {
  position: absolute;
  width: 0.38em;
  height: 0.38em;
  border-radius: 50%;
  background: rgba(var(--gift-glow-rgb), 0.92);
  box-shadow: 0 0 0.75em rgba(var(--gift-glow-rgb), 0.72);
}

.gift-particles span:nth-child(1) { left: 48%; top: 38%; }
.gift-particles span:nth-child(2) { left: 55%; top: 42%; }
.gift-particles span:nth-child(3) { left: 61%; top: 35%; }
.gift-particles span:nth-child(4) { left: 52%; top: 31%; }
.gift-particles span:nth-child(5) { left: 65%; top: 47%; }

.gift-deposit-page.gift-stamping.gift-particles-enabled .gift-particles {
  animation: gift-particles-pop-v69 var(--gift-stamp-duration, 0.68s) ease-out both;
}

.gift-deposit-page.gift-flash-enabled.gift-validating .gift-deposit-animation::after {
  animation: gift-scene-warm-flare-v69 1.35s ease-out both !important;
}

.gift-deposit-page:not(.gift-flash-enabled).gift-validating .gift-deposit-animation::after {
  animation: none !important;
  opacity: 0 !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-envelope {
  filter: drop-shadow(0 0.7em 0.9em rgba(0, 0, 0, var(--gift-shadow-alpha))) drop-shadow(0 0 0.55em rgba(var(--gift-glow-rgb), 0.34));
  animation-duration: var(--gift-idle-duration, 8.5s) !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-plane {
  opacity: var(--gift-plane-idle-opacity, 0.58) !important;
  filter: drop-shadow(0 0 0.55em rgba(var(--gift-trail-rgb), 0.34));
  animation-duration: var(--gift-plane-idle-duration, 10.6s) !important;
}

.gift-deposit-page:not(.gift-timeline-enabled):not(.gift-validating) .gift-passport {
  filter: drop-shadow(0 0.55em 0.85em rgba(0, 0, 0, var(--gift-shadow-alpha))) drop-shadow(0 0 0.45em rgba(var(--gift-glow-rgb), 0.16));
  animation-duration: var(--gift-passport-idle-duration, 7.8s) !important;
}

.gift-deposit-page:not(.gift-timeline-enabled).gift-validating .gift-stamp {
  filter: drop-shadow(0 0.75em 0.75em rgba(0, 0, 0, var(--gift-shadow-alpha))) drop-shadow(0 0 0.9em rgba(var(--gift-glow-rgb), 0.32));
}

.gift-passport span::after {
  content: attr(data-stamp-text);
  border-color: rgba(145, 52, 30, 0.78);
  color: rgba(133, 43, 25, 0.9);
}

.gift-stage-message {
  color: rgba(var(--gift-trail-rgb), 0.96);
  text-shadow: 0 0.08em 0 rgba(60, 27, 4, 0.9), 0 0 0.9em rgba(var(--gift-glow-rgb), 0.56);
}

.gift-stage-message strong {
  font-size: var(--overlay-font-size, clamp(1.15rem, 1.85cqw, 3rem));
}

.gift-stage-message span {
  font-size: clamp(0.72rem, 0.9cqw, 1.4rem);
}

#admin .gift-scene-settings {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0.9rem;
}

#admin .gift-scene-settings label,
#admin .gift-advanced-settings label {
  min-width: 0;
}

#admin .gift-scene-settings textarea {
  min-height: 4.2rem;
  resize: vertical;
}

#admin .gift-effect-toggles {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0.55rem;
}

#admin .gift-advanced-settings {
  grid-column: 1 / -1;
  margin-top: 1rem;
}

#admin .gift-advanced-settings summary {
  cursor: pointer;
  font-weight: 800;
  color: #183c35;
}

@keyframes gift-slot-open-v69 {
  0%, 100% { opacity: var(--gift-slot-opacity, 0.34); transform: perspective(16em) rotateX(64deg) scaleX(1); }
  42% { opacity: calc(var(--gift-slot-opacity, 0.34) + 0.26); transform: perspective(16em) rotateX(64deg) scaleX(1.12); }
}

@keyframes gift-scene-warm-flare-v69 {
  0% { opacity: 0; transform: scale(0.98); }
  35% { opacity: var(--gift-flash-opacity, 0.62); transform: scale(1); }
  100% { opacity: 0; transform: scale(1.03); }
}

@keyframes gift-trail-flight-v69 {
  0% { opacity: 0; transform: rotate(-14deg) scaleX(0.12); }
  30% { opacity: var(--gift-trail-opacity, 0.64); transform: rotate(-14deg) scaleX(0.8); }
  100% { opacity: 0; transform: rotate(-14deg) scaleX(1.15) translateX(8%); }
}

@keyframes gift-particles-pop-v69 {
  0% { opacity: 0; transform: scale(0.75); }
  24% { opacity: var(--gift-particles-opacity, 0.68); transform: scale(1); }
  100% { opacity: 0; transform: scale(1.48); }
}
/* Gift stage visibility v69. */
.gift-stage-message {
  visibility: hidden;
}

.gift-deposit-page.gift-taking-off .gift-stage-message,
.gift-deposit-page:not(.gift-timeline-enabled).gift-confirmed .gift-stage-message {
  visibility: visible;
}

.gift-deposit-page:not(.gift-slot-enabled) .gift-slot {
  visibility: hidden;
}

.gift-deposit-page.gift-slot-enabled .gift-slot {
  visibility: visible;
}
/* Gift preset apply button v69. */
#admin .gift-preset-apply {
  align-self: end;
  min-height: 2.55rem;
  border: 1px solid rgba(24, 60, 53, 0.42);
  border-radius: 8px;
  background: #17453d;
  color: #fff7df;
  font-weight: 800;
  cursor: pointer;
}

#admin .gift-preset-apply:hover,
#admin .gift-preset-apply:focus-visible {
  background: #0f342f;
  box-shadow: 0 0 0 3px rgba(207, 155, 64, 0.18);
}
/* Gift timeline engine v71. */
.gift-deposit-page.gift-timeline-enabled .gift-deposit-animation {
  overflow: visible;
}

.gift-deposit-page.gift-timeline-enabled .gift-deposit-animation::after {
  animation: none !important;
  opacity: 0 !important;
}

.gift-deposit-page.gift-timeline-enabled .gift-envelope,
.gift-deposit-page.gift-timeline-enabled .gift-plane,
.gift-deposit-page.gift-timeline-enabled .gift-passport,
.gift-deposit-page.gift-timeline-enabled .gift-stamp,
.gift-deposit-page.gift-timeline-enabled .gift-slot,
.gift-deposit-page.gift-timeline-enabled .gift-trail,
.gift-deposit-page.gift-timeline-enabled .gift-particles,
.gift-deposit-page.gift-timeline-enabled .gift-stage-message {
  animation: none !important;
  will-change: background-position, opacity;
}

.gift-deposit-page.gift-timeline-enabled .gift-stamp,
.gift-deposit-page.gift-timeline-enabled .gift-stage-message,
.gift-deposit-page.gift-timeline-enabled .gift-slot,
.gift-deposit-page.gift-timeline-enabled .gift-trail,
.gift-deposit-page.gift-timeline-enabled .gift-particles {
  visibility: visible !important;
}

#admin .gift-timeline-settings {
  grid-column: 1 / -1;
  margin-top: 1rem;
  padding: 0.85rem;
  border: 1px solid rgba(24, 60, 53, 0.18);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255, 252, 243, 0.92), rgba(241, 247, 243, 0.92));
}

#admin .gift-timeline-settings summary {
  cursor: pointer;
  color: #173f38;
  font-weight: 900;
}

#admin .gift-timeline-help {
  margin: 0.65rem 0 0.8rem;
  color: #4c625e;
  font-size: 0.92rem;
}

#admin .gift-timeline-topbar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
  align-items: end;
}

#admin .gift-timeline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0.9rem 0;
}

#admin .gift-timeline-actions button,
#admin .gift-timeline-table button {
  min-height: 2.2rem;
  border: 1px solid rgba(24, 60, 53, 0.28);
  border-radius: 8px;
  background: #fffaf0;
  color: #162b27;
  font-weight: 800;
  cursor: pointer;
}

#admin .gift-timeline-actions button:hover,
#admin .gift-timeline-table button:hover:not(:disabled) {
  background: #17453d;
  color: #fff7df;
}

#admin .gift-timeline-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(24, 60, 53, 0.15);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.74);
}

#admin .gift-timeline-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

#admin .gift-timeline-table th,
#admin .gift-timeline-table td {
  padding: 0.45rem;
  border-bottom: 1px solid rgba(24, 60, 53, 0.1);
  text-align: left;
  white-space: nowrap;
}

#admin .gift-timeline-table th {
  color: #173f38;
  font-size: 0.78rem;
  text-transform: uppercase;
}

#admin .gift-timeline-table input {
  width: 5.9rem;
  min-height: 2.05rem;
  padding: 0.25rem 0.35rem;
  border: 1px solid rgba(24, 60, 53, 0.24);
  border-radius: 6px;
}

#admin .gift-timeline-table .mini-danger {
  padding: 0 0.65rem;
  color: #78301d;
}

#admin .gift-timeline-table .mini-danger:disabled {
  opacity: 0.35;
  cursor: default;
}
/* Home dynamic layers click-through v72. */
#depart .depart-distance-live,
#depart .distance-chip,
#depart .depart-world-tours,
#depart .depart-current-label,
#depart .depart-current-city,
#depart .depart-next-label,
#depart .depart-next-city,
#depart .depart-last-activity,
#depart .depart-route-markers,
#participer .participer-distance-live,
#participer .participer-world-tours,
#participer .participer-progress-track,
#participer .participer-next-stop-label,
#participer .participer-next-stop-name,
#participer .participer-next-stop-distance,
#participer .participer-dynamic-text {
  pointer-events: none !important;
}

#depart .depart-voyages,
#depart .depart-participer {
  z-index: 30 !important;
  pointer-events: auto !important;
}
/* Home calibration click-through exception v72. */
.app-shell.calibrating #depart [data-overlay-key],
.app-shell.calibrating #participer [data-overlay-key],
.app-shell.calibrating #depart .depart-route-markers,
.app-shell.calibrating #depart .depart-route-step {
  pointer-events: auto !important;
}
/* Home calibration hit testing v184: the full route layer must not swallow clicks. */
.app-shell.calibrating #depart .depart-route-markers {
  pointer-events: none !important;
}

.app-shell.calibrating #depart .depart-route-step {
  pointer-events: auto !important;
}

.app-shell.calibrating #depart .depart-distance-live,
.app-shell.calibrating #depart .depart-world-tours {
  z-index: 44 !important;
  pointer-events: auto !important;
}

/* Gift timeline inline preview v73. */
#admin .gift-timeline-preview-panel {
  display: grid;
  grid-template-columns: minmax(240px, 0.7fr) minmax(340px, 1.3fr);
  gap: 0.85rem;
  align-items: stretch;
  margin: 0.8rem 0 1rem;
}

#admin .gift-timeline-preview-copy {
  display: grid;
  align-content: center;
  min-height: 9.5rem;
  border: 1px solid rgba(24, 60, 53, 0.14);
  border-radius: 10px;
  padding: 1rem;
  background: rgba(255, 250, 238, 0.78);
  color: #29433e;
}

#admin .gift-timeline-preview-copy strong {
  color: #173f38;
  font-size: 1rem;
}

#admin .gift-timeline-preview-copy span {
  margin-top: 0.35rem;
  color: #5a6d69;
  line-height: 1.35;
}

#admin .gift-timeline-preview {
  position: relative;
  min-height: 220px;
  overflow: hidden;
  border: 1px solid rgba(207, 155, 64, 0.34);
  border-radius: 12px;
  background:
    radial-gradient(circle at 26% 70%, rgba(255, 198, 83, 0.18), transparent 26%),
    radial-gradient(circle at 76% 20%, rgba(255, 236, 174, 0.14), transparent 24%),
    linear-gradient(135deg, #111d1d, #2f2115 54%, #07100f);
  box-shadow: inset 0 0 0 1px rgba(255, 234, 166, 0.08), 0 16px 36px rgba(20, 33, 30, 0.12);
  aspect-ratio: 16 / 9;
  container-type: inline-size;
}

#admin .gift-timeline-preview .gift-deposit-animation {
  position: absolute;
  inset: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#admin .gift-timeline-preview .gift-preview-asset {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#admin .gift-timeline-preview .gift-preview-envelope:not(.has-custom-asset) {
  border: 1px solid rgba(117, 65, 24, 0.32);
  border-radius: 5px;
  background:
    linear-gradient(150deg, transparent 48%, rgba(120, 64, 24, 0.24) 49% 51%, transparent 52%),
    linear-gradient(30deg, transparent 48%, rgba(120, 64, 24, 0.2) 49% 51%, transparent 52%),
    linear-gradient(180deg, #e4c18a, #f3d8a2 52%, #c89252);
  box-shadow: 0 0.55em 1.2em rgba(0, 0, 0, 0.28), inset 0 0 0 2px rgba(255, 246, 211, 0.18);
}

#admin .gift-timeline-preview .gift-preview-plane:not(.has-custom-asset) {
  clip-path: polygon(0 44%, 68% 32%, 100% 0, 84% 46%, 100% 100%, 67% 68%, 0 58%);
  background: linear-gradient(90deg, #ffeab0, #bd7d25);
  filter: drop-shadow(0 0 0.55em rgba(255, 216, 126, 0.38));
}

#admin .gift-timeline-preview .gift-preview-stamp:not(.has-custom-asset) {
  border: 0.18em solid rgba(139, 42, 24, 0.8);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 220, 150, 0.94), rgba(141, 47, 28, 0.16) 62%, rgba(141, 47, 28, 0.7));
  box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.28);
}

#admin .gift-timeline-preview .gift-stage-message {
  visibility: visible;
}

#admin .gift-timeline-preview .gift-particles span {
  width: 0.32em;
  height: 0.32em;
}

@media (max-width: 900px) {
  #admin .gift-timeline-preview-panel {
    grid-template-columns: 1fr;
  }
}
/* Gift animation element visibility v74. */
.gift-deposit-page.gift-envelope-disabled .gift-envelope,
.gift-deposit-page.gift-passport-disabled .gift-passport,
.gift-deposit-page.gift-plane-disabled .gift-plane,
.gift-deposit-page.gift-plane-disabled .gift-trail {
  visibility: hidden !important;
  opacity: 0 !important;
  animation: none !important;
  pointer-events: none !important;
}

#admin .gift-element-toggles {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0.55rem;
  padding: 0.75rem;
  border: 1px solid rgba(24, 60, 53, 0.14);
  border-radius: 10px;
  background: rgba(255, 250, 238, 0.7);
}

#admin .gift-element-toggles strong {
  grid-column: 1 / -1;
  color: #173f38;
  font-size: 0.88rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* Practical light overlays v75. */
.practical-light {
  position: absolute;
  z-index: 18;
  display: block;
  overflow: visible;
  border: 0;
  background: transparent;
  pointer-events: none;
  mix-blend-mode: screen;
  filter: saturate(1.18);
}

.practical-light::before,
.practical-light::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  transform-origin: 50% 70%;
}

.flame-light::before {
  width: 34%;
  height: 58%;
  border-radius: 58% 42% 56% 44% / 72% 72% 34% 34%;
  background:
    radial-gradient(circle at 48% 38%, rgba(255, 255, 218, 0.98) 0 12%, rgba(255, 214, 92, 0.96) 22%, rgba(255, 126, 38, 0.75) 48%, rgba(255, 78, 25, 0.18) 72%, transparent 76%);
  filter: blur(0.02em) drop-shadow(0 0 0.35em rgba(255, 185, 72, 0.78));
  animation: practical-flame-core-v75 1.25s infinite ease-in-out alternate;
}

.flame-light::after {
  width: 145%;
  height: 145%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 52%, rgba(255, 236, 152, 0.58), rgba(255, 159, 45, 0.24) 34%, rgba(255, 104, 31, 0.08) 58%, transparent 72%);
  filter: blur(0.45em);
  opacity: 0.76;
  animation: practical-flame-glow-v75 1.9s infinite ease-in-out alternate;
}

.bulb-light::before {
  width: 42%;
  height: 42%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 235, 0.96) 0 18%, rgba(255, 226, 134, 0.88) 38%, rgba(255, 177, 64, 0.22) 66%, transparent 76%);
  box-shadow: 0 0 0.8em rgba(255, 232, 151, 0.75), 0 0 1.65em rgba(255, 171, 61, 0.38);
  animation: practical-bulb-core-v75 2.7s infinite steps(1, end);
}

.bulb-light::after {
  width: 190%;
  height: 190%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 239, 178, 0.46), rgba(255, 193, 80, 0.18) 36%, rgba(255, 193, 80, 0.05) 58%, transparent 74%);
  filter: blur(0.35em);
  animation: practical-bulb-glow-v75 3.4s infinite ease-in-out;
}

@keyframes practical-flame-core-v75 {
  0% { opacity: 0.74; transform: translate(-50%, -50%) rotate(-3deg) scale(0.9, 1.08); }
  28% { opacity: 0.98; transform: translate(-49%, -53%) rotate(2deg) scale(1.06, 0.96); }
  56% { opacity: 0.84; transform: translate(-52%, -49%) rotate(-1deg) scale(0.95, 1.14); }
  100% { opacity: 1; transform: translate(-50%, -54%) rotate(4deg) scale(1.03, 1.01); }
}

@keyframes practical-flame-glow-v75 {
  0% { opacity: 0.34; transform: translate(-50%, -50%) scale(0.86); }
  45% { opacity: 0.78; transform: translate(-50%, -51%) scale(1.08); }
  100% { opacity: 0.52; transform: translate(-50%, -50%) scale(0.98); }
}

@keyframes practical-bulb-core-v75 {
  0%, 8%, 13%, 100% { opacity: 0.92; filter: brightness(1); }
  9%, 11% { opacity: 0.56; filter: brightness(0.72); }
  42% { opacity: 1; filter: brightness(1.24); }
  63% { opacity: 0.78; filter: brightness(0.9); }
}

@keyframes practical-bulb-glow-v75 {
  0%, 100% { opacity: 0.46; transform: translate(-50%, -50%) scale(0.96); }
  38% { opacity: 0.78; transform: translate(-50%, -50%) scale(1.08); }
  61% { opacity: 0.36; transform: translate(-50%, -50%) scale(0.9); }
}

.app-shell.calibrating .practical-light {
  mix-blend-mode: normal;
  background: rgba(255, 214, 113, 0.1);
}

.app-shell.calibrating .practical-light::before,
.app-shell.calibrating .practical-light::after {
  pointer-events: none;
}
/* Extra flames and film fallback v77. */
#mariage-film,
#mariage-messages,
#mariage-poeme {
  --screen-bg: none;
}

#mariage-film .detail-page-panel,
#mariage-film .detail-page-media,
#mariage-film .marriage-video-player {
  width: 100%;
  height: 100%;
}

#mariage-film .marriage-video-player {
  background: rgba(3, 3, 3, 0.64);
}

#mariage-film .marriage-video-frame {
  background: rgba(5, 4, 3, 0.52);
}

.journey-timeline article.is-timeline-active .timeline-icon,
.journey-timeline article.is-timeline-active strong,
.journey-timeline article.is-timeline-active p {
  text-shadow: none !important;
}

.journey-timeline article.is-timeline-active .timeline-icon {
  filter: none !important;
}
/* Poem bouquet photo must sit behind the transparent page background. */
#mariage-poeme .screen-design-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--screen-bg, none) center / contain no-repeat;
  filter: brightness(var(--page-background-brightness, 1));
  pointer-events: none;
}

#mariage-poeme #poemBouquetPhoto {
  z-index: 1 !important;
}

/* Random memory card popup: configurable visual support + script text. */
.experience-viewer.is-memory-card {
  position: fixed;
  left: 29%;
  top: 18%;
  width: 42%;
  height: 58%;
  max-width: none;
  max-height: none;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  padding: 0;
  background-color: transparent;
  background-image: var(--memory-card-background, none);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  color: rgba(74, 37, 15, 0.92);
  box-shadow: none;
}

.experience-viewer.is-memory-card::backdrop {
  background: rgba(0, 0, 0, 0.46);
  backdrop-filter: none;
}

.experience-viewer.is-memory-card .experience-viewer-kicker,
.experience-viewer.is-memory-card h2,
.experience-viewer.is-memory-card .experience-viewer-action {
  display: none;
}

.experience-viewer.is-memory-card .experience-viewer-media {
  display: none;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media {
  position: absolute;
  left: 8%;
  top: 18%;
  width: 28%;
  height: 60%;
  display: block;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  background: transparent;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media img,
.experience-viewer.is-memory-card.has-card-media .experience-viewer-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  border-radius: inherit;
  box-shadow: none;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media video {
  background: rgba(10, 6, 3, 0.18);
}

.experience-viewer.is-memory-card .experience-viewer-copy {
  position: absolute;
  left: 15%;
  top: 24%;
  width: 70%;
  height: 48%;
  margin: 0;
  display: grid;
  place-items: center;
  white-space: pre-line;
  color: rgba(79, 42, 20, 0.92);
  font-family: "Segoe Script", "Brush Script MT", "Lucida Handwriting", cursive;
  font-size: var(--overlay-font-size, 2.4cqw);
  line-height: 1.25;
  text-align: center;
}

.experience-viewer.is-memory-card .experience-viewer-close {
  top: 3%;
  right: 4%;
  min-height: 30px;
  border-color: rgba(74, 37, 15, 0.25);
  background: rgba(20, 13, 6, 0.2);
  color: rgba(74, 37, 15, 0.78);
}

.gift-qrcode[hidden],
.gift-qrcode:not([src]),
.gift-qrcode[src=""] {
  display: none !important;
}

/* Popup/calibrage réglables */
.remote-gift-panel {
  background-color: transparent !important;
  background-image: var(--remote-gift-popup-background, none) !important;
  background-position: center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  container-type: size;
}

.remote-gift-panel > p,
.remote-gift-panel h2,
.remote-gift-options,
.remote-gift-details,
.remote-gift-panel > small {
  position: absolute;
  box-sizing: border-box;
}

.remote-gift-panel > p,
.remote-gift-panel h2,
.remote-gift-panel small,
.remote-gift-details,
.remote-gift-options button {
  text-shadow: none;
  transform: translateZ(0);
  -webkit-font-smoothing: antialiased;
}

.remote-gift-details {
  background: transparent;
}

.app-shell.calibrating [data-overlay-key] {
  border-width: var(--overlay-border-width, 1px) !important;
}

.app-shell.calibrating [data-overlay-key].overlay-element-hidden {
  opacity: 0.28 !important;
  filter: grayscale(0.25);
}

.app-shell:not(.calibrating) [data-overlay-key].overlay-element-hidden {
  display: none !important;
}

.calibration-panel {
  width: min(320px, calc(100vw - 32px));
  padding: 10px;
  font-size: 11px;
}

.calibration-panel header {
  gap: 8px;
  margin-bottom: 8px;
}

.calibration-panel header strong {
  font-size: 13px;
}

.calibration-panel label {
  margin: 7px 0;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.calibration-panel select,
.calibration-panel input[type="number"] {
  min-height: 30px;
  padding: 0 7px;
}

.calibration-panel input[type="number"] {
  width: 64px;
}

.calibration-row {
  grid-template-columns: minmax(0, 1fr) 64px;
  gap: 6px;
}

.calibration-panel .calibration-border-toggle {
  padding: 7px;
  gap: 7px;
}

.cue-settings {
  display: grid;
  gap: 10px;
}

.cue-setting-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.cue-setting-fields label,
.cue-glow-toggle {
  display: grid;
  gap: 6px;
  margin: 0;
}

.cue-setting-fields input[type="number"] {
  width: 100%;
}

.cue-glow-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
}

.screen:not(.hidden) .click-cue.is-cue-active {
  border-width: var(--cue-border-width, 1px) !important;
}

.screen:not(.hidden) .click-cue.click-cue-glow-only,
.screen:not(.hidden) .click-cue.click-cue-glow-only:hover,
.screen:not(.hidden) .click-cue.click-cue-glow-only:focus-visible {
  border-color: transparent !important;
}

.screen:not(.hidden) .click-cue.click-cue-glow-only.is-cue-active {
  border-color: transparent !important;
  box-shadow: 0 0 24px rgba(255, 213, 122, 0.72), 0 0 46px rgba(255, 184, 61, 0.48) !important;
}
/* Practical light cleanup v83: no rectangular blur boxes. */
.practical-light {
  background: transparent !important;
  filter: none;
  isolation: isolate;
}

.flame-light::before {
  width: 32%;
  height: 56%;
  background:
    radial-gradient(ellipse at 50% 28%, rgba(255, 255, 224, 0.98) 0 10%, rgba(255, 226, 116, 0.95) 20%, rgba(255, 146, 45, 0.78) 47%, rgba(255, 87, 28, 0.22) 68%, transparent 76%);
  filter: drop-shadow(0 0 0.28em rgba(255, 190, 75, 0.72));
}

.flame-light::after {
  width: 260%;
  height: 230%;
  border-radius: 999px;
  background:
    radial-gradient(ellipse at 50% 58%, rgba(255, 238, 164, 0.42) 0 10%, rgba(255, 178, 58, 0.23) 28%, rgba(255, 116, 34, 0.1) 46%, rgba(255, 116, 34, 0.025) 62%, transparent 74%);
  filter: none !important;
  opacity: 0.68;
}

.bulb-light::after {
  width: 250%;
  height: 250%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 244, 187, 0.46) 0 12%, rgba(255, 198, 80, 0.2) 34%, rgba(255, 177, 64, 0.055) 56%, transparent 74%);
  filter: none !important;
}

.app-shell.calibrating .practical-light {
  background: transparent !important;
}
/* Poem page controls v84: configurable discreet arrows. */
.poem-page-arrow {
  display: grid;
  place-items: center;
  border: var(--overlay-border-width, 1px) solid rgba(var(--poem-arrow-border-rgb, 92, 46, 25), var(--poem-arrow-border-opacity, 0.12));
  background: rgba(var(--poem-arrow-bg-rgb, 255, 240, 200), var(--poem-arrow-bg-opacity, 0));
  color: rgba(var(--poem-arrow-color-rgb, 91, 50, 31), var(--poem-arrow-text-opacity, 0.7));
  font-size: var(--poem-arrow-font-size, clamp(28px, 3.1cqw, 52px));
  font-weight: 600;
  text-shadow: none;
  box-shadow: 0 0 18px rgba(255, 205, 118, var(--poem-arrow-glow-opacity, 0.12));
}
.poem-page-arrow:hover,
.poem-page-arrow:focus-visible {
  color: rgba(var(--poem-arrow-color-rgb, 91, 50, 31), 1);
  background: rgba(var(--poem-arrow-bg-rgb, 255, 240, 200), calc(var(--poem-arrow-bg-opacity, 0) + 0.08));
  box-shadow: 0 0 26px rgba(255, 205, 118, calc(var(--poem-arrow-glow-opacity, 0.12) + 0.18));
}
.poem-page-arrow.poem-arrow-config-hidden {
  display: none !important;
}
.app-shell.calibrating .poem-page-arrow.poem-arrow-config-hidden {
  display: grid !important;
  opacity: 0.28 !important;
}
.poem-paging-setting-fields label {
  min-width: 150px;
}
.poem-paging-setting-fields input[type="text"] {
  min-width: 68px;
}
/* Remote transfer secure link v85. */
.remote-payment-note {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  color: #52655e;
  font-size: 0.9rem;
  line-height: 1.35;
}

.remote-secure-url {
  display: block;
  margin: 14px auto 12px;
  max-width: min(100%, 520px);
  padding: 10px 12px;
  border: 1px solid rgba(229, 187, 104, 0.48);
  border-radius: 6px;
  color: #ffe7ad;
  background: rgba(0, 0, 0, 0.22);
  overflow-wrap: anywhere;
  text-decoration: none;
}

.remote-secure-url:hover,
.remote-secure-url:focus-visible {
  color: #fff4c9;
  box-shadow: 0 0 16px rgba(229, 187, 104, 0.32);
}

.remote-secure-qr {
  display: block;
  width: min(34%, 170px);
  min-width: 112px;
  aspect-ratio: 1;
  margin: 12px auto;
  padding: 8px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.32);
}
/* Memory card editor polish v86. */
.memory-card-panel {
  border: 1px solid #d8e2df;
  border-radius: 10px;
  background: linear-gradient(180deg, #fbfdfc 0%, #f3f8f6 100%);
  overflow: hidden;
}
.memory-card-panel summary {
  cursor: pointer;
  padding: 12px 14px;
  color: #173f38;
  font-weight: 900;
}
.memory-card-panel .memory-card-layout-settings {
  border: 0;
  border-top: 1px solid #d8e2df;
  border-radius: 0;
  background: transparent;
}
.memory-card-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid #d8e2df;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(20, 52, 47, 0.06);
}
.memory-card-toolbar div {
  display: grid;
  gap: 3px;
}
.memory-card-toolbar strong {
  color: #153f38;
}
.memory-card-toolbar span {
  color: #5f706b;
  font-size: 0.9rem;
}
.memory-card-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
}
.memory-card-editor {
  gap: 14px;
  border: 1px solid #d8e2df;
  border-left: 5px solid #bf8b34;
  border-radius: 12px;
  padding: 14px;
  background: linear-gradient(180deg, #fffdfa 0%, #fff7e9 100%);
  box-shadow: 0 12px 28px rgba(42, 28, 12, 0.08);
}
.memory-card-editor header div {
  display: grid;
  gap: 2px;
}
.memory-card-editor header span {
  color: #7d6d53;
  font-size: 0.86rem;
  font-weight: 700;
}
.memory-card-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.memory-card-text-field {
  grid-column: 1 / -1;
}
.memory-card-layout-settings input,
.memory-card-editor input,
.memory-card-editor textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #c8d5d1;
  border-radius: 7px;
  padding: 8px 9px;
  background: rgba(255, 255, 255, 0.92);
  color: #182230;
  font: inherit;
}
.memory-card-editor textarea {
  min-height: 116px;
  resize: vertical;
}
.memory-card-media-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 0.55fr);
  gap: 12px;
  align-items: stretch;
}
.memory-card-media-preview {
  min-height: 92px;
  display: grid;
  place-items: center;
  border: 1px dashed #c8d5d1;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.64);
  overflow: hidden;
}
.memory-card-media-preview small {
  padding: 10px;
  color: #667085;
  text-align: center;
}
.memory-card-media-preview .admin-media-preview {
  width: 100%;
  height: 100%;
  margin: 0;
}
.memory-card-media-preview .admin-media-preview img,
.memory-card-media-preview .admin-media-preview video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 780px) {
  .memory-card-toolbar,
  .memory-card-media-row {
    grid-template-columns: 1fr;
    display: grid;
  }
  .memory-card-fields {
    grid-template-columns: 1fr;
  }
}

.experience-viewer.is-memory-card .memory-card-period,
.experience-viewer.is-memory-card .memory-card-shared-by {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.52em;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(99, 55, 24, 0.72);
}
.experience-viewer.is-memory-card .memory-card-title {
  margin: 0.12em 0 0.3em;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.88em;
  line-height: 1.05;
  color: rgba(84, 43, 17, 0.9);
}
.experience-viewer.is-memory-card .memory-card-main-text {
  margin: 0;
  white-space: pre-line;
}
.experience-viewer.is-memory-card .memory-card-shared-by {
  margin-top: 0.65em;
  font-size: 0.46em;
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
}
/* Memory card popup refresh v87. */
.experience-viewer:not(.is-memory-card) .memory-card-refresh {
  display: none !important;
}

.experience-viewer.is-memory-card .memory-card-refresh {
  position: absolute;
  right: 4%;
  bottom: 4%;
  z-index: 7;
  min-width: clamp(120px, 11cqw, 190px);
  min-height: clamp(34px, 3.2cqw, 48px);
  padding: 0.55em 1.1em;
  border: 1px solid rgba(126, 72, 25, 0.34);
  border-radius: 999px;
  background: rgba(255, 232, 174, 0.1);
  color: rgba(82, 43, 18, 0.82);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(12px, 1.1cqw, 17px);
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  box-shadow: 0 0 18px rgba(164, 103, 33, 0.12);
  backdrop-filter: blur(1px);
}

.experience-viewer.is-memory-card .memory-card-refresh:hover,
.experience-viewer.is-memory-card .memory-card-refresh:focus-visible {
  color: rgba(64, 31, 12, 0.98);
  background: rgba(255, 229, 164, 0.2);
  border-color: rgba(126, 72, 25, 0.52);
  box-shadow: 0 0 24px rgba(189, 128, 47, 0.26);
}

.experience-viewer.is-memory-card .memory-card-refresh:disabled {
  opacity: 0.55;
  pointer-events: none;
}
/* Admin tabs and per-frame cue controls v88. */
.admin-tabs {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 7px;
}

.admin-tabs button {
  flex: 0 1 auto;
  min-height: 34px;
  padding: 0 13px;
  font-size: 12px;
  white-space: nowrap;
}

#admin .admin-card[data-admin-tab="content"] .page-content-settings,
#admin .admin-card[data-admin-tab="memories"] .memory-card-settings,
#admin .admin-card[data-admin-tab="memories"] .experience-settings {
  margin-top: 10px;
}

.poem-paging-settings-card {
  grid-column: span 2;
}

#poemPagingSettings .poem-paging-setting-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  align-items: end;
}

#poemPagingSettings .poem-paging-setting-fields label {
  min-width: 0;
  display: grid;
  gap: 6px;
  margin: 0;
  color: #53615e;
  font-size: 0.84rem;
  line-height: 1.18;
}

#poemPagingSettings .poem-paging-setting-fields label span {
  min-height: 2.35em;
  display: flex;
  align-items: flex-end;
  overflow-wrap: anywhere;
}

#poemPagingSettings .poem-paging-setting-fields input[type="text"],
#poemPagingSettings .poem-paging-setting-fields input[type="number"],
#poemPagingSettings .poem-paging-setting-fields input[type="color"] {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#poemPagingSettings .poem-paging-setting-fields input[type="checkbox"] {
  width: auto;
  justify-self: start;
}

.cue-settings-note {
  margin: 2px 0 0;
  padding: 9px 10px;
  border-left: 3px solid #bd8d34;
  border-radius: 7px;
  color: #52645f;
  background: rgba(189, 141, 52, 0.08);
  font-size: 0.92rem;
  line-height: 1.35;
}

.calibration-panel .calibration-cue-toggle {
  border-color: rgba(189, 141, 52, 0.38);
  background: rgba(189, 141, 52, 0.08);
}

@media (max-width: 760px) {
  .poem-paging-settings-card {
    grid-column: 1 / -1;
  }

  #poemPagingSettings .poem-paging-setting-fields {
    grid-template-columns: 1fr;
  }
}
/* Calibration popup visibility v89. */
.app-shell.calibrating .experience-viewer.is-memory-card[open] {
  z-index: 70;
  display: block;
  pointer-events: auto;
}

.app-shell.calibrating .experience-viewer.is-memory-card .experience-viewer-media {
  display: block;
  border: 1px dashed rgba(120, 73, 28, 0.42);
  background: rgba(255, 232, 174, 0.08);
}

.memory-card-media-calibration-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: rgba(80, 43, 20, 0.6);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(13px, 1.2cqw, 20px);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
/* Admin backup card layout v90. */
.backup-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.backup-card h3 {
  margin-bottom: 2px;
}

.backup-card button {
  margin: 0;
  min-height: 40px;
  white-space: normal;
}

.backup-folder-row,
.backup-export-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.backup-folder-row button {
  width: 100%;
  max-width: 280px;
}

.backup-export-row button {
  flex: 1 1 150px;
}

.backup-restore-list {
  display: grid;
  gap: 10px;
}

.backup-restore-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #f8faf9;
}

.backup-restore-row strong,
.backup-restore-row span {
  display: block;
}

.backup-restore-row strong {
  color: #183b35;
  font-size: 13px;
}

.backup-restore-row span {
  margin-top: 3px;
  color: #667085;
  font-size: 12px;
  line-height: 1.25;
}

.backup-card input[type="file"][hidden] {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

.backup-card #folderStatus {
  margin: 2px 0 0;
}

@media (max-width: 760px) {
  .backup-restore-row {
    grid-template-columns: 1fr;
  }

  .backup-restore-row button,
  .backup-export-row button,
  .backup-folder-row button {
    width: 100%;
    max-width: none;
  }
}
/* v94: gift followup is runtime-controlled, remote payment is a real page, and calibration is wider. */
#giftFollowup[hidden] {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.gift-followup {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.remote-gift-page .remote-gift-panel {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: none;
}

.remote-gift-page .remote-gift-options,
.remote-gift-page .remote-gift-details {
  position: absolute;
  pointer-events: auto;
}

.remote-gift-page .remote-gift-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8cqw;
}

.remote-gift-page .remote-gift-options button {
  min-width: 0;
  min-height: 100%;
  overflow: hidden;
  color: transparent !important;
  text-indent: -999px;
  border-radius: inherit;
}

.remote-gift-page .remote-gift-details:empty {
  display: none;
}

.calibration-panel {
  width: min(560px, calc(100vw - 32px)) !important;
  font-size: 12px !important;
}

.calibration-row {
  grid-template-columns: minmax(260px, 1fr) 78px !important;
  gap: 10px !important;
}

.calibration-panel input[type="number"] {
  width: 78px !important;
}

.poem-page-arrow {
  z-index: 75 !important;
  pointer-events: auto !important;
  min-width: 34px;
  min-height: 34px;
}
/* v97: separate remote payment frames for independent calibration. */
.remote-gift-page .remote-gift-options {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  pointer-events: none !important;
}

.remote-gift-page .remote-gift-option {
  position: absolute;
  display: block;
  pointer-events: auto;
  border: var(--overlay-border-width, 1px) solid rgba(229, 187, 104, 0.58);
  background: rgba(216, 159, 65, 0.1);
  box-shadow: inset 0 0 22px rgba(255, 220, 146, 0.055), 0 0 16px rgba(0, 0, 0, 0.12);
}

.remote-gift-page .remote-gift-option:hover,
.remote-gift-page .remote-gift-option:focus-visible,
.remote-gift-page .remote-gift-option.active {
  border-color: rgba(255, 228, 160, 0.86);
  background: rgba(229, 187, 104, 0.2);
  box-shadow: inset 0 0 28px rgba(255, 226, 154, 0.12), 0 0 24px rgba(229, 187, 104, 0.3);
}
/* v98: avion DC-3 animé sur la page d'accueil. */
.depart-plane-scene {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  overflow: visible;
  transform-origin: 50% 50%;
  contain: layout paint;
}

.app-shell.calibrating .depart-plane-scene {
  pointer-events: auto;
}

.depart-plane-float {
  position: relative;
  width: 100%;
  height: 100%;
  transform-origin: 52% 52%;
  animation: home-plane-float 6.4s ease-in-out infinite;
  will-change: transform;
}

.depart-plane-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  filter:
    drop-shadow(0 0.7cqw 0.8cqw rgba(0, 0, 0, 0.36))
    drop-shadow(0 0 0.55cqw rgba(255, 214, 112, 0.22));
  will-change: transform;
}

.depart-plane-float::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(
    var(--home-plane-shine-rotation, 105deg),
    transparent 34%,
    rgba(255, 255, 220, 0) 43%,
    rgba(255, 247, 194, var(--home-plane-shine-core-alpha, 0.58)) 50%,
    rgba(255, 220, 105, var(--home-plane-shine-gold-alpha, 0.16)) 55%,
    transparent 64%
  );
  background-repeat: no-repeat;
  background-size: var(--home-plane-shine-width, 76%) var(--home-plane-shine-height, 100%);
  background-position: var(--home-plane-shine-start-x, -70%) var(--home-plane-shine-start-y, 50%);
  -webkit-mask-image: var(--home-plane-mask, url("../assets/icons/avion-dc-home.png"));
  mask-image: var(--home-plane-mask, url("../assets/icons/avion-dc-home.png"));
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  mix-blend-mode: screen;
  opacity: 0;
  transform: none;
  animation: home-plane-shine var(--home-plane-shine-duration, 10.5s) ease-in-out infinite;
  will-change: background-position, opacity;
}

.depart-plane-engine {
  position: absolute;
  width: 9.4%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  mix-blend-mode: screen;
  animation: home-engine-vibe 0.13s steps(2, end) infinite;
  will-change: transform;
}

.depart-plane-engine-left {
  left: 72.8%;
  top: 54.2%;
}

.depart-plane-engine-right {
  left: 86.1%;
  top: 53.5%;
  width: 8.4%;
}

.depart-plane-engine::before,
.depart-plane-engine::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}

.depart-plane-engine::before {
  background:
    radial-gradient(circle, rgba(255, 240, 172, 0.38) 0 8%, rgba(255, 205, 85, 0.22) 18%, rgba(255, 218, 125, 0.12) 42%, transparent 70%),
    conic-gradient(from 0deg, rgba(255, 238, 174, 0.04), rgba(255, 238, 174, 0.46) 10deg, transparent 26deg, transparent 118deg, rgba(255, 230, 160, 0.34) 132deg, transparent 154deg, transparent 236deg, rgba(255, 225, 145, 0.28) 250deg, transparent 270deg);
  filter: blur(0.08em);
  opacity: 0.72;
  animation: home-prop-spin 0.08s linear infinite, home-prop-strobe 0.24s steps(3, end) infinite;
}

.depart-plane-engine::after {
  inset: 8%;
  border: 1px solid rgba(255, 232, 170, 0.2);
  background: radial-gradient(circle, transparent 0 28%, rgba(255, 232, 170, 0.14) 32%, transparent 58%);
  filter: blur(0.12em);
  opacity: 0.5;
  animation: home-prop-spin 0.08s linear infinite reverse;
}

.depart-plane-wing-halo {
  position: absolute;
  width: 24%;
  height: 10%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255, 200, 86, 0.22), transparent 70%);
  filter: blur(0.45em);
  mix-blend-mode: screen;
  opacity: 0.3;
  pointer-events: none;
  transform-origin: 50% 50%;
  animation: home-wing-halo 5.6s ease-in-out infinite;
}

.depart-plane-wing-halo-left {
  left: 18%;
  top: 57%;
  transform: rotate(-5deg);
}

.depart-plane-wing-halo-right {
  left: 63%;
  top: 51%;
  transform: rotate(-4deg);
  animation-delay: -2.4s;
}

@keyframes home-plane-float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.22deg); }
  25% { transform: translate3d(0, -5px, 0) rotate(0.34deg); }
  50% { transform: translate3d(0, 2px, 0) rotate(0.18deg); }
  75% { transform: translate3d(0, 5px, 0) rotate(-0.42deg); }
}

@keyframes home-prop-spin {
  to { transform: rotate(360deg); }
}

@keyframes home-prop-strobe {
  0% { opacity: 0.56; }
  50% { opacity: 0.82; }
  100% { opacity: 0.62; }
}

@keyframes home-engine-vibe {
  0%, 100% { transform: translate(-50%, -50%) translate3d(-0.35px, 0.25px, 0); }
  50% { transform: translate(-50%, -50%) translate3d(0.35px, -0.25px, 0); }
}

.depart-plane-scene:not(.has-home-plane-shine) .depart-plane-float::before {
  display: none;
}

@keyframes home-plane-shine {
  0%, 16% {
    background-position: var(--home-plane-shine-start-x, -70%) var(--home-plane-shine-start-y, 50%);
    opacity: 0;
  }
  30%, 48% {
    opacity: var(--home-plane-shine-opacity, 0.66);
  }
  58% {
    background-position: var(--home-plane-shine-end-x, 62%) var(--home-plane-shine-end-y, 50%);
    opacity: var(--home-plane-shine-opacity, 0.66);
  }
  100% {
    background-position: var(--home-plane-shine-end-x, 62%) var(--home-plane-shine-end-y, 50%);
    opacity: 0;
  }
}

@keyframes home-wing-halo {
  0%, 100% { opacity: 0.24; scale: 0.96; }
  50% { opacity: 0.46; scale: 1.04; }
}

@media (prefers-reduced-motion: reduce) {
  .depart-plane-float,
  .depart-plane-float::before,
  .depart-plane-engine,
  .depart-plane-engine::before,
  .depart-plane-engine::after,
  .depart-plane-wing-halo {
    animation: none;
  }
}
/* v99: panneau de calibrage plus compact, sans rappel de valeur redondant. */
.calibration-panel {
  width: min(420px, calc(100vw - 24px)) !important;
  padding: 10px !important;
  font-size: 11px !important;
}

.calibration-panel label {
  margin: 7px 0 !important;
}

.calibration-panel output {
  display: none !important;
}

.calibration-row {
  grid-template-columns: minmax(0, 1fr) 64px !important;
  gap: 7px !important;
}

.calibration-panel input[type="number"] {
  width: 64px !important;
  min-height: 30px !important;
  padding: 0 6px !important;
}

.calibration-panel input[type="range"] {
  min-width: 0 !important;
}

.calibration-panel select {
  min-height: 30px !important;
}

.calibration-panel .calibration-border-toggle {
  padding: 7px !important;
}
/* v100: positions réglables des hélices de l'avion d'accueil. */
.depart-plane-engine-left {
  left: var(--home-prop-left-x, 72.8%);
  top: var(--home-prop-left-y, 54.2%);
  width: var(--home-prop-left-size, 9.4%);
}

.depart-plane-engine-right {
  left: var(--home-prop-right-x, 86.1%);
  top: var(--home-prop-right-y, 53.5%);
  width: var(--home-prop-right-size, 8.4%);
}

.home-plane-propeller-settings {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(21, 94, 84, 0.18);
}

.home-plane-propeller-settings-panel > p {
  margin: 0 0 12px;
  color: #546763;
}

.home-plane-propeller-fields {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 900px) {
  .home-plane-propeller-fields {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .home-plane-propeller-fields {
    grid-template-columns: 1fr;
  }
}
/* v101: animations d'ambiance sur l'accueil, boussole et tasse. */
.depart-compass-effect,
.depart-cup-effect {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  overflow: visible;
  transform-origin: 50% 50%;
  contain: layout paint;
}

.app-shell.calibrating .depart-compass-effect,
.app-shell.calibrating .depart-cup-effect {
  pointer-events: auto;
}

.depart-compass-effect::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 7%;
  height: 78%;
  border-radius: 999px;
  transform: translate(-50%, -50%) rotate(-18deg);
  transform-origin: 50% 50%;
  background:
    linear-gradient(to bottom, rgba(255, 236, 157, 0.96) 0 48%, rgba(110, 34, 20, 0.92) 50% 100%);
  box-shadow:
    0 0 0.45em rgba(255, 205, 86, 0.55),
    0 0 1.1em rgba(255, 188, 62, 0.24);
  opacity: 0.88;
  animation: home-compass-needle-madness 12.5s cubic-bezier(0.38, 0, 0.2, 1) infinite;
  will-change: transform;
}

.depart-compass-effect::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, #fff7c9 0 18%, #d59a28 38%, rgba(63, 28, 7, 0.78) 64%, transparent 70%);
  box-shadow: 0 0 0.7em rgba(255, 209, 85, 0.35);
  opacity: 0.9;
}

.depart-cup-effect::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 49%;
  width: 78%;
  height: 36%;
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-7deg);
  background:
    radial-gradient(ellipse at 35% 32%, rgba(255, 239, 181, 0.42), transparent 28%),
    radial-gradient(ellipse at 65% 66%, rgba(255, 196, 80, 0.18), transparent 32%),
    linear-gradient(92deg, rgba(83, 43, 16, 0.28), rgba(231, 165, 70, 0.32), rgba(52, 24, 9, 0.22));
  filter: blur(0.03em);
  mix-blend-mode: screen;
  opacity: 0.58;
  animation: home-cup-liquid-sway 5.8s ease-in-out infinite;
  will-change: background-position, opacity;
}

.depart-cup-effect::after {
  content: "";
  position: absolute;
  left: 17%;
  top: 34%;
  width: 64%;
  height: 22%;
  border-radius: 50%;
  background: linear-gradient(105deg, transparent 0 18%, rgba(255, 244, 190, 0.72) 43%, transparent 68%);
  filter: blur(0.12em);
  mix-blend-mode: screen;
  opacity: 0;
  transform: translateX(-18%) rotate(-7deg);
  animation: home-cup-reflection 8.4s ease-in-out infinite;
  will-change: background-position, opacity;
}

@keyframes home-compass-needle-madness {
  0%, 62% { transform: translate(-50%, -50%) rotate(-18deg); }
  66% { transform: translate(-50%, -50%) rotate(34deg); }
  68% { transform: translate(-50%, -50%) rotate(-120deg); }
  70% { transform: translate(-50%, -50%) rotate(214deg); }
  72% { transform: translate(-50%, -50%) rotate(-46deg); }
  74% { transform: translate(-50%, -50%) rotate(88deg); }
  77% { transform: translate(-50%, -50%) rotate(-24deg); }
  80%, 100% { transform: translate(-50%, -50%) rotate(-18deg); }
}

@keyframes home-cup-liquid-sway {
  0%, 100% { transform: translate(-50%, -50%) rotate(-8deg) scaleX(1); opacity: 0.48; }
  32% { transform: translate(-51%, -48%) rotate(-4deg) scaleX(1.04); opacity: 0.64; }
  66% { transform: translate(-49%, -51%) rotate(-10deg) scaleX(0.98); opacity: 0.54; }
}

@keyframes home-cup-reflection {
  0%, 18% { opacity: 0; transform: translateX(-28%) rotate(-7deg); }
  34% { opacity: 0.62; }
  55% { opacity: 0.2; transform: translateX(34%) rotate(-7deg); }
  100% { opacity: 0; transform: translateX(34%) rotate(-7deg); }
}

@media (prefers-reduced-motion: reduce) {
  .depart-compass-effect::before,
  .depart-cup-effect::before,
  .depart-cup-effect::after {
    animation: none;
  }
}
/* v102: lueur circulaire réglable sur le tampon de l'accueil. */
.depart-stamp-glow-effect {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  overflow: visible;
  transform-origin: 50% 50%;
  contain: layout paint;
  --home-stamp-glow-intensity: 0.58;
}

.app-shell.calibrating .depart-stamp-glow-effect {
  pointer-events: auto;
}

.depart-stamp-glow-effect::before {
  content: "";
  position: absolute;
  inset: 3%;
  border-radius: 50%;
  background:
    conic-gradient(from 0deg,
      transparent 0deg,
      rgba(255, 206, 88, 0.08) 42deg,
      rgba(255, 236, 162, 0.86) 72deg,
      rgba(255, 176, 74, 0.34) 102deg,
      transparent 136deg,
      transparent 360deg),
    radial-gradient(circle, transparent 0 56%, rgba(255, 207, 94, 0.24) 62%, transparent 76%);
  filter: blur(0.035em) drop-shadow(0 0 0.7em rgba(255, 190, 74, 0.48));
  mix-blend-mode: screen;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.78);
  animation: home-stamp-glow-orbit 6.8s linear infinite;
  will-change: background-position, opacity;
}

.depart-stamp-glow-effect::after {
  content: "";
  position: absolute;
  inset: 18%;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 28%, rgba(255, 246, 190, 0.5), transparent 18%, rgba(255, 172, 64, 0.13) 42%, transparent 70%);
  filter: blur(0.08em);
  mix-blend-mode: screen;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.42);
  animation: home-stamp-glow-pulse 4.6s ease-in-out infinite;
}

.home-ambient-effect-settings {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(21, 94, 84, 0.18);
}

.home-ambient-effect-settings-panel h4 {
  margin: 0 0 10px;
  color: #143f38;
  font-size: 15px;
}

.home-ambient-effect-fields {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@keyframes home-stamp-glow-orbit {
  to { transform: rotate(360deg); }
}

@keyframes home-stamp-glow-pulse {
  0%, 100% { transform: scale(0.96); opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.28); }
  50% { transform: scale(1.04); opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.52); }
}

@media (max-width: 640px) {
  .home-ambient-effect-fields {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .depart-stamp-glow-effect::before,
  .depart-stamp-glow-effect::after {
    animation: none;
  }
}
/* v103: cadres de paiement réellement pilotables par le calibrage. */
.remote-gift-page .remote-gift-options {
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  gap: 0 !important;
  pointer-events: none !important;
}

.remote-gift-page .remote-gift-option {
  position: absolute !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-indent: -999px;
  overflow: hidden;
  pointer-events: auto !important;
}

.remote-gift-page .remote-gift-details {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
}
/* v104: lueur du tampon en couronne donut tournante. */
.depart-stamp-glow-effect::before {
  inset: 5% !important;
  border-radius: 50% !important;
  background:
    conic-gradient(from 0deg,
      rgba(255, 223, 128, 0) 0deg,
      rgba(255, 223, 128, 0.16) 34deg,
      rgba(255, 245, 181, 0.9) 58deg,
      rgba(255, 183, 72, 0.46) 82deg,
      rgba(255, 223, 128, 0.08) 116deg,
      transparent 150deg,
      transparent 360deg) !important;
  -webkit-mask-image: radial-gradient(circle, transparent 0 55%, #000 58% 74%, transparent 78%) !important;
  mask-image: radial-gradient(circle, transparent 0 55%, #000 58% 74%, transparent 78%) !important;
  filter: blur(0.025em) drop-shadow(0 0 0.8em rgba(255, 198, 78, 0.58)) !important;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.95) !important;
  animation: home-stamp-donut-spin 4.8s linear infinite !important;
}

.depart-stamp-glow-effect::after {
  inset: 9% !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle, transparent 0 59%, rgba(255, 219, 118, 0.34) 62%, transparent 72%),
    conic-gradient(from 160deg, transparent 0 210deg, rgba(255, 246, 194, 0.36) 246deg, transparent 286deg) !important;
  -webkit-mask-image: radial-gradient(circle, transparent 0 58%, #000 61% 70%, transparent 75%) !important;
  mask-image: radial-gradient(circle, transparent 0 58%, #000 61% 70%, transparent 75%) !important;
  filter: blur(0.09em) !important;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.42) !important;
  animation: home-stamp-donut-spin 7.2s linear infinite reverse !important;
}

@keyframes home-stamp-donut-spin {
  to { transform: rotate(360deg); }
}
/* v105: texte noir pour les détails de paiement sur la page participation en ligne. */
.remote-gift-page .remote-gift-details,
.remote-gift-page .remote-gift-details strong,
.remote-gift-page .remote-gift-details p,
.remote-gift-page .remote-gift-details a,
.remote-gift-page .remote-gift-details small {
  color: #111 !important;
  text-shadow: none !important;
}
/* Memory card calibration fields v107. */
.experience-viewer.is-memory-card .experience-viewer-copy {
  display: block;
  place-items: initial;
}

.experience-viewer.is-memory-card .memory-card-period,
.experience-viewer.is-memory-card .memory-card-title,
.experience-viewer.is-memory-card .memory-card-main-text,
.experience-viewer.is-memory-card .memory-card-shared-by {
  position: absolute;
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  overflow: visible;
  font-size: var(--overlay-font-size, inherit);
}

.experience-viewer.is-memory-card .memory-card-main-text {
  line-height: 1.14;
}

.experience-viewer.is-memory-card .memory-card-period:empty,
.experience-viewer.is-memory-card .memory-card-title:empty,
.experience-viewer.is-memory-card .memory-card-shared-by:empty {
  display: none;
}

.app-shell.calibrating .experience-viewer.is-memory-card .memory-card-period:empty,
.app-shell.calibrating .experience-viewer.is-memory-card .memory-card-title:empty,
.app-shell.calibrating .experience-viewer.is-memory-card .memory-card-shared-by:empty {
  display: block;
  min-height: 1em;
}

.experience-viewer.is-memory-card .memory-card-refresh[data-overlay-key] {
  right: auto !important;
  bottom: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  padding: 0.2em 0.55em;
  font-size: var(--overlay-font-size, clamp(12px, 1.1cqw, 17px));
}
/* Memory card controls and opening animation v111. */
.experience-viewer.is-memory-card.memory-card-opening[open] {
  transform-origin: 50% 54%;
  animation: memory-card-open-settle 840ms cubic-bezier(0.16, 0.86, 0.18, 1) both;
  will-change: opacity, transform, filter;
}

@keyframes memory-card-open-settle {
  0% {
    opacity: 0;
    transform:
      perspective(1100px)
      translate3d(-2.2%, 5.5%, 0)
      rotateZ(calc(var(--overlay-rotation, 0deg) - 11deg))
      rotateX(7deg)
      rotateY(-13deg)
      scale(0.74);
    filter: blur(3px) brightness(0.82);
  }
  56% {
    opacity: 1;
    transform:
      perspective(1100px)
      translate3d(0.7%, -1.1%, 0)
      rotateZ(calc(var(--overlay-rotation, 0deg) + 1.8deg))
      rotateX(-1deg)
      rotateY(2deg)
      scale(1.025);
    filter: blur(0) brightness(1.06);
  }
  78% {
    transform:
      perspective(1100px)
      translate3d(-0.2%, 0.25%, 0)
      rotateZ(calc(var(--overlay-rotation, 0deg) - 0.55deg))
      rotateX(0deg)
      rotateY(0deg)
      scale(0.995);
    filter: none;
  }
  100% {
    opacity: 1;
    transform:
      perspective(1100px)
      translate3d(0, 0, 0)
      rotateZ(var(--overlay-rotation, 0deg))
      rotateX(0deg)
      rotateY(0deg)
      scale(1);
    filter: none;
  }
}

.experience-viewer.is-memory-card .memory-card-main-text {
  line-height: var(--memory-card-main-line-height, 1.14);
}

.experience-viewer.is-memory-card .memory-card-period[data-overlay-key],
.experience-viewer.is-memory-card .memory-card-title[data-overlay-key],
.experience-viewer.is-memory-card .memory-card-main-text[data-overlay-key],
.experience-viewer.is-memory-card .memory-card-shared-by[data-overlay-key],
.experience-viewer.is-memory-card .memory-card-refresh[data-overlay-key],
.experience-viewer.is-memory-card .experience-viewer-close[data-overlay-key] {
  line-height: var(--overlay-line-height, inherit);
}

.experience-viewer.is-memory-card .experience-viewer-close[data-overlay-key] {
  right: auto !important;
  bottom: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  padding: 0.1em 0.35em;
  font-size: var(--overlay-font-size, clamp(11px, 0.95cqw, 15px));
}

@media (prefers-reduced-motion: reduce) {
  .experience-viewer.is-memory-card.memory-card-opening[open] {
    animation: memory-card-open-soft 260ms ease-out both;
  }
  @keyframes memory-card-open-soft {
    from { opacity: 0; transform: rotateZ(var(--overlay-rotation, 0deg)) scale(0.97); }
    to { opacity: 1; transform: rotateZ(var(--overlay-rotation, 0deg)) scale(1); }
  }
}
/* Memory card border calibration v110. */
.voyages-memory-card {
  box-sizing: border-box;
  border-style: solid !important;
  border-width: var(--overlay-border-width, 1px) !important;
}

.voyages-memory-card.overlay-border-hidden {
  border-width: 0 !important;
  border-color: transparent !important;
}

.voyages-memory-card.overlay-border-hidden:not(.is-cue-active):not(:hover):not(:focus-visible) {
  box-shadow: none !important;
}

.voyages-memory-card.overlay-border-hidden.click-cue.is-cue-active,
.voyages-memory-card.overlay-border-hidden:hover,
.voyages-memory-card.overlay-border-hidden:focus-visible {
  border-width: 0 !important;
  border-color: transparent !important;
  box-shadow: 0 0 26px rgba(255, 195, 82, 0.44) !important;
}

.experience-viewer.is-memory-card[data-overlay-key] {
  box-sizing: border-box;
}

.experience-viewer.is-memory-card[data-overlay-key]:not(.overlay-border-hidden) {
  border-style: solid !important;
  border-width: var(--overlay-border-width, 1px) !important;
  border-color: rgba(126, 72, 25, 0.34) !important;
}

.experience-viewer.is-memory-card[data-overlay-key].overlay-border-hidden {
  border: 0 !important;
}

/* v115: zone locale d'assombrissement calibrable sur l'accueil. */
.depart-dark-zone {
  position: absolute;
  z-index: 3;
  display: block;
  box-sizing: border-box;
  border: var(--overlay-border-width, 0px) solid rgba(255, 228, 160, 0.28);
  background: rgba(0, 0, 0, 0.72);
  box-shadow: 0 0 4.2cqw rgba(0, 0, 0, 0.46);
  pointer-events: none;
}

.depart-dark-zone.overlay-border-hidden {
  border-color: transparent !important;
}

.depart-plane-scene {
  z-index: 4;
}
/* v116: réglages détaillés du tracé dynamique de l'accueil. */
.route-line-style-settings {
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
}

.route-line-style-settings fieldset {
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr));
  gap: 10px 12px;
  margin: 0;
  border: 1px solid rgba(24, 60, 53, 0.16);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.55);
}

.route-line-style-settings legend {
  padding: 0 6px;
  color: #173b37;
  font-weight: 900;
}

.route-line-style-settings input[type="number"] {
  min-height: 34px;
}

@media (max-width: 900px) {
  .route-line-style-settings fieldset {
    grid-template-columns: 1fr;
  }
}
/* v117: typographie réglable de la frise Grandes étapes du voyage. */
.journey-timeline {
  color: var(--timeline-color, #2c1a0c) !important;
  font-family: var(--timeline-font-family, Georgia, "Times New Roman", serif) !important;
  text-shadow: var(--timeline-shadow, none) !important;
}

.journey-timeline article {
  gap: var(--timeline-gap, 0.24em) !important;
  opacity: var(--timeline-inactive-opacity, 0.74) !important;
}

.journey-timeline .timeline-icon,
.journey-timeline strong,
.journey-timeline p {
  text-shadow: var(--timeline-shadow, none) !important;
  -webkit-text-stroke: var(--timeline-stroke-width, 0px) var(--timeline-stroke-color, transparent);
  paint-order: stroke fill;
}

.journey-timeline .timeline-icon {
  color: var(--timeline-icon-color, var(--timeline-color, #2c1a0c)) !important;
  font-family: var(--timeline-font-family, Georgia, "Times New Roman", serif) !important;
  font-size: var(--timeline-icon-size, 1.35em) !important;
  font-weight: var(--timeline-font-weight, 700) !important;
  line-height: var(--timeline-line-height, 1.05) !important;
}

.journey-timeline strong {
  color: var(--timeline-date-color, var(--timeline-color, #2c1a0c)) !important;
  font-family: var(--timeline-font-family, Georgia, "Times New Roman", serif) !important;
  font-size: var(--timeline-date-size, 1.08em) !important;
  font-weight: var(--timeline-font-weight, 700) !important;
  line-height: var(--timeline-line-height, 1.05) !important;
}

.journey-timeline p {
  color: var(--timeline-text-color, var(--timeline-color, #2c1a0c)) !important;
  font-family: var(--timeline-text-font-family, Arial, Helvetica, sans-serif) !important;
  font-size: var(--timeline-text-size, 0.82em) !important;
  font-weight: var(--timeline-text-weight, 500) !important;
  line-height: var(--timeline-text-line-height, 1.2) !important;
}

.journey-timeline article.is-timeline-active {
  color: var(--timeline-active-color, #f8f0c7) !important;
  opacity: var(--timeline-active-opacity, 1) !important;
  transform: translateY(var(--timeline-active-lift, -0.22em)) scale(var(--timeline-active-scale, 1.08)) !important;
}

.journey-timeline article.is-timeline-active .timeline-icon,
.journey-timeline article.is-timeline-active strong,
.journey-timeline article.is-timeline-active p {
  text-shadow: var(--timeline-active-shadow, none) !important;
  -webkit-text-stroke: var(--timeline-active-stroke-width, 0px) var(--timeline-active-stroke-color, transparent);
}

.journey-timeline article.is-timeline-active .timeline-icon {
  color: var(--timeline-active-icon-color, var(--timeline-active-color, #f8f0c7)) !important;
  transform: scale(var(--timeline-active-icon-scale, 1.18)) !important;
}

.journey-timeline article.is-timeline-active strong {
  color: var(--timeline-active-date-color, var(--timeline-active-color, #f8f0c7)) !important;
  transform: scale(var(--timeline-active-text-scale, 1.12)) !important;
}

.journey-timeline article.is-timeline-active p {
  color: var(--timeline-active-text-color, var(--timeline-active-color, #f8f0c7)) !important;
  transform: scale(var(--timeline-active-text-scale, 1.12)) !important;
}

.timeline-style-settings {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: 8px;
  padding: 12px;
  border: 1px solid rgba(24, 60, 53, 0.14);
  border-radius: 10px;
  background: rgba(246, 249, 248, 0.78);
}

.timeline-style-title {
  display: grid;
  gap: 3px;
  color: #173b37;
}

.timeline-style-title strong {
  font-size: 1rem;
}

.timeline-style-title span {
  color: #5a6d69;
  font-size: 0.9rem;
}

.timeline-style-settings fieldset {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(24, 60, 53, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.64);
}

.timeline-style-settings legend {
  padding: 0 6px;
  color: #173b37;
  font-weight: 900;
}

.timeline-style-settings label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #203d38;
  font-size: 0.86rem;
  font-weight: 760;
}

.timeline-style-settings input,
.timeline-style-settings select {
  width: 100%;
  min-width: 0;
  min-height: 34px;
}

.timeline-style-settings input[type="color"] {
  min-height: 38px;
  padding: 3px;
}

@media (max-width: 1180px) {
  .timeline-style-settings fieldset {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
}

@media (max-width: 760px) {
  .timeline-style-settings fieldset {
    grid-template-columns: 1fr;
  }
}
/* v118: memory card border uses calibration on hover and cue. */
.voyages-memory-card:not(.overlay-border-hidden) {
  border-width: var(--overlay-border-width, 1px) !important;
}

.voyages-memory-card:not(.overlay-border-hidden):hover,
.voyages-memory-card:not(.overlay-border-hidden):focus-visible {
  border-width: var(--overlay-border-width, 1px) !important;
  border-color: rgba(255, 225, 145, 0.9) !important;
  box-shadow:
    inset 0 0 36px rgba(255, 226, 154, 0.1),
    0 0 0 var(--overlay-border-width, 1px) rgba(255, 235, 174, 0.42),
    0 0 28px rgba(255, 188, 74, 0.46) !important;
}

.voyages-memory-card:not(.overlay-border-hidden).click-cue.is-cue-active {
  border-width: var(--overlay-border-width, 1px) !important;
  border-color: rgba(255, 225, 145, 0.9) !important;
  box-shadow:
    inset 0 0 36px rgba(255, 226, 154, 0.1),
    0 0 0 var(--cue-border-width, var(--overlay-border-width, 1px)) rgba(255, 235, 174, 0.42),
    0 0 28px rgba(255, 188, 74, 0.46) !important;
}

.voyages-memory-card.overlay-border-hidden:hover,
.voyages-memory-card.overlay-border-hidden:focus-visible,
.voyages-memory-card.overlay-border-hidden.click-cue.is-cue-active {
  border-width: 0 !important;
  border-color: transparent !important;
}
/* v120: uniform darkening layer on the home page. */
.depart-dark-zone {
  background: #000 !important;
  box-shadow: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  border-color: rgba(0, 0, 0, 0.2) !important;
}

.depart-dark-zone::before,
.depart-dark-zone::after {
  display: none !important;
  content: none !important;
}

.depart-dark-zone.overlay-border-hidden {
  border-color: transparent !important;
}
/* v121: make poem paging controls reliably visible above the poem page. */
#mariage-poeme .poem-page-arrow {
  z-index: 240 !important;
  display: grid;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center;
  justify-items: center;
  color: rgba(var(--poem-arrow-color-rgb, 91, 50, 31), var(--poem-arrow-text-opacity, 0.94)) !important;
  background: rgba(var(--poem-arrow-bg-rgb, 255, 240, 200), var(--poem-arrow-bg-opacity, 0.18)) !important;
  border-color: rgba(var(--poem-arrow-border-rgb, 92, 46, 25), var(--poem-arrow-border-opacity, 0.22)) !important;
  box-shadow:
    0 0 0 1px rgba(255, 244, 210, 0.18),
    0 0 22px rgba(92, 46, 25, 0.16),
    0 0 28px rgba(255, 205, 118, var(--poem-arrow-glow-opacity, 0.28)) !important;
  text-shadow: 0 1px 1px rgba(255, 247, 220, 0.5) !important;
}

#mariage-poeme .poem-page-arrow.poem-arrow-config-hidden {
  display: none !important;
}

.app-shell.calibrating #mariage-poeme .poem-page-arrow.poem-arrow-config-hidden {
  display: grid !important;
  opacity: 0.38 !important;
}
/* v122: effet boussole reutilisable et parametrable. */
.compass-needle-effect,
.depart-compass-effect {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  overflow: visible;
  transform-origin: 50% 50%;
  contain: layout paint;
}

.app-shell.calibrating .compass-needle-effect,
.app-shell.calibrating .depart-compass-effect {
  pointer-events: auto;
}

.compass-needle-effect::before,
.depart-compass-effect::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--compass-needle-width, 7%);
  height: 78%;
  border-radius: var(--compass-needle-tip-radius, 999px);
  transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(var(--compass-idle-angle, -18deg));
  transform-origin: 50% 50%;
  background: linear-gradient(to bottom, var(--compass-needle-north, #ffec9d) 0 48%, var(--compass-needle-south, #6e2214) 50% 100%);
  box-shadow:
    0 0 0.45em rgba(255, 205, 86, 0.55),
    0 0 1.1em rgba(255, 188, 62, 0.24);
  opacity: var(--compass-needle-opacity, 0.88);
  animation: compass-needle-madness 12.5s cubic-bezier(0.38, 0, 0.2, 1) infinite;
  will-change: transform;
}

.compass-needle-effect::after,
.depart-compass-effect::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, #fff7c9 0 18%, #d59a28 38%, rgba(63, 28, 7, 0.78) 64%, transparent 70%);
  box-shadow: 0 0 0.7em rgba(255, 209, 85, 0.35);
  opacity: 0.9;
}

@keyframes compass-needle-madness {
  0%, 62% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(var(--compass-idle-angle, -18deg)); }
  66% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 52deg)); }
  68% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 102deg)); }
  70% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 232deg)); }
  72% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 28deg)); }
  74% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 12deg)); }
  76% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 8deg)); }
  79% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 4deg)); }
  83%, 100% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(var(--compass-idle-angle, -18deg)); }
}

.compass-needle-settings-panel { display: grid; gap: 0.75rem; }
.compass-needle-fields { align-items: end; }

@media (prefers-reduced-motion: reduce) {
  .compass-needle-effect::before,
  .depart-compass-effect::before {
    animation: none;
  }
}
/* v123: attente animee des lecteurs mariage. */
.marriage-video-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at 22% 28%, rgba(255, 238, 169, 0.26), transparent 18%),
    radial-gradient(circle at 78% 72%, rgba(222, 155, 52, 0.18), transparent 20%),
    linear-gradient(104deg, transparent 0 18%, rgba(255, 225, 143, 0.18) 38%, transparent 58% 100%),
    repeating-linear-gradient(0deg, rgba(255, 226, 150, 0.05) 0 1px, transparent 1px 4px);
  mix-blend-mode: screen;
  filter: blur(0.25px);
}

.marriage-video-player.is-awaiting-video.has-idle-flicker .marriage-video-frame::before {
  opacity: var(--video-idle-flicker-opacity, 0.36);
  animation: marriage-video-idle-flicker var(--video-idle-flicker-duration, 6.5s) ease-in-out infinite;
}

.marriage-video-overlay-play {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: clamp(70px, 15%, 132px);
  aspect-ratio: 1;
  border: 0 !important;
  border-radius: 50%;
  padding: 0;
  background: transparent !important;
  color: #fff;
  box-shadow: none !important;
  font-size: clamp(34px, 5vw, 72px);
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0.98);
  transition: opacity 240ms ease, transform 240ms ease;
}

.marriage-video-overlay-play span {
  display: block;
  transform: translateX(0.08em);
  text-shadow: 0 0 0.45em rgba(255, 255, 255, 0.72), 0 0 1.1em rgba(255, 221, 151, 0.35);
}

.marriage-video-player.is-awaiting-video .marriage-video-overlay-play {
  opacity: 1;
  pointer-events: auto;
}

.marriage-video-player.is-awaiting-video.has-play-pulse .marriage-video-overlay-play {
  animation: marriage-video-play-pulse var(--video-play-pulse-duration, 5.5s) ease-in-out infinite;
}

.marriage-video-player.has-video-started .marriage-video-overlay-play {
  opacity: 0;
  pointer-events: none;
}

@keyframes marriage-video-idle-flicker {
  0%, 100% { transform: translate3d(-1%, 0, 0); filter: blur(0.25px) brightness(0.62); }
  18% { transform: translate3d(0.5%, -0.4%, 0); filter: blur(0.2px) brightness(1.12); }
  43% { transform: translate3d(1.2%, 0.6%, 0); filter: blur(0.32px) brightness(0.74); }
  64% { transform: translate3d(-0.3%, 0.2%, 0); filter: blur(0.18px) brightness(1.26); }
  81% { transform: translate3d(0.8%, -0.2%, 0); filter: blur(0.28px) brightness(0.9); }
}

@keyframes marriage-video-play-pulse {
  0%, 100% { opacity: var(--video-play-pulse-min-opacity, 0.36); transform: translate(-50%, -50%) scale(0.96); }
  48%, 58% { opacity: 1; transform: translate(-50%, -50%) scale(1.035); }
}

@media (prefers-reduced-motion: reduce) {
  .marriage-video-player.is-awaiting-video.has-idle-flicker .marriage-video-frame::before,
  .marriage-video-player.is-awaiting-video.has-play-pulse .marriage-video-overlay-play {
    animation: none;
  }
}
/* Object glints v124: subtle reflections for lenses, cameras, watches and rings. */
.practical-light.lens-light,
.practical-light.camera-glow,
.practical-light.watch-glow,
.practical-light.ring-light {
  border-radius: 999px;
  mix-blend-mode: screen;
}

.lens-light::before,
.camera-glow::before,
.watch-glow::before {
  width: 72%;
  height: 72%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 36% 30%, rgba(255, 255, 236, 0.92) 0 5%, rgba(255, 226, 145, 0.76) 9%, rgba(236, 164, 56, 0.22) 28%, transparent 58%),
    radial-gradient(circle at 52% 52%, transparent 0 42%, rgba(255, 218, 136, 0.2) 44%, transparent 62%);
  animation: object-glint-core-v124 4.4s infinite ease-in-out;
}

.lens-light::after,
.camera-glow::after,
.watch-glow::after {
  width: 170%;
  height: 170%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 232, 168, 0.34) 0 14%, rgba(255, 189, 74, 0.13) 34%, rgba(255, 189, 74, 0.035) 57%, transparent 74%);
  animation: object-glint-halo-v124 5.8s infinite ease-in-out;
}

.camera-glow::before {
  width: 86%;
  height: 86%;
  background:
    radial-gradient(circle at 40% 34%, rgba(255, 255, 240, 0.88) 0 4%, rgba(255, 218, 132, 0.7) 9%, rgba(228, 142, 44, 0.2) 30%, transparent 58%),
    conic-gradient(from 18deg, transparent 0 17%, rgba(255, 230, 170, 0.2) 20% 24%, transparent 30% 100%);
}

.watch-glow::before {
  width: 84%;
  height: 64%;
  background:
    radial-gradient(ellipse at 42% 36%, rgba(255, 252, 224, 0.82) 0 6%, rgba(255, 218, 140, 0.52) 15%, rgba(199, 121, 40, 0.16) 40%, transparent 68%);
  animation-duration: 6.2s;
}

.ring-light::before,
.ring-light::after {
  width: 54%;
  height: 48%;
  border: 0.12em solid rgba(255, 232, 158, 0.55);
  border-radius: 999px;
  background:
    radial-gradient(circle at 34% 25%, rgba(255, 255, 232, 0.88) 0 5%, rgba(255, 223, 145, 0.36) 14%, transparent 38%),
    radial-gradient(circle, rgba(255, 205, 106, 0.14), transparent 62%);
  animation: ring-glint-v124 4.8s infinite ease-in-out;
}

.ring-light::before {
  left: 39%;
  top: 52%;
  transform: translate(-50%, -50%) rotate(-14deg);
}

.ring-light::after {
  left: 61%;
  top: 49%;
  transform: translate(-50%, -50%) rotate(16deg);
  animation-delay: 0.9s;
}

@keyframes object-glint-core-v124 {
  0%, 100% { opacity: 0.26; transform: translate(-50%, -50%) scale(0.92); }
  33% { opacity: 0.68; transform: translate(-49%, -51%) scale(1.04); }
  52% { opacity: 0.4; transform: translate(-51%, -49%) scale(0.98); }
  72% { opacity: 0.82; transform: translate(-48%, -52%) scale(1.08); }
}

@keyframes object-glint-halo-v124 {
  0%, 100% { opacity: 0.12; transform: translate(-50%, -50%) scale(0.92); }
  45% { opacity: 0.4; transform: translate(-50%, -50%) scale(1.08); }
  70% { opacity: 0.22; transform: translate(-50%, -50%) scale(1); }
}

@keyframes ring-glint-v124 {
  0%, 100% { opacity: 0.18; filter: brightness(0.95); }
  38% { opacity: 0.72; filter: brightness(1.35); }
  62% { opacity: 0.36; filter: brightness(1.1); }
}
/* v125: hélices synchronisables sur l'avion de l'animation cadeau. */
.gift-plane {
  overflow: visible;
  isolation: isolate;
}

.gift-plane-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  border: 0;
  background: transparent;
  pointer-events: none;
  filter:
    drop-shadow(0 0.55cqw 0.6cqw rgba(0, 0, 0, 0.36))
    drop-shadow(0 0 0.45cqw rgba(255, 220, 136, 0.2));
}

.gift-preview-plane.gift-plane {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.gift-plane-engine {
  position: absolute;
  width: var(--gift-prop-left-size, 9.4%);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: var(--gift-prop-opacity, 0.82);
  z-index: 3;
  animation: gift-engine-vibe 0.13s steps(2, end) infinite;
  will-change: background-position, opacity;
}

.gift-plane-engine-left {
  left: var(--gift-prop-left-x, 72.8%);
  top: var(--gift-prop-left-y, 54.2%);
  width: var(--gift-prop-left-size, 9.4%);
}

.gift-plane-engine-right {
  left: var(--gift-prop-right-x, 86.1%);
  top: var(--gift-prop-right-y, 53.5%);
  width: var(--gift-prop-right-size, 8.4%);
}

.gift-plane-engine::before,
.gift-plane-engine::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}

.gift-plane-engine::before {
  background:
    radial-gradient(circle, rgba(255, 245, 184, 0.4) 0 8%, rgba(255, 205, 85, 0.24) 18%, rgba(255, 222, 136, 0.14) 42%, transparent 70%),
    conic-gradient(from 0deg, rgba(255, 238, 174, 0.04), rgba(255, 238, 174, 0.5) 10deg, transparent 26deg, transparent 118deg, rgba(255, 230, 160, 0.36) 132deg, transparent 154deg, transparent 236deg, rgba(255, 225, 145, 0.3) 250deg, transparent 270deg);
  filter: blur(0.08em);
  opacity: 0.72;
  animation: gift-prop-spin var(--gift-prop-spin-duration, 0.08s) linear infinite, gift-prop-strobe calc(var(--gift-prop-spin-duration, 0.08s) * 3) steps(3, end) infinite;
}

.gift-plane-engine::after {
  inset: 8%;
  border: 1px solid rgba(255, 232, 170, 0.22);
  background: radial-gradient(circle, transparent 0 28%, rgba(255, 232, 170, 0.16) 32%, transparent 58%);
  filter: blur(0.12em);
  opacity: 0.5;
  animation: gift-prop-spin var(--gift-prop-spin-duration, 0.08s) linear infinite reverse;
}

@keyframes gift-prop-spin {
  to { transform: rotate(360deg); }
}

@keyframes gift-prop-strobe {
  0% { opacity: 0.54; }
  50% { opacity: 0.86; }
  100% { opacity: 0.62; }
}

@keyframes gift-engine-vibe {
  0%, 100% { transform: translate(-50%, -50%) translate3d(-0.35px, 0.25px, 0); }
  50% { transform: translate(-50%, -50%) translate3d(0.35px, -0.25px, 0); }
}

.gift-plane-propeller-settings {
  margin: 14px 0;
  border: 1px solid rgba(21, 94, 84, 0.18);
  border-radius: 10px;
  padding: 12px 14px;
  background: rgba(255, 252, 239, 0.55);
}

.gift-plane-propeller-settings > summary {
  cursor: pointer;
  font-weight: 800;
  color: #153f39;
}

.gift-plane-propeller-settings p {
  margin: 10px 0 12px;
  color: #5e6f6a;
}

.gift-plane-propeller-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}

.gift-plane-propeller-fields {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 980px) {
  .gift-plane-propeller-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .gift-plane-propeller-fields {
    grid-template-columns: 1fr;
  }
}
.page-audio-player {
  position: static;
  z-index: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: min(280px, 42vw);
  border: 1px solid rgba(233, 190, 92, 0.58);
  border-radius: 999px;
  padding: 7px 12px 7px 7px;
  background: rgba(7, 12, 15, 0.64);
  color: #fff3be;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.32), 0 0 18px rgba(220, 164, 54, 0.22);
  backdrop-filter: blur(8px);
  pointer-events: auto;
}

.page-audio-player[hidden] {
  display: none !important;
}

.page-audio-player button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 231, 158, 0.52);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 224, 130, 0.95), rgba(158, 94, 28, 0.78));
  color: #241306;
  font-weight: 900;
  line-height: 1;
}

.page-audio-player span {
  min-width: 0;
  overflow: hidden;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell[data-view="admin"] .public-utility-controls,
.app-shell[data-view="admin"] .page-audio-player {
  display: none !important;
}

.page-audio-settings {
  display: grid;
  gap: 18px;
}

.audio-master-settings {
  display: grid;
  gap: 12px;
  border: 1px solid #d8e0dd;
  border-radius: 10px;
  padding: 14px;
  background: rgba(244, 248, 246, 0.92);
}

.audio-volume-control {
  display: grid;
  grid-template-columns: minmax(110px, 0.8fr) minmax(160px, 1.8fr) minmax(70px, 0.45fr);
  gap: 10px;
  align-items: center;
  color: #263d38;
  font-weight: 700;
}

.audio-volume-control input[type="number"] {
  max-width: 82px;
}

.page-audio-settings h4 {
  margin: 4px 0 -4px;
  color: #173b37;
  font-size: 15px;
  letter-spacing: 0;
}

.page-audio-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 12px;
}

.page-audio-row {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  border: 1px solid #ccd8d5;
  border-left: 4px solid #2d756a;
  border-radius: 10px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.72);
}

.page-audio-row > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.page-audio-row strong,
.page-audio-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-audio-row span {
  color: #687873;
  font-size: 13px;
}

.page-audio-playlist {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-audio-playlist li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  border-radius: 7px;
  padding: 6px 8px;
  background: rgba(45, 117, 106, 0.08);
}

.page-audio-playlist li span {
  white-space: nowrap;
}

.page-audio-playlist button {
  min-height: 28px;
  padding: 4px 8px;
}

.audio-playlist-help {
  color: #5f726d;
  font-size: 12px;
}

.page-audio-row input[type="file"] {
  width: 100%;
  min-width: 0;
}

.compact-switch {
  margin: 0;
}

.sound-effect-row {
  border-left-color: #bd8d34;
}

.sound-effect-row .audio-volume-control {
  grid-template-columns: 72px minmax(120px, 1fr);
}

@media (max-width: 760px) {
  .public-utility-controls {
    right: 12px;
    bottom: 12px;
  }

  .page-audio-player {
    max-width: 54vw;
  }

  .audio-volume-control,
  .sound-effect-row .audio-volume-control {
    grid-template-columns: 1fr;
  }
}

.audio-status-card,
.audio-help-note {
  border: 1px solid rgba(45, 117, 106, 0.22);
  border-radius: 10px;
  padding: 12px 14px;
  background: rgba(241, 247, 244, 0.92);
  color: #28423d;
}

.audio-status-card {
  display: grid;
  gap: 8px;
}

.audio-status-card strong {
  color: #153f38;
}

.audio-status-card span,
.audio-help-note {
  font-size: 13px;
  line-height: 1.45;
}

.audio-status-card.is-warning {
  border-color: rgba(189, 141, 52, 0.48);
  background: rgba(255, 248, 224, 0.94);
}

.audio-status-card button,
.audio-master-settings button {
  justify-self: start;
}
/* v127: effet donut de tampon partagé, plus diffus et piloté par les réglages. */
.stamp-donut-glow {
  position: absolute;
  display: block;
  pointer-events: none;
  z-index: 4;
  opacity: var(--overlay-opacity, 1);
  transform: rotate(var(--overlay-rotation, 0deg));
  transform-origin: center;
  --home-stamp-glow-intensity: 0.58;
  --stamp-donut-speed: 7.5s;
  --stamp-donut-secondary-speed: 10.875s;
  --stamp-donut-softness: 3.2px;
}

.app-shell.calibrating .stamp-donut-glow {
  pointer-events: auto;
}

.stamp-donut-glow::before,
.stamp-donut-glow::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  transform-origin: center;
  mix-blend-mode: screen;
}

.stamp-donut-glow::before {
  inset: 0 !important;
  background:
    conic-gradient(from 0deg,
      rgba(255, 223, 128, 0) 0deg,
      rgba(255, 232, 150, 0.08) 26deg,
      rgba(255, 247, 198, 0.62) 58deg,
      rgba(255, 181, 70, 0.2) 92deg,
      rgba(255, 223, 128, 0.04) 132deg,
      transparent 176deg,
      transparent 224deg,
      rgba(255, 246, 190, 0.38) 258deg,
      rgba(255, 185, 82, 0.12) 294deg,
      transparent 334deg) !important;
  -webkit-mask-image: radial-gradient(circle,
    transparent 0 47%,
    rgba(0, 0, 0, 0.16) 53%,
    rgba(0, 0, 0, 0.9) 62%,
    rgba(0, 0, 0, 0.28) 72%,
    transparent 84%) !important;
  mask-image: radial-gradient(circle,
    transparent 0 47%,
    rgba(0, 0, 0, 0.16) 53%,
    rgba(0, 0, 0, 0.9) 62%,
    rgba(0, 0, 0, 0.28) 72%,
    transparent 84%) !important;
  filter: blur(var(--stamp-donut-softness, 3.2px)) drop-shadow(0 0 1em rgba(255, 209, 105, 0.36)) !important;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.78) !important;
  animation: home-stamp-donut-spin var(--stamp-donut-speed, 7.5s) linear infinite !important;
}

.stamp-donut-glow::after {
  inset: -16% !important;
  background:
    radial-gradient(circle,
      transparent 0 48%,
      rgba(255, 234, 154, 0.18) 60%,
      rgba(255, 181, 78, 0.07) 70%,
      transparent 84%) !important;
  -webkit-mask-image: radial-gradient(circle,
    transparent 0 46%,
    rgba(0, 0, 0, 0.2) 56%,
    rgba(0, 0, 0, 0.7) 66%,
    rgba(0, 0, 0, 0.14) 78%,
    transparent 90%) !important;
  mask-image: radial-gradient(circle,
    transparent 0 46%,
    rgba(0, 0, 0, 0.2) 56%,
    rgba(0, 0, 0, 0.7) 66%,
    rgba(0, 0, 0, 0.14) 78%,
    transparent 90%) !important;
  filter: blur(calc(var(--stamp-donut-softness, 3.2px) * 3.2)) !important;
  opacity: calc(var(--home-stamp-glow-intensity, 0.58) * 0.36) !important;
  animation: home-stamp-donut-spin var(--stamp-donut-secondary-speed, 10.875s) linear infinite reverse !important;
}

@media (prefers-reduced-motion: reduce) {
  .stamp-donut-glow::before,
  .stamp-donut-glow::after {
    animation: none !important;
  }
}
/* v128: média de carte souvenir avec cadre Polaroid tacheté. */
.experience-viewer.is-memory-card.has-card-media .experience-viewer-media {
  box-sizing: border-box;
  overflow: hidden;
  padding: clamp(8px, 0.85vw, 16px) clamp(8px, 0.85vw, 16px) clamp(18px, 2vw, 34px);
  border-radius: 5px;
  background:
    radial-gradient(circle at 8% 14%, rgba(95, 55, 22, 0.2) 0 1px, transparent 2.4px),
    radial-gradient(circle at 91% 18%, rgba(104, 72, 39, 0.16) 0 1.3px, transparent 2.9px),
    radial-gradient(circle at 15% 88%, rgba(124, 84, 43, 0.18) 0 1px, transparent 2.8px),
    radial-gradient(circle at 82% 86%, rgba(91, 58, 30, 0.13) 0 1.4px, transparent 3px),
    radial-gradient(circle at 51% 96%, rgba(137, 104, 63, 0.15) 0 1px, transparent 2.6px),
    linear-gradient(135deg, rgba(255, 252, 244, 0.98), rgba(247, 238, 219, 0.96) 62%, rgba(255, 250, 239, 0.98));
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    0 0.55em 1.2em rgba(52, 28, 8, 0.28),
    inset 0 0 0 1px rgba(118, 82, 39, 0.14),
    inset 0 -0.9em 1.3em rgba(155, 111, 56, 0.08);
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media::before,
.experience-viewer.is-memory-card.has-card-media .experience-viewer-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media::before {
  z-index: 2;
  background:
    radial-gradient(circle at 3% 33%, rgba(75, 43, 20, 0.16) 0 1.5px, transparent 3.2px),
    radial-gradient(circle at 97% 47%, rgba(78, 47, 23, 0.13) 0 1.2px, transparent 3px),
    radial-gradient(circle at 31% 4%, rgba(140, 101, 53, 0.16) 0 1px, transparent 2.8px),
    radial-gradient(circle at 72% 98%, rgba(126, 83, 39, 0.18) 0 1.4px, transparent 3px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.28), transparent 18% 82%, rgba(111, 73, 34, 0.06));
  mix-blend-mode: multiply;
  opacity: 0.82;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media::after {
  z-index: 3;
  box-shadow:
    inset 0 0 0 1px rgba(76, 48, 22, 0.18),
    inset 0 0 1.8em rgba(255, 255, 255, 0.3);
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.055) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(111, 76, 38, 0.035) 0 1px, transparent 1px 7px);
  opacity: 0.55;
}

.experience-viewer.is-memory-card.has-card-media .experience-viewer-media img,
.experience-viewer.is-memory-card.has-card-media .experience-viewer-media video,
.experience-viewer.is-memory-card.has-card-media .memory-card-media-calibration-placeholder {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 2px;
  box-shadow:
    0 0 0 1px rgba(76, 49, 23, 0.18),
    inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}
/* v129: bouton de fermeture de la carte souvenir en X visuel. */
.experience-viewer.is-memory-card .experience-viewer-close {
  display: grid;
  place-items: center;
  min-width: 32px;
  min-height: 32px;
  padding: 0;
  font-size: 0 !important;
  line-height: 1;
}

.experience-viewer.is-memory-card .experience-viewer-close::before {
  content: "X";
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(18px, 1.7vw, 30px);
  font-weight: 700;
  line-height: 1;
  color: currentColor;
  transform: translateY(-0.04em);
}
/* v130: la carte souvenir respecte l'épaisseur de contour calibrée au hover/scintillement. */
.screen:not(.hidden) .voyages-memory-card.click-cue:not(.overlay-border-hidden):hover,
.screen:not(.hidden) .voyages-memory-card.click-cue:not(.overlay-border-hidden):focus-visible,
.screen:not(.hidden) .voyages-memory-card.click-cue:not(.overlay-border-hidden).is-cue-active,
.app-shell.calibrating .voyages-memory-card:not(.overlay-border-hidden):hover,
.app-shell.calibrating .voyages-memory-card:not(.overlay-border-hidden):focus-visible {
  border-style: solid !important;
  border-width: var(--overlay-border-width, 1px) !important;
  border-color: rgba(255, 225, 145, 0.9) !important;
  box-shadow:
    inset 0 0 36px rgba(255, 226, 154, 0.1),
    0 0 0 var(--overlay-border-width, 1px) rgba(255, 235, 174, 0.42),
    0 0 28px rgba(255, 188, 74, 0.46) !important;
}

.screen:not(.hidden) .voyages-memory-card.overlay-border-hidden.click-cue:hover,
.screen:not(.hidden) .voyages-memory-card.overlay-border-hidden.click-cue:focus-visible,
.screen:not(.hidden) .voyages-memory-card.overlay-border-hidden.click-cue.is-cue-active,
.app-shell.calibrating .voyages-memory-card.overlay-border-hidden:hover,
.app-shell.calibrating .voyages-memory-card.overlay-border-hidden:focus-visible {
  border-width: 0 !important;
  border-color: transparent !important;
}
/* v131: tracé d'itinéraire en une seule animation continue et couleurs appliquées au SVG. */
.depart-route-lines {
  --route-line-draw-length: 1000;
}


/* v132: onglet Aide integre aux reglages. */
.help-card {
  align-self: start;
}

.help-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 14px;
}

.help-card-actions a,
.help-card-actions button {
  display: inline-grid;
  min-height: 38px;
  place-items: center;
  border: 1px solid rgba(24, 60, 53, 0.26);
  border-radius: 7px;
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.68);
  color: #173b37;
  font-weight: 850;
  text-decoration: none;
}

.admin-help-content {
  max-height: min(68vh, 760px);
  overflow: auto;
  border: 1px solid rgba(24, 60, 53, 0.16);
  border-radius: 12px;
  padding: clamp(16px, 2vw, 26px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(246, 249, 248, 0.9)),
    radial-gradient(circle at 88% 2%, rgba(210, 155, 64, 0.1), transparent 32%);
  color: #183c37;
}

.admin-help-content.is-loading {
  opacity: 0.72;
}

.help-doc {
  display: grid;
  gap: 22px;
}

.help-hero {
  display: grid;
  gap: 8px;
  border-left: 4px solid #c79235;
  padding: 4px 0 6px 16px;
}

.help-kicker {
  margin: 0;
  color: #8f6424;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.help-doc h1,
.help-doc h2,
.help-doc h3,
.help-doc p {
  margin: 0;
}

.help-doc h1 {
  color: #102f2b;
  font-size: clamp(1.8rem, 2.8vw, 3rem);
  line-height: 1.02;
}

.help-doc h2 {
  color: #143b35;
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  line-height: 1.1;
}

.help-doc h3 {
  color: #1c4a42;
  font-size: 1rem;
}

.help-doc p,
.help-doc li {
  color: #435752;
  font-size: 0.96rem;
  line-height: 1.55;
}

.help-toc {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.help-toc a {
  border: 1px solid rgba(24, 60, 53, 0.16);
  border-radius: 999px;
  padding: 7px 11px;
  background: rgba(255, 255, 255, 0.7);
  color: #173b37;
  font-size: 0.84rem;
  font-weight: 850;
  text-decoration: none;
}

.help-toc a:hover,
.help-toc a:focus-visible {
  border-color: rgba(199, 146, 53, 0.55);
  background: rgba(255, 247, 224, 0.9);
}

.help-section {
  display: grid;
  gap: 12px;
  border-top: 1px solid rgba(24, 60, 53, 0.12);
  padding-top: 18px;
}

.help-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.help-grid article,
.help-section > ul,
.help-section > ol {
  border: 1px solid rgba(24, 60, 53, 0.12);
  border-radius: 10px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.62);
}

.help-grid article {
  display: grid;
  gap: 8px;
}

.help-doc ul,
.help-doc ol {
  margin: 0;
  padding-left: 1.25rem;
}

.help-doc code,
.help-doc kbd {
  border-radius: 5px;
  padding: 0.1em 0.35em;
  background: rgba(24, 60, 53, 0.08);
  color: #123c35;
  font-family: Consolas, "Liberation Mono", monospace;
  font-size: 0.92em;
}

.help-error {
  gap: 10px;
}

@media (max-width: 760px) {
  .admin-help-content {
    max-height: none;
  }
}
/* v142: aide plus lisible et mieux intégrée dans les réglages. */
.admin-help-content {
  padding: 0;
  background: transparent;
  border-color: rgba(24, 60, 53, 0.1);
}

.admin-help-content .help-doc {
  border-radius: 12px;
}

.admin-help-content .help-toc {
  top: 0;
}
/* v134: boutons du poeme en fleches seules, sans disque visible. */
#mariage-poeme .poem-page-arrow {
  background: rgba(var(--poem-arrow-bg-rgb, 255, 240, 200), var(--poem-arrow-bg-opacity, 0)) !important;
  border-color: rgba(var(--poem-arrow-border-rgb, 92, 46, 25), var(--poem-arrow-border-opacity, 0)) !important;
  box-shadow: 0 0 22px rgba(255, 205, 118, var(--poem-arrow-glow-opacity, 0)) !important;
  text-shadow: none !important;
}

#mariage-poeme .poem-page-arrow:hover,
#mariage-poeme .poem-page-arrow:focus-visible {
  background: rgba(var(--poem-arrow-bg-rgb, 255, 240, 200), var(--poem-arrow-bg-opacity, 0)) !important;
  border-color: rgba(var(--poem-arrow-border-rgb, 92, 46, 25), var(--poem-arrow-border-opacity, 0)) !important;
  box-shadow: 0 0 22px rgba(255, 205, 118, var(--poem-arrow-glow-opacity, 0)) !important;
}
/* v148: tracé accueil animé par révélateur invisible, en conservant points/pointillés paramétrés. */
.depart-route-lines.is-route-animated .depart-route-line-group {
  display: block !important;
}

.depart-route-lines.is-route-animated .depart-route-line-shadow,
.depart-route-lines.is-route-animated .depart-route-line {
  display: block !important;
}

.depart-route-lines.is-route-animated .depart-route-line {
  stroke-dasharray: var(--route-line-dasharray, 1.2 1.55) !important;
}

.depart-route-reveal-source {
  fill: none !important;
  stroke: none !important;
}

.depart-route-reveal-track {
  fill: none !important;
  stroke: #fff !important;
  stroke-width: var(--route-line-mask-width, 14px) !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: none !important;
  stroke-dashoffset: 0 !important;
}


/* v151: clearer separation for the home plane animation settings. */
.home-plane-admin-card {
  border-top-color: #2a7c71;
  box-shadow: 0 18px 38px rgba(21, 63, 57, 0.08);
}

.home-plane-admin-card > h3::before {
  content: "✈";
  display: inline-block;
  margin-right: 0.45em;
  color: #c9942e;
}

.admin-card-hint {
  margin-top: -0.25rem;
  color: #6a746f;
  font-size: 0.92rem;
  font-style: italic;
}

.home-plane-propeller-settings-panel {
  border: 1px solid rgba(42, 124, 113, 0.18);
  border-radius: 12px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255, 252, 240, 0.86), rgba(236, 248, 244, 0.58));
}

.home-plane-propeller-settings-panel h4 {
  margin: 0.35rem 0 0.35rem;
  color: #153f39;
}

.home-plane-propeller-settings-panel h4 + p {
  margin-bottom: 14px;
}

/* v152: preview avion d'accueil et controles video harmonises. */
.home-plane-preview-shell {
  display: grid;
  grid-template-columns: minmax(170px, 0.32fr) minmax(280px, 1fr);
  gap: 16px;
  align-items: stretch;
  margin-bottom: 18px;
}

.home-plane-preview-copy {
  display: grid;
  align-content: center;
  gap: 7px;
  min-height: 160px;
  padding: 16px;
  border: 1px solid rgba(42, 124, 113, 0.18);
  border-radius: 12px;
  background: rgba(255, 251, 235, 0.76);
  color: #153f39;
}

.home-plane-preview-copy strong {
  font-size: 1.02rem;
}

.home-plane-preview-copy span {
  color: #64736d;
  line-height: 1.35;
}

.home-plane-preview.depart-plane-scene {
  position: relative;
  z-index: 0;
  width: min(100%, 520px);
  height: auto;
  aspect-ratio: var(--home-plane-preview-aspect, 1.619);
  border: 1px solid rgba(222, 173, 76, 0.42);
  border-radius: 14px;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 28% 62%, rgba(211, 160, 56, 0.22), transparent 26%),
    radial-gradient(circle at 74% 30%, rgba(236, 201, 117, 0.16), transparent 22%),
    linear-gradient(135deg, #0b1816 0%, #20170f 54%, #0b0d0d 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 238, 174, 0.08), 0 14px 28px rgba(12, 24, 22, 0.12);
}

.home-plane-preview .depart-plane-float {
  width: 100%;
  height: 100%;
  margin: 0;
}

.home-plane-preview .depart-plane-wing-halo {
  opacity: 0.42;
}

@media (max-width: 820px) {
  .home-plane-preview-shell {
    grid-template-columns: 1fr;
  }

  .home-plane-preview-copy {
    min-height: 0;
  }
}

.marriage-video-controls .video-toggle-button,
.marriage-video-controls .video-stop-button {
  display: grid;
  place-items: center;
  padding: 0;
}

.marriage-video-controls .video-toggle-button .video-toggle-symbol {
  position: relative;
  width: 18px;
  height: 18px;
}

.marriage-video-controls .video-toggle-play {
  display: block;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
  transform: translateX(1px);
}

.marriage-video-controls .video-toggle-play::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 2px;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 11px solid currentColor;
}

.marriage-video-controls .video-toggle-pause {
  display: none;
  width: 18px;
  height: 18px;
}

.marriage-video-controls .video-toggle-pause::before,
.marriage-video-controls .video-toggle-pause::after {
  top: 1px;
  width: 5px;
  height: 16px;
  border-radius: 2px;
}

.marriage-video-controls .video-toggle-pause::before {
  left: 3px;
}

.marriage-video-controls .video-toggle-pause::after {
  right: 3px;
}

.marriage-video-controls .video-toggle-button.is-playing .video-toggle-play {
  display: none;
}

.marriage-video-controls .video-toggle-button.is-playing .video-toggle-pause {
  display: block;
}

.video-stop-symbol {
  display: block;
  width: 14px;
  height: 14px;
  border-radius: 2px;
  background: currentColor;
  box-shadow: 0 0 0.45em rgba(245, 207, 124, 0.18);
}

.marriage-video-pause-indicator {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 4;
  display: flex;
  gap: 0.32em;
  width: clamp(34px, 5.4vw, 68px);
  height: clamp(40px, 6.4vw, 78px);
  transform: translate(-50%, -50%) scale(0.98);
  color: #fff;
  opacity: 0;
  pointer-events: none;
  filter: drop-shadow(0 0 0.45em rgba(255, 255, 255, 0.64)) drop-shadow(0 0 1.1em rgba(245, 207, 124, 0.28));
}

.marriage-video-pause-indicator span {
  flex: 1;
  border-radius: 999px;
  background: currentColor;
}

.marriage-video-player.has-video-started:not(.is-video-playing):not(.is-awaiting-video) .marriage-video-pause-indicator {
  animation: marriage-video-pause-breathe 3.4s ease-in-out infinite;
}

.marriage-video-player.is-video-playing .marriage-video-pause-indicator,
.marriage-video-player.is-awaiting-video .marriage-video-pause-indicator {
  opacity: 0;
  animation: none;
}

@keyframes marriage-video-pause-breathe {
  0%, 100% {
    opacity: 0.28;
    transform: translate(-50%, -50%) scale(0.96);
  }
  50% {
    opacity: 0.92;
    transform: translate(-50%, -50%) scale(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  .marriage-video-player.has-video-started:not(.is-video-playing):not(.is-awaiting-video) .marriage-video-pause-indicator {
    animation: none;
    opacity: 0.72;
  }
}

/* v153: marqueur configurable au depart du trace d'itineraire. */
.depart-route-draw-plane {
  position: absolute;
  left: var(--route-x, 50%);
  top: var(--route-y, 50%);
  z-index: 2;
  display: grid;
  place-items: center;
  width: var(--route-start-size, 1.7cqw);
  height: var(--route-start-size, 1.7cqw);
  color: var(--route-start-color, #fff3c3);
  opacity: var(--route-start-opacity, 0.95);
  pointer-events: none;
  transform:
    translate(calc(-50% + var(--route-start-offset-x, 0cqw)), calc(-50% + var(--route-start-offset-y, 0cqw)))
    rotate(var(--route-start-rotation, -8deg));
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 0.45cqw rgba(255, 199, 83, 0.78)) drop-shadow(0 0 0.12cqw rgba(15, 8, 0, 0.95));
}

.depart-route-draw-plane > span {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--route-start-size, 1.7cqw);
  font-weight: 900;
  line-height: 1;
}

.depart-route-draw-plane.has-custom-image > span {
  overflow: hidden;
  color: transparent;
  text-indent: -999px;
  background-image: var(--route-start-marker-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: none;
}

.route-line-help {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  color: #60736e;
  font-size: 0.86rem;
  line-height: 1.35;
}

/* v154: l'avion de trace suit la tete de la trainee animee. */
.depart-route-draw-plane {
  left: var(--route-plane-x, var(--route-x, 50%)) !important;
  top: var(--route-plane-y, var(--route-y, 50%)) !important;
  z-index: 4 !important;
  will-change: left, top, transform;
  transform:
    translate(calc(-50% + var(--route-start-offset-x, 0cqw)), calc(-50% + var(--route-start-offset-y, 0cqw)))
    rotate(calc(var(--route-plane-angle, 0deg) + var(--route-start-rotation, -8deg))) !important;
}

/* v155: animation de trace plus fluide avec fondu de boucle. */
.depart-route-lines.is-route-animated .depart-route-line-group {
  opacity: var(--route-reveal-opacity, 1) !important;
}

.depart-route-draw-plane {
  opacity: var(--route-plane-cycle-opacity, var(--route-start-opacity, 0.95)) !important;
}

.depart-route-draw-plane.is-route-plane-positioned {
  left: 0 !important;
  top: 0 !important;
  transform:
    translate3d(
      calc(var(--route-plane-pixel-x, 0px) - 50% + var(--route-start-offset-x, 0cqw)),
      calc(var(--route-plane-pixel-y, 0px) - 50% + var(--route-start-offset-y, 0cqw)),
      0
    )
    rotate(calc(var(--route-plane-angle, 0deg) + var(--route-start-rotation, -8deg))) !important;
}
/* v156: reglage visuel du reflet avion accueil. */
.depart-plane-float::before {
  transform: none !important;
  background-position: var(--home-plane-shine-start-x, -70%) var(--home-plane-shine-start-y, 50%);
  will-change: background-position, opacity;
}

@keyframes home-plane-shine {
  0%, 16% {
    background-position: var(--home-plane-shine-start-x, -70%) var(--home-plane-shine-start-y, 50%);
    opacity: 0;
  }
  30%, 48% {
    opacity: var(--home-plane-shine-opacity, 0.66);
  }
  58% {
    background-position: var(--home-plane-shine-end-x, 62%) var(--home-plane-shine-end-y, 50%);
    opacity: var(--home-plane-shine-opacity, 0.66);
  }
  100% {
    background-position: var(--home-plane-shine-end-x, 62%) var(--home-plane-shine-end-y, 50%);
    opacity: 0;
  }
}

.home-plane-preview.depart-plane-scene {
  pointer-events: none !important;
}

.home-plane-preview .depart-plane-float {
  pointer-events: none;
}



/* Dossiers locaux des galeries souvenirs. */
.page-content-settings .gallery-folder-source {
  display: grid;
  gap: 0.35rem;
  width: 100%;
  color: #29433e;
  font-weight: 800;
}

.page-content-settings .gallery-folder-source input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.4rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid rgba(24, 60, 53, 0.28);
  border-radius: 7px;
  background: #fffdf7;
  color: #173f38;
}

.page-content-settings [data-gallery-folder-status] {
  color: #536a65;
  overflow-wrap: anywhere;
}
/* Lecteur musical public réduit à son bouton note/pause. */
.page-audio-player {
  gap: 0;
  max-width: none;
  border: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.page-audio-player button {
  width: 42px;
  height: 42px;
  padding: 0;
  cursor: pointer;
  font-size: 20px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.34), 0 0 16px rgba(220, 164, 54, 0.24);
}
/* Timeline cadeau : autoriser les éléments à dépasser leur cadre de scène. */
.gift-deposit-page.gift-timeline-enabled .gift-deposit-animation,
#admin .gift-timeline-preview,
#admin .gift-timeline-preview .gift-deposit-animation {
  overflow: visible !important;
}
/* Espace dédié à la gestion des galeries. */
.admin-gallery-workspace {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.admin-gallery-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.admin-gallery-tabs button,
.gallery-admin-subtabs button {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  min-height: 48px;
  border: 1px solid #9eb0ab;
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  background: #f7f9f7;
  color: #29433e;
  font-weight: 800;
  text-align: center;
}

.admin-gallery-tabs button small,
.gallery-admin-subtabs button small {
  color: #687b76;
  font-size: 0.72rem;
  font-weight: 700;
}

.admin-gallery-tabs button.active,
.gallery-admin-subtabs button.active,
.admin-gallery-tabs button:hover,
.gallery-admin-subtabs button:hover,
.admin-gallery-tabs button:focus-visible,
.gallery-admin-subtabs button:focus-visible {
  border-color: #245d55;
  background: #173f38;
  color: #fff;
  outline: none;
}

.admin-gallery-tabs button.active small,
.gallery-admin-subtabs button.active small {
  color: #dceae6;
}

.admin-gallery-panels,
.admin-gallery-panel {
  min-width: 0;
}

.admin-gallery-panel[hidden] {
  display: none;
}

.admin-gallery-panel > article {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  border: 1px solid #cbd5d1;
  border-radius: 9px;
  padding: 0.85rem;
  background: #fff;
}

.admin-gallery-panel .gallery-folder-source,
.admin-gallery-panel .gallery-folder-import {
  display: grid;
  gap: 0.35rem;
  width: 100%;
  color: #29433e;
  font-weight: 800;
}

.admin-gallery-panel .gallery-folder-source input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.4rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid rgba(24, 60, 53, 0.28);
  border-radius: 7px;
  background: #fffdf7;
  color: #173f38;
}

.admin-gallery-panel [data-gallery-folder-status] {
  color: #536a65;
  overflow-wrap: anywhere;
}

.gallery-admin-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: stretch;
}

.gallery-admin-subtabs button {
  flex: 0 1 190px;
  min-height: 42px;
}
/* Gestionnaire physique des galeries dans l'administration. */
.page-content-settings article.gallery-admin-card,
.admin-gallery-panel article.gallery-admin-card {
  grid-column: 1 / -1;
}

.gallery-admin-manager {
  display: grid;
  gap: 1rem;
  width: 100%;
  margin-top: 0.7rem;
}

.gallery-admin-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(240px, 1.2fr);
  gap: 0.75rem;
  align-items: end;
  padding: 0.8rem;
  border: 1px solid rgba(37, 73, 66, 0.2);
  border-radius: 8px;
  background: #f6f8f4;
}

.gallery-admin-toolbar label {
  display: grid;
  gap: 0.35rem;
  color: #29433e;
  font-weight: 800;
}

.gallery-admin-toolbar .gallery-admin-public-tabs {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.gallery-admin-toolbar .gallery-admin-public-tabs input {
  width: auto;
  min-height: 0;
}
.gallery-admin-toolbar select,
.gallery-admin-toolbar input[type="file"] {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.4rem;
}

.gallery-admin-toolbar small {
  grid-column: 1 / -1;
  color: #60736e;
}

.gallery-admin-group {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  padding-top: 0.3rem;
}

.gallery-admin-group h4 {
  display: flex;
  gap: 0.7rem;
  align-items: baseline;
  justify-content: space-between;
  margin: 0;
  color: #183f38;
}

.gallery-admin-group h4 small {
  color: #60736e;
  font-weight: 600;
}

.gallery-admin-thumbnails {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
  gap: 0.7rem;
}
.gallery-admin-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 0 4px;
}

.gallery-admin-pagination span {
  color: #52615e;
  font-weight: 700;
}

.gallery-admin-pagination button {
  width: auto;
  min-width: 120px;
}

.gallery-admin-photo {
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 0.4rem;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cbd5d1;
  border-radius: 8px;
  padding: 0.45rem;
  background: #fff;
}

.gallery-admin-photo.is-disabled {
  border-style: dashed;
  background: #eef1ef;
}

.gallery-admin-photo-preview {
  display: grid;
  grid-template-rows: 140px auto auto;
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-radius: 6px;
  padding: 0;
  background: #121817;
  color: #fff;
  text-align: left;
  cursor: zoom-in;
}

.gallery-admin-photo-preview .gallery-admin-media-frame {
  position: relative;
  display: grid;
  width: 100%;
  height: 140px;
  overflow: hidden;
  padding: 0;
  place-items: center;
  background: #e8eeeb;
}

.gallery-admin-media-frame::before {
  position: absolute;
  width: 22px;
  height: 22px;
  border: 3px solid rgba(31, 93, 80, 0.22);
  border-top-color: #1f5d50;
  border-radius: 50%;
  content: "";
  animation: gallery-admin-thumbnail-spin 0.8s linear infinite;
}

.gallery-admin-media-frame.is-loaded::before,
.gallery-admin-media-frame.is-load-error::before {
  display: none;
}

.gallery-admin-photo-preview img,
.gallery-admin-photo-preview video {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

@keyframes gallery-admin-thumbnail-spin {
  to { transform: rotate(360deg); }
}

.gallery-admin-photo.is-disabled .gallery-admin-photo-preview img,
.gallery-admin-photo.is-disabled .gallery-admin-photo-preview video {
  opacity: 0.42;
  filter: grayscale(0.8);
}

.gallery-admin-photo-preview span {
  overflow: hidden;
  padding: 0.4rem 0.5rem;
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gallery-admin-photo-preview .gallery-admin-photo-dimensions {
  padding-top: 0;
  color: #cfe1dc;
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
}

.gallery-admin-visibility {
  display: flex;
  gap: 0.4rem;
  align-items: flex-start;
  min-height: 2.1rem;
  color: #29433e;
  font-size: 0.76rem;
  line-height: 1.25;
}

.gallery-admin-delete {
  min-height: 30px;
  border-color: #a9382f !important;
  background: #fff4f2 !important;
  color: #8c231b !important;
  font-size: 0.75rem;
}

.gallery-admin-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.7rem;
  border: 1px dashed #b9c5c1;
  border-radius: 7px;
  color: #60736e;
  background: #fafbf9;
}

.gallery-auto-tab-list {
  display: grid;
  gap: 0.4rem;
  margin: 0.7rem 0;
  padding: 0;
  list-style: none;
}

.gallery-auto-tab-list li {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  border-bottom: 1px solid rgba(37, 73, 66, 0.14);
  padding: 0.35rem 0;
}

/* Les étiquettes d'onglets partagent exactement le cadre du calibrage. */
.screen-design-frame > .gallery-filter-tabs,
.screen > .gallery-filter-tabs {
  position: absolute;
  z-index: 9;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.screen-design-frame > .gallery-filter-tabs[hidden],
.screen > .gallery-filter-tabs[hidden] {
  display: none;
}

.screen-design-frame > .gallery-filter-tabs button,
.screen > .gallery-filter-tabs button {
  position: absolute;
  display: inline-flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  margin: 0;
  pointer-events: auto;
  appearance: none;
  -webkit-appearance: none;
  font-family: inherit;
  text-align: center;
  vertical-align: top;
  font-size: var(--overlay-font-size, clamp(11px, 0.86cqw, 15px));
}

@media (max-width: 760px) {
  .admin-gallery-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-admin-subtabs button {
    flex-basis: calc(50% - 0.25rem);
  }

  .gallery-admin-toolbar {
    grid-template-columns: 1fr;
  }

  .gallery-admin-toolbar small {
    grid-column: 1;
  }

  .gallery-admin-thumbnails {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* v172 : étiquette de navigation réglable, aperçu admin et chargement des galeries. */
.quick-nav-label > img {
  clip-path: inset(var(--quick-nav-rope-crop, 0%) 0 0 0);
}

.quick-nav button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  font-size: var(--overlay-font-size, clamp(9px, 0.72vw, 14px));
  line-height: var(--overlay-line-height, 1);
}

#quickBack {
  top: 81%;
  left: 17%;
  width: 66%;
  height: 11%;
}

.quick-home {
  top: 68.5%;
  left: 17%;
  width: 66%;
  height: 11%;
}

.quick-nav-symbol {
  display: block;
  font-size: 1.18em;
  font-style: normal;
  line-height: 0.82;
}

.quick-nav-text {
  display: block;
  line-height: 1;
}

.quick-nav-calibration-preview {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(198, 148, 54, 0.42);
  border-radius: 10px;
  padding: 10px;
  background: linear-gradient(145deg, rgba(19, 25, 25, 0.96), rgba(72, 45, 19, 0.92));
  color: #ffe7ae;
}

.quick-nav-calibration-preview[hidden],
.quick-nav-rope-control[hidden] {
  display: none !important;
}

.quick-nav-calibration-preview > strong,
.quick-nav-calibration-preview > small {
  text-align: center;
}

.quick-nav-calibration-preview > small {
  color: rgba(255, 231, 174, 0.78);
  font-size: 11px;
}

.quick-nav-preview-stage {
  display: grid;
  min-height: 260px;
  place-items: center;
  overflow: hidden;
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 35%, rgba(220, 157, 65, 0.24), transparent 42%),
    rgba(4, 8, 9, 0.72);
}

.quick-nav-preview-label {
  position: relative;
  width: 56px;
  height: 250px;
}

.quick-nav-preview-label > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  clip-path: inset(var(--quick-nav-rope-crop, 0%) 0 0 0);
  filter: drop-shadow(0 7px 8px rgba(0, 0, 0, 0.4));
}

.quick-nav-preview-action {
  position: absolute;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #4b2411;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px rgba(255, 232, 170, 0.72);
}

.quick-nav-preview-action b,
.quick-nav-preview-action i {
  font-style: normal;
  line-height: inherit;
}

.quick-nav-preview-action b {
  font-size: 1.18em;
}

.gallery-loading-state {
  grid-column: 1 / -1;
  align-self: center;
  justify-self: center;
  display: grid;
  min-height: 0;
  place-content: center;
  place-items: center;
  gap: 5px;
  border: 0;
  padding: 8px;
  background: transparent;
  color: #fff0bd;
  text-align: center;
  box-shadow: none;
}

.gallery-loading-state strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(13px, 1cqw, 18px);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.62);
}

.gallery-loading-visual {
  position: relative;
  display: grid;
  width: 58px;
  height: 68px;
  margin-bottom: 2px;
  place-items: center;
}

.gallery-loading-visual::before {
  content: "⌛";
  display: block;
  color: #d7a44d;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 52px;
  line-height: 1;
  text-shadow: 0 2px 0 #5a3215, 0 0 10px rgba(255, 205, 104, 0.5);
  filter: sepia(0.35) saturate(1.15);
  transform-origin: 50% 50%;
  animation: gallery-hourglass-turn 1.8s ease-in-out infinite;
}

@keyframes gallery-hourglass-turn {
  0%, 42% { opacity: 0.82; transform: rotate(0deg) scale(0.96); }
  50% { opacity: 1; transform: rotate(180deg) scale(1.04); }
  92% { opacity: 0.82; transform: rotate(180deg) scale(0.96); }
  100% { opacity: 1; transform: rotate(360deg) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-loading-visual::before {
    animation: none;
  }
}

.gallery-pagination {
  transform: translate(var(--gallery-pagination-offset-x, 0px), var(--gallery-pagination-offset-y, 0px));
}

/* v172 : croix de fermeture nette et réellement centrée. */
.experience-viewer.is-memory-card .experience-viewer-close {
  position: absolute;
  overflow: hidden;
  border: 1px solid rgba(91, 55, 25, 0.42);
  border-radius: 999px !important;
  background: radial-gradient(circle at 35% 30%, rgba(255, 229, 168, 0.9), rgba(181, 137, 77, 0.82));
  color: #5a3218;
  box-shadow: inset 0 0 0 2px rgba(255, 242, 202, 0.28), 0 3px 9px rgba(69, 38, 15, 0.24);
}

.experience-viewer.is-memory-card .experience-viewer-close::before,
.experience-viewer.is-memory-card .experience-viewer-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: 48%;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
}

.experience-viewer.is-memory-card .experience-viewer-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.experience-viewer.is-memory-card .experience-viewer-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.experience-viewer.is-memory-card .experience-viewer-close:hover,
.experience-viewer.is-memory-card .experience-viewer-close:focus-visible {
  border-color: rgba(110, 59, 23, 0.72);
  background: radial-gradient(circle at 35% 30%, #fff0c2, #c18b49);
  color: #7d2d18;
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  .gallery-loading-visual i {
    animation: none;
  }
}
/* v174 : réglages directs de l’étiquette et pages soirée dans l’administration. */
.navigation-label-admin-card,
.party-page-admin-card {
  border-top: 3px solid #b8862f;
}

.navigation-label-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
  gap: 14px;
  align-items: end;
  margin-bottom: 16px;
}

.navigation-label-toolbar > label {
  display: grid;
  gap: 6px;
  color: #29433e;
  font-weight: 800;
}

.navigation-label-toolbar select,
.navigation-label-editor-grid input {
  width: 100%;
  min-height: 40px;
  border: 1px solid #aab9b5;
  border-radius: 7px;
  padding: 7px 9px;
  background: #fff;
  color: #1d332f;
}

.navigation-label-visual-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.navigation-label-visual-actions button {
  flex: 1 1 170px;
}

.navigation-label-admin-preview {
  position: relative;
  width: min(100%, 860px);
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin: 0 auto 18px;
  border: 2px solid #405b56;
  border-radius: 10px;
  background:
    linear-gradient(rgba(5, 13, 13, 0.28), rgba(5, 13, 13, 0.58)),
    radial-gradient(circle at 50% 45%, #42625c, #12221f 72%);
  box-shadow: inset 0 0 0 1px rgba(255, 236, 184, 0.18);
}

.navigation-label-admin-preview::after {
  position: absolute;
  right: 10px;
  bottom: 8px;
  content: "Aperçu du cadre de la page";
  color: rgba(255, 239, 196, 0.72);
  font-size: 11px;
  pointer-events: none;
}

.navigation-label-admin-preview-label {
  position: absolute;
  pointer-events: none;
}

.navigation-label-admin-preview-label > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  clip-path: inset(var(--quick-nav-rope-crop, 0%) 0 0 0);
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.4));
}

.navigation-label-admin-preview-action {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #4d2814;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.navigation-label-admin-preview-action b,
.navigation-label-admin-preview-action i {
  display: block;
  font-style: normal;
  line-height: 1;
}

.navigation-label-editor-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.navigation-label-editor-grid fieldset {
  display: grid;
  align-content: start;
  gap: 9px;
  min-width: 0;
  margin: 0;
  border: 1px solid #c5d0cd;
  border-radius: 10px;
  padding: 13px;
  background: #f8faf9;
}

.navigation-label-editor-grid legend {
  padding: 0 7px;
  color: #173f38;
  font-weight: 900;
}

.navigation-label-editor-grid label {
  display: grid;
  gap: 4px;
  color: #3f5651;
  font-size: 12px;
  font-weight: 750;
}

.navigation-label-image-input {
  border: 1px dashed #9aadab;
  border-radius: 8px;
  padding: 9px;
  background: #fff;
}

.navigation-label-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
}

.navigation-label-footer small {
  color: #60736f;
}

.party-page-admin-layout {
  display: grid;
  grid-template-columns: minmax(280px, 1.4fr) minmax(220px, 0.6fr);
  gap: 18px;
  align-items: start;
}

.party-page-background-control {
  display: grid;
  gap: 10px;
  border: 1px solid #c4cfcc;
  border-radius: 10px;
  padding: 14px;
  background: #f8faf9;
}

.party-page-background-control > img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid #9aaba7;
  border-radius: 8px;
  object-fit: cover;
  background: linear-gradient(145deg, #12231f, #56351a);
}

.party-page-background-control > label {
  display: grid;
  gap: 6px;
  font-weight: 800;
}

.party-page-admin-actions {
  display: grid;
  gap: 14px;
  border: 1px solid #d8c59c;
  border-radius: 10px;
  padding: 16px;
  background: #fffaf0;
}

.party-page-admin-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 7px;
  padding: 8px 14px;
  background: #173f38;
  color: #fff;
  font-weight: 850;
  text-align: center;
  text-decoration: none;
}

.party-page-admin-actions a:hover,
.party-page-admin-actions a:focus-visible {
  background: #245d55;
  outline: 2px solid #b8862f;
}

@media (max-width: 850px) {
  .navigation-label-toolbar,
  .party-page-admin-layout {
    grid-template-columns: 1fr;
  }

  .navigation-label-editor-grid {
    grid-template-columns: 1fr;
  }
}
/* Accès administrateur sécurisé, statistiques serveur et page Virement. */
.admin-login-dialog {
  width: min(92vw, 520px);
  border: 1px solid rgba(210, 158, 63, .78);
  border-radius: 18px;
  padding: 0;
  background: linear-gradient(145deg, rgba(251, 241, 210, .98), rgba(226, 198, 137, .98));
  color: #2c1d13;
  box-shadow: 0 30px 100px rgba(0, 0, 0, .62);
}
.admin-login-dialog::backdrop {
  background: rgba(2, 7, 7, .84);
  backdrop-filter: blur(7px);
}
.admin-login-dialog form {
  display: grid;
  gap: 15px;
  padding: clamp(24px, 5vw, 38px);
  text-align: center;
}
.admin-login-dialog .party-kicker {
  display: block;
  text-align: center;
}
.admin-login-dialog h2 {
  margin: 0;
  color: #3a2414;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 6.4vw, 3.25rem);
  line-height: 1.04;
  text-align: center;
  text-wrap: balance;
}
.admin-login-dialog p {
  margin: 0;
  line-height: 1.45;
  text-align: center;
}
.admin-login-dialog label {
  display: grid;
  gap: 7px;
  color: #4e3523;
  font-weight: 800;
  text-align: center;
}
.admin-login-dialog #adminPasswordConfirmationRow[hidden] {
  display: none !important;
}
.admin-login-dialog input {
  width: 100%;
  min-height: 48px;
  box-sizing: border-box;
  border: 1px solid rgba(94, 59, 31, .42);
  border-radius: 10px;
  padding: 0 13px;
  background: rgba(255, 252, 238, .86);
  color: #24150c;
  font: inherit;
  text-align: center;
}
.admin-login-dialog input:focus { outline: 3px solid rgba(191, 126, 35, .25); border-color: #9a5e20; }
.admin-login-status { min-height: 1.45em; color: #8a201b; font-weight: 800; text-align: center; }
.admin-login-actions { display: flex; justify-content: center; gap: 10px; }
.admin-login-actions button {
  min-height: 42px;
  border: 1px solid #7b4b20;
  border-radius: 999px;
  padding: 0 18px;
  background: #f6e7bd;
  color: #3b2413;
  font-weight: 900;
}
.admin-login-actions button[type="submit"] { background: linear-gradient(#d9a74e, #995f25); color: #211105; }

.visit-stats-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
  margin: 16px 0;
}
.visit-stats-toolbar > label:first-child { display: grid; gap: 5px; font-weight: 800; }
.visit-stats-toolbar select,
.visit-stats-toolbar button {
  min-height: 40px;
  border: 1px solid rgba(30, 61, 54, .34);
  border-radius: 9px;
  padding: 0 12px;
  background: #fffdf6;
  color: #172b28;
  font: inherit;
  font-weight: 800;
}
.visit-stats-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}
.visit-stats-summary > div {
  display: grid;
  gap: 3px;
  border: 1px solid rgba(47, 76, 68, .2);
  border-radius: 12px;
  padding: 14px;
  background: rgba(247, 243, 226, .78);
}
.visit-stats-summary strong { font-size: 1.7rem; color: #1d4b42; }
.visit-stats-summary span { color: #61716d; font-size: .78rem; }
.visit-stats-pages { overflow-x: auto; }
.visit-stats-pages table { width: 100%; border-collapse: collapse; }
.visit-stats-pages th,
.visit-stats-pages td { border-bottom: 1px solid rgba(44, 73, 66, .16); padding: 9px 11px; text-align: left; }
.visit-stats-pages th { color: #31544d; font-size: .78rem; text-transform: uppercase; }
.visit-stats-pages th:not(:first-child),
.visit-stats-pages td:not(:first-child) { text-align: right; }

@media (max-width: 760px) {
  .visit-stats-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-login-actions { align-items: stretch; flex-direction: column-reverse; }
}
/* v177 : adresses des pages distantes et accès secret à la galerie soirée. */
.remote-page-route-settings {
  align-content: start;
  align-items: stretch;
}
.remote-page-route-settings > label:not(.admin-switch) {
  display: grid;
  gap: 6px;
  color: #38534d;
  font-weight: 800;
}
.remote-page-slug-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(43, 73, 66, .32);
  border-radius: 9px;
  background: #fffdf7;
}
.remote-page-slug-field b {
  padding-left: 12px;
  color: #977028;
  font-size: 1.15rem;
}
.remote-page-slug-field input {
  min-width: 0;
  min-height: 42px;
  border: 0;
  padding: 0 12px 0 3px;
  background: transparent;
  color: #183b34;
  font: inherit;
  font-weight: 800;
}
.remote-page-route-settings textarea {
  width: 100%;
  min-height: 96px;
  resize: vertical;
  border: 1px solid rgba(43, 73, 66, .32);
  border-radius: 9px;
  padding: 10px 12px;
  background: #fffdf7;
  color: #183b34;
  font: inherit;
  line-height: 1.45;
}
.remote-page-route-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.remote-page-route-buttons button,
.remote-page-route-settings > button {
  min-height: 42px;
}
.remote-page-riddle-action {
  border-left: 3px solid #bd832a;
  padding: 9px 12px;
  background: rgba(203, 156, 70, .1);
}
.remote-page-route-status {
  min-height: 1.4em;
  color: #5e706c;
}

#partyGallerySecretTrigger.secret-gallery-trigger {
  appearance: none;
  -webkit-appearance: none;
  pointer-events: auto;
  touch-action: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
#partyGallerySecretTrigger.secret-gallery-trigger:focus-visible {
  outline: 2px dashed rgba(255, 220, 131, .6);
  outline-offset: 4px;
}
#partyGallerySecretTrigger.secret-gallery-trigger.is-counting {
  border-radius: 50%;
  box-shadow:
    0 0 0 calc(1px + 4px * var(--secret-click-progress, 0)) rgba(255, 227, 145, .42),
    0 0 calc(12px + 24px * var(--secret-click-progress, 0)) rgba(255, 191, 71, .78);
  animation: secret-gallery-click 360ms ease-out both;
}
@keyframes secret-gallery-click {
  0% { filter: brightness(1); transform: scale(1); }
  45% { filter: brightness(1.85) drop-shadow(0 0 10px rgba(255, 207, 103, .9)); transform: scale(1.08); }
  100% { filter: brightness(1.16); transform: scale(1); }
}
/* v179 : répartitions techniques des visites. */
.visit-stats-pages {
  margin-top: 18px;
}
.visit-stats-pages h4,
.visit-stats-breakdowns h4 {
  margin: 0 0 10px;
  color: #274c44;
}
.visit-stats-breakdowns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.visit-stats-breakdowns article {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid rgba(44, 73, 66, .17);
  border-radius: 12px;
  padding: 14px;
  background: rgba(252, 249, 237, .72);
}
.visit-stats-breakdowns table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
}
.visit-stats-breakdowns th,
.visit-stats-breakdowns td {
  border-bottom: 1px solid rgba(44, 73, 66, .13);
  padding: 7px 8px;
  text-align: left;
}
.visit-stats-breakdowns th {
  color: #48635d;
  font-size: .7rem;
  text-transform: uppercase;
}
.visit-stats-breakdowns th:not(:first-child),
.visit-stats-breakdowns td:not(:first-child) {
  text-align: right;
}
.visit-stats-privacy {
  margin: 16px 0 0;
  color: #667873;
  font-size: .78rem;
}
@media (max-width: 900px) {
  .visit-stats-breakdowns {
    grid-template-columns: 1fr;
  }
}

/* Extraction sélective des anciennes sauvegardes */
.selective-restore-card {
  grid-column: 1 / -1;
}

.selective-restore-source-actions,
.selective-restore-toolbar,
.selective-restore-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.selective-restore-source-actions {
  margin-top: 4px;
}

.selective-restore-status {
  min-height: 22px;
  border-left: 3px solid rgba(40, 77, 69, 0.28);
  padding: 8px 11px;
  background: rgba(245, 248, 246, 0.82);
}

.selective-restore-status[data-status="loading"] {
  border-left-color: #b98025;
  color: #6b4812;
}

.selective-restore-status[data-status="success"] {
  border-left-color: #2f7a5f;
  color: #205a47;
}

.selective-restore-status[data-status="warning"] {
  border-left-color: #c18422;
  color: #704c14;
}

.selective-restore-status[data-status="error"] {
  border-left-color: #b3342c;
  color: #84241f;
}

.selective-restore-workspace {
  display: grid;
  gap: 14px;
  margin-top: 8px;
}

.selective-restore-workspace[hidden] {
  display: none;
}

.selective-restore-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.selective-restore-summary > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid rgba(44, 80, 72, 0.16);
  border-radius: 11px;
  padding: 11px 12px;
  background: rgba(249, 251, 249, 0.9);
}

.selective-restore-summary strong {
  overflow-wrap: anywhere;
  color: #264d45;
  font-size: 1rem;
}

.selective-restore-summary span {
  color: #6b7a76;
  font-size: 0.76rem;
}

.selective-restore-toolbar {
  border-block: 1px solid rgba(44, 80, 72, 0.12);
  padding-block: 10px;
}

.selective-restore-groups {
  display: grid;
  gap: 10px;
}

.selective-restore-group {
  overflow: hidden;
  border: 1px solid rgba(44, 80, 72, 0.17);
  border-radius: 12px;
  background: rgba(252, 253, 252, 0.9);
}

.selective-restore-group > summary {
  cursor: pointer;
  padding: 11px 13px;
  background: rgba(231, 238, 234, 0.68);
}

.selective-restore-group > summary label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.selective-restore-group > summary span {
  border-radius: 999px;
  padding: 2px 8px;
  background: #fff;
  color: #526963;
  font-size: 0.76rem;
}

.selective-restore-items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
  gap: 10px;
  max-height: 620px;
  overflow: auto;
  padding: 10px;
  scrollbar-gutter: stable;
}

.selective-restore-item {
  position: relative;
  display: grid;
  grid-template-columns: 24px 88px minmax(0, 1fr);
  gap: 9px;
  min-height: 104px;
  border: 1px solid rgba(44, 80, 72, 0.15);
  border-radius: 10px;
  padding: 9px;
  background: #fff;
}

.selective-restore-item.is-duplicate {
  opacity: 0.66;
  background: #f2f3f2;
}

.selective-restore-check {
  display: grid;
  place-items: start center;
  padding-top: 3px;
}

.selective-restore-check input,
.selective-restore-group input {
  width: 17px;
  height: 17px;
  accent-color: #2f6c5c;
}

.selective-restore-preview {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 84px;
  overflow: hidden;
  border-radius: 8px;
  background: #e9eeeb;
}

.selective-restore-preview:empty {
  display: none;
}

.selective-restore-preview img,
.selective-restore-preview video {
  display: block;
  width: 100%;
  height: 84px;
  object-fit: cover;
}

.selective-restore-preview audio {
  width: 100%;
  max-width: 86px;
}

.selective-restore-no-preview {
  padding: 7px;
  color: #69736f;
  font-size: 0.7rem;
  text-align: center;
}

.selective-restore-copy {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
}

.selective-restore-copy strong {
  overflow: hidden;
  color: #244b43;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.selective-restore-copy time {
  color: #7b6a4f;
  font-size: 0.72rem;
  font-weight: 700;
}

.selective-restore-copy p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  color: #5e6d68;
  font-size: 0.78rem;
  line-height: 1.35;
}

.selective-restore-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.selective-restore-badges span {
  border-radius: 999px;
  padding: 3px 7px;
  font-size: 0.66rem;
  font-weight: 800;
}

.selective-restore-badges .is-duplicate {
  background: #e2e5e3;
  color: #52615d;
}

.selective-restore-badges .has-conflict {
  background: #fff0c9;
  color: #775116;
}

.selective-restore-badges .is-missing {
  background: #f8d8d5;
  color: #842820;
}

.selective-restore-footer {
  justify-content: space-between;
  position: sticky;
  bottom: 0;
  z-index: 2;
  border: 1px solid rgba(44, 80, 72, 0.16);
  border-radius: 12px;
  padding: 11px;
  background: rgba(248, 251, 249, 0.97);
  box-shadow: 0 -8px 22px rgba(29, 55, 49, 0.08);
}

.selective-restore-footer p {
  margin: 0;
  font-weight: 800;
}

@media (max-width: 760px) {
  .selective-restore-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .selective-restore-items {
    grid-template-columns: 1fr;
  }

  .selective-restore-item {
    grid-template-columns: 24px 72px minmax(0, 1fr);
  }

  .selective-restore-footer button {
    width: 100%;
  }
}

/* v186 : preview Navigation Retour / Accueil réellement synchronisé. */
.quick-nav-label > img,
.quick-nav-preview-label > img,
.navigation-label-admin-preview-label > img {
  object-fit: fill;
}

.navigation-label-admin-preview-label {
  z-index: 2;
  outline: 1px dashed rgba(255, 224, 145, 0.72);
  outline-offset: 2px;
}

.navigation-label-admin-preview-action {
  z-index: 1;
  text-align: center;
  text-shadow: 0 1px rgba(255, 232, 170, 0.72);
}

.navigation-label-preview-status {
  position: absolute;
  left: 10px;
  bottom: 8px;
  z-index: 4;
  max-width: calc(100% - 210px);
  border-radius: 999px;
  padding: 4px 9px;
  background: rgba(2, 9, 9, 0.72);
  color: #ffe7ae;
  font-size: 11px;
  font-weight: 800;
  pointer-events: none;
}

.navigation-label-admin-preview::after {
  z-index: 3;
}
/* v187 : rotation réglable du curseur personnalisé. */
.cursor-rotation-setting {
  grid-column: 1 / -1;
}

.cursor-rotation-setting > span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 76px 48px;
  align-items: center;
  gap: 8px;
}

.cursor-rotation-setting input[type="number"] {
  min-height: 32px;
  border: 1px solid #aab9b5;
  border-radius: 6px;
  padding: 4px 6px;
  background: #fff;
  text-align: right;
}

.cursor-rotation-setting output {
  color: #173b37;
  font-weight: 800;
  text-align: right;
}

.interface-asset-settings .cursor-admin-media-preview img {
  width: 96px;
  height: 96px;
  margin: 8px auto 0;
  background: transparent;
  transform: rotate(var(--cursor-preview-rotation, 0deg)) scale(var(--cursor-preview-scale, 1));
  transform-origin: center;
  transition: transform 80ms linear;
}

@media (max-width: 560px) {
  .cursor-rotation-setting > span {
    grid-template-columns: minmax(0, 1fr) 68px;
  }

  .cursor-rotation-setting output {
    grid-column: 2;
  }
}
/* v188 : calibrage des effets des pages serveur. */
.app-shell[data-view="party-upload"] .quick-nav,
.app-shell[data-view="transfer-page"] .quick-nav {
  display: none;
}

.standalone-calibration-preview {
  color: #fff0bd;
}

.standalone-calibration-preview .standalone-calibration-copy {
  position: absolute;
  left: 50%;
  top: 48%;
  z-index: 2;
  display: grid;
  width: min(48%, 760px);
  gap: 10px;
  border: 1px solid rgba(235, 191, 98, 0.48);
  border-radius: 18px;
  padding: clamp(18px, 2.4cqw, 36px);
  background: rgba(5, 12, 11, 0.78);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36), inset 0 0 34px rgba(221, 167, 65, 0.05);
  text-align: center;
  transform: translate(-50%, -50%);
  backdrop-filter: blur(7px);
}

.standalone-calibration-copy > span {
  color: #d3a44b;
  font-size: clamp(10px, 0.78cqw, 14px);
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.standalone-calibration-copy h2,
.standalone-calibration-copy p {
  margin: 0;
}

.standalone-calibration-copy h2 {
  color: #ffe6aa;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 2.1cqw, 40px);
}

.standalone-calibration-copy p {
  color: rgba(255, 239, 196, 0.76);
  font-size: clamp(11px, 0.88cqw, 16px);
}

.standalone-calibration-card {
  display: grid;
  gap: 5px;
  margin-top: 7px;
  border: 1px dashed rgba(244, 201, 111, 0.58);
  border-radius: 13px;
  padding: clamp(15px, 2cqw, 28px);
  background: radial-gradient(circle, rgba(160, 99, 27, 0.2), rgba(255, 255, 255, 0.025));
}

.standalone-calibration-card small {
  color: rgba(255, 239, 196, 0.68);
}

.app-shell.calibrating .standalone-calibration-preview .compass-needle-effect,
.app-shell.calibrating .standalone-calibration-preview .practical-light {
  pointer-events: auto;
}

.standalone-calibration-preview .standalone-home-label {
  position: absolute;
  z-index: 24;
  display: block;
  overflow: visible;
  color: #321b0c;
  filter: drop-shadow(0 7px 9px rgba(0, 0, 0, 0.42));
  pointer-events: none;
}

.standalone-calibration-preview .standalone-home-label > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  clip-path: inset(var(--quick-nav-rope-crop, 0%) 0 0 0);
  pointer-events: none;
}

.standalone-calibration-preview .standalone-home-action {
  position: absolute;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: visible;
  color: #321b0c;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--overlay-font-size, 0.72cqw);
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(255, 235, 173, 0.72);
  pointer-events: none;
}

.standalone-calibration-preview .standalone-home-action b,
.standalone-calibration-preview .standalone-home-action i {
  display: block;
  font-style: normal;
  line-height: inherit;
}

.standalone-calibration-preview .standalone-home-action b {
  font-size: 1.18em;
}

.app-shell.calibrating .standalone-calibration-preview .standalone-home-label,
.app-shell.calibrating .standalone-calibration-preview .standalone-home-action {
  pointer-events: auto;
}
/* v189 : aperçu et calibrage individuel des coordonnées de virement. */
.standalone-calibration-transfer-field {
  position: absolute;
  z-index: 20;
  display: grid;
  align-content: center;
  gap: 0.22em;
  box-sizing: border-box;
  overflow: hidden;
  border: 1px solid rgba(235, 191, 98, 0.5);
  border-radius: 10px;
  padding: 0.55cqw 0.8cqw;
  background: rgba(5, 12, 11, 0.84);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.32);
  color: #fff3cb;
  font-size: var(--overlay-font-size, 1.05cqw);
  line-height: var(--overlay-line-height, 1.15);
  pointer-events: none;
  text-align: left;
}

.standalone-calibration-transfer-field small {
  color: #d3a44b;
  font-size: 0.68em;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.standalone-calibration-transfer-field strong {
  overflow: hidden;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 1em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell.calibrating .standalone-calibration-transfer-field {
  pointer-events: auto;
}
/* v191 : aperçu minimal des pages serveur */
#transfer-page .standalone-calibration-transfer-field {
  display: flex;
  align-items: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  padding: 18px;
  background: transparent;
  box-shadow: none;
  color: #2b180d;
  text-shadow: 0 1px 1px rgba(255, 240, 196, 0.48);
}

#transfer-page .standalone-calibration-transfer-field strong {
  width: 100%;
  overflow: visible;
  color: inherit;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  font-weight: 700;
  text-overflow: clip;
  white-space: nowrap;
}

#party-upload .party-upload-drop-surface {
  position: absolute;
  z-index: 20;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  min-width: 120px;
  min-height: 80px;
  overflow: visible;
  border: 2px solid rgba(255, 213, 111, 0.94);
  border-radius: var(--overlay-radius, 22px);
  background: rgba(5, 12, 11, 0.08);
  box-shadow:
    0 0 10px rgba(255, 194, 69, 0.88),
    0 0 28px rgba(255, 167, 32, 0.58),
    inset 0 0 18px rgba(255, 208, 102, 0.2);
  animation: party-upload-preview-glow 2.4s ease-in-out infinite;
  pointer-events: none;
}

#party-upload .upload-drop-preview-plus {
  color: rgba(255, 231, 169, 0.9);
  font-size: clamp(24px, 4cqw, 64px);
  font-weight: 300;
  line-height: 1;
  text-shadow: 0 0 12px rgba(255, 194, 69, 0.9);
}

.app-shell.calibrating #party-upload .party-upload-drop-zone {
  pointer-events: auto;
}

@keyframes party-upload-preview-glow {
  0%, 100% { filter: brightness(0.92); }
  50% { filter: brightness(1.18); }
}
/* v192 : position du signe + et aide clavier */
#party-upload .party-upload-drop-plus {
  position: absolute;
  z-index: 2;
  display: grid;
  box-sizing: border-box;
  place-items: center;
  margin: 0;
  pointer-events: auto;
}

.public-page-help-keyboard {
  margin: 22px 0 0;
  border-top: 1px solid rgba(91, 51, 20, 0.28);
  padding-top: 15px;
  color: rgba(63, 39, 20, 0.78);
  font-size: 0.9rem;
  line-height: 1.5;
}

.public-page-help-keyboard kbd {
  border: 1px solid rgba(91, 51, 20, 0.42);
  border-bottom-width: 2px;
  border-radius: 5px;
  padding: 1px 6px;
  background: rgba(255, 245, 210, 0.5);
  font-family: inherit;
  font-weight: 900;
}

/* v192 : navigation Accueil seule pour la page Dépôt soirée */
#navigationLabelSettings.is-home-only [data-open-navigation-calibration="quickNavigationBack"],
#navigationLabelSettings.is-home-only .navigation-label-editor-grid fieldset:last-child {
  display: none;
}


/* v195 : refonte visuelle de la gestion Audio */
.page-audio-settings {
  gap: 22px;
}
.audio-master-settings {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 18px;
  border-color: rgba(45, 117, 106, 0.28);
  border-radius: 16px;
  padding: 18px;
  background: linear-gradient(135deg, rgba(240, 247, 244, 0.98), rgba(250, 246, 234, 0.92));
  box-shadow: 0 10px 26px rgba(37, 73, 66, 0.08);
}
.audio-master-settings > .admin-switch,
.audio-master-settings > .audio-help-note {
  grid-column: 1 / -1;
}
.audio-master-settings > button {
  grid-column: 3;
  justify-self: end;
  min-width: 170px;
}
.page-audio-settings h4 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 4px 0 -6px;
  font-size: 18px;
}
.page-audio-settings h4::before {
  content: "♫";
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, #2f786d, #1f514a);
  color: #fff7d6;
  box-shadow: 0 5px 12px rgba(31, 81, 74, 0.2);
}
.page-audio-settings h4:nth-of-type(2)::before {
  content: "✦";
  background: linear-gradient(145deg, #c08c34, #7e5720);
}
.page-audio-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.page-audio-row {
  gap: 14px;
  overflow: hidden;
  border: 1px solid rgba(45, 117, 106, 0.24);
  border-left: 5px solid #2d756a;
  border-radius: 15px;
  padding: 16px;
  background: linear-gradient(155deg, rgba(255,255,255,0.98), rgba(243,248,246,0.92));
  box-shadow: 0 8px 20px rgba(26, 65, 59, 0.07);
}
.page-audio-row > div:first-child {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: center;
  border-bottom: 1px solid rgba(45, 117, 106, 0.13);
  padding-bottom: 11px;
}
.page-audio-row > div:first-child strong {
  color: #183a35;
  font-size: 17px;
}
.page-audio-row > div:first-child span {
  border-radius: 999px;
  padding: 4px 9px;
  background: rgba(45, 117, 106, 0.1);
  color: #42645e;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.page-audio-row .audio-volume-control {
  grid-template-columns: minmax(115px, 0.7fr) minmax(160px, 1.5fr) 66px;
  gap: 10px;
  font-size: 13px;
}
.page-audio-row input[type="range"] {
  width: 100%;
  min-width: 0;
  accent-color: #2d756a;
}
.page-audio-row input[type="number"] {
  width: 66px;
  min-width: 0;
}
.page-audio-row input[type="file"],
.page-audio-row select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 42px;
  border: 1px solid rgba(45, 117, 106, 0.3);
  border-radius: 9px;
  background: rgba(255,255,255,0.9);
  color: #233d38;
}
.page-audio-row input[type="file"] {
  padding: 5px;
  font-size: 12px;
}
.page-audio-row input[type="file"]::file-selector-button {
  min-height: 30px;
  margin-right: 10px;
  border: 0;
  border-radius: 7px;
  padding: 0 12px;
  background: #285f57;
  color: white;
  font-weight: 800;
}
.page-audio-row select {
  padding: 0 34px 0 11px;
  text-overflow: ellipsis;
}
.page-audio-playlist {
  gap: 8px;
}
.page-audio-playlist li {
  min-width: 0;
  border: 1px solid rgba(45, 117, 106, 0.12);
  padding: 8px 9px;
  background: rgba(45, 117, 106, 0.07);
}
.page-audio-playlist li span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.page-audio-playlist button {
  border-color: rgba(164, 63, 48, 0.3);
  background: rgba(255, 244, 241, 0.96);
  color: #8f3026;
}
.sound-effect-grid .page-audio-row {
  border-left-color: #bd8d34;
  background: linear-gradient(155deg, rgba(255,255,255,0.98), rgba(252,248,235,0.93));
}
@media (max-width: 1050px) {
  .page-audio-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .audio-master-settings { grid-template-columns: 1fr; }
  .audio-master-settings > button { grid-column: 1; justify-self: stretch; }
  .page-audio-row .audio-volume-control { grid-template-columns: 1fr; }
}


/* v200 : réglages, ordre et préécoute par morceau */
.page-audio-playlist {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.page-audio-playlist li.page-audio-track {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  border: 1px solid rgba(45, 117, 106, 0.18);
  border-radius: 11px;
  padding: 10px;
  background: rgba(45, 117, 106, 0.065);
}
.page-audio-track-main {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.page-audio-playlist li .page-audio-track-title {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #294c46;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.page-audio-track-title b {
  color: #1f665b;
}
.page-audio-track-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
}
.page-audio-playlist .page-audio-track-actions button {
  display: inline-grid;
  min-width: 32px;
  min-height: 32px;
  place-items: center;
  border: 1px solid rgba(45, 117, 106, 0.28);
  border-radius: 8px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.9);
  color: #285f57;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
}
.page-audio-playlist .audio-preview-button {
  border-radius: 999px;
  background: linear-gradient(145deg, #347f73, #245950);
  color: #fff7d6;
}
.page-audio-playlist .audio-preview-button.is-playing {
  border-color: #9b681d;
  background: linear-gradient(145deg, #d7a84c, #9c681f);
  color: #241405;
  box-shadow: 0 0 0 3px rgba(211, 161, 70, 0.18);
}
.page-audio-playlist .audio-order-button:disabled {
  cursor: default;
  opacity: 0.28;
}
.page-audio-playlist .page-audio-track-actions .audio-remove-button {
  min-width: 64px;
  border-color: rgba(164, 63, 48, 0.3);
  background: rgba(255, 244, 241, 0.96);
  color: #8f3026;
}
.page-audio-track-gain-control {
  display: grid !important;
  grid-template-columns: minmax(120px, 0.75fr) minmax(150px, 1.5fr) 66px !important;
  gap: 9px !important;
  align-items: center;
  margin: 0;
  color: #365b54;
}
.page-audio-track-gain-control > span {
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  white-space: normal;
}
@media (max-width: 760px) {
  .page-audio-track-main {
    align-items: flex-start;
    flex-direction: column;
  }
  .page-audio-track-actions {
    width: 100%;
    flex-wrap: wrap;
  }
  .page-audio-track-gain-control {
    grid-template-columns: 1fr 66px !important;
  }
  .page-audio-track-gain-control > span {
    grid-column: 1 / -1;
  }
}
/* v195 : aperçu calibrable de la Galerie soirée */
.party-gallery-calibration-preview {
  overflow: hidden;
  color: #fff0bd;
  background: linear-gradient(145deg, rgba(2,8,7,0.35), rgba(18,10,4,0.28)), var(--screen-bg);
  background-position: center;
  background-size: cover;
}
.party-gallery-calibration-header,
.party-gallery-calibration-stage {
  position: absolute;
}
.party-gallery-calibration-header {
  display: grid;
  place-content: center;
  text-align: center;
}
.party-gallery-calibration-header p,
.party-gallery-calibration-header h2,
.party-gallery-calibration-header small {
  margin: 0;
}
.party-gallery-calibration-header p {
  color: #dcae56;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.party-gallery-calibration-header h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 2.7vw, 44px);
}
.party-gallery-calibration-stage {
  overflow: hidden;
  border: 1px solid rgba(232,188,94,0.28);
  background: rgba(5,9,8,0.3);
}
.party-gallery-calibration-masonry {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 32%;
  gap: 8px;
  height: 88%;
  padding: 10px;
}
.party-gallery-calibration-masonry i {
  border: 1px solid rgba(239,197,107,0.4);
  border-radius: 6px;
  background: linear-gradient(145deg, rgba(216,168,75,0.5), rgba(26,67,64,0.65));
}
.party-gallery-calibration-masonry i:nth-child(3n) {
  grid-row: span 2;
}
.party-gallery-calibration-preview .party-gallery-pagination {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
}
.party-gallery-calibration-preview .party-gallery-pagination button {
  min-height: 28px;
  border: 1px solid rgba(226,180,91,0.72);
  border-radius: 999px;
  background: rgba(42,26,12,0.9);
  color: #ffe4a4;
}

/* v203 : réglage public du volume musical. */
.public-volume-control {
  position: relative;
  display: grid;
  flex: 0 0 42px;
}

.page-audio-player .public-volume-button svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-audio-player .public-volume-button .speaker-wave {
  fill: none;
  transition: opacity 160ms ease;
}

.page-audio-player .public-volume-button.is-muted .speaker-wave {
  opacity: 0.18;
}

.public-volume-slider-panel {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: calc(100% + 10px);
  display: grid;
  width: 58px;
  min-height: 164px;
  grid-template-rows: auto 1fr auto;
  justify-items: center;
  gap: 7px;
  border: 1px solid rgba(255, 226, 164, 0.72);
  border-radius: 18px;
  padding: 10px 7px 9px;
  background: rgba(3, 8, 10, 0.94);
  color: #fff0b2;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.48), 0 0 18px rgba(220, 164, 54, 0.22);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 8px) scale(0.98);
  transform-origin: 50% 100%;
  transition: opacity 150ms ease, transform 150ms ease, visibility 150ms;
}

.public-volume-slider-panel::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 12px;
}

.public-volume-slider-panel::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  border: 6px solid transparent;
  border-top-color: rgba(255, 226, 164, 0.72);
  transform: translateX(-50%);
}

.public-volume-control:hover .public-volume-slider-panel,
.public-volume-control:focus-within .public-volume-slider-panel,
.public-volume-control.is-open .public-volume-slider-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0) scale(1);
}

.public-volume-slider-panel b,
.public-volume-slider-panel output {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.public-volume-slider-rail {
  position: relative;
  display: block !important;
  width: 28px;
  height: 108px;
  overflow: visible !important;
}

.public-volume-slider-rail input {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 102px;
  height: 24px;
  margin: 0;
  accent-color: #e0aa4d;
  cursor: pointer;
  transform: translate(-50%, -50%) rotate(-90deg);
}
/* v204 : glisser-déposer des playlists audio dans l’administration. */
.page-audio-track-main .audio-drag-handle {
  display: grid;
  width: 30px;
  height: 34px;
  flex: 0 0 30px;
  place-items: center;
  border: 1px dashed rgba(45, 117, 106, 0.42);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: #2d756a;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -4px;
  line-height: 1;
  cursor: grab;
  user-select: none;
  -webkit-user-drag: element;
}

.page-audio-playlist li:only-child .audio-drag-handle {
  opacity: 0.28;
  cursor: default;
  pointer-events: none;
}

.page-audio-track-main .audio-drag-handle:hover {
  border-color: #9b681d;
  background: #fff8e5;
  color: #805015;
}

.page-audio-track-main .audio-drag-handle:active {
  cursor: grabbing;
}

.page-audio-track-main .page-audio-track-title {
  flex: 1 1 auto;
}

.page-audio-playlist li.page-audio-track.is-dragging {
  opacity: 0.42;
  transform: scale(0.985);
}

.page-audio-playlist li.page-audio-track.is-drop-before {
  box-shadow: inset 0 4px 0 #d3a343, 0 0 0 2px rgba(211, 163, 67, 0.12);
}

.page-audio-playlist li.page-audio-track.is-drop-after {
  box-shadow: inset 0 -4px 0 #d3a343, 0 0 0 2px rgba(211, 163, 67, 0.12);
}

.page-audio-playlist.is-drag-over {
  border-radius: 12px;
  outline: 1px dashed rgba(155, 104, 29, 0.32);
  outline-offset: 4px;
}
/* v206 : textes de remerciement administrables et nettoyage sélectif des données. */
#admin .gift-followup-admin-settings {
  margin-top: 18px;
  border: 1px solid #cbd5d1;
  border-radius: 12px;
  padding: 12px;
  background: #fbfdfc;
}

#admin .gift-followup-admin-settings > summary {
  cursor: pointer;
  color: #173f36;
  font-weight: 800;
}

#admin .gift-followup-admin-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0;
}

#admin .gift-followup-admin-grid label {
  display: grid;
  align-content: start;
  gap: 6px;
  color: #344d47;
  font-weight: 700;
}

#admin .gift-followup-admin-grid .wide {
  grid-column: 1 / -1;
}

#admin .records-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
}

#admin .records-actions label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-right: auto;
  font-weight: 700;
}

#admin .records-actions .danger,
#admin #deleteSelectedRecords:not(:disabled) {
  border-color: #d92d20;
  color: #9f1f17;
  background: #fff4f2;
}

#admin .records-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

#admin .records-status {
  min-height: 1.35em;
  margin: 6px 0 10px;
  color: #475467;
  font-weight: 700;
}

#admin .record-row-selectable {
  grid-template-columns: 28px 155px 140px minmax(0, 1fr);
  align-items: center;
  cursor: pointer;
}

#admin .record-row-selectable:hover {
  background: #f6f9f8;
}

#admin .record-row-selectable > input {
  width: 18px;
  height: 18px;
  margin: 0;
}

@media (max-width: 760px) {
  #admin .gift-followup-admin-grid {
    grid-template-columns: 1fr;
  }

  #admin .gift-followup-admin-grid .wide {
    grid-column: auto;
  }

  #admin .record-row-selectable {
    grid-template-columns: 26px 1fr;
  }

  #admin .record-row-selectable > span,
  #admin .record-row-selectable > b {
    grid-column: 2;
  }
}
/* v207 : espacement uniforme des commandes publiques. */
.public-utility-controls {
  --public-control-gap: 8px;
  gap: var(--public-control-gap);
}

.public-utility-controls .page-audio-player {
  gap: var(--public-control-gap);
}

@media (max-width: 520px) {
  .public-utility-controls {
    --public-control-gap: 6px;
  }
}
/* v208 : aperçu admin dédié à la traînée de l'avion cadeau. */
#admin .gift-trail-preview-card {
  margin-top: 1rem;
  padding: 0.9rem;
  border: 1px solid rgba(24, 60, 53, 0.18);
  border-radius: 12px;
  background: rgba(255, 250, 238, 0.76);
}

#admin .gift-trail-preview-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.7rem;
}

#admin .gift-trail-preview-heading > span {
  display: grid;
  gap: 0.18rem;
}

#admin .gift-trail-preview-heading strong {
  color: #173f38;
  font-size: 1rem;
}

#admin .gift-trail-preview-heading small,
#admin .gift-trail-preview-status {
  color: #61726e;
  line-height: 1.35;
}

#admin .gift-trail-admin-preview {
  --gift-trail-preview-rgb: 255, 209, 116;
  --gift-trail-preview-opacity: 0.64;
  --gift-trail-preview-duration: 2.4s;
  --gift-trail-preview-shadow: 0.4;
  position: relative;
  min-height: 180px;
  overflow: hidden;
  border: 1px solid rgba(207, 155, 64, 0.38);
  border-radius: 11px;
  background:
    radial-gradient(circle at 18% 72%, rgba(var(--gift-trail-preview-rgb), 0.12), transparent 26%),
    radial-gradient(circle at 80% 18%, rgba(255, 236, 174, 0.11), transparent 25%),
    linear-gradient(135deg, #101918, #2e2117 55%, #07100f);
  isolation: isolate;
}

#admin .gift-trail-admin-preview::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, transparent 0 11%, rgba(255, 255, 255, 0.025) 11.2% 11.4%);
  pointer-events: none;
}

#admin .gift-trail-admin-line {
  position: absolute;
  z-index: 1;
  left: 10%;
  top: 58%;
  width: 70%;
  border-top: 3px dotted rgba(var(--gift-trail-preview-rgb), 0.96);
  filter: drop-shadow(0 0 5px rgba(var(--gift-trail-preview-rgb), 0.88));
  opacity: 0;
  transform: rotate(-6deg) scaleX(0.08);
  transform-origin: left center;
}

#admin .gift-trail-admin-plane {
  position: absolute;
  z-index: 2;
  left: 7%;
  top: 34%;
  width: clamp(110px, 18%, 205px);
  aspect-ratio: 2.4 / 1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 0.7em 0.8em rgba(0, 0, 0, var(--gift-trail-preview-shadow))) drop-shadow(0 0 0.75em rgba(var(--gift-trail-preview-rgb), 0.22));
  opacity: 0;
}

#admin .gift-trail-admin-preview.is-replaying .gift-trail-admin-line {
  animation: gift-trail-admin-line-v208 var(--gift-trail-preview-duration) ease-out both;
}

#admin .gift-trail-admin-preview.is-replaying .gift-trail-admin-plane {
  animation: gift-trail-admin-plane-v208 var(--gift-trail-preview-duration) cubic-bezier(0.22, 0.68, 0.28, 1) both;
}

#admin .gift-trail-admin-preview.is-disabled .gift-trail-admin-line,
#admin .gift-trail-admin-preview.is-disabled .gift-trail-admin-plane {
  animation: none;
  opacity: 0.16;
  filter: grayscale(1);
}

#admin .gift-trail-preview-status {
  min-height: 1.2em;
  margin: 0.55rem 0 0;
  font-size: 0.82rem;
}

@keyframes gift-trail-admin-line-v208 {
  0% { opacity: 0; transform: rotate(-6deg) scaleX(0.05); }
  16% { opacity: var(--gift-trail-preview-opacity); transform: rotate(-6deg) scaleX(0.15); }
  78% { opacity: var(--gift-trail-preview-opacity); transform: rotate(-6deg) scaleX(1); }
  100% { opacity: 0; transform: rotate(-6deg) scaleX(1.08) translateX(3%); }
}

@keyframes gift-trail-admin-plane-v208 {
  0% { opacity: 0; transform: translate3d(0, 13%, 0) rotate(-5deg) scale(0.9); }
  12% { opacity: 1; }
  82% { opacity: 1; transform: translate3d(360%, -18%, 0) rotate(-6deg) scale(1.06); }
  100% { opacity: 0; transform: translate3d(430%, -26%, 0) rotate(-7deg) scale(1.12); }
}

@media (max-width: 620px) {
  #admin .gift-trail-preview-heading {
    align-items: stretch;
    flex-direction: column;
  }

  #admin .gift-trail-admin-preview {
    min-height: 145px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #admin .gift-trail-admin-preview.is-replaying .gift-trail-admin-line,
  #admin .gift-trail-admin-preview.is-replaying .gift-trail-admin-plane {
    animation-duration: 0.01ms;
  }
}
/* v209 : onglet actif sans soulignement pour les galeries 30 ans et 20 ans. */
#galerie-50 .gallery-filter-tabs button.active,
#galerie-20ans .gallery-filter-tabs button.active {
  color: #e6aa4a;
  font-weight: 900;
  text-decoration: none;
  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.92),
    0 0 0.55em rgba(230, 170, 74, 0.42);
}

#galerie-50 .gallery-filter-tabs button.active:hover,
#galerie-50 .gallery-filter-tabs button.active:focus-visible,
#galerie-20ans .gallery-filter-tabs button.active:hover,
#galerie-20ans .gallery-filter-tabs button.active:focus-visible {
  text-decoration: none;
}
/* v210 : aperçu des éléments post-validation dans le calibrage cadeau. */
.app-shell.calibrating #contribution .gift-stage-message[data-gift-calibration-preview] {
  visibility: visible !important;
  opacity: 1 !important;
  animation: none !important;
  pointer-events: auto !important;
}

.app-shell.calibrating #contribution .gift-qrcode[data-gift-calibration-preview] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  background-color: #fffaf0;
  background-image:
    conic-gradient(from 90deg at 22% 22%, #17120d 0 25%, transparent 0 50%, #17120d 0 75%, transparent 0),
    conic-gradient(from 180deg at 72% 28%, #17120d 0 25%, transparent 0 50%, #17120d 0 75%, transparent 0),
    repeating-conic-gradient(#17120d 0 25%, transparent 0 50%);
  background-position: center;
  background-size: 34% 34%, 29% 29%, 13% 13%;
  border: 0.25em solid #fffaf0;
  box-shadow: 0 0 0 1px rgba(97, 67, 28, 0.5), 0 0 1em rgba(255, 218, 128, 0.42);
  pointer-events: auto !important;
}
/* v211 : centre import sécurisé et détourage Studio local. */
.destructive-import-zone {
  margin-top: 1.25rem;
  border: 1px solid rgba(180, 35, 24, 0.34);
  border-radius: 10px;
  padding: 0.85rem;
  background: #fff8f6;
}

.destructive-import-zone > summary {
  cursor: pointer;
  color: #8f251d;
  font-weight: 900;
}

.destructive-import-warning {
  margin: 0.85rem 0;
  border-left: 4px solid #d92d20;
  padding: 0.65rem 0.8rem;
  background: #fff1ef;
  color: #6f241e;
}

.destructive-import-warning p {
  margin: 0.25rem 0 0;
}

.destructive-import-zone > label {
  display: grid;
  gap: 0.35rem;
  margin: 0.7rem 0;
  color: #4d302c;
  font-weight: 800;
}

.destructive-import-zone .destructive-import-check {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
}

.destructive-import-check input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 0.12rem;
}

.destructive-import-status {
  min-height: 1.3em;
  color: #8f251d;
  font-weight: 800;
}

.destructive-import-status.is-unlocked {
  color: #176448;
}

.destructive-import-zone .backup-restore-list {
  margin-top: 0.85rem;
}

.destructive-import-zone button:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

#studioSegmentationCanvas {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  background: #050505;
}

#studioSegmentationCanvas[hidden] {
  display: none;
}

.studio-camera-stage.segmentation-active #cameraPreview {
  visibility: hidden;
}

.studio-camera-stage.segmentation-active #studioSegmentationCanvas {
  display: block;
}

.studio-segmentation-state {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: 3%;
  max-width: 82%;
  margin: 0;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 218, 132, 0.38);
  border-radius: 999px;
  padding: 0.45em 0.8em;
  background: rgba(8, 12, 12, 0.78);
  color: #ffe4a5;
  font-size: clamp(10px, 0.72cqw, 14px);
  line-height: 1.25;
  text-align: center;
  pointer-events: none;
}

.studio-segmentation-state.error {
  border-color: rgba(255, 137, 112, 0.58);
  color: #ffd2c9;
}

.studio-segmentation-admin-settings {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(220px, 0.7fr);
  gap: 0.7rem 1rem;
  margin-top: 0.85rem;
  border: 1px solid #ccd9d6;
  border-radius: 9px;
  padding: 0.8rem;
  background: #f7faf9;
}

.studio-segmentation-admin-settings > label {
  display: grid;
  gap: 0.35rem;
  color: #29443e;
  font-weight: 800;
}

.studio-segmentation-admin-settings .admin-switch {
  display: flex;
  align-items: center;
}

.studio-segmentation-admin-settings .studio-camera-source-status,
.studio-segmentation-admin-settings > small {
  grid-column: 1 / -1;
  margin: 0;
}
.studio-segmentation-profile-select {
  grid-column: 1 / -1;
}

.studio-segmentation-profile-select select {
  min-height: 44px;
  border: 1px solid #8fac9f;
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  color: #173f38;
  background: #fff;
  font-weight: 900;
}

.studio-segmentation-profile-summary,
.studio-segmentation-manual-settings {
  grid-column: 1 / -1;
  border: 1px solid rgba(36, 113, 92, 0.28);
  border-left: 5px solid #287c68;
  border-radius: 9px;
  padding: 0.85rem;
  background: linear-gradient(135deg, rgba(225, 245, 238, 0.82), rgba(255, 255, 255, 0.92));
}

.studio-segmentation-profile-summary[data-profile="quality"] {
  border-left-color: #b87919;
  background: linear-gradient(135deg, rgba(255, 240, 203, 0.82), rgba(255, 255, 255, 0.94));
}

.studio-segmentation-profile-summary[data-profile="performance"] {
  border-left-color: #4775a8;
  background: linear-gradient(135deg, rgba(226, 238, 251, 0.86), rgba(255, 255, 255, 0.94));
}

.studio-segmentation-profile-summary strong {
  color: #173f38;
  font-size: 1.02rem;
}

.studio-segmentation-profile-summary p {
  margin: 0.25rem 0 0.7rem;
  color: #586c66;
  line-height: 1.4;
}

.studio-segmentation-profile-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.studio-segmentation-profile-metrics span {
  border: 1px solid rgba(47, 104, 89, 0.22);
  border-radius: 999px;
  padding: 0.3rem 0.58rem;
  color: #315d52;
  background: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
  font-weight: 800;
}

.studio-segmentation-manual-settings {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 0.8rem 1rem;
  border-left-color: #7c5c8f;
  background: linear-gradient(135deg, rgba(242, 235, 247, 0.84), rgba(255, 255, 255, 0.94));
}

.studio-segmentation-manual-settings label {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.35rem 0.65rem;
  align-items: center;
  color: #3f3847;
  font-weight: 800;
}

.studio-segmentation-manual-settings label > :is(input, select) {
  grid-column: 1 / -1;
}

.studio-segmentation-manual-settings output {
  min-width: 4.6rem;
  color: #705480;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.studio-segmentation-manual-settings input[type="range"] {
  width: 100%;
  accent-color: #6e4f7e;
}

.studio-camera-image-status {
  border-left: 3px solid #3a806e;
  padding-left: 0.65rem;
  color: #42685f;
}

@media (max-width: 760px) {
  .studio-segmentation-admin-settings,
  .studio-segmentation-manual-settings {
    grid-template-columns: 1fr;
  }
}

/* v213 : palette harmonisée et aucun soulignement pour les onglets publics. */
.gallery-filter-tabs button {
  color: var(--gallery-tab-color, rgba(221, 191, 126, 0.82));
  text-decoration: none !important;
  transition: color 160ms ease, text-shadow 160ms ease;
}

.gallery-filter-tabs button:hover {
  color: var(--gallery-tab-hover-color, #f2d38d);
  text-decoration: none !important;
  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.92),
    0 0 0.42em rgba(223, 177, 83, 0.28);
}

.gallery-filter-tabs button:focus-visible {
  color: var(--gallery-tab-hover-color, #f2d38d);
  text-decoration: none !important;
  outline: 1px solid rgba(242, 211, 141, 0.72);
  outline-offset: 0.16em;
}

.gallery-filter-tabs button.active,
#galerie-50 .gallery-filter-tabs button.active,
#galerie-20ans .gallery-filter-tabs button.active {
  color: var(--gallery-tab-active-color, #ffe9b0) !important;
  font-weight: 900;
  text-decoration: none !important;
  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.94),
    0 0 0.58em rgba(231, 184, 88, 0.46);
}

.gallery-filter-tabs button.active:hover,
.gallery-filter-tabs button.active:focus-visible {
  color: var(--gallery-tab-active-hover-color, #fff3ca) !important;
  text-decoration: none !important;
}

/* v224 : visionneuse contenue dans la hauteur réellement visible. */
.media-viewer {
  position: fixed;
  inset: 0;
  width: 100vw;
  width: 100dvw;
  height: 100vh;
  height: 100dvh;
  max-width: 100vw;
  max-width: 100dvw;
  max-height: 100vh;
  max-height: 100dvh;
  overflow: hidden;
  overscroll-behavior: contain;
}

#mediaViewerContent {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

#mediaViewerContent > img,
#mediaViewerContent > video {
  max-width: 100%;
  max-height: 100%;
  max-block-size: calc(100dvh - 122px);
  object-fit: contain;
}

/* v225 : titre des cartes centré dans sa zone de calibrage. */
.experience-viewer.is-memory-card .memory-card-title {
  display: flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  padding: 0.08em 0.2em;
  overflow: hidden;
  text-align: center;
  text-wrap: balance;
}

.remote-secure-url {
  cursor: pointer;
  text-align: center;
  font-weight: 900;
}

/* v230 : suivi détaillé des imports. */
.import-progress-panel {
  display: grid;
  gap: 0.65rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(39, 83, 72, 0.3);
  border-left: 5px solid #b47b22;
  border-radius: 12px;
  background: linear-gradient(145deg, #fbfaf4, #eef5f1);
  box-shadow: 0 10px 28px rgba(26, 53, 47, 0.1);
}

.import-progress-panel[hidden] {
  display: none !important;
}

.import-progress-panel[data-state="success"] {
  border-left-color: #2f7a5f;
}

.import-progress-panel[data-state="warning"] {
  border-left-color: #c18422;
}

.import-progress-panel[data-state="error"] {
  border-left-color: #b3342c;
  background: linear-gradient(145deg, #fff9f7, #faece9);
}

.import-progress-heading,
.import-progress-metrics {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.import-progress-heading strong {
  color: #203f38;
  font-size: 1.05rem;
}

#importProgressPercent {
  min-width: 4.5rem;
  color: #6c4813;
  font-weight: 900;
  text-align: right;
}

#importProgressBar {
  width: 100%;
  height: 1.1rem;
  accent-color: #b47b22;
}

.import-progress-panel[data-state="success"] #importProgressBar {
  accent-color: #2f7a5f;
}

#importProgressDetail {
  min-height: 1.4em;
  margin: 0;
  color: #304f47;
  font-weight: 700;
}

.import-progress-metrics {
  justify-content: flex-start;
  color: #60736e;
  font-size: 0.88rem;
}

.import-progress-metrics span {
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
}

#importProgressCount {
  margin-right: auto;
}

#importProgressEta {
  font-weight: 800;
}

#dismissImportProgress {
  justify-self: end;
  width: auto;
  min-width: 9rem;
}
/* v235 : apparence administrable des onglets, sablier différé et appel caméra visible. */
.gallery-loading-state[hidden] {
  display: none !important;
}

.gallery-filter-tabs button {
  font-family: var(--gallery-tab-font-family, Georgia, "Times New Roman", serif);
  font-style: var(--gallery-tab-font-style, normal);
  font-weight: var(--gallery-tab-normal-weight, 700);
  letter-spacing: var(--gallery-tab-letter-spacing, 0);
  text-transform: var(--gallery-tab-text-transform, none);
  color: var(--gallery-tab-color, #ddbf7e);
  text-decoration-line: var(--gallery-tab-normal-decoration, none) !important;
  text-decoration-thickness: 0.12em;
  text-underline-offset: 0.28em;
  scale: 1;
  transition: color 160ms ease, text-shadow 160ms ease, scale 160ms ease;
}

.gallery-filter-tabs button:hover,
.gallery-filter-tabs button:focus-visible {
  color: var(--gallery-tab-hover-color, #f2d38d);
  font-style: var(--gallery-tab-hover-style, normal);
  font-weight: var(--gallery-tab-hover-weight, 800);
  text-decoration-line: var(--gallery-tab-hover-decoration, none) !important;
  scale: var(--gallery-tab-hover-scale, 1.03);
}

.gallery-filter-tabs button.active,
#galerie-50 .gallery-filter-tabs button.active,
#galerie-20ans .gallery-filter-tabs button.active {
  color: var(--gallery-tab-active-color, #ffe9b0) !important;
  font-style: var(--gallery-tab-active-style, normal);
  font-weight: var(--gallery-tab-active-weight, 900);
  text-decoration-line: var(--gallery-tab-active-decoration, none) !important;
  scale: 1;
}

.gallery-filter-tabs button.active:hover,
.gallery-filter-tabs button.active:focus-visible {
  color: var(--gallery-tab-active-color, #ffe9b0) !important;
  font-style: var(--gallery-tab-active-style, normal);
  font-weight: var(--gallery-tab-active-weight, 900);
  text-decoration-line: var(--gallery-tab-active-decoration, none) !important;
  scale: var(--gallery-tab-hover-scale, 1.03);
}

#admin .gallery-tab-style-settings {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 2px 0;
  border: 1px solid #d7dedb;
  border-radius: 7px;
  padding: 10px;
  background: rgba(239, 246, 243, 0.62);
}

#admin .gallery-tab-style-settings legend {
  padding: 0 6px;
  color: #244b44;
  font-size: 13px;
  font-weight: 900;
}

#studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not([hidden]) {
  border: 2px solid rgba(255, 210, 92, 0.92) !important;
  outline: 1px solid rgba(255, 242, 184, 0.72) !important;
  outline-offset: 3px;
  animation: studio-camera-awaiting-pulse 1.15s ease-in-out infinite;
}

@keyframes studio-camera-awaiting-pulse {
  0%, 100% {
    border-color: rgba(255, 210, 92, 0.55);
    box-shadow: 0 0 0 0 rgba(255, 201, 74, 0.08), 0 0 0.35em rgba(255, 205, 90, 0.25);
  }
  50% {
    border-color: #ffe49a;
    box-shadow: 0 0 0 0.42em rgba(255, 201, 74, 0.2), 0 0 1.2em rgba(255, 222, 124, 0.88);
  }
}

@media (max-width: 760px) {
  #admin .gallery-tab-style-settings {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  #studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not([hidden]) {
    animation: none;
    box-shadow: 0 0 0.8em rgba(255, 222, 124, 0.72);
  }
}

/* Étincelles de type bougie feu d'artifice, positionnables dans Calibrage. */
.sparkler-light {
  position: absolute;
  z-index: 18;
  display: block;
  overflow: visible;
  border: 0;
  background: transparent;
  mix-blend-mode: screen;
  pointer-events: none;
  isolation: isolate;
}
.sparkler-light::before,
.sparkler-light::after {
  position: absolute;
  left: 50%;
  content: "";
  pointer-events: none;
  transform-origin: 50% 100%;
}
.sparkler-light::before {
  bottom: 0;
  width: 9%;
  height: 82%;
  border-radius: 999px;
  background: linear-gradient(to top, rgba(130, 68, 15, 0.15), #ffb62e 42%, #fff9cf 76%, transparent 100%);
  box-shadow: 0 0 0.28em rgba(255, 184, 53, 0.78), 0 0 0.8em rgba(255, 134, 24, 0.42);
  animation: sparkler-stem 0.44s steps(2, end) infinite;
}
.sparkler-light::after {
  top: 0;
  width: 118%;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, #fffde2 0 5%, #ffd25d 8%, transparent 22%),
    repeating-conic-gradient(from 7deg, transparent 0 8deg, rgba(255, 245, 188, 0.92) 10deg 12deg, transparent 14deg 30deg);
  filter: drop-shadow(0 0 0.22em rgba(255, 203, 84, 0.95));
  animation: sparkler-burst-a 0.82s steps(5, end) infinite;
}
.sparkler-variant-b::after {
  width: 92%;
  background:
    radial-gradient(circle, #fff 0 7%, #ffe49b 10%, transparent 24%),
    repeating-conic-gradient(from 20deg, transparent 0 13deg, rgba(255, 255, 226, 0.95) 15deg 17deg, transparent 19deg 40deg);
  animation-name: sparkler-burst-b;
  animation-duration: 1.08s;
}
.sparkler-variant-c::after {
  width: 138%;
  background:
    radial-gradient(circle, #fffbd1 0 4%, #ffad2f 9%, transparent 21%),
    repeating-conic-gradient(from -8deg, transparent 0 6deg, rgba(255, 188, 69, 0.95) 8deg 11deg, transparent 13deg 25deg);
  animation-name: sparkler-burst-c;
  animation-duration: 0.68s;
}
@keyframes sparkler-stem {
  0%, 100% { opacity: 0.68; transform: translateX(-50%) rotate(-1deg) scaleY(0.94); }
  50% { opacity: 1; transform: translateX(-50%) rotate(1deg) scaleY(1.04); }
}
@keyframes sparkler-burst-a {
  0%, 100% { opacity: 0.38; transform: translate(-50%, -8%) rotate(0deg) scale(0.68); }
  45% { opacity: 1; transform: translate(-50%, -8%) rotate(17deg) scale(1.08); }
}
@keyframes sparkler-burst-b {
  0%, 100% { opacity: 0.28; transform: translate(-50%, -6%) rotate(0deg) scale(0.8); }
  62% { opacity: 0.96; transform: translate(-50%, -6%) rotate(-22deg) scale(1.16); }
}
@keyframes sparkler-burst-c {
  0%, 100% { opacity: 0.34; transform: translate(-50%, -10%) rotate(0deg) scale(0.62); }
  35% { opacity: 1; transform: translate(-50%, -10%) rotate(28deg) scale(1.14); }
  70% { opacity: 0.58; transform: translate(-50%, -10%) rotate(44deg) scale(0.88); }
}
/* Décalage stable des effets répétés v245. */
.compass-needle-effect::before,
.practical-light::before,
.sparkler-light::before {
  animation-delay: var(--effect-phase, 0s) !important;
}

.compass-needle-effect::after,
.practical-light::after,
.sparkler-light::after {
  animation-delay: calc(var(--effect-phase, 0s) - 0.37s) !important;
}
/* v246 : le calibrage des pages autonomes ne doit pas superposer
   l'étiquette globale à l'étiquette réellement utilisée par la page. */
.app-shell.calibrating[data-view="party-upload"] > .quick-nav,
.app-shell.calibrating[data-view="transfer-page"] > .quick-nav {
  display: none !important;
}
/* v260 : calibrage responsive, studio mobile et lecteurs vidéo adaptatifs. */
.participer-next-stop-label,
.participer-next-stop-name {
  position: absolute;
  z-index: 6;
  box-sizing: border-box;
  margin: 0;
  color: #2b1a0e;
  text-shadow: none;
  pointer-events: none;
}

.remote-gift-page .remote-gift-details {
  overflow: auto;
  padding: clamp(5px, 0.94cqw, 18px) !important;
  font-size: clamp(8px, 0.94cqw, 18px);
  line-height: 1.25;
}

.remote-gift-page .remote-gift-details strong {
  margin-bottom: clamp(3px, 0.52cqw, 10px);
  font-size: clamp(10px, 1.45cqw, 28px);
  line-height: 1.08;
}

.remote-gift-page .remote-gift-details p {
  margin: clamp(2px, 0.42cqw, 8px) 0;
  font-size: inherit;
}

.remote-gift-page .remote-gift-details a {
  font-size: inherit;
  overflow-wrap: anywhere;
}

#studio .studio-background-panel {
  padding: 3.333cqw 0.938cqw 0.833cqw !important;
}

#studio .studio-background-list {
  gap: 0.365cqw;
  margin-top: 0.469cqw;
}

#studio .studio-background-list article {
  border-radius: var(--responsive-radius-4, 4px);
}

#studio .studio-capture {
  display: grid;
  min-width: 0 !important;
  min-height: 0 !important;
  place-items: center;
  padding: 0 !important;
}

#studio .studio-capture img {
  max-width: 100%;
  max-height: 100%;
  object-position: center;
}

#studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not([hidden]),
#studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not([hidden]):hover,
#studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not([hidden]):focus-visible {
  animation: studio-camera-awaiting-pulse var(--studio-camera-blink-duration, 1.15s) ease-in-out infinite !important;
}

#studio:not(.hidden) .studio-camera-toggle.camera-awaiting.overlay-border-hidden:not([hidden]) {
  border: 0 !important;
  outline: 0 !important;
}

#studio:not(.hidden) .studio-camera-toggle.camera-awaiting:not(.overlay-border-hidden):not([hidden]) {
  border: var(--responsive-border-2, 2px) solid rgba(255, 210, 92, 0.92) !important;
  outline: var(--responsive-outline-1, 1px) solid rgba(255, 242, 184, 0.72) !important;
  outline-offset: var(--responsive-outline-offset, 3px);
}

#admin .studio-camera-activation-settings {
  display: grid;
  gap: 7px;
  margin: 10px 0;
  border: 1px solid #d7dedb;
  border-radius: 8px;
  padding: 11px;
  background: rgba(239, 246, 243, 0.7);
}

#admin .studio-camera-activation-settings label {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 7px 12px;
  align-items: center;
  color: #244b44;
  font-weight: 800;
}

#admin .studio-camera-activation-settings input {
  grid-column: 1 / -1;
  width: 100%;
}

#admin .studio-camera-activation-settings small {
  color: #61726e;
  line-height: 1.35;
}

.public-fullscreen-button,
.public-page-help-button,
.page-audio-player button {
  width: var(--public-control-size, 42px) !important;
  height: var(--public-control-size, 42px) !important;
  flex-basis: var(--public-control-size, 42px) !important;
}

.public-fullscreen-button {
  padding: clamp(5px, 0.47cqw, 9px);
}

.public-page-help-button > span {
  font-size: clamp(1rem, 1.2cqw, 1.45rem);
}

.page-audio-player button {
  font-size: clamp(14px, 1.04cqw, 20px);
}

.public-volume-control {
  flex-basis: var(--public-control-size, 42px);
}

.page-audio-player .public-volume-button svg {
  width: 52%;
  height: 52%;
}

.public-utility-controls {
  right: max(var(--public-control-inset, 18px), calc((100vw - var(--active-design-width)) / 2 + var(--public-control-inset, 18px)));
  bottom: max(var(--public-control-inset, 18px), calc((100vh - var(--active-design-height)) / 2 + var(--public-control-inset, 18px)));
  gap: var(--public-control-gap, 8px);
}

.public-utility-controls .page-audio-player {
  gap: var(--public-control-gap, 8px);
}

@media (max-width: 1200px), (max-height: 700px) {
  .detail-page-media .marriage-video-frame video {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }
}

@media (max-width: 760px) {
  #admin .studio-camera-activation-settings label {
    grid-template-columns: 1fr;
  }
}
/* v262 : contrainte réelle des vidéos dans les lecteurs sur petits écrans. */
.detail-page-media .marriage-video-player {
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  container-type: inline-size;
}

.detail-page-media .marriage-video-frame {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  contain: layout paint;
}

.detail-page-media .marriage-video-frame > video {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  box-sizing: border-box;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;
}

.marriage-video-controls,
.marriage-video-controls > *,
.video-timeline-control {
  min-width: 0;
  box-sizing: border-box;
}

.video-timeline-control {
  overflow: hidden;
}

@container (max-width: 900px) {
  .detail-page-media .marriage-video-frame > video {
    transform: none !important;
  }

  .marriage-video-controls {
    grid-template-columns: minmax(28px, 42px) minmax(28px, 42px) minmax(0, 1fr) minmax(62px, auto);
    gap: clamp(3px, 1cqi, 8px);
    min-height: 0;
    padding: clamp(4px, 1.2cqi, 8px);
  }

  .marriage-video-controls button {
    min-width: 0;
    height: clamp(28px, 7cqi, 36px);
    padding: 0;
  }

  .marriage-video-controls output {
    min-width: 0;
    font-size: clamp(9px, 2.5cqi, 12px);
    white-space: nowrap;
  }

  .marriage-video-controls .video-volume-control,
  .marriage-video-controls .video-speed-controls {
    grid-column: span 2;
  }
}

@media (pointer: coarse) {
  .detail-page-media .marriage-video-frame > video {
    transform: none !important;
  }
}

/* v263 : administration des contenus invites et moderation de la galerie soiree */
.guest-admin-toolbar,
.party-gallery-selection-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.guest-admin-toolbar p {
  flex: 1 1 420px;
  margin: 0;
}

.guest-content-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.party-gallery-selection-grid {
  display: block;
  margin-top: 14px;
}

.party-admin-subtabs {
  margin-bottom: 14px;
}

.party-admin-group {
  display: grid;
  gap: 12px;
}

.party-admin-group > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.party-admin-group > header h4 {
  margin: 0;
}

.party-admin-thumbnails {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 14px;
}

.party-selection-delete {
  width: 100%;
  margin-top: 4px;
  border-color: #d2473a;
  color: #9e2118;
  background: #fff3f0;
}

.party-selection-delete:hover {
  color: #fff;
  background: #d2473a;
}

.party-selection-delete:disabled {
  opacity: 0.6;
  cursor: wait;
}

.guest-media-card,
.party-selection-card,
.capsule-admin-card {
  min-width: 0;
  border: 1px solid rgba(35, 94, 79, 0.24);
  border-radius: 14px;
  padding: 10px;
  background: rgba(249, 248, 241, 0.9);
  color: #17221f;
}

.guest-media-card,
.party-selection-card {
  display: grid;
  align-content: start;
  gap: 7px;
}

.guest-media-card > strong,
.party-selection-card > strong,
.guest-media-card > small,
.party-selection-card > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.guest-media-preview {
  position: relative;
  display: grid;
  width: 100%;
  aspect-ratio: 4 / 3;
  place-items: center;
  overflow: hidden;
  border-radius: 9px;
  background: #111816;
}

.guest-media-preview::before {
  position: absolute;
  width: 26px;
  height: 26px;
  border: 3px solid rgba(232, 208, 154, 0.22);
  border-top-color: #e8d09a;
  border-radius: 50%;
  content: "";
  animation: gallery-admin-thumbnail-spin 0.8s linear infinite;
}

.guest-media-preview.is-loaded::before,
.guest-media-preview.is-load-error::before,
.guest-media-preview:has(video)::before,
.guest-media-preview:has(audio)::before,
.guest-media-preview:has(.guest-media-placeholder)::before {
  display: none;
}

.guest-media-preview.is-load-error::after {
  position: absolute;
  inset: 10px;
  display: grid;
  place-items: center;
  content: "Aperçu indisponible";
  color: #e8d09a;
  font-size: 0.86rem;
  line-height: 1.2;
  text-align: center;
}

.guest-media-preview > img,
.guest-media-preview > video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.guest-media-preview > audio {
  width: calc(100% - 20px);
}

.guest-media-placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  padding: 12px;
  color: #e8d09a;
  text-align: center;
}

.guest-media-placeholder.heic {
  background: repeating-linear-gradient(135deg, #2f2114 0 12px, #241a12 12px 24px);
}

.capsule-admin-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.capsule-admin-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.capsule-admin-card p {
  margin: 10px 0 0;
  white-space: pre-wrap;
}

.capsule-admin-media {
  display: grid;
  grid-template-columns: minmax(120px, 220px) 1fr;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

.party-gallery-selection-toolbar {
  justify-content: flex-start;
}

.party-selection-card {
  cursor: pointer;
}

.party-selection-card.is-incompatible {
  opacity: 0.68;
  cursor: not-allowed;
}

.party-selection-choice {
  display: flex;
  align-items: center;
  gap: 8px;
}

.party-selection-choice input {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.party-selection-card > .party-selection-dimensions {
  color: #24564b;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 700px) {
  .guest-content-grid,
  .party-admin-thumbnails {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capsule-admin-media {
    grid-template-columns: 1fr;
  }
}
/* v283 : pagination compacte sur téléphone et carte souvenir robuste. */
.gallery-pagination {
  flex-wrap: nowrap;
  gap: clamp(4px, 0.42cqw, 8px);
  white-space: nowrap;
  line-height: 1;
}

.gallery-pagination > span {
  min-width: max-content;
  flex: 0 0 auto;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: keep-all;
}

.gallery-pagination button {
  min-width: max-content;
  min-height: clamp(25px, 2.25cqw, 30px);
  flex: 0 0 auto;
  padding: 0.38em 0.68em;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: keep-all;
  line-height: 1;
}

.experience-viewer.is-memory-card .experience-viewer-copy {
  min-width: 0;
  min-height: 0;
}

.experience-viewer.is-memory-card .memory-card-period,
.experience-viewer.is-memory-card .memory-card-title,
.experience-viewer.is-memory-card .memory-card-main-text,
.experience-viewer.is-memory-card .memory-card-shared-by {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: normal;
}

.experience-viewer.is-memory-card .memory-card-main-text {
  padding-inline: clamp(0.75em, 4%, 1.6em);
  box-sizing: border-box;
  white-space: pre-wrap;
  text-wrap: pretty;
  hyphens: auto;
}

@media (max-width: 760px), (max-height: 560px) {
  .gallery-pagination {
    gap: clamp(3px, 0.32cqw, 6px);
    font-size: clamp(9px, 0.66cqw, 12px);
  }

  .gallery-pagination button {
    min-height: 24px;
    padding-inline: 0.56em;
  }

  .experience-viewer.is-memory-card .memory-card-main-text {
    font-size: min(var(--overlay-font-size, 2.35cqw), 1.62cqw);
  }
}
/* v265 : paiements reçus et simplification des effets soirée. */
.online-payment-admin-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  align-items: end;
  margin-top: 1rem;
}
.online-payment-admin-form label {
  display: grid;
  gap: 0.38rem;
  color: #29463f;
  font-weight: 700;
}
.online-payment-admin-form input,
.online-payment-admin-form select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.online-payment-admin-form .online-payment-reference {
  grid-column: span 2;
}
.online-payment-admin-form > button {
  min-height: 2.8rem;
}
.online-payment-admin-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 1rem;
}
.online-payment-admin-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.8rem;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid rgba(40, 93, 82, 0.22);
  border-radius: 0.75rem;
  background: rgba(247, 249, 245, 0.72);
}
.online-payment-admin-row > div {
  display: grid;
  gap: 0.18rem;
}
.online-payment-admin-row span,
.online-payment-admin-row small {
  color: #60716c;
}
.online-payment-admin-row > b {
  color: #1f5a4d;
  white-space: nowrap;
}
#party-upload .sparkler-light::after,
#party-gallery .sparkler-light::after {
  display: none !important;
}
@media (max-width: 850px) {
  .online-payment-admin-form { grid-template-columns: 1fr; }
  .online-payment-admin-form .online-payment-reference { grid-column: auto; }
  .online-payment-admin-row { grid-template-columns: 1fr auto; }
  .online-payment-admin-row > button { grid-column: 1 / -1; }
}
/* v268 : le contour interne des lecteurs suit le réglage de cadre du calibrage. */
#mariage-film .detail-page-panel.overlay-border-hidden .marriage-video-player,
#mariage-messages .marriage-message-video-zone.overlay-border-hidden > .marriage-video-player {
  border-width: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
/* v270 : bouton de dépôt temporaire et galerie soirée intégrée. */
.public-party-upload-button {
  position: static;
  z-index: 1;
  display: grid;
  width: var(--public-control-size, 42px);
  height: var(--public-control-size, 42px);
  flex: 0 0 var(--public-control-size, 42px);
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(255, 226, 164, 0.68);
  border-radius: 50%;
  padding: clamp(5px, 0.47cqw, 9px);
  background: rgba(3, 8, 10, 0.58);
  color: var(--gold-soft);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.38);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  cursor: pointer;
}
.public-party-upload-button:hover,
.public-party-upload-button:focus-visible {
  border-color: #fff1bd;
  background: rgba(126, 82, 24, 0.72);
  color: #fff;
  outline: none;
}
.public-party-upload-button svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.public-party-upload-button:disabled {
  cursor: progress;
  opacity: 0.56;
}
.app-shell[data-view="admin"] .public-party-upload-button {
  display: none !important;
}
#party-gallery .party-gallery-stage {
  overflow: visible;
}
@media (max-width: 640px) {
  .public-party-upload-button {
    width: var(--public-control-size, 40px);
    height: var(--public-control-size, 40px);
    flex-basis: var(--public-control-size, 40px);
  }
}
/* v273 : le filtre racine reste actif sans afficher le titre Photos. */
#party-gallery .gallery-filter-tabs {
  display: none !important;
}


/* v275 : diaporama immersif sans curseur. */
#mediaViewer.is-slideshow-running,
#mediaViewer.is-slideshow-running * {
  cursor: none !important;
}

#mediaViewer.is-slideshow-running #mediaViewerVisibility {
  cursor: pointer !important;
}


/* v276 : traçabilité des sources de la galerie soirée. */
.party-gallery-source-explanation {
  margin: 8px 0;
  line-height: 1.55;
}
.party-gallery-source-explanation code,
.party-selection-server-path {
  border: 1px solid rgba(35, 94, 79, 0.16);
  border-radius: 7px;
  background: rgba(35, 94, 79, 0.07);
  color: #173f36;
  font-family: Consolas, "Courier New", monospace;
}
.party-gallery-source-explanation code {
  padding: 2px 6px;
}
.party-selection-server-path {
  display: block;
  min-width: 0;
  padding: 6px 8px;
  overflow-wrap: anywhere;
  white-space: normal;
  font-size: 0.72rem;
  line-height: 1.35;
  user-select: text;
}
/* v288 : aperçu intégral des dépôts, sans recadrage. */
.party-selection-card .guest-media-preview > img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
}
/* v290 : miniatures sans original, carte mobile et fond Galerie soirée non répété. */
.party-selection-card .guest-media-preview {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}
.party-selection-card .guest-media-preview > img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
.experience-viewer.is-memory-card .memory-card-main-text {
  box-sizing: border-box;
  padding-inline: clamp(0.75em, 4%, 1.6em);
}
#party-gallery.screen {
  background-color: #000 !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
}
#party-gallery.screen::before {
  background-position: center center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
.party-gallery-calibration-preview {
  background-color: #000 !important;
  background-position: center center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
/* v294 : one unified manager for the party gallery. */
.admin-gallery-source-card > .party-gallery-selection-card.is-merged {
  margin-top: 18px;
  border: 0;
  border-top: 1px solid rgba(40, 92, 79, 0.24);
  border-radius: 0;
  padding: 18px 0 0;
  background: transparent;
  box-shadow: none;
}
.admin-gallery-source-card > .party-gallery-selection-card.is-merged .guest-media-preview > img {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;

/* v295 : journal persistant des op?rations de galerie. */
.admin-message-log {
  margin: 14px 0 18px;
  border: 1px solid rgba(40, 92, 79, 0.24);
  border-radius: 12px;
  background: #f8fbf9;
  overflow: hidden;
}
.admin-message-log > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  color: #173f36;
  font-weight: 800;
  cursor: pointer;
}
.admin-message-log > summary span {
  min-width: 28px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #164c40;
  color: #fff;
  text-align: center;
}
.admin-message-log-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px 12px;
}
.admin-message-log-toolbar p {
  margin: 0;
  color: #5e716c;
}
.admin-message-log-toolbar button {
  flex: 0 0 auto;
}
.admin-message-log-entries {
  max-height: 320px;
  margin: 0;
  padding: 0 16px 16px;
  overflow: auto;
  list-style: none;
}
.admin-message-log-entry {
  margin-top: 8px;
  padding: 10px 12px;
  border-left: 4px solid #66817a;
  border-radius: 7px;
  background: #fff;
}
.admin-message-log-entry.is-error { border-left-color: #b63b31; background: #fff5f3; }
.admin-message-log-entry.is-success { border-left-color: #238260; background: #f2fbf7; }
.admin-message-log-entry > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.admin-message-log-entry time { color: #697873; font-size: 0.82rem; }
.admin-message-log-entry p { margin: 6px 0 0; overflow-wrap: anywhere; }
.admin-message-log-empty { padding: 12px; color: #6d7b77; }
}