@font-face { font-family: "Inter"; src: url("fonts/inter-italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; }
/* Invitation controls share the quiet palette of the scene. */
.language-switch { position: fixed; z-index: 3; top: max(24px, env(safe-area-inset-top)); left: var(--pad); display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border: 1px solid var(--rule); border-radius: 4px; background: color-mix(in srgb, var(--night) 78%, transparent); backdrop-filter: blur(12px); }
.language-switch button { position: relative; width: 43px; min-height: 34px; border: 0; background: transparent; color: var(--dim); font: 11px/1 "Inter", sans-serif; letter-spacing: .06em; cursor: pointer; transition: color .22s; }
.language-switch button[aria-pressed="true"] { color: var(--ink); }
.language-slider { position: absolute; top: 3px; bottom: 3px; left: 3px; width: 43px; border-radius: 4px; background: color-mix(in srgb, var(--ink) 12%, transparent); transform: translateX(43px); transition: transform .36s cubic-bezier(.22,.68,0,1); will-change: transform; }
[data-language="nl"] .language-slider { transform: translateX(0); }
.invite.invitation-card { max-width: 37rem; }
.invite.invitation-card .lead { font-family: var(--serif); font-size: clamp(1.2rem,1.75vw,1.62rem); line-height: 1.25; font-style: normal; }
.invite.invitation-card h1 { font-size: clamp(2.6rem,5.4vw,5.4rem); margin: .13em 0 .25em -.04em; }
.invite.invitation-card .when { font-size: .92rem; color: var(--dim); }
.event-details { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3em 1em; }
.event-details .when { white-space: nowrap; }
.event-details .venue { white-space: normal; line-height:1.6; text-wrap:pretty; }
.venue a, .venue-link { pointer-events:auto; color:inherit; text-decoration:underline; text-decoration-color:#ffffff40; text-underline-offset:3px; }
.venue a:hover, .venue-link:hover { color:var(--ink); text-decoration-color:currentColor; }
.venue { margin-top: 0; font-size: .92rem; color: var(--dim); }
.invite.invitation-card .word { font: normal 400 1.02rem/1.55 "Inter", sans-serif; margin-top: 1.6rem; max-width: 33rem; }
.thesis-credit { max-width: 32rem; font: 400 .83rem/1.65 "Inter", sans-serif; color: var(--dim); margin-top: 1.25rem; text-wrap: pretty; }
.thesis-credit > [lang="en"] { font-style: italic; }
.thesis-credit .author { display: block; margin-top: .3em; font-style: normal; color: var(--ink); white-space: nowrap; }
.invitation-card .act { margin-top: 1.4rem; }
.invitation-card .act a { display: inline-flex; align-items: center; gap: 10px; border-radius: 4px; min-height: 44px; background: color-mix(in srgb, var(--night) 36%, transparent); }
.invitation-card .act a svg { transition: transform .2s ease; }
.invitation-card .act a:hover svg { transform: translateY(-2px); }
.language-switch button:focus-visible, .animation-info button:focus-visible, .act a:focus-visible { outline: 2px solid var(--warm); outline-offset: 4px; }
.animation-info { position: fixed; right: max(20px,env(safe-area-inset-right)); bottom: max(20px,env(safe-area-inset-bottom)); z-index: 4; }
.info-toggle { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: transparent; color: var(--dim); cursor: pointer; }
.info-toggle span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--rule); border-radius: 50%; font: 20px/1 Georgia,serif; background: var(--night); transition: color .2s, border-color .2s; }
.info-toggle:hover span, .info-toggle[aria-expanded="true"] span { color: var(--warm); border-color: var(--warm); }
.info-panel { position: absolute; bottom: 56px; right: 0; width: min(365px,calc(100vw - 40px)); max-height: calc(100dvh - 120px); overflow-y: auto; padding: 22px; border: 1px solid var(--rule); border-radius: 4px; background: color-mix(in srgb, var(--night) 94%, transparent); backdrop-filter: blur(18px); box-shadow: 0 16px 60px #0005; }
.info-panel[hidden] { display: none; }
.info-close { position: absolute; top: 6px; right: 7px; width: 38px; height: 38px; border: none; background: none; color: var(--dim); font-size: 22px; cursor: pointer; }
.info-panel p { font-size: 12px; line-height: 1.65; color: var(--dim); margin-top: 12px; }
.info-panel > p:first-of-type { margin-top: 0; padding-right: 20px; }
.info-panel .info-invitation { color: var(--ink); }
.info-panel .info-spec { border-top: 1px solid var(--rule); padding-top: 14px; font-size: 10px; letter-spacing: .03em; }
#calendar-date > span:first-child { font-size: 14px; color: var(--ink); }
.capture .language-switch, .capture .animation-info { display: none; }
@media (max-aspect-ratio:19/20) {
  .language-switch { left: 24px; top: max(18px,env(safe-area-inset-top)); }
  main { padding-bottom: max(64px,calc(env(safe-area-inset-bottom) + 50px)); }
  .invite.invitation-card { margin-bottom: 0; max-width: 100%; }
  .invite.invitation-card .lead { font-size: 1.22rem; }
  .invite.invitation-card h1 { font-size: clamp(1.8rem,8.9vw,4.6rem); }
  .invite.invitation-card .when, .venue { font-size: .78rem; }
  .invite.invitation-card .word { font-size: .88rem; margin-top: 1rem; }
  .thesis-credit { font-size: .73rem; line-height: 1.55; margin-top: .8rem; max-width: 29rem; }
  .invitation-card .act { margin-top: 1rem; }
  .animation-info { right: 14px; bottom: max(10px,env(safe-area-inset-bottom)); }
  .info-panel { right: 2px; width: min(365px,calc(100vw - 32px)); }
}
@media (max-height: 650px) {
  .invite.invitation-card { transform: none; }
  .invite.invitation-card .word { margin-top: .7rem; }
  .thesis-credit { margin-top: .6rem; font-size: .72rem; }
  .invitation-card .act { margin-top: .8rem; }
  .invite.invitation-card h1 { font-size: clamp(1.8rem,7vh,3rem); }
}
@media (max-height:450px) and (min-aspect-ratio:19/20) {
  main { padding-top: 68px; padding-bottom: 14px; overflow-y: auto; pointer-events: auto; }
  .invite.invitation-card { margin: 0; }
  .language-switch { top: 12px; }
  .invite.invitation-card .lead { font-size: 1rem; }
  .invite.invitation-card h1 { font-size: 2rem; }
  .invite.invitation-card .word { font-size: .8rem; }
}
@media (prefers-reduced-motion:reduce) { .language-slider, .language-switch button, .info-toggle span, .invitation-card .act a svg { transition: none; } }

/* Keep the light behind the small text quiet, without adding a visible card. */
main { isolation: isolate; }
main::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgb(0 0 0 / .32), rgb(0 0 0 / .22) 36%, transparent 56%); }
.calendar-dialog { border-radius: 4px; }
@media (max-aspect-ratio:19/20) { main::before { background: linear-gradient(0deg, rgb(0 0 0 / .62), rgb(0 0 0 / .36) 40%, transparent 65%); } }

