/* ./data/css/app.css */

@font-face {
  font-family: "SourceHanSansJP-Normal";
  src: url("../font/SourceHanSansJP-Normal.otf") format("opentype");
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

/* 2026.01.10 add by yoshi */
html {
  /* ブラウザによる文字サイズ調整を完全に禁止 */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* 2026.01.10 add by yoshi */
body {
  /* 画面幅をデバイス幅に固定し、はみ出しを許さない */
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;

  /* フォントブースティングの計算を狂わせるための最大高さ指定 */
  max-height: 100%;

  /* 固定配置 */
  position: fixed;
  top: 0;
  left: 0;
}

/* --- 背面レイヤー（AR/Mapbox） --- */
#layerAr,
#layerPano,
#layerMapbox {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;            /* だめなら 100vh */
  z-index: 10;
  display: none;             /* 初期は非表示 */
  pointer-events: none;      /* 初期は触れない */
  overflow: hidden;
}

/* 地図の描画コンテナ（各SDKはこの子要素だけを触る） */
#mapMapbox {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* --- Tyrano（前面） --- */
#tyrano_base {
  position: absolute !important;
  z-index: 1000 !important;

  /*
    2026.01.10 add by yoshi
    文字サイズ継承をリセット
  */
  -webkit-text-size-adjust: none;
  text-size-adjust: none;

  overflow: hidden; /* 旧: style="overflow: hidden" */
}

#vchat_base {
  overflow: hidden; /* 旧: style="overflow: hidden" */
}

/* --- AR/Map モード中：Tyrano は “ボタン以外” を透過 --- */
body.space-ar-map #tyrano_base {
  background-color: transparent !important;
}

body.space-ar-map #tyrano_base,
body.space-ar-map #tyrano_base * {
  pointer-events: none !important;
}

body.space-ar-map #root_layer_system .glink_button,
body.space-ar-map #root_layer_system .event-setting-element,
body.space-ar-map #root_layer_system .menu_item {
  pointer-events: auto !important;
}

body.space-ar-map #vmouse,
body.space-ar-map .layer_event_click,
body.space-ar-map .layer_menu {
  pointer-events: none !important;
}

body.space-ar-map #root_layer_game {
  opacity: 1 !important;
}

/* 画面全体にタイル背景を敷く */
#bg-tile {
  position: fixed;
  inset: 0;                 /* top/right/bottom/left:0 */
  width: 100vw;
  height: 100dvh;           /* dvh非対応は後述@supportsで保険 */
  z-index: 0;               /* 背景レイヤー */
  pointer-events: none;

  background-image: url("../image/fullback.webp");
  background-repeat: repeat;
  background-position: 0 0;

  background-size: 256px 256px;
}

/* 背景画像：高さを画面縦にフィット、横は比率維持で自動、左右センター */
#bg-full {
  position: fixed;
  top: 0;
  left: 50%;
  z-index: 1;
  transform: translateX(-50%);

  height: 100dvh;   /* dvhが無い環境は下の@supportsで100vh */
  width: auto;

  pointer-events: none;
}

/* dvh 非対応の保険 */
@supports not (height: 100dvh) {
  #bg-tile { height: 100vh; }
  #bg-full { height: 100vh; }
}