#dfa-root {
  --bg-color: #080810;
  --accent-color: #ff5e3a;
  --accent-glow: rgba(255, 94, 58, 0.4);
  --text-light: #ffffff;
  --glass-bg: rgba(255, 255, 255, 0.05);
  --glass-border: rgba(255, 255, 255, 0.15);
  --panel-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.8);
}

#dfa-root * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Noto Sans JP', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#dfa-root {
  background-color: var(--bg-color);
  background-image: 
    radial-gradient(circle at 20% 20%, rgba(25, 118, 210, 0.1) 0%, transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(211, 47, 47, 0.1) 0%, transparent 40%);
  color: var(--text-light);
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  overflow: hidden;
}

#dfa-root #game-container {
  position: relative;
  width: 100vw;   /* デフォルト（PC）は全画面表示 */
  height: 100vh;
  background-color: #000;
  overflow: hidden;
}

#dfa-root #game-view {
  flex: 1;
  position: relative;
  width: 100%;
  height: 100%;
}

#dfa-root #three-canvas-container {
  width: 100%;
  height: 100%;
  background: #000;
}

#dfa-root #ui-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10000; /* 最前面を保証 */
}/* Glassmorphism Panels */


#dfa-root .player-hint {
  position: absolute;
  background: var(--glass-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: var(--text-light);
  padding: 16px 20px;
  border-radius: 12px;
  pointer-events: none;
  border: 1px solid var(--glass-border);
  box-shadow: var(--panel-shadow);
  transition: transform 0.3s ease;
}

#dfa-root .player-hint h2 {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
  opacity: 0.9;
}

#dfa-root .player-hint p {
  font-size: 13px;
  margin: 4px 0;
  color: rgba(255, 255, 255, 0.8);
}

#dfa-root .player-hint p strong {
  color: #fff;
  font-weight: 900;
  font-size: 15px;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}

#dfa-root #p1-hint {
  top: 70px;
  left: 20px;
  border-left: 4px solid #2196f3;
  max-width: 200px; 
  display: none; /* 常駐ガイドに置き換えたため非表示 */
  z-index: 150;
}/* 常設操作ガイド (Top-left HUD) */


#dfa-root #hud-control-guide {
  position: absolute;
  top: 15px;
  left: 15px;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  padding: 8px 15px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #fff;
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.6;
  pointer-events: none;
  z-index: 1000;
  box-shadow: 0 4px 15px rgba(0,0,0,0.5);
  letter-spacing: 0.5px;
}

#dfa-root .guide-line {
  white-space: nowrap;
}/* ハイスコアボード */


#dfa-root #highscore-board {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
  padding: 10px 25px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
}

#dfa-root .highscore-item {
  font-size: 11px;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: 1px;
}

#dfa-root .highscore-item span {
  color: #ffeb3b;
  margin-left: 5px;
  text-shadow: 0 0 10px rgba(255, 235, 59, 0.5);
}/* Overlays *//* オーバーレイ：常に画面中央に配置 (Central Overlay System) */



#dfa-root #menu-overlay, #dfa-root #game-over-overlay, #dfa-root #countdown-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  pointer-events: auto;
  z-index: 100;
  padding: 10px;
  overflow-y: auto;
}

#dfa-root #menu-overlay h1, #dfa-root #game-over-overlay h1 {
  font-size: 24px;
  margin-top: 10px;
  margin-bottom: 5px;
}

#dfa-root #menu-overlay .subtitle, #dfa-root #game-over-overlay .subtitle {
  font-size: 10px;
  margin-bottom: 10px;
}

#dfa-root #menu-overlay .menu-section, #dfa-root #game-over-overlay .menu-section {
  margin-bottom: 8px;
  max-width: 500px;
}

#dfa-root #menu-overlay .menu-section h3, #dfa-root #game-over-overlay .menu-section h3 {
  font-size: 9px;
  margin-bottom: 4px;
}

#dfa-root #menu-overlay .diff-btn, #dfa-root #game-over-overlay .diff-btn {
  font-size: 10px;
  padding: 6px 14px;
  min-width: 80px;
}

#dfa-root #countdown-overlay {
  background: transparent;
  backdrop-filter: none;
  pointer-events: none;
}

