/* =========================================================================
   Pumpkin Hunt 2026 · 活动页（短代码 [cfs_pumpkin_hunt] 整页输出）
   整页是同一个夜晚：背景连成一片星空，节与节之间用雾过渡。
   氛围靠光：发光的月亮、南瓜灯、蜡烛、提灯、萤火虫，暖光照在深色的东西上。
   不用渐变字、毛玻璃卡片和整齐划一的“小标题 + 大标题 + 三张卡片”。
   ========================================================================= */

@font-face{
	font-family:"Grenze Gotisch";
	font-style:normal;
	font-weight:700;
	font-display:swap;
	src:url(../fonts/grenze-gotisch-700-latin.woff2) format("woff2");
}

/* WoodMart 的内容区上下各有 40px 白边（.wd-content-layout），活动页要贴着页头和页脚。body 类由插件加 */
.cfs-ph-page .wd-content-layout{padding-top:0 !important; padding-bottom:0 !important}

.phx{
	--ink:#0E0A12;
	--soil:#0B0710;
	--witch:#5E3091;
	--pk:#F28A2E;
	--pk-deep:#C4561A;
	--ember:#FFB45C;
	--flame:255,170,80;
	--bone:#F1E8D6;
	--bone-2:rgba(241,232,214,.8);
	--bone-3:rgba(241,232,214,.56);
	--line:rgba(241,232,214,.14);
	--gold:#F2C94C;
	--paper:#F1E7D2;
	--paper-ink:#22160F;
	--stone:#2A2234;
	/* 金南瓜：同一张图整体染成金色，帽子变成古铜色 */
	--to-gold:sepia(1) saturate(4) hue-rotate(-6deg) brightness(1.3) contrast(1.1);
	--disp:"Grenze Gotisch",Georgia,serif;
	--wrap:1240px;
	--ease:cubic-bezier(.22,.61,.36,1);
	/* 颗粒：噪点贴图，透明度直接烘在图里，不用混合模式（整页混合很耗性能） */
	--grain-d:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 .055 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	--grain-l:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .12 0 0 0 0 .05 .16 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

	/* 撑满整个屏幕宽度，和静态页 .cg 的做法一样（主题容器常用 !important 设外边距，所以这里也要） */
	position:relative;
	isolation:isolate;
	width:100vw !important;
	max-width:100vw !important;
	margin-left:calc(50% - 50vw) !important;
	margin-right:calc(50% - 50vw) !important;
	overflow:hidden;
	/* 一整片夜空：撒着星星，越往下越暗，各节自己不铺底色 */
	background:
		radial-gradient(1px 1px at 24px 36px,rgba(241,232,214,.6),transparent) 0 0/233px 211px,
		radial-gradient(1.2px 1.2px at 150px 96px,rgba(241,232,214,.42),transparent) 0 0/317px 289px,
		radial-gradient(1px 1px at 64px 172px,rgba(241,232,214,.36),transparent) 0 0/419px 367px,
		radial-gradient(1.6px 1.6px at 300px 44px,rgba(245,236,176,.5),transparent) 0 0/541px 487px,
		linear-gradient(180deg,#140C20 0,#120A1C 1400px,#0F0918 3000px,#0B0711 100%);
	color:var(--bone-2);
	font-size:16px;
	line-height:1.65;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* 100vw 含滚动条宽度，裁掉多出来的那一点，免得出现横向滚动条（clip 不影响页头吸顶） */
html:has(.phx),body:has(.phx){overflow-x:clip}
.phx *,.phx *::before,.phx *::after{box-sizing:border-box}
.phx-hero::after,.phx-sec::after,.phx-end::after{content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background:var(--grain-d)}
.phx h1,.phx h2,.phx h3,.phx p,.phx ol,.phx ul,.phx dl,.phx dd,.phx figure{margin:0; padding:0}
.phx ol,.phx ul{list-style:none}
.phx img{display:block; max-width:100%; height:auto}
.phx a{color:inherit}
.phx :focus-visible{outline:2px solid var(--ember); outline-offset:3px; border-radius:2px}
.phx h1,.phx h2,.phx h3{text-transform:none; letter-spacing:0; color:var(--bone)}

.phx-wrap{position:relative; z-index:3; max-width:var(--wrap); margin:0 auto; padding:0 40px}
.phx-label{font-size:12px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--ember)}
.phx-h2{margin-top:12px !important; font-family:var(--disp); font-weight:700; font-size:clamp(48px,6vw,86px); line-height:.92; text-shadow:0 4px 30px rgba(0,0,0,.6)}
.phx-head p:not(.phx-label){margin-top:18px; max-width:48ch; font-size:17px; line-height:1.6; color:var(--bone-2)}
.phx-head--c{display:grid; justify-items:center; text-align:center}
.phx-fine{margin-top:22px; font-size:14px; color:var(--bone-3)}
.phx-fine--c{max-width:62ch; margin-left:auto !important; margin-right:auto !important; text-align:center}
.phx-sec{position:relative; padding:clamp(96px,10vw,140px) 0}

.phx-star{width:14px; height:14px; flex:none; fill:currentColor}

/* 按钮：南瓜橙，自己发一点光；悬停更亮 */
.phx-acts{display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px; margin-top:34px}
.phx-btn{display:inline-flex; align-items:center; gap:14px; min-height:54px; padding:0 28px; border-radius:8px; background:var(--pk); color:#1A0C02 !important; font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; text-decoration:none !important;
	box-shadow:0 12px 30px -12px rgba(242,138,46,.9),inset 0 1px 0 rgba(255,255,255,.3); transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s}
.phx-btn::after{content:""; width:16px; height:10px; background:currentColor; clip-path:polygon(0 42%,72% 42%,72% 0,100% 50%,72% 100%,72% 58%,0 58%); transition:transform .2s var(--ease)}
.phx-btn:hover{background:#FF9B45; transform:translateY(-2px); box-shadow:0 18px 40px -12px rgba(242,138,46,1),inset 0 1px 0 rgba(255,255,255,.3)}
.phx-btn:hover::after{transform:translateX(3px)}
.phx-link{font-size:13.5px; font-weight:600; letter-spacing:.04em; color:var(--bone) !important; text-decoration:underline; text-decoration-color:rgba(241,232,214,.38); text-decoration-thickness:1.5px; text-underline-offset:6px; transition:text-decoration-color .2s, color .2s}
.phx-link:hover{color:var(--ember) !important; text-decoration-color:var(--ember)}

/* 滚动淡入：只有脚本跑起来才先藏起来，脚本被延迟或关掉时内容照常可见 */
.phx--js .phx-rv{opacity:0; transform:translateY(18px); transition:opacity .8s var(--ease), transform .8s var(--ease)}
.phx--js .phx-rv.is-in{opacity:1; transform:none}

/* =========================================================================
   氛围：雾、萤火虫、烛光
   ========================================================================= */
/* 雾：几层椭圆团，宽度是屏幕的两倍，横移一半正好接上，循环看不出接缝 */
.phx-fog{position:absolute; left:0; right:0; z-index:5; height:300px; overflow:hidden; pointer-events:none}
.phx-fog i{position:absolute; top:0; left:0; width:200%; height:100%;
	background:
		radial-gradient(closest-side,rgba(206,194,230,.11),rgba(206,194,230,0)) 0 72%/12.5% 46% repeat-x,
		radial-gradient(closest-side,rgba(206,194,230,.08),rgba(206,194,230,0)) 30% 40%/25% 62% repeat-x,
		radial-gradient(closest-side,rgba(206,194,230,.06),rgba(206,194,230,0)) 70% 20%/50% 50% repeat-x;
	animation:phxFog 90s linear infinite}
.phx-fog i + i{opacity:.7; background-position:6% 90%,52% 58%,20% 30%; animation-duration:140s; animation-direction:reverse}
@keyframes phxFog{to{transform:translateX(-50%)}}
.phx-fog--hill{bottom:70px}
.phx-fog--edge{bottom:-150px; height:260px}
.phx-fog--end{bottom:40px; height:220px}

/* 萤火虫：只动位置和透明度 */
.phx-flies{position:absolute; inset:0; z-index:4; overflow:hidden; pointer-events:none}
.phx-flies i{position:absolute; left:var(--x); top:var(--y); width:4px; height:4px; border-radius:50%; background:#F5ECB0; opacity:0;
	box-shadow:0 0 6px 2px rgba(245,236,176,.55),0 0 20px 7px rgba(238,200,90,.16);
	animation:phxFly var(--d) ease-in-out var(--dl) infinite, phxGlowF calc(var(--d) / 2.5) ease-in-out var(--dl) infinite}
@keyframes phxFly{0%,100%{transform:translate(0,0)}25%{transform:translate(26px,-20px)}50%{transform:translate(-6px,-44px)}75%{transform:translate(-30px,-16px)}}
@keyframes phxGlowF{0%,100%{opacity:0}40%,60%{opacity:1}}

/* 烛光的亮度变化：南瓜灯照在地上的光、提灯和蜡烛的光晕共用 */
@keyframes phxCandle{0%,100%{opacity:.86}18%{opacity:1}42%{opacity:.7}66%{opacity:.96}82%{opacity:.78}}
@keyframes phxSwing{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.3deg)}}

