:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#202124;background:#f4f4f5;font-synthesis:none;--red:#1f4e8f;--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 var(--red);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 color-mix(in srgb, var(--red), transparent 93%)}.primary:hover:not(:disabled){background:var(--accent-hover, #25325f)}.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:#eaf1fa;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 transparent}45%{transform:scale(1.08);box-shadow:0 0 0 7px color-mix(in srgb, var(--red), transparent 94%)}}
@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:var(--red);color:#fff;border-color:var(--red);box-shadow:0 4px 12px color-mix(in srgb, var(--red), transparent 90%)}
.compact .button:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}
.compact .button:focus-visible{outline-color:var(--red)}

/* Event identity leads; the producer remains a quiet signature below. */
.event-identity{display:flex;align-items:center;gap:18px;padding-bottom:20px;margin-bottom:22px;border-bottom:1px solid #ededee}
#uploader{container-type:inline-size}
#title{font-size:clamp(25px,calc(10.5vw - 9.24px),41px);font-size:10.5cqw;letter-spacing:-1px;line-height:1.18;margin:24px 0 22px}
#title .title-label{display:block;font-size:.86em;font-weight:650;letter-spacing:-.5px;margin-bottom:8px}
#title strong{display:block;font-weight:800;white-space:nowrap;letter-spacing:-1.1px}
#title .title-year{display:block;font-size:.9em;font-weight:750;letter-spacing:.4px;margin-top:10px}
.eyebrow{line-height:1.6;letter-spacing:1.2px}
.eyebrow>span{flex-shrink:0}
.event-identity>img{display:block;width:84px;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:14px;font-weight:650;line-height:1.35;color:#3d3d45}
.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:92px}.event-identity p{font-size:15px}}

