/* OD-LAYOUT-PRIMITIVES v1 — structure only: display, flex/grid, overflow, wrapping, ratio. */
@layer od-layout {
:where(.od-stack,.od-row,.od-row-top,.od-cluster,.od-grid,.od-field,.od-stat,.od-cell,.od-tile)>:where(*){min-width:0}
.od-stack{display:flex;flex-direction:column;gap:var(--od-gap,8px)}.od-row{display:flex;align-items:center;gap:var(--od-gap,8px)}.od-row-top{display:flex;align-items:flex-start;gap:var(--od-gap,8px)}.od-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--od-gap,8px)}.od-fill{flex:1 1 0;min-width:0}.od-fixed{flex:none}.od-grid{display:grid;gap:var(--od-gap,12px);grid-template-columns:repeat(var(--od-cols,3),minmax(0,1fr))}.od-stat,.od-field,.od-cell{display:grid;gap:var(--od-gap,2px)}:where(.od-stat,.od-field,.od-cell)>:where(*){display:block}.od-tile{display:grid;grid-template-rows:auto 1fr}.od-tile>:where(*){display:block}.od-media{display:block;width:100%;height:auto;aspect-ratio:var(--od-ratio,auto)}.od-media-cover{object-fit:cover}.od-truncate{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.od-clamp-2,.od-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.od-clamp-2{-webkit-line-clamp:2}.od-clamp-3{-webkit-line-clamp:3}.od-lines-2{min-height:calc(2 * 1.4em)}.od-nowrap{white-space:nowrap}.od-keep{word-break:keep-all;overflow-wrap:anywhere}.od-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%}.od-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0}.od-rail{display:flex;gap:var(--od-gap,8px);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-inline:var(--od-rail-pad,16px);scroll-padding-inline:var(--od-rail-pad,16px)}.od-rail::-webkit-scrollbar{display:none}.od-rail>*{flex:none;scroll-snap-align:start}.od-rail>:last-child{margin-inline-end:var(--od-rail-pad,16px)}.od-spacer{flex:none;visibility:hidden;pointer-events:none}.od-touch{min-width:44px;min-height:44px}
}
/* /OD-LAYOUT-PRIMITIVES v1 */
/* Creator Collective — reference-led design tokens */
:root{--bg:#F6DB70;--surface:oklch(1 0 0);--fg:#315E56;--muted:oklch(from var(--fg) calc(l - .04) calc(c * .6) h);--border:var(--fg);--accent:var(--fg);
--paper:var(--surface);--sage:#C6DBAF;--pink:#F4BCD0;--golden:#F8C18D;--fuchsia:#F2C0D8;--heart-dull-red:#C97B7D;--forest:var(--fg);--ink:var(--fg);--red:var(--fg);--yellow:var(--bg);--lilac:#D9C2EE;--coral:var(--golden);--orange:var(--golden);--aqua:var(--mint);--mint:#ADDDD0;--line:var(--border);--space:8px;--body:16px;--small:14px;--radius:24px;--pill:999px;--enter:200ms;--exit:150ms;--hero-motion:400ms;--font-display:Impact,Haettenschweiler,'Arial Black',sans-serif;--display:var(--font-display);--font-body:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--sans:var(--font-body);--font-mono:ui-monospace,Menlo,monospace;--outline:2px solid var(--ink);--shadow:0 5px 0 var(--ink);--hero-ground:var(--bg);--art-1:#BFA7DE;--art-2:#B9D29E;--art-3:#AE91CE;--art-4:#CCB7E5;--art-5:#ECA48B;--art-6:#DDCDEE;--art-7:#F0AE96;--art-8:#EAA5C2;--art-9:#F2BDD7;}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--hero-ground);color:var(--ink);font-family:var(--sans);font-size:var(--body);line-height:1.6}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--ink);outline-offset:7px}.skip{position:absolute;top:8px;left:8px;z-index:5;transform:translateY(-180%);background:var(--paper);padding:8px 16px}.skip:focus{transform:translateY(0)}.wrap{width:min(1440px,100% - 96px);margin-inline:auto}.site-header{display:flex;align-items:center;justify-content:center;min-height:112px;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:22px;font-weight:900;letter-spacing:-1px;line-height:.95}.brand svg{width:40px;height:40px;flex:none}.brand-name span{display:block}.header-note,.nav-link{display:none}.arrow{width:24px;height:24px;flex:none}
.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:16px;padding-block:48px 56px;min-height:calc(100svh - 192px)}.hero-copy{min-width:0}.eyebrow{font-size:14px;font-weight:650;letter-spacing:1px;margin:0 0 24px;display:flex;align-items:center;gap:12px}.eyebrow:before{content:'';display:block;width:24px;height:2px;background:var(--ink)}h1{font-family:var(--display);font-size:clamp(64px,8.8vw,128px);font-weight:900;text-transform:uppercase;line-height:.94;letter-spacing:-3px;margin:0 0 32px}h1 span{display:block}h1 em{font:inherit}.intro{font-size:18px;line-height:1.6;max-width:440px;margin:0 0 24px}.cta{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:72px;padding:12px 16px 12px 28px;background:var(--paper);border:var(--outline);border-radius:var(--pill);box-shadow:var(--shadow);color:var(--ink);font-weight:650;text-decoration:none;white-space:nowrap;transition:transform var(--enter) ease-out}.cta .arrow{display:block;box-sizing:content-box;border:1px solid var(--ink);background:var(--yellow);padding:12px;border-radius:50%;width:24px;height:24px}.cta-note{display:flex;align-items:center;gap:8px;font-size:14px;margin:20px 0 0}.cta-note svg{width:16px;height:16px;flex:none}.hero-art{margin:0;min-width:0;position:relative}.art-svg{display:block;width:100%;height:auto;overflow:visible}.art-caption{display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;font-weight:600;margin:16px 0 0}.art-caption:before,.art-caption:after{content:'';width:24px;height:2px;background:var(--ink)}.character{animation:step-out var(--hero-motion) ease-out both;transform-origin:300px 360px}.ribbon-front{animation:ribbon-in var(--hero-motion) ease-out both;transform-origin:center}.scroll-cue{display:flex;align-items:center;justify-content:space-between;padding-block:24px 32px;font-size:14px}.scroll-cue a{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}.scroll-cue a .arrow{border:1px solid var(--ink);border-radius:50%;padding:8px;box-sizing:content-box}.scroll-cue>span{font-size:14px}
.question-section{background:var(--sage);color:var(--ink);padding:96px 0 80px;border-top:var(--outline);border-bottom:var(--outline);scroll-margin-top:0}.question-layout{display:grid;grid-template-columns:1fr;gap:40px;text-align:center;justify-items:center}.question-layout>div{min-width:0;width:100%}.step-label{display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;margin:0 0 32px}.step-label span{display:block;border:1px solid var(--ink);border-radius:var(--pill);padding:4px 16px;background:var(--yellow)}h2{font-family:var(--display);font-size:clamp(48px,7.2vw,104px);font-weight:900;line-height:1;text-transform:uppercase;letter-spacing:-2px;margin:0 auto;max-width:1120px}h2 em{font-style:normal;display:inline-block;border-bottom:6px solid var(--ink)}.question-hint{font-size:18px;margin:24px 0 0}.question-controls{max-width:760px}fieldset{border:0;padding:0;margin:0;min-width:0}.choices{display:grid;grid-template-columns:1fr 1fr;gap:24px}.choice{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:88px;padding:20px 24px;border:var(--outline);border-radius:var(--pill);background:var(--paper);color:var(--ink);box-shadow:var(--shadow);transition:transform var(--enter) ease-out;text-align:left}.choice-symbol{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border:1px solid var(--ink);border-radius:50%;font-size:14px;background:var(--yellow)}.choice-label{display:block;font-weight:650;font-size:18px;white-space:nowrap}.choice[aria-pressed=true]{background:var(--yellow);transform:translateY(3px);box-shadow:0 2px 0 var(--ink)}.choice[aria-pressed=true] .choice-symbol{background:var(--ink);color:var(--paper)}.choice[aria-pressed=true] .choice-symbol:before{content:'✓';font-size:20px}.choice[aria-pressed=true] .choice-symbol span{display:none}.response{min-height:144px;padding-top:40px}.response p{margin:0}.response-title{font-family:var(--display);font-size:clamp(32px,3.4vw,48px);text-transform:uppercase;line-height:1.12;letter-spacing:-.5px}.response-sub{font-size:16px;margin-top:16px!important}.response-default{display:flex;justify-content:center;align-items:center;gap:8px;font-size:16px}.response-default svg{width:20px;height:20px;flex:none}.response.reveal{animation:feedback var(--enter) ease-out}.section-reveal{animation:feedback var(--hero-motion) ease-out both}.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:40px;font-size:14px}.footer strong{font-size:18px;max-width:320px}.footer p{margin:0;text-align:right}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(hover:hover){.cta:hover,.choice:hover{transform:translateY(-3px)}.choice[aria-pressed=true]:hover{transform:translateY(1px)}.scroll-cue a:hover{text-decoration:underline;text-underline-offset:5px}}
@keyframes step-out{from{opacity:0;transform:translate(8px,-16px) scale(.94)}to{opacity:1;transform:translate(0,0) scale(1)}}@keyframes ribbon-in{from{opacity:0;transform:rotate(-8deg)}to{opacity:1;transform:rotate(0)}}@keyframes feedback{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1440px){.hero{gap:32px;padding-top:56px}.hero-art{max-width:640px}}
@media(max-width:1023px){.wrap{width:calc(100% - 64px)}.hero{grid-template-columns:1.15fr 1fr;padding-block:32px 48px}h1{font-size:clamp(64px,9vw,92px);letter-spacing:-2px}.intro{font-size:16px}.cta{font-size:14px;gap:12px;padding-left:20px;min-height:64px}.cta .arrow{padding:8px}.eyebrow{font-size:12px}.art-caption{font-size:12px}.question-section{padding-block:80px 64px}}
@media(max-width:767px){.wrap{width:calc(100% - 48px)}.site-header{min-height:96px}.brand{font-size:20px}.hero{grid-template-columns:1fr;text-align:center;padding-block:24px 32px;gap:40px;min-height:0}.eyebrow{justify-content:center;margin-bottom:24px}h1{font-size:clamp(60px,13.4vw,100px);letter-spacing:-2px;margin-bottom:24px}.intro{margin-inline:auto;font-size:16px}.cta{font-size:16px;padding:12px 12px 12px 20px;gap:12px;min-height:64px;max-width:100%}.cta .arrow{padding:8px;width:20px;height:20px}.cta-note{justify-content:center;font-size:12px}.hero-art{max-width:480px;width:100%;margin:auto}.art-caption{font-size:12px}.scroll-cue{justify-content:center;padding-block:16px 32px;font-size:12px}.scroll-cue>span{display:none}.question-section{padding-block:64px 48px}.question-layout{gap:32px}h2{font-size:clamp(44px,9.6vw,68px);letter-spacing:-1px}.question-hint{font-size:16px}.step-label{font-size:12px;margin-bottom:24px}.choices{grid-template-columns:1fr;gap:20px;max-width:400px;margin:auto}.choice{min-height:80px;padding:16px 24px}.choice-label{font-size:18px}.response{padding-top:32px;min-height:152px}.response-default{font-size:14px}.footer{align-items:flex-start;padding-block:32px;gap:24px}.footer strong{font-size:16px;max-width:180px}.footer p{font-size:12px;max-width:160px}}
@media(max-width:374px){.wrap{width:calc(100% - 32px)}h1{font-size:56px}.cta{font-size:14px;gap:8px;padding-left:16px}.cta .arrow{padding:6px}.choice{padding-inline:20px}.footer{flex-direction:column}.footer p{text-align:left}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* PF brand application; layout and type remain bound to the existing page. */
.site-header{min-height:144px;padding-block:24px}.brand .pf-logo{display:block;width:184px;height:auto;max-width:100%}.brand{border-radius:4px}.cta{background:var(--fg);color:var(--surface);box-shadow:0 5px 0 color-mix(in oklch,var(--fg) 80%,black)}.cta .arrow{background:var(--bg);color:var(--fg);border-color:var(--bg)}.eyebrow{color:var(--fg)}.hero-copy{container-type:inline-size}h1{font-size:clamp(48px,16cqi,128px);overflow-wrap:normal}h1,h2{text-wrap:balance}p{text-wrap:pretty}.question-section{background:var(--sage)}.choice[aria-pressed=true]{background:var(--fg);color:var(--surface)}.choice[aria-pressed=true] .choice-symbol{background:var(--bg);color:var(--fg);border-color:var(--bg)}.footer{color:var(--fg)}
@media(hover:hover){.brand:hover{outline:1px solid var(--fg);outline-offset:8px}.cta:hover{background:oklch(from var(--fg) calc(l - .06) c h);color:var(--surface)}}
@media(max-width:767px){.site-header{min-height:120px;padding-block:20px}.brand .pf-logo{width:152px}.cta{font-size:clamp(12px,3.7vw,16px);gap:8px;padding-inline:16px 12px}.hero{padding-top:24px}h1{font-size:clamp(40px,15cqi,100px)}}

/* PF refinement: continuous page grain and intentional headline/art overlap. */
:root{
 --grain: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22192%22%20height%3D%22192%22%20viewBox%3D%220%200%20192%20192%22%3E%3Cfilter%20id%3D%22grain%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.82%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23grain%29%22%20opacity%3D%22.10%22%2F%3E%3C%2Fsvg%3E");
 --gradient-light: var(--yellow);
 --gradient-green: var(--sage);
 --gradient-peach: var(--golden);
 --hero-ground: radial-gradient(ellipse at 0% 8%,var(--yellow),transparent 48%),radial-gradient(ellipse at 100% 72%,var(--gradient-green),transparent 52%),linear-gradient(145deg,var(--gradient-light),var(--yellow) 42%,var(--gradient-light) 68%,var(--sage));
 --hero-art-width: 800px;
 --hero-centred-gap: 32px;
 --hero-overlap-offset: clamp(32px,5vw,64px);
}
body{background-color:var(--bg);background-image:var(--grain),var(--hero-ground);background-size:192px 192px,100% 100%;background-repeat:repeat,no-repeat;background-attachment:scroll,scroll}
.hero{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:var(--hero-centred-gap);min-height:0;padding-block:32px 48px}
.hero-copy{grid-area:1 / 1;align-self:start;position:relative;z-index:2;width:100%;max-width:960px;margin-inline:auto;text-align:center;pointer-events:none}
.hero .eyebrow,.hero .cta-note{justify-content:center}
.hero .intro{margin-inline:auto}
.hero h1{font-size:clamp(40px,9.2cqi,88px);margin-inline:auto;line-height:1.02;letter-spacing:-1px;text-transform:uppercase}
.hero h1 span{font:inherit}
.hero .hero-art{grid-area:1 / 1;align-self:start;position:relative;z-index:1;width:min(100%,var(--hero-art-width));max-width:var(--hero-art-width);margin:0 auto;padding-top:var(--hero-overlap-offset)}
.hero .art-svg{width:100%;height:auto}
.question-section{background:transparent;border:0}
.site-header,.scroll-cue,.footer{background:transparent;border-top:0;border-bottom:0}
@media(max-width:767px){
 :root{--hero-centred-gap:32px}
 .hero{width:calc(100% - 32px);padding-block:24px 32px}
 .hero-copy{width:calc(100% - 16px)}
 .hero h1{font-size:clamp(36px,11.5cqi,80px)}
}


/* Creator reassurance: one continuous ground, six scroll-led cards. */
:root{--check-card-radius:32px;--check-card-space:48px;--check-card-title:clamp(36px,5.6vw,72px);--check-card-shadow:0 12px 32px rgb(49 94 86 / .08)}
.hero .hero-copy{max-width:1440px}
.hero h1{font-size:clamp(16px,5.6cqi,88px);line-height:1.06}
.hero h1 span{display:block;width:max-content;margin-inline:auto;white-space:nowrap}
.requirements-section{padding-block:64px 96px;background:transparent}
.requirements-heading{text-align:center;max-width:1040px;margin:0 auto 64px;font-size:clamp(40px,6.5vw,88px);line-height:1.04;text-wrap:balance}
.requirements-heading span{display:block}
.requirements-deck{list-style:none;padding:0;margin:0 auto;max-width:1040px;display:grid;gap:var(--check-card-space)}
.requirement-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:32px;min-width:0;min-height:432px;padding:40px 48px;border-radius:var(--check-card-radius);background:var(--sage);color:var(--fg);box-shadow:var(--check-card-shadow)}
.requirement-card:nth-child(2){background:var(--bg)}
.requirement-card:nth-child(3){background:var(--gradient-peach)}
.requirement-card:nth-child(4){background:var(--gradient-light)}
.requirement-card:nth-child(5){background:var(--lilac)}
.requirement-card:nth-child(6){background:var(--fg);color:var(--surface)}
.requirement-card-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:24px;font-family:var(--font-mono);font-size:14px;line-height:1.5;letter-spacing:1px}
.requirement-mark{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid currentColor;border-radius:50%;flex:none}
.requirement-mark svg{display:block;width:24px;height:24px}
.requirement-card h3{font-family:var(--display);font-size:var(--check-card-title);font-weight:900;line-height:1.12;text-transform:uppercase;text-align:center;text-wrap:balance;max-width:880px;margin:0}
.requirement-card s{text-decoration-thickness:.055em;text-decoration-color:currentColor;text-decoration-skip-ink:none}
.requirement-status{font-size:16px;line-height:1.5;margin:0;text-align:center}
.requirements-close{max-width:1040px;margin:96px auto 0;text-align:center}
.requirements-close p{margin:0}
.requirements-close .essentials{font-family:var(--display);font-size:clamp(36px,5.2vw,72px);font-weight:900;line-height:1.12;text-transform:uppercase;text-wrap:balance}
.requirements-close .essentials-end{font-size:24px;margin-top:24px;line-height:1.5}
@media(min-width:768px) and (min-height:700px) and (prefers-reduced-motion:no-preference){
 .requirement-card{position:sticky;top:calc((100svh - 432px)/2)}
}
@media(max-width:767px){
 :root{--check-card-radius:24px;--check-card-space:24px;--check-card-title:clamp(32px,8vw,48px)}
 .requirements-section{padding-block:48px 64px}
 .requirements-heading{margin-bottom:40px;font-size:clamp(36px,9vw,56px)}
 .requirement-card{padding:24px;min-height:304px;gap:24px}
 .requirement-card-top{font-size:12px;gap:16px}
 .requirement-mark{width:40px;height:40px}
 .requirements-close{margin-top:56px}
 .requirements-close .essentials-end{font-size:20px}
}


