:root{touch-action:none;background:#87d8ff;font-family:system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}.traffic{-webkit-user-select:none;user-select:none;background:linear-gradient(#70ceff 0 24%,#bde77b 24% 32%,#eee0c2 32% 39%,#4d5865 39% 70%,#efdcb8 70%);width:100%;height:100%;position:relative;overflow:hidden}.sky{position:absolute;inset:0 0 68%}.sky i{background:#fff9;border-radius:50%;width:80px;height:28px;position:absolute}.sky i:first-child{top:25%;left:8%}.sky i:nth-child(2){top:13%;right:12%;transform:scale(1.4)}.sky i:nth-child(3){top:52%;left:44%;transform:scale(.7)}.far-sidewalk{color:#3c913c;justify-content:space-around;align-items:center;width:100%;height:15%;font-size:66px;display:flex;position:absolute;top:24%}.far-sidewalk b{color:#e88c55;font-size:80px}.road{z-index:1;background:linear-gradient(#525e6c,#3e4955);width:100%;height:31%;position:absolute;top:39%;overflow:hidden;box-shadow:inset 0 8px #fff3,inset 0 -8px #0002}.lane{border-top:6px dashed #ffeaa2;width:100%;position:absolute;top:48%}.crosswalk{z-index:2;flex-direction:column;justify-content:space-evenly;width:38%;display:flex;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.crosswalk i{background:#fffdf0;border-radius:5px;height:7%;display:block;box-shadow:0 2px #c8c9c5}.car{z-index:3;background:linear-gradient(#54b8ff,#1681d0);border:5px solid #174c83;border-radius:35% 42% 22% 25%;width:31%;height:35%;animation:4.3s linear infinite car-drive;position:absolute;top:28%;left:-35%;box-shadow:0 8px 8px #152b3b77}.car b{background:#bdeaff;border:5px solid #174c83;border-radius:60% 60% 0 0;width:48%;height:44%;position:absolute;top:-31%;left:24%}.car i{aspect-ratio:1;background:#d4e1e7;border:5px solid #273744;border-radius:50%;width:22%;position:absolute;bottom:-18%}.car i:first-of-type{left:10%}.car i:nth-of-type(2){right:9%}@keyframes car-drive{to{left:110%}}.near-sidewalk{background:repeating-linear-gradient(90deg,#efdcb8 0 70px,#e4cda5 70px 74px);width:100%;position:absolute;top:70%;bottom:0;box-shadow:inset 0 8px #fff6}.traffic__home,.traffic__sound{z-index:10;top:max(10px,env(safe-area-inset-top));color:#51392f;background:#fff4d6;border:3px solid #fff;border-radius:50%;place-items:center;width:52px;height:52px;text-decoration:none;display:grid;position:absolute;box-shadow:0 5px #a87344}.traffic__home{left:10px}.traffic__sound{font-size:28px;right:10px}.traffic__score{z-index:8;top:max(14px,env(safe-area-inset-top));color:#ffe65c;background:#543c31dd;border:3px solid #fff;border-radius:24px;justify-content:center;align-items:center;min-width:92px;height:46px;font-size:24px;font-weight:900;display:flex;position:absolute;left:50%;transform:translate(-50%)}.signal{z-index:7;background:#151a1e;border:7px solid #263039;border-radius:30px;width:104px;height:176px;padding:12px;transition:transform .25s;position:absolute;top:8%;left:50%;transform:translate(-50%);box-shadow:0 9px 12px #16273366}.signal>div:not(.signal__ring){background:#080a0c;border-radius:24px;height:68px;margin-bottom:8px;position:relative;box-shadow:inset 0 0 0 4px #313a40}.signal i{border-radius:50%;position:absolute;inset:14px 28px}.signal i:before,.signal i:after{content:"";position:absolute}.signal i:before{border-radius:14px 14px 8px 8px;width:28px;height:35px;top:22px;left:50%;transform:translate(-50%)}.signal i:after{border-radius:8px;width:42px;height:12px;top:48px;left:50%;transform:translate(-50%)}.signal__red i,.signal__red i:before,.signal__red i:after{background:#552327}.signal__green i,.signal__green i:before,.signal__green i:after{background:#174829}.traffic[data-signal=red] .signal__red i,.traffic[data-signal=red] .signal__red i:before,.traffic[data-signal=red] .signal__red i:after,.traffic[data-signal=warning] .signal__red i,.traffic[data-signal=warning] .signal__red i:before,.traffic[data-signal=warning] .signal__red i:after{background:#ff4050;box-shadow:0 0 13px #ff4050}.traffic[data-signal=green] .signal__green i,.traffic[data-signal=green] .signal__green i:before,.traffic[data-signal=green] .signal__green i:after{background:#4cff82;box-shadow:0 0 13px #4cff82}.signal__green i:after{transform:translate(-50%)rotate(-18deg)}.signal__ring{border:6px solid #0000;border-radius:38px;position:absolute;inset:-12px}.traffic[data-signal=warning] .signal__ring{border-color:#fff06d}.traffic[data-signal=green] .car{animation-play-state:paused}.rabbit{--progress:0;z-index:6;left:50%;bottom:calc(17% + var(--progress)*48%);filter:drop-shadow(0 7px 5px #172b3e55);width:74px;height:112px;transform:translateX(-50%) scale(calc(1 - var(--progress)*.2));position:absolute}.rabbit__ears{background:#ffb5c5;border:5px solid #eee;border-radius:50%;width:17px;height:42px;position:absolute;top:0;left:17px;box-shadow:23px 0 0 -5px #ffb5c5,23px 0 #eee}.rabbit__head{background:#fff7ee;border-radius:50%;width:58px;height:49px;position:absolute;top:30px;left:8px}.rabbit__head i{background:#29313b;border-radius:50%;width:7px;height:9px;position:absolute;top:19px}.rabbit__head i:first-child{left:14px}.rabbit__head i:last-child{right:14px}.rabbit__body{background:#ffd34e;border-radius:45% 45% 30% 30%;width:46px;height:38px;position:absolute;top:70px;left:14px}.rabbit__body b{background:#fff;border-radius:50%;width:20px;height:20px;position:absolute;bottom:0;right:-8px}.rabbit__feet{background:#fff;border-radius:50%;width:25px;height:14px;position:absolute;bottom:0;left:9px;box-shadow:31px 0 #fff}.traffic[data-phase=crossing] .rabbit{animation:.28s ease-in-out infinite alternate rabbit-step}@keyframes rabbit-step{to{transform:translateX(-50%) scale(calc(1 - var(--progress)*.2)) rotate(2deg);margin-left:5px}}.traffic[data-phase=near-miss] .rabbit{filter:drop-shadow(0 0 18px #8cf7ff)drop-shadow(0 7px 5px #172b3e55)}.walk{z-index:9;bottom:max(12px,env(safe-area-inset-bottom));color:#fff;touch-action:none;background:linear-gradient(#7cec6d,#25b94f);border:7px solid #fff;border-radius:48%;width:126px;height:96px;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 8px #167637,0 14px 24px #164b2d66}.walk span{letter-spacing:8px;font-size:28px;display:block;transform:rotate(90deg)}.walk i{color:#fff36b;font-size:30px;position:absolute;top:-30px;left:50%;transform:translate(-50%)}@keyframes walk-ready{50%{filter:brightness(1.16)drop-shadow(0 0 12px #79ff89);transform:translate(-50%)scale(1.05)}}.walk.is-held{margin-bottom:-5px;box-shadow:0 3px #167637}.message{z-index:8;color:#fff;text-align:center;text-shadow:0 3px 4px #25303c;font-size:24px;font-weight:900;position:absolute;bottom:24%;left:8px;right:8px}.level-stars{z-index:8;color:#ffe45b;letter-spacing:3px;text-shadow:0 2px #80571f;font-size:22px;position:absolute;top:31%;left:50%;transform:translate(-50%)}.result{z-index:20;background:#20313a99;position:absolute;inset:0}.result>div{background:#fff0bd;border:6px solid #fff;border-radius:34px;place-items:center;gap:18px;width:250px;padding:26px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px #97662e}.result strong{color:#e08b19;font-size:40px}.retry{background:#64d965;border:5px solid #fff;border-radius:28px;width:90px;height:74px;font-size:42px;box-shadow:0 6px #318d3c}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}.traffic[data-signal=warning] .signal{transform:translate(-50%)}.traffic[data-signal=warning] .signal__ring{border-width:9px}}.far-sidewalk span,.far-sidewalk b{color:#0000;width:72px;height:74px;font-size:0;position:relative}.far-sidewalk span:before,.far-sidewalk span:after{content:"";position:absolute}.far-sidewalk span:before{background:#815734;border-radius:8px;width:15px;height:38px;bottom:0;left:29px}.far-sidewalk span:after{background:linear-gradient(135deg,#77d86b,#348f49);border:5px solid #fff8;border-radius:52% 48% 46% 54%;width:64px;height:54px;top:0;left:4px;box-shadow:inset -8px -7px #267d3d55,0 5px 5px #2c623844}.far-sidewalk b{background:linear-gradient(#ffb26d,#e67950);border:5px solid #fff8;border-radius:9px;box-shadow:inset 0 -9px #b64f3c55,0 5px 5px #80513c44}.far-sidewalk b:before{clip-path:polygon(50% 0,100% 58%,88% 63%,88% 100%,12% 100%,12% 63%,0 58%);content:"";background:#a84c4c;width:78px;height:55px;position:absolute;top:-31px;left:-8px}.far-sidewalk b:after{content:"";background:#754632;border:4px solid #fff4c9;width:20px;height:35px;position:absolute;bottom:0;right:12px}.traffic[data-signal=green] .car,.traffic[data-signal=warning] .car,.traffic.has-crossers .car{animation:none;left:105%}.crossing-crowd{z-index:6;pointer-events:none;position:absolute;inset:0;overflow:hidden}.crossing-friend{bottom:21%;left:calc(50% + var(--lane-offset));width:88px;height:132px;filter:drop-shadow(0 7px 6px #513b2855) brightness(var(--friend-light,1)) saturate(var(--friend-color,1));animation:friend-cross var(--crossing-ms) linear forwards;background:url(/assets/games/traffic-signal-crossing/rabbit-3d-v1.png) bottom/contain no-repeat;position:absolute;transform:translate(-50%)}.crossing-friend--1{--friend-light:.96;--friend-color:1.08}.crossing-friend--2{--friend-light:1.04;--friend-color:.92}.crossing-friend--3{--friend-light:.99;--friend-color:1.14}.traffic.has-crossers>.rabbit{opacity:0}@keyframes friend-cross{0%{bottom:21%;transform:translate(-50%)scale(1)}45%{transform:translate(calc(4px - 50%))scale(.82)rotate(2deg)}to{bottom:61%;transform:translate(-50%)scale(.58)}}.signal{transform-origin:100% 0;top:9%;left:auto;right:12px;transform:scale(.78)}@media (width>=540px){.signal{right:5%}}.traffic{background:#7ed5ff url(/assets/games/traffic-signal-crossing/scene-3d-v1.png) 50%/cover no-repeat}.sky,.far-sidewalk,.near-sidewalk{opacity:0}.road{box-shadow:none;background:0 0;overflow:visible}.lane,.crosswalk{opacity:0}.car{width:36%;height:45%;box-shadow:none;filter:drop-shadow(0 8px 6px #172b3e55);background:url(/assets/games/traffic-signal-crossing/car-3d-v1.png) 50%/contain no-repeat;border:0;border-radius:0;top:25%}.car>*{display:none}.rabbit{filter:drop-shadow(0 8px 7px #513b2855);background:url(/assets/games/traffic-signal-crossing/rabbit-3d-v1.png) bottom/contain no-repeat;width:104px;height:156px}.rabbit>*{display:none}.traffic:not(.has-crossers)>.rabbit{bottom:21%}.signal{width:126px;height:252px;box-shadow:none;background:url(/assets/games/traffic-signal-crossing/signal-3d-v1.png) 50%/contain no-repeat;border:0;border-radius:0;padding:0;top:11.5%;right:3px;transform:none}.signal>div:not(.signal__ring){width:39%;height:20%;box-shadow:none;background:0 0;margin:0;position:absolute;left:31%}.signal__red{top:16%}.signal__green{top:38%}.signal i{aspect-ratio:1;width:19%;inset:8% auto auto 50%;transform:translate(-50%)}.signal i:before{clip-path:polygon(38% 0,62% 0,68% 25%,100% 42%,89% 58%,67% 46%,66% 65%,89% 100%,65% 100%,50% 72%,35% 100%,11% 100%,34% 65%,33% 46%,11% 58%,0 42%,32% 25%);border-radius:0;width:245%;height:290%;top:82%;left:50%;transform:translate(-50%)}.signal i:after,.signal__ring{display:none}.signal__red:before,.signal__red:after,.signal__green:before,.signal__green:after{z-index:0;content:"";opacity:0;pointer-events:none;border:3px solid #ffd45a;border-radius:50%;position:absolute;inset:-12%}.traffic[data-signal=red] .signal__red:before,.traffic[data-signal=red] .signal__red:after{border-color:#ff9f43;animation:1.45s ease-out infinite signal-ripple}.traffic[data-signal=warning] .signal__green:before,.traffic[data-signal=warning] .signal__green:after{border-color:#ffd45a;animation:1.45s ease-out infinite signal-ripple}.traffic.is-signal-coaching[data-signal=green] .signal__green:before,.traffic.is-signal-coaching[data-signal=green] .signal__green:after{border-color:#67ff85;animation:1s ease-out both signal-ripple}.signal__red:after,.signal__green:after{animation-delay:.32s!important}.traffic.is-signal-coaching:before{z-index:5;content:"";pointer-events:none;background:#141e2d21;animation:1.2s ease-out both coaching-shade;position:absolute;inset:0}.traffic.is-signal-coaching:not(.has-crossers)>.rabbit{animation:.75s ease-in-out rabbit-check-signal}.traffic[data-signal=warning] .signal{transform:none}.traffic[data-signal=green] .signal{animation:1.15s ease-in-out infinite green-signal-focus}.walk{bottom:max(42px, calc(env(safe-area-inset-bottom) + 40px));background:radial-gradient(circle at 37% 23%,#d9f8ff 0 9%,#67c9ee 43%,#278cc5 100%);border-color:#fffdf0;box-shadow:inset 0 6px 8px #ffffffb8,inset 0 -10px 14px #12639588,0 9px #155b87,0 16px 28px #173f5d66}.walk .walk__direction{color:#fffdf0;letter-spacing:0;text-shadow:0 4px #17678f,0 0 12px #d9f8ff;place-items:center;height:100%;font-size:58px;line-height:1;display:grid;transform:none}.walk.is-held{box-shadow:inset 0 6px 8px #fff8,inset 0 -5px 9px #12639588,0 3px #155b87}.traffic__home,.traffic__sound,.traffic__score{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:inset 0 4px 6px #fffa,0 6px #8d653e,0 10px 18px #3d2e2444}.traffic[data-score-digits="6"] .traffic__score,.traffic[data-score-digits="7"] .traffic__score{min-width:132px;font-size:21px}.traffic[data-score-digits="8"] .traffic__score,.traffic[data-score-digits="9"] .traffic__score{min-width:156px;font-size:18px}.traffic[data-score-digits="10"] .traffic__score{min-width:174px;font-size:16px}.message{display:none}@media (height<=680px){.rabbit{width:86px;height:129px}.signal{width:121px;height:242px;top:12.5%}}.traffic:after{z-index:5;content:"";pointer-events:none;border:0 solid #0000;position:absolute;inset:0;box-shadow:inset 0 0 #0000}.traffic[data-signal=warning]:after{border-width:10px;border-color:#ffb72caa;animation:1s ease-in-out 3 warning-vignette;box-shadow:inset 0 0 46px #ff8a2455}.traffic[data-signal=red]:after{background:radial-gradient(circle at 50% 58%,#0000 38%,#b8002430 100%);border-width:10px;border-color:#ff355d88;animation:1.2s ease-in-out infinite red-vignette;box-shadow:inset 0 0 58px #dc143c44}.traffic[data-signal=warning] .signal__red i,.traffic[data-signal=warning] .signal__red i:before{box-shadow:none;background:#552327}.traffic[data-signal=warning] .signal__green i,.traffic[data-signal=warning] .signal__green i:before{background:#4cff82;animation:.8s step-end infinite green-ending;box-shadow:0 0 18px #4cff82}.traffic[data-signal=green] .signal__red:before,.traffic[data-signal=green] .signal__red:after{visibility:hidden;animation:none}.traffic[data-signal=green] .signal__green:before,.traffic[data-signal=green] .signal__green:after{border-color:#67ff85}.traffic[data-signal=warning] .walk>i,.traffic[data-signal=red] .walk>i{opacity:0}.go-cue,.hazard-cue{z-index:12;pointer-events:none;position:absolute}.go-cue{bottom:max(72px,calc(env(safe-area-inset-bottom) + 70px));width:126px;height:84px;display:none;left:50%;transform:translate(-50%)}.go-cue__finger{filter:drop-shadow(0 3px 2px #643f2d88)drop-shadow(0 0 7px #fff8db);transform-origin:50% 100%;font-size:48px;line-height:1;animation:1.25s ease-in-out .35s infinite finger-tap;position:absolute;top:-22px;left:58%;transform:translate(-50%)rotate(-8deg)}.traffic[data-signal=green] .go-cue{display:block}.traffic[data-signal=green].is-signal-coaching .go-cue{animation:.65s .3s both coach-button-reveal}.traffic[data-signal=green] .walk{animation:1s ease-in-out infinite button-invite}.hazard-cue{background:radial-gradient(circle,#ff6d42 0 48%,#d71936 70%);border:9px solid #fff;border-radius:50%;place-items:center;width:148px;height:148px;display:none;top:29%;left:50%;transform:translate(-50%);box-shadow:0 0 0 12px #e51f3566,0 0 50px #e51f35}.hazard-cue b{color:#fff;text-shadow:0 5px #8b1026;font-size:104px;line-height:1}.hazard-cue span{color:#fff;white-space:nowrap;text-align:center;text-shadow:0 3px #701123;background:#b91535;border:5px solid #fff;border-radius:24px;min-width:128px;padding:8px 14px;font-size:25px;font-weight:1000;line-height:1;position:absolute;bottom:-58px;left:50%;transform:translate(-50%);box-shadow:0 7px 18px #73112688}.traffic[data-signal=warning] .hazard-cue span{background:#d86f13;box-shadow:0 7px 18px #7a3c1288}.hazard-cue i{border:10px dashed #ffda42;border-radius:50%;position:absolute;inset:-28px}.traffic.is-danger-pressed .hazard-cue{animation:.42s ease-out both danger-pop;display:grid}.traffic[data-signal=warning].is-danger-pressed .hazard-cue{background:radial-gradient(circle,#ffd94d 0 48%,#ef7b1e 70%);box-shadow:0 0 0 12px #ffad3266,0 0 50px #ffad32}.traffic.is-danger-pressed.is-signal-coaching .hazard-cue{border-width:6px;width:92px;height:92px;animation-name:danger-pop-signal;top:24%;left:70%;transform:translate(-50%)}.traffic.is-danger-pressed.is-signal-coaching .hazard-cue b{font-size:64px}.traffic.is-danger-pressed.is-signal-coaching .hazard-cue i{border-width:6px;inset:-17px}.traffic.is-danger-pressed.is-signal-coaching .hazard-cue span{min-width:96px;font-size:20px;bottom:-48px}.traffic.is-danger-pressed.is-signal-coaching[data-signal=red] .car{filter:drop-shadow(0 0 20px #ff3d50)drop-shadow(0 8px 6px #172b3e55)}.traffic[data-signal=red] .signal{animation:1.05s ease-in-out infinite red-danger}.traffic[data-signal=warning] .signal{animation:none}.crossing-friend.is-arrived{filter:drop-shadow(0 7px 6px #513b2855)brightness(1.12);animation:.65s ease-out both friend-arrival-joy;bottom:61%}.arrival-joy{pointer-events:none;width:128px;height:112px;position:absolute;bottom:38%;right:-40px}.arrival-joy b{z-index:1;color:#ff6689;text-shadow:0 3px #ac3651,0 0 18px #fff;font-size:48px;animation:.65s ease-out both joy-heart;position:absolute;top:6px;left:43px}.arrival-joy i{z-index:1;--joy-x:0px;--joy-y:-48px;background:#ffe55c;border-radius:3px;width:11px;height:11px;animation:.65s ease-out both joy-confetti;position:absolute;top:56px;left:59px;box-shadow:0 0 10px #fff46b}.arrival-joy i:nth-of-type(2){--joy-x:42px;--joy-y:-27px;background:#74e88a}.arrival-joy i:nth-of-type(3){--joy-x:45px;--joy-y:25px;background:#70c8ff}.arrival-joy i:nth-of-type(4){--joy-x:-42px;--joy-y:-28px;background:#ff98c4}.arrival-joy i:nth-of-type(5){--joy-x:-46px;--joy-y:24px;background:#a990ff}.arrival-joy i:nth-of-type(6){--joy-x:0px;--joy-y:43px;background:#ffad45}@keyframes finger-tap{0%,18%,to{opacity:0;transform:translate(-50%,-12px)rotate(-8deg)scale(.9)}34%,58%{opacity:1;transform:translate(-50%)rotate(-8deg)scale(1)}70%{opacity:1;transform:translate(-50%,15px)rotate(-8deg)scale(.96)}82%{opacity:.9;transform:translate(-50%)rotate(-8deg)scale(1)}}@keyframes button-invite{50%{filter:brightness(1.08)drop-shadow(0 0 18px #ffe788);transform:translate(-50%)scale(1.055)}}@keyframes danger-pop{0%{opacity:0;transform:translate(-50%)scale(.35)rotate(-12deg)}70%{transform:translate(-50%)scale(1.14)rotate(4deg)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes danger-pop-signal{0%{opacity:0;transform:translate(-50%)scale(.35)rotate(-12deg)}70%{transform:translate(-50%)scale(1.12)rotate(4deg)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes red-danger{50%{filter:drop-shadow(0 0 24px #ff273e);transform:scale(1.07)}}@keyframes warning-attention{50%{filter:drop-shadow(0 0 20px #ffb72c);transform:scale(1.04)}}@keyframes green-signal-focus{50%{filter:drop-shadow(0 0 22px #45ff7c)drop-shadow(0 0 8px #d8ffe2)}}@keyframes red-vignette{50%{border-color:#ff355d44;box-shadow:inset 0 0 30px #dc143c22}}@keyframes friend-arrival-joy{0%{transform:translate(-50%)scale(.58)}45%{transform:translate(-50%)translateY(-9px)scale(.68)rotate(-4deg)}72%{transform:translate(-50%)scale(.61)rotate(3deg)}to{transform:translate(-50%)scale(.58)}}@keyframes joy-heart{0%{opacity:0;transform:scale(.2)rotate(-18deg)}45%{opacity:1;transform:translateY(-8px)scale(1.15)rotate(5deg)}to{opacity:0;transform:translateY(-25px)scale(.85)}}@keyframes joy-confetti{0%{opacity:0;transform:scale(.2)}35%{opacity:1}to{opacity:0;transform:translate(var(--joy-x),var(--joy-y)) scale(.8)}}@keyframes green-ending{0%,56%{opacity:1;filter:brightness(1.25)}57%,to{opacity:.12;filter:brightness(.3)}}@keyframes warning-vignette{50%{border-color:#ffd76655;box-shadow:inset 0 0 20px #ff8a2422}}@keyframes signal-ripple{0%{opacity:0;transform:scale(.7)}25%{opacity:.85}to{opacity:0;transform:scale(1.28)}}@keyframes rabbit-check-signal{0%,to{transform:translate(-50%)rotate(0)}35%,70%{filter:drop-shadow(0 0 14px #ffe96a)drop-shadow(0 8px 7px #513b2855);transform:translate(-50%)translateY(-5px)rotate(5deg)scale(1.04)}}@keyframes coach-button-reveal{0%,42%{opacity:0}to{opacity:1}}@keyframes coaching-shade{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.traffic[data-signal=warning]:after,.traffic[data-signal=warning] .signal__green i,.traffic[data-signal=warning] .signal__green i:before,.traffic[data-signal=red]:after,.traffic[data-signal=green] .walk,.go-cue__finger,.traffic[data-signal=red] .signal,.traffic[data-signal=warning] .signal,.traffic[data-signal=green] .signal,.traffic.is-danger-pressed .hazard-cue,.crossing-friend.is-arrived,.arrival-joy b,.arrival-joy i,.signal__red:before,.signal__red:after,.signal__green:before,.signal__green:after,.traffic.is-signal-coaching:before,.traffic.is-signal-coaching:not(.has-crossers)>.rabbit,.traffic[data-signal=green].is-signal-coaching .go-cue{animation:none}}.power{z-index:8;pointer-events:none;filter:drop-shadow(0 5px 5px #39271366);width:48px;height:235px;position:absolute;top:27%;left:10px}.power__fever{width:48px;height:64px;position:absolute;top:0;left:0}.power__fever>b{z-index:2;color:#fff4b0;text-shadow:0 2px #b36b16,0 0 8px #ffd84f;font-size:31px;line-height:1;position:absolute;top:12px;left:50%;transform:translate(-50%)}.power__fever>i{clip-path:polygon(50% 0,62% 35%,100% 38%,70% 60%,80% 100%,50% 76%,20% 100%,30% 60%,0 38%,38% 35%);filter:drop-shadow(0 1px #fff8b955);background:#594d4a;width:12px;height:12px;position:absolute}.power__fever>i:first-of-type{top:0;left:18px}.power__fever>i:nth-of-type(2){top:13px;right:0}.power__fever>i:nth-of-type(3){bottom:5px;right:4px}.power__fever>i:nth-of-type(4){bottom:5px;left:4px}.power__fever>i:nth-of-type(5){top:13px;left:0}.traffic[data-fever-marks="1"] .power__fever>i:nth-of-type(-n+1),.traffic[data-fever-marks="2"] .power__fever>i:nth-of-type(-n+2),.traffic[data-fever-marks="3"] .power__fever>i:nth-of-type(-n+3),.traffic[data-fever-marks="4"] .power__fever>i:nth-of-type(-n+4){filter:drop-shadow(0 0 5px #fff176);background:#ffe257}.power__rail{background:linear-gradient(90deg,#493a48,#221e2e 55%,#554a59);border:4px solid #fff8d8;border-radius:18px;width:31px;height:168px;position:absolute;bottom:0;right:8px;overflow:hidden;box-shadow:inset 0 0 8px #110c18,0 3px #9d6327}.power__rail:before{z-index:1;height:calc((100% - 10px)*var(--power-fill));content:"";background:linear-gradient(#fffbd2,#ffe85c 44%,#ff9d27);border-radius:11px;transition:height .28s ease-out;position:absolute;bottom:5px;left:3px;right:3px;box-shadow:0 0 12px #ffd94d,0 -4px 9px #fff}.power__rail:after{z-index:2;content:"";background:repeating-linear-gradient(0deg,#0000 0 27px,#fff7cf66 27px 29px);border-radius:11px;position:absolute;inset:4px}.power__rail>b{z-index:3;color:#fff;text-align:center;text-shadow:0 2px #7d4210;font-size:13px;line-height:1;position:absolute;bottom:5px;left:0;right:0}.traffic.is-level-up .power__rail{animation:.55s ease-out power-pop}.traffic.is-level-up .power__fever>b{animation:.55s ease-out power-star-pop}.traffic.is-fever .power__fever>b,.traffic[data-review-fever] .power__fever>b{color:#fff;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 7px #fff);background:conic-gradient(#ff5aa7,#ffd94a,#67efff,#b978ff,#ff5aa7);-webkit-background-clip:text;background-clip:text;animation:.8s linear infinite fever-star}.traffic.is-fever .power__fever>i,.traffic[data-review-fever] .power__fever>i{filter:drop-shadow(0 0 7px #ffcc35);background:#fff48b}.traffic.is-fever .power__fever:after,.traffic[data-review-fever] .power__fever:after{background:conic-gradient(#fff6a4 calc(var(--fever-left)*1turn),#ffffff2b 0) border-box;content:"";border:4px solid #0000;border-radius:50%;position:absolute;inset:5px;transform:rotate(-90deg);-webkit-mask-image:linear-gradient(#0000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#0000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-origin:padding-box,border-box;mask-origin:padding-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.fever-frame{z-index:6;pointer-events:none;border:5px solid #70eaff;border-radius:22px;display:none;position:absolute;inset:7px;overflow:visible;box-shadow:inset 0 0 25px #ff67c055,0 0 18px #61e8ff}.fever-frame:before,.fever-frame:after{content:"";transform-origin:50%;background:linear-gradient(90deg,#0000,#79efff 28%,#fff 55%,#ff7ad8 78%,#0000);border-radius:9px;width:88px;height:11px;animation:2.8s linear infinite fever-edge-run;position:absolute;top:-8px;left:12px;box-shadow:0 0 10px #72edff,0 0 18px #ff75d4}.fever-frame:after{background:linear-gradient(90deg,#0000,#c080ff 28%,#fff7aa 55%,#6feaff 78%,#0000);animation-delay:-1.4s}.fever-frame>i{clip-path:polygon(50% 0,62% 35%,100% 38%,70% 60%,80% 100%,50% 76%,20% 100%,30% 60%,0 38%,38% 35%);filter:drop-shadow(0 0 8px #ff7dd8);background:#fff7a0;width:18px;height:18px;animation:1.4s ease-in-out infinite fever-corner-star;position:absolute}.fever-frame>i:first-child{top:18px;left:17px}.fever-frame>i:nth-child(2){animation-delay:.35s;top:18px;right:17px}.fever-frame>i:nth-child(3){animation-delay:.7s;bottom:18px;right:17px}.fever-frame>i:nth-child(4){animation-delay:1.05s;bottom:18px;left:17px}.traffic.is-fever .fever-frame,.traffic[data-review-fever] .fever-frame{animation:1.1s ease-in-out infinite fever-frame;display:block}.traffic.is-fever:is([data-signal=warning],[data-signal=red]) .fever-frame{opacity:.18;animation:none}.traffic.is-fever:is([data-signal=warning],[data-signal=red]) .fever-frame:before,.traffic.is-fever:is([data-signal=warning],[data-signal=red]) .fever-frame>i{animation-play-state:paused}.traffic.is-fever-start .fever-frame{animation:.9s ease-out both fever-start-wave}.traffic.is-fever-end .fever-frame{animation:.9s ease-out both fever-end-fade;display:block}.traffic.is-fever .crossing-friend.has-fever-trail:before,.traffic.is-fever .crossing-friend.has-fever-trail:after,.traffic[data-review-fever] .crossing-friend:before,.traffic[data-review-fever] .crossing-friend:after{z-index:-1;clip-path:polygon(50% 0,62% 35%,100% 38%,70% 60%,80% 100%,50% 76%,20% 100%,30% 60%,0 38%,38% 35%);filter:drop-shadow(0 0 7px #ff68cf);content:"";background:#fff47d;width:18px;height:18px;animation:.48s ease-out infinite fever-trail;position:absolute;bottom:18%;left:42%}.traffic.is-fever .crossing-friend.has-fever-trail:after,.traffic[data-review-fever] .crossing-friend:after{background:#76efff;width:12px;height:12px;animation-delay:.22s}.traffic.is-performance-lite .fever-frame>i:nth-child(2n),.traffic.is-performance-lite .arrival-joy i{display:none}.traffic.is-performance-lite .fever-frame{box-shadow:0 0 12px #61e8ff}.traffic.is-performance-lite .crossing-friend{filter:none}.fever-score-star{z-index:13;clip-path:polygon(50% 0,62% 35%,100% 38%,70% 60%,80% 100%,50% 76%,20% 100%,30% 60%,0 38%,38% 35%);filter:drop-shadow(0 0 9px #ff70d0)drop-shadow(0 0 4px #fff);pointer-events:none;background:#fff38a;width:25px;height:25px;animation:.68s cubic-bezier(.2,.75,.25,1) both score-star-flight;position:absolute;top:0;left:0}.traffic__score.is-fever-hit{animation:.4s ease-out fever-score-hit}@keyframes power-pop{45%{filter:brightness(1.5)drop-shadow(0 0 13px #ffe15b);transform:scale(1.13)}}@keyframes power-star-pop{45%{transform:translate(-50%)scale(1.38)rotate(18deg)}}@keyframes fever-star{to{transform:translate(-50%)rotate(360deg)}}@keyframes fever-frame{0%,to{border-color:#67e8ff;box-shadow:inset 0 0 28px #4fdcff66,0 0 20px #78efff}50%{border-color:#ff72d2;box-shadow:inset 0 0 42px #b45cff66,0 0 26px #ff72d2}}@keyframes fever-edge-run{0%{transform:translate(0)}24%{transform:translate(calc(100vw - 132px))}25%{transform:translate(calc(100vw - 132px))rotate(90deg)}49%{transform:translate(calc(100vw - 132px),calc(100vh - 38px))rotate(90deg)}50%{transform:translate(calc(100vw - 132px),calc(100vh - 38px))rotate(180deg)}74%{transform:translate(-12px,calc(100vh - 38px))rotate(180deg)}75%{transform:translate(-12px,calc(100vh - 38px))rotate(270deg)}99%{transform:translate(-12px)rotate(270deg)}to{transform:translate(0)rotate(360deg)}}@keyframes fever-corner-star{0%,to{opacity:.35;transform:scale(.65)rotate(0)}50%{opacity:1;transform:scale(1.2)rotate(28deg)}}@keyframes fever-start-wave{0%{opacity:0;transform:scale(.92);box-shadow:inset 0 0 #69efff00}45%{opacity:1;transform:scale(1.01);box-shadow:inset 0 0 85px #ff73d477,0 0 34px #6deaff}to{transform:scale(1)}}@keyframes fever-end-fade{0%{opacity:.85}to{opacity:0;transform:scale(1.025)}}@keyframes fever-trail{0%{opacity:1;transform:translate(-8px,14px)rotate(0)scale(1)}to{opacity:0;transform:translate(-34px,48px)rotate(90deg)scale(.35)}}@keyframes score-star-flight{0%{opacity:0;transform:translate(var(--star-x),var(--star-y)) scale(.45) rotate(0)}18%{opacity:1;transform:translate(var(--star-x),var(--star-y)) scale(1.25) rotate(35deg)}to{opacity:0;transform:translate(var(--score-x),var(--score-y)) scale(.55) rotate(210deg)}}@keyframes fever-score-hit{45%{filter:brightness(1.4)drop-shadow(0 0 14px #ff76d4);transform:translate(-50%)scale(1.12)}}@media (width<=380px){.power{transform-origin:0;left:4px;transform:scale(.88)}}@media (prefers-reduced-motion:reduce){.traffic.is-level-up .power__rail,.traffic.is-level-up .power__fever>b,.traffic.is-fever .power__fever>b,.traffic.is-fever .fever-frame,.fever-frame:before,.fever-frame>i,.traffic.is-fever .crossing-friend:before,.traffic.is-fever .crossing-friend:after,.fever-score-star,.traffic__score.is-fever-hit{animation:none}.power__rail:before{transition:none}.fever-score-star{display:none}}
