/* style.css */
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; background: #f4f6f8; padding: 10px; color: #333; }
.container { max-width: 900px; margin: 0 auto; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
h2 { margin-top: 0; border-bottom: 2px solid #eee; padding-bottom: 10px; margin-bottom: 20px; }
.form-group { margin-bottom: 15px; }
label { display: block; margin-bottom: 5px; font-weight: bold; }
input[type="text"], select, textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; }
.row { display: flex; gap: 10px; align-items: center; margin-bottom: 5px; }
.row input { flex: 1; }
.btn-remove { background: #ff4d4f; color: white; border: none; padding: 5px 10px; cursor: pointer; border-radius: 4px; }
.btn-remove-disabled { background: #dfdfdf; color: #fffcfc; cursor: not-allowed; }
.btn-add { background: #e6f7ff; color: #1890ff; border: 1px solid #1890ff; padding: 5px 10px; cursor: pointer; border-radius: 4px; margin-top: 5px; }
.btn-send { background: #1890ff; color: white; border: none; padding: 12px 20px; font-size: 16px; cursor: pointer; border-radius: 4px; width: 100%; margin-top: 20px; }
.btn-send:hover { background: #40a9ff; }
#response-area { margin-top: 20px; background: #2d2d2d; color: #f8f8f2; padding: 15px; border-radius: 4px; min-height: 100px; overflow-x: auto; white-space: pre-wrap; font-family: monospace; }
.hidden { display: none; }
.tab-buttons { display: flex; border-bottom: 1px solid #ddd; margin-bottom: 15px; }
.tab-btn { padding: 10px 20px; cursor: pointer; border: 1px solid transparent; border-bottom: none; background: #f9f9f9; }
.tab-btn.active { background: #fff; border-color: #ddd; border-top: 2px solid #1890ff; font-weight: bold; }
.index-container{ width: 200px; margin: 0 auto; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.request-container{width: 100%}