/* Creative challenge — native single-select controls, scoped to this flow. */
:root{--creative-radius:24px;--creative-gap:24px;--creative-title:clamp(32px,4.4vw,56px);--creative-option-font:clamp(24px,2.6vw,36px)}
.creative-challenge{width:100%;max-width:none;padding:64px clamp(16px,2.5vw,48px) 96px;scroll-margin-top:32px}
.creative-challenge [hidden]{display:none!important}
.creative-intro{text-align:center;margin-bottom:48px}
.creative-kicker{font-family:var(--font-mono);font-size:14px;font-weight:600;letter-spacing:1px;line-height:1.5;margin:0 0 24px}
.creative-intro h2{font-size:clamp(44px,6vw,80px);line-height:1.02}
.creative-progress{display:flex;justify-content:center;flex-wrap:wrap;gap:16px 40px;list-style:none;margin:0 0 48px;padding:0}
.creative-progress li{display:flex;align-items:center;gap:12px;font-size:16px}
.creative-step-number{display:grid;place-items:center;min-width:40px;min-height:40px;border:1px solid var(--fg);border-radius:50%;font-family:var(--font-mono);font-size:14px}
.creative-progress [aria-current="step"]{font-weight:750}
.creative-progress [aria-current="step"] .creative-step-number,.creative-progress .is-complete .creative-step-number{background:var(--fg);color:var(--surface)}
.creative-question{font:900 var(--creative-title)/1.12 var(--display);text-transform:uppercase;text-align:center;text-wrap:balance;margin:0;scroll-margin-top:32px}
.creative-question:focus{outline:none}
.creative-question:focus-visible{outline:3px solid var(--fg);outline-offset:8px;border-radius:8px}
.creative-helper{text-align:center;font-size:16px;line-height:1.6;margin:16px 0 32px}
.creative-options{display:grid;gap:var(--creative-gap);grid-template-columns:repeat(2,minmax(0,1fr))}
.creative-camera-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.creative-camera-options .creative-option:last-child{grid-column:1 / -1;justify-self:center;width:min(100%,640px)}
.creative-option{display:flex;align-items:center;gap:16px;padding:24px;min-height:104px;border:2px solid transparent;border-radius:var(--creative-radius);background:var(--gradient-light);color:var(--fg);cursor:pointer;transition:background-color var(--enter) ease-out;min-width:0}
.creative-option:nth-child(3n + 2){background:var(--sage)}
.creative-option:nth-child(3n){background:var(--gradient-peach)}
.creative-option input{display:block;appearance:none;flex:none;width:24px;height:24px;margin:0;border:2px solid currentColor;border-radius:50%;color:inherit;background:transparent;cursor:pointer}
.creative-option input:checked{background:currentColor;box-shadow:inset 0 0 0 5px var(--fg)}
.creative-option input:focus{outline:none}
.creative-option:has(input:focus-visible){outline:3px solid var(--fg);outline-offset:5px}
.creative-option:has(input:checked){background:var(--fg);color:var(--surface);border-color:var(--fg)}
#camera-roll-form .creative-option input[type="checkbox"]{display:grid;place-items:center;width:26px;height:26px;border-radius:6px;background:var(--surface)}
#camera-roll-form .creative-option input[type="checkbox"]::after{content:"";width:12px;height:7px;border-left:3px solid var(--surface);border-bottom:3px solid var(--surface);transform:translateY(-1px) rotate(-45deg) scale(0);transition:transform 180ms ease-out}
#camera-roll-form .creative-option input[type="checkbox"]:checked{background:var(--fg);box-shadow:none}
#camera-roll-form .creative-option input[type="checkbox"]:checked::after{transform:translateY(-1px) rotate(-45deg) scale(1)}
.creative-option-copy{--od-gap:12px;min-width:0}
.creative-option-title{display:block;font:900 var(--creative-option-font)/1.12 var(--display);text-transform:uppercase;text-wrap:balance}
.creative-option-description{display:block;font-size:16px;line-height:1.6}
.creative-option-type{align-items:flex-start;min-height:184px;padding:32px}
.creative-option-type input{margin-top:4px}
.creative-error{min-height:24px;font-size:16px;font-weight:650;margin:16px 0}
.creative-actions{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:24px}
.creative-action-hint{font-size:16px;margin:0}
.creative-primary,.creative-back{display:inline-flex;justify-content:center;align-items:center;gap:16px;min-height:56px;padding:12px 24px;font:650 16px/1.5 var(--sans);border-radius:var(--pill);border:2px solid var(--fg);color:var(--fg);background:transparent;cursor:pointer}
.creative-primary{background:var(--fg);color:var(--surface);margin-left:auto}
.creative-primary[aria-disabled="true"]{background:transparent;color:var(--fg);border-style:dashed;cursor:not-allowed}
.creative-primary:active:not([aria-disabled="true"]),.creative-back:active{transform:translateY(2px)}
.creative-summary{background:var(--sage);border-radius:var(--creative-radius);padding:48px;text-align:center}
.creative-summary-list{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:40px 0 24px}
.creative-summary-list dt{font-size:16px;margin-bottom:12px}
.creative-summary-list dd{margin:0;font:900 clamp(28px,3.4vw,44px)/1.15 var(--display);text-transform:uppercase;text-wrap:balance}
#creative-summary-description{font-size:20px;line-height:1.6;max-width:640px;margin:0 auto}
.creative-summary-note{font-size:16px;margin:24px 0 0}
.creative-summary .creative-actions{justify-content:center;margin-top:40px}
@media(hover:hover){.creative-option:hover{border-color:var(--fg)}.creative-option:has(input:checked):hover{background:oklch(from var(--fg) calc(l - .04) c h);color:var(--surface)}.creative-primary:hover:not([aria-disabled="true"]),.creative-back:hover{background:oklch(from var(--fg) calc(l - .04) c h);color:var(--surface)}}
@media(max-width:767px){:root{--creative-gap:16px}.creative-challenge{padding-block:48px 64px}.creative-progress{gap:16px;margin-bottom:32px}.creative-progress li{font-size:14px;gap:8px}.creative-options{grid-template-columns:1fr}.creative-camera-options .creative-option:last-child{width:100%}.creative-option{min-height:88px;padding:24px}.creative-option-type{min-height:0}.creative-summary{padding:32px 24px}.creative-summary-list{grid-template-columns:1fr;gap:32px}.creative-actions{gap:16px}.creative-action-hint{width:100%}.creative-summary .creative-actions{flex-direction:column}.creative-summary .creative-back{width:100%}}


/* Creative Drop: local video selection, using the existing PF palette. */
:root{--drop-gap:32px;--drop-heading:clamp(64px,8vw,112px);--drop-prompt:clamp(34px,3.6vw,48px)}
.creative-drop{max-width:1120px;padding-block:64px 96px;scroll-margin-top:32px}
.creative-drop [hidden]{display:none!important}
.drop-header{text-align:center;max-width:880px;margin:0 auto 64px}
.drop-header h2{font:900 var(--drop-heading)/1.02 var(--display);letter-spacing:-1px;text-transform:uppercase;text-wrap:balance;margin:0}
.drop-prompts{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:var(--drop-gap)}
.drop-prompt{min-width:0}
.drop-prompt h3{font:900 var(--drop-prompt)/1.12 var(--display);text-transform:uppercase;text-wrap:balance;margin:0 0 24px}
.creative-drop p{font-size:21px;line-height:1.6}
.creative-drop .creative-kicker{font-size:17px;line-height:1.5}
.drop-prompt p{margin:0 0 24px;max-width:60ch}
.drop-prompt .drop-equipment{font-size:19px;font-weight:650}
.drop-or{display:grid;place-items:center;min-width:56px;min-height:56px;border:1px solid var(--fg);border-radius:50%;font:600 16px/1 var(--font-mono);margin-top:8px}
.drop-ideas{margin-top:40px}
.drop-ideas h4{font:650 19px/1.5 var(--sans);margin:0 0 16px}
.drop-idea-list{--od-gap:8px;list-style:none;padding:0;margin:0}
.drop-idea-list li{max-width:100%;padding:10px 18px;border-radius:var(--pill);background:var(--sage);font-size:18px;line-height:1.45}
.drop-idea-list li:nth-child(3n+2){background:var(--gradient-light)}
.drop-idea-list li:nth-child(3n){background:var(--gradient-peach)}
.drop-upload{margin-top:64px;padding:48px;border:2px dashed var(--fg);border-radius:var(--radius);text-align:center;background:color-mix(in oklch,var(--surface) 28%,transparent)}
.drop-upload-icon{display:block;width:48px;height:48px;margin:0 auto 24px}
.drop-upload h3{font:900 clamp(36px,4.6vw,52px)/1.1 var(--display);text-transform:uppercase;margin:0 0 16px}
.creative-drop .drop-upload-help{font-size:19px;margin:0 0 24px}
.drop-upload-actions{justify-content:center;--od-gap:16px}
.drop-upload-actions .creative-primary{margin:0}
.drop-upload-actions button:focus-visible{outline:3px solid var(--fg);outline-offset:6px}
.creative-drop .drop-privacy{font-size:16px;line-height:1.55;margin:24px auto 0;max-width:56ch}
.creative-drop .drop-status{font-size:18px;font-weight:650;margin:24px 0 0;overflow-wrap:anywhere}
.creative-drop .drop-upload-actions button{font-size:18px}
.drop-status:empty{display:none}
.drop-status.is-error{padding:16px;border:1px solid var(--fg);border-radius:8px;background:var(--gradient-light)}
.drop-preview{margin:32px auto 0;max-width:720px;min-width:0}
.drop-preview video{display:block;width:100%;height:auto;max-height:480px;object-fit:contain;background:var(--fg);border-radius:16px}
.drop-preview figcaption{font-size:16px;line-height:1.6;margin-top:12px;overflow-wrap:anywhere}
@media(hover:hover){.drop-upload-actions button:hover{background:var(--fg);color:var(--surface)}}
@media(max-width:1023px){.drop-prompts{gap:24px}.drop-upload{padding:40px 32px}}
@media(max-width:767px){:root{--drop-heading:clamp(54px,15vw,76px);--drop-prompt:clamp(30px,8.5vw,40px)}.creative-drop{padding-block:48px 64px}.drop-header{margin-bottom:40px}.drop-prompts{grid-template-columns:1fr;gap:24px}.drop-or{justify-self:center;margin:0}.drop-ideas{margin-top:24px}.drop-upload{margin-top:40px;padding:32px 24px}.drop-upload-actions{flex-direction:column}.drop-upload-actions button{width:100%}.creative-drop p{font-size:18px}.creative-drop .creative-kicker{font-size:15px}.drop-idea-list li{font-size:17px}}
@media(max-width:374px){.drop-upload{padding:24px 16px}.drop-idea-list li{padding:8px 12px}}


