:root{--paper:#f5eee2;--ink:#462d20;--muted:#715d4e;--line:#cdbca7;--olive:#555b40;--white:#fffcf7;--serif:Georgia,'Times New Roman',serif;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}a,button,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--olive);outline-offset:4px}button,summary{cursor:pointer}h1,p{margin:0}.skip{position:fixed;top:-100px;background:var(--white);padding:16px;z-index:10}.skip:focus{top:8px}
.masthead{height:66px;display:flex;justify-content:center;align-items:center;border-bottom:1px solid var(--line);margin:0 20px}.monogram{display:inline-flex;gap:12px;align-items:center;justify-content:center;min-height:44px;font-family:var(--serif);font-size:31px;text-decoration:none}.monogram span{font-size:21px;font-style:italic}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.screen{padding:18px 20px 0;margin:0 auto;text-align:center;outline:none;max-width:520px}
.film-frame{width:min(100%,390px,calc((100svh - 268px)*.5625));margin:auto}
.player{position:relative}
video{display:block;width:100%;aspect-ratio:9/16;object-fit:contain;background:#302820;border-radius:3px}
.play-film{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #ffffff80;border-radius:60px;background:#462d20e8;color:var(--white);padding:14px 18px;display:flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;min-height:54px;font-size:13px;box-shadow:0 4px 24px #0003}
.play-symbol{font-size:25px;line-height:1}
.full-invitation{display:block;width:min(100%,410px,calc((100svh - 312px)*.5628));margin:auto}
.full-invitation img{display:block;width:100%;height:auto;object-fit:contain;border-radius:2px}
.next-link{min-height:56px;display:flex;justify-content:space-between;align-items:center;gap:18px;width:min(100%,390px);padding:16px 20px;margin:14px auto 0;background:var(--ink);color:var(--white);border:1px solid var(--ink);border-radius:4px;text-decoration:none;font-size:15px;font-weight:600;transition:background .18s,transform .18s}.next-link:active{transform:scale(.985)}.next-link span{font-size:21px;font-weight:400}
.details-actions{display:flex;gap:20px;justify-content:center;font-size:11px;margin-top:6px}
.details-actions a{min-height:44px;display:flex;align-items:center}
.invitation-screen .next-link{margin-top:4px}
.rsvp-screen{max-width:440px;text-align:left;padding-top:26px}
.rsvp-screen h2{font-family:var(--serif);font-weight:400;text-align:center;font-size:39px;letter-spacing:-.04em;margin:0 0 3px}
.rsvp-screen h2 em{font-weight:400}
.reply-intro{text-align:center}.reply-intro>p{font-size:12px;color:var(--muted);margin:5px 0 0;line-height:1.4}
.reply-bears{height:110px;width:210px;margin:0 auto 10px;overflow:hidden;border-radius:110px 110px 10px 10px}.reply-bears img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 54%}
.name-field label{display:block;font-size:12px;margin-bottom:9px;font-weight:600}
.page-nav{display:flex;justify-content:center;gap:24px;margin:10px 20px 0;padding-top:2px;border-top:1px solid var(--line)}
.page-nav a{min-height:48px;display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent}
.page-nav a span{font-size:9px;letter-spacing:.08em}
.page-nav a[aria-current=page]{border-bottom-color:var(--ink);color:var(--ink);font-weight:600}
form{padding-top:25px}form>label,.form-row label{display:block;font-size:12px;margin-bottom:9px;font-weight:600}input:not([type=radio]),select{height:48px;border:1px solid var(--line);background:var(--white);color:var(--ink);border-radius:3px;padding:0 12px;width:100%;font-size:16px}input::placeholder{color:#826e5b}.form-row{display:grid;grid-template-columns:1.3fr 1fr;gap:12px;margin-top:20px}
fieldset{padding:0;border:0;min-width:0;margin:24px 0 0}legend{padding:0;font-size:12px;font-weight:600;margin-bottom:12px}legend span{font-weight:400;color:var(--muted);margin-left:8px;font-size:11px}.predictions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.predictions label{position:relative;cursor:pointer}.predictions input{position:absolute;opacity:0;width:1px;height:1px}.predictions span{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--line);border-radius:3px;font-size:12px;text-align:center;padding:8px;transition:background .18s}.predictions input:checked+span{background:var(--olive);border-color:var(--olive);color:var(--white)}.predictions input:focus-visible+span{outline:3px solid var(--olive);outline-offset:4px}
.recipient{display:flex;gap:28px}.recipient label{display:inline-flex;gap:9px;align-items:center;min-height:44px;font-size:14px;cursor:pointer}.recipient input{accent-color:var(--olive);height:18px;width:18px;margin:0}.submit{display:flex;justify-content:space-between;align-items:center;min-height:52px;border:1px solid var(--ink);border-radius:3px;padding:15px 18px;background:var(--ink);color:var(--white);width:100%;margin-top:18px;font-size:14px}.form-note,.reply-status{font-size:12px;line-height:1.6;color:var(--muted);margin-top:12px;overflow-wrap:anywhere}

footer{display:flex;justify-content:center;align-items:center;gap:22px;padding:5px 16px 14px;font-size:9px;color:var(--muted)}
footer>a{min-height:44px;display:flex;align-items:center}
.powered-by{font-size:9px;letter-spacing:.04em;margin:0}
.powered-by strong{font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--ink);margin-left:4px}
.credit-page{max-width:640px;margin:80px auto;padding:0 28px}.credit-page h1{font-size:48px;margin:28px 0}.credit-page p{margin:18px 0;font-size:16px;line-height:1.6}.credit-page .text-link{display:inline-flex;align-items:center;min-height:44px;margin-top:28px}[hidden]{display:none!important}

@media(hover:hover){.submit:hover{background:#634631}.predictions label:hover span{border-color:var(--olive)}a:hover{color:var(--olive)}.next-link:hover{background:#634631;color:var(--white)}}
@media(min-width:760px){.masthead{margin:0 auto;max-width:650px;height:72px}.page-nav{max-width:650px;margin:14px auto 0}.screen{padding-top:22px}.film-frame{width:min(100%,390px,calc((100svh - 280px)*.5625))}.full-invitation{width:min(100%,410px,calc((100svh - 330px)*.5628))}.rsvp-screen{padding-top:30px}}
@media(max-width:359px){.screen{padding-left:16px;padding-right:16px}.form-row{grid-template-columns:1fr}.page-nav{gap:17px}.rsvp-screen h2{font-size:35px}.play-film{font-size:12px;padding:12px 14px}}
@media(max-height:570px){.film-frame{width:min(100%,260px)}.full-invitation{width:min(100%,300px)}}
@media(max-width:759px){
  body{--safe:calc(env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));height:100svh;display:grid;grid-template-rows:44px minmax(0,1fr) 44px 24px;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
  .masthead{height:44px;margin:0 16px;border:0}.monogram{font-size:27px}.monogram span{font-size:18px}
  main{min-height:0;overflow:auto}.screen{width:100%;height:100%;padding:0 16px;max-width:none}
  .film-screen,.invitation-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
  .film-screen .film-frame{width:min(100%,calc((100svh - 184px - var(--safe)) * .5625));margin:0 auto}
  .invitation-screen .full-invitation{width:min(100%,calc((100svh - 236px - var(--safe)) * .562799));margin:0 auto}
  .film-screen video,.full-invitation img{border-radius:3px}
  .film-screen .next-link,.invitation-screen .next-link{width:100%;max-width:420px;margin:0;flex-shrink:0;min-height:56px}
  .details-actions{margin:0;gap:20px;flex-shrink:0;min-height:44px}
  .page-nav{margin:0 16px;padding:0;gap:20px}.page-nav a{font-size:13px;min-height:44px}
  footer{padding:0 12px;min-height:24px}
  .rsvp-screen{max-width:440px;padding-top:4px;padding-bottom:12px;display:flex;flex-direction:column;gap:10px}.rsvp-screen h2{font-size:32px;margin:0}.reply-intro{flex-shrink:0}.reply-bears{height:clamp(60px,12svh,110px);margin-bottom:8px}
  form{padding-top:0;flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:10px}form>label,.form-row label,.name-field label{margin-bottom:5px}
  .form-row{grid-template-columns:1.3fr 1fr;gap:10px;margin-top:0}
  input:not([type=radio]),select{height:44px;padding:0 10px}
  fieldset{margin-top:0}legend{margin-bottom:5px}.predictions span{min-height:44px;padding:6px}
  .recipient{gap:26px}.submit{margin-top:0;min-height:48px;padding:12px 16px}
  .form-note,.reply-status{font-size:11px;line-height:1.4;margin-top:7px}.reply-status:empty{display:none}
}
@media(max-width:759px) and (max-height:700px){.reply-bears{display:none}.rsvp-screen{gap:8px;padding-bottom:6px}.rsvp-screen h2{font-size:27px}form{gap:7px}.form-note{margin-top:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
