:root{--primary:#2563eb;
--primary-dark:#1e40af;
--bg:#0f172a;
--bg-card:#1e293b;
--text:#f1f5f9;
--text-muted:#94a3b8;
--border:#334155;
--success:#10b981;
--radius:0.75rem}*{margin:0;padding:0;box-sizing:border-box}
body{
	font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;background:var(--bg);
	color:var(--text);
	line-height:1.6;
	min-height:100vh;
	padding:2rem 1rem}
h1{
	font-size:2.8rem;
	font-weight:700;
	text-align:center;
	margin-bottom:0.5rem;
	background:linear-gradient(135deg, var(--primary) 0%, #3b82f6 100%);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text
	}
h2{
	font-size:2rem;
	font-weight:700;
	text-align:center;
	color:var(--text);
	margin-bottom:2rem;
	margin-top:0
	}
.section-divider{
	max-width:1200px;
	margin:4rem auto;
	height:2px;
	background:linear-gradient(90deg, transparent, var(--primary), transparent);
	position:relative
	}
.section-divider::before{
	content:'⬇';
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
	background:var(--bg);
	color:var(--primary);
	font-size:1.5rem;
	padding:0 1rem
	}
h3{
	font-size:1.5rem;
	font-weight:600;
	text-align:center;
	color:var(--text);
	margin-bottom:1.5rem;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto
	}
h5{
	font-size:.7rem;
	font-weight:600;
	text-align:center;
	color:var(--text);
	margin-bottom:1rem;
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
	color:var(--text-muted)
	}
#noqso{
	text-align:
	center;
	margin-bottom:20px;
	color:var(--primary)
	}
.station-info{
	max-width:1300px;
	margin:0 auto 3rem;
	background:var(--bg-card);
	border-radius:var(--radius);
	padding:2rem;
	border:1px solid var(--border);
	box-shadow:0 4px 6px rgba(0, 0, 0, 0.3)
	}
.station-info h3{
	margin-bottom:2rem;
	font-size:1.5rem;
	text-align:center;
	color:var(--primary)
	}
.info-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
	gap:2rem
	}
.info-section{
	background:rgba(255, 255, 255, 0.02);
	padding:1.5rem;
	border-radius:calc(var(--radius) - 0.25rem);
	border:1px solid var(--border)
	}
.info-section h4{
	font-size:1rem;
	font-weight:600;
	color:var(--primary);
	text-transform:uppercase;
	letter-spacing:0.05em;
	margin-bottom:1rem;
	padding-bottom:0.75rem;
	border-bottom:2px solid var(--primary)
	}
.info-item{
	display:grid;
	grid-template-columns:120px 1fr;
	padding:0.5rem 0;
	gap:0.75rem;
	align-items:start
	}
.info-item2{
	display:grid;
	grid-template-columns:600px 1fr;
	padding:0.5rem 0;
	gap:0.75rem;
	align-items:start
	}
.info-item .label{
	color:var(--text-muted);
	font-weight:500;text-align:left
	}
.info-item2 .label{
	color:var(--text-muted);
	font-weight:500;text-align:left
	}
.info-item .value{
	color:var(--text);
	font-weight:400;
	text-align:left
	}
form{
	max-width:600px;
	margin:0 auto 3rem;
	display:flex;
	gap:0.75rem;
	background:var(--bg-card);
	padding:1.5rem;
	border-radius:var(--radius);
	border:1px solid var(--border);
	box-shadow:0 4px 6px rgba(0, 0, 0, 0.3)
	}
input[type="text"]{
	flex:1;
	padding:0.875rem 1.25rem;
	background:var(--bg);
	border:1px solid var(--border);
	border-radius:calc(var(--radius) - 0.25rem);
	color:var(--text);
	font-size:1rem;
	outline:none;
	transition:all 0.2s
	}
input[type="text"]:focus{
	border-color:var(--primary);
	box-shadow:0 0 0 3px rgba(37, 99, 235, 0.1)
	}
input[type="text"]::placeholder{
	color:var(--text-muted)
	}
button[type="submit"]{
	padding:0.875rem 2rem;
	background:var(--primary);
	color:white;
	border:none;
	border-radius:calc(var(--radius) - 0.25rem);
	font-size:1rem;
	font-weight:600;
	cursor:pointer;
	transition:all 0.2s
	}
button[type="submit"]:hover{
	background:var(--primary-dark);
	transform:translateY(-1px);
	box-shadow:0 4px 12px rgba(37, 99, 235, 0.4)
	}
button[type="submit"]:active{
	transform:translateY(0)
	}
table{
	max-width:1200px;
	margin:0 auto;
	width:100%;
	background:var(--bg-card);
	border-radius:var(--radius);
	overflow:hidden;
	border:1px solid var(--border);
	box-shadow:0 4px 6px rgba(0, 0, 0, 0.3)
	}
thead{
	background:linear-gradient(135deg, var(--primary) 0%, #3b82f6 100%)
	}
thead th{
	padding:1rem 1.25rem;
	text-align:left;
	font-weight:600;
	font-size:0.875rem;
	text-transform:uppercase;
	letter-spacing:0.05em;
	color:white;
	border-right:1px solid rgba(255, 255, 255, 0.2);
	border-bottom:1px solid rgba(255, 255, 255, 0.2)
	}
tbody tr{
	border-bottom:1px solid var(--border);
	transition:background 0.15s
	}
tbody tr:nth-child(even){
	background:rgba(255, 255, 255, 0.02)
	}
tbody tr:hover{
	background:rgba(59, 130, 246, 0.1)
	}
tbody tr:last-child{
	border-bottom:1px solid var(--border)
	}
tbody td{
	padding:1rem 1.25rem;
	font-size:0.95rem;
	border-right:1px solid var(--border);
	border-bottom:1px solid var(--border)
	}
tbody td:last-child{
	text-align:center;
	border-right:none
	}
thead th{
	border-right:1px solid rgba(255, 255, 255, 0.2)
	}
thead th:last-child{
	border-right:none;
	text-align:center
	}
button[data-qso]{
	padding:0.625rem 1.5rem;
	background:var(--success);
	color:white;
	border:none;
	border-radius:0.5rem;
	font-size:0.9375rem;
	font-weight:600;
	cursor:pointer;
	transition:all 0.2s
	}
button[data-qso]:hover{
	background:#059669;
	transform:translateY(-1px);
	box-shadow:0 4px 12px rgba(16, 185, 129, 0.3)
	}
button[data-qso]:active{
	transform:translateY(0)
	}
@media (max-width:768px)
{body{
	padding:1rem
	}
h1{
	font-size:2rem
	}
h2{
	font-size:1rem;
	margin-bottom:2rem
	}
form{
	flex-direction:column;
	padding:1rem
	}
table{
	font-size:0.875rem
	}
thead th, tbody td{
	padding:0.75rem
	}
button[data-qso]{
	padding:0.5rem 1rem;
	font-size:0.8125rem
	}
}