/* Gulley's striped-uniform character recreated as movable vector artwork. */
.brand-intro{position:fixed;inset:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;padding:0;border:0;color:#f5eee2;background:transparent;overflow:hidden;isolation:isolate;}
.brand-intro:not([open]){display:none}.brand-intro[open]{display:flex;flex-direction:column;justify-content:space-between;}
.brand-intro::backdrop{background:#171816}
.opening-gate{position:absolute;top:0;bottom:0;width:50.2%;z-index:-1;background-color:#171816;background-image:linear-gradient(90deg,transparent 48%,#f07e4610 49%,#f07e4610 50%,transparent 51%),repeating-linear-gradient(90deg,transparent 0,transparent calc(20% - 5px),#45453e 20%);box-shadow:inset 0 0 160px #000a;}
.opening-gate:before,.opening-gate:after{content:"";position:absolute;left:0;right:0;height:8px;border-block:1px solid #777468;background:#24241f;box-shadow:0 6px 20px #0008;}
.opening-gate:before{top:27%}.opening-gate:after{bottom:25%}.opening-gate-left{left:0;border-right:1px solid #f07e4666}.opening-gate-right{right:0;border-left:1px solid #f07e4666}
.opening-top,.opening-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px max(28px,env(safe-area-inset-right));position:relative;z-index:1;}
.opening-top{font-size:13px;font-weight:800;letter-spacing:.1em;background:linear-gradient(#171816ee,#17181600)}.opening-top b{color:#f07e46;margin-inline:8px}
.opening-skip{display:flex;align-items:center;gap:16px;padding:10px 15px;min-height:44px;border:1px solid #b4a48d;background:#171816;color:#f5eee2;font:700 15px/1.4 Arial,sans-serif;cursor:pointer;letter-spacing:0;white-space:nowrap;}
.opening-skip:hover{background:#f07e46;color:#171816;border-color:#f07e46}.brand-intro :focus-visible{outline:3px solid #f7d5b8;outline-offset:5px}
.opening-center{margin:auto;padding:15px 24px;text-align:center;width:100%;}
.opening-brand{display:flex;align-items:center;justify-content:center;gap:32px;}
.opening-mascot{display:block;width:350px;height:auto;flex-shrink:0;overflow:visible;filter:drop-shadow(0 10px 18px #0008)}.mascot-cage{filter:drop-shadow(2px 3px 2px #000a)}
.theme-b .brand-intro h2{font-family:Impact,'Arial Narrow','Arial Black',sans-serif;font-size:clamp(90px,12vw,160px);font-weight:400;line-height:.85;color:#f07e46;letter-spacing:.015em;text-align:left;margin:0;}
.brand-intro h2 small{display:block;font:900 24px/1 Arial,sans-serif;letter-spacing:.25em;margin-bottom:13px;color:#f5eee2;}
.brand-intro h2>span{display:block;font:900 33px/1.1 Arial,sans-serif;letter-spacing:.12em;margin-top:17px;color:#f5eee2;}
.opening-slogan{font:400 clamp(38px,5vw,65px)/1.05 Impact,'Arial Narrow','Arial Black',sans-serif;letter-spacing:.015em;color:#f5eee2;margin:28px 0 0!important;}.opening-slogan strong{font-weight:400;color:#f07e46}
.opening-local{font-size:19px;line-height:1.4;color:#ded8cc;margin:12px 0 0!important}.opening-local span{color:#f07e46;font-weight:900}
.opening-bottom{background:linear-gradient(#17181600,#171816ee);padding-bottom:max(25px,env(safe-area-inset-bottom));}
.opening-bottom>span{font-size:13px;line-height:1.6;letter-spacing:.08em;color:#c6beae}.opening-bottom>span b{color:#f5eee2}
.opening-bottom>a{font-size:30px;line-height:1.2;font-weight:900;background:#f07e46;color:#171816;padding:12px 18px;box-shadow:4px 4px 0 #f5eee2;letter-spacing:-.02em;white-space:nowrap;}
.opening-bottom>a small{display:block;font-size:11px;letter-spacing:.07em;margin-bottom:4px}.opening-bottom>a:hover{background:#ff9e66}
.theme-b .replay-opening{font:700 13px/1.4 Arial,sans-serif;background:transparent;color:inherit;border:1px solid #716b60;padding:9px 13px;min-height:44px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;}
.theme-b .replay-opening[hidden]{display:none}.replay-opening:hover{background:#e4d9c8}
.is-playing .opening-center{animation:opening-brand-in 500ms cubic-bezier(.2,.75,.25,1) both,opening-brand-out 500ms 3300ms ease-in forwards;}
.is-playing .opening-gate-left{animation:opening-gate-left 4200ms linear forwards;}.is-playing .opening-gate-right{animation:opening-gate-right 4200ms linear forwards;}
.is-playing .opening-top,.is-playing .opening-bottom{animation:opening-chrome-out 300ms 3950ms ease-in forwards;}
.brand-intro.is-playing::backdrop{animation:opening-chrome-out 600ms 3650ms ease-in forwards;}
@keyframes opening-brand-in{from{transform:translateY(18px) scale(.94)}to{transform:translateY(0) scale(1)}}
@keyframes opening-brand-out{to{opacity:0;transform:scale(1.06)}}
@keyframes opening-gate-left{0%,26%{transform:translateX(0)}57%,74%{transform:translateX(-12%)}100%{transform:translateX(-101%)}}
@keyframes opening-gate-right{0%,26%{transform:translateX(0)}57%,74%{transform:translateX(12%)}100%{transform:translateX(101%)}}
@keyframes opening-chrome-out{to{opacity:0}}
@media(max-width:650px){.opening-top{font-size:10px;letter-spacing:.04em;padding:18px 18px;gap:12px}.opening-top>span{max-width:145px;line-height:1.7}.opening-top b{margin-inline:2px}.opening-skip{font-size:14px;gap:10px;padding:9px 12px}.opening-center{padding:10px 18px}.opening-brand{flex-direction:column;gap:12px}.opening-mascot{width:270px}.theme-b .brand-intro h2{font-size:86px;text-align:center}.brand-intro h2 small{font-size:15px;margin-bottom:10px}.brand-intro h2>span{font-size:20px;margin-top:11px}.opening-slogan{font-size:39px;margin-top:22px!important}.opening-local{font-size:16px;margin-top:9px!important}.opening-bottom{padding:16px 20px max(23px,env(safe-area-inset-bottom));justify-content:center}.opening-bottom>span{display:none}.opening-bottom>a{font-size:28px;width:min(100%,340px);text-align:center}.opening-bottom>a small{font-size:10px}.theme-b .footer-bottom{gap:18px;flex-wrap:wrap}}
@media(max-height:700px) and (max-width:650px){.opening-mascot{width:205px}.opening-brand{gap:15px}.theme-b .brand-intro h2{font-size:69px}.brand-intro h2 small{font-size:12px;margin-bottom:8px}.brand-intro h2>span{font-size:17px;margin-top:9px}.opening-slogan{font-size:32px;margin-top:17px!important}.opening-local{font-size:14px}.opening-bottom>a{font-size:24px;padding:9px 15px}.opening-top{padding-block:12px}}
@media(max-height:490px){.opening-center{padding-block:0}.opening-brand{flex-direction:row;gap:24px}.opening-mascot{width:190px}.theme-b .brand-intro h2{font-size:76px;text-align:left}.brand-intro h2 small{font-size:13px;margin-bottom:8px}.brand-intro h2>span{font-size:18px;margin-top:10px}.opening-slogan{font-size:34px;margin-top:14px!important}.opening-local{display:none}.opening-top,.opening-bottom{padding-block:12px}.opening-bottom>a{font-size:23px;padding:8px 13px}}
@media(prefers-reduced-motion:reduce){.brand-intro *{animation:none!important;transition:none!important}}
@media print{.brand-intro,.replay-opening{display:none!important}}
