/* A Noite do Véu — só altera a interface quando liberada pelo appsettings. */
html.halloween-active {
  --bg: #10090f;
  --surface: #17101a;
  --surface2: #251524;
  --surface3: #32182b;
  --border: #5a2b46;
  --border2: #8a3b44;
  --accent: #cb5a2c;
  --accent2: #8d2f38;
  --accent-glow: rgba(255, 102, 42, .32);
  --gold: #e9843b;
  --gold2: #ffc16a;
  --gold3: #ffe0a8;
  --gold-glow: rgba(255, 119, 34, .26);
  --gold-dim: rgba(255, 130, 35, .11);
  --text: #fff1df;
  --text2: #ebc8bb;
  --muted: #bd899b;
  --muted2: #73536d;
  color-scheme: dark;
}

html.halloween-active body {
  background-color: #10090f;
  background-image: radial-gradient(ellipse 68% 46% at 50% -12%, rgba(231, 83, 36, .24), transparent 65%), radial-gradient(circle at 12% 95%, rgba(78, 17, 63, .48), transparent 44%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56'%3E%3Cpath d='M28 3 36 20 53 28 36 36 28 53 20 36 3 28 20 20Z' fill='none' stroke='%23f7a25d' stroke-opacity='.055'/%3E%3C/svg%3E");
  selection-background-color: #f28b35;
}

html.halloween-active ::selection { background: #e97838; color: #17090e; }
html.halloween-active :focus-visible { outline: 2px solid #ffd37d; outline-offset: 3px; }
html.halloween-active ::-webkit-scrollbar-thumb { background: #74304b; }

.halloween-sky { position: fixed; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; background: radial-gradient(circle at 80% 14%, rgba(255, 188, 97, .09) 0 2px, transparent 3px), radial-gradient(circle at 32% 27%, rgba(255, 232, 168, .1) 0 1px, transparent 2px); }
.halloween-sky::before { content: ''; position: absolute; width: 28rem; height: 28rem; top: -15rem; right: -7rem; border-radius: 50%; background: radial-gradient(circle at 38% 40%, rgba(255, 223, 159, .2), rgba(255, 140, 50, .06) 40%, transparent 70%); filter: blur(2px); animation: hw-drift 18s ease-in-out infinite alternate; }
.halloween-pumpkin, .halloween-cat, .halloween-spider, .halloween-inventory-toggle, .hw-surface-secret, .hw-forbidden, .hw-isagram-ghost { font: inherit; cursor: pointer; }
.halloween-pumpkin, .halloween-cat, .halloween-spider { position: fixed; border: 0; background: transparent; z-index: 1000; filter: drop-shadow(0 10px 12px rgba(0,0,0,.55)); transition: transform .25s ease, filter .25s ease; }
.halloween-pumpkin { right: 20px; bottom: max(140px, calc(env(safe-area-inset-bottom) + 124px)); font-size: clamp(2.2rem, 5vw, 3.8rem); animation: hw-bob 3.8s ease-in-out infinite; }
.halloween-pumpkin:hover, .halloween-pumpkin.angry { transform: rotate(-8deg) scale(1.14); filter: drop-shadow(0 0 14px rgba(255, 126, 31, .9)); }
.halloween-cat { left: 17px; bottom: max(75px, calc(env(safe-area-inset-bottom) + 60px)); font-size: clamp(1.8rem, 4vw, 3rem); animation: hw-bob 4.7s -1.5s ease-in-out infinite; }
.halloween-cat:hover { transform: scale(1.18) rotate(3deg); }
.halloween-spider { right: 10%; top: 0; width: 42px; padding-top: 72px; color: #f3c7b3; font-size: 1.35rem; border: 0; background: linear-gradient(#d4b0b0, #d4b0b0) center top / 1px 67px no-repeat; animation: hw-swing 5s ease-in-out infinite; transform-origin: top; }
.halloween-inventory-toggle { position: fixed; z-index: 1001; right: 18px; bottom: max(76px, calc(env(safe-area-inset-bottom) + 60px)); border: 1px solid rgba(255, 184, 111, .55); border-radius: 999px; padding: .55rem .78rem; color: #fff0d6; background: rgba(30, 13, 25, .91); box-shadow: 0 7px 20px rgba(0, 0, 0, .35); font: 700 .72rem/1 'Cinzel', serif; letter-spacing: .06em; }
.halloween-inventory-toggle span { margin-left: .32rem; color: #ffbd64; }
.halloween-inventory { position: fixed; z-index: 1002; right: 18px; bottom: max(132px, calc(env(safe-area-inset-bottom) + 116px)); width: min(345px, calc(100vw - 36px)); max-height: min(620px, calc(100vh - 154px)); overflow: auto; padding: 1rem; border: 1px solid rgba(255, 177, 100, .44); border-radius: 15px; color: #ffedda; background: linear-gradient(155deg, rgba(51, 21, 35, .98), rgba(17, 10, 18, .98)); box-shadow: 0 22px 58px rgba(0,0,0,.58); }
.halloween-inventory-head { display: flex; align-items: start; justify-content: space-between; gap: 1rem; padding-bottom: .8rem; border-bottom: 1px solid rgba(255, 178, 100, .2); font-family: 'Cinzel', serif; }
.halloween-inventory-head strong, .halloween-inventory-head small { display: block; }
.halloween-inventory-head strong { font-size: .83rem; color: #ffd392; }
.halloween-inventory-head small { margin-top: .25rem; font: italic .85rem 'Crimson Pro', serif; color: #c99e9e; }
.halloween-inventory-head button, .halloween-inventory #halloween-finish { border: 1px solid rgba(255, 190, 105, .45); background: rgba(255, 151, 59, .1); color: #ffd99a; border-radius: 8px; cursor: pointer; padding: .4rem .55rem; }
.halloween-inventory ol { list-style: none; margin: .65rem 0; padding: 0; display: grid; gap: .4rem; }
.halloween-inventory li { display: grid; grid-template-columns: 1.7rem 1fr; gap: .35rem; align-items: start; padding: .45rem; color: #987585; border-radius: 7px; }
.halloween-inventory li.found { color: #ffead0; background: rgba(255, 132, 45, .09); }
.halloween-inventory li > span { text-align: center; font-size: 1rem; }
.halloween-inventory li strong, .halloween-inventory li small { display: block; }
.halloween-inventory li strong { font: 700 .72rem 'Cinzel', serif; }
.halloween-inventory li small { margin-top: .17rem; font: .82rem/1.15 'Crimson Pro', serif; }
.halloween-ritual { padding-top: .7rem; border-top: 1px solid rgba(255, 178, 100, .2); }
.halloween-ritual strong, .halloween-ritual small { display: block; }
.halloween-ritual strong { font: 700 .74rem 'Cinzel', serif; color: #ffd392; }
.halloween-ritual small { margin: .2rem 0 .45rem; color: #c99e9e; font-size: .72rem; }
#halloween-ritual-buttons { display: flex; gap: .4rem; }
#halloween-ritual-buttons button { min-width: 2rem; border: 1px solid rgba(255, 189, 110, .42); border-radius: 7px; color: #ffe2ac; background: rgba(255, 142, 47, .1); cursor: pointer; padding: .22rem .35rem; }
.halloween-inventory #halloween-finish { display: block; width: 100%; margin-top: .75rem; font-family: 'Cinzel', serif; }
.halloween-toast { position: fixed; z-index: 1600; left: 50%; bottom: max(1rem, env(safe-area-inset-bottom)); width: min(440px, calc(100vw - 32px)); transform: translate(-50%, 130%); padding: .8rem 1rem; border: 1px solid rgba(255, 188, 108, .62); border-radius: 10px; background: #291323; color: #ffebd1; box-shadow: 0 16px 40px rgba(0,0,0,.5); text-align: center; font: 600 1rem/1.25 'Crimson Pro', serif; opacity: 0; transition: transform .35s ease, opacity .35s ease; }
.halloween-toast.show { transform: translate(-50%, 0); opacity: 1; }
.halloween-bats { position: fixed; inset: 0; z-index: 1200; pointer-events: none; overflow: hidden; }
.halloween-bats span { position: absolute; left: -3rem; top: calc(10% + var(--i) * 7%); opacity: 0; font-size: calc(.7rem + var(--i) * .08rem); }
.halloween-bats.fly span { animation: hw-bat 2.2s cubic-bezier(.2,.7,.2,1) forwards; animation-delay: calc(var(--i) * 80ms); }
.halloween-veil[hidden] { display: none; }
.halloween-veil { position: fixed; z-index: 2000; inset: 0; display: grid; place-items: center; padding: 1.25rem; background: rgba(13, 5, 12, .8); backdrop-filter: blur(8px); }
.halloween-veil > div { width: min(480px, 100%); padding: 2rem; border: 1px solid rgba(255, 191, 110, .62); border-radius: 20px; background: radial-gradient(circle at 50% 0, rgba(245, 121, 47, .2), transparent 52%), #25121f; color: #ffead2; text-align: center; box-shadow: 0 28px 90px #000; }
.halloween-veil span { font-size: 2rem; letter-spacing: .3rem; }
.halloween-veil h2 { margin: 1rem 0 .5rem; color: #ffd289; font: 700 1.5rem 'Cinzel', serif; }
.halloween-veil p { margin: 0 0 1.2rem; font: 1.15rem 'Crimson Pro', serif; color: #e8c2b8; }
.halloween-veil button { border: 1px solid #f3ad5b; border-radius: 9px; padding: .6rem 1rem; background: #f08b3f; color: #260d16; cursor: pointer; font: 700 .8rem 'Cinzel', serif; }
.hw-surface-secret { position: fixed; z-index: 20; border: 0; background: transparent; filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)); }
.hw-moon { top: 6vh; right: 9vw; font-size: clamp(2.6rem, 6vw, 5rem); animation: hw-bob 5s ease-in-out infinite; }
.hw-door { bottom: 7vh; left: 5vw; font-size: 2rem; opacity: .84; }
.hw-forbidden, .hw-isagram-ghost { border: 1px solid rgba(255, 178, 100, .42); border-radius: 7px; background: rgba(48, 19, 35, .8); color: #ffd08e; padding: .35rem .48rem; box-shadow: 0 5px 14px rgba(0,0,0,.22); }
.hw-isagram-ghost { margin-left: auto; font-size: 1rem; }
html.halloween-active .isagram-phone { border-color: #4b263e; box-shadow: 0 0 0 2px rgba(246, 133, 56, .38), 0 30px 70px rgba(0,0,0,.6), 0 0 44px rgba(242, 107, 41, .22); }
html.halloween-active .isagram-app, html.halloween-active .isagram-topbar, html.halloween-active body[style*="background"] { background: #110b12 !important; }
html.halloween-active .isagram-topbar { border-bottom-color: #4f2b41; }
html.halloween-active .isagram-logo { background: none; -webkit-text-fill-color: #ffd18b; color: #ffd18b; }
@keyframes hw-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes hw-swing { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(7deg); } }
@keyframes hw-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(-4rem, 2rem, 0); } }
@keyframes hw-bat { 0% { transform: translate3d(0, 20px, 0) rotate(-10deg); opacity: 0; } 15% { opacity: 1; } 100% { transform: translate3d(110vw, -70px, 0) rotate(15deg); opacity: 0; } }
html.halloween-paused .halloween-sky::before, html.halloween-paused .halloween-pumpkin, html.halloween-paused .halloween-cat, html.halloween-paused .halloween-spider, html.halloween-paused .hw-moon, html.halloween-paused .halloween-bats span { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .halloween-sky::before, .halloween-pumpkin, .halloween-cat, .halloween-spider, .hw-moon, .halloween-bats span { animation: none !important; } .halloween-toast { transition: none; } }
@media (max-width: 640px) { .halloween-inventory-toggle { right: 11px; bottom: max(68px, calc(env(safe-area-inset-bottom) + 56px)); } .halloween-inventory { right: 11px; bottom: max(124px, calc(env(safe-area-inset-bottom) + 108px)); width: calc(100vw - 22px); max-height: calc(100vh - 144px); } .halloween-spider { right: 15%; padding-top: 49px; background-size: 1px 44px; } .halloween-pumpkin { right: 9px; bottom: max(130px, calc(env(safe-area-inset-bottom) + 116px)); } .halloween-cat { left: 8px; } .hw-door { left: 4vw; } }
