.dimension-container { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 25px; display: flex; flex-direction: column; gap: 20px; }
            
            .config-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px; display: flex; flex-direction: column; gap: 15px; }
            .section-title { font-size: 1.05rem; font-weight: 600; color: #1e293b; border-bottom: 2px solid #f1f5f9; padding-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }

            .presets-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
            .preset-btn { background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 6px; padding: 10px; font-size: 0.85rem; font-weight: 600; color: #334155; cursor: pointer; text-align: center; transition: all 0.2s; }
            .preset-btn:hover { background: #e2e8f0; border-color: #94a3b8; }
            .preset-btn.active { background: #2563eb; color: #fff; border-color: #2563eb; }

            .form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; }
            .form-group { display: flex; flex-direction: column; gap: 6px; font-size: 0.9rem; font-weight: 600; color: #475569; }
            .form-group input, .form-group select { padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 1rem; background: #f8fafc; color: #1e293b; outline: none; font-weight: 600; }
            .form-group input:focus, .form-group select:focus { border-color: #2563eb; background: #fff; }

            /* Resultados / Painel de Conversão */
            .results-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 15px; margin-top: 5px; }
            .result-card { background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 8px; padding: 15px; display: flex; flex-direction: column; gap: 8px; position: relative; }
            .result-label { font-size: 0.8rem; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; }
            .result-value { font-size: 1.3rem; font-weight: 700; color: #1e293b; word-break: break-all; }
            .result-sub { font-size: 0.8rem; color: #475569; font-weight: 500; }
            
            .btn-copy { background: #2563eb; color: white; border: none; border-radius: 4px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; cursor: pointer; align-self: flex-start; margin-top: 5px; transition: background 0.2s; }
            .btn-copy:hover { background: #1d4ed8; }

            /* Pré-visualização Proporcional */
            .preview-box-container { display: flex; flex-direction: column; align-items: center; justify-content: center; background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 8px; padding: 20px; min-height: 220px; }
            .preview-visual { background: #ffffff; border: 2px solid #2563eb; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); display: flex; align-items: center; justify-content: center; font-size: 0.85rem; font-weight: 600; color: #1e293b; transition: all 0.3s ease; max-width: 100%; max-height: 180px; text-align: center; padding: 10px; overflow: hidden; }