:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#202124;background:#f4f4f5;font-synthesis:none;--red:#c81036;--muted:#676870}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 15%,#fff 0,transparent 60%),#f4f4f5}button{font:inherit;touch-action:manipulation}button:focus-visible,[tabindex]:focus-visible{outline:3px solid #c81036;outline-offset:5px}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}button:not(:disabled):active{transform:scale(.98)}[hidden]{display:none!important}.page{min-height:100svh;padding:36px 18px max(24px,env(safe-area-inset-bottom));display:flex;align-items:center;flex-direction:column}.brand{margin:0 0 30px}.brand img{display:block;width:190px;height:auto;mix-blend-mode:multiply}.card{width:100%;max-width:480px;background:#fff;border:1px solid #e6e6e9;border-radius:28px;padding:32px 26px 22px;box-shadow:0 16px 60px #24242b07;animation:enter .45s ease both}.eyebrow{display:flex;gap:8px;align-items:center;font-size:10px;letter-spacing:1.8px;font-weight:750;color:#66666f}.eyebrow>span{width:6px;height:6px;border-radius:50%;background:var(--red)}h1{font-size:46px;font-weight:750;letter-spacing:-2.2px;line-height:1.04;margin:21px 0 16px}.accent{color:var(--red)}.intro{font-size:16px;color:var(--muted);line-height:1.6;margin:0;max-width:330px}.steps{display:flex;align-items:center;gap:8px;margin:27px 0;font-size:11px;color:#74757c}.steps>span{display:flex;gap:6px;align-items:center;white-space:nowrap}.steps b{display:grid;place-items:center;border:1px solid #dedee3;width:23px;height:23px;border-radius:50%;font-size:10px;font-weight:600}.steps .current{color:#242429;font-weight:650}.steps .current b{background:#25252b;color:#fff;border-color:#25252b}.steps i{height:1px;flex:1;background:#e8e8ec}.selection-zone{border:1px dashed #dcdce2;border-radius:20px;background:linear-gradient(150deg,#fafafb,#f5f5f7);padding:24px 17px 18px;text-align:center}.photo-art{position:relative;width:114px;height:98px;margin:0 auto 16px}.photo-front,.photo-back{position:absolute;left:20px;top:8px;width:76px;height:80px;border-radius:15px;background:#fff;border:1px solid #e5e5e9;box-shadow:0 8px 18px #22222809;transform:rotate(8deg)}.photo-back{transform:rotate(-12deg);left:7px;top:3px;background:#ececef}.photo-front{display:grid;place-items:center}.photo-front svg{width:58px;height:58px;color:#3e3e46}.art-plus{position:absolute;right:0;bottom:0;background:var(--red);color:#fff;border:4px solid #f6f6f8;border-radius:50%;width:34px;height:34px;font-size:23px;line-height:24px}.zone-title{margin:0 0 5px;font-size:15px;font-weight:650;letter-spacing:-.2px}.zone-copy{font-size:13px;color:var(--muted);margin:0 0 22px}.button{width:100%;min-height:56px;border:0;border-radius:12px;font-size:13px;letter-spacing:.6px;font-weight:750;display:flex;align-items:center;justify-content:center;gap:12px;transition:background .18s,transform .18s,opacity .18s}.primary{background:var(--red);color:#fff;box-shadow:0 5px 12px #c8103612}.primary:hover:not(:disabled){background:#ad0e2e}.button>span[aria-hidden]{font-size:22px;font-weight:400}.limit{font-size:11px;color:#71717a;margin:14px 0 0;line-height:1.5}.privacy{display:flex;align-items:center;justify-content:center;gap:6px;color:#777781;font-size:11px;margin:22px 0 0;line-height:1.5}.privacy svg{width:16px;height:16px;flex:none}footer{text-align:center;font-size:10px;font-weight:700;letter-spacing:1.6px;color:#686871;margin:26px 0 0}footer span{color:var(--red);padding:0 7px}footer div{font-size:11px;letter-spacing:0;font-weight:400;color:#82828a;margin-top:9px}.selection-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:26px}h2{font-size:16px;letter-spacing:-.4px;margin:0}.count{font-size:12px;color:var(--red);font-weight:650;background:#fceef1;border-radius:20px;padding:6px 10px}.selection-help{font-size:12px;color:var(--muted);margin:8px 0 15px}.previews{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:390px;overflow:auto;overscroll-behavior:contain}.photo{position:relative;aspect-ratio:1;border-radius:12px;background:#f0f0f3;overflow:hidden;animation:enter .25s ease both;content-visibility:auto;contain-intrinsic-size:110px}.photo img{width:100%;height:100%;object-fit:cover;display:block}.photo .fallback{display:grid;place-items:center;height:100%;font-size:11px;color:#62626d;padding:10px;text-align:center}.remove{position:absolute;top:0;right:0;width:44px;height:44px;border:0;background:transparent;color:#fff;display:grid;place-items:center}.remove span{background:#202026d9;width:28px;height:28px;border-radius:50%;font-size:21px;line-height:25px}.photo-state{position:absolute;bottom:0;left:0;right:0;background:#24242ddd;color:#fff;font-size:10px;padding:6px;text-align:center}.photo[data-state=failed]{outline:2px solid var(--red);outline-offset:-2px}.photo[data-state=done] .photo-state{background:#1f6653ed}.compact{padding:12px;border-style:solid;background:#fafafb}.compact .photo-art,.compact .zone-title,.compact .zone-copy,.compact .limit{display:none}.compact .button{background:#fff;color:#37373f;box-shadow:none;min-height:48px;border:1px solid #dedee4}.upload-actions{margin-top:18px}.notice{background:#fff1f3;border:1px solid #f3c9d2;color:#8d1d35;border-radius:12px;font-size:13px;line-height:1.55;padding:14px;margin-top:18px;overflow-wrap:anywhere}.progress-panel{margin-top:24px}.progress-heading{display:flex;justify-content:space-between;gap:12px;font-size:13px}.progress-heading strong{color:var(--red);font-variant-numeric:tabular-nums}.progress{height:7px;background:#f0edf0;border-radius:9px;margin:12px 0;overflow:hidden}#bar{height:100%;width:0;background:var(--red);border-radius:9px;transition:width .2s ease}.progress-panel p{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);line-height:1.5;margin:0}.spinner{width:12px;height:12px;border:1.5px solid #e4c5cc;border-top-color:var(--red);border-radius:50%;animation:spin .8s linear infinite;flex:none}.success{text-align:center;padding:12px 0}.success .eyebrow{justify-content:center}.success-icon{width:100px;height:100px;border:1px solid #ead2d8;background:#fcf1f4;border-radius:50%;color:var(--red);margin:38px auto 28px;display:grid;place-items:center;animation:enter .5s ease both}.success-icon svg{width:60px;height:60px}.success-icon path{stroke-dasharray:44;stroke-dashoffset:44;animation:check .5s .2s ease forwards}.success h1{font-size:40px;letter-spacing:-1.7px}.success .intro{margin:0 auto}.success-count{display:inline-block;background:#f5f5f7;padding:8px 14px;border-radius:20px;color:#62626b;font-size:12px;margin:22px 0 30px}.closing{font-size:12px;color:#7b7b85;margin:23px 0 5px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes check{to{stroke-dashoffset:0}}@media(min-width:700px){.page{padding-top:45px;padding-bottom:35px}.brand{margin-bottom:30px}.brand img{width:210px}.card{padding:38px 38px 25px}h1{font-size:52px}.selection-zone{padding-top:26px}.compact{padding:12px}}@media(max-width:359px){.page{padding-left:12px;padding-right:12px}.card{padding:26px 20px 20px}h1{font-size:42px}.steps{gap:5px;font-size:10px}.eyebrow{font-size:9px}.privacy{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.success-icon path{stroke-dashoffset:0}}

