/* Self-contained, theme-proof styles — explicit palette + appearance:none
   reset on form controls, matching the other three EducationalEngine
   plugins' visual conventions (see claude/lesson-planner-plugin.md,
   Incidents & fixes, v1.1.1/v1.2.0). */

.ee-rg-app {
	--ee-rg-ink: #1a1f2b;
	--ee-rg-muted: #5a6472;
	--ee-rg-border: #d7dbe2;
	--ee-rg-bg: #ffffff;
	--ee-rg-accent: #2557a7;
	--ee-rg-accent-ink: #ffffff;
	--ee-rg-panel: #f6f8fb;
	--ee-rg-success: #1c7c3f;
	--ee-rg-danger: #b3261e;

	max-width: 1000px;
	margin: 24px 0 48px;
	color: var( --ee-rg-ink );
	background: var( --ee-rg-bg );
	border: 1px solid var( --ee-rg-border );
	border-radius: 10px;
	padding: 24px;
	font-size: 15px;
	line-height: 1.5;
}

.ee-rg-app * {
	box-sizing: border-box;
}

.ee-rg-quota-bar {
	display: flex;
	gap: 16px;
	align-items: center;
	margin-bottom: 16px;
	color: var( --ee-rg-muted );
	font-size: 13px;
}

.ee-rg-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 1px solid var( --ee-rg-border );
	margin-bottom: 20px;
}

.ee-rg-tab-btn {
	appearance: none;
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	padding: 10px 16px;
	font-size: 14px;
	font-weight: 600;
	color: var( --ee-rg-muted );
	cursor: pointer;
}

.ee-rg-tab-btn.is-active {
	color: var( --ee-rg-accent );
	border-bottom-color: var( --ee-rg-accent );
}

.ee-rg-form {
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-width: 640px;
}

.ee-rg-form label {
	font-weight: 600;
	margin-top: 10px;
	color: var( --ee-rg-ink );
}

.ee-rg-form input[type="text"],
.ee-rg-form input[type="url"],
.ee-rg-form select,
.ee-rg-form textarea {
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid var( --ee-rg-border );
	border-radius: 6px;
	padding: 8px 10px;
	font-size: 14px;
	color: var( --ee-rg-ink );
	background: #fff;
	width: 100%;
}

.ee-rg-btn {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	border: 1px solid var( --ee-rg-accent );
	background: var( --ee-rg-accent );
	color: var( --ee-rg-accent-ink );
	border-radius: 6px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	margin-top: 16px;
	width: fit-content;
}

.ee-rg-btn:disabled {
	opacity: 0.6;
	cursor: default;
}

.ee-rg-btn-small {
	padding: 6px 12px;
	font-size: 13px;
	margin-top: 0;
}

.ee-rg-cost-badge {
	opacity: 0.85;
	font-weight: 500;
}

.ee-rg-table {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0;
	font-size: 13px;
}

.ee-rg-table th,
.ee-rg-table td {
	border: 1px solid var( --ee-rg-border );
	padding: 10px;
	vertical-align: top;
	text-align: left;
}

.ee-rg-table thead th {
	background: var( --ee-rg-panel );
	font-weight: 700;
}

.ee-rg-criterion-name {
	font-weight: 700;
	white-space: nowrap;
}

.ee-rg-criterion-weight {
	white-space: nowrap;
	color: var( --ee-rg-muted );
}

.ee-rg-actions-col {
	white-space: nowrap;
}

.ee-rg-weight-total {
	font-weight: 600;
	color: var( --ee-rg-muted );
}

.ee-rg-export-actions {
	display: flex;
	gap: 10px;
	margin: 16px 0;
}

.ee-rg-item-list {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.ee-rg-item-list li {
	display: flex;
	justify-content: space-between;
	padding: 8px 0;
	border-bottom: 1px solid var( --ee-rg-border );
}

.ee-rg-item-link {
	appearance: none;
	background: none;
	border: none;
	color: var( --ee-rg-accent );
	font-weight: 600;
	cursor: pointer;
	padding: 0;
	text-align: left;
}

.ee-rg-item-date {
	color: var( --ee-rg-muted );
	font-size: 13px;
}

.ee-rg-permalink {
	font-size: 13px;
}

@media print {
	.ee-rg-quota-bar,
	.ee-rg-tabs,
	.ee-rg-form,
	.ee-rg-export-actions,
	.ee-rg-actions-col {
		display: none !important;
	}

	.ee-rg-app {
		border: none;
		box-shadow: none;
		max-width: none;
	}
}