diff --git a/member/static/member/css/styles.css b/member/static/member/css/styles.css
new file mode 100644
index 0000000..55b09b2
--- /dev/null
+++ b/member/static/member/css/styles.css
@@ -0,0 +1,130 @@
+:root {
+ --bg-dark: #121212;
+ --bg-sidebar: #2a0000;
+ --bg-panel: #1e1e1e;
+ --bg-accent: #b22222;
+ --text-light: #f1f1f1;
+ --text-muted: #999;
+ --highlight: #f5a623;
+ --font-sans: 'Inter', 'Roboto', sans-serif;
+}
+
+body {
+ margin: 0;
+ font-family: var(--font-sans);
+ background-color: var(--bg-dark);
+ color: var(--text-light);
+}
+
+.sidebar {
+ width: 220px;
+ height: 100vh;
+ background-color: var(--bg-sidebar);
+ color: var(--text-light);
+ display: flex;
+ flex-direction: column;
+ padding: 20px;
+}
+
+.sidebar h2 {
+ font-size: 1.2rem;
+ margin-bottom: 2rem;
+}
+
+.sidebar nav a {
+ color: var(--text-light);
+ text-decoration: none;
+ margin: 10px 0;
+ display: flex;
+ align-items: center;
+ padding: 8px 12px;
+ border-radius: 4px;
+ transition: background 0.2s ease;
+}
+
+.sidebar nav a:hover,
+.sidebar nav a.active {
+ background-color: var(--bg-accent);
+}
+
+.main {
+ margin-left: 220px;
+ padding: 20px;
+ display: flex;
+ height: 100vh;
+ box-sizing: border-box;
+ background-color: var(--bg-dark);
+}
+
+.members-table {
+ flex: 2;
+ margin-right: 20px;
+ background-color: var(--bg-panel);
+ padding: 20px;
+ border-radius: 8px;
+ overflow-y: auto;
+}
+
+.members-table table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+.members-table th,
+.members-table td {
+ text-align: left;
+ padding: 10px;
+ border-bottom: 1px solid #333;
+}
+
+.members-table th {
+ color: var(--highlight);
+ font-weight: 600;
+}
+
+.members-table tr:hover {
+ background-color: rgba(255, 255, 255, 0.05);
+ cursor: pointer;
+}
+
+.details-panel {
+ flex: 1;
+ background-color: var(--bg-panel);
+ padding: 20px;
+ border-radius: 8px;
+}
+
+.details-panel h3 {
+ margin-top: 0;
+}
+
+.details-panel .info {
+ margin-bottom: 10px;
+ color: var(--text-muted);
+}
+
+.badge {
+ display: inline-block;
+ background-color: var(--bg-accent);
+ padding: 4px 8px;
+ border-radius: 4px;
+ font-size: 0.8rem;
+ color: #fff;
+ margin-right: 5px;
+}
+
+.button {
+ background-color: var(--bg-accent);
+ color: #fff;
+ border: none;
+ padding: 8px 16px;
+ font-size: 0.9rem;
+ border-radius: 4px;
+ cursor: pointer;
+ margin-top: 10px;
+}
+
+.button:hover {
+ background-color: #d63031;
+}
+
diff --git a/member/templates/master.html b/member/templates/master.html
index 1ef97a3..c4352dc 100644
--- a/member/templates/master.html
+++ b/member/templates/master.html
@@ -1,7 +1,9 @@
+{% load static %}
{% block title %}{% endblock %}
+