.photo-upload { border: 1px solid #c3d3e5; border-radius: .5rem; background: #f6f9fd; padding: 1.25rem; }
  .photo-upload input[type=file] { padding: .75rem; font-size: .875rem; background: white; }
  .photo-upload input::file-selector-button { border: 1px solid #95b5d8; border-radius: .25rem; background: #edf4fc; color: #295886; padding: .6rem; margin-right: .65rem; cursor: pointer; }
  .album-progress { font-size: .9375rem; line-height: 1.6; overflow-wrap: anywhere; }
  .upload-errors { font-size: .875rem; line-height: 1.6; color: #9f2432; overflow-wrap: anywhere; padding-left: 1.2rem; }
  .album-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem; font-size: .875rem; margin: 1.25rem 0; }
  .album-toolbar p { margin: 0; }
  .photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; list-style: none; padding: 0; margin: 0; }
  .photo-grid li { min-width: 0; border: 1px solid #d5e3f2; border-radius: .375rem; overflow: hidden; text-align: center; }
  .photo-preview { display: block; aspect-ratio: 1; background: #edf4fc; }
  .photo-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .photo-download { display: block; font-size: .875rem; line-height: 1.5; padding: .8rem .25rem; }
  .album-empty { text-align: center; border: 1px dashed #95b5d8; border-radius: .5rem; background: #f6f9fd; padding: 2rem 1.25rem; }
  .album-empty > p:first-of-type { font: 500 1.65rem/1.3 var(--serif); color: #295886; }
  button:disabled { opacity: .6; cursor: progress; }
  [hidden] { display: none !important; }
  @media (max-width: 420px) { .photo-grid { gap: .65rem; } .photo-upload { padding: .875rem; } }

  .song-search { position: relative; }
  .song-suggestions { margin: .5rem 0 0; padding: .25rem; border: 1px solid #95b5d8; border-radius: .375rem; background: #fff; max-height: 20rem; overflow-y: auto; }
  .song-suggestions [role=row] { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .song-suggestions [role=gridcell] { min-width: 0; border-radius: .25rem; overflow-wrap: anywhere; }
  .song-suggestions [role=gridcell]:hover, .song-suggestions [aria-selected=true] { background: #edf4fc; outline: 1px solid #95b5d8; outline-offset: -1px; }
  .song-suggestions .song-suggestion-select { display: block; width: 100%; padding: .75rem; border: 0; border-radius: .25rem; background: transparent; color: var(--ink); text-align: left; font: inherit; cursor: pointer; min-height: 44px; }
  .song-suggestions strong { display: block; font-size: .9375rem; line-height: 1.5; }
  .song-suggestions span { display: block; font-size: .8125rem; color: var(--muted); line-height: 1.5; margin-top: .15rem; }
  .song-suggestions a { display: grid; place-items: center; width: 44px; min-height: 44px; font-size: 1.125rem; }
  .song-search-status { min-height: 1.5em; font-size: .8125rem; line-height: 1.5; color: var(--muted); margin: .5rem 0 0; }
  .song-search-source { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; font-size: .75rem; color: var(--muted); margin: .5rem 0; }
  .song-search-source[hidden] { display: none; }
  .song-search-source a { padding: .5rem; }
  .song-search-source img { display: block; width: 80px; height: auto; }

  @font-face { font-family: 'Cormorant Garamond'; src: url('/assets/cormorant-medium.ttf') format('truetype'); font-style: normal; font-weight: 500; font-display: swap; }
  @font-face { font-family: 'Pinyon Script'; src: url('/assets/pinyon-script.ttf') format('truetype'); font-style: normal; font-weight: 400; font-display: swap; }
  :root { color-scheme: light; font-family: Arial, Helvetica, sans-serif; color: #344f6e; background: #f2f6fb; --accent: #2f6094; --line: #95b5d8; --muted: #62758b; --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif; }
  * { box-sizing: border-box; }
  body { margin: 0; min-height: 100svh; background: #f2f6fb; isolation: isolate; }
  body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; background-image: linear-gradient(rgb(250 252 255 / .24), rgb(250 252 255 / .24)), url('/assets/toile-background.webp'); background-position: center; background-size: cover; background-repeat: no-repeat; }
  a { color: var(--accent); text-underline-offset: 5px; }
  button, input { font: inherit; }
  :focus-visible { outline: 3px solid #507daa; outline-offset: 5px; }
  .shell { position: relative; width: min(calc(100% - 4rem), 46rem); margin: 2.75rem auto; padding: 2.25rem clamp(1.5rem, 5vw, 4rem) 2.75rem; background: #fff; border: 1px solid var(--line); border-radius: 1.25rem; box-shadow: 0 15px 60px #2f609419; }
  .shell::before { content: ''; position: absolute; inset: 8px; border: 1px solid var(--line); border-radius: .875rem; pointer-events: none; }
  .invitation { position: relative; text-align: center; color: var(--accent); margin-bottom: 1.25rem; }
  .invitation-label { font-size: .875rem; letter-spacing: .2em; margin: 0 0 .5rem; }
  .brand { font: 400 clamp(2.4rem, 5.1vw, 3.75rem)/1.4 'Pinyon Script', 'Segoe Script', cursive; margin: 0; }
  .brand .name { white-space: nowrap; }
  .brand .ampersand { font-size: .7em; margin: 0 .16em; }
  .invitation-date { font: 500 1.35rem/1.5 var(--serif); letter-spacing: .075em; margin: .15rem 0 0; }
  .venue-art { position: relative; width: 12rem; height: 7.4rem; overflow: hidden; margin: 1rem auto 0; }
  .venue-art img { position: absolute; width: 210.5%; max-width: none; left: -55.4%; top: -53%; }
  .content { position: relative; }
  .card { width: 100%; max-width: 32rem; margin: 0 auto; }
  .eyebrow { text-transform: uppercase; text-align: center; letter-spacing: .13em; font-size: .875rem; font-weight: 400; color: var(--accent); margin: 0 0 .75rem; }
  h1 { font: 500 clamp(2.2rem, 4vw, 3rem)/1.13 var(--serif); text-align: center; color: #295886; margin: 0 0 1rem; }
  .intro { font-size: 1rem; text-align: center; line-height: 1.7; color: var(--muted); margin: 0 0 1.75rem; }
  fieldset { border: 0; padding: 0; margin: 0 0 1.5rem; min-width: 0; }
  legend { font-size: .875rem; font-weight: 700; padding: 0; margin-bottom: .875rem; }
  .choice { cursor: pointer; display: flex; align-items: center; gap: 1rem; padding: 1.15rem; border: 1px solid #c3d3e5; border-radius: .375rem; margin-bottom: .75rem; transition: border-color .15s, background .15s; }
  .choice:hover { border-color: var(--accent); }
  .choice:has(input:checked) { border-color: var(--accent); background: #eff5fc; box-shadow: 0 0 0 1px var(--accent); }
  .choice input { margin: 0; width: 1.25rem; height: 1.25rem; flex: 0 0 auto; accent-color: var(--accent); }
  .choice strong { display: block; font-size: 1rem; line-height: 1.5; }
  .choice span span { display: block; font-size: .875rem; color: var(--muted); line-height: 1.5; margin-top: .25rem; }
  .primary { display: inline-flex; align-items: center; justify-content: center; width: 100%; border: 1px solid var(--accent); border-radius: .375rem; padding: 1rem 1.25rem; background: var(--accent); color: #fff; font-weight: 700; line-height: 1.5; font-size: 1rem; cursor: pointer; text-decoration: none; transition: background .15s; }
  .primary:hover { background: #224b77; }
  .note { font-size: .875rem; line-height: 1.6; color: var(--muted); text-align: center; margin: 1.1rem 0 0; }
  .notice { font-size: 1rem; line-height: 1.6; padding: 1rem 1.25rem; margin: 0 0 1.5rem; border-left: 3px solid var(--accent); background: #edf4fc; }
  .status { display: table; border: 1px solid #abc4df; border-radius: 2rem; padding: .5rem .875rem; color: var(--accent); font-size: .875rem; margin: 0 auto 1.5rem; }
  .secondary { display: inline-block; font-size: 1rem; line-height: 1.6; margin-top: 1.5rem; }
  .field { margin: 0 0 1.25rem; }
  .field label { display: block; font-size: 1rem; font-weight: 700; margin-bottom: .5rem; }
  .field input { display: block; width: 100%; min-width: 0; border: 1px solid #b4c9df; border-radius: .375rem; padding: .875rem 1rem; font-size: 1rem; color: #344f6e; background: #fcfdff; }
  .field input[aria-invalid=true] { border-color: #9f2432; }
  .hint { margin: .5rem 0 0; font-size: .875rem; line-height: 1.5; color: var(--muted); }
  .error { color: #9f2432; }
  .summary { background: #edf4fc; padding: 1rem; border: 1px solid #d5e3f2; border-radius: .375rem; font-size: 1rem; line-height: 1.6; margin: 1.5rem 0; }
  .schedule { list-style: none; margin: 2rem 0 0; padding: 0; }
  .schedule-step { display: grid; grid-template-columns: 10rem minmax(0, 1fr); align-items: center; gap: 1.5rem; padding: 2rem 0; border-bottom: 1px solid #d5e3f2; }
  .schedule-step:first-child { border-top: 1px solid #d5e3f2; }
  .event-time { display: inline-block; font: 500 1.4rem/1.2 var(--serif); letter-spacing: .04em; color: var(--accent); background: #edf4fc; padding: .4rem .75rem; border-radius: 2rem; margin-bottom: .75rem; }
  .schedule-step h2 { font: 500 2.1rem/1.2 var(--serif); color: #295886; margin: 0 0 .5rem; }
  .event-place { font-size: 1rem; font-weight: 700; line-height: 1.5; margin: 0 0 .5rem; }
  .event-address { font-style: normal; font-size: .9375rem; color: var(--muted); line-height: 1.6; }
  .event-description { font-size: .9375rem; line-height: 1.7; color: var(--muted); margin: 1rem 0; }
  .directions { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; min-height: 44px; padding: .65rem .9rem; border: 1px solid var(--line); border-radius: .375rem; font-size: .9375rem; font-weight: 700; text-decoration: none; }
  .directions:hover { background: #edf4fc; border-color: var(--accent); }
  .event-art { position: relative; overflow: hidden; margin: 0 auto; }
  .event-art img { position: absolute; max-width: none; }
  .event-art--aperitif { width: 8rem; height: 9.333rem; }
  .event-art--aperitif img { width: 413.333%; left: -90%; top: -94.286%; }
  .event-art--ceremony { width: 8rem; height: 9.362rem; }
  .event-art--ceremony img { width: 527.66%; left: -334.043%; top: -280%; }
  .event-art--reception { width: 10rem; height: 6.905rem; }
  .event-art--reception img { width: 295.238%; left: -46.429%; top: -410.345%; }
  .guest-actions { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; justify-content: center; }
  .guest-actions .secondary { margin-top: 0; }
  .guest-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.25rem; margin: 0 0 2rem; font-size: .9375rem; }
  .guest-section { margin-top: 2.5rem; padding-top: 2.5rem; border-top: 1px solid #d5e3f2; scroll-margin-top: 1.5rem; }
  .guest-section h2 { font: 500 2.25rem/1.2 var(--serif); text-align: center; color: #295886; margin: 0 0 1rem; }
  .guest-section p { line-height: 1.7; }
  .hotel-code { padding: 1.25rem; background: #edf4fc; border: 1px solid #d5e3f2; border-radius: .375rem; text-align: center; margin: 1.5rem 0; }
  .hotel-code label { display: block; font-size: .875rem; margin-bottom: .75rem; }
  .hotel-code input { width: 100%; min-width: 0; font: 700 clamp(.875rem, 3.8vw, 1.1rem) Arial, sans-serif; letter-spacing: .04em; color: var(--accent); text-align: center; background: transparent; padding: .65rem .25rem; border: 1px dashed #95b5d8; border-radius: .25rem; }
  .text-button { border: 0; padding: .65rem .25rem; min-height: 44px; background: transparent; color: var(--accent); font-size: .9375rem; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
  .hotel-code button { margin-top: .35rem; }
  .hotel-code .hint { margin: 0; min-height: 1.5em; }
  .song-list { list-style: none; padding: 0; margin: 1.25rem 0; }
  .song-list li { border: 1px solid #d5e3f2; border-radius: .375rem; padding: 1rem; margin-bottom: .75rem; overflow-wrap: anywhere; }
  .song-list strong { display: block; line-height: 1.6; }
  .song-list .hint { margin-top: .2rem; }
  .song-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: .25rem; }
  .song-actions a { font-size: .9375rem; padding: .65rem 0; }
  .song-form { margin-top: 1.5rem; }
  .song-form h3 { font-size: 1.1rem; line-height: 1.5; }
  .contact-list { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .875rem; }
  .contact-card { padding: 1rem; border: 1px solid #d5e3f2; border-radius: .375rem; background: #fcfdff; }
  .contact-card .contact-role { margin: 0 0 .4rem; color: var(--muted); font-size: .8125rem; line-height: 1.5; }
  .contact-card h3 { font: 500 1.65rem/1.3 var(--serif); color: #295886; margin: 0; }
  .contact-phone { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; font-size: .9375rem; line-height: 1.5; text-decoration: none; }
  .contact-phone span:last-child { white-space: nowrap; }
  .contact-phone:hover { text-decoration: underline; }
  @media (max-width: 560px) { .contact-list { grid-template-columns: minmax(0, 1fr); } }
  .language-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; }
  .language-option { padding: 1.25rem .75rem; background: #eff5fc; color: var(--accent); border: 1px solid var(--line); border-radius: .375rem; cursor: pointer; font-weight: 700; font-size: 1rem; }
  .language-option:hover { background: #e1ecf8; border-color: var(--accent); }
  .language-switcher { display: flex; justify-content: center; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid #d5e3f2; }
  .language-switcher button { border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: .875rem; padding: .625rem; border-radius: .375rem; }
  .language-switcher button[aria-pressed=true] { color: var(--accent); background: #eff5fc; font-weight: 700; }
  .language-switcher button:hover { text-decoration: underline; text-underline-offset: 4px; }
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
  .admin { width: min(calc(100% - 3rem), 80rem); padding: clamp(1.5rem, 4vw, 4rem); margin: 2.75rem auto; background: #fff; border: 3px double var(--line); box-shadow: 0 15px 60px #2f609419; }
  .admin h1, .admin .intro, .admin .eyebrow { text-align: left; }
  .admin h1 { font-size: clamp(2.25rem, 4vw, 3.5rem); }
  .admin-header { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
  .admin-header .primary { width: auto; }
  .stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 2rem 0; }
  .stat { background: #f0f6fc; border: 1px solid #d1e0f0; border-radius: .375rem; padding: 1.25rem; }
  .stat strong { display: block; font: 500 3rem var(--serif); color: var(--accent); }
  .stat span { font-size: .875rem; line-height: 1.5; }
  .table-wrap { overflow-x: auto; }
  table { border-collapse: collapse; width: 100%; font-size: 1rem; text-align: left; }
  th { font-size: .875rem; background: #edf4fc; }
  th, td { padding: 1rem; border-bottom: 1px solid #d9e4f0; vertical-align: top; }
  caption { text-align: left; font-weight: 700; padding-bottom: 1rem; }
  .pagination { display: flex; gap: 1.5rem; flex-wrap: wrap; margin-top: 1.25rem; font-size: 1rem; }
  @media (max-width: 760px) {
    .shell { width: calc(100% - 2rem); margin: 1rem auto; padding: 1.5rem 1.5rem 2rem; border-radius: .875rem; }
    .shell::before { inset: 6px; border-radius: .5rem; }
    .invitation { margin-bottom: 1.5rem; }
    .brand { font-size: clamp(2.35rem, 7.5vw, 3rem); }
    .invitation-date { font-size: 1.25rem; }
    .venue-art { width: 9rem; height: 5.55rem; margin-top: .5rem; }
    .invitation-label { font-size: .875rem; letter-spacing: .14em; }
    h1 { font-size: 2.25rem; }
    .choice { padding: 1rem; }
    .schedule-step { grid-template-columns: minmax(0, 1fr); gap: 1rem; text-align: center; }
    .admin { width: calc(100% - 2rem); margin: 1rem auto; }
    .stats { grid-template-columns: minmax(0, 1fr); }
  }
  @media (max-width: 420px) { .venue-art { display: none; } }
  @media (prefers-reduced-motion: reduce) { * { transition: none !important; } }