:root {
  --evermore-intro-paper: #e8dec9;
  --evermore-intro-cotton: #fbf8f2;
  --evermore-intro-navy: #22304d;
  --evermore-intro-navy-2: #2e3f63;
  --evermore-intro-navy-deep: #171f31;
  --evermore-intro-gold: #e2cb92;
  --evermore-intro-gold-text: #7a5a22;
  --evermore-intro-muted: #585f6f;
  --evermore-intro-serif: "Bodoni Moda", Didot, Georgia, "Times New Roman", serif;
  --evermore-intro-ease: cubic-bezier(.22, .61, .36, 1);
}
html.evermore-intro-on { overflow: hidden; }
html.evermore-intro-on body { overflow: hidden !important; }
.evermore-intro, .evermore-intro * { box-sizing: border-box; }
.evermore-intro { display: none; }
html.evermore-intro-on .evermore-intro {
  display: flex; align-items: center; justify-content: center;
  position: fixed; inset: 0; z-index: 999999;
  padding: 24px; background-color: var(--evermore-intro-bg, #171f31);
  background-image: var(--evermore-intro-bg-image, none);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  transition: opacity .7s var(--evermore-intro-ease), visibility .7s;
}
.evermore-intro.evermore-is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.evermore-intro button { font-family: inherit; cursor: pointer; }
.evermore-intro-skip {
  position: absolute; top: 20px; right: 20px; padding: 8px 16px;
  border: 1px solid rgba(226, 203, 146, .45); border-radius: 0; background: transparent;
  color: var(--evermore-intro-gold); font-size: .74rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; line-height: 1.5;
}
.evermore-intro-skip:hover, .evermore-intro-skip:focus-visible { background: rgba(226, 203, 146, .1); color: var(--evermore-intro-gold); }
.evermore-intro-stage { text-align: center; width: min(460px, 88vw); }
.evermore-intro-kicker { margin: 0 0 28px; font-family: var(--evermore-intro-serif); font-style: italic; font-size: clamp(1.3rem, 4vw, 1.7rem); font-weight: 400; line-height: 1.4; color: var(--evermore-intro-cotton); }
.evermore-intro-hint { margin: 26px 0 0; font-family: inherit; font-size: .74rem; letter-spacing: .24em; text-transform: uppercase; color: rgba(251, 248, 242, .6); transition: opacity .3s; }
.evermore-envelope-wrap { position: relative; perspective: 1400px; }
.evermore-envelope { position: relative; width: 100%; aspect-ratio: 1.5; }
.evermore-envelope > div { position: absolute; inset: 0; }
.evermore-envelope-back { background-color: var(--evermore-intro-envelope, #2e3f63); background-image: radial-gradient(circle at 6px 6px, rgba(226, 203, 146, .5) 1.2px, transparent 1.8px); background-size: 14px 14px; border: 10px solid var(--evermore-intro-paper); box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .6); }
.evermore-envelope-letter { inset: 8% 7% 6% !important; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 4px; padding-top: 7%; background: var(--evermore-intro-letter, #fbf8f2); background-image: repeating-linear-gradient(0deg, rgba(34, 48, 77, .022) 0 1px, transparent 1px 4px); box-shadow: 0 2px 6px rgba(0, 0, 0, .15); z-index: 2; transition: transform 1s var(--evermore-intro-ease) .95s; }
.evermore-letter-image { display: block; max-width: 55%; max-height: 24%; object-fit: contain; margin-bottom: 4px; }
.evermore-letter-extra { max-width: 90%; margin-top: 5px; color: var(--evermore-intro-muted); font-family: var(--evermore-intro-serif); font-size: clamp(.55rem, 1.6vw, .85rem); line-height: 1.25; white-space: normal; overflow-wrap: anywhere; }
.evermore-letter-mono { font-family: var(--evermore-intro-serif); font-size: 1.9rem; line-height: 1.3; color: var(--evermore-intro-gold-text); }
.evermore-letter-mono i, .evermore-wax-seal i { font-size: .72em; margin: 0 1px; }
.evermore-letter-line { font-family: var(--evermore-intro-serif); font-style: italic; font-size: 1.15rem; line-height: 1.4; color: var(--evermore-intro-navy); }
.evermore-letter-date { font-family: inherit; font-size: .7rem; line-height: 1.5; letter-spacing: .3em; text-transform: uppercase; color: var(--evermore-intro-muted); }
.evermore-envelope-front { z-index: 3; background: var(--evermore-intro-paper); background-image: repeating-linear-gradient(0deg, rgba(34, 48, 77, .025) 0 1px, transparent 1px 4px); clip-path: polygon(0 0, 50% 54%, 100% 0, 100% 100%, 0 100%); }
.evermore-envelope-front::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top right, transparent calc(50% - 1px), rgba(28, 35, 51, .12) 50%, transparent calc(50% + 1px)) left bottom / 50% 100% no-repeat, linear-gradient(to top left, transparent calc(50% - 1px), rgba(28, 35, 51, .12) 50%, transparent calc(50% + 1px)) right bottom / 50% 100% no-repeat; }
.evermore-envelope-flap { bottom: auto !important; height: 58%; background: var(--evermore-intro-flap, #e2d6be); background-image: repeating-linear-gradient(0deg, rgba(34, 48, 77, .025) 0 1px, transparent 1px 4px); clip-path: polygon(0 0, 100% 0, 50% 100%); transform-origin: 50% 0; z-index: 4; transition: transform .8s var(--evermore-intro-ease) .25s, z-index 0s linear .65s; }
.evermore-wax-seal { position: absolute; left: 50%; top: 58%; z-index: 5; width: 84px; height: 84px; padding: 0; transform: translate(-50%, -50%); display: grid; place-items: center; border: 0; border-radius: 50%; background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--evermore-intro-seal, #22304d) 75%, white), var(--evermore-intro-seal, #22304d) 55%, color-mix(in srgb, var(--evermore-intro-seal, #22304d) 60%, black)); box-shadow: 0 0 0 5px rgba(34, 48, 77, .55), 0 10px 24px rgba(0, 0, 0, .45), inset 0 -3px 6px rgba(0, 0, 0, .35), inset 0 2px 4px rgba(255, 255, 255, .15); font-family: var(--evermore-intro-serif); font-size: 1.45rem; line-height: 1; color: var(--evermore-intro-gold); transition: transform .45s var(--evermore-intro-ease), opacity .45s var(--evermore-intro-ease); animation: evermore-seal-breathe 2.6s ease-in-out infinite; }
.evermore-wax-seal img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; display: block; }
.evermore-wax-seal span { display: flex; align-items: center; justify-content: center; white-space: nowrap; width: 62px; height: 62px; border-radius: 50%; border: 1px dashed rgba(226, 203, 146, .55); }
.evermore-wax-seal:hover { transform: translate(-50%, -50%) scale(1.06); }
@keyframes evermore-seal-breathe { 50% { box-shadow: 0 0 0 9px rgba(34, 48, 77, .35), 0 10px 24px rgba(0, 0, 0, .45), inset 0 -3px 6px rgba(0, 0, 0, .35), inset 0 2px 4px rgba(255, 255, 255, .15); } }
.evermore-is-opening .evermore-wax-seal { opacity: 0; transform: translate(-50%, -50%) scale(1.4); animation: none; pointer-events: none; }
.evermore-is-opening .evermore-envelope-flap { transform: rotateX(180deg); z-index: 1; }
.evermore-is-opening .evermore-envelope-letter { transform: translateY(-58%); }
.evermore-intro :focus-visible { outline: 2px solid var(--evermore-intro-gold); outline-offset: 4px; }
@media (max-width: 480px) { .evermore-intro { padding: 20px; } .evermore-envelope-back { border-width: 7px; } .evermore-wax-seal { width: 72px; height: 72px; } .evermore-wax-seal img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; display: block; }
.evermore-wax-seal span { width: 54px; height: 54px; } .evermore-letter-image { display: block; max-width: 55%; max-height: 24%; object-fit: contain; margin-bottom: 4px; }
.evermore-letter-extra { max-width: 90%; margin-top: 5px; color: var(--evermore-intro-muted); font-family: var(--evermore-intro-serif); font-size: clamp(.55rem, 1.6vw, .85rem); line-height: 1.25; white-space: normal; overflow-wrap: anywhere; }
.evermore-letter-mono { font-size: 1.6rem; } .evermore-letter-line { font-size: .95rem; } .evermore-letter-date { font-size: .58rem; letter-spacing: .18em; } }
@media (prefers-reduced-motion: reduce) { html.evermore-intro-on .evermore-intro { display: none; } html.evermore-intro-on, html.evermore-intro-on body { overflow: auto !important; } }

/* Reusable static envelope shortcode: [evermore_envelope] */
.evermore-static-envelope { width: 100%; display: flex; align-items: center; justify-content: center; padding: 28px 16px; background-color: var(--evermore-intro-bg, #171f31); background-image: var(--evermore-intro-bg-image, none); background-size: cover; background-position: center; background-repeat: no-repeat; }
.evermore-static-envelope .evermore-intro-stage { width: min(460px, 100%); }
.evermore-static-envelope .evermore-envelope-letter { transform: none !important; }
.evermore-static-envelope .evermore-wax-seal { animation: none; cursor: default; }
.evermore-static-envelope .evermore-wax-seal-wrap { position: static; }
.evermore-static-envelope .evermore-envelope-wrap { position: relative; }
.evermore-static-envelope .evermore-wax-seal { position: absolute; left: 50%; top: 58%; z-index: 5; }