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

body {
    font-family: 'Segoe UI', Arial, sans-serif;
    background: #0a0a1a;
    color: #d0d8f0;
    min-height: 100vh;
}

header {
    background: #111130;
    padding: 1.5rem 2rem;
    border-bottom: 2px solid #2a2a6a;
}
header h1 { font-size: 2rem; color: #a0c4ff; }
header p  { margin-top: .4rem; color: #8090b0; font-size: .9rem; }

nav {
    background: #0e0e28;
    padding: .8rem 2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    border-bottom: 1px solid #2a2a6a;
}
nav form { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
nav a {
    color: #a0c4ff;
    text-decoration: none;
    padding: .35rem .9rem;
    border-radius: 20px;
    border: 1px solid #2a2a6a;
    font-size: .9rem;
    transition: background .2s;
}
nav a:hover, nav a.active { background: #2a2a6a; color: #fff; }

.search-wrap { display: flex; gap: .4rem; margin-left: auto; }
.search-wrap input {
    padding: .35rem .8rem;
    border-radius: 20px;
    border: 1px solid #2a2a6a;
    background: #0a0a1a;
    color: #d0d8f0;
    font-size: .9rem;
    width: 220px;
}
.search-wrap button {
    padding: .35rem .9rem;
    border-radius: 20px;
    border: none;
    background: #3a3ab0;
    color: #fff;
    cursor: pointer;
    font-size: .9rem;
}
.search-wrap button:hover { background: #5050d0; }

main { padding: 1.5rem 2rem; }
.count { margin-bottom: 1rem; color: #8090b0; font-size: .9rem; }
.error { color: #ff7070; background: #200; padding: 1rem; border-radius: 8px; }
.empty { color: #8090b0; padding: 2rem; text-align: center; }

table {
    width: 100%;
    border-collapse: collapse;
    font-size: .85rem;
}
thead th {
    background: #111130;
    color: #a0c4ff;
    padding: .7rem .8rem;
    text-align: left;
    border-bottom: 2px solid #2a2a6a;
    white-space: nowrap;
}
tbody tr { border-bottom: 1px solid #1a1a3a; transition: background .15s; }
tbody tr:hover { background: #111130; }
tbody td { padding: .6rem .8rem; }

footer {
    text-align: center;
    padding: 1.2rem;
    color: #506080;
    font-size: .8rem;
    border-top: 1px solid #1a1a3a;
}
footer a { color: #a0c4ff; }