diff --git a/manager/views.py b/manager/views.py
index ecb87bf..71049de 100644
--- a/manager/views.py
+++ b/manager/views.py
@@ -206,4 +206,4 @@ class PositionUpdateView(LoginRequiredMixin, generic.UpdateView):
 
 class PositionDeleteView(LoginRequiredMixin, generic.DeleteView):
     model = Position
-    success_url = reverse_lazy("manager:position-list")
+    success_url = reverse_lazy("manager:position-list")
\ No newline at end of file
diff --git a/static/css/styles.css b/static/css/styles.css
index 9738120..2ac5770 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -1,106 +1,834 @@
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
+/* reset base */
+*, *::before, *::after {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
 }
 
+:root {
+  --glass-bg: rgba(12, 12, 20, 0.62);
+  --glass-border: rgba(255, 255, 255, 0.09);
+  --glass-hover: rgba(255, 255, 255, 0.05);
+  --accent: #6ee7f7;
+  --accent-2: #a78bfa;
+  --accent-glow: rgba(110, 231, 247, 0.25);
+  --text-primary: #f0f4ff;
+  --text-secondary: rgba(240, 244, 255, 0.55);
+  --text-muted: rgba(240, 244, 255, 0.35);
+  --danger: #f87171;
+  --danger-bg: rgba(248, 113, 113, 0.12);
+  --success: #4ade80;
+  --success-bg: rgba(74, 222, 128, 0.12);
+  --warning: #fbbf24;
+  --warning-bg: rgba(251, 191, 36, 0.12);
+  --urgent: #fb923c;
+  --radius-sm: 8px;
+  --radius-md: 14px;
+  --radius-lg: 20px;
+  --radius-xl: 28px;
+  --shadow: 0 8px 40px rgba(0, 0, 0, 0.45);
+  --shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.3);
+  --transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+html { scroll-behavior: smooth; }
+
 body {
-    background-image: url("../images/background.jpg");
-    background-size: cover;
-    background-position: center;
-    background-attachment: fixed;
-    margin: 0;
-    padding: 0;
-    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-    color: #f5f5f5;
+  background-image: url("../images/background.jpg");
+  background-size: cover;
+  background-position: center;
+  background-attachment: fixed;
+  min-height: 100vh;
+  font-family: 'DM Sans', sans-serif;
+  color: var(--text-primary);
+  line-height: 1.6;
+}
+
+/* navbar */
+.navbar {
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 0 28px;
+  height: 64px;
+  background: rgba(8, 8, 16, 0.75);
+  backdrop-filter: blur(24px) saturate(1.4);
+  -webkit-backdrop-filter: blur(24px) saturate(1.4);
+  border-bottom: 1px solid var(--glass-border);
+  box-shadow: 0 1px 0 rgba(255,255,255,0.04), var(--shadow-sm);
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  margin-right: 12px;
+  flex-shrink: 0;
+}
+
+.logo-icon {
+  font-size: 22px;
+  color: var(--accent);
+  filter: drop-shadow(0 0 8px var(--accent));
+  line-height: 1;
+}
+
+.logo-text {
+  font-family: 'Syne', sans-serif;
+  font-size: 18px;
+  font-weight: 800;
+  color: var(--text-primary);
+  letter-spacing: -0.3px;
+}
+
+.nav-links {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  flex: 1;
+}
+
+.nav-link {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 7px 14px;
+  border-radius: var(--radius-sm);
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--text-secondary);
+  transition: var(--transition);
+  letter-spacing: 0.01em;
 }
 
-.content-container {
-    max-width: 50%;
-    margin: 40px auto;
-    padding: 20px;
-    background-color: rgba(18, 18, 18, 0.6);
-    backdrop-filter: blur(30px);
-    border-radius: 12px;
+.nav-link:hover {
+  color: var(--text-primary);
+  background: var(--glass-hover);
 }
 
-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 10px 20px;
-    background-color: rgba(18, 18, 18, 0.7);
-    backdrop-filter: blur(8px);
-    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-    border-radius: 0 0 12px 12px;
+.nav-icon { font-size: 13px; opacity: 0.7; }
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-left: auto;
+}
+
+.nav-user {
+  display: flex;
+  align-items: center;
+  gap: 9px;
+  font-size: 13px;
+  color: var(--text-secondary);
+  font-weight: 500;
 }
 
