.tutorial-layer{position:fixed;inset:0;z-index:9000;pointer-events:none;font-family:Arial,sans-serif}
.tutorial-layer[hidden]{display:none}
.tutorial-shade{position:fixed;background:#020604c7;backdrop-filter:blur(2px);pointer-events:auto;touch-action:none}
.tutorial-focus{position:fixed;border:2px solid #e2c477;border-radius:12px;box-shadow:0 0 0 3px #e2c47722,0 0 28px #e2c47780;pointer-events:none;animation:tutorial-pulse 1.5s ease-in-out infinite}
.tutorial-target{outline:none!important;pointer-events:auto!important}
.tutorial-tip{position:fixed;box-sizing:border-box;width:min(360px,calc(100vw - 24px));padding:20px 22px 18px;border:1px solid #d9bd7880;border-radius:12px;background:linear-gradient(145deg,#183126,#0b1812);box-shadow:0 18px 55px #000c;color:#f1ecd9;pointer-events:auto}
.tutorial-tip:after{content:'';position:absolute;left:calc(50% - 7px);width:14px;height:14px;background:#12271e;border:solid #d9bd7880;transform:rotate(45deg)}
.tutorial-tip[data-side=below]:after{top:-8px;border-width:1px 0 0 1px}
.tutorial-tip[data-side=above]:after{bottom:-8px;border-width:0 1px 1px 0}
.tutorial-tip[data-side=waiting]:after{display:none}
.tutorial-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:13px}
.tutorial-progress{font-size:9px;letter-spacing:1.8px;text-transform:uppercase;color:#d7bc78}
.tutorial-skip{min-height:30px;padding:4px 7px;border:0;background:transparent;color:#aebba9;font:9px Arial;text-transform:uppercase;letter-spacing:1px}
.tutorial-skip:hover,.tutorial-skip:focus-visible{color:#fff}
.tutorial-next{display:block;width:100%;min-height:40px;margin-top:15px;padding:9px 14px;border:1px solid #d7bc7880;border-radius:6px;background:linear-gradient(180deg,#d9c080,#a98a4d);color:#132019;font:10px Arial;text-transform:uppercase;letter-spacing:1.3px}
.tutorial-next[hidden]{display:none}
.tutorial-tip h2{margin:0 0 8px;font:24px/1.12 Georgia,serif;color:#f0d99d}
.tutorial-tip p{margin:0;color:#c7d0c1;font:12px/1.55 Arial}
.tutorial-action{display:block;margin-top:13px;color:#e1c478;font-size:9px;letter-spacing:1.3px;text-transform:uppercase}
.tutorial-active .topbar button:not(.tutorial-target),.tutorial-active footer button:not(.tutorial-target){filter:saturate(.35)}
.tutorial-layer.is-guided{pointer-events:none}
.tutorial-layer.is-guided .tutorial-tip{top:84px;right:18px;left:auto;width:min(320px,calc(100vw - 28px));padding:15px 17px 14px;background:linear-gradient(145deg,#183126f7,#0b1812fa);pointer-events:auto}
.tutorial-layer.is-guided .tutorial-tip:after{display:none}
.tutorial-layer.is-guided .tutorial-skip{display:none}
.tutorial-layer.is-guided .tutorial-progress{color:#9fac98}
.tutorial-layer.is-guided .tutorial-action{padding-top:10px;border-top:1px solid #d9bd7828}
body.tutorial-guided #pause,body.tutorial-guided #help,body.tutorial-guided #modes,body.tutorial-guided #history,body.tutorial-guided #debug-skip{pointer-events:none;opacity:.28}
@keyframes tutorial-pulse{50%{box-shadow:0 0 0 6px #e2c47714,0 0 38px #e2c477a0}}
@media(max-width:580px){.tutorial-tip{padding:16px 18px}.tutorial-tip h2{font-size:21px}.tutorial-tip p{font-size:11px}.tutorial-focus{border-radius:9px}.tutorial-layer.is-guided .tutorial-tip{top:70px;right:10px;width:calc(100vw - 20px);padding:13px 15px}.tutorial-layer.is-guided .tutorial-tip h2{font-size:19px}.tutorial-layer.is-guided .tutorial-tip p{font-size:10px;line-height:1.45}.tutorial-layer.is-guided .tutorial-meta{margin-bottom:7px}.tutorial-layer.is-guided .tutorial-action{margin-top:8px;padding-top:7px}.tutorial-layer.is-guided .tutorial-next{margin-top:10px;min-height:36px}}
@media(prefers-reduced-motion:reduce){.tutorial-focus{animation:none}}
@media(max-width:760px),(max-height:580px),(pointer:coarse){.tutorial-shade{backdrop-filter:none}.tutorial-focus{animation:none}}