/* Campaign ad: a chrome-free Instagram-style post using the visitor's local clip. */
:root{--campaign-width:680px;--campaign-space:20px;--campaign-display:clamp(38px,6vw,70px)}
.campaign-section{max-width:1120px;padding-block:64px 96px;scroll-margin-top:32px}
.campaign-section [hidden],#drop-campaign-link[hidden]{display:none!important}
.campaign-intro{text-align:center;margin:0 auto 48px;max-width:800px}
.campaign-intro h2{font:900 var(--campaign-display)/1.05 var(--display);text-transform:uppercase;letter-spacing:-1px;margin:0 0 24px;text-wrap:balance}
.campaign-intro p:last-child{font-size:18px;line-height:1.6;margin:0}
.campaign-ad{max-width:var(--campaign-width);margin:auto;background:#fff;color:#171717;border:1px solid rgba(23,23,23,.18);border-radius:8px;box-shadow:0 18px 50px rgba(34,58,46,.14);overflow:hidden}
.campaign-masthead{display:flex;align-items:center;gap:12px;padding:14px 16px}
.campaign-logo{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid rgba(23,23,23,.12);border-radius:50%;background:#fff;overflow:hidden}
.campaign-logo img{display:block;width:100%;height:100%;object-fit:contain}
.campaign-profile{display:grid;gap:1px;min-width:0;flex:1}
.campaign-profile strong{font-size:15px;line-height:1.25}
.campaign-profile span{font-size:13px;line-height:1.3;color:#6b6b6b}
.campaign-verified{display:inline-grid!important;place-items:center;width:15px;height:15px;margin-left:3px;border-radius:50%;background:#3797f0;color:#fff!important;font-size:10px!important;vertical-align:1px}
.campaign-more{border:0;background:transparent;color:#171717;font-size:26px;line-height:1;padding:8px;letter-spacing:2px}
.campaign-media{position:relative;min-width:0;background:var(--fg);aspect-ratio:4/5;overflow:hidden}
#campaign-video-slot{position:absolute;inset:0;width:100%;height:100%}
.campaign-media video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;background:var(--fg)}
.campaign-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;min-height:520px;padding:40px 24px;text-align:center;background:linear-gradient(145deg,var(--pink),var(--orange));gap:24px}
.campaign-empty-mark{font:900 clamp(64px,12vw,128px)/1 var(--display);letter-spacing:-2px}
.campaign-empty p{font-size:18px;line-height:1.6;max-width:32ch;margin:0}
.campaign-empty .creative-primary{margin:0;text-decoration:none}
.campaign-reel-mark{position:absolute;right:16px;top:16px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.38);color:#fff}
.campaign-post-body{padding:12px 16px 18px}
.campaign-actions{display:flex;align-items:center;gap:16px;margin-bottom:10px}
.campaign-action{display:grid;place-items:center;width:30px;height:30px;border:0;background:transparent;color:#171717;padding:0}
.campaign-action:first-child{color:#d94f5c}
.campaign-action svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.campaign-action:first-child svg{fill:currentColor;stroke:currentColor}
.campaign-action-save{margin-left:auto}
.campaign-engagement{font-size:14px;line-height:1.45}
.campaign-engagement p{margin:0 0 7px}
.campaign-engagement strong{font-weight:800}
.campaign-caption{overflow-wrap:anywhere}
.campaign-type{display:inline;font:700 12px/1.5 var(--font-mono);letter-spacing:.4px;text-transform:uppercase;margin-left:5px;color:var(--fg)}
.campaign-comments{color:#737373;cursor:pointer}
.campaign-comment strong{color:#171717;margin-right:6px}
.campaign-time{color:#8e8e8e;font-size:11px;text-transform:uppercase;letter-spacing:.3px;margin-top:10px!important}
.campaign-controls{max-width:var(--campaign-width);margin:32px auto 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.campaign-controls a{color:var(--fg);text-decoration:none}
.campaign-status{font-size:16px;line-height:1.6;flex:1 1 280px;margin:0}
.campaign-source{max-width:var(--campaign-width);margin:24px auto 0;padding:20px;border:2px solid var(--fg);border-radius:var(--creative-radius);background:var(--gradient-light)}
.campaign-source-title{margin:0 0 12px;font-size:16px;font-weight:750}
.campaign-source-actions{display:flex;flex-wrap:wrap;gap:12px}
.campaign-source-actions .creative-primary,.campaign-source-actions .creative-back{margin:0;min-height:44px}
.campaign-source-actions label{cursor:pointer}
.campaign-note{text-align:center;font-size:14px;line-height:1.6;margin:24px auto 0;max-width:56ch}
#drop-campaign-link{display:inline-flex;margin-top:24px;color:var(--fg);font-size:16px;font-weight:650;text-underline-offset:4px;min-height:44px;align-items:center}
@media(min-width:768px){
 .campaign-section{--campaign-width:min(820px,calc(100vw - 64px));max-width:1280px;display:flex;flex-direction:column}
 .campaign-intro{order:0}
 .campaign-ad{order:1}
 .campaign-source{order:2}
 .campaign-controls{order:3}
 .campaign-note{order:4}
 .campaign-masthead{padding:18px 20px}
 .campaign-logo{width:52px;height:52px}
 .campaign-profile strong{font-size:17px}
 .campaign-profile span{font-size:14px}
 .campaign-post-body{padding:18px 20px 24px}
 .campaign-engagement{font-size:16px}
}
@media(max-width:767px){:root{--campaign-space:16px}.campaign-section{padding-block:48px 64px}.campaign-intro p:last-child{font-size:16px}.campaign-ad{border-radius:4px}.campaign-masthead{padding:12px}.campaign-logo{width:40px;height:40px}.campaign-media{aspect-ratio:4/5}.campaign-empty{min-height:420px;padding:32px 16px}.campaign-post-body{padding:10px 12px 16px}.campaign-actions{gap:14px}.campaign-controls{margin-top:20px}.campaign-source{padding:16px}.campaign-source-actions{display:grid;grid-template-columns:1fr}.campaign-source-actions .creative-primary,.campaign-source-actions .creative-back{width:100%;justify-content:center}}


/* Creator Wall and application extend the shared PF tokens. */
:root{--wall-card:320px;--application-gap:24px;--closing-title:clamp(48px,7vw,88px)}
.creator-wall,.application-section{padding-block:64px 96px;scroll-margin-top:32px}
.closing-intro{max-width:800px;margin:0 auto 48px;text-align:center}
.closing-intro h2{font:900 var(--closing-title)/1.02 var(--display);text-transform:uppercase;letter-spacing:-1px;margin:0 0 24px;text-wrap:balance}
.closing-intro p{font-size:18px;line-height:1.6;margin:16px 0 0}
.closing-intro .creative-kicker{font-size:14px;margin:0 0 24px}
.wall-navigation{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}
.wall-navigation p{font-size:16px;line-height:1.5;margin:0;max-width:65ch}
.wall-arrows{display:flex;gap:8px;flex:none}
.wall-arrow{display:grid;place-items:center;width:48px;height:48px;border:2px solid var(--fg);border-radius:50%;background:transparent;color:var(--fg);font-size:24px;cursor:pointer}
.wall-arrow:disabled{opacity:.45;cursor:default}
.wall-feed{--od-gap:24px;--od-rail-pad:8px;align-items:flex-start;padding-block:8px 24px;scrollbar-width:thin;scrollbar-color:var(--fg) transparent}
.wall-feed::-webkit-scrollbar{display:block;height:8px}.wall-feed::-webkit-scrollbar-thumb{background:var(--fg);border-radius:8px}
.wall-post{width:var(--wall-card);max-width:calc(100% - 24px);border:1px solid var(--fg);border-radius:16px;background:var(--surface);color:var(--fg)}
.wall-identity{padding:20px 24px;--od-gap:4px}
.wall-identity h3{font:750 20px/1.3 var(--sans);margin:0}
.wall-identity p{font-size:14px;line-height:1.5;margin:0}
.wall-post img{display:block;width:100%;height:auto}
.wall-caption{padding:24px;--od-gap:12px}
.wall-caption .wall-type{font:700 13px/1.5 var(--font-mono);letter-spacing:.5px;text-transform:uppercase}
.wall-caption p{font-size:16px;line-height:1.6;margin:0}
.wall-caption .wall-demo{font-size:12px;line-height:1.5}
.application-section{max-width:1040px}
.application-section [hidden]{display:none!important}
.application-form fieldset{margin:0 0 48px;padding:0;border:0;min-width:0}
.application-form legend{font:900 clamp(36px,4.5vw,52px)/1.08 var(--display);text-transform:uppercase;margin-bottom:24px;padding:0}
.application-grid{--od-cols:2;--od-gap:var(--application-gap)}
.application-field{--od-gap:8px;align-content:start}
.application-field label{font-size:19px;font-weight:650;line-height:1.45}
.application-field label span{font-size:17px;font-weight:400}
.application-field input{display:block;width:100%;min-width:0;min-height:64px;padding:14px 18px;font:400 19px/1.5 var(--sans);color:var(--fg);background:color-mix(in oklch,var(--surface) 65%,transparent);border:1px solid var(--fg);border-radius:12px;box-sizing:border-box}
.application-field input:focus-visible,.application-section button:focus-visible,.creator-wall :focus-visible{outline:3px solid var(--fg);outline-offset:4px}
.application-field input[aria-invalid="true"]{border-width:2px;border-style:dashed}
.application-field .field-help{font-size:16px;line-height:1.5;margin:0}
.application-field .field-error,.interest-error{font-size:16px;line-height:1.5;font-weight:650;margin:0}
.field-error:empty,.interest-error:empty{display:none}
.application-contact-help{font-size:19px;line-height:1.6;margin:0 0 24px}
.application-interests{display:flex;flex-wrap:wrap;gap:16px}
.application-interest{display:flex;align-items:center;gap:12px;padding:20px 28px;border:2px solid var(--fg);border-radius:var(--pill);font-size:21px;font-weight:650;cursor:pointer;min-height:68px}
.application-interest input{width:24px;height:24px;flex:none;accent-color:var(--fg);margin:0}
.application-interest:has(input:checked){background:var(--sage)}
.application-interest:has(input:focus-visible){outline:3px solid var(--fg);outline-offset:4px}
.application-interest input:focus-visible{outline:none}
.application-actions{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.application-actions p{font-size:16px;line-height:1.6;max-width:52ch;margin:0}
.application-actions .creative-primary{margin:0;font-size:18px}
.application-errors{padding:24px;border:2px solid var(--fg);border-radius:16px;background:var(--gradient-light);margin-bottom:32px}
.application-errors h3{font:700 20px/1.4 var(--sans);margin:0 0 12px}
.application-errors ul{padding-left:24px;margin:0}.application-errors a{color:var(--fg);font-size:16px;line-height:1.6;text-underline-offset:4px}
.application-review{background:var(--sage);padding:48px;border-radius:var(--radius)}
.application-review h3{font:900 clamp(32px,5vw,56px)/1.1 var(--display);text-transform:uppercase;margin:0 0 16px}
.application-review>p{font-size:16px;line-height:1.6;margin:0 0 24px}
.application-review dl{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:32px 0}
.application-review dt{font-size:14px;line-height:1.5;margin-bottom:4px}
.application-review dd{font-size:18px;line-height:1.5;font-weight:650;margin:0;overflow-wrap:anywhere}
@media(hover:hover){.wall-arrow:hover:not(:disabled){background:var(--fg);color:var(--surface)}.application-interest:hover{background:var(--gradient-light)}}
@media(max-width:767px){:root{--wall-card:280px}.creator-wall,.application-section{padding-block:48px 64px}.wall-navigation{align-items:flex-start;gap:16px}.application-grid{--od-cols:1}.application-form legend{font-size:clamp(34px,10vw,44px)}.application-field label{font-size:18px}.application-field input{font-size:18px}.application-interest{width:100%;font-size:19px}.application-actions .creative-primary{width:100%}.application-review{padding:32px 24px}.application-review dl{grid-template-columns:1fr}.closing-intro p{font-size:18px}}


/* Creator identity: scoped additions to the existing PF system. */
.identity-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start;margin-top:32px}
.identity-image{display:block;width:100%;height:auto;max-width:432px;border-radius:var(--radius);margin-inline:auto}
.identity-copy{--od-gap:24px}.identity-copy h3{font:900 clamp(32px,5vw,56px)/1.1 var(--display);text-transform:uppercase;margin:0}
.identity-copy p,.identity-copy li{font-size:16px;line-height:1.6}.identity-copy p{margin:0}.identity-copy ol{padding-left:24px;margin:0}
.identity-actions{display:flex;flex-wrap:wrap;gap:16px}.identity-actions button{cursor:pointer;min-height:48px}.identity-actions button:disabled{cursor:wait;opacity:.65}
.identity-status{min-height:48px}.identity-demo{font-weight:700}.identity-placeholder{padding:48px 24px;background:var(--sage);border-radius:var(--radius);text-align:center;line-height:1.6}
#creator-identity [hidden]{display:none!important}
@media(max-width:767px){.identity-layout{grid-template-columns:1fr;gap:32px}.identity-actions{flex-direction:column}.identity-actions button{width:100%}}


/* Keep both challenge questions discoverable; stretch the creator rail evenly. */
.creative-panel[data-creative-panel="1"]{margin-top:64px}
.wall-feed{align-items:stretch}
.wall-post{display:flex;flex-direction:column}
.wall-post img{aspect-ratio:2 / 3;object-fit:contain;background:var(--sage)}
.wall-caption{flex:1}
.wall-caption .wall-demo{margin-top:auto}
@media(max-width:767px){.creative-panel[data-creative-panel="1"]{margin-top:48px}}

/* PF playful motion — shared timing, bounded decorative layers, static fallback. */
:root{--motion-enter:400ms;--motion-feedback:240ms;--motion-stagger:40ms;--motion-float:8s;--motion-flight:16s;--motion-ease:cubic-bezier(.2,.8,.2,1);--motion-travel:24px;--motion-star:56px}
.motion-host{position:relative;isolation:auto}
.motion-sky{position:absolute;top:0;left:0;width:100%;height:112px;overflow:hidden;pointer-events:none;z-index:-1;color:var(--fg)}
.motion-plane-track{position:absolute;top:8px;left:0;width:100%;height:80px;animation:pf-flight var(--motion-flight) linear infinite;animation-play-state:paused;opacity:.8}
.motion-plane-track svg{display:block;width:144px;height:80px;overflow:visible}
.motion-host:nth-of-type(even) .motion-plane-track{animation-direction:reverse;animation-delay:-7s}
.motion-host:nth-of-type(3n) .motion-plane-track{animation-duration:18s;animation-delay:-4s}
.motion-spark{position:absolute;top:16px;right:3%;width:var(--motion-star);height:var(--motion-star);animation:pf-spark var(--motion-float) ease-in-out infinite;animation-play-state:paused}
.motion-spark svg{display:block;width:100%;height:100%}
.motion-spark-small{right:auto;left:3%;top:56px;width:32px;height:32px;animation-delay:-3s}
.motion-host.motion-in-view .motion-plane-track,.motion-host.motion-in-view .motion-spark{animation-play-state:running}
.motion-enabled .hero.motion-in-view .art-svg{animation:pf-float var(--motion-float) ease-in-out infinite;transform-origin:center}
.motion-entering{animation:pf-arrive var(--motion-enter) var(--motion-ease) both;animation-delay:var(--motion-delay,0ms)}
.motion-selected .creative-option-title,.motion-selected .choice-symbol{animation:pf-pop var(--motion-feedback) var(--motion-ease)}
.motion-clicked .arrow,.motion-clicked svg{animation:pf-nudge var(--motion-feedback) var(--motion-ease)}
.motion-enabled .requirement-card.motion-in-view .requirement-mark{animation:pf-spark 10s ease-in-out infinite}
@keyframes pf-flight{0%{transform:translateX(-160px) translateY(24px) rotate(-5deg)}25%{transform:translateX(25%) translateY(0) rotate(4deg)}50%{transform:translateX(50%) translateY(24px) rotate(-4deg)}75%{transform:translateX(75%) translateY(8px) rotate(3deg)}100%{transform:translateX(calc(100% + 160px)) translateY(24px) rotate(-5deg)}}
@keyframes pf-float{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-12px) rotate(.5deg)}}
@keyframes pf-spark{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-8px) rotate(12deg)}}
@keyframes pf-arrive{0%{opacity:0;transform:translateY(var(--text-pop-rise)) scale(.94)}18%{opacity:1}72%{transform:translateY(-4px) scale(1.015)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pf-pop{0%,100%{transform:scale(1)}45%{transform:scale(1.045)}}
@keyframes pf-nudge{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(4px) rotate(-8deg)}}
@media(hover:hover) and (pointer:fine){
 .motion-enabled .cta:hover .arrow,.motion-enabled .creative-primary:hover .arrow{transform:translateX(4px) rotate(-8deg)}
 .motion-enabled .wall-post:hover img{transform:scale(1.015)}
 .motion-enabled .wall-post img,.motion-enabled .cta .arrow{transition:transform var(--motion-feedback) var(--motion-ease)}
}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important}
html.motion-paused .motion-entering{animation:none!important;opacity:1;transform:none}
html.motion-paused{scroll-behavior:auto}
html.motion-paused .motion-plane-track{opacity:.35}
@media(max-width:767px){
 :root{--motion-star:32px;--motion-travel:12px}
 .motion-sky{height:64px}
 .motion-plane-track{height:48px;top:0}
 .motion-plane-track svg{width:88px;height:48px}
 .motion-spark{top:8px;right:0}
 .motion-spark-small{display:none}
 .motion-host:nth-of-type(even) .motion-plane-track{display:none}
}
@media(prefers-reduced-motion:reduce){
 .motion-entering{opacity:1!important;transform:none!important}
 .motion-plane-track{transform:translateX(8%);opacity:.35}
 .motion-enabled .hero .art-svg,.motion-enabled .wall-post img{transform:none!important}
}


/* Larger creator objects: dedicated flow space keeps decoration clear of copy. */
:root{--object-plane:280px;--object-device:176px;--object-like:104px;--type-art:96px;--object-bob:8s;--object-travel:20px}
.motion-sky{position:relative;top:auto;left:auto;width:100%;height:224px;overflow:hidden;z-index:0;grid-column:1 / -1;margin-bottom:24px}
.hero .motion-sky{grid-area:2 / 1;margin-bottom:0;height:248px}
.floating-object{position:absolute;top:24px;left:8%;width:var(--object-device);height:var(--object-device);color:var(--fg);pointer-events:none}
.floating-object>svg{display:block;width:100%;height:100%;animation:pf-object-bob var(--object-bob) ease-in-out infinite;animation-play-state:paused}
.floating-plane{width:var(--object-plane);height:var(--object-plane);top:-16px;animation:pf-plane-drift 18s ease-in-out infinite;animation-play-state:paused}
.float-position-1{left:auto;right:8%;top:24px;--object-bob:9s}
.float-position-2{left:55%;top:72px;--object-bob:7s}
.floating-like{width:var(--object-like);height:var(--object-like)}
.float-position-1>svg{animation-delay:-3s}.float-position-2>svg{animation-delay:-5s}
.motion-host:nth-of-type(even) .float-position-0{left:auto;right:12%}
.motion-host.motion-in-view .floating-object,.motion-host.motion-in-view .floating-object>svg{animation-play-state:running}
.creative-option-type{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr) var(--type-art);align-items:center;min-height:176px;padding:24px;gap:16px}
.creative-option-type input{align-self:start;margin-top:4px}
.type-illustration{position:static;display:block;width:var(--type-art);height:var(--type-art);pointer-events:none;align-self:center}
.type-illustration img.puffy-type-art{display:block;width:100%;height:100%;transition:transform var(--motion-feedback) var(--motion-ease)}
.creative-option-type:has(input:checked) .type-illustration{background:transparent;border-radius:0}
.motion-enabled .creative-option-type:has(input:checked) .type-illustration img.puffy-type-art{transform:rotate(5deg)}
@keyframes pf-object-bob{0%,100%{transform:translateY(8px) rotate(-5deg)}50%{transform:translateY(calc(-1 * var(--object-travel))) rotate(5deg)}}
@keyframes pf-plane-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(40px)}}
@media(hover:hover) and (pointer:fine){.motion-enabled .creative-option-type:hover .type-illustration img.puffy-type-art{transform:translateY(-4px) rotate(-7deg)}}
@media(max-width:767px){
 :root{--object-plane:152px;--object-device:104px;--object-like:72px;--type-art:72px;--object-travel:12px}
 .motion-sky,.hero .motion-sky{height:160px;margin-bottom:16px}
 .floating-plane{top:0}.floating-object{left:0}
 .float-position-1{left:auto;right:0}.float-position-2{left:46%;top:72px}
 .hero .floating-like{display:none}
 .creative-option-type{--type-art:56px;min-height:0;padding:20px 16px;gap:12px}
}
@media(prefers-reduced-motion:reduce){.floating-object,.floating-object>svg,.type-illustration img.puffy-type-art{animation:none!important;transform:none!important;transition:none!important}}
html.motion-paused .type-illustration img.puffy-type-art{transform:none!important;transition:none!important}


/* Full-width paper-plane flyovers: left entry, right exit, no reverse leg. */
:root{--flight-size:clamp(280px,36vw,560px);--flight-duration:12s;--flight-lift:56px}
.plane-airspace{position:absolute;top:64px;left:0;width:100%;height:calc(var(--flight-size) + 128px);overflow:hidden;pointer-events:none;z-index:3}
.hero .plane-airspace{top:160px}
.plane-airspace .floating-plane{left:calc(-1 * var(--flight-size));right:auto;top:64px;width:var(--flight-size);height:var(--flight-size);animation:pf-plane-crossing var(--flight-duration) linear infinite;animation-delay:var(--flight-delay,0s);animation-play-state:paused}
.plane-airspace .floating-plane>svg{animation:pf-plane-bank 4s ease-in-out infinite;animation-play-state:paused;transform:rotate(20deg)}
.motion-host.motion-in-view .plane-airspace .floating-plane,.motion-host.motion-in-view .plane-airspace .floating-plane>svg{animation-play-state:running}
@keyframes pf-plane-crossing{
 0%{transform:translate3d(0,24px,0)}
 45%{transform:translate3d(calc(50vw + var(--flight-size)),calc(-1 * var(--flight-lift)),0)}
 90%,100%{transform:translate3d(calc(100vw + var(--flight-size) + var(--flight-size)),0,0)}
}
@keyframes pf-plane-bank{0%,100%{transform:rotate(20deg)}50%{transform:rotate(12deg)}}
@media(max-width:767px){
 :root{--flight-size:224px;--flight-duration:10s;--flight-lift:24px}
 .plane-airspace{top:32px}.hero .plane-airspace{top:96px}
}
/* Clear the reading area immediately when decorative motion is stopped. */
html.motion-paused .plane-airspace{visibility:hidden}
@media(prefers-reduced-motion:reduce){.plane-airspace{display:none}}


/* Decorative travel follows scrolling directly; no time-based idle movement. */
.floating-object,.floating-object>svg,
.plane-airspace .floating-plane,.plane-airspace .floating-plane>svg,
.hero .art-svg,.hero .art-svg *,
.motion-enabled .hero.motion-in-view .art-svg,
.motion-enabled .requirement-card.motion-in-view .requirement-mark,
.type-illustration img.puffy-type-art{animation:none!important;transition:none!important}
.motion-sky .floating-camera{left:0;right:auto;top:24px}
.motion-sky .floating-phone,.motion-sky .floating-like{top:0}
.motion-sky .floating-phone{left:auto;right:16%}
.motion-sky .floating-like{left:48%;right:auto}
.motion-enabled .creative-option-type:hover .type-illustration img.puffy-type-art,
.motion-enabled .creative-option-type:has(input:checked) .type-illustration img.puffy-type-art{transition:none}
@media(max-width:767px){.hero .floating-like{display:block}.motion-sky .floating-phone{right:8%}}
@media(prefers-reduced-motion:reduce){
 .floating-object,.floating-object>svg,.hero .art-svg,.type-illustration img.puffy-type-art,.requirement-mark{transform:none!important}
}


/* Oversized scroll props overlap section artwork and copy without taking layout space. */
:root{--object-device:clamp(224px,25vw,352px);--object-like:clamp(144px,17vw,240px)}
.motion-host>.motion-sky,.hero.motion-host>.motion-sky{
 position:absolute;top:var(--decor-top,24%);left:0;width:100%;
 height:clamp(352px,40vw,512px);margin:0;z-index:3;pointer-events:none;
}
.motion-sky .floating-object{left:0;right:auto;top:0;visibility:hidden}
.plane-airspace .floating-plane{visibility:hidden}
.hero .plane-airspace{top:240px}
@media(max-width:767px){
 :root{--object-device:192px;--object-like:128px}
 .motion-host>.motion-sky,.hero.motion-host>.motion-sky{height:320px}
 .hero .plane-airspace{top:160px}
}
html.motion-paused .motion-sky{visibility:hidden}
html.motion-paused .motion-sky .floating-object,
html.motion-paused .plane-airspace .floating-plane{visibility:hidden!important}
@media(prefers-reduced-motion:reduce){.motion-host>.motion-sky{display:none}}


/* Compact page rhythm and a pinned, sideways checklist. */
:root{--section-space:48px;--check-card-space:24px;--check-card-title:clamp(32px,4vw,52px)}
.question-section,.requirements-section,.creative-challenge,.creative-drop,
.campaign-section,.creator-wall,.application-section{padding-block:var(--section-space)}
.site-header{min-height:112px;padding-block:16px}
.hero{padding-block:16px 24px}
.question-layout{gap:24px}.response{min-height:112px;padding-top:24px}
.question-section{position:relative;z-index:1;transition:background-color 320ms ease-out,box-shadow 320ms ease-out}
.question-section.is-viewport-visible{background-color:rgb(23 59 51 / .10)}
.question-section.is-viewport-centered{box-shadow:0 54px 76px -58px rgb(49 94 86 / .42),inset 0 -38px 52px -54px rgb(49 94 86 / .28)}
.requirements-stage{position:relative;--requirements-pin-top:72px}
.requirements-scene{padding-block:8px 24px}
.requirements-stage.is-pinned .requirements-scene{position:sticky;top:var(--requirements-pin-top)}
.requirements-heading{font-size:clamp(32px,4.5vw,64px);margin:0 auto 24px;max-width:960px}
.requirements-window{width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--fg) transparent;overscroll-behavior-x:contain;border-radius:var(--check-card-radius)}
.requirements-window:focus-visible{outline:3px solid var(--fg);outline-offset:4px}
.requirements-deck{display:flex;align-items:stretch;gap:24px;max-width:none;margin:0;padding:0 0 16px;width:max-content}
.requirement-card{position:relative;top:auto;flex:0 0 clamp(280px,38vw,464px);width:clamp(280px,38vw,464px);min-height:280px;padding:24px 32px;gap:24px}
.requirement-card h3{max-width:100%;font-size:var(--check-card-title)}
.requirements-close{margin-top:32px}.requirements-close .essentials-end{margin-top:16px}
.requirements-section>.plane-airspace{display:block}
@media(prefers-reduced-motion:reduce){.requirements-section>.plane-airspace{display:none}}
@media(max-width:767px){
 :root{--section-space:32px;--check-card-title:32px}
 .site-header{min-height:96px}.hero{padding-block:16px}
 .requirement-card{width:calc(100vw - 72px);flex-basis:calc(100vw - 72px);padding:24px;min-height:256px}
 .requirements-heading{margin-bottom:24px;font-size:clamp(28px,7vw,40px)}
 .requirements-stage{--requirements-pin-top:40px}
 .requirements-close{margin-top:24px}
}


/* The requested overlapping stack peels diagonally within its own stage. */
.requirements-stage.is-pinned .requirements-window{overflow:clip;border-radius:0;padding:24px 0 48px}
.requirements-stage.is-pinned .requirements-deck{display:grid;grid-template-columns:minmax(0,1fr);width:100%;padding:0 40px;gap:0;justify-items:center;isolation:isolate}
.requirements-stage.is-pinned .requirement-card{grid-area:1 / 1;width:min(100%,640px);min-height:280px;transform-origin:50% 70%;transition:none;will-change:transform,opacity}
.requirements-stage.is-pinned .requirements-heading{position:relative;z-index:10;margin-bottom:8px}
@media(max-width:767px){
 .requirements-stage.is-pinned .requirements-deck{padding-inline:24px}
 .requirements-stage.is-pinned .requirement-card{min-height:256px;padding:24px}
}


/* Scroll-linked ribbon wipe at the creative challenge boundary. */
:root{--challenge-wipe-fill:var(--yellow);--challenge-wipe-edge:var(--fg)}
.challenge-wipe{position:fixed;top:0;left:0;width:100%;height:100%;z-index:40;pointer-events:none;visibility:hidden;overflow:clip;contain:strict}
.challenge-wipe svg{display:block;width:100%;height:100%;overflow:visible}
.challenge-wipe-band{will-change:transform}
.challenge-wipe-outline{fill:none;stroke:var(--challenge-wipe-edge);stroke-width:244;stroke-linecap:round}
.challenge-wipe-fill{fill:none;stroke:var(--challenge-wipe-fill);stroke-width:238;stroke-linecap:round}
.challenge-wipe-spark{fill:var(--surface);stroke:var(--challenge-wipe-edge);stroke-width:3;stroke-linejoin:round}
html.motion-paused .challenge-wipe{display:none}
@media(prefers-reduced-motion:reduce){.challenge-wipe{display:none}}


/* A longer, mirrored arch interlude; the checklist title remains one line. */
:root{--arch-scroll-space:80svh;--requirements-title-size:clamp(14px,4cqw,56px)}
.requirements-scene{container-type:inline-size}
.requirements-heading{max-width:none;font-size:var(--requirements-title-size);white-space:nowrap;text-wrap:nowrap}
.challenge-transition-run{height:var(--arch-scroll-space);pointer-events:none;background:#fffdf4}
html.motion-paused .challenge-transition-run{height:0}
@media(prefers-reduced-motion:reduce){.challenge-transition-run{height:0}}


/* Illustrations pass above text across sections without intercepting controls. */
:root{--layer-section-content:2;--layer-hero-art:20;--layer-floating-art:30}
.motion-host > :not(.motion-sky):not(.plane-airspace){position:relative;z-index:var(--layer-section-content)}
.motion-host > .motion-sky,.hero.motion-host > .motion-sky,
.motion-host > .plane-airspace{z-index:var(--layer-floating-art);pointer-events:none}
.hero.motion-host > .hero-art{z-index:var(--layer-hero-art);pointer-events:none}
/* Let Creative Drop props cross the copy; clip only at the viewport's side edges. */
.creative-drop.motion-host > .motion-sky{overflow:visible;clip-path:inset(-100vmax calc((100% - 100vw) / 2));z-index:var(--layer-floating-art)}


/* Larger reassurance cards, scaled within the existing scroll scene. */
:root{--check-card-title:clamp(40px,5.6vw,72px);--check-card-wide:880px;--check-card-height:384px;--check-card-label:18px;--requirements-title-size:clamp(16px,4.6cqw,72px)}
.requirement-card{flex-basis:clamp(320px,52vw,640px);width:clamp(320px,52vw,640px);min-height:var(--check-card-height);padding:32px 40px;gap:32px}
.requirement-card h3{font-size:var(--check-card-title);line-height:1.08}
.requirement-card-top,.requirement-status{font-size:var(--check-card-label)}
.requirement-mark{width:56px;height:56px}
.requirement-mark svg{width:32px;height:32px}
.requirements-stage.is-pinned .requirement-card{width:min(100%,var(--check-card-wide));min-height:var(--check-card-height)}
@media(max-width:767px){
 :root{--check-card-title:clamp(36px,7vw,48px);--check-card-height:320px;--check-card-label:16px}
 .requirement-card{width:calc(100vw - 64px);flex-basis:calc(100vw - 64px);padding:24px;gap:24px}
 .requirements-stage.is-pinned .requirements-deck{padding-inline:16px}
 .requirements-stage.is-pinned .requirement-card{min-height:var(--check-card-height);padding:24px}
}

/* Full PF accent palette: warm pairs and cool pairs occupy separate moments. */
:root{
 --accent-ink:#173B33;
 --accent-rose:var(--pink);
 --accent-orange:var(--golden);
 --accent-aqua:var(--mint);
 --accent-lilac:var(--lilac);
 --accent-fuchsia:var(--fuchsia);
 --creative-coral:#F1B2A2;
 --text-pop-rise:32px;
 --hero-ground:linear-gradient(172deg,var(--accent-orange) 0%,var(--accent-rose) 14%,var(--yellow) 30%,var(--gradient-light) 42%,var(--accent-aqua) 56%,var(--yellow) 70%,var(--accent-lilac) 86%,var(--gradient-peach) 100%);
}
.creative-option:not(:has(input:checked)){color:var(--accent-ink)}
.creative-option:nth-child(8n+1):not(:has(input:checked)){background:var(--accent-rose)}
.creative-option:nth-child(8n+2):not(:has(input:checked)){background:var(--accent-orange)}
.creative-option:nth-child(8n+3):not(:has(input:checked)){background:var(--accent-aqua)}
.creative-option:nth-child(8n+4):not(:has(input:checked)){background:var(--yellow)}
.creative-option:nth-child(8n+5):not(:has(input:checked)){background:var(--accent-lilac)}
.creative-option:nth-child(8n+6):not(:has(input:checked)){background:var(--creative-coral)}
.creative-option:nth-child(8n+7):not(:has(input:checked)){background:var(--accent-fuchsia)}
.creative-option:nth-child(8n+8):not(:has(input:checked)){background:var(--accent-orange)}
/* Creative types have identity-based colours, independent of the camera-roll palette. */
.creative-option-type:has(input[value="0"]){--type-card-bg:var(--accent-aqua)}
.creative-option-type:has(input[value="1"]){--type-card-bg:var(--yellow)}
.creative-option-type:has(input[value="2"]){--type-card-bg:var(--creative-coral)}
.creative-option-type:has(input[value="3"]){--type-card-bg:var(--accent-lilac)}
.creative-option-type:has(input[value="4"]){--type-card-bg:var(--accent-orange)}
.creative-option-type:has(input[value="5"]){--type-card-bg:var(--accent-fuchsia)}
.creative-option-type:has(input[value="6"]){--type-card-bg:var(--accent-rose)}
.creative-option-type:has(input[value="7"]){--type-card-bg:var(--gradient-light)}
.creative-option.creative-option-type:not(:has(input:checked)){background:var(--type-card-bg);color:var(--accent-ink)}
.requirement-card:nth-child(-n+5){color:var(--accent-ink)}
.requirement-card:nth-child(1){background:var(--yellow)}
.requirement-card:nth-child(2){background:var(--accent-orange)}
.requirement-card:nth-child(3){background:var(--accent-aqua)}
.requirement-card:nth-child(4){background:var(--yellow)}
.requirement-card:nth-child(5){background:var(--accent-lilac)}
.motion-entering{transform-origin:50% 100%;animation-timing-function:cubic-bezier(.16,.8,.25,1)}
@media(max-width:767px){:root{--text-pop-rise:24px}}
@media(prefers-reduced-motion:reduce){.motion-entering{animation:none!important;opacity:1!important;transform:none!important}}

/* Give the closing reassurance a full reading beat before the arch interlude. */
:root{--reassurance-scroll-span:180svh;--reassurance-pin-top:32svh;--reassurance-light-strength:.6;--reassurance-ground-opacity:clamp(0,calc(var(--reassurance-light,0) * 1.666667),1)}
.requirements-reading-stage{min-height:var(--reassurance-scroll-span);padding-block:24svh;box-sizing:border-box}
.requirements-reading-stage .requirements-close{position:sticky;top:var(--reassurance-pin-top);margin:0 auto}
@media(max-width:767px){
 .requirements-reading-stage{--reassurance-pin-top:28svh}
}
@media(prefers-reduced-motion:reduce),(max-height:540px){
 .requirements-reading-stage{min-height:0;padding-block:48px}
 .requirements-reading-stage .requirements-close{position:static}
}

/* Shared hover growth composes with existing press and scroll transforms. */
:root{--control-hover-scale:1.04;--control-hover-enter:200ms;--control-hover-exit:150ms}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 :is(button,a.cta,.creative-option,.application-interest){
  scale:1;
  transition:scale var(--control-hover-exit) ease-in,transform var(--control-hover-exit) ease-in,background-color var(--control-hover-exit) ease-in;
 }
 :is(button,a.cta,.creative-option,.application-interest):not(:disabled):not([aria-disabled="true"]):not(:has(input:disabled)):hover{
  scale:var(--control-hover-scale);
  transition-duration:var(--control-hover-enter);
  transition-timing-function:ease-out;
 }
 :is(button,a.cta,.creative-option,.application-interest):not(:disabled):not([aria-disabled="true"]):not(:has(input:disabled)):active{scale:1}
}

/* White social posts retain PF details and full-frame portraits. */
:root{--post-paper:#fff;--post-ink:#202622;--post-line:#dededb;--post-muted:#535d57;--post-radius:8px;--post-avatar:40px}
.creator-wall .wall-post{background:var(--post-paper);color:var(--post-ink);border:1px solid var(--post-line);border-radius:var(--post-radius);box-shadow:none}
.creator-wall .wall-identity{display:flex;align-items:center;gap:12px;padding:16px;min-height:80px;border-bottom:1px solid var(--post-line)}
.wall-identity>.od-field{flex:1;min-width:0}
.creator-wall .wall-identity h3{font-size:16px;line-height:1.5}
.creator-wall .wall-identity p{color:var(--post-muted)}
.wall-avatar{display:grid;place-items:center;width:var(--post-avatar);height:var(--post-avatar);flex:none;border:1px solid var(--fg);border-radius:50%;background:var(--post-paper);color:var(--fg);font-weight:750}
.wall-brand{font-size:12px;font-weight:800;letter-spacing:1px;color:var(--fg)}
.wall-photo{display:grid;place-items:center;aspect-ratio:2 / 3;background:var(--post-paper)}
.creator-wall .wall-photo img{display:block;width:100%;height:100%;max-height:100%;aspect-ratio:auto;object-fit:contain;background:var(--post-paper)}
.wall-social{display:flex;align-items:center;gap:8px;padding:8px 12px 0;border-top:1px solid var(--post-line)}
.wall-social-button{display:flex;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:8px;border:0;border-radius:4px;background:transparent;color:var(--post-ink);font-size:14px;font-weight:650}
.wall-social-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wall-social-button[aria-pressed="true"]{color:var(--fg)}
.wall-social-button[aria-pressed="true"] svg{fill:currentColor}
.wall-save{margin-left:auto}
.creator-wall .wall-caption{padding:8px 20px 20px;gap:12px}
.creator-wall .wall-type{color:var(--fg)}
.creator-wall .wall-demo{color:var(--post-muted)}
@media(hover:hover){.wall-social-button:hover{background:var(--post-line)}}


/* Two adjacent questions: camera roll on the left, creative type on the right. */
.creative-question-rail{display:flex;align-items:stretch;gap:0;width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--fg) transparent}
.creative-question-rail[hidden]{display:none}
.creative-scroll-stage{--question-pin-top:24px;position:relative;min-width:0}
.creative-scroll-stage[hidden]{display:none}
.creative-sticky-content{position:sticky;top:var(--question-pin-top);height:calc(100svh - 48px);display:grid;grid-template-rows:auto auto minmax(0,1fr);min-width:0}
.creative-sticky-content .creative-intro{margin-bottom:24px}
.creative-sticky-content .creative-kicker{margin-bottom:16px}
.creative-sticky-content .creative-intro h2{font-size:clamp(36px,5vw,64px)}
.creative-sticky-content .creative-progress{margin-bottom:24px}
.creative-sticky-content .creative-question-rail.creative-pinned-rail{position:relative;top:auto;height:100%;max-height:100%;min-height:0}
.creative-sticky-content .creative-question-rail.creative-pinned-rail>.creative-panel{min-height:100%;max-height:100%;overflow-y:auto;overscroll-behavior-y:auto}

@media(max-width:767px){
 .creative-sticky-content .creative-intro{margin-bottom:16px}
 .creative-sticky-content .creative-intro h2{font-size:32px}
 .creative-sticky-content .creative-kicker{margin-bottom:8px}
 .creative-sticky-content .creative-progress{margin-bottom:16px;gap:8px 16px}
}
.creative-question-rail.creative-pinned-rail{position:sticky;top:var(--question-pin-top);max-height:calc(100svh - 48px);scroll-snap-type:none;scroll-behavior:auto}
.creative-pinned-rail>.creative-panel{max-height:calc(100svh - 64px);overflow-y:auto;overscroll-behavior-y:auto;scrollbar-width:thin}

.creative-question-rail>.creative-panel{flex:0 0 100%;min-width:0;margin:0;padding:16px 16px 24px;scroll-snap-align:start;scroll-snap-stop:always}
.creative-question-rail:focus-visible{outline:3px solid var(--fg);outline-offset:4px}
.creative-question-rail .creative-actions{padding-inline:8px}
@media(max-width:767px){.creative-question-rail>.creative-panel{padding-inline:12px}}
/* Keep the complete desktop question in view; the document owns vertical scrolling. */
@media(min-width:768px){
 .creative-question-rail.creative-pinned-rail{max-height:none}
 .creative-pinned-rail>.creative-panel{max-height:none;overflow:visible;padding:8px 16px 16px}
 .creative-pinned-rail>[data-creative-panel="1"]{display:flex;flex-direction:column;min-height:calc(100svh - 48px)}
 .creative-pinned-rail #creative-type-form{display:flex;flex-direction:column;flex:1;min-width:0}
 .creative-pinned-rail #creative-type-form fieldset{display:flex;flex-direction:column;flex:1;min-width:0;margin:0;padding:0;border:0}
 .creative-pinned-rail #creative-type-form .creative-options{flex:1;grid-auto-rows:1fr}
 .creative-pinned-rail #creative-type-form .creative-option-type{align-content:center}
 .creative-pinned-rail #creative-type-form .creative-actions{flex:none}
 .creative-pinned-rail .creative-question{font-size:clamp(32px,4vw,48px)}
 .creative-pinned-rail .creative-helper{margin:8px 0 16px}
 .creative-pinned-rail .creative-options{gap:12px}
 .creative-pinned-rail .creative-option{min-height:80px;padding:12px 16px}
 .creative-pinned-rail .creative-option-type{--type-art:48px;min-height:0;gap:12px;grid-template-columns:24px minmax(0,1fr) var(--type-art)}
 .creative-pinned-rail .creative-option-copy{--od-gap:4px}
 .creative-pinned-rail .creative-option-title{font-size:26px;line-height:1.08}
 .creative-pinned-rail .creative-option-description{font-size:16px;line-height:1.5}
 .creative-pinned-rail .creative-error{min-height:0;margin:8px 0}
 .creative-pinned-rail .creative-error:empty{display:none}
 .creative-pinned-rail .creative-actions{margin-top:16px}
 .creative-pinned-rail .creative-primary,.creative-pinned-rail .creative-back{min-height:48px;padding:8px 24px}
}




/* Camera-roll choices fill the remaining carousel height in three paired rows. */
@media(min-width:768px){
 .creative-sticky-content .creative-pinned-rail>[data-creative-panel="0"]{display:flex;flex-direction:column;height:100%;min-height:0}
 .creative-pinned-rail #camera-roll-form{display:flex;flex-direction:column;flex:1 0 auto;min-width:0}
 .creative-pinned-rail #camera-roll-form fieldset{display:flex;flex-direction:column;flex:1;min-width:0;margin:0;padding:0;border:0}
 .creative-pinned-rail #camera-roll-form .creative-camera-options{flex:1;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(96px,1fr)) minmax(64px,.65fr)}
 .creative-pinned-rail #camera-roll-form .creative-option{min-height:96px;padding:16px 24px}
 .creative-pinned-rail #camera-roll-form .creative-option:last-child{width:100%;min-height:64px}
 .creative-pinned-rail #camera-roll-form .creative-actions{flex:none;margin-top:16px}
}

/* Shared carousel navigation: free browsing, independent of answer completion. */
.creative-progress.creative-carousel-nav{align-items:center;flex-wrap:nowrap;gap:24px}
.creative-carousel-dots{display:flex;align-items:center;gap:8px}
.creative-carousel-arrow,.creative-carousel-dot{display:grid;place-items:center;width:48px;height:48px;padding:0;color:var(--fg);cursor:pointer}
.creative-carousel-arrow{background:transparent;border:2px solid var(--fg);border-radius:50%;transition:transform 200ms ease-out,background 200ms ease-out}
.creative-carousel-arrow svg{display:block;width:24px;height:24px}
.creative-carousel-arrow:disabled{opacity:.35;cursor:default}
.creative-carousel-dot{background:transparent;border:0;border-radius:50%}
.creative-carousel-dot span{display:block;width:12px;height:12px;border:2px solid var(--fg);border-radius:50%}
.creative-carousel-dot[aria-current="true"] span{background:var(--fg);transform:scale(1.3)}
.creative-carousel-arrow:focus-visible,.creative-carousel-dot:focus-visible{outline:3px solid var(--fg);outline-offset:4px}
@media(hover:hover){.creative-carousel-arrow:hover:not(:disabled){background:var(--yellow);transform:scale(1.08)}.creative-carousel-dot:hover span{background:var(--fg)}}
@media(prefers-reduced-motion:reduce){.creative-carousel-arrow{transition:none}.creative-carousel-arrow:hover:not(:disabled){transform:none}}

/* Puffy creative identities — reference-derived mascot colours, shared editable artwork. */
#creative-type-form,#camera-roll-form{--puffy-ink:#1b3215;--puffy-body:#dfecb8;--puffy-leaf:#b5d18a;--puffy-shade:#c5dd97;--puffy-cheek:#f0484f}
#creative-type-form .type-illustration{display:block;width:var(--type-art);height:auto;aspect-ratio:34/41;align-self:center;overflow:visible}
#creative-type-form .puffy-type-art{display:block;width:100%;height:auto;aspect-ratio:34/41;overflow:visible}
#creative-type-form img.puffy-type-art{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;background:transparent;mix-blend-mode:normal;filter:none;clip-path:none;mask:none;opacity:1}
#creative-type-form .creative-option-type:nth-child(2) .type-illustration{width:calc(var(--type-art) * 1.28);margin-inline-start:calc(var(--type-art) * -.28)}
#creative-type-form .creative-option-type:nth-child(6) .type-illustration,
#creative-type-form .creative-option-type:nth-child(8) .type-illustration{width:calc(var(--type-art) * 1.30);margin-inline-start:calc(var(--type-art) * -.30)}
.camera-illustration{display:block;width:clamp(92px,8vw,126px);height:100%;max-height:132px;justify-self:end;align-self:center;pointer-events:none}
.camera-puffy-art{display:block;width:100%;height:100%;object-fit:contain;overflow:visible;background:transparent}
.creative-pinned-rail #camera-roll-form .creative-option{display:grid;grid-template-columns:28px minmax(0,1fr) clamp(92px,8vw,126px);gap:18px;align-items:center}
.creative-pinned-rail #camera-roll-form .creative-option-title{font-size:clamp(30px,2.5vw,38px);line-height:1.02}
.creative-pinned-rail .creative-helper{font-size:clamp(22px,1.7vw,26px);line-height:1.35}
.creative-pinned-rail .creative-action-hint{font-size:clamp(20px,1.4vw,23px);line-height:1.35}
.creative-pinned-rail .creative-primary,.creative-pinned-rail .creative-back{font-size:clamp(20px,1.4vw,23px)}
@media(min-width:768px){
 .creative-sticky-content .creative-intro{margin-bottom:8px}
 .creative-sticky-content .creative-kicker{margin-bottom:8px}
 .creative-sticky-content .creative-intro h2{font-size:clamp(32px,3.2vw,48px);line-height:1.05}
 .creative-sticky-content .creative-intro h2 br{display:none}
 .creative-sticky-content .creative-progress{margin-bottom:8px}
 .creative-sticky-content #creative-type-form .creative-options{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(min-content,1fr));gap:8px 16px}
 .creative-sticky-content .creative-question-rail.creative-pinned-rail>[data-creative-panel="1"]{min-height:0;height:100%;max-height:100%;overflow-y:auto;overscroll-behavior-y:auto}
 .creative-pinned-rail #creative-type-form{flex:1 0 auto}
 .creative-pinned-rail #creative-type-form .creative-option-type{--type-art:clamp(88px,7vw,104px);grid-template-columns:24px minmax(0,1fr) var(--type-art);gap:12px;min-height:128px;padding:12px 16px}
 .creative-pinned-rail #creative-type-form .creative-option-title{font-size:clamp(29px,2.15vw,34px);line-height:1.02}
 .creative-pinned-rail #creative-type-form .creative-option-description{font-size:clamp(19px,1.35vw,22px);line-height:1.3}
 .creative-pinned-rail #creative-type-form .creative-actions{margin-top:8px;gap:8px}
 .creative-pinned-rail #creative-type-form .creative-action-hint{max-width:38ch}
 .creative-pinned-rail .creative-helper{margin:4px 0 8px}
 .creative-pinned-rail .creative-question{font-size:clamp(52px,5.2vw,76px);line-height:.94}
}
@media(max-width:767px){
 #creative-type-form .creative-options{grid-template-columns:minmax(0,1fr)}
 #creative-type-form .creative-option-type{--type-art:40px;grid-template-columns:24px minmax(0,1fr) var(--type-art);gap:8px;padding:16px 12px}
 .creative-pinned-rail .creative-question{font-size:clamp(40px,11vw,54px);line-height:.98}
 .creative-pinned-rail .creative-helper{font-size:20px}
 .creative-pinned-rail #camera-roll-form .creative-option{grid-template-columns:24px minmax(0,1fr) 84px;gap:10px;padding:16px 12px}
 .creative-pinned-rail #camera-roll-form .creative-option-title{font-size:clamp(26px,7.4vw,34px)}
 .camera-illustration{width:84px;max-height:100px}
 .creative-pinned-rail #creative-type-form .creative-option-title{font-size:28px}
 .creative-pinned-rail #creative-type-form .creative-option-description{font-size:19px}
 .creative-pinned-rail .creative-action-hint,.creative-pinned-rail .creative-primary,.creative-pinned-rail .creative-back{font-size:19px}
}

/* Mobile challenge: show both questions in sequence; desktop retains the pinned carousel. */
@media(max-width:767px){
 .creative-scroll-stage{height:auto!important}
 .creative-challenge{background:linear-gradient(180deg,#fffdf4 0%,#fffdf4 28%,var(--opening-yellow) 72%,var(--opening-green) 100%)}
 .creative-option-type:has(input[value="6"]){--type-card-bg:var(--gradient-light)}
 .creative-option-type:has(input[value="7"]){--type-card-bg:var(--accent-rose)}
 .creative-sticky-content{position:static;height:auto;display:block}
 .creative-sticky-content .creative-intro{margin-bottom:6px}
 .creative-sticky-content .creative-kicker{margin-bottom:4px;font-size:12px}
 .creative-sticky-content .creative-intro h2{font-size:clamp(25px,7.2vw,32px);line-height:.96}
 .creative-sticky-content .creative-progress{display:none}
 .creative-question-rail.creative-pinned-rail{position:static;display:block;width:100%;max-height:none;overflow:visible;scroll-snap-type:none}
 .creative-question-rail.creative-pinned-rail>.creative-panel{display:block;width:100%;min-width:0;height:auto;min-height:0;max-height:none;margin:0;padding:12px 8px 28px;overflow:visible}
 .creative-question-rail.creative-pinned-rail>[data-creative-panel="1"]{margin-top:24px}
 .creative-pinned-rail .creative-question{font-size:clamp(28px,8vw,36px);line-height:.98}
 .creative-pinned-rail .creative-helper{margin:3px 0 6px;font-size:14px;line-height:1.25}
 .creative-pinned-rail #camera-roll-form{display:flex;flex:1;min-height:0;flex-direction:column}
 .creative-pinned-rail #camera-roll-form fieldset{display:flex;flex:1;min-height:0;flex-direction:column;margin:0;padding:0;border:0}
 .creative-pinned-rail #camera-roll-form .creative-camera-options{flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr)) minmax(52px,.65fr);gap:6px}
 .creative-pinned-rail #camera-roll-form .creative-option{min-height:56px;padding:4px 6px;grid-template-columns:16px minmax(0,1fr) 44px;gap:4px;border-radius:12px}
 .creative-pinned-rail #camera-roll-form .creative-option:last-child{grid-column:1/-1;width:100%;min-height:0}
 .creative-pinned-rail #camera-roll-form .creative-option-title{font-size:clamp(14px,4vw,17px);line-height:1;white-space:nowrap}
 .creative-pinned-rail #camera-roll-form .creative-option:last-child .creative-option-title{white-space:normal}
 .creative-pinned-rail #camera-roll-form input[type="checkbox"]{width:16px;height:16px}
 .camera-illustration{width:44px;max-height:52px}
 .creative-pinned-rail #camera-roll-form .creative-actions{flex:none;margin-top:6px;gap:6px}
 .creative-pinned-rail #camera-roll-form .creative-action-hint{font-size:12px;line-height:1.2;max-width:24ch}
 .creative-pinned-rail #camera-roll-form .creative-primary{min-height:44px;padding:8px 14px;font-size:15px}
 .creative-pinned-rail #camera-roll-form .creative-error{min-height:0;margin:0;font-size:12px}
 .creative-question-rail.creative-pinned-rail>[data-creative-panel="1"]{padding-top:4px}
 .creative-pinned-rail #creative-type-form .creative-option-title{font-size:clamp(17px,4.8vw,21px);line-height:1.02}
 .creative-pinned-rail #creative-type-form .creative-option-description{font-size:14px;line-height:1.25}
 .creative-pinned-rail #creative-type-form .creative-action-hint{font-size:12px;line-height:1.2}
 .creative-pinned-rail #creative-type-form .creative-primary,
 .creative-pinned-rail #creative-type-form .creative-back{font-size:15px}
}

/* Compact Creator Wall: full portraits and names only. */
.creator-wall{--wall-tile-width:176px;--wall-grid-gap:clamp(16px,2vw,36px);--wall-tile-radius:12px}
.creator-wall .closing-intro{margin-bottom:24px}
.wall-grid{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));justify-content:stretch;align-items:stretch;gap:var(--wall-grid-gap);list-style:none;padding:0;margin:0}
.wall-tile{display:grid;grid-template-rows:auto 1fr;min-width:0;padding:8px;background:var(--surface);color:var(--fg);border-radius:var(--wall-tile-radius)}
.wall-tile-photo{display:grid;place-items:center;aspect-ratio:2/3;background:var(--surface)}
.wall-tile-photo img{display:block;width:100%;height:100%;object-fit:contain;aspect-ratio:auto}
.wall-tile h3{margin:0;padding:12px 4px 4px;text-align:center;font:700 16px/1.5 var(--sans);overflow-wrap:anywhere}
.wall-tile-invitation{display:flex;align-items:center;justify-content:center;padding:24px;min-height:240px;text-align:center}
.wall-tile-invitation h3{padding:0;max-width:12ch}
@media(min-width:1024px){.wall-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.wall-grid-note{margin:16px 0 0;text-align:center;font:400 16px/1.5 var(--sans);color:var(--fg)}
@media(max-width:767px){
 .creator-wall{--wall-grid-gap:4px;padding-block:24px 28px}
 .creator-wall .closing-intro{margin-bottom:8px}
 .creator-wall .closing-intro h2{margin-bottom:0;font-size:clamp(28px,8vw,34px)}
 .wall-grid{display:grid;width:100%;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;justify-content:stretch;gap:var(--wall-grid-gap);overflow:visible;overscroll-behavior:auto;scroll-snap-type:none;scroll-padding-inline:0;padding:0;scrollbar-width:none}
 .wall-grid::-webkit-scrollbar{display:none}
 .wall-tile{padding:2px;border-radius:6px;scroll-snap-align:none}
 .wall-tile h3{padding:3px 1px 1px;font-size:11px;line-height:1.15}
 .wall-tile-invitation{min-height:0;padding:4px}
 .wall-tile-invitation h3{font-size:10px;line-height:1.1}
 .wall-grid-note{margin-top:6px;font-size:11px;line-height:1.3}
}

/* Supplied portrait placeholder: decorative cover crop; brand and copy remain above it. */
:root{--hero-video-position:50% 52%;--hero-video-white:#fff;--hero-logo-width:184px;--hero-video-gutter:24px}
body > .site-header{position:absolute;top:0;left:0;width:100%;min-height:144px;padding:24px var(--hero-video-gutter);z-index:40}
body > .site-header .pf-logo{width:var(--hero-logo-width);filter:brightness(0) invert(1)}
.hero.wrap{position:relative;width:100%;max-width:none;min-height:100svh;padding:176px var(--hero-video-gutter) 64px;gap:0;align-items:start;background:var(--golden);color:var(--hero-video-white)}
.hero .hero-video-backdrop,.hero.motion-host > .hero-video-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hero-video-backdrop video{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--hero-video-position)}
.hero-video-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 84%,rgb(248 193 141 / .28) 93%,var(--golden) 100%),linear-gradient(180deg,rgba(0,0,0,.68),rgba(0,0,0,.56) 40%,rgba(0,0,0,.10) 78%,transparent 100%)}
.hero .hero-copy,.hero.motion-host > .hero-copy{position:relative;z-index:3;width:100%;max-width:none;align-self:start;margin:0 auto;color:var(--hero-video-white)}
.hero .eyebrow,.hero h1{color:#FFE45C}
.hero .eyebrow:before{background:currentColor}
.hero h1{margin-bottom:0;text-shadow:0 3px 18px rgb(0 0 0 / .38)}
.skip:focus{z-index:100}
@media(max-width:767px){:root{--hero-video-gutter:16px;--hero-logo-width:152px}body > .site-header{min-height:120px;padding-block:24px}.hero.wrap{min-height:100svh;padding-top:152px;padding-bottom:48px}.hero .eyebrow{font-size:14px;margin-bottom:16px}}

/* Let the checklist occupy the available pinned viewport. */
@media(min-width:768px) and (min-height:600px){
 .requirements-section.wrap{
  width:100%;
  max-width:none;
  margin-inline:0;
  padding-inline:32px
 }
 .requirements-stage{--requirements-title-size:clamp(40px,6cqw,120px);--check-card-title:clamp(64px,8vw,144px);--check-card-label:clamp(18px,1.6vw,24px)}
 .requirements-stage.is-pinned .requirements-scene{height:calc(100svh - var(--requirements-pin-top) - 48px);display:grid;grid-template-rows:auto minmax(0,1fr);gap:16px}
 .requirements-stage.is-pinned .requirements-heading{margin:0;line-height:1.04}
 .requirements-stage.is-pinned .requirements-window{min-height:0;padding:16px 0 40px}
 .requirements-stage.is-pinned .requirements-deck{height:100%;padding:2.5% 48px 4%;align-items:center}
 .requirements-stage.is-pinned .requirement-card{width:92%;height:92%;min-height:0;padding:28px 44px;gap:22px;align-self:center}
 .requirements-stage.is-pinned .requirement-card h3{max-width:100%;font-size:min(8vw,15svh,144px)}
 .requirements-stage.is-pinned .requirement-mark{width:64px;height:64px;flex-shrink:0}
 .requirements-stage.is-pinned .requirement-mark svg{width:40px;height:40px}
}

/* Viewport-width Creator Wall and Creative Drop, aligned with the challenge gutter. */
.creator-wall.wrap,
.creative-drop.wrap{
 width:100%;
 max-width:none;
 margin-inline:0;
 padding-inline:clamp(16px,2.5vw,48px);
}
.creator-wall.wrap{padding-inline:clamp(12px,1.4vw,24px)}

/* Let the application form use the viewport while retaining a small safe gutter. */
.application-section.wrap{
 width:100%;
 max-width:none;
 margin-inline:0;
 padding-inline:clamp(16px,2.5vw,48px);
}

/* Give the opening question and checklist distinct breathing room. */
.question-section + .requirements-section{
 margin-block-start:clamp(64px,8vw,128px);
}

/* Opening colour journey: let the page gradient remain visible beneath the question. */
:root{
 --opening-pink:#F3A8B8;
 --opening-orange:#F6B47A;
 --opening-green:#B8D5A8;
 --opening-yellow:#F6DB70;
 --opening-cream:#FFF9DE
}
.hero-video-backdrop::after{
 background:linear-gradient(180deg,transparent 84%,rgb(243 168 184 / .34) 93%,var(--opening-pink) 100%),linear-gradient(180deg,rgba(0,0,0,.68),rgba(0,0,0,.56) 40%,rgba(0,0,0,.10) 78%,transparent 100%)
}
.question-section,
.question-section.is-viewport-visible{
 background:transparent
}
.question-section.is-viewport-centered{background:transparent;box-shadow:none}
.requirements-section{
 background:transparent;
 padding-bottom:0
}
.requirements-reading-stage{
 width:100vw;
 margin-inline:calc(50% - 50vw);
 background:linear-gradient(180deg,var(--opening-yellow) 0%,var(--opening-cream) 78%,#fffdf4 100%)
}
.creative-challenge{
 background:linear-gradient(180deg,#fffdf4 0%,#fffdf4 68%,var(--opening-yellow) 100%)
}
.question-section + .requirements-section{
 box-shadow:none
}
.requirements-mobile-break{display:none}
@media(max-width:767px){
 :root{--reassurance-scroll-span:120svh;--arch-scroll-space:52svh}
 .question-section + .requirements-section{margin-block-start:32px}
 .requirements-section{padding-block:24px 0;text-align:center}
 .requirements-scene{padding-block:4px 12px}
 .requirements-heading{
  width:100%;
  max-width:100%;
  margin-inline:auto;
  font-size:clamp(48px,13vw,64px);
  line-height:.98;
  text-align:center;
  white-space:normal;
  text-wrap:balance
 }
 .requirements-mobile-break{display:block}
 .requirements-stage.is-pinned .requirements-window{padding-block:12px 24px}
 .requirements-deck{justify-items:center}
 .requirement-card{align-items:center;text-align:center}
 .requirement-card-top{justify-content:center;text-align:center;flex-wrap:wrap}
 .requirement-card h3,.requirement-status,.requirements-close{text-align:center}
 .requirements-reading-stage{padding-block:14svh}
 .requirements-close{margin-top:16px}
}

/* Mobile Creative Drop: a shorter, calmer reading and upload section. */
@media(max-width:767px){
 .creative-drop{--drop-heading:clamp(38px,11vw,48px);--drop-prompt:clamp(23px,6.5vw,28px);padding-block:32px 40px}
 .creative-drop.wrap{padding-inline:14px}
 .drop-header{margin-bottom:24px;max-width:22rem}
 .creative-drop .creative-kicker{font-size:13px;line-height:1.35;margin-bottom:8px}
 .drop-prompts{gap:16px}
 .drop-prompt h3{margin-bottom:12px;line-height:1.05}
 .creative-drop p,.drop-prompt .drop-equipment{font-size:16px;line-height:1.45}
 .drop-prompt p{margin-bottom:12px}
 .drop-or{min-width:44px;min-height:44px;font-size:13px}
 .drop-ideas{margin-top:16px}
 .drop-ideas h4{margin-bottom:8px;font-size:16px;line-height:1.35}
 .drop-idea-list{--od-gap:6px}
 .drop-idea-list li{padding:7px 11px;font-size:16px;line-height:1.25}
 .drop-upload{margin-top:24px;padding:20px 16px}
 .drop-upload-icon{width:36px;height:36px;margin-bottom:12px}
 .drop-upload h3{font-size:clamp(27px,8vw,34px);margin-bottom:8px}
 .creative-drop .drop-upload-help{margin-bottom:16px;font-size:16px;line-height:1.4}
 .drop-upload-actions{--od-gap:8px}
 .creative-drop .drop-upload-actions button{font-size:16px}
 .creative-drop .drop-privacy,.creative-drop .drop-status{margin-top:12px;font-size:16px;line-height:1.4}
 .drop-preview{margin-top:20px}
}

/* Mobile application: compact the final form without changing desktop. */
@media(max-width:767px){
 .application-section{padding-block:32px 40px}
 .application-section.wrap{padding-inline:14px}
 .application-section .closing-intro{margin-bottom:24px}
 .application-section .closing-intro .creative-kicker{font-size:13px;line-height:1.35;margin-bottom:8px}
 .application-section .closing-intro h2{font-size:clamp(36px,10vw,44px);line-height:1.02;margin-bottom:10px}
 .application-section .closing-intro p{font-size:16px;line-height:1.45;margin-top:8px}
 .application-form fieldset{margin-bottom:28px}
 .application-form legend{font-size:clamp(27px,7.5vw,32px);line-height:1.05;margin-bottom:14px}
 .application-grid{--application-gap:14px;--od-gap:14px}
 .application-field{--od-gap:5px}
 .application-field label{font-size:16px;line-height:1.35}
 .application-field label span{font-size:15px}
 .application-field input{min-height:50px;padding:10px 12px;font-size:16px;line-height:1.4;border-radius:10px}
 .application-field .field-help,.application-field .field-error,.interest-error{font-size:16px;line-height:1.35}
 .application-contact-help{font-size:16px;line-height:1.45;margin-bottom:16px}
 .application-interests{gap:8px}
 .application-interest{min-height:50px;padding:10px 14px;gap:10px;font-size:16px;line-height:1.3}
 .application-interest input{width:20px;height:20px}
 .application-actions{gap:16px}
 .application-actions p{font-size:16px;line-height:1.45}
 .application-actions .creative-primary{font-size:16px}
 .application-errors{padding:18px 16px;margin-bottom:20px}
 .application-errors h3{font-size:18px}
 .application-review{padding:24px 16px}
 .application-review h3{font-size:clamp(28px,8vw,36px);margin-bottom:10px}
 .application-review>p,.application-review dd{font-size:16px;line-height:1.45}
 .application-review dl{gap:16px;margin:20px 0}
 .application-review dt{font-size:13px}
}

/* Keep every Creative Type radio aligned to the same padded card corner. */
#creative-type-form .creative-option-type{position:relative}
#creative-type-form .creative-option-type>input[type="radio"]{
 position:absolute;
 top:16px;
 left:16px;
 margin:0;
 z-index:2;
}
#creative-type-form .creative-option-type>.creative-option-copy{
 grid-column:2;
 grid-row:1;
}
#creative-type-form .creative-option-type>.type-illustration{
 grid-column:3;
 grid-row:1;
}
@media(max-width:767px){
 #creative-type-form .creative-option-type>input[type="radio"]{top:12px;left:12px}
}

