/* 触屏虚拟操作层（src/core/touch.js 配套）
   只在手机/平板上创建；桌面浏览器里 .iw-tch 根本不存在。
   整层只在「真实对局且无菜单」时可见（.is-play），其余时候 pointer-events 全关，
   菜单、结算屏、地图图钉的点击一律穿透过去。 */

.iw-tch {
  position: fixed; inset: 0; z-index: 30;
  pointer-events: none;
  touch-action: none;
  -webkit-user-select: none; user-select: none;
  -webkit-tap-highlight-color: transparent;
  font-family: 'GameSC', system-ui, sans-serif;
  --edge-r: max(2.6vmin, env(safe-area-inset-right));
  --edge-b: max(2.4vmin, env(safe-area-inset-bottom));
  --gap: 2.4vmin;
}
.iw-tch.is-play { pointer-events: auto; }

/* ---- 转向 / 摇杆捕获层：铺满全屏，按落点分区派发 */
/* 这一层必须一直能被摸到：地图的光标就靠它把滑动换算成鼠标增量转给 diorama。
   图钉的确认走的是"跳"键（padPressed A），不需要点击穿透 —— 早先加的 .is-map 让位规则
   反而会把地图光标的唯一驱动掐断。 */
.iw-tch__aim { position: absolute; inset: 0; z-index: 1; }

/* ---- 浮动摇杆：按下才现形，位置跟着手指走 */
.iw-tch__stick {
  position: absolute; left: 0; top: 0; z-index: 2; width: 0; height: 0;
  opacity: 0; transition: opacity .13s ease;
}
.iw-tch__stick.is-on { opacity: 1; }
.iw-tch__stick > i {
  position: absolute; width: calc(var(--r) * 2); height: calc(var(--r) * 2);
  margin: calc(var(--r) * -1) 0 0 calc(var(--r) * -1); border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, rgba(12,17,34,.18), rgba(12,17,34,.42));
  border: 2px solid rgba(255,255,255,.3);
  box-shadow: 0 6px 22px rgba(0,0,0,.34), inset 0 0 22px rgba(140,190,255,.12);
}
.iw-tch__stick > b {
  position: absolute; width: calc(var(--r) * 0.94); height: calc(var(--r) * 0.94);
  margin: calc(var(--r) * -0.47) 0 0 calc(var(--r) * -0.47); border-radius: 50%;
  background: radial-gradient(circle at 37% 30%, rgba(255,255,255,.96), rgba(206,224,255,.78) 46%, rgba(118,146,206,.7));
  box-shadow: 0 4px 14px rgba(0,0,0,.42);
  will-change: transform;
}

/* ---- 按钮通用
   只在真实对局里现身：菜单、结算、转场时整层收起（visibility 同时也吃掉命中） */
.iw-tch__pad, .iw-tch__stick { visibility: hidden; }
.iw-tch.is-play .iw-tch__pad, .iw-tch.is-play .iw-tch__stick { visibility: visible; }

.iw-tch__pad { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.iw-tch__b {
  position: absolute; display: grid; place-items: center; padding: 0;
  color: #f4f8ff; font: 700 2.9vmin/1 'GameSC', system-ui, sans-serif;
  letter-spacing: .04em; border-radius: 50%;
  background: radial-gradient(circle at 40% 28%, rgba(255,255,255,.24), rgba(255,255,255,.05) 58%), rgba(14,20,40,.46);
  border: 2px solid rgba(255,255,255,.32);
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
  box-shadow: 0 5px 16px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.22);
  pointer-events: none;
  transition: transform .07s ease, background-color .07s ease, border-color .07s ease;
}
.iw-tch.is-play .iw-tch__b { pointer-events: auto; }
.iw-tch__b span { pointer-events: none; }
.iw-tch__b.is-on {
  transform: scale(.9);
  background: radial-gradient(circle at 40% 28%, rgba(255,255,255,.42), rgba(255,255,255,.14) 58%), rgba(0,200,200,.6);
  border-color: rgba(255,255,255,.78);
}

