.page-card {
padding: 34px;
background: var(--glass);
border: 1px solid var(--border);
border-radius: 34px;
box-shadow: var(--shadow);
backdrop-filter: blur(18px);
}

.page-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 20px;
margin-bottom: 28px;
}

.page-title {
margin: 0 0 10px;
font-size: 44px;
line-height: 1.05;
letter-spacing: -0.05em;
color: var(--text);
}

.page-subtitle {
margin: 0;
max-width: 620px;
color: var(--muted);
font-size: 17px;
line-height: 1.6;
}

.table-wrap {
width: 100%;
overflow-x: auto;
}

.birthdays-table {
width: 100%;
min-width: 920px;
border-collapse: separate;
border-spacing: 0;

background: var(--card);
border: 1px solid var(--soft-border);
border-radius: 24px;
overflow: hidden;


}

.birthdays-table th,
.birthdays-table td {
padding: 16px;
text-align: left;
vertical-align: top;
border-bottom: 1px solid var(--soft-border);
}

.birthdays-table th {
background: #eef2ff;
color: var(--primary-dark);
font-size: 14px;
font-weight: 900;
}

.birthdays-table tr:last-child td {
border-bottom: 0;
}

.birthdays-table tbody tr:hover {
background: #fafbff;
}

.person-name {
font-weight: 900;
color: var(--text);
}

.person-note {
max-width: 380px;
color: var(--muted);
line-height: 1.5;
overflow-wrap: anywhere;
word-break: break-word;
}

.table-actions {
display: flex;
gap: 8px;
flex-wrap: wrap;
}

.small-link {
display: inline-flex;
align-items: center;
justify-content: center;

min-height: 34px;
padding: 0 12px;

border: 0;
border-radius: 999px;

background: #eef2ff;
color: var(--primary-dark);

text-decoration: none;
font-size: 14px;
font-weight: 800;
cursor: pointer;

}

.small-link:hover {
background: #e0e7ff;
}

.danger-link {
color: #dc2626;
}

.danger-link:hover {
background: #fee2e2;
}

.empty-state {
padding: 38px;
text-align: center;


background: rgba(255, 255, 255, 0.72);
border: 1px dashed #d7daf0;
border-radius: 24px;


}

.empty-state h2 {
margin: 0 0 10px;
color: var(--text);
}

.empty-state p {
margin: 0 0 22px;
color: var(--muted);
line-height: 1.6;
}

@media (max-width: 700px) {
.page-card {
padding: 22px;
border-radius: 26px;
}


.page-head {
    flex-direction: column;
    margin-bottom: 22px;
}

.page-title {
    font-size: 34px;
}

.page-subtitle {
    font-size: 16px;
}

}