body, html {
    margin: 0;
    padding: 0;
    overflow: hidden; /* 防止滾動條出現 */
    background-color: #d3e0ea; /* 淡藍色背景，較柔和 */
    font-family: 'Arial', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* 使body填滿整個視窗高度 */
}

#bearCanvas {
    display: block; /* 移除 canvas 預設的底部空間 */
    width: 100%;
    height: 100%;
    cursor: grab; /* 提示使用者可以拖曳 */
}

#bearCanvas:active {
    cursor: grabbing; /* 拖曳時的游標樣式 */
}

#instructions {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%); /* 水平置中 */
    background: rgba(255, 255, 255, 0.85); /* 半透明背景 */
    padding: 12px 18px;
    border-radius: 8px;
    font-size: 14px;
    color: #333;
    z-index: 10; /* 確保在canvas之上 */
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    text-align: center;
    line-height: 1.6;
}
