/* A seasonal layer: the shared calendar removes the decoration automatically. */
[data-halloween-only][hidden], [data-halloween-normal][hidden] { display: none !important; }
.halloween-ribbon { display: flex; align-items: center; gap: 22px; background: #302039; color: #fff2da; border-radius: 18px; padding: 22px 28px; margin-top: 24px; }
.halloween-ribbon > svg { width: 64px; height: 64px; flex: 0 0 64px; transform: rotate(-8deg); }
.halloween-ribbon strong { display: block; font: 600 25px/1.15 Fredoka, sans-serif; }
.halloween-ribbon p { font-size: 13px; color: #e4cde9; margin: 7px 0 0; }
.halloween-ribbon .season-links { margin-left: auto; display: flex; gap: 12px; flex-wrap: wrap; }
.season-links a { font-size: 13px; font-weight: 700; border-bottom: 2px solid #ffab59; padding-block: 6px; white-space: nowrap; }
.season-links a:hover { color: #ffab59; }
.season-badge { display: inline-flex; gap: 8px; align-items: center; font: 700 10px/1.3 GameBody, sans-serif; letter-spacing: 1.4px; text-transform: uppercase; color: #9a4424; }
.season-badge svg { width: 24px; height: 24px; }
.halloween-active .game-card[data-game="pulma"], .halloween-active .game-card[data-game="kiken"] { border-color: #d4a17d; box-shadow: 0 0 0 3px #edc7a128; }
.halloween-active .game-card .season-badge { margin-bottom: 12px; }
.halloween-active .hero .coral { color: #ab4b30; }
.season-ghost { position: absolute; width: 75px; height: 90px; right: 10px; top: -5px; transform: rotate(12deg); filter: drop-shadow(0 7px 0 #33233a13); }
.halloween-active body.game-page { --paper: #211b2b; --ink: #fff1d8; --muted: #d9ccdc; --line: #65536d; --mint: #33263c; --green: #fff1d8; --coral: #ffae66; --game-accent: #ffae66; --game-soft: #35263e; background: radial-gradient(ellipse at 100% 15%, #432947 0, transparent 45%), #211b2b; color: var(--ink); color-scheme: dark; }
.halloween-active .game-page .brand img { filter: brightness(0) invert(1); }
.halloween-active .game-page .button.dark { background: #ffae66; color: #2c2034; }
.halloween-active .game-page .account-button { color: #fff1d8; background: #33263c; border-color: #65536d; }
.halloween-active .game-page .language-select { background: #33263c; color: #fff1d8; border-color: #65536d; }
.halloween-active .game-page .detail-hero h1 { color: #ffae66; font-size: clamp(58px, 6vw, 88px); margin-bottom: 18px; }
.halloween-active .game-page .detail-hero { padding-top: 28px; gap: 50px; }
.halloween-active .game-page .detail-hero .season-badge { color: #ffd6a0; margin: 0 0 24px; }
.halloween-active .game-page .detail-hero .season-badge svg { width: 32px; height: 32px; }
.halloween-active .game-page .detail-hero .eyebrow { color: #c6a6e2; }
.halloween-active .game-page .detail-hero .card-art { min-height: 420px; height: auto; background: #e9bdff; border: 2px solid #b88bcf; transform: rotate(2deg); color: #302039; overflow: visible; border-radius: 12px; }
.halloween-active .game-page .detail-hero .card-art::before { content: none; }
.halloween-active .game-page .detail-hero .card-art > :not(.halloween-demo) { display: none; }
.halloween-demo { position: relative; width: 100%; padding: 30px; display: flex; flex-direction: column; gap: 18px; flex: 1; box-sizing: border-box; }
.halloween-demo p, .halloween-demo .demo-title, .halloween-demo .demo-options p, .halloween-demo .demo-caption { color: #302039; }
.halloween-demo .demo-label { font: 700 10px/1.5 GameBody, sans-serif; letter-spacing: 2px; padding-right: 40px; }
.halloween-demo .demo-title { font: 600 clamp(30px, 3vw, 43px)/1.08 Fredoka, sans-serif; letter-spacing: -1px; margin: 5px 0 3px; max-width: 390px; }
.halloween-demo .demo-options { border-top: 2px solid #4d2b5e55; padding-top: 16px; display: grid; gap: 12px; margin-top: auto; }
.demo-options p { display: flex; gap: 12px; margin: 0; font: 600 14px/1.5 GameBody, sans-serif; }
.demo-options b { flex: 0 0 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #302039; color: #fff1d8; font-size: 13px; }
.halloween-demo .demo-caption { font: 500 13px/1.6 GameBody, sans-serif; margin: 0; }
.halloween-demo .demo-pumpkin { position: absolute; width: 92px; height: 92px; bottom: -34px; right: -16px; transform: rotate(9deg); }
.halloween-demo .demo-bat { position: absolute; width: 82px; height: 50px; top: -26px; right: -8px; color: #ffae66; transform: rotate(12deg); }
.halloween-active .game-kiken .detail-hero .card-art { background: #ffb365; border-color: #d48e48; transform: rotate(-2deg); }
.halloween-active .game-kiken .halloween-demo { gap: 20px; }
.halloween-active .game-kiken .halloween-demo .demo-title { font-size: clamp(31px, 3.2vw, 45px); }
.halloween-active .game-kiken .demo-bat { color: #e9bdff; }
.halloween-family { padding: 28px 30px; border: 1px solid #82638d; border-radius: 16px; background: #34263d; margin: 12px 0 36px; }
.halloween-family .eyebrow { color: #d2a6ee; margin: 0 0 10px; }
.guide .halloween-family h2 { margin: 0 0 12px; color: #ffcf94; font-size: 30px; }
.guide .halloween-family p:last-child { margin-bottom: 0; }
.halloween-active .game-page .guide .notice { border: 1px solid #685271; }
.halloween-active .game-page .site-footer { color: #e0cfe7; }
.halloween-active .game-page .site-footer a, .halloween-active .game-page .site-footer p { color: #dfcee5; }
.halloween-active .game-page .footer-bottom { color: #c6b4ce; }
@media(max-width:900px) {
  .halloween-ribbon { flex-wrap: wrap; gap: 14px; }
  .halloween-ribbon .season-links { margin-left: 86px; }
  .halloween-active .game-page .detail-hero { gap: 32px; }
  .halloween-demo { padding: 25px; }
}
@media(max-width:650px) {
  .halloween-ribbon { padding: 20px; gap: 12px; }
  .halloween-ribbon > svg { width: 44px; height: 44px; flex-basis: 44px; }
  .halloween-ribbon > div:not(.season-links) { flex: 1; min-width: 160px; }
  .halloween-ribbon strong { font-size: 23px; }
  .halloween-ribbon p { font-size: 12px; line-height: 1.6; }
  .halloween-ribbon .season-links { margin-left: 0; width: 100%; gap: 22px; }
  .season-ghost { width: 57px; height: 67px; top: 0; right: 12px; }
  .halloween-active .game-page .detail-hero { gap: 40px; padding-bottom: 48px; }
  .halloween-active .game-page .detail-hero .card-art { min-height: 360px; margin-inline: 6px; transform: none; }
  .halloween-active .game-kiken .halloween-demo .demo-title { font-size: 37px; }
  .halloween-demo .demo-title { font-size: 36px; }
  .halloween-demo .demo-pumpkin { right: -9px; width: 76px; height: 76px; bottom: -26px; }
  .halloween-family { padding: 22px; }
  .guide .halloween-family h2 { font-size: 27px; }
}