-header .header-left {
-    flex: 1;
+.user-avatar {
+  width: 30px;
+  height: 30px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-family: 'Syne', sans-serif;
+  font-weight: 700;
+  font-size: 13px;
+  color: #0a0a14;
+  flex-shrink: 0;
 }
 
-header .header-center {
-    flex: 1;
-    display: flex;
-    justify-content: center;
-    gap: 20px;
+/* buttons */
+.btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 10px 20px;
+  border-radius: var(--radius-sm);
+  font-family: 'DM Sans', sans-serif;
+  font-size: 14px;
+  font-weight: 500;
+  text-decoration: none;
+  border: none;
+  cursor: pointer;
+  transition: var(--transition);
+  letter-spacing: 0.01em;
+  white-space: nowrap;
 }
 
-header .header-right {
-    flex: 1;
-    display: flex;
-    justify-content: flex-end;
+.btn-sm { padding: 7px 15px; font-size: 13px; }
+.btn-lg { padding: 13px 28px; font-size: 15px; font-weight: 600; }
+
+.btn-primary {
+  background: linear-gradient(135deg, var(--accent) 0%, #38bdf8 100%);
+  color: #0a0a14;
+  box-shadow: 0 0 20px var(--accent-glow);
+}
+.btn-primary:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 0 30px var(--accent-glow), 0 4px 20px rgba(0,0,0,0.3);
+  filter: brightness(1.08);
 }
 
-header a, header form button {
-    color: #f5f5f5;
-    text-decoration: none;
-    background-color: rgba(33, 33, 33, 0.6);
-    border: none;
-    padding: 6px 12px;
-    border-radius: 6px;
-    cursor: pointer;
-    font-size: 14px;
+.btn-ghost {
+  background: var(--glass-hover);
+  color: var(--text-secondary);
+  border: 1px solid var(--glass-border);
+}
+.btn-ghost:hover {
+  background: rgba(255,255,255,0.09);
+  color: var(--text-primary);
 }
 
-header a:hover, header form button:hover {
-    background-color: rgba(55, 55, 55, 0.8);
+.btn-danger {
+  background: var(--danger-bg);
+  color: var(--danger);
+  border: 1px solid rgba(248,113,113,0.25);
+}
+.btn-danger:hover {
+  background: rgba(248,113,113,0.2);
+  box-shadow: 0 0 20px rgba(248,113,113,0.15);
 }
 
-header form button {
-    cursor: pointer;
-    background-color: #444;
-    color: white;
-    border: none;
-    padding: 5px 10px;
-    border-radius: 4px;
+.btn-success {
+  background: var(--success-bg);
+  color: var(--success);
+  border: 1px solid rgba(74,222,128,0.25);
+}
+.btn-success:hover {
+  background: rgba(74,222,128,0.22);
 }
 
-header form button:hover {
-    background-color: #555;
+.btn-group {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
 }
 
-div.content-container {
-    padding: 20px;
+/* main content */
+.main-content {
+  padding: 36px 24px 60px;
+  max-width: 900px;
+  margin: 0 auto;
 }
 
-a {
-    color: inherit;
-    text-decoration: none;
-    transition: color 0.5s;
+.content-card {
+  background: var(--glass-bg);
+  backdrop-filter: blur(32px) saturate(1.3);
+  -webkit-backdrop-filter: blur(32px) saturate(1.3);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-xl);
+  padding: 40px;
+  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,0.06);
+  animation: cardIn 0.4s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-a:hover {
-    color: #ddd;
+@keyframes cardIn {
+  from { opacity: 0; transform: translateY(16px); }
+  to { opacity: 1; transform: translateY(0); }
 }
 
+/* typography */
 h1 {
-    text-align: center;
-    margin-bottom: 40px;
+  font-family: 'Syne', sans-serif;
+  font-size: 28px;
+  font-weight: 800;
+  color: var(--text-primary);
+  letter-spacing: -0.5px;
+  margin-bottom: 28px;
+  line-height: 1.2;
+}
+
+h2 {
+  font-family: 'Syne', sans-serif;
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--text-primary);
+  letter-spacing: -0.3px;
+  margin-bottom: 20px;
+}
+
+h3 {
+  font-family: 'Syne', sans-serif;
+  font-size: 17px;
+  font-weight: 600;
+  color: var(--text-secondary);
+  margin-bottom: 14px;
+}
+
+p { color: var(--text-secondary); margin-bottom: 12px; }
+
+a { color: var(--accent); text-decoration: none; transition: var(--transition); }
+a:hover { color: var(--text-primary); }
+
+/* header */
+.page-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 32px;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+
+.page-title {
+  font-family: 'Syne', sans-serif;
+  font-size: 26px;
+  font-weight: 800;
+  color: var(--text-primary);
+  letter-spacing: -0.4px;
+  margin-bottom: 0;
+}
+
+/* forms */
+.form-group {
+  margin-bottom: 20px;
+}
+
+label {
+  display: block;
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--text-secondary);
+  margin-bottom: 8px;
+}
+
+input[type="text"],
+input[type="email"],
+input[type="password"],
+input[type="date"],
+input[type="search"],
+select,
+textarea {
+  width: 100%;
+  padding: 11px 16px;
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-sm);
+  color: var(--text-primary);
+  font-family: 'DM Sans', sans-serif;
+  font-size: 14px;
+  transition: var(--transition);
+  outline: none;
+  -webkit-appearance: none;
+  appearance: none;
+}
+
+input::placeholder, textarea::placeholder { color: var(--text-muted); }
+
+input:focus,
+select:focus,
+textarea:focus {
+  border-color: var(--accent);
+  background: rgba(110, 231, 247, 0.05);
+  box-shadow: 0 0 0 3px var(--accent-glow);
+}
+
+select {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236ee7f7' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 14px center;
+  padding-right: 36px;
+  cursor: pointer;
+}
+
+select option { background: #12121e; color: var(--text-primary); }
+
+textarea { resize: vertical; min-height: 110px; line-height: 1.6; }
+
+/* Django form.as_p wrapper */
+form p {
+  margin-bottom: 18px;
+}
+
+form p label {
+  display: block;
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--text-secondary);
+  margin-bottom: 8px;
+}
+
+/* select[multiple] */
+select[multiple] {
+  height: auto;
+  min-height: 120px;
+  background-image: none;
+  padding-right: 16px;
+}
+
+/* Checkbox / boolean */
+input[type="checkbox"] {
+  width: 18px;
+  height: 18px;
+  border-radius: 4px;
+  cursor: pointer;
+  accent-color: var(--accent);
+}
+
+/* Submit inputs */
+input[type="submit"] {
+  display: inline-flex;
+  align-items: center;
+  padding: 10px 24px;
+  border-radius: var(--radius-sm);
+  background: linear-gradient(135deg, var(--accent) 0%, #38bdf8 100%);
+  color: #0a0a14;
+  font-family: 'DM Sans', sans-serif;
+  font-size: 14px;
+  font-weight: 600;
+  border: none;
+  cursor: pointer;
+  transition: var(--transition);
+  box-shadow: 0 0 20px var(--accent-glow);
+  width: auto;
+  letter-spacing: 0.01em;
+}
+
+input[type="submit"]:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 0 30px var(--accent-glow), 0 4px 16px rgba(0,0,0,0.3);
+  filter: brightness(1.08);
+}
+
+/* Error list */
+.errorlist {
+  list-style: none;
+  margin-bottom: 6px;
+}
+.errorlist li {
+  color: var(--danger);
+  font-size: 12px;
+  padding: 5px 10px;
+  background: var(--danger-bg);
+  border-radius: 5px;
+  margin-bottom: 4px;
+  border: 1px solid rgba(248,113,113,0.2);
+}
+
+/* ===== FILTER FORM ===== */
+.filter-form {
+  display: flex;
+  align-items: flex-end;
+  gap: 12px;
+  flex-wrap: wrap;
+  margin-bottom: 24px;
+  padding: 18px 20px;
+  background: rgba(255,255,255,0.03);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-md);
+}
+
+.filter-form label {
+  font-size: 11px;
+  margin-bottom: 5px;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  color: var(--text-muted);
+}
+
+.filter-form > * {
+  flex: 1;
+  min-width: 140px;
+}
+
+.filter-form input[type="submit"],
+.filter-form button[type="submit"] {
+  flex: 0;
+  min-width: auto;
+  align-self: flex-end;
+  white-space: nowrap;
+}
+
+.filter-group {
+  display: flex;
+  flex-direction: column;
+}
+
+/* ===== LISTS ===== */
+.item-list {
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.item-list li,
+.list-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 14px 18px;
+  background: rgba(255,255,255,0.03);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-md);
+  transition: var(--transition);
+  gap: 12px;
+}
+
+.item-list li:hover,
+.list-item:hover {
+  background: rgba(255,255,255,0.06);
+  border-color: rgba(255,255,255,0.14);
+  transform: translateX(3px);
+}
+
+.item-list li a,
+.item-name {
+  color: var(--text-primary);
+  font-weight: 500;
+  font-size: 14px;
+  flex: 1;
+}
+
+.item-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+/* badges/tags */
+.badge {
+  display: inline-flex;
+  align-items: center;
+  padding: 3px 10px;
+  border-radius: 20px;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+.badge-done { background: var(--success-bg); color: var(--success); border: 1px solid rgba(74,222,128,0.25); }
+.badge-open { background: rgba(110,231,247,0.1); color: var(--accent); border: 1px solid rgba(110,231,247,0.2); }
+.badge-urgent { background: rgba(251,146,60,0.15); color: var(--urgent); border: 1px solid rgba(251,146,60,0.25); }
+.badge-high { background: rgba(248,113,113,0.12); color: var(--danger); border: 1px solid rgba(248,113,113,0.2); }
+.badge-medium { background: var(--warning-bg); color: var(--warning); border: 1px solid rgba(251,191,36,0.2); }
+.badge-low { background: rgba(148,163,184,0.1); color: #94a3b8; border: 1px solid rgba(148,163,184,0.2); }
+
+/* stat cards */
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.stat-card {
+  padding: 22px 20px;
+  background: rgba(255,255,255,0.04);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-lg);
+  text-align: center;
+  transition: var(--transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.stat-card::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(135deg, var(--accent-glow) 0%, transparent 70%);
+  opacity: 0;
+  transition: var(--transition);
+}
+
+.stat-card:hover { border-color: rgba(110,231,247,0.25); transform: translateY(-2px); }
+.stat-card:hover::before { opacity: 1; }
+
+.stat-number {
+  font-family: 'Syne', sans-serif;
+  font-size: 36px;
+  font-weight: 800;
+  color: var(--accent);
+  line-height: 1;
+  margin-bottom: 6px;
+  position: relative;
+}
+
+.stat-label {
+  font-size: 12px;
+  color: var(--text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  font-weight: 500;
+  position: relative;
+}
+
+/* detail views */
+.detail-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+  margin-bottom: 28px;
+}
+
+.detail-field {
+  padding: 16px 18px;
+  background: rgba(255,255,255,0.03);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius-md);
+}
+
+.detail-label {
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  color: var(--text-muted);
+  font-weight: 600;
+  margin-bottom: 5px;
+}
+
+.detail-value {
+  font-size: 15px;
+  color: var(--text-primary);
+  font-weight: 500;
+}
+
+.detail-field.full-width { grid-column: 1 / -1; }
+
+/* dividers */
+.divider {
+  border: none;
+  border-top: 1px solid var(--glass-border);
+  margin: 28px 0;
+}
+
+/* empty state*/
+.empty-state {
+  text-align: center;
+  padding: 48px 24px;
+  color: var(--text-muted);
+}
+
+.empty-state-icon { font-size: 40px; margin-bottom: 12px; opacity: 0.4; }
+.empty-state-text { font-size: 15px; }
+
+/* danger zone */
+.danger-zone {
+  padding: 24px;
+  background: var(--danger-bg);
+  border: 1px solid rgba(248,113,113,0.2);
+  border-radius: var(--radius-md);
+  margin-top: 24px;
+}
+
+.danger-zone p {
+  color: rgba(248,113,113,0.8);
+  margin-bottom: 16px;
+  font-size: 14px;
+}
+
+/* auth pages */
+.auth-wrapper {
+  max-width: 420px;
+  margin: 0 auto;
+}
+
+.auth-header {
+  text-align: center;
+  margin-bottom: 32px;
+}
+
+.auth-icon {
+  width: 56px;
+  height: 56px;
+  border-radius: 16px;
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 26px;
+  margin: 0 auto 16px;
+  box-shadow: 0 0 30px var(--accent-glow);
+}
+
+.auth-title {
+  font-family: 'Syne', sans-serif;
+  font-size: 24px;
+  font-weight: 800;
+  margin-bottom: 6px;
+}
+
+.auth-subtitle {
+  font-size: 14px;
+  color: var(--text-muted);
+}
+
+.auth-footer {
+  text-align: center;
+  margin-top: 22px;
+  font-size: 13px;
+  color: var(--text-muted);
+}
+
+.auth-footer a { color: var(--accent); font-weight: 500; }
+
+/* Form field within auth */
+.auth-wrapper form p label {
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.07em;
+  color: var(--text-secondary);
+}
+
+/* логин батон */
+.btn-login {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  width: 100%;
+  margin-top: 10px;
+  padding: 14px 28px;
+  border: none;
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  overflow: hidden;
+  font-family: 'Syne', sans-serif;
+  font-size: 15px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  color: #080810;
+  background: linear-gradient(135deg, #6ee7f7 0%, #a78bfa 100%);
+  box-shadow:
+    0 0 24px rgba(110, 231, 247, 0.35),
+    0 0 60px rgba(167, 139, 250, 0.15),
+    0 4px 20px rgba(0, 0, 0, 0.3);
+  transition: var(--transition);
+}
+
+/* Блик сверху */
+.btn-login::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(
+    180deg,
+    rgba(255, 255, 255, 0.22) 0%,
+    transparent 60%
+  );
+  pointer-events: none;
+}
+
+
+.btn-login:hover {
+  transform: translateY(-2px);
+  box-shadow:
+    0 0 36px rgba(110, 231, 247, 0.5),
+    0 0 80px rgba(167, 139, 250, 0.25),
+    0 8px 30px rgba(0, 0, 0, 0.35);
+  filter: brightness(1.08);
+}
+
+.btn-login:active {
+  transform: translateY(0px);
+  box-shadow:
+    0 0 16px rgba(110, 231, 247, 0.3),
+    0 2px 10px rgba(0, 0, 0, 0.25);
+}
+
+.btn-login__text {
+  position: relative;
+  z-index: 1;
+}
+
+/* Стрелка сдвиг плавно */
+.btn-login__arrow {
+  position: relative;
+  z-index: 1;
+  font-size: 18px;
+  display: inline-block;
+  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.btn-login:hover .btn-login__arrow {
+  transform: translateX(5px);
+}
+
+/* ===== HELPTEXT ===== */
+.helptext, span.helptext {
+  display: block;
+  font-size: 11px;
+  color: var(--text-muted);
+  margin-top: 5px;
+  line-height: 1.5;
+}
+
+/* scrollbar */
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 3px; }
+::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.25); }
+
+/* ===== RESPONSIVE ===== */
+@media (max-width: 768px) {
+  .navbar { padding: 0 16px; gap: 8px; }
+  .nav-links { display: none; }
+  .main-content { padding: 20px 12px 40px; }
+  .content-card { padding: 24px 20px; }
+  .detail-grid { grid-template-columns: 1fr; }
+  .stats-grid { grid-template-columns: repeat(2, 1fr); }
+  h1 { font-size: 22px; }
+}
+
+
+/* логин батон*/
+.btn-login {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  width: 100%;
+  margin-top: 8px;
+  padding: 13px 28px;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font-family: 'DM Sans', sans-serif;
+  font-size: 15px;
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  color: #0a0a14;
+  background: linear-gradient(135deg, var(--accent) 0%, #38bdf8 100%);
+  box-shadow: 0 0 20px var(--accent-glow);
+  transition: var(--transition);
+}
+
+.btn-login:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 0 30px var(--accent-glow), 0 4px 20px rgba(0,0,0,0.3);
+  filter: brightness(1.08);
+}
+
+.btn-login:active {
+  transform: translateY(0);
+  filter: brightness(0.95);
+}
+
+.btn-login__text { position: relative; }
+
+.btn-login__arrow {
+  font-size: 16px;
+  display: inline-block;
+  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-li {
-    list-style: none;
-    margin-bottom: 5px;
-    margin-top: 5px;
+.btn-login:hover .btn-login__arrow {
+  transform: translateX(4px);
 }
diff --git a/templates/base.html b/templates/base.html
index 766e3f6..f7f7ac4 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -2,47 +2,82 @@
 <html lang="en">
 <head>
   {% load static %}
-  {% block title %}
-    <title>Task Manager</title>
-  {% endblock %}
+  {% block title %}<title>Task Manager</title>{% endblock %}
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="{% static 'css/styles.css' %}">
 </head>
 
 <body>
 
-<header>
-  <div class="header-left">
-    <a href="{% url 'manager:index' %}"><strong>Task Manager</strong></a>
-  </div>
+<nav class="navbar">
+  <a href="{% url 'manager:index' %}" class="nav-logo">
+    <span class="logo-icon">◈</span>
+    <span class="logo-text">Task Manager</span>
+  </a>
 
-  <div class="header-center">
+  <div class="nav-links">
     {% if user.is_authenticated %}
-      <a href="{% url 'manager:task-list' %}">Tasks</a>
-      <a href="{% url 'manager:worker-list' %}">Workers</a>
-      <a href="{% url 'manager:position-list' %}">Positions</a>
-      <a href="{% url 'manager:task-type-list' %}">Task Types</a>
+      <a href="{% url 'manager:task-list' %}" class="nav-link">
+        <span class="nav-icon">⊞</span> Tasks
+      </a>
+      <a href="{% url 'manager:worker-list' %}" class="nav-link">
+        <span class="nav-icon">◉</span> Workers
+      </a>
+      <a href="{% url 'manager:position-list' %}" class="nav-link">
+        <span class="nav-icon">⬡</span> Positions
+      </a>
+      <a href="{% url 'manager:task-type-list' %}" class="nav-link">
+        <span class="nav-icon">◈</span> Task Types
+      </a>
     {% endif %}
   </div>
 
-  <div class="header-right">
+  <div class="nav-actions">
     {% if user.is_authenticated %}
-      <form method="post" action="{% url 'manager:logout' %}">
+      <span class="nav-user">
+        <span class="user-avatar">{{ user.username|first|upper }}</span>
+        {{ user.username }}
+      </span>
+      <form method="post" action="{% url 'manager:logout' %}" style="display:inline;">
         {% csrf_token %}
-        <button type="submit">Logout</button>
+        <button type="submit" class="btn btn-ghost btn-sm">Sign out</button>
       </form>
     {% else %}
-      <a href="{% url 'manager:login' %}">Login</a>
-      <a href="{% url 'manager:register' %}">Register</a>
+      <a href="{% url 'manager:login' %}" class="btn btn-ghost btn-sm">Sign in</a>
+      <a href="{% url 'manager:register' %}" class="btn btn-primary btn-sm">Register</a>
     {% endif %}
   </div>
-</header>
+</nav>
+
+<main class="main-content">
+  <div class="content-card">
+    {% block content %}{% endblock %}
+  </div>
+</main>
 
-<div class="content-container">
-  {% block content %}
-  {% endblock %}
-</div>
+<script>
+  // Замена этой хуеты "--------" на choose position (не стал создавать отдельный js скрипт)
+  document.addEventListener('DOMContentLoaded', function() {
+    const labels = {
+      'id_position': 'Choose position',
+      'id_task_type': 'Choose task type',
+      'id_priority': 'Choose priority'
+    };
+    document.querySelectorAll('select').forEach(function(sel) {
+      const placeholder = labels[sel.id] || 'Choose option';
+      sel.querySelectorAll('option').forEach(function(opt) {
+        if (opt.value === '' || /^-+$/.test(opt.text.trim())) {
+          opt.text = placeholder;
+        }
+      });
+    });
+  });
+</script>
 
 </body>
-</html>
\ No newline at end of file
+</html>
+
diff --git a/templates/manager/index.html b/templates/manager/index.html
index 6c0846c..1534084 100644
--- a/templates/manager/index.html
+++ b/templates/manager/index.html
@@ -1,26 +1,42 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Home Page</title>
-{% endblock %}
+{% block title %}<title>Dashboard — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Home Page</h1>
-  <ul>
-    <li>
-      {{ num_workers }} Workers
-    </li>
-    <li>
-      {{ num_positions }} Positions
-    </li>
-    <li>
-      {{ num_tasks }} Tasks
-    </li>
-    <li>
-      {{ num_completed_tasks }} Completed tasks
-    </li>
-    <li>
-      {{ num_open_tasks }} Open tasks
-    </li>
-  </ul>
+  <div class="page-header">
+    <h1 class="page-title">Dashboard</h1>
+    <a href="{% url 'manager:task-create' %}" class="btn btn-primary">+ New Task</a>
+  </div>
+
+  <div class="stats-grid">
+    <div class="stat-card">
+      <div class="stat-number">{{ num_workers }}</div>
+      <div class="stat-label">Workers</div>
+    </div>
+    <div class="stat-card">
+      <div class="stat-number">{{ num_positions }}</div>
+      <div class="stat-label">Positions</div>
+    </div>
+    <div class="stat-card">
+      <div class="stat-number">{{ num_tasks }}</div>
+      <div class="stat-label">Total Tasks</div>
+    </div>
+    <div class="stat-card">
+      <div class="stat-number">{{ num_completed_tasks }}</div>
+      <div class="stat-label">Completed</div>
+    </div>
+    <div class="stat-card">
+      <div class="stat-number">{{ num_open_tasks }}</div>
+      <div class="stat-label">In Progress</div>
+    </div>
+  </div>
+
+  <hr class="divider">
+
+  <div class="btn-group">
+    <a href="{% url 'manager:task-list' %}" class="btn btn-ghost">⊞ View All Tasks</a>
+    <a href="{% url 'manager:worker-list' %}" class="btn btn-ghost">◉ View Workers</a>
+    <a href="{% url 'manager:position-list' %}" class="btn btn-ghost">⬡ Positions</a>
+    <a href="{% url 'manager:task-type-list' %}" class="btn btn-ghost">◈ Task Types</a>
+  </div>
 {% endblock %}
diff --git a/templates/manager/position_confirm_delete.html b/templates/manager/position_confirm_delete.html
index 1318e93..4ae0c3b 100644
--- a/templates/manager/position_confirm_delete.html
+++ b/templates/manager/position_confirm_delete.html
@@ -1,15 +1,21 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Delete Position</title>
-{% endblock %}
+{% block title %}<title>Delete Position — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Delete position: {{ position.name }}</h1>
-  <p>Are you sure you want to delete this position?</p>
+  <div class="page-header">
+    <h1 class="page-title">Delete Position</h1>
+  </div>
 
-  <form method="post">
-    {% csrf_token %}
-    <input type="submit" value="Delete">
-  </form>
+  <div class="danger-zone">
+    <h3 style="color:var(--danger); margin-bottom:10px;">⚠ Are you sure?</h3>
+    <p>You are about to permanently delete the position <strong style="color:var(--text-primary);">{{ position.name }}</strong>. Workers in this position will have their position set to "Not Defined".</p>
+    <form method="post">
+      {% csrf_token %}
+      <div class="btn-group">
+        <button type="submit" class="btn btn-danger">Delete Position</button>
+        <a href="{% url 'manager:position-list' %}" class="btn btn-ghost">Cancel</a>
+      </div>
+    </form>
+  </div>
 {% endblock %}
diff --git a/templates/manager/position_detail.html b/templates/manager/position_detail.html
index 73dd4f5..20fe044 100644
--- a/templates/manager/position_detail.html
+++ b/templates/manager/position_detail.html
@@ -1,24 +1,35 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Position Detail</title>
-{% endblock %}
+{% block title %}<title>{{ position.name }} — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>{{ position.name }}</h1>
-  <a href="{% url 'manager:position-update' pk=position.id %}">Update Position</a>
-  <br>
+  <div class="page-header">
+    <div>
+      <p style="font-size:12px;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:0.08em;">
+        <a href="{% url 'manager:position-list' %}">Positions</a> /
+      </p>
+      <h1 style="margin-bottom:0;">{{ position.name }}</h1>
+    </div>
+    <a href="{% url 'manager:position-update' pk=position.id %}" class="btn btn-ghost">✎ Edit</a>
+  </div>
+
   {% if position.workers.all %}
-    <ul>
+    <h3>Workers in this position</h3>
+    <ul class="item-list" style="margin-bottom:28px;">
       {% for worker in position.workers.all %}
         <li>
-          <a href="{{ worker.get_absolute_url }}">{{ worker.username }}</a>
+          <div style="display:flex;align-items:center;gap:10px;">
+            <span class="user-avatar" style="width:32px;height:32px;font-size:13px;">{{ worker.username|first|upper }}</span>
+            <a href="{{ worker.get_absolute_url }}" class="item-name">{{ worker.username }}</a>
+          </div>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    There are no employees in this position.
+    <p style="color:var(--text-muted);margin-bottom:28px;">No workers in this position yet.</p>
   {% endif %}
-  <br>
-  <a href="{% url 'manager:position-delete' pk=position.id %}">Delete this position</a>
+
+  <hr class="divider">
+  <a href="{% url 'manager:position-delete' pk=position.id %}" class="btn btn-danger">⊗ Delete Position</a>
 {% endblock %}
+
diff --git a/templates/manager/position_form.html b/templates/manager/position_form.html
index fab009a..97b6a8f 100644
--- a/templates/manager/position_form.html
+++ b/templates/manager/position_form.html
@@ -1,15 +1,18 @@
 {% extends "base.html" %}
 
-{% block title %}
-	<title>Position Form</title>
-{% endblock %}
+{% block title %}<title>{% if object %}Edit{% else %}New{% endif %} Position — TaskOS</title>{% endblock %}
 
 {% block content %}
-	<h1>{{ object|yesno:"Update,Create" }} {{ task.name }}</h1>
+  <div class="page-header">
+    <h1 class="page-title">{% if object %}✎ Edit Position{% else %}+ New Position{% endif %}</h1>
+  </div>
 
-  <form action="" method="post">
+  <form action="" method="post" style="max-width:480px;">
     {% csrf_token %}
     {{ form.as_p }}
-    <input type="submit" value="Submit">
+    <div class="btn-group" style="margin-top:8px;">
+      <input type="submit" value="{% if object %}Save Changes{% else %}Create Position{% endif %}">
+      <a href="{% url 'manager:position-list' %}" class="btn btn-ghost">Cancel</a>
+    </div>
   </form>
 {% endblock %}
diff --git a/templates/manager/position_list.html b/templates/manager/position_list.html
index 0e851aa..c3cce43 100644
--- a/templates/manager/position_list.html
+++ b/templates/manager/position_list.html
@@ -1,25 +1,34 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Position List</title>
-{% endblock %}
+{% block title %}<title>Positions — TaskOS</title>{% endblock %}
 
 {% block content %}
+  <div class="page-header">
+    <h1 class="page-title">⬡ Positions</h1>
+    <a href="{% url 'manager:position-create' %}" class="btn btn-primary">+ New Position</a>
+  </div>
+
   <form action="" method="get" class="filter-form">
-    {{ filter_form.q.label_tag }} {{ filter_form.q }}
-    <input type="submit" value="Filter">
+    <div class="filter-group">
+      {{ filter_form.q.label_tag }}
+      {{ filter_form.q }}
+    </div>
+    <input type="submit" value="Filter" style="align-self:flex-end;">
   </form>
 
-  <a href="{% url 'manager:position-create' %}">Create Position</a>
   {% if position_list %}
-    <ul>
+    <ul class="item-list">
       {% for position in position_list %}
         <li>
-          <a href="{% url 'manager:position-detail' pk=position.id %}">{{ position.name }}</a>
+          <a href="{% url 'manager:position-detail' pk=position.id %}" class="item-name">{{ position.name }}</a>
+          <span style="color:var(--text-muted);font-size:13px;">{{ position.workers.count }} worker{{ position.workers.count|pluralize }}</span>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    <h3>No positions found</h3>
+    <div class="empty-state">
+      <div class="empty-state-icon">⬡</div>
+      <p class="empty-state-text">No positions found. <a href="{% url 'manager:position-create' %}">Create one?</a></p>
+    </div>
   {% endif %}
 {% endblock %}
diff --git a/templates/manager/task_confirm_delete.html b/templates/manager/task_confirm_delete.html
index ff74e60..0cb03e3 100644
--- a/templates/manager/task_confirm_delete.html
+++ b/templates/manager/task_confirm_delete.html
@@ -1,15 +1,21 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Delete Task</title>
-{% endblock %}
+{% block title %}<title>Delete Task — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Delete task: {{ task.name }}</h1>
-  <p>Are you sure you want to delete this task?</p>
+  <div class="page-header">
+    <h1 class="page-title">Delete Task</h1>
+  </div>
 
-  <form action="" method="post">
-    {% csrf_token %}
-    <input type="submit" value="Delete">
-  </form>
+  <div class="danger-zone">
+    <h3 style="color:var(--danger); margin-bottom:10px;">⚠ Are you sure?</h3>
+    <p>You are about to permanently delete <strong style="color:var(--text-primary);">{{ task.name }}</strong>. This action cannot be undone.</p>
+    <form action="" method="post">
+      {% csrf_token %}
+      <div class="btn-group">
+        <button type="submit" class="btn btn-danger">Delete Task</button>
+        <a href="{% url 'manager:task-list' %}" class="btn btn-ghost">Cancel</a>
+      </div>
+    </form>
+  </div>
 {% endblock %}
diff --git a/templates/manager/task_detail.html b/templates/manager/task_detail.html
index c0f55ad..9c2f220 100644
--- a/templates/manager/task_detail.html
+++ b/templates/manager/task_detail.html
@@ -1,38 +1,75 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task Detail</title>
-{% endblock %}
+{% block title %}<title>{{ task.name }} — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h2>
-    {{ task.name }} (
-    {% if task.is_completed %}
-      Done
-    {% else %}
-      In process
-    {% endif %})
-  </h2>
-  <p>Priority: {{ task.priority }}</p>
-  <p>Deadline: {{ task.deadline }}</p>
-  <p>Description: {{ task.description }}</p>
-  <p>
-    Task type:
-    <a href="{{ task.task_type.get_absolute_url }}">{{ task.task_type }}</a>
-  </p>
-  {% if task.assignees %}
-    Workers:
-    <ul>
+  <div class="page-header">
+    <div>
+      <p style="font-size:12px; color:var(--text-muted); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.08em;">
+        <a href="{% url 'manager:task-list' %}">Tasks</a> /
+      </p>
+      <h1 style="margin-bottom:0;">{{ task.name }}</h1>
+    </div>
+    <div class="btn-group">
+      {% if task.is_completed %}
+        <span class="badge badge-done" style="font-size:13px; padding:5px 14px;">✓ Done</span>
+      {% else %}
+        <span class="badge badge-open" style="font-size:13px; padding:5px 14px;">In Progress</span>
+      {% endif %}
+    </div>
+  </div>
+
+  <div class="detail-grid">
+    <div class="detail-field">
+      <div class="detail-label">Priority</div>
+      <div class="detail-value">
+        {% if task.priority == "URGENT" %}<span class="badge badge-urgent">Urgent</span>
+        {% elif task.priority == "HIGH" %}<span class="badge badge-high">High</span>
+        {% elif task.priority == "MEDIUM" %}<span class="badge badge-medium">Medium</span>
+        {% else %}<span class="badge badge-low">Low</span>{% endif %}
+      </div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">Deadline</div>
+      <div class="detail-value">{{ task.deadline }}</div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">Task Type</div>
+      <div class="detail-value">
+        <a href="{{ task.task_type.get_absolute_url }}">{{ task.task_type }}</a>
+      </div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">Status</div>
+      <div class="detail-value">{{ task.is_completed|yesno:"Completed,In Progress" }}</div>
+    </div>
+    <div class="detail-field full-width">
+      <div class="detail-label">Description</div>
+      <div class="detail-value" style="white-space:pre-wrap; font-size:14px; line-height:1.7;">{{ task.description }}</div>
+    </div>
+  </div>
+
+  {% if task.assignees.all %}
+    <h3>Assigned Workers</h3>
+    <ul class="item-list" style="margin-bottom:28px;">
       {% for assignee in task.assignees.all %}
         <li>
-          <a href="{{ assignee.get_absolute_url }}">{{ assignee.username }}</a>
+          <div style="display:flex;align-items:center;gap:10px;">
+            <span class="user-avatar" style="width:32px;height:32px;font-size:13px;">{{ assignee.username|first|upper }}</span>
+            <a href="{{ assignee.get_absolute_url }}" class="item-name">{{ assignee.username }}</a>
+          </div>
+          <span style="color:var(--text-muted);font-size:13px;">{{ assignee.position }}</span>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    Nobody is doing this task
+    <p style="color:var(--text-muted); margin-bottom:28px;">Nobody assigned to this task yet.</p>
   {% endif %}
-  <a href="{% url 'manager:task-update' pk=task.id %}">Update this Task</a>
-  <br>
-  <a href="{% url 'manager:task-delete' pk=task.id %}">Delete this Task</a>
+
+  <hr class="divider">
+
+  <div class="btn-group">
+    <a href="{% url 'manager:task-update' pk=task.id %}" class="btn btn-ghost">✎ Edit Task</a>
+    <a href="{% url 'manager:task-delete' pk=task.id %}" class="btn btn-danger">⊗ Delete</a>
+  </div>
 {% endblock %}
diff --git a/templates/manager/task_form.html b/templates/manager/task_form.html
index 34d7dba..fd48e1d 100644
--- a/templates/manager/task_form.html
+++ b/templates/manager/task_form.html
@@ -1,15 +1,25 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task Form</title>
-{% endblock %}
+{% block title %}<title>{% if object %}Edit{% else %}New{% endif %} Task — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>{{ object|yesno:"Update,Create" }} {{ position.name }}</h1>
+  <div class="page-header">
+    <h1 class="page-title">{% if object %}✎ Edit Task{% else %}+ New Task{% endif %}</h1>
+  </div>
 
   <form action="" method="post">
     {% csrf_token %}
+    {% if form.non_field_errors %}
+      <ul class="errorlist">
+        {% for error in form.non_field_errors %}
+          <li>{{ error }}</li>
+        {% endfor %}
+      </ul>
+    {% endif %}
     {{ form.as_p }}
-    <input type="submit" value="Submit">
+    <div class="btn-group" style="margin-top:8px;">
+      <input type="submit" value="{% if object %}Save Changes{% else %}Create Task{% endif %}">
+      <a href="{% url 'manager:task-list' %}" class="btn btn-ghost">Cancel</a>
+    </div>
   </form>
 {% endblock %}
diff --git a/templates/manager/task_list.html b/templates/manager/task_list.html
index 8993585..25b08fb 100644
--- a/templates/manager/task_list.html
+++ b/templates/manager/task_list.html
@@ -1,28 +1,59 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task List</title>
-{% endblock %}
+{% block title %}<title>Tasks — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Tasks</h1>
+  <div class="page-header">
+    <h1 class="page-title">⊞ Tasks</h1>
+    <a href="{% url 'manager:task-create' %}" class="btn btn-primary">+ New Task</a>
+  </div>
 
-  <form method="get">
-    {{ filter_form.q.label_tag }} {{ filter_form.q }}
-    {{ filter_form.is_completed.label_tag }} {{ filter_form.is_completed }}
-    {{ filter_form.priority.label_tag }} {{ filter_form.priority }}
-    {{ filter_form.task_type.label_tag }} {{ filter_form.task_type }}
-    <button type="submit">Filter</button>
+  <form method="get" class="filter-form">
+    <div class="filter-group">
+      {{ filter_form.q.label_tag }}
+      {{ filter_form.q }}
+    </div>
+    <div class="filter-group">
+      {{ filter_form.is_completed.label_tag }}
+      {{ filter_form.is_completed }}
+    </div>
+    <div class="filter-group">
+      {{ filter_form.priority.label_tag }}
+      {{ filter_form.priority }}
+    </div>
+    <div class="filter-group">
+      {{ filter_form.task_type.label_tag }}
+      {{ filter_form.task_type }}
+    </div>
+    <button type="submit" class="btn btn-ghost btn-sm">Filter</button>
   </form>
-  <a href="{% url 'manager:task-create' %}">Create new Task</a>
-  <ul>
+
+  <ul class="item-list">
     {% for task in tasks %}
       <li>
-        <a href="{{ task.get_absolute_url }}">{{ task.name }}</a>
-        - {{ task.priority }} - {{ task.is_completed|yesno:"Done,Open" }}
+        <a href="{{ task.get_absolute_url }}" class="item-name">{{ task.name }}</a>
+        <div class="item-meta">
+          {% if task.priority == "URGENT" %}
+            <span class="badge badge-urgent">Urgent</span>
+          {% elif task.priority == "HIGH" %}
+            <span class="badge badge-high">High</span>
+          {% elif task.priority == "MEDIUM" %}
+            <span class="badge badge-medium">Medium</span>
+          {% else %}
+            <span class="badge badge-low">Low</span>
+          {% endif %}
+          {% if task.is_completed %}
+            <span class="badge badge-done">Done</span>
+          {% else %}
+            <span class="badge badge-open">Open</span>
+          {% endif %}
+        </div>
       </li>
     {% empty %}
-      <li>No tasks found.</li>
+      <div class="empty-state">
+        <div class="empty-state-icon">⊞</div>
+        <p class="empty-state-text">No tasks found. <a href="{% url 'manager:task-create' %}">Create one?</a></p>
+      </div>
     {% endfor %}
   </ul>
 {% endblock %}
diff --git a/templates/manager/task_type_confirm_delete.html b/templates/manager/task_type_confirm_delete.html
index 2d44f48..a169a01 100644
--- a/templates/manager/task_type_confirm_delete.html
+++ b/templates/manager/task_type_confirm_delete.html
@@ -1,15 +1,21 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Delete Task Type</title>
-{% endblock %}
+{% block title %}<title>Delete Task Type — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Delete task type: {{ task_type.name }}</h1>
-  <p>Are you sure you want to delete this task type?</p>
+  <div class="page-header">
+    <h1 class="page-title">Delete Task Type</h1>
+  </div>
 
-  <form action="" method="post">
-    {% csrf_token %}
-    <input type="submit" value="Delete">
-  </form>
-{% endblock %}
\ No newline at end of file
+  <div class="danger-zone">
+    <h3 style="color:var(--danger); margin-bottom:10px;">⚠ Are you sure?</h3>
+    <p>You are about to permanently delete the task type <strong style="color:var(--text-primary);">{{ task_type.name }}</strong>. All tasks of this type will also be deleted.</p>
+    <form method="post">
+      {% csrf_token %}
+      <div class="btn-group">
+        <button type="submit" class="btn btn-danger">Delete Task Type</button>
+        <a href="{% url 'manager:task-type-list' %}" class="btn btn-ghost">Cancel</a>
+      </div>
+    </form>
+  </div>
+{% endblock %}
diff --git a/templates/manager/task_type_detail.html b/templates/manager/task_type_detail.html
index d5b85ca..881af9a 100644
--- a/templates/manager/task_type_detail.html
+++ b/templates/manager/task_type_detail.html
@@ -1,25 +1,38 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task Type Detail</title>
-{% endblock %}
+{% block title %}<title>{{ task_type.name }} — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>{{ task_type.name }}</h1>
-  <a href="{% url 'manager:task-type-update' pk=task_type.id %}">Update Task Type</a>
-  <br>
+  <div class="page-header">
+    <div>
+      <p style="font-size:12px;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:0.08em;">
+        <a href="{% url 'manager:task-type-list' %}">Task Types</a> /
+      </p>
+      <h1 style="margin-bottom:0;">{{ task_type.name }}</h1>
+    </div>
+    <a href="{% url 'manager:task-type-update' pk=task_type.id %}" class="btn btn-ghost">✎ Edit</a>
+  </div>
+
   {% if task_type.tasks.all %}
-    <h3>All task with this type:</h3>
-    <ul>
+    <h3>Tasks of this type</h3>
+    <ul class="item-list" style="margin-bottom:28px;">
       {% for task in task_type.tasks.all %}
         <li>
-          <a href="{{ task.get_absolute_url }}">{{ task.name }}</a>
+          <a href="{{ task.get_absolute_url }}" class="item-name">{{ task.name }}</a>
+          <div class="item-meta">
+            {% if task.is_completed %}
+              <span class="badge badge-done">Done</span>
+            {% else %}
+              <span class="badge badge-open">Open</span>
+            {% endif %}
+          </div>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    There are no tasks of this type
+    <p style="color:var(--text-muted);margin-bottom:28px;">No tasks of this type yet.</p>
   {% endif %}
-  <br>
-  <a href="{% url 'manager:task-type-delete' pk=task_type.id %}">Delete this Task Type</a>
+
+  <hr class="divider">
+  <a href="{% url 'manager:task-type-delete' pk=task_type.id %}" class="btn btn-danger">⊗ Delete Task Type</a>
 {% endblock %}
diff --git a/templates/manager/task_type_form.html b/templates/manager/task_type_form.html
index 79ddea0..d67c237 100644
--- a/templates/manager/task_type_form.html
+++ b/templates/manager/task_type_form.html
@@ -1,15 +1,18 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task Type Form</title>
-{% endblock %}
+{% block title %}<title>{% if object %}Edit{% else %}New{% endif %} Task Type — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>{{ object|yesno:"Update,Create" }} task type {{ object.name }}</h1>
+  <div class="page-header">
+    <h1 class="page-title">{% if object %}✎ Edit Task Type{% else %}+ New Task Type{% endif %}</h1>
+  </div>
 
-  <form action="" method="post">
+  <form action="" method="post" style="max-width:480px;">
     {% csrf_token %}
     {{ form.as_p }}
-    <input type="submit" value="Submit">
+    <div class="btn-group" style="margin-top:8px;">
+      <input type="submit" value="{% if object %}Save Changes{% else %}Create Type{% endif %}">
+      <a href="{% url 'manager:task-type-list' %}" class="btn btn-ghost">Cancel</a>
+    </div>
   </form>
 {% endblock %}
diff --git a/templates/manager/task_type_list.html b/templates/manager/task_type_list.html
index 71662f4..17408b2 100644
--- a/templates/manager/task_type_list.html
+++ b/templates/manager/task_type_list.html
@@ -1,26 +1,34 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Task Type List</title>
-{% endblock %}
+{% block title %}<title>Task Types — TaskOS</title>{% endblock %}
 
 {% block content %}
+  <div class="page-header">
+    <h1 class="page-title">◈ Task Types</h1>
+    <a href="{% url 'manager:task-type-create' %}" class="btn btn-primary">+ New Type</a>
+  </div>
+
   <form action="" method="get" class="filter-form">
-    {{ filter_form.q.label_tag }} {{ filter_form.q }}
-    <input type="submit" value="Filter">
+    <div class="filter-group">
+      {{ filter_form.q.label_tag }}
+      {{ filter_form.q }}
+    </div>
+    <input type="submit" value="Filter" style="align-self:flex-end;">
   </form>
 
-  <a href="{% url 'manager:task-type-create' %}">Create Task Type</a>
   {% if task_type_list %}
-    <ul>
+    <ul class="item-list">
       {% for task_type in task_type_list %}
         <li>
-          <a href="{% url 'manager:task-type-detail' pk=task_type.id %}">{{ task_type.name }}</a>
-          ({{ task_type.tasks.count }})
+          <a href="{% url 'manager:task-type-detail' pk=task_type.id %}" class="item-name">{{ task_type.name }}</a>
+          <span style="color:var(--text-muted);font-size:13px;">{{ task_type.tasks.count }} task{{ task_type.tasks.count|pluralize }}</span>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    <h3>No task type found</h3>
+    <div class="empty-state">
+      <div class="empty-state-icon">◈</div>
+      <p class="empty-state-text">No task types found. <a href="{% url 'manager:task-type-create' %}">Create one?</a></p>
+    </div>
   {% endif %}
 {% endblock %}
diff --git a/templates/manager/worker_detail.html b/templates/manager/worker_detail.html
index 1f5e50c..732e38c 100644
--- a/templates/manager/worker_detail.html
+++ b/templates/manager/worker_detail.html
@@ -1,27 +1,60 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Worker Detail</title>
-{% endblock %}
+{% block title %}<title>{{ worker.username }} — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h3>{{ worker.username }}</h3>
-  <p>
-    Position:
-    <a href="{{ worker.position.get_absolute_url }}">{{ worker.position }}</a>
-  </p>
-  <p>Full name: {{ worker.first_name }} {{ worker.last_name }}</p>
-  <p>Email: {{ worker.email }}</p>
+  <div class="page-header">
+    <div style="display:flex;align-items:center;gap:16px;">
+      <span class="user-avatar" style="width:52px;height:52px;font-size:20px;border-radius:14px;">{{ worker.username|first|upper }}</span>
+      <div>
+        <p style="font-size:12px;color:var(--text-muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:0.08em;">Worker</p>
+        <h1 style="margin-bottom:0;">{{ worker.username }}</h1>
+      </div>
+    </div>
+  </div>
+
+  <div class="detail-grid">
+    <div class="detail-field">
+      <div class="detail-label">Position</div>
+      <div class="detail-value">
+        {% if worker.position %}
+          <a href="{{ worker.position.get_absolute_url }}">{{ worker.position }}</a>
+        {% else %}
+          <span style="color:var(--text-muted);">Not assigned</span>
+        {% endif %}
+      </div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">Email</div>
+      <div class="detail-value">{{ worker.email|default:"—" }}</div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">First Name</div>
+      <div class="detail-value">{{ worker.first_name|default:"—" }}</div>
+    </div>
+    <div class="detail-field">
+      <div class="detail-label">Last Name</div>
+      <div class="detail-value">{{ worker.last_name|default:"—" }}</div>
+    </div>
+  </div>
+
   {% if worker.tasks.all %}
-    Working on the following tasks:
-    <ul>
+    <h3>Active Tasks</h3>
+    <ul class="item-list">
       {% for task in worker.tasks.all %}
         <li>
-          <a href="{{ task.get_absolute_url }}">{{ task.name }}</a>
+          <a href="{{ task.get_absolute_url }}" class="item-name">{{ task.name }}</a>
+          <div class="item-meta">
+            {% if task.is_completed %}
+              <span class="badge badge-done">Done</span>
+            {% else %}
+              <span class="badge badge-open">Open</span>
+            {% endif %}
+          </div>
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    There are no active tasks
+    <p style="color:var(--text-muted);">No active tasks assigned.</p>
   {% endif %}
 {% endblock %}
diff --git a/templates/manager/worker_form.html b/templates/manager/worker_form.html
index b7a0ebe..96bdab5 100644
--- a/templates/manager/worker_form.html
+++ b/templates/manager/worker_form.html
@@ -1,15 +1,30 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Registration</title>
-{% endblock %}
+{% block title %}<title>Registration — TaskOS</title>{% endblock %}
 
 {% block content %}
-  <h1>Registration</h1>
+<div class="auth-wrapper">
+  <div class="auth-header">
+    <div class="auth-icon">◉</div>
+    <h1 class="auth-title">Create account</h1>
+    <p class="auth-subtitle">Join your team on TaskOS</p>
+  </div>
 
   <form action="" method="post">
     {% csrf_token %}
+    {% if form.non_field_errors %}
+      <ul class="errorlist">
+        {% for error in form.non_field_errors %}
+          <li>{{ error }}</li>
+        {% endfor %}
+      </ul>
+    {% endif %}
     {{ form.as_p }}
-    <input type="submit" value="Register">
+    <input type="submit" value="Create Account" style="width:100%; margin-top:8px;">
   </form>
+
+  <p class="auth-footer">
+    Already have an account? <a href="{% url 'manager:login' %}">Sign in</a>
+  </p>
+</div>
 {% endblock %}
diff --git a/templates/manager/worker_list.html b/templates/manager/worker_list.html
index 7f49b0f..04e8066 100644
--- a/templates/manager/worker_list.html
+++ b/templates/manager/worker_list.html
@@ -1,28 +1,49 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Worker List</title>
-{% endblock %}
+{% block title %}<title>Workers</title>{% endblock %}
 
 {% block content %}
+  <div class="page-header">
+    <h1 class="page-title">◉ Workers</h1>
+  </div>
+
   <form action="" method="get" class="filter-form">
-    {{ filter_form.q.label_tag }} {{ filter_form.q }}
-    {{ filter_form.position.label_tag }} {{ filter_form.position }}
-    <input type="submit" value="Filter">
+    <div class="filter-group">
+      {{ filter_form.q.label_tag }}
+      {{ filter_form.q }}
+    </div>
+    <div class="filter-group">
+      {{ filter_form.position.label_tag }}
+      {{ filter_form.position }}
+    </div>
+    <input type="submit" value="Filter" style="align-self:flex-end;">
   </form>
 
   {% if worker_list %}
-    <ul>
+    <ul class="item-list">
       {% for worker in worker_list %}
         <li>
-          <a href="{% url 'manager:worker-detail' pk=worker.id %}">
-            {{ worker.username }}
-          </a>
-         - {{ worker.position }}
+          <div style="display:flex;align-items:center;gap:12px;">
+            <span class="user-avatar">{{ worker.username|first|upper }}</span>
+            <div>
+              <a href="{% url 'manager:worker-detail' pk=worker.id %}" class="item-name" style="display:block;">
+                {{ worker.username }}
+              </a>
+              {% if worker.first_name or worker.last_name %}
+                <span style="font-size:12px;color:var(--text-muted);">{{ worker.first_name }} {{ worker.last_name }}</span>
+              {% endif %}
+            </div>
+          </div>
+          {% if worker.position %}
+            <span style="color:var(--text-secondary);font-size:13px;font-weight:500;">{{ worker.position.name }}</span>
+          {% endif %}
         </li>
       {% endfor %}
     </ul>
   {% else %}
-    <h3>No workers found</h3>
+    <div class="empty-state">
+      <div class="empty-state-icon">◉</div>
+      <p class="empty-state-text">No workers found.</p>
+    </div>
   {% endif %}
 {% endblock %}
diff --git a/templates/registration/login.html b/templates/registration/login.html
index 5e86b52..e88f2f8 100644
--- a/templates/registration/login.html
+++ b/templates/registration/login.html
@@ -1,15 +1,33 @@
 {% extends "base.html" %}
 
-{% block title %}
-  <title>Login</title>
-{% endblock %}
+{% block title %}<title>Sign In</title>{% endblock %}
 
 {% block content %}
-  <h2>Login</h2>
+<div class="auth-wrapper">
+  <div class="auth-header">
+    <div class="auth-icon">◈</div>
+    <h1 class="auth-title">Welcome back</h1>
+    <p class="auth-subtitle">Sign in to your TaskOS account</p>
+  </div>
 
   <form method="post">
     {% csrf_token %}
+    {% if form.non_field_errors %}
+      <ul class="errorlist">
+        {% for error in form.non_field_errors %}
+          <li>{{ error }}</li>
+        {% endfor %}
+      </ul>
+    {% endif %}
     {{ form.as_p }}
-    <button type="submit">Login</button>
+    <button type="submit" class="btn-login">
+      <span class="btn-login__text">Sign In</span>
+      <span class="btn-login__arrow">→</span>
+    </button>
   </form>
-{% endblock %}
+
+  <p class="auth-footer">
+    Don't have an account? <a href="{% url 'manager:register' %}">Register here</a>
+  </p>
+</div>
+{% endblock %}
\ No newline at end of file