#dfa-root #countdown-text {
  font-size: 120px;
  font-weight: 900;
  color: #fff;
  text-shadow: 0 0 30px rgba(255, 255, 255, 0.4);
}/* コンパクト・リザルトメニュー (Result Screen Optimization) */


#dfa-root #game-over-overlay {
  padding: 20px;
  justify-content: center;
}

#dfa-root #game-over-overlay h1 {
  font-size: 28px;
  margin-bottom: 5px;
}

#dfa-root #game-over-overlay .subtitle {
  font-size: 10px;
  margin-bottom: 15px;
}

#dfa-root #game-over-overlay .menu-section {
  margin-bottom: 10px;
  max-width: 500px;
}

#dfa-root #game-over-overlay .menu-section h3 {
  font-size: 10px;
  margin-bottom: 5px;
}

#dfa-root #game-over-overlay .diff-btn {
  font-size: 11px;
  padding: 8px 16px;
}/* ズーム切り棒 (Tactical Zoom Button) */


#dfa-root #zoom-control {
  position: absolute;
  top: 20px;
  left: 60px; /* 高度ゲージの右隣 */
  z-index: 110;
}

#dfa-root .btn-zoom {
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid #ff792e;
  color: #ff792e;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
  letter-spacing: 1px;
  backdrop-filter: blur(4px);
}

#dfa-root .btn-zoom:active {
  background: #ff792e;
  color: #000;
}

@keyframes popIn {
  from { transform: scale(0.9); opacity: 0.7; }
  to { transform: scale(1.1); opacity: 1; }
}

#dfa-root .hidden {
  display: none !important;
}

#dfa-root h1 {
  font-size: 56px;
  margin-bottom: 10px;
  font-weight: 900;
  letter-spacing: -1px;
  background: linear-gradient(to bottom, #fff, #bbb);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 12px var(--accent-glow));
}

#dfa-root .subtitle {
  font-size: 16px;
  margin-bottom: 40px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
}/* Premium Buttons */


#dfa-root button {
  background: linear-gradient(135deg, var(--accent-color), #ff8e75);
  color: white;
  border: none;
  padding: 14px 40px;
  font-size: 20px;
  font-weight: 800;
  border-radius: 50px;
  cursor: pointer;
  box-shadow: 0 8px 24px var(--accent-glow);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  pointer-events: auto;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#dfa-root button:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 12px 32px var(--accent-glow);
  filter: brightness(1.1);
}

#dfa-root button:active {
  transform: translateY(1px);
}

#dfa-root .difficulty-buttons {
  display: flex;
  gap: 16px;
  margin-top: 10px;
}

#dfa-root .diff-btn {
  font-size: 14px;
  padding: 12px 24px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

#dfa-root .diff-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.4);
}

#dfa-root .btn-strong {
  background: linear-gradient(135deg, #ff5e3a, #ff2e00) !important;
  border: none;
}/* New Menu Groupings */


#dfa-root .menu-section {
  width: 100%;
  max-width: 600px;
  margin-bottom: 20px;
  text-align: center;
}

#dfa-root .menu-section h3 {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.4);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding-bottom: 5px;
}

#dfa-root .difficulty-buttons {
  display: flex;
  justify-content: center;
  gap: 12px;
}/* Status Bar */


#dfa-root #status-bar {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 40px;
  background: var(--glass-bg);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: 12px 40px;
  border-radius: 100px;
  border: 1px solid var(--glass-border);
  box-shadow: var(--panel-shadow);
  pointer-events: none;
}

#dfa-root .status-item {
  font-size: 18px;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 1px;
}

#dfa-root #alive-count, #dfa-root #time-left {
  color: #fff;
  font-size: 20px;
  margin-left: 8px;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

#dfa-root #time-left {
  color: #ffeb3b;
}

#dfa-root #current-stage {
  color: #00ff00;
  text-shadow: 0 0 10px rgba(0, 255, 0, 0.6);
}

#dfa-root #stage-status {
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  padding-left: 20px;
}/* Name Tags */


#dfa-root #name-tags-container {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none;
  z-index: 5;
}

