/* Standalone tutorial; the host owns font loading. Every selector is scoped. */
.bonus-tutorial{--bonus-tutorial-ink:#181917;--bonus-tutorial-muted:#626760;--bonus-tutorial-line:#d9dcd5;--bonus-tutorial-wash:#f4f5f1;--bonus-tutorial-progress:0;max-width:980px;margin:0 auto;color:var(--bonus-tutorial-ink);font-family:Jakarta,'Plus Jakarta Sans',Arial,sans-serif;line-height:1.5;color-scheme:light}
.bonus-tutorial *,.bonus-tutorial *::before,.bonus-tutorial *::after{box-sizing:border-box}
.bonus-tutorial [hidden]{display:none!important}
.bonus-tutorial button{appearance:none;min-height:44px;border:1px solid var(--bonus-tutorial-line);border-radius:0;padding:10px 14px;background:#fff;color:var(--bonus-tutorial-ink);font:inherit;font-size:14px;line-height:1.4;cursor:pointer}
.bonus-tutorial button:hover:not(:disabled){border-color:var(--bonus-tutorial-ink);background:var(--bonus-tutorial-wash)}
.bonus-tutorial button:disabled{opacity:.4;cursor:default}
.bonus-tutorial button:focus-visible{outline:3px solid var(--bonus-tutorial-ink);outline-offset:4px}
.bonus-tutorial .bonus-tutorial__eyebrow{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:1.4px}
.bonus-tutorial .bonus-tutorial__heading h2{margin:0 0 12px;font-family:Fraunces,Georgia,serif;font-size:clamp(35px,5vw,54px);font-weight:500;letter-spacing:-1.4px;line-height:1.1}
.bonus-tutorial .bonus-tutorial__heading>p:last-child{margin:0 0 25px;font-size:16px;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__stage{border:1px solid var(--bonus-tutorial-line);background:#fff;overflow:hidden}
.bonus-tutorial .bonus-tutorial__stage-label{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 24px;border-bottom:1px solid var(--bonus-tutorial-line);font-size:12px;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__stage-label>span:first-child{font-weight:700;letter-spacing:1.2px}
.bonus-tutorial .bonus-tutorial__stage-label>span:last-child{white-space:nowrap}
.bonus-tutorial .bonus-tutorial__board{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:34px;align-items:center;min-height:326px;padding:28px 34px}
.bonus-tutorial .bonus-tutorial__house{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;min-width:0}
.bonus-tutorial .bonus-tutorial__drawing{display:block;width:100%;max-width:230px;max-height:160px;fill:none;stroke:var(--bonus-tutorial-ink);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.bonus-tutorial .bonus-tutorial__drawing>path:last-child{stroke:var(--bonus-tutorial-line)}
.bonus-tutorial .bonus-tutorial__house>strong{font-size:16px;font-weight:650}
.bonus-tutorial .bonus-tutorial__house>span{font-size:14px;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__example{min-width:0;text-align:center}
.bonus-tutorial .bonus-tutorial__price{padding:16px;border:1px solid var(--bonus-tutorial-line);background:var(--bonus-tutorial-wash)}
.bonus-tutorial .bonus-tutorial__price>span{display:block;font-size:12px;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__price>strong{display:block;margin-top:6px;font-family:Fraunces,Georgia,serif;font-size:clamp(27px,3.8vw,38px);line-height:1.25;font-weight:500;overflow-wrap:anywhere}
.bonus-tutorial .bonus-tutorial__hint{margin:17px 0 9px;font-family:Fraunces,Georgia,serif;font-size:26px;line-height:1.25}
.bonus-tutorial .bonus-tutorial__detail{margin:0;font-size:14px;line-height:1.5;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__caption{display:flex;align-items:center;justify-content:center;min-height:98px;margin:0;padding:18px 24px;border-top:1px solid var(--bonus-tutorial-line);background:var(--bonus-tutorial-wash);font-family:Fraunces,Georgia,serif;font-size:20px;line-height:1.45;text-align:center}
.bonus-tutorial .bonus-tutorial__segments{display:flex;gap:5px;height:4px;background:#fff}
.bonus-tutorial .bonus-tutorial__segments>span{flex:1;background:var(--bonus-tutorial-line)}
.bonus-tutorial .bonus-tutorial__segments>span.is-done{background:#8c9189}
.bonus-tutorial .bonus-tutorial__segments>span.is-current{background:var(--bonus-tutorial-ink)}
.bonus-tutorial .bonus-tutorial__progress{height:2px;margin-top:4px;background:var(--bonus-tutorial-wash)}
.bonus-tutorial .bonus-tutorial__progress>span{display:block;width:100%;height:100%;transform:scaleX(var(--bonus-tutorial-progress));transform-origin:left;background:var(--bonus-tutorial-ink)}
.bonus-tutorial .bonus-tutorial__controls{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:19px}
.bonus-tutorial .bonus-tutorial__playback{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bonus-tutorial button.bonus-tutorial__primary{min-width:112px;border-color:var(--bonus-tutorial-ink);background:var(--bonus-tutorial-ink);color:#fff;font-weight:650}
.bonus-tutorial button.bonus-tutorial__primary:hover{background:#343b33}
.bonus-tutorial button.bonus-tutorial__back{border-color:var(--bonus-tutorial-ink);min-height:46px;padding:12px 17px;font-weight:650}
.bonus-tutorial .bonus-tutorial__foot{display:flex;justify-content:space-between;gap:18px;margin-top:13px}
.bonus-tutorial .bonus-tutorial__foot>p{margin:0;font-size:12px;line-height:1.6;color:var(--bonus-tutorial-muted)}
.bonus-tutorial .bonus-tutorial__foot>p:last-child{text-align:right}
@media(max-width:700px){.bonus-tutorial .bonus-tutorial__heading h2{letter-spacing:-1px}.bonus-tutorial .bonus-tutorial__heading>p:last-child{font-size:14px;margin-bottom:20px}.bonus-tutorial .bonus-tutorial__stage-label{padding:14px 15px}.bonus-tutorial .bonus-tutorial__stage-label>span:first-child{letter-spacing:.65px}.bonus-tutorial .bonus-tutorial__board{gap:18px;padding:22px 18px;min-height:300px}.bonus-tutorial .bonus-tutorial__drawing{max-height:112px}.bonus-tutorial .bonus-tutorial__house>span{font-size:12px}.bonus-tutorial .bonus-tutorial__caption{min-height:112px;padding:16px;font-size:19px}.bonus-tutorial .bonus-tutorial__controls{align-items:stretch;gap:13px}.bonus-tutorial .bonus-tutorial__playback{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.bonus-tutorial button{padding:10px 7px}.bonus-tutorial button.bonus-tutorial__primary{min-width:0}.bonus-tutorial button.bonus-tutorial__back{width:100%;min-height:48px}.bonus-tutorial[data-reduced-motion="true"] .bonus-tutorial__playback{grid-template-columns:repeat(3,minmax(0,1fr))}.bonus-tutorial .bonus-tutorial__foot{display:block}.bonus-tutorial .bonus-tutorial__foot>p:last-child{text-align:left;margin-top:5px}}
@media(max-width:430px){.bonus-tutorial .bonus-tutorial__board{grid-template-columns:1fr;gap:19px;padding:19px 13px}.bonus-tutorial .bonus-tutorial__house{display:grid;grid-template-columns:85px minmax(0,1fr);text-align:left;gap:0 12px;justify-content:start;align-items:center}.bonus-tutorial .bonus-tutorial__drawing{grid-row:1/3;width:85px;height:66px}.bonus-tutorial .bonus-tutorial__house>strong{align-self:end}.bonus-tutorial .bonus-tutorial__house>span{align-self:start}.bonus-tutorial .bonus-tutorial__price{padding:12px}.bonus-tutorial .bonus-tutorial__price>strong{font-size:30px}.bonus-tutorial .bonus-tutorial__hint{font-size:24px}.bonus-tutorial .bonus-tutorial__caption{font-size:18px;min-height:132px}.bonus-tutorial .bonus-tutorial__playback{grid-template-columns:repeat(2,minmax(0,1fr))}.bonus-tutorial .bonus-tutorial__stage-label{padding:13px 12px}}
@media(prefers-reduced-motion:reduce){.bonus-tutorial *,.bonus-tutorial *::before,.bonus-tutorial *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.bonus-tutorial .bonus-tutorial__progress{display:none}}
