.tour{margin:0;position:relative}
.tour .tv{border:1px solid var(--line2);border-radius:var(--r-lg);background:var(--panel);
          box-shadow:var(--shadow-l);overflow:hidden}


.tour .tvbar{display:flex;align-items:center;gap:7px;padding:10px 13px;
             background:var(--panel2);border-bottom:1px solid var(--line)}
.tour .tvbar .dot{width:10px;height:10px;border-radius:50%;background:var(--line2);flex:0 0 auto}
.tour .tvbar .dot.r{background:#f87171} .tour .tvbar .dot.y{background:#fbbf24}
.tour .tvbar .dot.g{background:#34d399}
.tour .tvbar .addr{flex:1;margin-left:10px;font:11px/1.6 var(--mono);color:var(--ink3);
             background:var(--panel);border:1px solid var(--line);border-radius:6px;
             padding:3px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tour .tvbar .len{font:600 11px var(--sans);color:var(--ink4);white-space:nowrap;
             display:inline-flex;align-items:center;gap:6px}
.tour .tvbar .len::before{content:'';width:7px;height:7px;border-radius:50%;
             background:var(--ok);animation:tlive 2.4s ease-in-out infinite}
@keyframes tlive{0%,100%{opacity:1}50%{opacity:.35}}


.tour .stage{position:relative;aspect-ratio:16/9;min-height:280px;overflow:hidden;
    background:
      radial-gradient(760px 320px at 18% -10%, var(--tint-accent), transparent 64%),
      linear-gradient(var(--line) 1px, transparent 1px) 0 0/44px 44px,
      linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0/44px 44px,
      var(--panel)}

.tour .stage{max-height:470px}
@media(max-width:760px){.tour .stage{aspect-ratio:auto;max-height:none;min-height:0;height:360px}}

.tour .sc{position:absolute;inset:0;padding:16px 18px 18px;opacity:0;visibility:hidden;
          pointer-events:none;transition:opacity .4s ease,visibility 0s linear .4s}
.tour .sc.on{opacity:1;visibility:visible;pointer-events:auto;
             transition:opacity .4s ease,visibility 0s}

.tour:not(.ready) .sc.lead{opacity:1;visibility:visible}


.tour .sct{position:absolute;left:18px;top:14px;z-index:3;
    font:600 11px/1 var(--sans);letter-spacing:.3px;text-transform:uppercase;
    color:var(--accent);background:var(--panel);border:1px solid var(--edge-accent);
    border-radius:999px;padding:6px 11px}
.tour .sc.on .sct{animation:tchip .5s ease both}
@keyframes tchip{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}


.tour .scs{position:absolute;left:18px;right:18px;bottom:14px;z-index:3;margin:0;
    font:13.5px/1.6 var(--sans);color:var(--ink2)}
.tour .scs b{color:var(--ink);font-weight:600}
.tour .sc.on .scs{animation:tup .6s ease .25s both}
@keyframes tup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}


.tour .foot{display:flex;align-items:center;gap:14px;padding:11px 13px;
            border-top:1px solid var(--line);background:var(--panel2)}
.tour .pp{flex:0 0 auto;width:30px;height:30px;border-radius:50%;cursor:pointer;
    display:grid;place-items:center;color:var(--accent);
    background:var(--panel);border:1px solid var(--edge-accent)}
.tour .pp:hover{background:var(--tint-accent)}
.tour .pp svg{width:12px;height:12px;fill:currentColor}
.tour .pp .ipause{display:none}
.tour.paused .pp .ipause,.tour.still .pp .ipause{display:block}
.tour.paused .pp .iplay,.tour.still .pp .iplay{display:none}

.tour .chap{display:flex;gap:9px;flex:1;list-style:none;margin:0;padding:0;min-width:0}
.tour .chap li{flex:1;min-width:0}
.tour .chap button{display:block;width:100%;padding:0;margin:0;border:0;background:none;
                   cursor:pointer;text-align:left}
.tour .chap .bar{display:block;height:3px;border-radius:2px;background:var(--line2);
                 overflow:hidden}
.tour .chap .bar i{display:block;height:100%;width:0;border-radius:2px;
                   background:linear-gradient(90deg,var(--accent),var(--accent2))}
.tour .chap li.done .bar i{width:100%}
.tour .chap li.now .bar i{animation:tfill var(--d,9s) linear both}
@keyframes tfill{from{width:0}to{width:100%}}
.tour.paused .chap li.now .bar i{animation-play-state:paused}
.tour .chap .lb{display:block;margin-top:7px;font:600 11px/1.3 var(--sans);color:var(--ink4);
                white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tour .chap li.now .lb{color:var(--ink)}
.tour .chap button:hover .lb{color:var(--accent)}
.tour .chap button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
@media(max-width:640px){.tour .chap .lb{display:none}}

.tour figcaption{margin:12px 2px 0;font-size:11px;color:var(--ink4);line-height:1.65}


.tour svg.top{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tour .wire{stroke:var(--line2);stroke-width:2.5;stroke-linecap:round;fill:none}
.tour .box{fill:var(--panel2);stroke:var(--line2);stroke-width:1.2}
.tour .tag{fill:var(--ink);font:600 12.5px var(--mono);text-anchor:middle}
.tour .nm{fill:var(--ink4);font:11px var(--sans);text-anchor:middle}
.tour .ifl{fill:var(--ink4);font:11px var(--mono);text-anchor:middle}
.tour .ring{fill:none;stroke-width:2;transform-box:fill-box;transform-origin:center}


.tour .sc.on .nd{animation:tpop .55s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes tpop{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}
.tour .nd{transform-box:fill-box;transform-origin:center}
.tour .sc.on .ln1{animation:tdraw .7s ease 1.9s both}
.tour .sc.on .ln2{animation:tdraw .7s ease 2.6s both}
.tour .ln1,.tour .ln2{stroke-dasharray:180;stroke-dashoffset:180}
@keyframes tdraw{from{stroke-dashoffset:180}to{stroke-dashoffset:0}}
.tour .sc.on .ifl{animation:tfade .5s ease 3.2s both}
@keyframes tfade{from{opacity:0}to{opacity:1}}


.tour .toast i{font-style:normal}
.tour .toast{position:absolute;right:18px;top:14px;z-index:3;
    display:inline-flex;align-items:center;gap:8px;font:600 11px var(--sans);
    color:var(--ok);background:var(--tint-ok);border:1px solid var(--edge-ok);
    border-radius:999px;padding:7px 12px}
.tour .sc.on .toast{animation:tslide .6s ease 4.4s both}
@keyframes tslide{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}


.tour .panel{position:absolute;left:18px;right:18px;bottom:64px;z-index:2;
    background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
    padding:12px 14px}
.tour .panel .hd{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.tour .panel .hd b{font:600 12.5px var(--sans);color:var(--ink)}
.tour .pill{margin-left:auto;font:600 11px var(--sans);border-radius:999px;padding:4px 10px;
            border:1px solid var(--edge-warn);color:var(--warn);background:var(--tint-warn)}
.tour .pill.ok{border-color:var(--edge-ok);color:var(--ok);background:var(--tint-ok);
               position:absolute;right:14px;top:12px}
.tour .sc.on .pill.ok{animation:tfade .4s ease 7.3s both}
.tour .sc.on .pill.go{animation:tgone .4s ease 7.3s both}
@keyframes tgone{to{opacity:0}}
.tour .prog{height:5px;border-radius:3px;background:var(--line2);overflow:hidden}
.tour .prog i{display:block;height:100%;width:0;border-radius:3px;
              background:linear-gradient(90deg,var(--accent),var(--ok))}
.tour .sc.on .prog i{animation:tfill 7s linear .4s both}
.tour .boot{margin:9px 0 0;font:11px/1.75 var(--mono);color:var(--ink3);
            white-space:pre;overflow:hidden}
.tour .boot span{display:block}
.tour .boot span.v{color:var(--ok)}
.tour .sc.on .boot span{animation:tline .45s ease both;animation-delay:var(--d,0s)}
@keyframes tline{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.tour .sc.on .ring{animation:tping 2.2s ease-out infinite}
@keyframes tping{0%{opacity:.75;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}


.tour .sc.term3{padding:0}
.tour .cons{position:absolute;inset:0;background:var(--term-bg);color:var(--term-ink);
    font:12.5px/1.85 var(--mono);padding:44px 18px 46px;overflow:hidden}
.tour .cons .l{display:block;white-space:pre;overflow:hidden;width:0}
.tour .sc.on .cons .l{animation:ttype var(--t,.75s) steps(var(--n,20),end) var(--d,0s) both}
@keyframes ttype{from{width:0}to{width:calc(var(--n,20) * 1ch)}}
.tour .cons .p{color:var(--accent2)}      
.tour .cons .c{color:#e6edf7}             
.tour .cons .v{color:#34d399}             
.tour .cons .cur{display:inline-block;width:8px;height:14px;vertical-align:-2px;
                 background:var(--term-ink)}
.tour .sc.on .cons .cur{animation:tfade .2s linear 9.6s both,nbblink 1.1s step-end 9.6s infinite}
@keyframes nbblink{0%,100%{opacity:1}50%{opacity:0}}


.tour .pkt{transform-box:view-box;transform-origin:0 0}
.tour .pkt rect{fill:var(--accent)}
.tour .pkt text{fill:#fff;font:600 11px var(--sans);text-anchor:middle}
.tour .pkt.back rect{fill:var(--ok)}
.tour .sc.on .pkt.go{animation:tgo 2s cubic-bezier(.4,0,.6,1) 1s both}
.tour .sc.on .pkt.back{animation:tback 2s cubic-bezier(.4,0,.6,1) 3.3s both}
@keyframes tgo  {0%{opacity:0;transform:translateX(0)}8%{opacity:1}
                 92%{opacity:1}100%{opacity:0;transform:translateX(340px)}}
@keyframes tback{0%{opacity:0;transform:translateX(340px)}8%{opacity:1}
                 92%{opacity:1}100%{opacity:0;transform:translateX(0)}}

.tour .caps{position:absolute;left:18px;right:18px;bottom:64px;z-index:2;
    background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
    overflow:hidden}
.tour .caps .ch{display:flex;align-items:center;gap:8px;padding:7px 11px;
    background:var(--panel2);border-bottom:1px solid var(--line);
    font:600 11px var(--sans);color:var(--ink2)}
.tour .caps .ch .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:0 0 auto}
.tour .caps .ch .sp{margin-left:auto;font:11px var(--mono);color:var(--ink4)}
.tour .caps .r{display:grid;grid-template-columns:34px 54px 1fr 1fr 44px;gap:8px;
    padding:4px 11px;font:11px/1.7 var(--mono);color:var(--ink3);
    border-top:1px solid var(--line)}
.tour .caps .r:first-of-type{border-top:0}
.tour .caps .r b{font-weight:600;color:var(--ink2)}
.tour .caps .r.hit b{color:var(--ok)}
.tour .sc.on .caps .r{animation:tline .4s ease both;animation-delay:var(--d,0s)}
.tour .caps .cf{display:flex;align-items:center;gap:8px;padding:6px 11px;
    border-top:1px solid var(--line);background:var(--panel2);
    font:11px var(--mono);color:var(--ink4)}
.tour .sc.on .caps .cf{animation:tfade .45s ease 6.2s both}
.tour .caps .cf em{font-style:normal;color:var(--ok);font-weight:600}
@media(max-width:760px){.tour .caps .r{grid-template-columns:30px 1fr 1fr 40px;font-size:11px}
                        .tour .caps .r span:nth-child(2){display:none}}


@media(max-width:760px){
  .tour svg.top{height:46%}
  .tour .panel,.tour .caps{bottom:58px;left:12px;right:12px}
  .tour .boot{font-size:11px}
  .tour .cons{font-size:11px;padding:40px 12px 42px}
  .tour .scs{font-size:12.5px;left:12px;right:12px}
  .tour .sct{left:12px}
  .tour .toast{right:12px}
}


.tour .end{position:absolute;inset:0;display:grid;place-content:center;gap:16px;
    text-align:center;padding:30px 24px;
    background:radial-gradient(620px 300px at 50% 0,var(--tint-accent),transparent 70%)}
.tour .end h3{margin:0;font:700 clamp(21px,3.2vw,30px)/1.15 var(--sans);
              letter-spacing:-.8px;color:var(--ink)}
.tour .end h3 em{font-style:normal;color:var(--accent)}
.tour .end p{margin:0 auto;max-width:48ch;font:13.5px/1.7 var(--sans);color:var(--ink2)}
.tour .end .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.tour .end .chips{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;
                  font:600 11px var(--sans);color:var(--ink3)}
.tour .end .chips span{border:1px solid var(--line);border-radius:999px;padding:5px 11px;
                       background:var(--panel)}
.tour .sc.on .end > *{animation:tup .6s ease both;animation-delay:var(--d,0s)}


.tour.paused .sc *{animation-play-state:paused!important}

.tour.still .sc *,.tour.still .tvbar .len::before{animation:none!important}
.tour.still .sc{transition:none}
.tour.still .nd,.tour.still .ifl,.tour.still .toast,.tour.still .boot span,
.tour.still .caps .r,.tour.still .caps .cf,.tour.still .end > *,
.tour.still .pill.ok,.tour.still .cons .cur{opacity:1;transform:none}
.tour.still .ln1,.tour.still .ln2{stroke-dashoffset:0}
.tour.still .cons .l{width:auto}
.tour.still .prog i,.tour.still .chap li.now .bar i{width:100%}
.tour.still .pkt,.tour.still .ring,.tour.still .pill.go,
.tour:not(.ready) .pkt{display:none}
.tour.still .note{display:block}
.tour .note{display:none;margin-left:auto;font:600 11px var(--sans);color:var(--ink4)}