/* 第 3 关：俯视跑道追逐，作用域 .ch */
.ch{position:absolute;inset:0;overflow:hidden;background:#5d616c;touch-action:none}
.ch-side{position:absolute;top:0;bottom:0;width:40px;background-color:#aab2bf;background-image:linear-gradient(#8f98a8 2px,transparent 2px);background-size:100% 40px;z-index:0}
.ch-side.l{left:0;border-right:6px solid #e5e7eb}
.ch-side.r{right:0;border-left:6px solid #e5e7eb}
.ch-road{position:absolute;left:46px;right:46px;top:0;bottom:0;background-color:#5d616c;background-image:repeating-linear-gradient(to bottom,transparent 0 40px,#f2e34a 40px 70px);background-size:8px 70px;background-repeat:repeat-y;background-position:center 0}
.ch-gap{position:absolute;top:12px;left:0;right:0;text-align:center;color:#fff;font-weight:900;font-size:18px;text-shadow:2px 2px 0 #000;z-index:5}
.ch-tip{position:absolute;top:40px;left:0;right:0;text-align:center;color:rgba(255,255,255,.8);font-size:12px;z-index:5}
.ch-toast{position:absolute;top:66px;left:50%;transform:translateX(-50%);background:#ffd166;color:#1c1c30;font-weight:900;font-size:14px;padding:4px 12px;border-radius:999px;border:3px solid #1c1c30;box-shadow:3px 3px 0 #1c1c30;opacity:0;transition:opacity .1s;z-index:6;white-space:nowrap;pointer-events:none}
.ch-toast.on{opacity:1}
.ch-runner{position:absolute;left:0;top:0;width:60px;margin-left:-30px;text-align:center;z-index:2}
.ch-tag{display:inline-block;background:#fff;color:#111;font-weight:900;font-size:11px;padding:1px 6px;border-radius:4px;border:2px solid #111;margin-bottom:-2px;position:relative;z-index:1;white-space:nowrap;transition:transform .15s}
.ch-runner.swap .ch-tag{transform:translateY(-10px) rotate(-8deg);background:#ffd166}
.ch-man{width:52px;height:64px;margin:0 auto;transition:transform .2s;filter:drop-shadow(0 3px 2px rgba(0,0,0,.35))}
.ch-ob{position:absolute;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;z-index:1;filter:drop-shadow(0 3px 2px rgba(0,0,0,.35))}
.ch-ob.boom{animation:chboom .32s ease-out both}
@keyframes chboom{from{transform:scale(.6)}to{transform:scale(1.4);opacity:0}}
.ch-toilet{position:absolute;left:0;top:0;width:58px;height:58px;margin:-29px 0 0 -29px;z-index:2;filter:drop-shadow(0 4px 4px rgba(0,0,0,.4))}
.ch-toilet.hit{animation:chhit .4s}
@keyframes chhit{0%,100%{filter:none}50%{filter:brightness(2) drop-shadow(0 0 8px #ff4d4d)}}
.ch-clog{position:absolute;left:14px;top:10px;width:30px;height:30px;display:none}
.ch-toilet.clog .ch-clog{display:block;animation:chclog .4s cubic-bezier(.2,1.5,.4,1) both}
@keyframes chclog{from{transform:scale(.2)}to{transform:scale(1)}}
.ch-bubble{position:absolute;background:#fff;color:#111;font-weight:900;font-size:16px;padding:8px 12px;border-radius:12px;border:3px solid #111;box-shadow:3px 3px 0 #111;white-space:nowrap;transform:translate(-50%,-100%);z-index:4;animation:chpop .3s cubic-bezier(.2,1.5,.4,1) both}
@keyframes chpop{from{transform:translate(-50%,-100%) scale(.3);opacity:0}to{transform:translate(-50%,-100%) scale(1);opacity:1}}
.ch-runner.caught .ch-man{transform:rotate(-35deg) translate(8px,14px)}
.ch-runner.caught .art-run .la,.ch-runner.caught .art-run .lb{animation:none}
.ch-caught .ch-tip{display:none}

.ch-tag{position:absolute;left:50%;top:0;transform:translate(-50%,var(--tag-offset,-22px));transition:background .15s}.ch-runner.swap .ch-tag{transform:translate(-50%,var(--tag-offset,-22px));background:#ffd166}.ch-man{margin-top:20px}.ch-runner.aimed .ch-tag{outline:3px solid #ffe4a1}.ch-capture{position:absolute;left:32px;right:32px;top:554px;min-height:24px;text-align:center;color:#ffe4a1;font-size:13px;font-weight:900;text-shadow:0 2px 3px #000;pointer-events:none}

.ch .ch-runner .ch-tag{translate:0 0!important}
.ch .ch-runner .ch-tag{transform:translate(calc(-50% + var(--tag-x,0px)),var(--tag-offset,-22px))}
.ch-label-lead{position:absolute;left:30px;top:16px;border-top:1px solid rgba(255,255,255,.65);transform-origin:0 0;pointer-events:none}

/* Parallel overhead scroll replaces the perspective street in later art themes. */
.ch.ch-scroll{background:#a2aa98}.ch.ch-scroll .ch-road{left:50px;right:50px;top:0;bottom:0;width:auto;background-color:#4c5360!important;background-image:repeating-linear-gradient(#e5e5d4 0 27px,transparent 27px 70px),repeating-linear-gradient(#e5e5d4 0 27px,transparent 27px 70px),repeating-linear-gradient(#e5e5d4 0 27px,transparent 27px 70px)!important;background-size:3px 70px!important;background-repeat:repeat-y!important;background-position:25% var(--road-scroll,0px),50% var(--road-scroll,0px),75% var(--road-scroll,0px)!important;box-shadow:inset 4px 0 #eee9d0,inset -4px 0 #eee9d0,inset 10px 0 13px #17212b30,inset -10px 0 13px #17212b30}
.ch.ch-scroll .ch-side{width:50px;opacity:1;border:0;overflow:hidden;background:#b4b4a4!important;box-shadow:none}.ch.ch-scroll .ch-side:after{display:none}.ch-verge-track{position:absolute;top:0;left:0;width:50px;height:1280px;will-change:transform}.ch-verge-track svg{display:block;width:50px;height:1280px}.ch.ch-scroll .ch-man{height:74px}.ch.ch-scroll .ch-capture{top:auto;bottom:64px}.ch.ch-scroll .ch-bubble{font-size:13px;padding:6px 9px}
