/* Global shared styles */
:root{--bg:#fff;--accent:#0b6;--text:#222}
*{box-sizing:border-box}
body{font-family:Segoe UI, system-ui, -apple-system, Roboto, "Helvetica Neue", Arial; margin:0; color:var(--text); background:var(--bg);}
a{color:var(--accent)}
/* Layout improvements */
body{font-family:Segoe UI, system-ui, -apple-system, Roboto, "Helvetica Neue", Arial; margin:0; color:var(--text); background:linear-gradient(180deg,#fbfdff 0%,#f7fbff 100%);} 
a{color:var(--accent)}
header{padding:1rem;background:transparent;border-bottom:0}
main{padding:1.25rem;max-width:1100px;margin:0 auto}
button{padding:.6rem 1rem;border:0;background:var(--accent);color:white;border-radius:6px}
form label{display:block;margin:.5rem 0}
@media (max-width:600px){body{font-size:16px}}

/* Card / container */
.container{max-width:1100px;margin:0 auto;padding:0 1rem}
.card{background:white;border-radius:10px;padding:1rem;margin:.75rem 0;box-shadow:0 6px 18px rgba(20,30,50,0.06);}

/* Lists with hover */
.list{list-style:none;padding:0;margin:0}
.list li{padding:.6rem .75rem;border-radius:8px;transition:all .12s ease;display:flex;align-items:center;justify-content:space-between}
.list li + li{margin-top:.5rem}
.list li:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(20,30,50,0.06);background:#fff}

/* Icon helper */
.icon{width:20px;height:20px;display:inline-block;vertical-align:middle;margin-right:.5rem}
.brand{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--text);font-weight:700}
.brand .brand-text{font-size:1.05rem}

/* Buttons */
button{cursor:pointer}
button:hover{filter:brightness(.98);transform:translateY(-1px)}

/* Table polish */
table{border-collapse:collapse;width:100%}
table th, table td{padding:.5rem .6rem;border-bottom:1px solid #f0f0f0}

/* Site header styles */
.site-header{background:var(--bg);border-bottom:1px solid #eee}
.site-header .container{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 1rem}
.site-header .brand{font-weight:700;color:var(--text);text-decoration:none;font-size:1.1rem}
.site-header .main-nav a{margin-left:1rem;color:var(--text);text-decoration:none;padding:.4rem .6rem;border-radius:4px}
.site-header .main-nav a:hover{background:#f0f0f0}

/* Mobile header (used by mobile/index.html) */
.mobile-header{display:none}
@media (max-width:700px){
	.site-header .main-nav{display:none}
	.site-header .container{position:relative}
	.site-header .main-nav{position:absolute;left:0;right:0;top:100%;background:var(--bg);padding:.5rem 1rem;display:none;flex-direction:column;border-bottom:1px solid #eee}
	.site-header .main-nav a{margin:.25rem 0;padding:.5rem;border-radius:4px}

	.mobile-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg);border-bottom:1px solid #eee}
	.mobile-header h1{font-size:1rem;margin:0}
	.mobile-header nav a{margin-left:.75rem;color:var(--text);text-decoration:none}

	/* Hamburger / toggle */
	.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:36px;border:0;background:transparent;padding:0;margin-left:8px}
	.nav-toggle .hamburger{display:block;width:20px;height:2px;background:var(--text);position:relative}
	.nav-toggle .hamburger::before,.nav-toggle .hamburger::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--text);}
	.nav-toggle .hamburger::before{top:-6px}
	.nav-toggle .hamburger::after{top:6px}
	.nav-toggle[aria-expanded="true"] .hamburger{background:transparent}
	.nav-toggle[aria-expanded="true"] .hamburger::before{transform:rotate(45deg);top:0}
	.nav-toggle[aria-expanded="true"] .hamburger::after{transform:rotate(-45deg);top:0}
}
