Update app.py

app.py

@@ -11,7 +11,7 @@ import random
 
 app = Flask(__name__)
 app.secret_key = 'supersecretkey'  # Замените на безопасный ключ в продакшене
-DATA_FILE = 'data_ostenhost.json'
+DATA_FILE = 'datatest.json'
 REPO_ID = "Eluza133/w1f9"
 HF_TOKEN_WRITE = os.getenv("HF_TOKEN")  # Токен с правами записи
 HF_TOKEN_READ = os.getenv("HF_TOKEN_READ") or HF_TOKEN_WRITE
@@ -85,26 +85,27 @@ def periodic_backup():
         upload_db_to_hf()
         time.sleep(15)
 
-# Общий стиль и базовый шаблон
+# Обновленный базовый стиль
 BASE_STYLE = '''
     :root {
         --primary: #6b48ff;
         --secondary: #ff4785;
         --background-light: #f5f7ff;
         --background-dark: #1a1a2e;
-        --card-bg-light: rgba(255, 255, 255, 0.9);
-        --card-bg-dark: rgba(40, 40, 60, 0.9);
+        --card-bg-light: rgba(255, 255, 255, 0.95);
+        --card-bg-dark: rgba(40, 40, 60, 0.95);
         --text-light: #1a1a2e;
         --text-dark: #e0e0e0;
-        --shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
-        --glass-bg: rgba(255, 255, 255, 0.1);
-        --transition: all 0.3s ease;
+        --shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
+        --glass-bg: rgba(255, 255, 255, 0.15);
+        --transition: all 0.4s ease;
     }
     * { margin: 0; padding: 0; box-sizing: border-box; }
     body {
         font-family: 'Inter', sans-serif;
         background: var(--background-light);
         color: var(--text-light);
+        line-height: 1.6;
         transition: var(--transition);
         overflow-x: hidden;
     }
@@ -116,24 +117,20 @@ BASE_STYLE = '''
         position: fixed;
         top: 0;
         left: 0;
-        width: 280px;
+        width: 300px;
         height: 100%;
         background: var(--glass-bg);
-        backdrop-filter: blur(15px);
-        padding: 20px;
+        backdrop-filter: blur(20px);
+        padding: 30px;
         box-shadow: var(--shadow);
         z-index: 1000;
-        transform: translateX(0);
         transition: var(--transition);
     }
     .sidebar-header {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-bottom: 30px;
+        margin-bottom: 40px;
     }
     .nav-brand {
-        font-size: 1.8em;
+        font-size: 2em;
         font-weight: 700;
         background: linear-gradient(45deg, var(--primary), var(--secondary));
         -webkit-background-clip: text;
@@ -142,17 +139,18 @@ BASE_STYLE = '''
     .nav-links {
         display: flex;
         flex-direction: column;
-        gap: 15px;
+        gap: 20px;
     }
     .nav-link {
         display: flex;
         align-items: center;
-        gap: 10px;
-        padding: 15px;
+        gap: 15px;
+        padding: 18px;
         background: var(--card-bg-light);
         color: var(--text-light);
         text-decoration: none;
-        border-radius: 12px;
+        border-radius: 15px;
+        font-size: 1.1em;
         transition: var(--transition);
     }
     body.dark .nav-link {
@@ -160,7 +158,7 @@ BASE_STYLE = '''
         color: var(--text-dark);
     }
     .nav-link:hover {
-        transform: translateX(10px);
+        transform: translateX(15px);
         background: var(--primary);
         color: white;
     }
