/* GamingBroject · Halloween week v2 (s141, 25/10/2026). Panos: «μεγαλύτερο θέμα, πιο πολλά, desktop και mobile».
   On only while <html class="gb-hw"> is set by gb-halloween.js (25/10 to 5/11, Athens). Every decoration ignores clicks
   (pointer-events: none); motion stops for prefers-reduced-motion; the light theme keeps the decoration, not the night. */

html.gb-hw {
  --hw-pumpkin: #ff7a1a;
  --hw-ember: #ffb347;
  --hw-violet: #7b2cbf;
  --hw-toxic: #8dff5a;
  --hw-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --gbhw-top: 72px;
}

/* ---------- page colour ---------- */
html.gb-hw:not([data-gb-theme="light"]) { --gb-red: #ff7a1a; }
html.gb-hw:not([data-gb-theme="light"]) body {
  background-color: #060309 !important;
  background-image:
    radial-gradient(120% 60% at 50% -10%, rgba(123, 44, 191, 0.3), transparent 60%),
    radial-gradient(70% 40% at 0% 100%, rgba(141, 255, 90, 0.05), transparent 70%),
    radial-gradient(80% 40% at 100% 100%, rgba(255, 122, 26, 0.1), transparent 70%) !important;
  background-attachment: fixed !important;
}
/* cards and links glow like candle light */
html.gb-hw:not([data-gb-theme="light"]) :is(article, .gb-card, .post-card) {
  box-shadow: 0 0 0 1px rgba(255, 122, 26, 0.12), 0 10px 30px -12px rgba(123, 44, 191, 0.45);
}
@media (hover: hover) and (pointer: fine) {
  html.gb-hw:not([data-gb-theme="light"]) :is(article, .gb-card, .post-card):hover {
    box-shadow: 0 0 0 1px rgba(255, 122, 26, 0.45), 0 0 28px rgba(255, 122, 26, 0.25);
  }
}
html.gb-hw header img { animation: gbhw-flicker 7s steps(1, end) infinite; }
@keyframes gbhw-flicker {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(255, 122, 26, 0.6)); }
  46% { filter: drop-shadow(0 0 2px rgba(255, 122, 26, 0.25)) brightness(0.8); }
  47% { filter: drop-shadow(0 0 10px rgba(255, 140, 40, 0.85)); }
  49% { filter: drop-shadow(0 0 3px rgba(255, 122, 26, 0.3)) brightness(0.88); }
  50% { filter: drop-shadow(0 0 7px rgba(255, 122, 26, 0.65)); }
}
html.gb-hw:not([data-gb-theme="light"]) #roomStage img {
  filter: brightness(0.74) contrast(1.15) saturate(1.2) hue-rotate(-12deg);
}

/* ---------- fixed effects layer ---------- */
#gbhw-fx { position: fixed; inset: 0; z-index: 2147483000; pointer-events: none; overflow: hidden; contain: strict; }
#gbhw-fx > * { position: absolute; }
.gbhw-vignette { inset: 0; background: radial-gradient(ellipse at center, transparent 52%, rgba(10, 0, 18, 0.62) 100%); }
.gbhw-fog {
  left: -50%; bottom: -2vh; width: 200%; height: 26vh; opacity: 0.3;
  background:
    radial-gradient(40% 70% at 20% 80%, rgba(200, 190, 230, 0.55), transparent 70%),
    radial-gradient(35% 60% at 55% 90%, rgba(170, 160, 210, 0.5), transparent 70%),
    radial-gradient(40% 70% at 85% 85%, rgba(200, 190, 230, 0.5), transparent 70%);
  filter: blur(14px); animation: gbhw-fog 38s linear infinite; will-change: transform;
}
.gbhw-fog.b { opacity: 0.18; animation-duration: 55s; animation-direction: reverse; bottom: -6vh; }
@keyframes gbhw-fog { from { transform: translateX(0); } to { transform: translateX(25%); } }
.gbhw-canvas { inset: 0; width: 100%; height: 100%; }
.gbhw-flash { inset: 0; background: radial-gradient(ellipse at 70% 0%, rgba(220, 210, 255, 0.55), rgba(180, 160, 255, 0.12) 60%, transparent); opacity: 0; }
.gbhw-flash.on { animation: gbhw-flash 0.9s ease-out; }
@keyframes gbhw-flash { 0% { opacity: 0; } 6% { opacity: 0.22; } 14% { opacity: 0.04; } 22% { opacity: 0.16; } 100% { opacity: 0; } }

