.bq-tutorial-layer[hidden]{display:none!important}
.bq-tutorial-open{overflow:hidden}
.bq-tutorial-layer{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:rgba(28,38,32,.58);backdrop-filter:blur(8px)}
.bq-tutorial-dialog{width:min(760px,100%);max-height:min(760px,calc(100dvh - 32px));overflow:auto;border:1px solid rgba(61,85,71,.16);border-radius:24px;background:#f8faf6;box-shadow:0 24px 70px rgba(26,39,31,.28);color:#263c31}
.bq-tutorial-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid rgba(61,85,71,.12);background:rgba(248,250,246,.94);backdrop-filter:blur(10px)}
.bq-tutorial-header>div{display:flex;align-items:center;gap:8px}.bq-tutorial-header>div>span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#e8f1e9}.bq-tutorial-close{border:0;background:transparent;color:#52675c;font:inherit;font-weight:700;cursor:pointer;padding:8px 10px;border-radius:10px}.bq-tutorial-close:hover,.bq-tutorial-close:focus-visible{background:#edf2ed;outline:none}
.bq-tutorial-stage{display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;padding:24px}
.bq-tutorial-trainer{align-self:start;display:grid;justify-items:center;gap:7px;text-align:center;padding:14px 10px 16px;border-radius:20px;background:linear-gradient(180deg,#edf5ee,#f7faf6);border:1px solid rgba(61,85,71,.1);overflow:hidden}
.bq-tutorial-trainer-visual{display:block;width:200px;height:200px;max-width:100%;background-image:url('../../assets/tutorial-trainer-sprite.webp');background-size:400% 200%;background-repeat:no-repeat;filter:drop-shadow(0 8px 14px rgba(0,0,0,.18));animation:bqTutorialTrainerBob 3s ease-in-out infinite}
.bq-tutorial-trainer-welcome{background-position:0 0}.bq-tutorial-trainer-right{background-position:33.333% 0}.bq-tutorial-trainer-left{background-position:66.666% 0}.bq-tutorial-trainer-up{background-position:100% 0}.bq-tutorial-trainer-down{background-position:0 100%}.bq-tutorial-trainer-thumbs{background-position:33.333% 100%}.bq-tutorial-trainer-surprise{background-position:66.666% 100%}.bq-tutorial-trainer-thoughtful{background-position:100% 100%}
@keyframes bqTutorialTrainerBob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}
.bq-tutorial-trainer b{font-size:14px}.bq-tutorial-trainer small{font-size:12px;color:#6b7c72}
.bq-tutorial-card{min-width:0;padding:4px 0}.bq-tutorial-card h1{margin:.25rem 0 .7rem;font-size:clamp(25px,4vw,38px);line-height:1.08}.bq-tutorial-card>p:not(.bq-eyebrow){font-size:16px;line-height:1.6;color:#4d6257}.bq-tutorial-try{margin-top:12px}
.bq-tutorial-footer{position:sticky;bottom:0;z-index:2;display:grid;gap:12px;padding:14px 18px 18px;border-top:1px solid rgba(61,85,71,.12);background:rgba(248,250,246,.96);backdrop-filter:blur(10px)}
.bq-tutorial-progress{display:flex;justify-content:center;gap:6px}.bq-tutorial-progress i{display:block;width:22px;height:4px;border-radius:999px;background:#d9e1da}.bq-tutorial-progress i.is-on{background:#52735f}.bq-tutorial-actions{display:flex;justify-content:space-between;gap:12px}.bq-tutorial-actions button{min-width:112px}
.bq-home-tutorial{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;text-align:left;width:100%}.bq-home-tutorial .bq-home-tutorial-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#edf5ee;font-size:18px}.bq-home-tutorial span:nth-child(2){display:grid;gap:2px}.bq-home-tutorial small{font-size:12px;font-weight:500;color:#6a7b71}.bq-home-tutorial .bq-home-tutorial-arrow{font-size:22px;color:#788b80}
@media(max-width:560px){.bq-tutorial-layer{padding:0}.bq-tutorial-dialog{width:100%;height:100dvh;max-height:none;border:0;border-radius:0}.bq-tutorial-stage{grid-template-columns:1fr;gap:14px;padding:18px}.bq-tutorial-trainer{grid-template-columns:122px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;justify-items:start;text-align:left;padding:12px}.bq-tutorial-trainer-visual{grid-row:1/3;width:122px;height:122px}.bq-tutorial-card h1{font-size:27px}.bq-tutorial-card>p:not(.bq-eyebrow){font-size:15px}.bq-tutorial-actions button{min-width:0;flex:1}.bq-tutorial-header,.bq-tutorial-footer{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}}
@media(prefers-reduced-motion:reduce){.bq-tutorial-layer,.bq-tutorial-dialog,*[class^="bq-tutorial"]{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
