/* ================================================================
   style-pan.css — 大屏布局细节 + 云台/速度扩展样式
   与 style.css 暗色系主题一致
   ================================================================ */

/* ---- 大屏双列布局补充 ---- */
@media (min-width: 980px) {
    .controls-card {
        grid-column: 2;
    }

    .joystick-row {
        gap: 24px;
    }
}

/* ---- 响应式：中等屏摇杆缩放 ---- */
@media (max-width: 860px) {
    .joystick-row {
        gap: 16px;
    }
}

/* ---- 响应式：极小屏摇杆 ---- */
@media (max-width: 400px) {
    :root {
        --joy-size: 88px;
        --joy-thumb: 38px;
    }

    .joystick-row {
        gap: 10px;
    }
}