.usm-tokenizer-overlay {
	position: fixed;
	inset: 0;
	z-index: 170;
	display: grid;
	place-items: center;
	padding: 22px;
	pointer-events: none;
	opacity: 0;
	transition: opacity .24s ease;
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app .usm-tokenizer-overlay {
	position: absolute;
}

.usm-tokenizer-overlay.is-open {
	opacity: 1;
	pointer-events: auto;
}

.usm-tokenizer-backdrop {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 50% 36%, rgba(250, 204, 21, .20), transparent 30%),
		radial-gradient(circle at 24% 20%, rgba(14, 165, 233, .20), transparent 34%),
		radial-gradient(circle at 76% 72%, rgba(239, 68, 68, .19), transparent 34%),
		rgba(2, 6, 23, .82);
	backdrop-filter: blur(7px) saturate(1.28);
}

.usm-tokenizer-card {
	position: relative;
	width: min(680px, calc(100vw - 26px));
	max-height: min(94vh, 820px);
	overflow: auto;
	border: 1px solid rgba(253, 224, 71, .34);
	border-radius: 30px;
	padding: 28px;
	text-align: center;
	color: #f8fafc;
	background:
		linear-gradient(145deg, rgba(15, 23, 42, .96), rgba(17, 24, 39, .94)),
		radial-gradient(circle at top, rgba(250, 204, 21, .14), transparent 45%);
	box-shadow: 0 28px 90px rgba(0, 0, 0, .68), 0 0 0 8px rgba(250, 204, 21, .06), inset 0 1px 0 rgba(255,255,255,.12);
	transform: translateY(18px) scale(.96);
	transition: transform .28s cubic-bezier(.2, .9, .25, 1.2);
}

.usm-tokenizer-overlay.is-open .usm-tokenizer-card {
	transform: translateY(0) scale(1);
}

.usm-tokenizer-card:before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(120deg, rgba(34, 211, 238, .66), rgba(250, 204, 21, .92), rgba(244, 63, 94, .64), rgba(34, 211, 238, .52));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
}

.usm-tokenizer-topline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding: 5px 12px;
	border: 1px solid rgba(34, 211, 238, .34);
	border-radius: 999px;
	background: rgba(8, 47, 73, .42);
	color: #a5f3fc;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.usm-tokenizer-title {
	margin: 12px 0 8px;
	font-size: clamp(32px, 7vw, 64px);
	line-height: .9;
	font-weight: 1000;
	letter-spacing: .035em;
	text-transform: uppercase;
	color: #fef08a;
	text-shadow: 0 0 22px rgba(250, 204, 21, .42), 0 4px 0 rgba(0,0,0,.28);
}

.usm-tokenizer-copy {
	max-width: 560px;
	margin: 0 auto 18px;
	color: rgba(226, 232, 240, .88);
	font-size: 15px;
	line-height: 1.52;
}

.usm-tokenizer-reactor {
	position: relative;
	display: grid;
	place-items: center;
	width: min(390px, 78vw);
	height: 210px;
	margin: 18px auto 20px;
	border-radius: 32px;
	background:
		radial-gradient(circle at 50% 54%, rgba(250, 204, 21, .22), transparent 26%),
		radial-gradient(circle at 32% 50%, rgba(14, 165, 233, .16), transparent 26%),
		radial-gradient(circle at 70% 50%, rgba(244, 63, 94, .16), transparent 26%),
		linear-gradient(180deg, rgba(15, 23, 42, .7), rgba(2, 6, 23, .88));
	border: 1px solid rgba(148, 163, 184, .20);
	box-shadow: inset 0 0 42px rgba(0,0,0,.46), 0 16px 44px rgba(0,0,0,.32);
	overflow: hidden;
}

.usm-tokenizer-reactor:before,
.usm-tokenizer-reactor:after {
	content: "";
	position: absolute;
	inset: -44%;
	background: conic-gradient(from 0deg, transparent, rgba(34, 211, 238, .18), transparent, rgba(250, 204, 21, .18), transparent, rgba(244, 63, 94, .16), transparent);
	animation: usm-tokenizer-spin 7s linear infinite;
}

.usm-tokenizer-reactor:after {
	animation-duration: 4.5s;
	animation-direction: reverse;
	opacity: .55;
}

.usm-tokenizer-orbit {
	position: absolute;
	width: 150px;
	height: 150px;
	border-radius: 999px;
	border: 1px dashed rgba(253, 224, 71, .36);
	box-shadow: 0 0 24px rgba(250, 204, 21, .12);
	z-index: 2;
}

