body {
     margin: 0;
     font-family: 'Segoe UI', sans-serif;
     background: #e8f6f8;
     color: #222;
}
 .site-header {
     display: flex;
     justify-content: space-between;
     padding: 12px 20px;
     background: #007b8a;
     color: white;
}
 .header-right {
     display: flex;
     align-items: center;
     gap: 12px;
}
 .user {
     font-weight: 500;
}
 .login-box input {
     padding: 6px;
     margin-left: 6px;
}
 .login-box button, form button {
     padding: 6px 10px;
     background: #005f68;
     color: white;
     border: none;
     border-radius: 4px;
     cursor: pointer;
}
 .login-box button:hover, form button:hover {
     background: #003e44;
}
 .error-msg {
     color: #c0392b;
     text-align: center;
     font-weight: bold;
}
 main {
     max-width: 1000px;
     margin: 30px auto;
     padding: 10px;
}
 .search-section {
     text-align: center;
     margin-bottom: 30px;
}
 .search-section input {
     padding: 8px;
     margin: 0 4px;
     border: 1px solid #ccc;
     border-radius: 4px;
}
 .search-section button {
     background: #0097a7;
}
 .data-wrapper {
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 100%;
     flex-wrap: wrap;
     gap: 20px;
     justify-content: center;
}
 .block {
     flex: 1;
     min-width: 480px;
     max-width: 600px;
     background: white;
     padding: 16px;
     border-radius: 8px;
     box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
 .card {
     background: #f0f9fa;
     border: 1px solid #b2ebf2;
     padding: 12px;
     margin-bottom: 12px;
     border-radius: 6px;
}