/* 손가락 조작판 — 가로 화면에서 양옆 여백에 둔다 */
#portal-pad{position:fixed;inset:0;z-index:99998;
  display:flex;justify-content:space-between;align-items:center;
  padding-left:calc(6px + env(safe-area-inset-left));
  padding-right:calc(6px + env(safe-area-inset-right));
  padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);
  pointer-events:none;font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif}
#portal-pad > *{pointer-events:auto}

.pp-dpad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(3,42px);gap:3px;flex:0 0 auto}
.pp-k{border:0;border-radius:12px;background:rgba(22,24,32,.55);color:#e9edf6;
  font-size:18px;line-height:1;backdrop-filter:blur(3px);
  border:1px solid rgba(255,255,255,.16);touch-action:none;user-select:none}
.pp-k.on{background:rgba(255,181,69,.85);color:#231403}
.pp-u{grid-area:1/2}.pp-l{grid-area:2/1}.pp-d{grid-area:3/2}.pp-r{grid-area:2/3}

.pp-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
  width:136px;flex:0 0 auto;justify-items:stretch}
.pp-b{border:0;border-radius:999px;padding:8px 3px;font-size:12px;font-weight:700;
  background:rgba(22,24,32,.55);color:#e9edf6;border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(3px);touch-action:none;user-select:none;white-space:nowrap}
.pp-b.on{background:rgba(255,181,69,.85);color:#231403}
.pp-shield{background:rgba(70,110,190,.5)}
.pp-shield.on{background:rgba(120,180,255,.9);color:#06121f}

/* 가로 모드: 화면을 고정하고 게임을 한가운데 놓는다 (크기는 touchpad.js 가 계산한다) */
html.pp-land,html.pp-land body{height:100%;overflow:hidden;margin:0;
  overscroll-behavior:none;background:#0d1016}
html.pp-land body{display:flex;align-items:center;justify-content:center}
html.pp-land canvas{display:block}
/* 게임이 스스로 넣는 확대 배율을 우리 값으로 덮어쓴다 */
html.pp-land #stage{position:fixed !important;left:50% !important;top:50% !important;
  margin:0 !important;
  transform:translate(-50%,-50%) scale(var(--pp-scale,1)) !important;
  transform-origin:center center !important}

/* 세로로 들면 플레이를 막는다 */
#portal-block{position:fixed;inset:0;z-index:100000;display:none;
  align-items:center;justify-content:center;text-align:center;
  background:#0d1016;color:#e9edf6;
  font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif;padding:28px}
#portal-block .pb-in{max-width:320px}
#portal-block .pb-icon{font-size:52px;line-height:1;color:#ffb545;margin-bottom:14px}
#portal-block h2{margin:0 0 12px;font-size:22px}
#portal-block p{margin:0 0 10px;font-size:14px;line-height:1.65;color:#aab3c4}
#portal-block .pb-sub{color:#ffb545;font-weight:600}
#portal-block .pb-back{display:inline-block;margin-top:16px;padding:10px 18px;
  border-radius:999px;border:1px solid rgba(255,255,255,.22);
  color:#e9edf6;text-decoration:none;font-size:13px;font-weight:600}

@media (min-width:901px) and (pointer:fine){#portal-pad,#portal-block{display:none !important}}

@media (max-height:400px){
  .pp-dpad{grid-template-columns:repeat(3,36px);grid-template-rows:repeat(3,36px)}
  .pp-k{font-size:15px;border-radius:10px}
  .pp-btns{width:118px;gap:4px}
  .pp-b{padding:6px 2px;font-size:11px}
}