.zt-tour { position: fixed; inset: 0; z-index: 10050; isolation: isolate; color: var(--text-primary, #eeeaf6); }
.zt-tour__shade { position: absolute; background: rgb(6 9 14 / .72); }
.zt-tour__spotlight { position: absolute; pointer-events: none; border: 2px solid var(--accent-primary, #ad91ff); border-radius: 12px; box-shadow: 0 0 0 5px rgb(173 145 255 / .12); }
.zt-tour__card { position: absolute; box-sizing: border-box; overflow-y: auto; padding: 27px; border: 1px solid var(--border-strong, #545261); border-radius: 22px; background: var(--surface-300, #25252e); box-shadow: 0 24px 90px #0009; outline: none; font-family: var(--font-family, system-ui, sans-serif); }
.zt-tour__top, .zt-tour__actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.zt-tour__brand { font-size: 11px; font-weight: 750; letter-spacing: .06em; color: var(--text-secondary, #c3bdcf); }
.zt-tour button { font: inherit; cursor: pointer; border-radius: 10px; min-height: 40px; transition: background-color .15s; }
.zt-tour button:focus-visible { outline: 3px solid var(--accent-primary, #ad91ff); outline-offset: 3px; }
.zt-tour__skip { background: transparent; color: var(--text-secondary, #c3bdcf); border: 0; font-size: 12px !important; padding: 0 4px; }
.zt-tour__chapter { margin: 26px 0 10px; color: var(--accent-primary, #ad91ff); font-size: 11px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.zt-tour__card h2 { margin: 0 0 14px; font-size: clamp(23px, 3vw, 29px); font-weight: 720; line-height: 1.14; letter-spacing: -.025em; color: var(--text-primary, #eeeaf6); }
.zt-tour__card p { font-size: 14px; line-height: 1.65; margin: 0; color: var(--text-primary, #eeeaf6); }
.zt-tour__card .zt-tour__tip { margin-top: 20px; padding: 13px 15px; border-left: 2px solid var(--accent-primary, #ad91ff); background: var(--surface-200, #1c1c24); border-radius: 0 8px 8px 0; font-size: 12px; line-height: 1.6; color: var(--text-secondary, #c3bdcf); }
.zt-tour__progress { font-size: 11px; margin: 23px 0 10px; color: var(--text-secondary, #c3bdcf); }
.zt-tour__dots { display: flex; gap: 5px; margin-bottom: 21px; }
.zt-tour__dots span { height: 3px; flex: 1; border-radius: 3px; background: var(--border-strong, #545261); }
.zt-tour__dots .is-current, .zt-tour__dots .is-done { background: var(--accent-primary, #ad91ff); }
.zt-tour__dots .is-done { opacity: .45; }
.zt-tour__back { border: 1px solid var(--border-strong, #545261); background: transparent; padding: 8px 17px; color: var(--text-primary, #eeeaf6); }
.zt-tour__back:disabled { visibility: hidden; }
.zt-tour__next { border: 0; padding: 11px 19px; background: var(--accent-primary, #ad91ff); color: var(--text-on-accent, #17131f); font-weight: 750 !important; }
.zt-tour__explore { display: block; width: 100%; margin: 12px 0 -4px; border: 0; background: transparent; color: var(--text-secondary, #c3bdcf); font-size: 12px !important; }
.zt-tour [hidden] { display: none !important; }
.zt-tour__art { display: flex; align-items: center; justify-content: center; gap: 7px; height: 70px; margin: 22px 0 0; padding: 14px; border-radius: 14px; background: linear-gradient(115deg, var(--surface-200, #1c1c24), var(--surface-400, #292735)); }
.zt-tour__art i { display: block; width: 8px; height: 22px; border-radius: 8px; background: var(--accent-primary, #ad91ff); opacity: .6; }
.zt-tour__art i:nth-child(3n) { height: 48px; opacity: 1; }
.zt-tour__art i:nth-child(4n) { height: 33px; opacity: .8; }
.zt-tour__art i:nth-child(5n) { height: 60px; opacity: .9; }
.help-tour-replay { margin: 8px 0 22px; padding: 11px 17px; border-radius: 10px; border: 1px solid var(--accent-primary, #ad91ff); background: var(--surface-raised, #25252e); color: var(--text-primary, #eeeaf6); font-weight: 700; cursor: pointer; }
@media (max-width: 679px) { .zt-tour__card { padding: 20px; border-radius: 18px; } .zt-tour__chapter { margin-top: 17px; } .zt-tour__art { height: 45px; } }
@media (prefers-reduced-motion: reduce) { .zt-tour button { transition: none; } }
