
.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; gap: 20px; }
.page-header h1 { margin: 0; }
.search-container input { 
    padding: 10px 15px; 
    border-radius: var(--radius-sm); 
    border: 1px solid var(--border); 
    width: 250px;
    font-family: inherit;
}

.sessions-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.session-card { 
    background: var(--card-bg); 
    border-radius: var(--radius-md); 
    border: 1px solid var(--border); 
    transition: all 0.2s ease; 
    display: flex; 
    overflow: hidden;
    box-shadow: var(--shadow);
}
.session-card:hover { 
    border-color: var(--primary); 
    transform: translateY(-5px); 
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.severity-strip { width: 6px; height: 100%; }
.severity-strip-p0 { background: var(--danger); }
.severity-strip-p1 { background: var(--warning); }
.severity-strip-p2 { background: #f1c40f; }
.severity-strip-p3 { background: var(--success); }

.card-content { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.card-header h3 { margin: 0; font-size: 16px; color: var(--text-primary); }
.btn-delete { background: none; border: none; cursor: pointer; font-size: 16px; color: var(--danger); transition: transform 0.2s; }
.btn-delete:hover { transform: scale(1.2); }

.session-card p { font-size: 14px; color: var(--text-secondary); flex: 1; margin-bottom: 15px; line-height: 1.4; }

.card-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.card-meta small { font-size: 12px; color: var(--text-muted); }
.model-badge { 
    font-size: 10px; 
    background: var(--msg-system); 
    padding: 2px 6px; 
    border-radius: 10px; 
    color: var(--text-secondary); 
    font-weight: 600; 
}

.card-footer { text-align: right; }
.btn-view { 
    padding: 6px 12px; 
    background: var(--primary); 
    color: white; 
    border: none; 
    border-radius: var(--radius-sm); 
    cursor: pointer; 
    font-size: 12px; 
    transition: background 0.2s;
}
.btn-view:hover { background: var(--primary-light); }
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-secondary); font-style: italic; background: var(--card-bg); border: 2px dashed var(--border); border-radius: var(--radius-md); grid-column: 1 / -1; }
.empty-state a { color: var(--primary); text-decoration: none; font-weight: 600; }
