/* A light seasonal layer over Kotiki's usual cream-and-pixel design. */
.seasonal-only,.app-page .mascot .seasonal-only,.home-page .halloween-announcement.seasonal-only{display:none}
.halloween-season .seasonal-only{display:block}
.halloween-season{
  --season-plum:#684e70;
  --season-honey:#e7b56d;
  --season-web:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180' fill='none' stroke='%23684e70' stroke-width='1.2'%3E%3Cpath d='M0 0v174M0 0l56 160M0 0l118 118M0 0l160 56M0 0h174M0 38q8-3 13-1q2-7 14-10q0-10 11-13M0 77q17-7 26-4q6-14 27-20q3-20 20-27M0 117q26-10 39-7q10-21 43-28q5-31 28-43M0 158q35-13 53-8q13-30 58-39q8-43 39-58'/%3E%3C/svg%3E");
  --season-bat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 36'%3E%3Cpath fill='%23684e70' d='M40 13l-5-8-2 9C22 16 10 7 1 2c2 11 7 18 17 20 0-4 5-5 9-2 1 5 6 10 13 14 7-4 12-9 13-14 4-3 9-2 9 2 10-2 15-9 17-20-9 5-21 14-32 12l-2-9z'/%3E%3C/svg%3E");
}
/* /app: soft dusk at the edges, warm cards, a tiny pumpkin by the avatar. */
.halloween-season .app-page{
  background-color:#fff7ed;
  background-image:radial-gradient(ellipse at 50% 5%,#ffe5ba 0,transparent 48%),
    linear-gradient(160deg,#eee4f1 0%,#fff7ed 48%,#ffecd4 100%);
}
.halloween-season .app-page::before,.halloween-season .app-page::after{
  content:"";position:fixed;top:0;width:clamp(80px,17vw,190px);aspect-ratio:1;
  background:var(--season-web) center/contain no-repeat;opacity:.28;pointer-events:none;
}
.halloween-season .app-page::before{left:0}
.halloween-season .app-page::after{right:0;transform:scaleX(-1)}
.halloween-season .app-page .col{position:relative;z-index:1}
.halloween-season .app-page .ava{border-color:#e9b869;box-shadow:0 0 0 7px #ffe9c8,5px 7px 0 #a57a3933}
.halloween-season .app-page .ava-wrap::after{
  content:"";position:absolute;width:54px;height:51px;right:-23px;bottom:-5px;
  background:url('/halloween/assets/pumpkin.webp') center/contain no-repeat;
  filter:drop-shadow(0 3px 6px #b76c2b40);pointer-events:none;
}
.halloween-season .app-page .ava-wrap::before{
  content:"";position:absolute;width:44px;height:22px;left:-44px;top:4px;
  background:var(--season-bat) center/contain no-repeat;transform:rotate(-17deg);opacity:.75;pointer-events:none;
}
.halloween-season .app-page .s1{color:var(--season-plum)}
.halloween-season .app-page .link{border-color:#e5c79f;background:linear-gradient(125deg,#fff7e8,#ffecd7)}
.halloween-season .app-page .link.mine{border-color:#d58b35}
.halloween-season .app-page .mascot{gap:0;margin-top:24px}
.halloween-season .app-page .mascot .yarn{display:none}
.halloween-season .app-page .mascot .seasonal-pumpkin{display:block;width:74px;height:68px;object-fit:contain;margin:0 -6px 1px 0;filter:drop-shadow(0 3px 8px #da922c35)}
.halloween-season .app-halloween{
  display:flex;align-items:center;gap:10px;width:100%;margin-top:20px;padding:11px 13px;
  border:1px solid #dcc7df;border-radius:14px;background:#f4eaf5;color:#55405c;text-decoration:none;
  transition:background .15s ease;
}
.app-halloween:hover{background:#ede0ef}
.app-halloween:focus-visible{outline:3px solid #684e70;outline-offset:4px}
.app-halloween img{width:39px;height:37px;object-fit:contain;flex:none}
.app-halloween>span:first-of-type{flex:1;min-width:0}
.app-halloween strong{display:block;font:700 14px/1.3 var(--body)}
.app-halloween small{display:block;margin-top:3px;font:600 12px/1.35 var(--body);color:#755b79}
.app-halloween>span:last-child{font-size:22px;flex:none}
/* Home: keep the main layout; add a pumpkin and a small cobweb to the phone. */
.halloween-season .home-page .hero{background:radial-gradient(ellipse at 80% 50%,#ffe4b64f,transparent 65%)}
.halloween-season .home-page .hero-art{position:relative}
.halloween-season .home-page .hero-art::after{
  content:"";position:absolute;width:94px;height:88px;right:-16px;bottom:-12px;
  background:url('/halloween/assets/pumpkin.webp') center/contain no-repeat;
  filter:drop-shadow(0 4px 8px #a6612933);pointer-events:none;
}
.halloween-season .home-page .phone{position:relative}
.halloween-season .home-page .phone::after{
  content:"";position:absolute;top:16px;right:16px;width:70px;height:70px;
  background:var(--season-web) center/contain no-repeat;transform:scaleX(-1);opacity:.38;pointer-events:none;
}
.halloween-season .home-page .halloween-announcement{display:flex;border-color:#b77d40;box-shadow:0 4px 0 #c5a584,0 8px 26px #b37a1f12}
@media(max-width:360px){
  .halloween-season .app-page .ava-wrap::before{left:-34px;width:33px}
  .halloween-season .home-page .hero-art::after{right:-5px;width:78px}
}
@media(prefers-reduced-motion:reduce){.app-halloween{transition:none}}