/* AutoPrompter Demo online */
#demoWatermark {
	position: fixed; inset: 0; z-index: 99990; pointer-events: none;
	display: flex; align-items: center; justify-content: center;
	font: 700 18vw/1 Arial, sans-serif; letter-spacing: .08em;
	color: rgba(255, 255, 255, .07); user-select: none;
}
#demoBar {
	position: fixed; left: 50%; top: 12px; transform: translateX(-50%); z-index: 99995;
	display: flex; align-items: center; gap: 14px; max-width: calc(100vw - 24px);
	padding: 8px 8px 8px 14px; border: 1px solid #ffffff26; border-radius: 4px;
	background: rgba(18, 19, 22, .92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
	font: 500 12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; color: #f2f1eecc;
}
#demoBar b { color: #fff; font-weight: 700; }
#demoBar a { color: #fff; text-decoration: none; white-space: nowrap; }
.demo-keys { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.demo-cta { background: #2d81ff; padding: 7px 12px; border-radius: 2px; text-transform: uppercase; letter-spacing: .1em; font-size: 11px; font-weight: 700; }
.demo-close { background: none; border: 0; color: #f2f1ee99; font-size: 18px; cursor: pointer; padding: 0 6px; }
#demoToast {
	position: fixed; left: 50%; top: 66px; transform: translate(-50%, -10px); z-index: 99996;
	padding: 10px 16px; background: #2d81ff; color: #fff; border-radius: 3px;
	font: 600 13px/1.3 system-ui, sans-serif; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
}
#demoToast.show { opacity: 1; transform: translate(-50%, 0); }
.demo-locked { opacity: .3 !important; cursor: not-allowed !important; }
@media (max-width: 720px) { .demo-keys { display: none; } }