#dfa-root .name-tag {
  position: absolute;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(4px);
  color: #fff;
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  transform: translate(-50%, -100%);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
  pointer-events: none;
  transition: opacity 0.3s ease;
}/* --- Advanced Handheld Console UI: PRO ORANGE (RESTORATION) --- */


#dfa-root #console-frame {
  display: flex;
  width: 100%;
  height: 100%;
  background: #050508;
  overflow: hidden;
  position: relative;
  z-index: 1; /* UIレイヤーより後ろに配置 */
}

#dfa-root .console-wing {
  width: 240px; 
  height: 100%;
  background: linear-gradient(180deg, #1a1a20 0%, #0a0a0f 100%);
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  position: relative;
  box-shadow: inset 0 0 40px rgba(0,0,0,0.8);
  border: none;
  z-index: 200;
  display: none; /* デフォルト（PC）では隠す */
}

#dfa-root #game-view {
  flex: 1;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#dfa-root #three-canvas-container {
  width: 100%;
  height: 100%;
  background: #000;
}/* Version Badge */


#dfa-root .version-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.3);
  letter-spacing: 1px;
}/* --- Advanced Handheld Console UI: PRO ORANGE --- */


#dfa-root #console-frame {
  display: flex;
  width: 100%;
  height: 100%;
  background: #050508;
  overflow: hidden;
}

#dfa-root .console-wing {
  width: 240px; 
  height: 100%;
  background: linear-gradient(180deg, #1a1a20 0%, #0a0a0f 100%);
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  position: relative;
  box-shadow: inset 0 0 40px rgba(0,0,0,0.8);
  border: none;
  z-index: 200;
  display: none; /* デフォルト（PC）では隠す */
}/* モバイル向け（1024px以下 または スマホ横向き） */


@media (max-width: 1024px), (orientation: landscape) and (max-height: 550px) {
  #dfa-root #p1-hint { display: none; }/* キーボード説明を隠す */ 
  #dfa-root .console-wing { display: flex; }/* 操作パネルを表示 */ 
  #dfa-root #altitude-gauge-container { display: block; }
  
  #dfa-root #game-container {
    width: 100vw;
    height: 100vh;
  }
}/* 高度ゲージ (Altitude Gauge) */


#dfa-root #altitude-gauge-container {
  position: absolute;
  top: 50px;
  left: 10px;
  width: 30px;
  height: calc(100% - 100px);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 121, 46, 0.3);
  border-radius: 4px;
  z-index: 150;
  display: none;
}

#dfa-root #altitude-bar {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 10%;
    background: linear-gradient(to top, #FF6F00, #FFA000);
    box-shadow: 0 0 15px rgba(255,160,0,0.5);
    transition: height 0.1s ease-out;
}

#dfa-root #target-altitude-pointer {
    position: absolute;
    left: -10px;
    bottom: 0; /* JSで動的に変更 */
    width: 30px;
    height: 4px;
    background: #FFEB3B;
    box-shadow: 0 0 10px #FFEB3B;
    border-radius: 2px;
    transition: bottom 0.2s ease-out;
    z-index: 5;
}/* ポインターの矢印部分 */


#dfa-root #target-altitude-pointer::after {
    content: '';
    position: absolute;
    right: -8px;
    top: -4px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 8px solid #FFEB3B;
}

#dfa-root #altitude-value {
  position: absolute;
  top: -30px;
  left: -10px;
  width: 50px;
  text-align: center;
  font-size: 10px;
  font-weight: 900;
  color: #ff792e;
}/* 戦術レーダー (Tactical Radar HUD) */


#dfa-root #tactical-radar-container {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 100px;
  height: 120px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 69, 0, 0.2);
  border-radius: 4px;
  backdrop-filter: blur(5px);
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 100;
  pointer-events: none;
}

#dfa-root .radar-cube {
  position: relative;
  width: 80px;
  height: 80px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
}

#dfa-root .radar-dot {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.1s linear;
}

#dfa-root .dot-player {
  background: #ff792e;
  box-shadow: 0 0 10px #ff792e;
  z-index: 2;
}

#dfa-root .dot-enemy {
  background: #ff0000;
  box-shadow: 0 0 8px #ff0000;
  z-index: 1;
}

