/* Halloween 2026 - remove after the event, together with the marked blocks of main/fy_boot.php, header.php, footer.php and
   main/index.php. The look of the event on every page: the bar above the header, the tile of the Play menu item, the drawer
   row, the footer link and event line and the front page banner. main/fy_boot.php loads this sheet only while its switch
   ($fyHalloweenOn) is on. The event's colours on Freya's own tokens and shapes (freya.css). */
.fy-hwc-bar, .fy-hwc-foot, .fy-hw-drawer, .fy-hw-foot, .fy-hw-banner { --hw-pumpkin: #ee8b36; --hw-pumpkin-2: #ffb071; --hw-pumpkin-3: #ffd6b3; --hw-ink: #2a1204; --hw-grad: linear-gradient(135deg, #ffb071, #ee8b36 55%, #d9731f); }

/* The bar above the header, on every page: it scrolls away with the page while the header stays. Wide screens: pumpkin, title,
   the event in one sentence, Guide and Leaderboard; under 1024 px the sentence goes, under 480 px the chips' icons, under 360 px the
   pumpkin. On touch screens both links are 44 px tall. */
:root { --hwc-bar-h: 40px; }
@media (pointer: coarse), (max-width: 767.98px) { :root { --hwc-bar-h: 44px; } }
.fy-hwc-bar {
	height: var(--hwc-bar-h);
	overflow: hidden;
	background: radial-gradient(42% 180% at 50% 0, rgba(238, 139, 54, .2), rgba(238, 139, 54, 0) 72%), linear-gradient(90deg, var(--night-950), var(--night-800) 50%, var(--night-950));
	border-bottom: 1px solid rgba(238, 139, 54, .38);
	color: var(--text-2);
	font: 600 var(--fs-xs)/1.25 var(--font-body);
}
.fy-hwc-bar__inner { display: flex; align-items: stretch; justify-content: center; gap: 10px; height: 100%; }
.fy-hwc-bar a { display: flex; align-items: center; gap: 10px; min-width: 0; color: inherit; text-decoration: none; }
.fy-hwc-bar a:hover { color: var(--text); }
.fy-hwc-bar a:focus-visible { outline-offset: -3px; }
.fy-hwc-bar__main { flex: 0 1 auto; }
.fy-hwc-bar__board { flex: none; }
.fy-hwc-bar__main > .fy-i { flex: none; width: 22px; height: 22px; color: var(--hw-pumpkin); filter: drop-shadow(0 0 6px rgba(238, 139, 54, .45)); }
.fy-hwc-bar__title { flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--hw-pumpkin-2); font: 700 var(--fs-sm)/1.2 var(--font-display); }
.fy-hwc-bar__text { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fy-hwc-chip { display: inline-flex; align-items: center; gap: 6px; flex: none; height: 28px; padding: 0 12px; border-radius: var(--r-pill); background: rgba(238, 139, 54, .16); color: var(--hw-pumpkin-3); font: 700 var(--fs-xs)/1 var(--font-display); transition: background-color var(--t-med) var(--ease), filter var(--t-med) var(--ease); }
.fy-hwc-chip .fy-i { width: 14px; height: 14px; }
.fy-hwc-chip--main { background: var(--hw-grad); color: var(--hw-ink); }
.fy-hwc-bar__main:hover .fy-hwc-chip--main { filter: brightness(1.08); }
.fy-hwc-bar__board:hover .fy-hwc-chip { background: rgba(238, 139, 54, .32); color: var(--text); }
@media (max-width: 1023.98px) { .fy-hwc-bar__text { display: none; } }
@media (max-width: 479.98px) {
	.fy-hwc-bar__inner, .fy-hwc-bar a { gap: 8px; }
	.fy-hwc-bar__title { flex: 0 1 auto; min-width: 0; }
	.fy-hwc-chip { padding: 0 10px; }
	.fy-hwc-chip .fy-i { display: none; }
}
@media (max-width: 359.98px) { .fy-hwc-bar__main > .fy-i { display: none; } }
@media print { .fy-hwc-bar { display: none; } }
/* The front page's header floats over the hero, fixed to the top of the window. With the bar above it the header is sticky and takes
   no room of its own (the negative margin): the hero still starts under it, and it scrolls up with the bar and then stays. */
.fy-home .fy-hwc-bar ~ .fy-header { position: sticky; top: 0; margin-bottom: calc(-1 * var(--header-h)); }

/* The tile of the Play menu item */
.fy-menu__icon--pumpkin { background: rgba(238, 139, 54, .16); color: #ffb071; }

/* The drawer row, under Free spins */
.fy-drawer__spin.fy-hw-drawer { border-color: rgba(238, 139, 54, .5); background: linear-gradient(90deg, rgba(238, 139, 54, .22), rgba(238, 139, 54, .06)); color: var(--hw-pumpkin-2); }
.fy-drawer__spin.fy-hw-drawer .fy-i { color: var(--hw-pumpkin); }
.fy-drawer__spin.fy-hw-drawer:hover, .fy-drawer__spin.fy-hw-drawer[aria-current="page"] { color: var(--hw-pumpkin-3); background: linear-gradient(90deg, rgba(238, 139, 54, .32), rgba(238, 139, 54, .1)); }

/* The footer link, above Free spins */
.fy-footer a.fy-footer__spin.fy-hw-foot { color: var(--hw-pumpkin-2); }
.fy-footer a.fy-footer__spin.fy-hw-foot:hover { color: var(--hw-pumpkin-3); }
.fy-footer__spin.fy-hw-foot .fy-i { color: var(--hw-pumpkin); }

/* The event line in the footer, under the description */
.fy-footer .fy-hwc-foot { display: flex; align-items: flex-start; gap: 10px; margin: var(--sp-4) 0 0; padding: 10px 14px; border: 1px solid rgba(238, 139, 54, .3); border-radius: var(--r-md); background: linear-gradient(135deg, rgba(238, 139, 54, .1), rgba(140, 87, 248, .08)); color: var(--text-2); line-height: 1.5; }
.fy-hwc-foot > .fy-i { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--hw-pumpkin); }
.fy-hwc-foot strong { color: var(--hw-pumpkin-2); }
.fy-footer .fy-hwc-foot a { color: var(--hw-pumpkin-2); text-decoration: underline; }
.fy-footer .fy-hwc-foot a:hover { color: var(--text); }

/* The front page banner, under the server facts */
.fy-hw-banner { position: relative; padding-block: var(--sp-8) 0; }
.fy-hw-banner__card {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-4) var(--sp-6);
	padding: var(--sp-6);
	border: 1px solid rgba(238, 139, 54, .42);
	border-radius: var(--r-lg);
	background: radial-gradient(60% 140% at 0 50%, rgba(238, 139, 54, .22), rgba(238, 139, 54, 0) 70%), radial-gradient(50% 120% at 100% 0, rgba(140, 87, 248, .24), rgba(140, 87, 248, 0) 70%), var(--night-800);
	box-shadow: var(--shadow-md), var(--inner-hi);
}
.fy-hw-banner__icon { display: grid; place-items: center; flex: none; width: 72px; height: 72px; border-radius: var(--r-lg); background: rgba(238, 139, 54, .16); color: var(--hw-pumpkin-2); }
.fy-hw-banner__icon .fy-i { width: 44px; height: 44px; }
.fy-hw-banner__text { flex: 1 1 320px; min-width: 0; }
.fy-hw-banner__text .fy-eyebrow { margin-bottom: var(--sp-2); color: var(--hw-pumpkin-2); }
.fy-hw-banner__text h2 { margin: 0 0 var(--sp-2); font-size: clamp(1.3rem, 1.1rem + 1vw, 1.75rem); }
.fy-hw-banner__text p:last-child { margin: 0; color: var(--text-2); }
.fy-btn.fy-hw-banner__cta { flex: none; background: var(--hw-grad); color: var(--hw-ink); }
.fy-btn.fy-hw-banner__cta:hover { color: var(--hw-ink); filter: brightness(1.06); }
@media (max-width: 559.98px) {
	.fy-hw-banner__text { flex-basis: 100%; }
	.fy-btn.fy-hw-banner__cta { flex: 1 1 100%; justify-content: center; }
}