:root { color: #1c1c1c; font-family: "Segoe UI", sans-serif; }
body { margin: 0; }
header { display: flex; align-items: center; gap: 1rem; min-height: 4.5rem; padding: 0.4rem 1rem; background: #17324d; color: #fff; }
header a, header button { color: #fff; font-weight: 700; text-decoration: none; }
header a:hover, header a:focus, header a:visited { text-decoration: none; }
.brand { display: flex; align-items: center; gap: 0.4rem; }
.brand span:first-child { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 0.3rem; background: #fff; color: #17324d; }
.page-heading { flex: 1; text-align: center; }
.page-name { margin: 0; font-size: 1.35rem; }
.app-name { margin: 0; font-size: 0.8rem; }
nav { margin-left: auto; }
.site-links { display: flex; align-items: center; gap: 1rem; }
.site-links a.is-current { color: #f0d48a; }
.menu-toggle, .menu-button { display: none; }
button, .button, main a.button, main a.button:visited { background: #0f6b4c; color: #fff; border: 0; border-radius: 0.3rem; padding: 0.45rem 0.8rem; font-weight: 700; text-decoration: none; display: inline-block; }
main { padding: 1rem; max-width: 70rem; }
main a { color: purple; text-decoration: none; }
main a:hover, main a:focus, main a:visited { text-decoration: none; }
.notice { background: #f4f0e6; padding: 0.6rem 0.8rem; }
.actions { display: flex; gap: 0.5rem; align-items: center; }
.actions form { margin: 0; }
.record-search { display: block; margin: 0.8rem 0; }
.record-search input { width: min(24rem, 100%); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 0.35rem 0.5rem; border-bottom: 1px solid #ddd; }
.company-form { display: grid; gap: 0.7rem; max-width: 36rem; }
.company-form label, .on-field { display: grid; gap: 0.25rem; }
.company-form input { width: 100%; box-sizing: border-box; }
.yes-no { display: inline-flex; gap: 0.3rem; margin-right: 1rem; }
@media (max-width: 700px) {
  header { flex-wrap: wrap; }
  .menu-button { display: inline-block; }
  .site-links { display: none; width: 100%; flex-direction: column; align-items: flex-start; }
  .menu-toggle:checked ~ .site-links { display: flex; }
}