/* Match-day paper collage. Static copy, one supporter-scarf loop, shared art entrances. */
:root{--fx-reveal:480ms;--fx-feedback:160ms;--fx-ink:#006b3614}
body{background-image:url('./assets/festival-paper.svg?v=fc01f697a7');background-size:320px 320px}
.site-header,.section-nav{background-color:var(--cream)}
.hero,.lineup-section,.prize-section,.stadium-section{position:relative;isolation:isolate}
.hero,.stadium-section{overflow:clip}
.hero-inner,.hero-bottom{z-index:1}
.festival-backdrop{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.festival-backdrop:before{content:'';position:absolute;right:-6%;top:-12%;width:64%;height:125%;background:url('./assets/festival-field.svg?v=8092f7fcfe') center/contain no-repeat;transform:rotate(17deg)}
.watermark-eleven{position:absolute;right:-12px;top:17%;font-family:var(--body);font-weight:800;font-size:clamp(220px,32vw,480px);color:#fff;opacity:.065;line-height:1;transform:rotate(-8deg)}
.festival-backdrop:after{content:'';position:absolute;left:-80px;top:-130px;width:320px;height:320px;border:50px solid #f4e7000d;border-radius:50%}
.hero .poster-display{text-shadow:3px 4px 0 #004722}
.hero-intro{padding-left:18px;position:relative}
.hero-intro:before{content:'';position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--yellow);transform:rotate(45deg)}
.hero-reward{border-radius:5px;outline:2px dashed #06452950;outline-offset:-7px;box-shadow:7px 7px 0 #003c244d}
.hero-slogan>span{box-shadow:4px 4px 0 #003d295c}
.hero-bottom{position:relative;background-color:var(--yellow);background-image:url('./assets/festival-check.svg?v=df3c718e13');color:var(--dark);border-block:4px solid var(--dark);padding-block:12px}
.hero-bottom>span:not(.sr-only){background:var(--yellow);padding:2px 10px}
.hero-visual:before{content:'';position:absolute;width:370px;height:370px;left:10%;top:36%;border:2px solid #ffe50055;border-radius:50%}
.hero-visual:after{content:'';position:absolute;width:405px;height:405px;left:6%;top:33%;border:1px dashed #ffe50066;border-radius:50%;pointer-events:none}
.party-pieces{position:absolute;inset:0;pointer-events:none;z-index:1}
.party-piece{position:absolute;display:block;width:10px;height:22px;background:var(--yellow);transform:rotate(24deg)}
.party-piece:nth-child(1){left:0;top:13%;transform:rotate(-30deg)}
.party-piece:nth-child(2){right:6%;top:24%;width:15px;height:15px;transform:rotate(24deg)}
.party-piece:nth-child(3){left:5%;top:47%;height:12px;width:12px;border-radius:50%;background:#e9f3e7}
.party-piece:nth-child(4){right:-3%;top:56%;width:8px;transform:rotate(-28deg)}
.party-piece:nth-child(5){left:36%;bottom:0;width:15px;height:15px;transform:rotate(65deg)}
.party-piece:nth-child(6){left:68%;top:8%;height:12px;width:12px;background:transparent;border:2px solid white;transform:rotate(25deg)}
.party-piece:nth-child(7){right:20%;bottom:12%;height:7px;width:18px;transform:rotate(-30deg)}
.party-piece:nth-child(8){left:5%;bottom:13%;width:7px;height:17px;background:#e9f3e7;transform:rotate(24deg)}
.ramen-steam{position:absolute;width:88px;height:78px;top:36%;left:54%;z-index:1;pointer-events:none;fill:none;stroke:white;stroke-width:4;stroke-linecap:round;opacity:.6}
.ramen-steam path{transform-box:fill-box;transform-origin:center}
.section-heading{position:relative}
.section-heading h2:after{content:'';display:block;width:58px;height:7px;margin:20px auto 0;background:var(--yellow);transform:skewX(-24deg)}
.section-label>span{background:var(--yellow);color:var(--green);border-style:dashed;border-width:2px}
.steps{gap:28px}
.steps>li{background:#f7f6eef2;border-bottom:1px solid var(--line);padding-inline:20px;border-radius:3px}
.steps>li:before{content:'';position:absolute;top:-5px;right:10px;width:30px;height:8px;background:var(--yellow);transform:rotate(12deg)}
.rule-strip{border-left:5px solid var(--green);border-right:5px solid var(--green)}
.lineup-section{background-image:url('./assets/festival-paper.svg?v=fc01f697a7');overflow:clip;border-block:8px solid #d6e4cd}
.lineup-section>.shell{position:relative;z-index:1}
.lineup-section:before{content:'';position:absolute;right:-170px;top:40px;width:500px;height:500px;border:44px double #006b360e;border-radius:50%;pointer-events:none}
.lineup-section:after{content:'';position:absolute;left:-80px;bottom:180px;width:210px;height:210px;border:24px solid #006b3610;transform:rotate(26deg);pointer-events:none}
.pitch-wrap{border:2px solid var(--green);padding:16px;box-shadow:7px 9px 0 #b5cba9}
.pitch{background-color:#116d36}
.pitch-lines{border-color:#ffffff80}
.pitch-lines:after{content:'';position:absolute;inset:0;box-shadow:inset 0 105px #ffffff05,inset 0 -105px #ffffff05}
.player-face{box-shadow:0 5px 0 #034d25}
.player-number{border:1px solid #fff59b}
.player-plus{background:var(--yellow);border-color:var(--yellow)}
.field-caption{border-top:1px solid #ffffff25;padding-top:10px}
.prize-section{overflow:clip;background-image:url('./assets/festival-paper.svg?v=fc01f697a7');border-bottom:1px solid #e4d99b}
.prize-section>.shell{position:relative;z-index:1}
.prize-section:before,.prize-section:after{content:'';position:absolute;width:140px;height:140px;border:2px dashed #cabc5066;border-radius:50%;pointer-events:none}
.prize-section:before{left:-65px;top:42px}.prize-section:after{right:-40px;bottom:48px;width:230px;height:230px}
.prize-photo{background:url('./assets/festival-rays.svg?v=d919c1d257') center/contain no-repeat}
.prize-photo:before{inset:11% 8% 18%}
.prize-seal{outline:2px dashed #fff7b0;outline-offset:-7px;box-shadow:4px 5px 0 #c7b72d}
.certificate{background:#fffad9b8;padding-inline:16px;border:2px dashed #b2a54b}
.access-map{border:2px solid var(--green);border-radius:5px;box-shadow:7px 7px 0 #d6e4cd}
.access-list>li{background:#f7f6eef2;padding-inline:12px}
.access-list>li>span{border-radius:4px;transform:rotate(-5deg)}
.stadium-section:before{content:'';position:absolute;inset:0;background:url('./assets/festival-field.svg?v=8092f7fcfe') 105% 50%/65% auto no-repeat;pointer-events:none;transform:rotate(-12deg)}
.stadium-section:after{content:'';position:absolute;left:0;right:0;bottom:0;height:20px;background-color:var(--yellow);background-image:url('./assets/festival-check.svg?v=df3c718e13')}
.stadium-inner{position:relative;z-index:1}
.stadium-copy h2{text-shadow:3px 3px 0 #004523}
.stadium-sparks{position:absolute;right:0;top:0;width:34%;height:100%;pointer-events:none}
.stadium-sparks .party-piece:nth-child(1){top:7%;left:26%}.stadium-sparks .party-piece:nth-child(2){top:12%;right:-3%}.stadium-sparks .party-piece:nth-child(3){top:65%;left:5%}.stadium-sparks .party-piece:nth-child(4){top:85%;right:2%}
.faq-list{background:#f7f6eef2;padding-inline:24px}
.page-footer{border-top:8px solid var(--green)}
.campaign-banner{background-image:url('./assets/festival-field.svg?v=8092f7fcfe');background-position:115% center;background-size:60% auto;background-repeat:no-repeat;border:2px solid var(--green);box-shadow:6px 6px 0 #d6e4cd}
.campaign-banner:after{content:'';position:absolute;left:0;right:0;bottom:0;height:10px;background:var(--yellow) url('./assets/festival-check.svg?v=df3c718e13')}

/* A single native toggle controls all non-essential motion, including off-screen loops. */
.header-actions{display:flex;align-items:center;gap:24px;min-height:44px}
.motion-toggle{display:flex;align-items:center;justify-content:center;gap:7px;background:var(--cream);color:var(--green);min-width:92px;min-height:44px;border:1px solid #91af8c;border-radius:6px;padding:7px 10px;font-weight:700;font-size:11px;line-height:1.2}
.motion-toggle[aria-pressed="false"]{border-style:dashed}
.motion-toggle:disabled{background:#e8eee1;color:#456340}
.motion-icon{display:block;width:12px;height:13px;border-inline:4px solid currentColor;flex-shrink:0}
.motion-toggle[aria-pressed="false"] .motion-icon{width:0;height:0;border:6px solid transparent;border-left:9px solid currentColor;border-right:0}
.section-nav .motion-toggle{border-radius:0;align-self:stretch;min-width:84px;border:0;border-left:1px solid var(--line);background:#e8efdf}

@media(max-width:1000px){.hero-visual:before{width:270px;height:270px;left:3%;top:43%}.hero-visual:after{width:290px;height:290px;left:0;top:41%}.ramen-steam{top:36%;left:53%;width:68px;height:65px}.party-piece:nth-child(6){left:92%}}
@media(max-width:700px){
 body{background-size:260px 260px}.header-actions{gap:10px}.header-actions .header-link{display:none}.motion-toggle{min-width:89px;font-size:10px;padding:7px 9px}.section-nav .motion-toggle{min-width:54px;padding:5px 4px;gap:4px;font-size:8px;flex-direction:column}.section-nav .motion-icon{width:10px;height:10px;border-inline-width:3px}.section-nav a{font-size:10px;padding-inline:3px}.section-nav a:nth-child(5){flex:1.25}
 .festival-backdrop:before{right:-160px;top:26%;width:570px;height:800px;transform:rotate(15deg);opacity:.65}.watermark-eleven{top:40%;right:-30px;font-size:260px;opacity:.055}.hero-intro{padding-left:14px}.hero-intro:before{width:6px;height:6px}.hero .poster-display{text-shadow:2px 3px 0 #004722}.hero-reward{box-shadow:5px 5px 0 #003c244d}.hero-bottom{padding:10px 7px;border-width:3px}.hero-bottom>span{padding-inline:6px}
 .hero-visual:before{width:212px;height:212px;left:0;top:30%}.hero-visual:after{width:234px;height:234px;left:-11px;top:26%}.ramen-steam{width:51px;height:52px;top:29%;left:49%}.hero-visual .party-piece:nth-child(1){left:1%;top:6%}.hero-visual .party-piece:nth-child(2){right:8%;top:36%;width:10px;height:10px}.hero-visual .party-piece:nth-child(3){left:1%;top:49%;width:7px;height:7px}.hero-visual .party-piece:nth-child(4){right:0;top:86%;width:6px;height:14px}.hero-visual .party-piece:nth-child(n+5){display:none}
 .section-heading h2:after{margin-top:16px;width:46px;height:6px}.steps{gap:24px}.steps>li{padding:20px 12px 20px;column-gap:16px;grid-template-columns:82px minmax(0,1fr)}.steps>li:before{right:15px}.step-number{position:static}.paper-icon{margin-inline:7px}.rule-strip{border-inline-width:3px}.pitch-wrap{padding:10px;border-width:1px;box-shadow:4px 6px 0 #b5cba9}.lineup-section{border-block-width:5px}.lineup-section:after{width:120px;height:120px;border-width:14px;left:-45px}.certificate{padding:18px 12px;gap:13px}.certificate h4{font-size:15px}.access-map{box-shadow:4px 5px 0 #d6e4cd}.access-list>li{padding-inline:8px}.faq-list{padding-inline:12px}.faq-list summary{font-size:13px}.stadium-section:before{background-position:60% 70%;background-size:120% auto;opacity:.6}.stadium-sparks{width:100%;height:160px;top:auto;bottom:0}.stadium-sparks .party-piece:nth-child(1){left:21%;top:17%}.stadium-sparks .party-piece:nth-child(2){right:16%;top:27%}.stadium-sparks .party-piece:nth-child(3){left:13%;top:75%}.stadium-sparks .party-piece:nth-child(4){right:25%;top:85%}.stadium-section:after{height:14px}
}
@media(prefers-reduced-motion:reduce){.party-piece,.ramen-steam path,.hero-vanta,.prize-seal,.reveal-in,.sheet-body{animation:none!important;transition:none!important}.ramen-steam path{opacity:.45}.reveal-in{opacity:1;transform:none}}

/* V03 art direction: supporter graphics, oversized ink, and a food-led collage. */
.hero-visual{isolation:isolate}
.art-rays{position:absolute;width:112%;max-width:none;left:-9%;top:23%;color:#ffe500;opacity:.32;transform:rotate(-7deg);pointer-events:none;z-index:-1}
.hero-visual:before{border:20px solid #ffffff0f;top:30%;left:3%;width:410px;height:410px}
.hero-visual:after{border:2px dashed #ffe5008c;top:29%;left:2%;width:420px;height:420px}
.hero-ramen{z-index:1}
.hero-vanta{z-index:2}
.hero-slogan{z-index:3}
.hero-slogan>span:nth-child(1){background:var(--cream);transform:rotate(-3deg)}
.hero-slogan>span:nth-child(2){transform:rotate(2deg)}
.hero-slogan>span:nth-child(3){transform:rotate(-2deg)}
.hero-visual>p{z-index:3;background:var(--cream);color:var(--green);padding:12px 18px;border:2px solid var(--dark);border-radius:50%;transform:rotate(-7deg);font-size:16px;bottom:-5px;left:4px;box-shadow:4px 4px 0 #002c2c55}
.hero-team-stamp{position:absolute;right:-8px;top:40px;z-index:2;color:var(--yellow);width:114px;height:114px;border:2px solid currentColor;border-radius:50%;outline:1px dashed currentColor;outline-offset:-7px;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(13deg);line-height:1.1}
.hero-team-stamp>b{font-family:var(--body);font-weight:800;font-size:43px}
.hero-team-stamp>span{font-size:9px;font-weight:900;text-align:center;letter-spacing:.1em;line-height:1.4}
.party-piece:nth-child(2),.party-piece:nth-child(5){width:24px;height:24px;background:none}
.party-piece:nth-child(2):before,.party-piece:nth-child(5):before{content:'✦';color:var(--yellow);font-size:34px;line-height:1}
.hero-visual .party-piece:nth-child(4){background:var(--cream);height:32px;width:12px}

/* Only this narrow graphic moves horizontally; the document scroll is native. */
.supporter-scarf{display:block;overflow:hidden;padding:10px 0;background-image:none;border-block:5px solid var(--dark)}
.scarf-track{width:max-content;display:flex}
.scarf-repeat{flex:none;min-width:max(100vw,840px);display:flex;align-items:center;justify-content:space-around;gap:26px;padding-inline:20px;font-family:var(--body);font-weight:800;font-size:28px;line-height:1.5;white-space:nowrap;letter-spacing:0}
.scarf-repeat i{font-style:normal;color:var(--green)}
.scarf-repeat>b{font-size:35px;font-weight:800}
.scarf-outline{color:var(--yellow);-webkit-text-stroke:1px var(--dark)}
#guide,.access-section{position:relative;isolation:isolate;overflow:clip}
.chapter-watermark{position:absolute;inset:12px 0 auto;pointer-events:none;z-index:-1;font-family:var(--body);font-weight:800;font-size:clamp(46px,8.5vw,128px);white-space:nowrap;text-align:center;line-height:1.1;color:var(--green);opacity:.065;transform:rotate(-3deg)}
.lineup-section>.chapter-watermark,.prize-section>.chapter-watermark{z-index:0}
.stadium-inner>.chapter-watermark{top:-50px;color:white;opacity:.08;font-size:clamp(46px,8vw,104px)}
.section-heading h2:after{width:88px;height:9px;margin-top:20px;transform:skewX(-24deg);box-shadow:18px 4px 0 #006b3624}
.lineup-section .section-heading>p:last-child{text-wrap:balance}
.section-label>span{border-radius:4px;transform:rotate(-7deg);box-shadow:3px 3px 0 #006b3620}
.steps>li{border:2px solid var(--green);border-radius:0;box-shadow:5px 5px 0 #d6e4cd;background:var(--cream)}
.steps>li:before{width:50px;height:13px;top:-7px;right:18px;border:1px solid #cab82e;transform:rotate(8deg)}
.step-number{left:12px;color:var(--green)}
.rule-strip{margin-top:28px}
.pitch-wrap{border-radius:6px;border-width:3px;box-shadow:8px 10px 0 #b5cba9}
.pitch-heading{border-bottom:1px dashed #f7f6ee5c;margin-bottom:12px}
.lineup-section:before{border-color:#006b3614}
.lineup-aside .eleven-number{color:var(--green);text-shadow:5px 5px 0 var(--yellow)}
.prize-photo{padding:32px 22px 22px}
.prize-photo:after{content:'';position:absolute;inset:5% 5% 10%;border:2px dashed #89760077;border-radius:50%;transform:rotate(-8deg);pointer-events:none}
.prize-photo>img,.prize-photo figcaption{z-index:1}
.prize-seal{z-index:2}
.access-map{border-radius:0;transform:rotate(-.5deg)}
.stadium-copy{position:relative;z-index:1}
.stadium-vanta{position:relative;z-index:1}

@media(max-width:1000px){
 .hero-team-stamp{width:86px;height:86px;right:-8px;top:96px}.hero-team-stamp>b{font-size:30px}.hero-team-stamp>span{font-size:7px}
 .art-rays{top:33%;width:118%}.hero-visual:before,.hero-visual:after{width:300px;height:300px;top:38%;left:0}
}
@media(max-width:700px){
 .art-rays{width:105%;left:-10%;top:16%;opacity:.36}.hero-visual:before,.hero-visual:after{width:240px;height:240px;left:-4%;top:19%}.hero-visual:before{border-width:12px}
 .hero-team-stamp{width:62px;height:62px;top:45px;right:9px;outline-offset:-5px}.hero-team-stamp>b{font-size:22px}.hero-team-stamp>span{font-size:5px}
 .hero-visual>p{font-size:11px;padding:9px 13px;top:0;bottom:auto;right:0;left:auto;border-width:1px;transform:rotate(5deg)}
 .supporter-scarf{padding:7px 0;border-width:3px}.scarf-repeat{font-size:20px;min-width:660px;gap:20px}.scarf-repeat>b{font-size:27px}
 .hero-visual .party-piece:nth-child(2){top:33%;right:0;width:20px;height:20px}.hero-visual .party-piece:nth-child(2):before{font-size:25px}
 .chapter-watermark{font-size:48px;top:19px}.stadium-inner>.chapter-watermark{font-size:43px;top:-25px;text-align:left}
 .section-heading h2:after{width:64px;height:7px;margin-top:18px}
 .steps>li{padding:22px 16px;column-gap:14px}.step-number{position:static}
 .pitch-wrap{padding:9px;border-width:2px;box-shadow:4px 6px 0 #b5cba9}.pitch-heading{padding-bottom:10px;margin-bottom:9px}
 .prize-photo{padding-top:24px}.access-map{transform:none}
}

/* A single entrance grammar: pieces settle into the match-day poster. */
@media(prefers-reduced-motion:no-preference){
 .motion-enabled .hero-slogan>span.reveal-in{animation:tape-arrive 720ms ease-out both;animation-delay:var(--reveal-delay,0ms)}
 .motion-enabled .section-heading.reveal-in h2:after{animation:accent-swipe 480ms ease-out both}
 .motion-enabled .step-illustration.reveal-in,.motion-enabled .certificate>span.reveal-in{animation:paper-arrive 480ms ease-out both}
 .motion-enabled .prize-photo.reveal-in{animation:collage-arrive 560ms ease-out both}
 .motion-enabled .player-face.reveal-in{animation:lineup-arrive 480ms cubic-bezier(.2,.8,.25,1) both;animation-delay:var(--reveal-delay,0ms)}
 /* A tap never waits for a decorative entrance to finish. */
 .motion-enabled .player:active .player-face,.motion-enabled .player:focus-visible .player-face{animation:none}
 .motion-enabled .ramen-steam path{animation:steam-rise 3000ms ease-out infinite;animation-play-state:paused}
 .motion-enabled .ramen-steam path:nth-child(2){animation-delay:-1000ms}.motion-enabled .ramen-steam path:nth-child(3){animation-delay:-2000ms}
 .motion-enabled .hero-vanta{animation:vanta-bob 4400ms ease-in-out infinite alternate;animation-play-state:paused}
 .motion-enabled .scarf-track{animation:scarf-parade 36s linear infinite;animation-play-state:paused}
 .motion-enabled .ramen-steam.is-onstage path,.motion-enabled .hero-vanta.is-onstage,.motion-enabled .supporter-scarf.is-onstage .scarf-track{animation-play-state:running}
 .motion-enabled .sheet[open] .sheet-body{animation:detail-arrive 180ms ease-out both}
 .motion-enabled .button,.motion-enabled .player-face{transition:transform var(--fx-feedback) ease-out}
 .motion-enabled .player:active .player-face{transform:scale(.94)}
 .motion-enabled .button:active{transform:translateY(2px) scale(.99)}
 .motion-suspended .ramen-steam path,.motion-suspended .hero-vanta,.motion-suspended .scarf-track{animation-play-state:paused!important}
}
@keyframes collage-arrive{from{opacity:.4;transform:translateY(20px) rotate(-3deg) scale(.94)}to{opacity:1;transform:none}}
@keyframes tape-arrive{from{opacity:.3;transform:translateX(-28px) rotate(-6deg)}to{opacity:1}}
@keyframes accent-swipe{from{opacity:0;transform:translateX(-36px) skewX(-24deg) scaleX(.4)}to{opacity:1;transform:skewX(-24deg)}}
@keyframes paper-arrive{from{opacity:.3;transform:translateY(12px) rotate(-12deg) scale(.9)}to{opacity:1}}
@keyframes lineup-arrive{from{opacity:.25;transform:translate(var(--entry-x,0px),20px) rotate(var(--entry-rotation,0deg)) scale(.8)}75%{opacity:1;transform:translate(0,-2px) scale(1.025)}to{opacity:1;transform:none}}
@keyframes scarf-parade{to{transform:translateX(-50%)}}
@keyframes steam-rise{0%{opacity:0;transform:translateY(10px)}25%{opacity:.7}75%{opacity:.3}100%{opacity:0;transform:translateY(-12px)}}
@keyframes vanta-bob{from{transform:translateY(0) rotate(8deg)}to{transform:translateY(-8px) rotate(11deg)}}
@keyframes detail-arrive{from{opacity:.6;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.scarf-track{animation:none!important;transform:none}.hero-visual,.player-face,.step-illustration,.prize-photo,.certificate>span{animation:none!important}}