#dfa-root .radar-label {
  margin-top: 8px;
  font-size: 8px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 900;
  letter-spacing: 1px;
}/* 巨大FLIPボタン (Final Evolution Tech Style) */


#dfa-root .gui-btn-large {
  position: relative;
  width: 130px; /* 少し大きく */
  height: 130px;
  background: 
    radial-gradient(circle at 30% 30%, rgba(255, 121, 46, 0.4) 0%, transparent 60%),
    radial-gradient(circle at center, rgba(20, 10, 5, 0.95) 0%, #000 100%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='20' viewBox='0 0 12 20'%3E%3Cpath d='M0 0l6 3.5L12 0v13l-6 3.5L0 13V0zm6 3.5v13L0 13V0l6 3.5zm0 0v13l12-3.5V0l-6 3.5z' fill='%23ff4500' fill-opacity='0.05'/%3E%3C/svg%3E"), /* ヘキサゴンパターン */
    radial-gradient(circle at center, rgba(255, 69, 0, 0.3) 0%, #000 100%);
  border: 1px solid #ff4500;
  border-radius: 50%;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 2px;
  box-shadow: 
    0 0 30px rgba(255, 69, 0, 0.4),
    inset 0 0 20px rgba(255, 69, 0, 0.4),
    inset 0 10px 20px rgba(255, 255, 255, 0.1); /* ガラスのハイライト */
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  user-select: none;
  overflow: hidden; /* スキャンライン用 */
  z-index: 10;
}/* スキャンライン（光のスイープ） */


#dfa-root .gui-btn-large::after {
  content: '';
  position: absolute;
  top: -100%; left: -100%;
  width: 300%; height: 50%;
  background: linear-gradient(to bottom, transparent, rgba(255, 121, 46, 0.4), transparent);
  transform: rotate(45deg);
  animation: scanline-sweep 4s infinite;
  pointer-events: none;
}/* ボタン周囲のサイバーブラケット */


#dfa-root .v-joystick-vertical::before {
  content: 'LAUNCH';
  position: absolute;
  top: 15px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  color: #ff4500;
  letter-spacing: 4px;
  opacity: 0.6;
}

@keyframes scanline-sweep {
  0% { transform: translate(-50%, -50%) rotate(45deg); }
  25% { transform: translate(100%, 100%) rotate(45deg); }
  100% { transform: translate(100%, 100%) rotate(45deg); }
}

#dfa-root .gui-btn-large:active {
  transform: scale(0.9) rotate(-5deg);
  background: #ff4500;
  box-shadow: 0 0 70px #ff4500;
  color: #000;
}

#dfa-root .gui-btn-large.btn-used {
  filter: grayscale(1) opacity(0.4);
  pointer-events: none;
  border-color: #444;
  box-shadow: none;
}

#dfa-root .gui-btn-large:active::after {
  display: none;
}/* バーチャルスティック (Joysticks) */


#dfa-root .v-joystick-vertical, #dfa-root .v-joystick-horizontal {
  position: relative;
  width: 160px;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  touch-action: none;
}

#dfa-root .joy-ring {
  position: absolute;
  width: 140px;
  height: 140px;
  border: 2px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
}

#dfa-root .joy-stick {
  position: absolute;
  width: 60px;
  height: 60px;
  background: radial-gradient(circle at 30% 30%, #444, #111);
  border: 2px solid #555;
  border-radius: 50%;
  box-shadow: 0 8px 15px rgba(0,0,0,0.5);
  z-index: 10;
  pointer-events: none;
  transition: transform 0.05s linear;
}/* スティック内部のオレンジ発光 */


#dfa-root .joy-stick::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 10px; height: 10px;
  background: #ff792e;
  border-radius: 50%;
  box-shadow: 0 0 10px #ff792e;
}

#dfa-root .ring-arrow {
  position: absolute;
  color: rgba(255, 69, 0, 0.4);
  font-size: 14px;
  font-weight: 900;
}
#dfa-root .arrow-up { top: 10px; }
#dfa-root .arrow-down { bottom: 10px; }
#dfa-root .arrow-left { left: 10px; }
#dfa-root .arrow-right { right: 10px; }

