/* Habboon FPL Halloween UI — October preview */
body.halloween-ui{
  --bg:#090711;
  --bg-deep:#030207;
  --panel:#100b16;
  --panel-2:#17101f;
  --panel-3:#21142a;
  --line:rgba(255,139,36,.18);
  --line-strong:rgba(255,163,58,.34);
  --text:#fff8ee;
  --muted:#b1a6bd;
  --muted-2:#7c6d8d;
  --teal:#ff8a21;
  --teal-dark:#c94d08;
  --gold:#ffbf4b;
  --amber:#ff8a21;
  --blue:#a778ff;
  --shadow:0 26px 70px rgba(0,0,0,.42);
  background:#030207!important;
  color:var(--text);
}
body.halloween-ui::selection{background:rgba(255,128,30,.34)}
body.halloween-ui::-webkit-scrollbar-thumb{background:#5d2e2d;border-color:#090611}
body.halloween-ui .app-shell,
body.halloween-ui .workspace{position:relative;z-index:2}
body.halloween-ui .workspace{background:linear-gradient(180deg,rgba(4,3,9,.16),rgba(4,3,9,.48))}

/* Full-site haunted stadium atmosphere */
.halloween-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:
  linear-gradient(180deg,rgba(3,2,7,.08),rgba(3,2,7,.28) 48%,rgba(3,2,7,.76)),
  url('/halloween-stadium.svg?v=17.28.0-halloween-preview') center top/cover no-repeat;opacity:0;transition:opacity .35s ease}
