/* === OPTIMIZED SPACING & LAYOUT === */
/* Figma-precision spatial optimization */

/* Header - Ultra Compact */
.studio-header {
    padding: 12px 32px !important;
    min-height: auto !important;
}

.logo {
    font-size: 1.3rem !important;
}

/* Main Container - Tight Spacing */
.translator-container {
    padding: 20px 32px !important;
}

.glass-card {
    padding: 24px !important;
}

/* Selector Bar - Perfect Alignment */
.selector-bar {
    margin-bottom: 24px !important;
    padding: 16px 20px !important;
    gap: 16px !important;
}

.lang-selector {
    gap: 8px !important;
}

.lang-selector label {
    margin-bottom: 0 !important;
    line-height: 1 !important;
}

.lang-selector select {
    padding: 12px 16px !important;
}

/* Swap Button Container */
.swap-btn-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.swap-btn {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Translation Grid - Compact */
.translate-grid {
    gap: 20px !important;
    margin-bottom: 20px !important;
}

.input-pane,
.output-pane {
    min-height: 280px !important;
}

.pane-header {
    padding: 12px 16px !important;
    margin-bottom: 12px !important;
}

textarea {
    min-height: 200px !important;
}

/* Action Pane - Centered */
.action-pane {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px !important;
}

/* Translate Button */
.btn-translate-main {
    width: 140px !important;
    height: 140px !important;
}

/* Remove Excess Margins */
.studio-features {
    margin-top: 32px !important;
    gap: 16px !important;
}

.feature {
    padding: 20px !important;
}

/* Voice Preview Zone */
.voice-preview-zone {
    margin: 40px 0 !important;
    padding: 32px !important;
}

.voice-preview-zone h2 {
    margin-bottom: 8px !important;
}

.voice-preview-zone>p {
    margin-bottom: 28px !important;
}

/* SEO Content - Compact */
.seo-content-zone {
    margin-top: 40px !important;
    padding: 32px !important;
}

.seo-content-zone h1 {
    margin-bottom: 16px !important;
}

.seo-content-zone h2 {
    margin-top: 24px !important;
    margin-bottom: 12px !important;
}

.seo-content-zone p {
    margin-bottom: 12px !important;
}

/* Footer */
.studio-footer {
    margin-top: 40px !important;
    padding: 20px !important;
}

/* Perfect Grid Alignment */
@media (min-width: 1024px) {
    .translator-container {
        max-width: 1360px !important;
    }

    .glass-card {
        padding: 32px !important;
    }
}

/* Responsive - Maintain Compact on Mobile */
@media (max-width: 768px) {
    .studio-header {
        padding: 12px 20px !important;
    }

    .translator-container {
        padding: 16px 20px !important;
    }

    .glass-card {
        padding: 20px !important;
    }

    .selector-bar {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .swap-btn-container {
        order: 3;
    }
}