/* 第 7 关：folklore 黑森林，作用域 .fk */
.fk{position:absolute;inset:0;overflow:hidden;background:#141c17;background-image:radial-gradient(rgba(255,255,255,.045) 1px,transparent 1.3px),radial-gradient(circle at 50% 50%,#1b2620,#0f1512 80%);background-size:22px 22px,100% 100%;touch-action:none;user-select:none}
.fk-far{position:absolute;left:0;top:0;width:1440px;height:320px;display:flex;will-change:transform;opacity:.9}
.fk-far .art{width:720px;height:320px;flex:none}
.fk-far::after{content:'';position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(transparent,#141c17)}
.fk-world{position:absolute;left:0;top:0;width:0;height:0;will-change:transform}
.fk-world>div{position:absolute;left:0;top:0;will-change:transform}
.fk-tree,.fk-prop{pointer-events:none}
.fk-mist{position:absolute;left:-360px;width:1080px;height:200px;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 30% 50%,rgba(170,190,175,.14),transparent 60%),radial-gradient(ellipse at 70% 40%,rgba(170,190,175,.12),transparent 55%)}
.fk-mist.m1{top:120px;animation:fkmist 18s linear infinite}
.fk-mist.m2{top:360px;animation:fkmist 26s linear infinite reverse}
@keyframes fkmist{from{transform:translateX(0)}to{transform:translateX(360px)}}
.fk-flies{position:absolute;inset:0;pointer-events:none;z-index:2}
.fk-flies i{position:absolute;width:4px;height:4px;border-radius:50%;background:#e9f3a6;box-shadow:0 0 8px 2px rgba(233,243,166,.7);animation:fkfly 6s ease-in-out infinite alternate,fkblink 2.2s ease-in-out infinite}
.fk-flies i:nth-child(1){left:12%;top:30%;animation-delay:0s,.3s}.fk-flies i:nth-child(2){left:25%;top:62%;animation-delay:1s,.9s}.fk-flies i:nth-child(3){left:40%;top:20%;animation-delay:2s,1.4s}.fk-flies i:nth-child(4){left:55%;top:75%;animation-delay:.5s,.1s}.fk-flies i:nth-child(5){left:70%;top:40%;animation-delay:1.5s,.7s}.fk-flies i:nth-child(6){left:85%;top:58%;animation-delay:2.5s,1.9s}.fk-flies i:nth-child(7){left:8%;top:80%;animation-delay:3s,.5s}.fk-flies i:nth-child(8){left:33%;top:45%;animation-delay:3.5s,1.1s}.fk-flies i:nth-child(9){left:48%;top:88%;animation-delay:4s,.2s}.fk-flies i:nth-child(10){left:62%;top:12%;animation-delay:4.5s,1.6s}.fk-flies i:nth-child(11){left:78%;top:82%;animation-delay:5s,.8s}.fk-flies i:nth-child(12){left:92%;top:25%;animation-delay:5.5s,1.3s}.fk-flies i:nth-child(13){left:18%;top:50%;animation-delay:2.2s,.6s}.fk-flies i:nth-child(14){left:66%;top:66%;animation-delay:.8s,1.7s}
@keyframes fkfly{from{transform:translate(0,0)}to{transform:translate(30px,-24px)}}
@keyframes fkblink{0%,100%{opacity:.2}50%{opacity:1}}
.fk-fog{position:absolute;inset:0;background:radial-gradient(circle at 50% 52%,transparent 30%,rgba(0,0,0,.8) 85%);pointer-events:none;z-index:3}
.fk-grain{position:absolute;inset:0;background-image:repeating-radial-gradient(circle at 17% 31%,rgba(255,255,255,.06) 0 1px,transparent 1px 3px),repeating-radial-gradient(circle at 73% 68%,rgba(0,0,0,.12) 0 1px,transparent 1px 4px);mix-blend-mode:overlay;pointer-events:none;z-index:4;opacity:.7}
.fk-player{filter:saturate(.55) drop-shadow(0 4px 3px rgba(0,0,0,.6))}
.fk-player .la{animation:none}.fk-player .lb{opacity:0;animation:none}
.fk-player.walk .la{animation:legA .3s steps(1) infinite}.fk-player.walk .lb{animation:legB .3s steps(1) infinite}
.fk-player.hurt{filter:saturate(.55) brightness(2) drop-shadow(0 0 8px #ff4d4d)}
.fk-player.down>.fk-visual{transform:scaleX(var(--face,1)) rotate(90deg);opacity:.6}
.fk-ghost{transition:opacity .25s}
.fk-ghost.dead>.fk-visual{animation:fk-death .25s ease-out both}
.fk-pick{animation:fkfloat 1.2s ease-in-out infinite alternate}
@keyframes fkfloat{from{margin-top:-48px}to{margin-top:-56px}}
.fk-pick b{position:absolute;left:50%;top:100%;transform:translateX(-50%);color:#fff;font-size:11px;font-weight:800;white-space:nowrap;text-shadow:0 1px 3px #000;font-family:Georgia,serif;font-style:italic}
.fk-pick.got{animation:fkgot .4s ease-out both}
@keyframes fkgot{to{opacity:0;margin-top:-90px}}
.fk-bolt{width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff,0 0 20px #ffd166;margin:-5px 0 0 -5px!important}
.fk-whip{width:104px!important;height:200px!important;transform-origin:0 50%;filter:drop-shadow(0 0 4px #fff8);margin:-100px 0 0 0!important;pointer-events:none}
.fk-boss{filter:drop-shadow(0 0 16px #ffd166) drop-shadow(0 6px 4px rgba(0,0,0,.6))}
.fk-boss.hurt{filter:brightness(2.2) drop-shadow(0 0 14px #ff4d4d)}

/* HUD */
.fk-hud{position:absolute;left:14px;right:14px;top:12px;z-index:5}
.fk-hp{position:relative;height:20px;background:rgba(0,0,0,.5);border:3px solid #cfcfcf;border-radius:10px;overflow:hidden}
.fk-hp i{display:block;height:100%;background:linear-gradient(90deg,#d9d9d0,#fff);transform-origin:left;transition:transform .15s}
.fk-hp span{position:absolute;inset:0;text-align:center;font-size:11px;font-weight:900;line-height:14px;color:#fff;mix-blend-mode:difference}
.fk-items{margin-top:6px;color:#fff;font-size:12px;font-weight:800;text-shadow:0 1px 3px #000;font-family:Georgia,serif}
.fk-bossbar{position:relative;margin-top:6px;height:14px;background:rgba(0,0,0,.5);border:2px solid #ffd166;border-radius:8px;overflow:hidden;display:none}
.fk-bossbar.on{display:block}
.fk-bossbar i{display:block;height:100%;background:#ffd166;transform-origin:left;transition:transform .1s}
.fk-bossbar span{position:absolute;inset:0;text-align:center;font-size:9px;font-weight:900;line-height:10px;color:#1c1c30}
.fk-compass{position:absolute;left:50%;top:86px;width:44px;height:44px;margin-left:-22px;border-radius:50%;border:3px solid rgba(255,255,255,.7);background:rgba(0,0,0,.4);z-index:5;transition:opacity .3s}
.fk-compass i{position:absolute;left:50%;top:50%;width:0;height:0;margin:-14px 0 0 -8px;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:26px solid #ffd166;transform-origin:50% 14px}
.fk-toast{position:absolute;left:50%;top:150px;transform:translateX(-50%);background:rgba(255,255,255,.92);color:#1c1c30;font-weight:800;font-size:13px;padding:6px 14px;border-radius:999px;opacity:0;transition:opacity .15s;z-index:6;white-space:nowrap;pointer-events:none;font-family:Georgia,serif}
.fk-toast.on{opacity:1}
.fk-title{position:absolute;right:16px;bottom:52px;color:rgba(255,255,255,.55);font-family:Georgia,serif;font-style:italic;font-size:22px;letter-spacing:.06em;z-index:5;pointer-events:none}

/* 三选一 */
.fk-choose{position:absolute;inset:0;background:rgba(0,0,0,.72);z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.fk-choose-t{color:#fff;font-size:20px;font-weight:900;font-family:Georgia,serif;letter-spacing:.05em}
.fk-cards{display:flex;gap:8px;padding:0 10px}
.fk-card{width:108px;background:linear-gradient(#f7f4ec,#dcd6c8);border:3px solid #1c1c30;border-radius:12px;box-shadow:4px 4px 0 #1c1c30;padding:10px 6px;text-align:center;cursor:pointer}
.fk-card:active{transform:translate(2px,2px);box-shadow:2px 2px 0 #1c1c30}
.fk-card .art{width:56px;height:56px;margin:0 auto;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.fk-card b{display:block;font-family:Georgia,serif;font-style:italic;font-size:13px;margin-top:6px;color:#1c1c30}
.fk-card small{display:block;font-size:10px;color:#555;margin-top:4px;line-height:1.3}

/* 通关 */
.fk-win{position:absolute;inset:0;z-index:9;background:radial-gradient(circle at 50% 45%,rgba(255,209,102,.4),rgba(0,0,0,.88) 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.fk-win-singer{width:130px;height:162px;filter:drop-shadow(0 0 22px #ffd166);animation:fkrise .8s cubic-bezier(.2,1.4,.4,1) both}
@keyframes fkrise{from{transform:translateY(60px) scale(.6);opacity:0}to{transform:none;opacity:1}}
.fk-win-t{font-size:52px;font-weight:900;color:#fff;-webkit-text-stroke:2px #1c1c30;paint-order:stroke fill;text-shadow:5px 5px 0 #1c1c30;transform:rotate(-4deg);animation:fkrise .6s .3s cubic-bezier(.2,1.6,.4,1) both}
.fk-win-s{color:#ffd166;font-family:Georgia,serif;font-style:italic;font-size:14px;letter-spacing:.08em;animation:fkrise .6s .5s both}

.fk-visual{width:100%;height:100%;transform-origin:50% 90%}.fk-player>.fk-visual{transform:scaleX(var(--face,1));filter:drop-shadow(0 0 1px #fff9) drop-shadow(0 3px 3px #0008)}.fk-player:before{content:'';position:absolute;left:12px;bottom:-3px;width:40px;height:11px;border:1px solid #e4d39b;border-radius:50%;background:#182b26b3;box-shadow:0 0 12px #d4d4a333}.fk-tree,.fk-prop{transition:opacity .12s}.fk-tree.occluding,.fk-prop.occluding{opacity:.22}.fk-bolt,.fk-ball,.fk-whip{z-index:3000!important}.fk-grain{opacity:.08}.fk-fog{background:radial-gradient(ellipse at 50% 52%,transparent 40%,#071713b0 100%)}@keyframes fk-death{0%{filter:brightness(2);opacity:1;transform:scale(1)}100%{filter:brightness(1.4);opacity:0;transform:scale(1.45)}}.fk-equipped{display:flex;align-items:center;gap:5px;font-size:10px}.fk-equipped .art{width:27px;height:27px}.fk-items{display:flex;justify-content:space-between;align-items:center}.fk-collection{display:flex;gap:7px}.fk-collection i{display:flex;flex-direction:column;align-items:center;opacity:.4;font-style:normal}.fk-collection .art{width:29px;height:29px}.fk-collection small{font-size:8px}.fk-collection i.got{opacity:1;filter:drop-shadow(0 0 4px #d6bc67)}.fk-compass{top:109px}.fk-choose-note{color:#bbc9bf;font-size:11px}.fk-card{min-height:154px}.fk-player>.fk-visual>.art{width:100%;height:100%}
