/* ═══ GUIDED TOUR ═══ */
    .tour-overlay {
      display: none; position: fixed; inset: 0; z-index: 10000;
      overflow: hidden;
    }
    .tour-overlay.active { display: block; }
    .tour-backdrop {
      position: fixed; inset: 0;
      background: rgba(0,0,0,-0.18);
      transition: opacity 300ms;
    }
    /* ── SPOTLIGHT — bordo spesso + glow pulsante ── */
    .tour-spotlight {
      position: fixed; border-radius: 14px;
      box-shadow:
        0 0 0 4px rgba(145,70,255,0.9),
        0 0 0 8px rgba(145,70,255,0.35),
        0 0 30px 8px rgba(145,70,255,0.4),
        0 0 0 9999px rgba(0,0,0,0.82);
      transition: all 350ms cubic-bezier(0.4,0,0.2,1);
      pointer-events: none;
      z-index: 10001;
      animation: tourPulse 2s ease-in-out infinite;
    }
    @keyframes tourPulse {
      0%, 100% { box-shadow: 0 0 0 4px rgba(145,70,255,0.9), 0 0 0 8px rgba(145,70,255,0.35), 0 0 30px 8px rgba(145,70,255,0.4), 0 0 0 9999px rgba(0,0,0,0.82); }
      50% { box-shadow: 0 0 0 5px rgba(145,70,255,1), 0 0 0 12px rgba(145,70,255,0.5), 0 0 50px 14px rgba(145,70,255,0.55), 0 0 0 9999px rgba(0,0,0,0.82); }
    }
    .tour-tooltip {
      position: fixed; z-index: 10002;
      box-sizing: border-box;
      background: rgba(22,8,40,0.97);
      border: 1px solid rgba(145,70,255,0.4);
      border-radius: 16px;
      padding: 20px 20px 16px;
      width: calc(100vw - 32px); max-width: 340px;
      box-shadow: 0 8px 40px rgba(0,0,0,0.7), 0 0 30px rgba(145,70,255,0.12);
      backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
      animation: fadeInUp 300ms ease both;
      color: #fff; font-family: 'Red Hat Display', sans-serif;
    }
    .tour-tooltip-title {
      font-size: 16px; font-weight: 800; color: #c8aaff;
      margin-bottom: 8px; display: flex; align-items: center; gap: 8px;
    }
    .tour-tooltip-title i { font-size: 18px; opacity: 0.8; }
    .tour-tooltip-text {
      font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,0.85);
      margin-bottom: 16px;
    }
    .tour-tooltip-footer {
      display: flex; align-items: center; gap: 6px;
    }
    .tour-dots { display: flex; gap: 5px; flex: 1; }
    .tour-dot {
      width: 7px; height: 7px; border-radius: 50%;
      background: rgba(255,255,255,0.15); transition: all 250ms;
    }
    .tour-dot.active { background: rgba(145,70,255,0.8); transform: scale(1.4); }
    .tour-dot.done { background: rgba(145,70,255,0.35); }
    .tour-btn {
      padding: 10px 20px; border-radius: 22px;
      font-size: 13px; font-weight: 700; cursor: pointer;
      font-family: inherit; border: none; transition: all 150ms;
      -webkit-tap-highlight-color: transparent;
      min-height: 44px; display: inline-flex; align-items: center;
    }
    .tour-btn:active { transform: scale(0.96); }
    .tour-btn:hover { transform: none !important; }
    .tour-btn-skip { background: transparent; color: rgba(255,255,255,0.45); padding: 10px 12px; }
    .tour-btn-skip:hover { color: rgba(255,255,255,0.7); }
    .tour-btn-prev { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.7); }
    .tour-btn-prev:hover { background: rgba(255,255,255,0.15); }
    .tour-btn-next { background: rgba(145,70,255,0.55); color: #fff; padding: 10px 24px; }
    .tour-btn-next:hover { background: rgba(145,70,255,0.7); transform: scale(1.2) !important; }
    .tour-tooltip.tour-centered {
      top: 16px !important; left: 16px !important;
      right: 16px !important; bottom: 16px !important;
      width: auto !important; max-width: 360px;
      margin: auto; /* centra con inset + auto */
      height: fit-content; max-height: calc(100vh - 32px);
      overflow-y: auto; -webkit-overflow-scrolling: touch;
      text-align: center; padding: 32px 24px 22px;
      transform: none;
    }
    .tour-tooltip.tour-centered .tour-tooltip-title { justify-content: center; font-size: 18px; }
    .tour-tooltip.tour-centered .tour-tooltip-text { font-size: 14px; }
    .tour-tooltip.tour-centered .tour-tooltip-footer { justify-content: center; }
    .tour-welcome-logo {
      width: 64px; height: 64px; border-radius: 50%;
      margin: 0 auto 12px; display: block;
      box-shadow: 0 4px 20px rgba(145,70,255,0.3);
    }
    .tour-help-btn, .sidebar-tour-btn {
      display: flex; align-items: center; gap: 10px;
      width: calc(100% - 40px); margin: 4px 20px;
      padding: 12px 18px; border-radius: 12px;
      background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
      color: rgba(255,255,255,0.5); font-size: 13px; font-weight: 600;
      font-family: 'Red Hat Display', sans-serif;
      cursor: pointer; transition: all 200ms;
      -webkit-tap-highlight-color: transparent;
    }
    .sidebar-tour-btn:hover { background: rgba(255,255,255,0.08); color: #fff; border-color: rgba(255,255,255,0.2); transform: none !important; }
    .sidebar-tour-btn i { font-size: 16px; width: 24px; text-align: center; color: rgba(145,70,255,0.5); }

  

#pwa-install-banner{position:fixed;bottom:calc(56px + env(safe-area-inset-bottom,0px));left:40%;transform:translateX(-50%);background:rgba(20,20,20,0.97);border:1px solid rgba(255,255,255,0.15);border-radius:12px;padding:10px 16px;display:flex;align-items:center;gap:12px;color:#fff;font-size:13px;font-family:'Red Hat Display',sans-serif;z-index:9999;white-space:nowrap;box-shadow:0 4px 24px rgba(0,0,0,0.6);animation:fadeInUp 400ms ease both;}
#pwa-install-btn{background:#b41e1e;color:#fff;border:none;border-radius:8px;padding:6px 14px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;transition:background 150ms;}
#pwa-install-btn:hover{background:#d42222;transform:none;}
#pwa-dismiss-btn{background:transparent;color:rgba(255,255,255,0.5);border:none;font-size:16px;cursor:pointer;padding:0 4px;transition:color 150ms;}
#pwa-dismiss-btn:hover{color:#fff;transform:none;}
