diff --git a/src/main/resources/styles.inc b/src/main/resources/styles.inc
new file mode 100644
index 0000000..2362fba
--- /dev/null
+++ b/src/main/resources/styles.inc
@@ -0,0 +1,257 @@
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+            background: #1a1a1a;
+            color: #ffffff;
+            line-height: 1.6;
+        }
+
+        .container {
+            max-width: 800px;
+            margin: 0 auto;
+            background: #282c37;
+            min-height: 100vh;
+        }
+
+        .header {
+            position: relative;
+            height: 200px;
+            background: linear-gradient(45deg, #6364ff, #563acc);
+            overflow: hidden;
+        }
+
+        .banner {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+        }
+
+        .profile-section {
+            position: relative;
+            padding: 0 20px 20px;
+            background: #282c37;
+        }
+
+        .profile-avatar {
+            width: 80px;
+            height: 80px;
+            border-radius: 50%;
+            border: 4px solid #282c37;
+            margin-top: -40px;
+            background: #fff;
+        }
+
+        .profile-info {
+            margin-top: 15px;
+        }
+
+        .display-name {
+            font-size: 20px;
+            font-weight: bold;
+            margin-bottom: 5px;
+        }
+
+        .username {
+            color: #9baec8;
+            margin-bottom: 10px;
+        }
+
+        .username a {
+            color: #9baec8;
+            text-decoration: none;
+        }
+
+        .bio {
+            margin-bottom: 15px;
+            line-height: 1.5;
+        }
+
+        .stats {
+            display: flex;
+            gap: 20px;
+            font-size: 14px;
+            color: #9baec8;
+        }
+
+        .controls {
+            padding: 20px;
+            background: #313543;
+            border-bottom: 1px solid #393f4f;
+        }
+
+        .checkbox-group {
+            display: flex;
+            gap: 20px;
+            align-items: center;
+        }
+
+        .checkbox-group label {
+            display: flex;
+            align-items: center;
+            gap: 8px;
+            cursor: pointer;
+            color: #9baec8;
+        }
+
+        .checkbox-group input[type="checkbox"] {
+            accent-color: #6364ff;
+        }
+
+        .posts {
+            background: #282c37;
+        }
+
+        .post {
+            border-bottom: 1px solid #393f4f;
+            padding: 15px 20px;
+        }
+
+        .post-header {
+            display: flex;
+            align-items: center;
+            gap: 10px;
+            margin-bottom: 10px;
+        }
+
+        .post-avatar {
+            width: 40px;
+            height: 40px;
+            border-radius: 50%;
+        }
+
+        .post-user {
+            flex: 1;
+        }
+
+        .post-display-name {
+            font-weight: bold;
+            font-size: 14px;
+        }
+
+        .post-username {
+            color: #9baec8;
+            font-size: 13px;
+        }
+
+        .post-username a {
+            color: #9baec8;
+            font-size: 13px;
+            text-decoration: none;
+        }
+
+        .post-date {
+            color: #9baec8;
+            font-size: 13px;
+        }
+
+        .post-date a {
+            color: #9baec8;
+            font-size: 13px;
+            text-decoration: none;
+        }
+
+        .post-content {
+            margin-bottom: 10px;
+        }
+
+        .post-content p {
+            margin-bottom: 10px;
+        }
+
+        .post-content a {
+            color: #6364ff;
+            text-decoration: none;
+        }
+
+        .post-content a:hover {
+            text-decoration: underline;
+        }
+
+        .hashtag {
+            color: #00d4aa;
+        }
+
+        .mention {
+            color: #6364ff;
+        }
+
+        .post-media {
+            margin-top: 10px;
+        }
+
+        .media-grid {
+            display: grid;
+            gap: 4px;
+            border-radius: 8px;
+            overflow: hidden;
+        }
+
+        .media-grid.single {
+            grid-template-columns: 1fr;
+        }
+
+        .media-grid.double {
+            grid-template-columns: 1fr 1fr;
+        }
+
+        .media-grid.multiple {
+            grid-template-columns: 1fr 1fr;
+            grid-template-rows: 1fr 1fr;
+        }
+
+        .media-item {
+            position: relative;
+            background: #000;
+        }
+
+        .media-item img {
+            width: 100%;
+            height: 240px;
+            object-fit: cover;
+            cursor: pointer;
+        }
+
+        .post-stats {
+            display: flex;
+            gap: 15px;
+            margin-top: 10px;
+            color: #9baec8;
+            font-size: 13px;
+        }
+
+        .boost-indicator {
+            color: #00d4aa;
+            font-size: 13px;
+            margin-bottom: 10px;
+        }
+
+        .loading {
+            text-align: center;
+            padding: 40px;
+            color: #9baec8;
+        }
+
+        .error {
+            text-align: center;
+            padding: 40px;
+            color: #ff5050;
+        }
+
+        .refresh-btn {
+            background: #6364ff;
+            color: white;
+            border: none;
+            padding: 8px 16px;
+            border-radius: 20px;
+            cursor: pointer;
+            font-size: 14px;
+        }
+
+        .refresh-btn:hover {
+            background: #5a5bef;
+        }
diff --git a/src/main/resources/templates/profil.vm b/src/main/resources/templates/profil.vm
index 22f24ba..b206b27 100644
--- a/src/main/resources/templates/profil.vm
+++ b/src/main/resources/templates/profil.vm
@@ -5,263 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>$page.displayName - $page.username</title>
     <style>
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-        }
-
-        body {
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-            background: #1a1a1a;
-            color: #ffffff;
-            line-height: 1.6;
-        }
-
-        .container {
-            max-width: 800px;
-            margin: 0 auto;
-            background: #282c37;
-            min-height: 100vh;
-        }
-
-        .header {
-            position: relative;
-            height: 200px;
-            background: linear-gradient(45deg, #6364ff, #563acc);
-            overflow: hidden;
-        }
-
-        .banner {
-            width: 100%;
-            height: 100%;
-            object-fit: cover;
-        }
-
-        .profile-section {
-            position: relative;
-            padding: 0 20px 20px;
-            background: #282c37;
-        }
-
-        .profile-avatar {
-            width: 80px;
-            height: 80px;
-            border-radius: 50%;
-            border: 4px solid #282c37;
-            margin-top: -40px;
-            background: #fff;
-        }
-
-        .profile-info {
-            margin-top: 15px;
-        }
-
-        .display-name {
-            font-size: 20px;
-            font-weight: bold;
-            margin-bottom: 5px;
-        }
-
-        .username {
-            color: #9baec8;
-            margin-bottom: 10px;
-        }
-
-        .username a {
-            color: #9baec8;
-            text-decoration: none;
-        }
-
-        .bio {
-            margin-bottom: 15px;
-            line-height: 1.5;
-        }
-
-        .stats {
-            display: flex;
-            gap: 20px;
-            font-size: 14px;
-            color: #9baec8;
-        }
-
-        .controls {
-            padding: 20px;
-            background: #313543;
-            border-bottom: 1px solid #393f4f;
-        }
-
-        .checkbox-group {
-            display: flex;
-            gap: 20px;
-            align-items: center;
-        }
-
-        .checkbox-group label {
-            display: flex;
-            align-items: center;
-            gap: 8px;
-            cursor: pointer;
-            color: #9baec8;
-        }
-
-        .checkbox-group input[type="checkbox"] {
-            accent-color: #6364ff;
-        }
-
-        .posts {
-            background: #282c37;
-        }
-
-        .post {
-            border-bottom: 1px solid #393f4f;
-            padding: 15px 20px;
-        }
-
-        .post-header {
-            display: flex;
-            align-items: center;
-            gap: 10px;
-            margin-bottom: 10px;
-        }
-
-        .post-avatar {
-            width: 40px;
-            height: 40px;
-            border-radius: 50%;
-        }
-
-        .post-user {
-            flex: 1;
-        }
-
-        .post-display-name {
-            font-weight: bold;
-            font-size: 14px;
-        }
-
-        .post-username {
-            color: #9baec8;
-            font-size: 13px;
-        }
-
-        .post-username a {
-            color: #9baec8;
-            font-size: 13px;
-            text-decoration: none;
-        }
-
-        .post-date {
-            color: #9baec8;
-            font-size: 13px;
-        }
-
-        .post-date a {
-            color: #9baec8;
-            font-size: 13px;
-            text-decoration: none;
-        }
-
-        .post-content {
-            margin-bottom: 10px;
-        }
-
-        .post-content p {
-            margin-bottom: 10px;
-        }
-
-        .post-content a {
-            color: #6364ff;
-            text-decoration: none;
-        }
-
-        .post-content a:hover {
-            text-decoration: underline;
-        }
-
-        .hashtag {
-            color: #00d4aa;
-        }
-
-        .mention {
-            color: #6364ff;
-        }
-
-        .post-media {
-            margin-top: 10px;
-        }
-
-        .media-grid {
-            display: grid;
-            gap: 4px;
-            border-radius: 8px;
-            overflow: hidden;
-        }
-
-        .media-grid.single {
-            grid-template-columns: 1fr;
-        }
-
-        .media-grid.double {
-            grid-template-columns: 1fr 1fr;
-        }
-
-        .media-grid.multiple {
-            grid-template-columns: 1fr 1fr;
-            grid-template-rows: 1fr 1fr;
-        }
-
-        .media-item {
-            position: relative;
-            background: #000;
-        }
-
-        .media-item img {
-            width: 100%;
-            height: 240px;
-            object-fit: cover;
-            cursor: pointer;
-        }
-
-        .post-stats {
-            display: flex;
-            gap: 15px;
-            margin-top: 10px;
-            color: #9baec8;
-            font-size: 13px;
-        }
-
-        .boost-indicator {
-            color: #00d4aa;
-            font-size: 13px;
-            margin-bottom: 10px;
-        }
-
-        .loading {
-            text-align: center;
-            padding: 40px;
-            color: #9baec8;
-        }
-
-        .error {
-            text-align: center;
-            padding: 40px;
-            color: #ff5050;
-        }
-
-        .refresh-btn {
-            background: #6364ff;
-            color: white;
-            border: none;
-            padding: 8px 16px;
-            border-radius: 20px;
-            cursor: pointer;
-            font-size: 14px;
-        }
-
-        .refresh-btn:hover {
-            background: #5a5bef;
-        }
+#include( "styles.inc" )
     </style>
 </head>
 <body>