* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html, body {
  font-family: -apple-system, BlinkMacSystemFont, "San Francisco", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  color: #333333;
  background: #f2f2f2;
  line-height: 1.5; }

.container {
  width: 90%;
  max-width: 960px;
  margin: 0 auto;
  padding: 24px 0; }

.site-header {
  background: #333333;
  color: #ffffff;
  padding: 8px 0; }
  .site-header .site-nav ul {
    display: flex;
    list-style: none;
    gap: 16px; }
    .site-header .site-nav ul a {
      color: #ffffff; }
      .site-header .site-nav ul a:hover {
        text-decoration: underline; }

.site-footer {
  background: #333333;
  color: #ffffff; }

.footer-disclaimer {
  color: gray;
  font-size: 0.75rem; }

.global-nav ul {
  list-style: none;
  display: flex;
  gap: 16px; }

a {
  color: #007aff;
  text-decoration: none;
  font-weight: 500; }
  a:hover {
    text-decoration: underline; }

section h1:first-of-type {
  margin-bottom: 0.75rem;
  display: block;
  font-size: 2em;
  margin-block-start: 0.17em;
  margin-block-end: 0.83em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold; }

.admin-form, .registry-panel {
  background: #ffffff;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  padding: 16px;
  margin-bottom: 24px; }

.registry-panel {
  margin-top: 24px; }

main p + p {
  margin-top: 2rem; }

p + h1 {
  margin-top: 3rem; }

p + h2 {
  margin-top: 3rem; }

p + h3 {
  margin-top: 3rem; }

p + h4 {
  margin-top: 3rem; }

p + h5 {
  margin-top: 3rem; }

p + h6 {
  margin-top: 3rem; }

table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px; }
  table thead {
    background: #f2f2f2; }
  table th, table td {
    padding: 8px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  table tr:hover {
    background: rgba(0, 0, 0, 0.03); }
  table th {
    text-align: left; }

input, textarea, select {
  padding: 8px;
  font-size: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background: #ffffff;
  transition: background 0.2s, border-color 0.2s; }
  input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: #007aff; }

button.primary {
  display: inline-block;
  padding: 8px 16px;
  font-size: 1rem;
  font-weight: 500;
  color: #ffffff;
  background: #007aff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s; }
  button.primary:hover {
    background: #3395ff; }
  button.primary:active {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }

button.secondary {
  display: inline-block;
  padding: 8px 16px;
  font-size: 1rem;
  font-weight: 500;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.1);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s; }
  button.secondary:hover {
    background: rgba(26, 26, 26, 0.1); }
  button.secondary:active {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }

#toast-container {
  position: fixed;
  top: 16px;
  right: 16px;
  width: 240px; }

.toast {
  opacity: 0;
  transform: translateY(-sp(sm));
  margin-bottom: 8px; }
  .toast--visible {
    opacity: 1;
    transform: translateY(0); }
  .toast--success {
    display: inline-block;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    color: #ffffff;
    background: #28a745;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s; }
    .toast--success:hover {
      background: #34ce57; }
    .toast--success:active {
      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }
  .toast--error {
    display: inline-block;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    color: #ffffff;
    background: #dc3545;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s; }
    .toast--error:hover {
      background: #e4606d; }
    .toast--error:active {
      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }
  .toast--info {
    display: inline-block;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    color: #ffffff;
    background: #17a2b8;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s; }
    .toast--info:hover {
      background: #1fc8e3; }
    .toast--info:active {
      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }

#lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center; }

#lightbox-content {
  max-width: 90%;
  max-height: 90%; }
  #lightbox-content img {
    display: block;
    max-width: 100%;
    max-height: 100%; }

.login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80vh;
  background: #f2f2f2; }
  .login-page .login-container {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    padding: 24px;
    width: 100%;
    max-width: 360px; }
    .login-page .login-container label {
      display: block;
      font-size: 0.875rem;
      margin-bottom: 8px;
      font-weight: 500; }
    .login-page .login-container input {
      width: 100%;
      height: 48px;
      padding: 0 12px;
      border: 1px solid rgba(0, 0, 0, 0.1);
      border-radius: 6px;
      font-size: 1rem;
      margin-bottom: 16px;
      transition: border-color 0.2s; }
      .login-page .login-container input:focus {
        outline: none;
        border-color: #007aff;
        box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2); }
    .login-page .login-container button {
      width: 100%;
      height: 44px;
      display: inline-block;
      padding: 8px 16px;
      font-size: 1rem;
      font-weight: 500;
      color: #ffffff;
      background: #007aff;
      border: none;
      border-radius: 4px;
      cursor: pointer;
      transition: background 0.2s, box-shadow 0.2s;
      font-size: 1rem;
      font-weight: 600;
      margin-top: 8px; }
      .login-page .login-container button:hover {
        background: #3395ff; }
      .login-page .login-container button:active {
        box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1); }
    .login-page .login-container .forgot {
      text-align: center;
      margin-top: 12px; }
      .login-page .login-container .forgot a {
        font-size: 0.875rem;
        color: rgba(0, 0, 0, 0.1); }
        .login-page .login-container .forgot a:hover {
          color: #007aff; }

.login-error {
  background: rgba(220, 53, 69, 0.1);
  color: #dc3545;
  padding: 8px;
  border-radius: 4px;
  margin-bottom: 16px;
  font-size: 0.875rem; }

.admin-dashboard {
  display: flex;
  gap: 24px;
  margin-top: 24px; }
  .admin-dashboard .admin-nav {
    flex: 0 0 200px;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    padding: 16px; }
    .admin-dashboard .admin-nav ul {
      list-style: none; }
      .admin-dashboard .admin-nav ul li + li {
        margin-top: 8px; }
      .admin-dashboard .admin-nav ul a, .admin-dashboard .admin-nav ul button {
        display: block;
        padding: 8px 16px;
        border-radius: 4px;
        text-decoration: none;
        color: #333333;
        background: transparent; }
        .admin-dashboard .admin-nav ul a:hover, .admin-dashboard .admin-nav ul a.active, .admin-dashboard .admin-nav ul button:hover, .admin-dashboard .admin-nav ul button.active {
          background: rgba(0, 0, 0, 0.03); }
  .admin-dashboard .admin-content {
    flex: 1;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    padding: 16px;
    overflow-x: auto; }

.stats-cards {
  display: flex;
  gap: 16px;
  margin-bottom: 24px; }

.stats-card {
  background: #ffffff;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  padding: 16px;
  flex: 1;
  text-align: center; }
  .stats-card h3 {
    font-size: 1.75rem; }
  .stats-card p {
    font-size: 1rem;
    color: gray; }

[hidden] {
  display: none !important; }

#search, #dashboardSearch {
  padding: 8px;
  font-size: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background: #ffffff;
  transition: background 0.2s, border-color 0.2s;
  width: 100%;
  height: 48px;
  padding: 0 12px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  font-size: 1rem;
  margin-bottom: 8px;
  transition: border-color 0.2s; }
  #search:focus, #dashboardSearch:focus {
    outline: none;
    border-color: #007aff; }
  #search:focus, #dashboardSearch:focus {
    outline: none;
    border-color: #007aff;
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2); }