/* Guided tour: spotlight + step card. Help tour button styled like Sign out. */
html[data-look] #tourBtn{border-color:transparent;background:transparent;color:inherit}
html[data-look] #tourBtn:hover{background:var(--accent-soft);color:var(--accent)}
html[data-look="b"] #tourBtn:hover{background:rgba(255,255,255,.18);color:#fff}
@media (min-width:900px){
  html[data-look="c"] #tourBtn{justify-content:flex-start;margin-bottom:-10px}
  html[data-look="c"] #tourBtn:hover{background:rgba(255,255,255,.12);color:#fff}
}
@media (max-width:899px){
  html[data-look] header.top #tourBtn{display:none}
  html[data-look] header.top.open #tourBtn{display:inline-flex;order:6}
  html[data-look="c"] #tourBtn:hover{background:rgba(255,255,255,.14);color:#fff}
}

.tour{position:fixed;inset:0;z-index:1000;pointer-events:auto}
.tour-shade{position:absolute;inset:0}
.tour-spot{position:fixed;border-radius:14px;pointer-events:none;
  box-shadow:0 0 0 3px #5eead4,0 0 0 9px rgba(94,234,212,.28),0 0 0 200vmax rgba(8,32,40,.66);
  transition:left .32s ease,top .32s ease,width .32s ease,height .32s ease}
.tour-spot::after{content:"";position:absolute;inset:-3px;border-radius:inherit;border:2px solid #5eead4;animation:tourPulse 1.8s ease-out infinite}
.tour.center .tour-spot::after{display:none}
@keyframes tourPulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}

.tour-card{position:fixed;width:min(360px,calc(100vw - 24px));background:#fff;color:#17313a;border-radius:18px;
  box-shadow:0 18px 50px rgba(8,32,40,.35),0 2px 6px rgba(8,32,40,.15);transition:left .32s ease,top .32s ease;font-size:15px}
.tour.center .tour-card{width:min(420px,calc(100vw - 24px))}
.tour-card.pop{animation:tourPop .28s ease}
@keyframes tourPop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.tour-head{display:flex;align-items:center;gap:12px;padding:16px 16px 12px;border-radius:18px 18px 0 0;
  background:linear-gradient(135deg,#0f8a80,#14b8a6 60%,#2dd4bf);color:#fff}
.tour-head h3{margin:2px 0 0;font-size:18px;line-height:1.25;color:#fff}
.tour-head small{opacity:.85;font-size:12px;letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.tour-head > div{flex:1;min-width:0}
.tour-ic{flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.tour-ic .ic{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tour-x{flex:0 0 auto;align-self:flex-start;width:32px;height:32px;border:0;border-radius:10px;background:rgba(255,255,255,.16);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.tour-x:hover{background:rgba(255,255,255,.3)}
.tour-bar{height:4px;background:#e1f4f1}
.tour-bar i{display:block;height:100%;background:linear-gradient(90deg,#0f8a80,#5eead4);transition:width .3s ease}
.tour-text{padding:14px 16px 6px;line-height:1.55}
.tour-text b{color:#0b6f67}
.tour-tips{margin:0;padding-left:20px;display:grid;gap:6px}
.tour-foot{display:flex;align-items:center;gap:8px;padding:10px 16px 16px}
.tour-sp{flex:1}
.tour-foot .tour-skip{border-color:transparent;background:transparent;color:#64788a}
.tour-foot .tour-skip:hover{color:#0f8a80}
.tour-foot [hidden]{display:none}
.tour-arrow{position:absolute;width:14px;height:14px;background:#fff;transform:rotate(45deg);margin-left:-7px}
.tour-arrow.below{background:#14b8a6}
.tour-arrow.right{margin-left:0;margin-top:-7px;background:#fff}
.tour-arrow[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.tour-spot,.tour-card,.tour-bar i{transition:none}.tour-spot::after,.tour-card.pop{animation:none}}
@media print{.tour{display:none!important}}