/* =============================================================
   MCT – css/mod_test_random.css
   getRandomSuS(): Fullscreen-Overlay-Grundgerüst über mod_test.
   Bewusst eigene, kräftige Game-Optik (Beamer/Klassenraum) statt
   der sonst nüchternen MCT-Gestaltung.
   ============================================================= */

#random-overlay {
	position:   absolute;
	inset:      0;
	display:    flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(circle at 50% 35%, #1e1b3a 0%, #0a0812 75%);
	color:      #f5f3ff;
	font-family: -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	overflow:   hidden;
}

#random-btn-abbrechen {
	position:   absolute;
	top:        1.25rem;
	right:      1.5rem;
	width:      3rem;
	height:     3rem;
	border:     2px solid rgba(255,255,255,.35);
	border-radius: 50%;
	background: rgba(255,255,255,.08);
	color:      #f5f3ff;
	font-size:  1.5rem;
	line-height: 1;
	cursor:     pointer;
	z-index:    10;
}
#random-btn-abbrechen:hover {
	background: rgba(255,255,255,.2);
}

#random-buehne {
	width:  100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	padding: 2rem;
	box-sizing: border-box;
}

.random-screen {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	width: 100%;
}

/* -------------------------------------------------------------
   Große Buttons (Start, Game-Auswahl, Bandit-STOP)
   ------------------------------------------------------------ */
.random-btn-gross {
	font-size:   clamp(1.5rem, 3.2vw, 2.75rem);
	font-weight: 800;
	letter-spacing: .04em;
	padding:     1.25rem 3rem;
	border:      none;
	border-radius: 1rem;
	background:  linear-gradient(180deg, #f59e0b 0%, #d9720a 100%);
	color:       #1a1005;
	cursor:      pointer;
	box-shadow:  0 8px 0 #92450a, 0 14px 28px rgba(0,0,0,.45);
	transition:  transform .08s ease;
	text-align:  center;
	line-height: 1.15;
}
.random-btn-gross:hover {
	background: linear-gradient(180deg, #f59e0b 0%, #d9720a 100%);
	filter:     brightness(1.08);
}
.random-btn-gross:active  { transform: translateY(6px); box-shadow: 0 2px 0 #92450a, 0 6px 16px rgba(0,0,0,.4); }
.random-btn-gross:disabled {
	opacity: .6;
	cursor:  default;
	box-shadow: 0 8px 0 #4a4a4a, 0 14px 28px rgba(0,0,0,.45);
	background: linear-gradient(180deg, #9ca3af 0%, #6b7280 100%);
}

/* -------------------------------------------------------------
   Namensanzeige (GameMaster-Ziehung + Ergebnis)
   ------------------------------------------------------------ */
.random-name-gross {
	font-size:   clamp(2rem, 6vw, 5rem);
	font-weight: 800;
	text-align:  center;
	min-height:  1.3em;
	text-shadow: 0 4px 24px rgba(245,158,11,.5);
}
.random-name-final {
	color: #fbbf24;
	animation: random-pop .4s ease;
}
@keyframes random-pop {
	0%   { transform: scale(.85); opacity: 0; }
	60%  { transform: scale(1.08); opacity: 1; }
	100% { transform: scale(1); }
}

.random-titel {
	font-size:   clamp(1.75rem, 4vw, 3rem);
	font-weight: 800;
	letter-spacing: .06em;
	color:       #f5f3ff;
	margin:      0;
}

#random-game-liste {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	justify-content: center;
}

.random-hinweis {
	font-size: 1.5rem;
	color: #cbd5e1;
	text-align: center;
}