/* A generous mobile canvas and an actionable camera illustration. */
.photo-art{display:block;padding:0;border:0;background:transparent;border-radius:18px;-webkit-tap-highlight-color:transparent;transition:transform .2s ease}
.photo-art:not(:disabled):hover .photo-front{border-color:#d4a4b0}
.photo-art .photo-front{animation:camera-welcome 1.4s .25s ease-in-out both}
.photo-art .art-plus{animation:plus-welcome 1.4s .4s ease-in-out both}
@keyframes camera-welcome{0%,100%{transform:translateY(0) rotate(8deg)}45%{transform:translateY(-6px) rotate(2deg)}}
@keyframes plus-welcome{0%,100%{transform:scale(1);box-shadow:0 0 0 0 #c8103600}45%{transform:scale(1.08);box-shadow:0 0 0 7px #c8103610}}
@media(max-width:699px){
  .page{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
  .card{padding-left:18px;padding-right:18px;border-radius:24px}
  .selection-zone{padding-left:12px;padding-right:12px}
  .eyebrow{font-size:9px;letter-spacing:1.25px;line-height:1.6}
  .eyebrow>span{flex-shrink:0}
  .intro{max-width:none}
}
@media(prefers-reduced-motion:reduce){.photo-art .photo-front,.photo-art .art-plus{animation:none!important}}

/* Put the event and photo action first; keep the signature at the bottom. */
.page{padding-top:max(16px,env(safe-area-inset-top))}
footer{margin-top:20px}
.footer-logo{display:block;width:125px;height:auto;margin:0 auto 12px;mix-blend-mode:multiply}
@media(min-width:700px){.page{padding-top:30px}}
@media(max-width:699px){
  .card{padding-top:26px}
  .selection-zone:not(.compact){padding-top:18px}
  .photo-art{margin-bottom:12px}
  .steps{margin-top:22px;margin-bottom:22px}
}
/* A green confirmation with a gentle reveal and a drawn checkmark. */
.success-icon{color:#168344;background:#edf8f1;border-color:#c9e8d5;animation:success-reveal .55s ease-out both}
.success-icon path{animation:check .4s .3s ease-out forwards}
@keyframes success-reveal{from{opacity:0;transform:scale(.88) rotate(-16deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(prefers-reduced-motion:reduce){.success-icon,.success-icon path{animation:none!important}.success-icon path{stroke-dashoffset:0}}
/* A clear blue action for adding photos to an existing selection. */
.compact .button{background:#1769e0;color:#fff;border-color:#1769e0;box-shadow:0 4px 12px #1769e01a}
.compact .button:hover:not(:disabled){background:#1257bf;border-color:#1257bf}
.compact .button:focus-visible{outline-color:#1769e0}

/* Event identity leads; the producer remains a quiet signature below. */
.event-identity{display:flex;align-items:center;gap:12px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid #ededee}
.event-identity>img{display:block;width:76px;height:auto;flex-shrink:0;border-radius:7px}
.event-identity>div{min-width:0}
.event-identity span{font-size:9px;font-weight:650;letter-spacing:1.5px;color:#84848a}
.event-identity p{margin:6px 0 0;font-size:12px;font-weight:550;line-height:1.45;color:#51515a}
.production-credit{display:block;font-size:9px;font-weight:400;letter-spacing:.2px;color:#8b8b92;padding:0;margin-bottom:7px}
footer .production-credit{color:#8b8b92;padding:0}
.footer-logo{width:76px;height:auto;margin:0 auto}
@media(min-width:700px){.event-identity>img{width:84px}.event-identity p{font-size:13px}}