@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=Nunito+Sans:wght@400;600;700;800&display=swap');

:root { --paper:#fbf7eb; --ink:#084b4d; --muted:#5c7a79; --line:#d7e6dd; --rust:#ed7188; --teal:#0aa2a9; --deep-teal:#087d83; --hand:'Kalam','Segoe Print',cursive; --sans:'Nunito Sans',ui-sans-serif,system-ui,sans-serif; }
* { box-sizing:border-box; }
html,body { width:100%; min-height:100%; margin:0; }
body { min-width:0; overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:var(--sans); }
body.rules-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
.upload-shell { min-height:100svh; display:flex; flex-direction:column; }
.upload-header { flex:0 0 76px; display:flex; align-items:center; justify-content:space-between; width:min(1320px,100%); margin:0 auto; padding:0 34px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:10px; font-size:11px; line-height:.98; font-weight:700; letter-spacing:.1em; }
.brand em, h1, .client-upload-success h3 { font-family:var(--hand); font-weight:700; letter-spacing:0; }
.brand em { color:var(--teal); }
.brand-mark { width:13px; height:13px; display:inline-block; background:var(--teal); transform:rotate(45deg); }
.back-link { color:var(--muted); font-size:11px; font-weight:600; }
.back-link:hover { color:var(--rust); }
.upload-main { flex:1; display:grid; grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr); align-items:center; gap:clamp(48px,7vw,110px); width:min(1320px,100%); min-width:0; margin:0 auto; padding:clamp(46px,7vh,92px) 34px clamp(36px,6vh,64px); }
.upload-intro, .form-card { min-width:0; }
.eyebrow { display:flex; align-items:center; gap:8px; color:var(--deep-teal); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.eyebrow i { width:9px; height:9px; display:inline-block; border-radius:50%; background:var(--rust); box-shadow:4px 3px 0 var(--teal); }
.event-date { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 12px; margin-top:13px; color:var(--muted); }
.event-date span { font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.event-date strong { color:var(--ink); font:700 19px/1 var(--hand); letter-spacing:.01em; white-space:nowrap; }
h1 { margin:26px 0 22px; color:var(--teal); font-size:clamp(62px,7.4vw,104px); line-height:.9; letter-spacing:-.035em; transform:rotate(-1deg); }
h1 em { color:var(--rust); white-space:nowrap; }
.upload-intro p { max-width:340px; color:#766e65; font-size:16px; line-height:1.65; }
.upload-trust { display:grid; grid-template-columns:auto 1fr; gap:10px 14px; margin-top:38px; width:max-content; color:var(--muted); font-size:11px; }
.upload-trust span:nth-child(odd) { color:var(--rust); font-weight:700; }
.form-card { padding:42px clamp(30px,4.4vw,58px); background:var(--teal); color:#fffdf4; box-shadow:20px 22px 0 #084b4d1a; border-radius:30px; }
.form-topline { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-bottom:20px; border-bottom:1px solid #f8f0e650; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.form-topline span:last-child { color:#e8c5b4; font-size:11px; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:28px 0 34px; }
.field-grid .full-field { grid-column:1 / -1; }
label { display:grid; gap:10px; font-size:13px; font-weight:600; }
.optional-field { color:#e8c5b4; font-size:11px; font-weight:500; }
input { width:100%; padding:16px 0; border:0; border-bottom:1px solid #f8f0e675; outline:0; color:var(--paper); background:transparent; font:inherit; font-size:1em; }
input::placeholder { color:#e4c5b5; }
input:focus { border-color:var(--paper); }
.upload-heading { margin-bottom:18px; }
.upload-zone { min-height:220px; display:grid; place-items:center; align-content:center; gap:12px; padding:20px; border:1px dashed #fffdf4cc; background:var(--deep-teal); cursor:pointer; text-align:center; transition:background .2s ease,border-color .2s ease; border-radius:22px; }
.upload-zone:hover, .upload-zone.is-dragging, .upload-zone.has-file { border-color:var(--paper); background:#066d73; }
.upload-zone input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.upload-icon { display:grid; place-items:center; width:50px; height:50px; border:1px solid #f8f0e6aa; border-radius:50%; color:var(--paper); font-size:26px; line-height:1; }
.upload-zone strong { max-width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; }
.upload-zone > span:last-child { color:#e8c5b4; font-size:12px; }
.consent-row { display:grid; gap:8px; margin:18px 0; }
.consent-label { display:flex; grid-template-columns:none; align-items:flex-start; gap:10px; margin:0; color:#f1d9cc; font-size:13px; line-height:1.45; }
.consent-label input { flex:none; width:17px; height:17px; margin:0; accent-color:var(--paper); }
.rules-trigger { width:max-content; padding:0; border:0; background:transparent; color:#f7dfd3; cursor:pointer; font:700 13px 'DM Sans',sans-serif; text-decoration:underline; text-underline-offset:3px; }
.rules-trigger:hover, .rules-trigger:focus-visible { color:var(--paper); }
.submit-button, .secondary-button { width:100%; display:flex; align-items:center; justify-content:center; gap:12px; padding:19px 22px; border:0; border-radius:999px; background:var(--ink); color:var(--paper); cursor:pointer; font:800 15px var(--sans); transition:transform .2s ease,background .2s ease; }
.submit-button:hover, .secondary-button:hover { transform:translateY(-2px); background:#131411; }
.submit-button:disabled { cursor:wait; opacity:.7; transform:none; }
.form-footnote { margin:18px 0 0; color:#f0d7cb; font-size:11px; text-align:center; }
.upload-footer { display:flex; justify-content:space-between; gap:20px; width:min(1320px,100%); min-width:0; margin:0 auto; padding:18px 34px 24px; color:var(--muted); font-size:10px; }
.upload-footer span:first-child { color:var(--rust); font:700 18px var(--hand); }
.client-form-error { color:#fff1e8; margin:12px 0 0; font-size:10px; line-height:1.5; }
.client-upload-success { color:var(--paper); padding:20px 0; }
.client-upload-success h3 { margin:16px 0 12px; font-size:clamp(30px,4vw,50px); line-height:.95; }
.client-upload-success p { max-width:360px; color:#e5cfc0; line-height:1.6; font-size:12px; }
.client-success-mark { display:grid; place-items:center; width:54px; height:54px; border-radius:50%; background:var(--paper); color:var(--rust); font-size:26px; font-weight:700; }
.client-submission-id { font-size:10px !important; opacity:.76; }
.client-upload-success .secondary-button { margin-top:20px; }
.rules-modal { position:fixed; z-index:20; inset:0; display:grid; place-items:center; padding:20px; background:#20211d9c; }
.rules-modal[hidden] { display:none; }
.rules-modal-backdrop { position:absolute; inset:0; }
.rules-modal-card { position:relative; z-index:1; display:flex; flex-direction:column; width:min(720px,100%); max-height:min(760px,calc(100dvh - 40px)); background:var(--paper); color:var(--ink); box-shadow:20px 24px 0 #20211d38; }
.rules-modal-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:24px 28px 18px; border-bottom:1px solid var(--line); }
.rules-modal-header h2 { margin:7px 0 0; font:400 clamp(32px,5vw,54px)/.9 'DM Serif Display',Georgia,serif; }
.rules-modal-close { flex:none; padding:9px 12px; border:1px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; font:700 10px 'DM Sans',sans-serif; }
.rules-modal-close:hover, .rules-modal-close:focus-visible { border-color:var(--rust); color:var(--rust); }
.rules-modal-body { overflow:auto; padding:24px 28px 30px; }
.rules-modal-body p { margin:0 0 18px; color:#665e57; font-size:12px; line-height:1.65; }
.rules-modal-body h3 { margin:23px 0 7px; color:var(--ink); font-size:12px; line-height:1.25; font-weight:700; letter-spacing:.04em; }
.rules-modal-body h3:first-of-type { margin-top:4px; }
@media (max-width:980px) { .upload-main { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(30px,5vw,64px); padding-inline:clamp(20px,4vw,40px); } .upload-header, .upload-footer { padding-inline:clamp(20px,4vw,40px); } }
@media (max-width:760px) { .upload-header { flex-basis:64px; padding:0 20px; } .upload-main { display:block; padding:42px 20px 28px; } .upload-intro { margin-bottom:34px; } .upload-trust { margin-top:24px; } .form-card { box-shadow:10px 12px 0 #20211d12; } .upload-footer { padding:14px 20px 20px; flex-direction:column; gap:7px; } }
@media (max-width:520px) { .upload-header { padding-inline:16px; } .upload-main { padding:34px 16px 24px; } h1 { font-size:clamp(46px,14vw,64px); } .form-card { padding:30px 20px; } .form-topline { gap:10px; font-size:12px; } .form-topline span:last-child { font-size:10px; } .upload-zone { min-height:200px; } .consent-label { overflow-wrap:anywhere; } .rules-modal { padding:10px; } .rules-modal-card { max-height:calc(100dvh - 20px); } .rules-modal-header { padding:20px 18px 15px; } .rules-modal-body { padding:20px 18px 24px; } .rules-modal-body p { font-size:11px; } .upload-footer { padding-inline:16px; } }
@media (max-width:440px) { .field-grid { grid-template-columns:1fr; gap:12px; } h1 { font-size:clamp(42px,14vw,56px); } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }
