/* Geführte Einführung v0.5 – lokal, ohne externe Bibliotheken. */
.tour-launch{display:none;align-items:center;gap:7px;min-height:34px;padding:5px 10px;border:1px solid #e4d9f3;border-radius:8px;background:#faf7ff;color:#654481;font-size:11px;font-weight:600;white-space:nowrap}
.tour-supported .tour-launch{display:inline-flex}
.tour-launch:hover{background:#eee5ff}
.tour-launch .icon{width:17px;height:17px}
html.tour-running,html.tour-running *{scroll-behavior:auto!important}
/* Das native Dialogelement sperrt den Hintergrund für Maus, Touch und Tastatur. */
.portal-tour{position:fixed;inset:0;margin:0;padding:0;width:100%;height:100vh;height:100dvh;max-width:none;max-height:none;border:0;background:transparent;overflow:hidden;color:var(--ink);overscroll-behavior:contain}
.portal-tour:not([open]){display:none}
.portal-tour::backdrop{background:transparent}
.tour-spotlight{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.tour-mask{fill:#0d071bb3}
.tour-ring{stroke:#bb94ff;stroke-width:3;filter:drop-shadow(0 0 4px #995cf580)}
.tour-card{position:absolute;left:16px;top:16px;isolation:isolate;width:390px;max-width:calc(100% - 32px);max-height:calc(100% - 32px);overflow:auto;overscroll-behavior:contain;padding:24px;border-radius:17px;border:1px solid #e6d9fc;background:#fff;box-shadow:0 18px 60px #1207204d;font-size:14px;line-height:1.65;display:flex;flex-direction:column;overflow:hidden}
.tour-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px}
.tour-kicker{display:flex;align-items:center;gap:7px;font-size:9px;font-weight:700;letter-spacing:.11em;color:#765090}
.tour-kicker .icon{width:16px;height:16px;color:var(--purple)}
.tour-close{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border:1px solid #eee8f5;border-radius:8px;background:#f8f5fc;color:#65556f}
.tour-close:hover{background:#ece3f7}
.tour-close .icon{width:16px;height:16px}
.tour-progress-line{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:13px;color:#705a84;font-size:11px;font-weight:600}
.tour-dots{display:flex;gap:5px}
.tour-dots i{display:block;width:7px;height:7px;border-radius:50%;background:#e5dbef}
.tour-dots i.is-current{width:20px;border-radius:6px;background:var(--purple)}
.tour-dots i.is-done{background:#aa7be8}
.tour-card h2{font-size:24px;line-height:1.2;margin:0 0 13px;letter-spacing:-.035em;color:#261932;overflow-wrap:break-word}
.tour-card h2:focus{outline:none}
.tour-copy>p{font-size:13px;line-height:1.75;color:#63566d;margin-bottom:16px}
.tour-card .tour-note{padding:10px 12px;border-left:3px solid #b48cf2;border-radius:0 7px 7px 0;background:#f7f2ff;color:#694c80;font-size:11px;line-height:1.7}
.tour-card .tour-storage-warning{padding:9px 10px;border:1px solid #ecd8ac;border-radius:7px;background:#fff8e9;color:#735322;font-size:11px;line-height:1.5}
.tour-actions{display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.tour-actions .button{min-height:44px;font-size:12px}
.tour-actions .button:disabled{cursor:default;opacity:.4;transform:none}
.tour-actions #tour-next{margin-left:auto}
.tour-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding-top:12px;border-top:1px solid #eee7f5}
.tour-skip{padding:8px 0;border:0;background:transparent;color:#715186;text-decoration:underline;text-underline-offset:3px;font-size:11px;white-space:nowrap}
.tour-skip:hover{color:var(--purple)}
.tour-bottom>span{font-size:9px;color:#867591;text-align:right;max-width:140px;line-height:1.55}
.tour-feedback{position:fixed;right:22px;bottom:22px;z-index:80;max-width:min(410px,calc(100vw - 44px));padding:15px 19px;border:1px solid #dbcaee;border-radius:12px;background:#fff;color:#654079;font-size:12px;box-shadow:0 8px 28px #1b0a2626}
@media(max-width:1100px){.tour-launch>span{display:none}.tour-launch{padding:7px;min-height:34px}.topbar-right{gap:14px}}
@media(max-width:760px){html.tour-running .nav-backdrop{background:transparent}.tour-card{width:360px;padding:21px}.tour-card h2{font-size:23px}.tour-copy>p{font-size:12px}.tour-card .tour-note{font-size:11px}.tour-actions{margin-top:16px}.tour-card-top{margin-bottom:11px}}
@media(max-width:600px){.topbar-right{gap:10px}.topbar-left{min-width:0;flex:1}.breadcrumb{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.topbar{padding-inline:16px}.tour-card{max-width:calc(100% - 24px);padding:19px}.tour-bottom>span{font-size:9px}.tour-actions .button{padding-inline:13px;font-size:11px}.tour-progress-line{margin-bottom:11px}.tour-card h2{font-size:22px}}
@media(max-width:380px){.tour-supported .topbar .account-link>span:last-child{display:none}.tour-card{padding:17px}.tour-card h2{font-size:21px}.tour-kicker{font-size:8px}.tour-card .tour-note{padding:8px 10px}.tour-copy>p{margin-bottom:12px}.tour-actions{margin-top:13px}.tour-bottom{margin-top:10px;padding-top:8px}}
@media(max-height:600px){.tour-card{padding:17px}.tour-card-top{margin-bottom:7px}.tour-progress-line{margin-bottom:8px}.tour-card h2{font-size:21px;margin-bottom:10px}.tour-copy>p{margin-bottom:11px;font-size:12px}.tour-card .tour-note{font-size:10px;padding:7px 9px}.tour-actions{margin-top:13px}.tour-bottom{margin-top:10px;padding-top:8px}}
@media(prefers-reduced-motion:reduce){.portal-tour *,.tour-launch{animation:none!important;transition:none!important}}
@media(forced-colors:active){.tour-card,.tour-feedback{border:2px solid CanvasText}.tour-mask{fill:#000b}.tour-ring{stroke:Highlight;filter:none}.tour-dots i{border:1px solid CanvasText}.tour-dots i.is-current{background:Highlight;forced-color-adjust:none}}

/* Erklärungstext darf bei geringer Höhe scrollen; die Steuerung bleibt erreichbar. */
.tour-copy{min-height:0;overflow-y:auto;overscroll-behavior:contain;flex:0 1 auto}
.tour-card-top,.tour-progress-line,.tour-card>h2,.tour-actions,.tour-bottom{flex-shrink:0}
@media(max-width:760px){html.tour-running .app-content{padding-bottom:100vh}html.tour-running .sidebar::after{content:"";display:block;min-height:100vh;flex-shrink:0}}
@media(max-height:600px) and (min-width:761px){.tour-card{width:280px}.tour-card h2{font-size:20px}.tour-actions .button{font-size:10px;padding-inline:10px}.tour-bottom>span{font-size:8px;max-width:106px}.tour-kicker{font-size:8px}}

@media(max-width:760px) and (min-height:480px){.tour-card{max-height:calc(100% - 140px)}}
@media(max-width:760px) and (max-height:479px){.tour-card{width:260px}.tour-actions .button{font-size:10px;padding-inline:10px}.tour-bottom>span{font-size:8px;max-width:100px}.tour-kicker{font-size:8px}}

.tour-copy:focus-visible{outline:2px solid #a887ff;outline-offset:2px}

@media(max-width:1100px){html.tour-running .app-content{padding-bottom:100vh}}
