/* =========================================================================
   tour.css — Fase 5 · Tour Guiado. Depende de design-system.css.
   ========================================================================= */
.tour-overlay {
  position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px;
  background: rgba(4,9,18,.8); backdrop-filter: blur(8px);
  animation: tourIn .3s var(--ease);
}
@keyframes tourIn { from{opacity:0} to{opacity:1} }

.tour-card {
  position: relative; width: min(560px, 96vw); text-align: center;
  background: radial-gradient(90% 120% at 50% 0%, rgba(0,112,184,.16), transparent 55%), var(--bg-800);
  border: 1px solid var(--stroke); border-radius: var(--radius-lg); box-shadow: var(--shadow-2);
  padding: 38px 32px 28px;
}
.tour-close { position:absolute; top:14px; right:16px; background:none; border:0; color:var(--text-dim); font-size:1.6rem; cursor:pointer; }
.tour-prog-track { position:absolute; top:0; left:0; right:0; height:4px; background:rgba(255,255,255,.08); border-radius:4px 4px 0 0; overflow:hidden; }
.tour-prog-track i { display:block; height:100%; background:var(--grad-plan-act); transition:width .4s var(--ease); }
.tour-ic { font-size:3.4rem; margin-bottom:.4rem; animation:tourpulse 2.4s infinite; }
@keyframes tourpulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.08)} }
.tour-stepn { color:var(--text-dim); font-size:.74rem; letter-spacing:.18em; }
.tour-card h2 { font-size:1.6rem; margin:.4rem 0 .6rem; }
.tour-card p { color:var(--text-soft); font-size:1rem; line-height:1.6; max-width:42ch; margin:0 auto 1.4rem; }
.tour-card #tour-link { margin-bottom:1.4rem; }
.tour-nav { display:flex; align-items:center; justify-content:center; gap:1rem; }
.tour-skip { background:none; border:0; color:var(--text-dim); cursor:pointer; font-size:.82rem; text-decoration:underline; }
.tour-nav .btn-x:disabled { opacity:.4; cursor:not-allowed; }