* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, sans-serif; background: #fff; color: #112; margin: 0; padding: 1rem; }
main { max-width: 720px; margin: 0 auto; }
h1 { color: #002855; border-left: 6px solid #004aad; padding-left: 0.75rem; }
a { color: #004aad; }
form { background: #f4f8fd; padding: 1rem; border-radius: 8px; margin-top: 1rem; display: grid; gap: 0.5rem; grid-template-columns: 1fr 1fr; }
form label { display: block; font-size: 0.9rem; }
form input, form textarea { width: 100%; padding: 0.35rem; border: 1px solid #004aad; border-radius: 4px; }
button { background: #004aad; color: #fff; border: none; padding: 0.6rem 1rem; border-radius: 4px; cursor: pointer; }
button:hover { background: #002855; }
table { width: 100%; border-collapse: collapse; margin-top: 1rem; background: #fff; }
th, td { padding: 0.5rem; border-bottom: 1px solid #dde; text-align: left; }
th { background: #004aad; color: #fff; }
.gate, .join { grid-template-columns: 1fr 1fr; }
@media (max-width: 600px) { form { grid-template-columns: 1fr; } }