/* =========================================================================
   首屏
   ========================================================================= */
.phx-hero{position:relative; isolation:isolate; display:flex; align-items:center; min-height:clamp(680px,90vh,880px); padding:72px 0 250px;
	/* 天空被右上方的月亮照亮；地平线上一层紫光和南瓜灯的暖光 */
	background:
		radial-gradient(60% 52% at 50% 100%,rgba(122,62,168,.36),transparent 72%),
		radial-gradient(30% 34% at 82% 82%,rgba(242,138,46,.16),transparent 70%),
		radial-gradient(70% 60% at 78% 20%,#2E1E46 0%,#1A1129 38%,rgba(20,12,32,0) 78%),
		linear-gradient(180deg,#0E0917 0%,#170E24 60%,#140C20 100%)}
.phx-scene{position:absolute; inset:0; z-index:1; pointer-events:none}
.phx-scene__art,.phx-secret{position:absolute; left:0; bottom:0; width:100%; height:100%}
.phx-stars .tw{animation:phxTw 3.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center}
.phx-stars .tw--b{animation-duration:4.6s; animation-delay:-2s}
@keyframes phxTw{0%,100%{opacity:1; transform:scale(1)}50%{opacity:.25; transform:scale(.6)}}
.phx-windows rect,.phx-windows circle{transition:opacity .4s}
.phx-windows .off{opacity:.18}
.phx-windows .flick{animation:phxFlick 5s steps(1) infinite}
@keyframes phxFlick{0%,100%{opacity:1}62%{opacity:.25}64%{opacity:1}66%{opacity:.3}68%{opacity:1}}
.phx-pool{animation:phxCandle 3.2s ease-in-out infinite}
.phx-pool--1{animation-duration:2.6s; animation-delay:-.8s}
.phx-pool--2{animation-duration:3.8s; animation-delay:-2.1s}
.phx-pool--3{animation-duration:2.9s; animation-delay:-1.4s}
.phx-pool--4{animation-duration:3.5s; animation-delay:-.3s}

.phx-bat{position:absolute; left:0; top:var(--y); width:var(--w); color:#07050A; animation:phxBat var(--dur) linear infinite var(--dl); transform:translateX(-12vw)}
.phx-bat svg{display:block; width:100%; height:auto; overflow:visible}
.phx-bat .phx-wing{transform-origin:50% 38%; animation:phxFlap .2s ease-in-out infinite alternate}
.phx-bat--r{animation-name:phxBatR}
.phx-bat--r svg{transform:scaleX(-1)}
@keyframes phxFlap{to{transform:scaleY(.32)}}
@keyframes phxBat{0%{transform:translate(-12vw,0)}14%{transform:translate(16vw,-30px)}28%{transform:translate(42vw,10px)}42%{transform:translate(68vw,-24px)}56%,100%{transform:translate(112vw,-10px)}}
@keyframes phxBatR{0%{transform:translate(112vw,0)}16%{transform:translate(78vw,-24px)}32%{transform:translate(44vw,8px)}48%,100%{transform:translate(-14vw,-16px)}}

/* 手电筒：鼠标移到哪里照到哪里，照出树上的眼睛、窗户里的幽灵、墓碑上的字 */
.phx-dark{position:absolute; inset:0; background:radial-gradient(circle 240px at var(--mx,74%) var(--my,32%),rgba(8,5,12,0) 0%,rgba(8,5,12,.12) 45%,rgba(8,5,12,.42) 100%)}
.phx-secret{-webkit-mask-image:radial-gradient(circle 160px at var(--sx,74%) var(--sy,32%),#000 30%,transparent 72%); mask-image:radial-gradient(circle 160px at var(--sx,74%) var(--sy,32%),#000 30%,transparent 72%)}
.phx-blink{transform-box:fill-box; transform-origin:center; animation:phxBlink 4.6s infinite}
.phx-blink--b{animation-delay:-2.2s; animation-duration:5.8s}
@keyframes phxBlink{0%,46%,50%,100%{transform:scaleY(1)}48%{transform:scaleY(.1)}}
.phx-ghost{animation:phxPeek 6s ease-in-out infinite; transform-box:fill-box}
@keyframes phxPeek{0%,100%{transform:translateX(8px); opacity:.15}40%,70%{transform:none; opacity:.9}}

.phx-hero__in{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:48px; align-items:center; width:100%}
.phx-title{margin-top:20px !important; font-family:var(--disp); font-weight:700; font-size:clamp(66px,8.2vw,128px); line-height:.86; letter-spacing:-.005em; color:var(--bone); text-shadow:0 6px 40px rgba(0,0,0,.65)}
.phx-title span{display:block}
/* “Hunt”：实色的南瓜橙，自己发光，偶尔像烛火一样闪一下 */
.phx-title__hunt{font-size:1.3em; color:var(--pk); text-shadow:0 0 2px rgba(255,214,160,.5),0 0 26px rgba(242,138,46,.55),0 0 70px rgba(242,138,46,.25); animation:phxFlicker 7s infinite}
@keyframes phxFlicker{0%,100%,8%,12%{opacity:1}10%{opacity:.82}11%{opacity:.95}}
.phx-lead{margin-top:28px !important; max-width:42ch; font-size:clamp(17px,1.5vw,19px); line-height:1.6; color:var(--bone)}

.phx-bill{display:flex; flex-wrap:wrap; margin-top:42px !important; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.phx-bill div{padding:16px 26px 14px 0; margin-right:26px; border-right:1px solid var(--line)}
.phx-bill div:last-child{border-right:0; margin-right:0}
.phx-bill dt{font-family:var(--disp); font-size:30px; font-weight:700; line-height:1; color:var(--bone)}
.phx-bill dd{margin-top:6px !important; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--bone-3)}
.phx .phx-flag{display:flex; gap:12px; align-items:flex-start; max-width:560px; margin-top:28px !important; padding:14px 16px; border-radius:8px; background:rgba(94,48,145,.55); color:var(--bone); font-size:14.5px; line-height:1.55}
.phx-flag .phx-star{margin-top:4px; color:var(--ember)}
.phx-flag strong{color:var(--ember)}

/* 右栏：月亮在后面，前面是“每个南瓜里有什么”或一只大南瓜 */
.phx-hero__side{position:relative; z-index:0; display:grid; justify-items:center; align-content:center; min-height:520px}
/* 月亮：暖色的光从里往外透，月面有几处淡淡的环形山，外面一圈大光晕 */
.phx-moon{position:absolute; top:-92px; left:56%; z-index:-1; width:clamp(190px,18vw,260px); aspect-ratio:1; margin-left:calc(clamp(190px,18vw,260px) / -2); border-radius:50%;
	background:
		radial-gradient(circle at 62% 30%,rgba(170,140,80,.28) 0 7%,transparent 7.5%),
		radial-gradient(circle at 34% 62%,rgba(170,140,80,.22) 0 10%,transparent 10.5%),
		radial-gradient(circle at 70% 70%,rgba(170,140,80,.2) 0 5%,transparent 5.5%),
		radial-gradient(circle at 36% 32%,#FFF9E6 0%,#F6E4B4 46%,#DCBE7A 100%);
	box-shadow:0 0 60px 12px rgba(255,214,140,.22),0 0 200px 70px rgba(255,170,80,.1)}

/* 每个南瓜里有什么：四只南瓜站在一条线上，下面各挂一张价签 */
.phx-odds{position:relative; width:100%; max-width:500px; margin-top:190px !important; text-align:center}
.phx-odds__k{font-size:12px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--ember); text-shadow:0 1px 10px rgba(0,0,0,.7)}
.phx .phx-odds__row{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:20px !important; padding-bottom:4px; border-bottom:2px solid rgba(241,232,214,.12)}
.phx-odds__i{position:relative; display:grid; justify-items:center}
.phx-odds__pk{position:relative; display:block; width:96px; max-width:100%; transform-origin:50% 92%; animation:phxBob 5s ease-in-out infinite; animation-delay:calc(var(--i) * -1.2s)}
/* 每只南瓜照在地上的一圈光 */
.phx-odds__pk::before{content:""; position:absolute; left:50%; bottom:-14%; z-index:-1; width:210%; height:70%; transform:translateX(-50%); border-radius:50%;
	background:radial-gradient(closest-side,rgba(255,150,60,.42),rgba(242,138,46,.12) 55%,rgba(242,138,46,0)); animation:phxCandle 3s ease-in-out infinite}
.phx-odds__pk img{width:100%; filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
@keyframes phxBob{0%,72%,100%{transform:rotate(0)}78%{transform:rotate(-6deg)}84%{transform:rotate(5deg)}90%{transform:rotate(-2deg)}}
.phx-odds__i--gold .phx-odds__pk::before{background:radial-gradient(closest-side,rgba(242,201,76,.6),rgba(242,201,76,.16) 55%,rgba(242,201,76,0))}
.phx-odds__i--gold .phx-odds__pk img{filter:var(--to-gold) drop-shadow(0 0 18px rgba(242,201,76,.55))}
/* 价签：一根线吊着的一小张纸 */
.phx-odds__tag{position:relative; display:grid; justify-items:center; min-width:76px; margin-top:22px; padding:8px 8px 7px; border-radius:4px; background:#E9DEC6; color:var(--paper-ink); rotate:-3deg;
	box-shadow:0 8px 16px -6px rgba(0,0,0,.6)}
.phx-odds__i:nth-child(even) .phx-odds__tag{rotate:2.5deg}
.phx-odds__tag::before{content:""; position:absolute; bottom:100%; left:50%; width:1.5px; height:20px; margin-left:-.75px; background:rgba(233,222,198,.55)}
.phx-odds__tag::after{content:""; position:absolute; top:5px; left:50%; width:5px; height:5px; margin-left:-2.5px; border-radius:50%; background:#3A2A1C}
.phx-odds__tag b{margin-top:6px; font-size:19px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums}
.phx-odds__tag small{margin-top:3px; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(34,22,15,.62); white-space:nowrap}
.phx-odds__i--gold .phx-odds__tag{background:var(--gold)}
.phx-odds__i--gold .phx-odds__tag small{color:rgba(34,22,15,.75)}
.phx-odds__fine{max-width:40ch; margin:18px auto 0 !important; font-size:13.5px; line-height:1.55; color:var(--bone-3)}

/* 活动结束后：一只亮着的大南瓜 */
.phx-wanted{position:relative; justify-self:center; width:min(300px,100%); margin-top:150px !important}
.phx-wanted__glow{position:absolute; left:-30%; right:-30%; top:-12%; bottom:-30%; z-index:-1; border-radius:50%;
	background:radial-gradient(closest-side,rgba(var(--flame),.34),rgba(var(--flame),.1) 55%,rgba(var(--flame),0)); animation:phxCandle 3.4s ease-in-out infinite}
.phx-wanted::after{content:""; position:absolute; left:4%; right:4%; bottom:-6%; height:16%; z-index:-1; border-radius:50%; background:radial-gradient(closest-side,rgba(4,2,8,.7),rgba(4,2,8,0))}
.phx-wanted__pk{width:100%; transform-origin:50% 90%; animation:phxSway 5.2s ease-in-out infinite}
@keyframes phxSway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}

/* =========================================================================
   你的记录：一块被南瓜灯照亮的深色面板，右边是七个夜晚
   ========================================================================= */
.phx-you{padding-top:clamp(56px,6vw,90px)}
.phx-you__panel{position:relative; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(32px,5vw,72px); align-items:center; padding:clamp(28px,4vw,52px); border-radius:18px;
	background:
		radial-gradient(70% 90% at 72% 110%,rgba(242,138,46,.16),rgba(242,138,46,0) 70%),
		radial-gradient(60% 70% at 10% -10%,rgba(160,120,220,.14),rgba(160,120,220,0) 70%),
		linear-gradient(180deg,#24182F,#150E1C);
	box-shadow:inset 0 1px 0 rgba(241,232,214,.12),inset 0 0 0 1px rgba(241,232,214,.06),0 40px 80px -30px rgba(0,0,0,.8)}
.phx-you .phx-h2{margin-top:0 !important; font-size:clamp(44px,4.6vw,64px)}
.phx-you__total{margin-top:22px !important; font-size:clamp(56px,6vw,80px); font-weight:900; line-height:1; letter-spacing:-.02em; color:var(--ember); text-shadow:0 0 30px rgba(242,138,46,.4); font-variant-numeric:tabular-nums}
.phx-you__facts{display:flex; gap:32px; margin-top:18px !important}
.phx-you__facts dt{font-size:11.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--bone-3)}
.phx-you__facts dd{margin-top:4px !important; font-size:28px; font-weight:800; line-height:1; color:var(--bone); font-variant-numeric:tabular-nums}
.phx-you__facts dd small{font-size:14px; font-weight:600; color:var(--bone-3)}
.phx .phx-you__standing{margin-top:20px !important; padding-left:14px; border-left:2px solid var(--ember); font-size:15.5px; font-weight:600; line-height:1.5; color:var(--bone)}
.phx-you__note{margin-top:16px !important; font-size:14px; line-height:1.6; color:var(--bone-3)}
.phx-you__codes p + p{margin-top:10px !important}
.phx-you__codes code{display:inline-block; padding:6px 10px; border:1.5px dashed rgba(241,232,214,.4); border-radius:6px; background:transparent; color:var(--bone); font:700 15px/1 ui-monospace,Consolas,monospace; letter-spacing:.08em}
.phx-you__codes b{margin:0 8px; font-size:15px; color:var(--ember)}
/* 页面里的 button 都要盖掉 WoodMart 的悬停样式（浅灰底） */
.phx .phx-copy,.phx .phx-copy:hover,.phx .phx-copy:focus{min-height:34px; padding:0 14px; border:1px solid rgba(255,180,92,.5) !important; border-radius:6px; background:transparent !important; box-shadow:none !important; color:var(--ember) !important; font:inherit; font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; cursor:pointer}
.phx .phx-copy:hover{background:rgba(255,180,92,.12) !important}

/* 七个夜晚：每晚一列，顶上是那晚的月亮 */
.phx .phx-nights{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px}
.phx-night{position:relative; display:grid; justify-items:center; align-content:start; gap:6px; padding:14px 0 12px; border-radius:10px}
.phx-night__moon{width:30px; height:30px; margin-bottom:4px; overflow:visible; filter:drop-shadow(0 0 10px rgba(255,214,140,.25))}
.phx-night__moon circle{fill:#2E2440}
.phx-night__moon path{fill:#F6E4B4}
.phx-night b{font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--bone)}
.phx-night small{margin-top:-6px; font-size:12px; color:var(--bone-3)}
.phx-night i{display:grid; place-items:center; width:38px; height:38px; border-radius:50%; border:1.5px dashed rgba(241,232,214,.18)}
.phx-night i:has(img){border-color:transparent; background:radial-gradient(closest-side,rgba(242,138,46,.3),rgba(242,138,46,0))}
.phx-night i img{width:40px; height:40px; max-width:none}
.phx-night--next i{border-style:dotted; opacity:.6}
.phx-night--next .phx-night__moon{opacity:.55}
.phx-night--now{background:linear-gradient(180deg,rgba(242,138,46,.16),rgba(242,138,46,.04)); box-shadow:inset 0 0 0 1.5px rgba(242,138,46,.55)}
.phx-night--now b{color:var(--ember)}
.phx-night--now .phx-night__moon{filter:drop-shadow(0 0 14px rgba(255,190,110,.6))}
.phx-night em{position:absolute; bottom:-11px; padding:2px 8px; border-radius:3px; background:var(--pk); color:#1A0C02; font-size:10px; font-style:normal; font-weight:800; letter-spacing:.12em; text-transform:uppercase}

/* =========================================================================
   玩法：墓地里三块形状不同的墓碑，碑顶被月光照亮，碑脚陷进草地和雾里
   ========================================================================= */
.phx-how{padding-bottom:0}
.phx .phx-stones{position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(22px,3.4vw,52px); align-items:end; margin-top:60px !important; padding:0 2%}
.phx-stone{position:relative; display:grid; justify-items:center; align-content:start; justify-self:center; width:min(340px,100%); min-height:400px; padding:58px 30px 88px; text-align:center; transform-origin:50% 100%;
	background:
		radial-gradient(110% 55% at 72% 0%,rgba(241,232,214,.15),rgba(241,232,214,0) 62%),
		radial-gradient(80% 40% at 50% 0%,rgba(242,138,46,.12),rgba(242,138,46,0) 70%),
		linear-gradient(180deg,#3B3447 0%,#2B2536 46%,#1C1725 100%);
	box-shadow:inset 0 2px 0 rgba(241,232,214,.16),inset 4px 0 0 rgba(241,232,214,.04),inset -7px 0 0 rgba(0,0,0,.24),inset 0 -50px 60px rgba(5,3,8,.55)}
.phx-stone::after{content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:var(--grain-d); opacity:.9}
.phx-stone--1{border-radius:50% 50% 6px 6px / 120px 120px 6px 6px; rotate:-1.8deg}
.phx-stone--2{min-height:450px; padding-top:76px; rotate:.9deg; clip-path:polygon(0 17%,10% 8%,26% 2.6%,50% 0,74% 2.6%,90% 8%,100% 17%,100% 100%,0 100%)}
.phx-stone--3{min-height:380px; padding-top:66px; rotate:-.7deg; clip-path:polygon(0 9%,14% 9%,14% 0,86% 0,86% 9%,100% 9%,100% 100%,0 100%)}
/* 裂缝 */
.phx-stone--1::before,.phx-stone--3::before{content:""; position:absolute; top:22%; right:12%; width:46px; height:96px; pointer-events:none;
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 96'%3E%3Cpath d='M40 0l-9 18 6 12-14 20 5 14-12 18M23 50l-12 6' fill='none' stroke='%23120E18' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain}
.phx-stone--3::before{top:auto; bottom:22%; right:auto; left:10%; transform:scaleX(-1)}
.phx-stone__n{position:relative; font-family:var(--disp); font-size:62px; font-weight:700; line-height:1; color:var(--pk); text-shadow:0 0 22px rgba(242,138,46,.45),0 2px 0 rgba(0,0,0,.6)}
.phx-stone__n::after{content:""; display:block; width:44px; height:2px; margin:16px auto 0; background:rgba(0,0,0,.45); box-shadow:0 1px 0 rgba(241,232,214,.1)}
.phx-stone h3{position:relative; margin-top:22px !important; font-size:21px; font-weight:800; line-height:1.25; text-shadow:0 1px 0 rgba(0,0,0,.6)}
.phx-stone p{position:relative; max-width:30ch; margin-top:12px !important; font-size:15.5px; line-height:1.62; color:rgba(241,232,214,.76)}
.phx-yard{position:relative; z-index:4; display:block; width:100%; height:120px; margin-top:-62px}

/* =========================================================================
   排行榜：墓室里的铭牌，每块上面点着蜡烛；第 1 名在一束月光下
   ========================================================================= */
.phx-board{background:radial-gradient(56% 46% at 50% 34%,rgba(94,48,145,.22),rgba(94,48,145,0) 70%)}
.phx-board .phx-wrap{max-width:1080px}
.phx-crypt{position:relative; display:grid; justify-items:center; margin-top:76px}
.phx-beam{position:absolute; top:-240px; left:50%; z-index:0; width:min(620px,96vw); height:640px; transform:translateX(-50%); pointer-events:none;
	background:linear-gradient(180deg,rgba(255,230,180,.18),rgba(255,230,180,.05) 62%,rgba(255,230,180,0)); clip-path:polygon(42% 0,58% 0,100% 100%,0 100%)}
.phx-plq{position:relative; z-index:1; display:grid; justify-items:center; align-content:start; width:100%; padding:62px 18px 26px; border-radius:40px 40px 6px 6px / 22px 22px 6px 6px; text-align:center;
	background:radial-gradient(80% 60% at 50% 0%,rgba(var(--flame),.22),rgba(var(--flame),0) 70%),linear-gradient(180deg,#2D2437,#1B1523);
	box-shadow:inset 0 1px 0 rgba(241,232,214,.13),inset 0 0 0 1px rgba(241,232,214,.06),0 24px 40px rgba(0,0,0,.45)}
.phx-plq::before{content:""; position:absolute; inset:8px; border:1px solid rgba(241,232,214,.1); border-radius:inherit; pointer-events:none}
.phx-plq--1{width:min(460px,100%); padding:96px 30px 34px; border-radius:230px 230px 6px 6px / 110px 110px 6px 6px}
.phx-plq__ord{font-family:var(--disp); font-size:58px; font-weight:700; line-height:.9; color:var(--bone); text-shadow:0 0 20px rgba(255,190,110,.25)}
.phx-plq--1 .phx-plq__ord{font-size:100px; color:var(--gold); text-shadow:0 0 30px rgba(242,201,76,.45)}
.phx-plq__name{margin-top:14px; font-size:19px; font-weight:800; color:var(--bone)}
.phx-plq--1 .phx-plq__name{font-size:26px}
.phx-plq__v{margin-top:4px; font-size:13.5px; color:var(--bone-2); font-variant-numeric:tabular-nums}
.phx-plq__prize{position:relative; margin-top:16px; padding:6px 12px 6px 22px; background:var(--gold); color:var(--paper-ink); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}
.phx-plq__prize::before{content:""; position:absolute; left:10px; top:50%; width:5px; height:5px; margin-top:-2.5px; border-radius:50%; background:var(--ink)}
.phx-plq.is-open{background:linear-gradient(180deg,#241D2D,#17121E)}
.phx-plq.is-open .phx-plq__ord{color:var(--bone-3); text-shadow:none}
.phx-plq.is-open .phx-plq__name{color:var(--bone-3)}
.phx em{margin-left:6px; padding:2px 7px; border-radius:2px; background:var(--pk); color:#1A0C02; font-size:10.5px; font-style:normal; font-weight:800; letter-spacing:.12em; text-transform:uppercase; vertical-align:3px}
.phx-plq.is-me{box-shadow:inset 0 0 0 1.5px var(--pk),0 0 40px -6px rgba(242,138,46,.5),0 24px 40px rgba(0,0,0,.45)}
.phx-plqs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; width:100%; margin-top:18px}
.phx-tier{position:relative; z-index:1; display:flex; align-items:center; justify-content:center; gap:14px; width:100%; margin-top:54px !important; font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--bone)}
.phx-tier::before,.phx-tier::after{content:""; flex:1; max-width:150px; height:1px; background:var(--line)}
.phx-tier b{font-weight:800; color:var(--ember)}

/* 还没人上榜：三档奖励摆出来，蜡烛没点 */
.phx-tiers{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:18px; align-items:end; max-width:860px; margin:70px auto 0}
.phx-tierc{position:relative; display:grid; justify-items:center; padding:60px 16px 28px; border-radius:40px 40px 6px 6px / 22px 22px 6px 6px; text-align:center;
	background:linear-gradient(180deg,#2A2134,#18121F); box-shadow:inset 0 1px 0 rgba(241,232,214,.12),0 24px 40px rgba(0,0,0,.45)}
.phx-tierc--1{padding-top:84px; border-radius:200px 200px 6px 6px / 90px 90px 6px 6px}
.phx-tierc span{font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-3)}
.phx-tierc b{margin-top:8px; font-family:var(--disp); font-size:64px; font-weight:700; line-height:1; color:var(--bone)}
.phx-tierc--1 b{font-size:84px; color:var(--gold)}
.phx-tierc small{margin-top:4px; font-size:13px; color:var(--bone-3)}
.phx-tierc--1 .phx-candle{top:22px}
.phx-tierc--1 .phx-candle:nth-of-type(1){margin-left:-42px; height:22px; top:34px}
.phx-tierc--1 .phx-candle:nth-of-type(2){height:34px; top:22px}
.phx-tierc--1 .phx-candle:nth-of-type(3){margin-left:32px; height:22px; top:34px}

/* 蜡烛：烛身 + 火苗 + 一圈晃动的光 */
.phx-candle{position:absolute; top:12px; left:50%; width:10px; height:28px; margin-left:-5px; border-radius:2px 2px 1px 1px; background:linear-gradient(90deg,#C9B994,#F3EAD5 45%,#B9A983)}
.phx-candle::before{content:""; position:absolute; top:3px; left:-1px; width:4px; height:10px; border-radius:2px; background:#ECE2C9}
.phx-candle i{position:absolute; left:50%; bottom:100%; width:10px; height:18px; margin-left:-5px; border-radius:50% 50% 50% 50% / 62% 62% 38% 38%; transform-origin:50% 90%;
	background:radial-gradient(ellipse at 50% 72%,#FFF7DC 0 18%,#FFC75E 42%,#EE7623 74%,rgba(238,118,35,0) 76%); animation:phxFlame 1.7s ease-in-out infinite}
.phx-candle i::after{content:""; position:absolute; left:50%; top:50%; width:110px; height:110px; margin:-55px 0 0 -55px; border-radius:50%; pointer-events:none;
	background:radial-gradient(closest-side,rgba(var(--flame),.3),rgba(var(--flame),0)); animation:phxCandle 2.4s ease-in-out infinite}
.phx-candle.is-out i{display:none}
/* 灭了的蜡烛：烛芯 */
.phx-candle.is-out::after{content:""; position:absolute; left:50%; bottom:100%; width:1.5px; height:5px; margin-left:-.75px; background:#3A2C22}
.phx-plq--1 .phx-candle:nth-of-type(1){margin-left:-42px; height:22px; top:40px}
.phx-plq--1 .phx-candle:nth-of-type(2){height:34px; top:28px}
.phx-plq--1 .phx-candle:nth-of-type(3){margin-left:32px; height:22px; top:40px}
.phx-plq--1 .phx-candle:nth-of-type(2) i{animation-delay:-.6s}
.phx-plq--1 .phx-candle:nth-of-type(3) i{animation-delay:-1.1s}
@keyframes phxFlame{0%,100%{transform:scale(1,1) skewX(0)}25%{transform:scale(.9,1.1) skewX(3deg)}50%{transform:scale(1.05,.93) skewX(-2deg)}75%{transform:scale(.95,1.06) skewX(1deg)}}

.phx-rest{max-width:780px; margin:0 auto}
.phx .phx-list{margin-top:18px !important; padding:6px 24px; border-radius:8px; background:linear-gradient(180deg,rgba(45,36,55,.7),rgba(27,21,35,.7)); box-shadow:inset 0 1px 0 rgba(241,232,214,.1),0 24px 40px rgba(0,0,0,.35)}
.phx-list li{display:grid; grid-template-columns:52px auto 1fr auto; align-items:baseline; gap:14px; padding:14px 0; border-bottom:1px solid rgba(241,232,214,.08); font-variant-numeric:tabular-nums}
.phx-list li:last-child{border-bottom:0}
.phx-list__r{font-family:var(--disp); font-size:26px; line-height:1; color:var(--bone-3)}
.phx-list__n{font-size:16px; font-weight:600; color:var(--bone)}
.phx-list__n small{margin-left:8px; font-size:12.5px; font-weight:500; color:var(--bone-3)}
.phx-list__n small::after{content:" pumpkins"}
.phx-list__lead{height:0; border-bottom:2px dotted rgba(241,232,214,.2)}
.phx-list b{font-size:16px; font-weight:700; color:var(--bone)}
.phx-list .is-me .phx-list__r{color:var(--ember)}
.phx-list .is-open .phx-list__n,.phx-list .is-open b{font-weight:500; color:var(--bone-3)}
.phx-list .phx-list__gap{display:block; padding:6px 0; border:0; text-align:center; letter-spacing:.4em; color:var(--bone-3)}
.phx-list .phx-list__me{margin:0 -24px -6px; padding:14px 24px; border:0; border-radius:0 0 8px 8px; background:var(--pk); color:#1A0C02; box-shadow:0 0 30px -6px rgba(242,138,46,.7)}
.phx-list__me .phx-list__r,.phx-list__me .phx-list__n,.phx-list__me b{color:#1A0C02}
.phx-list__me .phx-list__n small{color:rgba(26,12,2,.7)}
.phx-list__me .phx-list__lead{border-color:rgba(26,12,2,.35)}

/* =========================================================================
   优惠券：提灯照着两张券。前面是南瓜券，后面露出一角的是排行榜券
   ========================================================================= */
.phx-coupon{background:radial-gradient(42% 52% at 24% 50%,rgba(var(--flame),.14),rgba(var(--flame),0) 72%)}
.phx-coupon__g{display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(48px,7vw,104px); align-items:center}
.phx-tickets{position:relative; max-width:500px; padding-top:188px}
.phx-lantern{position:absolute; top:-60px; left:2px; z-index:4; width:66px; transform-origin:50% 0; animation:phxSwing 5.4s ease-in-out infinite}
.phx-lantern::before{content:""; position:absolute; left:50%; bottom:100%; width:2px; height:160px; margin-left:-1px; background:linear-gradient(rgba(59,44,75,0),#3B2C4B)}
.phx-lantern::after{content:""; position:absolute; left:50%; top:52%; width:360px; height:360px; margin:-180px 0 0 -180px; border-radius:50%; pointer-events:none;
	background:radial-gradient(closest-side,rgba(var(--flame),.36),rgba(var(--flame),.1) 50%,rgba(var(--flame),0)); animation:phxCandle 3s ease-in-out infinite}
.phx-lantern svg{position:relative; z-index:1; display:block; width:100%}
.phx-ticket-back{position:absolute; top:12px; left:16%; width:86%; rotate:6deg; filter:drop-shadow(0 18px 22px rgba(4,2,8,.5))}
.phx-ticket-wrap{position:relative; z-index:2; rotate:-3deg; filter:drop-shadow(0 26px 28px rgba(4,2,8,.55)); transition:rotate .6s var(--ease)}
.phx-ticket-wrap:hover{rotate:-1deg}
.phx-ticket{--notch:84px; position:relative; display:grid; grid-template-columns:var(--notch) 1fr; color:var(--paper-ink); background:var(--paper); border-radius:8px;
	-webkit-mask:radial-gradient(circle 12px at var(--notch) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 12px at var(--notch) 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
	mask:radial-gradient(circle 12px at var(--notch) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 12px at var(--notch) 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
.phx-ticket::before{content:""; position:absolute; inset:0; z-index:1; background:var(--grain-l); pointer-events:none}
.phx-ticket__stub{position:relative; display:grid; place-items:center; background:var(--pk); color:#1A0C02}
.phx-ticket__stub::after{content:""; position:absolute; top:14px; bottom:14px; right:-2px; width:4px; background:radial-gradient(circle,var(--paper) 1.6px,transparent 2px) 0 0/4px 9px repeat-y}
.phx-ticket__stub span{writing-mode:vertical-rl; transform:rotate(180deg); font-family:var(--disp); font-size:26px; font-weight:700; letter-spacing:.12em}
/* 提灯在左上方：纸面左上偏暖、右下偏暗 */
.phx-ticket__main{position:relative; z-index:2; padding:30px 30px 26px 34px; background:radial-gradient(100% 90% at 0% 0%,rgba(var(--flame),.24),rgba(var(--flame),0) 60%),linear-gradient(135deg,rgba(0,0,0,0) 55%,rgba(60,36,16,.12))}
.phx-ticket__main::before{content:""; position:absolute; inset:12px 12px 12px 16px; border:1.5px solid rgba(196,86,26,.5); border-radius:4px; pointer-events:none}
.phx-ticket__pk{position:absolute; z-index:3; bottom:-48px; right:-44px; width:100px; rotate:10deg; filter:drop-shadow(0 10px 10px rgba(4,2,8,.45))}
.phx-ticket small{display:block; font-size:12px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--pk-deep)}
.phx-ticket__t{margin-top:6px !important; font-family:var(--disp); font-size:32px; font-weight:700; line-height:1; color:var(--paper-ink)}
.phx-ticket b{display:block; margin-top:16px; font-size:60px; font-weight:900; line-height:1; color:var(--paper-ink); text-shadow:3px 3px 0 var(--pk); font-variant-numeric:tabular-nums}
.phx-ticket b span{font-size:18px; font-weight:700; text-shadow:none}
.phx-ticket code{display:inline-block; margin-top:18px; padding:7px 12px; border:1.5px dashed rgba(34,22,15,.45); border-radius:4px; background:transparent; color:var(--paper-ink); font:700 15px/1 ui-monospace,Consolas,monospace; letter-spacing:.08em}
.phx-ticket__fine{margin-top:14px !important; font-size:12.5px; color:rgba(34,22,15,.7)}
.phx-ticket--prize{--notch:70px}
.phx-ticket--prize .phx-ticket__stub{background:var(--witch); color:var(--bone)}
.phx-ticket--prize .phx-ticket__stub span{font-size:22px}
.phx-ticket--prize .phx-ticket__main{padding:24px 26px 22px 28px}
.phx-ticket--prize .phx-ticket__main::before{border-color:rgba(94,48,145,.45)}
.phx-ticket--prize small{color:var(--witch)}
.phx-ticket--prize .phx-ticket__t{font-size:26px}
.phx-ticket--prize b{margin-top:10px; font-size:42px; text-shadow:3px 3px 0 #B99BE0}
.phx-terms{display:grid; gap:16px; margin-top:32px !important}
.phx-terms li{display:grid; grid-template-columns:22px 1fr; gap:12px; font-size:16px; line-height:1.6; color:var(--bone-2)}
.phx-terms strong{color:var(--bone)}
.phx-terms .phx-star{margin-top:5px; color:var(--pk)}
.phx-terms a{color:var(--ember); text-underline-offset:3px}

/* =========================================================================
   日期：时间表
   ========================================================================= */
.phx .phx-sched{max-width:880px; margin:56px auto 0 !important}
.phx-sched li{display:grid; grid-template-columns:150px 200px 1fr; align-items:baseline; gap:18px; padding:22px 0; border-top:1px solid var(--line)}
.phx-sched li:last-child{border-bottom:1px solid var(--line)}
.phx-sched b{font-family:var(--disp); font-size:38px; font-weight:700; line-height:1; color:var(--bone)}
.phx-sched__t{font-size:14px; font-weight:700; letter-spacing:.04em; color:var(--ember)}
.phx-sched__t span{display:block; font-weight:500; letter-spacing:0; color:var(--bone-3)}
.phx-sched__w{font-size:16.5px; color:var(--bone)}
.phx-sched .is-done{opacity:.42}
.phx-sched .is-done .phx-sched__w::after{content:"Done"; margin-left:12px; padding:2px 8px; border:1px solid currentColor; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; vertical-align:2px}

/* =========================================================================
   问答 + 正式规则：角落的蛛网和吊下来的蜘蛛
   ========================================================================= */
.phx-faq__w{max-width:880px}
.phx-faq .phx-head{margin-bottom:44px}
.phx-web{position:absolute; top:0; left:0; z-index:1; width:clamp(140px,18vw,240px); pointer-events:none}
.phx-spider{position:absolute; top:0; right:12%; z-index:4; width:36px; --len:120px; animation:phxDangle 3.8s ease-in-out infinite alternate; transition:translate .8s var(--ease)}
.phx-spider::before{content:""; position:absolute; left:50%; top:0; width:1px; height:calc(var(--len) + 6px); background:rgba(241,232,214,.28)}
.phx-spider svg{display:block; width:100%; margin-top:var(--len)}
.phx-spider:hover{translate:0 -80px}
@keyframes phxDangle{from{transform:translateY(0) rotate(-3deg)}to{transform:translateY(18px) rotate(3deg)}}
.phx-qa details{border-top:1px solid var(--line)}
.phx-qa details:last-child{border-bottom:1px solid var(--line)}
.phx-qa summary{position:relative; display:block; padding:22px 48px 22px 0; cursor:pointer; list-style:none; font-size:18px; font-weight:600; color:var(--bone); transition:color .2s}
.phx-qa summary::-webkit-details-marker{display:none}
.phx-qa summary::before,.phx-qa summary::after{content:""; position:absolute; right:6px; top:50%; width:16px; height:2px; margin-top:-1px; background:var(--pk); transition:transform .3s var(--ease)}
.phx-qa summary::after{transform:rotate(90deg)}
.phx-qa details[open] summary::after{transform:rotate(0)}
.phx-qa summary:hover{color:var(--ember)}
.phx-qa details p{max-width:66ch; padding:0 0 24px; font-size:16px; line-height:1.7; color:var(--bone-2)}
.phx-rules{margin-top:36px}
.phx-rules summary{display:inline-block; cursor:pointer; font-size:14px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ember)}
.phx-rules ol{margin-top:18px !important; padding-left:20px !important; list-style:decimal; font-size:14px; line-height:1.7; color:var(--bone-3)}
.phx-rules li{margin-bottom:10px}
.phx-rules li b{color:var(--bone-2)}

/* =========================================================================
   结尾：篱笆边的三盏南瓜灯，篱笆直接接上网站页脚
   ========================================================================= */
.phx-end{position:relative; padding:clamp(110px,11vw,160px) 0 250px; text-align:center; background:linear-gradient(180deg,rgba(28,15,39,0),#1C0F27)}
.phx-end::before{content:""; position:absolute; left:0; right:0; bottom:0; height:70%; pointer-events:none;
	background:radial-gradient(60% 80% at 50% 100%,rgba(242,138,46,.22),rgba(122,62,168,.14) 45%,transparent 75%)}
.phx-end__t{font-family:var(--disp); font-size:clamp(64px,9vw,136px); font-weight:700; line-height:.9; text-shadow:0 0 40px rgba(242,138,46,.25),0 6px 40px rgba(0,0,0,.6)}
.phx-end p{max-width:46ch; margin:22px auto 0 !important; font-size:17px; color:var(--bone-2)}
.phx-end .phx-acts{justify-content:center}
.phx-end__fence{position:absolute; left:0; right:0; bottom:0; z-index:6; height:150px;
	background:linear-gradient(var(--ink),var(--ink)) 0 100%/100% 34px no-repeat,
		linear-gradient(var(--ink),var(--ink)) 0 52px/100% 6px no-repeat,
		linear-gradient(var(--ink),var(--ink)) 0 94px/100% 6px no-repeat,
		conic-gradient(from 135deg at 13px 0,var(--ink) 90deg,transparent 0) 0 6px/26px 13px repeat-x,
		linear-gradient(90deg,transparent 9px,var(--ink) 0,var(--ink) 17px,transparent 0) 0 18px/26px 132px repeat-x}
.phx-end__fence span{position:absolute; bottom:20px}
.phx-end__fence span::before{content:""; position:absolute; left:50%; bottom:-30%; z-index:-1; width:300%; height:90%; transform:translateX(-50%); border-radius:50%;
	background:radial-gradient(closest-side,rgba(255,150,60,.5),rgba(242,138,46,.14) 55%,rgba(242,138,46,0)); animation:phxCandle 3.2s ease-in-out infinite}
.phx-end__fence .c::before{animation-duration:2.6s; animation-delay:-1s}
.phx-end__fence img{filter:drop-shadow(0 6px 0 rgba(0,0,0,.4))}
.phx-end__fence .a{left:calc(50% - 150px); width:52px; rotate:-6deg}
.phx-end__fence .b{left:calc(50% - 42px); width:84px; bottom:16px}
.phx-end__fence .c{left:calc(50% + 74px); width:48px; rotate:8deg}

/* =========================================================================
   平板与手机
   ========================================================================= */
@media (max-width:1024px){
	.phx-wrap{padding:0 22px}
	.phx-hero{min-height:0; padding:56px 0 230px}
	.phx-hero__in{grid-template-columns:1fr; gap:24px}
	.phx-hero__side{position:static; min-height:0}
	.phx-scene__art,.phx-secret{top:auto; height:640px; transform:translateX(24px)}
	/* 窄屏时月亮放到右上角，和标题错开 */
	.phx-moon{position:absolute; top:-90px; left:auto; right:-70px; width:170px; margin-left:0}
	.phx-hero__copy{position:relative; z-index:1}
	.phx-odds{margin-top:30px !important; max-width:560px}
	.phx-wanted{width:200px; margin-top:20px !important}
	.phx-you__panel{grid-template-columns:1fr}
	.phx-stones{gap:20px; padding:0}
	.phx-stone{padding:50px 18px 80px}
	.phx-plqs{grid-template-columns:repeat(2,minmax(0,1fr))}
	.phx-coupon__g{grid-template-columns:1fr}
	.phx-tickets{margin:0 auto}
	.phx-sched li{grid-template-columns:120px 1fr; row-gap:4px}
	.phx-sched__w{grid-column:2}
	.phx-spider{right:6%}
}
@media (max-width:760px){
	.phx .phx-stones{grid-template-columns:1fr; justify-items:center; gap:30px}
	.phx-stone{width:min(360px,100%); min-height:0 !important}
	.phx-stone p{max-width:32ch}
	.phx-tiers{grid-template-columns:1fr; max-width:360px}
}
@media (max-width:640px){
	.phx-title{font-size:64px}
	.phx-bill{display:block; border-bottom:0}
	.phx-bill div{display:flex; align-items:baseline; gap:14px; margin:0; padding:12px 0; border-right:0; border-bottom:1px solid var(--line)}
	.phx-bill dt{flex:none; min-width:72px; font-size:24px}
	.phx-bill dd{margin:0 !important}
	.phx .phx-odds__row{gap:8px}
	.phx-odds__pk{width:72px}
	.phx-odds__tag,.phx-odds__i:nth-child(even) .phx-odds__tag{rotate:0deg}
	.phx-odds__tag{min-width:0; width:100%; padding:7px 4px 6px}
	.phx-odds__tag b{font-size:16px}
	.phx-odds__tag small{font-size:9px; letter-spacing:.02em}
	.phx-odds__i--gold .phx-odds__tag small{white-space:normal}
	.phx-you__panel{padding:24px 16px; border-radius:14px}
	.phx-you__facts{gap:24px}
	.phx .phx-nights{gap:2px}
	.phx-night{padding:10px 0}
	.phx-night__moon{width:22px; height:22px}
	.phx-night b{font-size:10px; letter-spacing:.04em}
	.phx-night small{font-size:10px}
	.phx-night i{width:30px; height:30px}
	.phx-night i img{width:30px; height:30px}
	.phx-night em{font-size:8.5px; padding:2px 4px; letter-spacing:.04em}
	.phx-crypt{margin-top:56px}
	.phx-plq{padding:56px 10px 20px}
	.phx-plq--1{padding:76px 18px 26px}
	.phx-plq__ord{font-size:46px}
	.phx-plq--1 .phx-plq__ord{font-size:80px}
	.phx-plq__name{font-size:17px}
	.phx-plq__v{font-size:12.5px}
	.phx-plqs{gap:12px}
	.phx-tier{gap:10px; font-size:11px; letter-spacing:.12em}
	.phx .phx-list{padding:4px 16px}
	.phx-list li{grid-template-columns:40px 1fr auto; gap:10px}
	.phx-list__lead{display:none}
	.phx-list .phx-list__me{margin:0 -16px -4px; padding:14px 16px}
	.phx-tickets{padding-top:168px}
	.phx-lantern{width:44px; top:-50px}
	.phx-ticket{--notch:62px}
	.phx-ticket__main{padding:26px 22px 22px 26px}
	.phx-ticket__pk{width:72px; bottom:-26px; right:-8px}
	.phx-ticket b{font-size:46px}
	.phx-ticket__stub span{font-size:20px}
	.phx-ticket--prize{--notch:54px}
	.phx-ticket--prize b{font-size:34px}
	.phx-sched li{grid-template-columns:1fr; padding:18px 0}
	.phx-sched__w{grid-column:auto}
	.phx-sched b{font-size:32px}
	.phx-end__fence .a{left:calc(50% - 120px)}
	.phx-end__fence .c{left:calc(50% + 56px)}
}

/* 触屏没有鼠标：固定暗角，藏起来的东西直接可见 */
@media (hover:none){
	.phx-dark{background:radial-gradient(120% 90% at 60% 30%,transparent 40%,rgba(8,5,12,.38))}
	.phx-secret{-webkit-mask-image:none; mask-image:none; opacity:.8}
}
@media (prefers-reduced-motion:reduce){
	.phx *,.phx *::before,.phx *::after{animation:none !important; transition:none !important}
	.phx-bat{display:none}
	.phx-flies i{opacity:.7}
	.phx--js .phx-rv{opacity:1; transform:none}
	.phx-dark{background:radial-gradient(120% 90% at 60% 30%,transparent 40%,rgba(8,5,12,.38))}
	.phx-secret{-webkit-mask-image:none; mask-image:none; opacity:.8}
}