@font-face{font-family:Anton;src:url('/fonts/Anton-Regular.ttf') format('truetype');font-display:block}
body[data-secondary-font=dm]{--sans:DM,Helvetica,sans-serif}

body[data-synthesis=true] .site-header nav>a{display:none}
body[data-dark=true] .version-tabs button[aria-selected=true]:hover{background:var(--synthesis-accent);color:#111}

/* Selected headline only. The desk, form, button, arrow and sketch use Original. */
body[data-synthesis=true] .hero{padding-top:32px;overflow:hidden}
body[data-synthesis=true] .hero h1{font:400 clamp(76px,10vw,144px)/.98 Anton,sans-serif;letter-spacing:-.025em;text-transform:uppercase;text-wrap:initial;margin:0 auto 24px;max-width:none}
body[data-synthesis=true] .hero-lead{display:block;font-size:.38em;margin-bottom:5px;letter-spacing:.02em}
body[data-synthesis=true] .hero h1 em{display:block;font-family:inherit;font-size:.27em;font-weight:400;font-style:normal;letter-spacing:-.01em;line-height:1.1;background:var(--synthesis-accent);color:#111;transform:rotate(-2deg);padding:5px 14px;margin:12px auto 0;width:max-content;max-width:100%}
body[data-synthesis=true] .hero h1 em::after{display:none}
body[data-composition=blue] .hero h1 em{color:#fff}

/* Blue's lower-page layout, scale and typography across every palette. */
body[data-synthesis=true] .gallery-section{padding-top:42px;border-top:2px solid var(--ink)}
body[data-synthesis=true] .gallery-section-title{font-weight:700;text-transform:uppercase;letter-spacing:-2.5px;font-size:clamp(40px,5vw,68px);text-align:left}
body[data-synthesis=true] .gallery-heading{justify-content:center;text-align:center}
body[data-synthesis=true] .gallery-title-pill{font-size:17px;padding:7px 11px;background:#111;color:#fff;border-radius:0;font-weight:700}
body[data-synthesis=true] .shoe-detail{box-shadow:0 0 0 1px #bbb;width:40%}
body[data-synthesis=true] .sales-proof strong{font-weight:700;letter-spacing:-5px;background:none;border-bottom:8px solid var(--synthesis-accent)}
body[data-synthesis=true] .sales-proof div>span{font-size:28px;text-transform:uppercase;font-weight:700}
body[data-synthesis=true] .section-heading{text-align:center}
body[data-synthesis=true] .section-heading h2{font-weight:700;text-transform:uppercase;font-size:clamp(38px,5vw,65px);letter-spacing:-2.5px}
body[data-synthesis=true] .section-heading h2 em{font-family:var(--sans);font-style:normal;font-weight:700}
body[data-synthesis=true] .profit-section{border:2px solid var(--ink);border-radius:0;grid-template-columns:1fr 1fr}
body[data-synthesis=true] .profit-copy h2{font-weight:700}
body[data-synthesis=true] .profit-copy>.eyebrow{text-transform:uppercase;font-weight:700}
body[data-synthesis=true] .total-profit>strong{font-weight:700}
body[data-synthesis=true] .process-steps h3{font-weight:700;text-transform:uppercase;font-size:27px;letter-spacing:-1px}
body[data-synthesis=true] .process-steps h3 span{color:var(--ink)}
body[data-composition=blue] .process-steps h3 span{color:var(--synthesis-accent)}
body[data-dark=true] .process-steps h3 span{color:var(--synthesis-accent)}

/* Keep the two quieter headings from Yellow, including its italic sole. */
body[data-synthesis=true] .faq-section h2{font-weight:400}
body[data-synthesis=true] .synthesis-closing{border:2px solid var(--ink);border-top:9px solid #111;padding:42px;gap:32px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);isolation:isolate}
body[data-synthesis=true] .synthesis-closing .apply-section{position:relative;z-index:3;min-width:0}
body[data-synthesis=true] .apply-section h2{font-weight:400;text-transform:none;letter-spacing:-1.8px;font-size:clamp(40px,4vw,54px)}
body[data-synthesis=true] .apply-section h2 em{font-family:Georgia,serif;font-style:italic;font-weight:400}
body[data-synthesis=true] .apply-section .button{border-radius:0}
body[data-synthesis=true] .synthesis-closing .launch-deliverables{position:relative;z-index:1;min-width:0;padding:0}

/* Transparent image derivatives on the dark palette; originals stay untouched. */
body[data-dark=true] .synthesis-sketch{padding:12px 0 0}
body[data-dark=true] .synthesis-sketch,
body[data-dark=true] .launch-deliverables,
body[data-dark=true] .launch-sole-photo,
body[data-dark=true] .gallery-row .sneaker-card{background:transparent;border-radius:0}
body[data-dark=true] .synthesis-sketch img,
body[data-dark=true] .gallery-row img,
body[data-dark=true] .launch-sole-photo img{mix-blend-mode:normal}
body[data-dark=true] .synthesis-sketch figcaption em,
body[data-dark=true] .sneaker-art-controls span,
body[data-dark=true] .launch-deliverables h2{color:var(--ink)}
body[data-dark=true] .sneaker-art-controls button{background:transparent;color:var(--ink);border-color:#666}
body[data-dark=true] .gallery-title-pill{background:#242424;color:#f5f5f0}
body[data-dark=true] .shoe-detail{background-color:#101010;border-color:#101010}
body[data-dark=true] [data-shoe-id=abbey] .shoe-detail::after{background:#101010}
body[data-dark=true] .process-art{background:#f5f5f0;padding:14px;border-radius:8px}
body[data-dark=true] .process-art img{filter:grayscale(1);mix-blend-mode:multiply}

@media(max-width:650px){
 body[data-synthesis=true] .hero{padding-top:28px}
 body[data-synthesis=true] .hero h1{font-size:clamp(52px,14.5vw,88px);line-height:1;letter-spacing:-.025em;margin-bottom:24px}
 body[data-synthesis=true] .hero-lead{font-size:.5em}
 body[data-synthesis=true] .hero h1 em{font-size:.4em}
 body[data-synthesis=true] .gallery-section-title{font-size:40px}
 body[data-synthesis=true] .gallery-title-pill{font-size:16px}
 body[data-synthesis=true] .section-heading h2{font-size:40px}
 body[data-synthesis=true] .profit-section{grid-template-columns:1fr;border-radius:0}
 body[data-synthesis=true] .process-steps h3{font-size:23px}
 body[data-synthesis=true] .synthesis-closing{padding:30px 25px 25px;gap:10px}
 body[data-synthesis=true] .apply-section h2{font-size:39px}
 body[data-dark=true] .synthesis-sketch{padding:0}
}

.synthesis-sketch figcaption{justify-content:center}


/* A light writing surface balances the dark hero. */
body[data-dark=true] .hero .prompt-box{--ink:#171717;background:#f5f5f0;border-color:#f5f5f0;box-shadow:none;color:#171717}
body[data-dark=true] .hero .prompt-box:focus-within{border-color:var(--synthesis-accent);box-shadow:0 0 0 2px var(--synthesis-accent)}
body[data-dark=true] .hero .prompt-box textarea{color:#171717;caret-color:#171717}
body[data-dark=true] .hero .prompt-box textarea::placeholder{color:#62625e}
body[data-dark=true] .hero .prompt-box :is(button,a):focus-visible{outline-color:#171717}
.wordmark>span{font:700 12px/1 DM,Helvetica,sans-serif;letter-spacing:0;margin:3px 0 0 5px}
.site-footer .wordmark>span{font-size:10px;margin:2px 0 0 4px}
@media(max-width:650px){
 body[data-dark=true] .process-art{padding:6px}
}
/* Handwritten sign-off follows the diagonal sole. */
body[data-synthesis=true] .synthesis-sketch{padding-bottom:22px}
body[data-synthesis=true] .synthesis-sketch figcaption{justify-content:center;padding:0;position:absolute;top:78%;left:52%;width:max-content;max-width:90%;transform:translateX(-50%) rotate(-13deg);z-index:2}
body[data-synthesis=true] .synthesis-sketch figcaption em{transform:none;white-space:nowrap}
body[data-dark=true] .shoe-detail{box-shadow:0 0 0 1px #777}
body[data-headings=anton] :is(.gallery-section-title,.section-heading h2,.section-heading h2 em,.process-steps h3){font-family:Anton,sans-serif;font-weight:400;font-style:normal;letter-spacing:-.015em;text-transform:uppercase;line-height:1.1}
body[data-headings=anton] .gallery-title-pill{font-family:var(--sans);font-weight:700;font-size:19px;letter-spacing:0}

@media(max-width:650px){body[data-synthesis=true] .synthesis-sketch figcaption{padding:0;top:79%;left:54%}body[data-headings=anton] .gallery-title-pill{font-size:18px}}
body[data-synthesis=true] .synthesis-orbit,body[data-synthesis=true] .synthesis-orbit::after{border-color:#bbb}
body[data-dark=true] .synthesis-orbit,body[data-dark=true] .synthesis-orbit::after{border-color:#777}
@media(max-width:400px){body[data-synthesis=true] :is(.browse-drops,.nav-apply)>span{display:none}}

body[data-synthesis=true] .launch-deliverables h2{color:#555}
body[data-dark=true] .launch-deliverables h2{color:var(--ink)}




/* Review controls stay available above the main navigation. */
body[data-synthesis=true] .version-bar{position:sticky;top:0;z-index:30;display:flex;justify-content:center;width:100%;margin:0;padding:7px 4%;background:var(--paper);border:0;border-bottom:1px solid var(--line)}
body[data-synthesis=true] .version-tabs{display:flex;flex-wrap:nowrap;justify-content:center;gap:4px}
body[data-synthesis=true] .version-tabs button{padding:9px 12px;min-height:40px;white-space:nowrap;border-radius:4px}
body[data-synthesis=true] .version-tabs button span{font:14px var(--sans)}
body[data-synthesis=true] .site-header{display:flex;height:auto;min-height:100px;padding:16px 5%;gap:24px;border-bottom:1px solid var(--line)}
body[data-synthesis=true] .site-header .wordmark{font:700 42px/1 DM,Helvetica,sans-serif;letter-spacing:-3px}
body[data-synthesis=true] .site-header nav{display:flex;flex:1;justify-content:flex-end;align-items:center;gap:28px;padding:0;min-width:0}
body[data-synthesis=true] .site-header nav>.browse-drops{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:14px;color:var(--ink)}
body[data-synthesis=true] .nav-apply{white-space:nowrap;font-size:15px}
body[data-synthesis=true] .nav-apply span{margin-left:12px}
.launch-action{display:grid;justify-items:start;gap:9px;min-width:0}
.early-access-note{display:inline-flex;align-items:center;gap:6px;font:400 14px/1.3 DM,sans-serif;color:var(--muted,#686861)}
.early-access-note svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3}
.site-header .launch-action{justify-items:center}
body[data-dark=true] .early-access-note{color:var(--synthesis-accent)}
body[data-synthesis=true] .synthesis-closing .button{width:fit-content;max-width:100%;gap:24px;flex-wrap:nowrap}
body[data-synthesis=true] .synthesis-closing .launch-sole-photo img{width:100%;height:auto;max-height:380px;object-fit:contain;transform:none}
body[data-synthesis=true] .launch-sole-copy{position:relative;inset:auto;transform:none;width:100%;padding:0;text-align:center;pointer-events:none}
body[data-synthesis=true] .synthesis-closing .launch-deliverables{gap:12px}
#creation-dialog .launch-action{justify-items:center}
#creation-dialog .early-access-note{color:#686861}
@media(max-width:800px){
 body[data-synthesis=true] .synthesis-closing{grid-template-columns:minmax(0,1fr);padding:32px;gap:28px}
 body[data-synthesis=true] .synthesis-closing .launch-sole-photo img{max-height:340px}
}
@media(max-width:650px){
 body[data-synthesis=true] .site-header{padding:16px 6%;gap:14px;align-items:center}
 body[data-synthesis=true] .site-header .wordmark{font-size:36px}
 body[data-synthesis=true] .site-header nav{gap:8px 16px;flex-wrap:wrap}
 body[data-synthesis=true] .nav-apply{padding:8px 0;font-size:14px}
 body[data-synthesis=true] .nav-apply span{margin-left:6px}
 body[data-synthesis=true] .version-bar{padding:5px 8px}
 body[data-synthesis=true] .version-tabs{gap:0}
 body[data-synthesis=true] .version-tabs button{padding:9px 8px}
 body[data-synthesis=true] .version-tabs button span{font-size:14px}
 body[data-synthesis=true] .synthesis-closing{padding:28px 24px}
}

/* Match navigation baselines; the early-access note occupies its own row. */
body[data-synthesis=true] .site-header nav{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;gap:9px 28px;flex:initial}
.site-header .launch-action{display:contents}
body[data-synthesis=true] .site-header nav>.browse-drops{grid-column:1;grid-row:1;align-self:center}
body[data-synthesis=true] .nav-apply{grid-column:2;grid-row:1;align-self:center}
.site-header .early-access-note{grid-column:2;grid-row:2;justify-self:start}
body[data-header-cta=solid] .site-header .nav-apply{border:0;border-radius:0;background:var(--action);color:#fff;font-size:15px;padding:12px 18px;min-height:44px;display:inline-flex;align-items:center;justify-content:space-between;gap:18px}
body[data-header-cta=solid] .site-header .nav-apply span{margin:0;font-size:17px;line-height:1}
body[data-header-cta=solid] .site-header .nav-apply:hover{filter:brightness(.85)}
body[data-synthesis=true] .version-bar{gap:12px 28px;flex-wrap:wrap}
.header-style-review{display:flex;align-items:center;gap:8px;font:14px DM,sans-serif}
.header-style-review span{min-width:89px;text-align:center}
.header-style-review button{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:50%;font-size:20px;color:var(--ink)}
body[data-synthesis=true] .synthesis-closing{grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);padding:38px 16px 38px 42px;gap:24px}
body[data-synthesis=true] .synthesis-closing .launch-deliverables{overflow:hidden;position:relative;display:block}
body[data-synthesis=true] .synthesis-closing .launch-sole-photo{padding:40px 18px 50px}
body[data-synthesis=true] .synthesis-closing .launch-sole-photo img{max-height:none;width:100%;height:auto;transform:rotate(-9deg) scale(1.10)}
body[data-synthesis=true] .launch-sole-copy{position:absolute;top:76%;left:52%;width:max-content;max-width:90%;transform:translateX(-50%) rotate(-9deg);padding:0}
body[data-synthesis=true] .launch-deliverables h2{font:italic 25px Georgia,serif;letter-spacing:-.5px;transform:none}
@media(max-width:800px){body[data-synthesis=true] .synthesis-closing{grid-template-columns:minmax(0,1fr);padding:32px;gap:4px}body[data-synthesis=true] .synthesis-closing .launch-sole-photo{padding:35px 8px 42px}}
@media(max-width:650px){body[data-synthesis=true] .version-bar{gap:4px 16px}body[data-synthesis=true] .synthesis-closing{padding:28px 24px}body[data-header-cta=solid] .site-header .nav-apply{font-size:14px;padding:10px 14px;gap:12px}}
@media(max-width:650px){body[data-synthesis=true] .synthesis-closing .button{padding:14px 16px;gap:12px;font-size:16px;white-space:nowrap}}
@media(max-width:520px){body[data-synthesis=true] .site-header{display:grid;grid-template-columns:1fr;gap:18px}body[data-synthesis=true] .site-header nav{grid-template-columns:1fr auto;width:100%;gap:9px 16px}body[data-synthesis=true] .site-header .wordmark{justify-self:start}}
body[data-dark=true][data-header-cta=solid] .site-header .nav-apply{color:#111}

body[data-header-cta=solid] .site-header .early-access-note{justify-self:start}
body[data-header-cta=solid] .site-header nav{row-gap:6px}

/* September 22: experience closes the hero; sales introduces the gallery. */
body[data-synthesis=true] .hero>.experience{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;width:100%;margin:30px 0 0;padding:0;border:0;grid-column:1/-1}
body[data-synthesis=true] .gallery-section>.trust-strip{padding:0 0 30px;gap:0}
@media(max-width:650px){body[data-synthesis=true] .hero>.experience{margin-top:24px}body[data-synthesis=true] .gallery-section>.trust-strip{padding-bottom:24px}}

/* Local comparison of the sold counter around the gallery divider and title. */
body[data-synthesis=true] .gallery-section{position:relative}
body[data-counter-position=below-heading] .gallery-section>.trust-strip{padding:8px 0 35px}

/* Editable annotations follow image coordinates and the same rotated frame. */
.shoe-caption-art{position:relative;transform-origin:50% 50%;--caption-gap:14px}
.shoe-caption-sketch{transform:rotate(-8deg);transition:transform .5s}
body[data-synthesis=true] .hero:has(.prompt-box:focus-within) .shoe-caption-sketch{transform:rotate(-4deg) translateY(-3px)}
.shoe-caption-coffee{transform:rotate(-9deg) scale(1.10)}
body[data-synthesis=true] :is(.synthesis-sketch,.launch-sole-photo) .shoe-caption-art>img{transform:none;transition:none}
.shoe-caption-axis{position:absolute;width:0;height:0;transform:rotate(var(--sole-angle));z-index:2}
body[data-synthesis=true] .shoe-caption-axis>:is(figcaption,.launch-sole-copy){position:absolute;inset:var(--caption-gap) auto auto 0;width:max-content;max-width:none;margin:0;padding:0;transform:translateX(-50%);text-align:center;white-space:nowrap}
body[data-synthesis=true] .shoe-caption-axis :is(h2,em){margin:0;transform:none;line-height:1.2}
@media(prefers-reduced-motion:reduce){.shoe-caption-sketch{transition:none}}

body[data-synthesis=true] .how-section{padding-top:72px;padding-bottom:62px}
body[data-synthesis=true] .how-section .section-heading{margin:0 auto 46px}
body[data-synthesis=true] .process-steps article{border-bottom:0;padding-bottom:0}
body[data-synthesis=true] .early-access-panel{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:48px;margin-bottom:32px;padding:32px 38px;background:var(--synthesis-accent);color:#161616;border:2px solid #161616}
.early-access-status{display:inline-flex;align-items:center;gap:9px;font:700 14px/1.2 var(--sans);letter-spacing:.04em}
.early-access-status svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.3}
body[data-synthesis=true] .early-access-panel h2{font:400 clamp(30px,3.1vw,43px)/1.1 Anton,var(--sans);text-transform:uppercase;letter-spacing:-.015em;margin:12px 0}
body[data-synthesis=true] .early-access-panel p{font:400 17px/1.5 var(--sans);margin:0;max-width:590px}
body[data-synthesis=true] .early-access-panel .button{flex:none;border-radius:0;white-space:nowrap}
@media(max-width:750px){body[data-synthesis=true] .early-access-panel{flex-direction:column;align-items:flex-start;padding:26px 24px;margin-top:28px}body[data-synthesis=true] .early-access-panel .button{width:100%;justify-content:center}body[data-synthesis=true] .how-section{padding-top:48px;padding-bottom:42px}}