/* string of jack-o'-lantern lights under the header */
.gbhw-garland { left: 0; right: 0; top: var(--gbhw-top); height: 34px; }
.gbhw-garland svg { width: 100%; height: 100%; display: block; overflow: visible; }
.gbhw-garland .bulb { animation: gbhw-bulb 2.4s ease-in-out infinite alternate; }
.gbhw-garland .bulb:nth-of-type(3n) { animation-delay: -0.8s; }
.gbhw-garland .bulb:nth-of-type(3n+1) { animation-delay: -1.6s; }
@keyframes gbhw-bulb { from { opacity: 0.55; } to { opacity: 1; } }

/* spiders on a thread */
.gbhw-spider { top: var(--gbhw-top); width: 26px; height: 120px; transform-origin: 50% 0; animation: gbhw-dangle 6s ease-in-out infinite; }
.gbhw-spider .thread { position: absolute; left: 12.5px; top: 0; width: 1px; height: var(--len, 70px); background: rgba(230, 225, 245, 0.55); }
.gbhw-spider svg { position: absolute; left: 0; top: var(--len, 70px); width: 26px; height: 26px; color: #0d0612; filter: drop-shadow(0 0 4px rgba(255, 122, 26, 0.55)); }
.gbhw-spider .thread, .gbhw-spider svg { animation: gbhw-drop 7s var(--hw-ease) infinite; }
@keyframes gbhw-dangle { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }
@keyframes gbhw-drop { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(34px); } 60% { transform: translateY(30px); } }
.gbhw-web { top: var(--gbhw-top); width: 130px; height: 130px; opacity: 0.32; color: #d8d2e6; }
.gbhw-web.r { right: 0; }
.gbhw-web.l { left: 0; transform: scaleX(-1); opacity: 0.22; }

/* countdown pill on the home page */
.gbhw-pill {
  left: 50%; top: calc(var(--gbhw-top) + 44px); transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px;
  border: 1px solid rgba(255, 122, 26, 0.6); background: rgba(12, 4, 18, 0.82);
  color: #ffd9b8; font: 800 12px/1 Inter, system-ui, sans-serif; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap;
  box-shadow: 0 0 22px rgba(255, 122, 26, 0.35); transition: opacity 300ms ease, transform 300ms var(--hw-ease);
}
.gbhw-pill b { color: var(--hw-pumpkin); }
.gbhw-pill.away { opacity: 0; transform: translate(-50%, -8px); }

/* bats and ghosts */
.gbhw-bat { left: -60px; width: 38px; height: 20px; color: #120818; filter: drop-shadow(0 0 6px rgba(255, 122, 26, 0.5)); animation: gbhw-fly var(--d, 9s) linear forwards; will-change: transform; }
.gbhw-bat svg { width: 100%; height: 100%; animation: gbhw-flap 0.2s ease-in-out infinite alternate; transform-origin: 50% 40%; }
@keyframes gbhw-fly {
  0% { transform: translate(0, 0) scale(var(--s, 1)); }
  25% { transform: translate(28vw, var(--y1, -4vh)) scale(var(--s, 1)); }
  50% { transform: translate(56vw, var(--y2, 3vh)) scale(var(--s, 1)); }
  75% { transform: translate(84vw, var(--y1, -4vh)) scale(var(--s, 1)); }
  100% { transform: translate(115vw, var(--y2, 2vh)) scale(var(--s, 1)); }
}
@keyframes gbhw-flap { from { transform: scaleY(1); } to { transform: scaleY(0.4); } }
.gbhw-ghost { left: -90px; bottom: 8vh; width: 70px; height: 86px; opacity: 0; animation: gbhw-ghost var(--d, 16s) ease-in-out forwards; will-change: transform, opacity; }
.gbhw-ghost svg { width: 100%; height: 100%; filter: drop-shadow(0 0 14px rgba(220, 215, 255, 0.6)); animation: gbhw-sway 2.6s ease-in-out infinite alternate; }
@keyframes gbhw-ghost {
  0% { opacity: 0; transform: translate(0, 0) scale(var(--s, 1)); }
  12% { opacity: 0.55; }
  50% { transform: translate(55vw, -30vh) scale(var(--s, 1)); }
  85% { opacity: 0.45; }
  100% { opacity: 0; transform: translate(112vw, -55vh) scale(var(--s, 1)); }
}
@keyframes gbhw-sway { from { transform: translateX(-6px) rotate(-4deg); } to { transform: translateX(6px) rotate(4deg); } }

/* s142o: flying jack-o'-lanterns on bat wings */
.gbhw-pkfly { left: -130px; width: 120px; height: 70px; animation: gbhw-pkfly var(--d, 13s) linear forwards; will-change: transform; }
.gbhw-pkfly.back { left: auto; right: -130px; animation-name: gbhw-pkfly-back; }
.gbhw-pkfly-body { position: relative; width: 100%; height: 100%; animation: gbhw-pkbob 1.5s ease-in-out infinite alternate; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.55)); }
.gbhw-pkfly .gbhw-pk { position: absolute; left: 36px; top: 8px; width: 48px; height: 48px; }
.gbhw-pkfly .gbhw-wing { position: absolute; top: 12px; width: 46px; height: 31px; animation: gbhw-wing-l 0.34s ease-in-out infinite alternate; transform-origin: 100% 35%; }
.gbhw-pkfly .gbhw-wing:first-child { left: 0; }
.gbhw-pkfly .gbhw-wing.r { left: auto; right: 0; animation-name: gbhw-wing-r; transform-origin: 0 35%; }
@keyframes gbhw-wing-l { from { transform: rotate(-28deg); } to { transform: rotate(22deg) scaleY(0.75); } }
@keyframes gbhw-wing-r { from { transform: rotate(28deg); } to { transform: rotate(-22deg) scaleY(0.75); } }
@keyframes gbhw-pkbob { from { transform: translateY(-5px) rotate(-7deg); } to { transform: translateY(5px) rotate(6deg); } }
@keyframes gbhw-pkfly {
  0% { transform: translate(0, 0) scale(var(--s, 1)); }
  30% { transform: translate(34vw, var(--y1, -6vh)) scale(var(--s, 1)); }
  62% { transform: translate(70vw, var(--y2, 4vh)) scale(var(--s, 1)); }
  100% { transform: translate(calc(100vw + 240px), var(--y1, -6vh)) scale(var(--s, 1)); }
}
@keyframes gbhw-pkfly-back {
  0% { transform: translate(0, 0) scale(var(--s, 1)); }
  30% { transform: translate(-34vw, var(--y2, 4vh)) scale(var(--s, 1)); }
  62% { transform: translate(-70vw, var(--y1, -6vh)) scale(var(--s, 1)); }
  100% { transform: translate(calc(-100vw - 240px), var(--y2, 4vh)) scale(var(--s, 1)); }
}