/* Seamless hero: peach logo strip, full-bleed video, pink headline strip. */
    :root {
      --hero-peach: #EBCBAC;
      --hero-pink: #E6A49A;
    }
    body > .site-header {
      position: relative;
      top: auto;
      left: auto;
      width: 100%;
      min-height: 112px;
      padding: 20px clamp(16px, 3vw, 48px);
      display: flex;
      align-items: center;
      background: var(--hero-peach);
      z-index: 40;
    }
    body > .site-header::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: -40px;
      height: 40px;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(235, 203, 172, .92), rgba(235, 203, 172, 0));
      z-index: 2;
    }
    body > .site-header .brand { position: relative; z-index: 3; }
    body > .site-header .pf-logo {
      width: min(184px, 42vw);
      filter: none;
    }
    .hero.wrap {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: auto auto;
      align-items: stretch;
      justify-items: stretch;
      gap: 0;
      width: 100%;
      max-width: none;
      min-height: 0;
      padding: 0;
      background: transparent;
      color: var(--fg);
      overflow: visible;
    }
    .hero .hero-video-backdrop,
    .hero.motion-host > .hero-video-backdrop {
      position: relative;
      inset: auto;
      grid-area: 1 / 1;
      width: 100%;
      height: auto;
      min-height: 0;
      aspect-ratio: 16 / 9;
      overflow: hidden;
      background: #111;
    }
    .hero-video-backdrop video {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      background: #111;
    }
    .hero-video-backdrop::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(235, 203, 172, .34), transparent 13%),
        linear-gradient(180deg, transparent 76%, rgba(230, 164, 154, .82) 100%);
    }
    .hero .hero-copy,
    .hero.motion-host > .hero-copy {
      position: relative;
      grid-area: 2 / 1;
      align-self: stretch;
      width: 100%;
      max-width: none;
      margin: 0;
      padding: 40px clamp(16px, 3vw, 48px) 64px;
      background: var(--hero-pink);
      color: var(--fg);
      text-align: center;
      pointer-events: auto;
      z-index: 3;
    }
    .hero .hero-copy::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: -56px;
      height: 56px;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(230, 164, 154, 0), var(--hero-pink));
    }
    .hero .hero-copy::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: -72px;
      height: 72px;
      pointer-events: none;
      background: linear-gradient(180deg, var(--hero-pink), rgba(230, 164, 154, 0));
      z-index: 2;
    }
    .hero .eyebrow { display: none; }
    .hero h1 {
      position: relative;
      z-index: 3;
      margin: 0 auto;
      color: var(--fg);
      text-shadow: none;
    }
    @media (max-width: 767px) {
      body > main#main { transform: none !important; }
      body > .site-header {
        position: absolute;
        top: 0;
        left: 0;
        min-height: 84px;
        padding: 18px 16px;
        background: transparent;
      }
      body > .site-header::after { display: none; }
      body > .site-header .pf-logo { width: min(148px, 44vw); }
      .hero.wrap {
        display: block;
        position: relative;
        width: 100%;
        height: 100svh;
        min-height: 100svh;
        padding: 0;
        background: transparent;
        overflow: hidden;
        transform: none !important;
      }
      .hero .hero-video-backdrop,
      .hero.motion-host > .hero-video-backdrop {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 100%;
        aspect-ratio: auto;
        background: transparent;
      }
      .hero-video-backdrop video {
        object-fit: cover;
        object-position: center;
        background: transparent;
      }
      .hero-video-backdrop::after {
        display: block;
        inset: auto 0 0;
        height: clamp(96px, 22vw, 144px);
        background: linear-gradient(
          180deg,
          rgba(243, 168, 184, 0) 0%,
          rgba(243, 168, 184, .24) 38%,
          rgba(243, 168, 184, .72) 72%,
          var(--opening-pink) 100%
        );
        z-index: 2;
      }
      .hero .hero-copy,
      .hero.motion-host > .hero-copy {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 5.5%;
        width: 100%;
        padding: 0 16px;
        background: transparent;
        z-index: 4;
      }
      .hero .hero-copy::before,
      .hero .hero-copy::after { display: none; }
      .hero h1 {
        max-width: 100%;
        font-size: clamp(28px, 8.5vw, 44px) !important;
        line-height: .94;
      }
    }

