:root {
    --primary: #206BC4;
    --primary-hover: #1a56a0;
    --bg: #f8f9fa;
    --text: #333;
    --border: #e2e8f0;
}

* { box-sizing: border-box; }

.tool-header { text-align: center; margin-bottom: 30px; }
.tool-header h1 { font-size: 2.5rem; margin-bottom: 10px; }

.upload-area { background: #fff; border: 2px dashed var(--primary); border-radius: 12px; padding: 50px; text-align: center; margin:2rem; cursor: pointer; transition: 0.3s; }
.upload-area:hover { background: #f0f7ff; }
.upload-area .icon { font-size: 48px; color: var(--primary); margin-bottom: 15px; }
.upload-area p span { color: var(--primary); font-weight: bold; }

.file-list-container { background: #fff; margin-top: 20px; padding: 20px; border-radius: 8px; border: 1px solid var(--border); }
.file-item { display: flex; justify-content: space-between; align-items: center; padding: 10px; border-bottom: 1px solid #eee; }
.file-item:last-child { border: 0; }
.remove-file { color: #dc3545; cursor: pointer; }

.settings-card { background: #fff; margin-top: 20px; padding: 25px; border-radius: 8px; border: 1px solid var(--border); }
.setting-group { margin-bottom: 20px; }
.setting-group label { display: block; font-weight: 600; margin-bottom: 10px; }

.radio-group { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.radio-item { border: 1px solid var(--border); padding: 15px; border-radius: 8px; cursor: pointer; display: flex; align-items: flex-start; gap: 10px; }
.radio-item input { margin-top: 5px; }
.radio-content strong { display: block; font-size: 14px; }
.radio-content span { font-size: 12px; color: #666; }

select { width: 100%; padding: 10px; border-radius: 6px; border: 1px solid var(--border); }

.btn-primary { background: var(--primary); color: #fff; border: 0; padding: 15px 30px; border-radius: 6px; font-size: 16px; font-weight: 600; cursor: pointer; width: 100%; margin-top: 10px; }
.btn-primary:hover { background: var(--primary-hover); }
.btn-secondary { background: #28a745; color: #fff; text-decoration: none; padding: 10px 20px; border-radius: 4px; display: inline-block; }

.progress-bar { height: 10px; background: #eee; border-radius: 10px; overflow: hidden; margin: 20px 0; }
#progress-fill { height: 100%; background: var(--primary); width: 0%; transition: 0.3s; }

.results-table-wrapper { overflow-x: auto; margin: 20px 0; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { padding: 12px; text-align: left; border-bottom: 1px solid #eee; }
th { background: #f4f4f4; }

.seo-section { margin-top: 60px; border-top: 1px solid var(--border); padding-top: 40px; }
.seo-section h2 { margin-bottom: 15px; }
.faq { margin-top: 30px; }
.faq-item { margin-bottom: 20px; }

@media (max-width: 600px) {
    .radio-group { grid-template-columns: 1fr; }
    .upload-area { padding: 30px; }
}