#dfa-root .joy-label {
  position: absolute;
  color: rgba(255, 255, 255, 0.3);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
}
#dfa-root .text-up { top: -20px; }
#dfa-root .text-down { bottom: -20px; }/* --- Mobile Responsive & Forced Landscape --- */


@media (max-width: 950px), (orientation: landscape) and (max-height: 550px) {
  #dfa-root { padding: 0; margin: 0; display: block; overflow: hidden; background: #000; }
  
  #dfa-root #game-container {
    width: 100vw;
    height: 100vh;
    border-radius: 0;
    max-width: none;
    max-height: none;
  }

  #dfa-root .console-wing {
    display: flex;
  }
  
  #dfa-root #altitude-gauge-container {
    display: block;
  }

  #dfa-root h1 { font-size: 24px; }
  #dfa-root .subtitle { display: none; }
}/* 縦画面時の強制回転 (Forced Landscape Rotation) */


@media (orientation: portrait) and (max-width: 600px) {
  #dfa-root #game-container {
    width: 100vh;
    height: 100vw;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
    transform-origin: center center;
  }
  
  #dfa-root .side-panel { display: none; }/* 不要なパネルを隠す */ 
}


/* --- WordPress plugin wrapper safety layer --- */
#dfa-root {
  position: relative;
  width: 100%;
  max-width: 100%;
  isolation: isolate;
}

#dfa-root #dfa-launcher {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
}

#dfa-root #dfa-start-fullscreen-btn {
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

#dfa-root #dfa-fullscreen-wrapper {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: #000;
  z-index: 999999;
}

#dfa-root #dfa-fullscreen-wrapper.dfa-closed {
  pointer-events: none;
}

#dfa-root #dfa-close-btn {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 1000001;
  padding: 10px 16px;
  font-size: 14px;
  line-height: 1;
  border-radius: 999px;
}

#dfa-root #game-container {
  position: absolute;
  inset: 0;
}

@media (max-width: 767px) {
  #dfa-root #dfa-close-btn {
    top: 10px;
    right: 10px;
    padding: 9px 14px;
    font-size: 13px;
  }
}

