/* ==========================================================================
   Casino Extra — interactive widgets
   Inherits the site palette; falls back to its own values if loaded alone.
   ========================================================================== */

.ce-w {
	--w-gold:      var(--ce-gold, #c9a24a);
	--w-gold-lite: var(--ce-gold-lite, #e6c87f);
	--w-gold-deep: var(--ce-gold-deep, #a88430);
	--w-surface:   #252525;
	--w-surface-2: #2c2c2c;
	--w-line:      rgba(255, 255, 255, .10);
	--w-text:      #eceae5;
	--w-soft:      #aaa59c;
	--w-faint:     #7f7a71;
	--w-pos:       #4fae85;
	--w-neg:       #d9757a;
	--w-warn:      #d9a94a;
	--w-dur:       var(--ce-dur, 400ms);
	--w-ease:      var(--ce-ease, cubic-bezier(.22, 1, .36, 1));

	margin: 2rem 0;
	padding: clamp(1.4rem, 3vw, 2.1rem);
	border: 1px solid var(--w-line);
	border-radius: 14px;
	background:
		radial-gradient(120% 90% at 100% 0%, rgba(201, 162, 74, .07), transparent 55%),
		var(--w-surface);
	color: var(--w-text);
	font-size: .96rem;
	line-height: 1.6;
	box-shadow: 0 20px 46px -32px rgba(0, 0, 0, .9);
}
.ce-w * { box-sizing: border-box; }

/* ---------- head ---------- */
.ce-w__head { margin-bottom: 1.5rem; }
.ce-w__kicker {
	display: inline-block;
	margin-bottom: .7rem;
	padding: .22rem .7rem;
	border: 1px solid rgba(201, 162, 74, .4);
	border-radius: 999px;
	background: rgba(201, 162, 74, .08);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--w-gold);
}
.ce-w__title {
	margin: 0 0 .55rem;
	font-size: clamp(1.15rem, 1.02rem + .6vw, 1.42rem);
	line-height: 1.28;
	font-weight: 660;
	letter-spacing: -.01em;
	color: #fff;
	padding: 0;
	border: 0;
}
.ce-w__title::before { content: none; }
.ce-w__sub { margin: 0; font-size: .92rem; color: var(--w-soft); max-width: 62ch; }

/* ---------- inputs ---------- */
.ce-w__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: .9rem;
}
.ce-w__field { display: block; }
.ce-w__field--wide { grid-column: span 2; }
.ce-w__label {
	display: block;
	margin-bottom: .4rem;
	font-size: .74rem;
	font-weight: 660;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--w-faint);
}
.ce-w__input,
.ce-w__select {
	display: flex;
	align-items: center;
	border: 1px solid var(--w-line);
	border-radius: 9px;
	background: rgba(0, 0, 0, .28);
	transition: border-color var(--w-dur) var(--w-ease), background var(--w-dur) var(--w-ease);
}
.ce-w__input:focus-within,
.ce-w__select:focus-within {
	border-color: var(--w-gold);
	background: rgba(201, 162, 74, .07);
}
.ce-w__input input,
.ce-w__select select {
	width: 100%;
	padding: .68rem .8rem;
	border: 0;
	background: transparent;
	color: var(--w-text);
	font: inherit;
	font-weight: 620;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}
.ce-w__input em {
	padding-right: .85rem;
	font-style: normal;
	font-weight: 700;
	color: var(--w-gold);
}
.ce-w__select { position: relative; }
.ce-w__select::after {
	content: "";
	position: absolute;
	right: .85rem;
	top: 50%;
	width: .5rem;
	height: .5rem;
	margin-top: -.35rem;
	border-right: 2px solid var(--w-gold);
	border-bottom: 2px solid var(--w-gold);
	transform: rotate(45deg);
	pointer-events: none;
}
.ce-w__select select { padding-right: 2.2rem; cursor: pointer; }
.ce-w__select option { background: #1e1e1e; color: var(--w-text); }
.ce-w input[type="number"]::-webkit-outer-spin-button,
.ce-w input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ce-w input[type="number"] { -moz-appearance: textfield; }

/* ---------- output ---------- */
.ce-w__out { margin-top: 1.6rem; }
.ce-w__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
	gap: 1px;
	border: 1px solid var(--w-line);
	border-radius: 11px;
	background: var(--w-line);
	overflow: hidden;
}
.ce-w__stat { padding: .95rem 1rem; background: #1f1f1f; }
.ce-w__statLabel {
	display: block;
	margin-bottom: .3rem;
	font-size: .7rem;
	font-weight: 660;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--w-faint);
}
.ce-w__stat strong {
	font-size: clamp(1.05rem, .98rem + .4vw, 1.25rem);
	font-weight: 700;
	color: var(--w-gold-lite);
	letter-spacing: -.01em;
}

