* { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: ui-sans-serif, system-ui, sans-serif; background: #f3f4f6; min-height: 100vh; }
    .top-bar { background: white; border-bottom: 1px solid #e5e7eb; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; }
    .top-bar h1 { font-size: 1.25rem; color: #111827; }
    .user-info { display: flex; align-items: center; gap: 12px; color: #6b7280; font-size: 0.9rem; }
    .role-badge { background: #dbeafe; color: #1e40af; padding: 2px 8px; border-radius: 10px; font-size: 0.8rem; font-weight: 500; text-transform: capitalize; }
    .logout-btn { background: none; border: 1px solid #d1d5db; border-radius: 6px; padding: 6px 12px; cursor: pointer; color: #374151; font-size: 0.85rem; }
    .logout-btn:hover { background: #f9fafb; }
    .container { max-width: 900px; margin: 24px auto; padding: 0 24px; }
    .search-box { width: 100%; padding: 12px 16px; border: 2px solid #e5e7eb; border-radius: 8px; font-size: 1rem; margin-bottom: 16px; }
    .search-box:focus { outline: none; border-color: #667eea; }
    .patient-list { background: white; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden; }
    .patient-row { display: flex; align-items: center; padding: 14px 20px; border-bottom: 1px solid #f3f4f6; cursor: pointer; transition: background 0.15s; }
    .patient-row:hover { background: #f9fafb; }
    .patient-row:last-child { border-bottom: none; }
    .patient-name { font-weight: 600; color: #111827; min-width: 200px; }
    .patient-mrn { color: #6b7280; font-size: 0.9rem; min-width: 100px; }
    .patient-dob { color: #6b7280; font-size: 0.9rem; min-width: 120px; }
    .patient-sex { color: #6b7280; font-size: 0.9rem; }
    .empty-state { text-align: center; padding: 48px; color: #9ca3af; }
    .loading { text-align: center; padding: 48px; color: #9ca3af; }
    .settings-link { color: #6b7280; text-decoration: none; font-size: 1.2rem; }
    .settings-link:hover { color: #374151; }