body.halloween-ui .halloween-atmosphere{opacity:1}
.halloween-atmosphere .halloween-web{position:absolute;width:min(26vw,360px);aspect-ratio:1;background:url('/halloween-web.svg?v=17.28.0-halloween-preview') center/contain no-repeat;opacity:.8}
.halloween-atmosphere .halloween-web.left{left:0;top:72px}
.halloween-atmosphere .halloween-web.right{right:0;top:72px;transform:scaleX(-1)}
.halloween-atmosphere .halloween-pumpkin{position:absolute;bottom:-42px;width:clamp(150px,15vw,250px);aspect-ratio:1;background:url('/halloween-pumpkin.svg?v=17.28.0-halloween-preview') center/contain no-repeat;filter:drop-shadow(0 0 28px rgba(255,104,18,.36));opacity:.9}
.halloween-atmosphere .halloween-pumpkin.left{left:-42px;transform:rotate(-6deg)}
.halloween-atmosphere .halloween-pumpkin.right{right:-42px;transform:rotate(7deg) scale(.88)}
.halloween-fog{position:absolute;left:-12%;width:124%;height:190px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(167,116,221,.19),rgba(77,46,102,.08) 42%,transparent 72%);filter:blur(25px);opacity:.55}
.halloween-fog.one{bottom:60px;animation:halloweenFog 16s ease-in-out infinite alternate}
.halloween-fog.two{bottom:250px;opacity:.28;animation:halloweenFog 22s ease-in-out infinite alternate-reverse}
@keyframes halloweenFog{from{transform:translateX(-4%) scaleX(1)}to{transform:translateX(4%) scaleX(1.08)}}
.halloween-bat{position:absolute;width:32px;height:16px;opacity:.7;filter:drop-shadow(0 4px 4px rgba(0,0,0,.5));animation:halloweenBat linear infinite}
.halloween-bat::before,.halloween-bat::after{content:"";position:absolute;top:5px;width:18px;height:10px;background:#08040d;clip-path:polygon(0 20%,40% 45%,100% 0,75% 100%,43% 66%,0 100%)}
.halloween-bat::before{left:0}.halloween-bat::after{right:0;transform:scaleX(-1)}
.halloween-bat.b1{top:15%;left:-8%;animation-duration:22s;animation-delay:-4s}.halloween-bat.b2{top:26%;left:-12%;transform:scale(.7);animation-duration:28s;animation-delay:-16s}.halloween-bat.b3{top:10%;left:-10%;transform:scale(1.25);animation-duration:34s;animation-delay:-24s}
@keyframes halloweenBat{0%{translate:-10vw 0}45%{translate:55vw -5vh}100%{translate:120vw 4vh}}
.halloween-ember{position:absolute;bottom:-20px;width:3px;height:3px;border-radius:50%;background:#ff8c2b;box-shadow:0 0 10px #ff5a10;animation:halloweenEmber linear infinite;opacity:.75}
@keyframes halloweenEmber{0%{transform:translateY(0) scale(.8);opacity:0}12%{opacity:.8}100%{transform:translateY(-72vh) translateX(38px) scale(0);opacity:0}}

/* Header */
body.halloween-ui .topbar,
body.halloween-ui .hbn-site-header{background:linear-gradient(180deg,rgba(8,4,13,.97),rgba(8,5,14,.88))!important;border-bottom-color:rgba(255,130,29,.28)!important;box-shadow:0 10px 40px rgba(0,0,0,.28),0 1px 0 rgba(255,130,29,.08)!important}
body.halloween-ui .hbn-site-header__inner::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#ff7a16 28%,#b56dff 68%,transparent);opacity:.72}
body.halloween-ui .desktop-nav-link.active,
body.halloween-ui .desktop-nav-link:hover{color:#ffe7cd!important}
body.halloween-ui .desktop-nav-link:after{background:linear-gradient(90deg,#ff7a16,#ffb63e)!important;box-shadow:0 0 16px rgba(255,119,18,.68)}
body.halloween-ui .hbn-site-actions__icon,
body.halloween-ui .hbn-site-actions__manager,
body.halloween-ui .hbn-site-actions__profile,
body.halloween-ui .staff-console-top-button{border-color:rgba(255,135,31,.22)!important;background:rgba(31,15,28,.68)!important}
body.halloween-ui .hbn-site-actions__icon:hover,
body.halloween-ui .hbn-site-actions__manager:hover,
body.halloween-ui .hbn-site-actions__profile:hover{border-color:rgba(255,143,38,.52)!important;box-shadow:0 0 22px rgba(255,99,15,.14)}
.halloween-preview-chip{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 12px;border:1px solid rgba(255,139,31,.42);border-radius:999px;background:linear-gradient(135deg,rgba(108,38,10,.7),rgba(44,17,47,.76));color:#ffd6a2;box-shadow:inset 0 1px rgba(255,255,255,.07),0 0 24px rgba(255,103,14,.15);font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.halloween-preview-chip b{font-size:15px;line-height:1}.halloween-preview-chip:hover{transform:translateY(-1px);border-color:#ff9b38;box-shadow:0 0 28px rgba(255,104,15,.28)}
.halloween-preview-chip.off{filter:saturate(.45);opacity:.78}

/* Homepage takeover banner */
.halloween-hero-banner{position:relative;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 20px;padding:14px 16px;border:1px solid rgba(255,138,32,.36);border-radius:15px;background:linear-gradient(105deg,rgba(116,39,8,.78),rgba(42,13,49,.84) 58%,rgba(13,7,21,.86));box-shadow:inset 0 1px rgba(255,255,255,.08),0 15px 38px rgba(0,0,0,.24),0 0 30px rgba(255,89,11,.08);overflow:hidden}
.halloween-hero-banner::after{content:"";position:absolute;right:18%;top:-28px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#f4e8d7 0 17%,rgba(172,130,215,.22) 18% 48%,transparent 70%);opacity:.48}
.halloween-hero-banner>span{position:relative;z-index:2;display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;background:rgba(10,5,14,.62);font-size:28px;filter:drop-shadow(0 0 10px rgba(255,106,18,.45))}
.halloween-hero-banner>div{position:relative;z-index:2;min-width:0;flex:1}.halloween-hero-banner small,.halloween-hero-banner strong{display:block}.halloween-hero-banner small{color:#ffad56;font-size:8px;font-weight:950;letter-spacing:.16em;text-transform:uppercase}.halloween-hero-banner strong{margin-top:4px;font-size:18px;color:#fff4e8}.halloween-hero-banner em{position:relative;z-index:2;font-style:normal;color:#d9c8e8;font-size:10px}

/* Heroes become unmistakably Halloween */
body.halloween-ui :is(.home-hero,.real-live-hero,.manager-profile-showcase,.my-season-command-hero,.league-championship-hero,.cup-hero,.news-article-hero,.rules-handbook-hero,.season-timeline-hero,.rivalry-showdown-hero,.vegas-marquee,.weekly-spin-hero){position:relative;isolation:isolate;border-color:rgba(255,135,31,.32)!important;box-shadow:0 26px 70px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.07),0 0 0 1px rgba(113,57,147,.08)!important;background-image:linear-gradient(90deg,rgba(7,4,11,.76),rgba(16,6,23,.62) 50%,rgba(3,3,8,.82)),url('/halloween-stadium.svg?v=17.28.0-halloween-preview')!important;background-position:center 36%!important;background-size:cover!important}
body.halloween-ui :is(.home-hero,.real-live-hero,.my-season-command-hero,.league-championship-hero,.cup-hero,.rules-handbook-hero,.season-timeline-hero,.rivalry-showdown-hero,.vegas-marquee)::after{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;background:radial-gradient(circle at 84% 15%,rgba(226,214,236,.22),transparent 10%),radial-gradient(circle at 80% 17%,rgba(156,99,218,.15),transparent 27%),linear-gradient(180deg,transparent 48%,rgba(255,91,11,.06))!important}
body.halloween-ui .home-hero{min-height:560px}
body.halloween-ui .home-title span:first-child::before{content:"Halloween ";color:#ff9a36;text-shadow:0 0 20px rgba(255,111,18,.24)}
body.halloween-ui .home-title span:first-child{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.035em}
body.halloween-ui .home-title span:last-child{font-family:Georgia,"Times New Roman",serif}
body.halloween-ui .eyebrow,
body.halloween-ui .page-head .eyebrow{color:#ff9a35!important;text-shadow:0 0 16px rgba(255,100,10,.22)}

/* Cards, panels and tables */
body.halloween-ui :is(.panel,.home-news-feature,.home-leader-card,.my-manager-hub,.home-hero-pulse,.home-status-item,.mobile-v23-card,.my-season-dashboard-card,.my-season-competition-card,.manager-card,.record-card,.fixture-card,.league-card,.article-card,.stats-card,.prize-card,.monthly-card,.cup-round-at-glance,.cup-overview-feature,.cup-competition-timeline){border-color:rgba(255,141,34,.18)!important;background:linear-gradient(145deg,rgba(18,11,24,.94),rgba(8,6,13,.95))!important;box-shadow:inset 0 1px rgba(255,255,255,.035),0 18px 44px rgba(0,0,0,.22)!important}
body.halloween-ui :is(.panel,.home-news-feature,.home-leader-card,.my-manager-hub,.my-season-dashboard-card,.my-season-competition-card,.manager-card,.record-card,.fixture-card,.league-card,.article-card,.stats-card,.prize-card,.monthly-card):hover{border-color:rgba(255,149,43,.38)!important;box-shadow:inset 0 1px rgba(255,255,255,.05),0 18px 46px rgba(0,0,0,.3),0 0 28px rgba(255,92,9,.06)!important}
body.halloween-ui .panel-head,
body.halloween-ui .table-head,
body.halloween-ui th{border-color:rgba(255,134,31,.14)!important}
body.halloween-ui tr:hover td{background:rgba(255,119,24,.035)!important}
body.halloween-ui .badge.teal,
body.halloween-ui .connection-pill{color:#ffb15d!important;border-color:rgba(255,139,32,.28)!important;background:rgba(255,111,18,.08)!important}

/* Buttons and controls */
body.halloween-ui .action-button,
body.halloween-ui .pill-button.active,
body.halloween-ui button.primary,
body.halloween-ui .manager-profile-action.primary{border-color:rgba(255,145,43,.5)!important;background:linear-gradient(135deg,#b83f08,#6f240d 52%,#3c1439)!important;color:#fff4e6!important;box-shadow:inset 0 1px rgba(255,255,255,.12),0 10px 28px rgba(150,42,4,.28)!important}
body.halloween-ui .action-button:hover,
body.halloween-ui .pill-button:hover,
body.halloween-ui button.primary:hover{border-color:#ff9d3f!important;box-shadow:0 0 28px rgba(255,98,14,.23)!important}
body.halloween-ui input,
body.halloween-ui select,
body.halloween-ui textarea{border-color:rgba(255,141,34,.18)!important;background:rgba(10,6,15,.86)!important}
body.halloween-ui input:focus,
body.halloween-ui select:focus,
body.halloween-ui textarea:focus{border-color:rgba(255,145,42,.56)!important;box-shadow:0 0 0 3px rgba(255,111,20,.08)!important}

/* My Manager desktop + mobile */
body.halloween-ui .my-manager-menu-dialog,
body.halloween-ui .my-manager-mobile-sheet,
body.halloween-ui .app-bottom-sheet,
body.halloween-ui .alert-centre-sheet{border-color:rgba(255,143,36,.28)!important;background:linear-gradient(155deg,rgba(25,12,28,.98),rgba(7,5,12,.99))!important;box-shadow:0 34px 100px rgba(0,0,0,.64),0 0 50px rgba(119,55,149,.12)!important}
body.halloween-ui .my-manager-menu-dialog::before,
body.halloween-ui .my-manager-mobile-sheet::before{content:"";position:absolute;right:18px;top:18px;width:72px;height:72px;border-radius:50%;background:radial-gradient(circle,#efe8dc 0 22%,rgba(153,101,201,.19) 23% 56%,transparent 70%);opacity:.42;pointer-events:none}
body.halloween-ui .my-manager-menu-links button,
body.halloween-ui .mobile-manager-shortcut,
body.halloween-ui .mobile-manager-sheet-stats>div,
body.halloween-ui .my-manager-menu-stats>div{border-color:rgba(255,137,31,.16)!important;background:linear-gradient(145deg,rgba(32,16,34,.72),rgba(9,7,14,.86))!important}
body.halloween-ui .my-manager-menu-links button:hover,
body.halloween-ui .mobile-manager-shortcut:active{border-color:rgba(255,143,37,.44)!important;background:rgba(93,35,34,.34)!important}
body.halloween-ui .my-manager-menu-links button>span,
body.halloween-ui .mobile-manager-shortcut-icon{background:linear-gradient(145deg,rgba(255,120,23,.2),rgba(154,78,213,.15))!important;color:#ff9d42!important}

/* Manager profile */
body.halloween-ui .manager-profile-flagship{--profile-accent:#ff8d28!important;--profile-rank:#ffc369!important}
body.halloween-ui .manager-profile-showcase{background-image:linear-gradient(90deg,rgba(12,5,16,.82),rgba(31,10,34,.58),rgba(4,3,9,.82)),url('/halloween-stadium.svg?v=17.28.0-halloween-preview')!important}
body.halloween-ui .manager-profile-avatar-stage::after{content:"";position:absolute;left:50%;bottom:4px;width:210px;height:65px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,rgba(255,110,22,.25),rgba(143,73,191,.12) 46%,transparent 72%);filter:blur(4px);pointer-events:none}
body.halloween-ui .manager-profile-rank-card{border-color:rgba(255,139,31,.28)!important;background:linear-gradient(145deg,rgba(33,14,33,.82),rgba(7,6,13,.82))!important}

/* Live centre */
body.halloween-ui[data-page="live"] .real-live-kicker:not(.offline){color:#ffad51!important}
body.halloween-ui[data-page="live"] .header-live-dot.active,
body.halloween-ui[data-page="live"] .real-live-kicker i{background:#ff7418!important;box-shadow:0 0 14px #ff5410!important}
body.halloween-ui[data-page="live"] .matchday-mobile-scorebar,
body.halloween-ui[data-page="live"] .matchday-dashboard-tabs{border-color:rgba(255,136,30,.2)!important;background:rgba(10,6,15,.93)!important}
body.halloween-ui[data-page="live"] .football-event-card.goal{box-shadow:inset 3px 0 #ff7a18,0 0 24px rgba(255,83,10,.08)!important}

/* Page-specific atmospheric accents */
body.halloween-ui[data-page="news"] .news-grid>*:first-child:after,
body.halloween-ui[data-page="news"] .article-grid>*:first-child:after{content:"Fresh from the crypt"!important;background:linear-gradient(135deg,#d6530e,#6a244e)!important;color:#fff4e8!important}
body.halloween-ui[data-page="records"] .page-head::after{content:"☾  Haunted archive";color:#ff9d43;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
body.halloween-ui[data-page="fixtures"] .page-head::after{content:"🎃 October match nights";color:#ff9d43;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
body.halloween-ui .site-footer{border-top-color:rgba(255,133,31,.16)!important;background:rgba(5,3,9,.68)!important}

/* Loading state */
body.halloween-ui .loading-screen{background:linear-gradient(rgba(4,2,8,.68),rgba(4,2,8,.86)),url('/halloween-stadium.svg?v=17.28.0-halloween-preview') center/cover no-repeat!important}
body.halloween-ui .loading-card{border-color:rgba(255,139,31,.28)!important;background:rgba(13,7,18,.9)!important}
body.halloween-ui .loader{border-top-color:#ff8122!important;box-shadow:0 0 18px rgba(255,100,13,.22)}

/* Mobile */
@media(max-width:760px){
  .halloween-preview-chip{min-width:38px;width:38px;padding:0;justify-content:center}.halloween-preview-chip span{display:none}
  .halloween-atmosphere .halloween-web{width:160px;top:62px;opacity:.48}.halloween-atmosphere .halloween-web.left{display:none}
  .halloween-atmosphere .halloween-pumpkin{width:130px;bottom:-30px;opacity:.55}.halloween-atmosphere .halloween-pumpkin.left{display:none}
  .halloween-bat.b2,.halloween-bat.b3,.halloween-fog.two{display:none}
  .halloween-hero-banner{padding:11px 12px;gap:10px}.halloween-hero-banner>span{width:40px;height:40px;flex-basis:40px;font-size:22px}.halloween-hero-banner strong{font-size:14px}.halloween-hero-banner em{display:none}
  body.halloween-ui .home-hero{min-height:0}
  body.halloween-ui :is(.home-hero,.real-live-hero,.manager-profile-showcase,.my-season-command-hero,.league-championship-hero,.cup-hero,.news-article-hero,.rules-handbook-hero,.season-timeline-hero,.rivalry-showdown-hero,.vegas-marquee){background-position:58% top!important}
  body.halloween-ui .topbar{background:rgba(8,4,13,.96)!important}
}

@media(prefers-reduced-motion:reduce){
  .halloween-fog,.halloween-bat,.halloween-ember{animation:none!important}
  .halloween-bat{display:none!important}
}