html.sog-theme-halloween {
  background-image: url("/media/images/seasonal/halloween/background-motif.webp");
  background-color: #160b26;
}
html.sog-theme-halloween body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(74, 34, 122, 0.45) 0%, rgba(74, 34, 122, 0) 45%);
}
html.sog-theme-halloween ::-webkit-scrollbar {
  background: #2a1245;
}
html.sog-theme-halloween ::-webkit-scrollbar-thumb {
  background: #ff8a1f;
}
html.sog-theme-halloween header {
  background: #2a1245;
}
html.sog-theme-halloween header #SOG-header-menu {
  background: #160b26;
}
html.sog-theme-halloween header #SOG-xp-bar {
  background: linear-gradient(180deg, #4b2280, #2a1245);
  border-color: #8a5cc8;
  box-shadow: 0 4px 0 rgba(0, 0, 0, 0.35), inset 0 2px 0 rgba(255, 255, 255, 0.12), 0 0 16px rgba(255, 138, 31, 0.2);
}
html.sog-theme-halloween header #SOG-xp-bar::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: 44px;
  height: 44px;
  border-top-left-radius: 18px;
  transform: scaleX(-1);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='rgba(236,222,255,.42)' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M0 0L100 0M0 0L94 38M0 0L72 72M0 0L38 94M0 0L0 100'/%3E%3Cpath d='M26 0Q20 6 24 10Q16 14 18 18Q10 20 10 24Q4 22 0 26'/%3E%3Cpath d='M54 0Q44 12 50 21Q36 28 38 38Q26 38 21 50Q12 44 0 54'/%3E%3Cpath d='M82 0Q68 18 77 32Q56 42 58 58Q42 56 32 77Q18 68 0 82'/%3E%3C/g%3E%3C/svg%3E") no-repeat 0 0/100% 100%;
  pointer-events: none;
}
html.sog-theme-halloween header #SOG-xp-bar .xp-rank {
  color: #2a0e00;
  background: linear-gradient(180deg, #ffb04a, #ff7d12);
  box-shadow: 0 2px 0 #8a3a05;
}
html.sog-theme-halloween header #SOG-xp-bar .xp-track {
  background: rgba(14, 5, 26, 0.72);
}
html.sog-theme-halloween header #SOG-xp-bar:not(.is-max) .xp-fill {
  background: repeating-linear-gradient(-45deg, transparent 0 25%, rgba(255, 240, 200, 0.2) 25% 50%) 0 0/20px 20px, linear-gradient(90deg, #8a35e0, #ff6a1a 72%, #ffb03a);
  animation: sogHwPotion 1.4s linear infinite;
}
html.sog-theme-halloween header #SOG-xp-bar .xp-coins {
  background: #f6ecff;
}
html.sog-theme-halloween header #SOG-xp-bar .xp-coins b {
  color: #2a1245;
}
html.sog-theme-halloween main #SOG-rail {
  background: linear-gradient(180deg, #2a1245 0%, #170c29 100%);
}
html.sog-theme-halloween #SOG-lobby-section .games-container .game-icon {
  background-color: rgba(42, 18, 69, 0.62);
}
html.sog-theme-halloween #SOG-lobby-section .games-container .game-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 101;
  border-radius: inherit;
  box-shadow: inset 0 0 0 3px #ff8a1f;
  opacity: 0;
  transition: opacity 0.15s;
  pointer-events: none;
}
html.sog-theme-halloween #SOG-lobby-section .games-container .game-icon:hover::after {
  opacity: 1;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero,
html.sog-theme-halloween #SOG-friends-section .sf-hero {
  background: #2b1d33;
  border-color: rgba(255, 138, 31, 0.3);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero::after,
