/* 浏览器兼容性回退方案 */
@supports not (backdrop-filter: blur(5px)) {
    .info-panel,
    #controlPanel {
        background: rgba(25, 25, 35, 0.95);
    }
}

/* 为不支持平滑滚动的浏览器添加回退方案 */
@supports not (scroll-behavior: smooth) {
    html {
        scroll-behavior: auto;
    }
}

/* 为不支持flex gap的浏览器添加回退方案 */
@supports not (gap: 20px) {
    .control-group > * {
        margin-right: 20px;
        margin-bottom: 20px;
    }
    .control-group > *:last-child {
        margin-right: 0;
    }
}

/* 为不支持 :focus-visible 的浏览器添加回退方案 */
button:focus:not(:focus-visible) {
    outline: none;
}

/* 触摸设备优化 */
@media (hover: none) {
    button:hover {
        transform: none;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    }
}