.ts-demo-guide {
    margin: 24px 0;
    padding: 22px;
    border: 1px solid #16330026;
    border-radius: 20px;
    background: #f7f4ef;
}
.ts-demo-guide h3 { margin: 0 0 12px; font-size: 22px; line-height: 1.3; }
.ts-demo-guide p { font-size: 14px; }
.ts-demo-guide__progress { margin: 0 0 12px; font-size: 11px !important; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.ts-demo-guide__options { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.ts-demo-guide button {
    border: 1px solid #16330040;
    border-radius: 24px;
    padding: 10px 16px;
    color: #163300;
    background: #fff;
    font-size: 14px;
}
.ts-demo-guide button:hover:not(:disabled) { background: #d7f7c8; border-color: #163300; }
.ts-demo-guide button:focus-visible { outline: 3px solid #79a469; outline-offset: 3px; }
.ts-demo-guide ul { padding-left: 18px; font-size: 14px; }
.ts-demo-guide [data-guide-total] { display: block; border-top: 1px solid #16330026; padding-top: 14px; }
.ts-demo-guide [data-guide-error] { color: #9a3020; }
.ts-demo-guide [data-guide-error]:empty { display: none; }
@media (max-width: 500px) {
    .ts-demo-guide { padding: 18px; }
    .ts-demo-guide__options { flex-direction: column; }
}