/* === v1.3.0 UI PATCH: 3D横長ランチャー・視認性・PC安全領域 === */
#dfa-root.dfa-root{
  display:block !important;
  min-height:0 !important;
  overflow:visible !important;
  background:transparent !important;
  color:#fff !important;
  font-family:'Noto Sans JP',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
}
#dfa-root #dfa-launcher.dfa-launcher-3d{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:clamp(16px,3vw,36px) !important;
  width:min(100%,1120px) !important;
  min-height:clamp(210px,26vw,320px) !important;
  margin:24px auto !important;
  padding:clamp(22px,4vw,46px) !important;
  overflow:hidden !important;
  border-radius:24px !important;
  border:1px solid rgba(0,210,255,.45) !important;
  background:
    radial-gradient(circle at 18% 50%,rgba(255,105,38,.35),transparent 34%),
    radial-gradient(circle at 75% 30%,rgba(0,180,255,.32),transparent 36%),
    linear-gradient(135deg,#070913 0%,#0b1530 48%,#080810 100%) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.42), inset 0 0 80px rgba(0,198,255,.08) !important;
  isolation:isolate !important;
}
#dfa-root #dfa-launcher .dfa-launcher-bg{
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  background:
    linear-gradient(110deg,transparent 0 16%,rgba(255,255,255,.09) 16.5% 17%,transparent 17.5% 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 72px) !important;
  opacity:.8 !important;
}
#dfa-root #dfa-launcher .dfa-launcher-bg::before{
  content:'3D' !important;
  position:absolute !important;
  right:clamp(18px,4vw,60px) !important;
  top:50% !important;
  transform:translateY(-50%) skewX(-10deg) !important;
  font-size:clamp(84px,16vw,210px) !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:rgba(255,255,255,.055) !important;
  letter-spacing:-.08em !important;
}
#dfa-root .dfa-launcher-kicker{
  display:inline-flex !important;
  color:#00dcff !important;
  background:rgba(0,220,255,.1) !important;
  border:1px solid rgba(0,220,255,.28) !important;
  border-radius:999px !important;
  padding:6px 12px !important;
  font-size:clamp(11px,1.4vw,14px) !important;
  font-weight:900 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  margin-bottom:14px !important;
}
#dfa-root .dfa-launcher-title{
  color:#fff !important;
  font-size:clamp(30px,6vw,72px) !important;
  font-weight:900 !important;
  line-height:.95 !important;
  letter-spacing:-.045em !important;
  text-shadow:0 0 24px rgba(0,210,255,.34),0 4px 0 rgba(0,0,0,.35) !important;
}
#dfa-root .dfa-launcher-title span{
  color:#ffb100 !important;
  text-shadow:0 0 24px rgba(255,177,0,.5) !important;
}
#dfa-root .dfa-launcher-text{
  color:rgba(255,255,255,.86) !important;
  font-size:clamp(14px,1.8vw,18px) !important;
  line-height:1.8 !important;
  margin-top:14px !important;
  max-width:620px !important;
}
#dfa-root .dfa-launcher-actions{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  align-items:stretch !important;
  min-width:min(280px,100%) !important;
}
#dfa-root #dfa-start-fullscreen-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:56px !important;
  padding:14px 24px !important;
  border-radius:14px !important;
  border:1px solid rgba(255,214,83,.8) !important;
  background:linear-gradient(180deg,#ffe474 0%,#ffb400 54%,#d98200 100%) !important;
  color:#111 !important;
  font-size:18px !important;
  font-weight:900 !important;
  letter-spacing:.04em !important;
  box-shadow:0 12px 28px rgba(255,180,0,.34), inset 0 1px 0 rgba(255,255,255,.7) !important;
  text-shadow:none !important;
}
#dfa-root .dfa-shortcode-note{
  color:rgba(255,255,255,.64) !important;
  font-size:12px !important;
  font-weight:700 !important;
  text-align:center !important;
}
#dfa-root #dfa-fullscreen-wrapper{
  background:#02030a !important;
  color:#fff !important;
}
#dfa-root #dfa-close-btn{
  top:calc(12px + var(--wp-admin--admin-bar--height, 0px)) !important;
  right:14px !important;
  background:rgba(10,15,24,.88) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.32) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.45) !important;
}
#dfa-root #menu-overlay,
#dfa-root #game-over-overlay{
  background:radial-gradient(circle at 50% 20%,rgba(0,160,255,.16),transparent 38%),rgba(2,4,12,.88) !important;
  color:#fff !important;
  padding:clamp(18px,3vw,36px) !important;
}
#dfa-root #menu-overlay h1,
#dfa-root #game-over-overlay h1{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:none !important;
  filter:none !important;
  font-size:clamp(30px,5.5vw,64px) !important;
  line-height:1 !important;
  margin:0 0 8px !important;
  text-shadow:0 0 22px rgba(0,210,255,.28) !important;
}
#dfa-root .dfa-title-3d{
  color:#ffb100 !important;
  -webkit-text-fill-color:#ffb100 !important;
}
#dfa-root #menu-overlay .subtitle,
#dfa-root #game-over-overlay .subtitle{
  display:block !important;
  color:#ffb100 !important;
  font-weight:900 !important;
  letter-spacing:.22em !important;
  margin:0 0 18px !important;
  text-shadow:none !important;
}
#dfa-root #highscore-board,
#dfa-root .menu-section{
  color:#fff !important;
  background:rgba(3,10,22,.78) !important;
  border:1px solid rgba(0,210,255,.24) !important;
  box-shadow:0 14px 36px rgba(0,0,0,.38), inset 0 0 30px rgba(0,210,255,.05) !important;
}
#dfa-root .menu-section{
  border-radius:16px !important;
  padding:12px !important;
}
#dfa-root .menu-section h3{
  color:rgba(255,255,255,.86) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
}
#dfa-root .diff-btn,
#dfa-root #game-over-overlay .diff-btn,
#dfa-root #menu-overlay .diff-btn{
  background:linear-gradient(180deg,rgba(15,38,65,.95),rgba(5,16,32,.95)) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  border:1px solid rgba(0,210,255,.38) !important;
  border-radius:12px !important;
  box-shadow:0 8px 20px rgba(0,0,0,.32) !important;
  text-shadow:none !important;
}
#dfa-root .diff-btn:hover,
#dfa-root .diff-btn:focus{
  background:linear-gradient(180deg,rgba(0,95,140,.98),rgba(8,28,55,.98)) !important;
  color:#fff !important;
}
#dfa-root .btn-strong{
  background:linear-gradient(135deg,#ff6b2a,#c72a00) !important;
  color:#fff !important;
  border-color:rgba(255,166,84,.65) !important;
}
#dfa-root #hud-control-guide{
  top:calc(54px + var(--wp-admin--admin-bar--height, 0px)) !important;
  left:clamp(12px,2vw,28px) !important;
  max-width:min(330px,34vw) !important;
  color:#fff !important;
  background:rgba(0,0,0,.62) !important;
  border:1px solid rgba(0,210,255,.24) !important;
  z-index:350 !important;
}
#dfa-root #status-bar{
  top:calc(54px + var(--wp-admin--admin-bar--height, 0px)) !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  gap:clamp(10px,1.8vw,24px) !important;
  padding:9px clamp(14px,2vw,28px) !important;
  max-width:calc(100vw - 420px) !important;
  white-space:nowrap !important;
  background:rgba(0,0,0,.58) !important;
  border:1px solid rgba(0,210,255,.25) !important;
  z-index:330 !important;
}
#dfa-root .status-item{
  font-size:clamp(12px,1.2vw,16px) !important;
}
#dfa-root #tactical-radar-container{
  top:calc(58px + var(--wp-admin--admin-bar--height, 0px)) !important;
  right:clamp(14px,2vw,30px) !important;
  width:clamp(92px,8.5vw,122px) !important;
  height:clamp(112px,10vw,142px) !important;
  background:rgba(0,0,0,.62) !important;
  border:1px solid rgba(255,106,0,.34) !important;
  z-index:330 !important;
}
#dfa-root #zoom-control{
  top:calc(58px + var(--wp-admin--admin-bar--height, 0px)) !important;
  left:clamp(150px,16vw,360px) !important;
  z-index:340 !important;
}
@media (max-width: 1200px){
  #dfa-root #status-bar{max-width:calc(100vw - 280px) !important;}
  #dfa-root #hud-control-guide{font-size:11px !important;max-width:260px !important;}
}
@media (max-width: 950px), (orientation: landscape) and (max-height: 550px){
  #dfa-root #dfa-launcher.dfa-launcher-3d{grid-template-columns:1fr !important;min-height:220px !important;padding:22px !important;}
  #dfa-root .dfa-launcher-actions{width:100% !important;}
  #dfa-root #hud-control-guide{display:none !important;}
  #dfa-root #status-bar{top:10px !important;max-width:64vw !important;padding:6px 10px !important;gap:8px !important;}
  #dfa-root #tactical-radar-container{top:10px !important;right:10px !important;transform:scale(.82);transform-origin:top right;}
  #dfa-root #zoom-control{top:10px !important;left:50px !important;}
}
@media (max-width: 767px){
  #dfa-root #dfa-launcher.dfa-launcher-3d{margin:16px auto !important;border-radius:18px !important;}
  #dfa-root .dfa-launcher-title{font-size:36px !important;}
  #dfa-root #menu-overlay h1,#dfa-root #game-over-overlay h1{font-size:32px !important;}
  #dfa-root .difficulty-buttons{flex-wrap:wrap !important;gap:8px !important;}
}

