/* Guided tour card (/app?tour=1). Sits above page content and below the top bar's drawers and menus (38-40). */
.tour{position:fixed;right:clamp(16px,3vw,32px);bottom:calc(clamp(16px,3vw,32px) + env(safe-area-inset-bottom,0px));z-index:35;width:min(360px,calc(100vw - 32px));background:var(--panel);color:var(--ink);border:1px solid var(--hair);border-radius:5px;padding:18px 18px 14px;box-shadow:0 20px 60px rgba(30,40,70,.18);font-family:Inter,system-ui,sans-serif;animation:tourIn .2s cubic-bezier(.25,1,.5,1)}
.tour-n{margin:0 0 6px;font-size:12px;font-weight:600;color:var(--acc)}
.tour h2{margin:0 0 6px;font-size:18px;font-weight:700;letter-spacing:-.2px;color:var(--ink)}
.tour-body{margin:0 0 14px;font-size:15px;line-height:1.5;color:var(--ink2)}
.tour-act{display:flex;align-items:center;gap:8px}
.tour-gap{flex:1}
.tour button{font:600 14px Inter,system-ui,sans-serif;border-radius:5px;cursor:pointer;min-height:40px;padding:0 16px;transition:background-color .15s ease-out,color .15s ease-out,border-color .15s ease-out}
.tour-skip{background:none;border:0;padding:0 4px!important;color:var(--mute)}
.tour-skip:hover{color:var(--ink)}
.tour-back{background:var(--panel);border:1px solid var(--navy);color:var(--navy)}
.tour-back:hover{background:var(--soft)}
.tour-next{background:var(--navy);border:1px solid var(--navy);color:var(--panel)}
.tour-next:hover{opacity:.9}
.tour button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.tour-ring{outline:3px solid var(--acc)!important;outline-offset:4px;border-radius:5px;transition:outline-color .2s ease-out}
/* Target on the right half of a wide screen: the card moves to the left side. */
.tour.tour-left{right:auto;left:clamp(16px,3vw,32px)}
@keyframes tourIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.tour{animation:none}.tour button,.tour-ring{transition:none}}