:root{--ink:#171713;--orange:#f15a24;--chalk:#faf9f2;--yellow:#ffd64e;--cyan:#36d8e4;--display:Anton,Impact,'Arial Narrow',sans-serif;--body:Barlow,Arial,sans-serif;--gutter:clamp(18px,4.167vw,60px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);font-family:var(--body);background:var(--orange) url('../assets/art/rip-mat.svg') center/1536px auto;font-size:20px;line-height:1.5}button,input,textarea,select{font:inherit;color:inherit}button,a,input,textarea,summary,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration-thickness:2px;text-underline-offset:4px}img,video{display:block;max-width:100%}img{height:auto}html,body{overflow-x:clip}video{background:#171713 url('../assets/art/foil-field.svg') center/cover}button:disabled{cursor:not-allowed;opacity:.8}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:4px;box-shadow:0 0 0 7px var(--ink)}h1,h2,h3,p,figure{margin:0}h1,h2,h3,.display{font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:1;letter-spacing:-.025em}h2{font-size:clamp(46px,5.833vw,84px)}h3{font-size:clamp(34px,3.75vw,54px)}p{max-width:42ch}.wrap{width:min(100%,1720px);margin:auto;padding-inline:var(--gutter)}.mat{background:var(--orange) url('../assets/art/rip-mat.svg') center/cover}.foil{background:#dce0db url('../assets/art/foil-field.svg') center/900px 600px}.skip{position:fixed;top:12px;left:12px;z-index:100;background:var(--yellow) url('../assets/art/rip-marks.svg') center/cover;padding:12px 18px;transform:translateY(-180%)}.skip:focus{transform:none}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.ticket{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:13px 28px;background:var(--yellow) url('../assets/art/rip-marks.svg') 40% 30%/520px;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);font-size:20px;font-weight:700;line-height:1.15;text-decoration:none;transform:rotate(-1deg);transition:transform .18s,box-shadow .18s}.ticket:hover,.ticket:focus-visible{transform:translateY(-3px) rotate(0);box-shadow:5px 8px 0 var(--ink)}.ticket.secondary{background:#dce0db url('../assets/art/foil-field.svg') center/cover}.small-button{border:2px solid var(--ink);background:#dce0db url('../assets/art/foil-field.svg') center/cover;min-height:44px;padding:7px 13px;font-size:15px;font-weight:700}.small-button:hover{background-image:url('../assets/art/rip-marks.svg')}.brand{display:flex;align-items:center;gap:15px;width:fit-content;text-decoration:none}.brand img{width:68px;height:68px;object-fit:contain}.brand-word{font-size:48px;line-height:.92}.hero{position:relative;min-height:900px;overflow:hidden;background-size:cover}.hero:after{content:'';position:absolute;inset:0;background:url('../assets/art/rip-marks.svg') center/cover;pointer-events:none;opacity:.55}.hero>.wrap{position:relative;z-index:1;padding-top:36px}.hero-content{display:grid;grid-template-columns:480px minmax(0,1fr);gap:54px;margin-top:64px}.hero-copy{position:relative;z-index:3}.hero h1{font-size:clamp(72px,7.222vw,104px);line-height:.97;letter-spacing:-.035em}.hero h1 span{display:block;white-space:nowrap}.hero-copy p{margin-top:26px;max-width:390px;line-height:1.4}.hero-copy .ticket{margin-top:27px}.for-stream{display:block;font-size:16px;margin-top:20px;font-weight:600}.hero-show{position:relative;margin-top:44px;align-self:start;min-width:0;transform:rotate(-3deg)}.hero-video{position:relative;z-index:2;margin:0;width:100%;border:7px solid var(--ink);box-shadow:12px 12px 0 rgba(23,23,19,.35)}.hero-video video{width:100%;aspect-ratio:16/9;object-fit:contain}.hero-show>.wrapper-art{position:absolute;inset:-66px -48px -48px;max-width:none;width:calc(100% + 96px);height:calc(100% + 114px);object-fit:fill;z-index:1;pointer-events:none}.hero-caption{position:relative;z-index:4;margin-top:17px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px;font-weight:700;background:#dce0db url('../assets/art/foil-field.svg') center/cover;border:2px solid var(--ink);padding:10px 13px}.caption-copy{max-width:230px;line-height:1.25}.caption-copy small{display:block;font-size:13px;font-weight:400;margin-top:3px}.controls{display:flex;gap:7px;flex-wrap:wrap}.hero-loose{display:flex;align-items:center;gap:4px;position:relative;margin-top:32px;margin-left:52px;transform:rotate(3deg);z-index:3}.sold-card{width:195px;transform:rotate(-11deg);filter:drop-shadow(5px 8px 0 #17171370);transition:transform .18s}.sold-card.second{width:205px;transform:rotate(9deg);margin-left:-10px}.sold-card:hover{transform:rotate(0) translateY(-6px)}.league-badge{display:flex;align-items:center;justify-content:center;flex-direction:column;border:4px solid var(--ink);border-radius:50%;width:130px;height:130px;flex-shrink:0;background:var(--yellow) url('../assets/art/rip-marks.svg') center/cover;transform:rotate(9deg);margin-left:18px;font-weight:700;font-size:17px;line-height:1.1;text-align:center}.league-badge strong{font-family:var(--display);font-size:55px;font-weight:400}.seam{position:relative;margin-top:-18px;z-index:3;background:#dce0db url('../assets/art/foil-field.svg') center/cover;clip-path:polygon(0 9%,8% 0,12% 8%,23% 4%,31% 11%,49% 2%,61% 9%,79% 0,92% 9%,100% 2%,100% 92%,90% 100%,76% 91%,58% 99%,44% 90%,25% 98%,12% 92%,0 100%);transform:rotate(-1.5deg);padding:28px var(--gutter);display:flex;justify-content:center;align-items:center;gap:34px;font-size:28px;font-weight:700;line-height:1.2}.seam span+span:before{content:'✦';display:inline-block;margin-right:34px;font-size:22px}.selection{padding-block:110px 96px;position:relative}.selection .lead{margin-top:20px;font-size:23px;max-width:660px}.feature{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:34px;align-items:center;margin-top:45px}.feature-media{position:relative;transform:rotate(1deg);border:5px solid var(--ink);background:url('../assets/art/foil-field.svg');box-shadow:9px 9px 0 var(--ink)}.feature-media video{width:100%;aspect-ratio:16/9}.feature-description p{font-size:18px;line-height:1.5;margin-top:18px}.feature-description .controls{margin-top:22px}.demo-label{font-size:14px;font-weight:600;margin-top:13px;max-width:none}.selector-row{display:flex;align-items:stretch;gap:24px;margin-top:45px}.scene-button{position:relative;width:calc((100% - 72px)/4);border:3px solid var(--ink);padding:0;background:url('../assets/art/foil-field.svg');transform:rotate(-2deg);text-align:left;transition:transform .18s;box-shadow:4px 5px 0 var(--ink)}.scene-button:nth-child(2){transform:rotate(1deg)}.scene-button:nth-child(3){transform:rotate(-1deg)}.scene-button img{aspect-ratio:16/9;width:100%;object-fit:contain}.scene-button span{display:block;padding:10px 13px;background:var(--ink) url('../assets/art/rip-marks.svg') center/cover;color:var(--chalk);font-weight:700;font-size:17px}.scene-button[aria-pressed=true]{outline:4px solid var(--yellow);outline-offset:3px}.scene-button:hover,.scene-button:focus-visible{transform:translateY(-5px) rotate(0)}.all-button{width:calc((100% - 72px)/4);padding:18px;border:3px solid var(--ink);background:var(--yellow) url('../assets/art/rip-marks.svg') center/cover;transform:rotate(2deg);box-shadow:4px 5px 0 var(--ink);text-align:left;font-weight:700;font-size:20px;line-height:1.2}.all-button b{display:block;font-family:var(--display);font-size:65px;font-weight:400;margin-bottom:8px}.catalog{margin-top:55px;border:4px solid var(--ink);background:url('../assets/art/foil-field.svg') center/900px 600px;padding:28px;scroll-margin-top:24px}.catalog[hidden]{display:none}.search-line{display:flex;align-items:flex-end;gap:12px;max-width:700px}.field{display:grid;gap:8px;flex:1;font-size:17px;font-weight:700}input,textarea,select{width:100%;border:2px solid var(--ink);border-radius:0;background:#e4e7e4 url('../assets/art/foil-field.svg') center/cover;padding:12px 14px;min-height:54px;line-height:1.4}textarea{resize:vertical}.result-count{font-size:16px;margin-block:20px}.results{display:grid;gap:26px}.result{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.6fr);align-items:center;gap:25px;padding-bottom:26px;border-bottom:3px dashed var(--ink)}.result img{width:100%;aspect-ratio:16/9;object-fit:contain}.result h3{font-size:38px}.result p{font-size:17px;margin-block:12px}.result:last-child{border:0;padding-bottom:0}.sync{position:relative;padding-block:96px;overflow:hidden}.sync:before{content:'';position:absolute;inset:0;background:url('../assets/art/opened-foil.svg') center/cover;opacity:.3;pointer-events:none}.sync-grid{position:relative;display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:70px;align-items:center}.sync h2{max-width:8ch}.sync-copy p{margin-top:25px;max-width:370px}.free-tape{display:inline-block;font-size:17px;font-weight:700;background:var(--cyan) url('../assets/art/rip-marks.svg') center/cover;padding:7px 14px;margin-bottom:24px;transform:rotate(-2deg);border:2px solid var(--ink)}.sync-copy .ticket{margin-top:28px}.coming{font-size:16px;margin-top:14px!important}.setup-link{display:inline-flex;min-height:44px;align-items:center;font-size:17px;font-weight:700;margin-top:10px}.sync-illustration{position:relative;min-height:410px}.sync-illustration>.cable{width:100%;margin-top:38px}.sync-origin{position:absolute;top:28%;left:8%;width:25%;font-weight:700;font-size:22px;line-height:1.2;transform:rotate(2deg)}.sync-target{position:absolute;top:8%;right:0;width:31%;transform:rotate(-3deg);filter:drop-shadow(5px 7px 0 #17171360)}.sync-illustration figcaption{font-size:16px;font-weight:600;position:absolute;bottom:6%;left:12%;max-width:340px}.finale{position:relative}.finale-picture{position:relative}.finale-picture>img:not(.stamp){width:100%;aspect-ratio:16/9;object-fit:contain}.stamp{position:static;width:140px;flex-shrink:0;filter:drop-shadow(1px 1px 0 var(--chalk));pointer-events:none}.finale-copy{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-block:56px}.finale-copy h2{font-size:clamp(46px,5vw,72px);max-width:750px}.finale-copy p{max-width:340px}.custom{padding-block:100px 84px;position:relative;overflow:hidden}.custom-grid{display:grid;grid-template-columns:minmax(0,540px) minmax(0,1fr);gap:90px;align-items:center}.custom-copy p{margin-top:25px;max-width:385px}.custom-copy .ticket{margin-top:30px}.custom-art{position:relative;min-height:390px;background:url('../assets/art/rip-marks.svg') center/contain no-repeat;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(4deg)}.custom-board{width:90%;border:9px solid var(--ink);padding:26px;background:url('../assets/art/foil-field.svg') center/cover;box-shadow:10px 12px 0 var(--ink);position:relative;transform:rotate(-6deg)}.custom-board img{width:90px;margin:0 auto 25px}.slot-sketch{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.slot-sketch i{height:38px;border:3px solid var(--ink);background:url('../assets/art/rip-marks.svg') center/cover}.custom-art figcaption{font-size:15px;font-weight:600;margin-top:28px}.help-inline{padding-block:50px 65px}.help-inline h2{font-size:clamp(38px,4vw,58px);margin-bottom:25px}.help-inline details{max-width:880px;border-top:3px solid var(--ink);padding:0 12px}.help-inline summary{cursor:pointer;min-height:65px;padding-block:18px;font-size:22px;font-weight:700}.help-inline details p{padding-bottom:24px;font-size:18px;max-width:70ch}.footer{padding-block:64px 125px}.footer-top{display:flex;justify-content:space-between;gap:30px;align-items:start}.footer .brand img{width:50px;height:50px}.footer .brand-word{font-size:34px}.footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 23px;max-width:560px;font-size:17px;font-weight:700}.footer nav a{display:flex;align-items:center;min-height:44px}.footer p{font-size:16px;margin-top:35px;max-width:600px}.menu-toggle{position:fixed;right:24px;bottom:max(18px,env(safe-area-inset-bottom));width:106px;height:88px;background:transparent;border:0;z-index:30;padding:0;transition:transform .18s}.menu-toggle img{width:100%;height:100%;object-fit:contain}.menu-toggle span{position:absolute;left:0;right:0;bottom:15px;font-weight:700;font-size:17px}.menu-toggle:hover{transform:rotate(-3deg) translateY(-4px)}.motion-toggle{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));left:18px;z-index:30;border:3px solid var(--ink);background:#dce0db url('../assets/art/foil-field.svg') center/cover;padding:10px 17px;min-height:46px;font-weight:700;font-size:15px;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}.motion-toggle .pause-symbol{display:inline-block;vertical-align:middle;width:13px;height:13px;border-inline:4px solid var(--ink);margin-right:7px}dialog{color:var(--ink);border:4px solid var(--ink);background:#dce0db url('../assets/art/foil-field.svg') center/900px 600px;max-height:calc(100dvh - 48px);width:min(680px,calc(100% - 32px));padding:36px;overflow:auto;box-shadow:10px 10px 0 var(--ink)}dialog::backdrop{background:#171713b8 url('../assets/art/rip-marks.svg') center/cover}dialog[open]{animation:tray-in .2s ease-out}.dialog-head{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:26px}.dialog-head h2{font-size:48px}.close{width:48px;height:48px;flex-shrink:0;border:3px solid var(--ink);background:var(--yellow) url('../assets/art/rip-marks.svg') center/cover;font-size:28px;line-height:1}.nav-links{display:grid;gap:7px}.nav-links a{font-family:var(--display);font-size:36px;line-height:1;padding:12px 16px;min-height:56px;border:2px solid var(--ink);text-decoration:none;background:url('../assets/art/rip-marks.svg') center/cover}.nav-links a:hover{background-color:var(--yellow)}.dialog-note{font-size:15px;margin-top:24px}.board-dialog{width:min(1120px,calc(100% - 32px))}.board-dialog h2{font-size:clamp(34px,4vw,58px)}.board-dialog video{width:100%;aspect-ratio:16/9}.board-dialog p{max-width:75ch;margin-top:20px;font-size:18px}.detail-stills{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.detail-stills figcaption{font-size:16px;font-weight:700;margin-bottom:8px}.detail-stills img{width:100%;aspect-ratio:16/9}.detail-info{margin-top:24px;display:grid;gap:10px;font-size:17px}.detail-info strong{font-weight:700}.form-dialog{width:min(820px,calc(100% - 32px))}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid .full{grid-column:1/-1}.checks{border:2px solid var(--ink);padding:14px;grid-column:1/-1}.checks legend{font-weight:700;font-size:17px}.checks>div{display:flex;gap:8px 20px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:7px;min-height:44px;font-size:17px}.checks input{width:20px;min-height:20px;height:20px;margin:0;accent-color:var(--ink)}.form-grid .ticket{justify-self:start;margin-top:12px}.brief-result{margin-top:25px}.brief-result p{font-size:17px;margin-bottom:15px}.brief-result textarea{font-size:16px;min-height:200px}.brief-result button{margin-top:12px}.legal-text p{font-size:17px;margin-top:18px;max-width:60ch}.legal-text h3{font-size:28px;margin-top:24px}.paused *,.paused *:before,.paused *:after{animation-play-state:paused!important}.paused .ticket,.paused .scene-button,.paused .sold-card,.paused .menu-toggle{transition:none!important}.paused .ticket:hover,.paused .scene-button:hover,.paused .sold-card:hover,.paused .menu-toggle:hover{transform:none!important}.paused{scroll-behavior:auto}.paused .intro-title,.paused .hero-show{animation:none!important}.intro-title{animation:title-in .4s ease-out both}.hero-show{animation:stage-in .65s .12s ease-out both}@keyframes title-in{from{opacity:.4;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes stage-in{from{transform:rotate(-5deg) translateY(24px)}to{transform:rotate(-3deg) translateY(0)}}@keyframes tray-in{from{opacity:.5;translate:0 12px}to{opacity:1;translate:0 0}}
@media(min-width:1700px){.hero-content{grid-template-columns:520px 1fr;gap:75px}.hero h1{font-size:116px}.hero{min-height:960px}}
@media(min-width:761px) and (max-width:1180px){.hero-content{grid-template-columns:39% 1fr;gap:35px}.hero h1{font-size:8.2vw}.hero{min-height:780px}.hero-copy p{font-size:18px}.hero-caption{flex-wrap:wrap}.hero-loose{margin-left:10px}.sold-card,.sold-card.second{width:145px}.league-badge{width:98px;height:98px;font-size:14px}.league-badge strong{font-size:40px}.sync-grid{gap:35px;grid-template-columns:43% 1fr}.sync h2{font-size:6vw}.custom-grid{gap:45px}.hero>.wrap{padding-top:28px}}
@media(max-width:760px){body{font-size:17px}.hero{min-height:0;padding-bottom:55px}.hero>.wrap{padding-top:24px}.brand{gap:10px}.brand img{width:48px;height:48px}.brand-word{font-size:28px}.hero-content{display:flex;flex-direction:column;margin-top:42px;gap:0}.hero h1{font-size:clamp(53px,16.667vw,88px);line-height:.97}.hero-copy p{font-size:17px;margin-top:22px;max-width:38ch}.hero-copy .ticket{margin-top:24px;max-width:310px;width:100%}.ticket{min-height:54px;font-size:18px;padding:12px 20px}.for-stream{font-size:15px;margin-top:18px}.hero-show{margin-top:49px;transform:none;animation:none}.hero-show>.wrapper-art{inset:-31px -18px -25px;width:calc(100% + 36px);height:calc(100% + 56px)}.hero-video{border-width:4px;box-shadow:5px 5px 0 #17171380}.hero-caption{margin-top:14px;padding:9px 10px;gap:8px;flex-wrap:wrap;font-size:15px}.caption-copy{max-width:none}.caption-copy small{font-size:12px}.controls{gap:7px}.small-button{font-size:14px;padding:7px 10px}.hero-loose{margin-top:22px;margin-left:18px;transform:none;gap:0;justify-content:center}.sold-card,.sold-card.second{width:110px}.league-badge{width:83px;height:83px;font-size:12px;margin-left:12px;border-width:3px}.league-badge strong{font-size:34px}.seam{margin-top:0;transform:none;padding:22px 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px 20px;text-align:center;font-size:19px}.seam span+span:before{display:none}.selection{padding-block:60px}.selection h2{max-width:10ch}.selection .lead{font-size:19px;margin-top:18px}.feature{display:flex;flex-direction:column;align-items:stretch;gap:25px;margin-top:30px}.feature-media{transform:none;border-width:3px;box-shadow:5px 5px 0 var(--ink)}.feature-description p{margin-top:13px;font-size:17px}.feature-description .controls{margin-top:16px}.selector-row{gap:12px;margin-top:28px;overflow-x:auto;padding:6px 5px 13px;scroll-snap-type:x proximity}.scene-button{flex:0 0 126px;width:126px;scroll-snap-align:start;box-shadow:2px 3px 0 var(--ink)}.scene-button span{font-size:14px;line-height:1.1;padding:8px}.all-button{flex:0 0 126px;width:126px;font-size:16px;padding:10px}.all-button b{font-size:40px;margin-bottom:5px}.catalog{padding:18px;margin-top:30px;border-width:3px}.search-line{align-items:end;gap:8px}.field{font-size:16px}input,textarea,select{font-size:17px;padding:11px;min-height:54px}.result-count{font-size:15px}.result{grid-template-columns:1fr;gap:16px}.result h3{font-size:32px}.result p{font-size:16px}.sync{padding-block:60px}.sync-grid{display:flex;flex-direction:column;gap:25px;align-items:stretch}.sync h2{max-width:10ch}.sync-copy p{margin-top:20px}.free-tape{font-size:15px;margin-bottom:21px}.sync-illustration{min-height:240px}.sync-illustration>.cable{margin-top:18px}.sync-origin{top:28%;font-size:14px}.sync-target{top:8%;width:31%}.sync-illustration figcaption{font-size:14px;bottom:0;left:5%;max-width:280px}.stamp{width:110px;margin-top:20px}.finale-copy{display:block;padding-block:35px 45px}.finale-copy p{margin-top:18px;font-size:17px}.custom{padding-block:60px}.custom-grid{display:flex;flex-direction:column;gap:35px;align-items:stretch}.custom-copy p{font-size:17px;margin-top:20px}.custom-copy .ticket{margin-top:26px}.custom-art{min-height:260px}.custom-board{width:94%;border-width:5px;padding:18px;box-shadow:5px 7px 0 var(--ink)}.custom-board img{width:65px;margin-bottom:16px}.slot-sketch{gap:6px}.slot-sketch i{height:27px;border-width:2px}.custom-art figcaption{font-size:14px;margin-top:20px}.help-inline{padding-block:40px}.help-inline details{padding-inline:4px}.help-inline summary{font-size:19px;min-height:60px}.help-inline details p{font-size:17px}.footer{padding-block:46px 118px}.footer-top{flex-direction:column;gap:25px}.footer .brand-word{font-size:28px}.footer nav{justify-content:flex-start;gap:4px 20px;font-size:16px}.footer p{margin-top:26px;font-size:15px}.menu-toggle{right:14px;width:85px;height:70px;bottom:max(16px,env(safe-area-inset-bottom))}.menu-toggle span{font-size:15px;bottom:12px}.motion-toggle{font-size:13px;left:14px;padding:10px 12px;min-height:44px;bottom:max(18px,env(safe-area-inset-bottom))}dialog{padding:22px;box-shadow:5px 5px 0 var(--ink)}.dialog-head{gap:12px;margin-bottom:22px}.dialog-head h2{font-size:36px}.nav-links a{font-size:28px}.detail-stills{grid-template-columns:1fr;gap:20px}.board-dialog p{font-size:17px}.form-grid{grid-template-columns:1fr;gap:18px}.form-grid .full{grid-column:auto}.checks{grid-column:auto}.dialog-note{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.ticket:hover,.scene-button:hover,.sold-card:hover,.menu-toggle:hover{transform:none}.hero-show{transform:rotate(-3deg)}.hero-show{animation:none}}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.hero-show{transform:none}}

/* Studio review: legible copy, real product art, and controls in the document flow. */
.hero:after{display:none}
.mat{background-size:1536px auto;background-repeat:repeat;background-position:48% 35%}
.hero{min-height:940px;padding-bottom:48px}
.hero-content{margin-top:48px;gap:42px}
.hero-show{margin-top:30px}
.hero-show>.wrapper-art{inset:-42px -25px -28px;width:calc(100% + 50px);height:calc(100% + 70px)}
.hero-copy p,.feature-description p,.selection .lead,.custom-copy p,.finale-copy p,.footer p{font-weight:600;text-shadow:0 1px 2px #ff8b46}
.hero-copy p{background:url('../assets/art/rip-mat.svg') 48% 38%/1800px auto;padding:8px 10px;margin-left:-10px}
.hero-caption{flex-wrap:wrap;gap:12px;padding:14px 16px}
.caption-copy{max-width:none;flex:1 1 225px}
.hero-caption .controls{flex:0 1 auto}
.motion-toggle{position:static;transform:none;box-shadow:none;min-height:44px;font-size:14px;padding:8px 10px;flex-shrink:0}
.menu-toggle{position:absolute;top:32px;right:var(--gutter);bottom:auto;width:90px;height:76px}
.menu-toggle span{bottom:13px}
.hero-loose{margin-top:28px;margin-left:25px;gap:14px}
.seam{gap:30px;padding-block:24px}.seam span+span:before{margin-right:30px}
.selection h2{background:url('../assets/art/rip-mat.svg') 48% 38%/1800px auto;display:table;padding:8px 10px;margin-left:-10px}
.selection{padding-block:78px 72px}.selection .lead{font-size:22px}
.scene-button span{background-image:url('../assets/art/rip-marks.svg');background-size:cover}
.selector-row{gap:20px}.all-button{font-size:18px}
.ticket,.league-badge,.all-button,.close,.free-tape{background-image:linear-gradient(#ffd64ee8,#ffd64ee8),url('../assets/art/rip-mat.svg');background-size:auto,780px auto;background-position:center,48% 38%;background-blend-mode:normal}
.free-tape{background-image:linear-gradient(#36d8e4e8,#36d8e4e8),url('../assets/art/rip-mat.svg')}
.foil{background-image:url('../assets/art/opened-foil.svg'),url('../assets/art/foil-field.svg');background-size:cover,cover;background-position:center}
.sync{padding-block:70px}.sync:before{display:none}
.sync-grid{background:url('../assets/art/foil-field.svg') center/cover;width:calc(100% - 2 * var(--gutter));padding:28px;grid-template-columns:minmax(0, .95fr) minmax(0,1.05fr);gap:38px}
.sync h2{font-size:clamp(46px,4.8vw,69px);max-width:none;line-height:1.06}
.sync h2 span{display:block}
.sync-illustration{min-height:0;aspect-ratio:900/450}
.sync-illustration>.cable{margin-top:0;width:100%}
.sync-origin{top:18%;left:8%;font-size:clamp(14px,1.4vw,20px);width:24%}
.sync-target{top:6%;right:6%;width:26%}
.sync-illustration figcaption{left:8%;bottom:0;max-width:34ch;font-size:17px}
.finale-copy{padding-block:34px;gap:28px}.finale-copy h2{font-size:clamp(42px,4.8vw,69px)}
.custom{padding-block:64px 72px}.custom-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:60px}
.custom-art{min-height:0;transform:rotate(2deg);background:none}
.custom-board{width:100%;padding:0;border-width:6px;transform:rotate(-4deg);overflow:hidden}
.custom-board .custom-footage{width:100%;margin:0;aspect-ratio:16/9;object-fit:contain}
.custom-brand{display:flex;gap:12px;align-items:center;padding:10px 16px;background:url('../assets/art/foil-field.svg') center/cover;border-bottom:4px solid var(--ink)}
.custom-brand img{width:48px;height:48px;margin:0;object-fit:contain}
.custom-brand span{font-family:var(--display);font-size:24px;line-height:1.05;text-transform:uppercase}
.custom-art figcaption{margin-top:22px;transform:rotate(-2deg);font-size:16px;text-align:center}
.help-inline .wrap{background:url('../assets/art/foil-field.svg') center/cover;width:calc(100% - 2 * var(--gutter));padding:28px;display:grid;grid-template-columns:.75fr 1.25fr;gap:0 55px}
.help-inline h2{grid-column:1;grid-row:1/5;font-size:clamp(40px,4vw,58px);max-width:10ch;line-height:1.08}
.help-inline details{grid-column:2;width:100%}.help-inline details:last-child{border-bottom:3px solid var(--ink)}
.footer{padding-block:48px 60px}.footer p{margin-top:20px}
@media(min-width:761px) and (max-width:1180px){.hero{min-height:0}.hero h1{font-size:7.8vw}.hero-content{gap:30px}.hero-caption .controls{flex:1 1 100%}.sync h2{font-size:5vw}.custom-grid{gap:32px}.help-inline .wrap{gap:0 32px}}
@media(max-width:760px){
.hero{padding-bottom:35px;min-height:0}.hero>.wrap{padding-top:22px}.hero-content{margin-top:32px;gap:0}
.hero h1{font-size:clamp(47px,15.2vw,88px);line-height:1.02;letter-spacing:-.025em}
.hero-copy p{margin-top:18px;line-height:1.45;padding:6px 8px;margin-left:-8px;font-weight:500}
.hero-copy .ticket{max-width:none;margin-top:18px}.for-stream{margin-top:16px}
.menu-toggle{top:24px;right:18px;width:68px;height:58px}.menu-toggle span{font-size:13px;bottom:9px}
.hero-show{margin-top:30px}.hero-show>.wrapper-art{inset:-20px -12px -18px;width:calc(100% + 24px);height:calc(100% + 38px)}
.hero-caption{margin-top:12px;padding:12px;gap:10px;transform:none}.caption-copy{flex:1 1 100%;font-size:16px}.caption-copy small{font-size:14px}
.hero-caption .controls{flex:1 1 100%;flex-wrap:nowrap}.hero-caption .small-button{flex:1;font-size:15px}.motion-toggle{font-size:14px}
.hero-loose{margin:24px 0 0;gap:8px}.sold-card,.sold-card.second{width:30%;margin-left:0}.league-badge{width:80px;height:80px;margin-left:4px}
.seam{padding:18px;gap:10px;font-size:18px}.selection{padding-block:42px 48px}.selection h2{font-size:clamp(40px,10.8vw,60px);max-width:none}.selection .lead{font-size:18px}
.feature{margin-top:24px;gap:20px}.feature-description .coming{font-size:16px}.demo-label{font-size:14px;line-height:1.4;margin-top:12px}
.selector-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;overflow:visible;padding:6px 5px;margin-top:26px}
.scene-button,.all-button{width:100%;min-width:0;transform:none!important}.scene-button span{font-size:16px;line-height:1.25;min-height:44px;padding:11px 8px}
.all-button{font-size:17px;padding:12px}.all-button b{font-size:42px}
.sync{padding-block:42px}.sync-grid{gap:24px;padding:18px}.sync h2{font-size:clamp(38px,10.5vw,62px);line-height:1.08}.sync-copy p{font-size:18px;font-weight:500}.sync-illustration{min-height:0;aspect-ratio:900/470}
.sync-origin{top:17%;font-size:13px;left:8%}.sync-target{top:5%;right:6%;width:26%}.sync-illustration figcaption{font-size:15px;left:8%;bottom:0;max-width:32ch}
.finale-copy{padding-block:28px 34px}.finale-copy h2{font-size:42px}.finale-copy p{font-weight:500}.stamp{width:90px;margin-top:18px}
.custom{padding-block:44px}.custom-grid{gap:28px}.custom-art{min-height:0}.custom-board{width:96%;border-width:4px;box-shadow:5px 6px 0 var(--ink)}.custom-brand{padding:8px 10px;gap:10px}.custom-brand img{width:36px;height:36px}.custom-brand span{font-size:19px}.custom-art figcaption{font-size:14px;line-height:1.4}
.help-inline{padding-block:36px}.help-inline .wrap{display:block;padding:18px}.help-inline h2{max-width:none;font-size:36px;margin-bottom:22px}.help-inline summary{font-size:18px;padding-block:16px;line-height:1.4}
.footer{padding-block:36px 42px}.footer p{font-weight:500}.footer nav{gap:8px 20px}
}

/* Art review: preserve page geometry; contain product media and match drawing to inserts. */
.mat{background-repeat:no-repeat;background-size:cover}
.hero-copy p,.selection h2{background-image:none}
.sync-target{top:8%;right:6%;transform:none;object-fit:contain;border:3px solid var(--ink)}
.feature-media video,.board-dialog video,.detail-stills img{object-fit:contain}
.foil{background-size:100% 100%,cover}

/* Final graphic treatment: responsive foil geometry, no stretched wrapper artwork. */
.hero-show>.wrapper-art{object-fit:unset;filter:drop-shadow(0 3px 3px #17171355)}
.wrapper-art i{position:absolute;display:block;background:#cbd1cd url('../assets/art/foil-field.svg') center/900px 600px;box-shadow:inset 0 1px 1px #ffffffa0,inset 0 -2px 3px #51595870}
.wrapper-art i:nth-child(1){inset:0 0 auto;height:42px;clip-path:polygon(0 8%,8% 2%,14% 10%,29% 0,44% 7%,67% 2%,83% 9%,100% 0,100% 90%,91% 96%,80% 82%,71% 98%,59% 85%,48% 96%,35% 82%,22% 97%,12% 85%,0 100%)}
.wrapper-art i:nth-child(2){inset:auto 0 0;height:42px;clip-path:polygon(0 7%,13% 18%,25% 4%,41% 15%,56% 3%,69% 14%,87% 0,100% 12%,100% 98%,85% 92%,63% 100%,42% 93%,23% 100%,0 92%)}
.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){top:8px;bottom:8px;width:22px;background-image:repeating-linear-gradient(90deg,#eff2ea88 0 1px,#69736d55 1px 2px,transparent 2px 4px),url('../assets/art/foil-field.svg')}
.wrapper-art i:nth-child(3){left:0;clip-path:polygon(0 0,100% 0,91% 17%,100% 30%,85% 45%,98% 64%,89% 81%,100% 100%,0 100%)}
.wrapper-art i:nth-child(4){right:0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,12% 82%,2% 63%,15% 44%,3% 29%,11% 14%)}
#heroVideo{filter:brightness(1.38) contrast(1.04)}
.sleeve{padding:7px;border:1px solid #e9f5f7;border-radius:5px;background:linear-gradient(125deg,#f5fbfcdd,#b1c5c399 40%,#ffffffc9 42%,#b1c5c399 45%,#eef7f7bb);box-shadow:1px 2px 1px #17171355,5px 9px 12px #17171355;filter:none;overflow:hidden}
.card-insert{overflow:hidden;border-radius:2px;border:1px solid #171713;background:#171713}
.card-insert img{width:100%;height:auto}
.sleeve:not(.second) .card-insert img{clip-path:inset(7% 5% 7% 5% round 2px);transform:scale(1.11)}
.sleeve:not(.second) .card-insert{aspect-ratio:440/334}
.sleeve.second .card-insert{border-color:#6c6c60}
.feature-description{background:#f5e5c4 url('../assets/art/rip-marks.svg') center/cover;box-shadow:0 0 0 12px #f5e5c4}
.feature-description p{text-shadow:none}
.nav-links a{background:#e3e7df url('../assets/art/rip-marks.svg') center/1000px 600px}
.nav-links a:hover{background-color:var(--yellow)}
.foil{background:#dce0db url('../assets/art/foil-field.svg') center/900px 600px}
.sync-grid,.help-inline .wrap{background:transparent}
.sync-grid:before,.help-inline .wrap:before{content:none}
.sync-origin{top:24%;left:9%;width:23%;font-size:clamp(14px,1.4vw,20px);transform:none;line-height:1.3}
.sync-copy button:disabled{background:#ecefe8 url('../assets/art/rip-marks.svg') center/1000px 600px;color:#30352f;opacity:1;box-shadow:2px 2px 0 #17171366}
.sync-illustration>.cable{height:auto;display:block}
.finale-picture a{display:block}
.finale-picture a>img{width:100%;height:auto;object-fit:contain}
.custom-footage{filter:brightness(1.2)}
.hero-copy p,.selection .lead,.custom-copy p,.finale-copy p,.footer p{text-shadow:none}
@media(max-width:760px){.wrapper-art i:nth-child(1),.wrapper-art i:nth-child(2){height:21px}.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){width:12px}.sleeve{padding:4px}.sync-origin{top:23%;left:9%;font-size:12px}.feature-description{box-shadow:0 0 0 10px #f5e5c4}}

/* Material pass: photographic laminate on precise tears; continuous silver surfaces. */
.mat{background-image:url('../assets/art/rip-mat.png')}
body{background-image:url('../assets/art/rip-mat.png')}
.wrapper-art i{background-image:url('../assets/art/foil-material.png');background-size:760px 760px;background-repeat:no-repeat;background-position:45% 26%}
.wrapper-art i:nth-child(1){height:46px;clip-path:polygon(0 8%,6% 0,11% 7%,17% 1%,25% 6%,33% 0,42% 5%,54% 1%,65% 8%,78% 0,89% 6%,100% 1%,100% 88%,95% 94%,91% 72%,87% 91%,80% 78%,77% 94%,71% 82%,67% 98%,60% 77%,55% 91%,48% 79%,41% 96%,37% 76%,30% 92%,24% 80%,18% 98%,13% 81%,7% 95%,3% 82%,0 100%)}
.wrapper-art i:nth-child(2){height:46px;background-position:50% 71%;clip-path:polygon(0 8%,5% 24%,9% 3%,15% 19%,22% 4%,28% 20%,33% 6%,40% 16%,45% 0,52% 18%,58% 7%,64% 22%,70% 3%,78% 14%,84% 1%,90% 17%,96% 3%,100% 13%,100% 98%,87% 92%,72% 100%,54% 95%,35% 100%,17% 92%,0 99%)}
.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){background-image:repeating-linear-gradient(90deg,#eff2ea55 0 1px,#69736d44 1px 2px,transparent 2px 4px),url('../assets/art/foil-material.png');background-size:auto,760px 760px;background-position:center,20% 50%}
.foil{background-image:linear-gradient(#edf0e9e8,#edf0e9e8),url('../assets/art/foil-material.png');background-size:cover;background-repeat:no-repeat;position:relative}
.foil:after{content:'';position:absolute;inset:0;background:url('../assets/art/foil-material.png') center/cover;mask-image:linear-gradient(to bottom,#000,transparent 18%,transparent 82%,#000),linear-gradient(to right,#000,transparent 6%,transparent 94%,#000);pointer-events:none;z-index:0}
.foil>.wrap{position:relative;z-index:1}
.hero-copy p,.selection .lead,.custom-copy p,.finale-copy p,.footer p{background:linear-gradient(#ff651bef,#ff651bef),url('../assets/art/rip-mat.png') center/1536px auto;box-shadow:0 0 0 5px #ff651bef}
.feature-description{background-image:linear-gradient(#f5e5c4ef,#f5e5c4ef),url('../assets/art/rip-mat.png');background-size:auto,760px auto}
.custom-art figcaption,.demo-label,.for-stream{background:linear-gradient(#ff651bef,#ff651bef),url('../assets/art/rip-mat.png') center/1536px auto;box-shadow:0 0 0 3px #ff651bef;width:fit-content}
@media(max-width:760px){.wrapper-art i:nth-child(1),.wrapper-art i:nth-child(2){height:24px}.wrapper-art i{background-size:430px 430px}.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){background-size:auto,430px 430px}}

/* ---------- multi-page additions ---------- */
[hidden]{display:none!important}
.help-more{margin-top:18px}
.help-inline .help-more{grid-column:2}
.soon-wrap{display:inline-flex;flex-direction:column;align-items:flex-start;gap:8px}
.soon-status{font-size:16px;font-weight:700;min-height:0}
.soon-status:empty{display:none}
code{font-family:Consolas,monospace;font-size:.9em;background:#17171314;padding:1px 5px}

/* page tops (every page but home) */
.page-top{position:relative;padding-block:36px 72px}
.page-top>.wrap{position:relative;z-index:1}
.page-top h1{font-size:clamp(64px,7.4vw,118px);line-height:.97;letter-spacing:-.035em;margin-top:56px;max-width:14ch}
.page-top .lead{margin-top:22px;font-size:22px;font-weight:600;max-width:640px;text-shadow:0 1px 2px #ff8b46}
.page-top-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,520px);gap:48px;align-items:end}
.catalog-search{margin-top:0;max-width:none;background:url('../assets/art/foil-field.svg') center/cover;border:4px solid var(--ink);padding:18px;box-shadow:7px 7px 0 var(--ink);transform:rotate(-1deg)}
.page-top+.seam{margin-top:-18px}
.crumbs{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:40px;font-size:17px;font-weight:700}
.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.crumbs>span{display:inline-flex;align-items:center}

/* catalog */
.catalog-page{padding-block:56px 90px}
.catalog-page .result-count{font-weight:700;font-size:18px;margin:0 0 28px}
.board-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 34px}
.board-card{display:flex;flex-direction:column;text-decoration:none;border:3px solid var(--ink);background:url('../assets/art/foil-field.svg') center/cover;box-shadow:6px 6px 0 var(--ink);transform:rotate(-1.2deg);transition:transform .18s,box-shadow .18s}
.board-card:nth-child(3n+2){transform:rotate(.8deg)}
.board-card:nth-child(3n){transform:rotate(-.4deg)}
.board-card:hover,.board-card:focus-visible{transform:translateY(-6px) rotate(0);box-shadow:9px 11px 0 var(--ink)}
.board-card-media{position:relative;display:block;aspect-ratio:16/9;background:#171713;border-bottom:3px solid var(--ink)}
.board-card-media img,.board-card-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.board-card-media video{opacity:0;background:none;transition:opacity .2s}
.board-card.playing .board-card-media video{opacity:1}
.board-card-name{display:block;padding:12px 15px;background:var(--ink) url('../assets/art/rip-marks.svg') center/cover;color:var(--chalk);font-family:var(--display);font-size:30px;line-height:1.05;text-transform:uppercase}
.board-card-desc{display:block;padding:13px 15px 16px;font-size:17px;font-weight:600;line-height:1.4}
.empty{font-size:20px;font-weight:700;padding:30px 0}

/* board page */
.board-top{padding-bottom:84px}
.board-top-grid{display:grid;grid-template-columns:minmax(0,470px) minmax(0,1fr);gap:56px;align-items:start;margin-top:22px}
.board-top h1{margin-top:0;font-size:clamp(60px,6.4vw,104px);max-width:9ch}
.board-top .tagline{margin-top:22px;font-size:23px;font-weight:700;line-height:1.3}
.board-top-copy>p:not(.tagline):not(.coming){margin-top:14px;font-weight:600;text-shadow:0 1px 2px #ff8b46}
.board-top-copy .soon-wrap,.board-top-copy>.ticket{margin-top:28px}
.board-top-copy .free-tape{display:inline-flex;align-items:center;min-height:44px;margin:22px 0 0;color:var(--ink);text-decoration:none;transform:rotate(-2deg)}
.board-top-show{min-width:0}
.board-top-show .feature-media video{object-fit:contain;background:#171713}
.board-top-show .controls{margin-top:22px}
.stills{padding-block:64px 70px}
.stills h2,.board-about h2,.doc-panel h2{font-size:clamp(40px,4.4vw,64px)}
.stills .detail-stills{gap:30px;margin-top:30px}
.stills figure a{display:block;border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#171713}
.stills figure:nth-child(1) a{transform:rotate(-1deg)}
.stills figure:nth-child(2) a{transform:rotate(1deg)}
.stills .detail-stills img{object-fit:contain}
.stills figcaption{font-size:19px}
.board-about{padding-block:72px}
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,440px);gap:60px;align-items:start}
.about-copy p{margin-top:20px;max-width:64ch;font-weight:600;text-shadow:0 1px 2px #ff8b46}
.spec{border:4px solid var(--ink);background:url('../assets/art/foil-field.svg') center/cover;box-shadow:8px 8px 0 var(--ink);padding:24px;transform:rotate(1.5deg)}
.spec h3{font-size:40px}
.spec dl{margin:16px 0 0}
.spec dl>div{padding-block:12px;border-top:3px dashed var(--ink)}
.spec dt{font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.03em}
.spec dd{margin:4px 0 0;font-size:18px}
.neighbors{padding-block:56px 70px}
.neighbor-row{display:grid;grid-template-columns:minmax(0,1fr) 230px minmax(0,1fr);gap:34px;align-items:stretch}
.neighbor-row .all-button{width:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-weight:700;box-shadow:6px 6px 0 var(--ink)}
.neighbor-row .board-card-name{font-size:24px}

/* board sync page */
.sync-page{margin-top:44px;padding:28px;background:url('../assets/art/foil-field.svg') center/cover;border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:center}
.sync-page h1{margin-top:0;font-size:clamp(48px,5vw,76px);line-height:1.06;max-width:none}
.sync-page h1 span{display:block}
.sync-page .soon-wrap{margin-top:26px}

/* custom page */
.page-top.custom{padding-block:36px 80px}
.page-top.custom .custom-grid{margin-top:48px}
.page-top.custom h1{margin-top:0;font-size:clamp(60px,6.4vw,104px)}

/* doc pages (help, legal, sync, custom form) */
.doc{padding-block:60px 80px}
.doc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;align-items:start}
.form-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.doc-stack{display:grid;gap:36px;max-width:1100px}
.doc-panel{background:url('../assets/art/foil-field.svg') center/cover;border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:30px;scroll-margin-top:24px}
.doc-panel:nth-child(odd){transform:rotate(-.5deg)}
.doc-panel:nth-child(even){transform:rotate(.4deg)}
.doc-panel>p{margin-top:18px;max-width:68ch;font-size:18px}
.doc-panel h3{font-size:32px;margin-top:30px}
.doc-panel .setup-link{margin-top:16px}
.doc-panel form{margin-top:24px}
.note{font-size:16px!important;font-weight:600}
.steps{margin:22px 0 0;padding:0;list-style:none;counter-reset:s;display:grid;gap:12px}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;font-size:18px;font-weight:600}
.steps li:before{content:counter(s);display:grid;place-items:center;width:44px;height:44px;border:3px solid var(--ink);background:var(--yellow) url('../assets/art/rip-marks.svg') center/cover;font-family:var(--display);font-size:24px;transform:rotate(-4deg)}
.kv{margin:20px 0 0;display:grid}
.kv>div{display:grid;grid-template-columns:minmax(150px,.4fr) 1fr;gap:16px;padding-block:14px;border-top:3px dashed var(--ink)}
.kv dt{font-weight:700;font-size:18px}
.kv dd{margin:0;font-size:18px}
.plain{margin:14px 0 0;padding-left:22px;font-size:18px;font-weight:600}
.plain li+li{margin-top:6px}
.dims{margin-top:22px;border-collapse:collapse;font-size:18px;min-width:min(100%,480px)}
.dims th,.dims td{border:3px solid var(--ink);padding:10px 14px;text-align:left}
.dims thead th{background:var(--ink);color:var(--chalk)}
.toc{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;max-width:900px}
.toc a{display:inline-flex;align-items:center;text-decoration:none}
.faq details{border-top:3px solid var(--ink);padding:0 8px}
.faq details:last-child{border-bottom:3px solid var(--ink)}
.faq summary{cursor:pointer;min-height:60px;padding-block:16px;font-size:20px;font-weight:700}
.faq details p{padding-bottom:20px;font-size:18px;max-width:70ch}
.help-inline details p a,.faq details p a{font-weight:700}
.nav-links a[aria-current=page]{background-color:var(--yellow)}
.footer nav a[aria-current=page]{text-decoration:underline;text-decoration-thickness:3px}

@media (max-width:1180px){
.board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.page-top-grid{grid-template-columns:1fr;gap:30px;align-items:start}
.board-top-grid{grid-template-columns:1fr;gap:40px}
.board-top h1{max-width:none}
.about-grid{grid-template-columns:1fr;gap:40px}
.spec{max-width:560px}
.sync-page{grid-template-columns:1fr}
.form-layout{grid-template-columns:1fr}
}
@media (max-width:760px){
.page-top{padding-block:24px 48px}
.page-top h1{font-size:clamp(47px,14vw,80px);margin-top:36px;line-height:1.02;letter-spacing:-.025em}
.page-top .lead{font-size:18px}
.page-top+.seam{margin-top:0}
.catalog-search{padding:14px;box-shadow:5px 5px 0 var(--ink);transform:none}
.crumbs{margin-top:28px;font-size:16px}
.catalog-page{padding-block:36px 56px}
.board-grid{grid-template-columns:1fr;gap:28px}
.board-card,.board-card:nth-child(3n+2),.board-card:nth-child(3n){transform:none;box-shadow:5px 5px 0 var(--ink)}
.board-card-name{font-size:26px}
.board-card-desc{font-size:16px}
.board-top-grid{margin-top:14px;gap:32px}
.board-top h1{font-size:clamp(46px,13vw,76px);margin-top:0}
.board-top .tagline{font-size:19px}
.board-top-copy .soon-wrap,.board-top-copy>.ticket{display:flex;width:100%}
.board-top-copy .ticket{width:100%}
.board-top-show .controls .small-button{flex:1}
.stills,.board-about,.neighbors,.doc{padding-block:40px 48px}
.stills h2,.board-about h2,.doc-panel h2{font-size:clamp(34px,10vw,48px)}
.stills .detail-stills{grid-template-columns:1fr;gap:24px}
.stills figure a{transform:none!important;box-shadow:4px 4px 0 var(--ink);border-width:3px}
.about-copy p{font-size:17px}
.spec{transform:none;padding:18px;box-shadow:5px 5px 0 var(--ink)}
.spec h3{font-size:32px}
.neighbor-row{grid-template-columns:1fr;gap:22px}
.neighbor-row .all-button{order:3;padding:16px}
.sync-page{margin-top:28px;padding:18px;gap:24px;box-shadow:5px 5px 0 var(--ink)}
.sync-page h1{font-size:clamp(38px,10.5vw,62px);margin-top:0}
.page-top.custom h1{font-size:clamp(46px,13vw,76px)}
.page-top.custom .custom-grid{margin-top:32px}
.doc-grid{grid-template-columns:1fr;gap:26px}
.doc-stack{gap:26px}
.doc-panel{padding:18px;box-shadow:5px 5px 0 var(--ink);transform:none!important}
.doc-panel>p,.steps li,.kv dt,.kv dd,.plain,.dims{font-size:17px}
.kv>div{grid-template-columns:1fr;gap:4px}
.dims{width:100%}
.dims th,.dims td{padding:8px 10px}
.faq summary{font-size:18px}
.help-inline .help-more{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){.board-card:hover,.board-card:focus-visible{transform:none}}
.paused .board-card{transition:none}
.paused .board-card:hover{transform:none}

/* Codex QA pass (design/qa-multipage.md) */
.doc-panel .steps li{display:block;position:relative;padding-left:58px;min-height:44px;padding-top:8px}
.doc-panel .steps li::before{position:absolute;top:0;left:0}
.sync-grid.sync-page{width:100%}
.sync-page .soon-wrap>.ticket{margin-top:0}
.catalog-search .small-button{min-height:54px}
.page-top .lead,.board-top-copy>p,.about-copy p{width:fit-content;background:linear-gradient(#ff651bef,#ff651bef),url('../assets/art/rip-mat.svg') center/1536px auto;box-shadow:0 0 0 5px #ff651bef;text-shadow:none}
.stills .detail-stills img{width:100%;height:auto;aspect-ratio:auto}
@media (max-width:760px){
.sync-page .sync-illustration{aspect-ratio:900/400;margin-bottom:60px}
.sync-page .sync-origin{top:17%;left:8.5%;width:24%;font-size:12px;line-height:1.2}
.sync-page .sync-illustration figcaption{top:100%;bottom:auto;left:8%;margin-top:12px}
}

/* ---------- background v2: sports ---------- */
/* Flat arena inks and printed card stock; preserve the approved pack geometry. */
body,.mat{
  color:var(--ink);
  background:var(--orange) url('../assets/art/bg-orange-playbook.svg') center top/1440px 900px repeat;
}
.foil{
  color:var(--chalk);
  background:var(--ink) url('../assets/art/bg-ink-arena.svg') center top/1200px 800px repeat;
}
.foil:after{background:none;mask-image:none}
.doc-panel,.spec,.catalog-search,.catalog,.board-card,.hero-caption,
.sync-grid,.help-inline .wrap,.custom-board,.custom-brand,dialog,.seam{
  color:var(--ink);
  background:var(--chalk) url('../assets/art/bg-card-stock.svg') center/600px 400px repeat;
}
/* Panel text and links inherit ink even when their parent section is the arena. */
.help-inline.foil details,.help-inline.foil details:last-child{border-color:var(--ink)}
.board-card-name,.scene-button span{
  color:var(--chalk);
  background:var(--ink) url('../assets/art/bg-broadcast-stripes.svg') right center/480px 240px repeat;
}
.ticket,.ticket.secondary,.league-badge,.all-button,.close,.skip,.steps li:before{
  color:var(--ink);
  background:var(--yellow) url('../assets/art/bg-broadcast-stripes.svg') right center/480px 240px repeat;
}
.free-tape,.board-top-copy .free-tape{
  color:var(--ink);
  background:var(--cyan) url('../assets/art/bg-broadcast-stripes.svg') right center/480px 240px repeat;
}
.small-button,.motion-toggle,.sync-copy button:disabled{
  color:var(--ink);
  background:var(--chalk) url('../assets/art/bg-broadcast-stripes.svg') right center/480px 240px repeat;
}
.small-button:hover,.nav-links a:hover,.nav-links a[aria-current=page]{
  color:var(--ink);
  background:var(--yellow) url('../assets/art/bg-broadcast-stripes.svg') right center/480px 240px repeat;
}
input,textarea,select{
  color:var(--ink);
  background:var(--chalk);
  color-scheme:light;
}
input::placeholder,textarea::placeholder{color:#595951;opacity:1}
.nav-links a{
  color:var(--ink);
  background:var(--chalk) url('../assets/art/bg-card-stock.svg') center/600px 400px repeat;
}
dialog::backdrop{background:#171713d9 url('../assets/art/bg-ink-arena.svg') center/1200px 800px repeat}
.wrapper-art i,.wrapper-art i:nth-child(1),.wrapper-art i:nth-child(2),
.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){
  background:var(--yellow) url('../assets/art/bg-pack-print.svg') center/640px 400px repeat;
  box-shadow:inset 0 1px 0 #faf9f280,inset 0 -2px 0 #17171340;
}
.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){
  background:var(--yellow) url('../assets/art/bg-pack-print.svg') left center/640px 400px repeat;
}
.feature-description{
  color:var(--ink);
  background:var(--chalk) url('../assets/art/bg-card-stock.svg') center/600px 400px repeat;
  box-shadow:0 0 0 12px var(--chalk);
}
.hero-copy p,.selection .lead,.custom-copy p,.finale-copy p,.footer p,
.page-top .lead,.board-top-copy>p,.about-copy p{
  background:none;box-shadow:none;text-shadow:none;
}
.selection h2{background:none}
.custom-art figcaption,.demo-label,.for-stream{
  color:var(--ink);background:var(--orange);box-shadow:0 0 0 3px var(--orange);
}
.sync-origin{color:var(--ink)}
.feature-media,.scene-button,video{background:var(--ink)}
@media(max-width:760px){
  body,.mat{background-size:900px 562.5px;background-position:35% top}
  .foil{background-size:900px 600px}
  .feature-description{box-shadow:0 0 0 10px var(--chalk)}
}

/* ---------- background v3: real images ---------- */
/* Cinematic orange/ink photography; protected copy and solid utility surfaces. */
body,.mat{
  --sports-photo:url('../assets/photo/hardwood.webp');
  color:var(--chalk);
  background:linear-gradient(110deg,#171713e8,#171713b8),var(--sports-photo) center/cover no-repeat var(--ink);
  background-attachment:scroll;
}
.foil{
  --sports-photo:url('../assets/photo/ice-spray.webp');
  color:var(--chalk);
  background:linear-gradient(110deg,#171713e8,#171713b8),var(--sports-photo) center/cover no-repeat var(--ink);
  background-attachment:scroll;
}
.foil:after,.hero:after,.sync:before{background:none}
.hero{
  --sports-photo:url('../assets/photo/stadium-night.webp');
  background:linear-gradient(90deg,#171713a6 0%,#17171370 44%,#17171333 100%),var(--sports-photo) center/cover no-repeat var(--ink);
}
.page-top{
  --sports-photo:url('../assets/photo/turf-lights.webp');
  background:linear-gradient(90deg,#171713df,#17171399),var(--sports-photo) center/cover no-repeat var(--ink);
}
.selection{--sports-photo:url('../assets/photo/hardwood.webp')}
.sync,.custom,.board-about{--sports-photo:url('../assets/photo/break-table.webp')}
.finale,.footer{--sports-photo:url('../assets/photo/stadium-night.webp')}
.doc-panel,.spec,.catalog-search,.catalog,.board-card,.hero-caption,
.sync-grid,.help-inline .wrap,.custom-board,.custom-brand,dialog,.seam{
  color:var(--ink);background:var(--chalk);
}
.feature-description{color:var(--ink);background:var(--chalk)}
.board-card-name,.scene-button span{color:var(--chalk);background:var(--ink)}
.ticket,.ticket.secondary,.league-badge,.all-button,.close,.skip,.steps li:before{
  color:var(--ink);background:var(--yellow);
}
.free-tape,.board-top-copy .free-tape{color:var(--ink);background:var(--cyan)}
.small-button,.motion-toggle,.sync-copy button:disabled,.nav-links a{
  color:var(--ink);background:var(--chalk);
}
.small-button:hover,.nav-links a:hover,.nav-links a[aria-current=page]{
  color:var(--ink);background:var(--yellow);
}
.wrapper-art i,.wrapper-art i:nth-child(1),.wrapper-art i:nth-child(2),
.wrapper-art i:nth-child(3),.wrapper-art i:nth-child(4){
  background:linear-gradient(120deg,#ffd64e,#f15a24 50%,#ffd64e);
}
.hero-copy p,.selection .lead,.custom-copy p,.finale-copy p,.footer p,
.page-top .lead,.board-top-copy>p,.about-copy p{background:none}
.custom-art{background:none}
.slot-sketch i{background:var(--yellow)}
.custom-art figcaption,.demo-label,.for-stream{
  color:var(--chalk);background:var(--ink);box-shadow:0 0 0 3px var(--ink);
}
.menu-toggle span{color:var(--ink)}
dialog::backdrop{background:#171713e6}
/* Stronger protection across the full copy column, with detail visible at right. */
.other-spots.other-spots{
  --sports-photo:url('../assets/photo/break-table.webp');
  color:var(--chalk);
  background:linear-gradient(90deg,#171713e6 0%,#171713e6 44%,#17171370 100%),var(--sports-photo) center/cover no-repeat var(--ink);
}
.other-spots .other-copy h2 span+span{color:var(--yellow)}
@media(max-width:760px){
  body,.mat,.selection{--sports-photo:url('../assets/photo/hardwood-mobile.webp')}
  .foil{--sports-photo:url('../assets/photo/ice-spray-mobile.webp')}
  .hero,.finale,.footer{--sports-photo:url('../assets/photo/stadium-night-mobile.webp')}
  .page-top{--sports-photo:url('../assets/photo/turf-lights-mobile.webp')}
  .sync,.custom,.board-about,.other-spots.other-spots{--sports-photo:url('../assets/photo/break-table-mobile.webp')}
  body,.mat,.foil,.hero,.page-top,.other-spots.other-spots{
    background-size:cover;background-position:60% center;background-attachment:scroll;
  }
  .hero{
    background-image:linear-gradient(180deg,#17171399,#171713bf),var(--sports-photo);
    background-position:65% top;
  }
  .other-spots.other-spots{
    background-image:linear-gradient(#171713e6,#171713cf),var(--sports-photo);
  }
}

/* board page: whole-break video */
.full-break{max-width:1100px;margin-top:24px}
.full-break video{object-fit:contain;background:#171713}

/* ---------- feature sections ---------- */
/* other spots: the bottom line */
.other-spots{position:relative;padding:clamp(56px,7vw,100px) 0;background:linear-gradient(90deg,#171713f2,#17171380),var(--ink) url('../assets/art/bg-ink-arena.svg') center top/1200px 800px repeat;color:var(--chalk);overflow:hidden;border-block:1px solid #faf9f21a}
.other-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);align-items:center}
.other-copy h2{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;line-height:1;font-size:clamp(40px,4.45vw,64px);margin:24px 0;text-wrap:balance}
.other-copy h2 span{display:block}
.other-copy h2 span+span{color:var(--orange)}
.other-copy p{font-size:clamp(17px,1.4vw,20px);line-height:1.5;max-width:52ch}
.other-copy code{font:700 .95em/1 ui-monospace,Consolas,monospace;background:var(--yellow);color:var(--ink);padding:3px 7px;white-space:nowrap}
.other-ways{list-style:none;margin:22px 0 26px;padding:0;display:grid;gap:12px}
.other-ways li{border-left:4px solid var(--cyan);padding:8px 14px;line-height:1.45;background:#171713b3}
.other-ways b{display:block;font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.04em;font-size:1.15em;color:var(--yellow)}
.other-shot{margin:0;position:relative}
.other-shot>img{display:block;width:100%;height:auto;border:3px solid var(--chalk);box-shadow:8px 8px 0 var(--orange)}
.other-strip{position:relative;margin:-5% -1% 0 4%;border:3px solid var(--yellow);box-shadow:5px 6px 0 var(--ink);transform:rotate(-1.2deg)}
.other-strip img{display:block;width:100%;height:auto}
.other-shot figcaption{margin-top:22px;font-size:14px;line-height:1.5;color:#deded5;max-width:65ch}
@media (max-width:1180px){.other-grid{grid-template-columns:1fr}.other-shot{max-width:760px}}
@media (max-width:760px){
  .other-spots{background-size:auto,900px 600px;padding-block:56px}
  .other-copy h2{font-size:40px;text-wrap:balance}
  .other-strip{margin:-4% 0 0 2%;border-width:2px;overflow:hidden}
  .other-strip img{width:160%;max-width:none}
  .other-shot>img{box-shadow:5px 5px 0 var(--orange)}
  .other-shot figcaption{margin-top:18px}
}

/* ---------- foil-pack panels ---------- */
/* Every text panel is an unopened foil pack (art: assets/art/packs, spec: design/pack-skin/SPEC.md).
   Text sits straight on the foil in the pack's complementary colour. Skins are 9-slice: crimped seals stretch sideways,
   the foil middle is a separate stretched background so the ribs never smear. */
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board){
  box-sizing:border-box;min-inline-size:0;border:solid transparent;border-width:27.5px 10px;border-radius:0;
  background:var(--pack-skin) center/107.142857% 122.44898% no-repeat;background-origin:padding-box;background-clip:padding-box;
  border-image-source:var(--pack-skin);border-image-slice:110 40;border-image-width:27.5px 10px;border-image-outset:0;border-image-repeat:round stretch;
  box-shadow:none;color:var(--pack-text);text-shadow:0 1px 2px #000,0 2px 5px #0009;
  filter:drop-shadow(0 4px 3px #0009) drop-shadow(0 10px 14px #0006);
}
.pack--green,.feature-description,.doc-panel:nth-of-type(4n+1){--pack-skin:url('../assets/art/packs/skin-green.webp');--pack-text:#F6BED6;--pack-accent:#EF86B2}
.pack--blue,.hero-caption,.spec,.doc-panel:nth-of-type(4n+2){--pack-skin:url('../assets/art/packs/skin-blue.webp');--pack-text:#F7E4AD;--pack-accent:#F2CF70}
.pack--purple,.sync-grid,.catalog-search,.doc-panel:nth-of-type(4n+3){--pack-skin:url('../assets/art/packs/skin-purple.webp');--pack-text:#D7F4AF;--pack-accent:#B9EC70}
.pack--red,.help-inline .wrap,.custom-board,.doc-panel:nth-of-type(4n){--pack-skin:url('../assets/art/packs/skin-red.webp');--pack-text:#B5F2EF;--pack-accent:#75E1DF}
/* panel padding on top of the crimps */
.hero-caption{padding:8px 18px}
.feature-description{padding:12px 18px}
.sync-grid{padding:clamp(24px,4vw,56px)}
.help-inline .wrap{padding:clamp(22px,3.5vw,48px)}
.doc-panel,.spec{padding:22px 28px}
.catalog-search{padding:12px 18px}
.custom-board{padding:18px 22px}

:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(h1,h2,h3,h4,strong,summary,dt){color:var(--pack-accent)}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(p,li,label,small,dd,figcaption,span,b){color:var(--pack-text);text-shadow:inherit}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) a:not(.ticket):not(.small-button){color:var(--pack-accent);text-decoration:underline;text-underline-offset:3px}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(button,.ticket,.small-button,input,textarea,select){
  color:var(--pack-text);border:2px solid var(--pack-accent);border-radius:0;background:#0000004d;box-shadow:none;text-shadow:inherit;transform:none}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(button,.ticket,.small-button):hover{background:color-mix(in srgb,var(--pack-accent) 22%,transparent);transform:none;box-shadow:none}
/* the big call-to-action buttons stay solid so they still read as the main action */
:is(.sync-grid,.doc-panel,.custom-board) .ticket:not(.secondary){background:var(--pack-accent);color:#111;text-shadow:none}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(input,textarea)::placeholder{color:var(--pack-text);opacity:.75}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(details,details:last-child,.spec dl>div,.kv>div){border-color:var(--pack-accent)}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(a,button,input,textarea,select,summary):focus-visible{outline:2px solid var(--pack-accent);outline-offset:3px;box-shadow:none}
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) code{background:#0006;color:var(--pack-accent)}
/* small tags/stickers keep their own colours */
:is(.sync-grid,.doc-panel,.custom-board) :is(.free-tape,.free-tape *,.steps li:before){text-shadow:none}
.free-tape{color:var(--ink)!important}
.custom-board .slot-sketch i{border-color:var(--pack-accent);background:#0000004d}
@media(max-width:560px){
  :is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board){overflow-wrap:anywhere}
  .sync-grid,.help-inline .wrap,.doc-panel,.spec{padding:14px 14px}
  :is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board) :is(input,textarea,select){font-size:16px}
}
/* Board Sync scene (art: assets/art/sync, notes: design/sync-art/NOTE.md): feathered raster straight on the purple pack */
.sync-illustration,.sync-page .sync-illustration{aspect-ratio:auto;min-height:0;margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;transform:none;background:none;border:0;box-shadow:none}
.sync-scene{display:block;width:100%;max-width:680px;height:auto;aspect-ratio:8/5;object-fit:contain;margin-inline:auto;transform:none}
.sync-illustration figcaption,.sync-page .sync-illustration figcaption{position:static;inset:auto;margin:0;max-width:none;text-align:center;color:#D7F4AF;
  font:600 clamp(13px,1vw,16px)/1.45 var(--body);background:none;border:0;padding:0;transform:none;box-shadow:none}
.sync-illustration figcaption b{color:#B9EC70;font-weight:700}
.sync-page .sync-illustration{margin-bottom:24px}
/* Board Sync store button: breathing room before the setup links next to it */
.sync-copy a.ticket{margin-bottom:18px}.sync-copy a.ticket~.setup-link{display:block;width:fit-content;margin-top:14px}
.sync-copy a.ticket.secondary{background:var(--pack-accent);color:#111;text-shadow:none}

/* ---------- football menu ---------- */
/* Football-field menu (art: assets/art/menu, spec: design/menu-field/SPEC.md).
   One link per yard line; the hovered/current link glows gold with the football under it.
   Line positions are measured from field.webp, so the field and overlay must scale together (aspect 2:3). */
#menuDialog{width:min(480px,calc(100vw - 24px),calc(66.6667dvh - 21.3333px));min-width:min(290px,calc(100vw - 24px));max-height:calc(100dvh - 24px);
  overflow-y:auto;margin:auto;padding:0;border:0;border-radius:10px;background:#071B12;box-shadow:0 24px 80px #0009,0 0 0 1px #ffffff24;color:#F7F3E8}
#menuDialog::backdrop{background:#020A13CC;backdrop-filter:blur(5px)}
.mfield{position:relative;width:100%;aspect-ratio:2/3;container-type:inline-size;--sel:-50%}
.field-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;pointer-events:none}
#menuDialog h2{position:absolute;left:50%;top:6.4%;transform:translate(-50%,-50%);margin:0;white-space:nowrap;
  font:400 7.4cqw/1 var(--display);letter-spacing:.025em;text-transform:uppercase;color:#F7F3E8;text-shadow:0 2px 3px #031a3a,0 0 8px #031a3a}
#menuDialog .close{position:absolute;top:1%;right:5%;width:44px;height:44px;padding:0;border:0;background:transparent;font-size:0;z-index:4;box-shadow:none}
#menuDialog .close:before,#menuDialog .close:after{content:'';position:absolute;left:12px;top:20.5px;width:20px;height:3px;background:#F7F3E8;border-radius:2px;
  box-shadow:0 1px 3px #000;transform:rotate(45deg);transition:background .16s}
#menuDialog .close:after{transform:rotate(-45deg)}
#menuDialog .close:hover:before,#menuDialog .close:hover:after{background:#FFD166}
#menuDialog .close:focus-visible{outline:2px solid #FFD166;outline-offset:2px;box-shadow:none}
.mfield .nav-links{display:block;position:static}
.mfield .nav-links a{position:absolute;left:50%;top:var(--y);transform:translate(-50%,-50%);width:54%;min-height:44px;display:grid;place-items:center;
  padding:0;border:0;background:none;z-index:2;font:400 7.4cqw/1 var(--display);letter-spacing:.025em;text-transform:uppercase;white-space:nowrap;
  text-decoration:none;color:#F7F3E8;text-shadow:0 2px 2px #071B12b0;transition:color .16s,text-shadow .16s}
.mfield .nav-links a[data-k=sync]{font-size:7.2cqw}
.mfield .nav-links a[data-k=custom]{font-size:6.8cqw}
.mfield .nav-links a:hover,.mfield .nav-links a:focus-visible,.mfield .nav-links a.sel{color:#FFF0B5;background:none;
  text-shadow:0 1px 2px #10200B,0 0 10px #FFD166B3,0 0 26px #FFD16680}
.mfield .nav-links a:focus-visible{outline:2px solid #FFD166;outline-offset:5px;border-radius:6px;box-shadow:none}
.mfield .nav-links a:active{scale:.98;transition:scale 80ms}
.yard{position:absolute;top:var(--y);font:400 7cqw/1 var(--display);color:#F7F3E8;opacity:.75;pointer-events:none;text-shadow:0 1px 1px #092410}
/* yard-line arrows point outward along the line, beside the numbers */
.arw{position:absolute;top:var(--y);width:0;height:0;border-block:1.5cqw solid transparent;transform:translate(-50%,-50%);opacity:.75;pointer-events:none}
.arw.l{left:9%;border-right:2.5cqw solid #F7F3E8}
.arw.r{left:91%;border-left:2.5cqw solid #F7F3E8}
.yard.l{left:16%;transform:translate(-50%,-50%) rotate(-90deg)}
.yard.r{right:16%;transform:translate(50%,-50%) rotate(90deg)}
.ball{position:absolute;left:50%;top:calc(var(--sel) + 2.2%);width:10%;height:auto;max-width:none;transform:translateX(-50%);z-index:3;pointer-events:none;
  filter:drop-shadow(0 3px 3px #0008);transition:top 240ms cubic-bezier(.22,1,.36,1),opacity 140ms}
.halo{position:absolute;left:50%;top:calc(var(--sel) + 3.6%);width:30%;height:6%;transform:translate(-50%,-50%);pointer-events:none;z-index:1;
  background:radial-gradient(closest-side,#FFD16659,#FFD16600);transition:top 240ms cubic-bezier(.22,1,.36,1),opacity 140ms}
/* small stadium-light glints on the selected yard line */
.spark{position:absolute;top:var(--sel);width:3.2%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:1;
  background:radial-gradient(#FFF6D0,#FFD166 35%,#FFD16600 70%);box-shadow:0 0 12px 4px #FFD16680;transition:top 240ms cubic-bezier(.22,1,.36,1),opacity 140ms}
.spark.l{left:33%}.spark.r{left:67%}
.mfield.none .ball,.mfield.none .halo,.mfield.none .spark{opacity:0}
#menuDialog[open] .ball{animation:ball-in 180ms ease-out}
@keyframes ball-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
/* launcher: football on turf with MENU under it */
.menu-toggle{width:120px;height:100px;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));transition:transform .18s,filter .18s}
.menu-toggle img{width:100%;height:100%;object-fit:contain}
.menu-toggle span{left:50%;right:auto;top:76%;bottom:auto;transform:translate(-50%,-50%);font:400 19px/1 var(--display);letter-spacing:.09em;
  text-transform:uppercase;color:#F7F3E8!important;text-shadow:0 2px 3px #000,0 0 6px #000}
.menu-toggle:hover,.menu-toggle:focus-visible{transform:translateY(-2px);filter:drop-shadow(0 0 10px #FFD166aa)}
@media(max-width:760px){.menu-toggle{width:108px;height:90px}.menu-toggle span{font-size:17px}}
@media(prefers-reduced-motion:reduce){.ball,.halo,.spark,.mfield .nav-links a,.menu-toggle{transition:none!important}#menuDialog[open] .ball{animation:none}.mfield .nav-links a:active{scale:none}}
.paused .ball,.paused .halo{transition:none!important}.paused #menuDialog[open] .ball{animation:none}

/* ---------- word art ---------- */
/* Word-art headings: the h1/h2 keeps its role, the lettering image carries the text as alt (art: assets/art/wordart, spec: design/wordart/STYLE.md).
   Sized by line count so one-word titles don't balloon: height cap = lines x line size, width never past the column. */
:is(h1,h2).wa{line-height:0;text-shadow:none;margin-left:-.5%;--wa-line:clamp(50px,6.2vw,94px)}
h1.wa{--wa-line:clamp(66px,9.6vw,150px)}
:is(h1,h2).wa img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(var(--wa-lines,1) * var(--wa-line));filter:drop-shadow(0 4px 6px #0008)}

/* ---------- sticky top bar ---------- */
/* Sticky top bar on every page: DBS mark + animated neon logo (assets/art/brand, rim path data/logo-outline.json) + football menu button */
.topbar{position:sticky;top:0;z-index:40;background:linear-gradient(#060918f2,#0a0e24e6);backdrop-filter:blur(8px);
  border-bottom:1px solid #6d5cff55;box-shadow:0 6px 18px #0007}
.topbar-in{max-width:1440px;margin:0 auto;padding:6px max(16px,env(safe-area-inset-right)) 6px max(16px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:12px;height:96px}
.tb-home{display:flex;align-items:center;gap:14px;height:100%;min-width:0;text-decoration:none}
.tb-dbs{width:68px;height:68px;object-fit:contain;flex:none}
.dbx-logo{position:relative;display:block;height:100%;aspect-ratio:900/329;flex:none}
.dbx-logo img,.dbx-logo svg{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:none}
.dbx-logo svg{overflow:visible;pointer-events:none}
.dbx-logo .rim{fill:none;stroke-linejoin:round;stroke-linecap:round}
.tb-home:focus-visible{outline:2px solid #FFD166;outline-offset:3px;border-radius:6px}
/* the menu football now lives in the bar instead of floating at the bottom */
.topbar .menu-toggle,.topbar .menu-toggle:hover{position:relative;inset:auto;flex:none;width:92px;height:78px;margin:0}
.topbar .menu-toggle span{top:76%;font-size:16px}
.page-top>.wrap,.hero>.wrap{padding-top:clamp(20px,3vw,40px)}
@media(max-width:760px){.topbar-in{height:62px;gap:8px;padding-block:4px}.tb-dbs{width:44px;height:44px}.tb-home{gap:8px}
  .topbar .menu-toggle,.topbar .menu-toggle:hover{width:70px;height:58px}.topbar .menu-toggle span{font-size:13px}}
@media(max-width:380px){.tb-dbs{display:none}}
/* anchor jumps land below the pinned bar */
html{scroll-padding-top:112px}@media(max-width:760px){html{scroll-padding-top:78px}}
/* scrolling ticker in the gap between logo and menu (design: Codex). JS sets the duration from the list width (42px/s desktop, 30px/s phone) */
.tb-ticker{flex:1 1 0;min-width:0;align-self:center;height:34px;margin:0 24px;overflow:hidden;border-radius:6px;background:#080f22e0;
  border-top:1px solid #42daff47;border-bottom:1px solid #42daff47;box-shadow:0 0 12px #704aff1f;
  -webkit-mask:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent);mask:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
.tb-track{display:flex;width:max-content;animation:tb-scroll var(--tb-dur,40s) linear infinite}
.tb-ticker:hover .tb-track,.tb-ticker:focus-within .tb-track{animation-play-state:paused}
.tb-track ul{display:flex;margin:0;padding:0;list-style:none}
.tb-track li{display:block;white-space:nowrap;font:400 17px/34px Anton,Impact,'Arial Narrow',sans-serif;letter-spacing:.7px;text-transform:uppercase;color:#eaf5ff}
.tb-track li b{font-weight:400;color:#42daff}.tb-track li b.gold{color:#ffe05b}
.tb-track li:after{content:"✦";display:inline-block;vertical-align:middle;line-height:1;font-size:10px;color:#ae83ff;margin:0 24px}
@keyframes tb-scroll{to{transform:translateX(-50%)}}
html.paused .tb-track{animation:none}
@media(prefers-reduced-motion:reduce){.tb-track{animation:none}}
@media(max-width:760px){.topbar-in{flex-wrap:wrap;height:84px;row-gap:0;align-content:flex-start}.tb-home,.topbar .menu-toggle{height:58px}
  .tb-ticker{order:3;flex:0 0 100%;height:22px;margin:0 0 2px;border-radius:0;border-bottom:0;box-shadow:none;
    -webkit-mask:linear-gradient(to right,transparent,#000 16px,#000 calc(100% - 16px),transparent);mask:linear-gradient(to right,transparent,#000 16px,#000 calc(100% - 16px),transparent)}
  .tb-track li{font-size:13px;line-height:22px;letter-spacing:.8px}.tb-track li:after{margin:0 16px}
  html{scroll-padding-top:100px}}

/* ---------- crisp text ---------- */
/* Crisp text: rotated or heavily shadowed text gets resampled by the browser and looks soft.
   Tapes keep their tilted look on a pseudo-element background while the words stay upright; text panels sit straight. */
.free-tape,.board-top-copy .free-tape{position:relative;z-index:0;transform:none!important;background:none!important;border:0!important;text-shadow:none!important;padding:9px 16px}
.free-tape:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--cyan);border:2px solid var(--ink);transform:rotate(-2deg)}
/* foil-pack text: a tight dark edge instead of a wide blurry halo */
:is(.hero-caption,.feature-description,.sync-grid,.help-inline .wrap,.doc-panel,.spec,.catalog-search,.custom-board){text-shadow:0 1px 1px #000d,0 0 2px #0009}
/* text-bearing panels and cards sit straight (rotation blurs their text) */
.doc-panel:nth-child(odd),.doc-panel:nth-child(even),.spec,.board-card:nth-child(3n+2),.board-card:nth-child(3n),.custom-art figcaption{transform:none}