/* ===== 摸鱼大作战：行动抽屉入口 + 全屏限时小游戏 ===== */

/* 抽屉入口（与其他活动入口同构，仅换配色） */
.mg-entry.fish-e{background:linear-gradient(120deg,rgba(56,190,130,.2),rgba(242,193,78,.14));border-color:rgba(56,190,130,.45)}
.mg-entry.fish-e .me-ic{background:linear-gradient(135deg,#38BE82,#F2C14E);box-shadow:0 6px 14px rgba(56,190,130,.35)}

/* 覆盖层：锁定一屏，不跟随页面滚动 */
.fish{
  position:fixed;inset:0;z-index:360;display:flex;flex-direction:column;
  padding:calc(env(safe-area-inset-top) + 10px) 14px calc(env(safe-area-inset-bottom) + 12px);
  background:radial-gradient(120% 80% at 50% 0%,#132033 0%,#0A0E15 62%,#070A10 100%);
  color:#E8EEF7;overflow:hidden;overscroll-behavior:contain;
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;
  animation:fhIn .22s ease-out both;
}
@keyframes fhIn{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:none}}

.fh-top{display:flex;align-items:center;gap:10px;flex:none;margin-bottom:10px}
.fh-top .fh-tt{flex:1;font-size:16px;font-weight:900;letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.fh-top .fh-tt svg{width:18px;height:18px;color:#F2C14E}
.fh-x{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#C7D2E1;font-size:15px;font-weight:900;display:grid;place-items:center;flex:none}
.fh-x:active{transform:scale(.94)}
.fh-x.wide{width:auto;padding:0 12px;font-size:12px}

/* 通用按钮 */
.fh-btn{width:100%;height:46px;border-radius:13px;border:0;font-size:14px;font-weight:900;letter-spacing:.03em;color:#0B1018;background:linear-gradient(135deg,#F2C14E,#E8A33D);box-shadow:0 10px 22px rgba(242,193,78,.26)}
.fh-btn:active{transform:scale(.97)}
.fh-btn.ghost{background:rgba(255,255,255,.06);color:#C7D2E1;border:1px solid rgba(255,255,255,.14);box-shadow:none}
.fh-btn[disabled]{opacity:.45;box-shadow:none;pointer-events:none}

/* 介绍页 */
.fh-intro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;min-height:0;overflow-y:auto;padding:6px 2px}
.fh-badge{width:74px;height:74px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#38BE82,#F2C14E);box-shadow:0 14px 30px rgba(56,190,130,.3)}
.fh-badge svg{width:36px;height:36px;color:#0B1018}
.fh-intro h2{margin:0;font-size:20px;font-weight:900;letter-spacing:.05em}
.fh-lead{margin:0;max-width:320px;font-size:12.5px;line-height:1.7;color:#9FB0C6}
.fh-rules{width:100%;max-width:340px;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:2px}
.fh-rules div{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:9px 11px;border-radius:11px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);font-size:11.5px}
.fh-rules b{font-weight:900;color:#E8EEF7}
.fh-rules span{color:#8FA3BA;font-weight:800}
.fh-rules span.up{color:#57D69A}
.fh-rules span.down{color:#F2555F}
.fh-meta{font-size:11.5px;color:#8FA3BA;font-weight:800}
.fh-meta b{color:#F2C14E}
.fh-intro .fh-btn{max-width:340px}

/* 对局页 */
.fh-hud{flex:none;margin-bottom:10px}
.fh-bar{height:7px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.fh-bar i{display:block;height:100%;width:100%;border-radius:999px;background:linear-gradient(90deg,#38BE82,#F2C14E);transition:width .1s linear}
.fh-bar.low i{background:linear-gradient(90deg,#F2A24E,#F2555F)}
.fh-stats{display:flex;align-items:center;justify-content:space-between;margin-top:8px;font-size:11.5px;color:#8FA3BA;font-weight:800}
.fh-stats b{font-size:15px;color:#E8EEF7;margin-left:4px}
.fh-stats b.pop{animation:fhPop .18s ease-out}
@keyframes fhPop{0%{transform:scale(1)}45%{transform:scale(1.28);color:#F2C14E}100%{transform:scale(1)}}

.fh-grid{position:relative;flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:10px;width:100%;max-width:430px;margin:0 auto;touch-action:manipulation}
.fh-desk{position:relative;overflow:hidden;padding:0;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#1B2534,#131A25);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);display:grid;place-items:center}
.fh-desk:active{transform:scale(.985)}
.fh-desk.bad{border-color:rgba(242,85,95,.6);animation:fhShake .3s}
@keyframes fhShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.fh-desk::after{content:"";position:absolute;left:14%;right:14%;bottom:12%;height:2px;border-radius:2px;background:rgba(255,255,255,.07)}

.fh-tk{width:66%;height:66%;border-radius:14px;display:grid;place-items:center;color:#fff;animation:fhTk .2s cubic-bezier(.2,1.5,.4,1) both;box-shadow:0 8px 18px rgba(0,0,0,.35)}
.fh-tk svg{width:66%;height:66%}
.fh-tk.out{animation:fhOut .18s ease-in both}
@keyframes fhTk{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
@keyframes fhOut{to{opacity:0;transform:scale(.7)}}
.fh-tk.coffee{background:linear-gradient(135deg,#3E7BD6,#38BE82)}
.fh-tk.snack{background:linear-gradient(135deg,#F2C14E,#E8803D);color:#1A1206}
.fh-tk.phone{background:linear-gradient(135deg,#8B5CF6,#3E7BD6)}
.fh-tk.pay{background:linear-gradient(135deg,#F2C14E,#F2555F);color:#1A1206}
.fh-tk.boss{background:linear-gradient(135deg,#F2555F,#8E1225);box-shadow:0 0 0 2px rgba(255,255,255,.16) inset,0 8px 20px rgba(242,85,95,.4)}
.fh-tk.boss::before{content:"BOSS";position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:8px;font-weight:900;letter-spacing:.14em;color:#FFE1E4}

.fh-fly{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);font-size:17px;font-weight:900;color:#F2C14E;text-shadow:0 2px 8px rgba(0,0,0,.6);pointer-events:none;animation:fhFly .72s ease-out both;white-space:nowrap}
.fh-fly.bad{color:#F2555F}
@keyframes fhFly{0%{opacity:0;transform:translate(-50%,-20%) scale(.8)}22%{opacity:1}100%{opacity:0;transform:translate(-50%,-150%) scale(1.08)}}

.fh-combo{position:absolute;left:8px;top:8px;padding:2px 7px;border-radius:999px;background:rgba(242,193,78,.2);border:1px solid rgba(242,193,78,.5);color:#F2C14E;font-size:9.5px;font-weight:900;pointer-events:none}

.fh-foot{flex:none;display:flex;align-items:center;gap:8px;margin-top:10px}
.fh-hint{flex:1;font-size:10.5px;color:#7E90A8;font-weight:800;line-height:1.5}
.fh-end{flex:none;height:38px;padding:0 14px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#C7D2E1;font-size:12px;font-weight:900}
.fh-end:active{transform:scale(.96)}

/* 结算页 */
.fh-over{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;min-height:0;overflow-y:auto;padding:4px 0}
.fh-oc{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:rgba(242,193,78,.14);border:1px solid rgba(242,193,78,.4)}
.fh-oc svg{width:30px;height:30px;color:#F2C14E}
.fh-oscore{font-size:34px;font-weight:900;letter-spacing:.02em;color:#F2C14E;line-height:1.1}
.fh-osub{font-size:11.5px;color:#8FA3BA;font-weight:800}
.fh-oreward{width:100%;max-width:340px;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);padding:12px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;font-size:12px;font-weight:900;color:#57D69A}
.fh-oreward .n{color:#F2555F}
.fh-oreward .wait{color:#8FA3BA;font-weight:800}
.fh-obtns{width:100%;max-width:340px;display:flex;flex-direction:column;gap:8px;margin-top:2px}

/* 矮屏适配：压缩装饰，保证按钮与棋盘都在一屏内 */
@media (max-height:620px){
  .fh-badge{width:56px;height:56px}
  .fh-intro h2{font-size:17px}
  .fh-lead{display:none}
  .fh-rules div{padding:7px 9px}
  .fh-grid{gap:8px}
}