.orbit-a { animation: usm-tokenizer-tilt 3.7s ease-in-out infinite; }
.orbit-b { transform: rotate(64deg); animation: usm-tokenizer-tilt2 4.2s ease-in-out infinite; }

.usm-tokenizer-core {
	position: relative;
	z-index: 4;
	display: grid;
	place-items: center;
	width: 94px;
	height: 94px;
	border-radius: 999px;
	background: radial-gradient(circle at 35% 28%, #fff7ad, #facc15 37%, #a16207 70%, #451a03 100%);
	box-shadow: 0 0 38px rgba(250, 204, 21, .68), inset 0 8px 18px rgba(255,255,255,.22), inset 0 -12px 22px rgba(0,0,0,.36);
	font-size: 42px;
	animation: usm-tokenizer-core-idle 1.7s ease-in-out infinite;
}

.usm-tokenizer-core span {
	filter: drop-shadow(0 4px 8px rgba(0,0,0,.4));
}

.usm-tokenizer-gate {
	position: absolute;
	z-index: 3;
	top: 50%;
	transform: translateY(-50%);
	width: 112px;
	padding: 11px 8px;
	border-radius: 16px;
	font-size: 12px;
	font-weight: 1000;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.gate-win {
	left: 22px;
	border: 1px solid rgba(74, 222, 128, .42);
	background: rgba(20, 83, 45, .48);
	color: #bbf7d0;
	box-shadow: 0 0 20px rgba(34, 197, 94, .18);
}

.gate-loss {
	right: 22px;
	border: 1px solid rgba(248, 113, 113, .42);
	background: rgba(127, 29, 29, .50);
	color: #fecaca;
	box-shadow: 0 0 20px rgba(239, 68, 68, .18);
}

.usm-tokenizer-stats,
.usm-tokenizer-result-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	margin: 16px 0;
}

.usm-tokenizer-stats > div,
.usm-tokenizer-result-grid > div,
.usm-tokenizer-total-count {
	border: 1px solid rgba(148, 163, 184, .20);
	border-radius: 18px;
	padding: 12px;
	background: linear-gradient(180deg, rgba(15, 23, 42, .72), rgba(30, 41, 59, .54));
	box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.usm-tokenizer-stats span,
.usm-tokenizer-result-grid span,
.usm-tokenizer-total-count span {
	display: block;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #94a3b8;
}

.usm-tokenizer-stats strong,
.usm-tokenizer-result-grid strong,
.usm-tokenizer-total-count strong {
	display: block;
	margin-top: 4px;
	font-size: 26px;
	line-height: 1;
	color: #f8fafc;
}

.usm-tokenizer-result-grid strong.good { color: #86efac; text-shadow: 0 0 18px rgba(34,197,94,.38); }
.usm-tokenizer-result-grid strong.bad { color: #fca5a5; text-shadow: 0 0 18px rgba(239,68,68,.38); }

.usm-tokenizer-wager {
	margin: 18px 0 12px;
	padding: 16px;
	border-radius: 22px;
	background: rgba(2, 6, 23, .36);
	border: 1px solid rgba(253, 224, 71, .17);
}

.usm-tokenizer-wager label {
	display: block;
	margin-bottom: 10px;
	font-size: 13px;
	font-weight: 1000;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #fde68a;
}

.usm-tokenizer-range {
	width: 100%;
	accent-color: #facc15;
}

.usm-tokenizer-wager-row {
	display: grid;
	grid-template-columns: minmax(84px, 1fr) repeat(3, auto);
	gap: 8px;
	margin-top: 10px;
}

.usm-tokenizer-number {
	min-width: 0;
	border: 1px solid rgba(253, 224, 71, .34);
	border-radius: 14px;
	padding: 10px 12px;
	background: rgba(15, 23, 42, .9);
	color: #fef3c7;
	font-size: 18px;
	font-weight: 900;
	text-align: center;
}

.usm-tokenizer-chip,
.usm-tokenizer-primary,
.usm-tokenizer-secondary {
	border: 0;
	border-radius: 999px;
	padding: 11px 15px;
	font-weight: 1000;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: transform .16s ease, filter .16s ease, opacity .16s ease;
}

.usm-tokenizer-chip {
	background: rgba(30, 41, 59, .9);
	color: #e2e8f0;
	border: 1px solid rgba(148, 163, 184, .20);
}

.usm-tokenizer-primary {
	background: linear-gradient(135deg, #facc15, #f97316, #ef4444);
	color: #1c1917;
	box-shadow: 0 16px 34px rgba(249, 115, 22, .28), 0 0 0 6px rgba(250, 204, 21, .08);
}

.usm-tokenizer-secondary {
	background: rgba(15, 23, 42, .72);
	color: #cbd5e1;
	border: 1px solid rgba(148, 163, 184, .24);
}

.usm-tokenizer-chip:hover,
.usm-tokenizer-primary:hover,
.usm-tokenizer-secondary:hover {
	transform: translateY(-1px) scale(1.015);
	filter: brightness(1.08);
}

.usm-tokenizer-chip:disabled,
.usm-tokenizer-primary:disabled,
.usm-tokenizer-secondary:disabled,
.usm-tokenizer-number:disabled,
.usm-tokenizer-range:disabled {
	opacity: .55;
	cursor: wait;
}

.usm-tokenizer-actions {
	display: flex;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 16px;
}

.usm-tokenizer-note,
.usm-tokenizer-status {
	font-size: 12px;
	line-height: 1.45;
	color: rgba(203, 213, 225, .82);
}

.usm-tokenizer-status {
	min-height: 22px;
	margin-top: 12px;
	font-weight: 800;
	color: #fef3c7;
}

.usm-tokenizer-overlay.is-charging .usm-tokenizer-card {
	animation: usm-tokenizer-card-shake .32s ease-in-out infinite;
}

.usm-tokenizer-overlay.is-charging .usm-tokenizer-core {
	animation: usm-tokenizer-core-charge .42s ease-in-out infinite;
}

.usm-tokenizer-overlay.is-charging .gate-win,
.usm-tokenizer-overlay.is-charging .gate-loss {
	animation: usm-tokenizer-gate-flicker .48s linear infinite;
}

.usm-tokenizer-overlay.is-charging .gate-loss {
	animation-delay: .24s;
}

.usm-tokenizer-result-title {
	font-size: clamp(34px, 8vw, 72px);
}

.usm-tokenizer-overlay.is-win .usm-tokenizer-card {
	border-color: rgba(74, 222, 128, .62);
	box-shadow: 0 28px 100px rgba(0,0,0,.68), 0 0 70px rgba(34,197,94,.26), inset 0 1px 0 rgba(255,255,255,.12);
}

.usm-tokenizer-overlay.is-loss .usm-tokenizer-card {
	border-color: rgba(248, 113, 113, .62);
	box-shadow: 0 28px 100px rgba(0,0,0,.68), 0 0 70px rgba(239,68,68,.23), inset 0 1px 0 rgba(255,255,255,.12);
}

.usm-tokenizer-overlay.is-win .usm-tokenizer-title { color: #bbf7d0; text-shadow: 0 0 30px rgba(34,197,94,.5); }
.usm-tokenizer-overlay.is-loss .usm-tokenizer-title { color: #fecaca; text-shadow: 0 0 30px rgba(239,68,68,.5); }

.usm-tokenizer-reactor-result {
	height: 170px;
}

.usm-tokenizer-burst {
	position: absolute;
	inset: 18px;
	border-radius: 999px;
	background: conic-gradient(from 0deg, transparent, rgba(255,255,255,.7), transparent, rgba(250,204,21,.7), transparent);
	animation: usm-tokenizer-spin .9s linear infinite;
	filter: blur(.2px);
}

.usm-tokenizer-total-count {
	max-width: 270px;
	margin: 16px auto;
}

.usm-tokenizer-total-count strong {
	font-size: 58px;
	color: #fef08a;
	text-shadow: 0 0 24px rgba(250,204,21,.5);
}

.usm-tokenizer-particles {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: hidden;
}

.usm-tokenizer-particles i {
	position: absolute;
	left: 50%;
	top: 54%;
	width: 13px;
	height: 13px;
	border-radius: 999px;
	animation: usm-tokenizer-particle 1.8s cubic-bezier(.14,.84,.24,1) forwards;
	animation-delay: var(--d, 0ms);
}

.usm-tokenizer-particles .particle-win {
	background: radial-gradient(circle, #fff 0 18%, #fde047 20% 55%, #f97316 56% 100%);
	box-shadow: 0 0 18px rgba(250,204,21,.8);
}

.usm-tokenizer-particles .particle-loss {
	background: radial-gradient(circle, #fff 0 18%, #fb7185 20% 55%, #7f1d1d 56% 100%);
	box-shadow: 0 0 18px rgba(248,113,113,.75);
}

@keyframes usm-tokenizer-spin {
	to { transform: rotate(360deg); }
}

@keyframes usm-tokenizer-tilt {
	0%, 100% { transform: rotateX(58deg) rotateZ(0deg) scale(1); }
	50% { transform: rotateX(58deg) rotateZ(180deg) scale(1.08); }
}

@keyframes usm-tokenizer-tilt2 {
	0%, 100% { transform: rotateX(64deg) rotateY(18deg) rotateZ(64deg) scale(.92); }
	50% { transform: rotateX(64deg) rotateY(18deg) rotateZ(244deg) scale(1.04); }
}

@keyframes usm-tokenizer-core-idle {
	0%, 100% { transform: translateY(0) rotate(-2deg); }
	50% { transform: translateY(-5px) rotate(3deg); }
}

@keyframes usm-tokenizer-core-charge {
	0%, 100% { transform: scale(.96) rotate(-9deg); filter: brightness(1); }
	50% { transform: scale(1.12) rotate(9deg); filter: brightness(1.45); }
}

@keyframes usm-tokenizer-gate-flicker {
	0%, 49% { opacity: .45; transform: translateY(-50%) scale(.96); }
	50%, 100% { opacity: 1; transform: translateY(-50%) scale(1.05); }
}

@keyframes usm-tokenizer-card-shake {
	0%, 100% { transform: translate(0, 0) scale(1); }
	25% { transform: translate(1px, -1px) scale(1.003); }
	50% { transform: translate(-1px, 1px) scale(1.005); }
	75% { transform: translate(1px, 1px) scale(1.003); }
}

@keyframes usm-tokenizer-particle {
	0% { transform: translate(-50%, -50%) scale(.45) rotate(0deg); opacity: 0; }
	12% { opacity: 1; }
	100% { transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) scale(1.1) rotate(var(--r)); opacity: 0; }
}

@media (max-width: 620px) {
	.usm-tokenizer-overlay { padding: 10px; }
	.usm-tokenizer-card { padding: 22px 16px; border-radius: 24px; }
	.usm-tokenizer-reactor { height: 185px; }
	.usm-tokenizer-gate { width: 94px; font-size: 10px; }
	.gate-win { left: 10px; }
	.gate-loss { right: 10px; }
	.usm-tokenizer-stats,
	.usm-tokenizer-result-grid { grid-template-columns: 1fr; }
	.usm-tokenizer-wager-row { grid-template-columns: 1fr 1fr 1fr; }
	.usm-tokenizer-number { grid-column: 1 / -1; }
	.usm-tokenizer-actions { flex-direction: column-reverse; }
	.usm-tokenizer-actions button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.usm-tokenizer-card,
	.usm-tokenizer-core,
	.usm-tokenizer-reactor:before,
	.usm-tokenizer-reactor:after,
	.usm-tokenizer-orbit,
	.usm-tokenizer-burst,
	.usm-tokenizer-particles i {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
}


/* v1.0.2 responsive overlay stability */
.usm-tokenizer-overlay{display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;width:100%;height:100%;max-height:100%;padding:clamp(10px,2.4vw,22px)}
.app .usm-tokenizer-overlay,.app:fullscreen .usm-tokenizer-overlay,.app:-webkit-full-screen .usm-tokenizer-overlay,.app.is-fullscreen .usm-tokenizer-overlay{position:absolute;inset:0;width:100%;height:100%;max-height:100%}
.usm-tokenizer-card{width:min(680px,calc(100% - 6px));max-height:none;overflow:visible;margin:auto 0;box-sizing:border-box}
.usm-tokenizer-reactor{height:clamp(142px,26vh,210px);margin:clamp(10px,2vh,18px) auto clamp(10px,2vh,20px)}
.usm-tokenizer-result-title{font-size:clamp(30px,7vw,62px)}
@media (max-height:760px){.usm-tokenizer-card{padding:20px}.usm-tokenizer-title{font-size:clamp(28px,5.5vw,48px);margin:8px 0}.usm-tokenizer-copy{font-size:13px;line-height:1.35;margin-bottom:12px}.usm-tokenizer-stats,.usm-tokenizer-result-grid{margin:10px 0}.usm-tokenizer-wager{margin:12px 0 8px;padding:12px}.usm-tokenizer-total-count strong{font-size:44px}}
@media (hover:none),(pointer:coarse),(max-width:900px){.usm-tokenizer-backdrop{backdrop-filter:none}.usm-tokenizer-card:before,.usm-tokenizer-reactor:before,.usm-tokenizer-reactor:after,.usm-tokenizer-orbit,.usm-tokenizer-burst{animation:none !important}.usm-tokenizer-card{box-shadow:0 20px 50px rgba(0,0,0,.58),0 0 0 3px rgba(250,204,21,.05)}}