/* Desktop hero handoff: carry the hero pink slowly through the campaign
       question and ease into apricot across the checklist opening. */
    @media (min-width: 768px) {
      :root { --hero-desktop-brightness: 1.05; }
      #hero-background-video {
        filter: brightness(var(--hero-desktop-brightness));
      }
      .hero .hero-copy::after {
        left: -96px;
        right: -96px;
        bottom: -260px;
        height: 420px;
        background: linear-gradient(
          180deg,
          var(--hero-pink) 0%,
          var(--hero-pink) 28%,
          color-mix(in srgb, var(--hero-pink) 94%, transparent) 48%,
          color-mix(in srgb, var(--opening-pink) 72%, transparent) 76%,
          transparent 94%,
          transparent 100%
        );
        filter: blur(64px);
      }

      .question-section,
      .question-section.is-viewport-visible,
      .question-section.is-viewport-centered {
        position: relative;
        background: transparent;
        box-shadow: none;
      }

      .question-section + .requirements-section {
        margin-block-start: 0;
        padding-top: clamp(64px, 8vw, 128px);
        background: transparent;
      }
    }

    /* Mobile-only extended hero handoff: preserve the pink through the
       campaign question, then ease through apricot over the checklist. */
    @media (max-width: 767px) {
      .question-section,
      .question-section.is-viewport-visible,
      .question-section.is-viewport-centered {
        position: relative;
        background: linear-gradient(
          180deg,
          var(--opening-pink) 0%,
          color-mix(in srgb, var(--opening-pink) 96%, var(--opening-orange)) 34%,
          color-mix(in srgb, var(--opening-pink) 90%, var(--opening-orange)) 68%,
          color-mix(in srgb, var(--opening-pink) 78%, var(--opening-orange)) 100%
        );
        box-shadow: none;
      }

      .question-section + .requirements-section {
        margin-block-start: 0;
        background: linear-gradient(
          180deg,
          color-mix(in srgb, var(--opening-pink) 78%, var(--opening-orange)) 0,
          color-mix(in srgb, var(--opening-pink) 58%, var(--opening-orange)) 28svh,
          color-mix(in srgb, var(--opening-pink) 34%, var(--opening-orange)) 56svh,
          var(--opening-orange) 82svh,
          color-mix(in srgb, var(--opening-orange) 72%, transparent) 108svh,
          transparent 136svh
        );
      }
    }