/* ---- 右下动作区：弧形排布，喷射落在拇指自然落点 */
.iw-tch__b--fire  { right: var(--edge-r); bottom: var(--edge-b); width: 20vmin; height: 20vmin; font-size: 3.3vmin; }
.iw-tch__b--jump  { right: calc(var(--edge-r) + 23.2vmin); bottom: calc(var(--edge-b) + 1.6vmin); width: 14.6vmin; height: 14.6vmin; }
.iw-tch__b--squid { right: calc(var(--edge-r) + 1.4vmin); bottom: calc(var(--edge-b) + 23.4vmin); width: 14.6vmin; height: 14.6vmin; }
.iw-tch__b--sub   { right: calc(var(--edge-r) + 23.6vmin); bottom: calc(var(--edge-b) + 18.6vmin); width: 12.8vmin; height: 12.8vmin; }
.iw-tch__b--sp    { right: calc(var(--edge-r) + 9.4vmin); bottom: calc(var(--edge-b) + 38.2vmin); width: 12.8vmin; height: 12.8vmin; }

/* 大招就绪时自己亮起来，不用盯设置面板 */
.iw-tch__b--sp.is-ready { border-color: rgba(255,214,102,.9); box-shadow: 0 0 0 0 rgba(255,206,70,.55); animation: iw-tch-ready 1.5s ease-out infinite; }
@keyframes iw-tch-ready {
  0% { box-shadow: 0 5px 16px rgba(0,0,0,.3), 0 0 0 0 rgba(255,206,70,.5); }
  70% { box-shadow: 0 5px 16px rgba(0,0,0,.3), 0 0 0 2.6vmin rgba(255,206,70,0); }
  100% { box-shadow: 0 5px 16px rgba(0,0,0,.3), 0 0 0 0 rgba(255,206,70,0); }
}

/* ---- 右上系统键：地图（开关式）与暂停 */
.iw-tch__pad--sys {
  position: absolute; inset: auto var(--edge-r) auto auto;
  top: max(2.4vmin, env(safe-area-inset-top)); z-index: 3;
  display: flex; gap: 1.8vmin; pointer-events: none;
}
.iw-tch__pad--sys .iw-tch__b { position: relative; right: auto; bottom: auto; width: 14.6vmin; height: 9.6vmin; border-radius: 999px; font-size: 2.7vmin; }
.iw-tch__b--map.is-on { background: radial-gradient(circle at 40% 28%, rgba(255,255,255,.42), rgba(255,255,255,.12) 58%), rgba(255,160,60,.55); }

/* 触屏没有键盘可按，菜单底部的按键提示条只会误导（屏上的按钮本来就点得动） */
.iw-ui.is-touch .iw-prompts { display: none; }

/* ---- 竖屏提示：3D 涂地对战必须有横向视野 */
.iw-tch__rot { display: none; }
@media (orientation: portrait) {
  .iw-tch__rot {
    position: absolute; inset: 0; z-index: 9; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 2.4vmin;
    background: rgba(9,12,26,.93); color: #eef3ff; text-align: center;
    font: 700 4.4vmin/1.5 'GameSC', system-ui, sans-serif; letter-spacing: .06em;
  }
  .iw-tch__rot small { font-size: 2.9vmin; font-weight: 500; opacity: .68; letter-spacing: .02em; }
  .iw-tch__rot > i {
    display: block; width: 13vmin; height: 22vmin; border-radius: 2.6vmin;
    border: .7vmin solid rgba(255,255,255,.72);
    transform: rotate(0deg);
    animation: iw-tch-rot 2.1s ease-in-out infinite;
  }
  .iw-tch__aim, .iw-tch__stick, .iw-tch__pad { display: none; }
}
@keyframes iw-tch-rot {
  0%, 28% { transform: rotate(0deg); }
  62%, 100% { transform: rotate(-90deg); }
}