/* === v1.3.1 menu visibility hard fix: keep game menu readable under any theme CSS === */
#dfa-root #menu-overlay .menu-section > h3,
#dfa-root #game-over-overlay .menu-section > h3{
  display:block !important;box-sizing:border-box !important;width:100% !important;min-height:34px !important;margin:0 0 14px 0 !important;padding:8px 12px !important;border:1px solid rgba(0,210,255,.85) !important;border-radius:6px !important;background:#064f9f !important;background-image:linear-gradient(180deg,#0979dc 0%,#064f9f 55%,#04366f 100%) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;opacity:1 !important;visibility:visible !important;font-family:'Noto Sans JP',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;font-size:clamp(14px,1.4vw,18px) !important;font-weight:900 !important;line-height:1.2 !important;letter-spacing:.14em !important;text-align:center !important;text-transform:none !important;text-shadow:0 2px 0 rgba(0,0,0,.42),0 0 14px rgba(255,255,255,.38) !important;box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 0 16px rgba(0,210,255,.28) !important;filter:none !important;-webkit-background-clip:border-box !important;background-clip:border-box !important;
}
#dfa-root #menu-overlay .menu-section,
#dfa-root #game-over-overlay .menu-section{
  background:#02070d !important;background-image:linear-gradient(180deg,rgba(2,10,18,.96),rgba(1,5,10,.98)) !important;border:1px solid rgba(0,210,255,.72) !important;border-radius:18px !important;padding:16px 18px !important;box-shadow:0 0 20px rgba(0,210,255,.18),inset 0 0 24px rgba(0,125,255,.05) !important;
}
#dfa-root #menu-overlay .diff-btn,
#dfa-root #game-over-overlay .diff-btn,
#dfa-root #menu-overlay button.diff-btn,
#dfa-root #game-over-overlay button.diff-btn{
  appearance:none !important;-webkit-appearance:none !important;background:#071b31 !important;background-image:linear-gradient(180deg,#0e2c4b 0%,#071b31 100%) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;opacity:1 !important;border:1px solid rgba(0,210,255,.85) !important;border-radius:14px !important;font-weight:900 !important;text-shadow:0 1px 0 rgba(0,0,0,.55) !important;box-shadow:0 0 12px rgba(0,210,255,.18),inset 0 0 12px rgba(255,255,255,.04) !important;
}
#dfa-root #menu-overlay .btn-strong,
#dfa-root #game-over-overlay .btn-strong{background:#0e2c4b !important;background-image:linear-gradient(180deg,#0e2c4b 0%,#071b31 100%) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;}

