:root{color-scheme:dark;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f8f6f1;background:#1e1011}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:radial-gradient(ellipse at 12% 12%,#3b202266,transparent 48%),radial-gradient(ellipse at 90% 60%,#51303345,transparent 50%);min-height:100vh}main{max-width:900px;margin:auto;padding:28px 32px 36px}header{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:750;letter-spacing:2px;color:#d2cbbb}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border:1px solid #ffffff30;border-radius:10px;font-size:30px;color:#ede2c8}header a{margin-left:auto;font-size:12px;letter-spacing:0;color:#dbd7ce;text-decoration:none}.intro{text-align:center;margin:40px 0 26px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:#c7c2b7;font-weight:700}h1{font-size:clamp(34px,5vw,52px);line-height:1.08;letter-spacing:-2px;margin:14px 0}h1 span{color:#ecdfc3}.intro>p:last-child{color:#c8c0ae;font-size:15px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #ede0c4;outline-offset:5px}.upload-panel{padding:10px;background:#ffffff05;border:1px solid #ffffff16;border-radius:22px;box-shadow:0 20px 70px #00000020}#dropzone{width:100%;min-height:210px;position:relative;display:grid;place-items:center;border:1px dashed #937b7d6b;border-radius:14px;background:#2c161880;color:#ece5d4;padding:20px;transition:background .15s,border-color .15s}#dropzone:hover,#dropzone.dragging{background:#432427;border-color:#ecdfc3}#uploadPrompt{display:grid;justify-items:center;gap:12px}#uploadPrompt strong{font-size:20px;color:#f8f7f4}#uploadPrompt>span{font-size:14px;color:#c7bfae}#uploadPrompt u{text-decoration-color:#8e6569;text-underline-offset:4px;color:#eee6d4}#photoPreview{width:100%;height:210px;object-fit:contain;border-radius:9px}#replace{position:absolute;bottom:12px;right:12px;background:#1e1011ee;border:1px solid #ffffff40;padding:9px 12px;border-radius:9px;font-size:12px}.file-meta{display:flex;justify-content:space-between;gap:12px;padding:12px 8px 4px;font-size:11px;color:#c4bba7}#fileName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#formats{flex-shrink:0}.rights{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.5;color:#ccc4b1;margin:17px 5px 0;cursor:pointer}.rights input{width:19px;height:19px;margin:0;flex-shrink:0;accent-color:#e6d9bd}#message{font-size:13px;color:#ffcca7;line-height:1.5;margin:8px 5px;min-height:0}#message:empty{display:none}.section-label{display:flex;justify-content:space-between;align-items:center;margin:27px 0 13px;gap:12px}h2{font-size:16px;letter-spacing:-.3px;margin:0}.section-label>span{font-size:11px;color:#bbb29d}.collections{display:grid;grid-template-columns:1fr 1fr;gap:14px}.collection{display:flex;text-align:left;gap:16px;padding:23px 20px;border:1px solid #ffffff24;border-radius:18px;color:#f5f2ea;background:linear-gradient(130deg,#42292b95,#2e1a1cb0);transition:transform .15s,border-color .15s}.collection:hover{transform:translateY(-2px);border-color:#bfb49b}.storybound{background:linear-gradient(130deg,#4a303299,#362426b0);color:#fbf6eb}.storybound:hover{border-color:#d5c5a2}.collection-icon{font-size:30px;line-height:1.2;color:#e7dabd}.storybound .collection-icon{color:#efddb6}.collection-copy{display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:1;min-width:0}.collection-copy>strong{font-size:23px;letter-spacing:-.6px}.collection-copy>span:not(.destination){font-size:12px;color:#cec8bb;line-height:1.5}.collection-copy small{font-size:11px;line-height:1.5;color:#d6cdb9}.destination{padding-top:16px;margin-top:auto;font-size:12px;font-weight:650;display:flex;justify-content:space-between;gap:15px;width:100%}.destination>span{font-size:17px}.footnote{font-size:11px;color:#b6ac95;text-align:center;line-height:1.6;margin:20px 0 10px}details{text-align:center;font-size:11px;color:#bcb39e}summary{cursor:pointer;width:max-content;margin:auto}details p{line-height:1.6;max-width:500px;margin:10px auto}@media(max-width:580px){main{padding:18px 18px 26px}.intro{margin:27px 0 22px}h1{letter-spacing:-1.3px}.intro>p:last-child{font-size:13px}.eyebrow{font-size:9px}#dropzone{min-height:175px}#photoPreview{height:180px}.file-meta{flex-direction:column;gap:5px}.collections{grid-template-columns:1fr;gap:10px}.collection{padding:17px 18px}.collection-copy{gap:6px}.collection-copy>strong{font-size:21px}.destination{padding-top:7px}.section-label{margin-top:24px}.section-label>span{font-size:10px}h2{font-size:14px}header{letter-spacing:1px}header a{font-size:10px}.rights{font-size:11px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Frosted glass surfaces; opaque fallback remains readable without backdrop-filter. */
body{background:#231012;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 48% 55% at 17% 46%,#7d272f7a,transparent 78%),radial-gradient(ellipse 42% 60% at 86% 65%,#a5535a7a,transparent 77%),radial-gradient(ellipse 36% 45% at 62% 0%,#8c333b55,transparent 80%),linear-gradient(130deg,#291113,#201011 70%)}
.upload-panel,.collection{position:relative;background:linear-gradient(135deg,#e4dac51b,#f0e5cd08 52%,#efddb51a),#3c2023e6;border:1px solid #fbf6ea38;border-top-color:#fdfaf366;border-bottom-color:#d2c5a72b;box-shadow:inset 0 1px 0 #ffffff1c,inset 0 -1px 0 #decea90c,0 16px 42px #11060730}
.upload-panel::before,.collection::before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,#faf4e880,transparent);pointer-events:none}
.upload-panel{border-radius:24px}
#dropzone{background:linear-gradient(135deg,#faf4e608,#f6edd703);border-color:#ede4d145;box-shadow:inset 0 1px 16px #ffffff03}
#dropzone:hover,#dropzone.dragging{background:#efddb612;border-color:#ecdfc3}
.collection{background:linear-gradient(130deg,#e7dabd18,#ffffff04),#3b2123e8;overflow:hidden}
.storybound{background:linear-gradient(130deg,#f6ecd51c,#ffffff04),#492f31e8}
.collection:hover{background-color:#513235ee;box-shadow:inset 0 1px 0 #ffffff30,0 16px 40px #11060740}
.storybound:hover{background-color:#604043ee}
.collection-icon{display:grid;place-items:center;flex-shrink:0;width:43px;height:43px;border-radius:13px;background:linear-gradient(145deg,#f8f0df21,#faf5e907);border:1px solid #faf4e62e;box-shadow:inset 0 1px 0 #ffffff24,0 5px 12px #0000000f;font-size:26px}
.storybound .collection-icon{background:linear-gradient(145deg,#f6edd729,#faf5e908);border-color:#faf4e738}
.brand-mark{background:linear-gradient(145deg,#e9dec61f,#ffffff03);border-color:#f4eee133;box-shadow:inset 0 1px 0 #ffffff1a}
.file-meta,.footnote{color:#d5cbb6}.rights{color:#ddd5c3}.intro>p:last-child{color:#dad3c2}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .upload-panel,.collection{backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%)}
 .upload-panel{background:linear-gradient(135deg,#e4dac51b,#f0e5cd08 52%,#efddb51a),#31171950}
 .collection{background:linear-gradient(130deg,#e7dabd20,#ffffff05),#391c1f40}
 .storybound{background:linear-gradient(130deg,#f6ecd524,#ffffff05),#40262850}
 .collection:hover{background-color:#51323580}.storybound:hover{background-color:#60404380}
}
@media(prefers-reduced-transparency:reduce){.upload-panel,.collection{backdrop-filter:none;-webkit-backdrop-filter:none;background:#492629}.collection{background:#41282a}.storybound{background:#4f3436}}

/* Polished glass: directional reflections and a sharp beveled rim. */
.upload-panel,.collection{border-top-color:#fdfbf699;border-left-color:#f9f1e165;border-right-color:#f5ead042;border-bottom-color:#e8d8b438;box-shadow:inset 0 1px 0 #ffffff5c,inset 1px 0 0 #ffffff16,inset 0 -1px 0 #f7efdc14,0 18px 45px #10050655}
.upload-panel::before,.collection::before{left:5%;right:5%;height:2px;background:linear-gradient(90deg,transparent,#fdfaf3e6 22%,#ffffff80 45%,transparent 83%);border-radius:100%;filter:drop-shadow(0 1px 3px #f5ead050)}
.upload-panel::after,.collection::after{content:"";position:absolute;inset:1px;pointer-events:none;border-radius:inherit;background:linear-gradient(117deg,transparent 8%,#ffffff03 17%,#fbf6ea2b 18%,#ffffff0a 30%,transparent 31%,transparent 63%,#ffffff0b 64%,transparent 78%);box-shadow:inset 0 1px 12px #fcf8ef09}
.upload-panel{background:linear-gradient(167deg,#faf5e924 0%,#f8f1e00a 27%,#240b0d1c 28%,#38121526 76%,#f7eeda16 100%),#31171950}
#dropzone{background:linear-gradient(160deg,#ffffff0d,transparent 42%,#210a0c12);border-color:#f9f1e03b;border-style:solid;box-shadow:inset 0 1px 0 #ffffff13,inset 0 10px 32px #1607080f}
.collection{background:linear-gradient(166deg,#faf4e72c,#f7eeda0c 39%,#3010131a 40%,#35121540 79%,#f7eed914),#37181b60}
.storybound{background:linear-gradient(166deg,#fbf6eb30,#f8efdc0d 39%,#381c1f1a 40%,#3d252740 79%,#f7efdc18),#40262860}
.collection-icon,.brand-mark{background:linear-gradient(155deg,#fdfaf440,#eee6d311 49%,#38131633 50%,#eddebd12);border-top-color:#ffffff8c;box-shadow:inset 0 1px 0 #ffffff42,0 4px 10px #00000020}
.storybound .collection-icon{background:linear-gradient(155deg,#fcf8ef45,#f8f0de15 49%,#3e242633 50%,#f6ebd415);border-top-color:#ffffff8c}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.upload-panel,.collection{backdrop-filter:blur(9px) saturate(145%);-webkit-backdrop-filter:blur(9px) saturate(145%)}}
@media(prefers-reduced-transparency:reduce){.upload-panel,.collection{backdrop-filter:none;-webkit-backdrop-filter:none;background:#492629}.collection{background:#41282a}.storybound{background:#4f3436}.upload-panel::after,.collection::after{opacity:.3}}

/* Sportify has one destination. */
.collections{grid-template-columns:minmax(0,1fr)}

/* Sportify signature palette: garnet glass, warm gold, and ivory lettering. */
:root{--sportify-red:#B82032;--sportify-gold:#D9AF50;--sportify-gold-light:#F5D98C;--sportify-ground:#1B0C10;--sportify-text:#FFF5E5;--sportify-muted:#D3BDB2}
body{background:var(--sportify-ground);color:var(--sportify-text)}
body::before{background:radial-gradient(ellipse at 12% 42%,#b8203255,transparent 58%),radial-gradient(ellipse at 90% 70%,#d9af502b,transparent 55%),var(--sportify-ground)}
:focus-visible{outline-color:var(--sportify-gold-light)}

:root{background:var(--sportify-ground)}
.brand-mark,h1 span,.collection-icon,#uploadPrompt u{color:var(--sportify-gold-light)}
header,.eyebrow,.rights,.file-meta,.footnote,.intro>p:last-child{color:var(--sportify-muted)}
.collection{background:linear-gradient(166deg,#f5d98c30,#b8203220 39%,#4a101b80 40%,#5c192960 79%,#d9af5018),#3b111bdd;border-color:#d9af5070}
.collection:hover{background-color:#701c2bdd;border-color:var(--sportify-gold)}
#dropzone:hover,#dropzone.dragging{background:#b8203222;border-color:var(--sportify-gold)}
.rights input{accent-color:var(--sportify-gold)}
@media(prefers-reduced-transparency:reduce){.upload-panel{background:#321c22}.collection{background:#531925}}

/* Modern glass: restrained red/gold light behind neutral translucent surfaces. */
:root{--glass-edge:#ffffff24;--glass-rim:#ffffff66;--glass-fill:linear-gradient(135deg,#ffffff14,#ffffff04 48%,#ffffff09);--glass-shadow:inset 0 1px 0 #ffffff24,inset 0 -1px 0 #ffffff08,0 24px 64px #00000040}
body{background:#100d12}
body::before{background:radial-gradient(ellipse 38% 52% at 4% 30%,#bd203c80,transparent 78%),radial-gradient(ellipse 30% 46% at 96% 68%,#d9af5055,transparent 80%),radial-gradient(ellipse 42% 30% at 58% -5%,#c6bca22b,transparent 82%),linear-gradient(135deg,#18121a,#100d12 65%)}
button,a,input,select,textarea{ -webkit-tap-highlight-color:transparent }
button{transition:background .18s,border-color .18s,box-shadow .18s}
:focus-visible{outline:2px solid var(--sportify-gold-light);outline-offset:3px}
@media(prefers-reduced-motion:reduce){button{transition:none}}

header .brand-mark,.collection-icon{background:linear-gradient(145deg,#ffffff26,#ffffff05);border:1px solid var(--glass-edge);border-top-color:var(--glass-rim);box-shadow:inset 0 1px 0 #ffffff40,0 8px 20px #0003}
.upload-panel,.collection{background:var(--glass-fill),#29232bed;border:1px solid var(--glass-edge);border-top-color:var(--glass-rim);border-radius:24px;box-shadow:var(--glass-shadow)}
.upload-panel::before,.collection::before{height:1px;left:8%;right:8%;background:linear-gradient(90deg,transparent,#fff9,transparent);filter:none}
.upload-panel::after,.collection::after{background:linear-gradient(125deg,#ffffff06,transparent 35%,#ffffff03 70%,transparent);box-shadow:none}
#dropzone{background:linear-gradient(135deg,#ffffff05,#08070d30);border:1px dashed #ffffff30;border-radius:17px;box-shadow:inset 0 2px 18px #00000012}
#dropzone:hover,#dropzone.dragging{background:#ffffff09;border-color:var(--sportify-gold)}
.collection{border-left:2px solid #d9af5080}
.collection:hover{background-color:#49363eee;border-color:#f5d98c80;box-shadow:inset 0 1px 0 #ffffff40,0 24px 64px #0005}
.collection .destination{color:var(--sportify-gold-light)}
header a{padding:9px 12px;border-radius:20px;background:#ffffff08;border:1px solid #ffffff18}
h1 span{background:linear-gradient(110deg,#fff1c4,#e5bf64);background-clip:text;-webkit-background-clip:text;color:transparent}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .upload-panel,.collection{background:var(--glass-fill),#241d264d;backdrop-filter:blur(28px) saturate(125%);-webkit-backdrop-filter:blur(28px) saturate(125%)}
 .collection:hover{background-color:#69424b55}
}
@media(prefers-reduced-transparency:reduce){.upload-panel,.collection{background:#29232b;backdrop-filter:none;-webkit-backdrop-filter:none}.upload-panel::after,.collection::after{display:none}.collection:hover{background:#3e3037}}

/* Polished glass: visible softbox reflections, crisp rims and dark lower faces. */
:root{--polished-face:linear-gradient(160deg,#ffffff38 0%,#ffffff14 28%,#ffffff05 48%,#08050d38 49%,#ffffff03 84%,#fff1ce16 100%);--polished-rim:inset 0 1px 0 #ffffffa6,inset 1px 0 0 #ffffff38,inset -1px 0 0 #fff0cd20,inset 0 -1px 0 #ffffff2b,0 16px 40px #0005}

.upload-panel,.collection{background:var(--polished-face),#38232d80;border-color:#ffffff45;border-top-color:#fff4d9aa;box-shadow:var(--polished-rim);backdrop-filter:blur(12px) saturate(145%);-webkit-backdrop-filter:blur(12px) saturate(145%)}
.upload-panel::before,.collection::before{height:2px;left:5%;right:5%;background:linear-gradient(90deg,transparent,#ffffffee 20%,#fff0c999 60%,transparent);filter:drop-shadow(0 1px 4px #fff3cf66)}
.upload-panel::after,.collection::after{display:block;background:linear-gradient(119deg,transparent 8%,#ffffff03 17%,#ffffff2b 17.3%,#ffffff0b 32%,transparent 32.3%,transparent 74%,#ffeac911 74.3%,transparent 87%);box-shadow:inset 0 0 18px #ffffff07}
#dropzone{background:linear-gradient(155deg,#ffffff16,#ffffff03 45%,#0a06142b 46%);border:1px solid #ffffff38;box-shadow:inset 0 1px 0 #ffffff30,inset 0 -1px 0 #ffffff0d}
.collection:hover{background-color:#75435280;box-shadow:var(--polished-rim),0 0 28px #d9af5012}
.collection-icon,header .brand-mark{background:linear-gradient(155deg,#ffffff66,#ffffff20 48%,#22132288 49%,#ffe3a21f);border-color:#ffffff65;box-shadow:inset 0 1px 0 #ffffffaa,inset 0 -1px 0 #ffffff28,0 5px 12px #0005}
@media(prefers-reduced-transparency:reduce){.upload-panel,.collection{background:var(--polished-face),#35242d;backdrop-filter:none;-webkit-backdrop-filter:none}.upload-panel::after,.collection::after{opacity:.45}}

/* Sportbound identity: condensed athletic display with clear everyday UI type. */
@font-face{font-family:'Teko Sportbound';src:url('/sportbound/assets/brand/teko-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
.sportbound-logo{display:block;width:220px;height:auto;max-width:100%;object-fit:contain}
header .sportbound-home{margin:0;padding:0;border:0;background:none}.intro h1{font-family:'Teko Sportbound',Impact,sans-serif;font-size:clamp(48px,7vw,72px);font-weight:700;letter-spacing:.3px;line-height:.98;text-transform:uppercase}.collection-copy>strong{font-family:'Teko Sportbound',Impact,sans-serif;font-size:30px;letter-spacing:.4px}
@media(max-width:580px){.sportbound-logo{width:190px}}
