@media (max-width: 900px) {
    .upload-card { padding: 40px 30px; }
    .upload-features { grid-template-columns: 1fr; }
    .features-grid { grid-template-columns: repeat(2, 1fr); }
    .palette-showcase { grid-template-columns: 1fr; }
    .steps-wrap { flex-direction: column; gap: 30px; }
    .step-line { display: none; }
    .blob-1, .blob-2, .blob-3 { display: none; }
}
@media (max-width: 1024px) and (min-width: 768px) {
    .panel-left { width: 240px; }
    .panel-right { width: 280px; }
    
    .palette-grid {
        grid-template-columns: repeat(10, 1fr);
    }
    
    .btn {
        padding: 10px 8px;
        font-size: 12px;
    }
    
    .bottom-area {
        max-height: 180px;
    }

    body.hand-draw-mode .panel-left { width: 220px; }
    body.hand-draw-mode .canvas-area {
        width: calc(100vw - 220px - 280px);
    }

    /* ===== 平板端布局模式支持 ===== */
    /* 布局模式按钮在平板端显示 */
    .mobile-only#btn-layout-mode {
        display: flex !important;
    }

    /* 平板横屏：专业全屏模式优化 */
    body.pro-fullscreen-mode .editor-page {
        padding: 0 !important;
    }
    body.pro-fullscreen-mode .canvas-area {
        padding: 56px 0 0 !important;
    }
    body.pro-fullscreen-mode .pro-bottom-toolbar {
        bottom: 20px !important;
    }
    body.pro-fullscreen-mode .pro-bottom-toolbar button {
        width: 52px !important;
        height: 52px !important;
        font-size: 24px !important;
    }
    body.pro-fullscreen-mode .pro-side-panel {
        width: 320px !important;
    }

    /* 平板横屏：极简模式优化 */
    body.minimal-mode .minimal-toolbar {
        bottom: 40px !important;
    }
    body.minimal-mode .minimal-toolbar button {
        width: 68px !important;
        height: 68px !important;
        font-size: 32px !important;
    }
    body.minimal-mode .minimal-color-btn {
        width: 68px !important;
        height: 68px !important;
    }

    /* 平板端：隐藏移动端tab栏（使用桌面端面板） */
    .mobile-tab-bar {
        display: none !important;
    }
}

/* ===== 平板横屏专项优化 (landscape) ===== */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    /* 横屏时面板稍窄，给画布更多空间 */
    .panel-left { width: 220px; }
    .panel-right { width: 260px; }
    
    .palette-grid {
        grid-template-columns: repeat(12, 1fr);
    }

    /* 横屏专业模式：侧滑面板更宽 */
    body.pro-fullscreen-mode .pro-side-panel {
        width: 340px !important;
        max-width: 40vw !important;
    }

    /* 横屏极简模式：工具栏横向排列更紧凑 */
    body.minimal-mode .minimal-toolbar {
        gap: 14px !important;
    }
}

/* ===== 平板竖屏专项优化 (portrait) ===== */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    /* 竖屏时可以考虑类似手机的长页面布局 */
    .editor-page {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto auto !important;
    }
    .panel-left, .panel-right {
        width: 100% !important;
        position: relative !important;
    }
    .canvas-area {
        min-height: 50vh !important;
    }
    .mobile-tab-bar {
        display: flex !important;
    }
}