/* === v1.4.0 coexistence safety patch === */
#dfa-root #dfa-fullscreen-wrapper{z-index:2147483000 !important;display:block;}
#dfa-root #dfa-fullscreen-wrapper.hidden,#dfa-root #dfa-fullscreen-wrapper.dfa-closed{display:none !important;pointer-events:none !important;}
#dfa-root #dfa-fullscreen-wrapper:not(.hidden):not(.dfa-closed){display:block !important;pointer-events:auto !important;}
#dfa-root #dfa-close-btn{z-index:2147483001 !important;}


/* === v1.4.2 active-game isolation patch ===
   3Dゲーム起動中だけ #dfa-root 自体を最前面の固定レイヤー化し、
   Cocoonのウィジェット/バナー/サイドバーがゲーム画面に写り込む問題を防ぐ。
   ゲームロジック・BGM・2D共存制御には触れない。 */
body.dfa-3d-modal-open{
  overflow:hidden !important;
}
body.dfa-3d-modal-open .dfa-hide-during-game{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
body.dfa-3d-modal-open .custom-html-widget:has(img[src*="dronefight-air.jpg"]),
body.dfa-3d-modal-open .textwidget:has(img[src*="dronefight-air.jpg"]),
body.dfa-3d-modal-open .widget:has(img[src*="dronefight-air.jpg"]),
body.dfa-3d-modal-open a[href*="ronefight-air-new-arrival"],
body.dfa-3d-modal-open a[href*="dronefight-air-new-arrival"],
body.dfa-3d-modal-open img[src*="dronefight-air.jpg"]{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
#dfa-root.dfa-is-open{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100svh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#02030a !important;
  z-index:2147483000 !important;
  isolation:isolate !important;
  contain:layout paint style !important;
}
#dfa-root.dfa-is-open #dfa-launcher{
  display:none !important;
}
#dfa-root.dfa-is-open #dfa-fullscreen-wrapper{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100svh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#02030a !important;
  background-image:none !important;
  z-index:2147483000 !important;
}
#dfa-root.dfa-is-open #game-container,
#dfa-root.dfa-is-open #game-view,
#dfa-root.dfa-is-open #three-canvas-container{
  background:#02030a !important;
  background-image:none !important;
}
#dfa-root.dfa-is-open #menu-overlay,
#dfa-root.dfa-is-open #game-over-overlay,
#dfa-root.dfa-is-open #countdown-overlay{
  background:#02030a !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
#dfa-root.dfa-is-open #dfa-close-btn{
  position:fixed !important;
  z-index:2147483002 !important;
}