#title strong{white-space:normal;overflow-wrap:anywhere}#title .title-label{font-size:.55em;letter-spacing:0;line-height:1.4}
.setup-notice{font-size:13px;line-height:1.6;padding:12px;border:1px solid #deded9;border-radius:10px;background:#f5f5f2;color:#454942}
body{background-color:var(--event-background,#f4f4f5)}

/* Identidad JC Villa: rojo, negro, blanco y gris. */
.brand-header{margin:0 0 24px;text-align:center}.brand-header img{display:block;width:210px;max-width:65vw;height:auto;mix-blend-mode:multiply}.event-identity span{color:#666}.setup-notice{background:#f7f7f7;border-color:#dedede;color:#555}

/* Presentación del torneo; colores tomados del SVG oficial de COPARMEX. */
#title{font-size:clamp(27px,7vw,38px);line-height:1.15;letter-spacing:-.8px}
#title .title-label{font-size:14px;letter-spacing:1.2px;margin-bottom:10px}
.event-venue{font-size:12px;line-height:1.6;color:var(--muted);margin:12px 0 0}
.production-credit{max-width:280px;margin:0 auto 10px;line-height:1.6}
.event-identity span{font-size:12px;letter-spacing:1.2px}

/* Logotipo oficial completo, sin filtros ni recortes. */
.event-identity{justify-content:center;padding-bottom:10px;margin-bottom:18px}
.event-identity>img{width:180px;max-width:65%;height:auto;object-fit:contain;border-radius:0}
.event-identity>div{display:none}

/* Fotografías del campo y detalles discretos del torneo. */
.page{background:linear-gradient(155deg,#edf3f7 0%,#f7f9f6 65%,#edf3ef 100%)}
.event-identity{padding:0;margin-bottom:14px;border:0}
.event-identity>img{width:120px}
.golf-cover{position:relative;overflow:hidden;border-radius:14px;margin-bottom:22px;background:#244b3b}
.golf-cover img{display:block;width:100%;height:150px;object-fit:cover;object-position:50% 63%}
.golf-cover:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#102e32c9);pointer-events:none}
.golf-cover>span{position:absolute;bottom:13px;left:15px;z-index:1;color:#fff;font-size:9px;letter-spacing:1.4px;font-weight:650}
.eyebrow>span{background:#46745a}
.selection-zone{background:linear-gradient(145deg,#f7faf8,#eef4f1);border-color:#cddbd3}
.photo-art{width:114px;height:98px;margin:0 auto 16px}
.photo-front,.photo-back{width:76px;height:80px;left:20px;top:8px;border-radius:15px}
.photo-back{left:7px;top:3px}.photo-front svg{width:58px;height:58px}.art-plus{width:34px;height:34px;font-size:23px;line-height:24px;right:0;bottom:0}
#title{margin:16px 0 12px}#title .title-label{display:none}
.steps{margin:20px 0}.event-venue{color:#42644f}
@media(max-width:699px){.card{padding-top:14px}.event-identity>img{width:100px}.golf-cover img{height:120px}.golf-cover{margin-bottom:18px}.selection-zone:not(.compact){padding-top:14px}.intro{font-size:14px;line-height:1.55}.setup-notice{font-size:12px;padding:9px}.zone-copy{margin-bottom:14px}}

/* Pending queue status uses the existing layout and palette. */
#uploadActions #upload{background:transparent;color:var(--red);box-shadow:none;border:1px solid currentColor;min-height:48px}
#status{font-weight:650}
#progressHint{line-height:1.55}

.video-uploader{margin-top:24px;padding-top:22px;border-top:1px solid #e6e6e9}
.video-pick{background:transparent;color:var(--red);border:1px solid currentColor;min-height:48px;box-shadow:none}
.video-name{overflow-wrap:anywhere;font-size:12px;color:var(--muted)}
#videoProgress{width:100%;height:8px;margin-top:14px;accent-color:var(--red)}
#videoStatus{display:block;font-size:14px;line-height:1.4}
#videoHint{font-size:12px;line-height:1.5}

/* La acción de compartir precede a la información y la fotografía del campo. */
.event-identity{margin-bottom:4px}.event-identity>img{width:92px}
#title{font-size:clamp(25px,6vw,34px);margin:10px 0 18px}
#uploader>.eyebrow{display:none}
#uploader>.intro{margin-top:20px;font-size:13px;line-height:1.55}
.selection-zone:not(.compact) .photo-art{display:block}
.selection-zone:not(.compact) .zone-copy{display:block;margin-bottom:18px}
.selection-zone .zone-title{margin-bottom:5px}
.selection-zone{padding:20px 16px}
.golf-cover{margin-top:24px;margin-bottom:0}
.media-choice{width:min(420px,calc(100% - 32px));padding:24px;border:1px solid #dce3ea;border-radius:20px;color:#202124;background:#fff}
.media-choice::backdrop{background:#10223a88}
.media-choice-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.media-choice-heading h2{font-size:20px;line-height:1.3}
.media-choice-heading button{width:44px;height:44px;flex:none;border:0;border-radius:50%;background:#f1f4f7;font-size:26px;color:#25325f}
.media-choice>p{font-size:12px;line-height:1.6;color:#626872;margin:9px 0 22px}
.media-choice>p:last-child{margin-bottom:0}
@media(max-width:699px){.page{padding-top:10px}.card{padding-top:8px}.event-identity>img{width:84px}.selection-zone:not(.compact){padding:18px 14px}#title{margin:6px 0 16px}.golf-cover img{height:110px}}

/* Nombre oficial con una bandera de golf discreta. */
.tournament-heading{display:flex;align-items:center;justify-content:center;gap:10px;margin:8px 0 6px}
.golf-mark{width:30px;height:38px;flex:none}
.tournament-heading #title{margin:0;min-width:0;font-size:clamp(25px,6.7vw,34px)}
@media(max-width:359px){.tournament-heading{gap:8px}.golf-mark{width:30px}.tournament-heading #title{font-size:25px}}

#uploader>.event-venue{margin:0 0 20px;text-align:center;font-size:12px;line-height:1.5;color:#626e69}

/* Documentos públicos y enlaces legales discretos. */
.legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 18px;margin:0 0 10px;letter-spacing:0;font-size:12px;font-weight:400}
.legal-links a,.legal-document a{color:var(--red);text-underline-offset:3px}
.legal-links a{display:inline-flex;align-items:center;min-height:44px}
.legal-links a:focus-visible,.legal-document a:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.legal-document{max-width:760px;line-height:1.75;animation:none;overflow-wrap:anywhere}
.legal-document h1{font-size:clamp(26px,7vw,36px);line-height:1.2;letter-spacing:-.6px;margin:24px 0 12px}
.legal-document h2{font-size:19px;line-height:1.4;margin:28px 0 10px}
.legal-document p,.legal-document li{font-size:15px}
.legal-document ul{padding-left:22px}
.legal-document .legal-meta{font-size:13px;color:var(--muted)}
.legal-document .legal-review{padding:14px 16px;border:1px solid #cddbd3;border-radius:12px;background:#f7faf8;font-size:14px}
.legal-document .legal-back{display:inline-flex;align-items:center;min-height:44px;font-size:14px}

/* Encabezado del cargador: campo suavizado y logotipo oficial nítido. */
.upload-header{position:relative;isolation:isolate;display:grid;place-items:center;height:148px;overflow:hidden;border-radius:18px;margin:0 0 20px;background:#42644f}
.upload-header-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:blur(3px);transform:scale(1.08);z-index:-2}
.upload-header::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#102e3238,#ffffff12);z-index:-1}
.upload-header .event-identity{margin:0;padding:0;border:0}
.upload-header .event-identity>img{display:block;width:104px;max-width:none;height:auto;padding:9px;border-radius:14px;background:#fffffff2;box-shadow:0 5px 20px #102e3226}
@media(max-width:699px){.upload-header{height:126px;border-radius:16px;margin-bottom:18px}.upload-header .event-identity>img{width:90px;padding:8px;border-radius:12px}}