#screen-admin {
	.page {
		width: min(1200px, calc(100% - 32px));
		margin: 0 auto;
		padding: 32px 0 60px;
	}

	/* ── Login ── */
	.login-wrap {
		max-width: 360px;
		margin: 80px auto 0;
	}

	.login-wrap h1 {
		margin: 0 0 28px;
		font-size: clamp(2rem, 5vw, 3rem);
		letter-spacing: -0.04em;
		text-align: center;
	}

	.login-form {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}

	/* ── Panel header ── */
	.panel-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 28px;
	}

	.header-actions {
		display: flex;
		gap: 8px;
		align-items: center;
	}

	.panel-header h1 {
		margin: 0;
		font-size: clamp(2rem, 4vw, 3rem);
		letter-spacing: -0.04em;
	}

	/* ── Layout ── */
	.layout {
		display: grid;
		grid-template-columns: 420px 1fr;
		gap: 24px;
		align-items: start;
	}

	.layout-left,
	.layout-right {
		display: flex;
		flex-direction: column;
		gap: 24px;
	}

	/* ── Cards ── */
	.card {
		background: #fff;
		border: 1px solid var(--panel-border);
		border-radius: 18px;
		padding: 24px;
	}

	.card h2 {
		margin: 0 0 20px;
		font-size: 1.1rem;
		letter-spacing: -0.02em;
	}

	/* ── Forms ── */
	.create-form {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-bottom: 20px;
	}

	input[type="text"],
	input[type="password"],
	input[type="number"] {
		width: 100%;
		padding: 10px 14px;
		border: 1px solid var(--panel-strong);
		border-radius: 10px;
		background: #fff;
		color: var(--text);
		font-family: inherit;
		font-size: 0.95rem;
		outline: none;
	}

	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="number"]:focus {
		border-color: var(--accent);
		box-shadow: 0 0 0 3px rgba(36, 87, 214, 0.15);
	}

	/* ── Buttons ── */
	.btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 10px 18px;
		border-radius: 999px;
		font-family: inherit;
		font-size: 0.9rem;
		font-weight: 700;
		cursor: pointer;
		border: 1px solid transparent;
		white-space: nowrap;
		text-decoration: none;
	}

	.btn--primary {
		background: var(--accent);
		color: #fff;
		border-color: var(--accent);
	}

	.btn--primary:hover { opacity: 0.88; }

	.btn--ghost {
		background: #fff;
		color: var(--text);
		border-color: var(--panel-strong);
	}

	.btn--ghost:hover { background: #f5f5f5; }

	.btn--danger {
		background: #fdf2f2;
		color: var(--danger);
		border-color: #f5c6c6;
	}

	.btn--danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }

	.btn--success {
		background: #eafaf1;
		color: #1a7a4a;
		border-color: #b7dfca;
	}

	.btn--success:hover { background: #1a7a4a; color: #fff; border-color: #1a7a4a; }

	.btn--sm {
		padding: 6px 12px;
		font-size: 0.8rem;
	}

	.btn--full { width: 100%; }

	/* ── Groups list ── */
	.groups-list {
		display: flex;
		flex-direction: column;
		gap: 8px;
		max-height: 60vh;
		overflow-y: auto;
	}

	.group-item {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 12px 14px;
		border: 1px solid var(--panel-border);
		border-radius: 12px;
		background: #fafafa;
	}

	.group-item--active {
		border-color: var(--accent);
		background: rgba(36, 87, 214, 0.04);
	}

	.group-item-top {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		gap: 8px;
	}

	.group-item-info {
		display: flex;
		flex-direction: column;
		gap: 2px;
		min-width: 0;
	}

	.group-item-badges {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
		flex-shrink: 0;
	}

	.group-badge {
		padding: 2px 8px;
		border-radius: 999px;
		font-size: 0.68rem;
		font-weight: 800;
		font-family: system-ui, sans-serif;
		letter-spacing: 0.04em;
		white-space: nowrap;
	}

	.group-badge--locked {
		background: #fff3cd;
		color: #856404;
	}

	.group-badge--closed {
		background: #fdf2f2;
		color: var(--danger);
	}

	.group-badge--league {
		background: #e8f0fe;
		color: #1a56db;
	}

	.group-badge--table {
		background: #eef0f8;
		color: #2457d6;
	}

	.group-item-actions {
		display: flex;
		gap: 6px;
		flex-wrap: wrap;
	}

	.group-item-name {
		font-weight: 700;
		font-size: 0.95rem;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.group-item-code {
		font-size: 0.72rem;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--muted);
		font-family: system-ui, sans-serif;
		font-weight: 700;
	}

	.group-item-price {
		font-size: 0.72rem;
		color: var(--accent);
		font-family: system-ui, sans-serif;
		font-weight: 700;
	}

	/* ── Fixtures locked banner ── */
	.fixtures-locked-banner {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-bottom: 12px;
		padding: 10px 14px;
		background: #fff3cd;
		border: 1px solid #ffc107;
		border-radius: 10px;
		font-size: 0.85rem;
		font-family: system-ui, sans-serif;
		font-weight: 700;
		color: #856404;
	}

	.fixtures-hint--warn {
		color: #856404;
	}

	/* ── Fixtures section ── */
	.fixtures-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 6px;
	}

	.fixtures-header h2 {
		margin: 0;
		font-size: 1.1rem;
		letter-spacing: -0.02em;
	}

	.fixtures-hint {
		margin: 0 0 16px;
		font-size: 0.82rem;
		color: var(--muted);
		font-style: italic;
	}

	.fixtures-list {
		display: flex;
		flex-direction: column;
		gap: 4px;
		max-height: 600px;
		overflow-y: auto;
	}

	.fixture-item {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 10px 12px;
		border-radius: 10px;
		cursor: pointer;
		user-select: none;
	}

	.fixture-item:hover { background: rgba(36, 87, 214, 0.05); }

	.fixture-item input[type="checkbox"] {
		width: 16px;
		height: 16px;
		flex-shrink: 0;
		accent-color: var(--accent);
		cursor: pointer;
	}

	.fixture-teams {
		flex: 1;
		font-size: 0.9rem;
	}

	.fixture-vs {
		color: var(--muted);
		font-size: 0.8rem;
		margin: 0 4px;
	}

	.fixture-result {
		font-size: 0.85rem;
		font-weight: 700;
		font-variant-numeric: tabular-nums;
		color: var(--muted);
		min-width: 40px;
		text-align: right;
		font-family: system-ui, sans-serif;
	}

	/* ── Entry fee row ── */
	.entry-price-row {
		display: flex;
		align-items: center;
		gap: 6px;
		padding: 6px 0 2px;
		border-top: 1px solid var(--panel-border);
	}

	.entry-price-label {
		font-size: 0.72rem;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		font-family: system-ui, sans-serif;
		font-weight: 800;
		color: var(--muted);
		white-space: nowrap;
		flex-shrink: 0;
	}

	.entry-price-prefix {
		font-family: system-ui, sans-serif;
		font-weight: 700;
		font-size: 0.9rem;
		color: var(--text);
		margin-left: 4px;
	}

	.entry-price-value {
		font-family: system-ui, sans-serif;
		font-weight: 700;
		font-size: 0.9rem;
		color: var(--text);
		margin-left: 4px;
	}

	.entry-price-input {
		width: 70px;
		padding: 5px 8px;
		border: 1px solid var(--panel-strong);
		border-radius: 8px;
		background: #fff;
		color: var(--text);
		font-family: system-ui, sans-serif;
		font-size: 0.88rem;
		font-weight: 700;
		outline: none;
		-moz-appearance: textfield;
	}

	.entry-price-input::-webkit-inner-spin-button,
	.entry-price-input::-webkit-outer-spin-button { -webkit-appearance: none; }

	.entry-price-input:focus {
		border-color: var(--accent);
		box-shadow: 0 0 0 3px rgba(36, 87, 214, 0.15);
	}

	/* ── Users (Players) panel ── */
	.users-list {
		display: flex;
		flex-direction: column;
		max-height: 600px;
		overflow-y: auto;
	}

	.users-paid-summary {
		font-size: 0.78rem;
		font-family: system-ui, sans-serif;
		font-weight: 700;
		color: var(--muted);
		white-space: nowrap;
	}

	.user-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 10px 12px;
		border-bottom: 1px solid var(--panel-border);
	}

	.user-item:last-child { border-bottom: none; }

	.user-item-name {
		font-size: 0.9rem;
		font-weight: 600;
		flex: 1;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.user-item-username {
		font-size: 0.78rem;
		color: var(--muted);
		font-family: system-ui, sans-serif;
		margin-right: 8px;
		white-space: nowrap;
	}

	.user-paid-label {
		display: flex;
		align-items: center;
		gap: 7px;
		font-size: 0.78rem;
		font-family: system-ui, sans-serif;
		font-weight: 700;
		color: var(--muted);
		cursor: pointer;
		white-space: nowrap;
		user-select: none;
	}

	.user-paid-label input[type="checkbox"] {
		width: 16px;
		height: 16px;
		accent-color: var(--accent);
		cursor: pointer;
		flex-shrink: 0;
	}

	/* ── Shared ── */
	.error {
		margin-bottom: 16px;
		padding: 12px 16px;
		border-radius: 10px;
		background: #fdf2f2;
		border: 1px solid #f5c6c6;
		color: var(--danger);
		font-size: 0.9rem;
	}

	.error[hidden] { display: none; }

	.empty {
		color: var(--muted);
		font-style: italic;
		font-size: 0.9rem;
		margin: 0;
	}

	.success-toast {
		position: fixed;
		bottom: 24px;
		right: 24px;
		background: #1a7a4a;
		color: #fff;
		padding: 12px 20px;
		border-radius: 12px;
		font-size: 0.9rem;
		font-weight: 700;
		font-family: system-ui, sans-serif;
		box-shadow: 0 4px 16px rgba(0,0,0,0.15);
		animation: fadeInUp 0.2s ease;
	}

	/* ── Fixture filters ── */
	.fixture-filters {
		display: flex;
		flex-direction: column;
		gap: 6px;
		margin-bottom: 12px;
	}

	.fixture-filters[hidden] { display: none; }

	.filter-pills {
		display: flex;
		flex-wrap: wrap;
		gap: 5px;
	}

	.filter-pills[hidden] { display: none; }

	.filter-pill {
		padding: 5px 12px;
		border: 1px solid var(--panel-strong);
		border-radius: 999px;
		background: #fff;
		color: var(--muted);
		font-family: system-ui, sans-serif;
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		cursor: pointer;
		white-space: nowrap;
	}

	.filter-pill--active {
		background: var(--accent);
		border-color: var(--accent);
		color: #fff;
	}

	.filter-pill:hover:not(.filter-pill--active) { background: #f0f0f0; color: var(--text); }

	/* ── Import row ── */
	.import-row {
		display: flex;
		gap: 10px;
		align-items: center;
		flex-wrap: wrap;
	}

	.select {
		padding: 9px 14px;
		border: 1px solid var(--panel-strong);
		border-radius: 10px;
		background: #fff;
		color: var(--text);
		font-family: inherit;
		font-size: 0.95rem;
		outline: none;
		cursor: pointer;
	}

	.select--sm {
		padding: 6px 10px;
		font-size: 0.85rem;
	}

	.select:focus { border-color: var(--accent); }

	.league-comp-row {
		display: flex;
		gap: 8px;
		align-items: center;
	}

	.create-label {
		font-family: system-ui, sans-serif;
		font-size: 0.72rem;
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--muted);
		margin-bottom: 4px;
		display: block;
	}

	.filter-row {
		display: flex;
		gap: 8px;
		align-items: center;
	}

	.import-inline {
		font-size: 0.82rem;
		font-family: system-ui, sans-serif;
		font-weight: 700;
	}

	.import-inline--info { color: var(--muted); }
	.import-inline--ok   { color: #1a7a4a; }
	.import-inline--err  { color: var(--danger); }

	/* ── Fixture sections ── */
	.fixture-section { margin-bottom: 8px; }

	.fixture-section-header {
		font-size: 0.72rem;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--muted);
		font-weight: 800;
		font-family: system-ui, sans-serif;
		padding: 8px 12px 4px;
	}

	.fixture-item--readonly {
		cursor: default;
	}

	.fixture-item--readonly:hover { background: none; }

	.fixture-item--toggle {
		cursor: default;
		justify-content: space-between;
	}

	.fixture-item--toggle:hover { background: none; }

	@media (max-width: 800px) {
		.layout {
			grid-template-columns: 1fr;
		}

		.layout-right { display: contents; }
	}
}

@keyframes fadeInUp {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: translateY(0); }
}