/* The longer Spanish date may wrap naturally on small screens. */
html[lang="es"] .invitation-card h1 { white-space: normal; text-wrap: balance; }

.invitation-card .act { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.invitation-card .act .rsvp-open { background:var(--ink); color:var(--night); border-color:var(--ink); }

/* A quieter alternative beneath the in-person actions. */
.invitation-card .watch-online { margin-top: .55rem; font: 400 .84rem/1.4 "Inter", sans-serif; }
.watch-online a { display: inline-flex; align-items: center; min-height: 36px; color: var(--dim); pointer-events: auto; text-decoration: underline; text-underline-offset: .22em; text-decoration-color: var(--rule); }
.watch-online a:hover { color: var(--ink); }
.watch-online a:focus-visible { outline: 2px solid white; outline-offset: 4px; }
.capture .watch-online { display: none; }

.watch-online { display:flex; align-items:center; flex-wrap:wrap; column-gap:22px; row-gap:0; }
.research-open { appearance:none; border:0; border-radius:0; background:none; padding:0; min-height:36px; font:inherit; color:var(--dim); cursor:pointer; pointer-events:auto; text-decoration:underline; text-underline-offset:.22em; text-decoration-color:var(--rule); }
.research-open:hover { color:var(--ink); }
.research-open:focus-visible, .research-close:focus-visible { outline:2px solid white; outline-offset:4px; }
.research-dialog { position:fixed; inset:0; margin:auto; width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 48px); overflow-y:auto; overscroll-behavior:contain; padding:32px; border:1px solid #ffffff26; border-radius:6px; background:#101012; color:#d8d8d6; box-shadow:0 16px 70px #0007; }
.research-dialog::backdrop { background:#0006; backdrop-filter:blur(2px); }
.research-dialog h2 { font:400 30px/1.2 var(--serif); color:var(--ink); margin:0 32px 22px 0; }
.research-dialog p { font:400 14px/1.7 "Inter",sans-serif; margin:0 0 16px; }
.research-dialog p:last-child { margin-bottom:0; }
.research-close { position:absolute; right:12px; top:10px; width:36px; height:36px; border:0; background:none; color:var(--dim); font:26px/1 "Inter",sans-serif; cursor:pointer; }
@media(max-width:500px){.research-dialog{padding:26px 22px}.research-dialog p{font-size:13px;line-height:1.65}.watch-online{column-gap:18px}}