:root{
	--bg:#f4f7fb;
	--card:#fff;
	--text:#0f172a;
	--muted:#64748b;
	--border:#dbe4ef;
	--primary:#0f766e;
	--danger:#b91c1c;
	--soft:#eef5f9
}
*{
	box-sizing:border-box
}
body{
	margin:0;
	background:var(--bg);
	color:var(--text);
	font-family:Arial,Helvetica,sans-serif
}
header,main{
	max-width:1200px;
	margin:24px auto;
	padding:0 16px
}
.hero,.card{
	background:var(--card);
	border-radius:22px;
	padding:24px;
	box-shadow:0 10px 28px rgba(15,23,42,.08)
}
.hero{
	display:flex;
	justify-content:space-between;
	gap:20px;
	align-items:flex-start
}
h1,h2{
	margin:0 0 10px
}
p{
	color:var(--muted);
	line-height:1.5
}
.grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:22px
}
.wide{
	grid-column:1/-1
}
table{
	width:100%;
	border-collapse:collapse;
	font-size:14px
}
th{
	background:var(--soft);
	text-align:left
}
th,td{
	padding:11px;
	border-bottom:1px solid var(--border)
}
.right{
	text-align:right
}
.center{
	text-align:center
}
input,select{
	width:100%;
	padding:10px 12px;
	border:1px solid var(--border);
	border-radius:10px;
	font-size:14px
}
button,.button{
	display:inline-block;
	border:0;
	border-radius:10px;
	background:var(--primary);
	color:#fff;
	padding:10px 13px;
	font-weight:700;
	text-decoration:none;
	cursor:pointer
}
button.danger{
	background:var(--danger)
}
li {
  color: var(--text-color);
  color:#64748b;
  line-height: 1.6;
}
form.inline{
	display:inline
}
.form-grid{
	display:grid;
	grid-template-columns:1fr 140px auto;
	gap:10px;
	align-items:end
}
.event-grid{
	display:grid;
	grid-template-columns:1fr 190px 100px;
	gap:10px
}
.race-columns{
	overflow-x:auto;
	border:1px solid var(--border);
	border-radius:14px;
	margin-top:14px
}
.small{
	font-size:13px;
	color:var(--muted)
}
.error{
	color:var(--danger);
	font-weight:700
}
.nav{
	display:flex;
	gap:10px;
	align-items:center;
	flex-wrap:wrap
}
.tabs{
	display:flex;
	gap:8px;
	flex-wrap:wrap;
	margin-top:14px
}
.tab{
	padding:9px 12px;
	border-radius:999px;
	background:var(--soft);
	color:var(--text);
	text-decoration:none;
	font-weight:700
}
.tab.active{
	background:var(--primary);
	color:#fff
}
canvas{
	max-height:460px
}
@media(max-width:850px){
	.hero,.grid,.form-grid,.event-grid{
		grid-template-columns:1fr;
		flex-direction:column
}
}
.positive{
	color:#15803d;
	font-weight:700
}
.negative{
	color:#b91c1c;
	font-weight:700
}
.notice{
	background:#ecfdf5;
	border:1px solid #99f6e4;
	color:#115e59;
	padding:10px 12px;
	border-radius:12px
}
textarea{
	width:100%;
	padding:10px 12px;
	border:1px solid var(--border);
	border-radius:10px;
	font-size:14px;
	font-family:Arial,Helvetica,sans-serif
}
.site-logo{
	width:72px;
	height:72px;
	object-fit:contain;
	border-radius:18px;
	background:#fff;
	flex:0 0 auto
}
.site-logo.large{
	width:216px;
	height:216px
}
.landing-hero{
	align-items:center
}
.league-card .nav{
	margin-top:14px
}
.button.secondary{
	background:#e2e8f0;
	color:#0f172a
}
.button.secondary:hover{
	background:#cbd5e1
}
@media(max-width:850px){
	.site-logo,.site-logo.large{
		width:84px;
		height:84px
}
}
/* Header cleanup */
.page-hero {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr) 180px;
	align-items: start;
	gap: 24px;
}
.brand-block {
	display: block;
	text-decoration: none;
}
.compact-logo {
	width: 160px;
	height: 160px;
	border-radius: 20px;
}
.hero-main h1 {
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.05;
	margin-bottom: 12px;
}
.eyebrow {
	margin: 0 0 4px;
	color: var(--primary);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.grouped-tabs {
	margin-top: 14px;
}
.season-tabs {
	margin-top: 10px;
}
.viewing-note {
	margin-top: 12px;
}
.hero-actions {
	align-items: stretch;
	justify-content: flex-start;
	flex-direction: column;
}
.hero-actions .button {
	width: 100%;
	text-align: center;
	white-space: nowrap;
}
@media (max-width: 950px) {
	.page-hero {
		grid-template-columns: 110px minmax(0, 1fr);
	}
	.compact-logo {
		width: 104px;
		height: 104px;
	}
	.hero-actions {
		grid-column: 1 / -1;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.hero-actions .button {
		width: auto;
	}
}
@media (max-width: 650px) {
	.page-hero {
		grid-template-columns: 1fr;
	}
	.brand-block {
		display: none;
	}
	.hero-actions {
		flex-direction: column;
	}
	.hero-actions .button {
		width: 100%;
	}
}
.composite-panel{
	margin-top:18px;
	padding:14px;
	border:1px solid var(--border);
	border-radius:14px;
	background:#f8fafc;
}
.composite-row{
	display:grid;
	grid-template-columns:1.4fr 1fr 85px 1fr 85px auto;
	gap:8px;
	align-items:center;
	margin-bottom:8px;
}
@media(max-width:850px){
	.composite-row{
		grid-template-columns:1fr;
	}
}
.footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.admin-link {
	font-size: 0.8rem;
	color: #777;
	text-decoration: none;
	opacity: 0.6;
	transition: opacity 0.2s ease;
}
.admin-link:hover {
	opacity: 1;
	color: #999;
}
