/* Interactive tour: spotlight ring (its huge shadow dims the page), four blockers around the hole, a tip with an arrow. */
#tour[hidden]{display:none}
#tour{position:fixed;inset:0;z-index:60;pointer-events:none;overflow:hidden}
#tour .tr-b{position:fixed;pointer-events:auto;background:transparent}
#tour.dim .tr-b:first-child{background:rgba(0,0,0,.6)}
.tr-ring{position:fixed;pointer-events:none;border-radius:14px;box-shadow:0 0 0 100vmax rgba(0,0,0,.6);outline:2px solid var(--accent);outline-offset:0}
.tr-ring::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:2px solid var(--accent);animation:trpulse 1.4s ease-out infinite}
@keyframes trpulse{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.12)}}
.tr-tip{position:fixed;pointer-events:auto;background:var(--paper);color:var(--fg);border:1px solid var(--line);border-radius:16px;padding:14px 16px 12px;box-shadow:0 8px 28px rgba(0,0,0,.35);font-family:var(--ru)}
.tr-tip.mid{left:50%!important;top:50%!important;transform:translate(-50%,-50%)}
.tr-tip b{display:block;font:700 var(--t-l) var(--ru);margin-bottom:4px}
.tr-tip p{margin:0;font:400 var(--t-m)/1.45 var(--ru)}
.tr-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.tr-row:has(.tr-ok){margin-top:14px}
.tr-skip{border:0;background:none;color:var(--muted);font:400 var(--t-s) var(--ru);padding:6px 0}
.tr-ok{border:0;background:var(--accent);color:#fff;border-radius:var(--r);padding:10px 20px;font:700 var(--t-m) var(--ru)}
.tr-arw{position:absolute;width:14px;height:14px;background:var(--paper);border:1px solid var(--line);transform:translateX(-50%) rotate(45deg);animation:trbob 1s ease-in-out infinite}
.tr-tip.up .tr-arw{top:-8px;border-right:0;border-bottom:0}
.tr-tip.dn .tr-arw{bottom:-8px;border-left:0;border-top:0;animation-name:trbobd}
.tr-tip.mid .tr-arw{display:none}
@keyframes trbob{50%{margin-top:-4px}}
@keyframes trbobd{50%{margin-bottom:-4px}}
.tr-tip.mid{width:min(calc(100vw - 24px),340px)}
.tr-l{display:flex;gap:16px}
.tr-n{display:block;color:var(--muted);font:700 var(--t-s) var(--ru);margin-bottom:4px}
.tr-tip.plain .tr-arw{display:none}
