.wpaidx-tool {
	--wpaidx-primary: #4f46e5;
	--wpaidx-primary-dark: #3730a3;
	--wpaidx-bg: #ffffff;
	--wpaidx-bg-alt: #f8f9fc;
	--wpaidx-border: #e2e4ec;
	--wpaidx-text: #1c1e26;
	--wpaidx-text-muted: #6b7280;
	--wpaidx-radius: 12px;
	--wpaidx-critical: #dc2626;
	--wpaidx-high: #ea580c;
	--wpaidx-medium: #d97706;
	--wpaidx-low: #2563eb;
	--wpaidx-info: #6b7280;
	--wpaidx-success: #16a34a;

	all: unset;
	display: block;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--wpaidx-text);
	max-width: 900px;
	margin: 0 auto;
}
.wpaidx-tool *, .wpaidx-tool *::before, .wpaidx-tool *::after { box-sizing: border-box; }
.wpaidx-tool-inner { display: flex; flex-direction: column; gap: 16px; }

.wpaidx-card {
	background: var(--wpaidx-bg);
	border: 1px solid var(--wpaidx-border);
	border-radius: var(--wpaidx-radius);
	padding: 20px;
}

/* Tabs for input method */
.wpaidx-input-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.wpaidx-tab-btn {
	padding: 8px 16px; border-radius: 999px; border: 1px solid var(--wpaidx-border);
	background: var(--wpaidx-bg-alt); font-size: 13px; font-weight: 600; cursor: pointer; color: var(--wpaidx-text-muted);
}
.wpaidx-tab-btn.is-active { background: var(--wpaidx-primary); border-color: var(--wpaidx-primary); color: #fff; }

.wpaidx-panel { display: none; }
.wpaidx-panel.is-active { display: block; }

.wpaidx-textarea-wrap { position: relative; }
.wpaidx-textarea {
	width: 100%; min-height: 220px; resize: vertical; border: 1px solid var(--wpaidx-border);
	border-radius: 10px; padding: 14px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px; line-height: 1.5; background: var(--wpaidx-bg-alt); color: var(--wpaidx-text);
}
.wpaidx-textarea:focus { outline: 2px solid var(--wpaidx-primary); outline-offset: 1px; }
.wpaidx-char-counter { position: absolute; bottom: 8px; right: 12px; font-size: 11px; color: var(--wpaidx-text-muted); background: rgba(255,255,255,.85); padding: 1px 6px; border-radius: 6px; }

.wpaidx-dropzone {
	border: 2px dashed var(--wpaidx-border); border-radius: 10px; padding: 28px 16px; text-align: center;
	background: var(--wpaidx-bg-alt); cursor: pointer; transition: border-color .15s ease, background .15s ease;
}
.wpaidx-dropzone.is-dragover { border-color: var(--wpaidx-primary); background: #eef0ff; }
.wpaidx-dropzone strong { display: block; margin-bottom: 4px; }
.wpaidx-dropzone small { color: var(--wpaidx-text-muted); }
.wpaidx-file-list { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.wpaidx-file-chip {
	display: flex; align-items: center; justify-content: space-between; background: var(--wpaidx-bg);
	border: 1px solid var(--wpaidx-border); border-radius: 8px; padding: 6px 10px; font-size: 13px;
}
.wpaidx-file-chip button { all: unset; cursor: pointer; color: var(--wpaidx-critical); font-weight: 700; padding: 0 4px; }

.wpaidx-url-input {
	width: 100%; padding: 10px 12px; border: 1px solid var(--wpaidx-border); border-radius: 8px; font-size: 14px;
}

.wpaidx-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.wpaidx-btn {
	all: unset; cursor: pointer; padding: 10px 20px; border-radius: 8px; font-weight: 600; font-size: 14px;
	display: inline-flex; align-items: center; gap: 6px; text-align: center;
}
.wpaidx-btn-primary { background: var(--wpaidx-primary); color: #fff; }
.wpaidx-btn-primary:hover { background: var(--wpaidx-primary-dark); }
.wpaidx-btn-primary[disabled] { opacity: .6; cursor: not-allowed; }
.wpaidx-btn-secondary { background: var(--wpaidx-bg-alt); border: 1px solid var(--wpaidx-border); color: var(--wpaidx-text); }
.wpaidx-btn-secondary:hover { background: #eef0f4; }
.wpaidx-btn-ghost { background: transparent; color: var(--wpaidx-text-muted); text-decoration: underline; padding: 10px 4px; }

.wpaidx-error-banner {
	background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; border-radius: 8px; padding: 12px 14px; font-size: 14px;
}

/* Loading state */
.wpaidx-loading { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 40px 20px; }
.wpaidx-spinner {
	width: 40px; height: 40px; border-radius: 50%; border: 3px solid var(--wpaidx-border);
	border-top-color: var(--wpaidx-primary); animation: wpaidx-spin 0.8s linear infinite;
}
@keyframes wpaidx-spin { to { transform: rotate(360deg); } }
.wpaidx-loading-text { color: var(--wpaidx-text-muted); font-size: 14px; }
.wpaidx-skeleton { display: flex; flex-direction: column; gap: 10px; width: 100%; }
.wpaidx-skeleton-line { height: 14px; border-radius: 6px; background: linear-gradient(90deg, var(--wpaidx-bg-alt) 25%, #eef0f4 37%, var(--wpaidx-bg-alt) 63%); background-size: 400% 100%; animation: wpaidx-shimmer 1.4s ease infinite; }
@keyframes wpaidx-shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

/* Report */
.wpaidx-report-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; }
.wpaidx-search-input { padding: 8px 12px; border: 1px solid var(--wpaidx-border); border-radius: 8px; font-size: 13px; min-width: 200px; }
.wpaidx-report-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.wpaidx-icon-btn {
	all: unset; cursor: pointer; font-size: 12px; font-weight: 600; padding: 7px 12px; border-radius: 7px;
	background: var(--wpaidx-bg-alt); border: 1px solid var(--wpaidx-border); color: var(--wpaidx-text);
}
.wpaidx-icon-btn:hover { background: #eef0f4; }

.wpaidx-scores { display: flex; gap: 12px; flex-wrap: wrap; }
.wpaidx-score-box { flex: 1; min-width: 140px; background: var(--wpaidx-bg-alt); border-radius: 10px; padding: 14px; text-align: center; }
.wpaidx-score-value { font-size: 28px; font-weight: 800; }
.wpaidx-score-label { font-size: 12px; color: var(--wpaidx-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.wpaidx-score-good { color: var(--wpaidx-success); }
.wpaidx-score-mid { color: var(--wpaidx-medium); }
.wpaidx-score-bad { color: var(--wpaidx-critical); }

.wpaidx-insufficient { background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 16px; }
.wpaidx-insufficient h4 { margin: 0 0 6px; }

.wpaidx-exec-summary { line-height: 1.6; }

.wpaidx-issue { border: 1px solid var(--wpaidx-border); border-radius: 10px; overflow: hidden; }
.wpaidx-issue-header {
	display: flex; align-items: center; gap: 10px; padding: 14px 16px; cursor: pointer; background: var(--wpaidx-bg);
}
.wpaidx-issue-header:hover { background: var(--wpaidx-bg-alt); }
.wpaidx-severity-badge { font-size: 11px; font-weight: 700; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; color: #fff; white-space: nowrap; }
.wpaidx-severity-critical { background: var(--wpaidx-critical); }
.wpaidx-severity-high { background: var(--wpaidx-high); }
.wpaidx-severity-medium { background: var(--wpaidx-medium); }
.wpaidx-severity-low { background: var(--wpaidx-low); }
.wpaidx-severity-info { background: var(--wpaidx-info); }
.wpaidx-issue-title { font-weight: 700; flex: 1; }
.wpaidx-issue-meta { font-size: 12px; color: var(--wpaidx-text-muted); }
.wpaidx-issue-chevron { transition: transform .15s ease; color: var(--wpaidx-text-muted); }
.wpaidx-issue.is-open .wpaidx-issue-chevron { transform: rotate(180deg); }
.wpaidx-issue-body { display: none; padding: 4px 16px 18px; }
.wpaidx-issue.is-open .wpaidx-issue-body { display: block; }
.wpaidx-issue-section { margin-top: 12px; }
.wpaidx-issue-section h5 { margin: 0 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--wpaidx-text-muted); }
.wpaidx-issue-section p, .wpaidx-issue-section ul { margin: 0; line-height: 1.55; }
.wpaidx-evidence { background: var(--wpaidx-bg-alt); border-radius: 8px; padding: 10px 12px; font-family: ui-monospace, monospace; font-size: 12.5px; white-space: pre-wrap; word-break: break-word; }
.wpaidx-pill-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.wpaidx-pill { font-size: 11px; background: var(--wpaidx-bg-alt); border: 1px solid var(--wpaidx-border); border-radius: 999px; padding: 3px 10px; }

.wpaidx-section-title { font-size: 15px; font-weight: 700; margin: 4px 0 2px; }
.wpaidx-list { margin: 0; padding-left: 18px; line-height: 1.6; }

.wpaidx-confidence-note { font-size: 12.5px; color: var(--wpaidx-text-muted); border-top: 1px dashed var(--wpaidx-border); padding-top: 10px; margin-top: 4px; }

.wpaidx-hidden { display: none !important; }

@media (max-width: 640px) {
	.wpaidx-scores { flex-direction: column; }
	.wpaidx-report-toolbar { flex-direction: column; align-items: stretch; }
}

@media print {
	.wpaidx-input-card, .wpaidx-report-toolbar, .wpaidx-toolbar { display: none !important; }
	.wpaidx-issue-body { display: block !important; }
}