/* verdict */
.ce-w__verdict {
	margin-top: 1.1rem;
	padding: 1.05rem 1.2rem;
	border: 1px solid var(--w-line);
	border-left: 3px solid var(--w-faint);
	border-radius: 9px;
	background: rgba(255, 255, 255, .022);
	transition: border-color var(--w-dur) var(--w-ease), background var(--w-dur) var(--w-ease);
}
.ce-w__verdict.is-good    { border-left-color: var(--w-pos);  background: rgba(79, 174, 133, .08); }
.ce-w__verdict.is-neutral { border-left-color: var(--w-warn); background: rgba(217, 169, 74, .07); }
.ce-w__verdict.is-bad     { border-left-color: var(--w-neg);  background: rgba(217, 117, 122, .08); }
.ce-w__verdictTitle {
	margin: 0 0 .35rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.ce-w__verdict.is-good .ce-w__verdictTitle    { color: var(--w-pos); }
.ce-w__verdict.is-neutral .ce-w__verdictTitle { color: var(--w-warn); }
.ce-w__verdict.is-bad .ce-w__verdictTitle     { color: var(--w-neg); }
.ce-w__verdictText { margin: 0; font-size: .92rem; color: var(--w-soft); }

/* RTP bar */
.ce-w__bar { margin-top: 1.1rem; }
.ce-w__barTrack {
	position: relative;
	height: 6px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .07);
	overflow: hidden;
}
.ce-w__barTrack span {
	display: block;
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: var(--w-warn);
	transition: width var(--w-dur) var(--w-ease), background var(--w-dur) var(--w-ease);
}
.ce-w__barTrack span.is-good { background: linear-gradient(90deg, var(--w-gold-deep), var(--w-pos)); }
.ce-w__barTrack span.is-neutral { background: linear-gradient(90deg, var(--w-gold-deep), var(--w-warn)); }
.ce-w__barTrack span.is-bad { background: linear-gradient(90deg, var(--w-gold-deep), var(--w-neg)); }
.ce-w__barNote { margin: .6rem 0 0; font-size: .84rem; color: var(--w-faint); }

/* schedule table */
.ce-w__table {
	width: 100%;
	margin-top: 1.2rem;
	border-collapse: collapse;
	font-size: .9rem;
	border: 1px solid var(--w-line);
	border-radius: 9px;
	overflow: hidden;
}
.ce-w__table th {
	padding: .7rem .9rem;
	background: #100f0d;
	color: var(--w-gold);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-align: left;
	border: 0;
}
.ce-w__table td {
	padding: .65rem .9rem;
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, .06);
	color: var(--w-soft);
}
.ce-w__table td:first-child { color: var(--w-text); font-weight: 600; }
.ce-w__more td { color: var(--w-faint); font-style: italic; }

.ce-w__foot {
	margin: 1.4rem 0 0;
	padding-top: 1rem;
	border-top: 1px solid var(--w-line);
	font-size: .78rem;
	line-height: 1.55;
	color: var(--w-faint);
}

/* ==========================================================================
   Poll
   ========================================================================== */
.ce-poll__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.ce-poll__item { margin: 0; padding: 0; }
.ce-poll__item::before { content: none; }
.ce-poll__btn {
	position: relative;
	display: flex;
	align-items: center;
	gap: .8rem;
	width: 100%;
	padding: .85rem 1rem;
	border: 1px solid var(--w-line);
	border-radius: 9px;
	background: rgba(0, 0, 0, .22);
	color: var(--w-text);
	font: inherit;
	font-weight: 560;
	text-align: left;
	cursor: pointer;
	overflow: hidden;
	transition: border-color var(--w-dur) var(--w-ease), transform var(--w-dur) var(--w-ease);
}
.ce-poll__btn:hover { border-color: rgba(201, 162, 74, .5); transform: translateX(3px); }
.ce-poll__fill {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 0;
	background: linear-gradient(90deg, rgba(201, 162, 74, .22), rgba(201, 162, 74, .07));
	opacity: 0;
	transition: width 700ms var(--w-ease), opacity var(--w-dur) var(--w-ease);
	pointer-events: none;
}
.ce-poll__label { position: relative; flex: 1; }
.ce-poll__pct {
	position: relative;
	min-width: 3.2rem;
	text-align: right;
	font-weight: 700;
	color: var(--w-gold);
	opacity: 0;
	transition: opacity var(--w-dur) var(--w-ease);
}

/* after voting */
.ce-w--poll.is-voted .ce-poll__fill,
.ce-w--poll.is-voted .ce-poll__pct { opacity: 1; }
.ce-w--poll.is-voted .ce-poll__btn { cursor: default; transform: none; }
.ce-w--poll.is-voted .ce-poll__btn:hover { border-color: var(--w-line); }
.ce-w--poll.is-voted .ce-poll__btn.is-mine { border-color: var(--w-gold); }
.ce-w--poll.is-voted .ce-poll__btn.is-mine .ce-poll__label::after {
	content: " ✓";
	color: var(--w-gold);
	font-weight: 700;
}
.ce-w--poll.is-busy { opacity: .65; pointer-events: none; }
.ce-poll__meta { margin: 1rem 0 0; font-size: .8rem; color: var(--w-faint); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 640px) {
	.ce-w { padding: 1.2rem 1.1rem; }
	.ce-w__grid { grid-template-columns: 1fr 1fr; }
	.ce-w__field--wide { grid-column: 1 / -1; }
	.ce-w__stats { grid-template-columns: 1fr 1fr; }
	.ce-w__table { font-size: .84rem; }
	.ce-w__table th,
	.ce-w__table td { padding: .55rem .6rem; }
}
@media (max-width: 380px) {
	.ce-w__grid,
	.ce-w__stats { grid-template-columns: 1fr; }
}
@media (hover: none) {
	.ce-poll__btn:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.ce-w *,
	.ce-w *::before,
	.ce-w *::after { transition: none !important; }
}