html.sog-theme-halloween #SOG-friends-section .sf-hero::after {
  background: linear-gradient(90deg, rgba(22, 8, 40, 0.78), rgba(22, 8, 40, 0.45) 26%, rgba(22, 8, 40, 0) 46%);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground {
  background: linear-gradient(180deg, #ffa13d, #f07412);
  border-color: #ffc27a;
  box-shadow: 0 6px 0 #8a3a05, 0 12px 18px rgba(14, 5, 26, 0.45), 0 0 22px rgba(255, 138, 31, 0.35);
  color: #2a1245;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground::before, html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground::after,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground::before,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground::after {
  content: "";
  position: absolute;
  pointer-events: none;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground::before,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground::before {
  top: 0;
  left: 0;
  width: 32px;
  height: 32px;
  border-top-left-radius: 15px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='rgba(236,222,255,.42)' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M0 0L100 0M0 0L94 38M0 0L72 72M0 0L38 94M0 0L0 100'/%3E%3Cpath d='M26 0Q20 6 24 10Q16 14 18 18Q10 20 10 24Q4 22 0 26'/%3E%3Cpath d='M54 0Q44 12 50 21Q36 28 38 38Q26 38 21 50Q12 44 0 54'/%3E%3Cpath d='M82 0Q68 18 77 32Q56 42 58 58Q42 56 32 77Q18 68 0 82'/%3E%3C/g%3E%3C/svg%3E") no-repeat 0 0/100% 100%;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground::after,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground::after {
  top: -22px;
  right: -16px;
  width: 42px;
  height: 41px;
  background: url("/media/images/seasonal/halloween/footer-pumpkin-3.webp") no-repeat 0 0/100% 100%;
  transform: rotate(12deg);
  filter: drop-shadow(0 3px 3px rgba(14, 5, 26, 0.5));
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground:hover,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground:hover {
  color: #2a1245;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero .sf-ground:active,
html.sog-theme-halloween #SOG-friends-section .sf-hero .sf-ground:active {
  box-shadow: 0 2px 0 #8a3a05, 0 6px 10px rgba(14, 5, 26, 0.4), 0 0 22px rgba(255, 138, 31, 0.35);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .lobby-pals {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(255, 138, 31, 0.32);
  background: linear-gradient(180deg, #2c1450 0%, #1f0f3a 55%, #3d1d4f 100%);
  box-shadow: inset 0 0 26px rgba(0, 0, 0, 0.4), inset 0 -30px 30px -18px rgba(255, 138, 31, 0.32);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .lobby-pals::before, html.sog-theme-halloween #SOG-lobby-section .lobby-playground .lobby-pals::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .lobby-pals::before {
  top: 0;
  right: 0;
  width: 78px;
  height: 78px;
  transform: scaleX(-1);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='rgba(236,222,255,.24)' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M0 0L100 0M0 0L94 38M0 0L72 72M0 0L38 94M0 0L0 100'/%3E%3Cpath d='M26 0Q20 6 24 10Q16 14 18 18Q10 20 10 24Q4 22 0 26'/%3E%3Cpath d='M54 0Q44 12 50 21Q36 28 38 38Q26 38 21 50Q12 44 0 54'/%3E%3Cpath d='M82 0Q68 18 77 32Q56 42 58 58Q42 56 32 77Q18 68 0 82'/%3E%3C/g%3E%3C/svg%3E") no-repeat 0 0/100% 100%;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .lobby-pals::after {
  left: 0;
  right: 0;
  bottom: 0;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 380 24'%3E%3Cg fill='%230e0718'%3E%3Cpath d='M0 24V19Q48 13 96 17T192 16T288 18T380 17V24Z'/%3E%3Cpath d='M38 18V9A7 7 0 0 1 52 9V18Z'/%3E%3Cpath d='M58 18V12A5 5 0 0 1 68 12V18Z'/%3E%3Cpath d='M150 20V12H146V8H150V4H154V8H158V12H154V20Z'/%3E%3Cpath d='M250 18V8A8 8 0 0 1 266 8V18Z'/%3E%3Cpath d='M322 22V15A6 6 0 0 1 334 15V22Z'/%3E%3C/g%3E%3C/svg%3E") repeat-x 0 100%/380px 24px;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-person {
  transition: background-color 0.15s;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-person:hover {
  background-color: rgba(255, 138, 31, 0.08);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-person-text b {
  text-shadow: 0 0 8px rgba(190, 140, 255, 0.45);
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-avatar-art {
  border-color: #ff8a1f;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-person:has(.sf-bot-level.is-hard) .sf-avatar-art {
  border-color: #ef4444;
  animation: sogHwMenace 1.8s ease-in-out infinite alternate;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-dot {
  border-color: #1b0d33;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-bot-tag {
  background: #b48ae0;
  color: #1b0f2b;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-challenge {
  background: #ff8a1f;
  border-color: #ffb35c;
  box-shadow: 0 3px 0 #a3480b;
  color: #2a1245;
}
html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-challenge:active:not(:disabled) {
  box-shadow: 0 1px 0 #a3480b;
}
html.sog-theme-halloween .sog-hw-decor {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
html.sog-theme-halloween .sog-hw-web {
  position: absolute;
  top: 0;
  width: 84px;
  height: 84px;
  stroke: rgba(236, 222, 255, 0.2);
  stroke-width: 1.6;
}
html.sog-theme-halloween .sog-hw-web.is-left {
  left: 0;
}
html.sog-theme-halloween .sog-hw-web.is-right {
  right: 0;
  transform: scaleX(-1);
}
html.sog-theme-halloween .sog-hw-page-webs {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 0;
  pointer-events: none;
}
html.sog-theme-halloween .sog-hw-page-webs .sog-hw-web {
  stroke: rgba(236, 222, 255, 0.17);
  stroke-width: 1.3;
}
html.sog-theme-halloween .sog-hw-page-webs .is-screen-corner {
  position: fixed;
  top: auto;
  right: 0;
  bottom: 0;
  width: 176px;
  height: 176px;
  transform: rotate(180deg);
}
html.sog-theme-halloween .sog-hw-spider {
  position: fixed;
  top: var(--header-height);
  left: calc(var(--sog-rail-w) + 30px);
  z-index: 8998;
  width: 38px;
  pointer-events: none;
  animation: sogHwSway 5s ease-in-out infinite alternate;
  transform-origin: 50% 0;
}
html.sog-theme-halloween .sog-hw-spider .sog-hw-thread {
  display: block;
  width: 1.5px;
  height: 46px;
  margin: 0 auto;
  background: linear-gradient(180deg, rgba(236, 222, 255, 0.45), rgba(236, 222, 255, 0.2));
  animation: sogHwReel 3.6s ease-in-out infinite alternate;
}
html.sog-theme-halloween .sog-hw-spider .sog-hw-spider-body {
  display: block;
  width: 100%;
  margin-top: -4px;
}
html.sog-theme-halloween.sog-rail-collapsed .sog-hw-spider {
  left: 30px;
}
html.sog-theme-halloween footer #footer-forest {
  background: linear-gradient(180deg, #10061d 0%, #221040 45%, #3a1a56 100%);
  border-top-color: rgba(255, 138, 31, 0.35);
}
html.sog-theme-halloween footer #footer-forest:not(.is-playing) .footer-torch::before, html.sog-theme-halloween footer #footer-forest:not(.is-playing) .footer-torch::after {
  animation-play-state: paused;
}
html.sog-theme-halloween footer #footer-sky .footer-moon-glow {
  background: radial-gradient(circle, rgba(255, 170, 80, 0.17), rgba(255, 140, 60, 0.05) 40%, transparent 66%);
}
html.sog-theme-halloween footer #footer-sky .footer-moon {
  background: radial-gradient(circle at 36% 34%, #fff3d1, #ffc870 55%, #f0922e);
  box-shadow: 0 0 40px 10px rgba(255, 180, 90, 0.32), 0 0 120px 40px rgba(255, 140, 60, 0.14);
}
html.sog-theme-halloween footer #footer-sky .footer-moon span:nth-child(1), html.sog-theme-halloween footer #footer-sky .footer-moon span:nth-child(2) {
  background: rgba(200, 110, 30, 0.32);
}
html.sog-theme-halloween footer #footer-sky .footer-trees-far {
  filter: brightness(0.42) saturate(1.1) hue-rotate(45deg);
}
html.sog-theme-halloween footer #footer-sky .footer-trees-near::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 28px;
  height: 70px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 70'%3E%3Cg fill='%237d64a6'%3E%3Cpath d='M60 70V34A15 15 0 0 1 90 34V70Z'/%3E%3Cpath d='M118 70L114 46A9 9 0 0 1 131 43L136 70Z'/%3E%3Cpath d='M210 70V36H200V28H210V16H218V28H228V36H218V70Z'/%3E%3Cpath d='M330 70V30L338 20L346 30V70Z'/%3E%3Cpath d='M420 70V40A13 13 0 0 1 446 40V70Z'/%3E%3Cpath d='M520 70L523 42L513 41L514 34L524 35L525 24L532 25L531 36L541 37L540 44L530 43L527 70Z'/%3E%3Cpath d='M566 70V52A8 8 0 0 1 582 52V70Z'/%3E%3C/g%3E%3C/svg%3E") repeat-x 40px 100%/600px 70px;
}
html.sog-theme-halloween footer #footer-sky .footer-fog {
  background: radial-gradient(ellipse 40% 50% at 30% 60%, rgba(190, 140, 255, 0.15), transparent 70%), radial-gradient(ellipse 35% 45% at 75% 50%, rgba(140, 255, 170, 0.1), transparent 70%);
}
html.sog-theme-halloween footer #footer-sky .footer-ghost span {
  filter: drop-shadow(0 0 18px rgba(170, 255, 190, 0.4));
}
html.sog-theme-halloween footer #footer-content #footer-feedback a {
  color: #ff8a1f;
}
html.sog-theme-halloween footer #footer-content #footer-feedback a:hover {
  color: #ffc27a;
}
html.sog-theme-halloween footer #footer-content .footer-store-badge {
  background: rgba(30, 12, 52, 0.78);
  border-color: rgba(190, 140, 255, 0.4);
}
html.sog-theme-halloween footer #footer-content .footer-store-badge:hover {
  border-color: rgba(255, 138, 31, 0.85);
}
html.sog-theme-halloween footer #footer-content #footer-right h3 {
  color: #ffb35c;
}
html.sog-theme-halloween footer #footer-content #footer-right a {
  color: #d6b8ff;
}
html.sog-theme-halloween footer #footer-content #footer-right a:hover {
  color: #fff;
}
html.sog-theme-halloween footer #footer-cluster .footer-mushroom-a,
html.sog-theme-halloween footer #footer-cluster .footer-mushroom-b,
html.sog-theme-halloween footer #footer-cluster .footer-flower {
  display: none;
}
html.sog-theme-halloween footer #footer-cluster .footer-torch::before,
html.sog-theme-halloween footer #footer-cluster .footer-torch::after {
  content: "";
  position: absolute;
  bottom: 2px;
  background: no-repeat 0 0/100% 100%;
  animation: sogHwLantern 2.2s ease-in-out infinite;
}
html.sog-theme-halloween footer #footer-cluster .footer-torch::after {
  left: 40px;
  width: 64px;
  height: 63px;
  background-image: url("/media/images/seasonal/halloween/footer-pumpkin-1.webp");
}
html.sog-theme-halloween footer #footer-cluster .footer-torch::before {
  left: 100px;
  width: 42px;
  height: 41px;
  background-image: url("/media/images/seasonal/halloween/footer-pumpkin-3.webp");
  animation-delay: -1.1s;
}
html.sog-theme-halloween footer #footer-cluster .footer-torch.footer-torch-late::before {
  display: none;
}
html.sog-theme-halloween footer #footer-cluster .footer-torch.footer-torch-late::after {
  left: 80px;
  width: 54px;
  height: 53px;
  background-image: url("/media/images/seasonal/halloween/footer-pumpkin-2.webp");
  animation-delay: -0.6s;
}
html.sog-theme-halloween footer #footer-fireflies span:nth-child(odd) {
  background: #ffb347;
  box-shadow: 0 0 12px 4px rgba(255, 140, 40, 0.6);
}
html.sog-theme-halloween footer #mr-farts-footer-link:focus-visible .mr-farts-app-tag {
  outline-color: #ff8a1f;
}
html.sog-theme-halloween:has(#SOG-game-container) .sog-hw-spider,
html.sog-theme-halloween:has(#SOG-game-container) .sog-hw-page-webs, html.sog-theme-halloween:has(#SOG-playground) .sog-hw-spider,
html.sog-theme-halloween:has(#SOG-playground) .sog-hw-page-webs {
  display: none;
}
@media (max-width: 600px) {
  html.sog-theme-halloween .sog-hw-spider,
  html.sog-theme-halloween .sog-hw-page-webs {
    display: none;
  }
  html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-hero::after,
  html.sog-theme-halloween #SOG-friends-section .sf-hero::after {
    background: linear-gradient(180deg, rgba(22, 8, 40, 0.66), rgba(22, 8, 40, 0.28) 42%, rgba(22, 8, 40, 0) 60%);
  }
}
@media (prefers-reduced-motion: reduce) {
  html.sog-theme-halloween .sog-hw-spider,
  html.sog-theme-halloween .sog-hw-spider .sog-hw-thread {
    animation: none;
  }
  html.sog-theme-halloween #SOG-lobby-section .lobby-playground .sf-avatar-art,
  html.sog-theme-halloween header #SOG-xp-bar:not(.is-max) .xp-fill,
  html.sog-theme-halloween footer .footer-torch::before,
  html.sog-theme-halloween footer .footer-torch::after {
    animation: none;
  }
}

@keyframes sogHwSway {
  from {
    transform: rotate(-3deg);
  }
  to {
    transform: rotate(3deg);
  }
}
@keyframes sogHwReel {
  from {
    height: 38px;
  }
  to {
    height: 56px;
  }
}
@keyframes sogHwPotion {
  from {
    background-position: 0 0, 0 0;
  }
  to {
    background-position: 20px 0, 0 0;
  }
}
@keyframes sogHwLantern {
  0%, 100% {
    filter: drop-shadow(0 0 6px rgba(255, 150, 40, 0.45));
  }
  40% {
    filter: drop-shadow(0 0 14px rgba(255, 170, 50, 0.8));
  }
  70% {
    filter: drop-shadow(0 0 9px rgba(255, 150, 40, 0.6));
  }
}
@keyframes sogHwMenace {
  from {
    box-shadow: 0 0 4px rgba(239, 68, 68, 0.5);
  }
  to {
    box-shadow: 0 0 12px 2px rgba(239, 68, 68, 0.9);
  }
}