/* ---------- inside the Gaming Room ---------- */
.gbhw-room { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.gbhw-eyes { position: absolute; width: 34px; height: 12px; opacity: 0; animation: gbhw-eyes var(--d, 9s) ease-in-out infinite; animation-delay: var(--dl, 0s); }
.gbhw-eyes i { position: absolute; top: 0; width: 11px; height: 7px; border-radius: 50% 50% 45% 45%; background: var(--c, #ffd23f); box-shadow: 0 0 10px var(--c, #ffd23f), 0 0 20px var(--c, #ffd23f); }
.gbhw-eyes i:last-child { right: 0; }
@keyframes gbhw-eyes { 0%, 30%, 100% { opacity: 0; transform: scaleY(1); } 36%, 58% { opacity: 0.95; } 47% { transform: scaleY(0.1); } 49% { transform: scaleY(1); } 64% { opacity: 0; } }
.gbhw-lantern { position: absolute; bottom: 4%; width: var(--w, 64px); height: var(--w, 64px); overflow: visible; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); }
/* s142o: the room's lanterns light up one by one: rise a little, the candle catches */
.gbhw-lantern { animation: gbhw-light 1.3s cubic-bezier(0.22, 1, 0.36, 1) var(--in, 0.5s) both; }
@keyframes gbhw-light { 0% { opacity: 0; transform: translateY(16px) scale(0.86); filter: brightness(0.25) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); } 45% { opacity: 1; filter: brightness(0.6) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); } 62% { filter: brightness(1.25) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); } 74% { filter: brightness(0.85) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); } 100% { opacity: 1; transform: none; filter: brightness(1) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.55)); } }
/* s142n: candle light behind the carved face; uneven, never in step (each pumpkin has its own delay) */
.gbhw-pk-fire { animation: gbhw-flame 2.9s linear infinite; }
@keyframes gbhw-flame { 0% { opacity: 0.86; } 7% { opacity: 1; } 12% { opacity: 0.9; } 26% { opacity: 0.98; } 38% { opacity: 0.76; } 47% { opacity: 1; } 63% { opacity: 0.9; } 78% { opacity: 0.97; } 88% { opacity: 0.8; } 100% { opacity: 0.86; } }
@keyframes gbhw-candle { 0%, 100% { opacity: 1; } 30% { opacity: 0.72; } 55% { opacity: 0.92; } 75% { opacity: 0.6; } }
.gbhw-moon { position: absolute; top: 6%; right: 6%; width: 90px; height: 90px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff6d8, #f2d58a 60%, #c99a3a); box-shadow: 0 0 40px rgba(255, 220, 140, 0.55), 0 0 90px rgba(255, 180, 80, 0.3); opacity: 0.85; }

/* ---------- graveyard scene before the footer ---------- */
#gbhw-scene { position: relative; overflow: hidden; height: 220px; margin: 0; background: linear-gradient(#0b0412 0%, #1a0b26 55%, #0b0412 100%); border-top: 1px solid rgba(255, 122, 26, 0.25); }
#gbhw-scene svg.land { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; }
#gbhw-scene .gbhw-scene-text { position: absolute; left: 0; right: 0; top: 26px; text-align: center; padding: 0 16px; }
#gbhw-scene h2 { margin: 0 0 6px; font: 900 clamp(26px, 4vw, 44px)/1.05 Inter, system-ui, sans-serif; letter-spacing: 0.04em; text-transform: uppercase; color: #ffb347; text-shadow: 0 0 18px rgba(255, 122, 26, 0.75), 0 2px 0 #3a1200; }
#gbhw-scene p { margin: 0; font: 700 13px/1.4 Inter, system-ui, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; color: #e7d9ff; opacity: 0.9; }
#gbhw-scene .lamp { animation: gbhw-candle 1.8s steps(6, end) infinite; }
html.gb-hw[data-gb-theme="light"] #gbhw-scene { background: linear-gradient(#f7ecff 0%, #ffe3c7 70%, #f7ecff 100%); }
html.gb-hw[data-gb-theme="light"] #gbhw-scene h2 { color: #d4570a; text-shadow: none; }
html.gb-hw[data-gb-theme="light"] #gbhw-scene p { color: #4a2a5e; }

/* ---------- music button ---------- */
#gbhw-music {
  position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 2147483001;
  display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px 0 8px;
  border: 1px solid rgba(255, 122, 26, 0.65); border-radius: 999px; background: rgba(14, 6, 20, 0.9); color: #ffd9b8;
  font: 700 13px/1 Inter, system-ui, sans-serif; letter-spacing: 0.02em;
  box-shadow: 0 0 22px rgba(255, 122, 26, 0.35), 0 8px 24px rgba(0, 0, 0, 0.5);
  cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; user-select: none; -webkit-user-select: none;
  transition: transform 140ms var(--hw-ease), box-shadow 200ms ease, border-color 200ms ease;
  animation: gbhw-beckon 3.2s ease-in-out infinite;
}
#gbhw-music svg { width: 34px; height: 34px; flex: none; margin-top: -3px; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.5)); }
#gbhw-music:active { transform: scale(0.96); }
#gbhw-music:focus-visible { outline: 2px solid var(--hw-pumpkin); outline-offset: 3px; }
#gbhw-music[aria-pressed="true"] { animation: none; border-color: var(--hw-pumpkin); box-shadow: 0 0 28px rgba(255, 122, 26, 0.6), 0 8px 24px rgba(0, 0, 0, 0.5); }
@keyframes gbhw-beckon { 0%, 100% { box-shadow: 0 0 14px rgba(255, 122, 26, 0.25), 0 8px 24px rgba(0, 0, 0, 0.5); } 50% { box-shadow: 0 0 30px rgba(255, 122, 26, 0.6), 0 8px 24px rgba(0, 0, 0, 0.5); } }
#gbhw-music .gbhw-eq { display: none; gap: 2px; align-items: flex-end; height: 14px; }
#gbhw-music[aria-pressed="true"] .gbhw-eq { display: inline-flex; }
#gbhw-music .gbhw-eq i { display: block; width: 3px; background: var(--hw-pumpkin); border-radius: 2px; animation: gbhw-eq 0.9s ease-in-out infinite alternate; }
#gbhw-music .gbhw-eq i:nth-child(2) { animation-delay: -0.3s; }
#gbhw-music .gbhw-eq i:nth-child(3) { animation-delay: -0.6s; }
@keyframes gbhw-eq { from { height: 3px; } to { height: 14px; } }
@media (hover: hover) and (pointer: fine) { #gbhw-music:hover { border-color: var(--hw-pumpkin); } }

/* ---------- light theme: decoration yes, night no ---------- */
html.gb-hw[data-gb-theme="light"] :is(.gbhw-fog, .gbhw-vignette, .gbhw-flash) { display: none; }
html.gb-hw[data-gb-theme="light"] .gbhw-web { color: #6b5a7a; opacity: 0.35; }
html.gb-hw[data-gb-theme="light"] #gbhw-music, html.gb-hw[data-gb-theme="light"] .gbhw-pill { background: rgba(255, 248, 240, 0.96); color: #5a2a00; }

/* ---------- phones ---------- */
@media (max-width: 900px) {
  #gbhw-music { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); left: 12px; padding: 0 8px; height: 46px; }
  #gbhw-music .gbhw-label { display: none; }
  .gbhw-web { width: 78px; height: 78px; }
  .gbhw-web.l { display: none; }
  .gbhw-fog { height: 18vh; }
  .gbhw-garland { height: 24px; }
  .gbhw-pill { font-size: 10px; padding: 7px 12px; letter-spacing: 0.1em; }
  .gbhw-ghost { width: 54px; height: 66px; }
  .gbhw-moon { width: 60px; height: 60px; }
  #gbhw-scene { height: 170px; }
  #gbhw-scene .gbhw-scene-text { top: 18px; }
  #gbhw-scene p { font-size: 11px; letter-spacing: 0.1em; }
}

@media (prefers-reduced-motion: reduce) {
  html.gb-hw header img, .gbhw-fog, .gbhw-garland .bulb, .gbhw-spider, .gbhw-spider .thread, .gbhw-spider svg,
  .gbhw-lantern .glow, #gbhw-scene .lamp, .gbhw-pk-fire, #gbhw-music, #gbhw-music .gbhw-eq i { animation: none !important; }
  .gbhw-bat, .gbhw-ghost, .gbhw-pkfly, .gbhw-eyes, .gbhw-flash, .gbhw-canvas { display: none !important; }
  .gbhw-lantern { animation: none !important; }
}

/* 2026-10-25 (s142e): the music pumpkin sat on the cookie banner's "Reject optional" button on phones; it waits until the visitor has chosen. */
body:has(#consentBanner:not([hidden])) #gbhw-music { visibility: hidden !important; pointer-events: none !important; }