/* 画面全体の基本設定 */
html, body { 
    margin: 0; padding: 0; overflow: hidden; 
    background: #87CEEB; font-family: sans-serif; 
    touch-action: none; height: 100%; width: 100%;
    position: fixed; /* スクロールを禁止して操作性を安定させる */
}
canvas { display: block; }

/* スコアなどの文字情報 */
#ui { position: absolute; top: 10px; left: 10px; color: #333; font-size: 16px; font-weight: bold; text-shadow: 1px 1px white; pointer-events: none; z-index: 20; }
#stage-info { position: absolute; top: 10px; right: 90px; font-size: 18px; font-weight: bold; color: white; text-shadow: 1px 1px black; }

/* 全画面ボタン */
#btn-fs { 
    position: absolute; top: 10px; right: 10px; width: 70px; height: 35px; 
    background: #444; color: white; border: 2px solid #fff; 
    border-radius: 8px; display: flex; align-items: center; justify-content: center; 
    font-size: 14px; z-index: 1000; cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

/* 中央に表示されるメッセージ */
#msg { position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); color: #FF4500; font-size: 32px; font-weight: bold; display: none; text-shadow: 3px 3px white; text-align: center; z-index: 30; width: 100%; }
#start-guide { position: absolute; bottom: 50%; width: 100%; text-align: center; font-weight: bold; color: white; text-shadow: 1px 1px 5px black; pointer-events: none; }

/* スマホ用ボタンの共通デザイン */
.btn { 
    position: absolute; bottom: 40px; width: 75px; height: 75px; 
    background: rgba(255, 255, 255, 0.4); border-radius: 50%; 
    border: 3px solid rgba(255, 255, 255, 0.6); display: flex; 
    align-items: center; justify-content: center; font-size: 30px; 
    user-select: none; -webkit-user-select: none; z-index: 40; 
    -webkit-tap-highlight-color: transparent; 
}
#btn-left { left: 20px; }
#btn-right { left: 110px; }
#btn-jump { right: 25px; width: 95px; height: 95px; bottom: 35px; font-size: 20px; }