/* 迷因人物 */
html{overflow-x:hidden}
@media (max-width:819px){body{overflow-x:clip}}
.wj{position:absolute;z-index:0;pointer-events:none;mix-blend-mode:var(--wj-blend);filter:var(--wj-filter);max-width:none;height:auto}
.hd{position:relative}
.hd h1,.upRow,.row{position:relative;z-index:1}
.row{background:var(--bg)}
#wjB{right:-16px;top:-6px;width:118px;--r:6deg;transform:rotate(var(--r));animation:wob 1.7s steps(1,end) infinite}
.ft{position:relative;height:30px}
#wjA{left:-14px;bottom:-150px;width:130px;transform-origin:50% 32.95%;--r:-4deg;transform:rotate(var(--r));animation:wob 1.1s steps(1,end) infinite}
@media (max-width:819px){
 /* 手機:人物依螢幕寬度縮放,貼在標題右側、橫幅下緣之下;
    只留頭與上半身(裁掉下半身線條並淡出),.hd 依人物高度撐出空間,不與上傳列重疊 */
 .hd{--wj:clamp(58px,24vw,100px);min-height:calc(var(--wj)*1.29 - 10px)}
 #wjB{right:-16px;top:calc(var(--wj)*.07 - 14px);width:var(--wj);height:calc(var(--wj)*1.15);object-fit:cover;object-position:top;-webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent)}
 @media (max-width:359px){#wjB{right:-24px}}
 @media (max-width:339px){.hd{--wj:max(58px,20vw)}}
}
@keyframes wob{0%{transform:rotate(var(--r))}50%{transform:rotate(calc(var(--r) + 3deg))}}
@media (prefers-reduced-motion:reduce){.wj{animation:none !important}}
@media (min-width:820px){
 .wj{position:fixed;display:none}
 .ft{height:0}
 #wjA{left:2vw;bottom:-5vh;top:auto;--r:-5deg}
 #wjB{right:3vw;left:auto;top:11vh;--r:7deg}
}
/* 內容欄 960px:兩側空間 >= 1200px 才放得下人物,以 (100vw - 內容欄)/2 算寬度 */
@media (min-width:1200px) and (max-width:1399px){
 .wj{display:block}
 #wjA{width:clamp(96px,calc((100vw - 960px)/2 - 20px),280px)}
 #wjB{width:clamp(80px,calc((100vw - 960px)/2 - 56px),230px)}
}
/* 內容欄 1240px(3 欄):>= 1500px 才放得下 */
@media (min-width:1500px){
 .wj{display:block}
 #wjA{width:clamp(96px,calc((100vw - 1240px)/2 - 20px),280px)}
 #wjB{width:clamp(80px,calc((100vw - 1240px)/2 - 64px),230px)}
}
/* 深色:人物不反相,改成白底手繪圓角貼紙(border-box 沿用原寬度,padding 讓線稿不貼邊);灰色硬陰影在黑底上襯出厚度 */
@media (prefers-color-scheme:dark){
 .wj{background:#fff;padding:5px;box-shadow:3px 3px 0 #777}
 #wjB{border-radius:40px 12px 36px 12px/12px 36px 12px 40px}
 #wjA{border-radius:12px 40px 12px 36px/36px 12px 40px 12px}
 @media (max-width:819px){#wjB{-webkit-mask-image:none;mask-image:none}}
 /* 貼紙多出的旋轉角與陰影:兩側人物再各縮 16px,與內容欄保留間隙 */
 @media (min-width:1200px) and (max-width:1399px){#wjA{width:clamp(96px,calc((100vw - 960px)/2 - 36px),280px)}#wjB{width:clamp(80px,calc((100vw - 960px)/2 - 72px),230px)}}
 @media (min-width:1500px){#wjA{width:clamp(96px,calc((100vw - 1240px)/2 - 36px),280px)}#wjB{width:clamp(80px,calc((100vw - 1240px)/2 - 80px),230px)}}
}