.hero-mobile-title{display:flex;flex-direction:column}@media(max-width:767px){.hero .hero-copy{background:transparent!important}.hero-mobile-title{display:flex!important;flex-direction:column}}

/* Responsive corrections to the exported composition. */
*{scrollbar-color:var(--fg) color-mix(in srgb,var(--surface) 60%,transparent);scrollbar-width:thin}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:color-mix(in srgb,var(--surface) 60%,transparent)}
*::-webkit-scrollbar-thumb{background:var(--fg);border-radius:10px;border:2px solid var(--surface)}
*::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--fg) 80%,black)}
*::-webkit-scrollbar-thumb:active{background:color-mix(in srgb,var(--fg) 65%,black)}
.od-rail{scrollbar-width:thin}
.od-rail::-webkit-scrollbar{display:block}
@media(forced-colors:active){*{scrollbar-color:auto}}
html,body{overflow-x:clip}
.hero{overflow-x:clip}
.hero h1{font-size:clamp(32px,5.2vw,72px);max-width:100%;line-height:1.05}
.hero h1 span{display:block;width:auto;max-width:100%;white-space:normal;text-wrap:balance;overflow-wrap:normal}
.requirements-section{overflow-x:clip}
.requirements-stage,.requirements-scene{min-width:0;max-width:100%}
.requirements-scene{width:100%}
.requirements-heading{min-width:0;max-width:100%;font-size:clamp(30px,4.8vw,72px)}
.requirements-stage.is-pinned .requirements-scene{grid-template-columns:minmax(0,1fr)}
.requirements-stage.is-pinned .requirements-heading{width:100%}
.requirements-stage.is-pinned .requirements-window,
.requirements-stage.is-pinned .requirements-deck{min-width:0;max-width:100%}
.requirements-section.motion-host > .plane-airspace{z-index:1}
.requirement-card{min-width:0}
.requirement-card h3,.requirement-card s{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.application-field input{max-width:100%}
.application-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.application-send-status{min-height:1.5em;font-weight:650}
.application-send-status[data-state="success"]{color:var(--fg)}
.application-send-status[data-state="error"]{color:#8c2323}
@media(max-width:767px){
 .hero h1{font-size:clamp(28px,8vw,36px)!important;line-height:1.06}
 .hero .hero-copy{bottom:4.5%;padding-inline:20px}
 .hero h1 span{margin-inline:auto}
 .requirements-heading{font-size:clamp(40px,11vw,58px)}
 .requirements-stage.is-pinned .requirement-card h3{font-size:clamp(29px,7.5vw,42px)}
}

/* Application delivery states: replace the review card while mail is in flight. */
.application-send-screen{display:flex;min-height:580px;flex-direction:column;align-items:center;justify-content:center;padding:52px clamp(22px,6vw,72px);text-align:center}
.application-send-screen:not([hidden]){animation:application-stage-enter .35s ease-out both}
.application-send-screen h3{max-width:790px;margin:18px 0;font-size:clamp(48px,7vw,78px);line-height:.98}
.application-send-screen>p{max-width:54ch;margin:0;font-size:clamp(17px,2vw,20px);line-height:1.55}
.application-send-kicker{font:700 13px/1.5 var(--font-mono);letter-spacing:.09em;text-transform:uppercase}
.application-sending{border:2px solid var(--fg);background:var(--bg)}
.application-flight-art{position:relative;display:grid;place-items:center;width:174px;height:174px;margin-bottom:25px}
.application-flight-ring{position:absolute;border-radius:50%}
.application-flight-ring-outer{inset:0;border:2px dashed var(--fg);animation:application-orbit 12s linear infinite}
.application-flight-ring-inner{inset:20px;border:2px solid var(--fg);opacity:.32}
.application-flight-plane{position:relative;width:112px;height:112px;color:var(--fg);transform:rotate(-10deg);animation:application-flight 2.7s ease-in-out infinite}
.application-flight-spark{position:absolute;font-size:23px;line-height:1}
.application-flight-spark-one{top:3px;right:8px}
.application-flight-spark-two{bottom:6px;left:4px;font-size:17px}
.application-success{background:var(--fg);color:#FFF9DE}
.application-success h3{color:var(--bg)}
.application-success-seal{position:relative;width:142px;height:142px;margin-bottom:27px}
.application-success-seal svg{display:block;width:100%;height:100%}
.application-tick-path{stroke-dasharray:90;stroke-dashoffset:90;animation:application-draw .65s .18s ease-out forwards}
.application-seal-spark{position:absolute;color:var(--bg);font-size:25px;line-height:1;animation:application-pop .5s .35s ease-out both}
.application-seal-spark-left{left:-21px;top:19px}
.application-seal-spark-right{right:-18px;bottom:10px}
@keyframes application-stage-enter{from{transform:translateY(10px)}to{transform:none}}
@keyframes application-orbit{to{transform:rotate(360deg)}}
@keyframes application-flight{50%{transform:translate(4px,-7px) rotate(-5deg)}}
@keyframes application-draw{to{stroke-dashoffset:0}}
@keyframes application-pop{from{opacity:0;transform:scale(.3) rotate(-30deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(max-width:767px){
 .application-send-screen{min-height:540px;padding:38px 20px}
 .application-send-screen h3{font-size:clamp(43px,11vw,66px)}
 .application-send-screen>p{font-size:16px}
 .application-flight-art{width:145px;height:145px}
 .application-flight-plane{width:95px;height:95px}
 .application-flight-ring-inner{inset:18px}
}
@media(prefers-reduced-motion:reduce){
 .application-send-screen:not([hidden]),.application-flight-ring-outer,.application-flight-plane,.application-tick-path,.application-seal-spark{animation:none!important;transform:none!important;opacity:1!important}
 .application-tick-path{stroke-dashoffset:0}
}

/* v4: keep the desktop hero transition behind the campaign question. */
@media(min-width:768px){
 .hero.wrap{isolation:isolate;z-index:0}
 #your-story{isolation:isolate;z-index:4}
}

/* v4 creator ID preview and sharing controls. */
#creator-identity{scroll-margin-top:32px}
#creator-identity .identity-layout{grid-template-columns:minmax(0,432px) minmax(0,1fr);max-width:1120px;margin-inline:auto;gap:clamp(24px,4vw,64px)}
#creator-identity .identity-copy{--od-gap:20px;min-width:0}
.identity-reference{display:grid;gap:4px;padding:16px 20px;background:var(--opening-cream);border:1px solid var(--fg);border-radius:16px}
.identity-reference span{display:block;font-size:14px;font-weight:650}
.identity-reference strong{display:block;font:700 clamp(18px,2vw,24px)/1.5 var(--font-mono);overflow-wrap:anywhere}
.identity-caption{display:grid;gap:8px}
.identity-caption label{font-weight:750}
.identity-caption textarea{display:block;width:100%;min-height:224px;resize:vertical;border:1px solid var(--fg);border-radius:16px;padding:16px;background:var(--opening-cream);color:var(--fg);font:400 16px/1.5 var(--sans)}
.identity-caption textarea:focus-visible{outline:3px solid var(--fg);outline-offset:4px}
.identity-caption button{justify-self:start}
.identity-story-help h4{font:750 20px/1.4 var(--sans);margin:0 0 12px}
.identity-sharing{display:grid;gap:16px}
.identity-sharing h4{font:750 20px/1.4 var(--sans);margin:0}
.identity-platform-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#creator-identity .identity-platform-grid button,#creator-identity .identity-download{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 16px;font:750 16px/1.5 var(--sans);white-space:nowrap;cursor:pointer}
#creator-identity .identity-download{width:100%}
#creator-identity .identity-download .od-icon{width:20px;height:20px;flex:none}
#creator-identity .identity-sharing button:disabled{cursor:wait;opacity:.65}
#creator-identity .identity-sharing button:focus-visible{outline:3px solid var(--fg);outline-offset:4px}
.identity-story-help{padding:20px;background:var(--opening-cream);border:1px solid var(--fg);border-radius:16px}
.identity-story-help li+li{margin-top:8px}
#creator-identity .identity-note{font-size:14px;line-height:1.5}
@media(max-width:767px){
 #creator-identity .identity-layout{grid-template-columns:minmax(0,1fr);gap:24px}
 #creator-identity .identity-copy h3{font-size:clamp(32px,9vw,44px)}
 .identity-caption button{width:100%}
}
@media(max-width:359px){.identity-platform-grid{grid-template-columns:minmax(0,1fr)}}

/* Reserve the existing hero geometry and show art immediately, even if autoplay fails. */
.hero-poster{display:block;position:absolute;inset:0}
.hero-poster img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
#hero-background-video{position:absolute;inset:0;opacity:0}
#hero-background-video.has-frame{opacity:1}
@media(min-width:768px){.hero-poster{filter:brightness(var(--hero-desktop-brightness))}}
