.bet852-demo { width: min(100%, 1500px); margin-inline: auto; }
.bet852-demo__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .7rem; }
.bet852-demo__status { margin: 0; color: #aab8c7; font-size: .86rem; }
.bet852-demo__actions { display: flex; gap: .5rem; flex: 0 0 auto; }
.bet852-demo__actions button { min-height: 40px; padding: .45rem .8rem; border: 1px solid rgba(216,181,106,.42); border-radius: 8px; background: #10253f; color: #f7f1e5; cursor: pointer; }
.bet852-demo__actions button:hover { border-color: #d8b56a; }
.bet852-demo__frame-wrap { position: relative; min-height: clamp(620px, 78vh, 920px); overflow: hidden; border: 1px solid rgba(216,181,106,.35); border-radius: 16px; background: #02060c; box-shadow: 0 24px 70px rgba(0,0,0,.34); }
.bet852-demo__frame { display: block; width: 100%; height: clamp(620px, 78vh, 920px); border: 0; background: #02060c; }
.bet852-demo__loading { display: none; position: absolute; z-index: 2; inset: 0; place-items: center; pointer-events: none; background: rgba(2,6,12,.58); }
.is-loading .bet852-demo__loading { display: grid; }
.bet852-demo__loading span { width: 48px; height: 48px; border: 4px solid rgba(216,181,106,.25); border-top-color: #d8b56a; border-radius: 50%; animation: bet852-spin .8s linear infinite; }
.bet852-demo__frame-wrap:fullscreen, .bet852-demo__frame-wrap:fullscreen .bet852-demo__frame { width: 100vw; height: 100vh; min-height: 100vh; border: 0; border-radius: 0; }
@keyframes bet852-spin { to { transform: rotate(360deg); } }
@media (max-width: 782px) {
	.bet852-demo__toolbar { align-items: stretch; flex-direction: column; }
	.bet852-demo__actions button { flex: 1; }
	.bet852-demo__frame-wrap, .bet852-demo__frame { min-height: 72vh; height: max(640px, 72vh); border-radius: 10px; }
}
@media (prefers-reduced-motion: reduce) { .bet852-demo__loading span { animation-duration: 2s; } }