@@ -173,46 +171,50 @@ BASE_STYLE = '''
     }
     .menu-btn {
         display: none;
-        font-size: 28px;
+        font-size: 32px;
         background: var(--glass-bg);
         border: none;
         color: var(--primary);
         cursor: pointer;
         position: fixed;
-        top: 15px;
-        left: 15px;
+        top: 20px;
+        left: 20px;
         z-index: 1001;
-        padding: 10px;
+        padding: 12px;
         border-radius: 50%;
         box-shadow: var(--shadow);
     }
     .container {
-        margin: 20px auto 20px 300px;
+        margin: 30px auto 30px 330px;
         max-width: 1200px;
-        padding: 20px;
+        padding: 30px;
         transition: var(--transition);
     }
     .btn {
-        padding: 12px 24px;
+        padding: 14px 28px;
         background: var(--primary);
         color: white;
         border: none;
-        border-radius: 12px;
+        border-radius: 15px;
         cursor: pointer;
+        font-size: 1.1em;
         transition: var(--transition);
+        display: inline-block;
+        margin: 10px 0;
     }
     .btn:hover {
-        transform: scale(1.05);
+        transform: scale(1.08);
         background: #5439cc;
     }
     input, textarea {
         width: 100%;
-        padding: 12px;
-        margin: 10px 0;
+        padding: 14px;
+        margin: 15px 0;
         border: 2px solid rgba(0, 0, 0, 0.1);
-        border-radius: 12px;
+        border-radius: 15px;
         background: var(--glass-bg);
         color: var(--text-light);
+        font-size: 1.1em;
         transition: var(--transition);
     }
     body.dark input, body.dark textarea {
@@ -222,6 +224,7 @@ BASE_STYLE = '''
     input:focus, textarea:focus {
         outline: none;
         border-color: var(--primary);
+        background: rgba(255, 255, 255, 0.2);
     }
     .modal {
         display: none;
@@ -230,16 +233,16 @@ BASE_STYLE = '''
         left: 0;
         width: 100%;
         height: 100%;
-        background: rgba(0, 0, 0, 0.8);
+        background: rgba(0, 0, 0, 0.85);
         z-index: 2000;
         justify-content: center;
         align-items: center;
     }
     .modal img {
-        max-width: 90%;
-        max-height: 90%;
+        max-width: 95%;
+        max-height: 95%;
         object-fit: contain;
-        border-radius: 12px;
+        border-radius: 15px;
         box-shadow: var(--shadow);
     }
     .theme-toggle {
@@ -248,17 +251,17 @@ BASE_STYLE = '''
         right: 20px;
         background: var(--glass-bg);
         border: none;
-        padding: 10px;
+        padding: 12px;
         border-radius: 50%;
         cursor: pointer;
-        font-size: 20px;
+        font-size: 24px;
         box-shadow: var(--shadow);
         transition: var(--transition);
     }
     @media (max-width: 768px) {
         .sidebar {
             transform: translateX(-100%);
-            width: 260px;
+            width: 280px;
         }
         .sidebar.active {
             transform: translateX(0);
@@ -267,12 +270,16 @@ BASE_STYLE = '''
             display: block;
         }
         .container {
-            margin: 60px 10px 20px 10px;
-            max-width: calc(100% - 20px);
+            margin: 80px 15px 30px 15px;
+            max-width: calc(100% - 30px);
         }
         .theme-toggle {
-            top: 70px;
-            right: 20px;
+            top: 80px;
+            right: 15px;
+        }
+        .btn, input, textarea {
+            font-size: 1em;
+            padding: 12px;
         }
     }
 '''
@@ -280,7 +287,7 @@ BASE_STYLE = '''
 NAV_HTML = '''
     <aside class="sidebar" id="sidebar">
         <div class="sidebar-header">
-            <span class="nav-brand">OstenHost</span>
+            <span class="nav-brand">Контент Хост</span>
         </div>
         <nav class="nav-links">
             <a href="{{ url_for('feed') }}" class="nav-link"><span>📜</span> Лента</a>
@@ -326,21 +333,21 @@ def register():
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 500px;
+                max-width: 550px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 40px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 50px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
             }
             body.dark .container {
                 background: var(--card-bg-dark);
             }
             h1 {
-                font-size: 2em;
+                font-size: 2.2em;
                 font-weight: 600;
                 text-align: center;
-                margin-bottom: 20px;
+                margin-bottom: 30px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
@@ -348,13 +355,15 @@ def register():
             .flash {
                 color: var(--secondary);
                 text-align: center;
-                margin-bottom: 15px;
+                margin-bottom: 20px;
+                font-size: 1.1em;
                 font-weight: 500;
             }
             .link {
                 text-align: center;
-                margin-top: 20px;
+                margin-top: 25px;
                 color: var(--primary);
+                font-size: 1.1em;
                 text-decoration: none;
             }
             .link:hover {
@@ -427,21 +436,21 @@ def login():
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 500px;
+                max-width: 550px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 40px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 50px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
             }
             body.dark .container {
                 background: var(--card-bg-dark);
             }
             h1 {
-                font-size: 2em;
+                font-size: 2.2em;
                 font-weight: 600;
                 text-align: center;
-                margin-bottom: 20px;
+                margin-bottom: 30px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
@@ -449,13 +458,15 @@ def login():
             .flash {
                 color: var(--secondary);
                 text-align: center;
-                margin-bottom: 15px;
+                margin-bottom: 20px;
+                font-size: 1.1em;
                 font-weight: 500;
             }
             .link {
                 text-align: center;
-                margin-top: 20px;
+                margin-top: 25px;
                 color: var(--primary);
+                font-size: 1.1em;
                 text-decoration: none;
             }
             .link:hover {
@@ -529,37 +540,50 @@ def feed():
         <style>
             ''' + BASE_STYLE + '''
             h1 {
-                font-size: 2.5em;
-                font-weight: 600;
-                margin-bottom: 20px;
+                font-size: 2.8em;
+                font-weight: 700;
+                margin-bottom: 40px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
             }
             .search-container {
-                display: flex;
-                gap: 10px;
-                margin-bottom: 30px;
+                max-width: 600px;
+                margin: 0 auto 40px;
+                position: relative;
             }
             .search-input {
-                flex-grow: 1;
+                padding-right: 60px;
+                background: var(--card-bg-light);
+                border: none;
+                box-shadow: var(--shadow);
+            }
+            body.dark .search-input {
+                background: var(--card-bg-dark);
             }
             .search-btn {
-                padding: 12px 20px;
-                background: var(--secondary);
+                position: absolute;
+                right: 5px;
+                top: 50%;
+                transform: translateY(-50%);
+                background: var(--primary);
+                padding: 10px 20px;
+                border-radius: 12px;
+                font-size: 1em;
+                box-shadow: none;
             }
             .search-btn:hover {
-                background: #e63970;
+                background: #5439cc;
             }
             .post-grid {
                 display: grid;
-                grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-                gap: 25px;
+                grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
+                gap: 30px;
             }
             .post-item {
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 20px;
+                backdrop-filter: blur(20px);
+                padding: 25px;
                 border-radius: 20px;
                 box-shadow: var(--shadow);
                 transition: var(--transition);
@@ -571,19 +595,26 @@ def feed():
                 color: var(--text-dark);
             }
             .post-item:hover {
-                transform: translateY(-10px);
+                transform: translateY(-15px);
             }
             .post-preview {
                 width: 100%;
-                height: 220px;
+                height: 240px;
                 object-fit: cover;
-                border-radius: 12px;
-                cursor: pointer;
+                border-radius: 15px;
+                margin-bottom: 20px;
+            }
+            .post-item h2 {
+                font-size: 1.5em;
+                margin-bottom: 15px;
+            }
+            .post-item p {
+                margin-bottom: 15px;
+                font-size: 1.1em;
             }
             .stats {
-                font-size: 0.9em;
+                font-size: 1em;
                 color: rgba(0, 0, 0, 0.6);
-                margin-top: 10px;
             }
             body.dark .stats {
                 color: rgba(255, 255, 255, 0.6);
@@ -605,7 +636,7 @@ def feed():
         <div class="container">
             <h1>Лента публикаций</h1>
             <div class="search-container">
-                <form method="POST" style="display: flex; width: 100%;">
+                <form method="POST">
                     <input type="text" name="search" class="search-input" placeholder="Поиск по названию или описанию" value="{{ search_query }}">
                     <button type="submit" class="search-btn">Искать</button>
                 </form>
@@ -705,30 +736,35 @@ def post_page(post_id):
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 900px;
+                max-width: 950px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 40px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 50px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
             }
             body.dark .container {
                 background: var(--card-bg-dark);
             }
             h1 {
-                font-size: 2.2em;
-                font-weight: 600;
-                margin-bottom: 20px;
+                font-size: 2.5em;
+                font-weight: 700;
+                margin-bottom: 30px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
             }
             video, img {
                 width: 100%;
-                max-height: 450px;
+                max-height: 500px;
                 object-fit: cover;
-                border-radius: 12px;
+                border-radius: 15px;
                 box-shadow: var(--shadow);
+                margin-bottom: 30px;
+            }
+            p {
+                font-size: 1.2em;
+                margin-bottom: 20px;
             }
             .like-btn.liked {
                 background: var(--secondary);
@@ -737,13 +773,14 @@ def post_page(post_id):
                 background: #e63970;
             }
             .comment-section {
-                margin-top: 30px;
+                margin-top: 40px;
             }
             .comment {
                 background: var(--glass-bg);
-                padding: 15px;
-                border-radius: 12px;
-                margin-bottom: 15px;
+                padding: 20px;
+                border-radius: 15px;
+                margin-bottom: 20px;
+                font-size: 1.1em;
             }
             .username-link {
                 color: var(--primary);
@@ -778,11 +815,11 @@ def post_page(post_id):
                     </button>
                 </form>
                 <form method="POST" class="comment-section">
-                    <textarea name="comment" placeholder="Оставьте комментарий" rows="3"></textarea>
+                    <textarea name="comment" placeholder="Оставьте комментарий" rows="4"></textarea>
                     <button type="submit" class="btn">Отправить</button>
                 </form>
             {% endif %}
-            <h3>Комментарии</h3>
+            <h3 style="margin-top: 40px; font-size: 1.8em;">Комментарии</h3>
             {% for comment in post.get('comments', []) %}
                 <div class="comment">
                     <p><strong><a href="{{ url_for('user_profile', username=comment['user']) }}" class="username-link">{{ comment['user'] }}</a></strong> ({{ comment['date'] }}): {{ comment['text'] }}</p>
@@ -790,7 +827,7 @@ def post_page(post_id):
             {% endfor %}
             <a href="{{ url_for('feed') }}" class="btn">Назад к ленте</a>
             {% if not is_authenticated %}
-                <p><a href="{{ url_for('login') }}">Войдите</a>, чтобы ставить лайки и комментировать.</p>
+                <p style="margin-top: 20px;"><a href="{{ url_for('login') }}">Войдите</a>, чтобы ставить лайки и комментировать.</p>
             {% endif %}
         </div>
         <div class="modal" id="imageModal" onclick="closeModal(event)">
@@ -888,48 +925,50 @@ def profile():
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 900px;
+                max-width: 950px;
             }
             .profile-header {
                 display: flex;
                 align-items: center;
-                gap: 20px;
+                gap: 30px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 30px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 40px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
-                margin-bottom: 30px;
+                margin-bottom: 40px;
             }
             body.dark .profile-header {
                 background: var(--card-bg-dark);
             }
             .avatar {
-                width: 120px;
-                height: 120px;
+                width: 140px;
+                height: 140px;
                 border-radius: 50%;
                 object-fit: cover;
                 box-shadow: var(--shadow);
             }
             .profile-info h1 {
-                font-size: 2em;
-                font-weight: 600;
+                font-size: 2.5em;
+                font-weight: 700;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
+                margin-bottom: 20px;
             }
             .profile-info p {
-                margin: 5px 0;
+                font-size: 1.2em;
+                margin-bottom: 15px;
             }
             .post-grid {
                 display: grid;
-                grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-                gap: 25px;
+                grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
+                gap: 30px;
             }
             .post-item {
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 20px;
+                backdrop-filter: blur(20px);
+                padding: 25px;
                 border-radius: 20px;
                 box-shadow: var(--shadow);
                 transition: var(--transition);
@@ -938,13 +977,18 @@ def profile():
                 background: var(--card-bg-dark);
             }
             .post-item:hover {
-                transform: translateY(-10px);
+                transform: translateY(-15px);
             }
             .post-preview {
                 width: 100%;
-                height: 220px;
+                height: 240px;
                 object-fit: cover;
-                border-radius: 12px;
+                border-radius: 15px;
+                margin-bottom: 20px;
+            }
+            .post-item h3 {
+                font-size: 1.5em;
+                margin-bottom: 15px;
             }
             .delete-btn {
                 background: var(--secondary);
@@ -958,6 +1002,13 @@ def profile():
             .share-btn:hover {
                 background: #0d9f6e;
             }
+            h2 {
+                font-size: 2em;
+                margin: 40px 0 20px;
+                background: linear-gradient(45deg, var(--primary), var(--secondary));
+                -webkit-background-clip: text;
+                color: transparent;
+            }
         </style>
     </head>
     <body>
@@ -981,7 +1032,7 @@ def profile():
             </div>
             <h2>Редактировать профиль</h2>
             <form method="POST" enctype="multipart/form-data">
-                <textarea name="bio" placeholder="Описание профиля" rows="3">{{ bio }}</textarea>
+                <textarea name="bio" placeholder="Описание профиля" rows="4">{{ bio }}</textarea>
                 <input type="text" name="link" placeholder="Ссылка" value="{{ link }}">
                 <input type="file" name="avatar" accept="image/*">
                 <button type="submit" name="update_profile" class="btn">Сохранить</button>
@@ -1011,7 +1062,7 @@ def profile():
                     </div>
                     {% endfor %}
                 {% else %}
-                    <p>Вы пока не загрузили ни одной публикации.</p>
+                    <p style="font-size: 1.2em;">Вы пока не загрузили ни одной публикации.</p>
                 {% endif %}
             </div>
         </div>
@@ -1087,48 +1138,50 @@ def user_profile(username):
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 900px;
+                max-width: 950px;
             }
             .profile-header {
                 display: flex;
                 align-items: center;
-                gap: 20px;
+                gap: 30px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 30px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 40px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
-                margin-bottom: 30px;
+                margin-bottom: 40px;
             }
             body.dark .profile-header {
                 background: var(--card-bg-dark);
             }
             .avatar {
-                width: 120px;
-                height: 120px;
+                width: 140px;
+                height: 140px;
                 border-radius: 50%;
                 object-fit: cover;
                 box-shadow: var(--shadow);
             }
             .profile-info h1 {
-                font-size: 2em;
-                font-weight: 600;
+                font-size: 2.5em;
+                font-weight: 700;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
+                margin-bottom: 20px;
             }
             .profile-info p {
-                margin: 5px 0;
+                font-size: 1.2em;
+                margin-bottom: 15px;
             }
             .post-grid {
                 display: grid;
-                grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-                gap: 25px;
+                grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
+                gap: 30px;
             }
             .post-item {
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 20px;
+                backdrop-filter: blur(20px);
+                padding: 25px;
                 border-radius: 20px;
                 box-shadow: var(--shadow);
                 transition: var(--transition);
@@ -1137,13 +1190,18 @@ def user_profile(username):
                 background: var(--card-bg-dark);
             }
             .post-item:hover {
-                transform: translateY(-10px);
+                transform: translateY(-15px);
             }
             .post-preview {
                 width: 100%;
-                height: 220px;
+                height: 240px;
                 object-fit: cover;
-                border-radius: 12px;
+                border-radius: 15px;
+                margin-bottom: 20px;
+            }
+            .post-item h3 {
+                font-size: 1.5em;
+                margin-bottom: 15px;
             }
             .share-btn {
                 background: #10b981;
@@ -1151,6 +1209,13 @@ def user_profile(username):
             .share-btn:hover {
                 background: #0d9f6e;
             }
+            h2 {
+                font-size: 2em;
+                margin: 40px 0 20px;
+                background: linear-gradient(45deg, var(--primary), var(--secondary));
+                -webkit-background-clip: text;
+                color: transparent;
+            }
         </style>
     </head>
     <body>
@@ -1192,7 +1257,7 @@ def user_profile(username):
                     </div>
                     {% endfor %}
                 {% else %}
-                    <p>Этот пользователь пока не загрузил ни одной публикации.</p>
+                    <p style="font-size: 1.2em;">Этот пользователь пока не загрузил ни одной публикации.</p>
                 {% endif %}
             </div>
         </div>
@@ -1308,30 +1373,30 @@ def upload():
         <style>
             ''' + BASE_STYLE + '''
             .container {
-                max-width: 600px;
+                max-width: 650px;
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 40px;
-                border-radius: 20px;
+                backdrop-filter: blur(20px);
+                padding: 50px;
+                border-radius: 25px;
                 box-shadow: var(--shadow);
             }
             body.dark .container {
                 background: var(--card-bg-dark);
             }
             h1 {
-                font-size: 2em;
-                font-weight: 600;
+                font-size: 2.2em;
+                font-weight: 700;
                 text-align: center;
-                margin-bottom: 20px;
+                margin-bottom: 30px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
             }
             #progress-container {
-                margin-top: 15px;
-                height: 8px;
+                margin-top: 20px;
+                height: 10px;
                 background: rgba(0, 0, 0, 0.1);
-                border-radius: 4px;
+                border-radius: 5px;
                 overflow: hidden;
             }
             body.dark #progress-container {
@@ -1341,7 +1406,7 @@ def upload():
                 width: 0%;
                 height: 100%;
                 background: var(--primary);
-                transition: width 0.3s ease;
+                transition: width 0.4s ease;
             }
         </style>
     </head>
@@ -1353,7 +1418,7 @@ def upload():
             <h1>Загрузить контент</h1>
             <form id="upload-form" enctype="multipart/form-data">
                 <input type="text" name="title" placeholder="Название" required>
-                <textarea name="description" placeholder="Описание" rows="4"></textarea>
+                <textarea name="description" placeholder="Описание" rows="5"></textarea>
                 <input type="file" name="file" accept="video/*,image/*" required>
                 <button type="submit" class="btn">Загрузить</button>
             </form>
@@ -1429,37 +1494,50 @@ def admin_panel():
         <style>
             ''' + BASE_STYLE + '''
             h1 {
-                font-size: 2.5em;
-                font-weight: 600;
-                margin-bottom: 20px;
+                font-size: 2.8em;
+                font-weight: 700;
+                margin-bottom: 40px;
                 background: linear-gradient(45deg, var(--primary), var(--secondary));
                 -webkit-background-clip: text;
                 color: transparent;
             }
             .search-container {
-                display: flex;
-                gap: 10px;
-                margin-bottom: 30px;
+                max-width: 600px;
+                margin: 0 auto 40px;
+                position: relative;
             }
             .search-input {
-                flex-grow: 1;
+                padding-right: 60px;
+                background: var(--card-bg-light);
+                border: none;
+                box-shadow: var(--shadow);
+            }
+            body.dark .search-input {
+                background: var(--card-bg-dark);
             }
             .search-btn {
-                padding: 12px 20px;
-                background: var(--secondary);
+                position: absolute;
+                right: 5px;
+                top: 50%;
+                transform: translateY(-50%);
+                background: var(--primary);
+                padding: 10px 20px;
+                border-radius: 12px;
+                font-size: 1em;
+                box-shadow: none;
             }
             .search-btn:hover {
-                background: #e63970;
+                background: #5439cc;
             }
             .post-grid {
                 display: grid;
-                grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-                gap: 25px;
+                grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
+                gap: 30px;
             }
             .post-item {
                 background: var(--card-bg-light);
-                backdrop-filter: blur(15px);
-                padding: 20px;
+                backdrop-filter: blur(20px);
+                padding: 25px;
                 border-radius: 20px;
                 box-shadow: var(--shadow);
                 transition: var(--transition);
@@ -1468,13 +1546,22 @@ def admin_panel():
                 background: var(--card-bg-dark);
             }
             .post-item:hover {
-                transform: translateY(-10px);
+                transform: translateY(-15px);
             }
             .post-preview {
                 width: 100%;
-                height: 220px;
+                height: 240px;
                 object-fit: cover;
-                border-radius: 12px;
+                border-radius: 15px;
+                margin-bottom: 20px;
+            }
+            .post-item h2 {
+                font-size: 1.5em;
+                margin-bottom: 15px;
+            }
+            .post-item p {
+                margin-bottom: 15px;
+                font-size: 1.1em;
             }
             .delete-btn {
                 background: var(--secondary);
@@ -1499,7 +1586,7 @@ def admin_panel():
         <div class="container">
             <h1>Админ-панель: Все посты</h1>
             <div class="search-container">
-                <form method="POST" style="display: flex; width: 100%;">
+                <form method="POST">
                     <input type="text" name="search" class="search-input" placeholder="Поиск по названию или описанию" value="{{ search_query }}">
                     <button type="submit" class="search-btn">Искать</button>
                 </form>
@@ -1527,7 +1614,7 @@ def admin_panel():
                     </div>
                     {% endfor %}
                 {% else %}
-                    <p>Посты не найдены.</p>
+                    <p style="font-size: 1.2em;">Посты не найдены.</p>
                 {% endif %}
             </div>
         </div>