.tour-welcome { border-radius: 24px !important; overflow: hidden; }
.tour-backdrop { position: fixed; inset: 0; z-index: 9999; background: rgb(0 0 0 / 55%); }
/* Normal page fades compound the brightness change during guided navigation. */
body:has(.tour-backdrop) .bv-page-visible { animation: none; opacity: 1; }
.tour-welcome .mud-dialog-title { background: linear-gradient(135deg, var(--mud-palette-primary-hover), var(--mud-palette-surface)); padding: 28px 28px 12px; }
.tour-emblem { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); margin-bottom: 18px; }
.tour-eyebrow { color: var(--mud-palette-primary); font-size: 11px; font-weight: 700; letter-spacing: .12em; margin: 12px 0; }
.tour-intro { line-height: 1.65; margin: 8px 0 16px; }
.tour-meta, .tour-note { font-size: 12px; color: var(--mud-palette-text-secondary); line-height: 1.6; }
.tour-itinerary { counter-reset: stops; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 0; margin: 22px 0; }
.tour-itinerary li { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.tour-itinerary li::before { counter-increment: stops; content: counter(stops); display: grid; place-items: center; flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--mud-palette-primary-hover); color: var(--mud-palette-primary); font-weight: 700; }
.tour-welcome .mud-dialog-actions { padding: 16px 24px 24px; }
/* Outrank GuideFlow's isolated .gf-step rule, whose all: unset resets width. */
.gf-step.workplanflow-tour { box-sizing: border-box; background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); border-radius: 20px; width: min(520px, calc(100vw - 32px)); min-width: 0; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 28px; box-shadow: 0 18px 64px #0005; }
.gf-step.workplanflow-tour .gf-step__title { color: var(--mud-palette-text-primary); font-size: 24px; line-height: 1.3; }
.gf-step.workplanflow-tour .gf-step__body { color: var(--mud-palette-text-primary); font-size: 15px; line-height: 1.7; }
.gf-step.workplanflow-tour .gf-step__footer { display: block; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--mud-palette-divider); }
.gf-step.workplanflow-tour .gf-step__buttons { display: block; }
.tour-tip { padding: 12px 14px; border-left: 3px solid var(--mud-palette-primary); background: var(--mud-palette-primary-hover); border-radius: 6px; margin: 16px 0; font-size: 13px; }
.tour-progress { display: block; width: 100%; height: 4px; accent-color: var(--mud-palette-primary); margin-top: 8px; }
.tour-actions { display: flex; justify-content: flex-end; gap: 12px; }
.tour-actions .mud-button-root { flex-shrink: 0; white-space: nowrap; min-height: 42px; padding-inline: 16px; border-radius: 10px; text-transform: none; }
@media (max-width: 560px) { .gf-step.workplanflow-tour { padding: 20px; } .tour-actions { gap: 6px; } .tour-actions .mud-button-root { padding-inline: 12px; } }
@media (max-width: 420px) { .tour-itinerary { grid-template-columns: 1fr; gap: 8px; } .tour-actions { flex-wrap: wrap; } }

.tour-phases { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.tour-phases button { border: 1px solid var(--mud-palette-lines-default); border-radius: 16px; padding: 5px 9px; background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); font: inherit; font-size: 12px; cursor: pointer; }
.tour-phases button[aria-current="step"] { background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); }
.tour-phases button:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
.tour-more { font-size: 13px; margin: 12px 0; }
.tour-more summary { cursor: pointer; color: var(--mud-palette-primary); }

/* One persistent, viewport-contained guidance panel owned by ProductTour. */
.tour-guidance-card {
   position: fixed;
   z-index: 10000;
   right: 16px;
   bottom: 16px;
   width: min(520px, calc(100vw - 32px));
   max-height: calc(100dvh - 32px);
   overflow-y: auto;
   box-sizing: border-box;
   padding: 24px;
   border-radius: 16px;
   background: var(--mud-palette-surface);
   color: var(--mud-palette-text-primary);
   box-shadow: 0 18px 64px #0005;
}
.tour-guidance-card h2 { font-size: 1.4rem; margin-bottom: 12px; }
.tour-guidance-card p { line-height: 1.6; margin-bottom: 10px; }
.tour-guidance-card footer { position: sticky; bottom: -24px; background: var(--mud-palette-surface); padding: 16px 0 8px; border-top: 1px solid var(--mud-palette-divider); }