.yaml-tool-main { width: 100%; max-width: 1000px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

.yaml-container {
    background: #0a0a0a; border: 1px solid #222; border-radius: 16px;
    overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}

.editor-header {
    background: #111; padding: 15px 20px; border-bottom: 1px solid #333;
    display: flex; justify-content: space-between; align-items: center;
    font-weight: 600; color: #ccc;
}

.code-area {
    width: 100%; height: 400px; background: #050505; color: #f8f8f2;
    border: none; padding: 20px; font-family: 'Consolas', monospace; font-size: 1rem;
    resize: vertical; outline: none; line-height: 1.6; box-sizing: border-box;
}

/* Badges de Estado */
.status-waiting { color: #888; font-size: 0.9rem; }
.status-valid { color: #28a745; background: rgba(40, 167, 69, 0.1); padding: 4px 10px; border-radius: 6px; }
.status-invalid { color: #ff4d4d; background: rgba(255, 77, 77, 0.1); padding: 4px 10px; border-radius: 6px; }

/* Caja de Error */
.error-box {
    background: rgba(220, 53, 69, 0.1); border-top: 1px solid #ff4d4d;
    padding: 20px; color: #ff8080;
}
.error-box pre { margin: 10px 0 0 0; white-space: pre-wrap; font-family: monospace; }